mimir-ui-kit 1.46.0 → 1.47.0

package/dist/components/SelectSearch/types.d.ts

@@ -109,4 +109,9 @@ export type TSelectSearchProps = Pick<TInputProps, 'withClearButton' | 'variant'
      * @default false
      */
     highlightMatches?: boolean;
+    /**
+     * Включить поиск по хедерам группы вложенных элементов в режиме группировки
+     * @default false
+     */
+    searchInHeaderGroupItems?: boolean;
 };

package/dist/components/SelectSearch/utils.js

@@ -1,5 +1,5 @@
 import { createElement as u, Fragment as l, isValidElement as g, cloneElement as m } from "react";
-import { ESelectSearchSize as s, MOBILE_MENU_HEIGHT as w, DESKTOP_MENU_HEIGHT as f } from "./constants.js";
+import { ESelectSearchSize as s, MOBILE_MENU_HEIGHT as h, DESKTOP_MENU_HEIGHT as w } from "./constants.js";
 import "../../Input-IzZ6B9kw.js";
 import { EInputSize as c } from "../Input/constants.js";
 const A = (r) => {
@@ -15,33 +15,34 @@ const A = (r) => {
   }
 }, H = (r, t) => r ? t === s.L ? "DropdownArrowUp24px" : "DropdownArrowUp16px" : t === s.L ? "DropdownArrowDown24px" : "DropdownArrowBottom16px", M = (r, t, n) => {
   if (!r.length || !t) return r;
-  const e = [], i = /* @__PURE__ */ new Set();
+  const e = [], p = /* @__PURE__ */ new Set();
   for (const o of r) {
-    const p = String(o[t] || "Без группы");
-    i.has(p) || (i.add(p), e.push({
-      id: `group-header-${p}`,
-      name: n(p),
+    const i = String(o[t] || "Без группы");
+    p.has(i) || (p.add(i), e.push({
+      id: `group-header-${i}`,
+      name: n(i),
       isGroupHeader: !0,
-      originalValue: p
+      originalValue: i
     })), e.push(o);
   }
   return e;
 }, D = (r, t) => {
   if (!r.current) return !1;
-  const n = r.current.getBoundingClientRect(), e = window.innerHeight, i = t === s.M || t === s.S ? w : f, o = e - n.bottom, p = n.top;
-  return o >= i ? !1 : p > o;
-}, h = (r, t, n) => {
+  const n = r.current.getBoundingClientRect(), e = window.innerHeight, p = t === s.M || t === s.S ? h : w, o = e - n.bottom, i = n.top;
+  return o >= p ? !1 : i > o;
+}, f = (r, t, n) => {
   if (!t.trim())
     return [r];
   const e = new RegExp(
     `(${t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")})`,
     "gi"
   );
-  return r.split(e).map((o, p) => e.test(o) ? u(
+  return r.split(e).map((o, i) => e.test(o) ? u(
     "span",
     {
-      key: p,
-      className: n
+      key: i,
+      className: n,
+      "data-testid": "highlighted-match"
     },
     o
   ) : o);
@@ -49,7 +50,7 @@ const A = (r) => {
   if (!t.trim())
     return r;
   if (typeof r == "string") {
-    const e = h(
+    const e = f(
       r,
       t,
       n
@@ -61,9 +62,9 @@ const A = (r) => {
     );
   }
   return Array.isArray(r) ? r.map(
-    (e, i) => u(
+    (e, p) => u(
       l,
-      { key: i },
+      { key: p },
       a(e, t, n)
     )
   ) : g(r) ? m(r, {
@@ -78,7 +79,7 @@ const A = (r) => {
 export {
   H as getDropdownArrowIcon,
   a as highlightReactNode,
-  h as highlightText,
+  f as highlightText,
   A as mapSizeToInputSize,
   M as prepareGroupedItems,
   D as shouldShowMenuOnTop

package/dist/useNestedSelection-bo9wXvE-.js

@@ -0,0 +1,181 @@
+import { jsxs as C, jsx as r } from "react/jsx-runtime";
+import { c as w } from "./index-DIxK0V-G.js";
+import { useEffect as j } from "react";
+import { Icon as k } from "./icons/Icon.js";
+import { CheckboxMimir as q } from "./components/CheckboxMimir/CheckboxMimir.js";
+import { EMultiSelectSearchSize as M } from "./components/MultiSelectSearch/constants.js";
+import { getAllChildrenIds as F } from "./components/MultiSelectSearch/utils.js";
+import { W as P } from "./combobox-fIVOzEhl.js";
+import './assets/useNestedSelection.css';const W = "_disabled_1l3p8_5", B = "_container_1l3p8_9", L = "_l_1l3p8_36", T = "_loader_1l3p8_40", V = "_full_1l3p8_50", $ = "_button_1l3p8_62", y = "_options_1l3p8_32", G = "_visible_1l3p8_89", H = "_top_1l3p8_92", J = "_bottom_1l3p8_97", K = "_m_1l3p8_2", R = "_focused_1l3p8_157", U = "_option_1l3p8_32", X = "_chip_1l3p8_186", Y = "_clear_1l3p8_211", s = {
+  "multi-select-search": "_multi-select-search_1l3p8_2",
+  disabled: W,
+  container: B,
+  "container-open": "_container-open_1l3p8_18",
+  "group-header": "_group-header_1l3p8_22",
+  "options-container": "_options-container_1l3p8_32",
+  l: L,
+  loader: T,
+  "input-container": "_input-container_1l3p8_45",
+  full: V,
+  "selected-icon": "_selected-icon_1l3p8_54",
+  "selector-icon-open": "_selector-icon-open_1l3p8_58",
+  button: $,
+  "selector-icon": "_selector-icon_1l3p8_58",
+  options: y,
+  visible: G,
+  top: H,
+  bottom: J,
+  "no-options": "_no-options_1l3p8_118",
+  m: K,
+  "multi-select-input-disabled": "_multi-select-input-disabled_1l3p8_154",
+  "multi-select-input": "_multi-select-input_1l3p8_154",
+  focused: R,
+  option: U,
+  "option-active": "_option-active_1l3p8_176",
+  "option-inner": "_option-inner_1l3p8_179",
+  chip: X,
+  "chip-container": "_chip-container_1l3p8_191",
+  "chip-root": "_chip-root_1l3p8_197",
+  "right-slot": "_right-slot_1l3p8_201",
+  "required-mark": "_required-mark_1l3p8_206",
+  clear: Y,
+  "icon-button": "_icon-button_1l3p8_220",
+  "highlighted-text": "_highlighted-text_1l3p8_224",
+  "highlighted-text-wrapper": "_highlighted-text-wrapper_1l3p8_229",
+  "nested-option": "_nested-option_1l3p8_233",
+  "expand-button": "_expand-button_1l3p8_241",
+  "expand-icon": "_expand-icon_1l3p8_253",
+  "expand-icon-expanded": "_expand-icon-expanded_1l3p8_256"
+}, cn = ({
+  filteredItems: p,
+  selectedItems: v,
+  expandedOptions: S,
+  setExpandedOptions: a,
+  size: _,
+  classNameOption: N,
+  items: h,
+  enableNestedSelection: u,
+  searchInNestedItems: f = !1,
+  internalSearchQuery: g,
+  renderOptionContent: D,
+  groupBy: E,
+  useIconInsteadOfCheckbox: A = !1
+}) => {
+  const b = (t) => {
+    a((i) => {
+      const e = new Set(i);
+      return e.has(t) ? e.delete(t) : e.add(t), e;
+    });
+  };
+  j(() => {
+    if (u && f && g) {
+      const t = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), e = (c) => {
+        c.forEach((n) => {
+          i.has(n.id) || (i.add(n.id), n.children && n.children.length > 0 && (n.children.some(
+            (l) => p.some((o) => o.id === l.id)
+          ) && t.add(n.id), e(n.children)));
+        });
+      };
+      e(h), a((c) => /* @__PURE__ */ new Set([...c, ...t]));
+    }
+  }, [
+    p,
+    u,
+    f,
+    g,
+    h,
+    a
+  ]);
+  const I = (t) => {
+    const i = v.map((o) => o.id);
+    if (!t.children || t.children.length === 0)
+      return {
+        checked: i.includes(t.id),
+        isMinusIcon: !1
+      };
+    const e = t.children.flatMap((o) => [
+      o.id,
+      ...F(o)
+    ]), c = e.filter(
+      (o) => i.includes(o)
+    ).length, n = e.length, d = c > 0;
+    return {
+      checked: d,
+      isMinusIcon: d && !(c === n)
+    };
+  }, m = (t, i = 0) => {
+    const e = /* @__PURE__ */ new Map(), c = (n) => {
+      if (e.has(n.id))
+        return e.get(n.id);
+      if (p.some((l) => l.id === n.id))
+        return e.set(n.id, !0), !0;
+      if (n.children && n.children.length > 0) {
+        const l = n.children.some(
+          (o) => c(o)
+        );
+        return e.set(n.id, l), l;
+      }
+      return e.set(n.id, !1), !1;
+    };
+    return t.filter((n) => i === 0 ? c(n) && h.some((d) => d.id === n.id) : f ? c(n) : !n.children).map((n) => {
+      const d = S.has(n.id), l = n.children && n.children.length > 0, o = I(n);
+      return /* @__PURE__ */ C("div", { children: [
+        /* @__PURE__ */ C(
+          P,
+          {
+            value: n,
+            className: ({ focus: x }) => w(s.option, N, _ && s[_], {
+              [s["option-active"]]: x && !E && !u,
+              [s["nested-option"]]: i > 0
+            }),
+            children: [
+              A ? o.checked && /* @__PURE__ */ r(
+                k,
+                {
+                  iconName: _ === M.L ? "Done24px" : "Done16px",
+                  className: s["selected-icon"]
+                }
+              ) : /* @__PURE__ */ r(
+                q,
+                {
+                  isInteractive: !1,
+                  checked: o.checked,
+                  isMinusIcon: o.isMinusIcon
+                }
+              ),
+              /* @__PURE__ */ r("div", { className: s["option-inner"], children: D(n) }),
+              l && /* @__PURE__ */ r(
+                "div",
+                {
+                  className: s["expand-button"],
+                  "data-testid": `expand-button-${n.id}`,
+                  onMouseDown: (x) => {
+                    x.stopPropagation(), b(n.id);
+                  },
+                  children: /* @__PURE__ */ r(
+                    k,
+                    {
+                      iconName: _ === M.M ? "DropdownArrowBottom16px" : "DropdownArrowDown24px",
+                      className: w(s["expand-icon"], {
+                        [s["expand-icon-expanded"]]: d
+                      })
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        ),
+        l && d && /* @__PURE__ */ r("div", { className: s["nested-children"], children: m(n.children, i + 1) })
+      ] }, n.id);
+    });
+  };
+  return {
+    toggleExpanded: b,
+    renderNestedOptions: m
+  };
+};
+export {
+  s as c,
+  cn as u
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mimir-ui-kit",
   "private": false,
-  "version": "1.46.0",
+  "version": "1.47.0",
   "type": "module",
   "exports": {
     ".": {

package/dist/useNestedSelection-DnuUbEqM.js

@@ -1,119 +0,0 @@
-import { jsxs as r, jsx as _ } from "react/jsx-runtime";
-import { c as a } from "./index-DIxK0V-G.js";
-import { Icon as w } from "./icons/Icon.js";
-import { CheckboxMimir as k } from "./components/CheckboxMimir/CheckboxMimir.js";
-import { EMultiSelectSearchSize as N } from "./components/MultiSelectSearch/constants.js";
-import { isOptionSelected as S } from "./components/MultiSelectSearch/utils.js";
-import { W as y } from "./combobox-fIVOzEhl.js";
-import './assets/useNestedSelection.css';const D = "_disabled_dbl8p_5", M = "_container_dbl8p_9", E = "_sticky_dbl8p_33", j = "_hidden_dbl8p_41", q = "_l_dbl8p_49", A = "_loader_dbl8p_53", C = "_full_dbl8p_63", O = "_button_dbl8p_75", W = "_options_dbl8p_45", B = "_visible_dbl8p_102", F = "_top_dbl8p_105", P = "_bottom_dbl8p_110", $ = "_m_dbl8p_2", G = "_focused_dbl8p_170", H = "_option_dbl8p_45", I = "_chip_dbl8p_199", J = "_clear_dbl8p_224", e = {
-  "multi-select-search": "_multi-select-search_dbl8p_2",
-  disabled: D,
-  container: M,
-  "container-open": "_container-open_dbl8p_18",
-  "group-header": "_group-header_dbl8p_22",
-  "sticky-active": "_sticky-active_dbl8p_33",
-  sticky: E,
-  hidden: j,
-  "options-container": "_options-container_dbl8p_45",
-  l: q,
-  loader: A,
-  "input-container": "_input-container_dbl8p_58",
-  full: C,
-  "selected-icon": "_selected-icon_dbl8p_67",
-  "selector-icon-open": "_selector-icon-open_dbl8p_71",
-  button: O,
-  "selector-icon": "_selector-icon_dbl8p_71",
-  options: W,
-  visible: B,
-  top: F,
-  bottom: P,
-  "no-options": "_no-options_dbl8p_131",
-  m: $,
-  "multi-select-input-disabled": "_multi-select-input-disabled_dbl8p_167",
-  "multi-select-input": "_multi-select-input_dbl8p_167",
-  focused: G,
-  option: H,
-  "option-active": "_option-active_dbl8p_189",
-  "option-inner": "_option-inner_dbl8p_192",
-  chip: I,
-  "chip-container": "_chip-container_dbl8p_204",
-  "chip-root": "_chip-root_dbl8p_210",
-  "right-slot": "_right-slot_dbl8p_214",
-  "required-mark": "_required-mark_dbl8p_219",
-  clear: J,
-  "icon-button": "_icon-button_dbl8p_233",
-  "highlighted-text": "_highlighted-text_dbl8p_237",
-  "highlighted-text-wrapper": "_highlighted-text-wrapper_dbl8p_242",
-  "nested-option": "_nested-option_dbl8p_246",
-  "expand-button": "_expand-button_dbl8p_254",
-  "expand-icon": "_expand-icon_dbl8p_266",
-  "expand-icon-expanded": "_expand-icon-expanded_dbl8p_269"
-}, X = ({
-  filteredItems: b,
-  selectedItems: h,
-  expandedOptions: u,
-  setExpandedOptions: m,
-  size: c,
-  classNameOption: x,
-  items: f,
-  renderOptionContent: g
-}) => {
-  const l = (n) => {
-    m((i) => {
-      const o = new Set(i);
-      return o.has(n) ? o.delete(n) : o.add(n), o;
-    });
-  }, s = (n, i = 0) => n.filter((o) => {
-    const p = b.some((t) => t.id === o.id);
-    return i === 0 ? p && f.some((t) => t.id === o.id) : !o.children;
-  }).map((o) => {
-    const p = u.has(o.id), t = o.children && o.children.length > 0, v = S(
-      o,
-      h.map((d) => d.id)
-    );
-    return /* @__PURE__ */ r("div", { children: [
-      /* @__PURE__ */ r(
-        y,
-        {
-          value: o,
-          className: ({ focus: d }) => a(e.option, x, c && e[c], {
-            [e["option-active"]]: d,
-            [e["nested-option"]]: i > 0
-          }),
-          children: [
-            /* @__PURE__ */ _(k, { isInteractive: !1, checked: v }),
-            /* @__PURE__ */ _("div", { className: e["option-inner"], children: g(o) }),
-            t && /* @__PURE__ */ _(
-              "div",
-              {
-                className: e["expand-button"],
-                "data-testid": `expand-button-${o.id}`,
-                onMouseDown: (d) => {
-                  d.stopPropagation(), l(o.id);
-                },
-                children: /* @__PURE__ */ _(
-                  w,
-                  {
-                    iconName: c === N.M ? "DropdownArrowBottom16px" : "DropdownArrowDown24px",
-                    className: a(e["expand-icon"], {
-                      [e["expand-icon-expanded"]]: p
-                    })
-                  }
-                )
-              }
-            )
-          ]
-        }
-      ),
-      t && p && /* @__PURE__ */ _("div", { className: e["nested-children"], children: s(o.children, i + 1) })
-    ] }, o.id);
-  });
-  return {
-    toggleExpanded: l,
-    renderNestedOptions: s
-  };
-};
-export {
-  e as c,
-  X as u
-};