@roomstay/frontend 2.1.17 → 2.1.19
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/760.bundle.js +1 -1
- package/dist/main.bundle.js +1 -1
- package/dist/src/api/AvailabilityAPI.d.ts +9 -0
- package/dist/src/api/AvailabilityAPI.js +12 -0
- package/dist/src/api/AvailabilityAPI.js.map +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 +55 -15
- package/dist/src/components/generic/BookingWizard/BookingWizardContent.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardContext.d.ts +2 -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 -14
- package/dist/src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.d.ts +8 -0
- package/dist/src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.js +64 -0
- package/dist/src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.js.map +1 -0
- 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/PromoCodeInput.d.ts +1 -0
- package/dist/src/components/generic/PromoCodeInput.js +1 -1
- package/dist/src/components/generic/PromoCodeInput.js.map +1 -1
- package/dist/src/components/generic/Select/Select.d.ts +2 -1
- package/dist/src/components/generic/Select/Select.js +3 -3
- package/dist/src/components/generic/Select/Select.js.map +1 -1
- package/dist/src/components/generic/TextBox.d.ts +1 -0
- package/dist/src/components/generic/TextBox.js +1 -1
- 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/components/steps/confirmation/StepConfirmationAcknowledgement.d.ts +6 -3
- package/dist/src/components/steps/confirmation/StepConfirmationAcknowledgement.js +9 -19
- package/dist/src/components/steps/confirmation/StepConfirmationAcknowledgement.js.map +1 -1
- package/dist/src/components/steps/confirmation/StepConfirmationForm.js +28 -15
- package/dist/src/components/steps/confirmation/StepConfirmationForm.js.map +1 -1
- package/dist/src/contexts/ConfirmationStepContext/ConfirmationStepContextTypes.d.ts +1 -1
- package/dist/src/contexts/ConfirmationStepContext/ConfirmationStepContextTypes.js.map +1 -1
- package/dist/src/contexts/ConfirmationStepContext/ConfirmationStepContextWrapper.js +8 -9
- package/dist/src/contexts/ConfirmationStepContext/ConfirmationStepContextWrapper.js.map +1 -1
- package/dist/src/contexts/index.d.ts +22 -22
- package/dist/src/contexts/index.js +22 -22
- package/dist/src/contexts/index.js.map +1 -1
- package/dist/src/models/Confirmation.d.ts +0 -2
- package/dist/src/models/Confirmation.js.map +1 -1
- package/dist/src/pages/steps/StepConfirmation/StepConfirmationComponent.js +2 -1
- package/dist/src/pages/steps/StepConfirmation/StepConfirmationComponent.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 -0
- 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
|
@@ -40,7 +40,7 @@ const BookingWizardGuestSelector_module_scss_1 = __importDefault(require("./Book
|
|
|
40
40
|
const BookingWizardBottomSheet_1 = __importDefault(require("../BookingWizardBottomSheet/BookingWizardBottomSheet"));
|
|
41
41
|
const StringHelper_1 = __importDefault(require("../../../../util/StringHelper"));
|
|
42
42
|
const BookingWizardGuestSelector = ({ onChange }) => {
|
|
43
|
-
const { overlay, type: overlayType,
|
|
43
|
+
const { overlay, type: overlayType, layout } = (0, BookingWizardContext_1.useBookingWizard)();
|
|
44
44
|
const ref = (0, react_1.useRef)(null);
|
|
45
45
|
const targetRef = (0, react_1.useRef)(null);
|
|
46
46
|
const [adults, setAdults] = (0, react_1.useState)(1);
|
|
@@ -64,6 +64,9 @@ const BookingWizardGuestSelector = ({ onChange }) => {
|
|
|
64
64
|
onChange === null || onChange === void 0 ? void 0 : onChange({ adults: editingAdults, children: editingChildren, room: editingRoom });
|
|
65
65
|
};
|
|
66
66
|
const getValueAsText = () => {
|
|
67
|
+
if (layout === 'horizontal-condensed') {
|
|
68
|
+
return adults + children;
|
|
69
|
+
}
|
|
67
70
|
const parts = [StringHelper_1.default.pluralWithCount(adults, 'Adult')];
|
|
68
71
|
if (children > 0) {
|
|
69
72
|
parts.push(StringHelper_1.default.pluralWithCount(children, 'Child'));
|
|
@@ -103,8 +106,8 @@ const BookingWizardGuestSelector = ({ onChange }) => {
|
|
|
103
106
|
};
|
|
104
107
|
return (react_1.default.createElement("div", { ref: targetRef, className: (0, classnames_1.default)(BookingWizardGuestSelector_module_scss_1.default.container, { [BookingWizardGuestSelector_module_scss_1.default['--inline']]: overlayType === 'inline', [BookingWizardGuestSelector_module_scss_1.default['--open']]: open }) },
|
|
105
108
|
react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizardGuestSelector_module_scss_1.default['container--search']), onClick: () => setOpen === null || setOpen === void 0 ? void 0 : setOpen(!open) },
|
|
106
|
-
react_1.default.createElement(Text_1.default, { className: BookingWizardGuestSelector_module_scss_1.default['text-display'], bold: true }, getValueAsText()),
|
|
107
|
-
react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown })),
|
|
109
|
+
react_1.default.createElement(Text_1.default, { className: (0, classnames_1.default)(BookingWizardGuestSelector_module_scss_1.default['text-display'], { [BookingWizardGuestSelector_module_scss_1.default['--line-1']]: layout === 'horizontal-condensed' }), bold: true }, getValueAsText()),
|
|
110
|
+
layout === 'horizontal-condensed' ? null : react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown })),
|
|
108
111
|
content()));
|
|
109
112
|
};
|
|
110
113
|
exports.BookingWizardGuestSelector = BookingWizardGuestSelector;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BookingWizardGuestSelector.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames';\nimport React, { FC, useEffect, useRef, useState } from 'react';\n\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport BEButton from '@/components/generic/BEButton';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport NumberIncrement from '@/components/generic/NumberIncrement';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { useBookingWizard } from '../BookingWizardContext';\nimport styles from './BookingWizardGuestSelector.module.scss';\nimport BookingWizardBottomSheet from '../BookingWizardBottomSheet/BookingWizardBottomSheet';\nimport StringHelper from '@/util/StringHelper';\n\nexport interface BookingWizardGuestSelectorProps {\n onChange?: ({ adults, children, room }: { adults: number; children: number; room: number }) => void;\n}\n\nexport const BookingWizardGuestSelector: FC<BookingWizardGuestSelectorProps> = ({ onChange }) => {\n const { overlay, type: overlayType, theme } = useBookingWizard();\n\n const ref = useRef(null);\n const targetRef = useRef(null);\n\n const [adults, setAdults] = useState(1);\n const [children, setChildren] = useState(0);\n const [room, setRoom] = useState(1);\n const [editingAdults, setEditingAdults] = useState(adults);\n const [editingChildren, setEditingChildren] = useState(children);\n const [editingRoom, setEditingRoom] = useState(room);\n\n const [open, setOpen] = useState(false);\n\n useEffect(() => {\n setEditingAdults(adults);\n }, [adults]);\n\n useEffect(() => {\n setEditingChildren(children);\n }, [children]);\n\n const onApply = () => {\n setAdults(editingAdults);\n setChildren(editingChildren);\n setRoom(editingRoom);\n setOpen(false);\n onChange?.({ adults: editingAdults, children: editingChildren, room: editingRoom });\n };\n\n const getValueAsText = () => {\n const parts = [StringHelper.pluralWithCount(adults, 'Adult')];\n\n if (children > 0) {\n parts.push(StringHelper.pluralWithCount(children, 'Child'));\n }\n\n return parts.join(' - ');\n };\n\n const inner = (applyButton = true) => {\n return (\n <div className={styles['popper--box']}>\n <div className={styles['popper--content']} ref={ref}>\n <div className={styles.row}>\n <Text type={TextType.Small}>{StringHelper.plural(editingAdults, 'Adult')}</Text>\n <NumberIncrement number={editingAdults} min={1} max={10} onChange={applyButton ? setEditingAdults : setAdults} textSize={TextType.Small} />\n </div>\n <div className={styles.row}>\n <Text type={TextType.Small}>{StringHelper.plural(editingChildren, 'Child')}</Text>\n <NumberIncrement number={editingChildren} min={0} max={10} onChange={applyButton ? setEditingChildren : setChildren} textSize={TextType.Small} />\n </div>\n <div className={styles.row}>\n <Text type={TextType.Small}>{StringHelper.plural(editingRoom, 'Room')}</Text>\n <NumberIncrement number={editingRoom} min={1} max={10} onChange={applyButton ? setEditingRoom : setRoom} textSize={TextType.Small} />\n </div>\n {applyButton ? (\n <div className={styles['popper--action']}>\n <BEButton wide={overlayType === 'bottom-sheet'} className={styles.applyBtn} onClick={onApply}>\n Apply\n </BEButton>\n </div>\n ) : null}\n </div>\n </div>\n );\n };\n\n const content = () => {\n if (overlayType === 'inline') {\n return (\n <div className={styles.popper}>\n <AutoAutoHeight open={open}>{inner(false)}</AutoAutoHeight>\n </div>\n );\n }\n\n if (overlayType === 'bottom-sheet') {\n return (\n <BookingWizardBottomSheet\n className={classNames(styles.container, styles['--bottom-sheet'])}\n open={open}\n onDismiss={() => setOpen(false)}\n header={\n <div className={styles.header}>\n <Text>How many guests?</Text> <Icon icon={IconType.Close} onClick={() => setOpen(false)} />\n </div>\n }\n >\n <div className={styles.popper}>{inner()} </div>\n </BookingWizardBottomSheet>\n );\n }\n\n return (\n <Overlay\n offset={overlay?.offset}\n usePortal={false}\n followElement={targetRef.current}\n placement={overlay?.placement}\n fallbackPlacements={overlay?.fallbackPlacements}\n strategy=\"absolute\"\n open={open}\n onClose={() => setOpen?.(!open)}\n className={styles.popper}\n containerClassName={styles['custom-overlay']}\n >\n {inner()}\n </Overlay>\n );\n };\n\n return (\n <div ref={targetRef} className={classNames(styles.container, { [styles['--inline']]: overlayType === 'inline', [styles['--open']]: open })}>\n <div className={classNames(styles['container--search'])} onClick={() => setOpen?.(!open)}>\n <Text className={styles['text-display']} bold>\n {getValueAsText()}\n </Text>\n\n <Icon icon={IconType.Dropdown} />\n </div>\n\n {content()}\n </div>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"BookingWizardGuestSelector.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames';\nimport React, { FC, useEffect, useRef, useState } from 'react';\n\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport BEButton from '@/components/generic/BEButton';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport NumberIncrement from '@/components/generic/NumberIncrement';\nimport { Overlay } from '@/components/generic/Overlay/Overlay';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { useBookingWizard } from '../BookingWizardContext';\nimport styles from './BookingWizardGuestSelector.module.scss';\nimport BookingWizardBottomSheet from '../BookingWizardBottomSheet/BookingWizardBottomSheet';\nimport StringHelper from '@/util/StringHelper';\n\nexport interface BookingWizardGuestSelectorProps {\n onChange?: ({ adults, children, room }: { adults: number; children: number; room: number }) => void;\n}\n\nexport const BookingWizardGuestSelector: FC<BookingWizardGuestSelectorProps> = ({ onChange }) => {\n const { overlay, type: overlayType, layout } = useBookingWizard();\n\n const ref = useRef(null);\n const targetRef = useRef(null);\n\n const [adults, setAdults] = useState(1);\n const [children, setChildren] = useState(0);\n const [room, setRoom] = useState(1);\n const [editingAdults, setEditingAdults] = useState(adults);\n const [editingChildren, setEditingChildren] = useState(children);\n const [editingRoom, setEditingRoom] = useState(room);\n\n const [open, setOpen] = useState(false);\n\n useEffect(() => {\n setEditingAdults(adults);\n }, [adults]);\n\n useEffect(() => {\n setEditingChildren(children);\n }, [children]);\n\n const onApply = () => {\n setAdults(editingAdults);\n setChildren(editingChildren);\n setRoom(editingRoom);\n setOpen(false);\n onChange?.({ adults: editingAdults, children: editingChildren, room: editingRoom });\n };\n\n const getValueAsText = () => {\n if (layout === 'horizontal-condensed') {\n return adults + children;\n }\n\n const parts = [StringHelper.pluralWithCount(adults, 'Adult')];\n\n if (children > 0) {\n parts.push(StringHelper.pluralWithCount(children, 'Child'));\n }\n\n return parts.join(' - ');\n };\n\n const inner = (applyButton = true) => {\n return (\n <div className={styles['popper--box']}>\n <div className={styles['popper--content']} ref={ref}>\n <div className={styles.row}>\n <Text type={TextType.Small}>{StringHelper.plural(editingAdults, 'Adult')}</Text>\n <NumberIncrement number={editingAdults} min={1} max={10} onChange={applyButton ? setEditingAdults : setAdults} textSize={TextType.Small} />\n </div>\n <div className={styles.row}>\n <Text type={TextType.Small}>{StringHelper.plural(editingChildren, 'Child')}</Text>\n <NumberIncrement number={editingChildren} min={0} max={10} onChange={applyButton ? setEditingChildren : setChildren} textSize={TextType.Small} />\n </div>\n <div className={styles.row}>\n <Text type={TextType.Small}>{StringHelper.plural(editingRoom, 'Room')}</Text>\n <NumberIncrement number={editingRoom} min={1} max={10} onChange={applyButton ? setEditingRoom : setRoom} textSize={TextType.Small} />\n </div>\n {applyButton ? (\n <div className={styles['popper--action']}>\n <BEButton wide={overlayType === 'bottom-sheet'} className={styles.applyBtn} onClick={onApply}>\n Apply\n </BEButton>\n </div>\n ) : null}\n </div>\n </div>\n );\n };\n\n const content = () => {\n if (overlayType === 'inline') {\n return (\n <div className={styles.popper}>\n <AutoAutoHeight open={open}>{inner(false)}</AutoAutoHeight>\n </div>\n );\n }\n\n if (overlayType === 'bottom-sheet') {\n return (\n <BookingWizardBottomSheet\n className={classNames(styles.container, styles['--bottom-sheet'])}\n open={open}\n onDismiss={() => setOpen(false)}\n header={\n <div className={styles.header}>\n <Text>How many guests?</Text> <Icon icon={IconType.Close} onClick={() => setOpen(false)} />\n </div>\n }\n >\n <div className={styles.popper}>{inner()} </div>\n </BookingWizardBottomSheet>\n );\n }\n\n return (\n <Overlay\n offset={overlay?.offset}\n usePortal={false}\n followElement={targetRef.current}\n placement={overlay?.placement}\n fallbackPlacements={overlay?.fallbackPlacements}\n strategy=\"absolute\"\n open={open}\n onClose={() => setOpen?.(!open)}\n className={styles.popper}\n containerClassName={styles['custom-overlay']}\n >\n {inner()}\n </Overlay>\n );\n };\n\n return (\n <div ref={targetRef} className={classNames(styles.container, { [styles['--inline']]: overlayType === 'inline', [styles['--open']]: open })}>\n <div className={classNames(styles['container--search'])} onClick={() => setOpen?.(!open)}>\n <Text className={classNames(styles['text-display'], { [styles['--line-1']]: layout === 'horizontal-condensed' })} bold>\n {getValueAsText()}\n </Text>\n\n {layout === 'horizontal-condensed' ? null : <Icon icon={IconType.Dropdown} />}\n </div>\n\n {content()}\n </div>\n );\n};\n"]}
|
|
@@ -38,7 +38,7 @@ const BookingWizardContext_1 = require("../BookingWizardContext");
|
|
|
38
38
|
const BookingWizardHotelSelector_module_scss_1 = __importDefault(require("./BookingWizardHotelSelector.module.scss"));
|
|
39
39
|
const BookingWizardBottomSheet_1 = __importDefault(require("../BookingWizardBottomSheet/BookingWizardBottomSheet"));
|
|
40
40
|
const BookingWizardHotelSelector = (props) => {
|
|
41
|
-
const { overlay, type } = (0, BookingWizardContext_1.useBookingWizard)();
|
|
41
|
+
const { overlay, type, layout } = (0, BookingWizardContext_1.useBookingWizard)();
|
|
42
42
|
const [open, setOpen] = (0, react_1.useState)(false);
|
|
43
43
|
const [isOnlyProperty, setIsOnlyProperty] = (0, react_1.useState)(false);
|
|
44
44
|
const { selectedProperty, properties } = props;
|
|
@@ -121,25 +121,27 @@ const BookingWizardHotelSelector = (props) => {
|
|
|
121
121
|
}
|
|
122
122
|
if (type === 'bottom-sheet') {
|
|
123
123
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
124
|
-
react_1.default.createElement("div", { onClick: onOpenDrawer },
|
|
125
|
-
react_1.default.createElement(Text_1.default, { className: BookingWizardHotelSelector_module_scss_1.default.optionLabel, bold: true }, selectedProperty === null || selectedProperty === void 0 ? void 0 : selectedProperty.name)),
|
|
124
|
+
react_1.default.createElement("div", { className: (0, classnames_1.default)({ [BookingWizardHotelSelector_module_scss_1.default['--mini']]: layout === 'horizontal-condensed' }), onClick: onOpenDrawer },
|
|
125
|
+
react_1.default.createElement(Text_1.default, { className: (0, classnames_1.default)(BookingWizardHotelSelector_module_scss_1.default.optionLabel, { [BookingWizardHotelSelector_module_scss_1.default.placeholder]: !(selectedProperty === null || selectedProperty === void 0 ? void 0 : selectedProperty.name) }), bold: true }, (selectedProperty === null || selectedProperty === void 0 ? void 0 : selectedProperty.name) || 'Select...')),
|
|
126
126
|
react_1.default.createElement(BookingWizardBottomSheet_1.default, { className: (0, classnames_1.default)(BookingWizardHotelSelector_module_scss_1.default.container, BookingWizardHotelSelector_module_scss_1.default['--bottom-sheet']), open: open, onDismiss: () => setOpen(false), header: react_1.default.createElement("div", { className: BookingWizardHotelSelector_module_scss_1.default.header },
|
|
127
127
|
react_1.default.createElement(Text_1.default, null, "Choose hotel"),
|
|
128
128
|
" ",
|
|
129
129
|
react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Close, onClick: () => setOpen(false) })) },
|
|
130
130
|
react_1.default.createElement("div", { className: BookingWizardHotelSelector_module_scss_1.default.content }, renderOptions()))));
|
|
131
131
|
}
|
|
132
|
-
return (react_1.default.createElement(
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
react_1.default.createElement("div", { className: BookingWizardHotelSelector_module_scss_1.default.
|
|
141
|
-
|
|
142
|
-
|
|
132
|
+
return (react_1.default.createElement("div", { className: (0, classnames_1.default)({ [BookingWizardHotelSelector_module_scss_1.default['--mini']]: layout === 'horizontal-condensed' }) },
|
|
133
|
+
react_1.default.createElement(Select_1.Select, { offset: overlay === null || overlay === void 0 ? void 0 : overlay.offset, options: optionedProperties, value: selectedProperty === null || selectedProperty === void 0 ? void 0 : selectedProperty.id, onChange: (value) => onPropertyClick(getOption(value)), keyName: "id", labelName: "name", hideExpandIcon: layout === 'horizontal-condensed', overlay: {
|
|
134
|
+
containerClassName: BookingWizardHotelSelector_module_scss_1.default['custom-overlay'],
|
|
135
|
+
strategy: 'absolute',
|
|
136
|
+
usePortal: false,
|
|
137
|
+
placement: (overlay === null || overlay === void 0 ? void 0 : overlay.placement) || 'bottom',
|
|
138
|
+
fallbackPlacements: (overlay === null || overlay === void 0 ? void 0 : overlay.fallbackPlacements) || 'bottom',
|
|
139
|
+
hideStyles: true,
|
|
140
|
+
}, renderOption: (property) => (react_1.default.createElement("div", { className: (0, classnames_1.default)(BookingWizardHotelSelector_module_scss_1.default['container--suggest-list-hotel'], { [BookingWizardHotelSelector_module_scss_1.default['--selected']]: (selectedProperty === null || selectedProperty === void 0 ? void 0 : selectedProperty.id) === (property === null || property === void 0 ? void 0 : property.id) }) },
|
|
141
|
+
react_1.default.createElement("div", { className: BookingWizardHotelSelector_module_scss_1.default['container--suggest-list-hotel-name'] }, property === null || property === void 0 ? void 0 : property.name),
|
|
142
|
+
react_1.default.createElement("div", { className: BookingWizardHotelSelector_module_scss_1.default.check }))), renderLabel: (option) => {
|
|
143
|
+
return (react_1.default.createElement(Text_1.default, { className: BookingWizardHotelSelector_module_scss_1.default.optionLabel, bold: true }, (option === null || option === void 0 ? void 0 : option.name) || react_1.default.createElement("span", { className: BookingWizardHotelSelector_module_scss_1.default['hotel-dropdown-label'] }, "Please Select")));
|
|
144
|
+
} })));
|
|
143
145
|
};
|
|
144
146
|
exports.BookingWizardHotelSelector = BookingWizardHotelSelector;
|
|
145
147
|
//# sourceMappingURL=BookingWizardHotelSelector.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BookingWizardHotelSelector.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames';\nimport React, { useMemo, useState } from 'react';\n\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport { Select } from '../../Select/Select';\nimport { useBookingWizard } from '../BookingWizardContext';\nimport styles from './BookingWizardHotelSelector.module.scss';\nimport BookingWizardBottomSheet from '../BookingWizardBottomSheet/BookingWizardBottomSheet';\nimport { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport ColorProfile from '@/models/Client/Hotel/ColorProfile';\n\ninterface BookingWizardHotelSelectorProps {\n disabled?: boolean;\n\n selectedProperty?: BookingWizardProperty;\n properties: TBookingWizardProperties;\n\n onChange?: (hotel: BookingWizardProperty | null) => void;\n}\n\ninterface TOptionedProperties extends BookingWizardProperty {\n options?: BookingWizardProperty[];\n}\n\nexport const BookingWizardHotelSelector = (props: BookingWizardHotelSelectorProps) => {\n const { overlay, type } = useBookingWizard();\n\n const [open, setOpen] = useState(false);\n const [isOnlyProperty, setIsOnlyProperty] = useState(false);\n\n const { selectedProperty, properties } = props;\n\n const optionedProperties = useMemo(() => {\n let isOnly = false;\n\n const options: TOptionedProperties[] = [];\n\n // Here we group each key as a new TOption Group to order hotels better.\n const propertyKeys = Object.keys(properties);\n if (propertyKeys.length > 1) {\n propertyKeys.forEach((propertyKey: string) => {\n const option: TOptionedProperties = {\n name: propertyKey,\n id: '',\n options: [],\n colors: {} as ColorProfile,\n };\n\n for (const property of properties[propertyKey]) {\n option.options?.push(property);\n }\n\n options.push(option);\n });\n } else if (propertyKeys.length === 1) {\n properties[propertyKeys[0]].forEach((option) => {\n options.push(option);\n });\n\n if (properties[propertyKeys[0]].length == 1 && properties[propertyKeys[0]][0].id === selectedProperty?.id) {\n isOnly = true;\n }\n }\n\n setIsOnlyProperty(isOnly);\n\n return options;\n }, [properties]);\n\n const onPropertyClick = (property: BookingWizardProperty): void => {\n props.onChange?.(property);\n setOpen(false);\n };\n\n const getOption = (key: BookingWizardProperty['id']): BookingWizardProperty | undefined => {\n const indexes = Object.keys(properties);\n\n for (const index of indexes) {\n for (const property of properties[index]) {\n if (key === property.id) {\n return property;\n }\n }\n }\n };\n\n const renderOptions = (): any => {\n const indexes = Object.keys(properties);\n\n if (indexes.length > 1) {\n return indexes.map((indexName) => renderGroup(indexName, properties[indexName]));\n } else if (indexes.length === 1) {\n return properties[indexes[0]].map((property) => renderOption(property));\n }\n };\n\n const renderGroup = (name: string, options: BookingWizardProperty[]) => {\n return (\n <>\n <div className={classNames(styles['container--suggest-list-hotel'], styles['--group-title'])}>\n <Text type={TextType.Small} color={Color.DarkGrey}>\n {name}\n </Text>\n </div>\n {options.map((option) => renderOption(option))}\n </>\n );\n };\n\n const renderOption = (property: BookingWizardProperty) => {\n return (\n <div\n key={property.id}\n className={classNames(styles['container--suggest-list-hotel'], { [styles['--selected']]: selectedProperty?.id === property.id })}\n onClick={() => onPropertyClick(property)}\n >\n <div className={styles['container--suggest-list-hotel-name']}>{property.name}</div>\n <div className={styles.check}></div>\n </div>\n );\n };\n\n const onOpenDrawer = () => {\n setOpen(true);\n };\n\n if (isOnlyProperty) {\n return <Text>{selectedProperty?.name}</Text>;\n }\n\n if (type === 'inline') {\n return (\n <div className={styles['inline-container']}>\n <AutoAutoHeight open={open}>\n <div className={styles['inline-box']}>{renderOptions()}</div>\n </AutoAutoHeight>\n </div>\n );\n }\n\n if (type === 'bottom-sheet') {\n return (\n <>\n <div onClick={onOpenDrawer}>\n <Text className={styles.optionLabel} bold>\n {selectedProperty?.name}\n </Text>\n </div>\n <BookingWizardBottomSheet\n className={classNames(styles.container, styles['--bottom-sheet'])}\n open={open}\n onDismiss={() => setOpen(false)}\n header={\n <div className={styles.header}>\n <Text>Choose hotel</Text> <Icon icon={IconType.Close} onClick={() => setOpen(false)} />\n </div>\n }\n >\n <div className={styles.content}>{renderOptions()}</div>\n </BookingWizardBottomSheet>\n </>\n );\n }\n\n return (\n <Select<BookingWizardProperty, 'id'>\n offset={overlay?.offset}\n options={optionedProperties}\n value={selectedProperty?.id}\n onChange={(value) => onPropertyClick(getOption(value) as BookingWizardProperty)}\n keyName=\"id\"\n labelName=\"name\"\n overlay={{\n containerClassName: styles['custom-overlay'],\n strategy: 'absolute',\n usePortal: false,\n placement: overlay?.placement || 'bottom',\n fallbackPlacements: overlay?.fallbackPlacements || 'bottom',\n }}\n renderOption={(property) => (\n <div className={classNames(styles['container--suggest-list-hotel'], { [styles['--selected']]: selectedProperty?.id === property?.id })}>\n <div className={styles['container--suggest-list-hotel-name']}>{property?.name}</div>\n <div className={styles.check}></div>\n </div>\n )}\n renderLabel={(option) => {\n return (\n <Text className={styles.optionLabel} bold>\n {option?.name || <span className={styles['hotel-dropdown-label']}>Please Select</span>}\n </Text>\n );\n }}\n />\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"BookingWizardHotelSelector.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames';\nimport React, { useMemo, useState } from 'react';\n\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport { Select } from '../../Select/Select';\nimport { useBookingWizard } from '../BookingWizardContext';\nimport styles from './BookingWizardHotelSelector.module.scss';\nimport BookingWizardBottomSheet from '../BookingWizardBottomSheet/BookingWizardBottomSheet';\nimport { BookingWizardProperty } from '@/models/BookingWizard/BookingWizardProperty';\nimport { TBookingWizardProperties } from '@/models/BookingWizard/BookingWizardTypes';\nimport ColorProfile from '@/models/Client/Hotel/ColorProfile';\n\ninterface BookingWizardHotelSelectorProps {\n disabled?: boolean;\n\n selectedProperty?: BookingWizardProperty;\n properties: TBookingWizardProperties;\n\n onChange?: (hotel: BookingWizardProperty | null) => void;\n}\n\ninterface TOptionedProperties extends BookingWizardProperty {\n options?: BookingWizardProperty[];\n}\n\nexport const BookingWizardHotelSelector = (props: BookingWizardHotelSelectorProps) => {\n const { overlay, type, layout } = useBookingWizard();\n\n const [open, setOpen] = useState(false);\n const [isOnlyProperty, setIsOnlyProperty] = useState(false);\n\n const { selectedProperty, properties } = props;\n\n const optionedProperties = useMemo(() => {\n let isOnly = false;\n\n const options: TOptionedProperties[] = [];\n\n // Here we group each key as a new TOption Group to order hotels better.\n const propertyKeys = Object.keys(properties);\n if (propertyKeys.length > 1) {\n propertyKeys.forEach((propertyKey: string) => {\n const option: TOptionedProperties = {\n name: propertyKey,\n id: '',\n options: [],\n colors: {} as ColorProfile,\n };\n\n for (const property of properties[propertyKey]) {\n option.options?.push(property);\n }\n\n options.push(option);\n });\n } else if (propertyKeys.length === 1) {\n properties[propertyKeys[0]].forEach((option) => {\n options.push(option);\n });\n\n if (properties[propertyKeys[0]].length == 1 && properties[propertyKeys[0]][0].id === selectedProperty?.id) {\n isOnly = true;\n }\n }\n\n setIsOnlyProperty(isOnly);\n\n return options;\n }, [properties]);\n\n const onPropertyClick = (property: BookingWizardProperty): void => {\n props.onChange?.(property);\n setOpen(false);\n };\n\n const getOption = (key: BookingWizardProperty['id']): BookingWizardProperty | undefined => {\n const indexes = Object.keys(properties);\n\n for (const index of indexes) {\n for (const property of properties[index]) {\n if (key === property.id) {\n return property;\n }\n }\n }\n };\n\n const renderOptions = (): any => {\n const indexes = Object.keys(properties);\n\n if (indexes.length > 1) {\n return indexes.map((indexName) => renderGroup(indexName, properties[indexName]));\n } else if (indexes.length === 1) {\n return properties[indexes[0]].map((property) => renderOption(property));\n }\n };\n\n const renderGroup = (name: string, options: BookingWizardProperty[]) => {\n return (\n <>\n <div className={classNames(styles['container--suggest-list-hotel'], styles['--group-title'])}>\n <Text type={TextType.Small} color={Color.DarkGrey}>\n {name}\n </Text>\n </div>\n {options.map((option) => renderOption(option))}\n </>\n );\n };\n\n const renderOption = (property: BookingWizardProperty) => {\n return (\n <div\n key={property.id}\n className={classNames(styles['container--suggest-list-hotel'], { [styles['--selected']]: selectedProperty?.id === property.id })}\n onClick={() => onPropertyClick(property)}\n >\n <div className={styles['container--suggest-list-hotel-name']}>{property.name}</div>\n <div className={styles.check}></div>\n </div>\n );\n };\n\n const onOpenDrawer = () => {\n setOpen(true);\n };\n\n if (isOnlyProperty) {\n return <Text>{selectedProperty?.name}</Text>;\n }\n\n if (type === 'inline') {\n return (\n <div className={styles['inline-container']}>\n <AutoAutoHeight open={open}>\n <div className={styles['inline-box']}>{renderOptions()}</div>\n </AutoAutoHeight>\n </div>\n );\n }\n\n if (type === 'bottom-sheet') {\n return (\n <>\n <div className={classNames({ [styles['--mini']]: layout === 'horizontal-condensed' })} onClick={onOpenDrawer}>\n <Text className={classNames(styles.optionLabel, { [styles.placeholder]: !selectedProperty?.name })} bold>\n {selectedProperty?.name || 'Select...'}\n </Text>\n </div>\n <BookingWizardBottomSheet\n className={classNames(styles.container, styles['--bottom-sheet'])}\n open={open}\n onDismiss={() => setOpen(false)}\n header={\n <div className={styles.header}>\n <Text>Choose hotel</Text> <Icon icon={IconType.Close} onClick={() => setOpen(false)} />\n </div>\n }\n >\n <div className={styles.content}>{renderOptions()}</div>\n </BookingWizardBottomSheet>\n </>\n );\n }\n\n return (\n <div className={classNames({ [styles['--mini']]: layout === 'horizontal-condensed' })}>\n <Select<BookingWizardProperty, 'id'>\n offset={overlay?.offset}\n options={optionedProperties}\n value={selectedProperty?.id}\n onChange={(value) => onPropertyClick(getOption(value) as BookingWizardProperty)}\n keyName=\"id\"\n labelName=\"name\"\n hideExpandIcon={layout === 'horizontal-condensed'}\n overlay={{\n containerClassName: styles['custom-overlay'],\n strategy: 'absolute',\n usePortal: false,\n placement: overlay?.placement || 'bottom',\n fallbackPlacements: overlay?.fallbackPlacements || 'bottom',\n hideStyles: true,\n }}\n renderOption={(property) => (\n <div className={classNames(styles['container--suggest-list-hotel'], { [styles['--selected']]: selectedProperty?.id === property?.id })}>\n <div className={styles['container--suggest-list-hotel-name']}>{property?.name}</div>\n <div className={styles.check}></div>\n </div>\n )}\n renderLabel={(option) => {\n return (\n <Text className={styles.optionLabel} bold>\n {option?.name || <span className={styles['hotel-dropdown-label']}>Please Select</span>}\n </Text>\n );\n }}\n />\n </div>\n );\n};\n"]}
|
package/dist/src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.js
ADDED
|
@@ -0,0 +1,64 @@
|
|
|
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
|
+
exports.BookingWizardPromoCode = void 0;
|
|
30
|
+
const Translation_1 = require("../../../../translations/Translation");
|
|
31
|
+
const Debounce_1 = require("../../../../util/Debounce");
|
|
32
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
33
|
+
const react_1 = __importStar(require("react"));
|
|
34
|
+
const react_i18next_1 = require("react-i18next");
|
|
35
|
+
const Tooltip_1 = __importDefault(require("../../Tooltip/Tooltip"));
|
|
36
|
+
const BookingWizardPromoCode_module_scss_1 = __importDefault(require("./BookingWizardPromoCode.module.scss"));
|
|
37
|
+
const BookingWizardPromoCode = (props) => {
|
|
38
|
+
const { promoCode, valid, onChange } = props;
|
|
39
|
+
const { t } = (0, react_i18next_1.useTranslation)();
|
|
40
|
+
const [code, setCode] = (0, react_1.useState)('');
|
|
41
|
+
const debounceChange = (0, react_1.useCallback)((0, Debounce_1.debounce)((value) => {
|
|
42
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(value);
|
|
43
|
+
}, 500), []);
|
|
44
|
+
(0, react_1.useEffect)(() => {
|
|
45
|
+
debounceChange(code);
|
|
46
|
+
}, [code]);
|
|
47
|
+
(0, react_1.useEffect)(() => {
|
|
48
|
+
if (promoCode !== code)
|
|
49
|
+
setCode(promoCode);
|
|
50
|
+
}, [promoCode]);
|
|
51
|
+
const getTooltipTitle = () => {
|
|
52
|
+
if (!promoCode)
|
|
53
|
+
return t(Translation_1.Translation.Step.Date.PromoCode);
|
|
54
|
+
if (valid === false)
|
|
55
|
+
return `Promo Code '${code}' is not valid`;
|
|
56
|
+
if (valid === true)
|
|
57
|
+
return `Promo Code '${code}' applied`;
|
|
58
|
+
return t(Translation_1.Translation.Step.Date.PromoCode);
|
|
59
|
+
};
|
|
60
|
+
return (react_1.default.createElement(Tooltip_1.default, { title: getTooltipTitle() },
|
|
61
|
+
react_1.default.createElement("input", { className: (0, classnames_1.default)(BookingWizardPromoCode_module_scss_1.default.container, { [BookingWizardPromoCode_module_scss_1.default['--error']]: valid === false, [BookingWizardPromoCode_module_scss_1.default['--success']]: valid === true }), type: "text", value: code, placeholder: t(Translation_1.Translation.Step.Date.PromoCode), onChange: (e) => setCode(e.target.value) })));
|
|
62
|
+
};
|
|
63
|
+
exports.BookingWizardPromoCode = BookingWizardPromoCode;
|
|
64
|
+
//# sourceMappingURL=BookingWizardPromoCode.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BookingWizardPromoCode.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4DAAyD;AACzD,8CAA2C;AAC3C,4DAAoC;AACpC,+CAAoE;AACpE,iDAA+C;AAC/C,oEAA4C;AAE5C,8GAA0D;AAQnD,MAAM,sBAAsB,GAAoC,CAAC,KAAK,EAAE,EAAE;IAC7E,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC7C,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAqB,EAAE,CAAC,CAAC;IAEzD,MAAM,cAAc,GAAG,IAAA,mBAAW,EAC9B,IAAA,mBAAQ,EAAC,CAAC,KAAK,EAAE,EAAE;QACf,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;IACtB,CAAC,EAAE,GAAG,CAAC,EACP,EAAE,CACL,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,cAAc,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,SAAS,KAAK,IAAI;YAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/C,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,MAAM,eAAe,GAAG,GAAG,EAAE;QACzB,IAAI,CAAC,SAAS;YAAE,OAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC1D,IAAI,KAAK,KAAK,KAAK;YAAE,OAAO,eAAe,IAAI,gBAAgB,CAAC;QAChE,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO,eAAe,IAAI,WAAW,CAAC;QAC1D,OAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,iBAAO,IAAC,KAAK,EAAE,eAAe,EAAE;QAC7B,yCACI,SAAS,EAAE,IAAA,oBAAU,EAAC,4CAAM,CAAC,SAAS,EAAE,EAAE,CAAC,4CAAM,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,KAAK,KAAK,EAAE,CAAC,4CAAM,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI,EAAE,CAAC,EACxH,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,EACX,WAAW,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,EAC/C,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAC1C,CACI,CACb,CAAC;AACN,CAAC,CAAC;AAvCW,QAAA,sBAAsB,0BAuCjC","sourcesContent":["import { Translation } from '@/translations/Translation';\nimport { debounce } from '@/util/Debounce';\nimport classNames from 'classnames';\nimport React, { FC, useCallback, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport Tooltip from '../../Tooltip/Tooltip';\n\nimport styles from './BookingWizardPromoCode.module.scss';\n\ninterface BookingWizardPromoCodeProps {\n promoCode?: string;\n valid?: boolean;\n onChange?: (promoCode: string) => void;\n}\n\nexport const BookingWizardPromoCode: FC<BookingWizardPromoCodeProps> = (props) => {\n const { promoCode, valid, onChange } = props;\n const { t } = useTranslation();\n\n const [code, setCode] = useState<string | undefined>('');\n\n const debounceChange = useCallback(\n debounce((value) => {\n onChange?.(value);\n }, 500),\n []\n );\n\n useEffect(() => {\n debounceChange(code);\n }, [code]);\n\n useEffect(() => {\n if (promoCode !== code) setCode(promoCode);\n }, [promoCode]);\n\n const getTooltipTitle = () => {\n if (!promoCode) return t(Translation.Step.Date.PromoCode);\n if (valid === false) return `Promo Code '${code}' is not valid`;\n if (valid === true) return `Promo Code '${code}' applied`;\n return t(Translation.Step.Date.PromoCode);\n };\n\n return (\n <Tooltip title={getTooltipTitle()}>\n <input\n className={classNames(styles.container, { [styles['--error']]: valid === false, [styles['--success']]: valid === true })}\n type=\"text\"\n value={code}\n placeholder={t(Translation.Step.Date.PromoCode)}\n onChange={(e) => setCode(e.target.value)}\n />\n </Tooltip>\n );\n};\n"]}
|
|
@@ -55,7 +55,7 @@ const FloatingDateRangePicker = react_1.default.forwardRef((props, ref) => {
|
|
|
55
55
|
react_1.default.createElement("div", { ref: thisElement, className: className, onClick: onOverlayOpen }, children),
|
|
56
56
|
react_1.default.createElement(Overlay_1.Overlay, Object.assign({ offset: props.overlayOffset, open: isOpen, onClose: onOverlayClose, container: props.container || ((_b = (_a = thisElement.current) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement), followElement: props.container || thisElement.current }, (overlay || {}), { className: (0, classnames_1.default)(DateRangePicker_module_scss_1.default['floating-roomstay-calendar'], {
|
|
57
57
|
[DateRangePicker_module_scss_1.default['--small']]: DatePickerProps.small,
|
|
58
|
-
[DateRangePicker_module_scss_1.default['--specific']]:
|
|
58
|
+
[DateRangePicker_module_scss_1.default['--specific']]: props.theme === BookingWizard_1.EBookingWizardTheme.Specific,
|
|
59
59
|
[DateRangePicker_module_scss_1.default['--single']]: !DatePickerProps.showMultipleMonths,
|
|
60
60
|
}) }), inner)));
|
|
61
61
|
});
|
|
@@ -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"]}
|
|
@@ -113,7 +113,7 @@ function PromoCodeInput(props) {
|
|
|
113
113
|
const setPromoCodeOnChange = (val) => {
|
|
114
114
|
setPromoCode(val.target.value);
|
|
115
115
|
};
|
|
116
|
-
return (react_1.default.createElement("div", { ref: firstUpdate },
|
|
116
|
+
return (react_1.default.createElement("div", { ref: firstUpdate, className: props.className },
|
|
117
117
|
react_1.default.createElement("div", { className: "u-pos-rel" },
|
|
118
118
|
react_1.default.createElement(TextBox_1.default, { value: (props.direct ? props.value : promoCode).toUpperCase().replace(' ', ''), placeholder: t(Translation_1.Translation.Step.Date.PromoCode), wide: true, validationStatus: promoCodeStatus, onChange: setPromoCodeOnChange, onKeyPress: handleKeyPress }),
|
|
119
119
|
showPromoRemove && (react_1.default.createElement(Tooltip_1.default, { title: "Remove Promo code" },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PromoCodeInput.js","sourceRoot":"/","sources":["src/components/generic/PromoCodeInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,2EAAmD;AACnD,0DAAuD;AACvD,mFAA2D;AAC3D,uEAAgE;AAChE,wCAAqC;AACrC,iDAA+C;AAC/C,iCAAoD;AACpD,4FAAoE;AACpE,kEAA2D;
|
|
1
|
+
{"version":3,"file":"PromoCodeInput.js","sourceRoot":"/","sources":["src/components/generic/PromoCodeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport TextBox from '@/components/generic/TextBox';\nimport { Translation } from 'translations/Translation';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport { useTranslation } from 'react-i18next';\nimport { useState, useRef, useEffect } from 'react';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\nimport Text, { TextType } from '@/components/generic/Text';\n\ninterface PromoCodeInputProps {\n value: string;\n onChange: (code: string) => void;\n\n valid?: boolean;\n direct?: boolean;\n className?: string;\n}\n\nexport default function PromoCodeInput(props: PromoCodeInputProps) {\n const { t } = useTranslation();\n\n const [promoCode, setPromoCode] = useState(props.value ?? '');\n const [showPromoSave, setShowPromoSave] = useState(false);\n const [showPromoRemove, setShowPromoRemove] = useState(false);\n\n const [pressedChange, setPressedChange] = useState(false);\n\n const firstUpdate = useRef<HTMLDivElement | null>(null);\n\n const promoCodeStatus: 'success' | 'error' | undefined = props.valid || props.valid === false ? (props.valid ? 'success' : 'error') : undefined;\n\n useEffect(() => {\n if (props.valid || props.valid === false) {\n setShowPromoRemove(true);\n }\n }, [props.valid]);\n\n useEffect(() => {\n if (showPromoSave || showPromoRemove) {\n setPressedChange(false);\n }\n }, [showPromoSave, showPromoRemove]);\n\n useEffect(() => {\n if (firstUpdate) {\n if (promoCode) {\n if (promoCode !== props.value) {\n if (props.direct) {\n updatePromoCode(promoCode, false);\n } else {\n setShowPromoSave(true);\n }\n } else {\n setShowPromoRemove(true);\n }\n } else {\n setShowPromoSave(false);\n setShowPromoRemove(false);\n\n if (promoCode !== '') {\n updatePromoCode('', false);\n }\n }\n } else {\n if (promoCode) {\n setShowPromoRemove(true);\n }\n }\n }, [promoCode]);\n\n const updatePromoCode = (code: string, propagate = true) => {\n if (code) {\n if (props.direct) {\n setShowPromoRemove(true);\n } else {\n setPressedChange(true);\n setShowPromoSave(false);\n }\n }\n\n if (propagate) {\n setPromoCode(code);\n }\n\n props.onChange(code);\n };\n\n const handleKeyPress = (event: any) => {\n if (event.key === 'Enter') {\n updatePromoCode(promoCode);\n }\n };\n const clearPromoCode = () => {\n return updatePromoCode('');\n };\n const setUpdatedPromoCode = () => {\n return updatePromoCode(promoCode);\n };\n const setPromoCodeOnChange = (val: React.ChangeEvent<HTMLInputElement>) => {\n setPromoCode(val.target.value);\n };\n return (\n <div ref={firstUpdate} className={props.className}>\n <div className=\"u-pos-rel\">\n <TextBox\n value={(props.direct ? props.value : promoCode).toUpperCase().replace(' ', '')}\n placeholder={t(Translation.Step.Date.PromoCode)}\n wide\n validationStatus={promoCodeStatus}\n onChange={setPromoCodeOnChange}\n onKeyPress={handleKeyPress}\n />\n {showPromoRemove && (\n <Tooltip title=\"Remove Promo code\">\n <div className=\"people-picker--promo-icon\" onClick={clearPromoCode}>\n <Icon size=\"24px\" icon={IconType.Close} color={Color.Grey} />\n </div>\n </Tooltip>\n )}\n {showPromoSave && (\n <Tooltip title=\"Apply Code\">\n <div className=\"people-picker--promo-icon --success\" onClick={setUpdatedPromoCode}>\n <Icon size=\"24px\" icon={IconType.ArrowRight2} color={Color.Success} />\n </div>\n </Tooltip>\n )}\n {pressedChange && (\n <Tooltip title=\"Promo code loading\">\n <div className=\"people-picker--promo-icon\">\n <SmallSpinner />\n </div>\n </Tooltip>\n )}\n </div>\n {props.valid === true && (\n <div className=\"u-marg-top\">\n <Text type={TextType.Small} color={Color.Success}>\n Promo Code '{props.value}' applied\n </Text>\n </div>\n )}\n {props.valid === false && (\n <div className=\"u-marg-top\">\n <Text type={TextType.Small} color={Color.Alert}>\n Promo Code '{props.value}' is not valid\n </Text>\n </div>\n )}\n </div>\n );\n}\n"]}
|
|
@@ -26,8 +26,9 @@ 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 InnerSelect: <TOption extends Option<KeyName>, KeyName extends string>({ target, open, onClose, options, value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile, overlay, renderLabel, hideExpandIcon, }: Select<TOption, KeyName>, ref: Ref<HTMLDivElement | null>) => JSX.Element;
|
|
31
32
|
export declare const Select: <TOption extends Option<KeyName>, KeyName extends string>(p: Select<TOption, KeyName> & {
|
|
32
33
|
ref?: React.Ref<HTMLDivElement> | undefined;
|
|
33
34
|
}) => JSX.Element;
|
|
@@ -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,8 +135,8 @@ 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 }))),
|
|
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 },
|
|
138
|
+
hideExpandIcon ? null : react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown, color: Color_1.Color.DarkGrey }))),
|
|
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
|
};
|
|
142
142
|
exports.InnerSelect = InnerSelect;
|
|
@@ -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 >\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA8G;AAC9G,qDAA8C;AAE9C,4DAAoC;AAEpC,gCAA8B;AAC9B,kEAA6E;AAC7E,6EAA6E;AAC7E,wCAAqC;AACrC,uDAAwD;AACxD,mDAAmD;AACnD,kEAA2D;AAgC3D,MAAM,iBAAiB,GAAG,GAAG,CAAC;AAEvB,MAAM,WAAW,GAAG,CACvB,EACI,MAAM,EACN,IAAI,EACJ,OAAO,EACP,OAAO,GAAG,EAAE,EACZ,KAAK,EACL,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,EACT,MAAM,EACN,YAAY,EACZ,cAAc,GAAG,KAAK,EACtB,OAAO,EACP,WAAW,EACX,cAAc,GACS,EAC3B,GAA+B,EACjC,EAAE;;IACA,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,0BAAa,GAAE,CAAC;IAClC,MAAM,SAAS,GAAG,IAAA,cAAM,EAAkB,IAAI,CAAC,CAAC;IAChD,MAAM,UAAU,GAAG,IAAA,cAAM,EAA0C,EAAE,CAAC,CAAC;IACvE,MAAM,kBAAkB,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAC;IAC/D,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,GAAG,IAAA,+BAAgB,EAAU,IAAI,EAAE,KAAK,CAAC,CAAC;IACnE,MAAM,cAAc,GAAG,IAAA,eAAO,EAAY,GAAG,EAAE;QAC3C,OAAO,OAAO,CAAC,MAAM,CAAY,CAAC,MAAM,EAAE,mBAAmB,EAAE,EAAE;YAC7D,IAAI,mBAAmB,CAAC,OAAO;gBAAE,OAAO,MAAM,CAAC,MAAM,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC;YACnF,OAAO,MAAM,CAAC,MAAM,CAAC,mBAA8B,CAAC,CAAC;QACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IACX,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,2BAA2B;IAC3B,cAAc,GAAG,KAAK,CAAC;IAEvB,MAAM,QAAQ,GAAG,CAAC,CAAQ,EAAQ,EAAE;QAChC,UAAU,CAAC,KAAK,CAAC,CAAC;QAClB,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAC;IACvD,IAAA,2BAAmB,EAA+C,GAAG,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;IAEjG,MAAM,WAAW,GAAG,CAAC,KAAuB,EAAE,EAAE;QAC5C,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;QAClB,UAAU,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CAAC,KAAwB,EAAuB,EAAE;QACjE,KAAK,MAAM,MAAM,IAAI,OAAO,EAAE;YAC1B,IAAI,MAAM,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE;gBACjD,KAAK,MAAM,WAAW,IAAI,MAAM,CAAC,OAAO,EAAE;oBACtC,IAAI,WAAW,CAAC,OAAO,CAAC,KAAK,KAAK,EAAE;wBAChC,OAAO,WAAW,CAAC;qBACtB;iBACJ;aACJ;iBAAM;gBACH,sGAAsG;gBACtG,IAAK,MAAkB,CAAC,OAAO,CAAC,KAAK,KAAK,EAAE;oBACxC,OAAO,MAAiB,CAAC;iBAC5B;aACJ;SACJ;IACL,CAAC,CAAC;IAEF,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,GAAG,IAAA,oDAA0B,EAAmB;QACxH,UAAU,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAChD,SAAS,EAAE,CAAC,CAAC,KAAK;QAClB,OAAO;QACP,MAAM,EAAE,OAAO;QACf,UAAU,EAAE,UAAU,CAAC,OAAO;QAC9B,aAAa,EAAE,UAAU,CAAC,KAAK,CAAC;QAChC,UAAU;QACV,kBAAkB;KACrB,CAAC,CAAC;IAEH,MAAM,eAAe,GAAG,CAAC,KAAwB,EAAU,EAAE;QACzD,MAAM,MAAM,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;QACjC,OAAO,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,SAAS,CAAC,KAAI,KAAK,IAAI,EAAE,CAAC;IAC9C,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,CAAC,KAAwB,EAAsB,EAAE;QAC/D,MAAM,MAAM,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;QAEjC,IAAI,WAAW,EAAE;YACb,OAAO,WAAW,CAAC,MAAM,CAAC,CAAC;SAC9B;QAED,OAAO,eAAe,CAAC,KAAK,CAAC,CAAC;IAClC,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,OAAqC,EAAuC,EAAE;QAClG,IAAI,CAAC,OAAO;YAAE,OAAO,IAAI,CAAC;QAC1B,OAAO,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YACjC,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;YAE/B,IAAI,OAAO,EAAE;gBACT,OAAO,YAAY,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;aACpD;YAED,OAAO,aAAa,CAAC,EAAE,MAAM,EAAE,MAAiB,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,CAAC;QACpE,CAAC,CAAC,CAAC;IACP,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,IAAY,EAAE,OAAqC,EAAE,EAAE;QACzE,OAAO,CACH;YACI,uCAAK,SAAS,EAAC,4CAA4C;gBACvD,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,IAC5C,IAAI,CACF,CACL;YACL,cAAc,CAAC,OAAO,CAAC,CACzB,CACN,CAAC;IACN,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,EAAE,MAAM,EAAE,GAAG,EAAiC,EAAE,EAAE;QACrE,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,KAAK,CAAC;QAC7C,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC,MAAK,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,OAAO,CAAC,CAAA,CAAC;QAEjE,OAAO,CACH,uCACI,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,GAAG,CAAC,EACzD,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,oBAAU,EAAC,8BAA8B,EAAE,EAAE,YAAY,EAAE,UAAU,IAAI,WAAW,EAAE,CAAC,EAClG,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,EAC3C,YAAY,EAAE,GAAG,EAAE;gBACf,gBAAgB,CAAC,MAAM,CAAC,CAAC;YAC7B,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,gBAAgB,EAAE,EACtC,WAAW,EAAE,GAAG,EAAE,CAAC,eAAe,EAAE;YAEpC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,SAAS,EAAC,qCAAqC,IACtE,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CACtE;YACN,UAAU,IAAI,CACX,wCAAM,SAAS,EAAC,qCAAqC;gBACjD,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,GAAI,CAC3B,CACV,CACC,CACT,CAAC;IACN,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,KAAK,IAAI,KAAK,GAAG,iBAAiB,IAAI,cAAc,CAAC;IAEpE,OAAO,CACH;QACK,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,CACpB,wCAAM,SAAS,EAAE,IAAA,oBAAU,EAAC,WAAW,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,SAAS;YAC/F,MAAM,CAAC,CAAC,CAAC,CACN,0CAAQ,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,CAAC,CAAC,MAAM,CAAC,KAAyB,CAAC,IAChF,cAAc,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;gBACzB,OAAO,0CAAQ,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,GAAW,CAAC;YACtG,CAAC,CAAC,CACG,CACZ,CAAC,CAAC,CAAC,CACA,SAAS,CAAC,KAAK,CAAC,CACnB;YACA,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,GAAI,CAC9E,CACV;QACA,CAAC,MAAM,IAAI,CACR,8BAAC,iBAAO,IACJ,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,mCAAI,IAAI,EACrC,aAAa,EAAE,MAAM,IAAI,SAAS,CAAC,OAAO,IAAI,SAAS,EACvD,SAAS,EAAE,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,mCAAI,cAAc,EAC/C,QAAQ,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,EAC3B,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,EACzC,OAAO,EAAE,QAAQ,EACjB,kBAAkB,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,kBAAkB,EAC/C,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU;YAE/B,uCAAK,GAAG,EAAE,kBAAkB,EAAE,SAAS,EAAE,IAAA,oBAAU,EAAC,yBAAyB,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,CAAC,IAC7F,cAAc,CAAC,OAAO,CAAC,CACtB,CACA,CACb,CACF,CACN,CAAC;AACN,CAAC,CAAC;AAvLW,QAAA,WAAW,eAuLtB;AAEW,QAAA,MAAM,GAAG,IAAA,kBAAU,EAAC,mBAAW,CAE5B,CAAC","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 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 }: 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 {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: Select<TOption, KeyName> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n\nexport interface IDefaultSelectOption {\n value: string;\n text: string;\n}\n"]}
|
|
@@ -10,6 +10,7 @@ export interface TextBoxProps {
|
|
|
10
10
|
label?: string;
|
|
11
11
|
validationStatus?: 'success' | 'error';
|
|
12
12
|
value?: string;
|
|
13
|
+
className?: string;
|
|
13
14
|
onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
14
15
|
inputProps?: Omit<JSX.IntrinsicElements['input'], 'id' | 'ref' | 'value' | 'onFocus' | 'onBlur' | 'onKeyPress'>;
|
|
15
16
|
onKeyPress?: JSX.IntrinsicElements['input']['onKeyPress'];
|
|
@@ -36,7 +36,7 @@ const TextBox = (props, ref) => {
|
|
|
36
36
|
'--success': props.validationStatus === 'success',
|
|
37
37
|
'--error': props.validationStatus === 'error',
|
|
38
38
|
'--disabled': inputProperties.disabled,
|
|
39
|
-
});
|
|
39
|
+
}, props.className);
|
|
40
40
|
const onFocusHandler = () => {
|
|
41
41
|
return setSelected(true);
|
|
42
42
|
};
|
|
@@ -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;
|
|
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"]}
|