@fabio.caffarello/react-design-system 3.9.0 → 3.11.0

package/dist/server/index.js

@@ -1,28 +1,28 @@
-var ae = Object.defineProperty, re = Object.defineProperties;
+var te = Object.defineProperty, re = Object.defineProperties;
 var se = Object.getOwnPropertyDescriptors;
-var W = Object.getOwnPropertySymbols;
+var P = Object.getOwnPropertySymbols;
 var U = Object.prototype.hasOwnProperty, K = Object.prototype.propertyIsEnumerable;
-var O = (e, a, r) => a in e ? ae(e, a, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[a] = r, f = (e, a) => {
-  for (var r in a || (a = {}))
-    U.call(a, r) && O(e, r, a[r]);
-  if (W)
-    for (var r of W(a))
-      K.call(a, r) && O(e, r, a[r]);
+var H = (e, t, r) => t in e ? te(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, f = (e, t) => {
+  for (var r in t || (t = {}))
+    U.call(t, r) && H(e, r, t[r]);
+  if (P)
+    for (var r of P(t))
+      K.call(t, r) && H(e, r, t[r]);
   return e;
-}, x = (e, a) => re(e, se(a));
-var p = (e, a) => {
+}, g = (e, t) => re(e, se(t));
+var m = (e, t) => {
   var r = {};
-  for (var t in e)
-    U.call(e, t) && a.indexOf(t) < 0 && (r[t] = e[t]);
-  if (e != null && W)
-    for (var t of W(e))
-      a.indexOf(t) < 0 && K.call(e, t) && (r[t] = e[t]);
+  for (var a in e)
+    U.call(e, a) && t.indexOf(a) < 0 && (r[a] = e[a]);
+  if (e != null && P)
+    for (var a of P(e))
+      t.indexOf(a) < 0 && K.call(e, a) && (r[a] = e[a]);
   return r;
 };
-var X = (e, a, r) => O(e, typeof a != "symbol" ? a + "" : a, r);
-import { jsx as l, jsxs as $ } from "react/jsx-runtime";
-import * as k from "react";
-import ee, { memo as D, forwardRef as _ } from "react";
+var X = (e, t, r) => H(e, typeof t != "symbol" ? t + "" : t, r);
+import { jsx as l, jsxs as v } from "react/jsx-runtime";
+import * as E from "react";
+import ee, { memo as _, forwardRef as z } from "react";
 import { clsx as ne } from "clsx";
 import { twMerge as ie } from "tailwind-merge";
 import { cva as le } from "class-variance-authority";
@@ -31,8 +31,8 @@ class F {
   /**
    * Create a radius token
    */
-  static create(a) {
-    const t = {
+  static create(t) {
+    const a = {
       none: {
         px: 0,
         tailwind: "rounded-none",
@@ -73,13 +73,13 @@ class F {
         tailwind: "rounded-full",
         description: "Full radius for circular elements"
       }
-    }[a];
+    }[t];
     return {
-      value: t.px,
-      rem: `${t.px / 16}rem`,
-      px: `${t.px}px`,
-      tailwind: t.tailwind,
-      description: t.description
+      value: a.px,
+      rem: `${a.px / 16}rem`,
+      px: `${a.px}px`,
+      tailwind: a.tailwind,
+      description: a.description
     };
   }
 }
@@ -93,27 +93,27 @@ const fe = {
   "3xl": F.create("3xl"),
   full: F.create("full")
 };
-function C(e) {
+function S(e) {
   return fe[e].tailwind;
 }
-class w {
+class N {
   // 4px base
   /**
    * Create a spacing token from scale value
    */
-  static create(a) {
-    const r = a * this.BASE_UNIT, t = r / 16;
+  static create(t) {
+    const r = t * this.BASE_UNIT, a = r / 16;
     return {
       value: r,
-      rem: `${t}rem`,
+      rem: `${a}rem`,
       px: `${r}px`,
-      tailwind: this.getTailwindClass(a)
+      tailwind: this.getTailwindClass(t)
     };
   }
   /**
    * Get Tailwind class for spacing value
    */
-  static getTailwindClass(a) {
+  static getTailwindClass(t) {
     return {
       0: "0",
       0.5: "0.5",
@@ -160,49 +160,49 @@ class w {
       // 320px
       96: "96"
       // 384px
-    }[a] || String(a);
+    }[t] || String(t);
   }
 }
-X(w, "BASE_UNIT", 4);
+X(N, "BASE_UNIT", 4);
 const ue = {
   // Micro spacing (0-14px)
-  none: w.create(0),
-  "0.5": w.create(0.5),
+  none: N.create(0),
+  "0.5": N.create(0.5),
   // 2px (half-step)
-  xs: w.create(1),
+  xs: N.create(1),
   // 4px
-  "1.5": w.create(1.5),
+  "1.5": N.create(1.5),
   // 6px (half-step)
-  sm: w.create(2),
+  sm: N.create(2),
   // 8px
-  "2.5": w.create(2.5),
+  "2.5": N.create(2.5),
   // 10px (half-step)
-  md: w.create(3),
+  md: N.create(3),
   // 12px
-  "3.5": w.create(3.5),
+  "3.5": N.create(3.5),
   // 14px (half-step)
   // Standard spacing (16-32px)
-  base: w.create(4),
+  base: N.create(4),
   // 16px
-  lg: w.create(6),
+  lg: N.create(6),
   // 24px
-  xl: w.create(8),
+  xl: N.create(8),
   // 32px
   // Large spacing (40-64px)
-  "2xl": w.create(10),
+  "2xl": N.create(10),
   // 40px
-  "3xl": w.create(12),
+  "3xl": N.create(12),
   // 48px
-  "4xl": w.create(16),
+  "4xl": N.create(16),
   // 64px
   // Extra large spacing (80px+)
-  "5xl": w.create(20),
+  "5xl": N.create(20),
   // 80px
-  "6xl": w.create(24)
+  "6xl": N.create(24)
   // 96px
 };
-function i(e, a = "p") {
-  const t = ue[e].tailwind;
+function i(e, t = "p") {
+  const a = ue[e].tailwind;
   return `${{
     p: "p",
     m: "m",
@@ -223,14 +223,14 @@ function i(e, a = "p") {
     "gap-y": "gap-y",
     "space-x": "space-x",
     "space-y": "space-y"
-  }[a]}-${t}`;
+  }[t]}-${a}`;
 }
-class N {
+class $ {
   /**
    * Create font size token
    */
-  static createFontSize(a) {
-    const t = {
+  static createFontSize(t) {
+    const a = {
       "2xs": { px: 10, tailwind: "text-2xs" },
       // micro-text (badge counters, mini chips)
       xs: { px: 12, tailwind: "text-xs" },
@@ -243,103 +243,103 @@ class N {
       "4xl": { px: 36, tailwind: "text-4xl" },
       "5xl": { px: 48, tailwind: "text-5xl" },
       "6xl": { px: 60, tailwind: "text-6xl" }
-    }[a];
+    }[t];
     return {
-      value: t.px,
-      rem: `${t.px / 16}rem`,
-      px: `${t.px}px`,
-      tailwind: t.tailwind
+      value: a.px,
+      rem: `${a.px / 16}rem`,
+      px: `${a.px}px`,
+      tailwind: a.tailwind
     };
   }
   /**
    * Create line height token
    */
-  static createLineHeight(a) {
-    const t = {
+  static createLineHeight(t) {
+    const a = {
       none: { value: 1, tailwind: "leading-none" },
       tight: { value: 1.25, tailwind: "leading-tight" },
       snug: { value: 1.375, tailwind: "leading-snug" },
       normal: { value: 1.5, tailwind: "leading-normal" },
       relaxed: { value: 1.625, tailwind: "leading-relaxed" },
       loose: { value: 2, tailwind: "leading-loose" }
-    }[a];
+    }[t];
     return {
-      value: t.value,
-      tailwind: t.tailwind
+      value: a.value,
+      tailwind: a.tailwind
     };
   }
   /**
    * Create font weight token
    */
-  static createFontWeight(a) {
-    const t = {
+  static createFontWeight(t) {
+    const a = {
       light: { value: 300, tailwind: "font-light" },
       normal: { value: 400, tailwind: "font-normal" },
       medium: { value: 500, tailwind: "font-medium" },
       semibold: { value: 600, tailwind: "font-semibold" },
       bold: { value: 700, tailwind: "font-bold" }
-    }[a];
+    }[t];
     return {
-      value: t.value,
-      tailwind: t.tailwind
+      value: a.value,
+      tailwind: a.tailwind
     };
   }
   /**
    * Create complete typography token
    */
-  static create(a, r = "normal", t = "normal") {
+  static create(t, r = "normal", a = "normal") {
     return {
-      fontSize: this.createFontSize(a),
+      fontSize: this.createFontSize(t),
       lineHeight: this.createLineHeight(r),
-      fontWeight: this.createFontWeight(t)
+      fontWeight: this.createFontWeight(a)
     };
   }
 }
-N.createFontWeight("light"), N.createFontWeight("normal"), N.createFontWeight("medium"), N.createFontWeight("semibold"), N.createFontWeight("bold");
+$.createFontWeight("light"), $.createFontWeight("normal"), $.createFontWeight("medium"), $.createFontWeight("semibold"), $.createFontWeight("bold");
 const B = {
   // Headings
-  h1: N.create("4xl", "tight", "bold"),
-  h2: N.create("3xl", "tight", "bold"),
-  h3: N.create("2xl", "snug", "semibold"),
-  h4: N.create("xl", "snug", "semibold"),
-  h5: N.create("lg", "normal", "medium"),
-  h6: N.create("base", "normal", "medium"),
+  h1: $.create("4xl", "tight", "bold"),
+  h2: $.create("3xl", "tight", "bold"),
+  h3: $.create("2xl", "snug", "semibold"),
+  h4: $.create("xl", "snug", "semibold"),
+  h5: $.create("lg", "normal", "medium"),
+  h6: $.create("base", "normal", "medium"),
   // Body text
-  body: N.create("base", "relaxed", "normal"),
-  bodySmall: N.create("sm", "relaxed", "normal"),
-  bodyLarge: N.create("lg", "relaxed", "normal"),
+  body: $.create("base", "relaxed", "normal"),
+  bodySmall: $.create("sm", "relaxed", "normal"),
+  bodyLarge: $.create("lg", "relaxed", "normal"),
   // UI elements
-  label: N.create("sm", "normal", "medium"),
-  caption: N.create("xs", "normal", "normal"),
-  button: N.create("base", "normal", "medium")
+  label: $.create("sm", "normal", "medium"),
+  caption: $.create("xs", "normal", "normal"),
+  button: $.create("base", "normal", "medium")
 };
 function R(e) {
-  const a = B[e];
-  return `${a.fontSize.tailwind} ${a.lineHeight.tailwind} ${a.fontWeight.tailwind}`;
+  const t = B[e];
+  return `${t.fontSize.tailwind} ${t.lineHeight.tailwind} ${t.fontWeight.tailwind}`;
 }
-function E(e) {
+function k(e) {
   return B[e].fontSize.tailwind;
 }
-function j(e) {
+function M(e) {
   return B[e].fontWeight.tailwind;
 }
 function n(...e) {
   return ie(ne(e));
 }
-const M = (e, a) => {
-  const r = le(e, a);
-  return ((t) => {
-    const s = r(t);
+const A = (e, t) => {
+  const r = le(e, t);
+  return ((a) => {
+    const s = r(a);
     return n(s);
   });
-}, pe = M(
+}, pe = A(
   // Base classes
   n(
     "inline-flex",
     "items-center",
     "justify-center",
-    j("label"),
-    C("md"),
+    M("label"),
+    S("md"),
     "border"
   ),
   {
@@ -357,17 +357,17 @@ const M = (e, a) => {
         sm: n(
           i("1.5", "px"),
           i("0.5", "py"),
-          E("caption")
+          k("caption")
         ),
         md: n(
           i("sm", "px"),
           i("xs", "py"),
-          E("caption")
+          k("caption")
         ),
         lg: n(
           i("sm", "px"),
           i("xs", "py"),
-          E("bodySmall")
+          k("bodySmall")
         )
       },
       style: {
@@ -470,16 +470,16 @@ const M = (e, a) => {
       style: "solid"
     }
   }
-), me = D(
-  _(function(g, u) {
-    var y = g, {
-      variant: a = "neutral",
+), me = _(
+  z(function(x, p) {
+    var y = x, {
+      variant: t = "neutral",
       size: r = "md",
-      style: t = "solid",
+      style: a = "solid",
       className: s = "",
       children: o,
       "aria-label": d
-    } = y, c = p(y, [
+    } = y, c = m(y, [
       "variant",
       "size",
       "style",
@@ -487,22 +487,22 @@ const M = (e, a) => {
       "children",
       "aria-label"
     ]);
-    const b = n(pe({ variant: a, size: r, style: t }), s);
-    let m;
+    const b = n(pe({ variant: t, size: r, style: a }), s);
+    let u;
     if (d)
-      m = d;
+      u = d;
     else if (typeof o == "string")
-      m = o;
+      u = o;
     else if (typeof o == "object" && o !== null && "props" in o) {
       const h = o.props;
-      h != null && h.children && typeof h.children == "string" && (m = h.children);
+      h != null && h.children && typeof h.children == "string" && (u = h.children);
     }
     return /* @__PURE__ */ l(
       "span",
-      x(f({
-        ref: u,
+      g(f({
+        ref: p,
         role: "status",
-        "aria-label": m,
+        "aria-label": u,
         className: b
       }, c), {
         children: o
@@ -511,53 +511,53 @@ const M = (e, a) => {
   })
 );
 me.displayName = "Badge";
-function G(e, a) {
+function G(e, t) {
   if (typeof e == "function")
-    return e(a);
-  e != null && (e.current = a);
+    return e(t);
+  e != null && (e.current = t);
 }
 function ge(...e) {
-  return (a) => {
+  return (t) => {
     let r = !1;
-    const t = e.map((s) => {
-      const o = G(s, a);
+    const a = e.map((s) => {
+      const o = G(s, t);
       return !r && typeof o == "function" && (r = !0), o;
     });
     if (r)
       return () => {
-        for (let s = 0; s < t.length; s++) {
-          const o = t[s];
+        for (let s = 0; s < a.length; s++) {
+          const o = a[s];
           typeof o == "function" ? o() : G(e[s], null);
         }
       };
   };
 }
 function xe(...e) {
-  return k.useCallback(ge(...e), e);
+  return E.useCallback(ge(...e), e);
 }
 // @__NO_SIDE_EFFECTS__
 function be(e) {
-  const a = k.forwardRef((r, t) => {
+  const t = E.forwardRef((r, a) => {
     var h;
-    let m = r, { children: s } = m, o = p(m, ["children"]), d = null, c = !1;
-    const u = [];
-    Y(s) && typeof H == "function" && (s = H(s._payload)), k.Children.forEach(s, (v) => {
-      var S;
-      if ($e(v)) {
+    let u = r, { children: s } = u, o = m(u, ["children"]), d = null, c = !1;
+    const p = [];
+    Y(s) && typeof W == "function" && (s = W(s._payload)), E.Children.forEach(s, (w) => {
+      var C;
+      if ($e(w)) {
         c = !0;
-        const A = v;
-        let L = "child" in A.props ? A.props.child : A.props.children;
-        Y(L) && typeof H == "function" && (L = H(L._payload)), d = ve(A, L), u.push((S = d == null ? void 0 : d.props) == null ? void 0 : S.children);
+        const V = w;
+        let L = "child" in V.props ? V.props.child : V.props.children;
+        Y(L) && typeof W == "function" && (L = W(L._payload)), d = ve(V, L), p.push((C = d == null ? void 0 : d.props) == null ? void 0 : C.children);
       } else
-        u.push(v);
-    }), d ? d = k.cloneElement(d, void 0, u) : (
+        p.push(w);
+    }), d ? d = E.cloneElement(d, void 0, p) : (
       // A `Slottable` was found but it didn't resolve to a single element (e.g.
       // it wrapped multiple elements, text, or a render-prop `child` that
       // wasn't an element). Don't fall back to treating the `Slottable` wrapper
       // itself as the slot target — throw a descriptive error below instead.
-      !c && k.Children.count(s) === 1 && k.isValidElement(s) && (d = s)
+      !c && E.Children.count(s) === 1 && E.isValidElement(s) && (d = s)
     );
-    const g = d ? Ne(d) : void 0, y = xe(t, g);
+    const x = d ? Ne(d) : void 0, y = xe(a, x);
     if (!d) {
       if (s || s === 0)
         throw new Error(
@@ -566,35 +566,35 @@ function be(e) {
       return s;
     }
     const b = we(o, (h = d.props) != null ? h : {});
-    return d.type !== k.Fragment && (b.ref = t ? y : g), k.cloneElement(d, b);
+    return d.type !== E.Fragment && (b.ref = a ? y : x), E.cloneElement(d, b);
   });
-  return a.displayName = `${e}.Slot`, a;
+  return t.displayName = `${e}.Slot`, t;
 }
-var he = /* @__PURE__ */ be("Slot"), ye = /* @__PURE__ */ Symbol.for("radix.slottable"), ve = (e, a) => {
+var he = /* @__PURE__ */ be("Slot"), ye = /* @__PURE__ */ Symbol.for("radix.slottable"), ve = (e, t) => {
   if ("child" in e.props) {
     const r = e.props.child;
-    return k.isValidElement(r) ? k.cloneElement(r, void 0, e.props.children(r.props.children)) : null;
+    return E.isValidElement(r) ? E.cloneElement(r, void 0, e.props.children(r.props.children)) : null;
   }
-  return k.isValidElement(a) ? a : null;
+  return E.isValidElement(t) ? t : null;
 };
-function we(e, a) {
-  const r = f({}, a);
-  for (const t in a) {
-    const s = e[t], o = a[t];
-    /^on[A-Z]/.test(t) ? s && o ? r[t] = (...c) => {
-      const u = o(...c);
-      return s(...c), u;
-    } : s && (r[t] = s) : t === "style" ? r[t] = f(f({}, s), o) : t === "className" && (r[t] = [s, o].filter(Boolean).join(" "));
+function we(e, t) {
+  const r = f({}, t);
+  for (const a in t) {
+    const s = e[a], o = t[a];
+    /^on[A-Z]/.test(a) ? s && o ? r[a] = (...c) => {
+      const p = o(...c);
+      return s(...c), p;
+    } : s && (r[a] = s) : a === "style" ? r[a] = f(f({}, s), o) : a === "className" && (r[a] = [s, o].filter(Boolean).join(" "));
   }
   return f(f({}, e), r);
 }
 function Ne(e) {
-  var t, s;
-  let a = (t = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : t.get, r = a && "isReactWarning" in a && a.isReactWarning;
-  return r ? e.ref : (a = (s = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : s.get, r = a && "isReactWarning" in a && a.isReactWarning, r ? e.props.ref : e.props.ref || e.ref);
+  var a, s;
+  let t = (a = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : a.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 $e(e) {
-  return k.isValidElement(e) && typeof e.type == "function" && "__radixId" in e.type && e.type.__radixId === ye;
+  return E.isValidElement(e) && typeof e.type == "function" && "__radixId" in e.type && e.type.__radixId === ye;
 }
 var Se = /* @__PURE__ */ Symbol.for("react.lazy");
 function Y(e) {
@@ -603,14 +603,14 @@ function Y(e) {
 function Ce(e) {
   return typeof e == "object" && e !== null && "then" in e;
 }
-var ke = (e) => `${e} failed to slot onto its children. Expected a single React element child or \`Slottable\`.`, Ee = (e) => `${e} failed to slot onto its \`Slottable\`. Expected \`Slottable\` to receive a single React element child.`, H = k[" use ".trim().toString()];
-const Z = M(
+var ke = (e) => `${e} failed to slot onto its children. Expected a single React element child or \`Slottable\`.`, Ee = (e) => `${e} failed to slot onto its \`Slottable\`. Expected \`Slottable\` to receive a single React element child.`, W = E[" use ".trim().toString()];
+const Z = A(
   // Base classes
   n(
     "inline-flex",
     "items-center",
     "font-medium",
-    C("full"),
+    S("full"),
     i("xs", "gap")
   ),
   {
@@ -639,17 +639,17 @@ const Z = M(
         sm: n(
           i("xs", "px"),
           i("xs", "py"),
-          E("caption")
+          k("caption")
         ),
         md: n(
           i("sm", "px"),
           i("xs", "py"),
-          E("bodySmall")
+          k("bodySmall")
         ),
         lg: n(
           i("md", "px"),
           i("sm", "py"),
-          E("body")
+          k("body")
         )
       },
       selected: {
@@ -693,22 +693,22 @@ const Z = M(
       disabled: !1
     }
   }
-), Te = _(function(a, r) {
+), Te = z(function(t, r) {
   const {
-    children: t,
+    children: a,
     variant: s = "default",
     size: o = "md",
     selected: d = !1,
     disabled: c = !1,
-    className: u = "",
-    "aria-label": g,
+    className: p = "",
+    "aria-label": x,
     tabIndex: y,
     asChild: b = !1
-  } = a, h = (() => {
-    if (g) return g;
-    if (typeof t == "string") return t;
-    if (typeof t == "object" && t !== null && "props" in t) {
-      const T = t.props;
+  } = t, h = (() => {
+    if (x) return x;
+    if (typeof a == "string") return a;
+    if (typeof a == "object" && a !== null && "props" in a) {
+      const T = a.props;
       if (T != null && T.children && typeof T.children == "string")
         return T.children;
     }
@@ -720,37 +720,37 @@ const Z = M(
         ref: r,
         className: n(
           Z({ variant: s, size: o, selected: d, disabled: c }),
-          u
+          p
         ),
-        "aria-label": g,
+        "aria-label": x,
         "aria-disabled": c || void 0,
         tabIndex: y,
-        children: t
+        children: a
       }
     );
-  const { onRemove: v, onClick: S } = a, A = S !== void 0, L = A && !c, V = (T) => {
-    c || (T.key === "Enter" || T.key === " ") && (T.preventDefault(), S == null || S());
+  const { onRemove: w, onClick: C } = t, V = C !== void 0, L = V && !c, D = (T) => {
+    c || (T.key === "Enter" || T.key === " ") && (T.preventDefault(), C == null || C());
   };
-  return /* @__PURE__ */ $(
+  return /* @__PURE__ */ v(
     "div",
     {
       ref: r,
       className: n(
         Z({ variant: s, size: o, selected: d, disabled: c }),
-        v && i("xs", "pr"),
-        u
+        w && i("xs", "pr"),
+        p
       ),
       "aria-disabled": c,
       children: [
-        A ? /* @__PURE__ */ l(
+        V ? /* @__PURE__ */ l(
           "button",
           {
             type: "button",
-            onClick: c ? void 0 : S,
-            onKeyDown: V,
+            onClick: c ? void 0 : C,
+            onKeyDown: D,
             disabled: c,
             "aria-pressed": d ? !0 : void 0,
-            "aria-label": g || h,
+            "aria-label": x || h,
             tabIndex: y !== void 0 ? y : L ? 0 : void 0,
             className: n(
               "flex-1",
@@ -764,22 +764,22 @@ const Z = M(
               "focus:ring-2",
               "focus:ring-line-focus",
               "focus:ring-offset-2",
-              C("full")
+              S("full")
             ),
-            children: t
+            children: a
           }
-        ) : /* @__PURE__ */ l("span", { children: t }),
-        v && !c && /* @__PURE__ */ l(
+        ) : /* @__PURE__ */ l("span", { children: a }),
+        w && !c && /* @__PURE__ */ l(
           "button",
           {
             type: "button",
             onClick: (T) => {
-              T.stopPropagation(), v();
+              T.stopPropagation(), w();
             },
             className: n(
               i("xs", "ml"),
               "hover:bg-tint-hover",
-              C("full"),
+              S("full"),
               i("xs", "p"),
               "transition-colors",
               "focus:outline-none",
@@ -796,34 +796,34 @@ const Z = M(
   );
 });
 Te.displayName = "Chip";
-function dt(s) {
+function pa(s) {
   var o = s, {
     message: e,
-    id: a,
+    id: t,
     className: r = ""
-  } = o, t = p(o, [
+  } = o, a = m(o, [
     "message",
     "id",
     "className"
   ]);
   const d = [
     i("xs", "mt"),
-    E("bodySmall"),
+    k("bodySmall"),
     "text-fg-error",
     "flex",
     "items-center",
     i("xs", "gap")
   ], c = n(...d, r);
-  return /* @__PURE__ */ $("div", x(f({ role: "alert", id: a, className: c, "aria-live": "polite" }, t), { children: [
+  return /* @__PURE__ */ v("div", g(f({ role: "alert", id: t, className: c, "aria-live": "polite" }, a), { children: [
     /* @__PURE__ */ l(de, { className: "h-4 w-4 shrink-0", "aria-hidden": "true" }),
     /* @__PURE__ */ l("span", { children: e })
   ] }));
 }
-function ct(t) {
-  var s = t, {
+function ma(a) {
+  var s = a, {
     variant: e = "info",
-    className: a
-  } = s, r = p(s, [
+    className: t
+  } = s, r = m(s, [
     "variant",
     "className"
   ]);
@@ -840,17 +840,17 @@ function ct(t) {
         "border",
         i("base", "px"),
         i("sm", "py"),
-        C("lg"),
+        S("lg"),
         o[e],
-        a
+        t
       )
     }, r)
   );
 }
 const Le = n(
   "block",
-  E("label"),
-  j("label"),
+  k("label"),
+  M("label"),
   "text-fg-primary"
 ), Ae = {
   default: "",
@@ -865,23 +865,23 @@ const Le = n(
     "after:text-fg-tertiary",
     "after:font-normal"
   )
-}, Fe = D(
-  _(function(d, o) {
-    var c = d, { variant: a = "default", className: r = "", children: t } = c, s = p(c, ["variant", "className", "children"]);
-    const u = n(
+}, Ve = _(
+  z(function(d, o) {
+    var c = d, { variant: t = "default", className: r = "", children: a } = c, s = m(c, ["variant", "className", "children"]);
+    const p = n(
       Le,
-      Ae[a],
+      Ae[t],
       r
     );
-    return /* @__PURE__ */ l("label", x(f({ ref: o, className: u }, s), { children: t }));
+    return /* @__PURE__ */ l("label", g(f({ ref: o, className: p }, s), { children: a }));
   })
 );
-Fe.displayName = "Label";
-class z {
+Ve.displayName = "Label";
+class j {
   /**
    * Create a shadow token
    */
-  static create(a) {
+  static create(t) {
     return {
       none: {
         value: "none",
@@ -918,22 +918,22 @@ class z {
         tailwind: "shadow-inner",
         description: "Inner shadow for inset elements"
       }
-    }[a];
+    }[t];
   }
 }
-const Re = {
-  none: z.create("none"),
-  sm: z.create("sm"),
-  md: z.create("md"),
-  lg: z.create("lg"),
-  xl: z.create("xl"),
-  "2xl": z.create("2xl"),
-  inner: z.create("inner")
+const Fe = {
+  none: j.create("none"),
+  sm: j.create("sm"),
+  md: j.create("md"),
+  lg: j.create("lg"),
+  xl: j.create("xl"),
+  "2xl": j.create("2xl"),
+  inner: j.create("inner")
 };
-function P(e) {
-  return Re[e].tailwind;
+function O(e) {
+  return Fe[e].tailwind;
 }
-const ze = M("w-full", {
+const Re = A("w-full", {
   variants: {
     size: {
       sm: "h-1",
@@ -953,7 +953,7 @@ const ze = M("w-full", {
     size: "md",
     variant: "primary"
   }
-}), J = M("transition-all", {
+}), J = A("transition-all", {
   variants: {
     variant: {
       primary: "bg-surface-brand",
@@ -967,17 +967,17 @@ const ze = M("w-full", {
   defaultVariants: {
     variant: "primary"
   }
-}), Me = _(function(b, y) {
-  var m = b, {
-    value: a,
+}), je = z(function(b, y) {
+  var u = b, {
+    value: t,
     max: r = 100,
-    variant: t = "primary",
+    variant: a = "primary",
     size: s = "md",
     showLabel: o = !1,
     label: d,
     "aria-label": c,
-    className: u = ""
-  } = m, g = p(m, [
+    className: p = ""
+  } = u, x = m(u, [
     "value",
     "max",
     "variant",
@@ -987,9 +987,9 @@ const ze = M("w-full", {
     "aria-label",
     "className"
   ]);
-  const h = a === void 0, v = h ? void 0 : Math.min(Math.max(a / r * 100, 0), 100), S = c || (h ? "Loading in progress" : `Progress: ${v == null ? void 0 : v.toFixed(0)}%`);
-  return /* @__PURE__ */ $("div", x(f({ ref: y, className: n("w-full", u) }, g), { children: [
-    o && (d || !h) && /* @__PURE__ */ $(
+  const h = t === void 0, w = h ? void 0 : Math.min(Math.max(t / r * 100, 0), 100), C = c || (h ? "Loading in progress" : `Progress: ${w == null ? void 0 : w.toFixed(0)}%`);
+  return /* @__PURE__ */ v("div", g(f({ ref: y, className: n("w-full", p) }, x), { children: [
+    o && (d || !h) && /* @__PURE__ */ v(
       "div",
       {
         className: n(
@@ -1003,22 +1003,22 @@ const ze = M("w-full", {
             "span",
             {
               className: n(
-                E("bodySmall"),
-                j("label"),
+                k("bodySmall"),
+                M("label"),
                 "text-fg-primary"
               ),
               children: d
             }
           ),
-          !h && v !== void 0 && /* @__PURE__ */ $(
+          !h && w !== void 0 && /* @__PURE__ */ v(
             "span",
             {
               className: n(
-                E("bodySmall"),
+                k("bodySmall"),
                 "text-fg-secondary"
               ),
               children: [
-                v.toFixed(0),
+                w.toFixed(0),
                 "%"
               ]
             }
@@ -1032,15 +1032,15 @@ const ze = M("w-full", {
         role: "progressbar",
         "aria-valuemin": h ? void 0 : 0,
         "aria-valuemax": h ? void 0 : r,
-        "aria-valuenow": h ? void 0 : a,
-        "aria-label": S,
+        "aria-valuenow": h ? void 0 : t,
+        "aria-label": C,
         "aria-busy": h,
         className: n(
           "relative",
           "w-full",
           "overflow-hidden",
-          ze({ size: s, variant: t }),
-          C("full")
+          Re({ size: s, variant: a }),
+          S("full")
         ),
         children: h ? /* @__PURE__ */ l(
           "div",
@@ -1050,8 +1050,8 @@ const ze = M("w-full", {
               "top-0",
               "left-0",
               "bottom-0",
-              J({ variant: t }),
-              C("full"),
+              J({ variant: a }),
+              S("full"),
               "motion-reduce:animate-none"
             ),
             style: {
@@ -1064,14 +1064,14 @@ const ze = M("w-full", {
           {
             className: n(
               "h-full",
-              J({ variant: t }),
-              C("full"),
+              J({ variant: a }),
+              S("full"),
               "transition-all",
               "duration-300",
               "ease-out"
             ),
             style: {
-              width: `${v}%`
+              width: `${w}%`
             },
             "aria-hidden": "true"
           }
@@ -1080,20 +1080,20 @@ const ze = M("w-full", {
     )
   ] }));
 });
-Me.displayName = "Progress";
-const Ve = {
+je.displayName = "Progress";
+const ze = {
   horizontal: "w-full border-t",
   vertical: "h-full border-l self-stretch"
-}, je = {
+}, De = {
   solid: "border-solid",
   dashed: "border-dashed",
   dotted: "border-dotted"
-}, De = D(function(o) {
+}, Me = _(function(o) {
   var d = o, {
-    orientation: a = "horizontal",
+    orientation: t = "horizontal",
     variant: r = "solid",
-    className: t = ""
-  } = d, s = p(d, [
+    className: a = ""
+  } = d, s = m(d, [
     "orientation",
     "variant",
     "className"
@@ -1101,11 +1101,11 @@ const Ve = {
   const c = n(
     "border-0",
     "border-line-default",
-    Ve[a],
-    je[r],
-    t
+    ze[t],
+    De[r],
+    a
   );
-  return a === "vertical" ? /* @__PURE__ */ l(
+  return t === "vertical" ? /* @__PURE__ */ l(
     "div",
     f({
       className: c,
@@ -1121,16 +1121,16 @@ const Ve = {
     }, s)
   );
 });
-De.displayName = "Separator";
-function ft(c) {
-  var u = c, {
+Me.displayName = "Separator";
+function ga(c) {
+  var p = c, {
     variant: e = "text",
-    width: a,
+    width: t,
     height: r,
-    lines: t = 1,
+    lines: a = 1,
     className: s = "",
     "aria-label": o
-  } = u, d = p(u, [
+  } = p, d = m(p, [
     "variant",
     "width",
     "height",
@@ -1138,48 +1138,48 @@ function ft(c) {
     "className",
     "aria-label"
   ]);
-  const g = [
+  const x = [
     "motion-safe:animate-pulse",
     "bg-surface-muted",
-    C("sm")
+    S("sm")
   ], y = {
     text: "h-4",
     card: "h-32",
     list: "h-12",
-    circle: C("full")
-  }, b = n(...g, y[e], s), m = {};
-  a && (m.width = a), r && (m.height = r);
+    circle: S("full")
+  }, b = n(...x, y[e], s), u = {};
+  t && (u.width = t), r && (u.height = r);
   const h = o || `Loading ${e} content`;
-  return e === "text" && t > 1 ? /* @__PURE__ */ l(
+  return e === "text" && a > 1 ? /* @__PURE__ */ l(
     "div",
-    x(f({
+    g(f({
       className: i("sm", "space-y"),
       role: "status",
       "aria-busy": "true",
       "aria-label": h
     }, d), {
-      children: Array.from({ length: t }).map((v, S) => /* @__PURE__ */ l(
+      children: Array.from({ length: a }).map((w, C) => /* @__PURE__ */ l(
         "div",
         {
           className: b,
-          style: S === t - 1 ? { width: "75%" } : m,
+          style: C === a - 1 ? { width: "75%" } : u,
           "aria-hidden": "true"
         },
-        S
+        C
       ))
     })
   ) : /* @__PURE__ */ l(
     "div",
     f({
       className: b,
-      style: m,
+      style: u,
       role: "status",
       "aria-busy": "true",
       "aria-label": h
     }, d)
   );
 }
-const _e = M("motion-safe:animate-spin", {
+const _e = A("motion-safe:animate-spin", {
   variants: {
     size: {
       sm: "h-4 w-4",
@@ -1196,44 +1196,44 @@ const _e = M("motion-safe:animate-spin", {
     size: "md",
     variant: "primary"
   }
-}), Ie = D(function(d) {
+}), Ie = _(function(d) {
   var c = d, {
-    size: a = "md",
+    size: t = "md",
     variant: r = "primary",
-    label: t,
+    label: a,
     className: s = ""
-  } = c, o = p(c, [
+  } = c, o = m(c, [
     "size",
     "variant",
     "label",
     "className"
   ]);
-  return /* @__PURE__ */ $(
+  return /* @__PURE__ */ v(
     "div",
-    x(f({
+    g(f({
       className: n("inline-flex", "items-center", s),
       role: "status",
-      "aria-label": t || "Loading",
+      "aria-label": a || "Loading",
       "aria-live": "polite"
     }, o), {
       children: [
         /* @__PURE__ */ l(
           ce,
           {
-            className: n(_e({ size: a, variant: r })),
+            className: n(_e({ size: t, variant: r })),
             "aria-hidden": "true"
           }
         ),
-        t && /* @__PURE__ */ l(
+        a && /* @__PURE__ */ l(
           "span",
           {
             className: n(
               i("sm", "ml"),
-              E("bodySmall"),
+              k("bodySmall"),
               "text-fg-secondary",
               "sr-only"
             ),
-            children: t
+            children: a
           }
         )
       ]
@@ -1241,7 +1241,7 @@ const _e = M("motion-safe:animate-spin", {
   );
 });
 Ie.displayName = "Spinner";
-const We = {
+const Pe = {
   primary: {
     // exception: variant color — no semantic equivalent (Principle 3, .claude/rules/colors.md)
     light: "text-indigo-400",
@@ -1293,16 +1293,16 @@ const We = {
     contrast: "text-fg-inverse"
   }
 };
-function He(g, u) {
-  var y = g, {
+function We(x, p) {
+  var y = x, {
     variant: e = "paragraph",
-    bold: a,
+    bold: t,
     italic: r,
-    className: t,
+    className: a,
     as: s,
     colorRole: o = "neutral",
     colorShade: d = "dark"
-  } = y, c = p(y, [
+  } = y, c = m(y, [
     "variant",
     "bold",
     "italic",
@@ -1312,40 +1312,40 @@ function He(g, u) {
     "colorShade"
   ]);
   const b = [];
-  let m;
+  let u;
   if (s)
-    m = s;
+    u = s;
   else
     switch (e) {
       case "heading":
-        m = "h2";
+        u = "h2";
         break;
       case "list":
-        m = "li";
+        u = "li";
         break;
       default:
-        m = "p";
+        u = "p";
         break;
     }
-  return e === "heading" ? b.push(R("h2")) : e === "body" || e === "paragraph" ? b.push(R("body")) : e === "bodySmall" ? b.push(R("bodySmall")) : e === "bodyLarge" ? b.push(R("bodyLarge")) : e === "caption" ? b.push(R("caption")) : e === "label" ? b.push(R("label")) : b.push(R("body")), a && b.push("font-bold"), r && b.push("italic"), b.push(We[o][d]), /* @__PURE__ */ l(m, f({ ref: u, className: n(...b, t) }, c));
+  return e === "heading" ? b.push(R("h2")) : e === "body" || e === "paragraph" ? b.push(R("body")) : e === "bodySmall" ? b.push(R("bodySmall")) : e === "bodyLarge" ? b.push(R("bodyLarge")) : e === "caption" ? b.push(R("caption")) : e === "label" ? b.push(R("label")) : b.push(R("body")), t && b.push("font-bold"), r && b.push("italic"), b.push(Pe[o][d]), /* @__PURE__ */ l(u, f({ ref: p, className: n(...b, a) }, c));
 }
-const Q = _(He), Oe = {
+const Q = z(We), He = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",
   lg: "max-w-screen-lg",
   xl: "max-w-screen-xl",
   "2xl": "max-w-screen-2xl",
   full: "max-w-full"
-}, Pe = ee.forwardRef(
-  (u, c) => {
-    var g = u, {
+}, Oe = ee.forwardRef(
+  (p, c) => {
+    var x = p, {
       className: e,
-      maxWidth: a = "lg",
+      maxWidth: t = "lg",
       paddingX: r = "base",
-      paddingY: t = "base",
+      paddingY: a = "base",
       center: s = !0,
       children: o
-    } = g, d = p(g, [
+    } = x, d = m(x, [
       "className",
       "maxWidth",
       "paddingX",
@@ -1355,13 +1355,13 @@ const Q = _(He), Oe = {
     ]);
     return /* @__PURE__ */ l(
       "div",
-      x(f({
+      g(f({
         ref: c,
         className: n(
           "w-full",
-          Oe[a],
+          He[t],
           i(r, "px"),
-          i(t, "py"),
+          i(a, "py"),
           s && "mx-auto",
           e
         )
@@ -1371,17 +1371,17 @@ const Q = _(He), Oe = {
     );
   }
 );
-Pe.displayName = "Container";
+Oe.displayName = "Container";
 const Be = ee.forwardRef(
-  (u, c) => {
-    var g = u, {
+  (p, c) => {
+    var x = p, {
       className: e,
-      spacing: a = "base",
+      spacing: t = "base",
       align: r = "stretch",
-      justify: t = "start",
+      justify: a = "start",
       direction: s = "column",
       children: o
-    } = g, d = p(g, [
+    } = x, d = m(x, [
       "className",
       "spacing",
       "align",
@@ -1389,12 +1389,12 @@ const Be = ee.forwardRef(
       "direction",
       "children"
     ]);
-    const y = s === "column" ? i(a, "gap-y") : i(a, "gap-x"), b = {
+    const y = s === "column" ? i(t, "gap-y") : i(t, "gap-x"), b = {
       start: "items-start",
       center: "items-center",
       end: "items-end",
       stretch: "items-stretch"
-    }, m = {
+    }, u = {
       start: "justify-start",
       center: "justify-center",
       end: "justify-end",
@@ -1404,14 +1404,14 @@ const Be = ee.forwardRef(
     };
     return /* @__PURE__ */ l(
       "div",
-      x(f({
+      g(f({
         ref: c,
         className: n(
           "flex",
           s === "column" ? "flex-col" : "flex-row",
           y,
           b[r],
-          m[t],
+          u[a],
           e
         )
       }, d), {
@@ -1424,9 +1424,9 @@ Be.displayName = "Stack";
 function Ue(s) {
   var o = s, {
     items: e,
-    separator: a = "/",
+    separator: t = "/",
     className: r = ""
-  } = o, t = p(o, [
+  } = o, a = m(o, [
     "items",
     "separator",
     "className"
@@ -1435,16 +1435,16 @@ function Ue(s) {
     "flex",
     "items-center",
     i("sm", "space-x"),
-    E("bodySmall")
+    k("bodySmall")
   ], c = n(...d, r);
-  return /* @__PURE__ */ l("nav", x(f({ "aria-label": "Breadcrumb", className: c }, t), { children: /* @__PURE__ */ l(
+  return /* @__PURE__ */ l("nav", g(f({ "aria-label": "Breadcrumb", className: c }, a), { children: /* @__PURE__ */ l(
     "ol",
     {
       className: n("flex", "items-center", i("sm", "space-x")),
-      children: e.map((u, g) => {
-        const y = g === e.length - 1;
-        return /* @__PURE__ */ $("li", { className: "flex items-center", children: [
-          g > 0 && /* @__PURE__ */ l(
+      children: e.map((p, x) => {
+        const y = x === e.length - 1;
+        return /* @__PURE__ */ v("li", { className: "flex items-center", children: [
+          x > 0 && /* @__PURE__ */ l(
             "span",
             {
               className: n(
@@ -1452,7 +1452,7 @@ function Ue(s) {
                 "text-fg-tertiary"
               ),
               "aria-hidden": "true",
-              children: a
+              children: t
             }
           ),
           y ? /* @__PURE__ */ l(
@@ -1460,15 +1460,15 @@ function Ue(s) {
             {
               className: n(
                 "text-fg-primary",
-                j("label")
+                M("label")
               ),
               "aria-current": "page",
-              children: u.label
+              children: p.label
             }
-          ) : u.href ? /* @__PURE__ */ l(
+          ) : p.href ? /* @__PURE__ */ l(
             "a",
             {
-              href: u.href,
+              href: p.href,
               className: n(
                 "inline-flex",
                 "items-center",
@@ -1476,33 +1476,33 @@ function Ue(s) {
                 i("xs", "pt"),
                 "border-b-2",
                 "border-transparent",
-                E("bodySmall"),
-                j("label"),
+                k("bodySmall"),
+                M("label"),
                 "transition-colors",
                 "text-fg-secondary",
                 "hover:border-line-emphasis",
                 "hover:text-fg-primary"
               ),
-              children: u.label
+              children: p.label
             }
-          ) : /* @__PURE__ */ l("span", { className: "text-fg-secondary", children: u.label })
-        ] }, g);
+          ) : /* @__PURE__ */ l("span", { className: "text-fg-secondary", children: p.label })
+        ] }, x);
       })
     }
   ) }));
 }
-function Ke(t) {
-  var s = t, { children: e, className: a } = s, r = p(s, ["children", "className"]);
+function Ke(a) {
+  var s = a, { children: e, className: t } = s, r = m(s, ["children", "className"]);
   return /* @__PURE__ */ l(
     "div",
-    x(f({
+    g(f({
       className: n(
         "grid items-start",
         i("1.5", "gap"),
         i("base", "mb"),
         "[&:has([data-card-actions])]:grid-cols-[1fr_auto]",
         "[&:has([data-card-actions])>[data-card-actions]]:row-span-full",
-        a
+        t
       )
     }, r), {
       children: e
@@ -1512,20 +1512,20 @@ function Ke(t) {
 function Xe(d) {
   var c = d, {
     children: e,
-    icon: a,
+    icon: t,
     badge: r,
-    as: t = "h2",
+    as: a = "h2",
     className: s
-  } = c, o = p(c, [
+  } = c, o = m(c, [
     "children",
     "icon",
     "badge",
     "as",
     "className"
   ]);
-  return /* @__PURE__ */ $(
-    t,
-    x(f({
+  return /* @__PURE__ */ v(
+    a,
+    g(f({
       className: n(
         "text-base font-semibold text-fg-primary",
         "flex items-center",
@@ -1534,60 +1534,60 @@ function Xe(d) {
       )
     }, o), {
       children: [
-        a ? /* @__PURE__ */ l("span", { className: "shrink-0 inline-flex", children: a }) : null,
+        t ? /* @__PURE__ */ l("span", { className: "shrink-0 inline-flex", children: t }) : null,
         /* @__PURE__ */ l("span", { children: e }),
         r ? /* @__PURE__ */ l("span", { className: "inline-flex", children: r }) : null
       ]
     })
   );
 }
-function qe(t) {
-  var s = t, {
+function qe(a) {
+  var s = a, {
     children: e,
-    className: a
-  } = s, r = p(s, [
+    className: t
+  } = s, r = m(s, [
     "children",
     "className"
   ]);
-  return /* @__PURE__ */ l("p", x(f({ className: n("text-sm text-fg-secondary", a) }, r), { children: e }));
+  return /* @__PURE__ */ l("p", g(f({ className: n("text-sm text-fg-secondary", t) }, r), { children: e }));
 }
-function Ge(t) {
-  var s = t, {
+function Ge(a) {
+  var s = a, {
     children: e,
-    className: a
-  } = s, r = p(s, [
+    className: t
+  } = s, r = m(s, [
     "children",
     "className"
   ]);
   return /* @__PURE__ */ l(
     "div",
-    x(f({
+    g(f({
       "data-card-actions": "",
       className: n(
         "flex items-center self-start",
         i("sm", "gap"),
-        a
+        t
       )
     }, r), {
       children: e
     })
   );
 }
-function Ye(t) {
-  var s = t, { children: e, className: a } = s, r = p(s, ["children", "className"]);
-  return /* @__PURE__ */ l("div", x(f({ className: n(a) }, r), { children: e }));
+function Ye(a) {
+  var s = a, { children: e, className: t } = s, r = m(s, ["children", "className"]);
+  return /* @__PURE__ */ l("div", g(f({ className: n(t) }, r), { children: e }));
 }
-function Ze(g) {
-  var y = g, {
+function Ze(x) {
+  var y = x, {
     variant: e = "default",
-    padding: a = "medium",
+    padding: t = "medium",
     className: r = "",
-    onClick: t,
+    onClick: a,
     "aria-label": s,
     "aria-labelledby": o,
     asSection: d = !1,
     children: c
-  } = y, u = p(y, [
+  } = y, p = m(y, [
     "variant",
     "padding",
     "className",
@@ -1600,24 +1600,24 @@ function Ze(g) {
   typeof process != "undefined" && process.env.NODE_ENV !== "production" && d && !s && !o && console.warn(
     "[Card] `asSection={true}` requires an accessible name. Pass `aria-labelledby` pointing to your Card.Title `id`, or `aria-label`. A <section> without a name is an anonymous landmark that hurts screen-reader navigation."
   );
-  const b = M(
+  const b = A(
     n(
       "bg-surface-base",
-      C("lg"),
+      S("lg"),
       "border",
       "border-line-default",
-      P("sm")
+      O("sm")
     ),
     {
       variants: {
         variant: {
           default: "",
           hover: n(
-            `hover:${P("md")}`,
+            `hover:${O("md")}`,
             "transition-shadow",
             "cursor-pointer"
           ),
-          selected: n("border-line-brand", P("md"))
+          selected: n("border-line-brand", O("md"))
         },
         padding: {
           none: "",
@@ -1631,94 +1631,94 @@ function Ze(g) {
         padding: "medium"
       }
     }
-  ), m = t !== void 0, h = m ? "button" : void 0, v = m ? 0 : void 0, S = n(b({ variant: e, padding: a }), r), L = f({
-    className: S,
+  ), u = a !== void 0, h = u ? "button" : void 0, w = u ? 0 : void 0, C = n(b({ variant: e, padding: t }), r), L = f({
+    className: C,
     role: h,
-    tabIndex: v,
-    onClick: t,
-    onKeyDown: m ? (V) => {
-      m && (V.key === "Enter" || V.key === " ") && (V.preventDefault(), t == null || t());
+    tabIndex: w,
+    onClick: a,
+    onKeyDown: u ? (D) => {
+      u && (D.key === "Enter" || D.key === " ") && (D.preventDefault(), a == null || a());
     } : void 0,
     "aria-label": s,
     "aria-labelledby": o
-  }, u);
-  return d ? /* @__PURE__ */ l("section", x(f({}, L), { children: c })) : /* @__PURE__ */ l("div", x(f({}, L), { children: c }));
+  }, p);
+  return d ? /* @__PURE__ */ l("section", g(f({}, L), { children: c })) : /* @__PURE__ */ l("div", g(f({}, L), { children: c }));
 }
-const te = D(Ze);
-te.displayName = "Card";
-const I = te;
+const ae = _(Ze);
+ae.displayName = "Card";
+const I = ae;
 I.Header = Ke;
 I.Title = Xe;
 I.Subtitle = qe;
 I.Actions = Ge;
 I.Body = Ye;
-function ut(t) {
-  var s = t, {
+function xa(a) {
+  var s = a, {
     children: e,
-    className: a = ""
-  } = s, r = p(s, [
+    className: t = ""
+  } = s, r = m(s, [
     "children",
     "className"
   ]);
   return /* @__PURE__ */ l(
     "div",
-    x(f({
-      className: `flex flex-col ${i("1.5", "space-y")} ${i("lg", "p")} ${i("base", "pb")} ${a}`
+    g(f({
+      className: `flex flex-col ${i("1.5", "space-y")} ${i("lg", "p")} ${i("base", "pb")} ${t}`
     }, r), {
       children: e
     })
   );
 }
-function pt(t) {
-  var s = t, {
+function ba(a) {
+  var s = a, {
     children: e,
-    className: a = ""
-  } = s, r = p(s, [
+    className: t = ""
+  } = s, r = m(s, [
     "children",
     "className"
   ]);
   return /* @__PURE__ */ l(
     "div",
-    x(f({
-      className: `flex flex-col-reverse sm:flex-row sm:justify-end sm:${i("sm", "space-x")} ${i("lg", "p")} ${i("base", "pt")} ${a}`
+    g(f({
+      className: `flex flex-col-reverse sm:flex-row sm:justify-end sm:${i("sm", "space-x")} ${i("lg", "p")} ${i("base", "pt")} ${t}`
     }, r), {
       children: e
     })
   );
 }
-function mt(t) {
-  var s = t, {
+function ha(a) {
+  var s = a, {
     children: e,
-    className: a = ""
-  } = s, r = p(s, [
+    className: t = ""
+  } = s, r = m(s, [
     "children",
     "className"
   ]);
   return /* @__PURE__ */ l(
     "div",
-    x(f({
+    g(f({
       className: `
         ${i("lg", "p")}
         border-b
         border-line-default
-        ${a}
+        ${t}
       `
     }, r), {
       children: e
     })
   );
 }
-function gt(t) {
-  var s = t, {
+function ya(a) {
+  var s = a, {
     children: e,
-    className: a = ""
-  } = s, r = p(s, [
+    className: t = ""
+  } = s, r = m(s, [
     "children",
     "className"
   ]);
   return /* @__PURE__ */ l(
     "div",
-    x(f({
+    g(f({
       className: `
         ${i("lg", "p")}
         border-t
@@ -1726,29 +1726,66 @@ function gt(t) {
         flex
         justify-end
         ${i("sm", "gap")}
-        ${a}
+        ${t}
       `
     }, r), {
       children: e
     })
   );
 }
-function xt({ children: e, className: a }) {
+function va(o) {
+  var d = o, {
+    label: e,
+    children: t,
+    wrap: r = !0,
+    className: a
+  } = d, s = m(d, [
+    "label",
+    "children",
+    "wrap",
+    "className"
+  ]);
+  const p = !(s["aria-label"] != null || s["aria-labelledby"] != null) && typeof e == "string" && e !== "" ? e : void 0;
+  return /* @__PURE__ */ v(
+    "div",
+    g(f({
+      role: "group",
+      "aria-label": p,
+      className: n(
+        "flex items-center",
+        r ? "flex-wrap" : "flex-nowrap",
+        i("sm", "gap"),
+        a
+      )
+    }, s), {
+      children: [
+        e ? (
+          // shrink-0 keeps the label a stable leading unit: in the wrapping
+          // flex run it must not be squeezed or mid-word-wrapped when the
+          // chips overflow — it stays on one line and the chips wrap around it.
+          /* @__PURE__ */ l("span", { className: "shrink-0 text-fg-secondary text-sm", children: e })
+        ) : null,
+        t
+      ]
+    })
+  );
+}
+function wa({ children: e, className: t }) {
   return /* @__PURE__ */ l(
     "div",
     {
       className: n(
         "flex-shrink-0 flex items-center",
         i("sm", "gap"),
-        a
+        t
       ),
       children: e
     }
   );
 }
-function bt({
+function Na({
   children: e,
-  className: a
+  className: t
 }) {
   return /* @__PURE__ */ l(
     "nav",
@@ -1758,17 +1795,17 @@ function bt({
         i("base", "gap"),
         "hidden md:flex",
         // Hidden on mobile, visible on desktop
-        a
+        t
       ),
       "aria-label": "Main navigation",
       children: e
     }
   );
 }
-function ht(r) {
-  var t = r, {
+function $a(r) {
+  var a = r, {
     className: e = ""
-  } = t, a = p(t, [
+  } = a, t = m(a, [
     "className"
   ]);
   return /* @__PURE__ */ l(
@@ -1781,21 +1818,21 @@ function ht(r) {
         ${i("sm", "my")}
         ${e}
       `
-    }, a)
+    }, t)
   );
 }
-function yt(t) {
-  var s = t, {
+function Sa(a) {
+  var s = a, {
     orientation: e = "horizontal",
-    className: a = ""
-  } = s, r = p(s, [
+    className: t = ""
+  } = s, r = m(s, [
     "orientation",
     "className"
   ]);
   return e === "vertical" ? /* @__PURE__ */ l(
     "div",
     f({
-      className: n("w-px", "h-6", "bg-line-default", "mx-auto", a),
+      className: n("w-px", "h-6", "bg-line-default", "mx-auto", t),
       role: "separator",
       "aria-orientation": "vertical"
     }, r)
@@ -1810,7 +1847,7 @@ function yt(t) {
         // my-2 (8px) para consistência com gap-2 usado em outros lugares
         "flex-shrink-0",
         // Prevenir que separator encolha
-        a
+        t
       ),
       role: "separator",
       "aria-orientation": "horizontal",
@@ -1822,7 +1859,7 @@ function yt(t) {
     }, r)
   );
 }
-const Je = M(
+const Je = A(
   // Base classes
   n("w-full", "flex", "flex-col", i("sm", "gap")),
   {
@@ -1837,15 +1874,15 @@ const Je = M(
     }
   }
 );
-function vt(c) {
-  var u = c, {
+function Ca(c) {
+  var p = c, {
     title: e,
-    description: a,
+    description: t,
     breadcrumb: r,
-    actions: t,
+    actions: a,
     variant: s = "default",
     className: o
-  } = u, d = p(u, [
+  } = p, d = m(p, [
     "title",
     "description",
     "breadcrumb",
@@ -1853,14 +1890,14 @@ function vt(c) {
     "variant",
     "className"
   ]);
-  return /* @__PURE__ */ $("div", x(f({ className: n(Je({ variant: s }), o) }, d), { children: [
+  return /* @__PURE__ */ v("div", g(f({ className: n(Je({ variant: s }), o) }, d), { children: [
     r && r.length > 0 && /* @__PURE__ */ l(Ue, { items: r }),
-    /* @__PURE__ */ $(
+    /* @__PURE__ */ v(
       "div",
       {
         className: `flex items-start justify-between ${i("base", "gap")}`,
         children: [
-          /* @__PURE__ */ $("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ v("div", { className: "flex-1 min-w-0", children: [
             /* @__PURE__ */ l(
               Q,
               {
@@ -1870,13 +1907,13 @@ function vt(c) {
                 children: e
               }
             ),
-            a && /* @__PURE__ */ l(Q, { variant: "body", className: "text-fg-secondary", children: a })
+            t && /* @__PURE__ */ l(Q, { variant: "body", className: "text-fg-secondary", children: t })
           ] }),
-          t && /* @__PURE__ */ l(
+          a && /* @__PURE__ */ l(
             "div",
             {
               className: `flex items-center ${i("sm", "gap")} flex-shrink-0`,
-              children: t
+              children: a
             }
           )
         ]
@@ -1887,22 +1924,22 @@ function vt(c) {
 const Qe = {
   start: "items-start text-left",
   center: "items-center text-center"
-}, et = {
+}, ea = {
   neutral: "text-fg-tertiary",
   success: "text-fg-success",
   warning: "text-fg-warning",
   error: "text-fg-error"
 };
-function wt(u) {
-  var g = u, {
+function ka(p) {
+  var x = p, {
     value: e,
-    label: a,
+    label: t,
     hint: r,
-    icon: t,
+    icon: a,
     align: s = "start",
     tone: o = "neutral",
     className: d
-  } = g, c = p(g, [
+  } = x, c = m(x, [
     "value",
     "label",
     "hint",
@@ -1912,9 +1949,9 @@ function wt(u) {
     "className"
   ]);
   const y = e == null;
-  return /* @__PURE__ */ $(
+  return /* @__PURE__ */ v(
     "div",
-    x(f({
+    g(f({
       className: n(
         "bg-surface-base flex-1 flex flex-col",
         i("base", "p"),
@@ -1924,7 +1961,7 @@ function wt(u) {
       )
     }, c), {
       children: [
-        t ? /* @__PURE__ */ l("span", { className: "text-icon-default inline-flex", children: t }) : null,
+        a ? /* @__PURE__ */ l("span", { className: "text-icon-default inline-flex", children: a }) : null,
         y ? /* @__PURE__ */ l(
           "span",
           {
@@ -1933,24 +1970,24 @@ function wt(u) {
             children: "—"
           }
         ) : /* @__PURE__ */ l("span", { className: "text-fg-primary text-2xl font-semibold leading-tight", children: e }),
-        /* @__PURE__ */ l("span", { className: "text-fg-secondary text-sm", children: a }),
-        r ? /* @__PURE__ */ l("span", { className: n("text-xs", et[o]), children: r }) : null
+        /* @__PURE__ */ l("span", { className: "text-fg-secondary text-sm", children: t }),
+        r ? /* @__PURE__ */ l("span", { className: n("text-xs", ea[o]), children: r }) : null
       ]
     })
   );
 }
-const tt = {
+const aa = {
   2: "md:grid-cols-2",
   3: "md:grid-cols-3",
   4: "md:grid-cols-4"
 };
-function Nt(o) {
+function Ea(o) {
   var d = o, {
     layout: e = "grid",
-    cols: a = 4,
+    cols: t = 4,
     className: r,
-    children: t
-  } = d, s = p(d, [
+    children: a
+  } = d, s = m(d, [
     "layout",
     "cols",
     "className",
@@ -1959,52 +1996,164 @@ function Nt(o) {
   const c = e === "grid";
   return /* @__PURE__ */ l(
     "div",
-    x(f({
+    g(f({
       className: n(
         "bg-line-default border border-line-default overflow-hidden gap-px",
-        C("lg"),
-        c ? `grid grid-cols-2 ${tt[a]}` : "flex",
+        S("lg"),
+        c ? `grid grid-cols-2 ${aa[t]}` : "flex",
         r
       )
     }, s), {
-      children: t
+      children: a
     })
   );
 }
-function $t(s) {
-  var o = s, { column: e, row: a, className: r = "" } = o, t = p(o, ["column", "row", "className"]);
-  const d = e.key in a ? a[e.key] : void 0;
+function Ta(s) {
+  var o = s, { column: e, row: t, className: r = "" } = o, a = m(o, ["column", "row", "className"]);
+  const d = e.key in t ? t[e.key] : void 0;
   return /* @__PURE__ */ l(
     "td",
-    x(f({
+    g(f({
       className: `${i("lg", "px")} ${i("base", "py")} whitespace-nowrap text-sm text-fg-primary ${e.hiddenOnMobile ? "hidden md:table-cell" : ""} ${r}`
-    }, t), {
-      children: e.render ? e.render(d, a) : String(d != null ? d : "")
+    }, a), {
+      children: e.render ? e.render(d, t) : String(d != null ? d : "")
     })
   );
 }
-function St({
+const ta = A(n("flex items-center", "border-b"), {
+  variants: {
+    variant: {
+      default: n("border-line-default", i("base", "gap-x")),
+      sub: n("border-line-muted", i("sm", "gap-x"))
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+}), ra = A(
+  n(
+    "relative -mb-px inline-flex items-center",
+    i("xs", "gap-x"),
+    "border-b-2 border-transparent",
+    "transition-colors",
+    "focus:outline-none",
+    "focus-visible:ring-2",
+    "focus-visible:ring-line-focus",
+    "focus-visible:ring-offset-2",
+    S("sm")
+  ),
+  {
+    variants: {
+      variant: {
+        default: n(
+          i("sm", "px"),
+          i("sm", "py"),
+          k("body")
+        ),
+        sub: n(
+          i("sm", "px"),
+          i("xs", "py"),
+          k("bodySmall")
+        )
+      },
+      active: {
+        true: n("border-line-brand", "text-fg-brand-emphasis", "font-medium"),
+        false: n(
+          "text-fg-secondary",
+          "hover:text-fg-primary",
+          "hover:border-line-muted"
+        )
+      }
+    },
+    compoundVariants: [
+      // Sub-tabs sit lower in the hierarchy: lighter resting foreground.
+      {
+        variant: "sub",
+        active: !1,
+        class: n("text-fg-tertiary", "hover:text-fg-secondary")
+      }
+    ],
+    defaultVariants: {
+      variant: "default",
+      active: !1
+    }
+  }
+), sa = n(
+  "inline-flex items-center justify-center",
+  S("full"),
+  i("xs", "px"),
+  "bg-surface-muted text-fg-secondary text-xs"
+), na = z(
+  function(x, p) {
+    var y = x, {
+      items: t,
+      variant: r = "default",
+      linkComponent: a,
+      className: s,
+      "aria-label": o,
+      "aria-labelledby": d
+    } = y, c = m(y, [
+      "items",
+      "variant",
+      "linkComponent",
+      "className",
+      "aria-label",
+      "aria-labelledby"
+    ]);
+    typeof process != "undefined" && process.env.NODE_ENV !== "production" && !o && !d && console.warn(
+      '[TabsAsLinks] renders a <nav> landmark and should have an accessible name. Pass `aria-label` (e.g. "Painel") or `aria-labelledby` — multiple unnamed navs on a page are ambiguous to screen readers.'
+    );
+    const b = a != null ? a : "a";
+    return /* @__PURE__ */ l(
+      "nav",
+      g(f({
+        ref: p,
+        className: n(ta({ variant: r }), s),
+        "aria-label": o,
+        "aria-labelledby": d
+      }, c), {
+        children: t.map((u, h) => /* @__PURE__ */ v(
+          b,
+          {
+            href: u.href,
+            "aria-current": u.active ? "page" : void 0,
+            "data-active": u.active ? "true" : void 0,
+            className: ra({ variant: r, active: !!u.active }),
+            children: [
+              u.icon ? /* @__PURE__ */ l("span", { "aria-hidden": "true", className: "inline-flex shrink-0", children: u.icon }) : null,
+              /* @__PURE__ */ l("span", { children: u.label }),
+              u.count !== void 0 ? /* @__PURE__ */ l("span", { className: sa, children: u.count }) : null
+            ]
+          },
+          u.href || h
+        ))
+      })
+    );
+  }
+);
+na.displayName = "TabsAsLinks";
+function La({
   items: e,
-  orientation: a = "vertical",
+  orientation: t = "vertical",
   className: r = ""
 }) {
-  return a === "horizontal" ? /* @__PURE__ */ l("div", { className: `flex items-start ${r}`, children: e.map((t, s) => {
-    const o = t.status || (s === 0 ? "active" : s < e.findIndex((c) => c.status === "active") ? "completed" : "default"), d = s === e.length - 1;
-    return /* @__PURE__ */ l("div", { className: "flex items-start flex-1", children: /* @__PURE__ */ $("div", { className: "flex flex-col items-center flex-1", children: [
+  return t === "horizontal" ? /* @__PURE__ */ l("div", { className: `flex items-start ${r}`, children: e.map((a, s) => {
+    const o = a.status || (s === 0 ? "active" : s < e.findIndex((c) => c.status === "active") ? "completed" : "default"), d = s === e.length - 1;
+    return /* @__PURE__ */ l("div", { className: "flex items-start flex-1", children: /* @__PURE__ */ v("div", { className: "flex flex-col items-center flex-1", children: [
       /* @__PURE__ */ l(
         "div",
-        x(f({}, o === "default" ? { "data-marker": "pending" } : {}), {
+        g(f({}, o === "default" ? { "data-marker": "pending" } : {}), {
           className: `
                   flex
                   items-center
                   justify-center
                   w-10
                   h-10
-                  ${C("full")}
+                  ${S("full")}
                   border-2
                   ${o === "completed" ? "bg-success border-success text-fg-inverse" : o === "active" ? "bg-surface-brand-strong border-line-brand text-fg-inverse" : o === "error" ? "bg-error border-error text-fg-inverse" : "bg-surface-base border-line-emphasis text-fg-quaternary"}
                 `,
-          children: t.icon || (o === "completed" ? /* @__PURE__ */ l(q, { className: "h-4 w-4" }) : s + 1)
+          children: a.icon || (o === "completed" ? /* @__PURE__ */ l(q, { className: "h-4 w-4" }) : s + 1)
         })
       ),
       !d && /* @__PURE__ */ l(
@@ -2018,53 +2167,53 @@ function St({
                     `
         }
       ),
-      /* @__PURE__ */ $(
+      /* @__PURE__ */ v(
         "div",
         {
           className: `${i("base", "mt")} text-center ${i("base", "px")}`,
           children: [
-            t.timestamp && /* @__PURE__ */ l(
+            a.timestamp && /* @__PURE__ */ l(
               "p",
               {
                 className: `text-xs text-fg-tertiary ${i("xs", "mb")}`,
-                children: t.timestamp
+                children: a.timestamp
               }
             ),
-            /* @__PURE__ */ l("h3", { className: "text-sm font-semibold text-fg-primary", children: t.title }),
-            t.description && /* @__PURE__ */ l(
+            /* @__PURE__ */ l("h3", { className: "text-sm font-semibold text-fg-primary", children: a.title }),
+            a.description && /* @__PURE__ */ l(
               "p",
               {
                 className: `text-xs text-fg-secondary ${i("xs", "mt")}`,
-                children: t.description
+                children: a.description
               }
             ),
-            t.content && /* @__PURE__ */ l("div", { className: i("sm", "mt"), children: t.content })
+            a.content && /* @__PURE__ */ l("div", { className: i("sm", "mt"), children: a.content })
           ]
         }
       )
-    ] }) }, t.id);
-  }) }) : /* @__PURE__ */ l("div", { className: `${i("none", "space-y")} ${r}`, children: e.map((t, s) => {
-    const o = t.status || (s === 0 ? "active" : s < e.findIndex((c) => c.status === "active") ? "completed" : "default"), d = s === e.length - 1;
-    return /* @__PURE__ */ $(
+    ] }) }, a.id);
+  }) }) : /* @__PURE__ */ l("div", { className: `${i("none", "space-y")} ${r}`, children: e.map((a, s) => {
+    const o = a.status || (s === 0 ? "active" : s < e.findIndex((c) => c.status === "active") ? "completed" : "default"), d = s === e.length - 1;
+    return /* @__PURE__ */ v(
       "div",
       {
         className: `flex items-start ${i("base", "gap")}`,
         children: [
-          /* @__PURE__ */ $("div", { className: "flex flex-col items-center", children: [
+          /* @__PURE__ */ v("div", { className: "flex flex-col items-center", children: [
             /* @__PURE__ */ l(
               "div",
-              x(f({}, o === "default" ? { "data-marker": "pending" } : {}), {
+              g(f({}, o === "default" ? { "data-marker": "pending" } : {}), {
                 className: `
                 flex
                 items-center
                 justify-center
                 w-10
                 h-10
-                ${C("full")}
+                ${S("full")}
                 border-2
                 ${o === "completed" ? "bg-success border-success text-fg-inverse" : o === "active" ? "bg-surface-brand-strong border-line-brand text-fg-inverse" : o === "error" ? "bg-error border-error text-fg-inverse" : "bg-surface-base border-line-emphasis text-fg-quaternary"}
               `,
-                children: t.icon || (o === "completed" ? /* @__PURE__ */ l(q, { className: "h-4 w-4" }) : s + 1)
+                children: a.icon || (o === "completed" ? /* @__PURE__ */ l(q, { className: "h-4 w-4" }) : s + 1)
               })
             ),
             !d && /* @__PURE__ */ l(
@@ -2080,12 +2229,12 @@ function St({
               }
             )
           ] }),
-          /* @__PURE__ */ $("div", { className: `flex-1 ${i("xl", "pb")}`, children: [
-            t.timestamp && /* @__PURE__ */ l(
+          /* @__PURE__ */ v("div", { className: `flex-1 ${i("xl", "pb")}`, children: [
+            a.timestamp && /* @__PURE__ */ l(
               "p",
               {
                 className: `text-xs text-fg-tertiary ${i("xs", "mb")}`,
-                children: t.timestamp
+                children: a.timestamp
               }
             ),
             /* @__PURE__ */ l(
@@ -2096,21 +2245,21 @@ function St({
                 font-semibold
                 ${o === "active" ? "text-fg-brand-emphasis" : "text-fg-primary"}
               `,
-                children: t.title
+                children: a.title
               }
             ),
-            t.description && /* @__PURE__ */ l(
+            a.description && /* @__PURE__ */ l(
               "p",
               {
                 className: `text-sm text-fg-secondary ${i("xs", "mt")}`,
-                children: t.description
+                children: a.description
               }
             ),
-            t.content && /* @__PURE__ */ l("div", { className: i("md", "mt"), children: t.content })
+            a.content && /* @__PURE__ */ l("div", { className: i("md", "mt"), children: a.content })
           ] })
         ]
       },
-      t.id
+      a.id
     );
   }) });
 }
@@ -2124,28 +2273,30 @@ export {
   qe as CardSubtitle,
   Xe as CardTitle,
   Te as Chip,
-  Pe as Container,
-  pt as DialogFooter,
-  ut as DialogHeader,
-  gt as DrawerFooter,
-  mt as DrawerHeader,
-  dt as ErrorMessage,
-  xt as HeaderActions,
-  bt as HeaderNavigation,
-  ct as Info,
-  Fe as Label,
-  ht as MenuSeparator,
-  yt as NavbarSeparator,
-  vt as PageHeader,
-  Me as Progress,
-  De as Separator,
-  ft as Skeleton,
+  Oe as Container,
+  ba as DialogFooter,
+  xa as DialogHeader,
+  ya as DrawerFooter,
+  ha as DrawerHeader,
+  pa as ErrorMessage,
+  va as FilterChips,
+  wa as HeaderActions,
+  Na as HeaderNavigation,
+  ma as Info,
+  Ve as Label,
+  $a as MenuSeparator,
+  Sa as NavbarSeparator,
+  Ca as PageHeader,
+  je as Progress,
+  Me as Separator,
+  ga as Skeleton,
   Ie as Spinner,
   Be as Stack,
-  wt as Stat,
-  Nt as StatGroup,
-  $t as TableCell,
+  ka as Stat,
+  Ea as StatGroup,
+  Ta as TableCell,
+  na as TabsAsLinks,
   Q as Text,
-  St as Timeline
+  La as Timeline
 };
 //# sourceMappingURL=index.js.map