indusagi 0.12.18 → 0.12.20

package/dist/tui/components/editor.js

@@ -102,40 +102,94 @@ function decodeKittyPrintable(data) {
         return undefined;
     }
 }
+class EditorLayoutProjector {
+    static buildVisualLineMap(lines, width) {
+        const visualLines = [];
+        for (let logicalIndex = 0; logicalIndex < lines.length; logicalIndex++) {
+            const line = lines[logicalIndex] || "";
+            if (line.length === 0) {
+                visualLines.push({ logicalLine: logicalIndex, startCol: 0, length: 0 });
+                continue;
+            }
+            if (visibleWidth(line) <= width) {
+                visualLines.push({ logicalLine: logicalIndex, startCol: 0, length: line.length });
+                continue;
+            }
+            for (const chunk of wordWrapLine(line, width)) {
+                visualLines.push({
+                    logicalLine: logicalIndex,
+                    startCol: chunk.startIndex,
+                    length: chunk.endIndex - chunk.startIndex,
+                });
+            }
+        }
+        return visualLines;
+    }
+    static findCurrentVisualLine(visualLines, cursorLine, cursorCol) {
+        for (let visualIndex = 0; visualIndex < visualLines.length; visualIndex++) {
+            const segment = visualLines[visualIndex];
+            if (!segment || segment.logicalLine !== cursorLine)
+                continue;
+            const offset = cursorCol - segment.startCol;
+            const lastSegment = visualIndex === visualLines.length - 1 || visualLines[visualIndex + 1]?.logicalLine !== segment.logicalLine;
+            if (offset >= 0 && (offset < segment.length || (lastSegment && offset <= segment.length))) {
+                return visualIndex;
+            }
+        }
+        return visualLines.length - 1;
+    }
+    static resolveCursorAtVisualLine(visualLines, visualIndex, visualCol, lines) {
+        const segment = visualLines[visualIndex];
+        if (!segment)
+            return null;
+        const line = segment.logicalLine;
+        const targetCol = segment.startCol + Math.min(visualCol, segment.length);
+        return { line, col: Math.min(targetCol, (lines[line] || "").length) };
+    }
+}
 export class Editor extends ComponentBase {
+    state = {
+        lines: [""],
+        cursorLine: 0,
+        cursorCol: 0,
+    };
+    /** Focusable interface - set by TUI when focus changes */
+    focused = false;
+    tui;
+    theme;
+    paddingX = 0;
+    // Store last render width for cursor navigation
+    lastWidth = 80;
+    // Vertical scrolling support
+    scrollOffset = 0;
+    // Border color (can be changed dynamically)
+    borderColor;
+    // Autocomplete support
+    autocompleteProvider;
+    autocompleteList;
+    isAutocompleting = false;
+    autocompletePrefix = "";
+    // Paste tracking for large pastes
+    pastes = new Map();
+    pasteCounter = 0;
+    // Bracketed paste mode buffering
+    pasteBuffer = "";
+    isInPaste = false;
+    pendingShiftEnter = false;
+    // Prompt history for up/down navigation
+    history = [];
+    historyIndex = -1; // -1 = not browsing, 0 = most recent, 1 = older, etc.
+    // Kill ring for Emacs-style kill/yank operations
+    // Also tracks undo coalescing: "type-word" means we're mid-word (coalescing)
+    killRing = [];
+    lastAction = null;
+    // Undo support
+    undoStack = [];
+    onSubmit;
+    onChange;
+    disableSubmit = false;
     constructor(tui, theme, options = {}) {
         super();
-        this.state = {
-            lines: [""],
-            cursorLine: 0,
-            cursorCol: 0,
-        };
-        /** Focusable interface - set by TUI when focus changes */
-        this.focused = false;
-        this.paddingX = 0;
-        // Store last render width for cursor navigation
-        this.lastWidth = 80;
-        // Vertical scrolling support
-        this.scrollOffset = 0;
-        this.isAutocompleting = false;
-        this.autocompletePrefix = "";
-        // Paste tracking for large pastes
-        this.pastes = new Map();
-        this.pasteCounter = 0;
-        // Bracketed paste mode buffering
-        this.pasteBuffer = "";
-        this.isInPaste = false;
-        this.pendingShiftEnter = false;
-        // Prompt history for up/down navigation
-        this.history = [];
-        this.historyIndex = -1; // -1 = not browsing, 0 = most recent, 1 = older, etc.
-        // Kill ring for Emacs-style kill/yank operations
-        // Also tracks undo coalescing: "type-word" means we're mid-word (coalescing)
-        this.killRing = [];
-        this.lastAction = null;
-        // Undo support
-        this.undoStack = [];
-        this.disableSubmit = false;
         this.tui = tui;
         this.theme = theme;
         this.borderColor = theme.borderColor;
@@ -223,294 +277,274 @@ export class Editor extends ComponentBase {
         this.autocompleteList?.invalidate?.();
     }
     render(width) {
+        const state = this.prepareRenderState(width);
+        const out = [];
+        out.push(this.renderTopBorder(width, state.horizontal));
+        const emitCursorMarker = this.focused && !this.isAutocompleting;
+        for (const layoutLine of state.visibleLines) {
+            out.push(this.renderVisibleLine(layoutLine, state.contentWidth, state.leftPadding, state.rightPadding, emitCursorMarker));
+        }
+        const linesBelow = state.layoutLines.length - (this.scrollOffset + state.visibleLines.length);
+        out.push(this.renderBottomBorder(width, state.horizontal, linesBelow));
+        if (this.isAutocompleting && this.autocompleteList) {
+            this.appendAutocompleteLines(out, state.contentWidth, state.leftPadding, state.rightPadding);
+        }
+        return out;
+    }
+    prepareRenderState(width) {
         const maxPadding = Math.max(0, Math.floor((width - 1) / 2));
         const paddingX = Math.min(this.paddingX, maxPadding);
         const contentWidth = Math.max(1, width - paddingX * 2);
-        // Layout width: with padding the cursor can overflow into it,
-        // without padding we reserve 1 column for the cursor.
         const layoutWidth = Math.max(1, contentWidth - (paddingX ? 0 : 1));
-        // Store for cursor navigation (must match wrapping width)
         this.lastWidth = layoutWidth;
-        const horizontal = this.borderColor("─");
-        // Layout the text
         const layoutLines = this.layoutText(layoutWidth);
-        // Calculate max visible lines: 30% of terminal height, minimum 5 lines
-        const terminalRows = this.tui.terminal.rows;
-        const maxVisibleLines = Math.max(5, Math.floor(terminalRows * 0.3));
-        // Find the cursor line index in layoutLines
-        let cursorLineIndex = layoutLines.findIndex((line) => line.hasCursor);
-        if (cursorLineIndex === -1)
-            cursorLineIndex = 0;
-        // Adjust scroll offset to keep cursor visible
+        const maxVisibleLines = Math.max(5, Math.floor(this.tui.terminal.rows * 0.3));
+        const cursorLineIndex = Math.max(0, layoutLines.findIndex((line) => line.hasCursor));
+        this.syncScrollOffset(cursorLineIndex, maxVisibleLines, layoutLines.length);
+        const visibleLines = layoutLines.slice(this.scrollOffset, this.scrollOffset + maxVisibleLines);
+        const sidePadding = " ".repeat(paddingX);
+        return {
+            horizontal: this.borderColor("─"),
+            contentWidth,
+            leftPadding: sidePadding,
+            rightPadding: sidePadding,
+            layoutLines,
+            visibleLines,
+        };
+    }
+    syncScrollOffset(cursorLineIndex, maxVisibleLines, totalLayoutLines) {
         if (cursorLineIndex < this.scrollOffset) {
             this.scrollOffset = cursorLineIndex;
         }
         else if (cursorLineIndex >= this.scrollOffset + maxVisibleLines) {
             this.scrollOffset = cursorLineIndex - maxVisibleLines + 1;
         }
-        // Clamp scroll offset to valid range
-        const maxScrollOffset = Math.max(0, layoutLines.length - maxVisibleLines);
+        const maxScrollOffset = Math.max(0, totalLayoutLines - maxVisibleLines);
         this.scrollOffset = Math.max(0, Math.min(this.scrollOffset, maxScrollOffset));
-        // Get visible lines slice
-        const visibleLines = layoutLines.slice(this.scrollOffset, this.scrollOffset + maxVisibleLines);
-        const result = [];
-        const leftPadding = " ".repeat(paddingX);
-        const rightPadding = leftPadding;
-        // Render top border (with scroll indicator if scrolled down)
-        if (this.scrollOffset > 0) {
-            const indicator = `─── ↑ ${this.scrollOffset} more `;
-            const remaining = width - visibleWidth(indicator);
-            result.push(this.borderColor(indicator + "─".repeat(Math.max(0, remaining))));
-        }
-        else {
-            result.push(horizontal.repeat(width));
-        }
-        // Render each visible layout line
-        // Emit hardware cursor marker only when focused and not showing autocomplete
-        const emitCursorMarker = this.focused && !this.isAutocompleting;
-        for (const layoutLine of visibleLines) {
-            let displayText = layoutLine.text;
-            let lineVisibleWidth = visibleWidth(layoutLine.text);
-            let cursorInPadding = false;
-            // Add cursor if this line has it
-            if (layoutLine.hasCursor && layoutLine.cursorPos !== undefined) {
-                const before = displayText.slice(0, layoutLine.cursorPos);
-                const after = displayText.slice(layoutLine.cursorPos);
-                // Hardware cursor marker (zero-width, emitted before fake cursor for IME positioning)
-                const marker = emitCursorMarker ? CURSOR_MARKER : "";
-                if (after.length > 0) {
-                    // Cursor is on a character (grapheme) - replace it with highlighted version
-                    // Get the first grapheme from 'after'
-                    const afterGraphemes = [...segmenter.segment(after)];
-                    const firstGrapheme = afterGraphemes[0]?.segment || "";
-                    const restAfter = after.slice(firstGrapheme.length);
-                    const cursor = `\x1b[7m${firstGrapheme}\x1b[0m`;
-                    displayText = before + marker + cursor + restAfter;
-                    // lineVisibleWidth stays the same - we're replacing, not adding
-                }
-                else {
-                    // Cursor is at the end - add highlighted space
-                    const cursor = "\x1b[7m \x1b[0m";
-                    displayText = before + marker + cursor;
-                    lineVisibleWidth = lineVisibleWidth + 1;
-                    // If cursor overflows content width into the padding, flag it
-                    if (lineVisibleWidth > contentWidth && paddingX > 0) {
-                        cursorInPadding = true;
-                    }
-                }
+    }
+    renderTopBorder(width, horizontal) {
+        if (this.scrollOffset <= 0)
+            return horizontal.repeat(width);
+        const indicator = `─── ↑ ${this.scrollOffset} more `;
+        const remaining = width - visibleWidth(indicator);
+        return this.borderColor(indicator + "─".repeat(Math.max(0, remaining)));
+    }
+    renderBottomBorder(width, horizontal, linesBelow) {
+        if (linesBelow <= 0)
+            return horizontal.repeat(width);
+        const indicator = `─── ↓ ${linesBelow} more `;
+        const remaining = width - visibleWidth(indicator);
+        return this.borderColor(indicator + "─".repeat(Math.max(0, remaining)));
+    }
+    renderVisibleLine(layoutLine, contentWidth, leftPadding, rightPadding, emitCursorMarker) {
+        let displayText = layoutLine.text;
+        let measuredWidth = visibleWidth(layoutLine.text);
+        let cursorInPadding = false;
+        if (layoutLine.hasCursor && layoutLine.cursorPos !== undefined) {
+            const before = displayText.slice(0, layoutLine.cursorPos);
+            const after = displayText.slice(layoutLine.cursorPos);
+            const marker = emitCursorMarker ? CURSOR_MARKER : "";
+            if (after.length > 0) {
+                const first = [...segmenter.segment(after)][0]?.segment || "";
+                const highlighted = `\x1b[7m${first}\x1b[0m`;
+                displayText = before + marker + highlighted + after.slice(first.length);
             }
-            // Calculate padding based on actual visible width
-            const padding = " ".repeat(Math.max(0, contentWidth - lineVisibleWidth));
-            const lineRightPadding = cursorInPadding ? rightPadding.slice(1) : rightPadding;
-            // Render the line (no side borders, just horizontal lines above and below)
-            result.push(`${leftPadding}${displayText}${padding}${lineRightPadding}`);
-        }
-        // Render bottom border (with scroll indicator if more content below)
-        const linesBelow = layoutLines.length - (this.scrollOffset + visibleLines.length);
-        if (linesBelow > 0) {
-            const indicator = `─── ↓ ${linesBelow} more `;
-            const remaining = width - visibleWidth(indicator);
-            result.push(this.borderColor(indicator + "─".repeat(Math.max(0, remaining))));
-        }
-        else {
-            result.push(horizontal.repeat(width));
-        }
-        // Add autocomplete list if active
-        if (this.isAutocompleting && this.autocompleteList) {
-            const autocompleteResult = this.autocompleteList.render(contentWidth);
-            for (const line of autocompleteResult) {
-                const lineWidth = visibleWidth(line);
-                const linePadding = " ".repeat(Math.max(0, contentWidth - lineWidth));
-                result.push(`${leftPadding}${line}${linePadding}${rightPadding}`);
+            else {
+                displayText = before + marker + "\x1b[7m \x1b[0m";
+                measuredWidth += 1;
+                cursorInPadding = measuredWidth > contentWidth && rightPadding.length > 0;
             }
         }
-        return result;
+        const fill = " ".repeat(Math.max(0, contentWidth - measuredWidth));
+        const adjustedRightPadding = cursorInPadding ? rightPadding.slice(1) : rightPadding;
+        return `${leftPadding}${displayText}${fill}${adjustedRightPadding}`;
+    }
+    appendAutocompleteLines(target, contentWidth, leftPadding, rightPadding) {
+        const autocompleteResult = this.autocompleteList?.render(contentWidth) ?? [];
+        for (const line of autocompleteResult) {
+            const linePadding = " ".repeat(Math.max(0, contentWidth - visibleWidth(line)));
+            target.push(`${leftPadding}${line}${linePadding}${rightPadding}`);
+        }
     }
     handleInput(data) {
         const kb = getEditorKeybindings();
-        // Handle bracketed paste mode
-        if (data.includes("\x1b[200~")) {
-            this.isInPaste = true;
-            this.pasteBuffer = "";
-            data = data.replace("\x1b[200~", "");
-        }
-        if (this.isInPaste) {
-            this.pasteBuffer += data;
-            const endIndex = this.pasteBuffer.indexOf("\x1b[201~");
-            if (endIndex !== -1) {
-                const pasteContent = this.pasteBuffer.substring(0, endIndex);
-                if (pasteContent.length > 0) {
-                    this.handlePaste(pasteContent);
-                }
-                this.isInPaste = false;
-                const remaining = this.pasteBuffer.substring(endIndex + 6);
-                this.pasteBuffer = "";
-                if (remaining.length > 0) {
-                    this.handleInput(remaining);
-                }
-                return;
-            }
+        const pasteResult = this.consumePasteInput(data);
+        if (!pasteResult)
             return;
-        }
-        if (this.pendingShiftEnter) {
-            if (data === "\r") {
-                this.pendingShiftEnter = false;
-                this.addNewLine();
-                return;
-            }
-            this.pendingShiftEnter = false;
-            this.insertCharacter("\\");
-        }
+        data = pasteResult;
+        const pendingResult = this.consumePendingShiftEnter(data);
+        if (!pendingResult)
+            return;
+        data = pendingResult;
         if (data === "\\") {
             this.pendingShiftEnter = true;
             return;
         }
-        // Ctrl+C - let parent handle (exit/clear)
-        if (kb.matches(data, "copy")) {
+        if (this.runEarlyActions(data, kb))
             return;
-        }
-        // Undo
-        if (kb.matches(data, "undo")) {
-            this.undo();
+        const autocompleteResult = this.handleAutocompleteInput(data, kb);
+        if (autocompleteResult === "handled")
             return;
-        }
-        // Handle autocomplete mode
-        if (this.isAutocompleting && this.autocompleteList) {
-            if (kb.matches(data, "selectCancel")) {
-                this.cancelAutocomplete();
-                return;
-            }
-            if (kb.matches(data, "selectUp") || kb.matches(data, "selectDown")) {
-                this.autocompleteList.handleInput(data);
-                return;
-            }
-            if (kb.matches(data, "tab")) {
-                const selected = this.autocompleteList.getSelectedItem();
-                if (selected && this.autocompleteProvider) {
-                    this.pushUndoSnapshot();
-                    this.lastAction = null;
-                    const result = this.autocompleteProvider.applyCompletion(this.state.lines, this.state.cursorLine, this.state.cursorCol, selected, this.autocompletePrefix);
-                    this.state.lines = result.lines;
-                    this.state.cursorLine = result.cursorLine;
-                    this.state.cursorCol = result.cursorCol;
-                    this.cancelAutocomplete();
-                    if (this.onChange)
-                        this.onChange(this.getText());
-                }
-                return;
-            }
-            if (kb.matches(data, "selectConfirm")) {
-                const selected = this.autocompleteList.getSelectedItem();
-                if (selected && this.autocompleteProvider) {
-                    this.pushUndoSnapshot();
-                    this.lastAction = null;
-                    const result = this.autocompleteProvider.applyCompletion(this.state.lines, this.state.cursorLine, this.state.cursorCol, selected, this.autocompletePrefix);
-                    this.state.lines = result.lines;
-                    this.state.cursorLine = result.cursorLine;
-                    this.state.cursorCol = result.cursorCol;
-                    if (this.autocompletePrefix.startsWith("/")) {
-                        this.cancelAutocomplete();
-                        // Fall through to submit
-                    }
-                    else {
-                        this.cancelAutocomplete();
-                        if (this.onChange)
-                            this.onChange(this.getText());
-                        return;
-                    }
-                }
-            }
-        }
-        // Tab - trigger completion
-        if (kb.matches(data, "tab") && !this.isAutocompleting) {
+        if (!this.isAutocompleting && kb.matches(data, "tab")) {
             this.handleTabCompletion();
             return;
         }
-        // Deletion actions
-        if (kb.matches(data, "deleteToLineEnd")) {
-            this.deleteToEndOfLine();
+        if (this.runDeleteActions(data, kb))
             return;
-        }
-        if (kb.matches(data, "deleteToLineStart")) {
-            this.deleteToStartOfLine();
+        if (this.runKillRingActions(data, kb))
             return;
-        }
-        if (kb.matches(data, "deleteWordBackward")) {
-            this.deleteWordBackwards();
+        if (this.runCursorActions(data, kb))
             return;
-        }
-        if (kb.matches(data, "deleteWordForward")) {
-            this.deleteWordForward();
+        if (this.isNewLineInput(data, kb)) {
+            this.addNewLine();
             return;
         }
-        if (kb.matches(data, "deleteCharBackward") || matchesKey(data, "shift+backspace")) {
-            this.handleBackspace();
+        if (kb.matches(data, "submit")) {
+            this.submitEditor();
             return;
         }
-        if (kb.matches(data, "deleteCharForward") || matchesKey(data, "shift+delete")) {
-            this.handleForwardDelete();
+        if (this.runArrowActions(data, kb))
             return;
-        }
-        // Kill ring actions
-        if (kb.matches(data, "yank")) {
-            this.yank();
+        if (this.runPagingActions(data, kb))
             return;
-        }
-        if (kb.matches(data, "yankPop")) {
-            this.yankPop();
+        if (matchesKey(data, "shift+space")) {
+            this.insertCharacter(" ");
             return;
         }
-        // Cursor movement actions
-        if (kb.matches(data, "cursorLineStart")) {
-            this.moveToLineStart();
+        const kittyPrintable = decodeKittyPrintable(data);
+        if (kittyPrintable !== undefined) {
+            this.insertCharacter(kittyPrintable);
             return;
         }
-        if (kb.matches(data, "cursorLineEnd")) {
-            this.moveToLineEnd();
-            return;
+        if (data.charCodeAt(0) >= 32) {
+            this.insertCharacter(data);
         }
-        if (kb.matches(data, "cursorWordLeft")) {
-            this.moveWordBackwards();
-            return;
+    }
+    consumePasteInput(data) {
+        if (data.includes("\x1b[200~")) {
+            this.isInPaste = true;
+            this.pasteBuffer = "";
+            data = data.replace("\x1b[200~", "");
         }
-        if (kb.matches(data, "cursorWordRight")) {
-            this.moveWordForwards();
-            return;
+        if (!this.isInPaste)
+            return data;
+        this.pasteBuffer += data;
+        const endIndex = this.pasteBuffer.indexOf("\x1b[201~");
+        if (endIndex === -1)
+            return null;
+        const pasteContent = this.pasteBuffer.substring(0, endIndex);
+        if (pasteContent.length > 0) {
+            this.handlePaste(pasteContent);
         }
-        // New line (Shift+Enter, Alt+Enter, etc.)
-        if (kb.matches(data, "newLine") ||
-            (data.charCodeAt(0) === 10 && data.length > 1) ||
-            data === "\x1b\r" ||
-            data === "\x1b[13;2~" ||
-            (data.length > 1 && data.includes("\x1b") && data.includes("\r")) ||
-            (data === "\n" && data.length === 1) ||
-            data === "\\\r") {
+        this.isInPaste = false;
+        const remaining = this.pasteBuffer.substring(endIndex + 6);
+        this.pasteBuffer = "";
+        if (remaining.length > 0) {
+            this.handleInput(remaining);
+        }
+        return null;
+    }
+    consumePendingShiftEnter(data) {
+        if (!this.pendingShiftEnter)
+            return data;
+        if (data === "\r") {
+            this.pendingShiftEnter = false;
             this.addNewLine();
-            return;
+            return null;
         }
-        // Submit (Enter)
-        if (kb.matches(data, "submit")) {
-            if (this.disableSubmit)
-                return;
-            let result = this.state.lines.join("\n").trim();
-            for (const [pasteId, pasteContent] of this.pastes) {
-                const markerRegex = new RegExp(`\\[paste #${pasteId}( (\\+\\d+ lines|\\d+ chars))?\\]`, "g");
-                result = result.replace(markerRegex, pasteContent);
-            }
-            this.state = { lines: [""], cursorLine: 0, cursorCol: 0 };
-            this.pastes.clear();
-            this.pasteCounter = 0;
-            this.historyIndex = -1;
-            this.scrollOffset = 0;
-            this.undoStack.length = 0;
-            this.lastAction = null;
-            if (this.onChange)
-                this.onChange("");
-            if (this.onSubmit)
-                this.onSubmit(result);
-            return;
+        this.pendingShiftEnter = false;
+        this.insertCharacter("\\");
+        return data;
+    }
+    runEarlyActions(data, kb) {
+        if (kb.matches(data, "copy")) {
+            return true;
+        }
+        if (kb.matches(data, "undo")) {
+            this.undo();
+            return true;
+        }
+        return false;
+    }
+    handleAutocompleteInput(data, kb) {
+        if (!this.isAutocompleting || !this.autocompleteList)
+            return "none";
+        if (kb.matches(data, "selectCancel")) {
+            this.cancelAutocomplete();
+            return "handled";
+        }
+        if (kb.matches(data, "selectUp") || kb.matches(data, "selectDown")) {
+            this.autocompleteList.handleInput(data);
+            return "handled";
+        }
+        if (kb.matches(data, "tab")) {
+            this.applySelectedAutocompleteItem(true);
+            return "handled";
+        }
+        if (kb.matches(data, "selectConfirm")) {
+            const applied = this.applySelectedAutocompleteItem(false);
+            if (!applied)
+                return "handled";
+            return this.autocompletePrefix.startsWith("/") ? "continue" : "handled";
+        }
+        return "none";
+    }
+    applySelectedAutocompleteItem(notifyOnSlash) {
+        const selected = this.autocompleteList?.getSelectedItem();
+        if (!selected || !this.autocompleteProvider)
+            return false;
+        this.pushUndoSnapshot();
+        this.lastAction = null;
+        const result = this.autocompleteProvider.applyCompletion(this.state.lines, this.state.cursorLine, this.state.cursorCol, selected, this.autocompletePrefix);
+        this.state.lines = result.lines;
+        this.state.cursorLine = result.cursorLine;
+        this.state.cursorCol = result.cursorCol;
+        this.cancelAutocomplete();
+        if (this.onChange && (notifyOnSlash || !this.autocompletePrefix.startsWith("/"))) {
+            this.onChange(this.getText());
+        }
+        return true;
+    }
+    runDeleteActions(data, kb) {
+        const actions = [
+            { match: kb.matches(data, "deleteToLineEnd"), run: () => this.deleteToEndOfLine() },
+            { match: kb.matches(data, "deleteToLineStart"), run: () => this.deleteToStartOfLine() },
+            { match: kb.matches(data, "deleteWordBackward"), run: () => this.deleteWordBackwards() },
+            { match: kb.matches(data, "deleteWordForward"), run: () => this.deleteWordForward() },
+            { match: kb.matches(data, "deleteCharBackward") || matchesKey(data, "shift+backspace"), run: () => this.handleBackspace() },
+            { match: kb.matches(data, "deleteCharForward") || matchesKey(data, "shift+delete"), run: () => this.handleForwardDelete() },
+        ];
+        const route = actions.find((entry) => entry.match);
+        if (!route)
+            return false;
+        route.run();
+        return true;
+    }
+    runKillRingActions(data, kb) {
+        if (kb.matches(data, "yank")) {
+            this.yank();
+            return true;
+        }
+        if (kb.matches(data, "yankPop")) {
+            this.yankPop();
+            return true;
         }
-        // Arrow key navigation (with history support)
+        return false;
+    }
+    runCursorActions(data, kb) {
+        const routes = [
+            { match: kb.matches(data, "cursorLineStart"), run: () => this.moveToLineStart() },
+            { match: kb.matches(data, "cursorLineEnd"), run: () => this.moveToLineEnd() },
+            { match: kb.matches(data, "cursorWordLeft"), run: () => this.moveWordBackwards() },
+            { match: kb.matches(data, "cursorWordRight"), run: () => this.moveWordForwards() },
+        ];
+        const route = routes.find((entry) => entry.match);
+        if (!route)
+            return false;
+        route.run();
+        return true;
+    }
+    runArrowActions(data, kb) {
         if (kb.matches(data, "cursorUp")) {
             if (this.isEditorEmpty()) {
                 this.navigateHistory(-1);
@@ -521,7 +555,7 @@ export class Editor extends ComponentBase {
             else {
                 this.moveCursor(-1, 0);
             }
-            return;
+            return true;
         }
         if (kb.matches(data, "cursorDown")) {
             if (this.historyIndex > -1 && this.isOnLastVisualLine()) {
@@ -530,39 +564,57 @@ export class Editor extends ComponentBase {
             else {
                 this.moveCursor(1, 0);
             }
-            return;
+            return true;
         }
         if (kb.matches(data, "cursorRight")) {
             this.moveCursor(0, 1);
-            return;
+            return true;
         }
         if (kb.matches(data, "cursorLeft")) {
             this.moveCursor(0, -1);
-            return;
+            return true;
         }
-        // Page up/down - scroll by page and move cursor
+        return false;
+    }
+    runPagingActions(data, kb) {
         if (kb.matches(data, "pageUp")) {
             this.pageScroll(-1);
-            return;
+            return true;
         }
         if (kb.matches(data, "pageDown")) {
             this.pageScroll(1);
-            return;
+            return true;
         }
-        // Shift+Space - insert regular space
-        if (matchesKey(data, "shift+space")) {
-            this.insertCharacter(" ");
-            return;
-        }
-        const kittyPrintable = decodeKittyPrintable(data);
-        if (kittyPrintable !== undefined) {
-            this.insertCharacter(kittyPrintable);
+        return false;
+    }
+    isNewLineInput(data, kb) {
+        return (kb.matches(data, "newLine") ||
+            (data.charCodeAt(0) === 10 && data.length > 1) ||
+            data === "\x1b\r" ||
+            data === "\x1b[13;2~" ||
+            (data.length > 1 && data.includes("\x1b") && data.includes("\r")) ||
+            (data === "\n" && data.length === 1) ||
+            data === "\\\r");
+    }
+    submitEditor() {
+        if (this.disableSubmit)
             return;
+        let result = this.state.lines.join("\n").trim();
+        for (const [pasteId, pasteContent] of this.pastes) {
+            const markerRegex = new RegExp(`\\[paste #${pasteId}( (\\+\\d+ lines|\\d+ chars))?\\]`, "g");
+            result = result.replace(markerRegex, pasteContent);
         }
-        // Regular characters
-        if (data.charCodeAt(0) >= 32) {
-            this.insertCharacter(data);
-        }
+        this.state = { lines: [""], cursorLine: 0, cursorCol: 0 };
+        this.pastes.clear();
+        this.pasteCounter = 0;
+        this.historyIndex = -1;
+        this.scrollOffset = 0;
+        this.undoStack.length = 0;
+        this.lastAction = null;
+        if (this.onChange)
+            this.onChange("");
+        if (this.onSubmit)
+            this.onSubmit(result);
     }
     layoutText(contentWidth) {
         const layoutLines = [];
@@ -1085,72 +1137,28 @@ export class Editor extends ComponentBase {
      * - length: length of this visual line segment
      */
     buildVisualLineMap(width) {
-        const visualLines = [];
-        for (let i = 0; i < this.state.lines.length; i++) {
-            const line = this.state.lines[i] || "";
-            const lineVisWidth = visibleWidth(line);
-            if (line.length === 0) {
-                // Empty line still takes one visual line
-                visualLines.push({ logicalLine: i, startCol: 0, length: 0 });
-            }
-            else if (lineVisWidth <= width) {
-                visualLines.push({ logicalLine: i, startCol: 0, length: line.length });
-            }
-            else {
-                // Line needs wrapping - use word-aware wrapping
-                const chunks = wordWrapLine(line, width);
-                for (const chunk of chunks) {
-                    visualLines.push({
-                        logicalLine: i,
-                        startCol: chunk.startIndex,
-                        length: chunk.endIndex - chunk.startIndex,
-                    });
-                }
-            }
-        }
-        return visualLines;
+        return EditorLayoutProjector.buildVisualLineMap(this.state.lines, width);
     }
     /**
      * Find the visual line index for the current cursor position.
      */
     findCurrentVisualLine(visualLines) {
-        for (let i = 0; i < visualLines.length; i++) {
-            const vl = visualLines[i];
-            if (!vl)
-                continue;
-            if (vl.logicalLine === this.state.cursorLine) {
-                const colInSegment = this.state.cursorCol - vl.startCol;
-                // Cursor is in this segment if it's within range
-                // For the last segment of a logical line, cursor can be at length (end position)
-                const isLastSegmentOfLine = i === visualLines.length - 1 || visualLines[i + 1]?.logicalLine !== vl.logicalLine;
-                if (colInSegment >= 0 && (colInSegment < vl.length || (isLastSegmentOfLine && colInSegment <= vl.length))) {
-                    return i;
-                }
-            }
-        }
-        // Fallback: return last visual line
-        return visualLines.length - 1;
+        return EditorLayoutProjector.findCurrentVisualLine(visualLines, this.state.cursorLine, this.state.cursorCol);
     }
     moveCursor(deltaLine, deltaCol) {
         this.lastAction = null;
         const width = this.lastWidth;
         if (deltaLine !== 0) {
-            // Build visual line map for navigation
             const visualLines = this.buildVisualLineMap(width);
             const currentVisualLine = this.findCurrentVisualLine(visualLines);
-            // Calculate column position within current visual line
-            const currentVL = visualLines[currentVisualLine];
-            const visualCol = currentVL ? this.state.cursorCol - currentVL.startCol : 0;
-            // Move to target visual line
+            const currentSegment = visualLines[currentVisualLine];
+            const visualCol = currentSegment ? this.state.cursorCol - currentSegment.startCol : 0;
             const targetVisualLine = currentVisualLine + deltaLine;
             if (targetVisualLine >= 0 && targetVisualLine < visualLines.length) {
-                const targetVL = visualLines[targetVisualLine];
-                if (targetVL) {
-                    this.state.cursorLine = targetVL.logicalLine;
-                    // Try to maintain visual column position, clamped to line length
-                    const targetCol = targetVL.startCol + Math.min(visualCol, targetVL.length);
-                    const logicalLine = this.state.lines[targetVL.logicalLine] || "";
-                    this.state.cursorCol = Math.min(targetCol, logicalLine.length);
+                const target = EditorLayoutProjector.resolveCursorAtVisualLine(visualLines, targetVisualLine, visualCol, this.state.lines);
+                if (target) {
+                    this.state.cursorLine = target.line;
+                    this.state.cursorCol = target.col;
                 }
             }
         }
@@ -1196,21 +1204,15 @@ export class Editor extends ComponentBase {
         const width = this.lastWidth;
         const terminalRows = this.tui.terminal.rows;
         const pageSize = Math.max(5, Math.floor(terminalRows * 0.3));
-        // Build visual line map
         const visualLines = this.buildVisualLineMap(width);
         const currentVisualLine = this.findCurrentVisualLine(visualLines);
-        // Calculate target visual line
         const targetVisualLine = Math.max(0, Math.min(visualLines.length - 1, currentVisualLine + direction * pageSize));
-        // Move cursor to target visual line
-        const targetVL = visualLines[targetVisualLine];
-        if (targetVL) {
-            // Preserve column position within the line
-            const currentVL = visualLines[currentVisualLine];
-            const visualCol = currentVL ? this.state.cursorCol - currentVL.startCol : 0;
-            this.state.cursorLine = targetVL.logicalLine;
-            const targetCol = targetVL.startCol + Math.min(visualCol, targetVL.length);
-            const logicalLine = this.state.lines[targetVL.logicalLine] || "";
-            this.state.cursorCol = Math.min(targetCol, logicalLine.length);
+        const currentSegment = visualLines[currentVisualLine];
+        const visualCol = currentSegment ? this.state.cursorCol - currentSegment.startCol : 0;
+        const target = EditorLayoutProjector.resolveCursorAtVisualLine(visualLines, targetVisualLine, visualCol, this.state.lines);
+        if (target) {
+            this.state.cursorLine = target.line;
+            this.state.cursorCol = target.col;
         }
     }
     moveWordBackwards() {