maistro 1.0.390

package/dist/ui.js

@@ -0,0 +1,1531 @@
+import { createInterface } from 'node:readline';
+import { EventEmitter } from 'node:events';
+export class InteractiveUI extends EventEmitter {
+    rl = null;
+    isRawMode = false;
+    // Injectable streams for testing
+    _stdin;
+    _stdout;
+    constructor(stdin, stdout) {
+        super();
+        this._stdin = stdin || process.stdin;
+        this._stdout = stdout || process.stdout;
+    }
+    /**
+     * Get the stdin stream (for testing access)
+     */
+    get stdin() {
+        return this._stdin;
+    }
+    /**
+     * Get the stdout stream (for testing access)
+     */
+    get stdout() {
+        return this._stdout;
+    }
+    /**
+     * Initialize the UI
+     */
+    init() {
+        this.rl = createInterface({
+            input: process.stdin,
+            output: process.stdout,
+        });
+        // Note: Don't handle 'close' event here as it can be triggered unexpectedly
+        // during raw mode operations. The app manages its own lifecycle.
+    }
+    /**
+     * Enable raw mode for key-by-key input
+     */
+    enableRawMode() {
+        if (this._stdin.isTTY) {
+            this._stdin.setRawMode?.(true);
+            this._stdin.resume?.(); // Always resume stdin (might have been paused externally)
+            this.isRawMode = true;
+        }
+    }
+    /**
+     * Disable raw mode
+     */
+    disableRawMode() {
+        if (this._stdin.isTTY && this.isRawMode) {
+            this._stdin.setRawMode?.(false);
+            this.isRawMode = false;
+        }
+    }
+    /**
+     * Clear the screen and scrollback buffer
+     */
+    clear() {
+        this._stdout.write('\x1b[2J\x1b[3J\x1b[H');
+    }
+    /**
+     * Move cursor up N lines
+     */
+    cursorUp(n) {
+        this._stdout.write(`\x1b[${n}A`);
+    }
+    /**
+     * Clear from cursor to end of screen
+     */
+    clearToEnd() {
+        this._stdout.write('\x1b[J');
+    }
+    /**
+     * Print styled text
+     */
+    print(text) {
+        console.log(text);
+    }
+    /**
+     * Print with color
+     */
+    printColored(text, color) {
+        const colors = {
+            green: '\x1b[32m',
+            yellow: '\x1b[33m',
+            red: '\x1b[31m',
+            cyan: '\x1b[36m',
+            gray: '\x1b[90m',
+            bold: '\x1b[1m',
+        };
+        const reset = '\x1b[0m';
+        console.log(`${colors[color]}${text}${reset}`);
+    }
+    /**
+     * Show a quick-pick menu with command input support
+     * @param items Menu items to display
+     * @param prompt Header text for the menu
+     * @param commandParser Optional callback for custom command parsing
+     * @param options Additional options
+     * @param options.showInput Whether to show the text input field (default: true if commandParser provided, false otherwise)
+     */
+    async quickPick(items, prompt = 'Select an action', commandParser, options) {
+        return new Promise((resolve) => {
+            let selectedIndex = 0;
+            let inputBuffer = '';
+            let isTypingCommand = false;
+            let isFirstRender = true;
+            let escTimeout = null;
+            let lastLineCount = 0;
+            // Determine if we should show the input bar
+            // Default: show if commandParser is provided (custom input possible), hide otherwise
+            const showInput = options?.showInput ?? !!commandParser;
+            const render = (showEscHint = false) => {
+                if (isFirstRender) {
+                    isFirstRender = false;
+                }
+                else {
+                    // Move cursor up to the start of our previous output
+                    // When we write N lines with join('\n'), cursor ends on line N-1 (0-indexed)
+                    // So to get back to line 0, we move up (N-1) lines
+                    if (lastLineCount > 1) {
+                        this._stdout.write(`\x1b[${lastLineCount - 1}A`); // Move up
+                    }
+                    this._stdout.write('\x1b[G'); // Move to column 1
+                    this._stdout.write('\x1b[J'); // Clear from cursor to end
+                }
+                const lines = [];
+                lines.push(`\x1b[1m${prompt}\x1b[0m`);
+                lines.push('');
+                items.forEach((item, index) => {
+                    const prefix = index === selectedIndex ? '\x1b[36m❯\x1b[0m' : ' ';
+                    const label = index === selectedIndex ? `\x1b[1m${item.label}\x1b[0m` : item.label;
+                    const desc = item.description ? `  \x1b[90m${item.description}\x1b[0m` : '';
+                    lines.push(`${prefix} \x1b[33m${item.key}\x1b[0m  ${label}${desc}`);
+                });
+                lines.push('');
+                const termWidth = this._stdout.columns || 80;
+                if (showInput) {
+                    // Show command input line in Claude Code style
+                    const hint = '↵ send';
+                    lines.push(`\x1b[90m${'─'.repeat(termWidth)}\x1b[0m`);
+                    if (isTypingCommand) {
+                        lines.push(`\x1b[90m>\x1b[0m ${inputBuffer}\x1b[7m \x1b[0m`);
+                    }
+                    else {
+                        const placeholder = 'type command...';
+                        lines.push(`\x1b[90m> \x1b[0m\x1b[7m \x1b[0m\x1b[90m${placeholder}\x1b[0m`);
+                    }
+                    lines.push(`\x1b[90m${'─'.repeat(termWidth)}\x1b[0m`);
+                    // Hint outside the lines (right-aligned)
+                    const hintPadding = termWidth - hint.length;
+                    lines.push(`${' '.repeat(hintPadding)}\x1b[90m${hint}\x1b[0m`);
+                    // Show escape hint if pending clear
+                    if (showEscHint) {
+                        lines.push(`\x1b[90mEsc to clear again\x1b[0m`);
+                    }
+                }
+                else {
+                    // Simplified hint for navigation-only mode (right-aligned)
+                    const hint = '↑↓ navigate · ↵ select';
+                    const hintPadding = Math.max(0, termWidth - hint.length);
+                    lines.push(`${' '.repeat(hintPadding)}\x1b[90m${hint}\x1b[0m`);
+                }
+                // Print all lines and track count for next clear
+                this._stdout.write(lines.join('\n'));
+                lastLineCount = lines.length;
+            };
+            // Render final state showing the selected option before exiting
+            const renderFinal = (selectedKey) => {
+                // Move cursor up to the start of our previous output
+                // When we wrote N lines with join('\n'), cursor is on line N-1, so move up N-1
+                if (lastLineCount > 1) {
+                    this._stdout.write(`\x1b[${lastLineCount - 1}A`); // Move up
+                }
+                if (lastLineCount > 0) {
+                    this._stdout.write('\x1b[G'); // Move to column 1
+                }
+                this._stdout.write('\x1b[J'); // Clear from cursor to end
+                const lines = [];
+                lines.push(`\x1b[1m${prompt}\x1b[0m`);
+                lines.push('');
+                items.forEach((item, index) => {
+                    const isSelected = item.key === selectedKey;
+                    const prefix = isSelected ? '\x1b[36m❯\x1b[0m' : ' ';
+                    const label = isSelected ? `\x1b[1m${item.label}\x1b[0m` : item.label;
+                    const desc = item.description ? `  \x1b[90m${item.description}\x1b[0m` : '';
+                    lines.push(`${prefix} \x1b[33m${item.key}\x1b[0m  ${label}${desc}`);
+                });
+                lines.push('');
+                const termWidth = this._stdout.columns || 80;
+                if (showInput) {
+                    lines.push(`\x1b[90m${'─'.repeat(termWidth)}\x1b[0m`);
+                    // Show the selected key in the input bar
+                    const hint = '↵ send';
+                    const contentWidth = termWidth - 4;
+                    const padding = Math.max(0, contentWidth - selectedKey.length - hint.length - 3);
+                    lines.push(`\x1b[90m❯\x1b[0m ${selectedKey}${' '.repeat(padding + 1)}\x1b[90m${hint}\x1b[0m`);
+                    lines.push(`\x1b[90m${'─'.repeat(termWidth)}\x1b[0m`);
+                }
+                // When showInput is false, just show the selected item without input bar
+                this._stdout.write(lines.join('\n') + '\n');
+            };
+            // Initial render
+            render();
+            this.enableRawMode();
+            const handleKey = (key) => {
+                const char = key.toString();
+                // Escape - select cancel/no option
+                if (char === '\x1b' && !char.startsWith('\x1b[')) {
+                    // Look for a cancel-like item (key 'n' or label 'No', 'Cancel', 'Exit', etc.)
+                    const cancelItem = items.find(item => {
+                        const lowerKey = item.key.toLowerCase();
+                        const lowerLabel = item.label.toLowerCase();
+                        return lowerKey === 'n' || lowerLabel === 'no' || lowerLabel === 'cancel' || lowerLabel === 'exit';
+                    });
+                    if (cancelItem) {
+                        renderFinal(cancelItem.key);
+                        cleanup();
+                        resolve(cancelItem.key);
+                        return;
+                    }
+                    // No cancel item found, resolve with null
+                    cleanup();
+                    resolve(null);
+                    return;
+                }
+                // Ctrl+C
+                if (char === '\x03') {
+                    cleanup();
+                    resolve(null);
+                    return;
+                }
+                // Colon starts command input mode (only if input is shown)
+                if (char === ':' && !isTypingCommand && showInput) {
+                    isTypingCommand = true;
+                    inputBuffer = '';
+                    render();
+                    return;
+                }
+                // If typing command (only possible when showInput is true)
+                if (isTypingCommand && showInput) {
+                    // Backspace
+                    if (char === '\x7f' || char === '\b') {
+                        if (inputBuffer.length > 0) {
+                            inputBuffer = inputBuffer.slice(0, -1);
+                        }
+                        else {
+                            isTypingCommand = false;
+                        }
+                        render();
+                        return;
+                    }
+                    // Enter - execute command
+                    if (char === '\r' || char === '\n') {
+                        if (inputBuffer) {
+                            // First check if commandParser handles it
+                            if (commandParser) {
+                                const cmd = commandParser(inputBuffer);
+                                if (cmd) {
+                                    renderFinal(inputBuffer);
+                                    cleanup();
+                                    resolve(cmd);
+                                    return;
+                                }
+                            }
+                            // Check if input matches any menu item (key or label, case-insensitive)
+                            const lowerInput = inputBuffer.toLowerCase();
+                            const matchedItem = items.find(item => item.key.toLowerCase() === lowerInput ||
+                                item.label.toLowerCase() === lowerInput);
+                            if (matchedItem) {
+                                renderFinal(matchedItem.key);
+                                cleanup();
+                                resolve(matchedItem.key);
+                                return;
+                            }
+                        }
+                        // Invalid command, clear
+                        inputBuffer = '';
+                        isTypingCommand = false;
+                        render();
+                        return;
+                    }
+                    // Add character to buffer
+                    if (char.length === 1 && char >= ' ') {
+                        inputBuffer += char;
+                        render();
+                    }
+                    return;
+                }
+                // Enter - select current item
+                if (char === '\r' || char === '\n') {
+                    renderFinal(items[selectedIndex].key);
+                    cleanup();
+                    resolve(items[selectedIndex].key);
+                    return;
+                }
+                // Arrow up (also handle Shift+Up to prevent history interference)
+                if (char === '\x1b[A' || char === '\x1b[1;2A') {
+                    selectedIndex = (selectedIndex - 1 + items.length) % items.length;
+                    render();
+                    return;
+                }
+                // Arrow down (also handle Shift+Down to prevent history interference)
+                if (char === '\x1b[B' || char === '\x1b[1;2B') {
+                    selectedIndex = (selectedIndex + 1) % items.length;
+                    render();
+                    return;
+                }
+                // Ignore backspace when not typing (nothing to delete)
+                if (char === '\x7f' || char === '\b') {
+                    return;
+                }
+                // Any printable character starts typing (only if input is shown)
+                if (showInput && char.length === 1 && char >= ' ' && char < '\x7f') {
+                    isTypingCommand = true;
+                    inputBuffer = char;
+                    render();
+                }
+            };
+            const cleanup = () => {
+                if (escTimeout)
+                    clearTimeout(escTimeout);
+                this._stdin.removeListener('data', handleKey);
+                this.disableRawMode();
+            };
+            this._stdin.on('data', handleKey);
+        });
+    }
+    /**
+     * Prompt for text input
+     */
+    async prompt(question) {
+        return new Promise((resolve) => {
+            this.disableRawMode();
+            this.rl?.question(question, (answer) => {
+                resolve(answer.trim());
+            });
+        });
+    }
+    /**
+     * Prompt for text input with Escape support
+     * Returns null if Escape is pressed
+     * @param prefix - The prompt prefix to display
+     * @param placeholder - Optional placeholder text shown when input is empty (displayed in gray)
+     */
+    async promptWithEscape(prefix, placeholder) {
+        return new Promise((resolve) => {
+            let inputBuffer = '';
+            let resolved = false;
+            let cursorIndex = 0; // Position within inputBuffer
+            let isFirstRender = true;
+            let lastTargetRow = 0; // Track cursor row (editing position) at end of last render
+            let lastLineCount = 1; // Track line count from last render for scroll compensation
+            // Calculate visible length of prefix (strip ANSI codes)
+            const visiblePrefixLength = prefix.replace(/\x1b\[[0-9;]*m/g, '').length;
+            // Render the current input state with cursor at correct position
+            const render = () => {
+                // Prefer COLUMNS env var (set by PTY/expect), then stdout.columns, then default
+                const termWidth = parseInt(process.env.COLUMNS || '', 10) || this._stdout.columns || 80;
+                const totalContentLength = visiblePrefixLength + inputBuffer.length;
+                // Calculate how many lines content will take
+                const lineCount = totalContentLength === 0 ? 1 : Math.ceil(totalContentLength / termWidth);
+                // Calculate cursor position for desired cursorIndex
+                const cursorPos = visiblePrefixLength + cursorIndex;
+                const targetRow = Math.floor(cursorPos / termWidth);
+                const targetCol = cursorPos % termWidth;
+                // After writing content, cursor ends up at the position AFTER the last character
+                // If content exactly fills the line (totalContentLength % termWidth == 0), cursor wraps to next line
+                // This is CRITICAL: if we don't account for the wrap, we'll move up by wrong amount
+                // and fail to clear previous content, causing duplication
+                const cursorWrapped = totalContentLength > 0 && totalContentLength % termWidth === 0;
+                const cursorRowAfterWrite = cursorWrapped ? lineCount : lineCount - 1;
+                if (isFirstRender) {
+                    isFirstRender = false;
+                    // Hide cursor, go to col 0, clear line and below
+                    this._stdout.write('\x1b[?25l\r\x1b[2K\x1b[J');
+                }
+                else {
+                    // Move up to the START of content area and then clear.
+                    //
+                    // BUG FIX: When content wraps and terminal scrolls, old content shifts up
+                    // but cursor stays at the bottom. We need to clear more rows to account
+                    // for the shifted content.
+                    //
+                    // Using max(lastTargetRow, lastLineCount - 1) ensures:
+                    // 1. We clear all content rows when cursor is at an earlier row (e.g., after backspace)
+                    // 2. We account for scroll shifts when cursor was at or past the last line
+                    //
+                    // lastLineCount - 1 = the max row index of previous content (0-indexed)
+                    // lastTargetRow = where cursor was positioned (content row index)
+                    const rowsToMoveUp = Math.max(lastTargetRow, lastLineCount);
+                    this._stdout.write('\x1b[?25l'); // Hide cursor
+                    if (rowsToMoveUp > 0) {
+                        this._stdout.write(`\x1b[${rowsToMoveUp}A`);
+                    }
+                    // Clear from cursor to end of screen
+                    this._stdout.write('\r\x1b[2K\x1b[J');
+                }
+                // Write new content (show placeholder in gray if input is empty)
+                if (inputBuffer.length === 0 && placeholder) {
+                    this._stdout.write(`${prefix}\x1b[90m${placeholder}\x1b[0m`);
+                }
+                else {
+                    this._stdout.write(`${prefix}${inputBuffer}`);
+                }
+                // Position cursor at targetRow, targetCol for editing
+                // IMPORTANT: Some terminals have "pending wrap" behavior where cursor doesn't actually
+                // wrap when content exactly fills a line. To handle this reliably:
+                // 1. Move cursor to row 0 first (move up by cursorRowAfterWrite)
+                // 2. Then move down to targetRow
+                // This ensures we end up at the right position regardless of pending wrap state
+                if (cursorRowAfterWrite > 0) {
+                    this._stdout.write(`\x1b[${cursorRowAfterWrite}A`);
+                }
+                this._stdout.write('\r'); // Now at row 0, col 0
+                if (targetRow > 0) {
+                    this._stdout.write(`\x1b[${targetRow}B`); // Move down to targetRow
+                }
+                if (targetCol > 0) {
+                    this._stdout.write(`\x1b[${targetCol}C`);
+                }
+                this._stdout.write('\x1b[?25h'); // Show cursor at edit position
+                // Track cursor position and line count for next render
+                lastTargetRow = targetRow;
+                lastLineCount = lineCount;
+            };
+            let escapeTimeout = null;
+            let escapeBuffer = '';
+            const cleanup = () => {
+                if (resolved)
+                    return;
+                resolved = true;
+                if (escapeTimeout) {
+                    clearTimeout(escapeTimeout);
+                    escapeTimeout = null;
+                }
+                this._stdin.removeListener('data', handleKey);
+                this.disableRawMode();
+                this._stdout.write('\n');
+            };
+            const handleKey = (key) => {
+                if (resolved)
+                    return;
+                let char = key.toString();
+                // Handle escape sequence buffering
+                // If we have a pending escape, combine with new input
+                if (escapeBuffer) {
+                    char = escapeBuffer + char;
+                    escapeBuffer = '';
+                    if (escapeTimeout) {
+                        clearTimeout(escapeTimeout);
+                        escapeTimeout = null;
+                    }
+                }
+                // If this is just escape, wait briefly for more input (could be start of sequence)
+                if (char === '\x1b') {
+                    escapeBuffer = char;
+                    escapeTimeout = setTimeout(() => {
+                        // Bare escape - cancel input
+                        escapeBuffer = '';
+                        cleanup();
+                        resolve(null);
+                    }, 50);
+                    return;
+                }
+                // Ctrl+C
+                if (char === '\x03') {
+                    cleanup();
+                    resolve(null);
+                    return;
+                }
+                // Enter - submit
+                if (char === '\r' || char === '\n') {
+                    cleanup();
+                    resolve(inputBuffer.trim());
+                    return;
+                }
+                // Left arrow
+                if (char === '\x1b[D') {
+                    if (cursorIndex > 0) {
+                        cursorIndex--;
+                        render();
+                    }
+                    return;
+                }
+                // Right arrow
+                if (char === '\x1b[C') {
+                    if (cursorIndex < inputBuffer.length) {
+                        cursorIndex++;
+                        render();
+                    }
+                    return;
+                }
+                // Home key (various terminal sequences) or Ctrl+A - go to start
+                if (char === '\x1b[H' || char === '\x1b[1~' || char === '\x1bOH' || char === '\x01' || char === '\x1b[1;2H') {
+                    cursorIndex = 0;
+                    render();
+                    return;
+                }
+                // End key (various terminal sequences) or Ctrl+E - go to end
+                if (char === '\x1b[F' || char === '\x1b[4~' || char === '\x1bOF' || char === '\x05' || char === '\x1b[1;2F') {
+                    cursorIndex = inputBuffer.length;
+                    render();
+                    return;
+                }
+                // Backspace - delete char before cursor
+                if (char === '\x7f' || char === '\b') {
+                    if (cursorIndex > 0) {
+                        inputBuffer = inputBuffer.slice(0, cursorIndex - 1) + inputBuffer.slice(cursorIndex);
+                        cursorIndex--;
+                        render();
+                    }
+                    return;
+                }
+                // Delete key - delete char at cursor
+                if (char === '\x1b[3~') {
+                    if (cursorIndex < inputBuffer.length) {
+                        inputBuffer = inputBuffer.slice(0, cursorIndex) + inputBuffer.slice(cursorIndex + 1);
+                        render();
+                    }
+                    return;
+                }
+                // Up arrow - move cursor up one visual row (by terminal width)
+                if (char === '\x1b[A') {
+                    // Use same termWidth calculation as render() for consistency
+                    const termWidth = parseInt(process.env.COLUMNS || '', 10) || this._stdout.columns || 80;
+                    const cursorPos = visiblePrefixLength + cursorIndex;
+                    // Can only move up if we're not on the first row
+                    if (cursorPos >= termWidth) {
+                        // Move up by terminal width, but don't go before input start
+                        const newCursorPos = cursorPos - termWidth;
+                        cursorIndex = Math.max(0, newCursorPos - visiblePrefixLength);
+                        render();
+                    }
+                    return;
+                }
+                // Down arrow - move cursor down one visual row (by terminal width)
+                if (char === '\x1b[B') {
+                    // Use same termWidth calculation as render() for consistency
+                    const termWidth = parseInt(process.env.COLUMNS || '', 10) || this._stdout.columns || 80;
+                    const cursorPos = visiblePrefixLength + cursorIndex;
+                    const totalLen = visiblePrefixLength + inputBuffer.length;
+                    const maxRow = Math.floor((totalLen - 1) / termWidth);
+                    const currentRow = Math.floor(cursorPos / termWidth);
+                    // Can only move down if we're not on the last row
+                    if (currentRow < maxRow) {
+                        // Move down by terminal width, but don't go past input end
+                        const newCursorPos = Math.min(cursorPos + termWidth, totalLen);
+                        cursorIndex = Math.min(inputBuffer.length, newCursorPos - visiblePrefixLength);
+                        render();
+                    }
+                    return;
+                }
+                // Ignore other escape sequences
+                if (char.startsWith('\x1b[') || char.startsWith('\x1bO')) {
+                    return;
+                }
+                // Regular printable characters - insert at cursor position
+                // Handle both single chars and multi-char paste operations
+                let charsToInsert = '';
+                for (const c of char) {
+                    // Accept printable ASCII and extended characters (for pastes with special chars)
+                    if (c >= ' ' && c !== '\x7f') {
+                        charsToInsert += c;
+                    }
+                    // Convert newlines to spaces to keep input on single line
+                    if (c === '\n' || c === '\r') {
+                        charsToInsert += ' ';
+                    }
+                }
+                if (charsToInsert.length > 0) {
+                    inputBuffer = inputBuffer.slice(0, cursorIndex) + charsToInsert + inputBuffer.slice(cursorIndex);
+                    cursorIndex += charsToInsert.length;
+                    render();
+                }
+            };
+            // Enable raw mode (like quickPick does)
+            this.enableRawMode();
+            // Set up the data listener
+            this._stdin.on('data', handleKey);
+            // Initial render
+            render();
+        });
+    }
+    /**
+     * Listen for escape key during execution
+     */
+    onEscape(callback) {
+        this.enableRawMode();
+        this._stdin.resume?.();
+        const handleKey = (key) => {
+            const char = key.toString();
+            // Escape or Ctrl+C
+            if (char === '\x1b' || char === '\x03') {
+                callback();
+            }
+        };
+        this._stdin.on('data', handleKey);
+        return () => {
+            this._stdin.removeListener('data', handleKey);
+            this.disableRawMode();
+        };
+    }
+    /**
+     * Show a spinner during async operation
+     */
+    spinner(message) {
+        const frames = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
+        let i = 0;
+        let stopped = false;
+        const interval = setInterval(() => {
+            if (stopped)
+                return;
+            process.stdout.write(`\r\x1b[36m${frames[i]}\x1b[0m ${message}`);
+            i = (i + 1) % frames.length;
+        }, 80);
+        return {
+            stop: (finalMessage) => {
+                stopped = true;
+                clearInterval(interval);
+                process.stdout.write('\r\x1b[K'); // Clear line
+                if (finalMessage) {
+                    console.log(finalMessage);
+                }
+            },
+        };
+    }
+    /**
+     * Wait for any key press
+     */
+    async waitForKey(message = 'Press any key to continue...') {
+        return new Promise((resolve) => {
+            console.log(`\x1b[90m${message}\x1b[0m`);
+            this.enableRawMode();
+            const handleKey = (key) => {
+                this._stdin.removeListener('data', handleKey);
+                this.disableRawMode();
+                resolve();
+            };
+            this._stdin.on('data', handleKey);
+        });
+    }
+    /**
+     * Close the UI
+     */
+    close() {
+        this.disableRawMode();
+        this.rl?.close();
+    }
+}
+/**
+ * Format task status with symbol.
+ * For failed/skipped tasks, optionally accepts failureType to show different symbols:
+ * - execution failure: red (code was never written)
+ * - acceptance failure: yellow/orange (code written but validation failed)
+ */
+/**
+ * Get the status icon only (for task lists where name is shown separately)
+ */
+export function formatTaskStatusIcon(status, failureType) {
+    if (status === 'failed') {
+        if (failureType === 'acceptance') {
+            return '\x1b[33m⚠\x1b[0m'; // Yellow warning - validation failed
+        }
+        return '\x1b[31m✗\x1b[0m'; // Red X - execution failed
+    }
+    if (status === 'skipped') {
+        if (failureType === 'acceptance') {
+            return '\x1b[33m◌\x1b[0m'; // Yellow empty - skipped after validation fail
+        }
+        if (failureType === 'execution') {
+            return '\x1b[31m◌\x1b[0m'; // Red empty - skipped after execution fail
+        }
+        return '\x1b[90m◌\x1b[0m'; // Gray empty - manually skipped
+    }
+    const symbols = {
+        pending: '\x1b[33m○\x1b[0m',
+        in_progress: '\x1b[36m◐\x1b[0m',
+        completed: '\x1b[32m●\x1b[0m',
+    };
+    return symbols[status] || '○';
+}
+/**
+ * Get the human-readable status name with color
+ */
+export function formatStatusName(status, failureType) {
+    if (status === 'failed') {
+        if (failureType === 'acceptance') {
+            return '\x1b[33mFailed\x1b[0m';
+        }
+        return '\x1b[31mFailed\x1b[0m';
+    }
+    if (status === 'skipped') {
+        if (failureType === 'acceptance') {
+            return '\x1b[33mSkipped\x1b[0m';
+        }
+        if (failureType === 'execution') {
+            return '\x1b[31mSkipped\x1b[0m';
+        }
+        return '\x1b[90mSkipped\x1b[0m';
+    }
+    const names = {
+        pending: '\x1b[33mPending\x1b[0m',
+        in_progress: '\x1b[36mIn Progress\x1b[0m',
+        completed: '\x1b[32mCompleted\x1b[0m',
+    };
+    return names[status] || status;
+}
+/**
+ * Format task status with icon and name (for status detail views)
+ */
+export function formatTaskStatus(status, failureType) {
+    return `${formatTaskStatusIcon(status, failureType)} ${formatStatusName(status, failureType)}`;
+}
+/**
+ * Format blocked task status symbol
+ */
+export function formatBlockedStatus() {
+    return '\x1b[31m⊘\x1b[0m'; // Red blocked symbol
+}
+/**
+ * Format progress bar with optional skipped tasks display
+ * @param completed Number of completed tasks
+ * @param total Total number of tasks
+ * @param width Width of the progress bar
+ * @param skipped Number of skipped tasks (shown in yellow)
+ */
+export function progressBar(completed, total, width = 20, skipped = 0) {
+    // Show completed (green) + skipped (yellow) + remaining (gray)
+    const completedPercent = total > 0 ? completed / total : 0;
+    const skippedPercent = total > 0 ? skipped / total : 0;
+    const filledCompleted = Math.round(width * completedPercent);
+    const filledSkipped = Math.round(width * skippedPercent);
+    const empty = width - filledCompleted - filledSkipped;
+    const bar = '\x1b[32m' + '█'.repeat(filledCompleted) +
+        '\x1b[33m' + '▓'.repeat(filledSkipped) +
+        '\x1b[90m' + '░'.repeat(Math.max(0, empty)) + '\x1b[0m';
+    // Show counts: completed/total or completed+skipped/total if skipped > 0
+    const countStr = skipped > 0
+        ? `${completed}+${skipped}/${total}`
+        : `${completed}/${total}`;
+    return `${bar} ${countStr}`;
+}
+/**
+ * Animated progress display for task execution with output streaming and input bar
+ */
+export class ProgressDisplay {
+    interval = null;
+    startTime = 0;
+    taskStartTime = 0;
+    spinnerFrames = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
+    frameIndex = 0;
+    lineCount = 0;
+    maxLineCount = 0; // Track max lines ever rendered for safer clearing
+    isFirstRender = true;
+    // Indeterminate progress animation (Knight Rider style)
+    bouncePos = 0;
+    bounceDir = 1;
+    bounceWidth = 6; // Width of the moving segment
+    // Current state
+    currentTask = '';
+    currentTaskId = '';
+    currentTaskIndex = 0;
+    totalTasks = 0;
+    completedTasks = 0;
+    skippedTasks = 0;
+    phase = 'executing';
+    isRunning = false;
+    // Duration tracking
+    completedDurationMs = 0; // Sum of all completed task durations
+    // Output streaming
+    lastOutputLines = [];
+    maxOutputLines = 10; // Show more Claude Code output
+    // Input bar
+    inputBuffer = '';
+    inputCursorIndex = 0;
+    onInputCallback = null;
+    keyHandler = null;
+    resizeHandler = null;
+    // Double-escape confirmation state
+    escPendingPause = false;
+    escTimeout = null;
+    // Concurrent planning mode state
+    planningMode = false;
+    planningTasks = [];
+    planningSelectedIndex = 0;
+    planModificationCallback = null;
+    planningMessage = ''; // Feedback message for planning actions
+    // Header renderer callback (called on each render to show header above progress)
+    headerRenderer = null;
+    /**
+     * Set a header renderer callback that will be called on each render
+     * @param renderer Function that writes header content to stdout
+     */
+    setHeaderRenderer(renderer) {
+        this.headerRenderer = renderer;
+    }
+    /**
+     * Start the animated display
+     * @param totalTasks Total number of tasks
+     * @param onInput Callback for user input
+     * @param initialCompletedDurationMs Duration of already-completed tasks (from previous runs)
+     * @param initialSkippedTasks Number of already-skipped tasks
+     * @param planModification Optional callbacks for concurrent plan modification
+     */
+    start(totalTasks, onInput, initialCompletedDurationMs = 0, initialSkippedTasks = 0, planModification) {
+        this.totalTasks = totalTasks;
+        this.skippedTasks = initialSkippedTasks;
+        this.startTime = Date.now();
+        this.isRunning = true;
+        this.lineCount = 0;
+        this.maxLineCount = 0;
+        this.isFirstRender = true;
+        this.lastOutputLines = [];
+        this.inputBuffer = '';
+        this.inputCursorIndex = 0;
+        this.onInputCallback = onInput || null;
+        this.completedDurationMs = initialCompletedDurationMs;
+        this.planModificationCallback = planModification || null;
+        this.planningMode = false;
+        this.planningTasks = [];
+        this.planningSelectedIndex = 0;
+        this.planningMessage = '';
+        // Set up input handling
+        if (process.stdin.isTTY) {
+            process.stdin.setRawMode(true);
+            process.stdin.resume();
+            this.keyHandler = (key) => {
+                const char = key.toString();
+                // In planning mode, handle keys differently
+                if (this.planningMode) {
+                    this.handlePlanningKey(char);
+                    return;
+                }
+                // Escape - require double-press to pause (to avoid accidental stops)
+                if (char === '\x1b' && char.length === 1) {
+                    if (this.escPendingPause) {
+                        // Second escape within timeout - actually pause
+                        if (this.escTimeout) {
+                            clearTimeout(this.escTimeout);
+                            this.escTimeout = null;
+                        }
+                        this.escPendingPause = false;
+                        this.onInputCallback?.('__ESC__');
+                    }
+                    else {
+                        // First escape - show warning and wait for confirmation
+                        this.escPendingPause = true;
+                        this.render(); // Re-render to show "Esc again to pause" hint
+                        this.escTimeout = setTimeout(() => {
+                            this.escPendingPause = false;
+                            this.escTimeout = null;
+                            this.render(); // Re-render to restore normal hint
+                        }, 1500); // 1.5 seconds to confirm
+                    }
+                    return;
+                }
+                // Ctrl+C - immediate pause (emergency stop)
+                if (char === '\x03') {
+                    if (this.escTimeout) {
+                        clearTimeout(this.escTimeout);
+                        this.escTimeout = null;
+                    }
+                    this.escPendingPause = false;
+                    this.onInputCallback?.('__ESC__');
+                    return;
+                }
+                // Any other input cancels the escape confirmation
+                if (this.escPendingPause) {
+                    if (this.escTimeout) {
+                        clearTimeout(this.escTimeout);
+                        this.escTimeout = null;
+                    }
+                    this.escPendingPause = false;
+                    // Don't return - let the key be processed normally and re-render below
+                }
+                // Enter - submit input
+                if (char === '\r' || char === '\n') {
+                    if (this.inputBuffer.trim()) {
+                        const input = this.inputBuffer.trim().toLowerCase();
+                        // Check if user wants to enter planning mode
+                        if (input === 'plan' && this.planModificationCallback) {
+                            this.enterPlanningMode();
+                            this.inputBuffer = '';
+                            this.inputCursorIndex = 0;
+                            return;
+                        }
+                        this.onInputCallback?.(this.inputBuffer.trim());
+                        this.inputBuffer = '';
+                        this.inputCursorIndex = 0;
+                        this.render();
+                    }
+                    return;
+                }
+                // Arrow keys
+                if (char === '\x1b[D') { // Left arrow
+                    if (this.inputCursorIndex > 0) {
+                        this.inputCursorIndex--;
+                        this.render();
+                    }
+                    return;
+                }
+                if (char === '\x1b[C') { // Right arrow
+                    if (this.inputCursorIndex < this.inputBuffer.length) {
+                        this.inputCursorIndex++;
+                        this.render();
+                    }
+                    return;
+                }
+                // Home key
+                if (char === '\x1b[H' || char === '\x1b[1~' || char === '\x01') { // Home or Ctrl+A
+                    if (this.inputCursorIndex > 0) {
+                        this.inputCursorIndex = 0;
+                        this.render();
+                    }
+                    return;
+                }
+                // End key
+                if (char === '\x1b[F' || char === '\x1b[4~' || char === '\x05') { // End or Ctrl+E
+                    if (this.inputCursorIndex < this.inputBuffer.length) {
+                        this.inputCursorIndex = this.inputBuffer.length;
+                        this.render();
+                    }
+                    return;
+                }
+                // Delete key
+                if (char === '\x1b[3~') {
+                    if (this.inputCursorIndex < this.inputBuffer.length) {
+                        this.inputBuffer = this.inputBuffer.slice(0, this.inputCursorIndex) +
+                            this.inputBuffer.slice(this.inputCursorIndex + 1);
+                        this.render();
+                    }
+                    return;
+                }
+                // Backspace
+                if (char === '\x7f' || char === '\b') {
+                    if (this.inputCursorIndex > 0) {
+                        this.inputBuffer = this.inputBuffer.slice(0, this.inputCursorIndex - 1) +
+                            this.inputBuffer.slice(this.inputCursorIndex);
+                        this.inputCursorIndex--;
+                        this.render();
+                    }
+                    return;
+                }
+                // Regular character - check for printable ASCII or non-ASCII (like Unicode)
+                const code = char.charCodeAt(0);
+                if (char.length >= 1 && ((code >= 32 && code < 127) || code >= 128)) {
+                    this.inputBuffer = this.inputBuffer.slice(0, this.inputCursorIndex) +
+                        char +
+                        this.inputBuffer.slice(this.inputCursorIndex);
+                    this.inputCursorIndex += char.length;
+                    this.render();
+                }
+            };
+            process.stdin.on('data', this.keyHandler);
+        }
+        // Handle terminal resize
+        this.resizeHandler = () => {
+            // Clear screen and reset render state
+            process.stdout.write('\x1b[2J\x1b[H');
+            this.isFirstRender = true;
+            this.render();
+        };
+        process.stdout.on('resize', this.resizeHandler);
+        // Initial render
+        this.render();
+        // Start animation loop
+        this.interval = setInterval(() => {
+            this.frameIndex = (this.frameIndex + 1) % this.spinnerFrames.length;
+            // Update bounce position for indeterminate progress
+            this.bouncePos += this.bounceDir;
+            const maxPos = 30 - this.bounceWidth; // barWidth - bounceWidth
+            if (this.bouncePos >= maxPos) {
+                this.bouncePos = maxPos;
+                this.bounceDir = -1;
+            }
+            else if (this.bouncePos <= 0) {
+                this.bouncePos = 0;
+                this.bounceDir = 1;
+            }
+            this.render();
+        }, 80);
+    }
+    /**
+     * Add output line from Claude Code
+     */
+    addOutput(line) {
+        // Clean up the line - remove ANSI codes for length calculation but keep for display
+        const cleanLine = line.replace(/\x1b\[[0-9;]*m/g, '');
+        // Truncate if too long
+        const maxWidth = process.stdout.columns ? process.stdout.columns - 4 : 76;
+        let displayLine = line;
+        if (cleanLine.length > maxWidth) {
+            displayLine = cleanLine.slice(0, maxWidth - 3) + '...';
+        }
+        this.lastOutputLines.push(displayLine);
+        // Keep only the last N lines
+        if (this.lastOutputLines.length > this.maxOutputLines) {
+            this.lastOutputLines.shift();
+        }
+    }
+    /**
+     * Update when starting a new task
+     */
+    startTask(taskName, taskIndex, taskId) {
+        this.currentTask = taskName;
+        this.currentTaskIndex = taskIndex;
+        this.currentTaskId = taskId || '';
+        this.taskStartTime = Date.now();
+        this.phase = 'executing';
+    }
+    /**
+     * Update phase (executing -> validating -> committing)
+     */
+    setPhase(phase) {
+        this.phase = phase;
+    }
+    /**
+     * Mark a task as complete
+     * @param durationMs Optional duration of the completed task in milliseconds.
+     *                   If not provided, calculates from taskStartTime.
+     */
+    completeTask(durationMs) {
+        this.completedTasks++;
+        // Use provided duration, or calculate from taskStartTime
+        const taskDuration = durationMs ?? (this.taskStartTime > 0 ? Date.now() - this.taskStartTime : 0);
+        this.completedDurationMs += taskDuration;
+    }
+    /**
+     * Stop the animated display
+     */
+    stop(finalMessage) {
+        this.isRunning = false;
+        if (this.interval) {
+            clearInterval(this.interval);
+            this.interval = null;
+        }
+        // Clean up escape confirmation timeout
+        if (this.escTimeout) {
+            clearTimeout(this.escTimeout);
+            this.escTimeout = null;
+        }
+        this.escPendingPause = false;
+        // Clean up input handling
+        if (this.keyHandler) {
+            process.stdin.removeListener('data', this.keyHandler);
+            this.keyHandler = null;
+        }
+        if (process.stdin.isTTY) {
+            process.stdin.setRawMode(false);
+        }
+        // Clean up resize handler
+        if (this.resizeHandler) {
+            process.stdout.removeListener('resize', this.resizeHandler);
+            this.resizeHandler = null;
+        }
+        // Clear the display (restore cursor and clear)
+        if (!this.isFirstRender) {
+            process.stdout.write('\x1b8'); // Restore to saved position
+            process.stdout.write('\x1b[J'); // Clear from cursor to end of screen
+        }
+        if (finalMessage) {
+            console.log(finalMessage);
+        }
+    }
+    /**
+     * Enter planning mode - show task list overlay while execution continues
+     */
+    async enterPlanningMode() {
+        if (!this.planModificationCallback?.getTasks) {
+            return;
+        }
+        this.planningMode = true;
+        this.planningMessage = '';
+        // Load current tasks
+        try {
+            this.planningTasks = await this.planModificationCallback.getTasks();
+            // Find first pending task (skip completed and current in_progress)
+            const pendingIndex = this.planningTasks.findIndex(t => t.status === 'pending' && t.id !== this.currentTaskId);
+            this.planningSelectedIndex = pendingIndex >= 0 ? pendingIndex : 0;
+        }
+        catch {
+            this.planningTasks = [];
+            this.planningSelectedIndex = 0;
+        }
+        this.render();
+    }
+    /**
+     * Exit planning mode and return to normal execution view
+     */
+    exitPlanningMode() {
+        this.planningMode = false;
+        this.planningTasks = [];
+        this.planningMessage = '';
+        this.inputBuffer = '';
+        this.inputCursorIndex = 0;
+        this.render();
+    }
+    /**
+     * Handle keyboard input in planning mode
+     */
+    handlePlanningKey(char) {
+        // Escape or 'q' - exit planning mode
+        if (char === '\x1b' || char === 'q' || char === 'Q') {
+            this.exitPlanningMode();
+            return;
+        }
+        // Ctrl+C - exit planning mode (don't pause execution)
+        if (char === '\x03') {
+            this.exitPlanningMode();
+            return;
+        }
+        // Arrow up - navigate up
+        if (char === '\x1b[A') {
+            if (this.planningSelectedIndex > 0) {
+                this.planningSelectedIndex--;
+                this.render();
+            }
+            return;
+        }
+        // Arrow down - navigate down
+        if (char === '\x1b[B') {
+            if (this.planningSelectedIndex < this.planningTasks.length - 1) {
+                this.planningSelectedIndex++;
+                this.render();
+            }
+            return;
+        }
+        // Left arrow - move cursor left within input
+        if (char === '\x1b[D') {
+            if (this.inputCursorIndex > 0) {
+                this.inputCursorIndex--;
+                this.render();
+            }
+            return;
+        }
+        // Right arrow - move cursor right within input
+        if (char === '\x1b[C') {
+            if (this.inputCursorIndex < this.inputBuffer.length) {
+                this.inputCursorIndex++;
+                this.render();
+            }
+            return;
+        }
+        // Home key
+        if (char === '\x1b[H' || char === '\x1b[1~' || char === '\x01') {
+            if (this.inputCursorIndex > 0) {
+                this.inputCursorIndex = 0;
+                this.render();
+            }
+            return;
+        }
+        // End key
+        if (char === '\x1b[F' || char === '\x1b[4~' || char === '\x05') {
+            if (this.inputCursorIndex < this.inputBuffer.length) {
+                this.inputCursorIndex = this.inputBuffer.length;
+                this.render();
+            }
+            return;
+        }
+        // Delete key
+        if (char === '\x1b[3~') {
+            if (this.inputCursorIndex < this.inputBuffer.length) {
+                this.inputBuffer = this.inputBuffer.slice(0, this.inputCursorIndex) +
+                    this.inputBuffer.slice(this.inputCursorIndex + 1);
+                this.render();
+            }
+            return;
+        }
+        // Enter - submit command or perform default action on selected task
+        if (char === '\r' || char === '\n') {
+            if (this.inputBuffer.trim()) {
+                this.executePlanningCommand(this.inputBuffer.trim());
+                this.inputBuffer = '';
+                this.inputCursorIndex = 0;
+            }
+            return;
+        }
+        // Backspace
+        if (char === '\x7f' || char === '\b') {
+            if (this.inputCursorIndex > 0) {
+                this.inputBuffer = this.inputBuffer.slice(0, this.inputCursorIndex - 1) +
+                    this.inputBuffer.slice(this.inputCursorIndex);
+                this.inputCursorIndex--;
+                this.render();
+            }
+            return;
+        }
+        // 's' - skip selected task (shortcut)
+        if ((char === 's' || char === 'S') && !this.inputBuffer) {
+            this.executePlanningCommand('skip');
+            return;
+        }
+        // Regular character - check for printable ASCII or non-ASCII (like Unicode)
+        const code = char.charCodeAt(0);
+        if (char.length >= 1 && ((code >= 32 && code < 127) || code >= 128)) {
+            this.inputBuffer = this.inputBuffer.slice(0, this.inputCursorIndex) +
+                char +
+                this.inputBuffer.slice(this.inputCursorIndex);
+            this.inputCursorIndex += char.length;
+            this.render();
+        }
+    }
+    /**
+     * Execute a planning command
+     */
+    async executePlanningCommand(cmd) {
+        const selectedTask = this.planningTasks[this.planningSelectedIndex];
+        if (!selectedTask) {
+            this.planningMessage = '\x1b[31mNo task selected\x1b[0m';
+            this.render();
+            return;
+        }
+        const lowerCmd = cmd.toLowerCase().trim();
+        // 'done', 'back', 'exit' - exit planning mode
+        if (lowerCmd === 'done' || lowerCmd === 'back' || lowerCmd === 'exit') {
+            this.exitPlanningMode();
+            return;
+        }
+        // 'skip' - skip selected task
+        if (lowerCmd === 'skip') {
+            if (selectedTask.status !== 'pending') {
+                this.planningMessage = `\x1b[33mCan only skip pending tasks\x1b[0m`;
+                this.render();
+                return;
+            }
+            if (selectedTask.id === this.currentTaskId) {
+                this.planningMessage = `\x1b[33mCannot skip currently running task\x1b[0m`;
+                this.render();
+                return;
+            }
+            try {
+                await this.planModificationCallback?.onSkipTask?.(selectedTask.id);
+                this.planningMessage = `\x1b[32m✓ Skipped: ${selectedTask.title}\x1b[0m`;
+                // Refresh task list
+                if (this.planModificationCallback?.getTasks) {
+                    this.planningTasks = await this.planModificationCallback.getTasks();
+                }
+            }
+            catch (err) {
+                this.planningMessage = `\x1b[31mFailed to skip task\x1b[0m`;
+            }
+            this.render();
+            return;
+        }
+        // 'up' - move task up in order
+        if (lowerCmd === 'up') {
+            if (selectedTask.status !== 'pending') {
+                this.planningMessage = `\x1b[33mCan only reorder pending tasks\x1b[0m`;
+                this.render();
+                return;
+            }
+            try {
+                await this.planModificationCallback?.onMoveTaskUp?.(selectedTask.id);
+                this.planningMessage = `\x1b[32m✓ Moved up: ${selectedTask.title}\x1b[0m`;
+                // Refresh task list and adjust selection
+                if (this.planModificationCallback?.getTasks) {
+                    this.planningTasks = await this.planModificationCallback.getTasks();
+                    // Find the task's new position
+                    const newIndex = this.planningTasks.findIndex(t => t.id === selectedTask.id);
+                    if (newIndex >= 0) {
+                        this.planningSelectedIndex = newIndex;
+                    }
+                }
+            }
+            catch (err) {
+                this.planningMessage = `\x1b[31mFailed to move task\x1b[0m`;
+            }
+            this.render();
+            return;
+        }
+        // 'down' - move task down in order
+        if (lowerCmd === 'down') {
+            if (selectedTask.status !== 'pending') {
+                this.planningMessage = `\x1b[33mCan only reorder pending tasks\x1b[0m`;
+                this.render();
+                return;
+            }
+            try {
+                await this.planModificationCallback?.onMoveTaskDown?.(selectedTask.id);
+                this.planningMessage = `\x1b[32m✓ Moved down: ${selectedTask.title}\x1b[0m`;
+                // Refresh task list and adjust selection
+                if (this.planModificationCallback?.getTasks) {
+                    this.planningTasks = await this.planModificationCallback.getTasks();
+                    // Find the task's new position
+                    const newIndex = this.planningTasks.findIndex(t => t.id === selectedTask.id);
+                    if (newIndex >= 0) {
+                        this.planningSelectedIndex = newIndex;
+                    }
+                }
+            }
+            catch (err) {
+                this.planningMessage = `\x1b[31mFailed to move task\x1b[0m`;
+            }
+            this.render();
+            return;
+        }
+        // Unknown command
+        this.planningMessage = `\x1b[33mUnknown command: ${cmd}\x1b[0m`;
+        this.render();
+    }
+    clearLines() {
+        if (this.isFirstRender) {
+            this.isFirstRender = false;
+        }
+        else {
+            // Move cursor up by the max number of lines we've ever rendered, then clear to end
+            // Using maxLineCount ensures we clear everything even when output lines grow between renders
+            const linesToClear = Math.max(this.lineCount, this.maxLineCount);
+            if (linesToClear > 0) {
+                process.stdout.write(`\x1b[${linesToClear}A`); // Move cursor up
+            }
+            process.stdout.write('\x1b[J'); // Clear from cursor to end of screen
+        }
+    }
+    formatTime(ms) {
+        const seconds = Math.floor(ms / 1000);
+        const minutes = Math.floor(seconds / 60);
+        const secs = seconds % 60;
+        if (minutes > 0) {
+            return `${minutes}m ${secs}s`;
+        }
+        return `${secs}s`;
+    }
+    /**
+     * Get the total working time (sum of completed task durations + current task elapsed)
+     */
+    getElapsedTime() {
+        const currentTaskElapsed = this.currentTask ? (Date.now() - this.taskStartTime) : 0;
+        return this.formatTime(this.completedDurationMs + currentTaskElapsed);
+    }
+    /**
+     * Get the total working time in milliseconds
+     */
+    getTotalDurationMs() {
+        const currentTaskElapsed = this.currentTask ? (Date.now() - this.taskStartTime) : 0;
+        return this.completedDurationMs + currentTaskElapsed;
+    }
+    /**
+     * Estimate task progress based on phase and elapsed time
+     */
+    getTaskPercent() {
+        if (!this.currentTask)
+            return 0;
+        const elapsed = Date.now() - this.taskStartTime;
+        const EXPECTED_PHASE_MS = 60000; // 1 min expected per phase
+        const phaseProgress = Math.min(elapsed / EXPECTED_PHASE_MS, 0.95); // Cap at 95% within phase
+        switch (this.phase) {
+            case 'executing':
+                return Math.round(phaseProgress * 60); // 0-57%
+            case 'validating':
+                return 60 + Math.round(phaseProgress * 25); // 60-84%
+            case 'committing':
+                return 85 + Math.round(phaseProgress * 15); // 85-99%
+            default:
+                return 0;
+        }
+    }
+    render() {
+        if (!this.isRunning)
+            return;
+        // Full-screen redraw: clear screen, render header, then progress
+        process.stdout.write('\x1b[2J\x1b[H'); // Clear screen and move to top
+        // Render header if available
+        if (this.headerRenderer) {
+            this.headerRenderer();
+        }
+        const lines = [];
+        const barWidth = 30;
+        // Section title
+        lines.push('\x1b[1m── Execution ──\x1b[0m');
+        lines.push('');
+        // Output lines from Claude Code (above progress bars)
+        if (this.lastOutputLines.length > 0) {
+            lines.push('\x1b[90m── Claude Code Output ──\x1b[0m');
+            for (const outputLine of this.lastOutputLines) {
+                lines.push(`  ${outputLine}`); // Keep original formatting
+            }
+            lines.push('');
+        }
+        lines.push('');
+        // Task progress bar (only show when there's a current task)
+        // Uses indeterminate "Knight Rider" style animation since we don't know when Claude Code finishes
+        if (this.currentTask) {
+            const taskElapsed = this.formatTime(Date.now() - this.taskStartTime);
+            // Build indeterminate progress bar with bouncing segment
+            let taskBar = '';
+            for (let i = 0; i < barWidth; i++) {
+                if (i >= this.bouncePos && i < this.bouncePos + this.bounceWidth) {
+                    taskBar += '\x1b[36m█\x1b[0m'; // Cyan filled segment
+                }
+                else {
+                    taskBar += '\x1b[90m░\x1b[0m'; // Gray empty
+                }
+            }
+            const phaseLabel = {
+                executing: '\x1b[36mExecuting\x1b[0m',
+                validating: '\x1b[33mValidating\x1b[0m',
+                committing: '\x1b[32mCommitting\x1b[0m',
+            }[this.phase];
+            lines.push(`${taskBar}       📋 \x1b[1mTask ${this.currentTaskIndex + 1}\x1b[0m  ${phaseLabel}  \x1b[90m(${taskElapsed})\x1b[0m`);
+        }
+        // Overall project progress (completed + skipped = done)
+        const doneCount = this.completedTasks + this.skippedTasks;
+        const overallPercent = this.totalTasks > 0
+            ? Math.round((doneCount / this.totalTasks) * 100)
+            : 0;
+        // Total working time = completed tasks + current task elapsed
+        const currentTaskElapsed = this.currentTask ? (Date.now() - this.taskStartTime) : 0;
+        const totalWorkingMs = this.completedDurationMs + currentTaskElapsed;
+        const elapsed = this.formatTime(totalWorkingMs);
+        // Progress bar: green for completed, yellow for skipped, gray for remaining
+        const completedWidth = Math.round(barWidth * (this.completedTasks / this.totalTasks));
+        const skippedWidth = Math.round(barWidth * (this.skippedTasks / this.totalTasks));
+        const emptyWidth = barWidth - completedWidth - skippedWidth;
+        const bar = '\x1b[32m' + '█'.repeat(completedWidth) +
+            '\x1b[33m' + '▓'.repeat(skippedWidth) +
+            '\x1b[90m' + '░'.repeat(Math.max(0, emptyWidth)) + '\x1b[0m';
+        const overallPercentStr = `${overallPercent}%`.padStart(4);
+        // Show count: completed+skipped/total if there are skipped, otherwise just completed/total
+        const countStr = this.skippedTasks > 0
+            ? `${this.completedTasks}+${this.skippedTasks}/${this.totalTasks}`
+            : `${this.completedTasks}/${this.totalTasks}`;
+        lines.push(`${bar} ${overallPercentStr}  📊 \x1b[1mProject\x1b[0m   \x1b[90m(${countStr} tasks • ${elapsed})\x1b[0m`);
+        lines.push('');
+        // Current task name with spinner
+        if (this.currentTask) {
+            const spinner = this.spinnerFrames[this.frameIndex];
+            lines.push(`\x1b[36m${spinner}\x1b[0m ${this.currentTask}`);
+        }
+        const termWidth = process.stdout.columns || 80;
+        // Planning mode overlay - show task list for modification
+        if (this.planningMode && this.planningTasks.length > 0) {
+            lines.push('');
+            lines.push('\x1b[1m\x1b[36m── Plan (concurrent mode) ──\x1b[0m  \x1b[90mExecution continues in background\x1b[0m');
+            lines.push('');
+            // Show task list with selection indicator - cap at 20 items max
+            const maxVisibleTasks = Math.min(20, this.planningTasks.length);
+            const startIndex = Math.max(0, this.planningSelectedIndex - Math.floor(maxVisibleTasks / 2));
+            const endIndex = Math.min(this.planningTasks.length, startIndex + maxVisibleTasks);
+            for (let i = startIndex; i < endIndex; i++) {
+                const task = this.planningTasks[i];
+                const isSelected = i === this.planningSelectedIndex;
+                const isCurrent = task.id === this.currentTaskId;
+                // Status icon
+                let icon = formatTaskStatusIcon(task.status, task.failureType);
+                // Build task line
+                let line = isSelected ? '\x1b[36m❯\x1b[0m ' : '  ';
+                line += icon + ' ';
+                // Task title with truncation
+                const maxTitleWidth = termWidth - 20;
+                let title = task.title;
+                if (title.length > maxTitleWidth) {
+                    title = title.slice(0, maxTitleWidth - 3) + '...';
+                }
+                if (isCurrent) {
+                    line += `\x1b[36m${title}\x1b[0m \x1b[90m(running)\x1b[0m`;
+                }
+                else if (isSelected) {
+                    line += `\x1b[1m${title}\x1b[0m`;
+                }
+                else {
+                    line += title;
+                }
+                lines.push(line);
+            }
+            // Show scroll indicator if needed
+            if (this.planningTasks.length > maxVisibleTasks) {
+                const scrollInfo = `\x1b[90m(${this.planningSelectedIndex + 1}/${this.planningTasks.length})\x1b[0m`;
+                lines.push(scrollInfo);
+            }
+            // Show feedback message if any
+            if (this.planningMessage) {
+                lines.push('');
+                lines.push(this.planningMessage);
+            }
+            lines.push('');
+        }
+        // Input bar at the bottom - unified structure with hint OUTSIDE the box
+        let hint;
+        if (this.planningMode) {
+            hint = '↑↓ navigate · skip · up/down · done to exit';
+        }
+        else if (this.escPendingPause) {
+            hint = '\x1b[33mEsc again to pause\x1b[0m';
+        }
+        else {
+            hint = 'Esc pause · type to discuss';
+        }
+        // Top border
+        lines.push(`\x1b[90m${'─'.repeat(termWidth)}\x1b[0m`);
+        // Input line (no hint inside) with cursor at correct position
+        if (this.inputBuffer) {
+            const beforeCursor = this.inputBuffer.slice(0, this.inputCursorIndex);
+            const afterCursor = this.inputBuffer.slice(this.inputCursorIndex);
+            // Show cursor as inverted space at cursor position
+            lines.push(`\x1b[90m❯\x1b[0m ${beforeCursor}\x1b[7m${afterCursor.charAt(0) || ' '}\x1b[0m${afterCursor.slice(1)}`);
+        }
+        else {
+            const placeholder = this.planningMode ? 'type command...' : 'type to interact...';
+            lines.push(`\x1b[90m❯ ${placeholder}\x1b[0m`);
+        }
+        // Bottom border
+        lines.push(`\x1b[90m${'─'.repeat(termWidth)}\x1b[0m`);
+        // Hint OUTSIDE the box, right-aligned
+        const hintPadding = Math.max(0, termWidth - hint.length);
+        lines.push(`${' '.repeat(hintPadding)}\x1b[90m${hint}\x1b[0m`);
+        // Print all lines
+        const output = lines.join('\n');
+        process.stdout.write(output);
+        this.lineCount = lines.length;
+        this.maxLineCount = Math.max(this.maxLineCount, this.lineCount);
+    }
+    /**
+     * Log a message without disrupting the display
+     */
+    log(message) {
+        // Clear display (move cursor up by line count and clear)
+        if (!this.isFirstRender && this.lineCount > 0) {
+            process.stdout.write(`\x1b[${this.lineCount}A`); // Move cursor up
+            process.stdout.write('\x1b[J'); // Clear from cursor to end of screen
+        }
+        // Print message
+        console.log(message);
+        // Reset for next render
+        this.isFirstRender = true;
+        this.render();
+    }
+}
+//# sourceMappingURL=ui.js.map