@roomstay/frontend 2.6.58 → 2.6.59

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

@@ -43,7 +43,7 @@ function BookNowPayLaterInfoBlock() {
         url = (_b = (_a = hotel.bestRateNoBSUrl) !== null && _a !== void 0 ? _a : hotel.bookNowPayLaterUrl) !== null && _b !== void 0 ? _b : hotel.privacyPolicyUrl;
     }
     const titleTranslation = t(Translation_1.Translation.Custom.BookNowPayLaterInfoBlock.BookNowPayLater);
-    return titleTranslation ? (react_1.default.createElement("div", { className: "u-marg-bottom u-border-rounded", style: { padding: '16px 30px', backgroundColor: Color_1.Color.Accent2 } },
+    return titleTranslation ? (react_1.default.createElement("div", { className: "rs-book-now-pay-later-info-block u-marg-bottom u-border-rounded", style: { padding: '16px 30px', backgroundColor: Color_1.Color.Accent2 } },
         react_1.default.createElement("div", { className: "u-flex u-flex-flex-start u-flex-align-center" },
             react_1.default.createElement(BookNowPayLaterIcon_1.default, { width: 40, height: 40 }),
             react_1.default.createElement("div", { className: "u-marg-left--med" },

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

@@ -1 +1 @@
-{"version":3,"file":"BookNowPayLaterInfoBlock.js","sourceRoot":"/","sources":["src/components/generic/BookNowPayLaterInfoBlock.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAAkD;AAClD,kDAA4C;AAC5C,iDAA+C;AAC/C,0DAAuD;AAEvD,kEAA2D;AAC3D,0GAAkF;AAClF,wCAAqC;AAErC,SAAgB,wBAAwB;;IACpC,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IAEpC,IAAI,GAAG,GAAG,EAAE,CAAC;IACb,IAAI,KAAK,EAAE;QACP,GAAG,GAAG,MAAA,MAAA,KAAK,CAAC,eAAe,mCAAI,KAAK,CAAC,kBAAkB,mCAAI,KAAK,CAAC,gBAAgB,CAAC;KACrF;IAED,MAAM,gBAAgB,GAAG,CAAC,CAAC,yBAAW,CAAC,MAAM,CAAC,wBAAwB,CAAC,eAAe,CAAC,CAAC;IAExF,OAAO,gBAAgB,CAAC,CAAC,CAAC,CACtB,uCAAK,SAAS,EAAC,gCAAgC,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,aAAK,CAAC,OAAO,EAAE;QAC3G,uCAAK,SAAS,EAAC,8CAA8C;YACzD,8BAAC,6BAAmB,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI;YAC9C,uCAAK,SAAS,EAAC,kBAAkB;gBAC7B,8BAAC,cAAI,IAAC,IAAI,QAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,IAC1B,gBAAgB,CACd;gBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;oBACrB,CAAC,CAAC,yBAAW,CAAC,MAAM,CAAC,wBAAwB,CAAC,kBAAkB,CAAC;oBAAE,GAAG;oBACvE,qCAAG,KAAK,EAAE,EAAE,KAAK,EAAE,aAAK,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,IACzE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAClC;wBAED,CACL,CACJ,CACJ,CACT,CAAC,CAAC,CAAC,IAAI,CAAC;AACb,CAAC;AA9BD,4DA8BC","sourcesContent":["import { useCurrentHotel } from '@frontend/hooks';\nimport React, { ReactElement } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Text, { TextType } from '@/components/generic/Text';\nimport BookNowPayLaterIcon from '@/components/iconComponents/BookNowPayLaterIcon';\nimport { Color } from '@/util/Color';\n\nexport function BookNowPayLaterInfoBlock(): ReactElement | null {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n\n    let url = '';\n    if (hotel) {\n        url = hotel.bestRateNoBSUrl ?? hotel.bookNowPayLaterUrl ?? hotel.privacyPolicyUrl;\n    }\n\n    const titleTranslation = t(Translation.Custom.BookNowPayLaterInfoBlock.BookNowPayLater);\n\n    return titleTranslation ? (\n        <div className=\"u-marg-bottom u-border-rounded\" style={{ padding: '16px 30px', backgroundColor: Color.Accent2 }}>\n            <div className=\"u-flex u-flex-flex-start u-flex-align-center\">\n                <BookNowPayLaterIcon width={40} height={40} />\n                <div className=\"u-marg-left--med\">\n                    <Text bold type={TextType.Small}>\n                        {titleTranslation}\n                    </Text>\n                    <Text type={TextType.Small}>\n                        {t(Translation.Custom.BookNowPayLaterInfoBlock.IfYourDreamsChange)}{' '}\n                        <a style={{ color: Color.Accent }} href={url} target=\"_blank\" rel=\"noreferrer\">\n                            {t(Translation.Step.Room.ReadMore)}\n                        </a>\n                        .\n                    </Text>\n                </div>\n            </div>\n        </div>\n    ) : null;\n}\n"]}
+{"version":3,"file":"BookNowPayLaterInfoBlock.js","sourceRoot":"/","sources":["src/components/generic/BookNowPayLaterInfoBlock.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAAkD;AAClD,kDAA4C;AAC5C,iDAA+C;AAC/C,0DAAuD;AAEvD,kEAA2D;AAC3D,0GAAkF;AAClF,wCAAqC;AAErC,SAAgB,wBAAwB;;IACpC,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IAEpC,IAAI,GAAG,GAAG,EAAE,CAAC;IACb,IAAI,KAAK,EAAE;QACP,GAAG,GAAG,MAAA,MAAA,KAAK,CAAC,eAAe,mCAAI,KAAK,CAAC,kBAAkB,mCAAI,KAAK,CAAC,gBAAgB,CAAC;KACrF;IAED,MAAM,gBAAgB,GAAG,CAAC,CAAC,yBAAW,CAAC,MAAM,CAAC,wBAAwB,CAAC,eAAe,CAAC,CAAC;IAExF,OAAO,gBAAgB,CAAC,CAAC,CAAC,CACtB,uCAAK,SAAS,EAAC,iEAAiE,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,aAAK,CAAC,OAAO,EAAE;QAC5I,uCAAK,SAAS,EAAC,8CAA8C;YACzD,8BAAC,6BAAmB,IAAC,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,GAAI;YAC9C,uCAAK,SAAS,EAAC,kBAAkB;gBAC7B,8BAAC,cAAI,IAAC,IAAI,QAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,IAC1B,gBAAgB,CACd;gBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;oBACrB,CAAC,CAAC,yBAAW,CAAC,MAAM,CAAC,wBAAwB,CAAC,kBAAkB,CAAC;oBAAE,GAAG;oBACvE,qCAAG,KAAK,EAAE,EAAE,KAAK,EAAE,aAAK,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,IACzE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAClC;wBAED,CACL,CACJ,CACJ,CACT,CAAC,CAAC,CAAC,IAAI,CAAC;AACb,CAAC;AA9BD,4DA8BC","sourcesContent":["import { useCurrentHotel } from '@frontend/hooks';\nimport React, { ReactElement } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Text, { TextType } from '@/components/generic/Text';\nimport BookNowPayLaterIcon from '@/components/iconComponents/BookNowPayLaterIcon';\nimport { Color } from '@/util/Color';\n\nexport function BookNowPayLaterInfoBlock(): ReactElement | null {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n\n    let url = '';\n    if (hotel) {\n        url = hotel.bestRateNoBSUrl ?? hotel.bookNowPayLaterUrl ?? hotel.privacyPolicyUrl;\n    }\n\n    const titleTranslation = t(Translation.Custom.BookNowPayLaterInfoBlock.BookNowPayLater);\n\n    return titleTranslation ? (\n        <div className=\"rs-book-now-pay-later-info-block u-marg-bottom u-border-rounded\" style={{ padding: '16px 30px', backgroundColor: Color.Accent2 }}>\n            <div className=\"u-flex u-flex-flex-start u-flex-align-center\">\n                <BookNowPayLaterIcon width={40} height={40} />\n                <div className=\"u-marg-left--med\">\n                    <Text bold type={TextType.Small}>\n                        {titleTranslation}\n                    </Text>\n                    <Text type={TextType.Small}>\n                        {t(Translation.Custom.BookNowPayLaterInfoBlock.IfYourDreamsChange)}{' '}\n                        <a style={{ color: Color.Accent }} href={url} target=\"_blank\" rel=\"noreferrer\">\n                            {t(Translation.Step.Room.ReadMore)}\n                        </a>\n                        .\n                    </Text>\n                </div>\n            </div>\n        </div>\n    ) : null;\n}\n"]}

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

@@ -5,12 +5,20 @@ import { BookingWizardProperty } from '../../../models/BookingWizard/BookingWiza
 import { TBookingWizardProperties } from '../../../models/BookingWizard/BookingWizardTypes';
 export declare enum EBookingWizardTheme {
     Default = "default",
-    Specific = "specific"
+    Specific = "specific",
+    Images = "images"
 }
 export declare enum EBookingWizardOverlayDirection {
     Upward = "upward",
     Downward = "downward"
 }
+export declare enum EBookingWizardSection {
+    Property = "property",
+    Date = "date",
+    Guest = "guest",
+    Promo = "promo"
+}
+export declare const StateSectionsDefault: BookingWizardContextType['stateSections'];
 export interface BookingWizardProps extends BookingWizardContentProps {
     layout?: BookingWizardLayout;
     theme?: BookingWizardTheme;

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

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.EBookingWizardOverlayDirection = exports.EBookingWizardTheme = void 0;
+exports.StateSectionsDefault = exports.EBookingWizardSection = exports.EBookingWizardOverlayDirection = exports.EBookingWizardTheme = void 0;
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importStar(require("react"));
 const react_i18next_1 = require("react-i18next");
@@ -44,12 +44,26 @@ var EBookingWizardTheme;
 (function (EBookingWizardTheme) {
     EBookingWizardTheme["Default"] = "default";
     EBookingWizardTheme["Specific"] = "specific";
+    EBookingWizardTheme["Images"] = "images";
 })(EBookingWizardTheme = exports.EBookingWizardTheme || (exports.EBookingWizardTheme = {}));
 var EBookingWizardOverlayDirection;
 (function (EBookingWizardOverlayDirection) {
     EBookingWizardOverlayDirection["Upward"] = "upward";
     EBookingWizardOverlayDirection["Downward"] = "downward";
 })(EBookingWizardOverlayDirection = exports.EBookingWizardOverlayDirection || (exports.EBookingWizardOverlayDirection = {}));
+var EBookingWizardSection;
+(function (EBookingWizardSection) {
+    EBookingWizardSection["Property"] = "property";
+    EBookingWizardSection["Date"] = "date";
+    EBookingWizardSection["Guest"] = "guest";
+    EBookingWizardSection["Promo"] = "promo";
+})(EBookingWizardSection = exports.EBookingWizardSection || (exports.EBookingWizardSection = {}));
+exports.StateSectionsDefault = {
+    [EBookingWizardSection.Property]: { opening: false, isFirst: false, hidden: false, inactive: false },
+    [EBookingWizardSection.Date]: { opening: false, isFirst: false, hidden: false, inactive: false },
+    [EBookingWizardSection.Guest]: { opening: false, isFirst: false, hidden: false, inactive: false },
+    [EBookingWizardSection.Promo]: { opening: false, isFirst: false, hidden: false, inactive: false },
+};
 const BookingWizard = (props) => {
     const { layout = 'horizontal', theme = EBookingWizardTheme.Default, onSubmit, wrapperClassname, contentClassname: contentClassnameProps, selectedProperty, properties, defaultColors, maxAdults, disableChild, showInfants, disableRoom, hideGuestSelect, hidePromocode, hideProperty, defaultValues, overlayDirection = EBookingWizardOverlayDirection.Downward, } = props;
     const [isOpen, setIsOpen] = react_1.default.useState(false);
@@ -85,13 +99,78 @@ const BookingWizard = (props) => {
             setOverlayPlacement(overlayDirection === EBookingWizardOverlayDirection.Downward ? 'bottom' : 'top');
         }
     }, [isMobile]);
+    const isImagesTheme = theme === EBookingWizardTheme.Images;
     const classes = (0, classnames_1.default)(BookingWizard_module_scss_1.default.container, {
         [BookingWizard_module_scss_1.default['--theme-specific']]: theme === EBookingWizardTheme.Specific,
         [BookingWizard_module_scss_1.default['--theme-default']]: theme === EBookingWizardTheme.Default,
+        [BookingWizard_module_scss_1.default['--theme-images']]: isImagesTheme,
         [BookingWizard_module_scss_1.default['--theme-condensed']]: layout === 'horizontal-condensed',
         [BookingWizard_module_scss_1.default['--in-small-container']]: isSmallContainer,
     }, wrapperClassname);
     const contentClassname = (0, classnames_1.default)(contentClassnameProps, { [BookingWizard_module_scss_1.default['--in-small-container']]: isSmallContainer });
+    const isImagesThemeMobile = isImagesTheme && isSmallContainer;
+    const [activeSection, setActiveSection] = (0, react_1.useState)(null);
+    const [availableSections, setAvailableSections] = (0, react_1.useState)([]);
+    const [stateSections, setStateSections] = (0, react_1.useState)(exports.StateSectionsDefault);
+    (0, react_1.useEffect)(() => {
+        const isPromoHidden = hidePromocode || layout === 'horizontal-condensed' || isImagesThemeMobile;
+        const isPropertyHidden = !!hideProperty;
+        const isGuestHidden = !!hideGuestSelect;
+        const state = {
+            [EBookingWizardSection.Property]: {
+                hidden: isPropertyHidden,
+                isFirst: !isPropertyHidden,
+                opening: EBookingWizardSection.Property === activeSection,
+                inactive: isPropertyHidden || (isImagesThemeMobile && activeSection !== null && activeSection !== EBookingWizardSection.Property),
+            },
+            [EBookingWizardSection.Date]: {
+                hidden: false,
+                isFirst: isPropertyHidden,
+                opening: EBookingWizardSection.Date === activeSection,
+                inactive: (isImagesThemeMobile && isPropertyHidden && activeSection === null) || (isImagesThemeMobile && activeSection !== EBookingWizardSection.Date),
+            },
+            [EBookingWizardSection.Guest]: {
+                hidden: isGuestHidden,
+                isFirst: false,
+                opening: EBookingWizardSection.Guest === activeSection,
+                inactive: isGuestHidden || (isImagesThemeMobile && activeSection !== EBookingWizardSection.Guest),
+            },
+            [EBookingWizardSection.Promo]: {
+                hidden: isPromoHidden,
+                isFirst: false,
+                opening: EBookingWizardSection.Promo === activeSection,
+                inactive: isPromoHidden || (isImagesThemeMobile && activeSection !== EBookingWizardSection.Promo),
+            },
+        };
+        // Extract available (i.e., not hidden) sections from state
+        const enabled = Object.entries(state)
+            .filter(([, value]) => !value.hidden)
+            .map(([key]) => key);
+        setAvailableSections(enabled);
+        // If all inactive are true, then find the first section with hidden === false and set its inactive to false.
+        const allInactive = Object.values(state).every((s) => s.inactive);
+        if (allInactive) {
+            const sections = [EBookingWizardSection.Property, EBookingWizardSection.Date, EBookingWizardSection.Guest, EBookingWizardSection.Promo];
+            for (const section of sections) {
+                if (!state[section].hidden) {
+                    state[section].opening = false;
+                    state[section].inactive = false;
+                    break;
+                }
+            }
+        }
+        setStateSections(state);
+    }, [layout, hideProperty, hideGuestSelect, hidePromocode, activeSection, isImagesTheme, isImagesThemeMobile]);
+    const navigateSection = (currentSection, direction) => {
+        var _a;
+        if (!currentSection)
+            return;
+        const currentIndex = availableSections.indexOf(currentSection);
+        const targetSection = (_a = availableSections[currentIndex + direction]) !== null && _a !== void 0 ? _a : null;
+        setActiveSection(targetSection);
+    };
+    const onNextHandler = (section) => navigateSection(section, 1);
+    const onPrevHandler = (section) => navigateSection(section, -1);
     const bookingWizardContext = {
         layout,
         theme,
@@ -106,6 +185,12 @@ const BookingWizard = (props) => {
             fallbackPlacements: overlayPlacement,
             dateOffset: dateSelectorOverlayOffset,
         },
+        isImagesTheme,
+        isImagesThemeMobile,
+        activeSection,
+        stateSections,
+        onNextHandler,
+        onPrevHandler,
     };
     if (layout === 'button') {
         return (react_1.default.createElement("div", { className: classes },

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

@@ -1 +1 @@
-{"version":3,"file":"BookingWizard.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport useMeasure from 'react-use-measure';\n\nimport BEButton from '@/components/generic/BEButton';\nimport { BookingWizardContent, BookingWizardContentProps } from '@/components/generic/BookingWizard/BookingWizardContent';\nimport {\n    BookingWizardContext,\n    BookingWizardContextType,\n    BookingWizardLayout,\n    BookingWizardOverlayType,\n    BookingWizardTheme,\n} from '@/components/generic/BookingWizard/BookingWizardContext';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport { Translation } from '@/translations/Translation';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport styles from './BookingWizard.module.scss';\n\nexport enum EBookingWizardTheme {\n    Default = 'default',\n    Specific = 'specific',\n}\n\nexport enum EBookingWizardOverlayDirection {\n    Upward = 'upward',\n    Downward = 'downward',\n}\n\nexport interface BookingWizardProps extends BookingWizardContentProps {\n    layout?: BookingWizardLayout;\n    theme?: BookingWizardTheme;\n\n    wrapperClassname?: string;\n    contentClassname?: string;\n\n    properties: TBookingWizardProperties;\n    selectedProperty: BookingWizardProperty;\n    defaultColors: BookingWizardProperty['colors'];\n    onSubmit: BookingWizardContextType['onSubmit'];\n\n    overlayDirection?: EBookingWizardOverlayDirection;\n}\n\nconst BookingWizard: React.FC<BookingWizardProps> = (props) => {\n    const {\n        layout = 'horizontal',\n        theme = EBookingWizardTheme.Default,\n        onSubmit,\n        wrapperClassname,\n        contentClassname: contentClassnameProps,\n        selectedProperty,\n        properties,\n        defaultColors,\n        maxAdults,\n        disableChild,\n        showInfants,\n        disableRoom,\n        hideGuestSelect,\n        hidePromocode,\n        hideProperty,\n        defaultValues,\n        overlayDirection = EBookingWizardOverlayDirection.Downward,\n    } = props;\n    const [isOpen, setIsOpen] = React.useState(false);\n\n    const { isMobile } = useWindowSize();\n    const { t } = useTranslation();\n    const [ref, bounds] = useMeasure({ debounce: 300 });\n\n    const [compOverlayType, setCompOverlayType] = useState<BookingWizardOverlayType>('popup');\n    const [overlayOffset, setOverlayOffset] = useState<[number, number]>();\n    const [dateSelectorOverlayOffset, setDateSelectorOverlayOffset] = useState<[number, number]>();\n    const [overlayPlacement, setOverlayPlacement] = useState<Placement>();\n\n    const isSmallContainer = useMemo(() => {\n        if (!bounds.width) return false;\n        return bounds.width <= ScreenSize.Medium;\n    }, [bounds]);\n\n    useEffect(() => {\n        if ((layout === 'horizontal' || layout === 'horizontal-condensed') && !isMobile) {\n            setOverlayOffset([0, 6]);\n            setDateSelectorOverlayOffset([0, 6]);\n            setCompOverlayType('popup');\n        } else {\n            setOverlayOffset([0, 10]);\n            setDateSelectorOverlayOffset([0, -8]);\n            setCompOverlayType('bottom-sheet');\n        }\n    }, [layout, isMobile, isSmallContainer]);\n\n    useEffect(() => {\n        if (!isMobile) {\n            setOverlayPlacement(overlayDirection === EBookingWizardOverlayDirection.Downward ? 'bottom-start' : 'top-start');\n        } else {\n            setOverlayPlacement(overlayDirection === EBookingWizardOverlayDirection.Downward ? 'bottom' : 'top');\n        }\n    }, [isMobile]);\n\n    const classes = classNames(\n        styles.container,\n        {\n            [styles['--theme-specific']]: theme === EBookingWizardTheme.Specific,\n            [styles['--theme-default']]: theme === EBookingWizardTheme.Default,\n            [styles['--theme-condensed']]: layout === 'horizontal-condensed',\n            [styles['--in-small-container']]: isSmallContainer,\n        },\n        wrapperClassname\n    );\n\n    const contentClassname = classNames(contentClassnameProps, { [styles['--in-small-container']]: isSmallContainer });\n\n    const bookingWizardContext: BookingWizardContextType = {\n        layout,\n        theme,\n        type: compOverlayType,\n        className: classes,\n        isMobile,\n        isSmallContainer,\n\n        onSubmit,\n\n        overlay: {\n            offset: overlayOffset,\n            placement: overlayPlacement,\n            fallbackPlacements: overlayPlacement,\n            dateOffset: dateSelectorOverlayOffset,\n        },\n    };\n\n    if (layout === 'button') {\n        return (\n            <div className={classes}>\n                <BEButton className={styles.bookNowBtn} onClick={() => setIsOpen(true)}>\n                    {t(Translation.Misc.BookNow)}\n                </BEButton>\n\n                <SimpleModal className={styles.container} size={SimpleModalSize.ExtraSmall} open={isOpen} onClose={() => setIsOpen(false)} alignCenter overflowVisible>\n                    <div>\n                        <div className={styles.title}>\n                            <span>{t(Translation.Misc.BookAHotel)}</span>\n                            <Icon className={styles.closeBtn} icon={IconType.Close} size=\"24px\" onClick={() => setIsOpen(false)} />\n                        </div>\n                        <BookingWizardContext.Provider value={bookingWizardContext}>\n                            <div className={classes}>\n                                <BookingWizardContent\n                                    properties={properties}\n                                    selectedProperty={selectedProperty}\n                                    defaultColors={defaultColors}\n                                    classname={contentClassname}\n                                    maxAdults={maxAdults}\n                                    disableChild={disableChild}\n                                    showInfants={showInfants}\n                                    disableRoom={disableRoom}\n                                    defaultValues={defaultValues}\n                                    hideGuestSelect={hideGuestSelect}\n                                    hidePromocode={hidePromocode}\n                                    hideProperty={hideProperty}\n                                />\n                            </div>\n                        </BookingWizardContext.Provider>\n                    </div>\n                </SimpleModal>\n            </div>\n        );\n    }\n\n    return (\n        <div ref={ref} className={classes}>\n            <BookingWizardContext.Provider value={bookingWizardContext}>\n                <BookingWizardContent {...props} classname={contentClassname} disableChild={disableChild} disableRoom={disableRoom} defaultValues={defaultValues} />\n            </BookingWizardContext.Provider>\n        </div>\n    );\n};\n\nexport default BookingWizard;\n"]}
+{"version":3,"file":"BookingWizard.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizard.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,4DAAoC;AACpC,+CAA4D;AAC5D,iDAA+C;AAC/C,0EAA2C;AAE3C,6EAAqD;AACrD,kGAA0H;AAC1H,kGAMiE;AACjE,uEAAgE;AAChE,sFAAsF;AACtF,mDAAmD;AAGnD,4DAAyD;AACzD,mEAA2C;AAE3C,4FAAiD;AAEjD,IAAY,mBAIX;AAJD,WAAY,mBAAmB;IAC3B,0CAAmB,CAAA;IACnB,4CAAqB,CAAA;IACrB,wCAAiB,CAAA;AACrB,CAAC,EAJW,mBAAmB,GAAnB,2BAAmB,KAAnB,2BAAmB,QAI9B;AAED,IAAY,8BAGX;AAHD,WAAY,8BAA8B;IACtC,mDAAiB,CAAA;IACjB,uDAAqB,CAAA;AACzB,CAAC,EAHW,8BAA8B,GAA9B,sCAA8B,KAA9B,sCAA8B,QAGzC;AAED,IAAY,qBAKX;AALD,WAAY,qBAAqB;IAC7B,8CAAqB,CAAA;IACrB,sCAAa,CAAA;IACb,wCAAe,CAAA;IACf,wCAAe,CAAA;AACnB,CAAC,EALW,qBAAqB,GAArB,6BAAqB,KAArB,6BAAqB,QAKhC;AAEY,QAAA,oBAAoB,GAA8C;IAC3E,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;IACpG,CAAC,qBAAqB,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;IAChG,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;IACjG,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;CACpG,CAAC;AAiBF,MAAM,aAAa,GAAiC,CAAC,KAAK,EAAE,EAAE;IAC1D,MAAM,EACF,MAAM,GAAG,YAAY,EACrB,KAAK,GAAG,mBAAmB,CAAC,OAAO,EACnC,QAAQ,EACR,gBAAgB,EAChB,gBAAgB,EAAE,qBAAqB,EACvC,gBAAgB,EAChB,UAAU,EACV,aAAa,EACb,SAAS,EACT,YAAY,EACZ,WAAW,EACX,WAAW,EACX,eAAe,EACf,aAAa,EACb,YAAY,EACZ,aAAa,EACb,gBAAgB,GAAG,8BAA8B,CAAC,QAAQ,GAC7D,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElD,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,0BAAa,GAAE,CAAC;IACrC,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,IAAA,2BAAU,EAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC;IAEpD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,IAAA,gBAAQ,EAA2B,OAAO,CAAC,CAAC;IAC1F,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,GAAoB,CAAC;IACvE,MAAM,CAAC,yBAAyB,EAAE,4BAA4B,CAAC,GAAG,IAAA,gBAAQ,GAAoB,CAAC;IAC/F,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,IAAA,gBAAQ,GAAa,CAAC;IAEtE,MAAM,gBAAgB,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAClC,IAAI,CAAC,MAAM,CAAC,KAAK;YAAE,OAAO,KAAK,CAAC;QAChC,OAAO,MAAM,CAAC,KAAK,IAAI,oBAAU,CAAC,MAAM,CAAC;IAC7C,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,CAAC,MAAM,KAAK,YAAY,IAAI,MAAM,KAAK,sBAAsB,CAAC,IAAI,CAAC,QAAQ,EAAE;YAC7E,gBAAgB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;YACzB,4BAA4B,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;YACrC,kBAAkB,CAAC,OAAO,CAAC,CAAC;SAC/B;aAAM;YACH,gBAAgB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;YAC1B,4BAA4B,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;YACtC,kBAAkB,CAAC,cAAc,CAAC,CAAC;SACtC;IACL,CAAC,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAEzC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,CAAC,QAAQ,EAAE;YACX,mBAAmB,CAAC,gBAAgB,KAAK,8BAA8B,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC;SACpH;aAAM;YACH,mBAAmB,CAAC,gBAAgB,KAAK,8BAA8B,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;SACxG;IACL,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,aAAa,GAAG,KAAK,KAAK,mBAAmB,CAAC,MAAM,CAAC;IAC3D,MAAM,OAAO,GAAG,IAAA,oBAAU,EACtB,mCAAM,CAAC,SAAS,EAChB;QACI,CAAC,mCAAM,CAAC,kBAAkB,CAAC,CAAC,EAAE,KAAK,KAAK,mBAAmB,CAAC,QAAQ;QACpE,CAAC,mCAAM,CAAC,iBAAiB,CAAC,CAAC,EAAE,KAAK,KAAK,mBAAmB,CAAC,OAAO;QAClE,CAAC,mCAAM,CAAC,gBAAgB,CAAC,CAAC,EAAE,aAAa;QACzC,CAAC,mCAAM,CAAC,mBAAmB,CAAC,CAAC,EAAE,MAAM,KAAK,sBAAsB;QAChE,CAAC,mCAAM,CAAC,sBAAsB,CAAC,CAAC,EAAE,gBAAgB;KACrD,EACD,gBAAgB,CACnB,CAAC;IAEF,MAAM,gBAAgB,GAAG,IAAA,oBAAU,EAAC,qBAAqB,EAAE,EAAE,CAAC,mCAAM,CAAC,sBAAsB,CAAC,CAAC,EAAE,gBAAgB,EAAE,CAAC,CAAC;IAEnH,MAAM,mBAAmB,GAAG,aAAa,IAAI,gBAAgB,CAAC;IAC9D,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAA+B,IAAI,CAAC,CAAC;IACvF,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,IAAA,gBAAQ,EAA0B,EAAE,CAAC,CAAC;IACxF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAA4C,4BAAoB,CAAC,CAAC;IAEpH,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,MAAM,aAAa,GAAG,aAAa,IAAI,MAAM,KAAK,sBAAsB,IAAI,mBAAmB,CAAC;QAChG,MAAM,gBAAgB,GAAG,CAAC,CAAC,YAAY,CAAC;QACxC,MAAM,aAAa,GAAG,CAAC,CAAC,eAAe,CAAC;QAExC,MAAM,KAAK,GAA8C;YACrD,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE;gBAC9B,MAAM,EAAE,gBAAgB;gBACxB,OAAO,EAAE,CAAC,gBAAgB;gBAC1B,OAAO,EAAE,qBAAqB,CAAC,QAAQ,KAAK,aAAa;gBACzD,QAAQ,EAAE,gBAAgB,IAAI,CAAC,mBAAmB,IAAI,aAAa,KAAK,IAAI,IAAI,aAAa,KAAK,qBAAqB,CAAC,QAAQ,CAAC;aACpI;YACD,CAAC,qBAAqB,CAAC,IAAI,CAAC,EAAE;gBAC1B,MAAM,EAAE,KAAK;gBACb,OAAO,EAAE,gBAAgB;gBACzB,OAAO,EAAE,qBAAqB,CAAC,IAAI,KAAK,aAAa;gBACrD,QAAQ,EAAE,CAAC,mBAAmB,IAAI,gBAAgB,IAAI,aAAa,KAAK,IAAI,CAAC,IAAI,CAAC,mBAAmB,IAAI,aAAa,KAAK,qBAAqB,CAAC,IAAI,CAAC;aACzJ;YACD,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE;gBAC3B,MAAM,EAAE,aAAa;gBACrB,OAAO,EAAE,KAAK;gBACd,OAAO,EAAE,qBAAqB,CAAC,KAAK,KAAK,aAAa;gBACtD,QAAQ,EAAE,aAAa,IAAI,CAAC,mBAAmB,IAAI,aAAa,KAAK,qBAAqB,CAAC,KAAK,CAAC;aACpG;YACD,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE;gBAC3B,MAAM,EAAE,aAAa;gBACrB,OAAO,EAAE,KAAK;gBACd,OAAO,EAAE,qBAAqB,CAAC,KAAK,KAAK,aAAa;gBACtD,QAAQ,EAAE,aAAa,IAAI,CAAC,mBAAmB,IAAI,aAAa,KAAK,qBAAqB,CAAC,KAAK,CAAC;aACpG;SACJ,CAAC;QAEF,2DAA2D;QAC3D,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;aAChC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC;aACpC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,GAA4B,CAAC,CAAC;QAClD,oBAAoB,CAAC,OAAO,CAAC,CAAC;QAE9B,6GAA6G;QAC7G,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;QAClE,IAAI,WAAW,EAAE;YACb,MAAM,QAAQ,GAA4B,CAAC,qBAAqB,CAAC,QAAQ,EAAE,qBAAqB,CAAC,IAAI,EAAE,qBAAqB,CAAC,KAAK,EAAE,qBAAqB,CAAC,KAAK,CAAC,CAAC;YACjK,KAAK,MAAM,OAAO,IAAI,QAAQ,EAAE;gBAC5B,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE;oBACxB,KAAK,CAAC,OAAO,CAAC,CAAC,OAAO,GAAG,KAAK,CAAC;oBAC/B,KAAK,CAAC,OAAO,CAAC,CAAC,QAAQ,GAAG,KAAK,CAAC;oBAChC,MAAM;iBACT;aACJ;SACJ;QAED,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,mBAAmB,CAAC,CAAC,CAAC;IAE9G,MAAM,eAAe,GAAG,CAAC,cAAqC,EAAE,SAAiB,EAAE,EAAE;;QACjF,IAAI,CAAC,cAAc;YAAE,OAAO;QAC5B,MAAM,YAAY,GAAG,iBAAiB,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;QAC/D,MAAM,aAAa,GAAG,MAAA,iBAAiB,CAAC,YAAY,GAAG,SAAS,CAAC,mCAAI,IAAI,CAAC;QAC1E,gBAAgB,CAAC,aAAa,CAAC,CAAC;IACpC,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,OAA8B,EAAE,EAAE,CAAC,eAAe,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;IACtF,MAAM,aAAa,GAAG,CAAC,OAA8B,EAAE,EAAE,CAAC,eAAe,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;IAEvF,MAAM,oBAAoB,GAA6B;QACnD,MAAM;QACN,KAAK;QACL,IAAI,EAAE,eAAe;QACrB,SAAS,EAAE,OAAO;QAClB,QAAQ;QACR,gBAAgB;QAEhB,QAAQ;QAER,OAAO,EAAE;YACL,MAAM,EAAE,aAAa;YACrB,SAAS,EAAE,gBAAgB;YAC3B,kBAAkB,EAAE,gBAAgB;YACpC,UAAU,EAAE,yBAAyB;SACxC;QACD,aAAa;QACb,mBAAmB;QACnB,aAAa;QACb,aAAa;QACb,aAAa;QACb,aAAa;KAChB,CAAC;IAEF,IAAI,MAAM,KAAK,QAAQ,EAAE;QACrB,OAAO,CACH,uCAAK,SAAS,EAAE,OAAO;YACnB,8BAAC,kBAAQ,IAAC,SAAS,EAAE,mCAAM,CAAC,UAAU,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,IACjE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CACrB;YAEX,8BAAC,qBAAW,IAAC,SAAS,EAAE,mCAAM,CAAC,SAAS,EAAE,IAAI,EAAE,6BAAe,CAAC,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,WAAW,QAAC,eAAe;gBAClJ;oBACI,uCAAK,SAAS,EAAE,mCAAM,CAAC,KAAK;wBACxB,4CAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAQ;wBAC7C,8BAAC,cAAI,IAAC,SAAS,EAAE,mCAAM,CAAC,QAAQ,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,GAAI,CACrG;oBACN,8BAAC,2CAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,oBAAoB;wBACtD,uCAAK,SAAS,EAAE,OAAO;4BACnB,8BAAC,2CAAoB,IACjB,UAAU,EAAE,UAAU,EACtB,gBAAgB,EAAE,gBAAgB,EAClC,aAAa,EAAE,aAAa,EAC5B,SAAS,EAAE,gBAAgB,EAC3B,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,EAC5B,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,GAC5B,CACA,CACsB,CAC9B,CACI,CACZ,CACT,CAAC;KACL;IAED,OAAO,CACH,uCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO;QAC7B,8BAAC,2CAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,oBAAoB;YACtD,8BAAC,2CAAoB,oBAAK,KAAK,IAAE,SAAS,EAAE,gBAAgB,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,aAAa,EAAE,aAAa,IAAI,CACxH,CAC9B,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,aAAa,CAAC","sourcesContent":["import { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport useMeasure from 'react-use-measure';\n\nimport BEButton from '@/components/generic/BEButton';\nimport { BookingWizardContent, BookingWizardContentProps } from '@/components/generic/BookingWizard/BookingWizardContent';\nimport {\n    BookingWizardContext,\n    BookingWizardContextType,\n    BookingWizardLayout,\n    BookingWizardOverlayType,\n    BookingWizardTheme,\n} from '@/components/generic/BookingWizard/BookingWizardContext';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport { Translation } from '@/translations/Translation';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport styles from './BookingWizard.module.scss';\n\nexport enum EBookingWizardTheme {\n    Default = 'default',\n    Specific = 'specific',\n    Images = 'images',\n}\n\nexport enum EBookingWizardOverlayDirection {\n    Upward = 'upward',\n    Downward = 'downward',\n}\n\nexport enum EBookingWizardSection {\n    Property = 'property',\n    Date = 'date',\n    Guest = 'guest',\n    Promo = 'promo',\n}\n\nexport const StateSectionsDefault: BookingWizardContextType['stateSections'] = {\n    [EBookingWizardSection.Property]: { opening: false, isFirst: false, hidden: false, inactive: false },\n    [EBookingWizardSection.Date]: { opening: false, isFirst: false, hidden: false, inactive: false },\n    [EBookingWizardSection.Guest]: { opening: false, isFirst: false, hidden: false, inactive: false },\n    [EBookingWizardSection.Promo]: { opening: false, isFirst: false, hidden: false, inactive: false },\n};\n\nexport interface BookingWizardProps extends BookingWizardContentProps {\n    layout?: BookingWizardLayout;\n    theme?: BookingWizardTheme;\n\n    wrapperClassname?: string;\n    contentClassname?: string;\n\n    properties: TBookingWizardProperties;\n    selectedProperty: BookingWizardProperty;\n    defaultColors: BookingWizardProperty['colors'];\n    onSubmit: BookingWizardContextType['onSubmit'];\n\n    overlayDirection?: EBookingWizardOverlayDirection;\n}\n\nconst BookingWizard: React.FC<BookingWizardProps> = (props) => {\n    const {\n        layout = 'horizontal',\n        theme = EBookingWizardTheme.Default,\n        onSubmit,\n        wrapperClassname,\n        contentClassname: contentClassnameProps,\n        selectedProperty,\n        properties,\n        defaultColors,\n        maxAdults,\n        disableChild,\n        showInfants,\n        disableRoom,\n        hideGuestSelect,\n        hidePromocode,\n        hideProperty,\n        defaultValues,\n        overlayDirection = EBookingWizardOverlayDirection.Downward,\n    } = props;\n    const [isOpen, setIsOpen] = React.useState(false);\n\n    const { isMobile } = useWindowSize();\n    const { t } = useTranslation();\n    const [ref, bounds] = useMeasure({ debounce: 300 });\n\n    const [compOverlayType, setCompOverlayType] = useState<BookingWizardOverlayType>('popup');\n    const [overlayOffset, setOverlayOffset] = useState<[number, number]>();\n    const [dateSelectorOverlayOffset, setDateSelectorOverlayOffset] = useState<[number, number]>();\n    const [overlayPlacement, setOverlayPlacement] = useState<Placement>();\n\n    const isSmallContainer = useMemo(() => {\n        if (!bounds.width) return false;\n        return bounds.width <= ScreenSize.Medium;\n    }, [bounds]);\n\n    useEffect(() => {\n        if ((layout === 'horizontal' || layout === 'horizontal-condensed') && !isMobile) {\n            setOverlayOffset([0, 6]);\n            setDateSelectorOverlayOffset([0, 6]);\n            setCompOverlayType('popup');\n        } else {\n            setOverlayOffset([0, 10]);\n            setDateSelectorOverlayOffset([0, -8]);\n            setCompOverlayType('bottom-sheet');\n        }\n    }, [layout, isMobile, isSmallContainer]);\n\n    useEffect(() => {\n        if (!isMobile) {\n            setOverlayPlacement(overlayDirection === EBookingWizardOverlayDirection.Downward ? 'bottom-start' : 'top-start');\n        } else {\n            setOverlayPlacement(overlayDirection === EBookingWizardOverlayDirection.Downward ? 'bottom' : 'top');\n        }\n    }, [isMobile]);\n\n    const isImagesTheme = theme === EBookingWizardTheme.Images;\n    const classes = classNames(\n        styles.container,\n        {\n            [styles['--theme-specific']]: theme === EBookingWizardTheme.Specific,\n            [styles['--theme-default']]: theme === EBookingWizardTheme.Default,\n            [styles['--theme-images']]: isImagesTheme,\n            [styles['--theme-condensed']]: layout === 'horizontal-condensed',\n            [styles['--in-small-container']]: isSmallContainer,\n        },\n        wrapperClassname\n    );\n\n    const contentClassname = classNames(contentClassnameProps, { [styles['--in-small-container']]: isSmallContainer });\n\n    const isImagesThemeMobile = isImagesTheme && isSmallContainer;\n    const [activeSection, setActiveSection] = useState<EBookingWizardSection | null>(null);\n    const [availableSections, setAvailableSections] = useState<EBookingWizardSection[]>([]);\n    const [stateSections, setStateSections] = useState<BookingWizardContextType['stateSections']>(StateSectionsDefault);\n\n    useEffect(() => {\n        const isPromoHidden = hidePromocode || layout === 'horizontal-condensed' || isImagesThemeMobile;\n        const isPropertyHidden = !!hideProperty;\n        const isGuestHidden = !!hideGuestSelect;\n\n        const state: BookingWizardContextType['stateSections'] = {\n            [EBookingWizardSection.Property]: {\n                hidden: isPropertyHidden,\n                isFirst: !isPropertyHidden,\n                opening: EBookingWizardSection.Property === activeSection,\n                inactive: isPropertyHidden || (isImagesThemeMobile && activeSection !== null && activeSection !== EBookingWizardSection.Property),\n            },\n            [EBookingWizardSection.Date]: {\n                hidden: false,\n                isFirst: isPropertyHidden,\n                opening: EBookingWizardSection.Date === activeSection,\n                inactive: (isImagesThemeMobile && isPropertyHidden && activeSection === null) || (isImagesThemeMobile && activeSection !== EBookingWizardSection.Date),\n            },\n            [EBookingWizardSection.Guest]: {\n                hidden: isGuestHidden,\n                isFirst: false,\n                opening: EBookingWizardSection.Guest === activeSection,\n                inactive: isGuestHidden || (isImagesThemeMobile && activeSection !== EBookingWizardSection.Guest),\n            },\n            [EBookingWizardSection.Promo]: {\n                hidden: isPromoHidden,\n                isFirst: false,\n                opening: EBookingWizardSection.Promo === activeSection,\n                inactive: isPromoHidden || (isImagesThemeMobile && activeSection !== EBookingWizardSection.Promo),\n            },\n        };\n\n        // Extract available (i.e., not hidden) sections from state\n        const enabled = Object.entries(state)\n            .filter(([, value]) => !value.hidden)\n            .map(([key]) => key as EBookingWizardSection);\n        setAvailableSections(enabled);\n\n        // If all inactive are true, then find the first section with hidden === false and set its inactive to false.\n        const allInactive = Object.values(state).every((s) => s.inactive);\n        if (allInactive) {\n            const sections: EBookingWizardSection[] = [EBookingWizardSection.Property, EBookingWizardSection.Date, EBookingWizardSection.Guest, EBookingWizardSection.Promo];\n            for (const section of sections) {\n                if (!state[section].hidden) {\n                    state[section].opening = false;\n                    state[section].inactive = false;\n                    break;\n                }\n            }\n        }\n\n        setStateSections(state);\n    }, [layout, hideProperty, hideGuestSelect, hidePromocode, activeSection, isImagesTheme, isImagesThemeMobile]);\n\n    const navigateSection = (currentSection: EBookingWizardSection, direction: 1 | -1) => {\n        if (!currentSection) return;\n        const currentIndex = availableSections.indexOf(currentSection);\n        const targetSection = availableSections[currentIndex + direction] ?? null;\n        setActiveSection(targetSection);\n    };\n\n    const onNextHandler = (section: EBookingWizardSection) => navigateSection(section, 1);\n    const onPrevHandler = (section: EBookingWizardSection) => navigateSection(section, -1);\n\n    const bookingWizardContext: BookingWizardContextType = {\n        layout,\n        theme,\n        type: compOverlayType,\n        className: classes,\n        isMobile,\n        isSmallContainer,\n\n        onSubmit,\n\n        overlay: {\n            offset: overlayOffset,\n            placement: overlayPlacement,\n            fallbackPlacements: overlayPlacement,\n            dateOffset: dateSelectorOverlayOffset,\n        },\n        isImagesTheme,\n        isImagesThemeMobile,\n        activeSection,\n        stateSections,\n        onNextHandler,\n        onPrevHandler,\n    };\n\n    if (layout === 'button') {\n        return (\n            <div className={classes}>\n                <BEButton className={styles.bookNowBtn} onClick={() => setIsOpen(true)}>\n                    {t(Translation.Misc.BookNow)}\n                </BEButton>\n\n                <SimpleModal className={styles.container} size={SimpleModalSize.ExtraSmall} open={isOpen} onClose={() => setIsOpen(false)} alignCenter overflowVisible>\n                    <div>\n                        <div className={styles.title}>\n                            <span>{t(Translation.Misc.BookAHotel)}</span>\n                            <Icon className={styles.closeBtn} icon={IconType.Close} size=\"24px\" onClick={() => setIsOpen(false)} />\n                        </div>\n                        <BookingWizardContext.Provider value={bookingWizardContext}>\n                            <div className={classes}>\n                                <BookingWizardContent\n                                    properties={properties}\n                                    selectedProperty={selectedProperty}\n                                    defaultColors={defaultColors}\n                                    classname={contentClassname}\n                                    maxAdults={maxAdults}\n                                    disableChild={disableChild}\n                                    showInfants={showInfants}\n                                    disableRoom={disableRoom}\n                                    defaultValues={defaultValues}\n                                    hideGuestSelect={hideGuestSelect}\n                                    hidePromocode={hidePromocode}\n                                    hideProperty={hideProperty}\n                                />\n                            </div>\n                        </BookingWizardContext.Provider>\n                    </div>\n                </SimpleModal>\n            </div>\n        );\n    }\n\n    return (\n        <div ref={ref} className={classes}>\n            <BookingWizardContext.Provider value={bookingWizardContext}>\n                <BookingWizardContent {...props} classname={contentClassname} disableChild={disableChild} disableRoom={disableRoom} defaultValues={defaultValues} />\n            </BookingWizardContext.Provider>\n        </div>\n    );\n};\n\nexport default BookingWizard;\n"]}

package/dist/src/components/generic/BookingWizard/BookingWizardBottomSheet/BookingWizardBottomSheet.d.ts

@@ -1,4 +1,17 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 import { BottomSheetProps } from 'react-spring-bottom-sheet';
 declare const BookingWizardBottomSheet: React.FC<BottomSheetProps>;
+interface BWBottomSheetFooterProps {
+    onPrev?: () => void;
+    onNext?: () => void;
+    hidePrev?: boolean;
+    preLabel?: string;
+    nextLabel?: string;
+    disabledNext?: boolean;
+}
+export declare const BWBottomSheetFooter: ({ onPrev, onNext, hidePrev, preLabel, nextLabel, disabledNext }: BWBottomSheetFooterProps) => JSX.Element | null;
+export declare const BWBottomSheetHeader: ({ title, onClose }: {
+    title: ReactNode;
+    onClose: () => void;
+}) => JSX.Element;
 export default BookingWizardBottomSheet;

package/dist/src/components/generic/BookingWizard/BookingWizardBottomSheet/BookingWizardBottomSheet.js

@@ -14,9 +14,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BWBottomSheetHeader = exports.BWBottomSheetFooter = void 0;
+const ui_1 = require("@roomstay/ui");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importDefault(require("react"));
+const react_i18next_1 = require("react-i18next");
 const react_spring_bottom_sheet_1 = require("react-spring-bottom-sheet");
+const Translation_1 = require("../../../../translations/Translation");
+const BEButton_1 = __importDefault(require("../../BEButton"));
+const BookingWizard_1 = require("../BookingWizard");
+const BookingWizard_module_scss_1 = __importDefault(require("../BookingWizard.module.scss"));
 const BookingWizardContext_1 = require("../BookingWizardContext");
 const BookingWizardBottomSheet = (props) => {
     const { children, className } = props, bottomSheetProps = __rest(props, ["children", "className"]);
@@ -24,5 +31,25 @@ const BookingWizardBottomSheet = (props) => {
     const classes = (0, classnames_1.default)('roomstay-booking-container', bwClassname, className);
     return (react_1.default.createElement(react_spring_bottom_sheet_1.BottomSheet, Object.assign({ className: classes, style: style }, bottomSheetProps), children));
 };
+const BWBottomSheetFooter = ({ onPrev, onNext, hidePrev = false, preLabel, nextLabel, disabledNext = false }) => {
+    const { theme } = (0, BookingWizardContext_1.useBookingWizard)();
+    const { t } = (0, react_i18next_1.useTranslation)();
+    if (theme !== BookingWizard_1.EBookingWizardTheme.Images)
+        return null;
+    return (react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default.footer },
+        !hidePrev ? (react_1.default.createElement(BEButton_1.default, { rounded: true, isText: true, primary: true, size: "small", className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.btn, BookingWizard_module_scss_1.default['btn-cancel']), onClick: onPrev }, preLabel || t(Translation_1.Translation.Navigation.Back))) : (react_1.default.createElement("div", null)),
+        react_1.default.createElement(BEButton_1.default, { disabled: disabledNext, rounded: true, primary: true, filled: true, size: "small", className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.btn, BookingWizard_module_scss_1.default['btn-next']), onClick: onNext }, nextLabel || t(Translation_1.Translation.Navigation.Next))));
+};
+exports.BWBottomSheetFooter = BWBottomSheetFooter;
+const BWBottomSheetHeader = ({ title, onClose }) => {
+    const { isImagesTheme } = (0, BookingWizardContext_1.useBookingWizard)();
+    return (react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default.header },
+        react_1.default.createElement("div", { className: (0, classnames_1.default)({
+                [BookingWizard_module_scss_1.default.title]: isImagesTheme,
+            }) }, title),
+        ' ',
+        react_1.default.createElement(ui_1.Icon, { icon: ui_1.IconType.Close, onClick: onClose })));
+};
+exports.BWBottomSheetHeader = BWBottomSheetHeader;
 exports.default = BookingWizardBottomSheet;
 //# sourceMappingURL=BookingWizardBottomSheet.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BookingWizardBottomSheet.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardBottomSheet/BookingWizardBottomSheet.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,4DAAoC;AACpC,kDAA0B;AAC1B,yEAA0E;AAE1E,kEAA+D;AAE/D,MAAM,wBAAwB,GAA+B,CAAC,KAAK,EAAE,EAAE;IACnE,MAAM,EAAE,QAAQ,EAAE,SAAS,KAA0B,KAAK,EAA1B,gBAAgB,UAAK,KAAK,EAApD,yBAA4C,CAAQ,CAAC;IAE3D,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,eAAK,CAAC,UAAU,CAAC,2CAAoB,CAAC,CAAC;IAEjF,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,4BAA4B,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC;IAEjF,OAAO,CACH,8BAAC,uCAAW,kBAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,IAAM,gBAAgB,GAC9D,QAAQ,CACC,CACjB,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,wBAAwB,CAAC","sourcesContent":["import classNames from 'classnames';\nimport React from 'react';\nimport { BottomSheet, BottomSheetProps } from 'react-spring-bottom-sheet';\n\nimport { BookingWizardContext } from '../BookingWizardContext';\n\nconst BookingWizardBottomSheet: React.FC<BottomSheetProps> = (props) => {\n    const { children, className, ...bottomSheetProps } = props;\n\n    const { style, className: bwClassname } = React.useContext(BookingWizardContext);\n\n    const classes = classNames('roomstay-booking-container', bwClassname, className);\n\n    return (\n        <BottomSheet className={classes} style={style} {...bottomSheetProps}>\n            {children}\n        </BottomSheet>\n    );\n};\n\nexport default BookingWizardBottomSheet;\n"]}
+{"version":3,"file":"BookingWizardBottomSheet.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardBottomSheet/BookingWizardBottomSheet.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,qCAA8C;AAC9C,4DAAoC;AACpC,kDAAyC;AACzC,iDAA+C;AAC/C,yEAA0E;AAE1E,4DAAyD;AAEzD,8DAAsC;AACtC,oDAAuD;AACvD,6FAAkD;AAClD,kEAAiF;AACjF,MAAM,wBAAwB,GAA+B,CAAC,KAAK,EAAE,EAAE;IACnE,MAAM,EAAE,QAAQ,EAAE,SAAS,KAA0B,KAAK,EAA1B,gBAAgB,UAAK,KAAK,EAApD,yBAA4C,CAAQ,CAAC;IAE3D,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,eAAK,CAAC,UAAU,CAAC,2CAAoB,CAAC,CAAC;IAEjF,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,4BAA4B,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC;IAEjF,OAAO,CACH,8BAAC,uCAAW,kBAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,IAAM,gBAAgB,GAC9D,QAAQ,CACC,CACjB,CAAC;AACN,CAAC,CAAC;AAWK,MAAM,mBAAmB,GAAG,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,GAAG,KAAK,EAA4B,EAAE,EAAE;IAC7I,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uCAAgB,GAAE,CAAC;IACrC,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,IAAI,KAAK,KAAK,mCAAmB,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEtD,OAAO,CACH,uCAAK,SAAS,EAAE,mCAAM,CAAC,MAAM;QACxB,CAAC,QAAQ,CAAC,CAAC,CAAC,CACT,8BAAC,kBAAQ,IAAC,OAAO,QAAC,MAAM,QAAC,OAAO,QAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,IAAA,oBAAU,EAAC,mCAAM,CAAC,GAAG,EAAE,mCAAM,CAAC,YAAY,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,IACjH,QAAQ,IAAI,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,IAAI,CAAC,CACpC,CACd,CAAC,CAAC,CAAC,CACA,0CAAW,CACd;QAED,8BAAC,kBAAQ,IAAC,QAAQ,EAAE,YAAY,EAAE,OAAO,QAAC,OAAO,QAAC,MAAM,QAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,IAAA,oBAAU,EAAC,mCAAM,CAAC,GAAG,EAAE,mCAAM,CAAC,UAAU,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,IACvI,SAAS,IAAI,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,IAAI,CAAC,CACrC,CACT,CACT,CAAC;AACN,CAAC,CAAC;AApBW,QAAA,mBAAmB,uBAoB9B;AAEK,MAAM,mBAAmB,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAA6C,EAAE,EAAE;IACjG,MAAM,EAAE,aAAa,EAAE,GAAG,IAAA,uCAAgB,GAAE,CAAC;IAC7C,OAAO,CACH,uCAAK,SAAS,EAAE,mCAAM,CAAC,MAAM;QACzB,uCACI,SAAS,EAAE,IAAA,oBAAU,EAAC;gBAClB,CAAC,mCAAM,CAAC,KAAK,CAAC,EAAE,aAAa;aAChC,CAAC,IAED,KAAK,CACJ;QAAC,GAAG;QACV,8BAAC,SAAI,IAAC,IAAI,EAAE,aAAQ,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,GAAI,CAC9C,CACT,CAAC;AACN,CAAC,CAAC;AAdW,QAAA,mBAAmB,uBAc9B;AAEF,kBAAe,wBAAwB,CAAC","sourcesContent":["import { Icon, IconType } from '@roomstay/ui';\nimport classNames from 'classnames';\nimport React, { ReactNode } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { BottomSheet, BottomSheetProps } from 'react-spring-bottom-sheet';\n\nimport { Translation } from '@/translations/Translation';\n\nimport BEButton from '../../BEButton';\nimport { EBookingWizardTheme } from '../BookingWizard';\nimport styles from '../BookingWizard.module.scss';\nimport { BookingWizardContext, useBookingWizard } from '../BookingWizardContext';\nconst BookingWizardBottomSheet: React.FC<BottomSheetProps> = (props) => {\n    const { children, className, ...bottomSheetProps } = props;\n\n    const { style, className: bwClassname } = React.useContext(BookingWizardContext);\n\n    const classes = classNames('roomstay-booking-container', bwClassname, className);\n\n    return (\n        <BottomSheet className={classes} style={style} {...bottomSheetProps}>\n            {children}\n        </BottomSheet>\n    );\n};\n\ninterface BWBottomSheetFooterProps {\n    onPrev?: () => void;\n    onNext?: () => void;\n    hidePrev?: boolean;\n    preLabel?: string; // defaults to \"Back\"\n    nextLabel?: string; // defaults to \"Next\"\n    disabledNext?: boolean;\n}\n\nexport const BWBottomSheetFooter = ({ onPrev, onNext, hidePrev = false, preLabel, nextLabel, disabledNext = false }: BWBottomSheetFooterProps) => {\n    const { theme } = useBookingWizard();\n    const { t } = useTranslation();\n    if (theme !== EBookingWizardTheme.Images) return null;\n\n    return (\n        <div className={styles.footer}>\n            {!hidePrev ? (\n                <BEButton rounded isText primary size=\"small\" className={classNames(styles.btn, styles['btn-cancel'])} onClick={onPrev}>\n                    {preLabel || t(Translation.Navigation.Back)}\n                </BEButton>\n            ) : (\n                <div></div>\n            )}\n\n            <BEButton disabled={disabledNext} rounded primary filled size=\"small\" className={classNames(styles.btn, styles['btn-next'])} onClick={onNext}>\n                {nextLabel || t(Translation.Navigation.Next)}\n            </BEButton>\n        </div>\n    );\n};\n\nexport const BWBottomSheetHeader = ({ title, onClose }: { title: ReactNode; onClose: () => void }) => {\n    const { isImagesTheme } = useBookingWizard();\n    return (\n        <div className={styles.header}>\n            <div\n                className={classNames({\n                    [styles.title]: isImagesTheme,\n                })}\n            >\n                {title}\n            </div>{' '}\n            <Icon icon={IconType.Close} onClick={onClose} />\n        </div>\n    );\n};\n\nexport default BookingWizardBottomSheet;\n"]}

package/dist/src/components/generic/BookingWizard/BookingWizardContent.d.ts

@@ -22,3 +22,22 @@ export interface BookingWizardContentProps {
     dateFormat?: string;
 }
 export declare const BookingWizardContent: React.FC<BookingWizardContentProps>;
+export declare const BWPromoCodeSection: ({ inactive, hidden, setPromoCode, promoCode, onChange, valid, hideTooltip, t, isImagesTheme, divider, withLabel, }: BWPromoCodeSectionProps) => JSX.Element | null;
+export declare const BWClearButton: ({ hidden, onClick }: {
+    hidden: boolean;
+    onClick: any;
+}) => JSX.Element;
+interface BWPromoCodeSectionProps {
+    inactive: boolean;
+    hidden: boolean;
+    setPromoCode: React.Dispatch<React.SetStateAction<string>>;
+    promoCode: string;
+    onChange: (value?: string) => Promise<void>;
+    valid?: boolean;
+    hideTooltip?: boolean;
+    t: (key: string) => string;
+    isImagesTheme: boolean;
+    divider: boolean;
+    withLabel: boolean;
+}
+export {};

package/dist/src/components/generic/BookingWizard/BookingWizardContent.js

@@ -35,9 +35,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BookingWizardContent = void 0;
+exports.BWClearButton = exports.BWPromoCodeSection = exports.BookingWizardContent = void 0;
 require("react-spring-bottom-sheet/dist/style.css");
 const contexts_1 = require("../../../contexts/index.js");
+const ui_1 = require("@roomstay/ui");
 const classnames_1 = __importDefault(require("classnames"));
 const dayjs_1 = __importDefault(require("dayjs"));
 const react_1 = __importStar(require("react"));
@@ -46,14 +47,15 @@ const AvailabilityAPI_1 = __importDefault(require("../../../api/AvailabilityAPI"
 const RoomstayThemeEngine_1 = __importDefault(require("../../../providers/RoomstayThemeEngine"));
 const Translation_1 = require("../../../translations/Translation");
 const BEButton_1 = __importDefault(require("../BEButton"));
+const BookingWizard_1 = require("./BookingWizard");
 const BookingWizard_module_scss_1 = __importDefault(require("./BookingWizard.module.scss"));
 const BookingWizardContext_1 = require("./BookingWizardContext");
 const BookingWizardDateSelector_1 = require("./BookingWizardDateSelector/BookingWizardDateSelector");
 const BookingWizardGuestSelector_1 = require("./BookingWizardGuestSelector/BookingWizardGuestSelector");
 const BookingWizardHotelSelector_1 = require("./BookingWizardHotelSelector/BookingWizardHotelSelector");
 const BookingWizardPromoCode_1 = require("./BookingWizardPromoCode/BookingWizardPromoCode");
-const BookingWizardContent = ({ properties, selectedProperty: defaultProperty, defaultColors, classname, maxAdults, disableChild, showInfants, disableRoom, hideGuestSelect, hidePromocode, hideProperty, defaultValues, dateFormat, }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+const BookingWizardContent = ({ properties, selectedProperty: defaultProperty, defaultColors, classname, maxAdults, disableChild, showInfants, disableRoom, defaultValues, dateFormat, }) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
     const bwContext = (0, react_1.useContext)(BookingWizardContext_1.BookingWizardContext);
     const beContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);
     const { t } = (0, react_i18next_1.useTranslation)();
@@ -77,6 +79,7 @@ const BookingWizardContent = ({ properties, selectedProperty: defaultProperty, d
         }
     }, [selectedProperty]);
     const engineConfig = beContext.engine.getConfig();
+    const guestAgeConfig = engineConfig.guestAgeConfig;
     const yearDisplayOption = (0, react_1.useMemo)(() => {
         var _a, _b;
         return (_b = (_a = selectedProperty === null || selectedProperty === void 0 ? void 0 : selectedProperty.yearDisplayOption) !== null && _a !== void 0 ? _a : engineConfig.yearDisplayOption) !== null && _b !== void 0 ? _b : '';
@@ -96,13 +99,15 @@ const BookingWizardContent = ({ properties, selectedProperty: defaultProperty, d
         setCheckOutDate(endDate);
     };
     const isValid = () => {
-        if (!selectedProperty)
+        const isPropertyHidden = bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Property].hidden;
+        const isGuestSelectHidden = bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Guest].hidden;
+        if (!isPropertyHidden && !selectedProperty)
             return false;
         if (!checkInDate)
             return false;
         if (!checkOutDate)
             return false;
-        if (adults + children <= 0)
+        if (!isGuestSelectHidden && adults + children <= 0)
             return false;
         return true;
     };
@@ -131,7 +136,7 @@ const BookingWizardContent = ({ properties, selectedProperty: defaultProperty, d
         if (!value) {
             setPromoCodeValid(undefined);
         }
-        else if (isValid() && selectedProperty && checkInDate && checkOutDate) {
+        else if (isValid() && selectedProperty && (selectedProperty === null || selectedProperty === void 0 ? void 0 : selectedProperty.id) !== 'All' && checkInDate && checkOutDate) {
             const result = yield new AvailabilityAPI_1.default().fetchAvailability({
                 fromDate: checkInDate,
                 toDate: checkOutDate,
@@ -152,30 +157,111 @@ const BookingWizardContent = ({ properties, selectedProperty: defaultProperty, d
                 [BookingWizard_module_scss_1.default['--vertical']]: bwContext.layout === 'button',
                 [BookingWizard_module_scss_1.default.inline]: bwContext.type === 'inline',
             }, classname) },
-            hideProperty ? null : (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement("div", { ref: setHotelContainerRef, className: BookingWizard_module_scss_1.default.item },
-                    react_1.default.createElement("label", { className: BookingWizard_module_scss_1.default.label }, t(Translation_1.Translation.Misc.ChooseHotel)),
-                    react_1.default.createElement(BookingWizardHotelSelector_1.BookingWizardHotelSelector, { followElement: hotelContainerRef, onChange: (value) => {
-                            setSelectedProperty(value || undefined);
-                        }, properties: properties, selectedProperty: selectedProperty, contentClassName: classname })),
-                react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default.divider }))),
-            react_1.default.createElement(BookingWizardDateSelector_1.BookingWizardDateSelector, { onChange: setDate, defaultStartDate: (defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.checkIn) ? (0, dayjs_1.default)(defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.checkIn) : undefined, defaultEndDate: (defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.checkout) ? (0, dayjs_1.default)(defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.checkout) : undefined, dateFormat: dateFormat, showYearOnCalendar: showYearOnCalendar, yearDisplayOption: yearDisplayOption }),
-            hideGuestSelect ? null : (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default.divider }),
-                react_1.default.createElement("div", { ref: setGuestContainerRef, className: BookingWizard_module_scss_1.default.item },
-                    react_1.default.createElement("label", { className: BookingWizard_module_scss_1.default.label }, t(Translation_1.Translation.Misc.Guests)),
-                    react_1.default.createElement(BookingWizardGuestSelector_1.BookingWizardGuestSelector, { defaultValue: {
-                            adults,
-                            children,
-                            room,
-                        }, onChange: setGuest, maxAdults: maxAdults, disableChild: disableChild, showInfants: showInfants, disableRoom: disableRoom, followElement: guestsContainerRef, hideTooltip: engineConfig.hideTooltips })))),
-            react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default.divider }),
-            hidePromocode || bwContext.layout === 'horizontal-condensed' ? null : (react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default.item },
-                react_1.default.createElement("label", { className: BookingWizard_module_scss_1.default.label }, t(Translation_1.Translation.Misc.Promocode)),
-                react_1.default.createElement(BookingWizardPromoCode_1.BookingWizardPromoCode, { promoCode: promoCode, onChange: _onPromoCodeChange, valid: promoCodeValid, hideTooltip: engineConfig.hideTooltips }))),
-            !(bwContext.layout === 'horizontal-condensed') ? react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default.action }, submitButton) : null),
-        bwContext.layout === 'horizontal-condensed' ? (react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.content, classname) },
-            react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.action, BookingWizard_module_scss_1.default.centerItems, 'u-marg-top u-marg-top--light@l-') }, submitButton))) : null));
+            react_1.default.createElement(BWPropertySelectorSection, { hidden: bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Property].hidden, inactive: bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Property].inactive, withLabel: !bwContext.isImagesThemeMobile, divider: !bwContext.isImagesThemeMobile, containerRef: hotelContainerRef, setContainerRef: setHotelContainerRef, properties: properties, selectedProperty: selectedProperty, setSelectedProperty: setSelectedProperty, classname: classname, t: t }),
+            react_1.default.createElement(BookingWizardDateSelector_1.BookingWizardDateSelector, { hidden: bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Date].hidden, inactive: bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Date].inactive, onChange: setDate, defaultStartDate: checkInDate ? (0, dayjs_1.default)(checkInDate) : undefined, defaultEndDate: checkOutDate ? (0, dayjs_1.default)(checkOutDate) : undefined, dateFormat: dateFormat, showYearOnCalendar: showYearOnCalendar, yearDisplayOption: yearDisplayOption, notes: bwContext.isImagesTheme ? (_j = engineConfig === null || engineConfig === void 0 ? void 0 : engineConfig.notes) === null || _j === void 0 ? void 0 : _j.date : undefined }),
+            react_1.default.createElement(BWGuestSelectorSection, { hidden: bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Guest].hidden, inactive: bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Guest].inactive, divider: !bwContext.isImagesThemeMobile, isImagesTheme: bwContext.isImagesTheme, containerRef: guestsContainerRef, setContainerRef: setGuestContainerRef, onChange: setGuest, maxAdults: maxAdults, disableChild: disableChild, showInfants: showInfants, disableRoom: disableRoom, config: guestAgeConfig, notes: bwContext.isImagesTheme ? (_k = engineConfig === null || engineConfig === void 0 ? void 0 : engineConfig.notes) === null || _k === void 0 ? void 0 : _k.guest : undefined, defaultValue: {
+                    adults: adults,
+                    children: children,
+                    room: room,
+                    infants: infants,
+                }, defaultGuestConfig: {
+                    adults: (_l = defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.guests) === null || _l === void 0 ? void 0 : _l.adults,
+                    children: (_m = defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.guests) === null || _m === void 0 ? void 0 : _m.children,
+                    room: (_o = defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.guests) === null || _o === void 0 ? void 0 : _o.room,
+                    infants: (_p = defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.guests) === null || _p === void 0 ? void 0 : _p.infants,
+                }, promoCodeConfig: {
+                    divider: false,
+                    withLabel: true,
+                    promoCode,
+                    setPromoCode,
+                    onChange: _onPromoCodeChange,
+                    valid: promoCodeValid,
+                    hideTooltip: engineConfig.hideTooltips,
+                }, submitConfig: {
+                    onSubmit: _onSubmit,
+                    disabledNext: !isValid(),
+                } }),
+            react_1.default.createElement(exports.BWPromoCodeSection, { hidden: bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Promo].hidden, inactive: bwContext.stateSections[BookingWizard_1.EBookingWizardSection.Promo].inactive, isImagesTheme: bwContext.isImagesTheme, setPromoCode: setPromoCode, promoCode: promoCode, onChange: _onPromoCodeChange, valid: promoCodeValid, hideTooltip: engineConfig.hideTooltips, t: t, divider: true, withLabel: true }),
+            bwContext.layout !== 'horizontal-condensed' && !bwContext.isImagesThemeMobile && react_1.default.createElement(SubmitButtonSection, { button: submitButton })),
+        bwContext.layout === 'horizontal-condensed' && !bwContext.isImagesThemeMobile && (react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.content, classname) },
+            react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.action, BookingWizard_module_scss_1.default.centerItems, 'u-marg-top u-marg-top--light@l-') }, submitButton)))));
 };
 exports.BookingWizardContent = BookingWizardContent;
+const BWPropertySelectorSection = ({ inactive, hidden, containerRef, setContainerRef, properties, selectedProperty, setSelectedProperty, classname, t, divider = true, withLabel = true, }) => {
+    if (hidden)
+        return null;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { ref: setContainerRef, className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.item, BookingWizard_module_scss_1.default['item-hotel'], {
+                [BookingWizard_module_scss_1.default['inactive']]: inactive,
+            }) },
+            react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default['item-ellipsis-wrapper']) },
+                withLabel && react_1.default.createElement("label", { className: BookingWizard_module_scss_1.default.label }, t(Translation_1.Translation.Misc.ChooseHotel)),
+                react_1.default.createElement(BookingWizardHotelSelector_1.BookingWizardHotelSelector, { followElement: containerRef, onChange: (value) => {
+                        setSelectedProperty(value || undefined);
+                    }, properties: properties, selectedProperty: selectedProperty, contentClassName: (0, classnames_1.default)(classname) }))),
+        divider ? (react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.divider, {
+                [BookingWizard_module_scss_1.default['inactive']]: inactive,
+            }) })) : null));
+};
+const BWGuestSelectorSection = ({ inactive, hidden, containerRef, setContainerRef, defaultValue: _defaultValue, onChange, maxAdults, disableChild, showInfants, disableRoom, config, notes, defaultGuestConfig, divider, promoCodeConfig, submitConfig, isImagesTheme, }) => {
+    if (hidden)
+        return null;
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const [isOverlayOpen, setIsOverlayOpen] = (0, react_1.useState)(false);
+    const [defaultValue, setDefaultValue] = (0, react_1.useState)(_defaultValue);
+    const onOverlayOpenChange = (isOpen) => {
+        setIsOverlayOpen(isOpen);
+    };
+    const onClearHandler = () => {
+        const emptyValues = {
+            adults: 0,
+            children: 0,
+            room: 0,
+            infants: 0,
+        };
+        onChange(Object.assign({}, emptyValues));
+        setDefaultValue(Object.assign({}, emptyValues));
+    };
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        divider ? (react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.divider, {
+                [BookingWizard_module_scss_1.default['inactive']]: inactive,
+            }) })) : null,
+        react_1.default.createElement("div", { ref: setContainerRef, className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.item, {
+                [BookingWizard_module_scss_1.default['inactive']]: inactive,
+            }) },
+            react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default['item-with-icon'] },
+                react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default['item-fullwidth'], BookingWizard_module_scss_1.default['item-ellipsis-wrapper']) },
+                    react_1.default.createElement("label", { className: BookingWizard_module_scss_1.default.label }, t(Translation_1.Translation.Misc.Guests)),
+                    react_1.default.createElement(BookingWizardGuestSelector_1.BookingWizardGuestSelector, Object.assign({ defaultValue: defaultValue, onChange: onChange, maxAdults: maxAdults, disableChild: disableChild, showInfants: showInfants, disableRoom: disableRoom, followElement: containerRef }, config, { notes: isImagesTheme ? notes : undefined, onOverlayOpenChange: onOverlayOpenChange, promoCodeConfig: promoCodeConfig, submitConfig: submitConfig }))),
+                isImagesTheme && react_1.default.createElement(exports.BWClearButton, { hidden: isOverlayOpen, onClick: onClearHandler })))));
+};
+const BWPromoCodeSection = ({ inactive, hidden, setPromoCode, promoCode, onChange, valid, hideTooltip, t, isImagesTheme, divider = true, withLabel = true, }) => {
+    if (hidden)
+        return null;
+    const onClearHandler = (event) => {
+        setPromoCode('');
+        event.preventDefault();
+        event.stopPropagation();
+    };
+    const [focused, setFocused] = react_1.default.useState(false);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        divider ? (react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.divider, {
+                [BookingWizard_module_scss_1.default['inactive']]: inactive,
+            }) })) : null,
+        react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default.item, BookingWizard_module_scss_1.default['item-promo-code-wrapper'], {
+                [BookingWizard_module_scss_1.default['inactive']]: inactive,
+            }), onFocus: () => setFocused(true), onBlur: () => setFocused(false) },
+            react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default['item-with-icon'] },
+                react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizard_module_scss_1.default['item-fullwidth'], BookingWizard_module_scss_1.default['item-ellipsis-wrapper']) },
+                    withLabel && react_1.default.createElement("label", { className: BookingWizard_module_scss_1.default.label }, t(Translation_1.Translation.Misc.Promocode)),
+                    react_1.default.createElement(BookingWizardPromoCode_1.BookingWizardPromoCode, { promoCode: promoCode, onChange: onChange, valid: valid, hideTooltip: hideTooltip })),
+                isImagesTheme && react_1.default.createElement(exports.BWClearButton, { hidden: focused, onClick: onClearHandler })))));
+};
+exports.BWPromoCodeSection = BWPromoCodeSection;
+const SubmitButtonSection = ({ button }) => react_1.default.createElement("div", { className: BookingWizard_module_scss_1.default.action }, button);
+const BWClearButton = ({ hidden, onClick }) => {
+    return hidden ? (react_1.default.createElement("div", { onMouseDown: (e) => e.preventDefault(), className: BookingWizard_module_scss_1.default['clear-button'], onClick: onClick },
+        react_1.default.createElement(ui_1.Icon, { icon: ui_1.IconType.Close, name: "Clear" }))) : (react_1.default.createElement(react_1.default.Fragment, null));
+};
+exports.BWClearButton = BWClearButton;
 //# sourceMappingURL=BookingWizardContent.js.map