@fabio.caffarello/react-design-system 3.1.0 → 3.3.0

package/dist/server/index.js

@@ -1,113 +1,38 @@
-var ne = Object.defineProperty, ie = Object.defineProperties;
-var se = Object.getOwnPropertyDescriptors;
-var _ = Object.getOwnPropertySymbols;
-var K = Object.prototype.hasOwnProperty, X = Object.prototype.propertyIsEnumerable;
-var H = (t, a, n) => a in t ? ne(t, a, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[a] = n, b = (t, a) => {
+var se = Object.defineProperty, le = Object.defineProperties;
+var oe = Object.getOwnPropertyDescriptors;
+var P = Object.getOwnPropertySymbols;
+var Z = Object.prototype.hasOwnProperty, G = Object.prototype.propertyIsEnumerable;
+var K = (r, a, n) => a in r ? se(r, a, { enumerable: !0, configurable: !0, writable: !0, value: n }) : r[a] = n, m = (r, a) => {
   for (var n in a || (a = {}))
-    K.call(a, n) && H(t, n, a[n]);
-  if (_)
-    for (var n of _(a))
-      X.call(a, n) && H(t, n, a[n]);
-  return t;
-}, w = (t, a) => ie(t, se(a));
-var y = (t, a) => {
+    Z.call(a, n) && K(r, n, a[n]);
+  if (P)
+    for (var n of P(a))
+      G.call(a, n) && K(r, n, a[n]);
+  return r;
+}, v = (r, a) => le(r, oe(a));
+var h = (r, a) => {
   var n = {};
-  for (var r in t)
-    K.call(t, r) && a.indexOf(r) < 0 && (n[r] = t[r]);
-  if (t != null && _)
-    for (var r of _(t))
-      a.indexOf(r) < 0 && X.call(t, r) && (n[r] = t[r]);
+  for (var t in r)
+    Z.call(r, t) && a.indexOf(t) < 0 && (n[t] = r[t]);
+  if (r != null && P)
+    for (var t of P(r))
+      a.indexOf(t) < 0 && G.call(r, t) && (n[t] = r[t]);
   return n;
 };
-var Y = (t, a, n) => H(t, typeof a != "symbol" ? a + "" : a, n);
-import { jsx as o, jsxs as T } from "react/jsx-runtime";
+var Q = (r, a, n) => K(r, typeof a != "symbol" ? a + "" : a, n);
+import { jsx as d, jsxs as C } from "react/jsx-runtime";
 import * as S from "react";
-import ee, { forwardRef as O, memo as le } from "react";
-import { X as oe, AlertCircle as ce, Loader2 as de, CheckCircle2 as Z } from "lucide-react";
-import { clsx as fe } from "clsx";
-import { twMerge as pe } from "tailwind-merge";
-import { cva as ue } from "class-variance-authority";
-function G(t, a) {
-  if (typeof t == "function")
-    return t(a);
-  t != null && (t.current = a);
-}
-function me(...t) {
-  return (a) => {
-    let n = !1;
-    const r = t.map((i) => {
-      const s = G(i, a);
-      return !n && typeof s == "function" && (n = !0), s;
-    });
-    if (n)
-      return () => {
-        for (let i = 0; i < r.length; i++) {
-          const s = r[i];
-          typeof s == "function" ? s() : G(t[i], null);
-        }
-      };
-  };
-}
-var be = /* @__PURE__ */ Symbol.for("react.lazy"), V = S[" use ".trim().toString()];
-function ge(t) {
-  return typeof t == "object" && t !== null && "then" in t;
-}
-function ae(t) {
-  return t != null && typeof t == "object" && "$$typeof" in t && t.$$typeof === be && "_payload" in t && ge(t._payload);
-}
-// @__NO_SIDE_EFFECTS__
-function xe(t) {
-  const a = /* @__PURE__ */ ye(t), n = S.forwardRef((r, i) => {
-    let m = r, { children: s } = m, c = y(m, ["children"]);
-    ae(s) && typeof V == "function" && (s = V(s._payload));
-    const d = S.Children.toArray(s), p = d.find(ve);
-    if (p) {
-      const u = p.props.children, x = d.map((h) => h === p ? S.Children.count(u) > 1 ? S.Children.only(null) : S.isValidElement(u) ? u.props.children : null : h);
-      return /* @__PURE__ */ o(a, w(b({}, c), { ref: i, children: S.isValidElement(u) ? S.cloneElement(u, void 0, x) : null }));
-    }
-    return /* @__PURE__ */ o(a, w(b({}, c), { ref: i, children: s }));
-  });
-  return n.displayName = `${t}.Slot`, n;
-}
-var he = /* @__PURE__ */ xe("Slot");
-// @__NO_SIDE_EFFECTS__
-function ye(t) {
-  const a = S.forwardRef((n, r) => {
-    let c = n, { children: i } = c, s = y(c, ["children"]);
-    if (ae(i) && typeof V == "function" && (i = V(i._payload)), S.isValidElement(i)) {
-      const d = $e(i), p = ke(s, i.props);
-      return i.type !== S.Fragment && (p.ref = r ? me(r, d) : d), S.cloneElement(i, p);
-    }
-    return S.Children.count(i) > 1 ? S.Children.only(null) : null;
-  });
-  return a.displayName = `${t}.SlotClone`, a;
-}
-var we = /* @__PURE__ */ Symbol("radix.slottable");
-function ve(t) {
-  return S.isValidElement(t) && typeof t.type == "function" && "__radixId" in t.type && t.type.__radixId === we;
-}
-function ke(t, a) {
-  const n = b({}, a);
-  for (const r in a) {
-    const i = t[r], s = a[r];
-    /^on[A-Z]/.test(r) ? i && s ? n[r] = (...d) => {
-      const p = s(...d);
-      return i(...d), p;
-    } : i && (n[r] = i) : r === "style" ? n[r] = b(b({}, i), s) : r === "className" && (n[r] = [i, s].filter(Boolean).join(" "));
-  }
-  return b(b({}, t), n);
-}
-function $e(t) {
-  var r, i;
-  let a = (r = Object.getOwnPropertyDescriptor(t.props, "ref")) == null ? void 0 : r.get, n = a && "isReactWarning" in a && a.isReactWarning;
-  return n ? t.ref : (a = (i = Object.getOwnPropertyDescriptor(t, "ref")) == null ? void 0 : i.get, n = a && "isReactWarning" in a && a.isReactWarning, n ? t.props.ref : t.props.ref || t.ref);
-}
+import re, { memo as H, forwardRef as j } from "react";
+import { clsx as de } from "clsx";
+import { twMerge as ce } from "tailwind-merge";
+import { cva as fe } from "class-variance-authority";
+import { X as pe, AlertCircle as ue, Loader2 as me, CheckCircle2 as J } from "lucide-react";
 class I {
   /**
    * Create a radius token
    */
   static create(a) {
-    const r = {
+    const t = {
       none: {
         px: 0,
         tailwind: "rounded-none",
@@ -150,15 +75,15 @@ class I {
       }
     }[a];
     return {
-      value: r.px,
-      rem: `${r.px / 16}rem`,
-      px: `${r.px}px`,
-      tailwind: r.tailwind,
-      description: r.description
+      value: t.px,
+      rem: `${t.px / 16}rem`,
+      px: `${t.px}px`,
+      tailwind: t.tailwind,
+      description: t.description
     };
   }
 }
-const Ne = {
+const be = {
   none: I.create("none"),
   sm: I.create("sm"),
   md: I.create("md"),
@@ -168,19 +93,19 @@ const Ne = {
   "3xl": I.create("3xl"),
   full: I.create("full")
 };
-function F(t) {
-  return Ne[t].tailwind;
+function M(r) {
+  return be[r].tailwind;
 }
-class v {
+class k {
   // 4px base
   /**
    * Create a spacing token from scale value
    */
   static create(a) {
-    const n = a * this.BASE_UNIT, r = n / 16;
+    const n = a * this.BASE_UNIT, t = n / 16;
     return {
       value: n,
-      rem: `${r}rem`,
+      rem: `${t}rem`,
       px: `${n}px`,
       tailwind: this.getTailwindClass(a)
     };
@@ -238,46 +163,46 @@ class v {
     }[a] || String(a);
   }
 }
-Y(v, "BASE_UNIT", 4);
-const Se = {
+Q(k, "BASE_UNIT", 4);
+const ge = {
   // Micro spacing (0-14px)
-  none: v.create(0),
-  "0.5": v.create(0.5),
+  none: k.create(0),
+  "0.5": k.create(0.5),
   // 2px (half-step)
-  xs: v.create(1),
+  xs: k.create(1),
   // 4px
-  "1.5": v.create(1.5),
+  "1.5": k.create(1.5),
   // 6px (half-step)
-  sm: v.create(2),
+  sm: k.create(2),
   // 8px
-  "2.5": v.create(2.5),
+  "2.5": k.create(2.5),
   // 10px (half-step)
-  md: v.create(3),
+  md: k.create(3),
   // 12px
-  "3.5": v.create(3.5),
+  "3.5": k.create(3.5),
   // 14px (half-step)
   // Standard spacing (16-32px)
-  base: v.create(4),
+  base: k.create(4),
   // 16px
-  lg: v.create(6),
+  lg: k.create(6),
   // 24px
-  xl: v.create(8),
+  xl: k.create(8),
   // 32px
   // Large spacing (40-64px)
-  "2xl": v.create(10),
+  "2xl": k.create(10),
   // 40px
-  "3xl": v.create(12),
+  "3xl": k.create(12),
   // 48px
-  "4xl": v.create(16),
+  "4xl": k.create(16),
   // 64px
   // Extra large spacing (80px+)
-  "5xl": v.create(20),
+  "5xl": k.create(20),
   // 80px
-  "6xl": v.create(24)
+  "6xl": k.create(24)
   // 96px
 };
-function l(t, a = "p") {
-  const r = Se[t].tailwind;
+function o(r, a = "p") {
+  const t = ge[r].tailwind;
   return `${{
     p: "p",
     m: "m",
@@ -298,14 +223,14 @@ function l(t, a = "p") {
     "gap-y": "gap-y",
     "space-x": "space-x",
     "space-y": "space-y"
-  }[a]}-${r}`;
+  }[a]}-${t}`;
 }
-class k {
+class $ {
   /**
    * Create font size token
    */
   static createFontSize(a) {
-    const r = {
+    const t = {
       "2xs": { px: 10, tailwind: "text-2xs" },
       // micro-text (badge counters, mini chips)
       xs: { px: 12, tailwind: "text-xs" },
@@ -320,17 +245,17 @@ class k {
       "6xl": { px: 60, tailwind: "text-6xl" }
     }[a];
     return {
-      value: r.px,
-      rem: `${r.px / 16}rem`,
-      px: `${r.px}px`,
-      tailwind: r.tailwind
+      value: t.px,
+      rem: `${t.px / 16}rem`,
+      px: `${t.px}px`,
+      tailwind: t.tailwind
     };
   }
   /**
    * Create line height token
    */
   static createLineHeight(a) {
-    const r = {
+    const t = {
       none: { value: 1, tailwind: "leading-none" },
       tight: { value: 1.25, tailwind: "leading-tight" },
       snug: { value: 1.375, tailwind: "leading-snug" },
@@ -339,15 +264,15 @@ class k {
       loose: { value: 2, tailwind: "leading-loose" }
     }[a];
     return {
-      value: r.value,
-      tailwind: r.tailwind
+      value: t.value,
+      tailwind: t.tailwind
     };
   }
   /**
    * Create font weight token
    */
   static createFontWeight(a) {
-    const r = {
+    const t = {
       light: { value: 300, tailwind: "font-light" },
       normal: { value: 400, tailwind: "font-normal" },
       medium: { value: 500, tailwind: "font-medium" },
@@ -355,83 +280,337 @@ class k {
       bold: { value: 700, tailwind: "font-bold" }
     }[a];
     return {
-      value: r.value,
-      tailwind: r.tailwind
+      value: t.value,
+      tailwind: t.tailwind
     };
   }
   /**
    * Create complete typography token
    */
-  static create(a, n = "normal", r = "normal") {
+  static create(a, n = "normal", t = "normal") {
     return {
       fontSize: this.createFontSize(a),
       lineHeight: this.createLineHeight(n),
-      fontWeight: this.createFontWeight(r)
+      fontWeight: this.createFontWeight(t)
     };
   }
 }
-k.createFontWeight("light"), k.createFontWeight("normal"), k.createFontWeight("medium"), k.createFontWeight("semibold"), k.createFontWeight("bold");
-const U = {
+$.createFontWeight("light"), $.createFontWeight("normal"), $.createFontWeight("medium"), $.createFontWeight("semibold"), $.createFontWeight("bold");
+const Y = {
   // Headings
-  h1: k.create("4xl", "tight", "bold"),
-  h2: k.create("3xl", "tight", "bold"),
-  h3: k.create("2xl", "snug", "semibold"),
-  h4: k.create("xl", "snug", "semibold"),
-  h5: k.create("lg", "normal", "medium"),
-  h6: k.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: k.create("base", "relaxed", "normal"),
-  bodySmall: k.create("sm", "relaxed", "normal"),
-  bodyLarge: k.create("lg", "relaxed", "normal"),
+  body: $.create("base", "relaxed", "normal"),
+  bodySmall: $.create("sm", "relaxed", "normal"),
+  bodyLarge: $.create("lg", "relaxed", "normal"),
   // UI elements
-  label: k.create("sm", "normal", "medium"),
-  caption: k.create("xs", "normal", "normal"),
-  button: k.create("base", "normal", "medium")
+  label: $.create("sm", "normal", "medium"),
+  caption: $.create("xs", "normal", "normal"),
+  button: $.create("base", "normal", "medium")
 };
-function R(t) {
-  const a = U[t];
+function D(r) {
+  const a = Y[r];
   return `${a.fontSize.tailwind} ${a.lineHeight.tailwind} ${a.fontWeight.tailwind}`;
 }
-function E(t) {
-  return U[t].fontSize.tailwind;
+function L(r) {
+  return Y[r].fontSize.tailwind;
+}
+function B(r) {
+  return Y[r].fontWeight.tailwind;
+}
+function l(...r) {
+  return ce(de(r));
+}
+const R = (r, a) => {
+  const n = fe(r, a);
+  return ((t) => {
+    const i = n(t);
+    return l(i);
+  });
+}, xe = R(
+  // Base classes
+  l(
+    "inline-flex",
+    "items-center",
+    "justify-center",
+    B("label"),
+    M("md"),
+    "border"
+  ),
+  {
+    variants: {
+      variant: {
+        success: "",
+        warning: "",
+        error: "",
+        info: "",
+        neutral: "",
+        primary: "",
+        secondary: ""
+      },
+      size: {
+        sm: l(
+          o("1.5", "px"),
+          o("0.5", "py"),
+          L("caption")
+        ),
+        md: l(
+          o("sm", "px"),
+          o("xs", "py"),
+          L("caption")
+        ),
+        lg: l(
+          o("sm", "px"),
+          o("xs", "py"),
+          L("bodySmall")
+        )
+      },
+      style: {
+        solid: "",
+        outline: ""
+      }
+    },
+    compoundVariants: [
+      // Solid style variants
+      {
+        variant: "success",
+        style: "solid",
+        class: l("bg-success-bg", "text-success-dark", "border-success")
+      },
+      {
+        variant: "warning",
+        style: "solid",
+        class: l("bg-warning-bg", "text-warning-dark", "border-warning")
+      },
+      {
+        variant: "error",
+        style: "solid",
+        class: l("bg-error-bg", "text-error-dark", "border-error")
+      },
+      {
+        variant: "info",
+        style: "solid",
+        class: l("bg-info-bg", "text-info-dark", "border-info")
+      },
+      {
+        variant: "neutral",
+        style: "solid",
+        class: l("bg-surface-muted", "text-fg-primary", "border-line-default")
+      },
+      {
+        variant: "primary",
+        style: "solid",
+        class: l(
+          "bg-surface-brand-subtle",
+          "text-fg-brand-emphasis",
+          "border-line-brand"
+        )
+      },
+      {
+        variant: "secondary",
+        style: "solid",
+        // bg-pink-300: secondary solid badge — no semantic equivalent
+        // (would shift 2 shades to bg-surface-secondary). Kept literal until
+        // secondary brand surface palette expands beyond DEFAULT.
+        class: l(
+          "bg-pink-300",
+          "text-fg-brand-secondary-emphasis",
+          "border-line-secondary"
+        )
+      },
+      // Outline style variants
+      {
+        variant: "success",
+        style: "outline",
+        class: l("bg-transparent", "border-success", "text-fg-success")
+      },
+      {
+        variant: "warning",
+        style: "outline",
+        class: l("bg-transparent", "border-warning", "text-fg-warning")
+      },
+      {
+        variant: "error",
+        style: "outline",
+        class: l("bg-transparent", "border-error", "text-fg-error")
+      },
+      {
+        variant: "info",
+        style: "outline",
+        class: l("bg-transparent", "border-info", "text-fg-info")
+      },
+      {
+        variant: "neutral",
+        style: "outline",
+        class: l("bg-transparent", "border-line-default", "text-fg-secondary")
+      },
+      {
+        variant: "primary",
+        style: "outline",
+        class: l("bg-transparent", "border-line-brand", "text-fg-brand")
+      },
+      {
+        variant: "secondary",
+        style: "outline",
+        class: l(
+          "bg-transparent",
+          "border-line-secondary",
+          "text-fg-brand-secondary"
+        )
+      }
+    ],
+    defaultVariants: {
+      variant: "neutral",
+      size: "md",
+      style: "solid"
+    }
+  }
+), ye = H(
+  j(function(b, p) {
+    var u = b, {
+      variant: a = "neutral",
+      size: n = "md",
+      style: t = "solid",
+      className: i = "",
+      children: s,
+      "aria-label": c
+    } = u, f = h(u, [
+      "variant",
+      "size",
+      "style",
+      "className",
+      "children",
+      "aria-label"
+    ]);
+    const x = l(xe({ variant: a, size: n, style: t }), i);
+    let g;
+    if (c)
+      g = c;
+    else if (typeof s == "string")
+      g = s;
+    else if (typeof s == "object" && s !== null && "props" in s) {
+      const y = s.props;
+      y != null && y.children && typeof y.children == "string" && (g = y.children);
+    }
+    return /* @__PURE__ */ d(
+      "span",
+      v(m({
+        ref: p,
+        role: "status",
+        "aria-label": g,
+        className: x
+      }, f), {
+        children: s
+      })
+    );
+  })
+);
+ye.displayName = "Badge";
+function ee(r, a) {
+  if (typeof r == "function")
+    return r(a);
+  r != null && (r.current = a);
+}
+function he(...r) {
+  return (a) => {
+    let n = !1;
+    const t = r.map((i) => {
+      const s = ee(i, a);
+      return !n && typeof s == "function" && (n = !0), s;
+    });
+    if (n)
+      return () => {
+        for (let i = 0; i < t.length; i++) {
+          const s = t[i];
+          typeof s == "function" ? s() : ee(r[i], null);
+        }
+      };
+  };
+}
+var we = /* @__PURE__ */ Symbol.for("react.lazy"), U = S[" use ".trim().toString()];
+function ve(r) {
+  return typeof r == "object" && r !== null && "then" in r;
 }
-function B(t) {
-  return U[t].fontWeight.tailwind;
+function ne(r) {
+  return r != null && typeof r == "object" && "$$typeof" in r && r.$$typeof === we && "_payload" in r && ve(r._payload);
 }
-function f(...t) {
-  return pe(fe(t));
+// @__NO_SIDE_EFFECTS__
+function ke(r) {
+  const a = /* @__PURE__ */ Ne(r), n = S.forwardRef((t, i) => {
+    let b = t, { children: s } = b, c = h(b, ["children"]);
+    ne(s) && typeof U == "function" && (s = U(s._payload));
+    const f = S.Children.toArray(s), p = f.find(Te);
+    if (p) {
+      const u = p.props.children, x = f.map((g) => g === p ? S.Children.count(u) > 1 ? S.Children.only(null) : S.isValidElement(u) ? u.props.children : null : g);
+      return /* @__PURE__ */ d(a, v(m({}, c), { ref: i, children: S.isValidElement(u) ? S.cloneElement(u, void 0, x) : null }));
+    }
+    return /* @__PURE__ */ d(a, v(m({}, c), { ref: i, children: s }));
+  });
+  return n.displayName = `${r}.Slot`, n;
 }
-const P = (t, a) => {
-  const n = ue(t, a);
-  return ((r) => {
-    const i = n(r);
-    return f(i);
+var $e = /* @__PURE__ */ ke("Slot");
+// @__NO_SIDE_EFFECTS__
+function Ne(r) {
+  const a = S.forwardRef((n, t) => {
+    let c = n, { children: i } = c, s = h(c, ["children"]);
+    if (ne(i) && typeof U == "function" && (i = U(i._payload)), S.isValidElement(i)) {
+      const f = Me(i), p = Ce(s, i.props);
+      return i.type !== S.Fragment && (p.ref = t ? he(t, f) : f), S.cloneElement(i, p);
+    }
+    return S.Children.count(i) > 1 ? S.Children.only(null) : null;
   });
-}, Q = P(
+  return a.displayName = `${r}.SlotClone`, a;
+}
+var Se = /* @__PURE__ */ Symbol("radix.slottable");
+function Te(r) {
+  return S.isValidElement(r) && typeof r.type == "function" && "__radixId" in r.type && r.type.__radixId === Se;
+}
+function Ce(r, a) {
+  const n = m({}, a);
+  for (const t in a) {
+    const i = r[t], s = a[t];
+    /^on[A-Z]/.test(t) ? i && s ? n[t] = (...f) => {
+      const p = s(...f);
+      return i(...f), p;
+    } : i && (n[t] = i) : t === "style" ? n[t] = m(m({}, i), s) : t === "className" && (n[t] = [i, s].filter(Boolean).join(" "));
+  }
+  return m(m({}, r), n);
+}
+function Me(r) {
+  var t, i;
+  let a = (t = Object.getOwnPropertyDescriptor(r.props, "ref")) == null ? void 0 : t.get, n = a && "isReactWarning" in a && a.isReactWarning;
+  return n ? r.ref : (a = (i = Object.getOwnPropertyDescriptor(r, "ref")) == null ? void 0 : i.get, n = a && "isReactWarning" in a && a.isReactWarning, n ? r.props.ref : r.props.ref || r.ref);
+}
+const ae = R(
   // Base classes
-  f(
+  l(
     "inline-flex",
     "items-center",
     "font-medium",
-    F("full"),
-    l("xs", "gap")
+    M("full"),
+    o("xs", "gap")
   ),
   {
     variants: {
       variant: {
-        default: f(
+        default: l(
           "bg-surface-muted",
           "text-fg-primary",
           "border",
           "border-line-default"
         ),
-        outlined: f(
+        outlined: l(
           "bg-transparent",
           "text-fg-primary",
           "border",
           "border-line-default"
         ),
-        filled: f(
+        filled: l(
           "bg-surface-brand-strong",
           "text-fg-inverse",
           "border",
@@ -439,24 +618,24 @@ const P = (t, a) => {
         )
       },
       size: {
-        sm: f(
-          l("xs", "px"),
-          l("xs", "py"),
-          E("caption")
+        sm: l(
+          o("xs", "px"),
+          o("xs", "py"),
+          L("caption")
         ),
-        md: f(
-          l("sm", "px"),
-          l("xs", "py"),
-          E("bodySmall")
+        md: l(
+          o("sm", "px"),
+          o("xs", "py"),
+          L("bodySmall")
         ),
-        lg: f(
-          l("md", "px"),
-          l("sm", "py"),
-          E("body")
+        lg: l(
+          o("md", "px"),
+          o("sm", "py"),
+          L("body")
         )
       },
       selected: {
-        true: f(
+        true: l(
           "bg-surface-brand-strong",
           "text-fg-inverse",
           "border",
@@ -496,70 +675,70 @@ const P = (t, a) => {
       disabled: !1
     }
   }
-), Te = O(function(a, n) {
+), Le = j(function(a, n) {
   const {
-    children: r,
+    children: t,
     variant: i = "default",
     size: s = "md",
     selected: c = !1,
-    disabled: d = !1,
+    disabled: f = !1,
     className: p = "",
-    "aria-label": m,
+    "aria-label": b,
     tabIndex: u,
     asChild: x = !1
-  } = a, $ = (() => {
-    if (m) return m;
-    if (typeof r == "string") return r;
-    if (typeof r == "object" && r !== null && "props" in r) {
-      const M = r.props;
-      if (M != null && M.children && typeof M.children == "string")
-        return M.children;
+  } = a, y = (() => {
+    if (b) return b;
+    if (typeof t == "string") return t;
+    if (typeof t == "object" && t !== null && "props" in t) {
+      const F = t.props;
+      if (F != null && F.children && typeof F.children == "string")
+        return F.children;
     }
   })();
   if (x)
-    return /* @__PURE__ */ o(
-      he,
+    return /* @__PURE__ */ d(
+      $e,
       {
         ref: n,
-        className: f(
-          Q({ variant: i, size: s, selected: c, disabled: d }),
+        className: l(
+          ae({ variant: i, size: s, selected: c, disabled: f }),
           p
         ),
-        "aria-label": m,
-        "aria-disabled": d || void 0,
+        "aria-label": b,
+        "aria-disabled": f || void 0,
         tabIndex: u,
-        children: r
+        children: t
       }
     );
-  const { onRemove: C, onClick: L } = a, q = L !== void 0, te = q && !d, re = (M) => {
-    d || (M.key === "Enter" || M.key === " ") && (M.preventDefault(), L == null || L());
+  const { onRemove: T, onClick: z } = a, q = z !== void 0, _ = q && !f, ie = (F) => {
+    f || (F.key === "Enter" || F.key === " ") && (F.preventDefault(), z == null || z());
   };
-  return /* @__PURE__ */ T(
+  return /* @__PURE__ */ C(
     "div",
     {
       ref: n,
-      className: f(
-        Q({ variant: i, size: s, selected: c, disabled: d }),
-        C && l("xs", "pr"),
+      className: l(
+        ae({ variant: i, size: s, selected: c, disabled: f }),
+        T && o("xs", "pr"),
         p
       ),
-      "aria-disabled": d,
+      "aria-disabled": f,
       children: [
-        q ? /* @__PURE__ */ o(
+        q ? /* @__PURE__ */ d(
           "button",
           {
             type: "button",
-            onClick: d ? void 0 : L,
-            onKeyDown: re,
-            disabled: d,
+            onClick: f ? void 0 : z,
+            onKeyDown: ie,
+            disabled: f,
             "aria-pressed": c ? !0 : void 0,
-            "aria-label": m || $,
-            tabIndex: u !== void 0 ? u : te ? 0 : void 0,
-            className: f(
+            "aria-label": b || y,
+            tabIndex: u !== void 0 ? u : _ ? 0 : void 0,
+            className: l(
               "flex-1",
               "bg-transparent",
               "border-0",
-              l("none", "p"),
+              o("none", "p"),
               "text-inherit",
               "text-left",
               "cursor-pointer",
@@ -567,162 +746,192 @@ const P = (t, a) => {
               "focus:ring-2",
               "focus:ring-line-focus",
               "focus:ring-offset-2",
-              F("full")
+              M("full")
             ),
-            children: r
+            children: t
           }
-        ) : /* @__PURE__ */ o("span", { children: r }),
-        C && !d && /* @__PURE__ */ o(
+        ) : /* @__PURE__ */ d("span", { children: t }),
+        T && !f && /* @__PURE__ */ d(
           "button",
           {
             type: "button",
-            onClick: (M) => {
-              M.stopPropagation(), C();
+            onClick: (F) => {
+              F.stopPropagation(), T();
             },
-            className: f(
-              l("xs", "ml"),
+            className: l(
+              o("xs", "ml"),
               "hover:bg-tint-hover",
-              F("full"),
-              l("xs", "p"),
+              M("full"),
+              o("xs", "p"),
               "transition-colors",
               "focus:outline-none",
               "focus:ring-2",
               "focus:ring-line-focus",
               "focus:ring-offset-1"
             ),
-            "aria-label": `Remove ${$ || "chip"}`,
-            children: /* @__PURE__ */ o(oe, { className: "h-3 w-3", "aria-hidden": "true" })
+            "aria-label": `Remove ${y || "chip"}`,
+            children: /* @__PURE__ */ d(pe, { className: "h-3 w-3", "aria-hidden": "true" })
           }
         )
       ]
     }
   );
 });
-Te.displayName = "Chip";
-function Xe(i) {
+Le.displayName = "Chip";
+function ia(i) {
   var s = i, {
-    message: t,
+    message: r,
     id: a,
     className: n = ""
-  } = s, r = y(s, [
+  } = s, t = h(s, [
     "message",
     "id",
     "className"
   ]);
   const c = [
-    l("xs", "mt"),
-    E("bodySmall"),
+    o("xs", "mt"),
+    L("bodySmall"),
     "text-fg-error",
     "flex",
     "items-center",
-    l("xs", "gap")
-  ], d = f(...c, n);
-  return /* @__PURE__ */ T("div", w(b({ role: "alert", id: a, className: d, "aria-live": "polite" }, r), { children: [
-    /* @__PURE__ */ o(ce, { className: "h-4 w-4 shrink-0", "aria-hidden": "true" }),
-    /* @__PURE__ */ o("span", { children: t })
+    o("xs", "gap")
+  ], f = l(...c, n);
+  return /* @__PURE__ */ C("div", v(m({ role: "alert", id: a, className: f, "aria-live": "polite" }, t), { children: [
+    /* @__PURE__ */ d(ue, { className: "h-4 w-4 shrink-0", "aria-hidden": "true" }),
+    /* @__PURE__ */ d("span", { children: r })
   ] }));
 }
-function Ye(r) {
-  var i = r, {
-    variant: t = "info",
+function sa(t) {
+  var i = t, {
+    variant: r = "info",
     className: a
-  } = i, n = y(i, [
+  } = i, n = h(i, [
     "variant",
     "className"
   ]);
   const s = {
-    warning: f("bg-warning-bg", "text-warning-dark", "border-warning"),
-    error: f("bg-error-bg", "text-error-dark", "border-error"),
-    info: f("bg-info-bg", "text-info-dark", "border-info")
+    warning: l("bg-warning-bg", "text-warning-dark", "border-warning"),
+    error: l("bg-error-bg", "text-error-dark", "border-error"),
+    info: l("bg-info-bg", "text-info-dark", "border-info")
   };
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ d(
     "div",
-    b({
+    m({
       role: "alert",
-      className: f(
+      className: l(
         "border",
-        l("base", "px"),
-        l("sm", "py"),
-        F("lg"),
-        s[t],
+        o("base", "px"),
+        o("sm", "py"),
+        M("lg"),
+        s[r],
         a
       )
     }, n)
   );
 }
-function g(t, a, n) {
-  const r = Ce(t), i = Me(t);
+const ze = l(
+  "block",
+  L("label"),
+  B("label"),
+  "text-fg-primary"
+), Fe = {
+  default: "",
+  required: l(
+    "after:content-['*']",
+    `after:${o("0.5", "ml")}`,
+    "after:text-fg-error"
+  ),
+  optional: l(
+    "after:content-['(optional)']",
+    `after:${o("xs", "ml")}`,
+    "after:text-fg-tertiary",
+    "after:font-normal"
+  )
+}, Ae = H(
+  j(function(c, s) {
+    var f = c, { variant: a = "default", className: n = "", children: t } = f, i = h(f, ["variant", "className", "children"]);
+    const p = l(
+      ze,
+      Fe[a],
+      n
+    );
+    return /* @__PURE__ */ d("label", v(m({ ref: s, className: p }, i), { children: t }));
+  })
+);
+Ae.displayName = "Label";
+function w(r, a, n) {
+  const t = Ee(r), i = Ie(r);
   return {
-    hex: t,
-    rgb: r,
+    hex: r,
+    rgb: t,
     hsl: i,
     cssVar: `var(--color-${a}-${n})`,
     tailwind: `${a}-${n}`
   };
 }
-function Ce(t) {
-  const a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);
+function Ee(r) {
+  const a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(r);
   return a ? `${parseInt(a[1], 16)}, ${parseInt(a[2], 16)}, ${parseInt(a[3], 16)}` : "0, 0, 0";
 }
-function Me(t) {
-  const a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);
+function Ie(r) {
+  const a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(r);
   if (!a) return "0, 0%, 0%";
-  const n = parseInt(a[1], 16) / 255, r = parseInt(a[2], 16) / 255, i = parseInt(a[3], 16) / 255, s = Math.max(n, r, i), c = Math.min(n, r, i);
-  let d = 0, p = 0;
-  const m = (s + c) / 2;
+  const n = parseInt(a[1], 16) / 255, t = parseInt(a[2], 16) / 255, i = parseInt(a[3], 16) / 255, s = Math.max(n, t, i), c = Math.min(n, t, i);
+  let f = 0, p = 0;
+  const b = (s + c) / 2;
   if (s !== c) {
     const u = s - c;
-    switch (p = m > 0.5 ? u / (2 - s - c) : u / (s + c), s) {
+    switch (p = b > 0.5 ? u / (2 - s - c) : u / (s + c), s) {
       case n:
-        d = ((r - i) / u + (r < i ? 6 : 0)) / 6;
+        f = ((t - i) / u + (t < i ? 6 : 0)) / 6;
         break;
-      case r:
-        d = ((i - n) / u + 2) / 6;
+      case t:
+        f = ((i - n) / u + 2) / 6;
         break;
       case i:
-        d = ((n - r) / u + 4) / 6;
+        f = ((n - t) / u + 4) / 6;
         break;
     }
   }
-  return `${Math.round(d * 360)}, ${Math.round(p * 100)}%, ${Math.round(m * 100)}%`;
+  return `${Math.round(f * 360)}, ${Math.round(p * 100)}%, ${Math.round(b * 100)}%`;
 }
-g("#f0f4f8", "brand-primary", 50), g("#d9e2ec", "brand-primary", 100), g("#bcccdc", "brand-primary", 200), g("#9fb3c8", "brand-primary", 300), g("#7390ad", "brand-primary", 400), g("#486581", "brand-primary", 500), g("#334e68", "brand-primary", 600), g("#243b53", "brand-primary", 700), g("#1a2a3a", "brand-primary", 800), g("#102a43", "brand-primary", 900), g("#061a35", "brand-primary", 950);
-g("#f7f5ff", "brand-secondary", 50), g("#eee9ff", "brand-secondary", 100), g("#e0d6ff", "brand-secondary", 200), g("#cbb8ff", "brand-secondary", 300), g("#aa89fc", "brand-secondary", 400), g("#8e58f2", "brand-secondary", 500), g("#703bc8", "brand-secondary", 600), g("#582aa2", "brand-secondary", 700), g("#44227e", "brand-secondary", 800), g("#32185d", "brand-secondary", 900), g("#180635", "brand-secondary", 950);
-function e(t, a, n) {
-  const r = Fe(t), i = Le(t);
+w("#f0f4f8", "brand-primary", 50), w("#d9e2ec", "brand-primary", 100), w("#bcccdc", "brand-primary", 200), w("#9fb3c8", "brand-primary", 300), w("#7390ad", "brand-primary", 400), w("#486581", "brand-primary", 500), w("#334e68", "brand-primary", 600), w("#243b53", "brand-primary", 700), w("#1a2a3a", "brand-primary", 800), w("#102a43", "brand-primary", 900), w("#061a35", "brand-primary", 950);
+w("#f7f5ff", "brand-secondary", 50), w("#eee9ff", "brand-secondary", 100), w("#e0d6ff", "brand-secondary", 200), w("#cbb8ff", "brand-secondary", 300), w("#aa89fc", "brand-secondary", 400), w("#8e58f2", "brand-secondary", 500), w("#703bc8", "brand-secondary", 600), w("#582aa2", "brand-secondary", 700), w("#44227e", "brand-secondary", 800), w("#32185d", "brand-secondary", 900), w("#180635", "brand-secondary", 950);
+function e(r, a, n) {
+  const t = We(r), i = De(r);
   return {
-    hex: t,
-    rgb: r,
+    hex: r,
+    rgb: t,
     hsl: i,
     cssVar: `var(--color-${a}-${n})`,
     tailwind: `${a}-${n}`
   };
 }
-function Fe(t) {
-  const a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);
+function We(r) {
+  const a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(r);
   return a ? `${parseInt(a[1], 16)}, ${parseInt(a[2], 16)}, ${parseInt(a[3], 16)}` : "0, 0, 0";
 }
-function Le(t) {
-  const a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);
+function De(r) {
+  const a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(r);
   if (!a) return "0, 0%, 0%";
-  const n = parseInt(a[1], 16) / 255, r = parseInt(a[2], 16) / 255, i = parseInt(a[3], 16) / 255, s = Math.max(n, r, i), c = Math.min(n, r, i);
-  let d = 0, p = 0;
-  const m = (s + c) / 2;
+  const n = parseInt(a[1], 16) / 255, t = parseInt(a[2], 16) / 255, i = parseInt(a[3], 16) / 255, s = Math.max(n, t, i), c = Math.min(n, t, i);
+  let f = 0, p = 0;
+  const b = (s + c) / 2;
   if (s !== c) {
     const u = s - c;
-    switch (p = m > 0.5 ? u / (2 - s - c) : u / (s + c), s) {
+    switch (p = b > 0.5 ? u / (2 - s - c) : u / (s + c), s) {
       case n:
-        d = ((r - i) / u + (r < i ? 6 : 0)) / 6;
+        f = ((t - i) / u + (t < i ? 6 : 0)) / 6;
         break;
-      case r:
-        d = ((i - n) / u + 2) / 6;
+      case t:
+        f = ((i - n) / u + 2) / 6;
         break;
       case i:
-        d = ((n - r) / u + 4) / 6;
+        f = ((n - t) / u + 4) / 6;
         break;
     }
   }
-  return `${Math.round(d * 360)}, ${Math.round(p * 100)}%, ${Math.round(m * 100)}%`;
+  return `${Math.round(f * 360)}, ${Math.round(p * 100)}%, ${Math.round(b * 100)}%`;
 }
 e("#eef2ff", "indigo", 50), e("#e0e7ff", "indigo", 100), e("#c7d2fe", "indigo", 200), e("#a5b4fc", "indigo", 300), e("#818cf8", "indigo", 400), e("#6366f1", "indigo", 500), e("#4f46e5", "indigo", 600), e("#4338ca", "indigo", 700), e("#3730a3", "indigo", 800), e("#312e81", "indigo", 900), e("#1e1b4b", "indigo", 950);
 e("#f5f3ff", "violet", 50), e("#ede9fe", "violet", 100), e("#ddd6fe", "violet", 200), e("#c4b5fd", "violet", 300), e("#a78bfa", "violet", 400), e("#8b5cf6", "violet", 500), e("#7c3aed", "violet", 600), e("#6d28d9", "violet", 700), e("#5b21b6", "violet", 800), e("#4c1d95", "violet", 900), e("#2e1065", "violet", 950);
@@ -743,7 +952,7 @@ e("#fdf2f8", "pink", 50), e("#fce7f3", "pink", 100), e("#fbcfe8", "pink", 200),
 e("#faf5ff", "purple", 50), e("#f3e8ff", "purple", 100), e("#e9d5ff", "purple", 200), e("#d8b4fe", "purple", 300), e("#c084fc", "purple", 400), e("#a855f7", "purple", 500), e("#9333ea", "purple", 600), e("#7e22ce", "purple", 700), e("#6b21a8", "purple", 800), e("#581c87", "purple", 900), e("#3b0764", "purple", 950);
 e("#f0fdfa", "teal", 50), e("#ccfbf1", "teal", 100), e("#99f6e4", "teal", 200), e("#5eead4", "teal", 300), e("#2dd4bf", "teal", 400), e("#14b8a6", "teal", 500), e("#0d9488", "teal", 600), e("#0f766e", "teal", 700), e("#115e59", "teal", 800), e("#134e4a", "teal", 900), e("#042f2e", "teal", 950);
 e("#f7fee7", "lime", 50), e("#ecfccb", "lime", 100), e("#d9f99d", "lime", 200), e("#bef264", "lime", 300), e("#a3e635", "lime", 400), e("#84cc16", "lime", 500), e("#65a30d", "lime", 600), e("#4d7c0f", "lime", 700), e("#3f6212", "lime", 800), e("#365314", "lime", 900), e("#1a2e05", "lime", 950);
-class j {
+class V {
   /**
    * Create a shadow token
    */
@@ -787,13 +996,24 @@ class j {
     }[a];
   }
 }
-j.create("none"), j.create("sm"), j.create("md"), j.create("lg"), j.create("xl"), j.create("2xl"), j.create("inner");
-class z {
+const Ve = {
+  none: V.create("none"),
+  sm: V.create("sm"),
+  md: V.create("md"),
+  lg: V.create("lg"),
+  xl: V.create("xl"),
+  "2xl": V.create("2xl"),
+  inner: V.create("inner")
+};
+function X(r) {
+  return Ve[r].tailwind;
+}
+class A {
   /**
    * Create a border width token
    */
   static createWidth(a) {
-    const r = {
+    const t = {
       none: {
         px: 0,
         tailwind: "border-0"
@@ -816,9 +1036,9 @@ class z {
       }
     }[a];
     return {
-      value: r.px,
-      px: `${r.px}px`,
-      tailwind: r.tailwind
+      value: t.px,
+      px: `${t.px}px`,
+      tailwind: t.tailwind
     };
   }
   /**
@@ -832,13 +1052,13 @@ class z {
     };
   }
 }
-z.create("none"), z.create("thin"), z.create("base"), z.create("medium"), z.create("thick"), z.create("thin", "dashed"), z.create("base", "dashed"), z.create("thin", "dotted"), z.create("base", "dotted");
-class D {
+A.create("none"), A.create("thin"), A.create("base"), A.create("medium"), A.create("thick"), A.create("thin", "dashed"), A.create("base", "dashed"), A.create("thin", "dotted"), A.create("base", "dotted");
+class O {
   /**
    * Create breakpoint token
    */
   static create(a) {
-    const r = {
+    const t = {
       sm: { minWidth: 640, tailwind: "sm" },
       md: { minWidth: 768, tailwind: "md" },
       lg: { minWidth: 1024, tailwind: "lg" },
@@ -847,20 +1067,20 @@ class D {
     }[a];
     return {
       name: a,
-      minWidth: r.minWidth,
-      px: `${r.minWidth}px`,
-      rem: `${r.minWidth / 16}rem`,
-      tailwind: r.tailwind
+      minWidth: t.minWidth,
+      px: `${t.minWidth}px`,
+      rem: `${t.minWidth / 16}rem`,
+      tailwind: t.tailwind
     };
   }
 }
-D.create("sm"), D.create("md"), D.create("lg"), D.create("xl"), D.create("2xl");
+O.create("sm"), O.create("md"), O.create("lg"), O.create("xl"), O.create("2xl");
 class W {
   /**
    * Create an animation token
    */
   static create(a, n = "ease-in-out") {
-    const r = {
+    const t = {
       fast: {
         value: "150ms",
         ms: 150,
@@ -904,15 +1124,15 @@ class W {
       }
     };
     return {
-      duration: r[a],
+      duration: t[a],
       easing: i[n]
     };
   }
   /**
    * Create a transition token
    */
-  static createTransition(a, n = "base", r = "ease-in-out") {
-    const i = this.create(n, r), s = Array.isArray(a) ? a.join(", ") : a, c = [
+  static createTransition(a, n = "base", t = "ease-in-out") {
+    const i = this.create(n, t), s = Array.isArray(a) ? a.join(", ") : a, c = [
       i.duration.tailwind,
       i.easing.tailwind
     ].join(" ");
@@ -928,7 +1148,7 @@ W.create("fast"), W.create("base"), W.create("slow"), W.create("slower"), W.crea
   ["color", "background-color", "border-color"],
   "base"
 ), W.createTransition("opacity", "fast"), W.createTransition("transform", "base"), W.createTransition("all", "base");
-class A {
+class E {
   /**
    * Create a z-index token
    */
@@ -982,13 +1202,13 @@ class A {
     }[a];
   }
 }
-A.create("base"), A.create("dropdown"), A.create("sticky"), A.create("fixed"), A.create("modal-backdrop"), A.create("modal"), A.create("popover"), A.create("tooltip"), A.create("toast");
+E.create("base"), E.create("dropdown"), E.create("sticky"), E.create("fixed"), E.create("modal-backdrop"), E.create("modal"), E.create("popover"), E.create("tooltip"), E.create("toast");
 class N {
   /**
    * Create an opacity token
    */
   static create(a) {
-    const n = a / 100, r = {
+    const n = a / 100, t = {
       0: "Fully transparent",
       5: "Very light overlay",
       10: "Light overlay",
@@ -1025,12 +1245,12 @@ class N {
         95: "opacity-95",
         100: "opacity-100"
       }[a],
-      description: r[a]
+      description: t[a]
     };
   }
 }
 N.create(0), N.create(5), N.create(10), N.create(20), N.create(25), N.create(30), N.create(40), N.create(50), N.create(60), N.create(70), N.create(75), N.create(80), N.create(90), N.create(95), N.create(100);
-const ze = P("w-full", {
+const je = R("w-full", {
   variants: {
     size: {
       sm: "h-1",
@@ -1050,7 +1270,7 @@ const ze = P("w-full", {
     size: "md",
     variant: "primary"
   }
-}), J = P("transition-all", {
+}), te = R("transition-all", {
   variants: {
     variant: {
       primary: "bg-surface-brand",
@@ -1064,17 +1284,17 @@ const ze = P("w-full", {
   defaultVariants: {
     variant: "primary"
   }
-}), Ae = O(function(x, u) {
-  var h = x, {
+}), Re = j(function(x, u) {
+  var g = x, {
     value: a,
     max: n = 100,
-    variant: r = "primary",
+    variant: t = "primary",
     size: i = "md",
     showLabel: s = !1,
     label: c,
-    "aria-label": d,
+    "aria-label": f,
     className: p = ""
-  } = h, m = y(h, [
+  } = g, b = h(g, [
     "value",
     "max",
     "variant",
@@ -1084,38 +1304,38 @@ const ze = P("w-full", {
     "aria-label",
     "className"
   ]);
-  const $ = a === void 0, C = $ ? void 0 : Math.min(Math.max(a / n * 100, 0), 100), L = d || ($ ? "Loading in progress" : `Progress: ${C == null ? void 0 : C.toFixed(0)}%`);
-  return /* @__PURE__ */ T("div", w(b({ ref: u, className: f("w-full", p) }, m), { children: [
-    s && (c || !$) && /* @__PURE__ */ T(
+  const y = a === void 0, T = y ? void 0 : Math.min(Math.max(a / n * 100, 0), 100), z = f || (y ? "Loading in progress" : `Progress: ${T == null ? void 0 : T.toFixed(0)}%`);
+  return /* @__PURE__ */ C("div", v(m({ ref: u, className: l("w-full", p) }, b), { children: [
+    s && (c || !y) && /* @__PURE__ */ C(
       "div",
       {
-        className: f(
+        className: l(
           "flex",
           "items-center",
           "justify-between",
-          l("xs", "mb")
+          o("xs", "mb")
         ),
         children: [
-          c && /* @__PURE__ */ o(
+          c && /* @__PURE__ */ d(
             "span",
             {
-              className: f(
-                E("bodySmall"),
+              className: l(
+                L("bodySmall"),
                 B("label"),
                 "text-fg-primary"
               ),
               children: c
             }
           ),
-          !$ && C !== void 0 && /* @__PURE__ */ T(
+          !y && T !== void 0 && /* @__PURE__ */ C(
             "span",
             {
-              className: f(
-                E("bodySmall"),
+              className: l(
+                L("bodySmall"),
                 "text-fg-secondary"
               ),
               children: [
-                C.toFixed(0),
+                T.toFixed(0),
                 "%"
               ]
             }
@@ -1123,32 +1343,32 @@ const ze = P("w-full", {
         ]
       }
     ),
-    /* @__PURE__ */ o(
+    /* @__PURE__ */ d(
       "div",
       {
         role: "progressbar",
-        "aria-valuemin": $ ? void 0 : 0,
-        "aria-valuemax": $ ? void 0 : n,
-        "aria-valuenow": $ ? void 0 : a,
-        "aria-label": L,
-        "aria-busy": $,
-        className: f(
+        "aria-valuemin": y ? void 0 : 0,
+        "aria-valuemax": y ? void 0 : n,
+        "aria-valuenow": y ? void 0 : a,
+        "aria-label": z,
+        "aria-busy": y,
+        className: l(
           "relative",
           "w-full",
           "overflow-hidden",
-          ze({ size: i, variant: r }),
-          F("full")
+          je({ size: i, variant: t }),
+          M("full")
         ),
-        children: $ ? /* @__PURE__ */ o(
+        children: y ? /* @__PURE__ */ d(
           "div",
           {
-            className: f(
+            className: l(
               "absolute",
               "top-0",
               "left-0",
               "bottom-0",
-              J({ variant: r }),
-              F("full"),
+              te({ variant: t }),
+              M("full"),
               "motion-reduce:animate-none"
             ),
             style: {
@@ -1156,19 +1376,19 @@ const ze = P("w-full", {
               animation: "progress-indeterminate 1.5s ease-in-out infinite"
             }
           }
-        ) : /* @__PURE__ */ o(
+        ) : /* @__PURE__ */ d(
           "div",
           {
-            className: f(
+            className: l(
               "h-full",
-              J({ variant: r }),
-              F("full"),
+              te({ variant: t }),
+              M("full"),
               "transition-all",
               "duration-300",
               "ease-out"
             ),
             style: {
-              width: `${C}%`
+              width: `${T}%`
             },
             "aria-hidden": "true"
           }
@@ -1177,16 +1397,57 @@ const ze = P("w-full", {
     )
   ] }));
 });
-Ae.displayName = "Progress";
-function Ze(d) {
-  var p = d, {
-    variant: t = "text",
+Re.displayName = "Progress";
+const _e = {
+  horizontal: "w-full border-t",
+  vertical: "h-full border-l self-stretch"
+}, Oe = {
+  solid: "border-solid",
+  dashed: "border-dashed",
+  dotted: "border-dotted"
+}, Be = H(function(s) {
+  var c = s, {
+    orientation: a = "horizontal",
+    variant: n = "solid",
+    className: t = ""
+  } = c, i = h(c, [
+    "orientation",
+    "variant",
+    "className"
+  ]);
+  const f = l(
+    "border-0",
+    "border-line-default",
+    _e[a],
+    Oe[n],
+    t
+  );
+  return a === "vertical" ? /* @__PURE__ */ d(
+    "div",
+    m({
+      className: f,
+      role: "separator",
+      "aria-orientation": "vertical"
+    }, i)
+  ) : /* @__PURE__ */ d(
+    "hr",
+    m({
+      className: f,
+      role: "separator",
+      "aria-orientation": "horizontal"
+    }, i)
+  );
+});
+Be.displayName = "Separator";
+function la(f) {
+  var p = f, {
+    variant: r = "text",
     width: a,
     height: n,
-    lines: r = 1,
+    lines: t = 1,
     className: i = "",
     "aria-label": s
-  } = p, c = y(p, [
+  } = p, c = h(p, [
     "variant",
     "width",
     "height",
@@ -1194,48 +1455,48 @@ function Ze(d) {
     "className",
     "aria-label"
   ]);
-  const m = [
+  const b = [
     "motion-safe:animate-pulse",
     "bg-surface-muted",
-    F("sm")
+    M("sm")
   ], u = {
     text: "h-4",
     card: "h-32",
     list: "h-12",
-    circle: F("full")
-  }, x = f(...m, u[t], i), h = {};
-  a && (h.width = a), n && (h.height = n);
-  const $ = s || `Loading ${t} content`;
-  return t === "text" && r > 1 ? /* @__PURE__ */ o(
+    circle: M("full")
+  }, x = l(...b, u[r], i), g = {};
+  a && (g.width = a), n && (g.height = n);
+  const y = s || `Loading ${r} content`;
+  return r === "text" && t > 1 ? /* @__PURE__ */ d(
     "div",
-    w(b({
-      className: l("sm", "space-y"),
+    v(m({
+      className: o("sm", "space-y"),
       role: "status",
       "aria-busy": "true",
-      "aria-label": $
+      "aria-label": y
     }, c), {
-      children: Array.from({ length: r }).map((C, L) => /* @__PURE__ */ o(
+      children: Array.from({ length: t }).map((T, z) => /* @__PURE__ */ d(
         "div",
         {
           className: x,
-          style: L === r - 1 ? { width: "75%" } : h,
+          style: z === t - 1 ? { width: "75%" } : g,
           "aria-hidden": "true"
         },
-        L
+        z
       ))
     })
-  ) : /* @__PURE__ */ o(
+  ) : /* @__PURE__ */ d(
     "div",
-    b({
+    m({
       className: x,
-      style: h,
+      style: g,
       role: "status",
       "aria-busy": "true",
-      "aria-label": $
+      "aria-label": y
     }, c)
   );
 }
-const Ee = P("motion-safe:animate-spin", {
+const He = R("motion-safe:animate-spin", {
   variants: {
     size: {
       sm: "h-4 w-4",
@@ -1252,52 +1513,52 @@ const Ee = P("motion-safe:animate-spin", {
     size: "md",
     variant: "primary"
   }
-}), Ie = le(function(c) {
-  var d = c, {
+}), Pe = H(function(c) {
+  var f = c, {
     size: a = "md",
     variant: n = "primary",
-    label: r,
+    label: t,
     className: i = ""
-  } = d, s = y(d, [
+  } = f, s = h(f, [
     "size",
     "variant",
     "label",
     "className"
   ]);
-  return /* @__PURE__ */ T(
+  return /* @__PURE__ */ C(
     "div",
-    w(b({
-      className: f("inline-flex", "items-center", i),
+    v(m({
+      className: l("inline-flex", "items-center", i),
       role: "status",
-      "aria-label": r || "Loading",
+      "aria-label": t || "Loading",
       "aria-live": "polite"
     }, s), {
       children: [
-        /* @__PURE__ */ o(
-          de,
+        /* @__PURE__ */ d(
+          me,
           {
-            className: f(Ee({ size: a, variant: n })),
+            className: l(He({ size: a, variant: n })),
             "aria-hidden": "true"
           }
         ),
-        r && /* @__PURE__ */ o(
+        t && /* @__PURE__ */ d(
           "span",
           {
-            className: f(
-              l("sm", "ml"),
-              E("bodySmall"),
+            className: l(
+              o("sm", "ml"),
+              L("bodySmall"),
               "text-fg-secondary",
               "sr-only"
             ),
-            children: r
+            children: t
           }
         )
       ]
     })
   );
 });
-Ie.displayName = "Spinner";
-const We = {
+Pe.displayName = "Spinner";
+const Ue = {
   primary: {
     // exception: variant color — no semantic equivalent (Principle 3, .claude/rules/colors.md)
     light: "text-indigo-400",
@@ -1349,16 +1610,16 @@ const We = {
     contrast: "text-fg-inverse"
   }
 };
-function Re(m, p) {
-  var u = m, {
-    variant: t = "paragraph",
+function qe(b, p) {
+  var u = b, {
+    variant: r = "paragraph",
     bold: a,
     italic: n,
-    className: r,
+    className: t,
     as: i,
     colorRole: s = "neutral",
     colorShade: c = "dark"
-  } = u, d = y(u, [
+  } = u, f = h(u, [
     "variant",
     "bold",
     "italic",
@@ -1368,40 +1629,40 @@ function Re(m, p) {
     "colorShade"
   ]);
   const x = [];
-  let h;
+  let g;
   if (i)
-    h = i;
+    g = i;
   else
-    switch (t) {
+    switch (r) {
       case "heading":
-        h = "h2";
+        g = "h2";
         break;
       case "list":
-        h = "li";
+        g = "li";
         break;
       default:
-        h = "p";
+        g = "p";
         break;
     }
-  return t === "heading" ? x.push(R("h2")) : t === "body" || t === "paragraph" ? x.push(R("body")) : t === "bodySmall" ? x.push(R("bodySmall")) : t === "bodyLarge" ? x.push(R("bodyLarge")) : t === "caption" ? x.push(R("caption")) : t === "label" ? x.push(R("label")) : x.push(R("body")), a && x.push("font-bold"), n && x.push("italic"), x.push(We[s][c]), /* @__PURE__ */ o(h, b({ ref: p, className: f(...x, r) }, d));
+  return r === "heading" ? x.push(D("h2")) : r === "body" || r === "paragraph" ? x.push(D("body")) : r === "bodySmall" ? x.push(D("bodySmall")) : r === "bodyLarge" ? x.push(D("bodyLarge")) : r === "caption" ? x.push(D("caption")) : r === "label" ? x.push(D("label")) : x.push(D("body")), a && x.push("font-bold"), n && x.push("italic"), x.push(Ue[s][c]), /* @__PURE__ */ d(g, m({ ref: p, className: l(...x, t) }, f));
 }
-const Ge = O(Re), je = {
+const oa = j(qe), Ke = {
   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"
-}, De = ee.forwardRef(
-  (p, d) => {
-    var m = p, {
-      className: t,
+}, Xe = re.forwardRef(
+  (p, f) => {
+    var b = p, {
+      className: r,
       maxWidth: a = "lg",
       paddingX: n = "base",
-      paddingY: r = "base",
+      paddingY: t = "base",
       center: i = !0,
       children: s
-    } = m, c = y(m, [
+    } = b, c = h(b, [
       "className",
       "maxWidth",
       "paddingX",
@@ -1409,17 +1670,17 @@ const Ge = O(Re), je = {
       "center",
       "children"
     ]);
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ d(
       "div",
-      w(b({
-        ref: d,
-        className: f(
+      v(m({
+        ref: f,
+        className: l(
           "w-full",
-          je[a],
-          l(n, "px"),
-          l(r, "py"),
+          Ke[a],
+          o(n, "px"),
+          o(t, "py"),
           i && "mx-auto",
-          t
+          r
         )
       }, c), {
         children: s
@@ -1427,17 +1688,17 @@ const Ge = O(Re), je = {
     );
   }
 );
-De.displayName = "Container";
-const _e = ee.forwardRef(
-  (p, d) => {
-    var m = p, {
-      className: t,
+Xe.displayName = "Container";
+const Ye = re.forwardRef(
+  (p, f) => {
+    var b = p, {
+      className: r,
       spacing: a = "base",
       align: n = "stretch",
-      justify: r = "start",
+      justify: t = "start",
       direction: i = "column",
       children: s
-    } = m, c = y(m, [
+    } = b, c = h(b, [
       "className",
       "spacing",
       "align",
@@ -1445,12 +1706,12 @@ const _e = ee.forwardRef(
       "direction",
       "children"
     ]);
-    const u = i === "column" ? l(a, "gap-y") : l(a, "gap-x"), x = {
+    const u = i === "column" ? o(a, "gap-y") : o(a, "gap-x"), x = {
       start: "items-start",
       center: "items-center",
       end: "items-end",
       stretch: "items-stretch"
-    }, h = {
+    }, g = {
       start: "justify-start",
       center: "justify-center",
       end: "justify-end",
@@ -1458,17 +1719,17 @@ const _e = ee.forwardRef(
       around: "justify-around",
       evenly: "justify-evenly"
     };
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ d(
       "div",
-      w(b({
-        ref: d,
-        className: f(
+      v(m({
+        ref: f,
+        className: l(
           "flex",
           i === "column" ? "flex-col" : "flex-row",
           u,
           x[n],
-          h[r],
-          t
+          g[t],
+          r
         )
       }, c), {
         children: s
@@ -1476,13 +1737,13 @@ const _e = ee.forwardRef(
     );
   }
 );
-_e.displayName = "Stack";
-const Ve = O(
-  function({ option: a, isHighlighted: n, onSelect: r }, i) {
+Ye.displayName = "Stack";
+const Ze = j(
+  function({ option: a, isHighlighted: n, onSelect: t }, i) {
     const s = () => {
-      a.disabled || r(a);
+      a.disabled || t(a);
     };
-    return /* @__PURE__ */ T(
+    return /* @__PURE__ */ C(
       "div",
       {
         ref: i,
@@ -1493,9 +1754,9 @@ const Ve = O(
         className: `
           flex
           items-center
-          ${l("sm", "gap")}
-          ${l("sm", "px")}
-          ${l("sm", "py")}
+          ${o("sm", "gap")}
+          ${o("sm", "px")}
+          ${o("sm", "py")}
           text-sm
           cursor-pointer
           transition-colors
@@ -1503,20 +1764,20 @@ const Ve = O(
           ${a.disabled ? "opacity-50 cursor-not-allowed" : "hover:bg-surface-hover"}
         `,
         children: [
-          a.icon && /* @__PURE__ */ o("span", { className: "flex-shrink-0", children: a.icon }),
-          /* @__PURE__ */ o("span", { className: "flex-1", children: a.label })
+          a.icon && /* @__PURE__ */ d("span", { className: "flex-shrink-0", children: a.icon }),
+          /* @__PURE__ */ d("span", { className: "flex-1", children: a.label })
         ]
       }
     );
   }
 );
-Ve.displayName = "AutocompleteOption";
-function Qe(i) {
+Ze.displayName = "AutocompleteOption";
+function da(i) {
   var s = i, {
-    items: t,
+    items: r,
     separator: a = "/",
     className: n = ""
-  } = s, r = y(s, [
+  } = s, t = h(s, [
     "items",
     "separator",
     "className"
@@ -1524,49 +1785,49 @@ function Qe(i) {
   const c = [
     "flex",
     "items-center",
-    l("sm", "space-x"),
-    E("bodySmall")
-  ], d = f(...c, n);
-  return /* @__PURE__ */ o("nav", w(b({ "aria-label": "Breadcrumb", className: d }, r), { children: /* @__PURE__ */ o(
+    o("sm", "space-x"),
+    L("bodySmall")
+  ], f = l(...c, n);
+  return /* @__PURE__ */ d("nav", v(m({ "aria-label": "Breadcrumb", className: f }, t), { children: /* @__PURE__ */ d(
     "ol",
     {
-      className: f("flex", "items-center", l("sm", "space-x")),
-      children: t.map((p, m) => {
-        const u = m === t.length - 1;
-        return /* @__PURE__ */ T("li", { className: "flex items-center", children: [
-          m > 0 && /* @__PURE__ */ o(
+      className: l("flex", "items-center", o("sm", "space-x")),
+      children: r.map((p, b) => {
+        const u = b === r.length - 1;
+        return /* @__PURE__ */ C("li", { className: "flex items-center", children: [
+          b > 0 && /* @__PURE__ */ d(
             "span",
             {
-              className: f(
-                l("sm", "mx"),
+              className: l(
+                o("sm", "mx"),
                 "text-fg-tertiary"
               ),
               "aria-hidden": "true",
               children: a
             }
           ),
-          u ? /* @__PURE__ */ o(
+          u ? /* @__PURE__ */ d(
             "span",
             {
-              className: f(
+              className: l(
                 "text-fg-primary",
                 B("label")
               ),
               "aria-current": "page",
               children: p.label
             }
-          ) : p.href ? /* @__PURE__ */ o(
+          ) : p.href ? /* @__PURE__ */ d(
             "a",
             {
               href: p.href,
-              className: f(
+              className: l(
                 "inline-flex",
                 "items-center",
-                l("xs", "px"),
-                l("xs", "pt"),
+                o("xs", "px"),
+                o("xs", "pt"),
                 "border-b-2",
                 "border-transparent",
-                E("bodySmall"),
+                L("bodySmall"),
                 B("label"),
                 "transition-colors",
                 "text-fg-secondary",
@@ -1575,167 +1836,235 @@ function Qe(i) {
               ),
               children: p.label
             }
-          ) : /* @__PURE__ */ o("span", { className: "text-fg-secondary", children: p.label })
-        ] }, m);
+          ) : /* @__PURE__ */ d("span", { className: "text-fg-secondary", children: p.label })
+        ] }, b);
       })
     }
   ) }));
 }
-function Je(r) {
-  var i = r, {
-    children: t,
+const Ge = H(function(b) {
+  var u = b, {
+    variant: a = "default",
+    padding: n = "medium",
+    className: t = "",
+    onClick: i,
+    "aria-label": s,
+    "aria-labelledby": c,
+    children: f
+  } = u, p = h(u, [
+    "variant",
+    "padding",
+    "className",
+    "onClick",
+    "aria-label",
+    "aria-labelledby",
+    "children"
+  ]);
+  const x = R(
+    l(
+      "bg-surface-base",
+      M("lg"),
+      "border",
+      "border-line-default",
+      X("sm")
+    ),
+    {
+      variants: {
+        variant: {
+          default: "",
+          hover: l(
+            `hover:${X("md")}`,
+            "transition-shadow",
+            "cursor-pointer"
+          ),
+          selected: l("border-line-brand", X("md"))
+        },
+        padding: {
+          none: "",
+          small: o("xs", "p"),
+          medium: o("base", "p"),
+          large: o("lg", "p")
+        }
+      },
+      defaultVariants: {
+        variant: "default",
+        padding: "medium"
+      }
+    }
+  ), g = i !== void 0, y = g ? "button" : void 0, T = g ? 0 : void 0, z = l(x({ variant: a, padding: n }), t);
+  return /* @__PURE__ */ d(
+    "div",
+    v(m({
+      className: z,
+      role: y,
+      tabIndex: T,
+      onClick: i,
+      onKeyDown: (_) => {
+        g && (_.key === "Enter" || _.key === " ") && (_.preventDefault(), i == null || i());
+      },
+      "aria-label": s,
+      "aria-labelledby": c
+    }, p), {
+      children: f
+    })
+  );
+});
+Ge.displayName = "Card";
+function ca(t) {
+  var i = t, {
+    children: r,
     className: a = ""
-  } = i, n = y(i, [
+  } = i, n = h(i, [
     "children",
     "className"
   ]);
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ d(
     "div",
-    w(b({
-      className: `flex flex-col ${l("1.5", "space-y")} ${l("lg", "p")} ${l("base", "pb")} ${a}`
+    v(m({
+      className: `flex flex-col ${o("1.5", "space-y")} ${o("lg", "p")} ${o("base", "pb")} ${a}`
     }, n), {
-      children: t
+      children: r
     })
   );
 }
-function ea(r) {
-  var i = r, {
-    children: t,
+function fa(t) {
+  var i = t, {
+    children: r,
     className: a = ""
-  } = i, n = y(i, [
+  } = i, n = h(i, [
     "children",
     "className"
   ]);
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ d(
     "div",
-    w(b({
-      className: `flex flex-col-reverse sm:flex-row sm:justify-end sm:${l("sm", "space-x")} ${l("lg", "p")} ${l("base", "pt")} ${a}`
+    v(m({
+      className: `flex flex-col-reverse sm:flex-row sm:justify-end sm:${o("sm", "space-x")} ${o("lg", "p")} ${o("base", "pt")} ${a}`
     }, n), {
-      children: t
+      children: r
     })
   );
 }
-function aa(r) {
-  var i = r, {
-    children: t,
+function pa(t) {
+  var i = t, {
+    children: r,
     className: a = ""
-  } = i, n = y(i, [
+  } = i, n = h(i, [
     "children",
     "className"
   ]);
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ d(
     "div",
-    w(b({
+    v(m({
       className: `
-        ${l("lg", "p")}
+        ${o("lg", "p")}
         border-b
         border-line-default
         ${a}
       `
     }, n), {
-      children: t
+      children: r
     })
   );
 }
-function ta(r) {
-  var i = r, {
-    children: t,
+function ua(t) {
+  var i = t, {
+    children: r,
     className: a = ""
-  } = i, n = y(i, [
+  } = i, n = h(i, [
     "children",
     "className"
   ]);
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ d(
     "div",
-    w(b({
+    v(m({
       className: `
-        ${l("lg", "p")}
+        ${o("lg", "p")}
         border-t
         border-line-default
         flex
         justify-end
-        ${l("sm", "gap")}
+        ${o("sm", "gap")}
         ${a}
       `
     }, n), {
-      children: t
+      children: r
     })
   );
 }
-function ra({ children: t, className: a }) {
-  return /* @__PURE__ */ o(
+function ma({ children: r, className: a }) {
+  return /* @__PURE__ */ d(
     "div",
     {
-      className: f(
+      className: l(
         "flex-shrink-0 flex items-center",
-        l("sm", "gap"),
+        o("sm", "gap"),
         a
       ),
-      children: t
+      children: r
     }
   );
 }
-function na({
-  children: t,
+function ba({
+  children: r,
   className: a
 }) {
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ d(
     "nav",
     {
-      className: f(
+      className: l(
         "flex-1 flex items-center justify-center",
-        l("base", "gap"),
+        o("base", "gap"),
         "hidden md:flex",
         // Hidden on mobile, visible on desktop
         a
       ),
       "aria-label": "Main navigation",
-      children: t
+      children: r
     }
   );
 }
-function ia(n) {
-  var r = n, {
-    className: t = ""
-  } = r, a = y(r, [
+function ga(n) {
+  var t = n, {
+    className: r = ""
+  } = t, a = h(t, [
     "className"
   ]);
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ d(
     "div",
-    b({
+    m({
       role: "separator",
       className: `
         h-px
         bg-line-default
-        ${l("sm", "my")}
-        ${t}
+        ${o("sm", "my")}
+        ${r}
       `
     }, a)
   );
 }
-function sa(r) {
-  var i = r, {
-    orientation: t = "horizontal",
+function xa(t) {
+  var i = t, {
+    orientation: r = "horizontal",
     className: a = ""
-  } = i, n = y(i, [
+  } = i, n = h(i, [
     "orientation",
     "className"
   ]);
-  return t === "vertical" ? /* @__PURE__ */ o(
+  return r === "vertical" ? /* @__PURE__ */ d(
     "div",
-    b({
-      className: f("w-px", "h-6", "bg-line-default", "mx-auto", a),
+    m({
+      className: l("w-px", "h-6", "bg-line-default", "mx-auto", a),
       role: "separator",
       "aria-orientation": "vertical"
     }, n)
-  ) : /* @__PURE__ */ o(
+  ) : /* @__PURE__ */ d(
     "div",
-    b({
-      className: f(
+    m({
+      className: l(
         "w-full",
         "h-px",
         "bg-line-default",
-        l("sm", "my"),
+        o("sm", "my"),
         // my-2 (8px) para consistência com gap-2 usado em outros lugares
         "flex-shrink-0",
         // Prevenir que separator encolha
@@ -1751,124 +2080,124 @@ function sa(r) {
     }, n)
   );
 }
-function la(i) {
-  var s = i, { column: t, row: a, className: n = "" } = s, r = y(s, ["column", "row", "className"]);
-  const c = t.key in a ? a[t.key] : void 0;
-  return /* @__PURE__ */ o(
+function ya(i) {
+  var s = i, { column: r, row: a, className: n = "" } = s, t = h(s, ["column", "row", "className"]);
+  const c = r.key in a ? a[r.key] : void 0;
+  return /* @__PURE__ */ d(
     "td",
-    w(b({
-      className: `${l("lg", "px")} ${l("base", "py")} whitespace-nowrap text-sm text-fg-primary ${t.hiddenOnMobile ? "hidden md:table-cell" : ""} ${n}`
-    }, r), {
-      children: t.render ? t.render(c, a) : String(c != null ? c : "")
+    v(m({
+      className: `${o("lg", "px")} ${o("base", "py")} whitespace-nowrap text-sm text-fg-primary ${r.hiddenOnMobile ? "hidden md:table-cell" : ""} ${n}`
+    }, t), {
+      children: r.render ? r.render(c, a) : String(c != null ? c : "")
     })
   );
 }
-function oa({
-  items: t,
+function ha({
+  items: r,
   orientation: a = "vertical",
   className: n = ""
 }) {
-  return a === "horizontal" ? /* @__PURE__ */ o("div", { className: `flex items-start ${n}`, children: t.map((r, i) => {
-    const s = r.status || (i === 0 ? "active" : i < t.findIndex((d) => d.status === "active") ? "completed" : "default"), c = i === t.length - 1;
-    return /* @__PURE__ */ o("div", { className: "flex items-start flex-1", children: /* @__PURE__ */ T("div", { className: "flex flex-col items-center flex-1", children: [
-      /* @__PURE__ */ o(
+  return a === "horizontal" ? /* @__PURE__ */ d("div", { className: `flex items-start ${n}`, children: r.map((t, i) => {
+    const s = t.status || (i === 0 ? "active" : i < r.findIndex((f) => f.status === "active") ? "completed" : "default"), c = i === r.length - 1;
+    return /* @__PURE__ */ d("div", { className: "flex items-start flex-1", children: /* @__PURE__ */ C("div", { className: "flex flex-col items-center flex-1", children: [
+      /* @__PURE__ */ d(
         "div",
-        w(b({}, s === "default" ? { "data-marker": "pending" } : {}), {
+        v(m({}, s === "default" ? { "data-marker": "pending" } : {}), {
           className: `
                   flex
                   items-center
                   justify-center
                   w-10
                   h-10
-                  ${F("full")}
+                  ${M("full")}
                   border-2
                   ${s === "completed" ? "bg-success border-success text-fg-inverse" : s === "active" ? "bg-surface-brand-strong border-line-brand text-fg-inverse" : s === "error" ? "bg-error border-error text-fg-inverse" : "bg-surface-base border-line-emphasis text-fg-quaternary"}
                 `,
-          children: r.icon || (s === "completed" ? /* @__PURE__ */ o(Z, { className: "h-4 w-4" }) : i + 1)
+          children: t.icon || (s === "completed" ? /* @__PURE__ */ d(J, { className: "h-4 w-4" }) : i + 1)
         })
       ),
-      !c && /* @__PURE__ */ o(
+      !c && /* @__PURE__ */ d(
         "div",
         {
           className: `
                       w-full
                       h-0.5
-                      ${l("sm", "mt")}
+                      ${o("sm", "mt")}
                       ${s === "completed" ? "bg-success" : "bg-line-emphasis"}
                     `
         }
       ),
-      /* @__PURE__ */ T(
+      /* @__PURE__ */ C(
         "div",
         {
-          className: `${l("base", "mt")} text-center ${l("base", "px")}`,
+          className: `${o("base", "mt")} text-center ${o("base", "px")}`,
           children: [
-            r.timestamp && /* @__PURE__ */ o(
+            t.timestamp && /* @__PURE__ */ d(
               "p",
               {
-                className: `text-xs text-fg-tertiary ${l("xs", "mb")}`,
-                children: r.timestamp
+                className: `text-xs text-fg-tertiary ${o("xs", "mb")}`,
+                children: t.timestamp
               }
             ),
-            /* @__PURE__ */ o("h3", { className: "text-sm font-semibold text-fg-primary", children: r.title }),
-            r.description && /* @__PURE__ */ o(
+            /* @__PURE__ */ d("h3", { className: "text-sm font-semibold text-fg-primary", children: t.title }),
+            t.description && /* @__PURE__ */ d(
               "p",
               {
-                className: `text-xs text-fg-secondary ${l("xs", "mt")}`,
-                children: r.description
+                className: `text-xs text-fg-secondary ${o("xs", "mt")}`,
+                children: t.description
               }
             ),
-            r.content && /* @__PURE__ */ o("div", { className: l("sm", "mt"), children: r.content })
+            t.content && /* @__PURE__ */ d("div", { className: o("sm", "mt"), children: t.content })
           ]
         }
       )
-    ] }) }, r.id);
-  }) }) : /* @__PURE__ */ o("div", { className: `${l("none", "space-y")} ${n}`, children: t.map((r, i) => {
-    const s = r.status || (i === 0 ? "active" : i < t.findIndex((d) => d.status === "active") ? "completed" : "default"), c = i === t.length - 1;
-    return /* @__PURE__ */ T(
+    ] }) }, t.id);
+  }) }) : /* @__PURE__ */ d("div", { className: `${o("none", "space-y")} ${n}`, children: r.map((t, i) => {
+    const s = t.status || (i === 0 ? "active" : i < r.findIndex((f) => f.status === "active") ? "completed" : "default"), c = i === r.length - 1;
+    return /* @__PURE__ */ C(
       "div",
       {
-        className: `flex items-start ${l("base", "gap")}`,
+        className: `flex items-start ${o("base", "gap")}`,
         children: [
-          /* @__PURE__ */ T("div", { className: "flex flex-col items-center", children: [
-            /* @__PURE__ */ o(
+          /* @__PURE__ */ C("div", { className: "flex flex-col items-center", children: [
+            /* @__PURE__ */ d(
               "div",
-              w(b({}, s === "default" ? { "data-marker": "pending" } : {}), {
+              v(m({}, s === "default" ? { "data-marker": "pending" } : {}), {
                 className: `
                 flex
                 items-center
                 justify-center
                 w-10
                 h-10
-                ${F("full")}
+                ${M("full")}
                 border-2
                 ${s === "completed" ? "bg-success border-success text-fg-inverse" : s === "active" ? "bg-surface-brand-strong border-line-brand text-fg-inverse" : s === "error" ? "bg-error border-error text-fg-inverse" : "bg-surface-base border-line-emphasis text-fg-quaternary"}
               `,
-                children: r.icon || (s === "completed" ? /* @__PURE__ */ o(Z, { className: "h-4 w-4" }) : i + 1)
+                children: t.icon || (s === "completed" ? /* @__PURE__ */ d(J, { className: "h-4 w-4" }) : i + 1)
               })
             ),
-            !c && /* @__PURE__ */ o(
+            !c && /* @__PURE__ */ d(
               "div",
               {
                 className: `
                     w-0.5
                     flex-1
                     min-h-16
-                    ${l("sm", "mt")}
+                    ${o("sm", "mt")}
                     ${s === "completed" ? "bg-success" : "bg-line-emphasis"}
                   `
               }
             )
           ] }),
-          /* @__PURE__ */ T("div", { className: `flex-1 ${l("xl", "pb")}`, children: [
-            r.timestamp && /* @__PURE__ */ o(
+          /* @__PURE__ */ C("div", { className: `flex-1 ${o("xl", "pb")}`, children: [
+            t.timestamp && /* @__PURE__ */ d(
               "p",
               {
-                className: `text-xs text-fg-tertiary ${l("xs", "mb")}`,
-                children: r.timestamp
+                className: `text-xs text-fg-tertiary ${o("xs", "mb")}`,
+                children: t.timestamp
               }
             ),
-            /* @__PURE__ */ o(
+            /* @__PURE__ */ d(
               "h3",
               {
                 className: `
@@ -1876,45 +2205,49 @@ function oa({
                 font-semibold
                 ${s === "active" ? "text-fg-brand-emphasis" : "text-fg-primary"}
               `,
-                children: r.title
+                children: t.title
               }
             ),
-            r.description && /* @__PURE__ */ o(
+            t.description && /* @__PURE__ */ d(
               "p",
               {
-                className: `text-sm text-fg-secondary ${l("xs", "mt")}`,
-                children: r.description
+                className: `text-sm text-fg-secondary ${o("xs", "mt")}`,
+                children: t.description
               }
             ),
-            r.content && /* @__PURE__ */ o("div", { className: l("md", "mt"), children: r.content })
+            t.content && /* @__PURE__ */ d("div", { className: o("md", "mt"), children: t.content })
           ] })
         ]
       },
-      r.id
+      t.id
     );
   }) });
 }
 export {
-  Ve as AutocompleteOption,
-  Qe as Breadcrumb,
-  Te as Chip,
-  De as Container,
-  ea as DialogFooter,
-  Je as DialogHeader,
-  ta as DrawerFooter,
-  aa as DrawerHeader,
-  Xe as ErrorMessage,
-  ra as HeaderActions,
-  na as HeaderNavigation,
-  Ye as Info,
-  ia as MenuSeparator,
-  sa as NavbarSeparator,
-  Ae as Progress,
-  Ze as Skeleton,
-  Ie as Spinner,
-  _e as Stack,
-  la as TableCell,
-  Ge as Text,
-  oa as Timeline
+  Ze as AutocompleteOption,
+  ye as Badge,
+  da as Breadcrumb,
+  Ge as Card,
+  Le as Chip,
+  Xe as Container,
+  fa as DialogFooter,
+  ca as DialogHeader,
+  ua as DrawerFooter,
+  pa as DrawerHeader,
+  ia as ErrorMessage,
+  ma as HeaderActions,
+  ba as HeaderNavigation,
+  sa as Info,
+  Ae as Label,
+  ga as MenuSeparator,
+  xa as NavbarSeparator,
+  Re as Progress,
+  Be as Separator,
+  la as Skeleton,
+  Pe as Spinner,
+  Ye as Stack,
+  ya as TableCell,
+  oa as Text,
+  ha as Timeline
 };
 //# sourceMappingURL=index.js.map