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

package/dist/components/Tabs/Tabs.js

@@ -3,20 +3,20 @@ import { jsxs as a, jsx as r } from "react/jsx-runtime";
 /* empty css                                  */
 /* empty css      */
 /* empty css                  */
-import { useState as x, useRef as p, useEffect as D, Fragment as ee } from "react";
+import { useState as D, useRef as p, useEffect as ee, Fragment as oe } from "react";
 import { Icon$u as b } from "../Icon/Icon.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 = [], Se = ({
+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 { useAutoId$u as ue } from "../../hooks/useAutoId.js";
+import { isPlainLeftClick$u as me } from "../../vanilla/core/linkClick.js";
+const de = [], Se = ({
   onClick: h,
-  tabsData: n = me,
+  tabsData: n = de,
   activeTab: m,
   className: w = "",
   variant: g = "line",
@@ -26,29 +26,29 @@ const me = [], Se = ({
   LinkComponent: $,
   ariaLabel: B
 }) => {
-  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);
+  const { containerRef: K, measureRef: j, moreMeasureRef: q, visible: z, overflow: u, paddingOf: F, morePadding: L, promote: H } = le(n, m, y, g !== "segment"), [d, c] = D(!1), R = p(null), N = p(null), k = p(null), A = ue(void 0, "u-tabs-menu"), { shouldRender: J, status: Y, isAnimated: G } = ne({ isOpen: d, duration: ie }), 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(() => {
+  const f = g === "segment", T = n.some((e) => e.url), v = f ? "u-tab-segment" : "u-tab-line", Q = f ? "u-tab-segment-active" : "u-tab-active", { trackRef: I, indicatorRef: V } = ae(m, `${g}|${y}|${JSON.stringify(n.map((e) => e.id))}`);
+  ce(I, !f, m), re({ refs: [R], enabled: d, onDismiss: () => c(!1) }), ee(() => {
     u.length || c(!1);
   }, [u.length]);
-  const S = (e) => {
+  const P = (e) => {
     var t, s;
     if ((t = n[e]) != null && t.disabled) return;
     const o = u.includes(e);
-    L(e), c(!1), h == null || h(n[e]), o && ((s = N.current) == null || s.focus({ preventScroll: !0 }));
-  }, P = () => {
+    H(e), c(!1), h == null || h(n[e]), o && ((s = N.current) == null || s.focus({ preventScroll: !0 }));
+  }, S = () => {
     var e;
     return Array.from(((e = k.current) == null ? void 0 : e.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])')) || []);
-  }, V = (e) => {
+  }, X = (e) => {
     var t;
-    const o = P();
+    const o = S();
     (t = o[e < 0 ? o.length - 1 : e]) == null || t.focus();
-  }, X = (e) => {
+  }, Z = (e) => {
     var i, l;
-    const o = P(), t = o.indexOf(document.activeElement), s = e.key === "ArrowDown" ? (t + 1) % o.length : e.key === "ArrowUp" ? (t - 1 + o.length) % o.length : e.key === "Home" ? 0 : e.key === "End" ? o.length - 1 : -1;
+    const o = S(), t = o.indexOf(document.activeElement), s = e.key === "ArrowDown" ? (t + 1) % o.length : e.key === "ArrowUp" ? (t - 1 + o.length) % o.length : e.key === "Home" ? 0 : e.key === "End" ? o.length - 1 : -1;
     s >= 0 ? (e.preventDefault(), (i = o[s]) == null || i.focus()) : e.key === "Escape" && (e.preventDefault(), c(!1), (l = N.current) == null || l.focus());
-  }, M = (e) => /* @__PURE__ */ r("span", { className: "u-tabs-title", "data-label": e.title, children: e.title }), Z = (e) => {
+  }, M = (e) => /* @__PURE__ */ r("span", { className: "u-tabs-title", "data-label": e.title, children: e.title }), W = (e) => {
     if (!e.icon) return M(e);
     const o = e.iconPosition === "right";
     return /* @__PURE__ */ a("span", { className: `u-tabs-content${o ? " u-tabs-content-reverse" : ""}`, children: [
@@ -58,16 +58,16 @@ const me = [], Se = ({
   }, C = (e, o, t, s = !1) => {
     const i = n[e];
     if (!i.url)
-      return /* @__PURE__ */ r("button", { type: "button", ...o, onClick: s ? void 0 : () => S(e), children: t });
+      return /* @__PURE__ */ r("button", { type: "button", ...o, onClick: s ? void 0 : () => P(e), children: t });
     if (s || i.disabled)
       return /* @__PURE__ */ r("a", { ...o, role: o.role ?? (s ? void 0 : "link"), children: t });
-    const l = (W) => {
-      ue(W) && S(e);
+    const l = (x) => {
+      me(x) && P(e);
     };
     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: `${v}${i}${t.id === m ? ` ${G}` : ""}${t.disabled ? " u-tab--disabled" : ""}`,
+      className: `${v}${i}${t.id === m ? ` ${Q}` : ""}${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,8 +78,8 @@ const me = [], Se = ({
       tabIndex: o || t.disabled ? -1 : void 0,
       "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(oe, { tooltipText: t.title, portalOn: !0, className: "u-tabs-tooltip", children: l }) : l }, e);
+    }, W(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__ */ a(
     T ? "nav" : "div",
@@ -89,14 +89,14 @@ const me = [], Se = ({
       "aria-label": T ? B : void 0,
       children: [
         /* @__PURE__ */ a("div", { className: "u-tabs-track", ref: I, children: [
-          /* @__PURE__ */ r("span", { className: "u-tabs-indicator", ref: Q, "aria-hidden": "true" }),
+          /* @__PURE__ */ r("span", { className: "u-tabs-indicator", ref: V, "aria-hidden": "true" }),
           z.map((e) => E(e)),
           u.length > 0 && /* @__PURE__ */ a(
             "div",
             {
               className: "u-tabs-more",
               ref: R,
-              onKeyDown: X,
+              onKeyDown: Z,
               onBlur: (e) => {
                 const o = e.relatedTarget;
                 o && !e.currentTarget.contains(o) && c(!1);
@@ -108,12 +108,13 @@ const me = [], Se = ({
                     type: "button",
                     ref: N,
                     className: `${v} u-tabs-more-trigger`,
+                    style: L(),
                     "aria-expanded": d,
                     "aria-haspopup": "menu",
                     "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)));
+                      (e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), e.stopPropagation(), c(!0), requestAnimationFrame(() => X(e.key === "ArrowUp" ? -1 : 0)));
                     },
                     children: [
                       /* @__PURE__ */ r("span", { children: "Ещё" }),
@@ -121,7 +122,7 @@ const me = [], Se = ({
                     ]
                   }
                 ),
-                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, {
+                J && /* @__PURE__ */ r("div", { className: "u-tabs-more-menu", role: "menu", id: A, ref: k, style: se(Y, G), children: O.current.filter((e) => n[e]).map((e) => /* @__PURE__ */ r(oe, { children: C(e, {
                   role: "menuitem",
                   "aria-disabled": n[e].disabled ? "true" : void 0,
                   tabIndex: n[e].disabled ? -1 : void 0

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

@@ -3,8 +3,11 @@ export declare const TAB_PADDING_MIN_RATIO = 0.4;
 /**
  * Насколько ужать отступы видимых вкладок: 0 — не ужимать, 1 — до предела.
  * Ровно столько, чтобы вкладки вместе с «Ещё» поместились в контейнер.
+ * `moreCut` — на сколько можно сузить кнопку «Ещё» за счёт её боковых отступов: она ужимается так же,
+ * как вкладки, иначе в ряду вкладки с узкими отступами, а «Ещё» с полными.
+ * `fullWidth` — колонки равные по самой широкой вкладке; ужимаем, пока она не влезает в колонку.
  */
-export declare const tabsSqueeze: (visible: number[], widths: number[], cuts: number[], availableWidth: number, gap: number, moreWidth: number, withMore: boolean) => number;
+export declare const tabsSqueeze: (visible: number[], widths: number[], cuts: number[], availableWidth: number, gap: number, moreWidth: number, withMore: boolean, moreCut?: number, fullWidth?: boolean) => number;
 /**
  * Ужатие отступов линейных вкладок: они не прячутся в «Ещё», а прокручиваются (tabsScroll.ts).
  * Ужимаем, только если так помещаются все; не помещаются и ужатыми — обычные отступы и прокрутка,
@@ -13,11 +16,12 @@ export declare const tabsSqueeze: (visible: number[], widths: number[], cuts: nu
 export declare const lineTabsSqueeze: (order: number[], widths: number[], cuts: number[], availableWidth: number, gap: number) => number;
 /**
  * Индексы сохраняют порядок и исходные объекты tabsData, включая дополнительные поля.
- * `cuts` — на сколько каждую вкладку можно сузить за счёт боковых отступов. Прежде чем прятать
+ * `cuts` — на сколько каждую вкладку можно сузить за счёт боковых отступов, `moreCut` — то же для кнопки «Ещё».
+ * В fullWidth колонки равные: их ширина — по самой широкой вкладке с ужатыми отступами. Прежде чем прятать
  * вкладку в «Ещё», проверяем, не помещаются ли все с ужатыми отступами: иначе «Ещё» появлялась,
  * когда не хватало пары пикселей, а в меню оказывалась одна вкладка.
  */
-export declare const distributeTabs: (order: number[], widths: number[], availableWidth: number, gap: number, moreWidth: number, activeIndex: number, fullWidth?: boolean, cuts?: number[]) => {
+export declare const distributeTabs: (order: number[], widths: number[], availableWidth: number, gap: number, moreWidth: number, activeIndex: number, fullWidth?: boolean, cuts?: number[], moreCut?: number) => {
     visible: number[];
     overflow: number[];
 };

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

@@ -1 +1 @@
-{"version":3,"file":"distributeTabs.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/distributeTabs.ts"],"names":[],"mappings":"AAAA,yGAAyG;AACzG,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAEzC;;;GAGG;AACH,eAAO,MAAM,WAAW,GACtB,SAAS,MAAM,EAAE,EACjB,QAAQ,MAAM,EAAE,EAChB,MAAM,MAAM,EAAE,EACd,gBAAgB,MAAM,EACtB,KAAK,MAAM,EACX,WAAW,MAAM,EACjB,UAAU,OAAO,WAUlB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO,MAAM,EAAE,EAAE,QAAQ,MAAM,EAAE,EAAE,MAAM,MAAM,EAAE,EAAE,gBAAgB,MAAM,EAAE,KAAK,MAAM,WAGrH,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,cAAc,GACzB,OAAO,MAAM,EAAE,EACf,QAAQ,MAAM,EAAE,EAChB,gBAAgB,MAAM,EACtB,KAAK,MAAM,EACX,WAAW,MAAM,EACjB,aAAa,MAAM,EACnB,mBAAiB,EACjB,OAAM,MAAM,EAAO;;cAcwB,MAAM,EAAE;CAsBpD,CAAC"}
+{"version":3,"file":"distributeTabs.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/distributeTabs.ts"],"names":[],"mappings":"AAAA,yGAAyG;AACzG,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAEzC;;;;;;GAMG;AACH,eAAO,MAAM,WAAW,GACtB,SAAS,MAAM,EAAE,EACjB,QAAQ,MAAM,EAAE,EAChB,MAAM,MAAM,EAAE,EACd,gBAAgB,MAAM,EACtB,KAAK,MAAM,EACX,WAAW,MAAM,EACjB,UAAU,OAAO,EACjB,gBAAW,EACX,mBAAiB,WA4BlB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO,MAAM,EAAE,EAAE,QAAQ,MAAM,EAAE,EAAE,MAAM,MAAM,EAAE,EAAE,gBAAgB,MAAM,EAAE,KAAK,MAAM,WAGrH,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,GACzB,OAAO,MAAM,EAAE,EACf,QAAQ,MAAM,EAAE,EAChB,gBAAgB,MAAM,EACtB,KAAK,MAAM,EACX,WAAW,MAAM,EACjB,aAAa,MAAM,EACnB,mBAAiB,EACjB,OAAM,MAAM,EAAO,EACnB,gBAAW;;cAegC,MAAM,EAAE;CAsBpD,CAAC"}

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

@@ -6,6 +6,10 @@ scroll: boolean) => {
         paddingLeft: number;
         paddingRight: number;
     };
+    morePadding: () => {
+        paddingLeft: number;
+        paddingRight: number;
+    };
     promote: (index: number) => void;
     visible: number[];
     overflow: number[];

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

@@ -1 +1 @@
-{"version":3,"file":"useTabsOverflow.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/useTabsOverflow.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGvD,eAAO,MAAM,eAAe,GAC1B,MAAM,kBAAkB,EAAE,EAC1B,WAAW,MAAM,GAAG,MAAM,GAAG,SAAS,EACtC,WAAW,OAAO;AAClB,+GAA+G;AAC/G,QAAQ,OAAO;uBAoEW,MAAM;;;;qBAOR,MAAM;;;;;;CAY/B,CAAC"}
+{"version":3,"file":"useTabsOverflow.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/useTabsOverflow.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGvD,eAAO,MAAM,eAAe,GAC1B,MAAM,kBAAkB,EAAE,EAC1B,WAAW,MAAM,GAAG,MAAM,GAAG,SAAS,EACtC,WAAW,OAAO;AAClB,+GAA+G;AAC/G,QAAQ,OAAO;uBA+EW,MAAM;;;;;;;;qBAIR,MAAM;;;;;;CAY/B,CAAC"}

package/dist/components/Tabs/useTabsOverflow.js

@@ -1,49 +1,48 @@
-import { useRef as O, useState as q, useCallback as P, useLayoutEffect as D } from "react";
-import { TAB_PADDING_MIN_RATIO$u as B, distributeTabs$u as G, lineTabsSqueeze$u as k, tabsSqueeze$u as J } from "../../vanilla/core/distributeTabs.js";
-const U = (l, N, u, b) => {
-  const g = O(null), m = O(null), L = O(null), h = JSON.stringify(l.map((t) => t.id)), S = l.map((t, e) => e), [z, T] = q({ signature: h, order: S }), p = z.signature === h ? z.order : S, [r, _] = q({ widths: [], paddings: [], available: 0, gap: 0, more: 0 }), o = P(() => {
-    var x;
-    const t = g.current, e = m.current;
-    if (!t || !e) return;
-    const n = getComputedStyle(t), a = t.getBoundingClientRect().width - (Number.parseFloat(n.borderLeftWidth) || 0) - (Number.parseFloat(n.borderRightWidth) || 0) - (Number.parseFloat(n.paddingLeft) || 0) - (Number.parseFloat(n.paddingRight) || 0), s = Array.from(e.querySelectorAll("[data-measure-tab]")), v = s.map((i) => i.getBoundingClientRect().width), R = s.map((i) => {
-      const c = getComputedStyle(i);
-      return [Number.parseFloat(c.paddingLeft) || 0, Number.parseFloat(c.paddingRight) || 0];
-    }), f = {
-      widths: v,
-      paddings: R,
+import { useRef as O, useState as _, useCallback as k, useLayoutEffect as J } from "react";
+import { TAB_PADDING_MIN_RATIO$u as L, distributeTabs$u as j, lineTabsSqueeze$u as H, tabsSqueeze$u as K } from "../../vanilla/core/distributeTabs.js";
+const Z = (u, F, p, f) => {
+  const b = O(null), h = O(null), z = O(null), v = JSON.stringify(u.map((e) => e.id)), C = u.map((e, t) => t), [S, M] = _({ signature: v, order: C }), w = S.signature === v ? S.order : C, [n, D] = _({ widths: [], paddings: [], available: 0, gap: 0, more: 0, morePadding: [0, 0] }), o = k(() => {
+    const e = b.current, t = h.current;
+    if (!e || !t) return;
+    const r = getComputedStyle(e), a = e.getBoundingClientRect().width - (Number.parseFloat(r.borderLeftWidth) || 0) - (Number.parseFloat(r.borderRightWidth) || 0) - (Number.parseFloat(r.paddingLeft) || 0) - (Number.parseFloat(r.paddingRight) || 0), i = Array.from(t.querySelectorAll("[data-measure-tab]")), P = i.map((d) => d.getBoundingClientRect().width), N = i.map((d) => {
+      const l = getComputedStyle(d);
+      return [Number.parseFloat(l.paddingLeft) || 0, Number.parseFloat(l.paddingRight) || 0];
+    }), m = z.current, c = m ? getComputedStyle(m) : null, g = {
+      widths: P,
+      paddings: N,
       available: a,
-      gap: Number.parseFloat(n.columnGap || "0") || 0,
-      more: ((x = L.current) == null ? void 0 : x.getBoundingClientRect().width) || 0
+      gap: Number.parseFloat(r.columnGap || "0") || 0,
+      more: (m == null ? void 0 : m.getBoundingClientRect().width) || 0,
+      morePadding: [Number.parseFloat((c == null ? void 0 : c.paddingLeft) ?? "") || 0, Number.parseFloat((c == null ? void 0 : c.paddingRight) ?? "") || 0]
     };
-    _((i) => i.available === f.available && i.gap === f.gap && i.more === f.more && i.widths.length === v.length && i.widths.every((c, y) => c === v[y]) && i.paddings.every(([c, y], A) => {
-      var E, I;
-      return c === ((E = R[A]) == null ? void 0 : E[0]) && y === ((I = R[A]) == null ? void 0 : I[1]);
-    }) ? i : f);
+    D((d) => d.available === g.available && d.gap === g.gap && d.more === g.more && d.morePadding[0] === g.morePadding[0] && d.morePadding[1] === g.morePadding[1] && d.widths.length === P.length && d.widths.every((l, y) => l === P[y]) && d.paddings.every(([l, y], B) => {
+      var E, T;
+      return l === ((E = N[B]) == null ? void 0 : E[0]) && y === ((T = N[B]) == null ? void 0 : T[1]);
+    }) ? d : g);
   }, []);
-  D(() => {
-    var n, a;
+  J(() => {
+    var r, a;
     o();
-    let t = !1;
-    const e = typeof ResizeObserver > "u" ? null : new ResizeObserver(o);
-    return g.current && (e == null || e.observe(g.current)), m.current && (e == null || e.observe(m.current)), window.addEventListener("resize", o), (n = document.fonts) == null || n.addEventListener("loadingdone", o), (a = document.fonts) == null || a.ready.then(() => {
-      t || o();
+    let e = !1;
+    const t = typeof ResizeObserver > "u" ? null : new ResizeObserver(o);
+    return b.current && (t == null || t.observe(b.current)), h.current && (t == null || t.observe(h.current)), window.addEventListener("resize", o), (r = document.fonts) == null || r.addEventListener("loadingdone", o), (a = document.fonts) == null || a.ready.then(() => {
+      e || o();
     }), () => {
-      var s;
-      t = !0, e == null || e.disconnect(), window.removeEventListener("resize", o), (s = document.fonts) == null || s.removeEventListener("loadingdone", o);
+      var i;
+      e = !0, t == null || t.disconnect(), window.removeEventListener("resize", o), (i = document.fonts) == null || i.removeEventListener("loadingdone", o);
     };
-  }, [o, l, u, b]);
-  const M = N === void 0 ? -1 : l.findIndex((t) => t.id === N), F = r.widths.length === l.length && r.widths.every((t) => t > 0), w = u ? [] : r.paddings.map(([t, e]) => (t + e) * (1 - B)), d = F && !b ? G(p, r.widths, r.available, r.gap, r.more, M, u, w) : { visible: p, overflow: [] }, C = !F || u ? 0 : b ? k(p, r.widths, w, r.available, r.gap) : J(d.visible, r.widths, w, r.available, r.gap, r.more, d.overflow.length > 0);
-  return { containerRef: g, measureRef: m, moreMeasureRef: L, ...d, paddingOf: (t) => {
-    const e = r.paddings[t];
-    if (!C || !e) return;
-    const n = 1 - C * (1 - B);
-    return { paddingLeft: e[0] * n, paddingRight: e[1] * n };
-  }, promote: (t) => {
-    if (!d.overflow.includes(t)) return;
-    const e = d.visible[d.visible.length - 1];
-    if (e === void 0) return;
-    const n = [...p], a = n.indexOf(t), s = n.indexOf(e);
-    [n[a], n[s]] = [n[s], n[a]], T({ signature: h, order: n });
+  }, [o, u, p, f]);
+  const G = F === void 0 ? -1 : u.findIndex((e) => e.id === F), q = n.widths.length === u.length && n.widths.every((e) => e > 0), R = n.paddings.map(([e, t]) => (e + t) * (1 - L)), x = (n.morePadding[0] + n.morePadding[1]) * (1 - L), s = q && !f ? j(w, n.widths, n.available, n.gap, n.more, G, p, R, x) : { visible: w, overflow: [] }, A = !q || p && f ? 0 : f ? H(w, n.widths, R, n.available, n.gap) : K(s.visible, n.widths, R, n.available, n.gap, n.more, s.overflow.length > 0, x, p), I = (e) => {
+    if (!A || !e) return;
+    const t = 1 - A * (1 - L);
+    return { paddingLeft: e[0] * t, paddingRight: e[1] * t };
+  };
+  return { containerRef: b, measureRef: h, moreMeasureRef: z, ...s, paddingOf: (e) => I(n.paddings[e]), morePadding: () => I(n.morePadding), promote: (e) => {
+    if (!s.overflow.includes(e)) return;
+    const t = s.visible[s.visible.length - 1];
+    if (t === void 0) return;
+    const r = [...w], a = r.indexOf(e), i = r.indexOf(t);
+    [r[a], r[i]] = [r[i], r[a]], M({ signature: v, order: r });
   } };
 };
-export { U as useTabsOverflow$u };
+export { Z as useTabsOverflow$u };