@actioneer/ads 0.5.7 → 0.5.9

package/components/breadcrumbs.js

@@ -1,11 +1,11 @@
 "use client";
-import { jsxs as v, jsx as e, Fragment as k } from "react/jsx-runtime";
+import { jsxs as h, jsx as e, Fragment as B } from "react/jsx-runtime";
 import * as t from "react";
-import { ArrowLeft as B } from "../lib/icons.js";
-import { cn as a } from "../lib/cn.js";
-const N = t.createContext({
+import { ArrowLeft as y } from "../lib/icons.js";
+import { cn as c } from "../lib/cn.js";
+const w = t.createContext({
   count: 0
-}), w = t.createContext(0);
+}), C = t.createContext(0);
 function R(s) {
   let n = (s == null ? void 0 : s.parentElement) ?? null;
   for (; n; ) {
@@ -15,102 +15,104 @@ function R(s) {
   }
   return null;
 }
-const y = t.forwardRef(
+const z = t.forwardRef(
   ({
     className: s,
     children: n,
     sticky: r,
-    onBack: c,
-    backLabel: g = "Back",
+    onBack: u,
+    backLabel: x = "Back",
     actions: m,
-    meta: f,
-    ...p
-  }, i) => {
-    const b = t.Children.toArray(n), l = t.useRef(null), u = t.useCallback(
+    center: f,
+    meta: b,
+    ...v
+  }, l) => {
+    const a = t.Children.toArray(n), i = t.useRef(null), p = t.useCallback(
       (o) => {
-        l.current = o, typeof i == "function" ? i(o) : i && (i.current = o);
+        i.current = o, typeof l == "function" ? l(o) : l && (l.current = o);
       },
-      [i]
-    ), [x, C] = t.useState(!1);
+      [l]
+    ), [N, k] = t.useState(!1);
     return t.useEffect(() => {
       if (!r) return;
-      const o = R(l.current), d = o ?? window, h = () => C((o ? o.scrollTop : window.scrollY) > 2);
-      return h(), d.addEventListener("scroll", h, { passive: !0 }), () => d.removeEventListener("scroll", h);
-    }, [r]), /* @__PURE__ */ v(
+      const o = R(i.current), d = o ?? window, g = () => k((o ? o.scrollTop : window.scrollY) > 2);
+      return g(), d.addEventListener("scroll", g, { passive: !0 }), () => d.removeEventListener("scroll", g);
+    }, [r]), /* @__PURE__ */ h(
       "nav",
       {
-        ref: u,
+        ref: p,
         "aria-label": "Breadcrumb",
-        "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",
+        "data-stuck": r ? N ? "true" : "false" : void 0,
+        className: c(
+          "relative flex w-full items-center",
+          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
           // background over that gap (a no-op at rest, where the strip is the
           // panel's empty padding).
           r && "before:absolute before:inset-x-0 before:-top-8 before:h-8 before:bg-inherit before:content-['']",
-          r && (x ? "border-b border-border" : "border-b border-transparent"),
+          r && (N ? "border-b border-border" : "border-b border-transparent"),
           s
         ),
-        ...p,
+        ...v,
         children: [
-          c && /* @__PURE__ */ e(
+          u && /* @__PURE__ */ e(
             "button",
             {
               type: "button",
-              onClick: c,
-              "aria-label": g,
-              className: a(
-                "mr-1 inline-flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground",
+              onClick: u,
+              "aria-label": x,
+              className: c(
+                "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"
               ),
-              children: /* @__PURE__ */ e(B, { "aria-hidden": !0 })
+              children: /* @__PURE__ */ e(y, { "aria-hidden": !0 })
             }
           ),
-          /* @__PURE__ */ e("ol", { className: "flex min-w-0 items-center gap-1.5 text-base", children: /* @__PURE__ */ e(N.Provider, { value: { count: b.length }, children: b.map((o, d) => /* @__PURE__ */ e(w.Provider, { value: d, children: o }, d)) }) }),
-          f && /* @__PURE__ */ e("div", { className: "ml-4 flex min-w-0 shrink items-center gap-3 text-xs text-muted-foreground", children: f }),
+          /* @__PURE__ */ e("ol", { className: "flex min-w-0 items-center gap-1.5 text-base", children: /* @__PURE__ */ e(w.Provider, { value: { count: a.length }, children: a.map((o, d) => /* @__PURE__ */ e(C.Provider, { value: d, children: o }, d)) }) }),
+          b && /* @__PURE__ */ e("div", { className: "ml-4 flex min-w-0 shrink items-center gap-3 text-xs text-muted-foreground", children: b }),
+          f && /* @__PURE__ */ e("div", { className: "absolute left-1/2 top-1/2 z-50 flex -translate-x-1/2 -translate-y-1/2 items-center", children: f }),
           m && /* @__PURE__ */ e("div", { className: "ml-auto flex shrink-0 items-center gap-2 pl-4", children: m })
         ]
       }
     );
   }
 );
-y.displayName = "Breadcrumbs";
-const E = t.forwardRef(({ className: s, href: n, isCurrent: r, icon: c, children: g, ...m }, f) => {
-  const { count: p } = t.useContext(N), b = t.useContext(w) === p - 1, l = "inline-flex items-center gap-1.5", u = /* @__PURE__ */ v(k, { children: [
-    c && /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "flex shrink-0 items-center [&_svg]:size-4", children: c }),
-    g
-  ] }), x = r ? /* @__PURE__ */ e(
+z.displayName = "Breadcrumbs";
+const E = t.forwardRef(({ className: s, href: n, isCurrent: r, icon: u, children: x, ...m }, f) => {
+  const { count: b } = t.useContext(w), l = t.useContext(C) === b - 1, a = "inline-flex items-center gap-1.5", i = /* @__PURE__ */ h(B, { children: [
+    u && /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "flex shrink-0 items-center [&_svg]:size-4", children: u }),
+    x
+  ] }), p = r ? /* @__PURE__ */ e(
     "span",
     {
       "aria-current": "page",
-      className: a(l, "font-normal text-primary"),
-      children: u
+      className: c(a, "font-normal text-primary"),
+      children: i
     }
   ) : n ? /* @__PURE__ */ e(
     "a",
     {
       href: n,
-      className: a(
-        l,
+      className: c(
+        a,
         "font-normal text-muted-foreground transition-colors hover:text-foreground",
         "outline-none focus-visible:ring-3 focus-visible:ring-ring rounded-sm"
       ),
-      children: u
+      children: i
     }
-  ) : /* @__PURE__ */ e("span", { className: a(l, "text-muted-foreground"), children: u });
-  return /* @__PURE__ */ v(
+  ) : /* @__PURE__ */ e("span", { className: c(a, "text-muted-foreground"), children: i });
+  return /* @__PURE__ */ h(
     "li",
     {
       ref: f,
-      className: a("flex items-center gap-1.5", s),
+      className: c("flex items-center gap-1.5", s),
       ...m,
       children: [
-        x,
-        !b && /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "shrink-0 select-none text-border-strong", children: "/" })
+        p,
+        !l && /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "shrink-0 select-none text-border-strong", children: "/" })
       ]
     }
   );
@@ -118,5 +120,5 @@ const E = t.forwardRef(({ className: s, href: n, isCurrent: r, icon: c, children
 E.displayName = "BreadcrumbItem";
 export {
   E as BreadcrumbItem,
-  y as Breadcrumbs
+  z as Breadcrumbs
 };

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,