@compilr-dev/cli 0.4.0 → 0.5.1

package/dist/ui/keyboard-handler.js

@@ -0,0 +1,557 @@
+/**
+ * Keyboard input handler.
+ *
+ * Extracted from TerminalUI — owns keyboard capture, escape handling,
+ * overlay key routing, and the main keypress dispatch loop. Accesses
+ * sub-controllers (input, autocomplete, overlay, status bar) directly
+ * through the host interface.
+ */
+import * as readline from 'readline';
+import { parseKeyEvent } from './overlay/index.js';
+export class KeyboardHandler {
+    keyHandler = null;
+    dataHandler = null;
+    lastEscapeTime = 0;
+    lastTabTime = 0;
+    host;
+    constructor(host) {
+        this.host = host;
+    }
+    // ===========================================================================
+    // Capture start / stop
+    // ===========================================================================
+    startCapture() {
+        if (this.keyHandler)
+            return; // Already capturing
+        readline.emitKeypressEvents(process.stdin);
+        if (process.stdin.isTTY) {
+            process.stdin.setRawMode(true);
+        }
+        // Handle raw data for reliable Escape and Option+Arrow detection
+        this.dataHandler = (data) => {
+            if (this.host.isGuardActive())
+                return;
+            // Pure Escape key is a single byte 0x1B
+            if (data.length === 1 && data[0] === 0x1b) {
+                this.handleEscape();
+                return;
+            }
+            // When an overlay is active, handle escape sequences directly from raw
+            // data. This avoids a bug where readline's emitKeys generator, left
+            // suspended after a standalone escape (e.g. popping a detail screen),
+            // misparsest the next escape sequence — arrow keys arrive as individual
+            // character keypresses instead of recognized key events.
+            if (this.host.hasActiveOverlay() && data[0] === 0x1b && data.length > 1) {
+                this.handleOverlayEscapeSequence(data);
+                return;
+            }
+            // Mac Option+Left (word left): ESC b or ESC [ 1 ; 9 D
+            const isOptionLeft = (data.length === 2 && data[0] === 0x1b && data[1] === 0x62) ||
+                (data.length === 6 &&
+                    data[0] === 0x1b &&
+                    data[1] === 0x5b &&
+                    data[2] === 0x31 &&
+                    data[3] === 0x3b &&
+                    data[4] === 0x39 &&
+                    data[5] === 0x44);
+            // Mac Option+Right (word right): ESC f or ESC [ 1 ; 9 C
+            const isOptionRight = (data.length === 2 && data[0] === 0x1b && data[1] === 0x66) ||
+                (data.length === 6 &&
+                    data[0] === 0x1b &&
+                    data[1] === 0x5b &&
+                    data[2] === 0x31 &&
+                    data[3] === 0x3b &&
+                    data[4] === 0x39 &&
+                    data[5] === 0x43);
+            if (isOptionLeft) {
+                if (this.host.input.moveWordLeft())
+                    this.host.requestRender();
+                return;
+            }
+            if (isOptionRight) {
+                if (this.host.input.moveWordRight())
+                    this.host.requestRender();
+                return;
+            }
+            // Home/Cmd+Left: Ctrl+A (\x01) or ESC [ H
+            const isHome = (data.length === 1 && data[0] === 0x01) ||
+                (data.length === 3 && data[0] === 0x1b && data[1] === 0x5b && data[2] === 0x48);
+            // End/Cmd+Right: Ctrl+E (\x05) or ESC [ F
+            const isEnd = (data.length === 1 && data[0] === 0x05) ||
+                (data.length === 3 && data[0] === 0x1b && data[1] === 0x5b && data[2] === 0x46);
+            if (isHome) {
+                this.host.input.cursorPos = 0;
+                this.host.requestRender();
+                return;
+            }
+            if (isEnd) {
+                this.host.input.cursorPos = this.host.input.lines[this.host.input.currentLine].length;
+                this.host.requestRender();
+                return;
+            }
+        };
+        this.keyHandler = (str, key) => {
+            if (this.host.isGuardActive())
+                return;
+            // Skip escape here - handled by dataHandler
+            if (key.name === 'escape')
+                return;
+            // When overlay is active, escape sequences are handled directly from
+            // raw data in dataHandler (see handleOverlayEscapeSequence). Skip them
+            // here to prevent double-processing.
+            if (this.host.hasActiveOverlay() && key.sequence?.startsWith('\x1b'))
+                return;
+            this.handleKeypress(str, key);
+        };
+        process.stdin.on('data', this.dataHandler);
+        process.stdin.on('keypress', this.keyHandler);
+        process.stdin.resume();
+    }
+    stopCapture() {
+        if (this.dataHandler) {
+            process.stdin.removeListener('data', this.dataHandler);
+            this.dataHandler = null;
+        }
+        if (this.keyHandler) {
+            process.stdin.removeListener('keypress', this.keyHandler);
+            this.keyHandler = null;
+        }
+        if (process.stdin.isTTY) {
+            process.stdin.setRawMode(false);
+        }
+    }
+    // ===========================================================================
+    // Escape handling
+    // ===========================================================================
+    handleEscape() {
+        const host = this.host;
+        const { input, ac } = host;
+        // In verbose-temp mode, escape returns to normal
+        if (host.getViewMode() === 'verbose-temp') {
+            host.setViewMode('normal');
+            host.reRenderConversationVerbose(false);
+            return;
+        }
+        // Route escape to active overlay if present
+        const overlay = host.getActiveOverlay();
+        if (overlay) {
+            const keyEvent = {
+                raw: Buffer.from([0x1b]),
+                name: 'escape',
+                ctrl: false,
+                shift: false,
+                meta: false,
+            };
+            const actionOrPromise = overlay.handleKey(keyEvent);
+            // Handle both sync and async handleKey
+            if (actionOrPromise instanceof Promise) {
+                actionOrPromise
+                    .then((action) => { host.overlay.processOverlayAction(action); })
+                    .catch((err) => { console.error('Overlay handleKey error:', err); });
+            }
+            else {
+                host.overlay.processOverlayAction(actionOrPromise);
+            }
+            return;
+        }
+        const now = Date.now();
+        const timeSinceLastEsc = now - this.lastEscapeTime;
+        const isDoubleEsc = timeSinceLastEsc < 500;
+        this.lastEscapeTime = now;
+        if (ac.isActive()) {
+            ac.close();
+            host.requestRender();
+        }
+        else if (isDoubleEsc && input.getInputValue().length > 0) {
+            // 4. Double Esc clears input (if there's content)
+            input.clearInput();
+            input.resetHistoryNavigation();
+            host.requestRender();
+        }
+        else if (host.isAgentRunning()) {
+            // 5. Single Esc cancels agent
+            host.emit('cancel');
+        }
+        else {
+            // 6. Single Esc emits escape
+            host.emit('escape');
+        }
+    }
+    // ===========================================================================
+    // Overlay key routing
+    // ===========================================================================
+    handleOverlayKeypress(str, key) {
+        const overlay = this.host.getActiveOverlay();
+        if (!overlay)
+            return;
+        // Build KeyEvent from keypress data
+        const rawData = key.sequence ?? str;
+        const keyName = key.name ?? (str ? str.toLowerCase() : '');
+        const keyEvent = {
+            raw: Buffer.from(rawData),
+            name: keyName,
+            char: str && str.length === 1 && str.charCodeAt(0) >= 32 ? str : undefined,
+            ctrl: key.ctrl ?? false,
+            shift: key.shift ?? false,
+            meta: key.meta ?? false,
+        };
+        const actionOrPromise = overlay.handleKey(keyEvent);
+        // Handle both sync and async handleKey
+        if (actionOrPromise instanceof Promise) {
+            actionOrPromise
+                .then((action) => { this.host.overlay.processOverlayAction(action); })
+                .catch((err) => { console.error('Overlay handleKey error:', err); });
+        }
+        else {
+            this.host.overlay.processOverlayAction(actionOrPromise);
+        }
+    }
+    /**
+     * Handle escape sequences for overlays directly from raw stdin data.
+     *
+     * Bypasses readline's keypress events which can be corrupted when the
+     * emitKeys generator is left suspended after a standalone escape key.
+     * Uses parseKeyEvent (from ui-core) to reliably parse the raw bytes.
+     */
+    handleOverlayEscapeSequence(data) {
+        const overlay = this.host.getActiveOverlay();
+        if (!overlay)
+            return;
+        const keyEvent = parseKeyEvent(data);
+        const actionOrPromise = overlay.handleKey(keyEvent);
+        if (actionOrPromise instanceof Promise) {
+            actionOrPromise
+                .then((action) => { this.host.overlay.processOverlayAction(action); })
+                .catch((err) => { console.error('Overlay handleKey error:', err); });
+        }
+        else {
+            this.host.overlay.processOverlayAction(actionOrPromise);
+        }
+    }
+    // ===========================================================================
+    // Autocomplete accept
+    // ===========================================================================
+    applyAutocomplete() {
+        const { input, ac } = this.host;
+        const wasFileActive = ac.file.active;
+        const result = ac.accept(input.lines, input.currentLine, input.cursorPos);
+        if (result) {
+            input.lines = result.lines;
+            input.currentLine = result.currentLine;
+            input.cursorPos = result.cursorPos;
+            // After file autocomplete, check if still in @ context (directory selected)
+            if (wasFileActive) {
+                ac.update(input.lines, input.currentLine, input.cursorPos);
+            }
+        }
+    }
+    // ===========================================================================
+    // Main keypress dispatch
+    // ===========================================================================
+    handleKeypress(str, key) {
+        const host = this.host;
+        const { input, ac } = host;
+        // Route to active overlay if present
+        if (host.hasActiveOverlay()) {
+            this.handleOverlayKeypress(str, key);
+            return;
+        }
+        // Status bar navigation mode intercepts all keys
+        if (host.statusBar.navActive) {
+            host.statusBar.handleKey(str, key);
+            return;
+        }
+        // In verbose-temp mode, any key (except Ctrl+O) returns to normal
+        if (host.getViewMode() === 'verbose-temp') {
+            // Ctrl+O toggles back
+            if (key.ctrl && key.name === 'o') {
+                host.toggleVerboseView();
+                host.toggleLiveRegionExpanded();
+                return;
+            }
+            // Any other key returns to normal
+            host.setViewMode('normal');
+            host.reRenderConversationVerbose(false);
+            // Don't consume the key - let it be processed normally
+        }
+        // Ctrl+C - interrupt/exit
+        if (key.ctrl && key.name === 'c') {
+            host.emit('interrupt');
+            return;
+        }
+        // Ctrl+T - toggle todo list visibility
+        if (key.ctrl && key.name === 't') {
+            host.toggleTodos();
+            return;
+        }
+        // Ctrl+O - toggle verbose view mode AND LiveRegion expansion
+        if (key.ctrl && key.name === 'o') {
+            host.toggleVerboseView();
+            host.toggleLiveRegionExpanded();
+            return;
+        }
+        // Ctrl+B - background active bash OR show background tasks overlay
+        if (key.ctrl && key.name === 'b') {
+            // If there's an active bash command, move it to background
+            if (host.hasActiveBash()) {
+                host.backgroundBashCommand();
+                return;
+            }
+            // Otherwise, show the tasks overlay
+            host.emit('showTasks');
+            return;
+        }
+        // Ctrl+R - view restored conversation history
+        if (key.ctrl && key.name === 'r') {
+            if (host.hasRestoredHistory()) {
+                host.showRestoredHistory();
+            }
+            return;
+        }
+        // Tab - accept suggestion, or autocomplete
+        if (key.name === 'tab' && !key.shift) {
+            // Accept ghost text suggestion if input is empty
+            if (input.suggestion && input.getInputValue() === '') {
+                input.lines[0] = input.suggestion;
+                input.cursorPos = input.suggestion.length;
+                input.suggestion = null;
+                host.requestRender();
+                return;
+            }
+            if (ac.isActive()) {
+                this.applyAutocomplete();
+                host.requestRender();
+                return;
+            }
+            // Double Tab → open /pending
+            const now = Date.now();
+            if (now - this.lastTabTime < 400) {
+                this.lastTabTime = 0;
+                host.emit('showPending');
+                return;
+            }
+            this.lastTabTime = now;
+            return;
+        }
+        // Enter - handle multiline continuation, autocomplete, then execute
+        if (key.name === 'return') {
+            // Check for backslash continuation at end of current line
+            const currentLine = input.getCurrentLineContent();
+            if (currentLine.endsWith('\\')) {
+                // Remove backslash and add new line
+                input.lines[input.currentLine] = currentLine.slice(0, -1);
+                input.lines.push('');
+                input.currentLine++;
+                input.cursorPos = 0;
+                ac.close();
+                input.resetHistoryNavigation();
+                host.requestRender();
+                return;
+            }
+            // If agent autocomplete is active, accept selection and let user type message
+            if (ac.agent.active && ac.agent.matches.length > 0) {
+                this.applyAutocomplete();
+                host.requestRender();
+                return; // Don't submit - let user type the message
+            }
+            // If file or command autocomplete is active, accept and fall through to submit
+            if (ac.isActive()) {
+                this.applyAutocomplete();
+            }
+            let inputValue = input.getInputValue().trim();
+            // If input is empty but we have a ghost text suggestion, accept it
+            if (!inputValue && input.suggestion) {
+                inputValue = input.suggestion;
+                input.suggestion = null;
+            }
+            if (inputValue) {
+                // Add to history before processing (store as single line for history)
+                input.addToHistory(inputValue.replace(/\n/g, ' '));
+                input.resetHistoryNavigation();
+                if (inputValue.startsWith('/')) {
+                    // Slash commands always execute immediately, even when agent is busy.
+                    // This ensures /pending, /bg, /fg, /kill are never blocked by a running agent.
+                    const spaceIndex = inputValue.indexOf(' ');
+                    const cmd = spaceIndex > 0 ? inputValue.slice(1, spaceIndex) : inputValue.slice(1);
+                    const args = spaceIndex > 0 ? inputValue.slice(spaceIndex + 1) : '';
+                    ac.close();
+                    host.emit('command', cmd, args);
+                }
+                else if (inputValue.startsWith('$') && host.isAgentRunning()) {
+                    // $agent prefix fires immediately when agent is busy (agent switching).
+                    // When idle, falls through to normal submit path which handles $agent too.
+                    const cleanedInput = inputValue.replace(/(?<![@\w])@([\w./-]+)/g, '$1');
+                    host.emit('submit', cleanedInput);
+                }
+                else if (host.isAgentRunning()) {
+                    // Regular messages queue when agent is busy
+                    input.queuedInputs.push(inputValue);
+                    host.requestRender();
+                }
+                else {
+                    // Strip @ prefix from file paths (autocomplete uses @ but agent doesn't need it)
+                    const cleanedInput = inputValue.replace(/(?<![@\w])@([\w./-]+)/g, '$1');
+                    host.emit('submit', cleanedInput);
+                }
+                input.clearInput();
+                ac.close();
+                host.requestRender();
+            }
+            return;
+        }
+        // Arrow Up - autocomplete > multiline navigation > history
+        if (key.name === 'up') {
+            // 1. Autocomplete navigation takes priority
+            if (ac.navigateUp()) {
+                host.requestRender();
+                return;
+            }
+            // 2. Navigate to previous line in multiline input
+            if (input.currentLine > 0) {
+                input.currentLine--;
+                // Try to keep same cursor position, but clamp to line length
+                input.cursorPos = Math.min(input.cursorPos, input.lines[input.currentLine].length);
+                host.requestRender();
+                return;
+            }
+            // 3. History navigation (only when at first line)
+            if (input.navigateHistoryUp(ac.isActive())) {
+                ac.close();
+                host.requestRender();
+            }
+            return;
+        }
+        // Arrow Down - autocomplete > multiline navigation > history
+        if (key.name === 'down') {
+            // 1. Autocomplete navigation takes priority
+            if (ac.navigateDown()) {
+                host.requestRender();
+                return;
+            }
+            // 2. Navigate to next line in multiline input
+            if (input.currentLine < input.lines.length - 1) {
+                input.currentLine++;
+                // Try to keep same cursor position, but clamp to line length
+                input.cursorPos = Math.min(input.cursorPos, input.lines[input.currentLine].length);
+                host.requestRender();
+                return;
+            }
+            // 3. History forward (only when at last line)
+            if (input.historyIndex >= 0 && input.navigateHistoryDown(ac.isActive())) {
+                host.requestRender();
+                return;
+            }
+            // 4. Enter status bar navigation if navigable indicators exist
+            const statusItems = host.statusBar.getItems();
+            if (statusItems.length > 0) {
+                host.statusBar.navActive = true;
+                host.statusBar.selectedIndex = 0;
+                host.requestRender();
+            }
+            return;
+        }
+        // Backspace
+        if (key.name === 'backspace') {
+            if (input.cursorPos > 0) {
+                // Delete character in current line
+                const line = input.lines[input.currentLine];
+                input.lines[input.currentLine] = line.slice(0, input.cursorPos - 1) + line.slice(input.cursorPos);
+                input.cursorPos--;
+                input.resetHistoryNavigation();
+                ac.update(input.lines, input.currentLine, input.cursorPos);
+                host.requestRender();
+            }
+            else if (input.currentLine > 0) {
+                // At start of line - merge with previous line
+                const currentLineTxt = input.lines[input.currentLine];
+                const prevLine = input.lines[input.currentLine - 1];
+                input.lines[input.currentLine - 1] = prevLine + currentLineTxt;
+                input.lines.splice(input.currentLine, 1);
+                input.currentLine--;
+                input.cursorPos = prevLine.length;
+                input.resetHistoryNavigation();
+                ac.update(input.lines, input.currentLine, input.cursorPos);
+                host.requestRender();
+            }
+            return;
+        }
+        // Delete
+        if (key.name === 'delete') {
+            const line = input.lines[input.currentLine];
+            if (input.cursorPos < line.length) {
+                // Delete character in current line
+                input.lines[input.currentLine] = line.slice(0, input.cursorPos) + line.slice(input.cursorPos + 1);
+                input.resetHistoryNavigation();
+                ac.update(input.lines, input.currentLine, input.cursorPos);
+                host.requestRender();
+            }
+            else if (input.currentLine < input.lines.length - 1) {
+                // At end of line - merge with next line
+                const nextLine = input.lines[input.currentLine + 1];
+                input.lines[input.currentLine] = line + nextLine;
+                input.lines.splice(input.currentLine + 1, 1);
+                input.resetHistoryNavigation();
+                ac.update(input.lines, input.currentLine, input.cursorPos);
+                host.requestRender();
+            }
+            return;
+        }
+        // Arrow keys (left/right for cursor movement with multiline support)
+        if (key.name === 'left') {
+            if (input.cursorPos > 0) {
+                input.cursorPos--;
+                host.requestRender();
+            }
+            else if (input.currentLine > 0) {
+                // Move to end of previous line
+                input.currentLine--;
+                input.cursorPos = input.lines[input.currentLine].length;
+                host.requestRender();
+            }
+            return;
+        }
+        if (key.name === 'right') {
+            const lineLen = input.lines[input.currentLine].length;
+            if (input.cursorPos < lineLen) {
+                input.cursorPos++;
+                host.requestRender();
+            }
+            else if (input.currentLine < input.lines.length - 1) {
+                // Move to start of next line
+                input.currentLine++;
+                input.cursorPos = 0;
+                host.requestRender();
+            }
+            return;
+        }
+        if (key.name === 'home') {
+            input.cursorPos = 0;
+            host.requestRender();
+            return;
+        }
+        if (key.name === 'end') {
+            input.cursorPos = input.lines[input.currentLine].length;
+            host.requestRender();
+            return;
+        }
+        // Shift+Tab - mode change
+        if (key.shift && key.name === 'tab') {
+            host.emit('modeChange');
+            return;
+        }
+        // Regular character
+        if (str && str.length === 1 && str.charCodeAt(0) >= 32) {
+            // Clear ghost text suggestion when user starts typing
+            if (input.suggestion) {
+                input.suggestion = null;
+            }
+            const line = input.lines[input.currentLine];
+            input.lines[input.currentLine] =
+                line.slice(0, input.cursorPos) + str + line.slice(input.cursorPos);
+            input.cursorPos++;
+            input.resetHistoryNavigation();
+            ac.update(input.lines, input.currentLine, input.cursorPos);
+            host.requestRender();
+        }
+    }
+}

package/dist/ui/keys-overlay.d.ts

@@ -3,6 +3,7 @@
  *
  * Modal overlay for managing API keys.
  * Shows status of all providers and allows setting/deleting keys.
+ * Refactored to use BaseOverlay + ScreenStack + InputFeature.
  */
 export interface KeysOverlayResult {
     /** Whether any keys were changed */