@fungi.computer/parakeet 0.3.0 → 0.5.0

package/dist/components/DecisionComposer.js

@@ -0,0 +1,146 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "@fungi.computer/caps/components/button";
+import { Checkbox } from "@fungi.computer/caps/components/checkbox";
+import { KeycapButton } from "@fungi.computer/caps/components/keycap";
+import { Input } from "@fungi.computer/caps/components/input";
+import { Listbox } from "@fungi.computer/caps/components/listbox";
+import { isImeComposing } from "@fungi.computer/caps/lib/ime";
+import { useEffect, useRef } from "react";
+import { useDecision } from "../use-decision.js";
+import { PromptHeader } from "./InteractionPanel.js";
+const kindNames = { question: "Question", approval: "Approval" };
+/**
+ * The composer while the Agent waits on the person: the decision's rows,
+ * an Other line, and Send / Later. It binds one waiting decision to its
+ * reducer and draws the result.
+ */
+export function DecisionComposer({ item, position, total, onLater, takeFocus, }) {
+    const decision = useDecision(item, { position, total, later: onLater });
+    if (decision.view === undefined)
+        return null;
+    return (_jsx(DecisionPanel, { view: decision.view, dispatch: decision.dispatch, onLater: decision.later, takeFocus: takeFocus }));
+}
+/**
+ * Draw Parakeet's decision view with Caps parts and forward keys and clicks as
+ * intents; the rules live in the reducer, so every surface answers alike.
+ */
+export function DecisionPanel({ view, dispatch, onLater, takeFocus, }) {
+    const list = useRef(null);
+    const input = useRef(null);
+    const typing = view.phase === "other";
+    const wasTyping = useRef(false);
+    useEffect(() => {
+        if (takeFocus)
+            list.current?.focus();
+    }, [takeFocus]);
+    useEffect(() => {
+        if (typing)
+            input.current?.focus();
+        else if (wasTyping.current && document.activeElement === input.current)
+            list.current?.focus();
+        wasTyping.current = typing;
+    }, [typing]);
+    const rows = view.rows;
+    const field = view.other;
+    const sending = view.phase === "sending";
+    const act = (event, handled, run) => {
+        if (!handled)
+            return false;
+        event.preventDefault();
+        run();
+        return true;
+    };
+    const onListKey = (event) => {
+        // Keys typed in the Other row's field belong to the field.
+        if (event.target instanceof HTMLInputElement)
+            return;
+        if (isImeComposing(event))
+            return;
+        if (event.ctrlKey || event.metaKey || event.altKey)
+            return;
+        const { key } = event;
+        if (act(event, key === "ArrowDown", () => {
+            dispatch({ type: "move", delta: 1 });
+        }) ||
+            act(event, key === "ArrowUp", () => {
+                dispatch({ type: "move", delta: -1 });
+            }) ||
+            act(event, key === "Enter", () => {
+                dispatch({ type: "enter" });
+            }) ||
+            act(event, key === " ", () => {
+                dispatch({ type: "toggle" });
+            }) ||
+            act(event, key === "Escape", () => {
+                dispatch({ type: "escape" });
+            }) ||
+            act(event, /^[1-9]$/u.test(key), () => {
+                dispatch({ type: "pick", number: Number(key) });
+            }) ||
+            act(event, key.length === 1, () => {
+                dispatch({ type: "append", text: key });
+            }))
+            return;
+    };
+    const onOtherKey = (event) => {
+        if (isImeComposing(event))
+            return;
+        const { key } = event;
+        if (act(event, key === "ArrowDown", () => {
+            dispatch({ type: "move", delta: 1 });
+        }) ||
+            act(event, key === "ArrowUp", () => {
+                dispatch({ type: "move", delta: -1 });
+            }) ||
+            act(event, key === "Enter", () => {
+                dispatch({ type: "enter" });
+            }) ||
+            act(event, key === "Escape", () => {
+                dispatch({ type: "escape" });
+            }))
+            return;
+    };
+    // A multiple decision's marker is a Caps check, not `[x]` text. The row
+    // itself is the control: the option owns aria-selected and the click, so
+    // the check is drawn for sight only.
+    const check = (row) => (_jsx("span", { "aria-hidden": "true", className: "pointer-events-none flex shrink-0", children: _jsx(Checkbox, { checked: row.toggled, readOnly: true, tabIndex: -1 }) }));
+    const words = (row) => (_jsxs("span", { className: "flex flex-col", children: [_jsx("span", { className: row.destructive ? "text-error" : undefined, children: view.multiple ? row.caption : row.text }), row.description === undefined ? null : (_jsx("span", { className: "text-sm opacity-70", children: row.description }))] }));
+    const rowContent = (row) => view.multiple ? (_jsxs("span", { className: "flex items-start gap-xs", children: [check(row), words(row)] })) : (words(row));
+    const picked = rows.find((row) => row.highlighted);
+    return (_jsxs("div", { "aria-label": view.label, className: "parakeet-decision flex flex-col gap-xs p-sm", "data-kind": view.kind, "data-phase": view.phase, role: "group", children: [_jsx(PromptHeader, { request: {
+                    message: view.title,
+                    summary: view.summary,
+                    facts: view.facts,
+                    body: view.body,
+                    bodyLabel: view.bodyLabel,
+                    details: view.details.length === 0 ? undefined : view.details,
+                }, trailing: _jsx("span", { className: "shrink-0 text-sm opacity-70", children: view.counter ?? kindNames[view.kind] }) }), _jsx(Listbox, { "aria-label": view.title, className: "parakeet-decision-list", getKey: (row) => String(row.index), getLabel: (row) => row.label, isDisabled: () => sending, items: rows, rootRef: list, renderItem: (row) => row.kind === "other" && field !== undefined ? (_jsxs("span", { className: "flex items-center gap-xs", "data-highlight": row.highlighted || undefined, "data-row": "other", children: [view.multiple ? check(row) : null, _jsx("span", { className: "shrink-0", children: view.multiple ? row.caption : row.text }), row.highlighted || field.text !== "" ? (_jsx(Input, { "aria-label": field.label, autoComplete: "off", disabled: sending, maxLength: field.maxLength, onChange: (event) => {
+                                dispatch({ type: "type", text: event.target.value });
+                            }, onKeyDown: onOtherKey, placeholder: field.placeholder, ref: input, value: field.text })) : null] })) : (_jsx("span", { "data-highlight": row.highlighted || undefined, children: rowContent(row) })), onKeyDown: onListKey, ...(view.multiple
+                    ? {
+                        multiple: true,
+                        value: rows
+                            .filter((row) => row.toggled)
+                            .map((row) => String(row.index)),
+                        onValueChange: (_value, selected) => {
+                            const clicked = rows.find((row) => selected.some((chosen) => chosen.index === row.index) !==
+                                row.toggled);
+                            if (clicked === undefined)
+                                return;
+                            dispatch({ type: "pick", number: clicked.index + 1 });
+                            if (clicked.kind === "option")
+                                dispatch({ type: "toggle" });
+                        },
+                    }
+                    : {
+                        value: picked === undefined ? null : String(picked.index),
+                        onValueChange: (_value, row) => {
+                            if (row !== null)
+                                dispatch({ type: "pick", number: row.index + 1 });
+                        },
+                    }) }), view.status === undefined ? null : (_jsx("p", { className: view.status.tone === "error"
+                    ? "text-sm text-error"
+                    : "text-sm opacity-70", role: view.status.tone === "error" ? "alert" : "status", children: view.status.text })), _jsxs("div", { className: "parakeet-decision-actions", children: [_jsx(Button, { variant: "ghost", onClick: onLater, children: "Later" }), _jsx(KeycapButton, { disabled: !view.canSend, label: "Send", onClick: () => {
+                            dispatch({ type: "enter" });
+                        }, tone: "primary" })] })] }));
+}

package/dist/components/InteractionPanel.d.ts

@@ -1,4 +1,5 @@
-import type { WhistleInteractionHost } from "@fungi.computer/whistle/interaction";
+import type { WhistleInteractionHost, WhistlePendingPrompt } from "@fungi.computer/whistle/interaction";
+import { type ReactNode } from "react";
 /** The interaction to draw and the page's close callback. */
 export type InteractionPanelProps = Readonly<{
     /** The renderer-neutral interaction store. */
@@ -6,6 +7,14 @@ export type InteractionPanelProps = Readonly<{
     /** Close a settled interaction. */
     onClose?: () => void;
 }>;
+/** The text every prompt carries above its choices. */
+export type PromptContent = Pick<WhistlePendingPrompt["request"], "message" | "summary" | "facts" | "body" | "bodyLabel" | "details">;
+/** Summary, facts, long text and on-demand details: the shared modal anatomy. */
+export declare function PromptHeader({ request, trailing, }: Readonly<{
+    request: PromptContent;
+    /** Drawn at the end of the title line, e.g. a `1 of 3` marker. */
+    trailing?: ReactNode;
+}>): import("react/jsx-runtime").JSX.Element;
 /**
  * Browser renderer for one Whistle interaction. It draws the same host
  * snapshot the terminal draws; the command, not the page, defines the steps.

package/dist/components/InteractionPanel.js

@@ -1,27 +1,46 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Alert } from "@fungi.computer/caps/components/alert";
 import { Button } from "@fungi.computer/caps/components/button";
+import { DataList, DataRow } from "@fungi.computer/caps/components/data-list";
+import { Disclosure } from "@fungi.computer/caps/components/disclosure";
 import { Field } from "@fungi.computer/caps/components/field";
 import { Input } from "@fungi.computer/caps/components/input";
 import { Listbox } from "@fungi.computer/caps/components/listbox";
 import { Status } from "@fungi.computer/caps/components/status";
 import { Display } from "@fungi.computer/caps/components/surface";
-import { useState, useSyncExternalStore } from "react";
+import { useState, useSyncExternalStore, } from "react";
+/** Summary, facts, long text and on-demand details: the shared modal anatomy. */
+export function PromptHeader({ request, trailing, }) {
+    const [open, setOpen] = useState(false);
+    const entries = (list) => list === undefined ? null : (_jsx(DataList, { density: "compact", children: list.map((entry) => (
+        // Facts read as one block of label/value lines, with no rules between.
+        _jsxs(DataRow, { className: "after:hidden", children: [_jsx("span", { className: "text-sm opacity-70", children: entry.label }), " ", _jsx("span", { className: "break-words", children: entry.value })] }, entry.label))) }));
+    return (_jsxs(_Fragment, { children: [trailing === undefined ? (_jsx("p", { className: "font-medium", children: request.message })) : (_jsxs("div", { className: "flex items-baseline justify-between gap-sm", children: [_jsx("p", { className: "font-medium", children: request.message }), trailing] })), request.summary === undefined ? null : (_jsx("p", { className: "text-sm opacity-70", children: request.summary })), entries(request.facts), request.body === undefined ? null : (_jsxs("p", { className: "line-clamp-3 whitespace-pre-line break-words", children: [request.bodyLabel === undefined ? null : (_jsxs("span", { className: "text-sm opacity-70", children: [request.bodyLabel, " "] })), request.body] })), request.details === undefined && request.body === undefined ? null : (_jsxs(Disclosure, { open: open, onOpenChange: setOpen, summary: "Details", children: [request.body === undefined ? null : (_jsx("p", { className: "whitespace-pre-line break-words", children: request.body })), entries(request.details)] }))] }));
+}
 function PromptView({ host, pending, }) {
     const [text, setText] = useState("");
     const request = pending.request;
     if (request.type === "choice")
-        return (_jsxs("div", { className: "flex flex-col gap-xs", children: [_jsx("p", { className: "font-medium", children: request.message }), _jsx(Listbox, { "aria-label": request.message, items: request.options, getKey: (option) => option.value, getLabel: (option) => option.label, onValueChange: (value) => {
+        return (_jsxs("div", { className: "flex flex-col gap-xs", children: [_jsx(PromptHeader, { request: request }), _jsx(Listbox, { "aria-label": request.message, items: request.options, getKey: (option) => option.value, getLabel: (option) => option.label, onValueChange: (value) => {
                         if (value !== null)
                             host.answer(pending.sequence, value);
-                    }, renderItem: (option) => (_jsxs("span", { className: "flex flex-col", children: [_jsx("span", { children: option.label }), option.description === undefined ? null : (_jsx("span", { className: "text-sm opacity-70", children: option.description }))] })) })] }));
+                    }, renderItem: (option) => (_jsxs("span", { className: `flex flex-col${option.destructive === true ? " text-error" : ""}`, children: [_jsxs("span", { children: [option.value === request.current ? "● " : "", option.label] }), option.description === undefined ? null : (_jsx("span", { className: "text-sm opacity-70", children: option.description }))] })) })] }));
     if (request.type === "confirmation")
-        return (_jsxs("div", { className: "flex flex-col gap-sm", children: [_jsx("p", { children: request.message }), _jsxs("div", { className: "flex justify-end gap-xs", children: [_jsx(Button, { variant: "ghost", onClick: () => host.answer(pending.sequence, false), children: request.cancelLabel ?? "Cancel" }), _jsx(Button, { onClick: () => host.answer(pending.sequence, true), children: request.confirmLabel ?? "Confirm" })] })] }));
+        return (_jsxs("div", { className: "flex flex-col gap-sm", children: [_jsx(PromptHeader, { request: request }), _jsxs("div", { className: "flex justify-end gap-xs", children: [_jsx(Button
+                        // A destructive question focuses the safe answer, which comes first.
+                        , { 
+                            // A destructive question focuses the safe answer, which comes first.
+                            autoFocus: request.destructive === true, variant: "ghost", onClick: () => host.answer(pending.sequence, false), children: request.cancelLabel ?? "Cancel" }), _jsx(Button, { variant: request.destructive === true ? "destructive" : "primary", onClick: () => host.answer(pending.sequence, true), children: request.confirmLabel ?? "Confirm" })] })] }));
+    // A decision is answered in the composer; no dialog ever receives one.
+    if (request.type === "decision")
+        return null;
     const submit = (event) => {
         event.preventDefault();
         host.answer(pending.sequence, text);
     };
-    return (_jsxs("form", { className: "flex flex-col gap-sm", onSubmit: submit, children: [_jsx(Field, { label: request.message, children: _jsx(Input, { autoComplete: "off", autoFocus: true, placeholder: request.placeholder, type: request.secret === true ? "password" : "text", value: text, onChange: (event) => {
+    return (_jsxs("form", { className: "flex flex-col gap-sm", onSubmit: submit, children: [request.summary === undefined &&
+                request.facts === undefined &&
+                request.body === undefined ? null : (_jsx(PromptHeader, { request: request })), _jsx(Field, { label: request.message, children: _jsx(Input, { autoComplete: "off", autoFocus: true, placeholder: request.placeholder, type: request.secret === true ? "password" : "text", value: text, onChange: (event) => {
                         setText(event.target.value);
                     } }) }), _jsx("div", { className: "flex justify-end", children: _jsx(Button, { type: "submit", children: "Continue" }) })] }));
 }

package/dist/components/RunFailureNotice.js

@@ -1,6 +1,7 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { Alert } from "@fungi.computer/caps/components/alert";
 import { Button } from "@fungi.computer/caps/components/button";
+import { boundedDiagnostic } from "@fungi.computer/bird-dog/effect";
 const messages = {
     admission: "Your prompt didn’t make it through. Let’s give it another go.",
     failed: "The run stopped. Check the message above before trying again.",
@@ -9,5 +10,13 @@ const messages = {
 };
 /** Session failures do not carry a billing receipt; never promise a refund. */
 export function RunFailureNotice({ failure, cause, onRetry, }) {
-    return (_jsx(Alert, { tone: "warning", title: failure === "cancelled" ? "Taking a breather" : "A little tangle", description: _jsxs(_Fragment, { children: [messages[failure], " If the model didn\u2019t start, there\u2019s no charge. Model work already done can still use credits.", cause ? _jsx("span", { className: "block", children: cause }) : null] }), action: failure === "cancelled" ? undefined : (_jsx(Button, { "aria-label": "Retry prompt", variant: "outline", onClick: onRetry, children: "Retry" })) }));
+    const bounded = cause === undefined ? undefined : boundedDiagnostic(cause);
+    // Diagnostic metadata is useful to the owner, not a public explanation.
+    const publicCause = bounded !== undefined &&
+        !bounded.startsWith("reason_unavailable:") &&
+        !/\b(?:run|session)=/iu.test(bounded)
+        ? bounded
+        : undefined;
+    const interruptedWithReason = failure === "interrupted" && publicCause !== undefined;
+    return (_jsx(Alert, { tone: "warning", title: failure === "cancelled" ? "Taking a breather" : "A little tangle", description: interruptedWithReason ? (_jsxs(_Fragment, { children: ["This turn stopped before it finished: ", publicCause, ". Your prompt is still here."] })) : (_jsxs(_Fragment, { children: [messages[failure], " If the model didn\u2019t start, there\u2019s no charge. Model work already done can still use credits.", publicCause ? _jsx("span", { className: "block", children: publicCause }) : null] })), action: failure === "cancelled" ? undefined : (_jsx(Button, { "aria-label": "Retry prompt", variant: "outline", onClick: onRetry, children: "Retry" })) }));
 }

package/dist/components/SlashMenu.d.ts

@@ -1,7 +1,5 @@
 import type { SlashCommandController } from "../commands/use-slash-commands.js";
-/** Stable id of one slash row, for `aria-activedescendant`. */
-export declare function slashOptionId(listId: string, index: number): string;
-/** The browser slash menu: draws Parakeet's completion rows, nothing more. */
+/** Parakeet's slash adapter: maps its completion rows onto the shared menu. */
 export declare function SlashMenu({ slash, listId, }: Readonly<{
     slash: SlashCommandController;
     listId: string;

package/dist/components/SlashMenu.js

@@ -1,5 +1,5 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { PopoverOption } from "@fungi.computer/caps/components/popover";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { CompletionMenu } from "./CompletionMenu.js";
 /** Split a label into matched and unmatched runs (UTF-16 indices, like the matcher). */
 function emphasize(label, matches) {
     if (matches.length === 0)
@@ -16,13 +16,9 @@ function emphasize(label, matches) {
     }
     return runs.map((run) => run.marked ? (_jsx("mark", { className: "parakeet-slash-match", children: run.text }, run.start)) : (_jsx("span", { children: run.text }, run.start)));
 }
-/** Stable id of one slash row, for `aria-activedescendant`. */
-export function slashOptionId(listId, index) {
-    return `${listId}-${String(index)}`;
-}
-/** The browser slash menu: draws Parakeet's completion rows, nothing more. */
+/** Parakeet's slash adapter: maps its completion rows onto the shared menu. */
 export function SlashMenu({ slash, listId, }) {
-    const { completion, selected } = slash;
+    const { completion } = slash;
     if (completion.kind === "none")
         return null;
     const rows = completion.kind === "commands"
@@ -42,9 +38,5 @@ export function SlashMenu({ slash, listId, }) {
             keys: "",
             disabled: false,
         }));
-    return (_jsxs("div", { className: "parakeet-slash-menu", "data-kind": completion.kind, children: [completion.kind === "arguments" ? (_jsx("p", { className: "parakeet-slash-hint", children: completion.hint })) : null, rows.length === 0 ? null : (_jsx("div", { id: listId, role: "listbox", "aria-label": "Commands", children: rows.map((row, index) => (_jsxs(PopoverOption, { id: slashOptionId(listId, index), active: index === selected, "aria-disabled": row.disabled || undefined, "data-disabled": row.disabled, onMouseEnter: () => {
-                        slash.highlight(index);
-                    }, onClick: () => {
-                        slash.choose(index);
-                    }, children: [_jsx("span", { className: "parakeet-slash-label", children: row.label }), _jsx("span", { className: "parakeet-slash-detail", children: row.detail }), row.keys.length === 0 ? null : (_jsx("kbd", { className: "parakeet-slash-keys", children: row.keys }))] }, row.key))) }))] }));
+    return (_jsx(CompletionMenu, { open: slash.open, rows: rows, selected: slash.selected, listId: listId, label: "Commands", kind: completion.kind, hint: completion.kind === "arguments" ? completion.hint : undefined, onHighlight: slash.highlight, onChoose: slash.choose }));
 }

package/dist/components/TimelineItem.d.ts

@@ -8,6 +8,7 @@ export declare const TimelineItem: import("react").NamedExoticComponent<Readonly
     onCancelQueued?: ((commandId: string) => void) | undefined;
     cancellingQueued?: boolean | undefined;
     renderToolActions?: ((item: ToolItem) => ReactNode) | undefined;
+    claimsToolMedia?: ((item: ToolItem) => boolean) | undefined;
     renderAssistantAttachment?: ((text: string) => ReactNode) | undefined;
     formatAssistantText?: ((text: string) => string) | undefined;
     /** View-only open state for tool groups and calls. */

package/dist/components/TimelineItem.js

@@ -14,7 +14,7 @@ const compactionNoticeLabel = {
     stale: "compaction skipped: the context moved on",
     insufficient: "compaction skipped: the summary would not fit",
 };
-export const TimelineItem = memo(function TimelineItem({ item, onDismissFailed, onCancelQueued, cancellingQueued = false, renderToolActions, renderAssistantAttachment, formatAssistantText, toolDisclosure = initialToolDisclosure, onToggleTool = ignoreToggle, }) {
+export const TimelineItem = memo(function TimelineItem({ item, onDismissFailed, onCancelQueued, cancellingQueued = false, renderToolActions, claimsToolMedia, renderAssistantAttachment, formatAssistantText, toolDisclosure = initialToolDisclosure, onToggleTool = ignoreToggle, }) {
     switch (item.kind) {
         case "user_message": {
             const pending = item.status === "pending" || item.status === "queued";
@@ -44,11 +44,11 @@ export const TimelineItem = memo(function TimelineItem({ item, onDismissFailed,
         case "assistant_message":
             if (!assistantMessageVisible(item))
                 return null;
-            return (_jsxs(_Fragment, { children: [item.author ? (_jsx("div", { className: "px-3 text-xs text-dim", "data-author": item.author.id, children: item.author.name })) : null, _jsx(ChatMessage, { isError: item.isError === true, pending: item.pending, speaker: "agent", ...(item.thinking ? { thinking: item.thinking } : {}), children: formatAssistantText?.(item.text) ?? item.text }), item.isError && item.providerError !== undefined ? (_jsxs("div", { className: "px-3 text-error", "data-provider-error": item.id, children: [_jsx("p", { className: "whitespace-pre-wrap", children: item.providerError }), _jsxs("details", { children: [_jsx("summary", { children: "Provider details" }), _jsx("pre", { className: "whitespace-pre-wrap", children: item.providerError })] })] })) : null, !item.pending && !item.isError
+            return (_jsxs(_Fragment, { children: [item.author ? (_jsx("div", { className: "px-3 text-xs text-dim", "data-author": item.author.id, children: item.author.name })) : null, _jsx(ChatMessage, { isError: item.isError === true, pending: item.pending, speaker: "agent", ...(item.thinking ? { thinking: item.thinking } : {}), children: formatAssistantText?.(item.text) ?? item.text }), item.isError && item.repeatCount !== undefined ? (_jsxs("span", { className: "px-3 text-error", children: ["x", item.repeatCount] })) : null, item.isError && item.errorDetail ? (_jsx("p", { className: "px-3 text-dim", children: item.errorDetail })) : null, item.isError && item.providerError !== undefined ? (_jsx("div", { className: "px-3 text-error", "data-provider-error": item.id, children: _jsxs("details", { children: [_jsx("summary", { children: "Provider details (latest response)" }), _jsx("pre", { className: "whitespace-pre-wrap", children: item.providerError })] }) })) : null, !item.pending && !item.isError
                         ? renderAssistantAttachment?.(item.text)
                         : null] }));
         case "tool_group":
-            return (_jsx(ToolGroup, { disclosure: toolDisclosure, group: item, onToggle: onToggleTool, renderToolActions: renderToolActions }));
+            return (_jsx(ToolGroup, { disclosure: toolDisclosure, group: item, onToggle: onToggleTool, renderToolActions: renderToolActions, claimsToolMedia: claimsToolMedia }));
         case "compaction_divider":
             return (_jsx("div", { className: "divider text-dim my-2 text-xs", role: "separator", children: item.tokensAfter === null
                     ? "compacted · the agent’s memory starts below"

package/dist/components/ToolGroup.d.ts

@@ -9,4 +9,5 @@ export declare const ToolGroup: import("react").NamedExoticComponent<Readonly<{
     disclosure: ToolDisclosureState;
     onToggle: ToggleToolDisclosure;
     renderToolActions?: ((item: ToolItem) => ReactNode) | undefined;
+    claimsToolMedia?: ((item: ToolItem) => boolean) | undefined;
 }>>;

package/dist/components/ToolGroup.js

@@ -53,38 +53,38 @@ function SectionView({ section, full, onShowAll, }) {
         }
     }
 }
-function CallBody({ call, tool, disclosure, onToggle, }) {
+function CallBody({ call, tool, disclosure, onToggle, mediaClaimed, }) {
     const fullId = `${call.id}:full`;
     const full = disclosureOpen(disclosure, fullId, false);
     const showAll = () => {
         onToggle(fullId, false);
     };
-    return (_jsxs("div", { className: "space-y-1.5 py-1.5 pr-2", "data-parakeet-call-body": true, children: [call.error === undefined ? null : (_jsx("p", { className: "not-prose m-0 font-mono text-[11px] text-error", role: "alert", children: call.error })), call.sections.map((section, index) => (_jsx(SectionView, { full: full, onShowAll: showAll, section: section }, `${section.kind}:${String(index)}`))), tool?.result?.content
+    return (_jsxs("div", { className: "space-y-1.5 py-1.5 pr-2", "data-parakeet-call-body": true, children: [call.error === undefined ? null : (_jsx("p", { className: "not-prose m-0 font-mono text-[11px] text-error", role: "alert", children: call.error })), call.sections.map((section, index) => (_jsx(SectionView, { full: full, onShowAll: showAll, section: section }, `${section.kind}:${String(index)}`))), (mediaClaimed ? [] : (tool?.result?.content ?? []))
                 .filter((part) => part.type === "image")
                 .map((part, index) => (_jsx("img", { alt: "Tool result", className: "max-w-full", src: `data:${part.mimeType};base64,${part.data}`, style: { maxHeight: 400 } }, `${call.id}-image-${String(index)}`)))] }));
 }
-function CallRow({ call, tool, disclosureId, size, disclosure, onToggle, renderToolActions, }) {
+function CallRow({ call, tool, disclosureId, size, disclosure, onToggle, renderToolActions, claimsToolMedia, }) {
     const defaultOpen = toolCallDefaultOpen(call);
     const open = disclosureOpen(disclosure, disclosureId, defaultOpen);
     const running = call.status === "running";
     return (_jsxs("div", { "data-parakeet-call": call.kind, "data-status": call.status, children: [_jsx(Disclosure, { leading: _jsx(Sigil, { name: toolKindSigils[call.kind], size: 16 }), onOpenChange: () => {
                     onToggle(disclosureId, defaultOpen);
-                }, open: open, size: size, summary: _jsxs(_Fragment, { children: [_jsx("span", { className: "text-base-content", children: running ? call.activeVerb : call.verb }), " ", _jsx("span", { className: "font-mono", children: call.label })] }), tone: call.status === "error" ? "error" : "neutral", trailing: _jsxs(_Fragment, { children: [call.exitCode === undefined ? null : (_jsxs(Badge, { size: "sm", tone: "error", children: ["exit ", String(call.exitCode)] })), call.durationMs === undefined ? null : (_jsx("span", { children: formatToolDuration(call.durationMs) })), _jsx(Status, { motion: running ? "bounce" : "none", title: call.status === "unknown" ? "result unavailable" : call.status, tone: statusTone(call.status) })] }), children: _jsx(CallBody, { call: call, disclosure: disclosure, onToggle: onToggle, tool: tool }) }), call.status === "completed" && tool?.result !== undefined
+                }, open: open, size: size, summary: _jsxs(_Fragment, { children: [_jsx("span", { className: "text-base-content", children: running ? call.activeVerb : call.verb }), " ", _jsx("span", { className: "font-mono", children: call.label })] }), tone: call.status === "error" ? "error" : "neutral", trailing: _jsxs(_Fragment, { children: [call.exitCode === undefined ? null : (_jsxs(Badge, { size: "sm", tone: "error", children: ["exit ", String(call.exitCode)] })), call.durationMs === undefined ? null : (_jsx("span", { children: formatToolDuration(call.durationMs) })), _jsx(Status, { motion: running ? "bounce" : "none", title: call.status === "unknown" ? "result unavailable" : call.status, tone: statusTone(call.status) })] }), children: _jsx(CallBody, { call: call, disclosure: disclosure, onToggle: onToggle, mediaClaimed: tool !== undefined && claimsToolMedia?.(tool) === true, tool: tool }) }), call.status === "completed" && tool?.result !== undefined
                 ? renderToolActions?.(tool)
                 : null] }));
 }
 /** Recent finished calls, or a live group, with reader-owned disclosure. */
-export const ToolGroup = memo(function ToolGroup({ group, disclosure, onToggle, renderToolActions, }) {
+export const ToolGroup = memo(function ToolGroup({ group, disclosure, onToggle, renderToolActions, claimsToolMedia, }) {
     const defaultOpen = toolGroupDefaultOpen(group);
     const open = disclosureOpen(disclosure, group.id, defaultOpen);
     const running = group.status === "running";
     const active = group.active;
     const single = group.calls.length === 1 ? group.calls[0] : undefined;
     if (single !== undefined)
-        return (_jsx("div", { className: "px-1", children: _jsx(CallRow, { call: single, disclosure: disclosure, disclosureId: single.id, onToggle: onToggle, renderToolActions: renderToolActions, size: "row", tool: group.tools[0] }) }));
+        return (_jsx("div", { className: "px-1", children: _jsx(CallRow, { call: single, disclosure: disclosure, disclosureId: single.id, onToggle: onToggle, renderToolActions: renderToolActions, claimsToolMedia: claimsToolMedia, size: "row", tool: group.tools[0] }) }));
     return (_jsxs("div", { className: "px-1", children: [_jsx(Disclosure, { className: "[&>.caps-disclosure-panel]:hidden", leading: _jsx(Sigil, { name: "list", size: 16 }), onOpenChange: () => {
                     onToggle(group.id, defaultOpen);
-                }, open: open, summary: running && active !== undefined ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-base-content", children: active.activeVerb }), " ", _jsx("span", { className: "font-mono", children: active.label }), " \u00B7", " ", String(group.calls.length), " ", group.calls.length === 1 ? "call" : "calls"] })) : (_jsxs("span", { className: "text-base-content", children: [group.summary, " \u00B7 ", String(group.calls.length), " ", group.calls.length === 1 ? "call" : "calls"] })), tone: group.status === "error" ? "error" : "neutral", trailing: _jsxs(_Fragment, { children: [group.failedCount > 0 ? (_jsxs("span", { className: "text-error", children: [String(group.failedCount), " failed"] })) : null, group.durationMs === undefined ? null : (_jsx("span", { children: formatToolDuration(group.durationMs) })), _jsx(Status, { motion: running ? "bounce" : "none", title: group.status === "unknown" ? "result unavailable" : group.status, tone: statusTone(group.status) })] }) }), visibleToolCalls(group, open).map((call) => (_jsx(CallRow, { call: call, disclosure: disclosure, disclosureId: call.id, onToggle: onToggle, renderToolActions: renderToolActions, size: "row", tool: group.tools.find((tool) => tool.id === call.id) }, call.id))), group.status === "completed" && group.calls.length > 3 ? (_jsx("button", { "aria-expanded": open, className: "btn btn-ghost btn-xs text-dim", onClick: () => {
+                }, open: open, summary: running && active !== undefined ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-base-content", children: active.activeVerb }), " ", _jsx("span", { className: "font-mono", children: active.label }), " \u00B7", " ", String(group.calls.length), " ", group.calls.length === 1 ? "call" : "calls"] })) : (_jsxs("span", { className: "text-base-content", children: [group.summary, " \u00B7 ", String(group.calls.length), " ", group.calls.length === 1 ? "call" : "calls"] })), tone: group.status === "error" ? "error" : "neutral", trailing: _jsxs(_Fragment, { children: [group.failedCount > 0 ? (_jsxs("span", { className: "text-error", children: [String(group.failedCount), " failed"] })) : null, group.durationMs === undefined ? null : (_jsx("span", { children: formatToolDuration(group.durationMs) })), _jsx(Status, { motion: running ? "bounce" : "none", title: group.status === "unknown" ? "result unavailable" : group.status, tone: statusTone(group.status) })] }) }), visibleToolCalls(group, open).map((call) => (_jsx(CallRow, { call: call, disclosure: disclosure, disclosureId: call.id, onToggle: onToggle, renderToolActions: renderToolActions, claimsToolMedia: claimsToolMedia, size: "row", tool: group.tools.find((tool) => tool.id === call.id) }, call.id))), group.status === "completed" && group.calls.length > 3 ? (_jsx("button", { "aria-expanded": open, className: "btn btn-ghost btn-xs text-dim", onClick: () => {
                     onToggle(group.id, defaultOpen);
                 }, type: "button", children: open ? "Show less" : `Show all ${String(group.calls.length)} calls` })) : null] }));
 });

package/dist/conversation.d.ts

@@ -118,7 +118,7 @@ export type ComposerController = Readonly<{
     /** Typed reason the latest prompt did not complete. */
     failure: "admission" | "failed" | "cancelled" | "interrupted" | undefined;
     /** Current send could not enter the bounded local admission queue. */
-    admissionError: "queue_full" | undefined;
+    admissionError: "offline_queue_full" | "queue_full" | undefined;
     /** Retry the exact most recent failed prompt. */
     retry: () => void;
     /** Remove one failed local admission from this conversation. */
@@ -135,6 +135,8 @@ export type ComposerController = Readonly<{
     submitCommand: (run: (draft: string, consumeDraft: () => void) => Promise<WhistleExecutionOutcome | undefined>) => Promise<WhistleExecutionOutcome | undefined>;
     /** Replace the local input. */
     setDraft: (value: string) => void;
+    /** Replace the images riding with the draft; the Session owner admits them on send. */
+    setImages: (images: PromptCommand["images"]) => void;
 }>;
 /** Session activity, observation, and Agent-lifetime controls. */
 export type StatusController = Readonly<{
@@ -203,6 +205,8 @@ export declare function useParakeetSession(): ParakeetSession;
 export declare function useExtensionSlots(): SessionExtensionSlots;
 /** Read Session activity and operate its observation. */
 export declare function useStatus(): StatusController;
+/** Time of the last delivered watch snapshot or frame, not an SSE comment. */
+export declare function useLastSessionReplyAt(): number | undefined;
 /** Presentation admitted once from the selected Session's already observed slots. */
 export declare function useClientContributions(): readonly ClientContribution[];
 /** The selected Session's ordinary command interaction owner. */

package/dist/conversation.js

@@ -66,7 +66,7 @@ function composerStatus(snapshot, admissions, failure) {
         return status;
     if (failure !== undefined || view.kind === "error")
         return "error";
-    if (admissions.some(({ status: state }) => state === "accepted"))
+    if (admissions.some(({ status: state }) => state === "accepted" || state === "queued-local"))
         return "queued";
     if (admissions.some(({ status: state }) => state === "admitting"))
         return "sending";
@@ -113,13 +113,14 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
     const saved = journal.read();
     let mounted = false;
     const timers = new Map();
-    const recoveryReasons = new Map(saved.pending.map(({ requestId }) => [
-        requestId,
-        "Closed before confirmation",
-    ]));
+    const recoveryReasons = new Map();
+    for (const pending of saved.pending)
+        if (pending.status === "admitting")
+            recoveryReasons.set(pending.requestId, "Closed before confirmation");
     const recovering = new Set();
     const queryAtom = atomWithQuery(() => sessionQueryOptions(session), () => queryClient);
     const snapshotAtom = atom((get) => get(queryAtom).data?.snapshot);
+    const lastReplyAtAtom = atom((get) => get(queryAtom).data?.lastReplyAt);
     const pinnedHistoryAtom = atom(undefined);
     const historyBeforeAtom = atom((get) => (get(pinnedHistoryAtom) ?? get(snapshotAtom))?.oldestCursor ?? null);
     const historyAtom = atomWithInfiniteQuery((get) => sessionHistoryQueryOptions(session, get(historyBeforeAtom)), () => queryClient);
@@ -279,10 +280,7 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
     const recallStateAtom = atom({ kind: "idle" });
     let recallOwner;
     const draftRevisionAtom = atom(0);
-    const rawAdmissionsAtom = atom(saved.pending.map((pending) => ({
-        ...pending,
-        status: "admitting",
-    })));
+    const rawAdmissionsAtom = atom(saved.pending);
     const persistAtom = atom(null, (get, _set, state) => {
         // Unavailable storage is session-only, not a pretend durable journal.
         // A supplied adapter's write failures still refuse durable operations.
@@ -299,16 +297,19 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
             recall: state?.recall === null
                 ? undefined
                 : (state?.recall ?? get(recallReservationAtom)),
-            pending: (state?.admissions ?? get(rawAdmissionsAtom))
-                .filter(({ status }) => status === "admitting")
-                .map(({ requestId, content, submittedDraft, delivery, images, restoreDraft, }) => ({
-                requestId,
-                content,
-                submittedDraft,
-                delivery,
-                images,
-                restoreDraft,
-            })),
+            pending: (state?.admissions ?? get(rawAdmissionsAtom)).flatMap(({ status, requestId, content, submittedDraft, delivery, images, restoreDraft, }) => status === "admitting" || status === "queued-local"
+                ? [
+                    {
+                        status,
+                        requestId,
+                        content,
+                        submittedDraft,
+                        delivery,
+                        images,
+                        restoreDraft,
+                    },
+                ]
+                : []),
         });
     });
     const recallAtom = atom(null, (get, set) => {
@@ -436,6 +437,24 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
         set(draftAtom, value);
         set(admissionErrorAtom, undefined);
     });
+    const setImagesAtom = atom(null, (get, set, images) => {
+        const next = images === undefined || images.length === 0 ? undefined : images;
+        try {
+            set(persistAtom, {
+                draftPayload: { images: next, delivery: get(draftDeliveryAtom) },
+            });
+        }
+        catch (cause) {
+            reportFailure("save draft images", cause);
+            interactions.toast({
+                variant: "error",
+                message: `Images not saved: ${errorMessage(cause)}`,
+            });
+        }
+        set(draftImagesAtom, next);
+        set(draftRevisionAtom, (revision) => revision + 1);
+        set(admissionErrorAtom, undefined);
+    });
     /** Consume only the exact draft a command submitted. */
     const clearSubmittedDraftAtom = atom(null, (get, set, submitted) => {
         if (get(draftRevisionAtom) !== submitted.revision ||
@@ -616,6 +635,10 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
             set(draftDeliveryAtom, undefined);
             set(setDraftAtom, "");
         }
+        // The offline prompt is saved alongside the draft. Await a fresh owner
+        // baseline before attempting admission.
+        if (admission.status === "queued-local")
+            return;
         const prompt = {
             type: "prompt",
             text: admission.content,
@@ -730,6 +753,20 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
     const maintainRecoveryAtom = atom(null, (get, set) => {
         const observation = get(observationAtom).status;
         const admissions = get(rawAdmissionsAtom);
+        if (observation === "live") {
+            if (get(admissionErrorAtom) === "offline_queue_full")
+                set(admissionErrorAtom, undefined);
+            const queued = admissions.find(({ status }) => status === "queued-local");
+            if (queued !== undefined) {
+                const sending = {
+                    ...queued,
+                    status: "admitting",
+                };
+                set(rawAdmissionsAtom, (current) => current.map((candidate) => candidate.requestId === queued.requestId ? sending : candidate));
+                // Preserve the idempotent request id when reconnect admits the prompt.
+                set(dispatchAdmissionAtom, { admission: sending, consumeDraft: false });
+            }
+        }
         for (const [id, timer] of timers) {
             if (!admissions.some(({ requestId, status }) => requestId === id && status === "admitting")) {
                 clearTimeout(timer);
@@ -774,6 +811,12 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
             return;
         const admissions = get(admissionsAtom);
         const unresolved = admissions.filter(({ status }) => status !== "failed");
+        const offline = get(observationAtom).status !== "live";
+        if (offline &&
+            unresolved.some(({ status }) => status === "queued-local")) {
+            set(admissionErrorAtom, "offline_queue_full");
+            return;
+        }
         if (unresolved.length >= MAX_UNRESOLVED_LOCAL_ADMISSIONS) {
             set(admissionErrorAtom, "queue_full");
             return;
@@ -785,7 +828,7 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
             requestId: nanoid(),
             submittedDraft: draft,
             restoreDraft: true,
-            status: "admitting",
+            status: offline ? "queued-local" : "admitting",
         };
         set(rawAdmissionsAtom, [...admissions, admission]);
         set(latestSubmissionIdAtom, admission.requestId);
@@ -991,6 +1034,7 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
         jumpToLatestAtom,
         loadOlderHistoryAtom,
         loadNewerHistoryAtom,
+        lastReplyAtAtom,
         observationAtom,
         observedCommandIdsAtom,
         rawAdmissionsAtom,
@@ -1002,6 +1046,7 @@ function createConversationAtoms(session, queryClient, authorOf, interactions, d
         reconnectAtom,
         retryAtom,
         setDraftAtom,
+        setImagesAtom,
         sendAtom,
         snapshotAtom,
         statusAtom,
@@ -1180,6 +1225,7 @@ export function useComposer() {
     const failure = useStoreAtom(atoms.failureAtom);
     const admissionError = useStoreAtom(atoms.admissionErrorAtom);
     const setDraft = useStoreSetter(atoms.setDraftAtom);
+    const setImages = useStoreSetter(atoms.setImagesAtom);
     const checkpointDraft = useStoreSetter(atoms.checkpointDraftAtom);
     const send = useStoreSetter(atoms.sendAtom);
     const submitCommand = useStoreSetter(atoms.submitCommandAtom);
@@ -1202,6 +1248,7 @@ export function useComposer() {
         retry: retryLatest,
         send,
         setDraft,
+        setImages,
         submitCommand,
     }), [
         admissionError,
@@ -1216,6 +1263,7 @@ export function useComposer() {
         retryLatest,
         send,
         setDraft,
+        setImages,
         submitCommand,
     ]);
 }
@@ -1250,6 +1298,10 @@ export function useStatus() {
         viewState,
     }), [commandId, context, observation, reconnect, status, viewState]);
 }
+/** Time of the last delivered watch snapshot or frame, not an SSE comment. */
+export function useLastSessionReplyAt() {
+    return useStoreAtom(useConversationScope().atoms.lastReplyAtAtom);
+}
 /** Presentation admitted once from the selected Session's already observed slots. */
 export function useClientContributions() {
     return useStoreAtom(useConversationScope().contributions);