@roomstay/frontend 2.3.42 → 2.4.0

package/dist/src/api/ReservationAPI.d.ts

@@ -10,7 +10,8 @@ export declare enum EPaymentMethod {
 }
 export default class ReservationAPI extends BaseAPI {
     private storedReservations;
-    bookNow: (basketRows: BasketRow[], userProfiles: UserProfile[], payment: IBookingPayment, addonRows: BasketAddonRow[], comments: string, hotelId: string, specialReq?: string | undefined) => Promise<ReservationsDTO>;
+    getPriceQuote: (hotelId: string, rows: BasketRow[]) => Promise<any>;
+    bookNow: (basketRows: BasketRow[], userProfiles: UserProfile[], payment: IBookingPayment, addonRows: BasketAddonRow[], comments: string, hotelId: string, sessionId: string, specialReq?: string | undefined) => Promise<ReservationsDTO>;
     commit: (reservations: string[], itineraryId: string, hotelId: string, planpayCheckoutId?: string) => Promise<ReservationsDTO>;
     rollback: (reservations: string[], itineraryId: string, hotelId: string) => Promise<boolean>;
     cancelReservation: (id: string, email: string, hotelId: string) => Promise<boolean>;

package/dist/src/api/ReservationAPI.js

@@ -43,10 +43,28 @@ class ReservationAPI extends BaseAPI_1.default {
     constructor() {
         super(...arguments);
         this.storedReservations = {};
-        this.bookNow = (basketRows, userProfiles, payment, addonRows, comments, hotelId, specialReq = undefined) => __awaiter(this, void 0, void 0, function* () {
+        this.getPriceQuote = (hotelId, rows) => __awaiter(this, void 0, void 0, function* () {
+            const quoteBody = {
+                rows: rows.map((row) => {
+                    var _a;
+                    return {
+                        rowId: row.getID(),
+                        roomCode: row.getRoom().code,
+                        rateCode: (_a = row.getRate()) === null || _a === void 0 ? void 0 : _a.code,
+                        promoCode: row.getPromoCode(),
+                        adults: row.getAdults(),
+                        children: row.getChildren(),
+                        checkIn: row.getStartDate().format('YYYY-MM-DD'),
+                        checkOut: row.getEndDate().format('YYYY-MM-DD'),
+                    };
+                }),
+            };
+            return this.post(BaseAPI_1.APIEndpoint.Reservations, quoteBody, hotelId, {}, 'quote');
+        });
+        this.bookNow = (basketRows, userProfiles, payment, addonRows, comments, hotelId, sessionId, specialReq = undefined) => __awaiter(this, void 0, void 0, function* () {
             const rooms = [];
             basketRows.forEach((row) => {
-                var _a;
+                var _a, _b;
                 const room = {
                     RoomType: row.getRoom().code,
                     RatePlan: (_a = row.getRate()) === null || _a === void 0 ? void 0 : _a.code,
@@ -55,6 +73,8 @@ class ReservationAPI extends BaseAPI_1.default {
                     Children: row.getChildren(),
                     CheckInDate: row.getStartDate().format('YYYY-MM-DD'),
                     CheckOutDate: row.getEndDate().format('YYYY-MM-DD'),
+                    QuoteId: (_b = row.quoteDetails) === null || _b === void 0 ? void 0 : _b.quoteId,
+                    RowId: row.getID(),
                 };
                 rooms.push(room);
             });
@@ -92,6 +112,8 @@ class ReservationAPI extends BaseAPI_1.default {
                 Comments: comments,
                 Profiles: userProfiles,
                 Payment: payment,
+                SessionId: sessionId,
+                SourceUrl: window.location.href,
             }, hotelId);
         });
         this.commit = (reservations, itineraryId, hotelId, planpayCheckoutId) => __awaiter(this, void 0, void 0, function* () {

package/dist/src/api/ReservationAPI.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReservationAPI.js","sourceRoot":"/","sources":["src/api/ReservationAPI.ts"],"names":[],"mappings":"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","sourcesContent":["import { IBookingPayment } from '@roomstay/core';\n\nimport BaseAPI, { APIEndpoint } from '@/api/BaseAPI';\nimport ReservationsDTO, { ReservationDTO } from '@/models/Api/ReservationsDTO';\nimport BasketAddonRow from '@/models/BasketAddonRow';\nimport BasketRow from '@/models/BasketRow';\nimport UserProfile from '@/models/UserProfile';\n\nexport enum EPaymentMethod {\n    PLANPAY = 'Planpay',\n    CARD = 'Card',\n}\n\nexport default class ReservationAPI extends BaseAPI {\n    private storedReservations: { [ref: string]: any } = {};\n\n    public bookNow = async (\n        basketRows: BasketRow[],\n        userProfiles: UserProfile[],\n        payment: IBookingPayment,\n        addonRows: BasketAddonRow[],\n        comments: string,\n        hotelId: string,\n        specialReq: string | undefined = undefined\n    ): Promise<ReservationsDTO> => {\n        const rooms: any[] = [];\n\n        basketRows.forEach((row) => {\n            const room = {\n                RoomType: row.getRoom().code,\n                RatePlan: row.getRate()?.code,\n                PromoCode: row.getPromoCode(),\n                Adults: row.getAdults(),\n                Children: row.getChildren(),\n                CheckInDate: row.getStartDate().format('YYYY-MM-DD'),\n                CheckOutDate: row.getEndDate().format('YYYY-MM-DD'),\n            };\n\n            rooms.push(room);\n        });\n\n        const addons = addonRows.map((row) => {\n            const addon = row.getAddon();\n            const priceInfo = addon.availability[row.getSelectedDate()];\n\n            const response: any = {\n                Code: addon.code,\n                StartDate: row.getSelectedDate(),\n            };\n            if (addon?.ratePlanCode) {\n                response.RatePlanCode = row.getAddon().ratePlanCode;\n            }\n            if (row.getSelectedTime()) {\n                response.StartTime = row.getSelectedTime();\n            }\n\n            if (priceInfo.price) {\n                response.Quantity = row.getQuantity();\n            }\n            if (priceInfo.adultPrice) {\n                response.Adults = row.getAdultQuantity();\n            }\n            if (priceInfo.childPrice) {\n                response.Children = row.getChildQuantity();\n            }\n\n            if (addon.pricingType) {\n                response.PricingType = addon.pricingType;\n            }\n\n            return response;\n        });\n\n        return this.post(\n            APIEndpoint.Reservations,\n            {\n                Rooms: rooms,\n                Services: addons,\n                SpecialRequest: specialReq,\n                Comments: comments,\n                Profiles: userProfiles,\n                Payment: payment,\n            },\n            hotelId\n        );\n    };\n\n    public commit = async (reservations: string[], itineraryId: string, hotelId: string, planpayCheckoutId?: string): Promise<ReservationsDTO> => {\n        return this.post(\n            APIEndpoint.Reservations,\n            {\n                itineraryId: itineraryId,\n                reservationIds: reservations,\n                planpayCheckoutId,\n            },\n            hotelId,\n            {},\n            'commit'\n        );\n    };\n\n    public rollback = async (reservations: string[], itineraryId: string, hotelId: string): Promise<boolean> => {\n        await this.post(\n            APIEndpoint.Reservations,\n            {\n                itineraryId: itineraryId,\n                reservationIds: reservations,\n            },\n            hotelId,\n            {},\n            'rollback'\n        );\n\n        return true;\n    };\n\n    public cancelReservation = (id: string, email: string, hotelId: string): Promise<boolean> =>\n        new Promise(async (resolve, reject) => {\n            try {\n                const response = await this.delete(APIEndpoint.Reservations, {}, hotelId, { email: encodeURIComponent(email) }, id);\n\n                this.storedReservations[id]?.reservations?.forEach((reservation: ReservationDTO) => {\n                    if (reservation.reservationNumber === id) {\n                        reservation.status = 'Cancelled';\n                    }\n                });\n\n                resolve(response);\n            } catch (ex) {\n                reject(ex);\n            }\n        });\n\n    public findReservation = (id: string, email: string, hotelId: string): Promise<ReservationsDTO> =>\n        new Promise(async (resolve, reject) => {\n            /*\n      resolve with locally cached data, so we don't have to re-query this again\n  */\n            if (this.storedReservations[id]) {\n                return resolve(this.storedReservations[id]);\n            }\n\n            try {\n                const response = await this.get(APIEndpoint.Reservations, { email: encodeURIComponent(email) }, id, hotelId);\n\n                this.storedReservations[id] = response;\n\n                resolve(response);\n            } catch (ex) {\n                reject(ex);\n            }\n        });\n}\n"]}
+{"version":3,"file":"ReservationAPI.js","sourceRoot":"/","sources":["src/api/ReservationAPI.ts"],"names":[],"mappings":"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","sourcesContent":["import { IBookingPayment, IBookingQuoteRequest } from '@roomstay/core';\n\nimport BaseAPI, { APIEndpoint } from '@/api/BaseAPI';\nimport ReservationsDTO, { ReservationDTO } from '@/models/Api/ReservationsDTO';\nimport BasketAddonRow from '@/models/BasketAddonRow';\nimport BasketRow from '@/models/BasketRow';\nimport UserProfile from '@/models/UserProfile';\n\nexport enum EPaymentMethod {\n    PLANPAY = 'Planpay',\n    CARD = 'Card',\n}\n\nexport default class ReservationAPI extends BaseAPI {\n    private storedReservations: { [ref: string]: any } = {};\n\n    public getPriceQuote = async (hotelId: string, rows: BasketRow[]) => {\n        const quoteBody: IBookingQuoteRequest = {\n            rows: rows.map((row) => {\n                return {\n                    rowId: row.getID(),\n\n                    roomCode: row.getRoom().code as string,\n                    rateCode: row.getRate()?.code as string,\n\n                    promoCode: row.getPromoCode(),\n\n                    adults: row.getAdults(),\n                    children: row.getChildren(),\n\n                    checkIn: row.getStartDate().format('YYYY-MM-DD'),\n                    checkOut: row.getEndDate().format('YYYY-MM-DD'),\n                };\n            }),\n        };\n\n        return this.post(APIEndpoint.Reservations, quoteBody, hotelId, {}, 'quote');\n    };\n\n    public bookNow = async (\n        basketRows: BasketRow[],\n        userProfiles: UserProfile[],\n        payment: IBookingPayment,\n        addonRows: BasketAddonRow[],\n        comments: string,\n        hotelId: string,\n        sessionId: string,\n        specialReq: string | undefined = undefined\n    ): Promise<ReservationsDTO> => {\n        const rooms: any[] = [];\n\n        basketRows.forEach((row) => {\n            const room = {\n                RoomType: row.getRoom().code,\n                RatePlan: row.getRate()?.code,\n                PromoCode: row.getPromoCode(),\n                Adults: row.getAdults(),\n                Children: row.getChildren(),\n                CheckInDate: row.getStartDate().format('YYYY-MM-DD'),\n                CheckOutDate: row.getEndDate().format('YYYY-MM-DD'),\n\n                QuoteId: row.quoteDetails?.quoteId,\n                RowId: row.getID(),\n            };\n\n            rooms.push(room);\n        });\n\n        const addons = addonRows.map((row) => {\n            const addon = row.getAddon();\n            const priceInfo = addon.availability[row.getSelectedDate()];\n\n            const response: any = {\n                Code: addon.code,\n                StartDate: row.getSelectedDate(),\n            };\n            if (addon?.ratePlanCode) {\n                response.RatePlanCode = row.getAddon().ratePlanCode;\n            }\n            if (row.getSelectedTime()) {\n                response.StartTime = row.getSelectedTime();\n            }\n\n            if (priceInfo.price) {\n                response.Quantity = row.getQuantity();\n            }\n            if (priceInfo.adultPrice) {\n                response.Adults = row.getAdultQuantity();\n            }\n            if (priceInfo.childPrice) {\n                response.Children = row.getChildQuantity();\n            }\n\n            if (addon.pricingType) {\n                response.PricingType = addon.pricingType;\n            }\n\n            return response;\n        });\n\n        return this.post(\n            APIEndpoint.Reservations,\n            {\n                Rooms: rooms,\n                Services: addons,\n                SpecialRequest: specialReq,\n                Comments: comments,\n                Profiles: userProfiles,\n                Payment: payment,\n                SessionId: sessionId,\n                SourceUrl: window.location.href,\n            },\n            hotelId\n        );\n    };\n\n    public commit = async (reservations: string[], itineraryId: string, hotelId: string, planpayCheckoutId?: string): Promise<ReservationsDTO> => {\n        return this.post(\n            APIEndpoint.Reservations,\n            {\n                itineraryId: itineraryId,\n                reservationIds: reservations,\n                planpayCheckoutId,\n            },\n            hotelId,\n            {},\n            'commit'\n        );\n    };\n\n    public rollback = async (reservations: string[], itineraryId: string, hotelId: string): Promise<boolean> => {\n        await this.post(\n            APIEndpoint.Reservations,\n            {\n                itineraryId: itineraryId,\n                reservationIds: reservations,\n            },\n            hotelId,\n            {},\n            'rollback'\n        );\n\n        return true;\n    };\n\n    public cancelReservation = (id: string, email: string, hotelId: string): Promise<boolean> =>\n        new Promise(async (resolve, reject) => {\n            try {\n                const response = await this.delete(APIEndpoint.Reservations, {}, hotelId, { email: encodeURIComponent(email) }, id);\n\n                this.storedReservations[id]?.reservations?.forEach((reservation: ReservationDTO) => {\n                    if (reservation.reservationNumber === id) {\n                        reservation.status = 'Cancelled';\n                    }\n                });\n\n                resolve(response);\n            } catch (ex) {\n                reject(ex);\n            }\n        });\n\n    public findReservation = (id: string, email: string, hotelId: string): Promise<ReservationsDTO> =>\n        new Promise(async (resolve, reject) => {\n            /*\n      resolve with locally cached data, so we don't have to re-query this again\n  */\n            if (this.storedReservations[id]) {\n                return resolve(this.storedReservations[id]);\n            }\n\n            try {\n                const response = await this.get(APIEndpoint.Reservations, { email: encodeURIComponent(email) }, id, hotelId);\n\n                this.storedReservations[id] = response;\n\n                resolve(response);\n            } catch (ex) {\n                reject(ex);\n            }\n        });\n}\n"]}

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

@@ -30,13 +30,13 @@ exports.EBookingWizardTheme = void 0;
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importStar(require("react"));
 const react_i18next_1 = require("react-i18next");
+const BEButton_1 = __importDefault(require("../BEButton"));
 const BookingWizardContent_1 = require("./BookingWizardContent");
 const BookingWizardContext_1 = require("./BookingWizardContext");
-const WindowSize_1 = require("../../../hooks/WindowSize");
-const Translation_1 = require("../../../translations/Translation");
-const BEButton_1 = __importDefault(require("../BEButton"));
 const Icon_1 = __importStar(require("../Icon/Icon"));
 const SimpleModal_1 = __importStar(require("../modal/SimpleModal"));
+const WindowSize_1 = require("../../../hooks/WindowSize");
+const Translation_1 = require("../../../translations/Translation");
 const BookingWizard_module_scss_1 = __importDefault(require("./BookingWizard.module.scss"));
 var EBookingWizardTheme;
 (function (EBookingWizardTheme) {

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, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\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 { useWindowSize } from '@/hooks/WindowSize';\nimport { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport { Translation } from '@/translations/Translation';\n\nimport BEButton from '../BEButton';\nimport Icon, { IconType } from '../Icon/Icon';\nimport SimpleModal, { SimpleModalSize } from '../modal/SimpleModal';\nimport styles from './BookingWizard.module.scss';\n\nexport enum EBookingWizardTheme {\n    Default = 'default',\n    Specific = 'specific',\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\nconst BookingWizard: React.FC<BookingWizardProps> = (props) => {\n    const {\n        layout = 'horizontal',\n        theme = EBookingWizardTheme.Default,\n        onSubmit,\n        wrapperClassname,\n        contentClassname,\n        selectedProperty,\n        properties,\n        defaultColors,\n        disableChild,\n        disableRoom,\n        defaultValues,\n    } = props;\n    const [isOpen, setIsOpen] = React.useState(false);\n\n    const { isMobile } = useWindowSize();\n    const { t } = useTranslation();\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    useEffect(() => {\n        if ((layout === 'horizontal' || layout === 'horizontal-condensed') && !isMobile) {\n            setOverlayOffset([0, 21]);\n            setDateSelectorOverlayOffset([0, 6]);\n            setCompOverlayType('popup');\n\n            if (layout === 'horizontal-condensed') {\n                setOverlayOffset([-8, 21]);\n            }\n        } else {\n            setOverlayOffset([0, 10]);\n            setDateSelectorOverlayOffset([0, -8]);\n            setCompOverlayType('bottom-sheet');\n        }\n    }, [layout, isMobile]);\n\n    useEffect(() => {\n        if (!isMobile) {\n            setOverlayPlacement('bottom-start');\n        } else {\n            setOverlayPlacement('bottom');\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        },\n        wrapperClassname\n    );\n\n    const bookingWizardContext: BookingWizardContextType = {\n        layout,\n        theme,\n        type: compOverlayType,\n        className: classes,\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                                    disableChild={disableChild}\n                                    disableRoom={disableRoom}\n                                    defaultValues={defaultValues}\n                                />\n                            </div>\n                        </BookingWizardContext.Provider>\n                    </div>\n                </SimpleModal>\n            </div>\n        );\n    }\n\n    return (\n        <div 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":"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","sourcesContent":["import { Placement } from '@popperjs/core';\nimport classNames from 'classnames';\nimport React, { useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\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';\n\nimport styles from './BookingWizard.module.scss';\n\nexport enum EBookingWizardTheme {\n    Default = 'default',\n    Specific = 'specific',\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\nconst BookingWizard: React.FC<BookingWizardProps> = (props) => {\n    const {\n        layout = 'horizontal',\n        theme = EBookingWizardTheme.Default,\n        onSubmit,\n        wrapperClassname,\n        contentClassname,\n        selectedProperty,\n        properties,\n        defaultColors,\n        disableChild,\n        disableRoom,\n        defaultValues,\n    } = props;\n    const [isOpen, setIsOpen] = React.useState(false);\n\n    const { isMobile } = useWindowSize();\n    const { t } = useTranslation();\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    useEffect(() => {\n        if ((layout === 'horizontal' || layout === 'horizontal-condensed') && !isMobile) {\n            setOverlayOffset([0, 21]);\n            setDateSelectorOverlayOffset([0, 6]);\n            setCompOverlayType('popup');\n\n            if (layout === 'horizontal-condensed') {\n                setOverlayOffset([-8, 21]);\n            }\n        } else {\n            setOverlayOffset([0, 10]);\n            setDateSelectorOverlayOffset([0, -8]);\n            setCompOverlayType('bottom-sheet');\n        }\n    }, [layout, isMobile]);\n\n    useEffect(() => {\n        if (!isMobile) {\n            setOverlayPlacement('bottom-start');\n        } else {\n            setOverlayPlacement('bottom');\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        },\n        wrapperClassname\n    );\n\n    const bookingWizardContext: BookingWizardContextType = {\n        layout,\n        theme,\n        type: compOverlayType,\n        className: classes,\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                                    disableChild={disableChild}\n                                    disableRoom={disableRoom}\n                                    defaultValues={defaultValues}\n                                />\n                            </div>\n                        </BookingWizardContext.Provider>\n                    </div>\n                </SimpleModal>\n            </div>\n        );\n    }\n\n    return (\n        <div 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/PaymentCard/InlinePaymentOption.d.ts

@@ -3,6 +3,7 @@ import { FC } from 'react';
 interface InlinePaymentOptionProps {
     card?: IRoomstayMemberCards;
     active?: boolean;
+    overrideSubLabel?: string;
 }
 declare const InlinePaymentOption: FC<InlinePaymentOptionProps>;
 export default InlinePaymentOption;

package/dist/src/components/generic/PaymentCard/InlinePaymentOption.js

@@ -38,7 +38,7 @@ const Translation_1 = require("../../../translations/Translation");
 const Color_1 = require("../../../util/Color");
 const TextAlignment_1 = require("../../../util/TextAlignment");
 const InlinePaymentOption_module_scss_1 = __importDefault(require("./InlinePaymentOption.module.scss"));
-const InlinePaymentOption = ({ card, active }) => {
+const InlinePaymentOption = ({ card, active, overrideSubLabel }) => {
     const { t } = (0, react_i18next_1.useTranslation)();
     const { roomstayMember } = (0, contexts_1.useMemberContext)();
     const displayExpiry = (expiry) => {
@@ -49,13 +49,14 @@ const InlinePaymentOption = ({ card, active }) => {
     const { symbol, prettyValue } = (0, Currency_1.default)({
         children: price,
     });
+    const subLabel = overrideSubLabel ? overrideSubLabel : card ? `Expires ${displayExpiry(card.expiry)}` : t(Translation_1.Translation.Step.Confirmation.CardSubLabel);
     return (react_1.default.createElement("div", { className: "u-flex u-flex-justify-between w-100 u-flex-align-center" },
         react_1.default.createElement("div", { className: InlinePaymentOption_module_scss_1.default.root },
             card ? (react_1.default.createElement("div", { className: "flex-shrink-0" },
                 react_1.default.createElement(InlinePaymentCard_1.default, { vgsCardName: card.type, large: true }))) : null,
             react_1.default.createElement("div", null,
                 react_1.default.createElement(Text_1.default, { align: TextAlignment_1.TextAlign.Left, type: Text_1.TextType.Small, color: Color_1.Color.Navy }, card ? `**** **** **** ${card.cardNumber.slice(-4)}` : t(Translation_1.Translation.Step.Confirmation.CardLabel)),
-                react_1.default.createElement(Text_1.default, { className: "u-marg-top--lighter", align: TextAlignment_1.TextAlign.Left, type: Text_1.TextType.Caption, color: Color_1.Color.DarkGrey }, card ? `Expires ${displayExpiry(card.expiry)}` : t(Translation_1.Translation.Step.Confirmation.CardSubLabel))),
+                react_1.default.createElement(Text_1.default, { className: "u-marg-top--lighter", align: TextAlignment_1.TextAlign.Left, type: Text_1.TextType.Caption, color: Color_1.Color.DarkGrey }, subLabel)),
             !card && (react_1.default.createElement("div", null,
                 react_1.default.createElement(AcceptablePaymentCard_1.default, { style: {
                         width: 24,

package/dist/src/components/generic/PaymentCard/InlinePaymentOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlinePaymentOption.js","sourceRoot":"/","sources":["src/components/generic/PaymentCard/InlinePaymentOption.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IRoomstayMemberCards } from '@roomstay/core';\nimport React, { FC } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport InlinePaymentCard from '@/components/generic/PaymentCard/InlinePaymentCard';\nimport Pill, { PillType } from '@/components/generic/Pill';\nimport Text, { TextType } from '@/components/generic/Text';\nimport AcceptablePaymentCard from '@/components/steps/confirmation/PaymentDetails/AcceptablePaymentCard';\nimport { useBasket, useMemberContext } from '@/contexts';\nimport useCurrency from '@/hooks/Currency';\nimport { VGSCardName } from '@/models/Api/HotelDTO';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\nimport { TextAlign } from '@/util/TextAlignment';\n\nimport styles from './InlinePaymentOption.module.scss';\n\ninterface InlinePaymentOptionProps {\n    card?: IRoomstayMemberCards;\n    active?: boolean;\n}\n\nconst InlinePaymentOption: FC<InlinePaymentOptionProps> = ({ card, active }) => {\n    const { t } = useTranslation();\n    const { roomstayMember } = useMemberContext();\n    const displayExpiry = (expiry: string) => {\n        return expiry.slice(0, 2) + ' / ' + expiry.slice(2);\n    };\n    const { getTotalPrice } = useBasket();\n    const price = getTotalPrice();\n    const { symbol, prettyValue } = useCurrency({\n        children: price,\n    });\n    return (\n        <div className=\"u-flex u-flex-justify-between w-100 u-flex-align-center\">\n            <div className={styles.root}>\n                {card ? (\n                    <div className=\"flex-shrink-0\">\n                        <InlinePaymentCard vgsCardName={card.type as VGSCardName} large />\n                    </div>\n                ) : null}\n                <div>\n                    <Text align={TextAlign.Left} type={TextType.Small} color={Color.Navy}>\n                        {card ? `**** **** **** ${card.cardNumber.slice(-4)}` : t(Translation.Step.Confirmation.CardLabel)}\n                    </Text>\n                    <Text className=\"u-marg-top--lighter\" align={TextAlign.Left} type={TextType.Caption} color={Color.DarkGrey}>\n                        {card ? `Expires ${displayExpiry(card.expiry)}` : t(Translation.Step.Confirmation.CardSubLabel)}\n                    </Text>\n                </div>\n                {!card && (\n                    <div>\n                        <AcceptablePaymentCard\n                            style={{\n                                width: 24,\n                                height: 16,\n                                borderRadius: 1.5,\n                                border: '0.5px solid #DFE1E5',\n                            }}\n                            isCurrent={() => true}\n                        />\n                    </div>\n                )}\n                {roomstayMember?.defaultCard && card && card.cardId === roomstayMember.defaultCard && (\n                    <Pill size=\"small\" type={PillType.Primary}>\n                        DEFAULT CARD\n                    </Pill>\n                )}\n            </div>\n            <Text bold className=\"u-flex\" color={Color.Navy} type={TextType.Small}>\n                {symbol}\n                {prettyValue}\n            </Text>\n        </div>\n    );\n};\n\nexport default InlinePaymentOption;\n"]}
+{"version":3,"file":"InlinePaymentOption.js","sourceRoot":"/","sources":["src/components/generic/PaymentCard/InlinePaymentOption.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IRoomstayMemberCards } from '@roomstay/core';\nimport React, { FC } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport InlinePaymentCard from '@/components/generic/PaymentCard/InlinePaymentCard';\nimport Pill, { PillType } from '@/components/generic/Pill';\nimport Text, { TextType } from '@/components/generic/Text';\nimport AcceptablePaymentCard from '@/components/steps/confirmation/PaymentDetails/AcceptablePaymentCard';\nimport { useBasket, useMemberContext } from '@/contexts';\nimport useCurrency from '@/hooks/Currency';\nimport { VGSCardName } from '@/models/Api/HotelDTO';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\nimport { TextAlign } from '@/util/TextAlignment';\n\nimport styles from './InlinePaymentOption.module.scss';\n\ninterface InlinePaymentOptionProps {\n    card?: IRoomstayMemberCards;\n    active?: boolean;\n\n    overrideSubLabel?: string;\n}\n\nconst InlinePaymentOption: FC<InlinePaymentOptionProps> = ({ card, active, overrideSubLabel }) => {\n    const { t } = useTranslation();\n    const { roomstayMember } = useMemberContext();\n    const displayExpiry = (expiry: string) => {\n        return expiry.slice(0, 2) + ' / ' + expiry.slice(2);\n    };\n    const { getTotalPrice } = useBasket();\n    const price = getTotalPrice();\n    const { symbol, prettyValue } = useCurrency({\n        children: price,\n    });\n\n    const subLabel = overrideSubLabel ? overrideSubLabel : card ? `Expires ${displayExpiry(card.expiry)}` : t(Translation.Step.Confirmation.CardSubLabel);\n\n    return (\n        <div className=\"u-flex u-flex-justify-between w-100 u-flex-align-center\">\n            <div className={styles.root}>\n                {card ? (\n                    <div className=\"flex-shrink-0\">\n                        <InlinePaymentCard vgsCardName={card.type as VGSCardName} large />\n                    </div>\n                ) : null}\n                <div>\n                    <Text align={TextAlign.Left} type={TextType.Small} color={Color.Navy}>\n                        {card ? `**** **** **** ${card.cardNumber.slice(-4)}` : t(Translation.Step.Confirmation.CardLabel)}\n                    </Text>\n\n                    <Text className=\"u-marg-top--lighter\" align={TextAlign.Left} type={TextType.Caption} color={Color.DarkGrey}>\n                        {subLabel}\n                    </Text>\n                </div>\n                {!card && (\n                    <div>\n                        <AcceptablePaymentCard\n                            style={{\n                                width: 24,\n                                height: 16,\n                                borderRadius: 1.5,\n                                border: '0.5px solid #DFE1E5',\n                            }}\n                            isCurrent={() => true}\n                        />\n                    </div>\n                )}\n                {roomstayMember?.defaultCard && card && card.cardId === roomstayMember.defaultCard && (\n                    <Pill size=\"small\" type={PillType.Primary}>\n                        DEFAULT CARD\n                    </Pill>\n                )}\n            </div>\n            <Text bold className=\"u-flex\" color={Color.Navy} type={TextType.Small}>\n                {symbol}\n                {prettyValue}\n            </Text>\n        </div>\n    );\n};\n\nexport default InlinePaymentOption;\n"]}

package/dist/src/components/generic/Select/InputSelect.js

@@ -51,7 +51,7 @@ function InputSelect({ value, onChange, options, keyName, labelName, label, plac
         react_1.default.createElement(Select_1.Select, { keyName: keyName, labelName: labelName, options: options, target: container, onClose: onDropdownClosed, onChange: (value) => {
                 onItemSelected();
                 onChange === null || onChange === void 0 ? void 0 : onChange(value);
-            }, open: isDropdownOpen })));
+            }, value: value, open: isDropdownOpen })));
 }
 exports.default = InputSelect;
 //# sourceMappingURL=InputSelect.js.map

package/dist/src/components/generic/Select/InputSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputSelect.js","sourceRoot":"/","sources":["src/components/generic/Select/InputSelect.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA8D;AAE9D,+DAAiF;AACjF,2EAAqE;AACrE,iEAAiE;AAEjE,uCAAwC;AACxC,wFAA+C;AAO/C,SAAwB,WAAW,CAA0D,EACzF,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,EACP,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,EACR,gBAAgB,GACkB;;IAClC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAwB,IAAI,CAAC,CAAC;IACxE,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IAEhD,MAAM,SAAS,GAAG,CAAC,GAAsB,EAAuB,EAAE;QAC9D,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,MAAM,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,EAAE,cAAc,EAAE,GAAG,IAAA,wCAAoB,EAAC;QAChG,GAAG,EAAE,QAAQ,CAAC,OAAO;KACxB,CAAC,CAAC;IAEH,OAAO,CACH;QACI,8BAAC,iBAAO,IACJ,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE;gBACR,OAAO,EAAE,gBAAgB;gBACzB,YAAY,EAAE,KAAK;aACtB,EACD,KAAK,EAAE,CAAA,MAAA,SAAS,CAAC,KAAK,CAAC,0CAAG,SAAS,CAAC,KAAI,EAAE,EAC1C,GAAG,EAAE,QAAQ,EACb,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,iCAAM,CAAC,YAAY,CAAC,EAC/B,IAAI,EAAE,eAAQ,CAAC,UAAU,EACzB,YAAY,EAAC,OAAO,GACtB;QACF,uCAAK,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAI;QACtE,8BAAC,eAAM,IACH,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,gBAAgB,EACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;gBAChB,cAAc,EAAE,CAAC;gBACjB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;YACtB,CAAC,EACD,IAAI,EAAE,cAAc,GACtB,CACH,CACN,CAAC;AACN,CAAC;AAtDD,8BAsDC","sourcesContent":["import React, { ReactElement, useRef, useState } from 'react';\n\nimport { Option, Select, SelectProps } from '@/components/generic/Select/Select';\nimport TextBox, { TextBoxProps } from '@/components/generic/TextBox';\nimport { useAutoFocusOnSelect } from '@/hooks/AutoFocusOnSelect';\n\nimport { IconType } from '../Icon/Icon';\nimport styles from './InputSelect.module.scss';\n\ntype IInputSelectProps<TOption extends Option<KeyName>, KeyName extends string> = Pick<SelectProps<TOption, KeyName>, 'value' | 'onChange' | 'keyName' | 'labelName'> &\n    Pick<TextBoxProps, 'label' | 'placeholder' | 'required' | 'validationStatus'> & {\n        options: TOption[];\n    };\n\nexport default function InputSelect<TOption extends Option<KeyName>, KeyName extends string>({\n    value,\n    onChange,\n    options,\n    keyName,\n    labelName,\n    label,\n    placeholder,\n    required,\n    validationStatus,\n}: IInputSelectProps<TOption, KeyName>): ReactElement | null {\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n    const innerRef = useRef<HTMLInputElement>(null);\n\n    const getOption = (key?: TOption[KeyName]): TOption | undefined => {\n        return options.find((option) => option[keyName] === key);\n    };\n\n    const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen } = useAutoFocusOnSelect({\n        ref: innerRef.current,\n    });\n\n    return (\n        <>\n            <TextBox\n                label={label}\n                inputProps={{\n                    onClick: onTriggerClicked,\n                    autoComplete: 'off',\n                }}\n                value={getOption(value)?.[labelName] || ''}\n                ref={innerRef}\n                placeholder={placeholder}\n                required={required}\n                validationStatus={validationStatus}\n                className={styles['text-input']}\n                icon={IconType.ArrowDown2}\n                iconPosition=\"right\"\n            />\n            <div ref={setContainer} style={{ width: '100%', display: 'block' }} />\n            <Select<TOption, KeyName>\n                keyName={keyName}\n                labelName={labelName}\n                options={options}\n                target={container}\n                onClose={onDropdownClosed}\n                onChange={(value) => {\n                    onItemSelected();\n                    onChange?.(value);\n                }}\n                open={isDropdownOpen}\n            />\n        </>\n    );\n}\n"]}
+{"version":3,"file":"InputSelect.js","sourceRoot":"/","sources":["src/components/generic/Select/InputSelect.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA8D;AAE9D,+DAAiF;AACjF,2EAAqE;AACrE,iEAAiE;AAEjE,uCAAwC;AACxC,wFAA+C;AAO/C,SAAwB,WAAW,CAA0D,EACzF,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,EACP,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,EACR,gBAAgB,GACkB;;IAClC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAwB,IAAI,CAAC,CAAC;IACxE,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IAEhD,MAAM,SAAS,GAAG,CAAC,GAAsB,EAAuB,EAAE;QAC9D,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,MAAM,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,EAAE,cAAc,EAAE,GAAG,IAAA,wCAAoB,EAAC;QAChG,GAAG,EAAE,QAAQ,CAAC,OAAO;KACxB,CAAC,CAAC;IAEH,OAAO,CACH;QACI,8BAAC,iBAAO,IACJ,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE;gBACR,OAAO,EAAE,gBAAgB;gBACzB,YAAY,EAAE,KAAK;aACtB,EACD,KAAK,EAAE,CAAA,MAAA,SAAS,CAAC,KAAK,CAAC,0CAAG,SAAS,CAAC,KAAI,EAAE,EAC1C,GAAG,EAAE,QAAQ,EACb,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,iCAAM,CAAC,YAAY,CAAC,EAC/B,IAAI,EAAE,eAAQ,CAAC,UAAU,EACzB,YAAY,EAAC,OAAO,GACtB;QACF,uCAAK,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAI;QACtE,8BAAC,eAAM,IACH,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,gBAAgB,EACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;gBAChB,cAAc,EAAE,CAAC;gBACjB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;YACtB,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,cAAc,GACtB,CACH,CACN,CAAC;AACN,CAAC;AAvDD,8BAuDC","sourcesContent":["import React, { ReactElement, useRef, useState } from 'react';\n\nimport { Option, Select, SelectProps } from '@/components/generic/Select/Select';\nimport TextBox, { TextBoxProps } from '@/components/generic/TextBox';\nimport { useAutoFocusOnSelect } from '@/hooks/AutoFocusOnSelect';\n\nimport { IconType } from '../Icon/Icon';\nimport styles from './InputSelect.module.scss';\n\ntype IInputSelectProps<TOption extends Option<KeyName>, KeyName extends string> = Pick<SelectProps<TOption, KeyName>, 'value' | 'onChange' | 'keyName' | 'labelName'> &\n    Pick<TextBoxProps, 'label' | 'placeholder' | 'required' | 'validationStatus'> & {\n        options: TOption[];\n    };\n\nexport default function InputSelect<TOption extends Option<KeyName>, KeyName extends string>({\n    value,\n    onChange,\n    options,\n    keyName,\n    labelName,\n    label,\n    placeholder,\n    required,\n    validationStatus,\n}: IInputSelectProps<TOption, KeyName>): ReactElement | null {\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n    const innerRef = useRef<HTMLInputElement>(null);\n\n    const getOption = (key?: TOption[KeyName]): TOption | undefined => {\n        return options.find((option) => option[keyName] === key);\n    };\n\n    const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen } = useAutoFocusOnSelect({\n        ref: innerRef.current,\n    });\n\n    return (\n        <>\n            <TextBox\n                label={label}\n                inputProps={{\n                    onClick: onTriggerClicked,\n                    autoComplete: 'off',\n                }}\n                value={getOption(value)?.[labelName] || ''}\n                ref={innerRef}\n                placeholder={placeholder}\n                required={required}\n                validationStatus={validationStatus}\n                className={styles['text-input']}\n                icon={IconType.ArrowDown2}\n                iconPosition=\"right\"\n            />\n            <div ref={setContainer} style={{ width: '100%', display: 'block' }} />\n            <Select<TOption, KeyName>\n                keyName={keyName}\n                labelName={labelName}\n                options={options}\n                target={container}\n                onClose={onDropdownClosed}\n                onChange={(value) => {\n                    onItemSelected();\n                    onChange?.(value);\n                }}\n                value={value}\n                open={isDropdownOpen}\n            />\n        </>\n    );\n}\n"]}

package/dist/src/components/generic/loader/OverlayLoader.d.ts

@@ -0,0 +1,6 @@
+type OverlayLoaderProps = {
+    label?: string;
+    isFullscreen?: boolean;
+};
+export declare const OverlayLoader: (props: OverlayLoaderProps) => JSX.Element;
+export {};

package/dist/src/components/generic/loader/OverlayLoader.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OverlayLoader = void 0;
+const classnames_1 = __importDefault(require("classnames"));
+const react_1 = __importDefault(require("react"));
+const OverlayLoader_module_scss_1 = __importDefault(require("./OverlayLoader.module.scss"));
+const OverlayLoader = (props) => {
+    return (react_1.default.createElement("div", { className: (0, classnames_1.default)(OverlayLoader_module_scss_1.default['overlay'], { [OverlayLoader_module_scss_1.default['--fixed']]: props.isFullscreen }) },
+        react_1.default.createElement("div", { className: OverlayLoader_module_scss_1.default['spinner'] }, ['top', 'bottom', 'left', 'move-blob'].map((item) => {
+            return react_1.default.createElement("div", { key: item, className: (0, classnames_1.default)(OverlayLoader_module_scss_1.default['blob'], OverlayLoader_module_scss_1.default[item]) });
+        })),
+        props.label && react_1.default.createElement("div", { className: OverlayLoader_module_scss_1.default['label'] }, props.label)));
+};
+exports.OverlayLoader = OverlayLoader;
+//# sourceMappingURL=OverlayLoader.js.map

package/dist/src/components/generic/loader/OverlayLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverlayLoader.js","sourceRoot":"/","sources":["src/components/generic/loader/OverlayLoader.tsx"],"names":[],"mappings":";;;;;;AAAA,4DAA2C;AAC3C,kDAA0B;AAE1B,4FAAiD;AAQ1C,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE;IACvD,OAAO,CACH,uCAAK,SAAS,EAAE,IAAA,oBAAE,EAAC,mCAAM,CAAC,SAAS,CAAC,EAAE,EAAE,CAAC,mCAAM,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,YAAY,EAAE,CAAC;QAC9E,uCAAK,SAAS,EAAE,mCAAM,CAAC,SAAS,CAAC,IAC5B,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;YACjD,OAAO,uCAAK,GAAG,EAAE,IAAI,EAAE,SAAS,EAAE,IAAA,oBAAE,EAAC,mCAAM,CAAC,MAAM,CAAC,EAAG,mCAAc,CAAC,IAAI,CAAC,CAAC,GAAQ,CAAC;QACxF,CAAC,CAAC,CACA;QACL,KAAK,CAAC,KAAK,IAAI,uCAAK,SAAS,EAAE,mCAAM,CAAC,OAAO,CAAC,IAAG,KAAK,CAAC,KAAK,CAAO,CAClE,CACT,CAAC;AACN,CAAC,CAAC;AAXW,QAAA,aAAa,iBAWxB","sourcesContent":["import { default as cx } from 'classnames';\nimport React from 'react';\n\nimport styles from './OverlayLoader.module.scss';\n\ntype OverlayLoaderProps = {\n    label?: string;\n\n    isFullscreen?: boolean;\n};\n\nexport const OverlayLoader = (props: OverlayLoaderProps) => {\n    return (\n        <div className={cx(styles['overlay'], { [styles['--fixed']]: props.isFullscreen })}>\n            <div className={styles['spinner']}>\n                {['top', 'bottom', 'left', 'move-blob'].map((item) => {\n                    return <div key={item} className={cx(styles['blob'], (styles as any)[item])}></div>;\n                })}\n            </div>\n            {props.label && <div className={styles['label']}>{props.label}</div>}\n        </div>\n    );\n};\n"]}

package/dist/src/components/steps/confirmation/PaymentInformation.d.ts

@@ -1,7 +1,8 @@
+import { EBookingPaymentMethod } from '@roomstay/core';
 import { FC } from 'react';
 interface PaymentInformationProps {
     tokenizerRef: any;
-    onChangeCb: (code: string) => void;
+    onChangeCb: (code: EBookingPaymentMethod) => void;
 }
 declare const PaymentInformation: FC<PaymentInformationProps>;
 export default PaymentInformation;

package/dist/src/components/steps/confirmation/PaymentInformation.js

@@ -30,6 +30,7 @@ const core_1 = require("@roomstay/core");
 const dayjs_1 = __importDefault(require("dayjs"));
 const react_1 = __importStar(require("react"));
 const react_hook_form_1 = require("react-hook-form");
+const react_i18next_1 = require("react-i18next");
 const InlinePaymentOption_1 = __importDefault(require("../../generic/PaymentCard/InlinePaymentOption"));
 const RadioButtonGroup_1 = __importDefault(require("../../generic/RadioButtonGroup/RadioButtonGroup"));
 const StepConfirmationPaymentDetails_1 = require("./PaymentDetails/StepConfirmationPaymentDetails");
@@ -38,6 +39,7 @@ const PlanpayPaymentMethod_1 = require("./PlanpayPaymentMethod");
 const contexts_1 = require("../../../contexts");
 const hooks_1 = require("../../../hooks");
 const Planpay_1 = __importDefault(require("../../../hooks/Planpay"));
+const Translation_1 = require("../../../translations/Translation");
 const PaymentInformation = ({ tokenizerRef, onChangeCb }) => {
     var _a;
     const methods = (0, react_hook_form_1.useFormContext)();
@@ -46,19 +48,22 @@ const PaymentInformation = ({ tokenizerRef, onChangeCb }) => {
     const { hasPricePreview, planpayConfig } = (0, Planpay_1.default)();
     const { cards = [], roomstayMember } = (0, contexts_1.useMemberContext)();
     const defaultCard = (0, react_1.useMemo)(() => cards.find((card) => card.cardId === (roomstayMember === null || roomstayMember === void 0 ? void 0 : roomstayMember.defaultCard)), [cards, roomstayMember]);
+    const { t } = (0, react_i18next_1.useTranslation)();
     const { currentCurrency } = (0, react_1.useContext)(contexts_1.CompanyContext);
     const paymentMethod = methods.watch('paymentMethod');
+    // TODO: while we figure out how to handle member cards we'll just disable this for non-passthrough paymets
+    const isPassthrough = (hotel === null || hotel === void 0 ? void 0 : hotel.cardProcessor) ? hotel.cardProcessor === core_1.EHotelCardProcessor.Passthrough : true;
     const vgsCardInputOption = {
         value: core_1.EBookingPaymentMethod.Card,
-        label: react_1.default.createElement(InlinePaymentOption_1.default, { active: paymentMethod === core_1.EBookingPaymentMethod.Card }),
-        renderContent: () => react_1.default.createElement(StepConfirmationPaymentDetails_1.StepConfirmationVGSPaymentInput, { ref: tokenizerRef }),
+        label: (react_1.default.createElement(InlinePaymentOption_1.default, { active: paymentMethod === core_1.EBookingPaymentMethod.Card, overrideSubLabel: isPassthrough ? undefined : t(Translation_1.Translation.Step.Confirmation.CardThirdPartyLabel) })),
+        renderContent: isPassthrough ? () => react_1.default.createElement(StepConfirmationPaymentDetails_1.StepConfirmationVGSPaymentInput, { ref: tokenizerRef }) : undefined,
     };
     const options = [];
     if ((_a = hotel === null || hotel === void 0 ? void 0 : hotel.paymentMethods) === null || _a === void 0 ? void 0 : _a.includes(core_1.EBookingPaymentMethod.Card)) {
         let defaultCardOption;
         // Reason this is split up is in case someone doesn't have a default card selected
         // We still want to select the first card they have, if they have any.
-        if (cards.length) {
+        if (cards.length && isPassthrough) {
             const selectedMemberCard = defaultCard ? defaultCard : cards[0];
             defaultCardOption = {
                 value: selectedMemberCard.cardId,

package/dist/src/components/steps/confirmation/PaymentInformation.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentInformation.js","sourceRoot":"/","sources":["src/components/steps/confirmation/PaymentInformation.tsx"],"names":[],"mappings":"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","sourcesContent":["import { EBookingPaymentMethod } from '@roomstay/core';\nimport dayjs from 'dayjs';\nimport React, { FC, useContext, useEffect, useMemo } from 'react';\nimport { Controller, useFormContext } from 'react-hook-form';\n\nimport InlinePaymentOption from '@/components/generic/PaymentCard/InlinePaymentOption';\nimport RadioButtonGroup, { IRadioButtonOption } from '@/components/generic/RadioButtonGroup/RadioButtonGroup';\nimport { StepConfirmationVGSPaymentInput } from '@/components/steps/confirmation/PaymentDetails/StepConfirmationPaymentDetails';\nimport PlanpayLabel from '@/components/steps/confirmation/PlanpayLabel';\nimport { PlanpayPaymentMethod } from '@/components/steps/confirmation/PlanpayPaymentMethod';\nimport { CompanyContext, useBasket, useMemberContext } from '@/contexts';\nimport { useCurrentHotel } from '@/hooks';\nimport usePlanpay from '@/hooks/Planpay';\nimport { ConfirmationFormValues } from '@/models/Confirmation';\n\ninterface PaymentInformationProps {\n    tokenizerRef: any;\n    onChangeCb: (code: string) => void;\n}\n\nconst PaymentInformation: FC<PaymentInformationProps> = ({ tokenizerRef, onChangeCb }) => {\n    const methods = useFormContext<ConfirmationFormValues>();\n    const { hotel } = useCurrentHotel();\n    const basketContext = useBasket();\n    const { hasPricePreview, planpayConfig } = usePlanpay();\n    const { cards = [], roomstayMember } = useMemberContext();\n    const defaultCard = useMemo(() => cards.find((card) => card.cardId === roomstayMember?.defaultCard), [cards, roomstayMember]);\n\n    const { currentCurrency } = useContext(CompanyContext);\n\n    const paymentMethod = methods.watch('paymentMethod');\n    const vgsCardInputOption: IRadioButtonOption = {\n        value: EBookingPaymentMethod.Card,\n        label: <InlinePaymentOption active={paymentMethod === EBookingPaymentMethod.Card} />,\n        renderContent: () => <StepConfirmationVGSPaymentInput ref={tokenizerRef} />,\n    };\n\n    const options: IRadioButtonOption[] = [];\n    if (hotel?.paymentMethods?.includes(EBookingPaymentMethod.Card)) {\n        let defaultCardOption: IRadioButtonOption;\n        // Reason this is split up is in case someone doesn't have a default card selected\n        // We still want to select the first card they have, if they have any.\n        if (cards.length) {\n            const selectedMemberCard = defaultCard ? defaultCard : cards[0];\n\n            defaultCardOption = {\n                value: selectedMemberCard.cardId,\n                label: <InlinePaymentOption card={selectedMemberCard} />,\n            };\n        } else {\n            defaultCardOption = vgsCardInputOption;\n        }\n\n        const selectableStoredCardOptions = [];\n\n        if (cards.length) {\n            for (const memberCard of cards) {\n                selectableStoredCardOptions.push({\n                    value: memberCard.cardId,\n                    label: <InlinePaymentOption card={memberCard} />,\n                });\n            }\n            selectableStoredCardOptions.push(vgsCardInputOption);\n        }\n\n        options.push({\n            ...defaultCardOption,\n            options: selectableStoredCardOptions.length > 0 ? selectableStoredCardOptions : undefined,\n        });\n    }\n\n    useEffect(() => {\n        methods.trigger();\n    }, [currentCurrency]);\n\n    if (hasPricePreview && planpayConfig && planpayConfig.minDaysShowPlanpay && dayjs(basketContext.startDate).diff(dayjs(), 'day') > planpayConfig.minDaysShowPlanpay) {\n        options.push({\n            value: EBookingPaymentMethod.Planpay,\n            label: <PlanpayLabel />,\n            disabled: !methods.formState.isValid,\n            disabledReason: !methods.formState.isValid ? 'You must fill all the above details before proceeding with Planpay' : '',\n            renderContent: () => <PlanpayPaymentMethod />,\n        });\n    }\n\n    return (\n        <Controller\n            control={methods.control}\n            name=\"paymentMethod\"\n            render={({ field: { onChange, value } }) => {\n                return (\n                    <>\n                        <div>\n                            <RadioButtonGroup\n                                options={options}\n                                value={value}\n                                onChange={(code) => {\n                                    onChange(code);\n                                    onChangeCb(code);\n                                }}\n                            />\n                        </div>\n                    </>\n                );\n            }}\n        />\n    );\n};\n\nexport default PaymentInformation;\n"]}
+{"version":3,"file":"PaymentInformation.js","sourceRoot":"/","sources":["src/components/steps/confirmation/PaymentInformation.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yCAA4E;AAC5E,kDAA0B;AAC1B,+CAAkE;AAClE,qDAA6D;AAC7D,iDAA+C;AAE/C,+GAAuF;AACvF,8GAA8G;AAC9G,kIAAgI;AAChI,gGAAwE;AACxE,+FAA4F;AAC5F,yCAAyE;AACzE,mCAA0C;AAC1C,8DAAyC;AAEzC,4DAAyD;AAOzD,MAAM,kBAAkB,GAAgC,CAAC,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,EAAE;;IACrF,MAAM,OAAO,GAAG,IAAA,gCAAc,GAA0B,CAAC;IACzD,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IACpC,MAAM,aAAa,GAAG,IAAA,oBAAS,GAAE,CAAC;IAClC,MAAM,EAAE,eAAe,EAAE,aAAa,EAAE,GAAG,IAAA,iBAAU,GAAE,CAAC;IACxD,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,cAAc,EAAE,GAAG,IAAA,2BAAgB,GAAE,CAAC;IAC1D,MAAM,WAAW,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,MAAK,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,CAAA,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC;IAC9H,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,EAAE,eAAe,EAAE,GAAG,IAAA,kBAAU,EAAC,yBAAc,CAAC,CAAC;IAEvD,MAAM,aAAa,GAAG,OAAO,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;IAErD,2GAA2G;IAC3G,MAAM,aAAa,GAAG,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,aAAa,EAAC,CAAC,CAAC,KAAK,CAAC,aAAa,KAAK,0BAAmB,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC;IAE5G,MAAM,kBAAkB,GAAuB;QAC3C,KAAK,EAAE,4BAAqB,CAAC,IAAI;QACjC,KAAK,EAAE,CACH,8BAAC,6BAAmB,IAChB,MAAM,EAAE,aAAa,KAAK,4BAAqB,CAAC,IAAI,EACpD,gBAAgB,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,mBAAmB,CAAC,GACpG,CACL;QACD,aAAa,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,8BAAC,gEAA+B,IAAC,GAAG,EAAE,YAAY,GAAI,CAAC,CAAC,CAAC,SAAS;KAC1G,CAAC;IAEF,MAAM,OAAO,GAAyB,EAAE,CAAC;IACzC,IAAI,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,cAAc,0CAAE,QAAQ,CAAC,4BAAqB,CAAC,IAAI,CAAC,EAAE;QAC7D,IAAI,iBAAqC,CAAC;QAC1C,kFAAkF;QAClF,sEAAsE;QACtE,IAAI,KAAK,CAAC,MAAM,IAAI,aAAa,EAAE;YAC/B,MAAM,kBAAkB,GAAG,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YAEhE,iBAAiB,GAAG;gBAChB,KAAK,EAAE,kBAAkB,CAAC,MAAM;gBAChC,KAAK,EAAE,8BAAC,6BAAmB,IAAC,IAAI,EAAE,kBAAkB,GAAI;aAC3D,CAAC;SACL;aAAM;YACH,iBAAiB,GAAG,kBAAkB,CAAC;SAC1C;QAED,MAAM,2BAA2B,GAAG,EAAE,CAAC;QAEvC,IAAI,KAAK,CAAC,MAAM,EAAE;YACd,KAAK,MAAM,UAAU,IAAI,KAAK,EAAE;gBAC5B,2BAA2B,CAAC,IAAI,CAAC;oBAC7B,KAAK,EAAE,UAAU,CAAC,MAAM;oBACxB,KAAK,EAAE,8BAAC,6BAAmB,IAAC,IAAI,EAAE,UAAU,GAAI;iBACnD,CAAC,CAAC;aACN;YACD,2BAA2B,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;SACxD;QAED,OAAO,CAAC,IAAI,iCACL,iBAAiB,KACpB,OAAO,EAAE,2BAA2B,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,SAAS,IAC3F,CAAC;KACN;IAED,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,OAAO,CAAC,OAAO,EAAE,CAAC;IACtB,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,IAAI,eAAe,IAAI,aAAa,IAAI,aAAa,CAAC,kBAAkB,IAAI,IAAA,eAAK,EAAC,aAAa,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,IAAA,eAAK,GAAE,EAAE,KAAK,CAAC,GAAG,aAAa,CAAC,kBAAkB,EAAE;QAChK,OAAO,CAAC,IAAI,CAAC;YACT,KAAK,EAAE,4BAAqB,CAAC,OAAO;YACpC,KAAK,EAAE,8BAAC,sBAAY,OAAG;YACvB,QAAQ,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO;YACpC,cAAc,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,oEAAoE,CAAC,CAAC,CAAC,EAAE;YACtH,aAAa,EAAE,GAAG,EAAE,CAAC,8BAAC,2CAAoB,OAAG;SAChD,CAAC,CAAC;KACN;IAED,OAAO,CACH,8BAAC,4BAAU,IACP,OAAO,EAAE,OAAO,CAAC,OAAO,EACxB,IAAI,EAAC,eAAe,EACpB,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE;YACvC,OAAO,CACH;gBACI;oBACI,8BAAC,0BAAgB,IACb,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;4BACf,QAAQ,CAAC,IAAI,CAAC,CAAC;4BACf,UAAU,CAAC,IAA6B,CAAC,CAAC;wBAC9C,CAAC,GACH,CACA,CACP,CACN,CAAC;QACN,CAAC,GACH,CACL,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,kBAAkB,CAAC","sourcesContent":["import { EBookingPaymentMethod, EHotelCardProcessor } from '@roomstay/core';\nimport dayjs from 'dayjs';\nimport React, { FC, useContext, useEffect, useMemo } from 'react';\nimport { Controller, useFormContext } from 'react-hook-form';\nimport { useTranslation } from 'react-i18next';\n\nimport InlinePaymentOption from '@/components/generic/PaymentCard/InlinePaymentOption';\nimport RadioButtonGroup, { IRadioButtonOption } from '@/components/generic/RadioButtonGroup/RadioButtonGroup';\nimport { StepConfirmationVGSPaymentInput } from '@/components/steps/confirmation/PaymentDetails/StepConfirmationPaymentDetails';\nimport PlanpayLabel from '@/components/steps/confirmation/PlanpayLabel';\nimport { PlanpayPaymentMethod } from '@/components/steps/confirmation/PlanpayPaymentMethod';\nimport { CompanyContext, useBasket, useMemberContext } from '@/contexts';\nimport { useCurrentHotel } from '@/hooks';\nimport usePlanpay from '@/hooks/Planpay';\nimport { ConfirmationFormValues } from '@/models/Confirmation';\nimport { Translation } from '@/translations/Translation';\n\ninterface PaymentInformationProps {\n    tokenizerRef: any;\n    onChangeCb: (code: EBookingPaymentMethod) => void;\n}\n\nconst PaymentInformation: FC<PaymentInformationProps> = ({ tokenizerRef, onChangeCb }) => {\n    const methods = useFormContext<ConfirmationFormValues>();\n    const { hotel } = useCurrentHotel();\n    const basketContext = useBasket();\n    const { hasPricePreview, planpayConfig } = usePlanpay();\n    const { cards = [], roomstayMember } = useMemberContext();\n    const defaultCard = useMemo(() => cards.find((card) => card.cardId === roomstayMember?.defaultCard), [cards, roomstayMember]);\n    const { t } = useTranslation();\n\n    const { currentCurrency } = useContext(CompanyContext);\n\n    const paymentMethod = methods.watch('paymentMethod');\n\n    // TODO: while we figure out how to handle member cards we'll just disable this for non-passthrough paymets\n    const isPassthrough = hotel?.cardProcessor ? hotel.cardProcessor === EHotelCardProcessor.Passthrough : true;\n\n    const vgsCardInputOption: IRadioButtonOption = {\n        value: EBookingPaymentMethod.Card,\n        label: (\n            <InlinePaymentOption\n                active={paymentMethod === EBookingPaymentMethod.Card}\n                overrideSubLabel={isPassthrough ? undefined : t(Translation.Step.Confirmation.CardThirdPartyLabel)}\n            />\n        ),\n        renderContent: isPassthrough ? () => <StepConfirmationVGSPaymentInput ref={tokenizerRef} /> : undefined,\n    };\n\n    const options: IRadioButtonOption[] = [];\n    if (hotel?.paymentMethods?.includes(EBookingPaymentMethod.Card)) {\n        let defaultCardOption: IRadioButtonOption;\n        // Reason this is split up is in case someone doesn't have a default card selected\n        // We still want to select the first card they have, if they have any.\n        if (cards.length && isPassthrough) {\n            const selectedMemberCard = defaultCard ? defaultCard : cards[0];\n\n            defaultCardOption = {\n                value: selectedMemberCard.cardId,\n                label: <InlinePaymentOption card={selectedMemberCard} />,\n            };\n        } else {\n            defaultCardOption = vgsCardInputOption;\n        }\n\n        const selectableStoredCardOptions = [];\n\n        if (cards.length) {\n            for (const memberCard of cards) {\n                selectableStoredCardOptions.push({\n                    value: memberCard.cardId,\n                    label: <InlinePaymentOption card={memberCard} />,\n                });\n            }\n            selectableStoredCardOptions.push(vgsCardInputOption);\n        }\n\n        options.push({\n            ...defaultCardOption,\n            options: selectableStoredCardOptions.length > 0 ? selectableStoredCardOptions : undefined,\n        });\n    }\n\n    useEffect(() => {\n        methods.trigger();\n    }, [currentCurrency]);\n\n    if (hasPricePreview && planpayConfig && planpayConfig.minDaysShowPlanpay && dayjs(basketContext.startDate).diff(dayjs(), 'day') > planpayConfig.minDaysShowPlanpay) {\n        options.push({\n            value: EBookingPaymentMethod.Planpay,\n            label: <PlanpayLabel />,\n            disabled: !methods.formState.isValid,\n            disabledReason: !methods.formState.isValid ? 'You must fill all the above details before proceeding with Planpay' : '',\n            renderContent: () => <PlanpayPaymentMethod />,\n        });\n    }\n\n    return (\n        <Controller\n            control={methods.control}\n            name=\"paymentMethod\"\n            render={({ field: { onChange, value } }) => {\n                return (\n                    <>\n                        <div>\n                            <RadioButtonGroup\n                                options={options}\n                                value={value}\n                                onChange={(code) => {\n                                    onChange(code);\n                                    onChangeCb(code as EBookingPaymentMethod);\n                                }}\n                            />\n                        </div>\n                    </>\n                );\n            }}\n        />\n    );\n};\n\nexport default PaymentInformation;\n"]}

package/dist/src/components/steps/confirmation/RoomContactDetails.js

@@ -38,6 +38,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const contexts_1 = require("../../../contexts/index.js");
+const hooks_1 = require("../../../hooks/index.js");
 const core_1 = require("@roomstay/core");
 const react_1 = __importStar(require("react"));
 const react_hook_form_1 = require("react-hook-form");
@@ -45,11 +46,13 @@ const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
 const AutoAutoHeight_1 = __importDefault(require("../../../animations/AutoAutoHeight"));
 const Alert_1 = __importStar(require("../../generic/Alert"));
+const Checkbox_1 = __importDefault(require("../../generic/Checkbox/Checkbox"));
 const EnhancedPhoneNumberField_1 = __importDefault(require("../../generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField"));
 const Headline_1 = __importDefault(require("../../generic/Headline"));
 const Icon_1 = __importStar(require("../../generic/Icon/Icon"));
 const InputGroup_1 = __importDefault(require("../../generic/InputGroup/InputGroup"));
 const LineBreak_1 = __importDefault(require("../../generic/LineBreak"));
+const Select_1 = require("../../generic/Select");
 const Text_1 = __importStar(require("../../generic/Text"));
 const TextBox_1 = __importDefault(require("../../generic/TextBox"));
 const StepConfirmationCountrySelector_1 = __importDefault(require("./StepConfirmationCountrySelector"));
@@ -59,12 +62,12 @@ const Color_1 = require("../../../util/Color");
 const DataLayer_1 = __importStar(require("../../../util/DataLayer"));
 const StringHelper_1 = __importDefault(require("../../../util/StringHelper"));
 const Validation_1 = require("../../../util/Validation");
-const Checkbox_1 = __importDefault(require("../../generic/Checkbox/Checkbox"));
 const RoomContactDetails = () => {
     const { register, formState, control, watch, getValues, setValue } = (0, react_hook_form_1.useFormContext)();
     const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
     const basketRows = basketContext.getAllValidRows();
     const basketAddonRows = basketContext.basketAddonRows;
+    const { hotel } = (0, hooks_1.useCurrentHotel)();
     const { update, fields } = (0, react_hook_form_1.useFieldArray)({
         control,
         name: 'userProfiles',
@@ -150,13 +153,18 @@ const RoomContactDetails = () => {
         return null;
     };
     return (react_1.default.createElement(react_1.default.Fragment, null, fields.map((field, index) => {
+        var _a, _b;
         const padInputName = (name) => padInputNameByRoomNumber(name, index);
         const getValidationClass = (name) => {
-            var _a;
+            var _a, _b, _c;
             if (!errors.userProfiles || (copyCheckBox && index >= 1))
                 return;
             if ((_a = errors.userProfiles[index]) === null || _a === void 0 ? void 0 : _a[name]) {
                 return 'error';
+                // Hack to get Aux Inputs to validate as well.
+            }
+            else if ((_c = (_b = errors.userProfiles[index]) === null || _b === void 0 ? void 0 : _b.AuxInputs) === null || _c === void 0 ? void 0 : _c[name.replace('AuxInputs.', '')]) {
+                return 'error';
             }
             else {
                 return 'success';
@@ -168,7 +176,16 @@ const RoomContactDetails = () => {
             }
         };
         const basketRow = basketRows[index];
+        const currentRoom = basketRow.getRoom();
         const isDisabled = (copyCheckBox && index >= 1) || paymentMethod === core_1.EBookingPaymentMethod.Planpay;
+        const roomGroup = (_a = hotel === null || hotel === void 0 ? void 0 : hotel.roomGroups) === null || _a === void 0 ? void 0 : _a.find(({ id }) => id === currentRoom.roomGroupId);
+        const requiredInputs = [];
+        for (const inputKey of Object.keys((_b = roomGroup === null || roomGroup === void 0 ? void 0 : roomGroup.filters) !== null && _b !== void 0 ? _b : {})) {
+            const input = roomGroup === null || roomGroup === void 0 ? void 0 : roomGroup.filters[inputKey];
+            if (input === null || input === void 0 ? void 0 : input.requireInput) {
+                requiredInputs.push({ id: `AuxInputs.${inputKey}`, name: input.name, label: input.name, options: input.options });
+            }
+        }
         return (react_1.default.createElement("div", { key: field.id },
             react_1.default.createElement("div", { className: index === 0 ? '' : 'u-marg-bottom--heavy' },
                 react_1.default.createElement("div", { className: "u-marg-bottom", onClick: openExpandable },
@@ -307,6 +324,19 @@ const RoomContactDetails = () => {
                                             onInputChange(padInputName(Confirmation_1.EUserProfileFormKey.Country), 'Country - Address')(e);
                                         } }, rest)));
                                 } })))),
+                requiredInputs.length > 0 && (react_1.default.createElement("div", { className: "u-marg-top" },
+                    react_1.default.createElement("div", { className: "u-marg-top" },
+                        react_1.default.createElement(InputGroup_1.default, { dimensions: "2/2" }, requiredInputs.map((input) => {
+                            const options = input.options;
+                            return (react_1.default.createElement(react_hook_form_1.Controller, { key: input.id, control: control, name: padInputName(input.id), rules: { required: true }, render: ({ field }) => {
+                                    const { ref } = field, rest = __rest(field, ["ref"]);
+                                    return (react_1.default.createElement(react_1.default.Fragment, null,
+                                        react_1.default.createElement("div", { className: "u-marg-bottom--light" },
+                                            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                                                react_1.default.createElement("strong", null, input.name))),
+                                        react_1.default.createElement(Select_1.InputSelect, Object.assign({ key: input.id, keyName: "value", labelName: "label", options: options, placeholder: "Please Select", validationStatus: getValidationClass(input.id) }, rest))));
+                                } }));
+                        }))))),
                 react_1.default.createElement(LineBreak_1.default, null)),
             fields.length > 1 && index === 0 ? (react_1.default.createElement("div", { className: "u-marg-bottom--heavy" },
                 react_1.default.createElement(Checkbox_1.default, Object.assign({ label: t(Translation_1.Translation.Step.Confirmation.ApplySameInfoToOtherRooms) }, register('copyCheckBox'))))) : null));