praxis-agent 0.2.0 → 0.3.0

package/dist/cli/tui/claude-style.js

@@ -1,6 +1,8 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
 import { Box, Text, useStdout } from 'ink';
+import { composerEditorSegments } from './composer-editor.js';
+import { visiblePatchLines } from './git-diff.js';
 const BRAND = '#D97757';
 const ACCENT = '#B8A1FF';
 const SPINNER = ['✳', '✢', '✣', '✤', '✥'];
@@ -43,9 +45,9 @@ function permissionLabel(mode) {
     }
 }
 export function WelcomePanel({ display, width, }) {
-    const panelWidth = Math.min(80, Math.max(32, width));
+    const panelWidth = Math.min(100, Math.max(32, width));
     const wide = panelWidth >= 68;
-    return (_jsxs(Box, { borderStyle: "round", borderColor: "gray", flexDirection: "column", width: panelWidth, paddingX: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: BRAND, bold: true, children: "Praxis" }), _jsxs(Text, { children: [" Code v", display.version, " "] }), _jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(1, panelWidth - 24)) })] }), _jsxs(Box, { flexDirection: wide ? 'row' : 'column', marginTop: 1, children: [_jsxs(Box, { flexDirection: "column", width: wide ? '62%' : '100%', children: [_jsx(Text, { bold: true, children: "Welcome back!" }), _jsx(Text, { color: BRAND, bold: true, children: '        ◆' }), _jsx(Text, { color: BRAND, children: '      ◆ ◆ ◆' }), _jsx(Text, { color: BRAND, children: '        ◆' }), _jsxs(Text, { children: [display.model ?? 'provider default', display.effort ? (_jsxs(Text, { dimColor: true, children: [" \u00B7 ", display.effort, " effort"] })) : null] }), _jsx(Text, { dimColor: true, children: compactPath(display.cwd) })] }), _jsxs(Box, { flexDirection: "column", width: wide ? '38%' : '100%', marginTop: wide ? 0 : 1, children: [_jsx(Text, { bold: true, children: "Tips for getting started" }), _jsx(Text, { children: "Run /help for commands" }), _jsx(Text, { dimColor: true, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" }), _jsx(Text, { bold: true, children: "Shared with Claude Code" }), _jsx(Text, { children: "Sessions, memory, skills" })] })] })] }));
+    return (_jsxs(Box, { borderStyle: "round", borderColor: "gray", flexDirection: "column", width: panelWidth, paddingX: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: BRAND, bold: true, children: "Praxis" }), _jsxs(Text, { children: [" Code v", display.version, " "] }), _jsx(Text, { dimColor: true, children: '─'.repeat(Math.max(1, panelWidth - 24)) })] }), _jsxs(Box, { flexDirection: wide ? 'row' : 'column', marginTop: 1, children: [_jsxs(Box, { alignItems: wide ? 'center' : undefined, flexDirection: "column", width: wide ? '50%' : '100%', children: [_jsx(Text, { bold: true, children: "Welcome back!" }), _jsx(Text, { color: BRAND, bold: true, children: "\u2590\u259B\u2588\u2588\u2588\u259C\u258C" }), _jsx(Text, { color: BRAND, children: "\u259D\u259C\u2588\u2588\u2588\u2588\u2588\u259B\u2598" }), _jsx(Text, { color: BRAND, children: " \u2598\u2598 \u259D\u259D" }), _jsxs(Text, { children: [display.model ?? 'provider default', display.effort ? (_jsxs(Text, { dimColor: true, children: [" \u00B7 ", display.effort, " effort"] })) : null] }), _jsx(Text, { dimColor: true, children: compactPath(display.cwd) })] }), _jsxs(Box, { flexDirection: "column", width: wide ? '50%' : '100%', marginTop: wide ? 0 : 1, children: [_jsx(Text, { bold: true, children: "Tips for getting started" }), _jsx(Text, { children: "Run /help for commands" }), _jsx(Text, { dimColor: true, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" }), _jsx(Text, { bold: true, children: "Shared with Claude Code" }), _jsx(Text, { children: "Sessions, memory, skills" })] })] })] }));
 }
 function InlineText({ text }) {
     const tokens = text.split(/(`[^`]+`|\*\*[^*]+\*\*|\[[^\]]+\]\([^)]+\))/u);
@@ -84,6 +86,62 @@ function ToolResultText({ text }) {
                         ? { color: 'cyan' }
                         : { dimColor: true }), children: line || ' ' }, index))) }));
 }
+function inputString(call, key) {
+    const value = call.input[key];
+    return typeof value === 'string' ? value : '';
+}
+function contentLines(text) {
+    const lines = text.split('\n');
+    if (lines.at(-1) === '')
+        lines.pop();
+    return lines;
+}
+function toolHeading(call) {
+    if (call.name === 'Edit')
+        return `Update(${inputString(call, 'file_path')})`;
+    if (call.name === 'Read')
+        return `Read(${inputString(call, 'file_path')})`;
+    if (call.name === 'Bash')
+        return `Bash(${inputString(call, 'command')})`;
+    return call.name;
+}
+function ToolTranscriptEntry({ call, detail, result, detailed, }) {
+    const displayResult = call.name === 'Read' &&
+        result?.text.startsWith('Wasted call — file unchanged since your last Read')
+        ? 'Unchanged since last read'
+        : (result?.text ?? '');
+    const resultLines = contentLines(displayResult);
+    if (call.name === 'Read' && result && !result.isError && !detailed) {
+        return (_jsxs(Text, { children: ['  ', "Read 1 file ", _jsx(Text, { dimColor: true, children: "(ctrl+o to expand)" })] }));
+    }
+    const visible = detailed ? resultLines : resultLines.slice(0, 3);
+    const hidden = resultLines.length - visible.length;
+    const errorText = displayResult.length > 500
+        ? `${displayResult.slice(0, 497)}...`
+        : displayResult;
+    const oldLines = contentLines(inputString(call, 'old_string'));
+    const newLines = contentLines(inputString(call, 'new_string'));
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: ACCENT, children: "\u23FA" }), " ", _jsx(Text, { bold: true, children: toolHeading(call) })] }), !['Bash', 'Read', 'Edit'].includes(call.name) && detail ? (_jsxs(Text, { dimColor: true, children: [" ", detail] })) : null, result ? (_jsx(Box, { marginLeft: 2, flexDirection: "column", children: result.isError ? (_jsxs(Text, { color: "red", children: ["\u23BF Error: ", errorText] })) : call.name === 'Edit' ? (_jsxs(_Fragment, { children: [_jsxs(Text, { dimColor: true, children: ["\u23BF Added ", newLines.length, " line", newLines.length === 1 ? '' : 's', ", removed ", oldLines.length, " line", oldLines.length === 1 ? '' : 's'] }), oldLines.map((line, index) => (_jsxs(Text, { color: "red", children: ['   ', index + 1, " -", line] }, `old-${index}`))), newLines.map((line, index) => (_jsxs(Text, { color: "green", children: ['   ', index + 1, " +", line] }, `new-${index}`)))] })) : (_jsxs(_Fragment, { children: [visible.map((line, index) => (_jsxs(Text, { dimColor: true, children: [index === 0 ? '⎿ ' : '   ', line || ' '] }, index))), hidden > 0 ? (_jsxs(Text, { dimColor: true, children: ['   ', "\u2026 +", hidden, " lines (ctrl+o to expand)"] })) : null] })) })) : null] }));
+}
+function ThinkingBlock({ text, active, expanded, screenReader, }) {
+    const summary = text.replace(/\s+/gu, ' ').trim();
+    const showFull = screenReader || active || expanded;
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { ...(!screenReader ? { color: ACCENT } : {}), dimColor: !screenReader, italic: !screenReader, children: [screenReader ? 'Thinking:' : '✻ ', active ? 'Thinking…' : 'Thought for a moment', !showFull && summary ? ` · ${summary.slice(0, 160)}` : ''] }), showFull && text ? (_jsx(Box, { marginLeft: screenReader ? 0 : 2, flexDirection: "column", children: _jsx(MarkdownText, { text: text }) })) : !screenReader && summary.length > 160 ? (_jsx(Text, { dimColor: true, children: " ctrl+o to expand thinking" })) : null] }));
+}
+function ContextUsageBlock({ usedTokens, contextWindowTokens, skills, screenReader, }) {
+    const totalTokens = Math.max(1, contextWindowTokens);
+    const compactBuffer = Math.round(totalTokens * 0.165);
+    const usable = Math.max(1, totalTokens - compactBuffer);
+    if (screenReader) {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: "Context Usage" }), _jsxs(Text, { children: [usedTokens.toLocaleString(), " of ", totalTokens.toLocaleString(), " tokens"] }), _jsxs(Text, { children: ["Autocompact buffer: ", compactBuffer.toLocaleString(), " tokens"] }), _jsxs(Text, { children: ["Skills: ", skills.map(({ name }) => name).join(', ') || 'none'] })] }));
+    }
+    const usedCells = Math.min(100, Math.ceil((usedTokens / totalTokens) * 100));
+    const bufferCells = Math.min(100 - usedCells, Math.ceil((compactBuffer / totalTokens) * 100));
+    const cells = Array.from({ length: 100 }, (_, index) => index < usedCells ? '⛁' : index >= 100 - bufferCells ? '⛝' : '⛶');
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, marginLeft: 2, children: [_jsx(Text, { bold: true, children: "Context Usage" }), _jsxs(Box, { children: [_jsx(Box, { flexDirection: "column", marginRight: 2, children: Array.from({ length: 10 }, (_, row) => (_jsx(Text, { children: cells.slice(row * 10, row * 10 + 10).join(' ') }, row))) }), _jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { bold: true, children: [usedTokens.toLocaleString(), "/", totalTokens.toLocaleString(), " tokens"] }), _jsx(Text, { children: " " }), _jsx(Text, { bold: true, children: "Estimated usage by category" }), _jsxs(Text, { children: ["\u26C1 Skills:", ' ', skills
+                                        .reduce((total, skill) => total + skill.tokens, 0)
+                                        .toLocaleString(), ' ', "tokens"] }), _jsxs(Text, { children: ["\u26F6 Free space: ", Math.max(0, usable - usedTokens).toLocaleString()] }), _jsxs(Text, { children: ["\u26DD Autocompact buffer: ", compactBuffer.toLocaleString(), " tokens"] })] })] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ["Auto-compact window: ", totalTokens.toLocaleString(), " tokens"] }), _jsx(Text, { children: " " }), _jsx(Text, { bold: true, children: "Skills \u00B7 /skills" }), skills.length === 0 ? (_jsx(Text, { dimColor: true, children: "\u2514 No skills loaded" })) : (skills.map((skill, index) => (_jsxs(Text, { dimColor: true, children: [index === skills.length - 1 ? '└' : '├', " ", skill.name, ": ~", skill.tokens, " tokens"] }, skill.name))))] }));
+}
 export function MarkdownText({ text }) {
     const lines = text.split('\n');
     let code = false;
@@ -95,39 +153,328 @@ export function MarkdownText({ text }) {
             return code ? (_jsxs(Text, { color: "cyan", children: ["\u2502 ", line] }, index)) : (_jsx(MarkdownLine, { line: line }, index));
         }) }));
 }
-export function Transcript({ items, activeText, activeThinking = '', screenReader, }) {
+export function Transcript({ items, activeText, activeThinking = '', thinkingExpanded = false, detailedTranscript = false, screenReader, }) {
+    const detailed = thinkingExpanded || detailedTranscript;
+    const results = new Map(items
+        .filter((item) => item.kind === 'tool-result')
+        .map((item) => [item.callId, item]));
+    const pairedResults = new Set(items
+        .filter((item) => item.kind === 'tool' && results.has(item.call.id))
+        .map((item) => item.call.id));
+    const shellResults = new Map(items
+        .filter((item) => item.kind === 'shell-result')
+        .map((item) => [item.callId, item]));
+    const pairedShellResults = new Set(items
+        .filter((item) => item.kind === 'shell' && shellResults.has(item.callId))
+        .map((item) => item.callId));
+    const readGroupStarts = new Map();
+    const groupedReadTools = new Set();
+    if (!detailed && !screenReader) {
+        for (let index = 0; index < items.length; index += 1) {
+            const first = items[index];
+            if (first?.kind !== 'tool' || first.call.name !== 'Read')
+                continue;
+            let cursor = index;
+            const memberIndexes = [];
+            const memberCallIds = new Set();
+            while (cursor < items.length) {
+                const candidate = items[cursor];
+                if (candidate?.kind === 'tool' && candidate.call.name === 'Read') {
+                    const result = results.get(candidate.call.id);
+                    if (!result || result.isError)
+                        break;
+                    memberIndexes.push(cursor);
+                    memberCallIds.add(candidate.call.id);
+                    cursor += 1;
+                    continue;
+                }
+                if (candidate?.kind === 'tool-result' &&
+                    memberCallIds.has(candidate.callId)) {
+                    cursor += 1;
+                    continue;
+                }
+                break;
+            }
+            if (memberIndexes.length === 0)
+                continue;
+            readGroupStarts.set(index, memberIndexes.length);
+            for (const memberIndex of memberIndexes.slice(1)) {
+                groupedReadTools.add(memberIndex);
+            }
+            index = cursor - 1;
+        }
+    }
     return (_jsxs(Box, { flexDirection: "column", children: [items.map((item, index) => {
+                const readCount = readGroupStarts.get(index);
+                if (readCount !== undefined) {
+                    return (_jsxs(Text, { children: ['  ', "Read ", readCount, " file", readCount === 1 ? '' : 's', ' ', _jsx(Text, { dimColor: true, children: "(ctrl+o to expand)" })] }, index));
+                }
+                if (groupedReadTools.has(index))
+                    return null;
                 if (item.kind === 'user') {
                     return (_jsxs(Box, { marginTop: index === 0 ? 0 : 1, children: [_jsx(Text, { color: BRAND, bold: true, children: screenReader ? 'You: ' : '❯ ' }), _jsx(Text, { bold: true, children: item.text })] }, index));
                 }
                 if (item.kind === 'assistant') {
-                    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [screenReader ? _jsx(Text, { children: "Praxis:" }) : null, _jsx(MarkdownText, { text: item.text })] }, index));
+                    return (_jsxs(Box, { marginTop: 1, children: [screenReader ? _jsx(Text, { children: "Praxis:" }) : null, !screenReader ? _jsx(Text, { color: ACCENT, children: "\u23FA " }) : null, _jsx(MarkdownText, { text: item.text })] }, index));
                 }
                 if (item.kind === 'thinking') {
-                    return (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: ACCENT, children: "\u273B " }), _jsxs(Text, { dimColor: true, italic: true, children: ["Thought for a moment", item.text ? ` · ${item.text.slice(0, 160)}` : ''] })] }, index));
+                    return (_jsx(ThinkingBlock, { text: item.text, active: false, expanded: detailed, screenReader: screenReader }, index));
+                }
+                if (item.kind === 'compact') {
+                    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: ACCENT, italic: true, children: screenReader
+                                    ? 'Conversation compacted'
+                                    : '✻ Conversation compacted (ctrl+o for history)' }), detailed ? (_jsx(Box, { marginLeft: screenReader ? 0 : 2, children: _jsx(MarkdownText, { text: item.summary }) })) : null] }, index));
+                }
+                if (item.kind === 'context') {
+                    return (_jsx(ContextUsageBlock, { ...item, screenReader: screenReader }, index));
                 }
                 if (item.kind === 'tool') {
-                    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: ACCENT, children: "\u25CF" }), " ", _jsx(Text, { bold: true, children: item.call.name })] }), _jsxs(Text, { dimColor: true, children: [" ", item.detail] })] }, index));
+                    const result = results.get(item.call.id);
+                    return (_jsx(ToolTranscriptEntry, { call: item.call, detail: item.detail, ...(result ? { result } : {}), detailed: detailed || screenReader }, index));
                 }
                 if (item.kind === 'tool-result') {
+                    if (pairedResults.has(item.callId))
+                        return null;
                     const text = item.text.length > 500 ? `${item.text.slice(0, 497)}...` : item.text;
                     return (_jsxs(Box, { marginLeft: 2, flexDirection: "column", children: [_jsx(Text, { color: item.isError ? 'red' : 'gray', children: item.isError ? '└ Error' : '└ Result' }), item.isError ? (_jsx(Text, { color: "red", children: text })) : (_jsx(ToolResultText, { text: text }))] }, index));
                 }
+                if (item.kind === 'shell') {
+                    const result = shellResults.get(item.callId);
+                    const output = result
+                        ? [result.stdout, result.stderr]
+                            .filter(Boolean)
+                            .join(result.stdout &&
+                            result.stderr &&
+                            !result.stdout.endsWith('\n')
+                            ? '\n'
+                            : '')
+                        : '';
+                    const lines = contentLines(output);
+                    const visible = detailed || screenReader ? lines : lines.slice(0, 3);
+                    const hidden = lines.length - visible.length;
+                    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { children: _jsxs(Text, { bold: true, children: [screenReader ? 'Shell command: ' : '! ', item.command] }) }), result ? (_jsxs(Box, { marginLeft: 2, flexDirection: "column", children: [lines.length === 0 ? (_jsx(Text, { dimColor: true, children: "\u23BF " })) : (visible.map((line, lineIndex) => (_jsxs(Text, { ...(result.isError ? { color: 'red' } : {}), dimColor: !result.isError, children: [lineIndex === 0 ? '⎿ ' : '   ', line || ' '] }, lineIndex)))), hidden > 0 ? (_jsxs(Text, { dimColor: true, children: ['   ', "\u2026 +", hidden, " lines (ctrl+o to expand)"] })) : null] })) : null] }, index));
+                }
+                if (item.kind === 'shell-result') {
+                    if (pairedShellResults.has(item.callId))
+                        return null;
+                    const output = [item.stdout, item.stderr].filter(Boolean).join('\n');
+                    return (_jsxs(Text, { ...(item.isError ? { color: 'red' } : {}), children: ["\u23BF ", output] }, index));
+                }
+                if (item.kind === 'local-result') {
+                    return (_jsx(Box, { marginLeft: 2, children: _jsxs(Text, { dimColor: true, children: ["\u23BF ", item.text] }) }, index));
+                }
                 return (_jsxs(Text, { ...(item.kind === 'warning' ? { color: 'red' } : {}), dimColor: item.kind === 'notice', children: [item.kind === 'warning' ? '⚠ ' : '· ', item.text] }, index));
-            }), activeThinking ? (_jsxs(Box, { marginTop: 1, children: [screenReader ? (_jsx(Text, { children: "Thinking: " })) : (_jsx(Text, { color: ACCENT, children: "\u273B " })), _jsxs(Text, { dimColor: true, italic: true, children: ["Thinking\u2026 ", activeThinking.slice(-160)] })] })) : activeText ? (_jsxs(Box, { marginTop: 1, children: [screenReader ? (_jsx(Text, { children: "Praxis: " })) : (_jsx(Text, { color: ACCENT, children: "\u2733 " })), _jsx(MarkdownText, { text: activeText })] })) : null] }));
+            }), activeThinking ? (_jsx(ThinkingBlock, { text: activeThinking, active: true, expanded: detailed, screenReader: screenReader })) : activeText ? (_jsxs(Box, { marginTop: 1, children: [screenReader ? (_jsx(Text, { children: "Praxis: " })) : (_jsx(Text, { color: ACCENT, children: "\u2733 " })), _jsx(MarkdownText, { text: activeText })] })) : null] }));
+}
+export function DiffDashboard({ snapshots, sourceIndex, selectedIndex, viewingFile, scrollOffset, width, screenReader, }) {
+    const source = snapshots[sourceIndex];
+    const snapshot = source?.snapshot ?? { files: [], additions: 0, deletions: 0 };
+    const selected = snapshot.files[selectedIndex];
+    const panelWidth = Math.max(32, Math.min(100, width));
+    const line = '─'.repeat(panelWidth);
+    if (viewingFile && selected) {
+        const lines = visiblePatchLines(selected.patch).slice(scrollOffset, scrollOffset + 18);
+        return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsx(Text, { bold: true, children: " Uncommitted changes (git diff HEAD)" }), _jsxs(Text, { children: ['  ', snapshots.map((item, index) => (_jsxs(Text, { inverse: index === sourceIndex, children: [' ', item.label, ' '] }, item.label)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { bold: true, children: [" ", selected.path] }), _jsxs(Text, { dimColor: true, children: [" ", '─'.repeat(Math.max(1, panelWidth - 4))] }), lines.map((patchLine, index) => (_jsxs(Text, { ...(patchLine.startsWith('+')
+                        ? { color: 'green' }
+                        : patchLine.startsWith('-')
+                            ? { color: 'red' }
+                            : { dimColor: true }), children: ['  ', patchLine] }, `${scrollOffset}-${index}`))), _jsx(Text, { dimColor: true, children: " \u2191/\u2193 to scroll \u00B7 Esc to back" })] }));
+    }
+    return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsx(Text, { bold: true, children: " Uncommitted changes (git diff HEAD)" }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ['  ', snapshots.map((item, index) => (_jsxs(Text, { inverse: index === sourceIndex, children: [' ', item.label, ' '] }, item.label)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: ['  ', snapshot.files.length, " file", snapshot.files.length === 1 ? '' : 's', ' ', "changed ", _jsxs(Text, { color: "green", children: ["+", snapshot.additions] }), ' ', _jsxs(Text, { color: "red", children: ["-", snapshot.deletions] })] }), _jsx(Text, { children: " " }), snapshot.files.length === 0 ? (_jsx(Text, { dimColor: true, children: " No uncommitted changes." })) : (snapshot.files.map((file, index) => (_jsxs(Text, { inverse: index === selectedIndex, children: [index === selectedIndex ? '❯ ' : '  ', file.path, " ", _jsxs(Text, { color: "green", children: ["+", file.additions] }), ' ', _jsxs(Text, { color: "red", children: ["-", file.deletions] })] }, file.path)))), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "\u2190/\u2192 to switch source \u00B7 \u2191/\u2193 to select \u00B7 Enter to view \u00B7 Esc to close" })] }));
+}
+export function PermissionDashboard({ tabIndex, selectedIndex, query, rules, recentDenied, workspaceDirectories, width, screenReader, }) {
+    const tabs = ['Recently denied', 'Allow', 'Ask', 'Deny', 'Workspace'];
+    const behavior = ['allow', 'ask', 'deny'][tabIndex - 1];
+    const normalizedQuery = query.trim().toLowerCase();
+    const matchingRules = behavior
+        ? rules.filter((rule) => rule.behavior === behavior &&
+            (!normalizedQuery ||
+                rule.rule.toLowerCase().includes(normalizedQuery) ||
+                rule.scope.includes(normalizedQuery)))
+        : [];
+    const rows = tabIndex === 0 ? recentDenied : matchingRules.map((rule) => rule.rule);
+    const originalWorkspace = workspaceDirectories.find((directory) => directory.original);
+    const additionalWorkspaces = workspaceDirectories.filter((directory) => !directory.original);
+    const description = tabIndex === 0
+        ? recentDenied.length === 0
+            ? 'No recent denials. Commands denied by the auto mode classifier will appear here.'
+            : 'Commands denied by the auto mode classifier appear here.'
+        : tabIndex === 1
+            ? "Praxis Code won't ask before using allowed tools."
+            : tabIndex === 2
+                ? 'Praxis Code will always ask for confirmation before using these tools.'
+                : tabIndex === 3
+                    ? 'Praxis Code will reject requests to use denied tools.'
+                    : 'Praxis Code can read files in the workspace, and make edits when auto-accept edits is on.';
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.min(100, width)) })) : null, _jsx(Text, { bold: true, children: " Permissions" }), _jsxs(Text, { children: ['  ', tabs.map((tab, index) => (_jsxs(Text, { inverse: index === tabIndex, children: [' ', tab, ' '] }, tab)))] }), _jsx(Text, { children: " " }), _jsxs(Text, { children: [" ", description] }), tabIndex >= 1 && tabIndex <= 3 ? (_jsx(Box, { borderStyle: screenReader ? undefined : 'round', paddingX: 1, marginY: 1, children: _jsxs(Text, { ...(query ? {} : { dimColor: true }), children: ["\u2315 ", query || 'Search…'] }) })) : (_jsx(Text, { children: " " })), tabIndex >= 1 && tabIndex <= 3 ? (['Add a new rule…', ...rows].map((row, index) => (_jsxs(Text, { inverse: index === selectedIndex, children: [index === selectedIndex ? '❯ ' : '  ', index + 1, ". ", row] }, `${index}-${row}`)))) : tabIndex === 4 ? (_jsxs(_Fragment, { children: [originalWorkspace ? (_jsxs(Text, { children: ['    -  ', originalWorkspace.path, " (Original working directory)"] })) : null, additionalWorkspaces.map((directory, index) => (_jsxs(Text, { inverse: selectedIndex === index, children: [selectedIndex === index ? '❯ ' : '  ', index + 1, ". ", directory.path] }, directory.path))), _jsxs(Text, { inverse: selectedIndex === additionalWorkspaces.length, children: [selectedIndex === additionalWorkspaces.length ? '❯ ' : '  ', additionalWorkspaces.length + 1, ". Add directory\u2026"] })] })) : rows.length > 0 ? (rows.map((row, index) => (_jsxs(Text, { inverse: index === selectedIndex, children: [index === selectedIndex ? '❯ ' : '  ', index + 1, ". ", row] }, `${index}-${row}`)))) : null, _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: selectedIndex >= 0
+                    ? '↑/↓ navigate · Enter to select · ←/→ to switch · Esc to cancel'
+                    : '←/→ to switch · ↓ to select · Esc to cancel' })] }));
 }
-export function SessionPicker({ sessions, selectedIndex, screenReader, }) {
+export function StatusDashboard({ tabIndex, version, sessionId, display, usage, costUsd, turnCount, toolCount, commandCount, detailedTranscript, width, screenReader, }) {
+    const tabs = ['Settings', 'Status', 'Config', 'Usage', 'Stats'];
+    const rows = tabIndex === 0
+        ? [
+            ['Thinking mode', 'provider controlled'],
+            ['Verbose output', detailedTranscript ? 'true' : 'false'],
+            ['Default permission mode', permissionLabel(display.permissionMode)],
+            ['Context compaction', 'automatic'],
+            ['Shared Claude data', 'enabled'],
+        ]
+        : tabIndex === 1
+            ? [
+                ['Version', version],
+                ['Session ID', sessionId ?? 'new session'],
+                ['cwd', display.cwd],
+                ['Model', display.model ?? 'provider default'],
+                ['Permission mode', permissionLabel(display.permissionMode)],
+            ]
+            : tabIndex === 2
+                ? [
+                    ['Model', display.model ?? 'provider default'],
+                    ['Effort', display.effort ?? 'high'],
+                    [
+                        'Context window',
+                        String(display.contextWindowTokens ?? 'provider default'),
+                    ],
+                    ['Available commands', String(commandCount)],
+                ]
+                : tabIndex === 3
+                    ? [
+                        ['Input tokens', String(usage?.inputTokens ?? 0)],
+                        ['Output tokens', String(usage?.outputTokens ?? 0)],
+                        [
+                            'Session cost',
+                            costUsd === undefined
+                                ? 'unavailable'
+                                : `$${costUsd.toFixed(4)}`,
+                        ],
+                    ]
+                    : [
+                        ['Turns', String(turnCount)],
+                        ['Tool calls', String(toolCount)],
+                        [
+                            'Context used',
+                            String((usage?.inputTokens ?? 0) + (usage?.outputTokens ?? 0)),
+                        ],
+                    ];
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.min(100, width)) })) : null, _jsxs(Text, { children: ['  ', tabs.map((tab, index) => (_jsxs(Text, { inverse: index === tabIndex, children: [' ', tab, ' '] }, tab)))] }), _jsx(Text, { children: " " }), rows.map(([label, value]) => (_jsxs(Box, { children: [_jsx(Box, { width: 28, children: _jsxs(Text, { children: [label, ":"] }) }), _jsx(Text, { children: value })] }, label))), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "\u2190/\u2192/tab to switch \u00B7 Esc to close" })] }));
+}
+export function ListDashboard({ title, rows, emptyText, selectedIndex, width, screenReader, }) {
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? (_jsx(Text, { dimColor: true, children: '─'.repeat(Math.min(100, width)) })) : null, _jsxs(Text, { bold: true, children: [" ", title] }), _jsx(Text, { children: " " }), rows.length === 0 ? (_jsxs(Text, { dimColor: true, children: [" ", emptyText] })) : (rows.map((row, index) => (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { inverse: index === selectedIndex, children: [index === selectedIndex ? '❯ ' : '  ', row.label] }), row.description ? _jsxs(Text, { dimColor: true, children: [" ", row.description] }) : null] }, `${index}-${row.label}`)))), _jsx(Text, { children: " " }), _jsx(Text, { dimColor: true, children: "\u2191/\u2193 to select \u00B7 Esc to close" })] }));
+}
+export function SessionPicker({ sessions, selectedIndex, screenReader, query = '', }) {
     const maxVisible = 8;
     const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), sessions.length - maxVisible));
     const visible = sessions.slice(start, start + maxVisible);
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: screenReader ? undefined : 'round', borderColor: "gray", paddingX: screenReader ? 0 : 1, children: [_jsx(Text, { bold: true, children: "Resume a session" }), !screenReader ? (_jsx(Text, { dimColor: true, children: "\u2191/\u2193 to move \u00B7 Enter to select \u00B7 Esc to cancel" })) : null, start > 0 ? _jsxs(Text, { dimColor: true, children: [" \u2191 ", start, " earlier"] }) : null, visible.map((session, visibleIndex) => {
+    return (_jsxs(Box, { flexDirection: "column", children: [!screenReader ? _jsx(Text, { dimColor: true, children: '─'.repeat(80) }) : null, _jsx(Text, { bold: true, children: " Resume session" }), _jsx(Box, { borderStyle: screenReader ? undefined : 'round', borderColor: "gray", paddingX: screenReader ? 0 : 1, marginY: 1, children: _jsxs(Text, { ...(query ? {} : { dimColor: true }), children: ["\u2315 ", query || 'Search…'] }) }), start > 0 ? _jsxs(Text, { dimColor: true, children: [" \u2191 ", start, " earlier"] }) : null, visible.length === 0 ? _jsx(Text, { dimColor: true, children: "No sessions found." }) : null, visible.map((session, visibleIndex) => {
                 const index = start + visibleIndex;
                 return (_jsxs(Box, { children: [_jsxs(Text, { ...(index === selectedIndex ? { color: BRAND } : {}), bold: index === selectedIndex, children: [index === selectedIndex ? '❯ ' : '  ', session
                                     ? (session.name ?? session.lastPrompt ?? 'Untitled')
                                     : 'Start a new session'] }), session ? (_jsxs(Text, { dimColor: true, children: [' ', "\u00B7 ", session.sessionId, " \u00B7 ", session.status] })) : null] }, session?.sessionId ?? 'new'));
-            }), start + visible.length < sessions.length ? (_jsxs(Text, { dimColor: true, children: [" \u2193 ", sessions.length - start - visible.length, " more"] })) : null] }));
+            }), start + visible.length < sessions.length ? (_jsxs(Text, { dimColor: true, children: [" \u2193 ", sessions.length - start - visible.length, " more"] })) : null, !screenReader ? (_jsx(Text, { dimColor: true, children: "\u2191/\u2193 to navigate \u00B7 Enter to select \u00B7 Type to search \u00B7 Esc to cancel" })) : null] }));
+}
+export function CommandPalette({ commands, selectedIndex, width, screenReader, }) {
+    const maxVisible = 12;
+    const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, commands.length - maxVisible)));
+    const visible = commands.slice(start, start + maxVisible);
+    if (screenReader) {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { children: "Commands" }), visible.length === 0 ? (_jsx(Text, { children: "No matching commands." })) : (visible.map((command) => (_jsxs(Text, { children: ["/", command.name, ": ", command.description] }, command.name))))] }));
+    }
+    return (_jsx(Box, { flexDirection: "column", width: Math.min(100, width), children: visible.length === 0 ? (_jsx(Text, { dimColor: true, children: "No matching commands." })) : (visible.map((command, visibleIndex) => {
+            const index = start + visibleIndex;
+            const selected = index === selectedIndex;
+            return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 30, children: _jsxs(Text, { ...(selected ? { color: BRAND, bold: true } : {}), children: ["/", command.name] }) }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { dimColor: true, children: command.description }) })] }, command.name));
+        })) }));
+}
+export function FilePicker({ entries, selectedIndex, width, screenReader, }) {
+    const maxVisible = 12;
+    const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, entries.length - maxVisible)));
+    const visible = entries.slice(start, start + maxVisible);
+    return (_jsx(Box, { flexDirection: "column", width: Math.min(100, width), children: visible.length === 0 ? (_jsx(Text, { dimColor: true, children: "No matching files." })) : (visible.map((entry, visibleIndex) => {
+            const index = start + visibleIndex;
+            return (_jsxs(Text, { inverse: !screenReader && index === selectedIndex, children: [screenReader && index === selectedIndex ? 'Selected: ' : '+ ', entry.path] }, entry.path));
+        })) }));
+}
+export function MentionPicker({ entries, selectedIndex, width, screenReader, }) {
+    const maxVisible = 12;
+    const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, entries.length - maxVisible)));
+    const visible = entries.slice(start, start + maxVisible);
+    return (_jsx(Box, { flexDirection: "column", width: Math.min(100, width), children: visible.length === 0 ? (_jsx(Text, { dimColor: true, children: "No matching files or agents." })) : (visible.map((entry, visibleIndex) => {
+            const index = start + visibleIndex;
+            const selected = index === selectedIndex;
+            if (entry.kind === 'agent') {
+                return (_jsxs(Text, { inverse: !screenReader && selected, ...(screenReader ? {} : { wrap: 'truncate-end' }), children: [screenReader && selected ? 'Selected agent: ' : '* ', entry.name, screenReader ? '' : ' (agent)', entry.description ? ` – ${entry.description}` : ''] }, `agent:${entry.name}`));
+            }
+            return (_jsxs(Text, { inverse: !screenReader && selected, ...(screenReader ? {} : { wrap: 'truncate-end' }), children: [screenReader && selected ? 'Selected: ' : '+ ', entry.path] }, `file:${entry.path}`));
+        })) }));
+}
+const SHORTCUT_ROWS = [
+    [
+        '! for shell mode',
+        'double tap esc to clear input',
+        'ctrl + shift + _ to undo',
+    ],
+    ['/ for commands', 'shift + tab to cycle permissions', 'ctrl + z to suspend'],
+    [
+        '@ for file paths',
+        'ctrl + o for verbose output',
+        'ctrl + v to paste images',
+    ],
+    [
+        '/btw for side question',
+        'ctrl + t to toggle tasks',
+        'opt + p to switch model',
+    ],
+    ['', 'backslash (\\) + return (⏎) for newline', 'ctrl + s to stash prompt'],
+    ['', '', 'ctrl + g to edit in $EDITOR'],
+    ['', '', '/keybindings to customize'],
+];
+export function ShortcutHelp({ width }) {
+    const wide = width >= 78;
+    return (_jsx(Box, { flexDirection: "column", width: Math.min(100, width), children: SHORTCUT_ROWS.map((row, rowIndex) => wide ? (_jsx(Box, { flexDirection: "row", children: row.map((cell, cellIndex) => (_jsx(Box, { width: cellIndex === 2 ? undefined : '33%', children: _jsx(Text, { dimColor: true, children: cell }) }, cellIndex))) }, rowIndex)) : (row.filter(Boolean).map((cell, cellIndex) => (_jsx(Text, { dimColor: true, children: cell }, `${rowIndex}-${cellIndex}`))))) }));
+}
+export function HelpMenu({ tabIndex, selectedIndex, builtinCommands, customCommands, width, screenReader, }) {
+    const tabs = ['General', 'Commands', 'Custom commands'];
+    const commands = tabIndex === 1 ? builtinCommands : customCommands;
+    const maxVisible = 10;
+    const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, commands.length - maxVisible)));
+    const visible = commands.slice(start, start + maxVisible);
+    const line = '─'.repeat(Math.max(12, Math.min(100, width)));
+    return (_jsxs(Box, { flexDirection: "column", width: Math.min(100, width), children: [!screenReader ? _jsx(Text, { dimColor: true, children: line }) : null, _jsxs(Box, { children: [_jsx(Text, { bold: true, children: " Help " }), tabs.map((tab, index) => (_jsxs(Text, { ...(index === tabIndex ? { color: BRAND, bold: true } : {}), children: [' ', tab, ' '] }, tab)))] }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: tabIndex === 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { children: "Praxis understands your codebase, makes edits with your permission, and executes commands from your terminal." }), _jsx(Text, { bold: true, children: "Shortcuts" }), _jsx(ShortcutHelp, { width: width })] })) : (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, children: tabIndex === 1
+                                ? 'Browse default commands'
+                                : 'Browse shared commands and skills' }), visible.length === 0 ? (_jsx(Text, { dimColor: true, children: "No commands found." })) : (visible.map((command, visibleIndex) => {
+                            const index = start + visibleIndex;
+                            return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { ...(index === selectedIndex
+                                            ? { color: BRAND, bold: true }
+                                            : {}), children: [index === selectedIndex ? '↓ ' : '  ', "/", command.name] }), _jsxs(Text, { dimColor: true, children: [" ", command.description] })] }, command.name));
+                        }))] })) }), _jsx(Text, { dimColor: true, children: "\u2190/\u2192 to switch \u00B7 \u2191/\u2193 to navigate \u00B7 Esc to cancel" })] }));
+}
+export function SelectionMenu({ title, description, options, selectedIndex, footer, width, screenReader, }) {
+    const maxVisible = 7;
+    const start = Math.max(0, Math.min(selectedIndex - Math.floor(maxVisible / 2), Math.max(0, options.length - maxVisible)));
+    const visible = options.slice(start, start + maxVisible);
+    return (_jsxs(Box, { borderStyle: screenReader ? undefined : 'round', borderColor: "gray", flexDirection: "column", marginTop: 1, paddingX: screenReader ? 0 : 1, width: screenReader ? undefined : Math.min(80, width), children: [_jsx(Text, { bold: true, children: title }), description ? _jsx(Text, { dimColor: true, children: description }) : null, visible.map((option, visibleIndex) => {
+                const index = start + visibleIndex;
+                const selected = index === selectedIndex;
+                return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { ...(selected ? { color: BRAND, bold: true } : {}), children: [selected ? '❯ ' : '  ', index + 1, ". ", option.label, option.selected ? ' ✔' : ''] }), option.description ? (_jsxs(Text, { dimColor: true, children: [" ", option.description] })) : null] }, `${index}-${option.label}`));
+            }), start > 0 || start + visible.length < options.length ? (_jsxs(Text, { dimColor: true, children: [start > 0 ? `↑ ${start} earlier` : '', start > 0 && start + visible.length < options.length ? ' · ' : '', start + visible.length < options.length
+                        ? `↓ ${options.length - start - visible.length} more`
+                        : ''] })) : null, _jsx(Text, { dimColor: true, children: footer })] }));
+}
+function ComposerInput({ input, cursor }) {
+    const { before, current, after } = composerEditorSegments({
+        text: input,
+        cursor,
+    });
+    const cursorText = current === '\n' ? '↵' : (current ?? ' ');
+    return (_jsxs(Text, { children: [before, _jsx(Text, { color: "black", backgroundColor: ACCENT, children: cursorText }), after] }));
+}
+export function ExternalEditorWait({ screenReader, }) {
+    if (screenReader)
+        return _jsx(Text, { children: "External editor open. Save and close it to continue." });
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { dimColor: true, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" }), _jsx(Text, { children: "Save and close editor to continue..." }), _jsx(Text, { dimColor: true, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" })] }));
 }
-export function Composer({ input, busy, status, display, usage, width, screenReader, }) {
+export function Composer({ input, cursor, busy, clipboardBusy = false, status, display, usage, costUsd, width, screenReader, hasThinking = false, thinkingExpanded = false, shortcutsVisible = false, shellMode = false, footerMessage, }) {
     const [spinnerIndex, setSpinnerIndex] = useState(0);
     useEffect(() => {
         if (!busy || screenReader)
@@ -136,11 +483,25 @@ export function Composer({ input, busy, status, display, usage, width, screenRea
         return () => clearInterval(timer);
     }, [busy, screenReader]);
     if (screenReader)
-        return _jsx(Text, { children: busy ? `Status: ${status}` : `Prompt: ${input}` });
-    const line = '─'.repeat(Math.max(12, Math.min(80, width)));
-    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [display.effort ? (_jsxs(Box, { justifyContent: "flex-end", width: Math.min(80, width), children: [_jsxs(Text, { color: ACCENT, children: ["\u25C9 ", display.effort] }), _jsx(Text, { dimColor: true, children: " \u00B7 /effort" })] })) : null, usage ? (_jsxs(Text, { dimColor: true, children: ["Context \u00B7 ", usage.inputTokens + usage.outputTokens, " tokens", usage.cacheReadInputTokens
+        return (_jsx(Text, { children: clipboardBusy
+                ? 'Pasting…'
+                : busy
+                    ? `Status: ${status}`
+                    : shellMode
+                        ? `Shell command: ${input}`
+                        : `Prompt: ${input}` }));
+    const line = '─'.repeat(Math.max(12, Math.min(100, width)));
+    return (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [usage ? (_jsxs(Text, { dimColor: true, children: ["Context \u00B7 ", usage.inputTokens + usage.outputTokens, " tokens", display.contextWindowTokens
+                        ? ` / ${display.contextWindowTokens} (${Math.min(100, Math.round(((usage.inputTokens + usage.outputTokens) /
+                            display.contextWindowTokens) *
+                            100))}%)`
+                        : '', usage.cacheReadInputTokens
                         ? ` · ${usage.cacheReadInputTokens} cached`
-                        : ''] })) : null, _jsx(Text, { dimColor: true, children: line }), busy ? (_jsxs(Text, { children: [_jsx(Text, { color: ACCENT, children: SPINNER[spinnerIndex] }), " ", status, "\u2026", ' ', _jsx(Text, { dimColor: true, children: "\u00B7 esc to interrupt" })] })) : (_jsxs(Text, { children: [_jsxs(Text, { color: BRAND, bold: true, children: ["\u276F", ' '] }), input || _jsx(Text, { dimColor: true, children: "Try \"review this project\"" })] })), _jsx(Text, { dimColor: true, children: line }), _jsxs(Text, { dimColor: true, children: ["\u23F5\u23F5 ", permissionLabel(display.permissionMode), " \u00B7 /help for shortcuts"] }), _jsx(Text, { dimColor: true, children: "/new \u00B7 /sessions \u00B7 /workflows \u00B7 /exit" })] }));
+                        : '', costUsd === undefined ? '' : ` · $${costUsd.toFixed(6)}`] })) : null, _jsx(Text, { dimColor: true, children: line }), clipboardBusy ? (_jsx(Text, { children: "Pasting\u2026" })) : busy ? (_jsxs(Text, { children: [_jsx(Text, { color: ACCENT, children: SPINNER[spinnerIndex] }), " ", status, "\u2026", ' ', _jsx(Text, { dimColor: true, children: "\u00B7 esc to interrupt" })] })) : (_jsxs(Text, { children: [_jsx(Text, { ...(shellMode ? {} : { color: BRAND }), bold: true, children: shellMode ? '! ' : '❯ ' }), input ? (_jsx(ComposerInput, { cursor: cursor ?? Array.from(input).length, input: input })) : (_jsx(Text, { dimColor: true, children: shellMode
+                            ? 'Enter a shell command'
+                            : 'Try "review this project"' }))] })), _jsx(Text, { dimColor: true, children: line }), shortcutsVisible ? (_jsx(ShortcutHelp, { width: width })) : (_jsxs(Box, { width: Math.min(100, width), children: [_jsx(Text, { dimColor: true, children: shellMode ? ('! for shell mode') : (_jsxs(_Fragment, { children: ["\u23F5\u23F5 ", permissionLabel(display.permissionMode), " \u00B7", ' ', busy ? 'esc to interrupt' : '? for shortcuts', " \u00B7 \u2190 for agents", hasThinking
+                                    ? ` · ctrl+o ${thinkingExpanded ? 'collapse' : 'expand'}`
+                                    : ''] })) }), _jsx(Box, { flexGrow: 1 }), footerMessage ? (footerMessage.isError ? (_jsx(Text, { color: "red", children: footerMessage.text })) : (_jsx(Text, { dimColor: true, children: footerMessage.text }))) : display.effort ? (_jsxs(Text, { children: [_jsxs(Text, { color: ACCENT, children: ["\u25CF ", display.effort] }), _jsx(Text, { dimColor: true, children: " \u00B7 /effort" })] })) : null] }))] }));
 }
 export function DialogFrame({ title, children, screenReader, }) {
     return (_jsxs(Box, { flexDirection: "column", borderStyle: screenReader ? undefined : 'round', borderColor: "yellow", paddingX: screenReader ? 0 : 1, marginTop: 1, children: [_jsx(Text, { color: "yellow", bold: true, children: title }), children] }));