@flanksource/clicky-ui 0.3.55 → 0.3.57

package/dist/data/timeseries-stream.js

@@ -0,0 +1,296 @@
+import { createContext, useContext } from "react";
+// src/data/timeseries-stream.ts
+var DEFAULT_DEBOUNCE_MS = 50;
+var CLOSED = 2;
+var DEFAULT_WINDOW_MS = 36e5;
+/** The state of a group nothing has been received for. */
+var EMPTY_TIMESERIES_STREAM_GROUP = Object.freeze({
+	bySource: /* @__PURE__ */ new Map(),
+	answered: /* @__PURE__ */ new Set(),
+	error: null
+});
+function timeseriesStreamGroupKey({ baseUrl, range, interval }) {
+	return JSON.stringify([
+		baseUrl,
+		range,
+		interval
+	]);
+}
+/**
+* The stream tick for a widget's `refreshMs`: whole seconds, rounded up, at
+* least 1s (the server minimum). `null` for `refreshMs <= 0`, which asks for
+* no live updates, so such widgets fetch once instead of streaming.
+*/
+function timeseriesStreamInterval(refreshMs) {
+	if (!(refreshMs > 0)) return null;
+	return `${Math.max(1, Math.ceil(refreshMs / 1e3))}s`;
+}
+/**
+* Where a widget's series streams from. With a `baseUrl` the series streams
+* as `id` from `{baseUrl}stream`. Without one (the single-`url` panel form),
+* the url is split at its last path `/`: `"/api/v1/metrics/sqlserver.cpu"`
+* streams as `sqlserver.cpu` from `/api/v1/metrics/stream`, the same single
+* segment the server's `GET {prefix}/metrics/{id}` route reads. A url with no
+* such prefix has no stream endpoint, so it is null and keeps fetching.
+*/
+function timeseriesStreamAddress(baseUrl, id) {
+	if (baseUrl !== "") return {
+		baseUrl,
+		id
+	};
+	const query = id.indexOf("?");
+	const slash = id.lastIndexOf("/", query === -1 ? id.length : query);
+	if (slash === -1 || slash === id.length - 1 || slash === query - 1) return null;
+	return {
+		baseUrl: id.slice(0, slash + 1),
+		id: id.slice(slash + 1)
+	};
+}
+function timeseriesStreamUrl(group, ids) {
+	const params = new URLSearchParams();
+	for (const id of ids) params.append("id", id);
+	if (group.range) params.set("since", group.range);
+	params.set("interval", group.interval);
+	return `${group.baseUrl}stream?${params.toString()}`;
+}
+var GO_DURATION_UNITS_MS = {
+	ns: 1e-6,
+	us: .001,
+	"µs": .001,
+	ms: 1,
+	s: 1e3,
+	m: 6e4,
+	h: 36e5
+};
+var GO_DURATION = /^[+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:ns|us|µs|ms|s|m|h)(?:(?:\d+(?:\.\d*)?|\.\d+)(?:ns|us|µs|ms|s|m|h))*$/;
+var GO_DURATION_PART = /(\d+(?:\.\d*)?|\.\d+)(ns|us|µs|ms|s|m|h)/g;
+/**
+* The oldest timestamp (epoch ms) the window `range` keeps at `nowMs`, read the
+* way the server reads `since`: an RFC3339 time, or a Go duration before now.
+*/
+function timeseriesWindowStart(range, nowMs) {
+	if (range === "") return nowMs - DEFAULT_WINDOW_MS;
+	if (range === "0") return nowMs;
+	if (GO_DURATION.test(range)) {
+		let ms = 0;
+		for (const [, amount, unit] of range.matchAll(GO_DURATION_PART)) ms += Number(amount) * GO_DURATION_UNITS_MS[unit];
+		return nowMs - ms;
+	}
+	const at = Date.parse(range);
+	if (Number.isNaN(at)) throw new Error(`metrics range ${JSON.stringify(range)} is neither a Go duration nor an RFC3339 time`);
+	return at;
+}
+function pointTime(point) {
+	const at = Date.parse(point.at);
+	if (Number.isNaN(at)) throw new Error(`metrics point has an invalid timestamp ${JSON.stringify(point.at)}`);
+	return at;
+}
+function trimPoints(points, startMs) {
+	return points.filter((p) => pointTime(p) >= startMs);
+}
+/** `existing` with `fresh` merged in by timestamp (fresh wins), sorted oldest first. */
+function mergePoints(existing, fresh) {
+	const byTime = /* @__PURE__ */ new Map();
+	for (const p of existing) byTime.set(pointTime(p), p);
+	for (const p of fresh) byTime.set(pointTime(p), p);
+	return [...byTime.entries()].sort(([a], [b]) => a - b).map(([, p]) => p);
+}
+function parseFrame(name, data) {
+	const frame = JSON.parse(String(data));
+	if (!frame || !Array.isArray(frame.series)) throw new Error(`metrics stream ${name} frame has no series array`);
+	return frame;
+}
+function buildState(group) {
+	const bySource = /* @__PURE__ */ new Map();
+	for (const s of group.series.values()) {
+		const list = bySource.get(s.source) ?? [];
+		list.push(s);
+		bySource.set(s.source, list);
+	}
+	return {
+		bySource,
+		answered: new Set(group.answered),
+		error: group.error
+	};
+}
+/** Creates the store behind {@link TimeseriesStreamProvider}; see the module comment. */
+function createTimeseriesStream(options) {
+	const { factory, debounceMs = DEFAULT_DEBOUNCE_MS, now = Date.now } = options;
+	const groups = /* @__PURE__ */ new Map();
+	const dirty = /* @__PURE__ */ new Set();
+	const listeners = /* @__PURE__ */ new Set();
+	let flushTimer = null;
+	let snapshot = /* @__PURE__ */ new Map();
+	function notify(next) {
+		snapshot = next;
+		for (const listener of Array.from(listeners)) listener();
+	}
+	function publish(group) {
+		notify(new Map(snapshot).set(group.key, buildState(group)));
+	}
+	function forget(key) {
+		const next = new Map(snapshot);
+		next.delete(key);
+		notify(next);
+	}
+	function fail(group, error) {
+		group.error = error;
+		publish(group);
+	}
+	function applySnapshot(group, ids, frame) {
+		const start = timeseriesWindowStart(group.range, now());
+		group.series = new Map(frame.series.map((s) => [s.id, {
+			...s,
+			points: trimPoints(s.points, start)
+		}]));
+		group.answered = new Set(ids);
+		group.error = null;
+	}
+	function applyAppend(group, frame) {
+		const start = timeseriesWindowStart(group.range, now());
+		const next = /* @__PURE__ */ new Map();
+		for (const [id, s] of group.series) next.set(id, {
+			...s,
+			points: trimPoints(s.points, start)
+		});
+		for (const s of frame.series) {
+			const held = next.get(s.id);
+			const points = held ? mergePoints(held.points, s.points) : s.points;
+			next.set(s.id, {
+				...s,
+				points: trimPoints(points, start)
+			});
+		}
+		for (const id of frame.removed ?? []) next.delete(id);
+		group.series = next;
+	}
+	function open(group, ids) {
+		const url = timeseriesStreamUrl(group, ids);
+		const source = factory(url);
+		const current = () => group.source === source;
+		const onFrame = (name) => (event) => {
+			if (!current()) return;
+			try {
+				const frame = parseFrame(name, event.data);
+				if (name === "snapshot") applySnapshot(group, ids, frame);
+				else applyAppend(group, frame);
+				publish(group);
+			} catch (err) {
+				fail(group, err instanceof Error ? err : new Error(String(err)));
+			}
+		};
+		source.addEventListener("snapshot", onFrame("snapshot"));
+		source.addEventListener("append", onFrame("append"));
+		source.addEventListener("error", (event) => {
+			if (!current()) return;
+			if (event instanceof ErrorEvent) {
+				fail(group, new Error(event.message));
+				return;
+			}
+			const data = event.data;
+			if (typeof data === "string" && data !== "") {
+				let message;
+				try {
+					message = String(JSON.parse(data).error ?? data);
+				} catch {
+					message = data;
+				}
+				fail(group, new Error(message));
+				return;
+			}
+			if (source.readyState === CLOSED) fail(group, /* @__PURE__ */ new Error(`metrics stream closed: ${url}`));
+		});
+		group.source?.close();
+		group.source = source;
+		group.ids = ids;
+	}
+	function reconcile(key) {
+		const group = groups.get(key);
+		if (!group) return;
+		const ids = [...group.refs.keys()].sort();
+		if (ids.length === 0) {
+			group.source?.close();
+			groups.delete(key);
+			forget(key);
+			return;
+		}
+		if (ids.length === group.ids.length && ids.every((id, i) => id === group.ids[i])) return;
+		const kept = new Set(ids);
+		for (const [id, s] of group.series) if (!kept.has(s.source)) group.series.delete(id);
+		group.answered = new Set([...group.answered].filter((id) => kept.has(id)));
+		group.error = null;
+		open(group, ids);
+		publish(group);
+	}
+	function flush() {
+		flushTimer = null;
+		const keys = [...dirty];
+		dirty.clear();
+		for (const key of keys) reconcile(key);
+	}
+	function markDirty(key) {
+		dirty.add(key);
+		if (flushTimer) clearTimeout(flushTimer);
+		flushTimer = setTimeout(flush, debounceMs);
+	}
+	return {
+		register(registration) {
+			const { id, ...groupFields } = registration;
+			if (id === "") throw new Error("timeseries stream registration needs a metric id");
+			const key = timeseriesStreamGroupKey(groupFields);
+			let group = groups.get(key);
+			if (!group) {
+				group = {
+					...groupFields,
+					key,
+					refs: /* @__PURE__ */ new Map(),
+					ids: [],
+					source: null,
+					series: /* @__PURE__ */ new Map(),
+					answered: /* @__PURE__ */ new Set(),
+					error: null
+				};
+				groups.set(key, group);
+			}
+			const owner = group;
+			owner.refs.set(id, (owner.refs.get(id) ?? 0) + 1);
+			markDirty(key);
+			let registered = true;
+			return () => {
+				if (!registered) return;
+				registered = false;
+				if (groups.get(key) !== owner) return;
+				const count = (owner.refs.get(id) ?? 0) - 1;
+				if (count > 0) owner.refs.set(id, count);
+				else owner.refs.delete(id);
+				markDirty(key);
+			};
+		},
+		subscribe(listener) {
+			listeners.add(listener);
+			return () => listeners.delete(listener);
+		},
+		getSnapshot() {
+			return snapshot;
+		},
+		getGroup(key) {
+			return snapshot.get(key) ?? EMPTY_TIMESERIES_STREAM_GROUP;
+		},
+		close() {
+			if (flushTimer) clearTimeout(flushTimer);
+			flushTimer = null;
+			dirty.clear();
+			for (const group of groups.values()) group.source?.close();
+			groups.clear();
+			if (snapshot.size > 0) notify(/* @__PURE__ */ new Map());
+		}
+	};
+}
+var TimeseriesStreamContext = createContext(null);
+/** The provided {@link TimeseriesStream}, or null outside a `TimeseriesStreamProvider`. */
+function useTimeseriesStream() {
+	return useContext(TimeseriesStreamContext);
+}
+export { EMPTY_TIMESERIES_STREAM_GROUP, TimeseriesStreamContext, createTimeseriesStream, timeseriesStreamAddress, timeseriesStreamGroupKey, timeseriesStreamInterval, timeseriesStreamUrl, timeseriesWindowStart, useTimeseriesStream };
+
+//# sourceMappingURL=timeseries-stream.js.map

package/dist/data/timeseries-stream.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"timeseries-stream.js","names":[],"sources":["../../src/data/timeseries-stream.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { EventSourceFactory, EventSourceLike } from \"../hooks/event-source\";\nimport type { TimeseriesPoint, TimeseriesServerSeries } from \"./TimeseriesPanel.model\";\n\n// One subscription per (baseUrl, range, interval) group serves every widget on\n// a page: widgets register the ids they show, registrations are coalesced over\n// a short debounce, and each group holds a single\n// `{baseUrl}stream?id=…&since=<range>&interval=<n>s` stream (clicky\n// metrics.RegisterStreamRoutes). Opened through the EventSourceFactory, so\n// under createEventHub every group rides the tab's one hub connection.\n\n/** The payload of a stream's `snapshot` and `append` events. */\nexport interface TimeseriesStreamFrame {\n  series: TimeseriesServerSeries[];\n  /** Series ids (not sources) that no longer exist. */\n  removed?: string[];\n}\n\n/** The identity of a stream group: every widget with the same three shares one subscription. */\nexport interface TimeseriesStreamGroup {\n  /** Prefix the stream path is appended to, e.g. \"/api/v1/metrics/\". */\n  baseUrl: string;\n  /** The look-back window, sent as `since` (a Go duration or RFC3339 time). */\n  range: string;\n  /** The server tick, e.g. \"5s\" (see {@link timeseriesStreamInterval}). */\n  interval: string;\n}\n\nexport interface TimeseriesStreamRegistration extends TimeseriesStreamGroup {\n  id: string;\n}\n\n/** What a group's widgets read, replaced (never mutated) on every change. */\nexport interface TimeseriesStreamGroupState {\n  /** Every series held, grouped by the requested id (`source`) it answers. */\n  bySource: ReadonlyMap<string, readonly TimeseriesServerSeries[]>;\n  /** Requested ids a snapshot has answered; an id outside it is still loading. */\n  answered: ReadonlySet<string>;\n  /** The stream's error event, or its failure to open; cleared by the next snapshot. */\n  error: Error | null;\n}\n\nexport interface TimeseriesStream {\n  /** Adds one widget's interest in an id; the returned function removes it. */\n  register(registration: TimeseriesStreamRegistration): () => void;\n  /** useSyncExternalStore subscription: called after any group's state changes. */\n  subscribe(listener: () => void): () => void;\n  /** Every group's state by {@link timeseriesStreamGroupKey}; a new map after any change. */\n  getSnapshot(): ReadonlyMap<string, TimeseriesStreamGroupState>;\n  /** The state of one group (empty when nothing is registered in it). */\n  getGroup(key: string): TimeseriesStreamGroupState;\n  /** Closes every subscription and forgets every registration; later registrations start afresh. */\n  close(): void;\n}\n\nexport interface TimeseriesStreamOptions {\n  factory: EventSourceFactory;\n  /** How long registrations coalesce before groups re-subscribe. Defaults to 50ms. */\n  debounceMs?: number;\n  /** Clock used to trim points older than the range window. Defaults to Date.now. */\n  now?: () => number;\n}\n\nconst DEFAULT_DEBOUNCE_MS = 50;\nconst CLOSED = 2;\n// The server's window when `since` is empty (clicky metrics defaultWindow).\nconst DEFAULT_WINDOW_MS = 60 * 60 * 1000;\n\n/** The state of a group nothing has been received for. */\nexport const EMPTY_TIMESERIES_STREAM_GROUP: TimeseriesStreamGroupState = Object.freeze({\n  bySource: new Map(),\n  answered: new Set<string>(),\n  error: null,\n});\n\nexport function timeseriesStreamGroupKey({ baseUrl, range, interval }: TimeseriesStreamGroup): string {\n  return JSON.stringify([baseUrl, range, interval]);\n}\n\n/**\n * The stream tick for a widget's `refreshMs`: whole seconds, rounded up, at\n * least 1s (the server minimum). `null` for `refreshMs <= 0`, which asks for\n * no live updates, so such widgets fetch once instead of streaming.\n */\nexport function timeseriesStreamInterval(refreshMs: number): string | null {\n  if (!(refreshMs > 0)) return null;\n  return `${Math.max(1, Math.ceil(refreshMs / 1000))}s`;\n}\n\n/**\n * Where a widget's series streams from. With a `baseUrl` the series streams\n * as `id` from `{baseUrl}stream`. Without one (the single-`url` panel form),\n * the url is split at its last path `/`: `\"/api/v1/metrics/sqlserver.cpu\"`\n * streams as `sqlserver.cpu` from `/api/v1/metrics/stream`, the same single\n * segment the server's `GET {prefix}/metrics/{id}` route reads. A url with no\n * such prefix has no stream endpoint, so it is null and keeps fetching.\n */\nexport function timeseriesStreamAddress(baseUrl: string, id: string): { baseUrl: string; id: string } | null {\n  if (baseUrl !== \"\") return { baseUrl, id };\n  const query = id.indexOf(\"?\");\n  const slash = id.lastIndexOf(\"/\", query === -1 ? id.length : query);\n  if (slash === -1 || slash === id.length - 1 || slash === query - 1) return null;\n  return { baseUrl: id.slice(0, slash + 1), id: id.slice(slash + 1) };\n}\n\nexport function timeseriesStreamUrl(group: TimeseriesStreamGroup, ids: readonly string[]): string {\n  const params = new URLSearchParams();\n  for (const id of ids) params.append(\"id\", id);\n  if (group.range) params.set(\"since\", group.range);\n  params.set(\"interval\", group.interval);\n  return `${group.baseUrl}stream?${params.toString()}`;\n}\n\nconst GO_DURATION_UNITS_MS: Record<string, number> = {\n  ns: 1e-6,\n  us: 1e-3,\n  \"µs\": 1e-3,\n  ms: 1,\n  s: 1000,\n  m: 60_000,\n  h: 3_600_000,\n};\nconst GO_DURATION = /^[+-]?(?:\\d+(?:\\.\\d*)?|\\.\\d+)(?:ns|us|µs|ms|s|m|h)(?:(?:\\d+(?:\\.\\d*)?|\\.\\d+)(?:ns|us|µs|ms|s|m|h))*$/;\nconst GO_DURATION_PART = /(\\d+(?:\\.\\d*)?|\\.\\d+)(ns|us|µs|ms|s|m|h)/g;\n\n/**\n * The oldest timestamp (epoch ms) the window `range` keeps at `nowMs`, read the\n * way the server reads `since`: an RFC3339 time, or a Go duration before now.\n */\nexport function timeseriesWindowStart(range: string, nowMs: number): number {\n  if (range === \"\") return nowMs - DEFAULT_WINDOW_MS;\n  if (range === \"0\") return nowMs;\n  if (GO_DURATION.test(range)) {\n    let ms = 0;\n    for (const [, amount, unit] of range.matchAll(GO_DURATION_PART)) {\n      ms += Number(amount) * (GO_DURATION_UNITS_MS[unit as string] as number);\n    }\n    return nowMs - ms;\n  }\n  const at = Date.parse(range);\n  if (Number.isNaN(at)) {\n    throw new Error(`metrics range ${JSON.stringify(range)} is neither a Go duration nor an RFC3339 time`);\n  }\n  return at;\n}\n\nfunction pointTime(point: TimeseriesPoint): number {\n  const at = Date.parse(point.at);\n  if (Number.isNaN(at)) throw new Error(`metrics point has an invalid timestamp ${JSON.stringify(point.at)}`);\n  return at;\n}\n\nfunction trimPoints(points: readonly TimeseriesPoint[], startMs: number): TimeseriesPoint[] {\n  return points.filter((p) => pointTime(p) >= startMs);\n}\n\n/** `existing` with `fresh` merged in by timestamp (fresh wins), sorted oldest first. */\nfunction mergePoints(existing: readonly TimeseriesPoint[], fresh: readonly TimeseriesPoint[]): TimeseriesPoint[] {\n  const byTime = new Map<number, TimeseriesPoint>();\n  for (const p of existing) byTime.set(pointTime(p), p);\n  for (const p of fresh) byTime.set(pointTime(p), p);\n  return [...byTime.entries()].sort(([a], [b]) => a - b).map(([, p]) => p);\n}\n\nfunction parseFrame(name: string, data: unknown): TimeseriesStreamFrame {\n  const frame = JSON.parse(String(data)) as TimeseriesStreamFrame;\n  if (!frame || !Array.isArray(frame.series)) {\n    throw new Error(`metrics stream ${name} frame has no series array`);\n  }\n  return frame;\n}\n\ninterface GroupRecord extends TimeseriesStreamGroup {\n  key: string;\n  refs: Map<string, number>;\n  ids: string[];\n  source: EventSourceLike | null;\n  /** Held series keyed by series id, in server order. */\n  series: Map<string, TimeseriesServerSeries>;\n  answered: Set<string>;\n  error: Error | null;\n}\n\nfunction buildState(group: GroupRecord): TimeseriesStreamGroupState {\n  const bySource = new Map<string, TimeseriesServerSeries[]>();\n  for (const s of group.series.values()) {\n    const list = bySource.get(s.source) ?? [];\n    list.push(s);\n    bySource.set(s.source, list);\n  }\n  return { bySource, answered: new Set(group.answered), error: group.error };\n}\n\n/** Creates the store behind {@link TimeseriesStreamProvider}; see the module comment. */\nexport function createTimeseriesStream(options: TimeseriesStreamOptions): TimeseriesStream {\n  const { factory, debounceMs = DEFAULT_DEBOUNCE_MS, now = Date.now } = options;\n  const groups = new Map<string, GroupRecord>();\n  const dirty = new Set<string>();\n  const listeners = new Set<() => void>();\n  let flushTimer: ReturnType<typeof setTimeout> | null = null;\n  let snapshot: ReadonlyMap<string, TimeseriesStreamGroupState> = new Map();\n\n  function notify(next: Map<string, TimeseriesStreamGroupState>): void {\n    snapshot = next;\n    for (const listener of Array.from(listeners)) listener();\n  }\n\n  function publish(group: GroupRecord): void {\n    notify(new Map(snapshot).set(group.key, buildState(group)));\n  }\n\n  function forget(key: string): void {\n    const next = new Map(snapshot);\n    next.delete(key);\n    notify(next);\n  }\n\n  function fail(group: GroupRecord, error: Error): void {\n    group.error = error;\n    publish(group);\n  }\n\n  function applySnapshot(group: GroupRecord, ids: readonly string[], frame: TimeseriesStreamFrame): void {\n    const start = timeseriesWindowStart(group.range, now());\n    group.series = new Map(frame.series.map((s) => [s.id, { ...s, points: trimPoints(s.points, start) }]));\n    group.answered = new Set(ids);\n    group.error = null;\n  }\n\n  function applyAppend(group: GroupRecord, frame: TimeseriesStreamFrame): void {\n    const start = timeseriesWindowStart(group.range, now());\n    const next = new Map<string, TimeseriesServerSeries>();\n    for (const [id, s] of group.series) next.set(id, { ...s, points: trimPoints(s.points, start) });\n    for (const s of frame.series) {\n      const held = next.get(s.id);\n      const points = held ? mergePoints(held.points, s.points) : s.points;\n      next.set(s.id, { ...s, points: trimPoints(points, start) });\n    }\n    for (const id of frame.removed ?? []) next.delete(id);\n    group.series = next;\n  }\n\n  function open(group: GroupRecord, ids: string[]): void {\n    const url = timeseriesStreamUrl(group, ids);\n    const source = factory(url);\n    const current = () => group.source === source;\n    const onFrame = (name: \"snapshot\" | \"append\") => (event: Event) => {\n      if (!current()) return;\n      try {\n        const frame = parseFrame(name, (event as MessageEvent).data);\n        if (name === \"snapshot\") applySnapshot(group, ids, frame);\n        else applyAppend(group, frame);\n        publish(group);\n      } catch (err) {\n        fail(group, err instanceof Error ? err : new Error(String(err)));\n      }\n    };\n    source.addEventListener(\"snapshot\", onFrame(\"snapshot\"));\n    source.addEventListener(\"append\", onFrame(\"append\"));\n    source.addEventListener(\"error\", (event) => {\n      if (!current()) return;\n      // A sub the event hub failed (the server closed it with an error, or\n      // refused the subscribe) is an ErrorEvent carrying the server's message.\n      // A server-sent `error` event carries {\"error\": msg}; a transport error\n      // carries no data. A transport error that leaves the source CONNECTING\n      // is a reconnect the hub (or native EventSource) re-subscribes from with\n      // a fresh snapshot; one that leaves it CLOSED is a failed subscription\n      // native EventSource gives no reason for.\n      if (event instanceof ErrorEvent) {\n        fail(group, new Error(event.message));\n        return;\n      }\n      const data = (event as MessageEvent).data;\n      if (typeof data === \"string\" && data !== \"\") {\n        let message: string;\n        try {\n          message = String((JSON.parse(data) as { error?: unknown }).error ?? data);\n        } catch {\n          message = data;\n        }\n        fail(group, new Error(message));\n        return;\n      }\n      if (source.readyState === CLOSED) fail(group, new Error(`metrics stream closed: ${url}`));\n    });\n    group.source?.close();\n    group.source = source;\n    group.ids = ids;\n  }\n\n  function reconcile(key: string): void {\n    const group = groups.get(key);\n    if (!group) return;\n    const ids = [...group.refs.keys()].sort();\n    if (ids.length === 0) {\n      group.source?.close();\n      groups.delete(key);\n      forget(key);\n      return;\n    }\n    if (ids.length === group.ids.length && ids.every((id, i) => id === group.ids[i])) return;\n    // Keep what is held for ids still requested until the new snapshot\n    // replaces it; an error belonged to the subscription being replaced.\n    const kept = new Set(ids);\n    for (const [id, s] of group.series) if (!kept.has(s.source)) group.series.delete(id);\n    group.answered = new Set([...group.answered].filter((id) => kept.has(id)));\n    group.error = null;\n    open(group, ids);\n    publish(group);\n  }\n\n  function flush(): void {\n    flushTimer = null;\n    const keys = [...dirty];\n    dirty.clear();\n    for (const key of keys) reconcile(key);\n  }\n\n  function markDirty(key: string): void {\n    dirty.add(key);\n    if (flushTimer) clearTimeout(flushTimer);\n    flushTimer = setTimeout(flush, debounceMs);\n  }\n\n  return {\n    register(registration) {\n      const { id, ...groupFields } = registration;\n      if (id === \"\") throw new Error(\"timeseries stream registration needs a metric id\");\n      const key = timeseriesStreamGroupKey(groupFields);\n      let group = groups.get(key);\n      if (!group) {\n        group = {\n          ...groupFields,\n          key,\n          refs: new Map(),\n          ids: [],\n          source: null,\n          series: new Map(),\n          answered: new Set(),\n          error: null,\n        };\n        groups.set(key, group);\n      }\n      const owner = group;\n      owner.refs.set(id, (owner.refs.get(id) ?? 0) + 1);\n      markDirty(key);\n      let registered = true;\n      return () => {\n        if (!registered) return;\n        registered = false;\n        // close() may have dropped the group already (the provider unmounting\n        // before its widgets); a later registration makes a new record.\n        if (groups.get(key) !== owner) return;\n        const count = (owner.refs.get(id) ?? 0) - 1;\n        if (count > 0) owner.refs.set(id, count);\n        else owner.refs.delete(id);\n        markDirty(key);\n      };\n    },\n    subscribe(listener) {\n      listeners.add(listener);\n      return () => listeners.delete(listener);\n    },\n    getSnapshot() {\n      return snapshot;\n    },\n    getGroup(key) {\n      return snapshot.get(key) ?? EMPTY_TIMESERIES_STREAM_GROUP;\n    },\n    close() {\n      if (flushTimer) clearTimeout(flushTimer);\n      flushTimer = null;\n      dirty.clear();\n      for (const group of groups.values()) group.source?.close();\n      groups.clear();\n      if (snapshot.size > 0) notify(new Map());\n    },\n  };\n}\n\nexport const TimeseriesStreamContext = createContext<TimeseriesStream | null>(null);\n\n/** The provided {@link TimeseriesStream}, or null outside a `TimeseriesStreamProvider`. */\nexport function useTimeseriesStream(): TimeseriesStream | null {\n  return useContext(TimeseriesStreamContext);\n}\n"],"mappings":";;AA+DA,IAAM,sBAAsB;AAC5B,IAAM,SAAS;AAEf,IAAM,oBAAoB;;AAG1B,IAAa,gCAA4D,OAAO,OAAO;CACrF,0BAAU,IAAI,IAAI;CAClB,0BAAU,IAAI,IAAY;CAC1B,OAAO;AACT,CAAC;AAED,SAAgB,yBAAyB,EAAE,SAAS,OAAO,YAA2C;CACpG,OAAO,KAAK,UAAU;EAAC;EAAS;EAAO;CAAQ,CAAC;AAClD;;;;;;AAOA,SAAgB,yBAAyB,WAAkC;CACzE,IAAI,EAAE,YAAY,IAAI,OAAO;CAC7B,OAAO,GAAG,KAAK,IAAI,GAAG,KAAK,KAAK,YAAY,GAAI,CAAC,EAAE;AACrD;;;;;;;;;AAUA,SAAgB,wBAAwB,SAAiB,IAAoD;CAC3G,IAAI,YAAY,IAAI,OAAO;EAAE;EAAS;CAAG;CACzC,MAAM,QAAQ,GAAG,QAAQ,GAAG;CAC5B,MAAM,QAAQ,GAAG,YAAY,KAAK,UAAU,KAAK,GAAG,SAAS,KAAK;CAClE,IAAI,UAAU,MAAM,UAAU,GAAG,SAAS,KAAK,UAAU,QAAQ,GAAG,OAAO;CAC3E,OAAO;EAAE,SAAS,GAAG,MAAM,GAAG,QAAQ,CAAC;EAAG,IAAI,GAAG,MAAM,QAAQ,CAAC;CAAE;AACpE;AAEA,SAAgB,oBAAoB,OAA8B,KAAgC;CAChG,MAAM,SAAS,IAAI,gBAAgB;CACnC,KAAK,MAAM,MAAM,KAAK,OAAO,OAAO,MAAM,EAAE;CAC5C,IAAI,MAAM,OAAO,OAAO,IAAI,SAAS,MAAM,KAAK;CAChD,OAAO,IAAI,YAAY,MAAM,QAAQ;CACrC,OAAO,GAAG,MAAM,QAAQ,SAAS,OAAO,SAAS;AACnD;AAEA,IAAM,uBAA+C;CACnD,IAAI;CACJ,IAAI;CACJ,MAAM;CACN,IAAI;CACJ,GAAG;CACH,GAAG;CACH,GAAG;AACL;AACA,IAAM,cAAc;AACpB,IAAM,mBAAmB;;;;;AAMzB,SAAgB,sBAAsB,OAAe,OAAuB;CAC1E,IAAI,UAAU,IAAI,OAAO,QAAQ;CACjC,IAAI,UAAU,KAAK,OAAO;CAC1B,IAAI,YAAY,KAAK,KAAK,GAAG;EAC3B,IAAI,KAAK;EACT,KAAK,MAAM,GAAG,QAAQ,SAAS,MAAM,SAAS,gBAAgB,GAC5D,MAAM,OAAO,MAAM,IAAK,qBAAqB;EAE/C,OAAO,QAAQ;CACjB;CACA,MAAM,KAAK,KAAK,MAAM,KAAK;CAC3B,IAAI,OAAO,MAAM,EAAE,GACjB,MAAM,IAAI,MAAM,iBAAiB,KAAK,UAAU,KAAK,EAAE,8CAA8C;CAEvG,OAAO;AACT;AAEA,SAAS,UAAU,OAAgC;CACjD,MAAM,KAAK,KAAK,MAAM,MAAM,EAAE;CAC9B,IAAI,OAAO,MAAM,EAAE,GAAG,MAAM,IAAI,MAAM,0CAA0C,KAAK,UAAU,MAAM,EAAE,GAAG;CAC1G,OAAO;AACT;AAEA,SAAS,WAAW,QAAoC,SAAoC;CAC1F,OAAO,OAAO,QAAQ,MAAM,UAAU,CAAC,KAAK,OAAO;AACrD;;AAGA,SAAS,YAAY,UAAsC,OAAsD;CAC/G,MAAM,yBAAS,IAAI,IAA6B;CAChD,KAAK,MAAM,KAAK,UAAU,OAAO,IAAI,UAAU,CAAC,GAAG,CAAC;CACpD,KAAK,MAAM,KAAK,OAAO,OAAO,IAAI,UAAU,CAAC,GAAG,CAAC;CACjD,OAAO,CAAC,GAAG,OAAO,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC,KAAK,GAAG,OAAO,CAAC;AACzE;AAEA,SAAS,WAAW,MAAc,MAAsC;CACtE,MAAM,QAAQ,KAAK,MAAM,OAAO,IAAI,CAAC;CACrC,IAAI,CAAC,SAAS,CAAC,MAAM,QAAQ,MAAM,MAAM,GACvC,MAAM,IAAI,MAAM,kBAAkB,KAAK,2BAA2B;CAEpE,OAAO;AACT;AAaA,SAAS,WAAW,OAAgD;CAClE,MAAM,2BAAW,IAAI,IAAsC;CAC3D,KAAK,MAAM,KAAK,MAAM,OAAO,OAAO,GAAG;EACrC,MAAM,OAAO,SAAS,IAAI,EAAE,MAAM,KAAK,CAAC;EACxC,KAAK,KAAK,CAAC;EACX,SAAS,IAAI,EAAE,QAAQ,IAAI;CAC7B;CACA,OAAO;EAAE;EAAU,UAAU,IAAI,IAAI,MAAM,QAAQ;EAAG,OAAO,MAAM;CAAM;AAC3E;;AAGA,SAAgB,uBAAuB,SAAoD;CACzF,MAAM,EAAE,SAAS,aAAa,qBAAqB,MAAM,KAAK,QAAQ;CACtE,MAAM,yBAAS,IAAI,IAAyB;CAC5C,MAAM,wBAAQ,IAAI,IAAY;CAC9B,MAAM,4BAAY,IAAI,IAAgB;CACtC,IAAI,aAAmD;CACvD,IAAI,2BAA4D,IAAI,IAAI;CAExE,SAAS,OAAO,MAAqD;EACnE,WAAW;EACX,KAAK,MAAM,YAAY,MAAM,KAAK,SAAS,GAAG,SAAS;CACzD;CAEA,SAAS,QAAQ,OAA0B;EACzC,OAAO,IAAI,IAAI,QAAQ,CAAC,CAAC,IAAI,MAAM,KAAK,WAAW,KAAK,CAAC,CAAC;CAC5D;CAEA,SAAS,OAAO,KAAmB;EACjC,MAAM,OAAO,IAAI,IAAI,QAAQ;EAC7B,KAAK,OAAO,GAAG;EACf,OAAO,IAAI;CACb;CAEA,SAAS,KAAK,OAAoB,OAAoB;EACpD,MAAM,QAAQ;EACd,QAAQ,KAAK;CACf;CAEA,SAAS,cAAc,OAAoB,KAAwB,OAAoC;EACrG,MAAM,QAAQ,sBAAsB,MAAM,OAAO,IAAI,CAAC;EACtD,MAAM,SAAS,IAAI,IAAI,MAAM,OAAO,KAAK,MAAM,CAAC,EAAE,IAAI;GAAE,GAAG;GAAG,QAAQ,WAAW,EAAE,QAAQ,KAAK;EAAE,CAAC,CAAC,CAAC;EACrG,MAAM,WAAW,IAAI,IAAI,GAAG;EAC5B,MAAM,QAAQ;CAChB;CAEA,SAAS,YAAY,OAAoB,OAAoC;EAC3E,MAAM,QAAQ,sBAAsB,MAAM,OAAO,IAAI,CAAC;EACtD,MAAM,uBAAO,IAAI,IAAoC;EACrD,KAAK,MAAM,CAAC,IAAI,MAAM,MAAM,QAAQ,KAAK,IAAI,IAAI;GAAE,GAAG;GAAG,QAAQ,WAAW,EAAE,QAAQ,KAAK;EAAE,CAAC;EAC9F,KAAK,MAAM,KAAK,MAAM,QAAQ;GAC5B,MAAM,OAAO,KAAK,IAAI,EAAE,EAAE;GAC1B,MAAM,SAAS,OAAO,YAAY,KAAK,QAAQ,EAAE,MAAM,IAAI,EAAE;GAC7D,KAAK,IAAI,EAAE,IAAI;IAAE,GAAG;IAAG,QAAQ,WAAW,QAAQ,KAAK;GAAE,CAAC;EAC5D;EACA,KAAK,MAAM,MAAM,MAAM,WAAW,CAAC,GAAG,KAAK,OAAO,EAAE;EACpD,MAAM,SAAS;CACjB;CAEA,SAAS,KAAK,OAAoB,KAAqB;EACrD,MAAM,MAAM,oBAAoB,OAAO,GAAG;EAC1C,MAAM,SAAS,QAAQ,GAAG;EAC1B,MAAM,gBAAgB,MAAM,WAAW;EACvC,MAAM,WAAW,UAAiC,UAAiB;GACjE,IAAI,CAAC,QAAQ,GAAG;GAChB,IAAI;IACF,MAAM,QAAQ,WAAW,MAAO,MAAuB,IAAI;IAC3D,IAAI,SAAS,YAAY,cAAc,OAAO,KAAK,KAAK;SACnD,YAAY,OAAO,KAAK;IAC7B,QAAQ,KAAK;GACf,SAAS,KAAK;IACZ,KAAK,OAAO,eAAe,QAAQ,MAAM,IAAI,MAAM,OAAO,GAAG,CAAC,CAAC;GACjE;EACF;EACA,OAAO,iBAAiB,YAAY,QAAQ,UAAU,CAAC;EACvD,OAAO,iBAAiB,UAAU,QAAQ,QAAQ,CAAC;EACnD,OAAO,iBAAiB,UAAU,UAAU;GAC1C,IAAI,CAAC,QAAQ,GAAG;GAQhB,IAAI,iBAAiB,YAAY;IAC/B,KAAK,OAAO,IAAI,MAAM,MAAM,OAAO,CAAC;IACpC;GACF;GACA,MAAM,OAAQ,MAAuB;GACrC,IAAI,OAAO,SAAS,YAAY,SAAS,IAAI;IAC3C,IAAI;IACJ,IAAI;KACF,UAAU,OAAQ,KAAK,MAAM,IAAI,CAAC,CAAyB,SAAS,IAAI;IAC1E,QAAQ;KACN,UAAU;IACZ;IACA,KAAK,OAAO,IAAI,MAAM,OAAO,CAAC;IAC9B;GACF;GACA,IAAI,OAAO,eAAe,QAAQ,KAAK,uBAAO,IAAI,MAAM,0BAA0B,KAAK,CAAC;EAC1F,CAAC;EACD,MAAM,QAAQ,MAAM;EACpB,MAAM,SAAS;EACf,MAAM,MAAM;CACd;CAEA,SAAS,UAAU,KAAmB;EACpC,MAAM,QAAQ,OAAO,IAAI,GAAG;EAC5B,IAAI,CAAC,OAAO;EACZ,MAAM,MAAM,CAAC,GAAG,MAAM,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK;EACxC,IAAI,IAAI,WAAW,GAAG;GACpB,MAAM,QAAQ,MAAM;GACpB,OAAO,OAAO,GAAG;GACjB,OAAO,GAAG;GACV;EACF;EACA,IAAI,IAAI,WAAW,MAAM,IAAI,UAAU,IAAI,OAAO,IAAI,MAAM,OAAO,MAAM,IAAI,EAAE,GAAG;EAGlF,MAAM,OAAO,IAAI,IAAI,GAAG;EACxB,KAAK,MAAM,CAAC,IAAI,MAAM,MAAM,QAAQ,IAAI,CAAC,KAAK,IAAI,EAAE,MAAM,GAAG,MAAM,OAAO,OAAO,EAAE;EACnF,MAAM,WAAW,IAAI,IAAI,CAAC,GAAG,MAAM,QAAQ,CAAC,CAAC,QAAQ,OAAO,KAAK,IAAI,EAAE,CAAC,CAAC;EACzE,MAAM,QAAQ;EACd,KAAK,OAAO,GAAG;EACf,QAAQ,KAAK;CACf;CAEA,SAAS,QAAc;EACrB,aAAa;EACb,MAAM,OAAO,CAAC,GAAG,KAAK;EACtB,MAAM,MAAM;EACZ,KAAK,MAAM,OAAO,MAAM,UAAU,GAAG;CACvC;CAEA,SAAS,UAAU,KAAmB;EACpC,MAAM,IAAI,GAAG;EACb,IAAI,YAAY,aAAa,UAAU;EACvC,aAAa,WAAW,OAAO,UAAU;CAC3C;CAEA,OAAO;EACL,SAAS,cAAc;GACrB,MAAM,EAAE,IAAI,GAAG,gBAAgB;GAC/B,IAAI,OAAO,IAAI,MAAM,IAAI,MAAM,kDAAkD;GACjF,MAAM,MAAM,yBAAyB,WAAW;GAChD,IAAI,QAAQ,OAAO,IAAI,GAAG;GAC1B,IAAI,CAAC,OAAO;IACV,QAAQ;KACN,GAAG;KACH;KACA,sBAAM,IAAI,IAAI;KACd,KAAK,CAAC;KACN,QAAQ;KACR,wBAAQ,IAAI,IAAI;KAChB,0BAAU,IAAI,IAAI;KAClB,OAAO;IACT;IACA,OAAO,IAAI,KAAK,KAAK;GACvB;GACA,MAAM,QAAQ;GACd,MAAM,KAAK,IAAI,KAAK,MAAM,KAAK,IAAI,EAAE,KAAK,KAAK,CAAC;GAChD,UAAU,GAAG;GACb,IAAI,aAAa;GACjB,aAAa;IACX,IAAI,CAAC,YAAY;IACjB,aAAa;IAGb,IAAI,OAAO,IAAI,GAAG,MAAM,OAAO;IAC/B,MAAM,SAAS,MAAM,KAAK,IAAI,EAAE,KAAK,KAAK;IAC1C,IAAI,QAAQ,GAAG,MAAM,KAAK,IAAI,IAAI,KAAK;SAClC,MAAM,KAAK,OAAO,EAAE;IACzB,UAAU,GAAG;GACf;EACF;EACA,UAAU,UAAU;GAClB,UAAU,IAAI,QAAQ;GACtB,aAAa,UAAU,OAAO,QAAQ;EACxC;EACA,cAAc;GACZ,OAAO;EACT;EACA,SAAS,KAAK;GACZ,OAAO,SAAS,IAAI,GAAG,KAAK;EAC9B;EACA,QAAQ;GACN,IAAI,YAAY,aAAa,UAAU;GACvC,aAAa;GACb,MAAM,MAAM;GACZ,KAAK,MAAM,SAAS,OAAO,OAAO,GAAG,MAAM,QAAQ,MAAM;GACzD,OAAO,MAAM;GACb,IAAI,SAAS,OAAO,GAAG,uBAAO,IAAI,IAAI,CAAC;EACzC;CACF;AACF;AAEA,IAAa,0BAA0B,cAAuC,IAAI;;AAGlF,SAAgB,sBAA+C;CAC7D,OAAO,WAAW,uBAAuB;AAC3C"}

package/dist/data/token-style.cjs

@@ -0,0 +1,13 @@
+// src/data/token-style.ts
+function tokenStyle(token) {
+	const style = {};
+	if (token.color) style.color = token.color;
+	const fontStyle = token.fontStyle ?? 0;
+	if (fontStyle & 1) style.fontStyle = "italic";
+	if (fontStyle & 2) style.fontWeight = 700;
+	if (fontStyle & 4) style.textDecorationLine = "underline";
+	return style;
+}
+exports.tokenStyle = tokenStyle;
+
+//# sourceMappingURL=token-style.cjs.map

package/dist/data/token-style.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"token-style.cjs","names":[],"sources":["../../src/data/token-style.ts"],"sourcesContent":["import type { CSSProperties } from \"react\";\nimport type { HighlightedToken } from \"./code-highlight\";\n\n// Shiki's `fontStyle` is a bitmask: 1=italic, 2=bold, 4=underline.\nexport function tokenStyle(token: HighlightedToken): CSSProperties {\n  const style: CSSProperties = {};\n  if (token.color) style.color = token.color;\n  const fontStyle = token.fontStyle ?? 0;\n  if (fontStyle & 1) style.fontStyle = \"italic\";\n  if (fontStyle & 2) style.fontWeight = 700;\n  if (fontStyle & 4) style.textDecorationLine = \"underline\";\n  return style;\n}\n"],"mappings":";AAIA,SAAgB,WAAW,OAAwC;CACjE,MAAM,QAAuB,CAAC;CAC9B,IAAI,MAAM,OAAO,MAAM,QAAQ,MAAM;CACrC,MAAM,YAAY,MAAM,aAAa;CACrC,IAAI,YAAY,GAAG,MAAM,YAAY;CACrC,IAAI,YAAY,GAAG,MAAM,aAAa;CACtC,IAAI,YAAY,GAAG,MAAM,qBAAqB;CAC9C,OAAO;AACT"}

package/dist/data/token-style.d.ts

@@ -0,0 +1,4 @@
+import { CSSProperties } from 'react';
+import { HighlightedToken } from './code-highlight.js';
+export declare function tokenStyle(token: HighlightedToken): CSSProperties;
+//# sourceMappingURL=token-style.d.ts.map

package/dist/data/token-style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"token-style.d.ts","sourceRoot":"","sources":["../../src/data/token-style.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAGzD,wBAAgB,UAAU,CAAC,KAAK,EAAE,gBAAgB,GAAG,aAAa,CAQjE"}

package/dist/data/token-style.js

@@ -0,0 +1,13 @@
+// src/data/token-style.ts
+function tokenStyle(token) {
+	const style = {};
+	if (token.color) style.color = token.color;
+	const fontStyle = token.fontStyle ?? 0;
+	if (fontStyle & 1) style.fontStyle = "italic";
+	if (fontStyle & 2) style.fontWeight = 700;
+	if (fontStyle & 4) style.textDecorationLine = "underline";
+	return style;
+}
+export { tokenStyle };
+
+//# sourceMappingURL=token-style.js.map

package/dist/data/token-style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"token-style.js","names":[],"sources":["../../src/data/token-style.ts"],"sourcesContent":["import type { CSSProperties } from \"react\";\nimport type { HighlightedToken } from \"./code-highlight\";\n\n// Shiki's `fontStyle` is a bitmask: 1=italic, 2=bold, 4=underline.\nexport function tokenStyle(token: HighlightedToken): CSSProperties {\n  const style: CSSProperties = {};\n  if (token.color) style.color = token.color;\n  const fontStyle = token.fontStyle ?? 0;\n  if (fontStyle & 1) style.fontStyle = \"italic\";\n  if (fontStyle & 2) style.fontWeight = 700;\n  if (fontStyle & 4) style.textDecorationLine = \"underline\";\n  return style;\n}\n"],"mappings":";AAIA,SAAgB,WAAW,OAAwC;CACjE,MAAM,QAAuB,CAAC;CAC9B,IAAI,MAAM,OAAO,MAAM,QAAQ,MAAM;CACrC,MAAM,YAAY,MAAM,aAAa;CACrC,IAAI,YAAY,GAAG,MAAM,YAAY;CACrC,IAAI,YAAY,GAAG,MAAM,aAAa;CACtC,IAAI,YAAY,GAAG,MAAM,qBAAqB;CAC9C,OAAO;AACT"}

package/dist/data/traces/ProcessTraceDetail.cjs

@@ -9,8 +9,8 @@ const require_button = require("../../components/button.cjs");
 const require_select = require("../../components/select.cjs");
 const require_ConfirmDialog = require("../../overlay/ConfirmDialog.cjs");
 const require_Tabs = require("../../layout/Tabs.cjs");
-const require_StackDumpView = require("../diagnostics/StackDumpView.cjs");
 const require_MetricTile = require("../diagnostics/MetricTile.cjs");
+const require_StackDumpView = require("../diagnostics/StackDumpView.cjs");
 const require_metric_tone = require("../diagnostics/metric-tone.cjs");
 const require_utils$1 = require("../diagnostics/utils.cjs");
 const require_process_tree = require("./process-tree.cjs");

package/dist/data/traces/ProcessTraceDetail.js

@@ -9,8 +9,8 @@ import { Button } from "../../components/button.js";
 import { Select } from "../../components/select.js";
 import { ConfirmDialog } from "../../overlay/ConfirmDialog.js";
 import { Tabs } from "../../layout/Tabs.js";
-import { StackDumpView } from "../diagnostics/StackDumpView.js";
 import { MetricTile } from "../diagnostics/MetricTile.js";
+import { StackDumpView } from "../diagnostics/StackDumpView.js";
 import { cpuTone } from "../diagnostics/metric-tone.js";
 import { processLabel, processStateColor, processStateIcon } from "../diagnostics/utils.js";
 import { formatCpuPercent, formatProcessTimestamp, isProcessExited, processLifetimeMs, processSeries } from "./process-tree.js";

package/dist/data/traces/index.d.ts

@@ -14,6 +14,13 @@ export { SAMPLE_FACETS, SAMPLE_FACET_ORDER, armedFacets, diskSeries, facetCountS
 export { stackCheckpoints, type StackCheckpoint } from './stack-checkpoints.js';
 export { TraceWindowList, type TraceWindow, type TraceWindowListProps, type TraceWindowSource, } from './TraceWindowList.js';
 export { buildProcessForest, flattenForest, formatCpuPercent, formatProcessTimestamp, isProcessExited, processLifetimeMs, processSeries, pruneExitedProcesses, type ProcessTreeNode, } from './process-tree.js';
-export { Sparkline, LabeledSparkline, type SparklineProps, type LabeledSparklineProps } from './Sparkline.js';
+export { LabeledSparkline, type LabeledSparklineProps } from './Sparkline.js';
 export type { HttpExchangeRequest, HttpExchangeResponse, GoProfileRecord, HttpExchangeRow, ProcessDescriptor, ProcessEnv, ProcessNodeRow, ProcessSampleFacet, ProcessSampleRow, ProcessStackTransport, ProfileSample, SqlStatementRow, StackFormat, StackFrame, StackRecord, TerminalEvent, TerminalEventKind, TraceBodyText, TraceRow, } from './types.js';
+export { OtelTraceDetail } from './otel/OtelTraceDetail.js';
+export { OtelTraceSearch } from './otel/OtelTraceSearch.js';
+export { OtelTraceTable, type OtelTraceTableProps } from './otel/OtelTraceTable.js';
+export { searchParams as otelSearchParams, readSearchValues as readOtelSearchValues } from './otel/api.js';
+export { durationOf as otelDurationOf } from './otel/query.js';
+export type { Span as OtelSpan, Summary as OtelSummary, SearchForm as OtelSearchForm } from './otel/api.js';
+export type { Trace as OtelTrace, SearchValues as OtelSearchValues, SearchResult as OtelSearchResult, Source as OtelSource } from './otel/api.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/data/traces/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/data/traces/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,KAAK,yBAAyB,EAAE,MAAM,eAAe,CAAC;AACnF,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,eAAe,EAAE,uBAAuB,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAC3F,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACxF,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACnC,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAClF,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACxF,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AACrF,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,KAAK,kBAAkB,EAAE,KAAK,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACrH,OAAO,EACL,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,EACjB,aAAa,EACb,KAAK,gBAAgB,EACrB,KAAK,kBAAkB,EACvB,KAAK,YAAY,EACjB,KAAK,gBAAgB,GACtB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,aAAa,EACb,kBAAkB,EAClB,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,kBAAkB,EAClB,KAAK,YAAY,GAClB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,KAAK,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC7E,OAAO,EACL,eAAe,EACf,KAAK,WAAW,EAChB,KAAK,oBAAoB,EACzB,KAAK,iBAAiB,GACvB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,kBAAkB,EAClB,aAAa,EACb,gBAAgB,EAChB,sBAAsB,EACtB,eAAe,EACf,iBAAiB,EACjB,aAAa,EACb,oBAAoB,EACpB,KAAK,eAAe,GACrB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,KAAK,cAAc,EAAE,KAAK,qBAAqB,EAAE,MAAM,aAAa,CAAC;AAC3G,YAAY,EACV,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,UAAU,EACV,cAAc,EACd,kBAAkB,EAClB,gBAAgB,EAChB,qBAAqB,EACrB,aAAa,EACb,eAAe,EACf,WAAW,EACX,UAAU,EACV,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,aAAa,EACb,QAAQ,GACT,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/data/traces/index.ts"],"names":[],"mappings":"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"}

package/dist/data/traces/otel/OperationList.cjs

@@ -0,0 +1,64 @@
+const require_api = require("./api.cjs");
+const require_query = require("./query.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+// src/data/traces/otel/OperationList.tsx
+/** The root operations of the window with their counts and p50/p95; choosing one filters to it, "All operations" clears it. */
+function OperationList({ stats, selected, onSelect, hideSingle }) {
+	const total = stats.reduce((sum, stat) => sum + stat.count, 0);
+	const item = (operation, label, body, dim = false) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		"aria-pressed": selected === operation,
+		onClick: () => onSelect(operation),
+		className: `w-full rounded-md px-density-2 py-1.5 text-left text-xs ${selected === operation ? "bg-accent" : "hover:bg-muted"} ${dim ? "opacity-50" : ""}`,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "block truncate text-sm font-medium",
+			title: operation || label,
+			children: label
+		}), body]
+	}) }, operation || "all");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
+		className: "min-w-0 space-y-2 rounded-lg border border-border p-density-2",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+				className: "px-density-2 text-xs font-medium uppercase tracking-wide text-muted-foreground",
+				children: "Root operations"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("ul", {
+				className: "space-y-0.5",
+				children: [item("", "All operations", /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "text-muted-foreground",
+					children: [
+						total.toLocaleString(),
+						" ",
+						total === 1 ? "trace" : "traces"
+					]
+				})), stats.map((stat) => item(stat.operation, require_query.shortOperation(stat.operation), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "flex items-center gap-1.5 text-muted-foreground",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "tabular-nums",
+						children: [
+							stat.count.toLocaleString(),
+							" ",
+							stat.singleSpan ? "single-span" : stat.count === 1 ? "trace" : "traces"
+						]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "ml-auto tabular-nums",
+						children: [
+							"p50 ",
+							require_api.duration(stat.p50Ms),
+							" · p95 ",
+							require_api.duration(stat.p95Ms)
+						]
+					})]
+				}), hideSingle && stat.singleSpan))]
+			}),
+			hideSingle && stats.some((stat) => stat.singleSpan) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "px-density-2 text-xs text-muted-foreground",
+				children: "Single-span operations are dimmed while single-span traces are hidden."
+			})
+		]
+	});
+}
+exports.OperationList = OperationList;
+
+//# sourceMappingURL=OperationList.cjs.map

package/dist/data/traces/otel/OperationList.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"OperationList.cjs","names":["shortOperation","duration"],"sources":["../../../../src/data/traces/otel/OperationList.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { duration, type OperationStats } from \"./api\";\nimport { shortOperation } from \"./query\";\n\n/** The root operations of the window with their counts and p50/p95; choosing one filters to it, \"All operations\" clears it. */\nexport function OperationList({ stats, selected, onSelect, hideSingle }: {\n  stats: OperationStats[];\n  /** The one root operation included, \"\" for none, undefined for any other selection. */\n  selected: string | undefined;\n  onSelect: (operation: string) => void;\n  hideSingle: boolean;\n}) {\n  const total = stats.reduce((sum, stat) => sum + stat.count, 0);\n  const item = (operation: string, label: string, body: ReactNode, dim = false) => (\n    <li key={operation || \"all\"}>\n      <button\n        type=\"button\"\n        aria-pressed={selected === operation}\n        onClick={() => onSelect(operation)}\n        className={`w-full rounded-md px-density-2 py-1.5 text-left text-xs ${selected === operation ? \"bg-accent\" : \"hover:bg-muted\"} ${dim ? \"opacity-50\" : \"\"}`}\n      >\n        <span className=\"block truncate text-sm font-medium\" title={operation || label}>{label}</span>\n        {body}\n      </button>\n    </li>\n  );\n  return (\n    <aside className=\"min-w-0 space-y-2 rounded-lg border border-border p-density-2\">\n      <h3 className=\"px-density-2 text-xs font-medium uppercase tracking-wide text-muted-foreground\">Root operations</h3>\n      <ul className=\"space-y-0.5\">\n        {item(\"\", \"All operations\", <span className=\"text-muted-foreground\">{total.toLocaleString()} {total === 1 ? \"trace\" : \"traces\"}</span>)}\n        {stats.map(stat => item(stat.operation, shortOperation(stat.operation), (\n          <span className=\"flex items-center gap-1.5 text-muted-foreground\">\n            <span className=\"tabular-nums\">{stat.count.toLocaleString()} {stat.singleSpan ? \"single-span\" : stat.count === 1 ? \"trace\" : \"traces\"}</span>\n            <span className=\"ml-auto tabular-nums\">p50 {duration(stat.p50Ms)} · p95 {duration(stat.p95Ms)}</span>\n          </span>\n        ), hideSingle && stat.singleSpan))}\n      </ul>\n      {hideSingle && stats.some(stat => stat.singleSpan) && (\n        <p className=\"px-density-2 text-xs text-muted-foreground\">Single-span operations are dimmed while single-span traces are hidden.</p>\n      )}\n    </aside>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,cAAc,EAAE,OAAO,UAAU,UAAU,cAMxD;CACD,MAAM,QAAQ,MAAM,QAAQ,KAAK,SAAS,MAAM,KAAK,OAAO,CAAC;CAC7D,MAAM,QAAQ,WAAmB,OAAe,MAAiB,MAAM,UACrE,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,UAAD;EACE,MAAK;EACL,gBAAc,aAAa;EAC3B,eAAe,SAAS,SAAS;EACjC,WAAW,2DAA2D,aAAa,YAAY,cAAc,iBAAiB,GAAG,MAAM,eAAe;EAJxJ,UAAA,CAME,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;GAAM,WAAU;GAAqC,OAAO,aAAa;GAAQ,UAAA;EAAY,CAAA,GAC5F,IACK;CACN,CAAA,EAAA,GAVK,aAAa,KAUlB;CAEN,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,SAAD;EAAO,WAAU;EAAjB,UAAA;GACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD;IAAI,WAAU;IAAiF,UAAA;GAAmB,CAAA;GAClH,iBAAA,GAAA,kBAAA,KAAA,CAAC,MAAD;IAAI,WAAU;IAAd,UAAA,CACG,KAAK,IAAI,kBAAkB,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;KAAM,WAAU;KAAhB,UAAA;MAAyC,MAAM,eAAe;MAAE;MAAE,UAAU,IAAI,UAAU;KAAe;IAAC,CAAA,CAAA,GACrI,MAAM,KAAI,SAAQ,KAAK,KAAK,WAAWA,cAAAA,eAAe,KAAK,SAAS,GACnE,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;MAAM,WAAU;MAAhB,UAAA;OAAgC,KAAK,MAAM,eAAe;OAAE;OAAE,KAAK,aAAa,gBAAgB,KAAK,UAAU,IAAI,UAAU;MAAe;KAC5I,CAAA,GAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;MAAM,WAAU;MAAhB,UAAA;OAAuC;OAAKC,YAAAA,SAAS,KAAK,KAAK;OAAE;OAAQA,YAAAA,SAAS,KAAK,KAAK;MAAQ;KAChG,CAAA,CAAA;IACL,CAAA,GAAA,cAAc,KAAK,UAAU,CAAC,CAC/B;;GACH,cAAc,MAAM,MAAK,SAAQ,KAAK,UAAU,KAC/C,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;IAAG,WAAU;IAA6C,UAAA;GAAyE,CAAA;EAEhI;;AAEX"}

package/dist/data/traces/otel/OperationList.d.ts

@@ -0,0 +1,10 @@
+import { OperationStats } from './api.js';
+/** The root operations of the window with their counts and p50/p95; choosing one filters to it, "All operations" clears it. */
+export declare function OperationList({ stats, selected, onSelect, hideSingle }: {
+    stats: OperationStats[];
+    /** The one root operation included, "" for none, undefined for any other selection. */
+    selected: string | undefined;
+    onSelect: (operation: string) => void;
+    hideSingle: boolean;
+}): import("react").JSX.Element;
+//# sourceMappingURL=OperationList.d.ts.map

package/dist/data/traces/otel/OperationList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OperationList.d.ts","sourceRoot":"","sources":["../../../../src/data/traces/otel/OperationList.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGtD,+HAA+H;AAC/H,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE;IACvE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,uFAAuF;IACvF,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,UAAU,EAAE,OAAO,CAAC;CACrB,+BAgCA"}

package/dist/data/traces/otel/OperationList.js

@@ -0,0 +1,64 @@
+import { duration } from "./api.js";
+import { shortOperation } from "./query.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/data/traces/otel/OperationList.tsx
+/** The root operations of the window with their counts and p50/p95; choosing one filters to it, "All operations" clears it. */
+function OperationList({ stats, selected, onSelect, hideSingle }) {
+	const total = stats.reduce((sum, stat) => sum + stat.count, 0);
+	const item = (operation, label, body, dim = false) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		"aria-pressed": selected === operation,
+		onClick: () => onSelect(operation),
+		className: `w-full rounded-md px-density-2 py-1.5 text-left text-xs ${selected === operation ? "bg-accent" : "hover:bg-muted"} ${dim ? "opacity-50" : ""}`,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "block truncate text-sm font-medium",
+			title: operation || label,
+			children: label
+		}), body]
+	}) }, operation || "all");
+	return /* @__PURE__ */ jsxs("aside", {
+		className: "min-w-0 space-y-2 rounded-lg border border-border p-density-2",
+		children: [
+			/* @__PURE__ */ jsx("h3", {
+				className: "px-density-2 text-xs font-medium uppercase tracking-wide text-muted-foreground",
+				children: "Root operations"
+			}),
+			/* @__PURE__ */ jsxs("ul", {
+				className: "space-y-0.5",
+				children: [item("", "All operations", /* @__PURE__ */ jsxs("span", {
+					className: "text-muted-foreground",
+					children: [
+						total.toLocaleString(),
+						" ",
+						total === 1 ? "trace" : "traces"
+					]
+				})), stats.map((stat) => item(stat.operation, shortOperation(stat.operation), /* @__PURE__ */ jsxs("span", {
+					className: "flex items-center gap-1.5 text-muted-foreground",
+					children: [/* @__PURE__ */ jsxs("span", {
+						className: "tabular-nums",
+						children: [
+							stat.count.toLocaleString(),
+							" ",
+							stat.singleSpan ? "single-span" : stat.count === 1 ? "trace" : "traces"
+						]
+					}), /* @__PURE__ */ jsxs("span", {
+						className: "ml-auto tabular-nums",
+						children: [
+							"p50 ",
+							duration(stat.p50Ms),
+							" · p95 ",
+							duration(stat.p95Ms)
+						]
+					})]
+				}), hideSingle && stat.singleSpan))]
+			}),
+			hideSingle && stats.some((stat) => stat.singleSpan) && /* @__PURE__ */ jsx("p", {
+				className: "px-density-2 text-xs text-muted-foreground",
+				children: "Single-span operations are dimmed while single-span traces are hidden."
+			})
+		]
+	});
+}
+export { OperationList };
+
+//# sourceMappingURL=OperationList.js.map

package/dist/data/traces/otel/OperationList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OperationList.js","names":[],"sources":["../../../../src/data/traces/otel/OperationList.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { duration, type OperationStats } from \"./api\";\nimport { shortOperation } from \"./query\";\n\n/** The root operations of the window with their counts and p50/p95; choosing one filters to it, \"All operations\" clears it. */\nexport function OperationList({ stats, selected, onSelect, hideSingle }: {\n  stats: OperationStats[];\n  /** The one root operation included, \"\" for none, undefined for any other selection. */\n  selected: string | undefined;\n  onSelect: (operation: string) => void;\n  hideSingle: boolean;\n}) {\n  const total = stats.reduce((sum, stat) => sum + stat.count, 0);\n  const item = (operation: string, label: string, body: ReactNode, dim = false) => (\n    <li key={operation || \"all\"}>\n      <button\n        type=\"button\"\n        aria-pressed={selected === operation}\n        onClick={() => onSelect(operation)}\n        className={`w-full rounded-md px-density-2 py-1.5 text-left text-xs ${selected === operation ? \"bg-accent\" : \"hover:bg-muted\"} ${dim ? \"opacity-50\" : \"\"}`}\n      >\n        <span className=\"block truncate text-sm font-medium\" title={operation || label}>{label}</span>\n        {body}\n      </button>\n    </li>\n  );\n  return (\n    <aside className=\"min-w-0 space-y-2 rounded-lg border border-border p-density-2\">\n      <h3 className=\"px-density-2 text-xs font-medium uppercase tracking-wide text-muted-foreground\">Root operations</h3>\n      <ul className=\"space-y-0.5\">\n        {item(\"\", \"All operations\", <span className=\"text-muted-foreground\">{total.toLocaleString()} {total === 1 ? \"trace\" : \"traces\"}</span>)}\n        {stats.map(stat => item(stat.operation, shortOperation(stat.operation), (\n          <span className=\"flex items-center gap-1.5 text-muted-foreground\">\n            <span className=\"tabular-nums\">{stat.count.toLocaleString()} {stat.singleSpan ? \"single-span\" : stat.count === 1 ? \"trace\" : \"traces\"}</span>\n            <span className=\"ml-auto tabular-nums\">p50 {duration(stat.p50Ms)} · p95 {duration(stat.p95Ms)}</span>\n          </span>\n        ), hideSingle && stat.singleSpan))}\n      </ul>\n      {hideSingle && stats.some(stat => stat.singleSpan) && (\n        <p className=\"px-density-2 text-xs text-muted-foreground\">Single-span operations are dimmed while single-span traces are hidden.</p>\n      )}\n    </aside>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,cAAc,EAAE,OAAO,UAAU,UAAU,cAMxD;CACD,MAAM,QAAQ,MAAM,QAAQ,KAAK,SAAS,MAAM,KAAK,OAAO,CAAC;CAC7D,MAAM,QAAQ,WAAmB,OAAe,MAAiB,MAAM,UACrE,oBAAC,MAAD,EAAA,UACE,qBAAC,UAAD;EACE,MAAK;EACL,gBAAc,aAAa;EAC3B,eAAe,SAAS,SAAS;EACjC,WAAW,2DAA2D,aAAa,YAAY,cAAc,iBAAiB,GAAG,MAAM,eAAe;EAJxJ,UAAA,CAME,oBAAC,QAAD;GAAM,WAAU;GAAqC,OAAO,aAAa;GAAQ,UAAA;EAAY,CAAA,GAC5F,IACK;CACN,CAAA,EAAA,GAVK,aAAa,KAUlB;CAEN,OACE,qBAAC,SAAD;EAAO,WAAU;EAAjB,UAAA;GACE,oBAAC,MAAD;IAAI,WAAU;IAAiF,UAAA;GAAmB,CAAA;GAClH,qBAAC,MAAD;IAAI,WAAU;IAAd,UAAA,CACG,KAAK,IAAI,kBAAkB,qBAAC,QAAD;KAAM,WAAU;KAAhB,UAAA;MAAyC,MAAM,eAAe;MAAE;MAAE,UAAU,IAAI,UAAU;KAAe;IAAC,CAAA,CAAA,GACrI,MAAM,KAAI,SAAQ,KAAK,KAAK,WAAW,eAAe,KAAK,SAAS,GACnE,qBAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACE,qBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA;OAAgC,KAAK,MAAM,eAAe;OAAE;OAAE,KAAK,aAAa,gBAAgB,KAAK,UAAU,IAAI,UAAU;MAAe;KAC5I,CAAA,GAAA,qBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA;OAAuC;OAAK,SAAS,KAAK,KAAK;OAAE;OAAQ,SAAS,KAAK,KAAK;MAAQ;KAChG,CAAA,CAAA;IACL,CAAA,GAAA,cAAc,KAAK,UAAU,CAAC,CAC/B;;GACH,cAAc,MAAM,MAAK,SAAQ,KAAK,UAAU,KAC/C,oBAAC,KAAD;IAAG,WAAU;IAA6C,UAAA;GAAyE,CAAA;EAEhI;;AAEX"}