@actioneer/ads 1.0.7 → 1.0.8

package/components/file-dropzone.js

@@ -1,22 +1,24 @@
 "use client";
-import { jsxs as a, jsx as r, Fragment as f } from "react/jsx-runtime";
-import * as i from "react";
-import { cva as C } from "class-variance-authority";
-import { cn as v } from "../lib/cn.js";
-import { Button as D } from "./button.js";
-import { FileText as R, Close as B, Upload as w } from "../lib/icons.js";
-const T = C(
-  v(
-    "flex w-full cursor-pointer flex-col items-center justify-center gap-2 rounded-xl px-6 py-8 text-center",
-    "border border-dashed border-border-strong bg-surface outline-none",
+import { jsxs as t, jsx as r, Fragment as m } from "react/jsx-runtime";
+import * as s from "react";
+import { cva as R } from "class-variance-authority";
+import { cn as p } from "../lib/cn.js";
+import { Button as v } from "./button.js";
+import { FileText as j, Upload as B } from "../lib/icons.js";
+const C = R(
+  p(
+    "flex w-full cursor-pointer rounded-lg border bg-card outline-none",
     "transition-[background-color,border-color,transform] duration-150 ease-out",
-    "hover:bg-muted focus-visible:ring-3 focus-visible:ring-ring",
-    "active:scale-[0.97] motion-reduce:transition-none"
+    "focus-visible:ring-3 focus-visible:ring-ring motion-reduce:transition-none"
   ),
   {
     variants: {
+      hasFiles: {
+        true: "flex-row items-center justify-between gap-4 border-solid border-border p-3 text-left",
+        false: "flex-col items-center justify-center gap-3 border-dashed border-border-strong px-6 py-7 text-center hover:bg-wg1 active:scale-[0.99] motion-reduce:active:scale-100"
+      },
       isDragging: {
-        true: "border-ring bg-accent",
+        true: "border-dashed border-field-focus bg-t1 hover:bg-t1",
         false: ""
       },
       isDisabled: {
@@ -24,33 +26,33 @@ const T = C(
         false: ""
       }
     },
-    defaultVariants: { isDragging: !1, isDisabled: !1 }
+    defaultVariants: { hasFiles: !1, isDragging: !1, isDisabled: !1 }
   }
-), j = (t) => t < 1024 ? `${t} B` : t < 1024 * 1024 ? `${Math.round(t / 1024)} KB` : `${(t / (1024 * 1024)).toFixed(1)} MB`, $ = i.forwardRef(
+), N = "inline-flex size-9 shrink-0 items-center justify-center rounded-md border border-border bg-card text-muted-foreground [&>svg]:size-4.5", F = (a) => a < 1024 ? `${a} B` : a < 1024 * 1024 ? `${Math.round(a / 1024)} KB` : `${(a / (1024 * 1024)).toFixed(1)} MB`, T = s.forwardRef(
   ({
-    className: t,
-    accept: b,
+    className: a,
+    accept: y,
     multiple: c = !1,
     disabled: n = !1,
     onFiles: l,
-    files: s,
+    files: i,
     onClear: g,
-    label: N,
-    hint: p,
-    ...y
-  }, z) => {
-    const m = i.useRef(null), [h, d] = i.useState(!1), o = i.useRef(0), x = (e) => {
+    label: w,
+    hint: h,
+    ...z
+  }, k) => {
+    const x = s.useRef(null), [d, f] = s.useState(!1), o = s.useRef(0), b = (e) => {
       e != null && e.length && (l == null || l(c ? Array.from(e) : [e[0]]));
     }, u = () => {
       var e;
-      return (e = m.current) == null ? void 0 : e.click();
-    }, k = !!(s != null && s.length);
-    return /* @__PURE__ */ a(
+      return (e = x.current) == null ? void 0 : e.click();
+    }, D = !!(i != null && i.length);
+    return /* @__PURE__ */ t(
       "div",
       {
-        ref: z,
+        ref: k,
         "data-slot": "file-dropzone",
-        "data-dragging": h || void 0,
+        "data-dragging": d || void 0,
         role: "button",
         tabIndex: n ? -1 : 0,
         "aria-disabled": n || void 0,
@@ -59,51 +61,52 @@ const T = C(
           (e.key === "Enter" || e.key === " ") && (e.preventDefault(), u());
         },
         onDragEnter: (e) => {
-          e.preventDefault(), o.current += 1, d(!0);
+          e.preventDefault(), o.current += 1, f(!0);
         },
         onDragOver: (e) => e.preventDefault(),
         onDragLeave: () => {
-          o.current -= 1, o.current <= 0 && (o.current = 0, d(!1));
+          o.current -= 1, o.current <= 0 && (o.current = 0, f(!1));
         },
         onDrop: (e) => {
-          e.preventDefault(), o.current = 0, d(!1), n || x(e.dataTransfer.files);
+          e.preventDefault(), o.current = 0, f(!1), n || b(e.dataTransfer.files);
         },
-        className: v(
-          T({ isDragging: h, isDisabled: n }),
-          t
+        className: p(
+          C({ hasFiles: D, isDragging: d, isDisabled: n }),
+          a
         ),
-        ...y,
+        ...z,
         children: [
           /* @__PURE__ */ r(
             "input",
             {
-              ref: m,
+              ref: x,
               hidden: !0,
               type: "file",
-              accept: b,
+              accept: y,
               multiple: c,
               disabled: n,
               onChange: (e) => {
-                x(e.currentTarget.files), e.currentTarget.value = "";
+                b(e.currentTarget.files), e.currentTarget.value = "";
               }
             }
           ),
-          k ? /* @__PURE__ */ a(f, { children: [
-            /* @__PURE__ */ r("span", { "aria-hidden": !0, className: "text-tertiary [&>svg]:size-6", children: /* @__PURE__ */ r(R, {}) }),
-            /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: s.map((e) => /* @__PURE__ */ a("span", { className: "text-base text-foreground", children: [
-              e.name,
-              /* @__PURE__ */ r("span", { className: "ml-2 text-s text-tertiary tabular-nums", children: j(e.size) })
+          D ? /* @__PURE__ */ t(m, { children: [
+            /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-1 flex-col gap-2.5", children: i.map((e) => /* @__PURE__ */ t("span", { className: "flex min-w-0 items-center gap-3", children: [
+              /* @__PURE__ */ r("span", { "aria-hidden": !0, className: N, children: /* @__PURE__ */ r(j, {}) }),
+              /* @__PURE__ */ t("span", { className: "flex min-w-0 flex-col", children: [
+                /* @__PURE__ */ r("span", { className: "truncate text-m font-medium text-foreground", children: e.name }),
+                /* @__PURE__ */ r("span", { className: "text-s text-tertiary tabular-nums", children: F(e.size) })
+              ] })
             ] }, e.name)) }),
-            /* @__PURE__ */ a("div", { className: "mt-1 flex items-center gap-2", children: [
-              /* @__PURE__ */ r(D, { size: "sm", variant: "secondary", onClick: (e) => {
+            /* @__PURE__ */ t("div", { className: "flex shrink-0 items-center gap-1", children: [
+              /* @__PURE__ */ r(v, { size: "sm", variant: "outline", onClick: (e) => {
                 e.stopPropagation(), u();
               }, children: "Replace" }),
               g && /* @__PURE__ */ r(
-                D,
+                v,
                 {
                   size: "sm",
                   variant: "ghost",
-                  startContent: /* @__PURE__ */ r(B, {}),
                   onClick: (e) => {
                     e.stopPropagation(), g();
                   },
@@ -111,24 +114,33 @@ const T = C(
                 }
               )
             ] })
-          ] }) : /* @__PURE__ */ a(f, { children: [
-            /* @__PURE__ */ r("span", { "aria-hidden": !0, className: "text-tertiary [&>svg]:size-6", children: /* @__PURE__ */ r(w, {}) }),
-            /* @__PURE__ */ r("span", { className: "text-base text-foreground", children: N ?? /* @__PURE__ */ a(f, { children: [
-              "Drop ",
-              c ? "files" : "a file",
-              " here, or",
-              " ",
-              /* @__PURE__ */ r("span", { className: "underline underline-offset-4", children: "browse" })
-            ] }) }),
-            p && /* @__PURE__ */ r("span", { className: "text-s text-tertiary", children: p })
+          ] }) : /* @__PURE__ */ t(m, { children: [
+            /* @__PURE__ */ r(
+              "span",
+              {
+                "aria-hidden": !0,
+                className: p(N, d && "text-action-primary"),
+                children: /* @__PURE__ */ r(B, {})
+              }
+            ),
+            /* @__PURE__ */ t("span", { className: "flex flex-col items-center gap-0.5", children: [
+              /* @__PURE__ */ r("span", { className: "text-m font-medium text-foreground", children: w ?? /* @__PURE__ */ t(m, { children: [
+                "Drop ",
+                c ? "files" : "a file",
+                " here, or",
+                " ",
+                /* @__PURE__ */ r("span", { className: "text-action-primary-text", children: "browse" })
+              ] }) }),
+              h && /* @__PURE__ */ r("span", { className: "text-s text-tertiary", children: h })
+            ] })
           ] })
         ]
       }
     );
   }
 );
-$.displayName = "FileDropzone";
+T.displayName = "FileDropzone";
 export {
-  $ as FileDropzone,
-  T as fileDropzoneVariants
+  T as FileDropzone,
+  C as fileDropzoneVariants
 };

package/components/infinite-canvas.js

@@ -2,20 +2,20 @@
 import { jsx as e, jsxs as b } from "react/jsx-runtime";
 import * as n from "react";
 import { MarkerType as U, ReactFlow as Z, Background as j, BackgroundVariant as H, Panel as h, useReactFlow as K, useStore as V } from "@xyflow/react";
-import { BaseEdge as he, EdgeLabelRenderer as xe, Handle as Ee, MarkerType as ye, Position as De, ReactFlowProvider as ke, addEdge as _e, getBezierPath as we, getSmoothStepPath as Ie, getStraightPath as Re, useEdgesState as Se, useNodesState as Ae, useReactFlow as Ce } from "@xyflow/react";
+import { BaseEdge as he, EdgeLabelRenderer as xe, Handle as Ee, MarkerType as ye, Position as De, ReactFlowProvider as ke, addEdge as _e, getBezierPath as Ie, getSmoothStepPath as we, getStraightPath as Re, useEdgesState as Se, useNodesState as Ae, useReactFlow as Ce } from "@xyflow/react";
 import "@xyflow/react/dist/style.css";
 import { cn as W } from "../lib/cn.js";
 import { Minus as q, Plus as J, Maximize as Q, Magnet as X } from "../lib/icons.js";
 import { Button as a } from "./button.js";
-const x = 16, Y = 1.2, $ = [x, x], ee = 1.4, w = 18, oe = 2, te = [8, 4], re = "var(--text-xs)", I = 150, ae = 200, ne = 0.28, R = "var(--canvas-edge)";
+const x = 16, Y = 1.2, $ = [x, x], ee = 1.4, I = 18, oe = 2, te = [8, 4], re = "var(--text-xs)", w = 150, ae = 200, ne = 0.28, R = "var(--canvas-edge)";
 function v(o) {
   return typeof window > "u" || !window.matchMedia ? o : window.matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : o;
 }
 const le = {
   markerEnd: {
     type: U.ArrowClosed,
-    width: w,
-    height: w,
+    width: I,
+    height: I,
     color: R
   },
   style: { stroke: R, strokeWidth: ee },
@@ -49,7 +49,7 @@ function S({
     h,
     {
       position: "bottom-right",
-      className: "m-3 flex items-center gap-0.5 rounded-lg border border-border bg-elevated p-1 shadow-elevation",
+      className: "m-3 flex items-center gap-0.5 rounded-lg border border-border bg-elevated p-1",
       children: [
         /* @__PURE__ */ e(
           a,
@@ -58,7 +58,7 @@ function S({
             size: "icon-xs",
             variant: "ghost",
             "aria-label": "Zoom out",
-            onClick: () => void c({ duration: v(I) }),
+            onClick: () => void c({ duration: v(w) }),
             children: /* @__PURE__ */ e(q, {})
           }
         ),
@@ -80,7 +80,7 @@ function S({
             size: "icon-xs",
             variant: "ghost",
             "aria-label": "Zoom in",
-            onClick: () => void s({ duration: v(I) }),
+            onClick: () => void s({ duration: v(w) }),
             children: /* @__PURE__ */ e(J, {})
           }
         ),
@@ -206,8 +206,8 @@ export {
   De as Position,
   ke as ReactFlowProvider,
   _e as addEdge,
-  we as getBezierPath,
-  Ie as getSmoothStepPath,
+  Ie as getBezierPath,
+  we as getSmoothStepPath,
   Re as getStraightPath,
   Se as useEdgesState,
   Ae as useNodesState,

package/components/modal.js

@@ -11,7 +11,7 @@ const A = H(
   [
     "pointer-events-auto relative flex w-full min-w-0 flex-col overflow-hidden",
     "max-h-[calc(100dvh-2rem)] bg-elevated text-foreground outline-none",
-    "rounded-xl shadow-400",
+    "rounded-xl shadow-overlay",
     "max-sm:max-h-[calc(100dvh-1rem)] max-sm:rounded-lg"
   ],
   {

package/components/page-body.js

@@ -1,18 +1,18 @@
 "use client";
 import * as e from "react";
-import { cn as r } from "../lib/cn.js";
-const d = e.forwardRef(
-  ({ as: a = "main", className: o, ...l }, t) => e.createElement(a, {
-    ref: t,
+import { cn as t } from "../lib/cn.js";
+const m = e.forwardRef(
+  ({ as: a = "main", className: o, ...l }, r) => e.createElement(a, {
+    ref: r,
     "data-slot": "page-body",
-    className: r(
-      "relative flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden bg-card shadow-elevation",
+    className: t(
+      "relative flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden bg-card",
       o
     ),
     ...l
   })
 );
-d.displayName = "PageBody";
+m.displayName = "PageBody";
 export {
-  d as PageBody
+  m as PageBody
 };

package/components/popover.js

@@ -18,13 +18,13 @@ function E(i) {
   return e;
 }
 function W({ children: i, defaultOpen: e = !1 }) {
-  const [c, l] = n.useState(e), d = n.useRef(null);
-  return /* @__PURE__ */ g(P.Provider, { value: { open: c, setOpen: l, triggerRef: d }, children: i });
+  const [c, a] = n.useState(e), d = n.useRef(null);
+  return /* @__PURE__ */ g(P.Provider, { value: { open: c, setOpen: a, triggerRef: d }, children: i });
 }
 function K({ children: i }) {
-  const { open: e, setOpen: c, triggerRef: l } = E("PopoverTrigger"), d = i;
+  const { open: e, setOpen: c, triggerRef: a } = E("PopoverTrigger"), d = i;
   return n.cloneElement(d, {
-    ref: l,
+    ref: a,
     "aria-expanded": e,
     "aria-haspopup": !0,
     onClick: (w) => {
@@ -37,7 +37,7 @@ function N({
   className: i,
   align: e = "start",
   sideOffset: c = 8,
-  children: l,
+  children: a,
   "aria-label": d = "Popover",
   ...w
 }) {
@@ -49,8 +49,8 @@ function N({
     const o = () => {
       var m;
       const t = f.getBoundingClientRect(), p = ((m = h.current) == null ? void 0 : m.offsetWidth) ?? 0;
-      let a = t.left;
-      e === "center" ? a = t.left + t.width / 2 - p / 2 : e === "end" && (a = t.right - p), b({ top: t.bottom + c, left: a });
+      let l = t.left;
+      e === "center" ? l = t.left + t.width / 2 - p / 2 : e === "end" && (l = t.right - p), b({ top: t.bottom + c, left: l });
     };
     return o(), window.addEventListener("resize", o), window.addEventListener("scroll", o, !0), () => {
       window.removeEventListener("resize", o), window.removeEventListener("scroll", o, !0);
@@ -60,9 +60,9 @@ function N({
     const f = (t) => {
       t.key === "Escape" && u(!1);
     }, o = (t) => {
-      var a, m;
+      var l, m;
       const p = t.target;
-      (a = h.current) != null && a.contains(p) || (m = v.current) != null && m.contains(p) || u(!1);
+      (l = h.current) != null && l.contains(p) || (m = v.current) != null && m.contains(p) || u(!1);
     };
     return document.addEventListener("keydown", f), document.addEventListener("pointerdown", o), () => {
       document.removeEventListener("keydown", f), document.removeEventListener("pointerdown", o);
@@ -87,13 +87,13 @@ function N({
         },
         className: z(
           "relative z-50 min-w-44 rounded-lg border border-border bg-elevated p-3",
-          "text-xs text-foreground shadow-elevation",
+          "text-xs text-foreground",
           i
         ),
         ...w,
         children: [
           /* @__PURE__ */ g(j, { origin: x[e] }),
-          l
+          a
         ]
       }
     ) }) }),

package/components/progress-circle.d.ts

@@ -2,7 +2,7 @@ import * as React from "react";
 export interface ProgressCircleProps extends React.HTMLAttributes<HTMLDivElement> {
     value?: number;
     max?: number;
-    /** Diameter in pixels. */
+    /** Outer width/height in pixels. */
     size?: number;
     strokeWidth?: number;
     isIndeterminate?: boolean;

package/components/progress-circle.js

@@ -1,69 +1,78 @@
 "use client";
-import { jsx as o, jsxs as v } from "react/jsx-runtime";
-import * as x from "react";
-import { MotionConfig as w, motion as y } from "motion/react";
-import { cn as l } from "../lib/cn.js";
-import { springProgress as M } from "../lib/motion.js";
-const N = x.forwardRef(
+import { jsx as i, jsxs as x } from "react/jsx-runtime";
+import * as p from "react";
+import { MotionConfig as L, motion as N } from "motion/react";
+import { cn as u } from "../lib/cn.js";
+import { springProgress as b } from "../lib/motion.js";
+const M = 4, g = 96;
+function w(s, e) {
+  const t = [];
+  for (let o = 0; o <= g; o++) {
+    const n = -Math.PI / 2 + o / g * Math.PI * 2, a = Math.cos(n), r = Math.sin(n), c = s + e * Math.sign(a) * Math.abs(a) ** (2 / M), l = s + e * Math.sign(r) * Math.abs(r) ** (2 / M);
+    t.push(`${c.toFixed(2)},${l.toFixed(2)}`);
+  }
+  return `M${t.join(" L")} Z`;
+}
+const j = p.forwardRef(
   ({
-    className: m,
-    value: f = 0,
-    max: e = 100,
-    size: r = 40,
-    strokeWidth: i = 4,
-    isIndeterminate: n = !1,
-    label: d,
-    ...p
-  }, h) => {
-    const c = Math.min(Math.max(f, 0), e), u = e > 0 ? c / e : 0, s = (r - i) / 2, t = 2 * Math.PI * s, g = n ? t * 0.75 : t * (1 - u), a = r / 2;
-    return /* @__PURE__ */ o(
+    className: s,
+    value: e = 0,
+    max: t = 100,
+    size: o = 40,
+    strokeWidth: n = 4,
+    isIndeterminate: a = !1,
+    label: r,
+    ...c
+  }, l) => {
+    const h = Math.min(Math.max(e, 0), t), v = t > 0 ? h / t : 0, m = o / 2, d = (o - n) / 2, f = p.useMemo(() => w(m, d), [m, d]), P = a ? 75 : 100 - v * 100;
+    return /* @__PURE__ */ i(
       "div",
       {
-        ref: h,
+        ref: l,
         role: "progressbar",
-        "aria-label": d,
+        "aria-label": r,
         "aria-valuemin": 0,
-        "aria-valuemax": e,
-        "aria-valuenow": n ? void 0 : c,
-        className: l("inline-flex", m),
-        style: { width: r, height: r },
-        ...p,
-        children: /* @__PURE__ */ v(
+        "aria-valuemax": t,
+        "aria-valuenow": a ? void 0 : h,
+        className: u("inline-flex", s),
+        style: { width: o, height: o },
+        ...c,
+        children: /* @__PURE__ */ x(
           "svg",
           {
-            width: r,
-            height: r,
-            viewBox: `0 0 ${r} ${r}`,
-            className: l(
-              "-rotate-90",
-              n && "animate-[ads-spin_800ms_linear_infinite]"
+            width: o,
+            height: o,
+            viewBox: `0 0 ${o} ${o}`,
+            "aria-hidden": "true",
+            className: u(
+              "overflow-visible",
+              a && "animate-[ads-spin_800ms_linear_infinite] motion-reduce:animate-none"
             ),
             children: [
-              /* @__PURE__ */ o(
-                "circle",
+              /* @__PURE__ */ i(
+                "path",
                 {
                   className: "stroke-muted",
                   fill: "none",
-                  cx: a,
-                  cy: a,
-                  r: s,
-                  strokeWidth: i
+                  d: f,
+                  strokeWidth: n,
+                  strokeLinejoin: "round"
                 }
               ),
-              /* @__PURE__ */ o(w, { reducedMotion: "user", children: /* @__PURE__ */ o(
-                y.circle,
+              /* @__PURE__ */ i(L, { reducedMotion: "user", children: /* @__PURE__ */ i(
+                N.path,
                 {
                   className: "stroke-brand",
                   fill: "none",
-                  cx: a,
-                  cy: a,
-                  r: s,
-                  strokeWidth: i,
+                  d: f,
+                  pathLength: 100,
+                  strokeWidth: n,
                   strokeLinecap: "round",
-                  strokeDasharray: t,
+                  strokeLinejoin: "round",
+                  strokeDasharray: "100 100",
                   initial: !1,
-                  animate: { strokeDashoffset: g },
-                  transition: M
+                  animate: { strokeDashoffset: P },
+                  transition: b
                 }
               ) })
             ]
@@ -73,7 +82,7 @@ const N = x.forwardRef(
     );
   }
 );
-N.displayName = "ProgressCircle";
+j.displayName = "ProgressCircle";
 export {
-  N as ProgressCircle
+  j as ProgressCircle
 };

package/components/segmented.d.ts

@@ -14,6 +14,7 @@ export interface SegmentedControlProps extends Omit<React.HTMLAttributes<HTMLDiv
     options: SegmentedOption[];
     value: string;
     onChange: (value: string) => void;
+    /** @deprecated No effect: the active thumb is always flat (ADS 1.0.8). */
     elevated?: boolean;
 }
 export declare const SegmentedControl: React.ForwardRefExoticComponent<SegmentedControlProps & React.RefAttributes<HTMLDivElement>>;