urfu-ui-kit-react 2.1.7-next.0 → 2.1.7-next.2

package/dist/components/Table/TableMobileView.js

@@ -6,7 +6,7 @@ import { Select$u as fe } from "../Select/Select.js";
 import { Preloader$u as he } from "../Preloader/Preloader.js";
 import { Tooltip$u as ve } from "../Tooltip/Tooltip.js";
 import { MobileCard$u as _e, MobileCollapsibleField$u as ge } from "./TableMobileCard.js";
-const ye = ({
+const Re = ({
   filteredColumns: m,
   pagedData: P,
   filteredDataLength: D,
@@ -28,9 +28,9 @@ const ye = ({
   mobileFilterOptions: f,
   renderMobileFilter: T,
   onMobileFiltersReset: ae,
-  mobileFilterSortLabel: ie,
+  mobileFilterSortLabel: oe,
   renderMobileCard: W,
-  mobileCardCollapsible: oe,
+  mobileCardCollapsible: ie,
   mobileCardLabels: j = !0,
   mobileMaxVisible: h,
   mobileCardColumns: v = 1,
@@ -40,33 +40,33 @@ const ye = ({
   mobileCardInset: q,
   mobileCardDensity: J = "default"
 }) => {
-  const K = `${q ? " u-table-mobile-card--inset" : ""}${J === "compact" ? " u-table-mobile-card--compact" : ""}`, E = X(null), [Q, re] = Y({ atStart: !0, atEnd: !0 }), R = () => {
-    const l = E.current;
+  const K = `${q ? " u-table-mobile-card--inset" : ""}${J === "compact" ? " u-table-mobile-card--compact" : ""}`, y = X(null), [Q, re] = Y({ atStart: !0, atEnd: !0 }), E = () => {
+    const l = y.current;
     if (!l) return;
-    const i = l.scrollWidth > l.clientWidth + 1;
+    const o = l.scrollWidth > l.clientWidth + 1;
     re({
-      atStart: !i || l.scrollLeft <= 1,
-      atEnd: !i || l.scrollLeft + l.clientWidth >= l.scrollWidth - 1
+      atStart: !o || l.scrollLeft <= 1,
+      atEnd: !o || l.scrollLeft + l.clientWidth >= l.scrollWidth - 1
     });
   };
   Z(() => {
     if (!H || p !== "segments") return;
-    const l = E.current;
+    const l = y.current;
     if (!l || typeof ResizeObserver > "u") return;
-    R();
-    const i = new ResizeObserver(R);
-    return i.observe(l), () => i.disconnect();
+    E();
+    const o = new ResizeObserver(E);
+    return o.observe(l), () => o.disconnect();
   }, [H, p, I]);
-  const y = X(null), [_, $] = Y(!1);
+  const R = X(null), [_, $] = Y(!1);
   Z(() => {
     if (!_) return;
-    const l = (i) => {
-      y.current && !y.current.contains(i.target) && $(!1);
+    const l = (o) => {
+      R.current && !R.current.contains(o.target) && $(!1);
     };
     return document.addEventListener("mousedown", l), () => document.removeEventListener("mousedown", l);
   }, [_]);
-  const b = (l, i, r) => l.renderMobile ? l.renderMobile(i, r) : l.render ? l.render(i, r) : i[l.field], o = m.find((l) => l.mobilePrimary) ?? m[0], g = m.filter(
-    (l) => l !== o && l.mobileHidden !== !0
+  const b = (l, o, r) => l.renderMobile ? l.renderMobile(o, r) : l.render ? l.render(o, r) : o[l.field], i = m.find((l) => l.mobilePrimary) ?? m[0], g = m.filter(
+    (l) => l !== i && l.mobileHidden !== !0
   ), d = g.find((l) => l.mobileSubtitle), U = g.filter((l) => l.mobileActions), k = g.filter((l) => l !== d && !l.mobileActions), te = k.filter((l) => l.mobileInline), ne = k.filter(
     (l) => l.mobileSecondary && !l.mobileInline
   ), G = k.filter(
@@ -84,13 +84,13 @@ const ye = ({
           options: f,
           renderFilter: T,
           onReset: ae,
-          sortLabel: ie
+          sortLabel: oe
         }
       ) });
     const l = m.filter((e) => e.sortOn);
     if (!(le ?? l.length > 0) || l.length === 0) return null;
     const r = l.find((e) => e.field === u);
-    return p === "menu" ? /* @__PURE__ */ n("div", { className: "u-table-mobile-sortmenu", ref: y, children: [
+    return p === "menu" ? /* @__PURE__ */ n("div", { className: "u-table-mobile-sortmenu", ref: R, children: [
       /* @__PURE__ */ n(
         "button",
         {
@@ -100,7 +100,7 @@ const ye = ({
           "aria-expanded": _,
           "aria-haspopup": "listbox",
           children: [
-            /* @__PURE__ */ a(w, { name: "sorting", size: "16px", color: "#1E4391" }),
+            /* @__PURE__ */ a(w, { name: "sorting", size: "16px", color: "var(--u-color-primary, #1E4391)" }),
             /* @__PURE__ */ a("span", { className: "u-table-mobile-sortmenu__label", children: r ? r.mobileLabel ?? r.title ?? r.field : c })
           ]
         }
@@ -123,7 +123,7 @@ const ye = ({
                 {
                   name: L === "desc" ? "down-arrow" : "up-arrow",
                   size: "12px",
-                  color: "#1E4391"
+                  color: "var(--u-color-primary, #1E4391)"
                 }
               )
             ]
@@ -134,8 +134,8 @@ const ye = ({
     ] }) : p === "segments" ? /* @__PURE__ */ a(
       "div",
       {
-        ref: E,
-        onScroll: R,
+        ref: y,
+        onScroll: E,
         className: `u-table-mobile-sortseg${Q.atStart ? "" : " u-table-mobile-sortseg--clip-start"}${Q.atEnd ? "" : " u-table-mobile-sortseg--clip-end"}`,
         role: "group",
         "aria-label": c,
@@ -162,7 +162,7 @@ const ye = ({
                   {
                     name: L === "desc" ? "down-arrow" : "up-arrow",
                     size: "10px",
-                    color: "#1E4391",
+                    color: "var(--u-color-primary, #1E4391)",
                     className: "u-table-mobile-sortseg__arrow"
                   }
                 )
@@ -201,17 +201,17 @@ const ye = ({
               {
                 name: L === "desc" ? "down-arrow" : "up-arrow",
                 size: "20px",
-                color: "#1E4391"
+                color: "var(--u-color-primary, #1E4391)"
               }
             )
           }
         )
       ] })
     ] });
-  }, me = (l, i) => {
-    if (W) return W(l, i);
+  }, me = (l, o) => {
+    if (W) return W(l, o);
     const r = v === 3 ? " u-table-mobile-card__fields--cols3" : v === 2 ? " u-table-mobile-card__fields--cols2" : "";
-    return oe ? /* @__PURE__ */ a(
+    return ie ? /* @__PURE__ */ a(
       _e,
       {
         flat: x,
@@ -220,17 +220,17 @@ const ye = ({
         divider: S,
         showLabels: j,
         columns: v,
-        title: o ? b(o, l, i) : null,
-        titleLabel: o ? o.mobileLabel ?? o.title : null,
-        titleHideLabel: !!(o != null && o.mobileHideLabel),
-        titleColor: o == null ? void 0 : o.mobileValueColor,
-        titleLabelColor: o == null ? void 0 : o.mobileLabelColor,
-        subtitle: d ? b(d, l, i) : null,
+        title: i ? b(i, l, o) : null,
+        titleLabel: i ? i.mobileLabel ?? i.title : null,
+        titleHideLabel: !!(i != null && i.mobileHideLabel),
+        titleColor: i == null ? void 0 : i.mobileValueColor,
+        titleLabelColor: i == null ? void 0 : i.mobileLabelColor,
+        subtitle: d ? b(d, l, o) : null,
         subtitleColor: d == null ? void 0 : d.mobileValueColor,
-        actions: U.length ? U.map((e) => /* @__PURE__ */ a("span", { children: b(e, l, i) }, e.field)) : void 0,
+        actions: U.length ? U.map((e) => /* @__PURE__ */ a("span", { children: b(e, l, o) }, e.field)) : void 0,
         inline: te.map((e) => ({
           label: e.mobileLabel ?? e.title,
-          value: b(e, l, i),
+          value: b(e, l, o),
           hideLabel: !!e.mobileHideLabel,
           valueColor: e.mobileValueColor,
           labelColor: e.mobileLabelColor,
@@ -240,7 +240,7 @@ const ye = ({
         })),
         body: se.map((e) => ({
           label: e.mobileLabel ?? e.title,
-          value: b(e, l, i),
+          value: b(e, l, o),
           hideLabel: !!e.mobileHideLabel,
           valueColor: e.mobileValueColor,
           labelColor: e.mobileLabelColor,
@@ -250,7 +250,7 @@ const ye = ({
         })),
         details: be.map((e) => ({
           label: e.mobileLabel ?? e.title,
-          value: b(e, l, i),
+          value: b(e, l, o),
           hideLabel: !!e.mobileHideLabel,
           valueColor: e.mobileValueColor,
           labelColor: e.mobileLabelColor,
@@ -259,15 +259,15 @@ const ye = ({
           gridRowSpan: e.mobileGridRowSpan
         }))
       },
-      l.id ?? i
+      l.id ?? o
     ) : /* @__PURE__ */ n(
       "div",
       {
         className: `u-table-mobile-card${x ? " u-table-mobile-card--flat" : ""}${S ? " u-table-mobile-card--divider" : ""}${v === 3 ? " u-table-mobile-card--cols3" : ""}${K}`,
         children: [
-          o && /* @__PURE__ */ a("div", { className: "u-table-mobile-card__title", style: o.mobileValueColor ? { color: o.mobileValueColor } : void 0, children: b(o, l, i) }),
+          i && /* @__PURE__ */ a("div", { className: "u-table-mobile-card__title", style: i.mobileValueColor ? { color: i.mobileValueColor } : void 0, children: b(i, l, o) }),
           /* @__PURE__ */ a("div", { className: "u-table-mobile-card__fields" + r, children: g.map((e, t) => {
-            const s = b(e, l, i);
+            const s = b(e, l, o);
             if (s == null || s === "" || s === !1 || Array.isArray(s) && s.length === 0) return null;
             const V = j && !e.mobileHideLabel ? e.mobileLabel ?? e.title : null, ue = e.mobileGridSpan === "full" ? " u-table-mobile-card__row--span-full" : e.mobileGridSpan === 2 ? " u-table-mobile-card__row--span2" : e.mobileGridSpan === "narrow" ? " u-table-mobile-card__row--span-narrow" : "";
             return e.mobileCollapsible || e.mobileExpandLines ? /* @__PURE__ */ a(
@@ -292,25 +292,25 @@ const ye = ({
           }) })
         ]
       },
-      l.id ?? i
+      l.id ?? o
     );
   };
   return /* @__PURE__ */ n(ce, { children: [
     de(),
-    z && !A ? /* @__PURE__ */ a("div", { className: "u-table-mobile-list", "aria-hidden": "true", children: Array.from({ length: I || F }, (l, i) => /* @__PURE__ */ n("div", { className: `u-table-mobile-card u-table-mobile-card--skeleton${x ? " u-table-mobile-card--flat" : ""}${S ? " u-table-mobile-card--divider" : ""}${K}`, children: [
+    z && !A ? /* @__PURE__ */ a("div", { className: "u-table-mobile-list", "aria-hidden": "true", children: Array.from({ length: I || F }, (l, o) => /* @__PURE__ */ n("div", { className: `u-table-mobile-card u-table-mobile-card--skeleton${x ? " u-table-mobile-card--flat" : ""}${S ? " u-table-mobile-card--divider" : ""}${K}`, children: [
       /* @__PURE__ */ a("div", { className: "skeleton-cell u-table-mobile-card__skeleton-title" }),
       /* @__PURE__ */ n("div", { className: "u-table-mobile-card__skeleton-fields", children: [
         /* @__PURE__ */ a("div", { className: "skeleton-cell" }),
         /* @__PURE__ */ a("div", { className: "skeleton-cell" })
       ] })
-    ] }, i)) }) : z || A ? /* @__PURE__ */ a("div", { className: "u-table-mobile-loading", children: /* @__PURE__ */ a(he, { variant: "large-primary", className: "" }) }) : D === 0 ? M ? /* @__PURE__ */ a("div", { className: "u-table-mobile-empty", children: M }) : null : /* @__PURE__ */ a(
+    ] }, o)) }) : z || A ? /* @__PURE__ */ a("div", { className: "u-table-mobile-loading", children: /* @__PURE__ */ a(he, { variant: "large-primary", className: "" }) }) : D === 0 ? M ? /* @__PURE__ */ a("div", { className: "u-table-mobile-empty", children: M }) : null : /* @__PURE__ */ a(
       "div",
       {
         className: "u-table-mobile-list",
         style: O != null ? { gap: O } : void 0,
-        children: P.map((l, i) => me(l, i))
+        children: P.map((l, o) => me(l, o))
       }
     )
   ] });
 };
-export { ye as TableMobileView$u };
+export { Re as TableMobileView$u };

package/dist/components/Table/TableRow.js

@@ -121,7 +121,7 @@ const C = "auto", P = ({
                   "path",
                   {
                     d: "M1 4.5625L5.99999 9.5625L11 4.5625",
-                    stroke: "#1E4391",
+                    style: { stroke: "var(--u-color-primary, #1E4391)" },
                     strokeWidth: "2",
                     strokeLinecap: "round",
                     strokeLinejoin: "round"

package/dist/components/Tabs/Tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,mDAAmD,CAAC;AAC3D,OAAO,aAAa,CAAC;AACrB,OAAO,0BAA0B,CAAC;AAElC,OAAO,KAAK,EAAsB,cAAc,EAAE,MAAM,cAAc,CAAC;AA0BvE,eAAO,MAAM,IAAI,GAAI,wHAWlB,cAAc,4CA6LhB,CAAC"}
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,mDAAmD,CAAC;AAC3D,OAAO,aAAa,CAAC;AACrB,OAAO,0BAA0B,CAAC;AAElC,OAAO,KAAK,EAAsB,cAAc,EAAE,MAAM,cAAc,CAAC;AA2BvE,eAAO,MAAM,IAAI,GAAI,wHAWlB,cAAc,4CA6LhB,CAAC"}

package/dist/components/Tabs/Tabs.js

@@ -3,32 +3,33 @@ import { jsxs as a, jsx as r } from "react/jsx-runtime";
 /* empty css                                  */
 /* empty css      */
 /* empty css                  */
-import { useState as x, useRef as p, useId as D, useEffect as ee, Fragment as oe } from "react";
+import { useState as x, useRef as p, useEffect as D, Fragment as ee } from "react";
 import { Icon$u as b } from "../Icon/Icon.js";
-import { Tooltip$u as te } from "../Tooltip/Tooltip.js";
-import { useDismiss$u as re } from "../../hooks/useDismiss.js";
-import { useMountTransition$u as ne } from "../../hooks/useMountTransition.js";
-import { getPopupTransitionStyle$u as se, POPUP_TRANSITION_MS$u as ie } from "../../shared/popupTransition.js";
-import { useTabsOverflow$u as le } from "./useTabsOverflow.js";
-import { useTabsIndicator$u as ae } from "./useTabsIndicator.js";
-import { useTabsScroll$u as ce } from "./useTabsScroll.js";
+import { Tooltip$u as oe } from "../Tooltip/Tooltip.js";
+import { useDismiss$u as te } from "../../hooks/useDismiss.js";
+import { useMountTransition$u as re } from "../../hooks/useMountTransition.js";
+import { getPopupTransitionStyle$u as ne, POPUP_TRANSITION_MS$u as se } from "../../shared/popupTransition.js";
+import { useTabsOverflow$u as ie } from "./useTabsOverflow.js";
+import { useTabsIndicator$u as le } from "./useTabsIndicator.js";
+import { useTabsScroll$u as ae } from "./useTabsScroll.js";
+import { useAutoId$u as ce } from "../../hooks/useAutoId.js";
 import { isPlainLeftClick$u as ue } from "../../vanilla/core/linkClick.js";
-const me = [], Ie = ({
+const me = [], Se = ({
   onClick: h,
   tabsData: n = me,
   activeTab: m,
-  className: $ = "",
+  className: w = "",
   variant: g = "line",
   fullWidth: y = !1,
   tooltipOn: U = !1,
   tooltipDisabled: _ = !1,
-  LinkComponent: v,
+  LinkComponent: $,
   ariaLabel: B
 }) => {
-  const { containerRef: K, measureRef: j, moreMeasureRef: q, visible: z, overflow: u, paddingOf: F, promote: L } = le(n, m, y, g !== "segment"), [d, c] = x(!1), R = p(null), N = p(null), k = p(null), O = D(), { shouldRender: H, status: J, isAnimated: Y } = ne({ isOpen: d, duration: ie }), A = p(u);
-  d && (A.current = u);
-  const f = g === "segment", T = n.some((e) => e.url), w = f ? "u-tab-segment" : "u-tab-line", G = f ? "u-tab-segment-active" : "u-tab-active", { trackRef: I, indicatorRef: Q } = ae(m, `${g}|${y}|${JSON.stringify(n.map((e) => e.id))}`);
-  ce(I, !f, m), re({ refs: [R], enabled: d, onDismiss: () => c(!1) }), ee(() => {
+  const { containerRef: K, measureRef: j, moreMeasureRef: q, visible: z, overflow: u, paddingOf: F, promote: L } = ie(n, m, y, g !== "segment"), [d, c] = x(!1), R = p(null), N = p(null), k = p(null), A = ce(void 0, "u-tabs-menu"), { shouldRender: H, status: J, isAnimated: Y } = re({ isOpen: d, duration: se }), O = p(u);
+  d && (O.current = u);
+  const f = g === "segment", T = n.some((e) => e.url), v = f ? "u-tab-segment" : "u-tab-line", G = f ? "u-tab-segment-active" : "u-tab-active", { trackRef: I, indicatorRef: Q } = le(m, `${g}|${y}|${JSON.stringify(n.map((e) => e.id))}`);
+  ae(I, !f, m), te({ refs: [R], enabled: d, onDismiss: () => c(!1) }), D(() => {
     u.length || c(!1);
   }, [u.length]);
   const S = (e) => {
@@ -63,10 +64,10 @@ const me = [], Ie = ({
     const l = (W) => {
       ue(W) && S(e);
     };
-    return v ? /* @__PURE__ */ r(v, { to: i.url, ...o, onClick: l, children: t }) : /* @__PURE__ */ r("a", { href: i.url, ...o, onClick: l, children: t });
+    return $ ? /* @__PURE__ */ r($, { to: i.url, ...o, onClick: l, children: t }) : /* @__PURE__ */ r("a", { href: i.url, ...o, onClick: l, children: t });
   }, E = (e, o = !1) => {
     const t = n[e], s = !!(t.icon && t.iconOnly), i = t.icon ? s ? " u-tab-icon-only" : ` u-tab-with-icon${t.iconPosition === "right" ? " u-tab-icon-right" : ""}` : "", l = C(e, {
-      className: `${w}${i}${t.id === m ? ` ${G}` : ""}${t.disabled ? " u-tab--disabled" : ""}`,
+      className: `${v}${i}${t.id === m ? ` ${G}` : ""}${t.disabled ? " u-tab--disabled" : ""}`,
       "data-label": s ? void 0 : t.title,
       "aria-label": s ? t.title : void 0,
       "data-measure-tab": o ? "" : void 0,
@@ -78,13 +79,13 @@ const me = [], Ie = ({
       "aria-current": !o && t.id === m ? "page" : void 0,
       "aria-disabled": !o && t.disabled ? "true" : void 0
     }, Z(t), o);
-    return /* @__PURE__ */ r("div", { className: "u-tabs-item", children: U && !_ && !o ? /* @__PURE__ */ r(te, { tooltipText: t.title, portalOn: !0, className: "u-tabs-tooltip", children: l }) : l }, e);
+    return /* @__PURE__ */ r("div", { className: "u-tabs-item", children: U && !_ && !o ? /* @__PURE__ */ r(oe, { tooltipText: t.title, portalOn: !0, className: "u-tabs-tooltip", children: l }) : l }, e);
   };
   return /* @__PURE__ */ a(
     T ? "nav" : "div",
     {
       ref: K,
-      className: `u-tabs ${f ? "u-tabs-segment" : "u-tabs-line"}${y ? " u-tabs-full-width" : ""}${$ ? ` ${$}` : ""}`,
+      className: `u-tabs ${f ? "u-tabs-segment" : "u-tabs-line"}${y ? " u-tabs-full-width" : ""}${w ? ` ${w}` : ""}`,
       "aria-label": T ? B : void 0,
       children: [
         /* @__PURE__ */ a("div", { className: "u-tabs-track", ref: I, children: [
@@ -106,10 +107,10 @@ const me = [], Ie = ({
                   {
                     type: "button",
                     ref: N,
-                    className: `${w} u-tabs-more-trigger`,
+                    className: `${v} u-tabs-more-trigger`,
                     "aria-expanded": d,
                     "aria-haspopup": "menu",
-                    "aria-controls": O,
+                    "aria-controls": A,
                     onClick: () => c((e) => !e),
                     onKeyDown: (e) => {
                       (e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), e.stopPropagation(), c(!0), requestAnimationFrame(() => V(e.key === "ArrowUp" ? -1 : 0)));
@@ -120,7 +121,7 @@ const me = [], Ie = ({
                     ]
                   }
                 ),
-                H && /* @__PURE__ */ r("div", { className: "u-tabs-more-menu", role: "menu", id: O, ref: k, style: se(J, Y), children: A.current.filter((e) => n[e]).map((e) => /* @__PURE__ */ r(oe, { children: C(e, {
+                H && /* @__PURE__ */ r("div", { className: "u-tabs-more-menu", role: "menu", id: A, ref: k, style: ne(J, Y), children: O.current.filter((e) => n[e]).map((e) => /* @__PURE__ */ r(ee, { children: C(e, {
                   role: "menuitem",
                   "aria-disabled": n[e].disabled ? "true" : void 0,
                   tabIndex: n[e].disabled ? -1 : void 0
@@ -134,7 +135,7 @@ const me = [], Ie = ({
         ] }),
         /* @__PURE__ */ a("div", { ref: j, className: "u-tabs-measure", "aria-hidden": "true", children: [
           n.map((e, o) => E(o, !0)),
-          f && /* @__PURE__ */ a("button", { ref: q, type: "button", tabIndex: -1, className: `${w} u-tabs-more-trigger u-tabs-more-measure`, children: [
+          f && /* @__PURE__ */ a("button", { ref: q, type: "button", tabIndex: -1, className: `${v} u-tabs-more-trigger u-tabs-more-measure`, children: [
             /* @__PURE__ */ r("span", { children: "Ещё" }),
             /* @__PURE__ */ r(b, { name: "down", size: 14 })
           ] })
@@ -143,4 +144,4 @@ const me = [], Ie = ({
     }
   );
 };
-export { Ie as Tabs$u };
+export { Se as Tabs$u };

package/dist/components/Tooltip/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,kCAAkC,CAAC;AAE1C,OAAO,sDAAsD,CAAC;AAC9D,OAAO,gBAAgB,CAAC;AACxB,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AA2OpD,eAAO,MAAM,OAAO,GAAI,wHAYrB,iBAAiB,4CAgRnB,CAAC"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,kCAAkC,CAAC;AAE1C,OAAO,sDAAsD,CAAC;AAC9D,OAAO,gBAAgB,CAAC;AACxB,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AA4OpD,eAAO,MAAM,OAAO,GAAI,wHAYrB,iBAAiB,4CAgRnB,CAAC"}

package/dist/components/Tooltip/Tooltip.js

@@ -1,11 +1,12 @@
-import { jsxs as X, jsx as $ } from "react/jsx-runtime";
-import { useRef as z, useState as N, useCallback as B, useEffect as v, useLayoutEffect as W, useId as q } from "react";
+import { jsxs as X, jsx as N } from "react/jsx-runtime";
+import { useRef as z, useState as Y, useCallback as B, useEffect as v, useLayoutEffect as W } from "react";
 /* empty css                 */
-import { createPortal as tt } from "react-dom";
+import { createPortal as q } from "react-dom";
 /* empty css                                     */
 /* empty css         */
-import { getPortalScopeProps$u as et } from "../../shared/uiKitDefaults.js";
-import { useMountTransition$u as nt } from "../../hooks/useMountTransition.js";
+import { getPortalScopeProps$u as tt } from "../../shared/uiKitDefaults.js";
+import { useMountTransition$u as et } from "../../hooks/useMountTransition.js";
+import { useAutoId$u as nt } from "../../hooks/useAutoId.js";
 import { MOTION_EASE$u as C, motionMs$u as L, MOTION_MS$u as rt } from "../../vanilla/core/motion.js";
 const ot = 100, it = {
   top: "0 var(--u-motion-shift-sm, 4px)",
@@ -50,8 +51,8 @@ const ot = 100, it = {
   let f = M.x;
   const x = n / 2;
   f - x < R ? f = x + R : f + x > m - R && (f = m - R - x);
-  const T = t.x + t.width / 2, s = Math.max(0, x - ct), Y = Math.max(-s, Math.min(s, T - f));
-  return { placement: M.placement, x: f, y: M.y, arrowShift: Y };
+  const T = t.x + t.width / 2, s = Math.max(0, x - ct), $ = Math.max(-s, Math.min(s, T - f));
+  return { placement: M.placement, x: f, y: M.y, arrowShift: $ };
 }, K = (r) => {
   const t = document.activeElement;
   if (!r || !t || !r.contains(t)) return !1;
@@ -68,12 +69,12 @@ const at = () => {
   U || typeof document > "u" || (U = !0, document.addEventListener("pointerdown", () => {
     Q = Date.now();
   }, { capture: !0, passive: !0 }));
-}, mt = () => document.documentElement.getAttribute("data-input-mode") !== "keyboard" && Date.now() - Q < dt, St = ({
-  children: r = /* @__PURE__ */ $("div", {}),
+}, mt = () => document.documentElement.getAttribute("data-input-mode") !== "keyboard" && Date.now() - Q < dt, Rt = ({
+  children: r = /* @__PURE__ */ N("div", {}),
   className: t = "",
   portalOn: n = !1,
   id: a = "",
-  tooltipText: u = /* @__PURE__ */ $("div", {}),
+  tooltipText: u = /* @__PURE__ */ N("div", {}),
   style: y,
   tooltipStyle: m,
   position: w = "top",
@@ -81,19 +82,19 @@ const at = () => {
   showWhenActive: d = !1,
   showDelay: M = ot
 }) => {
-  const f = z(null), x = z(null), T = z(null), [s, Y] = N(!1), [_, I] = N(null), [o, p] = N(null), [b, H] = N(w), [k, G] = N(!1), P = () => {
+  const f = z(null), x = z(null), T = z(null), [s, $] = Y(!1), [_, I] = Y(null), [o, p] = Y(null), [b, H] = Y(w), [k, G] = Y(!1), P = () => {
     T.current && (clearTimeout(T.current), T.current = null);
   }, h = B(() => {
-    P(), Y(!1), I(null), G(!1);
-  }, []), { shouldRender: D, isAnimated: j } = nt({ isOpen: s, duration: rt.instant });
+    P(), $(!1), I(null), G(!1);
+  }, []), { shouldRender: D, isAnimated: j } = et({ isOpen: s, duration: rt.instant });
   v(() => {
     D || (p(null), H(w));
   }, [D, w]);
-  const F = B((e) => {
+  const A = B((e) => {
     P();
     const { x: c, y: i, width: l, height: E } = e.getBoundingClientRect();
-    I({ x: c, y: i, width: l, height: E, scrollY: window.scrollY }), Y(!0);
-  }, []), O = B((e) => {
+    I({ x: c, y: i, width: l, height: E, scrollY: window.scrollY }), $(!0);
+  }, []), F = B((e) => {
     const { x: c, y: i, width: l, height: E } = e.getBoundingClientRect();
     I((S) => S && { x: c, y: i, width: l, height: E, scrollY: window.scrollY });
   }, []);
@@ -114,19 +115,19 @@ const at = () => {
       if (d && g) return;
       const c = f.current;
       if (c && K(c)) {
-        O(c);
+        F(c);
         return;
       }
       h();
     };
     return window.addEventListener("scroll", e, !0), () => window.removeEventListener("scroll", e, !0);
-  }, [s, d, g, h, O]), v(() => {
+  }, [s, d, g, h, F]), v(() => {
     if (!n || !s) return;
     let e;
     const c = () => {
       e !== void 0 && window.cancelAnimationFrame(e), e = window.requestAnimationFrame(() => {
         const S = f.current;
-        S && O(S);
+        S && F(S);
       });
     };
     window.addEventListener("resize", c);
@@ -138,37 +139,37 @@ const at = () => {
     return E && (i == null || i.observe(E)), () => {
       window.removeEventListener("resize", c), i == null || i.disconnect(), e !== void 0 && window.cancelAnimationFrame(e);
     };
-  }, [n, s, O]), v(() => {
+  }, [n, s, F]), v(() => {
     if (!d || !n) return;
     if (!g) {
       h();
       return;
     }
     const e = f.current;
-    e && F(e);
-  }, [d, n, g, h, F]), v(() => P, []), v(at, []);
-  const Z = q(), A = a ? `u-tooltip${a}` : `u-tooltip${Z.replace(/:/g, "")}`;
+    e && A(e);
+  }, [d, n, g, h, A]), v(() => P, []), v(at, []);
+  const Z = nt(void 0, "u-tooltip"), O = a ? `u-tooltip${a}` : Z;
   return v(() => {
     const e = f.current;
     if (!n || !s || !e) return;
     const c = document.activeElement, i = c instanceof HTMLElement && e.contains(c) ? c : e, l = new Set((i.getAttribute("aria-describedby") ?? "").split(/\s+/).filter(Boolean));
-    return l.add(A), i.setAttribute("aria-describedby", [...l].join(" ")), () => {
-      const E = (i.getAttribute("aria-describedby") ?? "").split(/\s+/).filter((S) => S && S !== A);
+    return l.add(O), i.setAttribute("aria-describedby", [...l].join(" ")), () => {
+      const E = (i.getAttribute("aria-describedby") ?? "").split(/\s+/).filter((S) => S && S !== O);
       E.length ? i.setAttribute("aria-describedby", E.join(" ")) : i.removeAttribute("aria-describedby");
     };
-  }, [n, s, A]), n ? /* @__PURE__ */ X(
+  }, [n, s, O]), n ? /* @__PURE__ */ X(
     "div",
     {
       ref: f,
       style: y,
       onMouseEnter: d ? void 0 : (e) => {
-        g && F(e.currentTarget);
+        g && A(e.currentTarget);
       },
       onMouseLeave: d ? void 0 : () => {
         K(f.current) || h();
       },
       onFocus: d ? void 0 : (e) => {
-        g && !mt() && F(e.currentTarget);
+        g && !mt() && A(e.currentTarget);
       },
       onBlur: d ? void 0 : (e) => {
         e.currentTarget.contains(e.relatedTarget) || h();
@@ -178,12 +179,12 @@ const at = () => {
       },
       className: `u-help ${t}`,
       children: [
-        D && tt(
-          /* @__PURE__ */ $(
+        D && q(
+          /* @__PURE__ */ N(
             "div",
             {
               ref: x,
-              ...et(),
+              ...tt(),
               style: {
                 left: (o == null ? void 0 : o.x) ?? 0,
                 top: (o == null ? void 0 : o.y) ?? 0,
@@ -219,19 +220,19 @@ const at = () => {
                 ...s ? null : { pointerEvents: "none" }
               },
               className: `u-help-tooltip u-help-tooltip-portal--${b}`,
-              id: A,
+              id: O,
               role: "tooltip",
               children: u
             }
           ),
           document.body
         ),
-        /* @__PURE__ */ $("div", { className: "u-help__content", children: r })
+        /* @__PURE__ */ N("div", { className: "u-help__content", children: r })
       ]
     }
   ) : /* @__PURE__ */ X("div", { style: y, className: `u-help ${t}`, children: [
-    /* @__PURE__ */ $("div", { className: `u-help-tooltip u-help-tooltip--${w}`, children: u }),
-    /* @__PURE__ */ $("div", { className: "u-help__content", children: r })
+    /* @__PURE__ */ N("div", { className: `u-help-tooltip u-help-tooltip--${w}`, children: u }),
+    /* @__PURE__ */ N("div", { className: "u-help__content", children: r })
   ] });
 };
-export { St as Tooltip$u };
+export { Rt as Tooltip$u };