@roomstay/frontend 2.1.32 → 2.2.0

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

@@ -1,23 +1,81 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const RadioButton_1 = require("./RadioButton");
 const RadioButtonGroup_module_scss_1 = __importDefault(require("./RadioButtonGroup.module.scss"));
-const AutoAutoHeight_1 = __importDefault(require("../../../animations/AutoAutoHeight"));
 const Tooltip_1 = __importDefault(require("../Tooltip/Tooltip"));
-const RadioButtonGroup = ({ options, value: valueProp, onChange }) => {
-    return (react_1.default.createElement("div", { className: RadioButtonGroup_module_scss_1.default.root }, options.map(({ value, label, disabled, disabledReason, renderContent }) => {
-        const radioButton = (react_1.default.createElement(RadioButton_1.RadioButton, { className: RadioButtonGroup_module_scss_1.default.item, key: value, checked: !disabled && value === valueProp, onChange: () => {
-                if (!disabled)
-                    onChange(value);
-            }, label: label, disabled: disabled, renderContent: () => react_1.default.createElement(AutoAutoHeight_1.default, { open: true }, renderContent === null || renderContent === void 0 ? void 0 : renderContent()) }));
-        if (disabled && disabledReason) {
-            return (react_1.default.createElement(Tooltip_1.default, { key: value, wrapperClasses: RadioButtonGroup_module_scss_1.default.wrapper, title: disabledReason }, radioButton));
+const Overlay_1 = require("../Overlay/Overlay");
+const Icon_1 = __importStar(require("../Icon/Icon"));
+const RadioButtonGroup = ({ options = [], value: valueProp, onChange, renderChildrenContent, }) => {
+    return (react_1.default.createElement("div", { className: RadioButtonGroup_module_scss_1.default.root }, options.map((rawOption) => {
+        const options = rawOption.options;
+        const isGroup = !!(options === null || options === void 0 ? void 0 : options.length);
+        const [ref, setRef] = (0, react_1.useState)(null);
+        const [open, setOpen] = (0, react_1.useState)(false);
+        const option = isGroup && valueProp ? options.find(({ value }) => value === valueProp) || rawOption : rawOption;
+        const radioButton = (react_1.default.createElement(RadioButton_1.RadioButton, { headerRef: setRef, className: RadioButtonGroup_module_scss_1.default.item, key: option === null || option === void 0 ? void 0 : option.value, checked: !(option === null || option === void 0 ? void 0 : option.disabled) && (option === null || option === void 0 ? void 0 : option.value) === valueProp, onChange: () => {
+                if (option === null || option === void 0 ? void 0 : option.disabled)
+                    return;
+                if (isGroup)
+                    setOpen(!open);
+                else if (option === null || option === void 0 ? void 0 : option.value)
+                    onChange === null || onChange === void 0 ? void 0 : onChange(option.value);
+            }, label: option === null || option === void 0 ? void 0 : option.label, disabled: option === null || option === void 0 ? void 0 : option.disabled, renderContent: option === null || option === void 0 ? void 0 : option.renderContent }));
+        if ((option === null || option === void 0 ? void 0 : option.disabled) && (option === null || option === void 0 ? void 0 : option.disabledReason)) {
+            return (react_1.default.createElement(Tooltip_1.default, { key: option === null || option === void 0 ? void 0 : option.value, wrapperClasses: RadioButtonGroup_module_scss_1.default.wrapper, title: option === null || option === void 0 ? void 0 : option.disabledReason }, radioButton));
         }
-        return (react_1.default.createElement("div", { key: value, className: RadioButtonGroup_module_scss_1.default.wrapper }, radioButton));
+        return (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("div", { key: option === null || option === void 0 ? void 0 : option.value, className: RadioButtonGroup_module_scss_1.default.wrapper },
+                radioButton,
+                options && (react_1.default.createElement("div", { className: RadioButtonGroup_module_scss_1.default.childrenIndicator },
+                    react_1.default.createElement(Icon_1.default, { size: "24px", icon: Icon_1.IconType.Dropdown })))),
+            options && (react_1.default.createElement(Overlay_1.Overlay, { onClose: () => setOpen(false), className: RadioButtonGroup_module_scss_1.default.overlay, hideStyles: true, containerClassName: "u-w-100", open: open, followElement: ref || undefined, offset: [0, 0], placement: "top-start" },
+                react_1.default.createElement(RadioButtonGroup, { options: options.map((option) => {
+                        const { renderContent } = option, rest = __rest(option, ["renderContent"]);
+                        if (!renderChildrenContent)
+                            return rest;
+                        return option;
+                    }), onChange: (value) => {
+                        onChange === null || onChange === void 0 ? void 0 : onChange(value);
+                        setOpen(false);
+                    }, value: valueProp })))));
     })));
 };
 exports.default = RadioButtonGroup;

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

@@ -1 +1 @@
-{"version":3,"file":"RadioButtonGroup.js","sourceRoot":"/","sources":["src/components/generic/RadioButtonGroup/RadioButtonGroup.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAuD;AACvD,mFAAgF;AAChF,kGAAoD;AACpD,iFAAyD;AACzD,iEAAyC;AAiBzC,MAAM,gBAAgB,GAAG,CAAiC,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAiC,EAAuB,EAAE;IACrJ,OAAO,CACH,uCAAK,SAAS,EAAE,sCAAM,CAAC,IAAI,IACtB,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,aAAa,EAAE,EAAE,EAAE;QACvE,MAAM,WAAW,GAAG,CAChB,8BAAC,yBAAW,IACR,SAAS,EAAE,sCAAM,CAAC,IAAI,EACtB,GAAG,EAAE,KAAK,EACV,OAAO,EAAE,CAAC,QAAQ,IAAI,KAAK,KAAK,SAAS,EACzC,QAAQ,EAAE,GAAG,EAAE;gBACX,IAAI,CAAC,QAAQ;oBAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;YACnC,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,GAAG,EAAE,CAAC,8BAAC,wBAAc,IAAC,IAAI,UAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,EAAI,CAAkB,GAChF,CACL,CAAC;QAEF,IAAI,QAAQ,IAAI,cAAc,EAAE;YAC5B,OAAO,CACH,8BAAC,iBAAO,IAAC,GAAG,EAAE,KAAK,EAAE,cAAc,EAAE,sCAAM,CAAC,OAAO,EAAE,KAAK,EAAE,cAAc,IACrE,WAAW,CACN,CACb,CAAC;SACL;QAED,OAAO,CACH,uCAAK,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,sCAAM,CAAC,OAAO,IACrC,WAAW,CACV,CACT,CAAC;IACN,CAAC,CAAC,CACA,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,gBAAgB,CAAC","sourcesContent":["import React, { ReactElement, ReactNode } from 'react';\nimport { RadioButton } from '@/components/generic/RadioButtonGroup/RadioButton';\nimport styles from './RadioButtonGroup.module.scss';\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport Tooltip from '../Tooltip/Tooltip';\n\nexport interface RadioButtonGroupProps<TValue extends string> {\n    options: {\n        value: TValue;\n        label?: ReactNode;\n\n        disabled?: boolean;\n        /** Enabled a tooltip that gives more info on why the field is disabled */\n        disabledReason?: string;\n\n        renderContent?: () => ReactNode;\n    }[];\n    value: TValue;\n    onChange: (value: TValue) => void;\n}\n\nconst RadioButtonGroup = <TValue extends string = string>({ options, value: valueProp, onChange }: RadioButtonGroupProps<TValue>): ReactElement | null => {\n    return (\n        <div className={styles.root}>\n            {options.map(({ value, label, disabled, disabledReason, renderContent }) => {\n                const radioButton = (\n                    <RadioButton\n                        className={styles.item}\n                        key={value}\n                        checked={!disabled && value === valueProp}\n                        onChange={() => {\n                            if (!disabled) onChange(value);\n                        }}\n                        label={label}\n                        disabled={disabled}\n                        renderContent={() => <AutoAutoHeight open>{renderContent?.()}</AutoAutoHeight>}\n                    />\n                );\n\n                if (disabled && disabledReason) {\n                    return (\n                        <Tooltip key={value} wrapperClasses={styles.wrapper} title={disabledReason}>\n                            {radioButton}\n                        </Tooltip>\n                    );\n                }\n\n                return (\n                    <div key={value} className={styles.wrapper}>\n                        {radioButton}\n                    </div>\n                );\n            })}\n        </div>\n    );\n};\n\nexport default RadioButtonGroup;\n"]}
+{"version":3,"file":"RadioButtonGroup.js","sourceRoot":"/","sources":["src/components/generic/RadioButtonGroup/RadioButtonGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { ReactElement, ReactNode, useState } from 'react';\nimport { RadioButton } from '@/components/generic/RadioButtonGroup/RadioButton';\nimport styles from './RadioButtonGroup.module.scss';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\n\nexport interface IRadioButtonOption<TValue extends string = string> {\n    value: TValue;\n\n    label?: ReactNode;\n    disabled?: boolean;\n    /** Enabled a tooltip that gives more info on why the field is disabled */\n    disabledReason?: string;\n    renderContent?: () => ReactNode;\n    options?: IRadioButtonOption<TValue>[];\n}\n\nexport interface IRadioButtonGroupProps<TValue extends string = string> {\n    options?: IRadioButtonOption<TValue>[];\n    value?: TValue;\n    onChange?: (value: TValue) => void;\n    renderChildrenContent?: boolean;\n}\n\nconst RadioButtonGroup = <TValue extends string = string>({\n    options = [],\n    value: valueProp,\n    onChange,\n    renderChildrenContent,\n}: IRadioButtonGroupProps<TValue>): ReactElement | null => {\n    return (\n        <div className={styles.root}>\n            {options.map((rawOption) => {\n                const options = rawOption.options;\n                const isGroup = !!options?.length;\n                const [ref, setRef] = useState<HTMLDivElement | null>(null);\n                const [open, setOpen] = useState<boolean>(false);\n                const option: IRadioButtonOption<TValue> | undefined = isGroup && valueProp ? options.find(({ value }) => value === valueProp) || rawOption : rawOption;\n                const radioButton = (\n                    <RadioButton\n                        headerRef={setRef}\n                        className={styles.item}\n                        key={option?.value}\n                        checked={!option?.disabled && option?.value === valueProp}\n                        onChange={() => {\n                            if (option?.disabled) return;\n                            if (isGroup) setOpen(!open);\n                            else if (option?.value) onChange?.(option.value);\n                        }}\n                        label={option?.label}\n                        disabled={option?.disabled}\n                        renderContent={option?.renderContent}\n                    />\n                );\n\n                if (option?.disabled && option?.disabledReason) {\n                    return (\n                        <Tooltip key={option?.value} wrapperClasses={styles.wrapper} title={option?.disabledReason}>\n                            {radioButton}\n                        </Tooltip>\n                    );\n                }\n\n                return (\n                    <>\n                        <div key={option?.value} className={styles.wrapper}>\n                            {radioButton}\n                            {options && (\n                                <div className={styles.childrenIndicator}>\n                                    <Icon size=\"24px\" icon={IconType.Dropdown} />\n                                </div>\n                            )}\n                        </div>\n                        {options && (\n                            <Overlay\n                                onClose={() => setOpen(false)}\n                                className={styles.overlay}\n                                hideStyles\n                                containerClassName=\"u-w-100\"\n                                open={open}\n                                followElement={ref || undefined}\n                                offset={[0, 0]}\n                                placement=\"top-start\"\n                            >\n                                <RadioButtonGroup\n                                    options={options.map((option) => {\n                                        const { renderContent, ...rest } = option;\n                                        if (!renderChildrenContent) return rest;\n                                        return option;\n                                    })}\n                                    onChange={(value) => {\n                                        onChange?.(value);\n                                        setOpen(false);\n                                    }}\n                                    value={valueProp}\n                                />\n                            </Overlay>\n                        )}\n                    </>\n                );\n            })}\n        </div>\n    );\n};\n\nexport default RadioButtonGroup;\n"]}

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

@@ -0,0 +1,11 @@
+import { CSSProperties, FC } from 'react';
+interface RatioImageProps {
+    src: string;
+    /**
+     * height/width
+     */
+    ratio: number;
+    style?: CSSProperties;
+}
+declare const RatioImage: FC<RatioImageProps>;
+export default RatioImage;

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

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const RatioImage_module_scss_1 = __importDefault(require("./RatioImage.module.scss"));
+const RatioImage = ({ src, ratio, style = {} }) => {
+    return (react_1.default.createElement("div", { className: RatioImage_module_scss_1.default.root, style: Object.assign({ backgroundImage: `url(${src})`, paddingTop: `${ratio * 100}%` }, style) }));
+};
+exports.default = RatioImage;
+//# sourceMappingURL=RatioImage.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RatioImage.js","sourceRoot":"/","sources":["src/components/generic/RatioImage/RatioImage.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAiD;AACjD,sFAA8C;AAW9C,MAAM,UAAU,GAAwB,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,GAAG,EAAE,EAAE,EAAE,EAAE;IACnE,OAAO,CACH,uCACI,SAAS,EAAE,gCAAM,CAAC,IAAI,EACtB,KAAK,kBACD,eAAe,EAAE,OAAO,GAAG,GAAG,EAC9B,UAAU,EAAE,GAAG,KAAK,GAAG,GAAG,GAAG,IAC1B,KAAK,IAEd,CACL,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,UAAU,CAAC","sourcesContent":["import React, { CSSProperties, FC } from 'react';\nimport styles from './RatioImage.module.scss';\n\ninterface RatioImageProps {\n    src: string;\n    /**\n     * height/width\n     */\n    ratio: number;\n    style?: CSSProperties;\n}\n\nconst RatioImage: FC<RatioImageProps> = ({ src, ratio, style = {} }) => {\n    return (\n        <div\n            className={styles.root}\n            style={{\n                backgroundImage: `url(${src})`,\n                paddingTop: `${ratio * 100}%`,\n                ...style,\n            }}\n        />\n    );\n};\n\nexport default RatioImage;\n"]}

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

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const dayjs_1 = __importDefault(require("dayjs"));
 const ImageGallerySlider_1 = __importDefault(require("../steps/room/ImageGallerySlider"));
 const BEButton_1 = __importDefault(require("./BEButton"));
@@ -35,7 +35,6 @@ const Color_1 = require("../../util/Color");
 const Text_1 = __importStar(require("./Text"));
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
-const react_2 = require("react");
 const ScreenSize_1 = __importDefault(require("../../util/ScreenSize"));
 const contexts_1 = require("../../contexts/index.js");
 const RecentSearchesCard = ({ basketRow, onRemove, onViewRatesClicked }) => {
@@ -43,7 +42,7 @@ const RecentSearchesCard = ({ basketRow, onRemove, onViewRatesClicked }) => {
     const start = (0, dayjs_1.default)(basketRow.getStartDate()).format('ddd DD MMM');
     const end = (0, dayjs_1.default)(basketRow.getEndDate()).format('ddd DD MMM');
     const { t } = (0, react_i18next_1.useTranslation)();
-    const beContext = (0, react_2.useContext)(contexts_1.BookingEngineContext);
+    const beContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);
     return (react_1.default.createElement("div", { style: { backgroundColor: '#fff' }, className: "recent-searches-card" },
         react_1.default.createElement("div", { className: "recent-searches-card--gallery" },
             react_1.default.createElement(ImageGallerySlider_1.default, { images: basketRow.getRoom().images || [], hideLightboxIcon: true })),
@@ -62,9 +61,11 @@ const RecentSearchesCard = ({ basketRow, onRemove, onViewRatesClicked }) => {
                         basketRow.getAdults(),
                         " ",
                         t(Translation_1.Translation.Step.Date.Adult_plural),
-                        " and ",
-                        basketRow.getChildren(),
                         " ",
+                        t(Translation_1.Translation.Misc.And),
+                        " ",
+                        basketRow.getChildren(),
+                        ' ',
                         t(Translation_1.Translation.Step.Date.Child_plural)))),
             react_1.default.createElement(BEButton_1.default, { icon: Icon_1.IconType.ArrowRight, iconPosition: "right", filled: true, primary: true, wide: beContext.screenSize <= ScreenSize_1.default.Medium, onClick: onViewRatesClicked }, t(Translation_1.Translation.Step.Room.RoomInfo.ViewRates))),
         react_1.default.createElement("div", { className: "recent-searches-card--close" },

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

@@ -1 +1 @@
-{"version":3,"file":"RecentSearchesCard.js","sourceRoot":"/","sources":["src/components/generic/RecentSearchesCard.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,kDAA0B;AAC1B,oGAA4E;AAC5E,6EAAqD;AACrD,uEAAgE;AAChE,wCAAqC;AACrC,kEAA2D;AAE3D,iDAA+C;AAC/C,0DAAuD;AACvD,iCAAmC;AACnC,mEAA2C;AAC3C,iDAA0D;AAQ1D,MAAM,kBAAkB,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,kBAAkB,EAA2B,EAAE,EAAE;;IAChG,MAAM,KAAK,GAAG,IAAA,eAAK,EAAC,SAAS,CAAC,YAAY,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IACnE,MAAM,GAAG,GAAG,IAAA,eAAK,EAAC,SAAS,CAAC,UAAU,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IAE/D,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,SAAS,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IAEnD,OAAO,CACH,uCAAK,KAAK,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,EAAE,SAAS,EAAC,sBAAsB;QACrE,uCAAK,SAAS,EAAC,+BAA+B;YAC1C,8BAAC,4BAAkB,IAAC,MAAM,EAAE,SAAS,CAAC,OAAO,EAAE,CAAC,MAAM,IAAI,EAAE,EAAE,gBAAgB,SAAG,CAC/E;QACN,uCAAK,SAAS,EAAC,mCAAmC,EAAC,OAAO,EAAE,kBAAkB;YAC1E,uCAAK,SAAS,EAAC,6BAA6B;gBACxC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,IAAI,EAAE,IAAI,QAAC,KAAK,EAAE,aAAK,CAAC,MAAM,IAC9C,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,CACtB;gBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,SAAS,EAAC,sBAAsB,IAC9E,MAAA,SAAS,CAAC,OAAO,EAAE,0CAAE,IAAI,CACvB,CACL;YAEN,uCAAK,SAAS,EAAC,sDAAsD;gBACjE,uCAAK,SAAS,EAAC,aAAa;oBACxB,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACrB,KAAK;;wBAAI,GAAG,CACV,CACL;gBACN;oBACI,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ;wBAC5C,SAAS,CAAC,SAAS,EAAE;;wBAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC;;wBAAO,SAAS,CAAC,WAAW,EAAE;;wBAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CACjI,CACL,CACJ;YACN,8BAAC,kBAAQ,IAAC,IAAI,EAAE,eAAQ,CAAC,UAAU,EAAE,YAAY,EAAC,OAAO,EAAC,MAAM,QAAC,OAAO,QAAC,IAAI,EAAE,SAAS,CAAC,UAAU,IAAI,oBAAU,CAAC,MAAM,EAAE,OAAO,EAAE,kBAAkB,IAChJ,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CACrC,CACT;QACN,uCAAK,SAAS,EAAC,6BAA6B;YACxC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,QAAQ,GAAI,CAClF,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,kBAAkB,CAAC","sourcesContent":["import React from 'react';\nimport dayjs from 'dayjs';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport BEButton from '@/components/generic/BEButton';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport Text, { TextType } from '@/components/generic/Text';\nimport BasketRow from '@/models/BasketRow';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport { useContext } from 'react';\nimport ScreenSize from '@/util/ScreenSize';\nimport { BookingEngineContext } from '@frontend/contexts';\nexport interface RecentSearchesCardProps {\n    basketRow: BasketRow;\n\n    onViewRatesClicked: () => void;\n    onRemove: () => void;\n}\n\nconst RecentSearchesCard = ({ basketRow, onRemove, onViewRatesClicked }: RecentSearchesCardProps) => {\n    const start = dayjs(basketRow.getStartDate()).format('ddd DD MMM');\n    const end = dayjs(basketRow.getEndDate()).format('ddd DD MMM');\n\n    const { t } = useTranslation();\n\n    const beContext = useContext(BookingEngineContext);\n\n    return (\n        <div style={{ backgroundColor: '#fff' }} className=\"recent-searches-card\">\n            <div className=\"recent-searches-card--gallery\">\n                <ImageGallerySlider images={basketRow.getRoom().images || []} hideLightboxIcon />\n            </div>\n            <div className=\"recent-searches-card--information\" onClick={onViewRatesClicked}>\n                <div className=\"recent-searches-card--title\">\n                    <Text type={TextType.Body} bold color={Color.Accent}>\n                        {basketRow.getRoom().name}\n                    </Text>\n                    <Text type={TextType.Small} color={Color.DarkGrey} className=\"u-marg-bottom--light\">\n                        {basketRow.getRate()?.name}\n                    </Text>\n                </div>\n\n                <div className=\"u-marg-bottom u-flex flex-wrap justify-content-start\">\n                    <div className=\"u-pad-right\">\n                        <Text type={TextType.Small}>\n                            {start}, {end}\n                        </Text>\n                    </div>\n                    <div>\n                        <Text type={TextType.Small} color={Color.DarkGrey}>\n                            {basketRow.getAdults()} {t(Translation.Step.Date.Adult_plural)} and {basketRow.getChildren()} {t(Translation.Step.Date.Child_plural)}\n                        </Text>\n                    </div>\n                </div>\n                <BEButton icon={IconType.ArrowRight} iconPosition=\"right\" filled primary wide={beContext.screenSize <= ScreenSize.Medium} onClick={onViewRatesClicked}>\n                    {t(Translation.Step.Room.RoomInfo.ViewRates)}\n                </BEButton>\n            </div>\n            <div className=\"recent-searches-card--close\">\n                <Icon icon={IconType.Close} color={Color.DarkGrey} size=\"24px\" onClick={onRemove} />\n            </div>\n        </div>\n    );\n};\n\nexport default RecentSearchesCard;\n"]}
+{"version":3,"file":"RecentSearchesCard.js","sourceRoot":"/","sources":["src/components/generic/RecentSearchesCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext } from 'react';\nimport dayjs from 'dayjs';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport BEButton from '@/components/generic/BEButton';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport Text, { TextType } from '@/components/generic/Text';\nimport BasketRow from '@/models/BasketRow';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport ScreenSize from '@/util/ScreenSize';\nimport { BookingEngineContext } from '@frontend/contexts';\n\nexport interface RecentSearchesCardProps {\n    basketRow: BasketRow;\n\n    onViewRatesClicked: () => void;\n    onRemove: () => void;\n}\n\nconst RecentSearchesCard = ({ basketRow, onRemove, onViewRatesClicked }: RecentSearchesCardProps) => {\n    const start = dayjs(basketRow.getStartDate()).format('ddd DD MMM');\n    const end = dayjs(basketRow.getEndDate()).format('ddd DD MMM');\n\n    const { t } = useTranslation();\n\n    const beContext = useContext(BookingEngineContext);\n\n    return (\n        <div style={{ backgroundColor: '#fff' }} className=\"recent-searches-card\">\n            <div className=\"recent-searches-card--gallery\">\n                <ImageGallerySlider images={basketRow.getRoom().images || []} hideLightboxIcon />\n            </div>\n            <div className=\"recent-searches-card--information\" onClick={onViewRatesClicked}>\n                <div className=\"recent-searches-card--title\">\n                    <Text type={TextType.Body} bold color={Color.Accent}>\n                        {basketRow.getRoom().name}\n                    </Text>\n                    <Text type={TextType.Small} color={Color.DarkGrey} className=\"u-marg-bottom--light\">\n                        {basketRow.getRate()?.name}\n                    </Text>\n                </div>\n\n                <div className=\"u-marg-bottom u-flex flex-wrap justify-content-start\">\n                    <div className=\"u-pad-right\">\n                        <Text type={TextType.Small}>\n                            {start}, {end}\n                        </Text>\n                    </div>\n                    <div>\n                        <Text type={TextType.Small} color={Color.DarkGrey}>\n                            {basketRow.getAdults()} {t(Translation.Step.Date.Adult_plural)} {t(Translation.Misc.And)} {basketRow.getChildren()}{' '}\n                            {t(Translation.Step.Date.Child_plural)}\n                        </Text>\n                    </div>\n                </div>\n                <BEButton icon={IconType.ArrowRight} iconPosition=\"right\" filled primary wide={beContext.screenSize <= ScreenSize.Medium} onClick={onViewRatesClicked}>\n                    {t(Translation.Step.Room.RoomInfo.ViewRates)}\n                </BEButton>\n            </div>\n            <div className=\"recent-searches-card--close\">\n                <Icon icon={IconType.Close} color={Color.DarkGrey} size=\"24px\" onClick={onRemove} />\n            </div>\n        </div>\n    );\n};\n\nexport default RecentSearchesCard;\n"]}

package/dist/src/components/generic/Tabs/TabLink.js

@@ -1,18 +1,41 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabLink = void 0;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const TabContext_1 = __importDefault(require("./TabContext"));
 const react_router_dom_1 = require("react-router-dom");
-const react_2 = require("react");
 const Text_1 = __importDefault(require("../Text"));
 const Color_1 = require("../../../util/Color");
 const TabLink = (props) => {
-    const tabContext = (0, react_2.useContext)(TabContext_1.default);
+    const tabContext = (0, react_1.useContext)(TabContext_1.default);
+    const history = (0, react_router_dom_1.useHistory)();
     const { title, navPath, disabled, index } = props;
     if (!title) {
         return null;
@@ -23,6 +46,8 @@ const TabLink = (props) => {
                     e.preventDefault();
                 }
                 else {
+                    // Sometimes "to" property does not trigger, we need to call push action
+                    history.push(navPath);
                     tabContext.onChange(navPath, index);
                 }
             } },

package/dist/src/components/generic/Tabs/TabLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabLink.js","sourceRoot":"/","sources":["src/components/generic/Tabs/TabLink.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,4DAA4B;AAC5B,sFAA8D;AAC9D,uDAA2C;AAC3C,iCAAmC;AACnC,qEAA6C;AAC7C,wCAAqC;AAE9B,MAAM,OAAO,GAAG,CAAC,KAAU,EAAE,EAAE;IAClC,MAAM,UAAU,GAAG,IAAA,kBAAU,EAAC,oBAAU,CAAC,CAAC;IAE1C,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAElD,IAAI,CAAC,KAAK,EAAE;QACR,OAAO,IAAI,CAAC;KACf;IAED,OAAO,CACH;QACI,8BAAC,0BAAO,IACJ,EAAE,EAAE,OAAO,EACX,eAAe,EAAC,QAAQ,EACxB,SAAS,EAAE,IAAA,oBAAE,EAAC,aAAa,EAAE,EAAE,QAAQ,EAAE,CAAC,EAC1C,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACX,IAAI,QAAQ,EAAE;oBACV,CAAC,CAAC,cAAc,EAAE,CAAC;iBACtB;qBAAM;oBACH,UAAU,CAAC,QAAQ,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;iBACvC;YACL,CAAC;YAED,wCAAM,SAAS,EAAE,IAAA,oBAAE,EAAC,YAAY,CAAC;gBAC7B,8BAAC,cAAI,IAAC,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,IAAI,UAC5B,KAAK,CACH,CACJ,CACD,CACT,CACR,CAAC;AACN,CAAC,CAAC;AA/BW,QAAA,OAAO,WA+BlB","sourcesContent":["import React from 'react';\nimport cx from 'classnames';\nimport TabContext from '@/components/generic/Tabs/TabContext';\nimport { NavLink } from 'react-router-dom';\nimport { useContext } from 'react';\nimport Text from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\n\nexport const TabLink = (props: any) => {\n    const tabContext = useContext(TabContext);\n\n    const { title, navPath, disabled, index } = props;\n\n    if (!title) {\n        return null;\n    }\n\n    return (\n        <li>\n            <NavLink\n                to={navPath}\n                activeClassName=\"active\"\n                className={cx('c-nav-item ', { disabled })}\n                onClick={(e) => {\n                    if (disabled) {\n                        e.preventDefault();\n                    } else {\n                        tabContext.onChange(navPath, index);\n                    }\n                }}\n            >\n                <span className={cx('c-nav-link')}>\n                    <Text color={Color.DarkGrey} bold>\n                        {title}\n                    </Text>\n                </span>\n            </NavLink>\n        </li>\n    );\n};\n"]}
+{"version":3,"file":"TabLink.js","sourceRoot":"/","sources":["src/components/generic/Tabs/TabLink.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,4DAA4B;AAC5B,sFAA8D;AAC9D,uDAAuD;AACvD,qEAA6C;AAC7C,wCAAqC;AAE9B,MAAM,OAAO,GAAG,CAAC,KAAU,EAAE,EAAE;IAClC,MAAM,UAAU,GAAG,IAAA,kBAAU,EAAC,oBAAU,CAAC,CAAC;IAC1C,MAAM,OAAO,GAAG,IAAA,6BAAU,GAAE,CAAC;IAE7B,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAElD,IAAI,CAAC,KAAK,EAAE;QACR,OAAO,IAAI,CAAC;KACf;IAED,OAAO,CACH;QACI,8BAAC,0BAAO,IACJ,EAAE,EAAE,OAAO,EACX,eAAe,EAAC,QAAQ,EACxB,SAAS,EAAE,IAAA,oBAAE,EAAC,aAAa,EAAE,EAAE,QAAQ,EAAE,CAAC,EAC1C,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBACX,IAAI,QAAQ,EAAE;oBACV,CAAC,CAAC,cAAc,EAAE,CAAC;iBACtB;qBAAM;oBACH,wEAAwE;oBACxE,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;oBACtB,UAAU,CAAC,QAAQ,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;iBACvC;YACL,CAAC;YAED,wCAAM,SAAS,EAAE,IAAA,oBAAE,EAAC,YAAY,CAAC;gBAC7B,8BAAC,cAAI,IAAC,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,IAAI,UAC5B,KAAK,CACH,CACJ,CACD,CACT,CACR,CAAC;AACN,CAAC,CAAC;AAlCW,QAAA,OAAO,WAkClB","sourcesContent":["import React, { useContext } from 'react';\nimport cx from 'classnames';\nimport TabContext from '@/components/generic/Tabs/TabContext';\nimport { NavLink, useHistory } from 'react-router-dom';\nimport Text from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\n\nexport const TabLink = (props: any) => {\n    const tabContext = useContext(TabContext);\n    const history = useHistory();\n\n    const { title, navPath, disabled, index } = props;\n\n    if (!title) {\n        return null;\n    }\n\n    return (\n        <li>\n            <NavLink\n                to={navPath}\n                activeClassName=\"active\"\n                className={cx('c-nav-item ', { disabled })}\n                onClick={(e) => {\n                    if (disabled) {\n                        e.preventDefault();\n                    } else {\n                        // Sometimes \"to\" property does not trigger, we need to call push action\n                        history.push(navPath);\n                        tabContext.onChange(navPath, index);\n                    }\n                }}\n            >\n                <span className={cx('c-nav-link')}>\n                    <Text color={Color.DarkGrey} bold>\n                        {title}\n                    </Text>\n                </span>\n            </NavLink>\n        </li>\n    );\n};\n"]}

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

@@ -59,7 +59,7 @@ const TextBox = (props, ref) => {
         '--wide': props.wide,
         '--success': props.validationStatus === 'success',
         '--error': props.validationStatus === 'error',
-        '--disabled': inputProperties.disabled,
+        '--disabled': inputProperties === null || inputProperties === void 0 ? void 0 : inputProperties.disabled,
     }, props.className);
     const onFocusHandler = () => {
         return setSelected(true);

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

@@ -1 +1 @@
-{"version":3,"file":"TextBox.js","sourceRoot":"/","sources":["src/components/generic/TextBox.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { ForwardRefRenderFunction, ReactNode, useState } from 'react';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\n\nimport classNames from 'classnames';\n\nexport interface TextBoxProps {\n    icon?: IconType;\n    iconPosition?: 'left' | 'right';\n    placeholder?: string;\n    wide?: boolean;\n    type?: 'text' | 'tel' | 'password' | 'email';\n    name?: string;\n    required?: boolean;\n    label?: ReactNode;\n\n    validationStatus?: 'success' | 'error';\n\n    value?: string;\n\n    className?: string;\n\n    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n\n    inputProps?: Omit<JSX.IntrinsicElements['input'], 'id' | 'ref' | 'value' | 'onFocus' | 'onBlur' | 'onKeyPress'>;\n\n    onKeyPress?: JSX.IntrinsicElements['input']['onKeyPress'];\n}\n\nconst TextBox: ForwardRefRenderFunction<HTMLInputElement, TextBoxProps> = (props, ref) => {\n    const [selected, setSelected] = useState(false);\n\n    const type = props.type ? props.type : 'text';\n    const inputProperties: JSX.IntrinsicElements['input'] = {\n        type,\n        className: 'text-small',\n        placeholder: props.placeholder,\n        ...props.inputProps,\n    };\n\n    if (props.name) {\n        inputProperties.name = props.name;\n        inputProperties.id = `${props.name}${type}Input`;\n    }\n\n    if (props.required) {\n        inputProperties.required = props.required;\n    }\n\n    const onChange: JSX.IntrinsicElements['input']['onChange'] = (e) => {\n        if (props.onChange) {\n            props.onChange(e);\n        }\n    };\n\n    if (props.onChange) {\n        inputProperties.onChange = onChange;\n    }\n\n    let icon: ReactNode = '';\n\n    if (props.icon) {\n        icon = <Icon icon={props.icon} size=\"1em\" />;\n    }\n\n    const classes = classNames(\n        'textbox c-input',\n        {\n            '--has-icon': !!icon,\n            [`--icon-${props.iconPosition}`]: !!props.iconPosition,\n            '--selected': selected,\n            '--wide': props.wide,\n            '--success': props.validationStatus === 'success',\n            '--error': props.validationStatus === 'error',\n            '--disabled': inputProperties.disabled,\n        },\n        props.className\n    );\n    const onFocusHandler = () => {\n        return setSelected(true);\n    };\n    const onBlurHandler = () => {\n        return setSelected(false);\n    };\n\n    return (\n        <>\n            {props.label && (\n                <label className=\"text-bold d-flex u-marg-bottom--lighter\" htmlFor={inputProperties.id}>\n                    <>\n                        {props.label}\n                        {props?.required && <div style={{ color: 'red' }}>*</div>}\n                    </>\n                </label>\n            )}\n            <label className={classes}>\n                {icon}\n                <input {...inputProperties} ref={ref} value={props.value} onFocus={onFocusHandler} onBlur={onBlurHandler} onKeyPress={props.onKeyPress} />\n            </label>\n        </>\n    );\n};\n\nexport default React.forwardRef(TextBox);\n"]}
+{"version":3,"file":"TextBox.js","sourceRoot":"/","sources":["src/components/generic/TextBox.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { ForwardRefRenderFunction, ReactNode, useState } from 'react';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\n\nimport classNames from 'classnames';\n\nexport interface TextBoxProps {\n    icon?: IconType;\n    iconPosition?: 'left' | 'right';\n    placeholder?: string;\n    wide?: boolean;\n    type?: 'text' | 'tel' | 'password' | 'email';\n    name?: string;\n    required?: boolean;\n    label?: ReactNode;\n\n    validationStatus?: 'success' | 'error';\n\n    value?: string;\n\n    className?: string;\n\n    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n\n    inputProps?: Omit<JSX.IntrinsicElements['input'], 'id' | 'ref' | 'value' | 'onFocus' | 'onBlur' | 'onKeyPress'>;\n\n    onKeyPress?: JSX.IntrinsicElements['input']['onKeyPress'];\n}\n\nconst TextBox: ForwardRefRenderFunction<HTMLInputElement, TextBoxProps> = (props, ref) => {\n    const [selected, setSelected] = useState(false);\n\n    const type = props.type ? props.type : 'text';\n    const inputProperties: JSX.IntrinsicElements['input'] = {\n        type,\n        className: 'text-small',\n        placeholder: props.placeholder,\n        ...props.inputProps,\n    };\n\n    if (props.name) {\n        inputProperties.name = props.name;\n        inputProperties.id = `${props.name}${type}Input`;\n    }\n\n    if (props.required) {\n        inputProperties.required = props.required;\n    }\n\n    const onChange: JSX.IntrinsicElements['input']['onChange'] = (e) => {\n        if (props.onChange) {\n            props.onChange(e);\n        }\n    };\n\n    if (props.onChange) {\n        inputProperties.onChange = onChange;\n    }\n\n    let icon: ReactNode = '';\n\n    if (props.icon) {\n        icon = <Icon icon={props.icon} size=\"1em\" />;\n    }\n\n    const classes = classNames(\n        'textbox c-input',\n        {\n            '--has-icon': !!icon,\n            [`--icon-${props.iconPosition}`]: !!props.iconPosition,\n            '--selected': selected,\n            '--wide': props.wide,\n            '--success': props.validationStatus === 'success',\n            '--error': props.validationStatus === 'error',\n            '--disabled': inputProperties?.disabled,\n        },\n        props.className\n    );\n    const onFocusHandler = () => {\n        return setSelected(true);\n    };\n    const onBlurHandler = () => {\n        return setSelected(false);\n    };\n\n    return (\n        <>\n            {props.label && (\n                <label className=\"text-bold d-flex u-marg-bottom--lighter\" htmlFor={inputProperties.id}>\n                    <>\n                        {props.label}\n                        {props?.required && <div style={{ color: 'red' }}>*</div>}\n                    </>\n                </label>\n            )}\n            <label className={classes}>\n                {icon}\n                <input {...inputProperties} ref={ref} value={props.value} onFocus={onFocusHandler} onBlur={onBlurHandler} onKeyPress={props.onKeyPress} />\n            </label>\n        </>\n    );\n};\n\nexport default React.forwardRef(TextBox);\n"]}

package/dist/src/components/generic/badging/SSLSecureBadge.js

@@ -6,8 +6,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const RoomstayThemeEngine_1 = __importDefault(require("../../../providers/RoomstayThemeEngine"));
 const Tooltip_1 = __importDefault(require("../Tooltip/Tooltip"));
+const react_i18next_1 = require("react-i18next");
+const Translation_1 = require("../../../translations/Translation");
 function SSLSecureBadge() {
-    return (react_1.default.createElement(Tooltip_1.default, { title: "Shop without worries! This site is protected by high level encryption, to ensure every purchase is always safe & secure" },
+    const { t } = (0, react_i18next_1.useTranslation)();
+    return (react_1.default.createElement(Tooltip_1.default, { title: t(Translation_1.Translation.Step.Confirmation.SSLSecure) },
         react_1.default.createElement("img", { src: RoomstayThemeEngine_1.default.getAssetUrl() + 'assets/img/ssl-secure-connection.png' })));
 }
 exports.default = SSLSecureBadge;

package/dist/src/components/generic/badging/SSLSecureBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"SSLSecureBadge.js","sourceRoot":"/","sources":["src/components/generic/badging/SSLSecureBadge.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,0FAAkE;AAClE,mFAA2D;AAE3D,SAAwB,cAAc;IAClC,OAAO,CACH,8BAAC,iBAAO,IAAC,KAAK,EAAC,yHAAyH;QACpI,uCAAK,GAAG,EAAE,6BAAmB,CAAC,WAAW,EAAE,GAAG,sCAAsC,GAAI,CAClF,CACb,CAAC;AACN,CAAC;AAND,iCAMC","sourcesContent":["import React from 'react';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\n\nexport default function SSLSecureBadge() {\n    return (\n        <Tooltip title=\"Shop without worries! This site is protected by high level encryption, to ensure every purchase is always safe & secure\">\n            <img src={RoomstayThemeEngine.getAssetUrl() + 'assets/img/ssl-secure-connection.png'} />\n        </Tooltip>\n    );\n}\n"]}
+{"version":3,"file":"SSLSecureBadge.js","sourceRoot":"/","sources":["src/components/generic/badging/SSLSecureBadge.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,0FAAkE;AAClE,mFAA2D;AAC3D,iDAA+C;AAC/C,4DAAyD;AAEzD,SAAwB,cAAc;IAClC,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,OAAO,CACH,8BAAC,iBAAO,IAAC,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;QACtD,uCAAK,GAAG,EAAE,6BAAmB,CAAC,WAAW,EAAE,GAAG,sCAAsC,GAAI,CAClF,CACb,CAAC;AACN,CAAC;AAPD,iCAOC","sourcesContent":["import React from 'react';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from '@/translations/Translation';\n\nexport default function SSLSecureBadge() {\n    const { t } = useTranslation();\n    return (\n        <Tooltip title={t(Translation.Step.Confirmation.SSLSecure)}>\n            <img src={RoomstayThemeEngine.getAssetUrl() + 'assets/img/ssl-secure-connection.png'} />\n        </Tooltip>\n    );\n}\n"]}

package/dist/src/components/generic/buttons/NextStepButton.d.ts

@@ -1,8 +1,5 @@
-import Step from '../../../pages/steps/Step';
 export interface NextStepButtonProps {
     text: string;
-    history: any;
-    currentStep: Step;
     disabled?: boolean;
     isLoading?: boolean;
     onClick?: () => Promise<unknown>;

package/dist/src/components/generic/buttons/NextStepButton.js

@@ -19,11 +19,14 @@ const Icon_1 = require("../Icon/Icon");
 const ScreenSize_1 = __importDefault(require("../../../util/ScreenSize"));
 const StepManager_1 = __importDefault(require("../../../util/StepManager"));
 const contexts_1 = require("../../../contexts/index.js");
+const HistoryConsistentPush_1 = require("../../../hooks/HistoryConsistentPush");
 function NextStepButton(props) {
     const context = (0, react_2.useContext)(contexts_1.BookingEngineContext);
+    const { currentStep } = (0, react_2.useContext)(contexts_1.FullPageEngineContext);
+    const historyConsistentPush = (0, HistoryConsistentPush_1.useHistoryConsistentPush)();
     const buttonClickHandler = () => __awaiter(this, void 0, void 0, function* () {
         if (!props.onClick || (props.onClick && (yield props.onClick()))) {
-            props.history.push(StepManager_1.default.getNextStepUrl(props.currentStep));
+            historyConsistentPush(StepManager_1.default.getNextStepUrl(currentStep));
         }
     });
     return (react_1.default.createElement("div", { className: "next-step-button" },

package/dist/src/components/generic/buttons/NextStepButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"NextStepButton.js","sourceRoot":"/","sources":["src/components/generic/buttons/NextStepButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,iCAAmC;AACnC,6EAAqD;AACrD,yDAA0D;AAE1D,mEAA2C;AAE3C,qEAA6C;AAC7C,iDAA0D;AAe1D,SAAwB,cAAc,CAAC,KAA0B;IAC7D,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IACjD,MAAM,kBAAkB,GAAG,GAAS,EAAE;QAClC,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,MAAM,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE;YAC9D,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,qBAAW,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC;SACrE;IACL,CAAC,CAAA,CAAC;IACF,OAAO,CACH,uCAAK,SAAS,EAAC,kBAAkB;QAC7B,8BAAC,kBAAQ,IACL,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,eAAQ,CAAC,UAAU,EACtD,YAAY,EAAC,OAAO,EACpB,MAAM,QACN,OAAO,QACP,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,IAAI,EAAE,KAAK,CAAC,aAAa,IAAI,OAAO,CAAC,UAAU,IAAI,oBAAU,CAAC,MAAM,EACpE,OAAO,EAAE,kBAAkB,IAE1B,KAAK,CAAC,IAAI,CACJ,CACT,CACT,CAAC;AACN,CAAC;AAxBD,iCAwBC","sourcesContent":["import React from 'react';\nimport { useContext } from 'react';\nimport BEButton from '@/components/generic/BEButton';\nimport { IconType } from '@/components/generic/Icon/Icon';\n\nimport ScreenSize from '@/util/ScreenSize';\nimport Step from '@/pages/steps/Step';\nimport StepManager from '@/util/StepManager';\nimport { BookingEngineContext } from '@frontend/contexts';\n\nexport interface NextStepButtonProps {\n    text: string;\n    history: any;\n    currentStep: Step;\n\n    disabled?: boolean;\n    isLoading?: boolean;\n    onClick?: () => Promise<unknown>;\n    wideByDefault?: boolean;\n\n    hideIcon?: boolean;\n}\n\nexport default function NextStepButton(props: NextStepButtonProps) {\n    const context = useContext(BookingEngineContext);\n    const buttonClickHandler = async () => {\n        if (!props.onClick || (props.onClick && (await props.onClick()))) {\n            props.history.push(StepManager.getNextStepUrl(props.currentStep));\n        }\n    };\n    return (\n        <div className=\"next-step-button\">\n            <BEButton\n                size=\"large\"\n                icon={props.hideIcon ? undefined : IconType.ArrowRight}\n                iconPosition=\"right\"\n                filled\n                primary\n                isLoading={props.isLoading}\n                disabled={props.disabled}\n                wide={props.wideByDefault || context.screenSize <= ScreenSize.Medium}\n                onClick={buttonClickHandler}\n            >\n                {props.text}\n            </BEButton>\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"NextStepButton.js","sourceRoot":"/","sources":["src/components/generic/buttons/NextStepButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,iCAAmC;AACnC,6EAAqD;AACrD,yDAA0D;AAE1D,mEAA2C;AAC3C,qEAA6C;AAC7C,iDAAiF;AACjF,yEAAyE;AAWzE,SAAwB,cAAc,CAAC,KAA0B;IAC7D,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IACjD,MAAM,EAAE,WAAW,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAC1D,MAAM,qBAAqB,GAAG,IAAA,gDAAwB,GAAE,CAAC;IACzD,MAAM,kBAAkB,GAAG,GAAS,EAAE;QAClC,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,IAAI,CAAC,MAAM,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE;YAC9D,qBAAqB,CAAC,qBAAW,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,CAAC;SAClE;IACL,CAAC,CAAA,CAAC;IACF,OAAO,CACH,uCAAK,SAAS,EAAC,kBAAkB;QAC7B,8BAAC,kBAAQ,IACL,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,eAAQ,CAAC,UAAU,EACtD,YAAY,EAAC,OAAO,EACpB,MAAM,QACN,OAAO,QACP,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,IAAI,EAAE,KAAK,CAAC,aAAa,IAAI,OAAO,CAAC,UAAU,IAAI,oBAAU,CAAC,MAAM,EACpE,OAAO,EAAE,kBAAkB,IAE1B,KAAK,CAAC,IAAI,CACJ,CACT,CACT,CAAC;AACN,CAAC;AA1BD,iCA0BC","sourcesContent":["import React from 'react';\nimport { useContext } from 'react';\nimport BEButton from '@/components/generic/BEButton';\nimport { IconType } from '@/components/generic/Icon/Icon';\n\nimport ScreenSize from '@/util/ScreenSize';\nimport StepManager from '@/util/StepManager';\nimport { BookingEngineContext, FullPageEngineContext } from '@frontend/contexts';\nimport { useHistoryConsistentPush } from '@/hooks/HistoryConsistentPush';\n\nexport interface NextStepButtonProps {\n    text: string;\n    disabled?: boolean;\n    isLoading?: boolean;\n    onClick?: () => Promise<unknown>;\n    wideByDefault?: boolean;\n    hideIcon?: boolean;\n}\n\nexport default function NextStepButton(props: NextStepButtonProps) {\n    const context = useContext(BookingEngineContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n    const historyConsistentPush = useHistoryConsistentPush();\n    const buttonClickHandler = async () => {\n        if (!props.onClick || (props.onClick && (await props.onClick()))) {\n            historyConsistentPush(StepManager.getNextStepUrl(currentStep));\n        }\n    };\n    return (\n        <div className=\"next-step-button\">\n            <BEButton\n                size=\"large\"\n                icon={props.hideIcon ? undefined : IconType.ArrowRight}\n                iconPosition=\"right\"\n                filled\n                primary\n                isLoading={props.isLoading}\n                disabled={props.disabled}\n                wide={props.wideByDefault || context.screenSize <= ScreenSize.Medium}\n                onClick={buttonClickHandler}\n            >\n                {props.text}\n            </BEButton>\n        </div>\n    );\n}\n"]}

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

@@ -1,12 +1,36 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const react_2 = require("react");
+const react_1 = __importStar(require("react"));
 const web_1 = require("@react-spring/web");
 const Text_1 = __importDefault(require("../Text"));
+const react_i18next_1 = require("react-i18next");
+const Translation_1 = require("../../../translations/Translation");
 const paths = [
     'M21 16V14L13 9V3.5C13 2.67 12.33 2 11.5 2C10.67 2 10 2.67 10 3.5V9L2 14V16L10 13.5V19L8 20.5V22L11.5 21L15 22V20.5L13 19V13.5L21 16Z',
     'M20.57 14.86L22 13.43L20.57 12L17 15.57L8.43 7L12 3.43L10.57 2L9.14 3.43L7.71 2L5.57 4.14L4.14 2.71L2.71 4.14L4.14 5.57L2 7.71L3.43 9.14L2 10.57L3.43 12L7 8.43L15.57 17L12 20.57L13.43 22L14.86 20.57L16.29 22L18.43 19.86L19.86 21.29L21.29 19.86L19.86 18.43L22 16.29L20.57 14.86Z',
@@ -14,9 +38,10 @@ const paths = [
 ];
 const local = [];
 function LargeLoader() {
-    const [interpolators, setInterpolators] = (0, react_2.useState)([]);
-    const [index, setIndex] = (0, react_2.useState)(0);
-    (0, react_2.useEffect)(() => {
+    const [interpolators, setInterpolators] = (0, react_1.useState)([]);
+    const [index, setIndex] = (0, react_1.useState)(0);
+    const { t } = (0, react_i18next_1.useTranslation)();
+    (0, react_1.useEffect)(() => {
         if (local.length === 0) {
             for (let i = 0; i < paths.length; i++) {
                 const nextIndex = paths[i + 1] || paths[0];
@@ -47,7 +72,7 @@ function LargeLoader() {
             react_1.default.createElement("g", { fill: "var(--rs-color-accent-1)" },
                 react_1.default.createElement(web_1.Spring, { reset: true, from: { t: 0 }, to: { t: 1 }, onRest: onRestHandler }, ({ t }) => react_1.default.createElement(web_1.animated.path, { className: "c-image-blank-slate", d: interpolators.length ? t.to(interpolators[index]) : paths[0] })))),
         react_1.default.createElement("div", { className: "u-marg-top" },
-            react_1.default.createElement(Text_1.default, null, "Loading"))));
+            react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Misc.Loading)))));
 }
 exports.default = LargeLoader;
 //# sourceMappingURL=LargeLoader.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"LargeLoader.js","sourceRoot":"/","sources":["src/components/generic/loader/LargeLoader.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,iCAA4C;AAC5C,2CAAqD;AACrD,qEAA6C;AAE7C,MAAM,KAAK,GAAG;IACV,sIAAsI;IACtI,uRAAuR;IACvR,sGAAsG;CACzG,CAAC;AAEF,MAAM,KAAK,GAAU,EAAE,CAAC;AAExB,SAAwB,WAAW;IAC/B,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAQ,EAAE,CAAC,CAAC;IAC9D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,CAAC,CAAC,CAAC;IAEtC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;YACpB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBACnC,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;gBAE3C,IAAI,OAAO,IAAI,KAAK,WAAW,EAAE;oBAC7B,2EAA2E;oBAE3E,gBAAgB,CAAC,KAAK,CAAC,CAAC;iBAC3B;aACJ;SACJ;aAAM;YACH,gBAAgB,CAAC,KAAK,CAAC,CAAC;SAC3B;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,MAAM,GAAG,GAAG,EAAE;QAChB,UAAU,CAAC,GAAG,EAAE;YACZ,QAAQ,CAAC,KAAK,GAAG,CAAC,IAAI,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;QAChE,CAAC,EAAE,GAAG,CAAC,CAAC;IACZ,CAAC,CAAC;IACF,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,OAAO,MAAM,EAAE,CAAC;IACpB,CAAC,CAAC;IACF,OAAO,CACH,uCAAK,SAAS,EAAC,cAAc;QACzB,uCAAK,SAAS,EAAC,qBAAqB,GAAG;QACvC,uCAAK,SAAS,EAAC,+BAA+B,GAAG;QACjD,uCAAK,SAAS,EAAC,+BAA+B,GAAG;QACjD,uCAAK,SAAS,EAAC,+BAA+B,GAAG;QAEjD,uCAAK,KAAK,EAAC,KAAK,EAAC,OAAO,EAAC,WAAW;YAChC,qCAAG,IAAI,EAAC,0BAA0B;gBAC9B,8BAAC,YAAM,IAAC,KAAK,QAAC,IAAI,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,aAAa,IAC5D,CAAC,EAAE,CAAC,EAAO,EAAE,EAAE,CAAC,8BAAC,cAAQ,CAAC,IAAI,IAAC,SAAS,EAAC,qBAAqB,EAAC,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAI,CAC9H,CACT,CACF;QACN,uCAAK,SAAS,EAAC,YAAY;YACvB,8BAAC,cAAI,kBAAe,CAClB,CACJ,CACT,CAAC;AACN,CAAC;AA/CD,8BA+CC","sourcesContent":["import React from 'react';\nimport { useState, useEffect } from 'react';\nimport { Spring, animated } from '@react-spring/web';\nimport Text from '@/components/generic/Text';\n\nconst paths = [\n    'M21 16V14L13 9V3.5C13 2.67 12.33 2 11.5 2C10.67 2 10 2.67 10 3.5V9L2 14V16L10 13.5V19L8 20.5V22L11.5 21L15 22V20.5L13 19V13.5L21 16Z',\n    'M20.57 14.86L22 13.43L20.57 12L17 15.57L8.43 7L12 3.43L10.57 2L9.14 3.43L7.71 2L5.57 4.14L4.14 2.71L2.71 4.14L4.14 5.57L2 7.71L3.43 9.14L2 10.57L3.43 12L7 8.43L15.57 17L12 20.57L13.43 22L14.86 20.57L16.29 22L18.43 19.86L19.86 21.29L21.29 19.86L19.86 18.43L22 16.29L20.57 14.86Z',\n    'M10 15.27L16.18 19L14.54 11.97L20 7.24L12.81 6.63L10 0L7.19 6.63L0 7.24L5.46 11.97L3.82 19L10 15.27Z',\n];\n\nconst local: any[] = [];\n\nexport default function LargeLoader() {\n    const [interpolators, setInterpolators] = useState<any[]>([]);\n    const [index, setIndex] = useState(0);\n\n    useEffect(() => {\n        if (local.length === 0) {\n            for (let i = 0; i < paths.length; i++) {\n                const nextIndex = paths[i + 1] || paths[0];\n\n                if (typeof jest === 'undefined') {\n                    // local.push(interpolate(paths[i], nextIndex, { maxSegmentLength: 0.1 }));\n\n                    setInterpolators(local);\n                }\n            }\n        } else {\n            setInterpolators(local);\n        }\n    }, []);\n\n    const goNext = () => {\n        setTimeout(() => {\n            setIndex(index + 1 >= interpolators.length ? 0 : index + 1);\n        }, 300);\n    };\n    const onRestHandler = () => {\n        return goNext();\n    };\n    return (\n        <div className=\"large-loader\">\n            <div className=\"large-loader-circle\" />\n            <div className=\"large-loader-circle --delay-2\" />\n            <div className=\"large-loader-circle --delay-4\" />\n            <div className=\"large-loader-circle --delay-6\" />\n\n            <svg width=\"180\" viewBox=\"0 0 22 22\">\n                <g fill=\"var(--rs-color-accent-1)\">\n                    <Spring reset from={{ t: 0 }} to={{ t: 1 }} onRest={onRestHandler}>\n                        {({ t }: any) => <animated.path className=\"c-image-blank-slate\" d={interpolators.length ? t.to(interpolators[index]) : paths[0]} />}\n                    </Spring>\n                </g>\n            </svg>\n            <div className=\"u-marg-top\">\n                <Text>Loading</Text>\n            </div>\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"LargeLoader.js","sourceRoot":"/","sources":["src/components/generic/loader/LargeLoader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAmD;AACnD,2CAAqD;AACrD,qEAA6C;AAC7C,iDAA+C;AAC/C,4DAAyD;AAEzD,MAAM,KAAK,GAAG;IACV,sIAAsI;IACtI,uRAAuR;IACvR,sGAAsG;CACzG,CAAC;AAEF,MAAM,KAAK,GAAU,EAAE,CAAC;AAExB,SAAwB,WAAW;IAC/B,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAQ,EAAE,CAAC,CAAC;IAC9D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,CAAC,CAAC,CAAC;IACtC,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;YACpB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBACnC,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;gBAE3C,IAAI,OAAO,IAAI,KAAK,WAAW,EAAE;oBAC7B,2EAA2E;oBAE3E,gBAAgB,CAAC,KAAK,CAAC,CAAC;iBAC3B;aACJ;SACJ;aAAM;YACH,gBAAgB,CAAC,KAAK,CAAC,CAAC;SAC3B;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,MAAM,GAAG,GAAG,EAAE;QAChB,UAAU,CAAC,GAAG,EAAE;YACZ,QAAQ,CAAC,KAAK,GAAG,CAAC,IAAI,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;QAChE,CAAC,EAAE,GAAG,CAAC,CAAC;IACZ,CAAC,CAAC;IACF,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,OAAO,MAAM,EAAE,CAAC;IACpB,CAAC,CAAC;IACF,OAAO,CACH,uCAAK,SAAS,EAAC,cAAc;QACzB,uCAAK,SAAS,EAAC,qBAAqB,GAAG;QACvC,uCAAK,SAAS,EAAC,+BAA+B,GAAG;QACjD,uCAAK,SAAS,EAAC,+BAA+B,GAAG;QACjD,uCAAK,SAAS,EAAC,+BAA+B,GAAG;QAEjD,uCAAK,KAAK,EAAC,KAAK,EAAC,OAAO,EAAC,WAAW;YAChC,qCAAG,IAAI,EAAC,0BAA0B;gBAC9B,8BAAC,YAAM,IAAC,KAAK,QAAC,IAAI,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,aAAa,IAC5D,CAAC,EAAE,CAAC,EAAO,EAAE,EAAE,CAAC,8BAAC,cAAQ,CAAC,IAAI,IAAC,SAAS,EAAC,qBAAqB,EAAC,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAI,CAC9H,CACT,CACF;QACN,uCAAK,SAAS,EAAC,YAAY;YACvB,8BAAC,cAAI,QAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAQ,CACxC,CACJ,CACT,CAAC;AACN,CAAC;AAhDD,8BAgDC","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { animated, Spring } from '@react-spring/web';\nimport Text from '@/components/generic/Text';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from '@/translations/Translation';\n\nconst paths = [\n    'M21 16V14L13 9V3.5C13 2.67 12.33 2 11.5 2C10.67 2 10 2.67 10 3.5V9L2 14V16L10 13.5V19L8 20.5V22L11.5 21L15 22V20.5L13 19V13.5L21 16Z',\n    'M20.57 14.86L22 13.43L20.57 12L17 15.57L8.43 7L12 3.43L10.57 2L9.14 3.43L7.71 2L5.57 4.14L4.14 2.71L2.71 4.14L4.14 5.57L2 7.71L3.43 9.14L2 10.57L3.43 12L7 8.43L15.57 17L12 20.57L13.43 22L14.86 20.57L16.29 22L18.43 19.86L19.86 21.29L21.29 19.86L19.86 18.43L22 16.29L20.57 14.86Z',\n    'M10 15.27L16.18 19L14.54 11.97L20 7.24L12.81 6.63L10 0L7.19 6.63L0 7.24L5.46 11.97L3.82 19L10 15.27Z',\n];\n\nconst local: any[] = [];\n\nexport default function LargeLoader() {\n    const [interpolators, setInterpolators] = useState<any[]>([]);\n    const [index, setIndex] = useState(0);\n    const { t } = useTranslation();\n\n    useEffect(() => {\n        if (local.length === 0) {\n            for (let i = 0; i < paths.length; i++) {\n                const nextIndex = paths[i + 1] || paths[0];\n\n                if (typeof jest === 'undefined') {\n                    // local.push(interpolate(paths[i], nextIndex, { maxSegmentLength: 0.1 }));\n\n                    setInterpolators(local);\n                }\n            }\n        } else {\n            setInterpolators(local);\n        }\n    }, []);\n\n    const goNext = () => {\n        setTimeout(() => {\n            setIndex(index + 1 >= interpolators.length ? 0 : index + 1);\n        }, 300);\n    };\n    const onRestHandler = () => {\n        return goNext();\n    };\n    return (\n        <div className=\"large-loader\">\n            <div className=\"large-loader-circle\" />\n            <div className=\"large-loader-circle --delay-2\" />\n            <div className=\"large-loader-circle --delay-4\" />\n            <div className=\"large-loader-circle --delay-6\" />\n\n            <svg width=\"180\" viewBox=\"0 0 22 22\">\n                <g fill=\"var(--rs-color-accent-1)\">\n                    <Spring reset from={{ t: 0 }} to={{ t: 1 }} onRest={onRestHandler}>\n                        {({ t }: any) => <animated.path className=\"c-image-blank-slate\" d={interpolators.length ? t.to(interpolators[index]) : paths[0]} />}\n                    </Spring>\n                </g>\n            </svg>\n            <div className=\"u-marg-top\">\n                <Text>{t(Translation.Misc.Loading)}</Text>\n            </div>\n        </div>\n    );\n}\n"]}

package/dist/src/components/generic/modal/ConfirmationModal.js

@@ -30,7 +30,10 @@ const react_1 = __importDefault(require("react"));
 const SimpleModal_1 = __importStar(require("./SimpleModal"));
 const BEButton_1 = __importDefault(require("../BEButton"));
 const Text_1 = __importDefault(require("../Text"));
+const react_i18next_1 = require("react-i18next");
+const Translation_1 = require("../../../translations/Translation");
 function ConfirmationModal(props) {
+    const { t } = (0, react_i18next_1.useTranslation)();
     const cancelOnClickHandler = () => {
         if (props.onClose) {
             props.onClose();
@@ -42,9 +45,9 @@ function ConfirmationModal(props) {
         }
     };
     const footer = (react_1.default.createElement("div", { className: "u-flex" },
-        react_1.default.createElement(BEButton_1.default, { isText: true, onClick: cancelOnClickHandler }, "Cancel"),
-        react_1.default.createElement(BEButton_1.default, { filled: true, primary: true, onClick: onConfirmationClick }, "Yes")));
-    return (react_1.default.createElement(SimpleModal_1.default, { open: props.open, alignCenter: true, desktopFooter: react_1.default.createElement("div", { className: "u-marg-heavy u-marg@m-" }, footer), mobileFooter: footer, size: SimpleModal_1.SimpleModalSize.Small, title: "Confirm" },
+        react_1.default.createElement(BEButton_1.default, { isText: true, onClick: cancelOnClickHandler }, t(Translation_1.Translation.Misc.Cancel)),
+        react_1.default.createElement(BEButton_1.default, { filled: true, primary: true, onClick: onConfirmationClick }, t(Translation_1.Translation.Misc.Yes))));
+    return (react_1.default.createElement(SimpleModal_1.default, { open: props.open, alignCenter: true, desktopFooter: react_1.default.createElement("div", { className: "u-marg-heavy u-marg@m-" }, footer), mobileFooter: footer, size: SimpleModal_1.SimpleModalSize.Small, title: t(Translation_1.Translation.Step.Room.Confirm) },
         react_1.default.createElement("div", { className: "u-marg-heavy u-marg@m-" },
             react_1.default.createElement("div", { className: "u-marg-bottom" },
                 react_1.default.createElement(Text_1.default, null, props.message)))));

package/dist/src/components/generic/modal/ConfirmationModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmationModal.js","sourceRoot":"/","sources":["src/components/generic/modal/ConfirmationModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,sFAAsF;AACtF,6EAAqD;AACrD,qEAA6C;AAU7C,SAAwB,iBAAiB,CAAC,KAA6B;IACnE,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAC9B,IAAI,KAAK,CAAC,OAAO,EAAE;YACf,KAAK,CAAC,OAAO,EAAE,CAAC;SACnB;IACL,CAAC,CAAC;IACF,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC7B,IAAI,KAAK,CAAC,SAAS,EAAE;YACjB,KAAK,CAAC,SAAS,EAAE,CAAC;SACrB;IACL,CAAC,CAAC;IACF,MAAM,MAAM,GAAG,CACX,uCAAK,SAAS,EAAC,QAAQ;QACnB,8BAAC,kBAAQ,IAAC,MAAM,QAAC,OAAO,EAAE,oBAAoB,aAEnC;QACX,8BAAC,kBAAQ,IAAC,MAAM,QAAC,OAAO,QAAC,OAAO,EAAE,mBAAmB,UAE1C,CACT,CACT,CAAC;IAEF,OAAO,CACH,8BAAC,qBAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,WAAW,QACX,aAAa,EAAE,uCAAK,SAAS,EAAC,wBAAwB,IAAE,MAAM,CAAO,EACrE,YAAY,EAAE,MAAM,EACpB,IAAI,EAAE,6BAAe,CAAC,KAAK,EAC3B,KAAK,EAAC,SAAS;QAEf,uCAAK,SAAS,EAAC,wBAAwB;YACnC,uCAAK,SAAS,EAAC,eAAe;gBAC1B,8BAAC,cAAI,QAAE,KAAK,CAAC,OAAO,CAAQ,CAC1B,CACJ,CACI,CACjB,CAAC;AACN,CAAC;AAtCD,oCAsCC","sourcesContent":["import React from 'react';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport BEButton from '@/components/generic/BEButton';\nimport Text from '@/components/generic/Text';\n\nexport interface ConfirmationModalProps {\n    open: boolean;\n    onClose?: () => void;\n    onConfirm: () => void;\n\n    message: string;\n}\n\nexport default function ConfirmationModal(props: ConfirmationModalProps) {\n    const cancelOnClickHandler = () => {\n        if (props.onClose) {\n            props.onClose();\n        }\n    };\n    const onConfirmationClick = () => {\n        if (props.onConfirm) {\n            props.onConfirm();\n        }\n    };\n    const footer = (\n        <div className=\"u-flex\">\n            <BEButton isText onClick={cancelOnClickHandler}>\n                Cancel\n            </BEButton>\n            <BEButton filled primary onClick={onConfirmationClick}>\n                Yes\n            </BEButton>\n        </div>\n    );\n\n    return (\n        <SimpleModal\n            open={props.open}\n            alignCenter\n            desktopFooter={<div className=\"u-marg-heavy u-marg@m-\">{footer}</div>}\n            mobileFooter={footer}\n            size={SimpleModalSize.Small}\n            title=\"Confirm\"\n        >\n            <div className=\"u-marg-heavy u-marg@m-\">\n                <div className=\"u-marg-bottom\">\n                    <Text>{props.message}</Text>\n                </div>\n            </div>\n        </SimpleModal>\n    );\n}\n"]}
+{"version":3,"file":"ConfirmationModal.js","sourceRoot":"/","sources":["src/components/generic/modal/ConfirmationModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,sFAAsF;AACtF,6EAAqD;AACrD,qEAA6C;AAC7C,iDAA+C;AAC/C,4DAAyD;AAUzD,SAAwB,iBAAiB,CAAC,KAA6B;IACnE,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAC9B,IAAI,KAAK,CAAC,OAAO,EAAE;YACf,KAAK,CAAC,OAAO,EAAE,CAAC;SACnB;IACL,CAAC,CAAC;IACF,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC7B,IAAI,KAAK,CAAC,SAAS,EAAE;YACjB,KAAK,CAAC,SAAS,EAAE,CAAC;SACrB;IACL,CAAC,CAAC;IACF,MAAM,MAAM,GAAG,CACX,uCAAK,SAAS,EAAC,QAAQ;QACnB,8BAAC,kBAAQ,IAAC,MAAM,QAAC,OAAO,EAAE,oBAAoB,IACzC,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CACpB;QACX,8BAAC,kBAAQ,IAAC,MAAM,QAAC,OAAO,QAAC,OAAO,EAAE,mBAAmB,IAChD,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CACjB,CACT,CACT,CAAC;IAEF,OAAO,CACH,8BAAC,qBAAW,IACR,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,WAAW,QACX,aAAa,EAAE,uCAAK,SAAS,EAAC,wBAAwB,IAAE,MAAM,CAAO,EACrE,YAAY,EAAE,MAAM,EACpB,IAAI,EAAE,6BAAe,CAAC,KAAK,EAC3B,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;QAEvC,uCAAK,SAAS,EAAC,wBAAwB;YACnC,uCAAK,SAAS,EAAC,eAAe;gBAC1B,8BAAC,cAAI,QAAE,KAAK,CAAC,OAAO,CAAQ,CAC1B,CACJ,CACI,CACjB,CAAC;AACN,CAAC;AAvCD,oCAuCC","sourcesContent":["import React from 'react';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport BEButton from '@/components/generic/BEButton';\nimport Text from '@/components/generic/Text';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from '@/translations/Translation';\n\nexport interface ConfirmationModalProps {\n    open: boolean;\n    onClose?: () => void;\n    onConfirm: () => void;\n\n    message: string;\n}\n\nexport default function ConfirmationModal(props: ConfirmationModalProps) {\n    const { t } = useTranslation();\n    const cancelOnClickHandler = () => {\n        if (props.onClose) {\n            props.onClose();\n        }\n    };\n    const onConfirmationClick = () => {\n        if (props.onConfirm) {\n            props.onConfirm();\n        }\n    };\n    const footer = (\n        <div className=\"u-flex\">\n            <BEButton isText onClick={cancelOnClickHandler}>\n                {t(Translation.Misc.Cancel)}\n            </BEButton>\n            <BEButton filled primary onClick={onConfirmationClick}>\n                {t(Translation.Misc.Yes)}\n            </BEButton>\n        </div>\n    );\n\n    return (\n        <SimpleModal\n            open={props.open}\n            alignCenter\n            desktopFooter={<div className=\"u-marg-heavy u-marg@m-\">{footer}</div>}\n            mobileFooter={footer}\n            size={SimpleModalSize.Small}\n            title={t(Translation.Step.Room.Confirm)}\n        >\n            <div className=\"u-marg-heavy u-marg@m-\">\n                <div className=\"u-marg-bottom\">\n                    <Text>{props.message}</Text>\n                </div>\n            </div>\n        </SimpleModal>\n    );\n}\n"]}

package/dist/src/components/generic/modal/SigninModal/AuthenticatedUserModal.d.ts

@@ -1,9 +1,21 @@
 import { ReactElement } from 'react';
-type AuthenticatedUserModalProps = {
+import { IconType } from '../../Icon/Icon';
+import { Placement } from '@popperjs/core';
+export type AuthenticatedUserModalProps = {
     open: boolean;
     anchorEl?: HTMLElement | null;
+    placement?: Placement;
+    fallbackPlacements?: Placement;
     containerEl?: HTMLElement;
+    menuItems?: MenuItemType[];
+    basePath?: string;
     onClose?: () => void;
+    onSignedOut?: () => void;
+    onCloseMenu?: () => void;
+};
+export type MenuItemType = {
+    icon: IconType;
+    text: string;
+    link: string;
 };
 export declare const AuthenticatedUserModal: (props: AuthenticatedUserModalProps) => ReactElement | null;
-export {};