@tangle-network/ui 11.10.0 → 11.11.1
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.
- package/CHANGELOG.md +14 -0
- package/README.md +4 -1
- package/dist/active-sessions-store-Gt1R0rFG.js +262 -0
- package/dist/{active-sessions-store-CeOmXgv5.d.ts → active-sessions-store-nl70ZnMC.d.ts} +40 -41
- package/dist/artifact-pane-BL_DFWNl.d.ts +32 -0
- package/dist/artifact-pane-DMXT9a8U.js +70 -0
- package/dist/auth-DOETfnd9.js +154 -0
- package/dist/auth.d.ts +2 -74
- package/dist/auth.js +2 -16
- package/dist/branding-26d5ARIr.d.ts +14 -0
- package/dist/button-C87nEe2R.js +78 -0
- package/dist/button-yoIv77e2.d.ts +16 -0
- package/dist/chat-D4jAfEmj.js +667 -0
- package/dist/chat.d.ts +2 -201
- package/dist/chat.js +2 -31
- package/dist/code-block-B36KVUSN.js +165 -0
- package/dist/code-block-B9miUPht.d.ts +23 -0
- package/dist/diff-preview-BcK3nRXb.js +533 -0
- package/dist/document-editor-pane-BcoABlhn.d.ts +131 -0
- package/dist/document-editor-pane-BxlPjaTP.js +1287 -0
- package/dist/dropdown-menu-BpcLa5vF.js +101 -0
- package/dist/editor.d.ts +76 -78
- package/dist/editor.js +2 -34
- package/dist/file-format-BgXbr-Ib.js +160 -0
- package/dist/files-Bug33qCl.js +743 -0
- package/dist/files.d.ts +2 -243
- package/dist/files.js +3 -41
- package/dist/focus-BcE_SHqz.js +57 -0
- package/dist/format-DfcLWqMa.js +54 -0
- package/dist/hooks.d.ts +30 -37
- package/dist/hooks.js +111 -46
- package/dist/index-2UntyjBb.d.ts +52 -0
- package/dist/index-BgUHilZm.d.ts +108 -0
- package/dist/index-COgqsFAQ.d.ts +42 -0
- package/dist/index-CPDET_s1.d.ts +549 -0
- package/dist/index-CUhfHT_V.d.ts +204 -0
- package/dist/index-Cg6gYAqh.d.ts +73 -0
- package/dist/index-Cq-EJzqW.d.ts +16 -0
- package/dist/index-DhYmSaLF.d.ts +245 -0
- package/dist/index-DjKxO357.d.ts +128 -0
- package/dist/index.d.ts +26 -43
- package/dist/index.js +35 -472
- package/dist/markdown-BGqicV82.js +45 -0
- package/dist/markdown.d.ts +3 -18
- package/dist/markdown.js +3 -15
- package/dist/message-vhUI0c5G.d.ts +16 -0
- package/dist/nav.d.ts +6 -8
- package/dist/nav.js +29 -11
- package/dist/openui-artifact-renderer-D3E5bIAI.d.ts +114 -0
- package/dist/openui-artifact-renderer-DrU1AdVk.js +266 -0
- package/dist/openui.d.ts +2 -115
- package/dist/openui.js +2 -13
- package/dist/parts-5mhy9yJ3.d.ts +37 -0
- package/dist/primitives-Cb8GGVKr.js +1239 -0
- package/dist/primitives.d.ts +5 -525
- package/dist/primitives.js +9 -212
- package/dist/redaction-CGGB2ENG.js +74 -0
- package/dist/redaction.d.ts +2 -42
- package/dist/redaction.js +2 -7
- package/dist/run-OyWmIDqu.d.ts +41 -0
- package/dist/run-ZsIKPA6J.js +17 -0
- package/dist/run-group-BACLbCFl.js +410 -0
- package/dist/run.d.ts +3 -126
- package/dist/run.js +5 -40
- package/dist/sdk-hooks.d.ts +2 -285
- package/dist/sdk-hooks.js +3 -36
- package/dist/stores.d.ts +13 -14
- package/dist/stores.js +34 -76
- package/dist/table-Bss73DhB.js +146 -0
- package/dist/tabs-BVHR6NkO.js +40 -0
- package/dist/text-shimmer-BUUo6I-g.js +64 -0
- package/dist/tool-call-feed-BeB1_4pX.d.ts +47 -0
- package/dist/tool-call-feed-Djt2q11V.js +109 -0
- package/dist/tool-call-step-DNebqhmX.js +434 -0
- package/dist/tool-display-BAuAVa43.js +158 -0
- package/dist/{tool-display-z4JcDmMQ.d.ts → tool-display-DgmL5rIU.d.ts} +16 -16
- package/dist/tool-previews.d.ts +2 -48
- package/dist/tool-previews.js +2 -23
- package/dist/types.d.ts +6 -19
- package/dist/types.js +0 -1
- package/dist/use-auto-scroll-C5Pjeqon.js +153 -0
- package/dist/use-sse-stream-BVgO1QBN.js +884 -0
- package/dist/use-sse-stream-Dm6R5YWz.d.ts +282 -0
- package/dist/utils-Bl_CZ0Qp.js +37 -0
- package/dist/{chunk-RQHJBTEU.js → utils-C_uf36nf.js} +4 -6
- package/dist/utils.d.ts +2 -104
- package/dist/utils.js +6 -44
- package/package.json +39 -41
- package/src/lib/focus.ts +2 -1
- package/dist/artifact-pane-DpuWcAiF.d.ts +0 -33
- package/dist/button-CMQuQEW_.d.ts +0 -17
- package/dist/chunk-34A66VBG.js +0 -214
- package/dist/chunk-3OI2QKFD.js +0 -0
- package/dist/chunk-3XXBZL53.js +0 -174
- package/dist/chunk-42PAH5D2.js +0 -112
- package/dist/chunk-4CLN43XT.js +0 -45
- package/dist/chunk-55WHV7SS.js +0 -1604
- package/dist/chunk-565EATZZ.js +0 -156
- package/dist/chunk-5Z5ZYMOJ.js +0 -0
- package/dist/chunk-6BGQA4BQ.js +0 -0
- package/dist/chunk-BEBXZPHW.js +0 -299
- package/dist/chunk-C5WF4WMV.js +0 -734
- package/dist/chunk-HFL6R6IF.js +0 -37
- package/dist/chunk-HGML45QH.js +0 -104
- package/dist/chunk-HMAPIH7L.js +0 -595
- package/dist/chunk-K5XFRUS4.js +0 -1401
- package/dist/chunk-KFQGHD73.js +0 -198
- package/dist/chunk-L57WRIND.js +0 -59
- package/dist/chunk-LTEKI7YJ.js +0 -59
- package/dist/chunk-M3QZK62R.js +0 -233
- package/dist/chunk-ND3ZFXQK.js +0 -179
- package/dist/chunk-OEX7NZE3.js +0 -321
- package/dist/chunk-OL5GYLHV.js +0 -60
- package/dist/chunk-QGFYBNSO.js +0 -133
- package/dist/chunk-R7B3UWPF.js +0 -550
- package/dist/chunk-R7SUY4E3.js +0 -65
- package/dist/chunk-REJESC5U.js +0 -117
- package/dist/chunk-RQGKSCEZ.js +0 -0
- package/dist/chunk-SNLR2AEA.js +0 -40
- package/dist/chunk-WKWBTL2V.js +0 -15
- package/dist/chunk-X7CU776B.js +0 -1048
- package/dist/chunk-XU3HB5QL.js +0 -127
- package/dist/chunk-YTO5V6QS.js +0 -19
- package/dist/chunk-YU4E5J2N.js +0 -437
- package/dist/chunk-YZ6AK25N.js +0 -886
- package/dist/code-block-0kSpWMnf.d.ts +0 -25
- package/dist/document-editor-pane-IAEQn_Dl.d.ts +0 -128
- package/dist/document-editor-pane-QHDOBA43.js +0 -13
- package/dist/message-BHWbxBtT.d.ts +0 -15
- package/dist/parts-dj7AcUg0.d.ts +0 -36
- package/dist/run-PfLmDAox.d.ts +0 -41
- package/dist/tool-call-feed-D9iofJgW.d.ts +0 -46
|
@@ -0,0 +1,410 @@
|
|
|
1
|
+
import { t as cn } from "./utils-C_uf36nf.js";
|
|
2
|
+
import { t as TextShimmer } from "./text-shimmer-BUUo6I-g.js";
|
|
3
|
+
import { i as truncateText, n as formatDuration } from "./format-DfcLWqMa.js";
|
|
4
|
+
import { i as RunRowShell, r as InlineToolItem, s as ExpandableContent } from "./tool-call-step-DNebqhmX.js";
|
|
5
|
+
import { t as Markdown } from "./markdown-BGqicV82.js";
|
|
6
|
+
import { t as OpenUIArtifactRenderer } from "./openui-artifact-renderer-DrU1AdVk.js";
|
|
7
|
+
import { memo, useEffect, useMemo, useRef, useState } from "react";
|
|
8
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
|
+
import { Bot, Brain, ChevronDown, ChevronRight, ClipboardList, FileEdit, FileSearch, Globe, Loader2, PencilLine, Search, Settings, Sparkles, Terminal } from "lucide-react";
|
|
10
|
+
import * as Collapsible from "@radix-ui/react-collapsible";
|
|
11
|
+
//#region src/run/inline-thinking-item.tsx
|
|
12
|
+
const InlineThinkingItem = memo(({ part, defaultOpen = false, autoCollapse = true, className, contentClassName }) => {
|
|
13
|
+
const [open, setOpen] = useState(defaultOpen);
|
|
14
|
+
const autoCollapsedRef = useRef(false);
|
|
15
|
+
const startTime = part.time?.start;
|
|
16
|
+
const endTime = part.time?.end;
|
|
17
|
+
const durationMs = startTime != null && endTime != null ? endTime - startTime : void 0;
|
|
18
|
+
const isActive = startTime != null && endTime == null;
|
|
19
|
+
const preview = part.text ? truncateText(part.text, 120) : void 0;
|
|
20
|
+
useEffect(() => {
|
|
21
|
+
if (isActive) {
|
|
22
|
+
autoCollapsedRef.current = false;
|
|
23
|
+
setOpen(true);
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
if (autoCollapse && !autoCollapsedRef.current && durationMs != null) {
|
|
27
|
+
const timer = window.setTimeout(() => {
|
|
28
|
+
setOpen(false);
|
|
29
|
+
autoCollapsedRef.current = true;
|
|
30
|
+
}, 900);
|
|
31
|
+
return () => window.clearTimeout(timer);
|
|
32
|
+
}
|
|
33
|
+
}, [
|
|
34
|
+
autoCollapse,
|
|
35
|
+
durationMs,
|
|
36
|
+
isActive
|
|
37
|
+
]);
|
|
38
|
+
return /* @__PURE__ */ jsx(RunRowShell, {
|
|
39
|
+
icon: /* @__PURE__ */ jsx(Brain, { className: "h-3.5 w-3.5" }),
|
|
40
|
+
title: isActive ? /* @__PURE__ */ jsx(TextShimmer, { children: "Thinking…" }) : "Reasoning",
|
|
41
|
+
description: preview,
|
|
42
|
+
status: isActive ? "running" : "idle",
|
|
43
|
+
durationMs,
|
|
44
|
+
open,
|
|
45
|
+
onOpenChange: setOpen,
|
|
46
|
+
className,
|
|
47
|
+
children: part.text ? /* @__PURE__ */ jsx(ExpandableContent, {
|
|
48
|
+
fadeClassName: "from-[var(--md3-surface-container)]",
|
|
49
|
+
className: contentClassName ? `px-3 py-3 ${contentClassName}` : "px-3 py-3",
|
|
50
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
51
|
+
className: "text-sm leading-relaxed text-foreground",
|
|
52
|
+
children: /* @__PURE__ */ jsx(Markdown, { children: part.text })
|
|
53
|
+
})
|
|
54
|
+
}) : /* @__PURE__ */ jsx("div", {
|
|
55
|
+
className: "px-3 py-2.5 text-xs text-muted-foreground",
|
|
56
|
+
children: "No reasoning text provided."
|
|
57
|
+
})
|
|
58
|
+
});
|
|
59
|
+
});
|
|
60
|
+
InlineThinkingItem.displayName = "InlineThinkingItem";
|
|
61
|
+
//#endregion
|
|
62
|
+
//#region src/run/run-group.tsx
|
|
63
|
+
/**
|
|
64
|
+
* One row on the run's timeline spine: a connector line + accent dot in a
|
|
65
|
+
* narrow gutter, content to the right, so a run reads as separated, distinct
|
|
66
|
+
* steps — not one filled box. The dot's top offset centers it on a 30px run
|
|
67
|
+
* row header (RunRowShell: 22px glyph slot + 4px inset each side).
|
|
68
|
+
*/
|
|
69
|
+
function SpineRow({ accentClassName, isLast, children }) {
|
|
70
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
71
|
+
className: "grid grid-cols-[1.25rem_minmax(0,1fr)] gap-x-3",
|
|
72
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
73
|
+
className: "relative flex justify-center",
|
|
74
|
+
children: [!isLast && /* @__PURE__ */ jsx("span", { className: "absolute top-3.5 bottom-[-0.75rem] left-1/2 w-px -translate-x-1/2 bg-[var(--border-subtle)]" }), /* @__PURE__ */ jsx("span", { className: cn("relative mt-2.5 h-[var(--timeline-dot-size,0.5rem)] w-[var(--timeline-dot-size,0.5rem)] rounded-full ring-4 ring-[var(--bg-root)]", accentClassName) })]
|
|
75
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
76
|
+
className: "min-w-0 pb-3",
|
|
77
|
+
children
|
|
78
|
+
})]
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
const DEFAULT_BRANDING = {
|
|
82
|
+
label: "Agent",
|
|
83
|
+
accentClass: "text-primary",
|
|
84
|
+
bgClass: "bg-[var(--accent-surface-soft)]",
|
|
85
|
+
containerBgClass: "bg-muted",
|
|
86
|
+
borderClass: "border-border",
|
|
87
|
+
iconClass: "",
|
|
88
|
+
textClass: "text-primary"
|
|
89
|
+
};
|
|
90
|
+
const ASSISTANT_SHELL = "min-w-0 flex-1 space-y-3 rounded-[26px] border border-[var(--border-subtle)] bg-[color:color-mix(in_srgb,var(--bg-card)_94%,transparent)] px-5 py-4 shadow-[0_1px_2px_rgba(15,23,42,0.04)]";
|
|
91
|
+
function AssistantShell({ branding, isStreaming, children }) {
|
|
92
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
93
|
+
className: "flex flex-col gap-1",
|
|
94
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
95
|
+
className: "flex items-center gap-2 px-1 font-medium text-muted-foreground text-xs",
|
|
96
|
+
children: [/* @__PURE__ */ jsx("span", { children: branding.label }), isStreaming ? /* @__PURE__ */ jsxs("span", {
|
|
97
|
+
className: "inline-flex items-center gap-1.5",
|
|
98
|
+
children: [/* @__PURE__ */ jsx(Loader2, { className: "h-3 w-3 animate-spin" }), "Thinking"]
|
|
99
|
+
}) : null]
|
|
100
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
101
|
+
className: ASSISTANT_SHELL,
|
|
102
|
+
children
|
|
103
|
+
})]
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
const CATEGORY_ICON_MAP = {
|
|
107
|
+
command: Terminal,
|
|
108
|
+
write: FileEdit,
|
|
109
|
+
read: FileSearch,
|
|
110
|
+
search: Search,
|
|
111
|
+
edit: PencilLine,
|
|
112
|
+
task: Bot,
|
|
113
|
+
web: Globe,
|
|
114
|
+
todo: ClipboardList,
|
|
115
|
+
other: Settings
|
|
116
|
+
};
|
|
117
|
+
const CATEGORY_ORDER = [
|
|
118
|
+
"command",
|
|
119
|
+
"write",
|
|
120
|
+
"edit",
|
|
121
|
+
"read",
|
|
122
|
+
"search",
|
|
123
|
+
"web",
|
|
124
|
+
"task",
|
|
125
|
+
"todo",
|
|
126
|
+
"other"
|
|
127
|
+
];
|
|
128
|
+
const OPENUI_NODE_TYPES = /* @__PURE__ */ new Set([
|
|
129
|
+
"heading",
|
|
130
|
+
"text",
|
|
131
|
+
"badge",
|
|
132
|
+
"stat",
|
|
133
|
+
"key_value",
|
|
134
|
+
"code",
|
|
135
|
+
"markdown",
|
|
136
|
+
"table",
|
|
137
|
+
"actions",
|
|
138
|
+
"separator",
|
|
139
|
+
"stack",
|
|
140
|
+
"grid",
|
|
141
|
+
"card"
|
|
142
|
+
]);
|
|
143
|
+
function isOpenUINode(value) {
|
|
144
|
+
return typeof value === "object" && value !== null && "type" in value && typeof value.type === "string" && OPENUI_NODE_TYPES.has(value.type);
|
|
145
|
+
}
|
|
146
|
+
function extractOpenUISchema(output) {
|
|
147
|
+
if (output == null) return null;
|
|
148
|
+
if (isOpenUINode(output)) return [output];
|
|
149
|
+
if (Array.isArray(output) && output.length > 0 && output.every(isOpenUINode)) return output;
|
|
150
|
+
if (typeof output === "object" && !Array.isArray(output)) {
|
|
151
|
+
const obj = output;
|
|
152
|
+
for (const key of [
|
|
153
|
+
"openui",
|
|
154
|
+
"schema",
|
|
155
|
+
"ui"
|
|
156
|
+
]) {
|
|
157
|
+
if (obj[key] == null) continue;
|
|
158
|
+
const inner = obj[key];
|
|
159
|
+
if (typeof inner === "string") try {
|
|
160
|
+
return extractOpenUISchema(JSON.parse(inner));
|
|
161
|
+
} catch {
|
|
162
|
+
continue;
|
|
163
|
+
}
|
|
164
|
+
const nested = extractOpenUISchema(inner);
|
|
165
|
+
if (nested) return nested;
|
|
166
|
+
}
|
|
167
|
+
}
|
|
168
|
+
if (typeof output === "string") try {
|
|
169
|
+
return extractOpenUISchema(JSON.parse(output));
|
|
170
|
+
} catch {
|
|
171
|
+
return null;
|
|
172
|
+
}
|
|
173
|
+
return null;
|
|
174
|
+
}
|
|
175
|
+
function getOpenUISummary(output) {
|
|
176
|
+
if (!output || typeof output !== "object" || Array.isArray(output)) return null;
|
|
177
|
+
const summary = output.summary;
|
|
178
|
+
return typeof summary === "string" && summary.trim() ? summary.trim() : null;
|
|
179
|
+
}
|
|
180
|
+
function isOpenUITool(part) {
|
|
181
|
+
return part.tool.toLowerCase().replace(/^tool:/, "").includes("openui");
|
|
182
|
+
}
|
|
183
|
+
function CategoryBadges({ categories }) {
|
|
184
|
+
const sorted = useMemo(() => CATEGORY_ORDER.filter((category) => categories.has(category)), [categories]);
|
|
185
|
+
if (sorted.length === 0) return null;
|
|
186
|
+
return /* @__PURE__ */ jsx("div", {
|
|
187
|
+
className: "flex items-center gap-1",
|
|
188
|
+
children: sorted.map((cat) => {
|
|
189
|
+
const Icon = CATEGORY_ICON_MAP[cat] ?? Settings;
|
|
190
|
+
return /* @__PURE__ */ jsx("span", {
|
|
191
|
+
title: cat,
|
|
192
|
+
className: "flex h-5 w-5 items-center justify-center rounded border border-border text-muted-foreground",
|
|
193
|
+
children: /* @__PURE__ */ jsx(Icon, { className: "h-3 w-3" })
|
|
194
|
+
}, cat);
|
|
195
|
+
})
|
|
196
|
+
});
|
|
197
|
+
}
|
|
198
|
+
function renderSummary(run) {
|
|
199
|
+
const parts = [];
|
|
200
|
+
if (run.stats.toolCount > 0) parts.push(`${run.stats.toolCount} tool${run.stats.toolCount === 1 ? "" : "s"}`);
|
|
201
|
+
if (run.stats.textPartCount > 0) parts.push(`${run.stats.textPartCount} response${run.stats.textPartCount === 1 ? "" : "s"}`);
|
|
202
|
+
if (run.stats.thinkingDurationMs > 0) parts.push(`${formatDuration(run.stats.thinkingDurationMs)} thinking`);
|
|
203
|
+
return parts.join(", ");
|
|
204
|
+
}
|
|
205
|
+
/**
|
|
206
|
+
* Collapsible container for a consecutive group of assistant messages (a "run").
|
|
207
|
+
* Shows a summary header with stats and renders tool/thinking/text parts.
|
|
208
|
+
*/
|
|
209
|
+
const RunGroup = memo(({ run, partMap, collapsed, onToggle, branding = DEFAULT_BRANDING, renderToolDetail, headerActions, renderToolActions }) => {
|
|
210
|
+
const allParts = useMemo(() => {
|
|
211
|
+
const parts = [];
|
|
212
|
+
for (const msg of run.messages) (partMap[msg.id] ?? []).forEach((part, index) => {
|
|
213
|
+
parts.push({
|
|
214
|
+
part,
|
|
215
|
+
msgId: msg.id,
|
|
216
|
+
index
|
|
217
|
+
});
|
|
218
|
+
});
|
|
219
|
+
return parts;
|
|
220
|
+
}, [run.messages, partMap]);
|
|
221
|
+
const { stats, isStreaming } = run;
|
|
222
|
+
if (!allParts.some(({ part }) => {
|
|
223
|
+
if (part.type === "tool" || part.type === "reasoning") return true;
|
|
224
|
+
return part.type === "text" && !part.synthetic && part.text.trim().length > 0;
|
|
225
|
+
})) {
|
|
226
|
+
if (!isStreaming) return null;
|
|
227
|
+
return /* @__PURE__ */ jsx(AssistantShell, {
|
|
228
|
+
branding,
|
|
229
|
+
isStreaming: true,
|
|
230
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
231
|
+
className: "flex items-center gap-2 px-0.5 py-0.5 text-sm text-[var(--text-muted)]",
|
|
232
|
+
children: /* @__PURE__ */ jsxs("span", {
|
|
233
|
+
className: "flex gap-[5px]",
|
|
234
|
+
children: [
|
|
235
|
+
/* @__PURE__ */ jsx("span", {
|
|
236
|
+
className: "h-2 w-2 animate-bounce rounded-full bg-[var(--brand-glow)]",
|
|
237
|
+
style: { animationDelay: "0ms" }
|
|
238
|
+
}),
|
|
239
|
+
/* @__PURE__ */ jsx("span", {
|
|
240
|
+
className: "h-2 w-2 animate-bounce rounded-full bg-[var(--brand-glow)]",
|
|
241
|
+
style: { animationDelay: "150ms" }
|
|
242
|
+
}),
|
|
243
|
+
/* @__PURE__ */ jsx("span", {
|
|
244
|
+
className: "h-2 w-2 animate-bounce rounded-full bg-[var(--brand-glow)]",
|
|
245
|
+
style: { animationDelay: "300ms" }
|
|
246
|
+
})
|
|
247
|
+
]
|
|
248
|
+
})
|
|
249
|
+
})
|
|
250
|
+
});
|
|
251
|
+
}
|
|
252
|
+
if (!allParts.some(({ part }) => {
|
|
253
|
+
if (part.type === "reasoning") return true;
|
|
254
|
+
if (part.type === "tool") return !isOpenUITool(part);
|
|
255
|
+
return false;
|
|
256
|
+
})) return /* @__PURE__ */ jsx(AssistantShell, {
|
|
257
|
+
branding,
|
|
258
|
+
isStreaming,
|
|
259
|
+
children: allParts.map(({ part, msgId, index }) => {
|
|
260
|
+
const key = `${msgId}-${index}`;
|
|
261
|
+
if (part.type === "tool" && isOpenUITool(part)) {
|
|
262
|
+
const toolPart = part;
|
|
263
|
+
const schema = extractOpenUISchema(toolPart.state.output);
|
|
264
|
+
const summary = getOpenUISummary(toolPart.state.output);
|
|
265
|
+
if (toolPart.state.status === "completed" && schema) return /* @__PURE__ */ jsxs("div", {
|
|
266
|
+
className: "overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)]",
|
|
267
|
+
children: [summary ? /* @__PURE__ */ jsx("div", {
|
|
268
|
+
className: "border-b border-[var(--border-subtle)] px-4 py-3 text-sm leading-6 text-foreground",
|
|
269
|
+
children: summary
|
|
270
|
+
}) : null, /* @__PURE__ */ jsx("div", {
|
|
271
|
+
className: "p-4",
|
|
272
|
+
children: /* @__PURE__ */ jsx(OpenUIArtifactRenderer, { schema })
|
|
273
|
+
})]
|
|
274
|
+
}, key);
|
|
275
|
+
if (toolPart.state.status === "running") return /* @__PURE__ */ jsxs("div", {
|
|
276
|
+
className: "flex items-center gap-2 rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)] px-4 py-3 text-sm text-muted-foreground",
|
|
277
|
+
children: [/* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin text-primary" }), "Building view…"]
|
|
278
|
+
}, key);
|
|
279
|
+
}
|
|
280
|
+
if (part.type === "text" && !part.synthetic && part.text.trim()) return /* @__PURE__ */ jsx("div", {
|
|
281
|
+
className: "px-0.5",
|
|
282
|
+
children: /* @__PURE__ */ jsx(Markdown, {
|
|
283
|
+
className: "tangle-prose text-[15px] leading-7 text-[var(--text-primary)]",
|
|
284
|
+
children: part.text
|
|
285
|
+
})
|
|
286
|
+
}, key);
|
|
287
|
+
return null;
|
|
288
|
+
})
|
|
289
|
+
});
|
|
290
|
+
const rows = allParts.filter(({ part }) => {
|
|
291
|
+
if (part.type === "tool" || part.type === "reasoning") return true;
|
|
292
|
+
return part.type === "text" && !part.synthetic && part.text.trim().length > 0;
|
|
293
|
+
});
|
|
294
|
+
const dotAccent = (part) => {
|
|
295
|
+
if (part.type === "reasoning") return "bg-[var(--brand-glow)]";
|
|
296
|
+
if (part.type === "text") return "bg-primary";
|
|
297
|
+
return "bg-[var(--border-hover)]";
|
|
298
|
+
};
|
|
299
|
+
return /* @__PURE__ */ jsx(Collapsible.Root, {
|
|
300
|
+
open: !collapsed,
|
|
301
|
+
onOpenChange: () => onToggle(),
|
|
302
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
303
|
+
className: "flex flex-col gap-1",
|
|
304
|
+
children: [
|
|
305
|
+
/* @__PURE__ */ jsxs("div", {
|
|
306
|
+
className: "flex items-start gap-2",
|
|
307
|
+
children: [/* @__PURE__ */ jsx(Collapsible.Trigger, {
|
|
308
|
+
asChild: true,
|
|
309
|
+
children: /* @__PURE__ */ jsxs("button", {
|
|
310
|
+
type: "button",
|
|
311
|
+
className: "group flex min-w-0 flex-1 items-center gap-2 rounded-md px-1 py-0.5 text-left transition-colors hover:bg-[var(--surface-container-high)]/40",
|
|
312
|
+
children: [
|
|
313
|
+
collapsed ? /* @__PURE__ */ jsx(ChevronRight, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }) : /* @__PURE__ */ jsx(ChevronDown, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
|
|
314
|
+
/* @__PURE__ */ jsx("span", {
|
|
315
|
+
className: cn("font-semibold text-sm", branding.textClass),
|
|
316
|
+
children: branding.label
|
|
317
|
+
}),
|
|
318
|
+
renderSummary(run) ? /* @__PURE__ */ jsx("span", {
|
|
319
|
+
className: "text-[11px] text-muted-foreground",
|
|
320
|
+
children: renderSummary(run)
|
|
321
|
+
}) : null,
|
|
322
|
+
collapsed && run.summaryText ? /* @__PURE__ */ jsx("span", {
|
|
323
|
+
className: "min-w-0 truncate text-[11px] text-foreground/70",
|
|
324
|
+
children: run.summaryText
|
|
325
|
+
}) : null,
|
|
326
|
+
/* @__PURE__ */ jsxs("span", {
|
|
327
|
+
className: "ml-auto flex shrink-0 items-center gap-1.5",
|
|
328
|
+
children: [/* @__PURE__ */ jsx(CategoryBadges, { categories: stats.toolCategories }), isStreaming ? /* @__PURE__ */ jsxs("span", {
|
|
329
|
+
className: "inline-flex items-center gap-1 rounded-full border border-[var(--border-accent)] bg-[var(--accent-surface-soft)] px-2 py-px text-[10px] font-semibold uppercase text-[var(--accent-text)]",
|
|
330
|
+
children: [/* @__PURE__ */ jsx(Loader2, { className: "h-2.5 w-2.5 animate-spin" }), "Running"]
|
|
331
|
+
}) : /* @__PURE__ */ jsxs("span", {
|
|
332
|
+
className: "inline-flex items-center gap-1 rounded-full border border-border px-2 py-px text-[10px] font-semibold uppercase text-muted-foreground",
|
|
333
|
+
children: [/* @__PURE__ */ jsx(Sparkles, { className: "h-2.5 w-2.5" }), "Done"]
|
|
334
|
+
})]
|
|
335
|
+
})
|
|
336
|
+
]
|
|
337
|
+
})
|
|
338
|
+
}), headerActions ? /* @__PURE__ */ jsx("div", {
|
|
339
|
+
className: "flex shrink-0 flex-wrap items-center justify-end gap-1.5 pt-1",
|
|
340
|
+
children: headerActions
|
|
341
|
+
}) : null]
|
|
342
|
+
}),
|
|
343
|
+
collapsed && run.summaryText ? /* @__PURE__ */ jsx("div", {
|
|
344
|
+
className: "line-clamp-2 pl-6 text-sm leading-6 text-muted-foreground",
|
|
345
|
+
children: run.summaryText
|
|
346
|
+
}) : null,
|
|
347
|
+
/* @__PURE__ */ jsx(Collapsible.Content, {
|
|
348
|
+
className: "overflow-hidden data-[state=open]:animate-slideDown data-[state=closed]:animate-slideUp",
|
|
349
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
350
|
+
className: "pt-1.5",
|
|
351
|
+
children: rows.map(({ part, msgId, index }, rowIndex) => {
|
|
352
|
+
const key = `${msgId}-${index}`;
|
|
353
|
+
const isLast = rowIndex === rows.length - 1;
|
|
354
|
+
let node = null;
|
|
355
|
+
if (part.type === "tool") {
|
|
356
|
+
if (isOpenUITool(part)) {
|
|
357
|
+
const toolPart = part;
|
|
358
|
+
const schema = extractOpenUISchema(toolPart.state.output);
|
|
359
|
+
const summary = getOpenUISummary(toolPart.state.output);
|
|
360
|
+
if (toolPart.state.status === "completed" && schema) node = /* @__PURE__ */ jsxs("div", {
|
|
361
|
+
className: "overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)]",
|
|
362
|
+
children: [summary ? /* @__PURE__ */ jsx("div", {
|
|
363
|
+
className: "border-b border-[var(--border-subtle)] px-4 py-3 text-sm leading-6 text-foreground",
|
|
364
|
+
children: summary
|
|
365
|
+
}) : null, /* @__PURE__ */ jsx("div", {
|
|
366
|
+
className: "p-4",
|
|
367
|
+
children: /* @__PURE__ */ jsx(OpenUIArtifactRenderer, { schema })
|
|
368
|
+
})]
|
|
369
|
+
});
|
|
370
|
+
else if (toolPart.state.status === "running") node = /* @__PURE__ */ jsxs("div", {
|
|
371
|
+
className: "flex items-center gap-3 rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)] px-4 py-3 text-sm text-muted-foreground",
|
|
372
|
+
children: [/* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin text-primary" }), "Building view…"]
|
|
373
|
+
});
|
|
374
|
+
}
|
|
375
|
+
if (node === null) node = /* @__PURE__ */ jsx(InlineToolItem, {
|
|
376
|
+
part,
|
|
377
|
+
renderToolDetail,
|
|
378
|
+
actions: renderToolActions?.(part, {
|
|
379
|
+
run,
|
|
380
|
+
messageId: msgId,
|
|
381
|
+
partIndex: index
|
|
382
|
+
})
|
|
383
|
+
});
|
|
384
|
+
} else if (part.type === "reasoning") node = /* @__PURE__ */ jsx(InlineThinkingItem, {
|
|
385
|
+
part,
|
|
386
|
+
defaultOpen: isStreaming
|
|
387
|
+
});
|
|
388
|
+
else if (part.type === "text" && !part.synthetic && part.text.trim()) node = /* @__PURE__ */ jsx("div", {
|
|
389
|
+
className: "px-1 py-0.5",
|
|
390
|
+
children: /* @__PURE__ */ jsx(Markdown, {
|
|
391
|
+
className: "tangle-prose text-[15px] leading-7",
|
|
392
|
+
children: part.text
|
|
393
|
+
})
|
|
394
|
+
});
|
|
395
|
+
if (!node) return null;
|
|
396
|
+
return /* @__PURE__ */ jsx(SpineRow, {
|
|
397
|
+
accentClassName: dotAccent(part),
|
|
398
|
+
isLast,
|
|
399
|
+
children: node
|
|
400
|
+
}, key);
|
|
401
|
+
})
|
|
402
|
+
})
|
|
403
|
+
})
|
|
404
|
+
]
|
|
405
|
+
})
|
|
406
|
+
});
|
|
407
|
+
});
|
|
408
|
+
RunGroup.displayName = "RunGroup";
|
|
409
|
+
//#endregion
|
|
410
|
+
export { InlineThinkingItem as n, RunGroup as t };
|
package/dist/run.d.ts
CHANGED
|
@@ -1,126 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
import { R as Run } from './run-PfLmDAox.js';
|
|
5
|
-
import { S as SessionPart, a as ToolPart, R as ReasoningPart } from './parts-dj7AcUg0.js';
|
|
6
|
-
import { AgentBranding } from './types.js';
|
|
7
|
-
import { C as CustomToolRenderer } from './tool-display-z4JcDmMQ.js';
|
|
8
|
-
export { F as FeedSegment, T as ToolCallData, a as ToolCallFeed, b as ToolCallFeedProps, c as ToolCallStatus, d as ToolCallType, p as parseToolEvent } from './tool-call-feed-D9iofJgW.js';
|
|
9
|
-
import './message-BHWbxBtT.js';
|
|
10
|
-
|
|
11
|
-
interface RunGroupProps {
|
|
12
|
-
run: Run;
|
|
13
|
-
partMap: Record<string, SessionPart[]>;
|
|
14
|
-
collapsed: boolean;
|
|
15
|
-
onToggle: () => void;
|
|
16
|
-
branding?: AgentBranding;
|
|
17
|
-
renderToolDetail?: CustomToolRenderer;
|
|
18
|
-
headerActions?: ReactNode;
|
|
19
|
-
renderToolActions?: (part: ToolPart, options: {
|
|
20
|
-
run: Run;
|
|
21
|
-
messageId: string;
|
|
22
|
-
partIndex: number;
|
|
23
|
-
}) => ReactNode;
|
|
24
|
-
}
|
|
25
|
-
/**
|
|
26
|
-
* Collapsible container for a consecutive group of assistant messages (a "run").
|
|
27
|
-
* Shows a summary header with stats and renders tool/thinking/text parts.
|
|
28
|
-
*/
|
|
29
|
-
declare const RunGroup: React.MemoExoticComponent<({ run, partMap, collapsed, onToggle, branding, renderToolDetail, headerActions, renderToolActions, }: RunGroupProps) => react_jsx_runtime.JSX.Element | null>;
|
|
30
|
-
|
|
31
|
-
type RunRowStatus = "running" | "success" | "error" | "idle";
|
|
32
|
-
/**
|
|
33
|
-
* Trailing status indicator shared by every run row. Only `error` draws a
|
|
34
|
-
* mark (a red dot). Success is silence, and a running row carries its state in
|
|
35
|
-
* the title — a `TextShimmer` sweep — so neither renders anything here.
|
|
36
|
-
*/
|
|
37
|
-
declare function RunRowStatusDot({ status }: {
|
|
38
|
-
status: RunRowStatus;
|
|
39
|
-
}): react_jsx_runtime.JSX.Element | null;
|
|
40
|
-
interface RunRowShellProps {
|
|
41
|
-
/** Semantic lead glyph (14px). At rest it is the row's only ornament; on
|
|
42
|
-
* hover and while open the expand chevron takes its slot. */
|
|
43
|
-
icon: ReactNode;
|
|
44
|
-
/** Row title. A string in the common case; a node when the title carries its
|
|
45
|
-
* own treatment — a running row passes `<TextShimmer>` here, which is the
|
|
46
|
-
* whole in-flight signal (the shell draws no spinner). */
|
|
47
|
-
title: ReactNode;
|
|
48
|
-
/** Secondary inline text (tool path/command, or a reasoning preview). */
|
|
49
|
-
description?: string;
|
|
50
|
-
/** Render the description in mono (tools) vs prose (reasoning). */
|
|
51
|
-
descriptionMono?: boolean;
|
|
52
|
-
status?: RunRowStatus;
|
|
53
|
-
/** @deprecated The shell no longer ticks a live duration while running; the
|
|
54
|
-
* running state lives in the title (`TextShimmer`). Accepted and ignored so
|
|
55
|
-
* existing callers keep compiling. */
|
|
56
|
-
startTime?: number;
|
|
57
|
-
/** Static duration, revealed on hover once the row is no longer running. */
|
|
58
|
-
durationMs?: number;
|
|
59
|
-
/** Radius shaping when rows are stacked into a group. */
|
|
60
|
-
groupPosition?: "single" | "first" | "middle" | "last";
|
|
61
|
-
/** Message shown below the header while collapsed (tool errors). */
|
|
62
|
-
collapsedError?: string;
|
|
63
|
-
actions?: ReactNode;
|
|
64
|
-
/** Controlled open state. Omit for internal (uncontrolled) state. */
|
|
65
|
-
open?: boolean;
|
|
66
|
-
onOpenChange?: (open: boolean) => void;
|
|
67
|
-
defaultOpen?: boolean;
|
|
68
|
-
className?: string;
|
|
69
|
-
contentClassName?: string;
|
|
70
|
-
/** Expanded body. When absent the row is not expandable. */
|
|
71
|
-
children?: ReactNode;
|
|
72
|
-
}
|
|
73
|
-
/**
|
|
74
|
-
* Shared shell for the agent activity rows (reasoning + tool). A quiet
|
|
75
|
-
* one-liner at rest — bare glyph, muted title and description, no fill, no
|
|
76
|
-
* border — that becomes a bordered card only while open. The border is always
|
|
77
|
-
* present (transparent at rest) so hover and expand never shift layout.
|
|
78
|
-
* Both row kinds render through it so they read as one family.
|
|
79
|
-
*/
|
|
80
|
-
declare function RunRowShell({ icon, title, description, descriptionMono, status, durationMs, groupPosition, collapsedError, actions, open: openProp, onOpenChange, defaultOpen, className, contentClassName, children, }: RunRowShellProps): react_jsx_runtime.JSX.Element;
|
|
81
|
-
|
|
82
|
-
interface InlineToolItemProps {
|
|
83
|
-
part: ToolPart;
|
|
84
|
-
renderToolDetail?: CustomToolRenderer;
|
|
85
|
-
groupPosition?: "single" | "first" | "middle" | "last";
|
|
86
|
-
className?: string;
|
|
87
|
-
contentClassName?: string;
|
|
88
|
-
actions?: ReactNode;
|
|
89
|
-
/** Override the derived title (default: from `getToolDisplayMetadata`). */
|
|
90
|
-
title?: string;
|
|
91
|
-
/** Override the derived inline description. */
|
|
92
|
-
description?: string;
|
|
93
|
-
}
|
|
94
|
-
/**
|
|
95
|
-
* Compact single-line tool call display: a category glyph, the tool verb, and
|
|
96
|
-
* the path or command it acted on. While the call runs the verb shimmers;
|
|
97
|
-
* once it completes the row goes quiet (duration on hover, a red dot only on
|
|
98
|
-
* error). Expands on click to show ExpandedToolDetail. Rendered through the
|
|
99
|
-
* shared RunRowShell so it stays consistent with the reasoning row.
|
|
100
|
-
*/
|
|
101
|
-
declare const InlineToolItem: React.MemoExoticComponent<({ part, renderToolDetail, groupPosition, className, contentClassName, actions, title: titleOverride, description: descriptionOverride, }: InlineToolItemProps) => react_jsx_runtime.JSX.Element>;
|
|
102
|
-
|
|
103
|
-
interface InlineThinkingItemProps {
|
|
104
|
-
part: ReasoningPart;
|
|
105
|
-
defaultOpen?: boolean;
|
|
106
|
-
autoCollapse?: boolean;
|
|
107
|
-
className?: string;
|
|
108
|
-
contentClassName?: string;
|
|
109
|
-
}
|
|
110
|
-
declare const InlineThinkingItem: React.MemoExoticComponent<({ part, defaultOpen, autoCollapse, className, contentClassName, }: InlineThinkingItemProps) => react_jsx_runtime.JSX.Element>;
|
|
111
|
-
|
|
112
|
-
interface ExpandedToolDetailProps {
|
|
113
|
-
part: ToolPart;
|
|
114
|
-
}
|
|
115
|
-
/**
|
|
116
|
-
* Renders full tool details when a tool item is expanded.
|
|
117
|
-
* Dispatches to specialised previews (CommandPreview, WriteFilePreview)
|
|
118
|
-
* or falls back to a generic input/output code view.
|
|
119
|
-
*/
|
|
120
|
-
declare const ExpandedToolDetail: React.MemoExoticComponent<({ part }: ExpandedToolDetailProps) => react_jsx_runtime.JSX.Element>;
|
|
121
|
-
|
|
122
|
-
declare function LiveDuration({ startTime }: {
|
|
123
|
-
startTime: number;
|
|
124
|
-
}): react_jsx_runtime.JSX.Element;
|
|
125
|
-
|
|
126
|
-
export { ExpandedToolDetail, type ExpandedToolDetailProps, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, LiveDuration, RunGroup, type RunGroupProps, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot };
|
|
1
|
+
import { a as parseToolEvent, i as ToolCallFeedProps, n as ToolCallData, o as ToolCallStatus, r as ToolCallFeed, s as ToolCallType, t as FeedSegment } from "./tool-call-feed-BeB1_4pX.js";
|
|
2
|
+
import { a as InlineThinkingItemProps, c as RunRowShell, d as RunRowStatusDot, f as RunGroup, i as InlineThinkingItem, l as RunRowShellProps, n as ExpandedToolDetail, o as InlineToolItem, p as RunGroupProps, r as ExpandedToolDetailProps, s as InlineToolItemProps, t as LiveDuration, u as RunRowStatus } from "./index-DjKxO357.js";
|
|
3
|
+
export { ExpandedToolDetail, type ExpandedToolDetailProps, type FeedSegment, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, LiveDuration, RunGroup, type RunGroupProps, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot, type ToolCallData, ToolCallFeed, type ToolCallFeedProps, type ToolCallStatus, type ToolCallType, parseToolEvent };
|
package/dist/run.js
CHANGED
|
@@ -1,40 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
} from "./
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
parseToolEvent
|
|
7
|
-
} from "./chunk-QGFYBNSO.js";
|
|
8
|
-
import {
|
|
9
|
-
InlineThinkingItem,
|
|
10
|
-
RunGroup
|
|
11
|
-
} from "./chunk-YU4E5J2N.js";
|
|
12
|
-
import {
|
|
13
|
-
ExpandedToolDetail,
|
|
14
|
-
InlineToolItem,
|
|
15
|
-
RunRowShell,
|
|
16
|
-
RunRowStatusDot
|
|
17
|
-
} from "./chunk-R7B3UWPF.js";
|
|
18
|
-
import "./chunk-ND3ZFXQK.js";
|
|
19
|
-
import "./chunk-HMAPIH7L.js";
|
|
20
|
-
import "./chunk-L57WRIND.js";
|
|
21
|
-
import "./chunk-BEBXZPHW.js";
|
|
22
|
-
import "./chunk-M3QZK62R.js";
|
|
23
|
-
import "./chunk-4CLN43XT.js";
|
|
24
|
-
import "./chunk-XU3HB5QL.js";
|
|
25
|
-
import "./chunk-42PAH5D2.js";
|
|
26
|
-
import "./chunk-OL5GYLHV.js";
|
|
27
|
-
import "./chunk-3XXBZL53.js";
|
|
28
|
-
import "./chunk-WKWBTL2V.js";
|
|
29
|
-
import "./chunk-RQHJBTEU.js";
|
|
30
|
-
export {
|
|
31
|
-
ExpandedToolDetail,
|
|
32
|
-
InlineThinkingItem,
|
|
33
|
-
InlineToolItem,
|
|
34
|
-
LiveDuration,
|
|
35
|
-
RunGroup,
|
|
36
|
-
RunRowShell,
|
|
37
|
-
RunRowStatusDot,
|
|
38
|
-
ToolCallFeed,
|
|
39
|
-
parseToolEvent
|
|
40
|
-
};
|
|
1
|
+
import { a as RunRowStatusDot, i as RunRowShell, o as ExpandedToolDetail, r as InlineToolItem } from "./tool-call-step-DNebqhmX.js";
|
|
2
|
+
import { n as InlineThinkingItem, t as RunGroup } from "./run-group-BACLbCFl.js";
|
|
3
|
+
import { t as LiveDuration } from "./run-ZsIKPA6J.js";
|
|
4
|
+
import { n as parseToolEvent, t as ToolCallFeed } from "./tool-call-feed-Djt2q11V.js";
|
|
5
|
+
export { ExpandedToolDetail, InlineThinkingItem, InlineToolItem, LiveDuration, RunGroup, RunRowShell, RunRowStatusDot, ToolCallFeed, parseToolEvent };
|