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

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

@@ -0,0 +1,156 @@
+import { __assign, __read, __spreadArray } from "tslib";
+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;
+    try {
+        var reactId_1 = React.useId();
+        var _b = __read(React.useState(false), 2), focused = _b[0], setIsFocused_1 = _b[1];
+        var _c = __read(React.useState(selected), 2), selectedValues_1 = _c[0], setSelectedValues_1 = _c[1];
+        var _d = __read(React.useState([]), 2), selectedName = _d[0], setSelectedName_1 = _d[1];
+        var _e = __read(React.useState(-1), 2), focusedIndex_1 = _e[0], setFocusedIndex = _e[1];
+        var onKeyPressInput_1 = React.useCallback(function (keyCode) {
+            if (keyCode === 13) {
+                setIsFocused_1(function (prev) {
+                    if (multiple && !prev)
+                        return true;
+                    if (multiple && prev)
+                        return prev;
+                    return !prev;
+                });
+            }
+        }, [multiple]);
+        var onClickInput = React.useCallback(function () { return setIsFocused_1(function (prev) { return !prev; }); }, []);
+        var onKeyUp = React.useCallback(function (event) { return onKeyPressInput_1(event.inputKeyCode); }, [multiple]);
+        var onKeyPress = React.useCallback(function (event) { return event.preventDefault(); }, []);
+        var isChecked_1 = React.useCallback(function (value) {
+            return multiple && selectedValues_1 && typeof selectedValues_1 !== 'string' && typeof selectedValues_1 !== 'number'
+                ? selectedValues_1 === null || selectedValues_1 === void 0 ? void 0 : selectedValues_1.includes(value)
+                : selectedValues_1 === value;
+        }, [multiple, selectedValues_1]);
+        var setNewSelectedValues_1 = React.useCallback(function (_a) {
+            var isChecked = _a.isChecked, children = _a.children, label = _a.label, value = _a.value;
+            var selectedOptions = [];
+            if (isChecked) {
+                setSelectedValues_1(function (prev) {
+                    switch (true) {
+                        case Array.isArray(prev):
+                            setSelectedName_1(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_1([]);
+                            return undefined;
+                        default:
+                            return value;
+                    }
+                });
+            }
+            if (!isChecked) {
+                setSelectedValues_1(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_1(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_1 === null || selectedValues_1 === void 0 ? void 0 : selectedValues_1.includes(child.props.value))) ||
+                            (!multiple && selectedValues_1 === child.props.value):
+                            return undefined;
+                        default:
+                            return v;
+                    }
+                };
+                var props = __assign(__assign({}, child.props), { checked: isChecked_1(child.props.value), focused: focusedIndex_1 === index ? 'true' : undefined, onClick: function () {
+                        var opts = setNewSelectedValues_1({
+                            children: child.props.children,
+                            label: child.props.label,
+                            value: child.props.value,
+                            isChecked: isChecked_1(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_1(false);
+                    } });
+                return React.createElement(SelectOption, __assign({}, props, { key: "".concat(reactId_1, "_").concat(index) }));
+            });
+        }, [multiple, selectedValues_1, focusedIndex_1, children]);
+        var modal = React.useMemo(function () { return React.createElement("div", { role: 'presentation', className: 'select-trilogy_modal_open', onClick: function () { return setIsFocused_1(false); } }); }, []);
+        React.useEffect(function () {
+            var labelSelected = getSelectedName(children, selected);
+            labelSelected && setSelectedName_1(labelSelected);
+            setSelectedValues_1(selected);
+        }, [selected]);
+        return {
+            selectedName: selectedName,
+            onClickInput: onClickInput,
+            focused: focused,
+            modal: modal,
+            options: options,
+            onKeyUp: onKeyUp,
+            onKeyPress: onKeyPress,
+        };
+    }
+    catch (_f) {
+        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 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,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlU2VsZWN0RHluYW1pYy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc2VsZWN0L3dlYi9ob29rcy91c2VTZWxlY3REeW5hbWljLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBRUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQ3pCLE9BQU8sWUFBWSxNQUFNLGNBQWMsQ0FBQTtBQVN2QyxNQUFNLENBQUMsSUFBTSxnQkFBZ0IsR0FBRyxVQUFDLEVBQWtEO1FBQWhELFFBQVEsY0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFFBQVEsY0FBQTtJQUN2RSxJQUFJO1FBQ0YsSUFBTSxTQUFPLEdBQUcsS0FBSyxDQUFDLEtBQUssRUFBRSxDQUFBO1FBQ3ZCLElBQUEsS0FBQSxPQUEwQixLQUFLLENBQUMsUUFBUSxDQUFVLEtBQUssQ0FBQyxJQUFBLEVBQXZELE9BQU8sUUFBQSxFQUFFLGNBQVksUUFBa0MsQ0FBQTtRQUN4RCxJQUFBLEtBQUEsT0FBc0MsS0FBSyxDQUFDLFFBQVEsQ0FBZ0IsUUFBUSxDQUFDLElBQUEsRUFBNUUsZ0JBQWMsUUFBQSxFQUFFLG1CQUFpQixRQUEyQyxDQUFBO1FBQzdFLElBQUEsS0FBQSxPQUFrQyxLQUFLLENBQUMsUUFBUSxDQUFXLEVBQUUsQ0FBQyxJQUFBLEVBQTdELFlBQVksUUFBQSxFQUFFLGlCQUFlLFFBQWdDLENBQUE7UUFDOUQsSUFBQSxLQUFBLE9BQWtDLEtBQUssQ0FBQyxRQUFRLENBQVMsQ0FBQyxDQUFDLENBQUMsSUFBQSxFQUEzRCxjQUFZLFFBQUEsRUFBRSxlQUFlLFFBQThCLENBQUE7UUFFbEUsSUFBTSxpQkFBZSxHQUFHLEtBQUssQ0FBQyxXQUFXLENBQ3ZDLFVBQUMsT0FBZTtZQUNkLElBQUksT0FBTyxLQUFLLEVBQUUsRUFBRTtnQkFDbEIsY0FBWSxDQUFDLFVBQUMsSUFBSTtvQkFDaEIsSUFBSSxRQUFRLElBQUks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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: string | number | string[] | undefined;
+    handleFocus: (e: ParamEventSelectFocus) => void;
+    handleBlur: (e: ParamEventSelectFocus) => void;
+    handleChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
+} | {
+    focused: boolean;
+    selectedValues: SelectedValue;
+    handleFocus?: undefined;
+    handleBlur?: undefined;
+    handleChange?: undefined;
+};
+export {};

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

@@ -0,0 +1,38 @@
+import { __read } from "tslib";
+import React from 'react';
+export var useSelectNative = function (_a) {
+    var onBlur = _a.onBlur, onFocus = _a.onFocus, onChange = _a.onChange, selected = _a.selected;
+    try {
+        var _b = __read(React.useState(false), 2), focused = _b[0], setIsFocused_1 = _b[1];
+        var _c = __read(React.useState(selected), 2), selectedValues = _c[0], setSelectedValues_1 = _c[1];
+        var handleFocus = React.useCallback(function (e) {
+            setIsFocused_1(true);
+            onFocus && onFocus(e);
+        }, []);
+        var handleBlur = React.useCallback(function (e) {
+            setIsFocused_1(false);
+            onBlur && onBlur(e);
+        }, []);
+        var handleChange = React.useCallback(function (e) {
+            var selectedV = Array.from(e.target.selectedOptions).map(function (select) { return select.value; });
+            setSelectedValues_1(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_1(selected);
+        }, [selected]);
+        return { focused: focused, selectedValues: selectedValues, handleFocus: handleFocus, handleBlur: handleBlur, handleChange: handleChange };
+    }
+    catch (_d) {
+        return { focused: false, selectedValues: selected };
+    }
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlU2VsZWN0TmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vY29tcG9uZW50cy9zZWxlY3Qvd2ViL2hvb2tzL3VzZVNlbGVjdE5hdGl2ZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUNBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQVN6QixNQUFNLENBQUMsSUFBTSxlQUFlLEdBQUcsVUFBQyxFQUFnRDtRQUE5QyxNQUFNLFlBQUEsRUFBRSxPQUFPLGFBQUEsRUFBRSxRQUFRLGNBQUEsRUFBRSxRQUFRLGNBQUE7SUFDbkUsSUFBSTtRQUNJLElBQUEsS0FBQSxPQUEwQixLQUFLLENBQUMsUUFBUSxDQUFVLEtBQUssQ0FBQyxJQUFBLEVBQXZELE9BQU8sUUFBQSxFQUFFLGNBQVksUUFBa0MsQ0FBQTtRQUN4RCxJQUFBLEtBQUEsT0FBc0MsS0FBSyxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBQSxFQUE3RCxjQUFjLFFBQUEsRUFBRSxtQkFBaUIsUUFBNEIsQ0FBQTtRQUVwRSxJQUFNLFdBQVcsR0FBRyxLQUFLLENBQUMsV0FBVyxDQUFDLFVBQUMsQ0FBd0I7WUFDN0QsY0FBWSxDQUFDLElBQUksQ0FBQyxDQUFBO1lBQ2xCLE9BQU8sSUFBSSxPQUFPLENBQUMsQ0FBQyxDQUFDLENBQUE7UUFDdkIsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFBO1FBRU4sSUFBTSxVQUFVLEdBQUcsS0FBSyxDQUFDLFdBQVcsQ0FBQyxVQUFDLENBQXdCO1lBQzVELGNBQVksQ0FBQyxLQUFLLENBQUMsQ0FBQTtZQUNuQixNQUFNLElBQUksTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFBO1FBQ3JCLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQTtRQUVOLElBQU0sWUFBWSxHQUFHLEtBQUssQ0FBQyxXQUFXLENBQ3BDLFVBQUMsQ0FBdUM7WUFDdEMsSUFBTSxTQUFTLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLGVBQWUsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxVQUFDLE1BQU0sSUFBSyxPQUFBLE1BQU0sQ0FBQyxLQUFLLEVBQVosQ0FBWSxDQUFDLENBQUE7WUFDcEYsbUJBQWlCLENBQUMsU0FBUyxDQUFDLENBQUE7WUFDNUIsSUFBSSxRQUFRLEVBQUU7Z0JBQ1osUUFBUSxDQUFDO29CQUNQLFdBQVcsRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLEtBQUs7b0JBQzNCLFVBQVUsRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLElBQUk7b0JBQ3pCLFFBQVEsRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLEVBQUU7b0JBQ3JCLElBQUksRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLElBQUk7b0JBQ25CLGVBQWUsRUFBRSxTQUFTO2lCQUMzQixDQUFDLENBQUE7YUFDSDtRQUNILENBQUMsRUFDRCxDQUFDLFFBQVEsQ0FBQyxDQUNYLENBQUE7UUFFRCxLQUFLLENBQUMsU0FBUyxDQUFDO1lBQ2QsbUJBQWlCLENBQUMsUUFBUSxDQUFDLENBQUE7UUFDN0IsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQTtRQUNkLE9BQU8sRUFBRSxPQUFPLFNBQUEsRUFBRSxjQUFjLGdCQUFBLEVBQUUsV0FBVyxhQUFBLEVBQUUsVUFBVSxZQUFBLEVBQUUsWUFBWSxjQUFBLEVBQUUsQ0FBQTtLQUMxRTtJQUFDLFdBQU07UUFDTixPQUFPLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxjQUFjLEVBQUUsUUFBUSxFQUFFLENBQUE7S0FDcEQ7QUFDSCxDQUFDLENBQUEifQ==

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

package/lib/components/stepper/Stepper.js

@@ -1,9 +1,9 @@
-import { __assign, __read, __rest } from "tslib";
-import * as React from 'react';
-import clsx from 'clsx';
-import { hashClass } from '../../helpers';
-import { useTrilogyContext } from '../../context';
+import { __assign, __rest } from "tslib";
+import { useStepper } from '../../components/stepper/hooks/useStepper';
 import { Text } from '../../components/text';
+import { hashClass } from '../../helpers/hashClassesHelpers';
+import clsx from 'clsx';
+import React from 'react';
 /**
  * Stepper Component
  * @param centered Center the stepper
@@ -13,42 +13,15 @@ import { Text } from '../../components/text';
  */
 var Stepper = function (_a) {
     var className = _a.className, id = _a.id, children = _a.children, others = __rest(_a, ["className", "id", "children"]);
-    var styled = useTrilogyContext().styled;
-    var classes = hashClass(styled, clsx('stepper-wrapper', className));
-    var _b = __read(React.useState(1), 2), currentStep = _b[0], setCurrentStep = _b[1];
-    var nbChild = React.useMemo(function () {
-        if (children && Array.isArray(children))
-            return children.length;
-        if (children && !Array.isArray(children))
-            return 1;
-        return 0;
-    }, [children]);
-    React.useEffect(function () {
-        if (children) {
-            if (Array.isArray(children)) {
-                var haveCurrentStep_1 = false;
-                children.map(function (child, index) {
-                    var _a;
-                    if ((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.current) {
-                        haveCurrentStep_1 = true;
-                        setCurrentStep(index + 1);
-                    }
-                });
-                if (!haveCurrentStep_1)
-                    setCurrentStep(1);
-            }
-            else {
-                setCurrentStep(1);
-            }
-        }
-    }, [children]);
+    var classes = hashClass(clsx('stepper-wrapper', className));
+    var _b = useStepper({ children: children }), currentStep = _b.currentStep, nbChild = _b.nbChild;
     return (React.createElement("div", __assign({ id: id, className: classes }, others),
         children,
-        React.createElement("div", { className: "step-count" },
+        React.createElement("div", { className: 'step-count' },
             React.createElement(Text, null,
                 currentStep,
                 "/",
                 nbChild))));
 };
 export default Stepper;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcHBlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9TdGVwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBRXZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUV4Qzs7Ozs7O0dBTUc7QUFDSCxJQUFNLE9BQU8sR0FBRyxVQUFDLEVBQW9EO0lBQWxELElBQUEsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUssTUFBTSxjQUFwQywrQkFBc0MsQ0FBRjtJQUMzQyxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxpQkFBaUIsRUFBRSxTQUFTLENBQUMsQ0FBQyxDQUFBO0lBQy9ELElBQUEsS0FBQSxPQUFnQyxLQUFLLENBQUMsUUFBUSxDQUFTLENBQUMsQ0FBQyxJQUFBLEVBQXhELFdBQVcsUUFBQSxFQUFFLGNBQWMsUUFBNkIsQ0FBQTtJQUUvRCxJQUFNLE9BQU8sR0FBRyxLQUFLLENBQUMsT0FBTyxDQUFTO1FBQ3BDLElBQUksUUFBUSxJQUFJLEtBQUssQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDO1lBQUUsT0FBTyxRQUFRLENBQUMsTUFBTSxDQUFBO1FBQy9ELElBQUksUUFBUSxJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUM7WUFBRSxPQUFPLENBQUMsQ0FBQTtRQUNsRCxPQUFPLENBQUMsQ0FBQTtJQUNWLENBQUMsRUFBRSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUE7SUFFZCxLQUFLLENBQUMsU0FBUyxDQUFDO1FBQ2QsSUFBSSxRQUFRLEVBQUU7WUFDWixJQUFJLEtBQUssQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLEVBQUU7Z0JBQzNCLElBQUksaUJBQWUsR0FBRyxLQUFLLENBQUE7Z0JBQzNCLFFBQVEsQ0FBQyxHQUFHLENBQUMsVUFBQyxLQUFLLEVBQUUsS0FBSzs7b0JBQ3hCLElBQUksTUFBQSxLQUFLLGFBQUwsS0FBSyx1QkFBTCxLQUFLLENBQUUsS0FBSywwQ0FBRSxPQUFPLEVBQUU7d0JBQ3pCLGlCQUFlLEdBQUcsSUFBSSxDQUFBO3dCQUN0QixjQUFjLENBQUMsS0FBSyxHQUFHLENBQUMsQ0FBQyxDQUFBO3FCQUMxQjtnQkFDSCxDQUFDLENBQUMsQ0FBQTtnQkFDRixJQUFJLENBQUMsaUJBQWU7b0JBQUUsY0FBYyxDQUFDLENBQUMsQ0FBQyxDQUFBO2FBQ3hDO2lCQUFNO2dCQUNMLGNBQWMsQ0FBQyxDQUFDLENBQUMsQ0FBQTthQUNsQjtTQUNGO0lBQ0gsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQTtJQUVkLE9BQU8sQ0FDTCxzQ0FBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxPQUFPLElBQU0sTUFBTTtRQUN4QyxRQUFRO1FBQ1QsNkJBQUssU0FBUyxFQUFDLFlBQVk7WUFDekIsb0JBQUMsSUFBSTtnQkFDRixXQUFXOztnQkFBRyxPQUFPLENBQ2pCLENBQ0gsQ0FDRixDQUNQLENBQUE7QUFDSCxDQUFDLENBQUE7QUFDRCxlQUFlLE9BQU8sQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcHBlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9TdGVwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLHVDQUF1QyxDQUFBO0FBQ2xFLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFDeEQsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUV6Qjs7Ozs7O0dBTUc7QUFDSCxJQUFNLE9BQU8sR0FBRyxVQUFDLEVBQW9EO0lBQWxELElBQUEsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUssTUFBTSxjQUFwQywrQkFBc0MsQ0FBRjtJQUNuRCxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQUMsSUFBSSxDQUFDLGlCQUFpQixFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQUE7SUFDdkQsSUFBQSxLQUEyQixVQUFVLENBQUMsRUFBRSxRQUFRLFVBQUEsRUFBRSxDQUFDLEVBQWpELFdBQVcsaUJBQUEsRUFBRSxPQUFPLGFBQTZCLENBQUE7SUFFekQsT0FBTyxDQUNMLHNDQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLE9BQU8sSUFBTSxNQUFNO1FBQ3hDLFFBQVE7UUFDVCw2QkFBSyxTQUFTLEVBQUMsWUFBWTtZQUN6QixvQkFBQyxJQUFJO2dCQUNGLFdBQVc7O2dCQUFHLE9BQU8sQ0FDakIsQ0FDSCxDQUNGLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUNELGVBQWUsT0FBTyxDQUFBIn0=

package/lib/components/stepper/hooks/useStepper.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface IParams {
+    children?: React.ReactNode;
+}
+export declare const useStepper: ({ children }: IParams) => {
+    currentStep: number | undefined;
+    nbChild: number;
+};
+export {};

package/lib/components/stepper/hooks/useStepper.js

@@ -0,0 +1,55 @@
+import { __read } from "tslib";
+import React from 'react';
+export var useStepper = function (_a) {
+    var children = _a.children;
+    try {
+        var _b = __read(React.useState(1), 2), currentStep = _b[0], setCurrentStep_1 = _b[1];
+        var nbChild = React.useMemo(function () {
+            return getNbChilds(children);
+        }, [children]);
+        React.useEffect(function () {
+            getCurrentStep(children, setCurrentStep_1);
+        }, [children]);
+        return {
+            currentStep: currentStep,
+            nbChild: nbChild,
+        };
+    }
+    catch (_c) {
+        return {
+            currentStep: getCurrentStep(children),
+            nbChild: getNbChilds(children),
+        };
+    }
+};
+var getNbChilds = function (children) {
+    if (children && Array.isArray(children))
+        return children.length;
+    if (children && !Array.isArray(children))
+        return 1;
+    return 0;
+};
+var getCurrentStep = function (children, setCurrentStep) {
+    if (children) {
+        var currentStep_1 = 1;
+        if (Array.isArray(children)) {
+            var haveCurrentStep_1 = false;
+            children.map(function (child, index) {
+                var _a;
+                if ((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.current) {
+                    haveCurrentStep_1 = true;
+                    currentStep_1 = index + 1;
+                    setCurrentStep && setCurrentStep(index + 1);
+                }
+            });
+            if (!haveCurrentStep_1)
+                setCurrentStep && setCurrentStep(1);
+            return currentStep_1;
+        }
+        else {
+            setCurrentStep && setCurrentStep(1);
+            return currentStep_1;
+        }
+    }
+};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlU3RlcHBlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9ob29rcy91c2VTdGVwcGVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBTXpCLE1BQU0sQ0FBQyxJQUFNLFVBQVUsR0FBRyxVQUFDLEVBQXFCO1FBQW5CLFFBQVEsY0FBQTtJQUNuQyxJQUFJO1FBQ0ksSUFBQSxLQUFBLE9BQWdDLEtBQUssQ0FBQyxRQUFRLENBQVMsQ0FBQyxDQUFDLElBQUEsRUFBeEQsV0FBVyxRQUFBLEVBQUUsZ0JBQWMsUUFBNkIsQ0FBQTtRQUUvRCxJQUFNLE9BQU8sR0FBRyxLQUFLLENBQUMsT0FBTyxDQUFTO1lBQ3BDLE9BQU8sV0FBVyxDQUFDLFFBQVEsQ0FBQyxDQUFBO1FBQzlCLENBQUMsRUFBRSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUE7UUFFZCxLQUFLLENBQUMsU0FBUyxDQUFDO1lBQ2QsY0FBYyxDQUFDLFFBQVEsRUFBRSxnQkFBYyxDQUFDLENBQUE7UUFDMUMsQ0FBQyxFQUFFLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQTtRQUVkLE9BQU87WUFDTCxXQUFXLGFBQUE7WUFDWCxPQUFPLFNBQUE7U0FDUixDQUFBO0tBQ0Y7SUFBQyxXQUFNO1FBQ04sT0FBTztZQUNMLFdBQVcsRUFBRSxjQUFjLENBQUMsUUFBUSxDQUFDO1lBQ3JDLE9BQU8sRUFBRSxXQUFXLENBQUMsUUFBUSxDQUFDO1NBQy9CLENBQUE7S0FDRjtBQUNILENBQUMsQ0FBQTtBQUVELElBQU0sV0FBVyxHQUFHLFVBQUMsUUFBeUI7SUFDNUMsSUFBSSxRQUFRLElBQUksS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUM7UUFBRSxPQUFPLFFBQVEsQ0FBQyxNQUFNLENBQUE7SUFDL0QsSUFBSSxRQUFRLElBQUksQ0FBQyxLQUFLLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQztRQUFFLE9BQU8sQ0FBQyxDQUFBO0lBQ2xELE9BQU8sQ0FBQyxDQUFBO0FBQ1YsQ0FBQyxDQUFBO0FBRUQsSUFBTSxjQUFjLEdBQUcsVUFBQyxRQUF5QixFQUFFLGNBQTZEO0lBQzlHLElBQUksUUFBUSxFQUFFO1FBQ1osSUFBSSxhQUFXLEdBQUcsQ0FBQyxDQUFBO1FBQ25CLElBQUksS0FBSyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsRUFBRTtZQUMzQixJQUFJLGlCQUFlLEdBQUcsS0FBSyxDQUFBO1lBQzNCLFFBQVEsQ0FBQyxHQUFHLENBQUMsVUFBQyxLQUFLLEVBQUUsS0FBSzs7Z0JBQ3hCLElBQUksTUFBQSxLQUFLLGFBQUwsS0FBSyx1QkFBTCxLQUFLLENBQUUsS0FBSywwQ0FBRSxPQUFPLEVBQUU7b0JBQ3pCLGlCQUFlLEdBQUcsSUFBSSxDQUFBO29CQUN0QixhQUFXLEdBQUcsS0FBSyxHQUFHLENBQUMsQ0FBQTtvQkFDdkIsY0FBYyxJQUFJLGNBQWMsQ0FBQyxLQUFLLEdBQUcsQ0FBQyxDQUFDLENBQUE7aUJBQzVDO1lBQ0gsQ0FBQyxDQUFDLENBQUE7WUFDRixJQUFJLENBQUMsaUJBQWU7Z0JBQUUsY0FBYyxJQUFJLGNBQWMsQ0FBQyxDQUFDLENBQUMsQ0FBQTtZQUN6RCxPQUFPLGFBQVcsQ0FBQTtTQUNuQjthQUFNO1lBQ0wsY0FBYyxJQUFJLGNBQWMsQ0FBQyxDQUFDLENBQUMsQ0FBQTtZQUNuQyxPQUFPLGFBQVcsQ0FBQTtTQUNuQjtLQUNGO0FBQ0gsQ0FBQyxDQUFBIn0=

package/lib/components/stepper/step/Step.d.ts

@@ -1,5 +1,5 @@
+import { StepProps } from '../../../components/stepper/step/StepProps';
 import React from 'react';
-import { StepProps } from './StepProps';
 /**
  * Stepper Step Component
  * @param active {boolean} Active step

package/lib/components/stepper/step/Step.js

@@ -1,11 +1,10 @@
 import { __assign, __rest } from "tslib";
-import React from 'react';
-import clsx from 'clsx';
-import { is } from '../../../services/classify';
-import { hashClass } from '../../../helpers';
-import { useTrilogyContext } from '../../../context';
-import Icon from '../../../components/icon/Icon';
 import { IconSize } from '../../../components/icon';
+import Icon from '../../../components/icon/Icon';
+import { hashClass } from '../../../helpers/hashClassesHelpers';
+import { is } from '../../../services/classify';
+import clsx from 'clsx';
+import React from 'react';
 /**
  * Stepper Step Component
  * @param active {boolean} Active step
@@ -20,9 +19,8 @@ import { IconSize } from '../../../components/icon';
  */
 var Step = function (_a) {
     var className = _a.className, id = _a.id, active = _a.active, current = _a.current, done = _a.done, label = _a.label, iconName = _a.iconName, error = _a.error, others = __rest(_a, ["className", "id", "active", "current", "done", "label", "iconName", "error"]);
-    var styled = useTrilogyContext().styled;
-    var classesStepLabel = hashClass(styled, clsx('step-label'));
-    var classes = hashClass(styled, clsx('stepper-item', active && is('active'), current && is('current'), done && is('done'), error && is('error'), className));
+    var classesStepLabel = hashClass(clsx('step-label'));
+    var classes = hashClass(clsx('stepper-item', active && is('active'), current && is('current'), done && is('done'), error && is('error'), className));
     /**
      * If no markup return div
      */
@@ -32,4 +30,4 @@ var Step = function (_a) {
             !done && iconName && React.createElement(Icon, { name: iconName && iconName, className: 'step-icon', size: IconSize.MEDIUM }))));
 };
 export default Step;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9zdGVwL1N0ZXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDekIsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBRXZCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM3QyxPQUFPLElBQUksTUFBTSx3QkFBd0IsQ0FBQTtBQUN6QyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFFNUM7Ozs7Ozs7Ozs7O0dBV0c7QUFDSCxJQUFNLElBQUksR0FBRyxVQUFDLEVBQXNGO0lBQXBGLElBQUEsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsTUFBTSxZQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsSUFBSSxVQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUssTUFBTSxjQUF6RSw4RUFBMkUsQ0FBRjtJQUM3RSxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLGdCQUFnQixHQUFHLFNBQVMsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUE7SUFFOUQsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUN2QixNQUFNLEVBQ04sSUFBSSxDQUNGLGNBQWMsRUFDZCxNQUFNLElBQUksRUFBRSxDQUFDLFFBQVEsQ0FBQyxFQUN0QixPQUFPLElBQUksRUFBRSxDQUFDLFNBQVMsQ0FBQyxFQUN4QixJQUFJLElBQUksRUFBRSxDQUFDLE1BQU0sQ0FBQyxFQUNsQixLQUFLLElBQUksRUFBRSxDQUFDLE9BQU8sQ0FBQyxFQUNwQixTQUFTLENBQ1YsQ0FDRixDQUFBO0lBQ0Q7O09BRUc7SUFFSCxPQUFPLENBQ0wsc0NBQUssRUFBRSxFQUFFLEVBQUUsRUFBRSxTQUFTLEVBQUUsT0FBTyxnQkFBYyxLQUFLLElBQU0sTUFBTTtRQUM1RCw2QkFBSyxTQUFTLEVBQUUsZ0JBQWdCO1lBQzdCLEtBQUs7WUFDTCxDQUFDLElBQUksSUFBSSxRQUFRLElBQUksb0JBQUMsSUFBSSxJQUFDLElBQUksRUFBRSxRQUFRLElBQUksUUFBUSxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsSUFBSSxFQUFFLFFBQVEsQ0FBQyxNQUFNLEdBQUksQ0FDckcsQ0FDRixDQUNQLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLElBQUksQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RlcC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvc3RlcHBlci9zdGVwL1N0ZXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDNUMsT0FBTyxJQUFJLE1BQU0sd0JBQXdCLENBQUE7QUFFekMsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBQ3hELE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCOzs7Ozs7Ozs7OztHQVdHO0FBQ0gsSUFBTSxJQUFJLEdBQUcsVUFBQyxFQUFzRjtJQUFwRixJQUFBLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQSxFQUFFLE1BQU0sWUFBQSxFQUFFLE9BQU8sYUFBQSxFQUFFLElBQUksVUFBQSxFQUFFLEtBQUssV0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLEtBQUssV0FBQSxFQUFLLE1BQU0sY0FBekUsOEVBQTJFLENBQUY7SUFDckYsSUFBTSxnQkFBZ0IsR0FBRyxTQUFTLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUE7SUFFdEQsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUN2QixJQUFJLENBQ0YsY0FBYyxFQUNkLE1BQU0sSUFBSSxFQUFFLENBQUMsUUFBUSxDQUFDLEVBQ3RCLE9BQU8sSUFBSSxFQUFFLENBQUMsU0FBUyxDQUFDLEVBQ3hCLElBQUksSUFBSSxFQUFFLENBQUMsTUFBTSxDQUFDLEVBQ2xCLEtBQUssSUFBSSxFQUFFLENBQUMsT0FBTyxDQUFDLEVBQ3BCLFNBQVMsQ0FDVixDQUNGLENBQUE7SUFDRDs7T0FFRztJQUVILE9BQU8sQ0FDTCxzQ0FBSyxFQUFFLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxPQUFPLGdCQUFjLEtBQUssSUFBTSxNQUFNO1FBQzVELDZCQUFLLFNBQVMsRUFBRSxnQkFBZ0I7WUFDN0IsS0FBSztZQUNMLENBQUMsSUFBSSxJQUFJLFFBQVEsSUFBSSxvQkFBQyxJQUFJLElBQUMsSUFBSSxFQUFFLFFBQVEsSUFBSSxRQUFRLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxJQUFJLEVBQUUsUUFBUSxDQUFDLE1BQU0sR0FBSSxDQUNyRyxDQUNGLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FBQTtBQUVELGVBQWUsSUFBSSxDQUFBIn0=

package/lib/components/stepper/step/index.d.ts

@@ -1,2 +1,2 @@
-import Step from './Step';
+import Step from '../../../components/stepper/step/Step';
 export default Step;

package/lib/components/stepper/step/index.js

@@ -1,3 +1,3 @@
-import Step from './Step';
+import Step from '../../../components/stepper/step/Step';
 export default Step;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3N0ZXBwZXIvc3RlcC9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLElBQUksTUFBTSxRQUFRLENBQUE7QUFFekIsZUFBZSxJQUFJLENBQUEifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3N0ZXBwZXIvc3RlcC9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLElBQUksTUFBTSxnQ0FBZ0MsQ0FBQTtBQUVqRCxlQUFlLElBQUksQ0FBQSJ9

package/lib/components/sticker/Sticker.js

@@ -1,11 +1,10 @@
 import { __assign, __rest } from "tslib";
-import React from 'react';
-import clsx from 'clsx';
-import { is } from '../../services/classify';
-import { getVariantClassName } from '../../objects';
+import { Icon, IconSize } from '../../components/icon';
 import { hashClass } from '../../helpers';
-import { useTrilogyContext } from '../../context';
-import { Icon, IconSize } from "../../components/icon";
+import { getVariantClassName } from '../../objects';
+import { is } from '../../services/classify';
+import clsx from 'clsx';
+import React from 'react';
 /**
  * Sticker component
  * @param children {ReactNode} Sticker child
@@ -20,11 +19,10 @@ import { Icon, IconSize } from "../../components/icon";
  */
 var Sticker = function (_a) {
     var className = _a.className, id = _a.id, variant = _a.variant, small = _a.small, label = _a.label, outlined = _a.outlined, iconName = _a.iconName, others = __rest(_a, ["className", "id", "variant", "small", "label", "outlined", "iconName"]);
-    var styled = useTrilogyContext().styled;
-    var classes = hashClass(styled, clsx('sticker', variant && is(getVariantClassName(variant)), small && is('small'), className, outlined && is('outlined'), is('vcentered')));
+    var classes = hashClass(clsx('sticker', variant && is(getVariantClassName(variant)), small && is('small'), className, outlined && is('outlined'), is('vcentered')));
     return (React.createElement("p", __assign({ id: id, className: classes }, others),
         iconName && React.createElement(Icon, { size: small ? IconSize.SMALLER : IconSize.SMALL, name: iconName }),
         label));
 };
 export default Sticker;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RpY2tlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc3RpY2tlci9TdGlja2VyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQ3pCLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUV2QixPQUFPLEVBQUMsRUFBRSxFQUFDLE1BQU0scUJBQXFCLENBQUE7QUFDdEMsT0FBTyxFQUFDLG1CQUFtQixFQUFDLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBQyxTQUFTLEVBQUMsTUFBTSxXQUFXLENBQUE7QUFDbkMsT0FBTyxFQUFDLGlCQUFpQixFQUFDLE1BQU0sV0FBVyxDQUFBO0FBQzNDLE9BQU8sRUFBQyxJQUFJLEVBQUUsUUFBUSxFQUFDLE1BQU0sbUJBQW1CLENBQUM7QUFFakQ7Ozs7Ozs7Ozs7O0dBV0c7QUFDSCxJQUFNLE9BQU8sR0FBRyxVQUFDLEVBQXFGO0lBQW5GLElBQUEsU0FBUyxlQUFBLEVBQUUsRUFBRSxRQUFBLEVBQUUsT0FBTyxhQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUUsUUFBUSxjQUFBLEVBQUssTUFBTSxjQUFyRSx3RUFBdUUsQ0FBRjtJQUM1RSxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUV0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQ3ZCLE1BQU0sRUFDTixJQUFJLENBQ0YsU0FBUyxFQUNULE9BQU8sSUFBSSxFQUFFLENBQUMsbUJBQW1CLENBQUMsT0FBTyxDQUFDLENBQUMsRUFDM0MsS0FBSyxJQUFJLEVBQUUsQ0FBQyxPQUFPLENBQUMsRUFDcEIsU0FBUyxFQUNULFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLEVBQzFCLEVBQUUsQ0FBQyxXQUFXLENBQUMsQ0FDaEIsQ0FDRixDQUFBO0lBRUQsT0FBTyxDQUNMLG9DQUFHLEVBQUUsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLE9BQU8sSUFBTSxNQUFNO1FBQ3RDLFFBQVEsSUFBSSxvQkFBQyxJQUFJLElBQUMsSUFBSSxFQUFFLEtBQUssQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLEtBQUssRUFBRSxJQUFJLEVBQUUsUUFBUSxHQUFJO1FBQ3JGLEtBQUssQ0FDSixDQUNMLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLE9BQU8sQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3RpY2tlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvc3RpY2tlci9TdGlja2VyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNsRCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUMvQyxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDeEMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUd6Qjs7Ozs7Ozs7Ozs7R0FXRztBQUNILElBQU0sT0FBTyxHQUFHLFVBQUMsRUFTRjtJQVJiLElBQUEsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsT0FBTyxhQUFBLEVBQ1AsS0FBSyxXQUFBLEVBQ0wsS0FBSyxXQUFBLEVBQ0wsUUFBUSxjQUFBLEVBQ1IsUUFBUSxjQUFBLEVBQ0wsTUFBTSxjQVJNLHdFQVNoQixDQURVO0lBRVQsSUFBTSxPQUFPLEdBQUcsU0FBUyxDQUN2QixJQUFJLENBQ0YsU0FBUyxFQUNULE9BQU8sSUFBSSxFQUFFLENBQUMsbUJBQW1CLENBQUMsT0FBTyxDQUFDLENBQUMsRUFDM0MsS0FBSyxJQUFJLEVBQUUsQ0FBQyxPQUFPLENBQUMsRUFDcEIsU0FBUyxFQUNULFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLEVBQzFCLEVBQUUsQ0FBQyxXQUFXLENBQUMsQ0FDaEIsQ0FDRixDQUFBO0lBRUQsT0FBTyxDQUNMLG9DQUFHLEVBQUUsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLE9BQU8sSUFBTSxNQUFNO1FBQ3RDLFFBQVEsSUFBSSxvQkFBQyxJQUFJLElBQUMsSUFBSSxFQUFFLEtBQUssQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLEtBQUssRUFBRSxJQUFJLEVBQUUsUUFBUSxHQUFJO1FBQ3JGLEtBQUssQ0FDSixDQUNMLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLE9BQU8sQ0FBQSJ9

package/lib/components/switch/Switch.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { SwitchProps } from './SwitchProps';
+import { SwitchProps } from '../../components/switch/SwitchProps';
 /**
  * Switch Component
  * @param id {string} Is auto generate by default

package/lib/components/switch/Switch.js

@@ -1,11 +1,10 @@
-import { __assign, __read, __rest } from "tslib";
-import React, { useEffect, useState } from 'react';
-import shortid from 'shortid';
-import clsx from 'clsx';
+import { __assign, __rest } from "tslib";
+import { useSwitch } from '../../components/switch/hooks/useSwitch';
+import { hashClass } from '../../helpers/hashClassesHelpers';
+import { getStatusClassName } from '../../objects/facets/Status';
 import { is } from '../../services/classify';
-import { getStatusClassName } from '../../objects';
-import { hashClass } from '../../helpers';
-import { useTrilogyContext } from '../../context';
+import clsx from 'clsx';
+import React from 'react';
 /**
  * Switch Component
  * @param id {string} Is auto generate by default
@@ -23,42 +22,11 @@ import { useTrilogyContext } from '../../context';
  * @param reversed {boolean} change switch position
  */
 var Switch = function (_a) {
-    var className = _a.className, _b = _a.id, id = _b === void 0 ? shortid.generate() : _b, label = _a.label, value = _a.value, checked = _a.checked, onChange = _a.onChange, onClick = _a.onClick, status = _a.status, disabled = _a.disabled, readonly = _a.readonly, name = _a.name, reversed = _a.reversed, fullWidth = _a.fullWidth, others = __rest(_a, ["className", "id", "label", "value", "checked", "onChange", "onClick", "status", "disabled", "readonly", "name", "reversed", "fullWidth"]);
-    var _c = __read(useState(checked || false), 2), _checked = _c[0], setChecked = _c[1];
-    var styled = useTrilogyContext().styled;
-    React.useEffect(function () {
-        setChecked(checked || false);
-    }, [checked]);
-    useEffect(function () {
-        if (!readonly) {
-            setChecked(checked || false);
-        }
-    }, [checked, readonly]);
-    return (React.createElement("div", { className: hashClass(styled, clsx('switch', reversed && is('reversed'), fullWidth && is('fullwidth'), className)) },
-        React.createElement("input", __assign({ onChange: function (e) {
-                if (!readonly) {
-                    setChecked(!_checked);
-                }
-                if (onChange) {
-                    onChange({
-                        switchState: e.target.checked,
-                        switchName: e.target.name,
-                    });
-                }
-            }, 
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            onClick: function (e) {
-                if (!readonly) {
-                    setChecked(!_checked);
-                }
-                if (onClick) {
-                    onClick({
-                        switchState: e.target.checked,
-                        switchName: e.target.name,
-                    });
-                }
-            }, name: name, value: value, checked: readonly ? checked : _checked, readOnly: readonly, id: "switch-".concat(id), type: 'checkbox', disabled: disabled, className: hashClass(styled, clsx(status && is(getStatusClassName(status)))) }, others)),
+    var className = _a.className, _b = _a.id, id = _b === void 0 ? React.useId() : _b, label = _a.label, value = _a.value, checked = _a.checked, onChange = _a.onChange, onClick = _a.onClick, status = _a.status, disabled = _a.disabled, readonly = _a.readonly, name = _a.name, reversed = _a.reversed, fullWidth = _a.fullWidth, others = __rest(_a, ["className", "id", "label", "value", "checked", "onChange", "onClick", "status", "disabled", "readonly", "name", "reversed", "fullWidth"]);
+    var _c = useSwitch({ checked: checked, readonly: readonly, onChange: onChange, onClick: onClick }), handleChange = _c.handleChange, handleClick = _c.handleClick, _checked = _c._checked;
+    return (React.createElement("div", { className: hashClass(clsx('switch', reversed && is('reversed'), fullWidth && is('fullwidth'), className)) },
+        React.createElement("input", __assign({ onChange: handleChange, onClick: handleClick, name: name, value: value, checked: _checked, readOnly: readonly, id: "switch-".concat(id), type: 'checkbox', disabled: disabled, className: hashClass(clsx(status && is(getStatusClassName(status)))) }, others)),
         React.createElement("label", { htmlFor: "switch-".concat(id) }, label)));
 };
 export default Switch;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3dpdGNoLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9zd2l0Y2gvU3dpdGNoLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQ2xELE9BQU8sT0FBTyxNQUFNLFNBQVMsQ0FBQTtBQUM3QixPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFFdkIsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBQ3hDLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUM5QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUU3Qzs7Ozs7Ozs7Ozs7Ozs7O0dBZUc7QUFFSCxJQUFNLE1BQU0sR0FBRyxVQUFDLEVBZUY7SUFkWixJQUFBLFNBQVMsZUFBQSxFQUNULFVBQXVCLEVBQXZCLEVBQUUsbUJBQUcsT0FBTyxDQUFDLFFBQVEsRUFBRSxLQUFBLEVBQ3ZCLEtBQUssV0FBQSxFQUNMLEtBQUssV0FBQSxFQUNMLE9BQU8sYUFBQSxFQUNQLFFBQVEsY0FBQSxFQUNSLE9BQU8sYUFBQSxFQUNQLE1BQU0sWUFBQSxFQUNOLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLElBQUksVUFBQSxFQUNKLFFBQVEsY0FBQSxFQUNSLFNBQVMsZUFBQSxFQUNOLE1BQU0sY0FkSywwSUFlZixDQURVO0lBRUgsSUFBQSxLQUFBLE9BQXlCLFFBQVEsQ0FBVSxPQUFPLElBQUksS0FBSyxDQUFDLElBQUEsRUFBM0QsUUFBUSxRQUFBLEVBQUUsVUFBVSxRQUF1QyxDQUFBO0lBQzFELElBQUEsTUFBTSxHQUFLLGlCQUFpQixFQUFFLE9BQXhCLENBQXdCO0lBRXRDLEtBQUssQ0FBQyxTQUFTLENBQUM7UUFDZCxVQUFVLENBQUMsT0FBTyxJQUFJLEtBQUssQ0FBQyxDQUFBO0lBQzlCLENBQUMsRUFBRSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUE7SUFFYixTQUFTLENBQUM7UUFDUixJQUFJLENBQUMsUUFBUSxFQUFFO1lBQ2IsVUFBVSxDQUFDLE9BQU8sSUFBSSxLQUFLLENBQUMsQ0FBQTtTQUM3QjtJQUNILENBQUMsRUFBRSxDQUFDLE9BQU8sRUFBRSxRQUFRLENBQUMsQ0FBQyxDQUFBO0lBRXZCLE9BQU8sQ0FDTCw2QkFDRSxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsUUFBUSxFQUFFLFFBQVEsSUFBSSxFQUFFLENBQUMsVUFBVSxDQUFDLEVBQUUsU0FBUyxJQUFJLEVBQUUsQ0FBQyxXQUFXLENBQUMsRUFBRSxTQUFTLENBQUMsQ0FBQztRQUVqSCx3Q0FDRSxRQUFRLEVBQUUsVUFBQyxDQUFDO2dCQUNWLElBQUksQ0FBQyxRQUFRLEVBQUU7b0JBQ2IsVUFBVSxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUE7aUJBQ3RCO2dCQUNELElBQUksUUFBUSxFQUFFO29CQUNaLFFBQVEsQ0FBQzt3QkFDUCxXQUFXLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxPQUFPO3dCQUM3QixVQUFVLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxJQUFJO3FCQUMxQixDQUFDLENBQUE7aUJBQ0g7WUFDSCxDQUFDO1lBQ0QsOERBQThEO1lBQzlELE9BQU8sRUFBRSxVQUFDLENBQU07Z0JBQ2QsSUFBSSxDQUFDLFFBQVEsRUFBRTtvQkFDYixVQUFVLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQTtpQkFDdEI7Z0JBQ0QsSUFBSSxPQUFPLEVBQUU7b0JBQ1gsT0FBTyxDQUFDO3dCQUNOLFdBQVcsRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLE9BQU87d0JBQzdCLFVBQVUsRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLElBQUk7cUJBQzFCLENBQUMsQ0FBQTtpQkFDSDtZQUNILENBQUMsRUFDRCxJQUFJLEVBQUUsSUFBSSxFQUNWLEtBQUssRUFBRSxLQUFLLEVBQ1osT0FBTyxFQUFFLFFBQVEsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLENBQUMsQ0FBQyxRQUFRLEVBQ3RDLFFBQVEsRUFBRSxRQUFRLEVBQ2xCLEVBQUUsRUFBRSxpQkFBVSxFQUFFLENBQUUsRUFDbEIsSUFBSSxFQUFDLFVBQVUsRUFDZixRQUFRLEVBQUUsUUFBUSxFQUNsQixTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsTUFBTSxJQUFJLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFDeEUsTUFBTSxFQUNWO1FBQ0YsK0JBQU8sT0FBTyxFQUFFLGlCQUFVLEVBQUUsQ0FBRSxJQUFHLEtBQUssQ0FBUyxDQUMzQyxDQUNQLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLE1BQU0sQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3dpdGNoLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9zd2l0Y2gvU3dpdGNoLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLHFDQUFxQyxDQUFBO0FBQy9ELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQTtBQUM1RCxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFDeEMsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUV6Qjs7Ozs7Ozs7Ozs7Ozs7O0dBZUc7QUFFSCxJQUFNLE1BQU0sR0FBRyxVQUFDLEVBZUY7SUFkWixJQUFBLFNBQVMsZUFBQSxFQUNULFVBQWtCLEVBQWxCLEVBQUUsbUJBQUcsS0FBSyxDQUFDLEtBQUssRUFBRSxLQUFBLEVBQ2xCLEtBQUssV0FBQSxFQUNMLEtBQUssV0FBQSxFQUNMLE9BQU8sYUFBQSxFQUNQLFFBQVEsY0FBQSxFQUNSLE9BQU8sYUFBQSxFQUNQLE1BQU0sWUFBQSxFQUNOLFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLElBQUksVUFBQSxFQUNKLFFBQVEsY0FBQSxFQUNSLFNBQVMsZUFBQSxFQUNOLE1BQU0sY0FkSywwSUFlZixDQURVO0lBRUgsSUFBQSxLQUEwQyxTQUFTLENBQUMsRUFBRSxPQUFPLFNBQUEsRUFBRSxRQUFRLFVBQUEsRUFBRSxRQUFRLFVBQUEsRUFBRSxPQUFPLFNBQUEsRUFBRSxDQUFDLEVBQTNGLFlBQVksa0JBQUEsRUFBRSxXQUFXLGlCQUFBLEVBQUUsUUFBUSxjQUF3RCxDQUFBO0lBRW5HLE9BQU8sQ0FDTCw2QkFBSyxTQUFTLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsUUFBUSxJQUFJLEVBQUUsQ0FBQyxVQUFVLENBQUMsRUFBRSxTQUFTLElBQUksRUFBRSxDQUFDLFdBQVcsQ0FBQyxFQUFFLFNBQVMsQ0FBQyxDQUFDO1FBQzVHLHdDQUNFLFFBQVEsRUFBRSxZQUFZLEVBQ3RCLE9BQU8sRUFBRSxXQUFXLEVBQ3BCLElBQUksRUFBRSxJQUFJLEVBQ1YsS0FBSyxFQUFFLEtBQUssRUFDWixPQUFPLEVBQUUsUUFBUSxFQUNqQixRQUFRLEVBQUUsUUFBUSxFQUNsQixFQUFFLEVBQUUsaUJBQVUsRUFBRSxDQUFFLEVBQ2xCLElBQUksRUFBQyxVQUFVLEVBQ2YsUUFBUSxFQUFFLFFBQVEsRUFDbEIsU0FBUyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQUMsTUFBTSxJQUFJLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFDaEUsTUFBTSxFQUNWO1FBQ0YsK0JBQU8sT0FBTyxFQUFFLGlCQUFVLEVBQUUsQ0FBRSxJQUFHLEtBQUssQ0FBUyxDQUMzQyxDQUNQLENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLE1BQU0sQ0FBQSJ9