jev-devtools 0.1.3 → 0.3.0

package/lib/server/flows.js

@@ -0,0 +1,115 @@
+import { capture } from "./recorder.js";
+/** Independent bounded run store. Definitions are retained only while referenced. */
+export class FlowRecorder {
+    options;
+    runs = new Map();
+    definitions = new Map();
+    sessions = new Map();
+    definitionRevisions = new Map();
+    revisions = new Map();
+    revision = 0;
+    listeners = new Set();
+    constructor(options) {
+        this.options = options;
+    }
+    subscribe(fn) {
+        this.listeners.add(fn);
+        return () => {
+            this.listeners.delete(fn);
+        };
+    }
+    notify(sessions) {
+        for (const fn of this.listeners) {
+            try {
+                fn(sessions);
+            }
+            catch { }
+        }
+    }
+    start(definition, run, session) {
+        if (!this.definitions.has(definition.id)) {
+            const stored = structuredClone(definition);
+            for (const node of stored.nodes) {
+                if (node.conditionRule === undefined)
+                    continue;
+                try {
+                    node.conditionRule = capture(node.conditionRule, new Set(), this.options.redact
+                        ? (path, value) => this.options.redact(["conditions", node.id, ...path], value)
+                        : undefined);
+                }
+                catch {
+                    node.conditionRule = "[rule capture unavailable]";
+                }
+            }
+            this.definitions.set(definition.id, stored);
+            this.definitionRevisions.set(definition.id, ++this.revision);
+        }
+        this.runs.set(run.id, run);
+        this.sessions.set(run.id, session);
+        this.revisions.set(run.id, ++this.revision);
+        const sessions = new Set([session]);
+        const limit = Math.max(1, Math.min(200, this.options.limit ?? 50));
+        while (this.runs.size > limit) {
+            const id = this.runs.keys().next().value;
+            sessions.add(this.sessions.get(id));
+            this.remove(id);
+        }
+        this.prune();
+        this.notify(sessions);
+    }
+    update(run) {
+        if (!this.runs.has(run.id))
+            return; // Clear/eviction cannot resurrect pending runs.
+        const stored = { ...run };
+        if ("value" in stored) {
+            try {
+                stored.value = capture(stored.value, new Set(), this.options.redact);
+            }
+            catch {
+                stored.value = "[capture unavailable]";
+            }
+        }
+        this.runs.set(run.id, stored);
+        this.revisions.set(run.id, ++this.revision);
+        this.notify(new Set([this.sessions.get(run.id)]));
+    }
+    remove(id) {
+        this.runs.delete(id);
+        this.sessions.delete(id);
+        this.revisions.delete(id);
+    }
+    prune() {
+        const used = new Set([...this.runs.values()].map((r) => r.definitionId));
+        for (const id of this.definitions.keys())
+            if (!used.has(id)) {
+                this.definitions.delete(id);
+                this.definitionRevisions.delete(id);
+            }
+    }
+    clear(session) {
+        for (const id of this.runs.keys())
+            if (this.sessions.get(id) === session)
+                this.remove(id);
+        this.prune();
+        this.revision++;
+        this.notify(new Set([session]));
+    }
+    changes(session, cursor) {
+        const current = [...this.runs.values()]
+            .filter((r) => this.sessions.get(r.id) === session)
+            .reverse();
+        const used = new Set(current.map((r) => r.definitionId));
+        return {
+            revision: this.revision,
+            data: structuredClone({
+                version: 1,
+                definitions: [...used]
+                    .filter((id) => cursor === undefined ||
+                    this.definitionRevisions.get(id) > cursor)
+                    .map((id) => this.definitions.get(id)),
+                upserts: current.filter((r) => cursor === undefined || this.revisions.get(r.id) > cursor),
+                order: current.map((r) => r.id),
+            }),
+        };
+    }
+}

package/lib/server/index.d.ts

@@ -19,6 +19,14 @@ export type ClientMetadata = {
 };
 /** Node runtime adapter: framework-neutral Request/Response plus Node middleware. */
 export declare function createJevDevtools(options: JevDevtoolsServerOptions): {
+    startFlow: (definition: import("../src/flow-protocol.js").FlowDefinition, run: import("../src/flow-protocol.js").FlowRun) => {
+        update(run: import("../src/flow-protocol.js").FlowRun): void;
+        request<T>(link: {
+            runId: string;
+            stepId: string;
+            executionId: string;
+        }, onTrace: (id: string) => void, callback: () => T): T;
+    } | undefined;
     handle: (request: Request) => Promise<Response>;
     /**
      * For Node framework routes whose Request URL uses an internal hostname.

package/lib/server/index.js

@@ -1,3 +1,4 @@
+import { FlowRecorder } from "./flows.js";
 import { AsyncLocalStorage } from "node:async_hooks";
 import { Readable } from "node:stream";
 import { pipeline } from "node:stream/promises";
@@ -17,7 +18,59 @@ export function createJevDevtools(options) {
     if (options.enabled && !local && !options.authorize)
         throw new Error("Non-loopback inspector endpoints require authorize");
     const recorder = new JevRecorder(options), scope = new AsyncLocalStorage();
+    const flows = new FlowRecorder(options);
     const streams = new Set();
+    const pending = new Set();
+    const encoder = new TextEncoder();
+    let scheduled;
+    const encodeUpdate = (session, incremental, cursor) => {
+        if (!incremental)
+            return {
+                bytes: encoder.encode(`event: snapshot\ndata: ${JSON.stringify({ version: 1, traces: recorder.snapshot(session) })}\n\n`),
+                revision: 0,
+            };
+        const { revision, upserts, order } = recorder.changes(session, cursor);
+        const initial = cursor === undefined;
+        const data = initial
+            ? { version: 2, revision, traces: upserts }
+            : { version: 2, base: cursor, revision, upserts, order };
+        return {
+            bytes: encoder.encode(`event: ${initial ? "snapshot" : "delta"}\ndata: ${JSON.stringify(data)}\n\n`),
+            revision,
+        };
+    };
+    function schedule(flush) {
+        pending.add(flush);
+        if (scheduled)
+            return;
+        scheduled = setImmediate(() => {
+            scheduled = undefined;
+            const batch = [...pending];
+            pending.clear();
+            // Cache only for this synchronous delivery turn and only within a session.
+            // Each reader owns its bytes; mutating one Response must not corrupt another.
+            const encoded = new Map();
+            const updateFor = (session, incremental, cursor) => {
+                // Slow readers can have older cursors even in the same session.
+                const key = JSON.stringify([session, incremental, cursor]);
+                let update = encoded.get(key);
+                if (!update) {
+                    update = encodeUpdate(session, incremental, cursor);
+                    encoded.set(key, update);
+                }
+                return { bytes: update.bytes.slice(), revision: update.revision };
+            };
+            for (const deliver of batch)
+                deliver(updateFor);
+        });
+    }
+    function unschedule(flush) {
+        pending.delete(flush);
+        if (!pending.size && scheduled) {
+            clearImmediate(scheduled);
+            scheduled = undefined;
+        }
+    }
     let disposed = false;
     const enabled = () => options.enabled === true && !disposed;
     const sessionFor = async (request) => {
@@ -40,33 +93,118 @@ export function createJevDevtools(options) {
             return json({ error: "Unauthorized" }, 403);
         const session = await sessionFor(request);
         if (url.pathname === endpoint && request.method === "GET")
-            return json({ version: 1, enabled: true });
+            return json({ version: 1, enabled: true, flows: true });
         if (url.pathname === endpoint + "/clear") {
             if (request.method !== "DELETE")
                 return json({ error: "Method not allowed" }, 405);
             if (request.headers.get("origin") !== origin)
                 return json({ error: "Same-origin requests required" }, 403);
             recorder.clear(session);
+            flows.clear(session);
             return json({ ok: true });
         }
+        let flowPull = () => { };
+        if (url.pathname === endpoint + "/flows/events") {
+            if (request.method !== "GET")
+                return json({ error: "Method not allowed" }, 405);
+            let stop = () => { };
+            const body = new ReadableStream({
+                start(controller) {
+                    let closed = false, dirty = true, cursor, timer;
+                    const flush = () => {
+                        timer = undefined;
+                        if (closed || !dirty || (controller.desiredSize ?? 0) <= 0)
+                            return;
+                        dirty = false;
+                        const update = flows.changes(session, cursor);
+                        cursor = update.revision;
+                        controller.enqueue(encoder.encode(`event: flows\ndata: ${JSON.stringify(update.data)}\n\n`));
+                    };
+                    const wake = () => {
+                        if (!closed && dirty && !timer)
+                            timer = setImmediate(flush);
+                    };
+                    const unsubscribe = flows.subscribe((sessions) => {
+                        if (sessions.has(session)) {
+                            dirty = true;
+                            wake();
+                        }
+                    });
+                    const heartbeat = setInterval(() => {
+                        if (!closed && (controller.desiredSize ?? 0) > 0)
+                            controller.enqueue(encoder.encode(": keepalive\n\n"));
+                    }, 15000);
+                    stop = () => {
+                        if (closed)
+                            return;
+                        closed = true;
+                        unsubscribe();
+                        clearImmediate(timer);
+                        clearInterval(heartbeat);
+                        request.signal.removeEventListener("abort", stop);
+                        streams.delete(stop);
+                        try {
+                            controller.close();
+                        }
+                        catch { }
+                    };
+                    streams.add(stop);
+                    request.signal.addEventListener("abort", stop, { once: true });
+                    flowPull = wake;
+                    if (request.signal.aborted)
+                        stop();
+                    else
+                        flush();
+                },
+                pull() {
+                    flowPull();
+                },
+                cancel() {
+                    stop();
+                },
+            });
+            return new Response(body, {
+                headers: {
+                    "content-type": "text/event-stream",
+                    "cache-control": "no-store",
+                    "x-accel-buffering": "no",
+                },
+            });
+        }
         if (url.pathname !== endpoint + "/events")
             return json({ error: "Not found" }, 404);
         if (request.method !== "GET")
             return json({ error: "Method not allowed" }, 405);
-        const encoder = new TextEncoder();
-        let cleanup = () => { }, flush = () => { };
+        const incremental = url.searchParams.get("protocol") === "2";
+        let cursor;
+        let cleanup = () => { }, wake = () => { }, flush = () => { };
         const stream = new ReadableStream({
             start(controller) {
                 let closed = false, dirty = true;
-                flush = () => {
+                flush = (updateFor) => {
                     if (closed || !dirty || (controller.desiredSize ?? 0) <= 0)
                         return;
                     dirty = false;
-                    controller.enqueue(encoder.encode(`event: snapshot\ndata: ${JSON.stringify({ version: 1, traces: recorder.snapshot(session) })}\n\n`));
+                    try {
+                        const update = updateFor(session, incremental, cursor);
+                        controller.enqueue(update.bytes);
+                        cursor = update.revision;
+                    }
+                    catch {
+                        // Deferred observer failures must not escape into the application's
+                        // event loop or prevent other viewers from receiving their update.
+                        cleanup();
+                    }
+                };
+                wake = () => {
+                    if (!closed && dirty && (controller.desiredSize ?? 0) > 0)
+                        schedule(flush);
                 };
-                const unsubscribe = recorder.subscribe(() => {
+                const unsubscribe = recorder.subscribe((sessions) => {
+                    if (!sessions.has(session))
+                        return;
                     dirty = true;
-                    flush();
+                    wake();
                 });
                 const heartbeat = setInterval(() => {
                     if (!closed && (controller.desiredSize ?? 0) > 0)
@@ -77,6 +215,7 @@ export function createJevDevtools(options) {
                         return;
                     closed = true;
                     unsubscribe();
+                    unschedule(flush);
                     clearInterval(heartbeat);
                     request.signal.removeEventListener("abort", cleanup);
                     streams.delete(cleanup);
@@ -92,10 +231,12 @@ export function createJevDevtools(options) {
                 if (request.signal.aborted)
                     cleanup();
                 else
-                    flush();
+                    flush(encodeUpdate);
             },
             pull() {
-                flush();
+                // Reading must not bypass the batching boundary. A full queue retains
+                // only a dirty flag; the next readable turn delivers current history.
+                wake();
             },
             cancel() {
                 cleanup();
@@ -139,7 +280,20 @@ export function createJevDevtools(options) {
                 res.destroy();
         }
     }
+    const startFlow = (definition, run) => {
+        if (!enabled())
+            return;
+        flows.start(definition, run, scope.getStore() ?? "local");
+        return {
+            update: (next) => {
+                if (enabled())
+                    flows.update(next);
+            },
+            request: (link, onTrace, callback) => recorder.withFlow(link, onTrace, callback),
+        };
+    };
     return {
+        startFlow,
         handle,
         /**
          * For Node framework routes whose Request URL uses an internal hostname.

package/lib/server/recorder.d.ts

@@ -1,19 +1,29 @@
 import { TypeSafeClient } from "@typesafe-ai/sdk";
 import type { Fetch } from "@typesafe-ai/sdk";
-import type { Trace } from "../src/protocol.js";
+import type { Json, Trace } from "../src/protocol.js";
 export type CaptureOptions = {
     limit?: number;
     redact?: (path: string[], value: unknown) => unknown;
 };
+export declare function capture(value: unknown, warnings: Set<string>, redact?: CaptureOptions["redact"]): Json;
 export declare class JevRecorder {
     private options;
     private traces;
     private listeners;
+    private revision;
+    private revisions;
     private context;
+    private flowContext;
+    withFlow<T>(link: NonNullable<Trace["flow"]>, onTrace: (id: string) => void, callback: () => T): T;
     private limit;
     constructor(options?: CaptureOptions);
     snapshot(session: string): Trace[];
-    subscribe(listener: () => void): () => void;
+    changes(session: string, after?: number): {
+        revision: number;
+        order: string[];
+        upserts: Trace[];
+    };
+    subscribe(listener: (sessions: ReadonlySet<string>) => void): () => void;
     clear(session: string): void;
     private notify;
     private update;

package/lib/server/recorder.js

@@ -5,7 +5,7 @@ const secretKey = /^(authorization|cookie|set-cookie|api[-_]?key|password|secret
 const safeMessage = (value) => value.replace(/Bearer\s+\S+/gi, "Bearer [redacted]").slice(0, 500);
 // Snapshot before the caller can mutate its request. Bounded and cycle-safe;
 // image handles become explicit previews/references instead of opaque SDK objects.
-function capture(value, warnings, redact) {
+export function capture(value, warnings, redact) {
     const seen = new WeakSet();
     let budget = 96_000;
     const visit = (input, path, depth) => {
@@ -79,7 +79,13 @@ export class JevRecorder {
     options;
     traces = new Map();
     listeners = new Set();
+    revision = 0;
+    revisions = new WeakMap();
     context = new AsyncLocalStorage();
+    flowContext = new AsyncLocalStorage();
+    withFlow(link, onTrace, callback) {
+        return this.flowContext.run({ link, onTrace }, callback);
+    }
     limit;
     constructor(options = {}) {
         this.options = options;
@@ -88,6 +94,18 @@ export class JevRecorder {
     snapshot(session) {
         return structuredClone([...this.traces.values()].filter((t) => t.session === session).reverse());
     }
+    // Only changed payloads are cloned. IDs/order are bounded by the retained
+    // history; no tombstone log or per-session history cache is needed.
+    changes(session, after) {
+        const current = [...this.traces.values()]
+            .filter((t) => t.session === session)
+            .reverse();
+        return {
+            revision: this.revision,
+            order: current.map((t) => t.id),
+            upserts: structuredClone(current.filter((t) => after === undefined || this.revisions.get(t) > after)),
+        };
+    }
     subscribe(listener) {
         this.listeners.add(listener);
         return () => {
@@ -95,15 +113,21 @@ export class JevRecorder {
         };
     }
     clear(session) {
+        let changed = false;
         for (const [id, t] of this.traces)
-            if (t.session === session)
+            if (t.session === session) {
                 this.traces.delete(id);
-        this.notify();
+                changed = true;
+            }
+        if (changed) {
+            this.revision++;
+            this.notify(new Set([session]));
+        }
     }
-    notify() {
+    notify(sessions) {
         for (const listener of this.listeners) {
             try {
-                listener();
+                listener(sessions);
             }
             catch {
                 /* Observers must not affect inference. */
@@ -114,7 +138,8 @@ export class JevRecorder {
         const t = this.traces.get(id);
         if (t) {
             update(t);
-            this.notify();
+            this.revisions.set(t, ++this.revision);
+            this.notify(new Set([t.session]));
         }
     }
     // Use this in TypeSafeClient's supported `fetch` option. It observes attempts
@@ -175,15 +200,28 @@ export class JevRecorder {
                         version: 1,
                         id,
                         ...(typeof meta === "function" ? meta() : meta),
+                        flow: this.flowContext.getStore()?.link,
                         startedAt: Date.now(),
                         status: "pending",
                         request: captured,
                         attempts: [],
                         captureWarnings: [...warnings],
                     });
-                    while (this.traces.size > this.limit)
-                        this.traces.delete(this.traces.keys().next().value);
-                    this.notify();
+                    const trace = this.traces.get(id);
+                    try {
+                        this.flowContext.getStore()?.onTrace(id);
+                    }
+                    catch {
+                        /* Observer only. */
+                    }
+                    this.revisions.set(trace, ++this.revision);
+                    const sessions = new Set([trace.session]);
+                    while (this.traces.size > this.limit) {
+                        const oldest = this.traces.values().next().value;
+                        sessions.add(oldest.session);
+                        this.traces.delete(oldest.id);
+                    }
+                    this.notify(sessions);
                     const fail = (error) => this.update(id, (t) => {
                         const e = error;
                         t.status = e.name === "APIUserAbortError" ? "cancelled" : "error";

package/lib/src/ChoiceProbabilities.d.ts

@@ -0,0 +1,4 @@
+import type { AnswerView } from "./protocol.js";
+export declare function ChoiceProbabilities({ answer }: {
+    answer: AnswerView;
+}): import("react").JSX.Element;

package/lib/src/ChoiceProbabilities.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+export function ChoiceProbabilities({ answer }) {
+    const [search, setSearch] = useState("");
+    const [page, setPage] = useState(0);
+    const rows = useMemo(() => Object.entries(answer.probabilities ?? {}).sort((a, b) => b[1] - a[1]), [answer.probabilities]);
+    const filtered = useMemo(() => {
+        const query = search.trim().toLocaleLowerCase();
+        return rows.filter(([label]) => label.toLocaleLowerCase().includes(query));
+    }, [rows, search]);
+    const pages = Math.max(1, Math.ceil(filtered.length / 20));
+    const current = Math.min(page, pages - 1);
+    return (_jsxs("div", { className: "lab-choice-browser", role: "region", "aria-label": "All Choice probabilities", "data-diagram-scroll": "", children: [_jsxs("div", { className: "lab-choice-controls", children: [_jsxs("label", { children: ["Search categories", _jsx("input", { autoFocus: true, type: "search", value: search, onChange: (event) => {
+                                    setSearch(event.target.value);
+                                    setPage(0);
+                                } })] }), _jsxs("span", { role: "status", children: [filtered.length, " of ", rows.length, " categories \u00B7 highest probability first"] })] }), _jsxs("div", { className: "lab-choice-table-scroll", tabIndex: 0, "aria-label": "Probability table", children: [_jsxs("table", { children: [_jsxs("caption", { children: ["Captured probabilities. Values are not renormalized. Returned choice: ", answer.choice ?? "unavailable", "."] }), _jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { scope: "col", children: "Category" }), _jsx("th", { scope: "col", children: "Probability" }), _jsx("th", { scope: "col", children: "Exact value (0\u20131)" })] }) }), _jsx("tbody", { children: filtered
+                                    .slice(current * 20, (current + 1) * 20)
+                                    .map(([label, value]) => (_jsxs("tr", { children: [_jsxs("th", { scope: "row", children: [label, label === answer.choice && (_jsx("span", { className: "lab-choice-returned", children: "Returned choice" }))] }), _jsxs("td", { children: [Number((value * 100).toPrecision(6)), "%"] }), _jsx("td", { children: _jsx("code", { children: String(value) }) })] }, label))) })] }), !filtered.length && _jsx("p", { children: "No matching categories." })] }), _jsxs("div", { className: "lab-choice-pagination", children: [_jsx("button", { disabled: current === 0, onClick: () => setPage(current - 1), children: "Previous categories" }), _jsxs("span", { "aria-live": "polite", children: ["Page ", current + 1, " of ", pages] }), _jsx("button", { disabled: current + 1 >= pages, onClick: () => setPage(current + 1), children: "Next categories" })] })] }));
+}

package/lib/src/ConnectedInspector.js

@@ -1,7 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useState } from "react";
+import { memo, useCallback, useEffect, useRef, useState } from "react";
 import { JevPanel } from "./JevDevtools.js";
 import { JevDrawer } from "./JevDrawer.js";
+import { connectTraceStream } from "./trace-stream.js";
+import { connectFlowStream, emptyFlows, } from "./flow-stream.js";
+const RetainedPanel = memo(JevPanel);
 function endpointUrl(endpoint) {
     const url = new URL(endpoint, window.location.origin);
     if (url.origin !== window.location.origin ||
@@ -13,12 +16,39 @@ function endpointUrl(endpoint) {
     return url.href.replace(/\/$/, "");
 }
 export default function ConnectedInspector({ endpoint = "/api/jev-devtools", defaultOpen = true, }) {
-    const [traces, setTraces] = useState([]), [connection, setConnection] = useState("connecting");
+    const [open, setOpen] = useState(defaultOpen);
+    const [visited, setVisited] = useState(defaultOpen);
+    const visible = useRef(defaultOpen);
+    const latest = useRef({
+        traces: [],
+        connection: "connecting",
+        flows: emptyFlows,
+    });
+    const [snapshot, setSnapshot] = useState(latest.current);
+    const toggle = (value) => {
+        visible.current = value;
+        setOpen(value);
+        if (value) {
+            setVisited(true);
+            setSnapshot(latest.current);
+        }
+    };
     useEffect(() => {
-        let alive = true, events;
+        let alive = true, disconnect = () => { }, disconnectFlows = () => { };
         const abort = new AbortController();
-        setTraces([]);
-        setConnection("connecting");
+        // Keep capture current while closed without scheduling React work. Reopening
+        // publishes only the latest snapshot; the retained panel keeps its UI state.
+        const update = (patch) => {
+            const next = { ...latest.current, ...patch };
+            if (next.traces === latest.current.traces &&
+                next.connection === latest.current.connection &&
+                next.flows === latest.current.flows)
+                return;
+            latest.current = next;
+            if (visible.current)
+                setSnapshot(latest.current);
+        };
+        update({ traces: [], connection: "connecting", flows: emptyFlows });
         void (async () => {
             try {
                 const url = endpointUrl(endpoint);
@@ -35,44 +65,31 @@ export default function ConnectedInspector({ endpoint = "/api/jev-devtools", def
                     throw new Error("Unsupported inspector endpoint");
                 if (!alive)
                     return;
-                events = new EventSource(url + "/events");
-                events.addEventListener("snapshot", (event) => {
-                    if (!alive)
-                        return;
-                    try {
-                        const data = JSON.parse(event.data);
-                        if (data.version !== 1 || !Array.isArray(data.traces))
-                            throw new Error();
-                        setTraces(data.traces);
-                        setConnection("connected");
-                    }
-                    catch {
-                        setConnection("Invalid inspector update");
-                    }
-                });
-                events.onerror = () => {
-                    if (alive)
-                        setConnection("reconnecting");
-                };
+                if (config.flows)
+                    disconnectFlows = connectFlowStream(url, (flows) => update({ flows }));
+                disconnect = connectTraceStream(url, (traces) => update({ traces }), (connection) => update({ connection }));
             }
             catch (error) {
                 if (alive)
-                    setConnection(error instanceof Error ? error.message : "Inspector unavailable");
+                    update({
+                        connection: error instanceof Error ? error.message : "Inspector unavailable",
+                    });
             }
         })();
         return () => {
             alive = false;
             abort.abort();
-            events?.close();
+            disconnect();
+            disconnectFlows();
         };
     }, [endpoint]);
-    async function clear() {
+    const clear = useCallback(async () => {
         const response = await fetch(endpointUrl(endpoint) + "/clear", {
             method: "DELETE",
             credentials: "same-origin",
         });
         if (!response.ok)
             throw new Error(`Cannot clear history (${response.status})`);
-    }
-    return (_jsx(JevDrawer, { defaultOpen: defaultOpen, children: _jsx(JevPanel, { traces: traces, connection: connection, onClear: clear }) }));
+    }, [endpoint]);
+    return (_jsx(JevDrawer, { open: open, onOpenChange: toggle, children: visited && _jsx(RetainedPanel, { ...snapshot, onClear: clear }) }));
 }

package/lib/src/DiagramContent.d.ts

@@ -0,0 +1,6 @@
+import type { Json } from "./protocol.js";
+/** Bounded, lazy property rendering inside a fixed-size diagram card. */
+export declare const DiagramContent: import("react").MemoExoticComponent<({ value, label, }: {
+    value: Json | undefined;
+    label: string;
+}) => import("react").JSX.Element>;