mimir-ui-kit 1.43.28 → 1.44.1

package/dist/components/SelectSearch/SelectSearch.js

@@ -1,188 +1,192 @@
-import { jsx as s, jsxs as c, Fragment as A } from "react/jsx-runtime";
+import { jsx as s, jsxs as c, Fragment as T } from "react/jsx-runtime";
 import { u as Ae } from "../../index-D5H8gPPn.js";
-import { c as i } from "../../index-DIxK0V-G.js";
-import { forwardRef as Be, useRef as ue, useState as x, useMemo as F, useCallback as me, useEffect as H } from "react";
-import { ESelectSearchSize as l, ELoadingIndicatorPlacement as I } from "./constants.js";
-import { prepareGroupedItems as Pe, shouldShowMenuOnTop as Ge, mapSizeToInputSize as pe, getDropdownArrowIcon as qe } from "./utils.js";
-import { Icon as $ } from "../../icons/Icon.js";
-import { Button as je } from "../Button/Button.js";
-import { I as he } from "../../Input-BU_6U1CW.js";
-import { EInputVariant as Fe } from "../Input/constants.js";
-import { Loader as _e } from "../Loader/Loader.js";
-import { H as He, U as fe, G as ve, W as ge, K as $e } from "../../combobox-fIVOzEhl.js";
-import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_container_1rthm_13", We = "_full_1rthm_26", Qe = "_button_1rthm_38", Re = "_options_1rthm_52", Ye = "_top_1rthm_63", Je = "_bottom_1rthm_69", Xe = "_s_1rthm_2", Ze = "_m_1rthm_110", et = "_l_1rthm_123", tt = "_loader_1rthm_161", nt = "_option_1rthm_52", ot = "_clear_1rthm_200", t = {
-  "select-search": "_select-search_1rthm_2",
-  disabled: Ke,
+import { c as r } from "../../index-DIxK0V-G.js";
+import { forwardRef as Be, useRef as me, useState as N, useMemo as F, useCallback as pe, useEffect as H } from "react";
+import { ESelectSearchSize as l, ELoadingIndicatorPlacement as S, ESelectSearchBorderRadius as Pe } from "./constants.js";
+import { prepareGroupedItems as Ge, shouldShowMenuOnTop as je, mapSizeToInputSize as he, getDropdownArrowIcon as Fe } from "./utils.js";
+import { Icon as R } from "../../icons/Icon.js";
+import { Button as He } from "../Button/Button.js";
+import { I as _e } from "../../Input-IzZ6B9kw.js";
+import { EInputVariant as Re } from "../Input/constants.js";
+import { Loader as fe } from "../Loader/Loader.js";
+import { H as $e, U as xe, G as ve, W as ge, K as Ke } from "../../combobox-fIVOzEhl.js";
+import '../../assets/SelectSearch.css';const Ue = "_container_1x6qm_2", We = "_options_1x6qm_15", Qe = "_top_1x6qm_26", Ye = "_bottom_1x6qm_32", Je = "_disabled_1x6qm_63", Xe = "_full_1x6qm_100", Ze = "_button_1x6qm_112", et = "_s_1x6qm_59", tt = "_m_1x6qm_140", nt = "_l_1x6qm_153", ot = "_loader_1x6qm_191", st = "_option_1x6qm_15", it = "_clear_1x6qm_230", t = {
   container: Ue,
-  "container-open": "_container-open_1rthm_22",
-  full: We,
-  "selected-icon": "_selected-icon_1rthm_30",
-  "selector-icon-open": "_selector-icon-open_1rthm_34",
-  button: Qe,
-  "selector-icon": "_selector-icon_1rthm_34",
-  options: Re,
-  top: Ye,
-  bottom: Je,
-  "no-options": "_no-options_1rthm_75",
-  s: Xe,
-  m: Ze,
-  l: et,
-  "select-search-input": "_select-search-input_1rthm_136",
-  "select-search-input-disabled": "_select-search-input-disabled_1rthm_139",
-  "group-header": "_group-header_1rthm_146",
-  "sticky-active": "_sticky-active_1rthm_157",
-  loader: tt,
-  "input-container": "_input-container_1rthm_166",
-  option: nt,
-  "option-active": "_option-active_1rthm_180",
-  "option-inner": "_option-inner_1rthm_183",
-  "right-slot": "_right-slot_1rthm_190",
-  "required-mark": "_required-mark_1rthm_195",
-  clear: ot,
-  "icon-button": "_icon-button_1rthm_209"
-}, st = Be(
+  "container-open": "_container-open_1x6qm_11",
+  options: We,
+  top: Qe,
+  bottom: Ye,
+  "no-options": "_no-options_1x6qm_38",
+  "select-search": "_select-search_1x6qm_59",
+  disabled: Je,
+  "border-radius-left": "_border-radius-left_1x6qm_69",
+  "border-radius-right": "_border-radius-right_1x6qm_81",
+  "border-radius-none": "_border-radius-none_1x6qm_93",
+  full: Xe,
+  "selected-icon": "_selected-icon_1x6qm_104",
+  "selector-icon-open": "_selector-icon-open_1x6qm_108",
+  button: Ze,
+  "selector-icon": "_selector-icon_1x6qm_108",
+  s: et,
+  m: tt,
+  l: nt,
+  "select-search-input": "_select-search-input_1x6qm_166",
+  "select-search-input-disabled": "_select-search-input-disabled_1x6qm_169",
+  "group-header": "_group-header_1x6qm_176",
+  "sticky-active": "_sticky-active_1x6qm_187",
+  loader: ot,
+  "input-container": "_input-container_1x6qm_196",
+  option: st,
+  "option-active": "_option-active_1x6qm_210",
+  "option-inner": "_option-inner_1x6qm_213",
+  "right-slot": "_right-slot_1x6qm_220",
+  "required-mark": "_required-mark_1x6qm_225",
+  clear: it,
+  "icon-button": "_icon-button_1x6qm_239"
+}, rt = Be(
   (be, ye) => {
     const {
-      placeholder: K,
+      placeholder: $,
       size: o = l.L,
       value: d,
       onChange: a,
-      full: Ne,
-      showArrow: Se = !0,
-      items: g = [],
-      classNameOption: U,
-      classNameOptionInner: W,
-      displayValue: w = "name",
-      filterOnSearch: Q = !0,
-      onSearch: k,
-      variant: R = Fe.DefaultGray,
-      menuPlacement: C = "bottom",
+      full: qe,
+      showArrow: Ne = !0,
+      items: v = [],
+      classNameOption: K,
+      classNameOptionInner: U,
+      displayValue: I = "name",
+      filterOnSearch: W = !0,
+      onSearch: w,
+      variant: Q = Re.DefaultGray,
+      menuPlacement: k = "bottom",
       disabled: u = !1,
       searchProps: Y,
-      withClearButton: B = !1,
+      withClearButton: A = !1,
       disableInput: _ = !1,
       autocomplete: J = "on",
-      immediate: xe = !1,
+      immediate: Se = !1,
       noOptionsText: Ie = "Нет данных",
       noMatchText: we = "Ничего не найдено",
-      loadOnOpen: P,
+      loadOnOpen: B,
       loading: X,
-      loadingIndicatorPlacement: L = I.Dropdown,
+      loadingIndicatorPlacement: C = S.Dropdown,
       groupBy: h,
       getGroupTitle: Z = (e) => e,
       optionLayout: ke = "name-bottom",
-      autoPlacement: z = !1
-    } = be, G = (e) => {
+      autoPlacement: L = !1,
+      borderRadius: ee = Pe.All
+    } = be, P = (e) => {
       if (!e) return "";
-      const n = e[w];
+      const n = e[I];
       return typeof n == "string" ? n : String(n || "");
     }, Ce = (e) => {
-      const n = e[w];
+      const n = e[I];
       return typeof n == "string" ? n : String(n || "");
-    }, q = G(d), O = ue(null), ee = ue(null), [f, b] = x(q), [m, y] = x(d), [Le, te] = x(!1), [j, ze] = x(null), [E, ne] = x(C), oe = X !== void 0 ? X : Le, N = F(() => {
-      if (!Q)
-        return g;
+    }, G = P(d), z = me(null), te = me(null), [f, g] = N(G), [m, b] = N(d), [Le, ne] = N(!1), [j, ze] = N(null), [O, oe] = N(k), se = X !== void 0 ? X : Le, y = F(() => {
+      if (!W)
+        return v;
       const e = String(f || "").trim().toLowerCase();
-      return e ? g.filter((n) => Ce(n).toLowerCase().includes(e)) : g;
-    }, [f, g, Q, w]), S = F(() => h ? Pe(
-      N,
+      return e ? v.filter((n) => Ce(n).toLowerCase().includes(e)) : v;
+    }, [f, v, W, I]), q = F(() => h ? Ge(
+      y,
       h,
       Z || ((e) => e)
-    ) : N, [N, h, Z]), D = F(() => {
+    ) : y, [y, h, Z]), E = F(() => {
       const e = [];
-      return S.forEach((n, r) => {
-        n.isGroupHeader && e.push(r);
+      return q.forEach((n, i) => {
+        n.isGroupHeader && e.push(i);
       }), e;
-    }, [S]), v = Ae({
-      count: S.length,
-      getScrollElement: () => O.current,
+    }, [q]), x = Ae({
+      count: q.length,
+      getScrollElement: () => z.current,
       estimateSize: () => o === l.L ? 65 : 49,
       overscan: 10
-    }), p = me(() => {
-      if (!z) {
-        ne(C);
+    }), p = pe(() => {
+      if (!L) {
+        oe(k);
         return;
       }
-      const e = Ge(ee, o);
-      ne(e ? "top" : C);
-    }, [z, C, o]);
+      const e = je(te, o);
+      oe(e ? "top" : k);
+    }, [L, k, o]);
     H(() => {
-      if (z)
+      if (L)
         return p(), window.addEventListener("scroll", p), window.addEventListener("resize", p), () => {
           window.removeEventListener("scroll", p), window.removeEventListener("resize", p);
         };
-    }, [z, p]), H(() => {
-      const e = O.current;
+    }, [L, p]), H(() => {
+      const e = z.current;
       if (!e || !h) return;
       const n = () => {
-        var ce, le;
-        const r = e.scrollTop;
-        let V = null;
-        for (let M = 0; M < D.length; M++) {
-          const de = D[M];
-          if ((((ce = v.getVirtualItems().find((T) => T.index === de)) == null ? void 0 : ce.start) || 0) <= r) {
-            V = de;
-            const T = D[M + 1];
-            if (T !== void 0 && (((le = v.getVirtualItems().find((Te) => Te.index === T)) == null ? void 0 : le.start) || 0) <= r)
+        var le, de;
+        const i = e.scrollTop;
+        let D = null;
+        for (let V = 0; V < E.length; V++) {
+          const ue = E[V];
+          if ((((le = x.getVirtualItems().find((M) => M.index === ue)) == null ? void 0 : le.start) || 0) <= i) {
+            D = ue;
+            const M = E[V + 1];
+            if (M !== void 0 && (((de = x.getVirtualItems().find((Te) => Te.index === M)) == null ? void 0 : de.start) || 0) <= i)
               continue;
           } else
             break;
         }
-        ze(V);
+        ze(D);
       };
       return e.addEventListener("scroll", n), () => e.removeEventListener("scroll", n);
-    }, [v, D, h, O.current]);
-    const se = async () => {
-      if (P)
+    }, [x, E, h, z.current]);
+    const ie = async () => {
+      if (B)
         try {
-          te(!0), await P();
+          ne(!0), await B();
         } finally {
-          te(!1);
+          ne(!1);
         }
     }, Oe = (e) => {
       if (e) {
-        const n = G(e);
-        b(n), y(e), a == null || a(e);
+        const n = P(e);
+        g(n), b(e), a == null || a(e);
       } else
-        b(""), y(null), a == null || a({ id: "", name: "" });
-    }, re = me(
+        g(""), b(null), a == null || a({ id: "", name: "" });
+    }, re = pe(
       (e) => {
         if (_) return;
         const n = e.target.value;
-        b(n), k == null || k(n), m && n !== G(m) && y(null), !n && d && (a == null || a({ id: "", name: "" }));
+        g(n), w == null || w(n), m && n !== P(m) && b(null), !n && d && (a == null || a({ id: "", name: "" }));
       },
-      [_, a, k, d, m, w]
+      [_, a, w, d, m, I]
     ), Ee = () => {
-      b(""), y(null), a == null || a({ id: "", name: "" });
-    }, ie = async (e) => {
-      _ && e.target.blur(), p(), P && await se();
+      g(""), b(null), a == null || a({ id: "", name: "" });
+    }, ae = async (e) => {
+      _ && e.target.blur(), p(), B && await ie();
     };
     H(() => {
       const e = !d || typeof d == "object" && !Object.keys(d).length;
-      b(e ? "" : q), y(e ? null : d);
-    }, [d, q]);
-    const De = () => oe && (L === I.Dropdown || L === I.Both) ? /* @__PURE__ */ c("div", { className: t.loader, children: [
-      /* @__PURE__ */ s(_e, { size: "s" }),
+      g(e ? "" : G), b(e ? null : d);
+    }, [d, G]);
+    const De = () => se && (C === S.Dropdown || C === S.Both) ? /* @__PURE__ */ c("div", { className: t.loader, children: [
+      /* @__PURE__ */ s(fe, { size: "s" }),
       "Загрузка..."
     ] }) : Ie, Ve = (e) => {
-      if (Se)
+      if (Ne)
         return {
           addonType: "react-node",
-          addonContent: /* @__PURE__ */ c(A, { children: [
-            oe && (L === I.Input || L === I.Both) && /* @__PURE__ */ s(_e, { size: "s" }),
+          addonContent: /* @__PURE__ */ c(T, { children: [
+            se && (C === S.Input || C === S.Both) && /* @__PURE__ */ s(fe, { size: "s" }),
             /* @__PURE__ */ s(
-              fe,
+              xe,
               {
-                className: i(t.button, {
+                className: r(t.button, {
                   [t.disabled]: u
                 }),
                 disabled: u,
                 onClick: p,
                 children: /* @__PURE__ */ s(
-                  $,
+                  R,
                   {
                     iconName: o == l.M || o == l.S ? "DropdownArrowBottom16px" : "DropdownArrowDown24px",
-                    className: i(t["selector-icon"], {
+                    className: r(t["selector-icon"], {
                       [t["selector-icon-open"]]: e
                     })
                   }
@@ -191,24 +195,24 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
             )
           ] })
         };
-    }, ae = (e) => {
-      const n = e.name, r = e.bottom && /* @__PURE__ */ s("div", { children: e.bottom });
-      return ke === "bottom-name" ? /* @__PURE__ */ c(A, { children: [
-        r,
+    }, ce = (e) => {
+      const n = e.name, i = e.bottom && /* @__PURE__ */ s("div", { children: e.bottom });
+      return ke === "bottom-name" ? /* @__PURE__ */ c(T, { children: [
+        i,
         n
-      ] }) : /* @__PURE__ */ c(A, { children: [
+      ] }) : /* @__PURE__ */ c(T, { children: [
         n,
-        r
+        i
       ] });
-    }, Me = (e) => g.length ? N.length ? h ? /* @__PURE__ */ c(
+    }, Me = (e) => v.length ? y.length ? h ? /* @__PURE__ */ c(
       "div",
       {
-        ref: O,
+        ref: z,
         "data-testid": "select-search-options",
-        className: i(
+        className: r(
           t.options,
           t[o],
-          t[E]
+          t[O]
         ),
         style: {
           height: o === l.M || o === l.S ? "240px" : "320px",
@@ -224,23 +228,23 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
                 top: 0,
                 zIndex: 3
               },
-              children: S[j].name
+              children: q[j].name
             }
           ),
           /* @__PURE__ */ s(
             "div",
             {
               style: {
-                height: `${v.getTotalSize()}px`,
+                height: `${x.getTotalSize()}px`,
                 width: "100%"
               },
-              children: v.getVirtualItems().map((n) => {
-                const r = S[n.index];
+              children: x.getVirtualItems().map((n) => {
+                const i = q[n.index];
                 return /* @__PURE__ */ s(
                   "div",
                   {
                     "data-index": n.index,
-                    ref: v.measureElement,
+                    ref: x.measureElement,
                     style: {
                       position: "absolute",
                       top: 0,
@@ -248,41 +252,41 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
                       width: "100%",
                       transform: `translateY(${n.start}px)`
                     },
-                    children: r.isGroupHeader ? /* @__PURE__ */ s(
+                    children: i.isGroupHeader ? /* @__PURE__ */ s(
                       "div",
                       {
                         className: t["group-header"],
                         style: {
                           visibility: j === n.index ? "hidden" : "visible"
                         },
-                        children: r.name
+                        children: i.name
                       }
                     ) : /* @__PURE__ */ c(
                       ge,
                       {
-                        value: r,
-                        className: ({ focus: V }) => i(
+                        value: i,
+                        className: ({ focus: D }) => r(
                           t.option,
-                          U,
+                          K,
                           o && t[o],
                           {
-                            [t["option-active"]]: V
+                            [t["option-active"]]: D
                           }
                         ),
-                        "data-testid": `select-search-option-${r.id}`,
+                        "data-testid": `select-search-option-${i.id}`,
                         children: [
                           /* @__PURE__ */ s(
                             "div",
                             {
-                              className: i(
+                              className: r(
                                 t["option-inner"],
-                                W
+                                U
                               ),
-                              children: ae(r)
+                              children: ce(i)
                             }
                           ),
-                          m && m.id === r.id && /* @__PURE__ */ s(
-                            $,
+                          m && m.id === i.id && /* @__PURE__ */ s(
+                            R,
                             {
                               iconName: o === l.M || o === l.S ? "Done16px" : "Done24px",
                               className: t["selected-icon"]
@@ -290,7 +294,7 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
                           )
                         ]
                       },
-                      r.id
+                      i.id
                     )
                   },
                   n.key
@@ -301,12 +305,12 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
         ]
       }
     ) : /* @__PURE__ */ s(
-      $e,
+      Ke,
       {
-        className: i(
+        className: r(
           t.options,
           t[o],
-          t[E]
+          t[O]
         ),
         "data-testid": "select-search-options",
         style: { width: "100%" },
@@ -315,11 +319,11 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
           ge,
           {
             value: n,
-            className: ({ focus: r }) => i(
+            className: ({ focus: i }) => r(
               t.option,
-              U,
+              K,
               {
-                [t["option-active"]]: r
+                [t["option-active"]]: i
               },
               o && t[o]
             ),
@@ -327,15 +331,15 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
               /* @__PURE__ */ s(
                 "div",
                 {
-                  className: i(
+                  className: r(
                     t["option-inner"],
-                    W
+                    U
                   ),
-                  children: ae(n)
+                  children: ce(n)
                 }
               ),
               m && m.id === n.id && /* @__PURE__ */ s(
-                $,
+                R,
                 {
                   iconName: o === l.M || o === l.S ? "Done16px" : "Done24px",
                   className: t["selected-icon"]
@@ -349,11 +353,11 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
     ) : /* @__PURE__ */ s(
       "div",
       {
-        className: i(
+        className: r(
           t.options,
           t[o],
           t["no-options"],
-          t[E]
+          t[O]
         ),
         "data-headlessui-state": e ? "open" : "closed",
         children: we
@@ -361,78 +365,79 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
     ) : /* @__PURE__ */ s(
       "div",
       {
-        className: i(
+        className: r(
           t.options,
           t[o],
           t["no-options"],
-          t[E]
+          t[O]
         ),
         "data-headlessui-state": e ? "open" : "closed",
         children: De()
       }
     );
     return /* @__PURE__ */ s(
-      He,
+      $e,
       {
         as: "div",
         value: m,
-        className: i(t["select-search"], {
-          [t.full]: Ne,
+        className: r(t["select-search"], {
+          [t.full]: qe,
           [t.disabled]: u
         }),
         onChange: Oe,
         ref: ye,
         disabled: u,
-        virtual: h ? void 0 : { options: N },
-        immediate: xe,
-        children: ({ open: e }) => /* @__PURE__ */ c(A, { children: [
+        virtual: h ? void 0 : { options: y },
+        immediate: Se,
+        children: ({ open: e }) => /* @__PURE__ */ c(T, { children: [
           /* @__PURE__ */ c(
             "div",
             {
-              ref: ee,
-              className: i(t.container, t[o], {
+              ref: te,
+              className: r(t.container, t[o], {
                 [t["container-open"]]: e
               }),
               children: [
                 _ && /* @__PURE__ */ c("div", { className: t["input-container"], children: [
                   /* @__PURE__ */ s(
-                    fe,
+                    xe,
                     {
                       disabled: u,
                       style: { width: "100%" },
-                      onClick: se,
+                      onClick: ie,
                       children: /* @__PURE__ */ s(
                         ve,
                         {
-                          as: he,
-                          label: K,
-                          size: pe(o),
-                          className: i(t["select-search-input"], {
-                            [t["select-search-input-disabled"]]: _ && B
+                          as: _e,
+                          label: $,
+                          size: he(o),
+                          className: r(t["select-search-input"], {
+                            [t["select-search-input-disabled"]]: _ && A
                           }),
                           onChange: re,
                           value: f,
                           disabled: u,
-                          variant: R,
+                          variant: Q,
                           rightSlotClassName: t["right-slot"],
                           requiredMarkClassName: t["required-mark"],
                           "data-testid": "select-search-input",
-                          onFocus: ie,
+                          onFocus: ae,
                           rightAddon: {
                             addonType: "icon",
-                            addonContent: qe(e, o)
+                            addonContent: Fe(e, o)
                           },
                           autocomplete: J,
+                          borderRadius: ee,
                           ...Y
                         }
                       )
                     }
                   ),
-                  B && f && /* @__PURE__ */ s(
-                    je,
+                  A && f && /* @__PURE__ */ s(
+                    He,
                     {
                       tabIndex: -1,
-                      className: i(t.clear, {
+                      className: r(t.clear, {
                         [t.disabled]: u
                       }),
                       iconButtonClassName: t["icon-button"],
@@ -452,21 +457,22 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
                 !_ && /* @__PURE__ */ s(
                   ve,
                   {
-                    as: he,
-                    label: K,
-                    size: pe(o),
+                    as: _e,
+                    label: $,
+                    size: he(o),
                     className: t["select-search-input"],
                     rightSlotClassName: t["right-slot"],
                     requiredMarkClassName: t["required-mark"],
                     value: f,
                     disabled: u,
-                    variant: R,
-                    withClearButton: B && !!f,
+                    variant: Q,
+                    withClearButton: A && !!f,
                     onChange: re,
                     rightAddon: Ve(e),
                     "data-testid": "select-search-input",
-                    onFocus: ie,
+                    onFocus: ae,
                     autocomplete: J,
+                    borderRadius: ee,
                     ...Y
                   }
                 )
@@ -479,7 +485,7 @@ import '../../assets/SelectSearch.css';const Ke = "_disabled_1rthm_6", Ue = "_co
     );
   }
 );
-st.displayName = "SelectSearch";
+rt.displayName = "SelectSearch";
 export {
-  st as SelectSearch
+  rt as SelectSearch
 };

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

@@ -11,3 +11,9 @@ export declare enum ELoadingIndicatorPlacement {
 }
 export declare const MOBILE_MENU_HEIGHT = 240;
 export declare const DESKTOP_MENU_HEIGHT = 320;
+export declare enum ESelectSearchBorderRadius {
+    All = "all",
+    Left = "left",
+    Right = "right",
+    None = "none"
+}