@purpurds/tabs 8.6.0 → 8.7.0

package/dist/tabs.es.js

@@ -1,25 +1,25 @@
 import { jsx as m, jsxs as ee } from "react/jsx-runtime";
-import * as u from "react";
-import O, { forwardRef as be, isValidElement as Ge, useRef as te, useState as U, Children as q, useEffect as Y } from "react";
+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 "react-dom";
-function ke(e) {
+function We(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var le = { exports: {} };
+var de = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
 */
-var de;
-function ze() {
-  return de || (de = 1, (function(e) {
+var fe;
+function Ke() {
+  return fe || (fe = 1, (function(e) {
     (function() {
       var t = {}.hasOwnProperty;
       function r() {
-        for (var n = "", i = 0; i < arguments.length; i++) {
-          var c = arguments[i];
-          c && (n = s(n, o.call(this, c)));
+        for (var n = "", c = 0; c < arguments.length; c++) {
+          var i = arguments[c];
+          i && (n = s(n, o.call(this, i)));
         }
         return n;
       }
@@ -32,20 +32,20 @@ function ze() {
           return r.apply(this, n);
         if (n.toString !== Object.prototype.toString && !n.toString.toString().includes("[native code]"))
           return n.toString();
-        var i = "";
-        for (var c in n)
-          t.call(n, c) && n[c] && (i = s(i, this && this[c] || c));
-        return i;
+        var c = "";
+        for (var i in n)
+          t.call(n, i) && n[i] && (c = s(c, this && this[i] || i));
+        return c;
       }
-      function s(n, i) {
-        return i ? n ? n + " " + i : n + i : n;
+      function s(n, c) {
+        return c ? n ? n + " " + c : n + c : n;
       }
       e.exports ? (r.default = r, e.exports = r) : window.classNames = r;
     })();
-  })(le)), le.exports;
+  })(de)), de.exports;
 }
-var Ke = ze();
-const qe = /* @__PURE__ */ ke(Ke), Ye = {
+var qe = Ke();
+const ze = /* @__PURE__ */ We(qe), Ye = {
   "purpur-icon": "_purpur-icon_8u1lq_1",
   "purpur-icon--xxs": "_purpur-icon--xxs_8u1lq_4",
   "purpur-icon--xs": "_purpur-icon--xs_8u1lq_8",
@@ -53,7 +53,7 @@ const qe = /* @__PURE__ */ ke(Ke), 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 = qe.bind(Ye), fe = "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 } = {}) => {
+}, 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 } = {}) => {
   const r = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
@@ -65,8 +65,8 @@ const qe = /* @__PURE__ */ ke(Ke), Ye = {
   const n = Je({
     content: Qe(e.svg),
     title: t
-  }), i = Ze(fe, `${fe}--${o}`, r);
-  return /* @__PURE__ */ m("span", { className: i, dangerouslySetInnerHTML: { __html: n }, ...s });
+  }), c = Ze(pe, `${pe}--${o}`, r);
+  return /* @__PURE__ */ m("span", { className: c, dangerouslySetInnerHTML: { __html: n }, ...s });
 };
 ge.displayName = "Icon";
 const et = {
@@ -88,31 +88,31 @@ function A(e, t, { checkForDefaultPrevented: r = !0 } = {}) {
 }
 function ie(e, t = []) {
   let r = [];
-  function o(n, i) {
-    const c = u.createContext(i), d = r.length;
-    r = [...r, i];
-    const a = (f) => {
+  function o(n, c) {
+    const i = a.createContext(c), d = r.length;
+    r = [...r, c];
+    const u = (f) => {
       var C;
-      const { scope: _, children: g, ...I } = f, h = ((C = _ == null ? void 0 : _[e]) == null ? void 0 : C[d]) || c, v = u.useMemo(() => I, Object.values(I));
-      return /* @__PURE__ */ m(h.Provider, { value: v, children: g });
+      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 });
     };
-    a.displayName = n + "Provider";
-    function l(f, _) {
+    u.displayName = n + "Provider";
+    function l(f, v) {
       var h;
-      const g = ((h = _ == null ? void 0 : _[e]) == null ? void 0 : h[d]) || c, I = u.useContext(g);
+      const g = ((h = v == null ? void 0 : v[e]) == null ? void 0 : h[d]) || i, I = a.useContext(g);
       if (I) return I;
-      if (i !== void 0) return i;
+      if (c !== void 0) return c;
       throw new Error(`\`${f}\` must be used within \`${n}\``);
     }
-    return [a, l];
+    return [u, l];
   }
   const s = () => {
-    const n = r.map((i) => u.createContext(i));
-    return function(c) {
-      const d = (c == null ? void 0 : c[e]) || n;
-      return u.useMemo(
-        () => ({ [`__scope${e}`]: { ...c, [e]: d } }),
-        [c, d]
+    const n = r.map((c) => a.createContext(c));
+    return function(i) {
+      const d = (i == null ? void 0 : i[e]) || n;
+      return a.useMemo(
+        () => ({ [`__scope${e}`]: { ...i, [e]: d } }),
+        [i, d]
       );
     };
   };
@@ -127,16 +127,16 @@ function nt(...e) {
       scopeName: s.scopeName
     }));
     return function(n) {
-      const i = o.reduce((c, { useScope: d, scopeName: a }) => {
-        const f = d(n)[`__scope${a}`];
-        return { ...c, ...f };
+      const c = o.reduce((i, { useScope: d, scopeName: u }) => {
+        const f = d(n)[`__scope${u}`];
+        return { ...i, ...f };
       }, {});
-      return u.useMemo(() => ({ [`__scope${t.scopeName}`]: i }), [i]);
+      return a.useMemo(() => ({ [`__scope${t.scopeName}`]: c }), [c]);
     };
   };
   return r.scopeName = t.scopeName, r;
 }
-function pe(e, t) {
+function me(e, t) {
   if (typeof e == "function")
     return e(t);
   e != null && (e.current = t);
@@ -145,110 +145,110 @@ function he(...e) {
   return (t) => {
     let r = !1;
     const o = e.map((s) => {
-      const n = pe(s, t);
+      const n = me(s, t);
       return !r && typeof n == "function" && (r = !0), n;
     });
     if (r)
       return () => {
         for (let s = 0; s < o.length; s++) {
           const n = o[s];
-          typeof n == "function" ? n() : pe(e[s], null);
+          typeof n == "function" ? n() : me(e[s], null);
         }
       };
   };
 }
 function X(...e) {
-  return u.useCallback(he(...e), e);
+  return a.useCallback(he(...e), e);
 }
 // @__NO_SIDE_EFFECTS__
-function oe(e) {
-  const t = /* @__PURE__ */ rt(e), r = u.forwardRef((o, s) => {
-    const { children: n, ...i } = o, c = u.Children.toArray(n), d = c.find(st);
+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 a = d.props.children, l = c.map((f) => f === d ? u.Children.count(a) > 1 ? u.Children.only(null) : u.isValidElement(a) ? a.props.children : null : f);
-      return /* @__PURE__ */ m(t, { ...i, ref: s, children: u.isValidElement(a) ? u.cloneElement(a, void 0, l) : null });
+      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 });
     }
-    return /* @__PURE__ */ m(t, { ...i, ref: s, children: n });
+    return /* @__PURE__ */ m(t, { ...c, ref: s, children: n });
   });
   return r.displayName = `${e}.Slot`, r;
 }
 // @__NO_SIDE_EFFECTS__
 function rt(e) {
-  const t = u.forwardRef((r, o) => {
+  const t = a.forwardRef((r, o) => {
     const { children: s, ...n } = r;
-    if (u.isValidElement(s)) {
-      const i = ct(s), c = it(n, s.props);
-      return s.type !== u.Fragment && (c.ref = o ? he(o, i) : i), u.cloneElement(s, c);
+    if (a.isValidElement(s)) {
+      const c = it(s), i = ct(n, s.props);
+      return s.type !== a.Fragment && (i.ref = o ? he(o, c) : c), a.cloneElement(s, i);
     }
-    return u.Children.count(s) > 1 ? u.Children.only(null) : null;
+    return a.Children.count(s) > 1 ? a.Children.only(null) : null;
   });
   return t.displayName = `${e}.SlotClone`, t;
 }
 var ot = Symbol("radix.slottable");
 function st(e) {
-  return u.isValidElement(e) && typeof e.type == "function" && "__radixId" in e.type && e.type.__radixId === ot;
+  return a.isValidElement(e) && typeof e.type == "function" && "__radixId" in e.type && e.type.__radixId === ot;
 }
-function it(e, t) {
+function ct(e, t) {
   const r = { ...t };
   for (const o in t) {
     const s = e[o], n = t[o];
-    /^on[A-Z]/.test(o) ? s && n ? r[o] = (...c) => {
-      const d = n(...c);
-      return s(...c), d;
+    /^on[A-Z]/.test(o) ? s && n ? r[o] = (...i) => {
+      const d = n(...i);
+      return s(...i), d;
     } : s && (r[o] = s) : o === "style" ? r[o] = { ...s, ...n } : o === "className" && (r[o] = [s, n].filter(Boolean).join(" "));
   }
   return { ...e, ...r };
 }
-function ct(e) {
+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);
 }
-function ut(e) {
+function at(e) {
   const t = e + "CollectionProvider", [r, o] = ie(t), [s, n] = r(
     t,
     { collectionRef: { current: null }, itemMap: /* @__PURE__ */ new Map() }
-  ), i = (h) => {
-    const { scope: v, children: C } = h, N = O.useRef(null), w = O.useRef(/* @__PURE__ */ new Map()).current;
-    return /* @__PURE__ */ m(s, { scope: v, itemMap: w, collectionRef: N, children: C });
+  ), 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 });
   };
-  i.displayName = t;
-  const c = e + "CollectionSlot", d = /* @__PURE__ */ oe(c), a = O.forwardRef(
-    (h, v) => {
-      const { scope: C, children: N } = h, w = n(c, C), b = X(v, w.collectionRef);
+  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 });
     }
   );
-  a.displayName = c;
-  const l = e + "CollectionItemSlot", f = "data-radix-collection-item", _ = /* @__PURE__ */ oe(l), g = O.forwardRef(
-    (h, v) => {
-      const { scope: C, children: N, ...w } = h, b = O.useRef(null), R = X(v, b), x = n(l, C);
-      return O.useEffect(() => (x.itemMap.set(b, { ref: b, ...w }), () => void x.itemMap.delete(b))), /* @__PURE__ */ m(_, { [f]: "", ref: R, children: N });
+  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 });
     }
   );
   g.displayName = l;
   function I(h) {
-    const v = n(e + "CollectionConsumer", h);
+    const _ = n(e + "CollectionConsumer", h);
     return O.useCallback(() => {
-      const N = v.collectionRef.current;
+      const N = _.collectionRef.current;
       if (!N) return [];
       const w = Array.from(N.querySelectorAll(`[${f}]`));
-      return Array.from(v.itemMap.values()).sort(
-        (x, $) => w.indexOf(x.ref.current) - w.indexOf($.ref.current)
+      return Array.from(_.itemMap.values()).sort(
+        (x, P) => w.indexOf(x.ref.current) - w.indexOf(P.ref.current)
       );
-    }, [v.collectionRef, v.itemMap]);
+    }, [_.collectionRef, _.itemMap]);
   }
   return [
-    { Provider: i, Slot: a, ItemSlot: g },
+    { Provider: c, Slot: u, ItemSlot: g },
     I,
     o
   ];
 }
-var H = globalThis != null && globalThis.document ? u.useLayoutEffect : () => {
-}, at = u[" useId ".trim().toString()] || (() => {
+var H = globalThis != null && globalThis.document ? a.useLayoutEffect : () => {
+}, ut = a[" useId ".trim().toString()] || (() => {
 }), lt = 0;
 function we(e) {
-  const [t, r] = u.useState(at());
+  const [t, r] = a.useState(ut());
   return H(() => {
     r((o) => o ?? String(lt++));
   }, [e]), t ? `radix-${t}` : "";
@@ -271,23 +271,23 @@ var dt = [
   "span",
   "svg",
   "ul"
-], L = dt.reduce((e, t) => {
-  const r = /* @__PURE__ */ oe(`Primitive.${t}`), o = u.forwardRef((s, n) => {
-    const { asChild: i, ...c } = s, d = i ? r : t;
-    return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ m(d, { ...c, ref: n });
+], j = 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 });
   });
   return o.displayName = `Primitive.${t}`, { ...e, [t]: o };
 }, {});
 function ft(e) {
-  const t = u.useRef(e);
-  return u.useEffect(() => {
+  const t = a.useRef(e);
+  return a.useEffect(() => {
     t.current = e;
-  }), u.useMemo(() => (...r) => {
+  }), a.useMemo(() => (...r) => {
     var o;
     return (o = t.current) == null ? void 0 : o.call(t, ...r);
   }, []);
 }
-var pt = u[" useInsertionEffect ".trim().toString()] || H;
+var pt = a[" useInsertionEffect ".trim().toString()] || H;
 function Ce({
   prop: e,
   defaultProp: t,
@@ -295,79 +295,79 @@ function Ce({
   },
   caller: o
 }) {
-  const [s, n, i] = mt({
+  const [s, n, c] = mt({
     defaultProp: t,
     onChange: r
-  }), c = e !== void 0, d = c ? e : s;
+  }), i = e !== void 0, d = i ? e : s;
   {
-    const l = u.useRef(e !== void 0);
-    u.useEffect(() => {
+    const l = a.useRef(e !== void 0);
+    a.useEffect(() => {
       const f = l.current;
-      f !== c && console.warn(
-        `${o} is changing from ${f ? "controlled" : "uncontrolled"} to ${c ? "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 = c;
-    }, [c, o]);
+      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;
+    }, [i, o]);
   }
-  const a = u.useCallback(
+  const u = a.useCallback(
     (l) => {
       var f;
-      if (c) {
-        const _ = _t(l) ? l(e) : l;
-        _ !== e && ((f = i.current) == null || f.call(i, _));
+      if (i) {
+        const v = vt(l) ? l(e) : l;
+        v !== e && ((f = c.current) == null || f.call(c, v));
       } else
         n(l);
     },
-    [c, e, n, i]
+    [i, e, n, c]
   );
-  return [d, a];
+  return [d, u];
 }
 function mt({
   defaultProp: e,
   onChange: t
 }) {
-  const [r, o] = u.useState(e), s = u.useRef(r), n = u.useRef(t);
+  const [r, o] = a.useState(e), s = a.useRef(r), n = a.useRef(t);
   return pt(() => {
     n.current = t;
-  }, [t]), u.useEffect(() => {
-    var i;
-    s.current !== r && ((i = n.current) == null || i.call(n, r), s.current = r);
+  }, [t]), a.useEffect(() => {
+    var c;
+    s.current !== r && ((c = n.current) == null || c.call(n, r), s.current = r);
   }, [r, s]), [r, o, n];
 }
-function _t(e) {
+function vt(e) {
   return typeof e == "function";
 }
-var vt = u.createContext(void 0);
+var _t = a.createContext(void 0);
 function Se(e) {
-  const t = u.useContext(vt);
+  const t = a.useContext(_t);
   return e || t || "ltr";
 }
-var ne = "rovingFocusGroup.onEntryFocus", bt = { bubbles: !1, cancelable: !0 }, W = "RovingFocusGroup", [se, ye, gt] = ut(W), [ht, Ie] = ie(
-  W,
+var ne = "rovingFocusGroup.onEntryFocus", bt = { bubbles: !1, cancelable: !0 }, U = "RovingFocusGroup", [ce, ye, gt] = at(U), [ht, Ie] = ie(
+  U,
   [gt]
-), [wt, Ct] = ht(W), Re = u.forwardRef(
-  (e, t) => /* @__PURE__ */ m(se.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(se.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(St, { ...e, ref: t }) }) })
+), [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 }) }) })
 );
-Re.displayName = W;
-var St = u.forwardRef((e, t) => {
+Re.displayName = U;
+var St = a.forwardRef((e, t) => {
   const {
     __scopeRovingFocusGroup: r,
     orientation: o,
     loop: s = !1,
     dir: n,
-    currentTabStopId: i,
-    defaultCurrentTabStopId: c,
+    currentTabStopId: c,
+    defaultCurrentTabStopId: i,
     onCurrentTabStopIdChange: d,
-    onEntryFocus: a,
+    onEntryFocus: u,
     preventScrollOnEntryFocus: l = !1,
     ...f
-  } = e, _ = u.useRef(null), g = X(t, _), I = Se(n), [h, v] = Ce({
-    prop: i,
-    defaultProp: c ?? null,
+  } = e, v = a.useRef(null), g = X(t, v), I = Se(n), [h, _] = Ce({
+    prop: c,
+    defaultProp: i ?? null,
     onChange: d,
-    caller: W
-  }), [C, N] = u.useState(!1), w = ft(a), b = ye(r), R = u.useRef(!1), [x, $] = u.useState(0);
-  return u.useEffect(() => {
-    const y = _.current;
+    caller: U
+  }), [C, N] = a.useState(!1), w = ft(u), b = ye(r), R = a.useRef(!1), [x, 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(
@@ -378,21 +378,21 @@ var St = u.forwardRef((e, t) => {
       dir: I,
       loop: s,
       currentTabStopId: h,
-      onItemFocus: u.useCallback(
-        (y) => v(y),
-        [v]
+      onItemFocus: a.useCallback(
+        (y) => _(y),
+        [_]
       ),
-      onItemShiftTab: u.useCallback(() => N(!0), []),
-      onFocusableItemAdd: u.useCallback(
-        () => $((y) => y + 1),
+      onItemShiftTab: a.useCallback(() => N(!0), []),
+      onFocusableItemAdd: a.useCallback(
+        () => P((y) => y + 1),
         []
       ),
-      onFocusableItemRemove: u.useCallback(
-        () => $((y) => y - 1),
+      onFocusableItemRemove: a.useCallback(
+        () => P((y) => y - 1),
         []
       ),
       children: /* @__PURE__ */ m(
-        L.div,
+        j.div,
         {
           tabIndex: C || x === 0 ? -1 : 0,
           "data-orientation": o,
@@ -407,10 +407,10 @@ var St = u.forwardRef((e, t) => {
             if (y.target === y.currentTarget && Q && !C) {
               const F = new CustomEvent(ne, bt);
               if (y.currentTarget.dispatchEvent(F), !F.defaultPrevented) {
-                const V = b().filter((E) => E.focusable), B = V.find((E) => E.active), j = V.find((E) => E.id === h), k = [B, j, ...V].filter(
+                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(
                   Boolean
                 ).map((E) => E.ref.current);
-                xe(k, l);
+                xe(W, l);
               }
             }
             R.current = !1;
@@ -420,58 +420,58 @@ var St = u.forwardRef((e, t) => {
       )
     }
   );
-}), Ne = "RovingFocusGroupItem", Te = u.forwardRef(
+}), Ne = "RovingFocusGroupItem", Te = a.forwardRef(
   (e, t) => {
     const {
       __scopeRovingFocusGroup: r,
       focusable: o = !0,
       active: s = !1,
       tabStopId: n,
-      children: i,
-      ...c
-    } = e, d = we(), a = n || d, l = Ct(Ne, r), f = l.currentTabStopId === a, _ = ye(r), { onFocusableItemAdd: g, onFocusableItemRemove: I, currentTabStopId: h } = l;
-    return u.useEffect(() => {
+      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;
+    return a.useEffect(() => {
       if (o)
         return g(), () => I();
     }, [o, g, I]), /* @__PURE__ */ m(
-      se.ItemSlot,
+      ce.ItemSlot,
       {
         scope: r,
-        id: a,
+        id: u,
         focusable: o,
         active: s,
         children: /* @__PURE__ */ m(
-          L.span,
+          j.span,
           {
             tabIndex: f ? 0 : -1,
             "data-orientation": l.orientation,
-            ...c,
+            ...i,
             ref: t,
-            onMouseDown: A(e.onMouseDown, (v) => {
-              o ? l.onItemFocus(a) : v.preventDefault();
+            onMouseDown: A(e.onMouseDown, (_) => {
+              o ? l.onItemFocus(u) : _.preventDefault();
             }),
-            onFocus: A(e.onFocus, () => l.onItemFocus(a)),
-            onKeyDown: A(e.onKeyDown, (v) => {
-              if (v.key === "Tab" && v.shiftKey) {
+            onFocus: A(e.onFocus, () => l.onItemFocus(u)),
+            onKeyDown: A(e.onKeyDown, (_) => {
+              if (_.key === "Tab" && _.shiftKey) {
                 l.onItemShiftTab();
                 return;
               }
-              if (v.target !== v.currentTarget) return;
-              const C = Rt(v, l.orientation, l.dir);
+              if (_.target !== _.currentTarget) return;
+              const C = Rt(_, l.orientation, l.dir);
               if (C !== void 0) {
-                if (v.metaKey || v.ctrlKey || v.altKey || v.shiftKey) return;
-                v.preventDefault();
-                let w = _().filter((b) => b.focusable).map((b) => b.ref.current);
+                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(v.currentTarget);
+                  const b = w.indexOf(_.currentTarget);
                   w = l.loop ? Nt(w, b + 1) : w.slice(b + 1);
                 }
                 setTimeout(() => xe(w));
               }
             }),
-            children: typeof i == "function" ? i({ isCurrentTabStop: f, hasTabStop: h != null }) : i
+            children: typeof c == "function" ? c({ isCurrentTabStop: f, hasTabStop: h != null }) : c
           }
         )
       }
@@ -507,15 +507,15 @@ function Nt(e, t) {
 }
 var Tt = Re, xt = Te;
 function Et(e, t) {
-  return u.useReducer((r, o) => t[r][o] ?? r, e);
+  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 }) : u.Children.only(r), n = X(o.ref, Mt(s));
-  return typeof r == "function" || o.isPresent ? u.cloneElement(s, { ref: n }) : null;
+  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));
+  return typeof r == "function" || o.isPresent ? a.cloneElement(s, { ref: n }) : null;
 };
 Ee.displayName = "Presence";
 function At(e) {
-  const [t, r] = u.useState(), o = u.useRef(null), s = u.useRef(e), n = u.useRef("none"), i = e ? "mounted" : "unmounted", [c, d] = Et(i, {
+  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, {
     mounted: {
       UNMOUNT: "unmounted",
       ANIMATION_OUT: "unmountSuspended"
@@ -528,84 +528,84 @@ function At(e) {
       MOUNT: "mounted"
     }
   });
-  return u.useEffect(() => {
-    const a = Z(o.current);
-    n.current = c === "mounted" ? a : "none";
-  }, [c]), H(() => {
-    const a = o.current, l = s.current;
+  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 _ = n.current, g = Z(a);
-      e ? d("MOUNT") : g === "none" || (a == null ? void 0 : a.display) === "none" ? d("UNMOUNT") : d(l && _ !== g ? "ANIMATION_OUT" : "UNMOUNT"), s.current = 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;
     }
   }, [e, d]), H(() => {
     if (t) {
-      let a;
+      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 v = t.style.animationFillMode;
-          t.style.animationFillMode = "forwards", a = l.setTimeout(() => {
-            t.style.animationFillMode === "forwards" && (t.style.animationFillMode = v);
+          const _ = t.style.animationFillMode;
+          t.style.animationFillMode = "forwards", u = l.setTimeout(() => {
+            t.style.animationFillMode === "forwards" && (t.style.animationFillMode = _);
           });
         }
-      }, _ = (g) => {
+      }, v = (g) => {
         g.target === t && (n.current = Z(o.current));
       };
-      return t.addEventListener("animationstart", _), t.addEventListener("animationcancel", f), t.addEventListener("animationend", f), () => {
-        l.clearTimeout(a), t.removeEventListener("animationstart", _), t.removeEventListener("animationcancel", f), t.removeEventListener("animationend", f);
+      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);
       };
     } else
       d("ANIMATION_END");
   }, [t, d]), {
-    isPresent: ["mounted", "unmountSuspended"].includes(c),
-    ref: u.useCallback((a) => {
-      o.current = a ? getComputedStyle(a) : null, r(a);
+    isPresent: ["mounted", "unmountSuspended"].includes(i),
+    ref: a.useCallback((u) => {
+      o.current = u ? getComputedStyle(u) : null, r(u);
     }, [])
   };
 }
 function Z(e) {
   return (e == null ? void 0 : e.animationName) || "none";
 }
-function Mt(e) {
+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);
 }
-var J = "Tabs", [Pt] = ie(J, [
+var J = "Tabs", [Mt] = ie(J, [
   Ie
-]), Ae = Ie(), [$t, ce] = Pt(J), Me = u.forwardRef(
+]), Ae = Ie(), [Pt, ae] = Mt(J), $e = a.forwardRef(
   (e, t) => {
     const {
       __scopeTabs: r,
       value: o,
       onValueChange: s,
       defaultValue: n,
-      orientation: i = "horizontal",
-      dir: c,
+      orientation: c = "horizontal",
+      dir: i,
       activationMode: d = "automatic",
-      ...a
-    } = e, l = Se(c), [f, _] = Ce({
+      ...u
+    } = e, l = Se(i), [f, v] = Ce({
       prop: o,
       onChange: s,
       defaultProp: n ?? "",
       caller: J
     });
     return /* @__PURE__ */ m(
-      $t,
+      Pt,
       {
         scope: r,
         baseId: we(),
         value: f,
-        onValueChange: _,
-        orientation: i,
+        onValueChange: v,
+        orientation: c,
         dir: l,
         activationMode: d,
         children: /* @__PURE__ */ m(
-          L.div,
+          j.div,
           {
             dir: l,
-            "data-orientation": i,
-            ...a,
+            "data-orientation": c,
+            ...u,
             ref: t
           }
         )
@@ -613,20 +613,20 @@ var J = "Tabs", [Pt] = ie(J, [
     );
   }
 );
-Me.displayName = J;
-var Pe = "TabsList", $e = u.forwardRef(
+$e.displayName = J;
+var Me = "TabsList", Pe = a.forwardRef(
   (e, t) => {
-    const { __scopeTabs: r, loop: o = !0, ...s } = e, n = ce(Pe, r), i = Ae(r);
+    const { __scopeTabs: r, loop: o = !0, ...s } = e, n = ae(Me, r), c = Ae(r);
     return /* @__PURE__ */ m(
       Tt,
       {
         asChild: !0,
-        ...i,
+        ...c,
         orientation: n.orientation,
         dir: n.dir,
         loop: o,
         children: /* @__PURE__ */ m(
-          L.div,
+          j.div,
           {
             role: "tablist",
             "aria-orientation": n.orientation,
@@ -638,24 +638,24 @@ var Pe = "TabsList", $e = u.forwardRef(
     );
   }
 );
-$e.displayName = Pe;
-var Oe = "TabsTrigger", Fe = u.forwardRef(
+Pe.displayName = Me;
+var Oe = "TabsTrigger", Fe = a.forwardRef(
   (e, t) => {
-    const { __scopeTabs: r, value: o, disabled: s = !1, ...n } = e, i = ce(Oe, r), c = Ae(r), d = Ve(i.baseId, o), a = Be(i.baseId, o), l = o === i.value;
+    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;
     return /* @__PURE__ */ m(
       xt,
       {
         asChild: !0,
-        ...c,
+        ...i,
         focusable: !s,
         active: l,
         children: /* @__PURE__ */ m(
-          L.button,
+          j.button,
           {
             type: "button",
             role: "tab",
             "aria-selected": l,
-            "aria-controls": a,
+            "aria-controls": u,
             "data-state": l ? "active" : "inactive",
             "data-disabled": s ? "" : void 0,
             disabled: s,
@@ -663,14 +663,14 @@ var Oe = "TabsTrigger", Fe = u.forwardRef(
             ...n,
             ref: t,
             onMouseDown: A(e.onMouseDown, (f) => {
-              !s && f.button === 0 && f.ctrlKey === !1 ? i.onValueChange(o) : f.preventDefault();
+              !s && f.button === 0 && f.ctrlKey === !1 ? c.onValueChange(o) : f.preventDefault();
             }),
             onKeyDown: A(e.onKeyDown, (f) => {
-              [" ", "Enter"].includes(f.key) && i.onValueChange(o);
+              [" ", "Enter"].includes(f.key) && c.onValueChange(o);
             }),
             onFocus: A(e.onFocus, () => {
-              const f = i.activationMode !== "manual";
-              !l && !s && f && i.onValueChange(o);
+              const f = c.activationMode !== "manual";
+              !l && !s && f && c.onValueChange(o);
             })
           }
         )
@@ -679,42 +679,42 @@ var Oe = "TabsTrigger", Fe = u.forwardRef(
   }
 );
 Fe.displayName = Oe;
-var De = "TabsContent", Le = u.forwardRef(
+var De = "TabsContent", je = a.forwardRef(
   (e, t) => {
-    const { __scopeTabs: r, value: o, forceMount: s, children: n, ...i } = e, c = ce(De, r), d = Ve(c.baseId, o), a = Be(c.baseId, o), l = o === c.value, f = u.useRef(l);
-    return u.useEffect(() => {
-      const _ = requestAnimationFrame(() => f.current = !1);
-      return () => cancelAnimationFrame(_);
-    }, []), /* @__PURE__ */ m(Ee, { present: s || l, children: ({ present: _ }) => /* @__PURE__ */ m(
-      L.div,
+    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);
+    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,
       {
         "data-state": l ? "active" : "inactive",
-        "data-orientation": c.orientation,
+        "data-orientation": i.orientation,
         role: "tabpanel",
         "aria-labelledby": d,
-        hidden: !_,
-        id: a,
+        hidden: !v,
+        id: u,
         tabIndex: 0,
-        ...i,
+        ...c,
         ref: t,
         style: {
           ...e.style,
           animationDuration: f.current ? "0s" : void 0
         },
-        children: _ && n
+        children: v && n
       }
     ) });
   }
 );
-Le.displayName = De;
-function Ve(e, t) {
+je.displayName = De;
+function Le(e, t) {
   return `${e}-trigger-${t}`;
 }
-function Be(e, t) {
+function Ve(e, t) {
   return `${e}-content-${t}`;
 }
-var Ot = Me, Ft = $e, Dt = Fe, Lt = Le;
-function Vt(e) {
+var Ot = $e, Ft = Pe, Dt = Fe, jt = je;
+function Lt(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
 var re = { exports: {} };
@@ -723,15 +723,15 @@ var re = { exports: {} };
 	Licensed under the MIT License (MIT), see
 	http://jedwatson.github.io/classnames
 */
-var me;
-function Bt() {
-  return me || (me = 1, (function(e) {
+var ve;
+function Vt() {
+  return ve || (ve = 1, (function(e) {
     (function() {
       var t = {}.hasOwnProperty;
       function r() {
-        for (var n = "", i = 0; i < arguments.length; i++) {
-          var c = arguments[i];
-          c && (n = s(n, o.call(this, c)));
+        for (var n = "", c = 0; c < arguments.length; c++) {
+          var i = arguments[c];
+          i && (n = s(n, o.call(this, i)));
         }
         return n;
       }
@@ -744,28 +744,28 @@ function Bt() {
           return r.apply(this, n);
         if (n.toString !== Object.prototype.toString && !n.toString.toString().includes("[native code]"))
           return n.toString();
-        var i = "";
-        for (var c in n)
-          t.call(n, c) && n[c] && (i = s(i, this && this[c] || c));
-        return i;
+        var c = "";
+        for (var i in n)
+          t.call(n, i) && n[i] && (c = s(c, this && this[i] || i));
+        return c;
       }
-      function s(n, i) {
-        return i ? n ? n + " " + i : n + i : n;
+      function s(n, c) {
+        return c ? n ? n + " " + c : n + c : n;
       }
       e.exports ? (r.default = r, e.exports = r) : window.classNames = r;
     })();
   })(re)), re.exports;
 }
-var Ut = Bt();
-const ue = /* @__PURE__ */ Vt(Ut), Wt = {
+var Bt = Vt();
+const ue = /* @__PURE__ */ Lt(Bt), Ut = {
   "purpur-tab-content": "_purpur-tab-content_1ugbi_1",
   "purpur-tab-content--force-mount": "_purpur-tab-content--force-mount_1ugbi_15"
-}, jt = ue.bind(Wt), _e = "purpur-tab-content", Gt = be(
-  ({ children: e, tabId: t, "data-testid": r, className: o, disableForceMount: s, ...n }, i) => /* @__PURE__ */ m(
-    Lt,
+}, Gt = ue.bind(Ut), _e = "purpur-tab-content", kt = be(
+  ({ children: e, tabId: t, "data-testid": r, className: o, disableForceMount: s, ...n }, c) => /* @__PURE__ */ m(
+    jt,
     {
-      ref: i,
-      className: jt(_e, o, {
+      ref: c,
+      className: Gt(_e, o, {
         [`${_e}--force-mount`]: !s
       }),
       "data-testid": r,
@@ -775,57 +775,61 @@ const ue = /* @__PURE__ */ Vt(Ut), Wt = {
       children: e
     }
   )
-), kt = (e) => !!e && Ge(e) && !!e.props.name && !!e.props.tabId, zt = {
-  "purpur-tab-header": "_purpur-tab-header_znb0i_1",
-  "purpur-tab-header--contained": "_purpur-tab-header--contained_znb0i_36",
-  "purpur-tab-header--contained-negative": "_purpur-tab-header--contained-negative_znb0i_36",
-  "purpur-tab-header--line": "_purpur-tab-header--line_znb0i_39",
-  "purpur-tab-header--line-negative": "_purpur-tab-header--line-negative_znb0i_51"
-}, Kt = ue.bind(zt), ve = "purpur-tab-header", qt = be(
+), Wt = (e) => !!e && ke(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",
+  "purpur-tab-header--line": "_purpur-tab-header--line_1tc2s_39",
+  "purpur-tab-header--line-negative": "_purpur-tab-header--line-negative_1tc2s_51",
+  "purpur-tab-header--full-width": "_purpur-tab-header--full-width_1tc2s_100"
+}, qt = ue.bind(Kt), oe = "purpur-tab-header", zt = be(
   ({
     index: e,
     tabId: t,
     variant: r,
     negative: o,
     onFocus: s,
-    "data-testid": n,
+    fullWidth: n,
+    "data-testid": c,
     children: i
-  }, c) => /* @__PURE__ */ m(
+  }, d) => /* @__PURE__ */ m(
     Dt,
     {
       id: `${t}-trigger`,
-      className: Kt(ve, `${ve}--${r}${o ? "-negative" : ""}`),
+      className: qt(oe, `${oe}--${r}${o ? "-negative" : ""}`, {
+        [`${oe}--full-width`]: n
+      }),
       value: t,
-      "data-testid": n,
+      "data-testid": c,
       "data-index": e,
-      ref: c,
+      ref: d,
       onFocus: s,
       children: i
     }
   )
 ), Yt = {
-  "purpur-tabs__wrapper": "_purpur-tabs__wrapper_1u905_1",
-  "purpur-tabs__scroll-button": "_purpur-tabs__scroll-button_1u905_9",
-  "purpur-tabs__scroll-button--left": "_purpur-tabs__scroll-button--left_1u905_71",
-  "purpur-tabs__scroll-button--right": "_purpur-tabs__scroll-button--right_1u905_74",
-  "purpur-tabs__wrapper--scroll-start": "_purpur-tabs__wrapper--scroll-start_1u905_77",
-  "purpur-tabs__wrapper--scroll-end": "_purpur-tabs__wrapper--scroll-end_1u905_80",
-  "purpur-tabs--line": "_purpur-tabs--line_1u905_83",
-  "purpur-tabs--line-negative": "_purpur-tabs--line-negative_1u905_83",
-  "purpur-tabs__selected-border": "_purpur-tabs__selected-border_1u905_91",
-  "purpur-tabs__content-wrapper": "_purpur-tabs__content-wrapper_1u905_115",
-  "purpur-tabs--contained": "_purpur-tabs--contained_1u905_123",
-  "purpur-tabs__list": "_purpur-tabs__list_1u905_123",
-  "purpur-tabs--contained-negative": "_purpur-tabs--contained-negative_1u905_123",
-  "purpur-tabs__content-container": "_purpur-tabs__content-container_1u905_126",
-  "purpur-tabs--fullWidth": "_purpur-tabs--fullWidth_1u905_136"
-}, tn = ["line", "contained"], Zt = (e) => new CustomEvent("tabChangeDetail", { detail: { value: e } }), P = ue.bind(Yt), T = "purpur-tabs", Xt = (e, t) => {
+  "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",
+  "purpur-tabs__scroll-button--right": "_purpur-tabs__scroll-button--right_jv2vl_74",
+  "purpur-tabs__wrapper--scroll-start": "_purpur-tabs__wrapper--scroll-start_jv2vl_77",
+  "purpur-tabs__wrapper--scroll-end": "_purpur-tabs__wrapper--scroll-end_jv2vl_80",
+  "purpur-tabs--line": "_purpur-tabs--line_jv2vl_83",
+  "purpur-tabs--line-negative": "_purpur-tabs--line-negative_jv2vl_83",
+  "purpur-tabs__selected-border": "_purpur-tabs__selected-border_jv2vl_91",
+  "purpur-tabs__content-wrapper": "_purpur-tabs__content-wrapper_jv2vl_115",
+  "purpur-tabs--contained": "_purpur-tabs--contained_jv2vl_123",
+  "purpur-tabs__list": "_purpur-tabs__list_jv2vl_123",
+  "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")
     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), i = o.left + (isNaN(n) ? 0 : n);
-  let c;
-  r.right > o.right && (c = r.left + t.scrollLeft, c = c + r.width - s + s * 0.1, c = c - i), r.left < o.left && (c = r.left + t.scrollLeft, c = c - s * 0.1, c = c - i), c !== void 0 && t.scroll({ left: c, behavior: "smooth" });
+  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);
+  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 = ({
   children: e,
   variant: t = "line",
@@ -833,77 +837,77 @@ const ue = /* @__PURE__ */ Vt(Ut), Wt = {
   fullWidth: o = !1,
   onChange: s,
   className: n,
-  defaultValue: i,
-  animateHeight: c = !1,
+  defaultValue: c,
+  animateHeight: i = !1,
   "data-testid": d,
-  value: a,
+  value: u,
   ...l
 }) => {
-  const f = te(null), [_, g] = U(-1), [I, h] = U({}), [v, C] = U(0), [N, w] = U(0), b = q.toArray(e).filter(kt), R = te(null), x = te(new Array(b.length)), $ = 200, y = t === "line", Q = P(
+  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}--fullWidth`]: o },
+    { [`${T}--full-width`]: o },
     n
-  ), F = q.map(b, ({ props: { tabId: p } }) => p), V = () => {
-    const p = F.findIndex((S) => S === i);
+  ), F = z.map(b, ({ props: { tabId: p } }) => p), L = () => {
+    const p = F.findIndex((S) => S === c);
     return p >= 0 ? p : 0;
   };
   Y(() => {
-    a && j(b.findIndex((p) => p.props.tabId === a));
-  }, [b, a]);
-  const [B, j] = U(V);
+    u && G(b.findIndex((p) => p.props.tabId === u));
+  }, [b, 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 || d ? `${S || d}-${p}` : void 0, k = () => {
+  const k = (p, S) => S || d ? `${S || d}-${p}` : void 0, W = () => {
     if (!y)
       return;
-    const p = x.current[B];
+    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 && !a && j(b.findIndex((S) => S.props.tabId === p)), s == null || s(Zt(p));
-  }, Ue = (p) => {
+    y && !u && G(b.findIndex((S) => S.props.tabId === p)), s == null || s(Zt(p));
+  }, Be = (p) => {
     if (R != null && R.current) {
-      const { scrollLeft: S } = R.current, M = p === "left" ? -$ : $;
-      R.current.scroll({ left: S + M, behavior: "smooth" });
+      const { scrollLeft: S } = R.current, $ = p === "left" ? -P : P;
+      R.current.scroll({ left: S + $, behavior: "smooth" });
     }
-  }, ae = ({ side: p }) => /* @__PURE__ */ m(
+  }, le = ({ side: p }) => /* @__PURE__ */ m(
     "button",
     {
-      className: P(`${T}__scroll-button`, `${T}__scroll-button--${p}`),
-      onClick: () => Ue(p),
+      className: M(`${T}__scroll-button`, `${T}__scroll-button--${p}`),
+      onClick: () => Be(p),
       type: "button",
       "aria-hidden": "true",
       tabIndex: -1,
-      "data-testid": G("scroll-button"),
+      "data-testid": k("scroll-button"),
       children: /* @__PURE__ */ m(ge, { svg: p === "left" ? et : tt, size: "md" })
     }
   );
   return Y(() => {
     const p = () => {
-      if (f.current && c) {
-        const M = f.current.offsetHeight;
-        g(M);
+      if (f.current && i) {
+        const $ = f.current.offsetHeight;
+        g($);
       }
     }, S = () => {
-      p(), k();
+      p(), W();
     };
     return p(), window.addEventListener("resize", S), () => {
       window.removeEventListener("resize", S);
     };
-  }, [B, c]), Y(() => {
-    k();
-  }, [B, o, b.length, t]), Y(() => {
+  }, [V, i]), Y(() => {
+    W();
+  }, [V, o, b.length, t]), Y(() => {
     const p = R.current;
     if (!p) return;
     const S = () => {
-      const { scrollLeft: M, scrollWidth: z, clientWidth: K } = p, D = z > K, We = M <= 1, je = M + K >= z - 1;
+      const { scrollLeft: $, scrollWidth: K, clientWidth: q } = p, D = K > q, Ue = $ <= 1, Ge = $ + q >= K - 1;
       if (!D) {
         h({});
         return;
       }
       h({
-        [`${T}__wrapper--scroll-start`]: !We,
-        [`${T}__wrapper--scroll-end`]: !je
+        [`${T}__wrapper--scroll-start`]: !Ue,
+        [`${T}__wrapper--scroll-end`]: !Ge
       });
     };
     return S(), p.addEventListener("scroll", S, { passive: !0 }), window.addEventListener("resize", S), () => {
@@ -912,30 +916,30 @@ const ue = /* @__PURE__ */ Vt(Ut), Wt = {
   }, []), /* @__PURE__ */ m(
     Ot,
     {
-      defaultValue: i ?? b[0].props.tabId,
+      defaultValue: c ?? b[0].props.tabId,
       onValueChange: E,
       "data-testid": d,
       className: Q,
-      value: a,
+      value: u,
       ...l,
-      children: /* @__PURE__ */ ee("div", { className: P(`${T}__container`), children: [
-        /* @__PURE__ */ ee("div", { className: P(`${T}__wrapper`, I), children: [
+      children: /* @__PURE__ */ ee("div", { className: M(`${T}__container`), children: [
+        /* @__PURE__ */ ee("div", { className: M(`${T}__wrapper`, I), children: [
           /* @__PURE__ */ ee(
             Ft,
             {
               ref: (p) => {
                 R.current = p;
               },
-              className: P(`${T}__list`),
+              className: M(`${T}__list`),
               children: [
-                q.map(b, (p, S) => {
-                  const { name: M, tabId: z, "data-testid": K } = p.props;
+                z.map(b, (p, S) => {
+                  const { name: $, tabId: K, "data-testid": q } = p.props;
                   return /* @__PURE__ */ m(
-                    qt,
+                    zt,
                     {
-                      "data-testid": G("header", K),
+                      "data-testid": k("header", q),
                       index: S,
-                      tabId: z,
+                      tabId: K,
                       ref: (D) => {
                         D && (x.current[S] = D);
                       },
@@ -944,40 +948,41 @@ const ue = /* @__PURE__ */ Vt(Ut), Wt = {
                       },
                       variant: t,
                       negative: r,
-                      children: M
+                      fullWidth: o,
+                      children: $
                     }
                   );
                 }),
                 y && /* @__PURE__ */ m(
                   "div",
                   {
-                    className: P(`${T}__selected-border`),
+                    className: M(`${T}__selected-border`),
                     style: {
                       width: N,
-                      transform: `translateX(${v}px)`
+                      transform: `translateX(${_}px)`
                     },
-                    "data-testid": G("selected-border")
+                    "data-testid": k("selected-border")
                   }
                 )
               ]
             }
           ),
-          /* @__PURE__ */ m(ae, { side: "left" }),
-          /* @__PURE__ */ m(ae, { side: "right" })
+          /* @__PURE__ */ m(le, { side: "left" }),
+          /* @__PURE__ */ m(le, { side: "right" })
         ] }),
         /* @__PURE__ */ m(
           "div",
           {
-            className: c ? P(`${T}__content-wrapper`) : "",
-            style: { height: c && _ > -1 ? `${_}px` : "auto" },
-            children: /* @__PURE__ */ m("div", { ref: f, className: P(`${T}__content-container`), children: q.map(b, (p) => p) })
+            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) })
           }
         )
       ] })
     }
   );
 };
-Ht.Content = Gt;
+Ht.Content = kt;
 export {
   Ht as Tabs,
   Zt as createTabChangeDetailEvent,