@hirobius/design-system 0.22.0 → 0.23.0

package/dist/chunks/{empty-state-DNoThgfV.js → empty-state-ChC_xZfg.js}

@@ -1,7 +1,7 @@
 'use client';
-import h from "../tokens.js";
-import * as g from "react";
-import T, { useState as Q, useEffect as Z, forwardRef as me, useId as H } from "react";
+import g from "../tokens.js";
+import * as h from "react";
+import _, { useState as Q, useEffect as Z, forwardRef as me, useId as H } from "react";
 import { jsx as s, jsxs as k, Fragment as fe } from "react/jsx-runtime";
 import { Slot as pe } from "@radix-ui/react-slot";
 import { cva as E } from "class-variance-authority";
@@ -24,7 +24,7 @@ function we() {
   }, []), t;
 }
 function Yt(t) {
-  const e = we(), r = h.motion[t];
+  const e = we(), r = g.motion[t];
   return e ? { ...r, duration: 0 } : r;
 }
 const te = Symbol("hds.env.absent");
@@ -49,7 +49,7 @@ const ke = {
   bold: 2.5,
   fill: 2,
   duotone: 2
-}, Ce = /* @__PURE__ */ T.forwardRef(function({
+}, Ce = /* @__PURE__ */ _.forwardRef(function({
   icon: e,
   size: r = "small",
   color: n = "currentColor",
@@ -60,7 +60,7 @@ const ke = {
 }, l) {
   if (L() && !e)
     return console.warn("[Icon] icon prop is missing or undefined. Provide a Lucide icon component."), null;
-  const i = h.iconSize[r] || r, u = c ? ke[c] : void 0, p = {
+  const i = g.iconSize[r] || r, u = c ? ke[c] : void 0, p = {
     width: i,
     height: i,
     minWidth: i,
@@ -105,23 +105,23 @@ const Ne = {
   "zoom",
   "tabSize",
   "aspectRatio"
-]), Re = /* @__PURE__ */ new Set([0, 1, 2, 3, 4, 5, 6, 7, 8, 10, 12, 16, 20, 24, 32]), R = {
+]), Re = /* @__PURE__ */ new Set([0, 1, 2, 3, 4, 5, 6, 7, 8, 10, 12, 16, 20, 24, 32]), D = {
   xs: "var(--semantic-space-scale-xs)",
   sm: "var(--semantic-space-scale-sm)",
   md: "var(--semantic-space-scale-md)",
   lg: "var(--semantic-space-scale-lg)",
   xl: "var(--semantic-space-scale-xl)"
 }, M = {
-  tight: R.sm,
-  normal: R.md,
-  inset: R.lg,
-  spacious: R.xl
+  tight: D.sm,
+  normal: D.md,
+  inset: D.lg,
+  spacious: D.xl
 }, De = {
   names: { ...M, medium: "var(--semantic-space-component-medium)" },
   closed: !0
 }, Te = {
   names: {
-    ...R,
+    ...D,
     tight: "var(--semantic-space-layout-tight)",
     normal: "var(--semantic-space-layout-normal)",
     inset: "var(--semantic-space-layout-inset)",
@@ -250,12 +250,12 @@ function Ke(t) {
   return `hds-sx-${He(z(t))}`;
 }
 const U = /* @__PURE__ */ new Set();
-let D = null;
+let T = null;
 function We() {
   if (typeof document > "u") return null;
-  if (D && D.isConnected) return D;
+  if (T && T.isConnected) return T;
   let t = document.querySelector("style[data-hds-sx]");
-  return t || (t = document.createElement("style"), t.setAttribute("data-hds-sx", ""), document.head.appendChild(t)), D = t, D;
+  return t || (t = document.createElement("style"), t.setAttribute("data-hds-sx", ""), document.head.appendChild(t)), T = t, T;
 }
 function Xt(t) {
   const e = Ke(t);
@@ -273,7 +273,7 @@ function Xt(t) {
   return e;
 }
 const Ue = /* @__PURE__ */ E(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md transition-[colors,filter] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50 active:inset-shadow-[0_0_0_9999px] active:inset-shadow-pressed-overlay/5 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md transition-[colors,filter] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:bg-muted disabled:text-[var(--semantic-color-content-disabled)] active:inset-shadow-[0_0_0_9999px] active:inset-shadow-pressed-overlay/5 [&_svg]:pointer-events-none [&_svg]:shrink-0",
   {
     variants: {
       variant: {
@@ -293,6 +293,12 @@ const Ue = /* @__PURE__ */ E(
       // leaks the variant's class through (the reason the hover pair is here).
       // A consumer `className` comes last and overrides tone the same way.
       // Drives the destructive/status actions consumers previously kept on MUI.
+      // A tone sets its own bg/text. When disabled, the base string's
+      // `disabled:bg-muted` / `disabled:text-…` win via the `:disabled`
+      // pseudo-class (higher specificity than the tone's unmodified color), so
+      // a disabled toned button reads neutral-disabled WITHOUT the tone needing
+      // its own disabled classes — which would break the tone-over-variant
+      // contract. So tones stay color-only here.
       tone: {
         neutral: "",
         danger: "border-transparent bg-feedback-bg-danger text-feedback-danger hover:bg-feedback-bg-danger hover:border-transparent hover:brightness-95 dark:hover:brightness-110",
@@ -324,7 +330,7 @@ const Ue = /* @__PURE__ */ E(
   }
 ), Ye = "data-[pressed=true]:border-transparent data-[pressed=true]:bg-primary data-[pressed=true]:text-primary-foreground data-[pressed=true]:hover:bg-primary/90";
 let Y = !1, X = !1;
-const Ft = /* @__PURE__ */ g.forwardRef(
+const Ft = /* @__PURE__ */ h.forwardRef(
   function({
     className: e,
     variant: r,
@@ -344,8 +350,8 @@ const Ft = /* @__PURE__ */ g.forwardRef(
     onPressedChange: v,
     onClick: w,
     ...C
-  }, _) {
-    const P = p || l, S = m ?? d, N = f !== void 0 || x !== void 0 || v !== void 0, [de, le] = g.useState(x ?? !1), O = f ?? de, B = N ? {
+  }, P) {
+    const R = p || l, S = m ?? d, N = f !== void 0 || x !== void 0 || v !== void 0, [de, le] = h.useState(x ?? !1), O = f ?? de, B = N ? {
       "aria-pressed": O,
       "data-pressed": O ? "true" : "false",
       onClick: (G) => {
@@ -359,10 +365,14 @@ const Ft = /* @__PURE__ */ g.forwardRef(
     return c ? /* @__PURE__ */ s(
       pe,
       {
-        ref: _,
-        className: V,
-        "aria-disabled": P || void 0,
+        ref: P,
+        className: y(
+          V,
+          R && "pointer-events-none text-[var(--semantic-color-content-disabled)]"
+        ),
+        "aria-disabled": R || void 0,
         "aria-busy": l || void 0,
+        tabIndex: R ? -1 : void 0,
         "data-state": l ? "loading" : void 0,
         "data-variant": r ?? void 0,
         "data-tone": n ?? void 0,
@@ -378,9 +388,9 @@ const Ft = /* @__PURE__ */ g.forwardRef(
     )), /* @__PURE__ */ k(
       "button",
       {
-        ref: _,
+        ref: P,
         type: b,
-        disabled: P,
+        disabled: R,
         "aria-busy": l || void 0,
         ...o && d ? { "aria-label": d } : {},
         "data-state": l ? "loading" : void 0,
@@ -391,7 +401,7 @@ const Ft = /* @__PURE__ */ g.forwardRef(
         ...B,
         ...C,
         children: [
-          l ? /* @__PURE__ */ s(ge, { className: "animate-spin", "aria-hidden": "true" }) : i,
+          l ? /* @__PURE__ */ s(ge, { className: "animate-spin motion-reduce:animate-none", "aria-hidden": "true" }) : i,
           !o && S,
           !l && !o && u
         ]
@@ -450,7 +460,7 @@ function Je(t) {
   return qe[t] ?? "0";
 }
 const Qe = {
-  names: { ...h.space, ...M },
+  names: { ...g.space, ...M },
   numbers: "raw"
 }, Ze = /* @__PURE__ */ E("flex flex-col rounded-lg bg-card text-card-foreground", {
   variants: {
@@ -486,7 +496,7 @@ function rt(t) {
   const e = (n = (r = t.target).closest) == null ? void 0 : n.call(r, tt);
   return !!e && e !== t.currentTarget && t.currentTarget.contains(e);
 }
-const nt = /* @__PURE__ */ g.forwardRef(function({
+const nt = /* @__PURE__ */ h.forwardRef(function({
   className: e,
   padding: r = "component",
   gap: n = "tight",
@@ -502,7 +512,7 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
   children: b,
   ...f
 }, x) {
-  const v = o ?? "div", w = a ? "none" : r, C = Je(w), _ = w === "none" ? "0" : $(n, Qe), P = u ? {
+  const v = o ?? "div", w = a ? "none" : r, C = Je(w), P = w === "none" ? "0" : $(n, Qe), R = u ? {
     role: "checkbox",
     "aria-checked": p,
     tabIndex: 0,
@@ -531,28 +541,28 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
       ),
       style: {
         padding: C,
-        gap: _,
+        gap: P,
         ...c
       },
       ...f,
-      ...P,
+      ...R,
       children: b
     }
   );
-}), at = /* @__PURE__ */ g.forwardRef(
+}), at = /* @__PURE__ */ h.forwardRef(
   function({ className: e, metadata: r, children: n, ...a }, o) {
     return r !== void 0 ? /* @__PURE__ */ k("div", { ref: o, className: y("flex flex-col gap-3 p-6", e), ...a, children: [
       /* @__PURE__ */ s("div", { className: "flex flex-wrap items-center gap-2", children: r }),
       /* @__PURE__ */ s("div", { className: "flex flex-col space-y-1.5 min-w-0", children: n })
     ] }) : /* @__PURE__ */ s("div", { ref: o, className: y("flex flex-col space-y-1.5 p-6", e), ...a, children: n });
   }
-), ot = /* @__PURE__ */ g.forwardRef(function({ className: e, children: r, ...n }, a) {
+), ot = /* @__PURE__ */ h.forwardRef(function({ className: e, children: r, ...n }, a) {
   return /* @__PURE__ */ s(I, { ref: a, as: "h3", variant: "title", className: e, ...n, children: r });
-}), st = /* @__PURE__ */ g.forwardRef(function({ className: e, children: r, ...n }, a) {
+}), st = /* @__PURE__ */ h.forwardRef(function({ className: e, children: r, ...n }, a) {
   return /* @__PURE__ */ s(I, { ref: a, variant: "caption", className: y("text-muted-foreground", e), ...n, children: r });
-}), it = /* @__PURE__ */ g.forwardRef(function({ className: e, ...r }, n) {
+}), it = /* @__PURE__ */ h.forwardRef(function({ className: e, ...r }, n) {
   return /* @__PURE__ */ s("div", { ref: n, className: y("p-6 pt-0", e), ...r });
-}), ct = /* @__PURE__ */ g.forwardRef(function({ className: e, ...r }, n) {
+}), ct = /* @__PURE__ */ h.forwardRef(function({ className: e, ...r }, n) {
   return /* @__PURE__ */ s("div", { ref: n, className: y("flex items-center p-6 pt-0", e), ...r });
 }), dt = {
   neutral: "var(--semantic-color-content-accent)",
@@ -560,7 +570,7 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
   success: "var(--semantic-color-feedback-success)",
   warning: "var(--semantic-color-feedback-warning)",
   danger: "var(--semantic-color-feedback-error)"
-}, lt = /* @__PURE__ */ g.forwardRef(
+}, lt = /* @__PURE__ */ h.forwardRef(
   function({ className: e, value: r, max: n = 100, label: a, tone: o = "neutral", style: c, ...d }, l) {
     const i = Math.max(0, Math.min(r, n)), u = n > 0 ? i / n * 100 : 0;
     return /* @__PURE__ */ k(
@@ -582,7 +592,7 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
               style: {
                 height: "4px",
                 background: "var(--semantic-color-border-default)",
-                borderRadius: h.borderRadius[2],
+                borderRadius: g.borderRadius[2],
                 overflow: "hidden"
               },
               children: /* @__PURE__ */ s(
@@ -594,8 +604,8 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
                     transform: `scaleX(${u / 100})`,
                     transformOrigin: "left",
                     background: dt[o],
-                    borderRadius: h.borderRadius[2],
-                    transition: `transform ${h.motion.expressive.duration}s ease-out`
+                    borderRadius: g.borderRadius[2],
+                    transition: `transform ${g.motion.expressive.duration}s ease-out`
                   }
                 }
               )
@@ -605,7 +615,7 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
             "p",
             {
               style: {
-                ...h.typeStyles.caption,
+                ...g.typeStyles.caption,
                 margin: "6px 0 0",
                 color: "var(--semantic-color-content-secondary)"
               },
@@ -622,14 +632,14 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
   success: "var(--semantic-color-feedback-success)",
   warning: "var(--semantic-color-feedback-warning)",
   danger: "var(--semantic-color-feedback-error)"
-}, mt = /* @__PURE__ */ g.forwardRef(
+}, mt = /* @__PURE__ */ h.forwardRef(
   function({ className: e, label: r, value: n, sub: a, tone: o = "neutral", style: c, ...d }, l) {
     return /* @__PURE__ */ k("div", { ref: l, className: y("flex flex-col px-6", e), style: c, ...d, children: [
       /* @__PURE__ */ s(
         "p",
         {
           style: {
-            ...h.typeStyles.caption,
+            ...g.typeStyles.caption,
             margin: "0 0 6px",
             color: "var(--semantic-color-content-secondary)"
           },
@@ -640,7 +650,7 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
         "p",
         {
           style: {
-            ...h.typeStyles.title,
+            ...g.typeStyles.title,
             margin: 0,
             color: ut[o]
           },
@@ -651,7 +661,7 @@ const nt = /* @__PURE__ */ g.forwardRef(function({
         "p",
         {
           style: {
-            ...h.typeStyles.caption,
+            ...g.typeStyles.caption,
             margin: "4px 0 0",
             color: "var(--semantic-color-content-secondary)"
           },
@@ -690,12 +700,12 @@ function Jt({
   };
   return /* @__PURE__ */ s("div", { className: a, style: o, children: t });
 }
-const ae = /* @__PURE__ */ g.createContext({}), oe = /* @__PURE__ */ g.createContext(null);
+const ae = /* @__PURE__ */ h.createContext({}), oe = /* @__PURE__ */ h.createContext(null);
 function pt() {
-  return g.useContext(oe);
+  return h.useContext(oe);
 }
 function Qt() {
-  return g.useContext(ae);
+  return h.useContext(ae);
 }
 function Zt({
   theme: t,
@@ -708,10 +718,10 @@ function Zt({
   style: d,
   children: l
 }) {
-  const i = g.useMemo(
+  const i = h.useMemo(
     () => ({ theme: t, density: e, brand: r, fontFamily: n, fontFamilyMono: a }),
     [t, e, r, n, a]
-  ), [u, p] = g.useState(null), m = {};
+  ), [u, p] = h.useState(null), m = {};
   return n && (m["--hds-font-family"] = n), a && (m["--hds-font-family-mono"] = a), /* @__PURE__ */ s(ae.Provider, { value: i, children: /* @__PURE__ */ s(oe.Provider, { value: u, children: /* @__PURE__ */ s(
     o,
     {
@@ -727,12 +737,12 @@ function Zt({
     }
   ) }) });
 }
-const gt = typeof document > "u" ? g.useEffect : g.useLayoutEffect;
+const gt = typeof document > "u" ? h.useEffect : h.useLayoutEffect;
 function F(t) {
   return t === document.documentElement || t === document.body;
 }
 function ht(t) {
-  const e = pt(), r = g.useRef(null), [n, a] = g.useState(void 0), o = t === void 0 && e === null;
+  const e = pt(), r = h.useRef(null), [n, a] = h.useState(void 0), o = t === void 0 && e === null;
   gt(() => {
     var l;
     if (!o) return;
@@ -759,7 +769,7 @@ const er = /* @__PURE__ */ se(function({
   children: r
 }) {
   return be(r, e ?? document.body);
-}), yt = /* @__PURE__ */ T.forwardRef(function({ children: e, colSpan: r, colOffset: n, style: a, className: o, as: c = "div" }, d) {
+}), yt = /* @__PURE__ */ _.forwardRef(function({ children: e, colSpan: r, colOffset: n, style: a, className: o, as: c = "div" }, d) {
   const l = {
     ...r !== void 0 && { gridColumn: `span min(var(--current-cols, 12), ${r})` },
     ...n !== void 0 && { gridColumnStart: n },
@@ -774,9 +784,9 @@ const er = /* @__PURE__ */ se(function({
   stretch: "stretch"
 }, q = "280px";
 function bt(t, e) {
-  return t <= h.breakpoints.sm ? Math.min(4, e) : t <= h.breakpoints.lg ? Math.min(8, e) : e;
+  return t <= g.breakpoints.sm ? Math.min(4, e) : t <= g.breakpoints.lg ? Math.min(8, e) : e;
 }
-const xt = /* @__PURE__ */ T.forwardRef(function({
+const xt = /* @__PURE__ */ _.forwardRef(function({
   children: e,
   layout: r = "fixed",
   minItemWidth: n,
@@ -836,16 +846,16 @@ const xt = /* @__PURE__ */ T.forwardRef(function({
   "space-between": "space-between"
 }, kt = {
   names: {
-    ...h.space,
+    ...g.space,
     ...M,
-    gap: R.xs,
+    gap: D.xs,
     medium: "var(--semantic-space-component-medium)",
     hairline: "var(--semantic-space-subgrid-hairline)",
     xs: "var(--semantic-space-subgrid-xs)",
     stack: "var(--semantic-space-section-stack)"
   },
   numbers: "raw"
-}, rr = /* @__PURE__ */ T.forwardRef(function({
+}, rr = /* @__PURE__ */ _.forwardRef(function({
   children: e,
   direction: r = "column",
   gap: n = "tight",
@@ -896,7 +906,7 @@ const xt = /* @__PURE__ */ T.forwardRef(function({
     },
     defaultVariants: { padding: "component", shadow: !1 }
   }
-), At = /* @__PURE__ */ T.forwardRef(
+), At = /* @__PURE__ */ _.forwardRef(
   function({
     children: e,
     padding: r = "component",
@@ -958,7 +968,10 @@ const xt = /* @__PURE__ */ T.forwardRef(function({
     defaultVariants: { align: "left" }
   }
 ), Et = /* @__PURE__ */ E(
-  "flex items-start px-[var(--semantic-space-surface-padding)]",
+  // items-center (not items-start) so mixed cell content lines up on a shared
+  // vertical center — a badge/status slot no longer floats above its text
+  // siblings in the same row. Matches the header cell's items-center.
+  "flex items-center px-[var(--semantic-space-surface-padding)]",
   {
     variants: {
       align: {
@@ -979,18 +992,18 @@ const xt = /* @__PURE__ */ T.forwardRef(function({
     defaultVariants: { align: "left", divider: !0 }
   }
 ), Rt = {
-  label: h.typeStyles.ui,
-  value: h.typeStyles.ui,
+  label: g.typeStyles.ui,
+  value: g.typeStyles.ui,
   description: {
-    ...h.typeStyles.caption,
+    ...g.typeStyles.caption,
     color: "var(--semantic-color-content-secondary)"
   },
-  token: h.typeStyles.mono,
-  code: h.typeStyles.mono,
-  custom: h.typeStyles.ui,
-  icon: h.typeStyles.caption,
-  badge: h.typeStyles.caption,
-  action: h.typeStyles.ui
+  token: g.typeStyles.mono,
+  code: g.typeStyles.mono,
+  custom: g.typeStyles.ui,
+  icon: g.typeStyles.caption,
+  badge: g.typeStyles.caption,
+  action: g.typeStyles.ui
 };
 function nr({
   columns: t,
@@ -1006,21 +1019,25 @@ function nr({
 }) {
   const u = H(), p = H(), m = !!r, b = m ? u : o;
   return /* @__PURE__ */ k("div", { className: "min-w-0 max-w-full", children: [
-    r || a ? /* @__PURE__ */ k("div", { children: [
-      r ? /* @__PURE__ */ k("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ s(
-          "div",
-          {
-            id: m ? u : void 0,
-            className: "m-0 text-primary",
-            style: h.typeStyles.ui,
-            children: r
-          }
-        ),
-        n ?? null
-      ] }) : null,
-      a ? /* @__PURE__ */ s("div", { className: "text-secondary", style: h.typeStyles.ui, children: a }) : null
-    ] }) : null,
+    r || a ? (
+      // inline-ok: token-driven gap so the caption/description block doesn't
+      // touch the table's header band below it.
+      /* @__PURE__ */ k("div", { style: { marginBottom: g.semantic.space.scale.sm }, children: [
+        r ? /* @__PURE__ */ k("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ s(
+            "div",
+            {
+              id: m ? u : void 0,
+              className: "m-0 text-primary",
+              style: g.typeStyles.ui,
+              children: r
+            }
+          ),
+          n ?? null
+        ] }) : null,
+        a ? /* @__PURE__ */ s("div", { className: "text-secondary", style: g.typeStyles.ui, children: a }) : null
+      ] })
+    ) : null,
     /* @__PURE__ */ s(
       At,
       {
@@ -1055,7 +1072,7 @@ function nr({
                           sticky: !!i
                         })
                       ),
-                      style: h.typeStyles.caption,
+                      style: g.typeStyles.caption,
                       children: f.label
                     },
                     f.key
@@ -1073,7 +1090,7 @@ function nr({
                         sticky: !!i
                       })
                     ),
-                    style: h.typeStyles.caption,
+                    style: g.typeStyles.caption,
                     children: /* @__PURE__ */ k(
                       "button",
                       {
@@ -1116,7 +1133,7 @@ function nr({
 function Dt(t) {
   return /* @__PURE__ */ s(A.Root, { ...t });
 }
-const Tt = A.Trigger, ie = /* @__PURE__ */ se(A.Portal), _t = A.Action, Pt = A.Cancel, ce = /* @__PURE__ */ g.forwardRef(function({ className: e, ...r }, n) {
+const Tt = A.Trigger, ie = /* @__PURE__ */ se(A.Portal), _t = A.Action, Pt = A.Cancel, ce = /* @__PURE__ */ h.forwardRef(function({ className: e, ...r }, n) {
   return /* @__PURE__ */ s(
     A.Overlay,
     {
@@ -1125,7 +1142,7 @@ const Tt = A.Trigger, ie = /* @__PURE__ */ se(A.Portal), _t = A.Action, Pt = A.C
       ...r
     }
   );
-}), Ot = /* @__PURE__ */ g.forwardRef(function({ className: e, container: r, ...n }, a) {
+}), Ot = /* @__PURE__ */ h.forwardRef(function({ className: e, container: r, ...n }, a) {
   return /* @__PURE__ */ k(ie, { container: r, children: [
     /* @__PURE__ */ s(ce, {}),
     /* @__PURE__ */ s(
@@ -1141,9 +1158,9 @@ const Tt = A.Trigger, ie = /* @__PURE__ */ se(A.Portal), _t = A.Action, Pt = A.C
       }
     )
   ] });
-}), $t = /* @__PURE__ */ g.forwardRef(function({ className: e, ...r }, n) {
+}), $t = /* @__PURE__ */ h.forwardRef(function({ className: e, ...r }, n) {
   return /* @__PURE__ */ s("div", { ref: n, className: y("flex flex-col space-y-1.5 text-left", e), ...r });
-}), It = /* @__PURE__ */ g.forwardRef(function({ className: e, ...r }, n) {
+}), It = /* @__PURE__ */ h.forwardRef(function({ className: e, ...r }, n) {
   return /* @__PURE__ */ s(
     "div",
     {
@@ -1152,9 +1169,9 @@ const Tt = A.Trigger, ie = /* @__PURE__ */ se(A.Portal), _t = A.Action, Pt = A.C
       ...r
     }
   );
-}), Lt = /* @__PURE__ */ g.forwardRef(function({ className: e, children: r, ...n }, a) {
+}), Lt = /* @__PURE__ */ h.forwardRef(function({ className: e, children: r, ...n }, a) {
   return /* @__PURE__ */ s(A.Title, { asChild: !0, children: /* @__PURE__ */ s(I, { ref: a, as: "h2", variant: "title", className: e, ...n, children: r }) });
-}), jt = /* @__PURE__ */ g.forwardRef(function({ className: e, children: r, ...n }, a) {
+}), jt = /* @__PURE__ */ h.forwardRef(function({ className: e, children: r, ...n }, a) {
   return /* @__PURE__ */ s(A.Description, { asChild: !0, children: /* @__PURE__ */ s(
     I,
     {
@@ -1180,7 +1197,7 @@ const Tt = A.Trigger, ie = /* @__PURE__ */ se(A.Portal), _t = A.Action, Pt = A.C
   // Set here, not by a later `AlertDialog.displayName = …` write: a top-level
   // property write is a side effect that keeps the module alive.
   displayName: "AlertDialog"
-}), or = /* @__PURE__ */ g.forwardRef(
+}), or = /* @__PURE__ */ h.forwardRef(
   function({ title: e, description: r, className: n }, a) {
     return /* @__PURE__ */ k(
       "div",

package/dist/chunks/{form-By82qZcC.js → form-zCZ_B83I.js}

@@ -2,45 +2,45 @@
 import { jsx as f, jsxs as p } from "react/jsx-runtime";
 import * as s from "react";
 import { cn as m } from "../cn.js";
-const I = /* @__PURE__ */ s.forwardRef(function({ className: e, ...n }, o) {
-  return /* @__PURE__ */ f("form", { ref: o, className: m("flex flex-col gap-4", e), ...n });
+const I = /* @__PURE__ */ s.forwardRef(function({ className: e, ...n }, r) {
+  return /* @__PURE__ */ f("form", { ref: r, className: m("flex flex-col gap-4", e), ...n });
 });
 function x({
   htmlFor: c,
   childId: e,
   description: n,
-  error: o
+  error: r
 }) {
-  const i = s.useId(), r = c ?? e ?? i, d = `${r}-description`, t = `${r}-error`, a = [n ? d : null, o ? t : null].filter(Boolean).join(" ") || void 0;
-  return { controlId: r, descriptionId: d, errorId: t, describedBy: a };
+  const o = s.useId(), i = c ?? e ?? o, d = `${i}-description`, t = `${i}-error`, a = [n && !r ? d : null, r ? t : null].filter(Boolean).join(" ") || void 0;
+  return { controlId: i, descriptionId: d, errorId: t, describedBy: a };
 }
 const b = /* @__PURE__ */ s.forwardRef(
-  function({ controlId: e, label: n, description: o, error: i, required: r = !1, className: d, children: t }, a) {
+  function({ controlId: e, label: n, description: r, error: o, required: i = !1, className: d, children: t }, a) {
     const l = `${e}-description`, u = `${e}-error`;
     return /* @__PURE__ */ p("div", { ref: a, className: m("flex flex-col gap-2", d), children: [
       /* @__PURE__ */ p("label", { htmlFor: e, className: "hds-type-ui text-foreground", children: [
         n,
-        r ? /* @__PURE__ */ p("span", { "aria-hidden": "true", className: "text-destructive", children: [
+        i ? /* @__PURE__ */ p("span", { "aria-hidden": "true", className: "text-destructive", children: [
           " ",
           "*"
         ] }) : null
       ] }),
       t,
-      o && !i ? /* @__PURE__ */ f("p", { id: l, className: "hds-type-caption text-muted-foreground", children: o }) : null,
-      i ? /* @__PURE__ */ f("p", { id: u, role: "alert", className: "hds-type-caption text-destructive", children: i }) : null
+      r && !o ? /* @__PURE__ */ f("p", { id: l, className: "hds-type-caption text-muted-foreground", children: r }) : null,
+      o ? /* @__PURE__ */ f("p", { id: u, role: "alert", className: "hds-type-caption text-destructive", children: o }) : null
     ] });
   }
 ), g = /* @__PURE__ */ s.forwardRef(
-  function({ label: e, children: n, htmlFor: o, description: i, error: r, required: d = !1, className: t }, a) {
+  function({ label: e, children: n, htmlFor: r, description: o, error: i, required: d = !1, className: t }, a) {
     const l = s.Children.only(n), { controlId: u, describedBy: h } = x({
-      htmlFor: o,
+      htmlFor: r,
       childId: l.props.id,
-      description: i,
-      error: r
+      description: o,
+      error: i
     }), F = s.cloneElement(l, {
       id: u,
       required: l.props.required ?? d,
-      "aria-invalid": r ? !0 : l.props["aria-invalid"],
+      "aria-invalid": i ? !0 : l.props["aria-invalid"],
       "aria-describedby": [l.props["aria-describedby"], h].filter(Boolean).join(" ") || void 0
     });
     return /* @__PURE__ */ f(
@@ -49,8 +49,8 @@ const b = /* @__PURE__ */ s.forwardRef(
         ref: a,
         controlId: u,
         label: e,
-        description: i,
-        error: r,
+        description: o,
+        error: i,
         required: d,
         className: t,
         children: F