@fungi.computer/parakeet 0.0.0-stage → 0.0.1

package/dist/components/ChatComposer.js

@@ -0,0 +1,209 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { formatTokens } from "../core/format-tokens.js";
+import { formatModelIdentity } from "../core/model-identity.js";
+import { formatContextUsage } from "../core/format-context.js";
+import { Composer, } from "@fungi.computer/caps/blocks/composer";
+import { isImeComposing } from "@fungi.computer/caps/lib/ime";
+import { RunFailureNotice } from "./RunFailureNotice.js";
+import { Button } from "@fungi.computer/caps/components/button";
+import { formatMoney } from "@fungi.computer/caps/lib/format-money";
+import { Popover, PopoverAnchor, } from "@fungi.computer/caps/components/popover";
+import { Status } from "@fungi.computer/caps/components/status";
+import { memo, useCallback, useId, useLayoutEffect, useRef, useState, } from "react";
+import { Textarea } from "@fungi.computer/caps/components/textarea";
+import { formatHints } from "../commands/hints.js";
+import { SlashMenu, slashOptionId } from "./SlashMenu.js";
+const presentations = {
+    connecting: {
+        busy: false,
+        tone: "neutral",
+    },
+    cancelling: {
+        busy: true,
+        tone: "warning",
+    },
+    error: {
+        busy: false,
+        tone: "error",
+    },
+    idle: {
+        busy: false,
+        tone: "neutral",
+    },
+    queued: {
+        busy: true,
+        tone: "warning",
+    },
+    retrying: {
+        busy: true,
+        tone: "warning",
+    },
+    sending: {
+        busy: true,
+        tone: "success",
+    },
+    streaming: {
+        busy: true,
+        tone: "success",
+    },
+    thinking: {
+        busy: true,
+        tone: "warning",
+    },
+    disconnected: {
+        busy: false,
+        tone: "neutral",
+    },
+};
+function HostComposerTextarea({ placeholder, onChange, onSend, onAbort, slash, slashListId, textareaId, textareaRef, value, }) {
+    const latestValue = useRef(value);
+    const [history, setHistory] = useState([]);
+    const [historyIndex, setHistoryIndex] = useState(-1);
+    latestValue.current = value;
+    useLayoutEffect(() => {
+        const textarea = textareaRef.current;
+        if (!textarea)
+            return;
+        textarea.style.height = "auto";
+        textarea.style.height = `${String(Math.min(textarea.scrollHeight, 320))}px`;
+    }, [textareaRef, value]);
+    const saveAndSend = useCallback(() => {
+        const draft = latestValue.current.trim();
+        if (!draft)
+            return;
+        onSend();
+        setHistory((previous) => previous.at(-1) === draft ? previous : [...previous, draft]);
+        setHistoryIndex(-1);
+    }, [onSend]);
+    const onKeyDown = useCallback((event) => {
+        if (isImeComposing(event))
+            return;
+        if (slash?.open === true) {
+            const handled = event.key === "ArrowDown"
+                ? slash.move(1)
+                : event.key === "ArrowUp"
+                    ? slash.move(-1)
+                    : event.key === "Tab"
+                        ? slash.complete()
+                        : event.key === "Escape"
+                            ? slash.dismiss()
+                            : false;
+            if (handled) {
+                event.preventDefault();
+                return;
+            }
+        }
+        if (event.key === "Escape") {
+            event.preventDefault();
+            onAbort();
+            return;
+        }
+        if (event.key === "Enter" && !event.shiftKey) {
+            event.preventDefault();
+            saveAndSend();
+            return;
+        }
+        if (event.key === "ArrowUp" &&
+            textareaRef.current?.selectionStart === 0 &&
+            history.length > 0 &&
+            (historyIndex === -1 || historyIndex > 0)) {
+            event.preventDefault();
+            const next = historyIndex === -1 ? history.length - 1 : historyIndex - 1;
+            setHistoryIndex(next);
+            const entry = history[next];
+            if (entry !== undefined)
+                onChange(entry);
+            return;
+        }
+        if (event.key === "ArrowDown" && historyIndex !== -1) {
+            event.preventDefault();
+            const next = historyIndex + 1;
+            if (next >= history.length) {
+                setHistoryIndex(-1);
+                onChange("");
+            }
+            else {
+                setHistoryIndex(next);
+                const entry = history[next];
+                if (entry !== undefined)
+                    onChange(entry);
+            }
+        }
+    }, [history, historyIndex, onAbort, onChange, saveAndSend, slash, textareaRef]);
+    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
+                    ? 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 })] }));
+}
+/** Shared visible and screen-reader readout of the observed Session state. */
+export function sessionReadout(status, view) {
+    if (view.kind === "connecting")
+        return "connecting";
+    if (view.kind === "disconnected")
+        return "unavailable";
+    if (status === "sending")
+        return "sending prompt";
+    if (status === "queued" &&
+        (view.kind === "idle" ||
+            view.kind === "waiting_for_you" ||
+            view.kind === "error"))
+        return "prompt accepted";
+    switch (view.kind) {
+        case "waiting_for_you":
+            return "waiting for you";
+        case "responding":
+            return "writing";
+        case "running_tool":
+            return `running ${view.tool}`;
+        case "retrying":
+            return `retrying ${String(view.attempt)}/${String(view.maxAttempts)}`;
+        case "error":
+            return "failed";
+        case "queued":
+            return "queued";
+        case "cancelling":
+            return "cancelling";
+        case "compacting":
+            return "compacting";
+        case "thinking":
+            return "thinking";
+        case "idle":
+            return "idle";
+    }
+}
+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] }));
+}
+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, }) {
+    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: () => {
+                    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: () => {
+            onSend("steer");
+        }, title: "Send", size: "lg", variant: actionVariant, children: "Send" }));
+    const composerInput = (_jsx(HostComposerTextarea, { placeholder: placeholder, onChange: onChange, onAbort: onAbort, onSend: () => {
+            onSend(busy ? "followUp" : "steer");
+        }, slash: slash, slashListId: slashListId, textareaId: textareaId, textareaRef: textareaRef, value: draft }));
+    const composerProps = {
+        action: composerAction,
+        input: composerInput,
+    };
+    const footerProps = { status, viewState, statusChips };
+    if (model)
+        footerProps.model = model;
+    if (usage)
+        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) }))] }));
+});

package/dist/components/ChatMessage.d.ts

@@ -0,0 +1,8 @@
+export declare function ChatMessage({ children, isError, pending, speaker, thinking, markdownPolicy, }: Readonly<{
+    children: string;
+    isError?: boolean;
+    pending?: boolean;
+    speaker: "agent" | "user";
+    thinking?: string;
+    markdownPolicy?: "session" | "visitor";
+}>): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/ChatMessage.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MarkdownRenderer } from "./MarkdownRenderer.js";
+import { ThinkingBlock } from "./ThinkingBlock.js";
+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: {
+                background: "var(--stipe-surface)",
+                borderLeft: "3px solid var(--color-primary)",
+            }, children: _jsx("div", { className: "message-body text-base-content", children: content }) }));
+    }
+    const hasText = children.trim().length > 0;
+    if (!hasText && !thinking)
+        return null;
+    return (_jsxs("div", { "data-speaker": "agent", "data-pending": pending ? "true" : undefined, children: [thinking ? _jsx(ThinkingBlock, { thinking: thinking }) : null, hasText ? (_jsx("div", { className: `px-3 py-2 ${isError ? "text-error" : "text-base-content"}`, children: content })) : null] }));
+}

package/dist/components/ClientRows.d.ts

@@ -0,0 +1,11 @@
+import type { ClientContributionV1 } from "@fungi.computer/shiitake/client-entry";
+import type { RowV1 } from "@fungi.computer/gills";
+import type { useClientActions } from "../client-contributions.js";
+export type ClientRowsProps = Readonly<{
+    entryId: string;
+    rows: ClientContributionV1["panel"];
+    actions: ReturnType<typeof useClientActions>;
+    onOpen?: ((target: NonNullable<RowV1["open"]>) => void) | undefined;
+}>;
+/** Render admitted data; commands and request state remain in Parakeet headless. */
+export declare function ClientRows({ entryId, rows, actions, onOpen, }: ClientRowsProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/ClientRows.js

@@ -0,0 +1,46 @@
+import { jsxs as _jsxs, jsx as _jsx } 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";
+import { useSyncExternalStore } from "react";
+import { useParakeetInteractions } from "../conversation.js";
+const rowColors = {
+    attention: "text-warning",
+    running: "text-info",
+    error: "text-error",
+    settled: "text-success",
+    muted: "text-dim",
+};
+/** Render admitted data; commands and request state remain in Parakeet headless. */
+export function ClientRows({ entryId, rows, actions, onOpen, }) {
+    const store = useParakeetInteractions();
+    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
+                                            ? 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)
+                                    onOpen?.(row.open);
+                            }, children: "Open" })), row.actions?.map((action) => {
+                            const state = actions.state.get(action);
+                            return (_jsx(Button, { size: "xs", variant: "outline", className: "shrink-0", disabled: !actions.enabled || state?.pending === true, loading: state?.pending === true, onClick: () => {
+                                    void actions.execute(entryId, action);
+                                }, children: action.label }, action.id));
+                        })] }), row.inspection !== undefined &&
+                    inspection?.entryId === entryId &&
+                    inspection.rowId === row.id ? (_jsxs("section", { "aria-label": row.title, "data-client-inspection": row.id, children: [_jsx(DataListHeading, { aside: _jsx(Button, { size: "xs", variant: "ghost", onClick: () => {
+                                    store.inspect(undefined);
+                                }, children: "Close" }), children: row.title }), _jsx(DataList, { density: "compact", tabIndex: 0, className: "max-h-64 overflow-y-auto overscroll-contain", children: row.inspection.rows.map((child) => (_jsxs(DataRow, { children: [_jsx(Status, { glyph: "dot", size: "compact", tone: child.tone === "settled"
+                                            ? "success"
+                                            : child.tone === "running"
+                                                ? "info"
+                                                : child.tone === "error"
+                                                    ? "error"
+                                                    : child.tone === "attention"
+                                                        ? "warning"
+                                                        : "neutral", label: child.title }), child.detail === undefined ? null : (_jsx("span", { children: child.detail }))] }, child.id))) })] })) : null, row.actions?.map((action) => {
+                    const error = actions.state.get(action)?.error;
+                    return error === undefined ? null : (_jsx("p", { className: "text-error", role: "alert", children: error }, action.id));
+                })] }, row.id))) }));
+}

package/dist/components/CodeBlock.d.ts

@@ -0,0 +1,11 @@
+import { type CSSProperties, type ReactNode } from "react";
+export type CodeBlockProps = {
+    className?: string;
+    content: string;
+    header?: ReactNode;
+    hideCopy?: boolean;
+    language?: string;
+    maxHeight?: string;
+    style?: CSSProperties;
+};
+export declare function CodeBlock({ className, content, header, hideCopy, language, maxHeight, style, }: CodeBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/CodeBlock.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Check, Copy } from "lucide-react";
+import { useState } from "react";
+import { reportFailure } from "../lib/failure.js";
+import { highlightToHtml } from "@fungi.computer/caps/lib/tanstack-highlight";
+const HIGHLIGHT_THRESHOLD = 10_000;
+export function CodeBlock({ className, content, header, hideCopy, language, maxHeight = "320px", style, }) {
+    const [copyState, setCopyState] = useState("idle");
+    const handleCopy = async () => {
+        try {
+            await navigator.clipboard.writeText(content);
+            setCopyState("copied");
+            setTimeout(() => {
+                setCopyState("idle");
+            }, 1500);
+        }
+        catch (cause) {
+            reportFailure("copy code to clipboard", cause);
+            setCopyState("failed");
+        }
+    };
+    const shouldHighlight = Boolean(language) && content.length <= HIGHLIGHT_THRESHOLD;
+    const innerHtml = shouldHighlight ? highlightToHtml(content, language) : null;
+    const containerStyle = {
+        background: "var(--stipe-surface)",
+        border: "1px solid var(--color-base-300)",
+        color: "var(--color-base-content)",
+        ...style,
+    };
+    return (_jsxs("div", { className: `relative not-prose ${className ?? ""}`, style: containerStyle, children: [header ? (_jsx("div", { className: "text-dim px-2 pt-1.5 pb-1 text-[9px] uppercase tracking-wider", children: header })) : null, !hideCopy ? (_jsx("button", { "aria-label": "Copy to clipboard", className: "btn btn-circle btn-ghost btn-xs text-dim absolute top-1 right-1 z-10 hover:text-base-content", onClick: () => {
+                    void handleCopy();
+                }, type: "button", children: copyState === "copied" ? _jsx(Check, { size: 10 }) : _jsx(Copy, { size: 10 }) })) : null, !hideCopy ? (_jsx("span", { "aria-live": "polite", className: "sr-only", role: "status", children: copyState === "failed" ? "Copy to clipboard failed." : null })) : null, _jsx("div", { className: "overflow-y-auto text-[10px]", "data-scrollable": true, style: {
+                    maxHeight: maxHeight === "0" ? undefined : maxHeight,
+                    padding: "6px 4px",
+                }, children: innerHtml === null ? (_jsxs("pre", { className: "whitespace-pre-wrap break-words font-mono text-base-content", style: { margin: 0 }, children: [content, content.length > HIGHLIGHT_THRESHOLD ? (_jsx("span", { className: "text-dim ml-2 italic", children: "(syntax highlighting skipped for very long content)" })) : null] })) : (_jsx("div", { 
+                    // TanStack Highlight escapes source text; output is token spans.
+                    dangerouslySetInnerHTML: { __html: innerHtml } })) })] }));
+}

package/dist/components/InteractionPanel.d.ts

@@ -0,0 +1,15 @@
+import type { WhistleInteractionHost } from "@fungi.computer/whistle/interaction";
+/** The interaction to draw and the page's close and retry callbacks. */
+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;

package/dist/components/InteractionPanel.js

@@ -0,0 +1,42 @@
+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 { 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";
+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) => {
+                        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 }))] })) })] }));
+    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" })] })] }));
+    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) => {
+                        setText(event.target.value);
+                    } }) }), _jsx("div", { className: "flex justify-end", children: _jsx(Button, { type: "submit", children: "Continue" }) })] }));
+}
+/**
+ * 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, }) {
+    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 ??
+                                (state.handoff.code === undefined
+                                    ? "Continue in your browser"
+                                    : "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] })] }));
+}

package/dist/components/MarkdownRenderer.d.ts

@@ -0,0 +1,6 @@
+export type MarkdownRendererProps = {
+    children: string;
+    policy?: "session" | "visitor" | undefined;
+};
+export declare const MarkdownPolicyContext: import("react").Context<"session" | "visitor">;
+export declare function MarkdownRenderer({ children, policy }: MarkdownRendererProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/MarkdownRenderer.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Markdown } from "@fungi.computer/caps/components/markdown";
+import { cn } from "@fungi.computer/caps/lib/cn";
+import { createContext, useContext } from "react";
+export const MarkdownPolicyContext = createContext("session");
+const components = {
+    blockquote({ children }) {
+        return (_jsx("blockquote", { className: "text-dim my-2 border-l-2 border-primary pl-3 italic", children: children }));
+    },
+    pre({ children, className, ...props }) {
+        return (_jsx("pre", { ...props, className: cn("whitespace-pre-wrap break-words", className), children: children }));
+    },
+    img({ alt, src }) {
+        const source = src ?? "";
+        if (source.startsWith("/")) {
+            return (_jsxs("div", { className: "my-2 px-3 py-2 font-mono text-[10px]", style: {
+                    background: "var(--stipe-surface-selected)",
+                    border: "1px solid var(--color-base-300)",
+                }, children: [_jsx("span", { className: "text-dim", children: alt ?? "Generated image" }), _jsx("span", { className: "text-dim mx-2", children: "\u00B7" }), _jsx("span", { style: { color: "var(--color-base-content)" }, children: source })] }));
+        }
+        return (_jsx("img", { alt: alt ?? "Image", className: "my-2 max-w-full", src: source, style: { maxHeight: 400 } }));
+    },
+    strong({ children }) {
+        return _jsx("strong", { className: "font-semibold text-primary", children: children });
+    },
+    table({ children }) {
+        return (_jsx("table", { className: "my-2 w-full border-collapse text-xs", children: children }));
+    },
+    thead({ children }) {
+        return (_jsx("thead", { style: { background: "var(--stipe-surface-selected)" }, children: children }));
+    },
+    th({ children }) {
+        return (_jsx("th", { className: "border px-3 py-2 text-left font-semibold", style: { borderColor: "var(--color-base-300)" }, children: children }));
+    },
+    td({ children }) {
+        return (_jsx("td", { className: "border px-3 py-2", style: { borderColor: "var(--color-base-300)" }, children: children }));
+    },
+    tr({ children }) {
+        return _jsx("tr", { children: children });
+    },
+    tbody({ children }) {
+        return _jsx("tbody", { children: children });
+    },
+};
+export function MarkdownRenderer({ children, policy }) {
+    const inheritedPolicy = useContext(MarkdownPolicyContext);
+    return (_jsx(Markdown, { className: "markdown-renderer", components: components, frontmatter: false, policy: (policy ?? inheritedPolicy) === "visitor" ? "visitor" : "default", typography: "inherit", children: children }));
+}

package/dist/components/RunFailureNotice.d.ts

@@ -0,0 +1,7 @@
+import type { ComposerController } from "../conversation.js";
+/** Session failures do not carry a billing receipt; never promise a refund. */
+export declare function RunFailureNotice({ failure, cause, onRetry, }: Readonly<{
+    failure: NonNullable<ComposerController["failure"]>;
+    cause?: string | undefined;
+    onRetry: () => void;
+}>): import("react/jsx-runtime").JSX.Element;

package/dist/components/RunFailureNotice.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Alert } from "@fungi.computer/caps/components/alert";
+import { Button } from "@fungi.computer/caps/components/button";
+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.",
+    interrupted: "The worker stopped before this run finished. Your prompt is still here.",
+    cancelled: "The run was cancelled. Send a new prompt when you’re ready.",
+};
+/** 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" })) }));
+}

package/dist/components/ShiitakeAvatar.d.ts

@@ -0,0 +1,19 @@
+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. */
+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.
+ */
+export declare const ShiitakeAvatar: import("react").NamedExoticComponent<{
+    /** The open conversation's avatar; omitted or `null` draws the mascot. */
+    avatar?: Avatar | null;
+    /** Replaces the default 3rem size, for a host that sizes the head itself. */
+    className?: string;
+    /** Replaces the shared Shiitake service; a faithful fake for tests. */
+    service?: SpriteService;
+    /** Activity and expression presented by the avatar. */
+    state: AvatarState;
+}>;

package/dist/components/ShiitakeAvatar.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import {} from "@fungi.computer/sprite";
+import { Sprite } from "@fungi.computer/sprite/react";
+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.
+ */
+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]);
+    return (_jsx(Sprite, { "aria-hidden": "true", className: className, service: service, src: presentation?.src ?? { local: "mushroom" }, ...(presentation
+            ? {
+                appearance: presentation.appearance,
+                renderStyle: presentation.renderStyle,
+            }
+            : {}), ...state }));
+});

package/dist/components/SlashMenu.d.ts

@@ -0,0 +1,8 @@
+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. */
+export declare function SlashMenu({ slash, listId, }: Readonly<{
+    slash: SlashCommandController;
+    listId: string;
+}>): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/SlashMenu.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PopoverOption } from "@fungi.computer/caps/components/popover";
+/** Split a label into matched and unmatched runs (UTF-16 indices, like the matcher). */
+function emphasize(label, matches) {
+    if (matches.length === 0)
+        return label;
+    const marked = new Set(matches);
+    const runs = [];
+    for (let index = 0; index < label.length; index += 1) {
+        const isMarked = marked.has(index);
+        const last = runs.at(-1);
+        if (last?.marked === isMarked)
+            last.text += label.charAt(index);
+        else
+            runs.push({ text: label.charAt(index), marked: isMarked, start: index });
+    }
+    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. */
+export function SlashMenu({ slash, listId, }) {
+    const { completion, selected } = slash;
+    if (completion.kind === "none")
+        return null;
+    const rows = completion.kind === "commands"
+        ? completion.items.map((item) => ({
+            key: item.command.commandId + item.label,
+            label: emphasize(item.label, item.matches),
+            detail: item.command.grammar === undefined
+                ? item.command.title
+                : `${item.command.title} · ${item.command.grammar.hint}`,
+            keys: item.command.keys.join(", "),
+            disabled: item.command.availability.status === "unavailable",
+        }))
+        : completion.items.map((item) => ({
+            key: item.label,
+            label: emphasize(item.label, item.matches),
+            detail: item.word.description ?? "",
+            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))) }))] }));
+}

package/dist/components/ThinkingBlock.d.ts

@@ -0,0 +1,3 @@
+export declare const ThinkingBlock: import("react").NamedExoticComponent<{
+    thinking: string;
+}>;

package/dist/components/ThinkingBlock.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronRight } from "lucide-react";
+import { memo, useState } from "react";
+import { MarkdownRenderer } from "./MarkdownRenderer.js";
+export const ThinkingBlock = memo(function ThinkingBlock({ thinking, }) {
+    const [expanded, setExpanded] = useState(false);
+    return (_jsxs("div", { children: [_jsxs("button", { "aria-expanded": expanded, className: "flex h-8 w-full items-center gap-2 px-3 text-left text-[10px] uppercase tracking-wider transition-colors", onClick: () => {
+                    setExpanded((previous) => !previous);
+                }, style: {
+                    color: "var(--stipe-fg-muted)",
+                    fontFamily: "var(--font-sans)",
+                    fontStyle: "italic",
+                }, type: "button", children: ["Thoughts", _jsx("span", { "aria-hidden": "true", className: "btn btn-circle btn-ghost btn-xs ml-auto text-dim", style: { transform: expanded ? "rotate(90deg)" : "rotate(0deg)" }, children: _jsx(ChevronRight, { size: 12 }) })] }), expanded ? (_jsx("div", { className: "max-w-[80ch] break-words px-3 pb-2 text-[11px]", style: {
+                    color: "var(--stipe-fg-muted)",
+                    fontFamily: "var(--font-sans)",
+                    fontStyle: "italic",
+                }, children: _jsx(MarkdownRenderer, { children: thinking }) })) : null] }));
+});