mimir-ui-kit 1.42.1 → 1.43.0

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

@@ -1,3 +1,3 @@
 export { SelectSearch } from './SelectSearch';
 export type { TSelectSearchProps, TSelectOption } from './types';
-export { ESelectSearchSize } from './constants';
+export { ESelectSearchSize, ELoadingIndicatorPlacement as ESSLoadingPlacement } from './constants';

package/dist/components/SelectSearch/index.js

@@ -1,6 +1,7 @@
-import { SelectSearch as S } from "./SelectSearch.js";
-import { ESelectSearchSize as o } from "./constants.js";
+import { SelectSearch as c } from "./SelectSearch.js";
+import { ELoadingIndicatorPlacement as r, ESelectSearchSize as t } from "./constants.js";
 export {
-  o as ESelectSearchSize,
-  S as SelectSearch
+  r as ESSLoadingPlacement,
+  t as ESelectSearchSize,
+  c as SelectSearch
 };

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

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { ESelectSearchSize } from './constants';
+import { ELoadingIndicatorPlacement, ESelectSearchSize } from './constants';
 import { TInputProps } from '../Input';
 
 export type TSelectOption = {
@@ -56,4 +56,35 @@ export type TSelectSearchProps = Pick<TInputProps, 'withClearButton' | 'variant'
     autocomplete?: 'on' | 'off';
     /** Показывать список при фокусе или нет */
     immediate?: boolean;
+    /**
+     * Текст, отображаемый при отсутствии опций для выбора
+     */
+    noOptionsText?: string | ReactNode;
+    /**
+     * Текст, отображаемый при отсутствии результатов поиска
+     */
+    noMatchText?: string | ReactNode;
+    /**
+     * Функция обратного вызова, вызываемая при открытии выпадающего списка
+     * Можно использовать для загрузки данных
+     */
+    loadOnOpen?: () => void;
+    /**
+     * Флаг состояния загрузки
+     */
+    loading?: boolean;
+    /**
+     * Положение индикатора загрузки
+     */
+    loadingIndicatorPlacement?: ELoadingIndicatorPlacement | `${ELoadingIndicatorPlacement}`;
+    /**
+     * Ключ объекта TSelectOption, по которому нужно группировать элементы
+     */
+    groupBy?: string;
+    /**
+     * Функция для получения заголовка группы из значения группировки
+     * @param groupValue Значение поля группировки
+     * @returns Строка для отображения в заголовке группы
+     */
+    getGroupTitle?: (groupValue: string) => string;
 };

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

@@ -1,5 +1,7 @@
 import { ESelectSearchSize } from './constants';
+import { TSelectOption } from './types';
 import { EInputSize } from '../Input';
 
 export declare const mapSizeToInputSize: (size: ESelectSearchSize) => EInputSize;
 export declare const getDropdownArrowIcon: (isOpen: boolean, size: ESelectSearchSize) => "DropdownArrowBottom16px" | "DropdownArrowUp16px" | "DropdownArrowUp24px" | "DropdownArrowDown24px";
+export declare const prepareGroupedItems: (items: TSelectOption[], groupBy: string, getGroupTitle: (value: string) => string) => TSelectOption[];

package/dist/components/SelectSearch/utils.js

@@ -1,19 +1,33 @@
-import { ESelectSearchSize as r } from "./constants.js";
+import { ESelectSearchSize as t } from "./constants.js";
 import "../../Input-BU_6U1CW.js";
-import { EInputSize as o } from "../Input/constants.js";
-const c = (t) => {
-  switch (t) {
-    case r.S:
-      return o.S;
-    case r.M:
-      return o.M;
-    case r.L:
-      return o.L;
+import { EInputSize as n } from "../Input/constants.js";
+const w = (r) => {
+  switch (r) {
+    case t.S:
+      return n.S;
+    case t.M:
+      return n.M;
+    case t.L:
+      return n.L;
     default:
-      return o.M;
+      return n.M;
   }
-}, u = (t, e) => t ? e === r.L ? "DropdownArrowUp24px" : "DropdownArrowUp16px" : e === r.L ? "DropdownArrowDown24px" : "DropdownArrowBottom16px";
+}, S = (r, o) => r ? o === t.L ? "DropdownArrowUp24px" : "DropdownArrowUp16px" : o === t.L ? "DropdownArrowDown24px" : "DropdownArrowBottom16px", f = (r, o, a) => {
+  if (!r.length || !o) return r;
+  const p = [], u = /* @__PURE__ */ new Set();
+  for (const s of r) {
+    const e = String(s[o] || "Без группы");
+    u.has(e) || (u.add(e), p.push({
+      id: `group-header-${e}`,
+      name: a(e),
+      isGroupHeader: !0,
+      originalValue: e
+    })), p.push(s);
+  }
+  return p;
+};
 export {
-  u as getDropdownArrowIcon,
-  c as mapSizeToInputSize
+  S as getDropdownArrowIcon,
+  w as mapSizeToInputSize,
+  f as prepareGroupedItems
 };

package/dist/components/Switcher/Switcher.js

@@ -1,97 +1,104 @@
-import { jsxs as L, jsx as N } from "react/jsx-runtime";
-import { H as te } from "../../field-BP5-U1Nr.js";
-import { K as I, w as re, z as se, U as ae, u as ce, a as le, b as oe, T as ie, I as ne, G as ue, j as he, p as me } from "../../label-DOlEWXBl.js";
-import { W as de, H as j, y as pe, p as fe, o as $, $ as be, b as we, D as _e, c as H } from "../../keyboard-CUMsrFX1.js";
-import u, { createContext as $e, useState as x, useMemo as G, useId as ge, useContext as ve, useRef as ke, useCallback as xe, Fragment as ye, forwardRef as Pe } from "react";
-import { w as Ce } from "../../use-active-press-BVQqDQ3V.js";
+import { jsxs as L, jsx as x } from "react/jsx-runtime";
+import { H as te } from "../../field-BLi5834s.js";
+import { K as I, w as re, z as ae, U as le, u as se, a as ce, b as ie, T as oe, I as ne, G as ue, j as de, p as he } from "../../label-BmphTIGY.js";
+import { W as me, H as j, y as pe, p as fe, o as g, $ as be, b as we, D as _e, c as H } from "../../keyboard-wis2TUql.js";
+import h, { createContext as ge, useState as y, useMemo as G, useId as ke, useContext as $e, useRef as ve, useCallback as xe, Fragment as ye, forwardRef as Pe } from "react";
+import { w as Ce } from "../../use-active-press-CnDeVvQq.js";
 import { e as De } from "../../use-resolve-button-type-DhFdPxnv.js";
 import { r as Fe } from "../../bugs-diTMAGNw.js";
-import { c as g } from "../../index-DIxK0V-G.js";
+import { c as k } from "../../index-DIxK0V-G.js";
 import { ELabelPositions as Ee } from "./constants.js";
-import '../../assets/Switcher.css';let y = $e(null);
-y.displayName = "GroupContext";
+import '../../assets/Switcher.css';let P = ge(null);
+P.displayName = "GroupContext";
 let Se = ye;
-function Te(s) {
-  var l;
-  let [e, n] = x(null), [h, m] = se(), [d, t] = ae(), a = G(() => ({ switch: e, setSwitch: n }), [e, n]), c = {}, p = s;
-  return u.createElement(t, { name: "Switch.Description", value: d }, u.createElement(m, { name: "Switch.Label", value: h, props: { htmlFor: (l = a.switch) == null ? void 0 : l.id, onClick(o) {
-    e && (o.currentTarget instanceof HTMLLabelElement && o.preventDefault(), e.click(), e.focus({ preventScroll: !0 }));
-  } } }, u.createElement(y.Provider, { value: a }, j({ ourProps: c, theirProps: p, slot: {}, defaultTag: Se, name: "Switch.Group" }))));
+function Te(a) {
+  var o;
+  let [e, u] = y(null), [m, p] = ae(), [f, t] = le(), s = G(() => ({ switch: e, setSwitch: u }), [e, u]), c = {}, n = a;
+  return h.createElement(t, { name: "Switch.Description", value: f }, h.createElement(p, { name: "Switch.Label", value: m, props: { htmlFor: (o = s.switch) == null ? void 0 : o.id, onClick(i) {
+    e && (i.currentTarget instanceof HTMLLabelElement && i.preventDefault(), e.click(), e.focus({ preventScroll: !0 }));
+  } } }, h.createElement(P.Provider, { value: s }, j({ ourProps: c, theirProps: n, slot: {}, defaultTag: Se, name: "Switch.Group" }))));
 }
-let Le = "button";
-function Ne(s, l) {
+let Ne = "button";
+function Le(a, o) {
   var e;
-  let n = ge(), h = ce(), m = le(), { id: d = h || `headlessui-switch-${n}`, disabled: t = m || !1, checked: a, defaultChecked: c, onChange: p, name: o, value: v, form: k, autoFocus: _ = !1, ...K } = s, P = ve(y), [R, M] = x(null), U = ke(null), O = pe(U, l, P === null ? null : P.setSwitch, M), f = oe(c), [b, w] = ie(a, p, f ?? !1), V = fe(), [C, D] = x(!1), F = $(() => {
-    D(!0), w == null || w(!b), V.nextFrame(() => {
-      D(!1);
+  let u = ke(), m = se(), p = ce(), { id: f = m || `headlessui-switch-${u}`, disabled: t = p || !1, checked: s, defaultChecked: c, onChange: n, name: i, value: $, form: v, autoFocus: d = !1, ...K } = a, C = $e(P), [R, M] = y(null), U = ve(null), O = pe(U, o, C === null ? null : C.setSwitch, M), b = ie(c), [w, _] = oe(s, n, b ?? !1), V = fe(), [D, F] = y(!1), E = g(() => {
+    F(!0), _ == null || _(!w), V.nextFrame(() => {
+      F(!1);
     });
-  }), W = $((r) => {
+  }), W = g((r) => {
     if (Fe(r.currentTarget)) return r.preventDefault();
-    r.preventDefault(), F();
-  }), q = $((r) => {
-    r.key === H.Space ? (r.preventDefault(), F()) : r.key === H.Enter && me(r.currentTarget);
-  }), z = $((r) => r.preventDefault()), A = ne(), B = ue(), { isFocusVisible: E, focusProps: J } = be({ autoFocus: _ }), { isHovered: S, hoverProps: Q } = we({ isDisabled: t }), { pressed: T, pressProps: X } = Ce({ disabled: t }), Y = G(() => ({ checked: b, disabled: t, hover: S, focus: E, active: T, autofocus: _, changing: C }), [b, S, E, T, t, C, _]), Z = _e({ id: d, ref: O, role: "switch", type: De(s, R), tabIndex: s.tabIndex === -1 ? 0 : (e = s.tabIndex) != null ? e : 0, "aria-checked": b, "aria-labelledby": A, "aria-describedby": B, disabled: t || void 0, autoFocus: _, onClick: W, onKeyUp: q, onKeyPress: z }, J, Q, X), ee = xe(() => {
-    if (f !== void 0) return w == null ? void 0 : w(f);
-  }, [w, f]);
-  return u.createElement(u.Fragment, null, o != null && u.createElement(he, { disabled: t, data: { [o]: v || "on" }, overrides: { type: "checkbox", checked: b }, form: k, onReset: ee }), j({ ourProps: Z, theirProps: K, slot: Y, defaultTag: Le, name: "Switch" }));
+    r.preventDefault(), E();
+  }), q = g((r) => {
+    r.key === H.Space ? (r.preventDefault(), E()) : r.key === H.Enter && he(r.currentTarget);
+  }), z = g((r) => r.preventDefault()), A = ne(), B = ue(), { isFocusVisible: S, focusProps: J } = be({ autoFocus: d }), { isHovered: T, hoverProps: Q } = we({ isDisabled: t }), { pressed: N, pressProps: X } = Ce({ disabled: t }), Y = G(() => ({ checked: w, disabled: t, hover: T, focus: S, active: N, autofocus: d, changing: D }), [w, T, S, N, t, D, d]), Z = _e({ id: f, ref: O, role: "switch", type: De(a, R), tabIndex: a.tabIndex === -1 ? 0 : (e = a.tabIndex) != null ? e : 0, "aria-checked": w, "aria-labelledby": A, "aria-describedby": B, disabled: t || void 0, autoFocus: d, onClick: W, onKeyUp: q, onKeyPress: z }, J, Q, X), ee = xe(() => {
+    if (b !== void 0) return _ == null ? void 0 : _(b);
+  }, [_, b]);
+  return h.createElement(h.Fragment, null, i != null && h.createElement(de, { disabled: t, data: { [i]: $ || "on" }, overrides: { type: "checkbox", checked: w }, form: v, onReset: ee }), j({ ourProps: Z, theirProps: K, slot: Y, defaultTag: Ne, name: "Switch" }));
 }
-let He = de(Ne), Ie = Te, je = I, Ge = re, Ke = Object.assign(He, { Group: Ie, Label: je, Description: Ge });
-const Re = "_left_gu0m2_14", Me = "_right_gu0m2_17", Ue = "_label_gu0m2_21", Oe = "_switcher_gu0m2_2", i = {
-  "switcher-wrapper": "_switcher-wrapper_gu0m2_2",
+let He = me(Le), Ie = Te, je = I, Ge = re, Ke = Object.assign(He, { Group: Ie, Label: je, Description: Ge });
+const Re = "_left_15kgl_15", Me = "_right_15kgl_18", Ue = "_label_15kgl_22", Oe = "_switcher_15kgl_2", l = {
+  "switcher-wrapper": "_switcher-wrapper_15kgl_2",
   left: Re,
   right: Me,
   label: Ue,
   switcher: Oe,
-  "switcher-checked": "_switcher-checked_gu0m2_45",
-  "switcher-thumb": "_switcher-thumb_gu0m2_55",
-  "switcher-checked-thumb": "_switcher-checked-thumb_gu0m2_65"
+  "switcher-checked": "_switcher-checked_15kgl_47",
+  "switcher-thumb": "_switcher-thumb_15kgl_57",
+  "switcher-checked-thumb": "_switcher-checked-thumb_15kgl_67",
+  "switcher-loading": "_switcher-loading_15kgl_70",
+  "loading-indicator": "_loading-indicator_15kgl_85",
+  "loading-rotate": "_loading-rotate_15kgl_1"
 }, Ze = Pe(
   ({
-    id: s,
-    label: l,
+    id: a,
+    label: o,
     hasLabel: e = !1,
-    labelPosition: n = Ee.LEFT,
-    className: h,
-    labelClassName: m,
-    switcherThumbClassName: d,
+    labelPosition: u = Ee.LEFT,
+    className: m,
+    labelClassName: p,
+    switcherThumbClassName: f,
     wrapperClassName: t,
-    children: a,
+    children: s,
     checked: c,
-    ...p
-  }, o) => {
-    const v = (k) => typeof a == "function" ? a({ ...k, checked: c }) : a;
+    loading: n = !1,
+    ...i
+  }, $) => {
+    const v = (d) => typeof s == "function" ? s({ ...d, checked: c }) : s;
     return /* @__PURE__ */ L(
       te,
       {
-        className: g(
-          i["switcher-wrapper"],
+        className: k(
+          l["switcher-wrapper"],
           t,
-          i[n]
+          l[u]
         ),
         children: [
-          l && e && /* @__PURE__ */ N(I, { className: g(i.label, m), htmlFor: s, children: l }),
+          o && e && /* @__PURE__ */ x(I, { className: k(l.label, p), htmlFor: a, children: o }),
           /* @__PURE__ */ L(
             Ke,
             {
-              ...p,
-              id: s,
-              ref: o,
-              className: g(i.switcher, h, {
-                [i["switcher-checked"]]: c
+              ...i,
+              id: a,
+              ref: $,
+              disabled: n || i.disabled,
+              className: k(l.switcher, m, {
+                [l["switcher-checked"]]: c
               }),
               children: [
                 v({ checked: c }),
-                /* @__PURE__ */ N(
+                /* @__PURE__ */ x(
                   "span",
                   {
                     "aria-hidden": "true",
-                    className: g(
-                      i["switcher-thumb"],
-                      d,
+                    className: k(
+                      l["switcher-thumb"],
+                      f,
                       {
-                        [i["switcher-checked-thumb"]]: c
+                        [l["switcher-checked-thumb"]]: c,
+                        [l["switcher-loading"]]: n
                       }
-                    )
+                    ),
+                    children: n && /* @__PURE__ */ x("span", { className: l["loading-indicator"] })
                   }
                 )
               ]

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

@@ -26,5 +26,6 @@ export type TProps = SwitchProps & TLabelProps & {
     className?: string;
     switcherThumbClassName?: string;
     wrapperClassName?: string;
+    loading?: boolean;
 };
 export {};

package/dist/components/TabTrail/TabTrail.d.ts

@@ -1,5 +1,6 @@
 import { ETabTrailSize } from './constants';
 import { ETabTrailButtonVariant } from './TabButtons/constants';
+import { TIcon } from '../../icons';
 
 export type TCategoryTab = {
     /**
@@ -64,5 +65,13 @@ export type TTabTrailProps = {
      * Дополнительный класс для контейнера кнопок навигации.
      */
     buttonsClassName?: string;
+    /**
+     * Цвет индикатора активной вкладки
+     */
+    indicatorColor?: string;
+    /**
+     * Иконки для табов. Ключи - индексы табов, значения - названия иконок.
+     */
+    tabIcons?: Record<number, TIcon>;
 };
 export declare const TabTrail: import('react').ForwardRefExoticComponent<TTabTrailProps & import('react').RefAttributes<HTMLElement>>;