intelicoreact 1.6.7 → 1.6.8

package/dist/Atomic/FormElements/SwitcherRangeList/SwitcherRangeList.stories.js

@@ -0,0 +1,229 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    SwitcherRangeListTemplate: function() {
+        return SwitcherRangeListTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _SwitcherRangeList = /*#__PURE__*/ _interop_require_default(require("./SwitcherRangeList"));
+require("./partial/AnyOuterClass.scss");
+require("../../../../../scss/main.scss");
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+function _object_without_properties(source, excluded) {
+    if (source == null) return {};
+    var target = _object_without_properties_loose(source, excluded);
+    var key, i;
+    if (Object.getOwnPropertySymbols) {
+        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+        for(i = 0; i < sourceSymbolKeys.length; i++){
+            key = sourceSymbolKeys[i];
+            if (excluded.indexOf(key) >= 0) continue;
+            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+function _object_without_properties_loose(source, excluded) {
+    if (source == null) return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+    for(i = 0; i < sourceKeys.length; i++){
+        key = sourceKeys[i];
+        if (excluded.indexOf(key) >= 0) continue;
+        target[key] = source[key];
+    }
+    return target;
+}
+global.lng = 'en';
+const _default = {
+    title: 'Form Elements/SwitcherRangeList',
+    component: _SwitcherRangeList.default
+};
+const DEFAULT_STATE = {
+    isActive: true,
+    value: []
+};
+const Template = (args)=>{
+    const { isIncludeOuterStyles, isAddValidateErrorsForExample, isUseInitialValues, initialValues } = args, restArgs = _object_without_properties(args, [
+        "isIncludeOuterStyles",
+        "isAddValidateErrorsForExample",
+        "isUseInitialValues",
+        "initialValues"
+    ]);
+    const [state, setState] = (0, _react.useState)(DEFAULT_STATE);
+    const [error, setError] = (0, _react.useState)('');
+    const handleChange = (value, prop)=>{
+        setState(_object_spread_props(_object_spread({}, state), {
+            [prop]: value
+        }));
+        setError('');
+    };
+    const validateForExample = (from, to)=>{
+        if (+from < 18) {
+            setError('18 is the minimum allowed value');
+            return false;
+        } else {
+            setError('');
+            return true;
+        }
+    };
+    (0, _react.useEffect)(()=>{
+        if (isUseInitialValues) handleChange(initialValues, 'value');
+        else handleChange([], 'value');
+    }, [
+        isUseInitialValues,
+        restArgs.isFloatValues
+    ]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_SwitcherRangeList.default, _object_spread_props(_object_spread({}, restArgs), {
+        isActive: state.isActive,
+        setIsActive: (val)=>handleChange(val, 'isActive'),
+        value: state.value,
+        onChange: (val)=>handleChange(val, 'value'),
+        className: isIncludeOuterStyles ? 'any-outer-class__switcher-range-list' : null,
+        validateErrors: isAddValidateErrorsForExample ? validateForExample : null,
+        error: error
+    }));
+};
+const SwitcherRangeListTemplate = Template.bind({});
+SwitcherRangeListTemplate.args = {
+    isIncludeOuterStyles: false,
+    isAddValidateErrorsForExample: false,
+    disabled: false,
+    label: 'Test label',
+    isLabelBold: true,
+    hint: null,
+    hintSide: null,
+    isFloatValues: false,
+    decimalPlaces: 2,
+    defaultErrorText: 'Set a valid range',
+    nullValueText: 'Not set',
+    isUseInitialValues: true,
+    initialValues: [
+        {
+            from: 15,
+            to: 17
+        },
+        {
+            from: 19,
+            to: 23
+        },
+        {
+            from: 25,
+            to: 30
+        }
+    ]
+};
+
+//# sourceMappingURL=SwitcherRangeList.stories.js.map

package/dist/Atomic/FormElements/SwitcherRangeList/SwitcherRangeList.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/Atomic/FormElements/SwitcherRangeList/SwitcherRangeList.stories.js"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport SwitcherRangeList from './SwitcherRangeList';\n\nimport './partial/AnyOuterClass.scss';\nimport '../../../../../scss/main.scss';\n\nglobal.lng = 'en';\n\nexport default {\n  title: 'Form Elements/SwitcherRangeList',\n  component: SwitcherRangeList,\n};\n\nconst DEFAULT_STATE = {isActive: true, value: []};\n\nconst Template = args => {\n  const {isIncludeOuterStyles, isAddValidateErrorsForExample, isUseInitialValues, initialValues, ...restArgs} = args;\n\n  const [state, setState] = useState(DEFAULT_STATE);\n  const [error, setError] = useState('');\n\n  const handleChange = (value, prop) => {\n    setState({...state, [prop]: value});\n    setError('');\n  };\n\n  const validateForExample = (from, to) => {\n    if (+from < 18) {\n      setError('18 is the minimum allowed value');\n      return false;\n    } else {\n      setError('');\n      return true;\n    }\n  };\n\n  useEffect(() => {\n    if (isUseInitialValues) handleChange(initialValues, 'value');\n    else handleChange([], 'value');\n  }, [isUseInitialValues, restArgs.isFloatValues]);\n\n  return (\n    <SwitcherRangeList\n      {...restArgs}\n      isActive={state.isActive}\n      setIsActive={val => handleChange(val, 'isActive')}\n      value={state.value}\n      onChange={val => handleChange(val, 'value')}\n      className={isIncludeOuterStyles ? 'any-outer-class__switcher-range-list' : null}\n      validateErrors={isAddValidateErrorsForExample ? validateForExample : null}\n      error={error}\n    />\n  );\n};\n\nexport const SwitcherRangeListTemplate = Template.bind({});\n\nSwitcherRangeListTemplate.args = {\n  isIncludeOuterStyles: false,\n  isAddValidateErrorsForExample: false,\n\n  disabled: false,\n  label: 'Test label',\n  isLabelBold: true,\n  hint: null,\n  hintSide: null,\n\n  isFloatValues: false,\n  decimalPlaces: 2,\n  defaultErrorText: 'Set a valid range',\n  nullValueText: 'Not set',\n\n  isUseInitialValues: true,\n  initialValues: [\n    {from: 15, to: 17},\n    {from: 19, to: 23},\n    {from: 25, to: 30},\n  ],\n};\n"],"names":["SwitcherRangeListTemplate","global","lng","title","component","SwitcherRangeList","DEFAULT_STATE","isActive","value","Template","args","isIncludeOuterStyles","isAddValidateErrorsForExample","isUseInitialValues","initialValues","restArgs","state","setState","useState","error","setError","handleChange","prop","validateForExample","from","to","useEffect","isFloatValues","setIsActive","val","onChange","className","validateErrors","bind","disabled","label","isLabelBold","hint","hintSide","decimalPlaces","defaultErrorText","nullValueText"],"mappings":";;;;;;;;;;;IAuDaA,yBAAyB;eAAzBA;;IA/Cb,OAGE;eAHF;;;;+DARyC;0EACX;QAEvB;QACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEPC,OAAOC,GAAG,GAAG;MAEb,WAAe;IACbC,OAAO;IACPC,WAAWC,0BAAiB;AAC9B;AAEA,MAAMC,gBAAgB;IAACC,UAAU;IAAMC,OAAO,EAAE;AAAA;AAEhD,MAAMC,WAAWC,CAAAA;IACf,MAAM,EAACC,oBAAoB,EAAEC,6BAA6B,EAAEC,kBAAkB,EAAEC,aAAa,EAAc,GAAGJ,MAAZK,sCAAYL;QAAvGC;QAAsBC;QAA+BC;QAAoBC;;IAEhF,MAAM,CAACE,OAAOC,SAAS,GAAGC,IAAAA,eAAQ,EAACZ;IACnC,MAAM,CAACa,OAAOC,SAAS,GAAGF,IAAAA,eAAQ,EAAC;IAEnC,MAAMG,eAAe,CAACb,OAAOc;QAC3BL,SAAS,wCAAID;YAAO,CAACM,KAAK,EAAEd;;QAC5BY,SAAS;IACX;IAEA,MAAMG,qBAAqB,CAACC,MAAMC;QAChC,IAAI,CAACD,OAAO,IAAI;YACdJ,SAAS;YACT,OAAO;QACT,OAAO;YACLA,SAAS;YACT,OAAO;QACT;IACF;IAEAM,IAAAA,gBAAS,EAAC;QACR,IAAIb,oBAAoBQ,aAAaP,eAAe;aAC/CO,aAAa,EAAE,EAAE;IACxB,GAAG;QAACR;QAAoBE,SAASY,aAAa;KAAC;IAE/C,qBACE,qBAACtB,0BAAiB,0CACZU;QACJR,UAAUS,MAAMT,QAAQ;QACxBqB,aAAaC,CAAAA,MAAOR,aAAaQ,KAAK;QACtCrB,OAAOQ,MAAMR,KAAK;QAClBsB,UAAUD,CAAAA,MAAOR,aAAaQ,KAAK;QACnCE,WAAWpB,uBAAuB,yCAAyC;QAC3EqB,gBAAgBpB,gCAAgCW,qBAAqB;QACrEJ,OAAOA;;AAGb;AAEO,MAAMnB,4BAA4BS,SAASwB,IAAI,CAAC,CAAC;AAExDjC,0BAA0BU,IAAI,GAAG;IAC/BC,sBAAsB;IACtBC,+BAA+B;IAE/BsB,UAAU;IACVC,OAAO;IACPC,aAAa;IACbC,MAAM;IACNC,UAAU;IAEVX,eAAe;IACfY,eAAe;IACfC,kBAAkB;IAClBC,eAAe;IAEf5B,oBAAoB;IACpBC,eAAe;QACb;YAACU,MAAM;YAAIC,IAAI;QAAE;QACjB;YAACD,MAAM;YAAIC,IAAI;QAAE;QACjB;YAACD,MAAM;YAAIC,IAAI;QAAE;KAClB;AACH"}

package/dist/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.js

@@ -0,0 +1,181 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _Button = /*#__PURE__*/ _interop_require_default(require("../../UI/Button/Button"));
+const _SwitcherHide = /*#__PURE__*/ _interop_require_default(require("../SwitcherHide/SwitcherHide"));
+const _TagsDropdown = /*#__PURE__*/ _interop_require_default(require("../TagsDropdown/TagsDropdown"));
+const _TextSwitcher = /*#__PURE__*/ _interop_require_default(require("../TextSwitcher/TextSwitcher"));
+const _Textarea = /*#__PURE__*/ _interop_require_default(require("../Textarea/Textarea"));
+require("./SwitcherTagsDropdown.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const RC = "switcher-tags-dropdown";
+const SwitcherTagsDropdown = ({ className, label, isLabelBold, isValuesInTags, isActive, isIncluded, isAdvancedLabelSearch, disabled, options = [], chosenOptions = [], setIsActive = ()=>{}, setIsIncluded = ()=>{}, onChange = ()=>{} })=>{
+    const [listView, setListView] = (0, _react.useState)(false);
+    const [textValue, setTextValue] = (0, _react.useState)();
+    const singleLevelOptions = (0, _react.useMemo)(()=>options.reduce((acc, item)=>[
+                ...acc,
+                ...item.groupName ? item.list : [
+                    item
+                ]
+            ], []), [
+        options
+    ]);
+    const apply = ()=>{
+        var _textValue_split;
+        // вернет функциюю сравнения для метода filter с замкнутым массивом listValuesArr
+        // (по логике listValuesArr - массив полученный из строки textaria).
+        const getFilterFunction = (listValuesArr)=>(item)=>{
+                return listValuesArr.find((el)=>{
+                    const itemValue = item === null || item === void 0 ? void 0 : item.value.toString().toLowerCase();
+                    const itemLabel = (item.title || item.label || item.name || item.value).toString().toLowerCase();
+                    const chosenOption = el.toString().toLowerCase();
+                    const isChosenOptionIncludedInLabel = itemLabel.includes(chosenOption) && !chosenOptions.includes(item.value);
+                    if (isValuesInTags) return (chosenOption === itemValue || chosenOption === itemLabel) && !item.disabled;
+                    else if (isAdvancedLabelSearch) return (chosenOption === itemLabel || chosenOption === itemValue || isChosenOptionIncludedInLabel) && !item.disabled;
+                    else return (chosenOption === itemLabel || chosenOption === itemValue) && !item.disabled;
+                });
+            };
+        const textToArray = textValue === null || textValue === void 0 ? void 0 : (_textValue_split = textValue.split) === null || _textValue_split === void 0 ? void 0 : _textValue_split.call(textValue, ",").map((item)=>item.toString().trim()).filter((item)=>Boolean(item));
+        const newOptions = options.filter(getFilterFunction(textToArray)).map((option)=>option.value);
+        onChange(newOptions, "chosenOptions");
+        setListView(false);
+    };
+    const enterHandler = (e, value)=>{
+        if (e.keyCode === 13) {
+            const option = options === null || options === void 0 ? void 0 : options.find((item)=>{
+                var _item_title;
+                return (item === null || item === void 0 ? void 0 : (_item_title = item.title) === null || _item_title === void 0 ? void 0 : _item_title.toLowerCase()) === (value === null || value === void 0 ? void 0 : value.toLowerCase()) && !item.disabled;
+            });
+            const isOptionChecked = chosenOptions === null || chosenOptions === void 0 ? void 0 : chosenOptions.some((item)=>{
+                var _item_title, _option_title;
+                return (item === null || item === void 0 ? void 0 : (_item_title = item.title) === null || _item_title === void 0 ? void 0 : _item_title.toLowerCase()) === (option === null || option === void 0 ? void 0 : (_option_title = option.title) === null || _option_title === void 0 ? void 0 : _option_title.toLowerCase());
+            });
+            if (option && !isOptionChecked) onChange([
+                ...chosenOptions,
+                option
+            ], "chosenOptions");
+        }
+    };
+    (0, _react.useEffect)(()=>{
+        const getLabel = (el)=>el.title || el.label || el.name || el.value;
+        const valuesArr = chosenOptions === null || chosenOptions === void 0 ? void 0 : chosenOptions.map((item)=>isValuesInTags ? item : getLabel(singleLevelOptions.find((option)=>option.value === item)));
+        setTextValue(valuesArr.join(", "));
+    }, [
+        chosenOptions,
+        listView
+    ]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_SwitcherHide.default, {
+        isActive: isActive,
+        onChange: setIsActive,
+        label: label,
+        className: (0, _classnames.default)(RC, className),
+        isLabelBold: isLabelBold,
+        disabled: disabled,
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                className: `${RC}__wrap switcher-hide__content`,
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_TextSwitcher.default, {
+                        activeText: "is",
+                        inactiveText: "is not",
+                        isActive: isIncluded !== null && isIncluded !== void 0 ? isIncluded : true,
+                        onChange: setIsIncluded,
+                        className: `${RC}__text-switcher`
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                        className: "filter-select__wrap--buttons",
+                        children: [
+                            /*#__PURE__*/ (0, _jsxruntime.jsx)("button", {
+                                onClick: ()=>setListView(!listView),
+                                className: `${RC}__btn`,
+                                children: listView ? "Close" : "List view"
+                            }),
+                            listView && /*#__PURE__*/ (0, _jsxruntime.jsx)(_Button.default, {
+                                label: "Apply",
+                                className: `${RC}__apply`,
+                                onClick: ()=>apply()
+                            }),
+                            /*#__PURE__*/ (0, _jsxruntime.jsx)("button", {
+                                onClick: ()=>onChange([], "chosenOptions"),
+                                className: `${RC}__btn`,
+                                children: "Clear"
+                            })
+                        ]
+                    })
+                ]
+            }),
+            listView ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_Textarea.default, {
+                value: textValue,
+                onChange: (value)=>setTextValue(value)
+            }) : /*#__PURE__*/ (0, _jsxruntime.jsx)(_TagsDropdown.default, {
+                options: options,
+                chosenOptions: chosenOptions,
+                onChange: onChange,
+                className: `${RC}__tags-dropdown`,
+                onKeyPress: (e, value)=>enterHandler(e, value),
+                tagClassname: (0, _classnames.default)(`${RC}__tag`, {
+                    [`${RC}__tag_inactive`]: !isIncluded
+                }),
+                isValuesInTags: isValuesInTags
+            })
+        ]
+    });
+};
+const _default = SwitcherTagsDropdown;
+
+//# sourceMappingURL=SwitcherTagsDropdown.js.map

package/dist/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.js"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\n\nimport cn from \"classnames\";\n\nimport Button from \"../../UI/Button/Button\";\nimport SwitcherHide from \"../SwitcherHide/SwitcherHide\";\nimport TagsDropdown from \"../TagsDropdown/TagsDropdown\";\nimport TextSwitcher from \"../TextSwitcher/TextSwitcher\";\nimport Textarea from \"../Textarea/Textarea\";\n\nimport \"./SwitcherTagsDropdown.scss\";\n\nconst RC = \"switcher-tags-dropdown\";\n\nconst SwitcherTagsDropdown = ({\n  className,\n  label,\n  isLabelBold,\n  isValuesInTags,\n  isActive,\n  isIncluded,\n  isAdvancedLabelSearch,\n  disabled,\n  options = [],\n  chosenOptions = [],\n  setIsActive = () => {},\n  setIsIncluded = () => {},\n  onChange = () => {},\n}) => {\n  const [listView, setListView] = useState(false);\n  const [textValue, setTextValue] = useState();\n\n  const singleLevelOptions = useMemo(\n    () =>\n      options.reduce(\n        (acc, item) => [...acc, ...(item.groupName ? item.list : [item])],\n        [],\n      ),\n    [options],\n  );\n\n  const apply = () => {\n    // вернет функциюю сравнения для метода filter с замкнутым массивом listValuesArr\n    // (по логике listValuesArr - массив полученный из строки textaria).\n    const getFilterFunction = (listValuesArr) => (item) => {\n      return listValuesArr.find((el) => {\n        const itemValue = item?.value.toString().toLowerCase();\n        const itemLabel = (item.title || item.label || item.name || item.value)\n          .toString()\n          .toLowerCase();\n        const chosenOption = el.toString().toLowerCase();\n        const isChosenOptionIncludedInLabel =\n          itemLabel.includes(chosenOption) &&\n          !chosenOptions.includes(item.value);\n\n        if (isValuesInTags)\n          return (\n            (chosenOption === itemValue || chosenOption === itemLabel) &&\n            !item.disabled\n          );\n        else if (isAdvancedLabelSearch)\n          return (\n            (chosenOption === itemLabel ||\n              chosenOption === itemValue ||\n              isChosenOptionIncludedInLabel) &&\n            !item.disabled\n          );\n        else\n          return (\n            (chosenOption === itemLabel || chosenOption === itemValue) &&\n            !item.disabled\n          );\n      });\n    };\n\n    const textToArray = textValue\n      ?.split?.(\",\")\n      .map((item) => item.toString().trim())\n      .filter((item) => Boolean(item));\n    const newOptions = options\n      .filter(getFilterFunction(textToArray))\n      .map((option) => option.value);\n\n    onChange(newOptions, \"chosenOptions\");\n    setListView(false);\n  };\n\n  const enterHandler = (e, value) => {\n    if (e.keyCode === 13) {\n      const option = options?.find(\n        (item) =>\n          item?.title?.toLowerCase() === value?.toLowerCase() && !item.disabled,\n      );\n      const isOptionChecked = chosenOptions?.some(\n        (item) => item?.title?.toLowerCase() === option?.title?.toLowerCase(),\n      );\n      if (option && !isOptionChecked)\n        onChange([...chosenOptions, option], \"chosenOptions\");\n    }\n  };\n\n  useEffect(() => {\n    const getLabel = (el) => el.title || el.label || el.name || el.value;\n    const valuesArr = chosenOptions?.map((item) =>\n      isValuesInTags\n        ? item\n        : getLabel(singleLevelOptions.find((option) => option.value === item)),\n    );\n    setTextValue(valuesArr.join(\", \"));\n  }, [chosenOptions, listView]);\n\n  return (\n    <SwitcherHide\n      isActive={isActive}\n      onChange={setIsActive}\n      label={label}\n      className={cn(RC, className)}\n      isLabelBold={isLabelBold}\n      disabled={disabled}\n    >\n      <div className={`${RC}__wrap switcher-hide__content`}>\n        <TextSwitcher\n          activeText=\"is\"\n          inactiveText=\"is not\"\n          isActive={isIncluded ?? true}\n          onChange={setIsIncluded}\n          className={`${RC}__text-switcher`}\n        />\n        <div className=\"filter-select__wrap--buttons\">\n          <button\n            onClick={() => setListView(!listView)}\n            className={`${RC}__btn`}\n          >\n            {listView ? \"Close\" : \"List view\"}\n          </button>\n          {listView && (\n            <Button\n              label=\"Apply\"\n              className={`${RC}__apply`}\n              onClick={() => apply()}\n            />\n          )}\n          <button\n            onClick={() => onChange([], \"chosenOptions\")}\n            className={`${RC}__btn`}\n          >\n            Clear\n          </button>\n        </div>\n      </div>\n      {listView ? (\n        <Textarea value={textValue} onChange={(value) => setTextValue(value)} />\n      ) : (\n        <TagsDropdown\n          options={options}\n          chosenOptions={chosenOptions}\n          onChange={onChange}\n          className={`${RC}__tags-dropdown`}\n          onKeyPress={(e, value) => enterHandler(e, value)}\n          tagClassname={cn(`${RC}__tag`, {\n            [`${RC}__tag_inactive`]: !isIncluded,\n          })}\n          isValuesInTags={isValuesInTags}\n        />\n      )}\n    </SwitcherHide>\n  );\n};\n\nexport default SwitcherTagsDropdown;\n"],"names":["RC","SwitcherTagsDropdown","className","label","isLabelBold","isValuesInTags","isActive","isIncluded","isAdvancedLabelSearch","disabled","options","chosenOptions","setIsActive","setIsIncluded","onChange","listView","setListView","useState","textValue","setTextValue","singleLevelOptions","useMemo","reduce","acc","item","groupName","list","apply","getFilterFunction","listValuesArr","find","el","itemValue","value","toString","toLowerCase","itemLabel","title","name","chosenOption","isChosenOptionIncludedInLabel","includes","textToArray","split","map","trim","filter","Boolean","newOptions","option","enterHandler","e","keyCode","isOptionChecked","some","useEffect","getLabel","valuesArr","join","SwitcherHide","cn","div","TextSwitcher","activeText","inactiveText","button","onClick","Button","Textarea","TagsDropdown","onKeyPress","tagClassname"],"mappings":"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"}

package/dist/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.stories.js

@@ -0,0 +1,239 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    SwitcherTagsDropdownTemplate: function() {
+        return SwitcherTagsDropdownTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _SwitcherTagsDropdown = /*#__PURE__*/ _interop_require_default(require("./SwitcherTagsDropdown"));
+const _States = /*#__PURE__*/ _interop_require_default(require("./partial/States"));
+require("./partial/AnyOuterClass.scss");
+require("../../../../../scss/main.scss");
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+function _object_without_properties(source, excluded) {
+    if (source == null) return {};
+    var target = _object_without_properties_loose(source, excluded);
+    var key, i;
+    if (Object.getOwnPropertySymbols) {
+        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+        for(i = 0; i < sourceSymbolKeys.length; i++){
+            key = sourceSymbolKeys[i];
+            if (excluded.indexOf(key) >= 0) continue;
+            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+function _object_without_properties_loose(source, excluded) {
+    if (source == null) return {};
+    var target = {};
+    var sourceKeys = Object.keys(source);
+    var key, i;
+    for(i = 0; i < sourceKeys.length; i++){
+        key = sourceKeys[i];
+        if (excluded.indexOf(key) >= 0) continue;
+        target[key] = source[key];
+    }
+    return target;
+}
+global.lng = 'en';
+const _default = {
+    title: 'Form Elements/SwitcherTagsDropdown',
+    component: _SwitcherTagsDropdown.default
+};
+const DEFAULT_OTIONS = [
+    {
+        id: 1,
+        title: 'Tags Dropdown1',
+        value: 'drop1',
+        disabled: false
+    },
+    {
+        id: 2,
+        title: 'Tags Dropdown2',
+        value: 'drop2',
+        disabled: false
+    },
+    {
+        id: 3,
+        title: 'Tags Dropdown3',
+        value: 'drop3',
+        disabled: true
+    },
+    {
+        id: 4,
+        title: 'Tags Dropdown4',
+        value: 'drop4',
+        disabled: false
+    },
+    {
+        id: 5,
+        title: 'Tags Dropdown5',
+        value: 'drop5',
+        disabled: false
+    },
+    {
+        id: 6,
+        title: 'Tags Dropdown6',
+        value: 'drop6',
+        disabled: false
+    }
+];
+const Template = (args)=>{
+    const { isIncludeOuterStyles, isStatesAsOptions } = args, restArgs = _object_without_properties(args, [
+        "isIncludeOuterStyles",
+        "isStatesAsOptions"
+    ]);
+    const [values, setValues] = (0, _react.useState)({
+        isActive: true,
+        isIncluded: true,
+        value: []
+    });
+    const [options, setOptions] = (0, _react.useState)(isStatesAsOptions ? _States.default : DEFAULT_OTIONS);
+    const handleChange = (val, prop)=>{
+        setValues(_object_spread_props(_object_spread({}, values), {
+            [prop]: val
+        }));
+    };
+    (0, _react.useEffect)(()=>{
+        setValues(_object_spread_props(_object_spread({}, values), {
+            value: []
+        }));
+        setOptions(isStatesAsOptions ? _States.default : DEFAULT_OTIONS);
+    }, [
+        isStatesAsOptions
+    ]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_SwitcherTagsDropdown.default, _object_spread_props(_object_spread({}, restArgs), {
+        options: options,
+        isActive: values.isActive,
+        setIsActive: (val)=>handleChange(val, 'isActive'),
+        isIncluded: values.isIncluded,
+        setIsIncluded: (val)=>handleChange(val, 'isIncluded'),
+        chosenOptions: values.value,
+        onChange: (val)=>handleChange(val, 'value'),
+        className: isIncludeOuterStyles ? 'any-outer-class__switcher-tags-dropdown' : null
+    }));
+};
+const SwitcherTagsDropdownTemplate = Template.bind({});
+SwitcherTagsDropdownTemplate.args = {
+    isIncludeOuterStyles: false,
+    isStatesAsOptions: false,
+    disabled: false,
+    label: 'State',
+    isLabelBold: true,
+    isValuesInTags: true,
+    isAdvancedLabelSearch: false
+};
+
+//# sourceMappingURL=SwitcherTagsDropdown.stories.js.map