@actioneer/ads 0.5.3 → 0.5.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (95) hide show
  1. package/components/accordion.js +15 -15
  2. package/components/agent-icon.d.ts +64 -0
  3. package/components/agent-icon.js +251 -0
  4. package/components/ai-elements/agent-trace.d.ts +8 -1
  5. package/components/ai-elements/agent-trace.js +164 -129
  6. package/components/ai-elements/chain-of-thought-icon.d.ts +42 -0
  7. package/components/ai-elements/chain-of-thought-icon.js +283 -0
  8. package/components/ai-elements/chain-of-thought.js +7 -7
  9. package/components/ai-elements/chart.js +38 -35
  10. package/components/ai-elements/index.d.ts +1 -0
  11. package/components/ai-elements/inline-citation.js +40 -40
  12. package/components/ai-elements/message.js +5 -5
  13. package/components/ai-elements/queue.js +1 -1
  14. package/components/ai-elements/research-activity.d.ts +2 -0
  15. package/components/ai-elements/research-activity.js +79 -81
  16. package/components/ai-elements/task-progress.js +2 -2
  17. package/components/ai-elements/tool.d.ts +4 -2
  18. package/components/ai-elements/tool.js +74 -54
  19. package/components/ai-elements/transcript.js +1 -1
  20. package/components/alert.js +1 -1
  21. package/components/answer.d.ts +2643 -311
  22. package/components/answer.js +1836 -425
  23. package/components/assistant-ui/answer-tool-ui.js +23 -28
  24. package/components/assistant-ui/chain-of-thought.d.ts +7 -2
  25. package/components/assistant-ui/composer-harness.js +20 -16
  26. package/components/assistant-ui/reasoning.js +35 -31
  27. package/components/assistant-ui/tool-fallback.js +125 -122
  28. package/components/assistant-ui/tool-group.d.ts +3 -1
  29. package/components/assistant-ui/tool-group.js +48 -43
  30. package/components/audio-waveform.js +14 -14
  31. package/components/autocomplete.js +52 -48
  32. package/components/avatar.js +58 -44
  33. package/components/badge.js +3 -3
  34. package/components/brand-texture.js +1 -1
  35. package/components/breadcrumbs.d.ts +27 -1
  36. package/components/breadcrumbs.js +94 -42
  37. package/components/button.js +15 -15
  38. package/components/carousel.js +10 -10
  39. package/components/chart.d.ts +14 -0
  40. package/components/chart.js +747 -614
  41. package/components/chip.js +3 -3
  42. package/components/code-block.d.ts +39 -17
  43. package/components/code-block.js +153 -104
  44. package/components/command-palette.js +27 -25
  45. package/components/connector-card.js +2 -2
  46. package/components/dropdown.js +65 -61
  47. package/components/empty-state.js +15 -15
  48. package/components/field.js +23 -23
  49. package/components/index.d.ts +5 -0
  50. package/components/index.js +523 -470
  51. package/components/infinite-canvas.js +60 -60
  52. package/components/kbd.js +6 -6
  53. package/components/link.js +6 -6
  54. package/components/modal.js +22 -20
  55. package/components/page-header.js +1 -1
  56. package/components/pagination.js +22 -22
  57. package/components/pixel-blast-svg.js +1 -1
  58. package/components/pixel-icon.d.ts +31 -0
  59. package/components/pixel-icon.js +733 -0
  60. package/components/popover.js +46 -42
  61. package/components/ripple.d.ts +29 -0
  62. package/components/ripple.js +17 -0
  63. package/components/segmented.js +24 -23
  64. package/components/select.js +71 -67
  65. package/components/selection-action-bar.js +22 -22
  66. package/components/sidebar.d.ts +11 -3
  67. package/components/sidebar.js +161 -148
  68. package/components/stepper.d.ts +2 -0
  69. package/components/stepper.js +80 -43
  70. package/components/table.d.ts +7 -0
  71. package/components/table.js +223 -155
  72. package/components/tabs.d.ts +3 -1
  73. package/components/tabs.js +165 -144
  74. package/components/textarea.js +10 -8
  75. package/components/toast.js +48 -46
  76. package/components/tooltip.js +61 -59
  77. package/components/tree.js +44 -41
  78. package/components/typography.d.ts +1 -1
  79. package/components/typography.js +25 -25
  80. package/components/viz-charts.d.ts +62 -0
  81. package/components/viz-charts.js +408 -0
  82. package/fonts/aribau-grotesk-500.otf +0 -0
  83. package/fonts/aribau-grotesk-600.woff2 +0 -0
  84. package/fonts.css +6 -4
  85. package/lib/icons.d.ts +411 -402
  86. package/lib/icons.js +109 -107
  87. package/lib/viz-format.d.ts +25 -0
  88. package/lib/viz-format.js +40 -0
  89. package/llms.txt +111 -8
  90. package/manifest.json +1096 -58
  91. package/package.json +5 -5
  92. package/styles.css +226 -96
  93. package/theme.css +220 -92
  94. package/fonts/aribau-grotesk-400.otf +0 -0
  95. package/fonts/aribau-grotesk-700.otf +0 -0
@@ -1,22 +1,27 @@
1
1
  "use client";
2
- import { jsxs as r, jsx as e, Fragment as F } from "react/jsx-runtime";
2
+ import { jsxs as r, jsx as e, Fragment as I } from "react/jsx-runtime";
3
3
  import * as n from "react";
4
- import { MotionConfig as O, AnimatePresence as ee, motion as M } from "motion/react";
5
- import { cva as te } from "class-variance-authority";
6
- import { Collapsible as re, CollapsibleTrigger as D, CollapsibleContent as ae } from "../collapsible.js";
7
- import { Spinner as T } from "../spinner.js";
8
- import { Sparkles as U, ChevronDown as V } from "../../lib/icons.js";
9
- import { EASE_OUT as _, EASE_DISCLOSURE as ie } from "../../lib/motion.js";
4
+ import { MotionConfig as ee, AnimatePresence as te, motion as D } from "motion/react";
5
+ import { cva as re } from "class-variance-authority";
6
+ import { Collapsible as ae, CollapsibleTrigger as U, CollapsibleContent as ie } from "../collapsible.js";
7
+ import { ChevronDown as V } from "../../lib/icons.js";
8
+ import { EASE_OUT as _, EASE_DISCLOSURE as ne } from "../../lib/motion.js";
10
9
  import { cn as l } from "../../lib/cn.js";
11
10
  import { Shimmer as B } from "./shimmer.js";
12
- const ne = te("w-full", {
13
- variants: {
14
- status: {
15
- active: "text-secondary",
16
- complete: "text-secondary"
11
+ import { TraceStateIcon as C } from "./chain-of-thought-icon.js";
12
+ const se = re(
13
+ // Contained card: a hairline border (no fill) so the whole trace reads as one
14
+ // distinct, trackable block within the chat without tinting the ground.
15
+ "w-full rounded-lg border border-border px-3 py-2",
16
+ {
17
+ variants: {
18
+ status: {
19
+ active: "text-secondary",
20
+ complete: "text-secondary"
21
+ }
17
22
  }
18
23
  }
19
- }), se = {
24
+ ), oe = {
20
25
  initial: {
21
26
  opacity: 0,
22
27
  transform: "translate3d(0, 7px, 0)",
@@ -35,21 +40,21 @@ const ne = te("w-full", {
35
40
  transition: { duration: 0.12, ease: _ }
36
41
  }
37
42
  };
38
- function C({
43
+ function F({
39
44
  elapsed: t,
40
45
  firstInsight: s,
41
- sourceCount: p
46
+ sourceCount: f
42
47
  }) {
43
48
  return /* @__PURE__ */ r("span", { className: "flex min-w-0 flex-wrap items-baseline gap-x-2 gap-y-1", children: [
44
49
  /* @__PURE__ */ r("span", { children: [
45
50
  "Researched ",
46
- p,
51
+ f,
47
52
  " ",
48
- p === 1 ? "source" : "sources"
53
+ f === 1 ? "source" : "sources"
49
54
  ] }),
50
55
  /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "text-tertiary", children: "·" }),
51
56
  /* @__PURE__ */ e("span", { className: "text-xs text-tertiary tabular-nums", children: t }),
52
- s != null && /* @__PURE__ */ r(F, { children: [
57
+ s != null && /* @__PURE__ */ r(I, { children: [
53
58
  /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "text-tertiary", children: "·" }),
54
59
  /* @__PURE__ */ r("span", { className: "text-xs text-tertiary", children: [
55
60
  "first insight",
@@ -59,21 +64,22 @@ function C({
59
64
  ] })
60
65
  ] });
61
66
  }
62
- const oe = n.forwardRef(
67
+ const le = n.forwardRef(
63
68
  ({
64
69
  status: t,
65
70
  elapsed: s,
66
- sourceCount: p,
67
- firstInsight: R,
71
+ sourceCount: f,
72
+ firstInsight: E,
68
73
  sticky: h = !1,
69
74
  collapsible: x = !0,
70
75
  activityPlacement: K = "top",
71
76
  activity: c,
72
77
  activityKey: P,
73
- stepIndex: w,
74
- stepCount: S,
75
- summary: v,
76
- open: E,
78
+ stepIndex: S,
79
+ stepCount: k,
80
+ icon: v,
81
+ summary: y,
82
+ open: A,
77
83
  defaultOpen: $ = !1,
78
84
  onOpenChange: a,
79
85
  children: q,
@@ -83,28 +89,28 @@ const oe = n.forwardRef(
83
89
  "aria-busy": Q,
84
90
  ...W
85
91
  }, X) => {
86
- const d = E !== void 0, i = c != null, [Y, y] = n.useState(
92
+ const d = A !== void 0, i = c != null, [Y, b] = n.useState(
87
93
  !i && t === "active" || $
88
- ), 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;
94
+ ), z = n.useRef(t), N = n.useRef(!1), j = n.useRef(null), g = n.useRef(null), R = d ? A : Y, u = !i && t === "active" || R, p = K === "bottom" && u;
89
95
  n.useLayoutEffect(() => {
90
- var L, j;
91
- const m = k.current;
92
- if (k.current = t, t === "active") {
93
- m !== "active" && (b.current = !1), m !== "active" && !i && !d && y(!0);
96
+ var M, T;
97
+ const m = z.current;
98
+ if (z.current = t, t === "active") {
99
+ m !== "active" && (N.current = !1), m !== "active" && !i && !d && b(!0);
94
100
  return;
95
101
  }
96
- if (m !== "active" || b.current && i) return;
97
- const A = document.activeElement;
98
- A && ((L = z.current) != null && L.contains(A)) && ((j = N.current) == null || j.focus()), d || y(!1), a == null || a(!1);
102
+ if (m !== "active" || N.current && i) return;
103
+ const L = document.activeElement;
104
+ L && ((M = j.current) != null && M.contains(L)) && ((T = g.current) == null || T.focus()), d || b(!1), a == null || a(!1);
99
105
  }, [i, d, a, t]);
100
106
  const Z = n.useCallback(
101
107
  (m) => {
102
- !i && t !== "complete" || (b.current = !0, d || y(m), a == null || a(m));
108
+ !i && t !== "complete" || (N.current = !0, d || b(m), a == null || a(m));
103
109
  },
104
110
  [i, d, a, t]
105
- ), o = t === "active", I = o ? `activity-${P ?? (typeof c == "string" ? c : "current")}` : "summary";
111
+ ), o = t === "active", w = o ? /* @__PURE__ */ e(C, { stage: "thinking", status: "active" }) : /* @__PURE__ */ e(C, { outcome: "completed" }), O = o ? `activity-${P ?? (typeof c == "string" ? c : "current")}` : "summary";
106
112
  return /* @__PURE__ */ r(
107
- re,
113
+ ae,
108
114
  {
109
115
  ref: X,
110
116
  open: u,
@@ -116,16 +122,16 @@ const oe = n.forwardRef(
116
122
  "data-slot": "research-activity",
117
123
  "data-status": t,
118
124
  className: l(
119
- ne({ status: t }),
120
- f && "flex flex-col",
125
+ se({ status: t }),
126
+ p && "flex flex-col",
121
127
  G
122
128
  ),
123
129
  children: [
124
130
  /* @__PURE__ */ e("span", { className: "sr-only", "aria-live": "polite", "aria-atomic": "true", children: o ? "Research in progress" : "Research complete" }),
125
- i ? /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ r(
131
+ i ? /* @__PURE__ */ e(U, { asChild: !0, children: /* @__PURE__ */ r(
126
132
  "button",
127
133
  {
128
- ref: N,
134
+ ref: g,
129
135
  type: "button",
130
136
  "data-slot": "research-activity-trigger",
131
137
  className: l(
@@ -133,8 +139,8 @@ const oe = n.forwardRef(
133
139
  "transition-colors duration-(--duration-fast) ease-out hover:text-primary",
134
140
  "focus-visible:ring-3 focus-visible:ring-ring motion-reduce:transition-none",
135
141
  h && "sticky z-10 bg-background",
136
- h && (f ? "bottom-0" : "top-0"),
137
- f && "order-last mt-3"
142
+ h && (p ? "bottom-0" : "top-0"),
143
+ p && "order-last mt-3"
138
144
  ),
139
145
  children: [
140
146
  /* @__PURE__ */ r("span", { className: "sr-only", children: [
@@ -142,25 +148,25 @@ const oe = n.forwardRef(
142
148
  " research activity:",
143
149
  " "
144
150
  ] }),
145
- /* @__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" }) }),
146
- /* @__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(
147
- M.span,
151
+ /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "flex size-4 shrink-0 items-center justify-center", children: v ?? w }),
152
+ /* @__PURE__ */ e(ee, { reducedMotion: "user", children: /* @__PURE__ */ e("span", { className: "relative h-5 min-w-0 flex-1 overflow-hidden", children: /* @__PURE__ */ e(te, { initial: !1, children: /* @__PURE__ */ e(
153
+ D.span,
148
154
  {
149
- variants: se,
155
+ variants: oe,
150
156
  initial: "initial",
151
157
  animate: "animate",
152
158
  exit: "exit",
153
159
  className: "absolute inset-0 flex items-center truncate whitespace-nowrap",
154
- children: o ? typeof c == "string" ? /* @__PURE__ */ e(B, { as: "span", className: "truncate text-base", children: c }) : c : v !== void 0 ? v : /* @__PURE__ */ e(
155
- C,
160
+ children: o ? typeof c == "string" ? /* @__PURE__ */ e(B, { as: "span", className: "truncate text-base", children: c }) : c : y !== void 0 ? y : /* @__PURE__ */ e(
161
+ F,
156
162
  {
157
163
  elapsed: s,
158
- firstInsight: R,
159
- sourceCount: p
164
+ firstInsight: E,
165
+ sourceCount: f
160
166
  }
161
167
  )
162
168
  },
163
- I
169
+ O
164
170
  ) }) }) }),
165
171
  o && /* @__PURE__ */ r("span", { className: l(
166
172
  "shrink-0 text-xs text-tertiary tabular-nums",
@@ -168,11 +174,11 @@ const oe = n.forwardRef(
168
174
  // keeps the same right edge as sibling rows that show a caret.
169
175
  !x && "pe-6"
170
176
  ), children: [
171
- w != null && S != null && /* @__PURE__ */ r(F, { children: [
177
+ S != null && k != null && /* @__PURE__ */ r(I, { children: [
172
178
  /* @__PURE__ */ e("span", { className: "sr-only", children: "Step " }),
173
- w,
174
- " of ",
175
179
  S,
180
+ " of ",
181
+ k,
176
182
  /* @__PURE__ */ e("span", { "aria-hidden": !0, children: " · " })
177
183
  ] }),
178
184
  /* @__PURE__ */ e("span", { className: "sr-only", children: "Elapsed " }),
@@ -196,15 +202,7 @@ const oe = n.forwardRef(
196
202
  "data-slot": "research-activity-header",
197
203
  className: "flex min-h-9 w-full items-center gap-2.5 py-1 text-left",
198
204
  children: [
199
- /* @__PURE__ */ e(
200
- T,
201
- {
202
- size: "sm",
203
- color: "current",
204
- role: "presentation",
205
- "aria-hidden": !0
206
- }
207
- ),
205
+ /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "flex size-4 shrink-0 items-center justify-center", children: v ?? w }),
208
206
  /* @__PURE__ */ e(B, { as: "span", className: "text-base", children: "Researching…" }),
209
207
  /* @__PURE__ */ r("span", { className: l(
210
208
  "ml-auto shrink-0 text-xs text-tertiary tabular-nums",
@@ -215,10 +213,10 @@ const oe = n.forwardRef(
215
213
  ] })
216
214
  ]
217
215
  }
218
- ) : /* @__PURE__ */ e(D, { asChild: !0, children: /* @__PURE__ */ r(
216
+ ) : /* @__PURE__ */ e(U, { asChild: !0, children: /* @__PURE__ */ r(
219
217
  "button",
220
218
  {
221
- ref: N,
219
+ ref: g,
222
220
  type: "button",
223
221
  "data-slot": "research-activity-trigger",
224
222
  className: l(
@@ -226,22 +224,22 @@ const oe = n.forwardRef(
226
224
  "transition-colors duration-(--duration-fast) ease-out hover:text-primary",
227
225
  "focus-visible:ring-3 focus-visible:ring-ring motion-reduce:transition-none",
228
226
  h && "sticky z-10 bg-background",
229
- h && (f ? "bottom-0" : "top-0"),
230
- f && "order-last mt-3"
227
+ h && (p ? "bottom-0" : "top-0"),
228
+ p && "order-last mt-3"
231
229
  ),
232
230
  children: [
233
231
  /* @__PURE__ */ r("span", { className: "sr-only", children: [
234
- g ? "Collapse" : "Expand",
232
+ R ? "Collapse" : "Expand",
235
233
  " research activity:",
236
234
  " "
237
235
  ] }),
238
- /* @__PURE__ */ e(U, { "aria-hidden": !0, className: "size-4 shrink-0" }),
239
- /* @__PURE__ */ e("span", { className: "min-w-0 flex-1", children: v !== void 0 ? v : /* @__PURE__ */ e(
240
- C,
236
+ /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "flex size-4 shrink-0 items-center justify-center", children: v ?? w }),
237
+ /* @__PURE__ */ e("span", { className: "min-w-0 flex-1", children: y !== void 0 ? y : /* @__PURE__ */ e(
238
+ F,
241
239
  {
242
240
  elapsed: s,
243
- firstInsight: R,
244
- sourceCount: p
241
+ firstInsight: E,
242
+ sourceCount: f
245
243
  }
246
244
  ) }),
247
245
  x && /* @__PURE__ */ e(
@@ -250,24 +248,24 @@ const oe = n.forwardRef(
250
248
  "aria-hidden": !0,
251
249
  className: l(
252
250
  "size-4 shrink-0 text-tertiary transition-transform duration-(--duration-normal) ease-out motion-reduce:transition-none",
253
- g && "rotate-180"
251
+ R && "rotate-180"
254
252
  )
255
253
  }
256
254
  )
257
255
  ]
258
256
  }
259
257
  ) }),
260
- /* @__PURE__ */ e(ae, { forceMount: !0, asChild: !0, "data-slot": "research-activity-content", children: /* @__PURE__ */ e(
261
- M.div,
258
+ /* @__PURE__ */ e(ie, { forceMount: !0, asChild: !0, "data-slot": "research-activity-content", children: /* @__PURE__ */ e(
259
+ D.div,
262
260
  {
263
- ref: z,
261
+ ref: j,
264
262
  initial: !1,
265
263
  animate: u ? "open" : "closed",
266
264
  variants: {
267
265
  open: { height: "auto", opacity: 1 },
268
266
  closed: { height: 0, opacity: 0 }
269
267
  },
270
- transition: { duration: u ? 0.28 : 0.2, ease: ie },
268
+ transition: { duration: u ? 0.28 : 0.2, ease: ne },
271
269
  className: "overflow-hidden text-secondary outline-none data-[state=closed]:pointer-events-none",
272
270
  children: /* @__PURE__ */ e("div", { className: "ml-2 pt-3 [--tree-rail-lead:20px]", children: q })
273
271
  }
@@ -277,7 +275,7 @@ const oe = n.forwardRef(
277
275
  );
278
276
  }
279
277
  );
280
- oe.displayName = "ResearchActivity";
278
+ le.displayName = "ResearchActivity";
281
279
  export {
282
- oe as ResearchActivity
280
+ le as ResearchActivity
283
281
  };
@@ -145,7 +145,7 @@ const O = i.forwardRef(
145
145
  "transition-[color,transform] duration-(--duration-fast) ease-out active:scale-(--scale-press) motion-reduce:transition-none"
146
146
  ),
147
147
  children: [
148
- m ? /* @__PURE__ */ t("span", { className: "min-w-0 flex-1 truncate text-base font-bold text-secondary", children: c }) : /* @__PURE__ */ n(q, { children: [
148
+ m ? /* @__PURE__ */ t("span", { className: "min-w-0 flex-1 truncate text-base font-semibold text-secondary", children: c }) : /* @__PURE__ */ n(q, { children: [
149
149
  /* @__PURE__ */ t(y, { status: (s == null ? void 0 : s.status) ?? "pending" }),
150
150
  /* @__PURE__ */ t("span", { className: "min-w-0 flex-1 truncate text-base text-primary", children: _ ?? (s == null ? void 0 : s.label) ?? P }),
151
151
  (s == null ? void 0 : s.status) === "active" && /* @__PURE__ */ t(N, { elapsed: s.elapsed })
@@ -154,7 +154,7 @@ const O = i.forwardRef(
154
154
  "span",
155
155
  {
156
156
  "aria-hidden": !0,
157
- className: "shrink-0 text-xs font-bold text-tertiary tabular-nums",
157
+ className: "shrink-0 text-xs font-semibold text-tertiary tabular-nums",
158
158
  children: [
159
159
  x,
160
160
  " / ",
@@ -1,4 +1,4 @@
1
- import { ComponentProps } from 'react';
1
+ import { ComponentProps, ReactNode } from 'react';
2
2
  import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../collapsible';
3
3
  /**
4
4
  * Tool — a collapsible record of a single tool call: its name, a status badge,
@@ -24,10 +24,12 @@ export type ToolHeaderProps = {
24
24
  title?: string;
25
25
  type: string;
26
26
  state: ToolState;
27
+ /** Optional override for the inferred 9-squircle tool-stage icon. */
28
+ icon?: ReactNode;
27
29
  className?: string;
28
30
  } & Omit<ComponentProps<typeof CollapsibleTrigger>, "type">;
29
31
  export declare const ToolHeader: {
30
- ({ className, title, type, state, ...props }: ToolHeaderProps): import("react").JSX.Element;
32
+ ({ className, title, type, state, icon, ...props }: ToolHeaderProps): import("react").JSX.Element;
31
33
  displayName: string;
32
34
  };
33
35
  export type ToolContentProps = ComponentProps<typeof CollapsibleContent>;
@@ -1,30 +1,31 @@
1
1
  "use client";
2
- import { jsx as o, jsxs as l } from "react/jsx-runtime";
3
- import { isValidElement as d } from "react";
4
- import { Collapsible as u, CollapsibleTrigger as m, CollapsibleContent as p } from "../collapsible.js";
5
- import { Badge as f } from "../badge.js";
6
- import { Wrench as h, ChevronDown as x, CloseCircle as g, CheckCircle as b, Clock as N, CircleDashed as y } from "../../lib/icons.js";
2
+ import { jsx as t, jsxs as l } from "react/jsx-runtime";
3
+ import { isValidElement as m } from "react";
4
+ import { Collapsible as p, CollapsibleTrigger as f, CollapsibleContent as h } from "../collapsible.js";
5
+ import { Badge as x } from "../badge.js";
6
+ import { ChevronDown as g, CloseCircle as b, CheckCircle as N, Clock as v, CircleDashed as y } from "../../lib/icons.js";
7
7
  import { cn as r } from "../../lib/cn.js";
8
- const v = ({ className: e, ...t }) => /* @__PURE__ */ o(
9
- u,
8
+ import { TraceStateIcon as w } from "./chain-of-thought-icon.js";
9
+ const C = ({ className: e, ...o }) => /* @__PURE__ */ t(
10
+ p,
10
11
  {
11
12
  className: r(
12
13
  "not-prose group/tool w-full overflow-hidden rounded-xl bg-card",
13
14
  e
14
15
  ),
15
- ...t
16
+ ...o
16
17
  }
17
18
  );
18
- v.displayName = "Tool";
19
- const w = {
19
+ C.displayName = "Tool";
20
+ const T = {
20
21
  "input-streaming": { label: "Pending", color: "default", icon: y },
21
- "input-available": { label: "Running", color: "info", icon: N, pulse: !0 },
22
- "output-available": { label: "Completed", color: "success", icon: b },
23
- "output-error": { label: "Error", color: "danger", icon: g }
24
- }, C = ({ state: e }) => {
25
- const { label: t, color: n, icon: a, pulse: i } = w[e];
26
- return /* @__PURE__ */ l(f, { variant: "soft", color: n, children: [
27
- /* @__PURE__ */ o(
22
+ "input-available": { label: "Running", color: "info", icon: v, pulse: !0 },
23
+ "output-available": { label: "Completed", color: "success", icon: N },
24
+ "output-error": { label: "Error", color: "danger", icon: b }
25
+ }, S = ({ state: e }) => {
26
+ const { label: o, color: n, icon: a, pulse: i } = T[e];
27
+ return /* @__PURE__ */ l(x, { variant: "soft", color: n, children: [
28
+ /* @__PURE__ */ t(
28
29
  a,
29
30
  {
30
31
  className: r(
@@ -34,35 +35,54 @@ const w = {
34
35
  "aria-hidden": !0
35
36
  }
36
37
  ),
37
- t
38
+ o
38
39
  ] });
39
40
  };
40
- function T(e) {
41
+ function s(e) {
41
42
  return e.split("-").slice(1).join("-") || e;
42
43
  }
43
- const S = ({
44
+ const O = {
45
+ "input-streaming": "pending",
46
+ "input-available": "active",
47
+ "output-available": "complete",
48
+ "output-error": "error"
49
+ }, j = ({
44
50
  className: e,
45
- title: t,
51
+ title: o,
46
52
  type: n,
47
53
  state: a,
48
- ...i
54
+ icon: i,
55
+ ...u
49
56
  }) => /* @__PURE__ */ l(
50
- m,
57
+ f,
51
58
  {
52
59
  className: r(
53
60
  "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",
54
61
  "outline-none focus-visible:ring-3 focus-visible:ring-ring",
55
62
  e
56
63
  ),
57
- ...i,
64
+ ...u,
58
65
  children: [
59
66
  /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
60
- /* @__PURE__ */ o(h, { className: "size-4 shrink-0 text-tertiary", "aria-hidden": !0 }),
61
- /* @__PURE__ */ o("span", { className: "font-medium text-base", children: t ?? T(n) }),
62
- /* @__PURE__ */ o(C, { state: a })
67
+ /* @__PURE__ */ t(
68
+ "span",
69
+ {
70
+ className: "flex size-4 shrink-0 items-center justify-center text-tertiary",
71
+ "aria-hidden": !0,
72
+ children: i ?? /* @__PURE__ */ t(
73
+ w,
74
+ {
75
+ toolName: s(n),
76
+ status: O[a]
77
+ }
78
+ )
79
+ }
80
+ ),
81
+ /* @__PURE__ */ t("span", { className: "font-normal text-base", children: o ?? s(n) }),
82
+ /* @__PURE__ */ t(S, { state: a })
63
83
  ] }),
64
- /* @__PURE__ */ o(
65
- x,
84
+ /* @__PURE__ */ t(
85
+ g,
66
86
  {
67
87
  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",
68
88
  "aria-hidden": !0
@@ -71,50 +91,50 @@ const S = ({
71
91
  ]
72
92
  }
73
93
  );
74
- S.displayName = "ToolHeader";
75
- const j = ({ className: e, ...t }) => /* @__PURE__ */ o(
76
- p,
94
+ j.displayName = "ToolHeader";
95
+ const k = ({ className: e, ...o }) => /* @__PURE__ */ t(
96
+ h,
77
97
  {
78
98
  className: r(
79
99
  "overflow-hidden text-secondary outline-none",
80
100
  "data-[state=closed]:pointer-events-none",
81
101
  e
82
102
  ),
83
- ...t
103
+ ...o
84
104
  }
85
105
  );
86
- j.displayName = "ToolContent";
87
- const s = ({
106
+ k.displayName = "ToolContent";
107
+ const c = ({
88
108
  code: e,
89
- className: t
90
- }) => /* @__PURE__ */ o(
109
+ className: o
110
+ }) => /* @__PURE__ */ t(
91
111
  "pre",
92
112
  {
93
113
  className: r(
94
114
  "overflow-x-auto rounded-md bg-surface p-3 text-xs leading-relaxed text-secondary tabular-nums",
95
- t
115
+ o
96
116
  ),
97
- children: /* @__PURE__ */ o("code", { children: e })
117
+ children: /* @__PURE__ */ t("code", { children: e })
98
118
  }
99
- ), 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: [
100
- /* @__PURE__ */ o(c, { children: "Parameters" }),
101
- /* @__PURE__ */ o(s, { code: JSON.stringify(t, null, 2) })
119
+ ), d = ({ children: e }) => /* @__PURE__ */ t("h4", { className: "text-xs font-normal uppercase tracking-wide text-tertiary", children: e }), I = ({ className: e, input: o, ...n }) => /* @__PURE__ */ l("div", { className: r("space-y-2 overflow-hidden p-4", e), ...n, children: [
120
+ /* @__PURE__ */ t(d, { children: "Parameters" }),
121
+ /* @__PURE__ */ t(c, { code: JSON.stringify(o, null, 2) })
102
122
  ] });
103
- k.displayName = "ToolInput";
104
- 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 = ({
123
+ I.displayName = "ToolInput";
124
+ const P = (e) => typeof e == "object" && e !== null && !m(e) ? /* @__PURE__ */ t(c, { code: JSON.stringify(e, null, 2) }) : typeof e == "string" ? /* @__PURE__ */ t("div", { className: "rounded-md bg-surface p-3 text-xs leading-relaxed text-secondary whitespace-pre-wrap", children: e }) : e, z = ({
105
125
  className: e,
106
- output: t,
126
+ output: o,
107
127
  errorText: n,
108
128
  ...a
109
- }) => t || n ? /* @__PURE__ */ l("div", { className: r("space-y-2 p-4", e), ...a, children: [
110
- /* @__PURE__ */ o(c, { children: n ? "Error" : "Result" }),
111
- 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) })
129
+ }) => o || n ? /* @__PURE__ */ l("div", { className: r("space-y-2 p-4", e), ...a, children: [
130
+ /* @__PURE__ */ t(d, { children: n ? "Error" : "Result" }),
131
+ n ? /* @__PURE__ */ t("div", { className: "rounded-md bg-danger-50 p-3 text-xs leading-relaxed text-danger-700 whitespace-pre-wrap", children: n }) : /* @__PURE__ */ t("div", { className: "overflow-x-auto text-xs text-secondary [&_table]:w-full", children: P(o) })
112
132
  ] }) : null;
113
- P.displayName = "ToolOutput";
133
+ z.displayName = "ToolOutput";
114
134
  export {
115
- v as Tool,
116
- j as ToolContent,
117
- S as ToolHeader,
118
- k as ToolInput,
119
- P as ToolOutput
135
+ C as Tool,
136
+ k as ToolContent,
137
+ j as ToolHeader,
138
+ I as ToolInput,
139
+ z as ToolOutput
120
140
  };
@@ -32,7 +32,7 @@ function g({
32
32
  )
33
33
  }
34
34
  ),
35
- /* @__PURE__ */ e("p", { className: "text-xs font-medium uppercase text-muted-foreground", children: r ? o : c }),
35
+ /* @__PURE__ */ e("p", { className: "text-xs font-normal uppercase text-muted-foreground", children: r ? o : c }),
36
36
  s.timeLabel && /* @__PURE__ */ e("p", { className: "text-xs text-muted-foreground", children: s.timeLabel })
37
37
  ] }),
38
38
  /* @__PURE__ */ e("p", { className: t("whitespace-pre-wrap break-words text-sm leading-relaxed", r && "text-right"), children: s.text })
@@ -62,7 +62,7 @@ const b = i.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e(
62
62
  "p",
63
63
  {
64
64
  ref: a,
65
- className: n("text-xs font-medium leading-6 text-(--alert-accent)", t),
65
+ className: n("text-xs font-normal leading-6 text-(--alert-accent)", t),
66
66
  ...r
67
67
  }
68
68
  ));