@calliopelabs/cli 0.8.20 → 2.0.2

package/dist/ui/index.js

@@ -0,0 +1,928 @@
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * UI Module - Entry Point
+ *
+ * TerminalChat (main component), App wrapper, printBanner, startInkCLI.
+ * Imports extracted modules and wires state through context bags.
+ */
+import React, { useState, useCallback, useRef, useEffect } from 'react';
+import { render, Box, Text, useApp, useStdout } from 'ink';
+import * as fs from 'fs';
+import * as config from '../config.js';
+import { selectProvider } from '../providers/index.js';
+import { getSystemPrompt, DEFAULT_MODELS, supportsVision } from '../types.js';
+import { getVersion } from '../version-check.js';
+import { getModelContextLimit, preWarmModelCache } from '../model-detection.js';
+import { detectComplexity } from '../risk.js';
+import * as storage from '../storage.js';
+import { parseFileReferences, processFilesForMessage, formatFileInfo } from '../files.js';
+import * as memory from '../memory.js';
+import * as hooks from '../hooks.js';
+import { getCurrentSkin, getCurrentPalette, paletteColorize, applySkin, applyPalette } from '../hud/api.js';
+import { renderColoredBanner, renderSplashAnimation, renderTransition, colorFg } from '../terminal-image.js';
+import { HUDFrame } from './frame.js';
+import { getCurrentCompanion, applyCompanion, setEmojiConfig } from '../companions.js';
+import { CircuitBreaker } from '../circuit-breaker.js';
+import { IterationLedger } from '../iteration-ledger.js';
+import { getDefaultSmartRoutingConfig } from '../smart-router.js';
+import * as recording from '../terminal-recording.js';
+import * as sessionTimeout from '../session-timeout.js';
+import * as idleEviction from '../idle-eviction.js';
+import { isTmux, getTmuxInfo } from '../tmux.js';
+import { ErrorBoundary } from './error-boundary.js';
+import { ThinkingDisplay, ProcessingIndicator, StreamingIndicator, StateTransition } from './components.js';
+import { MessageHistory } from './messages.js';
+import { ModelSelector, SessionSelector, UpgradePrompt, ComplexityWarning, SessionResumePrompt, KeybindingsModal, } from './modals.js';
+import { ThemePicker } from './theme-picker.js';
+import { PackPicker } from './pack-picker.js';
+import { applyThemePack, getCurrentPack, getCompanionMode, getThemePack } from '../hud/theme-packs/api.js';
+import { ChatInput } from './chat-input.js';
+import { StatusBar } from './status-bar.js';
+import { handleCommand } from './commands.js';
+import { runAgentImpl, runLoopImpl, validateAndRepairMessagesImpl } from './agent.js';
+// Wire emoji config at module load (breaks circular dep: companions → config)
+setEmojiConfig(config);
+// Module-level state for agterm mode
+let moduleAgtermEnabled = false;
+// Debug logging for flow control issues
+let debugEnabled = process.env.CALLIOPE_DEBUG === '1';
+const debugLog = (label, ...args) => {
+    if (debugEnabled) {
+        const timestamp = new Date().toISOString().split('T')[1].slice(0, 12);
+        console.error(`[${timestamp}] ${label}:`, ...args);
+    }
+};
+// ============================================================================
+// Main Chat Component
+// ============================================================================
+function TerminalChat() {
+    const { exit } = useApp();
+    const { stdout } = useStdout();
+    // Reactive terminal width - re-renders on resize via SIGWINCH
+    const [width, setWidth] = useState(() => stdout?.columns || 80);
+    useEffect(() => {
+        const onResize = () => {
+            const cols = stdout?.columns || process.stdout.columns || 80;
+            setWidth(cols);
+        };
+        process.stdout.on('resize', onResize);
+        return () => { process.stdout.off('resize', onResize); };
+    }, [stdout]);
+    // Core state
+    const [input, setInput] = useState('');
+    const [suggestions, setSuggestions] = useState([]);
+    const [messages, setMessages] = useState([]);
+    const [isProcessing, setIsProcessing] = useState(false);
+    const [thinkingState, setThinkingState] = useState(null);
+    const [streamingResponse, setStreamingResponse] = useState('');
+    const [activityState, setActivityState] = useState(null);
+    // State transition tracking
+    const prevProcessingState = useRef('idle');
+    const [transition, setTransition] = useState(null);
+    useEffect(() => {
+        const current = isProcessing && thinkingState && !streamingResponse ? 'thinking' :
+            isProcessing && streamingResponse ? 'streaming' :
+                !isProcessing && prevProcessingState.current !== 'idle' ? 'done' : 'idle';
+        if (current !== prevProcessingState.current) {
+            const from = prevProcessingState.current;
+            // Only show transitions for meaningful state changes
+            if (from !== 'idle' || current !== 'idle') {
+                setTransition({ from, to: current });
+            }
+            prevProcessingState.current = current;
+        }
+    }, [isProcessing, thinkingState, streamingResponse]);
+    // Input history for up/down arrow navigation
+    const [inputHistory, setInputHistory] = useState([]);
+    const [historyIndex, setHistoryIndex] = useState(-1);
+    const [savedInput, setSavedInput] = useState(''); // Save current input when navigating
+    // Smart suggestions context
+    const [hasGitRepo] = useState(() => {
+        try {
+            return fs.existsSync('.git') || fs.existsSync('../.git');
+        }
+        catch {
+            return false;
+        }
+    });
+    const recentCommands = React.useMemo(() => inputHistory.filter(cmd => cmd.startsWith('/')).slice(-10), [inputHistory]);
+    // Clear suggestions when input changes significantly
+    const handleInputChange = useCallback((newValue) => {
+        setInput(newValue);
+        // Clear suggestions if user clears input or submits
+        if (!newValue || !newValue.startsWith('/')) {
+            setSuggestions([]);
+        }
+        // Reset history navigation when user types
+        setHistoryIndex(-1);
+    }, []);
+    // Navigate input history
+    const navigateHistory = useCallback((direction) => {
+        if (inputHistory.length === 0)
+            return;
+        if (direction === 'up') {
+            if (historyIndex === -1) {
+                // Save current input before navigating
+                setSavedInput(input);
+                setHistoryIndex(inputHistory.length - 1);
+                setInput(inputHistory[inputHistory.length - 1]);
+            }
+            else if (historyIndex > 0) {
+                setHistoryIndex(historyIndex - 1);
+                setInput(inputHistory[historyIndex - 1]);
+            }
+        }
+        else {
+            if (historyIndex === -1)
+                return;
+            if (historyIndex < inputHistory.length - 1) {
+                setHistoryIndex(historyIndex + 1);
+                setInput(inputHistory[historyIndex + 1]);
+            }
+            else {
+                // Return to saved input
+                setHistoryIndex(-1);
+                setInput(savedInput);
+            }
+        }
+    }, [inputHistory, historyIndex, input, savedInput]);
+    // Add to history when submitting
+    const addToHistory = useCallback((value) => {
+        if (value.trim() && (inputHistory.length === 0 || inputHistory[inputHistory.length - 1] !== value)) {
+            setInputHistory(prev => [...prev.slice(-100), value]); // Keep last 100 entries
+        }
+        setHistoryIndex(-1);
+        setSavedInput('');
+    }, [inputHistory]);
+    // Config state
+    // Use lazy initializers to avoid calling config.get() on every render
+    const [provider, setProvider] = useState(() => process.env.CALLIOPE_PROVIDER || config.get('defaultProvider'));
+    const [model, setModel] = useState(() => process.env.CALLIOPE_MODEL || config.get('defaultModel'));
+    const [persona, setPersona] = useState(() => config.get('persona'));
+    const [mode, setMode] = useState('hybrid'); // Default to hybrid mode
+    const [confirmMode, setConfirmMode] = useState(true); // Require confirmation for risky ops
+    const [layout, setLayout] = useState(() => config.get('layout') || 'response-bottom');
+    const [density, setDensity] = useState(() => config.get('density') || 'normal');
+    const [collapseSettings, setCollapseSettings] = useState(() => ({
+        collapseTools: config.get('collapseTools') ?? false,
+        collapseThinking: config.get('collapseThinking') ?? false,
+        toolDisplayLimit: config.get('toolDisplayLimit') ?? 0,
+    }));
+    // Modal state
+    const [modalMode, setModalMode] = useState('none');
+    const [pendingComplexPrompt, setPendingComplexPrompt] = useState(null);
+    const [previousSession, setPreviousSession] = useState(null);
+    const [pendingToolCall, setPendingToolCall] = useState(null);
+    const [availableModels, setAvailableModels] = useState([]);
+    const [availableSessions, setAvailableSessions] = useState([]);
+    const [latestVersion, setLatestVersion] = useState(null);
+    // Stats
+    const [stats, setStats] = useState({
+        inputTokens: 0,
+        outputTokens: 0,
+        cost: 0,
+        messageCount: 0,
+    });
+    const [contextTokens, setContextTokens] = useState(0);
+    // Message queue for human-in-the-loop feedback during processing
+    const [queuedMessages, setQueuedMessages] = useState([]);
+    const queuedMessagesRef = useRef([]); // Ref to avoid stale closure in runAgent
+    const [queueInput, setQueueInput] = useState('');
+    const [editingQueueIndex, setEditingQueueIndex] = useState(null);
+    // Keep ref in sync with state
+    useEffect(() => {
+        queuedMessagesRef.current = queuedMessages;
+    }, [queuedMessages]);
+    // Undo/Redo history - stores snapshots of conversation state
+    const undoStack = useRef([]);
+    const redoStack = useRef([]);
+    const MAX_UNDO_HISTORY = 10;
+    // Conversation bookmarks
+    const [bookmarks, setBookmarks] = useState([]);
+    // Prompt templates
+    const [templates, setTemplates] = useState([]);
+    // Save state before changes (call before modifying messages)
+    const saveUndoState = useCallback(() => {
+        undoStack.current.push({
+            messages: [...messages],
+            llmMessages: [...llmMessages.current],
+            timestamp: new Date(),
+        });
+        // Limit stack size
+        if (undoStack.current.length > MAX_UNDO_HISTORY) {
+            undoStack.current.shift();
+        }
+        // Clear redo stack on new action
+        redoStack.current = [];
+    }, [messages]);
+    // LLM conversation history
+    const llmMessages = useRef([
+        { role: 'system', content: getSystemPrompt(persona) }
+    ]);
+    // Keep system prompt in sync when persona changes (fixes #46 - persona lost on model fallback)
+    useEffect(() => {
+        const firstMsg = llmMessages.current[0];
+        if (firstMsg && firstMsg.role === 'system') {
+            // Preserve any appended memory context
+            const currentContent = typeof firstMsg.content === 'string' ? firstMsg.content : '';
+            const memoryIdx = currentContent.indexOf('\n\n--- Project Context ---\n');
+            const memoryPart = memoryIdx >= 0 ? currentContent.slice(memoryIdx) : '';
+            llmMessages.current[0] = {
+                role: 'system',
+                content: getSystemPrompt(persona) + memoryPart,
+            };
+        }
+    }, [persona]);
+    // Estimate context tokens (conservative: ~2.5 chars per token + 1.35x overhead)
+    const estimateContextTokens = useCallback(() => {
+        let chars = 0;
+        let msgCount = 0;
+        for (const msg of llmMessages.current) {
+            msgCount++;
+            if (typeof msg.content === 'string') {
+                chars += msg.content.length;
+            }
+            else if (Array.isArray(msg.content)) {
+                for (const block of msg.content) {
+                    if (block.type === 'text') {
+                        chars += block.text.length;
+                    }
+                    else if (block.type === 'image') {
+                        chars += 1000; // Images count as ~250 tokens
+                    }
+                }
+            }
+            // Include tool call arguments in estimation
+            if (msg.toolCalls) {
+                for (const tool of msg.toolCalls) {
+                    chars += JSON.stringify(tool.arguments || {}).length;
+                }
+            }
+        }
+        // Conservative: 2.5 chars/token, 1.35x overhead for formatting/metadata, +50 per message
+        return Math.round((chars / 2.5) * 1.35 + msgCount * 50);
+    }, []);
+    // Session state
+    const sessionRef = useRef(null);
+    const [autoRoute, setAutoRoute] = useState(false); // Auto model routing
+    const [smartRouteActive, setSmartRouteActive] = useState(() => config.get('smartRoutingEnabled') ?? false);
+    const [breakerHealth, setBreakerHealth] = useState('ok');
+    const ledgerRef = useRef(new IterationLedger());
+    const circuitBreakerRef = useRef(config.get('circuitBreakersEnabled') !== false ? (() => {
+        const iterTimeSec = config.get('maxIterationTime');
+        const cb = new CircuitBreaker();
+        if (typeof iterTimeSec === 'number' && iterTimeSec > 0) {
+            cb.adjust('wall-clock', { maxIterationDurationMs: iterTimeSec * 1000 });
+        }
+        // Local/free providers: disable cost breaker, relax token limits
+        const prov = config.get('defaultProvider');
+        if (prov === 'ollama' || prov === 'litellm') {
+            cb.adjust('cost-runaway', { maxSessionCost: 999999, maxCostPerMinute: 999999 });
+            cb.adjust('token-burn', { maxTokensPerIteration: 500_000, maxTotalTokens: 20_000_000 });
+        }
+        return cb;
+    })() : null);
+    const smartRoutingConfigRef = useRef({
+        ...getDefaultSmartRoutingConfig(),
+        enabled: config.get('smartRoutingEnabled') ?? false,
+        costSensitivity: config.get('smartRoutingCostSensitivity') ?? 0.3,
+    });
+    const [memoryLoaded, setMemoryLoaded] = useState(false);
+    // Agent loop state
+    const [loopActive, setLoopActive] = useState(false);
+    const [loopPrompt, setLoopPrompt] = useState('');
+    const [loopMaxIterations, setLoopMaxIterations] = useState(100);
+    const [loopCompletionPromise, setLoopCompletionPromise] = useState();
+    const [loopIteration, setLoopIteration] = useState(0);
+    const loopCancelledRef = useRef(false);
+    // Initialize session and load memory on mount
+    useEffect(() => {
+        const cwd = process.cwd();
+        // Check for existing session with messages
+        const existingSessions = storage.listSessions(5);
+        const recentSession = existingSessions.find(s => s.projectPath === cwd &&
+            s.messageCount > 0 &&
+            Date.now() - new Date(s.lastAccessedAt).getTime() < 24 * 60 * 60 * 1000 // Within 24 hours
+        );
+        if (recentSession && !sessionRef.current) {
+            // Offer to resume
+            setPreviousSession({
+                projectName: recentSession.projectName,
+                lastAccessedAt: recentSession.lastAccessedAt,
+                messageCount: recentSession.messageCount,
+            });
+            setModalMode('session-resume');
+        }
+        const session = storage.getOrCreateSession(cwd);
+        sessionRef.current = session;
+        // Load memory context into system prompt
+        if (!memoryLoaded) {
+            const cwdMem = process.cwd();
+            const memoryContext = memory.buildMemoryContext(cwdMem);
+            if (memoryContext.trim()) {
+                // Append memory context to system prompt
+                const currentSystem = llmMessages.current[0];
+                if (currentSystem && currentSystem.role === 'system') {
+                    const systemContent = typeof currentSystem.content === 'string'
+                        ? currentSystem.content
+                        : '';
+                    llmMessages.current[0] = {
+                        role: 'system',
+                        content: systemContent + '\n\n--- Project Context ---\n' + memoryContext,
+                    };
+                }
+            }
+            setMemoryLoaded(true);
+            // Execute session start hooks
+            hooks.executeHooks('session-start', {}).catch((err) => {
+                debugLog('hooks', 'session-start hook failed:', err instanceof Error ? err.message : err);
+            });
+            // Start session recording (audit log) — respects config
+            recording.setRecordingEnabled(config.get('recordSessions') !== false);
+            recording.setRetentionDays(config.get('recordingRetentionDays') ?? 0);
+            recording.startRecording({
+                provider: selectProvider(provider),
+                model: model || DEFAULT_MODELS[selectProvider(provider)],
+                cwd: cwdMem,
+            });
+            // Configure session timeout (opt-in via config)
+            const timeoutMs = config.get('sessionTimeoutMs');
+            if (timeoutMs) {
+                sessionTimeout.configureTimeout({
+                    enabled: true,
+                    idleTimeoutMs: typeof timeoutMs === 'number' ? timeoutMs : 2 * 60 * 60 * 1000,
+                });
+                sessionTimeout.onTimeout((type) => {
+                    if (type === 'warning') {
+                        addMessage('system', `\u23f1\ufe0f  Session will timeout in ${sessionTimeout.formatTimeRemaining()}`);
+                    }
+                    else {
+                        addMessage('system', '\ud83d\udeaa Session timeout. Saving and exiting...');
+                        storage.saveMessageHistory(llmMessages.current);
+                    }
+                });
+            }
+            // Start idle eviction monitor
+            idleEviction.configureEviction({ enabled: true });
+            idleEviction.onEviction((action) => {
+                if (action === 'auto-save') {
+                    storage.saveMessageHistory(llmMessages.current);
+                }
+            });
+            // Log tmux context if applicable
+            if (isTmux()) {
+                const info = getTmuxInfo();
+                if (info) {
+                    debugLog('tmux', `session=${info.session}, windows=${info.windows}, panes=${info.panes}`);
+                }
+            }
+            // Load templates from storage
+            const savedTemplates = storage.getTemplates();
+            if (savedTemplates.length > 0) {
+                setTemplates(savedTemplates.map(t => ({
+                    name: t.name,
+                    prompt: t.prompt,
+                    createdAt: new Date(t.createdAt),
+                })));
+            }
+            // Pre-warm model cache in background for faster model switching
+            preWarmModelCache().catch((err) => {
+                debugLog('cache', 'model cache pre-warm failed:', err instanceof Error ? err.message : err);
+            });
+        }
+    }, [memoryLoaded]);
+    // Derived values
+    const actualProvider = selectProvider(provider);
+    const actualModel = model || DEFAULT_MODELS[actualProvider];
+    const isModalActive = modalMode !== 'none';
+    // Add message helper
+    const addMessage = useCallback((type, content) => {
+        setMessages(prev => [...prev, {
+                id: `${Date.now()}-${Math.random().toString(36).slice(2)}`,
+                type,
+                content
+            }]);
+        // Persist user and assistant messages to storage for session history
+        if (type === 'user' || type === 'assistant') {
+            storage.addChatMessage({ role: type, content });
+        }
+    }, []);
+    // Handler to edit or delete a queued message
+    const handleEditQueuedMessage = useCallback((index, newMsg) => {
+        if (newMsg === '') {
+            // Delete the message
+            setQueuedMessages(prev => prev.filter((_, i) => i !== index));
+            addMessage('system', `🗑️ Deleted queued message #${index + 1}`);
+        }
+        else {
+            // Update the message
+            setQueuedMessages(prev => prev.map((msg, i) => i === index ? newMsg : msg));
+            addMessage('system', `✏️ Updated queued message #${index + 1}`);
+        }
+    }, [addMessage]);
+    // Validate and repair message history
+    const validateAndRepairMessages = useCallback(() => {
+        return validateAndRepairMessagesImpl({
+            llmMessages,
+            addMessage,
+            debugLog,
+        });
+    }, [addMessage]);
+    // Build agent context
+    const buildAgentContext = useCallback(() => ({
+        provider,
+        model,
+        mode,
+        confirmMode,
+        autoRoute,
+        actualProvider,
+        actualModel,
+        stats,
+        agtermEnabled: moduleAgtermEnabled,
+        ledger: ledgerRef.current,
+        circuitBreaker: circuitBreakerRef.current || undefined,
+        smartRouteActive,
+        smartRoutingConfig: smartRoutingConfigRef.current,
+        setBreakerHealth,
+        setStats,
+        setStreamingResponse,
+        setThinkingState,
+        setActivityState,
+        setContextTokens,
+        setIsProcessing,
+        setQueuedMessages,
+        setEditingQueueIndex,
+        setLoopIteration,
+        setLoopActive,
+        llmMessages,
+        queuedMessagesRef,
+        loopCancelledRef,
+        sessionRef,
+        addMessage,
+        estimateContextTokens,
+        validateAndRepairMessages,
+        debugLog,
+    }), [provider, model, mode, confirmMode, autoRoute, smartRouteActive, actualProvider, actualModel, stats, addMessage, estimateContextTokens, validateAndRepairMessages]);
+    // Run agent with user prompt
+    const runAgent = useCallback(async (content) => {
+        const ctx = buildAgentContext();
+        await runAgentImpl(ctx, content);
+    }, [buildAgentContext]);
+    // Agent loop - runs prompt repeatedly until completion promise or max iterations
+    const runLoop = useCallback(async (prompt, maxIter, completionPromise) => {
+        const ctx = buildAgentContext();
+        await runLoopImpl(ctx, prompt, maxIter, completionPromise);
+    }, [buildAgentContext]);
+    // Build command context
+    const buildCommandContext = useCallback(() => ({
+        actualProvider,
+        actualModel,
+        provider,
+        model,
+        persona,
+        mode,
+        confirmMode,
+        autoRoute,
+        layout,
+        density,
+        collapseSettings,
+        messages,
+        stats,
+        loopActive,
+        isProcessing,
+        thinkingState,
+        streamingResponse,
+        queuedMessages,
+        bookmarks,
+        templates,
+        agtermEnabled: moduleAgtermEnabled,
+        debugEnabled,
+        modalMode,
+        circuitBreaker: circuitBreakerRef.current || undefined,
+        smartRouteActive,
+        smartRoutingConfig: smartRoutingConfigRef.current,
+        setProvider,
+        setModel,
+        setPersona,
+        setMode,
+        setConfirmMode,
+        setAutoRoute,
+        setLayout: setLayout,
+        setDensity: setDensity,
+        setCollapseSettings,
+        setMessages,
+        setStats,
+        setModalMode: setModalMode,
+        setPendingComplexPrompt,
+        setAvailableModels,
+        setAvailableSessions,
+        setLatestVersion,
+        setLoopActive,
+        setLoopPrompt,
+        setLoopMaxIterations,
+        setLoopCompletionPromise,
+        setLoopIteration,
+        setIsProcessing,
+        setThinkingState,
+        setStreamingResponse,
+        setQueuedMessages,
+        setInput,
+        setBookmarks,
+        setTemplates,
+        setContextTokens,
+        setDebugEnabled: (v) => { debugEnabled = v; },
+        setSmartRouteActive,
+        setBreakerHealth,
+        llmMessages,
+        undoStack,
+        redoStack,
+        loopCancelledRef,
+        sessionRef,
+        addMessage,
+        estimateContextTokens,
+        saveUndoState,
+        runAgent,
+        runLoop,
+        exit,
+    }), [actualProvider, actualModel, provider, model, persona, mode, confirmMode, autoRoute, smartRouteActive,
+        layout, density, collapseSettings, messages, stats, loopActive, isProcessing,
+        thinkingState, streamingResponse, queuedMessages, bookmarks, templates, modalMode,
+        addMessage, estimateContextTokens, saveUndoState, runAgent, runLoop, exit]);
+    // Handle slash commands
+    const handleCommandWrapped = useCallback(async (cmd) => {
+        const ctx = buildCommandContext();
+        await handleCommand(cmd, ctx);
+    }, [buildCommandContext]);
+    // Handle input submission
+    const handleSubmit = useCallback(async (value) => {
+        const trimmed = value.trim();
+        if (!trimmed || isProcessing)
+            return;
+        // Record activity for timeout/eviction and audit log
+        sessionTimeout.recordActivity();
+        idleEviction.recordActivity();
+        recording.recordEvent('input', trimmed);
+        // Add to history for up/down arrow navigation
+        addToHistory(trimmed);
+        setInput('');
+        if (trimmed.startsWith('/')) {
+            await handleCommandWrapped(trimmed);
+            return;
+        }
+        // ! prefix executes shell commands directly
+        if (trimmed.startsWith('!')) {
+            const shellCmd = trimmed.slice(1).trim();
+            if (shellCmd) {
+                addMessage('system', `$ ${shellCmd}`);
+                try {
+                    const { execSync } = await import('child_process');
+                    const output = execSync(shellCmd, {
+                        cwd: process.cwd(),
+                        encoding: 'utf-8',
+                        timeout: 30000,
+                        stdio: ['pipe', 'pipe', 'pipe'],
+                        maxBuffer: 10 * 1024 * 1024,
+                    }).trim();
+                    addMessage('system', output || '(no output)');
+                }
+                catch (err) {
+                    const execErr = err;
+                    addMessage('error', execErr.stderr?.trim() || execErr.message || String(err));
+                }
+            }
+            return;
+        }
+        // In hybrid mode, check for complex operations
+        if (mode === 'hybrid') {
+            const complexity = detectComplexity(trimmed);
+            if (complexity.isComplex) {
+                setPendingComplexPrompt({ prompt: trimmed, complexity });
+                setModalMode('complexity-warning');
+                return;
+            }
+        }
+        // Save state for undo before modifying conversation
+        saveUndoState();
+        // Parse file references from input
+        const { text: cleanText, files } = parseFileReferences(trimmed, process.cwd());
+        // Show user message (with file info if any)
+        if (files.length > 0) {
+            const fileInfo = formatFileInfo(files);
+            addMessage('user', `${cleanText}\n📎 ${fileInfo}`);
+        }
+        else {
+            addMessage('user', trimmed);
+        }
+        setIsProcessing(true);
+        try {
+            // Build message content (with file/image support)
+            let messageContent;
+            if (files.length > 0) {
+                const visionSupported = supportsVision(provider, model);
+                const { content, warnings } = processFilesForMessage(cleanText || trimmed, files, visionSupported);
+                // Show any warnings about files
+                for (const warning of warnings) {
+                    addMessage('system', warning);
+                }
+                messageContent = content;
+            }
+            else {
+                messageContent = trimmed;
+            }
+            await runAgent(messageContent);
+        }
+        finally {
+            setIsProcessing(false);
+            setThinkingState(null);
+            setStreamingResponse('');
+        }
+    }, [isProcessing, handleCommandWrapped, runAgent, addMessage, provider, model, saveUndoState, addToHistory, mode]);
+    // Modal handlers
+    const handleModelSelect = useCallback((selectedModel) => {
+        setModel(selectedModel);
+        addMessage('system', `Model: ${selectedModel}`);
+        setModalMode('none');
+        setAvailableModels([]);
+    }, [addMessage]);
+    const handleModalCancel = useCallback(() => {
+        setModalMode('none');
+        setAvailableModels([]);
+        setLatestVersion(null);
+    }, []);
+    const handleUpgradeConfirm = useCallback(async () => {
+        setModalMode('none');
+        addMessage('system', 'Upgrading...');
+        try {
+            const { performUpgrade } = await import('../version-check.js');
+            const success = await performUpgrade();
+            if (success) {
+                addMessage('system', 'Upgrade complete! Restarting...');
+                const { spawn } = await import('child_process');
+                const child = spawn(process.argv[0], process.argv.slice(1), {
+                    stdio: 'inherit',
+                    detached: true,
+                });
+                child.unref();
+                process.exit(0);
+            }
+            else {
+                addMessage('error', 'Upgrade failed. Try: npm install -g @calliopelabs/cli@latest');
+            }
+        }
+        catch (e) {
+            addMessage('error', `Upgrade failed: ${e instanceof Error ? e.message : String(e)}`);
+        }
+        setLatestVersion(null);
+    }, [addMessage]);
+    // Cycle through modes
+    const cycleMode = useCallback(() => {
+        setMode(current => {
+            const modes = ['plan', 'hybrid', 'work'];
+            const idx = modes.indexOf(current);
+            const next = modes[(idx + 1) % modes.length];
+            return next;
+        });
+    }, []);
+    // Handle Escape key - cancel operation if processing, otherwise show hint
+    const handleEscape = useCallback(() => {
+        if (isProcessing) {
+            // Cancel current operation
+            setIsProcessing(false);
+            setThinkingState(null);
+            setStreamingResponse('');
+            setLoopActive(false);
+            setEditingQueueIndex(null);
+            addMessage('system', '⏹ Operation cancelled. Use /exit to quit.');
+        }
+        else if (modalMode !== 'none') {
+            // Close any open modal
+            setModalMode('none');
+            setPendingComplexPrompt(null);
+        }
+        else {
+            // Not processing - show hint instead of exiting
+            addMessage('system', '💡 Use /exit to quit, or Ctrl+C.');
+        }
+    }, [isProcessing, modalMode, addMessage]);
+    // Handle direct send (Shift+Enter) - interrupts current operation and sends immediately
+    const handleDirectSend = useCallback((msg) => {
+        // Stop current processing
+        setIsProcessing(false);
+        setThinkingState(null);
+        setStreamingResponse('');
+        setEditingQueueIndex(null);
+        // Show what happened
+        addMessage('system', '⚡ Direct send - interrupting current operation');
+        addMessage('user', msg);
+        // Start new agent run with this message
+        setIsProcessing(true);
+        runAgent(msg).finally(() => {
+            setIsProcessing(false);
+            setThinkingState(null);
+            setStreamingResponse('');
+            setEditingQueueIndex(null);
+        });
+    }, [addMessage, runAgent]);
+    // Streaming response component (reused across layouts)
+    const StreamingResponseBox = streamingResponse ? (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: "cyan", children: ["\u2727 ", getCurrentCompanion().name, ":"] }), streamingResponse.split('\n').map((line, i) => (_jsxs(Text, { children: [_jsx(Text, { color: "blue", children: "\u2502" }), " ", line] }, i))), _jsx(Text, { color: "cyan", children: "\u258C" })] })) : null;
+    // Thinking/Processing indicator component with state transitions
+    const ProcessingBox = (_jsxs(_Fragment, { children: [transition && (_jsx(StateTransition, { from: transition.from, to: transition.to, onComplete: () => setTransition(null) })), isProcessing && thinkingState && !streamingResponse && _jsx(ThinkingDisplay, { state: thinkingState }), isProcessing && !thinkingState && !streamingResponse && _jsx(ProcessingIndicator, { label: "Waiting for response" }), isProcessing && streamingResponse && _jsx(StreamingIndicator, { activity: activityState ?? undefined })] }));
+    // Render based on layout
+    return (_jsx(HUDFrame, { width: width, children: _jsxs(Box, { flexDirection: "column", width: width, children: [layout === 'split' && (_jsxs(Box, { flexDirection: "row", width: width, children: [_jsxs(Box, { flexDirection: "column", width: "50%", children: [_jsx(Text, { color: "yellow", dimColor: true, children: "\u2500 Tools \u2500" }), _jsx(MessageHistory, { messages: messages, collapseSettings: collapseSettings }), ProcessingBox] }), _jsxs(Box, { flexDirection: "column", width: "50%", borderStyle: "single", borderLeft: true, borderColor: "gray", children: [_jsx(Text, { color: "cyan", dimColor: true, children: "\u2500 Response \u2500" }), StreamingResponseBox] })] })), layout === 'classic' && (_jsxs(_Fragment, { children: [_jsx(MessageHistory, { messages: messages, collapseSettings: collapseSettings }), ProcessingBox, StreamingResponseBox] })), layout === 'response-top' && (_jsxs(_Fragment, { children: [StreamingResponseBox, _jsx(MessageHistory, { messages: messages, collapseSettings: collapseSettings }), ProcessingBox] })), layout === 'response-bottom' && (_jsxs(_Fragment, { children: [_jsx(MessageHistory, { messages: messages, collapseSettings: collapseSettings }), ProcessingBox, StreamingResponseBox] })), layout === 'zen' && (_jsxs(_Fragment, { children: [_jsx(MessageHistory, { messages: messages.filter(m => m.type === 'user' || m.type === 'assistant'), collapseSettings: { collapseTools: true, collapseThinking: true, toolDisplayLimit: 0 } }), ProcessingBox, StreamingResponseBox] })), layout === 'focus' && (_jsxs(_Fragment, { children: [StreamingResponseBox, ProcessingBox, _jsx(MessageHistory, { messages: messages, collapseSettings: { collapseTools: true, collapseThinking: true, toolDisplayLimit: 3 } })] })), layout === 'dashboard' && (_jsxs(_Fragment, { children: [_jsxs(Text, { dimColor: true, children: ['  ', stats.inputTokens ? `tokens: ${stats.inputTokens}/${stats.outputTokens}` : '', stats.cost ? ` | cost: $${stats.cost.toFixed(4)}` : '', model ? ` | ${model}` : '', ` | ${getCurrentCompanion().name}`] }), StreamingResponseBox, ProcessingBox, _jsx(MessageHistory, { messages: messages, collapseSettings: collapseSettings })] })), layout === 'minimal' && (_jsxs(_Fragment, { children: [_jsx(MessageHistory, { messages: messages, collapseSettings: collapseSettings }), ProcessingBox, StreamingResponseBox] })), debugEnabled && (_jsx(Box, { marginY: 0, children: _jsxs(Text, { dimColor: true, children: ["[dbg] proc=", isProcessing ? 'Y' : 'N', " think=", thinkingState ? 'Y' : 'N', " stream=", streamingResponse.length, " mode=", mode, " queue=", queuedMessages.length, " activity=", activityState?.action || 'none'] }) })), modalMode === 'model' && availableModels.length > 0 && (_jsx(ModelSelector, { models: availableModels, onSelect: handleModelSelect, onCancel: handleModalCancel })), modalMode === 'sessions' && (_jsx(SessionSelector, { sessions: availableSessions, onSelect: (session) => {
+                        // Load history from selected session
+                        addMessage('system', `Loading session: ${session.projectName}...`);
+                        addMessage('system', `Session path: ${session.projectPath}\nTo load this session, run calliope from that directory.`);
+                        setModalMode('none');
+                    }, onDelete: (session) => {
+                        if (storage.deleteSession(session.id)) {
+                            addMessage('system', `🗑️ Deleted session: ${session.projectName}`);
+                            // Refresh the list
+                            setAvailableSessions(prev => prev.filter(s => s.id !== session.id));
+                        }
+                        else {
+                            addMessage('error', `Failed to delete session: ${session.projectName}`);
+                        }
+                    }, onCancel: handleModalCancel })), modalMode === 'upgrade' && latestVersion && (_jsx(UpgradePrompt, { currentVersion: getVersion(), latestVersion: latestVersion, onConfirm: handleUpgradeConfirm, onCancel: handleModalCancel })), modalMode === 'session-resume' && previousSession && (_jsx(SessionResumePrompt, { session: previousSession, onResume: () => {
+                        // Load chat history into context
+                        const history = storage.getChatHistory(20);
+                        if (history.length > 0) {
+                            for (const msg of history) {
+                                if (msg.role === 'user' || msg.role === 'assistant') {
+                                    llmMessages.current.push({
+                                        role: msg.role,
+                                        content: msg.content,
+                                    });
+                                }
+                            }
+                            addMessage('system', `✓ Resumed session with ${history.length} messages loaded`);
+                            setContextTokens(estimateContextTokens());
+                        }
+                        setModalMode('none');
+                        setPreviousSession(null);
+                    }, onNew: () => {
+                        addMessage('system', '✓ Starting fresh session');
+                        setModalMode('none');
+                        setPreviousSession(null);
+                    } })), modalMode === 'complexity-warning' && pendingComplexPrompt && (_jsx(ComplexityWarning, { reason: pendingComplexPrompt.complexity.reason || 'Complex operation detected', prompt: typeof pendingComplexPrompt.prompt === 'string' ? pendingComplexPrompt.prompt : undefined, onProceed: async () => {
+                        setModalMode('none');
+                        const prompt = pendingComplexPrompt.prompt;
+                        setPendingComplexPrompt(null);
+                        // Proceed with execution
+                        saveUndoState();
+                        addMessage('user', typeof prompt === 'string' ? prompt : JSON.stringify(prompt));
+                        setIsProcessing(true);
+                        try {
+                            await runAgent(prompt);
+                        }
+                        finally {
+                            setIsProcessing(false);
+                        }
+                    }, onPlan: () => {
+                        setModalMode('none');
+                        const prompt = pendingComplexPrompt.prompt;
+                        setPendingComplexPrompt(null);
+                        // Switch to plan mode and proceed
+                        setMode('plan');
+                        addMessage('system', '📋 Switched to Plan mode - I\'ll describe what I would do without executing.');
+                        saveUndoState();
+                        addMessage('user', typeof prompt === 'string' ? prompt : JSON.stringify(prompt));
+                        setIsProcessing(true);
+                        runAgent(prompt).finally(() => setIsProcessing(false));
+                    }, onCancel: () => {
+                        setModalMode('none');
+                        setPendingComplexPrompt(null);
+                        addMessage('system', 'Operation cancelled.');
+                    } })), modalMode === 'keys' && (_jsx(KeybindingsModal, { onClose: () => setModalMode('none') })), modalMode === 'theme-picker' && (_jsx(ThemePicker, { currentLayout: layout, currentSkin: getCurrentSkin().name, currentPalette: getCurrentPalette().name, currentCompanion: getCurrentCompanion().name, onApply: (selection) => {
+                        // Apply all selections
+                        setLayout(selection.layout);
+                        config.set('layout', selection.layout);
+                        applySkin(selection.skin);
+                        config.set('activeSkin', selection.skin);
+                        applyPalette(selection.palette);
+                        config.set('activePalette', selection.palette);
+                        applyCompanion(selection.companion);
+                        config.set('activeCompanion', selection.companion);
+                        const changes = [];
+                        if (selection.layout !== layout)
+                            changes.push(`layout=${selection.layout}`);
+                        if (selection.skin !== getCurrentSkin().name)
+                            changes.push(`skin=${selection.skin}`);
+                        if (selection.palette !== getCurrentPalette().name)
+                            changes.push(`palette=${selection.palette}`);
+                        if (selection.companion !== getCurrentCompanion().name)
+                            changes.push(`companion=${selection.companion}`);
+                        addMessage('system', changes.length > 0
+                            ? `Theme applied: ${changes.join(', ')}`
+                            : 'Theme unchanged.');
+                        setModalMode('none');
+                    }, onCancel: () => setModalMode('none') })), modalMode === 'pack-picker' && (_jsx(PackPicker, { onApply: async (packName) => {
+                        setModalMode('none');
+                        // Run transition animation if defined
+                        const targetPack = getThemePack(packName);
+                        if (targetPack?.skin.splash?.transition) {
+                            await renderTransition(targetPack.skin.splash.transition);
+                        }
+                        const success = applyThemePack(packName, getCompanionMode());
+                        if (success) {
+                            const pack = getCurrentPack();
+                            config.set('activeThemePack', packName);
+                            config.set('activeSkin', pack.skin.name);
+                            config.set('activePalette', pack.palette.name);
+                            const companion = getCompanionMode() === 'professional'
+                                ? pack.companions.professional
+                                : pack.companions.immersive;
+                            config.set('activeCompanion', companion.name);
+                            addMessage('system', `Theme pack: ${packName}\n` +
+                                `  Skin: ${pack.skin.name}, Palette: ${pack.palette.name}, Companion: ${companion.name}\n` +
+                                `  "${companion.greeting}"`);
+                        }
+                    }, onCancel: () => setModalMode('none') })), _jsx(ChatInput, { value: input, onChange: handleInputChange, onSubmit: handleSubmit, onEscape: handleEscape, onCycleMode: cycleMode, disabled: isModalActive, isProcessing: isProcessing, queuedCount: queuedMessages.length, queuedMessages: queuedMessages, editingQueueIndex: editingQueueIndex, onQueueMessage: (msg) => {
+                        setQueuedMessages(prev => [...prev, msg]);
+                        addMessage('system', `📨 Queued: "${msg.substring(0, 50)}${msg.length > 50 ? '...' : ''}"`);
+                    }, onEditQueuedMessage: handleEditQueuedMessage, onSetEditingQueueIndex: setEditingQueueIndex, onDirectSend: handleDirectSend, cwd: process.cwd(), suggestions: suggestions, onSuggestionsChange: setSuggestions, onNavigateHistory: navigateHistory, 
+                    // Smart suggestions context
+                    currentMode: mode, contextPercentage: Math.round((contextTokens / getModelContextLimit(actualProvider, actualModel)) * 100), recentCommands: recentCommands, hasGitRepo: hasGitRepo }), _jsx(StatusBar, { provider: actualProvider, model: actualModel, mode: mode, stats: stats, contextTokens: contextTokens, breakerHealth: config.get('circuitBreakersEnabled') !== false ? breakerHealth : undefined, smartRouteActive: smartRouteActive, width: width })] }) }));
+}
+// ============================================================================
+// App Wrapper & Entry Point
+// ============================================================================
+function App() {
+    const [resetKey, setResetKey] = React.useState(0);
+    const handleReset = React.useCallback(() => {
+        setResetKey(k => k + 1);
+    }, []);
+    return (_jsx(ErrorBoundary, { onReset: handleReset, children: _jsx(TerminalChat, {}, resetKey) }));
+}
+// Print banner before Ink takes over (stays fixed at top)
+export async function printBanner() {
+    const provider = selectProvider(config.get('defaultProvider'));
+    const model = config.get('defaultModel') || DEFAULT_MODELS[provider];
+    const skin = getCurrentSkin();
+    const dim = '\x1b[2m';
+    const reset = '\x1b[0m';
+    // Run theme transition on startup if configured
+    if (skin.splash?.transition && skin.splash.transition.effect !== 'none') {
+        await renderTransition(skin.splash.transition);
+    }
+    if (skin.banner.style === 'none') {
+        // No banner
+    }
+    else if (skin.splash?.coloredArt && skin.splash.coloredArt.length > 0) {
+        // Rich colored banner from splash config
+        console.log();
+        if (skin.splash.entryAnimation && skin.splash.entryAnimation !== 'none') {
+            // Animated splash
+            const coloredLines = skin.splash.coloredArt.map(l => colorFg(l.text, l.color));
+            await renderSplashAnimation(coloredLines, skin.splash.entryAnimation, skin.splash.animationSpeed ?? 50);
+        }
+        else {
+            // Static colored banner
+            const banner = renderColoredBanner(skin.splash.coloredArt, skin.banner.tagline);
+            console.log(banner);
+        }
+        console.log();
+        if (skin.banner.tagline && skin.splash.entryAnimation) {
+            console.log(`${dim}        ${skin.banner.tagline}${reset}`);
+            console.log();
+        }
+    }
+    else {
+        // Standard banner (existing behavior)
+        console.log();
+        for (const line of skin.banner.art) {
+            if (line.includes('\x1b[')) {
+                console.log(line);
+            }
+            else {
+                console.log(paletteColorize(line, 'primary'));
+            }
+        }
+        console.log();
+        if (skin.banner.tagline) {
+            console.log(`${dim}        ${skin.banner.tagline}${reset}`);
+            console.log();
+        }
+    }
+    const companion = getCurrentCompanion();
+    console.log(`${dim}  v${getVersion()} | ${provider}:${model}${reset}`);
+    console.log(`${dim}  /help for commands | ESC to exit${reset}`);
+    if (companion.greeting) {
+        console.log(`${dim}  ${companion.greeting}${reset}`);
+    }
+    console.log();
+}
+export async function startInkCLI(options = {}) {
+    // Set module-level agterm state
+    moduleAgtermEnabled = options.agtermEnabled ?? false;
+    // Print banner BEFORE Ink starts - it stays fixed at the top
+    await printBanner();
+    const { waitUntilExit } = render(_jsx(App, {}), {
+        patchConsole: true, // Prevent console.log during session from mixing with Ink
+    });
+    await waitUntilExit();
+    // Session cleanup
+    recording.stopRecording();
+    sessionTimeout.clearTimers();
+    idleEviction.stopMonitor();
+}
+//# sourceMappingURL=index.js.map