@sberbusiness/triplex-next 0.19.0 → 0.21.0

package/components/Table/TabsLinePanelLinks.js

@@ -1,12 +1,12 @@
 import { jsx as n } from "react/jsx-runtime";
-import { c as t } from "../../chunks/vendor-DE8Zvm0w.js";
+import { c as t } from "../../chunks/vendor-DaOifQgP.js";
 import { Text as a } from "../Typography/Text.js";
 import { EFontWeightText as o, ETextSize as L } from "../Typography/enums.js";
-const l = "tabsLinePanelLinks__9c662a2c", m = {
+const l = "tabsLinePanelLinks__38ea2543", m = {
   tabsLinePanelLinks: l
 }, r = ({
-  children: s,
-  className: e,
+  children: e,
+  className: s,
   ...i
 }) => /* @__PURE__ */ n(
   a,
@@ -14,9 +14,9 @@ const l = "tabsLinePanelLinks__9c662a2c", m = {
     tag: "div",
     size: L.B3,
     weight: o.SEMIBOLD,
-    className: t(e, m.tabsLinePanelLinks),
+    className: t(s, m.tabsLinePanelLinks),
     ...i,
-    children: s
+    children: e
   }
 );
 r.displayName = "TabsLinePanelLinks";

package/components/Table/utils.js

@@ -1,5 +1,5 @@
 import "./TableBasic/enums.js";
-import { b as s, m as o, a as e } from "../../chunks/utils-BumZpvr4.js";
+import { b as s, m as o, a as e } from "../../chunks/utils-hbQGLR7K.js";
 export {
   s as mapCellTypeToClassName,
   o as mapHorizontalAlignToClassName,

package/components/Tabs/Tabs.js

@@ -1,8 +1,8 @@
-import { jsx as s, jsxs as y } from "react/jsx-runtime";
+import { jsx as c, jsxs as y } from "react/jsx-runtime";
 import { useState as l, useRef as D } from "react";
-import { TabsExtended as c } from "../TabsExtended/TabsExtended.js";
+import { TabsExtended as s } from "../TabsExtended/TabsExtended.js";
 import "../TabsExtended/components/TabsExtendedContent.js";
-import { c as W } from "../../chunks/vendor-DE8Zvm0w.js";
+import { c as W } from "../../chunks/vendor-DaOifQgP.js";
 import "../TabsExtended/TabsExtendedContext.js";
 import "../TabsExtended/components/TabsExtendedTab.js";
 import "../TabsExtended/components/TabsExtendedTabButton.js";
@@ -15,63 +15,63 @@ import "../Button/ButtonDropdownExtended.js";
 import { EButtonDotsTheme as j } from "../Button/enums.js";
 import { EComponentSize as K } from "../../enums/EComponentSize.js";
 import { isKey as _ } from "../../utils/keyboard.js";
-const k = "tabsContent__40f1445f", G = "tabButtonDropdown__d16438af", H = "sm__fdefdfc9", L = "md__13f7740c", M = "lg__e1205269", p = {
+const k = "tabsContent__67ed5acb", G = "tabButtonDropdown__cf0e8586", H = "sm__d5ac22f6", L = "md__e9ae5d78", M = "lg__fba7684d", p = {
   tabsContent: k,
   tabButtonDropdown: G,
   sm: H,
   md: L,
   lg: M
-}, co = ({
+}, so = ({
   buttonDropdownAttributes: C,
-  selectedId: a,
+  selectedId: i,
   onSelectTab: h,
-  size: i = K.MD,
+  size: a = K.MD,
   tabs: t,
   ...v
 }) => {
-  const [w, f] = l(a || t[0].id), [R, A] = l(""), [F, I] = l(""), d = D(null), m = D(null), S = ({ dropdownItemsIds: n, onSelectTab: o }) => t.filter((e) => n.includes(e.id)).map((e) => ({ ...e, onSelect: () => o(e.id) })), B = (n, o) => /* @__PURE__ */ s(c.Content.Tab, { ...n, children: ({ selected: e, isFirstInlineTab: N, isLastInlineTab: g }) => {
+  const [w, d] = l(i || t[0].id), [R, A] = l(""), [F, I] = l(""), m = D(null), f = D(null), S = ({ dropdownItemsIds: n, onSelectTab: o }) => t.filter((e) => n.includes(e.id)).map((e) => ({ ...e, onSelect: () => o(e.id) })), B = (n, o) => /* @__PURE__ */ c(s.Content.Tab, { ...n, children: ({ selected: e, isFirstInlineTab: N, isLastInlineTab: g }) => {
     const E = w === n.id ? 0 : -1, O = () => {
       let r;
-      return R === n.id ? r = d : F === n.id && (r = m), r;
+      return R === n.id ? r = m : F === n.id && (r = f), r;
     };
-    return /* @__PURE__ */ s(
-      c.Content.TabButton,
+    return /* @__PURE__ */ c(
+      s.Content.TabButton,
       {
         selected: e,
         tabIndex: E,
         ref: O(),
-        size: i,
+        size: a,
         showNotificationIcon: n.showNotificationIcon,
         onFocus: () => {
           A(t[o - 1] ? t[o - 1].id : ""), I(t[o + 1] ? t[o + 1].id : "");
         },
         onKeyDown: (r) => {
-          var T, b;
+          var b, T;
           const { key: u } = r;
-          _(u, "ARROW_LEFT") ? (N || (f(t[o - 1].id), (T = d.current) == null || T.focus()), r.preventDefault()) : _(u, "ARROW_RIGHT") && (g || (f(t[o + 1].id), (b = m.current) == null || b.focus()), r.preventDefault());
+          _(u, "ARROW_LEFT") ? (N || (d(t[o - 1].id), (b = m.current) == null || b.focus()), r.preventDefault()) : _(u, "ARROW_RIGHT") && (g || (d(t[o + 1].id), (T = f.current) == null || T.focus()), r.preventDefault());
         },
         children: n.label
       }
     );
   } }, o);
-  return /* @__PURE__ */ s(c, { ...v, selectedId: a, onSelectTab: h, children: /* @__PURE__ */ y(c.Content, { className: p.tabsContent, size: i, children: [
-    /* @__PURE__ */ s(c.Content.TabsWrapper, { children: t.map(B) }),
-    /* @__PURE__ */ s(c.Content.DropdownWrapper, { children: ({ dropdownItemsIds: n, onSelectTab: o }) => /* @__PURE__ */ s(
+  return /* @__PURE__ */ c(s, { ...v, selectedId: i, onSelectTab: h, children: /* @__PURE__ */ y(s.Content, { className: p.tabsContent, size: a, children: [
+    /* @__PURE__ */ c(s.Content.TabsWrapper, { children: t.map(B) }),
+    /* @__PURE__ */ c(s.Content.DropdownWrapper, { children: ({ dropdownItemsIds: n, onSelectTab: o }) => /* @__PURE__ */ c(
       x,
       {
         theme: j.DOTS_SECONDARY,
-        size: i,
+        size: a,
         options: S({ dropdownItemsIds: n, onSelectTab: o }),
-        selected: t.filter((e) => e.id === a)[0],
+        selected: t.filter((e) => e.id === i)[0],
         buttonAttributes: {
           ...C,
-          className: W(p.tabButtonDropdown, p[i])
+          className: W(p.tabButtonDropdown, p[a])
         }
       }
     ) })
   ] }) });
 };
 export {
-  co as Tabs
+  so as Tabs
 };
 //# sourceMappingURL=Tabs.js.map

package/components/TabsExtended/TabsExtended.js

@@ -1,11 +1,11 @@
 import { jsx as s } from "react/jsx-runtime";
 import { useState as r, useRef as T } from "react";
-import { c as b } from "../../chunks/vendor-DE8Zvm0w.js";
+import { c as b } from "../../chunks/vendor-DaOifQgP.js";
 import { TabsExtendedContext as E } from "./TabsExtendedContext.js";
 import { TabsExtendedContent as I } from "./components/TabsExtendedContent.js";
-import { s as u } from "../../chunks/TabsExtended.module-R-jANZBU.js";
+import { s as u } from "../../chunks/TabsExtended.module-B3Ti-48x.js";
 import { ETabsExtendedType as C } from "./enums.js";
-import { t as v } from "../../chunks/utils-hoF6QqvY.js";
+import { t as v } from "../../chunks/utils-d7-rkiPs.js";
 import "./components/TabsExtendedDropdownWrapper.js";
 import "./components/TabsExtendedTab.js";
 import "./components/TabsExtendedTabButton.js";

package/components/TabsExtended/components/TabsExtendedContent.js

@@ -1,11 +1,11 @@
 import { jsx as s } from "react/jsx-runtime";
-import { c as m } from "../../../chunks/vendor-DE8Zvm0w.js";
+import { c as m } from "../../../chunks/vendor-DaOifQgP.js";
 import { TabsExtendedTabsWrapper as n } from "./TabsExtendedTabsWrapper.js";
 import { TabsExtendedTab as d } from "./TabsExtendedTab.js";
 import { TabsExtendedTabButton as i } from "./TabsExtendedTabButton.js";
 import { EComponentSize as T } from "../../../enums/EComponentSize.js";
 import { TabsExtendedDropdownWrapper as b } from "./TabsExtendedDropdownWrapper.js";
-import { s as r } from "../../../chunks/TabsExtended.module-R-jANZBU.js";
+import { s as r } from "../../../chunks/TabsExtended.module-B3Ti-48x.js";
 import { createSizeToClassNameMap as f } from "../../../utils/classNameMaps.js";
 import "./TabsExtendedTabContext.js";
 const x = f(r), o = ({

package/components/TabsExtended/components/TabsExtendedDropdownWrapper.js

@@ -1,7 +1,7 @@
 import { jsx as n } from "react/jsx-runtime";
 import { useContext as m } from "react";
-import { s as p } from "../../../chunks/TabsExtended.module-R-jANZBU.js";
-import { c as a } from "../../../chunks/vendor-DE8Zvm0w.js";
+import { s as p } from "../../../chunks/TabsExtended.module-B3Ti-48x.js";
+import { c as a } from "../../../chunks/vendor-DaOifQgP.js";
 import { TabsExtendedContext as i } from "../TabsExtendedContext.js";
 const w = ({
   children: e,

package/components/TabsExtended/components/TabsExtendedTab.js

@@ -1,7 +1,7 @@
 import { jsx as x } from "react/jsx-runtime";
 import f, { useContext as o } from "react";
-import { s as r } from "../../../chunks/TabsExtended.module-R-jANZBU.js";
-import { c as I } from "../../../chunks/vendor-DE8Zvm0w.js";
+import { s as r } from "../../../chunks/TabsExtended.module-B3Ti-48x.js";
+import { c as I } from "../../../chunks/vendor-DaOifQgP.js";
 import { TabsExtendedContext as u } from "../TabsExtendedContext.js";
 import { TabsExtendedTabContext as E } from "./TabsExtendedTabContext.js";
 const h = f.forwardRef(

package/components/TabsExtended/components/TabsExtendedTabButton.js

@@ -1,7 +1,7 @@
 import { jsxs as x, jsx as a } from "react/jsx-runtime";
 import c, { useContext as b } from "react";
-import { c as T } from "../../../chunks/vendor-DE8Zvm0w.js";
-import { s as t, t as f, a as l } from "../../../chunks/utils-hoF6QqvY.js";
+import { c as T } from "../../../chunks/vendor-DaOifQgP.js";
+import { s as t, t as f, a as l } from "../../../chunks/utils-d7-rkiPs.js";
 import { TabsExtendedContext as u } from "../TabsExtendedContext.js";
 import { Text as E } from "../../Typography/Text.js";
 import { Badge as N } from "../../Badge/Badge.js";

package/components/TabsExtended/components/TabsExtendedTabsWrapper.js

@@ -1,9 +1,9 @@
 import { jsxs as k, Fragment as y, jsx as f } from "react/jsx-runtime";
 import a, { useContext as A, useState as D, useRef as g, useLayoutEffect as R, isValidElement as B } from "react";
-import { a as F, c as N, p as z } from "../../../chunks/vendor-DE8Zvm0w.js";
+import { g as F, c as N, h as z } from "../../../chunks/vendor-DaOifQgP.js";
 import { TabsExtendedContext as j } from "../TabsExtendedContext.js";
 import { TabsExtendedTabContext as P } from "./TabsExtendedTabContext.js";
-import { s as l } from "../../../chunks/TabsExtended.module-R-jANZBU.js";
+import { s as l } from "../../../chunks/TabsExtended.module-B3Ti-48x.js";
 const G = ({
   children: s,
   className: C,

package/components/TabsExtended/utils.js

@@ -1,6 +1,6 @@
 import "./enums.js";
 import "../../enums/EComponentSize.js";
-import { a as s, t as i } from "../../chunks/utils-hoF6QqvY.js";
+import { a as s, t as i } from "../../chunks/utils-d7-rkiPs.js";
 import "../Typography/enums.js";
 export {
   s as tabsExtendedSizeToTextSizeMap,

package/components/TabsLine/TabsLine.js

@@ -1,9 +1,9 @@
 import { jsx as r } from "react/jsx-runtime";
-import { c as b } from "../../chunks/vendor-DE8Zvm0w.js";
+import { c as b } from "../../chunks/vendor-DaOifQgP.js";
 import { MobileView as c } from "../MobileView/MobileView.js";
 import { TabsLineDesktop as d } from "./components/TabsLineDesktop.js";
 import { TabsLineMobile as x } from "./components/TabsLineMobile.js";
-import { s as m } from "../../chunks/TabsLine.module-B1pGQOOh.js";
+import { s as m } from "../../chunks/TabsLine.module-BgCBcRYT.js";
 import "./components/TabsLineDropdown.js";
 import "./components/TabsLineItem.js";
 const v = ({

package/components/TabsLine/components/TabsLineDesktop.js

@@ -3,8 +3,8 @@ import { useState as D, useRef as T, useEffect as N } from "react";
 import { TabsLineDropdown as S } from "./TabsLineDropdown.js";
 import { TabsLineItem as k } from "./TabsLineItem.js";
 import { isKey as u } from "../../../utils/keyboard.js";
-import { l as L } from "../../../chunks/vendor-DE8Zvm0w.js";
-import { s as J } from "../../../chunks/TabsLine.module-B1pGQOOh.js";
+import { l as L } from "../../../chunks/vendor-DaOifQgP.js";
+import { s as J } from "../../../chunks/TabsLine.module-BgCBcRYT.js";
 const $ = ({
   tabs: l,
   dropdownTargetHtmlAttributes: g,

package/components/TabsLine/components/TabsLineDropdown.js

@@ -1,13 +1,10 @@
-var A = Object.defineProperty;
-var k = (p, r, e) => r in p ? A(p, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : p[r] = e;
-var t = (p, r, e) => k(p, typeof r != "symbol" ? r + "" : r, e);
-import { jsxs as g, jsx as d } from "react/jsx-runtime";
-import v, { createElement as O } from "react";
-import { u as x, c as C } from "../../../chunks/vendor-DE8Zvm0w.js";
-import { DropdownListContext as E } from "../../Dropdown/DropdownListContext.js";
+import { jsxs as S, jsx as a } from "react/jsx-runtime";
+import { useState as d, useRef as h, useEffect as W, createElement as j } from "react";
+import { u as H, c as w } from "../../../chunks/vendor-DaOifQgP.js";
+import { DropdownListContext as Y } from "../../Dropdown/DropdownListContext.js";
 import "../../Dropdown/desktop/DropdownDesktop.js";
-import { DropdownList as N } from "../../Dropdown/desktop/DropdownList.js";
-import "../../../chunks/DropdownListItem-ILfoWhzW.js";
+import { DropdownList as b } from "../../Dropdown/desktop/DropdownList.js";
+import "../../../chunks/DropdownListItem-BdLTF7q1.js";
 import "../../Dropdown/mobile/DropdownMobile.js";
 import "../../Dropdown/mobile/DropdownMobileBody.js";
 import "../../Dropdown/mobile/DropdownMobileClose.js";
@@ -19,155 +16,122 @@ import "../../Dropdown/mobile/DropdownMobileList.js";
 import "../../Dropdown/mobile/DropdownMobileListItem.js";
 import "../../Loader/LoaderSmall/LoaderSmall.js";
 import "../../Loader/LoaderMiddle/LoaderMiddle.js";
-import { EComponentSize as M } from "../../../enums/EComponentSize.js";
-import { Dropdown as y } from "../../Dropdown/Dropdown.js";
-import { CaretdownStrokeSrvIcon16 as L } from "@sberbusiness/icons-next";
-import { isKey as l } from "../../../utils/keyboard.js";
-import { s as o } from "../../../chunks/TabsLine.module-B1pGQOOh.js";
-import { createSizeToClassNameMap as z } from "../../../utils/classNameMaps.js";
-import { Text as P } from "../../Typography/Text.js";
-import { tabsLineSizeToTextSizeMap as K } from "../utils.js";
-import { EFontType as I } from "../../Typography/enums.js";
-const W = z(o);
-class De extends v.PureComponent {
-  constructor(e) {
-    super(e);
-    t(this, "state", {
-      activeDescendant: void 0,
-      opened: !1,
-      focused: !1,
-      hovered: !1
-    });
-    t(this, "targetRef");
-    t(this, "dropdownRef");
-    t(this, "instanceId", x());
-    /** Установка значения activeDescendant. */
-    t(this, "setActiveDescendant", (e) => {
-      this.setState({ activeDescendant: e });
-    });
-    /** Рендер кнопки, раскрывающей список. */
-    t(this, "renderTarget", () => {
-      const { active: e, label: s, targetHtmlAttributes: i, size: a = M.MD } = this.props, { activeDescendant: n, opened: h, focused: R, hovered: S } = this.state, m = C(o.tab, W[a], o.dropdownTarget, {
-        [o.active]: e
-      }), f = C(o.dropdownTargetCaret, { [o.opened]: h }), { onFocus: u, onBlur: w, onMouseEnter: D, onMouseLeave: T, ...b } = i || {};
-      return /* @__PURE__ */ d(
-        "button",
-        {
-          ...b,
-          onFocus: (c) => {
-            this.setState({ focused: !0 }), u == null || u(c);
-          },
-          onBlur: (c) => {
-            this.setState({ focused: !1 }), w == null || w(c);
-          },
-          onMouseEnter: (c) => {
-            this.setState({ hovered: !0 }), D == null || D(c);
-          },
-          onMouseLeave: (c) => {
-            this.setState({ hovered: !1 }), T == null || T(c);
-          },
-          className: m,
-          onClick: this.handleTargetClick,
-          onKeyDown: this.handleTargetKeyDown,
-          type: "button",
-          role: "tab",
-          "aria-haspopup": "menu",
-          "aria-expanded": h,
-          "aria-controls": this.instanceId,
-          "aria-activedescendant": n,
-          children: /* @__PURE__ */ d("span", { className: o.tabInner, children: /* @__PURE__ */ g("span", { className: o.dropdownTargetInner, children: [
-            /* @__PURE__ */ d(
-              P,
-              {
-                size: K[a],
-                type: e || R || S ? I.PRIMARY : I.SECONDARY,
-                children: s
-              }
-            ),
-            /* @__PURE__ */ d(L, { className: f, paletteIndex: 5 })
-          ] }) })
-        }
-      );
-    });
-    /** Рендер дропдаун списка. */
-    t(this, "renderDropdown", () => {
-      const { selected: e, tabs: s } = this.props, { activeDescendant: i, opened: a } = this.state;
-      return /* @__PURE__ */ d(
-        y,
-        {
-          className: o.dropdown,
-          opened: a,
-          setOpened: this.setOpenedDropdown,
-          targetRef: this.targetRef,
-          ref: this.dropdownRef,
-          children: /* @__PURE__ */ d(
-            E.Provider,
+import { EComponentSize as q } from "../../../enums/EComponentSize.js";
+import { Dropdown as U } from "../../Dropdown/Dropdown.js";
+import { CaretdownStrokeSrvIcon16 as Z } from "@sberbusiness/icons-next";
+import { isKey as m } from "../../../utils/keyboard.js";
+import { s as t } from "../../../chunks/TabsLine.module-BgCBcRYT.js";
+import { createSizeToClassNameMap as G } from "../../../utils/classNameMaps.js";
+import { EFontType as v } from "../../Typography/enums.js";
+import "../../Typography/Caption.js";
+import { Text as J } from "../../Typography/Text.js";
+import "../../Typography/Title.js";
+import { tabsLineSizeToTextSizeMap as Q } from "../utils.js";
+const V = G(t), xe = ({
+  tabs: A,
+  active: T,
+  label: g,
+  onClickTab: L,
+  selected: M,
+  size: p = q.MD,
+  targetHtmlAttributes: R,
+  ...x
+}) => {
+  const [D, y] = d(void 0), [o, c] = d(!1), [O, N] = d(!1), [k, C] = d(!1), l = h(null), E = h(null), I = h(H());
+  W(() => {
+    if (!o)
+      return;
+    const e = (r) => {
+      var n, s;
+      !((n = l.current) != null && n.contains(r.target)) && !((s = E.current) != null && s.contains(r.target)) && c(!1);
+    };
+    return document.addEventListener("mouseup", e), () => {
+      document.removeEventListener("mouseup", e);
+    };
+  }, [o]);
+  const _ = () => {
+    c(!o);
+  }, P = (e) => {
+    o || (m(e.code, "ARROW_UP") || m(e.code, "ARROW_DOWN")) && (e.preventDefault(), c(!0)), o && (m(e.code, "TAB") || m(e.code, "ESCAPE")) && c(!1);
+  }, F = (e) => {
+    L(e), c(!o);
+  }, z = () => {
+    const { onFocus: e, onBlur: r, onMouseEnter: n, onMouseLeave: s, ...u } = R || {}, f = w(t.tab, V[p], t.dropdownTarget, {
+      [t.active]: T
+    }), K = w(t.dropdownTargetCaret, { [t.opened]: o });
+    return /* @__PURE__ */ a(
+      "button",
+      {
+        ...u,
+        onFocus: (i) => {
+          N(!0), e == null || e(i);
+        },
+        onBlur: (i) => {
+          N(!1), r == null || r(i);
+        },
+        onMouseEnter: (i) => {
+          C(!0), n == null || n(i);
+        },
+        onMouseLeave: (i) => {
+          C(!1), s == null || s(i);
+        },
+        className: f,
+        onClick: _,
+        onKeyDown: P,
+        type: "button",
+        role: "tab",
+        "aria-haspopup": "menu",
+        "aria-expanded": o,
+        "aria-controls": I.current,
+        "aria-activedescendant": D,
+        children: /* @__PURE__ */ a("span", { className: t.tabInner, children: /* @__PURE__ */ S("span", { className: t.dropdownTargetInner, children: [
+          /* @__PURE__ */ a(
+            J,
             {
-              value: { activeDescendant: i, setActiveDescendant: this.setActiveDescendant },
-              children: /* @__PURE__ */ d(N, { dropdownOpened: a, id: this.instanceId, children: s.map((n) => {
-                const { id: h, label: R, showNotificationIcon: S, ...m } = n, f = C(o.dropdownItem);
-                return /* @__PURE__ */ O(
-                  N.Item,
-                  {
-                    ...m,
-                    className: f,
-                    id: n.id,
-                    key: n.id,
-                    onSelect: () => {
-                      this.handleClickTab(n);
-                    },
-                    selected: n === e,
-                    showNotificationIcon: n.showNotificationIcon
-                  },
-                  /* @__PURE__ */ d("span", { className: o.dropdownItemInner, children: n.label })
-                );
-              }) })
+              size: Q[p],
+              type: T || O || k ? v.PRIMARY : v.SECONDARY,
+              children: g
             }
-          )
-        }
-      );
-    });
-    /** Открывает/закрывает Dropdown. */
-    t(this, "setOpenedDropdown", (e) => {
-      this.setState({ opened: e });
-    });
-    /** Обработчик кнопки, раскрывающей список. */
-    t(this, "handleTargetClick", () => {
-      const { opened: e } = this.state;
-      this.setState({ opened: !e });
-    });
-    /** Обработчик клика по табу. */
-    t(this, "handleClickTab", (e) => {
-      const { onClickTab: s } = this.props, { opened: i } = this.state;
-      s(e), this.setState({ opened: !i });
-    });
-    /** Обработчик нажатия клавиш по кнопке, раскрывающей список. */
-    t(this, "handleTargetKeyDown", (e) => {
-      const { opened: s } = this.state;
-      s || (l(e.code, "ARROW_UP") || l(e.code, "ARROW_DOWN")) && (e.preventDefault(), this.setState({ opened: !0 })), s && (l(e.code, "TAB") || l(e.code, "ESCAPE")) && this.setState({ opened: !1 });
-    });
-    /** Обработчик клика вне дропдауна. */
-    t(this, "handleClickOutside", (e) => {
-      var i, a;
-      const { opened: s } = this.state;
-      s && !((i = this.targetRef.current) != null && i.contains(e.target)) && !((a = this.dropdownRef.current) != null && a.contains(e.target)) && this.setState({ opened: !1 });
-    });
-    this.targetRef = v.createRef(), this.dropdownRef = v.createRef();
-  }
-  componentDidMount() {
-    document.addEventListener("mouseup", this.handleClickOutside);
-  }
-  componentWillUnmount() {
-    document.removeEventListener("mouseup", this.handleClickOutside);
-  }
-  render() {
-    return /* @__PURE__ */ g("div", { className: o.tabsLineDropdown, ref: this.targetRef, children: [
-      this.renderTarget(),
-      this.renderDropdown()
-    ] });
-  }
-}
+          ),
+          /* @__PURE__ */ a(Z, { className: K, paletteIndex: 5 })
+        ] }) })
+      }
+    );
+  }, B = () => /* @__PURE__ */ a(
+    U,
+    {
+      className: t.dropdown,
+      opened: o,
+      setOpened: c,
+      size: p,
+      targetRef: l,
+      ref: E,
+      children: /* @__PURE__ */ a(Y.Provider, { value: { activeDescendant: D, setActiveDescendant: y }, children: /* @__PURE__ */ a(b, { dropdownOpened: o, id: I.current, children: A.map((e) => {
+        const { id: r, label: n, showNotificationIcon: s, ...u } = e, f = w(t.dropdownItem);
+        return /* @__PURE__ */ j(
+          b.Item,
+          {
+            ...u,
+            className: f,
+            id: r,
+            key: r,
+            onSelect: () => {
+              F(e);
+            },
+            selected: e === M,
+            showNotificationIcon: s
+          },
+          /* @__PURE__ */ a("span", { className: t.dropdownItemInner, children: n })
+        );
+      }) }) })
+    }
+  );
+  return /* @__PURE__ */ S("div", { className: t.tabsLineDropdown, ref: l, ...x, children: [
+    z(),
+    B()
+  ] });
+};
 export {
-  De as TabsLineDropdown
+  xe as TabsLineDropdown
 };
 //# sourceMappingURL=TabsLineDropdown.js.map

package/components/TabsLine/components/TabsLineItem.js

@@ -1,13 +1,13 @@
 import { jsx as n } from "react/jsx-runtime";
 import y, { useState as p, createElement as z } from "react";
-import { c as E } from "../../../chunks/vendor-DE8Zvm0w.js";
+import { c as E } from "../../../chunks/vendor-DaOifQgP.js";
 import { createSizeToClassNameMap as N } from "../../../utils/classNameMaps.js";
 import { Badge as S } from "../../Badge/Badge.js";
 import { EComponentSize as f } from "../../../enums/EComponentSize.js";
 import { Text as v } from "../../Typography/Text.js";
 import { tabsLineSizeToTextSizeMap as x } from "../utils.js";
 import { EFontType as c } from "../../Typography/enums.js";
-import { s as e } from "../../../chunks/TabsLine.module-B1pGQOOh.js";
+import { s as e } from "../../../chunks/TabsLine.module-BgCBcRYT.js";
 const L = N(e), R = y.forwardRef(
   ({
     id: l,

package/components/TabsLine/components/TabsLineMobile.js

@@ -1,21 +1,21 @@
 import { jsx as n } from "react/jsx-runtime";
-import { TabsLineItem as t } from "./TabsLineItem.js";
-const p = "tabsLineMobileWrapper__2715c85e", d = "tabsLineMobile__c1738b89", l = {
-  tabsLineMobileWrapper: p,
-  tabsLineMobile: d
-}, u = ({ onChangeTab: r, selectedId: o, tabs: i }) => {
+import { TabsLineItem as c } from "./TabsLineItem.js";
+const d = "tabsLineMobileWrapper__6b8fe113", p = "tabsLineMobile__72d6e124", l = {
+  tabsLineMobileWrapper: d,
+  tabsLineMobile: p
+}, h = ({ onChangeTab: r, selectedId: o, tabs: i }) => {
   if (!i.length)
     return null;
   const a = ({ selected: L, ...e }) => {
-    const b = (c) => {
+    const b = (t) => {
       var s;
-      r(e.id), (s = e.onClick) == null || s.call(e, c);
+      r(e.id), (s = e.onClick) == null || s.call(e, t);
     };
-    return /* @__PURE__ */ n(t, { selected: o === e.id, ...e, onClick: b }, e.id);
+    return /* @__PURE__ */ n(c, { selected: o === e.id, ...e, onClick: b }, e.id);
   };
   return /* @__PURE__ */ n("div", { className: l.tabsLineMobileWrapper, children: /* @__PURE__ */ n("div", { className: l.tabsLineMobile, children: i.map(a) }) });
 };
 export {
-  u as TabsLineMobile
+  h as TabsLineMobile
 };
 //# sourceMappingURL=TabsLineMobile.js.map