@purpurds/tabs 8.8.1 → 8.10.0

package/dist/tabs.es.js

@@ -1,17 +1,11 @@
 import { jsx as m, jsxs as ee } from "react/jsx-runtime";
 import * as a from "react";
-import O, { forwardRef as be, isValidElement as ke, useRef as te, useState as B, Children as z, useEffect as Y } from "react";
+import O, { forwardRef as be, isValidElement as Ge, useRef as te, useState as B, Children as z, useEffect as H } from "react";
 import "react-dom";
 function We(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var de = { exports: {} };
-/*!
-	Copyright (c) 2018 Jed Watson.
-	Licensed under the MIT License (MIT), see
-	http://jedwatson.github.io/classnames
-*/
-var fe;
+var de = { exports: {} }, fe;
 function Ke() {
   return fe || (fe = 1, (function(e) {
     (function() {
@@ -45,7 +39,7 @@ function Ke() {
   })(de)), de.exports;
 }
 var qe = Ke();
-const ze = /* @__PURE__ */ We(qe), Ye = {
+const ze = /* @__PURE__ */ We(qe), He = {
   "purpur-icon": "_purpur-icon_8u1lq_1",
   "purpur-icon--xxs": "_purpur-icon--xxs_8u1lq_4",
   "purpur-icon--xs": "_purpur-icon--xs_8u1lq_8",
@@ -53,19 +47,19 @@ const ze = /* @__PURE__ */ We(qe), Ye = {
   "purpur-icon--md": "_purpur-icon--md_8u1lq_16",
   "purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
   "purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
-}, Ze = ze.bind(Ye), pe = "purpur-icon", Xe = "md", He = (e) => e.filter((t) => Object.keys(t).length >= 1).map((t) => `${t.name}="${t.value}"`).join(" "), Je = ({ content: e = "", title: t } = {}) => {
+}, Ye = ze.bind(He), pe = "purpur-icon", Ze = "md", Xe = (e) => e.filter((t) => Object.keys(t).length >= 1).map((t) => `${t.name}="${t.value}"`).join(" "), Je = ({ content: e = "", title: t } = {}) => {
   const r = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
     { name: "viewBox", value: "0 0 24 24" },
     t ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
   ], o = t ? `<title>${t}</title>` : "";
-  return `<svg ${He(r)}>${o}${e}</svg>`;
-}, Qe = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), ge = ({ svg: e, allyTitle: t, className: r, size: o = Xe, ...s }) => {
+  return `<svg ${Xe(r)}>${o}${e}</svg>`;
+}, Qe = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), ge = ({ svg: e, allyTitle: t, className: r, size: o = Ze, ...s }) => {
   const n = Je({
     content: Qe(e.svg),
     title: t
-  }), c = Ze(pe, `${pe}--${o}`, r);
+  }), c = Ye(pe, `${pe}--${o}`, r);
   return /* @__PURE__ */ m("span", { className: c, dangerouslySetInnerHTML: { __html: n }, ...s });
 };
 ge.displayName = "Icon";
@@ -82,37 +76,35 @@ const et = {
 };
 function A(e, t, { checkForDefaultPrevented: r = !0 } = {}) {
   return function(s) {
-    if (e == null || e(s), r === !1 || !s.defaultPrevented)
-      return t == null ? void 0 : t(s);
+    if (e?.(s), r === !1 || !s.defaultPrevented)
+      return t?.(s);
   };
 }
 function ie(e, t = []) {
   let r = [];
   function o(n, c) {
-    const i = a.createContext(c), d = r.length;
+    const i = a.createContext(c), f = r.length;
     r = [...r, c];
-    const u = (f) => {
-      var C;
-      const { scope: v, children: g, ...I } = f, h = ((C = v == null ? void 0 : v[e]) == null ? void 0 : C[d]) || i, _ = a.useMemo(() => I, Object.values(I));
-      return /* @__PURE__ */ m(h.Provider, { value: _, children: g });
+    const l = (d) => {
+      const { scope: _, children: g, ...I } = d, C = _?.[e]?.[f] || i, v = a.useMemo(() => I, Object.values(I));
+      return /* @__PURE__ */ m(C.Provider, { value: v, children: g });
     };
-    u.displayName = n + "Provider";
-    function l(f, v) {
-      var h;
-      const g = ((h = v == null ? void 0 : v[e]) == null ? void 0 : h[d]) || i, I = a.useContext(g);
+    l.displayName = n + "Provider";
+    function u(d, _) {
+      const g = _?.[e]?.[f] || i, I = a.useContext(g);
       if (I) return I;
       if (c !== void 0) return c;
-      throw new Error(`\`${f}\` must be used within \`${n}\``);
+      throw new Error(`\`${d}\` must be used within \`${n}\``);
     }
-    return [u, l];
+    return [l, u];
   }
   const s = () => {
     const n = r.map((c) => a.createContext(c));
     return function(i) {
-      const d = (i == null ? void 0 : i[e]) || n;
+      const f = i?.[e] || n;
       return a.useMemo(
-        () => ({ [`__scope${e}`]: { ...i, [e]: d } }),
-        [i, d]
+        () => ({ [`__scope${e}`]: { ...i, [e]: f } }),
+        [i, f]
       );
     };
   };
@@ -127,9 +119,9 @@ function nt(...e) {
       scopeName: s.scopeName
     }));
     return function(n) {
-      const c = o.reduce((i, { useScope: d, scopeName: u }) => {
-        const f = d(n)[`__scope${u}`];
-        return { ...i, ...f };
+      const c = o.reduce((i, { useScope: f, scopeName: l }) => {
+        const d = f(n)[`__scope${l}`];
+        return { ...i, ...d };
       }, {});
       return a.useMemo(() => ({ [`__scope${t.scopeName}`]: c }), [c]);
     };
@@ -157,16 +149,16 @@ function he(...e) {
       };
   };
 }
-function X(...e) {
+function Z(...e) {
   return a.useCallback(he(...e), e);
 }
 // @__NO_SIDE_EFFECTS__
 function se(e) {
   const t = /* @__PURE__ */ rt(e), r = a.forwardRef((o, s) => {
-    const { children: n, ...c } = o, i = a.Children.toArray(n), d = i.find(st);
-    if (d) {
-      const u = d.props.children, l = i.map((f) => f === d ? a.Children.count(u) > 1 ? a.Children.only(null) : a.isValidElement(u) ? u.props.children : null : f);
-      return /* @__PURE__ */ m(t, { ...c, ref: s, children: a.isValidElement(u) ? a.cloneElement(u, void 0, l) : null });
+    const { children: n, ...c } = o, i = a.Children.toArray(n), f = i.find(st);
+    if (f) {
+      const l = f.props.children, u = i.map((d) => d === f ? a.Children.count(l) > 1 ? a.Children.only(null) : a.isValidElement(l) ? l.props.children : null : d);
+      return /* @__PURE__ */ m(t, { ...c, ref: s, children: a.isValidElement(l) ? a.cloneElement(l, void 0, u) : null });
     }
     return /* @__PURE__ */ m(t, { ...c, ref: s, children: n });
   });
@@ -193,63 +185,62 @@ function ct(e, t) {
   for (const o in t) {
     const s = e[o], n = t[o];
     /^on[A-Z]/.test(o) ? s && n ? r[o] = (...i) => {
-      const d = n(...i);
-      return s(...i), d;
+      const f = n(...i);
+      return s(...i), f;
     } : s && (r[o] = s) : o === "style" ? r[o] = { ...s, ...n } : o === "className" && (r[o] = [s, n].filter(Boolean).join(" "));
   }
   return { ...e, ...r };
 }
 function it(e) {
-  var o, s;
-  let t = (o = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : o.get, r = t && "isReactWarning" in t && t.isReactWarning;
-  return r ? e.ref : (t = (s = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : s.get, r = t && "isReactWarning" in t && t.isReactWarning, r ? e.props.ref : e.props.ref || e.ref);
+  let t = Object.getOwnPropertyDescriptor(e.props, "ref")?.get, r = t && "isReactWarning" in t && t.isReactWarning;
+  return r ? e.ref : (t = Object.getOwnPropertyDescriptor(e, "ref")?.get, r = t && "isReactWarning" in t && t.isReactWarning, r ? e.props.ref : e.props.ref || e.ref);
 }
 function at(e) {
   const t = e + "CollectionProvider", [r, o] = ie(t), [s, n] = r(
     t,
     { collectionRef: { current: null }, itemMap: /* @__PURE__ */ new Map() }
-  ), c = (h) => {
-    const { scope: _, children: C } = h, N = O.useRef(null), w = O.useRef(/* @__PURE__ */ new Map()).current;
-    return /* @__PURE__ */ m(s, { scope: _, itemMap: w, collectionRef: N, children: C });
+  ), c = (C) => {
+    const { scope: v, children: y } = C, R = O.useRef(null), h = O.useRef(/* @__PURE__ */ new Map()).current;
+    return /* @__PURE__ */ m(s, { scope: v, itemMap: h, collectionRef: R, children: y });
   };
   c.displayName = t;
-  const i = e + "CollectionSlot", d = /* @__PURE__ */ se(i), u = O.forwardRef(
-    (h, _) => {
-      const { scope: C, children: N } = h, w = n(i, C), b = X(_, w.collectionRef);
-      return /* @__PURE__ */ m(d, { ref: b, children: N });
+  const i = e + "CollectionSlot", f = /* @__PURE__ */ se(i), l = O.forwardRef(
+    (C, v) => {
+      const { scope: y, children: R } = C, h = n(i, y), b = Z(v, h.collectionRef);
+      return /* @__PURE__ */ m(f, { ref: b, children: R });
     }
   );
-  u.displayName = i;
-  const l = e + "CollectionItemSlot", f = "data-radix-collection-item", v = /* @__PURE__ */ se(l), g = O.forwardRef(
-    (h, _) => {
-      const { scope: C, children: N, ...w } = h, b = O.useRef(null), R = X(_, b), x = n(l, C);
-      return O.useEffect(() => (x.itemMap.set(b, { ref: b, ...w }), () => void x.itemMap.delete(b))), /* @__PURE__ */ m(v, { [f]: "", ref: R, children: N });
+  l.displayName = i;
+  const u = e + "CollectionItemSlot", d = "data-radix-collection-item", _ = /* @__PURE__ */ se(u), g = O.forwardRef(
+    (C, v) => {
+      const { scope: y, children: R, ...h } = C, b = O.useRef(null), T = Z(v, b), E = n(u, y);
+      return O.useEffect(() => (E.itemMap.set(b, { ref: b, ...h }), () => void E.itemMap.delete(b))), /* @__PURE__ */ m(_, { [d]: "", ref: T, children: R });
     }
   );
-  g.displayName = l;
-  function I(h) {
-    const _ = n(e + "CollectionConsumer", h);
+  g.displayName = u;
+  function I(C) {
+    const v = n(e + "CollectionConsumer", C);
     return O.useCallback(() => {
-      const N = _.collectionRef.current;
-      if (!N) return [];
-      const w = Array.from(N.querySelectorAll(`[${f}]`));
-      return Array.from(_.itemMap.values()).sort(
-        (x, P) => w.indexOf(x.ref.current) - w.indexOf(P.ref.current)
+      const R = v.collectionRef.current;
+      if (!R) return [];
+      const h = Array.from(R.querySelectorAll(`[${d}]`));
+      return Array.from(v.itemMap.values()).sort(
+        (E, P) => h.indexOf(E.ref.current) - h.indexOf(P.ref.current)
       );
-    }, [_.collectionRef, _.itemMap]);
+    }, [v.collectionRef, v.itemMap]);
   }
   return [
-    { Provider: c, Slot: u, ItemSlot: g },
+    { Provider: c, Slot: l, ItemSlot: g },
     I,
     o
   ];
 }
-var H = globalThis != null && globalThis.document ? a.useLayoutEffect : () => {
+var X = globalThis?.document ? a.useLayoutEffect : () => {
 }, ut = a[" useId ".trim().toString()] || (() => {
 }), lt = 0;
 function we(e) {
   const [t, r] = a.useState(ut());
-  return H(() => {
+  return X(() => {
     r((o) => o ?? String(lt++));
   }, [e]), t ? `radix-${t}` : "";
 }
@@ -271,10 +262,10 @@ var dt = [
   "span",
   "svg",
   "ul"
-], j = dt.reduce((e, t) => {
+], L = dt.reduce((e, t) => {
   const r = /* @__PURE__ */ se(`Primitive.${t}`), o = a.forwardRef((s, n) => {
-    const { asChild: c, ...i } = s, d = c ? r : t;
-    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ m(d, { ...i, ref: n });
+    const { asChild: c, ...i } = s, f = c ? r : t;
+    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ m(f, { ...i, ref: n });
   });
   return o.displayName = `Primitive.${t}`, { ...e, [t]: o };
 }, {});
@@ -282,12 +273,9 @@ function ft(e) {
   const t = a.useRef(e);
   return a.useEffect(() => {
     t.current = e;
-  }), a.useMemo(() => (...r) => {
-    var o;
-    return (o = t.current) == null ? void 0 : o.call(t, ...r);
-  }, []);
+  }), a.useMemo(() => (...r) => t.current?.(...r), []);
 }
-var pt = a[" useInsertionEffect ".trim().toString()] || H;
+var pt = a[" useInsertionEffect ".trim().toString()] || X;
 function Ce({
   prop: e,
   defaultProp: t,
@@ -298,28 +286,27 @@ function Ce({
   const [s, n, c] = mt({
     defaultProp: t,
     onChange: r
-  }), i = e !== void 0, d = i ? e : s;
+  }), i = e !== void 0, f = i ? e : s;
   {
-    const l = a.useRef(e !== void 0);
+    const u = a.useRef(e !== void 0);
     a.useEffect(() => {
-      const f = l.current;
-      f !== i && console.warn(
-        `${o} is changing from ${f ? "controlled" : "uncontrolled"} to ${i ? "controlled" : "uncontrolled"}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`
-      ), l.current = i;
+      const d = u.current;
+      d !== i && console.warn(
+        `${o} is changing from ${d ? "controlled" : "uncontrolled"} to ${i ? "controlled" : "uncontrolled"}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`
+      ), u.current = i;
     }, [i, o]);
   }
-  const u = a.useCallback(
-    (l) => {
-      var f;
+  const l = a.useCallback(
+    (u) => {
       if (i) {
-        const v = vt(l) ? l(e) : l;
-        v !== e && ((f = c.current) == null || f.call(c, v));
+        const d = vt(u) ? u(e) : u;
+        d !== e && c.current?.(d);
       } else
-        n(l);
+        n(u);
     },
     [i, e, n, c]
   );
-  return [d, u];
+  return [f, l];
 }
 function mt({
   defaultProp: e,
@@ -329,26 +316,25 @@ function mt({
   return pt(() => {
     n.current = t;
   }, [t]), a.useEffect(() => {
-    var c;
-    s.current !== r && ((c = n.current) == null || c.call(n, r), s.current = r);
+    s.current !== r && (n.current?.(r), s.current = r);
   }, [r, s]), [r, o, n];
 }
 function vt(e) {
   return typeof e == "function";
 }
 var _t = a.createContext(void 0);
-function Se(e) {
+function ye(e) {
   const t = a.useContext(_t);
   return e || t || "ltr";
 }
-var ne = "rovingFocusGroup.onEntryFocus", bt = { bubbles: !1, cancelable: !0 }, U = "RovingFocusGroup", [ce, ye, gt] = at(U), [ht, Ie] = ie(
+var ne = "rovingFocusGroup.onEntryFocus", bt = { bubbles: !1, cancelable: !0 }, U = "RovingFocusGroup", [ce, Se, gt] = at(U), [ht, Ie] = ie(
   U,
   [gt]
 ), [wt, Ct] = ht(U), Re = a.forwardRef(
-  (e, t) => /* @__PURE__ */ m(ce.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(ce.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(St, { ...e, ref: t }) }) })
+  (e, t) => /* @__PURE__ */ m(ce.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(ce.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(yt, { ...e, ref: t }) }) })
 );
 Re.displayName = U;
-var St = a.forwardRef((e, t) => {
+var yt = a.forwardRef((e, t) => {
   const {
     __scopeRovingFocusGroup: r,
     orientation: o,
@@ -356,71 +342,71 @@ var St = a.forwardRef((e, t) => {
     dir: n,
     currentTabStopId: c,
     defaultCurrentTabStopId: i,
-    onCurrentTabStopIdChange: d,
-    onEntryFocus: u,
-    preventScrollOnEntryFocus: l = !1,
-    ...f
-  } = e, v = a.useRef(null), g = X(t, v), I = Se(n), [h, _] = Ce({
+    onCurrentTabStopIdChange: f,
+    onEntryFocus: l,
+    preventScrollOnEntryFocus: u = !1,
+    ...d
+  } = e, _ = a.useRef(null), g = Z(t, _), I = ye(n), [C, v] = Ce({
     prop: c,
     defaultProp: i ?? null,
-    onChange: d,
+    onChange: f,
     caller: U
-  }), [C, N] = a.useState(!1), w = ft(u), b = ye(r), R = a.useRef(!1), [x, P] = a.useState(0);
+  }), [y, R] = a.useState(!1), h = ft(l), b = Se(r), T = a.useRef(!1), [E, P] = a.useState(0);
   return a.useEffect(() => {
-    const y = v.current;
-    if (y)
-      return y.addEventListener(ne, w), () => y.removeEventListener(ne, w);
-  }, [w]), /* @__PURE__ */ m(
+    const S = _.current;
+    if (S)
+      return S.addEventListener(ne, h), () => S.removeEventListener(ne, h);
+  }, [h]), /* @__PURE__ */ m(
     wt,
     {
       scope: r,
       orientation: o,
       dir: I,
       loop: s,
-      currentTabStopId: h,
+      currentTabStopId: C,
       onItemFocus: a.useCallback(
-        (y) => _(y),
-        [_]
+        (S) => v(S),
+        [v]
       ),
-      onItemShiftTab: a.useCallback(() => N(!0), []),
+      onItemShiftTab: a.useCallback(() => R(!0), []),
       onFocusableItemAdd: a.useCallback(
-        () => P((y) => y + 1),
+        () => P((S) => S + 1),
         []
       ),
       onFocusableItemRemove: a.useCallback(
-        () => P((y) => y - 1),
+        () => P((S) => S - 1),
         []
       ),
       children: /* @__PURE__ */ m(
-        j.div,
+        L.div,
         {
-          tabIndex: C || x === 0 ? -1 : 0,
+          tabIndex: y || E === 0 ? -1 : 0,
           "data-orientation": o,
-          ...f,
+          ...d,
           ref: g,
           style: { outline: "none", ...e.style },
           onMouseDown: A(e.onMouseDown, () => {
-            R.current = !0;
+            T.current = !0;
           }),
-          onFocus: A(e.onFocus, (y) => {
-            const Q = !R.current;
-            if (y.target === y.currentTarget && Q && !C) {
+          onFocus: A(e.onFocus, (S) => {
+            const Q = !T.current;
+            if (S.target === S.currentTarget && Q && !y) {
               const F = new CustomEvent(ne, bt);
-              if (y.currentTarget.dispatchEvent(F), !F.defaultPrevented) {
-                const L = b().filter((E) => E.focusable), V = L.find((E) => E.active), G = L.find((E) => E.id === h), W = [V, G, ...L].filter(
+              if (S.currentTarget.dispatchEvent(F), !F.defaultPrevented) {
+                const j = b().filter((x) => x.focusable), V = j.find((x) => x.active), k = j.find((x) => x.id === C), W = [V, k, ...j].filter(
                   Boolean
-                ).map((E) => E.ref.current);
-                xe(W, l);
+                ).map((x) => x.ref.current);
+                Ee(W, u);
               }
             }
-            R.current = !1;
+            T.current = !1;
           }),
-          onBlur: A(e.onBlur, () => N(!1))
+          onBlur: A(e.onBlur, () => R(!1))
         }
       )
     }
   );
-}), Ne = "RovingFocusGroupItem", Te = a.forwardRef(
+}), Te = "RovingFocusGroupItem", Ne = a.forwardRef(
   (e, t) => {
     const {
       __scopeRovingFocusGroup: r,
@@ -429,7 +415,7 @@ var St = a.forwardRef((e, t) => {
       tabStopId: n,
       children: c,
       ...i
-    } = e, d = we(), u = n || d, l = Ct(Ne, r), f = l.currentTabStopId === u, v = ye(r), { onFocusableItemAdd: g, onFocusableItemRemove: I, currentTabStopId: h } = l;
+    } = e, f = we(), l = n || f, u = Ct(Te, r), d = u.currentTabStopId === l, _ = Se(r), { onFocusableItemAdd: g, onFocusableItemRemove: I, currentTabStopId: C } = u;
     return a.useEffect(() => {
       if (o)
         return g(), () => I();
@@ -437,49 +423,49 @@ var St = a.forwardRef((e, t) => {
       ce.ItemSlot,
       {
         scope: r,
-        id: u,
+        id: l,
         focusable: o,
         active: s,
         children: /* @__PURE__ */ m(
-          j.span,
+          L.span,
           {
-            tabIndex: f ? 0 : -1,
-            "data-orientation": l.orientation,
+            tabIndex: d ? 0 : -1,
+            "data-orientation": u.orientation,
             ...i,
             ref: t,
-            onMouseDown: A(e.onMouseDown, (_) => {
-              o ? l.onItemFocus(u) : _.preventDefault();
+            onMouseDown: A(e.onMouseDown, (v) => {
+              o ? u.onItemFocus(l) : v.preventDefault();
             }),
-            onFocus: A(e.onFocus, () => l.onItemFocus(u)),
-            onKeyDown: A(e.onKeyDown, (_) => {
-              if (_.key === "Tab" && _.shiftKey) {
-                l.onItemShiftTab();
+            onFocus: A(e.onFocus, () => u.onItemFocus(l)),
+            onKeyDown: A(e.onKeyDown, (v) => {
+              if (v.key === "Tab" && v.shiftKey) {
+                u.onItemShiftTab();
                 return;
               }
-              if (_.target !== _.currentTarget) return;
-              const C = Rt(_, l.orientation, l.dir);
-              if (C !== void 0) {
-                if (_.metaKey || _.ctrlKey || _.altKey || _.shiftKey) return;
-                _.preventDefault();
-                let w = v().filter((b) => b.focusable).map((b) => b.ref.current);
-                if (C === "last") w.reverse();
-                else if (C === "prev" || C === "next") {
-                  C === "prev" && w.reverse();
-                  const b = w.indexOf(_.currentTarget);
-                  w = l.loop ? Nt(w, b + 1) : w.slice(b + 1);
+              if (v.target !== v.currentTarget) return;
+              const y = Rt(v, u.orientation, u.dir);
+              if (y !== void 0) {
+                if (v.metaKey || v.ctrlKey || v.altKey || v.shiftKey) return;
+                v.preventDefault();
+                let h = _().filter((b) => b.focusable).map((b) => b.ref.current);
+                if (y === "last") h.reverse();
+                else if (y === "prev" || y === "next") {
+                  y === "prev" && h.reverse();
+                  const b = h.indexOf(v.currentTarget);
+                  h = u.loop ? Tt(h, b + 1) : h.slice(b + 1);
                 }
-                setTimeout(() => xe(w));
+                setTimeout(() => Ee(h));
               }
             }),
-            children: typeof c == "function" ? c({ isCurrentTabStop: f, hasTabStop: h != null }) : c
+            children: typeof c == "function" ? c({ isCurrentTabStop: d, hasTabStop: C != null }) : c
           }
         )
       }
     );
   }
 );
-Te.displayName = Ne;
-var yt = {
+Ne.displayName = Te;
+var St = {
   ArrowLeft: "prev",
   ArrowUp: "prev",
   ArrowRight: "next",
@@ -495,27 +481,27 @@ function It(e, t) {
 function Rt(e, t, r) {
   const o = It(e.key, r);
   if (!(t === "vertical" && ["ArrowLeft", "ArrowRight"].includes(o)) && !(t === "horizontal" && ["ArrowUp", "ArrowDown"].includes(o)))
-    return yt[o];
+    return St[o];
 }
-function xe(e, t = !1) {
+function Ee(e, t = !1) {
   const r = document.activeElement;
   for (const o of e)
     if (o === r || (o.focus({ preventScroll: t }), document.activeElement !== r)) return;
 }
-function Nt(e, t) {
+function Tt(e, t) {
   return e.map((r, o) => e[(t + o) % e.length]);
 }
-var Tt = Re, xt = Te;
-function Et(e, t) {
+var Nt = Re, Et = Ne;
+function xt(e, t) {
   return a.useReducer((r, o) => t[r][o] ?? r, e);
 }
-var Ee = (e) => {
-  const { present: t, children: r } = e, o = At(t), s = typeof r == "function" ? r({ present: o.isPresent }) : a.Children.only(r), n = X(o.ref, $t(s));
+var xe = (e) => {
+  const { present: t, children: r } = e, o = At(t), s = typeof r == "function" ? r({ present: o.isPresent }) : a.Children.only(r), n = Z(o.ref, $t(s));
   return typeof r == "function" || o.isPresent ? a.cloneElement(s, { ref: n }) : null;
 };
-Ee.displayName = "Presence";
+xe.displayName = "Presence";
 function At(e) {
-  const [t, r] = a.useState(), o = a.useRef(null), s = a.useRef(e), n = a.useRef("none"), c = e ? "mounted" : "unmounted", [i, d] = Et(c, {
+  const [t, r] = a.useState(), o = a.useRef(null), s = a.useRef(e), n = a.useRef("none"), c = e ? "mounted" : "unmounted", [i, f] = xt(c, {
     mounted: {
       UNMOUNT: "unmounted",
       ANIMATION_OUT: "unmountSuspended"
@@ -529,47 +515,46 @@ function At(e) {
     }
   });
   return a.useEffect(() => {
-    const u = Z(o.current);
-    n.current = i === "mounted" ? u : "none";
-  }, [i]), H(() => {
-    const u = o.current, l = s.current;
-    if (l !== e) {
-      const v = n.current, g = Z(u);
-      e ? d("MOUNT") : g === "none" || (u == null ? void 0 : u.display) === "none" ? d("UNMOUNT") : d(l && v !== g ? "ANIMATION_OUT" : "UNMOUNT"), s.current = e;
+    const l = Y(o.current);
+    n.current = i === "mounted" ? l : "none";
+  }, [i]), X(() => {
+    const l = o.current, u = s.current;
+    if (u !== e) {
+      const _ = n.current, g = Y(l);
+      e ? f("MOUNT") : g === "none" || l?.display === "none" ? f("UNMOUNT") : f(u && _ !== g ? "ANIMATION_OUT" : "UNMOUNT"), s.current = e;
     }
-  }, [e, d]), H(() => {
+  }, [e, f]), X(() => {
     if (t) {
-      let u;
-      const l = t.ownerDocument.defaultView ?? window, f = (g) => {
-        const h = Z(o.current).includes(CSS.escape(g.animationName));
-        if (g.target === t && h && (d("ANIMATION_END"), !s.current)) {
-          const _ = t.style.animationFillMode;
-          t.style.animationFillMode = "forwards", u = l.setTimeout(() => {
-            t.style.animationFillMode === "forwards" && (t.style.animationFillMode = _);
+      let l;
+      const u = t.ownerDocument.defaultView ?? window, d = (g) => {
+        const C = Y(o.current).includes(CSS.escape(g.animationName));
+        if (g.target === t && C && (f("ANIMATION_END"), !s.current)) {
+          const v = t.style.animationFillMode;
+          t.style.animationFillMode = "forwards", l = u.setTimeout(() => {
+            t.style.animationFillMode === "forwards" && (t.style.animationFillMode = v);
           });
         }
-      }, v = (g) => {
-        g.target === t && (n.current = Z(o.current));
+      }, _ = (g) => {
+        g.target === t && (n.current = Y(o.current));
       };
-      return t.addEventListener("animationstart", v), t.addEventListener("animationcancel", f), t.addEventListener("animationend", f), () => {
-        l.clearTimeout(u), t.removeEventListener("animationstart", v), t.removeEventListener("animationcancel", f), t.removeEventListener("animationend", f);
+      return t.addEventListener("animationstart", _), t.addEventListener("animationcancel", d), t.addEventListener("animationend", d), () => {
+        u.clearTimeout(l), t.removeEventListener("animationstart", _), t.removeEventListener("animationcancel", d), t.removeEventListener("animationend", d);
       };
     } else
-      d("ANIMATION_END");
-  }, [t, d]), {
+      f("ANIMATION_END");
+  }, [t, f]), {
     isPresent: ["mounted", "unmountSuspended"].includes(i),
-    ref: a.useCallback((u) => {
-      o.current = u ? getComputedStyle(u) : null, r(u);
+    ref: a.useCallback((l) => {
+      o.current = l ? getComputedStyle(l) : null, r(l);
     }, [])
   };
 }
-function Z(e) {
-  return (e == null ? void 0 : e.animationName) || "none";
+function Y(e) {
+  return e?.animationName || "none";
 }
 function $t(e) {
-  var o, s;
-  let t = (o = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : o.get, r = t && "isReactWarning" in t && t.isReactWarning;
-  return r ? e.ref : (t = (s = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : s.get, r = t && "isReactWarning" in t && t.isReactWarning, r ? e.props.ref : e.props.ref || e.ref);
+  let t = Object.getOwnPropertyDescriptor(e.props, "ref")?.get, r = t && "isReactWarning" in t && t.isReactWarning;
+  return r ? e.ref : (t = Object.getOwnPropertyDescriptor(e, "ref")?.get, r = t && "isReactWarning" in t && t.isReactWarning, r ? e.props.ref : e.props.ref || e.ref);
 }
 var J = "Tabs", [Mt] = ie(J, [
   Ie
@@ -582,9 +567,9 @@ var J = "Tabs", [Mt] = ie(J, [
       defaultValue: n,
       orientation: c = "horizontal",
       dir: i,
-      activationMode: d = "automatic",
-      ...u
-    } = e, l = Se(i), [f, v] = Ce({
+      activationMode: f = "automatic",
+      ...l
+    } = e, u = ye(i), [d, _] = Ce({
       prop: o,
       onChange: s,
       defaultProp: n ?? "",
@@ -595,17 +580,17 @@ var J = "Tabs", [Mt] = ie(J, [
       {
         scope: r,
         baseId: we(),
-        value: f,
-        onValueChange: v,
+        value: d,
+        onValueChange: _,
         orientation: c,
-        dir: l,
-        activationMode: d,
+        dir: u,
+        activationMode: f,
         children: /* @__PURE__ */ m(
-          j.div,
+          L.div,
           {
-            dir: l,
+            dir: u,
             "data-orientation": c,
-            ...u,
+            ...l,
             ref: t
           }
         )
@@ -618,7 +603,7 @@ var Me = "TabsList", Pe = a.forwardRef(
   (e, t) => {
     const { __scopeTabs: r, loop: o = !0, ...s } = e, n = ae(Me, r), c = Ae(r);
     return /* @__PURE__ */ m(
-      Tt,
+      Nt,
       {
         asChild: !0,
         ...c,
@@ -626,7 +611,7 @@ var Me = "TabsList", Pe = a.forwardRef(
         dir: n.dir,
         loop: o,
         children: /* @__PURE__ */ m(
-          j.div,
+          L.div,
           {
             role: "tablist",
             "aria-orientation": n.orientation,
@@ -641,36 +626,36 @@ var Me = "TabsList", Pe = a.forwardRef(
 Pe.displayName = Me;
 var Oe = "TabsTrigger", Fe = a.forwardRef(
   (e, t) => {
-    const { __scopeTabs: r, value: o, disabled: s = !1, ...n } = e, c = ae(Oe, r), i = Ae(r), d = Le(c.baseId, o), u = Ve(c.baseId, o), l = o === c.value;
+    const { __scopeTabs: r, value: o, disabled: s = !1, ...n } = e, c = ae(Oe, r), i = Ae(r), f = je(c.baseId, o), l = Ve(c.baseId, o), u = o === c.value;
     return /* @__PURE__ */ m(
-      xt,
+      Et,
       {
         asChild: !0,
         ...i,
         focusable: !s,
-        active: l,
+        active: u,
         children: /* @__PURE__ */ m(
-          j.button,
+          L.button,
           {
             type: "button",
             role: "tab",
-            "aria-selected": l,
-            "aria-controls": u,
-            "data-state": l ? "active" : "inactive",
+            "aria-selected": u,
+            "aria-controls": l,
+            "data-state": u ? "active" : "inactive",
             "data-disabled": s ? "" : void 0,
             disabled: s,
-            id: d,
+            id: f,
             ...n,
             ref: t,
-            onMouseDown: A(e.onMouseDown, (f) => {
-              !s && f.button === 0 && f.ctrlKey === !1 ? c.onValueChange(o) : f.preventDefault();
+            onMouseDown: A(e.onMouseDown, (d) => {
+              !s && d.button === 0 && d.ctrlKey === !1 ? c.onValueChange(o) : d.preventDefault();
             }),
-            onKeyDown: A(e.onKeyDown, (f) => {
-              [" ", "Enter"].includes(f.key) && c.onValueChange(o);
+            onKeyDown: A(e.onKeyDown, (d) => {
+              [" ", "Enter"].includes(d.key) && c.onValueChange(o);
             }),
             onFocus: A(e.onFocus, () => {
-              const f = c.activationMode !== "manual";
-              !l && !s && f && c.onValueChange(o);
+              const d = c.activationMode !== "manual";
+              !u && !s && d && c.onValueChange(o);
             })
           }
         )
@@ -679,50 +664,45 @@ var Oe = "TabsTrigger", Fe = a.forwardRef(
   }
 );
 Fe.displayName = Oe;
-var De = "TabsContent", je = a.forwardRef(
+var De = "TabsContent", Le = a.forwardRef(
   (e, t) => {
-    const { __scopeTabs: r, value: o, forceMount: s, children: n, ...c } = e, i = ae(De, r), d = Le(i.baseId, o), u = Ve(i.baseId, o), l = o === i.value, f = a.useRef(l);
+    const { __scopeTabs: r, value: o, forceMount: s, children: n, ...c } = e, i = ae(De, r), f = je(i.baseId, o), l = Ve(i.baseId, o), u = o === i.value, d = a.useRef(u);
     return a.useEffect(() => {
-      const v = requestAnimationFrame(() => f.current = !1);
-      return () => cancelAnimationFrame(v);
-    }, []), /* @__PURE__ */ m(Ee, { present: s || l, children: ({ present: v }) => /* @__PURE__ */ m(
-      j.div,
+      const _ = requestAnimationFrame(() => d.current = !1);
+      return () => cancelAnimationFrame(_);
+    }, []), /* @__PURE__ */ m(xe, { present: s || u, children: ({ present: _ }) => /* @__PURE__ */ m(
+      L.div,
       {
-        "data-state": l ? "active" : "inactive",
+        "data-state": u ? "active" : "inactive",
         "data-orientation": i.orientation,
         role: "tabpanel",
-        "aria-labelledby": d,
-        hidden: !v,
-        id: u,
+        "aria-labelledby": f,
+        hidden: !_,
+        id: l,
         tabIndex: 0,
         ...c,
         ref: t,
         style: {
           ...e.style,
-          animationDuration: f.current ? "0s" : void 0
+          animationDuration: d.current ? "0s" : void 0
         },
-        children: v && n
+        children: _ && n
       }
     ) });
   }
 );
-je.displayName = De;
-function Le(e, t) {
+Le.displayName = De;
+function je(e, t) {
   return `${e}-trigger-${t}`;
 }
 function Ve(e, t) {
   return `${e}-content-${t}`;
 }
-var Ot = $e, Ft = Pe, Dt = Fe, jt = je;
-function Lt(e) {
+var Ot = $e, Ft = Pe, Dt = Fe, Lt = Le;
+function jt(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
 var re = { exports: {} };
-/*!
-	Copyright (c) 2018 Jed Watson.
-	Licensed under the MIT License (MIT), see
-	http://jedwatson.github.io/classnames
-*/
 var ve;
 function Vt() {
   return ve || (ve = 1, (function(e) {
@@ -757,15 +737,15 @@ function Vt() {
   })(re)), re.exports;
 }
 var Bt = Vt();
-const ue = /* @__PURE__ */ Lt(Bt), Ut = {
+const ue = /* @__PURE__ */ jt(Bt), Ut = {
   "purpur-tab-content": "_purpur-tab-content_1ugbi_1",
   "purpur-tab-content--force-mount": "_purpur-tab-content--force-mount_1ugbi_15"
-}, Gt = ue.bind(Ut), _e = "purpur-tab-content", kt = be(
+}, kt = ue.bind(Ut), _e = "purpur-tab-content", Gt = be(
   ({ children: e, tabId: t, "data-testid": r, className: o, disableForceMount: s, ...n }, c) => /* @__PURE__ */ m(
-    jt,
+    Lt,
     {
       ref: c,
-      className: Gt(_e, o, {
+      className: kt(_e, o, {
         [`${_e}--force-mount`]: !s
       }),
       "data-testid": r,
@@ -775,7 +755,7 @@ const ue = /* @__PURE__ */ Lt(Bt), Ut = {
       children: e
     }
   )
-), Wt = (e) => !!e && ke(e) && !!e.props.name && !!e.props.tabId, Kt = {
+), Wt = (e) => !!e && Ge(e) && !!e.props.name && !!e.props.tabId, Kt = {
   "purpur-tab-header": "_purpur-tab-header_1tc2s_1",
   "purpur-tab-header--contained": "_purpur-tab-header--contained_1tc2s_36",
   "purpur-tab-header--contained-negative": "_purpur-tab-header--contained-negative_1tc2s_36",
@@ -792,7 +772,7 @@ const ue = /* @__PURE__ */ Lt(Bt), Ut = {
     fullWidth: n,
     "data-testid": c,
     children: i
-  }, d) => /* @__PURE__ */ m(
+  }, f) => /* @__PURE__ */ m(
     Dt,
     {
       id: `${t}-trigger`,
@@ -802,12 +782,12 @@ const ue = /* @__PURE__ */ Lt(Bt), Ut = {
       value: t,
       "data-testid": c,
       "data-index": e,
-      ref: d,
+      ref: f,
       onFocus: s,
       children: i
     }
   )
-), Yt = {
+), Ht = {
   "purpur-tabs__wrapper": "_purpur-tabs__wrapper_jv2vl_1",
   "purpur-tabs__scroll-button": "_purpur-tabs__scroll-button_jv2vl_9",
   "purpur-tabs__scroll-button--left": "_purpur-tabs__scroll-button--left_jv2vl_71",
@@ -823,14 +803,13 @@ const ue = /* @__PURE__ */ Lt(Bt), Ut = {
   "purpur-tabs--contained-negative": "_purpur-tabs--contained-negative_jv2vl_123",
   "purpur-tabs__content-container": "_purpur-tabs__content-container_jv2vl_126",
   "purpur-tabs--full-width": "_purpur-tabs--full-width_jv2vl_136"
-}, tn = ["line", "contained"], Zt = (e) => new CustomEvent("tabChangeDetail", { detail: { value: e } }), M = ue.bind(Yt), T = "purpur-tabs", Xt = (e, t) => {
-  var d;
-  if (typeof (e == null ? void 0 : e.getBoundingClientRect) != "function" || typeof (t == null ? void 0 : t.scroll) != "function")
+}, tn = ["line", "contained"], Yt = (e) => new CustomEvent("tabChangeDetail", { detail: { value: e } }), M = ue.bind(Ht), N = "purpur-tabs", Zt = (e, t) => {
+  if (typeof e?.getBoundingClientRect != "function" || typeof t?.scroll != "function")
     return;
-  const r = e.getBoundingClientRect(), o = t.getBoundingClientRect(), s = t.clientWidth, n = parseInt((d = getComputedStyle(t).borderLeftWidth) == null ? void 0 : d.split("px")[0], 10), c = o.left + (isNaN(n) ? 0 : n);
+  const r = e.getBoundingClientRect(), o = t.getBoundingClientRect(), s = t.clientWidth, n = parseInt(getComputedStyle(t).borderLeftWidth?.split("px")[0], 10), c = o.left + (isNaN(n) ? 0 : n);
   let i;
   r.right > o.right && (i = r.left + t.scrollLeft, i = i + r.width - s + s * 0.1, i = i - c), r.left < o.left && (i = r.left + t.scrollLeft, i = i - s * 0.1, i = i - c), i !== void 0 && t.scroll({ left: i, behavior: "smooth" });
-}, Ht = ({
+}, Xt = ({
   children: e,
   variant: t = "line",
   negative: r = !1,
@@ -839,112 +818,112 @@ const ue = /* @__PURE__ */ Lt(Bt), Ut = {
   className: n,
   defaultValue: c,
   animateHeight: i = !1,
-  "data-testid": d,
-  value: u,
-  ...l
+  "data-testid": f,
+  value: l,
+  ...u
 }) => {
-  const f = te(null), [v, g] = B(-1), [I, h] = B({}), [_, C] = B(0), [N, w] = B(0), b = z.toArray(e).filter(Wt), R = te(null), x = te(new Array(b.length)), P = 200, y = t === "line", Q = M(
-    T,
-    `${T}--${t}${r ? "-negative" : ""}`,
-    { [`${T}--full-width`]: o },
+  const d = te(null), [_, g] = B(-1), [I, C] = B({}), [v, y] = B(0), [R, h] = B(0), b = z.toArray(e).filter(Wt), T = te(null), E = te(new Array(b.length)), P = 200, S = t === "line", Q = M(
+    N,
+    `${N}--${t}${r ? "-negative" : ""}`,
+    { [`${N}--full-width`]: o },
     n
-  ), F = z.map(b, ({ props: { tabId: p } }) => p), L = () => {
-    const p = F.findIndex((S) => S === c);
+  ), F = z.map(b, ({ props: { tabId: p } }) => p), j = () => {
+    const p = F.findIndex((w) => w === c);
     return p >= 0 ? p : 0;
   };
-  Y(() => {
-    u && G(b.findIndex((p) => p.props.tabId === u));
-  }, [b, u]);
-  const [V, G] = B(L);
+  H(() => {
+    l && k(b.findIndex((p) => p.props.tabId === l));
+  }, [b, l]);
+  const [V, k] = B(j);
   if (new Set(F).size !== F.length)
     throw new Error("tabId must be unique");
-  const k = (p, S) => S || d ? `${S || d}-${p}` : void 0, W = () => {
-    if (!y)
+  const G = (p, w) => w || f ? `${w || f}-${p}` : void 0, W = () => {
+    if (!S)
       return;
-    const p = x.current[V];
-    C((p == null ? void 0 : p.offsetLeft) || 0), w((p == null ? void 0 : p.getBoundingClientRect().width) || 0);
-  }, E = (p) => {
-    y && !u && G(b.findIndex((S) => S.props.tabId === p)), s == null || s(Zt(p));
+    const p = E.current[V];
+    y(p?.offsetLeft || 0), h(p?.getBoundingClientRect().width || 0);
+  }, x = (p) => {
+    S && !l && k(b.findIndex((w) => w.props.tabId === p)), s?.(Yt(p));
   }, Be = (p) => {
-    if (R != null && R.current) {
-      const { scrollLeft: S } = R.current, $ = p === "left" ? -P : P;
-      R.current.scroll({ left: S + $, behavior: "smooth" });
+    if (T?.current) {
+      const { scrollLeft: w } = T.current, $ = p === "left" ? -P : P;
+      T.current.scroll({ left: w + $, behavior: "smooth" });
     }
   }, le = ({ side: p }) => /* @__PURE__ */ m(
     "button",
     {
-      className: M(`${T}__scroll-button`, `${T}__scroll-button--${p}`),
+      className: M(`${N}__scroll-button`, `${N}__scroll-button--${p}`),
       onClick: () => Be(p),
       type: "button",
       "aria-hidden": "true",
       tabIndex: -1,
-      "data-testid": k("scroll-button"),
+      "data-testid": G("scroll-button"),
       children: /* @__PURE__ */ m(ge, { svg: p === "left" ? et : tt, size: "md" })
     }
   );
-  return Y(() => {
+  return H(() => {
     const p = () => {
-      if (f.current && i) {
-        const $ = f.current.offsetHeight;
+      if (d.current && i) {
+        const $ = d.current.offsetHeight;
         g($);
       }
-    }, S = () => {
+    }, w = () => {
       p(), W();
     };
-    return p(), window.addEventListener("resize", S), () => {
-      window.removeEventListener("resize", S);
+    return p(), window.addEventListener("resize", w), () => {
+      window.removeEventListener("resize", w);
     };
-  }, [V, i]), Y(() => {
+  }, [V, i]), H(() => {
     W();
-  }, [V, o, b.length, t]), Y(() => {
-    const p = R.current;
+  }, [V, o, b.length, t]), H(() => {
+    const p = T.current;
     if (!p) return;
-    const S = () => {
-      const { scrollLeft: $, scrollWidth: K, clientWidth: q } = p, D = K > q, Ue = $ <= 1, Ge = $ + q >= K - 1;
+    const w = () => {
+      const { scrollLeft: $, scrollWidth: K, clientWidth: q } = p, D = K > q, Ue = $ <= 1, ke = $ + q >= K - 1;
       if (!D) {
-        h({});
+        C({});
         return;
       }
-      h({
-        [`${T}__wrapper--scroll-start`]: !Ue,
-        [`${T}__wrapper--scroll-end`]: !Ge
+      C({
+        [`${N}__wrapper--scroll-start`]: !Ue,
+        [`${N}__wrapper--scroll-end`]: !ke
       });
     };
-    return S(), p.addEventListener("scroll", S, { passive: !0 }), window.addEventListener("resize", S), () => {
-      p.removeEventListener("scroll", S), window.removeEventListener("resize", S);
+    return w(), p.addEventListener("scroll", w, { passive: !0 }), window.addEventListener("resize", w), () => {
+      p.removeEventListener("scroll", w), window.removeEventListener("resize", w);
     };
   }, []), /* @__PURE__ */ m(
     Ot,
     {
       defaultValue: c ?? b[0].props.tabId,
-      onValueChange: E,
-      "data-testid": d,
+      onValueChange: x,
+      "data-testid": f,
       className: Q,
-      value: u,
-      ...l,
-      children: /* @__PURE__ */ ee("div", { className: M(`${T}__container`), children: [
-        /* @__PURE__ */ ee("div", { className: M(`${T}__wrapper`, I), children: [
+      value: l,
+      ...u,
+      children: /* @__PURE__ */ ee("div", { className: M(`${N}__container`), children: [
+        /* @__PURE__ */ ee("div", { className: M(`${N}__wrapper`, I), children: [
           /* @__PURE__ */ ee(
             Ft,
             {
               ref: (p) => {
-                R.current = p;
+                T.current = p;
               },
-              className: M(`${T}__list`),
+              className: M(`${N}__list`),
               children: [
-                z.map(b, (p, S) => {
+                z.map(b, (p, w) => {
                   const { name: $, tabId: K, "data-testid": q } = p.props;
                   return /* @__PURE__ */ m(
                     zt,
                     {
-                      "data-testid": k("header", q),
-                      index: S,
+                      "data-testid": G("header", q),
+                      index: w,
                       tabId: K,
                       ref: (D) => {
-                        D && (x.current[S] = D);
+                        D && (E.current[w] = D);
                       },
                       onFocus: (D) => {
-                        Xt(D.target, R.current);
+                        Zt(D.target, T.current);
                       },
                       variant: t,
                       negative: r,
@@ -953,15 +932,15 @@ const ue = /* @__PURE__ */ Lt(Bt), Ut = {
                     }
                   );
                 }),
-                y && /* @__PURE__ */ m(
+                S && /* @__PURE__ */ m(
                   "div",
                   {
-                    className: M(`${T}__selected-border`),
+                    className: M(`${N}__selected-border`),
                     style: {
-                      width: N,
-                      transform: `translateX(${_}px)`
+                      width: R,
+                      transform: `translateX(${v}px)`
                     },
-                    "data-testid": k("selected-border")
+                    "data-testid": G("selected-border")
                   }
                 )
               ]
@@ -973,19 +952,19 @@ const ue = /* @__PURE__ */ Lt(Bt), Ut = {
         /* @__PURE__ */ m(
           "div",
           {
-            className: i ? M(`${T}__content-wrapper`) : "",
-            style: { height: i && v > -1 ? `${v}px` : "auto" },
-            children: /* @__PURE__ */ m("div", { ref: f, className: M(`${T}__content-container`), children: z.map(b, (p) => p) })
+            className: i ? M(`${N}__content-wrapper`) : "",
+            style: { height: i && _ > -1 ? `${_}px` : "auto" },
+            children: /* @__PURE__ */ m("div", { ref: d, className: M(`${N}__content-container`), children: z.map(b, (p) => p) })
           }
         )
       ] })
     }
   );
 };
-Ht.Content = kt;
+Xt.Content = Gt;
 export {
-  Ht as Tabs,
-  Zt as createTabChangeDetailEvent,
+  Xt as Tabs,
+  Yt as createTabChangeDetailEvent,
   tn as tabsVariants
 };
 //# sourceMappingURL=tabs.es.js.map