@roomstay/frontend 2.9.1-1 → 2.9.1

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

@@ -20,21 +20,15 @@ const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importDefault(require("react"));
 const react_i18next_1 = require("react-i18next");
 const react_spring_bottom_sheet_1 = require("react-spring-bottom-sheet");
-const ShadowDomContext_1 = require("../../../../contexts/ShadowDomContext/ShadowDomContext");
 const Translation_1 = require("../../../../translations/Translation");
 const BEButton_1 = __importDefault(require("../../BEButton"));
 const BookingWizard_1 = require("../BookingWizard");
 const BookingWizard_module_scss_1 = __importDefault(require("../BookingWizard.module.scss"));
 const BookingWizardContext_1 = require("../BookingWizardContext");
-const ShadowDomBottomSheet_1 = __importDefault(require("./ShadowDomBottomSheet"));
 const BookingWizardBottomSheet = (props) => {
     const { children, className } = props, bottomSheetProps = __rest(props, ["children", "className"]);
     const { style, className: bwClassname } = react_1.default.useContext(BookingWizardContext_1.BookingWizardContext);
-    const { isShadowDom } = (0, ShadowDomContext_1.useShadowDom)();
     const classes = (0, classnames_1.default)('roomstay-booking-container', bwClassname, className);
-    if (isShadowDom) {
-        return (react_1.default.createElement(ShadowDomBottomSheet_1.default, { className: classes, style: style, open: bottomSheetProps.open, onDismiss: bottomSheetProps.onDismiss, header: bottomSheetProps.header, footer: bottomSheetProps.footer, snapPoints: bottomSheetProps.snapPoints, defaultSnap: bottomSheetProps.defaultSnap, blocking: bottomSheetProps.blocking }, children));
-    }
     return (react_1.default.createElement(react_spring_bottom_sheet_1.BottomSheet, Object.assign({ className: classes, style: style }, bottomSheetProps), children));
 };
 const BWBottomSheetFooter = ({ onPrev, onNext, hidePrev = false, preLabel, nextLabel, disabledNext = false }) => {

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

@@ -1 +1 @@
-{"version":3,"file":"BookingWizardBottomSheet.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardBottomSheet/BookingWizardBottomSheet.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Icon, IconType } from '@roomstay/ui';\nimport classNames from 'classnames';\nimport React, { ReactNode } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { BottomSheet, BottomSheetProps } from 'react-spring-bottom-sheet';\n\nimport { useShadowDom } from '@/contexts/ShadowDomContext/ShadowDomContext';\nimport { Translation } from '@/translations/Translation';\n\nimport BEButton from '../../BEButton';\nimport { EBookingWizardTheme } from '../BookingWizard';\nimport styles from '../BookingWizard.module.scss';\nimport { BookingWizardContext, useBookingWizard } from '../BookingWizardContext';\nimport ShadowDomBottomSheet, { ShadowDomBottomSheetProps } from './ShadowDomBottomSheet';\n\nconst BookingWizardBottomSheet: React.FC<BottomSheetProps> = (props) => {\n    const { children, className, ...bottomSheetProps } = props;\n\n    const { style, className: bwClassname } = React.useContext(BookingWizardContext);\n    const { isShadowDom } = useShadowDom();\n\n    const classes = classNames('roomstay-booking-container', bwClassname, className);\n\n    if (isShadowDom) {\n        return (\n            <ShadowDomBottomSheet\n                className={classes}\n                style={style}\n                open={bottomSheetProps.open}\n                onDismiss={bottomSheetProps.onDismiss}\n                header={bottomSheetProps.header}\n                footer={bottomSheetProps.footer}\n                snapPoints={bottomSheetProps.snapPoints as ShadowDomBottomSheetProps['snapPoints']}\n                defaultSnap={bottomSheetProps.defaultSnap as ShadowDomBottomSheetProps['defaultSnap']}\n                blocking={bottomSheetProps.blocking}\n            >\n                {children}\n            </ShadowDomBottomSheet>\n        );\n    }\n\n    return (\n        <BottomSheet className={classes} style={style} {...bottomSheetProps}>\n            {children}\n        </BottomSheet>\n    );\n};\n\ninterface BWBottomSheetFooterProps {\n    onPrev?: () => void;\n    onNext?: () => void;\n    hidePrev?: boolean;\n    preLabel?: string; // defaults to \"Back\"\n    nextLabel?: string; // defaults to \"Next\"\n    disabledNext?: boolean;\n}\n\nexport const BWBottomSheetFooter = ({ onPrev, onNext, hidePrev = false, preLabel, nextLabel, disabledNext = false }: BWBottomSheetFooterProps) => {\n    const { theme } = useBookingWizard();\n    const { t } = useTranslation();\n    if (theme !== EBookingWizardTheme.Images) return null;\n\n    return (\n        <div className={styles.footer}>\n            {!hidePrev ? (\n                <BEButton rounded isText primary size=\"small\" className={classNames(styles.btn, styles['btn-cancel'])} onClick={onPrev}>\n                    {preLabel || t(Translation.Navigation.Back)}\n                </BEButton>\n            ) : (\n                <div></div>\n            )}\n\n            <BEButton disabled={disabledNext} rounded primary filled size=\"small\" className={classNames(styles.btn, styles['btn-next'])} onClick={onNext}>\n                {nextLabel || t(Translation.Navigation.Next)}\n            </BEButton>\n        </div>\n    );\n};\n\nexport const BWBottomSheetHeader = ({ title, onClose }: { title: ReactNode; onClose: () => void }) => {\n    const { isImagesTheme } = useBookingWizard();\n    return (\n        <div className={styles.header}>\n            <div\n                className={classNames({\n                    [styles.title]: isImagesTheme,\n                })}\n            >\n                {title}\n            </div>\n            <Icon icon={IconType.Close} onClick={onClose} />\n        </div>\n    );\n};\n\nexport default BookingWizardBottomSheet;\n"]}
+{"version":3,"file":"BookingWizardBottomSheet.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardBottomSheet/BookingWizardBottomSheet.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,qCAA8C;AAC9C,4DAAoC;AACpC,kDAAyC;AACzC,iDAA+C;AAC/C,yEAA0E;AAE1E,4DAAyD;AAEzD,8DAAsC;AACtC,oDAAuD;AACvD,6FAAkD;AAClD,kEAAiF;AACjF,MAAM,wBAAwB,GAA+B,CAAC,KAAK,EAAE,EAAE;IACnE,MAAM,EAAE,QAAQ,EAAE,SAAS,KAA0B,KAAK,EAA1B,gBAAgB,UAAK,KAAK,EAApD,yBAA4C,CAAQ,CAAC;IAE3D,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,eAAK,CAAC,UAAU,CAAC,2CAAoB,CAAC,CAAC;IAEjF,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,4BAA4B,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC;IAEjF,OAAO,CACH,8BAAC,uCAAW,kBAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,IAAM,gBAAgB,GAC9D,QAAQ,CACC,CACjB,CAAC;AACN,CAAC,CAAC;AAWK,MAAM,mBAAmB,GAAG,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,GAAG,KAAK,EAA4B,EAAE,EAAE;IAC7I,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uCAAgB,GAAE,CAAC;IACrC,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,IAAI,KAAK,KAAK,mCAAmB,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEtD,OAAO,CACH,uCAAK,SAAS,EAAE,mCAAM,CAAC,MAAM;QACxB,CAAC,QAAQ,CAAC,CAAC,CAAC,CACT,8BAAC,kBAAQ,IAAC,OAAO,QAAC,MAAM,QAAC,OAAO,QAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,IAAA,oBAAU,EAAC,mCAAM,CAAC,GAAG,EAAE,mCAAM,CAAC,YAAY,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,IACjH,QAAQ,IAAI,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,IAAI,CAAC,CACpC,CACd,CAAC,CAAC,CAAC,CACA,0CAAW,CACd;QAED,8BAAC,kBAAQ,IAAC,QAAQ,EAAE,YAAY,EAAE,OAAO,QAAC,OAAO,QAAC,MAAM,QAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,IAAA,oBAAU,EAAC,mCAAM,CAAC,GAAG,EAAE,mCAAM,CAAC,UAAU,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,IACvI,SAAS,IAAI,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,IAAI,CAAC,CACrC,CACT,CACT,CAAC;AACN,CAAC,CAAC;AApBW,QAAA,mBAAmB,uBAoB9B;AAEK,MAAM,mBAAmB,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAA6C,EAAE,EAAE;IACjG,MAAM,EAAE,aAAa,EAAE,GAAG,IAAA,uCAAgB,GAAE,CAAC;IAC7C,OAAO,CACH,uCAAK,SAAS,EAAE,mCAAM,CAAC,MAAM;QACzB,uCACI,SAAS,EAAE,IAAA,oBAAU,EAAC;gBAClB,CAAC,mCAAM,CAAC,KAAK,CAAC,EAAE,aAAa;aAChC,CAAC,IAED,KAAK,CACJ;QACN,8BAAC,SAAI,IAAC,IAAI,EAAE,aAAQ,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,GAAI,CAC9C,CACT,CAAC;AACN,CAAC,CAAC;AAdW,QAAA,mBAAmB,uBAc9B;AAEF,kBAAe,wBAAwB,CAAC","sourcesContent":["import { Icon, IconType } from '@roomstay/ui';\nimport classNames from 'classnames';\nimport React, { ReactNode } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { BottomSheet, BottomSheetProps } from 'react-spring-bottom-sheet';\n\nimport { Translation } from '@/translations/Translation';\n\nimport BEButton from '../../BEButton';\nimport { EBookingWizardTheme } from '../BookingWizard';\nimport styles from '../BookingWizard.module.scss';\nimport { BookingWizardContext, useBookingWizard } from '../BookingWizardContext';\nconst BookingWizardBottomSheet: React.FC<BottomSheetProps> = (props) => {\n    const { children, className, ...bottomSheetProps } = props;\n\n    const { style, className: bwClassname } = React.useContext(BookingWizardContext);\n\n    const classes = classNames('roomstay-booking-container', bwClassname, className);\n\n    return (\n        <BottomSheet className={classes} style={style} {...bottomSheetProps}>\n            {children}\n        </BottomSheet>\n    );\n};\n\ninterface BWBottomSheetFooterProps {\n    onPrev?: () => void;\n    onNext?: () => void;\n    hidePrev?: boolean;\n    preLabel?: string; // defaults to \"Back\"\n    nextLabel?: string; // defaults to \"Next\"\n    disabledNext?: boolean;\n}\n\nexport const BWBottomSheetFooter = ({ onPrev, onNext, hidePrev = false, preLabel, nextLabel, disabledNext = false }: BWBottomSheetFooterProps) => {\n    const { theme } = useBookingWizard();\n    const { t } = useTranslation();\n    if (theme !== EBookingWizardTheme.Images) return null;\n\n    return (\n        <div className={styles.footer}>\n            {!hidePrev ? (\n                <BEButton rounded isText primary size=\"small\" className={classNames(styles.btn, styles['btn-cancel'])} onClick={onPrev}>\n                    {preLabel || t(Translation.Navigation.Back)}\n                </BEButton>\n            ) : (\n                <div></div>\n            )}\n\n            <BEButton disabled={disabledNext} rounded primary filled size=\"small\" className={classNames(styles.btn, styles['btn-next'])} onClick={onNext}>\n                {nextLabel || t(Translation.Navigation.Next)}\n            </BEButton>\n        </div>\n    );\n};\n\nexport const BWBottomSheetHeader = ({ title, onClose }: { title: ReactNode; onClose: () => void }) => {\n    const { isImagesTheme } = useBookingWizard();\n    return (\n        <div className={styles.header}>\n            <div\n                className={classNames({\n                    [styles.title]: isImagesTheme,\n                })}\n            >\n                {title}\n            </div>\n            <Icon icon={IconType.Close} onClick={onClose} />\n        </div>\n    );\n};\n\nexport default BookingWizardBottomSheet;\n"]}

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

@@ -6,12 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.RoomstayPortal = void 0;
 const react_1 = __importDefault(require("react"));
 const react_dom_1 = require("react-dom");
-const ShadowDomContext_1 = require("../../../contexts/ShadowDomContext/ShadowDomContext");
 const RoomstayPortal = (props) => {
-    const { isShadowDom, portalTarget } = (0, ShadowDomContext_1.useShadowDom)();
-    // If target is document.body and we're in Shadow DOM, redirect to shadow root container
-    const effectiveTarget = props.target === document.body && isShadowDom ? portalTarget : props.target;
-    return (0, react_dom_1.createPortal)(react_1.default.createElement("div", { className: 'roomstay-booking-container' + (props.preventZIndex ? ' --no-z' : '') }, props.children), effectiveTarget);
+    return (0, react_dom_1.createPortal)(react_1.default.createElement("div", { className: 'roomstay-booking-container' + (props.preventZIndex ? ' --no-z' : '') }, props.children), props.target);
 };
 exports.RoomstayPortal = RoomstayPortal;
 //# sourceMappingURL=Portal.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Portal.js","sourceRoot":"/","sources":["src/components/generic/Portal/Portal.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAyC;AACzC,yCAAyC;AAEzC,mFAA4E;AASrE,MAAM,cAAc,GAAG,CAAC,KAA0B,EAAE,EAAE;IACzD,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,IAAA,+BAAY,GAAE,CAAC;IAErD,wFAAwF;IACxF,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,KAAK,QAAQ,CAAC,IAAI,IAAI,WAAW,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC;IAEpG,OAAO,IAAA,wBAAY,EAAC,uCAAK,SAAS,EAAE,4BAA4B,GAAG,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,IAAG,KAAK,CAAC,QAAQ,CAAO,EAAE,eAAe,CAAC,CAAC;AACxJ,CAAC,CAAC;AAPW,QAAA,cAAc,kBAOzB","sourcesContent":["import React, { ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { useShadowDom } from '@/contexts/ShadowDomContext/ShadowDomContext';\n\ntype RoomstayPortalProps = {\n    target: HTMLElement;\n    children: ReactNode | ReactNode[];\n\n    preventZIndex?: boolean;\n};\n\nexport const RoomstayPortal = (props: RoomstayPortalProps) => {\n    const { isShadowDom, portalTarget } = useShadowDom();\n\n    // If target is document.body and we're in Shadow DOM, redirect to shadow root container\n    const effectiveTarget = props.target === document.body && isShadowDom ? portalTarget : props.target;\n\n    return createPortal(<div className={'roomstay-booking-container' + (props.preventZIndex ? ' --no-z' : '')}>{props.children}</div>, effectiveTarget);\n};\n"]}
+{"version":3,"file":"Portal.js","sourceRoot":"/","sources":["src/components/generic/Portal/Portal.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAyC;AACzC,yCAAyC;AASlC,MAAM,cAAc,GAAG,CAAC,KAA0B,EAAE,EAAE;IACzD,OAAO,IAAA,wBAAY,EAAC,uCAAK,SAAS,EAAE,4BAA4B,GAAG,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,IAAG,KAAK,CAAC,QAAQ,CAAO,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;AACrJ,CAAC,CAAC;AAFW,QAAA,cAAc,kBAEzB","sourcesContent":["import React, { ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\n\ntype RoomstayPortalProps = {\n    target: HTMLElement;\n    children: ReactNode | ReactNode[];\n\n    preventZIndex?: boolean;\n};\n\nexport const RoomstayPortal = (props: RoomstayPortalProps) => {\n    return createPortal(<div className={'roomstay-booking-container' + (props.preventZIndex ? ' --no-z' : '')}>{props.children}</div>, props.target);\n};\n"]}

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

@@ -1,11 +1,11 @@
 import './EnhancedPhoneNumberField.global.scss';
 import React, { ChangeEvent, PropsWithChildren } from 'react';
-export interface EnhancedPhoneNumberFieldProps extends PropsWithChildren<any> {
+export interface EnhancedPhoneNumberField extends PropsWithChildren<any> {
     validationStatus?: 'success' | 'error';
     name?: string;
     value?: string;
     onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
     disabled?: boolean;
 }
-declare const _default: React.ForwardRefExoticComponent<Pick<React.PropsWithChildren<EnhancedPhoneNumberFieldProps>, keyof EnhancedPhoneNumberFieldProps> & React.RefAttributes<HTMLInputElement>>;
+declare const _default: React.ForwardRefExoticComponent<Pick<React.PropsWithChildren<EnhancedPhoneNumberField>, keyof EnhancedPhoneNumberField> & React.RefAttributes<HTMLInputElement>>;
 export default _default;

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

@@ -1 +1 @@
-{"version":3,"file":"EnhancedPhoneNumberField.js","sourceRoot":"/","sources":["src/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField.tsx"],"names":[],"mappings":"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","sourcesContent":["import './EnhancedPhoneNumberField.global.scss';\n\nimport { useCurrentHotel } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport React, { ChangeEvent, ForwardRefRenderFunction, PropsWithChildren, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { useAutoFocusOnSelect } from '@/hooks/AutoFocusOnSelect';\nimport { convertCountryCodeToFlag, CountryType, ListOfCountriesAndCodes } from '@/models/CountryCodesAndNumbers';\n\nimport { Select } from '../../Select/Select';\n\nexport interface EnhancedPhoneNumberFieldProps extends PropsWithChildren<any> {\n    validationStatus?: 'success' | 'error';\n    name?: string;\n    value?: string;\n    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n    disabled?: boolean;\n}\n\nconst PHONE_AND_PREFIX_SPLIT = ' ';\n\nconst EnhancedPhoneNumberField: ForwardRefRenderFunction<HTMLInputElement, EnhancedPhoneNumberFieldProps> = (props, ref) => {\n    const { hotel } = useCurrentHotel();\n    const innerRef = useRef<HTMLInputElement>(null);\n    useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(ref, () => innerRef.current);\n    const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen, isFocused } = useAutoFocusOnSelect({\n        ref: innerRef.current,\n        onlyAutoOpenWhenInputEmpty: true,\n        disableOpenOnFocus: true,\n    });\n\n    const { t } = useTranslation();\n\n    const organizedCountries: CountryType[] = useMemo(() => {\n        return ListOfCountriesAndCodes.sort((a, b) => {\n            return `${(a.suggested ? '000' : '') + a.label}`.localeCompare(`${(b.suggested ? '000' : '') + b.label}`);\n        });\n    }, [ListOfCountriesAndCodes]);\n\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n\n    const { validationStatus, name, onChange, value } = props;\n\n    const [selectedCountry, subscriberCode] = useMemo(() => {\n        const defaultCountryCode = hotel?.countryCode || organizedCountries[0].phone;\n        const [prefix, number] = value?.split(PHONE_AND_PREFIX_SPLIT) ?? [];\n        const codeToFind = prefix || defaultCountryCode;\n\n        const selectedCountry = organizedCountries.find(({ phone }) => phone === codeToFind) ?? organizedCountries[0];\n\n        return [selectedCountry, number ?? ''];\n    }, [value, organizedCountries, hotel?.countryCode]);\n\n    const getOption = (key: CountryType['code']): CountryType => {\n        return organizedCountries.find(({ code }) => code === key) as CountryType;\n    };\n\n    const raiseOnChangeEvent = (prefix?: CountryType, suffix?: string) => {\n        let newSuffix = suffix ?? subscriberCode;\n\n        if (newSuffix.startsWith('0')) {\n            newSuffix = newSuffix.substring(1);\n        }\n\n        const newValue = `${prefix?.phone ?? selectedCountry.phone}${PHONE_AND_PREFIX_SPLIT}${newSuffix}`;\n\n        if (value != newValue) {\n            onChange?.({ target: { name, value: newValue } } as any);\n        }\n    };\n\n    const onInputChanged = (e: ChangeEvent<HTMLInputElement>) => {\n        const value = e.target.value;\n        raiseOnChangeEvent(undefined, value);\n    };\n\n    const onPrefixChanged = (selectedCountry: CountryType) => {\n        onItemSelected();\n        raiseOnChangeEvent(selectedCountry, undefined);\n    };\n\n    const fieldClasses = classNames('rs-enhanced-phone-field', {\n        [`--${validationStatus}`]: !!validationStatus,\n        '--focused': isFocused,\n        '--disabled': props.disabled,\n    });\n    const onCountryClick = (country: CountryType) => {\n        onPrefixChanged(country);\n        return;\n    };\n\n    return (\n        <div className={fieldClasses}>\n            <div className=\"rs-enhanced-phone-field--country\" onClick={onTriggerClicked}>\n                <div className=\"rs-enhanced-phone-field--country-icon\">{convertCountryCodeToFlag(selectedCountry.code)}</div>\n                <Icon icon={IconType.Dropdown} />\n            </div>\n            <div className=\"rs-enhanced-phone-field--number\">\n                <span className=\"rs-enhanced-phone-field--number-prefix\">+{selectedCountry.phone}</span>\n                <input\n                    disabled={props.disabled}\n                    ref={innerRef}\n                    placeholder={t(Translation.Step.Confirmation.Inputs.Phone) + ' *'}\n                    type=\"number\"\n                    style={{ paddingLeft: selectedCountry.phone.length * 8 + 20 + 'px' }}\n                    onChange={onInputChanged}\n                    value={subscriberCode}\n                />\n\n                <div className=\"rs-enhanced-phone-field--number-status\"></div>\n            </div>\n            <div className=\"rs-enhanced-phone-field--anchor\" ref={setContainer}></div>\n            <Select<CountryType, 'code'>\n                open={isDropdownOpen}\n                onClose={onDropdownClosed}\n                target={container}\n                options={organizedCountries}\n                value={selectedCountry.code}\n                onChange={(value) => onCountryClick(getOption(value))}\n                labelName=\"code\"\n                keyName=\"code\"\n                renderOption={(country) => (\n                    <div className=\"rs-enhanced-phone-field--suggest-list-country\">\n                        <div className=\"rs-enhanced-phone-field--suggest-list-country-icon\">{convertCountryCodeToFlag(country?.code as string)}</div>\n                        <div className=\"rs-enhanced-phone-field--suggest-list-country-name\">\n                            {country?.label} <span>+{country?.phone}</span>\n                        </div>\n                    </div>\n                )}\n            />\n        </div>\n    );\n};\n\nexport default React.forwardRef<HTMLInputElement, React.PropsWithChildren<EnhancedPhoneNumberFieldProps>>(EnhancedPhoneNumberField);\n"]}
+{"version":3,"file":"EnhancedPhoneNumberField.js","sourceRoot":"/","sources":["src/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField.tsx"],"names":[],"mappings":"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","sourcesContent":["import './EnhancedPhoneNumberField.global.scss';\n\nimport { useCurrentHotel } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport React, { ChangeEvent, ForwardRefRenderFunction, PropsWithChildren, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { useAutoFocusOnSelect } from '@/hooks/AutoFocusOnSelect';\nimport { convertCountryCodeToFlag, CountryType, ListOfCountriesAndCodes } from '@/models/CountryCodesAndNumbers';\n\nimport { Select } from '../../Select/Select';\n\nexport interface EnhancedPhoneNumberField extends PropsWithChildren<any> {\n    validationStatus?: 'success' | 'error';\n    name?: string;\n    value?: string;\n    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n    disabled?: boolean;\n}\n\nconst PHONE_AND_PREFIX_SPLIT = ' ';\n\nconst EnhancedPhoneNumberField: ForwardRefRenderFunction<HTMLInputElement, EnhancedPhoneNumberField> = (props, ref) => {\n    const { hotel } = useCurrentHotel();\n    const innerRef = useRef<HTMLInputElement>(null);\n    useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(ref, () => innerRef.current);\n    const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen, isFocused } = useAutoFocusOnSelect({\n        ref: innerRef.current,\n        onlyAutoOpenWhenInputEmpty: true,\n        disableOpenOnFocus: true,\n    });\n\n    const { t } = useTranslation();\n\n    const organizedCountries: CountryType[] = useMemo(() => {\n        return ListOfCountriesAndCodes.sort((a, b) => {\n            return `${(a.suggested ? '000' : '') + a.label}`.localeCompare(`${(b.suggested ? '000' : '') + b.label}`);\n        });\n    }, [ListOfCountriesAndCodes]);\n\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n\n    const { validationStatus, name, onChange, value } = props;\n\n    const [selectedCountry, subscriberCode] = useMemo(() => {\n        const defaultCountryCode = hotel?.countryCode || organizedCountries[0].phone;\n        const [prefix, number] = value?.split(PHONE_AND_PREFIX_SPLIT) ?? [];\n        const codeToFind = prefix || defaultCountryCode;\n\n        const selectedCountry = organizedCountries.find(({ phone }) => phone === codeToFind) ?? organizedCountries[0];\n\n        return [selectedCountry, number ?? ''];\n    }, [value, organizedCountries, hotel?.countryCode]);\n\n    const getOption = (key: CountryType['code']): CountryType => {\n        return organizedCountries.find(({ code }) => code === key) as CountryType;\n    };\n\n    const raiseOnChangeEvent = (prefix?: CountryType, suffix?: string) => {\n        let newSuffix = suffix ?? subscriberCode;\n\n        if (newSuffix.startsWith('0')) {\n            newSuffix = newSuffix.substring(1);\n        }\n\n        const newValue = `${prefix?.phone ?? selectedCountry.phone}${PHONE_AND_PREFIX_SPLIT}${newSuffix}`;\n\n        if (value != newValue) {\n            onChange?.({ target: { name, value: newValue } } as any);\n        }\n    };\n\n    const onInputChanged = (e: ChangeEvent<HTMLInputElement>) => {\n        const value = e.target.value;\n        raiseOnChangeEvent(undefined, value);\n    };\n\n    const onPrefixChanged = (selectedCountry: CountryType) => {\n        onItemSelected();\n        raiseOnChangeEvent(selectedCountry, undefined);\n    };\n\n    const fieldClasses = classNames('rs-enhanced-phone-field', {\n        [`--${validationStatus}`]: !!validationStatus,\n        '--focused': isFocused,\n        '--disabled': props.disabled,\n    });\n    const onCountryClick = (country: CountryType) => {\n        onPrefixChanged(country);\n        return;\n    };\n\n    return (\n        <div className={fieldClasses}>\n            <div className=\"rs-enhanced-phone-field--country\" onClick={onTriggerClicked}>\n                <div className=\"rs-enhanced-phone-field--country-icon\">{convertCountryCodeToFlag(selectedCountry.code)}</div>\n                <Icon icon={IconType.Dropdown} />\n            </div>\n            <div className=\"rs-enhanced-phone-field--number\">\n                <span className=\"rs-enhanced-phone-field--number-prefix\">+{selectedCountry.phone}</span>\n                <input\n                    disabled={props.disabled}\n                    ref={innerRef}\n                    placeholder={t(Translation.Step.Confirmation.Inputs.Phone) + ' *'}\n                    type=\"number\"\n                    style={{ paddingLeft: selectedCountry.phone.length * 8 + 20 + 'px' }}\n                    onChange={onInputChanged}\n                    value={subscriberCode}\n                />\n\n                <div className=\"rs-enhanced-phone-field--number-status\"></div>\n            </div>\n            <div className=\"rs-enhanced-phone-field--anchor\" ref={setContainer}></div>\n            <Select<CountryType, 'code'>\n                open={isDropdownOpen}\n                onClose={onDropdownClosed}\n                target={container}\n                options={organizedCountries}\n                value={selectedCountry.code}\n                onChange={(value) => onCountryClick(getOption(value))}\n                labelName=\"code\"\n                keyName=\"code\"\n                renderOption={(country) => (\n                    <div className=\"rs-enhanced-phone-field--suggest-list-country\">\n                        <div className=\"rs-enhanced-phone-field--suggest-list-country-icon\">{convertCountryCodeToFlag(country?.code as string)}</div>\n                        <div className=\"rs-enhanced-phone-field--suggest-list-country-name\">\n                            {country?.label} <span>+{country?.phone}</span>\n                        </div>\n                    </div>\n                )}\n            />\n        </div>\n    );\n};\n\nexport default React.forwardRef<HTMLInputElement, React.PropsWithChildren<EnhancedPhoneNumberField>>(EnhancedPhoneNumberField);\n"]}

package/dist/src/components/members/SignInModal/EmailAndFullnameMemberModal.d.ts

@@ -2,10 +2,6 @@ import { FC } from 'react';
 import { CommonMemberModalProps } from './ExternalMemberModal';
 type EmailAndFullnameMemberModalProps = CommonMemberModalProps & {
     isMemberNumberRequired?: boolean;
-    enableMemberNumber?: boolean;
-    enablePostcode?: boolean;
-    enableMobilePhone?: boolean;
-    enableMarketingOptIn?: boolean;
 };
 declare const EmailAndFullnameMemberModal: FC<EmailAndFullnameMemberModalProps>;
 export default EmailAndFullnameMemberModal;

package/dist/src/components/members/SignInModal/EmailAndFullnameMemberModal.js

@@ -1,37 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -48,83 +15,41 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
-const react_hook_form_1 = require("react-hook-form");
 const react_i18next_1 = require("react-i18next");
 const Icon_1 = require("../../generic/Icon/Icon");
 const Translation_1 = require("../../../translations/Translation");
-const ExternalMemberModal_1 = __importStar(require("./ExternalMemberModal"));
+const ExternalMemberModal_1 = __importDefault(require("./ExternalMemberModal"));
 const EmailAndFullnameMemberModal = (_a) => {
-    var { isMemberNumberRequired = true, enableMemberNumber = true, enablePostcode = false, enableMobilePhone = false, enableMarketingOptIn = false } = _a, props = __rest(_a, ["isMemberNumberRequired", "enableMemberNumber", "enablePostcode", "enableMobilePhone", "enableMarketingOptIn"]);
-    const methods = (0, react_hook_form_1.useForm)({
-        mode: 'onSubmit',
-    });
+    var { isMemberNumberRequired = true } = _a, props = __rest(_a, ["isMemberNumberRequired"]);
     const { t } = (0, react_i18next_1.useTranslation)();
-    const fields = buildFields(t, {
-        enableMemberNumber,
-        isMemberNumberRequired,
-        enablePostcode,
-        enableMobilePhone,
-        enableMarketingOptIn,
-    });
-    return (react_1.default.createElement(react_hook_form_1.FormProvider, Object.assign({}, methods),
-        react_1.default.createElement(ExternalMemberModal_1.default, Object.assign({}, props, { fields: fields }))));
-};
-const buildFields = (t, { enableMemberNumber, isMemberNumberRequired, enablePostcode, enableMobilePhone, enableMarketingOptIn, }) => {
-    const fields = [];
-    if (enableMemberNumber) {
-        fields.push({
-            name: 'memberNumber',
-            icon: Icon_1.IconType.Star,
-            label: t(Translation_1.Translation.ExternalMemberPopup.Fields.MemberNumber),
-            isMasked: false,
-            required: isMemberNumberRequired,
-            helperText: !isMemberNumberRequired ? t(Translation_1.Translation.ExternalMemberPopup.Fields.MemberNumberOptionalBenefits) : undefined,
-        });
-    }
-    fields.push({
-        name: 'firstName',
-        icon: Icon_1.IconType.Person,
-        label: t(Translation_1.Translation.Navigation.SignUp.Inputs.FirstName),
-        isMasked: false,
-    }, {
-        name: 'lastName',
-        icon: Icon_1.IconType.Person,
-        label: t(Translation_1.Translation.Navigation.SignUp.Inputs.LastName),
-        isMasked: false,
-    }, {
-        name: 'email',
-        icon: Icon_1.IconType.Email,
-        label: t(Translation_1.Translation.Navigation.SignIn.EmailAddress),
-        isMasked: false,
-    });
-    if (enablePostcode) {
-        fields.push({
-            name: 'postalCode',
-            icon: Icon_1.IconType.Map,
-            label: t(Translation_1.Translation.ExternalMemberPopup.Fields.PostalCode),
-            isMasked: false,
-        });
-    }
-    if (enableMobilePhone) {
-        fields.push({
-            name: 'mobilePhone',
-            icon: Icon_1.IconType.Phone,
-            label: t(Translation_1.Translation.ExternalMemberPopup.Fields.MobilePhone),
-            isMasked: false,
-            type: ExternalMemberModal_1.ExternalMemberModelFieldType.Phone,
-        });
-    }
-    if (enableMarketingOptIn) {
-        fields.push({
-            name: 'marketingOptIn',
-            icon: Icon_1.IconType.Info,
-            label: t(Translation_1.Translation.ExternalMemberPopup.Fields.MarketingOptIn),
-            isMasked: false,
-            type: ExternalMemberModal_1.ExternalMemberModelFieldType.CheckBox,
-            required: false,
-        });
-    }
-    return fields;
+    return (react_1.default.createElement(ExternalMemberModal_1.default, Object.assign({}, props, { fields: [
+            {
+                name: 'memberNumber',
+                icon: Icon_1.IconType.Star,
+                label: t(Translation_1.Translation.ExternalMemberPopup.Fields.MemberNumber),
+                isMasked: false,
+                required: isMemberNumberRequired,
+                helperText: !isMemberNumberRequired ? t(Translation_1.Translation.ExternalMemberPopup.Fields.MemberNumberOptionalBenefits) : undefined,
+            },
+            {
+                name: 'firstName',
+                icon: Icon_1.IconType.Person,
+                label: t(Translation_1.Translation.Navigation.SignUp.Inputs.FirstName),
+                isMasked: false,
+            },
+            {
+                name: 'lastName',
+                icon: Icon_1.IconType.Person,
+                label: t(Translation_1.Translation.Navigation.SignUp.Inputs.LastName),
+                isMasked: false,
+            },
+            {
+                name: 'email',
+                icon: Icon_1.IconType.Email,
+                label: t(Translation_1.Translation.Navigation.SignIn.EmailAddress),
+                isMasked: false,
+            },
+        ] })));
 };
 exports.default = EmailAndFullnameMemberModal;
 //# sourceMappingURL=EmailAndFullnameMemberModal.js.map

package/dist/src/components/members/SignInModal/EmailAndFullnameMemberModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmailAndFullnameMemberModal.js","sourceRoot":"/","sources":["src/components/members/SignInModal/EmailAndFullnameMemberModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IMemberVerification } from '@roomstay/core';\nimport React, { FC } from 'react';\nimport { FormProvider, useForm } from 'react-hook-form';\nimport { TFunction, useTranslation } from 'react-i18next';\n\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport { Translation } from '@/translations/Translation';\n\nimport ExternalMemberModal, { CommonMemberModalProps, ExternalMemberModelField, ExternalMemberModelFieldType } from './ExternalMemberModal';\n\ntype EmailAndFullnameFields = IMemberVerification & {\n    postalCode?: string;\n    mobilePhone?: string;\n    marketingOptIn?: string;\n};\n\ntype EmailAndFullnameMemberModalProps = CommonMemberModalProps & {\n    isMemberNumberRequired?: boolean;\n    enableMemberNumber?: boolean;\n    enablePostcode?: boolean;\n    enableMobilePhone?: boolean;\n    enableMarketingOptIn?: boolean;\n};\n\nconst EmailAndFullnameMemberModal: FC<EmailAndFullnameMemberModalProps> = ({\n    isMemberNumberRequired = true,\n    enableMemberNumber = true,\n    enablePostcode = false,\n    enableMobilePhone = false,\n    enableMarketingOptIn = false,\n    ...props\n}) => {\n    const methods = useForm<Record<string, string>>({\n        mode: 'onSubmit',\n    });\n    const { t } = useTranslation();\n    const fields = buildFields(t, {\n        enableMemberNumber,\n        isMemberNumberRequired,\n        enablePostcode,\n        enableMobilePhone,\n        enableMarketingOptIn,\n    });\n    return (\n        <FormProvider {...methods}>\n            <ExternalMemberModal<EmailAndFullnameFields> {...props} fields={fields} />\n        </FormProvider>\n    );\n};\n\nconst buildFields = (\n    t: TFunction<'translation', undefined>,\n    {\n        enableMemberNumber,\n        isMemberNumberRequired,\n        enablePostcode,\n        enableMobilePhone,\n        enableMarketingOptIn,\n    }: {\n        enableMemberNumber: boolean;\n        isMemberNumberRequired: boolean;\n        enablePostcode: boolean;\n        enableMobilePhone: boolean;\n        enableMarketingOptIn: boolean;\n    }\n): ExternalMemberModelField<EmailAndFullnameFields>[] => {\n    const fields: ExternalMemberModelField<EmailAndFullnameFields>[] = [];\n\n    if (enableMemberNumber) {\n        fields.push({\n            name: 'memberNumber',\n            icon: IconType.Star,\n            label: t(Translation.ExternalMemberPopup.Fields.MemberNumber),\n            isMasked: false,\n            required: isMemberNumberRequired,\n            helperText: !isMemberNumberRequired ? t(Translation.ExternalMemberPopup.Fields.MemberNumberOptionalBenefits) : undefined,\n        });\n    }\n\n    fields.push(\n        {\n            name: 'firstName',\n            icon: IconType.Person,\n            label: t(Translation.Navigation.SignUp.Inputs.FirstName),\n            isMasked: false,\n        },\n        {\n            name: 'lastName',\n            icon: IconType.Person,\n            label: t(Translation.Navigation.SignUp.Inputs.LastName),\n            isMasked: false,\n        },\n        {\n            name: 'email',\n            icon: IconType.Email,\n            label: t(Translation.Navigation.SignIn.EmailAddress),\n            isMasked: false,\n        }\n    );\n\n    if (enablePostcode) {\n        fields.push({\n            name: 'postalCode',\n            icon: IconType.Map,\n            label: t(Translation.ExternalMemberPopup.Fields.PostalCode),\n            isMasked: false,\n        });\n    }\n\n    if (enableMobilePhone) {\n        fields.push({\n            name: 'mobilePhone',\n            icon: IconType.Phone,\n            label: t(Translation.ExternalMemberPopup.Fields.MobilePhone),\n            isMasked: false,\n            type: ExternalMemberModelFieldType.Phone,\n        });\n    }\n\n    if (enableMarketingOptIn) {\n        fields.push({\n            name: 'marketingOptIn',\n            icon: IconType.Info,\n            label: t(Translation.ExternalMemberPopup.Fields.MarketingOptIn),\n            isMasked: false,\n            type: ExternalMemberModelFieldType.CheckBox,\n            required: false,\n        });\n    }\n\n    return fields;\n};\n\nexport default EmailAndFullnameMemberModal;\n"]}
+{"version":3,"file":"EmailAndFullnameMemberModal.js","sourceRoot":"/","sources":["src/components/members/SignInModal/EmailAndFullnameMemberModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AACA,kDAAkC;AAClC,iDAA+C;AAE/C,yDAA0D;AAC1D,4DAAyD;AAEzD,gFAAoF;AAMpF,MAAM,2BAA2B,GAAyC,CAAC,EAA2C,EAAE,EAAE;QAA/C,EAAE,sBAAsB,GAAG,IAAI,OAAY,EAAP,KAAK,cAAzC,0BAA2C,CAAF;IAChH,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,OAAO,CACH,8BAAC,6BAAmB,oBACZ,KAAK,IACT,MAAM,EAAE;YACJ;gBACI,IAAI,EAAE,cAAc;gBACpB,IAAI,EAAE,eAAQ,CAAC,IAAI;gBACnB,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,mBAAmB,CAAC,MAAM,CAAC,YAAY,CAAC;gBAC7D,QAAQ,EAAE,KAAK;gBACf,QAAQ,EAAE,sBAAsB;gBAChC,UAAU,EAAE,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,yBAAW,CAAC,mBAAmB,CAAC,MAAM,CAAC,4BAA4B,CAAC,CAAC,CAAC,CAAC,SAAS;aAC3H;YACD;gBACI,IAAI,EAAE,WAAW;gBACjB,IAAI,EAAE,eAAQ,CAAC,MAAM;gBACrB,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC;gBACxD,QAAQ,EAAE,KAAK;aAClB;YACD;gBACI,IAAI,EAAE,UAAU;gBAChB,IAAI,EAAE,eAAQ,CAAC,MAAM;gBACrB,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC;gBACvD,QAAQ,EAAE,KAAK;aAClB;YACD;gBACI,IAAI,EAAE,OAAO;gBACb,IAAI,EAAE,eAAQ,CAAC,KAAK;gBACpB,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,MAAM,CAAC,YAAY,CAAC;gBACpD,QAAQ,EAAE,KAAK;aAClB;SACJ,IACH,CACL,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,2BAA2B,CAAC","sourcesContent":["import { IMemberVerification } from '@roomstay/core';\nimport React, { FC } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport { Translation } from '@/translations/Translation';\n\nimport ExternalMemberModal, { CommonMemberModalProps } from './ExternalMemberModal';\n\ntype EmailAndFullnameMemberModalProps = CommonMemberModalProps & {\n    isMemberNumberRequired?: boolean;\n};\n\nconst EmailAndFullnameMemberModal: FC<EmailAndFullnameMemberModalProps> = ({ isMemberNumberRequired = true, ...props }) => {\n    const { t } = useTranslation();\n\n    return (\n        <ExternalMemberModal<IMemberVerification>\n            {...props}\n            fields={[\n                {\n                    name: 'memberNumber',\n                    icon: IconType.Star,\n                    label: t(Translation.ExternalMemberPopup.Fields.MemberNumber),\n                    isMasked: false,\n                    required: isMemberNumberRequired,\n                    helperText: !isMemberNumberRequired ? t(Translation.ExternalMemberPopup.Fields.MemberNumberOptionalBenefits) : undefined,\n                },\n                {\n                    name: 'firstName',\n                    icon: IconType.Person,\n                    label: t(Translation.Navigation.SignUp.Inputs.FirstName),\n                    isMasked: false,\n                },\n                {\n                    name: 'lastName',\n                    icon: IconType.Person,\n                    label: t(Translation.Navigation.SignUp.Inputs.LastName),\n                    isMasked: false,\n                },\n                {\n                    name: 'email',\n                    icon: IconType.Email,\n                    label: t(Translation.Navigation.SignIn.EmailAddress),\n                    isMasked: false,\n                },\n            ]}\n        />\n    );\n};\n\nexport default EmailAndFullnameMemberModal;\n"]}

package/dist/src/components/members/SignInModal/ExternalMemberModal.d.ts

@@ -12,23 +12,17 @@ export type CommonMemberModalProps = {
     imageSize: Property.ObjectFit;
     provider: EMembershipProvider;
 };
-export type ExternalMemberModalProps<T extends FieldValues> = CommonMemberModalProps & {
+type ExternalMemberModalProps<T extends FieldValues> = CommonMemberModalProps & {
     fields: ExternalMemberModelField<T>[];
 };
-export declare enum ExternalMemberModelFieldType {
-    TextBox = "TextBox",
-    CheckBox = "CheckBox",
-    Phone = "Phone"
-}
-export type ExternalMemberModelField<T extends FieldValues> = {
+type ExternalMemberModelField<T extends FieldValues> = {
     name: keyof T & string;
     icon: IconType;
     label: string;
     profileMapping?: keyof UserProfile;
-    isMasked?: boolean;
+    isMasked: boolean;
     required?: boolean;
     helperText?: string;
-    type?: ExternalMemberModelFieldType;
 };
 declare const ExternalMemberModal: <T extends FieldValues & IMemberVerification>(props: ExternalMemberModalProps<T>) => React.JSX.Element;
 export default ExternalMemberModal;

package/dist/src/components/members/SignInModal/ExternalMemberModal.js

@@ -45,7 +45,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ExternalMemberModelFieldType = void 0;
 const core_1 = require("@roomstay/core");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = __importStar(require("react"));
@@ -53,8 +52,6 @@ const react_hook_form_1 = require("react-hook-form");
 const react_i18next_1 = require("react-i18next");
 const BookingAPI_1 = __importDefault(require("../../../api/BookingAPI"));
 const BEButton_1 = __importDefault(require("../../generic/BEButton"));
-const Checkbox_1 = __importDefault(require("../../generic/Checkbox/Checkbox"));
-const EnhancedPhoneNumberField_1 = __importDefault(require("../../generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField"));
 const Headline_1 = __importDefault(require("../../generic/Headline"));
 const Icon_1 = require("../../generic/Icon/Icon");
 const InputGroup_1 = __importDefault(require("../../generic/InputGroup/InputGroup"));
@@ -64,30 +61,22 @@ const Text_1 = __importStar(require("../../generic/Text"));
 const TextBox_1 = __importDefault(require("../../generic/TextBox"));
 const contexts_1 = require("../../../contexts");
 const hooks_1 = require("../../../hooks");
-const E164PhoneNumberFieldFeature_1 = __importDefault(require("../../../providers/feature/E164PhoneNumberFieldFeature"));
 const ImageProvider_1 = __importStar(require("../../../providers/ImageProvider"));
 const Translation_1 = require("../../../translations/Translation");
 const Color_1 = require("../../../util/Color");
 const ExternalMemberModal_module_scss_1 = __importDefault(require("./ExternalMemberModal.module.scss"));
-var ExternalMemberModelFieldType;
-(function (ExternalMemberModelFieldType) {
-    ExternalMemberModelFieldType["TextBox"] = "TextBox";
-    ExternalMemberModelFieldType["CheckBox"] = "CheckBox";
-    ExternalMemberModelFieldType["Phone"] = "Phone";
-})(ExternalMemberModelFieldType || (exports.ExternalMemberModelFieldType = ExternalMemberModelFieldType = {}));
 const ExternalMemberModal = (props) => {
     var _a;
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
     const { signUserIn, closeMemberSignupModal } = (0, react_1.useContext)(contexts_1.CompanyContext);
     const { t } = (0, react_i18next_1.useTranslation)();
-    const formMethods = (0, react_hook_form_1.useFormContext)();
     const [isLoading, setIsLoading] = (0, react_1.useState)(false);
     const [errorMessage, setErrorMessage] = (0, react_1.useState)('');
+    const formMethods = (0, react_hook_form_1.useForm)();
     const modalPrimaryColor = (hotel === null || hotel === void 0 ? void 0 : hotel.memberOnlyModalUsePrimaryColor) ? Color_1.Color.Accent : Color_1.Color.Success;
     const memberOnlySignupLink = (_a = hotel === null || hotel === void 0 ? void 0 : hotel.memberOnlySignupLinks) === null || _a === void 0 ? void 0 : _a[props.provider];
     const getValidationClass = (name) => {
-        console.log(formMethods.formState, formMethods.getValues());
         if (formMethods.formState.errors) {
             if (formMethods.formState.errors[name]) {
                 return 'error';
@@ -146,39 +135,11 @@ const ExternalMemberModal = (props) => {
                     props.subTitle && react_1.default.createElement(Text_1.default, { className: "u-marg-top external-member-modal-sub-title" }, props.subTitle),
                     react_1.default.createElement("form", { onSubmit: formMethods.handleSubmit(onSubmit) },
                         props.fields.map((field) => {
-                            const isRequired = field.required !== false;
-                            const validationStatus = getValidationClass(field.name);
-                            const register = formMethods.register(field.name, { required: isRequired });
-                            const inputProps = Object.assign({ iconProps: { color: Color_1.Color.DarkGrey }, icon: field.icon, inputProps: { disabled: isLoading }, placeholder: field.label, wide: true, required: isRequired, validationStatus }, register);
-                            const renderCheckbox = () => (react_1.default.createElement("div", { className: "u-marg-top", key: field.name },
-                                react_1.default.createElement(InputGroup_1.default, { dimensions: "1" },
-                                    react_1.default.createElement(Checkbox_1.default, Object.assign({ label: field.label }, register)))));
-                            const renderPhone = () => (react_1.default.createElement(InputGroup_1.default, { dimensions: "1", key: field.name }, E164PhoneNumberFieldFeature_1.default.isActive() ? (react_1.default.createElement(react_hook_form_1.Controller, { control: formMethods.control, name: field.name, rules: {
-                                    required: {
-                                        value: isRequired,
-                                        message: t(Translation_1.Translation.Step.Confirmation.Inputs.Required, {
-                                            field: t(Translation_1.Translation.Step.Confirmation.Inputs.Phone),
-                                        }),
-                                    },
-                                    minLength: { value: 5, message: 'Phone number is required' },
-                                    maxLength: { value: 17, message: 'Phone number is too long' },
-                                    pattern: {
-                                        value: /^[1-9]( |\d){1,15}$/g,
-                                        message: 'Incorrect phone number entered',
-                                    },
-                                }, render: ({ field: controllerField }) => (react_1.default.createElement(EnhancedPhoneNumberField_1.default, Object.assign({}, controllerField, register, { validationStatus: validationStatus }))) })) : (react_1.default.createElement(TextBox_1.default, Object.assign({}, inputProps)))));
-                            const renderTextInput = () => {
-                                return (react_1.default.createElement("div", { className: "u-marg-top u-marg-bottom", key: field.name },
-                                    react_1.default.createElement(InputGroup_1.default, { dimensions: "1" }, field.isMasked ? react_1.default.createElement(PasswordBox_1.PasswordBox, Object.assign({}, inputProps)) : react_1.default.createElement(TextBox_1.default, Object.assign({}, inputProps))),
-                                    field.helperText && (react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey }, field.helperText))));
-                            };
-                            if (field.type === ExternalMemberModelFieldType.CheckBox) {
-                                return renderCheckbox();
-                            }
-                            if (field.type === ExternalMemberModelFieldType.Phone) {
-                                return renderPhone();
-                            }
-                            return renderTextInput();
+                            const isRequired = field.required !== false; // Default to true if not specified
+                            const inputProps = Object.assign({ iconProps: { color: Color_1.Color.DarkGrey }, icon: field.icon, inputProps: { disabled: isLoading }, placeholder: field.label, wide: true, required: isRequired, validationStatus: getValidationClass(field.name) }, formMethods.register(field.name, { required: isRequired }));
+                            return (react_1.default.createElement("div", { className: "u-marg-top u-marg-bottom", key: field.name },
+                                react_1.default.createElement(InputGroup_1.default, { dimensions: "1" }, field.isMasked ? react_1.default.createElement(PasswordBox_1.PasswordBox, Object.assign({}, inputProps)) : react_1.default.createElement(TextBox_1.default, Object.assign({}, inputProps))),
+                                field.helperText && (react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey }, field.helperText))));
                         }),
                         react_1.default.createElement(BEButton_1.default, { isLoading: isLoading, htmlType: "submit", className: "u-marg-top external-member-modal-submit-btn", size: "normal", filled: true, primary: hotel === null || hotel === void 0 ? void 0 : hotel.memberOnlyModalUsePrimaryColor, success: !(hotel === null || hotel === void 0 ? void 0 : hotel.memberOnlyModalUsePrimaryColor), stopIconAnimation: true, icon: Icon_1.IconType.ArrowRight, iconPosition: "right", wide: true }, t(Translation_1.Translation.ExternalMemberPopup.Submit)),
                         react_1.default.createElement("div", { className: "u-marg-top" },

package/dist/src/components/members/SignInModal/ExternalMemberModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalMemberModal.js","sourceRoot":"/","sources":["src/components/members/SignInModal/ExternalMemberModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { EMembershipProvider, IMemberVerification, IMessage, nameof } from '@roomstay/core';\nimport classNames from 'classnames';\nimport { Property } from 'csstype';\nimport React, { useContext, useState } from 'react';\nimport { Controller, FieldValues, Path, SubmitHandler, useFormContext } from 'react-hook-form';\nimport { useTranslation } from 'react-i18next';\n\nimport API from '@/api/BookingAPI';\nimport BEButton from '@/components/generic/BEButton';\nimport Checkbox from '@/components/generic/Checkbox/Checkbox';\nimport EnhancedPhoneNumberField from '@/components/generic/custom/EnhancedPhoneNumberField/EnhancedPhoneNumberField';\nimport Headline from '@/components/generic/Headline';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport InputGroup from '@/components/generic/InputGroup/InputGroup';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport { PasswordBox } from '@/components/generic/PasswordBox/PasswordBox';\nimport Text, { TextType } from '@/components/generic/Text';\nimport TextBox, { TextBoxProps } from '@/components/generic/TextBox';\nimport { BasketContext, CompanyContext } from '@/contexts';\nimport { useCurrentHotel } from '@/hooks';\nimport UserProfile from '@/models/UserProfile';\nimport E164PhoneNumberFieldFeature from '@/providers/feature/E164PhoneNumberFieldFeature';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\n\nimport styles from './ExternalMemberModal.module.scss';\n\nexport type CommonMemberModalProps = {\n    title: string;\n    subTitle?: string;\n    image: string;\n    isOpen: boolean;\n    imageSize: Property.ObjectFit;\n    provider: EMembershipProvider;\n};\n\nexport type ExternalMemberModalProps<T extends FieldValues> = CommonMemberModalProps & {\n    fields: ExternalMemberModelField<T>[];\n};\n\nexport enum ExternalMemberModelFieldType {\n    TextBox = 'TextBox',\n    CheckBox = 'CheckBox',\n    Phone = 'Phone',\n}\nexport type ExternalMemberModelField<T extends FieldValues> = {\n    name: keyof T & string;\n    icon: IconType;\n    label: string;\n    profileMapping?: keyof UserProfile;\n    isMasked?: boolean;\n    required?: boolean;\n    helperText?: string;\n    type?: ExternalMemberModelFieldType;\n};\n\nconst ExternalMemberModal = <T extends FieldValues & IMemberVerification>(props: ExternalMemberModalProps<T>) => {\n    const { hotel } = useCurrentHotel();\n    const basketContext = useContext(BasketContext);\n    const { signUserIn, closeMemberSignupModal } = useContext(CompanyContext);\n    const { t } = useTranslation();\n    const formMethods: any = useFormContext<Record<string, string>>();\n\n    const [isLoading, setIsLoading] = useState(false);\n    const [errorMessage, setErrorMessage] = useState('');\n\n    const modalPrimaryColor = hotel?.memberOnlyModalUsePrimaryColor ? Color.Accent : Color.Success;\n    const memberOnlySignupLink = hotel?.memberOnlySignupLinks?.[props.provider];\n\n    const getValidationClass = (name: keyof T) => {\n        console.log(formMethods.formState, formMethods.getValues());\n        if (formMethods.formState.errors) {\n            if (formMethods.formState.errors[name]) {\n                return 'error';\n            } else {\n                return 'success';\n            }\n        }\n    };\n\n    const onSubmit: SubmitHandler<T> = async (fields) => {\n        setIsLoading(true);\n        setErrorMessage('');\n\n        try {\n            const hotelId = hotel?.hotelID as string;\n            const member = await API.Member.verifyMember(hotelId, props.provider, fields);\n\n            if (member && member.memberId) {\n                await signUserIn({\n                    saveState: true, //TODO: why was this false???\n                    memberNumber: member.memberId,\n                    memberProvider: props.provider,\n                    firstName: fields.firstName,\n                    lastName: fields.lastName,\n                    email: fields.email,\n                });\n\n                // Preset checkout defaults\n                basketContext.currentBasketRows?.forEach(\n                    (row) =>\n                        (row.checkoutDefaults = {\n                            firstName: fields.firstName,\n                            lastName: fields.lastName,\n                            email: fields.email,\n                        })\n                );\n            } else {\n                setErrorMessage(t(Translation.ExternalMemberPopup.InvalidMember));\n            }\n        } catch (e: any) {\n            if (e[nameof<IMessage>('Message')]) {\n                setErrorMessage(e.Message);\n            } else {\n                throw e;\n            }\n        } finally {\n            setIsLoading(false);\n        }\n    };\n\n    return (\n        <SimpleModal open={props.isOpen} onClose={closeMemberSignupModal} size={SimpleModalSize.Normal} alignCenter>\n            <div className={classNames(styles['external-member-modal'], 'row', `external-member-modal-${props.provider}`)}>\n                <div className=\"col-md-6 external-member-modal-image\">\n                    <img\n                        src={ImageProvider.resizeImage(props.image, ImageSize.Original)}\n                        alt={props.title}\n                        className={styles['external-member-image']}\n                        style={{ objectFit: props.imageSize }}\n                    />\n                </div>\n\n                <div className=\"col-md-6 u-pad--heavy external-member-modal-content\">\n                    <div className=\"u-pad\">\n                        <Headline className=\"external-member-modal-title\" bold color={modalPrimaryColor}>\n                            {props.title}\n                        </Headline>\n                        {props.subTitle && <Text className=\"u-marg-top external-member-modal-sub-title\">{props.subTitle}</Text>}\n\n                        <form onSubmit={formMethods.handleSubmit(onSubmit)}>\n                            {props.fields.map((field) => {\n                                const isRequired = field.required !== false;\n                                const validationStatus = getValidationClass(field.name);\n                                const register = formMethods.register(field.name as Path<T>, { required: isRequired });\n                                const inputProps: TextBoxProps = {\n                                    iconProps: { color: Color.DarkGrey },\n                                    icon: field.icon,\n                                    inputProps: { disabled: isLoading },\n                                    placeholder: field.label,\n                                    wide: true,\n                                    required: isRequired,\n                                    validationStatus,\n                                    ...register,\n                                };\n                                const renderCheckbox = () => (\n                                    <div className=\"u-marg-top\" key={field.name}>\n                                        <InputGroup dimensions=\"1\">\n                                            <Checkbox label={field.label} {...register} />\n                                        </InputGroup>\n                                    </div>\n                                );\n\n                                const renderPhone = () => (\n                                    <InputGroup dimensions=\"1\" key={field.name}>\n                                        {E164PhoneNumberFieldFeature.isActive() ? (\n                                            <Controller\n                                                control={formMethods.control}\n                                                name={field.name}\n                                                rules={{\n                                                    required: {\n                                                        value: isRequired,\n                                                        message: t(Translation.Step.Confirmation.Inputs.Required, {\n                                                            field: t(Translation.Step.Confirmation.Inputs.Phone),\n                                                        }),\n                                                    },\n                                                    minLength: { value: 5, message: 'Phone number is required' },\n                                                    maxLength: { value: 17, message: 'Phone number is too long' },\n                                                    pattern: {\n                                                        value: /^[1-9]( |\\d){1,15}$/g,\n                                                        message: 'Incorrect phone number entered',\n                                                    },\n                                                }}\n                                                render={({ field: controllerField }) => (\n                                                    <EnhancedPhoneNumberField {...controllerField} {...register} validationStatus={validationStatus} />\n                                                )}\n                                            />\n                                        ) : (\n                                            <TextBox {...inputProps} />\n                                        )}\n                                    </InputGroup>\n                                );\n\n                                const renderTextInput = () => {\n                                    return (\n                                        <div className=\"u-marg-top u-marg-bottom\" key={field.name}>\n                                            <InputGroup dimensions=\"1\">{field.isMasked ? <PasswordBox {...inputProps} /> : <TextBox {...inputProps} />}</InputGroup>\n\n                                            {field.helperText && (\n                                                <Text type={TextType.Small} color={Color.DarkGrey}>\n                                                    {field.helperText}\n                                                </Text>\n                                            )}\n                                        </div>\n                                    );\n                                };\n\n                                if (field.type === ExternalMemberModelFieldType.CheckBox) {\n                                    return renderCheckbox();\n                                }\n\n                                if (field.type === ExternalMemberModelFieldType.Phone) {\n                                    return renderPhone();\n                                }\n\n                                return renderTextInput();\n                            })}\n\n                            <BEButton\n                                isLoading={isLoading}\n                                htmlType=\"submit\"\n                                className=\"u-marg-top external-member-modal-submit-btn\"\n                                size=\"normal\"\n                                filled\n                                primary={hotel?.memberOnlyModalUsePrimaryColor}\n                                success={!hotel?.memberOnlyModalUsePrimaryColor}\n                                stopIconAnimation\n                                icon={IconType.ArrowRight}\n                                iconPosition=\"right\"\n                                wide\n                            >\n                                {t(Translation.ExternalMemberPopup.Submit)}\n                            </BEButton>\n                            <div className=\"u-marg-top\">\n                                <Text bold color={Color.Danger}>\n                                    {errorMessage}\n                                </Text>\n                            </div>\n                        </form>\n\n                        {memberOnlySignupLink && (\n                            <div className=\"external-member-modal-signup\">\n                                <div className=\"line-break\"></div>\n                                <div className=\"u-marg-top u-flex align-items-center u-justify-between\">\n                                    <Text type={TextType.Small} className=\"u-flex align-items-center\" color={Color.DarkGrey}>\n                                        {t(Translation.ExternalMemberPopup.DontHaveAccount)}\n                                    </Text>\n                                    <BEButton\n                                        className=\"external-member-modal-signup-btn\"\n                                        htmlType=\"button\"\n                                        size=\"normal\"\n                                        filled\n                                        primary\n                                        onClick={() => window.open(memberOnlySignupLink, '_blank')}\n                                    >\n                                        {t(Translation.ExternalMemberPopup.SignUp)}\n                                    </BEButton>\n                                </div>\n                            </div>\n                        )}\n                    </div>\n                </div>\n            </div>\n        </SimpleModal>\n    );\n};\n\nexport default ExternalMemberModal;\n"]}
+{"version":3,"file":"ExternalMemberModal.js","sourceRoot":"/","sources":["src/components/members/SignInModal/ExternalMemberModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { EMembershipProvider, IMemberVerification, IMessage, nameof } from '@roomstay/core';\nimport classNames from 'classnames';\nimport { Property } from 'csstype';\nimport React, { useContext, useState } from 'react';\nimport { FieldValues, Path, SubmitHandler, useForm } from 'react-hook-form';\nimport { useTranslation } from 'react-i18next';\n\nimport API from '@/api/BookingAPI';\nimport BEButton from '@/components/generic/BEButton';\nimport Headline from '@/components/generic/Headline';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport InputGroup from '@/components/generic/InputGroup/InputGroup';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport { PasswordBox } from '@/components/generic/PasswordBox/PasswordBox';\nimport Text, { TextType } from '@/components/generic/Text';\nimport TextBox, { TextBoxProps } from '@/components/generic/TextBox';\nimport { BasketContext, CompanyContext } from '@/contexts';\nimport { useCurrentHotel } from '@/hooks';\nimport UserProfile from '@/models/UserProfile';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\n\nimport styles from './ExternalMemberModal.module.scss';\n\nexport type CommonMemberModalProps = {\n    title: string;\n    subTitle?: string;\n    image: string;\n    isOpen: boolean;\n    imageSize: Property.ObjectFit;\n    provider: EMembershipProvider;\n};\n\ntype ExternalMemberModalProps<T extends FieldValues> = CommonMemberModalProps & {\n    fields: ExternalMemberModelField<T>[];\n};\n\ntype ExternalMemberModelField<T extends FieldValues> = {\n    name: keyof T & string;\n    icon: IconType;\n    label: string;\n    profileMapping?: keyof UserProfile;\n    isMasked: boolean;\n    required?: boolean;\n    helperText?: string;\n};\n\nconst ExternalMemberModal = <T extends FieldValues & IMemberVerification>(props: ExternalMemberModalProps<T>) => {\n    const { hotel } = useCurrentHotel();\n    const basketContext = useContext(BasketContext);\n    const { signUserIn, closeMemberSignupModal } = useContext(CompanyContext);\n    const { t } = useTranslation();\n    const [isLoading, setIsLoading] = useState(false);\n    const [errorMessage, setErrorMessage] = useState('');\n    const formMethods = useForm<T>();\n    const modalPrimaryColor = hotel?.memberOnlyModalUsePrimaryColor ? Color.Accent : Color.Success;\n    const memberOnlySignupLink = hotel?.memberOnlySignupLinks?.[props.provider];\n\n    const getValidationClass = (name: keyof T) => {\n        if (formMethods.formState.errors) {\n            if (formMethods.formState.errors[name]) {\n                return 'error';\n            } else {\n                return 'success';\n            }\n        }\n    };\n\n    const onSubmit: SubmitHandler<T> = async (fields) => {\n        setIsLoading(true);\n        setErrorMessage('');\n\n        try {\n            const hotelId = hotel?.hotelID as string;\n            const member = await API.Member.verifyMember(hotelId, props.provider, fields);\n\n            if (member && member.memberId) {\n                await signUserIn({\n                    saveState: true, //TODO: why was this false???\n                    memberNumber: member.memberId,\n                    memberProvider: props.provider,\n                    firstName: fields.firstName,\n                    lastName: fields.lastName,\n                    email: fields.email,\n                });\n\n                // Preset checkout defaults\n                basketContext.currentBasketRows?.forEach(\n                    (row) =>\n                        (row.checkoutDefaults = {\n                            firstName: fields.firstName,\n                            lastName: fields.lastName,\n                            email: fields.email,\n                        })\n                );\n            } else {\n                setErrorMessage(t(Translation.ExternalMemberPopup.InvalidMember));\n            }\n        } catch (e: any) {\n            if (e[nameof<IMessage>('Message')]) {\n                setErrorMessage(e.Message);\n            } else {\n                throw e;\n            }\n        } finally {\n            setIsLoading(false);\n        }\n    };\n\n    return (\n        <SimpleModal open={props.isOpen} onClose={closeMemberSignupModal} size={SimpleModalSize.Normal} alignCenter>\n            <div className={classNames(styles['external-member-modal'], 'row', `external-member-modal-${props.provider}`)}>\n                <div className=\"col-md-6 external-member-modal-image\">\n                    <img\n                        src={ImageProvider.resizeImage(props.image, ImageSize.Original)}\n                        alt={props.title}\n                        className={styles['external-member-image']}\n                        style={{ objectFit: props.imageSize }}\n                    />\n                </div>\n\n                <div className=\"col-md-6 u-pad--heavy external-member-modal-content\">\n                    <div className=\"u-pad\">\n                        <Headline className=\"external-member-modal-title\" bold color={modalPrimaryColor}>\n                            {props.title}\n                        </Headline>\n                        {props.subTitle && <Text className=\"u-marg-top external-member-modal-sub-title\">{props.subTitle}</Text>}\n\n                        <form onSubmit={formMethods.handleSubmit(onSubmit)}>\n                            {props.fields.map((field) => {\n                                const isRequired = field.required !== false; // Default to true if not specified\n                                const inputProps: TextBoxProps = {\n                                    iconProps: { color: Color.DarkGrey },\n                                    icon: field.icon,\n                                    inputProps: { disabled: isLoading },\n                                    placeholder: field.label,\n                                    wide: true,\n                                    required: isRequired,\n                                    validationStatus: getValidationClass(field.name),\n                                    ...formMethods.register(field.name as Path<T>, { required: isRequired }),\n                                };\n\n                                return (\n                                    <div className=\"u-marg-top u-marg-bottom\" key={field.name}>\n                                        <InputGroup dimensions=\"1\">{field.isMasked ? <PasswordBox {...inputProps} /> : <TextBox {...inputProps} />}</InputGroup>\n                                        {field.helperText && (\n                                            <Text type={TextType.Small} color={Color.DarkGrey}>\n                                                {field.helperText}\n                                            </Text>\n                                        )}\n                                    </div>\n                                );\n                            })}\n\n                            <BEButton\n                                isLoading={isLoading}\n                                htmlType=\"submit\"\n                                className=\"u-marg-top external-member-modal-submit-btn\"\n                                size=\"normal\"\n                                filled\n                                primary={hotel?.memberOnlyModalUsePrimaryColor}\n                                success={!hotel?.memberOnlyModalUsePrimaryColor}\n                                stopIconAnimation\n                                icon={IconType.ArrowRight}\n                                iconPosition=\"right\"\n                                wide\n                            >\n                                {t(Translation.ExternalMemberPopup.Submit)}\n                            </BEButton>\n                            <div className=\"u-marg-top\">\n                                <Text bold color={Color.Danger}>\n                                    {errorMessage}\n                                </Text>\n                            </div>\n                        </form>\n\n                        {memberOnlySignupLink && (\n                            <div className=\"external-member-modal-signup\">\n                                <div className=\"line-break\"></div>\n                                <div className=\"u-marg-top u-flex align-items-center u-justify-between\">\n                                    <Text type={TextType.Small} className=\"u-flex align-items-center\" color={Color.DarkGrey}>\n                                        {t(Translation.ExternalMemberPopup.DontHaveAccount)}\n                                    </Text>\n                                    <BEButton\n                                        className=\"external-member-modal-signup-btn\"\n                                        htmlType=\"button\"\n                                        size=\"normal\"\n                                        filled\n                                        primary\n                                        onClick={() => window.open(memberOnlySignupLink, '_blank')}\n                                    >\n                                        {t(Translation.ExternalMemberPopup.SignUp)}\n                                    </BEButton>\n                                </div>\n                            </div>\n                        )}\n                    </div>\n                </div>\n            </div>\n        </SimpleModal>\n    );\n};\n\nexport default ExternalMemberModal;\n"]}

package/dist/src/components/steps/date/BEPeoplePickerBlock.js

@@ -49,7 +49,6 @@ const Icon_1 = require("../../generic/Icon/Icon");
 const PromoCodeInput_1 = __importDefault(require("../../generic/PromoCodeInput"));
 const OccupancyWarningBlock_1 = __importDefault(require("./OccupancyWarningBlock"));
 const PeoplePickerRow_1 = __importDefault(require("./PeoplePickerRow"));
-const useSignedInMember_1 = require("../../../hooks/useSignedInMember");
 const BasketRow_1 = __importStar(require("../../../models/BasketRow"));
 const DIProvider_1 = require("../../../providers/DIProvider");
 const DataLayer_1 = __importStar(require("../../../util/DataLayer"));
@@ -58,7 +57,6 @@ function OriginalPeoplePickerBlock() {
     var _a, _b;
     const context = (0, react_1.useContext)(contexts_1.BasketContext);
     const { hotel } = (0, hooks_1.useCurrentHotel)();
-    const { signedInUser } = (0, useSignedInMember_1.useSignedInMember)();
     const updateRoomValues = (row, values) => {
         const { adults, children, infants, promoCode } = values;
         if (adults !== row.getAdults()) {
@@ -119,7 +117,7 @@ function OriginalPeoplePickerBlock() {
                     }, onChange: changeRoomValues, onRemove: removeBasketRowHandler })));
         }),
         react_1.default.createElement("div", { className: "u-marg-bottom" },
-            react_1.default.createElement(PromoCodeInput_1.default, { value: promocode, onChange: changePromoCode, valid: !promocode || promoCodeStatus === null || promoCodeStatus === BasketRow_1.EPromoCodeStatus.New ? undefined : promoCodeStatus === BasketRow_1.EPromoCodeStatus.Valid, variant: "outlined", row: selectedRow })),
+            react_1.default.createElement(PromoCodeInput_1.default, { value: promocode, onChange: changePromoCode, valid: !promocode || promoCodeStatus === null || promoCodeStatus === BasketRow_1.EPromoCodeStatus.New ? undefined : promoCodeStatus === BasketRow_1.EPromoCodeStatus.Valid, variant: "outlined", row: context.selectedBasketRow })),
         context.canAddAnotherRoom ? (react_1.default.createElement(BEButton_1.default, { isText: true, primary: true, icon: Icon_1.IconType.Add, stopIconAnimation: true, onClick: addAnotherRoomOnClickHandler }, t(Translation_1.Translation.Misc.AddAnotherRoom))) : (react_1.default.createElement(react_1.default.Fragment, null)),
         react_1.default.createElement(OccupancyWarningBlock_1.default, null)));
 }