@purpurds/tabs 7.1.0 → 7.3.0

package/dist/tabs.es.js

@@ -1,6 +1,6 @@
-import { jsx as m, Fragment as ze, jsxs as J } from "react/jsx-runtime";
+import { jsx as m, Fragment as qe, jsxs as J } from "react/jsx-runtime";
 import * as a from "react";
-import F, { forwardRef as ye, isValidElement as Ye, useRef as Q, useState as B, Children as k, useEffect as K } from "react";
+import O, { forwardRef as we, isValidElement as Ye, useRef as Q, useState as B, Children as z, useEffect as K } from "react";
 import "react-dom";
 function Ze(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
@@ -53,7 +53,7 @@ const Je = /* @__PURE__ */ Ze(Xe), Qe = {
   "purpur-icon--md": "_purpur-icon--md_8u1lq_16",
   "purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
   "purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
-}, et = Je.bind(Qe), ge = "purpur-icon", tt = "md", nt = (e) => e.filter((t) => Object.keys(t).length >= 1).map((t) => `${t.name}="${t.value}"`).join(" "), rt = ({ content: e = "", title: t } = {}) => {
+}, et = Je.bind(Qe), _e = "purpur-icon", tt = "md", nt = (e) => e.filter((t) => Object.keys(t).length >= 1).map((t) => `${t.name}="${t.value}"`).join(" "), rt = ({ content: e = "", title: t } = {}) => {
   const n = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
@@ -61,7 +61,7 @@ const Je = /* @__PURE__ */ Ze(Xe), Qe = {
     t ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
   ], o = t ? `<title>${t}</title>` : "";
   return `<svg ${nt(n)}>${o}${e}</svg>`;
-}, ot = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), we = ({
+}, ot = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), Ce = ({
   ["data-testid"]: e,
   svg: t,
   allyTitle: n,
@@ -72,7 +72,7 @@ const Je = /* @__PURE__ */ Ze(Xe), Qe = {
   const i = rt({
     content: ot(t.svg),
     title: n
-  }), c = et(o, ge, `${ge}--${s}`);
+  }), c = et(o, _e, `${_e}--${s}`);
   return /* @__PURE__ */ m(
     "span",
     {
@@ -83,7 +83,7 @@ const Je = /* @__PURE__ */ Ze(Xe), Qe = {
     }
   );
 };
-we.displayName = "Icon";
+Ce.displayName = "Icon";
 const st = {
   name: "chevron-left",
   svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M16.175 3.905a.9.9 0 0 1-.08 1.27L8.36 12l7.736 6.825a.9.9 0 0 1-1.191 1.35l-8.5-7.5a.9.9 0 0 1 0-1.35l8.5-7.5a.9.9 0 0 1 1.27.08Z" clip-rule="evenodd"/></svg>',
@@ -108,18 +108,18 @@ function se(e, t = []) {
     n = [...n, i];
     const u = (d) => {
       var h;
-      const { scope: _, children: v, ...f } = d, b = ((h = _ == null ? void 0 : _[e]) == null ? void 0 : h[l]) || c, C = a.useMemo(() => f, Object.values(f));
-      return /* @__PURE__ */ m(b.Provider, { value: C, children: v });
+      const { scope: v, children: b, ...f } = d, g = ((h = v == null ? void 0 : v[e]) == null ? void 0 : h[l]) || c, y = a.useMemo(() => f, Object.values(f));
+      return /* @__PURE__ */ m(g.Provider, { value: y, children: b });
     };
     u.displayName = r + "Provider";
-    function g(d, _) {
-      var b;
-      const v = ((b = _ == null ? void 0 : _[e]) == null ? void 0 : b[l]) || c, f = a.useContext(v);
+    function _(d, v) {
+      var g;
+      const b = ((g = v == null ? void 0 : v[e]) == null ? void 0 : g[l]) || c, f = a.useContext(b);
       if (f) return f;
       if (i !== void 0) return i;
       throw new Error(`\`${d}\` must be used within \`${r}\``);
     }
-    return [u, g];
+    return [u, _];
   }
   const s = () => {
     const r = n.map((i) => a.createContext(i));
@@ -151,29 +151,29 @@ function ct(...e) {
   };
   return n.scopeName = t.scopeName, n;
 }
-function _e(e, t) {
+function ve(e, t) {
   if (typeof e == "function")
     return e(t);
   e != null && (e.current = t);
 }
-function Ce(...e) {
+function ye(...e) {
   return (t) => {
     let n = !1;
     const o = e.map((s) => {
-      const r = _e(s, t);
+      const r = ve(s, t);
       return !n && typeof r == "function" && (n = !0), r;
     });
     if (n)
       return () => {
         for (let s = 0; s < o.length; s++) {
           const r = o[s];
-          typeof r == "function" ? r() : _e(e[s], null);
+          typeof r == "function" ? r() : ve(e[s], null);
         }
       };
   };
 }
 function Y(...e) {
-  return a.useCallback(Ce(...e), e);
+  return a.useCallback(ye(...e), e);
 }
 var Z = a.forwardRef((e, t) => {
   const { children: n, ...o } = e, s = a.Children.toArray(n), r = s.find(ut);
@@ -188,12 +188,12 @@ var ne = a.forwardRef((e, t) => {
   const { children: n, ...o } = e;
   if (a.isValidElement(n)) {
     const s = dt(n), r = lt(o, n.props);
-    return n.type !== a.Fragment && (r.ref = t ? Ce(t, s) : s), a.cloneElement(n, r);
+    return n.type !== a.Fragment && (r.ref = t ? ye(t, s) : s), a.cloneElement(n, r);
   }
   return a.Children.count(n) > 1 ? a.Children.only(null) : null;
 });
 ne.displayName = "SlotClone";
-var at = ({ children: e }) => /* @__PURE__ */ m(ze, { children: e });
+var at = ({ children: e }) => /* @__PURE__ */ m(qe, { children: e });
 function ut(e) {
   return a.isValidElement(e) && e.type === at;
 }
@@ -216,39 +216,39 @@ function ft(e) {
   const t = e + "CollectionProvider", [n, o] = se(t), [s, r] = n(
     t,
     { collectionRef: { current: null }, itemMap: /* @__PURE__ */ new Map() }
-  ), i = (v) => {
-    const { scope: f, children: b } = v, C = F.useRef(null), h = F.useRef(/* @__PURE__ */ new Map()).current;
-    return /* @__PURE__ */ m(s, { scope: f, itemMap: h, collectionRef: C, children: b });
+  ), i = (b) => {
+    const { scope: f, children: g } = b, y = O.useRef(null), h = O.useRef(/* @__PURE__ */ new Map()).current;
+    return /* @__PURE__ */ m(s, { scope: f, itemMap: h, collectionRef: y, children: g });
   };
   i.displayName = t;
-  const c = e + "CollectionSlot", l = F.forwardRef(
-    (v, f) => {
-      const { scope: b, children: C } = v, h = r(c, b), y = Y(f, h.collectionRef);
-      return /* @__PURE__ */ m(Z, { ref: y, children: C });
+  const c = e + "CollectionSlot", l = O.forwardRef(
+    (b, f) => {
+      const { scope: g, children: y } = b, h = r(c, g), w = Y(f, h.collectionRef);
+      return /* @__PURE__ */ m(Z, { ref: w, children: y });
     }
   );
   l.displayName = c;
-  const u = e + "CollectionItemSlot", g = "data-radix-collection-item", d = F.forwardRef(
-    (v, f) => {
-      const { scope: b, children: C, ...h } = v, y = F.useRef(null), M = Y(f, y), w = r(u, b);
-      return F.useEffect(() => (w.itemMap.set(y, { ref: y, ...h }), () => void w.itemMap.delete(y))), /* @__PURE__ */ m(Z, { [g]: "", ref: M, children: C });
+  const u = e + "CollectionItemSlot", _ = "data-radix-collection-item", d = O.forwardRef(
+    (b, f) => {
+      const { scope: g, children: y, ...h } = b, w = O.useRef(null), j = Y(f, w), C = r(u, g);
+      return O.useEffect(() => (C.itemMap.set(w, { ref: w, ...h }), () => void C.itemMap.delete(w))), /* @__PURE__ */ m(Z, { [_]: "", ref: j, children: y });
     }
   );
   d.displayName = u;
-  function _(v) {
-    const f = r(e + "CollectionConsumer", v);
-    return F.useCallback(() => {
-      const C = f.collectionRef.current;
-      if (!C) return [];
-      const h = Array.from(C.querySelectorAll(`[${g}]`));
+  function v(b) {
+    const f = r(e + "CollectionConsumer", b);
+    return O.useCallback(() => {
+      const y = f.collectionRef.current;
+      if (!y) return [];
+      const h = Array.from(y.querySelectorAll(`[${_}]`));
       return Array.from(f.itemMap.values()).sort(
-        (w, N) => h.indexOf(w.ref.current) - h.indexOf(N.ref.current)
+        (C, N) => h.indexOf(C.ref.current) - h.indexOf(N.ref.current)
       );
     }, [f.collectionRef, f.itemMap]);
   }
   return [
     { Provider: i, Slot: l, ItemSlot: d },
-    _,
+    v,
     o
   ];
 }
@@ -261,7 +261,7 @@ function Ie(e) {
     n((o) => o ?? String(mt++));
   }, [e]), t ? `radix-${t}` : "";
 }
-var gt = [
+var _t = [
   "a",
   "button",
   "div",
@@ -278,7 +278,7 @@ var gt = [
   "span",
   "svg",
   "ul"
-], D = gt.reduce((e, t) => {
+], $ = _t.reduce((e, t) => {
   const n = a.forwardRef((o, s) => {
     const { asChild: r, ...i } = o, c = r ? Z : t;
     return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ m(c, { ...i, ref: s });
@@ -300,7 +300,7 @@ function Se({
   onChange: n = () => {
   }
 }) {
-  const [o, s] = _t({ defaultProp: t, onChange: n }), r = e !== void 0, i = r ? e : o, c = ie(n), l = a.useCallback(
+  const [o, s] = vt({ defaultProp: t, onChange: n }), r = e !== void 0, i = r ? e : o, c = ie(n), l = a.useCallback(
     (u) => {
       if (r) {
         const d = typeof u == "function" ? u(e) : u;
@@ -312,7 +312,7 @@ function Se({
   );
   return [i, l];
 }
-function _t({
+function vt({
   defaultProp: e,
   onChange: t
 }) {
@@ -321,15 +321,15 @@ function _t({
     s.current !== o && (r(o), s.current = o);
   }, [o, s, r]), n;
 }
-var vt = a.createContext(void 0);
+var bt = a.createContext(void 0);
 function Ne(e) {
-  const t = a.useContext(vt);
+  const t = a.useContext(bt);
   return e || t || "ltr";
 }
-var ee = "rovingFocusGroup.onEntryFocus", bt = { bubbles: !1, cancelable: !0 }, H = "RovingFocusGroup", [oe, Re, ht] = ft(H), [yt, Te] = se(
+var ee = "rovingFocusGroup.onEntryFocus", gt = { bubbles: !1, cancelable: !0 }, H = "RovingFocusGroup", [oe, Re, ht] = ft(H), [wt, Te] = se(
   H,
   [ht]
-), [wt, Ct] = yt(H), xe = a.forwardRef(
+), [Ct, yt] = wt(H), xe = a.forwardRef(
   (e, t) => /* @__PURE__ */ m(oe.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(oe.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(It, { ...e, ref: t }) }) })
 );
 xe.displayName = H;
@@ -343,30 +343,30 @@ var It = a.forwardRef((e, t) => {
     defaultCurrentTabStopId: c,
     onCurrentTabStopIdChange: l,
     onEntryFocus: u,
-    preventScrollOnEntryFocus: g = !1,
+    preventScrollOnEntryFocus: _ = !1,
     ...d
-  } = e, _ = a.useRef(null), v = Y(t, _), f = Ne(r), [b = null, C] = Se({
+  } = e, v = a.useRef(null), b = Y(t, v), f = Ne(r), [g = null, y] = Se({
     prop: i,
     defaultProp: c,
     onChange: l
-  }), [h, y] = a.useState(!1), M = ie(u), w = Re(n), N = a.useRef(!1), [q, U] = a.useState(0);
+  }), [h, w] = a.useState(!1), j = ie(u), C = Re(n), N = a.useRef(!1), [D, U] = a.useState(0);
   return a.useEffect(() => {
-    const I = _.current;
+    const I = v.current;
     if (I)
-      return I.addEventListener(ee, M), () => I.removeEventListener(ee, M);
-  }, [M]), /* @__PURE__ */ m(
-    wt,
+      return I.addEventListener(ee, j), () => I.removeEventListener(ee, j);
+  }, [j]), /* @__PURE__ */ m(
+    Ct,
     {
       scope: n,
       orientation: o,
       dir: f,
       loop: s,
-      currentTabStopId: b,
+      currentTabStopId: g,
       onItemFocus: a.useCallback(
-        (I) => C(I),
-        [C]
+        (I) => y(I),
+        [y]
       ),
-      onItemShiftTab: a.useCallback(() => y(!0), []),
+      onItemShiftTab: a.useCallback(() => w(!0), []),
       onFocusableItemAdd: a.useCallback(
         () => U((I) => I + 1),
         []
@@ -376,12 +376,12 @@ var It = a.forwardRef((e, t) => {
         []
       ),
       children: /* @__PURE__ */ m(
-        D.div,
+        $.div,
         {
-          tabIndex: h || q === 0 ? -1 : 0,
+          tabIndex: h || D === 0 ? -1 : 0,
           "data-orientation": o,
           ...d,
-          ref: v,
+          ref: b,
           style: { outline: "none", ...e.style },
           onMouseDown: A(e.onMouseDown, () => {
             N.current = !0;
@@ -389,17 +389,17 @@ var It = a.forwardRef((e, t) => {
           onFocus: A(e.onFocus, (I) => {
             const X = !N.current;
             if (I.target === I.currentTarget && X && !h) {
-              const $ = new CustomEvent(ee, bt);
-              if (I.currentTarget.dispatchEvent($), !$.defaultPrevented) {
-                const L = w().filter((x) => x.focusable), V = L.find((x) => x.active), j = L.find((x) => x.id === b), W = [V, j, ...L].filter(
+              const F = new CustomEvent(ee, gt);
+              if (I.currentTarget.dispatchEvent(F), !F.defaultPrevented) {
+                const L = C().filter((x) => x.focusable), V = L.find((x) => x.active), G = L.find((x) => x.id === g), k = [V, G, ...L].filter(
                   Boolean
                 ).map((x) => x.ref.current);
-                Me(W, g);
+                je(k, _);
               }
             }
             N.current = !1;
           }),
-          onBlur: A(e.onBlur, () => y(!1))
+          onBlur: A(e.onBlur, () => w(!1))
         }
       )
     }
@@ -412,11 +412,11 @@ var It = a.forwardRef((e, t) => {
       active: s = !1,
       tabStopId: r,
       ...i
-    } = e, c = Ie(), l = r || c, u = Ct(Ee, n), g = u.currentTabStopId === l, d = Re(n), { onFocusableItemAdd: _, onFocusableItemRemove: v } = u;
+    } = e, c = Ie(), l = r || c, u = yt(Ee, n), _ = u.currentTabStopId === l, d = Re(n), { onFocusableItemAdd: v, onFocusableItemRemove: b } = u;
     return a.useEffect(() => {
       if (o)
-        return _(), () => v();
-    }, [o, _, v]), /* @__PURE__ */ m(
+        return v(), () => b();
+    }, [o, v, b]), /* @__PURE__ */ m(
       oe.ItemSlot,
       {
         scope: n,
@@ -424,9 +424,9 @@ var It = a.forwardRef((e, t) => {
         focusable: o,
         active: s,
         children: /* @__PURE__ */ m(
-          D.span,
+          $.span,
           {
-            tabIndex: g ? 0 : -1,
+            tabIndex: _ ? 0 : -1,
             "data-orientation": u.orientation,
             ...i,
             ref: t,
@@ -440,18 +440,18 @@ var It = a.forwardRef((e, t) => {
                 return;
               }
               if (f.target !== f.currentTarget) return;
-              const b = Rt(f, u.orientation, u.dir);
-              if (b !== void 0) {
+              const g = Rt(f, u.orientation, u.dir);
+              if (g !== void 0) {
                 if (f.metaKey || f.ctrlKey || f.altKey || f.shiftKey) return;
                 f.preventDefault();
-                let h = d().filter((y) => y.focusable).map((y) => y.ref.current);
-                if (b === "last") h.reverse();
-                else if (b === "prev" || b === "next") {
-                  b === "prev" && h.reverse();
-                  const y = h.indexOf(f.currentTarget);
-                  h = u.loop ? Tt(h, y + 1) : h.slice(y + 1);
+                let h = d().filter((w) => w.focusable).map((w) => w.ref.current);
+                if (g === "last") h.reverse();
+                else if (g === "prev" || g === "next") {
+                  g === "prev" && h.reverse();
+                  const w = h.indexOf(f.currentTarget);
+                  h = u.loop ? Tt(h, w + 1) : h.slice(w + 1);
                 }
-                setTimeout(() => Me(h));
+                setTimeout(() => je(h));
               }
             })
           }
@@ -479,7 +479,7 @@ function Rt(e, t, n) {
   if (!(t === "vertical" && ["ArrowLeft", "ArrowRight"].includes(o)) && !(t === "horizontal" && ["ArrowUp", "ArrowDown"].includes(o)))
     return St[o];
 }
-function Me(e, t = !1) {
+function je(e, t = !1) {
   const n = document.activeElement;
   for (const o of e)
     if (o === n || (o.focus({ preventScroll: t }), document.activeElement !== n)) return;
@@ -491,12 +491,12 @@ var xt = xe, Et = Ae;
 function At(e, t) {
   return a.useReducer((n, o) => t[n][o] ?? n, e);
 }
-var Pe = (e) => {
-  const { present: t, children: n } = e, o = Mt(t), s = typeof n == "function" ? n({ present: o.isPresent }) : a.Children.only(n), r = Y(o.ref, Pt(s));
+var Me = (e) => {
+  const { present: t, children: n } = e, o = jt(t), s = typeof n == "function" ? n({ present: o.isPresent }) : a.Children.only(n), r = Y(o.ref, Mt(s));
   return typeof n == "function" || o.isPresent ? a.cloneElement(s, { ref: r }) : null;
 };
-Pe.displayName = "Presence";
-function Mt(e) {
+Me.displayName = "Presence";
+function jt(e) {
   const [t, n] = a.useState(), o = a.useRef({}), s = a.useRef(e), r = a.useRef("none"), i = e ? "mounted" : "unmounted", [c, l] = At(i, {
     mounted: {
       UNMOUNT: "unmounted",
@@ -511,30 +511,30 @@ function Mt(e) {
     }
   });
   return a.useEffect(() => {
-    const u = z(o.current);
+    const u = q(o.current);
     r.current = c === "mounted" ? u : "none";
   }, [c]), re(() => {
-    const u = o.current, g = s.current;
-    if (g !== e) {
-      const _ = r.current, v = z(u);
-      e ? l("MOUNT") : v === "none" || (u == null ? void 0 : u.display) === "none" ? l("UNMOUNT") : l(g && _ !== v ? "ANIMATION_OUT" : "UNMOUNT"), s.current = e;
+    const u = o.current, _ = s.current;
+    if (_ !== e) {
+      const v = r.current, b = q(u);
+      e ? l("MOUNT") : b === "none" || (u == null ? void 0 : u.display) === "none" ? l("UNMOUNT") : l(_ && v !== b ? "ANIMATION_OUT" : "UNMOUNT"), s.current = e;
     }
   }, [e, l]), re(() => {
     if (t) {
       let u;
-      const g = t.ownerDocument.defaultView ?? window, d = (v) => {
-        const b = z(o.current).includes(v.animationName);
-        if (v.target === t && b && (l("ANIMATION_END"), !s.current)) {
-          const C = t.style.animationFillMode;
-          t.style.animationFillMode = "forwards", u = g.setTimeout(() => {
-            t.style.animationFillMode === "forwards" && (t.style.animationFillMode = C);
+      const _ = t.ownerDocument.defaultView ?? window, d = (b) => {
+        const g = q(o.current).includes(b.animationName);
+        if (b.target === t && g && (l("ANIMATION_END"), !s.current)) {
+          const y = t.style.animationFillMode;
+          t.style.animationFillMode = "forwards", u = _.setTimeout(() => {
+            t.style.animationFillMode === "forwards" && (t.style.animationFillMode = y);
           });
         }
-      }, _ = (v) => {
-        v.target === t && (r.current = z(o.current));
+      }, v = (b) => {
+        b.target === t && (r.current = q(o.current));
       };
-      return t.addEventListener("animationstart", _), t.addEventListener("animationcancel", d), t.addEventListener("animationend", d), () => {
-        g.clearTimeout(u), t.removeEventListener("animationstart", _), t.removeEventListener("animationcancel", d), t.removeEventListener("animationend", d);
+      return t.addEventListener("animationstart", v), t.addEventListener("animationcancel", d), t.addEventListener("animationend", d), () => {
+        _.clearTimeout(u), t.removeEventListener("animationstart", v), t.removeEventListener("animationcancel", d), t.removeEventListener("animationend", d);
       };
     } else
       l("ANIMATION_END");
@@ -545,17 +545,17 @@ function Mt(e) {
     }, [])
   };
 }
-function z(e) {
+function q(e) {
   return (e == null ? void 0 : e.animationName) || "none";
 }
-function Pt(e) {
+function Mt(e) {
   var o, s;
   let t = (o = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : o.get, n = t && "isReactWarning" in t && t.isReactWarning;
   return n ? e.ref : (t = (s = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : s.get, n = t && "isReactWarning" in t && t.isReactWarning, n ? e.props.ref : e.props.ref || e.ref);
 }
-var ce = "Tabs", [Ot, nn] = se(ce, [
+var ce = "Tabs", [Pt, nn] = se(ce, [
   Te
-]), Oe = Te(), [Ft, ae] = Ot(ce), Fe = a.forwardRef(
+]), Pe = Te(), [Ot, ae] = Pt(ce), Oe = a.forwardRef(
   (e, t) => {
     const {
       __scopeTabs: n,
@@ -566,25 +566,25 @@ var ce = "Tabs", [Ot, nn] = se(ce, [
       dir: c,
       activationMode: l = "automatic",
       ...u
-    } = e, g = Ne(c), [d, _] = Se({
+    } = e, _ = Ne(c), [d, v] = Se({
       prop: o,
       onChange: s,
       defaultProp: r
     });
     return /* @__PURE__ */ m(
-      Ft,
+      Ot,
       {
         scope: n,
         baseId: Ie(),
         value: d,
-        onValueChange: _,
+        onValueChange: v,
         orientation: i,
-        dir: g,
+        dir: _,
         activationMode: l,
         children: /* @__PURE__ */ m(
-          D.div,
+          $.div,
           {
-            dir: g,
+            dir: _,
             "data-orientation": i,
             ...u,
             ref: t
@@ -594,10 +594,10 @@ var ce = "Tabs", [Ot, nn] = se(ce, [
     );
   }
 );
-Fe.displayName = ce;
-var $e = "TabsList", De = a.forwardRef(
+Oe.displayName = ce;
+var Fe = "TabsList", $e = a.forwardRef(
   (e, t) => {
-    const { __scopeTabs: n, loop: o = !0, ...s } = e, r = ae($e, n), i = Oe(n);
+    const { __scopeTabs: n, loop: o = !0, ...s } = e, r = ae(Fe, n), i = Pe(n);
     return /* @__PURE__ */ m(
       xt,
       {
@@ -607,7 +607,7 @@ var $e = "TabsList", De = a.forwardRef(
         dir: r.dir,
         loop: o,
         children: /* @__PURE__ */ m(
-          D.div,
+          $.div,
           {
             role: "tablist",
             "aria-orientation": r.orientation,
@@ -619,25 +619,25 @@ var $e = "TabsList", De = a.forwardRef(
     );
   }
 );
-De.displayName = $e;
-var qe = "TabsTrigger", Le = a.forwardRef(
+$e.displayName = Fe;
+var De = "TabsTrigger", Le = a.forwardRef(
   (e, t) => {
-    const { __scopeTabs: n, value: o, disabled: s = !1, ...r } = e, i = ae(qe, n), c = Oe(n), l = Ue(i.baseId, o), u = je(i.baseId, o), g = o === i.value;
+    const { __scopeTabs: n, value: o, disabled: s = !1, ...r } = e, i = ae(De, n), c = Pe(n), l = Ue(i.baseId, o), u = Ge(i.baseId, o), _ = o === i.value;
     return /* @__PURE__ */ m(
       Et,
       {
         asChild: !0,
         ...c,
         focusable: !s,
-        active: g,
+        active: _,
         children: /* @__PURE__ */ m(
-          D.button,
+          $.button,
           {
             type: "button",
             role: "tab",
-            "aria-selected": g,
+            "aria-selected": _,
             "aria-controls": u,
-            "data-state": g ? "active" : "inactive",
+            "data-state": _ ? "active" : "inactive",
             "data-disabled": s ? "" : void 0,
             disabled: s,
             id: l,
@@ -651,7 +651,7 @@ var qe = "TabsTrigger", Le = a.forwardRef(
             }),
             onFocus: A(e.onFocus, () => {
               const d = i.activationMode !== "manual";
-              !g && !s && d && i.onValueChange(o);
+              !_ && !s && d && i.onValueChange(o);
             })
           }
         )
@@ -659,21 +659,21 @@ var qe = "TabsTrigger", Le = a.forwardRef(
     );
   }
 );
-Le.displayName = qe;
+Le.displayName = De;
 var Ve = "TabsContent", Be = a.forwardRef(
   (e, t) => {
-    const { __scopeTabs: n, value: o, forceMount: s, children: r, ...i } = e, c = ae(Ve, n), l = Ue(c.baseId, o), u = je(c.baseId, o), g = o === c.value, d = a.useRef(g);
+    const { __scopeTabs: n, value: o, forceMount: s, children: r, ...i } = e, c = ae(Ve, n), l = Ue(c.baseId, o), u = Ge(c.baseId, o), _ = o === c.value, d = a.useRef(_);
     return a.useEffect(() => {
-      const _ = requestAnimationFrame(() => d.current = !1);
-      return () => cancelAnimationFrame(_);
-    }, []), /* @__PURE__ */ m(Pe, { present: s || g, children: ({ present: _ }) => /* @__PURE__ */ m(
-      D.div,
+      const v = requestAnimationFrame(() => d.current = !1);
+      return () => cancelAnimationFrame(v);
+    }, []), /* @__PURE__ */ m(Me, { present: s || _, children: ({ present: v }) => /* @__PURE__ */ m(
+      $.div,
       {
-        "data-state": g ? "active" : "inactive",
+        "data-state": _ ? "active" : "inactive",
         "data-orientation": c.orientation,
         role: "tabpanel",
         "aria-labelledby": l,
-        hidden: !_,
+        hidden: !v,
         id: u,
         tabIndex: 0,
         ...i,
@@ -682,7 +682,7 @@ var Ve = "TabsContent", Be = a.forwardRef(
           ...e.style,
           animationDuration: d.current ? "0s" : void 0
         },
-        children: _ && r
+        children: v && r
       }
     ) });
   }
@@ -691,10 +691,10 @@ Be.displayName = Ve;
 function Ue(e, t) {
   return `${e}-trigger-${t}`;
 }
-function je(e, t) {
+function Ge(e, t) {
   return `${e}-content-${t}`;
 }
-var $t = Fe, Dt = De, qt = Le, Lt = Be;
+var Ft = Oe, $t = $e, Dt = Le, Lt = Be;
 function Vt(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
@@ -704,9 +704,9 @@ var te = { exports: {} };
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
 */
-var ve;
+var be;
 function Bt() {
-  return ve || (ve = 1, function(e) {
+  return be || (be = 1, function(e) {
     (function() {
       var t = {}.hasOwnProperty;
       function n() {
@@ -738,10 +738,10 @@ function Bt() {
   }(te)), te.exports;
 }
 var Ut = Bt();
-const ue = /* @__PURE__ */ Vt(Ut), jt = {
+const ue = /* @__PURE__ */ Vt(Ut), Gt = {
   "purpur-tab-content": "_purpur-tab-content_1ugbi_1",
   "purpur-tab-content--force-mount": "_purpur-tab-content--force-mount_1ugbi_15"
-}, Gt = ue.bind(jt), be = "purpur-tab-content", Wt = ye(
+}, Wt = ue.bind(Gt), ge = "purpur-tab-content", kt = we(
   ({
     children: e,
     tabId: t,
@@ -753,10 +753,10 @@ const ue = /* @__PURE__ */ Vt(Ut), jt = {
     Lt,
     {
       ref: i,
-      className: Gt([
-        be,
+      className: Wt([
+        ge,
         o,
-        { [`${be}--force-mount`]: !s }
+        { [`${ge}--force-mount`]: !s }
       ]),
       "data-testid": n,
       value: t,
@@ -765,13 +765,13 @@ const ue = /* @__PURE__ */ Vt(Ut), jt = {
       children: e
     }
   )
-), kt = (e) => !!e && Ye(e) && !!e.props.name && !!e.props.tabId, Kt = {
-  "purpur-tab-header": "_purpur-tab-header_18g3c_1",
-  "purpur-tab-header--contained": "_purpur-tab-header--contained_18g3c_33",
-  "purpur-tab-header--contained-negative": "_purpur-tab-header--contained-negative_18g3c_33",
-  "purpur-tab-header--line": "_purpur-tab-header--line_18g3c_36",
-  "purpur-tab-header--line-negative": "_purpur-tab-header--line-negative_18g3c_48"
-}, zt = ue.bind(Kt), he = "purpur-tab-header", Yt = ye(
+), zt = (e) => !!e && Ye(e) && !!e.props.name && !!e.props.tabId, Kt = {
+  "purpur-tab-header": "_purpur-tab-header_1thzh_1",
+  "purpur-tab-header--contained": "_purpur-tab-header--contained_1thzh_35",
+  "purpur-tab-header--contained-negative": "_purpur-tab-header--contained-negative_1thzh_35",
+  "purpur-tab-header--line": "_purpur-tab-header--line_1thzh_38",
+  "purpur-tab-header--line-negative": "_purpur-tab-header--line-negative_1thzh_50"
+}, qt = ue.bind(Kt), he = "purpur-tab-header", Yt = we(
   ({
     index: e,
     tabId: t,
@@ -781,10 +781,10 @@ const ue = /* @__PURE__ */ Vt(Ut), jt = {
     "data-testid": r,
     children: i
   }, c) => /* @__PURE__ */ m(
-    qt,
+    Dt,
     {
       id: `${t}-trigger`,
-      className: zt([he, `${he}--${n}${o ? "-negative" : ""}`]),
+      className: qt([he, `${he}--${n}${o ? "-negative" : ""}`]),
       value: t,
       "data-testid": r,
       "data-index": e,
@@ -794,22 +794,22 @@ const ue = /* @__PURE__ */ Vt(Ut), jt = {
     }
   )
 ), Zt = {
-  "purpur-tabs__wrapper": "_purpur-tabs__wrapper_1nygq_1",
-  "purpur-tabs__scroll-button": "_purpur-tabs__scroll-button_1nygq_9",
-  "purpur-tabs__scroll-button--left": "_purpur-tabs__scroll-button--left_1nygq_71",
-  "purpur-tabs__scroll-button--right": "_purpur-tabs__scroll-button--right_1nygq_74",
-  "purpur-tabs__wrapper--scroll-end": "_purpur-tabs__wrapper--scroll-end_1nygq_77",
-  "purpur-tabs__wrapper--scroll-start": "_purpur-tabs__wrapper--scroll-start_1nygq_80",
-  "purpur-tabs--line": "_purpur-tabs--line_1nygq_83",
-  "purpur-tabs--line-negative": "_purpur-tabs--line-negative_1nygq_83",
-  "purpur-tabs__selected-border": "_purpur-tabs__selected-border_1nygq_91",
-  "purpur-tabs__content-wrapper": "_purpur-tabs__content-wrapper_1nygq_115",
-  "purpur-tabs--contained": "_purpur-tabs--contained_1nygq_123",
-  "purpur-tabs__list": "_purpur-tabs__list_1nygq_123",
-  "purpur-tabs--contained-negative": "_purpur-tabs--contained-negative_1nygq_123",
-  "purpur-tabs__content-container": "_purpur-tabs__content-container_1nygq_126",
-  "purpur-tabs--fullWidth": "_purpur-tabs--fullWidth_1nygq_135"
-}, rn = ["line", "contained"], Ht = (e) => new CustomEvent("tabChangeDetail", { detail: { value: e } }), O = ue.bind(Zt), R = "purpur-tabs", Xt = (e, t) => {
+  "purpur-tabs__wrapper": "_purpur-tabs__wrapper_j1jjc_1",
+  "purpur-tabs__scroll-button": "_purpur-tabs__scroll-button_j1jjc_9",
+  "purpur-tabs__scroll-button--left": "_purpur-tabs__scroll-button--left_j1jjc_71",
+  "purpur-tabs__scroll-button--right": "_purpur-tabs__scroll-button--right_j1jjc_74",
+  "purpur-tabs__wrapper--scroll-end": "_purpur-tabs__wrapper--scroll-end_j1jjc_77",
+  "purpur-tabs__wrapper--scroll-start": "_purpur-tabs__wrapper--scroll-start_j1jjc_80",
+  "purpur-tabs--line": "_purpur-tabs--line_j1jjc_83",
+  "purpur-tabs--line-negative": "_purpur-tabs--line-negative_j1jjc_83",
+  "purpur-tabs__selected-border": "_purpur-tabs__selected-border_j1jjc_91",
+  "purpur-tabs__content-wrapper": "_purpur-tabs__content-wrapper_j1jjc_115",
+  "purpur-tabs--contained": "_purpur-tabs--contained_j1jjc_123",
+  "purpur-tabs__list": "_purpur-tabs__list_j1jjc_123",
+  "purpur-tabs--contained-negative": "_purpur-tabs--contained-negative_j1jjc_123",
+  "purpur-tabs__content-container": "_purpur-tabs__content-container_j1jjc_126",
+  "purpur-tabs--fullWidth": "_purpur-tabs--fullWidth_j1jjc_136"
+}, rn = ["line", "contained"], Ht = (e) => new CustomEvent("tabChangeDetail", { detail: { value: e } }), P = ue.bind(Zt), R = "purpur-tabs", Xt = (e, t) => {
   var l;
   if (typeof (e == null ? void 0 : e.getBoundingClientRect) != "function" || typeof (t == null ? void 0 : t.scroll) != "function")
     return;
@@ -827,75 +827,75 @@ const ue = /* @__PURE__ */ Vt(Ut), jt = {
   animateHeight: c = !1,
   "data-testid": l,
   value: u,
-  ...g
+  ..._
 }) => {
-  const d = Q(null), [_, v] = B(-1), [f, b] = B({}), [C, h] = B(0), [y, M] = B(0), w = k.toArray(e).filter(kt), N = Q(null), q = Q(new Array(w.length)), U = 200, I = t === "line", X = O([
+  const d = Q(null), [v, b] = B(-1), [f, g] = B({}), [y, h] = B(0), [w, j] = B(0), C = z.toArray(e).filter(zt), N = Q(null), D = Q(new Array(C.length)), U = 200, I = t === "line", X = P([
     R,
     `${R}--${t}${n ? "-negative" : ""}`,
     { [`${R}--fullWidth`]: o },
     r
-  ]), $ = k.map(w, ({ props: { tabId: p } }) => p), L = () => {
-    const p = $.findIndex((S) => S === i);
+  ]), F = z.map(C, ({ props: { tabId: p } }) => p), L = () => {
+    const p = F.findIndex((S) => S === i);
     return p >= 0 ? p : 0;
   };
   K(() => {
-    u && j(w.findIndex((p) => p.props.tabId === u));
-  }, [w, u]);
-  const [V, j] = B(L);
-  if (new Set($).size !== $.length)
+    u && G(C.findIndex((p) => p.props.tabId === u));
+  }, [C, u]);
+  const [V, G] = B(L);
+  if (new Set(F).size !== F.length)
     throw new Error("tabId must be unique");
-  const G = (p, S) => S || l ? `${S || l}-${p}` : void 0, W = () => {
+  const W = (p, S) => S || l ? `${S || l}-${p}` : void 0, k = () => {
     if (!I)
       return;
-    const p = q.current[V];
-    h((p == null ? void 0 : p.offsetLeft) || 0), M((p == null ? void 0 : p.getBoundingClientRect().width) || 0);
+    const p = D.current[V];
+    h((p == null ? void 0 : p.offsetLeft) || 0), j((p == null ? void 0 : p.getBoundingClientRect().width) || 0);
   }, x = (p) => {
-    I && !u && j(w.findIndex((S) => S.props.tabId === p)), s == null || s(Ht(p));
-  }, Ge = (p) => {
+    I && !u && G(C.findIndex((S) => S.props.tabId === p)), s == null || s(Ht(p));
+  }, We = (p) => {
     if (N != null && N.current) {
-      const { scrollLeft: S } = N.current, P = p === "left" ? -200 : U;
-      N.current.scroll({ left: S + P, behavior: "smooth" });
+      const { scrollLeft: S } = N.current, M = p === "left" ? -200 : U;
+      N.current.scroll({ left: S + M, behavior: "smooth" });
     }
   }, le = ({ side: p }) => /* @__PURE__ */ m(
     "button",
     {
-      className: O(`${R}__scroll-button`, `${R}__scroll-button--${p}`),
-      onClick: () => Ge(p),
+      className: P(`${R}__scroll-button`, `${R}__scroll-button--${p}`),
+      onClick: () => We(p),
       type: "button",
       "aria-hidden": "true",
       tabIndex: -1,
-      "data-testid": G("scroll-button"),
-      children: /* @__PURE__ */ m(we, { svg: p === "left" ? st : it, size: "md" })
+      "data-testid": W("scroll-button"),
+      children: /* @__PURE__ */ m(Ce, { svg: p === "left" ? st : it, size: "md" })
     }
   );
   return K(() => {
     const p = () => {
       if (d.current && c) {
-        const P = d.current.offsetHeight;
-        v(P);
+        const M = d.current.offsetHeight;
+        b(M);
       }
     }, S = () => {
-      p(), W();
+      p(), k();
     };
     return p(), window.addEventListener("resize", S), () => {
       window.removeEventListener("resize", S);
     };
   }, [V, c]), K(() => {
-    W();
-  }, [V, o, w.length, t]), K(() => {
+    k();
+  }, [V, o, C.length, t]), K(() => {
     const p = (E) => {
-      if (E.every((T) => T.isIntersecting) && E.length === w.length) {
-        b({});
+      if (E.every((T) => T.isIntersecting) && E.length === C.length) {
+        g({});
         return;
       }
       E.forEach((T) => {
-        const fe = Number(T.target.getAttribute("data-index")), We = fe === 0, ke = fe === w.length - 1;
-        b((Ke) => ({
+        const fe = Number(T.target.getAttribute("data-index")), ke = fe === 0, ze = fe === C.length - 1;
+        g((Ke) => ({
           ...Ke,
-          ...We && {
+          ...ke && {
             [`${R}__wrapper--scroll-end`]: !T.isIntersecting
           },
-          ...ke && {
+          ...ze && {
             [`${R}__wrapper--scroll-start`]: !T.isIntersecting
           }
         }));
@@ -903,58 +903,58 @@ const ue = /* @__PURE__ */ Vt(Ut), jt = {
     }, S = new IntersectionObserver(p, {
       threshold: [0.99],
       root: N.current
-    }), P = q.current;
-    return P.forEach((E) => S.observe(E)), () => {
-      P.forEach((E) => S.unobserve(E));
+    }), M = D.current;
+    return M.forEach((E) => S.observe(E)), () => {
+      M.forEach((E) => S.unobserve(E));
     };
-  }, [w.length]), /* @__PURE__ */ m(
-    $t,
+  }, [C.length]), /* @__PURE__ */ m(
+    Ft,
     {
-      defaultValue: i ?? w[0].props.tabId,
+      defaultValue: i ?? C[0].props.tabId,
       onValueChange: x,
       "data-testid": l,
       className: X,
       value: u,
-      ...g,
-      children: /* @__PURE__ */ J("div", { className: O(`${R}__container`), children: [
-        /* @__PURE__ */ J("div", { className: O([`${R}__wrapper`, f]), children: [
+      ..._,
+      children: /* @__PURE__ */ J("div", { className: P(`${R}__container`), children: [
+        /* @__PURE__ */ J("div", { className: P([`${R}__wrapper`, f]), children: [
           /* @__PURE__ */ J(
-            Dt,
+            $t,
             {
               ref: (p) => {
                 N.current = p;
               },
-              className: O(`${R}__list`),
+              className: P(`${R}__list`),
               children: [
-                k.map(w, (p, S) => {
-                  const { name: P, tabId: E, "data-testid": de } = p.props;
+                z.map(C, (p, S) => {
+                  const { name: M, tabId: E, "data-testid": de } = p.props;
                   return /* @__PURE__ */ m(
                     Yt,
                     {
-                      "data-testid": G("header", de),
+                      "data-testid": W("header", de),
                       index: S,
                       tabId: E,
                       ref: (T) => {
-                        T && (q.current[S] = T);
+                        T && (D.current[S] = T);
                       },
                       onFocus: (T) => {
                         Xt(T.target, N.current);
                       },
                       variant: t,
                       negative: n,
-                      children: P
+                      children: M
                     }
                   );
                 }),
                 I && /* @__PURE__ */ m(
                   "div",
                   {
-                    className: O(`${R}__selected-border`),
+                    className: P(`${R}__selected-border`),
                     style: {
-                      width: y,
-                      transform: `translateX(${C}px)`
+                      width: w,
+                      transform: `translateX(${y}px)`
                     },
-                    "data-testid": G("selected-border")
+                    "data-testid": W("selected-border")
                   }
                 )
               ]
@@ -966,16 +966,16 @@ const ue = /* @__PURE__ */ Vt(Ut), jt = {
         /* @__PURE__ */ m(
           "div",
           {
-            className: O(`${R}__content-wrapper`),
-            style: { height: c && _ > -1 ? `${_}px` : "auto" },
-            children: /* @__PURE__ */ m("div", { ref: d, className: O(`${R}__content-container`), children: k.map(w, (p) => p) })
+            className: P(`${R}__content-wrapper`),
+            style: { height: c && v > -1 ? `${v}px` : "auto" },
+            children: /* @__PURE__ */ m("div", { ref: d, className: P(`${R}__content-container`), children: z.map(C, (p) => p) })
           }
         )
       ] })
     }
   );
 };
-Jt.Content = Wt;
+Jt.Content = kt;
 export {
   Jt as Tabs,
   Ht as createTabChangeDetailEvent,