@jini-ai/chat 0.6.6 → 0.6.7

package/dist/react/components/MessageList.js

@@ -10,25 +10,49 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * scroll-anchoring state lives in `useMessageListAutoScroll`
  * (`MessageList.hooks.ts`); see that file for why it is presentational.
  */
-import { memo } from 'react';
+import { memo, useMemo } from 'react';
+import { projectAcceptedInputMessages } from '../../core/accepted-input.js';
 import { isTerminalRunStatus } from '../../core/index.js';
 import { useT } from '../hooks/context.js';
 import { useMessageListAutoScroll, useConversationUsage } from './MessageList.hooks.js';
 import { MessageRow } from './MessageRow.js';
+import { SentAttachmentButton } from './SentAttachment.js';
+import { AttachmentPreviewModal } from './AttachmentPreviewModal.js';
+import { useAttachmentGallery } from './AttachmentGallery.hooks.js';
+function renderMessageRow({ message, isLast, isStreaming, usageSummary }, { activeQuestionFormMessageId, questionFormSubmittedAnswersByMessageId, onQuestionFormSubmit, ...rowProps } = {}) {
+    const runStreaming = isLast && isStreaming && !isTerminalRunStatus({ status: message.runStatus });
+    return (_jsx(MessageRow, { message: message, ...rowProps, ...(usageSummary === undefined ? {} : { usageSummary }), runStreaming: runStreaming, runSucceeded: message.runStatus === 'succeeded', questionFormInteractive: message.id === activeQuestionFormMessageId, ...(questionFormSubmittedAnswersByMessageId?.[message.id] !== undefined ? { questionFormSubmittedAnswers: questionFormSubmittedAnswersByMessageId[message.id] } : {}), ...(onQuestionFormSubmit !== undefined ? { onQuestionFormSubmit: (text, answers) => onQuestionFormSubmit(message.id, text, answers) } : {}) }, message.id));
+}
 /**
  * Memoized: the pane re-renders on every composer keystroke, and re-rendering a long transcript
  * (hundreds of tool rows, MCP-UI cards, markdown) per key made typing lag (owner report
- * 2026-10-08). Callers must pass stable props — `ChatPane` memoizes `pendingPrompt` and
+ * 2026-10-08). Callers must pass stable props — `ChatPane` memoizes `pendingPrompts` and
  * `projectFileNames` for exactly this.
  */
-export const MessageList = memo(function MessageList({ messages, isStreaming = false, scrollIntent = false, onScrolled, activeQuestionFormMessageId = null, questionFormSubmittedAnswersByMessageId, onQuestionFormSubmit, projectFileNames, onRequestOpenFile, renderAttachment, showUsageTotal = true, showUsageLine = true, toolCallDisplay = 'show', showThinking = false, pendingPrompt = null, }) {
-    const t = useT();
+export const MessageList = memo(function MessageList({ messages: sourceMessages, isStreaming = false, scrollIntent = false, onScrolled, pendingPrompt, pendingPrompts, ...rowProps }) {
+    const messages = useMemo(() => projectAcceptedInputMessages({ messages: sourceMessages }), [sourceMessages]);
     const usageByMessage = useConversationUsage({ messages });
-    const { containerRef, onScroll } = useMessageListAutoScroll({ messages, scrollIntent }, onScrolled !== undefined ? { onScrolled } : {});
-    return (_jsxs("div", { className: "jini-message-list", ref: containerRef, onScroll: onScroll, "data-agent-element": "chat-transcript", "data-agent-role": "list", "data-agent-label": "The conversation transcript, oldest message first", children: [messages.map((message) => {
-                const isLast = message.id === messages[messages.length - 1]?.id;
-                const runStreaming = isLast && isStreaming && !isTerminalRunStatus({ status: message.runStatus });
-                return (_jsx(MessageRow, { message: message, ...(usageByMessage.has(message.id) ? { usageSummary: usageByMessage.get(message.id) } : {}), showUsageTotal: showUsageTotal, showUsageLine: showUsageLine, toolCallDisplay: toolCallDisplay, showThinking: showThinking, runStreaming: runStreaming, runSucceeded: message.runStatus === 'succeeded', questionFormInteractive: message.id === activeQuestionFormMessageId, ...(questionFormSubmittedAnswersByMessageId?.[message.id] !== undefined ? { questionFormSubmittedAnswers: questionFormSubmittedAnswersByMessageId[message.id] } : {}), ...(onQuestionFormSubmit !== undefined ? { onQuestionFormSubmit: (text, answers) => onQuestionFormSubmit(message.id, text, answers) } : {}), ...(projectFileNames !== undefined ? { projectFileNames } : {}), ...(onRequestOpenFile !== undefined ? { onRequestOpenFile } : {}), ...(renderAttachment !== undefined ? { renderAttachment } : {}) }, message.id));
-            }), pendingPrompt ? (_jsxs("div", { className: "jini-chat-pane__queued", role: "status", "aria-label": t('Message queued — not yet sent, will send once the current run finishes'), "data-testid": "chat-pane-queued", "data-agent-element": "chat-message-pending", "data-agent-role": "region", "data-agent-label": "A message queued to send once the current run finishes", children: [_jsx("div", { className: "jini-chat-pane__queued-text", children: pendingPrompt.text }), _jsx("div", { className: "jini-chat-pane__queued-actions", children: _jsx("button", { type: "button", className: "jini-chat-pane__queued-cancel", onClick: pendingPrompt.onCancel, title: t('Cancel queued message'), children: t('Cancel') }) })] })) : null] }));
+    const { containerRef, onScroll, awayFromLatest, jumpToLatest } = useMessageListAutoScroll({ messages, scrollIntent }, onScrolled !== undefined ? { onScrolled } : {});
+    return (_jsxs("div", { className: "jini-message-list", ref: containerRef, onScroll: onScroll, "data-agent-element": "chat-transcript", "data-agent-role": "list", "data-agent-label": "The conversation transcript, oldest message first", children: [messages.map((message) => renderMessageRow({
+                message,
+                isLast: message.id === messages[messages.length - 1]?.id,
+                isStreaming,
+                usageSummary: usageByMessage.get(message.id),
+            }, rowProps)), (pendingPrompts ?? (pendingPrompt ? [pendingPrompt] : [])).map((prompt, index) => (_jsx(QueuedMessage, { prompt: prompt, renderAttachment: rowProps.renderAttachment }, prompt.id ?? index))), awayFromLatest && _jsx(JumpToLatest, { onJump: jumpToLatest })] }));
 });
+/**
+ * Sticky, zero-height last child of the scroll container, so the button floats centred just above
+ * the composer without a wrapper element changing the pane's flex layout.
+ */
+function JumpToLatest({ onJump }) {
+    const t = useT();
+    return (_jsx("div", { className: "jini-message-list__jump", children: _jsxs("button", { type: "button", className: "jini-message-list__jump-btn", onClick: onJump, children: [_jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("path", { d: "M12 5v14" }), _jsx("path", { d: "m19 12-7 7-7-7" })] }), t('Jump to latest')] }) }));
+}
+/** One cancelable queue receipt; attachment rendering reuses the sent-message preview owner. */
+function QueuedMessage({ prompt, renderAttachment }) {
+    const t = useT();
+    const attachments = prompt.attachments ?? [];
+    const gallery = useAttachmentGallery({ attachments });
+    return (_jsxs("div", { className: "jini-chat-pane__queued", role: "status", "aria-label": t('Message queued — not yet sent, will send once the current run finishes'), "data-testid": "chat-pane-queued", "data-agent-element": "chat-message-pending", "data-agent-role": "region", "data-agent-label": "A message queued to send once the current run finishes", children: [_jsx("div", { children: t('Queued — sends when this reply finishes') }), _jsx("div", { className: "jini-chat-pane__queued-text", children: prompt.text }), attachments.length > 0 && _jsx("div", { className: "jini-message-attachments", children: attachments.map(attachment => _jsx(SentAttachmentButton, { attachment: attachment, onOpen: gallery.open, renderAttachment: renderAttachment }, attachment.path)) }), gallery.opened !== null && _jsx(AttachmentPreviewModal, { attachment: gallery.opened, onClose: gallery.close, navigation: gallery.navigation }), _jsx("div", { className: "jini-chat-pane__queued-actions", children: _jsx("button", { type: "button", className: "jini-chat-pane__queued-cancel", onClick: () => prompt.onCancel(), title: t('Cancel queued message'), children: t('Cancel') }) })] }));
+}
 //# sourceMappingURL=MessageList.js.map

package/dist/react/components/MessageRow.js

@@ -1,4 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { projectAcceptedInputEvents } from '../../core/accepted-input.js';
+import { MidRunUserMessage, MID_RUN_USER_MESSAGE_EXT_EVENT_NAME } from './MidRunUserMessage.js';
 import { terminalMessageNotice, continuingRunNotice } from '../../core/durable-projection.js';
 import { usageLayout, usageLineMeetsActions, useMessageUsage, useUsageSummary } from './MessageRow.usage.js';
 /**
@@ -51,7 +53,7 @@ import { usageLayout, usageLineMeetsActions, useMessageUsage, useUsageSummary }
  * not appear until the whole message is done, not merely until its current
  * chunk stopped arriving.
  */
-import React, { memo } from 'react';
+import React, { memo, useMemo } from 'react';
 import { isAwaitingAnswer, isTerminalRunStatus, splitOnQuestionForms, stripArtifact } from '../../core/index.js';
 import { useToolTimeline } from '../hooks/useToolTimeline.js';
 import { useExtEventGroups } from '../hooks/useExtEventGroups.js';
@@ -164,24 +166,31 @@ const NO_ATTACHMENTS = [];
  * re-renders per composer keystroke) only re-renders rows whose props actually changed. Messages
  * are replaced, never mutated, so identity is a sound change signal.
  */
-export const MessageRow = memo(function MessageRow({ message, usageSummary, showUsageTotal = true, showUsageLine = true, toolCallDisplay = 'show', showThinking = false, runStreaming = false, runSucceeded = false, questionFormInteractive = false, questionFormSubmittedAnswers, onQuestionFormSubmit, projectFileNames, onRequestOpenFile, renderAttachment, }) {
+export const MessageRow = memo(function MessageRow({ showUsageTotal = true, showUsageLine = true, toolCallDisplay = 'show', showThinking = false, runStreaming = false, runSucceeded = false, questionFormInteractive = false, ...props }) {
+    const message = useMemo(() => props.message.events === undefined ? props.message : {
+        ...props.message, events: projectAcceptedInputEvents({ events: props.message.events }),
+    }, [props.message]);
+    if (message.role === 'user')
+        return _jsx(UserMessageRow, { ...props, message: message });
+    return _jsx(AssistantMessageRow, { ...props, message: message, showUsageTotal, showUsageLine, toolCallDisplay, showThinking, runStreaming, runSucceeded, questionFormInteractive });
+});
+function UserMessageRow({ message, renderAttachment }) {
     const t = useT();
-    const registry = useExtEventRendererRegistry();
-    const messageUsage = useMessageUsage({ message, ...(usageSummary === undefined ? {} : { summary: usageSummary }) });
-    const timeline = useToolTimeline({ events: message.events }, { runStreaming, runSucceeded });
-    const extGroups = useExtEventGroups({ events: message.events }, { slotOf: (name, data) => registry.slot({ name, data }) });
-    const answeredCards = useAnsweredCards({ slotOf: registry.slot });
     // Which attachment chip (if any) this row's preview modal is open for. Row-local, not
     // module-level: two attachments in the same message can never be "open" at once, but two
     // different messages opening their own attachments independently is fine and expected.
     // Previous/next steps through this message's images only.
     const gallery = useAttachmentGallery({ attachments: message.attachments ?? NO_ATTACHMENTS });
-    if (message.role === 'user') {
-        return (_jsxs("div", { className: "jini-message jini-message-user", "data-message-id": message.id, "data-agent-element": `chat-message-${message.id}`, "data-agent-role": "region", "data-agent-label": "A message from the user", children: [message.attachments && message.attachments.length > 0 ? (_jsx("div", { className: "jini-message-attachments", children: message.attachments.map((a) => (_jsx(SentAttachmentButton, { attachment: a, onOpen: gallery.open, renderAttachment: renderAttachment }, a.path))) })) : null, _jsx("div", { className: "jini-message-content", children: message.content }), _jsx("div", { className: "jini-message-actions jini-message-actions--user", children: _jsx(CopyMessageButton, { text: message.content, label: t('Copy message') }) }), gallery.opened ? (_jsx(AttachmentPreviewModal, { attachment: gallery.opened, onClose: gallery.close, navigation: gallery.navigation })) : null] }));
-    }
+    return (_jsxs("div", { className: "jini-message jini-message-user", "data-message-id": message.id, "data-agent-element": `chat-message-${message.id}`, "data-agent-role": "region", "data-agent-label": "A message from the user", children: [message.attachments && message.attachments.length > 0 ? (_jsx("div", { className: "jini-message-attachments", children: message.attachments.map((a) => (_jsx(SentAttachmentButton, { attachment: a, onOpen: gallery.open, renderAttachment: renderAttachment }, a.path))) })) : null, _jsx("div", { className: "jini-message-content", children: message.content }), _jsx("div", { className: "jini-message-actions jini-message-actions--user", children: _jsx(CopyMessageButton, { text: message.content, label: t('Copy message') }) }), gallery.opened ? (_jsx(AttachmentPreviewModal, { attachment: gallery.opened, onClose: gallery.close, navigation: gallery.navigation })) : null] }));
+}
+function AssistantMessageRow({ message, usageSummary, showUsageTotal, showUsageLine, toolCallDisplay, showThinking, runStreaming, runSucceeded, questionFormInteractive, questionFormSubmittedAnswers, onQuestionFormSubmit, projectFileNames, onRequestOpenFile, }) {
+    const registry = useExtEventRendererRegistry();
+    const messageUsage = useMessageUsage({ message, ...(usageSummary === undefined ? {} : { summary: usageSummary }) });
+    const timeline = useToolTimeline({ events: message.events }, { runStreaming, runSucceeded });
+    const extGroups = useExtEventGroups({ events: message.events }, { slotOf: (name, data) => registry.slot({ name, data }) });
+    const answeredCards = useAnsweredCards({ slotOf: registry.slot, events: message.events ?? [], groups: extGroups, runStreaming, runStatus: message.runStatus });
     const terminalNotice = terminalMessageNotice({ message }, {});
     const visibleContent = stripArtifact({ content: message.content });
-    const segments = splitOnQuestionForms({ input: visibleContent });
     const blocks = messageBlocks({ visibleContent, message, rows: timeline.rows, registry }, { toolCallDisplay, includeThinking: showThinking });
     const pending = isPendingWithNoContent(message, visibleContent, timeline.rows.length);
     const runInProgress = isRunInProgress(message.runStatus);
@@ -196,18 +205,24 @@ export const MessageRow = memo(function MessageRow({ message, usageSummary, show
     const flatToolRows = toolRowsForDisplay({ rows: timeline.rows, mode: toolCallDisplay });
     const renderExtGroup = (group) => {
         const renderer = registry.get({ name: group.name });
+        if (!renderer && group.name === MID_RUN_USER_MESSAGE_EXT_EVENT_NAME)
+            return _jsx(MidRunUserMessage, { events: group.events });
         if (!renderer)
             return null;
+        const answerText = answeredCards.answerText(group.slot);
         const node = renderer({
             name: group.name,
             events: group.events,
-            runStreaming,
+            runStreaming: answeredCards.runStreaming,
             runSucceeded,
             awaitingAnswer,
             runId: message.runId,
             ...(group.call === undefined ? {} : { call: group.call }),
             answered: answeredCards.isAnswered(group.slot),
             onAnswered: () => answeredCards.markAnswered(group.slot),
+            onAnswerText: (text) => answeredCards.markAnswered(group.slot, text),
+            ...(answeredCards.isRecorded(group.slot) ? { answerRecorded: true } : {}),
+            ...(answerText === undefined ? {} : { answerText }),
         });
         if (!node)
             return null;
@@ -218,28 +233,29 @@ export const MessageRow = memo(function MessageRow({ message, usageSummary, show
         _jsx(ExtEventErrorBoundary, { name: group.name, children: _jsx("div", { children: node }) }, `${group.slot}:${group.events.length}`));
     };
     const renderTextSegments = (text, keyPrefix) => splitOnQuestionForms({ input: text }).map((segment, i) => segment.kind === 'text' ? (segment.text.trim() ? (_jsx("div", { className: "jini-message-content", children: _jsx(Markdown, { children: segment.text }) }, `${keyPrefix}-${i}`)) : null) : (_jsx(QuestionForm, { form: segment.form, interactive: questionFormInteractive, ...(questionFormSubmittedAnswers !== undefined ? { submittedAnswers: questionFormSubmittedAnswers } : {}), ...(onQuestionFormSubmit !== undefined ? { onSubmit: onQuestionFormSubmit } : {}) }, `${keyPrefix}-${i}`)));
+    const renderBlock = (block) => {
+        if (block.kind === 'text') {
+            return _jsx(React.Fragment, { children: renderTextSegments(block.text, block.key) }, block.key);
+        }
+        if (block.kind === 'reply-end') {
+            const reply = usage.replies[block.index];
+            return reply && showUsageLine ? _jsx(UsageSummary, { usage: reply, showTotal: showUsageTotal }, block.key) : null;
+        }
+        if (block.kind === 'tools')
+            return renderTools(block.rows, block.key);
+        if (block.kind === 'thinking')
+            return _jsx(ThinkingBlock, { text: block.text }, block.key);
+        const group = extGroups.find((g) => g.slot === block.slot);
+        if (!group)
+            return null;
+        return (_jsx("div", { className: "jini-message-ext-events", children: renderExtGroup(group) }, block.key));
+    };
     return (_jsxs("div", { className: usageLineMeetsActions({ footer: footerUsage, terminalNotice, pending, runInProgress }, { showTotal: showUsageTotal })
             ? 'jini-message jini-message-assistant jini-message-assistant--usage-actions'
             : 'jini-message jini-message-assistant', "data-message-id": message.id, "data-run-status": message.runStatus, "data-agent-element": `chat-message-${message.id}`, "data-agent-role": "region", "data-agent-label": "A reply from the assistant", children: [message.agentName ? _jsx("div", { className: "jini-message-agent", children: message.agentName }) : null, blocks
-                ? blocks.map((block) => {
-                    if (block.kind === 'text') {
-                        return _jsx(React.Fragment, { children: renderTextSegments(block.text, block.key) }, block.key);
-                    }
-                    if (block.kind === 'reply-end') {
-                        const reply = usage.replies[block.index];
-                        return reply && showUsageLine ? _jsx(UsageSummary, { usage: reply, showTotal: showUsageTotal }, block.key) : null;
-                    }
-                    if (block.kind === 'tools')
-                        return renderTools(block.rows, block.key);
-                    if (block.kind === 'thinking')
-                        return _jsx(ThinkingBlock, { text: block.text }, block.key);
-                    const group = extGroups.find((g) => g.slot === block.slot);
-                    if (!group)
-                        return null;
-                    return (_jsx("div", { className: "jini-message-ext-events", children: renderExtGroup(group) }, block.key));
-                })
-                : (_jsxs(_Fragment, { children: [segments.map((segment, i) => segment.kind === 'text' ? (segment.text.trim() ? (_jsx("div", { className: "jini-message-content", children: _jsx(Markdown, { children: segment.text }) }, i)) : null) : (_jsx(QuestionForm, { form: segment.form, interactive: questionFormInteractive, ...(questionFormSubmittedAnswers !== undefined ? { submittedAnswers: questionFormSubmittedAnswers } : {}), ...(onQuestionFormSubmit !== undefined ? { onSubmit: onQuestionFormSubmit } : {}) }, i))), flatToolRows.length > 0 ? renderTools(flatToolRows) : null, extGroups.length > 0 ? _jsx("div", { className: "jini-message-ext-events", children: extGroups.map(renderExtGroup) }) : null] })), _jsx(AssistantMessageFooter, { message, usageEvent: footerUsage, showUsageTotal, terminalNotice, pending, runInProgress, runStreaming, visibleContent, isAnsweredCard: answeredCards.isAnsweredCard })] }));
-});
+                ? blocks.map(renderBlock)
+                : (_jsxs(_Fragment, { children: [renderTextSegments(visibleContent, 'text'), flatToolRows.length > 0 ? renderTools(flatToolRows) : null, extGroups.length > 0 ? _jsx("div", { className: "jini-message-ext-events", children: extGroups.map(renderExtGroup) }) : null] })), _jsx(AssistantMessageFooter, { message, usageEvent: footerUsage, showUsageTotal, terminalNotice, pending, runInProgress, runStreaming, visibleContent, isAnsweredCard: answeredCards.isAnsweredCard })] }));
+}
 /**
  * The live "what is it doing" line under a running reply (see `core/run-activity.ts`). Replaces the
  * old "Thinking…" placeholder, which vanished for good as soon as the first tool row appeared.

package/dist/react/components/MessageRow.usage.js

@@ -33,19 +33,24 @@ export function usageLineMeetsActions({ footer, terminalNotice, pending, runInPr
  * the current turn's cost is unknown. `showTotal: false` turns the total off. */
 export function useUsageSummary({ usage }, { showTotal = true } = {}) {
     const t = useT();
-    const parts = [];
-    if (usage.durationMs !== undefined) {
-        const seconds = Math.round(usage.durationMs / 1000);
-        parts.push(seconds >= 60 ? `${Math.floor(seconds / 60)}m ${seconds % 60}s` : `${seconds}s`);
-    }
-    if (usage.costUsd !== undefined) {
-        parts.push(formatUsageCost({ costUsd: usage.costUsd, ...(showTotal ? { totalCostUsd: usage.totalCostUsd ?? usage.costUsd } : {}) }));
-    }
-    else if (showTotal && usage.totalCostUsd !== undefined) {
-        parts.push(`total ${formatUsageCost({ costUsd: usage.totalCostUsd })}`);
-    }
+    const parts = [usageDuration({ durationMs: usage.durationMs }), usageCost({ usage }, { showTotal })]
+        .filter((part) => part !== undefined);
     const text = parts.join(' · ');
     const title = usage.outputTokens === undefined ? undefined : t('{n} out', { n: usage.outputTokens });
     return { text, title, ariaLabel: title === undefined ? undefined : `${t('Done')} · ${text} · ${title}` };
 }
+function usageDuration({ durationMs }, _options = {}) {
+    if (durationMs === undefined)
+        return undefined;
+    const seconds = Math.round(durationMs / 1000);
+    return seconds >= 60 ? `${Math.floor(seconds / 60)}m ${seconds % 60}s` : `${seconds}s`;
+}
+function usageCost({ usage }, { showTotal = true } = {}) {
+    if (usage.costUsd !== undefined) {
+        return formatUsageCost({ costUsd: usage.costUsd, ...(showTotal ? { totalCostUsd: usage.totalCostUsd ?? usage.costUsd } : {}) });
+    }
+    if (showTotal && usage.totalCostUsd !== undefined)
+        return `total ${formatUsageCost({ costUsd: usage.totalCostUsd })}`;
+    return undefined;
+}
 //# sourceMappingURL=MessageRow.usage.js.map

package/dist/react/components/MidRunUserMessage.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * @module MidRunUserMessage
  *
@@ -10,6 +10,10 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * It is an event of the assistant turn, not a `ChatMessage` of its own, because the agent folded it
  * into the turn it was already running — there is no separate reply to hang off it.
  */
+import { acceptedInputEvent } from '../../core/accepted-input.js';
+import { SentAttachmentButton } from './SentAttachment.js';
+import { AttachmentPreviewModal } from './AttachmentPreviewModal.js';
+import { useAttachmentGallery } from './AttachmentGallery.hooks.js';
 import { MID_RUN_USER_MESSAGE_EVENT_NAME } from '../../core/turn-usage.js';
 import { registerExtEventRenderer } from '../ext-event-renderer-registry.js';
 /** The ext-event name the daemon's mid-run `user_message` run event arrives under. One source with
@@ -25,10 +29,19 @@ export function midRunUserMessageSlotKey({ data }) {
 }
 /** The bubble for one mid-run message — the same classes as a sent user message, so it reads as one. */
 export function MidRunUserMessage({ events }) {
-    const text = field(events.at(-1), 'text');
+    const data = events.at(-1);
+    const text = field(data, 'text');
     if (text === undefined)
         return null;
-    return (_jsx("div", { className: "jini-message jini-message-user jini-message-user--mid-run", "data-agent-role": "region", "data-agent-label": "A message from the user, sent while the agent was working", children: _jsx("div", { className: "jini-message-content", children: text }) }));
+    const receipt = acceptedInputEvent({ event: { kind: 'ext', name: MID_RUN_USER_MESSAGE_EVENT_NAME, data } });
+    // MOVE: A single live delivery may contain several queued inputs; display their original receipts.
+    const inputs = receipt?.data.inputs ?? [{ id: field(data, 'id') ?? 'mid-run', text }];
+    return _jsx(_Fragment, { children: inputs.map(input => _jsx(MidRunInput, { input: input }, input.id)) });
+}
+function MidRunInput({ input }) {
+    const attachments = input.attachments ?? [];
+    const gallery = useAttachmentGallery({ attachments });
+    return (_jsxs("div", { className: "jini-message jini-message-user jini-message-user--mid-run", "data-agent-role": "region", "data-agent-label": "A message from the user, sent while the agent was working", children: [_jsx("div", { className: "jini-message-content", children: input.text }), attachments.length > 0 && _jsx("div", { className: "jini-message-attachments", children: attachments.map(attachment => _jsx(SentAttachmentButton, { attachment: attachment, onOpen: gallery.open }, attachment.path)) }), gallery.opened !== null && _jsx(AttachmentPreviewModal, { attachment: gallery.opened, onClose: gallery.close, navigation: gallery.navigation })] }));
 }
 /**
  * Registers {@link MidRunUserMessage} against the ext-event registry.

package/dist/react/components/QuestionForm.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { CREDENTIAL_CARD_GUIDANCE, SECRET_REDACTED_NOTICE } from '../../core/user-text-redaction.js';
 import { useUserTextGuard } from '../hooks/useUserTextGuard.js';
 /**
@@ -21,34 +21,46 @@ export const QuestionForm = forwardRef(function QuestionForm({ form: incomingFor
     const t = useT();
     const form = useMemo(() => withoutSecretQuestionDefaults({ form: incomingForm }), [incomingForm]);
     const guard = useUserTextGuard({ ...(redactUserText ? { redactUserText } : {}), ...(onSecretRedacted ? { onSecretRedacted } : {}) });
+    const locked = !interactive || !onSubmit || submittedAnswers !== undefined;
+    const state = useQuestionAnswers({ form, submittedAnswers, draftAnswers, locked }, { onDraftChange, onAnswerChange });
+    const currentAnswers = submittedAnswers ? redactQuestionAnswers({ form, answers: submittedAnswers }).answers : state.answers;
+    const ready = answersReady(form, currentAnswers);
+    function handleSubmit() {
+        if (locked || !onSubmit)
+            return;
+        if (!ready)
+            return;
+        const safe = redactQuestionAnswers({ form, answers: state.answers }, { ...(redactUserText ? { redactUserText } : {}), onSecretRedacted: guard.notifyRedaction });
+        state.setAnswers(safe.answers);
+        const files = collectFileSubmissions(form, state.fileAnswers);
+        if (files.length > 0)
+            onSubmit(formatFormAnswers({ form: form, answers: safe.answers }), safe.answers, files);
+        else
+            onSubmit(formatFormAnswers({ form: form, answers: safe.answers }), safe.answers);
+    }
+    function handleSkipAll() {
+        if (locked || !onSubmit)
+            return;
+        const empty = {};
+        onSubmit(formatFormAnswers({ form: form, answers: empty }), empty);
+    }
+    useImperativeHandle(ref, () => ({ submit: handleSubmit, skipAll: handleSkipAll }));
+    useEffect(() => {
+        onReadyChange?.(!locked && ready);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [onReadyChange, locked, ready]);
+    return (_jsxs("div", { className: `question-form${locked ? ' question-form-locked' : ''}`, "data-form-id": form.id, children: [_jsx(QuestionFormHead, { form: form, locked: locked }), _jsx("div", { className: "question-form-body", children: form.questions.map((q) => (_jsx(QuestionField, { q: q, value: currentAnswers[q.id], formId: form.id, locked: locked, t: t, ...state.handlers }, q.id))) }), guard.secretRedacted ? _jsx("div", { role: "status", children: t(SECRET_REDACTED_NOTICE) }) : null, hideInternalSubmit ? null : _jsx(QuestionFormFoot, { locked: locked, answered: submittedAnswers !== undefined, ready: ready, submitLabel: form.submitLabel, onSubmit: handleSubmit })] }));
+});
+/** Owns the editable answers plus the picked files; every edit is a no-op once the form is locked. */
+function useQuestionAnswers({ form, submittedAnswers, draftAnswers, locked }, { onDraftChange, onAnswerChange } = {}) {
     const initial = useMemo(() => buildInitialState(form, submittedAnswers, draftAnswers), [form, submittedAnswers, draftAnswers]);
     const [answers, setAnswers] = useState(initial);
     const [fileAnswers, setFileAnswers] = useState({});
-    const locked = !interactive || !onSubmit || submittedAnswers !== undefined;
-    const currentAnswers = submittedAnswers ? redactQuestionAnswers({ form, answers: submittedAnswers }).answers : answers;
     useEffect(() => {
         setFileAnswers({});
     }, [form.id]);
     useEffect(() => {
-        setAnswers((prev) => {
-            let changed = false;
-            const next = { ...prev };
-            for (const q of form.questions) {
-                if (next[q.id] !== undefined)
-                    continue;
-                changed = true;
-                if (submittedAnswers && submittedAnswers[q.id] !== undefined) {
-                    next[q.id] = canonicalizeQuestionValue(q, submittedAnswers[q.id]);
-                }
-                else if (q.defaultValue !== undefined) {
-                    next[q.id] = canonicalizeQuestionValue(q, q.defaultValue);
-                }
-                else {
-                    next[q.id] = emptyQuestionValue(q);
-                }
-            }
-            return changed ? next : prev;
-        });
+        setAnswers((prev) => backfillAnswers(prev, form, submittedAnswers));
     }, [form, submittedAnswers]);
     function update(id, value) {
         if (locked)
@@ -78,60 +90,111 @@ export const QuestionForm = forwardRef(function QuestionForm({ form: incomingFor
         const fixed = current.filter((entry) => questionValueIsKnown(q, entry));
         update(q.id, [...fixed, ...splitCustomEntries(raw)]);
     }
-    function handleSubmit() {
-        if (locked || !onSubmit)
-            return;
-        if (!ready)
-            return;
-        const safe = redactQuestionAnswers({ form, answers }, { ...(redactUserText ? { redactUserText } : {}), onSecretRedacted: guard.notifyRedaction });
-        setAnswers(safe.answers);
-        const files = collectFileSubmissions(form, fileAnswers);
-        if (files.length > 0)
-            onSubmit(formatFormAnswers({ form: form, answers: safe.answers }), safe.answers, files);
-        else
-            onSubmit(formatFormAnswers({ form: form, answers: safe.answers }), safe.answers);
-    }
-    function handleSkipAll() {
-        if (locked || !onSubmit)
-            return;
-        const empty = {};
-        onSubmit(formatFormAnswers({ form: form, answers: empty }), empty);
+    function selectFiles(q, list) {
+        const files = Array.from(list ?? []);
+        const names = files.map((file) => file.name);
+        setFileAnswers((current) => ({ ...current, [q.id]: files }));
+        update(q.id, q.multiple ? names : (names[0] ?? ''));
     }
+    return { answers, setAnswers, fileAnswers, handlers: { update, toggleCheckbox, updateCheckboxCustom, selectFiles } };
+}
+function answersReady(form, answers) {
     const withinSelectionLimits = form.questions.every((q) => {
         if (q.type !== 'checkbox' || q.maxSelections === undefined)
             return true;
-        const v = currentAnswers[q.id];
+        const v = answers[q.id];
         return !Array.isArray(v) || v.length <= q.maxSelections;
     });
     const requiredAnswered = form.questions.every((q) => {
         if (q.required !== true)
             return true;
-        const v = currentAnswers[q.id];
+        const v = answers[q.id];
         if (Array.isArray(v))
             return v.length > 0;
         return typeof v === 'string' && v.trim().length > 0;
     });
-    const ready = withinSelectionLimits && requiredAnswered;
-    useImperativeHandle(ref, () => ({ submit: handleSubmit, skipAll: handleSkipAll }));
-    useEffect(() => {
-        onReadyChange?.(!locked && ready);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [onReadyChange, locked, ready]);
-    return (_jsxs("div", { className: `question-form${locked ? ' question-form-locked' : ''}`, "data-form-id": form.id, children: [_jsxs("div", { className: "question-form-head", children: [_jsx("span", { className: "question-form-icon", "aria-hidden": true, children: "?" }), _jsxs("div", { className: "question-form-titles", children: [_jsx("div", { className: "question-form-title", children: form.title }), form.description ? _jsx("div", { className: "question-form-desc", children: form.description }) : null] }), locked ? _jsx("span", { className: "question-form-pill", children: t('Answered') }) : null] }), _jsx("div", { className: "question-form-body", children: form.questions.map((q) => {
-                    const value = currentAnswers[q.id];
-                    return (_jsxs("div", { className: "qf-field", children: [_jsxs("label", { className: "qf-label", children: [_jsx("span", { children: q.label }), q.required ? (_jsx("span", { className: "qf-required", "aria-label": t('required'), children: "*" })) : null] }), q.help ? _jsx("div", { className: "qf-help", children: q.help }) : null, isSecretQuestion({ question: q }) ? _jsx("div", { className: "qf-help", children: t(CREDENTIAL_CARD_GUIDANCE) }) : null, q.type === 'radio' && q.options ? (_jsx("div", { className: "qf-options", children: q.options.map((opt) => (_jsxs("label", { className: `qf-chip${value === opt.value ? ' qf-chip-on' : ''}`, title: opt.description, children: [_jsx("input", { type: "radio", name: `${form.id}-${q.id}`, value: opt.value, checked: value === opt.value, disabled: locked, "aria-label": opt.label, onChange: () => update(q.id, opt.value) }), _jsx(OptionCopy, { option: opt })] }, opt.value))) })) : null, q.type === 'radio' && q.options && shouldRenderCustomChoice(q) ? (_jsx(CustomChoiceInput, { label: q.customLabel ?? t('Something else'), value: customSingleValue(q, value), placeholder: q.customPlaceholder ?? t('Type your own answer'), disabled: locked, onChange: (next) => update(q.id, next) })) : null, q.type === 'checkbox' && q.options ? (_jsx("div", { className: "qf-options", children: q.options.map((opt) => {
-                                    const arr = Array.isArray(value) ? value : [];
-                                    const on = arr.includes(opt.value);
-                                    const maxed = q.maxSelections !== undefined && !on && arr.length >= q.maxSelections;
-                                    return (_jsxs("label", { title: opt.description, className: `qf-chip${on ? ' qf-chip-on' : ''}${maxed ? ' qf-chip-disabled' : ''}`, children: [_jsx("input", { type: "checkbox", value: opt.value, checked: on, disabled: locked || maxed, "aria-label": opt.label, onChange: () => toggleCheckbox(q.id, opt.value, q.maxSelections) }), _jsx(OptionCopy, { option: opt })] }, opt.value));
-                                }) })) : null, q.type === 'checkbox' && q.options && shouldRenderCustomChoice(q) ? (_jsx(CustomChoiceInput, { label: q.customLabel ?? t('Something else'), value: customCheckboxValue(q, value), placeholder: q.customPlaceholder ?? t('Type your own answer'), disabled: locked, onChange: (next) => updateCheckboxCustom(q, next) })) : null, q.type === 'select' && q.options ? (_jsxs("select", { className: "qf-select", value: typeof value === 'string' && questionValueIsKnown(q, value) ? value : '', disabled: locked, onChange: (e) => update(q.id, e.target.value), children: [_jsx("option", { value: "", disabled: true, children: q.placeholder ?? t('Choose one') }), q.options.map((opt) => (_jsx("option", { value: opt.value, title: opt.description, children: opt.label }, opt.value)))] })) : null, q.type === 'select' && q.options && shouldRenderCustomChoice(q) ? (_jsx(CustomChoiceInput, { label: q.customLabel ?? t('Something else'), value: customSingleValue(q, value), placeholder: q.customPlaceholder ?? t('Type your own answer'), disabled: locked, onChange: (next) => update(q.id, next) })) : null, q.type === 'text' ? _jsx("input", { ...questionTextInputProps({ question: q }), className: "qf-input", value: typeof value === 'string' ? value : '', placeholder: q.placeholder, disabled: locked, onChange: (e) => update(q.id, e.target.value) }) : null, q.type === 'number' ? _jsx("input", { type: "number", className: "qf-input", value: typeof value === 'string' ? value : '', placeholder: q.placeholder, min: q.min, max: q.max, step: q.step, disabled: locked, onChange: (e) => update(q.id, e.target.value) }) : null, q.type === 'range' ? (_jsxs("div", { className: "qf-range-wrap", children: [_jsx("input", { type: "range", className: "qf-range", value: typeof value === 'string' && value.trim() ? value : String(q.min ?? 0), min: q.min, max: q.max, step: q.step, disabled: locked, onChange: (e) => update(q.id, e.target.value) }), _jsx("output", { className: "qf-range-value", children: typeof value === 'string' && value.trim() ? value : String(q.min ?? 0) })] })) : null, q.type === 'date' || q.type === 'time' || q.type === 'datetime-local' ? _jsx("input", { type: q.type, className: "qf-input", value: typeof value === 'string' ? value : '', placeholder: q.placeholder, disabled: locked, onChange: (e) => update(q.id, e.target.value) }) : null, q.type === 'color' ? _jsx("input", { type: "color", className: "qf-color", value: normalizeColorInputValue(value), disabled: locked, onChange: (e) => update(q.id, e.target.value) }) : null, q.type === 'url' || q.type === 'email' || q.type === 'tel' ? _jsx("input", { type: q.type, className: "qf-input", value: typeof value === 'string' ? value : '', placeholder: q.placeholder, disabled: locked, onChange: (e) => update(q.id, e.target.value) }) : null, q.type === 'file' ? (_jsxs("div", { className: "qf-file-wrap", children: [_jsx("input", { type: "file", className: "qf-file", multiple: q.multiple, accept: q.accept, disabled: locked, onChange: (e) => {
-                                            const files = Array.from(e.target.files ?? []);
-                                            const names = files.map((file) => file.name);
-                                            setFileAnswers((current) => ({ ...current, [q.id]: files }));
-                                            update(q.id, q.multiple ? names : (names[0] ?? ''));
-                                        } }), fileValueLabel(value) ? _jsx("div", { className: "qf-file-summary", children: fileValueLabel(value) }) : null] })) : null, q.type === 'switch' ? (_jsxs("label", { className: "qf-switch", children: [_jsx("input", { type: "checkbox", role: "switch", checked: value === 'true', disabled: locked, onChange: (e) => update(q.id, e.target.checked ? 'true' : 'false') }), _jsx("span", { "aria-hidden": true })] })) : null, q.type === 'textarea' ? _jsx("textarea", { ...questionTextareaProps({ question: q }), className: "qf-textarea", value: typeof value === 'string' ? value : '', placeholder: q.placeholder, disabled: locked, rows: 3, onChange: (e) => update(q.id, e.target.value) }) : null, q.type === 'direction-cards' && q.cards && q.cards.length > 0 ? (_jsx("div", { className: "qf-direction-cards", children: q.cards.map((card) => (_jsx(DirectionCardView, { card: card, formId: form.id, questionId: q.id, selected: value === card.id || value === card.label, disabled: locked, onSelect: () => update(q.id, card.id) }, card.id))) })) : null, q.type === 'direction-cards' && q.cards && q.cards.length > 0 && shouldRenderCustomChoice(q) ? (_jsx(CustomChoiceInput, { label: q.customLabel ?? t('Something else'), value: customSingleValue(q, value), placeholder: q.customPlaceholder ?? t('Type your own answer'), disabled: locked, onChange: (next) => update(q.id, next) })) : null] }, q.id));
-                }) }), guard.secretRedacted ? _jsx("div", { role: "status", children: t(SECRET_REDACTED_NOTICE) }) : null, hideInternalSubmit ? null : (_jsxs("div", { className: "question-form-foot", children: [locked ? _jsx("span", { className: "qf-locked-note", children: submittedAnswers ? t('You answered this') : t('A newer message answered this') }) : _jsx("span", { className: "qf-hint", children: t('Answer above, then continue') }), !locked ? (_jsx("button", { type: "button", className: "primary", onClick: handleSubmit, disabled: !ready, title: ready ? t('Submit your answers') : t('Answer the required questions first'), children: form.submitLabel ?? t('Continue') })) : null] }))] }));
-});
+    return withinSelectionLimits && requiredAnswered;
+}
+function QuestionFormHead({ form, locked }) {
+    const t = useT();
+    return (_jsxs("div", { className: "question-form-head", children: [_jsx("span", { className: "question-form-icon", "aria-hidden": true, children: "?" }), _jsxs("div", { className: "question-form-titles", children: [_jsx("div", { className: "question-form-title", children: form.title }), form.description ? _jsx("div", { className: "question-form-desc", children: form.description }) : null] }), locked ? _jsx("span", { className: "question-form-pill", children: t('Answered') }) : null] }));
+}
+function QuestionFormFoot({ locked, answered, ready, submitLabel, onSubmit }) {
+    const t = useT();
+    return (_jsxs("div", { className: "question-form-foot", children: [locked ? _jsx("span", { className: "qf-locked-note", children: answered ? t('You answered this') : t('A newer message answered this') }) : _jsx("span", { className: "qf-hint", children: t('Answer above, then continue') }), !locked ? (_jsx("button", { type: "button", className: "primary", onClick: onSubmit, disabled: !ready, title: ready ? t('Submit your answers') : t('Answer the required questions first'), children: submitLabel ?? t('Continue') })) : null] }));
+}
+function QuestionField(ctx) {
+    const { q, t } = ctx;
+    const renderControl = QUESTION_CONTROLS[q.type];
+    return (_jsxs("div", { className: "qf-field", children: [_jsxs("label", { className: "qf-label", children: [_jsx("span", { children: q.label }), q.required ? (_jsx("span", { className: "qf-required", "aria-label": t('required'), children: "*" })) : null] }), q.help ? _jsx("div", { className: "qf-help", children: q.help }) : null, isSecretQuestion({ question: q }) ? _jsx("div", { className: "qf-help", children: t(CREDENTIAL_CARD_GUIDANCE) }) : null, renderControl ? renderControl(ctx) : null] }));
+}
+function stringValue(value) {
+    return typeof value === 'string' ? value : '';
+}
+/** A range with no usable answer yet (e.g. mid-stream) shows its minimum, matching `emptyQuestionValue`. */
+function rangeValue(q, value) {
+    return typeof value === 'string' && value.trim() ? value : String(q.min ?? 0);
+}
+function customChoice({ q, t, locked }, value, onChange) {
+    if (!shouldRenderCustomChoice(q))
+        return null;
+    return _jsx(CustomChoiceInput, { label: q.customLabel ?? t('Something else'), value: value, placeholder: q.customPlaceholder ?? t('Type your own answer'), disabled: locked, onChange: onChange });
+}
+function singleCustomChoice(ctx) {
+    return customChoice(ctx, customSingleValue(ctx.q, ctx.value), (next) => ctx.update(ctx.q.id, next));
+}
+function RadioControl(ctx) {
+    const { q, value, formId, locked, update } = ctx;
+    if (!q.options)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "qf-options", children: q.options.map((opt) => (_jsxs("label", { className: `qf-chip${value === opt.value ? ' qf-chip-on' : ''}`, title: opt.description, children: [_jsx("input", { type: "radio", name: `${formId}-${q.id}`, value: opt.value, checked: value === opt.value, disabled: locked, "aria-label": opt.label, onChange: () => update(q.id, opt.value) }), _jsx(OptionCopy, { option: opt })] }, opt.value))) }), singleCustomChoice(ctx)] }));
+}
+function CheckboxControl(ctx) {
+    const { q, value, locked, toggleCheckbox, updateCheckboxCustom } = ctx;
+    if (!q.options)
+        return null;
+    const arr = Array.isArray(value) ? value : [];
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "qf-options", children: q.options.map((opt) => {
+                    const on = arr.includes(opt.value);
+                    const maxed = q.maxSelections !== undefined && !on && arr.length >= q.maxSelections;
+                    return (_jsxs("label", { title: opt.description, className: `qf-chip${on ? ' qf-chip-on' : ''}${maxed ? ' qf-chip-disabled' : ''}`, children: [_jsx("input", { type: "checkbox", value: opt.value, checked: on, disabled: locked || maxed, "aria-label": opt.label, onChange: () => toggleCheckbox(q.id, opt.value, q.maxSelections) }), _jsx(OptionCopy, { option: opt })] }, opt.value));
+                }) }), customChoice(ctx, customCheckboxValue(q, value), (next) => updateCheckboxCustom(q, next))] }));
+}
+function SelectControl(ctx) {
+    const { q, value, locked, t, update } = ctx;
+    if (!q.options)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsxs("select", { className: "qf-select", value: typeof value === 'string' && questionValueIsKnown(q, value) ? value : '', disabled: locked, onChange: (e) => update(q.id, e.target.value), children: [_jsx("option", { value: "", disabled: true, children: q.placeholder ?? t('Choose one') }), q.options.map((opt) => (_jsx("option", { value: opt.value, title: opt.description, children: opt.label }, opt.value)))] }), singleCustomChoice(ctx)] }));
+}
+function DirectionCardsControl(ctx) {
+    const { q, value, formId, locked, update } = ctx;
+    if (!q.cards || q.cards.length === 0)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "qf-direction-cards", children: q.cards.map((card) => (_jsx(DirectionCardView, { card: card, formId: formId, questionId: q.id, selected: value === card.id || value === card.label, disabled: locked, onSelect: () => update(q.id, card.id) }, card.id))) }), singleCustomChoice(ctx)] }));
+}
+/** date/time/datetime-local and url/email/tel share one plain input whose `type` is the question type. */
+function TypedInputControl({ q, value, locked, update }) {
+    return _jsx("input", { type: q.type, className: "qf-input", value: stringValue(value), placeholder: q.placeholder, disabled: locked, onChange: (e) => update(q.id, e.target.value) });
+}
+const QUESTION_CONTROLS = {
+    radio: RadioControl,
+    checkbox: CheckboxControl,
+    select: SelectControl,
+    'direction-cards': DirectionCardsControl,
+    text: ({ q, value, locked, update }) => _jsx("input", { ...questionTextInputProps({ question: q }), className: "qf-input", value: stringValue(value), placeholder: q.placeholder, disabled: locked, onChange: (e) => update(q.id, e.target.value) }),
+    number: ({ q, value, locked, update }) => _jsx("input", { type: "number", className: "qf-input", value: stringValue(value), placeholder: q.placeholder, min: q.min, max: q.max, step: q.step, disabled: locked, onChange: (e) => update(q.id, e.target.value) }),
+    range: ({ q, value, locked, update }) => (_jsxs("div", { className: "qf-range-wrap", children: [_jsx("input", { type: "range", className: "qf-range", value: rangeValue(q, value), min: q.min, max: q.max, step: q.step, disabled: locked, onChange: (e) => update(q.id, e.target.value) }), _jsx("output", { className: "qf-range-value", children: rangeValue(q, value) })] })),
+    date: TypedInputControl,
+    time: TypedInputControl,
+    'datetime-local': TypedInputControl,
+    url: TypedInputControl,
+    email: TypedInputControl,
+    tel: TypedInputControl,
+    color: ({ q, value, locked, update }) => _jsx("input", { type: "color", className: "qf-color", value: normalizeColorInputValue(value), disabled: locked, onChange: (e) => update(q.id, e.target.value) }),
+    file: ({ q, value, locked, selectFiles }) => (_jsxs("div", { className: "qf-file-wrap", children: [_jsx("input", { type: "file", className: "qf-file", multiple: q.multiple, accept: q.accept, disabled: locked, onChange: (e) => selectFiles(q, e.target.files) }), fileValueLabel(value) ? _jsx("div", { className: "qf-file-summary", children: fileValueLabel(value) }) : null] })),
+    switch: ({ q, value, locked, update }) => (_jsxs("label", { className: "qf-switch", children: [_jsx("input", { type: "checkbox", role: "switch", checked: value === 'true', disabled: locked, onChange: (e) => update(q.id, e.target.checked ? 'true' : 'false') }), _jsx("span", { "aria-hidden": true })] })),
+    textarea: ({ q, value, locked, update }) => _jsx("textarea", { ...questionTextareaProps({ question: q }), className: "qf-textarea", value: stringValue(value), placeholder: q.placeholder, disabled: locked, rows: 3, onChange: (e) => update(q.id, e.target.value) }),
+};
 function OptionCopy({ option }) {
     return (_jsxs("span", { className: "qf-chip-copy", children: [_jsx("span", { children: option.label }), option.description ? _jsx("span", { className: "qf-chip-desc", children: option.description }) : null] }));
 }
@@ -145,22 +208,31 @@ function DirectionCardView({ card, formId, questionId, selected, disabled, onSel
 }
 function buildInitialState(form, submitted, draft) {
     const out = {};
+    for (const q of form.questions)
+        out[q.id] = initialQuestionValue(q, submitted, draft);
+    return out;
+}
+/** Submitted beats draft beats default beats empty; file drafts are never restored (the File objects are gone). */
+function initialQuestionValue(q, submitted, draft) {
+    if (submitted?.[q.id] !== undefined)
+        return canonicalizeQuestionValue(q, submitted[q.id]);
+    if (draft?.[q.id] !== undefined && q.type !== 'file')
+        return canonicalizeQuestionValue(q, draft[q.id]);
+    if (q.defaultValue !== undefined)
+        return canonicalizeQuestionValue(q, q.defaultValue);
+    return emptyQuestionValue(q);
+}
+/** Questions that stream in after mount get their initial value; answers already set are kept. */
+function backfillAnswers(prev, form, submitted) {
+    let changed = false;
+    const next = { ...prev };
     for (const q of form.questions) {
-        if (submitted && submitted[q.id] !== undefined) {
-            out[q.id] = canonicalizeQuestionValue(q, submitted[q.id]);
-            continue;
-        }
-        if (draft && draft[q.id] !== undefined && q.type !== 'file') {
-            out[q.id] = canonicalizeQuestionValue(q, draft[q.id]);
+        if (next[q.id] !== undefined)
             continue;
-        }
-        if (q.defaultValue !== undefined) {
-            out[q.id] = canonicalizeQuestionValue(q, q.defaultValue);
-            continue;
-        }
-        out[q.id] = emptyQuestionValue(q);
+        changed = true;
+        next[q.id] = initialQuestionValue(q, submitted, undefined);
     }
-    return out;
+    return changed ? next : prev;
 }
 function draftSafeAnswers(form, answers) {
     const fileQuestionIds = new Set(form.questions.filter((q) => q.type === 'file').map((q) => q.id));

package/dist/react/components/QuestionsPanel.js

@@ -20,7 +20,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef, useState } from 'react';
 import { useT } from '../hooks/context.js';
 import { QuestionForm } from './QuestionForm.js';
-export function QuestionsPanel({ form, interactive, submitDisabled = false, submittedAnswers, generating = false, onSubmit, redactUserText, onSecretRedacted }) {
+export function QuestionsPanel({ form, interactive, submitDisabled, submittedAnswers, generating = false, onSubmit, redactUserText, onSecretRedacted }) {
     const t = useT();
     const formRef = useRef(null);
     const [ready, setReady] = useState(false);