@true-engineering/true-react-common-ui-kit 3.8.1 → 3.9.1

package/dist/true-react-common-ui-kit.umd.cjs

@@ -9099,12 +9099,12 @@
     });
     var _useState = _sliced_to_array$o(React.useState(false), 2), isSelected = _useState[0], setIsSelected = _useState[1];
     var hasAction = !isDisabled && !isReadonly;
-    var onToggle = function() {
+    var onToggle = function(event) {
       var isSelectedNext = !isSelected;
       onSelect({
         value,
         isSelected: isSelectedNext
-      });
+      }, event);
       setIsSelected(isSelectedNext);
     };
     React.useEffect(function() {
@@ -10840,8 +10840,8 @@
         isSemiChecked,
         isDisabled,
         tweakStyles: checkboxStyles$1,
-        onSelect: function(v) {
-          return onToggleCheckbox(index, v.isSelected);
+        onSelect: function(v, event) {
+          return onToggleCheckbox(index, v.isSelected, event);
         },
         children
       }) : children
@@ -10963,7 +10963,7 @@
                 },
                 children: defaultOptionLabel
               }),
-              trueReactPlatformHelpers.isStringNotEmpty(allOptionsLabel) && /* @__PURE__ */ jsx(SelectListItem, {
+              trueReactPlatformHelpers.isReactNodeNotEmpty(allOptionsLabel) && /* @__PURE__ */ jsx(SelectListItem, {
                 classes,
                 index: ALL_OPTION_INDEX,
                 isSemiChecked: selectedOptionsCount > 0 && !areAllOptionsSelected,
@@ -11444,7 +11444,9 @@
     var classes = useStyles$B({
       theme: tweakStyles
     });
-    var shouldRenderSearchInputInList = (searchInput === null || searchInput === void 0 ? void 0 : searchInput.shouldRenderInList) === true;
+    var _ref = searchInput !== null && searchInput !== void 0 ? searchInput : {}, tmp = _ref.shouldRenderInList, shouldRenderSearchInputInList = tmp === void 0 ? false : tmp, searchInputProps = _object_without_properties$9(_ref, [
+      "shouldRenderInList"
+    ]);
     var hasSearchInputInList = optionsMode !== "normal" && shouldRenderSearchInputInList;
     var isMultiSelect = isMultiSelectValue(props);
     var hasReadonlyInput = isReadonly || optionsMode === "normal" || shouldRenderSearchInputInList;
@@ -11523,7 +11525,11 @@
         return acc;
       }, []));
     }, [
-      filteredOptions
+      filteredOptions,
+      hasDefaultOption,
+      isOptionDisabled,
+      shouldShowAllOption,
+      shouldShowDefaultOption
     ]);
     var stringValue = trueReactPlatformHelpers.isNotEmpty(strValue) ? convertValueToString(strValue) : void 0;
     var showedStringValue = areAllOptionsSelected && trueReactPlatformHelpers.isNotEmpty(allOptionsLabel) ? allOptionsLabel : stringValue;
@@ -11566,9 +11572,9 @@
         handleListClose(event);
       }
     };
-    var handleOnChange = React.useCallback(function(newValue) {
+    var handleOnChange = React.useCallback(function(newValue, event) {
       if (!compareValuesOnChange(value, newValue)) {
-        onChange(newValue);
+        onChange(newValue, event);
       }
     }, [
       value,
@@ -11577,7 +11583,7 @@
     ]);
     var handleOptionSelect = React.useCallback(function(index, event) {
       var _input_current;
-      handleOnChange(index === DEFAULT_OPTION_INDEX ? void 0 : filteredOptions[index]);
+      handleOnChange(index === DEFAULT_OPTION_INDEX ? void 0 : filteredOptions[index], event);
       handleListClose(event);
       (_input_current = input.current) === null || _input_current === void 0 ? void 0 : _input_current.blur();
     }, [
@@ -11585,16 +11591,16 @@
       handleListClose,
       filteredOptions
     ]);
-    var handleToggleOptionCheckbox = React.useCallback(function(index, isSelected) {
+    var handleToggleOptionCheckbox = React.useCallback(function(index, isSelected, event) {
       if (!isMultiSelect) {
         return;
       }
       if (index === DEFAULT_OPTION_INDEX || index === ALL_OPTION_INDEX && !isSelected) {
-        handleOnChange(void 0);
+        handleOnChange(void 0, event);
         return;
       }
       if (index === ALL_OPTION_INDEX && isSelected) {
-        handleOnChange(availableOptions);
+        handleOnChange(availableOptions, event);
         return;
       }
       var option = filteredOptions[index];
@@ -11608,12 +11614,14 @@
         value === null || value === void 0 ? void 0 : value.filter(function(o) {
           return convertToId(o) !== convertToId(option);
         })
-      ));
+      ), event);
     }, [
-      handleOnChange,
-      filteredOptions,
       isMultiSelect,
-      value
+      filteredOptions,
+      handleOnChange,
+      value,
+      availableOptions,
+      convertToId
     ]);
     var handleOnType = React.useCallback(function() {
       var _ref2 = _async_to_generator$4(function(v) {
@@ -11650,14 +11658,17 @@
         return _ref2.apply(this, arguments);
       };
     }(), [
+      isMounted,
       onType,
       optionsMode
     ]);
-    var debounceHandleOnType = React.useCallback(tsDebounce.debounce(handleOnType, debounceTime), [
+    var debounceHandleOnType = React.useMemo(function() {
+      return tsDebounce.debounce(handleOnType, debounceTime);
+    }, [
       handleOnType,
       debounceTime
     ]);
-    var handleInputChange = function(v) {
+    var handleInputChange = function(v, event) {
       if (onType !== void 0) {
         debounceHandleOnType(v);
       }
@@ -11665,7 +11676,7 @@
         setShouldShowDefaultOption(v === "");
       }
       if (v === "" && !hasSearchInputInList) {
-        handleOnChange(void 0);
+        handleOnChange(void 0, event);
       }
       setSearchValue(v);
     };
@@ -11695,7 +11706,7 @@
                 return convertToId(opt) === valueIdToSelect;
               })) !== null && _value_some !== void 0 ? _value_some : false;
             }
-            handleToggleOptionCheckbox(indexToSelect, !isThisValueAlreadySelected);
+            handleToggleOptionCheckbox(indexToSelect, !isThisValueAlreadySelected, event);
           } else {
             handleOptionSelect(indexToSelect, event);
           }
@@ -11737,7 +11748,7 @@
       hasSearchInputInList) && // Последняя проверка на случай, если мы че то ищем в опциях
       (optionsMode === "normal" || hasEnoughSymbolsToSearch)
     );
-    var _ref = dropdownOptions !== null && dropdownOptions !== void 0 ? dropdownOptions : {}, _ref_shouldUsePopper = _ref.shouldUsePopper, shouldUsePopper = _ref_shouldUsePopper === void 0 ? false : _ref_shouldUsePopper, _ref_shouldRenderInBody = _ref.shouldRenderInBody, shouldRenderInBody = _ref_shouldRenderInBody === void 0 ? false : _ref_shouldRenderInBody, _ref_shouldHideOnScroll = _ref.shouldHideOnScroll, shouldHideOnScroll = _ref_shouldHideOnScroll === void 0 ? false : _ref_shouldHideOnScroll;
+    var _ref1 = dropdownOptions !== null && dropdownOptions !== void 0 ? dropdownOptions : {}, _ref_shouldUsePopper = _ref1.shouldUsePopper, shouldUsePopper = _ref_shouldUsePopper === void 0 ? false : _ref_shouldUsePopper, _ref_shouldRenderInBody = _ref1.shouldRenderInBody, shouldRenderInBody = _ref_shouldRenderInBody === void 0 ? false : _ref_shouldRenderInBody, _ref_shouldHideOnScroll = _ref1.shouldHideOnScroll, shouldHideOnScroll = _ref_shouldHideOnScroll === void 0 ? false : _ref_shouldHideOnScroll;
     var popperData = useDropdown({
       isOpen,
       onDropdownClose: handleListClose,
@@ -11776,15 +11787,15 @@
     }, popperData === null || popperData === void 0 ? void 0 : popperData.attributes.popper), {
       children: isOpen && /* @__PURE__ */ jsx(SelectList, {
         options: filteredOptions,
-        defaultOptionLabel: hasDefaultOption && shouldShowDefaultOption ? defaultOptionLabel : void 0,
-        allOptionsLabel: shouldShowAllOption ? allOptionsLabel : void 0,
+        defaultOptionLabel: hasDefaultOption && shouldShowDefaultOption && defaultOptionLabel,
+        allOptionsLabel: shouldShowAllOption && allOptionsLabel,
         areAllOptionsSelected,
-        customListHeader: hasSearchInputInList ? /* @__PURE__ */ jsx(SearchInput, _object_spread$D({
+        customListHeader: hasSearchInputInList && /* @__PURE__ */ jsx(SearchInput, _object_spread$D({
           value: searchValue,
           onChange: handleInputChange,
           tweakStyles: tweakSearchInputStyles,
           placeholder: "Поиск"
-        }, searchInput)) : void 0,
+        }, searchInputProps)),
         noMatchesLabel,
         focusedIndex: focusedListCellIndex,
         activeValue: value,
@@ -30075,6 +30086,9 @@
     },
     trigger: {
       cursor: "pointer"
+    },
+    popup: {
+      zIndex: 5
     }
   });
   function _array_like_to_array(arr, len) {
@@ -30253,19 +30267,21 @@
       className: clsx(classes.root, _define_property$1({}, classes.disabled, isDisabled))
     }), trueReactPlatformHelpers.addDataTestId(testId), addDataAttributes(data)), {
       children: [
-        /* @__PURE__ */ jsx("div", {
+        /* @__PURE__ */ jsx("div", _object_spread_props$1(_object_spread$1({
           className: classes.trigger,
           onClick: eventType === "click" ? function(e) {
             return handleToggle(!isOpen, e);
-          } : void 0,
+          } : void 0
+        }, trueReactPlatformHelpers.addDataTestId(testId, "trigger")), {
           children: trueReactPlatformHelpers.isFunction(Trigger) ? /* @__PURE__ */ jsx(Trigger, {
             isActive: isOpen
           }) : Trigger
-        }),
+        })),
         isOpen && /* @__PURE__ */ jsx(react.FloatingPortal, {
           root: !shouldRenderInBody ? refs.reference.current : void 0,
           children: /* @__PURE__ */ jsx("div", _object_spread_props$1(_object_spread$1({
             style: floatingStyles,
+            className: classes.popup,
             ref: refs.setFloating
           }, getFloatingProps()), {
             children: trueReactPlatformHelpers.isFunction(Popup) ? /* @__PURE__ */ jsx(Popup, {
@@ -30277,7 +30293,6 @@
     }));
   };
   var useStyles = createThemedStyles("NewMoreMenu", {
-    root: {},
     hasCircle: {},
     button: {
       display: "flex",
@@ -30300,8 +30315,7 @@
     active: {},
     disabled: {
       cursor: "default"
-    },
-    menu: {}
+    }
   });
   function _define_property(obj, key, value) {
     if (key in obj) {
@@ -30360,6 +30374,16 @@
     var classes = useStyles({
       theme: tweakStyles
     });
+    var tweakWithPopupStyles = useTweakStyles({
+      tweakStyles,
+      className: "tweakWithPopup",
+      currentComponentName: "NewMoreMenu"
+    });
+    var tweakListStyles = useTweakStyles({
+      tweakStyles,
+      className: "tweakList",
+      currentComponentName: "NewMoreMenu"
+    });
     var isButtonDisabled = isDisabled || !trueReactPlatformHelpers.isArrayNotEmpty(items);
     return /* @__PURE__ */ jsx(WithPopup, {
       placement,
@@ -30367,6 +30391,7 @@
       shouldHideOnScroll,
       shouldRenderInBody,
       isDisabled: isButtonDisabled,
+      tweakStyles: tweakWithPopupStyles,
       trigger: function(param2) {
         var isActive = param2.isActive;
         var _obj;
@@ -30386,6 +30411,7 @@
         var onClose = param2.onClose;
         return /* @__PURE__ */ jsx(List, {
           items,
+          tweakStyles: tweakListStyles,
           onClick: onClose
         });
       }