@actioneer/ads 0.5.1 → 0.5.3

package/components/ai-elements/research-activity.js

@@ -1,18 +1,18 @@
 "use client";
-import { jsxs as r, jsx as e, Fragment as P } from "react/jsx-runtime";
-import * as s from "react";
-import { MotionConfig as I, AnimatePresence as O, motion as ee } from "motion/react";
+import { jsxs as r, jsx as e, Fragment as F } from "react/jsx-runtime";
+import * as n from "react";
+import { MotionConfig as O, AnimatePresence as ee, motion as M } from "motion/react";
 import { cva as te } from "class-variance-authority";
-import { Collapsible as re, CollapsibleTrigger as M, CollapsibleContent as ae } from "../collapsible.js";
+import { Collapsible as re, CollapsibleTrigger as D, CollapsibleContent as ae } from "../collapsible.js";
 import { Spinner as T } from "../spinner.js";
-import { Sparkles as V, ChevronDown as B } from "../../lib/icons.js";
-import { EASE_OUT as D } from "../../lib/motion.js";
+import { Sparkles as U, ChevronDown as V } from "../../lib/icons.js";
+import { EASE_OUT as _, EASE_DISCLOSURE as ie } from "../../lib/motion.js";
 import { cn as l } from "../../lib/cn.js";
-import { Shimmer as F } from "./shimmer.js";
-const ie = te("w-full", {
+import { Shimmer as B } from "./shimmer.js";
+const ne = te("w-full", {
   variants: {
     status: {
-      active: "text-foreground",
+      active: "text-secondary",
       complete: "text-secondary"
     }
   }
@@ -26,54 +26,54 @@ const ie = te("w-full", {
     opacity: 1,
     transform: "translate3d(0, 0, 0)",
     filter: "blur(0px)",
-    transition: { duration: 0.18, ease: D }
+    transition: { duration: 0.18, ease: _ }
   },
   exit: {
     opacity: 0,
     transform: "translate3d(0, -7px, 0)",
     filter: "blur(2px)",
-    transition: { duration: 0.12, ease: D }
+    transition: { duration: 0.12, ease: _ }
   }
 };
-function K({
+function C({
   elapsed: t,
-  firstInsight: n,
-  sourceCount: d
+  firstInsight: s,
+  sourceCount: p
 }) {
   return /* @__PURE__ */ r("span", { className: "flex min-w-0 flex-wrap items-baseline gap-x-2 gap-y-1", children: [
     /* @__PURE__ */ r("span", { children: [
       "Researched ",
-      d,
+      p,
       " ",
-      d === 1 ? "source" : "sources"
+      p === 1 ? "source" : "sources"
     ] }),
     /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "text-tertiary", children: "·" }),
     /* @__PURE__ */ e("span", { className: "text-xs text-tertiary tabular-nums", children: t }),
-    n != null && /* @__PURE__ */ r(P, { children: [
+    s != null && /* @__PURE__ */ r(F, { children: [
       /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "text-tertiary", children: "·" }),
       /* @__PURE__ */ r("span", { className: "text-xs text-tertiary", children: [
         "first insight",
         " ",
-        /* @__PURE__ */ e("span", { className: "tabular-nums", children: n })
+        /* @__PURE__ */ e("span", { className: "tabular-nums", children: s })
       ] })
     ] })
   ] });
 }
-const ne = s.forwardRef(
+const oe = n.forwardRef(
   ({
     status: t,
-    elapsed: n,
-    sourceCount: d,
-    firstInsight: w,
-    sticky: p = !1,
-    collapsible: h = !0,
-    activityPlacement: U = "top",
+    elapsed: s,
+    sourceCount: p,
+    firstInsight: R,
+    sticky: h = !1,
+    collapsible: x = !0,
+    activityPlacement: K = "top",
     activity: c,
-    activityKey: _,
-    stepIndex: R,
+    activityKey: P,
+    stepIndex: w,
     stepCount: S,
-    summary: x,
-    open: k,
+    summary: v,
+    open: E,
     defaultOpen: $ = !1,
     onOpenChange: a,
     children: q,
@@ -83,31 +83,31 @@ const ne = s.forwardRef(
     "aria-busy": Q,
     ...W
   }, X) => {
-    const m = k !== void 0, i = c != null, [Y, y] = s.useState(
+    const d = E !== void 0, i = c != null, [Y, y] = n.useState(
       !i && t === "active" || $
-    ), z = s.useRef(t), N = s.useRef(!1), E = s.useRef(null), b = s.useRef(null), g = m ? k : Y, v = !i && t === "active" || g, f = U === "bottom" && v;
-    s.useLayoutEffect(() => {
+    ), k = n.useRef(t), b = n.useRef(!1), z = n.useRef(null), N = n.useRef(null), g = d ? E : Y, u = !i && t === "active" || g, f = K === "bottom" && u;
+    n.useLayoutEffect(() => {
       var L, j;
-      const u = z.current;
-      if (z.current = t, t === "active") {
-        u !== "active" && (N.current = !1), u !== "active" && !i && !m && y(!0);
+      const m = k.current;
+      if (k.current = t, t === "active") {
+        m !== "active" && (b.current = !1), m !== "active" && !i && !d && y(!0);
         return;
       }
-      if (u !== "active" || N.current && i) return;
+      if (m !== "active" || b.current && i) return;
       const A = document.activeElement;
-      A && ((L = E.current) != null && L.contains(A)) && ((j = b.current) == null || j.focus()), m || y(!1), a == null || a(!1);
-    }, [i, m, a, t]);
-    const Z = s.useCallback(
-      (u) => {
-        !i && t !== "complete" || (N.current = !0, m || y(u), a == null || a(u));
+      A && ((L = z.current) != null && L.contains(A)) && ((j = N.current) == null || j.focus()), d || y(!1), a == null || a(!1);
+    }, [i, d, a, t]);
+    const Z = n.useCallback(
+      (m) => {
+        !i && t !== "complete" || (b.current = !0, d || y(m), a == null || a(m));
       },
-      [i, m, a, t]
-    ), o = t === "active", C = o ? `activity-${_ ?? (typeof c == "string" ? c : "current")}` : "summary";
+      [i, d, a, t]
+    ), o = t === "active", I = o ? `activity-${P ?? (typeof c == "string" ? c : "current")}` : "summary";
     return /* @__PURE__ */ r(
       re,
       {
         ref: X,
-        open: v,
+        open: u,
         onOpenChange: Z,
         role: H ?? "region",
         "aria-label": J ?? "Research activity",
@@ -116,75 +116,75 @@ const ne = s.forwardRef(
         "data-slot": "research-activity",
         "data-status": t,
         className: l(
-          ie({ status: t }),
+          ne({ status: t }),
           f && "flex flex-col",
           G
         ),
         children: [
           /* @__PURE__ */ e("span", { className: "sr-only", "aria-live": "polite", "aria-atomic": "true", children: o ? "Research in progress" : "Research complete" }),
-          i ? /* @__PURE__ */ e(M, { asChild: !0, children: /* @__PURE__ */ r(
+          i ? /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ r(
             "button",
             {
-              ref: b,
+              ref: N,
               type: "button",
               "data-slot": "research-activity-trigger",
               className: l(
-                "group/research-trigger flex min-h-9 w-full cursor-pointer items-center gap-2.5 rounded-sm py-1 text-left text-sm outline-none",
-                "transition-[color,transform] duration-(--duration-fast) ease-out hover:text-primary active:scale-(--scale-press)",
+                "group/research-trigger flex min-h-9 w-full cursor-pointer items-center gap-2.5 rounded-sm py-1 text-left text-base outline-none",
+                "transition-colors duration-(--duration-fast) ease-out hover:text-primary",
                 "focus-visible:ring-3 focus-visible:ring-ring motion-reduce:transition-none",
-                p && "sticky z-10 bg-background",
-                p && (f ? "bottom-0" : "top-0"),
+                h && "sticky z-10 bg-background",
+                h && (f ? "bottom-0" : "top-0"),
                 f && "order-last mt-3"
               ),
               children: [
                 /* @__PURE__ */ r("span", { className: "sr-only", children: [
-                  v ? "Collapse" : "Expand",
+                  u ? "Collapse" : "Expand",
                   " research activity:",
                   " "
                 ] }),
-                /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "flex size-4 shrink-0 items-center justify-center", children: o ? /* @__PURE__ */ e(T, { size: "sm", color: "current", role: "presentation" }) : /* @__PURE__ */ e(V, { className: "size-4" }) }),
-                /* @__PURE__ */ e(I, { reducedMotion: "user", children: /* @__PURE__ */ e("span", { className: "relative h-5 min-w-0 flex-1 overflow-hidden", children: /* @__PURE__ */ e(O, { initial: !1, children: /* @__PURE__ */ e(
-                  ee.span,
+                /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "flex size-4 shrink-0 items-center justify-center", children: o ? /* @__PURE__ */ e(T, { size: "sm", color: "current", role: "presentation" }) : /* @__PURE__ */ e(U, { className: "size-4" }) }),
+                /* @__PURE__ */ e(O, { reducedMotion: "user", children: /* @__PURE__ */ e("span", { className: "relative h-5 min-w-0 flex-1 overflow-hidden", children: /* @__PURE__ */ e(ee, { initial: !1, children: /* @__PURE__ */ e(
+                  M.span,
                   {
                     variants: se,
                     initial: "initial",
                     animate: "animate",
                     exit: "exit",
                     className: "absolute inset-0 flex items-center truncate whitespace-nowrap",
-                    children: o ? typeof c == "string" ? /* @__PURE__ */ e(F, { as: "span", className: "truncate text-sm", children: c }) : c : x !== void 0 ? x : /* @__PURE__ */ e(
-                      K,
+                    children: o ? typeof c == "string" ? /* @__PURE__ */ e(B, { as: "span", className: "truncate text-base", children: c }) : c : v !== void 0 ? v : /* @__PURE__ */ e(
+                      C,
                       {
-                        elapsed: n,
-                        firstInsight: w,
-                        sourceCount: d
+                        elapsed: s,
+                        firstInsight: R,
+                        sourceCount: p
                       }
                     )
                   },
-                  C
+                  I
                 ) }) }) }),
                 o && /* @__PURE__ */ r("span", { className: l(
                   "shrink-0 text-xs text-tertiary tabular-nums",
                   // Reserve the caret slot (size-4 + gap-2) so trailing metadata
                   // keeps the same right edge as sibling rows that show a caret.
-                  !h && "pe-6"
+                  !x && "pe-6"
                 ), children: [
-                  R != null && S != null && /* @__PURE__ */ r(P, { children: [
+                  w != null && S != null && /* @__PURE__ */ r(F, { children: [
                     /* @__PURE__ */ e("span", { className: "sr-only", children: "Step " }),
-                    R,
+                    w,
                     " of ",
                     S,
                     /* @__PURE__ */ e("span", { "aria-hidden": !0, children: " · " })
                   ] }),
                   /* @__PURE__ */ e("span", { className: "sr-only", children: "Elapsed " }),
-                  n
+                  s
                 ] }),
-                h && /* @__PURE__ */ e(
-                  B,
+                x && /* @__PURE__ */ e(
+                  V,
                   {
                     "aria-hidden": !0,
                     className: l(
                       "size-4 shrink-0 text-tertiary transition-transform duration-(--duration-normal) ease-out motion-reduce:transition-none",
-                      v && "rotate-180"
+                      u && "rotate-180"
                     )
                   }
                 )
@@ -205,28 +205,28 @@ const ne = s.forwardRef(
                     "aria-hidden": !0
                   }
                 ),
-                /* @__PURE__ */ e(F, { as: "span", className: "text-sm", children: "Researching…" }),
+                /* @__PURE__ */ e(B, { as: "span", className: "text-base", children: "Researching…" }),
                 /* @__PURE__ */ r("span", { className: l(
                   "ml-auto shrink-0 text-xs text-tertiary tabular-nums",
-                  !h && "pe-6"
+                  !x && "pe-6"
                 ), children: [
                   /* @__PURE__ */ e("span", { className: "sr-only", children: "Elapsed " }),
-                  n
+                  s
                 ] })
               ]
             }
-          ) : /* @__PURE__ */ e(M, { asChild: !0, children: /* @__PURE__ */ r(
+          ) : /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ r(
             "button",
             {
-              ref: b,
+              ref: N,
               type: "button",
               "data-slot": "research-activity-trigger",
               className: l(
-                "group/research-trigger flex min-h-9 w-full cursor-pointer items-center gap-2 rounded-sm py-1 text-left text-sm outline-none",
-                "transition-[color,transform] duration-(--duration-fast) ease-out hover:text-primary active:scale-(--scale-press)",
+                "group/research-trigger flex min-h-9 w-full cursor-pointer items-center gap-2 rounded-sm py-1 text-left text-base outline-none",
+                "transition-colors duration-(--duration-fast) ease-out hover:text-primary",
                 "focus-visible:ring-3 focus-visible:ring-ring motion-reduce:transition-none",
-                p && "sticky z-10 bg-background",
-                p && (f ? "bottom-0" : "top-0"),
+                h && "sticky z-10 bg-background",
+                h && (f ? "bottom-0" : "top-0"),
                 f && "order-last mt-3"
               ),
               children: [
@@ -235,17 +235,17 @@ const ne = s.forwardRef(
                   " research activity:",
                   " "
                 ] }),
-                /* @__PURE__ */ e(V, { "aria-hidden": !0, className: "size-4 shrink-0" }),
-                /* @__PURE__ */ e("span", { className: "min-w-0 flex-1", children: x !== void 0 ? x : /* @__PURE__ */ e(
-                  K,
+                /* @__PURE__ */ e(U, { "aria-hidden": !0, className: "size-4 shrink-0" }),
+                /* @__PURE__ */ e("span", { className: "min-w-0 flex-1", children: v !== void 0 ? v : /* @__PURE__ */ e(
+                  C,
                   {
-                    elapsed: n,
-                    firstInsight: w,
-                    sourceCount: d
+                    elapsed: s,
+                    firstInsight: R,
+                    sourceCount: p
                   }
                 ) }),
-                h && /* @__PURE__ */ e(
-                  B,
+                x && /* @__PURE__ */ e(
+                  V,
                   {
                     "aria-hidden": !0,
                     className: l(
@@ -257,22 +257,27 @@ const ne = s.forwardRef(
               ]
             }
           ) }),
-          /* @__PURE__ */ e(
-            ae,
+          /* @__PURE__ */ e(ae, { forceMount: !0, asChild: !0, "data-slot": "research-activity-content", children: /* @__PURE__ */ e(
+            M.div,
             {
-              ref: E,
-              forceMount: !0,
-              "data-slot": "research-activity-content",
-              className: "mt-3 overflow-hidden text-foreground outline-none data-[state=closed]:hidden",
-              children: q
+              ref: z,
+              initial: !1,
+              animate: u ? "open" : "closed",
+              variants: {
+                open: { height: "auto", opacity: 1 },
+                closed: { height: 0, opacity: 0 }
+              },
+              transition: { duration: u ? 0.28 : 0.2, ease: ie },
+              className: "overflow-hidden text-secondary outline-none data-[state=closed]:pointer-events-none",
+              children: /* @__PURE__ */ e("div", { className: "ml-2 pt-3 [--tree-rail-lead:20px]", children: q })
             }
-          )
+          ) })
         ]
       }
     );
   }
 );
-ne.displayName = "ResearchActivity";
+oe.displayName = "ResearchActivity";
 export {
-  ne as ResearchActivity
+  oe as ResearchActivity
 };

package/components/ai-elements/task.js

@@ -3,7 +3,7 @@ import { jsx as e, jsxs as o } from "react/jsx-runtime";
 import { createContext as m, useContext as d } from "react";
 import { motion as u } from "motion/react";
 import { EASE_DISCLOSURE as p } from "../../lib/motion.js";
-import { Collapsible as h, CollapsibleContent as f, CollapsibleTrigger as x } from "../collapsible.js";
+import { Collapsible as h, CollapsibleContent as x, CollapsibleTrigger as f } from "../collapsible.js";
 import { Search as g, ChevronDown as N } from "../../lib/icons.js";
 import { cn as i } from "../../lib/cn.js";
 const l = m(!0), k = ({
@@ -24,7 +24,7 @@ const l = m(!0), k = ({
 k.displayName = "TaskItemFile";
 const v = ({ children: t, className: a, ...s }) => /* @__PURE__ */ e("div", { className: i("text-base text-secondary", a), ...s, children: t });
 v.displayName = "TaskItem";
-const T = ({
+const y = ({
   defaultOpen: t = !0,
   className: a,
   open: s,
@@ -40,15 +40,15 @@ const T = ({
     children: /* @__PURE__ */ e(l.Provider, { value: s ?? t, children: n })
   }
 );
-T.displayName = "Task";
-const y = ({
+y.displayName = "Task";
+const T = ({
   children: t,
   className: a,
   title: s,
   icon: n,
   endContent: r,
   ...c
-}) => /* @__PURE__ */ e(x, { asChild: !0, className: i("group", a), ...c, children: t ?? /* @__PURE__ */ o(
+}) => /* @__PURE__ */ e(f, { asChild: !0, className: i("group", a), ...c, children: t ?? /* @__PURE__ */ o(
   "button",
   {
     type: "button",
@@ -69,14 +69,14 @@ const y = ({
     ]
   }
 ) });
-y.displayName = "TaskTrigger";
+T.displayName = "TaskTrigger";
 const b = ({
   children: t,
   className: a,
   ...s
 }) => {
   const n = d(l);
-  return /* @__PURE__ */ e(f, { forceMount: !0, asChild: !0, ...s, children: /* @__PURE__ */ e(
+  return /* @__PURE__ */ e(x, { forceMount: !0, asChild: !0, ...s, children: /* @__PURE__ */ e(
     u.div,
     {
       initial: !1,
@@ -87,19 +87,19 @@ const b = ({
       },
       transition: { duration: n ? 0.28 : 0.2, ease: p },
       className: i(
-        "overflow-hidden text-foreground outline-none",
+        "overflow-hidden text-secondary outline-none",
         "data-[state=closed]:pointer-events-none",
         a
       ),
-      children: /* @__PURE__ */ e("div", { className: "mt-2 ml-2", children: t })
+      children: /* @__PURE__ */ e("div", { className: "mt-2 ml-2 [--tree-rail-lead:9px]", children: t })
     }
   ) });
 };
 b.displayName = "TaskContent";
 export {
-  T as Task,
+  y as Task,
   b as TaskContent,
   v as TaskItem,
   k as TaskItemFile,
-  y as TaskTrigger
+  T as TaskTrigger
 };

package/components/ai-elements/tool.js

@@ -1,33 +1,33 @@
 "use client";
 import { jsx as o, jsxs as l } from "react/jsx-runtime";
-import { isValidElement as c } from "react";
+import { isValidElement as d } from "react";
 import { Collapsible as u, CollapsibleTrigger as m, CollapsibleContent as p } from "../collapsible.js";
 import { Badge as f } from "../badge.js";
-import { Wrench as g, ChevronDown as h, CloseCircle as x, CheckCircle as b, Clock as N, CircleDashed as v } from "../../lib/icons.js";
-import { cn as n } from "../../lib/cn.js";
-const w = ({ className: e, ...t }) => /* @__PURE__ */ o(
+import { Wrench as h, ChevronDown as x, CloseCircle as g, CheckCircle as b, Clock as N, CircleDashed as y } from "../../lib/icons.js";
+import { cn as r } from "../../lib/cn.js";
+const v = ({ className: e, ...t }) => /* @__PURE__ */ o(
   u,
   {
-    className: n(
+    className: r(
       "not-prose group/tool w-full overflow-hidden rounded-xl bg-card",
       e
     ),
     ...t
   }
 );
-w.displayName = "Tool";
-const y = {
-  "input-streaming": { label: "Pending", color: "default", icon: v },
+v.displayName = "Tool";
+const w = {
+  "input-streaming": { label: "Pending", color: "default", icon: y },
   "input-available": { label: "Running", color: "info", icon: N, pulse: !0 },
   "output-available": { label: "Completed", color: "success", icon: b },
-  "output-error": { label: "Error", color: "danger", icon: x }
+  "output-error": { label: "Error", color: "danger", icon: g }
 }, C = ({ state: e }) => {
-  const { label: t, color: r, icon: a, pulse: i } = y[e];
-  return /* @__PURE__ */ l(f, { variant: "soft", color: r, children: [
+  const { label: t, color: n, icon: a, pulse: i } = w[e];
+  return /* @__PURE__ */ l(f, { variant: "soft", color: n, children: [
     /* @__PURE__ */ o(
       a,
       {
-        className: n(
+        className: r(
           "size-3",
           i && "animate-pulse motion-reduce:animate-none"
         ),
@@ -43,13 +43,13 @@ function T(e) {
 const S = ({
   className: e,
   title: t,
-  type: r,
+  type: n,
   state: a,
   ...i
 }) => /* @__PURE__ */ l(
   m,
   {
-    className: n(
+    className: r(
       "group/tool-header flex w-full items-center justify-between gap-4 py-3 text-left transition-colors hover:text-primary motion-reduce:transition-none",
       "outline-none focus-visible:ring-3 focus-visible:ring-ring",
       e
@@ -57,12 +57,12 @@ const S = ({
     ...i,
     children: [
       /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ o(g, { className: "size-4 shrink-0 text-tertiary", "aria-hidden": !0 }),
-        /* @__PURE__ */ o("span", { className: "font-medium text-base", children: t ?? T(r) }),
+        /* @__PURE__ */ o(h, { className: "size-4 shrink-0 text-tertiary", "aria-hidden": !0 }),
+        /* @__PURE__ */ o("span", { className: "font-medium text-base", children: t ?? T(n) }),
         /* @__PURE__ */ o(C, { state: a })
       ] }),
       /* @__PURE__ */ o(
-        h,
+        x,
         {
           className: "size-4 shrink-0 text-tertiary transition-transform duration-(--duration-fast) ease-out group-data-[state=open]/tool-header:rotate-180 motion-reduce:transition-none",
           "aria-hidden": !0
@@ -75,8 +75,8 @@ S.displayName = "ToolHeader";
 const j = ({ className: e, ...t }) => /* @__PURE__ */ o(
   p,
   {
-    className: n(
-      "overflow-hidden text-foreground outline-none",
+    className: r(
+      "overflow-hidden text-secondary outline-none",
       "data-[state=closed]:pointer-events-none",
       e
     ),
@@ -90,29 +90,29 @@ const s = ({
 }) => /* @__PURE__ */ o(
   "pre",
   {
-    className: n(
-      "overflow-x-auto rounded-md bg-surface p-3 text-xs leading-relaxed text-foreground tabular-nums",
+    className: r(
+      "overflow-x-auto rounded-md bg-surface p-3 text-xs leading-relaxed text-secondary tabular-nums",
       t
     ),
     children: /* @__PURE__ */ o("code", { children: e })
   }
-), d = ({ children: e }) => /* @__PURE__ */ o("h4", { className: "text-xs font-medium uppercase tracking-wide text-tertiary", children: e }), k = ({ className: e, input: t, ...r }) => /* @__PURE__ */ l("div", { className: n("space-y-2 overflow-hidden p-4", e), ...r, children: [
-  /* @__PURE__ */ o(d, { children: "Parameters" }),
+), c = ({ children: e }) => /* @__PURE__ */ o("h4", { className: "text-xs font-medium uppercase tracking-wide text-tertiary", children: e }), k = ({ className: e, input: t, ...n }) => /* @__PURE__ */ l("div", { className: r("space-y-2 overflow-hidden p-4", e), ...n, children: [
+  /* @__PURE__ */ o(c, { children: "Parameters" }),
   /* @__PURE__ */ o(s, { code: JSON.stringify(t, null, 2) })
 ] });
 k.displayName = "ToolInput";
-const O = (e) => typeof e == "object" && e !== null && !c(e) ? /* @__PURE__ */ o(s, { code: JSON.stringify(e, null, 2) }) : typeof e == "string" ? /* @__PURE__ */ o("div", { className: "rounded-md bg-surface p-3 text-xs leading-relaxed text-foreground whitespace-pre-wrap", children: e }) : e, P = ({
+const O = (e) => typeof e == "object" && e !== null && !d(e) ? /* @__PURE__ */ o(s, { code: JSON.stringify(e, null, 2) }) : typeof e == "string" ? /* @__PURE__ */ o("div", { className: "rounded-md bg-surface p-3 text-xs leading-relaxed text-secondary whitespace-pre-wrap", children: e }) : e, P = ({
   className: e,
   output: t,
-  errorText: r,
+  errorText: n,
   ...a
-}) => t || r ? /* @__PURE__ */ l("div", { className: n("space-y-2 p-4", e), ...a, children: [
-  /* @__PURE__ */ o(d, { children: r ? "Error" : "Result" }),
-  r ? /* @__PURE__ */ o("div", { className: "rounded-md bg-danger-50 p-3 text-xs leading-relaxed text-danger-700 whitespace-pre-wrap", children: r }) : /* @__PURE__ */ o("div", { className: "overflow-x-auto text-xs text-foreground [&_table]:w-full", children: O(t) })
+}) => t || n ? /* @__PURE__ */ l("div", { className: r("space-y-2 p-4", e), ...a, children: [
+  /* @__PURE__ */ o(c, { children: n ? "Error" : "Result" }),
+  n ? /* @__PURE__ */ o("div", { className: "rounded-md bg-danger-50 p-3 text-xs leading-relaxed text-danger-700 whitespace-pre-wrap", children: n }) : /* @__PURE__ */ o("div", { className: "overflow-x-auto text-xs text-secondary [&_table]:w-full", children: O(t) })
 ] }) : null;
 P.displayName = "ToolOutput";
 export {
-  w as Tool,
+  v as Tool,
   j as ToolContent,
   S as ToolHeader,
   k as ToolInput,

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

@@ -0,0 +1,37 @@
+import * as React from "react";
+/**
+ * Transcript — the ADS conversation-transcript element (ported from the voice
+ * product's call panel). A props-driven turn list for reviewing a finished
+ * agent↔user exchange: agent turns sit left on a whisper fill, user turns sit
+ * right on a muted fill, each headed by an uppercase role label and an
+ * optional time.
+ *
+ * Sentiment scanning: pass `tone` on a user turn ("positive" | "negative")
+ * to tint that bubble with the semantic success/danger fill and prefix the
+ * role label with a square `rounded-dot` marker — reviewers jump straight to
+ * the reactions that mattered. The component renders tones; the CALLER owns
+ * the analysis (lexicon, model, or human tags). Agent turns stay neutral:
+ * the agent reads a script, so only the user's reaction carries signal.
+ *
+ * No runtime dependency — compose it under any transport, and place it as a
+ * SIBLING of `MessageResponse`, never inside it (prose wrapper clobbers
+ * composed components).
+ */
+export type TranscriptTone = "positive" | "negative" | "neutral";
+export interface TranscriptTurn {
+    id: string;
+    role: "agent" | "user";
+    text: string;
+    /** Short time label shown beside the role, e.g. "0:12". */
+    timeLabel?: string;
+    /** Sentiment tint — meaningful on user turns; ignored for agents. */
+    tone?: TranscriptTone;
+}
+export interface TranscriptProps extends React.HTMLAttributes<HTMLDivElement> {
+    turns: TranscriptTurn[];
+    /** Role heading overrides (defaults: Agent / User). */
+    agentLabel?: string;
+    userLabel?: string;
+    emptyMessage?: string;
+}
+export declare function Transcript({ turns, agentLabel, userLabel, emptyMessage, className, ...props }: TranscriptProps): React.JSX.Element;

package/components/ai-elements/transcript.js

@@ -0,0 +1,46 @@
+"use client";
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import { cn as t } from "../../lib/cn.js";
+function g({
+  turns: i,
+  agentLabel: c = "Agent",
+  userLabel: o = "User",
+  emptyMessage: m = "No transcript captured yet.",
+  className: n,
+  ...d
+}) {
+  return i.length === 0 ? /* @__PURE__ */ e("p", { className: t("text-sm text-muted-foreground", n), "data-slot": "transcript", ...d, children: m }) : /* @__PURE__ */ e("div", { className: t("space-y-3", n), "data-slot": "transcript", ...d, children: i.map((s) => {
+    const r = s.role === "user", a = r ? s.tone ?? "neutral" : "neutral";
+    return /* @__PURE__ */ e("div", { className: t("flex w-full", r ? "justify-end" : "justify-start"), children: /* @__PURE__ */ l(
+      "div",
+      {
+        className: t(
+          "max-w-[84%] rounded-lg px-3 py-2.5",
+          r ? "bg-muted" : "bg-muted/25",
+          a === "positive" && "bg-success-100/70",
+          a === "negative" && "bg-danger-100/70"
+        ),
+        children: [
+          /* @__PURE__ */ l("div", { className: t("mb-1 flex items-center gap-3", r && "justify-end"), children: [
+            a !== "neutral" && /* @__PURE__ */ e(
+              "span",
+              {
+                "aria-label": a === "positive" ? "Positive response" : "Negative response",
+                className: t(
+                  "size-1.5 rounded-dot",
+                  a === "positive" ? "bg-success-600" : "bg-danger-600"
+                )
+              }
+            ),
+            /* @__PURE__ */ e("p", { className: "text-xs font-medium uppercase text-muted-foreground", children: r ? o : c }),
+            s.timeLabel && /* @__PURE__ */ e("p", { className: "text-xs text-muted-foreground", children: s.timeLabel })
+          ] }),
+          /* @__PURE__ */ e("p", { className: t("whitespace-pre-wrap break-words text-sm leading-relaxed", r && "text-right"), children: s.text })
+        ]
+      }
+    ) }, s.id);
+  }) });
+}
+export {
+  g as Transcript
+};