@jini-ai/chat 0.6.12 → 0.6.15-rc.1

package/dist/react/components/MessageRow.js

@@ -1,6 +1,7 @@
 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 { useSurfaceAnswerContexts } from './mcp-ui-question-input.js';
 import { terminalMessageNotice, continuingRunNotice } from '../../core/durable-projection.js';
 import { usageEndLabel, usageLayout, usageLineMeetsActions, useMessageUsage, useUsageSummary } from './MessageRow.usage.js';
 /**
@@ -36,7 +37,7 @@ import { usageEndLabel, usageLayout, usageLineMeetsActions, useMessageUsage, use
  * see that module's header for the conditions.
  *
  * Both message roles also carry a per-message copy affordance
- * (`CopyMessageButton` below), rendered inside a `.jini-message-actions` row.
+ * (`CopyMessageButton`), rendered inside a `.jini-message-actions` row.
  * Assistant rows render that row as an extension seam: `branch`/thumbs-up/
  * thumbs-down are meant to join `copy` there later, as siblings in the same
  * row, once their backends (conversation branching, feedback storage) exist
@@ -57,16 +58,15 @@ import React, { memo, useMemo } from 'react';
 import { assistantContentFromEvents, isAwaitingAnswer, isTerminalRunStatus, splitOnQuestionForms, stripArtifact } from '../../core/index.js';
 import { useToolTimeline } from '../hooks/useToolTimeline.js';
 import { useExtEventGroups } from '../hooks/useExtEventGroups.js';
-import { useCopyToClipboard } from '../hooks/useCopyToClipboard.js';
 import { useRunActivity } from '../hooks/useRunActivity.js';
 import { useAnsweredCards } from '../hooks/useAnsweredCards.js';
-import { interleaveMessageBlocks } from '../message-blocks.js';
+import { interleaveMessageBlocks, splitMidRunBlocks } from '../message-blocks.js';
 import { useT, useExtEventRendererRegistry } from '../hooks/context.js';
 import { ExtEventErrorBoundary } from './ExtEventErrorBoundary.js';
 import { AttachmentPreviewModal } from './AttachmentPreviewModal.js';
 import { SentAttachmentButton } from './SentAttachment.js';
 import { useAttachmentGallery } from './AttachmentGallery.hooks.js';
-import { Icon } from './Icon.js';
+import { CopyMessageButton } from './CopyMessageButton.js';
 import { Markdown } from './Markdown.js';
 import { ToolCard } from './ToolCard.js';
 import { QuestionForm } from './QuestionForm.js';
@@ -149,25 +149,9 @@ function ThinkingBlock({ text }) {
 function messageAwaitingAnswer({ runStreaming, runInProgress, events }, { isAnsweredCard } = {}) {
     return runStreaming === true && runInProgress && isAwaitingAnswer({ events }, { isAnsweredCard });
 }
-function AssistantMessageFooter({ message, usageEvent, showUsageTotal, terminalNotice, pending, runInProgress, runStreaming, visibleContent, isAnsweredCard }, _optional = {}) {
+function AssistantMessageFooter({ message, usageEvent, showUsageTotal, terminalNotice, pending, runInProgress, runStreaming, runSending, visibleContent, isAnsweredCard }, _optional = {}) {
     const t = useT();
-    return _jsxs(_Fragment, { children: [usageEvent ? _jsx(UsageSummary, { usage: usageEvent, showTotal: showUsageTotal, message: message, awaitingAnswer: isAwaitingAnswer({ events: message.events }, { isAnsweredCard }) }) : null, terminalNotice ? _jsx("div", { className: "jini-message-error", role: "status", children: t(terminalNotice) }) : null, !pending && !runInProgress ? (_jsx("div", { className: "jini-message-actions jini-message-actions--assistant", children: _jsx(CopyMessageButton, { text: visibleContent, label: t('Copy message') }) })) : null, runInProgress ? _jsx(RunActivityLine, { events: message.events, active: pending || (runStreaming === true && runInProgress), isAnsweredCard: isAnsweredCard }) : null] });
-}
-/**
- * Quiet, icon-only copy affordance shared by the user- and assistant-message
- * action rows below. Delegates the actual clipboard write (and its
- * secure-context fallback) to `useCopyToClipboard`; this component only owns
- * the icon swap and the accessible announcement of the transient state.
- * @param props.text - Exact string to copy, verbatim.
- * @param props.label - Idle accessible name (already translated by the caller).
- * @complexity O(1) — one child hook call, no branching beyond the copied-state read.
- */
-function CopyMessageButton({ text, label }) {
-    const t = useT();
-    const { copied, copy } = useCopyToClipboard();
-    return (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: "jini-message-action-btn", "aria-label": copied ? t('Copied') : label, onClick: () => {
-                    void copy(text);
-                }, children: _jsx(Icon, { name: copied ? 'check' : 'copy' }) }), _jsx("span", { className: "jini-message-copy-status", "aria-live": "polite", children: copied ? t('Copied to clipboard') : '' })] }));
+    return _jsxs(_Fragment, { children: [usageEvent ? _jsx(UsageSummary, { usage: usageEvent, showTotal: showUsageTotal, message: message, awaitingAnswer: isAwaitingAnswer({ events: message.events }, { isAnsweredCard }) }) : null, terminalNotice ? _jsx("div", { className: "jini-message-error", role: "status", children: t(terminalNotice) }) : null, !pending && !runInProgress ? (_jsx("div", { className: "jini-message-actions jini-message-actions--assistant", children: _jsx(CopyMessageButton, { text: visibleContent, label: t('Copy message') }) })) : null, runInProgress ? _jsx(RunActivityLine, { events: message.events, active: pending || (runStreaming === true && runInProgress), isAnsweredCard: isAnsweredCard, sending: runSending }) : null] });
 }
 /** Stable empty list for a message with no attachments. */
 const NO_ATTACHMENTS = [];
@@ -176,13 +160,14 @@ 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({ showUsageTotal = true, showUsageLine = true, toolCallDisplay = 'show', showThinking = false, runStreaming = false, runSucceeded = false, questionFormInteractive = false, ...props }) {
+export const MessageRow = memo(function MessageRow({ showUsageTotal = true, showUsageLine = true, toolCallDisplay = 'show', showThinking = false, runStreaming = false, runSending = false, runSucceeded = false, questionFormInteractive = false, ...props }) {
+    const answerContexts = useSurfaceAnswerContexts({ events: props.message.events });
     const message = useMemo(() => props.message.events === undefined ? props.message : {
-        ...props.message, events: projectAcceptedInputEvents({ events: props.message.events }),
-    }, [props.message]);
+        ...props.message, events: projectAcceptedInputEvents({ events: props.message.events }, answerContexts),
+    }, [props.message, answerContexts]);
     if (message.role === 'user')
         return _jsx(UserMessageRow, { ...props, message: message });
-    return _jsx(AssistantMessageRow, { ...props, message: message, showUsageTotal, showUsageLine, toolCallDisplay, showThinking, runStreaming, runSucceeded, questionFormInteractive });
+    return _jsx(AssistantMessageRow, { ...props, message: message, showUsageTotal, showUsageLine, toolCallDisplay, showThinking, runStreaming, runSending, runSucceeded, questionFormInteractive });
 });
 function UserMessageRow({ message, renderAttachment }) {
     const t = useT();
@@ -193,7 +178,7 @@ function UserMessageRow({ message, renderAttachment }) {
     const gallery = useAttachmentGallery({ attachments: message.attachments ?? NO_ATTACHMENTS });
     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, }) {
+function AssistantMessageRow({ message, usageSummary, showUsageTotal, showUsageLine, toolCallDisplay, showThinking, runStreaming, runSending, 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 });
@@ -219,17 +204,20 @@ function AssistantMessageRow({ message, usageSummary, showUsageTotal, showUsageL
         ? _jsx(ToolCallGroup, { rows: rows, renderRow: renderToolCard, failureOnly: toolCallDisplay === 'hidden' }, key)
         : _jsx("div", { className: "jini-message-tools", children: rows.map(renderToolCard) }, key));
     const flatTools = flatToolGroups({ message, rows: timeline.rows, registry, displayBlocks }, { toolCallDisplay });
+    const flatExtGroups = extGroups.filter(group => group.name !== MID_RUN_USER_MESSAGE_EXT_EVENT_NAME);
     const renderExtGroup = (group) => {
+        const transcriptRow = group.name === MID_RUN_USER_MESSAGE_EXT_EVENT_NAME;
         const renderer = registry.get({ name: group.name });
         if (!renderer && group.name === MID_RUN_USER_MESSAGE_EXT_EVENT_NAME)
-            return _jsx(MidRunUserMessage, { events: group.events, runStreaming: answeredCards.runStreaming }, group.slot);
+            return _jsx(MidRunUserMessage, { events: group.events, runStreaming: runInProgress, transcriptRow: true }, group.slot);
         if (!renderer)
             return null;
         const answerText = answeredCards.answerText(group.slot);
         const node = renderer({
             name: group.name,
             events: group.events,
-            runStreaming: answeredCards.runStreaming,
+            runStreaming: group.name === MID_RUN_USER_MESSAGE_EXT_EVENT_NAME ? runInProgress : answeredCards.runStreaming,
+            ...(group.name === MID_RUN_USER_MESSAGE_EXT_EVENT_NAME ? { transcriptRow: true } : {}),
             runSucceeded,
             awaitingAnswer,
             runId: message.runId,
@@ -237,8 +225,7 @@ function AssistantMessageRow({ message, usageSummary, showUsageTotal, showUsageL
             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 }),
+            ...answerRenderProps({ answeredCards, slot: group.slot, answerText }),
         });
         if (!node)
             return null;
@@ -246,7 +233,7 @@ function AssistantMessageRow({ message, usageSummary, showUsageTotal, showUsageL
         // `key` includes the event count so a group that failed on an earlier, shorter event list
         // gets a fresh boundary instance (not the still-tripped one) once a new event actually
         // arrives for it, instead of staying tombstoned for the message's whole lifetime.
-        _jsx(ExtEventErrorBoundary, { name: group.name, children: _jsx("div", { children: node }) }, `${group.slot}:${group.events.length}`));
+        _jsx(ExtEventErrorBoundary, { name: group.name, children: transcriptRow ? node : _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) => {
@@ -262,25 +249,66 @@ function AssistantMessageRow({ message, usageSummary, showUsageTotal, showUsageL
             return renderTools(block.rows, block.key);
         if (block.kind === 'thinking')
             return _jsx(ThinkingBlock, { text: block.text }, block.key);
+        return renderExtBlock(block);
+    };
+    // A mid-run bubble is its own transcript row, so it skips the ext-events wrapper and its spacing.
+    const renderExtBlock = (block) => {
         const group = extGroups.find((g) => g.slot === block.slot);
         if (!group)
             return null;
+        if (group.name === MID_RUN_USER_MESSAGE_EXT_EVENT_NAME)
+            return _jsx(React.Fragment, { children: renderExtGroup(group) }, block.key);
         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 })
+    const renderAssistantSection = ({ section, key, footer }) => (_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(renderBlock)
-                : (_jsxs(_Fragment, { children: [renderTextSegments(visibleContent, 'text'), flatTools.map((group) => renderTools(group.rows, group.key)), 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 })] }));
+            : '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, section
+                ? section.map(renderBlock)
+                : (_jsxs(_Fragment, { children: [renderTextSegments(visibleContent, 'text'), flatTools.map((group) => renderTools(group.rows, group.key)), flatExtGroups.length > 0 ? _jsx("div", { className: "jini-message-ext-events", children: flatExtGroups.map(renderExtGroup) }) : null] })), footer && _jsx(AssistantMessageFooter, { message, usageEvent: footerUsage, showUsageTotal, terminalNotice, pending, runInProgress, runStreaming, runSending, visibleContent, isAnsweredCard: answeredCards.isAnsweredCard })] }, key));
+    // The lossless fallback keeps the host's text intact; user receipts still own separate rows,
+    // in their original receipt order, outside the assistant's actions and usage footer.
+    if (blocks === null)
+        return _jsxs(_Fragment, { children: [renderAssistantSection({ section: null, key: message.id, footer: true }), extGroups.filter(group => group.name === MID_RUN_USER_MESSAGE_EXT_EVENT_NAME).map(renderExtGroup)] });
+    // A reply boundary without reported usage renders nothing; it must not create an empty row's gap.
+    const visibleBlocks = blocks.filter(block => block.kind !== 'reply-end' || (showUsageLine && usage.replies[block.index] !== undefined));
+    const { sections, footerIndex } = transcriptSections({ blocks: visibleBlocks, runInProgress });
+    return _jsx(_Fragment, { children: sections.map((section, index) => isUserSection({ section })
+            ? _jsx(React.Fragment, { children: section.map(renderBlock) }, section[0].key)
+            : renderAssistantSection({ section, key: section[0]?.key ?? message.id, footer: index === footerIndex })) });
+}
+/** Preserve optional render-prop presence for custom extension renderers. */
+function answerRenderProps({ answeredCards, slot, answerText }, _options = {}) {
+    return { ...(answeredCards.isRecorded(slot) ? { answerRecorded: true } : {}),
+        ...(answerText === undefined ? {} : { answerText }) };
+}
+/** Place the one footer on the last assistant section, never below a completed trailing input. */
+function transcriptSections({ blocks, runInProgress }, _options = {}) {
+    const sections = splitMidRunBlocks({ blocks });
+    if (sections.length === 0)
+        sections.push([]);
+    // A live trailing input starts the next reply. A completed run needs no empty assistant row
+    // (its actions/usage used to leave a large gap below the final user bubble).
+    if (runInProgress && isUserSection({ section: sections.at(-1) }))
+        sections.push([]);
+    const footerIndex = sections.findLastIndex(section => !isUserSection({ section }));
+    return { sections, footerIndex };
+}
+/** A user receipt occupies its own section; every other block belongs to an assistant row. */
+function isUserSection({ section }, _options = {}) {
+    const block = section?.[0];
+    return block?.kind === 'ext' && block.name === MID_RUN_USER_MESSAGE_EXT_EVENT_NAME;
 }
 /**
  * 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.
  * Kept a separate component so its one-second tick re-renders only this line, not the whole row.
  */
-function RunActivityLine({ events, active, isAnsweredCard }) {
+function RunActivityLine({ events, active, isAnsweredCard, sending }) {
+    const t = useT();
     const activityLabel = useRunActivity({ events: events, active: active }, { isAnsweredCard });
-    const label = continuingRunNotice({ events, active }, {}) ?? activityLabel;
+    // Until the server accepts the start the turn is still on its way: "Thinking…" there read as the
+    // model working while the text had not even arrived (owner, 2026-10-27). No timeout.
+    const label = active && sending ? t('Sending…') : continuingRunNotice({ events, active }, {}) ?? activityLabel;
     if (label === null)
         return null;
     return (_jsx("div", { className: "jini-message-pending jini-run-activity", "aria-live": "off", children: label }));

package/dist/react/components/MidRunUserMessage.d.ts

@@ -7,7 +7,7 @@ export declare function midRunUserMessageSlotKey({ data }: {
     data: unknown;
 }): string | undefined;
 /** The bubble for one mid-run message — the same classes as a sent user message, so it reads as one. */
-export declare function MidRunUserMessage({ events, runStreaming }: Pick<ExtEventRenderProps, 'events'> & Partial<Pick<ExtEventRenderProps, 'runStreaming'>>): import("react").JSX.Element | null;
+export declare function MidRunUserMessage({ events, runStreaming, transcriptRow }: Pick<ExtEventRenderProps, 'events'> & Partial<Pick<ExtEventRenderProps, 'runStreaming' | 'transcriptRow'>>): import("react").JSX.Element | null;
 /**
  * Registers {@link MidRunUserMessage} against the ext-event registry.
  *

package/dist/react/components/MidRunUserMessage.js

@@ -3,15 +3,16 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  * @module MidRunUserMessage
  *
  * Renders a message the human sent while a run was going (`ChatPane`'s `deliverMidRunMessage`) as a
- * user bubble inside the running turn, at the point in the stream where the live agent received it.
+ * separate user row between assistant sections, at the point in the stream where the live agent received it.
  * The daemon records each one as a `user_message` run event (`AgentExecutor.sendUserMessage`), which
  * the run-event translator surfaces as `kind: 'ext'` with that name; this claims it.
  *
- * It is an event of the assistant turn, not a `ChatMessage` of its own, because the agent folded it
+ * It is stored as 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 { CopyMessageButton } from './CopyMessageButton.js';
 import { AttachmentPreviewModal } from './AttachmentPreviewModal.js';
 import { useAttachmentGallery } from './AttachmentGallery.hooks.js';
 import { useT } from '../hooks/context.js';
@@ -29,7 +30,7 @@ export function midRunUserMessageSlotKey({ data }) {
     return field(data, 'id');
 }
 /** The bubble for one mid-run message — the same classes as a sent user message, so it reads as one. */
-export function MidRunUserMessage({ events, runStreaming = false }) {
+export function MidRunUserMessage({ events, runStreaming = false, transcriptRow = false }) {
     const data = events.at(-1);
     const text = field(data, 'text');
     if (text === undefined)
@@ -38,13 +39,16 @@ export function MidRunUserMessage({ events, runStreaming = false }) {
     // 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 }];
     // A run that ended without reading the message hands it to the next turn; it is no longer queued here.
-    return _jsx(_Fragment, { children: inputs.map(input => _jsx(MidRunInput, { input: input, queued: runStreaming && (input.deliveryState ?? receipt?.data.deliveryState) === 'queued' }, input.id)) });
+    return _jsx(_Fragment, { children: inputs.map(input => _jsx(MidRunInput, { input: input, transcriptRow: transcriptRow, queued: runStreaming && (input.deliveryState ?? receipt?.data.deliveryState) === 'queued' }, input.id)) });
 }
-function MidRunInput({ input, queued }) {
+/** One receipt's text, files and shared copy action; queued state belongs to this input alone.
+ * @complexity O(a) time/space for a attachments; clipboard and gallery effects stay with their owners.
+ */
+function MidRunInput({ input, queued, transcriptRow }) {
     const t = useT();
     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: [queued && _jsx("div", { className: "jini-message-user__queued", role: "status", children: t('Queued — read after the current step') }), _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 })] }));
+    return (_jsxs("div", { className: `jini-message jini-message-user${transcriptRow ? '' : ' jini-message-user--mid-run'}`, "data-agent-role": "region", "data-agent-label": "A message from the user, sent while the agent was working", children: [queued && _jsx("div", { className: "jini-message-user__queued", role: "status", children: t('Queued — read after the current step') }), _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)) }), _jsx("div", { className: "jini-message-actions jini-message-actions--user", children: _jsx(CopyMessageButton, { text: input.text, label: t('Copy message') }) }), gallery.opened !== null && _jsx(AttachmentPreviewModal, { attachment: gallery.opened, onClose: gallery.close, navigation: gallery.navigation })] }));
 }
 /**
  * Registers {@link MidRunUserMessage} against the ext-event registry.
@@ -52,6 +56,6 @@ function MidRunInput({ input, queued }) {
  * @returns An unregister handle, so a test or a hot reload can dispose cleanly.
  */
 export function registerMidRunUserMessageRenderer() {
-    return registerExtEventRenderer({ name: MID_RUN_USER_MESSAGE_EXT_EVENT_NAME, renderer: (props) => _jsx(MidRunUserMessage, { events: props.events, runStreaming: props.runStreaming }) }, { slotKey: midRunUserMessageSlotKey });
+    return registerExtEventRenderer({ name: MID_RUN_USER_MESSAGE_EXT_EVENT_NAME, renderer: (props) => _jsx(MidRunUserMessage, { events: props.events, runStreaming: props.runStreaming, transcriptRow: props.transcriptRow === true }) }, { slotKey: midRunUserMessageSlotKey });
 }
 //# sourceMappingURL=MidRunUserMessage.js.map

package/dist/react/components/QuestionForm.js

@@ -17,6 +17,7 @@ import { useUserTextGuard } from '../hooks/useUserTextGuard.js';
 import { forwardRef, useEffect, useImperativeHandle, useMemo, useState } from 'react';
 import { formatFormAnswers, formOptionValueForLabel, redactQuestionAnswers, isSecretQuestion, withoutSecretQuestionDefaults, questionTextInputProps, questionTextareaProps } from '../../core/index.js';
 import { useT } from '../hooks/context.js';
+import { SecretInput, SecretTextarea } from '@jini-ai/ui';
 export const QuestionForm = forwardRef(function QuestionForm({ form: incomingForm, interactive, submittedAnswers, hideInternalSubmit = false, draftAnswers, onReadyChange, onDraftChange, onAnswerChange, onSubmit, redactUserText, onSecretRedacted }, ref) {
     const t = useT();
     const form = useMemo(() => withoutSecretQuestionDefaults({ form: incomingForm }), [incomingForm]);
@@ -172,6 +173,25 @@ function DirectionCardsControl(ctx) {
         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)] }));
 }
+/** A credential-shaped text question gets the shared eye toggle (hidden by default). */
+function TextControl({ q, value, locked, update, t }) {
+    const shared = { className: 'qf-input', value: stringValue(value), placeholder: q.placeholder, disabled: locked, onChange: (e) => update(q.id, e.target.value) };
+    const props = questionTextInputProps({ question: q });
+    if (props.type === 'password') {
+        const { type: _type, ...secretProps } = props;
+        return _jsx(SecretInput, { ...secretProps, ...shared, "aria-label": q.label, label: q.label, toggleLabels: { show: `${t('Show')} ${q.label}`, hide: `${t('Hide')} ${q.label}` } });
+    }
+    return _jsx("input", { ...props, ...shared });
+}
+/** A credential-shaped textarea gets the same eye toggle; `SecretTextarea` owns the masking style. */
+function TextareaControl({ q, value, locked, update, t }) {
+    const shared = { className: 'qf-textarea', value: stringValue(value), placeholder: q.placeholder, disabled: locked, rows: 3, onChange: (e) => update(q.id, e.target.value) };
+    const props = questionTextareaProps({ question: q });
+    if (isSecretQuestion({ question: q })) {
+        return _jsx(SecretTextarea, { ...props, ...shared, "aria-label": q.label, label: q.label, toggleLabels: { show: `${t('Show')} ${q.label}`, hide: `${t('Hide')} ${q.label}` } });
+    }
+    return _jsx("textarea", { ...props, ...shared });
+}
 /** 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) });
@@ -181,7 +201,7 @@ const QUESTION_CONTROLS = {
     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) }),
+    text: TextControl,
     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,
@@ -193,7 +213,7 @@ const QUESTION_CONTROLS = {
     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) }),
+    textarea: TextareaControl,
 };
 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] }));

package/dist/react/components/ToolCard.js

@@ -21,7 +21,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  * generic rendering for it.
  */
 import { useId, useState } from 'react';
-import { describeCollapsedToolCall, describeToolCallDetail, formatToolOutputForDisplay, isDelegatedWrapperToolName, isTodoWriteToolName, parseTodoWriteInput, toRenderProps } from '../../core/index.js';
+import { COLLAPSED_DETAIL_MAX_CHARS, describeCollapsedToolCall, describeToolCallDetail, isDelegatedWrapperToolName, isTodoWriteToolName, parseTodoWriteInput, redactUserText, toRenderProps } from '../../core/index.js';
 import { useT, useToolRendererRegistry } from '../hooks/context.js';
 import { Icon } from './Icon.js';
 import { TodoCard } from './TodoCard.js';
@@ -146,7 +146,7 @@ function DelegatedToolCard({ name, input, result, runStreaming, runSucceeded })
     const args = isDelegatedWrapperToolName({ name: name }) ? wrapper.input : input;
     const target = primaryTarget(args);
     const isRunning = runStreaming && !result;
-    return (_jsx(ExpandableCard, { className: "op-jini-tool", call: { input: args ?? {}, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }, head: _jsxs(_Fragment, { children: [_jsx(ResultBadge, { result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }), _jsxs("span", { className: `op-title${isRunning ? ' shimmer-text' : ''}`, children: [t('Tool call'), " \u00B7 ", humanizeToolId(toolId)] }), target ? _jsx("span", { className: "op-meta", children: target }) : null] }), after: _jsx(FileErrorDetail, { result: result }), children: _jsx(ToolCallDetail, { input: args ?? {}, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded, children: _jsx(ToolResultMedia, { result: result }) }) }));
+    return (_jsx(ExpandableCard, { className: "op-jini-tool", call: { input: args ?? {}, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }, head: _jsxs(_Fragment, { children: [_jsx(ResultBadge, { result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }), _jsxs("span", { className: `op-title${isRunning ? ' shimmer-text' : ''}`, children: [t('Tool call'), " \u00B7 ", humanizeToolId(toolId)] }), target ? _jsx("span", { className: "op-meta", children: headSummary({ text: target }) }) : null] }), after: _jsx(FileErrorDetail, { result: result }), children: _jsx(ToolCallDetail, { input: args ?? {}, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded, children: _jsx(ToolResultMedia, { result: result }) }) }));
 }
 function SearchToolsCard({ input, result, runStreaming, runSucceeded }) {
     const t = useT();
@@ -211,7 +211,7 @@ function BashCard({ input, result, runStreaming, runSucceeded }) {
     const command = obj.command ?? '';
     const desc = obj.description;
     const isRunning = runStreaming && !result;
-    return (_jsx(ExpandableCard, { className: "op-bash", call: { input: input, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }, head: _jsxs(_Fragment, { children: [_jsx(ResultBadge, { result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }), _jsx("span", { className: `op-title${isRunning ? ' shimmer-text' : ''}`, children: t('Bash') }), desc ? _jsx("span", { className: "op-meta op-desc", children: desc }) : null] }), children: _jsxs("div", { className: "op-card-detail", children: [_jsx("pre", { className: "op-command", children: truncate(command, 400) }), result?.content ? _jsx("pre", { className: "op-output", children: truncate(formatToolOutputForDisplay({ text: result.content }), 4000) }) : null] }) }));
+    return (_jsx(ExpandableCard, { className: "op-bash", call: { input: input, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }, head: _jsxs(_Fragment, { children: [_jsx(ResultBadge, { result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }), _jsx("span", { className: `op-title${isRunning ? ' shimmer-text' : ''}`, children: t('Bash') }), desc ? _jsx("span", { className: "op-meta op-desc", children: desc }) : null] }), children: _jsx(ToolCallDetail, { input: command, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }) }));
 }
 function GlobCard({ input, result, runStreaming, runSucceeded }) {
     const t = useT();
@@ -236,7 +236,7 @@ function WebSearchCard({ input, result, runStreaming, runSucceeded }) {
 /** Any tool this package has no family card for — an MCP tool, or a card tool such as `assistant_ask_choice` whose form renders elsewhere in the turn. The row still opens to the full call. */
 function GenericCard({ name, input, result, runStreaming, runSucceeded }) {
     const summary = describeInput(input);
-    return (_jsx(ExpandableCard, { className: "op-generic", call: { input: input, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }, head: _jsxs(_Fragment, { children: [_jsx(ResultBadge, { result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }), _jsx("span", { className: "op-title", children: name }), summary ? _jsx("span", { className: "op-meta", children: truncate(summary, 200) }) : null] }), after: _jsx(ToolResultMedia, { result: result }), children: _jsx(ToolCallDetail, { input: input, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }) }));
+    return (_jsx(ExpandableCard, { className: "op-generic", call: { input: input, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }, head: _jsxs(_Fragment, { children: [_jsx(ResultBadge, { result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }), _jsx("span", { className: "op-title", children: name }), summary ? _jsx("span", { className: "op-meta", children: headSummary({ text: summary }) }) : null] }), after: _jsx(ToolResultMedia, { result: result }), children: _jsx(ToolCallDetail, { input: input, result: result, runStreaming: runStreaming, runSucceeded: runSucceeded }) }));
 }
 /**
  * The one row shell every card shares: a real `<button>` head (Enter/Space toggle it) that reports
@@ -260,7 +260,9 @@ function CollapsedReaderText({ call }) {
 /** The call's input, its result (or why there is none), and any extra `children` — see `describeToolCallDetail` for the redaction and formatting rules. */
 function ToolCallDetail({ input, result, runStreaming, runSucceeded, children }) {
     const t = useT();
-    const detail = describeToolCallDetail({ input: input, result: result }, { runStreaming: runStreaming, runSucceeded: runSucceeded });
+    // Only mounted on expansion: keep the compact preview cheap without losing any of the stored
+    // call when the person opens it. The core formatter still owns formatting and secret redaction.
+    const detail = describeToolCallDetail({ input: input, result: result }, { runStreaming: runStreaming, runSucceeded: runSucceeded, maxChars: Infinity });
     return (_jsxs("div", { className: "op-card-detail", children: [detail.inputText !== null ? _jsx("pre", { className: "op-command op-input", children: detail.inputText }) : null, detail.outputText !== null ? _jsx("pre", { className: "op-output", children: detail.outputText }) : null, detail.noteKey !== null ? _jsx("p", { className: "op-detail-note", children: t(detail.noteKey) }) : null, children] }));
 }
 function ResultBadge({ result, runStreaming, runSucceeded }) {
@@ -270,7 +272,7 @@ function ResultBadge({ result, runStreaming, runSucceeded }) {
     if (!result && !runSucceeded)
         return (_jsx("span", { className: "op-status op-status-error", title: t('Error'), children: _jsx(Icon, { name: "close", size: 14 }) }));
     if (result?.isError)
-        return (_jsx("span", { className: "op-status op-status-error", title: result.content || t('Error'), children: _jsx(Icon, { name: "close", size: 14 }) }));
+        return (_jsx("span", { className: "op-status op-status-error", title: describeToolCallDetail({ input: null, result }, { maxChars: COLLAPSED_DETAIL_MAX_CHARS }).outputText ?? t('Error'), children: _jsx(Icon, { name: "close", size: 14 }) }));
     return (_jsx("span", { className: "op-status op-status-ok", title: t('Done'), children: _jsx(Icon, { name: "check", size: 14 }) }));
 }
 /**
@@ -295,9 +297,12 @@ function ToolResultMedia({ result }) {
     return (_jsx("div", { className: "op-media", children: images.map((block, index) => (_jsx("img", { className: "op-media-image", src: `data:${block.mimeType};base64,${block.data}`, alt: "", style: { maxWidth: '100%', height: 'auto', display: 'block' } }, index))) }));
 }
 function FileErrorDetail({ result }) {
-    if (!result?.isError || !result.content.trim())
+    if (!result?.isError)
         return null;
-    return _jsx("pre", { className: "op-output", children: truncate(formatToolOutputForDisplay({ text: result.content }), 1200) });
+    // This block and the badge tooltip stay mounted even when collapsed. Share the reader's cap
+    // and redactor so large failures cannot retain their full output in those alternate DOM sinks.
+    const detail = describeToolCallDetail({ input: null, result }, { maxChars: COLLAPSED_DETAIL_MAX_CHARS });
+    return detail.outputText === null ? null : _jsx("pre", { className: "op-output", children: detail.outputText });
 }
 function describeInput(input) {
     if (input == null)
@@ -319,6 +324,14 @@ function describeInput(input) {
         return '';
     }
 }
+/**
+ * A head's one-line summary of an arbitrary argument. Heads stay mounted for every collapsed row,
+ * and the fallback argument can be a 20k-char payload or a key, so it gets the reader text's
+ * order: redact first (a cut could split a key past its pattern), then cap.
+ */
+function headSummary({ text }) {
+    return truncate(redactUserText({ text: text }).text, 200);
+}
 function truncate(s, n) {
     if (s.length <= n)
         return s;

package/dist/react/components/mcp-ui-question-input.d.ts

@@ -0,0 +1,20 @@
+/** Read display context from a standalone form; its host may not have emitted a tool call. */
+import { type UIResource } from '@jini-ai/ui/mcp-ui';
+import type { AgentEvent } from '../../core/events.js';
+import type { AcceptedInputProjectionOptions } from '../../core/accepted-input.js';
+/** Feed recovered form context into the existing receipt projection, including after history reload.
+ * Grouping owns tool/surface association; this hook only supplies missing presentation context.
+ * @complexity O(e + h + c) for events, parsed HTML and controls; no mutation or I/O.
+ */
+export declare function useSurfaceAnswerContexts({ events }: {
+    events: AgentEvent[] | undefined;
+}, _options?: {}): AcceptedInputProjectionOptions;
+/** Parse inert markup only: never mount the document, execute scripts or read callback secrets.
+ * @returns Title and offered labels in the existing question-answer input shape.
+ * @complexity O(h + c) time/space for HTML length h and choice controls c; no I/O.
+ */
+export declare function surfaceQuestionInput({ resource, input }: {
+    resource: UIResource | undefined;
+    input: unknown;
+}, _options?: {}): unknown;
+//# sourceMappingURL=mcp-ui-question-input.d.ts.map

package/dist/react/components/mcp-ui-question-input.js

@@ -0,0 +1,72 @@
+/** Read display context from a standalone form; its host may not have emitted a tool call. */
+import { parseUIResource, readActionPlan } from '@jini-ai/ui/mcp-ui';
+import { useMemo, useRef } from 'react';
+import { SURFACE_QUESTION_META_KEY } from '../../core/question-answer.js';
+import { useExtEventGroups } from '../hooks/useExtEventGroups.js';
+import { useExtEventRendererRegistry } from '../hooks/context.js';
+/** Feed recovered form context into the existing receipt projection, including after history reload.
+ * Grouping owns tool/surface association; this hook only supplies missing presentation context.
+ * @complexity O(e + h + c) for events, parsed HTML and controls; no mutation or I/O.
+ */
+export function useSurfaceAnswerContexts({ events }, _options = {}) {
+    const registry = useExtEventRendererRegistry();
+    const groups = useExtEventGroups({ events }, { slotOf: (name, data) => registry.slot({ name, data }) });
+    const cache = useRef(new Map());
+    return useMemo(() => ({ answerContexts: new Map(groups.flatMap(group => {
+            if (group.name !== 'mcp-ui' || group.call?.id === undefined)
+                return [];
+            // Retain the question that offered the values, even when a later document shows its outcome.
+            const data = group.events[0];
+            let cached = cache.current.get(data);
+            if (cached === undefined || cached.sourceInput !== group.call.input) {
+                const input = surfaceQuestionInput({ resource: parseUIResource(data), input: group.call.input });
+                cached = { sourceInput: group.call.input, context: { input, includeTitle: input !== group.call.input } };
+                cache.current.set(data, cached);
+            }
+            return [[group.call.id, cached.context]];
+        })) }), [groups]);
+}
+/** Parse inert markup only: never mount the document, execute scripts or read callback secrets.
+ * @returns Title and offered labels in the existing question-answer input shape.
+ * @complexity O(h + c) time/space for HTML length h and choice controls c; no I/O.
+ */
+export function surfaceQuestionInput({ resource, input }, _options = {}) {
+    const context = surfaceQuestionContext({ resource });
+    if (hasQuestionOptions({ input: context }))
+        return context;
+    if (hasQuestionOptions({ input }))
+        return input;
+    if (resource === undefined || typeof DOMParser === 'undefined')
+        return input;
+    const { title, options } = markupQuestion({ resource });
+    if (!title && options.length === 0)
+        return input;
+    // The call's explicit question remains authoritative. Markup fills the standalone form's gap.
+    return { title, options, ...(typeof input === 'object' && input !== null ? input : {}) };
+}
+/** Read producer-supplied display context without parsing or executing the surface. O(1). */
+function surfaceQuestionContext({ resource }, _options = {}) {
+    return resource?.resource._meta?.[SURFACE_QUESTION_META_KEY];
+}
+/** The title and offered choices an inert parse of the surface document shows. */
+function markupQuestion({ resource }, _options = {}) {
+    const document = new DOMParser().parseFromString(resource.resource.text, 'text/html');
+    const title = readActionPlan(resource)?.title ?? document.querySelector('h1')?.textContent?.trim();
+    const labels = new Map([...document.querySelectorAll('label')].map(label => [label.htmlFor, label.textContent?.trim() ?? '']));
+    const options = [...document.querySelectorAll('input[type="radio"], input[type="checkbox"], option')].map(control => ({ value: control.value, label: optionText({ labels, control }) }));
+    return { title, options };
+}
+/** Explicit question options already belong to the shared answer mapper; no markup fallback needed. */
+function hasQuestionOptions({ input }, _options = {}) {
+    if (typeof input !== 'object' || input === null)
+        return false;
+    const question = input;
+    return [question, question.singleSelect, question.multiSelect].some(group => typeof group === 'object' && group !== null && Array.isArray(group.options));
+}
+/** Resolve native label associations without interpolating caller-controlled ids into selectors. */
+function optionText({ labels, control }, _options = {}) {
+    if (control.tagName === 'OPTION')
+        return control.textContent?.trim() ?? '';
+    return labels.get(control.id) ?? control.closest('label')?.textContent?.trim() ?? '';
+}
+//# sourceMappingURL=mcp-ui-question-input.js.map

package/dist/react/ext-event-renderer-registry.d.ts

@@ -41,6 +41,8 @@ export interface ExtEventRenderProps {
     events: readonly unknown[];
     /** Whether the owning run is still streaming — more events with this `name` may still arrive. */
     runStreaming: boolean;
+    /** The event is a user row alongside assistant sections, with ordinary transcript spacing. */
+    transcriptRow?: boolean;
     runSucceeded: boolean;
     /**
      * Whether the owning run is waiting on the person — a card (form, confirm, sign-in) sits on a

package/dist/react/features/chat-pane/components/ChatPane.js

@@ -119,11 +119,18 @@ function ChatPaneTypedAnswerNotice({ typedAnswerNotice, t, }) {
         return null;
     return (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: t(describeTypedAnswerNotice({ notice: typedAnswerNotice })) }));
 }
+/** A send the server never accepted. Its text went back into the composer if that was still empty;
+ * Retry sends it again either way (see `useChatPane`'s `retrySend`). */
+function ChatPaneSendError({ sendError, onRetry, t }) {
+    if (!sendError)
+        return null;
+    return (_jsxs("div", { className: "jini-chat-pane__error", role: "alert", children: [t('Not sent:'), " ", sendError.message, ' ', _jsx("button", { type: "button", className: "jini-chat-pane__error-action", onClick: onRetry, children: t('Retry') })] }));
+}
 /** The pane's stack of mutually-independent error/status banners — each condition is its own
  * source of truth, so they are rendered as siblings rather than folded into one derived state. */
-function ChatPaneStatusMessages({ attachmentError, dropReadError, workingDirectoryError, workingDirectoryPending, workingDirectoryInvalid, runtimeInventoryError, typedAnswerNotice, ...availability }) {
+function ChatPaneStatusMessages({ sendError, onRetrySend, attachmentError, dropReadError, workingDirectoryError, workingDirectoryPending, workingDirectoryInvalid, runtimeInventoryError, typedAnswerNotice, ...availability }) {
     const { t } = availability;
-    return (_jsxs(_Fragment, { children: [_jsx(ChatPaneAvailabilityStatus, { ...availability }), attachmentError ? (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: attachmentError.message })) : null, dropReadError ? (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: dropReadError })) : null, workingDirectoryError ? (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: workingDirectoryError.message })) : null, _jsx(ChatPaneWorkingDirectoryStatus, { workingDirectoryPending: workingDirectoryPending, workingDirectoryInvalid: workingDirectoryInvalid, t: t }), runtimeInventoryError && !availability.connectingAgents ? (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: runtimeInventoryError.message })) : null, _jsx(ChatPaneTypedAnswerNotice, { typedAnswerNotice: typedAnswerNotice, t: t })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(ChatPaneAvailabilityStatus, { ...availability }), _jsx(ChatPaneSendError, { sendError: sendError, onRetry: onRetrySend, t: t }), attachmentError ? (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: attachmentError.message })) : null, dropReadError ? (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: dropReadError })) : null, workingDirectoryError ? (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: workingDirectoryError.message })) : null, _jsx(ChatPaneWorkingDirectoryStatus, { workingDirectoryPending: workingDirectoryPending, workingDirectoryInvalid: workingDirectoryInvalid, t: t }), runtimeInventoryError && !availability.connectingAgents ? (_jsx("div", { className: "jini-chat-pane__error", role: "alert", children: runtimeInventoryError.message })) : null, _jsx(ChatPaneTypedAnswerNotice, { typedAnswerNotice: typedAnswerNotice, t: t })] }));
 }
 function ChatPaneWorkingDirectoryBlock({ workingDirectoryAccess, workingDirectoryControlPlacement, pane, t, }) {
     if (workingDirectoryAccess && workingDirectoryControlPlacement === 'below') {
@@ -400,6 +407,6 @@ export function ChatPane(props) {
     const selectSuggestion = useChatPaneSuggestion({ rootRef, setDraft: pane.composer.setDraft });
     const openLinkInNewTab = useChatPaneNewTabLinks();
     const { pendingPrompts, projectFileNameSet } = useChatPaneTranscriptProps({ pane }, definedProps({ source: { projectFileNames: p.projectFileNames } }));
-    return (_jsxs("section", { className: chatPaneClassName(p.variant, p.className), style: p.style, "data-activity": pane.activity, ref: rootRef, onClickCapture: openLinkInNewTab, children: [_jsx("style", { "data-jini-chat-pane-styles": "true", children: CHAT_PANE_STYLES }), resolveChatPaneHeader(p.header, p.title, pane.reset, t), p.agentPluginsMode !== 'off' && _jsx(AgentPluginUsage, { conversationId: pane.conversation.conversationId, messages: pane.conversation.messages }), _jsxs("div", { className: "jini-chat-pane__body", children: [_jsx(ChatPaneTranscript, { pane: pane, emptyState: p.emptyState, embed: surface.embed, suggestions: p.suggestions, onSelectSuggestion: selectSuggestion, pendingPrompts: pendingPrompts, projectFileNameSet: projectFileNameSet, toolCallDisplay: p.toolCallDisplay, showUsageLine: p.showUsageLine, showThinking: p.showThinking, t: t }), _jsxs("div", { className: "jini-chat-pane__controls", ref: controlsRef, children: [showsControlsSuggestions(surface.embed, pane.conversation.messages.length, p.emptyState) && (_jsx(ChatPaneSuggestionsRow, { suggestions: p.suggestions, onSelect: selectSuggestion, t: t })), pane.secretRedacted ? _jsx("div", { className: "jini-chat-pane__notice", role: "status", children: t(SECRET_REDACTED_NOTICE) }) : null, _jsx(ChatPaneStatusMessages, { unavailable: unavailable, scanningAgents: runtimeView.scanningAgents, connectingAgents: runtimeView.connectingAgents, executionMode: p.executionMode, apiModeAvailable: p.apiModeAvailable, onExecutionModeChange: p.onExecutionModeChange, attachmentError: pane.attachmentError, dropReadError: fileDrop.dropReadError, workingDirectoryError: pane.workingDirectoryError, workingDirectoryPending: pane.workingDirectoryPending, workingDirectoryInvalid: pane.workingDirectoryInvalid, runtimeInventoryError: inventory.runtimeInventoryError, typedAnswerNotice: pane.typedAnswerNotice, t: t }), _jsx(ChatPaneComposerArea, { fileDrop: fileDrop, uploadAttachments: surface.uploadAttachments, pane: pane, disabled: p.disabled, unavailable: unavailable, placeholder: composerPlaceholder, slots: slots, attachmentAccept: p.attachmentAccept, workingDirectoryAccess: p.workingDirectoryAccess, workingDirectoryControlPlacement: surface.workingDirectoryControlPlacement, t: t })] })] }), p.footer] }));
+    return (_jsxs("section", { className: chatPaneClassName(p.variant, p.className), style: p.style, "data-activity": pane.activity, ref: rootRef, onClickCapture: openLinkInNewTab, children: [_jsx("style", { "data-jini-chat-pane-styles": "true", children: CHAT_PANE_STYLES }), resolveChatPaneHeader(p.header, p.title, pane.reset, t), p.agentPluginsMode !== 'off' && _jsx(AgentPluginUsage, { conversationId: pane.conversation.conversationId, messages: pane.conversation.messages }), _jsxs("div", { className: "jini-chat-pane__body", children: [_jsx(ChatPaneTranscript, { pane: pane, emptyState: p.emptyState, embed: surface.embed, suggestions: p.suggestions, onSelectSuggestion: selectSuggestion, pendingPrompts: pendingPrompts, projectFileNameSet: projectFileNameSet, toolCallDisplay: p.toolCallDisplay, showUsageLine: p.showUsageLine, showThinking: p.showThinking, t: t }), _jsxs("div", { className: "jini-chat-pane__controls", ref: controlsRef, children: [showsControlsSuggestions(surface.embed, pane.conversation.messages.length, p.emptyState) && (_jsx(ChatPaneSuggestionsRow, { suggestions: p.suggestions, onSelect: selectSuggestion, t: t })), pane.secretRedacted ? _jsx("div", { className: "jini-chat-pane__notice", role: "status", children: t(SECRET_REDACTED_NOTICE) }) : null, _jsx(ChatPaneStatusMessages, { unavailable: unavailable, scanningAgents: runtimeView.scanningAgents, connectingAgents: runtimeView.connectingAgents, executionMode: p.executionMode, apiModeAvailable: p.apiModeAvailable, onExecutionModeChange: p.onExecutionModeChange, sendError: pane.conversation.sendError, onRetrySend: () => void pane.retrySend(), attachmentError: pane.attachmentError, dropReadError: fileDrop.dropReadError, workingDirectoryError: pane.workingDirectoryError, workingDirectoryPending: pane.workingDirectoryPending, workingDirectoryInvalid: pane.workingDirectoryInvalid, runtimeInventoryError: inventory.runtimeInventoryError, typedAnswerNotice: pane.typedAnswerNotice, t: t }), _jsx(ChatPaneComposerArea, { fileDrop: fileDrop, uploadAttachments: surface.uploadAttachments, pane: pane, disabled: p.disabled, unavailable: unavailable, placeholder: composerPlaceholder, slots: slots, attachmentAccept: p.attachmentAccept, workingDirectoryAccess: p.workingDirectoryAccess, workingDirectoryControlPlacement: surface.workingDirectoryControlPlacement, t: t })] })] }), p.footer] }));
 }
 //# sourceMappingURL=ChatPane.js.map

package/dist/react/features/chat-pane/hooks/useChatPane.hooks.d.ts

@@ -82,6 +82,12 @@ export interface UseChatPaneResult extends UseChatPaneWorkingDirectoryResult {
      * silent no-op.
      */
     sendPrompt: (prompt: string) => Promise<void>;
+    /**
+     * Sends the newest refused composer send again (see `conversation.sendError`). When that text is
+     * back in the composer it goes out from there like {@link send}; when something new was typed
+     * since, the refused text goes out on its own and the composer keeps the new typing.
+     */
+    retrySend: () => Promise<void>;
     /**
      * The prompt waiting for the in-flight run to finish, or `null` when nothing is queued. Exposed
      * so the pane can SHOW it — a queued turn that is invisible is indistinguishable from one that