mimir-ui-kit 1.38.29 → 1.38.31

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

@@ -48,5 +48,21 @@ export type TTabTrailProps = {
      * Автоматически показывать кнопки навигации при переполнении
      */
     autoShowButtons?: boolean;
+    /**
+     * Дополнительный класс для каждой вкладки.
+     */
+    tabClassName?: string;
+    /**
+     * Дополнительный класс для списка вкладок.
+     */
+    listClassName?: string;
+    /**
+     * Дополнительный класс для панели контента таба.
+     */
+    panelClassName?: string;
+    /**
+     * Дополнительный класс для контейнера кнопок навигации.
+     */
+    buttonsClassName?: string;
 };
 export declare const TabTrail: import('react').ForwardRefExoticComponent<TTabTrailProps & import('react').RefAttributes<HTMLElement>>;

package/dist/components/TabTrail/TabTrail.js

@@ -1,25 +1,25 @@
-import { jsxs as Q, jsx as A } from "react/jsx-runtime";
-import { c as Ee } from "../../index-DIxK0V-G.js";
-import * as O from "react";
-import L, { useRef as G, useState as K, createContext as oe, useReducer as ke, useMemo as D, useId as ie, useContext as ue, forwardRef as ye, useEffect as X } from "react";
+import { jsxs as X, jsx as D } from "react/jsx-runtime";
+import { c as J } from "../../index-DIxK0V-G.js";
+import * as C from "react";
+import M, { useRef as z, useState as Q, createContext as ie, useReducer as ke, useMemo as R, useId as ue, useContext as ce, forwardRef as ye, useEffect as Z } from "react";
 import { ETabTrailSize as Se } from "./constants.js";
 import { TabButtons as Ae } from "./TabButtons/TabButtons.js";
 import { ETabTrailButtonVariant as Fe } from "./TabButtons/constants.js";
 import { NotificationBadge as De } from "../NotificationBadge/NotificationBadge.js";
-import { n as z, M as le, W as U, s as j, y as V, o as F, H as q, $ as ce, b as Ne, D as de, a as W, u as Re, c as P, t as Le } from "../../keyboard-B0lm_zyn.js";
+import { n as U, M as oe, W as V, s as K, y as q, o as N, H, $ as de, b as Ne, D as fe, a as G, u as Re, c as I, t as Le } from "../../keyboard-B0lm_zyn.js";
 import { w as Oe } from "../../use-active-press-86hajhdd.js";
 import { e as Me } from "../../use-resolve-button-type-DhFdPxnv.js";
-import { T as fe, s as Ce } from "../../hidden-DbgtYPOH.js";
-import { _ as B, T as J, P as R, F as w } from "../../focus-management-DE4t_lW3.js";
+import { T as pe, s as Ce } from "../../hidden-DbgtYPOH.js";
+import { _ as W, T as Y, P as O, F as P } from "../../focus-management-DE4t_lW3.js";
 import '../../assets/TabTrail.css';function Be() {
-  let e = G(!1);
-  return z(() => (e.current = !0, () => {
+  let e = z(!1);
+  return U(() => (e.current = !0, () => {
     e.current = !1;
   }), []), e;
 }
 function We({ onFocus: e }) {
-  let [t, n] = K(!0), r = Be();
-  return t ? L.createElement(fe, { as: "button", type: "button", features: Ce.Focusable, onFocus: (s) => {
+  let [t, n] = Q(!0), r = Be();
+  return t ? M.createElement(pe, { as: "button", type: "button", features: Ce.Focusable, onFocus: (s) => {
     s.preventDefault();
     let l, o = 50;
     function b() {
@@ -37,7 +37,7 @@ function We({ onFocus: e }) {
     l = requestAnimationFrame(b);
   } }) : null;
 }
-const pe = O.createContext(null);
+const be = C.createContext(null);
 function Ge() {
   return { groups: /* @__PURE__ */ new Map(), get(e, t) {
     var n;
@@ -54,153 +54,153 @@ function Ge() {
   } };
 }
 function ze({ children: e }) {
-  let t = O.useRef(Ge());
-  return O.createElement(pe.Provider, { value: t }, e);
+  let t = C.useRef(Ge());
+  return C.createElement(be.Provider, { value: t }, e);
 }
-function be(e) {
-  let t = O.useContext(pe);
+function me(e) {
+  let t = C.useContext(be);
   if (!t) throw new Error("You must wrap your component in a <StableCollection>");
-  let n = O.useId(), [r, s] = t.current.get(e, n);
-  return O.useEffect(() => s, []), r;
+  let n = C.useId(), [r, s] = t.current.get(e, n);
+  return C.useEffect(() => s, []), r;
 }
 var Ue = ((e) => (e[e.Forwards = 0] = "Forwards", e[e.Backwards = 1] = "Backwards", e))(Ue || {}), Ve = ((e) => (e[e.Less = -1] = "Less", e[e.Equal = 0] = "Equal", e[e.Greater = 1] = "Greater", e))(Ve || {}), qe = ((e) => (e[e.SetSelectedIndex = 0] = "SetSelectedIndex", e[e.RegisterTab = 1] = "RegisterTab", e[e.UnregisterTab = 2] = "UnregisterTab", e[e.RegisterPanel = 3] = "RegisterPanel", e[e.UnregisterPanel = 4] = "UnregisterPanel", e))(qe || {});
 let He = { 0(e, t) {
   var n;
-  let r = B(e.tabs, (d) => d.current), s = B(e.panels, (d) => d.current), l = r.filter((d) => {
-    var v;
-    return !((v = d.current) != null && v.hasAttribute("disabled"));
+  let r = W(e.tabs, (d) => d.current), s = W(e.panels, (d) => d.current), l = r.filter((d) => {
+    var x;
+    return !((x = d.current) != null && x.hasAttribute("disabled"));
   }), o = { ...e, tabs: r, panels: s };
   if (t.index < 0 || t.index > r.length - 1) {
-    let d = W(Math.sign(t.index - e.selectedIndex), { [-1]: () => 1, 0: () => W(Math.sign(t.index), { [-1]: () => 0, 0: () => 0, 1: () => 1 }), 1: () => 0 });
+    let d = G(Math.sign(t.index - e.selectedIndex), { [-1]: () => 1, 0: () => G(Math.sign(t.index), { [-1]: () => 0, 0: () => 0, 1: () => 1 }), 1: () => 0 });
     if (l.length === 0) return o;
-    let v = W(d, { 0: () => r.indexOf(l[0]), 1: () => r.indexOf(l[l.length - 1]) });
-    return { ...o, selectedIndex: v === -1 ? e.selectedIndex : v };
+    let x = G(d, { 0: () => r.indexOf(l[0]), 1: () => r.indexOf(l[l.length - 1]) });
+    return { ...o, selectedIndex: x === -1 ? e.selectedIndex : x };
   }
-  let b = r.slice(0, t.index), x = [...r.slice(t.index), ...b].find((d) => l.includes(d));
-  if (!x) return o;
-  let i = (n = r.indexOf(x)) != null ? n : e.selectedIndex;
-  return i === -1 && (i = e.selectedIndex), { ...o, selectedIndex: i };
+  let b = r.slice(0, t.index), T = [...r.slice(t.index), ...b].find((d) => l.includes(d));
+  if (!T) return o;
+  let v = (n = r.indexOf(T)) != null ? n : e.selectedIndex;
+  return v === -1 && (v = e.selectedIndex), { ...o, selectedIndex: v };
 }, 1(e, t) {
   if (e.tabs.includes(t.tab)) return e;
-  let n = e.tabs[e.selectedIndex], r = B([...e.tabs, t.tab], (l) => l.current), s = e.selectedIndex;
+  let n = e.tabs[e.selectedIndex], r = W([...e.tabs, t.tab], (l) => l.current), s = e.selectedIndex;
   return e.info.current.isControlled || (s = r.indexOf(n), s === -1 && (s = e.selectedIndex)), { ...e, tabs: r, selectedIndex: s };
 }, 2(e, t) {
   return { ...e, tabs: e.tabs.filter((n) => n !== t.tab) };
 }, 3(e, t) {
-  return e.panels.includes(t.panel) ? e : { ...e, panels: B([...e.panels, t.panel], (n) => n.current) };
+  return e.panels.includes(t.panel) ? e : { ...e, panels: W([...e.panels, t.panel], (n) => n.current) };
 }, 4(e, t) {
   return { ...e, panels: e.panels.filter((n) => n !== t.panel) };
-} }, Z = oe(null);
-Z.displayName = "TabsDataContext";
-function M(e) {
-  let t = ue(Z);
+} }, ee = ie(null);
+ee.displayName = "TabsDataContext";
+function B(e) {
+  let t = ce(ee);
   if (t === null) {
     let n = new Error(`<${e} /> is missing a parent <Tab.Group /> component.`);
-    throw Error.captureStackTrace && Error.captureStackTrace(n, M), n;
+    throw Error.captureStackTrace && Error.captureStackTrace(n, B), n;
   }
   return t;
 }
-let ee = oe(null);
-ee.displayName = "TabsActionsContext";
-function te(e) {
-  let t = ue(ee);
+let te = ie(null);
+te.displayName = "TabsActionsContext";
+function re(e) {
+  let t = ce(te);
   if (t === null) {
     let n = new Error(`<${e} /> is missing a parent <Tab.Group /> component.`);
-    throw Error.captureStackTrace && Error.captureStackTrace(n, te), n;
+    throw Error.captureStackTrace && Error.captureStackTrace(n, re), n;
   }
   return t;
 }
 function je(e, t) {
-  return W(t.type, He, e, t);
+  return G(t.type, He, e, t);
 }
 let Je = "div";
 function Ke(e, t) {
   let { defaultIndex: n = 0, vertical: r = !1, manual: s = !1, onChange: l, selectedIndex: o = null, ...b } = e;
-  const x = r ? "vertical" : "horizontal", i = s ? "manual" : "auto";
-  let d = o !== null, v = j({ isControlled: d }), E = V(t), [f, u] = ke(je, { info: v, selectedIndex: o ?? n, tabs: [], panels: [] }), y = D(() => ({ selectedIndex: f.selectedIndex }), [f.selectedIndex]), S = j(l || (() => {
-  })), T = j(f.tabs), a = D(() => ({ orientation: x, activation: i, ...f }), [x, i, f]), m = F((p) => (u({ type: 1, tab: p }), () => u({ type: 2, tab: p }))), I = F((p) => (u({ type: 3, panel: p }), () => u({ type: 4, panel: p }))), h = F((p) => {
-    g.current !== p && S.current(p), d || u({ type: 0, index: p });
-  }), g = j(d ? e.selectedIndex : f.selectedIndex), C = D(() => ({ registerTab: m, registerPanel: I, change: h }), []);
-  z(() => {
-    u({ type: 0, index: o ?? n });
-  }, [o]), z(() => {
-    if (g.current === void 0 || f.tabs.length <= 0) return;
-    let p = B(f.tabs, (k) => k.current);
-    p.some((k, N) => f.tabs[N] !== k) && h(p.indexOf(f.tabs[g.current]));
+  const T = r ? "vertical" : "horizontal", v = s ? "manual" : "auto";
+  let d = o !== null, x = K({ isControlled: d }), _ = q(t), [i, c] = ke(je, { info: x, selectedIndex: o ?? n, tabs: [], panels: [] }), S = R(() => ({ selectedIndex: i.selectedIndex }), [i.selectedIndex]), A = K(l || (() => {
+  })), h = K(i.tabs), f = R(() => ({ orientation: T, activation: v, ...i }), [T, v, i]), E = N((p) => (c({ type: 1, tab: p }), () => c({ type: 2, tab: p }))), F = N((p) => (c({ type: 3, panel: p }), () => c({ type: 4, panel: p }))), g = N((p) => {
+    a.current !== p && A.current(p), d || c({ type: 0, index: p });
+  }), a = K(d ? e.selectedIndex : i.selectedIndex), m = R(() => ({ registerTab: E, registerPanel: F, change: g }), []);
+  U(() => {
+    c({ type: 0, index: o ?? n });
+  }, [o]), U(() => {
+    if (a.current === void 0 || i.tabs.length <= 0) return;
+    let p = W(i.tabs, (y) => y.current);
+    p.some((y, L) => i.tabs[L] !== y) && g(p.indexOf(i.tabs[a.current]));
   });
-  let Y = { ref: E };
-  return L.createElement(ze, null, L.createElement(ee.Provider, { value: C }, L.createElement(Z.Provider, { value: a }, a.tabs.length <= 0 && L.createElement(We, { onFocus: () => {
-    var p, k;
-    for (let N of T.current) if (((p = N.current) == null ? void 0 : p.tabIndex) === 0) return (k = N.current) == null || k.focus(), !0;
+  let k = { ref: _ };
+  return M.createElement(ze, null, M.createElement(te.Provider, { value: m }, M.createElement(ee.Provider, { value: f }, f.tabs.length <= 0 && M.createElement(We, { onFocus: () => {
+    var p, y;
+    for (let L of h.current) if (((p = L.current) == null ? void 0 : p.tabIndex) === 0) return (y = L.current) == null || y.focus(), !0;
     return !1;
-  } }), q({ ourProps: Y, theirProps: b, slot: y, defaultTag: Je, name: "Tabs" }))));
+  } }), H({ ourProps: k, theirProps: b, slot: S, defaultTag: Je, name: "Tabs" }))));
 }
 let Ye = "div";
 function Qe(e, t) {
-  let { orientation: n, selectedIndex: r } = M("Tab.List"), s = V(t), l = D(() => ({ selectedIndex: r }), [r]);
-  return q({ ourProps: { ref: s, role: "tablist", "aria-orientation": n }, theirProps: e, slot: l, defaultTag: Ye, name: "Tabs.List" });
+  let { orientation: n, selectedIndex: r } = B("Tab.List"), s = q(t), l = R(() => ({ selectedIndex: r }), [r]);
+  return H({ ourProps: { ref: s, role: "tablist", "aria-orientation": n }, theirProps: e, slot: l, defaultTag: Ye, name: "Tabs.List" });
 }
 let Xe = "button";
 function Ze(e, t) {
   var n, r;
-  let s = ie(), { id: l = `headlessui-tabs-tab-${s}`, disabled: o = !1, autoFocus: b = !1, ...x } = e, { orientation: i, activation: d, selectedIndex: v, tabs: E, panels: f } = M("Tab"), u = te("Tab"), y = M("Tab"), [S, T] = K(null), a = G(null), m = V(a, t, T);
-  z(() => u.registerTab(a), [u, a]);
-  let I = be("tabs"), h = E.indexOf(a);
-  h === -1 && (h = I);
-  let g = h === v, C = F((c) => {
+  let s = ue(), { id: l = `headlessui-tabs-tab-${s}`, disabled: o = !1, autoFocus: b = !1, ...T } = e, { orientation: v, activation: d, selectedIndex: x, tabs: _, panels: i } = B("Tab"), c = re("Tab"), S = B("Tab"), [A, h] = Q(null), f = z(null), E = q(f, t, h);
+  U(() => c.registerTab(f), [c, f]);
+  let F = me("tabs"), g = _.indexOf(f);
+  g === -1 && (g = F);
+  let a = g === x, m = N((u) => {
     var $;
-    let H = c();
-    if (H === J.Success && d === "auto") {
-      let _e = ($ = Re(a)) == null ? void 0 : $.activeElement, se = y.tabs.findIndex(($e) => $e.current === _e);
-      se !== -1 && u.change(se);
+    let j = u();
+    if (j === Y.Success && d === "auto") {
+      let _e = ($ = Re(f)) == null ? void 0 : $.activeElement, le = S.tabs.findIndex((Ee) => Ee.current === _e);
+      le !== -1 && c.change(le);
     }
-    return H;
-  }), Y = F((c) => {
-    let $ = E.map((H) => H.current).filter(Boolean);
-    if (c.key === P.Space || c.key === P.Enter) {
-      c.preventDefault(), c.stopPropagation(), u.change(h);
+    return j;
+  }), k = N((u) => {
+    let $ = _.map((j) => j.current).filter(Boolean);
+    if (u.key === I.Space || u.key === I.Enter) {
+      u.preventDefault(), u.stopPropagation(), c.change(g);
       return;
     }
-    switch (c.key) {
-      case P.Home:
-      case P.PageUp:
-        return c.preventDefault(), c.stopPropagation(), C(() => R($, w.First));
-      case P.End:
-      case P.PageDown:
-        return c.preventDefault(), c.stopPropagation(), C(() => R($, w.Last));
+    switch (u.key) {
+      case I.Home:
+      case I.PageUp:
+        return u.preventDefault(), u.stopPropagation(), m(() => O($, P.First));
+      case I.End:
+      case I.PageDown:
+        return u.preventDefault(), u.stopPropagation(), m(() => O($, P.Last));
     }
-    if (C(() => W(i, { vertical() {
-      return c.key === P.ArrowUp ? R($, w.Previous | w.WrapAround) : c.key === P.ArrowDown ? R($, w.Next | w.WrapAround) : J.Error;
+    if (m(() => G(v, { vertical() {
+      return u.key === I.ArrowUp ? O($, P.Previous | P.WrapAround) : u.key === I.ArrowDown ? O($, P.Next | P.WrapAround) : Y.Error;
     }, horizontal() {
-      return c.key === P.ArrowLeft ? R($, w.Previous | w.WrapAround) : c.key === P.ArrowRight ? R($, w.Next | w.WrapAround) : J.Error;
-    } })) === J.Success) return c.preventDefault();
-  }), p = G(!1), k = F(() => {
-    var c;
-    p.current || (p.current = !0, (c = a.current) == null || c.focus({ preventScroll: !0 }), u.change(h), Le(() => {
+      return u.key === I.ArrowLeft ? O($, P.Previous | P.WrapAround) : u.key === I.ArrowRight ? O($, P.Next | P.WrapAround) : Y.Error;
+    } })) === Y.Success) return u.preventDefault();
+  }), p = z(!1), y = N(() => {
+    var u;
+    p.current || (p.current = !0, (u = f.current) == null || u.focus({ preventScroll: !0 }), c.change(g), Le(() => {
       p.current = !1;
     }));
-  }), N = F((c) => {
-    c.preventDefault();
-  }), { isFocusVisible: re, focusProps: ge } = ce({ autoFocus: b }), { isHovered: ne, hoverProps: Te } = Ne({ isDisabled: o }), { pressed: ae, pressProps: Ie } = Oe({ disabled: o }), Pe = D(() => ({ selected: g, hover: ne, active: ae, focus: re, autofocus: b, disabled: o }), [g, ne, re, ae, b, o]), we = de({ ref: m, onKeyDown: Y, onMouseDown: N, onClick: k, id: l, role: "tab", type: Me(e, S), "aria-controls": (r = (n = f[h]) == null ? void 0 : n.current) == null ? void 0 : r.id, "aria-selected": g, tabIndex: g ? 0 : -1, disabled: o || void 0, autoFocus: b }, ge, Te, Ie);
-  return q({ ourProps: we, theirProps: x, slot: Pe, defaultTag: Xe, name: "Tabs.Tab" });
+  }), L = N((u) => {
+    u.preventDefault();
+  }), { isFocusVisible: ne, focusProps: Te } = de({ autoFocus: b }), { isHovered: ae, hoverProps: Ie } = Ne({ isDisabled: o }), { pressed: se, pressProps: Pe } = Oe({ disabled: o }), we = R(() => ({ selected: a, hover: ae, active: se, focus: ne, autofocus: b, disabled: o }), [a, ae, ne, se, b, o]), $e = fe({ ref: E, onKeyDown: k, onMouseDown: L, onClick: y, id: l, role: "tab", type: Me(e, A), "aria-controls": (r = (n = i[g]) == null ? void 0 : n.current) == null ? void 0 : r.id, "aria-selected": a, tabIndex: a ? 0 : -1, disabled: o || void 0, autoFocus: b }, Te, Ie, Pe);
+  return H({ ourProps: $e, theirProps: T, slot: we, defaultTag: Xe, name: "Tabs.Tab" });
 }
 let et = "div";
 function tt(e, t) {
-  let { selectedIndex: n } = M("Tab.Panels"), r = V(t), s = D(() => ({ selectedIndex: n }), [n]);
-  return q({ ourProps: { ref: r }, theirProps: e, slot: s, defaultTag: et, name: "Tabs.Panels" });
+  let { selectedIndex: n } = B("Tab.Panels"), r = q(t), s = R(() => ({ selectedIndex: n }), [n]);
+  return H({ ourProps: { ref: r }, theirProps: e, slot: s, defaultTag: et, name: "Tabs.Panels" });
 }
-let rt = "div", nt = le.RenderStrategy | le.Static;
+let rt = "div", nt = oe.RenderStrategy | oe.Static;
 function at(e, t) {
   var n, r, s, l;
-  let o = ie(), { id: b = `headlessui-tabs-panel-${o}`, tabIndex: x = 0, ...i } = e, { selectedIndex: d, tabs: v, panels: E } = M("Tab.Panel"), f = te("Tab.Panel"), u = G(null), y = V(u, t);
-  z(() => f.registerPanel(u), [f, u]);
-  let S = be("panels"), T = E.indexOf(u);
-  T === -1 && (T = S);
-  let a = T === d, { isFocusVisible: m, focusProps: I } = ce(), h = D(() => ({ selected: a, focus: m }), [a, m]), g = de({ ref: y, id: b, role: "tabpanel", "aria-labelledby": (r = (n = v[T]) == null ? void 0 : n.current) == null ? void 0 : r.id, tabIndex: a ? x : -1 }, I);
-  return !a && ((s = i.unmount) == null || s) && !((l = i.static) != null && l) ? L.createElement(fe, { "aria-hidden": "true", ...g }) : q({ ourProps: g, theirProps: i, slot: h, defaultTag: rt, features: nt, visible: a, name: "Tabs.Panel" });
+  let o = ue(), { id: b = `headlessui-tabs-panel-${o}`, tabIndex: T = 0, ...v } = e, { selectedIndex: d, tabs: x, panels: _ } = B("Tab.Panel"), i = re("Tab.Panel"), c = z(null), S = q(c, t);
+  U(() => i.registerPanel(c), [i, c]);
+  let A = me("panels"), h = _.indexOf(c);
+  h === -1 && (h = A);
+  let f = h === d, { isFocusVisible: E, focusProps: F } = de(), g = R(() => ({ selected: f, focus: E }), [f, E]), a = fe({ ref: S, id: b, role: "tabpanel", "aria-labelledby": (r = (n = x[h]) == null ? void 0 : n.current) == null ? void 0 : r.id, tabIndex: f ? T : -1 }, F);
+  return !f && ((s = v.unmount) == null || s) && !((l = v.static) != null && l) ? M.createElement(pe, { "aria-hidden": "true", ...a }) : H({ ourProps: a, theirProps: v, slot: g, defaultTag: rt, features: nt, visible: f, name: "Tabs.Panel" });
 }
-let st = U(Ze), me = U(Ke), ve = U(Qe), xe = U(tt), he = U(at), lt = Object.assign(st, { Group: me, List: ve, Panels: xe, Panel: he });
-const ot = "_container_rlke5_2", it = "_group_rlke5_6", ut = "_tab_rlke5_16", ct = "_list_rlke5_51", dt = "_tabs_rlke5_62", ft = "_buttons_rlke5_68", pt = "_m_rlke5_75", bt = "_s_rlke5_83", _ = {
+let st = V(Ze), ve = V(Ke), xe = V(Qe), he = V(tt), ge = V(at), lt = Object.assign(st, { Group: ve, List: xe, Panels: he, Panel: ge });
+const ot = "_container_rlke5_2", it = "_group_rlke5_6", ut = "_tab_rlke5_16", ct = "_list_rlke5_51", dt = "_tabs_rlke5_62", ft = "_buttons_rlke5_68", pt = "_m_rlke5_75", bt = "_s_rlke5_83", w = {
   container: ot,
   group: it,
   "group-inner": "_group-inner_rlke5_9",
@@ -219,72 +219,90 @@ const ot = "_container_rlke5_2", it = "_group_rlke5_6", ut = "_tab_rlke5_16", ct
     selectedTabIndex: s,
     onTabChange: l,
     buttonsVariant: o = Fe.WHITE,
-    autoShowButtons: b = !1
-  }, x) => {
-    const [i, d] = K(s || 0), [v, E] = K(!1), f = G(null);
-    X(() => {
-      s !== void 0 && s !== i && d(s);
+    autoShowButtons: b = !1,
+    tabClassName: T,
+    listClassName: v,
+    panelClassName: d,
+    buttonsClassName: x
+  }, _) => {
+    const [i, c] = Q(s || 0), [S, A] = Q(!1), h = z(null);
+    Z(() => {
+      s !== void 0 && s !== i && c(s);
     }, [i, s]);
-    const u = (a) => {
-      d(a), l == null || l(a);
-    }, y = () => {
+    const f = (a) => {
+      c(a), l == null || l(a);
+    }, E = () => {
       const a = (i + 1) % e.length;
-      u(a);
-    }, S = () => {
+      f(a);
+    }, F = () => {
       const a = (i - 1 + e.length) % e.length;
-      u(a);
+      f(a);
     };
-    X(() => {
+    Z(() => {
       var m;
-      const a = (m = f.current) == null ? void 0 : m.querySelector(
-        `.${_.tab}[data-active="true"]`
+      const a = (m = h.current) == null ? void 0 : m.querySelector(
+        `.${w.tab}[data-active="true"]`
       );
       a && typeof a.scrollIntoView == "function" && a.scrollIntoView({
         behavior: "smooth",
         block: "nearest",
         inline: "center"
       });
-    }, [i]), X(() => {
+    }, [i]), Z(() => {
       const a = () => {
-        if (f.current) {
-          const { scrollWidth: m, clientWidth: I } = f.current;
-          E(m > I);
+        if (h.current) {
+          const { scrollWidth: m, clientWidth: k } = h.current;
+          A(m > k);
         }
       };
       return a(), window.addEventListener("resize", a), () => window.removeEventListener("resize", a);
     }, [e]);
-    const T = b ? v : n;
-    return /* @__PURE__ */ Q(
-      me,
+    const g = b ? S : n;
+    return /* @__PURE__ */ X(
+      ve,
       {
-        ref: x,
-        className: Ee(_.group, _[t], r),
+        ref: _,
+        className: J(w.group, w[t], r),
         selectedIndex: i,
-        onChange: u,
+        onChange: f,
         children: [
-          /* @__PURE__ */ Q("div", { className: _["group-inner"], children: [
-            /* @__PURE__ */ A(ve, { ref: f, className: _.list, children: /* @__PURE__ */ A("div", { className: _.tabs, children: e.map(({ name: a, notificationCount: m }, I) => /* @__PURE__ */ Q(
-              lt,
+          /* @__PURE__ */ X("div", { className: w["group-inner"], children: [
+            /* @__PURE__ */ D(
+              xe,
               {
-                className: `${_.tab} ${i === I ? 'data-active="true"' : ""}`,
-                "data-active": i === I,
-                children: [
-                  a,
-                  m && /* @__PURE__ */ A(De, { count: m, size: "m" })
-                ]
-              },
-              a
-            )) }) }),
-            T && /* @__PURE__ */ A("div", { className: _.buttons, children: /* @__PURE__ */ A(
+                ref: h,
+                className: J(w.list, v),
+                children: /* @__PURE__ */ D("div", { className: w.tabs, children: e.map(({ name: a, notificationCount: m }, k) => /* @__PURE__ */ X(
+                  lt,
+                  {
+                    className: `${w.tab} ${i === k ? 'data-active="true"' : ""} ${T || ""}`,
+                    "data-active": i === k,
+                    children: [
+                      a,
+                      m && /* @__PURE__ */ D(De, { count: m, size: "m" })
+                    ]
+                  },
+                  a
+                )) })
+              }
+            ),
+            g && /* @__PURE__ */ D("div", { className: J(w.buttons, x), children: /* @__PURE__ */ D(
               Ae,
               {
-                handlePrevTab: S,
-                handleNextTab: y,
+                handlePrevTab: F,
+                handleNextTab: E,
                 buttonsVariant: o
               }
             ) })
           ] }),
-          /* @__PURE__ */ A(xe, { className: _.panels, children: e.map(({ name: a, content: m }) => /* @__PURE__ */ A(he, { className: _.panel, children: m }, a)) })
+          /* @__PURE__ */ D(he, { className: w.panels, children: e.map(({ name: a, content: m }) => /* @__PURE__ */ D(
+            ge,
+            {
+              className: J(w.panel, d),
+              children: m
+            },
+            a
+          )) })
         ]
       }
     );

package/dist/icons/Icon.js

@@ -1,6 +1,6 @@
 import { jsx as t } from "react/jsx-runtime";
 import { Suspense as s } from "react";
-import { i as e } from "../index-DzVMAmli.js";
+import { i as e } from "../index-BuVUKy18.js";
 const p = ({ iconName: o, ...n }) => {
   const r = e[o];
   return r ? /* @__PURE__ */ t(s, { fallback: null, children: /* @__PURE__ */ t(r, { ...n, "data-testid": o }) }) : null;

package/dist/icons/components/12px/MessageRead12px.js

@@ -12,7 +12,7 @@ const t = (l) => /* @__PURE__ */ d(
       /* @__PURE__ */ e(
         "path",
         {
-          "fill-rule": "evenodd",
+          fillRule: "evenodd",
           clipRule: "evenodd",
           d: "M8.14103 4.3077L2.76402 10.1635L0.131592 7.29443L0.868431 6.61836L2.76431 8.68466L7.40445 3.63135L8.14103 4.3077Z",
           fill: "white"
@@ -21,7 +21,7 @@ const t = (l) => /* @__PURE__ */ d(
       /* @__PURE__ */ e(
         "path",
         {
-          "fill-rule": "evenodd",
+          fillRule: "evenodd",
           clipRule: "evenodd",
           d: "M11.8682 4.3077L6.50505 10.1484L5.2356 8.86685L5.94605 8.16311L6.47762 8.69975L11.1316 3.63135L11.8682 4.3077Z",
           fill: "white"