intelicoreact 1.4.20 → 1.4.22

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

@@ -65,8 +65,6 @@ const TagListToDropdown = _ref => {
     setIsEditMode(false);
   };
 
-  const onDropdownClose = () => {};
-
   (0, _react.useEffect)(() => {
     setNewValue(preparedValue); // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isEditMode]);
@@ -80,6 +78,7 @@ const TagListToDropdown = _ref => {
       chosenOptions: newValue,
       renderOptionsAsTags: true,
       withCreateLogic: true,
+      isUseLocalOptionsStore: false,
       onOptionEdit: option => {
         var _dropdownProps$onOpti;
 

package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.js

@@ -80,6 +80,7 @@ const TagsDropdown = _ref => {
     useLiveSearch,
     doRequest: doLiveSearchRequest,
     attributesOfNativeInput = {},
+    isUseLocalOptionsStore = true,
     withMobileLogic,
     withCreateLogic,
     withActions,
@@ -119,6 +120,7 @@ const TagsDropdown = _ref => {
     searchValue,
     delay: 600
   });
+  const [isValueDeleted, setIsValueDeleted] = (0, _react.useState)(false);
 
   const setSearchValueInterceptor = value => {
     setSearchValue(value);
@@ -128,7 +130,6 @@ const TagsDropdown = _ref => {
 
   const [options, setOptions] = (0, _react.useState)([]);
   const [editingOption, setEditingOption] = (0, _react.useState)(null);
-  const [isValueDeleted, setIsValueDeleted] = (0, _react.useState)(false);
   const [localOptionsStore, setLocalOptionsStore] = (0, _react.useState)({});
   const randomColorForNewOption = (0, _react.useMemo)(() => {
     const getRandomIndex = (min, max) => {
@@ -163,10 +164,10 @@ const TagsDropdown = _ref => {
     }
 
     return acc;
-  }, (_Object$keys = Object.keys(localOptionsStore)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.map(value => ({
+  }, isUseLocalOptionsStore ? (_Object$keys = Object.keys(localOptionsStore)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.map(value => ({
     value,
     label: localOptionsStore === null || localOptionsStore === void 0 ? void 0 : localOptionsStore[value]
-  }))); // --- GENERAL FUNCTIONS BEGIN --- //
+  })) : []); // --- GENERAL FUNCTIONS BEGIN --- //
 
   const handleClickOutside = e => {
     var _editOptionModalRef$c, _getListContainer, _customTriggerRef$cur, _customTriggerRef$cur2;
@@ -194,7 +195,7 @@ const TagsDropdown = _ref => {
     var _target$className, _target$className$ind, _target$className2, _target$className2$in;
 
     if ((target === null || target === void 0 ? void 0 : target.tagName) === "svg" && (target === null || target === void 0 ? void 0 : target.parentNodclassName) === "tag__button" || (target === null || target === void 0 ? void 0 : target.tagName) === "line") return false;
-    if ((target === null || target === void 0 ? void 0 : target.tagName) === "svg" && (target === null || target === void 0 ? void 0 : target.parentNodclassName) !== "tag__button" || (target === null || target === void 0 ? void 0 : (_target$className = target.className) === null || _target$className === void 0 ? void 0 : (_target$className$ind = _target$className.indexOf) === null || _target$className$ind === void 0 ? void 0 : _target$className$ind.call(_target$className, "tag__label")) !== -1 || (target === null || target === void 0 ? void 0 : (_target$className2 = target.className) === null || _target$className2 === void 0 ? void 0 : (_target$className2$in = _target$className2.indexOf) === null || _target$className2$in === void 0 ? void 0 : _target$className2$in.call(_target$className2, "tag-list_wrapper")) !== -1 || (target === null || target === void 0 ? void 0 : target.className) === "".concat(RC, "__trigger") || (target === null || target === void 0 ? void 0 : target.className) === "tags-dropdown__arrow") return true;
+    if ((target === null || target === void 0 ? void 0 : target.tagName) === "svg" && (target === null || target === void 0 ? void 0 : target.parentNodclassName) !== "tag__button" || (target === null || target === void 0 ? void 0 : (_target$className = target.className) === null || _target$className === void 0 ? void 0 : (_target$className$ind = _target$className.indexOf) === null || _target$className$ind === void 0 ? void 0 : _target$className$ind.call(_target$className, "tag__label")) !== -1 || (target === null || target === void 0 ? void 0 : (_target$className2 = target.className) === null || _target$className2 === void 0 ? void 0 : (_target$className2$in = _target$className2.indexOf) === null || _target$className2$in === void 0 ? void 0 : _target$className2$in.call(_target$className2, "tag-list_wrapper")) !== -1 || (target === null || target === void 0 ? void 0 : target.className.indexOf("".concat(RC, "__trigger"))) !== -1 || (target === null || target === void 0 ? void 0 : target.className) === "tags-dropdown__arrow") return true;
     return false;
   };
 
@@ -242,9 +243,13 @@ const TagsDropdown = _ref => {
 
   const deleteChosen = value => {
     if (isMobile ? closeOnRemoveMobile : closeOnRemove) setIsOpen(false);
-    setLocalOptionsStore(options => ({ ...options,
-      [value]: undefined
-    }));
+
+    if (isUseLocalOptionsStore) {
+      setLocalOptionsStore(options => ({ ...options,
+        [value]: undefined
+      }));
+    }
+
     onChange(chosenOptions.filter(item => item !== value), "chosenOptions");
   };
 
@@ -262,9 +267,12 @@ const TagsDropdown = _ref => {
       return null;
     }
 
-    setLocalOptionsStore(options => ({ ...options,
-      [item === null || item === void 0 ? void 0 : item.value]: item === null || item === void 0 ? void 0 : item.label
-    }));
+    if (isUseLocalOptionsStore) {
+      setLocalOptionsStore(options => ({ ...options,
+        [item === null || item === void 0 ? void 0 : item.value]: item === null || item === void 0 ? void 0 : item.label
+      }));
+    }
+
     onChange([...chosenOptions, item.value], "chosenOptions");
     return null;
   };
@@ -293,14 +301,18 @@ const TagsDropdown = _ref => {
       } = _ref3;
       return !isFreezed && !(chosenOptions !== null && chosenOptions !== void 0 && chosenOptions.includes(value)) && value !== "open_modal";
     });
-    setLocalOptionsStore(options => preparedOptions === null || preparedOptions === void 0 ? void 0 : preparedOptions.reduce((result, _ref4) => {
-      let {
-        value,
-        label
-      } = _ref4;
-      result[value] = label;
-      return result;
-    }, options));
+
+    if (isUseLocalOptionsStore) {
+      setLocalOptionsStore(options => preparedOptions === null || preparedOptions === void 0 ? void 0 : preparedOptions.reduce((result, _ref4) => {
+        let {
+          value,
+          label
+        } = _ref4;
+        result[value] = label;
+        return result;
+      }, options));
+    }
+
     onChange([...chosenOptions, ...((preparedOptions === null || preparedOptions === void 0 ? void 0 : preparedOptions.map(_ref5 => {
       let {
         value
@@ -311,7 +323,7 @@ const TagsDropdown = _ref => {
   };
 
   const unselectAllItems = () => {
-    setLocalOptionsStore({});
+    if (isUseLocalOptionsStore) setLocalOptionsStore({});
     onChange(chosenOptions === null || chosenOptions === void 0 ? void 0 : chosenOptions.filter(item => {
       var _prepareOptions2, _prepareOptions2$find;
 
@@ -791,7 +803,10 @@ const TagsDropdown = _ref => {
           let {
             target
           } = _ref14;
-          if ((target === null || target === void 0 ? void 0 : target.tagName) === "INPUT") setIsOpen(true);else if (isTargetInParent(target)) {
+
+          if ((target === null || target === void 0 ? void 0 : target.tagName) === "INPUT") {
+            setIsOpen(true);
+          } else if (isTargetInParent(target)) {
             setIsOpen(isOpen => !isOpen);
           }
         }
@@ -893,7 +908,7 @@ const TagsDropdown = _ref => {
     setEditOptionModalStyles();
   }, [isOpen, chosenOptions, isMobile, dropdownListWrapperRef === null || dropdownListWrapperRef === void 0 ? void 0 : (_dropdownListWrapperR2 = dropdownListWrapperRef.current) === null || _dropdownListWrapperR2 === void 0 ? void 0 : (_dropdownListWrapperR3 = _dropdownListWrapperR2.getBoundingClientRect()) === null || _dropdownListWrapperR3 === void 0 ? void 0 : _dropdownListWrapperR3.height, recalculateListContainerStylesTrigger]);
   (0, _react.useEffect)(() => {
-    if (chosenOptions.length !== Object.keys(localOptionsStore).length) {
+    if (isUseLocalOptionsStore && chosenOptions.length !== Object.keys(localOptionsStore).length) {
       options.map(option => {
         if (!(localOptionsStore !== null && localOptionsStore !== void 0 && localOptionsStore[option === null || option === void 0 ? void 0 : option.value])) {
           setLocalOptionsStore(options => ({ ...options,
@@ -902,7 +917,7 @@ const TagsDropdown = _ref => {
         }
       });
     }
-  }, [chosenOptions]);
+  }, [chosenOptions, isUseLocalOptionsStore]);
   (0, _react.useEffect)(() => {
     var _selectAllButtonRef$c, _unselectAllButtonRef;
 

package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.scss

@@ -123,6 +123,7 @@
   }
 
   &__creatable-helper {
+    background: #fff;
     color: var(--Text-Title, #9AA0B9);
     font-family: Roboto;
     font-size: 11px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intelicoreact",
-  "version": "1.4.20",
+  "version": "1.4.22",
   "description": "",
   "main": "dist/index.js",
   "files": [