co-mono/packages/tui/src/components/editor.ts
Sviatoslav Abakumov 7d2d170c1b
fix(tui): handle multi-line text in insertTextAtCursor()
Add insertTextAtCursorInternal() to properly handle newlines by splitting
lines at the cursor position.

- Normalize line endings (CRLF/CR to LF)
- Handle single-line and multi-line insertion
- Position cursor at end of inserted text
- Call onChange only once at the end

Refactor handlePaste() to use insertTextAtCursorInternal() for
multi-line pastes, while retaining character-by-character insertion for
single-line pastes to preserve autocomplete triggering.
2026-01-25 17:28:54 +04:00

1839 lines
58 KiB
TypeScript

import type { AutocompleteProvider, CombinedAutocompleteProvider } from "../autocomplete.js";
import { getEditorKeybindings } from "../keybindings.js";
import { matchesKey } from "../keys.js";
import { type Component, CURSOR_MARKER, type Focusable, type TUI } from "../tui.js";
import { getSegmenter, isPunctuationChar, isWhitespaceChar, visibleWidth } from "../utils.js";
import { SelectList, type SelectListTheme } from "./select-list.js";
const segmenter = getSegmenter();
/**
* Represents a chunk of text for word-wrap layout.
* Tracks both the text content and its position in the original line.
*/
export interface TextChunk {
text: string;
startIndex: number;
endIndex: number;
}
/**
* Split a line into word-wrapped chunks.
* Wraps at word boundaries when possible, falling back to character-level
* wrapping for words longer than the available width.
*
* @param line - The text line to wrap
* @param maxWidth - Maximum visible width per chunk
* @returns Array of chunks with text and position information
*/
export function wordWrapLine(line: string, maxWidth: number): TextChunk[] {
if (!line || maxWidth <= 0) {
return [{ text: "", startIndex: 0, endIndex: 0 }];
}
const lineWidth = visibleWidth(line);
if (lineWidth <= maxWidth) {
return [{ text: line, startIndex: 0, endIndex: line.length }];
}
const chunks: TextChunk[] = [];
const segments = [...segmenter.segment(line)];
let currentWidth = 0;
let chunkStart = 0;
// Wrap opportunity: the position after the last whitespace before a non-whitespace
// grapheme, i.e. where a line break is allowed.
let wrapOppIndex = -1;
let wrapOppWidth = 0;
for (let i = 0; i < segments.length; i++) {
const seg = segments[i]!;
const grapheme = seg.segment;
const gWidth = visibleWidth(grapheme);
const charIndex = seg.index;
const isWs = isWhitespaceChar(grapheme);
// Overflow check before advancing.
if (currentWidth + gWidth > maxWidth) {
if (wrapOppIndex >= 0) {
// Backtrack to last wrap opportunity.
chunks.push({ text: line.slice(chunkStart, wrapOppIndex), startIndex: chunkStart, endIndex: wrapOppIndex });
chunkStart = wrapOppIndex;
currentWidth -= wrapOppWidth;
} else if (chunkStart < charIndex) {
// No wrap opportunity: force-break at current position.
chunks.push({ text: line.slice(chunkStart, charIndex), startIndex: chunkStart, endIndex: charIndex });
chunkStart = charIndex;
currentWidth = 0;
}
wrapOppIndex = -1;
}
// Advance.
currentWidth += gWidth;
// Record wrap opportunity: whitespace followed by non-whitespace.
// Multiple spaces join (no break between them); the break point is
// after the last space before the next word.
const next = segments[i + 1];
if (isWs && next && !isWhitespaceChar(next.segment)) {
wrapOppIndex = next.index;
wrapOppWidth = currentWidth;
}
}
// Push final chunk.
chunks.push({ text: line.slice(chunkStart), startIndex: chunkStart, endIndex: line.length });
return chunks;
}
// Kitty CSI-u sequences for printable keys, including optional shifted/base codepoints.
const KITTY_CSI_U_REGEX = /^\x1b\[(\d+)(?::(\d*))?(?::(\d+))?(?:;(\d+))?(?::(\d+))?u$/;
const KITTY_MOD_SHIFT = 1;
const KITTY_MOD_ALT = 2;
const KITTY_MOD_CTRL = 4;
// Decode a printable CSI-u sequence, preferring the shifted key when present.
function decodeKittyPrintable(data: string): string | undefined {
const match = data.match(KITTY_CSI_U_REGEX);
if (!match) return undefined;
// CSI-u groups: <codepoint>[:<shifted>[:<base>]];<mod>u
const codepoint = Number.parseInt(match[1] ?? "", 10);
if (!Number.isFinite(codepoint)) return undefined;
const shiftedKey = match[2] && match[2].length > 0 ? Number.parseInt(match[2], 10) : undefined;
const modValue = match[4] ? Number.parseInt(match[4], 10) : 1;
// Modifiers are 1-indexed in CSI-u; normalize to our bitmask.
const modifier = Number.isFinite(modValue) ? modValue - 1 : 0;
// Ignore CSI-u sequences used for Alt/Ctrl shortcuts.
if (modifier & (KITTY_MOD_ALT | KITTY_MOD_CTRL)) return undefined;
// Prefer the shifted keycode when Shift is held.
let effectiveCodepoint = codepoint;
if (modifier & KITTY_MOD_SHIFT && typeof shiftedKey === "number") {
effectiveCodepoint = shiftedKey;
}
// Drop control characters or invalid codepoints.
if (!Number.isFinite(effectiveCodepoint) || effectiveCodepoint < 32) return undefined;
try {
return String.fromCodePoint(effectiveCodepoint);
} catch {
return undefined;
}
}
interface EditorState {
lines: string[];
cursorLine: number;
cursorCol: number;
}
interface LayoutLine {
text: string;
hasCursor: boolean;
cursorPos?: number;
}
export interface EditorTheme {
borderColor: (str: string) => string;
selectList: SelectListTheme;
}
export interface EditorOptions {
paddingX?: number;
}
export class Editor implements Component, Focusable {
private state: EditorState = {
lines: [""],
cursorLine: 0,
cursorCol: 0,
};
/** Focusable interface - set by TUI when focus changes */
focused: boolean = false;
protected tui: TUI;
private theme: EditorTheme;
private paddingX: number = 0;
// Store last render width for cursor navigation
private lastWidth: number = 80;
// Vertical scrolling support
private scrollOffset: number = 0;
// Border color (can be changed dynamically)
public borderColor: (str: string) => string;
// Autocomplete support
private autocompleteProvider?: AutocompleteProvider;
private autocompleteList?: SelectList;
private isAutocompleting: boolean = false;
private autocompletePrefix: string = "";
// Paste tracking for large pastes
private pastes: Map<number, string> = new Map();
private pasteCounter: number = 0;
// Bracketed paste mode buffering
private pasteBuffer: string = "";
private isInPaste: boolean = false;
private pendingShiftEnter: boolean = false;
// Prompt history for up/down navigation
private history: string[] = [];
private historyIndex: number = -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)
private killRing: string[] = [];
private lastAction: "kill" | "yank" | "type-word" | null = null;
// Undo support
private undoStack: EditorState[] = [];
public onSubmit?: (text: string) => void;
public onChange?: (text: string) => void;
public disableSubmit: boolean = false;
constructor(tui: TUI, theme: EditorTheme, options: EditorOptions = {}) {
this.tui = tui;
this.theme = theme;
this.borderColor = theme.borderColor;
const paddingX = options.paddingX ?? 0;
this.paddingX = Number.isFinite(paddingX) ? Math.max(0, Math.floor(paddingX)) : 0;
}
getPaddingX(): number {
return this.paddingX;
}
setPaddingX(padding: number): void {
const newPadding = Number.isFinite(padding) ? Math.max(0, Math.floor(padding)) : 0;
if (this.paddingX !== newPadding) {
this.paddingX = newPadding;
this.tui.requestRender();
}
}
setAutocompleteProvider(provider: AutocompleteProvider): void {
this.autocompleteProvider = provider;
}
/**
* Add a prompt to history for up/down arrow navigation.
* Called after successful submission.
*/
addToHistory(text: string): void {
const trimmed = text.trim();
if (!trimmed) return;
// Don't add consecutive duplicates
if (this.history.length > 0 && this.history[0] === trimmed) return;
this.history.unshift(trimmed);
// Limit history size
if (this.history.length > 100) {
this.history.pop();
}
}
private isEditorEmpty(): boolean {
return this.state.lines.length === 1 && this.state.lines[0] === "";
}
private isOnFirstVisualLine(): boolean {
const visualLines = this.buildVisualLineMap(this.lastWidth);
const currentVisualLine = this.findCurrentVisualLine(visualLines);
return currentVisualLine === 0;
}
private isOnLastVisualLine(): boolean {
const visualLines = this.buildVisualLineMap(this.lastWidth);
const currentVisualLine = this.findCurrentVisualLine(visualLines);
return currentVisualLine === visualLines.length - 1;
}
private navigateHistory(direction: 1 | -1): void {
this.lastAction = null;
if (this.history.length === 0) return;
const newIndex = this.historyIndex - direction; // Up(-1) increases index, Down(1) decreases
if (newIndex < -1 || newIndex >= this.history.length) return;
// Capture state when first entering history browsing mode
if (this.historyIndex === -1 && newIndex >= 0) {
this.pushUndoSnapshot();
}
this.historyIndex = newIndex;
if (this.historyIndex === -1) {
// Returned to "current" state - clear editor
this.setTextInternal("");
} else {
this.setTextInternal(this.history[this.historyIndex] || "");
}
}
/** Internal setText that doesn't reset history state - used by navigateHistory */
private setTextInternal(text: string): void {
// Reset kill ring state - external text changes break accumulation/yank chains
this.lastAction = null;
const lines = text.replace(/\r\n/g, "\n").replace(/\r/g, "\n").split("\n");
this.state.lines = lines.length === 0 ? [""] : lines;
this.state.cursorLine = this.state.lines.length - 1;
this.state.cursorCol = this.state.lines[this.state.cursorLine]?.length || 0;
// Reset scroll - render() will adjust to show cursor
this.scrollOffset = 0;
if (this.onChange) {
this.onChange(this.getText());
}
}
invalidate(): void {
// No cached state to invalidate currently
}
render(width: number): string[] {
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
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);
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: string[] = [];
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;
}
}
}
// 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}`);
}
}
return result;
}
handleInput(data: string): void {
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;
}
return;
}
if (this.pendingShiftEnter) {
if (data === "\r") {
this.pendingShiftEnter = false;
this.addNewLine();
return;
}
this.pendingShiftEnter = false;
this.insertCharacter("\\");
}
if (data === "\\") {
this.pendingShiftEnter = true;
return;
}
// Ctrl+C - let parent handle (exit/clear)
if (kb.matches(data, "copy")) {
return;
}
// Undo
if (kb.matches(data, "undo")) {
this.undo();
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) {
this.handleTabCompletion();
return;
}
// Deletion actions
if (kb.matches(data, "deleteToLineEnd")) {
this.deleteToEndOfLine();
return;
}
if (kb.matches(data, "deleteToLineStart")) {
this.deleteToStartOfLine();
return;
}
if (kb.matches(data, "deleteWordBackward")) {
this.deleteWordBackwards();
return;
}
if (kb.matches(data, "deleteWordForward")) {
this.deleteWordForward();
return;
}
if (kb.matches(data, "deleteCharBackward") || matchesKey(data, "shift+backspace")) {
this.handleBackspace();
return;
}
if (kb.matches(data, "deleteCharForward") || matchesKey(data, "shift+delete")) {
this.handleForwardDelete();
return;
}
// Kill ring actions
if (kb.matches(data, "yank")) {
this.yank();
return;
}
if (kb.matches(data, "yankPop")) {
this.yankPop();
return;
}
// Cursor movement actions
if (kb.matches(data, "cursorLineStart")) {
this.moveToLineStart();
return;
}
if (kb.matches(data, "cursorLineEnd")) {
this.moveToLineEnd();
return;
}
if (kb.matches(data, "cursorWordLeft")) {
this.moveWordBackwards();
return;
}
if (kb.matches(data, "cursorWordRight")) {
this.moveWordForwards();
return;
}
// 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.addNewLine();
return;
}
// 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;
}
// Arrow key navigation (with history support)
if (kb.matches(data, "cursorUp")) {
if (this.isEditorEmpty()) {
this.navigateHistory(-1);
} else if (this.historyIndex > -1 && this.isOnFirstVisualLine()) {
this.navigateHistory(-1);
} else {
this.moveCursor(-1, 0);
}
return;
}
if (kb.matches(data, "cursorDown")) {
if (this.historyIndex > -1 && this.isOnLastVisualLine()) {
this.navigateHistory(1);
} else {
this.moveCursor(1, 0);
}
return;
}
if (kb.matches(data, "cursorRight")) {
this.moveCursor(0, 1);
return;
}
if (kb.matches(data, "cursorLeft")) {
this.moveCursor(0, -1);
return;
}
// Page up/down - scroll by page and move cursor
if (kb.matches(data, "pageUp")) {
this.pageScroll(-1);
return;
}
if (kb.matches(data, "pageDown")) {
this.pageScroll(1);
return;
}
// Shift+Space - insert regular space
if (matchesKey(data, "shift+space")) {
this.insertCharacter(" ");
return;
}
const kittyPrintable = decodeKittyPrintable(data);
if (kittyPrintable !== undefined) {
this.insertCharacter(kittyPrintable);
return;
}
// Regular characters
if (data.charCodeAt(0) >= 32) {
this.insertCharacter(data);
}
}
private layoutText(contentWidth: number): LayoutLine[] {
const layoutLines: LayoutLine[] = [];
if (this.state.lines.length === 0 || (this.state.lines.length === 1 && this.state.lines[0] === "")) {
// Empty editor
layoutLines.push({
text: "",
hasCursor: true,
cursorPos: 0,
});
return layoutLines;
}
// Process each logical line
for (let i = 0; i < this.state.lines.length; i++) {
const line = this.state.lines[i] || "";
const isCurrentLine = i === this.state.cursorLine;
const lineVisibleWidth = visibleWidth(line);
if (lineVisibleWidth <= contentWidth) {
// Line fits in one layout line
if (isCurrentLine) {
layoutLines.push({
text: line,
hasCursor: true,
cursorPos: this.state.cursorCol,
});
} else {
layoutLines.push({
text: line,
hasCursor: false,
});
}
} else {
// Line needs wrapping - use word-aware wrapping
const chunks = wordWrapLine(line, contentWidth);
for (let chunkIndex = 0; chunkIndex < chunks.length; chunkIndex++) {
const chunk = chunks[chunkIndex];
if (!chunk) continue;
const cursorPos = this.state.cursorCol;
const isLastChunk = chunkIndex === chunks.length - 1;
// Determine if cursor is in this chunk
// For word-wrapped chunks, we need to handle the case where
// cursor might be in trimmed whitespace at end of chunk
let hasCursorInChunk = false;
let adjustedCursorPos = 0;
if (isCurrentLine) {
if (isLastChunk) {
// Last chunk: cursor belongs here if >= startIndex
hasCursorInChunk = cursorPos >= chunk.startIndex;
adjustedCursorPos = cursorPos - chunk.startIndex;
} else {
// Non-last chunk: cursor belongs here if in range [startIndex, endIndex)
// But we need to handle the visual position in the trimmed text
hasCursorInChunk = cursorPos >= chunk.startIndex && cursorPos < chunk.endIndex;
if (hasCursorInChunk) {
adjustedCursorPos = cursorPos - chunk.startIndex;
// Clamp to text length (in case cursor was in trimmed whitespace)
if (adjustedCursorPos > chunk.text.length) {
adjustedCursorPos = chunk.text.length;
}
}
}
}
if (hasCursorInChunk) {
layoutLines.push({
text: chunk.text,
hasCursor: true,
cursorPos: adjustedCursorPos,
});
} else {
layoutLines.push({
text: chunk.text,
hasCursor: false,
});
}
}
}
}
return layoutLines;
}
getText(): string {
return this.state.lines.join("\n");
}
/**
* Get text with paste markers expanded to their actual content.
* Use this when you need the full content (e.g., for external editor).
*/
getExpandedText(): string {
let result = this.state.lines.join("\n");
for (const [pasteId, pasteContent] of this.pastes) {
const markerRegex = new RegExp(`\\[paste #${pasteId}( (\\+\\d+ lines|\\d+ chars))?\\]`, "g");
result = result.replace(markerRegex, pasteContent);
}
return result;
}
getLines(): string[] {
return [...this.state.lines];
}
getCursor(): { line: number; col: number } {
return { line: this.state.cursorLine, col: this.state.cursorCol };
}
setText(text: string): void {
this.historyIndex = -1; // Exit history browsing mode
// Push undo snapshot if content differs (makes programmatic changes undoable)
if (this.getText() !== text) {
this.pushUndoSnapshot();
}
this.setTextInternal(text);
this.lastAction = null;
}
/**
* Insert text at the current cursor position.
* Used for programmatic insertion (e.g., clipboard image markers).
* This is atomic for undo - single undo restores entire pre-insert state.
*/
insertTextAtCursor(text: string): void {
if (!text) return;
this.pushUndoSnapshot();
this.lastAction = null;
this.historyIndex = -1;
this.insertTextAtCursorInternal(text);
}
/**
* Internal text insertion at cursor. Handles single and multi-line text.
* Does not push undo snapshots or trigger autocomplete - caller is responsible.
* Normalizes line endings and calls onChange once at the end.
*/
private insertTextAtCursorInternal(text: string): void {
if (!text) return;
// Normalize line endings
const normalized = text.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
const insertedLines = normalized.split("\n");
const currentLine = this.state.lines[this.state.cursorLine] || "";
const beforeCursor = currentLine.slice(0, this.state.cursorCol);
const afterCursor = currentLine.slice(this.state.cursorCol);
if (insertedLines.length === 1) {
// Single line - insert at cursor position
this.state.lines[this.state.cursorLine] = beforeCursor + normalized + afterCursor;
this.state.cursorCol += normalized.length;
} else {
// Multi-line insertion
const newLines: string[] = [];
// Add all lines before current line
for (let i = 0; i < this.state.cursorLine; i++) {
newLines.push(this.state.lines[i] || "");
}
// Add the first inserted line merged with text before cursor
newLines.push(beforeCursor + (insertedLines[0] || ""));
// Add all middle inserted lines
for (let i = 1; i < insertedLines.length - 1; i++) {
newLines.push(insertedLines[i] || "");
}
// Add the last inserted line with text after cursor
newLines.push((insertedLines[insertedLines.length - 1] || "") + afterCursor);
// Add all lines after current line
for (let i = this.state.cursorLine + 1; i < this.state.lines.length; i++) {
newLines.push(this.state.lines[i] || "");
}
this.state.lines = newLines;
this.state.cursorLine += insertedLines.length - 1;
this.state.cursorCol = (insertedLines[insertedLines.length - 1] || "").length;
}
if (this.onChange) {
this.onChange(this.getText());
}
}
// All the editor methods from before...
private insertCharacter(char: string, skipUndoCoalescing?: boolean): void {
this.historyIndex = -1; // Exit history browsing mode
// Undo coalescing (fish-style):
// - Consecutive word chars coalesce into one undo unit
// - Space captures state before itself (so undo removes space+following word together)
// - Each space is separately undoable
// Skip coalescing when called from atomic operations (e.g., handlePaste)
if (!skipUndoCoalescing) {
if (isWhitespaceChar(char) || this.lastAction !== "type-word") {
this.pushUndoSnapshot();
}
this.lastAction = "type-word";
}
const line = this.state.lines[this.state.cursorLine] || "";
const before = line.slice(0, this.state.cursorCol);
const after = line.slice(this.state.cursorCol);
this.state.lines[this.state.cursorLine] = before + char + after;
this.state.cursorCol += char.length; // Fix: increment by the length of the inserted string
if (this.onChange) {
this.onChange(this.getText());
}
// Check if we should trigger or update autocomplete
if (!this.isAutocompleting) {
// Auto-trigger for "/" at the start of a line (slash commands)
if (char === "/" && this.isAtStartOfMessage()) {
this.tryTriggerAutocomplete();
}
// Auto-trigger for "@" file reference (fuzzy search)
else if (char === "@") {
const currentLine = this.state.lines[this.state.cursorLine] || "";
const textBeforeCursor = currentLine.slice(0, this.state.cursorCol);
// Only trigger if @ is after whitespace or at start of line
const charBeforeAt = textBeforeCursor[textBeforeCursor.length - 2];
if (textBeforeCursor.length === 1 || charBeforeAt === " " || charBeforeAt === "\t") {
this.tryTriggerAutocomplete();
}
}
// Also auto-trigger when typing letters in a slash command context
else if (/[a-zA-Z0-9.\-_]/.test(char)) {
const currentLine = this.state.lines[this.state.cursorLine] || "";
const textBeforeCursor = currentLine.slice(0, this.state.cursorCol);
// Check if we're in a slash command (with or without space for arguments)
if (this.isInSlashCommandContext(textBeforeCursor)) {
this.tryTriggerAutocomplete();
}
// Check if we're in an @ file reference context
else if (textBeforeCursor.match(/(?:^|[\s])@[^\s]*$/)) {
this.tryTriggerAutocomplete();
}
}
} else {
this.updateAutocomplete();
}
}
private handlePaste(pastedText: string): void {
this.historyIndex = -1; // Exit history browsing mode
this.lastAction = null;
this.pushUndoSnapshot();
// Clean the pasted text
const cleanText = pastedText.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
// Convert tabs to spaces (4 spaces per tab)
const tabExpandedText = cleanText.replace(/\t/g, " ");
// Filter out non-printable characters except newlines
let filteredText = tabExpandedText
.split("")
.filter((char) => char === "\n" || char.charCodeAt(0) >= 32)
.join("");
// If pasting a file path (starts with /, ~, or .) and the character before
// the cursor is a word character, prepend a space for better readability
if (/^[/~.]/.test(filteredText)) {
const currentLine = this.state.lines[this.state.cursorLine] || "";
const charBeforeCursor = this.state.cursorCol > 0 ? currentLine[this.state.cursorCol - 1] : "";
if (charBeforeCursor && /\w/.test(charBeforeCursor)) {
filteredText = ` ${filteredText}`;
}
}
// Split into lines to check for large paste
const pastedLines = filteredText.split("\n");
// Check if this is a large paste (> 10 lines or > 1000 characters)
const totalChars = filteredText.length;
if (pastedLines.length > 10 || totalChars > 1000) {
// Store the paste and insert a marker
this.pasteCounter++;
const pasteId = this.pasteCounter;
this.pastes.set(pasteId, filteredText);
// Insert marker like "[paste #1 +123 lines]" or "[paste #1 1234 chars]"
const marker =
pastedLines.length > 10
? `[paste #${pasteId} +${pastedLines.length} lines]`
: `[paste #${pasteId} ${totalChars} chars]`;
this.insertTextAtCursorInternal(marker);
return;
}
if (pastedLines.length === 1) {
// Single line - insert character by character to trigger autocomplete
for (const char of filteredText) {
this.insertCharacter(char, true);
}
return;
}
// Multi-line paste - use direct state manipulation
this.insertTextAtCursorInternal(filteredText);
}
private addNewLine(): void {
this.historyIndex = -1; // Exit history browsing mode
this.lastAction = null;
this.pushUndoSnapshot();
const currentLine = this.state.lines[this.state.cursorLine] || "";
const before = currentLine.slice(0, this.state.cursorCol);
const after = currentLine.slice(this.state.cursorCol);
// Split current line
this.state.lines[this.state.cursorLine] = before;
this.state.lines.splice(this.state.cursorLine + 1, 0, after);
// Move cursor to start of new line
this.state.cursorLine++;
this.state.cursorCol = 0;
if (this.onChange) {
this.onChange(this.getText());
}
}
private handleBackspace(): void {
this.historyIndex = -1; // Exit history browsing mode
this.lastAction = null;
if (this.state.cursorCol > 0) {
this.pushUndoSnapshot();
// Delete grapheme before cursor (handles emojis, combining characters, etc.)
const line = this.state.lines[this.state.cursorLine] || "";
const beforeCursor = line.slice(0, this.state.cursorCol);
// Find the last grapheme in the text before cursor
const graphemes = [...segmenter.segment(beforeCursor)];
const lastGrapheme = graphemes[graphemes.length - 1];
const graphemeLength = lastGrapheme ? lastGrapheme.segment.length : 1;
const before = line.slice(0, this.state.cursorCol - graphemeLength);
const after = line.slice(this.state.cursorCol);
this.state.lines[this.state.cursorLine] = before + after;
this.state.cursorCol -= graphemeLength;
} else if (this.state.cursorLine > 0) {
this.pushUndoSnapshot();
// Merge with previous line
const currentLine = this.state.lines[this.state.cursorLine] || "";
const previousLine = this.state.lines[this.state.cursorLine - 1] || "";
this.state.lines[this.state.cursorLine - 1] = previousLine + currentLine;
this.state.lines.splice(this.state.cursorLine, 1);
this.state.cursorLine--;
this.state.cursorCol = previousLine.length;
}
if (this.onChange) {
this.onChange(this.getText());
}
// Update or re-trigger autocomplete after backspace
if (this.isAutocompleting) {
this.updateAutocomplete();
} else {
// If autocomplete was cancelled (no matches), re-trigger if we're in a completable context
const currentLine = this.state.lines[this.state.cursorLine] || "";
const textBeforeCursor = currentLine.slice(0, this.state.cursorCol);
// Slash command context
if (this.isInSlashCommandContext(textBeforeCursor)) {
this.tryTriggerAutocomplete();
}
// @ file reference context
else if (textBeforeCursor.match(/(?:^|[\s])@[^\s]*$/)) {
this.tryTriggerAutocomplete();
}
}
}
private moveToLineStart(): void {
this.lastAction = null;
this.state.cursorCol = 0;
}
private moveToLineEnd(): void {
this.lastAction = null;
const currentLine = this.state.lines[this.state.cursorLine] || "";
this.state.cursorCol = currentLine.length;
}
private deleteToStartOfLine(): void {
this.historyIndex = -1; // Exit history browsing mode
const currentLine = this.state.lines[this.state.cursorLine] || "";
if (this.state.cursorCol > 0) {
this.pushUndoSnapshot();
// Calculate text to be deleted and save to kill ring (backward deletion = prepend)
const deletedText = currentLine.slice(0, this.state.cursorCol);
this.addToKillRing(deletedText, true);
this.lastAction = "kill";
// Delete from start of line up to cursor
this.state.lines[this.state.cursorLine] = currentLine.slice(this.state.cursorCol);
this.state.cursorCol = 0;
} else if (this.state.cursorLine > 0) {
this.pushUndoSnapshot();
// At start of line - merge with previous line, treating newline as deleted text
this.addToKillRing("\n", true);
this.lastAction = "kill";
const previousLine = this.state.lines[this.state.cursorLine - 1] || "";
this.state.lines[this.state.cursorLine - 1] = previousLine + currentLine;
this.state.lines.splice(this.state.cursorLine, 1);
this.state.cursorLine--;
this.state.cursorCol = previousLine.length;
}
if (this.onChange) {
this.onChange(this.getText());
}
}
private deleteToEndOfLine(): void {
this.historyIndex = -1; // Exit history browsing mode
const currentLine = this.state.lines[this.state.cursorLine] || "";
if (this.state.cursorCol < currentLine.length) {
this.pushUndoSnapshot();
// Calculate text to be deleted and save to kill ring (forward deletion = append)
const deletedText = currentLine.slice(this.state.cursorCol);
this.addToKillRing(deletedText, false);
this.lastAction = "kill";
// Delete from cursor to end of line
this.state.lines[this.state.cursorLine] = currentLine.slice(0, this.state.cursorCol);
} else if (this.state.cursorLine < this.state.lines.length - 1) {
this.pushUndoSnapshot();
// At end of line - merge with next line, treating newline as deleted text
this.addToKillRing("\n", false);
this.lastAction = "kill";
const nextLine = this.state.lines[this.state.cursorLine + 1] || "";
this.state.lines[this.state.cursorLine] = currentLine + nextLine;
this.state.lines.splice(this.state.cursorLine + 1, 1);
}
if (this.onChange) {
this.onChange(this.getText());
}
}
private deleteWordBackwards(): void {
this.historyIndex = -1; // Exit history browsing mode
const currentLine = this.state.lines[this.state.cursorLine] || "";
// If at start of line, behave like backspace at column 0 (merge with previous line)
if (this.state.cursorCol === 0) {
if (this.state.cursorLine > 0) {
this.pushUndoSnapshot();
// Treat newline as deleted text (backward deletion = prepend)
this.addToKillRing("\n", true);
this.lastAction = "kill";
const previousLine = this.state.lines[this.state.cursorLine - 1] || "";
this.state.lines[this.state.cursorLine - 1] = previousLine + currentLine;
this.state.lines.splice(this.state.cursorLine, 1);
this.state.cursorLine--;
this.state.cursorCol = previousLine.length;
}
} else {
this.pushUndoSnapshot();
// Save lastAction before cursor movement (moveWordBackwards resets it)
const wasKill = this.lastAction === "kill";
const oldCursorCol = this.state.cursorCol;
this.moveWordBackwards();
const deleteFrom = this.state.cursorCol;
this.state.cursorCol = oldCursorCol;
// Restore kill state for accumulation check, then save to kill ring
this.lastAction = wasKill ? "kill" : null;
const deletedText = currentLine.slice(deleteFrom, this.state.cursorCol);
this.addToKillRing(deletedText, true);
this.lastAction = "kill";
this.state.lines[this.state.cursorLine] =
currentLine.slice(0, deleteFrom) + currentLine.slice(this.state.cursorCol);
this.state.cursorCol = deleteFrom;
}
if (this.onChange) {
this.onChange(this.getText());
}
}
private deleteWordForward(): void {
this.historyIndex = -1; // Exit history browsing mode
const currentLine = this.state.lines[this.state.cursorLine] || "";
// If at end of line, merge with next line (delete the newline)
if (this.state.cursorCol >= currentLine.length) {
if (this.state.cursorLine < this.state.lines.length - 1) {
this.pushUndoSnapshot();
// Treat newline as deleted text (forward deletion = append)
this.addToKillRing("\n", false);
this.lastAction = "kill";
const nextLine = this.state.lines[this.state.cursorLine + 1] || "";
this.state.lines[this.state.cursorLine] = currentLine + nextLine;
this.state.lines.splice(this.state.cursorLine + 1, 1);
}
} else {
this.pushUndoSnapshot();
// Save lastAction before cursor movement (moveWordForwards resets it)
const wasKill = this.lastAction === "kill";
const oldCursorCol = this.state.cursorCol;
this.moveWordForwards();
const deleteTo = this.state.cursorCol;
this.state.cursorCol = oldCursorCol;
// Restore kill state for accumulation check, then save to kill ring
this.lastAction = wasKill ? "kill" : null;
const deletedText = currentLine.slice(this.state.cursorCol, deleteTo);
this.addToKillRing(deletedText, false);
this.lastAction = "kill";
this.state.lines[this.state.cursorLine] =
currentLine.slice(0, this.state.cursorCol) + currentLine.slice(deleteTo);
}
if (this.onChange) {
this.onChange(this.getText());
}
}
private handleForwardDelete(): void {
this.historyIndex = -1; // Exit history browsing mode
this.lastAction = null;
const currentLine = this.state.lines[this.state.cursorLine] || "";
if (this.state.cursorCol < currentLine.length) {
this.pushUndoSnapshot();
// Delete grapheme at cursor position (handles emojis, combining characters, etc.)
const afterCursor = currentLine.slice(this.state.cursorCol);
// Find the first grapheme at cursor
const graphemes = [...segmenter.segment(afterCursor)];
const firstGrapheme = graphemes[0];
const graphemeLength = firstGrapheme ? firstGrapheme.segment.length : 1;
const before = currentLine.slice(0, this.state.cursorCol);
const after = currentLine.slice(this.state.cursorCol + graphemeLength);
this.state.lines[this.state.cursorLine] = before + after;
} else if (this.state.cursorLine < this.state.lines.length - 1) {
this.pushUndoSnapshot();
// At end of line - merge with next line
const nextLine = this.state.lines[this.state.cursorLine + 1] || "";
this.state.lines[this.state.cursorLine] = currentLine + nextLine;
this.state.lines.splice(this.state.cursorLine + 1, 1);
}
if (this.onChange) {
this.onChange(this.getText());
}
// Update or re-trigger autocomplete after forward delete
if (this.isAutocompleting) {
this.updateAutocomplete();
} else {
const currentLine = this.state.lines[this.state.cursorLine] || "";
const textBeforeCursor = currentLine.slice(0, this.state.cursorCol);
// Slash command context
if (this.isInSlashCommandContext(textBeforeCursor)) {
this.tryTriggerAutocomplete();
}
// @ file reference context
else if (textBeforeCursor.match(/(?:^|[\s])@[^\s]*$/)) {
this.tryTriggerAutocomplete();
}
}
}
/**
* Build a mapping from visual lines to logical positions.
* Returns an array where each element represents a visual line with:
* - logicalLine: index into this.state.lines
* - startCol: starting column in the logical line
* - length: length of this visual line segment
*/
private buildVisualLineMap(width: number): Array<{ logicalLine: number; startCol: number; length: number }> {
const visualLines: Array<{ logicalLine: number; startCol: number; length: number }> = [];
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;
}
/**
* Find the visual line index for the current cursor position.
*/
private findCurrentVisualLine(
visualLines: Array<{ logicalLine: number; startCol: number; length: number }>,
): number {
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;
}
private moveCursor(deltaLine: number, deltaCol: number): void {
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 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);
}
}
}
if (deltaCol !== 0) {
const currentLine = this.state.lines[this.state.cursorLine] || "";
if (deltaCol > 0) {
// Moving right - move by one grapheme (handles emojis, combining characters, etc.)
if (this.state.cursorCol < currentLine.length) {
const afterCursor = currentLine.slice(this.state.cursorCol);
const graphemes = [...segmenter.segment(afterCursor)];
const firstGrapheme = graphemes[0];
this.state.cursorCol += firstGrapheme ? firstGrapheme.segment.length : 1;
} else if (this.state.cursorLine < this.state.lines.length - 1) {
// Wrap to start of next logical line
this.state.cursorLine++;
this.state.cursorCol = 0;
}
} else {
// Moving left - move by one grapheme (handles emojis, combining characters, etc.)
if (this.state.cursorCol > 0) {
const beforeCursor = currentLine.slice(0, this.state.cursorCol);
const graphemes = [...segmenter.segment(beforeCursor)];
const lastGrapheme = graphemes[graphemes.length - 1];
this.state.cursorCol -= lastGrapheme ? lastGrapheme.segment.length : 1;
} else if (this.state.cursorLine > 0) {
// Wrap to end of previous logical line
this.state.cursorLine--;
const prevLine = this.state.lines[this.state.cursorLine] || "";
this.state.cursorCol = prevLine.length;
}
}
}
}
/**
* Scroll by a page (direction: -1 for up, 1 for down).
* Moves cursor by the page size while keeping it in bounds.
*/
private pageScroll(direction: -1 | 1): void {
this.lastAction = null;
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);
}
}
private moveWordBackwards(): void {
this.lastAction = null;
const currentLine = this.state.lines[this.state.cursorLine] || "";
// If at start of line, move to end of previous line
if (this.state.cursorCol === 0) {
if (this.state.cursorLine > 0) {
this.state.cursorLine--;
const prevLine = this.state.lines[this.state.cursorLine] || "";
this.state.cursorCol = prevLine.length;
}
return;
}
const textBeforeCursor = currentLine.slice(0, this.state.cursorCol);
const graphemes = [...segmenter.segment(textBeforeCursor)];
let newCol = this.state.cursorCol;
// Skip trailing whitespace
while (graphemes.length > 0 && isWhitespaceChar(graphemes[graphemes.length - 1]?.segment || "")) {
newCol -= graphemes.pop()?.segment.length || 0;
}
if (graphemes.length > 0) {
const lastGrapheme = graphemes[graphemes.length - 1]?.segment || "";
if (isPunctuationChar(lastGrapheme)) {
// Skip punctuation run
while (graphemes.length > 0 && isPunctuationChar(graphemes[graphemes.length - 1]?.segment || "")) {
newCol -= graphemes.pop()?.segment.length || 0;
}
} else {
// Skip word run
while (
graphemes.length > 0 &&
!isWhitespaceChar(graphemes[graphemes.length - 1]?.segment || "") &&
!isPunctuationChar(graphemes[graphemes.length - 1]?.segment || "")
) {
newCol -= graphemes.pop()?.segment.length || 0;
}
}
}
this.state.cursorCol = newCol;
}
/**
* Yank (paste) the most recent kill ring entry at cursor position.
*/
private yank(): void {
if (this.killRing.length === 0) return;
this.pushUndoSnapshot();
const text = this.killRing[this.killRing.length - 1] || "";
this.insertYankedText(text);
this.lastAction = "yank";
}
/**
* Cycle through kill ring (only works immediately after yank or yank-pop).
* Replaces the last yanked text with the previous entry in the ring.
*/
private yankPop(): void {
// Only works if we just yanked and have more than one entry
if (this.lastAction !== "yank" || this.killRing.length <= 1) return;
this.pushUndoSnapshot();
// Delete the previously yanked text (still at end of ring before rotation)
this.deleteYankedText();
// Rotate the ring: move end to front
const lastEntry = this.killRing.pop()!;
this.killRing.unshift(lastEntry);
// Insert the new most recent entry (now at end after rotation)
const text = this.killRing[this.killRing.length - 1];
this.insertYankedText(text);
this.lastAction = "yank";
}
/**
* Insert text at cursor position (used by yank operations).
*/
private insertYankedText(text: string): void {
this.historyIndex = -1; // Exit history browsing mode
const lines = text.split("\n");
if (lines.length === 1) {
// Single line - insert at cursor
const currentLine = this.state.lines[this.state.cursorLine] || "";
const before = currentLine.slice(0, this.state.cursorCol);
const after = currentLine.slice(this.state.cursorCol);
this.state.lines[this.state.cursorLine] = before + text + after;
this.state.cursorCol += text.length;
} else {
// Multi-line insert
const currentLine = this.state.lines[this.state.cursorLine] || "";
const before = currentLine.slice(0, this.state.cursorCol);
const after = currentLine.slice(this.state.cursorCol);
// First line merges with text before cursor
this.state.lines[this.state.cursorLine] = before + (lines[0] || "");
// Insert middle lines
for (let i = 1; i < lines.length - 1; i++) {
this.state.lines.splice(this.state.cursorLine + i, 0, lines[i] || "");
}
// Last line merges with text after cursor
const lastLineIndex = this.state.cursorLine + lines.length - 1;
this.state.lines.splice(lastLineIndex, 0, (lines[lines.length - 1] || "") + after);
// Update cursor position
this.state.cursorLine = lastLineIndex;
this.state.cursorCol = (lines[lines.length - 1] || "").length;
}
if (this.onChange) {
this.onChange(this.getText());
}
}
/**
* Delete the previously yanked text (used by yank-pop).
* The yanked text is derived from killRing[end] since it hasn't been rotated yet.
*/
private deleteYankedText(): void {
const yankedText = this.killRing[this.killRing.length - 1] || "";
if (!yankedText) return;
const yankLines = yankedText.split("\n");
if (yankLines.length === 1) {
// Single line - delete backward from cursor
const currentLine = this.state.lines[this.state.cursorLine] || "";
const deleteLen = yankedText.length;
const before = currentLine.slice(0, this.state.cursorCol - deleteLen);
const after = currentLine.slice(this.state.cursorCol);
this.state.lines[this.state.cursorLine] = before + after;
this.state.cursorCol -= deleteLen;
} else {
// Multi-line delete - cursor is at end of last yanked line
const startLine = this.state.cursorLine - (yankLines.length - 1);
const startCol = (this.state.lines[startLine] || "").length - (yankLines[0] || "").length;
// Get text after cursor on current line
const afterCursor = (this.state.lines[this.state.cursorLine] || "").slice(this.state.cursorCol);
// Get text before yank start position
const beforeYank = (this.state.lines[startLine] || "").slice(0, startCol);
// Remove all lines from startLine to cursorLine and replace with merged line
this.state.lines.splice(startLine, yankLines.length, beforeYank + afterCursor);
// Update cursor
this.state.cursorLine = startLine;
this.state.cursorCol = startCol;
}
if (this.onChange) {
this.onChange(this.getText());
}
}
/**
* Add text to the kill ring.
* If lastAction is "kill", accumulates with the previous entry.
* @param text - The text to add
* @param prepend - If accumulating, prepend (true) or append (false) to existing entry
*/
private addToKillRing(text: string, prepend: boolean): void {
if (!text) return;
if (this.lastAction === "kill" && this.killRing.length > 0) {
// Accumulate with the most recent entry (at end of array)
const lastEntry = this.killRing.pop();
if (prepend) {
this.killRing.push(text + lastEntry);
} else {
this.killRing.push(lastEntry + text);
}
} else {
// Add new entry to end of ring
this.killRing.push(text);
}
}
private captureUndoSnapshot(): EditorState {
return structuredClone(this.state);
}
private restoreUndoSnapshot(snapshot: EditorState): void {
Object.assign(this.state, structuredClone(snapshot));
}
private pushUndoSnapshot(): void {
this.undoStack.push(this.captureUndoSnapshot());
}
private undo(): void {
this.historyIndex = -1; // Exit history browsing mode
if (this.undoStack.length === 0) return;
const snapshot = this.undoStack.pop()!;
this.restoreUndoSnapshot(snapshot);
this.lastAction = null;
if (this.onChange) {
this.onChange(this.getText());
}
}
private moveWordForwards(): void {
this.lastAction = null;
const currentLine = this.state.lines[this.state.cursorLine] || "";
// If at end of line, move to start of next line
if (this.state.cursorCol >= currentLine.length) {
if (this.state.cursorLine < this.state.lines.length - 1) {
this.state.cursorLine++;
this.state.cursorCol = 0;
}
return;
}
const textAfterCursor = currentLine.slice(this.state.cursorCol);
const segments = segmenter.segment(textAfterCursor);
const iterator = segments[Symbol.iterator]();
let next = iterator.next();
// Skip leading whitespace
while (!next.done && isWhitespaceChar(next.value.segment)) {
this.state.cursorCol += next.value.segment.length;
next = iterator.next();
}
if (!next.done) {
const firstGrapheme = next.value.segment;
if (isPunctuationChar(firstGrapheme)) {
// Skip punctuation run
while (!next.done && isPunctuationChar(next.value.segment)) {
this.state.cursorCol += next.value.segment.length;
next = iterator.next();
}
} else {
// Skip word run
while (!next.done && !isWhitespaceChar(next.value.segment) && !isPunctuationChar(next.value.segment)) {
this.state.cursorCol += next.value.segment.length;
next = iterator.next();
}
}
}
}
// Slash menu only allowed when all other lines are empty (no mixed content)
private isSlashMenuAllowed(): boolean {
for (let i = 0; i < this.state.lines.length; i++) {
if (i === this.state.cursorLine) continue;
if (this.state.lines[i].trim() !== "") return false;
}
return true;
}
// Helper method to check if cursor is at start of message (for slash command detection)
private isAtStartOfMessage(): boolean {
if (!this.isSlashMenuAllowed()) return false;
const currentLine = this.state.lines[this.state.cursorLine] || "";
const beforeCursor = currentLine.slice(0, this.state.cursorCol);
return beforeCursor.trim() === "" || beforeCursor.trim() === "/";
}
private isInSlashCommandContext(textBeforeCursor: string): boolean {
return this.isSlashMenuAllowed() && textBeforeCursor.trimStart().startsWith("/");
}
// Autocomplete methods
private tryTriggerAutocomplete(explicitTab: boolean = false): void {
if (!this.autocompleteProvider) return;
// Check if we should trigger file completion on Tab
if (explicitTab) {
const provider = this.autocompleteProvider as CombinedAutocompleteProvider;
const shouldTrigger =
!provider.shouldTriggerFileCompletion ||
provider.shouldTriggerFileCompletion(this.state.lines, this.state.cursorLine, this.state.cursorCol);
if (!shouldTrigger) {
return;
}
}
const suggestions = this.autocompleteProvider.getSuggestions(
this.state.lines,
this.state.cursorLine,
this.state.cursorCol,
);
if (suggestions && suggestions.items.length > 0) {
this.autocompletePrefix = suggestions.prefix;
this.autocompleteList = new SelectList(suggestions.items, 5, this.theme.selectList);
this.isAutocompleting = true;
} else {
this.cancelAutocomplete();
}
}
private handleTabCompletion(): void {
if (!this.autocompleteProvider) return;
const currentLine = this.state.lines[this.state.cursorLine] || "";
const beforeCursor = currentLine.slice(0, this.state.cursorCol);
// Check if we're in a slash command context
if (this.isInSlashCommandContext(beforeCursor) && !beforeCursor.trimStart().includes(" ")) {
this.handleSlashCommandCompletion();
} else {
this.forceFileAutocomplete();
}
}
private handleSlashCommandCompletion(): void {
this.tryTriggerAutocomplete(true);
}
/*
https://github.com/EsotericSoftware/spine-runtimes/actions/runs/19536643416/job/559322883
17 this job fails with https://github.com/EsotericSoftware/spine-runtimes/actions/runs/19
536643416/job/55932288317 havea look at .gi
*/
private forceFileAutocomplete(): void {
if (!this.autocompleteProvider) return;
// Check if provider supports force file suggestions via runtime check
const provider = this.autocompleteProvider as {
getForceFileSuggestions?: CombinedAutocompleteProvider["getForceFileSuggestions"];
};
if (typeof provider.getForceFileSuggestions !== "function") {
this.tryTriggerAutocomplete(true);
return;
}
const suggestions = provider.getForceFileSuggestions(
this.state.lines,
this.state.cursorLine,
this.state.cursorCol,
);
if (suggestions && suggestions.items.length > 0) {
this.autocompletePrefix = suggestions.prefix;
this.autocompleteList = new SelectList(suggestions.items, 5, this.theme.selectList);
this.isAutocompleting = true;
} else {
this.cancelAutocomplete();
}
}
private cancelAutocomplete(): void {
this.isAutocompleting = false;
this.autocompleteList = undefined;
this.autocompletePrefix = "";
}
public isShowingAutocomplete(): boolean {
return this.isAutocompleting;
}
private updateAutocomplete(): void {
if (!this.isAutocompleting || !this.autocompleteProvider) return;
const suggestions = this.autocompleteProvider.getSuggestions(
this.state.lines,
this.state.cursorLine,
this.state.cursorCol,
);
if (suggestions && suggestions.items.length > 0) {
this.autocompletePrefix = suggestions.prefix;
// Always create new SelectList to ensure update
this.autocompleteList = new SelectList(suggestions.items, 5, this.theme.selectList);
} else {
this.cancelAutocomplete();
}
}
}