@tangle-network/sandbox-cli 0.22.0-develop.20260814062836.bb3da78 → 0.22.0

package/dist/graph-viewer/viewer/ui-Co03nZUX.js

@@ -0,0 +1,889 @@
+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 "./react-dom-BEusmvQH.js";
+import { r as i, t as a } from "./status-meta-S0kV_RDp.js";
+//#region src/workspace/use-phone.ts
+var o = /* @__PURE__ */ e(r(), 1), s = /* @__PURE__ */ e(t(), 1), c = "(max-width: 1023px)";
+function l(e = c) {
+	return (0, s.useSyncExternalStore)((t) => {
+		let n = window.matchMedia(e);
+		return n.addEventListener("change", t), () => n.removeEventListener("change", t);
+	}, () => window.matchMedia(e).matches, () => !1);
+}
+//#endregion
+//#region src/workspace/run/model.ts
+var u = (e) => e ? Date.parse(e) : NaN;
+function d(e, t) {
+	if (!e.length) return null;
+	let n = [...e].sort((e, t) => e - t);
+	return n[Math.min(n.length - 1, Math.max(0, Math.ceil(t / 100 * n.length) - 1))];
+}
+function f(e, t, n, r) {
+	return {
+		name: e,
+		calls: t.length,
+		failures: n,
+		ms: r,
+		durations: t,
+		p50: d(t, 50),
+		p90: d(t, 90),
+		p99: d(t, 99)
+	};
+}
+var p = (e) => e ? e.split("/").pop() ?? e : null, m = (e) => {
+	let t = e.name ?? "", n = t.indexOf(" · ");
+	return n >= 0 ? t.slice(n + 3) : null;
+}, h = (e) => typeof e == "number" && Number.isFinite(e) && e >= 0 ? e : null, g = (e) => e?.tools && Object.values(e.tools).every((e) => h(e.calls) !== null) ? Object.values(e.tools).reduce((e, t) => e + t.calls, 0) : null;
+function _(e) {
+	return e.status === "failed" ? {
+		label: i(e.status).label,
+		tone: "fail"
+	} : e.status === "needs-you" || e.status === "waiting" ? {
+		label: i(e.status).label,
+		tone: e.status
+	} : e.status === "running" ? {
+		label: i(e.status).label,
+		tone: "live"
+	} : e.status === "succeeded" ? {
+		label: `${i(e.status).label}${e.shipped ? " · Shipped" : ""}`,
+		tone: e.shipped ? "ok" : "done"
+	} : {
+		label: i(e.status).label,
+		tone: e.status === "idle" ? "none" : ""
+	};
+}
+function v(e, t) {
+	let n = e.nodes, r = new Map(e.edges.filter((e) => e.kind === "spawn").map((e) => [e.to, e.from])), i = new Set(n.map((e) => e.id)), a = n.map((e) => u(e.start)).filter(Number.isFinite), o = Number.isFinite(u(t.startedAt)) ? u(t.startedAt) : a.length ? Math.min(...a) : Date.now(), s = n.map((e) => u(e.end ?? e.lastAt)).filter(Number.isFinite), c = e.live ? Math.max(0, Date.now() - o) : t.durationMs ?? Math.max(0, (s.length ? Math.max(...s) : o) - o), l = (e) => {
+		let t = r.get(e.id);
+		return t && i.has(t) ? t : null;
+	}, v = n.map((e) => {
+		let t = e.usage ?? null, n = (t?.steps ?? []).map((e) => ({
+			t: e.startMs - o,
+			d: Math.max(0, e.endMs - e.startMs),
+			kind: e.kind,
+			failed: !!e.failed,
+			tool: e.kind === "tool" ? e.tool ?? e.name?.split(" · ")[0] ?? "tool" : null,
+			target: e.kind === "tool" ? m(e) : null,
+			model: e.model ?? null,
+			latency: e.kind === "model" ? e.latencyMs ?? Math.max(0, e.endMs - e.startMs) : null,
+			tokens: e.byClass ? {
+				input: e.byClass.input ?? 0,
+				output: e.byClass.output ?? 0,
+				cacheRead: e.byClass.cacheRead ?? 0
+			} : null,
+			usd: e.billedUsd ?? null
+		}));
+		n.sort((e, t) => e.t - t.t);
+		let r = n.filter((e) => e.kind === "model"), i = Object.entries(t?.tools ?? {}).filter(([, e]) => h(e.calls) !== null).map(([e, t]) => {
+			let r = n.filter((t) => t.kind === "tool" && t.tool === e).map((e) => e.d);
+			return {
+				...f(e, r.length === t.calls ? r : [], t.failures, t.ms),
+				calls: t.calls
+			};
+		});
+		i.sort((e, t) => t.calls - e.calls || e.name.localeCompare(t.name));
+		let a = r.map((e) => e.latency).filter((e) => Number.isFinite(e)), s = n.map((e) => e.t + e.d), c = Number.isFinite(u(e.start)) ? u(e.start) - o : n[0]?.t ?? null, v = Number.isFinite(u(e.end)) ? u(e.end) - o : s.length ? Math.max(...s) : null;
+		return {
+			id: e.id,
+			name: e.role ?? e.label,
+			node: e,
+			parent: l(e),
+			children: [],
+			depth: 0,
+			team: null,
+			status: e.status,
+			state: _(e),
+			model: p(e.model ?? Object.keys(t?.models ?? {})[0]),
+			harness: e.harness,
+			start: c,
+			end: v,
+			tokens: t?.tokens ?? null,
+			byClass: t?.byClass ?? null,
+			billedUsd: t?.billedUsd ?? null,
+			listUsd: t?.listUsd ?? null,
+			steps: n,
+			lastActivityAt: t?.lastActivityAt ?? e.lastActivityAt ?? void 0,
+			medianEventGapMs: t?.medianEventGapMs ?? e.medianEventGapMs ?? void 0,
+			events: t?.activityEvents ?? e.activityEvents ?? [],
+			modelCalls: h(t?.calls),
+			toolCalls: g(t),
+			failedSteps: t?.failures ? t.failures.model + t.failures.tool : n.filter((e) => e.failed).length,
+			toolFailures: t?.failures?.tool ?? i.reduce((e, t) => e + t.failures, 0),
+			retries: (t?.retries?.model ?? 0) + (t?.retries?.tool ?? 0),
+			latency: {
+				p50: t?.latencyMs?.p50 ?? (t?.calls === a.length ? d(a, 50) : null),
+				p90: t?.latencyMs?.p90 ?? (t?.calls === a.length ? d(a, 90) : null),
+				p99: t?.calls === a.length ? d(a, 99) : null
+			},
+			tools: i,
+			busy: n.filter((e) => e.kind !== "waiting").reduce((e, t) => e + t.d, 0),
+			first: n.length ? n[0].t : null,
+			last: s.length ? Math.max(...s) : null,
+			restarts: (e.restarts ?? []).map((e) => u(e) - o).filter(Number.isFinite),
+			turns: e.turns ?? null,
+			commits: typeof e.shipped == "number" ? e.shipped : null
+		};
+	}), b = new Map(v.map((e) => [e.id, e]));
+	for (let e of v) e.parent && b.get(e.parent)?.children.push(e.id);
+	let x = (e) => b.get(e)?.start ?? 2 ** 53 - 1;
+	for (let e of v) e.children.sort((e, t) => x(e) - x(t));
+	let S = v.find((e) => !e.parent) ?? null, C = [], w = /* @__PURE__ */ new Set(), T = (e, t) => {
+		if (!w.has(e.id)) {
+			w.add(e.id), e.depth = t, C.push(e);
+			for (let n of e.children) T(b.get(n), t + 1);
+		}
+	};
+	for (let e of v.filter((e) => !e.parent).sort((e, t) => (e.start ?? 0) - (t.start ?? 0))) T(e, 0);
+	for (let e of v) w.has(e.id) || T(e, 0);
+	let E = v.filter((e) => e.children.length > 8).map((e) => ({
+		id: e.id,
+		label: `${e.name} team`,
+		members: e.children
+	}));
+	for (let e of E) for (let t of e.members) b.get(t).team = e.id;
+	for (let e of E) b.get(e.id).team ??= e.id;
+	let D = v.flatMap((e) => e.steps.map((t) => ({
+		agent: e,
+		step: t
+	}))).sort((e, t) => e.step.t - t.step.t), O = y(v), k = e.runUsage ?? null, A = (e) => v.length && v.every((t) => e(t) !== null) ? v.reduce((t, n) => t + (e(n) ?? 0), 0) : null, j = D.map(({ step: e }) => e.t + e.d), M = e.releases.map((e) => ({
+		...e,
+		tagged: !!e.taggedAt,
+		taggedAt: e.taggedAt ?? e.at ?? null
+	}));
+	return {
+		t0: o,
+		duration: c,
+		live: e.live,
+		agents: v,
+		byId: b,
+		root: S,
+		tree: C,
+		teams: E,
+		tools: O,
+		steps: D,
+		totals: {
+			steps: D.length,
+			model: h(k?.calls) ?? A((e) => e.modelCalls),
+			tool: g(k) ?? A((e) => e.toolCalls),
+			failed: D.filter((e) => e.step.failed).length,
+			toolFailures: D.filter((e) => e.step.kind === "tool" && e.step.failed).length,
+			retries: (k?.retries?.model ?? 0) + (k?.retries?.tool ?? 0),
+			tokens: k?.tokens ?? A((e) => e.tokens),
+			byClass: k?.byClass ?? null,
+			billedUsd: k?.billedUsd ?? A((e) => e.billedUsd),
+			listUsd: k?.listUsd ?? null,
+			busy: v.reduce((e, t) => e + t.busy, 0),
+			lastStep: j.length ? Math.max(...j) : null
+		},
+		pauses: (e.pauses ?? []).map((e) => ({
+			from: u(e.from) - o,
+			to: u(e.to) - o,
+			reason: e.reason
+		})).filter((e) => Number.isFinite(e.from) && Number.isFinite(e.to)),
+		releases: M,
+		best: M.find((t) => t.release === e.best) ?? null,
+		ws: e
+	};
+}
+function y(e) {
+	let t = /* @__PURE__ */ new Map();
+	for (let n of e) for (let e of n.tools) {
+		let n = t.get(e.name) ?? {
+			d: [],
+			f: 0,
+			ms: 0,
+			calls: 0
+		};
+		n.d.push(...e.durations), n.f += e.failures, n.ms += e.ms, n.calls += e.calls, t.set(e.name, n);
+	}
+	return [...t].map(([e, t]) => ({
+		...f(e, t.d.length === t.calls ? t.d : [], t.f, t.ms),
+		calls: t.calls
+	})).sort((e, t) => t.calls - e.calls);
+}
+var b = (e) => String(e).padStart(2, "0"), x = (e) => (t) => {
+	let n = new Date(e + t);
+	return `${b(n.getUTCHours())}:${b(n.getUTCMinutes())}`;
+}, S = (e) => (t) => {
+	let n = new Date(e + t);
+	return `${b(n.getUTCHours())}:${b(n.getUTCMinutes())}:${b(n.getUTCSeconds())}`;
+}, C = (e, t, n = `${t}s`) => `${e.toLocaleString("en-US")} ${e === 1 ? t : n}`, w = (e, t, n) => {
+	let r = x(e);
+	return n === "now" ? `${r(t)}–now` : new Date(e + t).toISOString().slice(0, 10) === new Date(e + n).toISOString().slice(0, 10) ? `${r(t)}–${r(n)}` : `${r(t)}, ${E(n - t)}`;
+}, T = (e, t) => `${t ? `${new Date(e).toLocaleDateString("en-US", {
+	month: "short",
+	day: "numeric",
+	timeZone: "UTC"
+})} ` : ""}${e.slice(11, 16)} UTC`;
+function E(e) {
+	if (e == null || !Number.isFinite(e)) return "—";
+	if (e < 1e3) return `${Math.round(e)} ms`;
+	if (e < 59500) return `${(e / 1e3).toFixed(+(e < 9950))} s`;
+	if (e < 36e5) {
+		let t = Math.round(e / 1e3);
+		if (t < 3600) return t % 60 ? `${Math.floor(t / 60)}m ${b(t % 60)}s` : `${t / 60} min`;
+	}
+	let t = Math.round(e / 6e4);
+	return `${Math.floor(t / 60)}h ${b(t % 60)}m`;
+}
+function D(e) {
+	if (e == null || !Number.isFinite(e)) return "—";
+	if (e < 1e3) return `${Math.round(e)}ms`;
+	if (e < 59500) return `${(e / 1e3).toFixed(+(e < 9950))}s`;
+	let t = Math.round(e / 1e3);
+	return t < 3600 ? `${Math.floor(t / 60)}m${b(t % 60)}s` : E(e);
+}
+var O = new Intl.NumberFormat("en-US"), k = [
+	0,
+	1,
+	2
+].map((e) => new Intl.NumberFormat("en-US", {
+	notation: "compact",
+	maximumFractionDigits: e
+})), A = (e) => e == null ? "—" : O.format(e), j = (e) => e == null ? "—" : k[e >= 1e8 ? 0 : e >= 1e6 ? 2 : 1].format(e), M = (e) => e == null ? "—" : e >= 100 ? `$${e.toFixed(0)}` : `$${e.toFixed(2)}`, N = (e) => e.length < 2 ? e.join("") : `${e.slice(0, -1).join(", ")} and ${e.at(-1)}`;
+function P(e) {
+	let t = e?.latest;
+	if (!t) return {
+		word: "Not checked",
+		tone: "none",
+		note: null
+	};
+	if (t.solved) return {
+		word: "Passed",
+		tone: "ok",
+		note: t.tag ? `${t.tag} passed the check` : null
+	};
+	if (e?.held && (!e.held.tag || e.held.tag === t.tag)) {
+		let n = e.calibration?.uncalibrated ?? e.calibration?.stages?.filter((e) => e.state !== "calibrated").map((e) => e.name) ?? [];
+		return {
+			word: "Held",
+			tone: "held",
+			note: `${t.tag ? `${t.tag} passed; it` : "It"} counts once ${n.length ? `${N(n)} ${n.length === 1 ? "has" : "have"} a known-good fixture` : "its checker is calibrated"}`
+		};
+	}
+	return t.known ? {
+		word: "Not solved",
+		tone: "fail",
+		note: null
+	} : {
+		word: "No verdict",
+		tone: "none",
+		note: null
+	};
+}
+function F(e, t) {
+	return [
+		{
+			label: "Tokens",
+			value: t.byClass ? `${A(t.byClass.input)} in / ${A(t.byClass.output)} out / ${A(t.byClass.cacheRead)} cached` : t.tokens === null ? "Not recorded" : `${A(t.tokens)} total · split not recorded`
+		},
+		{
+			label: "Cost",
+			value: t.listUsd === null ? t.billedUsd === null ? "Not recorded" : `${t.node.usage?.billedComplete === !1 ? "≥" : ""}${M(t.billedUsd)} billed` : `${t.node.usage?.listComplete === !1 ? "≥" : ""}${M(t.listUsd)} catalog`
+		},
+		{
+			label: "Billed cost",
+			value: t.billedUsd === null ? "Not recorded" : `${t.node.usage?.billedComplete === !1 ? "≥" : ""}${M(t.billedUsd)}`
+		},
+		{
+			label: "Model calls",
+			value: A(t.modelCalls)
+		},
+		{
+			label: "Model latency",
+			value: `${D(t.latency.p50)} p50 / ${D(t.latency.p90)} p90 / ${D(t.latency.p99)} p99`
+		},
+		{
+			label: "Tool calls",
+			value: A(t.toolCalls)
+		},
+		{
+			label: "Tool failures",
+			value: t.node.usage?.tools || t.node.usage?.failures ? A(t.toolFailures) : "Not recorded"
+		},
+		{
+			label: "Failures",
+			value: t.node.usage?.failures ? `${A(t.failedSteps)} failed steps` : "Not recorded"
+		},
+		{
+			label: "Retries",
+			value: `${t.node.usage?.retries ? A(t.retries) : "—"} retried steps · ${t.node.restarts ? A(t.restarts.length) : "—"} restarts`
+		},
+		{
+			label: "Observed work / run duration",
+			value: `${E(t.busy)} / ${E(e.duration)}`
+		},
+		{
+			label: "Spawned / commits",
+			value: `${t.children.length} / ${A(t.commits)}`
+		},
+		...t.turns === null ? [] : [{
+			label: "Turns",
+			value: A(t.turns)
+		}],
+		...t.tools.map((e) => ({
+			label: e.name,
+			value: `${A(e.calls)} calls · ${A(e.failures)} failures · ${D(e.p50)} / ${D(e.p90)} / ${D(e.p99)} p50/p90/p99`
+		}))
+	];
+}
+//#endregion
+//#region src/workspace/run/ui.tsx
+var I = n(), L = {
+	search: "M11 11l3.5 3.5M7 12.5a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11z",
+	chevron: "M4 6l4 4 4-4",
+	arrow: "M3 8h10M9 4l4 4-4 4",
+	x: "M4 4l8 8M12 4l-8 8",
+	stop: "M8 14.5a6.5 6.5 0 1 0 0-13 6.5 6.5 0 0 0 0 13zM3.5 12.5l9-9",
+	download: "M8 2v8M4.5 6.5L8 10l3.5-3.5M2.5 13.5h11",
+	link: "M6.5 9.5l3-3M7 4.5l1-1a2.8 2.8 0 0 1 4 4l-1 1M9 11.5l-1 1a2.8 2.8 0 0 1-4-4l1-1",
+	info: "M8 14.5a6.5 6.5 0 1 0 0-13 6.5 6.5 0 0 0 0 13zM8 7.2v4M8 4.8v.2",
+	max: "M9.5 2.5h4v4M6.5 13.5h-4v-4M13.5 2.5L9 7M2.5 13.5L7 9",
+	min: "M13.5 6.5h-4v-4M2.5 9.5h4v4M9.5 6.5l4-4M6.5 9.5l-4 4",
+	more: "M3.5 8h.01M8 8h.01M12.5 8h.01",
+	users: "M6 7a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5zM1.5 14c0-2.5 2-4.5 4.5-4.5s4.5 2 4.5 4.5M11 2.2a2.5 2.5 0 0 1 0 4.6M12.5 9.7c1.2.6 2 1.9 2 3.3",
+	alert: "M8 1.8l6.5 11.5h-13zM8 6v3.5M8 11.4v.2",
+	check: "M3 8.5l3 3 7-7",
+	clock: "M8 14.5a6.5 6.5 0 1 0 0-13 6.5 6.5 0 0 0 0 13zM8 4.5V8l2.5 1.5",
+	flag: "M3 14.5V2M3 2.5h8l-1.5 3 1.5 3H3",
+	down: "M8 2.5v11M3.5 9L8 13.5 12.5 9",
+	file: "M9.5 1.8h-5a1.5 1.5 0 0 0-1.5 1.5v9.4a1.5 1.5 0 0 0 1.5 1.5h7a1.5 1.5 0 0 0 1.5-1.5V5.3zM9.5 1.8v3.5H13M5.5 8.5h5M5.5 11h3.5"
+};
+function R({ name: e, size: t = 16, className: n }) {
+	return /* @__PURE__ */ (0, I.jsx)("svg", {
+		className: `rp-i${n ? ` ${n}` : ""}`,
+		width: t,
+		height: t,
+		viewBox: "0 0 16 16",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ (0, I.jsx)("path", { d: L[e] })
+	});
+}
+var z = ({ tone: e }) => e === "waiting" || e === "needs-you" ? /* @__PURE__ */ (0, I.jsx)(a, {
+	status: e,
+	"aria-hidden": !0
+}) : /* @__PURE__ */ (0, I.jsx)("span", {
+	className: `rp-dot${e ? ` ${e}` : ""}`,
+	"aria-hidden": "true"
+});
+function B({ text: e, query: t }) {
+	let n = t.trim().toLowerCase(), r = n ? e.toLowerCase().indexOf(n) : -1;
+	return r < 0 ? /* @__PURE__ */ (0, I.jsx)(I.Fragment, { children: e }) : /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [
+		e.slice(0, r),
+		/* @__PURE__ */ (0, I.jsx)("mark", { children: e.slice(r, r + n.length) }),
+		e.slice(r + n.length)
+	] });
+}
+var V = (0, s.createContext)(null), H = () => (0, s.useContext)(V);
+function U({ children: e }) {
+	let [t, n] = (0, s.useState)(null), r = (0, s.useRef)(!1), i = (0, s.useRef)(0), a = (0, s.useRef)(null), c = (0, s.useMemo)(() => ({
+		show: (e) => {
+			r.current || (window.clearTimeout(i.current), n(e));
+		},
+		hide: () => {
+			r.current || (window.clearTimeout(i.current), i.current = window.setTimeout(() => {
+				!a.current?.matches(":hover") && !a.current?.contains(document.activeElement) && n(null);
+			}, 160));
+		},
+		hideNow: () => {
+			window.clearTimeout(i.current), r.current = !1, n(null);
+		},
+		pin: () => {
+			r.current = !0, n((e) => e && {
+				...e,
+				follow: !1,
+				pinned: !0
+			});
+		},
+		pinned: () => r.current
+	}), []);
+	return (0, s.useEffect)(() => {
+		let e = (e) => {
+			e.key === "Escape" && c.hideNow();
+		}, t = (e) => {
+			r.current && a.current && !a.current.contains(e.target) && c.hideNow();
+		};
+		return window.addEventListener("keydown", e), window.addEventListener("pointerdown", t), () => {
+			window.removeEventListener("keydown", e), window.removeEventListener("pointerdown", t);
+		};
+	}, [c]), (0, s.useLayoutEffect)(() => {
+		let e = a.current;
+		if (!e || !t) return;
+		let n = e.offsetWidth, r = e.offsetHeight, i = window.innerWidth, o = window.innerHeight, { rect: s, bounds: c } = t, l, u;
+		if (i <= 720 || t.vertical && c) l = Math.max((c?.left ?? 0) + 8, Math.min(s.left, (c?.right ?? i) - 8 - n)), i <= 720 && (l = Math.max(12, (i - n) / 2)), u = s.bottom + 8, u + r > Math.min(o, c?.bottom ?? o) - 8 && (u = s.top - 8 - r);
+		else {
+			let e = c ? {
+				l: Math.max(12, c.left + 8),
+				r: Math.min(i - 12, c.right - 8),
+				t: Math.max(12, c.top + 8),
+				b: Math.min(o - 12, c.bottom - 8)
+			} : {
+				l: 12,
+				r: i - 12,
+				t: 12,
+				b: o - 12
+			}, a = t.x ?? s.right, d = t.x ?? s.left;
+			l = a + 14, l + n > e.r && (l = d - 14 - n), l < e.l && (l = Math.max(12, Math.min(i - n - 12, a + 14))), u = s.top + (s.bottom - s.top) / 2 - r / 2, u = r <= e.b - e.t ? Math.max(e.t, Math.min(u, e.b - r)) : Math.max(12, Math.min(u, o - r - 12));
+		}
+		e.style.left = `${Math.round(Math.max(12, l))}px`, e.style.top = `${Math.round(Math.max(12, Math.min(u, o - r - 12)))}px`;
+	}, [t]), /* @__PURE__ */ (0, I.jsxs)(V.Provider, {
+		value: c,
+		children: [e, t && typeof document < "u" && (0, o.createPortal)(/* @__PURE__ */ (0, I.jsxs)("div", {
+			ref: a,
+			className: `rp-hc${t.wide ? " wide" : ""}${t.follow ? " follow" : ""}`,
+			role: t.pinned ? "dialog" : "tooltip",
+			"data-pinned": t.pinned || void 0,
+			onPointerLeave: () => {
+				r.current || n(null);
+			},
+			children: [t.pinned && /* @__PURE__ */ (0, I.jsx)("button", {
+				type: "button",
+				className: "rp-card-x",
+				"aria-label": "Close",
+				onClick: c.hideNow,
+				children: /* @__PURE__ */ (0, I.jsx)(R, {
+					name: "x",
+					size: 14
+				})
+			}), t.content]
+		}), document.querySelector(".agent-record") ?? document.body)]
+	});
+}
+function W({ tools: e, rows: t = 9 }) {
+	let n = Math.max(1, ...e.map((e) => e.calls));
+	return /* @__PURE__ */ (0, I.jsxs)("div", {
+		className: "rp-tt",
+		children: [
+			/* @__PURE__ */ (0, I.jsx)("span", {
+				className: "h",
+				children: "Tool"
+			}),
+			/* @__PURE__ */ (0, I.jsx)("span", { className: "h" }),
+			/* @__PURE__ */ (0, I.jsx)("span", {
+				className: "h r",
+				children: "calls"
+			}),
+			/* @__PURE__ */ (0, I.jsx)("span", {
+				className: "h r",
+				children: "✕ · p50"
+			}),
+			e.slice(0, t).map((e) => /* @__PURE__ */ (0, I.jsx)(G, {
+				t: e,
+				max: n
+			}, e.name)),
+			e.length > t && /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [
+				/* @__PURE__ */ (0, I.jsxs)("span", {
+					className: "l",
+					children: [e.length - t, " more tools"]
+				}),
+				/* @__PURE__ */ (0, I.jsx)("span", {}),
+				/* @__PURE__ */ (0, I.jsx)("span", {
+					className: "r",
+					children: A(e.slice(t).reduce((e, t) => e + t.calls, 0))
+				}),
+				/* @__PURE__ */ (0, I.jsx)("span", {})
+			] })
+		]
+	});
+}
+function G({ t: e, max: t }) {
+	return /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [
+		/* @__PURE__ */ (0, I.jsx)("span", {
+			className: "l",
+			title: e.name,
+			children: e.name
+		}),
+		/* @__PURE__ */ (0, I.jsx)(K, {
+			ok: e.calls - e.failures,
+			failed: e.failures,
+			max: t
+		}),
+		/* @__PURE__ */ (0, I.jsx)("span", {
+			className: "r",
+			children: A(e.calls)
+		}),
+		/* @__PURE__ */ (0, I.jsx)("span", {
+			className: e.failures ? "f" : "r",
+			children: e.failures ? `${e.failures} ✕` : D(e.p50)
+		})
+	] });
+}
+function K({ ok: e, failed: t = 0, max: n }) {
+	return /* @__PURE__ */ (0, I.jsxs)("span", {
+		className: "rp-bar",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ (0, I.jsx)("b", { style: { width: `${Math.max(0, e) / n * 100}%` } }), t > 0 && /* @__PURE__ */ (0, I.jsx)("b", {
+			className: "f",
+			style: { width: `${t / n * 100}%` }
+		})]
+	});
+}
+var q = (e) => e.listUsd === null ? e.billedUsd === null ? "not recorded" : `${e.node.usage?.billedComplete === !1 ? "≥" : ""}${M(e.billedUsd)} billed` : `${e.node.usage?.listComplete === !1 ? "≥" : ""}${M(e.listUsd)} list · ${e.billedUsd !== null && e.node.usage?.billedComplete === !1 ? "≥" : ""}${M(e.billedUsd)} billed`;
+function J({ m: e, a: t, head: n }) {
+	let r = (t) => new Date(e.t0 + t).toISOString().slice(11, 16), i = t.parent ? e.byId.get(t.parent) : null;
+	return /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [n ?? /* @__PURE__ */ (0, I.jsxs)("div", {
+		className: "rp-card-h",
+		children: [/* @__PURE__ */ (0, I.jsxs)("div", {
+			className: "t",
+			children: [
+				/* @__PURE__ */ (0, I.jsx)(z, { tone: t.state.tone }),
+				/* @__PURE__ */ (0, I.jsx)("span", {
+					className: "nm",
+					children: t.name
+				}),
+				/* @__PURE__ */ (0, I.jsx)("span", {
+					className: "v",
+					children: t.state.label
+				})
+			]
+		}), /* @__PURE__ */ (0, I.jsx)("div", {
+			className: "s",
+			children: i ? `spawned by ${i.name}${t.start === null ? "" : ` at ${r(Math.max(0, t.start))} UTC`}` : `run root · ${r(0)} UTC`
+		})]
+	}), /* @__PURE__ */ (0, I.jsxs)("div", {
+		className: `rp-card-cols${t.tools.length ? " two" : ""}`,
+		children: [/* @__PURE__ */ (0, I.jsxs)("section", { children: [/* @__PURE__ */ (0, I.jsxs)("h6", { children: ["Whole run", t.model ? ` · ${t.model}` : ""] }), /* @__PURE__ */ (0, I.jsxs)("dl", { children: [
+			/* @__PURE__ */ (0, I.jsx)("dt", { children: "Tokens" }),
+			/* @__PURE__ */ (0, I.jsx)("dd", { children: t.tokens === null ? "not recorded" : j(t.tokens) }),
+			t.tokens !== null && /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [/* @__PURE__ */ (0, I.jsx)("dt", { children: "In · out · cached" }), /* @__PURE__ */ (0, I.jsx)("dd", { children: t.byClass ? `${j(t.byClass.input)} · ${j(t.byClass.output)} · ${j(t.byClass.cacheRead)}` : /* @__PURE__ */ (0, I.jsx)("small", { children: "not recorded" }) })] }),
+			/* @__PURE__ */ (0, I.jsx)("dt", { children: "Cost" }),
+			/* @__PURE__ */ (0, I.jsx)("dd", { children: q(t) }),
+			/* @__PURE__ */ (0, I.jsx)("dt", { children: "Model calls" }),
+			/* @__PURE__ */ (0, I.jsx)("dd", { children: A(t.modelCalls) }),
+			t.latency.p50 !== null && /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [/* @__PURE__ */ (0, I.jsx)("dt", { children: "Model p50 · p90 · p99" }), /* @__PURE__ */ (0, I.jsxs)("dd", { children: [
+				D(t.latency.p50),
+				" · ",
+				D(t.latency.p90),
+				" · ",
+				D(t.latency.p99)
+			] })] }),
+			/* @__PURE__ */ (0, I.jsx)("dt", { children: "Tool calls" }),
+			/* @__PURE__ */ (0, I.jsxs)("dd", { children: [A(t.toolCalls), t.toolFailures ? /* @__PURE__ */ (0, I.jsxs)("span", {
+				className: "f",
+				children: [
+					" · ",
+					t.toolFailures,
+					" failed"
+				]
+			}) : null] }),
+			t.retries > 0 && /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [/* @__PURE__ */ (0, I.jsx)("dt", { children: "Retried steps" }), /* @__PURE__ */ (0, I.jsx)("dd", { children: t.retries })] }),
+			/* @__PURE__ */ (0, I.jsx)("dt", { children: "Restarts" }),
+			/* @__PURE__ */ (0, I.jsx)("dd", { children: t.restarts.length }),
+			/* @__PURE__ */ (0, I.jsx)("dt", { children: "Spawned · commits" }),
+			/* @__PURE__ */ (0, I.jsxs)("dd", { children: [
+				t.children.length,
+				" · ",
+				t.commits ?? "—"
+			] }),
+			/* @__PURE__ */ (0, I.jsx)("dt", { children: "Active" }),
+			/* @__PURE__ */ (0, I.jsx)("dd", { children: t.first === null ? "never" : `${r(t.first)}–${t.state.tone === "live" ? "now" : r(t.last ?? t.first)} UTC` }),
+			t.first !== null && /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [/* @__PURE__ */ (0, I.jsx)("dt", { children: "Busy" }), /* @__PURE__ */ (0, I.jsx)("dd", { children: E(t.busy) })] })
+		] })] }), t.tools.length > 0 && /* @__PURE__ */ (0, I.jsxs)("section", { children: [/* @__PURE__ */ (0, I.jsx)("h6", { children: "Tool calls by tool" }), /* @__PURE__ */ (0, I.jsx)(W, { tools: t.tools })] })]
+	})] });
+}
+var Y = 36;
+function X(e) {
+	let [t, n] = (0, s.useState)(!1), r = (0, s.useRef)(null);
+	return /* @__PURE__ */ (0, I.jsxs)(I.Fragment, { children: [/* @__PURE__ */ (0, I.jsxs)("button", {
+		ref: r,
+		type: "button",
+		className: `rp-cbx${e.className ? ` ${e.className}` : ""}`,
+		style: e.style,
+		"aria-haspopup": "listbox",
+		"aria-expanded": t,
+		"aria-label": e.label,
+		onClick: () => n(!t),
+		children: [/* @__PURE__ */ (0, I.jsx)("span", {
+			className: "lbl",
+			children: e.children
+		}), /* @__PURE__ */ (0, I.jsx)("span", {
+			className: "cv",
+			children: /* @__PURE__ */ (0, I.jsx)(R, {
+				name: "chevron",
+				size: 14
+			})
+		})]
+	}), t && /* @__PURE__ */ (0, I.jsx)(Z, {
+		...e,
+		anchor: r.current,
+		onClose: (e) => {
+			n(!1), e && r.current?.focus();
+		}
+	})] });
+}
+function Z(e) {
+	let { options: t, groups: n, all: r, multi: i, anchor: a, onClose: c } = e, [l, u] = (0, s.useState)(""), [d, f] = (0, s.useState)(0), [p, m] = (0, s.useState)(0), h = (0, s.useRef)(null), g = (0, s.useRef)(null), _ = (0, s.useMemo)(() => `pk-${Math.random().toString(36).slice(2, 8)}`, []), v = (t) => i ? e.value.size === 0 || e.value.has(t) : e.value === t, y = (0, s.useMemo)(() => {
+		let e = l.trim().toLowerCase(), i = (t) => !e || `${t.label} ${t.find ?? ""}`.toLowerCase().includes(e), a = [];
+		r && !e && a.push({ kind: "all" });
+		let o = new Set((n ?? []).map((e) => e.id));
+		for (let e of t) (!e.group || !o.has(e.group)) && i(e) && a.push({
+			kind: "option",
+			option: e
+		});
+		for (let e of n ?? []) {
+			let n = t.filter((t) => t.group === e.id), r = n.filter(i);
+			if (r.length) {
+				a.push({
+					kind: "group",
+					id: e.id,
+					label: e.label,
+					members: n.map((e) => e.id)
+				});
+				for (let e of r) a.push({
+					kind: "option",
+					option: e
+				});
+			}
+		}
+		return a;
+	}, [
+		t,
+		n,
+		r,
+		l
+	]);
+	(0, s.useLayoutEffect)(() => {
+		let t = h.current;
+		if (!t) return;
+		let n = a.getBoundingClientRect(), r = Math.max(n.width, e.width ?? 280);
+		t.style.width = `${Math.min(r, window.innerWidth - 24)}px`, t.style.left = `${Math.max(12, Math.min(n.left, window.innerWidth - t.offsetWidth - 12))}px`;
+		let i = window.innerHeight - n.bottom;
+		t.style.top = i > t.offsetHeight + 16 || i > n.top ? `${n.bottom + 6}px` : `${Math.max(12, n.top - 6 - t.offsetHeight)}px`;
+	}, [
+		a,
+		y.length,
+		e.width
+	]), (0, s.useEffect)(() => {
+		let e = (e) => {
+			!h.current?.contains(e.target) && !a.contains(e.target) && c(!1);
+		};
+		return window.addEventListener("pointerdown", e), () => window.removeEventListener("pointerdown", e);
+	}, [a, c]), (0, s.useEffect)(() => f(0), [l]);
+	let b = (n) => {
+		if (!n) return;
+		if (!i) {
+			let t = e.onChange;
+			t(n.kind === "option" ? n.option.id : n.kind === "group" ? n.id : null), c(!0);
+			return;
+		}
+		let r = e.onChange;
+		if (n.kind === "all") return r(/* @__PURE__ */ new Set());
+		let a = new Set(e.value.size ? e.value : t.map((e) => e.id));
+		if (n.kind === "group") {
+			let e = n.members.every((e) => a.has(e));
+			for (let t of n.members) e ? a.delete(t) : a.add(t);
+		} else a.has(n.option.id) ? a.delete(n.option.id) : a.add(n.option.id);
+		r(a.size === t.length ? /* @__PURE__ */ new Set() : a);
+	}, x = (e) => {
+		let t = g.current;
+		if (!t) return;
+		let n = e * Y;
+		n < t.scrollTop ? t.scrollTop = n : n + Y > t.scrollTop + t.clientHeight && (t.scrollTop = n + Y - t.clientHeight);
+	}, S = (e) => {
+		let t = Math.max(0, Math.min(y.length - 1, e));
+		f(t), x(t);
+	}, C = (e) => {
+		let t = Math.max(1, Math.floor((g.current?.clientHeight ?? 360) / Y) - 1), n = {
+			ArrowDown: () => S(d + 1),
+			ArrowUp: () => S(d - 1),
+			PageDown: () => S(d + t),
+			PageUp: () => S(d - t),
+			Home: () => S(0),
+			End: () => S(y.length - 1),
+			Enter: () => b(y[d]),
+			Escape: () => c(!0),
+			Tab: () => c(!1)
+		}[e.key];
+		n && (e.key !== "Tab" && e.preventDefault(), n());
+	}, w = Math.min(y.length * Y + 8, 296), T = Math.max(0, Math.floor(p / Y) - 4), E = Math.min(y.length, Math.ceil((p + w) / Y) + 4), D = i ? e.value.size === 0 : e.value === null;
+	return (0, o.createPortal)(/* @__PURE__ */ (0, I.jsxs)("div", {
+		ref: h,
+		className: "rp-lb",
+		role: "presentation",
+		children: [
+			/* @__PURE__ */ (0, I.jsxs)("div", {
+				className: "rp-lb-s",
+				children: [
+					/* @__PURE__ */ (0, I.jsx)(R, { name: "search" }),
+					/* @__PURE__ */ (0, I.jsx)("input", {
+						autoFocus: !0,
+						value: l,
+						onChange: (e) => u(e.target.value),
+						onKeyDown: C,
+						placeholder: e.placeholder ?? "Search",
+						"aria-label": e.placeholder ?? e.label,
+						role: "combobox",
+						"aria-expanded": "true",
+						"aria-controls": _,
+						"aria-activedescendant": y[d] ? `${_}-${d}` : void 0,
+						"aria-autocomplete": "list"
+					}),
+					/* @__PURE__ */ (0, I.jsx)("kbd", { children: "Esc" })
+				]
+			}),
+			y.length ? /* @__PURE__ */ (0, I.jsx)("div", {
+				ref: g,
+				id: _,
+				className: "rp-lb-l",
+				role: "listbox",
+				"aria-multiselectable": i || void 0,
+				"aria-label": e.label,
+				style: { height: w },
+				onScroll: (e) => m(e.currentTarget.scrollTop),
+				children: /* @__PURE__ */ (0, I.jsx)("div", {
+					style: {
+						height: y.length * Y,
+						position: "relative"
+					},
+					children: y.slice(T, E).map((e, t) => {
+						let n = T + t, a = { top: n * Y + 4 }, o = `rp-lb-r${n === d ? " active" : ""}`;
+						if (e.kind === "group") {
+							let t = e.members.filter((e) => v(e)).length;
+							return /* @__PURE__ */ (0, I.jsxs)("div", {
+								id: `${_}-${n}`,
+								role: "option",
+								"aria-selected": i ? t === e.members.length : v(e.id),
+								className: `${o} grp`,
+								style: a,
+								onPointerEnter: () => f(n),
+								onClick: () => b(e),
+								children: [
+									i ? /* @__PURE__ */ (0, I.jsx)("span", {
+										className: `box${t && t < e.members.length ? " part" : ""}`,
+										children: t === e.members.length ? /* @__PURE__ */ (0, I.jsx)(R, {
+											name: "check",
+											size: 12
+										}) : t ? "–" : null
+									}) : /* @__PURE__ */ (0, I.jsx)("span", { className: "ck" }),
+									/* @__PURE__ */ (0, I.jsx)(R, {
+										name: "users",
+										size: 14
+									}),
+									/* @__PURE__ */ (0, I.jsx)("span", {
+										className: "nm",
+										children: e.label
+									}),
+									/* @__PURE__ */ (0, I.jsx)("span", {
+										className: "mt",
+										children: e.members.length
+									})
+								]
+							}, `g:${e.id}`);
+						}
+						let s = e.kind === "all" ? D : v(e.option.id), c = e.kind === "all" ? r.label : e.option.label, u = e.kind === "all" ? r.meta : e.option.meta;
+						return /* @__PURE__ */ (0, I.jsxs)("div", {
+							id: `${_}-${n}`,
+							role: "option",
+							"aria-selected": s,
+							className: `${o} opt`,
+							style: a,
+							onPointerEnter: () => f(n),
+							onClick: () => b(e),
+							children: [
+								i ? /* @__PURE__ */ (0, I.jsx)("span", {
+									className: "box",
+									children: s ? /* @__PURE__ */ (0, I.jsx)(R, {
+										name: "check",
+										size: 12
+									}) : null
+								}) : /* @__PURE__ */ (0, I.jsx)("span", {
+									className: "ck",
+									children: s ? /* @__PURE__ */ (0, I.jsx)(R, {
+										name: "check",
+										size: 14
+									}) : null
+								}),
+								e.kind === "option" && e.option.tone !== void 0 && /* @__PURE__ */ (0, I.jsx)(z, { tone: e.option.tone }),
+								/* @__PURE__ */ (0, I.jsx)("span", {
+									className: "nm",
+									children: /* @__PURE__ */ (0, I.jsx)(B, {
+										text: c,
+										query: l
+									})
+								}),
+								u && /* @__PURE__ */ (0, I.jsx)("span", {
+									className: "mt",
+									children: u
+								})
+							]
+						}, e.kind === "all" ? "all" : e.option.id);
+					})
+				})
+			}) : /* @__PURE__ */ (0, I.jsxs)("div", {
+				className: "rp-lb-e",
+				children: [
+					"Nothing matches “",
+					l,
+					"”"
+				]
+			}),
+			i && /* @__PURE__ */ (0, I.jsxs)("div", {
+				className: "rp-lb-f",
+				children: [/* @__PURE__ */ (0, I.jsx)("span", { children: e.value.size ? `${e.value.size} of ${t.length} selected` : `All ${t.length} selected` }), /* @__PURE__ */ (0, I.jsxs)("span", {
+					className: "end",
+					children: [/* @__PURE__ */ (0, I.jsx)("button", {
+						type: "button",
+						className: "rp-btn sm",
+						onClick: () => e.onChange(/* @__PURE__ */ new Set()),
+						children: "Clear"
+					}), /* @__PURE__ */ (0, I.jsx)("button", {
+						type: "button",
+						className: "rp-btn sm framed",
+						onClick: () => c(!0),
+						children: "Done"
+					})]
+				})]
+			})
+		]
+	}), a.closest(".agent-record") ?? document.body);
+}
+function Q(e, t = () => !0, n = (e) => e.tokens === null ? "—" : j(e.tokens)) {
+	return e.tree.filter(t).map((t) => ({
+		id: t.id,
+		label: t.name,
+		find: t.node.label,
+		tone: t.state.tone,
+		meta: n(t),
+		group: e.teams.length && t.team && t.team !== t.id ? t.team : null
+	}));
+}
+var $ = (e) => e.teams.length ? e.teams.map((e) => ({
+	id: e.id,
+	label: e.label
+})) : void 0;
+function ee(e, t, n, r = 6) {
+	let [i, a] = (0, s.useState)({
+		top: 0,
+		height: 800,
+		width: 0
+	});
+	(0, s.useEffect)(() => {
+		let t = e.current;
+		if (!t) return;
+		let n = 0, r = () => {
+			n = 0, a({
+				top: t.scrollTop,
+				height: t.clientHeight || 800,
+				width: t.clientWidth
+			});
+		}, i = () => {
+			n ||= requestAnimationFrame(r);
+		};
+		r(), t.addEventListener("scroll", i, { passive: !0 });
+		let o = new ResizeObserver(i);
+		return o.observe(t), () => {
+			cancelAnimationFrame(n), t.removeEventListener("scroll", i), o.disconnect();
+		};
+	}, [e]);
+	let o = Math.max(0, Math.floor(i.top / n) - r), c = Math.min(t, Math.ceil((i.top + i.height) / n) + r);
+	return {
+		first: o,
+		last: c,
+		before: o * n,
+		after: Math.max(0, (t - c) * n),
+		width: i.width
+	};
+}
+var te = () => l("(max-width: 720px)");
+//#endregion
+export { y as C, T as D, w as E, M as O, D as S, C as T, P as _, R as a, A as b, q as c, H as d, te as f, v as g, F as h, B as i, l as k, $ as l, j as m, K as n, X as o, ee as p, U as r, z as s, J as t, Q as u, x as v, d as w, E as x, S as y };