@actioneer/ads 0.5.3 → 0.5.5

package/components/ai-elements/chain-of-thought.js

@@ -66,7 +66,7 @@ const S = O(!1), k = O("tree"), B = d(
           // Connector rail: a 16px segment centred in the 28px gap between a
           // collapsed step's icon and the next one (top-8 = 32px from the step
           // top, ending 4px past its box). It stretches with an open step.
-          p === "rail" && "before:absolute before:top-8 before:-bottom-1 before:left-2 before:w-px before:bg-border-strong before:content-['']",
+          p === "rail" && "before:absolute before:top-8 before:-bottom-1 before:left-2 before:w-px before:bg-border-tertiary before:content-['']",
           // Tree connector: a continuous rail down the group with an elbow
           // reaching EVERY step — the same branch language as Tree/TreeItem.
           // The last step drops the rail; its elbow draws the final segment.
@@ -77,7 +77,7 @@ const S = O(!1), k = O("tree"), B = d(
           // from that icon instead of floating below it.
           p === "tree" && [
             "ps-5",
-            "before:absolute before:top-0 before:bottom-0 before:left-0 before:border-l before:border-border-strong before:content-['']",
+            "before:absolute before:top-0 before:bottom-0 before:left-0 before:border-l before:border-border-tertiary before:content-['']",
             "first:before:top-[calc(-1*var(--tree-rail-lead,0px))]",
             // The LAST row's rail stops exactly where its elbow begins (2px
             // in) instead of disappearing — hiding it left a 2px notch above
@@ -86,7 +86,7 @@ const S = O(!1), k = O("tree"), B = d(
             // it composes with the first-row climb.
             "last:before:bottom-[calc(100%-0.125rem)]",
             // top-0.5 + h-4 lands the elbow at 18px — the step icon's centre.
-            "after:absolute after:left-0 after:top-0.5 after:h-4 after:w-4 after:rounded-bl-[9px] after:border-b after:border-l after:border-border-strong after:content-['']"
+            "after:absolute after:left-0 after:top-0.5 after:h-4 after:w-4 after:rounded-bl-[9px] after:border-b after:border-l after:border-border-tertiary after:content-['']"
           ],
           t === "complete" && "text-secondary",
           t === "active" && "text-secondary",
@@ -191,7 +191,7 @@ const S = O(!1), k = O("tree"), B = d(
             className: n(
               "relative pt-2 pb-1 pl-7",
               a && [
-                "has-[[data-slot=chain-of-thought-evidence]]:before:absolute has-[[data-slot=chain-of-thought-evidence]]:before:left-2 has-[[data-slot=chain-of-thought-evidence]]:before:top-0 has-[[data-slot=chain-of-thought-evidence]]:before:bottom-1 has-[[data-slot=chain-of-thought-evidence]]:before:border-l has-[[data-slot=chain-of-thought-evidence]]:before:border-border-strong has-[[data-slot=chain-of-thought-evidence]]:before:content-['']",
+                "has-[[data-slot=chain-of-thought-evidence]]:before:absolute has-[[data-slot=chain-of-thought-evidence]]:before:left-2 has-[[data-slot=chain-of-thought-evidence]]:before:top-0 has-[[data-slot=chain-of-thought-evidence]]:before:bottom-1 has-[[data-slot=chain-of-thought-evidence]]:before:border-l has-[[data-slot=chain-of-thought-evidence]]:before:border-border-tertiary has-[[data-slot=chain-of-thought-evidence]]:before:content-['']",
                 // The rail ends ON the last branch: when the trailing element
                 // is a collapsed evidence row (min-h-8 = 32px + the pb-1),
                 // stop at its top and let its elbow draw the final curve —
@@ -263,7 +263,7 @@ const S = O(!1), k = O("tree"), B = d(
         // icon → 16px = h-4). The elbow spans from the rail (20px left of
         // the row) to 4px short of the icon, same as every other branch.
         "[[data-rail]_&]:relative",
-        "[[data-rail]_&]:before:absolute [[data-rail]_&]:before:content-[''] [[data-rail]_&]:before:-left-5 [[data-rail]_&]:before:top-0 [[data-rail]_&]:before:h-4 [[data-rail]_&]:before:w-4 [[data-rail]_&]:before:rounded-bl-[9px] [[data-rail]_&]:before:border-b [[data-rail]_&]:before:border-l [[data-rail]_&]:before:border-border-strong",
+        "[[data-rail]_&]:before:absolute [[data-rail]_&]:before:content-[''] [[data-rail]_&]:before:-left-5 [[data-rail]_&]:before:top-0 [[data-rail]_&]:before:h-4 [[data-rail]_&]:before:w-4 [[data-rail]_&]:before:rounded-bl-[9px] [[data-rail]_&]:before:border-b [[data-rail]_&]:before:border-l [[data-rail]_&]:before:border-border-tertiary",
         i
       ),
       ...p,
@@ -290,7 +290,7 @@ const S = O(!1), k = O("tree"), B = d(
                   children: h ?? (s != null ? /* @__PURE__ */ e(j, {}) : /* @__PURE__ */ e(M, {}))
                 }
               ),
-              /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate text-base font-medium text-secondary", children: r }),
+              /* @__PURE__ */ e("span", { className: "min-w-0 flex-1 truncate text-base font-normal text-secondary", children: r }),
               a != null && /* @__PURE__ */ e(
                 y,
                 {
@@ -354,7 +354,7 @@ const S = O(!1), k = O("tree"), B = d(
               "th",
               {
                 className: n(
-                  "sticky top-0 bg-surface px-2.5 py-1.5 font-medium whitespace-nowrap",
+                  "sticky top-0 bg-surface px-2.5 py-1.5 font-normal whitespace-nowrap",
                   c.align === "end" ? "text-right" : "text-left"
                 ),
                 children: c.label

package/components/ai-elements/chart.js

@@ -1,16 +1,19 @@
 "use client";
 import { jsxs as a, jsx as e } from "react/jsx-runtime";
-import * as x from "react";
+import * as g from "react";
 import { cva as M } from "class-variance-authority";
 import { Badge as Q } from "../badge.js";
 import { Button as T } from "../button.js";
 import { Collapsible as V, CollapsibleTrigger as W, CollapsibleContent as E } from "../collapsible.js";
-import { Skeleton as g } from "../skeleton.js";
+import { Skeleton as x } from "../skeleton.js";
 import { Spinner as v } from "../spinner.js";
 import { Database as O, ChevronDown as P, WarningCircle as S, Refresh as F, CloseCircle as G } from "../../lib/icons.js";
-import { cn as d } from "../../lib/cn.js";
+import { cn as l } from "../../lib/cn.js";
 const H = M(
-  "w-full overflow-hidden rounded-lg text-foreground",
+  // An ARTIFACT card, not a work-trace row: the chart is a produced object,
+  // so it reads like an attachment (contained hairline card + filled icon
+  // tile) instead of the ChainOfThought/ResearchActivity trace language.
+  "w-full overflow-hidden rounded-lg border border-border bg-card text-foreground",
   {
     variants: {
       status: {
@@ -50,11 +53,11 @@ function U(t) {
   if (t)
     return t.total == null ? `${t.received} received` : `${t.received} of ${t.total} received`;
 }
-function X(t, r, n) {
+function X(t, r, i) {
   const o = [
     r ? r.total == null ? `${r.received} received` : `${r.received} / ${r.total}` : J[t]
   ];
-  return n && o.push(n), o.join(" · ");
+  return i && o.push(i), o.join(" · ");
 }
 function Y({
   status: t
@@ -65,7 +68,7 @@ function Y({
       className: "relative h-40 overflow-hidden rounded-md",
       "data-slot": "ai-chart-skeleton",
       children: [
-        /* @__PURE__ */ e(g, { className: "absolute inset-0 h-full w-full" }),
+        /* @__PURE__ */ e(x, { className: "absolute inset-0 h-full w-full" }),
         /* @__PURE__ */ a("div", { className: "absolute inset-0 flex items-center justify-center gap-2 text-xs text-tertiary", children: [
           t !== "pending" && /* @__PURE__ */ e(
             v,
@@ -85,7 +88,7 @@ function Y({
 function Z({
   status: t,
   progress: r,
-  errorContent: n,
+  errorContent: i,
   onRetry: o,
   children: s
 }) {
@@ -96,7 +99,7 @@ function Z({
       "data-slot": "ai-chart-error",
       children: [
         /* @__PURE__ */ e(S, { className: "size-5 text-danger-700", "aria-hidden": !0 }),
-        /* @__PURE__ */ e("div", { className: "text-xs text-secondary", children: n ?? "The chart could not be generated." }),
+        /* @__PURE__ */ e("div", { className: "text-xs text-secondary", children: i ?? "The chart could not be generated." }),
         o && /* @__PURE__ */ e(
           T,
           {
@@ -133,21 +136,21 @@ function Z({
       ),
       /* @__PURE__ */ e("span", { children: U(r) ?? "Receiving chart data" })
     ] }),
-    /* @__PURE__ */ e("div", { className: "min-h-40", children: s ?? /* @__PURE__ */ e(g, { className: "h-40 w-full" }) })
+    /* @__PURE__ */ e("div", { className: "min-h-40", children: s ?? /* @__PURE__ */ e(x, { className: "h-40 w-full" }) })
   ] }) : t !== "ready" ? /* @__PURE__ */ e(Y, { status: t }) : (
     // The ready chart draws itself in left→right (the reveal wipe) instead of
     // popping after the loading state — data entrance, not chrome.
     /* @__PURE__ */ e("div", { className: "ads-reveal ads-reveal-wipe min-h-40", "data-slot": "ai-chart-visual", children: s })
   );
 }
-const ee = x.forwardRef(
+const ee = g.forwardRef(
   ({
     className: t,
     status: r,
-    title: n,
+    title: i,
     tag: o,
     source: s,
-    progress: l,
+    progress: d,
     elapsed: y,
     meta: c,
     accessibleSummary: u,
@@ -159,13 +162,13 @@ const ee = x.forwardRef(
     onRetry: w,
     children: k,
     role: A = "region",
-    "aria-label": R,
-    "aria-describedby": j,
-    "aria-busy": z,
+    "aria-label": z,
+    "aria-describedby": R,
+    "aria-busy": j,
     ...I
   }, $) => {
-    const i = r ?? "ready", B = i === "querying" || i === "partial" || i === "rendering", h = c !== void 0 ? c : X(i, l, y), q = K[i], f = x.useId(), p = i === "ready" && u != null, D = [
-      j,
+    const n = r ?? "ready", B = n === "querying" || n === "partial" || n === "rendering", h = c !== void 0 ? c : X(n, d, y), q = K[n], f = g.useId(), p = n === "ready" && u != null, D = [
+      R,
       p ? f : void 0
     ].filter(Boolean).join(" ") || void 0;
     return /* @__PURE__ */ a(
@@ -176,11 +179,11 @@ const ee = x.forwardRef(
         defaultOpen: N,
         onOpenChange: C,
         role: A,
-        "aria-label": R ?? (typeof n == "string" ? n : "AI chart evidence"),
+        "aria-label": z ?? (typeof i == "string" ? i : "AI chart evidence"),
         "aria-describedby": D,
         "data-slot": "ai-chart",
-        "data-status": i,
-        className: d(H({ status: i }), t),
+        "data-status": n,
+        className: l(H({ status: n }), t),
         ...I,
         children: [
           /* @__PURE__ */ e(
@@ -198,21 +201,21 @@ const ee = x.forwardRef(
             "button",
             {
               type: "button",
-              className: d(
-                "group/ai-chart-trigger flex min-h-9 w-full items-center gap-2 rounded-md px-1 py-1 text-left",
-                "outline-none transition-[background,color,transform] duration-(--duration-fast) ease-out hover:bg-muted active:scale-(--scale-press)",
+              className: l(
+                "group/ai-chart-trigger flex w-full items-center gap-2.5 px-2.5 py-2 text-left",
+                "outline-none transition-[background,color,transform] duration-(--duration-fast) ease-out hover:bg-fill active:scale-(--scale-press)",
                 "focus-visible:ring-3 focus-visible:ring-inset focus-visible:ring-ring motion-reduce:transition-none"
               ),
               children: [
                 /* @__PURE__ */ e(
-                  O,
+                  "span",
                   {
-                    "data-slot": "ai-chart-icon",
-                    className: "size-4 shrink-0",
-                    "aria-hidden": !0
+                    "aria-hidden": !0,
+                    className: "grid size-8 shrink-0 place-items-center rounded-md bg-surface",
+                    children: /* @__PURE__ */ e(O, { "data-slot": "ai-chart-icon", className: "size-4" })
                   }
                 ),
-                /* @__PURE__ */ e("span", { className: "min-w-0 truncate text-xs font-medium text-secondary", children: n }),
+                /* @__PURE__ */ e("span", { className: "min-w-0 truncate text-xs font-normal text-foreground", children: i }),
                 o != null && /* @__PURE__ */ e(
                   Q,
                   {
@@ -243,7 +246,7 @@ const ee = x.forwardRef(
           /* @__PURE__ */ a(
             E,
             {
-              className: d(
+              className: l(
                 "overflow-hidden px-2.5 pb-2.5 outline-none",
                 "data-[state=closed]:pointer-events-none data-[state=closed]:fade-out-0 data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2 data-[state=closed]:animate-out data-[state=open]:animate-in motion-reduce:animate-none"
               ),
@@ -252,12 +255,12 @@ const ee = x.forwardRef(
                   "div",
                   {
                     "data-slot": "ai-chart-body",
-                    "aria-busy": z ?? (B || void 0),
+                    "aria-busy": j ?? (B || void 0),
                     children: /* @__PURE__ */ e(
                       Z,
                       {
-                        status: i,
-                        progress: l,
+                        status: n,
+                        progress: d,
                         errorContent: _,
                         onRetry: w,
                         children: k
@@ -279,12 +282,12 @@ const ee = x.forwardRef(
                         onClick: () => m(s),
                         children: [
                           "from ",
-                          /* @__PURE__ */ e("span", { className: "font-medium tabular-nums", children: s })
+                          /* @__PURE__ */ e("span", { className: "font-normal tabular-nums", children: s })
                         ]
                       }
                     ) : /* @__PURE__ */ a("p", { children: [
                       "from ",
-                      /* @__PURE__ */ e("span", { className: "font-medium tabular-nums", children: s })
+                      /* @__PURE__ */ e("span", { className: "font-normal tabular-nums", children: s })
                     ] })
                   }
                 )

package/components/ai-elements/index.d.ts

@@ -1,5 +1,6 @@
 export * from './agent-trace';
 export * from './chain-of-thought';
+export * from './chain-of-thought-icon';
 export * from './chart';
 export * from './inline-citation';
 export * from './message';

package/components/ai-elements/inline-citation.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as i, jsxs as k } from "react/jsx-runtime";
+import { jsx as r, jsxs as k } from "react/jsx-runtime";
 import * as o from "react";
 import { createPortal as M } from "react-dom";
 import { MotionConfig as R, AnimatePresence as E, motion as L } from "motion/react";
@@ -7,7 +7,7 @@ import { cn as c } from "../../lib/cn.js";
 import { floatVariants as T } from "../../lib/motion.js";
 import { ArrowRight as P, ArrowLeft as z } from "../../lib/icons.js";
 import { Badge as S } from "../badge.js";
-const F = ({ className: e, ...t }) => /* @__PURE__ */ i(
+const F = ({ className: e, ...t }) => /* @__PURE__ */ r(
   "span",
   {
     className: c("group/citation inline items-center gap-1", e),
@@ -16,7 +16,7 @@ const F = ({ className: e, ...t }) => /* @__PURE__ */ i(
 ), H = ({
   className: e,
   ...t
-}) => /* @__PURE__ */ i(
+}) => /* @__PURE__ */ r(
   "span",
   {
     className: c(
@@ -37,7 +37,7 @@ const Q = ({
   open: t,
   defaultOpen: s = !1,
   onOpenChange: n,
-  openDelay: r = 0,
+  openDelay: i = 0,
   closeDelay: a = 0
 }) => {
   const d = t !== void 0, [C, l] = o.useState(s), h = d ? t : C, u = o.useRef(null), f = o.useRef(null), m = o.useRef({}), x = o.useCallback(
@@ -46,8 +46,8 @@ const Q = ({
     },
     [d, n]
   ), p = o.useCallback(() => {
-    window.clearTimeout(m.current.close), m.current.open = window.setTimeout(() => x(!0), r);
-  }, [r, x]), w = o.useCallback(() => {
+    window.clearTimeout(m.current.close), m.current.open = window.setTimeout(() => x(!0), i);
+  }, [i, x]), w = o.useCallback(() => {
     window.clearTimeout(m.current.open), m.current.close = window.setTimeout(
       () => x(!1),
       a + 120
@@ -58,7 +58,7 @@ const Q = ({
       window.clearTimeout(m.current.open), window.clearTimeout(m.current.close);
     },
     []
-  ), /* @__PURE__ */ i(
+  ), /* @__PURE__ */ r(
     g.Provider,
     {
       value: { open: h, triggerRef: u, contentRef: f, handleOpen: p, handleClose: w },
@@ -70,7 +70,7 @@ const Q = ({
   className: t,
   ...s
 }) => {
-  const { open: n, triggerRef: r, handleOpen: a, handleClose: d } = N(
+  const { open: n, triggerRef: i, handleOpen: a, handleClose: d } = N(
     "InlineCitationCardTrigger"
   ), C = o.useMemo(() => {
     if (!e[0]) return "unknown";
@@ -81,10 +81,10 @@ const Q = ({
     }
     return e.length > 1 ? `${l} +${e.length - 1}` : l;
   }, [e]);
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ r(
     S,
     {
-      ref: r,
+      ref: i,
       variant: "soft",
       className: c("ml-1 cursor-default align-middle", t),
       role: "button",
@@ -104,10 +104,10 @@ const Q = ({
   children: t,
   ...s
 }) => {
-  const { open: n, triggerRef: r, contentRef: a, handleOpen: d, handleClose: C } = N("InlineCitationCardBody"), [l, h] = o.useState(null);
+  const { open: n, triggerRef: i, contentRef: a, handleOpen: d, handleClose: C } = N("InlineCitationCardBody"), [l, h] = o.useState(null);
   return o.useLayoutEffect(() => {
     if (!n) return;
-    const u = r.current;
+    const u = i.current;
     if (!u) return;
     const f = () => {
       var b;
@@ -117,8 +117,8 @@ const Q = ({
     return f(), window.addEventListener("resize", f), window.addEventListener("scroll", f, !0), () => {
       window.removeEventListener("resize", f), window.removeEventListener("scroll", f, !0);
     };
-  }, [n, r]), M(
-    /* @__PURE__ */ i(R, { reducedMotion: "user", children: /* @__PURE__ */ i(E, { children: n && /* @__PURE__ */ i(
+  }, [n, i]), M(
+    /* @__PURE__ */ r(R, { reducedMotion: "user", children: /* @__PURE__ */ r(E, { children: n && /* @__PURE__ */ r(
       L.div,
       {
         ref: a,
@@ -160,20 +160,20 @@ const G = ({
   children: t,
   ...s
 }) => {
-  const [n, r] = o.useState(0), [a, d] = o.useState(0), C = o.useCallback(
-    () => r((u) => Math.max(0, u - 1)),
+  const [n, i] = o.useState(0), [a, d] = o.useState(0), C = o.useCallback(
+    () => i((u) => Math.max(0, u - 1)),
     []
   ), l = o.useCallback(
-    () => r((u) => Math.min(Math.max(0, a - 1), u + 1)),
+    () => i((u) => Math.min(Math.max(0, a - 1), u + 1)),
     [a]
   ), h = o.useCallback((u) => {
-    d(u), r((f) => Math.min(f, Math.max(0, u - 1)));
+    d(u), i((f) => Math.min(f, Math.max(0, u - 1)));
   }, []);
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ r(
     I.Provider,
     {
       value: { index: n, count: a, setCount: h, scrollPrev: C, scrollNext: l },
-      children: /* @__PURE__ */ i("div", { className: c("w-full", e), ...s, children: t })
+      children: /* @__PURE__ */ r("div", { className: c("w-full", e), ...s, children: t })
     }
   );
 }, J = ({
@@ -181,10 +181,10 @@ const G = ({
   children: t,
   ...s
 }) => {
-  const { index: n, setCount: r } = v(), a = o.Children.count(t);
+  const { index: n, setCount: i } = v(), a = o.Children.count(t);
   return o.useEffect(() => {
-    r(a);
-  }, [a, r]), /* @__PURE__ */ i("div", { className: c("overflow-hidden", e), ...s, children: /* @__PURE__ */ i(
+    i(a);
+  }, [a, i]), /* @__PURE__ */ r("div", { className: c("overflow-hidden", e), ...s, children: /* @__PURE__ */ r(
     "div",
     {
       className: "flex transition-transform duration-(--duration-normal) ease-out motion-reduce:transition-none",
@@ -195,7 +195,7 @@ const G = ({
 }, K = ({
   className: e,
   ...t
-}) => /* @__PURE__ */ i(
+}) => /* @__PURE__ */ r(
   "div",
   {
     className: c("w-full shrink-0 space-y-2 p-4", e),
@@ -204,7 +204,7 @@ const G = ({
 ), O = ({
   className: e,
   ...t
-}) => /* @__PURE__ */ i(
+}) => /* @__PURE__ */ r(
   "div",
   {
     className: c(
@@ -218,8 +218,8 @@ const G = ({
   className: t,
   ...s
 }) => {
-  const { index: n, count: r } = v();
-  return /* @__PURE__ */ i(
+  const { index: n, count: i } = v();
+  return /* @__PURE__ */ r(
     "div",
     {
       className: c(
@@ -227,7 +227,7 @@ const G = ({
         t
       ),
       ...s,
-      children: e ?? `${r === 0 ? 0 : n + 1}/${r}`
+      children: e ?? `${i === 0 ? 0 : n + 1}/${i}`
     }
   );
 }, y = c(
@@ -240,7 +240,7 @@ const G = ({
   ...t
 }) => {
   const { scrollPrev: s, index: n } = v();
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ r(
     "button",
     {
       type: "button",
@@ -249,24 +249,24 @@ const G = ({
       onClick: s,
       className: c(y, e),
       ...t,
-      children: /* @__PURE__ */ i(z, { className: "size-4" })
+      children: /* @__PURE__ */ r(z, { className: "size-4" })
     }
   );
 }, _ = ({
   className: e,
   ...t
 }) => {
-  const { scrollNext: s, index: n, count: r } = v();
-  return /* @__PURE__ */ i(
+  const { scrollNext: s, index: n, count: i } = v();
+  return /* @__PURE__ */ r(
     "button",
     {
       type: "button",
       "aria-label": "Next source",
-      disabled: n >= r - 1,
+      disabled: n >= i - 1,
       onClick: s,
       className: c(y, e),
       ...t,
-      children: /* @__PURE__ */ i(P, { className: "size-4" })
+      children: /* @__PURE__ */ r(P, { className: "size-4" })
     }
   );
 }, D = ({
@@ -274,18 +274,18 @@ const G = ({
   url: t,
   description: s,
   className: n,
-  children: r,
+  children: i,
   ...a
 }) => /* @__PURE__ */ k("div", { className: c("space-y-1", n), ...a, children: [
-  e && /* @__PURE__ */ i("p", { className: "truncate font-medium text-base leading-tight text-primary", children: e }),
-  t && /* @__PURE__ */ i("p", { className: "truncate break-all text-xs text-tertiary", children: t }),
-  s && /* @__PURE__ */ i("p", { className: "line-clamp-3 text-base leading-relaxed text-secondary", children: s }),
-  r
+  e && /* @__PURE__ */ r("p", { className: "truncate font-normal text-base leading-tight text-primary", children: e }),
+  t && /* @__PURE__ */ r("p", { className: "truncate break-all text-xs text-tertiary", children: t }),
+  s && /* @__PURE__ */ r("p", { className: "line-clamp-3 text-base leading-relaxed text-secondary", children: s }),
+  i
 ] }), ee = ({
   children: e,
   className: t,
   ...s
-}) => /* @__PURE__ */ i(
+}) => /* @__PURE__ */ r(
   "blockquote",
   {
     className: c(

package/components/ai-elements/message.js

@@ -100,18 +100,18 @@ const S = i(
   "size-full text-base leading-relaxed text-foreground",
   "[&>*:first-child]:mt-0 [&>*:last-child]:mb-0",
   "[&_p]:my-2",
-  "[&_h1]:mt-4 [&_h1]:mb-2 [&_h1]:text-xl [&_h1]:font-bold [&_h1]:tracking-tight",
-  "[&_h2]:mt-4 [&_h2]:mb-2 [&_h2]:text-lg [&_h2]:font-bold [&_h2]:tracking-tight",
-  "[&_h3]:mt-3 [&_h3]:mb-1 [&_h3]:text-base [&_h3]:font-bold",
+  "[&_h1]:mt-4 [&_h1]:mb-2 [&_h1]:text-xl [&_h1]:font-semibold [&_h1]:tracking-tight",
+  "[&_h2]:mt-4 [&_h2]:mb-2 [&_h2]:text-lg [&_h2]:font-semibold [&_h2]:tracking-tight",
+  "[&_h3]:mt-3 [&_h3]:mb-1 [&_h3]:text-base [&_h3]:font-semibold",
   "[&_ul]:my-2 [&_ul]:list-disc [&_ul]:pl-5 [&_ol]:my-2 [&_ol]:list-decimal [&_ol]:pl-5 [&_li]:my-1",
-  "[&_a]:font-medium [&_a]:underline [&_a]:underline-offset-2",
+  "[&_a]:font-normal [&_a]:underline [&_a]:underline-offset-2",
   "[&_code]:rounded-xs [&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:text-xs [&_code]:tabular-nums",
   "[&_pre]:my-3 [&_pre]:overflow-x-auto [&_pre]:rounded-lg [&_pre]:bg-surface [&_pre]:p-3 [&_pre]:text-xs [&_pre_code]:bg-transparent [&_pre_code]:p-0",
   // Markdown tables only. Scoped off `[data-slot=table]` so a composed ADS
   // <Table> nested in a response keeps its own padding and per-column
   // alignment — unscoped, these descendant rules silently beat it.
   "[&_table:not([data-slot=table])]:my-3 [&_table:not([data-slot=table])]:w-full [&_table:not([data-slot=table])]:text-xs",
-  "[&_table:not([data-slot=table])_th]:px-2 [&_table:not([data-slot=table])_th]:py-1.5 [&_table:not([data-slot=table])_th]:text-left [&_table:not([data-slot=table])_th]:font-bold",
+  "[&_table:not([data-slot=table])_th]:px-2 [&_table:not([data-slot=table])_th]:py-1.5 [&_table:not([data-slot=table])_th]:text-left [&_table:not([data-slot=table])_th]:font-semibold",
   "[&_table:not([data-slot=table])_td]:px-2 [&_table:not([data-slot=table])_td]:py-1.5",
   "[&_table:not([data-slot=table])_thead]:text-secondary"
 ), W = o.memo(

package/components/ai-elements/queue.js

@@ -135,7 +135,7 @@ const y = ({ className: e, ...t }) => /* @__PURE__ */ s(
   {
     type: "button",
     className: a(
-      "group flex w-full items-center justify-between rounded-md bg-muted px-3 py-2 text-left font-medium text-base text-secondary transition-colors hover:bg-fill",
+      "group flex w-full items-center justify-between rounded-md bg-muted px-3 py-2 text-left font-normal text-base text-secondary transition-colors hover:bg-fill",
       t
     ),
     ...o,

package/components/ai-elements/research-activity.d.ts

@@ -20,6 +20,8 @@ export interface ResearchActivityProps extends Omit<React.HTMLAttributes<HTMLDiv
     stepIndex?: number;
     /** Total planned steps; the counter renders only when both are provided. */
     stepCount?: number;
+    /** Leading status/stage icon. Defaults to the compact thinking/completed squircle state. */
+    icon?: React.ReactNode;
     /** Replaces the generated completed summary. */
     summary?: React.ReactNode;
     /**