@trilogy-ds/react 4.0.6 → 4.0.7-SC-beta-2

package/lib/components/select/web/SelectDynamic.js

@@ -1,139 +1,23 @@
-import { __assign, __read, __spreadArray } from "tslib";
+import { __assign } from "tslib";
+import { Input } from '../../../components/input';
+import { useSelectDynamic } from '../../../components/select/web/hooks/useSelectDynamic';
+import { hashClass } from '../../../helpers/hashClassesHelpers';
 import clsx from 'clsx';
-import React, { useCallback, useMemo, useState } from 'react';
+import React from 'react';
 import ReactDOM from 'react-dom';
-import { Input } from '../../../components/input';
-import { useTrilogyContext } from '../../../context/index';
-import { hashClass } from '../../../helpers';
-import { SelectOption } from '../';
 var SelectDynamic = function (_a) {
     var onChange = _a.onChange, disabled = _a.disabled, onFocus = _a.onFocus, onBlur = _a.onBlur, children = _a.children, selected = _a.selected, name = _a.name, id = _a.id, label = _a.label, iconName = _a.iconName, multiple = _a.multiple, className = _a.className;
-    var styled = useTrilogyContext().styled;
-    var _b = __read(React.useState(false), 2), focused = _b[0], setIsFocused = _b[1];
-    var _c = __read(React.useState(selected), 2), selectedValues = _c[0], setSelectedValues = _c[1];
-    var _d = __read(React.useState([]), 2), selectedName = _d[0], setSelectedName = _d[1];
-    var reactId = React.useId();
-    var selectClasses = React.useMemo(function () { return hashClass(styled, clsx('select', className)); }, [styled, className]);
-    var _e = __read(useState(-1), 2), focusedIndex = _e[0], setFocusedIndex = _e[1];
-    var onClickInput = React.useCallback(function () {
-        setIsFocused(function (prev) { return !prev; });
-    }, []);
-    var onKeyPressInput = React.useCallback(function (keyCode) {
-        if (keyCode === 13) {
-            setIsFocused(function (prev) {
-                if (multiple && !prev)
-                    return true;
-                if (multiple && prev)
-                    return prev;
-                return !prev;
-            });
-        }
-    }, [multiple]);
-    var isChecked = useCallback(function (value) {
-        return (multiple && selectedValues && typeof selectedValues !== 'string' && typeof selectedValues !== 'number'
-            ? selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.includes(value)
-            : selectedValues === value);
-    }, [multiple, selectedValues]);
-    var setNewSelectedValues = useCallback(function (_a) {
-        var isChecked = _a.isChecked, children = _a.children, label = _a.label, value = _a.value;
-        var selectedOptions = [];
-        if (isChecked) {
-            setSelectedValues(function (prev) {
-                switch (true) {
-                    case Array.isArray(prev):
-                        setSelectedName(function (prev) { return prev.filter(function (txt) { return ![children, label].includes(txt); }); });
-                        var opts = prev.filter(function (item) { return item !== value; });
-                        selectedOptions.push.apply(selectedOptions, __spreadArray([], __read(opts), false));
-                        return opts;
-                    case !Array.isArray(prev):
-                        setSelectedName([]);
-                        return undefined;
-                    default:
-                        return value;
-                }
-            });
-        }
-        if (!isChecked) {
-            setSelectedValues(function (prev) {
-                if (Array.isArray(prev)) {
-                    var opts = __spreadArray(__spreadArray([], __read(prev), false), [value], false);
-                    selectedOptions.push.apply(selectedOptions, __spreadArray([], __read(opts), false));
-                    return opts;
-                }
-                selectedOptions.push(value);
-                return value;
-            });
-            setSelectedName(function (prev) {
-                if (multiple)
-                    return __spreadArray(__spreadArray([], __read(prev), false), [children || label], false);
-                return [children || label];
-            });
-        }
-        return selectedOptions;
-    }, [multiple]);
-    React.useEffect(function () {
-        var _a;
-        var labelSelected = (_a = React.Children.map(children, function (child) {
-            if (!React.isValidElement(child))
-                return false;
-            var label = child.props.children || child.props.label;
-            switch (true) {
-                case (Array.isArray(selected) && selected.includes(child.props.value)) ||
-                    (!Array.isArray(selected) && child.props.value === selected):
-                    return label;
-                default:
-                    return false;
-            }
-        })) === null || _a === void 0 ? void 0 : _a.filter(function (item) { return item; });
-        labelSelected && setSelectedName(labelSelected);
-        setSelectedValues(selected);
-    }, [selected]);
-    var modal = useMemo(function () { return React.createElement("div", { role: 'presentation', className: 'select-trilogy_modal_open', onClick: function () { return setIsFocused(false); } }); }, []);
-    var options = React.useMemo(function () {
-        return React.Children.map(children, function (child, index) {
-            if (!React.isValidElement(child))
-                return null;
-            var clickEventValue = function (v) {
-                switch (true) {
-                    case (multiple && (selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.includes(child.props.value))) ||
-                        (!multiple && selectedValues === child.props.value):
-                        return undefined;
-                    default:
-                        return v;
-                }
-            };
-            var props = __assign(__assign({}, child.props), { checked: isChecked(child.props.value), focused: focusedIndex === index ? 'true' : undefined, onClick: function () {
-                    var opts = setNewSelectedValues({
-                        children: child.props.children,
-                        label: child.props.label,
-                        value: child.props.value,
-                        isChecked: isChecked(child.props.value),
-                    });
-                    onChange &&
-                        onChange({
-                            selectValue: clickEventValue(child.props.value),
-                            selectName: clickEventValue(child.props.children || child.props.label),
-                            selectId: clickEventValue(child.props.id),
-                            name: clickEventValue(child.props.children || child.props.label),
-                            selectedOptions: opts,
-                        });
-                    if (child.props.onClick)
-                        child.props.onClick();
-                    if (!multiple)
-                        setIsFocused(false);
-                } });
-            return React.createElement(SelectOption, __assign({}, props, { key: "".concat(reactId, "_").concat(index) }));
-        });
-    }, [multiple, selectedValues, focusedIndex, children]);
+    var selectClasses = hashClass(clsx('select', className));
+    var _b = useSelectDynamic({
+        onChange: onChange,
+        children: children,
+        selected: selected,
+        multiple: multiple,
+    }), selectedName = _b.selectedName, onClickInput = _b.onClickInput, focused = _b.focused, modal = _b.modal, options = _b.options, onKeyUp = _b.onKeyUp, onKeyPress = _b.onKeyPress;
     return (React.createElement("div", { className: selectClasses },
-        React.createElement(Input, __assign({ value: selectedName.join(', '), name: name, disabled: disabled, placeholder: label, onFocus: onFocus, iconNameLeft: iconName, onBlur: onBlur, onClick: onClickInput, className: hashClass(styled, clsx(focused && 'focus')), onKeyPress: function (e) {
-                e.preventDefault();
-            }, onKeyUp: function (e) {
-                e.preventDefault();
-                onKeyPressInput(e.inputKeyCode);
-            } }, { readOnly: true, id: id, role: 'combobox' })),
-        focused && React.createElement("ul", { role: "listbox", className: hashClass(styled, clsx('select-options')) }, options),
+        React.createElement(Input, __assign({ defaultValue: selectedName && selectedName.join(', '), value: selectedName && selectedName.join(', '), name: name, disabled: disabled, placeholder: label, onFocus: onFocus, iconNameLeft: iconName, onBlur: onBlur, onClick: onClickInput, className: hashClass(clsx(focused && 'focus')), onKeyPress: onKeyPress, onKeyUp: onKeyUp }, { readOnly: true, id: id, role: 'combobox' })),
+        focused && (React.createElement("ul", { role: 'listbox', className: hashClass(clsx('select-options')) }, options)),
         focused && ReactDOM.createPortal(modal, document.body)));
 };
 export default SelectDynamic;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VsZWN0RHluYW1pYy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc2VsZWN0L3dlYi9TZWxlY3REeW5hbWljLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxFQUFFLEVBQXFCLFdBQVcsRUFBRSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ2hGLE9BQU8sUUFBUSxNQUFNLFdBQVcsQ0FBQTtBQUVoQyxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sb0JBQW9CLENBQUE7QUFFMUMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0saUJBQWlCLENBQUE7QUFDbkQsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sS0FBSyxDQUFBO0FBRWxDLElBQU0sYUFBYSxHQUFHLFVBQUMsRUFhVTtRQVovQixRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixPQUFPLGFBQUEsRUFDUCxNQUFNLFlBQUEsRUFDTixRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixJQUFJLFVBQUEsRUFDSixFQUFFLFFBQUEsRUFDRixLQUFLLFdBQUEsRUFDTCxRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixTQUFTLGVBQUE7SUFFRCxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUNoQyxJQUFBLEtBQUEsT0FBMEIsS0FBSyxDQUFDLFFBQVEsQ0FBVSxLQUFLLENBQUMsSUFBQSxFQUF2RCxPQUFPLFFBQUEsRUFBRSxZQUFZLFFBQWtDLENBQUE7SUFDeEQsSUFBQSxLQUFBLE9BQXNDLEtBQUssQ0FBQyxRQUFRLENBQWdCLFFBQVEsQ0FBQyxJQUFBLEVBQTVFLGNBQWMsUUFBQSxFQUFFLGlCQUFpQixRQUEyQyxDQUFBO0lBQzdF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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VsZWN0RHluYW1pYy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc2VsZWN0L3dlYi9TZWxlY3REeW5hbWljLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLG9CQUFvQixDQUFBO0FBRTFDLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLGdEQUFnRCxDQUFBO0FBQ2pGLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUE0QixNQUFNLE9BQU8sQ0FBQTtBQUNoRCxPQUFPLFFBQVEsTUFBTSxXQUFXLENBQUE7QUFFaEMsSUFBTSxhQUFhLEdBQUcsVUFBQyxFQWFVO1FBWi9CLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLE9BQU8sYUFBQSxFQUNQLE1BQU0sWUFBQSxFQUNOLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLElBQUksVUFBQSxFQUNKLEVBQUUsUUFBQSxFQUNGLEtBQUssV0FBQSxFQUNMLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLFNBQVMsZUFBQTtJQUVULElBQU0sYUFBYSxHQUFHLFNBQVMsQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFFcEQsSUFBQSxLQUErRSxnQkFBZ0IsQ0FBQztRQUNwRyxRQUFRLFVBQUE7UUFDUixRQUFRLFVBQUE7UUFDUixRQUFRLFVBQUE7UUFDUixRQUFRLFVBQUE7S0FDVCxDQUFDLEVBTE0sWUFBWSxrQkFBQSxFQUFFLFlBQVksa0JBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxLQUFLLFdBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxVQUFVLGdCQUs5RSxDQUFBO0lBRUYsT0FBTyxDQUNMLDZCQUFLLFNBQVMsRUFBRSxhQUFhO1FBQzNCLG9CQUFDLEtBQUssYUFDSixZQUFZLEVBQUUsWUFBWSxJQUFJLFlBQVksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEVBQ3JELEtBQUssRUFBRSxZQUFZLElBQUksWUFBWSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsRUFDOUMsSUFBSSxFQUFFLElBQUksRUFDVixRQUFRLEVBQUUsUUFBUSxFQUNsQixXQUFXLEVBQUUsS0FBSyxFQUNsQixPQUFPLEVBQUUsT0FBTyxFQUNoQixZQUFZLEVBQUUsUUFBUSxFQUN0QixNQUFNLEVBQUUsTUFBTSxFQUNkLE9BQU8sRUFBRSxZQUFZLEVBQ3JCLFNBQVMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLE9BQU8sSUFBSSxPQUFPLENBQUMsQ0FBQyxFQUM5QyxVQUFVLEVBQUUsVUFBVSxFQUN0QixPQUFPLEVBQUUsT0FBTyxJQUNaLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRSxFQUFFLElBQUEsRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLEVBQzVDO1FBQ0QsT0FBTyxJQUFJLENBQ1YsNEJBQUksSUFBSSxFQUFDLFNBQVMsRUFBQyxTQUFTLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDLElBQzVELE9BQU8sQ0FDTCxDQUNOO1FBQ0EsT0FBTyxJQUFJLFFBQVEsQ0FBQyxZQUFZLENBQUMsS0FBSyxFQUFFLFFBQVEsQ0FBQyxJQUFJLENBQUMsQ0FDbkQsQ0FDUCxDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBQ0QsZUFBZSxhQUFhLENBQUEifQ==

package/lib/components/select/web/SelectNative.js

@@ -1,45 +1,25 @@
-import { __assign, __read, __rest } from "tslib";
-import clsx from 'clsx';
-import * as React from 'react';
+import { __assign, __rest } from "tslib";
 import { Icon } from '../../../components/icon';
 import { SelectOption } from '../../../components/select';
-import { useTrilogyContext } from '../../../context/index';
+import { useSelectNative } from '../../../components/select/web/hooks/useSelectNative';
 import { hashClass } from '../../../helpers/hashClassesHelpers';
 import { has } from '../../../services/classify';
+import clsx from 'clsx';
+import React from 'react';
 var SelectNative = function (_a) {
     var onChange = _a.onChange, disabled = _a.disabled, onFocus = _a.onFocus, onBlur = _a.onBlur, children = _a.children, selected = _a.selected, name = _a.name, id = _a.id, testId = _a.testId, label = _a.label, iconName = _a.iconName, multiple = _a.multiple, className = _a.className, accessibilityLabel = _a.accessibilityLabel, others = __rest(_a, ["onChange", "disabled", "onFocus", "onBlur", "children", "selected", "name", "id", "testId", "label", "iconName", "multiple", "className", "accessibilityLabel"]);
-    var styled = useTrilogyContext().styled;
-    var _b = __read(React.useState(false), 2), focused = _b[0], setIsFocused = _b[1];
-    var _c = __read(React.useState(selected), 2), selectedValues = _c[0], setSelectedValues = _c[1];
-    var selectClasses = React.useMemo(function () { return hashClass(styled, clsx('select', className)); }, [styled, className]);
-    var controlClass = React.useMemo(function () { return hashClass(styled, clsx('control', has('dynamic-placeholder'), iconName && 'has-icons-left')); }, [styled, iconName]);
-    var handleFocus = React.useCallback(function (e) {
-        setIsFocused(true);
-        onFocus && onFocus(e);
-    }, []);
-    var handleBlur = React.useCallback(function (e) {
-        setIsFocused(false);
-        onBlur && onBlur(e);
-    }, []);
-    React.useEffect(function () {
-        setSelectedValues(selected);
-    }, [selected]);
+    var selectClasses = hashClass(clsx('select', className));
+    var controlClass = hashClass(clsx('control', has('dynamic-placeholder'), iconName && 'has-icons-left'));
+    var _b = useSelectNative({
+        onBlur: onBlur,
+        onChange: onChange,
+        onFocus: onFocus,
+        selected: selected,
+    }), focused = _b.focused, selectedValues = _b.selectedValues, handleFocus = _b.handleFocus, handleBlur = _b.handleBlur, handleChange = _b.handleChange;
     return (React.createElement("div", { className: selectClasses },
-        React.createElement("div", { className: hashClass(styled, clsx('field', focused && 'focus')) },
+        React.createElement("div", { className: hashClass(clsx('field', focused && 'focus')) },
             React.createElement("div", { className: controlClass },
-                React.createElement("select", __assign({ className: hashClass(styled, clsx(!label && 'no-label')), value: selectedValues, "aria-label": accessibilityLabel, "data-testid": testId, onChange: function (e) {
-                        var selectedV = Array.from(e.target.selectedOptions).map(function (select) { return select.value; });
-                        setSelectedValues(selectedV);
-                        if (onChange) {
-                            onChange({
-                                selectValue: e.target.value,
-                                selectName: e.target.name,
-                                selectId: e.target.id,
-                                name: e.target.name,
-                                selectedOptions: selectedV,
-                            });
-                        }
-                    }, onFocus: handleFocus, onBlur: handleBlur, id: id ? String(id) : undefined, name: name, disabled: disabled, role: 'listbox' }, others), React.Children.map(children, function (child) {
+                React.createElement("select", __assign({ className: hashClass(clsx(!label && 'no-label')), value: selectedValues, "aria-label": accessibilityLabel, "data-testid": testId, onChange: handleChange, onFocus: handleFocus, onBlur: handleBlur, id: id ? String(id) : undefined, name: name, disabled: disabled, role: 'listbox' }, others), React.Children.map(children, function (child) {
                     if (!React.isValidElement(child))
                         return null;
                     var props = __assign(__assign({}, child.props), { native: 'true' });
@@ -49,4 +29,4 @@ var SelectNative = function (_a) {
                 iconName && React.createElement(Icon, { name: iconName, size: 'small' })))));
 };
 export default SelectNative;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VsZWN0TmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9zZWxlY3Qvd2ViL1NlbGVjdE5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDeEMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBRWxELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGlCQUFpQixDQUFBO0FBQ25ELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsR0FBRyxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFFekMsSUFBTSxZQUFZLEdBQUcsVUFBQyxFQWdCUjtJQWZaLElBQUEsUUFBUSxjQUFBLEVBQ1IsUUFBUSxjQUFBLEVBQ1IsT0FBTyxhQUFBLEVBQ1AsTUFBTSxZQUFBLEVBQ04sUUFBUSxjQUFBLEVBQ1IsUUFBUSxjQUFBLEVBQ1IsSUFBSSxVQUFBLEVBQ0osRUFBRSxRQUFBLEVBQ0YsTUFBTSxZQUFBLEVBQ04sS0FBSyxXQUFBLEVBQ0wsUUFBUSxjQUFBLEVBQ1IsUUFBUSxjQUFBLEVBQ1IsU0FBUyxlQUFBLEVBQ1Qsa0JBQWtCLHdCQUFBLEVBQ2YsTUFBTSxjQWZXLGlLQWdCckIsQ0FEVTtJQUVELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRWhDLElBQUEsS0FBQSxPQUEwQixLQUFLLENBQUMsUUFBUSxDQUFVLEtBQUssQ0FBQyxJQUFBLEVBQXZELE9BQU8sUUFBQSxFQUFFLFlBQVksUUFBa0MsQ0FBQTtJQUN4RCxJQUFBLEtBQUEsT0FBc0MsS0FBSyxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBQSxF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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2VsZWN0TmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9zZWxlY3Qvd2ViL1NlbGVjdE5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFFbEQsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLCtDQUErQyxDQUFBO0FBQy9FLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsR0FBRyxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDekMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUV6QixJQUFNLFlBQVksR0FBRyxVQUFDLEVBZ0JSO0lBZlosSUFBQSxRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixPQUFPLGFBQUEsRUFDUCxNQUFNLFlBQUEsRUFDTixRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixJQUFJLFVBQUEsRUFDSixFQUFFLFFBQUEsRUFDRixNQUFNLFlBQUEsRUFDTixLQUFLLFdBQUEsRUFDTCxRQUFRLGNBQUEsRUFDUixRQUFRLGNBQUEsRUFDUixTQUFTLGVBQUEsRUFDVCxrQkFBa0Isd0JBQUEsRUFDZixNQUFNLGNBZlcsaUtBZ0JyQixDQURVO0lBRVQsSUFBTSxhQUFhLEdBQUcsU0FBUyxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FBQTtJQUMxRCxJQUFNLFlBQVksR0FBRyxTQUFTLENBQUMsSUFBSSxDQUFDLFNBQVMsRUFBRSxHQUFHLENBQUMscUJBQXFCLENBQUMsRUFBRSxRQUFRLElBQUksZ0JBQWdCLENBQUMsQ0FBQyxDQUFBO0lBRW5HLElBQUEsS0FBcUUsZUFBZSxDQUFDO1FBQ3pGLE1BQU0sUUFBQTtRQUNOLFFBQVEsVUFBQTtRQUNSLE9BQU8sU0FBQTtRQUNQLFFBQVEsVUFBQTtLQUNULENBQUMsRUFMTSxPQUFPLGFBQUEsRUFBRSxjQUFjLG9CQUFBLEVBQUUsV0FBVyxpQkFBQSxFQUFFLFVBQVUsZ0JBQUEsRUFBRSxZQUFZLGtCQUtwRSxDQUFBO0lBRUYsT0FBTyxDQUNMLDZCQUFLLFNBQVMsRUFBRSxhQUFhO1FBQzNCLDZCQUFLLFNBQVMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLE9BQU8sRUFBRSxPQUFPLElBQUksT0FBTyxDQUFDLENBQUM7WUFDMUQsNkJBQUssU0FBUyxFQUFFLFlBQVk7Z0JBQzFCLHlDQUNFLFNBQVMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLENBQUMsS0FBSyxJQUFJLFVBQVUsQ0FBQyxDQUFDLEVBQ2hELEtBQUssRUFBRSxjQUFjLGdCQUNULGtCQUFrQixpQkFDakIsTUFBTSxFQUNuQixRQUFRLEVBQUUsWUFBWSxFQUN0QixPQUFPLEVBQUUsV0FBVyxFQUNwQixNQUFNLEVBQUUsVUFBVSxFQUNsQixFQUFFLEVBQUUsRUFBRSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLFNBQVMsRUFDL0IsSUFBSSxFQUFFLElBQUksRUFDVixRQUFRLEVBQUUsUUFBUSxFQUNsQixJQUFJLEVBQUMsU0FBUyxJQUNWLE1BQU0sR0FFVCxLQUFLLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxRQUFRLEVBQUUsVUFBQyxLQUFLO29CQUNsQyxJQUFJLENBQUMsS0FBSyxDQUFDLGNBQWMsQ0FBQyxLQUFLLENBQUM7d0JBQUUsT0FBTyxJQUFJLENBQUE7b0JBQzdDLElBQU0sS0FBSyx5QkFDTixLQUFLLENBQUMsS0FBSyxLQUNkLE1BQU0sRUFBRSxNQUFNLEdBQ2YsQ0FBQTtvQkFDRCxPQUFPLG9CQUFDLFlBQVksZUFBSyxLQUFLLEVBQUksQ0FBQTtnQkFDcEMsQ0FBQyxDQUFDLENBQ0s7Z0JBQ1IsS0FBSyxJQUFJLENBQUMsUUFBUSxJQUFJLCtCQUFPLE9BQU8sRUFBRSxFQUFFLElBQUcsS0FBSyxDQUFTO2dCQUN6RCxRQUFRLElBQUksb0JBQUMsSUFBSSxJQUFDLElBQUksRUFBRSxRQUFRLEVBQUUsSUFBSSxFQUFDLE9BQU8sR0FBRyxDQUM5QyxDQUNGLENBQ0YsQ0FDUCxDQUFBO0FBQ0gsQ0FBQyxDQUFBO0FBRUQsZUFBZSxZQUFZLENBQUEifQ==

package/lib/components/select/web/hooks/useSelectDynamic.d.ts

@@ -0,0 +1,27 @@
+import { InputKeyboardEvent } from '../../../../components/input';
+import { SelectChangeEvent, SelectChangeEventHandler, SelectedValue } from '../../../../components/select/SelectProps';
+import React from 'react';
+interface IProps<T = SelectChangeEvent> {
+    selected?: SelectedValue;
+    multiple?: boolean;
+    children?: React.ReactNode;
+    onChange?: SelectChangeEventHandler<T>;
+}
+export declare const useSelectDynamic: ({ selected, multiple, children, onChange }: IProps) => {
+    selectedName: any[] | undefined;
+    options: React.JSX.Element[] | null | undefined;
+    onClickInput?: undefined;
+    focused?: undefined;
+    modal?: undefined;
+    onKeyUp?: undefined;
+    onKeyPress?: undefined;
+} | {
+    selectedName: string[];
+    onClickInput: () => void;
+    focused: boolean;
+    modal: React.JSX.Element;
+    options: React.JSX.Element[] | null | undefined;
+    onKeyUp: (event: InputKeyboardEvent) => void;
+    onKeyPress: (event: InputKeyboardEvent) => void;
+};
+export {};

package/lib/components/select/web/hooks/useSelectDynamic.js

@@ -0,0 +1,155 @@
+import { __assign, __read, __spreadArray } from "tslib";
+import { isServer } from '../../../../helpers/isServer';
+import React from 'react';
+import SelectOption from '../../option';
+export var useSelectDynamic = function (_a) {
+    var selected = _a.selected, multiple = _a.multiple, children = _a.children, onChange = _a.onChange;
+    if (isServer) {
+        var optionIsChecked_1 = function (value, selectedValues, multiple) {
+            return multiple && selectedValues && typeof selectedValues !== 'string' && typeof selectedValues !== 'number'
+                ? selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.includes(value)
+                : selectedValues === value;
+        };
+        var createOptions = function (children, selectedValues, focusedIndex, multiple) {
+            return React.Children.map(children, function (child, index) {
+                if (!React.isValidElement(child))
+                    return null;
+                var props = __assign(__assign({}, child.props), { checked: optionIsChecked_1(child.props.value, selectedValues, multiple), focused: focusedIndex === index ? 'true' : undefined });
+                return React.createElement(SelectOption, __assign({}, props));
+            });
+        };
+        return {
+            selectedName: getSelectedName(children, selected),
+            options: createOptions(children, selected, -1),
+        };
+    }
+    var reactId = React.useId();
+    var _b = __read(React.useState(false), 2), focused = _b[0], setIsFocused = _b[1];
+    var _c = __read(React.useState(selected), 2), selectedValues = _c[0], setSelectedValues = _c[1];
+    var _d = __read(React.useState([]), 2), selectedName = _d[0], setSelectedName = _d[1];
+    var _e = __read(React.useState(-1), 2), focusedIndex = _e[0], setFocusedIndex = _e[1];
+    var onKeyPressInput = React.useCallback(function (keyCode) {
+        if (keyCode === 13) {
+            setIsFocused(function (prev) {
+                if (multiple && !prev)
+                    return true;
+                if (multiple && prev)
+                    return prev;
+                return !prev;
+            });
+        }
+    }, [multiple]);
+    var onClickInput = React.useCallback(function () { return setIsFocused(function (prev) { return !prev; }); }, []);
+    var onKeyUp = React.useCallback(function (event) { return onKeyPressInput(event.inputKeyCode); }, [multiple]);
+    var onKeyPress = React.useCallback(function (event) { return event.preventDefault(); }, []);
+    var isChecked = React.useCallback(function (value) {
+        return multiple && selectedValues && typeof selectedValues !== 'string' && typeof selectedValues !== 'number'
+            ? selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.includes(value)
+            : selectedValues === value;
+    }, [multiple, selectedValues]);
+    var setNewSelectedValues = React.useCallback(function (_a) {
+        var isChecked = _a.isChecked, children = _a.children, label = _a.label, value = _a.value;
+        var selectedOptions = [];
+        if (isChecked) {
+            setSelectedValues(function (prev) {
+                switch (true) {
+                    case Array.isArray(prev):
+                        setSelectedName(function (prev) { return prev.filter(function (txt) { return ![children, label].includes(txt); }); });
+                        var opts = prev.filter(function (item) { return item !== value; });
+                        selectedOptions.push.apply(selectedOptions, __spreadArray([], __read(opts), false));
+                        return opts;
+                    case !Array.isArray(prev):
+                        setSelectedName([]);
+                        return undefined;
+                    default:
+                        return value;
+                }
+            });
+        }
+        if (!isChecked) {
+            setSelectedValues(function (prev) {
+                if (Array.isArray(prev)) {
+                    var opts = __spreadArray(__spreadArray([], __read(prev), false), [value], false);
+                    selectedOptions.push.apply(selectedOptions, __spreadArray([], __read(opts), false));
+                    return opts;
+                }
+                selectedOptions.push(value);
+                return value;
+            });
+            setSelectedName(function (prev) {
+                if (multiple)
+                    return __spreadArray(__spreadArray([], __read(prev), false), [children || label], false);
+                return [children || label];
+            });
+        }
+        return selectedOptions;
+    }, [multiple]);
+    var options = React.useMemo(function () {
+        return React.Children.map(children, function (child, index) {
+            if (!React.isValidElement(child))
+                return null;
+            var clickEventValue = function (v) {
+                switch (true) {
+                    case (multiple && (selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.includes(child.props.value))) ||
+                        (!multiple && selectedValues === child.props.value):
+                        return undefined;
+                    default:
+                        return v;
+                }
+            };
+            var props = __assign(__assign({}, child.props), { checked: isChecked(child.props.value), focused: focusedIndex === index ? 'true' : undefined, onClick: function () {
+                    var opts = setNewSelectedValues({
+                        children: child.props.children,
+                        label: child.props.label,
+                        value: child.props.value,
+                        isChecked: isChecked(child.props.value),
+                    });
+                    onChange &&
+                        onChange({
+                            selectValue: clickEventValue(child.props.value),
+                            selectName: clickEventValue(child.props.children || child.props.label),
+                            selectId: clickEventValue(child.props.id),
+                            name: clickEventValue(child.props.children || child.props.label),
+                            selectedOptions: opts,
+                        });
+                    if (child.props.onClick)
+                        child.props.onClick();
+                    if (!multiple)
+                        setIsFocused(false);
+                } });
+            return React.createElement(SelectOption, __assign({}, props, { key: "".concat(reactId, "_").concat(index) }));
+        });
+    }, [multiple, selectedValues, focusedIndex, children]);
+    var modal = React.useMemo(function () { return React.createElement("div", { role: 'presentation', className: 'select-trilogy_modal_open', onClick: function () { return setIsFocused(false); } }); }, []);
+    React.useEffect(function () {
+        var labelSelected = getSelectedName(children, selected);
+        labelSelected && setSelectedName(labelSelected);
+        setSelectedValues(selected);
+    }, [selected]);
+    return {
+        selectedName: selectedName,
+        onClickInput: onClickInput,
+        focused: focused,
+        modal: modal,
+        options: options,
+        onKeyUp: onKeyUp,
+        onKeyPress: onKeyPress,
+    };
+};
+var getSelectedName = function (children, selected) {
+    var _a;
+    var labelSelected = (_a = React.Children.map(children, function (child) {
+        if (!React.isValidElement(child))
+            return false;
+        var label = child.props.children || child.props.label;
+        switch (true) {
+            case (Array.isArray(selected) && selected.includes(child.props.value)) ||
+                (!Array.isArray(selected) && child.props.value === selected):
+                return label;
+            default:
+                return false;
+        }
+    })) === null || _a === void 0 ? void 0 : _a.filter(function (item) { return item; });
+    return labelSelected;
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlU2VsZWN0RHluYW1pYy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc2VsZWN0L3dlYi9ob29rcy91c2VTZWxlY3REeW5hbWljLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBRUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLG9CQUFvQixDQUFBO0FBQzdDLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUN6QixPQUFPLFlBQVksTUFBTSxjQUFjLENBQUE7QUFTdkMsTUFBTSxDQUFDLElBQU0sZ0JBQWdCLEdBQUcsVUFBQyxFQUFrRDtRQUFoRCxRQUFRLGNBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxRQUFRLGNBQUE7SUFDdkUsSUFBSSxRQUFRLEVBQUU7UUFDWixJQUFNLGlCQUFlLEdBQUcsVUFBQyxLQUFhLEVBQUUsY0FBNkIsRUFBRSxRQUFrQjtZQUN2RixPQUFBLFFBQVEsSUFBSSxjQUFjLElBQUksT0FBTyxjQUFjLEtBQUssUUFBUSxJQUFJLE9BQU8sY0FBYyxLQUFLLFFBQVE7Z0JBQ3BHLENBQUMsQ0FBQyxjQUFjLGFBQWQsY0FBYyx1QkFBZCxjQUFjLENBQUUsUUFBUSxDQUFDLEtBQUssQ0FBQztnQkFDakMsQ0FBQyxDQUFDLGNBQWMsS0FBSyxLQUFLO1FBRjVCLENBRTRCLENBQUE7UUFFOUIsSUFBTSxhQUFhLEdBQUcsVUFDcEIsUUFBeUIsRUFDekIsY0FBNkIsRUFDN0IsWUFBb0IsRUFDcEIsUUFBa0I7WUFFbEIsT0FBQSxLQUFLLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxRQUFRLEVBQUUsVUFBQyxLQUFLLEVBQUUsS0FBSztnQkFDeEMsSUFBSSxDQUFDLEtBQUssQ0FBQyxjQUFjLENBQUMsS0FBSyxDQUFDO29CQUFFLE9BQU8sSUFBSSxDQUFBO2dCQUU3QyxJQUFNLEtBQUsseUJBQ04sS0FBSyxDQUFDLEtBQUssS0FDZCxPQUFPLEVBQUUsaUJB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

package/lib/components/select/web/hooks/useSelectNative.d.ts

@@ -0,0 +1,22 @@
+import { ParamEventSelectFocus, SelectChangeEventHandler, SelectedValue } from '../../../../components/select/SelectProps';
+import React from 'react';
+interface IParams {
+    selected?: SelectedValue;
+    onFocus?: (event: ParamEventSelectFocus) => void;
+    onBlur?: (event: unknown) => void;
+    onChange?: SelectChangeEventHandler;
+}
+export declare const useSelectNative: ({ onBlur, onFocus, onChange, selected }: IParams) => {
+    focused: boolean;
+    selectedValues: SelectedValue;
+    handleFocus?: undefined;
+    handleBlur?: undefined;
+    handleChange?: undefined;
+} | {
+    focused: boolean;
+    selectedValues: string | number | string[] | undefined;
+    handleFocus: (e: ParamEventSelectFocus) => void;
+    handleBlur: (e: ParamEventSelectFocus) => void;
+    handleChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
+};
+export {};

package/lib/components/select/web/hooks/useSelectNative.js

@@ -0,0 +1,37 @@
+import { __read } from "tslib";
+import { isServer } from '../../../../helpers/isServer';
+import React from 'react';
+export var useSelectNative = function (_a) {
+    var onBlur = _a.onBlur, onFocus = _a.onFocus, onChange = _a.onChange, selected = _a.selected;
+    if (isServer) {
+        return { focused: false, selectedValues: selected };
+    }
+    var _b = __read(React.useState(false), 2), focused = _b[0], setIsFocused = _b[1];
+    var _c = __read(React.useState(selected), 2), selectedValues = _c[0], setSelectedValues = _c[1];
+    var handleFocus = React.useCallback(function (e) {
+        setIsFocused(true);
+        onFocus && onFocus(e);
+    }, []);
+    var handleBlur = React.useCallback(function (e) {
+        setIsFocused(false);
+        onBlur && onBlur(e);
+    }, []);
+    var handleChange = React.useCallback(function (e) {
+        var selectedV = Array.from(e.target.selectedOptions).map(function (select) { return select.value; });
+        setSelectedValues(selectedV);
+        if (onChange) {
+            onChange({
+                selectValue: e.target.value,
+                selectName: e.target.name,
+                selectId: e.target.id,
+                name: e.target.name,
+                selectedOptions: selectedV,
+            });
+        }
+    }, [onChange]);
+    React.useEffect(function () {
+        setSelectedValues(selected);
+    }, [selected]);
+    return { focused: focused, selectedValues: selectedValues, handleFocus: handleFocus, handleBlur: handleBlur, handleChange: handleChange };
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlU2VsZWN0TmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vY29tcG9uZW50cy9zZWxlY3Qvd2ViL2hvb2tzL3VzZVNlbGVjdE5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUNBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQTtBQUM3QyxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFTekIsTUFBTSxDQUFDLElBQU0sZUFBZSxHQUFHLFVBQUMsRUFBZ0Q7UUFBOUMsTUFBTSxZQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBO0lBQ25FLElBQUksUUFBUSxFQUFFO1FBQ1osT0FBTyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsY0FBYyxFQUFFLFFBQVEsRUFBRSxDQUFBO0tBQ3BEO0lBRUssSUFBQSxLQUFBLE9BQTBCLEtBQUssQ0FBQyxRQUFRLENBQVUsS0FBSyxDQUFDLElBQUEsRUFBdkQsT0FBTyxRQUFBLEVBQUUsWUFBWSxRQUFrQyxDQUFBO0lBQ3hELElBQUEsS0FBQSxPQUFzQyxLQUFLLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFBLEVBQTdELGNBQWMsUUFBQSxFQUFFLGlCQUFpQixRQUE0QixDQUFBO0lBRXBFLElBQU0sV0FBVyxHQUFHLEtBQUssQ0FBQyxXQUFXLENBQUMsVUFBQyxDQUF3QjtRQUM3RCxZQUFZLENBQUMsSUFBSSxDQUFDLENBQUE7UUFDbEIsT0FBTyxJQUFJLE9BQU8sQ0FBQyxDQUFDLENBQUMsQ0FBQTtJQUN2QixDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUE7SUFFTixJQUFNLFVBQVUsR0FBRyxLQUFLLENBQUMsV0FBVyxDQUFDLFVBQUMsQ0FBd0I7UUFDNUQsWUFBWSxDQUFDLEtBQUssQ0FBQyxDQUFBO1FBQ25CLE1BQU0sSUFBSSxNQUFNLENBQUMsQ0FBQyxDQUFDLENBQUE7SUFDckIsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFBO0lBRU4sSUFBTSxZQUFZLEdBQUcsS0FBSyxDQUFDLFdBQVcsQ0FDcEMsVUFBQyxDQUF1QztRQUN0QyxJQUFNLFNBQVMsR0FBRyxLQUFLLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsZUFBZSxDQUFDLENBQUMsR0FBRyxDQUFDLFVBQUMsTUFBTSxJQUFLLE9BQUEsTUFBTSxDQUFDLEtBQUssRUFBWixDQUFZLENBQUMsQ0FBQTtRQUNwRixpQkFBaUIsQ0FBQyxTQUFTLENBQUMsQ0FBQTtRQUM1QixJQUFJLFFBQVEsRUFBRTtZQUNaLFFBQVEsQ0FBQztnQkFDUCxXQUFXLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxLQUFLO2dCQUMzQixVQUFVLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxJQUFJO2dCQUN6QixRQUFRLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxFQUFFO2dCQUNyQixJQUFJLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxJQUFJO2dCQUNuQixlQUFlLEVBQUUsU0FBUzthQUMzQixDQUFDLENBQUE7U0FDSDtJQUNILENBQUMsRUFDRCxDQUFDLFFBQVEsQ0FBQyxDQUNYLENBQUE7SUFFRCxLQUFLLENBQUMsU0FBUyxDQUFDO1FBQ2QsaUJBQWlCLENBQUMsUUFBUSxDQUFDLENBQUE7SUFDN0IsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQTtJQUNkLE9BQU8sRUFBRSxPQUFPLFNBQUEsRUFBRSxjQUFjLGdCQUFBLEVBQUUsV0FBVyxhQUFBLEVBQUUsVUFBVSxZQUFBLEVBQUUsWUFBWSxjQUFBLEVBQUUsQ0FBQTtBQUMzRSxDQUFDLENBQUEifQ==

package/lib/components/select/web/index.d.ts

@@ -1,2 +1,2 @@
-export { default as SelectDynamic } from './SelectDynamic';
-export { default as SelectNative } from './SelectNative';
+export { default as SelectDynamic } from '../../../components/select/web/SelectDynamic';
+export { default as SelectNative } from '../../../components/select/web/SelectNative';

package/lib/components/select/web/index.js

@@ -1,3 +1,3 @@
-export { default as SelectDynamic } from './SelectDynamic';
-export { default as SelectNative } from './SelectNative';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3NlbGVjdC93ZWIvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sSUFBSSxhQUFhLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQTtBQUMxRCxPQUFPLEVBQUUsT0FBTyxJQUFJLFlBQVksRUFBRSxNQUFNLGdCQUFnQixDQUFBIn0=
+export { default as SelectDynamic } from '../../../components/select/web/SelectDynamic';
+export { default as SelectNative } from '../../../components/select/web/SelectNative';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3NlbGVjdC93ZWIvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sSUFBSSxhQUFhLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQTtBQUNoRixPQUFPLEVBQUUsT0FBTyxJQUFJLFlBQVksRUFBRSxNQUFNLHNDQUFzQyxDQUFBIn0=

package/lib/components/spacer/Spacer.js

@@ -1,7 +1,6 @@
-import * as React from 'react';
 import { hashClass } from '../../helpers';
 import clsx from 'clsx';
-import { useTrilogyContext } from '../../context';
+import * as React from 'react';
 /**
  * Spacer Component
  * @param size {SpacerSize} ONE | TWO | THREE | FOUR | FIVE | SIX | SEVEN | EIGHT
@@ -9,15 +8,14 @@ import { useTrilogyContext } from '../../context';
  */
 var Spacer = function (_a) {
     var size = _a.size, horizontal = _a.horizontal, className = _a.className, id = _a.id;
-    var styled = useTrilogyContext().styled;
     var styles = {
         spacer: {
             marginLeft: horizontal ? "".concat(size, "px") : '0px',
             marginTop: !horizontal ? "".concat(size, "px") : '0px',
         },
     };
-    var classes = hashClass(styled, clsx(className));
+    var classes = hashClass(clsx(className));
     return React.createElement("div", { id: id, style: styles.spacer, className: classes });
 };
 export default Spacer;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3BhY2VyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9zcGFjZXIvU3BhY2VyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFFN0M7Ozs7R0FJRztBQUNILElBQU0sTUFBTSxHQUFHLFVBQUMsRUFBZ0Q7UUFBOUMsSUFBSSxVQUFBLEVBQUUsVUFBVSxnQkFBQSxFQUFFLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQTtJQUN2QyxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLE1BQU0sR0FBRztRQUNiLE1BQU0sRUFBRTtZQUNOLFVBQVUsRUFBRSxVQUFVLENBQUMsQ0FBQyxDQUFDLFVBQUcsSUFBSSxPQUFJLENBQUMsQ0FBQyxDQUFDLEtBQUs7WUFDNUMsU0FBUyxFQUFFLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxVQUFHLElBQUksT0FBSSxDQUFDLENBQUMsQ0FBQyxLQUFLO1NBQzdDO0tBQ0YsQ0FBQTtJQUNELElBQU0sT0FBTyxHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFFbEQsT0FBTyw2QkFBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLEtBQUssRUFBRSxNQUFNLENBQUMsTUFBTSxFQUFFLFNBQVMsRUFBRSxPQUFPLEdBQUksQ0FBQTtBQUNsRSxDQUFDLENBQUE7QUFFRCxlQUFlLE1BQU0sQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3BhY2VyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9zcGFjZXIvU3BhY2VyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUc5Qjs7OztHQUlHO0FBQ0gsSUFBTSxNQUFNLEdBQUcsVUFBQyxFQUFnRDtRQUE5QyxJQUFJLFVBQUEsRUFBRSxVQUFVLGdCQUFBLEVBQUUsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBO0lBQy9DLElBQU0sTUFBTSxHQUFHO1FBQ2IsTUFBTSxFQUFFO1lBQ04sVUFBVSxFQUFFLFVBQVUsQ0FBQyxDQUFDLENBQUMsVUFBRyxJQUFJLE9BQUksQ0FBQyxDQUFDLENBQUMsS0FBSztZQUM1QyxTQUFTLEVBQUUsQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLFVBQUcsSUFBSSxPQUFJLENBQUMsQ0FBQyxDQUFDLEtBQUs7U0FDN0M7S0FDRixDQUFBO0lBQ0QsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFBO0lBRTFDLE9BQU8sNkJBQUssRUFBRSxFQUFFLEVBQUUsRUFBRSxLQUFLLEVBQUUsTUFBTSxDQUFDLE1BQU0sRUFBRSxTQUFTLEVBQUUsT0FBTyxHQUFJLENBQUE7QUFDbEUsQ0FBQyxDQUFBO0FBRUQsZUFBZSxNQUFNLENBQUEifQ==

package/lib/components/stepper/Stepper.d.ts

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import { StepperProps } from './StepperProps';
+import { StepperProps } from '../../components/stepper/StepperProps';
+import React from 'react';
 /**
  * Stepper Component
  * @param centered Center the stepper