attocode 0.1.2 → 0.1.4

package/dist/src/tui/app.js

@@ -13,6 +13,10 @@ import { Box, Text, useApp, useInput, Static } from 'ink';
 import { getTheme, getThemeNames } from './theme/index.js';
 import { ControlledCommandPalette } from './input/CommandPalette.js';
 import { ApprovalDialog } from './components/ApprovalDialog.js';
+import { TransparencyAggregator } from './transparency-aggregator.js';
+import { handleSkillsCommand } from '../commands/skills-commands.js';
+import { handleAgentsCommand } from '../commands/agents-commands.js';
+import { handleInitCommand } from '../commands/init-commands.js';
 // =============================================================================
 // PATTERN GENERATION FOR ALWAYS-ALLOW
 // =============================================================================
@@ -114,13 +118,13 @@ const ToolCallItem = memo(function ToolCallItem({ tc, expanded, colors }) {
     }
     return (_jsxs(Box, { marginLeft: 2, gap: 1, children: [_jsx(Text, { color: statusColor, children: icon }), _jsx(Text, { color: "#DDA0DD", bold: true, children: tc.name }), argsStr ? _jsx(Text, { color: colors.textMuted, dimColor: true, children: argsStr }) : null, tc.duration ? _jsxs(Text, { color: colors.textMuted, dimColor: true, children: ["(", tc.duration, "ms)"] }) : null] }));
 });
-const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled, borderColor, textColor, cursorColor, onCtrlC, onCtrlL, onCtrlP, onEscape, onToggleToolExpand, onToggleThinking, onPageUp, onPageDown, onHome, onEnd, commandPaletteOpen, onCommandPaletteInput, approvalDialogOpen, approvalDenyReasonMode, onApprovalApprove, onApprovalAlwaysAllow, onApprovalDeny, onApprovalDenyWithReason, onApprovalCancelDenyReason, onApprovalDenyReasonInput, }) {
+const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled, borderColor, textColor, cursorColor, onCtrlC, onCtrlL, onCtrlP, onEscape, onToggleToolExpand, onToggleThinking, onToggleTransparency, onPageUp, onPageDown, onHome, onEnd, commandPaletteOpen, onCommandPaletteInput, approvalDialogOpen, approvalDenyReasonMode, onApprovalApprove, onApprovalAlwaysAllow, onApprovalDeny, onApprovalDenyWithReason, onApprovalCancelDenyReason, onApprovalDenyReasonInput, }) {
     const [value, setValue] = useState('');
     const [cursorPos, setCursorPos] = useState(0);
     // Store callbacks in refs so useInput doesn't re-subscribe on prop changes
     const callbacksRef = useRef({
         onSubmit, onCtrlC, onCtrlL, onCtrlP, onEscape,
-        onToggleToolExpand, onToggleThinking,
+        onToggleToolExpand, onToggleThinking, onToggleTransparency,
         onPageUp, onPageDown, onHome, onEnd,
         commandPaletteOpen, onCommandPaletteInput,
         approvalDialogOpen, approvalDenyReasonMode,
@@ -129,7 +133,7 @@ const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled,
     });
     callbacksRef.current = {
         onSubmit, onCtrlC, onCtrlL, onCtrlP, onEscape,
-        onToggleToolExpand, onToggleThinking,
+        onToggleToolExpand, onToggleThinking, onToggleTransparency,
         onPageUp, onPageDown, onHome, onEnd,
         commandPaletteOpen, onCommandPaletteInput,
         approvalDialogOpen, approvalDenyReasonMode,
@@ -167,6 +171,11 @@ const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled,
             cb.onToggleThinking?.();
             return;
         }
+        // Alt+I / Option+I - Toggle transparency panel
+        if (input === '\u00ee' || input === '\u0131' || (key.meta && input === 'i')) {
+            cb.onToggleTransparency?.();
+            return;
+        }
         // Command palette keyboard handling (when open)
         if (cb.commandPaletteOpen && cb.onCommandPaletteInput) {
             cb.onCommandPaletteInput(input, key);
@@ -298,6 +307,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
     // Display toggles
     const [toolCallsExpanded, setToolCallsExpanded] = useState(false);
     const [showThinking, setShowThinking] = useState(true);
+    const [transparencyExpanded, setTransparencyExpanded] = useState(false);
     // Command palette state
     const [commandPaletteOpen, setCommandPaletteOpen] = useState(false);
     const [commandPaletteQuery, setCommandPaletteQuery] = useState('');
@@ -308,6 +318,9 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
     const [denyReason, setDenyReason] = useState('');
     // Session-scoped always-allowed patterns (e.g., "bash:npm test", "write_file:/path")
     const [alwaysAllowed, setAlwaysAllowed] = useState(new Set());
+    // Transparency state
+    const [transparencyState, setTransparencyState] = useState(null);
+    const transparencyAggregatorRef = useRef(null);
     // Refs for stable callbacks
     const isProcessingRef = useRef(isProcessing);
     const messagesLengthRef = useRef(messages.length);
@@ -387,6 +400,23 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             });
         }
     }, [approvalBridge, handleApprovalRequest]);
+    // Set up transparency aggregator and subscribe to agent events
+    useEffect(() => {
+        const aggregator = new TransparencyAggregator();
+        transparencyAggregatorRef.current = aggregator;
+        // Subscribe to state changes
+        const unsubscribeAggregator = aggregator.subscribe((state) => {
+            setTransparencyState(state);
+        });
+        // Subscribe to agent events
+        const unsubscribeAgent = agent.subscribe((event) => {
+            aggregator.processEvent(event);
+        });
+        return () => {
+            unsubscribeAggregator();
+            unsubscribeAgent();
+        };
+    }, [agent]);
     // =========================================================================
     // COMMAND HANDLER
     // =========================================================================
@@ -455,10 +485,18 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                     '  /mcp tools        List MCP tools',
                     '  /mcp search <q>   Search & load tools',
                     '',
-                    '> SUBAGENTS',
-                    '  /agents           List available agents',
+                    '> SKILLS & AGENTS',
+                    '  /skills           List all skills',
+                    '  /skills new <n>   Create new skill',
+                    '  /skills info <n>  Show skill details',
+                    '  /agents           List all agents',
+                    '  /agents new <n>   Create new agent',
+                    '  /agents info <n>  Show agent details',
                     '  /spawn <a> <task> Run agent with task',
                     '',
+                    '> INITIALIZATION',
+                    '  /init             Setup .attocode/ directory',
+                    '',
                     '> PLAN MODE',
                     '  /mode             Show current mode',
                     '  /plan             Toggle plan mode',
@@ -466,12 +504,19 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                     '  /approve [n]      Approve plan',
                     '  /reject           Reject plan',
                     '',
+                    '> TRACE ANALYSIS',
+                    '  /trace            Show trace summary',
+                    '  /trace --analyze  Run efficiency analysis',
+                    '  /trace issues     List detected issues',
+                    '  /trace fixes      List pending improvements',
+                    '',
                     '===== SHORTCUTS =====',
                     '  Ctrl+C      Exit',
                     '  Ctrl+L      Clear screen',
                     '  Ctrl+P      Help',
                     '  Alt+T       Toggle tool details',
                     '  Alt+O       Toggle thinking',
+                    '  Alt+I       Toggle transparency panel',
                     '========================',
                 ].join('\n'));
                 return;
@@ -524,7 +569,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                     .filter((m) => m.role !== 'system')
                     .reduce((sum, m) => sum + estimateTokens(typeof m.content === 'string' ? m.content : JSON.stringify(m.content)), 0);
                 const totalTokens = systemTokens + mcpTokens + agentToolTokens + convTokens;
-                const contextLimit = 80000;
+                const contextLimit = agent.getMaxContextTokens();
                 const percent = Math.round((totalTokens / contextLimit) * 100);
                 const bar = '='.repeat(Math.min(20, Math.round(percent / 5))) + '-'.repeat(Math.max(0, 20 - Math.round(percent / 5)));
                 addMessage('system', [
@@ -819,16 +864,81 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             case 'model':
                 addMessage('system', `Model: ${model || 'auto'}\nRestart to change.`);
                 return;
+            // Skills commands
+            case 'skills': {
+                const skillManager = agent.getSkillManager();
+                if (skillManager) {
+                    // Create output adapter for TUI
+                    const tuiOutput = {
+                        log: (msg) => addMessage('system', msg),
+                        error: (msg) => addMessage('error', msg),
+                        clear: () => setMessages([]),
+                    };
+                    const ctx = {
+                        agent,
+                        sessionId: currentSessionId,
+                        output: tuiOutput,
+                        integrations: {
+                            sessionStore,
+                            mcpClient,
+                            compactor,
+                            skillManager,
+                        },
+                    };
+                    await handleSkillsCommand(args, ctx, skillManager);
+                }
+                else {
+                    addMessage('system', 'Skills not enabled');
+                }
+                return;
+            }
+            // Init command
+            case 'init': {
+                const tuiOutput = {
+                    log: (msg) => addMessage('system', msg),
+                    error: (msg) => addMessage('error', msg),
+                    clear: () => setMessages([]),
+                };
+                const ctx = {
+                    agent,
+                    sessionId: currentSessionId,
+                    output: tuiOutput,
+                    integrations: {
+                        sessionStore,
+                        mcpClient,
+                        compactor,
+                    },
+                };
+                await handleInitCommand(args, ctx);
+                return;
+            }
             // Subagent commands
-            case 'agents':
-                try {
-                    const agentList = agent.formatAgentList();
-                    addMessage('system', `Available Agents:\n${agentList}`);
+            case 'agents': {
+                const agentRegistry = agent.getAgentRegistry();
+                if (agentRegistry) {
+                    const tuiOutput = {
+                        log: (msg) => addMessage('system', msg),
+                        error: (msg) => addMessage('error', msg),
+                        clear: () => setMessages([]),
+                    };
+                    const ctx = {
+                        agent,
+                        sessionId: currentSessionId,
+                        output: tuiOutput,
+                        integrations: {
+                            sessionStore,
+                            mcpClient,
+                            compactor,
+                            agentRegistry,
+                        },
+                    };
+                    await handleAgentsCommand(args, ctx, agentRegistry);
                 }
-                catch (e) {
-                    addMessage('error', e.message);
+                else {
+                    addMessage('system', 'Agents not enabled');
                 }
                 return;
+            }
             case 'spawn':
                 if (args.length < 2) {
                     addMessage('system', 'Usage: /spawn <agent-name> <task>');
@@ -848,6 +958,156 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                 setIsProcessing(false);
                 setStatus(s => ({ ...s, mode: 'ready' }));
                 return;
+            // Trace analysis commands
+            case 'trace': {
+                const traceCollector = agent.getTraceCollector();
+                if (args.length === 0) {
+                    // Show current session trace summary
+                    if (!traceCollector) {
+                        addMessage('system', 'Tracing is not enabled. Start agent with --trace to enable.');
+                        return;
+                    }
+                    const data = traceCollector.getSessionTrace();
+                    if (!data || !data.iterations || data.iterations.length === 0) {
+                        addMessage('system', 'No trace data collected yet.');
+                        return;
+                    }
+                    addMessage('system', [
+                        'Trace Summary:',
+                        `  Session ID:    ${data.sessionId}`,
+                        `  Status:        ${data.status}`,
+                        `  Iterations:    ${data.iterations.length}`,
+                        `  Duration:      ${data.durationMs ? `${Math.round(data.durationMs / 1000)}s` : 'ongoing'}`,
+                        '',
+                        'Metrics:',
+                        `  Input tokens:  ${data.metrics.inputTokens.toLocaleString()}`,
+                        `  Output tokens: ${data.metrics.outputTokens.toLocaleString()}`,
+                        `  Cache hit:     ${Math.round(data.metrics.avgCacheHitRate * 100)}%`,
+                        `  Tool calls:    ${data.metrics.toolCalls}`,
+                        `  Errors:        ${data.metrics.errors}`,
+                        `  Est. Cost:     $${data.metrics.estimatedCost.toFixed(4)}`,
+                        '',
+                        'Use: /trace --analyze for efficiency analysis',
+                        '     /trace issues to see detected inefficiencies',
+                    ].join('\n'));
+                }
+                else if (args[0] === '--analyze' || args[0] === 'analyze') {
+                    if (!traceCollector) {
+                        addMessage('system', 'Tracing is not enabled.');
+                        return;
+                    }
+                    const data = traceCollector.getSessionTrace();
+                    if (!data || !data.iterations || data.iterations.length === 0) {
+                        addMessage('system', 'No trace data to analyze.');
+                        return;
+                    }
+                    addMessage('system', 'Analyzing trace...');
+                    try {
+                        const { createTraceSummaryGenerator } = await import('../analysis/trace-summary.js');
+                        const generator = createTraceSummaryGenerator(data);
+                        const summary = generator.generate();
+                        const lines = ['Efficiency Analysis:', '', `Anomalies Detected: ${summary.anomalies.length}`];
+                        if (summary.anomalies.length === 0) {
+                            lines.push('  No significant issues detected.');
+                        }
+                        else {
+                            for (const anomaly of summary.anomalies) {
+                                lines.push(`  [${anomaly.severity.toUpperCase()}] ${anomaly.type}`);
+                                lines.push(`       ${anomaly.description}`);
+                            }
+                        }
+                        lines.push('', 'Tool Patterns:');
+                        lines.push(`  Unique tools used: ${Object.keys(summary.toolPatterns.frequency).length}`);
+                        lines.push(`  Redundant calls:   ${summary.toolPatterns.redundantCalls.length}`);
+                        lines.push(`  Slow tools:        ${summary.toolPatterns.slowTools.length}`);
+                        if (summary.codeLocations.length > 0) {
+                            lines.push('', 'Related Code Locations:');
+                            for (const loc of summary.codeLocations) {
+                                lines.push(`  [${loc.relevance.toUpperCase()}] ${loc.file} - ${loc.component}`);
+                            }
+                        }
+                        addMessage('system', lines.join('\n'));
+                    }
+                    catch (e) {
+                        addMessage('error', `Analysis failed: ${e.message}`);
+                    }
+                }
+                else if (args[0] === 'issues') {
+                    if (!traceCollector) {
+                        addMessage('system', 'Tracing is not enabled.');
+                        return;
+                    }
+                    const data = traceCollector.getSessionTrace();
+                    if (!data || !data.iterations || data.iterations.length === 0) {
+                        addMessage('system', 'No trace data to analyze.');
+                        return;
+                    }
+                    try {
+                        const { createTraceSummaryGenerator } = await import('../analysis/trace-summary.js');
+                        const generator = createTraceSummaryGenerator(data);
+                        const summary = generator.generate();
+                        if (summary.anomalies.length === 0) {
+                            addMessage('system', 'No issues detected in current session.');
+                        }
+                        else {
+                            const lines = ['Detected Issues:'];
+                            summary.anomalies.forEach((anomaly, i) => {
+                                const icon = anomaly.severity === 'high' ? '!' : anomaly.severity === 'medium' ? '*' : '-';
+                                lines.push(`  ${icon} ${i + 1}. ${anomaly.type} (${anomaly.severity})`);
+                                lines.push(`       ${anomaly.description}`);
+                            });
+                            addMessage('system', lines.join('\n'));
+                        }
+                    }
+                    catch (e) {
+                        addMessage('error', `Analysis failed: ${e.message}`);
+                    }
+                }
+                else if (args[0] === 'fixes') {
+                    try {
+                        const { createFeedbackLoopManager } = await import('../analysis/feedback-loop.js');
+                        const feedbackManager = createFeedbackLoopManager();
+                        const pendingFixes = feedbackManager.getPendingFixes();
+                        const stats = feedbackManager.getSummaryStats();
+                        const lines = [
+                            'Feedback Loop Summary:',
+                            `  Total analyses:     ${stats.totalAnalyses}`,
+                            `  Avg efficiency:     ${stats.avgEfficiencyScore}%`,
+                            `  Total fixes:        ${stats.totalFixes}`,
+                            `  Implemented:        ${stats.implementedFixes}`,
+                            `  Verified:           ${stats.verifiedFixes}`,
+                            '',
+                        ];
+                        if (pendingFixes.length === 0) {
+                            lines.push('No pending fixes.');
+                        }
+                        else {
+                            lines.push('Pending Fixes:');
+                            for (const fix of pendingFixes.slice(0, 5)) {
+                                lines.push(`  - ${fix.description}`);
+                            }
+                            if (pendingFixes.length > 5) {
+                                lines.push(`  ... and ${pendingFixes.length - 5} more`);
+                            }
+                        }
+                        feedbackManager.close();
+                        addMessage('system', lines.join('\n'));
+                    }
+                    catch (e) {
+                        addMessage('error', `Error loading feedback data: ${e.message}`);
+                    }
+                }
+                else {
+                    addMessage('system', [
+                        'Usage:',
+                        '  /trace              - Show current session trace summary',
+                        '  /trace --analyze    - Run efficiency analysis',
+                        '  /trace issues       - List detected inefficiencies',
+                        '  /trace fixes        - List pending improvements',
+                    ].join('\n'));
+                }
+                return;
+            }
             default:
                 addMessage('system', `Unknown: /${cmd}. Try /help`);
         }
@@ -915,7 +1175,8 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                 addMessage('system', `${subagentPrefix}* ${e.inputTokens.toLocaleString()} in, ${e.outputTokens.toLocaleString()} out${e.cost ? ` $${e.cost.toFixed(6)}` : ''}`);
             }
             else if (event.type === 'plan.change.queued') {
-                addMessage('system', `[PLAN] Queued: ${event.tool}`);
+                const summary = event.summary ? `: ${event.summary}` : '';
+                addMessage('system', `[PLAN] Queued ${event.tool}${summary}`);
             }
         });
         try {
@@ -927,7 +1188,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             const agentState = agent.getState();
             const estimateTokens = (str) => Math.ceil(str.length / 3.2);
             const currentContextTokens = agentState.messages.reduce((sum, m) => sum + estimateTokens(typeof m.content === 'string' ? m.content : JSON.stringify(m.content)), 0);
-            const contextLimit = 80000;
+            const contextLimit = agent.getMaxContextTokens();
             const contextPct = Math.round((currentContextTokens / contextLimit) * 100);
             const durationSec = (metrics.duration / 1000).toFixed(1);
             // Format: Session total (cumulative cost) | Current context (compaction awareness)
@@ -1105,6 +1366,12 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             return !prev;
         });
     }, [addMessage]);
+    const handleToggleTransparency = useCallback(() => {
+        setTransparencyExpanded(prev => {
+            addMessage('system', !prev ? '[v] Transparency panel: visible' : '[^] Transparency panel: hidden');
+            return !prev;
+        });
+    }, [addMessage]);
     // Update context tokens
     useEffect(() => {
         const agentState = agent.getState();
@@ -1130,18 +1397,23 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
         }
     }, [isProcessing]);
     const modelShort = (model || 'unknown').split('/').pop() || model || 'unknown';
-    const contextPct = Math.round((contextTokens / 80000) * 100);
+    const contextPct = Math.round((contextTokens / agent.getMaxContextTokens()) * 100);
     const costStr = status.cost > 0 ? `$${status.cost.toFixed(4)}` : '$0.00';
     // =========================================================================
     // RENDER
     // =========================================================================
-    return (_jsxs(_Fragment, { children: [_jsx(Static, { items: messages, children: (m) => (_jsx(MessageItem, { msg: m, colors: colors }, m.id)) }), _jsxs(Box, { flexDirection: "column", children: [toolCalls.length > 0 && (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { color: "#DDA0DD", bold: true, children: `Tools ${toolCallsExpanded ? '[-]' : '[+]'}` }), toolCalls.slice(-5).map(tc => (_jsx(ToolCallItem, { tc: tc, expanded: toolCallsExpanded, colors: colors }, `${tc.id}-${tc.status}`)))] })), pendingApproval && (_jsx(ApprovalDialog, { visible: true, request: {
+    return (_jsxs(_Fragment, { children: [_jsx(Static, { items: messages, children: (m) => (_jsx(MessageItem, { msg: m, colors: colors }, m.id)) }), _jsxs(Box, { flexDirection: "column", children: [toolCalls.length > 0 && (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { color: "#DDA0DD", bold: true, children: `Tools ${toolCallsExpanded ? '[-]' : '[+]'}` }), toolCalls.slice(-5).map(tc => (_jsx(ToolCallItem, { tc: tc, expanded: toolCallsExpanded, colors: colors }, `${tc.id}-${tc.status}`)))] })), transparencyExpanded && transparencyState && (_jsxs(Box, { flexDirection: "column", marginBottom: 1, borderStyle: "single", borderColor: colors.border, paddingX: 1, children: [_jsx(Text, { color: colors.accent, bold: true, children: "[v] Transparency Panel" }), _jsxs(Box, { marginLeft: 2, flexDirection: "column", children: [_jsx(Text, { color: colors.text, children: "REASONING" }), transparencyState.lastRouting ? (_jsxs(_Fragment, { children: [_jsxs(Text, { color: colors.textMuted, children: ["  Routing: ", transparencyState.lastRouting.model] }), _jsxs(Text, { color: colors.textMuted, children: ["    ", transparencyState.lastRouting.reason] })] })) : (_jsx(Text, { color: colors.textMuted, children: "  Routing: (no routing decisions yet)" })), transparencyState.lastPolicy && (_jsxs(Text, { color: transparencyState.lastPolicy.decision === 'blocked' ? colors.error :
+                                            transparencyState.lastPolicy.decision === 'prompted' ? colors.warning : colors.success, children: ["Policy: ", transparencyState.lastPolicy.decision === 'allowed' ? '+' :
+                                                transparencyState.lastPolicy.decision === 'blocked' ? 'x' : '?', " ", transparencyState.lastPolicy.tool] }))] }), _jsxs(Box, { marginLeft: 2, marginTop: 1, flexDirection: "column", children: [_jsx(Text, { color: colors.text, children: "CONTEXT" }), transparencyState.contextHealth ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: colors.textMuted, children: '  [' + '='.repeat(Math.round((transparencyState.contextHealth.percentUsed / 100) * 20)) +
+                                                    '-'.repeat(20 - Math.round((transparencyState.contextHealth.percentUsed / 100) * 20)) +
+                                                    '] ' + transparencyState.contextHealth.percentUsed + '%' }), _jsx(Text, { color: colors.textMuted, children: '  ' + (transparencyState.contextHealth.currentTokens / 1000).toFixed(1) + 'k / ' +
+                                                    (transparencyState.contextHealth.maxTokens / 1000).toFixed(0) + 'k tokens' }), _jsx(Text, { color: colors.textMuted, children: '  ~' + transparencyState.contextHealth.estimatedExchanges + ' exchanges remaining' })] })) : (_jsx(Text, { color: colors.textMuted, children: "  (no context data yet)" }))] }), transparencyState.activeLearnings.length > 0 && (_jsxs(Box, { marginLeft: 2, marginTop: 1, flexDirection: "column", children: [_jsx(Text, { color: colors.text, children: "MEMORY" }), _jsxs(Text, { color: colors.textMuted, children: ["  Learnings applied: ", transparencyState.activeLearnings.length] })] }))] })), pendingApproval && (_jsx(ApprovalDialog, { visible: true, request: {
                             id: pendingApproval.id,
                             tool: pendingApproval.tool || pendingApproval.action,
                             args: pendingApproval.args || {},
                             risk: pendingApproval.risk,
                             context: pendingApproval.context,
-                        }, onApprove: handleApprove, onDeny: handleDeny, colors: colors, denyReasonMode: denyReasonMode, denyReason: denyReason })), _jsx(MemoizedInputArea, { onSubmit: handleSubmit, disabled: isProcessing || !!pendingApproval, borderColor: pendingApproval ? '#FFD700' : '#87CEEB', textColor: "#98FB98", cursorColor: "#87CEEB", onCtrlC: handleCtrlC, onCtrlL: handleCtrlL, onCtrlP: handleCtrlP, onEscape: handleEscape, onToggleToolExpand: handleToggleToolExpand, onToggleThinking: handleToggleThinking, commandPaletteOpen: commandPaletteOpen, onCommandPaletteInput: handleCommandPaletteInput, approvalDialogOpen: !!pendingApproval, approvalDenyReasonMode: denyReasonMode, onApprovalApprove: handleApprove, onApprovalAlwaysAllow: handleAlwaysAllow, onApprovalDeny: handleDeny, onApprovalDenyWithReason: handleDenyWithReason, onApprovalCancelDenyReason: handleCancelDenyReason, onApprovalDenyReasonInput: handleApprovalDenyReasonInput }), commandPaletteOpen && (_jsx(ControlledCommandPalette, { theme: selectedTheme, items: filteredCommandItems, visible: commandPaletteOpen, query: commandPaletteQuery, selectedIndex: commandPaletteIndex, onQueryChange: setCommandPaletteQuery, onSelectItem: (item) => {
+                        }, onApprove: handleApprove, onDeny: handleDeny, colors: colors, denyReasonMode: denyReasonMode, denyReason: denyReason })), _jsx(MemoizedInputArea, { onSubmit: handleSubmit, disabled: isProcessing || !!pendingApproval, borderColor: pendingApproval ? '#FFD700' : '#87CEEB', textColor: "#98FB98", cursorColor: "#87CEEB", onCtrlC: handleCtrlC, onCtrlL: handleCtrlL, onCtrlP: handleCtrlP, onEscape: handleEscape, onToggleToolExpand: handleToggleToolExpand, onToggleThinking: handleToggleThinking, onToggleTransparency: handleToggleTransparency, commandPaletteOpen: commandPaletteOpen, onCommandPaletteInput: handleCommandPaletteInput, approvalDialogOpen: !!pendingApproval, approvalDenyReasonMode: denyReasonMode, onApprovalApprove: handleApprove, onApprovalAlwaysAllow: handleAlwaysAllow, onApprovalDeny: handleDeny, onApprovalDenyWithReason: handleDenyWithReason, onApprovalCancelDenyReason: handleCancelDenyReason, onApprovalDenyReasonInput: handleApprovalDenyReasonInput }), commandPaletteOpen && (_jsx(ControlledCommandPalette, { theme: selectedTheme, items: filteredCommandItems, visible: commandPaletteOpen, query: commandPaletteQuery, selectedIndex: commandPaletteIndex, onQueryChange: setCommandPaletteQuery, onSelectItem: (item) => {
                             setCommandPaletteOpen(false);
                             setCommandPaletteQuery('');
                             setCommandPaletteIndex(0);
@@ -1150,7 +1422,9 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                             setCommandPaletteOpen(false);
                             setCommandPaletteQuery('');
                             setCommandPaletteIndex(0);
-                        } })), _jsxs(Box, { borderStyle: "single", borderColor: isProcessing ? colors.info : colors.textMuted, paddingX: 1, justifyContent: "space-between", children: [_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: isProcessing ? colors.info : '#98FB98', bold: isProcessing, children: isProcessing ? '[~]' : '[*]' }), _jsx(Text, { color: isProcessing ? colors.info : colors.text, bold: isProcessing, children: status.mode.length > 40 ? status.mode.slice(0, 37) + '...' : status.mode }), isProcessing && elapsedTime > 0 && _jsxs(Text, { color: colors.textMuted, dimColor: true, children: ["| ", elapsedTime, "s"] }), status.iter > 0 && _jsxs(Text, { color: colors.textMuted, dimColor: true, children: ["| iter ", status.iter] })] }), _jsxs(Box, { gap: 2, children: [_jsx(Text, { color: "#DDA0DD", dimColor: true, children: modelShort }), _jsx(Text, { color: contextPct > 70 ? '#FFD700' : colors.textMuted, dimColor: true, children: `${(contextTokens / 1000).toFixed(1)}k` }), _jsx(Text, { color: "#98FB98", dimColor: true, children: costStr }), gitBranch && _jsx(Text, { color: "#87CEEB", dimColor: true, children: gitBranch }), _jsx(Text, { color: colors.textMuted, dimColor: true, children: "ESC:cancel ^P:help" })] })] })] })] }));
+                        } })), _jsxs(Box, { borderStyle: "single", borderColor: isProcessing ? colors.info : colors.textMuted, paddingX: 1, justifyContent: "space-between", children: [_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: isProcessing ? colors.info : '#98FB98', bold: isProcessing, children: isProcessing ? '[~]' : '[*]' }), _jsx(Text, { color: isProcessing ? colors.info : colors.text, bold: isProcessing, children: status.mode.length > 40 ? status.mode.slice(0, 37) + '...' : status.mode }), isProcessing && elapsedTime > 0 && _jsxs(Text, { color: colors.textMuted, dimColor: true, children: ["| ", elapsedTime, "s"] }), status.iter > 0 && _jsxs(Text, { color: colors.textMuted, dimColor: true, children: ["| iter ", status.iter] })] }), _jsxs(Box, { gap: 2, children: [_jsx(Text, { color: "#DDA0DD", dimColor: true, children: modelShort }), _jsx(Text, { color: contextPct > 70 ? '#FFD700' : colors.textMuted, dimColor: true, children: '[' + '='.repeat(Math.min(8, Math.round((contextPct / 100) * 8))) +
+                                            '-'.repeat(Math.max(0, 8 - Math.round((contextPct / 100) * 8))) + '] ' +
+                                            contextPct + '%' }), _jsx(Text, { color: "#98FB98", dimColor: true, children: costStr }), gitBranch && _jsx(Text, { color: "#87CEEB", dimColor: true, children: gitBranch }), transparencyState?.activeLearnings && transparencyState.activeLearnings.length > 0 && (_jsxs(Text, { color: "#87CEEB", dimColor: true, children: ["L:", transparencyState.activeLearnings.length] })), _jsx(Text, { color: colors.textMuted, dimColor: true, children: "^P:help" })] })] })] })] }));
 }
 export default TUIApp;
 //# sourceMappingURL=app.js.map