@roomstay/frontend 2.1.18 → 2.1.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/dist/main.bundle.js +1 -1
  2. package/dist/src/components/generic/BookingWizard/BookingWizard.js +5 -1
  3. package/dist/src/components/generic/BookingWizard/BookingWizard.js.map +1 -1
  4. package/dist/src/components/generic/BookingWizard/BookingWizardContent.js +22 -19
  5. package/dist/src/components/generic/BookingWizard/BookingWizardContent.js.map +1 -1
  6. package/dist/src/components/generic/BookingWizard/BookingWizardContext.d.ts +1 -1
  7. package/dist/src/components/generic/BookingWizard/BookingWizardContext.js.map +1 -1
  8. package/dist/src/components/generic/BookingWizard/BookingWizardDateSelector/BookingWizardDateSelector.js +13 -9
  9. package/dist/src/components/generic/BookingWizard/BookingWizardDateSelector/BookingWizardDateSelector.js.map +1 -1
  10. package/dist/src/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector.js +6 -3
  11. package/dist/src/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector.js.map +1 -1
  12. package/dist/src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.js +16 -15
  13. package/dist/src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.js.map +1 -1
  14. package/dist/src/components/generic/DateRangePicker/FloatingDateRangePicker.js +1 -1
  15. package/dist/src/components/generic/DateRangePicker/FloatingDateRangePicker.js.map +1 -1
  16. package/dist/src/components/generic/Select/InputSelect.d.ts +8 -0
  17. package/dist/src/components/generic/Select/InputSelect.js +56 -0
  18. package/dist/src/components/generic/Select/InputSelect.js.map +1 -0
  19. package/dist/src/components/generic/Select/Select.d.ts +4 -4
  20. package/dist/src/components/generic/Select/Select.js +2 -2
  21. package/dist/src/components/generic/Select/Select.js.map +1 -1
  22. package/dist/src/components/generic/TextArea.d.ts +6 -3
  23. package/dist/src/components/generic/TextArea.js +29 -6
  24. package/dist/src/components/generic/TextArea.js.map +1 -1
  25. package/dist/src/components/generic/TextBox.d.ts +2 -2
  26. package/dist/src/components/generic/TextBox.js +26 -4
  27. package/dist/src/components/generic/TextBox.js.map +1 -1
  28. package/dist/src/components/navigation/Header.js +2 -3
  29. package/dist/src/components/navigation/Header.js.map +1 -1
  30. package/dist/src/index.d.ts +1 -0
  31. package/dist/src/index.js +3 -1
  32. package/dist/src/index.js.map +1 -1
  33. package/dist/src/pages/steps/StepThanks/StepThanksComponent.js +3 -1
  34. package/dist/src/pages/steps/StepThanks/StepThanksComponent.js.map +1 -1
  35. package/dist/src/stories/BookingWizard.stories.d.ts +1 -0
  36. package/dist/src/stories/BookingWizard.stories.js +12 -19
  37. package/dist/src/stories/BookingWizard.stories.js.map +1 -1
  38. package/dist/src/stories/Select.stories.d.ts +1 -17
  39. package/dist/src/stories/TextArea.stories.d.ts +2 -2
  40. package/dist/test.bundle.js +1 -1
  41. package/dist/tests/offline/entry/RSCompany.js +2 -2
  42. package/dist/tests/offline/entry/RSCompany.js.map +1 -1
  43. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"FloatingDateRangePicker.js","sourceRoot":"/","sources":["src/components/generic/DateRangePicker/FloatingDateRangePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { useRef, useState } from 'react';\n\nimport DateRangePicker, { DatePickerProps } from '@/components/generic/DateRangePicker/DateRangePicker';\n\nimport * as dayjs from 'dayjs';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\nimport styles from './DateRangePicker.module.scss';\nimport classNames from 'classnames';\nimport { Placement } from '@popperjs/core';\nimport { EBookingWizardTheme } from '../BookingWizard/BookingWizard';\n\nexport interface FloatingDateRangePickerProps extends Omit<DatePickerProps, 'selectedStartDate' | 'selectedEndDate' | 'onStartDateChanged' | 'onEndDateChanged'> {\n children?: React.ReactNode;\n startDate?: dayjs.Dayjs | null;\n endDate?: dayjs.Dayjs | null;\n overlayOffset?: [number, number];\n fixedStartDate?: boolean;\n container?: HTMLElement;\n\n selectedDateChanged?: (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => void;\n\n className?: string;\n\n overlay?: {\n placement?: Placement;\n fallbackPlacements?: Placement;\n };\n}\n\nexport interface FloatingDateRangePickerHandle {\n closePicker: () => void;\n openPicker: () => void;\n toggle: () => void;\n}\n\nconst FloatingDateRangePicker = React.forwardRef<FloatingDateRangePickerHandle, FloatingDateRangePickerProps>((props, ref) => {\n const { children, startDate: startDateProp, endDate: endDateProp, selectedDateChanged: selectedDateChangedProp, className, overlay, ...DatePickerProps } = props;\n\n const [isOpen, setIsOpen] = useState(false);\n\n const [startDate, setStartDate] = useState<dayjs.Dayjs | null>(null);\n\n const thisElement = useRef<HTMLDivElement | null>(null);\n\n React.useImperativeHandle(\n ref,\n () => ({\n closePicker: onOverlayClose,\n openPicker: onOverlayOpen,\n toggle: () => setIsOpen(!isOpen),\n }),\n []\n );\n\n const selectedDateChanged = (endDate: dayjs.Dayjs) => {\n if (selectedDateChangedProp && startDate) {\n selectedDateChangedProp(startDate, endDate);\n }\n\n if (endDate) {\n setIsOpen(false);\n }\n };\n\n const onStartDateChangedHandler = (date: any) => {\n setStartDate(date);\n };\n\n const onOverlayClose = () => {\n setIsOpen(false);\n };\n\n const onOverlayOpen = () => {\n setIsOpen(true);\n };\n\n const inner = (\n <div className=\"d-flex align-items-center flex-column\">\n <DateRangePicker\n selectedStartDate={startDateProp}\n selectedEndDate={endDateProp}\n onStartDateChanged={onStartDateChangedHandler}\n onEndDateChanged={selectedDateChanged}\n {...DatePickerProps}\n />\n </div>\n );\n\n return (\n <>\n <div ref={thisElement} className={className} onClick={onOverlayOpen}>\n {children}\n </div>\n <Overlay\n offset={props.overlayOffset}\n open={isOpen}\n onClose={onOverlayClose}\n container={props.container || thisElement.current?.parentElement?.parentElement}\n followElement={props.container || thisElement.current}\n {...(overlay || {})}\n className={classNames(styles['floating-roomstay-calendar'], {\n [styles['--small']]: DatePickerProps.small,\n [styles['--specific']]: DatePickerProps.theme === EBookingWizardTheme.Specific,\n [styles['--single']]: !DatePickerProps.showMultipleMonths,\n })}\n >\n {inner}\n </Overlay>\n </>\n );\n});\n\nFloatingDateRangePicker.displayName = 'FloatingDateRangePicker';\n\nexport default FloatingDateRangePicker;\n"]}
1
+ {"version":3,"file":"FloatingDateRangePicker.js","sourceRoot":"/","sources":["src/components/generic/DateRangePicker/FloatingDateRangePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { useRef, useState } from 'react';\n\nimport DateRangePicker, { DatePickerProps } from '@/components/generic/DateRangePicker/DateRangePicker';\n\nimport * as dayjs from 'dayjs';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\nimport styles from './DateRangePicker.module.scss';\nimport classNames from 'classnames';\nimport { Placement } from '@popperjs/core';\nimport { EBookingWizardTheme } from '../BookingWizard/BookingWizard';\n\nexport interface FloatingDateRangePickerProps extends Omit<DatePickerProps, 'selectedStartDate' | 'selectedEndDate' | 'onStartDateChanged' | 'onEndDateChanged'> {\n children?: React.ReactNode;\n startDate?: dayjs.Dayjs | null;\n endDate?: dayjs.Dayjs | null;\n overlayOffset?: [number, number];\n fixedStartDate?: boolean;\n container?: HTMLElement;\n\n selectedDateChanged?: (startDate: dayjs.Dayjs, endDate: dayjs.Dayjs) => void;\n\n className?: string;\n\n overlay?: {\n placement?: Placement;\n fallbackPlacements?: Placement;\n };\n}\n\nexport interface FloatingDateRangePickerHandle {\n closePicker: () => void;\n openPicker: () => void;\n toggle: () => void;\n}\n\nconst FloatingDateRangePicker = React.forwardRef<FloatingDateRangePickerHandle, FloatingDateRangePickerProps>((props, ref) => {\n const { children, startDate: startDateProp, endDate: endDateProp, selectedDateChanged: selectedDateChangedProp, className, overlay, ...DatePickerProps } = props;\n\n const [isOpen, setIsOpen] = useState(false);\n\n const [startDate, setStartDate] = useState<dayjs.Dayjs | null>(null);\n\n const thisElement = useRef<HTMLDivElement | null>(null);\n\n React.useImperativeHandle(\n ref,\n () => ({\n closePicker: onOverlayClose,\n openPicker: onOverlayOpen,\n toggle: () => setIsOpen(!isOpen),\n }),\n []\n );\n\n const selectedDateChanged = (endDate: dayjs.Dayjs) => {\n if (selectedDateChangedProp && startDate) {\n selectedDateChangedProp(startDate, endDate);\n }\n\n if (endDate) {\n setIsOpen(false);\n }\n };\n\n const onStartDateChangedHandler = (date: any) => {\n setStartDate(date);\n };\n\n const onOverlayClose = () => {\n setIsOpen(false);\n };\n\n const onOverlayOpen = () => {\n setIsOpen(true);\n };\n\n const inner = (\n <div className=\"d-flex align-items-center flex-column\">\n <DateRangePicker\n selectedStartDate={startDateProp}\n selectedEndDate={endDateProp}\n onStartDateChanged={onStartDateChangedHandler}\n onEndDateChanged={selectedDateChanged}\n {...DatePickerProps}\n />\n </div>\n );\n\n return (\n <>\n <div ref={thisElement} className={className} onClick={onOverlayOpen}>\n {children}\n </div>\n <Overlay\n offset={props.overlayOffset}\n open={isOpen}\n onClose={onOverlayClose}\n container={props.container || thisElement.current?.parentElement?.parentElement}\n followElement={props.container || thisElement.current}\n {...(overlay || {})}\n className={classNames(styles['floating-roomstay-calendar'], {\n [styles['--small']]: DatePickerProps.small,\n [styles['--specific']]: props.theme === EBookingWizardTheme.Specific,\n [styles['--single']]: !DatePickerProps.showMultipleMonths,\n })}\n >\n {inner}\n </Overlay>\n </>\n );\n});\n\nFloatingDateRangePicker.displayName = 'FloatingDateRangePicker';\n\nexport default FloatingDateRangePicker;\n"]}
@@ -0,0 +1,8 @@
1
+ import { ReactElement } from 'react';
2
+ import { TextBoxProps } from '../TextBox';
3
+ import { Option, SelectProps } from './Select';
4
+ type IInputSelectProps<TOption extends Option<KeyName>, KeyName extends string> = Pick<SelectProps<TOption, KeyName>, 'value' | 'onChange' | 'keyName' | 'labelName'> & Pick<TextBoxProps, 'label' | 'placeholder' | 'required'> & {
5
+ options: TOption[];
6
+ };
7
+ export default function InputSelect<TOption extends Option<KeyName>, KeyName extends string>({ value, onChange, options, keyName, labelName, label, placeholder, required, }: IInputSelectProps<TOption, KeyName>): ReactElement | null;
8
+ export {};
@@ -0,0 +1,56 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __importDefault = (this && this.__importDefault) || function (mod) {
26
+ return (mod && mod.__esModule) ? mod : { "default": mod };
27
+ };
28
+ Object.defineProperty(exports, "__esModule", { value: true });
29
+ const react_1 = __importStar(require("react"));
30
+ const TextBox_1 = __importDefault(require("../TextBox"));
31
+ const Select_1 = require("./Select");
32
+ const AutoFocusOnSelect_1 = require("../../../hooks/AutoFocusOnSelect");
33
+ function InputSelect({ value, onChange, options, keyName, labelName, label, placeholder, required, }) {
34
+ var _a;
35
+ const [container, setContainer] = (0, react_1.useState)(null);
36
+ const innerRef = (0, react_1.useRef)(null);
37
+ const getOption = (key) => {
38
+ return options.find((option) => option[keyName] === key);
39
+ };
40
+ const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen } = (0, AutoFocusOnSelect_1.useAutoFocusOnSelect)({
41
+ ref: innerRef.current,
42
+ });
43
+ return (react_1.default.createElement(react_1.default.Fragment, null,
44
+ react_1.default.createElement(TextBox_1.default, { label: label, inputProps: {
45
+ onClick: onTriggerClicked,
46
+ }, value: ((_a = getOption(value)) === null || _a === void 0 ? void 0 : _a.text) || '', ref: innerRef, placeholder: placeholder, required: required }),
47
+ react_1.default.createElement("div", { ref: setContainer }),
48
+ react_1.default.createElement(Select_1.Select, { keyName: keyName, labelName: labelName, options: options, target: container, onClose: onDropdownClosed, onChange: (value) => {
49
+ onItemSelected();
50
+ onChange === null || onChange === void 0 ? void 0 : onChange(value);
51
+ }, open: isDropdownOpen, overlay: {
52
+ className: 'w-100',
53
+ } })));
54
+ }
55
+ exports.default = InputSelect;
56
+ //# sourceMappingURL=InputSelect.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"InputSelect.js","sourceRoot":"/","sources":["src/components/generic/Select/InputSelect.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA8D;AAC9D,2EAAqE;AACrE,+DAAiF;AACjF,iEAAiE;AAOjE,SAAwB,WAAW,CAA0D,EACzF,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,EACP,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,GAC0B;;IAClC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAwB,IAAI,CAAC,CAAC;IACxE,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IAEhD,MAAM,SAAS,GAAG,CAAC,GAAsB,EAAuB,EAAE;QAC9D,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,MAAM,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,EAAE,cAAc,EAAE,GAAG,IAAA,wCAAoB,EAAC;QAChG,GAAG,EAAE,QAAQ,CAAC,OAAO;KACxB,CAAC,CAAC;IAEH,OAAO,CACH;QACI,8BAAC,iBAAO,IACJ,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE;gBACR,OAAO,EAAE,gBAAgB;aAC5B,EACD,KAAK,EAAE,CAAA,MAAA,SAAS,CAAC,KAAK,CAAC,0CAAE,IAAI,KAAI,EAAE,EACnC,GAAG,EAAE,QAAQ,EACb,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,GACpB;QACF,uCAAK,GAAG,EAAE,YAAY,GAAI;QAC1B,8BAAC,eAAM,IACH,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,gBAAgB,EACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;gBAChB,cAAc,EAAE,CAAC;gBACjB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;YACtB,CAAC,EACD,IAAI,EAAE,cAAc,EACpB,OAAO,EAAE;gBACL,SAAS,EAAE,OAAO;aACrB,GACH,CACH,CACN,CAAC;AACN,CAAC;AAnDD,8BAmDC","sourcesContent":["import React, { ReactElement, useRef, useState } from 'react';\nimport TextBox, { TextBoxProps } from '@/components/generic/TextBox';\nimport { Option, Select, SelectProps } from '@/components/generic/Select/Select';\nimport { useAutoFocusOnSelect } from '@/hooks/AutoFocusOnSelect';\n\ntype IInputSelectProps<TOption extends Option<KeyName>, KeyName extends string> = Pick<SelectProps<TOption, KeyName>, 'value' | 'onChange' | 'keyName' | 'labelName'> &\n Pick<TextBoxProps, 'label' | 'placeholder' | 'required'> & {\n options: TOption[];\n };\n\nexport default function InputSelect<TOption extends Option<KeyName>, KeyName extends string>({\n value,\n onChange,\n options,\n keyName,\n labelName,\n label,\n placeholder,\n required,\n}: IInputSelectProps<TOption, KeyName>): ReactElement | null {\n const [container, setContainer] = useState<HTMLDivElement | null>(null);\n const innerRef = useRef<HTMLInputElement>(null);\n\n const getOption = (key?: TOption[KeyName]): TOption | undefined => {\n return options.find((option) => option[keyName] === key);\n };\n\n const { onDropdownClosed, onItemSelected, onTriggerClicked, isDropdownOpen } = useAutoFocusOnSelect({\n ref: innerRef.current,\n });\n\n return (\n <>\n <TextBox\n label={label}\n inputProps={{\n onClick: onTriggerClicked,\n }}\n value={getOption(value)?.text || ''}\n ref={innerRef}\n placeholder={placeholder}\n required={required}\n />\n <div ref={setContainer} />\n <Select<TOption, KeyName>\n keyName={keyName}\n labelName={labelName}\n options={options}\n target={container}\n onClose={onDropdownClosed}\n onChange={(value) => {\n onItemSelected();\n onChange?.(value);\n }}\n open={isDropdownOpen}\n overlay={{\n className: 'w-100',\n }}\n />\n </>\n );\n}\n"]}
@@ -11,7 +11,7 @@ export type TOptionGroup<T> = {
11
11
  options: T[];
12
12
  };
13
13
  export type TSelectOptionKey<T> = TOptionGroup<T> | T;
14
- type Select<TOption extends Option<KeyName>, KeyName extends string> = {
14
+ export type SelectProps<TOption extends Option<KeyName>, KeyName extends string> = {
15
15
  options: TSelectOptionKey<TOption>[];
16
16
  keyName: KeyName;
17
17
  value?: TOption[KeyName];
@@ -26,13 +26,13 @@ type Select<TOption extends Option<KeyName>, KeyName extends string> = {
26
26
  renderLabel?: (option?: TOption | null) => ReactElement | null;
27
27
  nativeOnMobile?: boolean;
28
28
  overlay?: Partial<Omit<OverlayProps, 'children' | 'open' | 'container' | 'followElement' | 'onClose' | 'overlayRef'>>;
29
+ hideExpandIcon?: boolean;
29
30
  };
30
- export declare const InnerSelect: <TOption extends Option<KeyName>, KeyName extends string>({ target, open, onClose, options, value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile, overlay, renderLabel, }: Select<TOption, KeyName>, ref: Ref<HTMLDivElement | null>) => JSX.Element;
31
- export declare const Select: <TOption extends Option<KeyName>, KeyName extends string>(p: Select<TOption, KeyName> & {
31
+ export declare const InnerSelect: <TOption extends Option<KeyName>, KeyName extends string>({ target, open, onClose, options, value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile, overlay, renderLabel, hideExpandIcon, }: SelectProps<TOption, KeyName>, ref: Ref<HTMLDivElement | null>) => JSX.Element;
32
+ export declare const Select: <TOption extends Option<KeyName>, KeyName extends string>(p: SelectProps<TOption, KeyName> & {
32
33
  ref?: React.Ref<HTMLDivElement> | undefined;
33
34
  }) => JSX.Element;
34
35
  export interface IDefaultSelectOption {
35
36
  value: string;
36
37
  text: string;
37
38
  }
38
- export {};
@@ -38,7 +38,7 @@ const CombineState_1 = require("../../../hooks/CombineState");
38
38
  const WindowSize_1 = require("../../../hooks/WindowSize");
39
39
  const Text_1 = __importStar(require("../Text"));
40
40
  const MOBILE_BREAKPOINT = 992;
41
- const InnerSelect = ({ target, open, onClose, options = [], value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile = false, overlay, renderLabel, }, ref) => {
41
+ const InnerSelect = ({ target, open, onClose, options = [], value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile = false, overlay, renderLabel, hideExpandIcon, }, ref) => {
42
42
  var _a, _b;
43
43
  const { width } = (0, WindowSize_1.useWindowSize)();
44
44
  const targetRef = (0, react_1.useRef)(null);
@@ -135,7 +135,7 @@ const InnerSelect = ({ target, open, onClose, options = [], value, onChange, key
135
135
  native ? (react_1.default.createElement("select", { value: value, onChange: (e) => onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value) }, flattenOptions.map((item) => {
136
136
  return react_1.default.createElement("option", { value: value, key: item[keyName], label: _getStringLabel(item[keyName]) });
137
137
  }))) : (_getLabel(value)),
138
- react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown, color: Color_1.Color.DarkGrey }))),
138
+ hideExpandIcon ? null : react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown, color: Color_1.Color.DarkGrey }))),
139
139
  !native && (react_1.default.createElement(Overlay_1.Overlay, { offset: offset, usePortal: (_a = overlay === null || overlay === void 0 ? void 0 : overlay.usePortal) !== null && _a !== void 0 ? _a : true, followElement: target || targetRef.current || undefined, placement: (_b = overlay === null || overlay === void 0 ? void 0 : overlay.placement) !== null && _b !== void 0 ? _b : 'bottom-start', strategy: overlay === null || overlay === void 0 ? void 0 : overlay.strategy, open: open === undefined ? !!_open : open, onClose: _onClose, containerClassName: overlay === null || overlay === void 0 ? void 0 : overlay.containerClassName, overlayRef: overlayRef, hideStyles: overlay === null || overlay === void 0 ? void 0 : overlay.hideStyles },
140
140
  react_1.default.createElement("div", { ref: optionContainerRef, className: (0, classnames_1.default)('rs-select--suggest-list', overlay === null || overlay === void 0 ? void 0 : overlay.className) }, _renderOptions(options))))));
141
141
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Select.js","sourceRoot":"/","sources":["src/components/generic/Select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, ReactElement, ReactNode, Ref, useImperativeHandle, useMemo, useRef } from 'react';\nimport Icon, { IconType } from '../Icon/Icon';\n\nimport classNames from 'classnames';\n\nimport './Select.global.scss';\nimport { Overlay, OverlayProps } from '@/components/generic/Overlay/Overlay';\nimport { useKeyboardControlOnSelect } from '@/hooks/KeyboardControlOnSelect';\nimport { Color } from '@/util/Color';\nimport { useCombinedState } from '@/hooks/CombineState';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport Text, { TextType } from '@/components/generic/Text';\n\nexport type Option<KeyName extends string> = {\n [keyName in KeyName]: string;\n} & Record<any, any> & { options?: Option<KeyName>[] };\n\nexport type TOptionGroup<T> = {\n name: string;\n options: T[];\n};\n\nexport type TSelectOptionKey<T> = TOptionGroup<T> | T;\n\ntype Select<TOption extends Option<KeyName>, KeyName extends string> = {\n options: TSelectOptionKey<TOption>[];\n keyName: KeyName;\n\n value?: TOption[KeyName];\n labelName?: TOption[keyof TOption];\n target?: HTMLElement | null;\n open?: boolean;\n onClose?: (e: Event) => void;\n onChange?: (value: TOption[KeyName]) => void;\n className?: string;\n offset?: [number, number];\n renderOption?: (option?: TOption) => ReactElement | null;\n renderLabel?: (option?: TOption | null) => ReactElement | null;\n nativeOnMobile?: boolean;\n overlay?: Partial<Omit<OverlayProps, 'children' | 'open' | 'container' | 'followElement' | 'onClose' | 'overlayRef'>>;\n};\n\nconst MOBILE_BREAKPOINT = 992;\n\nexport const InnerSelect = <TOption extends Option<KeyName>, KeyName extends string>(\n {\n target,\n open,\n onClose,\n options = [],\n value,\n onChange,\n keyName,\n labelName,\n className,\n offset,\n renderOption,\n nativeOnMobile = false,\n overlay,\n renderLabel,\n }: Select<TOption, KeyName>,\n ref: Ref<HTMLDivElement | null>\n) => {\n const { width } = useWindowSize();\n const targetRef = useRef<HTMLSpanElement>(null);\n const optionRefs = useRef<{ [id: string]: HTMLDivElement | null }>({});\n const optionContainerRef = useRef<HTMLDivElement | null>(null);\n const [_open, _setIsOpen] = useCombinedState<boolean>(open, false);\n const flattenOptions = useMemo<TOption[]>(() => {\n return options.reduce<TOption[]>((result, optionGroupProbably) => {\n if (optionGroupProbably.options) return result.concat(optionGroupProbably.options);\n return result.concat(optionGroupProbably as TOption);\n }, []);\n }, [options]);\n\n // TODO: Force to fix later\n nativeOnMobile = false;\n\n const _onClose = (e: Event): void => {\n _setIsOpen(false);\n onClose?.(e);\n };\n\n const overlayRef = useRef<HTMLDivElement | null>(null);\n useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(ref, () => overlayRef.current);\n\n const _onSelected = (value: TOption[KeyName]) => {\n onChange?.(value);\n _setIsOpen(false);\n };\n\n const _getOption = (value?: TOption[KeyName]): TOption | undefined => {\n for (const option of options) {\n if (option.options && Array.isArray(option.options)) {\n for (const childOption of option.options) {\n if (childOption[keyName] === value) {\n return childOption;\n }\n }\n } else {\n // If we're in here it means that this option doesn't have children and is in fact an individual group\n if ((option as TOption)[keyName] === value) {\n return option as TOption;\n }\n }\n }\n };\n\n const { selectingItem, onItemMouseMove, onItemMouseLeave, onItemMouseEnter } = useKeyboardControlOnSelect<TOption, KeyName>({\n onSelected: (item) => _onSelected(item[keyName]),\n isEnabled: !!_open,\n options,\n idName: keyName,\n overlayRef: overlayRef.current,\n defaultOption: _getOption(value),\n optionRefs,\n optionContainerRef,\n });\n\n const _getStringLabel = (value?: TOption[KeyName]): string => {\n const option = _getOption(value);\n return option?.[labelName] || value || '';\n };\n\n const _getLabel = (value?: TOption[KeyName]): string | ReactNode => {\n const option = _getOption(value);\n\n if (renderLabel) {\n return renderLabel(option);\n }\n\n return _getStringLabel(value);\n };\n\n const _renderOptions = (options?: TSelectOptionKey<TOption>[]): ReactElement | JSX.Element[] | null => {\n if (!options) return null;\n return options.map((option, index) => {\n const isGroup = option.options;\n\n if (isGroup) {\n return _renderGroup(option.name, option.options);\n }\n\n return _renderOption({ option: option as TOption, key: index });\n });\n };\n\n const _renderGroup = (name: string, options?: TSelectOptionKey<TOption>[]) => {\n return (\n <>\n <div className=\"rs-select--suggest-list-item --group-title\">\n <Text type={TextType.Small} color={Color.DarkGrey}>\n {name}\n </Text>\n </div>\n {_renderOptions(options)}\n </>\n );\n };\n\n const _renderOption = ({ option, key }: { option: TOption; key: any }) => {\n const isSelected = option[keyName] === value;\n const isSelecting = option[keyName] === selectingItem?.[keyName];\n\n return (\n <div\n ref={(ref) => (optionRefs.current[option[keyName]] = ref)}\n key={key}\n className={classNames('rs-select--suggest-list-item', { '--selected': isSelected || isSelecting })}\n onClick={() => _onSelected(option[keyName])}\n onMouseEnter={() => {\n onItemMouseEnter(option);\n }}\n onMouseLeave={() => onItemMouseLeave()}\n onMouseMove={() => onItemMouseMove()}\n >\n <Text type={TextType.Small} className=\"rs-select--suggest-list-option-name\">\n {renderOption ? renderOption(option) : labelName ? option[labelName] : ''}\n </Text>\n {isSelected && (\n <span className=\"rs-select--suggest-list-option-icon\">\n <Icon icon={IconType.Check} />\n </span>\n )}\n </div>\n );\n };\n\n const native = width && width < MOBILE_BREAKPOINT && nativeOnMobile;\n\n return (\n <>\n {(native || !target) && (\n <span className={classNames('be-select', className)} onClick={() => _setIsOpen(true)} ref={targetRef}>\n {native ? (\n <select value={value} onChange={(e) => onChange?.(e.target.value as TOption[KeyName])}>\n {flattenOptions.map((item) => {\n return <option value={value} key={item[keyName]} label={_getStringLabel(item[keyName])}></option>;\n })}\n </select>\n ) : (\n _getLabel(value)\n )}\n <Icon icon={IconType.Dropdown} color={Color.DarkGrey} />\n </span>\n )}\n {!native && (\n <Overlay\n offset={offset}\n usePortal={overlay?.usePortal ?? true}\n followElement={target || targetRef.current || undefined}\n placement={overlay?.placement ?? 'bottom-start'}\n strategy={overlay?.strategy}\n open={open === undefined ? !!_open : open}\n onClose={_onClose}\n containerClassName={overlay?.containerClassName}\n overlayRef={overlayRef}\n hideStyles={overlay?.hideStyles}\n >\n <div ref={optionContainerRef} className={classNames('rs-select--suggest-list', overlay?.className)}>\n {_renderOptions(options)}\n </div>\n </Overlay>\n )}\n </>\n );\n};\n\nexport const Select = forwardRef(InnerSelect) as <TOption extends Option<KeyName>, KeyName extends string>(\n p: Select<TOption, KeyName> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n\nexport interface IDefaultSelectOption {\n value: string;\n text: string;\n}\n"]}
1
+ {"version":3,"file":"Select.js","sourceRoot":"/","sources":["src/components/generic/Select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, ReactElement, ReactNode, Ref, useImperativeHandle, useMemo, useRef } from 'react';\nimport Icon, { IconType } from '../Icon/Icon';\n\nimport classNames from 'classnames';\n\nimport './Select.global.scss';\nimport { Overlay, OverlayProps } from '@/components/generic/Overlay/Overlay';\nimport { useKeyboardControlOnSelect } from '@/hooks/KeyboardControlOnSelect';\nimport { Color } from '@/util/Color';\nimport { useCombinedState } from '@/hooks/CombineState';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport Text, { TextType } from '@/components/generic/Text';\n\nexport type Option<KeyName extends string> = {\n [keyName in KeyName]: string;\n} & Record<any, any> & { options?: Option<KeyName>[] };\n\nexport type TOptionGroup<T> = {\n name: string;\n options: T[];\n};\n\nexport type TSelectOptionKey<T> = TOptionGroup<T> | T;\n\nexport type SelectProps<TOption extends Option<KeyName>, KeyName extends string> = {\n options: TSelectOptionKey<TOption>[];\n keyName: KeyName;\n\n value?: TOption[KeyName];\n labelName?: TOption[keyof TOption];\n target?: HTMLElement | null;\n open?: boolean;\n onClose?: (e: Event) => void;\n onChange?: (value: TOption[KeyName]) => void;\n className?: string;\n offset?: [number, number];\n renderOption?: (option?: TOption) => ReactElement | null;\n renderLabel?: (option?: TOption | null) => ReactElement | null;\n nativeOnMobile?: boolean;\n overlay?: Partial<Omit<OverlayProps, 'children' | 'open' | 'container' | 'followElement' | 'onClose' | 'overlayRef'>>;\n hideExpandIcon?: boolean;\n};\n\nconst MOBILE_BREAKPOINT = 992;\n\nexport const InnerSelect = <TOption extends Option<KeyName>, KeyName extends string>(\n {\n target,\n open,\n onClose,\n options = [],\n value,\n onChange,\n keyName,\n labelName,\n className,\n offset,\n renderOption,\n nativeOnMobile = false,\n overlay,\n renderLabel,\n hideExpandIcon,\n }: SelectProps<TOption, KeyName>,\n ref: Ref<HTMLDivElement | null>\n) => {\n const { width } = useWindowSize();\n const targetRef = useRef<HTMLSpanElement>(null);\n const optionRefs = useRef<{ [id: string]: HTMLDivElement | null }>({});\n const optionContainerRef = useRef<HTMLDivElement | null>(null);\n const [_open, _setIsOpen] = useCombinedState<boolean>(open, false);\n const flattenOptions = useMemo<TOption[]>(() => {\n return options.reduce<TOption[]>((result, optionGroupProbably) => {\n if (optionGroupProbably.options) return result.concat(optionGroupProbably.options);\n return result.concat(optionGroupProbably as TOption);\n }, []);\n }, [options]);\n\n // TODO: Force to fix later\n nativeOnMobile = false;\n\n const _onClose = (e: Event): void => {\n _setIsOpen(false);\n onClose?.(e);\n };\n\n const overlayRef = useRef<HTMLDivElement | null>(null);\n useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(ref, () => overlayRef.current);\n\n const _onSelected = (value: TOption[KeyName]) => {\n onChange?.(value);\n _setIsOpen(false);\n };\n\n const _getOption = (value?: TOption[KeyName]): TOption | undefined => {\n for (const option of options) {\n if (option.options && Array.isArray(option.options)) {\n for (const childOption of option.options) {\n if (childOption[keyName] === value) {\n return childOption;\n }\n }\n } else {\n // If we're in here it means that this option doesn't have children and is in fact an individual group\n if ((option as TOption)[keyName] === value) {\n return option as TOption;\n }\n }\n }\n };\n\n const { selectingItem, onItemMouseMove, onItemMouseLeave, onItemMouseEnter } = useKeyboardControlOnSelect<TOption, KeyName>({\n onSelected: (item) => _onSelected(item[keyName]),\n isEnabled: !!_open,\n options,\n idName: keyName,\n overlayRef: overlayRef.current,\n defaultOption: _getOption(value),\n optionRefs,\n optionContainerRef,\n });\n\n const _getStringLabel = (value?: TOption[KeyName]): string => {\n const option = _getOption(value);\n return option?.[labelName] || value || '';\n };\n\n const _getLabel = (value?: TOption[KeyName]): string | ReactNode => {\n const option = _getOption(value);\n\n if (renderLabel) {\n return renderLabel(option);\n }\n\n return _getStringLabel(value);\n };\n\n const _renderOptions = (options?: TSelectOptionKey<TOption>[]): ReactElement | JSX.Element[] | null => {\n if (!options) return null;\n return options.map((option, index) => {\n const isGroup = option.options;\n\n if (isGroup) {\n return _renderGroup(option.name, option.options);\n }\n\n return _renderOption({ option: option as TOption, key: index });\n });\n };\n\n const _renderGroup = (name: string, options?: TSelectOptionKey<TOption>[]) => {\n return (\n <>\n <div className=\"rs-select--suggest-list-item --group-title\">\n <Text type={TextType.Small} color={Color.DarkGrey}>\n {name}\n </Text>\n </div>\n {_renderOptions(options)}\n </>\n );\n };\n\n const _renderOption = ({ option, key }: { option: TOption; key: any }) => {\n const isSelected = option[keyName] === value;\n const isSelecting = option[keyName] === selectingItem?.[keyName];\n\n return (\n <div\n ref={(ref) => (optionRefs.current[option[keyName]] = ref)}\n key={key}\n className={classNames('rs-select--suggest-list-item', { '--selected': isSelected || isSelecting })}\n onClick={() => _onSelected(option[keyName])}\n onMouseEnter={() => {\n onItemMouseEnter(option);\n }}\n onMouseLeave={() => onItemMouseLeave()}\n onMouseMove={() => onItemMouseMove()}\n >\n <Text type={TextType.Small} className=\"rs-select--suggest-list-option-name\">\n {renderOption ? renderOption(option) : labelName ? option[labelName] : ''}\n </Text>\n {isSelected && (\n <span className=\"rs-select--suggest-list-option-icon\">\n <Icon icon={IconType.Check} />\n </span>\n )}\n </div>\n );\n };\n\n const native = width && width < MOBILE_BREAKPOINT && nativeOnMobile;\n\n return (\n <>\n {(native || !target) && (\n <span className={classNames('be-select', className)} onClick={() => _setIsOpen(true)} ref={targetRef}>\n {native ? (\n <select value={value} onChange={(e) => onChange?.(e.target.value as TOption[KeyName])}>\n {flattenOptions.map((item) => {\n return <option value={value} key={item[keyName]} label={_getStringLabel(item[keyName])}></option>;\n })}\n </select>\n ) : (\n _getLabel(value)\n )}\n {hideExpandIcon ? null : <Icon icon={IconType.Dropdown} color={Color.DarkGrey} />}\n </span>\n )}\n {!native && (\n <Overlay\n offset={offset}\n usePortal={overlay?.usePortal ?? true}\n followElement={target || targetRef.current || undefined}\n placement={overlay?.placement ?? 'bottom-start'}\n strategy={overlay?.strategy}\n open={open === undefined ? !!_open : open}\n onClose={_onClose}\n containerClassName={overlay?.containerClassName}\n overlayRef={overlayRef}\n hideStyles={overlay?.hideStyles}\n >\n <div ref={optionContainerRef} className={classNames('rs-select--suggest-list', overlay?.className)}>\n {_renderOptions(options)}\n </div>\n </Overlay>\n )}\n </>\n );\n};\n\nexport const Select = forwardRef(InnerSelect) as <TOption extends Option<KeyName>, KeyName extends string>(\n p: SelectProps<TOption, KeyName> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n\nexport interface IDefaultSelectOption {\n value: string;\n text: string;\n}\n"]}
@@ -1,4 +1,7 @@
1
- import React from 'react';
2
- export type TextAreaProps = JSX.IntrinsicElements['textarea'];
3
- declare const _default: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "key" | keyof React.TextareaHTMLAttributes<HTMLTextAreaElement>> & React.RefAttributes<HTMLTextAreaElement>>;
1
+ import React, { ReactNode } from 'react';
2
+ export type TextAreaProps = JSX.IntrinsicElements['textarea'] & {
3
+ label?: ReactNode;
4
+ required?: boolean;
5
+ };
6
+ declare const _default: React.ForwardRefExoticComponent<Pick<TextAreaProps, "label" | "key" | keyof React.TextareaHTMLAttributes<HTMLTextAreaElement>> & React.RefAttributes<HTMLTextAreaElement>>;
4
7
  export default _default;
@@ -1,12 +1,35 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
4
24
  };
5
25
  Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
7
- const react_2 = require("react");
26
+ const react_1 = __importStar(require("react"));
8
27
  const TextArea = (props, ref) => {
9
- return react_1.default.createElement("textarea", Object.assign({}, props, { ref: ref }));
28
+ return (react_1.default.createElement(react_1.default.Fragment, null,
29
+ props.label && (react_1.default.createElement("label", { className: "u-marg-bottom--lighter text-bold d-flex" },
30
+ props.label,
31
+ (props === null || props === void 0 ? void 0 : props.required) && react_1.default.createElement("div", { style: { color: 'red' } }, "*"))),
32
+ react_1.default.createElement("textarea", Object.assign({}, props, { ref: ref }))));
10
33
  };
11
- exports.default = (0, react_2.forwardRef)(TextArea);
34
+ exports.default = (0, react_1.forwardRef)(TextArea);
12
35
  //# sourceMappingURL=TextArea.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.js","sourceRoot":"/","sources":["src/components/generic/TextArea.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,iCAA6D;AAI7D,MAAM,QAAQ,GAAiE,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC1F,OAAO,4DAAc,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAC;AAC7C,CAAC,CAAC;AAEF,kBAAe,IAAA,kBAAU,EAAC,QAAQ,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { forwardRef, ForwardRefRenderFunction } from 'react';\n\nexport type TextAreaProps = JSX.IntrinsicElements['textarea'];\n\nconst TextArea: ForwardRefRenderFunction<HTMLTextAreaElement, TextAreaProps> = (props, ref) => {\n return <textarea {...props} ref={ref} />;\n};\n\nexport default forwardRef(TextArea);\n"]}
1
+ {"version":3,"file":"TextArea.js","sourceRoot":"/","sources":["src/components/generic/TextArea.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA+E;AAO/E,MAAM,QAAQ,GAAiE,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC1F,OAAO,CACH;QACK,KAAK,CAAC,KAAK,IAAI,CACZ,yCAAO,SAAS,EAAC,yCAAyC;YACrD,KAAK,CAAC,KAAK;YACX,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,KAAI,uCAAK,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAS,CACrD,CACX;QACD,4DAAc,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAClC,CACN,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,IAAA,kBAAU,EAAC,QAAQ,CAAC,CAAC","sourcesContent":["import React, { forwardRef, ForwardRefRenderFunction, ReactNode } from 'react';\n\nexport type TextAreaProps = JSX.IntrinsicElements['textarea'] & {\n label?: ReactNode;\n required?: boolean;\n};\n\nconst TextArea: ForwardRefRenderFunction<HTMLTextAreaElement, TextAreaProps> = (props, ref) => {\n return (\n <>\n {props.label && (\n <label className=\"u-marg-bottom--lighter text-bold d-flex\">\n {props.label}\n {props?.required && <div style={{ color: 'red' }}>*</div>}\n </label>\n )}\n <textarea {...props} ref={ref} />\n </>\n );\n};\n\nexport default forwardRef(TextArea);\n"]}
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { ReactNode } from 'react';
2
2
  import { IconType } from './Icon/Icon';
3
3
  export interface TextBoxProps {
4
4
  icon?: IconType;
@@ -7,7 +7,7 @@ export interface TextBoxProps {
7
7
  type?: 'text' | 'tel' | 'password' | 'email';
8
8
  name?: string;
9
9
  required?: boolean;
10
- label?: string;
10
+ label?: ReactNode;
11
11
  validationStatus?: 'success' | 'error';
12
12
  value?: string;
13
13
  className?: string;
@@ -1,14 +1,36 @@
1
1
  "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
2
25
  var __importDefault = (this && this.__importDefault) || function (mod) {
3
26
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
27
  };
5
28
  Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
7
- const react_2 = require("react");
29
+ const react_1 = __importStar(require("react"));
8
30
  const Icon_1 = __importDefault(require("./Icon/Icon"));
9
31
  const classnames_1 = __importDefault(require("classnames"));
10
32
  const TextBox = (props, ref) => {
11
- const [selected, setSelected] = (0, react_2.useState)(false);
33
+ const [selected, setSelected] = (0, react_1.useState)(false);
12
34
  const type = props.type ? props.type : 'text';
13
35
  const inputProperties = Object.assign({ type, className: 'text-small', placeholder: props.placeholder }, props.inputProps);
14
36
  if (props.name) {
@@ -45,7 +67,7 @@ const TextBox = (props, ref) => {
45
67
  };
46
68
  const id = `${props.name}${type}Input`;
47
69
  return (react_1.default.createElement(react_1.default.Fragment, null,
48
- props.label && (react_1.default.createElement("label", { className: "text-bold", htmlFor: id },
70
+ props.label && (react_1.default.createElement("label", { className: "text-bold d-flex u-marg-bottom--lighter", htmlFor: id },
49
71
  react_1.default.createElement(react_1.default.Fragment, null,
50
72
  props.label,
51
73
  (props === null || props === void 0 ? void 0 : props.required) && react_1.default.createElement("div", { style: { color: 'red' } }, "*")))),
@@ -1 +1 @@
1
- {"version":3,"file":"TextBox.js","sourceRoot":"/","sources":["src/components/generic/TextBox.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,iCAAsE;AACtE,0EAAgE;AAEhE,4DAAoC;AAwBpC,MAAM,OAAO,GAA6D,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACrF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAEhD,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;IAC9C,MAAM,eAAe,mBACjB,IAAI,EACJ,SAAS,EAAE,YAAY,EACvB,WAAW,EAAE,KAAK,CAAC,WAAW,IAC3B,KAAK,CAAC,UAAU,CACtB,CAAC;IAEF,IAAI,KAAK,CAAC,IAAI,EAAE;QACZ,eAAe,CAAC,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;KACrC;IAED,IAAI,KAAK,CAAC,QAAQ,EAAE;QAChB,eAAe,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;KAC7C;IAED,MAAM,QAAQ,GAA+C,CAAC,CAAC,EAAE,EAAE;QAC/D,IAAI,KAAK,CAAC,QAAQ,EAAE;YAChB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;SACrB;IACL,CAAC,CAAC;IAEF,IAAI,KAAK,CAAC,QAAQ,EAAE;QAChB,eAAe,CAAC,QAAQ,GAAG,QAAQ,CAAC;KACvC;IAED,IAAI,IAAI,GAAc,EAAE,CAAC;IAEzB,IAAI,KAAK,CAAC,IAAI,EAAE;QACZ,IAAI,GAAG,8BAAC,cAAI,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,KAAK,GAAG,CAAC;KAChD;IAED,MAAM,OAAO,GAAG,IAAA,oBAAU,EACtB,iBAAiB,EACjB;QACI,YAAY,EAAE,CAAC,CAAC,IAAI;QACpB,YAAY,EAAE,QAAQ;QACtB,QAAQ,EAAE,KAAK,CAAC,IAAI;QACpB,WAAW,EAAE,KAAK,CAAC,gBAAgB,KAAK,SAAS;QACjD,SAAS,EAAE,KAAK,CAAC,gBAAgB,KAAK,OAAO;QAC7C,YAAY,EAAE,eAAe,CAAC,QAAQ;KACzC,EACD,KAAK,CAAC,SAAS,CAClB,CAAC;IACF,MAAM,cAAc,GAAG,GAAG,EAAE;QACxB,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC;IAC7B,CAAC,CAAC;IACF,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,OAAO,WAAW,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM,EAAE,GAAG,GAAG,KAAK,CAAC,IAAI,GAAG,IAAI,OAAO,CAAC;IAEvC,OAAO,CACH;QACK,KAAK,CAAC,KAAK,IAAI,CACZ,yCAAO,SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,EAAE;YACpC;gBACK,KAAK,CAAC,KAAK;gBACX,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,KAAI,uCAAK,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAS,CAC1D,CACC,CACX;QACD,yCAAO,SAAS,EAAE,OAAO;YACpB,IAAI;YACL,yDAAW,eAAe,IAAE,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,IAAI,CAC9I,CACT,CACN,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,eAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { ForwardRefRenderFunction, ReactNode, useState } from 'react';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\n\nimport classNames from 'classnames';\n\nexport interface TextBoxProps {\n icon?: IconType;\n placeholder?: string;\n wide?: boolean;\n type?: 'text' | 'tel' | 'password' | 'email';\n name?: string;\n required?: boolean;\n label?: string;\n\n validationStatus?: 'success' | 'error';\n\n value?: string;\n\n className?: string;\n\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n\n inputProps?: Omit<JSX.IntrinsicElements['input'], 'id' | 'ref' | 'value' | 'onFocus' | 'onBlur' | 'onKeyPress'>;\n\n onKeyPress?: JSX.IntrinsicElements['input']['onKeyPress'];\n}\n\nconst TextBox: ForwardRefRenderFunction<HTMLInputElement, TextBoxProps> = (props, ref) => {\n const [selected, setSelected] = useState(false);\n\n const type = props.type ? props.type : 'text';\n const inputProperties: JSX.IntrinsicElements['input'] = {\n type,\n className: 'text-small',\n placeholder: props.placeholder,\n ...props.inputProps,\n };\n\n if (props.name) {\n inputProperties.name = props.name;\n }\n\n if (props.required) {\n inputProperties.required = props.required;\n }\n\n const onChange: JSX.IntrinsicElements['input']['onChange'] = (e) => {\n if (props.onChange) {\n props.onChange(e);\n }\n };\n\n if (props.onChange) {\n inputProperties.onChange = onChange;\n }\n\n let icon: ReactNode = '';\n\n if (props.icon) {\n icon = <Icon icon={props.icon} size=\"1em\" />;\n }\n\n const classes = classNames(\n 'textbox c-input',\n {\n '--has-icon': !!icon,\n '--selected': selected,\n '--wide': props.wide,\n '--success': props.validationStatus === 'success',\n '--error': props.validationStatus === 'error',\n '--disabled': inputProperties.disabled,\n },\n props.className\n );\n const onFocusHandler = () => {\n return setSelected(true);\n };\n const onBlurHandler = () => {\n return setSelected(false);\n };\n\n const id = `${props.name}${type}Input`;\n\n return (\n <>\n {props.label && (\n <label className=\"text-bold\" htmlFor={id}>\n <>\n {props.label}\n {props?.required && <div style={{ color: 'red' }}>*</div>}\n </>\n </label>\n )}\n <label className={classes}>\n {icon}\n <input {...inputProperties} id={id} ref={ref} value={props.value} onFocus={onFocusHandler} onBlur={onBlurHandler} onKeyPress={props.onKeyPress} />\n </label>\n </>\n );\n};\n\nexport default React.forwardRef(TextBox);\n"]}
1
+ {"version":3,"file":"TextBox.js","sourceRoot":"/","sources":["src/components/generic/TextBox.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA6E;AAC7E,0EAAgE;AAEhE,4DAAoC;AAwBpC,MAAM,OAAO,GAA6D,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACrF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAEhD,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;IAC9C,MAAM,eAAe,mBACjB,IAAI,EACJ,SAAS,EAAE,YAAY,EACvB,WAAW,EAAE,KAAK,CAAC,WAAW,IAC3B,KAAK,CAAC,UAAU,CACtB,CAAC;IAEF,IAAI,KAAK,CAAC,IAAI,EAAE;QACZ,eAAe,CAAC,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;KACrC;IAED,IAAI,KAAK,CAAC,QAAQ,EAAE;QAChB,eAAe,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;KAC7C;IAED,MAAM,QAAQ,GAA+C,CAAC,CAAC,EAAE,EAAE;QAC/D,IAAI,KAAK,CAAC,QAAQ,EAAE;YAChB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;SACrB;IACL,CAAC,CAAC;IAEF,IAAI,KAAK,CAAC,QAAQ,EAAE;QAChB,eAAe,CAAC,QAAQ,GAAG,QAAQ,CAAC;KACvC;IAED,IAAI,IAAI,GAAc,EAAE,CAAC;IAEzB,IAAI,KAAK,CAAC,IAAI,EAAE;QACZ,IAAI,GAAG,8BAAC,cAAI,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,KAAK,GAAG,CAAC;KAChD;IAED,MAAM,OAAO,GAAG,IAAA,oBAAU,EACtB,iBAAiB,EACjB;QACI,YAAY,EAAE,CAAC,CAAC,IAAI;QACpB,YAAY,EAAE,QAAQ;QACtB,QAAQ,EAAE,KAAK,CAAC,IAAI;QACpB,WAAW,EAAE,KAAK,CAAC,gBAAgB,KAAK,SAAS;QACjD,SAAS,EAAE,KAAK,CAAC,gBAAgB,KAAK,OAAO;QAC7C,YAAY,EAAE,eAAe,CAAC,QAAQ;KACzC,EACD,KAAK,CAAC,SAAS,CAClB,CAAC;IACF,MAAM,cAAc,GAAG,GAAG,EAAE;QACxB,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC;IAC7B,CAAC,CAAC;IACF,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,OAAO,WAAW,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM,EAAE,GAAG,GAAG,KAAK,CAAC,IAAI,GAAG,IAAI,OAAO,CAAC;IAEvC,OAAO,CACH;QACK,KAAK,CAAC,KAAK,IAAI,CACZ,yCAAO,SAAS,EAAC,yCAAyC,EAAC,OAAO,EAAE,EAAE;YAClE;gBACK,KAAK,CAAC,KAAK;gBACX,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,KAAI,uCAAK,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAS,CAC1D,CACC,CACX;QACD,yCAAO,SAAS,EAAE,OAAO;YACpB,IAAI;YACL,yDAAW,eAAe,IAAE,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,IAAI,CAC9I,CACT,CACN,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,eAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC","sourcesContent":["import React, { ForwardRefRenderFunction, ReactNode, useState } from 'react';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\n\nimport classNames from 'classnames';\n\nexport interface TextBoxProps {\n icon?: IconType;\n placeholder?: string;\n wide?: boolean;\n type?: 'text' | 'tel' | 'password' | 'email';\n name?: string;\n required?: boolean;\n label?: ReactNode;\n\n validationStatus?: 'success' | 'error';\n\n value?: string;\n\n className?: string;\n\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n\n inputProps?: Omit<JSX.IntrinsicElements['input'], 'id' | 'ref' | 'value' | 'onFocus' | 'onBlur' | 'onKeyPress'>;\n\n onKeyPress?: JSX.IntrinsicElements['input']['onKeyPress'];\n}\n\nconst TextBox: ForwardRefRenderFunction<HTMLInputElement, TextBoxProps> = (props, ref) => {\n const [selected, setSelected] = useState(false);\n\n const type = props.type ? props.type : 'text';\n const inputProperties: JSX.IntrinsicElements['input'] = {\n type,\n className: 'text-small',\n placeholder: props.placeholder,\n ...props.inputProps,\n };\n\n if (props.name) {\n inputProperties.name = props.name;\n }\n\n if (props.required) {\n inputProperties.required = props.required;\n }\n\n const onChange: JSX.IntrinsicElements['input']['onChange'] = (e) => {\n if (props.onChange) {\n props.onChange(e);\n }\n };\n\n if (props.onChange) {\n inputProperties.onChange = onChange;\n }\n\n let icon: ReactNode = '';\n\n if (props.icon) {\n icon = <Icon icon={props.icon} size=\"1em\" />;\n }\n\n const classes = classNames(\n 'textbox c-input',\n {\n '--has-icon': !!icon,\n '--selected': selected,\n '--wide': props.wide,\n '--success': props.validationStatus === 'success',\n '--error': props.validationStatus === 'error',\n '--disabled': inputProperties.disabled,\n },\n props.className\n );\n const onFocusHandler = () => {\n return setSelected(true);\n };\n const onBlurHandler = () => {\n return setSelected(false);\n };\n\n const id = `${props.name}${type}Input`;\n\n return (\n <>\n {props.label && (\n <label className=\"text-bold d-flex u-marg-bottom--lighter\" htmlFor={id}>\n <>\n {props.label}\n {props?.required && <div style={{ color: 'red' }}>*</div>}\n </>\n </label>\n )}\n <label className={classes}>\n {icon}\n <input {...inputProperties} id={id} ref={ref} value={props.value} onFocus={onFocusHandler} onBlur={onBlurHandler} onKeyPress={props.onKeyPress} />\n </label>\n </>\n );\n};\n\nexport default React.forwardRef(TextBox);\n"]}
@@ -46,7 +46,6 @@ const Portal_1 = require("../generic/Portal/Portal");
46
46
  const MemberPortalFeature_1 = __importDefault(require("../../providers/feature/MemberPortalFeature"));
47
47
  const Select_1 = require("../generic/Select/Select");
48
48
  const SmallSpinner_1 = __importDefault(require("../generic/loader/SmallSpinner"));
49
- const ImageProvider_1 = __importStar(require("../../providers/ImageProvider"));
50
49
  const UnauthenticatedUserModal = react_1.default.lazy(() => Promise.resolve().then(() => __importStar(require('../generic/modal/SigninModal/UnauthenticatedUserModal'))).then(({ UnauthenticatedUserModal }) => ({
51
50
  default: UnauthenticatedUserModal,
52
51
  })));
@@ -128,9 +127,9 @@ function Header() {
128
127
  cancelled = true;
129
128
  };
130
129
  }, [hotel, hotel === null || hotel === void 0 ? void 0 : hotel.logo, ccx.logo, currentStep]);
131
- let hotelImageElement = hotelLogo ? react_1.default.createElement("img", { src: ImageProvider_1.default.resizeImage(hotelLogo, ImageProvider_1.ImageSize.Original), alt: "Hotel Logo", className: "u-block" }) : hotel === null || hotel === void 0 ? void 0 : hotel.logo;
130
+ let hotelImageElement = hotelLogo ? react_1.default.createElement("img", { src: hotelLogo, alt: "Hotel Logo", className: "u-block" }) : hotel === null || hotel === void 0 ? void 0 : hotel.logo;
132
131
  if (typeof hotelImageElement === 'string' && !hotelImageElement.startsWith('<')) {
133
- hotelImageElement = react_1.default.createElement("img", { src: ImageProvider_1.default.resizeImage(hotelImageElement, ImageProvider_1.ImageSize.Original), alt: "Hotel Logo" });
132
+ hotelImageElement = react_1.default.createElement("img", { src: hotelImageElement, alt: "Hotel Logo" });
134
133
  }
135
134
  const links = (react_1.default.createElement("ul", { className: "c-header__list" },
136
135
  react_1.default.createElement("li", null,
@@ -1 +1 @@
1
- {"version":3,"file":"Header.js","sourceRoot":"/","sources":["src/components/navigation/Header.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAyE;AACzE,uEAAgE;AAChE,wCAAqC;AACrC,uDAAiD;AACjD,kEAA0E;AAE1E,iDAA+C;AAC/C,0DAAuD;AACvD,6EAAqD;AACrD,mEAA0E;AAC1E,oFAA4D;AAC5D,6DAA8C;AAC9C,0FAAkE;AAClE,iEAAyC;AACzC,2CAAkD;AAClD,iDAAkG;AAClG,kFAA0D;AAC1D,+DAAoE;AACpE,kGAA0E;AAC1E,+DAAkF;AAClF,4FAAoE;AACpE,2EAAqE;AAErE,MAAM,wBAAwB,GAAG,eAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAC7C,kDAAO,iEAAiE,IAAE,IAAI,CAAC,CAAC,EAAE,wBAAwB,EAAE,EAAE,EAAE,CAAC,CAAC;IAC9G,OAAO,EAAE,wBAAwB;CACpC,CAAC,CAAC,CACN,CAAC;AACF,MAAM,sBAAsB,GAAG,eAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAC3C,kDAAO,+DAA+D,IAAE,IAAI,CAAC,CAAC,EAAE,sBAAsB,EAAE,EAAE,EAAE,CAAC,CAAC;IAC1G,OAAO,EAAE,sBAAsB;CAClC,CAAC,CAAC,CACN,CAAC;AAOF,SAAwB,MAAM;IAC1B,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IACpC,MAAM,GAAG,GAAG,IAAA,kBAAU,EAAC,yBAAc,CAAC,CAAC;IACvC,MAAM,EAAE,WAAW,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAE1D,MAAM,EAAE,cAAc,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAE7D,MAAM,aAAa,GAAG,eAAK,CAAC,MAAM,CAAuB,IAAI,CAAC,CAAC;IAE/D,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,EAAE,CAAC,CAAC;IAC/C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAE3D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5D,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC1E,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5D,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,kBAAkB,GAAG,mCAAgB,CAAC,YAAY,EAAE,CAAC;IAE3D,MAAM,QAAQ,GAAe,MAAM,CAAC,IAAI,CAAC,kBAAkB,CAAe,CAAC;IAE3E,MAAM,uBAAuB,GAAG,CAAC,QAAkB,EAAE,EAAE;QACnD,GAAG,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;QACjC,mCAAgB,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,QAAgB,EAAE,EAAE;QACjD,GAAG,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;QACjC,mBAAS,CAAC,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAClD,CAAC,CAAC;IAEF,MAAM,2BAA2B,GAAG,GAAG,EAAE;QACrC,wBAAwB,CAAC,KAAK,CAAC,CAAC;IACpC,CAAC,CAAC;IACF,MAAM,0BAA0B,GAAG,GAAG,EAAE;QACpC,wBAAwB,CAAC,IAAI,CAAC,CAAC;IACnC,CAAC,CAAC;IACF,MAAM,sBAAsB,GAAG,GAAG,EAAE;QAChC,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC7B,CAAC,CAAC;IACF,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC7B,iBAAiB,CAAC,IAAI,CAAC,CAAC;QACxB,2BAA2B,EAAE,CAAC;IAClC,CAAC,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,OAAuB,CAAC;QAE5B,IAAI,qBAAqB,EAAE;YACvB,iBAAiB,CAAC,IAAI,CAAC,CAAC;SAC3B;aAAM;YACH,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBACtB,iBAAiB,CAAC,KAAK,CAAC,CAAC;YAC7B,CAAC,EAAE,GAAG,CAAC,CAAC;SACX;QAED,OAAO,GAAG,EAAE;YACR,YAAY,CAAC,OAAO,CAAC,CAAC;QAC1B,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAC;IAE5B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,SAAS,GAAG,KAAK,CAAC;QAEtB,MAAM,SAAS,GAAG,CAAC,GAAW,EAAE,EAAE;YAC9B,MAAM,KAAK,GAAG,IAAI,KAAK,EAAE,CAAC;YAC1B,KAAK,CAAC,MAAM,GAAG,GAAG,EAAE;gBAChB,IAAI,CAAC,SAAS,EAAE;oBACZ,YAAY,CAAC,GAAG,CAAC,CAAC;iBACrB;YACL,CAAC,CAAC;YAEF,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;QACpB,CAAC,CAAC;QAEF,0BAA0B;QAC1B,IAAI,KAAK,IAAI,CAAC,CAAC,WAAW,KAAK,mBAAS,CAAC,EAAE;YACvC,IAAI,OAAO,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,CAAA,KAAK,QAAQ,EAAE;gBACjC,SAAS,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,CAAC,CAAC;aAC1B;SACJ;aAAM;YACH,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;SACvB;QAED,gEAAgE;QAChE,iBAAiB,CAAC,WAAW,KAAK,mBAAS,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC;QAExD,OAAO,GAAG,EAAE;YACR,SAAS,GAAG,IAAI,CAAC;QACrB,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,EAAE,GAAG,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC;IAEhD,IAAI,iBAAiB,GAAG,SAAS,CAAC,CAAC,CAAC,uCAAK,GAAG,EAAE,uBAAa,CAAC,WAAW,CAAC,SAAS,EAAE,yBAAS,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAC,YAAY,EAAC,SAAS,EAAC,SAAS,GAAG,CAAC,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,CAAC;IAE9J,IAAI,OAAO,iBAAiB,KAAK,QAAQ,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE;QAC7E,iBAAiB,GAAG,uCAAK,GAAG,EAAE,uBAAa,CAAC,WAAW,CAAC,iBAAiB,EAAE,yBAAS,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAC,YAAY,GAAG,CAAC;KACvH;IAED,MAAM,KAAK,GAAG,CACV,sCAAI,SAAS,EAAC,gBAAgB;QAC1B;YACI,8BAAC,0BAAO,IAAC,EAAE,EAAC,cAAc,EAAC,eAAe,EAAC,WAAW,EAAC,OAAO,EAAE,2BAA2B;gBACvF,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,KAAK;oBAC1C,8CAAS,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,SAAS,CAAC,CAAU,CACnD,CACD,CACT;QACL,0CACK,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,8BAA8B,EAAC,CAAC,CAAC,CACrC,qCAAG,IAAI,EAAE,sCAAsC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,OAAO,EAAE,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY;YAC7F,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,KAAK,EAAE,IAAI,UAC/C,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,eAAe,CAAC,CACvC,CACP,CACP,CAAC,CAAC,CAAC,CACA,8BAAC,0BAAO,IAAC,EAAE,EAAC,mBAAmB,EAAC,eAAe,EAAC,WAAW,EAAC,OAAO,EAAE,2BAA2B;YAC5F,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,KAAK,EAAE,IAAI,UAC/C,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,eAAe,CAAC,CACvC,CACD,CACb,CACA;QACL,sCAAI,SAAS,EAAC,OAAO;YACjB,qCAAG,IAAI,EAAE,OAAO,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,EAAE,EAAE,OAAO,EAAE,2BAA2B;gBAChE,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,UAAU,EAAE,CAAC,oBAAa,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,aAAK,CAAC,KAAK;oBACjF,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,aAAK,CAAC,KAAK,GAAI;oBAC9D,0CAAQ,SAAS,EAAC,oBAAoB,IAAE,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAU,CAC3D,CACP,CACH,CACJ,CACR,CAAC;IAEF,MAAM,OAAO,GAAG,CACZ;QACI,sCAAI,SAAS,EAAC,gBAAgB;YACzB,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,CACpB;gBACI,8BAAC,eAAM,IACH,cAAc,QACd,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAc,EAAE,EAAE;wBACrC,OAAO;4BACH,KAAK,EAAE,IAAI;4BACX,IAAI,EAAE,mCAAgB,CAAC,qBAAqB,CAAC,IAAI,CAAC;yBACrD,CAAC;oBACN,CAAC,CAAC,EACF,KAAK,EAAE,GAAG,CAAC,eAAe,EAC1B,QAAQ,EAAE,uBAAuB,EACjC,OAAO,EAAC,OAAO,EACf,SAAS,EAAC,MAAM,GAClB,CACD,CACR;YACD;gBACI,8BAAC,eAAM,IACH,cAAc,QACd,OAAO,EAAE,0BAAgB,CAAC,gBAAgB,EAAE,EAC5C,KAAK,EAAE,GAAG,CAAC,eAAe,EAC1B,QAAQ,EAAE,uBAAuB,EACjC,OAAO,EAAC,OAAO,EACf,SAAS,EAAC,MAAM,GAClB,CACD;YAEJ,6BAAmB,CAAC,QAAQ,EAAE,IAAI,CAC/B,sCAAI,GAAG,EAAE,aAAa,IACjB,cAAc,CAAC,CAAC,CAAC,CACd,8BAAC,kBAAQ,IAAC,IAAI,EAAC,OAAO,EAAC,MAAM,QAAC,OAAO,EAAE,mBAAmB,EAAE,iBAAiB;gBACxE,cAAc,CAAC,QAAQ;;gBAAG,cAAc,CAAC,OAAO;gBACjD,wCAAM,SAAS,EAAC,2BAA2B,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,EAAE;oBACnE,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,UAAU,EAAE,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,aAAK,CAAC,QAAQ,GAAI,CACpE,CACA,CACd,CAAC,CAAC,CAAC,CACA,8BAAC,kBAAQ,IAAC,IAAI,EAAC,OAAO,EAAC,MAAM,QAAC,OAAO,EAAE,mBAAmB,EAAE,iBAAiB;gBACxE,CAAC,CAAC,yBAAW,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC;gBACxC,wCAAM,SAAS,EAAC,2BAA2B,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,EAAE;oBACnE,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,UAAU,EAAE,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,aAAK,CAAC,QAAQ,GAAI,CACpE,CACA,CACd,CACA,CACR,CACA,CACN,CACN,CAAC;IAEF,OAAO,CACH;QACI,uCAAK,SAAS,EAAC,uBAAuB;YAClC,uCAAK,SAAS,EAAC,WAAW;gBACtB,uCAAK,SAAS,EAAC,QAAQ;oBACnB,uCAAK,SAAS,EAAC,uCAAuC;wBAClD,uCAAK,SAAS,EAAC,gBAAgB;4BAC3B,qCAAG,IAAI,EAAE,cAAc,CAAC,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,QAAQ,EAAE,OAAO,EAAE,2BAA2B,IAC1F,iBAAiB,CAClB,CACF;wBACL,CAAC,CAAC,cAAc,IAAI,KAAK,CACxB;oBACN,uCAAK,SAAS,EAAC,eAAe;wBACzB,OAAO;wBACR,uCAAK,SAAS,EAAC,uBAAuB;4BAClC,wCAAM,SAAS,EAAC,oBAAoB;gCAChC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,IAAI,EAAE,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,aAAK,CAAC,KAAK,EAAE,OAAO,EAAE,0BAA0B,GAAI,CAC/F,CACL,CACJ,CACJ,CACJ,CACJ;QACL,cAAc,IAAI,CACf,8BAAC,uBAAc,IAAC,MAAM,EAAE,6BAAmB,CAAC,eAAe;YACvD,8BAAC,cAAa,IAAC,IAAI,EAAE,qBAAqB;gBACtC,uCAAK,SAAS,EAAE,sBAAsB,qBAAqB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE;oBAC5E,uCAAK,SAAS,EAAC,oCAAoC;wBAC/C,uCAAK,SAAS,EAAC,gBAAgB;4BAC3B,8BAAC,uBAAI,IAAC,EAAE,EAAC,GAAG,EAAC,OAAO,EAAE,2BAA2B,IAC5C,iBAAiB,CACf,CACL;wBACN,uCAAK,SAAS,EAAC,uBAAuB;4BAClC,wCAAM,SAAS,EAAC,oBAAoB;gCAChC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,aAAK,CAAC,KAAK,EAAE,OAAO,EAAE,2BAA2B,GAAI,CACjG,CACL,CACJ;oBACN,uCAAK,SAAS,EAAC,6BAA6B;wBACvC,CAAC,CAAC,KAAK,IAAI,KAAK;wBAEhB,OAAO,CACN,CACJ,CACM,CACH,CACpB;QACA,6BAAmB,CAAC,QAAQ,EAAE,IAAI,CAC/B,8BAAC,gBAAQ,IAAC,QAAQ,EAAE,sBAAY,IAC3B,cAAc,CAAC,CAAC,CAAC,CACd,8BAAC,sBAAsB,IAAC,IAAI,EAAE,cAAc,EAAE,OAAO,EAAE,sBAAsB,EAAE,QAAQ,EAAE,aAAa,CAAC,OAAO,GAAI,CACrH,CAAC,CAAC,CAAC,CACA,8BAAC,wBAAwB,IAAC,IAAI,EAAE,cAAc,EAAE,OAAO,EAAE,sBAAsB,EAAE,QAAQ,EAAE,aAAa,CAAC,OAAO,GAAI,CACvH,CACM,CACd,CACF,CACN,CAAC;AACN,CAAC;AAxPD,yBAwPC","sourcesContent":["import React, { Suspense, 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 MemberPortalFeature from '@/providers/feature/MemberPortalFeature';\nimport { IDefaultSelectOption, Select } from '@/components/generic/Select/Select';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\n\nconst UnauthenticatedUserModal = React.lazy(() =>\n import('@/components/generic/modal/SigninModal/UnauthenticatedUserModal').then(({ UnauthenticatedUserModal }) => ({\n default: UnauthenticatedUserModal,\n }))\n);\nconst AuthenticatedUserModal = React.lazy(() =>\n import('@/components/generic/modal/SigninModal/AuthenticatedUserModal').then(({ AuthenticatedUserModal }) => ({\n default: AuthenticatedUserModal,\n }))\n);\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<HTMLLIElement | null>(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: Language[] = Object.keys(availableLanguages) as Language[];\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;\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={ImageProvider.resizeImage(hotelLogo, ImageSize.Original)} alt=\"Hotel Logo\" className=\"u-block\" /> : hotel?.logo;\n\n if (typeof hotelImageElement === 'string' && !hotelImageElement.startsWith('<')) {\n hotelImageElement = <img src={ImageProvider.resizeImage(hotelImageElement, ImageSize.Original)} 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>\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>\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 <Suspense fallback={SmallSpinner}>\n {roomstayMember ? (\n <AuthenticatedUserModal open={loginModalOpen} onClose={closeLoginClickHandler} anchorEl={loginAnchorEl.current} />\n ) : (\n <UnauthenticatedUserModal open={loginModalOpen} onClose={closeLoginClickHandler} anchorEl={loginAnchorEl.current} />\n )}\n </Suspense>\n )}\n </>\n );\n}\n"]}
1
+ {"version":3,"file":"Header.js","sourceRoot":"/","sources":["src/components/navigation/Header.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { Suspense, 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 MemberPortalFeature from '@/providers/feature/MemberPortalFeature';\nimport { IDefaultSelectOption, Select } from '@/components/generic/Select/Select';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\n\nconst UnauthenticatedUserModal = React.lazy(() =>\n import('@/components/generic/modal/SigninModal/UnauthenticatedUserModal').then(({ UnauthenticatedUserModal }) => ({\n default: UnauthenticatedUserModal,\n }))\n);\nconst AuthenticatedUserModal = React.lazy(() =>\n import('@/components/generic/modal/SigninModal/AuthenticatedUserModal').then(({ AuthenticatedUserModal }) => ({\n default: AuthenticatedUserModal,\n }))\n);\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<HTMLLIElement | null>(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: Language[] = Object.keys(availableLanguages) as Language[];\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;\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>\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>\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 <Suspense fallback={SmallSpinner}>\n {roomstayMember ? (\n <AuthenticatedUserModal open={loginModalOpen} onClose={closeLoginClickHandler} anchorEl={loginAnchorEl.current} />\n ) : (\n <UnauthenticatedUserModal open={loginModalOpen} onClose={closeLoginClickHandler} anchorEl={loginAnchorEl.current} />\n )}\n </Suspense>\n )}\n </>\n );\n}\n"]}
@@ -10,6 +10,7 @@ export * from './engines/CustomEngine/CustomEngine';
10
10
  export { default as Icon } from './components/generic/Icon/Icon';
11
11
  export * from './components/generic/Icon/Icon';
12
12
  export * from './components/generic/Text';
13
+ export { default as InputSelect } from './components/generic/Select/InputSelect';
13
14
  export { default as TextBox } from './components/generic/TextBox';
14
15
  export { default as TextArea } from './components/generic/TextArea';
15
16
  export { default as InputGroup } from './components/generic/InputGroup/InputGroup';
package/dist/src/index.js CHANGED
@@ -17,7 +17,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
17
17
  return (mod && mod.__esModule) ? mod : { "default": mod };
18
18
  };
19
19
  Object.defineProperty(exports, "__esModule", { value: true });
20
- exports.Version = exports.events = exports.RoomstayEventManager = exports.StepThanks = exports.StepRoom = exports.StepHotel = exports.StepConfirmation = exports.StepDate = exports.StepAddon = exports.StepManager = exports.API = exports.DataLayer = exports.withDI = exports.registerReplacement = exports.RoomstayThemeEngine = exports.SessionProvider = exports.FullPageEngineSmallSpacingFeature = exports.E164PhoneNumberFieldFeature = exports.ShowIATANumberOnCheckoutFeature = exports.RoomUpsellFeature = exports.InlineAddonStepFeature = exports.FeaturedPromoFeature = exports.DatePickerTypeFeature = exports.ConfirmationVerifyFeature = exports.RatePillProvider = exports.FeatureProvider = exports.CurrencyProvider = exports.SmallSpinner = exports.StepNoRoomBestRateAlert = exports.StepConfirmationCountrySelector = exports.NoRoomsFoundBlock = exports.BE_NO_ROOMS_FOUND_BLOCK = exports.BEButton = exports.Alert = exports.Headline = exports.AutoAutoHeight = exports.LineBreak = exports.Checkbox = exports.RadioFields = exports.InputGroup = exports.TextArea = exports.TextBox = exports.Icon = exports.Link = exports.useTranslation = exports.react = void 0;
20
+ exports.Version = exports.events = exports.RoomstayEventManager = exports.StepThanks = exports.StepRoom = exports.StepHotel = exports.StepConfirmation = exports.StepDate = exports.StepAddon = exports.StepManager = exports.API = exports.DataLayer = exports.withDI = exports.registerReplacement = exports.RoomstayThemeEngine = exports.SessionProvider = exports.FullPageEngineSmallSpacingFeature = exports.E164PhoneNumberFieldFeature = exports.ShowIATANumberOnCheckoutFeature = exports.RoomUpsellFeature = exports.InlineAddonStepFeature = exports.FeaturedPromoFeature = exports.DatePickerTypeFeature = exports.ConfirmationVerifyFeature = exports.RatePillProvider = exports.FeatureProvider = exports.CurrencyProvider = exports.SmallSpinner = exports.StepNoRoomBestRateAlert = exports.StepConfirmationCountrySelector = exports.NoRoomsFoundBlock = exports.BE_NO_ROOMS_FOUND_BLOCK = exports.BEButton = exports.Alert = exports.Headline = exports.AutoAutoHeight = exports.LineBreak = exports.Checkbox = exports.RadioFields = exports.InputGroup = exports.TextArea = exports.TextBox = exports.InputSelect = exports.Icon = exports.Link = exports.useTranslation = exports.react = void 0;
21
21
  const StepConfirmation_1 = __importDefault(require("./pages/steps/StepConfirmation/StepConfirmation"));
22
22
  const StepDate_1 = __importDefault(require("./pages/steps/StepDate/StepDate"));
23
23
  const StepRoom_1 = __importDefault(require("./pages/steps/StepRoom/StepRoom"));
@@ -41,6 +41,8 @@ var Icon_1 = require("./components/generic/Icon/Icon");
41
41
  Object.defineProperty(exports, "Icon", { enumerable: true, get: function () { return __importDefault(Icon_1).default; } });
42
42
  __exportStar(require("./components/generic/Icon/Icon"), exports);
43
43
  __exportStar(require("./components/generic/Text"), exports);
44
+ var InputSelect_1 = require("./components/generic/Select/InputSelect");
45
+ Object.defineProperty(exports, "InputSelect", { enumerable: true, get: function () { return __importDefault(InputSelect_1).default; } });
44
46
  var TextBox_1 = require("./components/generic/TextBox");
45
47
  Object.defineProperty(exports, "TextBox", { enumerable: true, get: function () { return __importDefault(TextBox_1).default; } });
46
48
  var TextArea_1 = require("./components/generic/TextArea");