@tangle-network/sandbox-cli 0.21.64 → 0.21.66

package/dist/graph-viewer/viewer/Topology-CzjqSFXH.js

@@ -0,0 +1,239 @@
+import { i as e } from "./rolldown-runtime-DArdT4gl.js";
+import { n as t, t as n } from "./jsx-runtime-DPT6sCLq.js";
+import { t as r } from "./workflows--mZpHYqo.js";
+import { D as i, S as a, a as o, b as s, c, h as l, l as u, m as d, n as f, o as p, s as m, u as h } from "./ui-Co03nZUX.js";
+import { d as g } from "./react-DQ7E2Epi.js";
+import { agentParam as _ } from "./RunPage-NtevWXBs.js";
+//#region src/workspace/run/Topology.tsx
+var v = /* @__PURE__ */ e(t(), 1), y = n();
+function b(e) {
+	return e.agents.map((t) => {
+		let n = t.events;
+		return {
+			id: t.id,
+			label: t.name,
+			status: t.status,
+			model: t.model,
+			harness: t.harness,
+			costUsd: t.listUsd ?? t.billedUsd,
+			tokens: t.tokens,
+			commits: t.commits,
+			facts: l(e, t),
+			startedAt: Number.isFinite(Date.parse(t.node.start ?? "")) ? Date.parse(t.node.start) : void 0,
+			lastActivityAt: t.lastActivityAt,
+			medianEventGapMs: t.medianEventGapMs,
+			turn: t.node.turn,
+			events: n,
+			result: t.status === "failed" ? t.node.failureReason || `Failure cause not recorded${n.at(-1)?.label ? `. Last event: ${n.at(-1).label}` : ""}` : t.commits ? `${t.commits} commits shipped` : t.state.label
+		};
+	});
+}
+function x({ m: e, agent: t, selectAgent: n, route: i, doc: a }) {
+	let o = (0, v.useMemo)(() => b(e), [e]), s = (0, v.useMemo)(() => e.agents.flatMap((e) => e.parent ? [{
+		from: e.parent,
+		to: e.id,
+		kind: "spawn"
+	}] : []), [e]), [c, l] = (0, v.useState)(0), d = (e) => {
+		n(e), l((e) => e + 1);
+	}, f = t ?? e.root?.id ?? null, m = f ? e.byId.get(f) ?? null : null;
+	return /* @__PURE__ */ (0, y.jsxs)("div", {
+		className: "rp-topo",
+		children: [/* @__PURE__ */ (0, y.jsxs)("section", {
+			className: "rp-card",
+			"aria-label": "Spawn tree",
+			children: [/* @__PURE__ */ (0, y.jsxs)("div", {
+				className: "rp-hd rp-hd-tools",
+				children: [/* @__PURE__ */ (0, y.jsx)("h2", { children: "Agents" }), /* @__PURE__ */ (0, y.jsx)("span", {
+					className: "end",
+					children: /* @__PURE__ */ (0, y.jsx)(p, {
+						label: "Go to agent",
+						options: h(e),
+						groups: u(e),
+						value: f,
+						placeholder: `Search ${e.agents.length} agents`,
+						width: 340,
+						onChange: (e) => {
+							e && d(e);
+						},
+						children: /* @__PURE__ */ (0, y.jsx)("span", {
+							className: "dim",
+							children: "Go to agent"
+						})
+					})
+				})]
+			}), /* @__PURE__ */ (0, y.jsx)(r, {
+				renderEventIcon: (e) => g(e.label),
+				nodes: o,
+				edges: s,
+				selectedId: f,
+				onSelect: d,
+				live: e.live,
+				showLatestEvents: !1,
+				title: "Agents",
+				className: "rp-topo-graph"
+			})]
+		}), m && /* @__PURE__ */ (0, y.jsx)(S, {
+			m: e,
+			a: m,
+			reveal: i.params.has("agent"),
+			selection: c,
+			onSelect: d,
+			href: i.href("conversations", { agent: _(a.run.id, m.id) })
+		})]
+	});
+}
+function S({ m: e, a: t, reveal: n, selection: r, onSelect: l, href: u }) {
+	let p = (0, v.useRef)(null);
+	(0, v.useEffect)(() => {
+		n && matchMedia("(max-width: 720px)").matches && (p.current?.focus({ preventScroll: !0 }), p.current?.scrollIntoView({
+			block: "start",
+			behavior: "instant"
+		}));
+	}, [
+		t.id,
+		n,
+		r
+	]);
+	let h = e.duration > 72e6 || new Date(e.t0).toISOString().slice(0, 10) !== new Date(e.t0 + e.duration).toISOString().slice(0, 10), g = (e) => Number.isFinite(Date.parse(e ?? "")) ? i(e, h) : "—", _ = Math.max(1, ...t.tools.map((e) => e.calls)), b = t.parent ? e.byId.get(t.parent) : null, x = [[
+		t.model ?? "model",
+		t.latency.p50,
+		t.latency.p90,
+		t.latency.p99,
+		t.modelCalls
+	], ...t.tools.slice(0, 5).map((e) => [
+		e.name,
+		e.p50,
+		e.p90,
+		e.p99,
+		e.calls
+	])];
+	return /* @__PURE__ */ (0, y.jsxs)("aside", {
+		ref: p,
+		tabIndex: -1,
+		className: "rp-card",
+		"aria-label": t.name,
+		style: { scrollMarginTop: "calc(var(--ar-sticky-top, 0px) + 44px)" },
+		children: [/* @__PURE__ */ (0, y.jsxs)("div", {
+			className: "rp-hd",
+			children: [/* @__PURE__ */ (0, y.jsxs)("h2", { children: [/* @__PURE__ */ (0, y.jsx)(m, { tone: t.state.tone }), t.name] }), /* @__PURE__ */ (0, y.jsx)("span", {
+				className: "end",
+				children: /* @__PURE__ */ (0, y.jsx)("span", {
+					className: `rp-pill ${t.state.tone}`,
+					children: t.state.label
+				})
+			})]
+		}), /* @__PURE__ */ (0, y.jsxs)("div", {
+			className: "rp-scroll rp-tinsp",
+			children: [
+				/* @__PURE__ */ (0, y.jsxs)("dl", {
+					className: "rp-kv",
+					children: [
+						t.status === "failed" && /* @__PURE__ */ (0, y.jsxs)(y.Fragment, { children: [/* @__PURE__ */ (0, y.jsx)("dt", { children: "Failure" }), /* @__PURE__ */ (0, y.jsx)("dd", {
+							className: "f",
+							children: t.node.failureReason || "Cause not recorded"
+						})] }),
+						t.status === "needs-you" && /* @__PURE__ */ (0, y.jsxs)(y.Fragment, { children: [/* @__PURE__ */ (0, y.jsx)("dt", { children: "Request" }), /* @__PURE__ */ (0, y.jsx)("dd", { children: t.node.turn || "Request not recorded" })] }),
+						/* @__PURE__ */ (0, y.jsx)("dt", { children: "Model" }),
+						/* @__PURE__ */ (0, y.jsx)("dd", { children: [t.model, t.harness].filter(Boolean).join(" · ") || "—" }),
+						/* @__PURE__ */ (0, y.jsx)("dt", { children: "Spawned" }),
+						/* @__PURE__ */ (0, y.jsxs)("dd", { children: [b ? `by ${b.name} · ` : "", g(t.node.start)] }),
+						/* @__PURE__ */ (0, y.jsx)("dt", { children: "Ended" }),
+						/* @__PURE__ */ (0, y.jsx)("dd", { children: g(t.node.end) }),
+						/* @__PURE__ */ (0, y.jsx)("dt", { children: "Cost" }),
+						/* @__PURE__ */ (0, y.jsx)("dd", { children: c(t) })
+					]
+				}),
+				/* @__PURE__ */ (0, y.jsx)("div", {
+					className: "rp-stat3",
+					children: [
+						[d(t.tokens), "tokens"],
+						[s(t.modelCalls), t.modelCalls === 1 ? "model call" : "model calls"],
+						[s(t.toolCalls), t.toolCalls === 1 ? "tool call" : "tool calls"],
+						[String(t.failedSteps), t.failedSteps === 1 ? "failed step" : "failed steps"],
+						[String(t.restarts.length), t.restarts.length === 1 ? "restart" : "restarts"],
+						[t.commits === null ? "—" : String(t.commits), t.commits === 1 ? "commit" : "commits"]
+					].map(([e, t]) => /* @__PURE__ */ (0, y.jsxs)("div", { children: [/* @__PURE__ */ (0, y.jsx)("b", { children: e }), /* @__PURE__ */ (0, y.jsx)("span", { children: t })] }, t))
+				}),
+				(t.modelCalls ?? 0) > 0 && /* @__PURE__ */ (0, y.jsxs)(y.Fragment, { children: [/* @__PURE__ */ (0, y.jsx)("h5", {
+					className: "rp-subh",
+					children: "Latency"
+				}), /* @__PURE__ */ (0, y.jsxs)("table", {
+					className: "rp-lt",
+					children: [/* @__PURE__ */ (0, y.jsx)("thead", { children: /* @__PURE__ */ (0, y.jsxs)("tr", { children: [
+						/* @__PURE__ */ (0, y.jsx)("th", {}),
+						/* @__PURE__ */ (0, y.jsx)("th", { children: "calls" }),
+						/* @__PURE__ */ (0, y.jsx)("th", { children: "p50" }),
+						/* @__PURE__ */ (0, y.jsx)("th", { children: "p90" }),
+						/* @__PURE__ */ (0, y.jsx)("th", { children: "p99" })
+					] }) }), /* @__PURE__ */ (0, y.jsx)("tbody", { children: x.map(([e, t, n, r, i]) => /* @__PURE__ */ (0, y.jsxs)("tr", { children: [
+						/* @__PURE__ */ (0, y.jsx)("td", {
+							title: e,
+							children: e
+						}),
+						/* @__PURE__ */ (0, y.jsx)("td", { children: s(i) }),
+						/* @__PURE__ */ (0, y.jsx)("td", { children: a(t) }),
+						/* @__PURE__ */ (0, y.jsx)("td", { children: a(n) }),
+						/* @__PURE__ */ (0, y.jsx)("td", { children: a(r) })
+					] }, e)) })]
+				})] }),
+				t.tools.length > 0 && /* @__PURE__ */ (0, y.jsxs)(y.Fragment, { children: [/* @__PURE__ */ (0, y.jsx)("h5", {
+					className: "rp-subh",
+					children: "Tool calls"
+				}), /* @__PURE__ */ (0, y.jsx)("div", {
+					className: "rp-tbars four",
+					children: t.tools.slice(0, 8).map((e) => /* @__PURE__ */ (0, y.jsxs)("div", {
+						className: "row",
+						children: [
+							/* @__PURE__ */ (0, y.jsx)("span", {
+								className: "l",
+								title: e.name,
+								children: e.name
+							}),
+							/* @__PURE__ */ (0, y.jsx)(f, {
+								ok: e.calls - e.failures,
+								failed: e.failures,
+								max: _
+							}),
+							/* @__PURE__ */ (0, y.jsx)("span", {
+								className: "n",
+								children: s(e.calls)
+							}),
+							/* @__PURE__ */ (0, y.jsx)("span", {
+								className: "n f",
+								children: e.failures ? `${e.failures} ✕` : ""
+							})
+						]
+					}, e.name))
+				})] }),
+				t.children.length > 0 && /* @__PURE__ */ (0, y.jsxs)(y.Fragment, { children: [/* @__PURE__ */ (0, y.jsxs)("h5", {
+					className: "rp-subh",
+					children: ["Spawned · ", t.children.length]
+				}), /* @__PURE__ */ (0, y.jsxs)("div", {
+					className: "rp-chips",
+					children: [t.children.slice(0, 14).map((t) => {
+						let n = e.byId.get(t);
+						return /* @__PURE__ */ (0, y.jsxs)("button", {
+							type: "button",
+							className: "rp-chip",
+							onClick: () => l(t),
+							children: [/* @__PURE__ */ (0, y.jsx)(m, { tone: n.state.tone }), n.name]
+						}, t);
+					}), t.children.length > 14 && /* @__PURE__ */ (0, y.jsxs)("span", {
+						className: "rp-chip dim",
+						children: [t.children.length - 14, " more"]
+					})]
+				})] }),
+				/* @__PURE__ */ (0, y.jsx)("p", { children: /* @__PURE__ */ (0, y.jsxs)("a", {
+					className: "rp-btn sm framed",
+					href: u,
+					children: ["Conversation", /* @__PURE__ */ (0, y.jsx)(o, {
+						name: "arrow",
+						size: 14
+					})]
+				}) })
+			]
+		})]
+	});
+}
+//#endregion
+export { x as Topology, b as graphNodes };

package/dist/graph-viewer/viewer/Traces-CMX0H1VU.js

@@ -0,0 +1,254 @@
+import { i as e } from "./rolldown-runtime-DArdT4gl.js";
+import { n as t, t as n } from "./jsx-runtime-DPT6sCLq.js";
+import { t as r } from "./segmented-control-Di1mbQlP.js";
+import { O as i, S as a, b as o, c as s, l as c, m as l, o as u, p as d, u as f, y as p } from "./ui-Co03nZUX.js";
+import { agentParam as m } from "./RunPage-NtevWXBs.js";
+//#region src/workspace/run/Traces.tsx
+var h = /* @__PURE__ */ e(t(), 1), g = n(), _ = 34;
+function v({ m: e, doc: t, agent: n, route: v }) {
+	let y = v.params.get("agent") ? n : null, [b, x] = (0, h.useState)("all"), [S, C] = (0, h.useState)(0), w = (0, h.useMemo)(() => e.steps.filter((e) => !y || e.agent.id === y), [e, y]), T = (0, h.useMemo)(() => ({
+		all: w.length,
+		model: w.filter((e) => e.step.kind === "model").length,
+		tool: w.filter((e) => e.step.kind === "tool").length,
+		failed: w.filter((e) => e.step.failed).length
+	}), [w]), E = (0, h.useMemo)(() => w.filter(({ step: e }) => b === "all" || (b === "failed" ? e.failed : e.kind === b)), [w, b]), D = (0, h.useMemo)(() => Math.log10(Math.max(10, ...E.map((e) => e.step.d))), [E]), O = (0, h.useRef)(null), k = d(O, E.length, _, 8);
+	(0, h.useEffect)(() => {
+		C(0), O.current && (O.current.scrollTop = 0);
+	}, [b, y]);
+	let A = p(e.t0), j = (e, t = !1) => {
+		let n = Math.max(0, Math.min(E.length - 1, e));
+		C(n);
+		let r = O.current;
+		if (r && t) {
+			let e = n * _;
+			e < r.scrollTop ? r.scrollTop = e : e + _ + 36 > r.scrollTop + r.clientHeight && (r.scrollTop = e + _ + 36 - r.clientHeight), requestAnimationFrame(() => r.querySelector(`[data-i="${n}"]`)?.focus());
+		}
+	}, M = (e) => {
+		(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), j(S + (e.key === "ArrowDown" ? 1 : -1), !0));
+	}, N = E[S], P = f(e, (e) => e.steps.length > 0, (e) => `${o(e.steps.length)} steps`);
+	return /* @__PURE__ */ (0, g.jsxs)("section", {
+		className: "rp-card rp-traces",
+		"aria-label": "Traces",
+		children: [/* @__PURE__ */ (0, g.jsxs)("div", {
+			className: "rp-hd rp-hd-tools",
+			style: { paddingLeft: 8 },
+			children: [/* @__PURE__ */ (0, g.jsx)(u, {
+				label: "Agent",
+				options: P,
+				groups: c(e),
+				all: {
+					label: "All agents",
+					meta: `${o(e.totals.steps)} steps`
+				},
+				value: y,
+				width: 340,
+				placeholder: `Search ${P.length} agents`,
+				style: { width: 260 },
+				onChange: (e) => v.go("traces", { agent: e ? m(t.run.id, e) : null }),
+				children: y ? e.byId.get(y)?.name : "All agents"
+			}), /* @__PURE__ */ (0, g.jsx)(r, {
+				"aria-label": "Kind",
+				value: b,
+				onValueChange: x,
+				options: [
+					"all",
+					"model",
+					"tool",
+					"failed"
+				].map((e) => ({
+					value: e,
+					label: e === "all" ? "All" : e[0].toUpperCase() + e.slice(1),
+					adornment: /* @__PURE__ */ (0, g.jsx)("span", {
+						className: "ct",
+						children: o(T[e])
+					})
+				}))
+			})]
+		}), /* @__PURE__ */ (0, g.jsxs)("div", {
+			className: "rp-trw",
+			children: [/* @__PURE__ */ (0, g.jsxs)("div", {
+				className: "rp-tbl",
+				ref: O,
+				role: "grid",
+				"aria-label": "Spans",
+				"aria-rowcount": E.length,
+				onKeyDown: M,
+				children: [
+					/* @__PURE__ */ (0, g.jsxs)("div", {
+						className: "rp-tr th",
+						role: "row",
+						children: [
+							/* @__PURE__ */ (0, g.jsxs)("span", {
+								role: "columnheader",
+								children: ["Start", /* @__PURE__ */ (0, g.jsx)("span", {
+									className: "ph-hide",
+									children: " (UTC)"
+								})]
+							}),
+							/* @__PURE__ */ (0, g.jsx)("span", {
+								role: "columnheader",
+								children: "Agent"
+							}),
+							/* @__PURE__ */ (0, g.jsx)("span", {
+								role: "columnheader",
+								children: "Kind"
+							}),
+							/* @__PURE__ */ (0, g.jsx)("span", {
+								role: "columnheader",
+								children: "Name"
+							}),
+							/* @__PURE__ */ (0, g.jsx)("span", {
+								role: "columnheader",
+								className: "r",
+								children: "Duration"
+							}),
+							/* @__PURE__ */ (0, g.jsx)("span", {
+								role: "columnheader",
+								className: "sr",
+								children: "Status"
+							})
+						]
+					}),
+					/* @__PURE__ */ (0, g.jsx)("div", { style: { height: k.before } }),
+					E.slice(k.first, k.last).map(({ agent: e, step: t }, n) => {
+						let r = k.first + n;
+						return /* @__PURE__ */ (0, g.jsxs)("div", {
+							"data-i": r,
+							className: `rp-tr${t.failed ? " failed" : ""}`,
+							role: "row",
+							"aria-selected": r === S,
+							tabIndex: r === S ? 0 : -1,
+							onClick: () => j(r),
+							children: [
+								/* @__PURE__ */ (0, g.jsx)("span", {
+									className: "m",
+									children: A(t.t)
+								}),
+								/* @__PURE__ */ (0, g.jsx)("span", {
+									title: e.name,
+									children: e.name
+								}),
+								/* @__PURE__ */ (0, g.jsxs)("span", {
+									className: "kind",
+									children: [/* @__PURE__ */ (0, g.jsx)("i", { className: t.kind }), t.kind]
+								}),
+								/* @__PURE__ */ (0, g.jsx)("span", {
+									className: "m nm",
+									title: t.kind === "tool" ? `${t.tool}${t.target ? ` ${t.target}` : ""}` : void 0,
+									children: t.kind === "model" ? t.model?.split("/").pop() ?? e.model ?? "model" : t.kind === "tool" ? /* @__PURE__ */ (0, g.jsxs)(g.Fragment, { children: [t.tool, t.target && /* @__PURE__ */ (0, g.jsxs)("span", {
+										className: "muted",
+										children: [" ", t.target]
+									})] }) : /* @__PURE__ */ (0, g.jsx)("span", {
+										className: "muted",
+										children: "waiting on a spawned agent"
+									})
+								}),
+								/* @__PURE__ */ (0, g.jsxs)("span", {
+									className: "m r dur",
+									children: [/* @__PURE__ */ (0, g.jsx)("b", { style: { width: Math.max(2, Math.log10(Math.max(t.d, 1)) / D * 56) } }), a(t.d)]
+								}),
+								/* @__PURE__ */ (0, g.jsx)("span", {
+									className: "st",
+									children: t.failed ? /* @__PURE__ */ (0, g.jsx)("span", {
+										className: "f",
+										title: "failed",
+										"aria-label": "failed",
+										children: "✕"
+									}) : null
+								})
+							]
+						}, r);
+					}),
+					/* @__PURE__ */ (0, g.jsx)("div", { style: { height: k.after } })
+				]
+			}), /* @__PURE__ */ (0, g.jsx)("aside", {
+				className: "rp-trd",
+				"aria-label": "Span",
+				children: /* @__PURE__ */ (0, g.jsx)("div", {
+					className: "rp-scroll",
+					children: N ? /* @__PURE__ */ (0, g.jsxs)(g.Fragment, { children: [
+						/* @__PURE__ */ (0, g.jsxs)("dl", {
+							className: "rp-kv",
+							children: [
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: "Agent" }),
+								/* @__PURE__ */ (0, g.jsx)("dd", { children: N.agent.name }),
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: N.step.kind === "tool" ? "Tool" : N.step.kind === "model" ? "Model" : "Kind" }),
+								/* @__PURE__ */ (0, g.jsx)("dd", { children: N.step.kind === "tool" ? `${N.step.tool ?? "tool"}${N.step.target ? ` ${N.step.target}` : ""}` : N.step.kind === "model" ? N.step.model ?? N.agent.node.model ?? "model" : "waiting on a spawned agent" }),
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: "Started" }),
+								/* @__PURE__ */ (0, g.jsxs)("dd", { children: [new Date(e.t0 + N.step.t).toISOString().slice(0, 19).replace("T", " "), " UTC"] }),
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: "Duration" }),
+								/* @__PURE__ */ (0, g.jsxs)("dd", { children: [a(N.step.d), N.step.latency === null ? "" : ` · first token ${a(N.step.latency)}`] }),
+								N.step.tokens && /* @__PURE__ */ (0, g.jsxs)(g.Fragment, { children: [/* @__PURE__ */ (0, g.jsx)("dt", { children: "Tokens" }), /* @__PURE__ */ (0, g.jsxs)("dd", { children: [
+									l(N.step.tokens.input),
+									" in · ",
+									l(N.step.tokens.output),
+									" out · ",
+									l(N.step.tokens.cacheRead),
+									" cached"
+								] })] }),
+								N.step.usd !== null && /* @__PURE__ */ (0, g.jsxs)(g.Fragment, { children: [/* @__PURE__ */ (0, g.jsx)("dt", { children: "Billed" }), /* @__PURE__ */ (0, g.jsx)("dd", { children: i(N.step.usd) })] }),
+								N.step.failed && /* @__PURE__ */ (0, g.jsxs)(g.Fragment, { children: [/* @__PURE__ */ (0, g.jsx)("dt", { children: "Status" }), /* @__PURE__ */ (0, g.jsx)("dd", { children: /* @__PURE__ */ (0, g.jsx)("span", {
+									className: "f",
+									children: "✕ failed"
+								}) })] })
+							]
+						}),
+						/* @__PURE__ */ (0, g.jsxs)("h5", {
+							className: "rp-subh",
+							children: [N.agent.name, ", whole run"]
+						}),
+						/* @__PURE__ */ (0, g.jsxs)("dl", {
+							className: "rp-kv",
+							children: [
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: "Tokens" }),
+								/* @__PURE__ */ (0, g.jsxs)("dd", { children: [l(N.agent.tokens), N.agent.byClass ? ` · ${l(N.agent.byClass.input)} in · ${l(N.agent.byClass.output)} out · ${l(N.agent.byClass.cacheRead)} cached` : ""] }),
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: "Cost" }),
+								/* @__PURE__ */ (0, g.jsx)("dd", { children: s(N.agent) }),
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: "Model calls" }),
+								/* @__PURE__ */ (0, g.jsxs)("dd", { children: [
+									o(N.agent.modelCalls),
+									" · p50 ",
+									a(N.agent.latency.p50),
+									" · p99 ",
+									a(N.agent.latency.p99)
+								] }),
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: "Tool calls" }),
+								/* @__PURE__ */ (0, g.jsxs)("dd", { children: [
+									o(N.agent.toolCalls),
+									" · ",
+									N.agent.toolFailures,
+									" failed"
+								] }),
+								/* @__PURE__ */ (0, g.jsx)("dt", { children: "Restarts" }),
+								/* @__PURE__ */ (0, g.jsx)("dd", { children: N.agent.restarts.length })
+							]
+						}),
+						/* @__PURE__ */ (0, g.jsxs)("details", {
+							className: "rp-raw",
+							children: [/* @__PURE__ */ (0, g.jsx)("summary", { children: "Raw span" }), /* @__PURE__ */ (0, g.jsx)("pre", {
+								className: "rp-json",
+								children: JSON.stringify({
+									agent: N.agent.name,
+									kind: N.step.kind,
+									...N.step.kind === "tool" ? { tool: N.step.tool } : N.step.kind === "model" ? { model: N.step.model ?? N.agent.node.model } : {},
+									...N.step.target ? { target: N.step.target } : {},
+									startedAt: new Date(e.t0 + N.step.t).toISOString(),
+									durationMs: N.step.d,
+									failed: N.step.failed,
+									...N.step.latency === null ? {} : { latencyMs: N.step.latency },
+									tokens: N.step.tokens,
+									...N.step.usd === null ? {} : { billedUsd: N.step.usd }
+								}, null, 2)
+							})]
+						})
+					] }) : /* @__PURE__ */ (0, g.jsx)("p", {
+						className: "ws-status",
+						children: "No span matches."
+					})
+				})
+			})]
+		})]
+	});
+}
+//#endregion
+export { v as Traces };

package/dist/graph-viewer/viewer/{WallPages-CzWpyIfp.js → WallPages-Clj4bORg.js}

@@ -1,9 +1,9 @@
 import { i as e } from "./rolldown-runtime-DArdT4gl.js";
-import { i as t, t as n } from "./jsx-runtime-DQWyJOhv.js";
-import { t as r } from "./page-header-Brq611fd.js";
-import { p as i } from "./data-CkWfWr7i.js";
-import { c as a, l as o, u as s } from "./react-CY3IbSNO.js";
-import { n as c, r as l, s as u, t as d } from "./AnswerStrip-CGUyXuYH.js";
+import { n as t, t as n } from "./jsx-runtime-DPT6sCLq.js";
+import { t as r } from "./page-header-QbUg8F8i.js";
+import { p as i } from "./data-CVHeKhrh.js";
+import { c as a, l as o, u as s } from "./react-DQ7E2Epi.js";
+import { n as c, r as l, s as u, t as d } from "./AnswerStrip-B7xMU57A.js";
 //#region src/workspace/WallPages.tsx
 var f = /* @__PURE__ */ e(t(), 1), p = n(), m = {
 	ok: "var(--ar-c-ok)",
@@ -97,19 +97,19 @@ function C({ h: e }) {
 					used: e.load1,
 					total: e.loadLimit,
 					text: "",
-					tone: t ? m.breach : "var(--ws-accent)"
+					tone: t ? m.breach : e.load1 !== null && e.loadLimit !== null && e.load1 >= e.loadLimit ? m.warn : "var(--wp-ink)"
 				})]
 			}),
 			/* @__PURE__ */ (0, p.jsx)(S, { h: e }),
-			e.breaches.length > 0 && /* @__PURE__ */ (0, p.jsx)("ul", {
-				className: "wp-over",
-				children: e.breaches.map((e) => /* @__PURE__ */ (0, p.jsx)("li", {
-					"data-alarm": e.alarm || void 0,
-					children: /* @__PURE__ */ (0, p.jsx)(c, {
-						text: `${e.text} (${e.limit}${e.held ? `; ${e.held}` : ""})`,
-						children: e.alarm && e.held ? `${e.label.replace(/\s*\/\s*$/, "")}: ${e.held}` : e.label
-					})
-				}, e.label))
+			e.breaches.filter((e) => e.alarm).map((e) => /* @__PURE__ */ (0, p.jsxs)(c, {
+				className: "wp-alarm",
+				text: `${e.text} (${e.limit}${e.held ? `; ${e.held}` : ""})`,
+				children: [/* @__PURE__ */ (0, p.jsx)("b", { children: e.label.replace(/\s*\/\s*$/, "") }), e.held ? ` ${e.held}` : ` ${e.text}`]
+			}, e.label)),
+			e.breaches.some((e) => !e.alarm) && /* @__PURE__ */ (0, p.jsxs)(c, {
+				className: "wp-watch",
+				text: e.breaches.filter((e) => !e.alarm).map((e) => `${e.label}: ${e.text} (${e.limit})`).join("; "),
+				children: ["Watching: ", e.breaches.filter((e) => !e.alarm).map((e) => e.label).join(", ")]
 			})
 		]
 	});
@@ -218,20 +218,28 @@ function E({ doc: e }) {
 						l ? `, first back ${u(l, Date.now())}` : ""
 					]
 				})] }),
-				o.length > 0 && /* @__PURE__ */ (0, p.jsx)("ul", {
-					className: "wp-back",
-					children: o.map((e) => /* @__PURE__ */ (0, p.jsxs)("li", { children: [/* @__PURE__ */ (0, p.jsxs)("span", { children: [
-						e.provider.toLowerCase(),
-						" ",
-						e.name
-					] }), /* @__PURE__ */ (0, p.jsxs)("span", {
-						className: "wp-muted",
-						children: [
-							e.long.label ? `${e.long.label} · ` : "",
-							"back ",
-							e.back ? u(e.back, Date.now()) : "—"
-						]
-					})] }, `${e.provider} ${e.name}`))
+				[...new Set(o.map((e) => e.provider))].map((e) => {
+					let t = o.filter((t) => t.provider === e), n = t.map((e) => e.back).filter((e) => !!e).sort()[0];
+					return /* @__PURE__ */ (0, p.jsxs)("details", {
+						className: "wp-group wp-seats",
+						children: [/* @__PURE__ */ (0, p.jsxs)("summary", { children: [
+							/* @__PURE__ */ (0, p.jsx)("b", { children: e[0].toUpperCase() + e.slice(1).toLowerCase() }),
+							" ",
+							t.length,
+							" at a limit",
+							n ? `, first back ${u(n, Date.now())}` : ""
+						] }), /* @__PURE__ */ (0, p.jsx)("ul", {
+							className: "wp-back",
+							children: t.map((e) => /* @__PURE__ */ (0, p.jsxs)("li", { children: [/* @__PURE__ */ (0, p.jsx)("span", { children: e.name }), /* @__PURE__ */ (0, p.jsxs)("span", {
+								className: "wp-muted",
+								children: [
+									e.long.label ? `${e.long.label} · ` : "",
+									"back ",
+									e.back ? u(e.back, Date.now()) : "—"
+								]
+							})] }, e.name))
+						})]
+					}, e);
 				}),
 				c.length > 0 && /* @__PURE__ */ (0, p.jsxs)("details", {
 					className: "wp-group",
@@ -246,9 +254,19 @@ function E({ doc: e }) {
 						}))
 					})]
 				}),
-				i.length > 0 && /* @__PURE__ */ (0, p.jsxs)("p", {
-					className: "wp-muted wp-line",
-					children: ["Not reported: ", i.map((e) => `${e.provider.toLowerCase()} ${e.name}${e.long.why ? ` (${e.long.why})` : ""}`).join(", ")]
+				i.length > 0 && /* @__PURE__ */ (0, p.jsxs)("details", {
+					className: "wp-group",
+					children: [/* @__PURE__ */ (0, p.jsxs)("summary", { children: [i.length, " not reported"] }), /* @__PURE__ */ (0, p.jsx)("ul", {
+						className: "wp-back",
+						children: i.map((e) => /* @__PURE__ */ (0, p.jsxs)("li", { children: [/* @__PURE__ */ (0, p.jsxs)("span", { children: [
+							e.provider.toLowerCase(),
+							" ",
+							e.name
+						] }), /* @__PURE__ */ (0, p.jsx)("span", {
+							className: "wp-muted",
+							children: e.long.why ?? "no reading"
+						})] }, `${e.provider} ${e.name}`))
+					})]
 				})
 			]
 		})]