@roomstay/frontend 2.6.53 → 2.6.55

package/dist/src/components/generic/date/FloatingDatePicker.d.ts

@@ -7,5 +7,6 @@ export interface FloatingDatePickerProps {
     selectedDateChanged?: (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => void;
     className?: string;
     isAboveNav?: boolean;
+    onDatePickerOpenChange?: (isOpen: boolean) => void;
 }
 export default function FloatingDatePicker(props: FloatingDatePickerProps): JSX.Element;

package/dist/src/components/generic/date/FloatingDatePicker.js

@@ -54,6 +54,14 @@ function FloatingDatePicker(props) {
     const onOverlayOpen = () => {
         setIsOpen(true);
     };
+    (0, react_1.useEffect)(() => {
+        var _a;
+        (_a = props === null || props === void 0 ? void 0 : props.onDatePickerOpenChange) === null || _a === void 0 ? void 0 : _a.call(props, isOpen);
+        return () => {
+            var _a;
+            (_a = props === null || props === void 0 ? void 0 : props.onDatePickerOpenChange) === null || _a === void 0 ? void 0 : _a.call(props, false);
+        };
+    }, [isOpen]);
     const inner = (react_1.default.createElement("div", { className: "d-flex align-items-center flex-column" },
         react_1.default.createElement(DatePicker_1.default, { showMonthOnLoad: props.startDate, showMultipleMonths: false, supportsMultiSelecting: true, onStartDateChanged: onStartDateChangedHandler, onEndDateChanged: selectedDateChanged, showMinNightStay: true, supportsWeek: false, selectedStartDate: props.startDate, selectedEndDate: props.endDate })));
     return (react_1.default.createElement(react_1.default.Fragment, null,

package/dist/src/components/generic/date/FloatingDatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingDatePicker.js","sourceRoot":"/","sources":["src/components/generic/date/FloatingDatePicker.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,+CAAgD;AAEhD,sFAA8D;AAC9D,kEAA+D;AAC/D,8DAA+E;AAa/E,SAAwB,kBAAkB,CAAC,KAA8B;;IACrE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAqB,IAAI,CAAC,CAAC;IAErE,MAAM,WAAW,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAEjD,MAAM,mBAAmB,GAAG,CAAC,OAAoB,EAAE,cAAiG,EAAE,EAAE;QACpJ,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,gBAAgB,EAAE,2BAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QAEtG,IAAI,KAAK,CAAC,mBAAmB,IAAI,SAAS,EAAE;YACxC,KAAK,CAAC,mBAAmB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;SACjD;QAED,IAAI,OAAO,EAAE;YACT,SAAS,CAAC,CAAC,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,sBAAsB,CAAA,IAAI,CAAC,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,sBAAsB,CAAA,CAAC,CAAC,CAAC,sCAAsC;SAC1I;IACL,CAAC,CAAC;IAEF,MAAM,yBAAyB,GAAG,CAAC,IAAS,EAAE,EAAE;QAC5C,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,eAAe,EAAE,2BAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QACrG,YAAY,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,GAAG,EAAE;QACxB,SAAS,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,SAAS,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,CAAC;IAEF,MAAM,KAAK,GAAG,CACV,uCAAK,SAAS,EAAC,uCAAuC;QAClD,8BAAC,oBAAU,IACP,eAAe,EAAE,KAAK,CAAC,SAAS,EAChC,kBAAkB,EAAE,KAAK,EACzB,sBAAsB,QACtB,kBAAkB,EAAE,yBAAyB,EAC7C,gBAAgB,EAAE,mBAAmB,EACrC,gBAAgB,QAChB,YAAY,EAAE,KAAK,EACnB,iBAAiB,EAAE,KAAK,CAAC,SAAS,EAClC,eAAe,EAAE,KAAK,CAAC,OAAO,GAChC,CACA,CACT,CAAC;IAEF,OAAO,CACH;QACI,uCAAK,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,EAAE,aAAa,IACpE,KAAK,CAAC,QAAQ,CACb;QACN,8BAAC,iBAAO,IACJ,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,cAAc,EACvB,SAAS,EAAE,MAAA,MAAA,WAAW,CAAC,OAAO,0CAAE,aAAa,0CAAE,aAAa,EAC5D,aAAa,EAAE,WAAW,CAAC,OAAO,EAClC,SAAS,EAAC,4BAA4B,EACtC,UAAU,EAAE,KAAK,CAAC,UAAU,IAE3B,KAAK,CACA,CACX,CACN,CAAC;AACN,CAAC;AAjED,qCAiEC","sourcesContent":["import dayjs from 'dayjs';\nimport React, { useRef, useState } from 'react';\n\nimport DatePicker from '@/components/generic/date/DatePicker';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\nimport DataLayer, { InteractionStep, InteractionType } from '@/util/DataLayer';\n\nexport interface FloatingDatePickerProps {\n    children?: React.ReactNode;\n    startDate?: dayjs.Dayjs;\n    endDate?: dayjs.Dayjs;\n\n    selectedDateChanged?: (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => void;\n\n    className?: string;\n    isAboveNav?: boolean;\n}\n\nexport default function FloatingDatePicker(props: FloatingDatePickerProps) {\n    const [isOpen, setIsOpen] = useState(false);\n\n    const [startDate, setStartDate] = useState<dayjs.Dayjs | null>(null);\n\n    const thisElement = useRef<HTMLDivElement>(null);\n\n    const selectedDateChanged = (endDate: dayjs.Dayjs, selectionState?: { validationMinNightStay: number | null; validationMaxNightStay: number | null }) => {\n        DataLayer.instance.sendInteraction('Check Out Date', InteractionType.CALENDAR, InteractionStep.ROOMS);\n\n        if (props.selectedDateChanged && startDate) {\n            props.selectedDateChanged(startDate, endDate);\n        }\n\n        if (endDate) {\n            setIsOpen(!!selectionState?.validationMinNightStay || !!selectionState?.validationMaxNightStay); //Close popup after selecting end date\n        }\n    };\n\n    const onStartDateChangedHandler = (date: any) => {\n        DataLayer.instance.sendInteraction('Check In Date', InteractionType.CALENDAR, InteractionStep.ROOMS);\n        setStartDate(date);\n    };\n\n    const onOverlayClose = () => {\n        setIsOpen(false);\n    };\n\n    const onOverlayOpen = () => {\n        setIsOpen(true);\n    };\n\n    const inner = (\n        <div className=\"d-flex align-items-center flex-column\">\n            <DatePicker\n                showMonthOnLoad={props.startDate}\n                showMultipleMonths={false}\n                supportsMultiSelecting\n                onStartDateChanged={onStartDateChangedHandler}\n                onEndDateChanged={selectedDateChanged}\n                showMinNightStay\n                supportsWeek={false}\n                selectedStartDate={props.startDate}\n                selectedEndDate={props.endDate}\n            />\n        </div>\n    );\n\n    return (\n        <>\n            <div ref={thisElement} className={props.className} onClick={onOverlayOpen}>\n                {props.children}\n            </div>\n            <Overlay\n                open={isOpen}\n                onClose={onOverlayClose}\n                container={thisElement.current?.parentElement?.parentElement}\n                followElement={thisElement.current}\n                className=\"floating-roomstay-calendar\"\n                isAboveNav={props.isAboveNav}\n            >\n                {inner}\n            </Overlay>\n        </>\n    );\n}\n"]}
+{"version":3,"file":"FloatingDatePicker.js","sourceRoot":"/","sources":["src/components/generic/date/FloatingDatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import dayjs from 'dayjs';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport DatePicker from '@/components/generic/date/DatePicker';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\nimport DataLayer, { InteractionStep, InteractionType } from '@/util/DataLayer';\n\nexport interface FloatingDatePickerProps {\n    children?: React.ReactNode;\n    startDate?: dayjs.Dayjs;\n    endDate?: dayjs.Dayjs;\n\n    selectedDateChanged?: (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => void;\n\n    className?: string;\n    isAboveNav?: boolean;\n    onDatePickerOpenChange?: (isOpen: boolean) => void;\n}\n\nexport default function FloatingDatePicker(props: FloatingDatePickerProps) {\n    const [isOpen, setIsOpen] = useState(false);\n\n    const [startDate, setStartDate] = useState<dayjs.Dayjs | null>(null);\n\n    const thisElement = useRef<HTMLDivElement>(null);\n\n    const selectedDateChanged = (endDate: dayjs.Dayjs, selectionState?: { validationMinNightStay: number | null; validationMaxNightStay: number | null }) => {\n        DataLayer.instance.sendInteraction('Check Out Date', InteractionType.CALENDAR, InteractionStep.ROOMS);\n\n        if (props.selectedDateChanged && startDate) {\n            props.selectedDateChanged(startDate, endDate);\n        }\n\n        if (endDate) {\n            setIsOpen(!!selectionState?.validationMinNightStay || !!selectionState?.validationMaxNightStay); //Close popup after selecting end date\n        }\n    };\n\n    const onStartDateChangedHandler = (date: any) => {\n        DataLayer.instance.sendInteraction('Check In Date', InteractionType.CALENDAR, InteractionStep.ROOMS);\n        setStartDate(date);\n    };\n\n    const onOverlayClose = () => {\n        setIsOpen(false);\n    };\n\n    const onOverlayOpen = () => {\n        setIsOpen(true);\n    };\n\n    useEffect(() => {\n        props?.onDatePickerOpenChange?.(isOpen);\n        return () => {\n            props?.onDatePickerOpenChange?.(false);\n        };\n    }, [isOpen]);\n\n    const inner = (\n        <div className=\"d-flex align-items-center flex-column\">\n            <DatePicker\n                showMonthOnLoad={props.startDate}\n                showMultipleMonths={false}\n                supportsMultiSelecting\n                onStartDateChanged={onStartDateChangedHandler}\n                onEndDateChanged={selectedDateChanged}\n                showMinNightStay\n                supportsWeek={false}\n                selectedStartDate={props.startDate}\n                selectedEndDate={props.endDate}\n            />\n        </div>\n    );\n\n    return (\n        <>\n            <div ref={thisElement} className={props.className} onClick={onOverlayOpen}>\n                {props.children}\n            </div>\n            <Overlay\n                open={isOpen}\n                onClose={onOverlayClose}\n                container={thisElement.current?.parentElement?.parentElement}\n                followElement={thisElement.current}\n                className=\"floating-roomstay-calendar\"\n                isAboveNav={props.isAboveNav}\n            >\n                {inner}\n            </Overlay>\n        </>\n    );\n}\n"]}

package/dist/src/components/steps/addons/AddonCard.js

@@ -129,12 +129,12 @@ const AddonCard = ({ addon, className }) => {
         },
         {
             name: Translation_1.Translation.Step.Date.Adult_plural,
-            enabled: priceInfo === null || priceInfo === void 0 ? void 0 : priceInfo.adultPrice,
+            enabled: (priceInfo === null || priceInfo === void 0 ? void 0 : priceInfo.adultPrice) && addon.pricingType !== Addon_1.AddonPricingType.PER_ALL_PERSONS && addon.pricingType !== Addon_1.AddonPricingType.PER_ALL_PERSONS_PER_NIGHT,
             element: react_1.default.createElement(NumberIncrement_1.default, { number: adultQuantity, min: 0, max: priceInfo.quantity - childQuantity, onChange: setAdultsQuantityOnChange }),
         },
         {
             name: Translation_1.Translation.Step.Date.Child_plural,
-            enabled: priceInfo === null || priceInfo === void 0 ? void 0 : priceInfo.childPrice,
+            enabled: (priceInfo === null || priceInfo === void 0 ? void 0 : priceInfo.childPrice) && addon.pricingType !== Addon_1.AddonPricingType.PER_ALL_PERSONS && addon.pricingType !== Addon_1.AddonPricingType.PER_ALL_PERSONS_PER_NIGHT,
             element: react_1.default.createElement(NumberIncrement_1.default, { number: childQuantity, min: 0, max: priceInfo.quantity - adultQuantity, onChange: setChildQuantityOnChange }),
         },
     ];
@@ -198,15 +198,21 @@ const AddonCard = ({ addon, className }) => {
                                     react_1.default.createElement(Headline_1.default, { size: "large", bold: true, lineHeight: "1em" },
                                         react_1.default.createElement(Currency_1.default, null, priceInfo.adultPrice)),
                                     react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey, inline: true, className: "u-marg-left--light u-clear-font-weight" },
-                                        "/ ",
-                                        t(Translation_1.Translation.Step.Date.Adult)))),
+                                        "/",
+                                        ' ',
+                                        addon.pricingType === Addon_1.AddonPricingType.PER_ALL_PERSONS_PER_NIGHT
+                                            ? t(Translation_1.Translation.Misc.AdultPerNight)
+                                            : t(Translation_1.Translation.Step.Date.Adult)))),
                                 !!priceInfo.adultPrice && !!priceInfo.childPrice && react_1.default.createElement("br", null),
                                 !!priceInfo.childPrice && (react_1.default.createElement("div", { className: "d-flex align-items-end flex-row" },
                                     react_1.default.createElement(Headline_1.default, { size: "large", bold: true, lineHeight: "1em" },
                                         react_1.default.createElement(Currency_1.default, null, priceInfo.childPrice)),
                                     react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey, inline: true, className: "u-marg-left--light u-clear-font-weight" },
-                                        "/ ",
-                                        t(Translation_1.Translation.Step.Date.Child))))))),
+                                        "/",
+                                        ' ',
+                                        addon.pricingType === Addon_1.AddonPricingType.PER_ALL_PERSONS_PER_NIGHT
+                                            ? t(Translation_1.Translation.Misc.ChildPerNight)
+                                            : t(Translation_1.Translation.Step.Date.Child))))))),
                         react_1.default.createElement("div", { className: "u-marg-bottom--light" },
                             react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey, inline: true, className: "u-nowrap" }, (hotel === null || hotel === void 0 ? void 0 : hotel.enableCreditCardSurcharge) ? t(Translation_1.Translation.Step.Addon.ExcludingFees) : t(Translation_1.Translation.Step.Addon.IncludingFeesAndTaxes)))),
                     react_1.default.createElement("div", { className: "u-marg-top--light u-flex justify-content-end u-w-100@l- flex-column flex-lg-row" },

package/dist/src/components/steps/addons/AddonCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddonCard.js","sourceRoot":"/","sources":["src/components/steps/addons/AddonCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport Check from 'icons/Check';\nimport React, { useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport NumberIncrement from '@/components/generic/NumberIncrement';\nimport { IDefaultSelectOption, Select } from '@/components/generic/Select/Select';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Addon, AddonPricingType, PriceInfo } from '@/models/Addon/Addon';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\n\ninterface Props {\n    addon: Addon;\n    className?: string;\n}\n\nconst AddonCard = ({ addon, className }: Props) => {\n    const { t } = useTranslation();\n\n    const { hotel } = useCurrentHotel();\n    const basketContext = React.useContext(BasketContext);\n\n    const addonBasketRow = basketContext.getRowForAddon(addon);\n\n    const [quantity, setQuantity] = useState(1);\n    const [adultQuantity, setAdultQuantity] = useState(addonBasketRow ? addonBasketRow.getAdultQuantity() : 1);\n    const [childQuantity, setChildQuantity] = useState(addonBasketRow ? addonBasketRow.getChildQuantity() : 0);\n\n    const [priceInfo, setPriceInfo] = useState<PriceInfo>({ quantity: 1 });\n\n    const [selectedDate, setSelectedDate] = useState(addonBasketRow ? addonBasketRow.getSelectedDate() : '');\n    const [selectedTime, setSelectedTime] = useState(addonBasketRow ? addonBasketRow.getSelectedTime() : '');\n\n    useEffect(() => {\n        if (addonBasketRow) {\n            setPriceInfo(addon.availability[addonBasketRow.getSelectedDate()] ?? addon.availability[addon.firstDate as string]);\n            setSelectedDate(addonBasketRow.getSelectedDate() ?? addon.firstDate);\n            setSelectedTime(addonBasketRow.getSelectedTime() ?? '');\n            setQuantity(addonBasketRow.getQuantity());\n            setAdultQuantity(addonBasketRow.getAdultQuantity());\n            setChildQuantity(addonBasketRow.getChildQuantity());\n        } else {\n            setPriceInfo(addon.availability[addon.firstDate as string] ?? ([] as any));\n            setSelectedDate(addon.firstDate as string);\n            setSelectedTime(addon.availability[addon.firstDate as string]?.selectorTimes?.[0]?.value || '');\n        }\n    }, []);\n\n    const setDate = (date: any) => {\n        setPriceInfo(addon.availability[date]);\n        setSelectedDate(date);\n        setSelectedTime(addon.availability[date]?.selectorTimes?.[0]?.value || '');\n        if (addon.availability[date].quantity < quantity) {\n            setQuantity(addon.availability[date].quantity);\n        }\n    };\n\n    const onClickAddToCartHandler = () => {\n        basketContext.setAddonQuantities(\n            addon,\n            {\n                quantity,\n                adult: adultQuantity,\n                child: childQuantity,\n            },\n            selectedDate,\n            selectedTime\n        );\n    };\n\n    const classes = classNames({\n        '--active': !!basketContext.getRowForAddon(addon),\n    });\n\n    const onClickRemove = () => {\n        const selectedAddon = basketContext.basketAddonRows.find((row) => {\n            return row.getAddon().code === addon.code;\n        });\n        if (selectedAddon) basketContext.removeBasketAddonRow(selectedAddon);\n    };\n\n    const setQuantityOnChange = (val: any) => {\n        setQuantity(val);\n    };\n    const setAdultsQuantityOnChange = (val: any) => {\n        setAdultQuantity(val);\n    };\n    const setChildQuantityOnChange = (val: any) => {\n        setChildQuantity(val);\n    };\n    const setDateOnChange = (selected: string) => {\n        setDate(selected);\n    };\n    const setSelectedTimeOnChange = (selected: any) => {\n        setSelectedTime(selected);\n    };\n\n    const addonConfigurations = [\n        {\n            name: 'Date',\n            enabled: (addonBasketRow?.getNumberOfAvailableNights?.() as number) > 1 && !addonBasketRow?.getAddon().hideDatePicker,\n            element: (\n                <Select<IDefaultSelectOption, 'value'>\n                    nativeOnMobile\n                    options={addon.selectorDates}\n                    value={selectedDate}\n                    onChange={setDateOnChange}\n                    keyName=\"value\"\n                    labelName=\"text\"\n                    className=\"u-flex align-items-center\"\n                />\n            ),\n        },\n        {\n            name: 'Time',\n            enabled: priceInfo?.selectorTimes?.length !== 0,\n            element: (\n                <Select<IDefaultSelectOption, 'value'>\n                    nativeOnMobile\n                    options={priceInfo?.selectorTimes || []}\n                    value={selectedTime}\n                    onChange={setSelectedTimeOnChange}\n                    keyName=\"value\"\n                    labelName=\"text\"\n                    className=\"u-flex align-items-center\"\n                />\n            ),\n        },\n        {\n            name: Translation.Step.Addon.Quantity,\n            enabled: priceInfo?.price && priceInfo?.quantity > 1,\n            element: <NumberIncrement number={quantity} min={1} max={priceInfo.quantity} onChange={setQuantityOnChange} />,\n        },\n        {\n            name: Translation.Step.Date.Adult_plural,\n            enabled: priceInfo?.adultPrice,\n            element: <NumberIncrement number={adultQuantity} min={0} max={priceInfo.quantity - childQuantity} onChange={setAdultsQuantityOnChange} />,\n        },\n        {\n            name: Translation.Step.Date.Child_plural,\n            enabled: priceInfo?.childPrice,\n            element: <NumberIncrement number={childQuantity} min={0} max={priceInfo.quantity - adultQuantity} onChange={setChildQuantityOnChange} />,\n        },\n    ];\n\n    const pricingTypeSuffix = (() => {\n        switch (addon.pricingType) {\n            case AddonPricingType.PER_STAY:\n                return t(Translation.Misc.QTY);\n            case AddonPricingType.PER_PERSON:\n                return t(Translation.Misc.Person);\n            case AddonPricingType.PER_PERSON_OCCUPANCY_PER_NIGHT:\n            case AddonPricingType.PER_PERSON_PER_NIGHT:\n                return t(Translation.Misc.PersonPerNight);\n            case AddonPricingType.PER_ADULT_OCCUPANCY_PER_NIGHT:\n            case AddonPricingType.PER_CHILD_OCCUPANCY_PER_NIGHT:\n                return t(Translation.Misc.AdultPerNight);\n            case AddonPricingType.PER_NIGHT:\n            case AddonPricingType.PER_QUANTITY_NAME_PER_NIGHT:\n                return t(Translation.Misc.Night);\n            case AddonPricingType.PER_ROOM_QUANTITY_PER_NIGHT:\n                return t(Translation.Misc.PerRoomDay);\n        }\n    })();\n\n    const addonCardImageStyle: any = {};\n    if (addon.image) {\n        addonCardImageStyle.backgroundImage = `url('${ImageProvider.resizeImage(addon.image, ImageSize.Original)}')`;\n    } else {\n        addonCardImageStyle.backgroundImage = `url('${hotel?.logo && ImageProvider.resizeImage(hotel?.logo as string, ImageSize.Original)}')`;\n        addonCardImageStyle.backgroundSize = '50%';\n        addonCardImageStyle.backgroundRepeat = 'no-repeat';\n    }\n\n    return (\n        <div className={classNames('u-flex u-flex-flex-start u-rounded addon-card-wrapper', className, classes)} style={{ backgroundColor: Color.White }}>\n            <div className=\"addon-card-image\" style={addonCardImageStyle} />\n            <div className=\"u-marg-heavy u-marg@m- u-w-100@xl\">\n                <div className=\"u-flex\">\n                    <Headline bold>{addon.name}</Headline>\n                    {addonBasketRow ? <Check /> : <></>}\n                </div>\n                <Text color={Color.DarkGrey} type={TextType.Small}>\n                    {addon.description}\n                </Text>\n                <div className=\"addon-card-wrapper--price u-flex u-flex-align-flex-end\">\n                    <div className=\"u-w-100\">\n                        {addonConfigurations.map((input) => {\n                            if (!input.enabled) {\n                                return;\n                            }\n\n                            return (\n                                <div key={input.name} className=\"u-flex justify-content-start u-marg-bot u-marg-top\">\n                                    <Text className=\"u-mw-100\" bold>\n                                        {t(input.name)}\n                                    </Text>\n                                    {input.element}\n                                </div>\n                            );\n                        })}\n\n                        {/* {addon.guaranteeDescription && (\n                            <>\n                                <h4 className=\"u-marg-bottom--light u-marg-top\">Guarantee</h4>\n                                <div className=\"u-marg-bot--heavy\">\n                                    <Text type={TextType.Small}>{addon.guaranteeDescription}</Text>\n                                </div>\n                            </>\n                        )}\n                        {addon.cancelPenalty && (\n                            <>\n                                <h4 className=\"u-marg-bottom--light u-marg-top\">Cancellation Policy</h4>\n                                <div className=\"u-marg-bot--heavy\">\n                                    <Text type={TextType.Small}>{addon.cancelPenalty}</Text>\n                                </div>\n                            </>\n                        )} */}\n                    </div>\n                    <div className=\"addon-card-wrapper--price-action\">\n                        <div className=\"u-flex u-flex-direction-column u-flex-align-flex-end\" style={{ alignSelf: 'flex-end' }}>\n                            <Text type={TextType.Small} color={Color.Navy} inline>\n                                {t(Translation.Misc.From)}\n                            </Text>\n                            <div className=\"room-details--content-price flex-align-items-baseline flex-row\">\n                                {priceInfo?.price && (\n                                    <>\n                                        <div className=\"u-flex align-items-end\">\n                                            <Headline size=\"large\" bold lineHeight=\"1em\">\n                                                <Currency hideDecimals>{priceInfo.price}</Currency>\n                                            </Headline>\n                                            <Text type={TextType.Small} color={Color.DarkGrey} inline className=\"u-marg-left--light u-clear-font-weight\">\n                                                / {pricingTypeSuffix}\n                                            </Text>\n                                        </div>\n                                    </>\n                                )}\n                                {(!!priceInfo?.adultPrice || !!priceInfo?.childPrice) && (\n                                    <h2 className=\"u-marg-none d-flex flex-wrap justify-content-end\">\n                                        {!!priceInfo.adultPrice && (\n                                            <div className=\"d-flex align-items-end flex-row\">\n                                                <Headline size=\"large\" bold lineHeight=\"1em\">\n                                                    <Currency>{priceInfo.adultPrice}</Currency>\n                                                </Headline>\n                                                <Text type={TextType.Small} color={Color.DarkGrey} inline className=\"u-marg-left--light u-clear-font-weight\">\n                                                    / {t(Translation.Step.Date.Adult)}\n                                                </Text>\n                                            </div>\n                                        )}\n                                        {!!priceInfo.adultPrice && !!priceInfo.childPrice && <br />}\n                                        {!!priceInfo.childPrice && (\n                                            <div className=\"d-flex align-items-end flex-row\">\n                                                <Headline size=\"large\" bold lineHeight=\"1em\">\n                                                    <Currency>{priceInfo.childPrice}</Currency>\n                                                </Headline>\n                                                <Text type={TextType.Small} color={Color.DarkGrey} inline className=\"u-marg-left--light u-clear-font-weight\">\n                                                    / {t(Translation.Step.Date.Child)}\n                                                </Text>\n                                            </div>\n                                        )}\n                                    </h2>\n                                )}\n                            </div>\n                            <div className=\"u-marg-bottom--light\">\n                                <Text type={TextType.Small} color={Color.Grey} inline className=\"u-nowrap\">\n                                    {hotel?.enableCreditCardSurcharge ? t(Translation.Step.Addon.ExcludingFees) : t(Translation.Step.Addon.IncludingFeesAndTaxes)}\n                                </Text>\n                            </div>\n                        </div>\n                        <div className=\"u-marg-top--light u-flex justify-content-end u-w-100@l- flex-column flex-lg-row\">\n                            {addonBasketRow ? (\n                                <div className=\"u-marg-right--light@l u-marg-bottom--light@l-\">\n                                    <BEButton onClick={onClickRemove} textColor={Color.White} backgroundColor={Color.Navy} wide>\n                                        {t(Translation.Step.Addon.Remove)}\n                                    </BEButton>\n                                </div>\n                            ) : (\n                                <></>\n                            )}\n                            <BEButton onClick={onClickAddToCartHandler} primary filled wide>\n                                {addonBasketRow ? t(Translation.Step.Addon.UpdateCart) : t(Translation.Step.Addon.AddToCart)}\n                            </BEButton>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default AddonCard;\n"]}
+{"version":3,"file":"AddonCard.js","sourceRoot":"/","sources":["src/components/steps/addons/AddonCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport Check from 'icons/Check';\nimport React, { useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport NumberIncrement from '@/components/generic/NumberIncrement';\nimport { IDefaultSelectOption, Select } from '@/components/generic/Select/Select';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Addon, AddonPricingType, PriceInfo } from '@/models/Addon/Addon';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\n\ninterface Props {\n    addon: Addon;\n    className?: string;\n}\n\nconst AddonCard = ({ addon, className }: Props) => {\n    const { t } = useTranslation();\n\n    const { hotel } = useCurrentHotel();\n    const basketContext = React.useContext(BasketContext);\n\n    const addonBasketRow = basketContext.getRowForAddon(addon);\n\n    const [quantity, setQuantity] = useState(1);\n    const [adultQuantity, setAdultQuantity] = useState(addonBasketRow ? addonBasketRow.getAdultQuantity() : 1);\n    const [childQuantity, setChildQuantity] = useState(addonBasketRow ? addonBasketRow.getChildQuantity() : 0);\n\n    const [priceInfo, setPriceInfo] = useState<PriceInfo>({ quantity: 1 });\n\n    const [selectedDate, setSelectedDate] = useState(addonBasketRow ? addonBasketRow.getSelectedDate() : '');\n    const [selectedTime, setSelectedTime] = useState(addonBasketRow ? addonBasketRow.getSelectedTime() : '');\n\n    useEffect(() => {\n        if (addonBasketRow) {\n            setPriceInfo(addon.availability[addonBasketRow.getSelectedDate()] ?? addon.availability[addon.firstDate as string]);\n            setSelectedDate(addonBasketRow.getSelectedDate() ?? addon.firstDate);\n            setSelectedTime(addonBasketRow.getSelectedTime() ?? '');\n            setQuantity(addonBasketRow.getQuantity());\n            setAdultQuantity(addonBasketRow.getAdultQuantity());\n            setChildQuantity(addonBasketRow.getChildQuantity());\n        } else {\n            setPriceInfo(addon.availability[addon.firstDate as string] ?? ([] as any));\n            setSelectedDate(addon.firstDate as string);\n            setSelectedTime(addon.availability[addon.firstDate as string]?.selectorTimes?.[0]?.value || '');\n        }\n    }, []);\n\n    const setDate = (date: any) => {\n        setPriceInfo(addon.availability[date]);\n        setSelectedDate(date);\n        setSelectedTime(addon.availability[date]?.selectorTimes?.[0]?.value || '');\n        if (addon.availability[date].quantity < quantity) {\n            setQuantity(addon.availability[date].quantity);\n        }\n    };\n\n    const onClickAddToCartHandler = () => {\n        basketContext.setAddonQuantities(\n            addon,\n            {\n                quantity,\n                adult: adultQuantity,\n                child: childQuantity,\n            },\n            selectedDate,\n            selectedTime\n        );\n    };\n\n    const classes = classNames({\n        '--active': !!basketContext.getRowForAddon(addon),\n    });\n\n    const onClickRemove = () => {\n        const selectedAddon = basketContext.basketAddonRows.find((row) => {\n            return row.getAddon().code === addon.code;\n        });\n        if (selectedAddon) basketContext.removeBasketAddonRow(selectedAddon);\n    };\n\n    const setQuantityOnChange = (val: any) => {\n        setQuantity(val);\n    };\n    const setAdultsQuantityOnChange = (val: any) => {\n        setAdultQuantity(val);\n    };\n    const setChildQuantityOnChange = (val: any) => {\n        setChildQuantity(val);\n    };\n    const setDateOnChange = (selected: string) => {\n        setDate(selected);\n    };\n    const setSelectedTimeOnChange = (selected: any) => {\n        setSelectedTime(selected);\n    };\n\n    const addonConfigurations = [\n        {\n            name: 'Date',\n            enabled: (addonBasketRow?.getNumberOfAvailableNights?.() as number) > 1 && !addonBasketRow?.getAddon().hideDatePicker,\n            element: (\n                <Select<IDefaultSelectOption, 'value'>\n                    nativeOnMobile\n                    options={addon.selectorDates}\n                    value={selectedDate}\n                    onChange={setDateOnChange}\n                    keyName=\"value\"\n                    labelName=\"text\"\n                    className=\"u-flex align-items-center\"\n                />\n            ),\n        },\n        {\n            name: 'Time',\n            enabled: priceInfo?.selectorTimes?.length !== 0,\n            element: (\n                <Select<IDefaultSelectOption, 'value'>\n                    nativeOnMobile\n                    options={priceInfo?.selectorTimes || []}\n                    value={selectedTime}\n                    onChange={setSelectedTimeOnChange}\n                    keyName=\"value\"\n                    labelName=\"text\"\n                    className=\"u-flex align-items-center\"\n                />\n            ),\n        },\n        {\n            name: Translation.Step.Addon.Quantity,\n            enabled: priceInfo?.price && priceInfo?.quantity > 1,\n            element: <NumberIncrement number={quantity} min={1} max={priceInfo.quantity} onChange={setQuantityOnChange} />,\n        },\n        {\n            name: Translation.Step.Date.Adult_plural,\n            enabled: priceInfo?.adultPrice && addon.pricingType !== AddonPricingType.PER_ALL_PERSONS && addon.pricingType !== AddonPricingType.PER_ALL_PERSONS_PER_NIGHT,\n            element: <NumberIncrement number={adultQuantity} min={0} max={priceInfo.quantity - childQuantity} onChange={setAdultsQuantityOnChange} />,\n        },\n        {\n            name: Translation.Step.Date.Child_plural,\n            enabled: priceInfo?.childPrice && addon.pricingType !== AddonPricingType.PER_ALL_PERSONS && addon.pricingType !== AddonPricingType.PER_ALL_PERSONS_PER_NIGHT,\n            element: <NumberIncrement number={childQuantity} min={0} max={priceInfo.quantity - adultQuantity} onChange={setChildQuantityOnChange} />,\n        },\n    ];\n\n    const pricingTypeSuffix = (() => {\n        switch (addon.pricingType) {\n            case AddonPricingType.PER_STAY:\n                return t(Translation.Misc.QTY);\n            case AddonPricingType.PER_PERSON:\n                return t(Translation.Misc.Person);\n            case AddonPricingType.PER_PERSON_OCCUPANCY_PER_NIGHT:\n            case AddonPricingType.PER_PERSON_PER_NIGHT:\n                return t(Translation.Misc.PersonPerNight);\n            case AddonPricingType.PER_ADULT_OCCUPANCY_PER_NIGHT:\n            case AddonPricingType.PER_CHILD_OCCUPANCY_PER_NIGHT:\n                return t(Translation.Misc.AdultPerNight);\n            case AddonPricingType.PER_NIGHT:\n            case AddonPricingType.PER_QUANTITY_NAME_PER_NIGHT:\n                return t(Translation.Misc.Night);\n            case AddonPricingType.PER_ROOM_QUANTITY_PER_NIGHT:\n                return t(Translation.Misc.PerRoomDay);\n        }\n    })();\n\n    const addonCardImageStyle: any = {};\n    if (addon.image) {\n        addonCardImageStyle.backgroundImage = `url('${ImageProvider.resizeImage(addon.image, ImageSize.Original)}')`;\n    } else {\n        addonCardImageStyle.backgroundImage = `url('${hotel?.logo && ImageProvider.resizeImage(hotel?.logo as string, ImageSize.Original)}')`;\n        addonCardImageStyle.backgroundSize = '50%';\n        addonCardImageStyle.backgroundRepeat = 'no-repeat';\n    }\n\n    return (\n        <div className={classNames('u-flex u-flex-flex-start u-rounded addon-card-wrapper', className, classes)} style={{ backgroundColor: Color.White }}>\n            <div className=\"addon-card-image\" style={addonCardImageStyle} />\n            <div className=\"u-marg-heavy u-marg@m- u-w-100@xl\">\n                <div className=\"u-flex\">\n                    <Headline bold>{addon.name}</Headline>\n                    {addonBasketRow ? <Check /> : <></>}\n                </div>\n                <Text color={Color.DarkGrey} type={TextType.Small}>\n                    {addon.description}\n                </Text>\n                <div className=\"addon-card-wrapper--price u-flex u-flex-align-flex-end\">\n                    <div className=\"u-w-100\">\n                        {addonConfigurations.map((input) => {\n                            if (!input.enabled) {\n                                return;\n                            }\n\n                            return (\n                                <div key={input.name} className=\"u-flex justify-content-start u-marg-bot u-marg-top\">\n                                    <Text className=\"u-mw-100\" bold>\n                                        {t(input.name)}\n                                    </Text>\n                                    {input.element}\n                                </div>\n                            );\n                        })}\n\n                        {/* {addon.guaranteeDescription && (\n                            <>\n                                <h4 className=\"u-marg-bottom--light u-marg-top\">Guarantee</h4>\n                                <div className=\"u-marg-bot--heavy\">\n                                    <Text type={TextType.Small}>{addon.guaranteeDescription}</Text>\n                                </div>\n                            </>\n                        )}\n                        {addon.cancelPenalty && (\n                            <>\n                                <h4 className=\"u-marg-bottom--light u-marg-top\">Cancellation Policy</h4>\n                                <div className=\"u-marg-bot--heavy\">\n                                    <Text type={TextType.Small}>{addon.cancelPenalty}</Text>\n                                </div>\n                            </>\n                        )} */}\n                    </div>\n                    <div className=\"addon-card-wrapper--price-action\">\n                        <div className=\"u-flex u-flex-direction-column u-flex-align-flex-end\" style={{ alignSelf: 'flex-end' }}>\n                            <Text type={TextType.Small} color={Color.Navy} inline>\n                                {t(Translation.Misc.From)}\n                            </Text>\n                            <div className=\"room-details--content-price flex-align-items-baseline flex-row\">\n                                {priceInfo?.price && (\n                                    <>\n                                        <div className=\"u-flex align-items-end\">\n                                            <Headline size=\"large\" bold lineHeight=\"1em\">\n                                                <Currency hideDecimals>{priceInfo.price}</Currency>\n                                            </Headline>\n                                            <Text type={TextType.Small} color={Color.DarkGrey} inline className=\"u-marg-left--light u-clear-font-weight\">\n                                                / {pricingTypeSuffix}\n                                            </Text>\n                                        </div>\n                                    </>\n                                )}\n                                {(!!priceInfo?.adultPrice || !!priceInfo?.childPrice) && (\n                                    <h2 className=\"u-marg-none d-flex flex-wrap justify-content-end\">\n                                        {!!priceInfo.adultPrice && (\n                                            <div className=\"d-flex align-items-end flex-row\">\n                                                <Headline size=\"large\" bold lineHeight=\"1em\">\n                                                    <Currency>{priceInfo.adultPrice}</Currency>\n                                                </Headline>\n                                                <Text type={TextType.Small} color={Color.DarkGrey} inline className=\"u-marg-left--light u-clear-font-weight\">\n                                                    /{' '}\n                                                    {addon.pricingType === AddonPricingType.PER_ALL_PERSONS_PER_NIGHT\n                                                        ? t(Translation.Misc.AdultPerNight)\n                                                        : t(Translation.Step.Date.Adult)}\n                                                </Text>\n                                            </div>\n                                        )}\n                                        {!!priceInfo.adultPrice && !!priceInfo.childPrice && <br />}\n                                        {!!priceInfo.childPrice && (\n                                            <div className=\"d-flex align-items-end flex-row\">\n                                                <Headline size=\"large\" bold lineHeight=\"1em\">\n                                                    <Currency>{priceInfo.childPrice}</Currency>\n                                                </Headline>\n                                                <Text type={TextType.Small} color={Color.DarkGrey} inline className=\"u-marg-left--light u-clear-font-weight\">\n                                                    /{' '}\n                                                    {addon.pricingType === AddonPricingType.PER_ALL_PERSONS_PER_NIGHT\n                                                        ? t(Translation.Misc.ChildPerNight)\n                                                        : t(Translation.Step.Date.Child)}\n                                                </Text>\n                                            </div>\n                                        )}\n                                    </h2>\n                                )}\n                            </div>\n                            <div className=\"u-marg-bottom--light\">\n                                <Text type={TextType.Small} color={Color.Grey} inline className=\"u-nowrap\">\n                                    {hotel?.enableCreditCardSurcharge ? t(Translation.Step.Addon.ExcludingFees) : t(Translation.Step.Addon.IncludingFeesAndTaxes)}\n                                </Text>\n                            </div>\n                        </div>\n                        <div className=\"u-marg-top--light u-flex justify-content-end u-w-100@l- flex-column flex-lg-row\">\n                            {addonBasketRow ? (\n                                <div className=\"u-marg-right--light@l u-marg-bottom--light@l-\">\n                                    <BEButton onClick={onClickRemove} textColor={Color.White} backgroundColor={Color.Navy} wide>\n                                        {t(Translation.Step.Addon.Remove)}\n                                    </BEButton>\n                                </div>\n                            ) : (\n                                <></>\n                            )}\n                            <BEButton onClick={onClickAddToCartHandler} primary filled wide>\n                                {addonBasketRow ? t(Translation.Step.Addon.UpdateCart) : t(Translation.Step.Addon.AddToCart)}\n                            </BEButton>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default AddonCard;\n"]}

package/dist/src/components/steps/room/AvailableUpgradesModal.js

@@ -132,6 +132,11 @@ const AvailableUpgradesModal = () => {
                 DataLayer_1.default.instance.sendUpsellConfirmed({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate(), rate);
                 row.setRate(rate, RoomUpsellFeature_1.default.isActive());
                 basketContext.updateBasketRow(row);
+                // TODO: RE-2211 - Look to refactor globally how we're loading the quote details to account for all other changes.
+                // This is a workaround to force the quote details to be reloaded
+                if (hotel === null || hotel === void 0 ? void 0 : hotel.requireDeposit) {
+                    basketContext.getBasketQuoteDetails(() => true);
+                }
                 closeModal();
             }
             else {

package/dist/src/components/steps/room/AvailableUpgradesModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvailableUpgradesModal.js","sourceRoot":"/","sources":["src/components/steps/room/AvailableUpgradesModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext } from '@frontend/contexts';\nimport { AddToCartEvent } from '@frontend/events';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport React, { FC, useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport API from '@/api/BookingAPI';\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport SimpleModal from '@/components/generic/modal/SimpleModal';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport LargeRoomCard from '@/components/steps/room/LargeRoomCard';\nimport { useSignedInMember } from '@/hooks/useSignedInMember';\nimport BasketRow from '@/models/BasketRow';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport RoomUpsellFeature from '@/providers/feature/RoomUpsellFeature';\nimport { Color } from '@/util/Color';\nimport DataLayer from '@/util/DataLayer';\n\nconst AvailableUpgradesModal: FC = () => {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n    const { memberNumber } = useSignedInMember();\n    const [isOpen, setIsOpen] = useState(false);\n    const [row, setRow] = useState<BasketRow | null>(null);\n\n    const basketContext = useContext(BasketContext);\n\n    const { on } = useEvent();\n\n    const room = row?.getRoom();\n    const selectedRate = row?.getRate();\n\n    const [rates, setRates] = useState<RoomRate[]>();\n\n    useEffect(() => {\n        let cancelled = false;\n\n        on(AddToCartEvent, async (event: AddToCartEvent): Promise<void | boolean> => {\n            if (cancelled) return;\n\n            setRow(event.basketRow);\n            return true;\n        });\n\n        return () => {\n            cancelled = true;\n        };\n    }, []);\n\n    useEffect(() => {\n        let cancelled = false;\n\n        if (row) {\n            API.Availability.fetchAvailabilityData(row, hotel?.hotelID as string, memberNumber, true).then((availableRooms) => {\n                if (cancelled) return;\n\n                const unfilteredRates: RoomRate[] = [];\n                availableRooms\n                    ?.map((availableRoom) => {\n                        return availableRoom.getRates();\n                    })\n                    .forEach((fewRates) => {\n                        fewRates.forEach((oneRate) => {\n                            unfilteredRates.push(oneRate);\n                        });\n                    });\n                const filteredRates = unfilteredRates\n                    .filter((rate) => {\n                        return rate.getAveragePrice() > (selectedRate?.getAveragePrice() as number) && rate.name === selectedRate?.name;\n                    })\n                    .sort((a: RoomRate, b: RoomRate) => {\n                        if (a.getAveragePrice() === selectedRate?.getAveragePrice()) return 1;\n                        if (b.getAveragePrice() === selectedRate?.getAveragePrice()) return -1;\n                        return a.getAveragePrice() - b.getAveragePrice();\n                    })\n                    .slice(0, 3);\n\n                setRates(filteredRates);\n                if (filteredRates.length === 0 && selectedRate) {\n                    // Proceed as if user clicked the nav.\n                    confirmRateOnClick();\n                } else {\n                    setIsOpen(true);\n                }\n            });\n        }\n\n        return () => {\n            cancelled = true;\n        };\n    }, [row, memberNumber]);\n\n    const closeModal = () => {\n        setIsOpen(false);\n        setRow(null);\n    };\n\n    const cancelUpsell = () => {\n        if (row) {\n            DataLayer.instance.sendUpsellCancelled({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate() as RoomRate);\n        }\n\n        closeModal();\n    };\n\n    const confirmRateOnClick = (rate?: RoomRate) => {\n        if (row) {\n            if (rate) {\n                DataLayer.instance.sendUpsellConfirmed({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate() as RoomRate, rate);\n\n                row.setRate(rate, RoomUpsellFeature.isActive());\n                basketContext.updateBasketRow(row);\n                closeModal();\n            } else {\n                cancelUpsell();\n            }\n        }\n    };\n\n    return RoomUpsellFeature.isActive() ? (\n        <SimpleModal open={isOpen} onClose={cancelUpsell} title={t(Translation.Step.Room.AvailableUpgrades)}>\n            <div className=\"upgrades-room-modal\">\n                <div className=\"current-room-block container\">\n                    <div className=\"u-flex u-flex-flex-start row\">\n                        <div className=\"image-wrapper col-md-3 col-12\">\n                            <ImageGallerySlider images={room?.getImages() || []} />\n                        </div>\n                        <div className=\"u-flex info-block col-md-7 col-sm-9\">\n                            <div>\n                                <Text color={Color.DarkGrey} bold>\n                                    {t(Translation.Step.Room.CurrentSelectedRoom)}\n                                </Text>\n                                <Headline bold>{room?.name}</Headline>\n                                <Text type={TextType.Small} color={Color.DarkGrey}>\n                                    {selectedRate?.name}\n                                </Text>\n                            </div>\n                            <div>\n                                <div className=\"room-details--content-price flex-row\">\n                                    <Headline bold>\n                                        <Currency hideDecimals>{selectedRate?.getAveragePrice()}</Currency>\n                                    </Headline>\n                                    <Text color={Color.DarkGrey} inline>\n                                        /{t(Translation.Misc.Night)}\n                                    </Text>\n                                </div>\n                                <div className=\"u-marg-bottom\">\n                                    <Text type={TextType.Small} color={Color.Grey} className=\"u-nowrap\">\n                                        <span dangerouslySetInnerHTML={{ __html: t(Translation.Step.Room.RoomInfo.IncludesTaxes) }}></span>\n                                    </Text>\n                                </div>\n                            </div>\n                        </div>\n                        <div className=\"u-flex u-flex-align-center col-md-2 col-sm-3\">\n                            <BEButton wide filled primary onClick={() => confirmRateOnClick()}>\n                                {t(Translation.Step.Room.Confirm)}\n                            </BEButton>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"container\" style={{ backgroundColor: Color.Snow }}>\n                    <div className=\"u-pad-top u-marg-bottom\">\n                        <div className=\"u-marg-bottom--heavy\">\n                            <Headline bold>{t(Translation.Step.Room.CheckOutOtherOptions)}</Headline>\n                        </div>\n                        <div className=\"row no-gutters\">\n                            {rates?.map((rate) => {\n                                const onSelectRate = () => {\n                                    confirmRateOnClick(rate);\n                                };\n\n                                return (\n                                    <div className=\"col-md-6 col-xl-4 u-marg-bottom u-pad-left--light u-pad-right--light\" key={rate.getRoom().name}>\n                                        <LargeRoomCard selectedRate={selectedRate as RoomRate} rate={rate} onSelectRate={onSelectRate} />\n                                    </div>\n                                );\n                            })}\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </SimpleModal>\n    ) : null;\n};\n\nexport default AvailableUpgradesModal;\n"]}
+{"version":3,"file":"AvailableUpgradesModal.js","sourceRoot":"/","sources":["src/components/steps/room/AvailableUpgradesModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext } from '@frontend/contexts';\nimport { AddToCartEvent } from '@frontend/events';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport React, { FC, useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport API from '@/api/BookingAPI';\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport SimpleModal from '@/components/generic/modal/SimpleModal';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport LargeRoomCard from '@/components/steps/room/LargeRoomCard';\nimport { useSignedInMember } from '@/hooks/useSignedInMember';\nimport BasketRow from '@/models/BasketRow';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport RoomUpsellFeature from '@/providers/feature/RoomUpsellFeature';\nimport { Color } from '@/util/Color';\nimport DataLayer from '@/util/DataLayer';\n\nconst AvailableUpgradesModal: FC = () => {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n    const { memberNumber } = useSignedInMember();\n    const [isOpen, setIsOpen] = useState(false);\n    const [row, setRow] = useState<BasketRow | null>(null);\n\n    const basketContext = useContext(BasketContext);\n\n    const { on } = useEvent();\n\n    const room = row?.getRoom();\n    const selectedRate = row?.getRate();\n\n    const [rates, setRates] = useState<RoomRate[]>();\n\n    useEffect(() => {\n        let cancelled = false;\n\n        on(AddToCartEvent, async (event: AddToCartEvent): Promise<void | boolean> => {\n            if (cancelled) return;\n\n            setRow(event.basketRow);\n            return true;\n        });\n\n        return () => {\n            cancelled = true;\n        };\n    }, []);\n\n    useEffect(() => {\n        let cancelled = false;\n\n        if (row) {\n            API.Availability.fetchAvailabilityData(row, hotel?.hotelID as string, memberNumber, true).then((availableRooms) => {\n                if (cancelled) return;\n\n                const unfilteredRates: RoomRate[] = [];\n                availableRooms\n                    ?.map((availableRoom) => {\n                        return availableRoom.getRates();\n                    })\n                    .forEach((fewRates) => {\n                        fewRates.forEach((oneRate) => {\n                            unfilteredRates.push(oneRate);\n                        });\n                    });\n                const filteredRates = unfilteredRates\n                    .filter((rate) => {\n                        return rate.getAveragePrice() > (selectedRate?.getAveragePrice() as number) && rate.name === selectedRate?.name;\n                    })\n                    .sort((a: RoomRate, b: RoomRate) => {\n                        if (a.getAveragePrice() === selectedRate?.getAveragePrice()) return 1;\n                        if (b.getAveragePrice() === selectedRate?.getAveragePrice()) return -1;\n                        return a.getAveragePrice() - b.getAveragePrice();\n                    })\n                    .slice(0, 3);\n\n                setRates(filteredRates);\n                if (filteredRates.length === 0 && selectedRate) {\n                    // Proceed as if user clicked the nav.\n                    confirmRateOnClick();\n                } else {\n                    setIsOpen(true);\n                }\n            });\n        }\n\n        return () => {\n            cancelled = true;\n        };\n    }, [row, memberNumber]);\n\n    const closeModal = () => {\n        setIsOpen(false);\n        setRow(null);\n    };\n\n    const cancelUpsell = () => {\n        if (row) {\n            DataLayer.instance.sendUpsellCancelled({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate() as RoomRate);\n        }\n\n        closeModal();\n    };\n\n    const confirmRateOnClick = (rate?: RoomRate) => {\n        if (row) {\n            if (rate) {\n                DataLayer.instance.sendUpsellConfirmed({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate() as RoomRate, rate);\n\n                row.setRate(rate, RoomUpsellFeature.isActive());\n                basketContext.updateBasketRow(row);\n\n                // TODO: RE-2211 - Look to refactor globally how we're loading the quote details to account for all other changes.\n                // This is a workaround to force the quote details to be reloaded\n                if (hotel?.requireDeposit) {\n                    basketContext.getBasketQuoteDetails(() => true);\n                }\n\n                closeModal();\n            } else {\n                cancelUpsell();\n            }\n        }\n    };\n\n    return RoomUpsellFeature.isActive() ? (\n        <SimpleModal open={isOpen} onClose={cancelUpsell} title={t(Translation.Step.Room.AvailableUpgrades)}>\n            <div className=\"upgrades-room-modal\">\n                <div className=\"current-room-block container\">\n                    <div className=\"u-flex u-flex-flex-start row\">\n                        <div className=\"image-wrapper col-md-3 col-12\">\n                            <ImageGallerySlider images={room?.getImages() || []} />\n                        </div>\n                        <div className=\"u-flex info-block col-md-7 col-sm-9\">\n                            <div>\n                                <Text color={Color.DarkGrey} bold>\n                                    {t(Translation.Step.Room.CurrentSelectedRoom)}\n                                </Text>\n                                <Headline bold>{room?.name}</Headline>\n                                <Text type={TextType.Small} color={Color.DarkGrey}>\n                                    {selectedRate?.name}\n                                </Text>\n                            </div>\n                            <div>\n                                <div className=\"room-details--content-price flex-row\">\n                                    <Headline bold>\n                                        <Currency hideDecimals>{selectedRate?.getAveragePrice()}</Currency>\n                                    </Headline>\n                                    <Text color={Color.DarkGrey} inline>\n                                        /{t(Translation.Misc.Night)}\n                                    </Text>\n                                </div>\n                                <div className=\"u-marg-bottom\">\n                                    <Text type={TextType.Small} color={Color.Grey} className=\"u-nowrap\">\n                                        <span dangerouslySetInnerHTML={{ __html: t(Translation.Step.Room.RoomInfo.IncludesTaxes) }}></span>\n                                    </Text>\n                                </div>\n                            </div>\n                        </div>\n                        <div className=\"u-flex u-flex-align-center col-md-2 col-sm-3\">\n                            <BEButton wide filled primary onClick={() => confirmRateOnClick()}>\n                                {t(Translation.Step.Room.Confirm)}\n                            </BEButton>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"container\" style={{ backgroundColor: Color.Snow }}>\n                    <div className=\"u-pad-top u-marg-bottom\">\n                        <div className=\"u-marg-bottom--heavy\">\n                            <Headline bold>{t(Translation.Step.Room.CheckOutOtherOptions)}</Headline>\n                        </div>\n                        <div className=\"row no-gutters\">\n                            {rates?.map((rate) => {\n                                const onSelectRate = () => {\n                                    confirmRateOnClick(rate);\n                                };\n\n                                return (\n                                    <div className=\"col-md-6 col-xl-4 u-marg-bottom u-pad-left--light u-pad-right--light\" key={rate.getRoom().name}>\n                                        <LargeRoomCard selectedRate={selectedRate as RoomRate} rate={rate} onSelectRate={onSelectRate} />\n                                    </div>\n                                );\n                            })}\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </SimpleModal>\n    ) : null;\n};\n\nexport default AvailableUpgradesModal;\n"]}

package/dist/src/components/steps/room/RoomList.js

@@ -46,6 +46,7 @@ function RoomList() {
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const { rooms, loadingAttempted, isLoading, openRoom, apiHasError, retargetingRoom } = (0, RoomRateAvailabilityListFromApi_1.useRoomRateAvailabilityListFromApi)();
     const roomListRef = (0, react_1.useRef)(null);
+    const timeoutRef = (0, react_1.useRef)(null);
     const sortBy = beContext.currentRoomSort;
     let listWhenLastScrolled = null;
     const scrollIntoView = () => {
@@ -58,15 +59,28 @@ function RoomList() {
             });
         }
     };
+    (0, react_1.useEffect)(() => {
+        return () => {
+            // Clear timeout on unmount or before next effect
+            if (timeoutRef.current) {
+                clearTimeout(timeoutRef.current);
+            }
+        };
+    }, []);
     return (0, react_1.useMemo)(() => {
         var _a;
         const sortedRooms = [...rooms];
         if (sortedRooms.length !== 0) {
             sortedRooms.sort(RoomSortProvider_1.default.getSortByFunction(sortBy));
         }
-        setTimeout(() => {
-            scrollIntoView();
-        }, 100);
+        if (!basketContext.isDatePickerOpen && !isLoading && sortedRooms.length > 0) {
+            if (timeoutRef.current) {
+                clearTimeout(timeoutRef.current);
+            }
+            timeoutRef.current = setTimeout(() => {
+                scrollIntoView();
+            }, 100);
+        }
         const elements = (react_1.default.createElement("div", { ref: roomListRef }, isLoading || !loadingAttempted ? (react_1.default.createElement(LargeLoader_1.default, null)) : sortedRooms.length ? (sortedRooms.map((room, index) => react_1.default.createElement(RoomDetails_1.default, { key: room.code, room: room, disableMarginBottom: index === sortedRooms.length - 1 }))) : (react_1.default.createElement(react_1.default.Fragment, null,
             apiHasError ? react_1.default.createElement(StepRoomErrorForm_1.StepRoomErrorForm, null) : react_1.default.createElement(NoRoomsFoundBlock_1.default, null), (_a = hotel === null || hotel === void 0 ? void 0 : hotel.crossSellHotelIds) === null || _a === void 0 ? void 0 :
             _a.map((hotelId) => (react_1.default.createElement(RoomListCrossSellBlock_1.default, { key: hotelId, hotelId: hotelId })))))));
@@ -74,7 +88,7 @@ function RoomList() {
         return (react_1.default.createElement(react_1.default.Fragment, null,
             react_1.default.createElement(RoomListAlert_1.RoomListAlert, null, !isLoading && retargetingRoom ? react_1.default.createElement(RoomDetailsRetargeting_1.RoomDetailsRetargeting, { key: retargetingRoom.code, room: retargetingRoom }) : null),
             elements));
-    }, [rooms, isLoading, loadingAttempted, openRoom, sortBy, beContext.currentFilters, basketContext.loadedPromotion]);
+    }, [rooms, isLoading, loadingAttempted, openRoom, sortBy, beContext.currentFilters, basketContext.loadedPromotion, basketContext.isDatePickerOpen]);
 }
 exports.default = RoomList;
 //# sourceMappingURL=RoomList.js.map

package/dist/src/components/steps/room/RoomList.js.map

@@ -1 +1 @@
-{"version":3,"file":"RoomList.js","sourceRoot":"/","sources":["src/components/steps/room/RoomList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport React, { useContext, useMemo, useRef } from 'react';\n\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport RoomDetails from '@/components/steps/room/roomDetails/RoomDetails';\nimport RoomListCrossSellBlock from '@/components/steps/room/RoomListCrossSellBlock';\nimport { useRoomRateAvailabilityListFromApi } from '@/hooks/RoomRateAvailabilityListFromApi';\nimport { Room } from '@/models/Room/Room';\nimport RoomSortProvider from '@/providers/RoomSortProvider';\nimport DataLayer from '@/util/DataLayer';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport NoRoomsFoundBlock from './NoRoomsFoundBlock';\nimport { RoomDetailsRetargeting } from './roomDetails/RoomDetailsRetargeting';\nimport { RoomListAlert } from './RoomListAlert';\nimport { StepRoomErrorForm } from './StepRoomErrorForm';\n\nexport default function RoomList() {\n    const basketContext = useContext(BasketContext);\n    const beContext = useContext(BookingEngineContext);\n\n    const { hotel } = useCurrentHotel();\n    const { rooms, loadingAttempted, isLoading, openRoom, apiHasError, retargetingRoom } = useRoomRateAvailabilityListFromApi();\n    const roomListRef = useRef<HTMLDivElement | null>(null);\n    const sortBy = beContext.currentRoomSort;\n    let listWhenLastScrolled: Room[] | null = null;\n\n    const scrollIntoView = () => {\n        if (roomListRef.current && listWhenLastScrolled !== rooms) {\n            listWhenLastScrolled = rooms;\n            const offset = beContext.screenSize <= ScreenSize.Medium ? 185 : 350;\n\n            window.scrollTo({\n                top: window.scrollY + (roomListRef.current.getBoundingClientRect().top - offset),\n                behavior: 'smooth',\n            });\n        }\n    };\n\n    return useMemo(() => {\n        const sortedRooms = [...rooms];\n        if (sortedRooms.length !== 0) {\n            sortedRooms.sort(RoomSortProvider.getSortByFunction(sortBy));\n        }\n\n        setTimeout(() => {\n            scrollIntoView();\n        }, 100);\n\n        const elements = (\n            <div ref={roomListRef}>\n                {isLoading || !loadingAttempted ? (\n                    <LargeLoader />\n                ) : sortedRooms.length ? (\n                    sortedRooms.map((room, index) => <RoomDetails key={room.code} room={room} disableMarginBottom={index === sortedRooms.length - 1} />)\n                ) : (\n                    <>\n                        {apiHasError ? <StepRoomErrorForm /> : <NoRoomsFoundBlock />}\n                        {hotel?.crossSellHotelIds?.map((hotelId) => (\n                            <RoomListCrossSellBlock key={hotelId} hotelId={hotelId} />\n                        ))}\n                    </>\n                )}\n            </div>\n        );\n\n        DataLayer.instance.sendRoomImpressions();\n\n        return (\n            <>\n                <RoomListAlert>{!isLoading && retargetingRoom ? <RoomDetailsRetargeting key={retargetingRoom.code} room={retargetingRoom} /> : null}</RoomListAlert>\n                {elements}\n            </>\n        );\n    }, [rooms, isLoading, loadingAttempted, openRoom, sortBy, beContext.currentFilters, basketContext.loadedPromotion]);\n}\n"]}
+{"version":3,"file":"RoomList.js","sourceRoot":"/","sources":["src/components/steps/room/RoomList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport React, { useContext, useEffect, useMemo, useRef } from 'react';\n\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport RoomDetails from '@/components/steps/room/roomDetails/RoomDetails';\nimport RoomListCrossSellBlock from '@/components/steps/room/RoomListCrossSellBlock';\nimport { useRoomRateAvailabilityListFromApi } from '@/hooks/RoomRateAvailabilityListFromApi';\nimport { Room } from '@/models/Room/Room';\nimport RoomSortProvider from '@/providers/RoomSortProvider';\nimport DataLayer from '@/util/DataLayer';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport NoRoomsFoundBlock from './NoRoomsFoundBlock';\nimport { RoomDetailsRetargeting } from './roomDetails/RoomDetailsRetargeting';\nimport { RoomListAlert } from './RoomListAlert';\nimport { StepRoomErrorForm } from './StepRoomErrorForm';\n\nexport default function RoomList() {\n    const basketContext = useContext(BasketContext);\n    const beContext = useContext(BookingEngineContext);\n\n    const { hotel } = useCurrentHotel();\n    const { rooms, loadingAttempted, isLoading, openRoom, apiHasError, retargetingRoom } = useRoomRateAvailabilityListFromApi();\n    const roomListRef = useRef<HTMLDivElement | null>(null);\n    const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n\n    const sortBy = beContext.currentRoomSort;\n    let listWhenLastScrolled: Room[] | null = null;\n\n    const scrollIntoView = () => {\n        if (roomListRef.current && listWhenLastScrolled !== rooms) {\n            listWhenLastScrolled = rooms;\n            const offset = beContext.screenSize <= ScreenSize.Medium ? 185 : 350;\n\n            window.scrollTo({\n                top: window.scrollY + (roomListRef.current.getBoundingClientRect().top - offset),\n                behavior: 'smooth',\n            });\n        }\n    };\n\n    useEffect(() => {\n        return () => {\n            // Clear timeout on unmount or before next effect\n            if (timeoutRef.current) {\n                clearTimeout(timeoutRef.current);\n            }\n        };\n    }, []);\n\n    return useMemo(() => {\n        const sortedRooms = [...rooms];\n        if (sortedRooms.length !== 0) {\n            sortedRooms.sort(RoomSortProvider.getSortByFunction(sortBy));\n        }\n\n        if (!basketContext.isDatePickerOpen && !isLoading && sortedRooms.length > 0) {\n            if (timeoutRef.current) {\n                clearTimeout(timeoutRef.current);\n            }\n\n            timeoutRef.current = setTimeout(() => {\n                scrollIntoView();\n            }, 100);\n        }\n\n        const elements = (\n            <div ref={roomListRef}>\n                {isLoading || !loadingAttempted ? (\n                    <LargeLoader />\n                ) : sortedRooms.length ? (\n                    sortedRooms.map((room, index) => <RoomDetails key={room.code} room={room} disableMarginBottom={index === sortedRooms.length - 1} />)\n                ) : (\n                    <>\n                        {apiHasError ? <StepRoomErrorForm /> : <NoRoomsFoundBlock />}\n                        {hotel?.crossSellHotelIds?.map((hotelId) => (\n                            <RoomListCrossSellBlock key={hotelId} hotelId={hotelId} />\n                        ))}\n                    </>\n                )}\n            </div>\n        );\n\n        DataLayer.instance.sendRoomImpressions();\n\n        return (\n            <>\n                <RoomListAlert>{!isLoading && retargetingRoom ? <RoomDetailsRetargeting key={retargetingRoom.code} room={retargetingRoom} /> : null}</RoomListAlert>\n                {elements}\n            </>\n        );\n    }, [rooms, isLoading, loadingAttempted, openRoom, sortBy, beContext.currentFilters, basketContext.loadedPromotion, basketContext.isDatePickerOpen]);\n}\n"]}

package/dist/src/components/steps/room/RoomModal.js

@@ -26,8 +26,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const contexts_1 = require("../../../contexts/index.js");
 const hooks_1 = require("../../../hooks/index.js");
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
 const Headline_1 = __importDefault(require("../../generic/Headline"));
@@ -42,6 +43,7 @@ const Color_1 = require("../../../util/Color");
 const RoomModalPerkRow_1 = __importDefault(require("./RoomModalPerkRow"));
 function RoomModal(props) {
     var _a;
+    const { roomModalDescSideBySide } = (0, react_1.useContext)(contexts_1.HotelOverridesContext);
     const { t } = (0, react_i18next_1.useTranslation)();
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const { rooms } = hotel;
@@ -55,18 +57,26 @@ function RoomModal(props) {
         });
     }
     const cleanPerkDisclaimer = (prePerkDisclaimer === null || prePerkDisclaimer === void 0 ? void 0 : prePerkDisclaimer.replace(/<br(\/|)>/g, '')) || '';
+    const LongDescription = () => {
+        return (react_1.default.createElement("div", { className: "u-marg-bottom--heavy rs-room-modal-long-description" },
+            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Graphite },
+                react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: props.room.getLongDescription() || '' } }))));
+    };
     return (react_1.default.createElement(SimpleModal_1.default, { title: props.room.name + ' ' + t(Translation_1.Translation.Step.Room.RoomInfo.Information), open: props.open, size: SimpleModal_1.SimpleModalSize.Small, onClose: props.onClose },
-        react_1.default.createElement("div", null,
+        react_1.default.createElement("div", { className: "rs-room-modal" },
             react_1.default.createElement("div", { style: { height: '350px' } },
                 react_1.default.createElement(ImageGallerySlider_1.default, { images: props.room.getImages() })),
-            react_1.default.createElement("div", { className: "u-marg-heavy u-marg@m-" },
-                react_1.default.createElement("div", { className: "u-marg-bottom--light" },
+            react_1.default.createElement("div", { className: "u-marg-heavy u-marg@m- rs-room-modal-container" },
+                react_1.default.createElement("div", { className: "u-marg-bottom--light rs-room-modal-headline" },
                     react_1.default.createElement(Headline_1.default, { bold: true, size: "large" }, props.room.name)),
                 react_1.default.createElement(RoomDetailsBedsBlock_1.RoomDetailsBedsBlock, { room: props.room }),
-                react_1.default.createElement("div", { className: "u-marg-bottom--heavy" },
+                react_1.default.createElement("div", { className: "u-marg-bottom--heavy rs-room-modal-short-description" },
                     react_1.default.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, type: Text_1.TextType.Small },
                         react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: props.room.getShortDescription(false) || '' } }))),
-                !(hotel === null || hotel === void 0 ? void 0 : hotel.perksHideOnRoomDetail) && roomPerks && (react_1.default.createElement("div", { className: "u-marg-bottom--heavy" },
+                roomModalDescSideBySide ? (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement(LongDescription, null),
+                    react_1.default.createElement(LineBreak_1.default, null))) : null,
+                !(hotel === null || hotel === void 0 ? void 0 : hotel.perksHideOnRoomDetail) && roomPerks && (react_1.default.createElement("div", { className: "u-marg-bottom--heavy rs-room-modal-perks" },
                     react_1.default.createElement("div", { className: "row" },
                         react_1.default.createElement(RoomModalPerkRow_1.default, { hotel: hotel, room: props.room, roomPerks: roomPerks })),
                     (hotel === null || hotel === void 0 ? void 0 : hotel.perksShowDisclaimer) && (react_1.default.createElement("div", { className: "row u-marg-top--lighter" },
@@ -82,10 +92,8 @@ function RoomModal(props) {
                                 react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, inline: true }, amenity.description))));
                     })))),
                 react_1.default.createElement(LineBreak_1.default, null),
-                react_1.default.createElement("div", { className: "u-marg-bottom--heavy" },
-                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Graphite },
-                        react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: props.room.getLongDescription() || '' } }))),
-                !!cleanPerkDisclaimer && (react_1.default.createElement("div", { className: "u-marg-bottom--heavy" },
+                !roomModalDescSideBySide ? react_1.default.createElement(LongDescription, null) : null,
+                !!cleanPerkDisclaimer && (react_1.default.createElement("div", { className: "u-marg-bottom--heavy rs-room-modal-disclaimer" },
                     react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
                         react_1.default.createElement("strong", null, t(Translation_1.Translation.Step.Room.RoomInfo.Disclaimer))),
                     react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },

package/dist/src/components/steps/room/RoomModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"RoomModal.js","sourceRoot":"/","sources":["src/components/steps/room/RoomModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCurrentHotel } from '@frontend/hooks';\nimport { Hotel } from 'models/Client/Hotel/Hotel';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Headline from '@/components/generic/Headline';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport LineBreak from '@/components/generic/LineBreak';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { RoomDetailsBedsBlock } from '@/components/steps/room/roomDetails/RoomDetailsBedsBlock';\nimport RoomRates from '@/components/steps/room/roomDetails/roomRates/RoomRates';\nimport { Room } from '@/models/Room/Room';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport { Color } from '@/util/Color';\n\nimport RoomModalPerkRow from './RoomModalPerkRow';\n\ninterface RoomModalProps {\n    room: Room;\n\n    rates: RoomRate[];\n    featuredRates: RoomRate[];\n\n    open: boolean;\n    onClose?: () => void;\n}\n\nexport default function RoomModal(props: RoomModalProps) {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n    const { rooms } = hotel as Hotel;\n\n    const { roomPerks, prePerkDisclaimer } = props.room.getRoomPerks({ hotel: hotel, room: props.room });\n\n    const extraRoomData = rooms?.[props.room.code as string];\n\n    // Explode otherwise original data gets overwritten.\n    const amenities = extraRoomData?.amenities ? [...extraRoomData.amenities] : [];\n\n    if (extraRoomData?.features?.length) {\n        extraRoomData.features.forEach((feature) => {\n            amenities.push(feature);\n        });\n    }\n\n    const cleanPerkDisclaimer = prePerkDisclaimer?.replace(/<br(\\/|)>/g, '') || '';\n\n    return (\n        <SimpleModal title={props.room.name + ' ' + t(Translation.Step.Room.RoomInfo.Information)} open={props.open} size={SimpleModalSize.Small} onClose={props.onClose}>\n            <div>\n                <div style={{ height: '350px' }}>\n                    <ImageGallerySlider images={props.room.getImages()} />\n                </div>\n\n                <div className=\"u-marg-heavy u-marg@m-\">\n                    <div className=\"u-marg-bottom--light\">\n                        <Headline bold size=\"large\">\n                            {props.room.name}\n                        </Headline>\n                    </div>\n                    <RoomDetailsBedsBlock room={props.room} />\n                    <div className=\"u-marg-bottom--heavy\">\n                        <Text color={Color.DarkGrey} type={TextType.Small}>\n                            <span dangerouslySetInnerHTML={{ __html: props.room.getShortDescription(false) || '' }} />\n                        </Text>\n                    </div>\n\n                    {!hotel?.perksHideOnRoomDetail && roomPerks && (\n                        <div className=\"u-marg-bottom--heavy\">\n                            <div className=\"row\">\n                                <RoomModalPerkRow hotel={hotel} room={props.room} roomPerks={roomPerks} />\n                            </div>\n                            {hotel?.perksShowDisclaimer && (\n                                <div className=\"row u-marg-top--lighter\">\n                                    <small className=\"col-12\">{t(Translation.Misc.PerksDisclaimer)}</small>\n                                </div>\n                            )}\n                        </div>\n                    )}\n                    {!!amenities?.length && (\n                        <>\n                            <div className=\"u-marg-bottom\">\n                                <Text color={Color.Accent} type={TextType.Small}>\n                                    <strong>{t(Translation.Step.Room.RoomInfo.RoomAmenities)}</strong>\n                                </Text>\n                            </div>\n                            <div className=\"row\">\n                                {amenities.map((amenity) => {\n                                    return (\n                                        <div key={amenity.description} className=\"col-sm-6 u-marg-bottom--light u-flex justify-content-start\">\n                                            <Icon icon={IconType.Check} color={Color.White} backgroundColor={Color.Navy} borderRadius=\"round\" noPadding size=\"16px\" />\n                                            <div className=\"u-marg-left--light u-flex\">\n                                                <Text type={TextType.Small} inline>\n                                                    {amenity.description}\n                                                </Text>\n                                            </div>\n                                        </div>\n                                    );\n                                })}\n                            </div>\n                        </>\n                    )}\n                    <LineBreak />\n                    <div className=\"u-marg-bottom--heavy\">\n                        <Text type={TextType.Small} color={Color.Graphite}>\n                            <span dangerouslySetInnerHTML={{ __html: props.room.getLongDescription() || '' }} />\n                        </Text>\n                    </div>\n                    {!!cleanPerkDisclaimer && (\n                        <div className=\"u-marg-bottom--heavy\">\n                            <Text type={TextType.Small}>\n                                <strong>{t(Translation.Step.Room.RoomInfo.Disclaimer)}</strong>\n                            </Text>\n                            <Text type={TextType.Small}>\n                                <span dangerouslySetInnerHTML={{ __html: cleanPerkDisclaimer }} />\n                            </Text>\n                        </div>\n                    )}\n                </div>\n\n                <RoomRates featuredRates={props.featuredRates} rates={props.rates} roomCode={props.room.code as string} />\n            </div>\n        </SimpleModal>\n    );\n}\n"]}
+{"version":3,"file":"RoomModal.js","sourceRoot":"/","sources":["src/components/steps/room/RoomModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iDAA2D;AAC3D,2CAAkD;AAElD,+CAA0C;AAC1C,iDAA+C;AAC/C,0DAAuD;AAEvD,6EAAqD;AACrD,uEAAgE;AAChE,+EAAuD;AACvD,sFAAsF;AACtF,kEAA2D;AAC3D,oGAA4E;AAC5E,mGAAgG;AAChG,wGAAgF;AAGhF,wCAAqC;AAErC,0EAAkD;AAYlD,SAAwB,SAAS,CAAC,KAAqB;;IACnD,MAAM,EAAE,uBAAuB,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IACtE,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IACpC,MAAM,EAAE,KAAK,EAAE,GAAG,KAAc,CAAC;IAEjC,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC;IAErG,MAAM,aAAa,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAG,KAAK,CAAC,IAAI,CAAC,IAAc,CAAC,CAAC;IAEzD,oDAAoD;IACpD,MAAM,SAAS,GAAG,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,SAAS,EAAC,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAE/E,IAAI,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,QAAQ,0CAAE,MAAM,EAAE;QACjC,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YACvC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAC5B,CAAC,CAAC,CAAC;KACN;IAED,MAAM,mBAAmB,GAAG,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,OAAO,CAAC,YAAY,EAAE,EAAE,CAAC,KAAI,EAAE,CAAC;IAE/E,MAAM,eAAe,GAAG,GAAG,EAAE;QACzB,OAAO,CACH,uCAAK,SAAS,EAAC,qDAAqD;YAChE,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ;gBAC7C,wCAAM,uBAAuB,EAAE,EAAE,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,kBAAkB,EAAE,IAAI,EAAE,EAAE,GAAI,CACjF,CACL,CACT,CAAC;IACN,CAAC,CAAC;IACF,OAAO,CACH,8BAAC,qBAAW,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,GAAG,GAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAE,6BAAe,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO;QAC5J,uCAAK,SAAS,EAAC,eAAe;YAC1B,uCAAK,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE;gBAC3B,8BAAC,4BAAkB,IAAC,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,EAAE,GAAI,CACpD;YAEN,uCAAK,SAAS,EAAC,gDAAgD;gBAC3D,uCAAK,SAAS,EAAC,6CAA6C;oBACxD,8BAAC,kBAAQ,IAAC,IAAI,QAAC,IAAI,EAAC,OAAO,IACtB,KAAK,CAAC,IAAI,CAAC,IAAI,CACT,CACT;gBACN,8BAAC,2CAAoB,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,GAAI;gBAC1C,uCAAK,SAAS,EAAC,sDAAsD;oBACjE,8BAAC,cAAI,IAAC,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK;wBAC7C,wCAAM,uBAAuB,EAAE,EAAE,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,IAAI,EAAE,EAAE,GAAI,CACvF,CACL;gBAEL,uBAAuB,CAAC,CAAC,CAAC,CACvB;oBACI,8BAAC,eAAe,OAAG;oBACnB,8BAAC,mBAAS,OAAG,CACd,CACN,CAAC,CAAC,CAAC,IAAI;gBAEP,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,qBAAqB,CAAA,IAAI,SAAS,IAAI,CAC3C,uCAAK,SAAS,EAAC,0CAA0C;oBACrD,uCAAK,SAAS,EAAC,KAAK;wBAChB,8BAAC,0BAAgB,IAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,SAAS,EAAE,SAAS,GAAI,CACxE;oBACL,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,mBAAmB,KAAI,CAC3B,uCAAK,SAAS,EAAC,yBAAyB;wBACpC,yCAAO,SAAS,EAAC,QAAQ,IAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAS,CACrE,CACT,CACC,CACT;gBACA,CAAC,CAAC,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,MAAM,CAAA,IAAI,CACpB;oBACI,uCAAK,SAAS,EAAC,eAAe;wBAC1B,8BAAC,cAAI,IAAC,KAAK,EAAE,aAAK,CAAC,MAAM,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK;4BAC3C,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAU,CAC/D,CACL;oBACN,uCAAK,SAAS,EAAC,KAAK,IACf,SAAS,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;wBACvB,OAAO,CACH,uCAAK,GAAG,EAAE,OAAO,CAAC,WAAW,EAAE,SAAS,EAAC,4DAA4D;4BACjG,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,KAAK,EAAE,eAAe,EAAE,aAAK,CAAC,IAAI,EAAE,YAAY,EAAC,OAAO,EAAC,SAAS,QAAC,IAAI,EAAC,MAAM,GAAG;4BAC1H,uCAAK,SAAS,EAAC,2BAA2B;gCACtC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,MAAM,UAC7B,OAAO,CAAC,WAAW,CACjB,CACL,CACJ,CACT,CAAC;oBACN,CAAC,CAAC,CACA,CACP,CACN;gBACD,8BAAC,mBAAS,OAAG;gBACZ,CAAC,uBAAuB,CAAC,CAAC,CAAC,8BAAC,eAAe,OAAG,CAAC,CAAC,CAAC,IAAI;gBAErD,CAAC,CAAC,mBAAmB,IAAI,CACtB,uCAAK,SAAS,EAAC,+CAA+C;oBAC1D,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACtB,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAU,CAC5D;oBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACtB,wCAAM,uBAAuB,EAAE,EAAE,MAAM,EAAE,mBAAmB,EAAE,GAAI,CAC/D,CACL,CACT,CACC;YAEN,8BAAC,mBAAS,IAAC,aAAa,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,IAAI,CAAC,IAAc,GAAI,CACxG,CACI,CACjB,CAAC;AACN,CAAC;AA/GD,4BA+GC","sourcesContent":["import { HotelOverridesContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { Hotel } from 'models/Client/Hotel/Hotel';\nimport React, { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Headline from '@/components/generic/Headline';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport LineBreak from '@/components/generic/LineBreak';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { RoomDetailsBedsBlock } from '@/components/steps/room/roomDetails/RoomDetailsBedsBlock';\nimport RoomRates from '@/components/steps/room/roomDetails/roomRates/RoomRates';\nimport { Room } from '@/models/Room/Room';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport { Color } from '@/util/Color';\n\nimport RoomModalPerkRow from './RoomModalPerkRow';\n\ninterface RoomModalProps {\n    room: Room;\n\n    rates: RoomRate[];\n    featuredRates: RoomRate[];\n\n    open: boolean;\n    onClose?: () => void;\n}\n\nexport default function RoomModal(props: RoomModalProps) {\n    const { roomModalDescSideBySide } = useContext(HotelOverridesContext);\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n    const { rooms } = hotel as Hotel;\n\n    const { roomPerks, prePerkDisclaimer } = props.room.getRoomPerks({ hotel: hotel, room: props.room });\n\n    const extraRoomData = rooms?.[props.room.code as string];\n\n    // Explode otherwise original data gets overwritten.\n    const amenities = extraRoomData?.amenities ? [...extraRoomData.amenities] : [];\n\n    if (extraRoomData?.features?.length) {\n        extraRoomData.features.forEach((feature) => {\n            amenities.push(feature);\n        });\n    }\n\n    const cleanPerkDisclaimer = prePerkDisclaimer?.replace(/<br(\\/|)>/g, '') || '';\n\n    const LongDescription = () => {\n        return (\n            <div className=\"u-marg-bottom--heavy rs-room-modal-long-description\">\n                <Text type={TextType.Small} color={Color.Graphite}>\n                    <span dangerouslySetInnerHTML={{ __html: props.room.getLongDescription() || '' }} />\n                </Text>\n            </div>\n        );\n    };\n    return (\n        <SimpleModal title={props.room.name + ' ' + t(Translation.Step.Room.RoomInfo.Information)} open={props.open} size={SimpleModalSize.Small} onClose={props.onClose}>\n            <div className=\"rs-room-modal\">\n                <div style={{ height: '350px' }}>\n                    <ImageGallerySlider images={props.room.getImages()} />\n                </div>\n\n                <div className=\"u-marg-heavy u-marg@m- rs-room-modal-container\">\n                    <div className=\"u-marg-bottom--light rs-room-modal-headline\">\n                        <Headline bold size=\"large\">\n                            {props.room.name}\n                        </Headline>\n                    </div>\n                    <RoomDetailsBedsBlock room={props.room} />\n                    <div className=\"u-marg-bottom--heavy rs-room-modal-short-description\">\n                        <Text color={Color.DarkGrey} type={TextType.Small}>\n                            <span dangerouslySetInnerHTML={{ __html: props.room.getShortDescription(false) || '' }} />\n                        </Text>\n                    </div>\n\n                    {roomModalDescSideBySide ? (\n                        <>\n                            <LongDescription />\n                            <LineBreak />\n                        </>\n                    ) : null}\n\n                    {!hotel?.perksHideOnRoomDetail && roomPerks && (\n                        <div className=\"u-marg-bottom--heavy rs-room-modal-perks\">\n                            <div className=\"row\">\n                                <RoomModalPerkRow hotel={hotel} room={props.room} roomPerks={roomPerks} />\n                            </div>\n                            {hotel?.perksShowDisclaimer && (\n                                <div className=\"row u-marg-top--lighter\">\n                                    <small className=\"col-12\">{t(Translation.Misc.PerksDisclaimer)}</small>\n                                </div>\n                            )}\n                        </div>\n                    )}\n                    {!!amenities?.length && (\n                        <>\n                            <div className=\"u-marg-bottom\">\n                                <Text color={Color.Accent} type={TextType.Small}>\n                                    <strong>{t(Translation.Step.Room.RoomInfo.RoomAmenities)}</strong>\n                                </Text>\n                            </div>\n                            <div className=\"row\">\n                                {amenities.map((amenity) => {\n                                    return (\n                                        <div key={amenity.description} className=\"col-sm-6 u-marg-bottom--light u-flex justify-content-start\">\n                                            <Icon icon={IconType.Check} color={Color.White} backgroundColor={Color.Navy} borderRadius=\"round\" noPadding size=\"16px\" />\n                                            <div className=\"u-marg-left--light u-flex\">\n                                                <Text type={TextType.Small} inline>\n                                                    {amenity.description}\n                                                </Text>\n                                            </div>\n                                        </div>\n                                    );\n                                })}\n                            </div>\n                        </>\n                    )}\n                    <LineBreak />\n                    {!roomModalDescSideBySide ? <LongDescription /> : null}\n\n                    {!!cleanPerkDisclaimer && (\n                        <div className=\"u-marg-bottom--heavy rs-room-modal-disclaimer\">\n                            <Text type={TextType.Small}>\n                                <strong>{t(Translation.Step.Room.RoomInfo.Disclaimer)}</strong>\n                            </Text>\n                            <Text type={TextType.Small}>\n                                <span dangerouslySetInnerHTML={{ __html: cleanPerkDisclaimer }} />\n                            </Text>\n                        </div>\n                    )}\n                </div>\n\n                <RoomRates featuredRates={props.featuredRates} rates={props.rates} roomCode={props.room.code as string} />\n            </div>\n        </SimpleModal>\n    );\n}\n"]}

package/dist/src/components/steps/room/roomBuilderProgress/RoomBuilderProgressRow.js

@@ -100,6 +100,9 @@ function RoomBuilderProgressRow(props) {
         }
         context.updateBasketRow(row);
     };
+    const onDatePickerOpenChange = (isOpen) => {
+        context.onDatePickerOpenChange(isOpen);
+    };
     const updatePromoCode = (code) => {
         DataLayer_1.default.instance.sendInteraction('Promo Code', DataLayer_1.InteractionType.FORM_FIELD, DataLayer_1.InteractionStep.ROOMS);
         if (context.selectedBasketRow) {
@@ -199,7 +202,7 @@ function RoomBuilderProgressRow(props) {
                         react_1.default.createElement(NumberOfInfantsPicker_1.default, { row: row, onChange: updateNumberOfInfantsOnChange })))) : null,
                 react_1.default.createElement(react_1.default.Fragment, null,
                     react_1.default.createElement("div", { className: "room-builder-progress--value" },
-                        react_1.default.createElement(FloatingDatePicker_1.default, { startDate: row.getStartDate(), endDate: row.getEndDate(), selectedDateChanged: updateDateValues, className: "u-w-100@xl- d-flex align-items-center justify-content-center", isAboveNav: true },
+                        react_1.default.createElement(FloatingDatePicker_1.default, { startDate: row.getStartDate(), endDate: row.getEndDate(), selectedDateChanged: updateDateValues, className: "u-w-100@xl- d-flex align-items-center justify-content-center", isAboveNav: true, onDatePickerOpenChange: onDatePickerOpenChange },
                             react_1.default.createElement(Tooltip_1.default, { title: t(Translation_1.Translation.Step.Date.SelectArrivalAndDepartureDatesByClickingHere) },
                                 react_1.default.createElement("div", { className: "u-flex align-items-center justify-content-center u-w-100@xl- u-cursor-pointer" },
                                     react_1.default.createElement(Text_1.default, { color: Color_1.Color.Accent, bold: true, className: "u-nowrap" }, row.getArrivalDate()),