sakuracode 0.0.0-stage → 0.1.0

package/dist/code/src/tui/keys.js

@@ -0,0 +1,151 @@
+// Decoding raw terminal input into key events. Understands arrows, Home/End/Delete, Ctrl and Alt combinations,
+// Shift-Enter in the common encodings, and bracketed paste (which may arrive in several chunks).
+const PASTE_START = "\u001b[200~";
+const PASTE_END = "\u001b[201~";
+const CSI_FINAL = { A: "up", B: "down", C: "right", D: "left", H: "home", F: "end", Z: "tab" };
+const CSI_TILDE = { "1": "home", "2": "insert", "3": "delete", "4": "end", "5": "pageup", "6": "pagedown", "7": "home", "8": "end" };
+export function createKeyDecoder() {
+    let pasteBuffer;
+    let carry = "";
+    function decode(input) {
+        const events = [];
+        let text = "";
+        const flushText = () => {
+            if (text)
+                events.push({ name: "char", text });
+            text = "";
+        };
+        let index = 0;
+        while (index < input.length) {
+            const char = input[index];
+            if (char === "\u001b") {
+                flushText();
+                const parsed = parseEscape(input, index);
+                if (parsed.incomplete) {
+                    carry = input.slice(index);
+                    return events;
+                }
+                events.push(...parsed.events);
+                index += parsed.length;
+                continue;
+            }
+            const code = char.charCodeAt(0);
+            if (char === "\r") {
+                flushText();
+                events.push({ name: "enter" });
+            }
+            else if (char === "\n") {
+                flushText();
+                events.push({ name: "enter", ctrl: true });
+            }
+            else if (char === "\t") {
+                flushText();
+                events.push({ name: "tab" });
+            }
+            else if (code === 0x7f || code === 0x08) {
+                flushText();
+                events.push({ name: "backspace" });
+            }
+            else if (code >= 1 && code <= 26) {
+                flushText();
+                events.push({ name: String.fromCharCode(code + 96), ctrl: true });
+            }
+            else if (code < 32) {
+                flushText();
+            }
+            else
+                text += char;
+            index += 1;
+        }
+        flushText();
+        return events;
+    }
+    return {
+        push(chunk) {
+            let input = carry + chunk;
+            carry = "";
+            const events = [];
+            for (;;) {
+                if (pasteBuffer !== undefined) {
+                    const end = input.indexOf(PASTE_END);
+                    if (end === -1) {
+                        pasteBuffer += input;
+                        return events;
+                    }
+                    events.push({ name: "paste", text: (pasteBuffer + input.slice(0, end)).replace(/\r\n?/g, "\n") });
+                    pasteBuffer = undefined;
+                    input = input.slice(end + PASTE_END.length);
+                    continue;
+                }
+                const start = input.indexOf(PASTE_START);
+                if (start === -1) {
+                    events.push(...decode(input));
+                    return events;
+                }
+                events.push(...decode(input.slice(0, start)));
+                pasteBuffer = "";
+                input = input.slice(start + PASTE_START.length);
+            }
+        },
+    };
+}
+function modifiers(code) {
+    const bits = code - 1;
+    return { ...(bits & 1 ? { shift: true } : {}), ...(bits & 2 ? { alt: true } : {}), ...(bits & 4 ? { ctrl: true } : {}) };
+}
+function parseEscape(input, index) {
+    const next = input[index + 1];
+    if (next === undefined)
+        return { events: [{ name: "escape" }], length: 1 };
+    if (next === "[") {
+        const match = /^\u001b\[([0-9;:?]*)([@-~])/.exec(input.slice(index));
+        if (!match)
+            return { events: [], length: 0, incomplete: true };
+        const [whole, params = "", final = ""] = match;
+        const numbers = params.split(";").map((part) => Number.parseInt(part, 10));
+        const mod = numbers[1] ? modifiers(numbers[1]) : {};
+        if (final === "~") {
+            if (numbers[0] === 27 && numbers[2] === 13)
+                return { events: [{ name: "enter", ...modifiers(numbers[1] ?? 1) }], length: whole.length };
+            const name = CSI_TILDE[String(numbers[0])];
+            return { events: name ? [{ name, ...mod }] : [], length: whole.length };
+        }
+        if (final === "u") {
+            const code = numbers[0] ?? 0;
+            const m = modifiers(numbers[1] ?? 1);
+            if (code === 13)
+                return { events: [{ name: "enter", ...m }], length: whole.length };
+            if (code === 27)
+                return { events: [{ name: "escape" }], length: whole.length };
+            if (code === 9)
+                return { events: [{ name: "tab", ...m }], length: whole.length };
+            if (code === 127)
+                return { events: [{ name: "backspace", ...m }], length: whole.length };
+            if (code >= 32 && !m.ctrl && !m.alt)
+                return { events: [{ name: "char", text: String.fromCodePoint(code) }], length: whole.length };
+            if (code >= 97 && code <= 122)
+                return { events: [{ name: String.fromCharCode(code), ...m }], length: whole.length };
+            return { events: [], length: whole.length };
+        }
+        const name = CSI_FINAL[final];
+        if (name === "tab")
+            return { events: [{ name: "tab", shift: true }], length: whole.length };
+        return { events: name ? [{ name, ...mod }] : [], length: whole.length };
+    }
+    if (next === "O") {
+        const final = input[index + 2];
+        if (final === undefined)
+            return { events: [], length: 0, incomplete: true };
+        const name = CSI_FINAL[final];
+        return { events: name ? [{ name }] : [], length: 3 };
+    }
+    if (next === "\r")
+        return { events: [{ name: "enter", alt: true }], length: 2 };
+    if (next === "\u007f")
+        return { events: [{ name: "backspace", alt: true }], length: 2 };
+    const code = next.codePointAt(0);
+    const length = 1 + String.fromCodePoint(code).length;
+    if (code >= 1 && code <= 26)
+        return { events: [{ name: String.fromCharCode(code + 96), ctrl: true, alt: true }], length };
+    return { events: [{ name: "char", text: String.fromCodePoint(code), alt: true }], length };
+}

package/dist/code/src/tui/line-editor.js

@@ -0,0 +1,324 @@
+// The text of the prompt: a buffer with a cursor, multi-line editing, history and the usual readline keys. Pure state; no output.
+import { displayWidth } from "../ansi.js";
+/** A paste longer than this many characters, or with more lines, is shown as a placeholder (the limit Codex uses, plus a line limit). */
+export const PASTE_FOLD_CHARS = 1000;
+export const PASTE_FOLD_LINES = 5;
+/** Placeholder of the n-th paste of a size, in Codex's wording: "[Pasted Content 1234 chars]", then "… chars #2". */
+function placeholderFor(chars, taken) {
+    const base = `[Pasted Content ${chars} chars`;
+    let label = `${base}]`;
+    for (let copy = 2; taken.has(label); copy += 1)
+        label = `${base} #${copy}]`;
+    return label;
+}
+const segmenter = new Intl.Segmenter(undefined, { granularity: "grapheme" });
+function graphemes(text) {
+    return Array.from(segmenter.segment(text), (entry) => entry.segment);
+}
+export function createLineEditor() {
+    let text = "";
+    let cursor = 0; // index into `text` in UTF-16 units, always on a grapheme boundary
+    let historyIndex;
+    let draft = "";
+    let killed = "";
+    /** placeholder -> the pasted text it stands for; every key occurs in `text` */
+    let pastes = new Map();
+    let draftPastes = new Map();
+    const history = [];
+    /** Where a placeholder starts that contains position `at` strictly inside, else `at`. */
+    const snapToStart = (at) => {
+        for (const key of pastes.keys())
+            for (let from = text.indexOf(key); from !== -1; from = text.indexOf(key, from + 1))
+                if (at > from && at < from + key.length)
+                    return from;
+        return at;
+    };
+    const snapToEnd = (at) => {
+        for (const key of pastes.keys())
+            for (let from = text.indexOf(key); from !== -1; from = text.indexOf(key, from + 1))
+                if (at > from && at < from + key.length)
+                    return from + key.length;
+        return at;
+    };
+    const prune = () => {
+        for (const key of pastes.keys())
+            if (!text.includes(key))
+                pastes.delete(key);
+    };
+    /** Text that is too big for the composer, as a placeholder that remembers it. */
+    const fold = (value) => {
+        if (value.length <= PASTE_FOLD_CHARS && value.split("\n").length <= PASTE_FOLD_LINES)
+            return value;
+        const label = placeholderFor(value.length, pastes);
+        pastes.set(label, value);
+        return label;
+    };
+    const lineStart = (at) => text.lastIndexOf("\n", at - 1) + 1;
+    const lineEnd = (at) => {
+        const found = text.indexOf("\n", at);
+        return found === -1 ? text.length : found;
+    };
+    const previousBoundary = (at) => {
+        const before = graphemes(text.slice(0, at));
+        return snapToStart(at - (before[before.length - 1]?.length ?? 0));
+    };
+    const nextBoundary = (at) => snapToEnd(at + (graphemes(text.slice(at))[0]?.length ?? 0));
+    const isWordChar = (char) => /[\p{L}\p{N}_]/u.test(char);
+    function wordLeft(at) {
+        let position = at;
+        while (position > 0 && !isWordChar(text[position - 1]))
+            position -= 1;
+        while (position > 0 && isWordChar(text[position - 1]))
+            position -= 1;
+        return snapToStart(position);
+    }
+    function wordRight(at) {
+        let position = at;
+        while (position < text.length && !isWordChar(text[position]))
+            position += 1;
+        while (position < text.length && isWordChar(text[position]))
+            position += 1;
+        return snapToEnd(position);
+    }
+    const insert = (value) => {
+        text = text.slice(0, cursor) + value + text.slice(cursor);
+        cursor += value.length;
+        historyIndex = undefined;
+    };
+    const remove = (from, to) => {
+        killed = text.slice(from, to);
+        text = text.slice(0, from) + text.slice(to);
+        cursor = from;
+        prune();
+        historyIndex = undefined;
+    };
+    function column(at) {
+        return displayWidth(text.slice(lineStart(at), at));
+    }
+    function indexAtColumn(start, end, wanted) {
+        let position = start;
+        let used = 0;
+        for (const part of graphemes(text.slice(start, end))) {
+            const width = displayWidth(part);
+            if (used + width > wanted)
+                break;
+            used += width;
+            position += part.length;
+        }
+        return position;
+    }
+    function moveUp() {
+        const start = lineStart(cursor);
+        if (start === 0)
+            return false;
+        const previousStart = lineStart(start - 1);
+        cursor = snapToStart(indexAtColumn(previousStart, start - 1, column(cursor)));
+        return true;
+    }
+    function moveDown() {
+        const end = lineEnd(cursor);
+        if (end >= text.length)
+            return false;
+        const nextStart = end + 1;
+        cursor = snapToStart(indexAtColumn(nextStart, lineEnd(nextStart), column(cursor)));
+        return true;
+    }
+    function showHistory(index) {
+        historyIndex = index;
+        const entry = index === undefined ? { text: draft, pastes: draftPastes } : history[index];
+        text = entry.text;
+        pastes = new Map(entry.pastes);
+        cursor = text.length;
+    }
+    return {
+        value: () => text,
+        expanded() {
+            let result = text;
+            for (const [label, full] of pastes)
+                result = result.split(label).join(full);
+            return result;
+        },
+        cursor: () => cursor,
+        set(value) {
+            pastes = new Map();
+            text = fold(value);
+            cursor = text.length;
+            historyIndex = undefined;
+        },
+        clear() {
+            text = "";
+            cursor = 0;
+            pastes = new Map();
+            historyIndex = undefined;
+        },
+        remember(value) {
+            if (value.trim() !== "" && history[history.length - 1]?.text !== value)
+                history.push({ text: value, pastes: new Map([...pastes].filter(([label]) => value.includes(label))) });
+            historyIndex = undefined;
+        },
+        handle(key) {
+            const withoutCtrl = !key.ctrl && !key.alt;
+            switch (key.name) {
+                case "char":
+                    insert(key.text.replace(/\r\n?/g, "\n"));
+                    return "none";
+                case "paste":
+                    insert(fold((key.text ?? "").replace(/\r\n?/g, "\n")));
+                    return "none";
+                case "enter":
+                    if (key.shift || key.alt || key.ctrl) {
+                        insert("\n");
+                        return "none";
+                    }
+                    if (text[cursor - 1] === "\\") {
+                        // a backslash before Enter means "new line" in terminals that cannot tell Shift-Enter apart
+                        text = text.slice(0, cursor - 1) + "\n" + text.slice(cursor);
+                        return "none";
+                    }
+                    return "submit";
+                case "tab":
+                    return key.shift ? "shift-tab" : "tab";
+                case "escape":
+                    return "escape";
+                case "backspace":
+                    if (key.alt)
+                        remove(wordLeft(cursor), cursor);
+                    else if (cursor > 0)
+                        remove(previousBoundary(cursor), cursor);
+                    return "none";
+                case "delete":
+                    if (cursor < text.length)
+                        remove(cursor, nextBoundary(cursor));
+                    return "none";
+                case "left":
+                    cursor = key.ctrl || key.alt ? wordLeft(cursor) : previousBoundary(cursor);
+                    return "none";
+                case "right":
+                    cursor = key.ctrl || key.alt ? wordRight(cursor) : nextBoundary(cursor);
+                    return "none";
+                case "home":
+                    cursor = lineStart(cursor);
+                    return "none";
+                case "end":
+                    cursor = lineEnd(cursor);
+                    return "none";
+                case "up":
+                    if (moveUp())
+                        return "none";
+                    if (history.length > 0 && withoutCtrl) {
+                        if (historyIndex === undefined) {
+                            draft = text;
+                            draftPastes = pastes;
+                            showHistory(history.length - 1);
+                        }
+                        else if (historyIndex > 0)
+                            showHistory(historyIndex - 1);
+                        cursor = 0;
+                    }
+                    return "none";
+                case "down":
+                    if (moveDown())
+                        return "none";
+                    if (historyIndex !== undefined && withoutCtrl)
+                        showHistory(historyIndex + 1 < history.length ? historyIndex + 1 : undefined);
+                    return "none";
+                case "pageup":
+                    return "page-up";
+                case "pagedown":
+                    return "page-down";
+                case "a":
+                    if (key.ctrl)
+                        cursor = lineStart(cursor);
+                    else if (key.alt)
+                        insert("a");
+                    return "none";
+                case "e":
+                    if (key.ctrl)
+                        cursor = lineEnd(cursor);
+                    return "none";
+                case "b":
+                    if (key.ctrl)
+                        cursor = previousBoundary(cursor);
+                    return "none";
+                case "f":
+                    if (key.ctrl)
+                        cursor = nextBoundary(cursor);
+                    return "none";
+                case "k":
+                    if (key.ctrl)
+                        remove(cursor, cursor === lineEnd(cursor) ? Math.min(text.length, cursor + 1) : lineEnd(cursor));
+                    return "none";
+                case "u":
+                    if (key.ctrl)
+                        remove(lineStart(cursor), cursor);
+                    return "none";
+                case "w":
+                    if (key.ctrl)
+                        remove(wordLeft(cursor), cursor);
+                    return "none";
+                case "y":
+                    if (key.ctrl && killed)
+                        insert(killed);
+                    return "none";
+                case "d":
+                    if (key.ctrl) {
+                        if (text === "")
+                            return "eof";
+                        if (cursor < text.length)
+                            remove(cursor, nextBoundary(cursor));
+                    }
+                    return "none";
+                case "c":
+                    return key.ctrl ? "interrupt" : "none";
+                case "j":
+                    if (key.ctrl)
+                        insert("\n");
+                    return "none";
+                case "l":
+                    return "none";
+                default:
+                    return "none";
+            }
+        },
+        layout(width) {
+            return layoutText(text, cursor, width);
+        },
+    };
+}
+/** Cuts text into display rows (hard wrap by columns) and locates the cursor. */
+export function layoutText(text, cursor, width) {
+    const limit = Math.max(2, width);
+    const rows = [];
+    let cursorRow = 0;
+    let cursorCol = 0;
+    let offset = 0;
+    for (const line of text.split("\n")) {
+        let row = "";
+        let used = 0;
+        let rowStartOffset = offset;
+        const place = (at) => {
+            if (cursor === at) {
+                cursorRow = rows.length;
+                cursorCol = used;
+            }
+        };
+        for (const part of graphemes(line)) {
+            const partWidth = displayWidth(part);
+            if (used + partWidth > limit) {
+                rows.push(row);
+                row = "";
+                used = 0;
+                rowStartOffset = offset;
+            }
+            place(offset);
+            row += part;
+            used += partWidth;
+            offset += part.length;
+        }
+        place(offset); // the position after the last character of this line
+        void rowStartOffset;
+        rows.push(row);
+        offset += 1; // the newline
+    }
+    return { rows, cursorRow, cursorCol };
+}

package/dist/code/src/tui/live-region.js

@@ -0,0 +1,71 @@
+// The bottom part of the screen that is redrawn in place (working indicator, prompt, status line), while finished
+// output is printed above it and stays in the terminal's own scrollback. No alternate screen, so the user can scroll
+// back and select text as in any shell.
+const SYNC_BEGIN = "\u001b[?2026h";
+const SYNC_END = "\u001b[?2026l";
+export function createLiveRegion(out, options = {}) {
+    let live = [];
+    let cursor = { row: 0, col: 0 };
+    let drawn = false;
+    /** Blank rows between the last printed line and the live area. */
+    let gap = 0;
+    /** Rows of printed output since the screen was empty (capped at the screen height). */
+    let contentRows = 0;
+    const screenRows = () => out.rows ?? 0;
+    const wantedGap = () => (options.pinned && screenRows() > 0 ? Math.max(0, screenRows() - contentRows - live.length) : 0);
+    /** Moves from the text cursor back to the first column of the end of the printed output and erases down. */
+    const eraseCommand = () => {
+        if (!drawn)
+            return "";
+        const up = cursor.row + gap;
+        return `${up > 0 ? `\u001b[${up}A` : ""}\r\u001b[J`;
+    };
+    function paintCommand() {
+        if (live.length === 0) {
+            gap = 0;
+            return "";
+        }
+        gap = wantedGap();
+        const lastRow = live.length - 1;
+        const up = lastRow - cursor.row;
+        return `${"\n".repeat(gap)}${live.join("\n")}${up > 0 ? `\u001b[${up}A` : ""}\r${cursor.col > 0 ? `\u001b[${cursor.col}C` : ""}`;
+    }
+    const emit = (text) => out.write(`${SYNC_BEGIN}${text}${SYNC_END}`);
+    return {
+        print(lines) {
+            if (lines.length === 0)
+                return;
+            const erase = eraseCommand();
+            contentRows = Math.min(contentRows + lines.length, Math.max(screenRows(), 1));
+            emit(`${erase}${lines.map((line) => `${line}\n`).join("")}${paintCommand()}`);
+            drawn = live.length > 0;
+        },
+        setLive(lines, nextCursor) {
+            const erase = eraseCommand();
+            live = lines;
+            cursor = nextCursor;
+            emit(`${erase}${paintCommand()}`);
+            drawn = live.length > 0;
+        },
+        clear() {
+            emit(eraseCommand());
+            live = [];
+            cursor = { row: 0, col: 0 };
+            drawn = false;
+            gap = 0;
+        },
+        forget() {
+            // after a resize or a screen clear what is on the screen is unknown: carry on from the cursor, without padding
+            drawn = false;
+            live = [];
+            cursor = { row: 0, col: 0 };
+            gap = 0;
+            contentRows = Math.max(screenRows(), 1);
+        },
+        cleared() {
+            this.forget();
+            contentRows = 0;
+        },
+        width: () => out.columns ?? 80,
+    };
+}

package/dist/code/src/tui/screen.js

@@ -0,0 +1,69 @@
+// What the live area looks like for a given state: progress above, the prompt box, the status line and a popup under it.
+// Pure: state in, lines and cursor position out.
+import { createPalette, truncate, wrapAnsi } from "../ansi.js";
+import { sessionLabel } from "../session-store.js";
+export const SPINNER = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+const PROMPT = "› ";
+export function composeLive(state) {
+    const pal = createPalette(state.color);
+    const width = Math.max(20, state.width);
+    const lines = [];
+    if (state.streamingTail.trim() !== "") {
+        const tail = wrapAnsi(state.streamingTail.replace(/\s+$/, ""), width - 2).slice(-2);
+        for (const line of tail)
+            lines.push(truncate(pal.dim(`  ${line}`), width));
+    }
+    if (state.reasoning.trim() !== "")
+        lines.push(truncate(pal.dim(`  thinking: …${state.reasoning.replace(/\s+/g, " ").trim().slice(-Math.max(10, width - 16))}`), width));
+    const spinner = SPINNER[state.frame % SPINNER.length];
+    for (const tool of state.runningTools.slice(-3))
+        lines.push(truncate(`${pal.cyan(spinner)} ${pal.bold(tool.name)} ${tool.summary}`, width));
+    if (state.working)
+        lines.push(truncate(pal.dim(`${spinner} Working (${state.elapsedSeconds}s) · Esc to cancel · Enter to steer · Tab to queue`), width));
+    for (const message of state.pending.slice(-3))
+        lines.push(truncate(pal.dim(`  ↳ ${message.kind === "steer" ? "steering" : "queued"}: ${message.text.replace(/\s+/g, " ")}`), width));
+    if (state.hint)
+        lines.push(truncate(pal.yellow(state.hint), width));
+    if (state.picker) {
+        const { picker } = state;
+        lines.push(pal.dim("─".repeat(width)));
+        lines.push(pal.bold(picker.title) + pal.dim("  ↑/↓ choose · Enter open · Esc cancel"));
+        const first = Math.max(0, Math.min(picker.index - 3, picker.items.length - 8));
+        for (let index = first; index < Math.min(picker.items.length, first + 8); index += 1) {
+            const item = picker.items[index];
+            const when = new Date(item.updatedAt).toISOString().slice(0, 16).replace("T", " ");
+            const row = `${index === picker.index ? "›" : " "} ${when}  ${item.id.slice(0, 8)}  ${sessionLabel(item)}`;
+            lines.push(truncate(index === picker.index ? pal.cyan(row) : row, width));
+        }
+        return { lines, cursor: { row: lines.length - 1, col: 0 } };
+    }
+    lines.push(pal.dim("─".repeat(width)));
+    const window = composerWindow(state.composer, state.maxComposerRows ?? 8);
+    const composerTop = lines.length;
+    if (window.above > 0)
+        lines.push(pal.dim(`  … +${window.above} lines`));
+    window.rows.forEach((row, index) => lines.push(`${index === 0 && window.above === 0 ? pal.bold(pal.cyan(PROMPT)) : "  "}${row}`));
+    if (window.below > 0)
+        lines.push(pal.dim(`  … +${window.below} lines`));
+    const cursor = { row: composerTop + (window.above > 0 ? 1 : 0) + window.cursorRow, col: PROMPT.length + state.composer.cursorCol };
+    lines.push(pal.dim(truncate(` ${state.statusLine}`, width)));
+    if (state.popup) {
+        const { commands, index } = state.popup;
+        const first = Math.max(0, Math.min(index - 2, commands.length - 6));
+        for (let position = first; position < Math.min(commands.length, first + 6); position += 1) {
+            const command = commands[position];
+            const row = `${position === index ? "›" : " "} /${command.name.padEnd(12)} ${command.summary}`;
+            lines.push(truncate(position === index ? pal.cyan(row) : pal.dim(row), width));
+        }
+    }
+    return { lines, cursor };
+}
+/** The rows of the composer that fit in `limit` rows (two of them may be taken by "… +N lines" markers), around the cursor. */
+export function composerWindow(composer, limit) {
+    const total = composer.rows.length;
+    if (total <= limit)
+        return { rows: composer.rows, above: 0, below: 0, cursorRow: composer.cursorRow };
+    const visible = Math.max(1, limit - 2);
+    const start = Math.max(0, Math.min(composer.cursorRow - Math.floor(visible / 2), total - visible));
+    return { rows: composer.rows.slice(start, start + visible), above: start, below: total - start - visible, cursorRow: composer.cursorRow - start };
+}