@tangle-network/charts 0.15.1 → 0.17.0

package/README.md

@@ -4,7 +4,7 @@ Benchmark figures as static SVG and HTML tables, plus optional React timing prim
 
 The React entry also exports `DayBars`, `HBars`, `Histogram`, `Lines`, `Meter`, `Spark`, and `Gantt` for live operational pages. Import `@tangle-network/charts/react/live.css` for their layout and set `--chart-live-*` theme tokens on an ancestor. Data, state colors, destination links, labels, and interpretation remain with the caller. `DayBars` accepts an `onOpen(index)` action with keyboard activation.
 
-`FlowWaterfall` from `@tangle-network/charts/react` is the shared live trace inspector. It owns hierarchy layout, folding, search, playback and running-span growth. Producers own identity, `parentId`, explicit `status` and observed totals. Import `@tangle-network/charts/react/flow-waterfall.css`; its `fw-*` classes and six-field summary support hosts without a Tailwind build. The React-free root exports the `FlowSpan` and `FlowTrace` types.
+`FlowWaterfall` from `@tangle-network/charts/react` is the shared live trace inspector: an agent timeline (one row per agent, elbow handoffs, hatched waiting) and a virtualized span waterfall over one clock. It owns hierarchy layout, folding, search, playback, zoom, span cards and running-span growth. Producers own identity, `parentId`, explicit `status` and observed totals. Import `@tangle-network/charts/react/flow-waterfall.css`; its `fw-*` classes and six-field summary support hosts without a Tailwind build. The React-free root exports the `FlowSpan` and `FlowTrace` types.
 
 `WaterfallHeader`, `WaterfallTimeAxis`, `WaterfallBar` and `WaterfallRow` remain available for existing consumers that own their own hierarchy and selection. All use the same `waterfallSpanGeometry` and `waterfallTicks`. Existing fixed-width cells, tones, formatting, attribution slots and unordered-time `—` marks are preserved. Optional fluid tracks, inner-bar colour/class, overlay and clipping fields support the shared inspector without changing existing calls. The primitives were extracted from Intelligence under [brand #211](https://github.com/tangle-network/brand/pull/211); the shared inspector extends that presentation ownership while leaving failure interpretation with producers.
 
@@ -87,6 +87,8 @@ Identity is carried by direct labels, never by hue.
 
 ## Develop
 
+Local Beelink gate (set `TOUCHED_INTEGRATION_TEST` to the touched integration test file; the gate installs with npm ci from package-lock.json): `beelink-gate auto https://github.com/tangle-network/charts.git "$(git rev-parse HEAD)" -- sh -c 'npm run typecheck && npm exec -- vitest run "$1"' _ "${TOUCHED_INTEGRATION_TEST:?set touched integration test path}"`.
+
 ```sh
 npm ci
 npm run gen:css       # after editing src/figure.css or Brand tokens
@@ -323,16 +325,23 @@ The component tests cover gap/zero/one/equal/negative cases, controlled identity
 
 ```tsx
 import { FlowWaterfall } from '@tangle-network/charts/react';
-import type { FlowTrace } from '@tangle-network/charts';
+import { catalogPrice, otlpFlowTrace, parseOtlpJsonl } from '@tangle-network/charts';
 import '@tangle-network/charts/react/flow-waterfall.css';
 
-// The producer supplies stable identities, explicit status and measured totals.
-<FlowWaterfall trace={trace satisfies FlowTrace} live={running} />;
+// The one input contract: OTLP-JSONL from `traces convert <ref> --out spans.otlp.jsonl`.
+const { spans } = parseOtlpJsonl(text);
+// List prices come from the price owner at runtime (the Router's /v1/models), never a copied table.
+const trace = otlpFlowTrace(spans, { price: catalogPrice(await (await fetch(catalogUrl)).json()) });
+<FlowWaterfall trace={trace} live={running} defaultView="agents" renderIcon={brandMark} />;
 ```
 
-Search supports Cmd/Ctrl+F and keeps ancestor context. Folding, five playback speeds, scrubbing and Follow live affect presentation only. Running spans grow between snapshots. Missing cost and authoritative LLM counts stay Unknown. Invalid intervals retain a per-row `—` timing mark, preserving the rest of the trace. The static phase waterfall remains a separate chart for disjoint phases.
+`defaultView="agents"` opens the agent timeline: one row per agent with its model, thinking and tool marks, hatched waiting while it delegates, elbow connectors to each agent it spawned and back, retry and failure glyphs, and a headline with the measured speedup over sequential (agent busy time over wall time). Expanding an agent opens the span view with that agent unfolded. The span view virtualizes rows (5,000 spans scroll at 58+ fps in headless Chromium), pins ancestors while their children scroll, and labels each bar with its duration and recorded cost. Hover shows a span card; click pins it and zooms the axis to a span too narrow to read. `onSelect(span)` hears each opened row and pinned bar, so a host can open its own drill-down; `markers={[{ at, label, tone }]}` draws labelled instants, such as releases, across the rows. Ctrl/Cmd+wheel or `+`/`-`/`0` zoom, Shift+wheel pans, the scrub track under the controls shows the whole trace, and arrow keys walk the tree.
+
+Live views append spans as they arrive: `traces watch <id|run-dir> --format jsonl --spans` emits a `traces.stream.span` event per new or changed span, and `otlpFlowTrace` keeps the last span per `span_id`. Running agent spans grow to the clock between deltas without React renders (CSS variables carry the clock). Search supports Cmd/Ctrl+F and keeps ancestor context. Missing cost and authoritative LLM counts stay Unknown; a cost priced from a catalog is labelled list price. Invalid intervals retain a per-row `—` timing mark. The static phase waterfall remains a separate chart for disjoint phases.
+
+`scripts/flow-waterfall-demo.mjs` serves the demo routes (reference-shaped fixtures, recorded runs, a synthetic load trace and OTLP files from `FW_DATA_DIR`); `scripts/flow-waterfall-capture.mjs` captures frames, hover cards, fps, first paint and recordings, and with `FW_LIVE_RELAY` records a live session through `scripts/flow-waterfall-live-relay.mjs` with every span's event-to-pixel time.
 
-**Provenance.** FlowWaterfall and its recorded Discovery fixture move from agent-app #1267/#1273 at `78a3e8f7fd9bf93b23afa8290db6d721db544237`; the independent implementation copied no paid reference assets. [Fixture provenance](docs/fixtures/discovery-waterfall-provenance.md) records measured timing, observed token totals and unknowns. The historical [baseline](docs/fixtures/live-playback-rates-baseline.json) and [fixed](docs/fixtures/live-playback-rates-fixed.json) rate measurements are retained. The packed public consumer proof measures all five rates against actual browser wall time during live growth, with ±15% acceptance, using React 18 and 19 at 1100px and 390px.
+**Provenance.** FlowWaterfall and its recorded Discovery fixture move from agent-app #1267/#1273 at `78a3e8f7fd9bf93b23afa8290db6d721db544237`; the independent implementation copied no paid reference assets. [Fixture provenance](docs/fixtures/discovery-waterfall-provenance.md) records measured timing, observed token totals and unknowns. `trace-release.json` and `trace-incident.json` are invented fixtures shaped like the design references (agent counts, durations and states), with original text. The historical [baseline](docs/fixtures/live-playback-rates-baseline.json) and [fixed](docs/fixtures/live-playback-rates-fixed.json) rate measurements are retained. The packed public consumer proof measures all five rates against actual browser wall time during live growth, with ±15% acceptance, using React 18 and 19 at 1100px and 390px.
 
 ```sh
 npm run build

package/dist/{flow-trace-B5dlYNsD.d.ts → flow-trace-Cti_6fZP.d.ts}

@@ -317,8 +317,30 @@ interface FlowSpan {
   startMs: number;
   endMs: number;
   approx?: boolean;
+  /** Muted text after the name: the agent's model or the tool's provider. */
+  detail?: string;
+  /** Host icon key, passed to `renderIcon`; the inspector draws a kind glyph without one. */
+  icon?: string;
+  /** Recorded values only. Absent means unknown and is shown as Unknown, never as zero. */
+  costUsd?: number;
+  promptTokens?: number;
+  completionTokens?: number;
+  /** Short producer summaries shown in the span card. */
+  input?: string;
+  output?: string;
+  /** The failed span this one retries; the bar carries a retry glyph. */
+  retryOf?: string;
+  /** For a handoff, the span that received the work; a connector joins the two rows. */
+  handoffTo?: string;
   meta?: Record<string, unknown>;
 }
+/** A labelled instant on the trace clock, such as a release or an alert; drawn as a line across the rows. */
+interface FlowMarker {
+  /** Trace-relative milliseconds, on the same clock as span startMs. */
+  at: number;
+  label: string;
+  tone?: 'neutral' | 'ok' | 'failed';
+}
 /** Describe the structure of a flow trace including spans, timing, tokens, cost, and tool calls */
 interface FlowTrace {
   spans: FlowSpan[];
@@ -327,10 +349,12 @@ interface FlowTrace {
   completionTokens: number;
   /** Computed when per-token pricing is supplied. */
   costUsd?: number;
+  /** `list`: priced from a model catalog's list prices, not a bill; the summary says so. */
+  costBasis?: 'billed' | 'list';
   toolCalls: number;
   /** Authoritative LLM request count when supplied; absent means unknown. */
   modelCalls?: number;
   errors?: number;
 }
 //#endregion
-export { CostBasis as A, Tier as B, MarkerShape as C, YTick as D, YTarget as E, IntervalMethod as F, isRefusal as H, MatrixCell as I, RateRow as L, Exclusion as M, Figure as N, BreakdownInput as O, Interval as P, Refusal as R, MarkVerdict as S, YScale as T, TierCounts as V, PointGlyph as _, TimelineSpan as a, ChartMark as b, CHECKER_HUES as c, OUTCOME_COLORS as d, OUTCOME_ORDER as f, PointFields as g, checkerColor as h, TimelineOptions as i, Estimate as j, ComparisonRow as k, ENDING_COLORS as l, TickOutcome as m, FlowTrace as n, TimelineTick as o, RunEnding as p, TimelineLane as r, timeline as s, FlowSpan as t, ENDING_ORDER as u, BandKind as v, XCategory as w, MarkKind as x, ChartBand as y, Setup as z };
+export { ComparisonRow as A, Setup as B, MarkVerdict as C, YTarget as D, YScale as E, Interval as F, TierCounts as H, IntervalMethod as I, MatrixCell as L, Estimate as M, Exclusion as N, YTick as O, Figure as P, RateRow as R, MarkKind as S, XCategory as T, isRefusal as U, Tier as V, PointFields as _, TimelineOptions as a, ChartBand as b, timeline as c, ENDING_ORDER as d, OUTCOME_COLORS as f, checkerColor as g, TickOutcome as h, TimelineLane as i, CostBasis as j, BreakdownInput as k, CHECKER_HUES as l, RunEnding as m, FlowSpan as n, TimelineSpan as o, OUTCOME_ORDER as p, FlowTrace as r, TimelineTick as s, FlowMarker as t, ENDING_COLORS as u, PointGlyph as v, MarkerShape as w, ChartMark as x, BandKind as y, Refusal as z };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { A as CostBasis, B as Tier, C as MarkerShape, D as YTick, E as YTarget, F as IntervalMethod, H as isRefusal, I as MatrixCell, L as RateRow, M as Exclusion, N as Figure, O as BreakdownInput, P as Interval, R as Refusal, S as MarkVerdict, T as YScale, V as TierCounts, _ as PointGlyph, a as TimelineSpan, b as ChartMark, c as CHECKER_HUES, d as OUTCOME_COLORS, f as OUTCOME_ORDER, g as PointFields, h as checkerColor, i as TimelineOptions, j as Estimate, k as ComparisonRow, l as ENDING_COLORS, m as TickOutcome, n as FlowTrace, o as TimelineTick, p as RunEnding, r as TimelineLane, s as timeline, t as FlowSpan, u as ENDING_ORDER, v as BandKind, w as XCategory, x as MarkKind, y as ChartBand, z as Setup } from "./flow-trace-B5dlYNsD.js";
+import { A as ComparisonRow, B as Setup, C as MarkVerdict, D as YTarget, E as YScale, F as Interval, H as TierCounts, I as IntervalMethod, L as MatrixCell, M as Estimate, N as Exclusion, O as YTick, P as Figure, R as RateRow, S as MarkKind, T as XCategory, U as isRefusal, V as Tier, _ as PointFields, a as TimelineOptions, b as ChartBand, c as timeline, d as ENDING_ORDER, f as OUTCOME_COLORS, g as checkerColor, h as TickOutcome, i as TimelineLane, j as CostBasis, k as BreakdownInput, l as CHECKER_HUES, m as RunEnding, n as FlowSpan, o as TimelineSpan, p as OUTCOME_ORDER, r as FlowTrace, s as TimelineTick, t as FlowMarker, u as ENDING_COLORS, v as PointGlyph, w as MarkerShape, x as ChartMark, y as BandKind, z as Refusal } from "./flow-trace-Cti_6fZP.js";
 //#region src/block.d.ts
 interface RenderFigureOptions {
   /** Chart uses a closed data disclosure; plot keeps only the SVG and accessible data. */
@@ -344,4 +344,58 @@ interface UnitDotOptions {
  */
 export declare function unitDotLayout(groups: DotGroup[], width: number, height: number, o?: UnitDotOptions): UnitDotLayout;
 //#endregion
-export { type BandKind, type BreakdownInput, type BreakdownOptions, CHECKER_HUES, type ChartBand, type ChartMark, type ComparisonIntervalsOptions, type ComparisonRow, type CostBasis, type CostFrontierOptions, type DotGroup, type DotGroupRect, ENDING_COLORS, ENDING_ORDER, type Estimate, type Exclusion, type Figure, type FlowSpan, type FlowTrace, type HeatmapCell, type HeatmapColumn, type HeatmapOptions, type HeatmapRow, type HeatmapStatus, type Interval, type IntervalMethod, type LatencyRangeOptions, type LatencyRangeRow, type MarkKind, type MarkVerdict, type MatrixCell, type MetricBarsOptions, type MetricRow, type MultiplePanel, OUTCOME_COLORS, OUTCOME_ORDER, type Observations, type PhaseWaterfallOptions, type PointFields, type PointGlyph, type RankedRatesOptions, type RateIdentity, type RateRow, type Refusal, type RenderFigureOptions, type RunEnding, type Setup, type SmallMultiplesOptions, type TaskMatrixOptions, type TickOutcome, type Tier, type TierCounts, type TimePoint, type TimeSeriesOptions, type TimeSeriesRow, type TimelineLane, type TimelineOptions, type TimelineSpan, type TimelineTick, type UnitDotLayout, type UnitDotOptions, type WaterfallPhase, type XCategory, type YScale, type YTarget, type YTick, checkerColor, isRefusal, timeline };
+//#region src/otlp-trace.d.ts
+/** One span of the OTLP-JSONL contract written by `traces convert` (tangle-network/traces). */
+interface OtlpSpan {
+  trace_id: string;
+  span_id: string;
+  parent_span_id?: string;
+  name: string;
+  kind: 'AGENT' | 'LLM' | 'TOOL' | 'CHAIN' | string;
+  start_time: string;
+  end_time: string;
+  status?: {
+    code?: string;
+    message?: string;
+  };
+  attributes?: Record<string, unknown>;
+  resource?: {
+    attributes?: Record<string, unknown>;
+  };
+}
+interface OtlpTraceOptions {
+  /** The stream is still being written: open agent spans run to the observation time. */
+  live?: boolean;
+  /** Attributes that name an agent, in order. Spans that carry one and have no agent ancestor are grouped under it. */
+  agentKeys?: string[];
+  /** List price of one model call; undefined leaves it unknown. Build it from the price owner with `catalogPrice`. */
+  price?: (model: string, inputTokens: number, outputTokens: number) => number | undefined;
+}
+/** Price model calls from an OpenAI-compatible model catalog (`data[].pricing.prompt|completion`, USD per token), such as
+ * the Router's `/v1/models`. Read the catalog at runtime; never copy its numbers. */
+export declare function catalogPrice(catalog: {
+  data?: Array<{
+    id?: string;
+    pricing?: {
+      prompt?: string | number;
+      completion?: string | number;
+    };
+  }>;
+}): (model: string, inputTokens: number, outputTokens: number) => number | undefined;
+/** Parse OTLP-JSONL text; blank and malformed lines are counted, never thrown. */
+export declare function parseOtlpJsonl(text: string): {
+  spans: OtlpSpan[];
+  malformed: number;
+};
+/**
+ * Project OTLP spans onto the inspector's trace. Kinds map AGENT→agent row, LLM→model call, TOOL→tool call; a TOOL
+ * marked `traces.agent.spawn` becomes a handoff to the agent it parents. CHAIN spans become rows only when they have
+ * children; leaf CHAIN markers (prompts, message boundaries) are counted in `omitted`. Tokens are
+ * `gen_ai.usage.input_tokens` + `output_tokens`; the contract carries no cost, so cost stays unknown.
+ * A later span with the same span_id replaces an earlier one, so live deltas can be appended as they arrive.
+ */
+export declare function otlpFlowTrace(input: OtlpSpan[], options?: OtlpTraceOptions): FlowTrace & {
+  omitted: number;
+};
+//#endregion
+export { type BandKind, type BreakdownInput, type BreakdownOptions, CHECKER_HUES, type ChartBand, type ChartMark, type ComparisonIntervalsOptions, type ComparisonRow, type CostBasis, type CostFrontierOptions, type DotGroup, type DotGroupRect, ENDING_COLORS, ENDING_ORDER, type Estimate, type Exclusion, type Figure, type FlowMarker, type FlowSpan, type FlowTrace, type HeatmapCell, type HeatmapColumn, type HeatmapOptions, type HeatmapRow, type HeatmapStatus, type Interval, type IntervalMethod, type LatencyRangeOptions, type LatencyRangeRow, type MarkKind, type MarkVerdict, type MatrixCell, type MetricBarsOptions, type MetricRow, type MultiplePanel, OUTCOME_COLORS, OUTCOME_ORDER, type Observations, type OtlpSpan, type OtlpTraceOptions, type PhaseWaterfallOptions, type PointFields, type PointGlyph, type RankedRatesOptions, type RateIdentity, type RateRow, type Refusal, type RenderFigureOptions, type RunEnding, type Setup, type SmallMultiplesOptions, type TaskMatrixOptions, type TickOutcome, type Tier, type TierCounts, type TimePoint, type TimeSeriesOptions, type TimeSeriesRow, type TimelineLane, type TimelineOptions, type TimelineSpan, type TimelineTick, type UnitDotLayout, type UnitDotOptions, type WaterfallPhase, type XCategory, type YScale, type YTarget, type YTick, checkerColor, isRefusal, timeline };

package/dist/index.js

@@ -3336,4 +3336,237 @@ function unitDotLayout(groups, width, height, o = {}) {
 	};
 }
 //#endregion
-export { CHECKER_HUES, ENDING_COLORS, ENDING_ORDER, OUTCOME_COLORS, OUTCOME_ORDER, breakdown, chartTokensCss, checkerColor, comparisonIntervals, costFrontier, figureCss, heatmap, isRefusal, latencyRange, metricBars, phaseWaterfall, rankedRates, rateOrder, renderFigure, renderNotes, renderRefusals, smallMultiples, taskMatrix, timeSeries, timeline, unitDotLayout };
+//#region src/otlp-trace.ts
+/** Price model calls from an OpenAI-compatible model catalog (`data[].pricing.prompt|completion`, USD per token), such as
+* the Router's `/v1/models`. Read the catalog at runtime; never copy its numbers. */
+function catalogPrice(catalog) {
+	const rates = /* @__PURE__ */ new Map();
+	for (const model of catalog.data ?? []) {
+		const input = Number(model.pricing?.prompt), output = Number(model.pricing?.completion);
+		if (model.id && Number.isFinite(input) && Number.isFinite(output)) rates.set(model.id, {
+			input,
+			output
+		});
+	}
+	return (model, inputTokens, outputTokens) => {
+		const rate = rates.get(model) ?? rates.get(shortModel(model));
+		return rate ? rate.input * inputTokens + rate.output * outputTokens : void 0;
+	};
+}
+/** The OpenTelemetry GenAI name first, then the agent identities current producers write. */
+const AGENT_KEYS = [
+	"gen_ai.agent.name",
+	"agent.name",
+	"cli_bridge.profile.name"
+];
+const MODEL_KEYS = [
+	"gen_ai.response.model",
+	"gen_ai.request.model",
+	"llm.model_name"
+];
+/** Parse OTLP-JSONL text; blank and malformed lines are counted, never thrown. */
+function parseOtlpJsonl(text) {
+	const spans = [];
+	let malformed = 0;
+	for (const line of text.split("\n")) {
+		if (!line.trim()) continue;
+		try {
+			const span = JSON.parse(line);
+			if (typeof span.span_id === "string" && typeof span.start_time === "string") spans.push(span);
+			else malformed++;
+		} catch {
+			malformed++;
+		}
+	}
+	return {
+		spans,
+		malformed
+	};
+}
+const str = (value) => typeof value === "string" && value ? value : void 0;
+const num = (value) => typeof value === "number" && Number.isFinite(value) ? value : void 0;
+const pick = (attributes, keys) => {
+	for (const key of keys) {
+		const value = str(attributes[key]);
+		if (value) return value;
+	}
+};
+/** `opencode/zai-coding-plan/glm-5.3` reads as `glm-5.3`; the full id stays in the span card input. */
+const shortModel = (model) => model.split("/").pop() ?? model;
+/**
+* Project OTLP spans onto the inspector's trace. Kinds map AGENT→agent row, LLM→model call, TOOL→tool call; a TOOL
+* marked `traces.agent.spawn` becomes a handoff to the agent it parents. CHAIN spans become rows only when they have
+* children; leaf CHAIN markers (prompts, message boundaries) are counted in `omitted`. Tokens are
+* `gen_ai.usage.input_tokens` + `output_tokens`; the contract carries no cost, so cost stays unknown.
+* A later span with the same span_id replaces an earlier one, so live deltas can be appended as they arrive.
+*/
+function otlpFlowTrace(input, options = {}) {
+	const agentKeys = options.agentKeys ?? AGENT_KEYS;
+	const byId = /* @__PURE__ */ new Map();
+	for (const span of input) byId.set(span.span_id, span);
+	const spans = [...byId.values()];
+	const time = (iso) => Date.parse(iso);
+	const origin = spans.reduce((min, span) => Math.min(min, time(span.start_time)), Infinity);
+	const last = spans.reduce((max, span) => Math.max(max, time(span.end_time), time(span.start_time)), -Infinity);
+	const parents = new Set(spans.flatMap((span) => span.parent_span_id ? [span.parent_span_id] : []));
+	const attrs = (span) => span.attributes ?? {};
+	const isAgent = (span) => span.kind === "AGENT";
+	const agentAncestor = (span) => {
+		const seen = /* @__PURE__ */ new Set();
+		for (let cursor = span.parent_span_id ? byId.get(span.parent_span_id) : void 0; cursor && !seen.has(cursor.span_id); cursor = cursor.parent_span_id ? byId.get(cursor.parent_span_id) : void 0) {
+			seen.add(cursor.span_id);
+			if (isAgent(cursor)) return cursor;
+		}
+	};
+	const grouped = /* @__PURE__ */ new Map();
+	const groupOf = /* @__PURE__ */ new Map();
+	for (const span of spans) {
+		if (isAgent(span) || span.parent_span_id && byId.has(span.parent_span_id)) continue;
+		const name = pick(attrs(span), agentKeys);
+		if (!name) continue;
+		groupOf.set(span.span_id, name);
+		const group = grouped.get(name) ?? {
+			start: Infinity,
+			end: -Infinity,
+			models: /* @__PURE__ */ new Map(),
+			lastEnd: -Infinity,
+			failed: false
+		};
+		group.start = Math.min(group.start, time(span.start_time));
+		group.end = Math.max(group.end, time(span.end_time));
+		if (time(span.end_time) >= group.lastEnd) {
+			group.lastEnd = time(span.end_time);
+			group.failed = span.status?.code === "STATUS_CODE_ERROR";
+		}
+		grouped.set(name, group);
+	}
+	const models = /* @__PURE__ */ new Map();
+	const tally = (key, model) => {
+		const counts = models.get(key) ?? /* @__PURE__ */ new Map();
+		counts.set(model, (counts.get(model) ?? 0) + 1);
+		models.set(key, counts);
+	};
+	const rootOf = (span) => {
+		let cursor = span;
+		const seen = /* @__PURE__ */ new Set();
+		while (cursor.parent_span_id && byId.has(cursor.parent_span_id) && !seen.has(cursor.span_id)) {
+			seen.add(cursor.span_id);
+			cursor = byId.get(cursor.parent_span_id);
+		}
+		return cursor;
+	};
+	for (const span of spans) {
+		if (span.kind !== "LLM") continue;
+		const model = pick(attrs(span), MODEL_KEYS);
+		if (!model) continue;
+		const agent = agentAncestor(span);
+		const group = agent ? void 0 : groupOf.get(rootOf(span).span_id);
+		if (agent) tally(agent.span_id, shortModel(model));
+		else if (group) tally(`group:${group}`, shortModel(model));
+	}
+	const topModel = (key) => [...models.get(key)?.entries() ?? []].sort((a, b) => b[1] - a[1])[0]?.[0];
+	const out = [];
+	let omitted = 0;
+	let promptTokens = 0;
+	let completionTokens = 0;
+	let toolCalls = 0;
+	let modelCalls = 0;
+	let errors = 0;
+	let cost = 0;
+	let unpriced = 0;
+	const offset = (iso) => time(iso) - origin;
+	const isSpawn = (span) => span.kind === "TOOL" && (attrs(span)["traces.agent.spawn"] === true || /spawn/i.test(str(attrs(span)["gen_ai.tool.name"]) ?? span.name));
+	const groupOfSpan = (span) => groupOf.get(rootOf(span).span_id);
+	const spawns = spans.filter((span) => isSpawn(span) && groupOfSpan(span)).sort((a, b) => time(a.start_time) - time(b.start_time));
+	const claimed = /* @__PURE__ */ new Set();
+	const spawnedBy = /* @__PURE__ */ new Map();
+	for (const [name, group] of [...grouped].sort((a, b) => a[1].start - b[1].start)) {
+		let pick;
+		for (const spawn of spawns) {
+			if (time(spawn.start_time) > group.start) break;
+			if (!claimed.has(spawn.span_id) && groupOfSpan(spawn) !== name) pick = spawn;
+		}
+		if (pick) {
+			claimed.add(pick.span_id);
+			spawnedBy.set(name, pick);
+		}
+	}
+	const handoffTo = new Map([...spawnedBy].map(([name, spawn]) => [spawn.span_id, `group:${name}`]));
+	for (const [name, group] of grouped) {
+		const spawn = spawnedBy.get(name);
+		out.push({
+			id: `group:${name}`,
+			kind: "pipeline",
+			name,
+			detail: topModel(`group:${name}`),
+			startMs: group.start - origin,
+			endMs: group.end - origin,
+			...spawn ? { parentId: `group:${groupOfSpan(spawn)}` } : {},
+			status: options.live ? "running" : group.failed ? "failed" : "done"
+		});
+	}
+	const subagentNumber = new Map(spans.filter((span) => isAgent(span) && span.parent_span_id && byId.has(span.parent_span_id) && !pick(attrs(span), agentKeys)).sort((a, b) => time(a.start_time) - time(b.start_time)).map((span, i) => [span.span_id, i + 1]));
+	const spawnTarget = /* @__PURE__ */ new Map();
+	for (const span of spans) if (isAgent(span) && span.parent_span_id) spawnTarget.set(span.parent_span_id, span.span_id);
+	for (const span of spans) {
+		const a = attrs(span);
+		if (span.kind === "CHAIN" && !parents.has(span.span_id)) {
+			omitted++;
+			continue;
+		}
+		const failed = span.status?.code === "STATUS_CODE_ERROR";
+		const startMs = offset(span.start_time);
+		let endMs = Math.max(startMs, offset(span.end_time));
+		const open = options.live === true && isAgent(span) && span.status?.code !== "STATUS_CODE_OK" && !failed;
+		if (open) endMs = Math.max(endMs, last - origin);
+		const parentId = span.parent_span_id && byId.has(span.parent_span_id) ? span.parent_span_id : groupOf.has(span.span_id) ? `group:${groupOf.get(span.span_id)}` : void 0;
+		const model = pick(a, MODEL_KEYS);
+		const prompt = num(a["gen_ai.usage.input_tokens"]);
+		const completion = num(a["gen_ai.usage.output_tokens"]);
+		let kind = span.kind === "LLM" ? "model" : span.kind === "TOOL" ? "tool" : "pipeline";
+		if (kind === "tool" && (a["traces.agent.spawn"] === true || spawnTarget.has(span.span_id) || handoffTo.has(span.span_id))) kind = "handoff";
+		let name = str(a["gen_ai.tool.name"]) ?? span.name;
+		if (isAgent(span)) name = pick(a, agentKeys) ?? (subagentNumber.has(span.span_id) ? `Subagent ${subagentNumber.get(span.span_id)}` : str(a["service.name"]) ?? str(span.resource?.attributes?.["service.name"]) ?? span.name);
+		else if (kind === "model" && (span.name === "llm.call" || span.name.startsWith("chat "))) name = "Model call";
+		if (kind === "model") modelCalls++;
+		if (kind === "tool" || kind === "handoff") toolCalls++;
+		if (failed) errors++;
+		promptTokens += prompt ?? 0;
+		completionTokens += completion ?? 0;
+		const listPrice = kind === "model" && model && options.price && (prompt !== void 0 || completion !== void 0) ? options.price(model, prompt ?? 0, completion ?? 0) : void 0;
+		if (listPrice !== void 0) cost += listPrice;
+		else if (kind === "model" && (prompt || completion)) unpriced++;
+		out.push({
+			id: span.span_id,
+			...parentId ? { parentId } : {},
+			kind,
+			name,
+			startMs,
+			endMs,
+			status: open ? "running" : failed ? "failed" : "done",
+			...endMs === startMs && kind !== "pipeline" ? { approx: true } : {},
+			...isAgent(span) ? { detail: topModel(span.span_id) } : kind === "model" && model ? { detail: shortModel(model) } : {},
+			...listPrice !== void 0 ? { costUsd: listPrice } : {},
+			...prompt !== void 0 ? { promptTokens: prompt } : {},
+			...completion !== void 0 ? { completionTokens: completion } : {},
+			...span.status?.message ? { output: span.status.message } : {},
+			...spawnTarget.has(span.span_id) ? { handoffTo: spawnTarget.get(span.span_id) } : handoffTo.has(span.span_id) ? { handoffTo: handoffTo.get(span.span_id) } : {}
+		});
+	}
+	return {
+		spans: out,
+		totalMs: Number.isFinite(last - origin) ? last - origin : 0,
+		promptTokens,
+		completionTokens,
+		toolCalls,
+		modelCalls,
+		errors,
+		omitted,
+		...options.price && unpriced === 0 && cost > 0 ? {
+			costUsd: cost,
+			costBasis: "list"
+		} : {}
+	};
+}
+//#endregion
+export { CHECKER_HUES, ENDING_COLORS, ENDING_ORDER, OUTCOME_COLORS, OUTCOME_ORDER, breakdown, catalogPrice, chartTokensCss, checkerColor, comparisonIntervals, costFrontier, figureCss, heatmap, isRefusal, latencyRange, metricBars, otlpFlowTrace, parseOtlpJsonl, phaseWaterfall, rankedRates, rateOrder, renderFigure, renderNotes, renderRefusals, smallMultiples, taskMatrix, timeSeries, timeline, unitDotLayout };