@actioneer/ads 0.6.0 → 0.7.0

package/components/tabs.d.ts

@@ -6,8 +6,10 @@ export interface TabsProps extends React.HTMLAttributes<HTMLDivElement> {
     value?: string;
     defaultValue?: string;
     onValueChange?: (value: string) => void;
+    /** @deprecated Tabs now use one primary underline style. */
     variant?: Variant;
     orientation?: Orientation;
+    /** @deprecated Tabs use one fixed 32px control height. */
     size?: Size;
 }
 export declare const Tabs: React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>>;

package/components/tabs.js

@@ -1,404 +1,269 @@
 "use client";
-import { jsx as f, jsxs as L } from "react/jsx-runtime";
+import { jsx as m, jsxs as E } from "react/jsx-runtime";
 import * as r from "react";
-import { MotionConfig as B, motion as P } from "motion/react";
-import { cva as $ } from "class-variance-authority";
-import { cn as b } from "../lib/cn.js";
-import { springControl as S } from "../lib/motion.js";
-const I = (s, e, a) => `${s}-${e}-${encodeURIComponent(a).replaceAll("%", "_")}`, M = r.createContext(null);
-function j(s) {
-  const e = r.useContext(M);
+import { MotionConfig as $, motion as M } from "motion/react";
+import { cva as L } from "class-variance-authority";
+import { cn as p } from "../lib/cn.js";
+import { springControl as U } from "../lib/motion.js";
+const N = (o, e, t) => `${o}-${e}-${encodeURIComponent(t).replaceAll("%", "_")}`, P = r.createContext(null);
+function z(o) {
+  const e = r.useContext(P);
   if (!e)
-    throw new Error(`<${s}> must be used within <Tabs>`);
+    throw new Error(`<${o}> must be used within <Tabs>`);
   return e;
 }
-const H = r.forwardRef(
+const _ = r.forwardRef(
   ({
-    className: s,
+    className: o,
     value: e,
-    defaultValue: a,
-    onValueChange: i,
-    variant: o = "primary",
-    orientation: l = "horizontal",
-    size: u = "md",
+    defaultValue: t,
+    onValueChange: a,
+    variant: g,
+    orientation: d = "horizontal",
+    size: b,
     children: R,
     ...A
-  }, k) => {
-    const h = e !== void 0, [N, z] = r.useState(a), w = r.useId().replaceAll(":", ""), d = r.useId(), y = r.useRef([]), v = r.useRef(/* @__PURE__ */ new Set()), x = h ? e : N, T = r.useCallback(
-      (t) => {
-        h || z(t), i == null || i(t);
+  }, S) => {
+    const x = e !== void 0, [y, v] = r.useState(t), T = r.useId().replaceAll(":", ""), c = r.useId(), w = r.useRef([]), h = r.useRef(/* @__PURE__ */ new Set()), f = x ? e : y, I = r.useCallback(
+      (l) => {
+        x || v(l), a == null || a(l);
       },
-      [h, i]
-    ), c = r.useCallback((t) => {
-      y.current.includes(t) || y.current.push(t);
-    }, []), V = r.useMemo(
+      [x, a]
+    ), i = r.useCallback((l) => {
+      w.current.includes(l) || w.current.push(l);
+    }, []), s = r.useMemo(
       () => ({
-        value: x,
-        setValue: T,
-        baseId: w,
-        registerTab: c,
-        tabs: y,
-        disabled: v,
-        thumbId: d,
-        variant: o,
-        orientation: l,
-        size: u
+        value: f,
+        setValue: I,
+        baseId: T,
+        registerTab: i,
+        tabs: w,
+        disabled: h,
+        thumbId: c,
+        orientation: d
       }),
       [
-        x,
+        f,
+        I,
         T,
-        w,
+        i,
         c,
-        d,
-        o,
-        l,
-        u
+        d
       ]
     );
-    return /* @__PURE__ */ f(M.Provider, { value: V, children: /* @__PURE__ */ f(
+    return /* @__PURE__ */ m(P.Provider, { value: s, children: /* @__PURE__ */ m(
       "div",
       {
-        ref: k,
-        "data-orientation": l,
-        "data-variant": o,
-        className: b(
-          "flex gap-4",
-          l === "horizontal" ? "flex-col" : "flex-row",
-          s
+        ref: S,
+        "data-orientation": d,
+        "data-variant": "primary",
+        className: p(
+          "flex w-full gap-4",
+          d === "horizontal" ? "flex-col" : "flex-row",
+          o
         ),
         ...A,
-        children: /* @__PURE__ */ f(B, { reducedMotion: "user", children: R })
+        children: /* @__PURE__ */ m($, { reducedMotion: "user", children: R })
       }
     ) });
   }
 );
-H.displayName = "Tabs";
-const O = $("inline-flex", {
+_.displayName = "Tabs";
+const C = L("inline-flex gap-0 text-m", {
   variants: {
-    variant: {
-      primary: "bg-surface p-1 gap-1",
-      secondary: "gap-0",
-      // Legacy `pill` API: separate compact filter tabs with a gap and no
-      // track (each tab can carry a `· N` count via Tab's `count`).
-      pill: "gap-1.5 flex-wrap"
-    },
     orientation: {
-      horizontal: "self-start flex-row items-center",
-      vertical: "flex-col items-stretch"
-    },
-    size: {
-      sm: "text-xs",
-      md: "text-xs",
-      lg: "text-base"
+      horizontal: "w-full self-start flex-row items-center gap-6 overflow-x-auto border-b border-border",
+      vertical: "flex-col items-stretch border-r border-border"
     }
   },
-  compoundVariants: [
-    // Track radius follows control size: compact = 4px, standard = 6px.
-    { variant: "primary", size: "sm", className: "rounded-sm" },
-    { variant: "primary", size: "md", className: "rounded-md" },
-    { variant: "primary", size: "lg", className: "rounded-md" },
-    // Secondary variant uses a subtle rail (border) on the opposite edge of
-    // the active indicator. Kept intentionally hairline — surfaces avoid
-    // strokes, but a tab rail is a control edge, not a surface.
-    {
-      variant: "secondary",
-      orientation: "horizontal",
-      className: "border-b border-border"
-    },
-    {
-      variant: "secondary",
-      orientation: "vertical",
-      className: "border-r border-border"
-    }
-  ],
   defaultVariants: {
-    variant: "primary",
-    orientation: "horizontal",
-    size: "md"
+    orientation: "horizontal"
   }
-}), _ = r.forwardRef(
-  ({ className: s, ...e }, a) => {
-    const { variant: i, orientation: o, size: l } = j("TabList");
-    return /* @__PURE__ */ f(
+}), B = r.forwardRef(
+  ({ className: o, ...e }, t) => {
+    const { orientation: a } = z("TabList");
+    return /* @__PURE__ */ m(
       "div",
       {
-        ref: a,
+        ref: t,
         role: "tablist",
-        "aria-orientation": o,
-        "data-orientation": o,
-        "data-variant": i,
-        className: b(O({ variant: i, orientation: o, size: l }), s),
+        "aria-orientation": a,
+        "data-orientation": a,
+        "data-variant": "primary",
+        className: p(C({ orientation: a }), o),
         ...e
       }
     );
   }
 );
-_.displayName = "TabList";
-const q = $(
-  b(
-    "relative inline-flex items-center whitespace-nowrap font-normal select-none",
+B.displayName = "TabList";
+const H = L(
+  p(
+    "relative inline-flex items-center whitespace-nowrap font-medium select-none",
     "transition-colors duration-150 cursor-pointer",
     "outline-none focus-visible:ring-3 focus-visible:ring-ring",
     "disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed"
   ),
   {
     variants: {
-      variant: {
-        primary: "justify-center rounded-md",
-        secondary: "",
-        pill: "justify-center"
-      },
       orientation: {
-        horizontal: "",
-        vertical: ""
-      },
-      size: {
-        sm: "",
-        md: "",
-        lg: ""
+        horizontal: "h-8 flex-none justify-center -mb-px",
+        vertical: "h-8 justify-start px-3 pr-4 -mr-px"
       },
       selected: {
-        true: "text-foreground",
+        true: "text-action-primary-text",
         false: "text-muted-foreground hover:text-foreground"
       }
     },
-    compoundVariants: [
-      // Sizing — differs per variant (primary is filled, secondary is
-      // flush-underline).
-      { variant: "primary", size: "sm", className: "h-6 rounded-sm px-2.5" },
-      { variant: "primary", size: "md", className: "h-8 rounded-md px-3" },
-      { variant: "primary", size: "lg", className: "h-9 rounded-md px-4" },
-      // Legacy `pill` API — visually these are separate compact filter tabs,
-      // with the same size-based 4px / 8px radii as every other control.
-      { variant: "pill", size: "sm", className: "h-6 rounded-sm px-2.5 gap-1" },
-      { variant: "pill", size: "md", className: "h-7 rounded-md px-3 gap-1" },
-      { variant: "pill", size: "lg", className: "h-8 rounded-md px-3.5 gap-1.5" },
-      { variant: "pill", selected: !0, className: "bg-foreground text-background" },
-      {
-        variant: "pill",
-        selected: !1,
-        className: "bg-muted text-muted-foreground hover:bg-accent hover:text-foreground"
-      },
-      // Secondary horizontal: -1px sits over the rail so the sliding
-      // indicator overlaps it cleanly.
-      {
-        variant: "secondary",
-        orientation: "horizontal",
-        size: "sm",
-        className: "px-2.5 pb-1.5 -mb-px justify-center"
-      },
-      {
-        variant: "secondary",
-        orientation: "horizontal",
-        size: "md",
-        className: "px-3 pb-2 -mb-px justify-center"
-      },
-      {
-        variant: "secondary",
-        orientation: "horizontal",
-        size: "lg",
-        className: "px-4 pb-2.5 -mb-px justify-center"
-      },
-      // Secondary vertical: left-aligned, sits over the right-side rail.
-      {
-        variant: "secondary",
-        orientation: "vertical",
-        size: "sm",
-        className: "px-2.5 py-1 pr-3 -mr-px justify-start"
-      },
-      {
-        variant: "secondary",
-        orientation: "vertical",
-        size: "md",
-        className: "px-3 py-1.5 pr-4 -mr-px justify-start"
-      },
-      {
-        variant: "secondary",
-        orientation: "vertical",
-        size: "lg",
-        className: "px-4 py-2 pr-5 -mr-px justify-start"
-      }
-    ],
     defaultVariants: {
-      variant: "primary",
       orientation: "horizontal",
-      size: "md",
       selected: !1
     }
   }
-), F = r.forwardRef(
-  ({ className: s, value: e, isDisabled: a, count: i, children: o, onClick: l, onKeyDown: u, ...R }, A) => {
+), O = r.forwardRef(
+  ({ className: o, value: e, isDisabled: t, count: a, children: g, onClick: d, onKeyDown: b, ...R }, A) => {
     const {
-      value: k,
-      setValue: h,
-      baseId: N,
-      registerTab: z,
-      tabs: w,
-      disabled: d,
-      thumbId: y,
-      variant: v,
-      orientation: x,
-      size: T
-    } = j("Tab"), c = k === e;
+      value: S,
+      setValue: x,
+      baseId: y,
+      registerTab: v,
+      tabs: T,
+      disabled: c,
+      thumbId: w,
+      orientation: h
+    } = z("Tab"), f = S === e;
     r.useEffect(() => {
-      z(e);
-    }, [z, e]), r.useEffect(() => {
-      a ? d.current.add(e) : d.current.delete(e);
-    }, [d, a, e]);
-    const V = (t) => {
-      if (u == null || u(t), t.defaultPrevented) return;
-      const m = w.current, g = m.indexOf(e);
-      if (g === -1) return;
-      const U = x === "vertical" ? ["ArrowDown"] : ["ArrowRight", "ArrowDown"], C = x === "vertical" ? ["ArrowUp"] : ["ArrowLeft", "ArrowUp"];
+      v(e);
+    }, [v, e]), r.useEffect(() => {
+      t ? c.current.add(e) : c.current.delete(e);
+    }, [c, t, e]);
+    const I = (i) => {
+      if (b == null || b(i), i.defaultPrevented) return;
+      const s = T.current, l = s.indexOf(e);
+      if (l === -1) return;
+      const V = h === "vertical" ? ["ArrowDown"] : ["ArrowRight", "ArrowDown"], j = h === "vertical" ? ["ArrowUp"] : ["ArrowLeft", "ArrowUp"];
       let n = null;
-      if (U.includes(t.key)) {
-        n = g;
+      if (V.includes(i.key)) {
+        n = l;
         do
-          n = (n + 1) % m.length;
-        while (d.current.has(m[n]) && n !== g);
-      } else if (C.includes(t.key)) {
-        n = g;
+          n = (n + 1) % s.length;
+        while (c.current.has(s[n]) && n !== l);
+      } else if (j.includes(i.key)) {
+        n = l;
         do
-          n = (n - 1 + m.length) % m.length;
-        while (d.current.has(m[n]) && n !== g);
-      } else if (t.key === "Home")
-        n = m.findIndex((p) => !d.current.has(p));
-      else if (t.key === "End") {
-        for (let p = m.length - 1; p >= 0; p--)
-          if (!d.current.has(m[p])) {
-            n = p;
+          n = (n - 1 + s.length) % s.length;
+        while (c.current.has(s[n]) && n !== l);
+      } else if (i.key === "Home")
+        n = s.findIndex((u) => !c.current.has(u));
+      else if (i.key === "End") {
+        for (let u = s.length - 1; u >= 0; u--)
+          if (!c.current.has(s[u])) {
+            n = u;
             break;
           }
       }
       if (n !== null && n !== -1) {
-        t.preventDefault();
-        const p = m[n];
-        h(p);
-        const E = document.getElementById(I(N, "tab", p));
-        E == null || E.focus();
+        i.preventDefault();
+        const u = s[n];
+        x(u);
+        const k = document.getElementById(N(y, "tab", u));
+        k == null || k.focus();
       }
     };
-    return /* @__PURE__ */ L(
+    return /* @__PURE__ */ E(
       "button",
       {
         ref: A,
         type: "button",
         role: "tab",
-        id: I(N, "tab", e),
-        "aria-selected": c,
-        "aria-disabled": a || void 0,
-        disabled: a,
-        "data-selected": c || void 0,
-        "data-disabled": a || void 0,
-        tabIndex: c && !a ? 0 : -1,
-        className: b(
-          q({ variant: v, orientation: x, size: T, selected: c }),
-          s
+        id: N(y, "tab", e),
+        "aria-selected": f,
+        "aria-disabled": t || void 0,
+        disabled: t,
+        "data-selected": f || void 0,
+        "data-disabled": t || void 0,
+        tabIndex: f && !t ? 0 : -1,
+        className: p(
+          H({ orientation: h, selected: f }),
+          o
         ),
-        onClick: (t) => {
-          l == null || l(t), a || h(e);
+        onClick: (i) => {
+          d == null || d(i), t || x(e);
         },
-        onKeyDown: V,
+        onKeyDown: I,
         ...R,
         children: [
-          c && v === "primary" && /* @__PURE__ */ f(
-            P.span,
+          f && /* @__PURE__ */ m(
+            M.span,
             {
-              layoutId: y,
+              layoutId: w,
               "aria-hidden": !0,
-              transition: S,
-              className: "absolute inset-0 rounded-[inherit] bg-elevated shadow-elevation"
-            }
-          ),
-          c && v === "secondary" && /* @__PURE__ */ f(
-            P.span,
-            {
-              layoutId: y,
-              "aria-hidden": !0,
-              transition: S,
-              className: b(
-                "absolute bg-brand",
-                x === "horizontal" ? "left-0 right-0 bottom-0 h-0.5" : "top-0 bottom-0 right-0 w-0.5"
+              transition: U,
+              className: p(
+                "absolute bg-action-primary",
+                h === "horizontal" ? "left-0 right-0 bottom-0 h-0.5" : "top-0 bottom-0 right-0 w-0.5"
               )
             }
           ),
-          /* @__PURE__ */ L("span", { className: "relative inline-flex items-center gap-1", children: [
-            o,
-            i != null && /* @__PURE__ */ L(
-              "span",
-              {
-                className: b(
-                  "tabular-nums",
-                  c && v === "pill" ? "text-background/70" : "text-secondary"
-                ),
-                children: [
-                  "· ",
-                  i
-                ]
-              }
-            )
+          /* @__PURE__ */ E("span", { className: "relative inline-flex items-center gap-1", children: [
+            g,
+            a != null && /* @__PURE__ */ E("span", { className: "tabular-nums text-muted-foreground", children: [
+              "· ",
+              a
+            ] })
           ] })
         ]
       }
     );
   }
 );
-F.displayName = "Tab";
-const G = r.forwardRef(
-  ({ className: s, ...e }, a) => {
-    const { orientation: i, variant: o } = j("TabSeparator");
-    return o === "primary" ? /* @__PURE__ */ f(
-      "span",
-      {
-        ref: a,
-        "aria-hidden": !0,
-        role: "separator",
-        className: b("shrink-0", s),
-        ...e
-      }
-    ) : /* @__PURE__ */ f(
+O.displayName = "Tab";
+const q = r.forwardRef(
+  ({ className: o, ...e }, t) => {
+    const { orientation: a } = z("TabSeparator");
+    return /* @__PURE__ */ m(
       "span",
       {
-        ref: a,
+        ref: t,
         "aria-hidden": !0,
         role: "separator",
-        className: b(
+        className: p(
           "shrink-0 bg-border",
-          i === "horizontal" ? "mx-1 h-4 w-px" : "my-1 h-px w-full",
-          s
+          a === "horizontal" ? "mx-1 h-4 w-px" : "my-1 h-px w-full",
+          o
         ),
         ...e
       }
     );
   }
 );
-G.displayName = "TabSeparator";
-const J = r.forwardRef(
-  ({ className: s, value: e, children: a, ...i }, o) => {
-    const { value: l, baseId: u } = j("TabPanel");
-    return l !== e ? null : /* @__PURE__ */ f(
+q.displayName = "TabSeparator";
+const F = r.forwardRef(
+  ({ className: o, value: e, children: t, ...a }, g) => {
+    const { value: d, baseId: b } = z("TabPanel");
+    return d !== e ? null : /* @__PURE__ */ m(
       "div",
       {
-        ref: o,
+        ref: g,
         role: "tabpanel",
-        id: I(u, "panel", e),
-        "aria-labelledby": I(u, "tab", e),
+        id: N(b, "panel", e),
+        "aria-labelledby": N(b, "tab", e),
         tabIndex: 0,
-        className: b(
+        className: p(
           "flex-1 outline-none focus-visible:ring-3 focus-visible:ring-ring rounded-sm",
-          s
+          o
         ),
-        ...i,
-        children: a
+        ...a,
+        children: t
       }
     );
   }
 );
-J.displayName = "TabPanel";
+F.displayName = "TabPanel";
 export {
-  F as Tab,
-  _ as TabList,
-  J as TabPanel,
-  G as TabSeparator,
-  H as Tabs
+  O as Tab,
+  B as TabList,
+  F as TabPanel,
+  q as TabSeparator,
+  _ as Tabs
 };

package/components/textarea.js

@@ -1,21 +1,21 @@
 "use client";
 import { jsx as i } from "react/jsx-runtime";
 import * as o from "react";
-import { cn as s } from "../lib/cn.js";
-import { inputBaseClass as m } from "./field.js";
+import { cn as m } from "../lib/cn.js";
+import { inputBaseClass as s } from "./field.js";
 const n = o.forwardRef(
-  ({ className: e, isInvalid: r, ...a }, t) => /* @__PURE__ */ i(
+  ({ className: r, isInvalid: a, ...e }, t) => /* @__PURE__ */ i(
     "textarea",
     {
       ref: t,
-      "aria-invalid": r || void 0,
-      className: s(
-        m,
+      "aria-invalid": a || void 0,
+      className: m(
+        s,
         // Multi-line controls use the 4px surface radius.
-        "min-h-20 resize-y rounded-lg py-2 text-xs",
-        e
+        "min-h-20 resize-y rounded-lg py-2",
+        r
       ),
-      ...a
+      ...e
     }
   )
 );

package/components/toast.d.ts

@@ -35,7 +35,7 @@ export interface ToastOptions {
     indicator?: React.ReactNode;
     /** Trailing action button. */
     actionProps?: ToastActionProps;
-    /** Auto-dismiss after N ms. 0 = persistent. Default 5000 (0 when loading). */
+    /** Auto-dismiss after N ms. Timed toasts show a countdown that pauses on hover. 0 = persistent. Default 5000 (0 when loading). */
     timeout?: number;
     /** Legacy alias for `timeout`. */
     duration?: number;