@roomstay/frontend 2.1.0 → 2.1.2

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

@@ -1 +1 @@
-{"version":3,"file":"SimpleModal.js","sourceRoot":"/","sources":["src/components/generic/modal/SimpleModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Text from 'components/generic/Text';\nimport { Color } from 'util/Color';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport { useContext, useEffect, useState, useRef } from 'react';\nimport classNames from 'classnames';\n\nimport ScreenSize from 'util/ScreenSize';\nimport FadeAnimation from 'animations/Fade';\n\nimport { BookingEngineContext } from '@frontend/contexts';\n\nimport styles from './SimpleModal.module.scss';\nimport { RoomstayPortal } from 'components/generic/Portal/Portal';\nimport { useBodyClick } from '@frontend/hooks';\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;\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(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'], {\n        [(styles as any)[props.size]]: !!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"]}
+{"version":3,"file":"SimpleModal.js","sourceRoot":"/","sources":["src/components/generic/modal/SimpleModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Text from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { useContext, useEffect, useState, useRef } from 'react';\nimport classNames from 'classnames';\n\nimport ScreenSize from '@/util/ScreenSize';\nimport FadeAnimation from 'animations/Fade';\n\nimport { BookingEngineContext } from '@frontend/contexts';\n\nimport styles from './SimpleModal.module.scss';\nimport { RoomstayPortal } from '@/components/generic/Portal/Portal';\nimport { useBodyClick } from '@frontend/hooks';\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;\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(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'], {\n        [(styles as any)[props.size]]: !!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"]}

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

@@ -29,7 +29,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const SimpleModal_1 = __importStar(require("./SimpleModal"));
 const React = __importStar(require("react"));
 const react_1 = require("react");
-const BEButton_1 = __importDefault(require("components/generic/BEButton"));
+const BEButton_1 = __importDefault(require("../../../../components/generic/BEButton"));
 function TabbedModal(props) {
     var _a;
     const [openTab, setOpenTab] = (0, react_1.useState)((_a = props.openTab) !== null && _a !== void 0 ? _a : '');

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

@@ -1 +1 @@
-{"version":3,"file":"TabbedModal.js","sourceRoot":"/","sources":["src/components/generic/modal/TabbedModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6DAA6D;AAC7D,6CAA+B;AAC/B,iCAA4C;AAC5C,2EAAmD;AAiBnD,SAAwB,WAAW,CAAC,KAAoB;;IACpD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAC,MAAA,KAAK,CAAC,OAAO,mCAAI,EAAE,CAAC,CAAC;IAE5D,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,OAAO,EAAE;YACT,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;SAC7B;IACL,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAEpB,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,YAAY,GAAG,GAAG,EAAE;QACtB,OAAO,KAAK,CAAC,OAAO,EAAE,CAAC;IAC3B,CAAC,CAAC;IACF,OAAO,CACH,oBAAC,qBAAW,IACR,KAAK,EAAE,UAAU,CAAC,KAAK,EACvB,IAAI,EAAE,KAAK,CAAC,MAAM,EAClB,IAAI,EAAE,6BAAe,CAAC,KAAK,EAC3B,aAAa,EAAE,6BAAK,SAAS,EAAC,wBAAwB,IAAE,UAAU,CAAC,MAAM,CAAO,EAChF,YAAY,EAAE,UAAU,CAAC,MAAM,EAC/B,OAAO,EAAE,YAAY;QAErB,6BAAK,SAAS,EAAC,wBAAwB;YACnC,6BAAK,SAAS,EAAC,uBAAuB;gBAClC,6BAAK,SAAS,EAAC,6BAA6B,IACvC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;oBACjC,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;oBAChC,MAAM,cAAc,GAAG,GAAG,EAAE;wBACxB,UAAU,CAAC,GAAG,CAAC,CAAC;oBACpB,CAAC,CAAC;oBACF,OAAO,CACH,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAC,4BAA4B;wBACjD,oBAAC,kBAAQ,IAAC,MAAM,EAAE,UAAU,CAAC,KAAK,KAAK,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,cAAc,IACvF,OAAO,CAAC,KAAK,CACP,CACT,CACT,CAAC;gBACN,CAAC,CAAC,CACA;gBACN,6BAAK,SAAS,EAAC,sBAAsB,IAAE,UAAU,CAAC,OAAO,CAAO,CAC9D,CACJ,CACI,CACjB,CAAC;AACN,CAAC;AA5CD,8BA4CC","sourcesContent":["import SimpleModal, { SimpleModalSize } from './SimpleModal';\nimport * as React from 'react';\nimport { useState, useEffect } from 'react';\nimport BEButton from 'components/generic/BEButton';\n\nexport interface TabbedModalTab {\n    title: string;\n    content: React.ReactElement | any;\n    footer: React.ReactElement | any;\n}\n\ninterface TabModalProps {\n    isOpen: boolean;\n\n    tabs: { [name: string]: TabbedModalTab };\n    onClose: () => void;\n\n    openTab?: string;\n}\n\nexport default function TabbedModal(props: TabModalProps) {\n    const [openTab, setOpenTab] = useState(props.openTab ?? '');\n\n    useEffect(() => {\n        if (openTab) {\n            setOpenTab(props.openTab);\n        }\n    }, [props.openTab]);\n\n    const currentTab = props.tabs[openTab];\n    const onModalClose = () => {\n        return props.onClose();\n    };\n    return (\n        <SimpleModal\n            title={currentTab.title}\n            open={props.isOpen}\n            size={SimpleModalSize.Small}\n            desktopFooter={<div className=\"u-marg-heavy u-marg@m-\">{currentTab.footer}</div>}\n            mobileFooter={currentTab.footer}\n            onClose={onModalClose}\n        >\n            <div className=\"u-marg-heavy u-marg@m-\">\n                <div className=\"roomstay-tabbed-modal\">\n                    <div className=\"roomstay-tabbed-modal--tabs\">\n                        {Object.keys(props.tabs).map((key) => {\n                            const thisTab = props.tabs[key];\n                            const openTabOnClick = () => {\n                                setOpenTab(key);\n                            };\n                            return (\n                                <div key={key} className=\"roomstay-tabbed-modal--tab\">\n                                    <BEButton filled={currentTab.title === thisTab.title} primary={true} onClick={openTabOnClick}>\n                                        {thisTab.title}\n                                    </BEButton>\n                                </div>\n                            );\n                        })}\n                    </div>\n                    <div className=\"roomstay-tab-content\">{currentTab.content}</div>\n                </div>\n            </div>\n        </SimpleModal>\n    );\n}\n"]}
+{"version":3,"file":"TabbedModal.js","sourceRoot":"/","sources":["src/components/generic/modal/TabbedModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6DAA6D;AAC7D,6CAA+B;AAC/B,iCAA4C;AAC5C,6EAAqD;AAiBrD,SAAwB,WAAW,CAAC,KAAoB;;IACpD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAC,MAAA,KAAK,CAAC,OAAO,mCAAI,EAAE,CAAC,CAAC;IAE5D,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,OAAO,EAAE;YACT,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;SAC7B;IACL,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAEpB,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,YAAY,GAAG,GAAG,EAAE;QACtB,OAAO,KAAK,CAAC,OAAO,EAAE,CAAC;IAC3B,CAAC,CAAC;IACF,OAAO,CACH,oBAAC,qBAAW,IACR,KAAK,EAAE,UAAU,CAAC,KAAK,EACvB,IAAI,EAAE,KAAK,CAAC,MAAM,EAClB,IAAI,EAAE,6BAAe,CAAC,KAAK,EAC3B,aAAa,EAAE,6BAAK,SAAS,EAAC,wBAAwB,IAAE,UAAU,CAAC,MAAM,CAAO,EAChF,YAAY,EAAE,UAAU,CAAC,MAAM,EAC/B,OAAO,EAAE,YAAY;QAErB,6BAAK,SAAS,EAAC,wBAAwB;YACnC,6BAAK,SAAS,EAAC,uBAAuB;gBAClC,6BAAK,SAAS,EAAC,6BAA6B,IACvC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;oBACjC,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;oBAChC,MAAM,cAAc,GAAG,GAAG,EAAE;wBACxB,UAAU,CAAC,GAAG,CAAC,CAAC;oBACpB,CAAC,CAAC;oBACF,OAAO,CACH,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAC,4BAA4B;wBACjD,oBAAC,kBAAQ,IAAC,MAAM,EAAE,UAAU,CAAC,KAAK,KAAK,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,cAAc,IACvF,OAAO,CAAC,KAAK,CACP,CACT,CACT,CAAC;gBACN,CAAC,CAAC,CACA;gBACN,6BAAK,SAAS,EAAC,sBAAsB,IAAE,UAAU,CAAC,OAAO,CAAO,CAC9D,CACJ,CACI,CACjB,CAAC;AACN,CAAC;AA5CD,8BA4CC","sourcesContent":["import SimpleModal, { SimpleModalSize } from './SimpleModal';\nimport * as React from 'react';\nimport { useState, useEffect } from 'react';\nimport BEButton from '@/components/generic/BEButton';\n\nexport interface TabbedModalTab {\n    title: string;\n    content: React.ReactElement | any;\n    footer: React.ReactElement | any;\n}\n\ninterface TabModalProps {\n    isOpen: boolean;\n\n    tabs: { [name: string]: TabbedModalTab };\n    onClose: () => void;\n\n    openTab?: string;\n}\n\nexport default function TabbedModal(props: TabModalProps) {\n    const [openTab, setOpenTab] = useState(props.openTab ?? '');\n\n    useEffect(() => {\n        if (openTab) {\n            setOpenTab(props.openTab);\n        }\n    }, [props.openTab]);\n\n    const currentTab = props.tabs[openTab];\n    const onModalClose = () => {\n        return props.onClose();\n    };\n    return (\n        <SimpleModal\n            title={currentTab.title}\n            open={props.isOpen}\n            size={SimpleModalSize.Small}\n            desktopFooter={<div className=\"u-marg-heavy u-marg@m-\">{currentTab.footer}</div>}\n            mobileFooter={currentTab.footer}\n            onClose={onModalClose}\n        >\n            <div className=\"u-marg-heavy u-marg@m-\">\n                <div className=\"roomstay-tabbed-modal\">\n                    <div className=\"roomstay-tabbed-modal--tabs\">\n                        {Object.keys(props.tabs).map((key) => {\n                            const thisTab = props.tabs[key];\n                            const openTabOnClick = () => {\n                                setOpenTab(key);\n                            };\n                            return (\n                                <div key={key} className=\"roomstay-tabbed-modal--tab\">\n                                    <BEButton filled={currentTab.title === thisTab.title} primary={true} onClick={openTabOnClick}>\n                                        {thisTab.title}\n                                    </BEButton>\n                                </div>\n                            );\n                        })}\n                    </div>\n                    <div className=\"roomstay-tab-content\">{currentTab.content}</div>\n                </div>\n            </div>\n        </SimpleModal>\n    );\n}\n"]}

package/dist/src/components/generic/radio/RadioFields.js

@@ -27,8 +27,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const React = __importStar(require("react"));
-const Icon_1 = __importStar(require("components/generic/Icon/Icon"));
-const Text_1 = __importStar(require("components/generic/Text"));
+const Icon_1 = __importStar(require("../../../../components/generic/Icon/Icon"));
+const Text_1 = __importStar(require("../../../../components/generic/Text"));
 const classnames_1 = __importDefault(require("classnames"));
 const styles = __importStar(require("./RadioFields.module.scss"));
 const cx = classnames_1.default.bind(styles);

package/dist/src/components/generic/radio/RadioFields.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioFields.js","sourceRoot":"/","sources":["src/components/generic/radio/RadioFields.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,qEAA8D;AAC9D,gEAAyD;AAEzD,4DAAoC;AAEpC,kEAAoD;AACpD,MAAM,EAAE,GAAG,oBAAU,CAAC,IAAI,CAAC,MAAa,CAAC,CAAC;AAkB1C,SAAwB,WAAW,CAAC,KAAuB;IACvD,MAAM,OAAO,GAAG,EAAE,CAAC;QACf,aAAa,EAAE,IAAI;KACtB,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,EAAE,CAAC;QAClB,YAAY,EAAE,IAAI;QAClB,sBAAsB,EAAE,IAAI;KAC/B,CAAC,CAAC;IAEH,OAAO,CACH,6BAAK,SAAS,EAAE,OAAO;QAClB,KAAK,CAAC,KAAK,IAAI,CACZ,6BAAK,SAAS,EAAC,0BAA0B;YACrC,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,IACjC,KAAK,CAAC,KAAK,CACT,CACL,CACT;QACA,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YACjC,MAAM,gBAAgB,GAAG,GAAG,EAAE;gBAC1B,IAAI,KAAK,CAAC,QAAQ,EAAE;oBAChB,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;iBAC1B;YACL,CAAC,CAAC;YAEF,OAAO,CACH,+BAAO,SAAS,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK;gBACpC,+BAAO,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,gBAAgB,GAAI;gBACzF,8BAAM,SAAS,EAAC,YAAY;oBACxB,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,GAAI,CAC3B;gBACP,oBAAC,cAAI,IAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK,IACnC,MAAM,CAAC,KAAK,CACV,CACH,CACX,CAAC;QACN,CAAC,CAAC,CACA,CACT,CAAC;AACN,CAAC;AAxCD,8BAwCC","sourcesContent":["import * as React from 'react';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport Text, { TextType } from 'components/generic/Text';\n\nimport classNames from 'classnames';\n\nimport * as styles from './RadioFields.module.scss';\nconst cx = classNames.bind(styles as any);\n\ninterface RadioFieldOption {\n    label: string;\n    value: string;\n    selected?: boolean;\n}\n\ninterface RadioFieldsProps {\n    label: string;\n\n    name: string;\n\n    options: RadioFieldOption[];\n\n    onChange: (selectedOption: RadioFieldOption) => void;\n}\n\nexport default function RadioFields(props: RadioFieldsProps) {\n    const classes = cx({\n        'radio-group': true,\n    });\n\n    const rowClasses = cx({\n        'radio-item': true,\n        'u-marg-bottom--light': true,\n    });\n\n    return (\n        <div className={classes}>\n            {props.label && (\n                <div className=\"u-marg-bottom u-marg-top\">\n                    <Text type={TextType.Small} bold={true}>\n                        {props.label}\n                    </Text>\n                </div>\n            )}\n            {props.options.map((option, index) => {\n                const onChangeCallback = () => {\n                    if (props.onChange) {\n                        props.onChange(option);\n                    }\n                };\n\n                return (\n                    <label className={rowClasses} key={index}>\n                        <input name={props.name} type=\"radio\" value={option.value} onChange={onChangeCallback} />\n                        <span className=\"fake-radio\">\n                            <Icon icon={IconType.Check} />\n                        </span>\n                        <Text inline={true} type={TextType.Small}>\n                            {option.label}\n                        </Text>\n                    </label>\n                );\n            })}\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"RadioFields.js","sourceRoot":"/","sources":["src/components/generic/radio/RadioFields.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,uEAAgE;AAChE,kEAA2D;AAE3D,4DAAoC;AAEpC,kEAAoD;AACpD,MAAM,EAAE,GAAG,oBAAU,CAAC,IAAI,CAAC,MAAa,CAAC,CAAC;AAkB1C,SAAwB,WAAW,CAAC,KAAuB;IACvD,MAAM,OAAO,GAAG,EAAE,CAAC;QACf,aAAa,EAAE,IAAI;KACtB,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,EAAE,CAAC;QAClB,YAAY,EAAE,IAAI;QAClB,sBAAsB,EAAE,IAAI;KAC/B,CAAC,CAAC;IAEH,OAAO,CACH,6BAAK,SAAS,EAAE,OAAO;QAClB,KAAK,CAAC,KAAK,IAAI,CACZ,6BAAK,SAAS,EAAC,0BAA0B;YACrC,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,IACjC,KAAK,CAAC,KAAK,CACT,CACL,CACT;QACA,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YACjC,MAAM,gBAAgB,GAAG,GAAG,EAAE;gBAC1B,IAAI,KAAK,CAAC,QAAQ,EAAE;oBAChB,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;iBAC1B;YACL,CAAC,CAAC;YAEF,OAAO,CACH,+BAAO,SAAS,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK;gBACpC,+BAAO,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,gBAAgB,GAAI;gBACzF,8BAAM,SAAS,EAAC,YAAY;oBACxB,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,GAAI,CAC3B;gBACP,oBAAC,cAAI,IAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK,IACnC,MAAM,CAAC,KAAK,CACV,CACH,CACX,CAAC;QACN,CAAC,CAAC,CACA,CACT,CAAC;AACN,CAAC;AAxCD,8BAwCC","sourcesContent":["import * as React from 'react';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\n\nimport classNames from 'classnames';\n\nimport * as styles from './RadioFields.module.scss';\nconst cx = classNames.bind(styles as any);\n\ninterface RadioFieldOption {\n    label: string;\n    value: string;\n    selected?: boolean;\n}\n\ninterface RadioFieldsProps {\n    label: string;\n\n    name: string;\n\n    options: RadioFieldOption[];\n\n    onChange: (selectedOption: RadioFieldOption) => void;\n}\n\nexport default function RadioFields(props: RadioFieldsProps) {\n    const classes = cx({\n        'radio-group': true,\n    });\n\n    const rowClasses = cx({\n        'radio-item': true,\n        'u-marg-bottom--light': true,\n    });\n\n    return (\n        <div className={classes}>\n            {props.label && (\n                <div className=\"u-marg-bottom u-marg-top\">\n                    <Text type={TextType.Small} bold={true}>\n                        {props.label}\n                    </Text>\n                </div>\n            )}\n            {props.options.map((option, index) => {\n                const onChangeCallback = () => {\n                    if (props.onChange) {\n                        props.onChange(option);\n                    }\n                };\n\n                return (\n                    <label className={rowClasses} key={index}>\n                        <input name={props.name} type=\"radio\" value={option.value} onChange={onChangeCallback} />\n                        <span className=\"fake-radio\">\n                            <Icon icon={IconType.Check} />\n                        </span>\n                        <Text inline={true} type={TextType.Small}>\n                            {option.label}\n                        </Text>\n                    </label>\n                );\n            })}\n        </div>\n    );\n}\n"]}

package/dist/src/components/members/EditMyProfile.js

@@ -38,13 +38,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const React = __importStar(require("react"));
 const react_1 = require("react");
 const react_hook_form_1 = require("react-hook-form");
-const CountryCodesAndNumbers_1 = require("models/CountryCodesAndNumbers");
-const EnhancedPhoneNumberField_1 = __importDefault(require("components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField"));
-const ForwardedSelect_1 = __importDefault(require("components/generic/ForwardedSelect"));
-const LargeLoader_1 = __importDefault(require("components/generic/loader/LargeLoader"));
-const TextBox_1 = __importDefault(require("components/generic/TextBox"));
-const contexts_1 = require("@frontend/contexts");
-const InputGroup_1 = __importDefault(require("components/generic/InputGroup/InputGroup"));
+const CountryCodesAndNumbers_1 = require("../../../models/CountryCodesAndNumbers");
+const EnhancedPhoneNumberField_1 = __importDefault(require("../../../components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField"));
+const ForwardedSelect_1 = __importDefault(require("../../../components/generic/ForwardedSelect"));
+const LargeLoader_1 = __importDefault(require("../../../components/generic/loader/LargeLoader"));
+const TextBox_1 = __importDefault(require("../../../components/generic/TextBox"));
+const contexts_1 = require("../../../contexts/index.js");
+const InputGroup_1 = __importDefault(require("../../../components/generic/InputGroup/InputGroup"));
 const PasswordBox_1 = require("../generic/PasswordBox/PasswordBox");
 const EditMyProfile = () => {
     var _a, _b;

package/dist/src/components/members/EditMyProfile.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditMyProfile.js","sourceRoot":"/","sources":["src/components/members/EditMyProfile.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,iCAAuD;AAEvD,qDAAsD;AAEtD,0EAAwE;AAExE,2IAAmH;AACnH,yFAAmF;AACnF,wFAAgE;AAChE,yEAAiD;AACjD,iDAAmG;AACnG,0FAAkE;AAClE,oEAAiE;AAEjE,MAAM,aAAa,GAAa,GAAG,EAAE;;IACjC,MAAM,EAAE,cAAc,EAAE,OAAO,EAAE,mBAAmB,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAC3F,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAElE,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAA,yBAAO,EAAoC;QAC/G,aAAa,EAAE,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,cAAc,EAAE,CAAC,cAAc,CAAC,CAAC;KACjE,CAAC,CAAC;IAEH,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,KAAK,CAAC,cAAc,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC,CAAC;IAE5B,MAAM,QAAQ,GAAG,CAAO,IAAuC,EAAE,EAAE;QAC/D,IAAI,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,eAAe,MAAI,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,CAAA,KAAI,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,eAAe,CAAA,EAAE;YACrE,IAAI,IAAI,CAAC,WAAW,KAAK,IAAI,CAAC,eAAe,EAAE;gBAC3C,QAAQ,CAAC,iBAAiB,EAAE,EAAE,OAAO,EAAE,uBAAuB,EAAE,CAAC,CAAC;gBAClE,OAAO;aACV;SACJ;QACD,MAAM,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAChC,KAAK,iCAAM,cAAc,KAAE,eAAe,EAAE,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,eAAe,EAAE,EAAE,IAAG,CAAC;IAC5F,CAAC,CAAA,CAAC;IAEF,MAAM,gBAAgB,GAAmB,IAAA,eAAO,EAAC,GAAG,EAAE;QAClD,MAAM,SAAS,GAAG,gDAAuB,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;QACxF,SAAS,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;QAC5C,OAAO,SAAS,CAAC;IACrB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,kBAAkB,GAAG,CAAC,KAAgD,EAAE,EAAE;QAC5E,IAAI,SAAS,CAAC,MAAM,IAAI,SAAS,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE;YACpD,IAAI,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE;gBACzB,OAAO,OAAO,CAAC;aAClB;iBAAM;gBACH,OAAO,SAAS,CAAC;aACpB;SACJ;aAAM;YACH,OAAO,IAAI,CAAC;SACf;IACL,CAAC,CAAC;IAEF,OAAO,CACH,0CACK,cAAc,CAAC,CAAC,CAAC,CACd;QACI,8BAAM,QAAQ,EAAE,YAAY,CAAC,QAAQ,CAAC;YAClC,oBAAC,oBAAU;gBACP;oBACI,+BAAO,SAAS,EAAC,iBAAiB,EAAC,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,KAAK,GAAI,CACpF;gBACH,oBAAC,iBAAO,oBAAK,QAAQ,CAAC,UAAU,CAAC,IAAE,KAAK,EAAC,UAAU,IAAG;gBACtD,oBAAC,iBAAO,oBAAK,QAAQ,CAAC,SAAS,CAAC,IAAE,KAAK,EAAC,SAAS,IAAG;gBACpD;oBACI,oBAAC,4BAAU,IACP,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,aAAa,EAClB,KAAK,EAAE;4BACH,SAAS,EAAE;gCACP,KAAK,EAAE,EAAE;gCACT,OAAO,EAAE,0BAA0B;6BACtC;4BACD,OAAO,EAAE;gCACL,KAAK,EAAE,yBAAyB;gCAChC,OAAO,EAAE,gCAAgC;6BAC5C;yBACJ,EACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,oBAAC,kCAAwB,oBAAK,KAAK,IAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,gBAAgB,EAAE,kBAAkB,CAAC,aAAa,CAAC,IAAI,GAC/I,CACH,CACM;YAEb,oBAAC,oBAAU;gBACP,oBAAC,iBAAO,oBAAK,QAAQ,CAAC,iBAAiB,CAAC,IAAE,KAAK,EAAC,SAAS,IAAG;gBAC5D,oBAAC,iBAAO,oBAAK,QAAQ,CAAC,cAAc,CAAC,IAAE,KAAK,EAAC,MAAM,IAAG;gBACtD,oBAAC,oBAAU,IAAC,UAAU,EAAC,KAAK;oBACxB,oBAAC,iBAAO,kBAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,IAAM,QAAQ,CAAC,aAAa,CAAC,IAAE,KAAK,EAAC,KAAK,IAAG;oBACnF,oBAAC,yBAAe,oBAAK,QAAQ,CAAC,iBAAiB,CAAC,IAAE,OAAO,EAAE,gBAAgB,EAAE,KAAK,EAAC,SAAS,IAAG,CACtF,CACJ;YAEb,oBAAC,oBAAU;gBACP,oBAAC,yBAAW,oBAAK,QAAQ,CAAC,iBAAiB,CAAC,IAAE,KAAK,EAAC,kBAAkB,IAAG;gBACzE,oBAAC,yBAAW,oBACJ,QAAQ,CAAC,aAAa,EAAE;oBACxB,OAAO,EAAE;wBACL,KAAK,EAAE,qFAAqF;wBAC5F,OAAO,EAAE,wHAAwH;qBACpI;iBACJ,CAAC,IACF,KAAK,EAAC,cAAc,EACpB,KAAK,EAAE,MAAA,SAAS,CAAC,MAAM,0CAAG,aAAa,CAAC,IAC1C;gBACF,oBAAC,yBAAW,oBACJ,QAAQ,CAAC,iBAAiB,EAAE;oBAC5B,OAAO,EAAE;wBACL,KAAK,EAAE,qFAAqF;wBAC5F,OAAO,EAAE,0HAA0H;qBACtI;iBACJ,CAAC,IACF,KAAK,EAAC,kBAAkB,EACxB,KAAK,EAAE,MAAA,SAAS,CAAC,MAAM,0CAAG,iBAAiB,CAAC,IAC9C;gBACD,YAAY,IAAI,CACb,2BAAG,SAAS,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,IAChD,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,CACtB,CACP,CACQ;YAEb,gCAAQ,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAC,SAAS,uBAE/C,CACN,CAIL,CACT,CAAC,CAAC,CAAC,CACA,oBAAC,qBAAW,OAAG,CAClB,CACF,CACN,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,aAAa,CAAC","sourcesContent":["import * as React from 'react';\nimport { useContext, useEffect, useMemo } from 'react';\n\nimport { Controller, useForm } from 'react-hook-form';\n\nimport { ListOfCountriesAndCodes } from 'models/CountryCodesAndNumbers';\nimport { IRoomstayMember } from '@roomstay/core';\nimport EnhancedPhoneNumberField from 'components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField';\nimport ForwardedSelect, { SelectOption } from 'components/generic/ForwardedSelect';\nimport LargeLoader from 'components/generic/loader/LargeLoader';\nimport TextBox from 'components/generic/TextBox';\nimport { AuthenticationContext, IChangePassword, RoomstayMemberContext } from '@frontend/contexts';\nimport InputGroup from 'components/generic/InputGroup/InputGroup';\nimport { PasswordBox } from '../generic/PasswordBox/PasswordBox';\n\nconst EditMyProfile: React.FC = () => {\n    const { roomstayMember, loading, updateMemberDetails } = useContext(RoomstayMemberContext);\n    const { error: cognitoError } = useContext(AuthenticationContext);\n\n    const { handleSubmit, register, reset, control, formState, setError } = useForm<IRoomstayMember & IChangePassword>({\n        defaultValues: useMemo(() => roomstayMember, [roomstayMember]),\n    });\n\n    useEffect(() => {\n        reset(roomstayMember);\n    }, [roomstayMember, reset]);\n\n    const onSubmit = async (data: IRoomstayMember & IChangePassword) => {\n        if (data?.currentPassword || data?.newPassword || data?.confirmPassword) {\n            if (data.newPassword !== data.confirmPassword) {\n                setError('confirmPassword', { message: \"Passwords don't match\" });\n                return;\n            }\n        }\n        await updateMemberDetails(data);\n        reset({ ...roomstayMember, currentPassword: '', newPassword: '', confirmPassword: '' });\n    };\n\n    const countriesOptions: SelectOption[] = useMemo(() => {\n        const countries = ListOfCountriesAndCodes.map(({ label }) => ({ label, value: label }));\n        countries.unshift({ label: '', value: '' });\n        return countries;\n    }, []);\n\n    const getValidationClass = (field: keyof (IRoomstayMember & IChangePassword)) => {\n        if (formState.errors && formState.touchedFields[field]) {\n            if (formState.errors[field]) {\n                return 'error';\n            } else {\n                return 'success';\n            }\n        } else {\n            return null;\n        }\n    };\n\n    return (\n        <>\n            {roomstayMember ? (\n                <div>\n                    <form onSubmit={handleSubmit(onSubmit)}>\n                        <InputGroup>\n                            <>\n                                <input className=\"c-input textbox\" disabled={true} value={roomstayMember?.email} />\n                            </>\n                            <TextBox {...register('forename')} label=\"Forename\" />\n                            <TextBox {...register('surname')} label=\"Surname\" />\n                            <>\n                                <Controller\n                                    control={control}\n                                    name=\"phoneNumber\"\n                                    rules={{\n                                        maxLength: {\n                                            value: 17,\n                                            message: 'Phone number is too long',\n                                        },\n                                        pattern: {\n                                            value: /^\\+[1-9](\\ |\\d){1,15}$/g,\n                                            message: 'Incorrect phone number entered',\n                                        },\n                                    }}\n                                    render={({ field }) => <EnhancedPhoneNumberField {...field} onChange={field.onChange} validationStatus={getValidationClass('phoneNumber')} />}\n                                />\n                            </>\n                        </InputGroup>\n\n                        <InputGroup>\n                            <TextBox {...register('address.address')} label=\"Address\" />\n                            <TextBox {...register('address.city')} label=\"City\" />\n                            <InputGroup dimensions=\"2/2\">\n                                <TextBox inputProps={{ className: '' }} {...register('address.zip')} label=\"Zip\" />\n                                <ForwardedSelect {...register('address.country')} options={countriesOptions} label=\"Country\" />\n                            </InputGroup>\n                        </InputGroup>\n\n                        <InputGroup>\n                            <PasswordBox {...register('currentPassword')} label=\"Current Password\" />\n                            <PasswordBox\n                                {...register('newPassword', {\n                                    pattern: {\n                                        value: /(?=.*\\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[\\^$*.\\[\\]{}\\(\\)?\\-\\\"!@#%&\\/,><\\':;|_~`]).{8,99}/,\n                                        message: 'Your password requires at least 8 characters with: 1 uppercase letter, lowercase letter, number, and special character',\n                                    },\n                                })}\n                                label=\"New Password\"\n                                error={formState.errors?.['newPassword']}\n                            />\n                            <PasswordBox\n                                {...register('confirmPassword', {\n                                    pattern: {\n                                        value: /(?=.*\\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[\\^$*.\\[\\]{}\\(\\)?\\-\\\"!@#%&\\/,><\\':;|_~`]).{8,99}/,\n                                        message: 'Your password requires at least 8 characters with: 1 uppercase letter, 1 lowercase letter, 1 number, 1 special character',\n                                    },\n                                })}\n                                label=\"Confirm Password\"\n                                error={formState.errors?.['confirmPassword']}\n                            />\n                            {cognitoError && (\n                                <p className=\"text-small\" style={{ color: '#ED4362' }}>\n                                    {cognitoError?.message}\n                                </p>\n                            )}\n                        </InputGroup>\n\n                        <button type=\"submit\" disabled={loading} color=\"primary\">\n                            Save all changes\n                        </button>\n                    </form>\n                    {/* <Backdrop open={loading} style={{ zIndex: 1234 }}>\n                        <LargeLoader />\n                    </Backdrop> */}\n                </div>\n            ) : (\n                <LargeLoader />\n            )}\n        </>\n    );\n};\n\nexport default EditMyProfile;\n"]}
+{"version":3,"file":"EditMyProfile.js","sourceRoot":"/","sources":["src/components/members/EditMyProfile.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useContext, useEffect, useMemo } from 'react';\n\nimport { Controller, useForm } from 'react-hook-form';\n\nimport { ListOfCountriesAndCodes } from '@/models/CountryCodesAndNumbers';\nimport { IRoomstayMember } from '@roomstay/core';\nimport EnhancedPhoneNumberField from '@/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField';\nimport ForwardedSelect, { SelectOption } from '@/components/generic/ForwardedSelect';\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport TextBox from '@/components/generic/TextBox';\nimport { AuthenticationContext, IChangePassword, RoomstayMemberContext } from '@frontend/contexts';\nimport InputGroup from '@/components/generic/InputGroup/InputGroup';\nimport { PasswordBox } from '../generic/PasswordBox/PasswordBox';\n\nconst EditMyProfile: React.FC = () => {\n    const { roomstayMember, loading, updateMemberDetails } = useContext(RoomstayMemberContext);\n    const { error: cognitoError } = useContext(AuthenticationContext);\n\n    const { handleSubmit, register, reset, control, formState, setError } = useForm<IRoomstayMember & IChangePassword>({\n        defaultValues: useMemo(() => roomstayMember, [roomstayMember]),\n    });\n\n    useEffect(() => {\n        reset(roomstayMember);\n    }, [roomstayMember, reset]);\n\n    const onSubmit = async (data: IRoomstayMember & IChangePassword) => {\n        if (data?.currentPassword || data?.newPassword || data?.confirmPassword) {\n            if (data.newPassword !== data.confirmPassword) {\n                setError('confirmPassword', { message: \"Passwords don't match\" });\n                return;\n            }\n        }\n        await updateMemberDetails(data);\n        reset({ ...roomstayMember, currentPassword: '', newPassword: '', confirmPassword: '' });\n    };\n\n    const countriesOptions: SelectOption[] = useMemo(() => {\n        const countries = ListOfCountriesAndCodes.map(({ label }) => ({ label, value: label }));\n        countries.unshift({ label: '', value: '' });\n        return countries;\n    }, []);\n\n    const getValidationClass = (field: keyof (IRoomstayMember & IChangePassword)) => {\n        if (formState.errors && formState.touchedFields[field]) {\n            if (formState.errors[field]) {\n                return 'error';\n            } else {\n                return 'success';\n            }\n        } else {\n            return null;\n        }\n    };\n\n    return (\n        <>\n            {roomstayMember ? (\n                <div>\n                    <form onSubmit={handleSubmit(onSubmit)}>\n                        <InputGroup>\n                            <>\n                                <input className=\"c-input textbox\" disabled={true} value={roomstayMember?.email} />\n                            </>\n                            <TextBox {...register('forename')} label=\"Forename\" />\n                            <TextBox {...register('surname')} label=\"Surname\" />\n                            <>\n                                <Controller\n                                    control={control}\n                                    name=\"phoneNumber\"\n                                    rules={{\n                                        maxLength: {\n                                            value: 17,\n                                            message: 'Phone number is too long',\n                                        },\n                                        pattern: {\n                                            value: /^\\+[1-9](\\ |\\d){1,15}$/g,\n                                            message: 'Incorrect phone number entered',\n                                        },\n                                    }}\n                                    render={({ field }) => <EnhancedPhoneNumberField {...field} onChange={field.onChange} validationStatus={getValidationClass('phoneNumber')} />}\n                                />\n                            </>\n                        </InputGroup>\n\n                        <InputGroup>\n                            <TextBox {...register('address.address')} label=\"Address\" />\n                            <TextBox {...register('address.city')} label=\"City\" />\n                            <InputGroup dimensions=\"2/2\">\n                                <TextBox inputProps={{ className: '' }} {...register('address.zip')} label=\"Zip\" />\n                                <ForwardedSelect {...register('address.country')} options={countriesOptions} label=\"Country\" />\n                            </InputGroup>\n                        </InputGroup>\n\n                        <InputGroup>\n                            <PasswordBox {...register('currentPassword')} label=\"Current Password\" />\n                            <PasswordBox\n                                {...register('newPassword', {\n                                    pattern: {\n                                        value: /(?=.*\\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[\\^$*.\\[\\]{}\\(\\)?\\-\\\"!@#%&\\/,><\\':;|_~`]).{8,99}/,\n                                        message: 'Your password requires at least 8 characters with: 1 uppercase letter, lowercase letter, number, and special character',\n                                    },\n                                })}\n                                label=\"New Password\"\n                                error={formState.errors?.['newPassword']}\n                            />\n                            <PasswordBox\n                                {...register('confirmPassword', {\n                                    pattern: {\n                                        value: /(?=.*\\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[\\^$*.\\[\\]{}\\(\\)?\\-\\\"!@#%&\\/,><\\':;|_~`]).{8,99}/,\n                                        message: 'Your password requires at least 8 characters with: 1 uppercase letter, 1 lowercase letter, 1 number, 1 special character',\n                                    },\n                                })}\n                                label=\"Confirm Password\"\n                                error={formState.errors?.['confirmPassword']}\n                            />\n                            {cognitoError && (\n                                <p className=\"text-small\" style={{ color: '#ED4362' }}>\n                                    {cognitoError?.message}\n                                </p>\n                            )}\n                        </InputGroup>\n\n                        <button type=\"submit\" disabled={loading} color=\"primary\">\n                            Save all changes\n                        </button>\n                    </form>\n                    {/* <Backdrop open={loading} style={{ zIndex: 1234 }}>\n                        <LargeLoader />\n                    </Backdrop> */}\n                </div>\n            ) : (\n                <LargeLoader />\n            )}\n        </>\n    );\n};\n\nexport default EditMyProfile;\n"]}

package/dist/src/components/navigation/Header.js

@@ -28,26 +28,26 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const React = __importStar(require("react"));
 const react_1 = require("react");
-const Icon_1 = __importStar(require("components/generic/Icon/Icon"));
-const Color_1 = require("util/Color");
+const Icon_1 = __importStar(require("../../../components/generic/Icon/Icon"));
+const Color_1 = require("../../../util/Color");
 const react_router_dom_1 = require("react-router-dom");
-const Text_1 = __importStar(require("components/generic/Text"));
+const Text_1 = __importStar(require("../../../components/generic/Text"));
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
-const BEButton_1 = __importDefault(require("components/generic/BEButton"));
-const LanguageProvider_1 = require("providers/LanguageProvider");
-const CurrencyProvider_1 = __importDefault(require("providers/CurrencyProvider"));
+const BEButton_1 = __importDefault(require("../../../components/generic/BEButton"));
+const LanguageProvider_1 = require("../../../providers/LanguageProvider");
+const CurrencyProvider_1 = __importDefault(require("../../../providers/CurrencyProvider"));
 const Fade_1 = __importDefault(require("animations/Fade"));
-const RoomstayThemeEngine_1 = __importDefault(require("providers/RoomstayThemeEngine"));
-const DataLayer_1 = __importDefault(require("util/DataLayer"));
-const hooks_1 = require("@frontend/hooks");
-const contexts_1 = require("@frontend/contexts");
-const StepHotel_1 = __importDefault(require("pages/steps/StepHotel/StepHotel"));
-const Portal_1 = require("components/generic/Portal/Portal");
-const UnauthenticatedUserModal_1 = require("components/generic/modal/SigninModal/UnauthenticatedUserModal");
-const AuthenticatedUserModal_1 = require("components/generic/modal/SigninModal/AuthenticatedUserModal");
-const MemberPortalFeature_1 = __importDefault(require("providers/feature/MemberPortalFeature"));
-const Select_1 = require("components/generic/Select/Select");
+const RoomstayThemeEngine_1 = __importDefault(require("../../../providers/RoomstayThemeEngine"));
+const DataLayer_1 = __importDefault(require("../../../util/DataLayer"));
+const hooks_1 = require("../../../hooks/index.js");
+const contexts_1 = require("../../../contexts/index.js");
+const StepHotel_1 = __importDefault(require("../../../pages/steps/StepHotel/StepHotel"));
+const Portal_1 = require("../../../components/generic/Portal/Portal");
+const UnauthenticatedUserModal_1 = require("../../../components/generic/modal/SigninModal/UnauthenticatedUserModal");
+const AuthenticatedUserModal_1 = require("../../../components/generic/modal/SigninModal/AuthenticatedUserModal");
+const MemberPortalFeature_1 = __importDefault(require("../../../providers/feature/MemberPortalFeature"));
+const Select_1 = require("../../../components/generic/Select/Select");
 function Header() {
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const ccx = (0, react_1.useContext)(contexts_1.CompanyContext);

package/dist/src/components/navigation/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sourceRoot":"/","sources":["src/components/navigation/Header.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useContext, useEffect, useState } from 'react';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport { Color } from 'util/Color';\nimport { Link, NavLink } from 'react-router-dom';\nimport Text, { TextTransform, TextType } from 'components/generic/Text';\n\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport BEButton from 'components/generic/BEButton';\nimport { Language, LanguageProvider } from 'providers/LanguageProvider';\nimport CurrencyProvider from 'providers/CurrencyProvider';\nimport FadeAnimation from 'animations/Fade';\nimport RoomstayThemeEngine from 'providers/RoomstayThemeEngine';\nimport DataLayer from 'util/DataLayer';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { CompanyContext, FullPageEngineContext, RoomstayMemberContext } from '@frontend/contexts';\nimport StepHotel from 'pages/steps/StepHotel/StepHotel';\nimport { RoomstayPortal } from 'components/generic/Portal/Portal';\nimport { UnauthenticatedUserModal } from 'components/generic/modal/SigninModal/UnauthenticatedUserModal';\nimport { AuthenticatedUserModal } from 'components/generic/modal/SigninModal/AuthenticatedUserModal';\nimport MemberPortalFeature from 'providers/feature/MemberPortalFeature';\nimport { IDefaultSelectOption, Select } from 'components/generic/Select/Select';\n\ninterface ILanguageSelectOption {\n    value: Language;\n    text: string;\n}\n\nexport default function Header() {\n    const { hotel } = useCurrentHotel();\n    const ccx = useContext(CompanyContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n\n    const { roomstayMember } = useContext(RoomstayMemberContext);\n\n    const loginAnchorEl = React.useRef(null);\n\n    const [hotelLogo, setHotelLogo] = useState('');\n    const [showHotelLinks, setShowHotelLinks] = useState(true);\n\n    const [mobileMenuOpen, setMobileMenuOpen] = useState(false);\n    const [mobileMenuFaderStatus, setMobileMenuFaderStatus] = useState(false);\n    const [loginModalOpen, setLoginModalOpen] = useState(false);\n\n    const { t } = useTranslation();\n\n    const availableLanguages = LanguageProvider.getLanguages();\n\n    const langKeys = Object.keys(availableLanguages);\n\n    const onLanguageChangeHandler = (selected: Language) => {\n        ccx.setCurrentLanguage(selected);\n        LanguageProvider.changeLanguage(selected);\n    };\n\n    const onCurrencyChangeHandler = (selected: string) => {\n        ccx.setCurrentCurrency(selected);\n        DataLayer.instance.setCurrencyCodes(selected);\n    };\n\n    const closeMobileMenuClickHandler = () => {\n        setMobileMenuFaderStatus(false);\n    };\n    const openMobileMenuClickHandler = () => {\n        setMobileMenuFaderStatus(true);\n    };\n    const closeLoginClickHandler = () => {\n        setLoginModalOpen(false);\n    };\n    const onLoginClickHandler = () => {\n        setLoginModalOpen(true);\n        closeMobileMenuClickHandler();\n    };\n\n    useEffect(() => {\n        let timeout: NodeJS.Timeout = null;\n\n        if (mobileMenuFaderStatus) {\n            setMobileMenuOpen(true);\n        } else {\n            timeout = setTimeout(() => {\n                setMobileMenuOpen(false);\n            }, 500);\n        }\n\n        return () => {\n            clearTimeout(timeout);\n        };\n    }, [mobileMenuFaderStatus]);\n\n    useEffect(() => {\n        let cancelled = false;\n\n        const loadImage = (src: string) => {\n            const image = new Image();\n            image.onload = () => {\n                if (!cancelled) {\n                    setHotelLogo(src);\n                }\n            };\n\n            image.src = src;\n        };\n\n        // Check the Logo per step\n        if (hotel && !(currentStep === StepHotel)) {\n            if (typeof hotel?.logo === 'string') {\n                loadImage(hotel?.logo);\n            }\n        } else {\n            loadImage(ccx.logo);\n        }\n\n        // Check wether we should display the hotel related links or not\n        setShowHotelLinks(currentStep !== StepHotel && !!hotel);\n\n        return () => {\n            cancelled = true;\n        };\n    }, [hotel, hotel?.logo, ccx.logo, currentStep]);\n\n    let hotelImageElement = hotelLogo ? <img src={hotelLogo} alt=\"Hotel Logo\" className=\"u-block\" /> : hotel?.logo;\n\n    if (typeof hotelImageElement === 'string' && !hotelImageElement.startsWith('<')) {\n        hotelImageElement = <img src={hotelImageElement} alt=\"Hotel Logo\" />;\n    }\n\n    const links = (\n        <ul className=\"c-header__list\">\n            <li>\n                <NavLink to=\"/hotel-info/\" activeClassName=\"is-active\" onClick={closeMobileMenuClickHandler}>\n                    <Text type={TextType.Small} color={Color.White}>\n                        <strong>{t(Translation.Navigation.HotelInfo)}</strong>\n                    </Text>\n                </NavLink>\n            </li>\n            <li>\n                {hotel?.forwardFindReservationToSynxis ? (\n                    <a href={`https://be.synxis.com/signin?hotel=${hotel?.hotelID}`} target=\"_blank\" rel=\"noreferrer\">\n                        <Text type={TextType.Small} color={Color.White} bold={true}>\n                            {t(Translation.Navigation.FindReservation)}\n                        </Text>\n                    </a>\n                ) : (\n                    <NavLink to=\"/find-reservation\" activeClassName=\"is-active\" onClick={closeMobileMenuClickHandler}>\n                        <Text type={TextType.Small} color={Color.White} bold={true}>\n                            {t(Translation.Navigation.FindReservation)}\n                        </Text>\n                    </NavLink>\n                )}\n            </li>\n            <li className=\"phone\">\n                <a href={`tel:${hotel?.phone}`} onClick={closeMobileMenuClickHandler}>\n                    <Text type={TextType.Small} transforms={[TextTransform.Uppercase]} color={Color.White}>\n                        <Icon icon={IconType.Phone} size=\"16px\" color={Color.White} />\n                        <strong className=\"u-marg-left--light\">{hotel?.phone}</strong>\n                    </Text>\n                </a>\n            </li>\n        </ul>\n    );\n\n    const configs = (\n        <>\n            <ul className=\"c-header__list\">\n                {langKeys.length > 1 && (\n                    <li>\n                        <Select<ILanguageSelectOption, 'value'>\n                            nativeOnMobile\n                            options={langKeys.map((lang: Language) => {\n                                return {\n                                    value: lang,\n                                    text: LanguageProvider.getPrettyLanguageName(lang),\n                                };\n                            })}\n                            value={ccx.currentLanguage}\n                            onChange={onLanguageChangeHandler}\n                            keyName=\"value\"\n                            labelName=\"text\"\n                        />\n                    </li>\n                )}\n                <li>\n                    <Select<IDefaultSelectOption, 'value'>\n                        nativeOnMobile\n                        options={CurrencyProvider.getCurrencyItems()}\n                        value={ccx.currentCurrency}\n                        onChange={onCurrencyChangeHandler}\n                        keyName=\"value\"\n                        labelName=\"text\"\n                    />\n                </li>\n\n                {MemberPortalFeature.isActive() && (\n                    <li ref={loginAnchorEl}>\n                        {roomstayMember ? (\n                            <BEButton size=\"small\" isText onClick={onLoginClickHandler} stopIconAnimation>\n                                {roomstayMember.forename} {roomstayMember.surname}\n                                <span className=\"u-white u-pad-left--light\" style={{ marginRight: -13 }}>\n                                    <Icon icon={IconType.ArrowDown2} size=\"1.3em\" color={Color.DarkGrey} />\n                                </span>\n                            </BEButton>\n                        ) : (\n                            <BEButton size=\"small\" isText onClick={onLoginClickHandler} stopIconAnimation>\n                                {t(Translation.Navigation.SignIn.SignIn)}\n                                <span className=\"u-white u-pad-left--light\" style={{ marginRight: -13 }}>\n                                    <Icon icon={IconType.ArrowDown2} size=\"1.3em\" color={Color.DarkGrey} />\n                                </span>\n                            </BEButton>\n                        )}\n                    </li>\n                )}\n            </ul>\n        </>\n    );\n\n    return (\n        <>\n            <div className=\"c-header u-print-none\">\n                <div className=\"container\">\n                    <div className=\"u-flex\">\n                        <div className=\"u-flex u-flex-flex-start u-flex__item\">\n                            <div className=\"c-header__logo\">\n                                <a href={showHotelLinks ? hotel?.hotelUrl : ccx?.logoLink} onClick={closeMobileMenuClickHandler}>\n                                    {hotelImageElement}\n                                </a>\n                            </div>\n                            {!!showHotelLinks && links}\n                        </div>\n                        <div className=\"u-flex mx-100\">\n                            {configs}\n                            <div className=\"c-header__mobile-menu\">\n                                <span className=\"u-white u-pad-left\">\n                                    <Icon icon={IconType.Menu} size=\"26px\" color={Color.White} onClick={openMobileMenuClickHandler} />\n                                </span>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            {mobileMenuOpen && (\n                <RoomstayPortal target={RoomstayThemeEngine.EngineContainer}>\n                    <FadeAnimation open={mobileMenuFaderStatus}>\n                        <div className={`mobile-header-menu ${mobileMenuFaderStatus ? '' : '--closing'}`}>\n                            <div className=\"mobile-header-menu--replica u-flex\">\n                                <div className=\"c-header__logo\">\n                                    <Link to=\"/\" onClick={closeMobileMenuClickHandler}>\n                                        {hotelImageElement}\n                                    </Link>\n                                </div>\n                                <div className=\"c-header__mobile-menu\">\n                                    <span className=\"u-white u-pad-left\">\n                                        <Icon icon={IconType.Close} size=\"26px\" color={Color.White} onClick={closeMobileMenuClickHandler} />\n                                    </span>\n                                </div>\n                            </div>\n                            <div className=\"mobile-header-menu--content\">\n                                {!!hotel && links}\n\n                                {configs}\n                            </div>\n                        </div>\n                    </FadeAnimation>\n                </RoomstayPortal>\n            )}\n            {MemberPortalFeature.isActive() && (\n                <>\n                    {roomstayMember ? (\n                        <AuthenticatedUserModal open={loginModalOpen} onClose={closeLoginClickHandler} anchorEl={loginAnchorEl.current} />\n                    ) : (\n                        <UnauthenticatedUserModal open={loginModalOpen} onClose={closeLoginClickHandler} anchorEl={loginAnchorEl.current} />\n                    )}\n                </>\n            )}\n        </>\n    );\n}\n"]}
+{"version":3,"file":"Header.js","sourceRoot":"/","sources":["src/components/navigation/Header.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useContext, useEffect, useState } from 'react';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport { Link, NavLink } from 'react-router-dom';\nimport Text, { TextTransform, TextType } from '@/components/generic/Text';\n\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport BEButton from '@/components/generic/BEButton';\nimport { Language, LanguageProvider } from '@/providers/LanguageProvider';\nimport CurrencyProvider from '@/providers/CurrencyProvider';\nimport FadeAnimation from 'animations/Fade';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport DataLayer from '@/util/DataLayer';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { CompanyContext, FullPageEngineContext, RoomstayMemberContext } from '@frontend/contexts';\nimport StepHotel from '@/pages/steps/StepHotel/StepHotel';\nimport { RoomstayPortal } from '@/components/generic/Portal/Portal';\nimport { UnauthenticatedUserModal } from '@/components/generic/modal/SigninModal/UnauthenticatedUserModal';\nimport { AuthenticatedUserModal } from '@/components/generic/modal/SigninModal/AuthenticatedUserModal';\nimport MemberPortalFeature from '@/providers/feature/MemberPortalFeature';\nimport { IDefaultSelectOption, Select } from '@/components/generic/Select/Select';\n\ninterface ILanguageSelectOption {\n    value: Language;\n    text: string;\n}\n\nexport default function Header() {\n    const { hotel } = useCurrentHotel();\n    const ccx = useContext(CompanyContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n\n    const { roomstayMember } = useContext(RoomstayMemberContext);\n\n    const loginAnchorEl = React.useRef(null);\n\n    const [hotelLogo, setHotelLogo] = useState('');\n    const [showHotelLinks, setShowHotelLinks] = useState(true);\n\n    const [mobileMenuOpen, setMobileMenuOpen] = useState(false);\n    const [mobileMenuFaderStatus, setMobileMenuFaderStatus] = useState(false);\n    const [loginModalOpen, setLoginModalOpen] = useState(false);\n\n    const { t } = useTranslation();\n\n    const availableLanguages = LanguageProvider.getLanguages();\n\n    const langKeys = Object.keys(availableLanguages);\n\n    const onLanguageChangeHandler = (selected: Language) => {\n        ccx.setCurrentLanguage(selected);\n        LanguageProvider.changeLanguage(selected);\n    };\n\n    const onCurrencyChangeHandler = (selected: string) => {\n        ccx.setCurrentCurrency(selected);\n        DataLayer.instance.setCurrencyCodes(selected);\n    };\n\n    const closeMobileMenuClickHandler = () => {\n        setMobileMenuFaderStatus(false);\n    };\n    const openMobileMenuClickHandler = () => {\n        setMobileMenuFaderStatus(true);\n    };\n    const closeLoginClickHandler = () => {\n        setLoginModalOpen(false);\n    };\n    const onLoginClickHandler = () => {\n        setLoginModalOpen(true);\n        closeMobileMenuClickHandler();\n    };\n\n    useEffect(() => {\n        let timeout: NodeJS.Timeout = null;\n\n        if (mobileMenuFaderStatus) {\n            setMobileMenuOpen(true);\n        } else {\n            timeout = setTimeout(() => {\n                setMobileMenuOpen(false);\n            }, 500);\n        }\n\n        return () => {\n            clearTimeout(timeout);\n        };\n    }, [mobileMenuFaderStatus]);\n\n    useEffect(() => {\n        let cancelled = false;\n\n        const loadImage = (src: string) => {\n            const image = new Image();\n            image.onload = () => {\n                if (!cancelled) {\n                    setHotelLogo(src);\n                }\n            };\n\n            image.src = src;\n        };\n\n        // Check the Logo per step\n        if (hotel && !(currentStep === StepHotel)) {\n            if (typeof hotel?.logo === 'string') {\n                loadImage(hotel?.logo);\n            }\n        } else {\n            loadImage(ccx.logo);\n        }\n\n        // Check wether we should display the hotel related links or not\n        setShowHotelLinks(currentStep !== StepHotel && !!hotel);\n\n        return () => {\n            cancelled = true;\n        };\n    }, [hotel, hotel?.logo, ccx.logo, currentStep]);\n\n    let hotelImageElement = hotelLogo ? <img src={hotelLogo} alt=\"Hotel Logo\" className=\"u-block\" /> : hotel?.logo;\n\n    if (typeof hotelImageElement === 'string' && !hotelImageElement.startsWith('<')) {\n        hotelImageElement = <img src={hotelImageElement} alt=\"Hotel Logo\" />;\n    }\n\n    const links = (\n        <ul className=\"c-header__list\">\n            <li>\n                <NavLink to=\"/hotel-info/\" activeClassName=\"is-active\" onClick={closeMobileMenuClickHandler}>\n                    <Text type={TextType.Small} color={Color.White}>\n                        <strong>{t(Translation.Navigation.HotelInfo)}</strong>\n                    </Text>\n                </NavLink>\n            </li>\n            <li>\n                {hotel?.forwardFindReservationToSynxis ? (\n                    <a href={`https://be.synxis.com/signin?hotel=${hotel?.hotelID}`} target=\"_blank\" rel=\"noreferrer\">\n                        <Text type={TextType.Small} color={Color.White} bold={true}>\n                            {t(Translation.Navigation.FindReservation)}\n                        </Text>\n                    </a>\n                ) : (\n                    <NavLink to=\"/find-reservation\" activeClassName=\"is-active\" onClick={closeMobileMenuClickHandler}>\n                        <Text type={TextType.Small} color={Color.White} bold={true}>\n                            {t(Translation.Navigation.FindReservation)}\n                        </Text>\n                    </NavLink>\n                )}\n            </li>\n            <li className=\"phone\">\n                <a href={`tel:${hotel?.phone}`} onClick={closeMobileMenuClickHandler}>\n                    <Text type={TextType.Small} transforms={[TextTransform.Uppercase]} color={Color.White}>\n                        <Icon icon={IconType.Phone} size=\"16px\" color={Color.White} />\n                        <strong className=\"u-marg-left--light\">{hotel?.phone}</strong>\n                    </Text>\n                </a>\n            </li>\n        </ul>\n    );\n\n    const configs = (\n        <>\n            <ul className=\"c-header__list\">\n                {langKeys.length > 1 && (\n                    <li>\n                        <Select<ILanguageSelectOption, 'value'>\n                            nativeOnMobile\n                            options={langKeys.map((lang: Language) => {\n                                return {\n                                    value: lang,\n                                    text: LanguageProvider.getPrettyLanguageName(lang),\n                                };\n                            })}\n                            value={ccx.currentLanguage}\n                            onChange={onLanguageChangeHandler}\n                            keyName=\"value\"\n                            labelName=\"text\"\n                        />\n                    </li>\n                )}\n                <li>\n                    <Select<IDefaultSelectOption, 'value'>\n                        nativeOnMobile\n                        options={CurrencyProvider.getCurrencyItems()}\n                        value={ccx.currentCurrency}\n                        onChange={onCurrencyChangeHandler}\n                        keyName=\"value\"\n                        labelName=\"text\"\n                    />\n                </li>\n\n                {MemberPortalFeature.isActive() && (\n                    <li ref={loginAnchorEl}>\n                        {roomstayMember ? (\n                            <BEButton size=\"small\" isText onClick={onLoginClickHandler} stopIconAnimation>\n                                {roomstayMember.forename} {roomstayMember.surname}\n                                <span className=\"u-white u-pad-left--light\" style={{ marginRight: -13 }}>\n                                    <Icon icon={IconType.ArrowDown2} size=\"1.3em\" color={Color.DarkGrey} />\n                                </span>\n                            </BEButton>\n                        ) : (\n                            <BEButton size=\"small\" isText onClick={onLoginClickHandler} stopIconAnimation>\n                                {t(Translation.Navigation.SignIn.SignIn)}\n                                <span className=\"u-white u-pad-left--light\" style={{ marginRight: -13 }}>\n                                    <Icon icon={IconType.ArrowDown2} size=\"1.3em\" color={Color.DarkGrey} />\n                                </span>\n                            </BEButton>\n                        )}\n                    </li>\n                )}\n            </ul>\n        </>\n    );\n\n    return (\n        <>\n            <div className=\"c-header u-print-none\">\n                <div className=\"container\">\n                    <div className=\"u-flex\">\n                        <div className=\"u-flex u-flex-flex-start u-flex__item\">\n                            <div className=\"c-header__logo\">\n                                <a href={showHotelLinks ? hotel?.hotelUrl : ccx?.logoLink} onClick={closeMobileMenuClickHandler}>\n                                    {hotelImageElement}\n                                </a>\n                            </div>\n                            {!!showHotelLinks && links}\n                        </div>\n                        <div className=\"u-flex mx-100\">\n                            {configs}\n                            <div className=\"c-header__mobile-menu\">\n                                <span className=\"u-white u-pad-left\">\n                                    <Icon icon={IconType.Menu} size=\"26px\" color={Color.White} onClick={openMobileMenuClickHandler} />\n                                </span>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            {mobileMenuOpen && (\n                <RoomstayPortal target={RoomstayThemeEngine.EngineContainer}>\n                    <FadeAnimation open={mobileMenuFaderStatus}>\n                        <div className={`mobile-header-menu ${mobileMenuFaderStatus ? '' : '--closing'}`}>\n                            <div className=\"mobile-header-menu--replica u-flex\">\n                                <div className=\"c-header__logo\">\n                                    <Link to=\"/\" onClick={closeMobileMenuClickHandler}>\n                                        {hotelImageElement}\n                                    </Link>\n                                </div>\n                                <div className=\"c-header__mobile-menu\">\n                                    <span className=\"u-white u-pad-left\">\n                                        <Icon icon={IconType.Close} size=\"26px\" color={Color.White} onClick={closeMobileMenuClickHandler} />\n                                    </span>\n                                </div>\n                            </div>\n                            <div className=\"mobile-header-menu--content\">\n                                {!!hotel && links}\n\n                                {configs}\n                            </div>\n                        </div>\n                    </FadeAnimation>\n                </RoomstayPortal>\n            )}\n            {MemberPortalFeature.isActive() && (\n                <>\n                    {roomstayMember ? (\n                        <AuthenticatedUserModal open={loginModalOpen} onClose={closeLoginClickHandler} anchorEl={loginAnchorEl.current} />\n                    ) : (\n                        <UnauthenticatedUserModal open={loginModalOpen} onClose={closeLoginClickHandler} anchorEl={loginAnchorEl.current} />\n                    )}\n                </>\n            )}\n        </>\n    );\n}\n"]}

package/dist/src/components/navigation/StepSelector.js

@@ -27,19 +27,19 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const React = __importStar(require("react"));
-const Text_1 = __importStar(require("components/generic/Text"));
-const Icon_1 = __importStar(require("components/generic/Icon/Icon"));
+const Text_1 = __importStar(require("../../../components/generic/Text"));
+const Icon_1 = __importStar(require("../../../components/generic/Icon/Icon"));
 const react_router_dom_1 = require("react-router-dom");
 const react_1 = require("react");
-const StepManager_1 = __importDefault(require("util/StepManager"));
+const StepManager_1 = __importDefault(require("../../../util/StepManager"));
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
 const classnames_1 = __importDefault(require("classnames"));
-const Color_1 = require("util/Color");
-const StepSelectorModal_1 = __importDefault(require("components/navigation/StepSelectorModal"));
-const ScreenSize_1 = __importDefault(require("util/ScreenSize"));
-const contexts_1 = require("@frontend/contexts");
-const contexts_2 = require("@frontend/contexts");
+const Color_1 = require("../../../util/Color");
+const StepSelectorModal_1 = __importDefault(require("../../../components/navigation/StepSelectorModal"));
+const ScreenSize_1 = __importDefault(require("../../../util/ScreenSize"));
+const contexts_1 = require("../../../contexts/index.js");
+const contexts_2 = require("../../../contexts/index.js");
 function StepSelector() {
     const { screenSize } = (0, react_1.useContext)(contexts_1.BookingEngineContext);
     const { currentStep } = (0, react_1.useContext)(contexts_2.FullPageEngineContext);

package/dist/src/components/navigation/StepSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepSelector.js","sourceRoot":"/","sources":["src/components/navigation/StepSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Text, { TextType } from 'components/generic/Text';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport { Link } from 'react-router-dom';\nimport { useContext, useState } from 'react';\nimport StepManager from 'util/StepManager';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport classNames from 'classnames';\nimport { Color } from 'util/Color';\nimport StepSelectorModal from 'components/navigation/StepSelectorModal';\nimport ScreenSize from 'util/ScreenSize';\nimport { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport Step from 'pages/steps/Step';\nimport { FullPageEngineContext } from '@frontend/contexts';\n\nexport default function StepSelector() {\n    const { screenSize } = useContext(BookingEngineContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n    const basketContext = useContext(BasketContext);\n\n    const { t } = useTranslation();\n\n    const [modalOpen, setModalOpen] = useState(false);\n\n    const steps = StepManager.getSteps().filter((step) => (step.shouldShowOnNavigation() ? step : null));\n\n    const onDropdownClick = () => {\n        screenSize <= ScreenSize.Medium ? setModalOpen(true) : null;\n    };\n\n    const closeModal = () => {\n        setModalOpen(false);\n    };\n\n    const currentStepIndex = StepManager.getStepIndex(currentStep.getName());\n\n    return (\n        <>\n            <div className=\"step-dropdown\" onClick={onDropdownClick}>\n                <div className=\"step-container\">\n                    <span className=\"step-container-dropdown\">\n                        <Icon icon={IconType.Dropdown} />\n                    </span>\n                    <div className=\"step-awards\">\n                        <img alt=\"\" style={{ width: '80px' }} />\n                    </div>\n                    <ul className=\"step-selector\">\n                        {steps.map((step: Step, stepIndex: number) => {\n                            const stepName = t(step.getStepTranslation());\n\n                            const prettyStep = stepIndex + 1;\n\n                            const isPrevStep = currentStepIndex > prettyStep;\n\n                            let stepNumber: JSX.Element;\n                            if (isPrevStep) {\n                                stepNumber = <Icon icon={IconType.Check} color={Color.White} size=\"24px\" />;\n                            } else {\n                                stepNumber = (\n                                    <Text type={TextType.Small}>\n                                        <strong>{'0' + prettyStep}</strong>\n                                    </Text>\n                                );\n                            }\n\n                            let isClickable = false;\n\n                            if (step) {\n                                const stepValidator = step.getValidator();\n\n                                if (stepValidator && stepValidator.isValid(basketContext)) {\n                                    isClickable = true;\n                                }\n                            }\n\n                            const stepClassNames = classNames('step-selector__item', {\n                                'is-current': currentStepIndex === prettyStep,\n                                'is-valid': isClickable,\n                                'is-complete': isPrevStep,\n                                'is-disabled': !isPrevStep && currentStepIndex !== prettyStep && !isClickable,\n                            });\n\n                            return (\n                                <li className={stepClassNames} key={prettyStep}>\n                                    <span className=\"step-selector__count\">{stepNumber}</span>\n                                    <div>\n                                        <span className=\"step-selector__step-count-mobile\">\n                                            <Text type={TextType.Small} color={Color.Navy}>\n                                                <strong>{t(Translation.Navigation.Steps.StepProgress, { step: prettyStep, maxSteps: StepManager.getSteps().length })}</strong>\n                                            </Text>\n                                        </span>\n                                        <Text>\n                                            <strong>{stepName}</strong>\n                                        </Text>\n                                    </div>\n                                    <Link to={step.getStepUrl()} />\n                                </li>\n                            );\n                        })}\n                    </ul>\n                </div>\n            </div>\n            {screenSize <= ScreenSize.Medium && <StepSelectorModal isOpen={modalOpen} onClose={closeModal} />}\n        </>\n    );\n}\n"]}
+{"version":3,"file":"StepSelector.js","sourceRoot":"/","sources":["src/components/navigation/StepSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Link } from 'react-router-dom';\nimport { useContext, useState } from 'react';\nimport StepManager from '@/util/StepManager';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport classNames from 'classnames';\nimport { Color } from '@/util/Color';\nimport StepSelectorModal from '@/components/navigation/StepSelectorModal';\nimport ScreenSize from '@/util/ScreenSize';\nimport { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport Step from '@/pages/steps/Step';\nimport { FullPageEngineContext } from '@frontend/contexts';\n\nexport default function StepSelector() {\n    const { screenSize } = useContext(BookingEngineContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n    const basketContext = useContext(BasketContext);\n\n    const { t } = useTranslation();\n\n    const [modalOpen, setModalOpen] = useState(false);\n\n    const steps = StepManager.getSteps().filter((step) => (step.shouldShowOnNavigation() ? step : null));\n\n    const onDropdownClick = () => {\n        screenSize <= ScreenSize.Medium ? setModalOpen(true) : null;\n    };\n\n    const closeModal = () => {\n        setModalOpen(false);\n    };\n\n    const currentStepIndex = StepManager.getStepIndex(currentStep.getName());\n\n    return (\n        <>\n            <div className=\"step-dropdown\" onClick={onDropdownClick}>\n                <div className=\"step-container\">\n                    <span className=\"step-container-dropdown\">\n                        <Icon icon={IconType.Dropdown} />\n                    </span>\n                    <div className=\"step-awards\">\n                        <img alt=\"\" style={{ width: '80px' }} />\n                    </div>\n                    <ul className=\"step-selector\">\n                        {steps.map((step: Step, stepIndex: number) => {\n                            const stepName = t(step.getStepTranslation());\n\n                            const prettyStep = stepIndex + 1;\n\n                            const isPrevStep = currentStepIndex > prettyStep;\n\n                            let stepNumber: JSX.Element;\n                            if (isPrevStep) {\n                                stepNumber = <Icon icon={IconType.Check} color={Color.White} size=\"24px\" />;\n                            } else {\n                                stepNumber = (\n                                    <Text type={TextType.Small}>\n                                        <strong>{'0' + prettyStep}</strong>\n                                    </Text>\n                                );\n                            }\n\n                            let isClickable = false;\n\n                            if (step) {\n                                const stepValidator = step.getValidator();\n\n                                if (stepValidator && stepValidator.isValid(basketContext)) {\n                                    isClickable = true;\n                                }\n                            }\n\n                            const stepClassNames = classNames('step-selector__item', {\n                                'is-current': currentStepIndex === prettyStep,\n                                'is-valid': isClickable,\n                                'is-complete': isPrevStep,\n                                'is-disabled': !isPrevStep && currentStepIndex !== prettyStep && !isClickable,\n                            });\n\n                            return (\n                                <li className={stepClassNames} key={prettyStep}>\n                                    <span className=\"step-selector__count\">{stepNumber}</span>\n                                    <div>\n                                        <span className=\"step-selector__step-count-mobile\">\n                                            <Text type={TextType.Small} color={Color.Navy}>\n                                                <strong>{t(Translation.Navigation.Steps.StepProgress, { step: prettyStep, maxSteps: StepManager.getSteps().length })}</strong>\n                                            </Text>\n                                        </span>\n                                        <Text>\n                                            <strong>{stepName}</strong>\n                                        </Text>\n                                    </div>\n                                    <Link to={step.getStepUrl()} />\n                                </li>\n                            );\n                        })}\n                    </ul>\n                </div>\n            </div>\n            {screenSize <= ScreenSize.Medium && <StepSelectorModal isOpen={modalOpen} onClose={closeModal} />}\n        </>\n    );\n}\n"]}

package/dist/src/components/navigation/StepSelectorModal.js

@@ -26,19 +26,19 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const SimpleModal_1 = __importDefault(require("components/generic/modal/SimpleModal"));
+const SimpleModal_1 = __importDefault(require("../../../components/generic/modal/SimpleModal"));
 const react_i18next_1 = require("react-i18next");
 const react_1 = require("react");
 const Translation_1 = require("translations/Translation");
 const React = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
-const Icon_1 = __importStar(require("components/generic/Icon/Icon"));
-const Color_1 = require("util/Color");
-const Text_1 = __importDefault(require("components/generic/Text"));
+const Icon_1 = __importStar(require("../../../components/generic/Icon/Icon"));
+const Color_1 = require("../../../util/Color");
+const Text_1 = __importDefault(require("../../../components/generic/Text"));
 const react_router_dom_1 = require("react-router-dom");
-const StepManager_1 = __importDefault(require("util/StepManager"));
-const contexts_1 = require("@frontend/contexts");
-const contexts_2 = require("@frontend/contexts");
+const StepManager_1 = __importDefault(require("../../../util/StepManager"));
+const contexts_1 = require("../../../contexts/index.js");
+const contexts_2 = require("../../../contexts/index.js");
 function StepSelectorModal(props) {
     const { currentStep } = (0, react_1.useContext)(contexts_2.FullPageEngineContext);
     const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);

package/dist/src/components/navigation/StepSelectorModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepSelectorModal.js","sourceRoot":"/","sources":["src/components/navigation/StepSelectorModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,uFAA+D;AAC/D,iDAA+C;AAC/C,iCAAmC;AACnC,0DAAuD;AACvD,6CAA+B;AAC/B,4DAAoC;AAEpC,qEAA8D;AAC9D,sCAAmC;AACnC,mEAA2C;AAC3C,uDAAwC;AACxC,mEAA2C;AAC3C,iDAAmD;AAEnD,iDAA2D;AAO3D,SAAwB,iBAAiB,CAAC,KAA6B;IACnE,MAAM,EAAE,WAAW,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAC1D,MAAM,aAAa,GAAG,IAAA,kBAAU,EAAC,wBAAa,CAAC,CAAC;IAEhD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,KAAK,GAAG,qBAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,sBAAsB,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAErG,MAAM,YAAY,GAAG,GAAG,EAAE;QACtB,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IAClD,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,qBAAW,CAAC,YAAY,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC,CAAC;IAEzE,OAAO,CACH,oBAAC,qBAAW,IAAC,IAAI,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,UAAU,CAAC,EAAE,OAAO,EAAE,YAAY;QAC/F,4BAAI,SAAS,EAAC,4BAA4B,IACrC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAU,EAAE,SAAiB,EAAE,EAAE;YACzC,MAAM,QAAQ,GAAG,CAAC,CAAC,IAAI,CAAC,kBAAkB,EAAE,CAAC,CAAC;YAE9C,MAAM,UAAU,GAAG,SAAS,GAAG,CAAC,CAAC;YAEjC,MAAM,UAAU,GAAG,gBAAgB,GAAG,UAAU,CAAC;YAEjD,IAAI,UAAuB,CAAC;YAC5B,IAAI,UAAU,EAAE;gBACZ,UAAU,GAAG,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,GAAG,CAAC;aAC/E;iBAAM;gBACH,UAAU,GAAG,CACT,oBAAC,cAAI;oBACD,oCAAS,GAAG,GAAG,UAAU,CAAU,CAChC,CACV,CAAC;aACL;YAED,IAAI,WAAW,GAAG,KAAK,CAAC;YAExB,IAAI,IAAI,EAAE;gBACN,MAAM,aAAa,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;gBAE1C,IAAI,aAAa,IAAI,aAAa,CAAC,OAAO,CAAC,aAAa,CAAC,EAAE;oBACvD,WAAW,GAAG,IAAI,CAAC;iBACtB;aACJ;YAED,MAAM,cAAc,GAAG,IAAA,oBAAU,EAAC,qBAAqB,EAAE;gBACrD,YAAY,EAAE,gBAAgB,KAAK,UAAU;gBAC7C,UAAU,EAAE,WAAW;gBACvB,aAAa,EAAE,UAAU;gBACzB,aAAa,EAAE,CAAC,UAAU,IAAI,gBAAgB,KAAK,UAAU,IAAI,CAAC,WAAW;aAChF,CAAC,CAAC;YAEH,MAAM,YAAY,GAAG,GAAG,EAAE;gBACtB,KAAK,CAAC,OAAO,EAAE,CAAC;YACpB,CAAC,CAAC;YACF,OAAO,CACH,4BAAI,SAAS,EAAE,cAAc,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY;gBAChE,8BAAM,SAAS,EAAC,sBAAsB,IAAE,UAAU,CAAQ;gBAC1D;oBACI,oBAAC,cAAI;wBACD,oCAAS,QAAQ,CAAU,CACxB,CACL;gBACN,oBAAC,uBAAI,IAAC,EAAE,EAAE,IAAI,CAAC,UAAU,EAAE,GAAI,CAC9B,CACR,CAAC;QACN,CAAC,CAAC,CACD,CACK,CACjB,CAAC;AACN,CAAC;AAtED,oCAsEC","sourcesContent":["import SimpleModal from 'components/generic/modal/SimpleModal';\nimport { useTranslation } from 'react-i18next';\nimport { useContext } from 'react';\nimport { Translation } from 'translations/Translation';\nimport * as React from 'react';\nimport classNames from 'classnames';\n\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport { Color } from 'util/Color';\nimport Text from 'components/generic/Text';\nimport { Link } from 'react-router-dom';\nimport StepManager from 'util/StepManager';\nimport { BasketContext } from '@frontend/contexts';\nimport Step from 'pages/steps/Step';\nimport { FullPageEngineContext } from '@frontend/contexts';\n\nexport interface StepSelectorModalProps {\n    isOpen?: boolean;\n    onClose?: () => void;\n}\n\nexport default function StepSelectorModal(props: StepSelectorModalProps) {\n    const { currentStep } = useContext(FullPageEngineContext);\n    const basketContext = useContext(BasketContext);\n\n    const { t } = useTranslation();\n\n    const steps = StepManager.getSteps().filter((step) => (step.shouldShowOnNavigation() ? step : null));\n\n    const onModalClose = () => {\n        return props.onClose ? props.onClose() : null;\n    };\n\n    const currentStepIndex = StepManager.getStepIndex(currentStep.getName());\n\n    return (\n        <SimpleModal open={props.isOpen} title={t(Translation.Navigation.SelectStep)} onClose={onModalClose}>\n            <ul className=\"step-selector --horizontal\">\n                {steps.map((step: Step, stepIndex: number) => {\n                    const stepName = t(step.getStepTranslation());\n\n                    const prettyStep = stepIndex + 1;\n\n                    const isPrevStep = currentStepIndex > prettyStep;\n\n                    let stepNumber: JSX.Element;\n                    if (isPrevStep) {\n                        stepNumber = <Icon icon={IconType.Check} color={Color.White} size=\"24px\" />;\n                    } else {\n                        stepNumber = (\n                            <Text>\n                                <strong>{'0' + prettyStep}</strong>\n                            </Text>\n                        );\n                    }\n\n                    let isClickable = false;\n\n                    if (step) {\n                        const stepValidator = step.getValidator();\n\n                        if (stepValidator && stepValidator.isValid(basketContext)) {\n                            isClickable = true;\n                        }\n                    }\n\n                    const stepClassNames = classNames('step-selector__item', {\n                        'is-current': currentStepIndex === prettyStep,\n                        'is-valid': isClickable,\n                        'is-complete': isPrevStep,\n                        'is-disabled': !isPrevStep && currentStepIndex !== prettyStep && !isClickable,\n                    });\n\n                    const closeOnClick = () => {\n                        props.onClose();\n                    };\n                    return (\n                        <li className={stepClassNames} key={stepIndex} onClick={closeOnClick}>\n                            <span className=\"step-selector__count\">{stepNumber}</span>\n                            <div>\n                                <Text>\n                                    <strong>{stepName}</strong>\n                                </Text>\n                            </div>\n                            <Link to={step.getStepUrl()} />\n                        </li>\n                    );\n                })}\n            </ul>\n        </SimpleModal>\n    );\n}\n"]}
+{"version":3,"file":"StepSelectorModal.js","sourceRoot":"/","sources":["src/components/navigation/StepSelectorModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import SimpleModal from '@/components/generic/modal/SimpleModal';\nimport { useTranslation } from 'react-i18next';\nimport { useContext } from 'react';\nimport { Translation } from 'translations/Translation';\nimport * as React from 'react';\nimport classNames from 'classnames';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport Text from '@/components/generic/Text';\nimport { Link } from 'react-router-dom';\nimport StepManager from '@/util/StepManager';\nimport { BasketContext } from '@frontend/contexts';\nimport Step from '@/pages/steps/Step';\nimport { FullPageEngineContext } from '@frontend/contexts';\n\nexport interface StepSelectorModalProps {\n    isOpen?: boolean;\n    onClose?: () => void;\n}\n\nexport default function StepSelectorModal(props: StepSelectorModalProps) {\n    const { currentStep } = useContext(FullPageEngineContext);\n    const basketContext = useContext(BasketContext);\n\n    const { t } = useTranslation();\n\n    const steps = StepManager.getSteps().filter((step) => (step.shouldShowOnNavigation() ? step : null));\n\n    const onModalClose = () => {\n        return props.onClose ? props.onClose() : null;\n    };\n\n    const currentStepIndex = StepManager.getStepIndex(currentStep.getName());\n\n    return (\n        <SimpleModal open={props.isOpen} title={t(Translation.Navigation.SelectStep)} onClose={onModalClose}>\n            <ul className=\"step-selector --horizontal\">\n                {steps.map((step: Step, stepIndex: number) => {\n                    const stepName = t(step.getStepTranslation());\n\n                    const prettyStep = stepIndex + 1;\n\n                    const isPrevStep = currentStepIndex > prettyStep;\n\n                    let stepNumber: JSX.Element;\n                    if (isPrevStep) {\n                        stepNumber = <Icon icon={IconType.Check} color={Color.White} size=\"24px\" />;\n                    } else {\n                        stepNumber = (\n                            <Text>\n                                <strong>{'0' + prettyStep}</strong>\n                            </Text>\n                        );\n                    }\n\n                    let isClickable = false;\n\n                    if (step) {\n                        const stepValidator = step.getValidator();\n\n                        if (stepValidator && stepValidator.isValid(basketContext)) {\n                            isClickable = true;\n                        }\n                    }\n\n                    const stepClassNames = classNames('step-selector__item', {\n                        'is-current': currentStepIndex === prettyStep,\n                        'is-valid': isClickable,\n                        'is-complete': isPrevStep,\n                        'is-disabled': !isPrevStep && currentStepIndex !== prettyStep && !isClickable,\n                    });\n\n                    const closeOnClick = () => {\n                        props.onClose();\n                    };\n                    return (\n                        <li className={stepClassNames} key={stepIndex} onClick={closeOnClick}>\n                            <span className=\"step-selector__count\">{stepNumber}</span>\n                            <div>\n                                <Text>\n                                    <strong>{stepName}</strong>\n                                </Text>\n                            </div>\n                            <Link to={step.getStepUrl()} />\n                        </li>\n                    );\n                })}\n            </ul>\n        </SimpleModal>\n    );\n}\n"]}

package/dist/src/components/pages/Account/Card/MemberCardItem.js

@@ -27,16 +27,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MemberCardItem = void 0;
-const contexts_1 = require("@frontend/contexts");
+const contexts_1 = require("../../../../../contexts/index.js");
 const classnames_1 = __importDefault(require("classnames"));
-const BEButton_1 = __importDefault(require("components/generic/BEButton"));
-const Icon_1 = require("components/generic/Icon/Icon");
-const Pill_1 = __importStar(require("components/generic/Pill"));
-const Text_1 = __importStar(require("components/generic/Text"));
-const RoomstayThemeEngine_1 = __importDefault(require("providers/RoomstayThemeEngine"));
+const BEButton_1 = __importDefault(require("../../../../../components/generic/BEButton"));
+const Icon_1 = require("../../../../../components/generic/Icon/Icon");
+const Pill_1 = __importStar(require("../../../../../components/generic/Pill"));
+const Text_1 = __importStar(require("../../../../../components/generic/Text"));
+const RoomstayThemeEngine_1 = __importDefault(require("../../../../../providers/RoomstayThemeEngine"));
 const React = __importStar(require("react"));
-const Color_1 = require("util/Color");
-const PaymentCardHelper_1 = require("util/PaymentCardHelper");
+const Color_1 = require("../../../../../util/Color");
+const PaymentCardHelper_1 = require("../../../../../util/PaymentCardHelper");
 const MemberCardItem_module_scss_1 = __importDefault(require("./MemberCardItem.module.scss"));
 const MemberCardItem = (props) => {
     var _a, _b, _c, _d;

package/dist/src/components/pages/Account/Card/MemberCardItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"MemberCardItem.js","sourceRoot":"/","sources":["src/components/pages/Account/Card/MemberCardItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RoomstayMemberContext } from '@frontend/contexts';\nimport { IRoomstayMemberCards } from '@roomstay/core';\nimport classNames from 'classnames';\nimport BEButton from 'components/generic/BEButton';\nimport { IconType } from 'components/generic/Icon/Icon';\nimport Pill, { PillType } from 'components/generic/Pill';\nimport Text, { TextType } from 'components/generic/Text';\nimport { ECardType } from 'models/PaymentCard';\nimport RoomstayThemeEngine from 'providers/RoomstayThemeEngine';\nimport * as React from 'react';\nimport { Color } from 'util/Color';\nimport { mapCardTypeToGraphic } from 'util/PaymentCardHelper';\n\nimport styles from './MemberCardItem.module.scss';\n\ntype MemberCardItemProps = {\n    item?: IRoomstayMemberCards;\n    onClick?: () => void;\n    selected?: boolean;\n};\n\nexport const MemberCardItem = (props: MemberCardItemProps) => {\n    const { item, onClick, selected } = props;\n    const { roomstayMember } = React.useContext(RoomstayMemberContext);\n\n    const cardClasses = classNames(styles['card'], {\n        [styles['--selected']]: selected,\n    });\n\n    const cardGraphics = mapCardTypeToGraphic(item?.type as ECardType);\n    const iconUrl = cardGraphics.miniCardUrl;\n\n    const hiddenCardNumber = item?.cardNumber?.substring(item?.cardNumber?.length - 4);\n\n    const renderedIcon = iconUrl ? <img src={iconUrl} alt={item?.type} /> : <img src={RoomstayThemeEngine.getImageAssetUrl() + 'add-card.svg'} alt=\"Add card\" />;\n    const expirationDate = item?.expiry?.substring(0, 2) + ' / ' + item?.expiry?.substring(2);\n\n    return (\n        <div className={cardClasses} onClick={() => onClick?.()}>\n            <div className={styles['card-infographic']}>{renderedIcon}</div>\n            <div className={styles['card-details']}>\n                {item ? (\n                    <>\n                        {/** TODO: check if card is on users default card object */}\n                        {roomstayMember?.defaultCard === item.cardId && (\n                            <div className=\"u-marg-bottom--light\">\n                                <Pill size={'small'} type={PillType.Primary}>\n                                    DEFAULT CARD\n                                </Pill>\n                            </div>\n                        )}\n                        <Text bold={true} type={TextType.Small}>\n                            •••• •••• •••• {hiddenCardNumber}\n                        </Text>\n                        <Text bold={true} type={TextType.Small}>\n                            {expirationDate}\n                        </Text>\n                    </>\n                ) : (\n                    <BEButton onClick={() => onClick?.()} isText={true} textColor={Color.Accent3} size={'tiny'} icon={IconType.ArrowRight} iconPosition={'right'}>\n                        Add new Card\n                    </BEButton>\n                )}\n            </div>\n        </div>\n    );\n};\n"]}
+{"version":3,"file":"MemberCardItem.js","sourceRoot":"/","sources":["src/components/pages/Account/Card/MemberCardItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { RoomstayMemberContext } from '@frontend/contexts';\nimport { IRoomstayMemberCards } from '@roomstay/core';\nimport classNames from 'classnames';\nimport BEButton from '@/components/generic/BEButton';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport Pill, { PillType } from '@/components/generic/Pill';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { ECardType } from '@/models/PaymentCard';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport * as React from 'react';\nimport { Color } from '@/util/Color';\nimport { mapCardTypeToGraphic } from '@/util/PaymentCardHelper';\n\nimport styles from './MemberCardItem.module.scss';\n\ntype MemberCardItemProps = {\n    item?: IRoomstayMemberCards;\n    onClick?: () => void;\n    selected?: boolean;\n};\n\nexport const MemberCardItem = (props: MemberCardItemProps) => {\n    const { item, onClick, selected } = props;\n    const { roomstayMember } = React.useContext(RoomstayMemberContext);\n\n    const cardClasses = classNames(styles['card'], {\n        [styles['--selected']]: selected,\n    });\n\n    const cardGraphics = mapCardTypeToGraphic(item?.type as ECardType);\n    const iconUrl = cardGraphics.miniCardUrl;\n\n    const hiddenCardNumber = item?.cardNumber?.substring(item?.cardNumber?.length - 4);\n\n    const renderedIcon = iconUrl ? <img src={iconUrl} alt={item?.type} /> : <img src={RoomstayThemeEngine.getImageAssetUrl() + 'add-card.svg'} alt=\"Add card\" />;\n    const expirationDate = item?.expiry?.substring(0, 2) + ' / ' + item?.expiry?.substring(2);\n\n    return (\n        <div className={cardClasses} onClick={() => onClick?.()}>\n            <div className={styles['card-infographic']}>{renderedIcon}</div>\n            <div className={styles['card-details']}>\n                {item ? (\n                    <>\n                        {/** TODO: check if card is on users default card object */}\n                        {roomstayMember?.defaultCard === item.cardId && (\n                            <div className=\"u-marg-bottom--light\">\n                                <Pill size={'small'} type={PillType.Primary}>\n                                    DEFAULT CARD\n                                </Pill>\n                            </div>\n                        )}\n                        <Text bold={true} type={TextType.Small}>\n                            •••• •••• •••• {hiddenCardNumber}\n                        </Text>\n                        <Text bold={true} type={TextType.Small}>\n                            {expirationDate}\n                        </Text>\n                    </>\n                ) : (\n                    <BEButton onClick={() => onClick?.()} isText={true} textColor={Color.Accent3} size={'tiny'} icon={IconType.ArrowRight} iconPosition={'right'}>\n                        Add new Card\n                    </BEButton>\n                )}\n            </div>\n        </div>\n    );\n};\n"]}

package/dist/src/components/pages/PageColorComponent.js

@@ -29,8 +29,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.PageColorComponent = void 0;
 const React = __importStar(require("react"));
 const react_1 = require("react");
-const hooks_1 = require("@frontend/hooks");
-const RoomstayThemeEngine_1 = __importDefault(require("providers/RoomstayThemeEngine"));
+const hooks_1 = require("../../../hooks/index.js");
+const RoomstayThemeEngine_1 = __importDefault(require("../../../providers/RoomstayThemeEngine"));
 const PageColorComponent = () => {
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     (0, react_1.useEffect)(() => {

package/dist/src/components/pages/PageColorComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageColorComponent.js","sourceRoot":"/","sources":["src/components/pages/PageColorComponent.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,iCAAkC;AAClC,2CAAkD;AAClD,wFAAgE;AAEzD,MAAM,kBAAkB,GAAG,GAAG,EAAE;IACnC,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IAEpC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,KAAK,EAAE;YACP,6BAAmB,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;SACjD;IACL,CAAC,EAAE,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,CAAC,CAAC,CAAC;IAEpB,OAAO,yCAAK,CAAC;AACjB,CAAC,CAAC;AAVW,QAAA,kBAAkB,sBAU7B","sourcesContent":["import * as React from 'react';\nimport { useEffect } from 'react';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport RoomstayThemeEngine from 'providers/RoomstayThemeEngine';\n\nexport const PageColorComponent = () => {\n    const { hotel } = useCurrentHotel();\n\n    useEffect(() => {\n        if (hotel) {\n            RoomstayThemeEngine.changeTheme(hotel.colors);\n        }\n    }, [hotel?.colors]);\n\n    return <></>;\n};\n"]}
+{"version":3,"file":"PageColorComponent.js","sourceRoot":"/","sources":["src/components/pages/PageColorComponent.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,iCAAkC;AAClC,2CAAkD;AAClD,0FAAkE;AAE3D,MAAM,kBAAkB,GAAG,GAAG,EAAE;IACnC,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IAEpC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,KAAK,EAAE;YACP,6BAAmB,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;SACjD;IACL,CAAC,EAAE,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,CAAC,CAAC,CAAC;IAEpB,OAAO,yCAAK,CAAC;AACjB,CAAC,CAAC;AAVW,QAAA,kBAAkB,sBAU7B","sourcesContent":["import * as React from 'react';\nimport { useEffect } from 'react';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\n\nexport const PageColorComponent = () => {\n    const { hotel } = useCurrentHotel();\n\n    useEffect(() => {\n        if (hotel) {\n            RoomstayThemeEngine.changeTheme(hotel.colors);\n        }\n    }, [hotel?.colors]);\n\n    return <></>;\n};\n"]}

package/dist/src/components/reservation/ReservationItem.d.ts

@@ -1,4 +1,4 @@
-import { IRoomstayMemberBookingItemWithRef } from '@frontend/contexts';
+import { IRoomstayMemberBookingItemWithRef } from '../../../contexts/index.js';
 export declare enum ReservationAction {
     MoreDetails = "MoreDetails",
     BookAgain = "BookAgain",