@fungi.computer/parakeet 0.1.0 → 0.2.1

package/dist/components/ChatComposer.js

@@ -55,11 +55,21 @@ const presentations = {
         tone: "neutral",
     },
 };
-function HostComposerTextarea({ placeholder, onChange, onSend, onAbort, slash, slashListId, textareaId, textareaRef, value, }) {
+function HostComposerTextarea({ placeholder, onChange, onSend, onAbort, slash, slashListId, textareaId, textareaRef, value, queuedRecall, }) {
     const latestValue = useRef(value);
     const [history, setHistory] = useState([]);
     const [historyIndex, setHistoryIndex] = useState(-1);
     latestValue.current = value;
+    const recallState = queuedRecall?.recallState;
+    const recalling = recallState?.kind === "recalling";
+    useLayoutEffect(() => {
+        if (recallState?.kind !== "restored")
+            return;
+        setHistoryIndex(-1);
+        const textarea = textareaRef.current;
+        if (textarea !== null)
+            textarea.setSelectionRange(textarea.value.length, textarea.value.length);
+    }, [recallState, textareaRef]);
     useLayoutEffect(() => {
         const textarea = textareaRef.current;
         if (!textarea)
@@ -69,15 +79,18 @@ function HostComposerTextarea({ placeholder, onChange, onSend, onAbort, slash, s
     }, [textareaRef, value]);
     const saveAndSend = useCallback(() => {
         const draft = latestValue.current.trim();
-        if (!draft)
+        if (!draft && (queuedRecall?.images?.length ?? 0) === 0)
             return;
         onSend();
-        setHistory((previous) => previous.at(-1) === draft ? previous : [...previous, draft]);
+        if (draft)
+            setHistory((previous) => previous.at(-1) === draft ? previous : [...previous, draft]);
         setHistoryIndex(-1);
-    }, [onSend]);
+    }, [onSend, queuedRecall?.images?.length]);
     const onKeyDown = useCallback((event) => {
         if (isImeComposing(event))
             return;
+        if (recalling)
+            return;
         if (slash?.open === true) {
             const handled = event.key === "ArrowDown"
                 ? slash.move(1)
@@ -98,6 +111,35 @@ function HostComposerTextarea({ placeholder, onChange, onSend, onAbort, slash, s
             onAbort();
             return;
         }
+        if (queuedRecall !== undefined &&
+            event.key === "ArrowUp" &&
+            !event.repeat &&
+            !event.altKey &&
+            !event.ctrlKey &&
+            !event.metaKey &&
+            !event.shiftKey &&
+            slash?.open !== true &&
+            latestValue.current === "" &&
+            (queuedRecall.images?.length ?? 0) === 0 &&
+            document.activeElement === event.currentTarget) {
+            event.preventDefault();
+            const input = event.currentTarget;
+            void queuedRecall.recall().then((outcome) => {
+                if (outcome !== "empty" ||
+                    !input.isConnected ||
+                    input.value !== "" ||
+                    textareaRef.current !== input ||
+                    history.length === 0)
+                    return;
+                const next = historyIndex === -1 ? history.length - 1 : historyIndex - 1;
+                const entry = history[next];
+                if (entry !== undefined) {
+                    setHistoryIndex(next);
+                    onChange(entry);
+                }
+            });
+            return;
+        }
         if (event.key === "Enter" && !event.shiftKey) {
             event.preventDefault();
             saveAndSend();
@@ -129,19 +171,36 @@ function HostComposerTextarea({ placeholder, onChange, onSend, onAbort, slash, s
                     onChange(entry);
             }
         }
-    }, [history, historyIndex, onAbort, onChange, saveAndSend, slash, textareaRef]);
+    }, [
+        history,
+        historyIndex,
+        onAbort,
+        onChange,
+        saveAndSend,
+        slash,
+        textareaRef,
+        queuedRecall,
+        recalling,
+    ]);
     const listOpen = slash?.open === true && slash.completion.kind !== "none"
         ? slash.completion.items.length > 0
         : false;
-    return (_jsxs("div", { className: "relative min-w-0 flex-1", children: [_jsx("label", { className: "sr-only", htmlFor: textareaId, children: "Message" }), _jsx(Textarea, { "aria-autocomplete": "list", "aria-controls": listOpen ? slashListId : undefined, "aria-expanded": listOpen, "aria-activedescendant": listOpen && slash !== undefined
+    return (_jsxs("div", { className: "relative min-w-0 flex-1", children: [_jsx("label", { className: "sr-only", htmlFor: textareaId, children: "Message" }), _jsx(Textarea, { "aria-describedby": [
+                    slash === undefined ? undefined : `${textareaId}-guidance`,
+                    queuedRecall === undefined
+                        ? undefined
+                        : `${textareaId}-recall-guidance`,
+                ]
+                    .filter((id) => id !== undefined)
+                    .join(" ") || undefined, "aria-busy": recalling, readOnly: recalling, "aria-autocomplete": "list", "aria-controls": listOpen ? slashListId : undefined, "aria-expanded": listOpen, "aria-activedescendant": listOpen && slash !== undefined
                     ? slashOptionId(slashListId, slash.selected)
                     : undefined, className: "join-item min-h-[48px] max-h-[320px] w-full resize-none overflow-x-hidden overflow-y-auto whitespace-pre-wrap break-words px-3 py-[calc((3rem-1.25rem)/2)] font-sans text-xs text-base-content !border-0 !bg-transparent !shadow-none focus:!outline-none", id: textareaId, onChange: (event) => {
                     onChange(event.target.value);
                     setHistoryIndex(-1);
                 }, onKeyDown: onKeyDown, placeholder: placeholder ??
-                    (slash === undefined ? "Ask agent..." : "Ask agent… (/ for commands)"), role: slash === undefined ? undefined : "combobox", ref: textareaRef, rows: 1, value: value })] }));
+                    (slash === undefined ? "Ask agent..." : "Ask agent… (/ for commands)"), role: slash === undefined ? undefined : "combobox", ref: textareaRef, rows: 1, value: value }), queuedRecall === undefined ? null : (_jsx("span", { id: `${textareaId}-recall-guidance`, className: "sr-only", children: "Press Up on an empty composer to recall your newest queued message." })), (queuedRecall?.images?.length ?? 0) === 0 ? null : (_jsxs("p", { className: "text-xs", children: [queuedRecall?.images?.length, " attached image(s)"] }))] }));
 }
-/** Shared visible and screen-reader readout of the observed Session state. */
+/** Full Session readout for announcements; the footer only draws attention states. */
 export function sessionReadout(status, view) {
     if (view.kind === "connecting")
         return "connecting";
@@ -179,19 +238,24 @@ export function sessionReadout(status, view) {
 }
 function ComposerFooter({ statusChips, model, status, viewState, usage, context, }) {
     const tone = viewState.kind === "error" ? "error" : presentations[status].tone;
-    const label = sessionReadout(status, viewState);
-    return (_jsxs("div", { className: "composer-footer", children: [_jsx(Status, { label: label, title: label, tone: tone }), statusChips?.map((chip, index) => (_jsx("span", { className: "min-w-0 truncate", title: chip, children: chip }, index))), model ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "footer-divider" }), _jsx("span", { className: "font-mono font-semibold", children: formatModelIdentity(model) })] })) : null, context ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "footer-divider" }), _jsx("span", { className: "font-mono", title: "Context used / model context", children: formatContextUsage(context) })] })) : null, usage ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "footer-divider" }), _jsx("span", { className: "font-mono", children: formatTokens(usage.tokens) }), _jsx("span", { className: "footer-divider" }), _jsx("span", { className: "font-mono", children: formatMoney(usage.cost) })] })) : null] }));
+    // Admission must not replace an outstanding owner attention readout.
+    const label = sessionReadout("idle", viewState);
+    const needsAttention = viewState.kind === "waiting_for_you" || viewState.kind === "error";
+    return (_jsxs("div", { className: "composer-footer", children: [needsAttention ? (_jsx(Status, { label: label, title: label, tone: tone })) : null, statusChips?.map((chip, index) => (_jsx("span", { className: "min-w-0 truncate", title: chip, children: chip }, index))), model ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "footer-divider" }), _jsx("span", { className: "font-mono font-semibold", children: formatModelIdentity(model) })] })) : null, context ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "footer-divider" }), _jsx("span", { className: "font-mono", title: "Context used / model context", children: formatContextUsage(context) })] })) : null, usage ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "footer-divider" }), _jsx("span", { className: "font-mono", children: formatTokens(usage.tokens) }), _jsx("span", { className: "footer-divider" }), _jsx("span", { className: "font-mono", children: formatMoney(usage.cost) })] })) : null] }));
 }
-export const ChatComposer = memo(function ChatComposer({ placeholder, showFooter = true, statusChips, actionVariant = "primary", draft, failure, failureCause, admissionError, model, onAbort, onChange, onRetry, onSend, status, viewState, textareaRef, usage, context, slash, }) {
+export const ChatComposer = memo(function ChatComposer({ queuedRecall, placeholder, showFooter = true, statusChips, actionVariant = "primary", draft, failure, failureCause, admissionError, model, onAbort, onChange, onRetry, onSend, status, viewState, textareaRef, usage, context, slash, }) {
     const textareaId = useId();
     const slashListId = `${textareaId}-commands`;
     const { busy } = presentations[status];
-    const composerAction = busy ? (_jsxs("div", { className: "flex items-stretch", children: [_jsx(Button, { "aria-label": "Stop current turn", className: "join-item h-auto min-h-0 self-stretch", "data-testid": "composer-stop", disabled: status === "queued" || status === "cancelling", onClick: onAbort, title: "Stop the current turn. Queued messages keep running in order.", size: "lg", variant: "ghost", children: "Stop" }), _jsx(Button, { "aria-label": "Queue follow-up", className: "join-item h-auto min-h-0 self-stretch", disabled: draft.trim().length === 0, onClick: () => {
+    const recallBusy = queuedRecall?.recallState.kind === "recalling";
+    const cannotSend = recallBusy ||
+        (draft.trim().length === 0 && (queuedRecall?.images?.length ?? 0) === 0);
+    const composerAction = busy ? (_jsxs("div", { className: "flex items-stretch", children: [_jsx(Button, { "aria-label": "Stop current turn", className: "join-item h-auto min-h-0 self-stretch", "data-testid": "composer-stop", disabled: recallBusy || status === "queued" || status === "cancelling", onClick: onAbort, title: "Stop the current turn. Queued messages keep running in order.", size: "lg", variant: "ghost", children: "Stop" }), _jsx(Button, { "aria-label": "Queue follow-up", className: "join-item h-auto min-h-0 self-stretch", disabled: cannotSend, onClick: () => {
                     onSend("followUp");
-                }, size: "lg", variant: actionVariant, children: "Queue" })] })) : (_jsx(Button, { "aria-label": "Send message", className: "join-item h-auto min-h-0 self-stretch", disabled: draft.trim().length === 0, onClick: () => {
+                }, size: "lg", variant: actionVariant, children: "Queue" })] })) : (_jsx(Button, { "aria-label": "Send message", className: "join-item h-auto min-h-0 self-stretch", disabled: cannotSend, onClick: () => {
             onSend("steer");
         }, title: "Send", size: "lg", variant: actionVariant, children: "Send" }));
-    const composerInput = (_jsx(HostComposerTextarea, { placeholder: placeholder, onChange: onChange, onAbort: onAbort, onSend: () => {
+    const composerInput = (_jsx(HostComposerTextarea, { queuedRecall: queuedRecall, placeholder: placeholder, onChange: onChange, onAbort: onAbort, onSend: () => {
             onSend(busy ? "followUp" : "steer");
         }, slash: slash, slashListId: slashListId, textareaId: textareaId, textareaRef: textareaRef, value: draft }));
     const composerProps = {
@@ -205,5 +269,5 @@ export const ChatComposer = memo(function ChatComposer({ placeholder, showFooter
         footerProps.usage = usage;
     if (context)
         footerProps.context = context;
-    return (_jsxs("div", { className: "chat-composer not-prose flex-shrink-0 border-t border-base-300", children: [_jsxs("div", { className: "relative", children: [admissionError === "queue_full" ? (_jsx("div", { className: "px-3 py-1.5 text-xs text-error", role: "alert", children: "Too many prompts are still awaiting admission. Try again shortly." })) : null, failure !== undefined ? (_jsx(RunFailureNotice, { failure: failure, cause: failureCause, onRetry: onRetry })) : null, slash?.interactions.notice === undefined ? null : (_jsx("div", { className: "parakeet-command-notice px-3 py-1.5 text-xs", "data-tone": slash.interactions.notice.tone, role: slash.interactions.notice.tone === "error" ? "alert" : "status", children: slash.interactions.notice.message })), _jsxs(PopoverAnchor, { className: "composer-body", children: [slash === undefined ? null : (_jsx(Popover, { open: slash.open, side: "top", "data-parakeet-slash": "", children: _jsx(SlashMenu, { slash: slash, listId: slashListId }) })), _jsx(Composer, { ...composerProps })] })] }), showFooter ? _jsx(ComposerFooter, { ...footerProps }) : null, slash === undefined ? null : (_jsx("p", { className: "parakeet-key-hints", "aria-live": "polite", children: formatHints(slash.hints) }))] }));
+    return (_jsxs("div", { className: "chat-composer not-prose flex-shrink-0 border-t border-base-300", children: [_jsxs("div", { className: "relative", children: [admissionError === "queue_full" ? (_jsx("div", { className: "px-3 py-1.5 text-xs text-error", role: "alert", children: "Too many prompts are still awaiting admission. Try again shortly." })) : null, failure !== undefined ? (_jsx(RunFailureNotice, { failure: failure, cause: failureCause, onRetry: onRetry })) : null, slash?.interactions.notice === undefined ? null : (_jsx("div", { className: "parakeet-command-notice px-3 py-1.5 text-xs", "data-tone": slash.interactions.notice.tone, role: slash.interactions.notice.tone === "error" ? "alert" : "status", children: slash.interactions.notice.message })), _jsxs(PopoverAnchor, { className: "composer-body", children: [slash === undefined ? null : (_jsx(Popover, { open: slash.open, side: "top", "data-parakeet-slash": "", children: _jsx(SlashMenu, { slash: slash, listId: slashListId }) })), _jsx(Composer, { ...composerProps })] })] }), showFooter ? _jsx(ComposerFooter, { ...footerProps }) : null, slash === undefined ? null : (_jsx("p", { className: "sr-only", id: `${textareaId}-guidance`, children: formatHints(slash.hints) }))] }));
 });

package/dist/components/ChatMessage.d.ts

@@ -1,3 +1,7 @@
+/** User-message admission state, shared by full and compact transcript rows. */
+export declare function PendingMessageStatus({ pending, }: Readonly<{
+    pending: boolean | undefined;
+}>): import("react/jsx-runtime").JSX.Element | null;
 export declare function ChatMessage({ children, isError, pending, speaker, thinking, markdownPolicy, }: Readonly<{
     children: string;
     isError?: boolean;

package/dist/components/ChatMessage.js

@@ -1,13 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { MarkdownRenderer } from "./MarkdownRenderer.js";
 import { ThinkingBlock } from "./ThinkingBlock.js";
+/** User-message admission state, shared by full and compact transcript rows. */
+export function PendingMessageStatus({ pending, }) {
+    return pending ? (_jsx("span", { className: "sr-only", role: "status", children: "Sending" })) : null;
+}
 export function ChatMessage({ children, isError, pending, speaker, thinking, markdownPolicy, }) {
     const content = (_jsx(MarkdownRenderer, { policy: markdownPolicy, children: children }));
     if (speaker === "user") {
-        return (_jsx("div", { className: `px-3 py-2 transition-opacity motion-reduce:transition-none ${pending ? "opacity-50" : ""}`, "data-pending": pending ? "true" : undefined, "data-speaker": "user", style: {
+        return (_jsxs("div", { className: `px-3 py-2 transition-opacity motion-reduce:transition-none ${pending ? "opacity-50" : ""}`, "data-pending": pending ? "true" : undefined, "data-speaker": "user", style: {
                 background: "var(--stipe-surface)",
                 borderLeft: "3px solid var(--color-primary)",
-            }, children: _jsx("div", { className: "message-body text-base-content", children: content }) }));
+            }, children: [_jsx(PendingMessageStatus, { pending: pending }), _jsx("div", { className: "message-body text-base-content", children: content })] }));
     }
     const hasText = children.trim().length > 0;
     if (!hasText && !thinking)

package/dist/components/ClientRows.js

@@ -1,4 +1,4 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from "@fungi.computer/caps/components/button";
 import { DataList, DataRow, DataListHeading, } from "@fungi.computer/caps/components/data-list";
 import { Status } from "@fungi.computer/caps/components/status";
@@ -17,7 +17,7 @@ export function ClientRows({ entryId, rows, actions, onOpen, }) {
     const { inspection } = useSyncExternalStore(store.subscribe, store.snapshot, store.snapshot);
     if (rows.length === 0)
         return null;
-    return (_jsx("div", { className: "px-3 text-xs text-base-content", "data-client-entry": entryId, children: rows.map((row) => (_jsxs("div", { "data-client-row": row.id, className: "py-1", children: [_jsxs("div", { className: "flex items-start gap-2", children: [_jsxs("details", { className: "min-w-0 flex-1", children: [_jsxs("summary", { className: `cursor-pointer break-words leading-4 ${row.tone === undefined ? "" : rowColors[row.tone]}`, children: [row.title, row.inspection === undefined || row.detail === undefined
+    return (_jsx("div", { className: "px-3 text-xs text-base-content", "data-client-entry": entryId, children: rows.map((row) => (_jsxs("div", { "data-client-row": row.id, className: "py-1", children: [_jsxs("div", { className: "flex items-start gap-2", children: [_jsx("span", { "aria-hidden": "true", "data-client-row-dot": "", className: `w-3 shrink-0 text-center leading-4 ${row.tone === undefined ? "" : rowColors[row.tone]}`, children: row.tone === undefined ? "" : "●" }), _jsxs("details", { className: "min-w-0 flex-1", children: [_jsxs("summary", { className: `cursor-pointer break-words leading-4 ${row.tone === undefined ? "" : rowColors[row.tone]}`, children: [row.title, row.inspection === undefined || row.detail === undefined
                                             ? null
                                             : ` · ${row.detail}`] }), row.detail === undefined ? null : (_jsx("p", { className: "max-h-32 overflow-y-auto overscroll-contain whitespace-pre-wrap break-words pb-2", children: row.detail }))] }), row.open === undefined ? null : (_jsx(Button, { size: "xs", variant: "outline", disabled: onOpen === undefined, onClick: () => {
                                 if (row.open !== undefined)

package/dist/components/InteractionPanel.d.ts

@@ -1,15 +1,13 @@
 import type { WhistleInteractionHost } from "@fungi.computer/whistle/interaction";
-/** The interaction to draw and the page's close and retry callbacks. */
+/** The interaction to draw and the page's close callback. */
 export type InteractionPanelProps = Readonly<{
     /** The renderer-neutral interaction store. */
     host: WhistleInteractionHost;
     /** Close a settled interaction. */
     onClose?: () => void;
-    /** Run the same command again after a failure. */
-    onRetry?: () => void;
 }>;
 /**
  * Browser renderer for one Whistle interaction. It draws the same host
  * snapshot the terminal draws; the command, not the page, defines the steps.
  */
-export declare function InteractionPanel({ host, onClose, onRetry, }: InteractionPanelProps): import("react/jsx-runtime").JSX.Element;
+export declare function InteractionPanel({ host, onClose }: InteractionPanelProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/InteractionPanel.js

@@ -29,7 +29,7 @@ function PromptView({ host, pending, }) {
  * Browser renderer for one Whistle interaction. It draws the same host
  * snapshot the terminal draws; the command, not the page, defines the steps.
  */
-export function InteractionPanel({ host, onClose, onRetry, }) {
+export function InteractionPanel({ host, onClose }) {
     const state = useSyncExternalStore(host.subscribe, host.snapshot);
     const active = state.status === "working" || state.status === "prompting";
     return (_jsxs("section", { "aria-label": state.title, className: "flex flex-col gap-sm", "data-status": state.status, children: [_jsx("h2", { className: "text-lg font-semibold", children: state.title }), state.handoff === undefined ? null : (_jsx(Display, { density: "compact", children: _jsxs("div", { className: "flex flex-col gap-xs p-sm", children: [_jsx("span", { className: "text-sm", children: state.handoff.message ??
@@ -38,5 +38,5 @@ export function InteractionPanel({ host, onClose, onRetry, }) {
                                     : "Open this page and enter the code") }), _jsx("a", { className: "link break-all font-mono", href: state.handoff.url, rel: "noreferrer", target: "_blank", children: state.handoff.url }), state.handoff.code === undefined ? null : (_jsx("span", { className: "font-mono text-2xl tracking-widest", children: state.handoff.code }))] }) })), state.message === undefined || state.status === "failed" ? null : (_jsxs("p", { className: "flex items-center gap-xs", children: [_jsx(Status, { tone: state.message.type === "success" ? "success" : "info", motion: state.message.type === "progress" && active ? "pulse" : "none" }), state.message.message] })), state.links.map((link) => (_jsx("a", { className: "link break-all", href: link.url, rel: "noreferrer", target: "_blank", children: link.label ?? link.url }, link.url))), state.prompt === undefined ? null : (_jsx(PromptView, { host: host, pending: state.prompt }, state.prompt.sequence)), state.status === "failed" ? (_jsx(Alert, { tone: "error", title: "That did not work", description: state.failure })) : null, _jsxs("div", { className: "flex justify-end gap-xs", children: [active ? (_jsx(Button, { variant: "ghost", onClick: host.cancel, children: "Cancel" })) : null, state.status === "failed" ? (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "ghost", onClick: () => {
                                     host.cancel();
                                     onClose?.();
-                                }, children: "Close" }), onRetry === undefined ? null : (_jsx(Button, { onClick: onRetry, children: "Try again" }))] })) : null, state.status === "done" || state.status === "cancelled" ? (_jsx(Button, { onClick: onClose, children: "Done" })) : null] })] }));
+                                }, children: "Close" }), !state.retryable ? null : (_jsx(Button, { onClick: host.retry, children: "Try again" }))] })) : null, state.status === "done" || state.status === "cancelled" ? (_jsx(Button, { onClick: onClose, children: "Done" })) : null] })] }));
 }

package/dist/components/TimelineItem.d.ts

@@ -5,6 +5,8 @@ import { type ToggleToolDisclosure } from "./ToolGroup.js";
 export declare const TimelineItem: import("react").NamedExoticComponent<Readonly<{
     item: TimelineRow;
     onDismissFailed?: ((requestId: string) => void) | undefined;
+    onCancelQueued?: ((commandId: string) => void) | undefined;
+    cancellingQueued?: boolean | undefined;
     renderToolActions?: ((item: ToolItem) => ReactNode) | undefined;
     renderAssistantAttachment?: ((text: string) => ReactNode) | undefined;
     formatAssistantText?: ((text: string) => string) | undefined;

package/dist/components/TimelineItem.js

@@ -1,19 +1,45 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Sigil } from "@fungi.computer/sigils";
+import { Button } from "@fungi.computer/caps/components/button";
 import { memo } from "react";
-import { initialToolDisclosure, } from "../core/tool-groups.js";
+import { disclosureOpen, initialToolDisclosure, } from "../core/tool-groups.js";
 import { assistantMessageVisible } from "../core/assistant-visibility.js";
 import { formatTokenCount } from "../core/format-context.js";
-import { ChatMessage } from "./ChatMessage.js";
+import { ChatMessage, PendingMessageStatus } from "./ChatMessage.js";
 import { ToolGroup } from "./ToolGroup.js";
 const ignoreToggle = () => undefined;
-export const TimelineItem = memo(function TimelineItem({ item, onDismissFailed, renderToolActions, renderAssistantAttachment, formatAssistantText, toolDisclosure = initialToolDisclosure, onToggleTool = ignoreToggle, }) {
+const compactionNoticeLabel = {
+    nothing_to_compact: "nothing to compact",
+    failed: "compaction failed",
+    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, }) {
     switch (item.kind) {
         case "user_message": {
+            const pending = item.status === "pending" || item.status === "queued";
             const requestId = item.requestId;
+            const commandId = item.commandId;
+            const cancelAction = item.status === "queued" &&
+                commandId !== undefined &&
+                onCancelQueued !== undefined ? (_jsx("div", { className: "flex justify-end px-3", children: _jsx(Button, { "aria-label": "Cancel queued message", disabled: cancellingQueued, size: "sm", variant: "ghost", onClick: () => {
+                        onCancelQueued(commandId);
+                    }, children: "Cancel" }) })) : null;
             const dismissAction = requestId === undefined || onDismissFailed === undefined ? null : (_jsx("button", { "aria-label": "Dismiss failed prompt", className: "btn btn-ghost btn-xs", onClick: () => {
                     onDismissFailed(requestId);
                 }, type: "button", children: "Dismiss" }));
-            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, { pending: item.status !== "confirmed", speaker: "user", children: item.text }), item.status === "failed" ? (_jsxs("div", { className: "flex items-center gap-2 px-3 text-xs text-error", role: "alert", children: [_jsx("span", { children: "Your prompt didn\u2019t make it through." }), dismissAction] })) : null] }));
+            const failed = item.status === "failed" ? (_jsxs("div", { className: "flex items-center gap-2 px-3 text-xs text-error", role: "alert", children: [_jsx("span", { children: item.author?.kind === "agent"
+                            ? "That Agent message didn’t make it through."
+                            : "Your prompt didn’t make it through." }), dismissAction] })) : null;
+            if (item.author?.kind === "agent") {
+                const open = disclosureOpen(toolDisclosure, item.id, false);
+                return (_jsxs(_Fragment, { children: [_jsxs("div", { className: item.status === "confirmed"
+                                ? "px-3 text-xs"
+                                : "px-3 text-xs opacity-60", "data-agent-message": item.author.id, "data-author": item.author.id, children: [_jsx(PendingMessageStatus, { pending: pending }), _jsxs("button", { "aria-expanded": open, className: "text-dim flex w-full min-w-0 items-center gap-sm text-left", onClick: () => {
+                                        onToggleTool(item.id, false);
+                                    }, type: "button", children: [_jsx("span", { className: "flex shrink-0", children: _jsx(Sigil, { name: "agent", size: 16 }) }), _jsx("span", { className: "shrink-0", children: item.author.name }), open ? null : (_jsxs("span", { className: "min-w-0 truncate", children: ["\u00B7 ", item.text] }))] }), open ? (_jsx("div", { className: "whitespace-pre-wrap break-words pl-3", children: item.text })) : null] }), failed, cancelAction] }));
+            }
+            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, { pending: pending, speaker: "user", children: item.text }), failed, cancelAction] }));
         }
         case "assistant_message":
             if (!assistantMessageVisible(item))
@@ -28,8 +54,6 @@ export const TimelineItem = memo(function TimelineItem({ item, onDismissFailed,
                     ? "compacted · the agent’s memory starts below"
                     : `compacted ${formatTokenCount(item.tokensBefore)} → ${formatTokenCount(item.tokensAfter)}` }));
         case "compaction_notice":
-            return (_jsxs("div", { className: `px-3 text-xs ${item.result === "failed" ? "text-error" : "text-dim"}`, role: "status", children: ["\u00B7", " ", item.result === "failed"
-                        ? "compaction failed"
-                        : "nothing to compact", item.diagnostic === null ? "" : `: ${item.diagnostic}`] }));
+            return (_jsxs("div", { className: `px-3 text-xs ${item.result === "failed" ? "text-error" : "text-dim"}`, role: "status", children: ["\u00B7 ", compactionNoticeLabel[item.result], item.diagnostic === null ? "" : `: ${item.diagnostic}`] }));
     }
 });

package/dist/conversation-opening.d.ts

@@ -0,0 +1,47 @@
+import type { AppRoot } from "@fungi.computer/agar";
+import { openAppAgent } from "@fungi.computer/agar/agents";
+import { type ParakeetSession } from "./headless.js";
+import type { QueryClient } from "@tanstack/react-query";
+import { createShiitakeClient, type ShiitakeAgent, type ShiitakeEventSourceConstructor, type ShiitakeSession } from "@fungi.computer/shiitake/client";
+export type OpenConversation<Session extends ParakeetSession = ShiitakeSession> = Readonly<{
+    agentId: string;
+    sessionId: string;
+    session: Session;
+}>;
+export type PendingSelection = Readonly<{
+    agentId: string;
+    sessionId: string;
+}>;
+export type InboxClient = Pick<ShiitakeAgent, "createSession" | "deleteSession" | "session" | "close">;
+/** What the opening owner needs of a client: one addressable Session, closable. */
+export type OpeningClient<Session extends ParakeetSession = ShiitakeSession> = Readonly<{
+    session: (sessionId: string) => Session;
+    close: () => Promise<void>;
+}>;
+/** The owner's own view of its services; a full {@link Services} satisfies it. */
+export type OpeningServices<Session extends ParakeetSession = ShiitakeSession> = Readonly<{
+    openAgent: typeof openAppAgent;
+    createClient: (options: Parameters<typeof createShiitakeClient>[0]) => OpeningClient<Session>;
+}>;
+export type Services = Readonly<{
+    openAgent: typeof openAppAgent;
+    createClient: (options: Parameters<typeof createShiitakeClient>[0]) => InboxClient;
+}>;
+export declare function eventSourceFor(fetcher: typeof globalThis.fetch): ShiitakeEventSourceConstructor;
+/** Owns the selected conversation's Agent, client and Parakeet query lifetimes. */
+export declare function createConversationOpeningOwner<Session extends ParakeetSession = ShiitakeSession>(options: Readonly<{
+    connection: Pick<AppRoot, "capabilities"> & {
+        ui: Pick<AppRoot["ui"], "reportAgentSessionSelection">;
+    };
+    queryClient: QueryClient;
+    services: OpeningServices<Session>;
+    onPending: (selection: PendingSelection | null) => void;
+    onConversation: (conversation: OpenConversation<Session> | null) => void;
+    onError: (message: string | null) => void;
+    /** Only the primary conversation is the selection the host shell sees. */
+    reportsSelection?: boolean;
+}>): {
+    select: (agentId: string, sessionId: string, fromOpenRequest?: boolean, waitForBaseline?: boolean) => void;
+    clear: () => void;
+    close: () => void;
+};

package/dist/conversation-opening.js

@@ -0,0 +1,173 @@
+import { openAppAgent } from "@fungi.computer/agar/agents";
+import { seedSessionQuery } from "./headless.js";
+import { createShiitakeClient, } from "@fungi.computer/shiitake/client";
+import { ShiitakeError } from "@fungi.computer/shiitake";
+import { EventSource as EventSourceImplementation, } from "eventsource";
+/** Seed Parakeet's shared query with the bounded read before mounting its watch. */
+function prepareConversation(queryClient, session) {
+    let cancelled = false;
+    const readBaseline = async () => {
+        try {
+            return await session.read();
+        }
+        catch (cause) {
+            if (!(cause instanceof ShiitakeError) ||
+                cause.boundary !== "runtime" ||
+                cause.cause !== "unavailable")
+                throw cause;
+            await new Promise((resolve) => setTimeout(resolve, 150));
+            if (cancelled)
+                throw new Error("Conversation opening cancelled", { cause });
+            return session.read();
+        }
+    };
+    let cancel;
+    const cancelledRead = new Promise((_, reject) => {
+        cancel = () => {
+            reject(new Error("Conversation opening cancelled"));
+        };
+    });
+    const ready = Promise.race([readBaseline(), cancelledRead]).then((snapshot) => {
+        if (cancelled)
+            throw new Error("Conversation opening cancelled");
+        seedSessionQuery(queryClient, session, snapshot);
+    });
+    return {
+        ready,
+        close: () => {
+            cancelled = true;
+            cancel();
+        },
+    };
+}
+export function eventSourceFor(fetcher) {
+    return class HostEventSource {
+        #source;
+        constructor(url) {
+            this.#source = new EventSourceImplementation(url, {
+                fetch: (input, init) => fetcher(input, init),
+            });
+        }
+        get readyState() {
+            return this.#source.readyState;
+        }
+        addEventListener(type, listener, options) {
+            this.#source.addEventListener(type, listener, options);
+        }
+        close() {
+            this.#source.close();
+        }
+    };
+}
+/** Owns the selected conversation's Agent, client and Parakeet query lifetimes. */
+export function createConversationOpeningOwner(options) {
+    const { connection, queryClient, services } = options;
+    let pending = null;
+    let current = null;
+    let currentClose = null;
+    let disposed = false;
+    const same = (left, right) => left?.agentId === right.agentId && left.sessionId === right.sessionId;
+    const isCurrent = (opening) => !disposed && pending === opening;
+    const select = (agentId, sessionId, fromOpenRequest = false, waitForBaseline = true) => {
+        if (disposed)
+            return;
+        const selection = { agentId, sessionId };
+        if (same(pending, selection))
+            return;
+        pending?.close();
+        pending = null;
+        options.onPending(null);
+        options.onError(null);
+        if (same(current, selection))
+            return;
+        let openedClose = null;
+        let closed = false;
+        const opening = {
+            ...selection,
+            close: () => {
+                if (closed)
+                    return;
+                closed = true;
+                openedClose?.();
+            },
+        };
+        pending = opening;
+        options.onPending(selection);
+        void (async () => {
+            try {
+                const transport = await services.openAgent(connection.capabilities, {
+                    agentId,
+                });
+                if (!isCurrent(opening)) {
+                    await transport.close();
+                    return;
+                }
+                const client = services.createClient({
+                    baseUrl: transport.baseUrl,
+                    eventSource: eventSourceFor(transport.fetch),
+                    fetch: transport.fetch,
+                });
+                const session = client.session(sessionId);
+                const observation = prepareConversation(queryClient, session);
+                openedClose = () => {
+                    observation.close();
+                    void Promise.allSettled([client.close(), transport.close()]);
+                };
+                await observation.ready;
+                if (waitForBaseline && options.reportsSelection !== false) {
+                    await connection.ui.reportAgentSessionSelection({
+                        agentId,
+                        sessionId,
+                    });
+                }
+                if (!isCurrent(opening))
+                    return;
+                const conversation = { agentId, sessionId, session };
+                const previousClose = currentClose;
+                pending = null;
+                current = conversation;
+                currentClose = opening.close;
+                options.onConversation(conversation);
+                options.onPending(null);
+                previousClose?.();
+            }
+            catch (cause) {
+                console.error("Chat Session opening failed", cause);
+                opening.close();
+                if (isCurrent(opening)) {
+                    pending = null;
+                    options.onPending(null);
+                    options.onError(fromOpenRequest
+                        ? `That Session could not be opened. ${current ? "The current conversation remains open." : "Choose another Session from the list."}`
+                        : `Could not open this Session${cause instanceof Error ? `: ${cause.message}` : ""}. ${current ? "The previous conversation remains open." : "Try opening it again."}`);
+                }
+            }
+        })();
+    };
+    const clear = () => {
+        if (disposed)
+            return;
+        const hadSelection = pending !== null || current !== null;
+        pending?.close();
+        pending = null;
+        currentClose?.();
+        currentClose = null;
+        current = null;
+        options.onPending(null);
+        options.onConversation(null);
+        options.onError(null);
+        if (!hadSelection || options.reportsSelection === false)
+            return;
+        void connection.ui
+            .reportAgentSessionSelection(null)
+            .catch((cause) => {
+            console.error("Chat Session selection could not be reported", cause);
+            return undefined;
+        });
+    };
+    const close = () => {
+        clear();
+        disposed = true;
+    };
+    return { select, clear, close };
+}