@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.
- package/dist/main.bundle.js +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizard.js +5 -1
- package/dist/src/components/generic/BookingWizard/BookingWizard.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardContent.js +22 -19
- package/dist/src/components/generic/BookingWizard/BookingWizardContent.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardContext.d.ts +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardContext.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardDateSelector/BookingWizardDateSelector.js +13 -9
- package/dist/src/components/generic/BookingWizard/BookingWizardDateSelector/BookingWizardDateSelector.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector.js +6 -3
- package/dist/src/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.js +16 -15
- package/dist/src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.js.map +1 -1
- package/dist/src/components/generic/DateRangePicker/FloatingDateRangePicker.js +1 -1
- package/dist/src/components/generic/DateRangePicker/FloatingDateRangePicker.js.map +1 -1
- package/dist/src/components/generic/Select/InputSelect.d.ts +8 -0
- package/dist/src/components/generic/Select/InputSelect.js +56 -0
- package/dist/src/components/generic/Select/InputSelect.js.map +1 -0
- package/dist/src/components/generic/Select/Select.d.ts +4 -4
- package/dist/src/components/generic/Select/Select.js +2 -2
- package/dist/src/components/generic/Select/Select.js.map +1 -1
- package/dist/src/components/generic/TextArea.d.ts +6 -3
- package/dist/src/components/generic/TextArea.js +29 -6
- package/dist/src/components/generic/TextArea.js.map +1 -1
- package/dist/src/components/generic/TextBox.d.ts +2 -2
- package/dist/src/components/generic/TextBox.js +26 -4
- package/dist/src/components/generic/TextBox.js.map +1 -1
- package/dist/src/components/navigation/Header.js +2 -3
- package/dist/src/components/navigation/Header.js.map +1 -1
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.js +3 -1
- package/dist/src/index.js.map +1 -1
- package/dist/src/pages/steps/StepThanks/StepThanksComponent.js +3 -1
- package/dist/src/pages/steps/StepThanks/StepThanksComponent.js.map +1 -1
- package/dist/src/stories/BookingWizard.stories.d.ts +1 -0
- package/dist/src/stories/BookingWizard.stories.js +12 -19
- package/dist/src/stories/BookingWizard.stories.js.map +1 -1
- package/dist/src/stories/Select.stories.d.ts +1 -17
- package/dist/src/stories/TextArea.stories.d.ts +2 -2
- package/dist/test.bundle.js +1 -1
- package/dist/tests/offline/entry/RSCompany.js +2 -2
- package/dist/tests/offline/entry/RSCompany.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FloatingDateRangePicker.js","sourceRoot":"/","sources":["src/components/generic/DateRangePicker/FloatingDateRangePicker.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,iCAAyC;AAEzC,2GAAwG;AAGxG,kEAA+D;AAC/D,gGAAmD;AACnD,4DAAoC;AAEpC,kEAAqE;AA0BrE,MAAM,uBAAuB,GAAG,eAAK,CAAC,UAAU,CAA8D,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;;IACzH,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,uBAAuB,EAAE,SAAS,EAAE,OAAO,KAAyB,KAAK,EAAzB,eAAe,UAAK,KAAK,EAA1J,mFAAkJ,CAAQ,CAAC;IAEjK,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAqB,IAAI,CAAC,CAAC;IAErE,MAAM,WAAW,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAC;IAExD,eAAK,CAAC,mBAAmB,CACrB,GAAG,EACH,GAAG,EAAE,CAAC,CAAC;QACH,WAAW,EAAE,cAAc;QAC3B,UAAU,EAAE,aAAa;QACzB,MAAM,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC;KACnC,CAAC,EACF,EAAE,CACL,CAAC;IAEF,MAAM,mBAAmB,GAAG,CAAC,OAAoB,EAAE,EAAE;QACjD,IAAI,uBAAuB,IAAI,SAAS,EAAE;YACtC,uBAAuB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;SAC/C;QAED,IAAI,OAAO,EAAE;YACT,SAAS,CAAC,KAAK,CAAC,CAAC;SACpB;IACL,CAAC,CAAC;IAEF,MAAM,yBAAyB,GAAG,CAAC,IAAS,EAAE,EAAE;QAC5C,YAAY,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,GAAG,EAAE;QACxB,SAAS,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,SAAS,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,CAAC;IAEF,MAAM,KAAK,GAAG,CACV,uCAAK,SAAS,EAAC,uCAAuC;QAClD,8BAAC,yBAAe,kBACZ,iBAAiB,EAAE,aAAa,EAChC,eAAe,EAAE,WAAW,EAC5B,kBAAkB,EAAE,yBAAyB,EAC7C,gBAAgB,EAAE,mBAAmB,IACjC,eAAe,EACrB,CACA,CACT,CAAC;IAEF,OAAO,CACH;QACI,uCAAK,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,aAAa,IAC9D,QAAQ,CACP;QACN,8BAAC,iBAAO,kBACJ,MAAM,EAAE,KAAK,CAAC,aAAa,EAC3B,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,cAAc,EACvB,SAAS,EAAE,KAAK,CAAC,SAAS,KAAI,MAAA,MAAA,WAAW,CAAC,OAAO,0CAAE,aAAa,0CAAE,aAAa,CAAA,EAC/E,aAAa,EAAE,KAAK,CAAC,SAAS,IAAI,WAAW,CAAC,OAAO,IACjD,CAAC,OAAO,IAAI,EAAE,CAAC,IACnB,SAAS,EAAE,IAAA,oBAAU,EAAC,qCAAM,CAAC,4BAA4B,CAAC,EAAE;gBACxD,CAAC,qCAAM,CAAC,SAAS,CAAC,CAAC,EAAE,eAAe,CAAC,KAAK;gBAC1C,CAAC,qCAAM,CAAC,YAAY,CAAC,CAAC,EAAE,
|
|
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
|
|
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, }:
|
|
31
|
-
export declare const Select: <TOption extends Option<KeyName>, KeyName extends string>(p:
|
|
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
|
-
|
|
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
|
|
3
|
-
|
|
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 =
|
|
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(
|
|
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,
|
|
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":"
|
|
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?:
|
|
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 =
|
|
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,
|
|
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":"
|
|
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:
|
|
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:
|
|
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":"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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';\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"]}
|
package/dist/src/index.d.ts
CHANGED
|
@@ -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");
|