oolib 2.207.1 → 2.208.1

package/dist/components/Dropdowns/DropdownSingle/index.js

@@ -1,163 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DropdownSingle = DropdownSingle;
-var react_1 = __importStar(require("react"));
-var OptionsSingle_1 = require("../comps/OptionsSingle");
-var SelectDropdown_1 = require("../comps/SelectDropdown");
-var SelectTagsInput_1 = require("../comps/SelectTagsInput");
-var DisplayCompSingle_1 = require("../comps/DisplayCompSingle");
-var handlers_1 = require("../handlers");
-var useHideShowOptions_1 = require("../utils/useHideShowOptions");
-var useCreateDropdownRefs_1 = require("../utils/useCreateDropdownRefs");
-var keywordSearchOptions_1 = require("../utils/keywordSearchOptions");
-var getValue_1 = require("../utils/getValue");
-var generateOptions_1 = require("../utils/generateOptions");
-var useSearchString_1 = require("../utils/useSearchString");
-var styled_components_1 = require("styled-components");
-var genTagComp_1 = require("../utils/genTagComp");
-var BlockLabel_1 = require("../../../v2/components/BlockLabel");
-var getBlockLabelProps_1 = require("../../../utils/getBlockLabelProps");
-var mixins_1 = require("../../../themes/mixins");
-var useHandleClickOutside_1 = require("../../../utils/customHooks/useHandleClickOutside");
-var useScreenWidth_1 = require("../../../utils/customHooks/useScreenWidth");
-var styled_1 = require("../styled");
-// single_multi
-// static_dynamic
-function DropdownSingle(_a) {
-    var optionsAnchor = _a.optionsAnchor, lightboxHeight = _a.lightboxHeight, lightboxStyle = _a.lightboxStyle, 
-    //to restructure: rename to TYPO = 'SANS_3' or something. which can be overridden
-    selectClassName = _a.selectClassName, //used to override font size in priimary header
-    optionsClassName = _a.optionsClassName, //used to override font size in priimary header
-    //used by filters topbar. this is a hack. find another way
-    disableSelectTextUpdate = _a.disableSelectTextUpdate, selectStyleOverride = _a.selectStyleOverride, valueProp = _a.value, id = _a.id, parentOnChange = _a.onChange, className = _a.className, style = _a.style, readOnly = _a.readOnly, //
-    invert = _a.invert, //
-    optionsFn = _a.optionsFn, optionsProp = _a.options, saveValueAsString = _a.saveValueAsString, // used in tci
-    isTagsStyle = _a.isTagsStyle, selectConfig = _a.selectConfig, label = _a.label, optionsModalLabel = _a.optionsModalLabel, broadcastShowOptions = _a.broadcastShowOptions, 
-    //combobox specific
-    isSearchable = _a.isSearchable, //
-    searchFieldsConfig = _a.searchFieldsConfig, setFilteredOptionsInParent = _a.setFilteredOptions, setSearchStringInParent = _a.setSearchString, searchStringInParent = _a.searchString, genCustomSelectComp = _a.genCustomSelectComp, placeholder = _a.placeholder, //
-    genCreateTagButton = _a.genCreateTagButton, popOutOfOverflowHiddenParent = _a.popOutOfOverflowHiddenParent, S = _a.S, //
-    disabled = _a.disabled, //
-    tagColor = _a.tagColor, observerRef = _a.observerRef, searchbarPlaceholder = _a.searchbarPlaceholder, _b = _a.alignDropdown, alignDropdown = _b === void 0 ? "left" : _b;
-    var theme = (0, styled_components_1.useTheme)();
-    var props = arguments[0];
-    var value = (0, getValue_1.getValue_SINGLE)({ valueProp: valueProp, optionsFn: optionsFn, options: optionsProp, theme: theme, saveValueAsString: saveValueAsString });
-    //1 INIT REFS
-    var _c = (0, useCreateDropdownRefs_1.useCreateDropdownRefs)(), selectRef = _c.selectRef, dropdownRef = _c.dropdownRef;
-    //2 INIT SHOW OPTIONS STATE
-    var _d = (0, useHideShowOptions_1.useHideShowOptions)({
-        broadcastShowOptions: broadcastShowOptions
-    }), showOptions = _d.showOptions, handleHideOptions = _d.handleHideOptions, handleShowOptions = _d.handleShowOptions;
-    var screenWidth = (0, useScreenWidth_1.useScreenWidth)();
-    //3 INIT DD FOCUS CUSTOM HOOK
-    (0, useHandleClickOutside_1.useHandleClickOutside)(dropdownRef, handleHideOptions, { enabled: screenWidth >= (0, mixins_1.getBreakPoint)('sm') });
-    //5 PRIMARY CHANGE HANDLER
-    var handleSelect = function (newVal) {
-        setSearchString('');
-        (0, handlers_1.handleSelect_SINGLE)({
-            id: id,
-            newVal: newVal,
-            // prevVal: value,
-            // hideShowOtherTextInputOnSelect_SINGLE,
-            handleHideOptions: handleHideOptions,
-            saveValueAsString: saveValueAsString,
-            parentOnChange: parentOnChange
-        });
-    };
-    //-- TAG INPUT SPECIFIC
-    var _e = (0, useSearchString_1.useSearchString)({
-        searchStringInParent: searchStringInParent,
-        setSearchStringInParent: setSearchStringInParent
-    }), searchString = _e[0], setSearchString = _e[1];
-    var options = (0, react_1.useMemo)(function () {
-        var ops = (0, generateOptions_1.generateOptions)({
-            options: optionsProp,
-            optionsFn: optionsFn,
-            theme: theme
-        });
-        return (!isSearchable && !isTagsStyle)
-            ? ops
-            : !!observerRef === true //if this exists that means search is being handled on the backend via elastic search
-                ? ops
-                : (0, keywordSearchOptions_1.keywordSearchOptions)({
-                    options: ops,
-                    searchString: searchString,
-                    searchFieldsConfig: searchFieldsConfig,
-                    setFilteredOptionsInParent: setFilteredOptionsInParent,
-                });
-    }, [
-        optionsProp,
-        optionsFn === null || optionsFn === void 0 ? void 0 : optionsFn.fn,
-        optionsFn === null || optionsFn === void 0 ? void 0 : optionsFn.args,
-        searchString
-    ]);
-    var genSelectTagsInput = function (ops) {
-        if (ops === void 0) { ops = {}; }
-        return (react_1.default.createElement(SelectTagsInput_1.SelectTagsInput, { id: id, value: value, invert: invert, handleSelect: handleSelect, searchString: searchString, setSearchString: setSearchString, single_multi: 'single', placeholder: placeholder, S: S, disabled: disabled, showOptions: showOptions, S: S, style: ops.style
-            // forceFocus, comp is expecting this
-         }));
-    };
-    var genInputComp = function () {
-        return (react_1.default.createElement(styled_1.StyledDropdownRefWrapper, { ref: dropdownRef, id: "StyledDropdownRefWrapper" },
-            react_1.default.createElement("div", { ref: selectRef, className: "OKE-Dropdown__Select-wrapper", onClick: disabled ? function () { } : function () {
-                    isTagsStyle
-                        ? !showOptions && handleShowOptions() //if tagsStyle, then click always shows options
-                        : showOptions ? handleHideOptions() : handleShowOptions(); //if dropdowns, then click toggles show/hide
-                } }, isTagsStyle ? genSelectTagsInput() : (react_1.default.createElement(SelectDropdown_1.SelectDropdown, { invert: invert, value: value, placeholder: placeholder, genCustomSelectComp: genCustomSelectComp, selectClassName: selectClassName, selectStyleOverride: selectStyleOverride, showOptions: showOptions, disableSelectTextUpdate: disableSelectTextUpdate, selectConfig: selectConfig, S: S, disabled: disabled }))),
-            react_1.default.createElement(OptionsSingle_1.OptionsSingle, { searchbarPlaceholder: searchbarPlaceholder, observerRef: observerRef, lightboxHeight: lightboxHeight, lightboxStyle: lightboxStyle, optionsAnchor: optionsAnchor, searchString: searchString, setSearchString: setSearchString, id: id, optionsClassName: optionsClassName, label: label, value: value, relativeToRef: selectRef, invert: invert, showOptions: showOptions, handleHideOptions: handleHideOptions, handleSelect: handleSelect, options: options, optionsFn: optionsFn, optionsModalLabel: optionsModalLabel, 
-                //combobox specific
-                isSearchable: isTagsStyle ? false : isSearchable, alignDropdown: alignDropdown, genCreateTagButton: genCreateTagButton, SelectComp: isTagsStyle && genSelectTagsInput({ style: { position: 'sticky', top: 0, zIndex: 1000 } }), S: S, popOutOfOverflowHiddenParent: popOutOfOverflowHiddenParent })));
-    };
-    var genDisplayComp = function () {
-        if (!value)
-            return null;
-        return isTagsStyle ? (react_1.default.createElement(styled_1.StyledTagsInputWrapper, null, (0, genTagComp_1.genTagComp)(id, value, { display: true, invert: invert, theme: theme, color: tagColor }))) : (react_1.default.createElement(DisplayCompSingle_1.DisplayCompSingle, { value: value, invert: invert, S: S }));
-    };
-    return (react_1.default.createElement("div", { className: "OKE-Dropdown ".concat(className, " OKE-Dropdown--").concat(readOnly ? "displayComp" : "inputComp", " ").concat(invert ? "-invert-" : ""), style: style },
-        react_1.default.createElement(BlockLabel_1.BlockLabel, __assign({}, (0, getBlockLabelProps_1.getBlockLabelProps)(props) /** in other words, props. */)),
-        readOnly ? genDisplayComp() : genInputComp()));
-}

package/dist/components/Dropdowns/comps/Caret/index.d.ts

@@ -1,6 +0,0 @@
-export function Caret({ invert, showOptions, disabled }: {
-    invert: any;
-    showOptions: any;
-    disabled: any;
-}): React.JSX.Element;
-import React from "react";

package/dist/components/Dropdowns/comps/Caret/index.js

@@ -1,19 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Caret = void 0;
-var colors_1 = require("../../../../themes/colors");
-var icons_1 = require("../../../../icons");
-var react_1 = __importDefault(require("react"));
-var styled_1 = require("./styled");
-var white = colors_1.colors.white, greyColor100 = colors_1.colors.greyColor100, greyColor40 = colors_1.colors.greyColor40;
-var CaretDown = icons_1.icons.CaretDown, CaretUp = icons_1.icons.CaretUp;
-var Caret = function (_a) {
-    var invert = _a.invert, showOptions = _a.showOptions, disabled = _a.disabled;
-    return (react_1.default.createElement(styled_1.StyledCaret, null,
-        showOptions ? (react_1.default.createElement(CaretUp, { size: 12, color: invert ? white : greyColor100, weight: "bold" })) : (react_1.default.createElement(CaretDown, { size: 12, color: disabled ? greyColor40 : invert ? white : greyColor100, weight: "bold" })),
-        react_1.default.createElement(styled_1.StyledCaretClickArea, null)));
-};
-exports.Caret = Caret;

package/dist/components/Dropdowns/comps/Caret/styled.d.ts

@@ -1,2 +0,0 @@
-export const StyledCaret: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledCaretClickArea: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/Dropdowns/comps/Caret/styled.js

@@ -1,14 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StyledCaretClickArea = exports.StyledCaret = void 0;
-var styled_components_1 = __importDefault(require("styled-components"));
-exports.StyledCaret = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  padding-left: 1rem;\n  display: flex;\n  align-items: center;\n"], ["\n  position: relative;\n  padding-left: 1rem;\n  display: flex;\n  align-items: center;\n"])));
-exports.StyledCaretClickArea = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n"], ["\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n"])));
-var templateObject_1, templateObject_2;

package/dist/components/Dropdowns/comps/DisplayCompSingle/index.d.ts

@@ -1,7 +0,0 @@
-export function DisplayCompSingle({ value, invert, injectComma, S }: {
-    value: any;
-    invert: any;
-    injectComma: any;
-    S: any;
-}): React.JSX.Element;
-import React from "react";

package/dist/components/Dropdowns/comps/DisplayCompSingle/index.js

@@ -1,39 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DisplayCompSingle = void 0;
-var react_1 = __importDefault(require("react"));
-var Typo_1 = require("../../../Typo");
-var OKELink_1 = require("../../../OKELink");
-var genIcon_1 = require("../../utils/genIcon");
-var genLinkOrText_1 = require("../../utils/genLinkOrText");
-var styled_components_1 = require("styled-components");
-var genProfileImg_1 = require("../../utils/genProfileImg");
-var DisplayCompSingle = function (_a) {
-    var value = _a.value, invert = _a.invert, injectComma = _a.injectComma, S = _a.S;
-    var theme = (0, styled_components_1.useTheme)();
-    if (!value)
-        return null;
-    return (react_1.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: '1rem' } },
-        (0, genIcon_1.genIcon)({ icon: value === null || value === void 0 ? void 0 : value.icon, invert: invert, S: S }),
-        (value === null || value === void 0 ? void 0 : value.image) && (0, genProfileImg_1.genProfileImg)(__assign(__assign({}, value), { invert: invert, theme: theme })),
-        (0, genLinkOrText_1.genLinkOrText)(value, function (display, link) { return (react_1.default.createElement(Typo_1.SANS_3, { invert: invert },
-            link
-                ? react_1.default.createElement(OKELink_1.OKELink, { invert: invert, to: link }, display)
-                : display,
-            injectComma && react_1.default.createElement("span", null, ","))); }, { invert: invert })));
-};
-exports.DisplayCompSingle = DisplayCompSingle;

package/dist/components/Dropdowns/comps/NoOptionResultsComp/index.d.ts

@@ -1,4 +0,0 @@
-export function NoOptionResultsComp({ S }: {
-    S: any;
-}): React.JSX.Element;
-import React from "react";

package/dist/components/Dropdowns/comps/NoOptionResultsComp/index.js

@@ -1,15 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NoOptionResultsComp = void 0;
-var react_1 = __importDefault(require("react"));
-var Typo_1 = require("../../../Typo");
-var NoOptionResultsComp = function (_a) {
-    var S = _a.S;
-    var TYPO_COMP = S ? Typo_1.SANS_2 : Typo_1.SANS_3;
-    return (react_1.default.createElement("div", { style: { padding: '1rem 2rem' } },
-        react_1.default.createElement(TYPO_COMP, { italic: true }, "No Results!")));
-};
-exports.NoOptionResultsComp = NoOptionResultsComp;

package/dist/components/Dropdowns/comps/OptionContent/index.d.ts

@@ -1,8 +0,0 @@
-export function OptionContent({ option, optionsClassName, invert, S, observerRef }: {
-    option: any;
-    optionsClassName: any;
-    invert: any;
-    S: any;
-    observerRef: any;
-}): React.JSX.Element;
-import React from "react";

package/dist/components/Dropdowns/comps/OptionContent/index.js

@@ -1,34 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.OptionContent = void 0;
-var react_1 = __importDefault(require("react"));
-var getText_1 = require("../../../../utils/getText");
-var genProfileImg_1 = require("../../utils/genProfileImg");
-var genIcon_1 = require("../../utils/genIcon");
-var Typo_1 = require("../../../Typo");
-var styled_components_1 = require("styled-components");
-var genColor_1 = require("../../utils/genColor");
-var OptionContent = function (_a) {
-    var option = _a.option, optionsClassName = _a.optionsClassName, invert = _a.invert, S = _a.S, observerRef = _a.observerRef;
-    var theme = (0, styled_components_1.useTheme)();
-    var TypoComp = S ? Typo_1.SANS_2 : Typo_1.SANS_3;
-    var image = option.image, display = option.display, icon = option.icon, desc = option.desc, color = option.color;
-    return (react_1.default.createElement("div", { ref: observerRef, style: {
-            display: "flex",
-            alignItems: "flex-start",
-            gap: "1rem",
-            maxWidth: "36rem",
-        } },
-        (image || icon || color) &&
-            react_1.default.createElement("div", { style: { marginTop: desc && '0.2rem', display: 'flex', alignContent: 'center' } },
-                image && (0, genProfileImg_1.genProfileImg)({ image: image, display: display, invert: invert, theme: theme }),
-                icon && (0, genIcon_1.genIcon)({ icon: icon, invert: invert, S: S }),
-                color && (0, genColor_1.genColor)({ color: color })),
-        react_1.default.createElement("div", null,
-            react_1.default.createElement(TypoComp, { invert: invert, semibold: desc ? true : false, className: "OKE-Dropdown__optionText ".concat(optionsClassName || "") }, (0, getText_1.getText)(display)),
-            desc && (react_1.default.createElement(TypoComp, { invert: invert, className: "OKE-Dropdown__optionDesc" }, (0, getText_1.getText)(desc))))));
-};
-exports.OptionContent = OptionContent;

package/dist/components/Dropdowns/comps/OptionsMulti/index.d.ts

@@ -1,28 +0,0 @@
-export function OptionsMulti({ lightboxHeight, lightboxStyle, optionsAnchor, value, id, optionsClassName, relativeToRef, showOptions, handleHideOptions, handleSelect, options, isSearchable, label, optionsModalLabel, searchString, setSearchString, SelectComp, isTagsStyle, genCreateTagButton, invert, setFocusSelectTagsInput, popOutOfOverflowHiddenParent, S, searchbarPlaceholder, alignDropdown }: {
-    lightboxHeight: any;
-    lightboxStyle: any;
-    optionsAnchor: any;
-    value: any;
-    id: any;
-    optionsClassName: any;
-    relativeToRef: any;
-    showOptions: any;
-    handleHideOptions: any;
-    handleSelect: any;
-    options: any;
-    isSearchable: any;
-    label: any;
-    optionsModalLabel: any;
-    searchString: any;
-    setSearchString: any;
-    SelectComp: any;
-    isTagsStyle: any;
-    genCreateTagButton: any;
-    invert: any;
-    setFocusSelectTagsInput: any;
-    popOutOfOverflowHiddenParent: any;
-    S: any;
-    searchbarPlaceholder: any;
-    alignDropdown: any;
-}): React.JSX.Element;
-import React from "react";

package/dist/components/Dropdowns/comps/OptionsMulti/index.js

@@ -1,159 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.OptionsMulti = void 0;
-var react_1 = __importStar(require("react"));
-var OptionsShell_1 = require("../OptionsShell");
-var colors_1 = require("../../../../themes/colors");
-var useSetYOrientation_1 = require("../../utils/useSetYOrientation");
-var useKeyboardControl_1 = require("../../utils/useKeyboardControl");
-var NoOptionResultsComp_1 = require("../NoOptionResultsComp");
-var OptionContent_1 = require("../OptionContent");
-var styled_1 = require("../OptionsSingle/styled");
-var CheckboxButton_1 = require("../../../RadioAndCheckbox/comps/CheckboxList/comps/CheckboxButton");
-var Divider_1 = require("../../../Divider");
-var TextInputs_1 = require("../../../TextInputs");
-var Typo_1 = require("../../../Typo");
-var TextLoader_1 = require("../../../LoadersAndProgress/TextLoader");
-var greyColor40 = colors_1.colors.greyColor40, white = colors_1.colors.white;
-var CheckboxButtonShell = function (_a) {
-    var children = _a.children, isSelected = _a.isSelected, invert = _a.invert;
-    return (react_1.default.createElement("div", { style: {
-            display: "flex",
-            alignItems: "center",
-            position: "relative",
-        } },
-        react_1.default.createElement(react_1.Fragment, null,
-            react_1.default.createElement("div", { className: "OKE-Dropdown__checkboxClickArea" }),
-            react_1.default.createElement(CheckboxButton_1.CheckboxButton, { invert: invert, isSelected: isSelected, className: "OKE-Dropdown__checkboxClickArea-box" })),
-        children));
-};
-var OptionsMulti = function (_a) {
-    var 
-    //from root
-    lightboxHeight = _a.lightboxHeight, lightboxStyle = _a.lightboxStyle, optionsAnchor = _a.optionsAnchor, value = _a.value, id = _a.id, optionsClassName = _a.optionsClassName, 
-    //from Dropdown
-    relativeToRef = _a.relativeToRef, //the element that this lightbox is being rendered against. i.e top or bottom
-    showOptions = _a.showOptions, handleHideOptions = _a.handleHideOptions, handleSelect = _a.handleSelect, options = _a.options, isSearchable = _a.isSearchable, label = _a.label, optionsModalLabel = _a.optionsModalLabel, //label is just a fallback for optionsModalLabel. Don't know why both are needed
-    searchString = _a.searchString, setSearchString = _a.setSearchString, SelectComp = _a.SelectComp, // for mobile
-    isTagsStyle = _a.isTagsStyle, genCreateTagButton = _a.genCreateTagButton, invert = _a.invert, setFocusSelectTagsInput = _a.setFocusSelectTagsInput, popOutOfOverflowHiddenParent = _a.popOutOfOverflowHiddenParent, S = _a.S, searchbarPlaceholder = _a.searchbarPlaceholder, alignDropdown = _a.alignDropdown;
-    //INIT ORIENTATION STATE AND CUSTOM HOOK
-    var optionsRef = (0, react_1.useRef)(null);
-    var yOrientation = (0, useSetYOrientation_1.useSetYOrientation)({
-        showOptions: showOptions,
-        optionsRef: optionsRef,
-        relativeToRef: relativeToRef,
-    }).yOrientation;
-    //RESET SEARCHSTRING WHEN OPTIONS ARE CLOSED
-    (0, react_1.useEffect)(function () {
-        if (!showOptions && !!searchString === true)
-            setSearchString("");
-    }, [showOptions]);
-    var selectedOptions = (0, react_1.useMemo)(function () {
-        return value || [];
-        //we need this to update on optionsProp, cuz when tag is created inTagsInputMulti
-        //opsProp changes.
-        //if we use value as dep, then this will update on every onChange, which we dont want.
-    }, [
-        // showOptions,
-        JSON.stringify(options),
-        value,
-    ]);
-    var _b = (0, useKeyboardControl_1.useKeyboardControl)({
-        showOptions: showOptions,
-        optionsWrapperRef: optionsRef,
-        handleHideOptions: handleHideOptions,
-        handleSelect: handleSelect,
-        options: options,
-        searchString: searchString,
-        id: id,
-    }), scrollFocussedOpIntoView = _b.scrollFocussedOpIntoView, focussedOp = _b.focussedOp;
-    var opIsSelected = function (thisOpData) {
-        return value === null || value === void 0 ? void 0 : value.some(function (d) { return d.value === thisOpData.value; });
-    };
-    var _c = (0, react_1.useState)(true), searchBarFocus = _c[0], setSearchBarFocus = _c[1];
-    (0, react_1.useEffect)(function () {
-        setSearchBarFocus(showOptions);
-    }, [showOptions]);
-    var createOption = function (d) {
-        return isTagsStyle ? (react_1.default.createElement(OptionContent_1.OptionContent, { option: d, optionsClassName: optionsClassName, invert: invert })) : (react_1.default.createElement(CheckboxButtonShell, { invert: invert, isSelected: opIsSelected(d) },
-            react_1.default.createElement(OptionContent_1.OptionContent, { option: d, optionsClassName: optionsClassName, invert: invert, S: S })));
-    };
-    var createSelectedOptions = function () {
-        return (selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.length) > 0 && (react_1.default.createElement("div", { style: {
-                borderBottom: "1px solid ".concat(greyColor40),
-            } },
-            react_1.default.createElement(Typo_1.LABEL, { invert: invert, style: { padding: "2rem", paddingBottom: 0 }, color: colors_1.colors.greyColor70 }, "selected"),
-            selectedOptions.map(function (d) {
-                return (react_1.default.createElement(styled_1.StyledOption, { invert: invert, key: d.value, isSelected: opIsSelected(d), S: S, onClick: function (e) {
-                        if (!d.loading) {
-                            handleSelect(d);
-                            setSearchString("");
-                            setSearchBarFocus(true); //refocus on searchbar after select
-                        }
-                    }, 
-                    //this is important cuz if we dont, then the option will have the light blue background of the 'selected' state
-                    //is a bit hacky, but will do for now.
-                    style: { backgroundColor: invert ? colors_1.colors.greyColor90 : white } }, createOption(d)));
-            })));
-    };
-    var genSearchBar = function () { return (react_1.default.createElement("div", { style: {
-            position: "sticky",
-            top: 0,
-            zIndex: 1,
-            background: invert ? colors_1.colors.greyColor90 : colors_1.colors.white,
-        } },
-        react_1.default.createElement("div", { style: { padding: "1rem" }, onBlur: function () { return setSearchBarFocus(false); }, tabIndex: 0 },
-            react_1.default.createElement(TextInputs_1.TextInput, { placeholder: searchbarPlaceholder, forceFocus: searchBarFocus, invert: invert, type: "text", icon: "MagnifyingGlass", value: searchString, onChange: function (k, v) { return setSearchString(v); }, S: S })),
-        react_1.default.createElement(Divider_1.Divider, { invert: invert }))); };
-    console.log({ options: options });
-    return (react_1.default.createElement(OptionsShell_1.OptionsShell, { ref: optionsRef, yOrientation: yOrientation, lightboxHeight: lightboxHeight, lightboxStyle: lightboxStyle, options: options, optionsAnchor: optionsAnchor, showOptions: showOptions, handleHideOptions: handleHideOptions, SelectComp: SelectComp, label: label, optionsModalLabel: optionsModalLabel, invert: invert, showDoneButton: true, popOutOfOverflowHiddenParent: popOutOfOverflowHiddenParent, relativeToRef: relativeToRef, S: S, alignDropdown: alignDropdown },
-        isSearchable && genSearchBar(),
-        !isTagsStyle && createSelectedOptions(),
-        options.length === 0 ? (react_1.default.createElement(NoOptionResultsComp_1.NoOptionResultsComp, { S: S })) : (options.map(function (d, i) {
-            return (react_1.default.createElement(styled_1.StyledOption, { key: d.value, invert: invert, isSelected: opIsSelected(d), isFocussed: focussedOp === i, className: "OKE-Dropdown__option", ref: function (el) {
-                    return focussedOp === i && el && scrollFocussedOpIntoView(el);
-                }, onClick: function (e) {
-                    if (!d.loading) {
-                        handleSelect(d);
-                        setSearchBarFocus(true);
-                        setSearchString("");
-                        setFocusSelectTagsInput && setFocusSelectTagsInput(true);
-                    }
-                }, S: S }, d.loading ? (react_1.default.createElement(TextLoader_1.TextLoader, { style: { width: "8rem", height: "1.5rem" } })) : (createOption(d))));
-        })),
-        genCreateTagButton && genCreateTagButton(options)));
-};
-exports.OptionsMulti = OptionsMulti;

package/dist/components/Dropdowns/comps/OptionsShell/comps/OptionsAnimateWrapper/index.d.ts

@@ -1,14 +0,0 @@
-export function OptionsAnimateWrapper({ options, optionsRef, relativeToRef, showOptions, invert, yOrientation, fixPos, optionsAnchor, children, lightboxStyle, alignDropdown }: {
-    options: any;
-    optionsRef: any;
-    relativeToRef: any;
-    showOptions: any;
-    invert: any;
-    yOrientation: any;
-    fixPos: any;
-    optionsAnchor: any;
-    children: any;
-    lightboxStyle: any;
-    alignDropdown: any;
-}): React.JSX.Element;
-import React from "react";

package/dist/components/Dropdowns/comps/OptionsShell/comps/OptionsAnimateWrapper/index.js

@@ -1,81 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.OptionsAnimateWrapper = void 0;
-var react_1 = __importStar(require("react"));
-var styled_1 = require("./styled");
-var OptionsAnimateWrapper = function (_a) {
-    var _b;
-    var _c;
-    var options = _a.options, optionsRef = _a.optionsRef, relativeToRef = _a.relativeToRef, showOptions = _a.showOptions, invert = _a.invert, yOrientation = _a.yOrientation, fixPos = _a.fixPos, optionsAnchor = _a.optionsAnchor, children = _a.children, lightboxStyle = _a.lightboxStyle, alignDropdown = _a.alignDropdown;
-    var selectCompRect = (_c = relativeToRef === null || relativeToRef === void 0 ? void 0 : relativeToRef.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect();
-    //we need to recalc when ops length change because, in tag comps, when loading a fixed set of 'loading' options are shown
-    //before the actual number of options are loaded
-    //useMemo wont work cuz it runs before render, and before render ref doesnt exist.
-    var _d = (0, react_1.useState)({
-        width: undefined,
-        openHeight: undefined,
-    }), _e = _d[0], width = _e.width, openHeight = _e.openHeight, setWidthAndOpenHeight = _d[1];
-    (0, react_1.useEffect)(function () {
-        var _a, _b, _c, _d;
-        setWidthAndOpenHeight({
-            width: (_b = (_a = optionsRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width,
-            openHeight: (_d = (_c = optionsRef.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect()) === null || _d === void 0 ? void 0 : _d.height,
-        });
-    }, [options.length]);
-    var viewportWidth = document.documentElement.clientWidth; // excludes scrollbar
-    return (react_1.default.createElement(styled_1.StyledOptionsAnimateWrapper, { invert: invert, isOpen: showOptions, width: width, openHeight: openHeight, style: __assign(__assign(__assign({}, (lightboxStyle || {})), { zIndex: 100000 }), (fixPos
-            ? __assign(__assign({ position: "fixed", top: "".concat(fixPos.y - (yOrientation === "top" ? (selectCompRect === null || selectCompRect === void 0 ? void 0 : selectCompRect.height) || 0 : 0), "px") }, (alignDropdown === "right"
-                ? {
-                    right: "".concat(viewportWidth - fixPos.right, "px")
-                }
-                : {
-                    left: "".concat(fixPos.x, "px")
-                })), (yOrientation === "top" ? { transform: "translateY(-100%)" } : {})) : __assign(__assign({ position: "absolute" }, (optionsAnchor ? (_b = {}, _b[optionsAnchor] = 0, _b) : alignDropdown === "right" ? { right: 0 } : { left: 0 })), (yOrientation === "bottom"
-            ? { bottom: 0, transform: "translateY(100%)" }
-            : { top: 0, transform: "translateY(-100%)" })))) }, children));
-};
-exports.OptionsAnimateWrapper = OptionsAnimateWrapper;

package/dist/components/Dropdowns/comps/OptionsShell/comps/OptionsAnimateWrapper/styled.d.ts

@@ -1,2 +0,0 @@
-/** for lightbox shell */
-export const StyledOptionsAnimateWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;