npm - @roomstay/frontend - Versions diffs - 2.4.4-0 → 2.4.4-2 - Mend

@roomstay/frontend 2.4.4-0 → 2.4.4-2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (39) hide show

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

@@ -1,4 +1,4 @@
-import 'react-spring-bottom-sheet/dist/style.css';
+import './BookingWizardContent.engine.scss';
 import React from 'react';
 import { BookingWizardProperty } from '../../../models/BookingWizard/BookingWizardProperty';
 import { TBookingWizardProperties } from '../../../models/BookingWizard/BookingWizardTypes';

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

@@ -36,7 +36,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BookingWizardContent = void 0;
-require("react-spring-bottom-sheet/dist/style.css");
+require("./BookingWizardContent.engine.scss");
 const classnames_1 = __importDefault(require("classnames"));
 const dayjs_1 = __importDefault(require("dayjs"));
 const react_1 = __importStar(require("react"));

package/dist/src/components/generic/BookingWizard/BookingWizardContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BookingWizardContent.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardContent.tsx"],"names":[],"mappings":"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","sourcesContent":["import 'react-spring-bottom-sheet/dist/style.css';\n\nimport classNames from 'classnames';\nimport dayjs, { Dayjs } from 'dayjs';\nimport React, { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport AvailabilityAPI from '@/api/AvailabilityAPI';\nimport { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { Translation } from '@/translations/Translation';\n\nimport BEButton from '../BEButton';\nimport styles from './BookingWizard.module.scss';\nimport { BookingWizardContext, BookingWizardOnBooking } from './BookingWizardContext';\nimport { BookingWizardDateSelector } from './BookingWizardDateSelector/BookingWizardDateSelector';\nimport { BookingWizardGuestSelector } from './BookingWizardGuestSelector/BookingWizardGuestSelector';\nimport { BookingWizardHotelSelector } from './BookingWizardHotelSelector/BookingWizardHotelSelector';\nimport { BookingWizardPromoCode } from './BookingWizardPromoCode/BookingWizardPromoCode';\n\nexport interface BookingWizardContentProps {\n defaultColors: BookingWizardProperty['colors'];\n properties: TBookingWizardProperties;\n selectedProperty?: BookingWizardProperty;\n classname?: string;\n disableChild?: boolean;\n disableRoom?: boolean;\n defaultValues?: Partial<Omit<BookingWizardOnBooking, 'id' \| 'checkIn' \| 'checkout'>> & { checkIn?: string; checkout?: string };\n}\n\nexport const BookingWizardContent: React.FC<BookingWizardContentProps> = ({\n properties,\n selectedProperty: defaultProperty,\n defaultColors,\n classname,\n disableChild,\n disableRoom,\n defaultValues,\n}) => {\n const bwContext = useContext(BookingWizardContext);\n const { t } = useTranslation();\n\n const [checkInDate, setCheckInDate] = useState<Dayjs \| null>(defaultValues?.checkIn ? dayjs(defaultValues?.checkIn) : dayjs());\n const [checkOutDate, setCheckOutDate] = useState<Dayjs \| null>(defaultValues?.checkout ? dayjs(defaultValues?.checkout) : dayjs().add(1, 'days'));\n const [adults, setAdults] = useState<number>(defaultValues?.guests?.adults ?? 1);\n const [children, setChildren] = useState<number>(defaultValues?.guests?.children ?? 0);\n const [room, setRoom] = useState<number>(defaultValues?.guests?.room ?? 1);\n const [promoCode, setPromoCode] = useState<string>(defaultValues?.promoCode \|\| '');\n const [promoCodeValid, setPromoCodeValid] = useState<boolean>();\n const [selectedProperty, setSelectedProperty] = useState<BookingWizardProperty \| undefined>(defaultProperty);\n\n useEffect(() => {\n if (selectedProperty?.colors) {\n RoomstayThemeEngine.changeTheme(selectedProperty.colors);\n } else if (defaultColors) {\n RoomstayThemeEngine.changeTheme(defaultColors);\n }\n }, [selectedProperty]);\n\n const setGuest = (guests: BookingWizardOnBooking['guests']) => {\n setAdults(guests.adults);\n setChildren(guests.children);\n setRoom(guests.room);\n };\n\n const setDate = (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => {\n setCheckInDate(startDate);\n setCheckOutDate(endDate);\n };\n\n const isValid = () => {\n if (!selectedProperty) return false;\n if (!checkInDate) return false;\n if (!checkOutDate) return false;\n if (adults + children <= 0) return false;\n\n return true;\n };\n\n const _onSubmit = () => {\n if (!isValid()) return false;\n\n // After passing validation, we pass the function up the chain for the engine\n // Implementor to decide where the user should be redirected to\n // This is to give the hotel team a chance to add tracking, or modify the request on their end.\n bwContext.onSubmit?.({\n id: selectedProperty?.id as string,\n checkIn: checkInDate as Dayjs,\n checkout: checkOutDate as Dayjs,\n promoCode,\n guests: {\n adults,\n children,\n room,\n },\n });\n };\n\n const _onPromoCodeChange = async (value?: string) => {\n setPromoCode?.(value \|\| '');\n if (!value) {\n setPromoCodeValid(undefined);\n } else if (isValid() && selectedProperty && checkInDate && checkOutDate) {\n const result = await new AvailabilityAPI().fetchAvailability({\n fromDate: checkInDate,\n toDate: checkOutDate,\n adults,\n children,\n promoCode: value,\n hotelId: selectedProperty?.id,\n promoOnly: true,\n });\n\n const rate = Object.values(result.ratePlans).find((rate: any) => rate.promoCode === value);\n setPromoCodeValid(!!rate);\n }\n };\n\n const submitButton = (\n <BEButton disabled={!isValid()} className={styles.bookNowBtn} onClick={_onSubmit}>\n {t(Translation.Misc.BookNow)}\n </BEButton>\n );\n\n return (\n <>\n <div\n className={classNames(\n styles.content,\n styles[`--${bwContext.layout}`],\n {\n [styles['--vertical']]: bwContext.layout === 'button',\n [styles.inline]: bwContext.type === 'inline',\n },\n classname\n )}\n >\n <>\n <div className={styles.item}>\n <label className={styles.label}>{t(Translation.Misc.ChooseHotel)}</label>\n <BookingWizardHotelSelector\n onChange={(value) => setSelectedProperty(value \|\| undefined)}\n properties={properties}\n selectedProperty={selectedProperty}\n contentClassName={classname}\n />\n </div>\n <div className={styles.divider} />\n </>\n <BookingWizardDateSelector\n onChange={setDate}\n defaultStartDate={defaultValues?.checkIn ? dayjs(defaultValues?.checkIn) : undefined}\n defaultEndDate={defaultValues?.checkout ? dayjs(defaultValues?.checkout) : undefined}\n />\n\n <div className={styles.divider} />\n <div className={styles.item}>\n <label className={styles.label}>{t(Translation.Misc.Guests)}</label>\n <BookingWizardGuestSelector\n defaultValue={{\n adults,\n children,\n room,\n }}\n onChange={setGuest}\n disableChild={disableChild}\n disableRoom={disableRoom}\n />\n </div>\n <div className={styles.divider} />\n {bwContext.layout === 'horizontal-condensed' ? null : (\n <div className={styles.item}>\n <label className={styles.label}>Promocode</label>\n <BookingWizardPromoCode promoCode={promoCode} onChange={_onPromoCodeChange} valid={promoCodeValid} />\n </div>\n )}\n {!(bwContext.layout === 'horizontal-condensed') ? <div className={styles.action}>{submitButton}</div> : null}\n </div>\n\n {bwContext.layout === 'horizontal-condensed' ? (\n <div className={classNames(styles.content, classname)}>\n <div className={classNames(styles.action, styles.centerItems, 'u-marg-top u-marg-top--light@l-')}>{submitButton}</div>\n </div>\n ) : null}\n </>\n );\n};\n"]}
1	+ {"version":3,"file":"BookingWizardContent.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardContent.tsx"],"names":[],"mappings":"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","sourcesContent":["import './BookingWizardContent.engine.scss';\n\nimport classNames from 'classnames';\nimport dayjs, { Dayjs } from 'dayjs';\nimport React, { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport AvailabilityAPI from '@/api/AvailabilityAPI';\nimport { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { Translation } from '@/translations/Translation';\n\nimport BEButton from '../BEButton';\nimport styles from './BookingWizard.module.scss';\nimport { BookingWizardContext, BookingWizardOnBooking } from './BookingWizardContext';\nimport { BookingWizardDateSelector } from './BookingWizardDateSelector/BookingWizardDateSelector';\nimport { BookingWizardGuestSelector } from './BookingWizardGuestSelector/BookingWizardGuestSelector';\nimport { BookingWizardHotelSelector } from './BookingWizardHotelSelector/BookingWizardHotelSelector';\nimport { BookingWizardPromoCode } from './BookingWizardPromoCode/BookingWizardPromoCode';\n\nexport interface BookingWizardContentProps {\n defaultColors: BookingWizardProperty['colors'];\n properties: TBookingWizardProperties;\n selectedProperty?: BookingWizardProperty;\n classname?: string;\n disableChild?: boolean;\n disableRoom?: boolean;\n defaultValues?: Partial<Omit<BookingWizardOnBooking, 'id' \| 'checkIn' \| 'checkout'>> & { checkIn?: string; checkout?: string };\n}\n\nexport const BookingWizardContent: React.FC<BookingWizardContentProps> = ({\n properties,\n selectedProperty: defaultProperty,\n defaultColors,\n classname,\n disableChild,\n disableRoom,\n defaultValues,\n}) => {\n const bwContext = useContext(BookingWizardContext);\n const { t } = useTranslation();\n\n const [checkInDate, setCheckInDate] = useState<Dayjs \| null>(defaultValues?.checkIn ? dayjs(defaultValues?.checkIn) : dayjs());\n const [checkOutDate, setCheckOutDate] = useState<Dayjs \| null>(defaultValues?.checkout ? dayjs(defaultValues?.checkout) : dayjs().add(1, 'days'));\n const [adults, setAdults] = useState<number>(defaultValues?.guests?.adults ?? 1);\n const [children, setChildren] = useState<number>(defaultValues?.guests?.children ?? 0);\n const [room, setRoom] = useState<number>(defaultValues?.guests?.room ?? 1);\n const [promoCode, setPromoCode] = useState<string>(defaultValues?.promoCode \|\| '');\n const [promoCodeValid, setPromoCodeValid] = useState<boolean>();\n const [selectedProperty, setSelectedProperty] = useState<BookingWizardProperty \| undefined>(defaultProperty);\n\n useEffect(() => {\n if (selectedProperty?.colors) {\n RoomstayThemeEngine.changeTheme(selectedProperty.colors);\n } else if (defaultColors) {\n RoomstayThemeEngine.changeTheme(defaultColors);\n }\n }, [selectedProperty]);\n\n const setGuest = (guests: BookingWizardOnBooking['guests']) => {\n setAdults(guests.adults);\n setChildren(guests.children);\n setRoom(guests.room);\n };\n\n const setDate = (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => {\n setCheckInDate(startDate);\n setCheckOutDate(endDate);\n };\n\n const isValid = () => {\n if (!selectedProperty) return false;\n if (!checkInDate) return false;\n if (!checkOutDate) return false;\n if (adults + children <= 0) return false;\n\n return true;\n };\n\n const _onSubmit = () => {\n if (!isValid()) return false;\n\n // After passing validation, we pass the function up the chain for the engine\n // Implementor to decide where the user should be redirected to\n // This is to give the hotel team a chance to add tracking, or modify the request on their end.\n bwContext.onSubmit?.({\n id: selectedProperty?.id as string,\n checkIn: checkInDate as Dayjs,\n checkout: checkOutDate as Dayjs,\n promoCode,\n guests: {\n adults,\n children,\n room,\n },\n });\n };\n\n const _onPromoCodeChange = async (value?: string) => {\n setPromoCode?.(value \|\| '');\n if (!value) {\n setPromoCodeValid(undefined);\n } else if (isValid() && selectedProperty && checkInDate && checkOutDate) {\n const result = await new AvailabilityAPI().fetchAvailability({\n fromDate: checkInDate,\n toDate: checkOutDate,\n adults,\n children,\n promoCode: value,\n hotelId: selectedProperty?.id,\n promoOnly: true,\n });\n\n const rate = Object.values(result.ratePlans).find((rate: any) => rate.promoCode === value);\n setPromoCodeValid(!!rate);\n }\n };\n\n const submitButton = (\n <BEButton disabled={!isValid()} className={styles.bookNowBtn} onClick={_onSubmit}>\n {t(Translation.Misc.BookNow)}\n </BEButton>\n );\n\n return (\n <>\n <div\n className={classNames(\n styles.content,\n styles[`--${bwContext.layout}`],\n {\n [styles['--vertical']]: bwContext.layout === 'button',\n [styles.inline]: bwContext.type === 'inline',\n },\n classname\n )}\n >\n <>\n <div className={styles.item}>\n <label className={styles.label}>{t(Translation.Misc.ChooseHotel)}</label>\n <BookingWizardHotelSelector\n onChange={(value) => setSelectedProperty(value \|\| undefined)}\n properties={properties}\n selectedProperty={selectedProperty}\n contentClassName={classname}\n />\n </div>\n <div className={styles.divider} />\n </>\n <BookingWizardDateSelector\n onChange={setDate}\n defaultStartDate={defaultValues?.checkIn ? dayjs(defaultValues?.checkIn) : undefined}\n defaultEndDate={defaultValues?.checkout ? dayjs(defaultValues?.checkout) : undefined}\n />\n\n <div className={styles.divider} />\n <div className={styles.item}>\n <label className={styles.label}>{t(Translation.Misc.Guests)}</label>\n <BookingWizardGuestSelector\n defaultValue={{\n adults,\n children,\n room,\n }}\n onChange={setGuest}\n disableChild={disableChild}\n disableRoom={disableRoom}\n />\n </div>\n <div className={styles.divider} />\n {bwContext.layout === 'horizontal-condensed' ? null : (\n <div className={styles.item}>\n <label className={styles.label}>Promocode</label>\n <BookingWizardPromoCode promoCode={promoCode} onChange={_onPromoCodeChange} valid={promoCodeValid} />\n </div>\n )}\n {!(bwContext.layout === 'horizontal-condensed') ? <div className={styles.action}>{submitButton}</div> : null}\n </div>\n\n {bwContext.layout === 'horizontal-condensed' ? (\n <div className={classNames(styles.content, classname)}>\n <div className={classNames(styles.action, styles.centerItems, 'u-marg-top u-marg-top--light@l-')}>{submitButton}</div>\n </div>\n ) : null}\n </>\n );\n};\n"]}

package/dist/src/components/generic/Overlay/Overlay.js CHANGED Viewed

@@ -33,6 +33,7 @@ const react_1 = __importStar(require("react"));
 const react_popper_1 = require("react-popper");
 const Fade_1 = __importDefault(require("../../../animations/Fade"));
 const Portal_1 = require("../Portal/Portal");
+const RoomstayThemeEngine_1 = __importDefault(require("../../../providers/RoomstayThemeEngine"));
 const Overlay_module_scss_1 = __importDefault(require("./Overlay.module.scss"));
 const Overlay = (props) => {
     var _a, _b, _c;
@@ -131,7 +132,7 @@ const Overlay = (props) => {
     }
     if (props.usePortal || props.container) {
         // PreventZIndex is only enabled if container is not specified, since modal will be appended to body, Roomstay engine by default will overlay it
-        return (react_1.default.createElement(Portal_1.RoomstayPortal, { target: props.container || document.body, preventZIndex: !!props.container }, overlayElement));
+        return (react_1.default.createElement(Portal_1.RoomstayPortal, { target: props.container || RoomstayThemeEngine_1.default.EngineContainer, preventZIndex: !!props.container }, overlayElement));
     }
     return overlayElement;
 };

package/dist/src/components/generic/Overlay/Overlay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Overlay.js","sourceRoot":"/","sources":["src/components/generic/Overlay/Overlay.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+C;AAE/C,4DAAoC;AACpC,+CAA0F;AAC1F,+CAAmD;AAEnD,6DAA8C;AAC9C,+DAAoE;~~AAEpE~~,gFAA2C;AA0BpC,MAAM,OAAO,GAAG,CAAC,KAAmB,EAAE,EAAE;;IAC3C,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,IAAA,gBAAQ,EAAiB,IAAI,CAAC,CAAC;IAC/E,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAqB,IAAI,CAAC,CAAC;IAE7E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAEjD,MAAM,EAAE,iBAAiB,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE7C,8EAA8E;IAC9E,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,OAAuB,CAAC;QAC5B,IAAI,SAAS,GAAG,KAAK,CAAC;QAEtB,IAAI,KAAK,CAAC,IAAI,EAAE;YACZ,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;SACzB;aAAM;YACH,8DAA8D;YAC9D,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBACtB,IAAI,CAAC,SAAS,EAAE;oBACZ,SAAS,CAAC,KAAK,CAAC,CAAC;iBACpB;YACL,CAAC,EAAE,GAAG,CAAC,CAAC;SACX;QAED,OAAO,GAAG,EAAE;YACR,SAAS,GAAG,IAAI,CAAC;YACjB,YAAY,CAAC,OAAO,CAAC,CAAC;QAC1B,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;IAEjB,IAAA,uBAAe,EAAC,GAAG,EAAE;QACjB,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,CAAC,CAAC,CAAQ,EAAE,EAAE;;YAC9C,IAAI,MAAM,EAAE;gBACR,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,MAAA,KAAK,CAAC,OAAO,sDAAG,CAAC,CAAC,CAAC;aACtB;QACL,CAAC,EAAE,aAA+B,CAAC,CAAC;QAEpC,OAAO,GAAG,EAAE;YACR,MAAM,EAAE,CAAC;QACb,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC;IAE5B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,KAAK,CAAC,QAAQ,KAAK,OAAO,IAAI,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,aAAa,EAAE;YACjE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;SACzD;QACD,OAAO,GAAG,EAAE;YACR,IAAI,KAAK,CAAC,QAAQ,KAAK,OAAO,IAAI,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,aAAa,EAAE;gBACjE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;aAClD;QACL,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEtD,MAAM,SAAS,GAAoB;QAC/B;YACI,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE;gBACL,cAAc,EAAE,KAAK;gBACrB,kBAAkB,EAAE,KAAK,CAAC,kBAAkB;aAC/C;SACJ;QACD;YACI,IAAI,EAAE,iBAAiB;YACvB,OAAO,EAAE,IAAI;YACb,OAAO,EAAE;gBACL,OAAO,EAAE,KAAK;gBACd,WAAW,EAAE,KAAK;gBAClB,MAAM,EAAE,KAAK;gBACb,YAAY,EAAE,MAAM;gBACpB,OAAO,EAAE,CAAC;aACb;SACJ;KACJ,CAAC;IACF,IAAI,KAAK,CAAC,MAAM,EAAE;QACd,SAAS,CAAC,IAAI,CAAC;YACX,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE;gBACL,MAAM,EAAE,KAAK,CAAC,MAAM;aACvB;SACJ,CAAC,CAAC;KACN;IAED,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,GAAG,IAAA,wBAAS,EAAC,MAAA,KAAK,CAAC,aAAa,mCAAI,gBAAgB,EAAE,aAAa,EAAE;QAC3G,SAAS,EAAE,MAAA,KAAK,CAAC,SAAS,mCAAI,QAAQ;QACtC,QAAQ,EAAE,MAAA,KAAK,CAAC,QAAQ,mCAAI,UAAU;QACtC,SAAS;KACZ,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,IAAA,oBAAU,EAAC,KAAK,CAAC,SAAS,EAAE;QAC/C,CAAC,6BAAM,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,UAAU;KAC5C,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG;IACnB,mHAAmH;IAEnH;QACK,CAAC,KAAK,CAAC,aAAa,IAAI,wCAAM,GAAG,EAAE,mBAAmB,GAAS;QAEhE,qDACI,GAAG,EAAE,gBAAgB,EACrB,KAAK,EAAE,YAAY,CAAC,MAAM,IACtB,UAAU,CAAC,MAAM,IACrB,SAAS,EAAE,IAAA,oBAAU,EAAC,6BAAM,CAAC,qBAAqB,CAAC,EAAE,KAAK,CAAC,kBAAkB,EAAE,EAAE,CAAC,6BAAM,CAAC,aAAa,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,CAAC;YAE7H,8BAAC,cAAa,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI;gBAC3B,uCAAK,GAAG,EAAE,KAAK,CAAC,UAAU,EAAE,SAAS,EAAE,cAAc,IAChD,KAAK,CAAC,QAAQ,CACb,CACM,CACd,CACP,CACN,CAAC;IAEF,IAAI,CAAC,MAAM,EAAE;QACT,OAAO,6DAAK,CAAC;KAChB;IAED,IAAI,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,SAAS,EAAE;QACpC,gJAAgJ;QAChJ,OAAO,CACH,8BAAC,uBAAc,IAAC,MAAM,EAAE,KAAK,CAAC,SAAS,IAAI,~~QAAQ~~,CAAC,~~IAAI~~,EAAE,aAAa,EAAE,CAAC,CAAC,KAAK,CAAC,SAAS,~~IACrF~~,cAAc,CACF,CACpB,CAAC;KACL;IAED,OAAO,cAAc,CAAC;AAC1B,CAAC,CAAC;AAjIW,QAAA,OAAO,WAiIlB","sourcesContent":["import { useBodyClick } from '@frontend/hooks';\nimport { Placement, PositioningStrategy } from '@popperjs/core';\nimport classNames from 'classnames';\nimport React, { LegacyRef, ReactNode, useEffect, useLayoutEffect, useState } from 'react';\nimport { Modifier, usePopper } from 'react-popper';\n\nimport FadeAnimation from '@/animations/Fade';\nimport { RoomstayPortal } from '@/components/generic/Portal/Portal';\n\nimport styles from './Overlay.module.scss';\n\nexport type OverlayProps = {\n children: ReactNode \| ReactNode[];\n open: boolean;\n\n usePortal?: boolean;\n container?: HTMLElement \| null;\n\n followElement?: Element \| null;\n className?: string;\n containerClassName?: string;\n\n hideStyles?: boolean;\n\n placement?: Placement;\n fallbackPlacements?: Placement;\n strategy?: PositioningStrategy;\n\n onClose?: (e: Event) => void;\n offset?: [number, number];\n overlayRef?: LegacyRef<HTMLDivElement>;\n preventScroll?: boolean;\n isAboveNav?: boolean;\n};\n\nexport const Overlay = (props: OverlayProps) => {\n const [referenceElement, setReferenceElement] = useState<Element \| null>(null);\n const [popperElement, setPopperElement] = useState<HTMLElement \| null>(null);\n\n const [isOpen, setIsOpen] = useState(props.open);\n\n const { onBodyClickExcept } = useBodyClick();\n\n // Used to prevent premature closing of window before it gets a chance to open\n useEffect(() => {\n let timeout: NodeJS.Timeout;\n let cancelled = false;\n\n if (props.open) {\n setIsOpen(props.open);\n } else {\n // Allow for fade out animation to run before removing element\n timeout = setTimeout(() => {\n if (!cancelled) {\n setIsOpen(false);\n }\n }, 500);\n }\n\n return () => {\n cancelled = true;\n clearTimeout(timeout);\n };\n }, [props.open]);\n\n useLayoutEffect(() => {\n const { remove } = onBodyClickExcept((e: Event) => {\n if (isOpen) {\n e.preventDefault();\n e.stopPropagation();\n props.onClose?.(e);\n }\n }, popperElement as HTMLDivElement);\n\n return () => {\n remove();\n };\n }, [isOpen, popperElement]);\n\n useEffect(() => {\n if (props.strategy === 'fixed' && props.open && props.preventScroll) {\n document.body.style.setProperty('overflow', 'hidden');\n }\n return () => {\n if (props.strategy === 'fixed' && props.open && props.preventScroll) {\n document.body.style.removeProperty('overflow');\n }\n };\n }, [props.open, props.preventScroll, props.strategy]);\n\n const modifiers: Modifier<any>[] = [\n {\n name: 'flip',\n options: {\n flipVariations: false,\n fallbackPlacements: props.fallbackPlacements,\n },\n },\n {\n name: 'preventOverflow',\n enabled: true,\n options: {\n altAxis: false,\n altBoundary: false,\n tether: false,\n rootBoundary: 'body',\n padding: 8,\n },\n },\n ];\n if (props.offset) {\n modifiers.push({\n name: 'offset',\n options: {\n offset: props.offset,\n },\n });\n }\n\n const { styles: popperStyles, attributes } = usePopper(props.followElement ?? referenceElement, popperElement, {\n placement: props.placement ?? 'bottom',\n strategy: props.strategy ?? 'absolute',\n modifiers,\n });\n\n const overlayClasses = classNames(props.className, {\n [styles['rs-overlay']]: !props.hideStyles,\n });\n\n const overlayElement = (\n // Here we depend on the props.open as that's the \"intended\" state. Fade animation will handle it going in and out.\n\n <>\n {!props.followElement && <span ref={setReferenceElement}></span>}\n\n <div\n ref={setPopperElement}\n style={popperStyles.popper}\n {...attributes.popper}\n className={classNames(styles['rs-popper-container'], props.containerClassName, { [styles['--above-nav']]: props.isAboveNav })}\n >\n <FadeAnimation open={props.open}>\n <div ref={props.overlayRef} className={overlayClasses}>\n {props.children}\n </div>\n </FadeAnimation>\n </div>\n </>\n );\n\n if (!isOpen) {\n return <></>;\n }\n\n if (props.usePortal \|\| props.container) {\n // PreventZIndex is only enabled if container is not specified, since modal will be appended to body, Roomstay engine by default will overlay it\n return (\n <RoomstayPortal target={props.container \|\| ~~document~~.~~body~~} preventZIndex={!!props.container}>\n {overlayElement}\n </RoomstayPortal>\n );\n }\n\n return overlayElement;\n};\n"]}
1	+ {"version":3,"file":"Overlay.js","sourceRoot":"/","sources":["src/components/generic/Overlay/Overlay.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useBodyClick } from '@frontend/hooks';\nimport { Placement, PositioningStrategy } from '@popperjs/core';\nimport classNames from 'classnames';\nimport React, { LegacyRef, ReactNode, useEffect, useLayoutEffect, useState } from 'react';\nimport { Modifier, usePopper } from 'react-popper';\n\nimport FadeAnimation from '@/animations/Fade';\nimport { RoomstayPortal } from '@/components/generic/Portal/Portal';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\n\nimport styles from './Overlay.module.scss';\n\nexport type OverlayProps = {\n children: ReactNode \| ReactNode[];\n open: boolean;\n\n usePortal?: boolean;\n container?: HTMLElement \| null;\n\n followElement?: Element \| null;\n className?: string;\n containerClassName?: string;\n\n hideStyles?: boolean;\n\n placement?: Placement;\n fallbackPlacements?: Placement;\n strategy?: PositioningStrategy;\n\n onClose?: (e: Event) => void;\n offset?: [number, number];\n overlayRef?: LegacyRef<HTMLDivElement>;\n preventScroll?: boolean;\n isAboveNav?: boolean;\n};\n\nexport const Overlay = (props: OverlayProps) => {\n const [referenceElement, setReferenceElement] = useState<Element \| null>(null);\n const [popperElement, setPopperElement] = useState<HTMLElement \| null>(null);\n\n const [isOpen, setIsOpen] = useState(props.open);\n\n const { onBodyClickExcept } = useBodyClick();\n\n // Used to prevent premature closing of window before it gets a chance to open\n useEffect(() => {\n let timeout: NodeJS.Timeout;\n let cancelled = false;\n\n if (props.open) {\n setIsOpen(props.open);\n } else {\n // Allow for fade out animation to run before removing element\n timeout = setTimeout(() => {\n if (!cancelled) {\n setIsOpen(false);\n }\n }, 500);\n }\n\n return () => {\n cancelled = true;\n clearTimeout(timeout);\n };\n }, [props.open]);\n\n useLayoutEffect(() => {\n const { remove } = onBodyClickExcept((e: Event) => {\n if (isOpen) {\n e.preventDefault();\n e.stopPropagation();\n props.onClose?.(e);\n }\n }, popperElement as HTMLDivElement);\n\n return () => {\n remove();\n };\n }, [isOpen, popperElement]);\n\n useEffect(() => {\n if (props.strategy === 'fixed' && props.open && props.preventScroll) {\n document.body.style.setProperty('overflow', 'hidden');\n }\n return () => {\n if (props.strategy === 'fixed' && props.open && props.preventScroll) {\n document.body.style.removeProperty('overflow');\n }\n };\n }, [props.open, props.preventScroll, props.strategy]);\n\n const modifiers: Modifier<any>[] = [\n {\n name: 'flip',\n options: {\n flipVariations: false,\n fallbackPlacements: props.fallbackPlacements,\n },\n },\n {\n name: 'preventOverflow',\n enabled: true,\n options: {\n altAxis: false,\n altBoundary: false,\n tether: false,\n rootBoundary: 'body',\n padding: 8,\n },\n },\n ];\n if (props.offset) {\n modifiers.push({\n name: 'offset',\n options: {\n offset: props.offset,\n },\n });\n }\n\n const { styles: popperStyles, attributes } = usePopper(props.followElement ?? referenceElement, popperElement, {\n placement: props.placement ?? 'bottom',\n strategy: props.strategy ?? 'absolute',\n modifiers,\n });\n\n const overlayClasses = classNames(props.className, {\n [styles['rs-overlay']]: !props.hideStyles,\n });\n\n const overlayElement = (\n // Here we depend on the props.open as that's the \"intended\" state. Fade animation will handle it going in and out.\n\n <>\n {!props.followElement && <span ref={setReferenceElement}></span>}\n\n <div\n ref={setPopperElement}\n style={popperStyles.popper}\n {...attributes.popper}\n className={classNames(styles['rs-popper-container'], props.containerClassName, { [styles['--above-nav']]: props.isAboveNav })}\n >\n <FadeAnimation open={props.open}>\n <div ref={props.overlayRef} className={overlayClasses}>\n {props.children}\n </div>\n </FadeAnimation>\n </div>\n </>\n );\n\n if (!isOpen) {\n return <></>;\n }\n\n if (props.usePortal \|\| props.container) {\n // PreventZIndex is only enabled if container is not specified, since modal will be appended to body, Roomstay engine by default will overlay it\n return (\n <RoomstayPortal target={props.container \|\| RoomstayThemeEngine.EngineContainer} preventZIndex={!!props.container}>\n {overlayElement}\n </RoomstayPortal>\n );\n }\n\n return overlayElement;\n};\n"]}

package/dist/src/components/generic/Select/Select.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import './Select.global.scss';
+import './Select.engine.scss';
 import React, { ReactElement, Ref } from 'react';
 import { OverlayProps } from '../Overlay/Overlay';
 import { Color } from '../../../util/Color';

package/dist/src/components/generic/Select/Select.js CHANGED Viewed

@@ -27,7 +27,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Select = exports.InnerSelect = void 0;
-require("./Select.global.scss");
+require("./Select.engine.scss");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importStar(require("react"));
 const Overlay_1 = require("../Overlay/Overlay");

package/dist/src/components/generic/Select/Select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.js","sourceRoot":"/","sources":["src/components/generic/Select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["import './Select.global.scss';\n\nimport classNames from 'classnames';\nimport React, { forwardRef, ReactElement, ReactNode, Ref, useImperativeHandle, useMemo, useRef } from 'react';\n\nimport { Overlay, OverlayProps } from '@/components/generic/Overlay/Overlay';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { useCombinedState } from '@/hooks/CombineState';\nimport { useKeyboardControlOnSelect } from '@/hooks/KeyboardControlOnSelect';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport { Color } from '@/util/Color';\n\nimport Icon, { IconType } from '../Icon/Icon';\n\nexport type Option<KeyName extends string> = {\n [keyName in KeyName]: string;\n} & Record<any, any> & { options?: Option<KeyName>[] };\n\nexport type TOptionGroup<T> = {\n name: string;\n options: T[];\n};\n\nexport type TSelectOptionKey<T> = TOptionGroup<T> \| T;\n\nexport type SelectProps<TOption extends Option<KeyName>, KeyName extends string> = {\n options: TSelectOptionKey<TOption>[];\n keyName: KeyName;\n\n value?: TOption[KeyName];\n labelName?: TOption[keyof TOption];\n target?: HTMLElement \| null;\n open?: boolean;\n onClose?: (e: Event) => void;\n onChange?: (value: TOption[KeyName]) => void;\n className?: string;\n offset?: [number, number];\n renderOption?: (option?: TOption) => ReactElement \| null;\n renderLabel?: (option?: TOption \| null) => ReactElement \| null;\n nativeOnMobile?: boolean;\n overlay?: Partial<Omit<OverlayProps, 'children' \| 'open' \| 'container' \| 'followElement' \| 'onClose' \| 'overlayRef'>>;\n hideExpandIcon?: boolean;\n\n inputLabelColor?: Color;\n};\n\nconst MOBILE_BREAKPOINT = 992;\n\nexport const InnerSelect = <TOption extends Option<KeyName>, KeyName extends string>(\n {\n target,\n open,\n onClose,\n options = [],\n value,\n onChange,\n keyName,\n labelName,\n className,\n offset,\n renderOption,\n nativeOnMobile = false,\n overlay,\n renderLabel,\n hideExpandIcon,\n inputLabelColor,\n }: SelectProps<TOption, KeyName>,\n ref: Ref<HTMLDivElement \| null>\n) => {\n const { width } = useWindowSize();\n const targetRef = useRef<HTMLSpanElement>(null);\n const optionRefs = useRef<{ [id: string]: HTMLDivElement \| null }>({});\n const optionContainerRef = useRef<HTMLDivElement \| null>(null);\n const [_open, _setIsOpen] = useCombinedState<boolean>(open, false);\n const flattenOptions = useMemo<TOption[]>(() => {\n return options.reduce<TOption[]>((result, optionGroupProbably) => {\n if (optionGroupProbably.options) return result.concat(optionGroupProbably.options);\n return result.concat(optionGroupProbably as TOption);\n }, []);\n }, [options]);\n\n // TODO: Force to fix later\n nativeOnMobile = false;\n\n const _onClose = (e: Event): void => {\n _setIsOpen(false);\n onClose?.(e);\n };\n\n const overlayRef = useRef<HTMLDivElement \| null>(null);\n useImperativeHandle<HTMLDivElement \| null, HTMLDivElement \| null>(ref, () => overlayRef.current);\n\n const _onSelected = (value: TOption[KeyName]) => {\n onChange?.(value);\n _setIsOpen(false);\n };\n\n const _getOption = (value?: TOption[KeyName]): TOption \| undefined => {\n for (const option of options) {\n if (option.options && Array.isArray(option.options)) {\n for (const childOption of option.options) {\n if (childOption[keyName] === value) {\n return childOption;\n }\n }\n } else {\n // If we're in here it means that this option doesn't have children and is in fact an individual group\n if ((option as TOption)[keyName] === value) {\n return option as TOption;\n }\n }\n }\n };\n\n const { selectingItem, onItemMouseMove, onItemMouseLeave, onItemMouseEnter } = useKeyboardControlOnSelect<TOption, KeyName>({\n onSelected: (item) => _onSelected(item[keyName]),\n isEnabled: !!_open,\n options,\n idName: keyName,\n overlayRef: overlayRef.current,\n defaultOption: _getOption(value),\n optionRefs,\n optionContainerRef,\n });\n\n const _getStringLabel = (value?: TOption[KeyName]): string => {\n const option = _getOption(value);\n return option?.[labelName] \|\| value \|\| '';\n };\n\n const _getLabel = (value?: TOption[KeyName]): string \| ReactNode => {\n const option = _getOption(value);\n\n if (renderLabel) {\n return renderLabel(option);\n }\n\n return _getStringLabel(value);\n };\n\n const _renderOptions = (options?: TSelectOptionKey<TOption>[]): ReactElement \| JSX.Element[] \| null => {\n if (!options) return null;\n return options.map((option, index) => {\n const isGroup = option.options;\n\n if (isGroup) {\n return _renderGroup(option.name, option.options);\n }\n\n return _renderOption({ option: option as TOption, key: index });\n });\n };\n\n const _renderGroup = (name: string, options?: TSelectOptionKey<TOption>[]) => {\n return (\n <>\n <div className=\"rs-select--suggest-list-item --group-title\">\n <Text type={TextType.Small} color={Color.DarkGrey}>\n {name}\n </Text>\n </div>\n {_renderOptions(options)}\n </>\n );\n };\n\n const _renderOption = ({ option, key }: { option: TOption; key: any }) => {\n const isSelected = option[keyName] === value;\n const isSelecting = option[keyName] === selectingItem?.[keyName];\n\n return (\n <div\n ref={(ref) => (optionRefs.current[option[keyName]] = ref)}\n key={key}\n className={classNames('rs-select--suggest-list-item', { '--selected': isSelected \|\| isSelecting })}\n onClick={() => _onSelected(option[keyName])}\n onMouseEnter={() => {\n onItemMouseEnter(option);\n }}\n onMouseLeave={() => onItemMouseLeave()}\n onMouseMove={() => onItemMouseMove()}\n >\n <Text type={TextType.Small} className=\"rs-select--suggest-list-option-name\">\n {renderOption ? renderOption(option) : labelName ? option[labelName] : ''}\n </Text>\n {isSelected && (\n <span className=\"rs-select--suggest-list-option-icon\">\n <Icon icon={IconType.Check} />\n </span>\n )}\n </div>\n );\n };\n\n const native = width && width < MOBILE_BREAKPOINT && nativeOnMobile;\n\n const labelProps: any = {};\n\n if (inputLabelColor) {\n labelProps.style = { color: inputLabelColor };\n }\n\n return (\n <>\n {(native \|\| !target) && (\n <span className={classNames('be-select', className)} onClick={() => _setIsOpen(true)} ref={targetRef} {...labelProps}>\n {native ? (\n <select value={value} onChange={(e) => onChange?.(e.target.value as TOption[KeyName])}>\n {flattenOptions.map((item) => {\n return <option value={value} key={item[keyName]} label={_getStringLabel(item[keyName])}></option>;\n })}\n </select>\n ) : (\n _getLabel(value)\n )}\n {hideExpandIcon ? null : <Icon icon={IconType.Dropdown} color={Color.DarkGrey} />}\n </span>\n )}\n {!native && (\n <Overlay\n offset={offset}\n usePortal={overlay?.usePortal ?? true}\n followElement={target \|\| targetRef.current \|\| undefined}\n placement={overlay?.placement ?? 'bottom-start'}\n strategy={overlay?.strategy}\n open={open === undefined ? !!_open : open}\n onClose={_onClose}\n containerClassName={overlay?.containerClassName}\n overlayRef={overlayRef}\n hideStyles={overlay?.hideStyles}\n >\n <div ref={optionContainerRef} className={classNames('rs-select--suggest-list', overlay?.className)}>\n {_renderOptions(options)}\n </div>\n </Overlay>\n )}\n </>\n );\n};\n\nexport const Select = forwardRef(InnerSelect) as <TOption extends Option<KeyName>, KeyName extends string>(\n p: SelectProps<TOption, KeyName> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n\nexport interface IDefaultSelectOption {\n value: string;\n text: string;\n}\n"]}
1	+ {"version":3,"file":"Select.js","sourceRoot":"/","sources":["src/components/generic/Select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["import './Select.engine.scss';\n\nimport classNames from 'classnames';\nimport React, { forwardRef, ReactElement, ReactNode, Ref, useImperativeHandle, useMemo, useRef } from 'react';\n\nimport { Overlay, OverlayProps } from '@/components/generic/Overlay/Overlay';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { useCombinedState } from '@/hooks/CombineState';\nimport { useKeyboardControlOnSelect } from '@/hooks/KeyboardControlOnSelect';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport { Color } from '@/util/Color';\n\nimport Icon, { IconType } from '../Icon/Icon';\n\nexport type Option<KeyName extends string> = {\n [keyName in KeyName]: string;\n} & Record<any, any> & { options?: Option<KeyName>[] };\n\nexport type TOptionGroup<T> = {\n name: string;\n options: T[];\n};\n\nexport type TSelectOptionKey<T> = TOptionGroup<T> \| T;\n\nexport type SelectProps<TOption extends Option<KeyName>, KeyName extends string> = {\n options: TSelectOptionKey<TOption>[];\n keyName: KeyName;\n\n value?: TOption[KeyName];\n labelName?: TOption[keyof TOption];\n target?: HTMLElement \| null;\n open?: boolean;\n onClose?: (e: Event) => void;\n onChange?: (value: TOption[KeyName]) => void;\n className?: string;\n offset?: [number, number];\n renderOption?: (option?: TOption) => ReactElement \| null;\n renderLabel?: (option?: TOption \| null) => ReactElement \| null;\n nativeOnMobile?: boolean;\n overlay?: Partial<Omit<OverlayProps, 'children' \| 'open' \| 'container' \| 'followElement' \| 'onClose' \| 'overlayRef'>>;\n hideExpandIcon?: boolean;\n\n inputLabelColor?: Color;\n};\n\nconst MOBILE_BREAKPOINT = 992;\n\nexport const InnerSelect = <TOption extends Option<KeyName>, KeyName extends string>(\n {\n target,\n open,\n onClose,\n options = [],\n value,\n onChange,\n keyName,\n labelName,\n className,\n offset,\n renderOption,\n nativeOnMobile = false,\n overlay,\n renderLabel,\n hideExpandIcon,\n inputLabelColor,\n }: SelectProps<TOption, KeyName>,\n ref: Ref<HTMLDivElement \| null>\n) => {\n const { width } = useWindowSize();\n const targetRef = useRef<HTMLSpanElement>(null);\n const optionRefs = useRef<{ [id: string]: HTMLDivElement \| null }>({});\n const optionContainerRef = useRef<HTMLDivElement \| null>(null);\n const [_open, _setIsOpen] = useCombinedState<boolean>(open, false);\n const flattenOptions = useMemo<TOption[]>(() => {\n return options.reduce<TOption[]>((result, optionGroupProbably) => {\n if (optionGroupProbably.options) return result.concat(optionGroupProbably.options);\n return result.concat(optionGroupProbably as TOption);\n }, []);\n }, [options]);\n\n // TODO: Force to fix later\n nativeOnMobile = false;\n\n const _onClose = (e: Event): void => {\n _setIsOpen(false);\n onClose?.(e);\n };\n\n const overlayRef = useRef<HTMLDivElement \| null>(null);\n useImperativeHandle<HTMLDivElement \| null, HTMLDivElement \| null>(ref, () => overlayRef.current);\n\n const _onSelected = (value: TOption[KeyName]) => {\n onChange?.(value);\n _setIsOpen(false);\n };\n\n const _getOption = (value?: TOption[KeyName]): TOption \| undefined => {\n for (const option of options) {\n if (option.options && Array.isArray(option.options)) {\n for (const childOption of option.options) {\n if (childOption[keyName] === value) {\n return childOption;\n }\n }\n } else {\n // If we're in here it means that this option doesn't have children and is in fact an individual group\n if ((option as TOption)[keyName] === value) {\n return option as TOption;\n }\n }\n }\n };\n\n const { selectingItem, onItemMouseMove, onItemMouseLeave, onItemMouseEnter } = useKeyboardControlOnSelect<TOption, KeyName>({\n onSelected: (item) => _onSelected(item[keyName]),\n isEnabled: !!_open,\n options,\n idName: keyName,\n overlayRef: overlayRef.current,\n defaultOption: _getOption(value),\n optionRefs,\n optionContainerRef,\n });\n\n const _getStringLabel = (value?: TOption[KeyName]): string => {\n const option = _getOption(value);\n return option?.[labelName] \|\| value \|\| '';\n };\n\n const _getLabel = (value?: TOption[KeyName]): string \| ReactNode => {\n const option = _getOption(value);\n\n if (renderLabel) {\n return renderLabel(option);\n }\n\n return _getStringLabel(value);\n };\n\n const _renderOptions = (options?: TSelectOptionKey<TOption>[]): ReactElement \| JSX.Element[] \| null => {\n if (!options) return null;\n return options.map((option, index) => {\n const isGroup = option.options;\n\n if (isGroup) {\n return _renderGroup(option.name, option.options);\n }\n\n return _renderOption({ option: option as TOption, key: index });\n });\n };\n\n const _renderGroup = (name: string, options?: TSelectOptionKey<TOption>[]) => {\n return (\n <>\n <div className=\"rs-select--suggest-list-item --group-title\">\n <Text type={TextType.Small} color={Color.DarkGrey}>\n {name}\n </Text>\n </div>\n {_renderOptions(options)}\n </>\n );\n };\n\n const _renderOption = ({ option, key }: { option: TOption; key: any }) => {\n const isSelected = option[keyName] === value;\n const isSelecting = option[keyName] === selectingItem?.[keyName];\n\n return (\n <div\n ref={(ref) => (optionRefs.current[option[keyName]] = ref)}\n key={key}\n className={classNames('rs-select--suggest-list-item', { '--selected': isSelected \|\| isSelecting })}\n onClick={() => _onSelected(option[keyName])}\n onMouseEnter={() => {\n onItemMouseEnter(option);\n }}\n onMouseLeave={() => onItemMouseLeave()}\n onMouseMove={() => onItemMouseMove()}\n >\n <Text type={TextType.Small} className=\"rs-select--suggest-list-option-name\">\n {renderOption ? renderOption(option) : labelName ? option[labelName] : ''}\n </Text>\n {isSelected && (\n <span className=\"rs-select--suggest-list-option-icon\">\n <Icon icon={IconType.Check} />\n </span>\n )}\n </div>\n );\n };\n\n const native = width && width < MOBILE_BREAKPOINT && nativeOnMobile;\n\n const labelProps: any = {};\n\n if (inputLabelColor) {\n labelProps.style = { color: inputLabelColor };\n }\n\n return (\n <>\n {(native \|\| !target) && (\n <span className={classNames('be-select', className)} onClick={() => _setIsOpen(true)} ref={targetRef} {...labelProps}>\n {native ? (\n <select value={value} onChange={(e) => onChange?.(e.target.value as TOption[KeyName])}>\n {flattenOptions.map((item) => {\n return <option value={value} key={item[keyName]} label={_getStringLabel(item[keyName])}></option>;\n })}\n </select>\n ) : (\n _getLabel(value)\n )}\n {hideExpandIcon ? null : <Icon icon={IconType.Dropdown} color={Color.DarkGrey} />}\n </span>\n )}\n {!native && (\n <Overlay\n offset={offset}\n usePortal={overlay?.usePortal ?? true}\n followElement={target \|\| targetRef.current \|\| undefined}\n placement={overlay?.placement ?? 'bottom-start'}\n strategy={overlay?.strategy}\n open={open === undefined ? !!_open : open}\n onClose={_onClose}\n containerClassName={overlay?.containerClassName}\n overlayRef={overlayRef}\n hideStyles={overlay?.hideStyles}\n >\n <div ref={optionContainerRef} className={classNames('rs-select--suggest-list', overlay?.className)}>\n {_renderOptions(options)}\n </div>\n </Overlay>\n )}\n </>\n );\n};\n\nexport const Select = forwardRef(InnerSelect) as <TOption extends Option<KeyName>, KeyName extends string>(\n p: SelectProps<TOption, KeyName> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n\nexport interface IDefaultSelectOption {\n value: string;\n text: string;\n}\n"]}

package/dist/src/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import './EnhancedPhoneNumberField.global.scss';
+import './EnhancedPhoneNumberField.engine.scss';
 import React, { ChangeEvent, PropsWithChildren } from 'react';
 export interface EnhancedPhoneNumberField extends PropsWithChildren<any> {
     validationStatus?: 'success' | 'error';

package/dist/src/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField.js CHANGED Viewed

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-require("./EnhancedPhoneNumberField.global.scss");
+require("./EnhancedPhoneNumberField.engine.scss");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importStar(require("react"));
 const react_i18next_1 = require("react-i18next");

package/dist/src/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EnhancedPhoneNumberField.js","sourceRoot":"/","sources":["src/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAAgD;AAEhD,4DAAoC;AACpC,+CAAwI;AACxI,iDAA+C;AAC/C,0DAAuD;AAEvD,uEAAgE;AAChE,iEAAiE;AACjE,4EAAiH;AAEjH,gDAA6C;AAU7C,MAAM,sBAAsB,GAAG,GAAG,CAAC;AAEnC,MAAM,wBAAwB,GAAyE,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAClH,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IAChD,IAAA,2BAAmB,EAAmD,GAAG,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;IACnG,MAAM,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,IAAA,wCAAoB,EAAC;QAC3G,GAAG,EAAE,QAAQ,CAAC,OAAO;QACrB,0BAA0B,EAAE,IAAI;KACnC,CAAC,CAAC;IAEH,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,kBAAkB,GAAkB,IAAA,eAAO,EAAC,GAAG,EAAE;QACnD,OAAO,gDAAuB,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACzC,OAAO,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC;QAC9G,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,gDAAuB,CAAC,CAAC,CAAC;IAE9B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAwB,IAAI,CAAC,CAAC;IAExE,MAAM,EAAE,gBAAgB,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAE1D,MAAM,CAAC,eAAe,EAAE,cAAc,CAAC,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;;QACnD,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,sBAAsB,CAAC,mCAAI,EAAE,CAAC;QAEpE,IAAI,MAAM,EAAE;YACR,MAAM,eAAe,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,MAAM,KAAK,KAAK,CAAC,IAAI,kBAAkB,CAAC,CAAC,CAAC,CAAC;YAC1G,OAAO,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;SACpC;QAED,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IACvC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,SAAS,GAAG,CAAC,GAAwB,EAAe,EAAE;QACxD,OAAO,kBAAkB,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,IAAI,KAAK,GAAG,CAAgB,CAAC;IAC9E,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,MAAoB,EAAE,MAAe,EAAE,EAAE;;QACjE,IAAI,SAAS,GAAG,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,cAAc,CAAC;QAEzC,IAAI,SAAS,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE;YAC3B,SAAS,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;SACtC;QAED,MAAM,QAAQ,GAAG,GAAG,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,mCAAI,eAAe,CAAC,KAAK,GAAG,sBAAsB,GAAG,SAAS,EAAE,CAAC;QAElG,IAAI,KAAK,IAAI,QAAQ,EAAE;YACnB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAS,CAAC,CAAC;SAC5D;IACL,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,CAAgC,EAAE,EAAE;QACxD,MAAM,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAC7B,kBAAkB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;IACzC,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,eAA4B,EAAE,EAAE;QACrD,cAAc,EAAE,CAAC;QACjB,kBAAkB,CAAC,eAAe,EAAE,SAAS,CAAC,CAAC;IACnD,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,IAAA,oBAAU,EAAC,yBAAyB,EAAE;QACvD,CAAC,KAAK,gBAAgB,EAAE,CAAC,EAAE,CAAC,CAAC,gBAAgB;QAC7C,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,KAAK,CAAC,QAAQ;KAC/B,CAAC,CAAC;IACH,MAAM,cAAc,GAAG,CAAC,OAAoB,EAAE,EAAE;QAC5C,eAAe,CAAC,OAAO,CAAC,CAAC;QACzB,OAAO;IACX,CAAC,CAAC;IAEF,OAAO,CACH,uCAAK,SAAS,EAAE,YAAY;QACxB,uCAAK,SAAS,EAAC,kCAAkC,EAAC,OAAO,EAAE,gBAAgB;YACvE,uCAAK,SAAS,EAAC,uCAAuC,IAAE,IAAA,iDAAwB,EAAC,eAAe,CAAC,IAAI,CAAC,CAAO;YAC7G,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,QAAQ,GAAI,CAC/B;QACN,uCAAK,SAAS,EAAC,iCAAiC;YAC5C,wCAAM,SAAS,EAAC,wCAAwC;;gBAAG,eAAe,CAAC,KAAK,CAAQ;YACxF,yCACI,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,GAAG,EAAE,QAAQ,EACb,WAAW,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,IAAI,EACjE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,EAAE,WAAW,EAAE,eAAe,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,GAAG,EAAE,GAAG,IAAI,EAAE,EACpE,QAAQ,EAAE,cAAc,EACxB,KAAK,EAAE,cAAc,GACvB;YAEF,uCAAK,SAAS,EAAC,wCAAwC,GAAO,CAC5D;QACN,uCAAK,SAAS,EAAC,iCAAiC,EAAC,GAAG,EAAE,YAAY,GAAQ;QAC1E,8BAAC,eAAM,IACH,IAAI,EAAE,cAAc,EACpB,OAAO,EAAE,gBAAgB,EACzB,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,kBAAkB,EAC3B,KAAK,EAAE,eAAe,CAAC,IAAI,EAC3B,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,cAAc,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,EACrD,SAAS,EAAC,MAAM,EAChB,OAAO,EAAC,MAAM,EACd,YAAY,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CACvB,uCAAK,SAAS,EAAC,+CAA+C;gBAC1D,uCAAK,SAAS,EAAC,oDAAoD,IAAE,IAAA,iDAAwB,EAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAc,CAAC,CAAO;gBAC7H,uCAAK,SAAS,EAAC,oDAAoD,IAC9D,OAAO,aAAP,OAAO;oBAAP,OAAO,CAAE,KAAK;;oBAAE;6BAAQ,OAAO,aAAP,OAAO;wBAAP,OAAO,CAAE,KAAK,CAAQ,CAC7C,CACJ,CACT,GACH,CACA,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,eAAK,CAAC,UAAU,CAAsE,wBAAwB,CAAC,CAAC","sourcesContent":["import './EnhancedPhoneNumberField.global.scss';\n\nimport classNames from 'classnames';\nimport React, { ChangeEvent, ForwardRefRenderFunction, PropsWithChildren, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { useAutoFocusOnSelect } from '@/hooks/AutoFocusOnSelect';\nimport { convertCountryCodeToFlag, CountryType, ListOfCountriesAndCodes } from '@/models/CountryCodesAndNumbers';\n\nimport { Select } from '../../Select/Select';\n\nexport interface EnhancedPhoneNumberField extends PropsWithChildren<any> {\n validationStatus?: 'success' \| 'error';\n name?: string;\n value?: string;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n disabled?: boolean;\n}\n\nconst PHONE_AND_PREFIX_SPLIT = ' ';\n\nconst EnhancedPhoneNumberField: ForwardRefRenderFunction<HTMLInputElement, EnhancedPhoneNumberField> = (props, ref) => {\n const innerRef = useRef<HTMLInputElement>(null);\n useImperativeHandle<HTMLInputElement \| null, HTMLInputElement \| null>(ref, () => innerRef.current);\n const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen, isFocused } = useAutoFocusOnSelect({\n ref: innerRef.current,\n onlyAutoOpenWhenInputEmpty: true,\n });\n\n const { t } = useTranslation();\n\n const organizedCountries: CountryType[] = useMemo(() => {\n return ListOfCountriesAndCodes.sort((a, b) => {\n return `${(a.suggested ? '000' : '') + a.label}`.localeCompare(`${(b.suggested ? '000' : '') + b.label}`);\n });\n }, [ListOfCountriesAndCodes]);\n\n const [container, setContainer] = useState<HTMLDivElement \| null>(null);\n\n const { validationStatus, name, onChange, value } = props;\n\n const [selectedCountry, subscriberCode] = useMemo(() => {\n const [prefix, number] = value?.split(PHONE_AND_PREFIX_SPLIT) ?? [];\n\n if (prefix) {\n const selectedCountry = organizedCountries.find(({ phone }) => prefix === phone) \|\| organizedCountries[0];\n return [selectedCountry, number];\n }\n\n return [organizedCountries[0], ''];\n }, [value]);\n\n const getOption = (key: CountryType['code']): CountryType => {\n return organizedCountries.find(({ code }) => code === key) as CountryType;\n };\n\n const raiseOnChangeEvent = (prefix?: CountryType, suffix?: string) => {\n let newSuffix = suffix ?? subscriberCode;\n\n if (newSuffix.startsWith('0')) {\n newSuffix = newSuffix.substring(1);\n }\n\n const newValue = `${prefix?.phone ?? selectedCountry.phone}${PHONE_AND_PREFIX_SPLIT}${newSuffix}`;\n\n if (value != newValue) {\n onChange?.({ target: { name, value: newValue } } as any);\n }\n };\n\n const onInputChanged = (e: ChangeEvent<HTMLInputElement>) => {\n const value = e.target.value;\n raiseOnChangeEvent(undefined, value);\n };\n\n const onPrefixChanged = (selectedCountry: CountryType) => {\n onItemSelected();\n raiseOnChangeEvent(selectedCountry, undefined);\n };\n\n const fieldClasses = classNames('rs-enhanced-phone-field', {\n [`--${validationStatus}`]: !!validationStatus,\n '--focused': isFocused,\n '--disabled': props.disabled,\n });\n const onCountryClick = (country: CountryType) => {\n onPrefixChanged(country);\n return;\n };\n\n return (\n <div className={fieldClasses}>\n <div className=\"rs-enhanced-phone-field--country\" onClick={onTriggerClicked}>\n <div className=\"rs-enhanced-phone-field--country-icon\">{convertCountryCodeToFlag(selectedCountry.code)}</div>\n <Icon icon={IconType.Dropdown} />\n </div>\n <div className=\"rs-enhanced-phone-field--number\">\n <span className=\"rs-enhanced-phone-field--number-prefix\">+{selectedCountry.phone}</span>\n <input\n disabled={props.disabled}\n ref={innerRef}\n placeholder={t(Translation.Step.Confirmation.Inputs.Phone) + ' '}\n type=\"number\"\n style={{ paddingLeft: selectedCountry.phone.length 8 + 20 + 'px' }}\n onChange={onInputChanged}\n value={subscriberCode}\n />\n\n <div className=\"rs-enhanced-phone-field--number-status\"></div>\n </div>\n <div className=\"rs-enhanced-phone-field--anchor\" ref={setContainer}></div>\n <Select<CountryType, 'code'>\n open={isDropdownOpen}\n onClose={onDropdownClosed}\n target={container}\n options={organizedCountries}\n value={selectedCountry.code}\n onChange={(value) => onCountryClick(getOption(value))}\n labelName=\"code\"\n keyName=\"code\"\n renderOption={(country) => (\n <div className=\"rs-enhanced-phone-field--suggest-list-country\">\n <div className=\"rs-enhanced-phone-field--suggest-list-country-icon\">{convertCountryCodeToFlag(country?.code as string)}</div>\n <div className=\"rs-enhanced-phone-field--suggest-list-country-name\">\n {country?.label} <span>+{country?.phone}</span>\n </div>\n </div>\n )}\n />\n </div>\n );\n};\n\nexport default React.forwardRef<HTMLInputElement, React.PropsWithChildren<EnhancedPhoneNumberField>>(EnhancedPhoneNumberField);\n"]}
1	+ {"version":3,"file":"EnhancedPhoneNumberField.js","sourceRoot":"/","sources":["src/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField.tsx"],"names":[],"mappings":"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","sourcesContent":["import './EnhancedPhoneNumberField.engine.scss';\n\nimport classNames from 'classnames';\nimport React, { ChangeEvent, ForwardRefRenderFunction, PropsWithChildren, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { useAutoFocusOnSelect } from '@/hooks/AutoFocusOnSelect';\nimport { convertCountryCodeToFlag, CountryType, ListOfCountriesAndCodes } from '@/models/CountryCodesAndNumbers';\n\nimport { Select } from '../../Select/Select';\n\nexport interface EnhancedPhoneNumberField extends PropsWithChildren<any> {\n validationStatus?: 'success' \| 'error';\n name?: string;\n value?: string;\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n disabled?: boolean;\n}\n\nconst PHONE_AND_PREFIX_SPLIT = ' ';\n\nconst EnhancedPhoneNumberField: ForwardRefRenderFunction<HTMLInputElement, EnhancedPhoneNumberField> = (props, ref) => {\n const innerRef = useRef<HTMLInputElement>(null);\n useImperativeHandle<HTMLInputElement \| null, HTMLInputElement \| null>(ref, () => innerRef.current);\n const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen, isFocused } = useAutoFocusOnSelect({\n ref: innerRef.current,\n onlyAutoOpenWhenInputEmpty: true,\n });\n\n const { t } = useTranslation();\n\n const organizedCountries: CountryType[] = useMemo(() => {\n return ListOfCountriesAndCodes.sort((a, b) => {\n return `${(a.suggested ? '000' : '') + a.label}`.localeCompare(`${(b.suggested ? '000' : '') + b.label}`);\n });\n }, [ListOfCountriesAndCodes]);\n\n const [container, setContainer] = useState<HTMLDivElement \| null>(null);\n\n const { validationStatus, name, onChange, value } = props;\n\n const [selectedCountry, subscriberCode] = useMemo(() => {\n const [prefix, number] = value?.split(PHONE_AND_PREFIX_SPLIT) ?? [];\n\n if (prefix) {\n const selectedCountry = organizedCountries.find(({ phone }) => prefix === phone) \|\| organizedCountries[0];\n return [selectedCountry, number];\n }\n\n return [organizedCountries[0], ''];\n }, [value]);\n\n const getOption = (key: CountryType['code']): CountryType => {\n return organizedCountries.find(({ code }) => code === key) as CountryType;\n };\n\n const raiseOnChangeEvent = (prefix?: CountryType, suffix?: string) => {\n let newSuffix = suffix ?? subscriberCode;\n\n if (newSuffix.startsWith('0')) {\n newSuffix = newSuffix.substring(1);\n }\n\n const newValue = `${prefix?.phone ?? selectedCountry.phone}${PHONE_AND_PREFIX_SPLIT}${newSuffix}`;\n\n if (value != newValue) {\n onChange?.({ target: { name, value: newValue } } as any);\n }\n };\n\n const onInputChanged = (e: ChangeEvent<HTMLInputElement>) => {\n const value = e.target.value;\n raiseOnChangeEvent(undefined, value);\n };\n\n const onPrefixChanged = (selectedCountry: CountryType) => {\n onItemSelected();\n raiseOnChangeEvent(selectedCountry, undefined);\n };\n\n const fieldClasses = classNames('rs-enhanced-phone-field', {\n [`--${validationStatus}`]: !!validationStatus,\n '--focused': isFocused,\n '--disabled': props.disabled,\n });\n const onCountryClick = (country: CountryType) => {\n onPrefixChanged(country);\n return;\n };\n\n return (\n <div className={fieldClasses}>\n <div className=\"rs-enhanced-phone-field--country\" onClick={onTriggerClicked}>\n <div className=\"rs-enhanced-phone-field--country-icon\">{convertCountryCodeToFlag(selectedCountry.code)}</div>\n <Icon icon={IconType.Dropdown} />\n </div>\n <div className=\"rs-enhanced-phone-field--number\">\n <span className=\"rs-enhanced-phone-field--number-prefix\">+{selectedCountry.phone}</span>\n <input\n disabled={props.disabled}\n ref={innerRef}\n placeholder={t(Translation.Step.Confirmation.Inputs.Phone) + ' '}\n type=\"number\"\n style={{ paddingLeft: selectedCountry.phone.length 8 + 20 + 'px' }}\n onChange={onInputChanged}\n value={subscriberCode}\n />\n\n <div className=\"rs-enhanced-phone-field--number-status\"></div>\n </div>\n <div className=\"rs-enhanced-phone-field--anchor\" ref={setContainer}></div>\n <Select<CountryType, 'code'>\n open={isDropdownOpen}\n onClose={onDropdownClosed}\n target={container}\n options={organizedCountries}\n value={selectedCountry.code}\n onChange={(value) => onCountryClick(getOption(value))}\n labelName=\"code\"\n keyName=\"code\"\n renderOption={(country) => (\n <div className=\"rs-enhanced-phone-field--suggest-list-country\">\n <div className=\"rs-enhanced-phone-field--suggest-list-country-icon\">{convertCountryCodeToFlag(country?.code as string)}</div>\n <div className=\"rs-enhanced-phone-field--suggest-list-country-name\">\n {country?.label} <span>+{country?.phone}</span>\n </div>\n </div>\n )}\n />\n </div>\n );\n};\n\nexport default React.forwardRef<HTMLInputElement, React.PropsWithChildren<EnhancedPhoneNumberField>>(EnhancedPhoneNumberField);\n"]}

package/dist/src/components/generic/modal/SimpleModal.js CHANGED Viewed

@@ -35,6 +35,7 @@ const Fade_1 = __importDefault(require("../../../animations/Fade"));
 const Icon_1 = __importStar(require("../Icon/Icon"));
 const Portal_1 = require("../Portal/Portal");
 const Text_1 = __importDefault(require("../Text"));
+const RoomstayThemeEngine_1 = __importDefault(require("../../../providers/RoomstayThemeEngine"));
 const Color_1 = require("../../../util/Color");
 const ScreenSize_1 = __importDefault(require("../../../util/ScreenSize"));
 const SimpleModal_module_scss_1 = __importDefault(require("./SimpleModal.module.scss"));
@@ -98,7 +99,7 @@ function SimpleModal(props) {
     //     }
     // }, [modalContext?.modalStatus]);
     return props.open ? ( // TODO: Need an actual isVisible state value instead of relying on the prop since we can't animate out.
-    react_1.default.createElement(Portal_1.RoomstayPortal, { target: (_a = props.modalTarget) !== null && _a !== void 0 ? _a : document.body },
+    react_1.default.createElement(Portal_1.RoomstayPortal, { target: (_a = props.modalTarget) !== null && _a !== void 0 ? _a : RoomstayThemeEngine_1.default.EngineContainer },
         react_1.default.createElement("div", { className: (0, classnames_1.default)(SimpleModal_module_scss_1.default['roomstay-overlay'], props.className), ref: overlayRef },
             react_1.default.createElement(Fade_1.default, { open: props.open },
                 react_1.default.createElement("div", { ref: modalBody, className: classes, style: props.title ? {} : { paddingTop: 0 } },

package/dist/src/components/generic/modal/SimpleModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SimpleModal.js","sourceRoot":"/","sources":["src/components/generic/modal/SimpleModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iDAA0D;AAC1D,2CAA+C;AAC/C,4DAAoC;AACpC,+CAAuE;AAEvE,6DAA8C;AAC9C,uEAAgE;AAChE,+DAAoE;AACpE,qEAA6C;AAC7C,wCAAqC;AACrC,mEAA2C;AAE3C,wFAA+C;AAE/C,IAAY,eAKX;AALD,WAAY,eAAe;IACvB,+CAA4B,CAAA;IAC5B,oCAAiB,CAAA;IACjB,sCAAmB,CAAA;IACnB,oCAAiB,CAAA;AACrB,CAAC,EALW,eAAe,GAAf,uBAAe,KAAf,uBAAe,QAK1B;AAsBD,SAAwB,WAAW,CAAC,KAAuB;;IACvD,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IAEjD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAgB,IAAI,CAAC,CAAC;IAC5D,MAAM,SAAS,GAAG,IAAA,cAAM,EAAC,IAAI,CAAC,CAAC;IAC/B,MAAM,UAAU,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAC;IAEvD,MAAM,EAAE,iBAAiB,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE7C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,CAAC,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,CAAA,EAAE;YACrB,OAAO;SACV;QAED,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,CAChC,GAAG,EAAE;YACD,KAAK,EAAE,CAAC;QACZ,CAAC,EACD,SAAS,CAAC,OAAO,EACjB,UAAU,CAAC,OAAO,CACrB,CAAC;QAEF,OAAO,GAAG,EAAE;YACR,MAAM,EAAE,CAAC;QACb,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,UAAU,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;IAC9B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,KAAK,GAAG,GAAG,EAAE;QACf,IAAI,KAAK,CAAC,OAAO,EAAE;YACf,KAAK,CAAC,OAAO,EAAE,CAAC;SACnB;IACL,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,iCAAM,CAAC,gBAAgB,CAAC,EAAE,KAAK,CAAC,IAAI,IAAI,iCAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE;QACnF,CAAC,iCAAM,CAAC,YAAY,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW;QACzC,CAAC,iCAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,KAAK,CAAC,eAAe;KACxD,CAAC,CAAC;IAEH,0BAA0B;IAC1B,yDAAyD;IACzD,oBAAoB;IAEpB,0BAA0B;IAC1B,kFAAkF;IAClF,2GAA2G;IAE3G,4CAA4C;IAC5C,2BAA2B;IAC3B,gDAAgD;IAChD,YAAY;IAEZ,0BAA0B;IAC1B,iDAAiD;IACjD,YAAY;IACZ,eAAe;IACf,2BAA2B;IAC3B,iDAAiD;IACjD,YAAY;IAEZ,0BAA0B;IAC1B,oDAAoD;IACpD,YAAY;IACZ,QAAQ;IACR,mCAAmC;IAEnC,OAAO,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,wGAAwG;IAC1H,8BAAC,uBAAc,IAAC,MAAM,EAAE,MAAA,KAAK,CAAC,WAAW,mCAAI,~~QAAQ~~,CAAC,~~IAAI~~;~~QACtD~~,uCAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,iCAAM,CAAC,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,EAAE,GAAG,EAAE,UAAU;YACpF,8BAAC,cAAa,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI;gBAC3B,uCAAK,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE;oBAC/E,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CACX,uCAAK,SAAS,EAAE,iCAAM,CAAC,uBAAuB,CAAC;wBAC3C,8BAAC,cAAI,IAAC,KAAK,EAAE,aAAK,CAAC,KAAK;4BACpB,8CAAS,KAAK,CAAC,KAAK,CAAU,CAC3B;wBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,KAAK,GAAI,CAC5E,CACT,CAAC,CAAC,CAAC,CACA,uCAAK,SAAS,EAAE,qCAAqC,KAAK,CAAC,IAAI,KAAK,eAAe,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE;wBAC1G,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,KAAK,GAAI,CACxD,CACT;oBAED,uCAAK,SAAS,EAAC,uBAAuB;wBACjC,KAAK,CAAC,QAAQ;wBAEd,KAAK,CAAC,aAAa;4BAChB,OAAO,CAAC,UAAU,GAAG,oBAAU,CAAC,MAAM,IAAI,qCAAqC;4BAC/E,KAAK,CAAC,aAAa,CACrB;oBAEL,KAAK,CAAC,YAAY,IAAI,OAAO,CAAC,UAAU,IAAI,oBAAU,CAAC,MAAM,IAAI,CAC9D,uCAAK,SAAS,EAAE,iCAAM,CAAC,wBAAwB,CAAC,IAExC,KAAK,CAAC,YAAY,CAAC,qCAAqC;qBAE1D,CACT,CACC,CACM,CACd,CACO,CACpB,CAAC,CAAC,CAAC,CACA,6DAAK,CACR,CAAC;AACN,CAAC;AA7GD,8BA6GC","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport { useBodyClick } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport React, { useContext, useEffect, useRef, useState } from 'react';\n\nimport FadeAnimation from '@/animations/Fade';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { RoomstayPortal } from '@/components/generic/Portal/Portal';\nimport Text from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport styles from './SimpleModal.module.scss';\n\nexport enum SimpleModalSize {\n ExtraSmall = '--extra-small',\n Small = '--small',\n Normal = '--normal',\n Large = '--large',\n}\n\nexport interface SimpleModalProps {\n children: React.ReactElement;\n\n mobileFooter?: React.ReactElement;\n desktopFooter?: React.ReactElement;\n\n title?: string;\n size?: SimpleModalSize;\n\n open?: boolean;\n alignCenter?: boolean;\n\n onClose?: () => void;\n\n modalTarget?: HTMLElement \| null;\n style?: any;\n overflowVisible?: boolean;\n className?: string;\n}\n\nexport default function SimpleModal(props: SimpleModalProps) {\n const context = useContext(BookingEngineContext);\n\n const [modalId, setModalId] = useState<number \| null>(null);\n const modalBody = useRef(null);\n const overlayRef = useRef<HTMLDivElement \| null>(null);\n\n const { onBodyClickExcept } = useBodyClick();\n\n useEffect(() => {\n if (!modalBody?.current) {\n return;\n }\n\n const { remove } = onBodyClickExcept(\n () => {\n close();\n },\n modalBody.current,\n overlayRef.current\n );\n\n return () => {\n remove();\n };\n }, [props.open, modalBody, props.onClose]);\n\n useEffect(() => {\n setModalId(Math.random());\n }, []);\n\n const close = () => {\n if (props.onClose) {\n props.onClose();\n }\n };\n\n const classes = classNames(styles['roomstay-modal'], props.size && styles[props.size], {\n [styles['--centered']]: props.alignCenter,\n [styles['--overflow-visible']]: props.overflowVisible,\n });\n\n // useLayoutEffect(() => {\n // modalContext?.addModalStatus(props.open, modalId);\n // }, [props.open]);\n\n // useLayoutEffect(() => {\n // const triptease: HTMLElement = document.querySelector('iframe.tt-guestpa');\n // const hiWidget: HTMLElement = document.querySelector('.hi-widget-container .hi-launcher-container');\n\n // if (modalContext?.isAnyModalOpen()) {\n // if (triptease) {\n // triptease.style.display = 'none';\n // }\n\n // if (hiWidget) {\n // hiWidget.classList.add('--moved');\n // }\n // } else {\n // if (triptease) {\n // triptease.style.display = 'block';\n // }\n\n // if (hiWidget) {\n // hiWidget.classList.remove('--moved');\n // }\n // }\n // }, [modalContext?.modalStatus]);\n\n return props.open ? ( // TODO: Need an actual isVisible state value instead of relying on the prop since we can't animate out.\n <RoomstayPortal target={props.modalTarget ?? ~~document~~.~~body~~}>\n <div className={classNames(styles['roomstay-overlay'], props.className)} ref={overlayRef}>\n <FadeAnimation open={props.open}>\n <div ref={modalBody} className={classes} style={props.title ? {} : { paddingTop: 0 }}>\n {props.title ? (\n <div className={styles['roomstay-modal--title']}>\n <Text color={Color.White}>\n <strong>{props.title}</strong>\n </Text>\n <Icon icon={IconType.Close} color={Color.White} size=\"24px\" onClick={close} />\n </div>\n ) : (\n <div className={`room-gallery-slider__icon-lightbox${props.size === SimpleModalSize.ExtraSmall ? '' : '-map'}`}>\n <Icon icon={IconType.Close} size=\"24px\" onClick={close} />\n </div>\n )}\n\n <div className=\"simple-modal--content\">\n {props.children}\n\n {props.desktopFooter &&\n context.screenSize > ScreenSize.Medium && // TODO: refactor this to be variable\n props.desktopFooter}\n </div>\n\n {props.mobileFooter && context.screenSize <= ScreenSize.Medium && (\n <div className={styles['roomstay-modal--footer']}>\n {\n props.mobileFooter // TODO: refactor this to be variable\n }\n </div>\n )}\n </div>\n </FadeAnimation>\n </div>\n </RoomstayPortal>\n ) : (\n <></>\n );\n}\n"]}
1	+ {"version":3,"file":"SimpleModal.js","sourceRoot":"/","sources":["src/components/generic/modal/SimpleModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport { useBodyClick } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport React, { useContext, useEffect, useRef, useState } from 'react';\n\nimport FadeAnimation from '@/animations/Fade';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { RoomstayPortal } from '@/components/generic/Portal/Portal';\nimport Text from '@/components/generic/Text';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { Color } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport styles from './SimpleModal.module.scss';\n\nexport enum SimpleModalSize {\n ExtraSmall = '--extra-small',\n Small = '--small',\n Normal = '--normal',\n Large = '--large',\n}\n\nexport interface SimpleModalProps {\n children: React.ReactElement;\n\n mobileFooter?: React.ReactElement;\n desktopFooter?: React.ReactElement;\n\n title?: string;\n size?: SimpleModalSize;\n\n open?: boolean;\n alignCenter?: boolean;\n\n onClose?: () => void;\n\n modalTarget?: HTMLElement \| null;\n style?: any;\n overflowVisible?: boolean;\n className?: string;\n}\n\nexport default function SimpleModal(props: SimpleModalProps) {\n const context = useContext(BookingEngineContext);\n\n const [modalId, setModalId] = useState<number \| null>(null);\n const modalBody = useRef(null);\n const overlayRef = useRef<HTMLDivElement \| null>(null);\n\n const { onBodyClickExcept } = useBodyClick();\n\n useEffect(() => {\n if (!modalBody?.current) {\n return;\n }\n\n const { remove } = onBodyClickExcept(\n () => {\n close();\n },\n modalBody.current,\n overlayRef.current\n );\n\n return () => {\n remove();\n };\n }, [props.open, modalBody, props.onClose]);\n\n useEffect(() => {\n setModalId(Math.random());\n }, []);\n\n const close = () => {\n if (props.onClose) {\n props.onClose();\n }\n };\n\n const classes = classNames(styles['roomstay-modal'], props.size && styles[props.size], {\n [styles['--centered']]: props.alignCenter,\n [styles['--overflow-visible']]: props.overflowVisible,\n });\n\n // useLayoutEffect(() => {\n // modalContext?.addModalStatus(props.open, modalId);\n // }, [props.open]);\n\n // useLayoutEffect(() => {\n // const triptease: HTMLElement = document.querySelector('iframe.tt-guestpa');\n // const hiWidget: HTMLElement = document.querySelector('.hi-widget-container .hi-launcher-container');\n\n // if (modalContext?.isAnyModalOpen()) {\n // if (triptease) {\n // triptease.style.display = 'none';\n // }\n\n // if (hiWidget) {\n // hiWidget.classList.add('--moved');\n // }\n // } else {\n // if (triptease) {\n // triptease.style.display = 'block';\n // }\n\n // if (hiWidget) {\n // hiWidget.classList.remove('--moved');\n // }\n // }\n // }, [modalContext?.modalStatus]);\n\n return props.open ? ( // TODO: Need an actual isVisible state value instead of relying on the prop since we can't animate out.\n <RoomstayPortal target={props.modalTarget ?? RoomstayThemeEngine.EngineContainer}>\n <div className={classNames(styles['roomstay-overlay'], props.className)} ref={overlayRef}>\n <FadeAnimation open={props.open}>\n <div ref={modalBody} className={classes} style={props.title ? {} : { paddingTop: 0 }}>\n {props.title ? (\n <div className={styles['roomstay-modal--title']}>\n <Text color={Color.White}>\n <strong>{props.title}</strong>\n </Text>\n <Icon icon={IconType.Close} color={Color.White} size=\"24px\" onClick={close} />\n </div>\n ) : (\n <div className={`room-gallery-slider__icon-lightbox${props.size === SimpleModalSize.ExtraSmall ? '' : '-map'}`}>\n <Icon icon={IconType.Close} size=\"24px\" onClick={close} />\n </div>\n )}\n\n <div className=\"simple-modal--content\">\n {props.children}\n\n {props.desktopFooter &&\n context.screenSize > ScreenSize.Medium && // TODO: refactor this to be variable\n props.desktopFooter}\n </div>\n\n {props.mobileFooter && context.screenSize <= ScreenSize.Medium && (\n <div className={styles['roomstay-modal--footer']}>\n {\n props.mobileFooter // TODO: refactor this to be variable\n }\n </div>\n )}\n </div>\n </FadeAnimation>\n </div>\n </RoomstayPortal>\n ) : (\n <></>\n );\n}\n"]}

package/dist/src/components/steps/confirmation/StepConfirmationCountrySelector.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import './StepConfirmationCountrySelector.global.scss';
+import './StepConfirmationCountrySelector.engine.scss';
 import React, { ChangeEvent } from 'react';
 interface StepConfirmationCountrySelectorProps {
     validationStatus?: 'success' | 'error';

package/dist/src/components/steps/confirmation/StepConfirmationCountrySelector.js CHANGED Viewed

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-require("./StepConfirmationCountrySelector.global.scss");
+require("./StepConfirmationCountrySelector.engine.scss");
 const classnames_1 = __importDefault(require("classnames"));
 const AutoFocusOnSelect_1 = require("hooks/AutoFocusOnSelect");
 const react_1 = __importStar(require("react"));

package/dist/src/components/steps/confirmation/StepConfirmationCountrySelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepConfirmationCountrySelector.js","sourceRoot":"/","sources":["src/components/steps/confirmation/StepConfirmationCountrySelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import './StepConfirmationCountrySelector.global.scss';\n\nimport classNames from 'classnames';\nimport { useAutoFocusOnSelect } from 'hooks/AutoFocusOnSelect';\nimport React, { ChangeEvent, forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { convertCountryCodeToFlag, CountryType, ListOfCountriesAndCodes } from '@/models/CountryCodesAndNumbers';\n\nimport { Select } from '../../generic/Select/Select';\n\ninterface StepConfirmationCountrySelectorProps {\n validationStatus?: 'success' \| 'error';\n name?: string;\n value?: string; // example: Australia\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n disabled?: boolean;\n}\n\nconst StepConfirmationCountrySelector = forwardRef<HTMLInputElement \| null, StepConfirmationCountrySelectorProps>(function InnerStepConfirmationCountrySelector(props, ref) {\n const inputRef = useRef<HTMLInputElement \| null>(null);\n useImperativeHandle<HTMLInputElement \| null, HTMLInputElement \| null>(ref, () => inputRef.current);\n const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen, isFocused } = useAutoFocusOnSelect({\n ref: inputRef.current,\n focusOnSelected: false,\n });\n\n const { validationStatus, name, onChange, value = '' } = props;\n const [inputValue, setInputValue] = useState<string>(value);\n\n useEffect(() => {\n setInputValue(value);\n }, [value]);\n const organizedCountries: CountryType[] = useMemo(() => {\n return ListOfCountriesAndCodes.sort((a, b) => {\n return `${(a.suggested ? '000' : '') + a.label}`.localeCompare(`${(b.suggested ? '000' : '') + b.label}`);\n });\n }, [ListOfCountriesAndCodes]);\n const filterCountries = useCallback(\n (inputValue: string): CountryType[] => {\n return organizedCountries.filter(({ label }) => label.toUpperCase().includes(inputValue.toUpperCase()));\n },\n [organizedCountries]\n );\n const [options, setOptions] = useState<CountryType[]>(filterCountries(value));\n\n const { t } = useTranslation();\n\n const container = useRef(null);\n\n const emptyValue = () => {\n onChange?.({ target: { name, value: '' } } as any);\n setInputValue('');\n setOptions(organizedCountries);\n };\n\n const onInputChanged = (e: ChangeEvent<HTMLInputElement>) => {\n const value = e.target.value?.trim() \|\| '';\n if (value) {\n const options = filterCountries(value);\n setOptions(options);\n const exactCountry = options.find(({ label }) => label === value);\n if (exactCountry) {\n onCountryClick(exactCountry);\n }\n } else {\n setOptions(organizedCountries);\n }\n setInputValue(e.target.value);\n };\n\n const fieldClasses = classNames('rs-enhanced-country-field', {\n [`--${validationStatus}`]: !!validationStatus,\n '--focused': isFocused,\n '--disabled': props.disabled,\n });\n\n const onCountryClick = (country: CountryType): void => {\n setInputValue(country.label);\n onItemSelected();\n onChange?.({ target: { name, value: country.label } } as any);\n };\n\n const getOption = (key: CountryType['label']): CountryType \| undefined => {\n return options.find(({ label }) => label === key);\n };\n\n const onClose = (e: Event) => {\n onDropdownClosed(e);\n if (organizedCountries.every(({ label }) => label !== inputRef.current?.value)) {\n emptyValue();\n }\n };\n\n return (\n <div className={fieldClasses}>\n <div className=\"rs-enhanced-country-field--anchor\" ref={container}></div>\n\n <div className=\"rs-enhanced-country-field--search\">\n <input disabled={props.disabled} ref={inputRef} placeholder={t(Translation.Step.Confirmation.Inputs.Country) + ' *'} onChange={onInputChanged} value={inputValue} />\n <div\n onClick={() => {\n emptyValue();\n inputRef.current?.focus();\n }}\n className={classNames('rs-enhanced-country-field--close', {\n '--hide': !inputValue,\n })}\n >\n <Icon icon={IconType.Close} />\n </div>\n <div className=\"rs-enhanced-country-field--country\" onClick={onTriggerClicked}>\n <Icon icon={IconType.Dropdown} />\n </div>\n </div>\n\n <Select<CountryType, 'label'>\n offset={[0, 21]}\n open={isDropdownOpen}\n onClose={onClose}\n target={container.current}\n options={options}\n value={value}\n onChange={(value) => {\n const option = getOption(value);\n if (option) {\n onCountryClick(option);\n }\n }}\n keyName=\"label\"\n renderOption={(country) => (\n <div className=\"rs-enhanced-country-field--suggest-list-country\">\n <div className=\"rs-enhanced-country-field--suggest-list-country-icon\">{convertCountryCodeToFlag(country?.code as string)}</div>\n <div className=\"rs-enhanced-country-field--suggest-list-country-name\">\n {country?.label} ({country?.code})\n </div>\n </div>\n )}\n />\n </div>\n );\n});\n\nexport default StepConfirmationCountrySelector;\n"]}
1	+ {"version":3,"file":"StepConfirmationCountrySelector.js","sourceRoot":"/","sources":["src/components/steps/confirmation/StepConfirmationCountrySelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import './StepConfirmationCountrySelector.engine.scss';\n\nimport classNames from 'classnames';\nimport { useAutoFocusOnSelect } from 'hooks/AutoFocusOnSelect';\nimport React, { ChangeEvent, forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { convertCountryCodeToFlag, CountryType, ListOfCountriesAndCodes } from '@/models/CountryCodesAndNumbers';\n\nimport { Select } from '../../generic/Select/Select';\n\ninterface StepConfirmationCountrySelectorProps {\n validationStatus?: 'success' \| 'error';\n name?: string;\n value?: string; // example: Australia\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n disabled?: boolean;\n}\n\nconst StepConfirmationCountrySelector = forwardRef<HTMLInputElement \| null, StepConfirmationCountrySelectorProps>(function InnerStepConfirmationCountrySelector(props, ref) {\n const inputRef = useRef<HTMLInputElement \| null>(null);\n useImperativeHandle<HTMLInputElement \| null, HTMLInputElement \| null>(ref, () => inputRef.current);\n const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen, isFocused } = useAutoFocusOnSelect({\n ref: inputRef.current,\n focusOnSelected: false,\n });\n\n const { validationStatus, name, onChange, value = '' } = props;\n const [inputValue, setInputValue] = useState<string>(value);\n\n useEffect(() => {\n setInputValue(value);\n }, [value]);\n const organizedCountries: CountryType[] = useMemo(() => {\n return ListOfCountriesAndCodes.sort((a, b) => {\n return `${(a.suggested ? '000' : '') + a.label}`.localeCompare(`${(b.suggested ? '000' : '') + b.label}`);\n });\n }, [ListOfCountriesAndCodes]);\n const filterCountries = useCallback(\n (inputValue: string): CountryType[] => {\n return organizedCountries.filter(({ label }) => label.toUpperCase().includes(inputValue.toUpperCase()));\n },\n [organizedCountries]\n );\n const [options, setOptions] = useState<CountryType[]>(filterCountries(value));\n\n const { t } = useTranslation();\n\n const container = useRef(null);\n\n const emptyValue = () => {\n onChange?.({ target: { name, value: '' } } as any);\n setInputValue('');\n setOptions(organizedCountries);\n };\n\n const onInputChanged = (e: ChangeEvent<HTMLInputElement>) => {\n const value = e.target.value?.trim() \|\| '';\n if (value) {\n const options = filterCountries(value);\n setOptions(options);\n const exactCountry = options.find(({ label }) => label === value);\n if (exactCountry) {\n onCountryClick(exactCountry);\n }\n } else {\n setOptions(organizedCountries);\n }\n setInputValue(e.target.value);\n };\n\n const fieldClasses = classNames('rs-enhanced-country-field', {\n [`--${validationStatus}`]: !!validationStatus,\n '--focused': isFocused,\n '--disabled': props.disabled,\n });\n\n const onCountryClick = (country: CountryType): void => {\n setInputValue(country.label);\n onItemSelected();\n onChange?.({ target: { name, value: country.label } } as any);\n };\n\n const getOption = (key: CountryType['label']): CountryType \| undefined => {\n return options.find(({ label }) => label === key);\n };\n\n const onClose = (e: Event) => {\n onDropdownClosed(e);\n if (organizedCountries.every(({ label }) => label !== inputRef.current?.value)) {\n emptyValue();\n }\n };\n\n return (\n <div className={fieldClasses}>\n <div className=\"rs-enhanced-country-field--anchor\" ref={container}></div>\n\n <div className=\"rs-enhanced-country-field--search\">\n <input disabled={props.disabled} ref={inputRef} placeholder={t(Translation.Step.Confirmation.Inputs.Country) + ' *'} onChange={onInputChanged} value={inputValue} />\n <div\n onClick={() => {\n emptyValue();\n inputRef.current?.focus();\n }}\n className={classNames('rs-enhanced-country-field--close', {\n '--hide': !inputValue,\n })}\n >\n <Icon icon={IconType.Close} />\n </div>\n <div className=\"rs-enhanced-country-field--country\" onClick={onTriggerClicked}>\n <Icon icon={IconType.Dropdown} />\n </div>\n </div>\n\n <Select<CountryType, 'label'>\n offset={[0, 21]}\n open={isDropdownOpen}\n onClose={onClose}\n target={container.current}\n options={options}\n value={value}\n onChange={(value) => {\n const option = getOption(value);\n if (option) {\n onCountryClick(option);\n }\n }}\n keyName=\"label\"\n renderOption={(country) => (\n <div className=\"rs-enhanced-country-field--suggest-list-country\">\n <div className=\"rs-enhanced-country-field--suggest-list-country-icon\">{convertCountryCodeToFlag(country?.code as string)}</div>\n <div className=\"rs-enhanced-country-field--suggest-list-country-name\">\n {country?.label} ({country?.code})\n </div>\n </div>\n )}\n />\n </div>\n );\n});\n\nexport default StepConfirmationCountrySelector;\n"]}

package/dist/src/components/steps/room/ImageGallerySlider.js CHANGED Viewed

@@ -36,6 +36,7 @@ const react_use_measure_1 = __importDefault(require("react-use-measure"));
 const Icon_1 = __importStar(require("../../generic/Icon/Icon"));
 const ImageLoader_1 = __importDefault(require("../../generic/loader/ImageLoader"));
 const ImageProvider_1 = __importStar(require("../../../providers/ImageProvider"));
+const RoomstayThemeEngine_1 = __importDefault(require("../../../providers/RoomstayThemeEngine"));
 const Color_1 = require("../../../util/Color");
 const ScreenSize_1 = __importDefault(require("../../../util/ScreenSize"));
 function ImageGallerySlider(props) {
@@ -144,7 +145,7 @@ function ImageGallerySlider(props) {
         !!images.length && (react_1.default.createElement(react_1.default.Fragment, null,
             !props.hideLightboxIcon && (react_1.default.createElement("div", { className: "room-gallery-slider__icon-lightbox", onClick: toggleToggler },
                 react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Fullscreen, color: Color_1.Color.White, size: "20px" }))),
-            (0, react_dom_1.createPortal)(react_1.default.createElement(fslightbox_react_1.default, { toggler: toggler, sources: images.map((image) => ImageProvider_1.default.resizeImage(image, ImageProvider_1.ImageSize.Original)), type: "image", loadOnlyCurrentSource: true }), document.body))),
+            (0, react_dom_1.createPortal)(react_1.default.createElement(fslightbox_react_1.default, { toggler: toggler, sources: images.map((image) => ImageProvider_1.default.resizeImage(image, ImageProvider_1.ImageSize.Original)), type: "image", loadOnlyCurrentSource: true }), RoomstayThemeEngine_1.default.EngineContainer))),
         images.length > 1 && (react_1.default.createElement("div", { className: "room-gallery-slider__icon-right", onClick: nextImageOnClick },
             react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight2, color: Color_1.Color.White, size: "24px" })))));
 }

package/dist/src/components/steps/room/ImageGallerySlider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImageGallerySlider.js","sourceRoot":"/","sources":["src/components/steps/room/ImageGallerySlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport { animated, useSpring } from '@react-spring/web';\nimport FsLightbox from 'fslightbox-react';\nimport React, { useContext, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useDrag } from 'react-use-gesture';\nimport { FullGestureState, StateKey } from 'react-use-gesture/dist/types';\nimport useMeasure from 'react-use-measure';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport ImageLoader from '@/components/generic/loader/ImageLoader';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\nimport { Color } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\n\ninterface ImageGallerySliderProps {\n images: string[];\n\n imageSize?: ImageSize;\n hideLightboxIcon?: boolean;\n}\n\nexport default function ImageGallerySlider(props: ImageGallerySliderProps) {\n const context = useContext(BookingEngineContext);\n\n const [{ x }, set] = useSpring(() => ({ x: 0 }));\n const [ref, bounds] = useMeasure();\n const [prevReleasePosition, setPrevRelPos] = useState(0);\n const images = props.images ?? [];\n\n const [toggler, setToggler] = useState(false);\n const [lastReleaseX, setLastReleaseX] = useState(0);\n const [lastIndex, setLastIndex] = useState(0);\n\n const [isDragging, setIsDragging] = useState(false);\n\n let sliderVelocity = 0;\n\n const handleDrag = ({ down, movement: [mx], velocity }: FullGestureState<StateKey<'drag'>>) => {\n if (context.screenSize <= ScreenSize.Medium) {\n velocity = velocity * 0.5;\n sliderVelocity = velocity > 2 ? 2 : velocity < 1 ? 1 : velocity;\n } else {\n sliderVelocity = 1;\n }\n\n const cardWidth = bounds.width;\n const maxX = images.length * cardWidth;\n\n if (!down) {\n const releasePosition = lastReleaseX + mx * sliderVelocity;\n\n let restingLocation = 0;\n let last = 0;\n\n if (releasePosition > 0) {\n restingLocation = 0;\n last = 0;\n } else if (releasePosition < -(maxX - cardWidth)) {\n restingLocation = -(maxX - cardWidth);\n last = images.length - 1;\n } else {\n const magic = -releasePosition / cardWidth;\n if (releasePosition >= prevReleasePosition) {\n last = releasePosition % cardWidth > -cardWidth / 0.001 ? Math.floor(magic) : Math.ceil(magic);\n setPrevRelPos(releasePosition + (-releasePosition % cardWidth));\n restingLocation = -(last * cardWidth);\n } else {\n last = releasePosition % cardWidth > -cardWidth / 1000 ? Math.floor(magic) : Math.ceil(magic);\n setPrevRelPos(releasePosition - (cardWidth - (-releasePosition % cardWidth)));\n restingLocation = -(last * cardWidth);\n }\n }\n\n let inPercent = 0;\n if (restingLocation !== 0) {\n inPercent = restingLocation / maxX;\n }\n\n setLastIndex(last);\n set({ x: inPercent });\n setLastReleaseX(restingLocation);\n\n setTimeout(() => {\n setIsDragging(false);\n }, 50);\n } else {\n let inPercent = 0;\n const newReleasePx = lastReleaseX + mx;\n inPercent = newReleasePx / maxX;\n\n set({ x: inPercent });\n if (mx) {\n setIsDragging(true);\n }\n }\n };\n\n // Set the drag hook and define component movement based on gesture data\n const bind = useDrag((event) => {\n handleDrag(event);\n });\n\n const nextImage = () => {\n handleDrag({ down: false, movement: [-bounds.width, 0], velocity: 1 } as any);\n };\n\n const prevImage = () => {\n handleDrag({ down: false, movement: [bounds.width, 0], velocity: 1 } as any);\n };\n\n const onClickPrevImage = () => {\n return prevImage();\n };\n const toggleToggler = () => {\n return setToggler(!toggler);\n };\n const nextImageOnClick = () => {\n return nextImage();\n };\n const toggleClickHandler = () => {\n if (!isDragging) {\n setToggler(!toggler);\n }\n };\n\n return (\n <div ref={ref} className=\"room-gallery-slider\">\n {images.length > 1 && (\n <div className=\"room-gallery-slider__icon-left\" onClick={onClickPrevImage}>\n <Icon icon={IconType.ArrowLeft2} color={Color.White} size=\"24px\" />\n </div>\n )}\n <animated.div className=\"room-gallery-slider__animation\" {...bind()} style={{ left: x.to((perc) => `${perc * 100 * images.length}%`) }} onClick={toggleClickHandler}>\n <ul className=\"room-gallery-slider__track\" style={{ width: `${images.length * 100}%` }}>\n {images.map((image: any, index: number) => {\n return (\n <li\n key={index}\n className=\"room-gallery-slider__item\"\n style={{\n width: `${100 / images.length}%`,\n overflow: 'hidden',\n }}\n >\n <ImageLoader\n visible={lastIndex >= index}\n size={props.imageSize}\n draggable={false}\n src={image}\n style={{ objectFit: 'cover', objectPosition: 'center', height: '100%', width: '100%' }}\n />\n </li>\n );\n })}\n </ul>\n </animated.div>\n {!!images.length && (\n <>\n {!props.hideLightboxIcon && (\n <div className=\"room-gallery-slider__icon-lightbox\" onClick={toggleToggler}>\n <Icon icon={IconType.Fullscreen} color={Color.White} size=\"20px\" />\n </div>\n )}\n {createPortal(\n <FsLightbox toggler={toggler} sources={images.map((image) => ImageProvider.resizeImage(image, ImageSize.Original))} type=\"image\" loadOnlyCurrentSource />,\n document.body\n )}\n </>\n )}\n {images.length > 1 && (\n <div className=\"room-gallery-slider__icon-right\" onClick={nextImageOnClick}>\n <Icon icon={IconType.ArrowRight2} color={Color.White} size=\"24px\" />\n </div>\n )}\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"ImageGallerySlider.js","sourceRoot":"/","sources":["src/components/steps/room/ImageGallerySlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport { animated, useSpring } from '@react-spring/web';\nimport FsLightbox from 'fslightbox-react';\nimport React, { useContext, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useDrag } from 'react-use-gesture';\nimport { FullGestureState, StateKey } from 'react-use-gesture/dist/types';\nimport useMeasure from 'react-use-measure';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport ImageLoader from '@/components/generic/loader/ImageLoader';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { Color } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\n\ninterface ImageGallerySliderProps {\n images: string[];\n\n imageSize?: ImageSize;\n hideLightboxIcon?: boolean;\n}\n\nexport default function ImageGallerySlider(props: ImageGallerySliderProps) {\n const context = useContext(BookingEngineContext);\n\n const [{ x }, set] = useSpring(() => ({ x: 0 }));\n const [ref, bounds] = useMeasure();\n const [prevReleasePosition, setPrevRelPos] = useState(0);\n const images = props.images ?? [];\n\n const [toggler, setToggler] = useState(false);\n const [lastReleaseX, setLastReleaseX] = useState(0);\n const [lastIndex, setLastIndex] = useState(0);\n\n const [isDragging, setIsDragging] = useState(false);\n\n let sliderVelocity = 0;\n\n const handleDrag = ({ down, movement: [mx], velocity }: FullGestureState<StateKey<'drag'>>) => {\n if (context.screenSize <= ScreenSize.Medium) {\n velocity = velocity * 0.5;\n sliderVelocity = velocity > 2 ? 2 : velocity < 1 ? 1 : velocity;\n } else {\n sliderVelocity = 1;\n }\n\n const cardWidth = bounds.width;\n const maxX = images.length * cardWidth;\n\n if (!down) {\n const releasePosition = lastReleaseX + mx * sliderVelocity;\n\n let restingLocation = 0;\n let last = 0;\n\n if (releasePosition > 0) {\n restingLocation = 0;\n last = 0;\n } else if (releasePosition < -(maxX - cardWidth)) {\n restingLocation = -(maxX - cardWidth);\n last = images.length - 1;\n } else {\n const magic = -releasePosition / cardWidth;\n if (releasePosition >= prevReleasePosition) {\n last = releasePosition % cardWidth > -cardWidth / 0.001 ? Math.floor(magic) : Math.ceil(magic);\n setPrevRelPos(releasePosition + (-releasePosition % cardWidth));\n restingLocation = -(last * cardWidth);\n } else {\n last = releasePosition % cardWidth > -cardWidth / 1000 ? Math.floor(magic) : Math.ceil(magic);\n setPrevRelPos(releasePosition - (cardWidth - (-releasePosition % cardWidth)));\n restingLocation = -(last * cardWidth);\n }\n }\n\n let inPercent = 0;\n if (restingLocation !== 0) {\n inPercent = restingLocation / maxX;\n }\n\n setLastIndex(last);\n set({ x: inPercent });\n setLastReleaseX(restingLocation);\n\n setTimeout(() => {\n setIsDragging(false);\n }, 50);\n } else {\n let inPercent = 0;\n const newReleasePx = lastReleaseX + mx;\n inPercent = newReleasePx / maxX;\n\n set({ x: inPercent });\n if (mx) {\n setIsDragging(true);\n }\n }\n };\n\n // Set the drag hook and define component movement based on gesture data\n const bind = useDrag((event) => {\n handleDrag(event);\n });\n\n const nextImage = () => {\n handleDrag({ down: false, movement: [-bounds.width, 0], velocity: 1 } as any);\n };\n\n const prevImage = () => {\n handleDrag({ down: false, movement: [bounds.width, 0], velocity: 1 } as any);\n };\n\n const onClickPrevImage = () => {\n return prevImage();\n };\n const toggleToggler = () => {\n return setToggler(!toggler);\n };\n const nextImageOnClick = () => {\n return nextImage();\n };\n const toggleClickHandler = () => {\n if (!isDragging) {\n setToggler(!toggler);\n }\n };\n\n return (\n <div ref={ref} className=\"room-gallery-slider\">\n {images.length > 1 && (\n <div className=\"room-gallery-slider__icon-left\" onClick={onClickPrevImage}>\n <Icon icon={IconType.ArrowLeft2} color={Color.White} size=\"24px\" />\n </div>\n )}\n <animated.div className=\"room-gallery-slider__animation\" {...bind()} style={{ left: x.to((perc) => `${perc * 100 * images.length}%`) }} onClick={toggleClickHandler}>\n <ul className=\"room-gallery-slider__track\" style={{ width: `${images.length * 100}%` }}>\n {images.map((image: any, index: number) => {\n return (\n <li\n key={index}\n className=\"room-gallery-slider__item\"\n style={{\n width: `${100 / images.length}%`,\n overflow: 'hidden',\n }}\n >\n <ImageLoader\n visible={lastIndex >= index}\n size={props.imageSize}\n draggable={false}\n src={image}\n style={{ objectFit: 'cover', objectPosition: 'center', height: '100%', width: '100%' }}\n />\n </li>\n );\n })}\n </ul>\n </animated.div>\n {!!images.length && (\n <>\n {!props.hideLightboxIcon && (\n <div className=\"room-gallery-slider__icon-lightbox\" onClick={toggleToggler}>\n <Icon icon={IconType.Fullscreen} color={Color.White} size=\"20px\" />\n </div>\n )}\n {createPortal(\n <FsLightbox toggler={toggler} sources={images.map((image) => ImageProvider.resizeImage(image, ImageSize.Original))} type=\"image\" loadOnlyCurrentSource />,\n RoomstayThemeEngine.EngineContainer\n )}\n </>\n )}\n {images.length > 1 && (\n <div className=\"room-gallery-slider__icon-right\" onClick={nextImageOnClick}>\n <Icon icon={IconType.ArrowRight2} color={Color.White} size=\"24px\" />\n </div>\n )}\n </div>\n );\n}\n"]}

package/dist/src/components/steps/room/roomDetails/roomRates/RoomRateListPromotion/RoomRateListPromotion.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import './RoomRateListPromotion.global.scss';
+import './RoomRateListPromotion.engine.scss';
 import React from 'react';
 import type { IPromotion } from '../../../../../../models/Promotion/IPromotion.type';
 type RoomRateListPromotionProps = {

package/dist/src/components/steps/room/roomDetails/roomRates/RoomRateListPromotion/RoomRateListPromotion.js CHANGED Viewed

@@ -27,7 +27,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RoomRateListPromotion = void 0;
-require("./RoomRateListPromotion.global.scss");
+require("./RoomRateListPromotion.engine.scss");
 const react_1 = __importDefault(require("react"));
 const react_i18next_1 = require("react-i18next");
 const BEButton_1 = __importDefault(require("../../../../../generic/BEButton"));

package/dist/src/components/steps/room/roomDetails/roomRates/RoomRateListPromotion/RoomRateListPromotion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RoomRateListPromotion.js","sourceRoot":"/","sources":["src/components/steps/room/roomDetails/roomRates/RoomRateListPromotion/RoomRateListPromotion.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA6C;AAE7C,kDAA0B;AAC1B,iDAA+C;AAE/C,6EAAqD;AACrD,uEAAgE;AAChE,kEAA2D;AAC3D,4FAAyF;AACzF,iDAA6C;AAE7C,4DAAyD;AACzD,wCAAqC;AAM9B,MAAM,qBAAqB,GAAG,CAAC,KAAiC,EAAE,EAAE;IACvE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAE5B,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,oBAAQ,GAAE,CAAC;IAC7B,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC3B,MAAM,iBAAiB,GAAG,IAAI,6CAAqB,CAAC,SAAS,CAAC,CAAC;QAE/D,KAAK,CAAC,iBAAiB,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,OAAO,CACH,uCAAK,SAAS,EAAC,uBAAuB;QAClC,uCAAK,SAAS,EAAC,gCAAgC;YAC3C,uCAAK,SAAS,EAAC,6BAA6B;gBACxC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,aAAK,CAAC,MAAM,GAAI,CAC7D;YACN,uCAAK,SAAS,EAAC,6BAA6B;gBACxC,uCAAK,SAAS,EAAC,sBAAsB;oBACjC,8BAAC,cAAI,IAAC,KAAK,EAAE,aAAK,CAAC,MAAM,EAAE,IAAI,UAC1B,SAAS,CAAC,IAAI,CACZ,CACL;gBAEN,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,IAAG,SAAS,CAAC,WAAW,CAAQ,CACxD,CACJ;QACN,uCAAK,SAAS,EAAC,+BAA+B;YAC1C,8BAAC,kBAAQ,IAAC,OAAO,QAAC,MAAM,QAAC,OAAO,EAAE,iBAAiB,EAAE,WAAW,UAC3D,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CACtB,CACT,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAnCW,QAAA,qBAAqB,yBAmChC","sourcesContent":["import './RoomRateListPromotion.~~global~~.scss';\n\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { PromotionClickedEvent } from '@/events/actions/Promotion/PromotionClickedEvent';\nimport { useEvent } from '@/hooks/EventHook';\nimport type { IPromotion } from '@/models/Promotion/IPromotion.type';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\n\ntype RoomRateListPromotionProps = {\n promotion: IPromotion;\n};\n\nexport const RoomRateListPromotion = (props: RoomRateListPromotionProps) => {\n const { promotion } = props;\n\n const { raise } = useEvent();\n const { t } = useTranslation();\n\n const onApplyNowClicked = () => {\n const promoClickedEvent = new PromotionClickedEvent(promotion);\n\n raise(promoClickedEvent);\n };\n\n return (\n <div className=\"c-room-list-promotion\">\n <div className=\"c-room-list-promotion--content\">\n <div className=\"c-room-list-promotion--icon\">\n <Icon icon={IconType.Money} size=\"42px\" color={Color.Accent} />\n </div>\n <div className=\"c-room-list-promotion--body\">\n <div className=\"u-marg-bottom--light\">\n <Text color={Color.Accent} bold>\n {promotion.name}\n </Text>\n </div>\n\n <Text type={TextType.Small}>{promotion.description}</Text>\n </div>\n </div>\n <div className=\"c-room-list-promotion--button\">\n <BEButton primary filled onClick={onApplyNowClicked} mobileWidth>\n {t(Translation.Misc.ApplyNow)}\n </BEButton>\n </div>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"RoomRateListPromotion.js","sourceRoot":"/","sources":["src/components/steps/room/roomDetails/roomRates/RoomRateListPromotion/RoomRateListPromotion.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA6C;AAE7C,kDAA0B;AAC1B,iDAA+C;AAE/C,6EAAqD;AACrD,uEAAgE;AAChE,kEAA2D;AAC3D,4FAAyF;AACzF,iDAA6C;AAE7C,4DAAyD;AACzD,wCAAqC;AAM9B,MAAM,qBAAqB,GAAG,CAAC,KAAiC,EAAE,EAAE;IACvE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAE5B,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,oBAAQ,GAAE,CAAC;IAC7B,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC3B,MAAM,iBAAiB,GAAG,IAAI,6CAAqB,CAAC,SAAS,CAAC,CAAC;QAE/D,KAAK,CAAC,iBAAiB,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,OAAO,CACH,uCAAK,SAAS,EAAC,uBAAuB;QAClC,uCAAK,SAAS,EAAC,gCAAgC;YAC3C,uCAAK,SAAS,EAAC,6BAA6B;gBACxC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,aAAK,CAAC,MAAM,GAAI,CAC7D;YACN,uCAAK,SAAS,EAAC,6BAA6B;gBACxC,uCAAK,SAAS,EAAC,sBAAsB;oBACjC,8BAAC,cAAI,IAAC,KAAK,EAAE,aAAK,CAAC,MAAM,EAAE,IAAI,UAC1B,SAAS,CAAC,IAAI,CACZ,CACL;gBAEN,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,IAAG,SAAS,CAAC,WAAW,CAAQ,CACxD,CACJ;QACN,uCAAK,SAAS,EAAC,+BAA+B;YAC1C,8BAAC,kBAAQ,IAAC,OAAO,QAAC,MAAM,QAAC,OAAO,EAAE,iBAAiB,EAAE,WAAW,UAC3D,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CACtB,CACT,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAnCW,QAAA,qBAAqB,yBAmChC","sourcesContent":["import './RoomRateListPromotion.engine.scss';\n\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { PromotionClickedEvent } from '@/events/actions/Promotion/PromotionClickedEvent';\nimport { useEvent } from '@/hooks/EventHook';\nimport type { IPromotion } from '@/models/Promotion/IPromotion.type';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\n\ntype RoomRateListPromotionProps = {\n promotion: IPromotion;\n};\n\nexport const RoomRateListPromotion = (props: RoomRateListPromotionProps) => {\n const { promotion } = props;\n\n const { raise } = useEvent();\n const { t } = useTranslation();\n\n const onApplyNowClicked = () => {\n const promoClickedEvent = new PromotionClickedEvent(promotion);\n\n raise(promoClickedEvent);\n };\n\n return (\n <div className=\"c-room-list-promotion\">\n <div className=\"c-room-list-promotion--content\">\n <div className=\"c-room-list-promotion--icon\">\n <Icon icon={IconType.Money} size=\"42px\" color={Color.Accent} />\n </div>\n <div className=\"c-room-list-promotion--body\">\n <div className=\"u-marg-bottom--light\">\n <Text color={Color.Accent} bold>\n {promotion.name}\n </Text>\n </div>\n\n <Text type={TextType.Small}>{promotion.description}</Text>\n </div>\n </div>\n <div className=\"c-room-list-promotion--button\">\n <BEButton primary filled onClick={onApplyNowClicked} mobileWidth>\n {t(Translation.Misc.ApplyNow)}\n </BEButton>\n </div>\n </div>\n );\n};\n"]}