@tangle-network/sandbox-ui 3.0.1 → 3.0.3

package/dist/run/live.js

@@ -1,7 +1,7 @@
-import { t as WorkspaceFilesPane } from "../workspace-files-pane-C0PeY6rY.js";
+import { t as WorkspaceFilesPane } from "../workspace-files-pane-D24G7H_Z.js";
 import { t as DiffView } from "../diff-view-B9mNeTLF.js";
 import { t as CodeView } from "../code-view-BlhCS1SD.js";
-import { a as useEventStream, t as TraceWorkspace } from "../trace-workspace-BiJbv9WQ.js";
+import { a as useEventStream, t as TraceWorkspace } from "../trace-workspace-B634-EcA.js";
 import { useDocument } from "../hooks/use-document.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from "react";

package/dist/run/record.d.ts

@@ -1,2 +1,2 @@
-import { a as ConversationProps, c as ToolCall, d as recordFlowTrace, f as ConversationEvent, i as Conversation, l as indexRecord, m as ConversationRecord, n as VirtualList, o as EventFlag, p as ConversationNode, r as withPrompts, s as RecordIndex, t as AgentTree, u as model_d_exports } from "../index-gXcuwPOX.js";
-export { AgentTree, Conversation, type ConversationEvent, type ConversationNode, type ConversationProps, type ConversationRecord, type EventFlag, type RecordIndex, type ToolCall, VirtualList, indexRecord, recordFlowTrace, model_d_exports as recordModel, withPrompts };
+import { _ as ConversationRecord, a as VirtualList, c as ConversationProps, d as ToolCall, f as indexRecord, g as ConversationNode, h as ConversationEvent, i as AgentTree, l as EventFlag, m as recordFlowTrace, n as ToolStep, o as withPrompts, p as model_d_exports, r as timelineItems, s as Conversation, t as PromptMore, u as RecordIndex } from "../index-Bv2iiZaN.js";
+export { AgentTree, Conversation, type ConversationEvent, type ConversationNode, type ConversationProps, type ConversationRecord, type EventFlag, PromptMore, type RecordIndex, type ToolCall, ToolStep, VirtualList, indexRecord, recordFlowTrace, model_d_exports as recordModel, timelineItems, withPrompts };

package/dist/run/record.js

@@ -1,4 +1,5 @@
-import { t as VirtualList } from "../VirtualList-DLh2JE0F.js";
-import { d as recordFlowTrace, l as model_exports, n as Conversation, o as indexRecord, t as AgentTree } from "../AgentTree-CJRVpgPq.js";
-import { t as withPrompts } from "../record-Ct_MZeZC.js";
-export { AgentTree, Conversation, VirtualList, indexRecord, recordFlowTrace, model_exports as recordModel, withPrompts };
+import { t as VirtualList } from "../VirtualList-DcSGbEtA.js";
+import { S as model_exports, i as ToolStep, r as PromptMore, s as timelineItems, w as recordFlowTrace, y as indexRecord } from "../use-follow-tail-DZFn7QDO.js";
+import { n as Conversation, t as AgentTree } from "../AgentTree-D4d06rfH.js";
+import { t as withPrompts } from "../record-C-EUpK-n.js";
+export { AgentTree, Conversation, PromptMore, ToolStep, VirtualList, indexRecord, recordFlowTrace, model_exports as recordModel, timelineItems, withPrompts };

package/dist/run.d.ts

@@ -1,4 +1,4 @@
-import { $ as TraceWaterfallProps, A as ToolCallData, B as taskProgress, C as RunStatusIcon, D as TaskListItem, E as TaskList, F as isOpen, G as TraceWorkspace, H as LatestEvents, I as parseToolEvent, J as AgentStreamState, K as TraceWorkspaceProps, L as runStatus, M as ToolCallFeedProps, N as ToolCallStatus, O as TaskListProps, P as ToolCallType, Q as TraceWaterfall, R as showsTaskPriority, S as RunStatus, T as StatusMeta, U as LatestEventsProps, V as taskStatus, W as TraceEvent, X as foldAgentRows, Y as AgentTranscriptEntry, Z as useAgentStream, _ as RunPhaseList, a as ApprovalPlanStep, b as RunRowStatus, c as FeedSegment, d as InlineToolItem, et as traceSpanMark, f as InlineToolItemProps, g as RunPhase, h as RunGroupProps, i as ApprovalDiffSummary, j as ToolCallFeed, k as TaskStatus, l as InlineThinkingItem, m as RunGroup, n as ApprovalCardProps, o as ExpandedToolDetail, p as LiveDuration, q as AgentStreamRow, r as ApprovalDiffFile, s as ExpandedToolDetailProps, t as ApprovalCard, u as InlineThinkingItemProps, v as RunRowShell, w as RunStatusIconProps, x as RunRowStatusDot, y as RunRowShellProps, z as statusMeta } from "./index-YU_b9xCK.js";
+import { A as ToolCallData, B as taskProgress, C as RunStatusIcon, D as TaskListItem, E as TaskList, F as isOpen, G as TraceWorkspace, H as LatestEvents, I as parseToolEvent, J as TraceWaterfallProps, K as TraceWorkspaceProps, L as runStatus, M as ToolCallFeedProps, N as ToolCallStatus, O as TaskListProps, P as ToolCallType, R as showsTaskPriority, S as RunStatus, T as StatusMeta, U as LatestEventsProps, V as taskStatus, W as TraceEvent, Y as traceSpanMark, _ as RunPhaseList, a as ApprovalPlanStep, b as RunRowStatus, c as FeedSegment, d as InlineToolItem, f as InlineToolItemProps, g as RunPhase, h as RunGroupProps, i as ApprovalDiffSummary, j as ToolCallFeed, k as TaskStatus, l as InlineThinkingItem, m as RunGroup, n as ApprovalCardProps, o as ExpandedToolDetail, p as LiveDuration, q as TraceWaterfall, r as ApprovalDiffFile, s as ExpandedToolDetailProps, t as ApprovalCard, u as InlineThinkingItemProps, v as RunRowShell, w as RunStatusIconProps, x as RunRowStatusDot, y as RunRowShellProps, z as statusMeta } from "./index-CHA38az4.js";
 import { i as useEventStream, n as AgentStreamSource, r as EventStreamHandlers, t as AgentStreamOpener } from "./event-stream-DNEbvx4s.js";
-import { a as ConversationProps, c as ToolCall, d as recordFlowTrace, f as ConversationEvent, i as Conversation, l as indexRecord, m as ConversationRecord, n as VirtualList, o as EventFlag, p as ConversationNode, r as withPrompts, s as RecordIndex, t as AgentTree, u as model_d_exports } from "./index-gXcuwPOX.js";
-export { type AgentStreamOpener, type AgentStreamRow, type AgentStreamSource, type AgentStreamState, type AgentTranscriptEntry, AgentTree, ApprovalCard, type ApprovalCardProps, type ApprovalDiffFile, ApprovalDiffSummary, type ApprovalPlanStep, Conversation, type ConversationEvent, type ConversationNode, type ConversationProps, type ConversationRecord, type EventFlag, type EventStreamHandlers, ExpandedToolDetail, type ExpandedToolDetailProps, type FeedSegment, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, LatestEvents, type LatestEventsProps, LiveDuration, type RecordIndex, RunGroup, type RunGroupProps, type RunPhase, RunPhaseList, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot, type RunStatus, RunStatusIcon, type RunStatusIconProps, type StatusMeta, TaskList, type TaskListItem, type TaskListProps, type TaskStatus, type ToolCall, type ToolCallData, ToolCallFeed, type ToolCallFeedProps, type ToolCallStatus, type ToolCallType, type TraceEvent, TraceWaterfall, type TraceWaterfallProps, TraceWorkspace, type TraceWorkspaceProps, VirtualList, foldAgentRows, indexRecord, isOpen, parseToolEvent, recordFlowTrace, model_d_exports as recordModel, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus, traceSpanMark, useAgentStream, useEventStream, withPrompts };
+import { C as foldAgentRows, S as AgentTranscriptEntry, _ as ConversationRecord, a as VirtualList, b as AgentStreamRow, c as ConversationProps, d as ToolCall, f as indexRecord, g as ConversationNode, h as ConversationEvent, i as AgentTree, l as EventFlag, m as recordFlowTrace, n as ToolStep, o as withPrompts, p as model_d_exports, r as timelineItems, s as Conversation, t as PromptMore, u as RecordIndex, v as AgentStreamHistory, w as useAgentStream, x as AgentStreamState, y as AgentStreamPage } from "./index-Bv2iiZaN.js";
+export { type AgentStreamHistory, type AgentStreamOpener, type AgentStreamPage, type AgentStreamRow, type AgentStreamSource, type AgentStreamState, type AgentTranscriptEntry, AgentTree, ApprovalCard, type ApprovalCardProps, type ApprovalDiffFile, ApprovalDiffSummary, type ApprovalPlanStep, Conversation, type ConversationEvent, type ConversationNode, type ConversationProps, type ConversationRecord, type EventFlag, type EventStreamHandlers, ExpandedToolDetail, type ExpandedToolDetailProps, type FeedSegment, InlineThinkingItem, type InlineThinkingItemProps, InlineToolItem, type InlineToolItemProps, LatestEvents, type LatestEventsProps, LiveDuration, PromptMore, type RecordIndex, RunGroup, type RunGroupProps, type RunPhase, RunPhaseList, RunRowShell, type RunRowShellProps, type RunRowStatus, RunRowStatusDot, type RunStatus, RunStatusIcon, type RunStatusIconProps, type StatusMeta, TaskList, type TaskListItem, type TaskListProps, type TaskStatus, type ToolCall, type ToolCallData, ToolCallFeed, type ToolCallFeedProps, type ToolCallStatus, type ToolCallType, ToolStep, type TraceEvent, TraceWaterfall, type TraceWaterfallProps, TraceWorkspace, type TraceWorkspaceProps, VirtualList, foldAgentRows, indexRecord, isOpen, parseToolEvent, recordFlowTrace, model_d_exports as recordModel, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus, timelineItems, traceSpanMark, useAgentStream, useEventStream, withPrompts };

package/dist/run.js

@@ -1,6 +1,7 @@
-import { t as VirtualList } from "./VirtualList-DLh2JE0F.js";
-import { a as useEventStream, i as useAgentStream, n as LatestEvents, o as TraceWaterfall, r as foldAgentRows, s as traceSpanMark, t as TraceWorkspace } from "./trace-workspace-BiJbv9WQ.js";
-import { d as recordFlowTrace, l as model_exports, n as Conversation, o as indexRecord, t as AgentTree } from "./AgentTree-CJRVpgPq.js";
-import { t as withPrompts } from "./record-Ct_MZeZC.js";
+import { t as VirtualList } from "./VirtualList-DcSGbEtA.js";
+import { a as useEventStream, i as useAgentStream, n as LatestEvents, o as TraceWaterfall, r as foldAgentRows, s as traceSpanMark, t as TraceWorkspace } from "./trace-workspace-B634-EcA.js";
+import { S as model_exports, i as ToolStep, r as PromptMore, s as timelineItems, w as recordFlowTrace, y as indexRecord } from "./use-follow-tail-DZFn7QDO.js";
+import { n as Conversation, t as AgentTree } from "./AgentTree-D4d06rfH.js";
+import { t as withPrompts } from "./record-C-EUpK-n.js";
 import { ApprovalCard, ApprovalDiffSummary, ExpandedToolDetail, InlineThinkingItem, InlineToolItem, LiveDuration, RunGroup, RunPhaseList, RunRowShell, RunRowStatusDot, RunStatusIcon, TaskList, ToolCallFeed, isOpen, parseToolEvent, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus } from "@tangle-network/ui/run";
-export { AgentTree, ApprovalCard, ApprovalDiffSummary, Conversation, ExpandedToolDetail, InlineThinkingItem, InlineToolItem, LatestEvents, LiveDuration, RunGroup, RunPhaseList, RunRowShell, RunRowStatusDot, RunStatusIcon, TaskList, ToolCallFeed, TraceWaterfall, TraceWorkspace, VirtualList, foldAgentRows, indexRecord, isOpen, parseToolEvent, recordFlowTrace, model_exports as recordModel, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus, traceSpanMark, useAgentStream, useEventStream, withPrompts };
+export { AgentTree, ApprovalCard, ApprovalDiffSummary, Conversation, ExpandedToolDetail, InlineThinkingItem, InlineToolItem, LatestEvents, LiveDuration, PromptMore, RunGroup, RunPhaseList, RunRowShell, RunRowStatusDot, RunStatusIcon, TaskList, ToolCallFeed, ToolStep, TraceWaterfall, TraceWorkspace, VirtualList, foldAgentRows, indexRecord, isOpen, parseToolEvent, recordFlowTrace, model_exports as recordModel, runStatus, showsTaskPriority, statusMeta, taskProgress, taskStatus, timelineItems, traceSpanMark, useAgentStream, useEventStream, withPrompts };

package/dist/runtime-viewer/{AgentGraphCanvas-DGq7_u8--WPFPgd72.js → AgentGraphCanvas-DGq7_u8--C6yDfIUT.js}

@@ -1,7 +1,7 @@
 import { i as e, t } from "./rolldown-runtime-CwxnZyOB.js";
-import { Et as n, H as r, K as i, O as a, S as o, T as s, Tt as c, U as l, X as u, Z as d, _ as f, a as p, c as m, ct as h, et as g, f as _, g as v, h as y, i as b, l as x, lt as S, m as C, n as w, p as T, q as E, s as D, t as O, u as k, v as A, x as j, xt as M } from "./latest-events-CRq9sGkK-YFXUh9qO.js";
-// node_modules/.pnpm/@tangle-network+charts@4.0.2_@tangle-network+brand@1.31.3_react@19.3.1__@tangle-network_05e5010b9bb923f09b9d30109faa4cac/node_modules/@tangle-network/charts/dist/motion-DILryczn.js
-var N = "[transition:color_var(--motion-control),background-color_var(--motion-control),border-color_var(--motion-control),box-shadow_var(--motion-control),transform_var(--motion-control),scale_var(--motion-control),opacity_var(--motion-control)] motion-reduce:transition-none", P = /* @__PURE__ */ e(n(), 1), F = M();
+import { Dt as n, Et as r, H as i, K as a, O as o, S as s, St as c, T as l, U as u, X as d, Z as f, _ as p, a as m, c as h, et as g, f as _, g as v, h as y, i as b, l as x, lt as S, m as C, n as w, p as T, q as E, s as D, t as O, u as k, ut as A, v as j, x as M } from "./latest-events-CRq9sGkK-CfoBl1dP.js";
+// node_modules/.pnpm/@tangle-network+charts@4.0.2_@tangle-network+brand@1.31.3_react@19.3.1__@tangle-network_8fd2b0d675b84eae5d8adcca22ee1cb3/node_modules/@tangle-network/charts/dist/motion-DILryczn.js
+var N = "[transition:color_var(--motion-control),background-color_var(--motion-control),border-color_var(--motion-control),box-shadow_var(--motion-control),transform_var(--motion-control),scale_var(--motion-control),opacity_var(--motion-control)] motion-reduce:transition-none", P = /* @__PURE__ */ e(n(), 1), F = c();
 function I(e) {
 	if (typeof e == "string" || typeof e == "number") return "" + e;
 	let t = "";
@@ -4225,7 +4225,7 @@ function Z(e, t) {
 	return !0;
 }
 // node_modules/.pnpm/@xyflow+react@12.12.0_@types+react-dom@19.3.0_@types+react@19.3.0__@types+react@19.3.0__a2dc164871d419910c9e7025366b0809/node_modules/@xyflow/react/dist/esm/index.js
-var Cc = /* @__PURE__ */ e(c()), wc = (0, P.createContext)(null), Tc = wc.Provider, Ec = wa.error001("react");
+var Cc = /* @__PURE__ */ e(r()), wc = (0, P.createContext)(null), Tc = wc.Provider, Ec = wa.error001("react");
 function Q(e, t) {
 	let n = (0, P.useContext)(wc);
 	if (n === null) throw Error(Ec);
@@ -7582,7 +7582,7 @@ function gf({ nodeId: e, position: t, variant: n = $s.Handle, className: r, styl
 	});
 }
 (0, P.memo)(gf);
-// node_modules/.pnpm/@tangle-network+charts@4.0.2_@tangle-network+brand@1.31.3_react@19.3.1__@tangle-network_05e5010b9bb923f09b9d30109faa4cac/node_modules/@tangle-network/charts/dist/AgentGraphCanvas-DGq7_u8-.js
+// node_modules/.pnpm/@tangle-network+charts@4.0.2_@tangle-network+brand@1.31.3_react@19.3.1__@tangle-network_8fd2b0d675b84eae5d8adcca22ee1cb3/node_modules/@tangle-network/charts/dist/AgentGraphCanvas-DGq7_u8-.js
 var _f = {
 	name: "chevron-down",
 	size: 24,
@@ -7606,9 +7606,9 @@ function bf({ status: e, size: t }) {
 		"aria-hidden": !0,
 		"data-motion": "essential",
 		className: "ag-running-dot",
-		style: a,
-		onAnimationStart: r
-	}) : /* @__PURE__ */ (0, F.jsx)(d, {
+		style: o,
+		onAnimationStart: i
+	}) : /* @__PURE__ */ (0, F.jsx)(f, {
 		status: e,
 		size: t,
 		"aria-hidden": !0
@@ -7621,7 +7621,7 @@ function xf(e) {
 	} : { borderColor: _ };
 }
 function Sf(e) {
-	let t = v(e.costUsd ?? void 0), n = A(e.tokens);
+	let t = v(e.costUsd ?? void 0), n = j(e.tokens);
 	return [
 		e.label,
 		e.role,
@@ -7649,10 +7649,10 @@ function Tf({ direction: e, source: t = !0 }) {
 	})] });
 }
 function Ef({ agent: e, selected: t, direction: n, now: r, onOpen: i, parentLabel: a, handles: o = !1 }) {
-	let c = u(r), l = s(e, c), d = yf(e.status);
+	let s = d(r), c = l(e, s), u = yf(e.status);
 	return /* @__PURE__ */ (0, F.jsxs)("div", {
 		"data-status": e.status,
-		"data-activity": l ? "quiet" : void 0,
+		"data-activity": c ? "quiet" : void 0,
 		"data-selected": t || void 0,
 		title: Sf(e),
 		className: `ag-agent-card relative flex h-full w-full flex-col gap-0.5 rounded-[var(--radius-card)] border bg-card px-3 py-2 text-left ${N}`,
@@ -7689,7 +7689,7 @@ function Ef({ agent: e, selected: t, direction: n, now: r, onOpen: i, parentLabe
 				"data-agent-identity": "",
 				className: "m-0 truncate text-[13px] leading-[18px] text-muted-foreground",
 				title: [e.harness, e.model].filter(Boolean).join(" · "),
-				children: [e.harness, e.model ? j(e.model) : null].filter(Boolean).join(" · ") || "Identity not recorded"
+				children: [e.harness, e.model ? M(e.model) : null].filter(Boolean).join(" · ") || "Identity not recorded"
 			}),
 			(e.status === "failed" || (e.status === "done" || e.status === "stopped") && (e.result ?? e.turn)) && /* @__PURE__ */ (0, F.jsx)("p", {
 				className: "m-0 line-clamp-2 text-[13px] leading-4",
@@ -7697,20 +7697,20 @@ function Ef({ agent: e, selected: t, direction: n, now: r, onOpen: i, parentLabe
 			}),
 			/* @__PURE__ */ (0, F.jsxs)("div", {
 				className: "mt-auto flex items-center justify-between gap-1 text-[13px]",
-				style: { color: l ? "var(--surface-warning-text)" : d.color },
+				style: { color: c ? "var(--surface-warning-text)" : u.color },
 				children: [
 					/* @__PURE__ */ (0, F.jsxs)("span", {
 						className: "flex items-center gap-1",
 						children: [/* @__PURE__ */ (0, F.jsx)(bf, {
 							status: e.status,
 							size: 16
-						}), l?.label ?? d.label]
+						}), c?.label ?? u.label]
 					}),
 					/* @__PURE__ */ (0, F.jsx)("span", {
 						"data-agent-tokens": "",
 						title: e.tokens == null ? "Tokens not recorded" : "Tokens",
 						className: "text-muted-foreground tabular-nums whitespace-nowrap",
-						children: A(e.tokens) ?? "—"
+						children: j(e.tokens) ?? "—"
 					}),
 					e.status === "needs-you" && /* @__PURE__ */ (0, F.jsx)("button", {
 						type: "button",
@@ -7830,18 +7830,18 @@ function Nf({ id: e, source: t, target: n, data: r, markerEnd: i }) {
 function Pf(e) {
 	return e.length <= 52 ? e : `${e.slice(0, 32)} … ${e.slice(-17)}`;
 }
-function Ff({ agent: e, selected: t, direction: n = "TB", now: r, handles: a = !1, onOpen: o, parentLabel: c, renderEventIcon: l }) {
-	let d = u(r), p = (0, P.useRef)(null);
-	i(p, e.status);
-	let m = e.status === "done" || e.status === "stopped", h = e.status === "failed", g = s(e, d), _ = yf(e.status), y = [e.model ? j(e.model) : void 0, e.effort].filter(Boolean).join(" · "), b = (e.events ?? []).slice(-3), x = Number.isFinite(e.costUsd) ? v(e.costUsd) : void 0, S = [
+function Ff({ agent: e, selected: t, direction: n = "TB", now: r, handles: i = !1, onOpen: o, parentLabel: s, renderEventIcon: c }) {
+	let u = d(r), f = (0, P.useRef)(null);
+	a(f, e.status);
+	let m = e.status === "done" || e.status === "stopped", h = e.status === "failed", g = l(e, u), _ = yf(e.status), y = [e.model ? M(e.model) : void 0, e.effort].filter(Boolean).join(" · "), b = (e.events ?? []).slice(-3), x = Number.isFinite(e.costUsd) ? v(e.costUsd) : void 0, S = [
 		x,
-		!h && e.startedAt != null ? `${f(e.startedAt, d, !1)} elapsed` : void 0,
+		!h && e.startedAt != null ? `${p(e.startedAt, u, !1)} elapsed` : void 0,
 		Number.isFinite(e.commits) ? `${e.commits} ${e.commits === 1 ? "commit" : "commits"}` : void 0
 	].filter(Boolean).join(" · ") || "—";
 	return /* @__PURE__ */ (0, F.jsxs)("div", {
 		className: "ag-live-slot",
-		children: [a && /* @__PURE__ */ (0, F.jsx)(Tf, { direction: n }), /* @__PURE__ */ (0, F.jsxs)("div", {
-			ref: p,
+		children: [i && /* @__PURE__ */ (0, F.jsx)(Tf, { direction: n }), /* @__PURE__ */ (0, F.jsxs)("div", {
+			ref: f,
 			className: `ag-live-card${m ? " ag-live-chip" : ""}`,
 			"data-status": e.status,
 			"data-sparse": b.length === 0 || void 0,
@@ -7877,9 +7877,9 @@ function Ff({ agent: e, selected: t, direction: n = "TB", now: r, handles: a = !
 							className: "ag-live-names",
 							children: [/* @__PURE__ */ (0, F.jsxs)("span", {
 								className: "ag-live-name",
-								children: [c && /* @__PURE__ */ (0, F.jsxs)("span", {
+								children: [s && /* @__PURE__ */ (0, F.jsxs)("span", {
 									className: "ag-parent-label",
-									children: [c, " / "]
+									children: [s, " / "]
 								}), e.label]
 							}), !m && y && /* @__PURE__ */ (0, F.jsx)("span", {
 								className: "ag-live-meta",
@@ -7946,7 +7946,7 @@ function Ff({ agent: e, selected: t, direction: n = "TB", now: r, handles: a = !
 						children: b.map((e) => /* @__PURE__ */ (0, F.jsxs)("li", {
 							title: e.label,
 							children: [
-								l?.(e) ?? /* @__PURE__ */ (0, F.jsx)(D, {
+								c?.(e) ?? /* @__PURE__ */ (0, F.jsx)(D, {
 									size: 12,
 									strokeWidth: 1.75,
 									"aria-hidden": !0
@@ -7958,7 +7958,7 @@ function Ff({ agent: e, selected: t, direction: n = "TB", now: r, handles: a = !
 								/* @__PURE__ */ (0, F.jsxs)("time", {
 									className: "ag-live-event-at",
 									dateTime: Number.isFinite(e.at) ? new Date(e.at).toISOString() : void 0,
-									children: [h && e.at != null ? "at " : "", f(e.at, d, h)]
+									children: [h && e.at != null ? "at " : "", p(e.at, u, h)]
 								})
 							]
 						}, e.id))
@@ -8003,17 +8003,17 @@ function Hf(e, t, n) {
 		zoom: l
 	});
 }
-function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB", className: a, emptyState: c, live: d = !1, renderEventIcon: f, showLatestEvents: g = !0, now: _ }) {
-	let v = d ? b : O, x = u(_), S = E(), C = (0, P.useId)(), w = (0, P.useRef)(null), T = (0, P.useRef)(!1), [D, A] = (0, P.useState)(null), j = () => A(null), [M, N] = (0, P.useState)(/* @__PURE__ */ new Set()), [I, L] = (0, P.useState)(0), R = (0, P.useRef)(null), [z, B] = Vf(), V = o(R, e.length > 0), H = z !== null && z.width < 600, U = m(e, t), W = (0, P.useRef)(U);
+function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB", className: a, emptyState: o, live: c = !1, renderEventIcon: f, showLatestEvents: p = !0, now: g }) {
+	let _ = c ? b : O, v = d(g), x = E(), C = (0, P.useId)(), w = (0, P.useRef)(null), T = (0, P.useRef)(!1), [D, A] = (0, P.useState)(null), j = () => A(null), [M, N] = (0, P.useState)(/* @__PURE__ */ new Set()), [I, L] = (0, P.useState)(0), R = (0, P.useRef)(null), [z, B] = Vf(), V = s(R, e.length > 0), H = z !== null && z.width < 600, U = h(e, t), W = (0, P.useRef)(U);
 	W.current.key !== U.key && (W.current = U);
-	let G = W.current, ee = `${i}:${d}:${G.key}`, te = (0, P.useRef)(null);
+	let G = W.current, ee = `${i}:${c}:${G.key}`, te = (0, P.useRef)(null);
 	z && !H && te.current?.key !== ee && (te.current = {
 		key: ee,
-		columns: Math.max(1, Math.min(6, Math.floor((z.width - 32 - (!d && i === "LR" ? v.width + 70 : 0)) / (v.width + 10))))
+		columns: Math.max(1, Math.min(6, Math.floor((z.width - 32 - (!c && i === "LR" ? _.width + 70 : 0)) / (_.width + 10))))
 	});
 	let ne = te.current?.columns ?? 1, re = JSON.stringify([
 		i,
-		d,
+		c,
 		G.key,
 		ne,
 		[...M]
@@ -8021,7 +8021,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 	(0, P.useEffect)(() => {
 		if (H) return;
 		let e = !0;
-		return k(G, i, ne, v, M, d).then((t) => {
+		return k(G, i, ne, _, M, c).then((t) => {
 			e && ae({
 				key: re,
 				layout: t
@@ -8058,7 +8058,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 			data: {
 				frame: e,
 				direction: i,
-				groupParents: d,
+				groupParents: c,
 				label: q.get(e.group.parentId)?.label ?? "Agent",
 				onToggle: () => {
 					!e.collapsed && n && e.group.memberIds.includes(n) && r?.(e.group.parentId), N((t) => {
@@ -8071,15 +8071,15 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 		for (let e of G.agentIds) {
 			let a = q.get(e), o = K.positions.get(e);
 			if (!a || !o) continue;
-			let s = n === e, c = d && K.frames.find((t) => t.group.parentId === e), l = c ? c.width - 64 : v.width, u = c ? 64 : v.height, p = oe.current?.getInternalNode(e)?.measured;
+			let s = n === e, l = c && K.frames.find((t) => t.group.parentId === e), u = l ? l.width - 64 : _.width, d = l ? 64 : _.height, p = oe.current?.getInternalNode(e)?.measured;
 			t.push({
 				id: e,
-				type: d ? "liveAgent" : "agent",
+				type: c ? "liveAgent" : "agent",
 				position: o,
-				width: l,
-				height: u,
-				measured: p?.width === l && p.height === u ? p : void 0,
-				className: `${Cf}${c ? " ag-frame-owner" : ""}`,
+				width: u,
+				height: d,
+				measured: p?.width === u && p.height === d ? p : void 0,
+				className: `${Cf}${l ? " ag-frame-owner" : ""}`,
 				draggable: !1,
 				ariaRole: "button",
 				ariaLabel: Sf(a),
@@ -8091,7 +8091,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 					agent: a,
 					selected: s,
 					direction: i,
-					now: x,
+					now: v,
 					onOpen: r ? () => r(a.id) : void 0,
 					renderEventIcon: f
 				}
@@ -8104,9 +8104,9 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 		q,
 		n,
 		i,
-		d,
+		c,
+		_,
 		v,
-		x,
 		r,
 		f,
 		D
@@ -8114,7 +8114,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 		if (!K) return [];
 		let e = [], r = /* @__PURE__ */ new Set();
 		for (let t of G.spawns) {
-			let n = d && G.groups.find((e) => e.parentId === t.from)?.id || t.from, i = G.groupOf.get(t.to) ?? t.to;
+			let n = c && G.groups.find((e) => e.parentId === t.from)?.id || t.from, i = G.groupOf.get(t.to) ?? t.to;
 			if (n === i) continue;
 			let a = `spawn:${n}:${i}`;
 			r.has(a) || (r.add(a), e.push({
@@ -8171,23 +8171,23 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 	(0, P.useEffect)(() => {
 		H && (oe.current = null, ue(!1), fe(!1), me.current = null);
 	}, [H]);
-	let he = K ? `${re}:${K.columns}` : null, ge = `${i}:${G.key}`, _e = d ? K && z ? Math.max(.02, Math.min(.2, (z.width - 32) / K.width, (z.height - 32) / K.height)) : .2 : 1;
+	let he = K ? `${re}:${K.columns}` : null, ge = `${i}:${G.key}`, _e = c ? K && z ? Math.max(.02, Math.min(.2, (z.width - 32) / K.width, (z.height - 32) / K.height)) : .2 : 1;
 	(0, P.useEffect)(() => {
 		let e = oe.current;
 		if (!le || !e || !he || !z) return;
 		let t = me.current !== ge, n = !t;
 		if (n && !pe.current) return;
-		let r = me.current !== null && t && S;
+		let r = me.current !== null && t && x;
 		me.current = ge;
 		let i = requestAnimationFrame(() => {
 			if (n) Hf(e, R.current, pe.current);
 			else {
-				let t = pe.current ?? G.agentIds[0], n = K?.positions.get(t), i = e.getInternalNode(t)?.width ?? v.width, a = K.width + 32 <= z.width ? (z.width - K.width) / 2 : n ? Math.max(zf - n.x, z.width / 2 - n.x - i / 2) : zf, o = K.height + 32 <= z.height ? zf : zf - (n?.y ?? 0);
+				let t = pe.current ?? G.agentIds[0], n = K?.positions.get(t), i = e.getInternalNode(t)?.width ?? _.width, a = K.width + 32 <= z.width ? (z.width - K.width) / 2 : n ? Math.max(zf - n.x, z.width / 2 - n.x - i / 2) : zf, o = K.height + 32 <= z.height ? zf : zf - (n?.y ?? 0);
 				e.setViewport({
 					x: a,
 					y: o,
 					zoom: 1
-				}, { duration: r ? l("--duration-base", R.current) : 0 });
+				}, { duration: r ? u("--duration-base", R.current) : 0 });
 			}
 			fe(!0);
 		});
@@ -8198,7 +8198,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 		ge,
 		z,
 		_e,
-		S,
+		x,
 		n
 	]);
 	let J = (0, P.useCallback)((e) => {
@@ -8225,7 +8225,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 		if (!i) return;
 		e.preventDefault(), e.stopPropagation();
 		let a = K?.positions.get(i), o = oe.current?.getInternalNode(i)?.measured;
-		a && oe.current?.setCenter(a.x + (o?.width ?? v.width) / 2, a.y + (o?.height ?? v.height) / 2, { zoom: 1 });
+		a && oe.current?.setCenter(a.x + (o?.width ?? _.width) / 2, a.y + (o?.height ?? _.height) / 2, { zoom: 1 });
 		let s = () => R.current?.querySelector(`.react-flow__node[data-id="${CSS.escape(i)}"]`), c = s();
 		c ? c.focus() : requestAnimationFrame(() => requestAnimationFrame(() => s()?.focus()));
 	}, [
@@ -8233,9 +8233,9 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 		J,
 		K,
 		G,
-		v,
-		S
-	]), be = (e) => e.status === "needs-you" ? 0 : e.status === "failed" ? 1 : s(e, x) ? 2 : e.status === "waiting" ? 3 : e.status === "running" ? 4 : 5, xe = new Map(t.filter((e) => e.kind === "spawn").map((e) => [e.to, e.from])), Se = (e) => {
+		_,
+		x
+	]), be = (e) => e.status === "needs-you" ? 0 : e.status === "failed" ? 1 : l(e, v) ? 2 : e.status === "waiting" ? 3 : e.status === "running" ? 4 : 5, xe = new Map(t.filter((e) => e.kind === "spawn").map((e) => [e.to, e.from])), Se = (e) => {
 		let t = /* @__PURE__ */ new Set([e]), n = 0;
 		for (; xe.has(e) && !t.has(xe.get(e));) e = xe.get(e), t.add(e), n++;
 		return n;
@@ -8259,7 +8259,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 		"failed",
 		"quiet"
 	].map((t) => {
-		let r = e.filter((e) => t === "quiet" ? s(e, x) : e.status === t);
+		let r = e.filter((e) => t === "quiet" ? l(e, v) : e.status === t);
 		return {
 			status: t,
 			matches: r,
@@ -8279,9 +8279,9 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 				let t = e.matches.findIndex((e) => e.id === n), r = e.matches[(t + 1) % e.matches.length];
 				J(r.id);
 				let i = K?.positions.get(r.id), a = oe.current?.getInternalNode(r.id)?.measured;
-				i && oe.current?.setCenter(i.x + (a?.width ?? v.width) / 2, i.y + (a?.height ?? v.height) / 2, {
+				i && oe.current?.setCenter(i.x + (a?.width ?? _.width) / 2, i.y + (a?.height ?? _.height) / 2, {
 					zoom: 1,
-					duration: S ? l("--duration-base", R.current) : 0
+					duration: x ? u("--duration-base", R.current) : 0
 				});
 			},
 			children: [/* @__PURE__ */ (0, F.jsxs)("span", {
@@ -8302,8 +8302,8 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 	});
 	return e.length === 0 ? /* @__PURE__ */ (0, F.jsx)("div", {
 		className: `agent-graph flex items-center justify-center rounded-lg border border-border border-dashed p-4 text-center text-muted-foreground text-xs ${a ?? ""}`,
-		children: c ?? "No agents yet"
-	}) : /* @__PURE__ */ (0, F.jsx)(h, {
+		children: o ?? "No agents yet"
+	}) : /* @__PURE__ */ (0, F.jsx)(S, {
 		anchor: D?.anchor,
 		open: !!D,
 		onOpenChange: (e) => {
@@ -8313,7 +8313,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 			ref: (e) => {
 				R.current = e, B(e);
 			},
-			className: `agent-graph ag-live${d ? "" : " ag-topology"} relative flex flex-col ${a ?? ""}`,
+			className: `agent-graph ag-live${c ? "" : " ag-topology"} relative flex flex-col ${a ?? ""}`,
 			tabIndex: -1,
 			onKeyDownCapture: (e) => {
 				e.target instanceof HTMLElement && e.target.closest("[data-agent-metrics]") || (e.key === "Tab" && !e.shiftKey && D ? (e.preventDefault(), document.getElementById(C)?.focus()) : (e.key === "Escape" && j(), ye(e)));
@@ -8337,10 +8337,10 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 			"data-columns": K?.columns,
 			children: [
 				Oe,
-				g && d && /* @__PURE__ */ (0, F.jsx)(p, {
+				p && c && /* @__PURE__ */ (0, F.jsx)(m, {
 					agents: e,
-					now: _,
-					live: d,
+					now: g,
+					live: c,
 					selectedId: n,
 					onSelect: r ? J : void 0
 				}),
@@ -8360,18 +8360,18 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 							onKeyDown: (t) => {
 								(t.key === "Enter" || t.key === " ") && t.target === t.currentTarget && (t.preventDefault(), J(e.id));
 							},
-							children: d ? /* @__PURE__ */ (0, F.jsx)(Ff, {
+							children: c ? /* @__PURE__ */ (0, F.jsx)(Ff, {
 								agent: e,
 								parentLabel: q.get(xe.get(e.id) ?? "")?.label,
 								selected: n === e.id,
-								now: x,
+								now: v,
 								renderEventIcon: f,
 								onOpen: r ? () => J(e.id) : void 0
 							}) : /* @__PURE__ */ (0, F.jsx)(Ef, {
 								agent: e,
 								parentLabel: q.get(xe.get(e.id) ?? "")?.label,
 								selected: n === e.id,
-								now: x,
+								now: v,
 								direction: i,
 								onOpen: r ? () => J(e.id) : void 0
 							})
@@ -8467,7 +8467,7 @@ function Uf({ nodes: e, edges: t, selectedId: n, onSelect: r, direction: i = "TB
 									padding: `${zf}px`,
 									minZoom: _e,
 									maxZoom: 1,
-									nodes: d ? void 0 : G.agentIds.slice(0, 2).map((e) => ({ id: e }))
+									nodes: c ? void 0 : G.agentIds.slice(0, 2).map((e) => ({ id: e }))
 								}
 							})
 						]
@@ -8491,7 +8491,7 @@ function Wf({ anchor: e, side: t, mode: n, id: r, agent: i, onClose: a }) {
 	let o = new Map([
 		{
 			label: "Tokens",
-			value: A(i.tokens) ?? "Not recorded"
+			value: j(i.tokens) ?? "Not recorded"
 		},
 		{
 			label: "Cost",
@@ -8499,7 +8499,7 @@ function Wf({ anchor: e, side: t, mode: n, id: r, agent: i, onClose: a }) {
 		},
 		...i.facts ?? []
 	].map((e) => [e.label.toLowerCase(), e]));
-	return /* @__PURE__ */ (0, F.jsxs)(S, {
+	return /* @__PURE__ */ (0, F.jsxs)(A, {
 		container: e,
 		side: t,
 		align: "start",