intelicoreact 1.6.7 → 1.6.8

package/dist/Atomic/FormElements/TagListToDropdown/TagListToDropdown.js

@@ -0,0 +1,200 @@
+"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 _TagList = /*#__PURE__*/ _interop_require_default(require("../../UI/TagList/TagList"));
+const _TagsDropdown = /*#__PURE__*/ _interop_require_default(require("../TagsDropdown/TagsDropdown"));
+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;
+}
+const TagListToDropdown = ({ options, value = [], dropdownProps = {}, listProps = {}, onChange, useDropdownCompactMode })=>{
+    const preparedValue = value.map(({ value })=>value);
+    const [isEditMode, setIsEditMode] = (0, _react.useState)(false);
+    const [isRenderAllTags, setIsRenderAllTags] = (0, _react.useState)(false);
+    const [newValue, setNewValue] = (0, _react.useState)(preparedValue);
+    const [isValueChanged, setIsValueChanged] = (0, _react.useState)(false);
+    const [isLoading, setIsLoading] = (0, _react.useState)(false);
+    const tagListRef = (0, _react.useRef)(null);
+    const onConfirmChangesClick = ()=>{
+        if (isValueChanged) {
+            var _this;
+            setIsLoading(true);
+            setIsValueChanged(false);
+            (_this = new Promise((r)=>{
+                const onChangeResult = onChange(options.filter(({ value })=>newValue.includes(value)));
+                if (onChangeResult instanceof Promise) {
+                    onChangeResult.then((data)=>r(data));
+                } else {
+                    r();
+                }
+            })) === null || _this === void 0 ? void 0 : _this.finally(()=>{
+                setIsEditMode(false);
+                setIsLoading(false);
+            });
+        } else {
+            setIsEditMode(false);
+        }
+    };
+    (0, _react.useEffect)(()=>{
+        setNewValue(preparedValue);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [
+        isEditMode
+    ]);
+    const renderTagsDropdown = (props)=>{
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TagsDropdown.default, _object_spread_props(_object_spread(_object_spread_props(_object_spread({}, dropdownProps), {
+            disabled: isLoading,
+            options: options,
+            chosenOptions: newValue,
+            renderOptionsAsTags: true,
+            withCreateLogic: true,
+            isUseLocalOptionsStore: false,
+            onOptionEdit: dropdownProps === null || dropdownProps === void 0 ? void 0 : dropdownProps.onOptionEdit,
+            onOptionDelete: dropdownProps === null || dropdownProps === void 0 ? void 0 : dropdownProps.onOptionDelete,
+            onOptionCreate: dropdownProps === null || dropdownProps === void 0 ? void 0 : dropdownProps.onOptionCreate,
+            onActionConfirmClick: onConfirmChangesClick,
+            onActionCancelClick: ()=>setIsEditMode((v)=>!v),
+            onChange: (data)=>{
+                setNewValue(data);
+                setIsValueChanged(true);
+            }
+        }), props), {
+            isDefaultOpened: isEditMode
+        }));
+    };
+    const renderTagsList = (props)=>{
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TagList.default, _object_spread(_object_spread_props(_object_spread({
+            disabled: isLoading,
+            refProp: tagListRef
+        }, listProps), {
+            items: value,
+            onEditClick: ()=>setIsEditMode((v)=>!v)
+        }), props));
+    };
+    const renderCompactMode = ()=>{
+        return renderTagsDropdown({
+            withActions: false,
+            withSearchInputInList: true,
+            customTriggerRef: tagListRef,
+            recalculateListContainerStylesTrigger: isRenderAllTags,
+            onDropdownListClose: onConfirmChangesClick,
+            renderCustomTrigger: ({ isOpen, setIsOpen, inputRef })=>renderTagsList({
+                    onToggleRenderAll: (v)=>setTimeout(()=>setIsRenderAllTags(v), 1),
+                    onEditClick: ()=>{
+                        setIsOpen(!isEditMode);
+                        if (isEditMode) onConfirmChangesClick();
+                        else setIsEditMode(true);
+                    }
+                })
+        });
+    };
+    return useDropdownCompactMode ? renderCompactMode() : isEditMode ? renderTagsDropdown({
+        withActions: true
+    }) : renderTagsList();
+};
+const _default = TagListToDropdown;
+
+//# sourceMappingURL=TagListToDropdown.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/Atomic/FormElements/TagListToDropdown/TagListToDropdown.js"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\n\nimport TagList from \"../../UI/TagList/TagList\";\nimport TagsDropdown from \"../TagsDropdown/TagsDropdown\";\n\nconst TagListToDropdown = ({\n  options,\n  value = [],\n  dropdownProps = {},\n  listProps = {},\n  onChange,\n  useDropdownCompactMode,\n}) => {\n  const preparedValue = value.map(({ value }) => value);\n  const [isEditMode, setIsEditMode] = useState(false);\n  const [isRenderAllTags, setIsRenderAllTags] = useState(false);\n  const [newValue, setNewValue] = useState(preparedValue);\n  const [isValueChanged, setIsValueChanged] = useState(false);\n\n  const [isLoading, setIsLoading] = useState(false);\n\n  const tagListRef = useRef(null);\n\n  const onConfirmChangesClick = () => {\n    if (isValueChanged) {\n      setIsLoading(true);\n      setIsValueChanged(false);\n      new Promise((r) => {\n        const onChangeResult = onChange(\n          options.filter(({ value }) => newValue.includes(value)),\n        );\n        if (onChangeResult instanceof Promise) {\n          onChangeResult.then((data) => r(data));\n        } else {\n          r();\n        }\n      })?.finally(() => {\n        setIsEditMode(false);\n        setIsLoading(false);\n      });\n    } else {\n      setIsEditMode(false);\n    }\n  };\n\n  useEffect(() => {\n    setNewValue(preparedValue);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isEditMode]);\n\n  const renderTagsDropdown = (props) => {\n    return (\n      <TagsDropdown\n        {...dropdownProps}\n        disabled={isLoading}\n        options={options}\n        chosenOptions={newValue}\n        renderOptionsAsTags\n        withCreateLogic\n        isUseLocalOptionsStore={false}\n        onOptionEdit={dropdownProps?.onOptionEdit}\n        onOptionDelete={dropdownProps?.onOptionDelete}\n        onOptionCreate={dropdownProps?.onOptionCreate}\n        onActionConfirmClick={onConfirmChangesClick}\n        onActionCancelClick={() => setIsEditMode((v) => !v)}\n        onChange={(data) => {\n          setNewValue(data);\n          setIsValueChanged(true);\n        }}\n        {...props}\n        isDefaultOpened={isEditMode}\n      />\n    );\n  };\n\n  const renderTagsList = (props) => {\n    return (\n      <TagList\n        disabled={isLoading}\n        refProp={tagListRef}\n        {...listProps}\n        items={value}\n        onEditClick={() => setIsEditMode((v) => !v)}\n        {...props}\n      />\n    );\n  };\n\n  const renderCompactMode = () => {\n    return renderTagsDropdown({\n      withActions: false,\n      withSearchInputInList: true,\n      customTriggerRef: tagListRef,\n      recalculateListContainerStylesTrigger: isRenderAllTags,\n      onDropdownListClose: onConfirmChangesClick,\n      renderCustomTrigger: ({ isOpen, setIsOpen, inputRef }) =>\n        renderTagsList({\n          onToggleRenderAll: (v) => setTimeout(() => setIsRenderAllTags(v), 1),\n          onEditClick: () => {\n            setIsOpen(!isEditMode);\n            if (isEditMode) onConfirmChangesClick();\n            else setIsEditMode(true);\n          },\n        }),\n    });\n  };\n\n  return useDropdownCompactMode\n    ? renderCompactMode()\n    : isEditMode\n      ? renderTagsDropdown({ withActions: true })\n      : renderTagsList();\n};\n\nexport default TagListToDropdown;\n"],"names":["TagListToDropdown","options","value","dropdownProps","listProps","onChange","useDropdownCompactMode","preparedValue","map","isEditMode","setIsEditMode","useState","isRenderAllTags","setIsRenderAllTags","newValue","setNewValue","isValueChanged","setIsValueChanged","isLoading","setIsLoading","tagListRef","useRef","onConfirmChangesClick","Promise","r","onChangeResult","filter","includes","then","data","finally","useEffect","renderTagsDropdown","props","TagsDropdown","disabled","chosenOptions","renderOptionsAsTags","withCreateLogic","isUseLocalOptionsStore","onOptionEdit","onOptionDelete","onOptionCreate","onActionConfirmClick","onActionCancelClick","v","isDefaultOpened","renderTagsList","TagList","refProp","items","onEditClick","renderCompactMode","withActions","withSearchInputInList","customTriggerRef","recalculateListContainerStylesTrigger","onDropdownListClose","renderCustomTrigger","isOpen","setIsOpen","inputRef","onToggleRenderAll","setTimeout"],"mappings":";;;;+BAkHA;;;eAAA;;;;+DAlHmD;gEAE/B;qEACK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEzB,MAAMA,oBAAoB,CAAC,EACzBC,OAAO,EACPC,QAAQ,EAAE,EACVC,gBAAgB,CAAC,CAAC,EAClBC,YAAY,CAAC,CAAC,EACdC,QAAQ,EACRC,sBAAsB,EACvB;IACC,MAAMC,gBAAgBL,MAAMM,GAAG,CAAC,CAAC,EAAEN,KAAK,EAAE,GAAKA;IAC/C,MAAM,CAACO,YAAYC,cAAc,GAAGC,IAAAA,eAAQ,EAAC;IAC7C,MAAM,CAACC,iBAAiBC,mBAAmB,GAAGF,IAAAA,eAAQ,EAAC;IACvD,MAAM,CAACG,UAAUC,YAAY,GAAGJ,IAAAA,eAAQ,EAACJ;IACzC,MAAM,CAACS,gBAAgBC,kBAAkB,GAAGN,IAAAA,eAAQ,EAAC;IAErD,MAAM,CAACO,WAAWC,aAAa,GAAGR,IAAAA,eAAQ,EAAC;IAE3C,MAAMS,aAAaC,IAAAA,aAAM,EAAC;IAE1B,MAAMC,wBAAwB;QAC5B,IAAIN,gBAAgB;gBAGlB;YAFAG,aAAa;YACbF,kBAAkB;aAClB,QAAA,IAAIM,QAAQ,CAACC;gBACX,MAAMC,iBAAiBpB,SACrBJ,QAAQyB,MAAM,CAAC,CAAC,EAAExB,KAAK,EAAE,GAAKY,SAASa,QAAQ,CAACzB;gBAElD,IAAIuB,0BAA0BF,SAAS;oBACrCE,eAAeG,IAAI,CAAC,CAACC,OAASL,EAAEK;gBAClC,OAAO;oBACLL;gBACF;YACF,gBATA,4BAAA,MASIM,OAAO,CAAC;gBACVpB,cAAc;gBACdS,aAAa;YACf;QACF,OAAO;YACLT,cAAc;QAChB;IACF;IAEAqB,IAAAA,gBAAS,EAAC;QACRhB,YAAYR;IACZ,uDAAuD;IACzD,GAAG;QAACE;KAAW;IAEf,MAAMuB,qBAAqB,CAACC;QAC1B,qBACE,qBAACC,qBAAY,8EACP/B;YACJgC,UAAUjB;YACVjB,SAASA;YACTmC,eAAetB;YACfuB,mBAAmB;YACnBC,eAAe;YACfC,wBAAwB;YACxBC,YAAY,EAAErC,0BAAAA,oCAAAA,cAAeqC,YAAY;YACzCC,cAAc,EAAEtC,0BAAAA,oCAAAA,cAAesC,cAAc;YAC7CC,cAAc,EAAEvC,0BAAAA,oCAAAA,cAAeuC,cAAc;YAC7CC,sBAAsBrB;YACtBsB,qBAAqB,IAAMlC,cAAc,CAACmC,IAAM,CAACA;YACjDxC,UAAU,CAACwB;gBACTd,YAAYc;gBACZZ,kBAAkB;YACpB;YACIgB;YACJa,iBAAiBrC;;IAGvB;IAEA,MAAMsC,iBAAiB,CAACd;QACtB,qBACE,qBAACe,gBAAO;YACNb,UAAUjB;YACV+B,SAAS7B;WACLhB;YACJ8C,OAAOhD;YACPiD,aAAa,IAAMzC,cAAc,CAACmC,IAAM,CAACA;YACrCZ;IAGV;IAEA,MAAMmB,oBAAoB;QACxB,OAAOpB,mBAAmB;YACxBqB,aAAa;YACbC,uBAAuB;YACvBC,kBAAkBnC;YAClBoC,uCAAuC5C;YACvC6C,qBAAqBnC;YACrBoC,qBAAqB,CAAC,EAAEC,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GACnDd,eAAe;oBACbe,mBAAmB,CAACjB,IAAMkB,WAAW,IAAMlD,mBAAmBgC,IAAI;oBAClEM,aAAa;wBACXS,UAAU,CAACnD;wBACX,IAAIA,YAAYa;6BACXZ,cAAc;oBACrB;gBACF;QACJ;IACF;IAEA,OAAOJ,yBACH8C,sBACA3C,aACEuB,mBAAmB;QAAEqB,aAAa;IAAK,KACvCN;AACR;MAEA,WAAe/C"}

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

@@ -0,0 +1,184 @@
+"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, {
+    TagListToDropdownTemplate: function() {
+        return TagListToDropdownTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _TagListToDropdown = /*#__PURE__*/ _interop_require_default(require("./TagListToDropdown"));
+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;
+}
+global.lng = "en";
+const _default = {
+    title: "Form Elements/TagListToDropdown",
+    component: _TagListToDropdown.default,
+    argTypes: {}
+};
+const Template = (args)=>{
+    const [value, setValue] = (0, _react.useState)([]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TagListToDropdown.default, _object_spread_props(_object_spread({}, args), {
+        value: value,
+        onChange: setValue
+    }));
+};
+const TagListToDropdownTemplate = Template.bind({});
+const colors = [
+    "#F1F0F0",
+    "#E3E2E0",
+    "#EEDFDA",
+    "#F9DEC9",
+    "#FDECC8",
+    "#DBECDB",
+    "#D3E4EF",
+    "#E8DEEE",
+    "#F4E0E9",
+    "#FFE2DD",
+    "#D3EFED",
+    "#ECEEDE"
+];
+TagListToDropdownTemplate.args = {
+    dropdownProps: {
+        listClassName: "",
+        fieldKey: "tagsDropDown",
+        isIncludeOuterStyles: false,
+        disabled: false,
+        error: false,
+        onOptionEdit: (...args)=>console.log("onOptionEdit", ...args),
+        onOptionDelete: (...args)=>new Promise((r)=>{
+                console.log("onOptionDelete", ...args);
+                setTimeout(()=>{
+                    console.log("resolved");
+                    r();
+                }, 1000);
+            }),
+        placeholder: "Type or select tags from list",
+        isNotValidateASCII: false,
+        noTagsWrap: false,
+        closeOnSelect: false,
+        closeOnRemove: false
+    },
+    options: new Array(12).fill({}).map((v, i)=>{
+        const uuid = Math.random().toString(16).slice(2);
+        return {
+            id: uuid,
+            label: `Option ${i + 1}`,
+            value: uuid,
+            style: {
+                backgroundColor: colors[i]
+            },
+            isEditable: true
+        };
+    })
+};
+
+//# sourceMappingURL=TagListToDropdown.stories.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/Atomic/FormElements/TagListToDropdown/TagListToDropdown.stories.js"],"sourcesContent":["import React, { useRef, useState } from \"react\";\nimport TagListToDropdown from \"./TagListToDropdown\";\n\nimport \"../../../../../scss/main.scss\";\n\nglobal.lng = \"en\";\n\nexport default {\n  title: \"Form Elements/TagListToDropdown\",\n  component: TagListToDropdown,\n  argTypes: {},\n};\n\nconst Template = (args) => {\n  const [value, setValue] = useState([]);\n\n  return <TagListToDropdown {...args} value={value} onChange={setValue}/>;\n};\n\nexport const TagListToDropdownTemplate = Template.bind({});\n\nconst colors = [\n  \"#F1F0F0\",\n  \"#E3E2E0\",\n  \"#EEDFDA\",\n  \"#F9DEC9\",\n  \"#FDECC8\",\n  \"#DBECDB\",\n  \"#D3E4EF\",\n  \"#E8DEEE\",\n  \"#F4E0E9\",\n  \"#FFE2DD\",\n  \"#D3EFED\",\n  \"#ECEEDE\",\n];\n\nTagListToDropdownTemplate.args = {\n  dropdownProps: {\n    listClassName:\"\",\n\n    fieldKey: \"tagsDropDown\",\n    isIncludeOuterStyles: false,\n    disabled: false,\n    error: false,\n    onOptionEdit: (...args) => console.log(\"onOptionEdit\", ...args),\n    onOptionDelete: (...args) =>\n      new Promise((r) => {\n        console.log(\"onOptionDelete\", ...args);\n        setTimeout(() => {\n          console.log(\"resolved\");\n          r();\n        }, 1000);\n      }),\n    placeholder: \"Type or select tags from list\",\n    isNotValidateASCII: false,\n    noTagsWrap: false,\n    closeOnSelect: false,\n    closeOnRemove: false,\n  },\n  options: new Array(12).fill({}).map((v, i) => {\n    const uuid = Math.random().toString(16).slice(2);\n    return {\n      id: uuid,\n      label: `Option ${i + 1}`,\n      value: uuid,\n      style: {\n        backgroundColor: colors[i],\n      },\n      isEditable: true,\n    };\n  }),\n};\n"],"names":["TagListToDropdownTemplate","global","lng","title","component","TagListToDropdown","argTypes","Template","args","value","setValue","useState","onChange","bind","colors","dropdownProps","listClassName","fieldKey","isIncludeOuterStyles","disabled","error","onOptionEdit","console","log","onOptionDelete","Promise","r","setTimeout","placeholder","isNotValidateASCII","noTagsWrap","closeOnSelect","closeOnRemove","options","Array","fill","map","v","i","uuid","Math","random","toString","slice","id","label","style","backgroundColor","isEditable"],"mappings":";;;;;;;;;;;IAmBaA,yBAAyB;eAAzBA;;IAZb,OAIE;eAJF;;;;+DAPwC;0EACV;QAEvB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEPC,OAAOC,GAAG,GAAG;MAEb,WAAe;IACbC,OAAO;IACPC,WAAWC,0BAAiB;IAC5BC,UAAU,CAAC;AACb;AAEA,MAAMC,WAAW,CAACC;IAChB,MAAM,CAACC,OAAOC,SAAS,GAAGC,IAAAA,eAAQ,EAAC,EAAE;IAErC,qBAAO,qBAACN,0BAAiB,0CAAKG;QAAMC,OAAOA;QAAOG,UAAUF;;AAC9D;AAEO,MAAMV,4BAA4BO,SAASM,IAAI,CAAC,CAAC;AAExD,MAAMC,SAAS;IACb;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACD;AAEDd,0BAA0BQ,IAAI,GAAG;IAC/BO,eAAe;QACbC,eAAc;QAEdC,UAAU;QACVC,sBAAsB;QACtBC,UAAU;QACVC,OAAO;QACPC,cAAc,CAAC,GAAGb,OAASc,QAAQC,GAAG,CAAC,mBAAmBf;QAC1DgB,gBAAgB,CAAC,GAAGhB,OAClB,IAAIiB,QAAQ,CAACC;gBACXJ,QAAQC,GAAG,CAAC,qBAAqBf;gBACjCmB,WAAW;oBACTL,QAAQC,GAAG,CAAC;oBACZG;gBACF,GAAG;YACL;QACFE,aAAa;QACbC,oBAAoB;QACpBC,YAAY;QACZC,eAAe;QACfC,eAAe;IACjB;IACAC,SAAS,IAAIC,MAAM,IAAIC,IAAI,CAAC,CAAC,GAAGC,GAAG,CAAC,CAACC,GAAGC;QACtC,MAAMC,OAAOC,KAAKC,MAAM,GAAGC,QAAQ,CAAC,IAAIC,KAAK,CAAC;QAC9C,OAAO;YACLC,IAAIL;YACJM,OAAO,CAAC,OAAO,EAAEP,IAAI,GAAG;YACxB7B,OAAO8B;YACPO,OAAO;gBACLC,iBAAiBjC,MAAM,CAACwB,EAAE;YAC5B;YACAU,YAAY;QACd;IACF;AACF"}