@roomstay/frontend 2.6.58 → 2.6.59

package/dist/src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.js.map

@@ -1 +1 @@
-{"version":3,"file":"BookingWizardPromoCode.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4DAAoC;AACpC,+CAAoE;AACpE,iDAA+C;AAE/C,4DAAyD;AACzD,8CAA2C;AAE3C,oEAA4C;AAC5C,8GAA0D;AAUnD,MAAM,sBAAsB,GAAoC,CAAC,KAAK,EAAE,EAAE;IAC7E,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC7C,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAqB,EAAE,CAAC,CAAC;IAEzD,MAAM,cAAc,GAAG,IAAA,mBAAW,EAC9B,IAAA,mBAAQ,EAAC,CAAC,KAAK,EAAE,EAAE;QACf,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;IACtB,CAAC,EAAE,GAAG,CAAC,EACP,EAAE,CACL,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,cAAc,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,SAAS,KAAK,IAAI;YAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/C,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,MAAM,eAAe,GAAG,GAAG,EAAE;QACzB,IAAI,CAAC,SAAS;YAAE,OAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC1D,IAAI,KAAK,KAAK,KAAK;YAAE,OAAO,eAAe,IAAI,gBAAgB,CAAC;QAChE,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO,eAAe,IAAI,WAAW,CAAC;QAC1D,OAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEF,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;IAE/B,MAAM,cAAc,GAAG,CACnB,yCACI,SAAS,EAAE,IAAA,oBAAU,EAAC,4CAAM,CAAC,SAAS,EAAE,EAAE,CAAC,4CAAM,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,KAAK,KAAK,EAAE,CAAC,4CAAM,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI,EAAE,CAAC,EACxH,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,EACX,WAAW,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,EAC/C,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAC1C,CACL,CAAC;IAEF,IAAI,KAAK,CAAC,WAAW,EAAE;QACnB,OAAO,cAAc,CAAC;KACzB;IAED,OAAO,8BAAC,iBAAO,IAAC,KAAK,EAAE,eAAe,EAAE,IAAG,cAAc,CAAW,CAAC;AACzE,CAAC,CAAC;AA7CW,QAAA,sBAAsB,0BA6CjC","sourcesContent":["import classNames from 'classnames';\nimport React, { FC, useCallback, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { Translation } from '@/translations/Translation';\nimport { debounce } from '@/util/Debounce';\n\nimport Tooltip from '../../Tooltip/Tooltip';\nimport styles from './BookingWizardPromoCode.module.scss';\n\ninterface BookingWizardPromoCodeProps {\n    promoCode?: string;\n    valid?: boolean;\n    onChange?: (promoCode: string) => void;\n\n    hideTooltip?: boolean;\n}\n\nexport const BookingWizardPromoCode: FC<BookingWizardPromoCodeProps> = (props) => {\n    const { promoCode, valid, onChange } = props;\n    const { t } = useTranslation();\n\n    const [code, setCode] = useState<string | undefined>('');\n\n    const debounceChange = useCallback(\n        debounce((value) => {\n            onChange?.(value);\n        }, 500),\n        []\n    );\n\n    useEffect(() => {\n        debounceChange(code);\n    }, [code]);\n\n    useEffect(() => {\n        if (promoCode !== code) setCode(promoCode);\n    }, [promoCode]);\n\n    const getTooltipTitle = () => {\n        if (!promoCode) return t(Translation.Step.Date.PromoCode);\n        if (valid === false) return `Promo Code '${code}' is not valid`;\n        if (valid === true) return `Promo Code '${code}' applied`;\n        return t(Translation.Step.Date.PromoCode);\n    };\n\n    console.log(props.hideTooltip);\n\n    const promocodeInput = (\n        <input\n            className={classNames(styles.container, { [styles['--error']]: valid === false, [styles['--success']]: valid === true })}\n            type=\"text\"\n            value={code}\n            placeholder={t(Translation.Step.Date.PromoCode)}\n            onChange={(e) => setCode(e.target.value)}\n        />\n    );\n\n    if (props.hideTooltip) {\n        return promocodeInput;\n    }\n\n    return <Tooltip title={getTooltipTitle()}>{promocodeInput}</Tooltip>;\n};\n"]}
+{"version":3,"file":"BookingWizardPromoCode.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4DAAoC;AACpC,+CAAoE;AACpE,iDAA+C;AAE/C,4DAAyD;AACzD,8CAA2C;AAE3C,oEAA4C;AAC5C,6FAA+D;AAC/D,8GAA0D;AASnD,MAAM,sBAAsB,GAAoC,CAAC,KAAK,EAAE,EAAE;IAC7E,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC7C,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAqB,EAAE,CAAC,CAAC;IAEzD,MAAM,cAAc,GAAG,IAAA,mBAAW,EAC9B,IAAA,mBAAQ,EAAC,CAAC,KAAK,EAAE,EAAE;QACf,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;IACtB,CAAC,EAAE,GAAG,CAAC,EACP,EAAE,CACL,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,cAAc,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,SAAS,KAAK,IAAI;YAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/C,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,MAAM,eAAe,GAAG,GAAG,EAAE;QACzB,IAAI,CAAC,SAAS;YAAE,OAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC1D,IAAI,KAAK,KAAK,KAAK;YAAE,OAAO,eAAe,IAAI,gBAAgB,CAAC;QAChE,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO,eAAe,IAAI,WAAW,CAAC;QAC1D,OAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CACnB,yCACI,SAAS,EAAE,IAAA,oBAAU,EAAC,4CAAM,CAAC,SAAS,EAAE,mCAAmB,CAAC,OAAO,CAAC,EAAE;YAClE,CAAC,4CAAM,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,KAAK,KAAK;YACpC,CAAC,4CAAM,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI;SACxC,CAAC,EACF,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,EACX,WAAW,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,EAC/C,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAC1C,CACL,CAAC;IAEF,IAAI,KAAK,CAAC,WAAW,EAAE;QACnB,OAAO,cAAc,CAAC;KACzB;IAED,OAAO,8BAAC,iBAAO,IAAC,KAAK,EAAE,eAAe,EAAE,IAAG,cAAc,CAAW,CAAC;AACzE,CAAC,CAAC;AA9CW,QAAA,sBAAsB,0BA8CjC","sourcesContent":["import classNames from 'classnames';\nimport React, { FC, useCallback, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { Translation } from '@/translations/Translation';\nimport { debounce } from '@/util/Debounce';\n\nimport Tooltip from '../../Tooltip/Tooltip';\nimport bookingWizardStyles from '../BookingWizard.module.scss';\nimport styles from './BookingWizardPromoCode.module.scss';\ninterface BookingWizardPromoCodeProps {\n    promoCode?: string;\n    valid?: boolean;\n    onChange?: (promoCode: string) => void;\n\n    hideTooltip?: boolean;\n}\n\nexport const BookingWizardPromoCode: FC<BookingWizardPromoCodeProps> = (props) => {\n    const { promoCode, valid, onChange } = props;\n    const { t } = useTranslation();\n\n    const [code, setCode] = useState<string | undefined>('');\n\n    const debounceChange = useCallback(\n        debounce((value) => {\n            onChange?.(value);\n        }, 500),\n        []\n    );\n\n    useEffect(() => {\n        debounceChange(code);\n    }, [code]);\n\n    useEffect(() => {\n        if (promoCode !== code) setCode(promoCode);\n    }, [promoCode]);\n\n    const getTooltipTitle = () => {\n        if (!promoCode) return t(Translation.Step.Date.PromoCode);\n        if (valid === false) return `Promo Code '${code}' is not valid`;\n        if (valid === true) return `Promo Code '${code}' applied`;\n        return t(Translation.Step.Date.PromoCode);\n    };\n\n    const promocodeInput = (\n        <input\n            className={classNames(styles.container, bookingWizardStyles['value'], {\n                [styles['--error']]: valid === false,\n                [styles['--success']]: valid === true,\n            })}\n            type=\"text\"\n            value={code}\n            placeholder={t(Translation.Step.Date.PromoCode)}\n            onChange={(e) => setCode(e.target.value)}\n        />\n    );\n\n    if (props.hideTooltip) {\n        return promocodeInput;\n    }\n\n    return <Tooltip title={getTooltipTitle()}>{promocodeInput}</Tooltip>;\n};\n"]}

package/dist/src/components/generic/DateRangePicker/DateRangePicker.d.ts

@@ -10,6 +10,12 @@ export interface DatePickerProps extends ShowYearOnCalendarProps {
     onEndDateChanged?: (date: dayjs.Dayjs) => void;
     fixedStartDate?: boolean;
     showMultipleMonths?: boolean;
+    /**
+     * When showMultipleMonths is set to true.
+     * Optional limit for how many months can be displayed via "Add More Dates".
+     */
+    monthCount?: number;
     theme?: EBookingWizardTheme;
+    className?: string;
 }
 export default function DateRangePicker(props: DatePickerProps): JSX.Element;

package/dist/src/components/generic/DateRangePicker/DateRangePicker.js

@@ -55,7 +55,7 @@ var EDateRangePickingState;
 })(EDateRangePickingState || (EDateRangePickingState = {}));
 function DateRangePicker(props) {
     var _a, _b;
-    const { showYearOnCalendar, yearDisplayOption } = props;
+    const { showYearOnCalendar, yearDisplayOption, showArrows = true, monthCount = 2 } = props;
     const [currentMonth, setCurrentMonth] = (0, react_1.useState)(props.selectedStartDate ? props.selectedStartDate : (0, dayjs_1.default)());
     const [selectedStartDate, setSelectedStartDate] = (0, react_1.useState)((_a = props.selectedStartDate) !== null && _a !== void 0 ? _a : (props.fixedStartDate ? (0, dayjs_1.default)() : null));
     const [selectedEndDate, setSelectedEndDate] = (0, react_1.useState)((_b = props.selectedEndDate) !== null && _b !== void 0 ? _b : null);
@@ -128,10 +128,11 @@ function DateRangePicker(props) {
         fixedStartDate: !!props.fixedStartDate,
         theme: props.theme,
     };
-    const printMonths = (0, react_1.useMemo)(() => (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(DateRangePickerMonth_1.default, { small: props.small, showingMonth: currentMonth, showYearOnCalendar: showYearOnCalendar, yearDisplayOption: yearDisplayOption }),
-        props.showMultipleMonths && (react_1.default.createElement(DateRangePickerMonth_1.default, { small: props.small, showingMonth: currentMonth.add(1, 'month'), showYearOnCalendar: showYearOnCalendar, yearDisplayOption: yearDisplayOption })))), [currentMonth, props.showMultipleMonths]);
-    const calendarClassNames = (0, classnames_1.default)(DateRangePicker_module_scss_1.default['roomstay-calendar'], {
+    const printMonths = (0, react_1.useMemo)(() => {
+        const monthsToRender = props.showMultipleMonths ? Array.from({ length: monthCount }, (_, index) => currentMonth.clone().add(index, 'month')) : [currentMonth];
+        return (react_1.default.createElement(react_1.default.Fragment, null, monthsToRender.map((month, index) => (react_1.default.createElement(DateRangePickerMonth_1.default, { key: index, small: props.small, showingMonth: month, showYearOnCalendar: showYearOnCalendar, yearDisplayOption: yearDisplayOption })))));
+    }, [currentMonth, props.showMultipleMonths, props.small, props.theme, showYearOnCalendar, yearDisplayOption, monthCount]);
+    const calendarClassNames = (0, classnames_1.default)(DateRangePicker_module_scss_1.default['roomstay-calendar'], props.className, {
         [DateRangePicker_module_scss_1.default['--small']]: props.small,
         [DateRangePicker_module_scss_1.default['--single']]: !props.showMultipleMonths,
         [DateRangePicker_module_scss_1.default['--specific']]: props.theme === BookingWizard_1.EBookingWizardTheme.Specific,
@@ -146,9 +147,9 @@ function DateRangePicker(props) {
     const iconBackground = props.theme === BookingWizard_1.EBookingWizardTheme.Specific ? undefined : Color_1.Color.Snow;
     return (react_1.default.createElement(DateRangePickerContext_1.DateRangePickerContext.Provider, { value: context },
         react_1.default.createElement("div", { ref: firstUpdate, className: calendarClassNames },
-            react_1.default.createElement("div", { className: DateRangePicker_module_scss_1.default['roomstay-calendar-navigation'] },
+            showArrows && (react_1.default.createElement("div", { className: DateRangePicker_module_scss_1.default['roomstay-calendar-navigation'] },
                 react_1.default.createElement(Icon_1.default, { className: DateRangePicker_module_scss_1.default['roomstay-calendar-arrow'], icon: Icon_1.IconType.ArrowLeft2, onClick: previousMonthOnClick, color: Color_1.Color.Navy, backgroundColor: iconBackground, borderRadius: "round", size: iconSize }),
-                react_1.default.createElement(Icon_1.default, { className: DateRangePicker_module_scss_1.default['roomstay-calendar-arrow'], icon: Icon_1.IconType.ArrowRight2, onClick: nextMonthOnClick, color: Color_1.Color.Navy, backgroundColor: iconBackground, borderRadius: "round", size: iconSize })),
+                react_1.default.createElement(Icon_1.default, { className: DateRangePicker_module_scss_1.default['roomstay-calendar-arrow'], icon: Icon_1.IconType.ArrowRight2, onClick: nextMonthOnClick, color: Color_1.Color.Navy, backgroundColor: iconBackground, borderRadius: "round", size: iconSize }))),
             printMonths)));
 }
 exports.default = DateRangePicker;

package/dist/src/components/generic/DateRangePicker/DateRangePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangePicker.js","sourceRoot":"/","sources":["src/components/generic/DateRangePicker/DateRangePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames';\nimport dayjs, { Dayjs } from 'dayjs';\nimport isSameOrAfter from 'dayjs/plugin/isSameOrAfter';\nimport isSameOrBefore from 'dayjs/plugin/isSameOrBefore';\nimport React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\n\nimport { DateRangePickerContext, DateRangePickerContextProps } from '@/components/generic/DateRangePicker/DateRangePickerContext';\nimport DateRangePickerMonth from '@/components/generic/DateRangePicker/DateRangePickerMonth';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { ShowYearOnCalendarProps } from '@/models/Api/HotelOverrideDTO';\nimport { Color } from '@/util/Color';\n\nimport { EBookingWizardTheme } from '../BookingWizard/BookingWizard';\nimport styles from './DateRangePicker.module.scss';\n\ndayjs.extend(isSameOrBefore);\ndayjs.extend(isSameOrAfter);\n\nexport interface DatePickerProps extends ShowYearOnCalendarProps {\n    selectedStartDate?: dayjs.Dayjs | null;\n    selectedEndDate?: dayjs.Dayjs | null;\n    // Includes default navigation arrows\n    showArrows?: boolean;\n    small?: boolean;\n    onStartDateChanged?: (date: dayjs.Dayjs) => void;\n    onEndDateChanged?: (date: dayjs.Dayjs) => void;\n    fixedStartDate?: boolean;\n    showMultipleMonths?: boolean;\n    theme?: EBookingWizardTheme;\n}\n\nenum EDateRangePickingState {\n    StartDate = 1,\n    EndDate = 2,\n}\n\nexport default function DateRangePicker(props: DatePickerProps) {\n    const { showYearOnCalendar, yearDisplayOption } = props;\n    const [currentMonth, setCurrentMonth] = useState(props.selectedStartDate ? props.selectedStartDate : dayjs());\n\n    const [selectedStartDate, setSelectedStartDate] = useState<Dayjs | null>(props.selectedStartDate ?? (props.fixedStartDate ? dayjs() : null));\n    const [selectedEndDate, setSelectedEndDate] = useState(props.selectedEndDate ?? null);\n\n    const [hoveringOverDate, setHoveringOverDate] = useState<Dayjs | null>(null);\n\n    const [pickingState, setPickingState] = useState(props.fixedStartDate ? EDateRangePickingState.EndDate : EDateRangePickingState.StartDate);\n\n    const onClickDate = async (newDate: dayjs.Dayjs) => {\n        let newPickingState: EDateRangePickingState | null = null;\n        switch (pickingState) {\n            default:\n            case EDateRangePickingState.StartDate:\n                newPickingState = EDateRangePickingState.EndDate;\n                setSelectedStartDate(newDate);\n                setSelectedEndDate(null);\n                break;\n            case EDateRangePickingState.EndDate:\n                if (newDate.isBefore(selectedStartDate)) {\n                    setSelectedStartDate(newDate);\n                    newPickingState = EDateRangePickingState.EndDate;\n                } else {\n                    newPickingState = EDateRangePickingState.StartDate;\n\n                    setHoveringOverDate(null);\n\n                    const nextAvailableDay = newDate;\n\n                    if (newDate.isSame(selectedStartDate)) {\n                        setSelectedEndDate(nextAvailableDay.add(1, 'day'));\n                    } else {\n                        setSelectedEndDate(nextAvailableDay);\n                    }\n                }\n\n                break;\n        }\n        setPickingState(props.fixedStartDate ? EDateRangePickingState.EndDate : newPickingState);\n    };\n\n    const onHoveredOverDay = (day: dayjs.Dayjs) => {\n        if (selectedStartDate && !selectedEndDate) {\n            setHoveringOverDate(day as Dayjs);\n        }\n    };\n\n    const firstUpdate = useRef<HTMLDivElement | null>(null);\n\n    useEffect(() => {\n        if (firstUpdate.current) {\n            firstUpdate.current = null;\n            return;\n        }\n\n        if (props.onStartDateChanged) {\n            props.onStartDateChanged(selectedStartDate as Dayjs);\n        }\n    }, [selectedStartDate]);\n\n    useLayoutEffect(() => {\n        if (firstUpdate.current) {\n            firstUpdate.current = null;\n            return;\n        }\n\n        if (props.onEndDateChanged) {\n            props.onEndDateChanged(selectedEndDate as Dayjs);\n        }\n    }, [selectedEndDate]);\n\n    const context: DateRangePickerContextProps = {\n        today: dayjs(),\n        todayInUnix: dayjs().unix(),\n        startDate: selectedStartDate,\n        endDate: selectedEndDate,\n\n        hoveredMonth: hoveringOverDate,\n\n        onHoverOver: onHoveredOverDay,\n        currentMonth,\n\n        onDayClicked: (date: dayjs.Dayjs) => {\n            onClickDate(date);\n        },\n        fixedStartDate: !!props.fixedStartDate,\n        theme: props.theme,\n    };\n\n    const printMonths = useMemo(\n        () => (\n            <>\n                <DateRangePickerMonth small={props.small} showingMonth={currentMonth} showYearOnCalendar={showYearOnCalendar} yearDisplayOption={yearDisplayOption} />\n                {props.showMultipleMonths && (\n                    <DateRangePickerMonth\n                        small={props.small}\n                        showingMonth={currentMonth.add(1, 'month')}\n                        showYearOnCalendar={showYearOnCalendar}\n                        yearDisplayOption={yearDisplayOption}\n                    />\n                )}\n            </>\n        ),\n        [currentMonth, props.showMultipleMonths]\n    );\n\n    const calendarClassNames = classNames(styles['roomstay-calendar'], {\n        [styles['--small']]: props.small,\n        [styles['--single']]: !props.showMultipleMonths,\n        [styles['--specific']]: props.theme === EBookingWizardTheme.Specific,\n    });\n    const previousMonthOnClick = () => {\n        setCurrentMonth(currentMonth.subtract(1, 'month'));\n    };\n    const nextMonthOnClick = () => {\n        setCurrentMonth(currentMonth.add(1, 'month'));\n    };\n\n    const iconSize = props.theme === EBookingWizardTheme.Specific ? '16px' : '24px';\n    const iconBackground = props.theme === EBookingWizardTheme.Specific ? undefined : Color.Snow;\n\n    return (\n        <DateRangePickerContext.Provider value={context}>\n            <div ref={firstUpdate} className={calendarClassNames}>\n                <div className={styles['roomstay-calendar-navigation']}>\n                    <Icon\n                        className={styles['roomstay-calendar-arrow']}\n                        icon={IconType.ArrowLeft2}\n                        onClick={previousMonthOnClick}\n                        color={Color.Navy}\n                        backgroundColor={iconBackground}\n                        borderRadius=\"round\"\n                        size={iconSize}\n                    />\n                    <Icon\n                        className={styles['roomstay-calendar-arrow']}\n                        icon={IconType.ArrowRight2}\n                        onClick={nextMonthOnClick}\n                        color={Color.Navy}\n                        backgroundColor={iconBackground}\n                        borderRadius=\"round\"\n                        size={iconSize}\n                    />\n                </div>\n                {printMonths}\n            </div>\n        </DateRangePickerContext.Provider>\n    );\n}\n"]}
+{"version":3,"file":"DateRangePicker.js","sourceRoot":"/","sources":["src/components/generic/DateRangePicker/DateRangePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames';\nimport dayjs, { Dayjs } from 'dayjs';\nimport isSameOrAfter from 'dayjs/plugin/isSameOrAfter';\nimport isSameOrBefore from 'dayjs/plugin/isSameOrBefore';\nimport React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\n\nimport { DateRangePickerContext, DateRangePickerContextProps } from '@/components/generic/DateRangePicker/DateRangePickerContext';\nimport DateRangePickerMonth from '@/components/generic/DateRangePicker/DateRangePickerMonth';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { ShowYearOnCalendarProps } from '@/models/Api/HotelOverrideDTO';\nimport { Color } from '@/util/Color';\n\nimport { EBookingWizardTheme } from '../BookingWizard/BookingWizard';\nimport styles from './DateRangePicker.module.scss';\n\ndayjs.extend(isSameOrBefore);\ndayjs.extend(isSameOrAfter);\n\nexport interface DatePickerProps extends ShowYearOnCalendarProps {\n    selectedStartDate?: dayjs.Dayjs | null;\n    selectedEndDate?: dayjs.Dayjs | null;\n    // Includes default navigation arrows\n    showArrows?: boolean;\n    small?: boolean;\n    onStartDateChanged?: (date: dayjs.Dayjs) => void;\n    onEndDateChanged?: (date: dayjs.Dayjs) => void;\n    fixedStartDate?: boolean;\n    showMultipleMonths?: boolean;\n    /**\n     * When showMultipleMonths is set to true.\n     * Optional limit for how many months can be displayed via \"Add More Dates\".\n     */\n    monthCount?: number;\n    theme?: EBookingWizardTheme;\n    className?: string;\n}\n\nenum EDateRangePickingState {\n    StartDate = 1,\n    EndDate = 2,\n}\n\nexport default function DateRangePicker(props: DatePickerProps) {\n    const { showYearOnCalendar, yearDisplayOption, showArrows = true, monthCount = 2 } = props;\n    const [currentMonth, setCurrentMonth] = useState(props.selectedStartDate ? props.selectedStartDate : dayjs());\n\n    const [selectedStartDate, setSelectedStartDate] = useState<Dayjs | null>(props.selectedStartDate ?? (props.fixedStartDate ? dayjs() : null));\n    const [selectedEndDate, setSelectedEndDate] = useState(props.selectedEndDate ?? null);\n\n    const [hoveringOverDate, setHoveringOverDate] = useState<Dayjs | null>(null);\n\n    const [pickingState, setPickingState] = useState(props.fixedStartDate ? EDateRangePickingState.EndDate : EDateRangePickingState.StartDate);\n\n    const onClickDate = async (newDate: dayjs.Dayjs) => {\n        let newPickingState: EDateRangePickingState | null = null;\n        switch (pickingState) {\n            default:\n            case EDateRangePickingState.StartDate:\n                newPickingState = EDateRangePickingState.EndDate;\n                setSelectedStartDate(newDate);\n                setSelectedEndDate(null);\n                break;\n            case EDateRangePickingState.EndDate:\n                if (newDate.isBefore(selectedStartDate)) {\n                    setSelectedStartDate(newDate);\n                    newPickingState = EDateRangePickingState.EndDate;\n                } else {\n                    newPickingState = EDateRangePickingState.StartDate;\n\n                    setHoveringOverDate(null);\n\n                    const nextAvailableDay = newDate;\n\n                    if (newDate.isSame(selectedStartDate)) {\n                        setSelectedEndDate(nextAvailableDay.add(1, 'day'));\n                    } else {\n                        setSelectedEndDate(nextAvailableDay);\n                    }\n                }\n\n                break;\n        }\n        setPickingState(props.fixedStartDate ? EDateRangePickingState.EndDate : newPickingState);\n    };\n\n    const onHoveredOverDay = (day: dayjs.Dayjs) => {\n        if (selectedStartDate && !selectedEndDate) {\n            setHoveringOverDate(day as Dayjs);\n        }\n    };\n\n    const firstUpdate = useRef<HTMLDivElement | null>(null);\n\n    useEffect(() => {\n        if (firstUpdate.current) {\n            firstUpdate.current = null;\n            return;\n        }\n\n        if (props.onStartDateChanged) {\n            props.onStartDateChanged(selectedStartDate as Dayjs);\n        }\n    }, [selectedStartDate]);\n\n    useLayoutEffect(() => {\n        if (firstUpdate.current) {\n            firstUpdate.current = null;\n            return;\n        }\n\n        if (props.onEndDateChanged) {\n            props.onEndDateChanged(selectedEndDate as Dayjs);\n        }\n    }, [selectedEndDate]);\n\n    const context: DateRangePickerContextProps = {\n        today: dayjs(),\n        todayInUnix: dayjs().unix(),\n        startDate: selectedStartDate,\n        endDate: selectedEndDate,\n\n        hoveredMonth: hoveringOverDate,\n\n        onHoverOver: onHoveredOverDay,\n        currentMonth,\n\n        onDayClicked: (date: dayjs.Dayjs) => {\n            onClickDate(date);\n        },\n        fixedStartDate: !!props.fixedStartDate,\n        theme: props.theme,\n    };\n\n    const printMonths = useMemo(() => {\n        const monthsToRender = props.showMultipleMonths ? Array.from({ length: monthCount }, (_, index) => currentMonth.clone().add(index, 'month')) : [currentMonth];\n\n        return (\n            <>\n                {monthsToRender.map((month, index) => (\n                    <DateRangePickerMonth key={index} small={props.small} showingMonth={month} showYearOnCalendar={showYearOnCalendar} yearDisplayOption={yearDisplayOption} />\n                ))}\n            </>\n        );\n    }, [currentMonth, props.showMultipleMonths, props.small, props.theme, showYearOnCalendar, yearDisplayOption, monthCount]);\n\n    const calendarClassNames = classNames(styles['roomstay-calendar'], props.className, {\n        [styles['--small']]: props.small,\n        [styles['--single']]: !props.showMultipleMonths,\n        [styles['--specific']]: props.theme === EBookingWizardTheme.Specific,\n    });\n    const previousMonthOnClick = () => {\n        setCurrentMonth(currentMonth.subtract(1, 'month'));\n    };\n    const nextMonthOnClick = () => {\n        setCurrentMonth(currentMonth.add(1, 'month'));\n    };\n\n    const iconSize = props.theme === EBookingWizardTheme.Specific ? '16px' : '24px';\n    const iconBackground = props.theme === EBookingWizardTheme.Specific ? undefined : Color.Snow;\n\n    return (\n        <DateRangePickerContext.Provider value={context}>\n            <div ref={firstUpdate} className={calendarClassNames}>\n                {showArrows && (\n                    <div className={styles['roomstay-calendar-navigation']}>\n                        <Icon\n                            className={styles['roomstay-calendar-arrow']}\n                            icon={IconType.ArrowLeft2}\n                            onClick={previousMonthOnClick}\n                            color={Color.Navy}\n                            backgroundColor={iconBackground}\n                            borderRadius=\"round\"\n                            size={iconSize}\n                        />\n                        <Icon\n                            className={styles['roomstay-calendar-arrow']}\n                            icon={IconType.ArrowRight2}\n                            onClick={nextMonthOnClick}\n                            color={Color.Navy}\n                            backgroundColor={iconBackground}\n                            borderRadius=\"round\"\n                            size={iconSize}\n                        />\n                    </div>\n                )}\n                {printMonths}\n            </div>\n        </DateRangePickerContext.Provider>\n    );\n}\n"]}

package/dist/src/components/generic/DateRangePicker/FloatingDateRangePicker.d.ts

@@ -15,6 +15,8 @@ export interface FloatingDateRangePickerProps extends Omit<DatePickerProps, 'sel
         placement?: Placement;
         fallbackPlacements?: Placement;
     };
+    notes?: React.ReactNode;
+    onOverlayOpenChange?: (isOpen: boolean) => void;
 }
 export interface FloatingDateRangePickerHandle {
     closePicker: () => void;

package/dist/src/components/generic/DateRangePicker/FloatingDateRangePicker.js

@@ -45,7 +45,7 @@ const BookingWizard_1 = require("../BookingWizard/BookingWizard");
 const DateRangePicker_module_scss_1 = __importDefault(require("./DateRangePicker.module.scss"));
 const FloatingDateRangePicker = react_1.default.forwardRef((props, ref) => {
     var _a, _b;
-    const { children, startDate: startDateProp, endDate: endDateProp, selectedDateChanged: selectedDateChangedProp, className, overlay, showYearOnCalendar, yearDisplayOption } = props, DatePickerProps = __rest(props, ["children", "startDate", "endDate", "selectedDateChanged", "className", "overlay", "showYearOnCalendar", "yearDisplayOption"]);
+    const { children, notes, startDate: startDateProp, endDate: endDateProp, selectedDateChanged: selectedDateChangedProp, className, overlay, showYearOnCalendar, yearDisplayOption, onOverlayOpenChange } = props, DatePickerProps = __rest(props, ["children", "notes", "startDate", "endDate", "selectedDateChanged", "className", "overlay", "showYearOnCalendar", "yearDisplayOption", "onOverlayOpenChange"]);
     const [isOpen, setIsOpen] = (0, react_1.useState)(false);
     const [startDate, setStartDate] = (0, react_1.useState)(null);
     const thisElement = (0, react_1.useRef)(null);
@@ -71,6 +71,12 @@ const FloatingDateRangePicker = react_1.default.forwardRef((props, ref) => {
     const onOverlayOpen = () => {
         setIsOpen(true);
     };
+    (0, react_1.useEffect)(() => {
+        onOverlayOpenChange === null || onOverlayOpenChange === void 0 ? void 0 : onOverlayOpenChange(isOpen);
+        return () => {
+            onOverlayOpenChange === null || onOverlayOpenChange === void 0 ? void 0 : onOverlayOpenChange(false);
+        };
+    }, [isOpen]);
     const inner = (react_1.default.createElement("div", { className: "d-flex align-items-center flex-column" },
         react_1.default.createElement(DateRangePicker_1.default, Object.assign({ selectedStartDate: startDateProp, selectedEndDate: endDateProp, onStartDateChanged: onStartDateChangedHandler, onEndDateChanged: selectedDateChanged, showYearOnCalendar: showYearOnCalendar, yearDisplayOption: yearDisplayOption }, DatePickerProps))));
     return (react_1.default.createElement(react_1.default.Fragment, null,
@@ -78,8 +84,11 @@ const FloatingDateRangePicker = react_1.default.forwardRef((props, ref) => {
         react_1.default.createElement(Overlay_1.Overlay, Object.assign({ offset: props.overlayOffset, open: isOpen, onClose: onOverlayClose, container: props.container || ((_b = (_a = thisElement.current) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement), followElement: props.container || thisElement.current }, (overlay || {}), { className: (0, classnames_1.default)(DateRangePicker_module_scss_1.default['floating-roomstay-calendar'], {
                 [DateRangePicker_module_scss_1.default['--small']]: DatePickerProps.small,
                 [DateRangePicker_module_scss_1.default['--specific']]: props.theme === BookingWizard_1.EBookingWizardTheme.Specific,
+                [DateRangePicker_module_scss_1.default['--images']]: props.theme === BookingWizard_1.EBookingWizardTheme.Images,
                 [DateRangePicker_module_scss_1.default['--single']]: !DatePickerProps.showMultipleMonths,
-            }) }), inner)));
+            }) }),
+            inner,
+            notes)));
 });
 FloatingDateRangePicker.displayName = 'FloatingDateRangePicker';
 exports.default = FloatingDateRangePicker;

package/dist/src/components/generic/DateRangePicker/FloatingDateRangePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingDateRangePicker.js","sourceRoot":"/","sources":["src/components/generic/DateRangePicker/FloatingDateRangePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport * as dayjs from 'dayjs';\nimport React, { useRef, useState } from 'react';\n\nimport DateRangePicker, { DatePickerProps } from '@/components/generic/DateRangePicker/DateRangePicker';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\n\nimport { EBookingWizardTheme } from '../BookingWizard/BookingWizard';\nimport styles from './DateRangePicker.module.scss';\n\nexport interface FloatingDateRangePickerProps extends Omit<DatePickerProps, 'selectedStartDate' | 'selectedEndDate' | 'onStartDateChanged' | 'onEndDateChanged'> {\n    children?: React.ReactNode;\n    startDate?: dayjs.Dayjs | null;\n    endDate?: dayjs.Dayjs | null;\n    overlayOffset?: [number, number];\n    fixedStartDate?: boolean;\n    container?: HTMLElement;\n\n    selectedDateChanged?: (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => void;\n\n    className?: string;\n\n    overlay?: {\n        placement?: Placement;\n        fallbackPlacements?: Placement;\n    };\n}\n\nexport interface FloatingDateRangePickerHandle {\n    closePicker: () => void;\n    openPicker: () => void;\n    toggle: () => void;\n}\n\nconst FloatingDateRangePicker = React.forwardRef<FloatingDateRangePickerHandle, FloatingDateRangePickerProps>((props, ref) => {\n    const {\n        children,\n        startDate: startDateProp,\n        endDate: endDateProp,\n        selectedDateChanged: selectedDateChangedProp,\n        className,\n        overlay,\n        showYearOnCalendar,\n        yearDisplayOption,\n        ...DatePickerProps\n    } = props;\n\n    const [isOpen, setIsOpen] = useState(false);\n\n    const [startDate, setStartDate] = useState<dayjs.Dayjs | null>(null);\n\n    const thisElement = useRef<HTMLDivElement | null>(null);\n\n    React.useImperativeHandle(\n        ref,\n        () => ({\n            closePicker: onOverlayClose,\n            openPicker: onOverlayOpen,\n            toggle: () => setIsOpen(!isOpen),\n        }),\n        []\n    );\n\n    const selectedDateChanged = (endDate: dayjs.Dayjs) => {\n        if (selectedDateChangedProp && startDate) {\n            selectedDateChangedProp(startDate, endDate);\n        }\n\n        if (endDate) {\n            setIsOpen(false);\n        }\n    };\n\n    const onStartDateChangedHandler = (date: any) => {\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            <DateRangePicker\n                selectedStartDate={startDateProp}\n                selectedEndDate={endDateProp}\n                onStartDateChanged={onStartDateChangedHandler}\n                onEndDateChanged={selectedDateChanged}\n                showYearOnCalendar={showYearOnCalendar}\n                yearDisplayOption={yearDisplayOption}\n                {...DatePickerProps}\n            />\n        </div>\n    );\n\n    return (\n        <>\n            <div ref={thisElement} className={className} onClick={onOverlayOpen}>\n                {children}\n            </div>\n            <Overlay\n                offset={props.overlayOffset}\n                open={isOpen}\n                onClose={onOverlayClose}\n                container={props.container || thisElement.current?.parentElement?.parentElement}\n                followElement={props.container || thisElement.current}\n                {...(overlay || {})}\n                className={classNames(styles['floating-roomstay-calendar'], {\n                    [styles['--small']]: DatePickerProps.small,\n                    [styles['--specific']]: props.theme === EBookingWizardTheme.Specific,\n                    [styles['--single']]: !DatePickerProps.showMultipleMonths,\n                })}\n            >\n                {inner}\n            </Overlay>\n        </>\n    );\n});\n\nFloatingDateRangePicker.displayName = 'FloatingDateRangePicker';\n\nexport default FloatingDateRangePicker;\n"]}
+{"version":3,"file":"FloatingDateRangePicker.js","sourceRoot":"/","sources":["src/components/generic/DateRangePicker/FloatingDateRangePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport * as dayjs from 'dayjs';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport DateRangePicker, { DatePickerProps } from '@/components/generic/DateRangePicker/DateRangePicker';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\n\nimport { EBookingWizardTheme } from '../BookingWizard/BookingWizard';\nimport styles from './DateRangePicker.module.scss';\n\nexport interface FloatingDateRangePickerProps extends Omit<DatePickerProps, 'selectedStartDate' | 'selectedEndDate' | 'onStartDateChanged' | 'onEndDateChanged'> {\n    children?: React.ReactNode;\n    startDate?: dayjs.Dayjs | null;\n    endDate?: dayjs.Dayjs | null;\n    overlayOffset?: [number, number];\n    fixedStartDate?: boolean;\n    container?: HTMLElement;\n\n    selectedDateChanged?: (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => void;\n\n    className?: string;\n\n    overlay?: {\n        placement?: Placement;\n        fallbackPlacements?: Placement;\n    };\n    notes?: React.ReactNode;\n    onOverlayOpenChange?: (isOpen: boolean) => void;\n}\n\nexport interface FloatingDateRangePickerHandle {\n    closePicker: () => void;\n    openPicker: () => void;\n    toggle: () => void;\n}\n\nconst FloatingDateRangePicker = React.forwardRef<FloatingDateRangePickerHandle, FloatingDateRangePickerProps>((props, ref) => {\n    const {\n        children,\n        notes,\n        startDate: startDateProp,\n        endDate: endDateProp,\n        selectedDateChanged: selectedDateChangedProp,\n        className,\n        overlay,\n        showYearOnCalendar,\n        yearDisplayOption,\n        onOverlayOpenChange,\n        ...DatePickerProps\n    } = props;\n\n    const [isOpen, setIsOpen] = useState(false);\n\n    const [startDate, setStartDate] = useState<dayjs.Dayjs | null>(null);\n\n    const thisElement = useRef<HTMLDivElement | null>(null);\n\n    React.useImperativeHandle(\n        ref,\n        () => ({\n            closePicker: onOverlayClose,\n            openPicker: onOverlayOpen,\n            toggle: () => setIsOpen(!isOpen),\n        }),\n        []\n    );\n\n    const selectedDateChanged = (endDate: dayjs.Dayjs) => {\n        if (selectedDateChangedProp && startDate) {\n            selectedDateChangedProp(startDate, endDate);\n        }\n\n        if (endDate) {\n            setIsOpen(false);\n        }\n    };\n\n    const onStartDateChangedHandler = (date: any) => {\n        setStartDate(date);\n    };\n\n    const onOverlayClose = () => {\n        setIsOpen(false);\n    };\n\n    const onOverlayOpen = () => {\n        setIsOpen(true);\n    };\n\n    useEffect(() => {\n        onOverlayOpenChange?.(isOpen);\n        return () => {\n            onOverlayOpenChange?.(false);\n        };\n    }, [isOpen]);\n\n    const inner = (\n        <div className=\"d-flex align-items-center flex-column\">\n            <DateRangePicker\n                selectedStartDate={startDateProp}\n                selectedEndDate={endDateProp}\n                onStartDateChanged={onStartDateChangedHandler}\n                onEndDateChanged={selectedDateChanged}\n                showYearOnCalendar={showYearOnCalendar}\n                yearDisplayOption={yearDisplayOption}\n                {...DatePickerProps}\n            />\n        </div>\n    );\n\n    return (\n        <>\n            <div ref={thisElement} className={className} onClick={onOverlayOpen}>\n                {children}\n            </div>\n            <Overlay\n                offset={props.overlayOffset}\n                open={isOpen}\n                onClose={onOverlayClose}\n                container={props.container || thisElement.current?.parentElement?.parentElement}\n                followElement={props.container || thisElement.current}\n                {...(overlay || {})}\n                className={classNames(styles['floating-roomstay-calendar'], {\n                    [styles['--small']]: DatePickerProps.small,\n                    [styles['--specific']]: props.theme === EBookingWizardTheme.Specific,\n                    [styles['--images']]: props.theme === EBookingWizardTheme.Images,\n                    [styles['--single']]: !DatePickerProps.showMultipleMonths,\n                })}\n            >\n                {inner}\n                {notes}\n            </Overlay>\n        </>\n    );\n});\n\nFloatingDateRangePicker.displayName = 'FloatingDateRangePicker';\n\nexport default FloatingDateRangePicker;\n"]}

package/dist/src/components/steps/room/UserSearchSummary/UserSearchSummaryRow.js

@@ -138,6 +138,12 @@ const UserSearchSummaryRow = ({ row, index }) => {
         layout: 'booking-summary',
         theme: BookingWizard_1.EBookingWizardTheme.Default,
         type: sizeMediumDown ? 'top-sheet' : 'popup',
+        isImagesTheme: false,
+        isImagesThemeMobile: false,
+        activeSection: null,
+        onNextHandler: (currentSection) => { },
+        onPrevHandler: (currentSection) => { },
+        stateSections: BookingWizard_1.StateSectionsDefault,
     };
     if (isValid && !isSelectedRow) {
         return (react_1.default.createElement("div", { className: `${UserSearchSummaryRow_module_scss_1.default['user-completed-summary-row']} u-flex w-100` },
@@ -189,7 +195,7 @@ const UserSearchSummaryRow = ({ row, index }) => {
             react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__group'] },
                 react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__input'] },
                     react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-card-item'] },
-                        react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-card-label'] }, t(Translation_1.Translation.Misc.Who)),
+                        react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-card-label'] }, t(Translation_1.Translation.Misc.Guests)),
                         react_1.default.createElement(BookingWizardContext_1.BookingWizardContext.Provider, { value: bookingWizardContext },
                             react_1.default.createElement(BookingWizardGuestSelector_1.BookingWizardGuestSelector, { defaultValue: {
                                     adults: row.getAdults(),

package/dist/src/components/steps/room/UserSearchSummary/UserSearchSummaryRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserSearchSummaryRow.js","sourceRoot":"/","sources":["src/components/steps/room/UserSearchSummary/UserSearchSummaryRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { default as cx } from 'classnames';\nimport dayjs from 'dayjs';\nimport React, { useContext, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport BEButton from '@/components/generic/BEButton';\nimport FloatingDatePicker from '@/components/generic/date/FloatingDatePicker';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Pill, { PillType } from '@/components/generic/Pill';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport { useSearchScopeHook } from '@/hooks/useSearchScopeHook';\nimport BasketRow from '@/models/BasketRow';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\nimport DataLayer, { InteractionStep, InteractionType } from '@/util/DataLayer';\nimport ScreenSize from '@/util/ScreenSize';\nimport StringHelper from '@/util/StringHelper';\n\nimport { EBookingWizardTheme } from '../../../generic/BookingWizard/BookingWizard';\nimport { BookingWizardContext, BookingWizardContextType, BookingWizardOnBooking } from '../../../generic/BookingWizard/BookingWizardContext';\nimport { BookingWizardGuestSelector } from '../../../generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector';\nimport { UserSearchSummaryPromocodeInput } from './UserSearchSummaryPromocodeInput';\nimport styles from './UserSearchSummaryRow.module.scss';\n\ntype UserSearchSummaryRowProps = {\n    row: BasketRow;\n    index: number;\n};\n\nexport const UserSearchSummaryRow = ({ row, index }: UserSearchSummaryRowProps) => {\n    const { t } = useTranslation();\n    const removeButtonRef = useRef<any>();\n    const { isAccent2ColorDark, hotel } = useCurrentHotel();\n\n    const { selectedBasketRow, currentBasketRows, updateBasketRow, removeBasketRow, selectBasketRow } = useContext(BasketContext);\n\n    const engineContext = useContext(BookingEngineContext);\n\n    const isSelectedRow = useMemo(() => {\n        return selectedBasketRow?.getID() === row?.getID();\n    }, [selectedBasketRow]);\n\n    const canRemove = currentBasketRows.length > 1;\n    const removeRoomOnClick = () => {\n        DataLayer.instance.sendInteraction('Remove Room', InteractionType.BUTTON, InteractionStep.ROOMS);\n        removeBasketRow(row);\n    };\n\n    const updatePeopleValues = ({ adults, children, infants, updatedPromoCode }: { adults?: number; children?: number; infants?: number; updatedPromoCode?: string }) => {\n        if (adults && adults !== row.getAdults()) {\n            DataLayer.instance.sendInteraction('Guests', InteractionType.NUMBER_INPUT, InteractionStep.ROOMS);\n            row.setAdults(adults);\n        }\n\n        if ((children || children === 0) && children !== row.getChildren()) {\n            DataLayer.instance.sendInteraction('Guests', InteractionType.NUMBER_INPUT, InteractionStep.ROOMS);\n            row.setChildren(children);\n        }\n\n        if ((infants || infants === 0) && infants !== row.getInfants()) {\n            DataLayer.instance.sendInteraction('Guests', InteractionType.NUMBER_INPUT, InteractionStep.ROOMS);\n            row.setInfants(infants);\n        }\n\n        if ((updatedPromoCode || updatedPromoCode === '') && updatedPromoCode !== row.getPromoCode()) {\n            DataLayer.instance.sendInteraction('Promo Code', InteractionType.FORM_FIELD, InteractionStep.ROOMS);\n            row.setPromoCode(updatedPromoCode);\n        }\n\n        updateBasketRow(row);\n    };\n\n    const updatePromoCode = (code: string) => {\n        DataLayer.instance.sendInteraction('Promo Code', InteractionType.FORM_FIELD, InteractionStep.ROOMS);\n\n        if (selectedBasketRow) {\n            selectedBasketRow.setPromoCode(code);\n            updateBasketRow(selectedBasketRow);\n        }\n    };\n\n    const updateDateValues = (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => {\n        if (startDate) {\n            row.setStartDate(startDate);\n        }\n\n        if (endDate) {\n            row.setEndDate(endDate);\n        }\n\n        updateBasketRow(row);\n    };\n\n    const setGuest = (guests: BookingWizardOnBooking['guests']) => {\n        updatePeopleValues({\n            adults: guests.adults,\n            children: guests.children,\n            infants: guests.infants,\n        });\n    };\n\n    const changePromoCode = (val: any) => {\n        updatePromoCode(val);\n    };\n\n    const onClickCancelRoomChanges = () => {\n        DataLayer.instance.sendInteraction('Cancel Room Changes', InteractionType.LINK, InteractionStep.ROOMS);\n        selectBasketRow(null);\n    };\n    const onClickEditRoom = () => {\n        DataLayer.instance.sendInteraction('Edit Room', InteractionType.LINK, InteractionStep.ROOMS);\n        selectBasketRow(row);\n    };\n\n    const isValid = row.isValid();\n    const isLargerThanLarge = engineContext.screenSize > ScreenSize.ExtraLarge;\n\n    const sizeMediumDown = engineContext.screenSize <= ScreenSize.Medium;\n\n    const shouldTextBeWhite = (isValid ? isAccent2ColorDark : false) && isSelectedRow;\n\n    const textColor = shouldTextBeWhite ? Color.White : undefined;\n\n    const [guests, setGuests] = useState({\n        adults: row?.getAdults(),\n        children: row?.getChildren(),\n        infants: row?.getInfants(),\n    });\n\n    const { getMaxSelectableAdults, showChildren, getMaxSelectableInfants, getMaxSelectableChildren } = useSearchScopeHook();\n    const maxAdults = getMaxSelectableAdults({ adults: guests.adults, children: guests.children });\n    const maxChildren = getMaxSelectableChildren({ adults: guests.adults });\n    const maxInfants = getMaxSelectableInfants();\n\n    const removeButton = (\n        <Tooltip\n            title={canRemove ? 'Remove this room' : 'Cannot remove this room as at least one must be selected.'}\n            followElement={removeButtonRef?.current}\n            wrapperClasses={styles['user-search-summary-row__remove-tooltip']}\n        >\n            <div className={styles['user-search-summary-row__remove']} onClick={removeRoomOnClick} ref={removeButtonRef}>\n                <BEButton textColor={textColor} isText icon={IconType.Close} iconPosition=\"right\" stopIconAnimation disabled={!canRemove} onClick={removeRoomOnClick} />\n            </div>\n        </Tooltip>\n    );\n\n    const bookingWizardContext: BookingWizardContextType = {\n        layout: 'booking-summary',\n        theme: EBookingWizardTheme.Default,\n        type: sizeMediumDown ? 'top-sheet' : 'popup',\n    };\n\n    if (isValid && !isSelectedRow) {\n        return (\n            <div className={`${styles['user-completed-summary-row']} u-flex w-100`}>\n                <div className=\"u-flex justify-content-start\">\n                    <div className=\"u-flex flex-column\">\n                        <span>\n                            <Text inline={isLargerThanLarge}>\n                                <strong>{row.getRoom().name}</strong>\n                            </Text>\n                            <Text inline={isLargerThanLarge} type={isLargerThanLarge ? TextType.Body : TextType.Small}>\n                                <span className=\"u-marg-left--light@xl\">\n                                    {StringHelper.pluralWithDictAndCount(row.getAdults(), Translation.Step.Date.Adult, t)}\n                                    {showChildren ? (\n                                        <>\n                                            ,&nbsp;\n                                            {StringHelper.pluralWithDictAndCount(row.getChildren(), Translation.Step.Date.Child, t)}\n                                        </>\n                                    ) : null}\n                                    {hotel?.childConfiguration?.supportInfants ? (\n                                        <>\n                                            ,&nbsp;\n                                            {StringHelper.pluralWithDictAndCount(row.getInfants(), Translation.Step.Date.Infant, t)}\n                                        </>\n                                    ) : null}\n                                </span>\n                            </Text>\n                        </span>\n                        <Text type={TextType.Caption} color={Color.DarkGrey}>\n                            <strong>{row.getStayDateRange('ddd, MMM D, YYYY', ' -')}</strong>\n                        </Text>\n                    </div>\n                    {row.isPromoCodeValid() && (\n                        <div className=\"u-marg-left d-flex align-items-center\">\n                            <Pill type={PillType.Success} icon={IconType.Money}>\n                                {row.getPromoCode()}\n                            </Pill>\n                        </div>\n                    )}\n                </div>\n                <div className=\"u-flex align-items-center\">\n                    <div className=\"u-flex align-items-center room-builder-progress--edit\">\n                        <Tooltip title={t(Translation.Step.Room.EditThisRoom)}>\n                            <div className=\"u-flex align-items-center\">\n                                <BEButton isText size=\"tiny\" onClick={onClickEditRoom}>\n                                    {t(Translation.Misc.Edit).toUpperCase()}\n                                </BEButton>\n                            </div>\n                        </Tooltip>\n                    </div>\n                    {removeButton}\n                </div>\n            </div>\n        );\n    }\n\n    return (\n        <div\n            className={cx(styles['user-search-summary-row'], {\n                [styles['--selected']]: isSelectedRow,\n                [styles['--valid']]: isValid,\n                [styles['--has-dark-bg']]: shouldTextBeWhite,\n            })}\n        >\n            <div className={styles['user-search-summary-row--inner']}>\n                <div className={styles['user-search-summary-row__group']}>\n                    <FloatingDatePicker\n                        startDate={row.getStartDate()}\n                        endDate={row.getEndDate()}\n                        selectedDateChanged={updateDateValues}\n                        isAboveNav\n                        className={styles['user-search-summary-row__input']}\n                    >\n                        <Tooltip disabled={!isSelectedRow} title={t(Translation.Step.Date.SelectArrivalAndDepartureDatesByClickingHere)}>\n                            <div className=\"u-flex align-items-center justify-content-center u-w-100@xl- u-cursor-pointer\">\n                                <div className={styles['user-search-summary-card-date-range']}>\n                                    <div className={styles['user-search-summary-card-date-range--item']}>\n                                        <div className={styles['user-search-summary-card-label']}>{t(Translation.Misc.CheckIn)}</div>\n                                        <Text color={shouldTextBeWhite ? Color.White : Color.Accent} bold className=\"u-nowrap\">\n                                            {row.getArrivalDate()}\n                                        </Text>\n                                    </div>\n                                    <div className={styles['user-search-summary-card-date-range--icon']}>\n                                        <Icon icon={IconType.ArrowRight2} color={shouldTextBeWhite ? Color.White : undefined} />\n                                    </div>\n                                    <div className={styles['user-search-summary-card-date-range--item']}>\n                                        <div className={styles['user-search-summary-card-label']}>{t(Translation.Misc.CheckOut)}</div>\n                                        <Text color={shouldTextBeWhite ? Color.White : Color.Accent} bold className=\"u-nowrap\">\n                                            {row.getDepartureDate()}\n                                        </Text>\n                                    </div>\n                                </div>\n                            </div>\n                        </Tooltip>\n                    </FloatingDatePicker>\n                </div>\n                <div className={styles['user-search-summary-row__divider']} />\n                <div className={styles['user-search-summary-row__group']}>\n                    <div className={styles['user-search-summary-row__input']}>\n                        <div className={styles['user-search-summary-card-item']}>\n                            <div className={styles['user-search-summary-card-label']}>{t(Translation.Misc.Who)}</div>\n                            <BookingWizardContext.Provider value={bookingWizardContext}>\n                                <BookingWizardGuestSelector\n                                    defaultValue={{\n                                        adults: row.getAdults(),\n                                        children: row.getChildren(),\n                                        infants: row.getInfants(),\n                                    }}\n                                    onChange={setGuest}\n                                    onEditingChange={setGuests}\n                                    disableChild={!showChildren}\n                                    showInfants={hotel?.childConfiguration?.supportInfants === true}\n                                    maxAdults={maxAdults}\n                                    maxChildren={maxChildren}\n                                    maxInfants={maxInfants}\n                                    disableRoom\n                                    ageRange={{\n                                        child: hotel?.childConfiguration?.childRange,\n                                        infant: hotel?.childConfiguration?.infantRange,\n                                    }}\n                                />\n                            </BookingWizardContext.Provider>\n                        </div>\n                    </div>\n                </div>\n                <div className={styles['user-search-summary-row__divider']} />\n                <div className={styles['user-search-summary-row__group']}>\n                    <div className={styles['user-search-summary-row__input']}>\n                        <UserSearchSummaryPromocodeInput row={row} onChange={changePromoCode} disabled={!isSelectedRow} promocodeTextColor={textColor} useUpdatedDesign />\n                    </div>\n                </div>\n            </div>\n\n            <div className={styles['user-search-summary-row--buttons']}>\n                {isSelectedRow && isValid ? (\n                    <BEButton isText size=\"tiny\" onClick={onClickCancelRoomChanges} textColor={textColor}>\n                        {t(Translation.Misc.Cancel)}\n                    </BEButton>\n                ) : (\n                    removeButton\n                )}\n            </div>\n        </div>\n    );\n};\n"]}
+{"version":3,"file":"UserSearchSummaryRow.js","sourceRoot":"/","sources":["src/components/steps/room/UserSearchSummary/UserSearchSummaryRow.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iDAAyE;AACzE,2CAAkD;AAClD,4DAA2C;AAE3C,+CAAqE;AACrE,iDAA+C;AAE/C,6EAAqD;AACrD,sGAA8E;AAC9E,uEAAgE;AAChE,kEAA2D;AAC3D,kEAA2D;AAC3D,mFAA2D;AAC3D,mEAAgE;AAEhE,4DAAyD;AACzD,wCAAqC;AACrC,8DAA+E;AAC/E,mEAA2C;AAC3C,uEAA+C;AAE/C,gFAAgI;AAChI,8FAA6I;AAC7I,qIAAkI;AAClI,uFAAoF;AACpF,0GAAwD;AAOjD,MAAM,oBAAoB,GAAG,CAAC,EAAE,GAAG,EAAE,KAAK,EAA6B,EAAE,EAAE;;IAC9E,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,eAAe,GAAG,IAAA,cAAM,GAAO,CAAC;IACtC,MAAM,EAAE,kBAAkB,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IAExD,MAAM,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,GAAG,IAAA,kBAAU,EAAC,wBAAa,CAAC,CAAC;IAE9H,MAAM,aAAa,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IAEvD,MAAM,aAAa,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC/B,OAAO,CAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,KAAK,EAAE,OAAK,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,KAAK,EAAE,CAAA,CAAC;IACvD,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,MAAM,SAAS,GAAG,iBAAiB,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC3B,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,aAAa,EAAE,2BAAe,CAAC,MAAM,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QACjG,eAAe,CAAC,GAAG,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,gBAAgB,EAAuF,EAAE,EAAE;QAChK,IAAI,MAAM,IAAI,MAAM,KAAK,GAAG,CAAC,SAAS,EAAE,EAAE;YACtC,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,YAAY,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;YAClG,GAAG,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;SACzB;QAED,IAAI,CAAC,QAAQ,IAAI,QAAQ,KAAK,CAAC,CAAC,IAAI,QAAQ,KAAK,GAAG,CAAC,WAAW,EAAE,EAAE;YAChE,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,YAAY,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;YAClG,GAAG,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;SAC7B;QAED,IAAI,CAAC,OAAO,IAAI,OAAO,KAAK,CAAC,CAAC,IAAI,OAAO,KAAK,GAAG,CAAC,UAAU,EAAE,EAAE;YAC5D,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,YAAY,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;YAClG,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;SAC3B;QAED,IAAI,CAAC,gBAAgB,IAAI,gBAAgB,KAAK,EAAE,CAAC,IAAI,gBAAgB,KAAK,GAAG,CAAC,YAAY,EAAE,EAAE;YAC1F,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,YAAY,EAAE,2BAAe,CAAC,UAAU,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;YACpG,GAAG,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;SACtC;QAED,eAAe,CAAC,GAAG,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,IAAY,EAAE,EAAE;QACrC,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,YAAY,EAAE,2BAAe,CAAC,UAAU,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QAEpG,IAAI,iBAAiB,EAAE;YACnB,iBAAiB,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;YACrC,eAAe,CAAC,iBAAiB,CAAC,CAAC;SACtC;IACL,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,SAAsB,EAAE,OAAoB,EAAE,EAAE;QACtE,IAAI,SAAS,EAAE;YACX,GAAG,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;SAC/B;QAED,IAAI,OAAO,EAAE;YACT,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;SAC3B;QAED,eAAe,CAAC,GAAG,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,CAAC,MAAwC,EAAE,EAAE;QAC1D,kBAAkB,CAAC;YACf,MAAM,EAAE,MAAM,CAAC,MAAM;YACrB,QAAQ,EAAE,MAAM,CAAC,QAAQ;YACzB,OAAO,EAAE,MAAM,CAAC,OAAO;SAC1B,CAAC,CAAC;IACP,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,GAAQ,EAAE,EAAE;QACjC,eAAe,CAAC,GAAG,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM,wBAAwB,GAAG,GAAG,EAAE;QAClC,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,qBAAqB,EAAE,2BAAe,CAAC,IAAI,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QACvG,eAAe,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC,CAAC;IACF,MAAM,eAAe,GAAG,GAAG,EAAE;QACzB,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,WAAW,EAAE,2BAAe,CAAC,IAAI,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QAC7F,eAAe,CAAC,GAAG,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IAC9B,MAAM,iBAAiB,GAAG,aAAa,CAAC,UAAU,GAAG,oBAAU,CAAC,UAAU,CAAC;IAE3E,MAAM,cAAc,GAAG,aAAa,CAAC,UAAU,IAAI,oBAAU,CAAC,MAAM,CAAC;IAErE,MAAM,iBAAiB,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,aAAa,CAAC;IAElF,MAAM,SAAS,GAAG,iBAAiB,CAAC,CAAC,CAAC,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;IAE9D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC;QACjC,MAAM,EAAE,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,SAAS,EAAE;QACxB,QAAQ,EAAE,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,WAAW,EAAE;QAC5B,OAAO,EAAE,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,UAAU,EAAE;KAC7B,CAAC,CAAC;IAEH,MAAM,EAAE,sBAAsB,EAAE,YAAY,EAAE,uBAAuB,EAAE,wBAAwB,EAAE,GAAG,IAAA,uCAAkB,GAAE,CAAC;IACzH,MAAM,SAAS,GAAG,sBAAsB,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC/F,MAAM,WAAW,GAAG,wBAAwB,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC;IACxE,MAAM,UAAU,GAAG,uBAAuB,EAAE,CAAC;IAE7C,MAAM,YAAY,GAAG,CACjB,8BAAC,iBAAO,IACJ,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,2DAA2D,EACnG,aAAa,EAAE,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,OAAO,EACvC,cAAc,EAAE,0CAAM,CAAC,yCAAyC,CAAC;QAEjE,uCAAK,SAAS,EAAE,0CAAM,CAAC,iCAAiC,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,GAAG,EAAE,eAAe;YACvG,8BAAC,kBAAQ,IAAC,SAAS,EAAE,SAAS,EAAE,MAAM,QAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,YAAY,EAAC,OAAO,EAAC,iBAAiB,QAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,iBAAiB,GAAI,CACtJ,CACA,CACb,CAAC;IAEF,MAAM,oBAAoB,GAA6B;QACnD,MAAM,EAAE,iBAAiB;QACzB,KAAK,EAAE,mCAAmB,CAAC,OAAO;QAClC,IAAI,EAAE,cAAc,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO;QAC5C,aAAa,EAAE,KAAK;QACpB,mBAAmB,EAAE,KAAK;QAC1B,aAAa,EAAE,IAAI;QACnB,aAAa,EAAE,CAAC,cAAqC,EAAE,EAAE,GAAE,CAAC;QAC5D,aAAa,EAAE,CAAC,cAAqC,EAAE,EAAE,GAAE,CAAC;QAC5D,aAAa,EAAE,oCAAoB;KACtC,CAAC;IAEF,IAAI,OAAO,IAAI,CAAC,aAAa,EAAE;QAC3B,OAAO,CACH,uCAAK,SAAS,EAAE,GAAG,0CAAM,CAAC,4BAA4B,CAAC,eAAe;YAClE,uCAAK,SAAS,EAAC,8BAA8B;gBACzC,uCAAK,SAAS,EAAC,oBAAoB;oBAC/B;wBACI,8BAAC,cAAI,IAAC,MAAM,EAAE,iBAAiB;4BAC3B,8CAAS,GAAG,CAAC,OAAO,EAAE,CAAC,IAAI,CAAU,CAClC;wBACP,8BAAC,cAAI,IAAC,MAAM,EAAE,iBAAiB,EAAE,IAAI,EAAE,iBAAiB,CAAC,CAAC,CAAC,eAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,eAAQ,CAAC,KAAK;4BACrF,wCAAM,SAAS,EAAC,uBAAuB;gCAClC,sBAAY,CAAC,sBAAsB,CAAC,GAAG,CAAC,SAAS,EAAE,EAAE,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;gCACpF,YAAY,CAAC,CAAC,CAAC,CACZ;;oCAEK,sBAAY,CAAC,sBAAsB,CAAC,GAAG,CAAC,WAAW,EAAE,EAAE,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CACxF,CACN,CAAC,CAAC,CAAC,IAAI;gCACP,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB,0CAAE,cAAc,EAAC,CAAC,CAAC,CACzC;;oCAEK,sBAAY,CAAC,sBAAsB,CAAC,GAAG,CAAC,UAAU,EAAE,EAAE,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,CACxF,CACN,CAAC,CAAC,CAAC,IAAI,CACL,CACJ,CACJ;oBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ;wBAC/C,8CAAS,GAAG,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,IAAI,CAAC,CAAU,CAC9D,CACL;gBACL,GAAG,CAAC,gBAAgB,EAAE,IAAI,CACvB,uCAAK,SAAS,EAAC,uCAAuC;oBAClD,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,OAAO,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK,IAC7C,GAAG,CAAC,YAAY,EAAE,CAChB,CACL,CACT,CACC;YACN,uCAAK,SAAS,EAAC,2BAA2B;gBACtC,uCAAK,SAAS,EAAC,uDAAuD;oBAClE,8BAAC,iBAAO,IAAC,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC;wBACjD,uCAAK,SAAS,EAAC,2BAA2B;4BACtC,8BAAC,kBAAQ,IAAC,MAAM,QAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,eAAe,IAChD,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE,CAChC,CACT,CACA,CACR;gBACL,YAAY,CACX,CACJ,CACT,CAAC;KACL;IAED,OAAO,CACH,uCACI,SAAS,EAAE,IAAA,oBAAE,EAAC,0CAAM,CAAC,yBAAyB,CAAC,EAAE;YAC7C,CAAC,0CAAM,CAAC,YAAY,CAAC,CAAC,EAAE,aAAa;YACrC,CAAC,0CAAM,CAAC,SAAS,CAAC,CAAC,EAAE,OAAO;YAC5B,CAAC,0CAAM,CAAC,eAAe,CAAC,CAAC,EAAE,iBAAiB;SAC/C,CAAC;QAEF,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;YACpD,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;gBACpD,8BAAC,4BAAkB,IACf,SAAS,EAAE,GAAG,CAAC,YAAY,EAAE,EAC7B,OAAO,EAAE,GAAG,CAAC,UAAU,EAAE,EACzB,mBAAmB,EAAE,gBAAgB,EACrC,UAAU,QACV,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;oBAEnD,8BAAC,iBAAO,IAAC,QAAQ,EAAE,CAAC,aAAa,EAAE,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,4CAA4C,CAAC;wBAC3G,uCAAK,SAAS,EAAC,+EAA+E;4BAC1F,uCAAK,SAAS,EAAE,0CAAM,CAAC,qCAAqC,CAAC;gCACzD,uCAAK,SAAS,EAAE,0CAAM,CAAC,2CAA2C,CAAC;oCAC/D,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC,IAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAO;oCAC7F,8BAAC,cAAI,IAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,aAAK,CAAC,MAAM,EAAE,IAAI,QAAC,SAAS,EAAC,UAAU,IACjF,GAAG,CAAC,cAAc,EAAE,CAClB,CACL;gCACN,uCAAK,SAAS,EAAE,0CAAM,CAAC,2CAA2C,CAAC;oCAC/D,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,WAAW,EAAE,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,GAAI,CACtF;gCACN,uCAAK,SAAS,EAAE,0CAAM,CAAC,2CAA2C,CAAC;oCAC/D,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC,IAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAO;oCAC9F,8BAAC,cAAI,IAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,aAAK,CAAC,MAAM,EAAE,IAAI,QAAC,SAAS,EAAC,UAAU,IACjF,GAAG,CAAC,gBAAgB,EAAE,CACpB,CACL,CACJ,CACJ,CACA,CACO,CACnB;YACN,uCAAK,SAAS,EAAE,0CAAM,CAAC,kCAAkC,CAAC,GAAI;YAC9D,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;gBACpD,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;oBACpD,uCAAK,SAAS,EAAE,0CAAM,CAAC,+BAA+B,CAAC;wBACnD,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC,IAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CAAO;wBAC5F,8BAAC,2CAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,oBAAoB;4BACtD,8BAAC,uDAA0B,IACvB,YAAY,EAAE;oCACV,MAAM,EAAE,GAAG,CAAC,SAAS,EAAE;oCACvB,QAAQ,EAAE,GAAG,CAAC,WAAW,EAAE;oCAC3B,OAAO,EAAE,GAAG,CAAC,UAAU,EAAE;iCAC5B,EACD,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,SAAS,EAC1B,YAAY,EAAE,CAAC,YAAY,EAC3B,WAAW,EAAE,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB,0CAAE,cAAc,MAAK,IAAI,EAC/D,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,WAAW,QACX,QAAQ,EAAE;oCACN,KAAK,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB,0CAAE,UAAU;oCAC5C,MAAM,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB,0CAAE,WAAW;iCACjD,GACH,CAC0B,CAC9B,CACJ,CACJ;YACN,uCAAK,SAAS,EAAE,0CAAM,CAAC,kCAAkC,CAAC,GAAI;YAC9D,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;gBACpD,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;oBACpD,8BAAC,iEAA+B,IAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,eAAe,EAAE,QAAQ,EAAE,CAAC,aAAa,EAAE,kBAAkB,EAAE,SAAS,EAAE,gBAAgB,SAAG,CAChJ,CACJ,CACJ;QAEN,uCAAK,SAAS,EAAE,0CAAM,CAAC,kCAAkC,CAAC,IACrD,aAAa,IAAI,OAAO,CAAC,CAAC,CAAC,CACxB,8BAAC,kBAAQ,IAAC,MAAM,QAAC,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,wBAAwB,EAAE,SAAS,EAAE,SAAS,IAC/E,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CACpB,CACd,CAAC,CAAC,CAAC,CACA,YAAY,CACf,CACC,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAhRW,QAAA,oBAAoB,wBAgR/B","sourcesContent":["import { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { default as cx } from 'classnames';\nimport dayjs from 'dayjs';\nimport React, { useContext, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport BEButton from '@/components/generic/BEButton';\nimport FloatingDatePicker from '@/components/generic/date/FloatingDatePicker';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Pill, { PillType } from '@/components/generic/Pill';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport { useSearchScopeHook } from '@/hooks/useSearchScopeHook';\nimport BasketRow from '@/models/BasketRow';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\nimport DataLayer, { InteractionStep, InteractionType } from '@/util/DataLayer';\nimport ScreenSize from '@/util/ScreenSize';\nimport StringHelper from '@/util/StringHelper';\n\nimport { EBookingWizardSection, EBookingWizardTheme, StateSectionsDefault } from '../../../generic/BookingWizard/BookingWizard';\nimport { BookingWizardContext, BookingWizardContextType, BookingWizardOnBooking } from '../../../generic/BookingWizard/BookingWizardContext';\nimport { BookingWizardGuestSelector } from '../../../generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector';\nimport { UserSearchSummaryPromocodeInput } from './UserSearchSummaryPromocodeInput';\nimport styles from './UserSearchSummaryRow.module.scss';\n\ntype UserSearchSummaryRowProps = {\n    row: BasketRow;\n    index: number;\n};\n\nexport const UserSearchSummaryRow = ({ row, index }: UserSearchSummaryRowProps) => {\n    const { t } = useTranslation();\n    const removeButtonRef = useRef<any>();\n    const { isAccent2ColorDark, hotel } = useCurrentHotel();\n\n    const { selectedBasketRow, currentBasketRows, updateBasketRow, removeBasketRow, selectBasketRow } = useContext(BasketContext);\n\n    const engineContext = useContext(BookingEngineContext);\n\n    const isSelectedRow = useMemo(() => {\n        return selectedBasketRow?.getID() === row?.getID();\n    }, [selectedBasketRow]);\n\n    const canRemove = currentBasketRows.length > 1;\n    const removeRoomOnClick = () => {\n        DataLayer.instance.sendInteraction('Remove Room', InteractionType.BUTTON, InteractionStep.ROOMS);\n        removeBasketRow(row);\n    };\n\n    const updatePeopleValues = ({ adults, children, infants, updatedPromoCode }: { adults?: number; children?: number; infants?: number; updatedPromoCode?: string }) => {\n        if (adults && adults !== row.getAdults()) {\n            DataLayer.instance.sendInteraction('Guests', InteractionType.NUMBER_INPUT, InteractionStep.ROOMS);\n            row.setAdults(adults);\n        }\n\n        if ((children || children === 0) && children !== row.getChildren()) {\n            DataLayer.instance.sendInteraction('Guests', InteractionType.NUMBER_INPUT, InteractionStep.ROOMS);\n            row.setChildren(children);\n        }\n\n        if ((infants || infants === 0) && infants !== row.getInfants()) {\n            DataLayer.instance.sendInteraction('Guests', InteractionType.NUMBER_INPUT, InteractionStep.ROOMS);\n            row.setInfants(infants);\n        }\n\n        if ((updatedPromoCode || updatedPromoCode === '') && updatedPromoCode !== row.getPromoCode()) {\n            DataLayer.instance.sendInteraction('Promo Code', InteractionType.FORM_FIELD, InteractionStep.ROOMS);\n            row.setPromoCode(updatedPromoCode);\n        }\n\n        updateBasketRow(row);\n    };\n\n    const updatePromoCode = (code: string) => {\n        DataLayer.instance.sendInteraction('Promo Code', InteractionType.FORM_FIELD, InteractionStep.ROOMS);\n\n        if (selectedBasketRow) {\n            selectedBasketRow.setPromoCode(code);\n            updateBasketRow(selectedBasketRow);\n        }\n    };\n\n    const updateDateValues = (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => {\n        if (startDate) {\n            row.setStartDate(startDate);\n        }\n\n        if (endDate) {\n            row.setEndDate(endDate);\n        }\n\n        updateBasketRow(row);\n    };\n\n    const setGuest = (guests: BookingWizardOnBooking['guests']) => {\n        updatePeopleValues({\n            adults: guests.adults,\n            children: guests.children,\n            infants: guests.infants,\n        });\n    };\n\n    const changePromoCode = (val: any) => {\n        updatePromoCode(val);\n    };\n\n    const onClickCancelRoomChanges = () => {\n        DataLayer.instance.sendInteraction('Cancel Room Changes', InteractionType.LINK, InteractionStep.ROOMS);\n        selectBasketRow(null);\n    };\n    const onClickEditRoom = () => {\n        DataLayer.instance.sendInteraction('Edit Room', InteractionType.LINK, InteractionStep.ROOMS);\n        selectBasketRow(row);\n    };\n\n    const isValid = row.isValid();\n    const isLargerThanLarge = engineContext.screenSize > ScreenSize.ExtraLarge;\n\n    const sizeMediumDown = engineContext.screenSize <= ScreenSize.Medium;\n\n    const shouldTextBeWhite = (isValid ? isAccent2ColorDark : false) && isSelectedRow;\n\n    const textColor = shouldTextBeWhite ? Color.White : undefined;\n\n    const [guests, setGuests] = useState({\n        adults: row?.getAdults(),\n        children: row?.getChildren(),\n        infants: row?.getInfants(),\n    });\n\n    const { getMaxSelectableAdults, showChildren, getMaxSelectableInfants, getMaxSelectableChildren } = useSearchScopeHook();\n    const maxAdults = getMaxSelectableAdults({ adults: guests.adults, children: guests.children });\n    const maxChildren = getMaxSelectableChildren({ adults: guests.adults });\n    const maxInfants = getMaxSelectableInfants();\n\n    const removeButton = (\n        <Tooltip\n            title={canRemove ? 'Remove this room' : 'Cannot remove this room as at least one must be selected.'}\n            followElement={removeButtonRef?.current}\n            wrapperClasses={styles['user-search-summary-row__remove-tooltip']}\n        >\n            <div className={styles['user-search-summary-row__remove']} onClick={removeRoomOnClick} ref={removeButtonRef}>\n                <BEButton textColor={textColor} isText icon={IconType.Close} iconPosition=\"right\" stopIconAnimation disabled={!canRemove} onClick={removeRoomOnClick} />\n            </div>\n        </Tooltip>\n    );\n\n    const bookingWizardContext: BookingWizardContextType = {\n        layout: 'booking-summary',\n        theme: EBookingWizardTheme.Default,\n        type: sizeMediumDown ? 'top-sheet' : 'popup',\n        isImagesTheme: false,\n        isImagesThemeMobile: false,\n        activeSection: null,\n        onNextHandler: (currentSection: EBookingWizardSection) => {},\n        onPrevHandler: (currentSection: EBookingWizardSection) => {},\n        stateSections: StateSectionsDefault,\n    };\n\n    if (isValid && !isSelectedRow) {\n        return (\n            <div className={`${styles['user-completed-summary-row']} u-flex w-100`}>\n                <div className=\"u-flex justify-content-start\">\n                    <div className=\"u-flex flex-column\">\n                        <span>\n                            <Text inline={isLargerThanLarge}>\n                                <strong>{row.getRoom().name}</strong>\n                            </Text>\n                            <Text inline={isLargerThanLarge} type={isLargerThanLarge ? TextType.Body : TextType.Small}>\n                                <span className=\"u-marg-left--light@xl\">\n                                    {StringHelper.pluralWithDictAndCount(row.getAdults(), Translation.Step.Date.Adult, t)}\n                                    {showChildren ? (\n                                        <>\n                                            ,&nbsp;\n                                            {StringHelper.pluralWithDictAndCount(row.getChildren(), Translation.Step.Date.Child, t)}\n                                        </>\n                                    ) : null}\n                                    {hotel?.childConfiguration?.supportInfants ? (\n                                        <>\n                                            ,&nbsp;\n                                            {StringHelper.pluralWithDictAndCount(row.getInfants(), Translation.Step.Date.Infant, t)}\n                                        </>\n                                    ) : null}\n                                </span>\n                            </Text>\n                        </span>\n                        <Text type={TextType.Caption} color={Color.DarkGrey}>\n                            <strong>{row.getStayDateRange('ddd, MMM D, YYYY', ' -')}</strong>\n                        </Text>\n                    </div>\n                    {row.isPromoCodeValid() && (\n                        <div className=\"u-marg-left d-flex align-items-center\">\n                            <Pill type={PillType.Success} icon={IconType.Money}>\n                                {row.getPromoCode()}\n                            </Pill>\n                        </div>\n                    )}\n                </div>\n                <div className=\"u-flex align-items-center\">\n                    <div className=\"u-flex align-items-center room-builder-progress--edit\">\n                        <Tooltip title={t(Translation.Step.Room.EditThisRoom)}>\n                            <div className=\"u-flex align-items-center\">\n                                <BEButton isText size=\"tiny\" onClick={onClickEditRoom}>\n                                    {t(Translation.Misc.Edit).toUpperCase()}\n                                </BEButton>\n                            </div>\n                        </Tooltip>\n                    </div>\n                    {removeButton}\n                </div>\n            </div>\n        );\n    }\n\n    return (\n        <div\n            className={cx(styles['user-search-summary-row'], {\n                [styles['--selected']]: isSelectedRow,\n                [styles['--valid']]: isValid,\n                [styles['--has-dark-bg']]: shouldTextBeWhite,\n            })}\n        >\n            <div className={styles['user-search-summary-row--inner']}>\n                <div className={styles['user-search-summary-row__group']}>\n                    <FloatingDatePicker\n                        startDate={row.getStartDate()}\n                        endDate={row.getEndDate()}\n                        selectedDateChanged={updateDateValues}\n                        isAboveNav\n                        className={styles['user-search-summary-row__input']}\n                    >\n                        <Tooltip disabled={!isSelectedRow} title={t(Translation.Step.Date.SelectArrivalAndDepartureDatesByClickingHere)}>\n                            <div className=\"u-flex align-items-center justify-content-center u-w-100@xl- u-cursor-pointer\">\n                                <div className={styles['user-search-summary-card-date-range']}>\n                                    <div className={styles['user-search-summary-card-date-range--item']}>\n                                        <div className={styles['user-search-summary-card-label']}>{t(Translation.Misc.CheckIn)}</div>\n                                        <Text color={shouldTextBeWhite ? Color.White : Color.Accent} bold className=\"u-nowrap\">\n                                            {row.getArrivalDate()}\n                                        </Text>\n                                    </div>\n                                    <div className={styles['user-search-summary-card-date-range--icon']}>\n                                        <Icon icon={IconType.ArrowRight2} color={shouldTextBeWhite ? Color.White : undefined} />\n                                    </div>\n                                    <div className={styles['user-search-summary-card-date-range--item']}>\n                                        <div className={styles['user-search-summary-card-label']}>{t(Translation.Misc.CheckOut)}</div>\n                                        <Text color={shouldTextBeWhite ? Color.White : Color.Accent} bold className=\"u-nowrap\">\n                                            {row.getDepartureDate()}\n                                        </Text>\n                                    </div>\n                                </div>\n                            </div>\n                        </Tooltip>\n                    </FloatingDatePicker>\n                </div>\n                <div className={styles['user-search-summary-row__divider']} />\n                <div className={styles['user-search-summary-row__group']}>\n                    <div className={styles['user-search-summary-row__input']}>\n                        <div className={styles['user-search-summary-card-item']}>\n                            <div className={styles['user-search-summary-card-label']}>{t(Translation.Misc.Guests)}</div>\n                            <BookingWizardContext.Provider value={bookingWizardContext}>\n                                <BookingWizardGuestSelector\n                                    defaultValue={{\n                                        adults: row.getAdults(),\n                                        children: row.getChildren(),\n                                        infants: row.getInfants(),\n                                    }}\n                                    onChange={setGuest}\n                                    onEditingChange={setGuests}\n                                    disableChild={!showChildren}\n                                    showInfants={hotel?.childConfiguration?.supportInfants === true}\n                                    maxAdults={maxAdults}\n                                    maxChildren={maxChildren}\n                                    maxInfants={maxInfants}\n                                    disableRoom\n                                    ageRange={{\n                                        child: hotel?.childConfiguration?.childRange,\n                                        infant: hotel?.childConfiguration?.infantRange,\n                                    }}\n                                />\n                            </BookingWizardContext.Provider>\n                        </div>\n                    </div>\n                </div>\n                <div className={styles['user-search-summary-row__divider']} />\n                <div className={styles['user-search-summary-row__group']}>\n                    <div className={styles['user-search-summary-row__input']}>\n                        <UserSearchSummaryPromocodeInput row={row} onChange={changePromoCode} disabled={!isSelectedRow} promocodeTextColor={textColor} useUpdatedDesign />\n                    </div>\n                </div>\n            </div>\n\n            <div className={styles['user-search-summary-row--buttons']}>\n                {isSelectedRow && isValid ? (\n                    <BEButton isText size=\"tiny\" onClick={onClickCancelRoomChanges} textColor={textColor}>\n                        {t(Translation.Misc.Cancel)}\n                    </BEButton>\n                ) : (\n                    removeButton\n                )}\n            </div>\n        </div>\n    );\n};\n"]}

package/dist/src/engines/BookingWizardEngine/BookingWizardEngine.d.ts

@@ -1,12 +1,14 @@
-import { EBookingWizardOverlayDirection } from '../../components/generic/BookingWizard/BookingWizard';
+import { ReactNode } from 'react';
+import { EBookingWizardOverlayDirection, EBookingWizardTheme } from '../../components/generic/BookingWizard/BookingWizard';
 import type { BookingWizardContextType, BookingWizardOnBooking } from '../../components/generic/BookingWizard/BookingWizardContext';
+import { BookingWizardGuestSelectorProps } from '../../components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector';
 import { BaseEngine, BaseEngineConfig } from '../BaseEngine';
 import { ShowPromoCodeAlertProps, ShowYearOnCalendarProps } from '../../models/Api/HotelOverrideDTO';
 import type { BookingWizardProperty } from '../../models/BookingWizard/BookingWizardProperty';
 import type { TBookingWizardProperties } from '../../models/BookingWizard/BookingWizardTypes';
 export interface BookingWizardEngineConfig extends BaseEngineConfig, ShowYearOnCalendarProps, ShowPromoCodeAlertProps {
     widgetType: 'property' | 'group';
-    theme: 'specific' | 'default';
+    theme: EBookingWizardTheme;
     layout: 'horizontal' | 'vertical' | 'button';
     properties: TBookingWizardProperties;
     selectedProperty?: BookingWizardProperty;
@@ -28,6 +30,11 @@ export interface BookingWizardEngineConfig extends BaseEngineConfig, ShowYearOnC
         checkout?: string;
     };
     onSubmit?: BookingWizardContextType['onSubmit'];
+    notes?: {
+        date?: ReactNode;
+        guest?: ReactNode;
+    };
+    guestAgeConfig?: Pick<BookingWizardGuestSelectorProps, 'minAdultAge' | 'maxAdultAge' | 'ageRange'>;
 }
 export declare class BookingWizardEngine extends BaseEngine<BookingWizardEngineConfig> {
     constructor(bookingContainer: HTMLElement, config?: BookingWizardEngineConfig);

package/dist/src/engines/BookingWizardEngine/BookingWizardEngine.js.map

@@ -1 +1 @@
-{"version":3,"file":"BookingWizardEngine.js","sourceRoot":"/","sources":["src/engines/BookingWizardEngine/BookingWizardEngine.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;AAEA,qDAAyF;AACzF,yGAA+F;AAI/F,0FAAkE;AA6BlE,MAAa,mBAAoB,SAAQ,uBAAqC;IAC1E,YAAmB,gBAA6B,EAAE,MAAkC;QAChF,KAAK,CAAC,gBAAgB,EAAE,MAAM,CAAC,CAAC;QAChC,IAAI,CAAC,MAAM,GAAG,gCAAmB,CAAC,aAAa,CAAC;QAEhD,4CAA4C;QAC5C,6BAAmB,CAAC,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;IAC1E,CAAC;IAEe,MAAM;;YAClB,IAAA,gDAAmB,EAAC,6BAAmB,CAAC,4BAA4B,CAAC,KAAK,EAAE,gBAAgB,CAAC,EAAE,IAAI,CAAC,CAAC;QACzG,CAAC;KAAA;CACJ;AAZD,kDAYC","sourcesContent":["import { EBookingWizardOverlayDirection } from '@/components/generic/BookingWizard/BookingWizard';\nimport type { BookingWizardContextType, BookingWizardOnBooking } from '@/components/generic/BookingWizard/BookingWizardContext';\nimport { BaseEngine, BaseEngineConfig, BookingEngineSource } from '@/engines/BaseEngine';\nimport { renderBookingWizard } from '@/engines/BookingWizardEngine/BookingWizardEngineElement';\nimport { ShowPromoCodeAlertProps, ShowYearOnCalendarProps } from '@/models/Api/HotelOverrideDTO';\nimport type { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport type { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\n\nexport interface BookingWizardEngineConfig extends BaseEngineConfig, ShowYearOnCalendarProps, ShowPromoCodeAlertProps {\n    widgetType: 'property' | 'group';\n    theme: 'specific' | 'default';\n    layout: 'horizontal' | 'vertical' | 'button';\n\n    properties: TBookingWizardProperties;\n    selectedProperty?: BookingWizardProperty;\n    defaultColors: BookingWizardProperty['colors'];\n\n    wrapperClassname?: string;\n    contentClassname?: string;\n    maxOccupancy?: number;\n    disableChild?: boolean;\n    showInfants?: boolean;\n    disableRoom?: boolean;\n    hideGuestSelect?: boolean;\n    hidePromocode?: boolean;\n    hideProperty?: boolean;\n    dateFormat?: string;\n    hideTooltips?: boolean;\n    overlayDirection?: EBookingWizardOverlayDirection;\n\n    defaultValues?: Partial<Omit<BookingWizardOnBooking, 'id' | 'checkIn' | 'checkout'>> & { checkIn?: string; checkout?: string };\n\n    onSubmit?: BookingWizardContextType['onSubmit'];\n}\n\nexport class BookingWizardEngine extends BaseEngine<BookingWizardEngineConfig> {\n    public constructor(bookingContainer: HTMLElement, config?: BookingWizardEngineConfig) {\n        super(bookingContainer, config);\n        this.source = BookingEngineSource.BookingWizard;\n\n        // TODO: Make this a more permanent solution\n        RoomstayThemeEngine.EngineContainer.classList.add('--transparent-bg');\n    }\n\n    protected async render() {\n        renderBookingWizard(RoomstayThemeEngine.createElementOrReuseExisting('div', 'booking-wizard'), this);\n    }\n}\n"]}
+{"version":3,"file":"BookingWizardEngine.js","sourceRoot":"/","sources":["src/engines/BookingWizardEngine/BookingWizardEngine.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;AAKA,qDAAyF;AACzF,yGAA+F;AAI/F,0FAAkE;AAqClE,MAAa,mBAAoB,SAAQ,uBAAqC;IAC1E,YAAmB,gBAA6B,EAAE,MAAkC;QAChF,KAAK,CAAC,gBAAgB,EAAE,MAAM,CAAC,CAAC;QAChC,IAAI,CAAC,MAAM,GAAG,gCAAmB,CAAC,aAAa,CAAC;QAEhD,4CAA4C;QAC5C,6BAAmB,CAAC,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;IAC1E,CAAC;IAEe,MAAM;;YAClB,IAAA,gDAAmB,EAAC,6BAAmB,CAAC,4BAA4B,CAAC,KAAK,EAAE,gBAAgB,CAAC,EAAE,IAAI,CAAC,CAAC;QACzG,CAAC;KAAA;CACJ;AAZD,kDAYC","sourcesContent":["import { ReactNode } from 'react';\n\nimport { EBookingWizardOverlayDirection, EBookingWizardTheme } from '@/components/generic/BookingWizard/BookingWizard';\nimport type { BookingWizardContextType, BookingWizardOnBooking } from '@/components/generic/BookingWizard/BookingWizardContext';\nimport { BookingWizardGuestSelectorProps } from '@/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector';\nimport { BaseEngine, BaseEngineConfig, BookingEngineSource } from '@/engines/BaseEngine';\nimport { renderBookingWizard } from '@/engines/BookingWizardEngine/BookingWizardEngineElement';\nimport { ShowPromoCodeAlertProps, ShowYearOnCalendarProps } from '@/models/Api/HotelOverrideDTO';\nimport type { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport type { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\n\nexport interface BookingWizardEngineConfig extends BaseEngineConfig, ShowYearOnCalendarProps, ShowPromoCodeAlertProps {\n    widgetType: 'property' | 'group';\n    theme: EBookingWizardTheme;\n    layout: 'horizontal' | 'vertical' | 'button';\n\n    properties: TBookingWizardProperties;\n    selectedProperty?: BookingWizardProperty;\n    defaultColors: BookingWizardProperty['colors'];\n\n    wrapperClassname?: string;\n    contentClassname?: string;\n    maxOccupancy?: number;\n    disableChild?: boolean;\n    showInfants?: boolean;\n    disableRoom?: boolean;\n    hideGuestSelect?: boolean;\n    hidePromocode?: boolean;\n    hideProperty?: boolean;\n    dateFormat?: string;\n\n    hideTooltips?: boolean;\n    overlayDirection?: EBookingWizardOverlayDirection;\n\n    defaultValues?: Partial<Omit<BookingWizardOnBooking, 'id' | 'checkIn' | 'checkout'>> & { checkIn?: string; checkout?: string };\n\n    onSubmit?: BookingWizardContextType['onSubmit'];\n\n    // New option for new theme\n    notes?: {\n        date?: ReactNode; // Show at bottom left corner of Date Selector popup\n        guest?: ReactNode; // Show at bottom of Guest Selector popup\n    };\n    guestAgeConfig?: Pick<BookingWizardGuestSelectorProps, 'minAdultAge' | 'maxAdultAge' | 'ageRange'>;\n}\n\nexport class BookingWizardEngine extends BaseEngine<BookingWizardEngineConfig> {\n    public constructor(bookingContainer: HTMLElement, config?: BookingWizardEngineConfig) {\n        super(bookingContainer, config);\n        this.source = BookingEngineSource.BookingWizard;\n\n        // TODO: Make this a more permanent solution\n        RoomstayThemeEngine.EngineContainer.classList.add('--transparent-bg');\n    }\n\n    protected async render() {\n        renderBookingWizard(RoomstayThemeEngine.createElementOrReuseExisting('div', 'booking-wizard'), this);\n    }\n}\n"]}

package/dist/src/engines/InlineRoomMiniEngine/InlineRoomMiniEngineElement.js

@@ -276,10 +276,10 @@ function InlineRoomMiniEngineElement(props) {
     return (0, react_1.useMemo)(() => {
         var _a, _b, _c, _d, _e;
         return (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement("div", { className: `room-builder-progress ${isCompact}` },
-                react_1.default.createElement("div", { className: "u-flex w-100 flex-wrap room-builder-progress--item --current", ref: ref },
+            react_1.default.createElement("div", { className: `room-builder-progress ${isCompact} rs-inline-container` },
+                react_1.default.createElement("div", { className: "u-flex w-100 flex-wrap room-builder-progress--item --current rs-inline-filter", ref: ref },
                     react_1.default.createElement("div", { className: "u-flex u-flex-align-center flex-wrap flex-row u-w-100@xl-" },
-                        react_1.default.createElement(FloatingDatePicker_1.default, { startDate: row === null || row === void 0 ? void 0 : row.getStartDate(), selectedDateChanged: updateDateValues, className: "u-w-100@xl- room-builder-progress--value u-marg-left--none" },
+                        react_1.default.createElement(FloatingDatePicker_1.default, { startDate: row === null || row === void 0 ? void 0 : row.getStartDate(), selectedDateChanged: updateDateValues, className: "u-w-100@xl- room-builder-progress--value u-marg-left--none rs-inline-filter-item-dates" },
                             react_1.default.createElement(Tooltip_1.default, { title: t(Translation_1.Translation.Step.Date.SelectArrivalAndDepartureDatesByClickingHere), wrapperClasses: "u-w-100@xl-" },
                                 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: (row === null || row === void 0 ? void 0 : row.getArrivalDate()) ? Color_1.Color.Accent : Color_1.Color.Graphite, className: "u-mw-75 u-align-center", bold: !!(row === null || row === void 0 ? void 0 : row.getArrivalDate()) },
@@ -287,8 +287,8 @@ function InlineRoomMiniEngineElement(props) {
                                     react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight2 }),
                                     react_1.default.createElement(Text_1.default, { color: (row === null || row === void 0 ? void 0 : row.getDepartureDate()) ? Color_1.Color.Accent : Color_1.Color.Graphite, className: "u-marg-right u-mw-75 u-align-center", bold: !!(row === null || row === void 0 ? void 0 : row.getDepartureDate()) },
                                         react_1.default.createElement("span", null, (row === null || row === void 0 ? void 0 : row.getDepartureDate()) ? row.getDepartureDate() : 'Departure Date'))))),
-                        react_1.default.createElement(Tooltip_1.default, { title: t(Translation_1.Translation.Step.Date.UpdateAdults), wrapperClasses: "u-w-100@xl-" },
-                            react_1.default.createElement("div", { className: "room-builder-progress--value --mw-l u-flex justify-content-center" },
+                        react_1.default.createElement(Tooltip_1.default, { title: t(Translation_1.Translation.Step.Date.UpdateAdults), wrapperClasses: "u-w-100@xl- rs-inline-filter-item-adult" },
+                            react_1.default.createElement("div", { className: "room-builder-progress--value --mw-l u-flex justify-content-center " },
                                 react_1.default.createElement(Select_1.Select, { nativeOnMobile: true, options: [...Array(maxOccupancy - ((row === null || row === void 0 ? void 0 : row.getChildren()) ? row.getChildren() : 0))].map((v, value) => {
                                         value += 1;
                                         return {
@@ -296,7 +296,7 @@ function InlineRoomMiniEngineElement(props) {
                                             value: value.toString(),
                                         };
                                     }), value: (_a = row === null || row === void 0 ? void 0 : row.getAdults()) === null || _a === void 0 ? void 0 : _a.toString(), onChange: updateNumberOfAdultsOnChange, keyName: "value", labelName: "text" }))),
-                        react_1.default.createElement(Tooltip_1.default, { title: t(Translation_1.Translation.Step.Date.UpdateChildren), wrapperClasses: "u-w-100@xl-" },
+                        react_1.default.createElement(Tooltip_1.default, { title: t(Translation_1.Translation.Step.Date.UpdateChildren), wrapperClasses: "u-w-100@xl- rs-inline-filter-item-children" },
                             react_1.default.createElement("div", { className: "room-builder-progress--value --mw-l u-flex justify-content-center" },
                                 react_1.default.createElement(Select_1.Select, { nativeOnMobile: true, options: [...Array(maxOccupancy + 1 - ((row === null || row === void 0 ? void 0 : row.getAdults()) ? row.getAdults() : 0))].map((v, value) => {
                                         return {
@@ -304,7 +304,7 @@ function InlineRoomMiniEngineElement(props) {
                                             value: value.toString(),
                                         };
                                     }), value: (_b = row === null || row === void 0 ? void 0 : row.getChildren()) === null || _b === void 0 ? void 0 : _b.toString(), onChange: updateNumberOfChildrenOnChange, keyName: "value", labelName: "text" }))),
-                        react_1.default.createElement(Tooltip_1.default, { title: promoCodeTooltip, wrapperClasses: "u-w-100@xl-" },
+                        react_1.default.createElement(Tooltip_1.default, { title: promoCodeTooltip, wrapperClasses: "u-w-100@xl- rs-inline-filter-item-promo" },
                             react_1.default.createElement("div", { className: "room-builder-progress--value u-cursor-pointer", ref: thisElement, onClick: openPromoModalOnClick },
                                 react_1.default.createElement("div", { className: "u-flex align-items-center justify-content-center u-w-100@xl-" },
                                     react_1.default.createElement(Text_1.default, { className: "u-pad-right--light", type: Text_1.TextType.Body, color: (row === null || row === void 0 ? void 0 : row.getPromoCode()) ? row === null || row === void 0 ? void 0 : row.getPromoCodeColour() : Color_1.Color.Navy }, (row === null || row === void 0 ? void 0 : row.getPromoCode()) ? row === null || row === void 0 ? void 0 : row.getPromoCode() : 'Promo Code'),
@@ -319,10 +319,10 @@ function InlineRoomMiniEngineElement(props) {
                                     react_1.default.createElement(BEButton_1.default, { isText: true, size: "small", onClick: cancelPromoPopupOnClick }, t(Translation_1.Translation.Misc.Cancel)))))),
                     react_1.default.createElement("div", { className: `u-flex flex-xl-nowrap flex-row ${isCompact ? 'w-100' : ''}` },
                         react_1.default.createElement(BEButton_1.default, { filled: true, primary: true, isLoading: isLoading, wide: isCompact !== '', onClick: findRoomsOnClick }, t(Translation_1.Translation.Misc.CheckRates)))),
-                react_1.default.createElement("div", { className: "u-border-rounded" }, !isLoading ? (react_1.default.createElement(AutoAutoHeight_1.default, { open: !isLoading },
+                react_1.default.createElement("div", { className: "u-border-rounded rs-inline-content" }, !isLoading ? (react_1.default.createElement(AutoAutoHeight_1.default, { open: !isLoading },
                     react_1.default.createElement(react_1.default.Fragment, null,
                         react_1.default.createElement(BookNowPayLaterInfoBlock_1.BookNowPayLaterInfoBlock, null),
-                        rooms.length > 0 ? (react_1.default.createElement(RoomRates_1.default, { featuredRates: featuredRates, rates: standardRates, roomCode: rooms[0].code, getButtonLabel: getButtonLabelHandler, onAddToBasketOverride: onAddToBasketOverrideHandler })) : (react_1.default.createElement(RatesNotFoundBlock_1.default, null))))) : (react_1.default.createElement(LargeLoader_1.default, null))))));
+                        rooms.length > 0 ? (react_1.default.createElement(RoomRates_1.default, { classNames: "rs-inline-content-list", featuredRates: featuredRates, rates: standardRates, roomCode: rooms[0].code, getButtonLabel: getButtonLabelHandler, onAddToBasketOverride: onAddToBasketOverrideHandler })) : (react_1.default.createElement(RatesNotFoundBlock_1.default, null))))) : (react_1.default.createElement(LargeLoader_1.default, null))))));
     }, [isCompact, isLoading, rooms, basketContext.currentBasketRows, isPromoModalOpen, hotel]);
 }
 exports.default = InlineRoomMiniEngineElement;