@actioneer/ads 0.5.7 → 0.5.8

package/components/audio-waveform.js

@@ -2,8 +2,9 @@
 import { jsxs as l, jsx as r } from "react/jsx-runtime";
 import * as u from "react";
 import { Button as ee, buttonVariants as re } from "./button.js";
-import { Loader as te, Warning as ae, Pause as ne, Play as oe, Download as se } from "../lib/icons.js";
-import { cn as ie } from "../lib/cn.js";
+import { Spinner as te } from "./spinner.js";
+import { Warning as ae, Pause as ne, Play as oe, Download as ie } from "../lib/icons.js";
+import { cn as se } from "../lib/cn.js";
 function A(t) {
   if (!t || !Number.isFinite(t) || t < 0) return "0:00";
   const e = Math.floor(t), a = Math.floor(e / 3600), c = Math.floor(e % 3600 / 60), d = e % 60;
@@ -18,7 +19,7 @@ function le(t, e, a) {
   const c = e != null && e.includes("wav") ? "wav" : e != null && e.includes("mpeg") ? "mp3" : "audio", d = ((m = t.split("/").filter(Boolean).at(-1)) == null ? void 0 : m.split("?")[0]) || "recording";
   return `${decodeURIComponent(d)}.${c}`;
 }
-function fe({
+function ge({
   src: t,
   durationSeconds: e,
   contentType: a,
@@ -28,20 +29,20 @@ function fe({
   downloadName: U,
   className: V
 }) {
-  const F = u.useRef(null), p = u.useRef(null), [G, b] = u.useState(0), [L, D] = u.useState(e ?? 0), [k, C] = u.useState(!1), [E, x] = u.useState(!1), [f, R] = u.useState(null), v = (c ?? 0) > 1, q = le(t, a, U);
+  const F = u.useRef(null), p = u.useRef(null), [G, b] = u.useState(0), [q, D] = u.useState(e ?? 0), [k, C] = u.useState(!1), [E, x] = u.useState(!1), [f, R] = u.useState(null), v = (c ?? 0) > 1, J = le(t, a, U);
   u.useEffect(() => {
     const o = F.current;
     if (!o) return;
     let M = !1;
     return b(0), D(e ?? 0), C(!1), x(!1), R(null), o.replaceChildren(), (async () => {
       try {
-        const [{ default: w }, { default: K }] = await Promise.all([
+        const [{ default: w }, { default: L }] = await Promise.all([
           import("wavesurfer.js"),
           import("wavesurfer.js/dist/plugins/hover.esm.js")
         ]);
         if (M) return;
-        const N = B(o, "--foreground", "currentColor"), O = B(o, "--muted-foreground", "currentColor"), Q = B(o, "--background", "Canvas"), X = (i, P) => {
-          const Y = i[0] ?? [], Z = i[1] ?? i[0] ?? [], { width: _, height: T } = P.canvas, y = T / 2, S = 4, I = 2, $ = Math.max(1, Math.floor(_ / (S + I))), H = (n, g) => {
+        const N = B(o, "--foreground", "currentColor"), O = B(o, "--muted-foreground", "currentColor"), Q = B(o, "--background", "Canvas"), X = (s, P) => {
+          const Y = s[0] ?? [], Z = s[1] ?? s[0] ?? [], { width: _, height: T } = P.canvas, S = T / 2, y = 4, I = 2, $ = Math.max(1, Math.floor(_ / (y + I))), H = (n, g) => {
             if (!n.length) return 0;
             const h = Math.floor(g / $ * n.length), j = Math.max(h + 1, Math.floor((g + 1) / $ * n.length));
             let W = 0;
@@ -49,10 +50,10 @@ function fe({
             return W;
           };
           for (let n = 0; n < $; n++) {
-            const g = n * (S + I), h = Math.max(1, H(Y, n) * (y - 2)), j = Math.max(1, H(Z, n) * (y - 2));
-            P.fillRect(g, y - h, S, h), P.fillRect(g, y + 1, S, j);
+            const g = n * (y + I), h = Math.max(1, H(Y, n) * (S - 2)), j = Math.max(1, H(Z, n) * (S - 2));
+            P.fillRect(g, S - h, y, h), P.fillRect(g, S + 1, y, j);
           }
-        }, s = w.create({
+        }, i = w.create({
           container: o,
           url: t,
           duration: e,
@@ -70,7 +71,7 @@ function fe({
           hideScrollbar: !0,
           renderFunction: v ? X : void 0,
           plugins: [
-            K.create({
+            L.create({
               lineColor: N,
               labelColor: Q,
               labelBackground: N,
@@ -79,11 +80,11 @@ function fe({
             })
           ]
         });
-        p.current = s, s.on("ready", (i) => {
-          D(i), C(!0);
-        }), s.on("timeupdate", (i) => b(i)), s.on("seeking", (i) => b(i)), s.on("play", () => x(!0)), s.on("pause", () => x(!1)), s.on("finish", () => {
-          x(!1), b(s.getDuration());
-        }), s.on("error", () => {
+        p.current = i, i.on("ready", (s) => {
+          D(s), C(!0);
+        }), i.on("timeupdate", (s) => b(s)), i.on("seeking", (s) => b(s)), i.on("play", () => x(!0)), i.on("pause", () => x(!1)), i.on("finish", () => {
+          x(!1), b(i.getDuration());
+        }), i.on("error", () => {
           R("Recording could not be loaded."), C(!1);
         });
       } catch {
@@ -94,17 +95,17 @@ function fe({
       M = !0, (w = p.current) == null || w.destroy(), p.current = null;
     };
   }, [t, e, v]);
-  const J = () => {
+  const K = () => {
     var o;
     !k || f || (o = p.current) == null || o.playPause();
   };
-  return /* @__PURE__ */ l("div", { className: ie("space-y-3", V), "data-slot": "audio-waveform", children: [
+  return /* @__PURE__ */ l("div", { className: se("space-y-3", V), "data-slot": "audio-waveform", children: [
     /* @__PURE__ */ l("div", { className: "flex items-center justify-between gap-3", children: [
       /* @__PURE__ */ l("div", { className: "min-w-0", children: [
         /* @__PURE__ */ r("p", { className: "text-base font-normal", children: "Recording" }),
         /* @__PURE__ */ r("p", { className: "mt-0.5 truncate text-xs text-muted-foreground", children: v ? `${d} above · ${m.toLowerCase()} below` : a ?? "Audio" })
       ] }),
-      /* @__PURE__ */ r("p", { className: "font-mono text-xs tabular-nums text-muted-foreground", children: A(L) })
+      /* @__PURE__ */ r("p", { className: "font-mono text-xs tabular-nums text-muted-foreground", children: A(q) })
     ] }),
     /* @__PURE__ */ l("div", { className: "relative overflow-hidden py-2", children: [
       v && /* @__PURE__ */ l("div", { className: "pointer-events-none absolute inset-x-0 top-2 z-10 flex h-[92px] flex-col items-center justify-between text-xs font-normal uppercase tracking-wide text-muted-foreground", children: [
@@ -113,7 +114,7 @@ function fe({
       ] }),
       /* @__PURE__ */ r("div", { ref: F, className: "min-h-[92px]" }),
       !k && !f && /* @__PURE__ */ r("div", { className: "absolute inset-0 flex items-center justify-center bg-background/70", children: /* @__PURE__ */ l("div", { className: "inline-flex items-center gap-2 rounded-md bg-background px-3 py-1.5 text-xs text-muted-foreground", children: [
-        /* @__PURE__ */ r(te, { className: "size-3.5 animate-spin motion-reduce:animate-none", "aria-hidden": "true" }),
+        /* @__PURE__ */ r(te, { variant: "content", size: "xs", "aria-hidden": !0 }),
         "Loading waveform"
       ] }) }),
       f && /* @__PURE__ */ r("div", { className: "absolute inset-0 flex items-center justify-center bg-background/80", children: /* @__PURE__ */ l("div", { className: "inline-flex items-center gap-2 rounded-md bg-background px-3 py-1.5 text-xs text-muted-foreground", children: [
@@ -127,7 +128,7 @@ function fe({
         {
           type: "button",
           variant: "secondary",
-          onClick: J,
+          onClick: K,
           disabled: !k || !!f,
           "aria-label": E ? "Pause recording" : "Play recording",
           startContent: E ? /* @__PURE__ */ r(ne, { "aria-hidden": "true" }) : /* @__PURE__ */ r(oe, { "aria-hidden": "true" }),
@@ -135,13 +136,13 @@ function fe({
           children: A(G)
         }
       ),
-      /* @__PURE__ */ l("a", { href: t, download: q, className: re({ variant: "ghost" }), children: [
-        /* @__PURE__ */ r(se, { "aria-hidden": "true", className: "size-4" }),
+      /* @__PURE__ */ l("a", { href: t, download: J, className: re({ variant: "ghost" }), children: [
+        /* @__PURE__ */ r(ie, { "aria-hidden": "true", className: "size-4" }),
         "Audio"
       ] })
     ] })
   ] });
 }
 export {
-  fe as AudioWaveform
+  ge as AudioWaveform
 };

package/components/autocomplete.d.ts

@@ -14,5 +14,6 @@ export interface AutocompleteProps {
     allowsCustomValue?: boolean;
     className?: string;
     id?: string;
+    "aria-describedby"?: string;
 }
 export declare const Autocomplete: React.ForwardRefExoticComponent<AutocompleteProps & React.RefAttributes<HTMLInputElement>>;

package/components/autocomplete.js

@@ -1,56 +1,57 @@
 "use client";
 import { jsxs as x, jsx as c } from "react/jsx-runtime";
 import * as o from "react";
-import { MotionConfig as j, AnimatePresence as z, motion as q } from "motion/react";
-import { Search as O, Check as P } from "../lib/icons.js";
+import { MotionConfig as z, AnimatePresence as q, motion as O } from "motion/react";
+import { Search as P, Check as B } from "../lib/icons.js";
 import { cn as y } from "../lib/cn.js";
-import { inputBaseClass as B } from "./field.js";
-import { floatVariants as F } from "../lib/motion.js";
-import { Ripple as K } from "./ripple.js";
-const Q = o.forwardRef(
+import { inputBaseClass as F } from "./field.js";
+import { floatVariants as K } from "../lib/motion.js";
+import { Ripple as Q } from "./ripple.js";
+const T = o.forwardRef(
   ({
     items: u,
     value: f,
-    onChange: i,
+    onChange: s,
     placeholder: A = "Search…",
     disabled: E,
     isInvalid: R,
     allowsCustomValue: p = !1,
     className: S,
-    id: I
-  }, M) => {
-    const d = u.find((e) => e.value === f), [m, h] = o.useState((d == null ? void 0 : d.label) ?? ""), [r, a] = o.useState(!1), [n, w] = o.useState(-1), N = o.useRef(null), k = o.useRef(null), b = o.useId();
+    id: I,
+    "aria-describedby": M
+  }, L) => {
+    const d = u.find((e) => e.value === f), [m, h] = o.useState((d == null ? void 0 : d.label) ?? ""), [r, a] = o.useState(!1), [l, w] = o.useState(-1), N = o.useRef(null), k = o.useRef(null), b = o.useId();
     o.useEffect(() => {
       h((d == null ? void 0 : d.label) ?? (p ? f ?? "" : ""));
     }, [d, f, p]);
-    const l = o.useMemo(() => {
+    const n = o.useMemo(() => {
       const e = m.trim().toLowerCase();
       return e ? u.filter((t) => t.label.toLowerCase().includes(e)) : u;
     }, [u, m]);
     o.useEffect(() => {
       if (!r) return;
       const e = (t) => {
-        var s;
-        (s = N.current) != null && s.contains(t.target) || a(!1);
+        var i;
+        (i = N.current) != null && i.contains(t.target) || a(!1);
       };
       return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
     }, [r]), o.useEffect(() => {
       var t;
-      if (!r || n < 0) return;
-      const e = (t = k.current) == null ? void 0 : t.children[n];
+      if (!r || l < 0) return;
+      const e = (t = k.current) == null ? void 0 : t.children[l];
       e == null || e.scrollIntoView({ block: "nearest" });
-    }, [r, n]);
+    }, [r, l]);
     const g = (e) => {
-      l.length !== 0 && w((t) => {
-        let s = t;
-        for (let v = 0; v < l.length; v++)
-          if (s = (s + e + l.length) % l.length, !l[s].disabled) return s;
+      n.length !== 0 && w((t) => {
+        let i = t;
+        for (let v = 0; v < n.length; v++)
+          if (i = (i + e + n.length) % n.length, !n[i].disabled) return i;
         return t;
       });
     }, D = (e) => {
-      const t = l[e];
-      !t || t.disabled || (i == null || i(t.value), h(t.label), a(!1));
-    }, L = (e) => {
+      const t = n[e];
+      !t || t.disabled || (s == null || s(t.value), h(t.label), a(!1));
+    }, $ = (e) => {
       switch (e.key) {
         case "ArrowDown":
           e.preventDefault(), r ? g(1) : a(!0);
@@ -59,7 +60,7 @@ const Q = o.forwardRef(
           e.preventDefault(), r ? g(-1) : a(!0);
           break;
         case "Enter":
-          r && n >= 0 ? (e.preventDefault(), D(n)) : p && (i == null || i(m), a(!1));
+          r && l >= 0 ? (e.preventDefault(), D(l)) : p && (s == null || s(m), a(!1));
           break;
         case "Escape":
           r && (e.preventDefault(), a(!1));
@@ -72,16 +73,16 @@ const Q = o.forwardRef(
     return /* @__PURE__ */ x("div", { ref: N, className: "relative", children: [
       /* @__PURE__ */ x("div", { className: "group/field relative", children: [
         /* @__PURE__ */ c(
-          O,
+          P,
           {
-            className: "pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground transition-colors duration-(--duration-fast) group-focus-within/field:text-foreground group-hover/field:text-foreground",
+            className: "pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground transition-colors duration-150 group-focus-within/field:text-foreground group-hover/field:text-foreground",
             "aria-hidden": !0
           }
         ),
         /* @__PURE__ */ c(
           "input",
           {
-            ref: M,
+            ref: L,
             id: I,
             type: "text",
             role: "combobox",
@@ -90,27 +91,28 @@ const Q = o.forwardRef(
             "aria-haspopup": "listbox",
             "aria-expanded": r,
             "aria-controls": b,
-            "aria-activedescendant": r && n >= 0 ? `${b}-opt-${n}` : void 0,
+            "aria-activedescendant": r && l >= 0 ? `${b}-opt-${l}` : void 0,
             "aria-invalid": R || void 0,
+            "aria-describedby": M,
             disabled: E,
             placeholder: A,
             value: m,
             onChange: (e) => {
-              h(e.target.value), a(!0), w(-1), p && (i == null || i(e.target.value));
+              h(e.target.value), a(!0), w(-1), p && (s == null || s(e.target.value));
             },
             onFocus: () => a(!0),
-            onKeyDown: L,
-            className: y(B, "h-10 pl-9", S)
+            onKeyDown: $,
+            className: y(F, "h-10 pl-9", S)
           }
         )
       ] }),
-      /* @__PURE__ */ c(j, { reducedMotion: "user", children: /* @__PURE__ */ c(z, { children: r && /* @__PURE__ */ x(
-        q.ul,
+      /* @__PURE__ */ c(z, { reducedMotion: "user", children: /* @__PURE__ */ c(q, { children: r && /* @__PURE__ */ x(
+        O.ul,
         {
           ref: k,
           id: b,
           role: "listbox",
-          variants: F,
+          variants: K,
           initial: "hidden",
           animate: "visible",
           exit: "hidden",
@@ -120,25 +122,25 @@ const Q = o.forwardRef(
             "rounded-md border border-border bg-elevated shadow-elevation"
           ),
           children: [
-            /* @__PURE__ */ c(K, { origin: "top" }),
-            l.length === 0 ? /* @__PURE__ */ c(
+            /* @__PURE__ */ c(Q, { origin: "top" }),
+            n.length === 0 ? /* @__PURE__ */ c(
               "li",
               {
                 role: "presentation",
                 className: "px-2 py-6 text-center text-xs text-muted-foreground",
                 children: "No results"
               }
-            ) : l.map((e, t) => {
-              const s = e.value === f, v = t === n;
+            ) : n.map((e, t) => {
+              const i = e.value === f, v = t === l;
               return /* @__PURE__ */ x(
                 "li",
                 {
                   id: `${b}-opt-${t}`,
                   role: "option",
-                  "aria-selected": s,
+                  "aria-selected": i,
                   "aria-disabled": e.disabled || void 0,
                   onMouseEnter: () => !e.disabled && w(t),
-                  onMouseDown: ($) => $.preventDefault(),
+                  onMouseDown: (j) => j.preventDefault(),
                   onClick: () => D(t),
                   className: y(
                     "flex cursor-pointer items-center justify-between gap-2",
@@ -148,7 +150,7 @@ const Q = o.forwardRef(
                   ),
                   children: [
                     /* @__PURE__ */ c("span", { className: "truncate", children: e.label }),
-                    s && /* @__PURE__ */ c(P, { className: "size-4 shrink-0", "aria-hidden": !0 })
+                    i && /* @__PURE__ */ c(B, { className: "size-4 shrink-0", "aria-hidden": !0 })
                   ]
                 },
                 e.value
@@ -160,7 +162,7 @@ const Q = o.forwardRef(
     ] });
   }
 );
-Q.displayName = "Autocomplete";
+T.displayName = "Autocomplete";
 export {
-  Q as Autocomplete
+  T as Autocomplete
 };

package/components/avatar.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as l, jsxs as x } from "react/jsx-runtime";
+import { jsx as n, jsxs as x } from "react/jsx-runtime";
 import * as f from "react";
 import { cn as i } from "../lib/cn.js";
 const g = {
@@ -7,7 +7,7 @@ const g = {
   md: "size-10 text-xs",
   lg: "size-12 text-base",
   xl: "size-16 text-lg"
-}, p = {
+}, h = {
   full: "rounded-full",
   lg: "rounded-lg"
 };
@@ -16,21 +16,21 @@ function v(r) {
   return e.length === 0 ? "" : e.length === 1 ? e[0].slice(0, 2).toUpperCase() : (e[0][0] + e[e.length - 1][0]).toUpperCase();
 }
 const m = [
-  "bg-(--color-cyan-soft) text-(--color-cyan-deep)",
-  "bg-(--color-lime-soft) text-(--color-lime-deep)",
-  "bg-(--color-amber-soft) text-(--color-amber-deep)",
-  "bg-info-100 text-info-700",
+  "bg-(--color-cyan-soft) text-ink-950",
+  "bg-(--color-lime-soft) text-ink-950",
+  "bg-(--color-amber-soft) text-ink-950",
+  "bg-info-100 text-ink-950",
   "bg-ink-300 text-ink-950"
 ];
-function y(r) {
+function k(r) {
   let e = 0;
   for (const t of r) e = e * 31 + t.charCodeAt(0) >>> 0;
   return m[e % m.length];
 }
 const N = f.forwardRef(
-  ({ className: r, src: e, name: t, size: o = "md", radius: s = "full", ...a }, c) => {
-    const n = t ? v(t) : "";
-    return /* @__PURE__ */ l(
+  ({ className: r, src: e, name: t, size: s = "md", radius: o = "full", ...a }, c) => {
+    const l = t ? v(t) : "";
+    return /* @__PURE__ */ n(
       "span",
       {
         ref: c,
@@ -40,28 +40,28 @@ const N = f.forwardRef(
           "relative inline-flex shrink-0 select-none items-center justify-center overflow-hidden font-normal",
           // Images sit on the neutral fill; initials take a deterministic
           // per-name identity tint so a roster reads multi-color.
-          e || !t ? "bg-fill text-fill-foreground" : y(t),
-          g[o],
-          p[s],
+          e || !t ? "bg-fill text-fill-foreground" : k(t),
+          g[s],
+          h[o],
           r
         ),
         ...a,
-        children: e ? /* @__PURE__ */ l(
+        children: e ? /* @__PURE__ */ n(
           "img",
           {
             src: e,
             alt: t ?? "",
             className: "size-full object-cover"
           }
-        ) : /* @__PURE__ */ l("span", { "aria-hidden": !0, children: n })
+        ) : /* @__PURE__ */ n("span", { "aria-hidden": !0, children: l })
       }
     );
   }
 );
 N.displayName = "Avatar";
-const k = f.forwardRef(
-  ({ className: r, max: e, size: t = "md", radius: o = "full", children: s, ...a }, c) => {
-    const n = f.Children.toArray(s), d = typeof e == "number" ? n.length - e : 0, h = typeof e == "number" ? n.slice(0, e) : n;
+const y = f.forwardRef(
+  ({ className: r, max: e, size: t = "md", radius: s = "full", children: o, ...a }, c) => {
+    const l = f.Children.toArray(o), d = typeof e == "number" ? l.length - e : 0, p = typeof e == "number" ? l.slice(0, e) : l;
     return /* @__PURE__ */ x(
       "div",
       {
@@ -69,7 +69,7 @@ const k = f.forwardRef(
         className: i("flex items-center", r),
         ...a,
         children: [
-          h.map((b, u) => /* @__PURE__ */ l(
+          p.map((b, u) => /* @__PURE__ */ n(
             "div",
             {
               className: i(
@@ -80,7 +80,7 @@ const k = f.forwardRef(
             },
             u
           )),
-          d > 0 && /* @__PURE__ */ l("div", { className: i("ring-2 ring-background rounded-full -ml-2"), children: /* @__PURE__ */ l(
+          d > 0 && /* @__PURE__ */ n("div", { className: i("ring-2 ring-background rounded-full -ml-2"), children: /* @__PURE__ */ n(
             "span",
             {
               role: "img",
@@ -89,9 +89,9 @@ const k = f.forwardRef(
                 "relative inline-flex shrink-0 select-none items-center justify-center overflow-hidden font-normal",
                 "bg-muted text-muted-foreground",
                 g[t],
-                p[o]
+                h[s]
               ),
-              children: /* @__PURE__ */ l("span", { "aria-hidden": !0, children: `+${d}` })
+              children: /* @__PURE__ */ n("span", { "aria-hidden": !0, children: `+${d}` })
             }
           ) })
         ]
@@ -99,8 +99,8 @@ const k = f.forwardRef(
     );
   }
 );
-k.displayName = "AvatarGroup";
+y.displayName = "AvatarGroup";
 export {
   N as Avatar,
-  k as AvatarGroup
+  y as AvatarGroup
 };

package/components/badge.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const badgeVariants: (props?: ({
-    variant?: "soft" | "solid" | "outline" | "dot" | null | undefined;
+    variant?: "soft" | "outline" | "solid" | "dot" | null | undefined;
     color?: "success" | "warning" | "danger" | "info" | "default" | "primary" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface BadgeProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "color">, VariantProps<typeof badgeVariants> {

package/components/breadcrumbs.js

@@ -44,7 +44,7 @@ const y = t.forwardRef(
         "data-stuck": r ? x ? "true" : "false" : void 0,
         className: a(
           "flex w-full items-center",
-          r && "sticky top-0 z-40 bg-background transition-[border-color] duration-(--duration-fast) ease-out motion-reduce:transition-none",
+          r && "sticky top-0 z-40 bg-background transition-[border-color] duration-150 ease-out motion-reduce:transition-none",
           // Sticky offsets resolve against the scrollport's PADDING box, so in
           // a padded panel the pinned trail sits below a strip the content
           // would otherwise scroll through. This cover extends the trail's own
@@ -63,7 +63,7 @@ const y = t.forwardRef(
               onClick: c,
               "aria-label": g,
               className: a(
-                "mr-1 inline-flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground",
+                "mr-1 inline-flex size-6 shrink-0 items-center justify-center rounded-sm text-muted-foreground",
                 "transition-colors hover:bg-fill hover:text-foreground",
                 "outline-none focus-visible:ring-3 focus-visible:ring-ring [&_svg]:size-4"
               ),

package/components/button.d.ts

@@ -1,8 +1,8 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 export declare const buttonVariants: (props?: ({
-    variant?: "danger" | "soft" | "link" | "solid" | "secondary" | "outline" | "ghost" | null | undefined;
-    size?: "sm" | "md" | "lg" | "xs" | "icon" | "icon-sm" | "icon-xs" | null | undefined;
+    variant?: "danger" | "soft" | "outline" | "link" | "solid" | "secondary" | "ghost" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "icon" | "icon-sm" | "icon-xs" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     isLoading?: boolean;

package/components/button.js

@@ -1,19 +1,20 @@
 "use client";
-import { jsxs as r, jsx as b } from "react/jsx-runtime";
-import * as c from "react";
+import { jsxs as r, jsx as m } from "react/jsx-runtime";
+import * as b from "react";
 import { cva as v } from "class-variance-authority";
 import { cn as n } from "../lib/cn.js";
-import { Spinner as m } from "./spinner.js";
+import { Spinner as f } from "./spinner.js";
 const p = v(
   [
     "relative inline-flex items-center justify-center gap-2 whitespace-nowrap",
     "font-normal select-none",
     "rounded-md border border-transparent",
-    "transition-[background,border,color,box-shadow,transform] duration-(--duration-fast) ease-out",
+    "transition-[background,border,color,box-shadow,transform] duration-150 ease-out motion-reduce:transition-none",
     "outline-none focus-visible:ring-3 focus-visible:ring-ring",
     // Press feedback: the button visibly answers the press (guide: any
-    // pressable element scales down on :active).
-    "active:scale-(--scale-press)",
+    // pressable element scales down on :active). Movement is dropped under
+    // reduced-motion; color/opacity feedback stays.
+    "active:scale-[0.97] motion-reduce:active:scale-100",
     "disabled:pointer-events-none",
     "[&_svg]:pointer-events-none [&_svg]:shrink-0"
   ],
@@ -21,26 +22,26 @@ const p = v(
     variants: {
       variant: {
         solid: "bg-brand text-brand-foreground shadow-[var(--inner-glow-cta)] hover:bg-brand-hover",
-        secondary: "bg-fill text-fill-foreground shadow-[var(--inner-glow-fill)] hover:bg-fill/70",
+        secondary: "bg-fill text-fill-foreground shadow-[var(--inner-glow-fill)] hover:bg-muted",
         outline: "border-border bg-transparent text-foreground hover:border-border-strong hover:bg-muted",
         ghost: "bg-transparent text-foreground hover:bg-muted",
-        soft: "bg-muted text-foreground shadow-[var(--inner-glow-fill)] hover:bg-fill",
+        soft: "bg-muted text-foreground shadow-[var(--inner-glow-fill)] hover:bg-accent",
         link: "bg-transparent text-foreground underline-offset-4 hover:underline active:scale-none",
         danger: "bg-danger text-danger-foreground hover:bg-danger/90 focus-visible:ring-danger/40"
       },
       size: {
-        xs: "h-7 px-2.5 text-xs [&_svg]:size-3.5",
-        sm: "h-8 px-3 text-xs [&_svg]:size-4",
-        md: "h-10 px-4 text-xs [&_svg]:size-4",
-        lg: "h-11 px-5 text-base [&_svg]:size-5",
-        icon: "size-10 rounded-full [&_svg]:size-4",
-        "icon-sm": "size-8 rounded-full [&_svg]:size-4",
-        "icon-xs": "size-7 rounded-full [&_svg]:size-4"
+        xs: "h-7 rounded-sm px-2.5 text-xs [&_svg]:size-3.5",
+        sm: "h-8 rounded-sm px-3 text-xs [&_svg]:size-4",
+        md: "h-10 rounded-md px-4 text-xs [&_svg]:size-4",
+        lg: "h-11 rounded-md px-5 text-base [&_svg]:size-5",
+        icon: "size-10 rounded-md [&_svg]:size-4",
+        "icon-sm": "size-8 rounded-sm [&_svg]:size-4",
+        "icon-xs": "size-7 rounded-sm [&_svg]:size-4"
       }
     },
     defaultVariants: { variant: "solid", size: "md" }
   }
-), x = c.forwardRef(
+), x = b.forwardRef(
   ({
     className: o,
     variant: t,
@@ -52,10 +53,10 @@ const p = v(
     disabled: l,
     children: g,
     ...u
-  }, f) => /* @__PURE__ */ r(
+  }, c) => /* @__PURE__ */ r(
     "button",
     {
-      ref: f,
+      ref: c,
       disabled: l || e,
       "aria-busy": e || void 0,
       className: n(
@@ -67,9 +68,10 @@ const p = v(
       ),
       ...u,
       children: [
-        e && /* @__PURE__ */ b(
-          m,
+        e && /* @__PURE__ */ m(
+          f,
           {
+            variant: "action",
             size: "sm",
             className: "absolute",
             "aria-hidden": !0

package/components/card.js

@@ -2,11 +2,11 @@
 import { jsx as t } from "react/jsx-runtime";
 import * as d from "react";
 import { cn as o } from "../lib/cn.js";
-const c = d.forwardRef(
+const l = d.forwardRef(
   ({ className: r, isHoverable: e, isPressable: a, children: s, ...n }, i) => {
-    const l = o(
+    const c = o(
       "bg-card text-card-foreground rounded-xl",
-      (a || e) && "shadow-elevation transition-[box-shadow,transform] duration-(--duration-fast) ease-out motion-reduce:transition-none",
+      (a || e) && "shadow-elevation transition-[box-shadow,transform] duration-150 ease-out motion-reduce:transition-none",
       e && "hover:-translate-y-0.5",
       r
     );
@@ -16,7 +16,7 @@ const c = d.forwardRef(
         ref: i,
         type: "button",
         className: o(
-          l,
+          c,
           "w-full text-left cursor-pointer",
           "outline-none focus-visible:ring-3 focus-visible:ring-ring",
           "active:translate-y-px"
@@ -24,10 +24,10 @@ const c = d.forwardRef(
         ...n,
         children: s
       }
-    ) : /* @__PURE__ */ t("div", { ref: i, className: l, ...n, children: s });
+    ) : /* @__PURE__ */ t("div", { ref: i, className: c, ...n, children: s });
   }
 );
-c.displayName = "Card";
+l.displayName = "Card";
 const f = d.forwardRef(({ className: r, ...e }, a) => /* @__PURE__ */ t(
   "div",
   {
@@ -41,7 +41,7 @@ const m = d.forwardRef(({ className: r, ...e }, a) => /* @__PURE__ */ t(
   "h3",
   {
     ref: a,
-    className: o("text-base font-semibold leading-none", r),
+    className: o("text-base font-medium leading-none", r),
     ...e
   }
 ));
@@ -73,7 +73,7 @@ const x = d.forwardRef(
 );
 x.displayName = "CardFooter";
 export {
-  c as Card,
+  l as Card,
   u as CardBody,
   p as CardDescription,
   x as CardFooter,