@true-engineering/true-react-common-ui-kit 1.3.0 → 1.4.0

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

@@ -1110,6 +1110,16 @@
     });
     return result;
   };
+  var hasExactParent = function(element, parent) {
+    if (element === parent) {
+      return true;
+    }
+    var parentNode = getParentNode$1(element);
+    if (parentNode === element) {
+      return false;
+    }
+    return hasExactParent(parentNode, parent);
+  };
   var _element_parentNode;
   var getParentNode$1 = function(element) {
     return element.nodeName === "HTML" ? element : (_element_parentNode = element.parentNode) !== null && _element_parentNode !== void 0 ? _element_parentNode : element.host;
@@ -4173,63 +4183,63 @@
       ]
     });
   };
-  const avatarGreen = `  <svg
-    width="100%"
-    height="100%"
-    viewBox="0 0 32 32"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <circle opacity="0.5" cx="16" cy="16" r="16" fill="#DDE3ED" />
-    <mask
-      id="mask0_0_12744"
-      style="mask-type: 'alpha';"
-      maskUnits="userSpaceOnUse"
-      x="0"
-      y="0"
-      width="32"
-      height="32"
-    >
-      <circle cx="16" cy="16" r="16" fill="white" />
-    </mask>
-    <g mask="url(#mask0_0_12744)">
-      <circle cx="16" cy="29" r="13" fill="url(#paint0_linear_0_12744)" />
-      <mask
-        id="mask1_0_12744"
-        style="mask-type: 'alpha';"
-        maskUnits="userSpaceOnUse"
-        x="3"
-        y="16"
-        width="26"
-        height="26"
-      >
-        <circle cx="16" cy="29" r="13" fill="white" />
-      </mask>
-      <g mask="url(#mask1_0_12744)">
-        <ellipse
-          cx="16"
-          cy="17.5"
-          rx="6"
-          ry="7.5"
-          fill="#505F79"
-          fill-opacity="0.204983"
-        />
-      </g>
-    </g>
-    <ellipse cx="16" cy="13" rx="6" ry="7" fill="white" />
-    <defs>
-      <linearGradient
-        id="paint0_linear_0_12744"
-        x1="13.347"
-        y1="46.279"
-        x2="33.5318"
-        y2="30.8088"
-        gradientUnits="userSpaceOnUse"
-      >
-        <stop stop-color="#ABD229" />
-        <stop offset="1" stop-color="#9CD03F" />
-      </linearGradient>
-    </defs>
+  const avatarGreen = `  <svg\r
+    width="100%"\r
+    height="100%"\r
+    viewBox="0 0 32 32"\r
+    fill="none"\r
+    xmlns="http://www.w3.org/2000/svg"\r
+  >\r
+    <circle opacity="0.5" cx="16" cy="16" r="16" fill="#DDE3ED" />\r
+    <mask\r
+      id="mask0_0_12744"\r
+      style="mask-type: 'alpha';"\r
+      maskUnits="userSpaceOnUse"\r
+      x="0"\r
+      y="0"\r
+      width="32"\r
+      height="32"\r
+    >\r
+      <circle cx="16" cy="16" r="16" fill="white" />\r
+    </mask>\r
+    <g mask="url(#mask0_0_12744)">\r
+      <circle cx="16" cy="29" r="13" fill="url(#paint0_linear_0_12744)" />\r
+      <mask\r
+        id="mask1_0_12744"\r
+        style="mask-type: 'alpha';"\r
+        maskUnits="userSpaceOnUse"\r
+        x="3"\r
+        y="16"\r
+        width="26"\r
+        height="26"\r
+      >\r
+        <circle cx="16" cy="29" r="13" fill="white" />\r
+      </mask>\r
+      <g mask="url(#mask1_0_12744)">\r
+        <ellipse\r
+          cx="16"\r
+          cy="17.5"\r
+          rx="6"\r
+          ry="7.5"\r
+          fill="#505F79"\r
+          fill-opacity="0.204983"\r
+        />\r
+      </g>\r
+    </g>\r
+    <ellipse cx="16" cy="13" rx="6" ry="7" fill="white" />\r
+    <defs>\r
+      <linearGradient\r
+        id="paint0_linear_0_12744"\r
+        x1="13.347"\r
+        y1="46.279"\r
+        x2="33.5318"\r
+        y2="30.8088"\r
+        gradientUnits="userSpaceOnUse"\r
+      >\r
+        <stop stop-color="#ABD229" />\r
+        <stop offset="1" stop-color="#9CD03F" />\r
+      </linearGradient>\r
+    </defs>\r
   </svg>`;
   var complexIcons = {
     avatar: avatarGreen
@@ -6102,6 +6112,11 @@
     loading: {},
     tweakPreloader: {}
   };
+  var renderIcon = function(icon) {
+    return typeof icon === "string" ? /* @__PURE__ */ jsx(Icon, {
+      type: icon
+    }) : icon;
+  };
   function _array_like_to_array$k(arr, len) {
     if (len == null || len > arr.length)
       len = arr.length;
@@ -6467,9 +6482,7 @@
                 iconType !== void 0 && /* @__PURE__ */ jsx("div", {
                   className: clsx(classes.inputIcon, _define_property$B({}, classes.activeIcon, !isDisabled && onIconClick !== void 0)),
                   onClick: !isDisabled ? onIconClick : void 0,
-                  children: /* @__PURE__ */ jsx(Icon, {
-                    type: iconType
-                  })
+                  children: renderIcon(iconType)
                 })
               ]
             })
@@ -6908,7 +6921,20 @@
         CONTAINER_PADDING,
         0
       ],
-      fontSize: 16
+      fontSize: 16,
+      overflow: "hidden"
+    },
+    withListHeader: {
+      paddingTop: 0
+    },
+    listHeader: {
+      "& + $list": {
+        borderTop: [
+          1,
+          "solid",
+          colors.BORDER_LIGHT
+        ]
+      }
     },
     list: _object_spread$x({
       height: "100%",
@@ -6994,7 +7020,7 @@
   }
   var DEFAULT_OPTION_INDEX = -1;
   function SelectList(param) {
-    var options = param.options, focusedIndex = param.focusedIndex, activeValue = param.activeValue, defaultOptionLabel = param.defaultOptionLabel, _param_noMatchesLabel = param.noMatchesLabel, noMatchesLabel = _param_noMatchesLabel === void 0 ? "Совпадений не найдено" : _param_noMatchesLabel, isLoading = param.isLoading, _param_loadingLabel = param.loadingLabel, loadingLabel = _param_loadingLabel === void 0 ? "Загрузка..." : _param_loadingLabel, tweakStyles = param.tweakStyles, testId = param.testId, _param_shouldScrollToList = param.shouldScrollToList, shouldScrollToList = _param_shouldScrollToList === void 0 ? true : _param_shouldScrollToList, isOptionDisabled = param.isOptionDisabled, onOptionClick = param.onOptionClick, convertValueToString = param.convertValueToString, convertValueToReactNode = param.convertValueToReactNode, _param_convertValueToId = param.convertValueToId, convertValueToId = _param_convertValueToId === void 0 ? convertValueToString : _param_convertValueToId;
+    var options = param.options, focusedIndex = param.focusedIndex, activeValue = param.activeValue, defaultOptionLabel = param.defaultOptionLabel, _param_noMatchesLabel = param.noMatchesLabel, noMatchesLabel = _param_noMatchesLabel === void 0 ? "Совпадений не найдено" : _param_noMatchesLabel, isLoading = param.isLoading, _param_loadingLabel = param.loadingLabel, loadingLabel = _param_loadingLabel === void 0 ? "Загрузка..." : _param_loadingLabel, tweakStyles = param.tweakStyles, testId = param.testId, _param_shouldScrollToList = param.shouldScrollToList, shouldScrollToList = _param_shouldScrollToList === void 0 ? true : _param_shouldScrollToList, customListHeader = param.customListHeader, isOptionDisabled = param.isOptionDisabled, onOptionClick = param.onOptionClick, convertValueToString = param.convertValueToString, convertValueToReactNode = param.convertValueToReactNode, _param_convertValueToId = param.convertValueToId, convertValueToId = _param_convertValueToId === void 0 ? convertValueToString : _param_convertValueToId;
     var classes = useTheme("SelectList", styles$v, tweakStyles).classes;
     var activeValueId = isNotEmpty(activeValue) ? convertValueToId(activeValue) : void 0;
     var isActiveOption = function(item) {
@@ -7018,58 +7044,64 @@
       convertFunction,
       optionsDisableMap
     ]);
-    return /* @__PURE__ */ jsx(ScrollIntoViewIfNeeded, {
+    return /* @__PURE__ */ jsxs(ScrollIntoViewIfNeeded, {
       active: shouldScrollToList,
-      className: classes.root,
-      children: /* @__PURE__ */ jsx("div", {
-        className: classes.list,
-        "data-testid": testId,
-        children: isLoading ? /* @__PURE__ */ jsx("div", {
-          className: clsx(classes.cell, classes.loading),
-          children: loadingLabel
-        }) : /* @__PURE__ */ jsxs(Fragment, {
-          children: [
-            defaultOptionLabel !== void 0 && /* @__PURE__ */ jsx(ScrollIntoViewIfNeeded, {
-              active: focusedIndex === DEFAULT_OPTION_INDEX,
-              options: {
-                block: "nearest"
-              },
-              className: clsx(classes.cell, classes.defaultCell, focusedIndex === DEFAULT_OPTION_INDEX && classes.focused),
-              onClick: function() {
-                return onOptionClick(DEFAULT_OPTION_INDEX);
-              },
-              children: defaultOptionLabel
-            }),
-            listOptions.map(function(opt, i) {
-              var optionValue = options[i];
-              var isFocused = i === focusedIndex;
-              var isActive = isActiveOption(optionValue);
-              var isDisabled = optionsDisableMap[i];
-              var _obj;
-              return /* @__PURE__ */ jsx(ScrollIntoViewIfNeeded, _object_spread_props$q(_object_spread$w({
-                active: isFocused,
+      className: clsx(classes.root, _define_property$x({}, classes.withListHeader, isNotEmpty(customListHeader))),
+      children: [
+        isNotEmpty(customListHeader) && /* @__PURE__ */ jsx("div", {
+          className: classes.listHeader,
+          children: customListHeader
+        }),
+        /* @__PURE__ */ jsx("div", {
+          className: classes.list,
+          "data-testid": testId,
+          children: isLoading ? /* @__PURE__ */ jsx("div", {
+            className: clsx(classes.cell, classes.loading),
+            children: loadingLabel
+          }) : /* @__PURE__ */ jsxs(Fragment, {
+            children: [
+              defaultOptionLabel !== void 0 && /* @__PURE__ */ jsx(ScrollIntoViewIfNeeded, {
+                active: focusedIndex === DEFAULT_OPTION_INDEX,
                 options: {
                   block: "nearest"
                 },
-                className: clsx(classes.cell, (_obj = {}, _define_property$x(_obj, classes.focused, isFocused), _define_property$x(_obj, classes.active, isActive), _define_property$x(_obj, classes.disabled, isDisabled), _obj))
-              }, addDataAttributes({
-                disabled: isDisabled,
-                active: isActive,
-                focused: isFocused
-              })), {
-                onClick: !isDisabled ? function() {
-                  return onOptionClick(i);
-                } : void 0,
-                children: opt
-              }), i);
-            }),
-            listOptions.length === 0 && /* @__PURE__ */ jsx("div", {
-              className: clsx(classes.cell, classes.noMatchesLabel),
-              children: noMatchesLabel
-            })
-          ]
+                className: clsx(classes.cell, classes.defaultCell, focusedIndex === DEFAULT_OPTION_INDEX && classes.focused),
+                onClick: function(event) {
+                  return onOptionClick(DEFAULT_OPTION_INDEX, event);
+                },
+                children: defaultOptionLabel
+              }),
+              listOptions.map(function(opt, i) {
+                var optionValue = options[i];
+                var isFocused = i === focusedIndex;
+                var isActive = isActiveOption(optionValue);
+                var isDisabled = optionsDisableMap[i];
+                var _obj;
+                return /* @__PURE__ */ jsx(ScrollIntoViewIfNeeded, _object_spread_props$q(_object_spread$w({
+                  active: isFocused,
+                  options: {
+                    block: "nearest"
+                  },
+                  className: clsx(classes.cell, (_obj = {}, _define_property$x(_obj, classes.focused, isFocused), _define_property$x(_obj, classes.active, isActive), _define_property$x(_obj, classes.disabled, isDisabled), _obj))
+                }, addDataAttributes({
+                  disabled: isDisabled,
+                  active: isActive,
+                  focused: isFocused
+                })), {
+                  onClick: !isDisabled ? function(event) {
+                    return onOptionClick(i, event);
+                  } : void 0,
+                  children: opt
+                }), i);
+              }),
+              listOptions.length === 0 && /* @__PURE__ */ jsx("div", {
+                className: clsx(classes.cell, classes.noMatchesLabel),
+                children: noMatchesLabel
+              })
+            ]
+          })
         })
-      })
+      ]
     });
   }
   var _option_isDisabled;
@@ -7144,7 +7176,169 @@
         paddingRight: 32
       }
     },
-    tweakSelectList: {}
+    tweakSelectList: {},
+    tweakSearchInput: {
+      tweakInput: {
+        inputWrapper: {
+          height: 48,
+          borderRadius: 0,
+          border: "none",
+          backgroundColor: "transparent"
+        }
+      }
+    }
+  };
+  var LEFT_PADDING = 44;
+  var styles$t = {
+    root: {
+      position: "relative"
+    },
+    icon: {
+      display: "flex",
+      alignItems: "center",
+      position: "absolute",
+      left: 12,
+      height: "100%",
+      width: 20,
+      zIndex: 2,
+      color: colors.GREY_ACTIVE
+    },
+    tweakInput: {
+      inputWrapper: {
+        height: 35,
+        borderColor: "transparent",
+        backgroundColor: rgba(colors.BORDER_MAIN, 0.3),
+        borderRadius: 18,
+        paddingLeft: LEFT_PADDING,
+        transitionProperty: "background-color, border-color"
+      },
+      focused: {
+        backgroundColor: colors.CLASSIC_WHITE,
+        borderColor: colors.BORDER_MAIN
+      },
+      input: {
+        fontSize: 14,
+        paddingLeft: 0
+      },
+      label: {
+        left: LEFT_PADDING,
+        fontSize: 14
+      }
+    }
+  };
+  function _define_property$w(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+    return obj;
+  }
+  function _object_spread$v(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys2 = Object.keys(source);
+      if (typeof Object.getOwnPropertySymbols === "function") {
+        ownKeys2 = ownKeys2.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+      ownKeys2.forEach(function(key) {
+        _define_property$w(target, key, source[key]);
+      });
+    }
+    return target;
+  }
+  function ownKeys$p(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$p(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+      ownKeys$p(Object(source)).forEach(function(key) {
+        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+      });
+    }
+    return target;
+  }
+  function _object_without_properties$6(source, excluded) {
+    if (source == null)
+      return {};
+    var target = _object_without_properties_loose$6(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$6(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;
+  }
+  var SearchInput = function(_param) {
+    var _param_isClearable = _param.isClearable, isClearable = _param_isClearable === void 0 ? true : _param_isClearable, tweakStyles = _param.tweakStyles, testId = _param.testId, data = _param.data, props = _object_without_properties$6(_param, [
+      "isClearable",
+      "tweakStyles",
+      "testId",
+      "data"
+    ]);
+    var _useTheme = useTheme("SearchInput", styles$t, tweakStyles), classes = _useTheme.classes, componentStyles = _useTheme.componentStyles;
+    var tweakInputStyles = useTweakStyles(componentStyles, tweakStyles, "tweakInput");
+    return /* @__PURE__ */ jsxs("div", _object_spread_props$p(_object_spread$v({
+      className: classes.root
+    }, addDataTestId(testId), addDataAttributes(data)), {
+      children: [
+        /* @__PURE__ */ jsx("div", {
+          className: classes.icon,
+          children: /* @__PURE__ */ jsx(Icon, {
+            type: "search"
+          })
+        }),
+        /* @__PURE__ */ jsx(Input, _object_spread$v({
+          isClearable,
+          isActive: props.value !== "" && props.value !== void 0,
+          testId: getTestId(testId, "input"),
+          tweakStyles: tweakInputStyles,
+          hasFloatingLabel: false,
+          label: props.placeholder
+        }, props))
+      ]
+    }));
   };
   function _array_like_to_array$j(arr, len) {
     if (len == null || len > arr.length)
@@ -7186,7 +7380,7 @@
       });
     };
   }
-  function _define_property$w(obj, key, value) {
+  function _define_property$v(obj, key, value) {
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value,
@@ -7230,7 +7424,7 @@
   function _non_iterable_rest$j() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
   }
-  function _object_spread$v(target) {
+  function _object_spread$u(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i] != null ? arguments[i] : {};
       var ownKeys2 = Object.keys(source);
@@ -7240,12 +7434,12 @@
         }));
       }
       ownKeys2.forEach(function(key) {
-        _define_property$w(target, key, source[key]);
+        _define_property$v(target, key, source[key]);
       });
     }
     return target;
   }
-  function ownKeys$p(object, enumerableOnly) {
+  function ownKeys$o(object, enumerableOnly) {
     var keys = Object.keys(object);
     if (Object.getOwnPropertySymbols) {
       var symbols = Object.getOwnPropertySymbols(object);
@@ -7258,21 +7452,21 @@
     }
     return keys;
   }
-  function _object_spread_props$p(target, source) {
+  function _object_spread_props$o(target, source) {
     source = source != null ? source : {};
     if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
     } else {
-      ownKeys$p(Object(source)).forEach(function(key) {
+      ownKeys$o(Object(source)).forEach(function(key) {
         Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
       });
     }
     return target;
   }
-  function _object_without_properties$6(source, excluded) {
+  function _object_without_properties$5(source, excluded) {
     if (source == null)
       return {};
-    var target = _object_without_properties_loose$6(source, excluded);
+    var target = _object_without_properties_loose$5(source, excluded);
     var key, i;
     if (Object.getOwnPropertySymbols) {
       var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
@@ -7287,7 +7481,7 @@
     }
     return target;
   }
-  function _object_without_properties_loose$6(source, excluded) {
+  function _object_without_properties_loose$5(source, excluded) {
     if (source == null)
       return {};
     var target = {};
@@ -7420,7 +7614,7 @@
     }
   };
   function Select(_param) {
-    var options = _param.options, value = _param.value, defaultOptionLabel = _param.defaultOptionLabel, _param_debounceTime = _param.debounceTime, debounceTime = _param_debounceTime === void 0 ? 400 : _param_debounceTime, _param_optionsMode = _param.optionsMode, optionsMode = _param_optionsMode === void 0 ? "normal" : _param_optionsMode, noMatchesLabel = _param.noMatchesLabel, loadingLabel = _param.loadingLabel, tweakStyles = _param.tweakStyles, testId = _param.testId, isDisabled = _param.isDisabled, dropdownOptions = _param.dropdownOptions, _param_minSymbolsCountToOpenList = _param.minSymbolsCountToOpenList, minSymbolsCountToOpenList = _param_minSymbolsCountToOpenList === void 0 ? 0 : _param_minSymbolsCountToOpenList, _param_dropdownIcon = _param.dropdownIcon, dropdownIcon = _param_dropdownIcon === void 0 ? "chevron-down" : _param_dropdownIcon, _param_shouldScrollToList = _param.shouldScrollToList, shouldScrollToList = _param_shouldScrollToList === void 0 ? true : _param_shouldScrollToList, onChange = _param.onChange, onFocus = _param.onFocus, onBlur = _param.onBlur, onType = _param.onType, onOpen = _param.onOpen, _param_isOptionDisabled = _param.isOptionDisabled, isOptionDisabled = _param_isOptionDisabled === void 0 ? defaultIsOptionDisabled : _param_isOptionDisabled, _param_compareValuesOnChange = _param.compareValuesOnChange, compareValuesOnChange = _param_compareValuesOnChange === void 0 ? defaultCompareFunction : _param_compareValuesOnChange, _param_convertValueToString = _param.convertValueToString, convertValueToString = _param_convertValueToString === void 0 ? defaultConvertFunction$2 : _param_convertValueToString, convertValueToId = _param.convertValueToId, convertValueToReactNode = _param.convertValueToReactNode, optionsFilter = _param.optionsFilter, inputProps = _object_without_properties$6(_param, [
+    var options = _param.options, value = _param.value, defaultOptionLabel = _param.defaultOptionLabel, _param_debounceTime = _param.debounceTime, debounceTime = _param_debounceTime === void 0 ? 400 : _param_debounceTime, _param_optionsMode = _param.optionsMode, optionsMode = _param_optionsMode === void 0 ? "normal" : _param_optionsMode, noMatchesLabel = _param.noMatchesLabel, loadingLabel = _param.loadingLabel, tweakStyles = _param.tweakStyles, testId = _param.testId, isDisabled = _param.isDisabled, dropdownOptions = _param.dropdownOptions, _param_minSymbolsCountToOpenList = _param.minSymbolsCountToOpenList, minSymbolsCountToOpenList = _param_minSymbolsCountToOpenList === void 0 ? 0 : _param_minSymbolsCountToOpenList, _param_dropdownIcon = _param.dropdownIcon, dropdownIcon = _param_dropdownIcon === void 0 ? "chevron-down" : _param_dropdownIcon, _param_shouldScrollToList = _param.shouldScrollToList, shouldScrollToList = _param_shouldScrollToList === void 0 ? true : _param_shouldScrollToList, searchInput = _param.searchInput, onChange = _param.onChange, onFocus = _param.onFocus, onBlur = _param.onBlur, onType = _param.onType, onOpen = _param.onOpen, _param_isOptionDisabled = _param.isOptionDisabled, isOptionDisabled = _param_isOptionDisabled === void 0 ? defaultIsOptionDisabled : _param_isOptionDisabled, _param_compareValuesOnChange = _param.compareValuesOnChange, compareValuesOnChange = _param_compareValuesOnChange === void 0 ? defaultCompareFunction : _param_compareValuesOnChange, _param_convertValueToString = _param.convertValueToString, convertValueToString = _param_convertValueToString === void 0 ? defaultConvertFunction$2 : _param_convertValueToString, convertValueToId = _param.convertValueToId, convertValueToReactNode = _param.convertValueToReactNode, optionsFilter = _param.optionsFilter, inputProps = _object_without_properties$5(_param, [
       "options",
       "value",
       "defaultOptionLabel",
@@ -7435,6 +7629,7 @@
       "minSymbolsCountToOpenList",
       "dropdownIcon",
       "shouldScrollToList",
+      "searchInput",
       "onChange",
       "onFocus",
       "onBlur",
@@ -7458,6 +7653,8 @@
     var inputWrapper = React.useRef(null);
     var list = React.useRef(null);
     var input = React.useRef(null);
+    var shouldRenderSearchInputInList = (searchInput === null || searchInput === void 0 ? void 0 : searchInput.shouldRenderInList) === true;
+    var hasSearchInputInList = optionsMode !== "normal" && shouldRenderSearchInputInList;
     var stringValue = isNotEmpty(value) ? convertValueToString(value) : void 0;
     var filteredOptions = React.useMemo(function() {
       if (optionsMode !== "search") {
@@ -7485,43 +7682,32 @@
       value,
       convertValueToString
     ]);
-    var handleListClose = function() {
+    var handleListClose = function(event) {
       setIsListOpen(false);
       setSearchValue("");
       setShouldShowDefaultOption(true);
+      onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
     };
     var handleListOpen = function() {
-      var _ref2 = _async_to_generator$4(function() {
-        return __generator$4(this, function(_state) {
-          if (isListOpen) {
-            return [
-              2
-            ];
-          }
-          setIsListOpen(true);
-          return [
-            2
-          ];
-        });
-      });
-      return function handleListOpen2() {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-    var handleFocus = function(event) {
-      if (onFocus !== void 0) {
-        onFocus(event);
+      if (!isListOpen) {
+        setIsListOpen(true);
       }
+    };
+    var handleFocus = function(event) {
+      onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
       handleListOpen();
     };
     var handleOnClick = function() {
       handleListOpen();
     };
     var handleBlur = function(event) {
-      if (onBlur !== void 0) {
-        onBlur(event);
+      if (!isNotEmpty(event.relatedTarget) || !isNotEmpty(list.current)) {
+        return;
+      }
+      var isActionInsideList = hasExactParent(event.relatedTarget, list.current);
+      if (!isActionInsideList) {
+        handleListClose(event);
       }
-      handleListClose();
     };
     var handleOnChange = React.useCallback(function(newValue) {
       var areValuesEqual = compareValuesOnChange(value, newValue);
@@ -7533,10 +7719,10 @@
       value,
       onChange
     ]);
-    var handleOptionClick = React.useCallback(function(index) {
+    var handleOptionSelect = React.useCallback(function(index, event) {
       var _input_current;
       handleOnChange(index === -1 ? void 0 : filteredOptions[index]);
-      handleListClose();
+      handleListClose(event);
       (_input_current = input.current) === null || _input_current === void 0 ? void 0 : _input_current.blur();
     }, [
       handleOnChange,
@@ -7591,7 +7777,7 @@
       if (optionsMode !== "dynamic") {
         setShouldShowDefaultOption(v === "");
       }
-      if (v === "") {
+      if (v === "" && !hasSearchInputInList) {
         handleOnChange(void 0);
       }
       setSearchValue(v);
@@ -7608,7 +7794,7 @@
           if (indexToClick === -1 && filteredOptions.length === 1) {
             indexToClick = 0;
           }
-          handleOptionClick(indexToClick);
+          handleOptionSelect(indexToClick, event);
           break;
         }
         case "ArrowDown": {
@@ -7655,14 +7841,23 @@
         (_input_current1 = input.current) === null || _input_current1 === void 0 ? void 0 : _input_current1.focus();
       }
     };
-    useOnClickOutsideWithRef(list, function() {
-      handleListClose();
-    }, inputWrapper);
-    var isOpen = isListOpen && (inputProps.isLoading || filteredOptions.length > 0 || defaultOptionLabel !== void 0 && searchValue === "" || noMatchesLabel !== void 0) && searchValue.trim().length >= minSymbolsCountToOpenList;
+    useOnClickOutsideWithRef(list, handleListClose, inputWrapper);
+    var hasEnoughSymbolsToSearch = searchValue.trim().length >= minSymbolsCountToOpenList;
+    var isOpen = (
+      // Пользователь пытается открыть лист
+      isListOpen && // Нам есть что показать:
+      // Есть опции
+      (filteredOptions.length > 0 || // Дефолтная опция
+      defaultOptionLabel !== void 0 && !hasEnoughSymbolsToSearch || // Текст "Загрузка..."
+      inputProps.isLoading || // Текст "Совпадений не найдено"
+      noMatchesLabel !== void 0 || // У нас есть инпут с поиском внутри листа
+      hasSearchInputInList) && // Последняя проверка на случай, если мы че то ищем в опциях
+      (optionsMode === "normal" || hasEnoughSymbolsToSearch)
+    );
     var _inputProps_isReadonly = inputProps.isReadonly, isReadonly = _inputProps_isReadonly === void 0 ? true : _inputProps_isReadonly;
-    var shouldUsePointerCursor = optionsMode === "normal" && isReadonly;
+    var shouldUsePointerCursor = (optionsMode === "normal" || shouldRenderSearchInputInList) && isReadonly;
     var tweakInputStyles = React.useMemo(function() {
-      return lodash.merge({}, componentStyles.tweakInput, _object_spread$v({}, shouldUsePointerCursor ? {
+      return lodash.merge({}, componentStyles.tweakInput, _object_spread$u({}, shouldUsePointerCursor ? {
         input: {
           cursor: "pointer"
         }
@@ -7671,6 +7866,7 @@
       tweakStyles === null || tweakStyles === void 0 ? void 0 : tweakStyles.tweakInput,
       shouldUsePointerCursor
     ]);
+    var tweakSearchInputStyles = useTweakStyles(componentStyles, tweakStyles, "tweakSearchInput");
     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 popperData = useDropdown({
       isOpen,
@@ -7692,30 +7888,34 @@
       onOpen
     ]);
     var _obj;
-    var listEl = /* @__PURE__ */ jsx("div", _object_spread_props$p(_object_spread$v({
-      className: clsx(classes.listWrapper, (_obj = {}, _define_property$w(_obj, classes.withoutPopper, !shouldUsePopper), _define_property$w(_obj, classes.listWrapperInBody, shouldRenderInBody), _obj)),
+    var listEl = /* @__PURE__ */ jsx("div", _object_spread_props$o(_object_spread$u({
+      className: clsx(classes.listWrapper, (_obj = {}, _define_property$v(_obj, classes.withoutPopper, !shouldUsePopper), _define_property$v(_obj, classes.listWrapperInBody, shouldRenderInBody), _obj)),
       ref: list,
-      onMouseDown: function(event) {
-        return event.preventDefault();
-      },
-      style: popperData === null || popperData === void 0 ? void 0 : popperData.styles.popper
+      style: popperData === null || popperData === void 0 ? void 0 : popperData.styles.popper,
+      onBlur: handleBlur
     }, popperData === null || popperData === void 0 ? void 0 : popperData.attributes.popper), {
       children: isOpen && /* @__PURE__ */ jsx(SelectList, {
         options: filteredOptions,
         defaultOptionLabel: hasDefaultOption && shouldShowDefaultOption ? defaultOptionLabel : void 0,
+        customListHeader: hasSearchInputInList ? /* @__PURE__ */ jsx(SearchInput, _object_spread$u({
+          value: searchValue,
+          onChange: handleInputChange,
+          tweakStyles: tweakSearchInputStyles,
+          placeholder: "Поиск"
+        }, searchInput)) : void 0,
         noMatchesLabel,
         focusedIndex: focusedListCellIndex,
         activeValue: value,
         isLoading: inputProps.isLoading,
         loadingLabel,
         tweakStyles: tweakStyles === null || tweakStyles === void 0 ? void 0 : tweakStyles.tweakSelectList,
-        testId: testId !== void 0 ? "".concat(testId, "-list") : void 0,
+        testId: getTestId(testId, "list"),
         shouldScrollToList: shouldScrollToList && !shouldUsePopper && !shouldHideOnScroll,
         isOptionDisabled,
         convertValueToString,
         convertValueToReactNode,
         convertValueToId,
-        onOptionClick: handleOptionClick
+        onOptionClick: handleOptionSelect
       })
     }));
     return /* @__PURE__ */ jsxs("div", {
@@ -7727,11 +7927,11 @@
           onClick: isDisabled ? void 0 : handleOnClick,
           ref: inputWrapper,
           children: [
-            /* @__PURE__ */ jsx(Input, _object_spread$v({
-              value: searchValue !== "" ? searchValue : stringValue,
+            /* @__PURE__ */ jsx(Input, _object_spread$u({
+              value: searchValue !== "" && !shouldRenderSearchInputInList ? searchValue : stringValue,
               onChange: handleInputChange,
               isActive: isListOpen,
-              isReadonly: optionsMode === "normal",
+              isReadonly: optionsMode === "normal" || shouldRenderSearchInputInList,
               onFocus: handleFocus,
               onBlur: handleBlur,
               isDisabled,
@@ -7765,7 +7965,7 @@
   }
   var SELECT_PADDING_LEFT = 12;
   var SELECT_PADDING_RIGHT = 24;
-  var styles$t = {
+  var styles$s = {
     btn: {
       width: 36,
       height: 36,
@@ -7834,7 +8034,7 @@
   };
   var DatePickerHeader = function(param) {
     var date = param.date, changeYear = param.changeYear, changeMonth = param.changeMonth, decreaseMonth = param.decreaseMonth, increaseMonth = param.increaseMonth, isPrevMonthButtonDisabled = param.isPrevMonthButtonDisabled, isNextMonthButtonDisabled = param.isNextMonthButtonDisabled, months = param.months;
-    var _useTheme = useTheme("DatePickerHeader", styles$t), classes = _useTheme.classes, componentStyles = _useTheme.componentStyles;
+    var _useTheme = useTheme("DatePickerHeader", styles$s), classes = _useTheme.classes, componentStyles = _useTheme.componentStyles;
     var years = React.useMemo(function() {
       return Array.from(Array(41)).map(function(_, i) {
         return dateFns.getYear(new Date()) - 30 + i;
@@ -7918,7 +8118,7 @@
       ]
     });
   };
-  var styles$s = {
+  var styles$r = {
     root: {
       width: "100%",
       height: "100%"
@@ -7980,7 +8180,7 @@
     if (Array.isArray(arr))
       return arr;
   }
-  function _define_property$v(obj, key, value) {
+  function _define_property$u(obj, key, value) {
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value,
@@ -8024,7 +8224,7 @@
   function _non_iterable_rest$i() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
   }
-  function _object_spread$u(target) {
+  function _object_spread$t(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i] != null ? arguments[i] : {};
       var ownKeys2 = Object.keys(source);
@@ -8034,12 +8234,12 @@
         }));
       }
       ownKeys2.forEach(function(key) {
-        _define_property$v(target, key, source[key]);
+        _define_property$u(target, key, source[key]);
       });
     }
     return target;
   }
-  function ownKeys$o(object, enumerableOnly) {
+  function ownKeys$n(object, enumerableOnly) {
     var keys = Object.keys(object);
     if (Object.getOwnPropertySymbols) {
       var symbols = Object.getOwnPropertySymbols(object);
@@ -8052,21 +8252,21 @@
     }
     return keys;
   }
-  function _object_spread_props$o(target, source) {
+  function _object_spread_props$n(target, source) {
     source = source != null ? source : {};
     if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
     } else {
-      ownKeys$o(Object(source)).forEach(function(key) {
+      ownKeys$n(Object(source)).forEach(function(key) {
         Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
       });
     }
     return target;
   }
-  function _object_without_properties$5(source, excluded) {
+  function _object_without_properties$4(source, excluded) {
     if (source == null)
       return {};
-    var target = _object_without_properties_loose$5(source, excluded);
+    var target = _object_without_properties_loose$4(source, excluded);
     var key, i;
     if (Object.getOwnPropertySymbols) {
       var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
@@ -8081,7 +8281,7 @@
     }
     return target;
   }
-  function _object_without_properties_loose$5(source, excluded) {
+  function _object_without_properties_loose$4(source, excluded) {
     if (source == null)
       return {};
     var target = {};
@@ -8122,7 +8322,7 @@
   };
   var DEFAULT_DATE_FORMAT$2 = "dd.MM.yyyy";
   var DatePicker = function(_param) {
-    var data = _param.data, tweakStyles = _param.tweakStyles, selectedDate = _param.selectedDate, minDate = _param.minDate, maxDate = _param.maxDate, endDate = _param.endDate, startDate = _param.startDate, size = _param.size, isRange = _param.isRange, locale2 = _param.locale, months = _param.months, _param_calendarStartDay = _param.calendarStartDay, calendarStartDay = _param_calendarStartDay === void 0 ? 1 : _param_calendarStartDay, _param_leftPosition = _param.leftPosition, leftPosition = _param_leftPosition === void 0 ? 0 : _param_leftPosition, _param_topPosition = _param.topPosition, topPosition = _param_topPosition === void 0 ? 0 : _param_topPosition, isInline = _param.isInline, isNeedClearSelectedDate = _param.isNeedClearSelectedDate, _param_dateFormat = _param.dateFormat, dateFormat = _param_dateFormat === void 0 ? DEFAULT_DATE_FORMAT$2 : _param_dateFormat, monthsShown = _param.monthsShown, _param_placeholder = _param.placeholder, placeholder = _param_placeholder === void 0 ? "__.__.____" : _param_placeholder, shouldGiveValueOnType = _param.shouldGiveValueOnType, disabledKeyboardNavigation = _param.disabledKeyboardNavigation, shouldRenderPopperInBody = _param.shouldRenderPopperInBody, popperModifiers = _param.popperModifiers, showPreviousMonths = _param.showPreviousMonths, popperPlacement = _param.popperPlacement, onChangeDate = _param.onChangeDate, onChangeRange = _param.onChangeRange, customHeader = _param.customHeader, filterDate = _param.filterDate, inputProps = _object_without_properties$5(_param, [
+    var data = _param.data, tweakStyles = _param.tweakStyles, selectedDate = _param.selectedDate, minDate = _param.minDate, maxDate = _param.maxDate, endDate = _param.endDate, startDate = _param.startDate, size = _param.size, isRange = _param.isRange, locale2 = _param.locale, months = _param.months, _param_calendarStartDay = _param.calendarStartDay, calendarStartDay = _param_calendarStartDay === void 0 ? 1 : _param_calendarStartDay, _param_leftPosition = _param.leftPosition, leftPosition = _param_leftPosition === void 0 ? 0 : _param_leftPosition, _param_topPosition = _param.topPosition, topPosition = _param_topPosition === void 0 ? 0 : _param_topPosition, isInline = _param.isInline, isNeedClearSelectedDate = _param.isNeedClearSelectedDate, _param_dateFormat = _param.dateFormat, dateFormat = _param_dateFormat === void 0 ? DEFAULT_DATE_FORMAT$2 : _param_dateFormat, monthsShown = _param.monthsShown, _param_placeholder = _param.placeholder, placeholder = _param_placeholder === void 0 ? "__.__.____" : _param_placeholder, shouldGiveValueOnType = _param.shouldGiveValueOnType, disabledKeyboardNavigation = _param.disabledKeyboardNavigation, shouldRenderPopperInBody = _param.shouldRenderPopperInBody, popperModifiers = _param.popperModifiers, showPreviousMonths = _param.showPreviousMonths, popperPlacement = _param.popperPlacement, onChangeDate = _param.onChangeDate, onChangeRange = _param.onChangeRange, customHeader = _param.customHeader, filterDate = _param.filterDate, inputProps = _object_without_properties$4(_param, [
       "data",
       "tweakStyles",
       "selectedDate",
@@ -8153,7 +8353,7 @@
       "customHeader",
       "filterDate"
     ]);
-    var classes = useTheme("DatePicker", styles$s, tweakStyles, {
+    var classes = useTheme("DatePicker", styles$r, tweakStyles, {
       leftPosition,
       topPosition
     }).classes;
@@ -8302,7 +8502,7 @@
       },
       filterDate
     };
-    var dateInputProps = _object_spread_props$o(_object_spread$u({}, inputProps), {
+    var dateInputProps = _object_spread_props$n(_object_spread$t({}, inputProps), {
       tweakStyles,
       iconType: inputProps.isClearable && dateValue !== "" ? void 0 : "calendar",
       isRange,
@@ -8311,14 +8511,14 @@
       }
     });
     if (onChangeRange) {
-      datePickerProps = _object_spread_props$o(_object_spread$u({}, datePickerProps), {
+      datePickerProps = _object_spread_props$n(_object_spread$t({}, datePickerProps), {
         startDate: start2,
         endDate: end2,
         selectsRange: true,
         selected: startDate,
         onChange: onChangeRange
       });
-      dateInputProps = _object_spread_props$o(_object_spread$u({}, dateInputProps), {
+      dateInputProps = _object_spread_props$n(_object_spread$t({}, dateInputProps), {
         startDate: startDateValue,
         endDate: endDateValue,
         onBlur: handleRangeBlur,
@@ -8326,7 +8526,7 @@
       });
     }
     if (onChangeDate) {
-      datePickerProps = _object_spread_props$o(_object_spread$u({}, datePickerProps), {
+      datePickerProps = _object_spread_props$n(_object_spread$t({}, datePickerProps), {
         selected: date,
         onChange: function(newDate) {
           return onChangeDate(newDate);
@@ -8340,20 +8540,20 @@
         minDate,
         maxDate
       });
-      dateInputProps = _object_spread_props$o(_object_spread$u({}, dateInputProps), {
+      dateInputProps = _object_spread_props$n(_object_spread$t({}, dateInputProps), {
         date: dateValue,
         isActive: isOpen,
         onBlur: handleBlur,
         onChange: handleDateChange
       });
     }
-    return /* @__PURE__ */ jsx("div", _object_spread_props$o(_object_spread$u({
+    return /* @__PURE__ */ jsx("div", _object_spread_props$n(_object_spread$t({
       className: classes.root
     }, addDataAttributes(data)), {
-      children: /* @__PURE__ */ jsx(Datepicker, _object_spread_props$o(_object_spread$u({}, datePickerProps), {
+      children: /* @__PURE__ */ jsx(Datepicker, _object_spread_props$n(_object_spread$t({}, datePickerProps), {
         customInput: /* @__PURE__ */ jsx(DatePickerInput, {
           size,
-          children: /* @__PURE__ */ jsx(DateInput, _object_spread$u({}, dateInputProps))
+          children: /* @__PURE__ */ jsx(DateInput, _object_spread$t({}, dateInputProps))
         }),
         renderCustomHeader: customHeader !== void 0 ? customHeader : function(param) {
           var renderDate = param.date, changeYear = param.changeYear, changeMonth = param.changeMonth, decreaseMonth = param.decreaseMonth, increaseMonth = param.increaseMonth, prevMonthButtonDisabled = param.prevMonthButtonDisabled, nextMonthButtonDisabled = param.nextMonthButtonDisabled;
@@ -8371,7 +8571,7 @@
       }))
     }));
   };
-  var styles$r = {
+  var styles$q = {
     root: {},
     button: {
       cursor: "pointer",
@@ -8412,7 +8612,7 @@
     if (Array.isArray(arr))
       return arr;
   }
-  function _define_property$u(obj, key, value) {
+  function _define_property$t(obj, key, value) {
     if (key in obj) {
       Object.defineProperty(obj, key, {
         value,
@@ -8456,7 +8656,7 @@
   function _non_iterable_rest$h() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
   }
-  function _object_spread$t(target) {
+  function _object_spread$s(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i] != null ? arguments[i] : {};
       var ownKeys2 = Object.keys(source);
@@ -8466,12 +8666,12 @@
         }));
       }
       ownKeys2.forEach(function(key) {
-        _define_property$u(target, key, source[key]);
+        _define_property$t(target, key, source[key]);
       });
     }
     return target;
   }
-  function ownKeys$n(object, enumerableOnly) {
+  function ownKeys$m(object, enumerableOnly) {
     var keys = Object.keys(object);
     if (Object.getOwnPropertySymbols) {
       var symbols = Object.getOwnPropertySymbols(object);
@@ -8484,12 +8684,12 @@
     }
     return keys;
   }
-  function _object_spread_props$n(target, source) {
+  function _object_spread_props$m(target, source) {
     source = source != null ? source : {};
     if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
     } else {
-      ownKeys$n(Object(source)).forEach(function(key) {
+      ownKeys$m(Object(source)).forEach(function(key) {
         Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
       });
     }
@@ -8514,14 +8714,14 @@
   var LINK_REGEXP = /(http(s?):\/\/(.*))(\s?)/;
   var Description = function(param) {
     var text = param.text, moreTitle = param.moreTitle, lessTitle = param.lessTitle, _param_truncateIndex = param.truncateIndex, truncateIndex = _param_truncateIndex === void 0 ? 150 : _param_truncateIndex, _param_isAlwaysOpen = param.isAlwaysOpen, isAlwaysOpen = _param_isAlwaysOpen === void 0 ? true : _param_isAlwaysOpen, data = param.data, tweakStyles = param.tweakStyles;
-    var classes = useTheme("Description", styles$r, tweakStyles).classes;
+    var classes = useTheme("Description", styles$q, tweakStyles).classes;
     var isTooShort = text.length < truncateIndex;
     var _useState = _sliced_to_array$h(React.useState(isAlwaysOpen), 2), isOpen = _useState[0], setIsOpen = _useState[1];
     var link = text.match(LINK_REGEXP);
     var linkText = link && link[0];
     var textWithNoLink = text.replace(LINK_REGEXP, "");
     var shortText = text.slice(0, text.slice(0, truncateIndex).lastIndexOf(" "));
-    return /* @__PURE__ */ jsxs("div", _object_spread_props$n(_object_spread$t({
+    return /* @__PURE__ */ jsxs("div", _object_spread_props$m(_object_spread$s({
       className: classes.root
     }, addDataAttributes(data)), {
       children: [
@@ -8556,158 +8756,6 @@
       ]
     }));
   };
-  var LEFT_PADDING = 44;
-  var styles$q = {
-    root: {
-      position: "relative"
-    },
-    icon: {
-      display: "flex",
-      alignItems: "center",
-      position: "absolute",
-      left: 12,
-      height: "100%",
-      width: 20,
-      zIndex: 2,
-      color: colors.GREY_ACTIVE
-    },
-    tweakInput: {
-      inputWrapper: {
-        height: 35,
-        borderColor: "transparent",
-        backgroundColor: rgba(colors.BORDER_MAIN, 0.3),
-        borderRadius: 18,
-        paddingLeft: LEFT_PADDING,
-        transitionProperty: "background-color, border-color"
-      },
-      focused: {
-        backgroundColor: colors.CLASSIC_WHITE,
-        borderColor: colors.BORDER_MAIN
-      },
-      input: {
-        fontSize: 14,
-        paddingLeft: 0
-      },
-      label: {
-        left: LEFT_PADDING,
-        fontSize: 14
-      }
-    }
-  };
-  function _define_property$t(obj, key, value) {
-    if (key in obj) {
-      Object.defineProperty(obj, key, {
-        value,
-        enumerable: true,
-        configurable: true,
-        writable: true
-      });
-    } else {
-      obj[key] = value;
-    }
-    return obj;
-  }
-  function _object_spread$s(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i] != null ? arguments[i] : {};
-      var ownKeys2 = Object.keys(source);
-      if (typeof Object.getOwnPropertySymbols === "function") {
-        ownKeys2 = ownKeys2.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-        }));
-      }
-      ownKeys2.forEach(function(key) {
-        _define_property$t(target, key, source[key]);
-      });
-    }
-    return target;
-  }
-  function ownKeys$m(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$m(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-      ownKeys$m(Object(source)).forEach(function(key) {
-        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-      });
-    }
-    return target;
-  }
-  function _object_without_properties$4(source, excluded) {
-    if (source == null)
-      return {};
-    var target = _object_without_properties_loose$4(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$4(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;
-  }
-  var SearchInput = function(_param) {
-    var _param_isClearable = _param.isClearable, isClearable = _param_isClearable === void 0 ? true : _param_isClearable, tweakStyles = _param.tweakStyles, testId = _param.testId, data = _param.data, props = _object_without_properties$4(_param, [
-      "isClearable",
-      "tweakStyles",
-      "testId",
-      "data"
-    ]);
-    var _useTheme = useTheme("SearchInput", styles$q, tweakStyles), classes = _useTheme.classes, componentStyles = _useTheme.componentStyles;
-    var tweakInputStyles = useTweakStyles(componentStyles, tweakStyles, "tweakInput");
-    return /* @__PURE__ */ jsxs("div", _object_spread_props$m(_object_spread$s({
-      className: classes.root
-    }, addDataTestId(testId), addDataAttributes(data)), {
-      children: [
-        /* @__PURE__ */ jsx("div", {
-          className: classes.icon,
-          children: /* @__PURE__ */ jsx(Icon, {
-            type: "search"
-          })
-        }),
-        /* @__PURE__ */ jsx(Input, _object_spread$s({
-          isClearable,
-          isActive: props.value !== "" && props.value !== void 0,
-          testId: getTestId(testId, "input"),
-          tweakStyles: tweakInputStyles,
-          hasFloatingLabel: false,
-          label: props.placeholder
-        }, props))
-      ]
-    }));
-  };
   var SelectLocales = {
     ru: {
       clear: "Очистить",
@@ -20364,7 +20412,9 @@
           },
           onMouseLeave: handleMouseLeave,
           onClick: handleRowClick
-        }, addDataAttributes(rowData)), {
+        }, addDataAttributes(_object_spread_props$d(_object_spread$f({}, rowData), {
+          isExpandableComponentActive: nestedComponent.isOpen ? true : void 0
+        }))), {
           children: items.map(function(key, idx) {
             return /* @__PURE__ */ jsx(TableValue, {
               columnName: key,
@@ -27071,6 +27121,7 @@
   exports2.getScrollParent = getScrollParent$1;
   exports2.getStyleComputedProperty = getStyleComputedProperty;
   exports2.getTestId = getTestId;
+  exports2.hasExactParent = hasExactParent;
   exports2.isElementOffScreen = isElementOffScreen;
   exports2.isElementOneOfParents = isElementOneOfParents;
   exports2.isInt = isInt;