@fungi.computer/parakeet 0.0.1 → 0.2.0

package/dist/components/AgentHead.js

@@ -1,53 +1,21 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Monogram } from "@fungi.computer/caps/components/monogram";
-import { Sprite } from "@fungi.computer/sprite/react";
-import { memo, useEffect, useMemo, useRef, useState } from "react";
+import { Sprite, useAnimationTime } from "@fungi.computer/sprite/react";
+import { memo, useMemo, useState } from "react";
 import { avatarPresentation } from "./avatar-presentation.js";
 import { shiitakeSprite } from "./sprite-service.js";
-import { captureStillFrame, getStillFrame, setStillFrame, stillFrameKey, } from "./still-frame-cache.js";
 /**
- * An Agent's head at avatar size. Renders the Agent's own avatar when given
- * one; otherwise the pre-avatar seeded mushroom cap, byte-identical to
- * before avatars existed. The letter shows until a frame is ready. It holds
- * still unless `thinking` or `speaking`: an idle head whose render style is
- * "plain" and already has a cached still frame for its look never mounts a
- * live canvas, so a long rail is not a wall of animation. A render style
- * other than "plain" is a CSS filter over the live canvas, not part of the
- * captured pixels, so a styled head always stays live.
+ * An Agent's head at avatar size, drawn from the Agent's own avatar (a
+ * property of the Agent record, never of a conversation). The letter shows
+ * until a frame is ready. The live
+ * canvas stays mounted and is paused unless `thinking` or `speaking`, so an
+ * idle head shows its real look without animating.
  */
-export const AgentHead = memo(function AgentHead({ activity = "idle", avatar, className, name, seed, size = 24, }) {
+export const AgentHead = memo(function AgentHead({ activity = "idle", avatar, className, name, size = 24, timeMs: explicitTimeMs, }) {
+    const timeMs = useAnimationTime(explicitTimeMs);
     const [ready, setReady] = useState(false);
-    const host = useRef(null);
-    const presentation = useMemo(() => avatarPresentation(avatar, seed), [avatar, seed]);
-    const dpr = window.devicePixelRatio;
-    const cacheKey = useMemo(() => stillFrameKey(presentation, size, dpr), [presentation, size, dpr]);
-    const [frame, setFrame] = useState(() => getStillFrame(cacheKey));
-    useEffect(() => {
-        setFrame(getStillFrame(cacheKey));
-    }, [cacheKey]);
-    // A render style is a CSS filter on the live stage (render-style.ts), not
-    // part of the captured canvas pixels, so a styled head must stay live;
-    // only a "plain" idle head can be replaced by its cached still frame.
-    const live = activity !== "idle" ||
-        frame === undefined ||
-        presentation.renderStyle !== "plain";
-    useEffect(() => {
-        // A cached idle head has no player; its next player must become ready anew.
-        if (!live)
-            setReady(false);
-    }, [live]);
-    return (_jsxs("span", { "aria-hidden": "true", className: `relative inline-block shrink-0 ${className ?? ""}`, "data-agent-head": frame !== undefined || ready ? "ready" : "loading", style: { height: size, width: size }, children: [frame === undefined && !ready ? (_jsx(Monogram, { className: "absolute inset-0", name: name, seed: seed })) : null, frame !== undefined &&
-                presentation.renderStyle === "plain" &&
-                (!live || !ready) ? (_jsx("img", { alt: "", className: "absolute inset-0 h-full w-full", src: frame })) : null, live ? (_jsx(Sprite, { activity: activity, appearance: presentation.appearance, className: "absolute inset-0", expression: presentation.expression, onState: (state) => {
+    const presentation = useMemo(() => avatarPresentation(avatar), [avatar]);
+    return (_jsxs("span", { "aria-hidden": "true", className: `relative inline-block shrink-0 ${className ?? ""}`, "data-agent-head": ready ? "ready" : "loading", style: { height: size, width: size }, children: [ready ? null : (_jsx(Monogram, { className: "absolute inset-0", name: name, seed: name })), _jsx(Sprite, { activity: activity, ...(timeMs === undefined ? {} : { timeMs }), appearance: presentation.appearance, className: "absolute inset-0", expression: presentation.expression, onState: (state) => {
                     setReady(state.status === "ready");
-                    if (state.status === "ready" &&
-                        activity === "idle" &&
-                        presentation.renderStyle === "plain") {
-                        const captured = captureStillFrame(host.current);
-                        if (captured !== undefined) {
-                            setStillFrame(cacheKey, captured);
-                            setFrame(captured);
-                        }
-                    }
-                }, paused: activity === "idle", ref: host, renderStyle: presentation.renderStyle, service: shiitakeSprite, src: presentation.src })) : null] }));
+                }, paused: timeMs !== undefined || activity === "idle", renderStyle: presentation.renderStyle, service: shiitakeSprite, src: presentation.src })] }));
 });

package/dist/components/ChatComposer.d.ts

@@ -11,6 +11,8 @@ export type ChatComposerUsage = Readonly<{
     tokens: number;
 }>;
 export type ChatComposerProps = {
+    /** Undefined for visitor composers without a caller-owned pending queue. */
+    queuedRecall: Pick<ComposerController, "recall" | "recallState" | "images"> | undefined;
     /** Caller-owned prompt hint; omitted for the ordinary Session composer. */
     placeholder?: string | undefined;
     /** Hide internal model, usage and status readouts for visitors. */
@@ -38,6 +40,6 @@ export type ChatComposerProps = {
     /** Parakeet's slash controller; the composer only draws and forwards keys. */
     slash?: SlashCommandController | undefined;
 };
-/** Shared visible and screen-reader readout of the observed Session state. */
+/** Full Session readout for announcements; the footer only draws attention states. */
 export declare function sessionReadout(status: ParakeetStatus, view: ParakeetSessionViewState): string;
 export declare const ChatComposer: import("react").NamedExoticComponent<ChatComposerProps>;

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/ShiitakeAvatar.d.ts

@@ -1,14 +1,16 @@
 import type { Avatar } from "@fungi.computer/sprite/avatar";
 import { type AvatarPresentation, type SpriteService } from "@fungi.computer/sprite";
-/** The current activity and expression supplied to a composer avatar. */
+/** The current activity and expression supplied to a live avatar. */
 export type AvatarState = Readonly<Pick<AvatarPresentation, "activity" | "expression">>;
 /**
- * Shiitake's sprite head, drawn in the activity and expression it is given.
- * With no `avatar`, this is the product mascot, exactly as before avatars
- * existed: no seeded colour, the character's own defaults.
+ * A sprite head drawn in the live activity and expression it is given. With
+ * an `avatar` it draws that look (a member's own, in their settings); with
+ * none it is Shiitake, the product mascot, in the character's own defaults.
+ * Conversations have no avatar: an Agent's head is `AgentHead`, drawn from
+ * the Agent record.
  */
 export declare const ShiitakeAvatar: import("react").NamedExoticComponent<{
-    /** The open conversation's avatar; omitted or `null` draws the mascot. */
+    /** The look to draw; omitted or `null` draws the mascot. */
     avatar?: Avatar | null;
     /** Replaces the default 3rem size, for a host that sizes the head itself. */
     className?: string;

package/dist/components/ShiitakeAvatar.js

@@ -5,12 +5,14 @@ import { memo, useMemo } from "react";
 import { avatarPresentation } from "./avatar-presentation.js";
 import { shiitakeSprite } from "./sprite-service.js";
 /**
- * Shiitake's sprite head, drawn in the activity and expression it is given.
- * With no `avatar`, this is the product mascot, exactly as before avatars
- * existed: no seeded colour, the character's own defaults.
+ * A sprite head drawn in the live activity and expression it is given. With
+ * an `avatar` it draws that look (a member's own, in their settings); with
+ * none it is Shiitake, the product mascot, in the character's own defaults.
+ * Conversations have no avatar: an Agent's head is `AgentHead`, drawn from
+ * the Agent record.
  */
 export const ShiitakeAvatar = memo(function ShiitakeAvatar({ avatar, className = "h-12 w-12 shrink-0", service = shiitakeSprite, state, }) {
-    const presentation = useMemo(() => (avatar ? avatarPresentation(avatar, "shiitake-mascot") : undefined), [avatar]);
+    const presentation = useMemo(() => (avatar ? avatarPresentation(avatar) : undefined), [avatar]);
     return (_jsx(Sprite, { "aria-hidden": "true", className: className, service: service, src: presentation?.src ?? { local: "mushroom" }, ...(presentation
             ? {
                 appearance: presentation.appearance,

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/components/avatar-presentation.d.ts

@@ -1,12 +1,10 @@
-import { type Avatar } from "@fungi.computer/sprite/avatar";
+import type { Avatar } from "@fungi.computer/sprite/avatar";
 import type { AvatarPresentation as SpriteAvatarPresentation } from "@fungi.computer/sprite";
 /**
- * Sprite props for one avatar, independent of the live `activity` a composer
- * drives moment to moment. Every avatar-aware Parakeet component builds its
- * `<Sprite>` props through this one mapper, so a stored avatar and the
- * pre-avatar seeded look reach the canvas the same way. Unlike the Sprite
- * service's own `AvatarPresentation`, these are never optional: the mapper
- * always resolves a complete avatar, stored or legacy.
+ * Sprite props for one Agent's avatar, independent of the live `activity` a
+ * host drives moment to moment. Unlike the Sprite service's own
+ * `AvatarPresentation`, these are never optional: every Agent record carries
+ * a complete avatar.
  */
 export type AvatarSpriteProps = {
     readonly src: SpriteAvatarPresentation["src"];
@@ -14,10 +12,5 @@ export type AvatarSpriteProps = {
     readonly expression: NonNullable<SpriteAvatarPresentation["expression"]>;
     readonly renderStyle: NonNullable<SpriteAvatarPresentation["renderStyle"]>;
 };
-/**
- * Map a stored avatar (or `null`/`undefined`, meaning none is saved yet) to
- * Sprite props. The fallback is `legacyAvatar(seed)`: the mushroom, in the
- * same seeded cap colour Agents have always worn, so an existing Agent
- * renders byte-identically to before avatars existed.
- */
-export declare function avatarPresentation(avatar: Avatar | null | undefined, seed: string): AvatarSpriteProps;
+/** Map an Agent's avatar to Sprite props. */
+export declare function avatarPresentation(avatar: Avatar): AvatarSpriteProps;

package/dist/components/avatar-presentation.js

@@ -1,16 +1,9 @@
-import { legacyAvatar } from "@fungi.computer/sprite/avatar";
-/**
- * Map a stored avatar (or `null`/`undefined`, meaning none is saved yet) to
- * Sprite props. The fallback is `legacyAvatar(seed)`: the mushroom, in the
- * same seeded cap colour Agents have always worn, so an existing Agent
- * renders byte-identically to before avatars existed.
- */
-export function avatarPresentation(avatar, seed) {
-    const resolved = avatar ?? legacyAvatar(seed);
+/** Map an Agent's avatar to Sprite props. */
+export function avatarPresentation(avatar) {
     return {
-        src: { local: resolved.character },
-        appearance: resolved.appearance,
-        expression: resolved.expression,
-        renderStyle: resolved.renderStyle,
+        src: { local: avatar.character },
+        appearance: avatar.appearance,
+        expression: avatar.expression,
+        renderStyle: avatar.renderStyle,
     };
 }

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;
+};