@tangle-network/sandbox-ui 2.0.6 → 2.0.7

package/dist/run-BgllNBrW.js

@@ -0,0 +1,2036 @@
+import { t as __exportAll } from "./rolldown-runtime-D8jQpDG7.js";
+import { t as cn$1 } from "./utils-BER_bdgE.js";
+import { i as modelBrandFor, t as ModelBrandStack } from "./model-brand-bTcMjQtB.js";
+import { t as ProviderIcon } from "./provider-logo-CPKRPHcS.js";
+import { f as syncAmbient, l as activityTiming, t as AgentGraph, u as ambientStyle } from "./AgentGraph-CFlI9qta.js";
+import { t as LatestEvents } from "./latest-events-v_vXRyd7.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState } from "react";
+import { X } from "lucide-react";
+import { getToolDisplayMetadata } from "@tangle-network/ui/utils";
+import { AgentTimeline, AgentTimelineColumn, AgentTimelineStep, SpeakerHeader, agentTimelineStepKind } from "@tangle-network/ui/chat";
+import { ApprovalCard, ApprovalDiffSummary, ExpandedToolDetail, InlineThinkingItem, InlineThinkingItem as InlineThinkingItem$1, InlineToolItem, LiveDuration, RunGroup, RunPhaseList, RunRowShell, RunRowShell as RunRowShell$1, RunRowStatusDot, RunStatusIcon as RunStatusIcon$1, TaskList, ToolCallFeed, parseToolEvent, runStatus, runStatus as runStatus$1, showsTaskPriority, statusMeta as statusMeta$1, taskProgress, taskStatus } from "@tangle-network/ui/run";
+import { FlowWaterfall, toolGlyph } from "@tangle-network/charts/react";
+// src/run/trace-waterfall.tsx
+/** Agent and model spans show their lab/host mark; tool spans show their provider's mark. Unknown keeps the kind glyph. */
+function traceSpanMark(span) {
+	if (span.kind === "pipeline" || span.kind === "model") {
+		const identity = span.detail ? modelBrandFor(span.detail) : null;
+		return identity ? /* @__PURE__ */ jsx(ModelBrandStack, {
+			identity,
+			size: "sm"
+		}) : void 0;
+	}
+	const provider = span.icon ?? (span.kind === "tool" ? span.detail : void 0);
+	return provider ? /* @__PURE__ */ jsx(ProviderIcon, {
+		id: provider,
+		displayName: provider,
+		size: 14,
+		className: "rounded-[3px]"
+	}) : void 0;
+}
+/**
+* The run inspector: the agent timeline (`defaultView="agents"`) and the span waterfall over one clock, from
+* `@tangle-network/charts`, with Sandbox UI's brand marks. Feed it `otlpFlowTrace(spans)` from the
+* `traces convert` contract. Import `@tangle-network/charts/react/flow-waterfall.css` once.
+*/
+function TraceWaterfall({ renderIcon = traceSpanMark, ...props }) {
+	return /* @__PURE__ */ jsx(FlowWaterfall, {
+		renderIcon,
+		...props
+	});
+}
+// src/run/agent-stream.ts
+const TOOL_TYPES = /* @__PURE__ */ new Set([
+	"bash",
+	"read",
+	"write",
+	"edit",
+	"glob",
+	"grep",
+	"list",
+	"download",
+	"inspect",
+	"audit"
+]);
+const toolType = (name) => {
+	const key = (name ?? "").toLowerCase();
+	return TOOL_TYPES.has(key) ? key : "unknown";
+};
+const brief = (value, max = 240) => {
+	if (value === void 0 || value === null) return void 0;
+	const text = typeof value === "string" ? value : JSON.stringify(value);
+	return text.length > max ? `${text.slice(0, max - 1)}…` : text;
+};
+const failed = (result) => typeof result === "object" && result !== null && ("error" in result || result.is_error === true);
+const recorded = (text) => {
+	try {
+		const value = JSON.parse(text);
+		return typeof value === "object" && value !== null ? `\`\`\`json\n${text}\n\`\`\`` : text;
+	} catch {
+		return text;
+	}
+};
+/** Fold stream rows into transcript entries: text of one turn merges, a tool call becomes a row its result completes. */
+function foldAgentRows(entries, rows) {
+	const next = [...entries];
+	for (const row of rows) {
+		const at = Date.parse(row.at);
+		const { event } = row;
+		const last = next[next.length - 1];
+		if (event.kind === "text" && event.text) {
+			if (last?.kind === "message" && last.role === "assistant" && !last.sealed) next[next.length - 1] = {
+				...last,
+				content: last.content + event.text
+			};
+			else next.push({
+				id: `m-${row.seq}`,
+				at,
+				kind: "message",
+				role: "assistant",
+				content: event.text
+			});
+		} else if (event.kind === "user" && event.text) next.push({
+			id: `u-${row.seq}`,
+			at,
+			kind: "message",
+			role: "user",
+			content: event.text
+		});
+		else if (event.kind === "notice" && event.text) {
+			if (event.provenance === "delegated-input") next.push({
+				id: `u-${row.seq}`,
+				at,
+				kind: "message",
+				role: "user",
+				content: recorded(event.text)
+			});
+			else if (event.provenance === "recorded-result") next.push({
+				id: `m-${row.seq}`,
+				at,
+				kind: "message",
+				role: "assistant",
+				content: recorded(event.text),
+				sealed: true
+			});
+			else next.push({
+				id: `n-${row.seq}`,
+				at,
+				kind: "notice",
+				text: event.text
+			});
+		} else if (event.kind === "reasoning" && event.text) {
+			if (last?.kind === "reasoning") next[next.length - 1] = {
+				...last,
+				text: last.text + event.text
+			};
+			else next.push({
+				id: `r-${row.seq}`,
+				at,
+				kind: "reasoning",
+				text: event.text
+			});
+		} else if (event.kind === "tool-call") {
+			const id = event.toolCallId ?? `t-${row.seq}`;
+			next.push({
+				id,
+				at,
+				kind: "tool",
+				call: {
+					id,
+					type: toolType(event.toolName),
+					label: event.toolName ?? "tool",
+					status: "running",
+					detail: brief(event.args, 120)
+				}
+			});
+		} else if (event.kind === "tool-result") {
+			const index = next.findIndex((entry) => entry.kind === "tool" && entry.call.id === event.toolCallId);
+			const entry = next[index];
+			if (entry?.kind === "tool") next[index] = {
+				...entry,
+				call: {
+					...entry.call,
+					status: failed(event.result) ? "error" : "success",
+					output: brief(event.result),
+					duration: Math.max(0, at - entry.at)
+				}
+			};
+		}
+	}
+	return next;
+}
+function reduce(state, action) {
+	switch (action.type) {
+		case "reset": return {
+			generation: action.generation,
+			entries: [],
+			lastSeq: 0,
+			alive: true
+		};
+		case "rows": {
+			const base = action.generation !== void 0 && action.generation !== state.generation ? {
+				entries: [],
+				lastSeq: 0
+			} : state;
+			const fresh = action.rows.filter((row) => row.seq > base.lastSeq);
+			return {
+				generation: action.generation ?? state.generation,
+				entries: foldAgentRows(base.entries, fresh),
+				lastSeq: fresh.reduce((max, row) => Math.max(max, row.seq), base.lastSeq),
+				alive: action.alive ?? state.alive,
+				error: void 0
+			};
+		}
+		case "end": return {
+			...state,
+			alive: false,
+			error: void 0
+		};
+		case "error": return {
+			...state,
+			error: action.message
+		};
+		case "unreachable": return {
+			...state,
+			error: "The agent stream is unreachable; the viewer may be closed."
+		};
+	}
+}
+/**
+* Follow one agent's message stream over Server-Sent Events: `rows`, `reset` and `end` events, reconnecting with
+* `?after=<lastSeq>` when the server closes the connection, so a long turn streams without gaps or repeats.
+*/
+function useAgentStream(url) {
+	const [state, dispatch] = useReducer(reduce, {
+		entries: [],
+		lastSeq: 0,
+		alive: false
+	});
+	useEffect(() => {
+		if (!url || typeof EventSource === "undefined") return;
+		dispatch({ type: "reset" });
+		let lastSeq = 0;
+		let closed = false;
+		let source;
+		let retry;
+		const open = () => {
+			const target = new URL(url, globalThis.location?.href);
+			if (lastSeq > 0) target.searchParams.set("after", String(lastSeq));
+			source = new EventSource(target.toString());
+			let opened = false;
+			source.onopen = () => {
+				opened = true;
+			};
+			source.addEventListener("rows", (message) => {
+				const data = JSON.parse(message.data);
+				lastSeq = Math.max(lastSeq, data.lastSeq ?? 0, ...data.events.map((row) => row.seq));
+				dispatch({
+					type: "rows",
+					generation: data.generation,
+					rows: data.events,
+					alive: data.alive
+				});
+			});
+			source.addEventListener("reset", (message) => {
+				lastSeq = 0;
+				dispatch({
+					type: "reset",
+					generation: JSON.parse(message.data).generation
+				});
+			});
+			source.addEventListener("end", () => {
+				closed = true;
+				source?.close();
+				dispatch({ type: "end" });
+			});
+			source.onerror = () => {
+				source?.close();
+				if (closed) return;
+				if (!opened) dispatch({ type: "unreachable" });
+				retry = setTimeout(open, 1e3);
+			};
+		};
+		open();
+		return () => {
+			closed = true;
+			clearTimeout(retry);
+			source?.close();
+		};
+	}, [url]);
+	return state;
+}
+// src/run/trace-workspace.tsx
+/** The agent that owns a span: the span itself when it is an agent, else its nearest agent ancestor. */
+function agentOf(span, byId) {
+	for (let cursor = span; cursor; cursor = cursor.parentId ? byId.get(cursor.parentId) : void 0) if (cursor.kind === "pipeline") return cursor;
+}
+/** The trace's agents as a spawn tree at the cursor: an agent not started by then is left out, one that ends after it is
+*  still running, so the Graph and the Timeline always show the same moment. */
+function agentGraphAt(spans, byId, at, epoch, cards, extraEdges = []) {
+	const nodes = [], edges = [], seen = /* @__PURE__ */ new Set();
+	const timed = new Set(spans.flatMap((span) => span.kind === "pipeline" && span.id ? [span.id] : []));
+	const recorded = /* @__PURE__ */ new Map();
+	for (const [index, span] of spans.entries()) {
+		if (span.kind === "pipeline" || at !== null && span.startMs > at) continue;
+		const owner = agentOf(span, byId);
+		if (!owner?.id) continue;
+		const events = recorded.get(owner.id) ?? [];
+		const endpoints = [{
+			suffix: "start",
+			label: "Started ",
+			time: span.startMs
+		}];
+		if (span.status !== "running" && span.endMs !== span.startMs && (at === null || span.endMs <= at)) endpoints.push({
+			suffix: "end",
+			label: "Recorded ",
+			time: span.endMs
+		});
+		for (const endpoint of endpoints) events.push({
+			id: (span.id ?? String(index)) + ":" + endpoint.suffix,
+			label: endpoint.label + span.name,
+			at: epoch == null || !Number.isFinite(epoch) ? void 0 : epoch + endpoint.time
+		});
+		recorded.set(owner.id, events);
+	}
+	for (const span of spans) {
+		if (span.kind !== "pipeline" || !span.id || seen.has(span.id) || at !== null && span.startMs > at) continue;
+		seen.add(span.id);
+		const card = cards?.[span.id];
+		const state = at !== null && (span.endMs > at || span.status === "running") ? "running" : runStatus(span.status ?? "unknown");
+		const activity = (span.activityAt ?? []).reduce((last, time) => Number.isFinite(time) && (at === null || time <= at) ? Math.max(last, time) : last, -Infinity);
+		const events = (card?.events ?? recorded.get(span.id) ?? []).filter((event) => at === null || epoch != null && event.at != null && event.at <= epoch + at).sort((a, b) => (a.at ?? 0) - (b.at ?? 0));
+		const timing = activityTiming({
+			events,
+			lastActivityAt: epoch != null && Number.isFinite(epoch) && Number.isFinite(activity) ? epoch + activity : at === null ? card?.lastActivityAt : void 0,
+			medianEventGapMs: span.medianEventGapMs ?? (at === null ? card?.medianEventGapMs : void 0)
+		});
+		nodes.push({
+			...card,
+			id: span.id,
+			label: card?.label ?? span.name,
+			model: card?.model ?? span.detail,
+			status: at === null && card?.status ? card.status : state === "done" ? "succeeded" : state,
+			costUsd: at === null ? card?.costUsd ?? span.costUsd : span.endMs <= at ? span.costUsd : void 0,
+			startedAt: epoch == null || !Number.isFinite(epoch) ? at === null ? card?.startedAt : void 0 : epoch + span.startMs,
+			...timing,
+			events: events.slice(-4),
+			turn: at === null ? card?.turn : void 0,
+			result: at === null ? card?.result ?? span.output : span.endMs <= at ? span.output : void 0,
+			commits: at === null ? card?.commits : void 0,
+			tokens: at === null ? card?.tokens : void 0
+		});
+		const parent = span.parentId ? byId.get(span.parentId) : void 0, spawner = parent && agentOf(parent, byId);
+		if (spawner?.id) edges.push({
+			from: spawner.id,
+			to: span.id,
+			kind: "spawn"
+		});
+	}
+	for (const [id, card] of Object.entries(cards ?? {})) if (!timed.has(id)) nodes.push(at === null ? {
+		...card,
+		id,
+		label: card.label ?? id,
+		status: card.status ?? "unknown"
+	} : {
+		id,
+		label: card.label ?? id,
+		model: card.model,
+		harness: card.harness,
+		role: card.role,
+		status: "unknown",
+		turn: "Timing unavailable at this cursor"
+	});
+	const ids = new Set(nodes.map((node) => node.id));
+	for (const edge of extraEdges) if (ids.has(edge.from) && ids.has(edge.to) && (edge.kind !== "spawn" || !edges.some((prior) => prior.kind === "spawn" && prior.from === edge.from && prior.to === edge.to))) edges.push(edge);
+	return {
+		nodes,
+		edges
+	};
+}
+function timelineItems(entries, streaming) {
+	return entries.map((entry, index) => {
+		if (entry.kind === "message") return {
+			id: entry.id,
+			kind: "message",
+			role: entry.role,
+			content: entry.content,
+			isStreaming: streaming && index === entries.length - 1
+		};
+		if (entry.kind === "tool") return {
+			id: entry.id,
+			kind: "tool",
+			call: entry.call
+		};
+		if (entry.kind === "notice") return {
+			id: entry.id,
+			kind: "custom",
+			content: /* @__PURE__ */ jsx("p", {
+				className: "text-xs text-muted-foreground",
+				children: entry.text
+			})
+		};
+		return {
+			id: entry.id,
+			kind: "custom",
+			content: /* @__PURE__ */ jsx(InlineThinkingItem, {
+				part: {
+					type: "reasoning",
+					text: entry.text
+				},
+				defaultOpen: false,
+				openWhileActive: false
+			})
+		};
+	});
+}
+function NotTimeIndexed({ label }) {
+	return /* @__PURE__ */ jsxs("p", {
+		className: "p-4 text-sm text-muted-foreground",
+		children: [label, ": not time-indexed"]
+	});
+}
+/**
+* The run workspace: the agent timeline and span waterfall over one clock, the selected agent's conversation
+* streaming in a right-hand drawer, and the page's code workspace and scoreboard following the time cursor. Scrubbing is time travel:
+* every panel shows what was true at the cursor, and the conversation shows what had been said by then.
+*/
+function TraceWorkspace({ trace, streamUrl, events, onTimeChange, files, scoreboard, selectedAgentId, onSelectAgent, agentCards, agentGraph, className, ...waterfall }) {
+	const byId = useMemo(() => new Map(trace.spans.flatMap((span) => span.id ? [[span.id, span]] : [])), [trace]);
+	const [ownSelection, setOwnSelection] = useState();
+	const selected = selectedAgentId ?? ownSelection;
+	const select = (agentId) => {
+		setOwnSelection(agentId);
+		onSelectAgent?.(agentId);
+	};
+	const agent = selected ? byId.get(selected) : void 0, card = selected ? agentCards?.[selected] : void 0;
+	const agentId = agent?.id ?? (card ? selected : void 0), agentName = agent?.name ?? card?.label ?? agentId, agentModel = agent?.detail ?? card?.model;
+	const { defaultLayout = "tree", ...graphOptions } = agentGraph ?? {};
+	const [graphLayout, setGraphLayout] = useState(defaultLayout);
+	const [cursor, setCursor] = useState(null);
+	const stream = useAgentStream(selected && streamUrl ? streamUrl(selected) : void 0);
+	const origin = useMemo(() => {
+		if (waterfall.startedAt !== void 0) return waterfall.startedAt;
+		const first = stream.entries[0]?.at;
+		return agent && first !== void 0 ? first - agent.startMs : void 0;
+	}, [
+		waterfall.startedAt,
+		agent,
+		stream.entries
+	]);
+	const graph = useMemo(() => agentGraphAt(trace.spans, byId, cursor, waterfall.startedAt, agentCards, agentGraph?.edges), [
+		trace,
+		byId,
+		cursor,
+		waterfall.startedAt,
+		agentCards,
+		agentGraph?.edges
+	]);
+	const selectedNode = graph.nodes.find((node) => node.id === agentId);
+	const facts = cursor === null || agent && agent.endMs <= cursor ? [...agent?.facts ?? []] : [];
+	for (const [label, value] of [["Recorded result", selectedNode?.result], ["Activity", selectedNode?.turn]]) if (value && !facts.some((fact) => fact.value === value)) facts.push({
+		label,
+		value
+	});
+	const graphNow = cursor !== null && waterfall.startedAt !== void 0 ? waterfall.startedAt + cursor : void 0;
+	const shown = cursor === null || origin === void 0 ? stream.entries : stream.entries.filter((entry) => entry.at - origin <= cursor);
+	const live = stream.alive && !stream.error && cursor === null;
+	const items = useMemo(() => timelineItems(shown, live), [shown, live]);
+	const scroller = useRef(null);
+	const pinned = useRef(true);
+	const [unseen, setUnseen] = useState(false);
+	useLayoutEffect(() => {
+		const element = scroller.current;
+		if (!element) return;
+		if (pinned.current) element.scrollTop = element.scrollHeight;
+		else setUnseen(true);
+	}, [items.length, items[items.length - 1]]);
+	useEffect(() => {
+		pinned.current = true;
+		setUnseen(false);
+	}, [selected]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn$1("sandbox-trace-workspace flex min-h-0 flex-col gap-3", className),
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: agentId ? "min-w-0 lg:mr-[420px]" : "min-w-0",
+				children: /* @__PURE__ */ jsx(TraceWaterfall, {
+					...waterfall,
+					trace,
+					markers: events,
+					selectedId: agentId,
+					onDeselect: () => select(void 0),
+					onSelect: (span) => {
+						const owner = agentOf(span, byId);
+						if (owner?.id) select(owner.id);
+					},
+					onTimeChange: (time) => {
+						setCursor(time);
+						onTimeChange?.(time);
+					},
+					latestEvents: /* @__PURE__ */ jsx(LatestEvents, {
+						agents: graph.nodes,
+						now: graphNow,
+						live: cursor === null,
+						selectedId: agentId,
+						onSelect: select
+					}),
+					graph: /* @__PURE__ */ jsxs("section", {
+						className: "flex h-[60vh] min-h-[480px] flex-col",
+						"aria-label": "Agent graph",
+						children: [/* @__PURE__ */ jsxs("label", {
+							className: "flex h-8 shrink-0 items-center justify-end gap-2 px-3 text-xs text-muted-foreground",
+							children: ["Layout", /* @__PURE__ */ jsxs("select", {
+								"aria-label": "Graph layout",
+								value: graphLayout,
+								onChange: (event) => setGraphLayout(event.currentTarget.value),
+								className: "rounded-[var(--radius-control)] border border-border bg-card px-2 py-1 text-foreground",
+								children: [/* @__PURE__ */ jsx("option", {
+									value: "tree",
+									children: "Tree"
+								}), /* @__PURE__ */ jsx("option", {
+									value: "hub",
+									children: "Hub"
+								})]
+							})]
+						}), /* @__PURE__ */ jsx(AgentGraph, {
+							...graphOptions,
+							layout: graphLayout,
+							renderEventIcon: (event) => toolGlyph(event.label),
+							nodes: graph.nodes,
+							edges: graph.edges,
+							selectedId: agentId ?? null,
+							onSelect: select,
+							showLatestEvents: false,
+							now: graphNow,
+							live: cursor === null && graph.nodes.some((node) => [
+								"running",
+								"waiting",
+								"needs-you",
+								"failed"
+							].includes(node.status)),
+							className: cn$1("min-h-0 flex-1", graphOptions.className)
+						})]
+					})
+				})
+			}),
+			files && /* @__PURE__ */ jsx("section", {
+				"aria-label": "Code at the cursor",
+				className: "flex min-h-[70vh] flex-col overflow-hidden rounded-xl border border-border bg-card",
+				children: files
+			}),
+			scoreboard && /* @__PURE__ */ jsx("section", {
+				"aria-label": "Scoreboard at the cursor",
+				className: "overflow-hidden rounded-xl border border-border bg-card",
+				children: scoreboard
+			}),
+			agentId && /* @__PURE__ */ jsxs("aside", {
+				"aria-label": `${agentName} conversation`,
+				onKeyDown: (event) => {
+					if (event.key === "Escape") select(void 0);
+				},
+				className: "fixed inset-y-0 right-0 z-40 flex w-full max-w-[420px] flex-col border-l border-border bg-card shadow-2xl",
+				children: [
+					/* @__PURE__ */ jsxs("header", {
+						className: "flex shrink-0 items-center gap-2 border-b border-border px-3 py-2",
+						children: [
+							/* @__PURE__ */ jsx("span", {
+								className: cn$1("h-1.5 w-1.5 shrink-0 rounded-full", live ? "bg-[var(--surface-info-text)]" : "bg-muted-foreground"),
+								"aria-hidden": true,
+								"data-motion": live ? "essential" : void 0,
+								style: live ? ambientStyle : void 0,
+								onAnimationStart: syncAmbient
+							}),
+							/* @__PURE__ */ jsx("h3", {
+								className: "min-w-0 flex-1 truncate text-sm font-semibold",
+								children: agentName
+							}),
+							agentModel && /* @__PURE__ */ jsx("span", {
+								className: "truncate text-xs text-muted-foreground",
+								children: agentModel
+							}),
+							/* @__PURE__ */ jsx("button", {
+								type: "button",
+								"aria-label": "Close conversation",
+								title: "Close (Esc)",
+								onClick: () => select(void 0),
+								className: "shrink-0 rounded-md p-1 text-muted-foreground hover:bg-muted hover:text-foreground",
+								children: /* @__PURE__ */ jsx(X, {
+									"aria-hidden": true,
+									className: "h-4 w-4"
+								})
+							})
+						]
+					}),
+					facts.length > 0 && /* @__PURE__ */ jsx("section", {
+						"aria-label": "Recorded agent details",
+						tabIndex: 0,
+						className: "max-h-[35vh] shrink-0 overflow-y-auto border-b border-border px-3 py-2 text-sm",
+						children: /* @__PURE__ */ jsx("dl", {
+							className: "space-y-2",
+							children: facts.map((fact, index) => /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", {
+								className: "text-xs text-muted-foreground",
+								children: fact.label
+							}), /* @__PURE__ */ jsx("dd", {
+								className: "m-0 whitespace-pre-wrap break-words",
+								children: fact.value
+							})] }, index))
+						})
+					}),
+					/* @__PURE__ */ jsx("div", {
+						ref: scroller,
+						onScroll: (event) => {
+							const element = event.currentTarget;
+							pinned.current = element.scrollHeight - element.scrollTop - element.clientHeight < 48;
+							if (pinned.current) setUnseen(false);
+						},
+						"data-primary-content": "",
+						className: "min-h-0 flex-1 overflow-y-auto px-3 py-2",
+						children: streamUrl && (cursor === null || origin !== void 0) ? /* @__PURE__ */ jsx(AgentTimeline, {
+							items,
+							isThinking: live && items.length === 0,
+							emptyState: /* @__PURE__ */ jsx("p", {
+								className: "p-4 text-sm text-muted-foreground",
+								children: stream.error ?? "No messages yet."
+							})
+						}) : /* @__PURE__ */ jsx(NotTimeIndexed, { label: "Conversation" })
+					}),
+					unseen && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: () => {
+							const element = scroller.current;
+							if (element) element.scrollTop = element.scrollHeight;
+							pinned.current = true;
+							setUnseen(false);
+						},
+						className: "absolute bottom-3 left-1/2 -translate-x-1/2 rounded-full border border-border bg-background px-3 py-1 text-xs shadow-sm",
+						children: "New output"
+					})
+				]
+			})
+		]
+	});
+}
+// src/run/record/VirtualList.tsx
+/**
+* Renders only the rows near the viewport of `scroller`. Row heights are measured as they render; unmeasured
+* rows use `estimate`. Spacers keep the scroll height, so the browser's scroll anchoring holds the reading place.
+*/
+function VirtualList({ items, keyOf, render, scroller, estimate = 96, overscan = 900, target }) {
+	const heights = useRef(/* @__PURE__ */ new Map());
+	const [version, setVersion] = useState(0);
+	const [viewport, setViewport] = useState({
+		top: 0,
+		height: 900
+	});
+	const observer = useRef(null);
+	const nodes = useRef(/* @__PURE__ */ new Map());
+	const frame = useRef(0);
+	const observe = (element) => {
+		if (!observer.current && typeof ResizeObserver !== "undefined") observer.current = new ResizeObserver((entries) => {
+			let changed = false;
+			for (const entry of entries) {
+				const key = nodes.current.get(entry.target);
+				if (!key) continue;
+				const height = Math.ceil(entry.borderBoxSize?.[0]?.blockSize ?? entry.target.offsetHeight);
+				if (height > 0 && heights.current.get(key) !== height) {
+					heights.current.set(key, height);
+					changed = true;
+				}
+			}
+			if (changed && !frame.current) frame.current = requestAnimationFrame(() => {
+				frame.current = 0;
+				setVersion((value) => value + 1);
+			});
+		});
+		observer.current?.observe(element);
+	};
+	useEffect(() => () => {
+		cancelAnimationFrame(frame.current);
+		observer.current?.disconnect();
+		observer.current = null;
+		nodes.current.clear();
+	}, []);
+	useEffect(() => {
+		const element = scroller.current;
+		if (!element) return;
+		let frame = 0;
+		const update = () => {
+			frame = 0;
+			setViewport((current) => current.top === element.scrollTop && current.height === element.clientHeight ? current : {
+				top: element.scrollTop,
+				height: element.clientHeight
+			});
+		};
+		const schedule = () => {
+			if (!frame) frame = requestAnimationFrame(update);
+		};
+		update();
+		element.addEventListener("scroll", schedule, { passive: true });
+		const resize = new ResizeObserver(schedule);
+		resize.observe(element);
+		return () => {
+			cancelAnimationFrame(frame);
+			element.removeEventListener("scroll", schedule);
+			resize.disconnect();
+		};
+	}, [scroller]);
+	const offsets = useMemo(() => {
+		const result = new Float64Array(items.length + 1);
+		const guess = typeof estimate === "function" ? estimate : () => estimate;
+		for (let i = 0; i < items.length; i++) result[i + 1] = result[i] + (heights.current.get(keyOf(items[i])) ?? guess(items[i]));
+		return result;
+	}, [
+		items,
+		keyOf,
+		estimate,
+		version
+	]);
+	const find = (y) => {
+		let low = 0;
+		let high = items.length;
+		while (low < high) {
+			const mid = low + high >> 1;
+			if (offsets[mid + 1] <= y) low = mid + 1;
+			else high = mid;
+		}
+		return low;
+	};
+	const start = Math.max(0, find(viewport.top - overscan));
+	const end = Math.min(items.length, find(viewport.top + viewport.height + overscan) + 1);
+	const scrollTo = useCallback((key, align) => {
+		const element = scroller.current;
+		const index = items.findIndex((item) => keyOf(item) === key);
+		if (!element || index < 0) return false;
+		const top = offsets[index];
+		const bottom = offsets[index + 1];
+		if (align || top < element.scrollTop || bottom > element.scrollTop + element.clientHeight) element.scrollTop = Math.max(0, top - 8);
+		return true;
+	}, [
+		items,
+		keyOf,
+		offsets,
+		scroller
+	]);
+	const pending = useRef(null);
+	const rows = useRef(/* @__PURE__ */ new Map());
+	const settle = () => {
+		const goal = pending.current;
+		if (!goal) return;
+		if (performance.now() > goal.until) {
+			pending.current = null;
+			return;
+		}
+		if (!scrollTo(goal.key, true)) return;
+		const row = rows.current.get(goal.key);
+		if (row?.isConnected) {
+			const box = row.getBoundingClientRect();
+			if (box.top < 72 || box.top > window.innerHeight - 96) window.scrollBy({ top: box.top - 120 });
+		}
+	};
+	useLayoutEffect(() => {
+		pending.current = target ? {
+			key: target,
+			until: performance.now() + 2e3
+		} : null;
+		settle();
+	}, [target]);
+	useLayoutEffect(settle, [
+		version,
+		viewport,
+		items
+	]);
+	useEffect(() => {
+		const element = scroller.current;
+		if (!element) return;
+		const release = () => {
+			pending.current = null;
+		};
+		element.addEventListener("wheel", release, { passive: true });
+		element.addEventListener("touchstart", release, { passive: true });
+		element.addEventListener("pointerdown", release);
+		element.addEventListener("keydown", release);
+		return () => {
+			element.removeEventListener("wheel", release);
+			element.removeEventListener("touchstart", release);
+			element.removeEventListener("pointerdown", release);
+			element.removeEventListener("keydown", release);
+		};
+	}, [scroller]);
+	const bind = (key) => (element) => {
+		if (!element) {
+			rows.current.delete(key);
+			return;
+		}
+		rows.current.set(key, element);
+		for (const [node, value] of nodes.current) if (value === key && node !== element) {
+			observer.current?.unobserve(node);
+			nodes.current.delete(node);
+		}
+		if (!nodes.current.has(element)) {
+			nodes.current.set(element, key);
+			observe(element);
+		}
+	};
+	useEffect(() => {
+		for (const node of [...nodes.current.keys()]) if (!node.isConnected) {
+			observer.current?.unobserve(node);
+			nodes.current.delete(node);
+		}
+	});
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx("div", {
+			style: { height: offsets[start] },
+			"aria-hidden": "true"
+		}),
+		items.slice(start, end).map((item, i) => {
+			const key = keyOf(item);
+			return /* @__PURE__ */ jsx("div", {
+				ref: bind(key),
+				className: "virtual-row",
+				children: render(item, start + i)
+			}, key);
+		}),
+		/* @__PURE__ */ jsx("div", {
+			style: { height: offsets[items.length] - offsets[end] },
+			"aria-hidden": "true"
+		})
+	] });
+}
+// src/run/record/model.ts
+var model_exports = /* @__PURE__ */ __exportAll({
+	agentState: () => agentState,
+	callsOf: () => callsOf,
+	compact: () => compact,
+	eventMatches: () => eventMatches,
+	eventSource: () => eventSource,
+	fmt: () => fmt,
+	hostless: () => hostless,
+	hoverLines: () => hoverLines,
+	indexRecord: () => indexRecord,
+	interval: () => interval,
+	measuredUsage: () => measuredUsage,
+	modelIdentity: () => modelIdentity,
+	ms: () => ms,
+	preview: () => preview,
+	roleOf: () => roleOf,
+	textOf: () => textOf,
+	toolKey: () => toolKey,
+	tooltipSections: () => tooltipSections,
+	utcTime: () => utcTime
+});
+const ms = (value) => Date.parse(value);
+/** Normalize labels to UTC without rewriting the source timestamp. */
+function utcTime(value, includeDate = false) {
+	const date = new Date(value);
+	if (!Number.isFinite(date.valueOf())) return "Unknown time";
+	const iso = date.toISOString();
+	return `${includeDate ? iso.slice(0, 19).replace("T", " ") : iso.slice(11, 19)} UTC`;
+}
+const compact = (value) => value.replace(/\s+/g, " ").trim();
+/**
+* Recorded text names the host folders an agent ran in (`/home/<user>/.cache/disco/host/<run>/sessions/<session>/inputs/x.md`).
+* The reader needs the path inside the run, and a page must not publish the host's: a session or run folder reads as the
+* path under it (`inputs/x.md`, or `./` for the folder itself), any other home folder as `~/`.
+*/
+const HOST_PATH = /\/(?:home|Users)\/[^/\s"'`]+(?:\/\.cache\/disco\/host\/[^/\s"'`]+(?:\/sessions\/[^/\s"'`]+)?)?(\/?)/g;
+function hostless(text) {
+	if (!text || !(text.includes("/home/") || text.includes("/Users/"))) return text;
+	return text.replace(HOST_PATH, (match, slash, at, all) => {
+		if (!match.includes("/.cache/disco/host/")) return slash ? "~/" : "~";
+		const next = all[at + match.length];
+		return slash && next !== void 0 && !/[\s"'`)]/.test(next) ? "" : "./";
+	});
+}
+/** An event with every recorded text read through `hostless`; an event without a host path is returned as it is. */
+function withoutHostPaths(event) {
+	const d = event.detail;
+	const text = hostless(d.publicText), reasoning = hostless(d.reasoning);
+	const calls = d.publicToolCalls?.map((call) => call.input && hostless(call.input) !== call.input ? {
+		...call,
+		input: hostless(call.input)
+	} : call);
+	if (text === d.publicText && reasoning === d.reasoning && calls?.every((call, i) => call === d.publicToolCalls[i]) !== false) return event;
+	return {
+		...event,
+		detail: {
+			...d,
+			...text !== void 0 ? { publicText: text } : {},
+			...reasoning !== void 0 ? { reasoning } : {},
+			...calls ? { publicToolCalls: calls } : {}
+		}
+	};
+}
+const fmt = (value) => new Intl.NumberFormat("en-US", {
+	notation: "compact",
+	maximumFractionDigits: 1
+}).format(value);
+const interval = (value) => value < 1e3 ? `${Math.round(value)} ms` : value < 6e4 ? `${(value / 1e3).toFixed(1)} s` : `${(value / 6e4).toFixed(1)} min`;
+const roleOf = (node) => node?.role ?? (node?.kind === "session" ? "Session" : node?.kind === "finding" ? "Finding" : "Agent");
+const textOf = (event) => event.detail.publicText ?? event.detail.recordedClaim ?? "";
+const toolKey = (node, id) => JSON.stringify([node, id]);
+function callsOf(event) {
+	const published = event.detail.publicToolCalls ?? [];
+	const byId = new Map(published.map((call) => [call.id, call]));
+	return [.../* @__PURE__ */ new Set([...event.detail.toolCallIds ?? [], ...published.map((call) => call.id)])].map((id) => byId.get(id) ?? {
+		id,
+		name: event.detail.toolNames?.length === 1 ? event.detail.toolNames[0] : "Tool call"
+	});
+}
+/** A run-scoped id (`<run>:s37`) reads as its own part. */
+const local = (value) => value.replace(/^[a-z0-9][\w.-]*-\d{8}[a-z]?:/i, "");
+/** A tool call's subject: its command, path or question, never its JSON. */
+function preview(call) {
+	if (call.input === void 0) return "args not captured";
+	try {
+		const value = JSON.parse(call.input);
+		if (value && typeof value === "object" && !Array.isArray(value)) {
+			const args = value;
+			for (const key of [
+				"command",
+				"cmd",
+				"filePath",
+				"file_path",
+				"path",
+				"query",
+				"question",
+				"pattern",
+				"url",
+				"pageId",
+				"title",
+				"task",
+				"prompt",
+				"message"
+			]) if (typeof args[key] === "string" && args[key]) return compact(local(args[key]));
+			const words = Object.values(args).filter((item) => [
+				"string",
+				"number",
+				"boolean"
+			].includes(typeof item));
+			if (words.length) return compact(words.map((item) => local(String(item))).join(" · "));
+		}
+	} catch {}
+	return compact(call.input);
+}
+/** Identity is established by the importer, never inferred from labels or timestamps. */
+function indexRecord(record) {
+	const nodes = new Map(record.nodes.map((node) => [node.id, node]));
+	const canonical = (id) => nodes.get(id)?.agentId ?? id;
+	const actors = record.nodes.filter((node) => node.kind !== "session" || !node.agentId);
+	const events = record.events.map(withoutHostPaths).sort((a, b) => ms(a.at) - ms(b.at));
+	const byEvent = new Map(events.map((event) => [event.id, event]));
+	const recordedOrder = new Map(record.events.map((event, i) => [event.id, i]));
+	const byActor = /* @__PURE__ */ new Map();
+	const results = /* @__PURE__ */ new Map();
+	const calls = /* @__PURE__ */ new Map();
+	for (const event of events) {
+		const actor = canonical(event.node);
+		const lane = byActor.get(actor) ?? [];
+		lane.push(event);
+		byActor.set(actor, lane);
+		for (const call of callsOf(event)) {
+			const key = toolKey(event.node, call.id);
+			const matching = calls.get(key) ?? [];
+			matching.push({
+				event,
+				call
+			});
+			calls.set(key, matching);
+		}
+		if (event.detail.toolCallId !== void 0) {
+			const key = toolKey(event.node, event.detail.toolCallId);
+			const matching = results.get(key) ?? [];
+			matching.push(event);
+			results.set(key, matching);
+		}
+	}
+	const times = events.map((event) => ms(event.at));
+	const start = times[0] ?? 0;
+	return {
+		nodes,
+		canonical,
+		actors,
+		events,
+		byEvent,
+		recordedOrder,
+		byActor,
+		calls,
+		results,
+		start,
+		end: events.reduce((latest, event) => Math.max(latest, event.end ? ms(event.end) : ms(event.at)), times.at(-1) ?? start)
+	};
+}
+/** Whether any event of this agent recorded token usage or a list price: a status alone measures nothing. */
+function measuredUsage(index, id) {
+	return (index.byActor.get(id) ?? []).some((event) => typeof event.detail.costListUsd === "number" || Object.values(event.detail.usage ?? {}).some((value) => typeof value === "number" && value > 0));
+}
+/** An agent's recorded state, qualified when nothing about it was measured or captured. A live agent has no terminal
+* state yet: `live` is its state while the run runs (Runtime's progress document), and it reads as working. */
+function agentState(node, measured, live) {
+	if (!node?.status && live) return live === "running" ? "working" : live.replaceAll("-", " ");
+	const status = node?.status ?? "no terminal state recorded";
+	if (measured) return status;
+	const capture = (node?.capture)?.status;
+	return `${status} · no usage recorded${capture === "absent" ? "; capture missing" : capture === "lossy" ? "; capture partial" : ""}`;
+}
+function eventMatches(event, index, query, category) {
+	return (category === "all" || category === "prompts" && (event.detail.promptKind === "initial" || event.detail.promptKind === "steering") || event.category === category || category === "findings" && (event.kind === "finding-record" || event.detail.recordedClaim !== void 0)) && (!query || JSON.stringify({
+		label: event.label,
+		node: index.nodes.get(index.canonical(event.node)),
+		detail: event.detail
+	}).toLowerCase().includes(query));
+}
+function eventSource(event, record, index) {
+	const node = index.nodes.get(event.node);
+	return {
+		...event.source,
+		runId: record.runId,
+		at: event.at,
+		observedNodeId: event.node,
+		agentId: node?.kind === "agent" ? node.id : node?.agentId ?? null,
+		nativeSessionId: node?.nativeSessionId ?? null,
+		joinBasis: node?.joinBasis ?? null,
+		joinProof: node?.joinProof ?? null
+	};
+}
+function hoverLines(event, index, cutoff) {
+	const lines = [`${index.nodes.get(index.canonical(event.node))?.label ?? event.node} · ${utcTime(event.at)}`, `${event.detail.role ?? event.kind}${event.detail.isError ? " · tool error" : event.detail.responseStatus === "error" ? " · request failed" : ""}`];
+	if (ms(event.at) > cutoff) return [...lines, "After the selected time. Select this event to advance."];
+	const usage = event.detail.usage;
+	if (usage) lines.push(`Input ${usage.input === void 0 ? "unknown" : fmt(usage.input)} · output ${usage.output === void 0 ? "unknown" : fmt(usage.output)} · cache read ${usage.cacheRead === void 0 ? "unknown" : fmt(usage.cacheRead)} · cache write ${usage.cacheWrite === void 0 ? "unknown" : fmt(usage.cacheWrite)}`);
+	const text = textOf(event);
+	if (text) lines.push(text.slice(0, 220) + (text.length > 220 ? "…" : ""));
+	for (const call of callsOf(event).slice(0, 3)) lines.push(`${call.name}: ${preview(call).slice(0, 220)}`);
+	if (!text && !callsOf(event).length && event.detail.role) lines.push(event.detail.contentOmitted ?? event.detail.publicationNote ?? "No text body is present in this record.");
+	return lines;
+}
+/** A declared model is configuration; only response metadata shows which model served. */
+function modelIdentity(node, record) {
+	if (!node) return null;
+	const served = [...new Set(record.nodes.filter((session) => session.agentId === node.id || session.id === node.id).map((session) => session.servedModel).filter((model) => Boolean(model)))];
+	return served.length ? `${served.join(", ")} (served)` : node.model ? `${node.model} (declared; served model unknown)` : null;
+}
+function tooltipSections(event, index, cutoff) {
+	const node = index.nodes.get(index.canonical(event.node));
+	const isError = event.detail.isError === true || event.detail.responseStatus === "error";
+	const category = event.detail.role ?? event.kind;
+	const title = event.label || category;
+	const sections = [{
+		kind: "header",
+		value: `${node?.label ?? event.node} · ${utcTime(event.at)}`,
+		tone: "muted"
+	}];
+	if (ms(event.at) > cutoff) {
+		sections.push({
+			kind: "note",
+			value: "After the selected time. Select this event to advance."
+		});
+		return {
+			title,
+			category,
+			tone: isError ? "error" : "default",
+			sections
+		};
+	}
+	if (event.detail.isError) sections.push({
+		kind: "status",
+		value: "Tool error",
+		tone: "error"
+	});
+	if (event.detail.responseStatus === "error") sections.push({
+		kind: "status",
+		value: "Request failed",
+		tone: "error"
+	});
+	const text = textOf(event);
+	if (text) sections.push({
+		kind: "body",
+		value: text.slice(0, 200) + (text.length > 200 ? "…" : "")
+	});
+	const calls = callsOf(event);
+	for (const call of calls.slice(0, 2)) sections.push({
+		kind: "body",
+		label: call.name,
+		value: preview(call).slice(0, 160)
+	});
+	const usage = event.detail.usage;
+	if (usage && !event.detail.usageScope) {
+		const parts = [];
+		if (usage.input !== void 0) parts.push(`↑ ${fmt(usage.input)}`);
+		if (usage.output !== void 0) parts.push(`↓ ${fmt(usage.output)}`);
+		if (usage.cacheRead !== void 0) parts.push(`⟳ ${fmt(usage.cacheRead)}`);
+		if (usage.cacheWrite !== void 0) parts.push(`→ ${fmt(usage.cacheWrite)}`);
+		if (parts.length) sections.push({
+			kind: "usage",
+			value: parts.join("  "),
+			tone: "accent"
+		});
+	}
+	const duration = event.detail.durationMs;
+	if (typeof duration === "number") sections.push({
+		kind: "status",
+		value: `⏱ ${duration < 1e3 ? `${duration}ms` : `${(duration / 1e3).toFixed(1)}s`}`,
+		tone: "muted"
+	});
+	return {
+		title,
+		category,
+		tone: isError ? "error" : "default",
+		sections
+	};
+}
+// src/run/record/conversation-rows.ts
+/**
+* A key that survives a live record growing. Event ids hash the whole source file, so every append renames every
+* event of that file. The harness's own record id (`nativeRecordId`, one per session line or part) does not change;
+* a call and its result can share one, so the kind and source item are part of the key. Without it, the node, source
+* path and position inside the file are stable too; without either, the event id is all there is.
+*/
+function anchorOf(event) {
+	const source = event.source;
+	const native = event.detail.nativeRecordId;
+	if (typeof native === "string" && native) return JSON.stringify([
+		event.node,
+		"native",
+		native,
+		event.kind,
+		source?.item ?? null
+	]);
+	if (source?.path) return JSON.stringify([
+		event.node,
+		source.path,
+		source.line ?? null,
+		source.pointer ?? null,
+		source.item ?? null
+	]);
+	return event.id;
+}
+/** Anchors for events in recorded order; a repeated position gets an occurrence suffix so keys stay unique. */
+function anchorsOf(events) {
+	const seen = /* @__PURE__ */ new Map();
+	const result = /* @__PURE__ */ new Map();
+	for (const event of events) {
+		const base = anchorOf(event);
+		const n = seen.get(base) ?? 0;
+		seen.set(base, n + 1);
+		result.set(event.id, n ? `${base}#${n}` : base);
+	}
+	return result;
+}
+/** Arguments the record holds no value for, or an empty object, are not distinguishable as content. */
+const emptyArgs = (input) => input === void 0 || /^\s*(\{\s*\}|null)?\s*$/.test(input);
+/** The argument text shown on a collapsed call row, or the honest absence of it. */
+function argsLabel(input) {
+	if (input === void 0) return "args not captured";
+	if (emptyArgs(input)) return "empty args";
+	return null;
+}
+/** The status word for a call. A missing result is pending while its agent can still answer it. */
+function callStatus(state, live) {
+	switch (state) {
+		case "error": return "Error";
+		case "returned": return "Returned";
+		case "pending": return "Not returned";
+		case "ambiguous": return "Ambiguous";
+		default: return live ? "Pending" : "Result not captured";
+	}
+}
+/** The output tokens a turn recorded, or null when its usage was not recorded. */
+function outputTokens(detail) {
+	const usage = detail.usage;
+	return typeof usage?.output === "number" && Number.isFinite(usage.output) ? usage.output : null;
+}
+/** A withheld-thinking turn is quiet glue when it recorded fewer output tokens than THINKING_SHOWN_TOKENS. */
+function quietThinking(detail) {
+	const output = outputTokens(detail);
+	return output !== null && output < 2e3;
+}
+/** Thinking whose text the record lacks, said as what happened. Never a reconstruction of the text. */
+function thinkingMarkers(detail) {
+	const count = (value) => typeof value === "number" && Number.isFinite(value) && value > 0 ? Math.floor(value) : 0;
+	const omitted = count(detail.reasoningOmitted);
+	const redacted = count(detail.reasoningRedacted);
+	const marks = [];
+	if (omitted) marks.push(omitted === 1 ? "thinking not returned by provider" : `${omitted} thinking blocks not returned by provider`);
+	if (redacted) marks.push(redacted === 1 ? "thinking redacted (encrypted)" : `${redacted} thinking blocks redacted (encrypted)`);
+	return marks;
+}
+const WAITING = /await|wait|poll|sleep|observe|status/i;
+/**
+* A result that only says the call is still running: a JSON object with `pending: true` (Runtime's coordination tools
+* answer a long call this way, with its elapsed time, before its real answer). It carries no answer, so a call whose
+* every result is one still counts as unanswered for collapsing.
+*/
+function pendingReceipt(text) {
+	if (typeof text !== "string" || !text.trimStart().startsWith("{")) return false;
+	try {
+		const value = JSON.parse(text);
+		return Boolean(value) && typeof value === "object" && !Array.isArray(value) && value.pending === true;
+	} catch {
+		return false;
+	}
+}
+/** Whether any of a call's results answers it: a result that is not a pending receipt. */
+const answeredBy = (results) => (results ?? []).some((result) => !pendingReceipt(result.detail.publicText));
+/**
+* The one call of an event that is a poll: an assistant turn whose only content is a single tool call, with no text,
+* thinking, note or clipped body, and with no answer anywhere in the record: no result, or only pending receipts
+* (pendingReceipt). A call with any other result is never a poll, so collapsing can hide no returned answer. Its arguments are empty or absent, or the
+* tool is a waiting tool (await, wait, poll, sleep, observe, status).
+*/
+function pollCall(event, calls, answered) {
+	const detail = event.detail;
+	if (detail.role !== "assistant" || event.category === "lifecycle" || detail.lifecycle !== void 0) return null;
+	if (detail.publicText || detail.recordedClaim || detail.reasoning || detail.responseStatus === "error" || detail.contentOmitted || detail.publicationNote || detail.clip || thinkingMarkers(detail).length) return null;
+	if (calls.length !== 1) return null;
+	const call = calls[0];
+	if (call.clip || call.publicationNote || answered(call.id)) return null;
+	if (!emptyArgs(call.input) && !WAITING.test(call.name)) return null;
+	return call;
+}
+/**
+* The calls of a hollow turn: an assistant tool turn with no text, thinking, or notes whose every call has neither
+* captured arguments nor a captured answer. Nothing in it can be shown but the fact that it ran, so a run of them
+* collapses to one row. A call with any captured side keeps its own row.
+*/
+function hollowCalls(event, calls, captured) {
+	const detail = event.detail;
+	if (detail.role !== "assistant" || event.category === "lifecycle" || detail.lifecycle !== void 0) return null;
+	if (detail.publicText || detail.recordedClaim || detail.reasoning || detail.responseStatus === "error" || detail.contentOmitted || detail.publicationNote || detail.clip || thinkingMarkers(detail).length) return null;
+	if (!calls.length) return null;
+	if (calls.some((call) => call.input !== void 0 || call.clip || call.publicationNote || captured(event, call.id))) return null;
+	return calls;
+}
+/** Fold consecutive rows only; a user message, error or substantive work always breaks the group. */
+function foldRows(rows, identify, same, build, min = 2) {
+	const out = [];
+	let run = null;
+	const close = () => {
+		if (run) out.push(...run.rows.length >= min ? [build(run.rows.map((r) => r.event), run.value)] : run.rows);
+		run = null;
+	};
+	for (const row of rows) {
+		const value = row.kind === "event" ? identify(row.event) : null;
+		if (value === null) {
+			close();
+			out.push(row);
+			continue;
+		}
+		if (run && !same(run.value, value)) close();
+		run ??= {
+			rows: [],
+			value
+		};
+		run.rows.push(row);
+	}
+	close();
+	return out;
+}
+function collapseHollowTurns(rows, { callsOf, captured, keyOf, min = 2 }) {
+	return foldRows(rows, (event) => hollowCalls(event, callsOf(event), captured), () => true, (events) => {
+		const counts = /* @__PURE__ */ new Map();
+		for (const event of events) for (const call of callsOf(event)) counts.set(call.name, (counts.get(call.name) ?? 0) + 1);
+		const times = events.map((event) => Date.parse(event.at)).filter(Number.isFinite);
+		return {
+			kind: "hollow",
+			key: `hollow:${keyOf(events[0])}`,
+			events,
+			calls: [...counts].map(([name, count]) => ({
+				name,
+				count
+			})),
+			spanMs: times.length > 1 ? Math.max(...times) - Math.min(...times) : 0
+		};
+	}, min);
+}
+function hollowSummary(calls) {
+	const total = calls.reduce((sum, entry) => sum + entry.count, 0);
+	return `${total} tool call${total === 1 ? "" : "s"} · ${calls.map((entry) => entry.count > 1 ? `${entry.name} ×${entry.count}` : entry.name).join(" · ")}`;
+}
+function collapsePolls(items, { callsOf, answered, keyOf, min = 2 }) {
+	return foldRows(items.map((event) => ({
+		kind: "event",
+		key: keyOf(event),
+		event
+	})), (event) => pollCall(event, callsOf(event), (id) => answered(event, id)), (a, b) => a.name === b.name && (emptyArgs(a.input) ? "" : a.input.trim()) === (emptyArgs(b.input) ? "" : b.input.trim()), (events, call) => ({
+		kind: "polls",
+		key: `polls:${keyOf(events[0])}`,
+		name: call.name,
+		input: call.input,
+		events
+	}), min);
+}
+/** Exact repeated idle replies fold without hiding changed statements, tools, errors, prompts or source evidence. */
+function collapseIdleTurns(rows, callsOf) {
+	return foldRows(rows, (event) => {
+		const d = event.detail;
+		if (d.role !== "assistant" || event.category === "lifecycle" || d.lifecycle || d.reasoning || d.recordedClaim || d.responseStatus === "error" || d.isError || d.contentOmitted || d.publicationNote || d.clip || thinkingMarkers(d).length || callsOf(event).length) return null;
+		const text = typeof d.publicText === "string" ? d.publicText.trim() : "";
+		return text.length <= 280 && /\b(waiting|ending the turn|end turn|no new updates|nothing new)\b/i.test(text) ? text : null;
+	}, (a, b) => a === b, (events) => ({
+		kind: "idle",
+		key: `idle:${anchorOf(events[0])}`,
+		events
+	}));
+}
+/** `6m 12s`, `45s`, `1h 3m`. */
+function waited(milliseconds) {
+	const seconds = Math.max(0, Math.round(milliseconds / 1e3));
+	if (seconds < 60) return `${seconds}s`;
+	const minutes = Math.floor(seconds / 60);
+	if (minutes < 60) return `${minutes}m ${seconds % 60}s`;
+	return `${Math.floor(minutes / 60)}h ${minutes % 60}m`;
+}
+/**
+* The collapsed row's facts. Tokens count only per-response usage recorded on the polls themselves; with none
+* recorded the count is unknown, never zero.
+*/
+function pollSummary(events) {
+	const times = events.map((event) => Date.parse(event.at)).filter(Number.isFinite);
+	const span = times.length ? Math.max(...times) - Math.min(...times) : 0;
+	let tokens = 0;
+	let measured = 0;
+	for (const event of events) {
+		const usage = event.detail.usage;
+		if (!usage || event.detail.usageScope !== void 0) continue;
+		const parts = [
+			usage.input,
+			usage.output,
+			usage.cacheRead,
+			usage.cacheWrite
+		].filter((value) => typeof value === "number");
+		if (!parts.length) continue;
+		measured++;
+		tokens += parts.reduce((sum, value) => sum + value, 0);
+	}
+	const count = new Intl.NumberFormat("en-US", {
+		notation: "compact",
+		maximumFractionDigits: 1
+	});
+	const tokenText = !measured ? "tokens unknown" : measured < events.length ? `~${count.format(tokens)} tokens (${measured} of ${events.length} measured)` : `~${count.format(tokens)} tokens`;
+	return {
+		polls: events.length,
+		spanMs: span,
+		tokens: measured ? tokens : null,
+		measured,
+		label: `waited ${waited(span)} · ${events.length} polls · ${tokenText}`
+	};
+}
+// src/run/record/prompt-text.ts
+/**
+* A prompt as its reader wrote it (REVIEW-8 #5: the first message rendered raw JSON with literal \n\n). The CLI bridge
+* frames every user turn as "[system] <session resources and permission posture>\n\n[user] <payload>"; the frame is the
+* same on every turn and stays in the event's source (Details). A payload that is a JSON assignment (program, idea,
+* objective, instruction, ...) reads as its objective and instruction; any other payload is shown as written.
+*/
+function promptText(text) {
+	const at = text.indexOf("[user] ");
+	const payload = text.startsWith("[system] ") && at >= 0 ? text.slice(at + 7).trim() : text.trim();
+	if (!payload.startsWith("{")) return payload;
+	try {
+		const value = JSON.parse(payload);
+		const parts = ["objective", "instruction"].map((key) => value[key]).filter((part) => typeof part === "string" && part.trim().length > 0);
+		return parts.length ? parts.join("\n\n") : payload;
+	} catch {
+		return payload;
+	}
+}
+// src/run/record/ConversationRowView.tsx
+/** Shared chat bubbles, speaker headers and timeline steps; source rows retain virtualization and provenance. */
+/** A run-lifecycle event (start, stop, restart), drawn as a thin marker row. */
+const isLifecycle = (event) => event.category === "lifecycle" || event.detail.lifecycle !== void 0;
+const tokenLabel = (value) => new Intl.NumberFormat("en-US", {
+	notation: "compact",
+	maximumFractionDigits: 1
+}).format(value);
+const spanLabel = (value) => {
+	const seconds = Math.round(value / 1e3);
+	if (seconds < 60) return `${seconds} s`;
+	const minutes = Math.floor(seconds / 60);
+	return minutes < 60 ? `${minutes} m ${seconds % 60} s` : `${Math.floor(minutes / 60)} h ${minutes % 60} m`;
+};
+function ToolIcon({ name }) {
+	const lower = name.toLowerCase();
+	const path = /think|reason/.test(lower) ? "M8 2.5a4 4 0 0 0-2.5 7.1V11h5V9.6A4 4 0 0 0 8 2.5M6 13.5h4" : /search|grep|find/.test(lower) ? "M10 10l3.5 3.5M11 7a4 4 0 1 0-8 0 4 4 0 0 0 8 0" : /bash|shell|exec|run|command/.test(lower) ? "M2 3h12v10H2zM4 6l2 2-2 2M8 10h4" : /await|wait|sleep|poll/.test(lower) ? "M8 2.5a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11M8 5v3l2 1.5" : "M10 8a2 2 0 1 0-4 0 2 2 0 0 0 4 0";
+	return /* @__PURE__ */ jsx("svg", {
+		viewBox: "0 0 16 16",
+		width: "14",
+		height: "14",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ jsx("path", {
+			d: path,
+			stroke: "currentColor",
+			strokeWidth: "1.4",
+			fill: "none",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+/** The tools the kit names itself ("Read", "Shell"); any other tool reads by its own name. */
+const KIT_TOOLS = /* @__PURE__ */ new Set([
+	"bash",
+	"shell",
+	"command",
+	"execute",
+	"write",
+	"write_file",
+	"create_file",
+	"edit",
+	"patch",
+	"read",
+	"read_file",
+	"cat",
+	"grep",
+	"search",
+	"rg",
+	"glob",
+	"find",
+	"ls",
+	"web_search",
+	"web_fetch",
+	"fetch",
+	"task",
+	"agent",
+	"spawn"
+]);
+const TYPES = {
+	bash: "bash",
+	shell: "bash",
+	command: "bash",
+	execute: "bash",
+	read: "read",
+	read_file: "read",
+	cat: "read",
+	write: "write",
+	write_file: "write",
+	create_file: "write",
+	edit: "edit",
+	patch: "edit",
+	grep: "grep",
+	search: "grep",
+	rg: "grep",
+	glob: "glob",
+	find: "glob",
+	ls: "list"
+};
+/** `mcp__server__tool` reads as `tool` and `agent-runtime-coordination_send` as `coordination_send`. */
+const toolName = (name) => (name.startsWith("mcp__") ? name.slice(name.lastIndexOf("__") + 2) || name : name).replace(/^agent-runtime-/, "");
+const inputOf = (raw) => {
+	if (raw === void 0) return void 0;
+	try {
+		const value = JSON.parse(raw);
+		return value && typeof value === "object" ? value : raw;
+	} catch {
+		return raw;
+	}
+};
+/** A failure reads as its message: `{"error":"File not found: x"}` is `File not found: x`. */
+const failureText = (text) => {
+	let body = text;
+	try {
+		const value = JSON.parse(text);
+		const said = typeof value?.error === "string" ? value.error : typeof value?.message === "string" ? value.message : void 0;
+		if (said) body = said;
+	} catch {}
+	return compact(body.split("\n").find((line) => line.trim()) ?? "").slice(0, 200);
+};
+/** One tool call as the kit's row: its verb and subject, collapsed; the input and output when opened; failures inline. */
+function toolItems(id, call, result, state, durationMs, live, opener) {
+	const name = toolName(call.name);
+	const output = result ? textOf(result) || result.detail.contentOmitted || "" : void 0;
+	const status = state === "error" ? "error" : state === "pending" || state === "missing" && live ? "running" : "completed";
+	const note = state === "ambiguous" || state === "missing" && !live ? callStatus(state, live) : void 0;
+	const part = {
+		type: "tool",
+		id,
+		tool: name,
+		state: {
+			status,
+			input: inputOf(call.input),
+			...output !== void 0 ? { output } : {},
+			...status === "error" ? { error: failureText(output ?? "") || "The call failed." } : {},
+			...durationMs !== null && durationMs >= 0 ? { time: {
+				start: 0,
+				end: durationMs
+			} } : {},
+			...note ? { metadata: { note } } : {}
+		}
+	};
+	const known = KIT_TOOLS.has(name.toLowerCase());
+	const meta = getToolDisplayMetadata(part);
+	const detail = argsLabel(call.input) ?? (meta.description || (known ? void 0 : preview(call)));
+	const item = {
+		id,
+		kind: "tool",
+		part,
+		call: {
+			id,
+			type: TYPES[name.toLowerCase()] ?? "unknown",
+			label: known ? meta.title : name.replaceAll("_", " "),
+			status: status === "error" ? "error" : status === "running" ? "running" : "success",
+			...detail ? { detail } : {},
+			...durationMs !== null && durationMs >= 0 ? { duration: durationMs } : {}
+		}
+	};
+	const clip = clipOf(result?.detail.clip);
+	return result && clip ? [item, {
+		id: `${id}:clip`,
+		kind: "custom",
+		content: /* @__PURE__ */ jsx(ClipNote, {
+			clip,
+			open: opener(result)
+		})
+	}] : [item];
+}
+const toolNote = (part) => {
+	const note = part.state.metadata?.note;
+	return note ? /* @__PURE__ */ jsx("span", {
+		className: "tool-note",
+		children: note
+	}) : null;
+};
+const clipOf = (value) => value && typeof value === "object" && "bytes" in value ? value : void 0;
+/** A clipped body names what was left out and opens its full source text. */
+function ClipNote({ clip, open }) {
+	if (!clip) return null;
+	return /* @__PURE__ */ jsxs("p", {
+		className: "clip-note",
+		children: [/* @__PURE__ */ jsxs("span", { children: [new Intl.NumberFormat("en-US").format(clip.bytes), " bytes, middle omitted."] }), clip.sha256 && open ? /* @__PURE__ */ jsx("button", {
+			type: "button",
+			className: "link-button",
+			"data-load-full": clip.sha256,
+			onClick: () => open(clip.sha256),
+			children: "Full output"
+		}) : null]
+	});
+}
+/** Repeated calls answered only by pending receipts: one row, the calls listed when opened. */
+function pollItem(row) {
+	const summary = pollSummary(row.events);
+	const args = argsLabel(row.input) ?? compact(row.input ?? "");
+	return {
+		id: row.key,
+		kind: "custom",
+		content: /* @__PURE__ */ jsx(RunRowShell, {
+			icon: /* @__PURE__ */ jsx(ToolIcon, { name: row.name }),
+			title: toolName(row.name),
+			description: [summary.label, args].filter(Boolean).join(" · "),
+			descriptionMono: true,
+			children: /* @__PURE__ */ jsx("ol", {
+				className: "poll-calls",
+				children: row.events.map((event) => /* @__PURE__ */ jsxs("li", {
+					"data-message": event.id,
+					children: [/* @__PURE__ */ jsx("time", {
+						dateTime: event.at,
+						children: utcTime(event.at)
+					}), /* @__PURE__ */ jsx("span", {
+						className: "mono",
+						children: argsLabel(callsOf(event)[0]?.input) ?? compact(callsOf(event)[0]?.input ?? "")
+					})]
+				}, event.id))
+			})
+		})
+	};
+}
+/** Consecutive tool turns whose arguments and results were not captured: one row naming the calls. */
+const hollowItem = (row) => ({
+	id: row.key,
+	kind: "custom",
+	content: /* @__PURE__ */ jsx(RunRowShell, {
+		icon: /* @__PURE__ */ jsx(ToolIcon, { name: row.calls[0]?.name ?? "tool" }),
+		title: hollowSummary(row.calls),
+		description: "args not captured",
+		durationMs: row.spanMs || void 0
+	})
+});
+/** What one record row shows, as the kit's timeline items. */
+function rowItems(row, context) {
+	if (row.kind === "polls") return [pollItem(row)];
+	if (row.kind === "hollow") return [hollowItem(row)];
+	if (row.kind === "idle") return [{
+		id: `${row.key}:${context.selected ?? ""}`,
+		kind: "fold",
+		summary: `${row.events.length} idle turns · ${textOf(row.events[0])}`,
+		defaultOpen: row.events.some((event) => event.id === context.selected),
+		items: row.events.map((event) => ({
+			id: event.id,
+			kind: "custom",
+			content: /* @__PURE__ */ jsxs("div", {
+				className: "ar-idle-event",
+				"data-message": event.id,
+				children: [/* @__PURE__ */ jsx("time", {
+					dateTime: event.at,
+					children: utcTime(event.at)
+				}), /* @__PURE__ */ jsx(AgentTimelineStep, { item: {
+					id: event.id,
+					kind: "message",
+					role: "assistant",
+					content: textOf(event)
+				} })]
+			})
+		}))
+	}];
+	const { index, cutoff, anchor, thinkingSpan, opened, paired, live } = context;
+	const event = row.event;
+	if (isLifecycle(event)) {
+		const text = textOf(event);
+		return [{
+			id: event.id,
+			kind: "custom",
+			content: /* @__PURE__ */ jsxs("p", {
+				className: `lifecycle-note${event.detail.isError ? " lifecycle-error" : ""}`,
+				children: [/* @__PURE__ */ jsx("b", { children: event.label }), text && /* @__PURE__ */ jsx("span", { children: compact(text).slice(0, 280) })]
+			})
+		}];
+	}
+	const message = textOf(event);
+	const calls = callsOf(event);
+	const reasoning = typeof event.detail.reasoning === "string" ? event.detail.reasoning : "";
+	const withheld = thinkingMarkers(event.detail);
+	const failed = event.detail.responseStatus === "error";
+	const finding = event.detail.recordedClaim !== void 0;
+	const standalone = event.detail.toolCallId !== void 0 || event.detail.role === "toolResult";
+	if (event.detail.role === "user" && message && !standalone) {
+		const body = promptText(message);
+		const short = body.length > 280 && !opened.has(`prompt:${anchor(event)}`);
+		return [{
+			id: event.id,
+			kind: "message",
+			role: "user",
+			content: short ? `${body.slice(0, 280).trimEnd()}…` : body,
+			timestamp: new Date(event.at)
+		}];
+	}
+	const items = [];
+	if (reasoning) items.push({
+		id: `${event.id}:reasoning`,
+		kind: "custom",
+		content: /* @__PURE__ */ jsx(InlineThinkingItem, {
+			part: {
+				type: "reasoning",
+				text: reasoning
+			},
+			autoCollapse: false
+		})
+	});
+	if (withheld.length) {
+		const output = outputTokens(event.detail);
+		const span = thinkingSpan.get(event.id);
+		const label = output !== null ? `${span !== void 0 && span >= 1e3 ? `for ${spanLabel(span)} · ` : ""}${tokenLabel(output)} output tokens · ${withheld.join(" · ")}` : withheld.join(" · ");
+		items.push({
+			id: `${event.id}:thinking`,
+			kind: "custom",
+			content: /* @__PURE__ */ jsx("span", {
+				"data-thinking-withheld": true,
+				children: /* @__PURE__ */ jsx(RunRowShell, {
+					icon: /* @__PURE__ */ jsx(ToolIcon, { name: "think" }),
+					title: "Thought",
+					description: label
+				})
+			})
+		});
+	}
+	if (failed) items.push({
+		id: event.id,
+		kind: "status",
+		tone: "error",
+		label: "The request failed",
+		detail: message ? compact(message).slice(0, 400) : "No assistant response is present in this record."
+	});
+	else if (finding) items.push({
+		id: event.id,
+		kind: "status",
+		tone: "info",
+		label: "Recorded finding",
+		detail: compact(message).slice(0, 600)
+	});
+	else if (standalone) {
+		const unpaired = event.detail.toolCallId !== void 0 && (index.calls.get(toolKey(event.node, event.detail.toolCallId))?.length ?? 0) > 1;
+		items.push(...toolItems(event.id, {
+			id: event.id,
+			name: event.label || "Tool result"
+		}, event, unpaired ? "ambiguous" : event.detail.isError ? "error" : "returned", null, live, context.opener));
+	} else if (message) items.push({
+		id: event.id,
+		kind: "message",
+		role: "assistant",
+		content: message
+	});
+	else if (!calls.length && !reasoning && !withheld.length) items.push({
+		id: event.id,
+		kind: "status",
+		label: event.detail.contentOmitted ?? "No text body is present in this record."
+	});
+	const at = anchor(event);
+	for (const call of calls) {
+		const all = paired(event, call);
+		const last = all.filter((result) => ms(result.at) <= cutoff).at(-1);
+		const state = (index.calls.get(toolKey(event.node, call.id))?.length ?? 0) > 1 ? "ambiguous" : last ? last.detail.isError ? "error" : "returned" : all.some((result) => ms(result.at) > cutoff) ? "pending" : "missing";
+		const duration = (typeof last?.detail.durationMs === "number" ? last.detail.durationMs : null) ?? (last && last.detail.atBasis !== "carried" ? ms(last.at) - ms(event.at) : null);
+		items.push(...toolItems(`tool:${at}:${call.id}`, call, last, state, duration, live, context.opener));
+	}
+	return items;
+}
+/** The kind of a row's last item, which sets the gap above the next row. */
+const lastKind = (items) => items.length ? agentTimelineStepKind(items[items.length - 1]) : void 0;
+function ConversationRowView({ row, items, previous, turn, context }) {
+	const { selected, opened, anchor, setOpen, flagMarks, opener, flags } = context;
+	const events = row.kind === "event" ? [row.event] : row.events;
+	const event = events[0];
+	const steps = /* @__PURE__ */ jsxs(Fragment, { children: [turn && /* @__PURE__ */ jsxs("div", {
+		className: "ar-turn",
+		"data-turn-start": true,
+		children: [/* @__PURE__ */ jsx(SpeakerHeader, { speaker: {
+			id: event.node,
+			name: context.index.nodes.get(event.node)?.label ?? "Agent"
+		} }), /* @__PURE__ */ jsx("time", {
+			dateTime: event.at,
+			title: event.at,
+			children: utcTime(event.at)
+		})]
+	}), items.map((item, i) => /* @__PURE__ */ jsx(AgentTimelineStep, {
+		item,
+		previous: i ? agentTimelineStepKind(items[i - 1]) : previous,
+		renderToolActions: toolNote
+	}, item.id))] });
+	const rowProps = {
+		className: [
+			"chat-row",
+			events.some((e) => e.id === selected) && "selected",
+			row.kind === "event" && flags?.has(event.id) && "flagged"
+		].filter(Boolean).join(" "),
+		"data-entry": event.id,
+		title: utcTime(event.at),
+		...row.kind === "event" ? {
+			"data-message": event.id,
+			"data-message-node": event.node
+		} : { [`data-${row.kind === "polls" ? "poll" : row.kind}-group`]: row.events.length }
+	};
+	if (row.kind !== "event" || isLifecycle(event)) return /* @__PURE__ */ jsxs("div", {
+		...rowProps,
+		children: [steps, row.kind === "event" && flagMarks(event)]
+	});
+	const message = textOf(event);
+	const standalone = event.detail.toolCallId !== void 0 || event.detail.role === "toolResult";
+	const clip = clipOf(event.detail.clip);
+	if (event.detail.role === "user" && message && !standalone) {
+		const key = `prompt:${anchor(event)}`;
+		const long = promptText(message).length > 280;
+		const short = long && !opened.has(key);
+		return /* @__PURE__ */ jsxs("article", {
+			...rowProps,
+			children: [
+				steps,
+				long && /* @__PURE__ */ jsx("p", {
+					className: "ar-prompt-more",
+					children: /* @__PURE__ */ jsx("button", {
+						type: "button",
+						className: "link-button",
+						"data-open-key": key,
+						"aria-expanded": !short,
+						onClick: () => setOpen(key, short),
+						children: short ? "Full prompt" : "Shorter"
+					})
+				}),
+				!short && /* @__PURE__ */ jsx(ClipNote, {
+					clip,
+					open: opener(event)
+				}),
+				flagMarks(event)
+			]
+		});
+	}
+	const finding = event.detail.recordedClaim !== void 0;
+	const notes = [event.detail.publicationNote, finding ? event.detail.assessment : void 0].filter((note) => Boolean(note));
+	return /* @__PURE__ */ jsxs("article", {
+		...rowProps,
+		children: [
+			steps,
+			message && !standalone && /* @__PURE__ */ jsx(ClipNote, {
+				clip: callsOf(event).length ? void 0 : clip,
+				open: opener(event)
+			}),
+			notes.map((note) => /* @__PURE__ */ jsx("p", {
+				className: "publication-note",
+				children: note
+			}, note)),
+			flagMarks(event)
+		]
+	});
+}
+// src/run/record/Conversation.tsx
+function Conversation({ index, actor, cutoff, query, category, selected, openSource, flags, onFlag, lifecycle = false, live = false, follow = live, opening }) {
+	const [opened, setOpened] = useState(() => {
+		const at = anchorsOf(index.events);
+		return new Set(index.events.filter((event) => event.detail.promptKind === "initial").map((event) => `prompt:${at.get(event.id) ?? event.id}`));
+	});
+	const scroll = useRef(null);
+	const anchors = useMemo(() => anchorsOf(index.events), [index]);
+	const anchor = useCallback((event) => anchors.get(event.id) ?? event.id, [anchors]);
+	const opener = (event) => openSource ? (sha256) => openSource(sha256, event) : void 0;
+	const setOpen = (key, open) => setOpened((current) => {
+		if (current.has(key) === open) return current;
+		const next = new Set(current);
+		if (open) next.add(key);
+		else next.delete(key);
+		return next;
+	});
+	const paired = (event, call) => {
+		const key = toolKey(event.node, call.id);
+		return index.calls.get(key)?.length === 1 ? index.results.get(key) ?? [] : [];
+	};
+	const target = useMemo(() => {
+		if (!selected) return void 0;
+		const event = index.byEvent.get(selected);
+		if (event?.detail.toolCallId !== void 0) {
+			const calls = index.calls.get(toolKey(event.node, event.detail.toolCallId));
+			if (calls?.length === 1) return calls[0].event.id;
+		}
+		return selected;
+	}, [selected, index]);
+	const items = useMemo(() => (index.byActor.get(actor) ?? []).filter((event) => {
+		if (ms(event.at) > cutoff) return false;
+		if (event.id === target) return true;
+		if (isLifecycle(event)) return lifecycle && eventMatches(event, index, query, category);
+		if (event.detail.toolCallId !== void 0) {
+			const matching = index.calls.get(toolKey(event.node, event.detail.toolCallId));
+			if (matching?.length === 1 && ms(matching[0].event.at) <= cutoff) return false;
+		}
+		const calls = callsOf(event);
+		if (!(event.detail.role || textOf(event) || event.detail.reasoning || event.detail.responseStatus === "error" || calls.length)) return false;
+		if (event.detail.role === "assistant" && !textOf(event) && !event.detail.reasoning && !calls.length && event.detail.responseStatus !== "error" && !event.detail.contentOmitted && (!thinkingMarkers(event.detail).length || quietThinking(event.detail))) return false;
+		if (eventMatches(event, index, query, category)) return true;
+		return calls.some((call) => {
+			const key = toolKey(event.node, call.id);
+			return index.calls.get(key)?.length === 1 && (index.results.get(key) ?? []).some((result) => ms(result.at) <= cutoff && eventMatches(result, index, query, category));
+		});
+	}), [
+		index,
+		actor,
+		cutoff,
+		query,
+		category,
+		lifecycle,
+		target
+	]);
+	const shown = useMemo(() => {
+		if (!opening?.text || query || category !== "all" || items.some((event) => event.detail.role === "user" && event.detail.promptKind !== "steering")) return items;
+		const first = items[0]?.at ?? opening.at;
+		return [{
+			id: `${actor}:opening`,
+			node: actor,
+			at: first < opening.at ? first : opening.at,
+			kind: "message",
+			category: "other",
+			label: "prompt",
+			detail: {
+				role: "user",
+				publicText: opening.text,
+				promptKind: "initial"
+			}
+		}, ...items];
+	}, [
+		items,
+		opening,
+		actor,
+		query,
+		category
+	]);
+	const rows = useMemo(() => collapseIdleTurns(collapseHollowTurns(collapsePolls(shown, {
+		callsOf,
+		answered: (event, id) => answeredBy(index.results.get(toolKey(event.node, id))),
+		keyOf: anchor
+	}), {
+		callsOf,
+		captured: (event, id) => (index.results.get(toolKey(event.node, id)) ?? []).some((result) => textOf(result)),
+		keyOf: anchor
+	}), callsOf), [
+		shown,
+		index,
+		anchor
+	]);
+	const thinkingSpan = useMemo(() => {
+		const spans = /* @__PURE__ */ new Map();
+		let previous = null;
+		for (const event of index.byActor.get(actor) ?? []) {
+			const at = ms(event.at);
+			if (previous !== null && Number.isFinite(at) && thinkingMarkers(event.detail).length) spans.set(event.id, Math.max(0, at - previous));
+			if (Number.isFinite(at)) previous = at;
+		}
+		return spans;
+	}, [index, actor]);
+	const rowOf = useMemo(() => {
+		const map = /* @__PURE__ */ new Map();
+		for (const row of rows) if (row.kind !== "event") for (const event of row.events) map.set(event.id, row.key);
+		else map.set(row.event.id, row.key);
+		return map;
+	}, [rows]);
+	const retained = (index.byActor.get(actor) ?? []).some((item) => !isLifecycle(item) && (item.detail.role || textOf(item) || callsOf(item).length));
+	const targetRef = useRef(target);
+	targetRef.current = target;
+	const following = useRef(false);
+	const followRef = useRef(follow);
+	followRef.current = follow;
+	useLayoutEffect(() => {
+		following.current = follow && !targetRef.current;
+		if (scroll.current && !targetRef.current) scroll.current.scrollTop = follow ? scroll.current.scrollHeight : 0;
+	}, [actor]);
+	useLayoutEffect(() => {
+		if (!follow) following.current = false;
+	}, [follow]);
+	useEffect(() => {
+		const element = scroll.current;
+		if (!element) return;
+		const track = () => {
+			following.current = followRef.current && element.scrollHeight - element.scrollTop - element.clientHeight < 24;
+		};
+		element.addEventListener("scroll", track, { passive: true });
+		return () => element.removeEventListener("scroll", track);
+	}, []);
+	useLayoutEffect(() => {
+		const element = scroll.current;
+		if (!element || !following.current) return;
+		element.scrollTop = element.scrollHeight;
+		let frames = 0;
+		let frame = requestAnimationFrame(function pin() {
+			if (!following.current) return;
+			element.scrollTop = element.scrollHeight;
+			if (++frames < 20) frame = requestAnimationFrame(pin);
+		});
+		return () => cancelAnimationFrame(frame);
+	}, [rows]);
+	useEffect(() => {
+		if (!selected) return;
+		const event = index.byEvent.get(selected);
+		if (!event) return;
+		const keys = [`prompt:${anchor(event)}`, `reasoning:${anchor(event)}`];
+		if (event.detail.toolCallId !== void 0) for (const match of index.calls.get(toolKey(event.node, event.detail.toolCallId)) ?? []) keys.push(`tool:${anchor(match.event)}:${match.call.id}`, rowOf.get(match.event.id) ?? "");
+		for (const call of callsOf(event)) keys.push(`tool:${anchor(event)}:${call.id}`);
+		const row = rowOf.get(selected);
+		if (row?.startsWith("polls:")) keys.push(row);
+		setOpened((current) => /* @__PURE__ */ new Set([...current, ...keys.filter(Boolean)]));
+	}, [selected, index]);
+	const flagMarks = (event) => {
+		const marks = flags?.get(event.id);
+		if (!marks?.length) return null;
+		return /* @__PURE__ */ jsx("span", {
+			className: "event-flags",
+			children: marks.map((flag) => /* @__PURE__ */ jsx("button", {
+				type: "button",
+				className: `event-flag polarity-${flag.polarity}`,
+				title: flag.title,
+				"data-flag": flag.dimension,
+				onClick: () => onFlag?.(flag, event),
+				children: flag.dimension
+			}, `${flag.dimension}:${flag.label}`))
+		});
+	};
+	const keyOf = useCallback((row) => row.key, []);
+	const estimate = useCallback((row) => row.kind !== "event" ? 36 : isLifecycle(row.event) ? 26 : !textOf(row.event) && callsOf(row.event).length ? 16 + 36 * callsOf(row.event).length : 96, []);
+	const context = {
+		index,
+		cutoff,
+		selected,
+		opened,
+		anchor,
+		opener,
+		setOpen,
+		flagMarks,
+		paired,
+		thinkingSpan,
+		flags,
+		live
+	};
+	const itemsOf = useMemo(() => rows.map((row) => rowItems(row, context)), [
+		rows,
+		opened,
+		cutoff,
+		selected,
+		live,
+		index,
+		thinkingSpan
+	]);
+	const turns = useMemo(() => {
+		let previous;
+		return rows.map((row) => {
+			const event = row.kind === "event" ? row.event : row.events[0];
+			const turn = event.detail.role === "assistant" && !isLifecycle(event) && (!previous || previous.detail.role === "user" || (event.detail.attempt !== void 0 ? event.detail.attempt !== previous.detail.attempt : ms(event.at) - ms(previous.at) > 12e4));
+			previous = row.kind === "event" ? event : row.events.at(-1);
+			return turn;
+		});
+	}, [rows]);
+	const render = (row, i) => /* @__PURE__ */ jsx(ConversationRowView, {
+		row,
+		items: itemsOf[i] ?? [],
+		previous: i ? lastKind(itemsOf[i - 1] ?? []) : void 0,
+		turn: turns[i],
+		context
+	});
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", {
+		className: "record-conversation conversation-scroll",
+		"data-chat": true,
+		ref: scroll,
+		tabIndex: 0,
+		"aria-label": "Scrollable retained conversation",
+		children: [!rows.length && /* @__PURE__ */ jsx("p", {
+			className: "chat-empty",
+			children: query || category !== "all" ? "No messages match this filter." : retained ? "No messages at the selected time." : "Conversation not retained. Its absence does not mean the agent did no work."
+		}), /* @__PURE__ */ jsx(AgentTimelineColumn, {
+			className: "ar-chat",
+			children: /* @__PURE__ */ jsx(VirtualList, {
+				items: rows,
+				keyOf,
+				render,
+				scroller: scroll,
+				target: target ? rowOf.get(target) : void 0,
+				estimate
+			})
+		})]
+	}) });
+}
+// src/run/record/prompts.ts
+/** The conversation needs an opening prompt even when the provider did not retain its first user turn. */
+function withPrompts(record) {
+	const events = record.events.map((event) => ({
+		...event,
+		detail: { ...event.detail }
+	}));
+	const owners = new Map(record.nodes.map((node) => [node.id, node.agentId ?? node.id]));
+	for (const node of record.nodes.filter((item) => item.kind === "agent")) {
+		const own = events.filter((event) => (owners.get(event.node) ?? event.node) === node.id);
+		const firstReply = own.find((event) => event.detail.role === "assistant")?.at;
+		const userTurns = own.filter((event) => event.detail.role === "user" && typeof event.detail.publicText === "string" && !event.detail.publicText.trimStart().startsWith("<task-notification>"));
+		const initial = userTurns.find((event) => event.detail.promptKind !== "steering" && (!firstReply || event.at <= firstReply));
+		if (initial) initial.detail.promptKind = "initial";
+		else if (node.assignment?.trim()) {
+			const at = node.start ?? own[0]?.at;
+			if (at) events.push({
+				id: `prompt:${node.id}`,
+				node: node.id,
+				at,
+				kind: "message",
+				category: "other",
+				label: "Prompt",
+				source: null,
+				detail: {
+					role: "user",
+					publicText: node.assignment,
+					promptKind: "initial",
+					promptReconstructed: true,
+					promptSource: "node.assignment"
+				}
+			});
+		}
+		for (const event of userTurns) {
+			if (event === initial || event.detail.promptKind === "initial") continue;
+			event.detail.promptKind ??= "steering";
+		}
+	}
+	events.sort((a, b) => a.at.localeCompare(b.at) || Number(b.detail.promptKind === "initial") - Number(a.detail.promptKind === "initial"));
+	return {
+		...record,
+		events
+	};
+}
+export { model_exports as C, TraceWaterfall as D, useAgentStream as E, traceSpanMark as O, indexRecord as S, foldAgentRows as T, statusMeta$1 as _, InlineToolItem as a, withPrompts as b, RunPhaseList as c, RunStatusIcon$1 as d, TaskList as f, showsTaskPriority as g, runStatus$1 as h, InlineThinkingItem$1 as i, RunRowShell$1 as l, parseToolEvent as m, ApprovalDiffSummary as n, LiveDuration as o, ToolCallFeed as p, ExpandedToolDetail as r, RunGroup as s, ApprovalCard as t, RunRowStatusDot as u, taskProgress as v, TraceWorkspace as w, Conversation as x, taskStatus as y };