@roomstay/frontend 2.0.12 → 2.1.1

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

@@ -1 +1 @@
-{"version":3,"file":"RadioButtonGroup.js","sourceRoot":"/","sources":["src/components/generic/RadioButtonGroup/RadioButtonGroup.tsx"],"names":[],"mappings":";;AAAA,+BAA+B;AAE/B,iFAA8E;AAC9E,iFAAoD;AACpD,8DAAuD;AACvD,gDAAyC;AAiBzC,MAAM,gBAAgB,GAA8B,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC5F,OAAO,CACH,6BAAK,SAAS,EAAE,sCAAM,CAAC,IAAI,IACtB,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,aAAa,EAAE,EAAE,EAAE;QACvE,MAAM,WAAW,GAAG,CAChB,oBAAC,yBAAW,IACR,SAAS,EAAE,sCAAM,CAAC,IAAI,EACtB,GAAG,EAAE,KAAK,EACV,OAAO,EAAE,CAAC,QAAQ,IAAI,KAAK,KAAK,SAAS,EACzC,QAAQ,EAAE,GAAG,EAAE;gBACX,IAAI,CAAC,QAAQ;oBAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;YACnC,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,GAAG,EAAE,CAAC,oBAAC,wBAAc,IAAC,IAAI,UAAE,aAAa,EAAE,CAAkB,GAC9E,CACL,CAAC;QAEF,IAAI,QAAQ,IAAI,cAAc,EAAE;YAC5B,OAAO,CACH,oBAAC,iBAAO,IAAC,GAAG,EAAE,KAAK,EAAE,cAAc,EAAE,sCAAM,CAAC,OAAO,EAAE,KAAK,EAAE,cAAc,IACrE,WAAW,CACN,CACb,CAAC;SACL;QAED,OAAO,CACH,6BAAK,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,sCAAM,CAAC,OAAO,IACrC,WAAW,CACV,CACT,CAAC;IACN,CAAC,CAAC,CACA,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\nimport { FC, ReactNode } from 'react';\nimport { RadioButton } from 'components/generic/RadioButtonGroup/RadioButton';\nimport styles from './RadioButtonGroup.module.scss';\nimport AutoAutoHeight from 'animations/AutoAutoHeight';\nimport Tooltip from '../Tooltip/Tooltip';\n\nexport interface RadioButtonGroupProps {\n    options: {\n        value: string;\n        label?: ReactNode;\n\n        disabled?: boolean;\n        /** Enabled a tooltip that gives more info on why the field is disabled */\n        disabledReason?: string;\n\n        renderContent?: () => ReactNode;\n    }[];\n    value: string;\n    onChange: (value: string) => void;\n}\n\nconst RadioButtonGroup: FC<RadioButtonGroupProps> = ({ options, value: valueProp, onChange }) => {\n    return (\n        <div className={styles.root}>\n            {options.map(({ value, label, disabled, disabledReason, renderContent }) => {\n                const radioButton = (\n                    <RadioButton\n                        className={styles.item}\n                        key={value}\n                        checked={!disabled && value === valueProp}\n                        onChange={() => {\n                            if (!disabled) onChange(value);\n                        }}\n                        label={label}\n                        disabled={disabled}\n                        renderContent={() => <AutoAutoHeight open>{renderContent()}</AutoAutoHeight>}\n                    />\n                );\n\n                if (disabled && disabledReason) {\n                    return (\n                        <Tooltip key={value} wrapperClasses={styles.wrapper} title={disabledReason}>\n                            {radioButton}\n                        </Tooltip>\n                    );\n                }\n\n                return (\n                    <div key={value} className={styles.wrapper}>\n                        {radioButton}\n                    </div>\n                );\n            })}\n        </div>\n    );\n};\n\nexport default RadioButtonGroup;\n"]}
+{"version":3,"file":"RadioButtonGroup.js","sourceRoot":"/","sources":["src/components/generic/RadioButtonGroup/RadioButtonGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAE/B,mFAAgF;AAChF,kGAAoD;AACpD,+EAAuD;AACvD,iEAAyC;AAiBzC,MAAM,gBAAgB,GAA8B,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC5F,OAAO,CACH,6BAAK,SAAS,EAAE,sCAAM,CAAC,IAAI,IACtB,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,aAAa,EAAE,EAAE,EAAE;QACvE,MAAM,WAAW,GAAG,CAChB,oBAAC,yBAAW,IACR,SAAS,EAAE,sCAAM,CAAC,IAAI,EACtB,GAAG,EAAE,KAAK,EACV,OAAO,EAAE,CAAC,QAAQ,IAAI,KAAK,KAAK,SAAS,EACzC,QAAQ,EAAE,GAAG,EAAE;gBACX,IAAI,CAAC,QAAQ;oBAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;YACnC,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,GAAG,EAAE,CAAC,oBAAC,wBAAc,IAAC,IAAI,UAAE,aAAa,EAAE,CAAkB,GAC9E,CACL,CAAC;QAEF,IAAI,QAAQ,IAAI,cAAc,EAAE;YAC5B,OAAO,CACH,oBAAC,iBAAO,IAAC,GAAG,EAAE,KAAK,EAAE,cAAc,EAAE,sCAAM,CAAC,OAAO,EAAE,KAAK,EAAE,cAAc,IACrE,WAAW,CACN,CACb,CAAC;SACL;QAED,OAAO,CACH,6BAAK,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,sCAAM,CAAC,OAAO,IACrC,WAAW,CACV,CACT,CAAC;IACN,CAAC,CAAC,CACA,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\nimport { FC, ReactNode } from 'react';\nimport { RadioButton } from '@/components/generic/RadioButtonGroup/RadioButton';\nimport styles from './RadioButtonGroup.module.scss';\nimport AutoAutoHeight from 'animations/AutoAutoHeight';\nimport Tooltip from '../Tooltip/Tooltip';\n\nexport interface RadioButtonGroupProps {\n    options: {\n        value: string;\n        label?: ReactNode;\n\n        disabled?: boolean;\n        /** Enabled a tooltip that gives more info on why the field is disabled */\n        disabledReason?: string;\n\n        renderContent?: () => ReactNode;\n    }[];\n    value: string;\n    onChange: (value: string) => void;\n}\n\nconst RadioButtonGroup: FC<RadioButtonGroupProps> = ({ options, value: valueProp, onChange }) => {\n    return (\n        <div className={styles.root}>\n            {options.map(({ value, label, disabled, disabledReason, renderContent }) => {\n                const radioButton = (\n                    <RadioButton\n                        className={styles.item}\n                        key={value}\n                        checked={!disabled && value === valueProp}\n                        onChange={() => {\n                            if (!disabled) onChange(value);\n                        }}\n                        label={label}\n                        disabled={disabled}\n                        renderContent={() => <AutoAutoHeight open>{renderContent()}</AutoAutoHeight>}\n                    />\n                );\n\n                if (disabled && disabledReason) {\n                    return (\n                        <Tooltip key={value} wrapperClasses={styles.wrapper} title={disabledReason}>\n                            {radioButton}\n                        </Tooltip>\n                    );\n                }\n\n                return (\n                    <div key={value} className={styles.wrapper}>\n                        {radioButton}\n                    </div>\n                );\n            })}\n        </div>\n    );\n};\n\nexport default RadioButtonGroup;\n"]}

package/dist/src/components/generic/RecentSearchesCard.d.ts

@@ -1,5 +1,5 @@
-import BasketRow from 'models/BasketRow';
-interface RecentSearchesCardProps {
+import BasketRow from '@/models/BasketRow';
+export interface RecentSearchesCardProps {
     basketRow: BasketRow;
     onViewRatesClicked: () => void;
     onRemove: () => void;

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

@@ -1,20 +1,46 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const dayjs = require("dayjs");
-const ImageGallerySlider_1 = require("components/steps/room/ImageGallerySlider");
-const BEButton_1 = require("components/generic/BEButton");
-const Icon_1 = require("components/generic/Icon/Icon");
-const Color_1 = require("util/Color");
-const Text_1 = require("components/generic/Text");
+const React = __importStar(require("react"));
+const dayjs_1 = __importDefault(require("dayjs"));
+const ImageGallerySlider_1 = __importDefault(require("@/components/steps/room/ImageGallerySlider"));
+const BEButton_1 = __importDefault(require("@/components/generic/BEButton"));
+const Icon_1 = __importStar(require("@/components/generic/Icon/Icon"));
+const Color_1 = require("@/util/Color");
+const Text_1 = __importStar(require("@/components/generic/Text"));
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
 const react_1 = require("react");
-const ScreenSize_1 = require("util/ScreenSize");
+const ScreenSize_1 = __importDefault(require("@/util/ScreenSize"));
 const contexts_1 = require("@frontend/contexts");
 const RecentSearchesCard = ({ basketRow, onRemove, onViewRatesClicked }) => {
-    const start = dayjs(basketRow.getStartDate()).format('ddd DD MMM');
-    const end = dayjs(basketRow.getEndDate()).format('ddd DD MMM');
+    const start = (0, dayjs_1.default)(basketRow.getStartDate()).format('ddd DD MMM');
+    const end = (0, dayjs_1.default)(basketRow.getEndDate()).format('ddd DD MMM');
     const { t } = (0, react_i18next_1.useTranslation)();
     const beContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);
     return (React.createElement("div", { style: { backgroundColor: '#fff' }, className: "recent-searches-card" },

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

@@ -1 +1 @@
-{"version":3,"file":"RecentSearchesCard.js","sourceRoot":"/","sources":["src/components/generic/RecentSearchesCard.tsx"],"names":[],"mappings":";;AAAA,+BAA+B;AAC/B,+BAA+B;AAC/B,iFAA0E;AAC1E,0DAAmD;AACnD,uDAA8D;AAC9D,sCAAmC;AACnC,kDAAyD;AAEzD,iDAA+C;AAC/C,0DAAuD;AACvD,iCAAmC;AACnC,gDAAyC;AACzC,iDAA0D;AAQ1D,MAAM,kBAAkB,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,kBAAkB,EAA2B,EAAE,EAAE;IAChG,MAAM,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,YAAY,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IACnE,MAAM,GAAG,GAAG,KAAK,CAAC,SAAS,CAAC,UAAU,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IAE/D,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,SAAS,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IAEnD,OAAO,CACH,6BAAK,KAAK,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,EAAE,SAAS,EAAC,sBAAsB;QACrE,6BAAK,SAAS,EAAC,+BAA+B;YAC1C,oBAAC,4BAAkB,IAAC,MAAM,EAAE,SAAS,CAAC,OAAO,EAAE,CAAC,MAAM,EAAE,gBAAgB,EAAE,IAAI,GAAI,CAChF;QACN,6BAAK,SAAS,EAAC,mCAAmC,EAAC,OAAO,EAAE,kBAAkB;YAC1E,6BAAK,SAAS,EAAC,6BAA6B;gBACxC,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,aAAK,CAAC,MAAM,IACrD,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,CACtB;gBACP,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,SAAS,EAAC,sBAAsB,IAC9E,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,CACtB,CACL;YAEN,6BAAK,SAAS,EAAC,sDAAsD;gBACjE,6BAAK,SAAS,EAAC,aAAa;oBACxB,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACrB,KAAK;;wBAAI,GAAG,CACV,CACL;gBACN;oBACI,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ;wBAC5C,SAAS,CAAC,SAAS,EAAE;;wBAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC;;wBAAO,SAAS,CAAC,WAAW,EAAE;;wBAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CACjI,CACL,CACJ;YACN,oBAAC,kBAAQ,IACL,IAAI,EAAE,eAAQ,CAAC,UAAU,EACzB,YAAY,EAAC,OAAO,EACpB,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,IAAI,EACb,IAAI,EAAE,SAAS,CAAC,UAAU,IAAI,oBAAU,CAAC,MAAM,EAC/C,OAAO,EAAE,kBAAkB,IAE1B,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CACrC,CACT;QACN,6BAAK,SAAS,EAAC,6BAA6B;YACxC,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,GAAI,CACpF,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,kBAAkB,CAAC","sourcesContent":["import * as React from 'react';\nimport * as dayjs from 'dayjs';\nimport ImageGallerySlider from 'components/steps/room/ImageGallerySlider';\nimport BEButton from 'components/generic/BEButton';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport { Color } from 'util/Color';\nimport Text, { TextType } from 'components/generic/Text';\nimport BasketRow from 'models/BasketRow';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport { useContext } from 'react';\nimport ScreenSize from 'util/ScreenSize';\nimport { BookingEngineContext } from '@frontend/contexts';\ninterface RecentSearchesCardProps {\n    basketRow: BasketRow;\n\n    onViewRatesClicked: () => void;\n    onRemove: () => void;\n}\n\nconst RecentSearchesCard = ({ basketRow, onRemove, onViewRatesClicked }: RecentSearchesCardProps) => {\n    const start = dayjs(basketRow.getStartDate()).format('ddd DD MMM');\n    const end = dayjs(basketRow.getEndDate()).format('ddd DD MMM');\n\n    const { t } = useTranslation();\n\n    const beContext = useContext(BookingEngineContext);\n\n    return (\n        <div style={{ backgroundColor: '#fff' }} className=\"recent-searches-card\">\n            <div className=\"recent-searches-card--gallery\">\n                <ImageGallerySlider images={basketRow.getRoom().images} hideLightboxIcon={true} />\n            </div>\n            <div className=\"recent-searches-card--information\" onClick={onViewRatesClicked}>\n                <div className=\"recent-searches-card--title\">\n                    <Text type={TextType.Body} bold={true} color={Color.Accent}>\n                        {basketRow.getRoom().name}\n                    </Text>\n                    <Text type={TextType.Small} color={Color.DarkGrey} className=\"u-marg-bottom--light\">\n                        {basketRow.getRate().name}\n                    </Text>\n                </div>\n\n                <div className=\"u-marg-bottom u-flex flex-wrap justify-content-start\">\n                    <div className=\"u-pad-right\">\n                        <Text type={TextType.Small}>\n                            {start}, {end}\n                        </Text>\n                    </div>\n                    <div>\n                        <Text type={TextType.Small} color={Color.DarkGrey}>\n                            {basketRow.getAdults()} {t(Translation.Step.Date.Adult_plural)} and {basketRow.getChildren()} {t(Translation.Step.Date.Child_plural)}\n                        </Text>\n                    </div>\n                </div>\n                <BEButton\n                    icon={IconType.ArrowRight}\n                    iconPosition=\"right\"\n                    filled={true}\n                    primary={true}\n                    wide={beContext.screenSize <= ScreenSize.Medium}\n                    onClick={onViewRatesClicked}\n                >\n                    {t(Translation.Step.Room.RoomInfo.ViewRates)}\n                </BEButton>\n            </div>\n            <div className=\"recent-searches-card--close\">\n                <Icon icon={IconType.Close} color={Color.DarkGrey} size={'24px'} onClick={onRemove} />\n            </div>\n        </div>\n    );\n};\n\nexport default RecentSearchesCard;\n"]}
+{"version":3,"file":"RecentSearchesCard.js","sourceRoot":"/","sources":["src/components/generic/RecentSearchesCard.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,kDAA0B;AAC1B,oGAA4E;AAC5E,6EAAqD;AACrD,uEAAgE;AAChE,wCAAqC;AACrC,kEAA2D;AAE3D,iDAA+C;AAC/C,0DAAuD;AACvD,iCAAmC;AACnC,mEAA2C;AAC3C,iDAA0D;AAQ1D,MAAM,kBAAkB,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,kBAAkB,EAA2B,EAAE,EAAE;IAChG,MAAM,KAAK,GAAG,IAAA,eAAK,EAAC,SAAS,CAAC,YAAY,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IACnE,MAAM,GAAG,GAAG,IAAA,eAAK,EAAC,SAAS,CAAC,UAAU,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IAE/D,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,SAAS,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IAEnD,OAAO,CACH,6BAAK,KAAK,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,EAAE,SAAS,EAAC,sBAAsB;QACrE,6BAAK,SAAS,EAAC,+BAA+B;YAC1C,oBAAC,4BAAkB,IAAC,MAAM,EAAE,SAAS,CAAC,OAAO,EAAE,CAAC,MAAM,EAAE,gBAAgB,EAAE,IAAI,GAAI,CAChF;QACN,6BAAK,SAAS,EAAC,mCAAmC,EAAC,OAAO,EAAE,kBAAkB;YAC1E,6BAAK,SAAS,EAAC,6BAA6B;gBACxC,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,aAAK,CAAC,MAAM,IACrD,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,CACtB;gBACP,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,SAAS,EAAC,sBAAsB,IAC9E,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,CACtB,CACL;YAEN,6BAAK,SAAS,EAAC,sDAAsD;gBACjE,6BAAK,SAAS,EAAC,aAAa;oBACxB,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACrB,KAAK;;wBAAI,GAAG,CACV,CACL;gBACN;oBACI,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ;wBAC5C,SAAS,CAAC,SAAS,EAAE;;wBAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC;;wBAAO,SAAS,CAAC,WAAW,EAAE;;wBAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CACjI,CACL,CACJ;YACN,oBAAC,kBAAQ,IACL,IAAI,EAAE,eAAQ,CAAC,UAAU,EACzB,YAAY,EAAC,OAAO,EACpB,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,IAAI,EACb,IAAI,EAAE,SAAS,CAAC,UAAU,IAAI,oBAAU,CAAC,MAAM,EAC/C,OAAO,EAAE,kBAAkB,IAE1B,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CACrC,CACT;QACN,6BAAK,SAAS,EAAC,6BAA6B;YACxC,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,GAAI,CACpF,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,kBAAkB,CAAC","sourcesContent":["import * as React from 'react';\nimport dayjs from 'dayjs';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport BEButton from '@/components/generic/BEButton';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport Text, { TextType } from '@/components/generic/Text';\nimport BasketRow from '@/models/BasketRow';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport { useContext } from 'react';\nimport ScreenSize from '@/util/ScreenSize';\nimport { BookingEngineContext } from '@frontend/contexts';\nexport interface RecentSearchesCardProps {\n    basketRow: BasketRow;\n\n    onViewRatesClicked: () => void;\n    onRemove: () => void;\n}\n\nconst RecentSearchesCard = ({ basketRow, onRemove, onViewRatesClicked }: RecentSearchesCardProps) => {\n    const start = dayjs(basketRow.getStartDate()).format('ddd DD MMM');\n    const end = dayjs(basketRow.getEndDate()).format('ddd DD MMM');\n\n    const { t } = useTranslation();\n\n    const beContext = useContext(BookingEngineContext);\n\n    return (\n        <div style={{ backgroundColor: '#fff' }} className=\"recent-searches-card\">\n            <div className=\"recent-searches-card--gallery\">\n                <ImageGallerySlider images={basketRow.getRoom().images} hideLightboxIcon={true} />\n            </div>\n            <div className=\"recent-searches-card--information\" onClick={onViewRatesClicked}>\n                <div className=\"recent-searches-card--title\">\n                    <Text type={TextType.Body} bold={true} color={Color.Accent}>\n                        {basketRow.getRoom().name}\n                    </Text>\n                    <Text type={TextType.Small} color={Color.DarkGrey} className=\"u-marg-bottom--light\">\n                        {basketRow.getRate().name}\n                    </Text>\n                </div>\n\n                <div className=\"u-marg-bottom u-flex flex-wrap justify-content-start\">\n                    <div className=\"u-pad-right\">\n                        <Text type={TextType.Small}>\n                            {start}, {end}\n                        </Text>\n                    </div>\n                    <div>\n                        <Text type={TextType.Small} color={Color.DarkGrey}>\n                            {basketRow.getAdults()} {t(Translation.Step.Date.Adult_plural)} and {basketRow.getChildren()} {t(Translation.Step.Date.Child_plural)}\n                        </Text>\n                    </div>\n                </div>\n                <BEButton\n                    icon={IconType.ArrowRight}\n                    iconPosition=\"right\"\n                    filled={true}\n                    primary={true}\n                    wide={beContext.screenSize <= ScreenSize.Medium}\n                    onClick={onViewRatesClicked}\n                >\n                    {t(Translation.Step.Room.RoomInfo.ViewRates)}\n                </BEButton>\n            </div>\n            <div className=\"recent-searches-card--close\">\n                <Icon icon={IconType.Close} color={Color.DarkGrey} size={'24px'} onClick={onRemove} />\n            </div>\n        </div>\n    );\n};\n\nexport default RecentSearchesCard;\n"]}

package/dist/src/components/generic/Select/Select.d.ts

@@ -1,12 +1,20 @@
-import { ReactNode, Ref } from 'react';
+import { ReactElement, Ref } from 'react';
 import './Select.global.scss';
+import { OverlayProps } from '@/components/generic/Overlay/Overlay';
 export type Option<KeyName extends string> = {
     [keyName in KeyName]: string;
-} & Record<any, any>;
+} & Record<any, any> & {
+    options?: Option<KeyName>[];
+};
+export type TOptionGroup<T> = {
+    name: string;
+    options: T[];
+};
+export type TSelectOptionKey<T> = TOptionGroup<T> | T;
 type Select<TOption extends Option<KeyName>, KeyName extends string> = {
-    options: TOption[];
-    value: TOption[KeyName];
+    options: TSelectOptionKey<TOption>[];
     keyName: KeyName;
+    value?: TOption[KeyName];
     labelName?: TOption[keyof TOption];
     target?: HTMLElement;
     open?: boolean;
@@ -14,11 +22,17 @@ type Select<TOption extends Option<KeyName>, KeyName extends string> = {
     onChange?: (value: TOption[KeyName]) => void;
     className?: string;
     offset?: [number, number];
-    renderOption?: (option: TOption) => ReactNode;
+    renderOption?: (option?: TOption) => ReactElement | null;
+    renderLabel?: (option?: TOption | null) => ReactElement | null;
     nativeOnMobile?: boolean;
+    overlay?: Partial<Omit<OverlayProps, 'children' | 'open' | 'container' | 'followElement' | 'onClose' | 'overlayRef'>>;
 };
-export declare const InnerSelect: <TOption extends Option<KeyName>, KeyName extends string>({ target, open, onClose, options, value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile }: Select<TOption, KeyName>, ref: Ref<HTMLDivElement>) => JSX.Element;
+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;
 export declare const Select: <TOption extends Option<KeyName>, KeyName extends string>(p: Select<TOption, KeyName> & {
     ref?: Ref<HTMLDivElement>;
 }) => JSX.Element;
+export interface IDefaultSelectOption {
+    value: string;
+    text: string;
+}
 export {};

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

@@ -1,23 +1,51 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Select = exports.InnerSelect = void 0;
-const React = require("react");
-const react_1 = require("react");
-const Icon_1 = require("../Icon/Icon");
-const classNames = require("classnames");
+const react_1 = __importStar(require("react"));
+const Icon_1 = __importStar(require("../Icon/Icon"));
+const classnames_1 = __importDefault(require("classnames"));
 require("./Select.global.scss");
-const Overlay_1 = require("components/generic/Overlay/Overlay");
-const KeyboardControlOnSelect_1 = require("hooks/KeyboardControlOnSelect");
-const Color_1 = require("util/Color");
-const CombineState_1 = require("hooks/CombineState");
-const WindowSize_1 = require("hooks/WindowSize");
-const Text_1 = require("components/generic/Text");
+const Overlay_1 = require("@/components/generic/Overlay/Overlay");
+const KeyboardControlOnSelect_1 = require("@/hooks/KeyboardControlOnSelect");
+const Color_1 = require("@/util/Color");
+const CombineState_1 = require("@/hooks/CombineState");
+const WindowSize_1 = require("@/hooks/WindowSize");
+const Text_1 = __importStar(require("@/components/generic/Text"));
 const MOBILE_BREAKPOINT = 992;
-const InnerSelect = ({ target, open, onClose, options = [], value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile = false }, ref) => {
+const InnerSelect = ({ target, open, onClose, options = [], value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile = false, overlay, renderLabel, }, ref) => {
+    var _a, _b;
     const { width } = (0, WindowSize_1.useWindowSize)();
     const targetRef = (0, react_1.useRef)(null);
+    const optionRefs = (0, react_1.useRef)({});
+    const optionContainerRef = (0, react_1.useRef)(null);
     const [_open, _setIsOpen] = (0, CombineState_1.useCombinedState)(open, false);
-    // Force to fix later
+    // TODO: Force to fix later
     nativeOnMobile = false;
     const _onClose = (e) => {
         _setIsOpen(false);
@@ -30,7 +58,21 @@ const InnerSelect = ({ target, open, onClose, options = [], value, onChange, key
         _setIsOpen(false);
     };
     const _getOption = (value) => {
-        return options === null || options === void 0 ? void 0 : options.find((option) => option[keyName] === value);
+        for (const option of options) {
+            if (option.options && Array.isArray(option.options)) {
+                for (const childOption of option.options) {
+                    if (childOption[keyName] === value) {
+                        return childOption;
+                    }
+                }
+            }
+            else {
+                // If we're in here it means that this option doesn't have children and is in fact an individual group
+                if (option[keyName] === value) {
+                    return option;
+                }
+            }
+        }
     };
     const { selectingItem, onItemMouseMove, onItemMouseLeave, onItemMouseEnter } = (0, KeyboardControlOnSelect_1.useKeyboardControlOnSelect)({
         onSelected: (item) => _onSelected(item[keyName]),
@@ -39,28 +81,53 @@ const InnerSelect = ({ target, open, onClose, options = [], value, onChange, key
         idName: keyName,
         overlayRef: overlayRef.current,
         defaultOption: _getOption(value),
+        optionRefs,
+        optionContainerRef,
     });
     const _getLabel = (value) => {
-        const option = options === null || options === void 0 ? void 0 : options.find((option) => option[keyName] === value);
-        return (option === null || option === void 0 ? void 0 : option[labelName]) || value;
+        const option = _getOption(value);
+        if (renderLabel) {
+            return renderLabel(option);
+        }
+        return (option === null || option === void 0 ? void 0 : option[labelName]) || value || '';
+    };
+    const _renderOptions = (options) => {
+        if (!options)
+            return null;
+        return options.map((option, index) => {
+            const isGroup = option.options;
+            if (isGroup) {
+                return _renderGroup(option.name, option.options);
+            }
+            return _renderOption({ option: option, key: index });
+        });
+    };
+    const _renderGroup = (name, options) => {
+        return (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("div", { className: "rs-select--suggest-list-item --group-title" },
+                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey }, name)),
+            _renderOptions(options)));
+    };
+    const _renderOption = ({ option, key }) => {
+        const isSelected = option[keyName] === value;
+        const isSelecting = option[keyName] === (selectingItem === null || selectingItem === void 0 ? void 0 : selectingItem[keyName]);
+        return (react_1.default.createElement("div", { ref: (ref) => (optionRefs.current[option[keyName]] = ref), key: key, className: (0, classnames_1.default)('rs-select--suggest-list-item', { '--selected': isSelected || isSelecting }), onClick: () => _onSelected(option[keyName]), onMouseEnter: () => {
+                onItemMouseEnter(option);
+            }, onMouseLeave: () => onItemMouseLeave(), onMouseMove: () => onItemMouseMove() },
+            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, className: "rs-select--suggest-list-option-name" }, renderOption ? renderOption(option) : labelName ? option[labelName] : ''),
+            isSelected && (react_1.default.createElement("span", { className: "rs-select--suggest-list-option-icon" },
+                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Check })))));
     };
     const native = width && width < MOBILE_BREAKPOINT && nativeOnMobile;
-    return (React.createElement(React.Fragment, null,
-        (native || !target) && (React.createElement("span", { className: classNames('be-select', className), onClick: () => _setIsOpen(true), ref: targetRef },
-            native ? (React.createElement("select", { value: value, onChange: (e) => onChange(e.target.value) }, options.map((item) => {
-                return React.createElement("option", { value: value, key: item[keyName], label: _getLabel(item[keyName]) });
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        (native || !target) && (react_1.default.createElement("span", { className: (0, classnames_1.default)('be-select', className), onClick: () => _setIsOpen(true), ref: targetRef },
+            native ? (react_1.default.createElement("select", { value: value, onChange: (e) => onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value) }, options.map((item) => {
+                //@ts-ignore TODO: This needs to support opt groups
+                return react_1.default.createElement("option", { value: value, key: item[keyName], label: _getLabel(item[keyName]) });
             }))) : (_getLabel(value)),
-            React.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown, color: Color_1.Color.DarkGrey }))),
-        !native && (React.createElement(Overlay_1.Overlay, { offset: offset, usePortal: true, followElement: target || targetRef.current, placement: "bottom-start", open: open === undefined ? _open : open, onClose: _onClose, className: "rs-select--suggest-list", overlayRef: overlayRef }, options.map((option, index) => {
-            const isSelected = option[keyName] === value;
-            const isSelecting = option[keyName] === (selectingItem === null || selectingItem === void 0 ? void 0 : selectingItem[keyName]);
-            return (React.createElement("div", { key: index, className: classNames('rs-select--suggest-list-item', { '--selected': isSelected || isSelecting }), onClick: () => _onSelected(option[keyName]), onMouseEnter: () => {
-                    onItemMouseEnter(option);
-                }, onMouseLeave: () => onItemMouseLeave(), onMouseMove: () => onItemMouseMove() },
-                React.createElement(Text_1.default, { type: Text_1.TextType.Small, className: "rs-select--suggest-list-option-name" }, renderOption ? renderOption(option) : labelName ? option[labelName] : ''),
-                isSelected && (React.createElement("span", { className: "rs-select--suggest-list-option-icon" },
-                    React.createElement(Icon_1.default, { icon: Icon_1.IconType.Check })))));
-        })))));
+            react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown, color: Color_1.Color.DarkGrey }))),
+        !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 },
+            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))))));
 };
 exports.InnerSelect = InnerSelect;
 exports.Select = (0, react_1.forwardRef)(exports.InnerSelect);

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

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sourceRoot":"/","sources":["src/components/generic/Select/Select.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,iCAAgF;AAChF,uCAA8C;AAE9C,yCAAyC;AAEzC,gCAA8B;AAC9B,gEAA6D;AAC7D,2EAA2E;AAC3E,sCAAmC;AACnC,qDAAsD;AACtD,iDAAiD;AACjD,kDAAyD;AAsBzD,MAAM,iBAAiB,GAAG,GAAG,CAAC;AAEvB,MAAM,WAAW,GAAG,CACvB,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,GAAG,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,YAAY,EAAE,cAAc,GAAG,KAAK,EAA4B,EAC/J,GAAwB,EAC1B,EAAE;IACA,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,0BAAa,GAAE,CAAC;IAClC,MAAM,SAAS,GAAG,IAAA,cAAM,EAAkB,IAAI,CAAC,CAAC;IAChD,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,GAAG,IAAA,+BAAgB,EAAU,IAAI,EAAE,KAAK,CAAC,CAAC;IAEnE,qBAAqB;IACrB,cAAc,GAAG,KAAK,CAAC;IAEvB,MAAM,QAAQ,GAAG,CAAC,CAAa,EAAQ,EAAE;QACrC,UAAU,CAAC,KAAK,CAAC,CAAC;QAClB,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAChD,IAAA,2BAAmB,EAAC,GAAG,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;IAEnD,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,KAA6B,EAAuB,EAAE;QACtE,OAAO,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,KAAK,CAAC,CAAC;IAChE,CAAC,CAAC;IAEF,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,GAAG,IAAA,oDAA0B,EAAU;QAC/G,UAAU,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAChD,SAAS,EAAE,KAAK;QAChB,OAAO;QACP,MAAM,EAAE,OAAO;QACf,UAAU,EAAE,UAAU,CAAC,OAAO;QAC9B,aAAa,EAAE,UAAU,CAAC,KAAK,CAAC;KACnC,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,CAAC,KAA6B,EAAU,EAAE;QACxD,MAAM,MAAM,GAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,KAAK,CAAC,CAAC;QACpE,OAAO,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,SAAS,CAAC,KAAI,KAAK,CAAC;IACxC,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,8BAAM,SAAS,EAAE,UAAU,CAAC,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,gCAAQ,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAyB,CAAC,IAC9E,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;gBAClB,OAAO,gCAAQ,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,GAAW,CAAC;YAChG,CAAC,CAAC,CACG,CACZ,CAAC,CAAC,CAAC,CACA,SAAS,CAAC,KAAK,CAAC,CACnB;YACD,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,GAAI,CACrD,CACV;QACA,CAAC,MAAM,IAAI,CACR,oBAAC,iBAAO,IACJ,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,IAAI,EACf,aAAa,EAAE,MAAM,IAAI,SAAS,CAAC,OAAO,EAC1C,SAAS,EAAC,cAAc,EACxB,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,EACvC,OAAO,EAAE,QAAQ,EACjB,SAAS,EAAC,yBAAyB,EACnC,UAAU,EAAE,UAAU,IAErB,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YAC3B,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,KAAK,CAAC;YAC7C,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC,MAAK,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,OAAO,CAAC,CAAA,CAAC;YAEjE,OAAO,CACH,6BACI,GAAG,EAAE,KAAK,EACV,SAAS,EAAE,UAAU,CAAC,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;oBACf,gBAAgB,CAAC,MAAM,CAAC,CAAC;gBAC7B,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,gBAAgB,EAAE,EACtC,WAAW,EAAE,GAAG,EAAE,CAAC,eAAe,EAAE;gBAEpC,oBAAC,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;gBACN,UAAU,IAAI,CACX,8BAAM,SAAS,EAAC,qCAAqC;oBACjD,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,GAAI,CAC3B,CACV,CACC,CACT,CAAC;QACN,CAAC,CAAC,CACI,CACb,CACF,CACN,CAAC;AACN,CAAC,CAAC;AArGW,QAAA,WAAW,eAqGtB;AAEW,QAAA,MAAM,GAAG,IAAA,kBAAU,EAAC,mBAAW,CAE5B,CAAC","sourcesContent":["import * as React from 'react';\nimport { forwardRef, ReactNode, Ref, useImperativeHandle, useRef } from 'react';\nimport Icon, { IconType } from '../Icon/Icon';\n\nimport * as classNames from 'classnames';\n\nimport './Select.global.scss';\nimport { Overlay } 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>;\n\ntype Select<TOption extends Option<KeyName>, KeyName extends string> = {\n    options: TOption[];\n    value: TOption[KeyName];\n    keyName: KeyName;\n\n    labelName?: TOption[keyof TOption];\n    target?: HTMLElement;\n    open?: boolean;\n    onClose?: (e: MouseEvent) => void;\n    onChange?: (value: TOption[KeyName]) => void;\n    className?: string;\n    offset?: [number, number];\n    renderOption?: (option: TOption) => ReactNode;\n    nativeOnMobile?: boolean;\n};\n\nconst MOBILE_BREAKPOINT = 992;\n\nexport const InnerSelect = <TOption extends Option<KeyName>, KeyName extends string>(\n    { target, open, onClose, options = [], value, onChange, keyName, labelName, className, offset, renderOption, nativeOnMobile = false }: Select<TOption, KeyName>,\n    ref: Ref<HTMLDivElement>\n) => {\n    const { width } = useWindowSize();\n    const targetRef = useRef<HTMLSpanElement>(null);\n    const [_open, _setIsOpen] = useCombinedState<boolean>(open, false);\n\n    // Force to fix later\n    nativeOnMobile = false;\n\n    const _onClose = (e: MouseEvent): void => {\n        _setIsOpen(false);\n        onClose?.(e);\n    };\n\n    const overlayRef = useRef<HTMLDivElement>(null);\n    useImperativeHandle(ref, () => overlayRef.current);\n\n    const _onSelected = (value: TOption[KeyName]) => {\n        onChange?.(value);\n        _setIsOpen(false);\n    };\n\n    const _getOption = (value: TOption[keyof TOption]): TOption | undefined => {\n        return options?.find((option) => option[keyName] === value);\n    };\n\n    const { selectingItem, onItemMouseMove, onItemMouseLeave, onItemMouseEnter } = useKeyboardControlOnSelect<TOption>({\n        onSelected: (item) => _onSelected(item[keyName]),\n        isEnabled: _open,\n        options,\n        idName: keyName,\n        overlayRef: overlayRef.current,\n        defaultOption: _getOption(value),\n    });\n\n    const _getLabel = (value: TOption[keyof TOption]): string => {\n        const option = options?.find((option) => option[keyName] === value);\n        return option?.[labelName] || value;\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                            {options.map((item) => {\n                                return <option value={value} key={item[keyName]} label={_getLabel(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={true}\n                    followElement={target || targetRef.current}\n                    placement=\"bottom-start\"\n                    open={open === undefined ? _open : open}\n                    onClose={_onClose}\n                    className=\"rs-select--suggest-list\"\n                    overlayRef={overlayRef}\n                >\n                    {options.map((option, index) => {\n                        const isSelected = option[keyName] === value;\n                        const isSelecting = option[keyName] === selectingItem?.[keyName];\n\n                        return (\n                            <div\n                                key={index}\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                </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"]}
+{"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, 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;\n    open?: boolean;\n    onClose?: (e: MouseEvent) => 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\n    // TODO: Force to fix later\n    nativeOnMobile = false;\n\n    const _onClose = (e: MouseEvent): void => {\n        _setIsOpen(false);\n        onClose?.(e);\n    };\n\n    const overlayRef = useRef<HTMLDivElement | null>(null);\n    useImperativeHandle(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 _getLabel = (value?: TOption[KeyName]): string | ReactNode => {\n        const option = _getOption(value);\n\n        if (renderLabel) {\n            return renderLabel(option);\n        }\n\n        return option?.[labelName] || 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                            {options.map((item) => {\n                                //@ts-ignore TODO: This needs to support opt groups\n                                return <option value={value} key={item[keyName]} label={_getLabel(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"]}

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

@@ -1,10 +1,36 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Slider = void 0;
-const React = require("react");
+const React = __importStar(require("react"));
 const react_1 = require("react");
-const classnames = require("classnames");
-const Slider_module_scss_1 = require("./Slider.module.scss");
+const classnames = __importStar(require("classnames"));
+const Slider_module_scss_1 = __importDefault(require("./Slider.module.scss"));
 const SliderMarker = (props) => {
     const markerClasses = classnames(Slider_module_scss_1.default['marker'], {
         [Slider_module_scss_1.default['--fixed']]: props.fixed,

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

@@ -1 +1 @@
-{"version":3,"file":"Slider.js","sourceRoot":"/","sources":["src/components/generic/Slider/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useState, useRef, useEffect } from 'react';\nimport * as classnames from 'classnames';\n\nimport styles from './Slider.module.scss';\n\nexport type MarkerType = {\n    isVisible: boolean;\n\n    label?: string | React.ReactNode;\n    value: number;\n};\n\nexport type BackgroundMarkerType = {\n    isEdge?: 'start' | 'end';\n} & MarkerType;\n\ntype SliderMakerProps = {\n    isEdge?: 'start' | 'end';\n    fixed?: boolean;\n\n    marker?: MarkerType;\n\n    /**\n     * On a scale of 0 to 100, how far should the marker be shown.\n     * @param offset number\n     */\n    offset?: number;\n};\n\nconst SliderMarker = (props: SliderMakerProps) => {\n    const markerClasses = classnames(styles['marker'], {\n        [styles['--fixed']]: props.fixed,\n        [styles['--hidden']]: !props.marker.isVisible,\n        [(styles as any)[`--${props.isEdge}`]]: !!props.isEdge,\n    });\n\n    const markerLabelClasses = classnames(styles['marker-label'], {\n        [styles['--fixed']]: props.fixed,\n        [(styles as any)[`--${props.isEdge}`]]: !!props.isEdge,\n    });\n\n    const markerStyles: React.CSSProperties = {};\n    if (props.offset) {\n        markerStyles.left = Math.max(Math.min(100, props.offset), 0) + '%';\n    }\n\n    return (\n        <span className={markerClasses} style={markerStyles}>\n            {props.marker && !!props.marker.label && <span className={markerLabelClasses}>{props.marker.label}</span>}\n        </span>\n    );\n};\n\ntype SliderProps = {\n    min?: number;\n    max?: number;\n\n    onChange?: (markers: MarkerType[]) => void;\n\n    markers: MarkerType[];\n    backgroundMarkers?: BackgroundMarkerType[];\n};\n\n/**\n * Specifically a ranged slider, specifically for the Filter section of the Step Room display.\n * @param props\n */\nexport const Slider = (props: SliderProps) => {\n    const { min = 0, max = 100 } = props;\n\n    const [isMouseDown, setIsMouseDown] = useState(false);\n    const [movingIndex, setMovingIndex] = useState<number>(null);\n\n    const sliderRef = useRef(null);\n\n    const funcMarkers = props.markers.map(() => {});\n\n    const changeTrigger = (e: MouseEvent | React.MouseEvent, isOnDown = false) => {\n        const rect = (sliderRef?.current as HTMLElement)?.getBoundingClientRect();\n        if (!rect) {\n            return;\n        }\n\n        const startX = rect.x;\n        const endX = rect.x + rect.width;\n\n        const newValue = Math.max(Math.min(Math.round(min + ((max - min) * (e.clientX - startX)) / (endX - startX)), props.max), props.min);\n\n        let closestIndex: number = movingIndex;\n        const markers = props.markers;\n\n        for (let i = 0; i < markers.length; i++) {\n            if (!markers[i].isVisible) continue;\n            if (closestIndex === null || Math.abs(newValue - markers[closestIndex].value) > Math.abs(newValue - markers[i].value)) {\n                closestIndex = i;\n            }\n        }\n\n        const newMarkers = [...props.markers];\n        newMarkers[closestIndex].value = newValue;\n\n        props.onChange(newMarkers);\n        setMovingIndex(closestIndex);\n    };\n\n    const onMouseDown = (e: React.MouseEvent) => {\n        setIsMouseDown(true);\n        changeTrigger(e);\n    };\n\n    const mapValueToPercent = (value: number) => {\n        let newValue = 0;\n\n        const totalDiff = max - min;\n        const baseNewValue = value - min;\n\n        newValue = (baseNewValue / totalDiff) * 100;\n\n        return Math.min(Math.max(newValue, 0), 100);\n    };\n\n    useEffect(() => {\n        let cancelled = false;\n        // Creating a bounding rect here to figure out how big the slider is,\n        // assumption is while the mouse is dragging, the screen size isn't going to change, right?\n        // If this is wrong, add a screen size listener to check on screen size change.\n        const rect = (sliderRef?.current as HTMLElement)?.getBoundingClientRect();\n\n        if (!rect) {\n            return;\n        }\n\n        const startX = rect.x;\n        const endX = rect.x + rect.width;\n\n        const mouseMoveListener = (e: MouseEvent) => {\n            if (!cancelled && movingIndex !== null) {\n                changeTrigger(e);\n            }\n        };\n\n        const mouseUpListener = () => {\n            setIsMouseDown(false);\n            setMovingIndex(null);\n        };\n\n        document.body.addEventListener('mouseup', mouseUpListener);\n        document.body.addEventListener('mousemove', mouseMoveListener);\n\n        return () => {\n            cancelled = true;\n\n            document.body.removeEventListener('mouseup', mouseUpListener);\n            document.body.removeEventListener('mousemove', mouseMoveListener);\n        };\n    }, [movingIndex]);\n\n    return (\n        <div className={styles.slider} onMouseDown={onMouseDown} ref={sliderRef}>\n            <div className={styles['slider-track']}>\n                {(props.backgroundMarkers ?? [])?.map((marker) => {\n                    // TODO: Add labels if we\n                    // TODO: Possibly animate these with Spring library to make them smoother?\n                    return <SliderMarker offset={mapValueToPercent(marker.value)} marker={marker} fixed={true} isEdge={marker.isEdge} />;\n                })}\n\n                <div\n                    className={styles['slider-rail']}\n                    style={{ left: `${mapValueToPercent(props.markers[0].value)}%`, right: `${100 - mapValueToPercent(props.markers[1].value)}%` }}\n                ></div>\n                {props.markers.map((marker) => {\n                    return <SliderMarker offset={mapValueToPercent(marker.value)} marker={marker} />;\n                })}\n            </div>\n        </div>\n    );\n};\n"]}
+{"version":3,"file":"Slider.js","sourceRoot":"/","sources":["src/components/generic/Slider/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useState, useRef, useEffect } from 'react';\nimport * as classnames from 'classnames';\n\nimport styles from './Slider.module.scss';\n\nexport type MarkerType = {\n    isVisible: boolean;\n\n    label?: string | React.ReactNode;\n    value: number;\n};\n\nexport type BackgroundMarkerType = {\n    isEdge?: 'start' | 'end';\n} & MarkerType;\n\ntype SliderMakerProps = {\n    isEdge?: 'start' | 'end';\n    fixed?: boolean;\n\n    marker?: MarkerType;\n\n    /**\n     * On a scale of 0 to 100, how far should the marker be shown.\n     * @param offset number\n     */\n    offset?: number;\n};\n\nconst SliderMarker = (props: SliderMakerProps) => {\n    const markerClasses = classnames(styles['marker'], {\n        [styles['--fixed']]: props.fixed,\n        [styles['--hidden']]: !props.marker.isVisible,\n        [(styles as any)[`--${props.isEdge}`]]: !!props.isEdge,\n    });\n\n    const markerLabelClasses = classnames(styles['marker-label'], {\n        [styles['--fixed']]: props.fixed,\n        [(styles as any)[`--${props.isEdge}`]]: !!props.isEdge,\n    });\n\n    const markerStyles: React.CSSProperties = {};\n    if (props.offset) {\n        markerStyles.left = Math.max(Math.min(100, props.offset), 0) + '%';\n    }\n\n    return (\n        <span className={markerClasses} style={markerStyles}>\n            {props.marker && !!props.marker.label && <span className={markerLabelClasses}>{props.marker.label}</span>}\n        </span>\n    );\n};\n\ntype SliderProps = {\n    min?: number;\n    max?: number;\n\n    onChange?: (markers: MarkerType[]) => void;\n\n    markers: MarkerType[];\n    backgroundMarkers?: BackgroundMarkerType[];\n};\n\n/**\n * Specifically a ranged slider, specifically for the Filter section of the Step Room display.\n * @param props\n */\nexport const Slider = (props: SliderProps) => {\n    const { min = 0, max = 100 } = props;\n\n    const [isMouseDown, setIsMouseDown] = useState(false);\n    const [movingIndex, setMovingIndex] = useState<number>(null);\n\n    const sliderRef = useRef(null);\n\n    const funcMarkers = props.markers.map(() => {});\n\n    const changeTrigger = (e: MouseEvent | React.MouseEvent, isOnDown = false) => {\n        const rect = (sliderRef?.current as HTMLElement)?.getBoundingClientRect();\n        if (!rect) {\n            return;\n        }\n\n        const startX = rect.x;\n        const endX = rect.x + rect.width;\n\n        const newValue = Math.max(Math.min(Math.round(min + ((max - min) * (e.clientX - startX)) / (endX - startX)), props.max), props.min);\n\n        let closestIndex: number = movingIndex;\n        const markers = props.markers;\n\n        for (let i = 0; i < markers.length; i++) {\n            if (!markers[i].isVisible) continue;\n            if (closestIndex === null || Math.abs(newValue - markers[closestIndex].value) > Math.abs(newValue - markers[i].value)) {\n                closestIndex = i;\n            }\n        }\n\n        const newMarkers = [...props.markers];\n        newMarkers[closestIndex].value = newValue;\n\n        props.onChange(newMarkers);\n        setMovingIndex(closestIndex);\n    };\n\n    const onMouseDown = (e: React.MouseEvent) => {\n        setIsMouseDown(true);\n        changeTrigger(e);\n    };\n\n    const mapValueToPercent = (value: number) => {\n        let newValue = 0;\n\n        const totalDiff = max - min;\n        const baseNewValue = value - min;\n\n        newValue = (baseNewValue / totalDiff) * 100;\n\n        return Math.min(Math.max(newValue, 0), 100);\n    };\n\n    useEffect(() => {\n        let cancelled = false;\n        // Creating a bounding rect here to figure out how big the slider is,\n        // assumption is while the mouse is dragging, the screen size isn't going to change, right?\n        // If this is wrong, add a screen size listener to check on screen size change.\n        const rect = (sliderRef?.current as HTMLElement)?.getBoundingClientRect();\n\n        if (!rect) {\n            return;\n        }\n\n        const startX = rect.x;\n        const endX = rect.x + rect.width;\n\n        const mouseMoveListener = (e: MouseEvent) => {\n            if (!cancelled && movingIndex !== null) {\n                changeTrigger(e);\n            }\n        };\n\n        const mouseUpListener = () => {\n            setIsMouseDown(false);\n            setMovingIndex(null);\n        };\n\n        document.body.addEventListener('mouseup', mouseUpListener);\n        document.body.addEventListener('mousemove', mouseMoveListener);\n\n        return () => {\n            cancelled = true;\n\n            document.body.removeEventListener('mouseup', mouseUpListener);\n            document.body.removeEventListener('mousemove', mouseMoveListener);\n        };\n    }, [movingIndex]);\n\n    return (\n        <div className={styles.slider} onMouseDown={onMouseDown} ref={sliderRef}>\n            <div className={styles['slider-track']}>\n                {(props.backgroundMarkers ?? [])?.map((marker) => {\n                    // TODO: Add labels if we\n                    // TODO: Possibly animate these with Spring library to make them smoother?\n                    return <SliderMarker offset={mapValueToPercent(marker.value)} marker={marker} fixed={true} isEdge={marker.isEdge} />;\n                })}\n\n                <div\n                    className={styles['slider-rail']}\n                    style={{ left: `${mapValueToPercent(props.markers[0].value)}%`, right: `${100 - mapValueToPercent(props.markers[1].value)}%` }}\n                ></div>\n                {props.markers.map((marker) => {\n                    return <SliderMarker offset={mapValueToPercent(marker.value)} marker={marker} />;\n                })}\n            </div>\n        </div>\n    );\n};\n"]}

package/dist/src/components/generic/Tabs/ElementChildren.js

@@ -1,7 +1,30 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.reactMap = exports.reactForEach = void 0;
-const React = require("react");
+const React = __importStar(require("react"));
 function reactForEach(children, func) {
     let index = 0;
     React.Children.forEach(children, (child) => {

package/dist/src/components/generic/Tabs/ElementChildren.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElementChildren.js","sourceRoot":"/","sources":["src/components/generic/Tabs/ElementChildren.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAE/B,SAAgB,YAAY,CAAU,QAAa,EAAE,IAAwD;IACzG,IAAI,KAAK,GAAG,CAAC,CAAC;IACd,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;QACvC,IAAI,KAAK,CAAC,cAAc,CAAI,KAAK,CAAC;YAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7D,CAAC,CAAC,CAAC;AACP,CAAC;AALD,oCAKC;AAED,SAAgB,QAAQ,CAAU,QAAa,EAAE,IAAuD;IACpG,IAAI,KAAK,GAAG,CAAC,CAAC;IAEd,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,cAAc,CAAI,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;AACpH,CAAC;AAJD,4BAIC","sourcesContent":["import * as React from 'react';\n\nexport function reactForEach<P = any>(children: any, func: (el: React.ReactElement<P>, index: number) => void) {\n    let index = 0;\n    React.Children.forEach(children, (child) => {\n        if (React.isValidElement<P>(child)) func(child, index++);\n    });\n}\n\nexport function reactMap<P = any>(children: any, func: (el: React.ReactElement<P>, index: number) => any) {\n    let index = 0;\n\n    return React.Children.map(children, (child) => (React.isValidElement<P>(child) ? func(child, index++) : child));\n}\n"]}
+{"version":3,"file":"ElementChildren.js","sourceRoot":"/","sources":["src/components/generic/Tabs/ElementChildren.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAE/B,SAAgB,YAAY,CAAU,QAAa,EAAE,IAAwD;IACzG,IAAI,KAAK,GAAG,CAAC,CAAC;IACd,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;QACvC,IAAI,KAAK,CAAC,cAAc,CAAI,KAAK,CAAC;YAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7D,CAAC,CAAC,CAAC;AACP,CAAC;AALD,oCAKC;AAED,SAAgB,QAAQ,CAAU,QAAa,EAAE,IAAuD;IACpG,IAAI,KAAK,GAAG,CAAC,CAAC;IAEd,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,cAAc,CAAI,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;AACpH,CAAC;AAJD,4BAIC","sourcesContent":["import * as React from 'react';\n\nexport function reactForEach<P = any>(children: any, func: (el: React.ReactElement<P>, index: number) => void) {\n    let index = 0;\n    React.Children.forEach(children, (child) => {\n        if (React.isValidElement<P>(child)) func(child, index++);\n    });\n}\n\nexport function reactMap<P = any>(children: any, func: (el: React.ReactElement<P>, index: number) => any) {\n    let index = 0;\n\n    return React.Children.map(children, (child) => (React.isValidElement<P>(child) ? func(child, index++) : child));\n}\n"]}

package/dist/src/components/generic/Tabs/Tab.js

@@ -1,7 +1,30 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Tab = void 0;
-const React = require("react");
+const React = __importStar(require("react"));
 const Tab = () => {
     throw new Error('The `Tab` component is not meant to be rendered! ' +
         "It's an abstract component that is only valid as a direct Child of the `Tabs` Component. " +

package/dist/src/components/generic/Tabs/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sourceRoot":"/","sources":["src/components/generic/Tabs/Tab.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAUxB,MAAM,GAAG,GAAuB,GAAG,EAAE;IACxC,MAAM,IAAI,KAAK,CACX,mDAAmD;QAC/C,2FAA2F;QAC3F,mEAAmE,CAC1E,CAAC;IACF,mCAAmC;IACnC,OAAO,yCAAK,CAAC;AACjB,CAAC,CAAC;AARW,QAAA,GAAG,OAQd","sourcesContent":["import * as React from 'react';\n\nexport interface TabProps {\n    title: React.ReactNode;\n    navPath: string;\n    disabled?: boolean;\n    tabClassName?: string;\n    tabAttrs?: Record<string, any>;\n}\n\nexport const Tab: React.FC<TabProps> = () => {\n    throw new Error(\n        'The `Tab` component is not meant to be rendered! ' +\n            \"It's an abstract component that is only valid as a direct Child of the `Tabs` Component. \" +\n            'For custom tabs components use TabPane and TabsContainer directly'\n    );\n    // Needed otherwise docs error out.\n    return <></>;\n};\n"]}
+{"version":3,"file":"Tab.js","sourceRoot":"/","sources":["src/components/generic/Tabs/Tab.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAUxB,MAAM,GAAG,GAAuB,GAAG,EAAE;IACxC,MAAM,IAAI,KAAK,CACX,mDAAmD;QAC/C,2FAA2F;QAC3F,mEAAmE,CAC1E,CAAC;IACF,mCAAmC;IACnC,OAAO,yCAAK,CAAC;AACjB,CAAC,CAAC;AARW,QAAA,GAAG,OAQd","sourcesContent":["import * as React from 'react';\n\nexport interface TabProps {\n    title: React.ReactNode;\n    navPath: string;\n    disabled?: boolean;\n    tabClassName?: string;\n    tabAttrs?: Record<string, any>;\n}\n\nexport const Tab: React.FC<TabProps> = () => {\n    throw new Error(\n        'The `Tab` component is not meant to be rendered! ' +\n            \"It's an abstract component that is only valid as a direct Child of the `Tabs` Component. \" +\n            'For custom tabs components use TabPane and TabsContainer directly'\n    );\n    // Needed otherwise docs error out.\n    return <></>;\n};\n"]}

package/dist/src/components/generic/Tabs/TabContext.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { EventKey } from 'components/generic/Tabs/Tabs';
+import { EventKey } from '@/components/generic/Tabs/Tabs';
 interface TabContextProps {
     activeKey: EventKey;
     lastIndex: number;

package/dist/src/components/generic/Tabs/TabContext.js

@@ -1,7 +1,30 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabContextProvider = exports.default = void 0;
-const React = require("react");
+const React = __importStar(require("react"));
 const react_1 = require("react");
 const TabContext = React.createContext({
     activeKey: '',