@actioneer/ads 0.5.7 → 0.5.9

package/components/skeleton.js

@@ -1,19 +1,19 @@
 "use client";
 import { jsx as o } from "react/jsx-runtime";
-import * as n from "react";
-import { cn as f } from "../lib/cn.js";
-const i = n.forwardRef(
+import * as f from "react";
+import { cn as n } from "../lib/cn.js";
+const i = f.forwardRef(
   ({ className: e, circle: r = !1, ...t }, a) => /* @__PURE__ */ o(
     "div",
     {
       ref: a,
       "aria-hidden": !0,
-      className: f(
+      className: n(
         "relative overflow-hidden bg-muted",
         r ? "rounded-full" : "rounded-md",
         "after:absolute after:inset-0 after:-translate-x-full",
         "after:bg-gradient-to-r after:from-transparent after:via-foreground/10 after:to-transparent",
-        "after:animate-[ads-shimmer_var(--duration-pulse)_infinite]",
+        "after:animate-[ads-shimmer_1.5s_infinite]",
         e
       ),
       ...t

package/components/spinner.d.ts

@@ -1,11 +1,20 @@
 import { VariantProps } from 'class-variance-authority';
+import { SPINNER_VARIANTS, SpinnerVariant } from '../lib/spinner-mark';
 import * as React from "react";
-declare const spinnerVariants: (props?: ({
-    size?: "sm" | "md" | "lg" | null | undefined;
+export { SPINNER_VARIANTS, type SpinnerVariant };
+declare const spinnerStyles: (props?: ({
+    size?: "xs" | "sm" | "md" | "lg" | null | undefined;
     color?: "current" | "primary" | "muted" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export interface SpinnerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color">, VariantProps<typeof spinnerVariants> {
+export interface SpinnerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color">, VariantProps<typeof spinnerStyles> {
+    /** The work scope determines the grid choreography. Defaults to action. */
+    variant?: SpinnerVariant;
+    /** Accessible status text. Defaults to “Loading”. */
     label?: string;
 }
+/**
+ * A bold 3×3 loading indicator that stays legible in a native 16 px slot.
+ * Every variant uses exactly nine squircles and inherits currentColor. Under
+ * reduced motion, the grid holds a representative frame instead of moving.
+ */
 export declare const Spinner: React.ForwardRefExoticComponent<SpinnerProps & React.RefAttributes<HTMLDivElement>>;
-export {};

package/components/spinner.js

@@ -1,11 +1,14 @@
 "use client";
-import { jsx as e, jsxs as c } from "react/jsx-runtime";
-import * as d from "react";
-import { cva as l } from "class-variance-authority";
-import { cn as m } from "../lib/cn.js";
-const r = "M12 2.5 C5 2.5 2.5 5 2.5 12 C2.5 19 5 21.5 12 21.5 C19 21.5 21.5 19 21.5 12 C21.5 5 19 2.5 12 2.5 Z", u = l("inline-block shrink-0", {
+import { jsx as t } from "react/jsx-runtime";
+import * as u from "react";
+import { cva as p } from "class-variance-authority";
+import { cn as f } from "../lib/cn.js";
+import { SpinnerMark as x } from "../lib/spinner-mark.js";
+import { SPINNER_VARIANTS as k } from "../lib/spinner-mark.js";
+const z = p("inline-block shrink-0", {
   variants: {
     size: {
+      xs: "size-3.5",
       sm: "size-4",
       md: "size-6",
       lg: "size-8"
@@ -17,46 +20,43 @@ const r = "M12 2.5 C5 2.5 2.5 5 2.5 12 C2.5 19 5 21.5 12 21.5 C19 21.5 21.5 19 2
     }
   },
   defaultVariants: { size: "md", color: "current" }
-}), p = d.forwardRef(
-  ({ className: i, size: n, color: a, label: t, ...s }, o) => /* @__PURE__ */ e(
-    "div",
-    {
-      ref: o,
-      role: "status",
-      "aria-label": t ?? "Loading",
-      className: m(u({ size: n, color: a }), i),
-      ...s,
-      children: /* @__PURE__ */ c("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": !0, className: "size-full", children: [
-        /* @__PURE__ */ e(
-          "path",
+}), N = u.forwardRef(
+  ({
+    className: a,
+    size: n,
+    color: o,
+    variant: e = "action",
+    label: s,
+    role: m,
+    "aria-label": d,
+    "aria-hidden": r,
+    ...l
+  }, c) => {
+    const i = r === !0 || r === "true";
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: c,
+        role: i ? void 0 : m ?? "status",
+        "aria-label": i ? void 0 : d ?? s ?? "Loading",
+        "aria-hidden": r,
+        "data-variant": e,
+        className: f(z({ size: n, color: o }), a),
+        ...l,
+        children: /* @__PURE__ */ t(
+          x,
           {
-            d: r,
-            stroke: "currentColor",
-            strokeWidth: "2.5",
-            className: "opacity-15"
-          }
-        ),
-        /* @__PURE__ */ e(
-          "g",
-          {
-            className: "origin-center animate-[ads-spin_var(--duration-spin)_linear_infinite] motion-reduce:animate-none",
-            children: /* @__PURE__ */ e(
-              "path",
-              {
-                d: r,
-                stroke: "currentColor",
-                strokeWidth: "2.5",
-                strokeLinecap: "round",
-                className: "animate-[ads-spin-head_var(--duration-spin)_var(--ease-in-out)_infinite] motion-reduce:animate-none"
-              }
-            )
+            variant: e,
+            "aria-hidden": !0,
+            className: "size-full"
           }
         )
-      ] })
-    }
-  )
+      }
+    );
+  }
 );
-p.displayName = "Spinner";
+N.displayName = "Spinner";
 export {
-  p as Spinner
+  k as SPINNER_VARIANTS,
+  N as Spinner
 };

package/components/stepper.js

@@ -2,12 +2,12 @@
 import { jsx as e, jsxs as c } from "react/jsx-runtime";
 import * as v from "react";
 import { cva as y } from "class-variance-authority";
-import { cn as s } from "../lib/cn.js";
+import { cn as a } from "../lib/cn.js";
 import { Check as p, Close as g } from "../lib/icons.js";
 const b = y(
-  s(
+  a(
     "flex shrink-0 items-center justify-center rounded-full font-normal tabular-nums",
-    "transition-colors duration-(--duration-fast) ease-out motion-reduce:transition-none"
+    "transition-colors duration-150 ease-out motion-reduce:transition-none"
   ),
   {
     variants: {
@@ -27,31 +27,31 @@ const b = y(
 ), j = v.forwardRef(
   ({
     className: x,
-    steps: u,
+    steps: m,
     activeIndex: n,
     size: i = "md",
     onSelect: o,
     labelPosition: h = "below",
-    ...m
+    ...u
   }, N) => /* @__PURE__ */ e(
     "ol",
     {
       ref: N,
       "data-slot": "stepper",
-      "aria-label": m["aria-label"] ?? "Progress",
-      className: s("flex w-full flex-row items-start", x),
-      ...m,
-      children: u.map((a, t) => {
-        const r = a.isError ? "error" : t < n ? "complete" : t === n ? "current" : "upcoming", l = t === u.length - 1, w = !!o && t < n, d = t < n && !a.isError, k = /* @__PURE__ */ e("span", { "aria-hidden": !0, className: b({ status: r, size: i }), children: r === "complete" ? /* @__PURE__ */ e(p, {}) : r === "error" ? /* @__PURE__ */ e(g, {}) : t + 1 }), f = w ? /* @__PURE__ */ e(
+      "aria-label": u["aria-label"] ?? "Progress",
+      className: a("flex w-full flex-row items-start", x),
+      ...u,
+      children: m.map((s, t) => {
+        const r = s.isError ? "error" : t < n ? "complete" : t === n ? "current" : "upcoming", l = t === m.length - 1, w = !!o && t < n, d = t < n && !s.isError, k = /* @__PURE__ */ e("span", { "aria-hidden": !0, className: b({ status: r, size: i }), children: r === "complete" ? /* @__PURE__ */ e(p, {}) : r === "error" ? /* @__PURE__ */ e(g, {}) : t + 1 }), f = w ? /* @__PURE__ */ e(
           "button",
           {
             type: "button",
             onClick: () => o == null ? void 0 : o(t),
             "aria-label": `Go to step ${t + 1}`,
-            className: s(
+            className: a(
               b({ status: r, size: i }),
               "cursor-pointer outline-none focus-visible:ring-3 focus-visible:ring-ring",
-              "active:scale-(--scale-press)"
+              "active:scale-[0.97]"
             ),
             children: r === "complete" ? /* @__PURE__ */ e(p, {}) : r === "error" ? /* @__PURE__ */ e(g, {}) : t + 1
           }
@@ -61,7 +61,7 @@ const b = y(
           {
             "data-status": r,
             "aria-current": r === "current" ? "step" : void 0,
-            className: s(
+            className: a(
               "flex min-w-0 items-center gap-2",
               l ? "shrink-0" : "flex-1"
             ),
@@ -70,20 +70,20 @@ const b = y(
               /* @__PURE__ */ e(
                 "span",
                 {
-                  className: s(
+                  className: a(
                     "truncate whitespace-nowrap",
                     i === "sm" ? "text-xs" : "text-base",
                     r === "upcoming" ? "text-tertiary" : "text-foreground",
                     r === "error" && "text-danger"
                   ),
-                  children: a.label
+                  children: s.label
                 }
               ),
               !l && /* @__PURE__ */ e(
                 "span",
                 {
                   "aria-hidden": !0,
-                  className: s(
+                  className: a(
                     "h-px min-w-4 flex-1 shrink-0 bg-border",
                     d && "bg-success"
                   )
@@ -91,7 +91,7 @@ const b = y(
               )
             ]
           },
-          a.id
+          s.id
         ) : /* @__PURE__ */ c(
           "li",
           {
@@ -105,7 +105,7 @@ const b = y(
                   "span",
                   {
                     "aria-hidden": !0,
-                    className: s(
+                    className: a(
                       "h-px flex-1 shrink-0 bg-border",
                       d && "bg-success"
                     )
@@ -115,18 +115,18 @@ const b = y(
               /* @__PURE__ */ e("div", { className: "min-w-0 pr-4", children: /* @__PURE__ */ e(
                 "div",
                 {
-                  className: s(
+                  className: a(
                     "truncate",
                     i === "sm" ? "text-xs" : "text-base",
                     r === "upcoming" ? "text-tertiary" : "text-foreground",
                     r === "error" && "text-danger"
                   ),
-                  children: a.label
+                  children: s.label
                 }
               ) })
             ]
           },
-          a.id
+          s.id
         );
       })
     }

package/components/switch.js

@@ -1,79 +1,81 @@
 "use client";
-import { jsxs as c, jsx as o } from "react/jsx-runtime";
-import * as d from "react";
-import { cn as s } from "../lib/cn.js";
-const m = {
+import { jsxs as p, jsx as i } from "react/jsx-runtime";
+import * as c from "react";
+import { MotionConfig as w, motion as x } from "motion/react";
+import { cn as n } from "../lib/cn.js";
+import { springSwitch as g } from "../lib/motion.js";
+const v = {
   sm: {
     track: "h-5 w-9",
     knob: "size-4",
-    on: "translate-x-4",
-    off: "translate-x-0"
+    offset: 16
   },
   md: {
     track: "h-6 w-11",
     knob: "size-5",
-    on: "translate-x-5",
-    off: "translate-x-0"
+    offset: 20
   }
-}, b = d.forwardRef(
+}, y = c.forwardRef(
   ({
-    className: i,
+    className: d,
     checked: t = !1,
-    onCheckedChange: n,
-    size: l = "md",
-    disabled: e,
-    children: a,
-    ...u
-  }, f) => {
-    const r = m[l];
-    return /* @__PURE__ */ c(
+    onCheckedChange: e,
+    size: f = "md",
+    disabled: s,
+    children: o,
+    ...r
+  }, m) => {
+    const l = v[f], a = c.useId(), u = r["aria-label"] != null || r["aria-labelledby"] != null, b = o && !u ? a : void 0;
+    return /* @__PURE__ */ p(
       "label",
       {
-        className: s(
+        className: n(
           "inline-flex items-center gap-2 text-xs text-foreground select-none",
-          e ? "cursor-not-allowed opacity-50" : "cursor-pointer"
+          s ? "cursor-not-allowed opacity-50" : "cursor-pointer"
         ),
         children: [
-          /* @__PURE__ */ o(
+          /* @__PURE__ */ i(
             "button",
             {
-              ref: f,
+              ref: m,
               type: "button",
               role: "switch",
               "aria-checked": t,
-              disabled: e,
-              onClick: () => n == null ? void 0 : n(!t),
-              className: s(
+              "aria-labelledby": b,
+              disabled: s,
+              onClick: () => e == null ? void 0 : e(!t),
+              className: n(
                 "relative inline-flex shrink-0 items-center rounded-full border border-transparent",
-                "transition-colors duration-(--duration-fast)",
+                "transition-colors duration-150",
                 "outline-none focus-visible:ring-3 focus-visible:ring-ring",
                 "disabled:cursor-not-allowed",
                 t ? "bg-brand" : "bg-input",
-                r.track,
-                i
+                l.track,
+                d
               ),
-              ...u,
-              children: /* @__PURE__ */ o(
-                "span",
+              ...r,
+              children: /* @__PURE__ */ i(w, { reducedMotion: "user", children: /* @__PURE__ */ i(
+                x.span,
                 {
                   "aria-hidden": !0,
-                  className: s(
+                  initial: !1,
+                  animate: { x: t ? l.offset : 0 },
+                  transition: g,
+                  className: n(
                     "ml-0.5 inline-block rounded-full bg-elevated shadow-elevation",
-                    "transition-transform duration-(--duration-fast) ease-out motion-reduce:transition-none",
-                    r.knob,
-                    t ? r.on : r.off
+                    l.knob
                   )
                 }
-              )
+              ) })
             }
           ),
-          a && /* @__PURE__ */ o("span", { children: a })
+          o && /* @__PURE__ */ i("span", { id: a, children: o })
         ]
       }
     );
   }
 );
-b.displayName = "Switch";
+y.displayName = "Switch";
 export {
-  b as Switch
+  y as Switch
 };

package/components/table.d.ts

@@ -45,6 +45,22 @@ export interface TableProps extends Omit<React.TableHTMLAttributes<HTMLTableElem
      * table with row selection, sorting, or a click-through action.
      */
     isStatic?: boolean;
+    /**
+     * Draggable column-width handles on the header ticks (defaults to true).
+     * Dragging the tick between two headers resizes the column to its left;
+     * the handle is keyboard-operable (arrows, Shift for coarse steps) and
+     * double-click restores the automatic layout. The last column has no
+     * handle — it absorbs the remaining width. Set false for tables whose
+     * layout must stay fixed (e.g. a compact summary card).
+     */
+    resizableColumns?: boolean;
+    /**
+     * Caps the table's height: the viewport scrolls vertically inside the
+     * shell and the header row pins to its top (painted on the shell gray so
+     * body rows pass underneath). For long results read in place — an
+     * expanded board table, a log — instead of pagination.
+     */
+    maxBodyHeight?: React.CSSProperties["maxHeight"];
 }
 /**
  * Styled wrapper around a semantic `<table>` with horizontal overflow.