@theoremjs/studio 0.0.0-stage → 0.3.2

package/ui/guardrail-tester.js

@@ -0,0 +1,248 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Banner } from '@astryxdesign/core/Banner';
+import { Button } from '@astryxdesign/core/Button';
+import { Collapsible, CollapsibleGroup } from '@astryxdesign/core/Collapsible';
+import { HoverCard } from '@astryxdesign/core/HoverCard';
+import { HStack } from '@astryxdesign/core/HStack';
+import { Icon } from '@astryxdesign/core/Icon';
+import { IconButton } from '@astryxdesign/core/IconButton';
+import { Item } from '@astryxdesign/core/Item';
+import { ScrollableArea } from '@astryxdesign/core/ScrollableArea';
+import { StackItem } from '@astryxdesign/core/Stack';
+import { Text } from '@astryxdesign/core/Text';
+import { TextArea } from '@astryxdesign/core/TextArea';
+import { Token } from '@astryxdesign/core/Token';
+import { Tooltip } from '@astryxdesign/core/Tooltip';
+import { VStack } from '@astryxdesign/core/VStack';
+import { IconArrowLeft, IconBiohazard, IconBraces, IconBrain, IconEye, IconEyeOff, IconFileText, IconHandStop, IconHistory, IconInfoCircle, IconListDetails, IconMessage, IconPlaylistAdd, IconShield, IconShieldSearch, IconTool, IconUser, IconWorld, IconX, } from '@tabler/icons-react';
+import { PaneLayout, PanePanel, PaneState, Prose, TraceGuardrailsView } from '@theoremjs/react/ui';
+import { useContext, useState } from 'react';
+import { PROBE_BATTERY, PROBE_BOUNDARY_NOTES, PROBE_STATUSES, probeDraft, probeRefusal, sectionNote, } from "../mod.js";
+import { InspectorSection } from "./inspector.js";
+import { ProbedAgent } from "./inspector-context.js";
+import { screenEndpoint } from "./lib/project-address.js";
+const BOUNDARY_ICONS = {
+    user: IconUser,
+    history: IconHistory,
+    system: IconFileText,
+    tool_result_local: IconTool,
+    tool_result_remote: IconWorld,
+    tool_arguments: IconBraces,
+    reply: IconMessage,
+    thought: IconBrain,
+};
+/** Sends `text` across the draft's boundaries; given `only`, read with that detector alone. */
+async function sendProbe(payload, text, only) {
+    try {
+        const response = await fetch(`${screenEndpoint()}/probe`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ ...probeDraft(payload), text, only }),
+        });
+        const body = await response.json();
+        if (response.ok && 'answers' in body)
+            return { answers: body.answers };
+        return { error: ('error' in body && body.error) || "The probe didn't run." };
+    }
+    catch {
+        return { error: "Couldn't reach the studio server." };
+    }
+}
+/** A status as its token: the label, colour, and icon the trace's guardrail checks wear. */
+const STATUS_TOKENS = {
+    passed: { label: 'Passed', color: 'green', icon: IconEye },
+    flagged: { label: 'Flagged', color: 'blue', icon: IconInfoCircle },
+    redacted: { label: 'Redacted', color: 'orange', icon: IconEyeOff },
+    blocked: { label: 'Blocked', color: 'red', icon: IconHandStop },
+};
+function StatusToken({ status, count }) {
+    const { label, color, icon } = STATUS_TOKENS[status];
+    return (_jsx(Token, { label: count === undefined ? label : `${label} ${String(count)}`, color: color, icon: _jsx(Icon, { icon: icon, size: "sm" }) }));
+}
+/** What one boundary's guardrails did, and whether its turn was tainted by what it read. */
+function Verdict({ answer }) {
+    return (_jsxs(HStack, { gap: 1, wrap: "wrap", children: [_jsx(StatusToken, { status: answer.status }), answer.taint && (_jsx(Token, { label: answer.taint === 'steered' ? 'Steered' : 'Tainted', color: "yellow", icon: _jsx(Icon, { icon: IconBiohazard, size: "sm" }) }))] }));
+}
+/** A sent text's answers in short: how many boundaries did each thing, strongest first. */
+function Tally({ sent }) {
+    const { answers } = sent;
+    if (!answers)
+        return _jsx(Token, { label: sent.error ?? '', color: "gray" });
+    return (_jsx(HStack, { gap: 1, wrap: "wrap", children: PROBE_STATUSES.toReversed().map((status) => {
+            const count = answers.filter((answer) => answer.status === status).length;
+            return count > 0 && _jsx(StatusToken, { status: status, count: count }, status);
+        }) }));
+}
+/** Who reads the text once it is past `boundary`. */
+function passedLabel(boundary) {
+    if (boundary === 'reply' || boundary === 'thought')
+        return 'The user got';
+    return boundary === 'tool_arguments' ? 'The tool got' : 'The model read';
+}
+/**
+ * A boundary on hover, as the editor's field labels show a field: what crosses it, then when the
+ * kernel reads it and what the kernel does there.
+ */
+function BoundaryCard({ boundary, children }) {
+    const { label, note, when, checks } = PROBE_BOUNDARY_NOTES[boundary];
+    return (_jsx(HoverCard, { label: label, content: _jsxs(VStack, { gap: 2, maxWidth: 280, children: [_jsx(Text, { children: note }), _jsx(HStack, { gap: 1, wrap: "wrap", children: _jsx(Token, { label: label, size: "sm" }) }), _jsx(Text, { color: "secondary", children: when }), _jsx(Text, { color: "secondary", children: checks })] }), children: children }));
+}
+/** A rule id as a phrase: `detect.injection` reads "Injection". */
+function ruleName(rule) {
+    const name = (rule.split('.').at(-1) ?? rule).replaceAll(/[_-]/g, ' ');
+    return name.charAt(0).toUpperCase() + name.slice(1);
+}
+/** What exactly the guardrails matched, each hit with the text it matched and what was done with it. */
+function Flagged({ answer }) {
+    const hits = answer.guardrails.flatMap((event) => event.hits.map((hit) => ({ hit, action: event.action })));
+    if (hits.length === 0)
+        return null;
+    return (_jsx(PanePanel, { title: "Matched", children: _jsx(VStack, { gap: 3, children: hits.map(({ hit, action }, at) => (_jsxs(VStack, { gap: 1, children: [_jsxs(HStack, { gap: 2, align: "center", wrap: "wrap", children: [_jsx(Text, { weight: "medium", children: hit.label ?? ruleName(hit.rule) }), _jsx(Token, { label: hit.severity, size: "sm", color: "gray" }), _jsx(Token, { label: action, size: "sm", color: "gray" })] }), hit.match !== undefined && (_jsx(Text, { type: "supporting", color: "secondary", children: `“${hit.match}”` }))] }, `${hit.rule}-${String(at)}`))) }) }));
+}
+/** The text past its boundary, when anything went on. */
+function Crossed({ answer }) {
+    if (answer.passed === undefined)
+        return null;
+    return (_jsx(PanePanel, { title: passedLabel(answer.boundary), children: _jsx(Prose, { text: answer.passed }) }));
+}
+/** The way out of a view: back to the tester, or closing it when it opened on its own. */
+function BackButton({ isClose, onBack }) {
+    return (_jsx(HStack, { children: _jsx(Button, { label: isClose ? 'Close' : 'Back', variant: "ghost", size: "sm", icon: _jsx(Icon, { icon: isClose ? IconX : IconArrowLeft }), onClick: onBack }) }));
+}
+/** A battery case: what it is and what makes it hard. */
+function BatteryRow({ entry, isDisabled, onSend, }) {
+    return (_jsx(Item, { startContent: _jsx(Icon, { icon: BOUNDARY_ICONS[entry.boundary], size: "sm", color: "secondary" }), label: _jsx(Text, { weight: "medium", maxLines: 1, children: entry.title }), description: _jsx(Text, { type: "supporting", color: "secondary", maxLines: 2, children: entry.why }), align: "start", density: "compact", isDisabled: isDisabled, onClick: onSend }));
+}
+/** The examples in the row: one hard text from each kind of boundary. */
+const ROW_EXAMPLES = [
+    'user.zero_width',
+    'user.split_key',
+    'tool_result_remote.approved',
+    'tool_arguments.base64_key',
+    'reply.image_reference',
+].flatMap((id) => PROBE_BATTERY.filter((entry) => entry.id === id));
+/** The battery as a row of tokens to scroll through, one click to send one; and the ways to all of them. */
+function ExampleRow({ isShown, isDisabled, onShow, onSend, }) {
+    return (_jsxs(HStack, { gap: 2, align: "center", children: [_jsx(StackItem, { size: "fill", children: _jsx(ScrollableArea, { label: "Examples", axis: "inline", className: "scrollbar-none", children: _jsx(HStack, { gap: 1, children: ROW_EXAMPLES.map((entry) => (_jsx(Token, { label: entry.title, size: "sm", description: entry.why, isDisabled: isDisabled, onClick: () => {
+                                onSend([entry.text]);
+                            } }, entry.id))) }) }) }), _jsx(StackItem, { size: "static", children: _jsxs(HStack, { gap: 1, children: [_jsx(IconButton, { label: isShown ? 'Hide all examples' : 'Show all examples', tooltip: isShown ? 'Hide all examples' : 'Show all examples', variant: "ghost", size: "sm", icon: _jsx(Icon, { icon: IconListDetails, size: "sm" }), "aria-pressed": isShown, onClick: onShow }), _jsx(IconButton, { label: "Load all examples", tooltip: "Load all examples", variant: "ghost", size: "sm", icon: _jsx(Icon, { icon: IconPlaylistAdd, size: "sm" }), isDisabled: isDisabled, onClick: () => {
+                                onSend(PROBE_BATTERY.map((entry) => entry.text));
+                            } })] }) })] }));
+}
+/** The battery's texts, beside the results or in their place; one click sends one. */
+function Examples({ isClose, isDisabled, onBack, onSend, }) {
+    return (_jsx(VStack, { padding: 4, children: _jsxs(VStack, { gap: 4, children: [_jsxs(VStack, { gap: 2, children: [_jsx(BackButton, { isClose: isClose, onBack: onBack }), _jsx(Item, { startContent: _jsx(Icon, { icon: IconShieldSearch, size: "sm", color: "secondary" }), label: _jsx(Text, { weight: "semibold", children: "Examples" }), align: "start" })] }), _jsx(VStack, { gap: 0, children: PROBE_BATTERY.map((entry) => (_jsx(BatteryRow, { entry: entry, isDisabled: isDisabled, onSend: () => {
+                            onSend([entry.text]);
+                        } }, entry.id))) })] }) }));
+}
+/** A row of the sent list: the text and its answers in short. */
+function SentRow({ sent, onOpen }) {
+    return (_jsx(Item, { startContent: _jsx(Icon, { icon: IconShield, size: "sm", color: "secondary" }), label: _jsx(Text, { weight: "medium", maxLines: 1, children: sent.text }), description: _jsx(Tally, { sent: sent }), align: "start", density: "compact", onClick: onOpen }));
+}
+/** A boundary of an open text: where it went in and what the guardrails did there. */
+function AnswerRow({ answer, onOpen }) {
+    return (_jsx(Item, { startContent: _jsx(Icon, { icon: BOUNDARY_ICONS[answer.boundary], size: "sm", color: "secondary" }), label: _jsx(BoundaryCard, { boundary: answer.boundary, children: _jsx(Text, { weight: "medium", children: PROBE_BOUNDARY_NOTES[answer.boundary].label }) }), endContent: _jsx(Verdict, { answer: answer }), density: "compact", onClick: onOpen }));
+}
+/** An open text: the way back, the text as sent, and each boundary's answer. */
+function SentOverview({ sent, onBack, onOpen, }) {
+    return (_jsxs(VStack, { gap: 5, padding: 4, children: [_jsxs(VStack, { gap: 4, children: [_jsx(HStack, { children: _jsx(Button, { label: "All probes", variant: "ghost", size: "sm", icon: _jsx(Icon, { icon: IconArrowLeft }), onClick: onBack }) }), sent.error && _jsx(Banner, { status: "error", title: sent.error }), _jsx(PanePanel, { title: "Sent", children: _jsx(Prose, { text: sent.text }) })] }), sent.answers && (_jsxs(VStack, { gap: 2, children: [_jsx(Text, { weight: "semibold", children: "Boundaries" }), _jsx(VStack, { gap: 0, children: sent.answers.map((answer) => (_jsx(AnswerRow, { answer: answer, onOpen: () => {
+                                onOpen(answer.boundary);
+                            } }, answer.boundary))) })] }))] }));
+}
+/** What leads one boundary's answer: the way back, the boundary, and its answer, and what got through. */
+function AnswerHead({ answer, isClose, onBack, }) {
+    const { label, checks } = PROBE_BOUNDARY_NOTES[answer.boundary];
+    return (_jsxs(VStack, { gap: 4, children: [_jsxs(VStack, { gap: 2, children: [_jsx(BackButton, { isClose: isClose, onBack: onBack }), _jsx(Item, { startContent: _jsx(Icon, { icon: BOUNDARY_ICONS[answer.boundary], size: "sm", color: "secondary" }), label: _jsx(Text, { weight: "semibold", children: label }), description: checks, align: "start" }), _jsx(Verdict, { answer: answer }), answer.refused?.message && _jsx(Text, { color: "secondary", children: answer.refused.message })] }), _jsx(Flagged, { answer: answer }), _jsx(Crossed, { answer: answer })] }));
+}
+/**
+ * Sends texts across every guardrail boundary of the compiled agent and lists what its guardrails
+ * did with each, newest first. A sent text opens on its boundaries, and a boundary on what its
+ * trace says of guardrails. The model is scripted, so a probe spends no key.
+ */
+export function GuardrailTester({ payload, isWide, }) {
+    const [text, setText] = useState('');
+    const [busy, setBusy] = useState(false);
+    const [sent, setSent] = useState([]);
+    const [openId, setOpenId] = useState(null);
+    const [boundary, setBoundary] = useState(null);
+    const [examples, setExamples] = useState(false);
+    const refusal = probeRefusal(payload.profile);
+    if (refusal) {
+        return (_jsx(PaneState, { icon: _jsx(Icon, { icon: IconShieldSearch, size: "lg", color: "secondary" }), title: refusal }));
+    }
+    const send = async (texts) => {
+        if (busy)
+            return;
+        setBusy(true);
+        for (const each of texts) {
+            const outcome = await sendProbe(payload, each);
+            setSent((before) => [{ id: before.length, text: each, ...outcome }, ...before]);
+        }
+        setBusy(false);
+    };
+    const open = sent.find((entry) => entry.id === openId);
+    if (open) {
+        const answer = open.answers?.find((candidate) => candidate.boundary === boundary);
+        return (_jsx(PaneLayout, { isWide: isWide, label: "Test guardrails", detailLabel: answer ? PROBE_BOUNDARY_NOTES[answer.boundary].label : '', overview: _jsx(SentOverview, { sent: open, onBack: () => {
+                    setOpenId(null);
+                    setBoundary(null);
+                }, onOpen: setBoundary }), detail: answer && (_jsx(TraceGuardrailsView, { records: answer.traces, head: _jsx(AnswerHead, { answer: answer, isClose: isWide, onBack: () => {
+                        setBoundary(null);
+                    } }) })) }));
+    }
+    const probe = text.trim();
+    const overview = (_jsxs(VStack, { gap: 5, padding: 4, children: [_jsx(Text, { weight: "semibold", children: "Test guardrails" }), _jsxs(VStack, { gap: 3, children: [_jsx(ExampleRow, { isShown: examples, isDisabled: busy, onShow: () => {
+                            setExamples(!examples);
+                        }, onSend: (texts) => {
+                            void send(texts);
+                        } }), _jsx(TextArea, { label: "Text", isLabelHidden: true, size: "sm", rows: 3, placeholder: "Sent across every boundary", value: text, onChange: setText }), _jsx(HStack, { hAlign: "end", children: _jsx(Button, { label: "Send", variant: "primary", isLoading: busy, isDisabled: !probe, onClick: () => {
+                                void send([probe]);
+                            } }) })] }), sent.length > 0 && (_jsxs(VStack, { gap: 2, children: [_jsx(Text, { weight: "semibold", children: "Sent" }), _jsx(VStack, { gap: 0, children: sent.map((entry) => (_jsx(SentRow, { sent: entry, onOpen: () => {
+                                setOpenId(entry.id);
+                            } }, entry.id))) })] }))] }));
+    return (_jsx(PaneLayout, { isWide: isWide, label: "Test guardrails", detailLabel: "Examples", overview: overview, detail: examples && (_jsx(Examples, { isClose: isWide, isDisabled: busy, onBack: () => {
+                setExamples(false);
+            }, onSend: (texts) => {
+                // Narrow, the examples sit over the results: sending one shows them again.
+                if (!isWide)
+                    setExamples(false);
+                void send(texts);
+            } })) }));
+}
+/** Why a sample can't be sent to `payload` yet, or undefined when it can. */
+function unsendable(payload) {
+    return payload ? probeRefusal(payload.profile) : 'Fix the issues first';
+}
+/** One detector's answers: each boundary it reads, and behind it what the trace says and what crossed. */
+function ScopedAnswers({ answers }) {
+    if (answers.length === 0) {
+        return (_jsx(Text, { type: "supporting", color: "secondary", children: sectionNote('detect.try.off') }));
+    }
+    return (_jsx(CollapsibleGroup, { type: "multiple", density: "compact", children: answers.map((answer) => (_jsx(Collapsible, { value: answer.boundary, trigger: _jsxs(HStack, { gap: 2, align: "center", justify: "between", children: [_jsxs(HStack, { gap: 2, align: "center", children: [_jsx(Icon, { icon: BOUNDARY_ICONS[answer.boundary], size: "sm", color: "secondary" }), _jsx(BoundaryCard, { boundary: answer.boundary, children: _jsx(Text, { type: "supporting", children: PROBE_BOUNDARY_NOTES[answer.boundary].label }) })] }), _jsx(Verdict, { answer: answer })] }), children: _jsx(TraceGuardrailsView, { records: answer.traces, head: _jsxs(VStack, { gap: 4, children: [_jsx(Flagged, { answer: answer }), _jsx(Crossed, { answer: answer })] }) }) }, answer.boundary))) }));
+}
+/**
+ * The tester from a detector's page: the same probe of the open agent, read with the detector
+ * `only` alone. An answer shows for the sample and the draft it was sent with, and goes when
+ * either changes.
+ */
+export function DetectorTester({ only }) {
+    const payload = useContext(ProbedAgent);
+    const [text, setText] = useState('');
+    const [busy, setBusy] = useState(false);
+    const [tried, setTried] = useState(null);
+    const probe = text.trim();
+    const blocked = unsendable(payload);
+    const shown = tried && tried.payload === payload && tried.text === probe ? tried : null;
+    const send = async () => {
+        if (!payload || busy)
+            return;
+        setBusy(true);
+        const outcome = await sendProbe(payload, probe, only);
+        setTried({ payload, text: probe, ...outcome });
+        setBusy(false);
+    };
+    const button = (_jsx(Button, { label: "Send", size: "sm", isLoading: busy, isDisabled: !probe || blocked !== undefined, onClick: () => {
+            void send();
+        } }));
+    return (_jsxs(InspectorSection, { title: "Try it", note: sectionNote('detect.try'), children: [_jsx(TextArea, { label: "Sample text", isLabelHidden: true, size: "sm", rows: 3, placeholder: "Sent across each boundary this detector reads", value: text, onChange: setText }), _jsx(HStack, { hAlign: "end", children: blocked ? _jsx(Tooltip, { content: blocked, children: button }) : button }), shown?.error && _jsx(Banner, { status: "error", title: shown.error }), shown?.answers && _jsx(ScopedAnswers, { answers: shown.answers })] }));
+}

package/ui/inspector-context.d.ts

@@ -0,0 +1,119 @@
+import type { InputStatus } from '@astryxdesign/core/Field';
+import { type NodeOrigins, type StudioAsks, type StudioIssue, type StudioProvider, type StudioRunPayload, type StudioRunsOn, type WriteAsk } from '../mod.ts';
+import type { SettingOrigin } from '../server/save-wire.ts';
+/** The compile issues for the node being edited; rows show the ones on their field. */
+export declare const NodeIssues: import("react").Context<readonly StudioIssue[]>;
+/**
+ * Looks up the error status for a draft field of the node being edited, and for a list field, the
+ * entry at `index`. Several issues on one field show as one message.
+ */
+export declare function useFieldStatus(): (field?: string, index?: number) => InputStatus | undefined;
+/**
+ * The open node's settings that the project's files set in code, and how to see one in the
+ * builder's editor. `null` when no project is open, or the files do not hold the node.
+ */
+export declare const RowOrigins: import("react").Context<{
+    scope: NodeOrigins;
+    open: (origin: SettingOrigin) => void;
+} | null>;
+/**
+ * Asks the builder before a real run of a tool that writes, and answers whether to run it. Where
+ * no page mounts the question, the run is refused.
+ */
+export declare const ConfirmWrite: import("react").Context<(ask: WriteAsk) => Promise<boolean>>;
+/** The project's tools that write: the ones the studio makes ask, and the ones it cannot. */
+export declare const ProjectAsks: import("react").Context<StudioAsks>;
+/** The origin a section around a row has already named, so the row does not name it again. */
+export declare const SaidOrigin: import("react").Context<SettingOrigin | undefined>;
+/**
+ * The origin of the row or section at a catalog path, when the files set it in code: the studio
+ * shows its value and does not change it. `said` when the editor already says so over the row:
+ * once for the whole node, or on the section the row is in.
+ */
+export declare function useRowOrigin(path: string | undefined): {
+    origin: SettingOrigin;
+    said: boolean;
+    open: () => void;
+} | undefined;
+/**
+ * Called as the builder starts to leave a page inside a node (a detector's page, back to the list);
+ * the function it returns, called once the next page is up, lets the issues left behind show.
+ */
+export declare const LeavePage: import("react").Context<() => () => void>;
+/**
+ * The preview's way to a decision question's page. `open` takes a question's id; `asked` is that id
+ * until the decision editor shows its page and calls `shown`. Outside the builder none is set.
+ */
+export declare const QuestionLink: import("react").Context<{
+    asked?: string;
+    open?: (id: string) => void;
+    shown?: () => void;
+}>;
+/** Marks a row that has an issue, so the issue pill can scroll to it. */
+export declare const ISSUE_ROW_ATTRIBUTE = "data-issue";
+/**
+ * How many of a list row's picks show as badges before the rest are counted: two while the editor
+ * is at its default width or wider, one once it is narrowed.
+ */
+export declare const ListBadges: import("react").Context<number>;
+/** What the studio runs on: the page's lent keys, the builder's own, or their machine. */
+export declare const RunsOn: import("react").Context<StudioRunsOn>;
+export declare const LocalConnection: import("react").Context<Pick<{
+    entries: {
+        id: string;
+        slot: string;
+    }[];
+    setEntries: import("react").Dispatch<import("react").SetStateAction<{
+        id: string;
+        slot: string;
+    }[]>>;
+    localModels: {
+        status: "idle" | "loading" | "ready" | "error";
+        ids: string[];
+        error?: string;
+    };
+    mode: "local" | "demo" | "byok";
+    on: StudioRunsOn;
+    runtime: import("../browser-transport.ts").StudioBrowserRuntime | null;
+    vault: Readonly<Record<string, string | undefined>>;
+    setVault: import("react").Dispatch<import("react").SetStateAction<Readonly<Record<string, string | undefined>>>>;
+    slots: string[];
+    local: {
+        baseUrl: string;
+    };
+    setLocal: import("react").Dispatch<import("react").SetStateAction<{
+        baseUrl: string;
+    }>>;
+    remoteTools: boolean;
+    setRemoteTools: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+}, "local" | "vault" | "localModels" | "setLocal" | "remoteTools" | "setRemoteTools" | "runtime" | "slots"> | null>;
+/** One agent of the workspace, as another agent's pickers name it. */
+export interface WorkspaceAgent {
+    key: string;
+    agentId: string;
+    type: string;
+}
+/**
+ * The workspace around the agent the editor shows: the agents it can name, which of the library's
+ * tools it allows, and, on a project, a way to add or change a provider. `null` when the editor
+ * shows a single draft.
+ */
+export declare const WorkspaceContext: import("react").Context<{
+    agents: readonly WorkspaceAgent[];
+    self: string;
+    allowed: readonly string[];
+    setAllowed: (toolKey: string, allowed: boolean) => void;
+    addProvider: ((provider: StudioProvider) => void) | undefined;
+    /** Puts a changed provider in the workspace; left out where the providers are not the builder's. */
+    updateProvider: ((provider: StudioProvider) => void) | undefined;
+    /** Who else calls `apiId` on the provider `id` besides the open agent's model `bindingKey` (`modelSharers`). */
+    sharing: (bindingKey: string, id: string, apiId: string) => {
+        models: string[];
+        agents: string[];
+    };
+} | null>;
+/**
+ * The agent the editor has open, as it compiles now: what a detector's page sends its sample to.
+ * Null while the draft has issues.
+ */
+export declare const ProbedAgent: import("react").Context<StudioRunPayload | null>;

package/ui/inspector-context.js

@@ -0,0 +1,84 @@
+import { createContext, useContext } from 'react';
+import { ON_OWN_KEYS, rowOrigin, } from "../mod.js";
+// Kept out of inspector.tsx: a hot reload re-runs that module and would orphan these contexts.
+/** The compile issues for the node being edited; rows show the ones on their field. */
+export const NodeIssues = createContext([]);
+/**
+ * Looks up the error status for a draft field of the node being edited, and for a list field, the
+ * entry at `index`. Several issues on one field show as one message.
+ */
+export function useFieldStatus() {
+    const issues = useContext(NodeIssues);
+    return (field, index) => {
+        if (field === undefined)
+            return undefined;
+        const messages = issues
+            .filter((issue) => issue.field === field && issue.index === index)
+            .map((issue) => issue.message);
+        return messages.length ? { type: 'error', message: messages.join(' ') } : undefined;
+    };
+}
+/**
+ * The open node's settings that the project's files set in code, and how to see one in the
+ * builder's editor. `null` when no project is open, or the files do not hold the node.
+ */
+export const RowOrigins = createContext(null);
+/**
+ * Asks the builder before a real run of a tool that writes, and answers whether to run it. Where
+ * no page mounts the question, the run is refused.
+ */
+export const ConfirmWrite = createContext(() => Promise.resolve(false));
+/** The project's tools that write: the ones the studio makes ask, and the ones it cannot. */
+export const ProjectAsks = createContext({ asked: [], inside: [] });
+/** The origin a section around a row has already named, so the row does not name it again. */
+export const SaidOrigin = createContext(undefined);
+/**
+ * The origin of the row or section at a catalog path, when the files set it in code: the studio
+ * shows its value and does not change it. `said` when the editor already says so over the row:
+ * once for the whole node, or on the section the row is in.
+ */
+export function useRowOrigin(path) {
+    const held = useContext(RowOrigins);
+    const above = useContext(SaidOrigin);
+    const origin = held && path !== undefined ? rowOrigin(held.scope, path) : undefined;
+    if (!held || !origin)
+        return undefined;
+    return {
+        origin,
+        said: origin === held.scope.section || origin === held.scope.partly || origin === above,
+        open: () => {
+            held.open(origin);
+        },
+    };
+}
+/**
+ * Called as the builder starts to leave a page inside a node (a detector's page, back to the list);
+ * the function it returns, called once the next page is up, lets the issues left behind show.
+ */
+export const LeavePage = createContext(() => () => undefined);
+/**
+ * The preview's way to a decision question's page. `open` takes a question's id; `asked` is that id
+ * until the decision editor shows its page and calls `shown`. Outside the builder none is set.
+ */
+export const QuestionLink = createContext({});
+/** Marks a row that has an issue, so the issue pill can scroll to it. */
+export const ISSUE_ROW_ATTRIBUTE = 'data-issue';
+/**
+ * How many of a list row's picks show as badges before the rest are counted: two while the editor
+ * is at its default width or wider, one once it is narrowed.
+ */
+export const ListBadges = createContext(1);
+/** What the studio runs on: the page's lent keys, the builder's own, or their machine. */
+export const RunsOn = createContext(ON_OWN_KEYS);
+export const LocalConnection = createContext(null);
+/**
+ * The workspace around the agent the editor shows: the agents it can name, which of the library's
+ * tools it allows, and, on a project, a way to add or change a provider. `null` when the editor
+ * shows a single draft.
+ */
+export const WorkspaceContext = createContext(null);
+/**
+ * The agent the editor has open, as it compiles now: what a detector's page sends its sample to.
+ * Null while the draft has issues.
+ */
+export const ProbedAgent = createContext(null);