@wangzhizhi/remi 0.0.1-alpha

package/dist/tui/renderers/MessageList.js

@@ -0,0 +1,1176 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from 'react';
+import { Box, Text } from 'ink';
+import { ShellInlineCommand, StreamingMarkdown, StructuredDiffView, TerminalInlineMarkdown, TerminalMarkdown, applyTerminalSyntaxTheme, displayWidth, } from '@remi/terminal-markdown';
+import { remiDarkTheme } from '../theme.js';
+import { ActivityGlyph, ActivityText, AnimatedDots, FlowingText, activityBaseColor, useActivityTick, WorkingIndicator } from './WorkingIndicator.js';
+import { formatPermissionFileActionFromParts } from '../../permissionDisplay.js';
+import { executableSlashCommandPrefix } from '../slashCommandHighlight.js';
+import { t } from '../../i18n.js';
+const baseMarkdownTheme = {
+    text: remiDarkTheme.text,
+    muted: remiDarkTheme.muted,
+    accent: remiDarkTheme.accent,
+    success: remiDarkTheme.success,
+    danger: remiDarkTheme.danger,
+    warning: remiDarkTheme.warning,
+    emphasis: '#f4b8e4',
+    strong: '#ffffff',
+    strongEmphasis: '#c7a4ff',
+    orderedListMarker: '#c7a4ff',
+    quoteText: remiDarkTheme.muted,
+    diffAddBackground: '#123d28',
+    diffRemoveBackground: '#4a1e1e',
+    codeBackground: '#1f2226',
+    codeKeyword: '#c792ea',
+    codeString: '#a6e3a1',
+    codeNumber: '#f9e2af',
+    codeComment: remiDarkTheme.muted,
+    codeType: '#89ddff',
+    codeTitle: '#82aaff',
+    codeFunction: '#7aa2f7',
+    codeVariable: '#f2cdcd',
+    codeProperty: '#94e2d5',
+    codeOperator: '#89ddff',
+    codeMeta: '#f38ba8',
+    codeSection: '#fab387',
+    codeRegexp: '#fab387',
+    codePunctuation: '#bac2de',
+};
+const MarkdownThemeContext = createContext(baseMarkdownTheme);
+function useMarkdownTheme() {
+    return useContext(MarkdownThemeContext);
+}
+function systemColor(level) {
+    if (level === 'error') {
+        return remiDarkTheme.danger;
+    }
+    if (level === 'warn') {
+        return remiDarkTheme.warning;
+    }
+    return remiDarkTheme.muted;
+}
+function toolStateColor(state) {
+    if (state === 'done') {
+        return remiDarkTheme.success;
+    }
+    if (state === 'failed' || state === 'denied') {
+        return remiDarkTheme.danger;
+    }
+    return remiDarkTheme.warning;
+}
+function MessageShell({ label, color, children, marginTop = 1, }) {
+    return (_jsxs(Box, { flexDirection: "row", marginTop: marginTop, children: [_jsx(Box, { width: 7, children: _jsx(Text, { color: color, bold: true, children: label }) }), _jsx(Box, { flexGrow: 1, flexDirection: "column", children: children })] }));
+}
+function MessageRow({ message, isFirst, width, language, slashCommandHints = [], }) {
+    const marginTop = isFirst ? 0 : 1;
+    const markdownTheme = useMarkdownTheme();
+    if (message.kind === 'user') {
+        return _jsx(UserMessage, { text: message.text, marginTop: marginTop, slashCommandHints: slashCommandHints });
+    }
+    if (message.kind === 'assistant') {
+        return _jsx(AssistantMessage, { text: message.text, streaming: Boolean(message.streaming), marginTop: marginTop, width: width });
+    }
+    if (message.kind === 'thinking') {
+        return (_jsx(MessageShell, { label: "think", color: remiDarkTheme.muted, marginTop: marginTop, children: _jsx(Text, { color: remiDarkTheme.muted, children: message.collapsed ? '[collapsed]' : message.text }) }));
+    }
+    if (message.kind === 'skill-use') {
+        return _jsx(SkillUseMessage, { message: message, marginTop: marginTop, language: language });
+    }
+    if (message.kind === 'model-panel') {
+        return _jsx(ModelPanel, { message: message, marginTop: marginTop });
+    }
+    if (message.kind === 'style-panel') {
+        return _jsx(StylePanel, { message: message, marginTop: marginTop });
+    }
+    if (message.kind === 'syntax-theme-panel') {
+        return _jsx(SyntaxThemePanel, { message: message, marginTop: marginTop, width: width });
+    }
+    if (message.kind === 'language-panel') {
+        return _jsx(LanguagePanel, { message: message, marginTop: marginTop });
+    }
+    if (message.kind === 'permission-profile-panel') {
+        return _jsx(PermissionProfilePanel, { message: message, marginTop: marginTop });
+    }
+    if (message.kind === 'skills-panel') {
+        return _jsx(SkillsPanel, { message: message, marginTop: marginTop, width: width });
+    }
+    if (message.kind === 'permission-request') {
+        return _jsx(PermissionRequestCard, { message: message, marginTop: marginTop });
+    }
+    if (message.kind === 'statusline-panel') {
+        return _jsx(StatusLinePanel, { message: message, marginTop: marginTop });
+    }
+    if (message.kind === 'tool-call' || message.kind === 'tool-result') {
+        return _jsx(ToolMessage, { message: message, marginTop: marginTop, width: width, language: language });
+    }
+    if (message.kind === 'plan-update') {
+        return _jsx(PlanMessage, { items: message.items, marginTop: marginTop, width: width });
+    }
+    if (message.kind === 'compact-boundary') {
+        return (_jsx(Box, { marginTop: marginTop, children: _jsxs(Text, { color: remiDarkTheme.muted, children: ["\u2022 ", message.summary] }) }));
+    }
+    if (message.kind === 'session-switch') {
+        return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsx(Text, { color: remiDarkTheme.text, children: message.previousUsage }), _jsxs(Text, { color: remiDarkTheme.text, children: [message.label, " ", _jsx(Text, { color: remiDarkTheme.accent, children: message.sessionId })] })] }));
+    }
+    if (message.kind === 'task-summary') {
+        return _jsx(TaskSummary, { durationMs: message.durationMs, marginTop: marginTop, width: width, ...(message.label ? { label: message.label } : {}) });
+    }
+    if (message.kind === 'interrupted') {
+        return (_jsx(Box, { marginTop: marginTop, children: _jsxs(Text, { color: remiDarkTheme.danger, children: ["\u30FB ", message.text] }) }));
+    }
+    if (message.level === 'info') {
+        return (_jsx(Box, { marginTop: marginTop, children: _jsx(TerminalInlineMarkdown, { text: message.text, theme: markdownTheme }) }));
+    }
+    return (_jsx(MessageShell, { label: message.level, color: systemColor(message.level), marginTop: marginTop, children: _jsx(TerminalInlineMarkdown, { text: message.text, theme: { ...markdownTheme, text: systemColor(message.level) } }) }));
+}
+function SkillUseMessage({ message, marginTop, language, }) {
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsxs(Box, { children: [_jsx(Text, { color: remiDarkTheme.muted, children: "\u2022 " }), _jsxs(Text, { color: remiDarkTheme.accent, children: [t(language, 'skill.using'), " "] }), _jsx(Text, { color: remiDarkTheme.text, children: message.displayName })] }), _jsxs(Text, { color: remiDarkTheme.muted, children: ['  ', "(", message.name, ", ", message.source, ") \u2014 ", message.filePath] })] }));
+}
+function MessageGroup({ messages, startIndex, width, language, slashCommandHints = [], }) {
+    if (messages.length === 1) {
+        const message = messages[0];
+        return message ? _jsx(MessageRow, { message: message, isFirst: startIndex === 0, width: width, language: language, slashCommandHints: slashCommandHints }) : null;
+    }
+    const first = messages[0];
+    if (first?.kind === 'tool-result' && messages.every(message => message.kind === 'tool-result')) {
+        return _jsx(ToolResultGroup, { messages: messages, marginTop: startIndex === 0 ? 0 : 1, width: width, language: language });
+    }
+    return (_jsx(_Fragment, { children: messages.map((message, offset) => (_jsx(MessageRow, { message: message, isFirst: startIndex + offset === 0, width: width, language: language, slashCommandHints: slashCommandHints }, `${message.kind}-${startIndex + offset}`))) }));
+}
+function UserMessage({ text, marginTop, slashCommandHints, }) {
+    const slashCommand = executableSlashCommandPrefix(text, slashCommandHints);
+    return (_jsxs(Box, { marginTop: marginTop, paddingX: 1, paddingY: 1, backgroundColor: remiDarkTheme.composerBackground, children: [_jsx(Text, { color: remiDarkTheme.muted, children: '> ' }), slashCommand ? (_jsxs(Text, { wrap: "wrap", children: [_jsx(Text, { color: remiDarkTheme.accent, children: slashCommand.command }), _jsx(Text, { color: remiDarkTheme.text, children: slashCommand.rest })] })) : (_jsx(Text, { color: remiDarkTheme.text, wrap: "wrap", children: text }))] }));
+}
+function AssistantMessage({ text, streaming, marginTop, width }) {
+    const markdownTheme = useMarkdownTheme();
+    return (_jsx(Box, { flexDirection: "column", marginTop: marginTop, children: streaming ? _jsx(StreamingMarkdown, { text: text, theme: markdownTheme, width: width, paddingX: 2 }) : _jsx(TerminalMarkdown, { text: text, theme: markdownTheme, width: width, paddingX: 2 }) }));
+}
+export function PlanMessage({ items, marginTop, width, }) {
+    const panelWidth = width === undefined ? undefined : Math.max(20, width - 4);
+    const itemWidth = Math.max(12, (panelWidth ?? width ?? 100) - 8);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, marginX: 2, paddingX: 1, paddingY: 1, backgroundColor: baseMarkdownTheme.codeBackground, width: panelWidth, children: [_jsxs(Text, { children: [_jsx(Text, { color: remiDarkTheme.accent, children: "\u2022 " }), _jsx(Text, { color: remiDarkTheme.accent, children: "Plan" })] }), items.map((item, index) => (_jsxs(Box, { marginLeft: 2, children: [_jsx(Text, { color: remiDarkTheme.muted, children: index === items.length - 1 ? '└ ' : '├ ' }), _jsx(PlanItemMarker, { status: item.status }), _jsx(Text, { color: planItemTextColor(item.status), bold: planItemTextBold(item.status), strikethrough: item.status === 'completed', wrap: "truncate-end", children: truncateTextToWidth(item.content, itemWidth) })] }, item.id ?? `${index}-${item.content}`)))] }));
+}
+export function planItemTextColor(status) {
+    return status === 'in_progress' ? remiDarkTheme.accent : remiDarkTheme.muted;
+}
+export function planItemTextBold(_status) {
+    return false;
+}
+function PlanItemMarker({ status }) {
+    if (status === 'completed') {
+        return _jsx(Text, { color: planItemMarkerColor(status), children: "\u2713 " });
+    }
+    if (status === 'in_progress') {
+        return (_jsxs(Text, { color: planItemMarkerColor(status), bold: planItemMarkerBold(status), children: ["\u25B8", ' '] }));
+    }
+    return _jsx(Text, { color: planItemMarkerColor(status), children: "\u25A1 " });
+}
+export function planItemMarkerColor(status) {
+    if (status === 'completed') {
+        return remiDarkTheme.success;
+    }
+    if (status === 'in_progress') {
+        return remiDarkTheme.accent;
+    }
+    return remiDarkTheme.muted;
+}
+export function planItemMarkerBold(_status) {
+    return false;
+}
+function ToolMessage({ message, marginTop, width, language, }) {
+    if (message.state === 'running') {
+        if (isShellTool(message.toolName)) {
+            return _jsx(ShellRunningToolMessage, { message: message, marginTop: marginTop, width: width, language: language });
+        }
+        return (_jsx(Box, { flexDirection: "row", marginTop: marginTop, children: _jsx(ToolRunningActionText, { toolName: message.toolName, summary: message.summary, language: language }) }));
+    }
+    if (message.state === 'done') {
+        if (isShellTool(message.toolName)) {
+            return _jsx(ShellToolMessage, { message: message, marginTop: marginTop, width: width, language: language });
+        }
+        return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsxs(Text, { children: [_jsx(Text, { color: remiDarkTheme.accent, children: "\u2022 " }), _jsx(ToolResultActionText, { message: message, language: language })] }), _jsx(ToolResultDetail, { toolName: message.toolName, summary: message.summary, detail: message.kind === 'tool-result' ? message.detail : undefined, width: width })] }));
+    }
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsxs(Text, { children: [_jsx(Text, { color: toolStateColor(message.state), children: "\u2022 " }), _jsx(Text, { color: toolStateColor(message.state), bold: toolStateLabelBold(message.state), children: toolStateLabel(message.state, language) })] }), _jsxs(Box, { marginLeft: 2, children: [_jsx(Text, { color: remiDarkTheme.muted, children: "\u2514 " }), _jsx(ToolActionText, { toolName: message.toolName, summary: message.summary, color: remiDarkTheme.muted, language: language })] }), message.kind === 'tool-result' && message.detail ? (_jsx(Box, { marginLeft: 2, children: _jsx(Text, { color: remiDarkTheme.muted, children: message.detail }) })) : null] }));
+}
+function ShellRunningToolMessage({ message, marginTop, width, language, }) {
+    const markdownTheme = useMarkdownTheme();
+    const command = commandForToolMessage(message);
+    const commandLines = compactWrappedLines(command, commandPreviewWidth(width), 2);
+    const firstLine = commandLines[0] ?? command;
+    const continuationLines = commandLines.slice(1);
+    const elapsed = formatRunningElapsed(message.kind === 'tool-call' ? message.startedAt : undefined);
+    const tick = useActivityTick(true, message.callId ?? `${message.toolName}-${message.summary}`);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsxs(Text, { children: [_jsx(ActivityGlyph, { tick: tick }), _jsx(Text, { color: activityBaseColor, children: " " }), _jsx(FlowingText, { text: toolRunningOperationLabel('running', language), tick: tick }), _jsx(Text, { color: remiDarkTheme.muted, children: " " }), _jsx(ShellInlineCommand, { command: firstLine, theme: markdownTheme }), _jsx(AnimatedDots, { tick: tick }), _jsxs(Text, { color: remiDarkTheme.muted, children: [" (", elapsed, " \u00B7 ", t(language, 'working.interrupt'), ")"] })] }), continuationLines.map((line, index) => (_jsxs(Box, { marginLeft: 2, children: [_jsx(Text, { color: remiDarkTheme.muted, children: "\u2502 " }), _jsx(ShellInlineCommand, { command: line, theme: markdownTheme })] }, `${index}-${line}`)))] }));
+}
+function ShellToolMessage({ message, marginTop, width, language, }) {
+    const markdownTheme = useMarkdownTheme();
+    const command = commandForToolMessage(message);
+    const exitCode = message.kind === 'tool-result' ? parseCommandExitCode(message.summary) : undefined;
+    const commandLines = compactWrappedLines(command, commandPreviewWidth(width), 2);
+    const firstLine = commandLines[0] ?? command;
+    const continuationLines = commandLines.slice(1);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsxs(Text, { children: [_jsx(Text, { color: remiDarkTheme.accent, children: "\u2022 " }), _jsx(Text, { color: remiDarkTheme.accent, children: toolOperationLabel('run', language) }), _jsx(Text, { color: remiDarkTheme.muted, children: " " }), _jsx(ShellInlineCommand, { command: firstLine, theme: markdownTheme }), exitCode !== undefined && exitCode !== 0 ? _jsxs(Text, { color: remiDarkTheme.danger, children: [" (exit ", exitCode, ")"] }) : null] }), continuationLines.map((line, index) => (_jsxs(Box, { marginLeft: 2, children: [_jsx(Text, { color: remiDarkTheme.muted, children: "\u2502 " }), _jsx(ShellInlineCommand, { command: line, theme: markdownTheme })] }, `${index}-${line}`))), _jsx(ShellOutputDetail, { detail: message.kind === 'tool-result' ? message.detail : undefined, width: width })] }));
+}
+function ToolResultGroup({ messages, marginTop, width, language, }) {
+    const state = messages[0]?.state ?? 'done';
+    const failed = state === 'failed' || state === 'denied';
+    const bulletColor = failed ? toolStateColor(state) : remiDarkTheme.accent;
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsxs(Text, { children: [_jsx(Text, { color: bulletColor, children: "\u2022 " }), _jsx(ToolGroupTitle, { messages: messages, language: language })] }), messages.map((message, index) => isShellTool(message.toolName) ? (_jsx(ShellToolGroupItem, { message: message, failed: failed, isLast: index === messages.length - 1, width: width }, `${message.toolName}-${message.callId ?? index}`)) : (_jsxs(Box, { flexDirection: "column", marginTop: shouldSeparateToolGroupItem(messages, index) ? 1 : 0, children: [_jsx(Box, { marginLeft: 2, children: _jsxs(Text, { wrap: "wrap", children: [_jsx(Text, { color: remiDarkTheme.muted, children: index === messages.length - 1 ? '└ ' : '├ ' }), _jsx(ToolGroupItemText, { message: message, failed: failed, language: language })] }) }), _jsx(ToolResultDetail, { toolName: message.toolName, summary: message.summary, detail: message.detail, width: width })] }, `${message.toolName}-${message.callId ?? index}`)))] }));
+}
+function shouldSeparateToolGroupItem(messages, index) {
+    if (index === 0) {
+        return false;
+    }
+    return Boolean(messages[index - 1]?.detail?.trim());
+}
+function ShellToolGroupItem({ message, failed, isLast, width, }) {
+    const markdownTheme = useMarkdownTheme();
+    const command = commandForToolMessage(message);
+    const commandLines = compactWrappedLines(command, commandPreviewWidth(width), 2);
+    const firstLine = commandLines[0] ?? command;
+    const continuationLines = commandLines.slice(1);
+    const outputLines = shellOutputLines(message.detail, width);
+    const branch = isLast ? '└ ' : '├ ';
+    const continuation = isLast ? '  ' : '│ ';
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { marginLeft: 2, children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: failed ? toolStateColor(message.state) : remiDarkTheme.muted, children: branch }), _jsx(ShellInlineCommand, { command: firstLine, theme: markdownTheme })] }) }), continuationLines.map((line, index) => (_jsx(Box, { marginLeft: 2, children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: remiDarkTheme.muted, children: continuation }), _jsx(ShellInlineCommand, { command: line, theme: markdownTheme })] }) }, `command-${index}-${line}`))), outputLines.map((line, index) => (_jsx(Box, { marginLeft: 2, children: _jsxs(Text, { color: remiDarkTheme.muted, wrap: "truncate-end", children: [continuation, line.length > 0 ? line : ' '] }) }, `output-${index}-${line}`)))] }));
+}
+function ToolGroupTitle({ messages, language }) {
+    const first = messages[0];
+    if (!first) {
+        return _jsx(Text, { color: remiDarkTheme.muted, children: toolOperationLabel('done', language) });
+    }
+    if (first.state === 'failed' || first.state === 'denied') {
+        return _jsx(Text, { color: toolStateColor(first.state), children: toolStateLabel(first.state, language) });
+    }
+    if (messages.length === 1) {
+        return _jsx(ToolResultActionText, { message: first, language: language });
+    }
+    const operation = toolResultOperation(first);
+    if (operation === 'list') {
+        return _jsx(OperationTitle, { operation: toolOperationLabel('list', language), rest: toolCountRest(messages.length, 'directory', language) });
+    }
+    if (operation === 'read') {
+        return _jsx(OperationTitle, { operation: toolOperationLabel('read', language), rest: toolCountRest(messages.length, 'file', language) });
+    }
+    if (operation === 'search') {
+        return _jsx(OperationTitle, { operation: toolOperationLabel('search', language), rest: toolCountRest(messages.length, 'query', language) });
+    }
+    if (operation === 'find') {
+        return _jsx(OperationTitle, { operation: toolOperationLabel('find', language), rest: toolCountRest(messages.length, 'pattern', language) });
+    }
+    if (operation === 'create') {
+        return _jsx(OperationTitle, { operation: toolOperationLabel('create', language), rest: toolCountRest(messages.length, 'directory', language) });
+    }
+    if (operation === 'edit') {
+        return _jsx(OperationTitle, { operation: toolOperationLabel('edit', language), rest: toolCountRest(messages.length, 'file', language) });
+    }
+    if (operation === 'run') {
+        return _jsx(OperationTitle, { operation: toolOperationLabel('run', language), rest: toolCountRest(messages.length, 'command', language) });
+    }
+    return _jsx(OperationTitle, { operation: toolOperationLabel('completed', language), rest: toolCountRest(messages.length, 'tool', language) });
+}
+function OperationTitle({ operation, rest, animated = false, tick = 0 }) {
+    return (_jsxs(_Fragment, { children: [animated ? _jsx(FlowingText, { text: operation, tick: tick }) : _jsx(Text, { color: remiDarkTheme.accent, children: operation }), _jsxs(Text, { color: remiDarkTheme.muted, children: [" ", rest] }), animated ? _jsx(AnimatedDots, { tick: tick }) : null] }));
+}
+function toolOperationLabel(operation, language) {
+    return t(language, `tool.action.${operation}`);
+}
+function toolRunningOperationLabel(operation, language) {
+    return t(language, `tool.running.${operation}`);
+}
+function toolCountRest(count, kind, language) {
+    const plurality = count === 1 ? 'one' : 'other';
+    return `${count} ${t(language, `tool.count.${kind}.${plurality}`)}`;
+}
+function toolOperationKeyFromCanonical(operation) {
+    if (operation === 'list') {
+        return 'list';
+    }
+    if (operation === 'read') {
+        return 'read';
+    }
+    if (operation === 'search') {
+        return 'search';
+    }
+    if (operation === 'find') {
+        return 'find';
+    }
+    if (operation === 'create') {
+        return 'create';
+    }
+    if (operation === 'exists') {
+        return 'exists';
+    }
+    if (operation === 'write') {
+        return 'write';
+    }
+    if (operation === 'edit') {
+        return 'edit';
+    }
+    if (operation === 'delete') {
+        return 'delete';
+    }
+    if (operation === 'run') {
+        return 'run';
+    }
+    return undefined;
+}
+function ToolGroupItemText({ message, failed, language }) {
+    const markdownTheme = useMarkdownTheme();
+    if (failed) {
+        return _jsx(ToolActionText, { toolName: message.toolName, summary: message.summary, color: remiDarkTheme.muted, language: language });
+    }
+    if (message.toolName === 'read_file' || message.toolName === 'list_files') {
+        return _jsx(Text, { color: remiDarkTheme.muted, children: toolPathFromInputSummary(message.inputSummary) ?? extractToolTarget(message.summary) });
+    }
+    const edited = parseEditedWriteSummary(message.summary);
+    if ((message.toolName === 'edit_file' || message.toolName === 'write_file') && edited) {
+        return _jsx(EditedPathText, { path: edited.path, addedLines: edited.addedLines, removedLines: edited.removedLines, color: remiDarkTheme.muted });
+    }
+    if (message.toolName === 'create_directory') {
+        const created = parseCreateDirectorySummary(message.summary);
+        return _jsx(Text, { color: remiDarkTheme.muted, children: created?.path ?? extractToolTarget(message.summary) });
+    }
+    if (message.toolName === 'delete_file' || message.toolName === 'delete_directory') {
+        const deleted = parseDeleteFileSummary(message.summary);
+        if (message.toolName === 'delete_file' && deleted?.addedLines !== undefined && deleted.removedLines !== undefined) {
+            return _jsx(EditedPathText, { path: deleted.path, addedLines: deleted.addedLines, removedLines: deleted.removedLines, color: remiDarkTheme.muted });
+        }
+        return _jsx(Text, { color: remiDarkTheme.muted, children: deleted?.path ?? extractToolTarget(message.summary) });
+    }
+    if (message.toolName === 'search_text' || message.toolName === 'glob') {
+        return _jsx(SearchResultText, { toolName: message.toolName, inputSummary: message.inputSummary, resultSummary: message.summary, includeOperation: true, language: language });
+    }
+    if (message.toolName === 'run_command' || message.toolName === 'execute_shell') {
+        return _jsx(ShellInlineCommand, { command: commandForToolMessage(message), theme: markdownTheme });
+    }
+    return _jsx(Text, { color: remiDarkTheme.muted, children: extractToolTarget(message.summary) });
+}
+function ToolResultActionText({ message, language, }) {
+    if (message.kind === 'tool-result' && (message.toolName === 'search_text' || message.toolName === 'glob')) {
+        return _jsx(SearchResultText, { toolName: message.toolName, inputSummary: message.inputSummary, resultSummary: message.summary, includeOperation: true, language: language });
+    }
+    if (message.kind === 'tool-result' && (message.toolName === 'read_file' || message.toolName === 'list_files')) {
+        const target = toolPathFromInputSummary(message.inputSummary);
+        if (target) {
+            return _jsx(ToolActionText, { toolName: message.toolName, summary: target, language: language });
+        }
+    }
+    if (message.toolName === 'run_command' || message.toolName === 'execute_shell') {
+        return _jsx(ToolRunActionText, { message: message, language: language });
+    }
+    return _jsx(ToolActionText, { toolName: message.toolName, summary: message.summary, language: language });
+}
+function ToolRunActionText({ message, language, }) {
+    const exitCode = message.kind === 'tool-result' ? parseCommandExitCode(message.summary) : undefined;
+    const markdownTheme = useMarkdownTheme();
+    return (_jsxs(_Fragment, { children: [_jsx(Text, { color: remiDarkTheme.accent, children: toolOperationLabel('run', language) }), _jsx(Text, { color: remiDarkTheme.muted, children: " " }), _jsx(ShellInlineCommand, { command: commandForToolMessage(message), theme: markdownTheme }), exitCode !== undefined && exitCode !== 0 ? _jsxs(Text, { color: remiDarkTheme.danger, children: [" (exit ", exitCode, ")"] }) : null] }));
+}
+function SearchResultText({ toolName, inputSummary, resultSummary, includeOperation, language, }) {
+    if (!inputSummary) {
+        return _jsx(ToolActionText, { toolName: toolName, summary: resultSummary, language: language });
+    }
+    const target = formatSearchTarget(inputSummary ?? extractToolTarget(resultSummary));
+    const result = formatSearchResultSummary(resultSummary, toolName, language);
+    const rest = result ? `${target} — ${result}` : target;
+    if (includeOperation) {
+        return _jsx(OperationTitle, { operation: toolOperationLabel(toolName === 'glob' ? 'find' : 'search', language), rest: rest });
+    }
+    return _jsx(Text, { color: remiDarkTheme.muted, children: rest });
+}
+function formatRunningElapsed(startedAt) {
+    if (startedAt === undefined) {
+        return '1s';
+    }
+    return formatTaskDuration(Date.now() - startedAt);
+}
+function formatSearchTarget(inputSummary) {
+    const matchingIndex = inputSummary.indexOf(' matching ');
+    const beforeMatching = matchingIndex >= 0 ? inputSummary.slice(0, matchingIndex) : inputSummary;
+    const matching = matchingIndex >= 0 ? inputSummary.slice(matchingIndex) : '';
+    const inIndex = beforeMatching.indexOf(' in ');
+    const query = inIndex >= 0 ? beforeMatching.slice(0, inIndex) : beforeMatching;
+    const scope = inIndex >= 0 ? beforeMatching.slice(inIndex) : '';
+    return `"${query}"${scope}${matching}`;
+}
+function formatSearchResultSummary(summary, toolName, language) {
+    const match = /^(\d+)\s+matches(?:\s+in\s+([^:]+))?/i.exec(summary.trim());
+    if (!match?.[1]) {
+        return summary;
+    }
+    const label = t(language, toolName === 'glob' ? 'tool.result.paths' : 'tool.result.matches');
+    if (language === 'zh-Hans') {
+        return match[2] ? `${match[1]} ${label}，位于 ${match[2]}` : `${match[1]} ${label}`;
+    }
+    return match[2] ? `${match[1]} ${label} in ${match[2]}` : `${match[1]} ${label}`;
+}
+function ToolRunningActionText({ toolName, summary, language }) {
+    const label = toolRunningActionLabel(toolName, summary);
+    if (label === 'Updating plan') {
+        const tick = useActivityTick(true, `${toolName}-${summary}`);
+        return _jsx(ActivityText, { label: toolRunningOperationLabel('updatingPlan', language), tick: tick });
+    }
+    const parsed = splitToolAction(label, language);
+    const tick = useActivityTick(true, `${toolName}-${summary}`);
+    if (parsed) {
+        return _jsx(OperationTitle, { operation: parsed.operation, rest: parsed.rest, tick: tick, animated: true });
+    }
+    return _jsx(ActivityText, { label: label, tick: tick });
+}
+function ToolActionText({ toolName, summary, color = remiDarkTheme.muted, language, }) {
+    const action = toolActionLabel(toolName, summary);
+    if (action === 'Plan update') {
+        return _jsx(Text, { color: remiDarkTheme.accent, children: toolOperationLabel('planUpdate', language) });
+    }
+    const edited = /^(?:Edit|Edited)\s+(.+?)\s+\(\+(\d+)\s+-(\d+)\)$/.exec(action);
+    if (edited?.[1] && edited[2] !== undefined && edited[3] !== undefined) {
+        return _jsx(EditedPathText, { path: edited[1], addedLines: Number(edited[2]), removedLines: Number(edited[3]), color: color, prefix: toolOperationLabel('edit', language) });
+    }
+    const deleted = /^(?:Delete|Deleted)\s+(.+?)\s+\(\+(\d+)\s+-(\d+)\)$/.exec(action);
+    if (deleted?.[1] && deleted[2] !== undefined && deleted[3] !== undefined) {
+        return _jsx(EditedPathText, { path: deleted[1], addedLines: Number(deleted[2]), removedLines: Number(deleted[3]), color: color, prefix: toolOperationLabel('delete', language) });
+    }
+    const parsed = splitToolAction(action, language);
+    if (parsed) {
+        return _jsx(OperationTitle, { operation: parsed.operation, rest: parsed.rest });
+    }
+    return _jsx(Text, { color: color, children: action });
+}
+function EditedPathText({ path, addedLines, removedLines, color, prefix = '', }) {
+    const operation = prefix.trim();
+    return (_jsxs(_Fragment, { children: [operation ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: remiDarkTheme.accent, children: operation }), _jsx(Text, { color: color, children: " " })] })) : null, _jsxs(Text, { color: color, children: [path, " ("] }), _jsxs(Text, { color: remiDarkTheme.success, children: ["+", addedLines] }), _jsx(Text, { color: color, children: " " }), _jsxs(Text, { color: remiDarkTheme.danger, children: ["-", removedLines] }), _jsx(Text, { color: color, children: ")" })] }));
+}
+function splitToolAction(action, language) {
+    const match = /^(List|Read|Search|Find|Create|Exists|Write|Edit|Delete|Run|Edited|Deleted|Ran|Listing|Reading|Searching|Finding|Creating|Writing|Editing|Running|Deleting)\s+(.+)$/i.exec(action);
+    if (!match?.[1] || !match[2]) {
+        return undefined;
+    }
+    return {
+        operation: normalizeOperationLabel(match[1], language),
+        rest: match[2],
+    };
+}
+function normalizeOperationLabel(operation, language) {
+    const normalized = operation.toLowerCase();
+    if (normalized === 'ran') {
+        return toolOperationLabel('run', language);
+    }
+    if (normalized === 'edited') {
+        return toolOperationLabel('edit', language);
+    }
+    if (normalized === 'deleted') {
+        return toolOperationLabel('delete', language);
+    }
+    if (normalized === 'listing') {
+        return toolRunningOperationLabel('listing', language);
+    }
+    if (normalized === 'reading') {
+        return toolRunningOperationLabel('reading', language);
+    }
+    if (normalized === 'searching') {
+        return toolRunningOperationLabel('searching', language);
+    }
+    if (normalized === 'finding') {
+        return toolRunningOperationLabel('finding', language);
+    }
+    if (normalized === 'creating') {
+        return toolRunningOperationLabel('creating', language);
+    }
+    if (normalized === 'writing') {
+        return toolRunningOperationLabel('writing', language);
+    }
+    if (normalized === 'editing') {
+        return toolRunningOperationLabel('editing', language);
+    }
+    if (normalized === 'deleting') {
+        return toolRunningOperationLabel('deleting', language);
+    }
+    if (normalized === 'running') {
+        return toolRunningOperationLabel('running', language);
+    }
+    const operationKey = toolOperationKeyFromCanonical(normalized);
+    if (operationKey) {
+        return toolOperationLabel(operationKey, language);
+    }
+    return `${normalized.slice(0, 1).toUpperCase()}${normalized.slice(1)}`;
+}
+function ToolResultDetail({ toolName, summary, detail, width }) {
+    const markdownTheme = useMarkdownTheme();
+    if (isShellTool(toolName)) {
+        return _jsx(ShellOutputDetail, { detail: detail, width: width });
+    }
+    if (!detail || detail.trim().length === 0) {
+        return null;
+    }
+    const language = toolName === 'edit_file' || toolName === 'write_file' || toolName === 'delete_file'
+        ? languageFromPath(parseEditedWriteSummary(summary)?.path ?? parseDeleteFileSummary(summary)?.path ?? extractToolTarget(summary))
+        : undefined;
+    return (_jsx(Box, { flexDirection: "column", children: _jsx(StructuredDiffView, { diff: detail, theme: markdownTheme, width: width, ...(language ? { language } : {}) }) }));
+}
+function ShellOutputDetail({ detail, width }) {
+    const lines = shellOutputLines(detail, width);
+    return (_jsx(Box, { marginLeft: 2, flexDirection: "column", children: lines.map((line, index) => (_jsxs(Text, { color: remiDarkTheme.muted, wrap: "truncate-end", children: [index === 0 ? '└ ' : '  ', line.length > 0 ? line : ' '] }, `${index}-${line}`))) }));
+}
+function shellOutputLines(detail, width) {
+    const text = detail && detail.trim().length > 0 ? detail.trim() : '(no output)';
+    return compactExistingLines(text, shellOutputWidth(width), 2);
+}
+function isShellTool(toolName) {
+    return toolName === 'run_command' || toolName === 'execute_shell';
+}
+function commandPreviewWidth(width) {
+    return width === undefined ? 96 : Math.max(24, width - 8);
+}
+function shellOutputWidth(width) {
+    return width === undefined ? 96 : Math.max(24, width - 4);
+}
+function compactWrappedLines(value, width, maxLines) {
+    const text = value.replace(/\s*\r?\n\s*/g, ' ').trim();
+    if (text.length === 0) {
+        return [''];
+    }
+    const lines = [];
+    let remaining = text;
+    while (remaining.length > 0 && lines.length < maxLines) {
+        if (lines.length === maxLines - 1) {
+            lines.push(truncateTextToWidth(remaining, width));
+            break;
+        }
+        const { line, rest } = takeWrappedLine(remaining, width);
+        lines.push(line);
+        remaining = rest;
+    }
+    return lines;
+}
+function compactExistingLines(value, width, maxLines) {
+    const rawLines = value.split(/\r?\n/);
+    const visibleLines = rawLines.slice(0, maxLines).map(line => truncateTextToWidth(line, width));
+    if (visibleLines.length === 0) {
+        return [''];
+    }
+    if (rawLines.length > maxLines) {
+        const lastIndex = visibleLines.length - 1;
+        visibleLines[lastIndex] = appendEllipsis(visibleLines[lastIndex] ?? '', width);
+    }
+    return visibleLines;
+}
+function takeWrappedLine(value, width) {
+    if (displayWidth(value) <= width) {
+        return { line: value, rest: '' };
+    }
+    const chars = Array.from(value);
+    let usedWidth = 0;
+    let cutIndex = 0;
+    let lastSpaceIndex = -1;
+    for (let index = 0; index < chars.length; index += 1) {
+        const char = chars[index] ?? '';
+        const nextWidth = usedWidth + displayWidth(char);
+        if (nextWidth > width) {
+            break;
+        }
+        usedWidth = nextWidth;
+        cutIndex = index + 1;
+        if (/\s/.test(char)) {
+            lastSpaceIndex = index;
+        }
+    }
+    const shellBreakIndex = preferredShellBreakIndex(chars.slice(0, cutIndex).join(''));
+    const breakIndex = shellBreakIndex ?? (lastSpaceIndex > 0 ? lastSpaceIndex : Math.max(1, cutIndex));
+    return {
+        line: chars.slice(0, breakIndex).join('').trimEnd(),
+        rest: chars.slice(breakIndex).join('').trimStart(),
+    };
+}
+function preferredShellBreakIndex(prefix) {
+    const candidates = [' && ', ' ; '];
+    let breakIndex = -1;
+    for (const candidate of candidates) {
+        const index = prefix.lastIndexOf(candidate);
+        if (index > 0) {
+            breakIndex = Math.max(breakIndex, index + candidate.length);
+        }
+    }
+    return breakIndex > 0 ? breakIndex : undefined;
+}
+function appendEllipsis(value, width) {
+    const suffix = ' ...';
+    if (displayWidth(value) + displayWidth(suffix) <= width) {
+        return `${value}${suffix}`;
+    }
+    return truncateTextToWidth(value, width);
+}
+function truncateTextToWidth(value, width) {
+    const ellipsis = '...';
+    if (displayWidth(value) <= width) {
+        return value;
+    }
+    const contentWidth = Math.max(1, width - displayWidth(ellipsis));
+    let usedWidth = 0;
+    let result = '';
+    for (const char of value) {
+        const charWidth = displayWidth(char);
+        if (usedWidth + charWidth > contentWidth) {
+            break;
+        }
+        result += char;
+        usedWidth += charWidth;
+    }
+    return `${result.trimEnd()}${ellipsis}`;
+}
+function toolActionLabel(toolName, summary) {
+    if (toolName === 'list_files') {
+        return `List ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'read_file') {
+        return `Read ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'search_text') {
+        return `Search ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'glob') {
+        return `Find ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'todo_write') {
+        return 'Plan update';
+    }
+    if (toolName === 'create_directory') {
+        const created = parseCreateDirectorySummary(summary);
+        if (created) {
+            return `${created.created ? 'Create' : 'Exists'} ${created.path}`;
+        }
+        return `Create ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'edit_file' || toolName === 'write_file') {
+        const edited = parseEditedWriteSummary(summary);
+        if (edited) {
+            return `Edit ${edited.path} (+${edited.addedLines} -${edited.removedLines})`;
+        }
+        return `Write ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'delete_file' || toolName === 'delete_directory') {
+        const deleted = parseDeleteFileSummary(summary);
+        if (toolName === 'delete_file' && deleted?.addedLines !== undefined && deleted.removedLines !== undefined) {
+            return `Delete ${deleted.path} (+${deleted.addedLines} -${deleted.removedLines})`;
+        }
+        return `Delete ${deleted?.path ?? extractToolTarget(summary)}`;
+    }
+    if (toolName === 'run_command') {
+        return summary;
+    }
+    if (toolName === 'execute_shell') {
+        return `Run ${extractToolTarget(summary)}`;
+    }
+    return `${toolName} ${summary}`.trim();
+}
+function commandForToolMessage(message) {
+    if (message.kind === 'tool-result' && message.inputSummary) {
+        return commandFromInputSummary(message.inputSummary) ?? message.inputSummary;
+    }
+    return commandFromInputSummary(message.summary) ?? extractToolTarget(message.summary);
+}
+function commandFromInputSummary(inputSummary) {
+    try {
+        const parsed = JSON.parse(inputSummary);
+        if (parsed && typeof parsed === 'object' && !Array.isArray(parsed) && typeof parsed['command'] === 'string') {
+            return parsed['command'];
+        }
+    }
+    catch {
+        // Plain command summaries are expected for tool-call events.
+    }
+    return inputSummary.trim().length > 0 ? inputSummary : undefined;
+}
+function toolPathFromInputSummary(inputSummary) {
+    if (!inputSummary) {
+        return undefined;
+    }
+    try {
+        const parsed = JSON.parse(inputSummary);
+        if (parsed && typeof parsed === 'object' && !Array.isArray(parsed) && typeof parsed['path'] === 'string') {
+            return parsed['path'];
+        }
+    }
+    catch {
+        // Current TUI tool-call summaries use plain path text for read/list calls.
+    }
+    const trimmed = inputSummary.trim();
+    return trimmed.length > 0 ? trimmed : undefined;
+}
+function parseCommandExitCode(summary) {
+    const match = /\bexit\s+(-?\d+)/i.exec(summary);
+    return match?.[1] !== undefined ? Number(match[1]) : undefined;
+}
+function toolRunningActionLabel(toolName, summary) {
+    if (toolName === 'list_files') {
+        return `Listing ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'read_file') {
+        return `Reading ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'search_text') {
+        return `Searching ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'glob') {
+        return `Finding ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'todo_write') {
+        return 'Updating plan';
+    }
+    if (toolName === 'create_directory') {
+        return `Creating ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'edit_file') {
+        return `Editing ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'write_file') {
+        return `Writing ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'delete_file' || toolName === 'delete_directory') {
+        return `Deleting ${extractToolTarget(summary)}`;
+    }
+    if (toolName === 'run_command' || toolName === 'execute_shell') {
+        return `Running ${extractToolTarget(summary)}`;
+    }
+    return `Running ${summary}`.trim();
+}
+function parseEditedWriteSummary(summary) {
+    const match = /^edited\s+(.+?)\s+\(\+(\d+)\s+-(\d+)\)$/i.exec(summary.trim());
+    if (!match?.[1] || match[2] === undefined || match[3] === undefined) {
+        return undefined;
+    }
+    return {
+        path: match[1],
+        addedLines: Number(match[2]),
+        removedLines: Number(match[3]),
+    };
+}
+function parseCreateDirectorySummary(summary) {
+    const match = /^(created|exists)\s+(.+)$/i.exec(summary.trim());
+    if (!match?.[1] || !match[2]) {
+        return undefined;
+    }
+    return {
+        created: match[1].toLowerCase() === 'created',
+        path: match[2],
+    };
+}
+function parseDeleteFileSummary(summary) {
+    const statsMatch = /^deleted\s+(.+?)\s+\(\+(\d+)\s+-(\d+)\)$/i.exec(summary.trim());
+    if (statsMatch?.[1] && statsMatch[2] !== undefined && statsMatch[3] !== undefined) {
+        return {
+            path: statsMatch[1],
+            addedLines: Number(statsMatch[2]),
+            removedLines: Number(statsMatch[3]),
+        };
+    }
+    const match = /^deleted\s+(.+)$/i.exec(summary.trim());
+    return match?.[1] ? { path: match[1] } : undefined;
+}
+function extractToolTarget(summary) {
+    const entriesMatch = summary.match(/^\d+\s+(?:entries|matches)\s+in\s+([^:]+)(?::|$)/);
+    if (entriesMatch?.[1]) {
+        return entriesMatch[1];
+    }
+    const readMatch = summary.match(/^read\s+\d+\s+bytes\s+from\s+(.+)$/);
+    if (readMatch?.[1]) {
+        return readMatch[1];
+    }
+    const writeMatch = summary.match(/^(?:created|updated|wrote|edited|exists|deleted)\s+(.+?)(?:\s+\(|$)/);
+    if (writeMatch?.[1]) {
+        return writeMatch[1];
+    }
+    return summary;
+}
+function languageFromPath(path) {
+    const extension = path.split(/[/.]/).pop()?.toLowerCase();
+    if (!extension || extension === path.toLowerCase()) {
+        return undefined;
+    }
+    const languages = {
+        c: 'c',
+        cc: 'cpp',
+        cpp: 'cpp',
+        css: 'css',
+        go: 'go',
+        h: 'c',
+        hpp: 'cpp',
+        html: 'xml',
+        java: 'java',
+        js: 'javascript',
+        json: 'json',
+        jsx: 'javascript',
+        md: 'markdown',
+        mjs: 'javascript',
+        py: 'python',
+        rs: 'rust',
+        sh: 'bash',
+        ts: 'typescript',
+        tsx: 'typescript',
+        xml: 'xml',
+        yaml: 'yaml',
+        yml: 'yaml',
+    };
+    return languages[extension];
+}
+function toolStateLabel(state, language) {
+    if (state === 'running') {
+        return t(language, 'tool.state.running');
+    }
+    if (state === 'done') {
+        return t(language, 'tool.state.done');
+    }
+    if (state === 'failed') {
+        return t(language, 'tool.state.failed');
+    }
+    if (state === 'denied') {
+        return t(language, 'tool.state.denied');
+    }
+    return t(language, 'tool.state.pending');
+}
+export function toolStateLabelBold(state) {
+    return state !== 'failed';
+}
+function toolResultOperation(message) {
+    if (message.state === 'failed' || message.state === 'denied') {
+        return message.state;
+    }
+    if (message.toolName === 'list_files') {
+        return 'list';
+    }
+    if (message.toolName === 'read_file') {
+        return 'read';
+    }
+    if (message.toolName === 'search_text') {
+        return 'search';
+    }
+    if (message.toolName === 'glob') {
+        return 'find';
+    }
+    if (message.toolName === 'create_directory') {
+        return 'create';
+    }
+    if (message.toolName === 'edit_file' || message.toolName === 'write_file') {
+        return 'edit';
+    }
+    if (message.toolName === 'delete_file' || message.toolName === 'delete_directory') {
+        return 'edit';
+    }
+    if (message.toolName === 'run_command') {
+        return 'run';
+    }
+    if (message.toolName === 'execute_shell') {
+        return 'run';
+    }
+    return message.toolName;
+}
+function TaskSummary({ durationMs, marginTop, width, label = 'Worked for' }) {
+    return (_jsx(Box, { marginTop: marginTop, ...(width !== undefined ? { width } : {}), children: _jsx(Text, { color: remiDarkTheme.muted, wrap: "truncate-end", children: fullWidthDivider(`${label} ${formatTaskDuration(durationMs)}`, width) }) }));
+}
+function fullWidthDivider(label, width) {
+    const targetWidth = Math.max(displayWidth(label) + 4, width ?? displayWidth(label) + 4);
+    const content = ` ${label} `;
+    const remaining = Math.max(0, targetWidth - displayWidth(content));
+    const leftWidth = Math.floor(remaining / 2);
+    const rightWidth = remaining - leftWidth;
+    return `${'─'.repeat(leftWidth)}${content}${'─'.repeat(rightWidth)}`;
+}
+export function formatTaskDuration(durationMs) {
+    const totalSeconds = Math.max(1, Math.round(durationMs / 1000));
+    const hours = Math.floor(totalSeconds / 3600);
+    const minutes = Math.floor((totalSeconds % 3600) / 60);
+    const seconds = totalSeconds % 60;
+    if (hours > 0) {
+        return `${hours}h ${minutes}m ${seconds}s`;
+    }
+    if (minutes > 0) {
+        return `${minutes}m ${seconds}s`;
+    }
+    return `${seconds}s`;
+}
+function ModelPanel({ message, marginTop, }) {
+    const selectedIndex = normalizeSelectedIndex(message);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsx(Text, { color: remiDarkTheme.text, bold: true, children: message.title }), _jsx(Text, { color: remiDarkTheme.muted, children: message.subtitle }), _jsx(Box, { height: 1 }), message.models.map((model, index) => {
+                const isActive = model.alias === message.activeAlias;
+                const isSelected = index === selectedIndex;
+                const rowColor = isSelected ? remiDarkTheme.accent : isActive ? remiDarkTheme.success : remiDarkTheme.text;
+                const prefix = `${isSelected ? '>' : ' '} ${index + 1}.`;
+                return (_jsx(Box, { flexDirection: "column", children: _jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 5, children: _jsx(Text, { color: rowColor, children: prefix }) }), _jsx(Box, { flexGrow: 1, children: _jsxs(Text, { color: rowColor, bold: isActive || isSelected, children: [model.displayName, isActive ? ` (${message.currentLabel})` : ''] }) })] }) }, model.alias));
+            })] }));
+}
+function normalizeSelectedIndex(message) {
+    if (message.models.length === 0) {
+        return -1;
+    }
+    const rawSelectedIndex = message.selectedIndex ??
+        message.models.findIndex(model => model.alias === message.activeAlias);
+    if (rawSelectedIndex < 0) {
+        return 0;
+    }
+    return Math.min(rawSelectedIndex, message.models.length - 1);
+}
+function StylePanel({ message, marginTop, }) {
+    const selectedIndex = normalizeStyleSelectedIndex(message);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsx(Text, { color: remiDarkTheme.text, bold: true, children: message.title }), _jsx(Text, { color: remiDarkTheme.muted, children: message.subtitle }), _jsx(Box, { height: 1 }), message.styles.map((style, index) => {
+                const isActive = style.id === message.activeId;
+                const isSelected = index === selectedIndex;
+                const rowColor = isSelected ? remiDarkTheme.accent : isActive ? remiDarkTheme.success : remiDarkTheme.text;
+                const detailColor = isSelected ? remiDarkTheme.accent : remiDarkTheme.muted;
+                return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 4, children: _jsx(Text, { color: rowColor, children: isSelected ? '>' : `${index + 1}.` }) }), _jsx(Box, { width: 18, children: _jsxs(Text, { color: rowColor, bold: isActive || isSelected, children: [style.label, isActive ? ` (${message.currentLabel})` : ''] }) }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { color: detailColor, bold: isSelected, children: style.description }) })] }, style.id));
+            })] }));
+}
+function normalizeStyleSelectedIndex(message) {
+    if (message.styles.length === 0) {
+        return -1;
+    }
+    const rawSelectedIndex = message.selectedIndex ??
+        message.styles.findIndex(style => style.id === message.activeId);
+    if (rawSelectedIndex < 0) {
+        return 0;
+    }
+    return Math.min(rawSelectedIndex, message.styles.length - 1);
+}
+function SkillsPanel({ message, marginTop, width, }) {
+    const panelWidth = width === undefined ? undefined : Math.max(40, width);
+    const selectedIndex = normalizePanelSelectedIndex(message.selectedIndex, message.mode === 'actions' ? message.actions.length : message.skills.length);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, paddingX: 1, paddingY: 1, backgroundColor: remiDarkTheme.composerBackground, width: panelWidth, children: [_jsx(Text, { color: remiDarkTheme.text, bold: true, children: message.title }), _jsx(Text, { color: remiDarkTheme.muted, children: message.subtitle }), _jsx(Box, { height: 1 }), message.mode === 'actions' ? (_jsx(SkillsActionRows, { actions: message.actions, selectedIndex: selectedIndex })) : (_jsx(SkillsListRows, { skills: message.skills, selectedIndex: selectedIndex, toggle: message.mode === 'toggle', width: width })), _jsx(Box, { height: 1 }), _jsx(Text, { color: remiDarkTheme.muted, children: message.helpText })] }));
+}
+function SkillsActionRows({ actions, selectedIndex, }) {
+    return (_jsx(_Fragment, { children: actions.map((action, index) => {
+            const isSelected = index === selectedIndex;
+            const color = isSelected ? remiDarkTheme.accent : remiDarkTheme.text;
+            const detailColor = isSelected ? remiDarkTheme.accent : remiDarkTheme.muted;
+            return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { color: color, children: `${index + 1}. ` }), _jsx(Text, { color: color, bold: isSelected, children: action.label }), _jsx(Text, { children: "  " }), _jsx(Text, { color: detailColor, bold: isSelected, children: action.description })] }, action.id));
+        }) }));
+}
+function SkillsListRows({ skills, selectedIndex, toggle, width, }) {
+    if (skills.length === 0) {
+        return _jsx(Text, { color: remiDarkTheme.muted, children: "No skills found" });
+    }
+    return (_jsx(_Fragment, { children: skills.map((skill, index) => {
+            const isSelected = index === selectedIndex;
+            const color = isSelected ? remiDarkTheme.accent : skill.enabled ? remiDarkTheme.text : remiDarkTheme.muted;
+            const detailColor = isSelected ? remiDarkTheme.accent : remiDarkTheme.muted;
+            const marker = toggle ? (skill.enabled ? '[x]' : '[ ]') : `${index + 1}.`;
+            const prefix = `${marker} ${skill.displayName}  ${skill.source}  `;
+            const detailWidth = Math.max(8, (width ?? 100) - displayWidth(prefix) - 4);
+            return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { color: color, children: `${marker} ` }), _jsx(Text, { color: color, bold: isSelected, children: skill.displayName }), _jsx(Text, { children: "  " }), _jsx(Text, { color: detailColor, children: skill.source }), _jsx(Text, { children: "  " }), _jsx(Text, { color: detailColor, wrap: "truncate-end", children: truncateTextToWidth(skill.description, detailWidth) })] }, `${skill.source}-${skill.name}`));
+        }) }));
+}
+const syntaxThemePreviewDiff = [
+    '11   static int lowerBound(int[] nums, int target) {',
+    '12       int left = 0;',
+    '13       int right = nums.length;',
+    '14       while (left < right) {',
+    '15           int mid = left + (right - left) / 2;',
+    '16 -         if (nums[mid] <= target) left = mid + 1;',
+    '16 +         if (nums[mid] < target) left = mid + 1;',
+    '17           else right = mid;',
+    '18       }',
+    '19       return left;',
+    '20   }',
+].join('\n');
+function SyntaxThemePanel({ message, marginTop, width, }) {
+    const themes = visibleSyntaxThemePanelItems(message);
+    const selectedIndex = normalizePanelSelectedIndex(message.selectedIndex, themes.length);
+    const selectedTheme = themes[selectedIndex];
+    const previewTheme = applyTerminalSyntaxTheme(baseMarkdownTheme, selectedTheme?.id ?? message.activeId);
+    const listWidth = 36;
+    const previewWidth = Math.max(42, (width ?? 100) - listWidth - 4);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, paddingX: 1, paddingY: 1, backgroundColor: remiDarkTheme.composerBackground, children: [_jsx(Text, { color: remiDarkTheme.text, bold: true, children: message.title }), _jsx(Text, { color: remiDarkTheme.muted, children: message.subtitle }), _jsx(Box, { height: 1 }), _jsxs(Box, { flexDirection: "row", children: [_jsxs(Box, { flexDirection: "column", width: listWidth, flexShrink: 0, children: [_jsx(Text, { color: remiDarkTheme.muted, wrap: "truncate-end", children: themeSearchLabel(message) }), themes.length === 0 ? _jsx(Text, { color: remiDarkTheme.muted, children: "No matching themes" }) : null, themes.map((theme, index) => {
+                                const isSelected = index === selectedIndex;
+                                const isActive = theme.id === message.activeId;
+                                const rowColor = isSelected ? remiDarkTheme.accent : isActive ? remiDarkTheme.success : remiDarkTheme.text;
+                                return (_jsxs(Text, { color: rowColor, wrap: "truncate-end", children: [isSelected ? '> ' : '  ', theme.id, isActive ? ` (${message.currentLabel})` : ''] }, theme.id));
+                            })] }), _jsx(Box, { flexDirection: "column", flexGrow: 1, children: _jsx(StructuredDiffView, { diff: syntaxThemePreviewDiff, theme: previewTheme, language: "java", width: previewWidth }) })] }), _jsx(Text, { color: remiDarkTheme.muted, children: message.helpText })] }));
+}
+function themeSearchLabel(message) {
+    const query = message.query.trim();
+    return query.length > 0 ? `${message.searchLabel}: ${query}` : `${message.searchLabel}...`;
+}
+function visibleSyntaxThemePanelItems(message) {
+    const query = message.query.trim().toLowerCase();
+    if (!query) {
+        return message.themes;
+    }
+    return message.themes.filter(theme => `${theme.id} ${theme.label} ${theme.description}`.toLowerCase().includes(query));
+}
+function LanguagePanel({ message, marginTop, }) {
+    const selectedIndex = normalizeLanguageSelectedIndex(message);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsx(Text, { color: remiDarkTheme.text, bold: true, children: message.title }), _jsx(Text, { color: remiDarkTheme.muted, children: message.subtitle }), _jsx(Box, { height: 1 }), message.languages.map((language, index) => {
+                const isActive = language.code === message.activeCode;
+                const isSelected = index === selectedIndex;
+                const rowColor = isSelected ? remiDarkTheme.accent : isActive ? remiDarkTheme.success : remiDarkTheme.text;
+                const detailColor = isSelected ? remiDarkTheme.accent : remiDarkTheme.muted;
+                return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 4, children: _jsx(Text, { color: rowColor, children: isSelected ? '>' : `${index + 1}.` }) }), _jsx(Box, { width: 24, children: _jsxs(Text, { color: rowColor, bold: isActive || isSelected, children: [language.label, isActive ? ` (${message.currentLabel})` : ''] }) }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { color: detailColor, bold: isSelected, children: language.description }) })] }, language.code));
+            })] }));
+}
+function normalizeLanguageSelectedIndex(message) {
+    if (message.languages.length === 0) {
+        return -1;
+    }
+    const rawSelectedIndex = message.selectedIndex ??
+        message.languages.findIndex(language => language.code === message.activeCode);
+    if (rawSelectedIndex < 0) {
+        return 0;
+    }
+    return Math.min(rawSelectedIndex, message.languages.length - 1);
+}
+function PermissionProfilePanel({ message, marginTop, }) {
+    const selectedIndex = normalizePermissionProfileSelectedIndex(message);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, children: [_jsx(Text, { color: remiDarkTheme.text, bold: true, children: message.title }), _jsx(Text, { color: remiDarkTheme.muted, children: message.subtitle }), _jsx(Box, { height: 1 }), message.profiles.map((profile, index) => {
+                const isActive = profile.id === message.activeProfile;
+                const isSelected = index === selectedIndex;
+                const rowColor = isSelected ? remiDarkTheme.accent : isActive ? remiDarkTheme.success : remiDarkTheme.text;
+                const detailColor = isSelected ? remiDarkTheme.accent : remiDarkTheme.muted;
+                return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 4, children: _jsx(Text, { color: rowColor, children: isSelected ? '>' : `${index + 1}.` }) }), _jsx(Box, { width: 20, children: _jsxs(Text, { color: rowColor, bold: isActive || isSelected, children: [profile.label, isActive ? ` (${message.currentLabel})` : ''] }) }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { color: detailColor, bold: isSelected, children: profile.description }) })] }, profile.id));
+            })] }));
+}
+function normalizePermissionProfileSelectedIndex(message) {
+    if (message.profiles.length === 0) {
+        return -1;
+    }
+    const rawSelectedIndex = message.selectedIndex ??
+        message.profiles.findIndex(profile => profile.id === message.activeProfile);
+    if (rawSelectedIndex < 0) {
+        return 0;
+    }
+    return Math.min(rawSelectedIndex, message.profiles.length - 1);
+}
+function PermissionRequestCard({ message, marginTop, }) {
+    const selectedIndex = normalizePanelSelectedIndex(message.selectedIndex, message.options.length);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, paddingX: 1, paddingY: 1, backgroundColor: remiDarkTheme.composerBackground, children: [_jsx(Text, { color: remiDarkTheme.text, bold: true, children: message.title }), _jsx(Box, { height: 1 }), _jsx(Text, { color: remiDarkTheme.muted, children: message.reason }), _jsx(PermissionRequestActionLine, { message: message }), message.capability ? _jsx(Text, { color: remiDarkTheme.muted, children: permissionCapabilityDisplay(message.capability) }) : null, _jsx(Box, { height: 1 }), message.options.map((option, index) => {
+                const isSelected = index === selectedIndex;
+                const rowColor = isSelected ? remiDarkTheme.accent : option.id === 'deny' ? remiDarkTheme.muted : remiDarkTheme.text;
+                return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 4, children: _jsx(Text, { color: rowColor, children: isSelected ? '>' : `${index + 1}.` }) }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { color: rowColor, bold: isSelected, children: option.label }) })] }, option.id));
+            }), _jsx(Text, { color: remiDarkTheme.muted, children: message.helpText })] }));
+}
+function PermissionRequestActionLine({ message }) {
+    const fileAction = message.action || message.actionDetail
+        ? { action: message.action, detail: message.actionDetail }
+        : formatPermissionFileActionFromParts(message.toolName, message.summary, undefined, message.targetPath);
+    if (fileAction?.action) {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: remiDarkTheme.accent, children: fileAction.action }), fileAction.detail ? _jsx(Text, { color: remiDarkTheme.muted, children: fileAction.detail }) : null] }));
+    }
+    return (_jsxs(Text, { children: [_jsx(Text, { color: remiDarkTheme.muted, children: "$ " }), _jsx(Text, { color: remiDarkTheme.accent, children: message.command ?? permissionRequestDisplay(message) })] }));
+}
+function permissionRequestDisplay(message) {
+    const path = message.targetPath ?? parseJsonPath(message.summary);
+    if (message.toolName === 'create_directory' && path) {
+        return `mkdir -p ${path}`;
+    }
+    if (message.toolName === 'delete_file' && path) {
+        return `rm ${path}`;
+    }
+    if (message.toolName === 'delete_directory' && path) {
+        return `rmdir ${path}`;
+    }
+    if (message.toolName === 'write_file' && path) {
+        return `write ${path}`;
+    }
+    if (message.toolName === 'edit_file' && path) {
+        return `edit ${path}`;
+    }
+    return message.summary;
+}
+function permissionCapabilityDisplay(capability) {
+    const parts = [`capability: ${capability.id}`, `risk: ${capability.risk}`];
+    if (capability.platform) {
+        parts.push(`platform: ${capability.platform}`);
+    }
+    if (capability.target) {
+        parts.push(`target: ${capability.target}`);
+    }
+    if (capability.packageManager) {
+        parts.push(`manager: ${capability.packageManager}`);
+    }
+    if (capability.requiresAdmin) {
+        parts.push('admin required');
+    }
+    return parts.join(' · ');
+}
+function parseJsonPath(summary) {
+    try {
+        const parsed = JSON.parse(summary);
+        if (parsed && typeof parsed === 'object' && !Array.isArray(parsed)) {
+            const path = parsed['path'];
+            return typeof path === 'string' && path.trim().length > 0 ? path : undefined;
+        }
+    }
+    catch {
+        return undefined;
+    }
+    return undefined;
+}
+function StatusLinePanel({ message, marginTop, }) {
+    const items = visibleStatusLinePanelItems(message);
+    const selectedIndex = normalizePanelSelectedIndex(message.selectedIndex, items.length);
+    return (_jsxs(Box, { flexDirection: "column", marginTop: marginTop, paddingX: 1, paddingY: 1, backgroundColor: remiDarkTheme.composerBackground, children: [_jsx(Text, { color: remiDarkTheme.text, bold: true, children: message.title }), _jsx(Text, { color: remiDarkTheme.muted, children: message.subtitle }), _jsx(Box, { height: 1 }), _jsx(Text, { color: remiDarkTheme.muted, children: message.searchLabel }), _jsx(Text, { color: remiDarkTheme.muted, children: `> ${message.query}` }), items.map((item, index) => {
+                const isSelected = index === selectedIndex;
+                const rowColor = isSelected ? remiDarkTheme.accent : remiDarkTheme.text;
+                const detailColor = isSelected ? remiDarkTheme.accent : remiDarkTheme.muted;
+                return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 4, children: _jsx(Text, { color: rowColor, children: item.enabled ? '[x]' : '[ ]' }) }), _jsx(Box, { width: 24, children: _jsx(Text, { color: rowColor, bold: isSelected, children: item.label }) }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { color: detailColor, bold: isSelected, children: item.description }) })] }, item.id));
+            }), _jsx(Text, { color: remiDarkTheme.muted, children: message.helpText })] }));
+}
+function visibleStatusLinePanelItems(message) {
+    const query = message.query.trim().toLowerCase();
+    if (!query) {
+        return message.items;
+    }
+    return message.items.filter(item => `${item.label} ${item.description}`.toLowerCase().includes(query));
+}
+function normalizePanelSelectedIndex(selectedIndex, length) {
+    if (length <= 0) {
+        return -1;
+    }
+    const rawSelectedIndex = selectedIndex ?? 0;
+    return Math.min(Math.max(rawSelectedIndex, 0), length - 1);
+}
+export function MessageList({ messages, width, emptyText = 'Ready. Type a task, or press / for commands.', language, progress, syntaxTheme, slashCommandHints, }) {
+    const markdownTheme = useMemo(() => applyTerminalSyntaxTheme(baseMarkdownTheme, syntaxTheme), [syntaxTheme]);
+    if (messages.length === 0 && !progress) {
+        if (emptyText.length === 0) {
+            return null;
+        }
+        return (_jsx(MarkdownThemeContext.Provider, { value: markdownTheme, children: _jsx(Box, { flexDirection: "column", marginTop: 1, marginBottom: 1, children: _jsx(Text, { color: remiDarkTheme.muted, children: emptyText }) }) }));
+    }
+    const groups = groupMessages(messages);
+    return (_jsx(MarkdownThemeContext.Provider, { value: markdownTheme, children: _jsxs(Box, { flexDirection: "column", marginTop: 1, marginBottom: 1, children: [groups.map(group => (_jsx(MessageGroup, { messages: group.messages, startIndex: group.startIndex, width: width, language: language, slashCommandHints: slashCommandHints }, group.startIndex))), progress ? (_jsx(WorkingIndicator, { startedAt: progress.startedAt, visible: true, label: progress.label, interruptText: progress.interruptText, marginTop: messages.length === 0 ? 0 : 1 })) : null] }) }));
+}
+function groupMessages(messages) {
+    const groups = [];
+    let index = 0;
+    while (index < messages.length) {
+        const message = messages[index];
+        if (message?.kind === 'tool-result') {
+            const toolGroup = [message];
+            const groupKey = toolResultGroupKey(message);
+            let nextIndex = index + 1;
+            while (nextIndex < messages.length) {
+                const next = messages[nextIndex];
+                if (next?.kind !== 'tool-result') {
+                    break;
+                }
+                if (toolResultGroupKey(next) !== groupKey) {
+                    break;
+                }
+                toolGroup.push(next);
+                nextIndex += 1;
+            }
+            groups.push({ startIndex: index, messages: toolGroup });
+            index = nextIndex;
+            continue;
+        }
+        if (message) {
+            groups.push({ startIndex: index, messages: [message] });
+        }
+        index += 1;
+    }
+    return groups;
+}
+function toolResultGroupKey(message) {
+    if (message.state === 'failed' || message.state === 'denied') {
+        return message.state;
+    }
+    return `done:${toolResultOperation(message)}`;
+}