@actioneer/ads 0.6.0 → 0.8.0

package/components/field.js

@@ -1,85 +1,90 @@
 "use client";
-import { jsxs as v, jsx as a } from "react/jsx-runtime";
-import * as r from "react";
+import { jsxs as v, jsx as l } from "react/jsx-runtime";
+import * as a from "react";
 import { cn as i } from "../lib/cn.js";
 import { interactive as R } from "../lib/interactive.js";
 const L = i(
   // Border WIDTH only — no border-color utility. ads-interactive owns the
   // color (rest = --glow-border-rest below); a `border-input` utility here
-  // would out-cascade the hover/focus brand-black rules.
-  "flex w-full rounded-md border bg-elevated text-foreground",
-  "px-3 text-xs",
-  "placeholder:text-muted-foreground",
+  // would out-cascade the shared hover/focus rules.
+  "flex w-full rounded-md border bg-elevated text-on-white-secondary",
+  "px-3 text-m font-medium focus:text-on-white-primary",
+  "placeholder:text-on-white-tertiary hover:placeholder:text-on-white-secondary focus:placeholder:text-transparent",
   "outline-none",
+  // Text/placeholder color changes are intentionally immediate. Interpolating
+  // glyph color makes browser antialiasing look like the copy shifts on hover.
+  "transition-[border-color,box-shadow]",
   "disabled:cursor-not-allowed disabled:opacity-50",
   // Form controls keep a subtle stroke (the "~25%") for crisp definition;
-  // hover/focus snap the border to solid brand-black (no halo). The inner
+  // hover stays neutral while focus uses the subtle semantic green edge. The inner
   // glow is a whisper of inset depth so the writing surface reads recessed —
   // carried through every interactive state by the --glow-inset hook.
   R({ on: "all", color: "brand", intensity: "medium", animate: !0 }),
   "[--glow-border-rest:var(--input)]",
+  "[--glow-border-hover:var(--input)]",
+  "[--glow-border-active:var(--field-focus)]",
   "[--glow-inset:var(--inner-glow-field)]"
-), g = r.forwardRef(({ className: t, children: e, required: o, ...l }, n) => /* @__PURE__ */ v(
+), w = a.forwardRef(({ className: r, children: e, required: o, ...t }, d) => /* @__PURE__ */ v(
   "label",
   {
-    ref: n,
+    ref: d,
     className: i(
-      "flex items-center gap-1 text-xs font-normal text-foreground select-none",
+      "flex items-center gap-1 text-m font-medium text-secondary select-none",
       "peer-disabled:cursor-not-allowed peer-disabled:opacity-60",
-      t
+      r
     ),
-    ...l,
+    ...t,
     children: [
       e,
-      o && /* @__PURE__ */ a("span", { className: "text-danger", children: "*" })
+      o && /* @__PURE__ */ l("span", { className: "text-danger", children: "*" })
     ]
   }
 ));
-g.displayName = "Label";
-const w = r.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ a(
+w.displayName = "Label";
+const y = a.forwardRef(({ className: r, ...e }, o) => /* @__PURE__ */ l(
   "p",
   {
     ref: o,
-    className: i("text-xs text-muted-foreground", t),
+    className: i("text-m font-normal text-muted-foreground", r),
     ...e
   }
 ));
-w.displayName = "FieldDescription";
-const y = r.forwardRef(
-  ({ className: t, children: e, ...o }, l) => e ? /* @__PURE__ */ a(
+y.displayName = "FieldDescription";
+const h = a.forwardRef(
+  ({ className: r, children: e, ...o }, t) => e ? /* @__PURE__ */ l(
     "p",
     {
-      ref: l,
-      className: i("text-xs font-normal text-danger", t),
+      ref: t,
+      className: i("text-m font-normal text-danger", r),
       ...o,
       children: e
     }
   ) : null
 );
-y.displayName = "FieldError";
-const D = r.forwardRef(
-  ({ className: t, label: e, description: o, error: l, required: n, htmlFor: N, errorId: s, descriptionId: c, children: d, ...F }, h) => {
-    const m = r.useId(), f = s ?? `${m}-error`, p = c ?? `${m}-description`, u = l ? f : o ? p : void 0, E = s == null && c == null;
-    let x = d;
-    if (E && u && r.isValidElement(d)) {
-      const b = d.props;
-      x = r.cloneElement(d, {
+h.displayName = "FieldError";
+const D = a.forwardRef(
+  ({ className: r, label: e, description: o, error: t, required: d, htmlFor: g, errorId: s, descriptionId: c, children: n, ...N }, F) => {
+    const m = a.useId(), p = s ?? `${m}-error`, f = c ?? `${m}-description`, u = t ? p : o ? f : void 0, E = s == null && c == null;
+    let x = n;
+    if (E && u && a.isValidElement(n)) {
+      const b = n.props;
+      x = a.cloneElement(n, {
         "aria-describedby": [b["aria-describedby"], u].filter(Boolean).join(" ") || void 0,
-        "aria-invalid": b["aria-invalid"] ?? (l ? !0 : void 0)
+        "aria-invalid": b["aria-invalid"] ?? (t ? !0 : void 0)
       });
     }
-    return /* @__PURE__ */ v("div", { ref: h, className: i("flex flex-col gap-1.5", t), ...F, children: [
-      e && /* @__PURE__ */ a(g, { htmlFor: N, required: n, children: e }),
+    return /* @__PURE__ */ v("div", { ref: F, className: i("flex flex-col gap-1.5", r), ...N, children: [
+      e && /* @__PURE__ */ l(w, { htmlFor: g, required: d, children: e }),
       x,
-      l ? /* @__PURE__ */ a(y, { id: f, children: l }) : o ? /* @__PURE__ */ a(w, { id: p, children: o }) : null
+      t ? /* @__PURE__ */ l(h, { id: p, children: t }) : o ? /* @__PURE__ */ l(y, { id: f, children: o }) : null
     ] });
   }
 );
 D.displayName = "Field";
 export {
   D as Field,
-  w as FieldDescription,
-  y as FieldError,
-  g as Label,
+  y as FieldDescription,
+  h as FieldError,
+  w as Label,
   L as inputBaseClass
 };

package/components/file-dropzone.js

@@ -8,7 +8,7 @@ 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-2 border-dashed border-border-strong bg-surface outline-none",
+    "border border-dashed border-border-strong bg-surface 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"

package/components/index.d.ts

@@ -9,7 +9,6 @@ export * from './spinner';
 export * from './reveal';
 export * from './field';
 export * from './typography';
-export * from './link';
 export * from './divider';
 export * from './kbd';
 export * from './code-block';
@@ -56,21 +55,22 @@ export * from './badge';
 export * from './chip';
 export * from './timeline';
 export * from './alert';
+export * from './surface-loader';
 export * from './brand-loader';
 export * from './pixel-blast-svg';
-export * from './pixel-icon';
-export * from './agent-icon';
 export * from './ripple';
 export * from './brand-texture';
 export * from './progress';
 export * from './progress-circle';
 export * from './skeleton';
 export * from './empty-state';
+export * from './body-page-header';
+export * from './collection-header';
 export * from './page-header';
-export * from './navbar';
 export * from './breadcrumbs';
 export * from './pagination';
 export * from './sidebar';
+export * from './page-body';
 export * from './panel';
 export * from './collapsible';
 export * from './selection-action-bar';