@roomstay/frontend 2.6.75 → 2.6.77-0

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

@@ -93,7 +93,7 @@ function RoomList() {
                 scrollIntoView();
             }, 100);
         }
-        const elements = (react_1.default.createElement("div", { ref: roomListRef }, isLoading || !loadingAttempted ? (react_1.default.createElement(LargeLoader_1.default, null)) : sortedRooms.length ? (sortedRooms.map((room, index) => react_1.default.createElement(RoomDetails_1.default, { key: room.code, room: room, disableMarginBottom: index === sortedRooms.length - 1 }))) : (react_1.default.createElement(react_1.default.Fragment, null,
+        const elements = (react_1.default.createElement("div", { ref: roomListRef, className: "room-list" }, isLoading || !loadingAttempted ? (react_1.default.createElement(LargeLoader_1.default, null)) : sortedRooms.length ? (react_1.default.createElement("div", { className: "room-list__container" }, sortedRooms.map((room, index) => (react_1.default.createElement(RoomDetails_1.default, { key: room.code, room: room, disableMarginBottom: index === sortedRooms.length - 1 }))))) : (react_1.default.createElement(react_1.default.Fragment, null,
             apiHasError ? react_1.default.createElement(StepRoomErrorForm_1.StepRoomErrorForm, null) : react_1.default.createElement(NoRoomsFoundBlock_1.default, null), (_a = hotel === null || hotel === void 0 ? void 0 : hotel.crossSellHotelIds) === null || _a === void 0 ? void 0 :
             _a.map((hotelId) => (react_1.default.createElement(RoomListCrossSellBlock_1.default, { key: hotelId, hotelId: hotelId })))))));
         DataLayer_1.default.instance.sendRoomImpressions();

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

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

package/dist/src/components/steps/room/RoomModal.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { Room } from '../../../models/Room/Room';
 import { RoomRate } from '../../../models/Room/RoomRate';
 interface RoomModalProps {
@@ -7,5 +8,5 @@ interface RoomModalProps {
     open: boolean;
     onClose?: () => void;
 }
-export default function RoomModal(props: RoomModalProps): JSX.Element;
+export default function RoomModal(props: RoomModalProps): React.JSX.Element;
 export {};

package/dist/src/components/steps/room/RoomModalPerkRow.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { Hotel } from '../../../models/Client/Hotel/Hotel';
 import { HotelPerk } from '../../../models/Client/Hotel/HotelPerk';
 import { Room } from '../../../models/Room/Room';
@@ -7,4 +8,4 @@ export interface RoomModalPerkRowProps {
     roomPerks: HotelPerk[];
 }
 export declare const BE_ROOM_MODAL_PERK_ROW = "BERoomModalPerkRow";
-export default function RoomModalPerkRow(props: RoomModalPerkRowProps): JSX.Element;
+export default function RoomModalPerkRow(props: RoomModalPerkRowProps): React.JSX.Element;

package/dist/src/components/steps/room/StepRoomAlertBlocks.d.ts

@@ -1 +1,2 @@
-export default function StepRoomAlertBlocks(): JSX.Element;
+import React from 'react';
+export default function StepRoomAlertBlocks(): React.JSX.Element;

package/dist/src/components/steps/room/StepRoomBestRateAlert.d.ts

@@ -1,2 +1,3 @@
+import React from 'react';
 export declare const STEP_ROOM_BEST_RATE_ALERT = "StepRoomBestRateAlert";
-export default function StepRoomBestRateAlert(): JSX.Element;
+export default function StepRoomBestRateAlert(): React.JSX.Element;

package/dist/src/components/steps/room/StepRoomErrorForm.d.ts

@@ -1 +1,2 @@
-export declare const StepRoomErrorForm: () => JSX.Element;
+import React from 'react';
+export declare const StepRoomErrorForm: () => React.JSX.Element;

package/dist/src/components/steps/room/StepRoomHotelDetails.d.ts

@@ -1 +1,2 @@
-export default function StepRoomHotelDetails(): JSX.Element;
+import React from 'react';
+export default function StepRoomHotelDetails(): React.JSX.Element;

package/dist/src/components/steps/room/StepRoomSortBy.d.ts

@@ -1 +1,2 @@
-export default function StepRoomSortBy(): JSX.Element;
+import React from 'react';
+export default function StepRoomSortBy(): React.JSX.Element;

package/dist/src/components/steps/room/StepRoomSummaryAndButton.d.ts

@@ -1 +1,2 @@
-export default function StepRoomSummaryAndButton(): JSX.Element;
+import React from 'react';
+export default function StepRoomSummaryAndButton(): React.JSX.Element;

package/dist/src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 import { HotelRoomGroupsDTO } from '../../../../models/Api/HotelDTO';
 import { Room } from '../../../../models/Room/Room';
 type TabGroupedRoomListProps = {
     rooms: Room[];
     group: HotelRoomGroupsDTO[number];
 };
-export declare const TabGroupedRoomList: (props: TabGroupedRoomListProps) => JSX.Element;
+export declare const TabGroupedRoomList: (props: TabGroupedRoomListProps) => React.JSX.Element;
 export {};

package/dist/src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.js

@@ -28,6 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabGroupedRoomList = void 0;
 const contexts_1 = require("../../../../contexts/index.js");
+const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importStar(require("react"));
 const Headline_1 = __importDefault(require("../../../generic/Headline"));
 const Select_1 = require("../../../generic/Select/Select");
@@ -75,7 +76,7 @@ const TabGroupedRoomList = (props) => {
             return react_1.default.createElement(RoomDetails_1.default, { key: room.code, room: room, disableMarginBottom: index === rooms.length - 1 });
         });
     }, [rooms, appliedFilters, sortBy, orderUnavailableRoomsLast]);
-    return (react_1.default.createElement("div", { className: TabGroupedRoomList_module_scss_1.default.groupedRoomList },
+    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(TabGroupedRoomList_module_scss_1.default.groupedRoomList, 'room-list') },
         !!group.groupName && (react_1.default.createElement("div", { className: TabGroupedRoomList_module_scss_1.default.groupedRoomListHeader },
             react_1.default.createElement(Headline_1.default, { bold: true }, group.groupName))),
         !!(filterKeys === null || filterKeys === void 0 ? void 0 : filterKeys.length) && rooms.length > 1 && (react_1.default.createElement("div", { className: TabGroupedRoomList_module_scss_1.default.filterContainer }, filterKeys.map((filterKey) => {
@@ -98,7 +99,7 @@ const TabGroupedRoomList = (props) => {
                     react_1.default.createElement(Select_1.Select, { keyName: "value", labelName: "label", options: options, value: currentValue, onChange: localOnFilterChange })));
             }
         }))),
-        roomList));
+        react_1.default.createElement("div", { className: "room-list__container" }, roomList)));
 };
 exports.TabGroupedRoomList = TabGroupedRoomList;
 //# sourceMappingURL=TabGroupedRoomList.js.map

package/dist/src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabGroupedRoomList.js","sourceRoot":"/","sources":["src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext, HotelOverridesContext } from '@frontend/contexts';\nimport React, { useContext, useMemo, useState } from 'react';\n\nimport Headline from '@/components/generic/Headline';\nimport { Select } from '@/components/generic/Select/Select';\nimport { useCurrentHotel } from '@/hooks';\nimport { HotelRoomGroupsDTO } from '@/models/Api/HotelDTO';\nimport { Room } from '@/models/Room/Room';\nimport RoomSortProvider from '@/providers/RoomSortProvider';\n\nimport RoomDetails from '../roomDetails/RoomDetails';\nimport styles from './TabGroupedRoomList.module.scss';\n\ntype TabGroupedRoomListProps = {\n    rooms: Room[];\n    group: HotelRoomGroupsDTO[number];\n};\n\nexport const TabGroupedRoomList = (props: TabGroupedRoomListProps) => {\n    const beContext = useContext(BookingEngineContext);\n    const { orderUnavailableRoomsLast } = useContext(HotelOverridesContext);\n    const { hotel } = useCurrentHotel();\n\n    const sortBy = beContext.currentRoomSort;\n    const { rooms, group } = props;\n    const [appliedFilters, setAppliedFilters] = useState<{ [id: string]: any }>({});\n\n    const filterKeys = useMemo(() => {\n        return Object.keys(group.filters || {});\n    }, [group.filters]);\n\n    const roomList = useMemo(() => {\n        const sortedRooms = [...rooms];\n        if (sortedRooms.length !== 0) {\n            sortedRooms.sort(RoomSortProvider.getSortByFunction(sortBy));\n        }\n\n        if (hotel?.showUnavailableRooms) {\n            if (orderUnavailableRoomsLast) {\n                sortedRooms.sort((a, b) => {\n                    if (a.isAvailable() && !b.isAvailable()) return -1;\n                    if (!a.isAvailable() && b.isAvailable()) return 1;\n                    return 0;\n                });\n            }\n        }\n\n        return sortedRooms\n            .filter((room) => {\n                for (const filter of Object.keys(appliedFilters)) {\n                    if (room.auxiliaryValues?.[filter] && appliedFilters[filter] && !room.auxiliaryValues[filter].includes(`${appliedFilters[filter]}`)) {\n                        return false;\n                    }\n                }\n\n                return room;\n            })\n            .map((room, index) => {\n                return <RoomDetails key={room.code} room={room} disableMarginBottom={index === rooms.length - 1} />;\n            });\n    }, [rooms, appliedFilters, sortBy, orderUnavailableRoomsLast]);\n\n    return (\n        <div className={styles.groupedRoomList}>\n            {!!group.groupName && (\n                <div className={styles.groupedRoomListHeader}>\n                    <Headline bold>{group.groupName}</Headline>\n                </div>\n            )}\n\n            {!!filterKeys?.length && rooms.length > 1 && (\n                <div className={styles.filterContainer}>\n                    {filterKeys.map((filterKey) => {\n                        const filter = group.filters?.[filterKey];\n\n                        if (filter.type === 'select') {\n                            const options = [{ label: 'All', value: null }, ...filter.options];\n                            const currentValue = appliedFilters?.[filterKey] ?? (options[0] as any)?.value;\n\n                            const localOnFilterChange = (value: string) => {\n                                setAppliedFilters((prev) => {\n                                    const filter = { ...prev, [filterKey]: value };\n\n                                    beContext.setCurrentGroupedRoomFilters(filter);\n\n                                    return filter;\n                                });\n                            };\n\n                            return (\n                                <div key={filterKey} className={styles.filterItem}>\n                                    <div className={styles['filterItem-label']}>{filter.name}:</div>\n                                    <Select keyName=\"value\" labelName=\"label\" options={options as any} value={currentValue} onChange={localOnFilterChange}></Select>\n                                </div>\n                            );\n                        }\n                    })}\n                </div>\n            )}\n            {roomList}\n        </div>\n    );\n};\n"]}
+{"version":3,"file":"TabGroupedRoomList.js","sourceRoot":"/","sources":["src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext, HotelOverridesContext } from '@frontend/contexts';\nimport classNames from 'classnames';\nimport React, { useContext, useMemo, useState } from 'react';\n\nimport Headline from '@/components/generic/Headline';\nimport { Select } from '@/components/generic/Select/Select';\nimport { useCurrentHotel } from '@/hooks';\nimport { HotelRoomGroupsDTO } from '@/models/Api/HotelDTO';\nimport { Room } from '@/models/Room/Room';\nimport RoomSortProvider from '@/providers/RoomSortProvider';\n\nimport RoomDetails from '../roomDetails/RoomDetails';\nimport styles from './TabGroupedRoomList.module.scss';\n\ntype TabGroupedRoomListProps = {\n    rooms: Room[];\n    group: HotelRoomGroupsDTO[number];\n};\n\nexport const TabGroupedRoomList = (props: TabGroupedRoomListProps) => {\n    const beContext = useContext(BookingEngineContext);\n    const { orderUnavailableRoomsLast } = useContext(HotelOverridesContext);\n    const { hotel } = useCurrentHotel();\n\n    const sortBy = beContext.currentRoomSort;\n    const { rooms, group } = props;\n    const [appliedFilters, setAppliedFilters] = useState<{ [id: string]: any }>({});\n\n    const filterKeys = useMemo(() => {\n        return Object.keys(group.filters || {});\n    }, [group.filters]);\n\n    const roomList = useMemo(() => {\n        const sortedRooms = [...rooms];\n        if (sortedRooms.length !== 0) {\n            sortedRooms.sort(RoomSortProvider.getSortByFunction(sortBy));\n        }\n\n        if (hotel?.showUnavailableRooms) {\n            if (orderUnavailableRoomsLast) {\n                sortedRooms.sort((a, b) => {\n                    if (a.isAvailable() && !b.isAvailable()) return -1;\n                    if (!a.isAvailable() && b.isAvailable()) return 1;\n                    return 0;\n                });\n            }\n        }\n\n        return sortedRooms\n            .filter((room) => {\n                for (const filter of Object.keys(appliedFilters)) {\n                    if (room.auxiliaryValues?.[filter] && appliedFilters[filter] && !room.auxiliaryValues[filter].includes(`${appliedFilters[filter]}`)) {\n                        return false;\n                    }\n                }\n\n                return room;\n            })\n            .map((room, index) => {\n                return <RoomDetails key={room.code} room={room} disableMarginBottom={index === rooms.length - 1} />;\n            });\n    }, [rooms, appliedFilters, sortBy, orderUnavailableRoomsLast]);\n\n    return (\n        <div className={classNames(styles.groupedRoomList, 'room-list')}>\n            {!!group.groupName && (\n                <div className={styles.groupedRoomListHeader}>\n                    <Headline bold>{group.groupName}</Headline>\n                </div>\n            )}\n\n            {!!filterKeys?.length && rooms.length > 1 && (\n                <div className={styles.filterContainer}>\n                    {filterKeys.map((filterKey) => {\n                        const filter = group.filters?.[filterKey];\n\n                        if (filter.type === 'select') {\n                            const options = [{ label: 'All', value: null }, ...filter.options];\n                            const currentValue = appliedFilters?.[filterKey] ?? (options[0] as any)?.value;\n\n                            const localOnFilterChange = (value: string) => {\n                                setAppliedFilters((prev) => {\n                                    const filter = { ...prev, [filterKey]: value };\n\n                                    beContext.setCurrentGroupedRoomFilters(filter);\n\n                                    return filter;\n                                });\n                            };\n\n                            return (\n                                <div key={filterKey} className={styles.filterItem}>\n                                    <div className={styles['filterItem-label']}>{filter.name}:</div>\n                                    <Select keyName=\"value\" labelName=\"label\" options={options as any} value={currentValue} onChange={localOnFilterChange}></Select>\n                                </div>\n                            );\n                        }\n                    })}\n                </div>\n            )}\n            <div className=\"room-list__container\">{roomList}</div>\n        </div>\n    );\n};\n"]}

package/dist/src/components/steps/room/TabGroupedRooms/TabGroupedRooms.d.ts

@@ -1 +1,2 @@
-export declare const TabGroupedRooms: () => JSX.Element;
+import React from 'react';
+export declare const TabGroupedRooms: () => React.JSX.Element;

package/dist/src/components/steps/room/TripteaseLodgingSearchSchema.d.ts

@@ -1 +1,2 @@
-export declare const TripteaseLodgingSearchSchema: () => JSX.Element;
+import React from 'react';
+export declare const TripteaseLodgingSearchSchema: () => React.JSX.Element;

package/dist/src/components/steps/room/UserSearchSummary/PromoCodeVerificationAlert.d.ts

@@ -1,4 +1,5 @@
+import React from 'react';
 import type BasketRow from '../../../../models/BasketRow';
 export declare const PromoCodeVerificationAlert: ({ selectedBasketRow }: {
     selectedBasketRow: BasketRow | null;
-}) => JSX.Element;
+}) => React.JSX.Element;

package/dist/src/components/steps/room/UserSearchSummary/UserSearchSummary.d.ts

@@ -1 +1,2 @@
-export declare const UserSearchSummary: () => JSX.Element;
+import React from 'react';
+export declare const UserSearchSummary: () => React.JSX.Element;

package/dist/src/components/steps/room/UserSearchSummary/UserSearchSummaryForm.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import BasketRow from '../../../../models/BasketRow';
+import { Hotel } from '../../../../models/Client/Hotel/Hotel';
+import { Color } from '../../../../util/Color';
+import { BookingWizardContextType, BookingWizardOnBooking } from '../../../generic/BookingWizard/BookingWizardContext';
+interface UserSearchSummaryFormProps {
+    row: BasketRow;
+    hotel?: Hotel;
+    isSelectedRow: boolean;
+    bookingWizardContext: BookingWizardContextType;
+    maxAdults: number;
+    maxChildren: number;
+    maxInfants: number;
+    showChildren: boolean;
+    setGuest: (guests: BookingWizardOnBooking['guests']) => void;
+    setGuests: React.Dispatch<React.SetStateAction<{
+        adults: number;
+        children: number;
+        infants: number;
+    }>>;
+    changePromoCode: (promo: string) => void;
+    textColor?: Color;
+}
+export declare const UserSearchSummaryForm: React.FC<UserSearchSummaryFormProps>;
+export {};

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

@@ -0,0 +1,38 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UserSearchSummaryForm = void 0;
+const react_1 = __importDefault(require("react"));
+const react_i18next_1 = require("react-i18next");
+const Translation_1 = require("../../../../translations/Translation");
+const BookingWizardContext_1 = require("../../../generic/BookingWizard/BookingWizardContext");
+const BookingWizardGuestSelector_1 = require("../../../generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector");
+const UserSearchSummaryPromocodeInput_1 = require("./UserSearchSummaryPromocodeInput");
+const UserSearchSummaryRow_module_scss_1 = __importDefault(require("./UserSearchSummaryRow.module.scss"));
+const UserSearchSummaryForm = ({ row, hotel, isSelectedRow, bookingWizardContext, maxAdults, maxChildren, maxInfants, showChildren, setGuest, setGuests, changePromoCode, textColor, }) => {
+    var _a, _b, _c;
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const showInfants = ((_a = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _a === void 0 ? void 0 : _a.supportInfants) === true;
+    const childRange = (_b = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _b === void 0 ? void 0 : _b.childRange;
+    const infantRange = (_c = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _c === void 0 ? void 0 : _c.infantRange;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__divider'] }),
+        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.Guests)),
+                    react_1.default.createElement(BookingWizardContext_1.BookingWizardContext.Provider, { value: bookingWizardContext },
+                        react_1.default.createElement(BookingWizardGuestSelector_1.BookingWizardGuestSelector, { defaultValue: {
+                                adults: row.getAdults(),
+                                children: row.getChildren(),
+                                infants: row.getInfants(),
+                            }, onChange: setGuest, onEditingChange: setGuests, disableChild: !showChildren, showInfants: showInfants, maxAdults: maxAdults, maxChildren: maxChildren, maxInfants: maxInfants, disableRoom: true, ageRange: { child: childRange, infant: infantRange } }))))),
+        react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__divider'] }),
+        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(UserSearchSummaryPromocodeInput_1.UserSearchSummaryPromocodeInput, { row: row, onChange: changePromoCode, disabled: !isSelectedRow, promocodeTextColor: textColor, useUpdatedDesign: true })))));
+};
+exports.UserSearchSummaryForm = UserSearchSummaryForm;
+//# sourceMappingURL=UserSearchSummaryForm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"UserSearchSummaryForm.js","sourceRoot":"/","sources":["src/components/steps/room/UserSearchSummary/UserSearchSummaryForm.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,iDAA+C;AAI/C,4DAAyD;AAGzD,8FAA6I;AAC7I,qIAAkI;AAClI,uFAAoF;AACpF,0GAAwD;AAuBjD,MAAM,qBAAqB,GAAyC,CAAC,EACxE,GAAG,EACH,KAAK,EACL,aAAa,EACb,oBAAoB,EACpB,SAAS,EACT,WAAW,EACX,UAAU,EACV,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,eAAe,EACf,SAAS,GACZ,EAAE,EAAE;;IACD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,WAAW,GAAG,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB,0CAAE,cAAc,MAAK,IAAI,CAAC;IACvE,MAAM,UAAU,GAAG,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB,0CAAE,UAAU,CAAC;IACzD,MAAM,WAAW,GAAG,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB,0CAAE,WAAW,CAAC;IAE3D,OAAO,CACH;QACI,uCAAK,SAAS,EAAE,0CAAM,CAAC,kCAAkC,CAAC,GAAI;QAC9D,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;YACpD,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;gBACpD,uCAAK,SAAS,EAAE,0CAAM,CAAC,+BAA+B,CAAC;oBACnD,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC,IAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CAAO;oBAC5F,8BAAC,2CAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,oBAAoB;wBACtD,8BAAC,uDAA0B,IACvB,YAAY,EAAE;gCACV,MAAM,EAAE,GAAG,CAAC,SAAS,EAAE;gCACvB,QAAQ,EAAE,GAAG,CAAC,WAAW,EAAE;gCAC3B,OAAO,EAAE,GAAG,CAAC,UAAU,EAAE;6BAC5B,EACD,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,SAAS,EAC1B,YAAY,EAAE,CAAC,YAAY,EAC3B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,WAAW,QACX,QAAQ,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,WAAW,EAAE,GACtD,CAC0B,CAC9B,CACJ,CACJ;QACN,uCAAK,SAAS,EAAE,0CAAM,CAAC,kCAAkC,CAAC,GAAI;QAC9D,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;YACpD,uCAAK,SAAS,EAAE,0CAAM,CAAC,gCAAgC,CAAC;gBACpD,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,CACP,CACN,CAAC;AACN,CAAC,CAAC;AAxDW,QAAA,qBAAqB,yBAwDhC","sourcesContent":["import React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport BasketRow from '@/models/BasketRow';\nimport { Hotel } from '@/models/Client/Hotel/Hotel';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\n\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\ninterface UserSearchSummaryFormProps {\n    row: BasketRow;\n    hotel?: Hotel;\n    isSelectedRow: boolean;\n    bookingWizardContext: BookingWizardContextType;\n    maxAdults: number;\n    maxChildren: number;\n    maxInfants: number;\n    showChildren: boolean;\n    setGuest: (guests: BookingWizardOnBooking['guests']) => void;\n    setGuests: React.Dispatch<\n        React.SetStateAction<{\n            adults: number;\n            children: number;\n            infants: number;\n        }>\n    >;\n    changePromoCode: (promo: string) => void;\n    textColor?: Color;\n}\n\nexport const UserSearchSummaryForm: React.FC<UserSearchSummaryFormProps> = ({\n    row,\n    hotel,\n    isSelectedRow,\n    bookingWizardContext,\n    maxAdults,\n    maxChildren,\n    maxInfants,\n    showChildren,\n    setGuest,\n    setGuests,\n    changePromoCode,\n    textColor,\n}) => {\n    const { t } = useTranslation();\n\n    const showInfants = hotel?.childConfiguration?.supportInfants === true;\n    const childRange = hotel?.childConfiguration?.childRange;\n    const infantRange = hotel?.childConfiguration?.infantRange;\n\n    return (\n        <>\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={showInfants}\n                                maxAdults={maxAdults}\n                                maxChildren={maxChildren}\n                                maxInfants={maxInfants}\n                                disableRoom\n                                ageRange={{ child: childRange, infant: infantRange }}\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        </>\n    );\n};\n"]}

package/dist/src/components/steps/room/UserSearchSummary/UserSearchSummaryPromocodeInput.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import BasketRow from '../../../../models/BasketRow';
 import { Color } from '../../../../util/Color';
 type UserSearchSummaryPromocodeInputProps = {
@@ -7,5 +8,5 @@ type UserSearchSummaryPromocodeInputProps = {
     promocodeTextColor?: Color;
     useUpdatedDesign?: boolean;
 };
-export declare const UserSearchSummaryPromocodeInput: ({ row, disabled, onChange, promocodeTextColor, useUpdatedDesign, }: UserSearchSummaryPromocodeInputProps) => JSX.Element;
+export declare const UserSearchSummaryPromocodeInput: ({ row, disabled, onChange, promocodeTextColor, useUpdatedDesign, }: UserSearchSummaryPromocodeInputProps) => React.JSX.Element;
 export {};

package/dist/src/components/steps/room/UserSearchSummary/UserSearchSummaryRow.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 import BasketRow from '../../../../models/BasketRow';
 type UserSearchSummaryRowProps = {
     row: BasketRow;
     index: number;
 };
-export declare const UserSearchSummaryRow: ({ row, index }: UserSearchSummaryRowProps) => JSX.Element;
+export declare const UserSearchSummaryRow: ({ row, index }: UserSearchSummaryRowProps) => React.JSX.Element;
 export {};

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

@@ -32,6 +32,7 @@ const hooks_1 = require("../../../../hooks/index.js");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importStar(require("react"));
 const react_i18next_1 = require("react-i18next");
+const AutoAutoHeight_1 = __importDefault(require("../../../../animations/AutoAutoHeight"));
 const BEButton_1 = __importDefault(require("../../../generic/BEButton"));
 const FloatingDatePicker_1 = __importDefault(require("../../../generic/date/FloatingDatePicker"));
 const Icon_1 = __importStar(require("../../../generic/Icon/Icon"));
@@ -39,23 +40,24 @@ const Pill_1 = __importStar(require("../../../generic/Pill"));
 const Text_1 = __importStar(require("../../../generic/Text"));
 const Tooltip_1 = __importDefault(require("../../../generic/Tooltip/Tooltip"));
 const useSearchScopeHook_1 = require("../../../../hooks/useSearchScopeHook");
+const WindowSize_1 = require("../../../../hooks/WindowSize");
 const Translation_1 = require("../../../../translations/Translation");
 const Color_1 = require("../../../../util/Color");
 const DataLayer_1 = __importStar(require("../../../../util/DataLayer"));
 const ScreenSize_1 = __importDefault(require("../../../../util/ScreenSize"));
 const StringHelper_1 = __importDefault(require("../../../../util/StringHelper"));
 const BookingWizard_1 = require("../../../generic/BookingWizard/BookingWizard");
-const BookingWizardContext_1 = require("../../../generic/BookingWizard/BookingWizardContext");
-const BookingWizardGuestSelector_1 = require("../../../generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector");
-const UserSearchSummaryPromocodeInput_1 = require("./UserSearchSummaryPromocodeInput");
+const UserSearchSummaryForm_1 = require("./UserSearchSummaryForm");
 const UserSearchSummaryRow_module_scss_1 = __importDefault(require("./UserSearchSummaryRow.module.scss"));
 const UserSearchSummaryRow = ({ row, index }) => {
-    var _a, _b, _c, _d;
+    var _a;
     const { t } = (0, react_i18next_1.useTranslation)();
     const removeButtonRef = (0, react_1.useRef)();
     const { isAccent2ColorDark, hotel } = (0, hooks_1.useCurrentHotel)();
     const { selectedBasketRow, currentBasketRows, updateBasketRow, removeBasketRow, selectBasketRow } = (0, react_1.useContext)(contexts_1.BasketContext);
     const engineContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);
+    const { isMobile } = (0, WindowSize_1.useWindowSize)();
+    const [collapsed, setCollapsed] = (0, react_1.useState)(true);
     const isSelectedRow = (0, react_1.useMemo)(() => {
         return (selectedBasketRow === null || selectedBasketRow === void 0 ? void 0 : selectedBasketRow.getID()) === (row === null || row === void 0 ? void 0 : row.getID());
     }, [selectedBasketRow]);
@@ -134,6 +136,10 @@ const UserSearchSummaryRow = ({ row, index }) => {
     const removeButton = (react_1.default.createElement(Tooltip_1.default, { title: canRemove ? 'Remove this room' : 'Cannot remove this room as at least one must be selected.', followElement: removeButtonRef === null || removeButtonRef === void 0 ? void 0 : removeButtonRef.current, wrapperClasses: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__remove-tooltip'] },
         react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__remove'], onClick: removeRoomOnClick, ref: removeButtonRef },
             react_1.default.createElement(BEButton_1.default, { textColor: textColor, isText: true, icon: Icon_1.IconType.Close, iconPosition: "right", stopIconAnimation: true, disabled: !canRemove, onClick: removeRoomOnClick }))));
+    const toggleButton = (react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__collapse'] },
+        react_1.default.createElement(BEButton_1.default, { isText: true, icon: collapsed ? Icon_1.IconType.ArrowDown3 : Icon_1.IconType.ArrowUp3, iconPosition: "right", stopIconAnimation: true, onClick: () => {
+                setCollapsed((prev) => !prev);
+            } })));
     const bookingWizardContext = {
         layout: 'booking-summary',
         theme: BookingWizard_1.EBookingWizardTheme.Default,
@@ -191,25 +197,13 @@ const UserSearchSummaryRow = ({ row, index }) => {
                                 react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-card-date-range--item'] },
                                     react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-card-label'] }, t(Translation_1.Translation.Misc.CheckOut)),
                                     react_1.default.createElement(Text_1.default, { color: shouldTextBeWhite ? Color_1.Color.White : Color_1.Color.Accent, bold: true, className: "u-nowrap" }, row.getDepartureDate()))))))),
-            react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__divider'] }),
-            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.Guests)),
-                        react_1.default.createElement(BookingWizardContext_1.BookingWizardContext.Provider, { value: bookingWizardContext },
-                            react_1.default.createElement(BookingWizardGuestSelector_1.BookingWizardGuestSelector, { defaultValue: {
-                                    adults: row.getAdults(),
-                                    children: row.getChildren(),
-                                    infants: row.getInfants(),
-                                }, onChange: setGuest, onEditingChange: setGuests, disableChild: !showChildren, showInfants: ((_b = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _b === void 0 ? void 0 : _b.supportInfants) === true, maxAdults: maxAdults, maxChildren: maxChildren, maxInfants: maxInfants, disableRoom: true, ageRange: {
-                                    child: (_c = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _c === void 0 ? void 0 : _c.childRange,
-                                    infant: (_d = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _d === void 0 ? void 0 : _d.infantRange,
-                                } }))))),
-            react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row__divider'] }),
-            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(UserSearchSummaryPromocodeInput_1.UserSearchSummaryPromocodeInput, { row: row, onChange: changePromoCode, disabled: !isSelectedRow, promocodeTextColor: textColor, useUpdatedDesign: true })))),
-        react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row--buttons'] }, isSelectedRow && isValid ? (react_1.default.createElement(BEButton_1.default, { isText: true, size: "tiny", onClick: onClickCancelRoomChanges, textColor: textColor }, t(Translation_1.Translation.Misc.Cancel))) : (removeButton))));
+            isMobile ? (react_1.default.createElement("div", { className: "w-100" },
+                react_1.default.createElement(AutoAutoHeight_1.default, { open: !collapsed },
+                    react_1.default.createElement("div", { className: "w-100 u-flex flex-column" },
+                        react_1.default.createElement(UserSearchSummaryForm_1.UserSearchSummaryForm, { row: row, hotel: hotel, isSelectedRow: isSelectedRow, bookingWizardContext: bookingWizardContext, maxAdults: maxAdults, maxChildren: maxChildren, maxInfants: maxInfants, showChildren: showChildren, setGuest: setGuest, setGuests: setGuests, changePromoCode: changePromoCode, textColor: textColor }))))) : (react_1.default.createElement(UserSearchSummaryForm_1.UserSearchSummaryForm, { row: row, hotel: hotel, isSelectedRow: isSelectedRow, bookingWizardContext: bookingWizardContext, maxAdults: maxAdults, maxChildren: maxChildren, maxInfants: maxInfants, showChildren: showChildren, setGuest: setGuest, setGuests: setGuests, changePromoCode: changePromoCode, textColor: textColor }))),
+        react_1.default.createElement("div", { className: UserSearchSummaryRow_module_scss_1.default['user-search-summary-row--buttons'] }, isSelectedRow && isValid ? (react_1.default.createElement(BEButton_1.default, { isText: true, size: "tiny", onClick: onClickCancelRoomChanges, textColor: textColor }, t(Translation_1.Translation.Misc.Cancel))) : (react_1.default.createElement("div", null,
+            !!isMobile && toggleButton,
+            removeButton)))));
 };
 exports.UserSearchSummaryRow = UserSearchSummaryRow;
 //# sourceMappingURL=UserSearchSummaryRow.js.map

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 { 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"]}
+{"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 AutoAutoHeight from '@/animations/AutoAutoHeight';\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 { useWindowSize } from '@/hooks/WindowSize';\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 { BookingWizardContextType, BookingWizardOnBooking } from '../../../generic/BookingWizard/BookingWizardContext';\nimport { UserSearchSummaryForm } from './UserSearchSummaryForm';\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    const { isMobile } = useWindowSize();\n\n    const [collapsed, setCollapsed] = useState<boolean>(true);\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: number;\n        children: number;\n        infants: number;\n    }>({\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 toggleButton = (\n        <div className={styles['user-search-summary-row__collapse']}>\n            <BEButton\n                isText\n                icon={collapsed ? IconType.ArrowDown3 : IconType.ArrowUp3}\n                iconPosition=\"right\"\n                stopIconAnimation\n                onClick={() => {\n                    setCollapsed((prev) => !prev);\n                }}\n            />\n        </div>\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                {isMobile ? (\n                    <div className=\"w-100\">\n                        <AutoAutoHeight open={!collapsed}>\n                            <div className=\"w-100 u-flex flex-column\">\n                                <UserSearchSummaryForm\n                                    row={row}\n                                    hotel={hotel}\n                                    isSelectedRow={isSelectedRow}\n                                    bookingWizardContext={bookingWizardContext}\n                                    maxAdults={maxAdults}\n                                    maxChildren={maxChildren}\n                                    maxInfants={maxInfants}\n                                    showChildren={showChildren}\n                                    setGuest={setGuest}\n                                    setGuests={setGuests}\n                                    changePromoCode={changePromoCode}\n                                    textColor={textColor}\n                                />\n                            </div>\n                        </AutoAutoHeight>\n                    </div>\n                ) : (\n                    <UserSearchSummaryForm\n                        row={row}\n                        hotel={hotel}\n                        isSelectedRow={isSelectedRow}\n                        bookingWizardContext={bookingWizardContext}\n                        maxAdults={maxAdults}\n                        maxChildren={maxChildren}\n                        maxInfants={maxInfants}\n                        showChildren={showChildren}\n                        setGuest={setGuest}\n                        setGuests={setGuests}\n                        changePromoCode={changePromoCode}\n                        textColor={textColor}\n                    />\n                )}\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                    <div>\n                        {!!isMobile && toggleButton}\n                        {removeButton}\n                    </div>\n                )}\n            </div>\n        </div>\n    );\n};\n"]}

package/dist/src/components/steps/room/roomBuilderProgress/NumberOfAdultsPicker.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import BasketRow from '../../../../models/BasketRow';
 import { Color } from '../../../../util/Color';
 interface NumberOfAdultsPickerProps {
@@ -5,5 +6,5 @@ interface NumberOfAdultsPickerProps {
     onChange: (value: string) => void;
     labelColor?: Color;
 }
-export default function NumberOfAdultsPicker(props: NumberOfAdultsPickerProps): JSX.Element;
+export default function NumberOfAdultsPicker(props: NumberOfAdultsPickerProps): React.JSX.Element;
 export {};

package/dist/src/components/steps/room/roomBuilderProgress/NumberOfChildrenPicker.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import BasketRow from '../../../../models/BasketRow';
 import { Color } from '../../../../util/Color';
 interface NumberOfChildrenPickerProps {
@@ -5,5 +6,5 @@ interface NumberOfChildrenPickerProps {
     onChange: (value: string) => void;
     labelColor?: Color;
 }
-export default function NumberOfChildrenPicker(props: NumberOfChildrenPickerProps): JSX.Element;
+export default function NumberOfChildrenPicker(props: NumberOfChildrenPickerProps): React.JSX.Element;
 export {};

package/dist/src/components/steps/room/roomBuilderProgress/NumberOfInfantsPicker.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import BasketRow from '../../../../models/BasketRow';
 import { Color } from '../../../../util/Color';
 interface NumberOfInfantsPickerProps {
@@ -5,5 +6,5 @@ interface NumberOfInfantsPickerProps {
     onChange: (value: string) => void;
     labelColor?: Color;
 }
-export default function NumberOfInfantsPicker(props: NumberOfInfantsPickerProps): JSX.Element;
+export default function NumberOfInfantsPicker(props: NumberOfInfantsPickerProps): React.JSX.Element;
 export {};

package/dist/src/components/steps/room/roomBuilderProgress/RoomBuilderProgress.d.ts

@@ -1 +1,2 @@
-export default function RoomBuilderProgress(): JSX.Element;
+import React from 'react';
+export default function RoomBuilderProgress(): React.JSX.Element;

package/dist/src/components/steps/room/roomBuilderProgress/RoomBuilderProgressRow.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 import BasketRow from '../../../../models/BasketRow';
 export interface RoomBuilderProgressRowProps {
     row: BasketRow;
     number?: number;
 }
-export default function RoomBuilderProgressRow(props: RoomBuilderProgressRowProps): JSX.Element;
+export default function RoomBuilderProgressRow(props: RoomBuilderProgressRowProps): React.JSX.Element;