@giovannijecha/jecode 0.1.5-rc.2

package/dist/tui/app.js

@@ -0,0 +1,215 @@
+// The TUI shell: keys in, frames out, one turn at a time.
+//
+// Everything mutable about a session lives in `state` here. The view is a pure
+// function of it, so the only job of a key handler is to change state and ask
+// for a repaint — never to draw.
+import { begin, elapsed } from "./activity.js";
+import * as overlay from "./overlay.js";
+import { options as completionOptions } from "./complete.js";
+import { decoder } from "./keys.js";
+import { painter } from "./frame.js";
+import { commandFeedback, feedbackController, turnBlocker } from "./feedback.js";
+import * as realScreen from "./screen.js";
+import { compose } from "./view.js";
+import { preserveOffset } from "./scroll.js";
+import { footerInfo } from "./session-view.js";
+import { workspaceLabel } from "./workspace.js";
+import { transcriptRenderer } from "./transcript-view.js";
+import { appState } from "./app-state.js";
+import { appInput } from "./app-input.js";
+import { appWorkflows } from "./app-workflows.js";
+const FRAME_MS = 16;
+const SPIN_MS = 80;
+/** How long a lone escape waits to prove it is not the start of a sequence. */
+const ESCAPE_MS = 25;
+export async function runApp(session, transcriptRoot, environment = {}) {
+    const terminal = environment.screen ?? realScreen;
+    const paint = environment.paint ?? painter();
+    const keys = decoder();
+    const transcript = transcriptRenderer();
+    const workspace = await workspaceLabel(session.config.root);
+    const state = appState();
+    // Tools the user said "always" to. It lives for the window and dies with it:
+    // a permission granted once, in one conversation, is not a setting.
+    const allowed = new Map();
+    let closed;
+    let frameTimer;
+    let spinTimer;
+    let stopResize = () => { };
+    let stopInput = () => { };
+    // Timers outlive the teardown they were scheduled before. Painting after the
+    // terminal has been handed back would write escapes into the user's shell.
+    let live = true;
+    const done = new Promise((resolve) => {
+        closed = resolve;
+    });
+    const view = () => ({
+        blocks: state.blocks,
+        editor: state.editor,
+        scroll: state.scroll,
+        unseen: state.unseen,
+        pal: session.palette,
+        footer: footerInfo(session, workspace),
+        status: state.status === undefined || state.activity === undefined
+            ? state.status
+            : `${state.status} · ${elapsed(state.activity)}`,
+        feedback: state.feedback,
+        readiness: turnBlocker(session),
+        spin: state.spin,
+        reducedMotion: session.config.reducedMotion,
+        modal: overlay.shown(state.open),
+        menu: completionOptions(state.completing),
+        menuIndex: state.completing?.index,
+    });
+    const draw = () => {
+        frameTimer = undefined;
+        if (!live)
+            return;
+        let frame = compose(view(), terminal.size(), transcript);
+        // Preserve the exact rows being read while streaming grows the transcript.
+        // `scroll` is measured from the bottom, so new rows increase that offset.
+        if (!state.follow && frame.maxScroll > state.lastMaxScroll) {
+            state.scroll = preserveOffset(state.scroll, state.follow, state.lastMaxScroll, frame.maxScroll);
+            frame = compose(view(), terminal.size(), transcript);
+        }
+        // Composing is what discovers how far there is to scroll, so the clamp
+        // lands here rather than in every place that moves the viewport.
+        state.scroll = Math.min(state.scroll, frame.maxScroll);
+        if (state.scroll === 0) {
+            state.follow = true;
+            state.unseen = 0;
+        }
+        state.lastMaxScroll = frame.maxScroll;
+        paint.paint(frame.rows, frame.cursor);
+    };
+    // Streaming produces a token at a time; painting at that rate is wasted
+    // work, so repaints coalesce onto one frame.
+    const render = (block) => {
+        if (block !== undefined)
+            transcript.invalidate(block);
+        if (live && frameTimer === undefined)
+            frameTimer = setTimeout(draw, FRAME_MS);
+    };
+    const feedback = feedbackController((next) => {
+        state.feedback = next;
+        render();
+    });
+    const emit = (block) => {
+        state.blocks.push(block);
+        if (state.follow)
+            state.scroll = 0;
+        else
+            state.unseen++;
+    };
+    const commandOutput = (block) => {
+        const next = commandFeedback(block);
+        if (next === undefined)
+            emit(block);
+        else
+            feedback.show(next);
+    };
+    const scrollBy = (amount) => {
+        state.scroll = Math.max(0, state.scroll + amount);
+        state.follow = state.scroll === 0;
+        if (state.follow)
+            state.unseen = 0;
+    };
+    function quit() {
+        if (!live)
+            return;
+        live = false;
+        stopInput();
+        stopResize();
+        if (spinTimer !== undefined)
+            clearInterval(spinTimer);
+        if (frameTimer !== undefined)
+            clearTimeout(frameTimer);
+        feedback.close();
+        terminal.leave();
+        closed?.();
+    }
+    function requestQuit() {
+        const activity = state.activity;
+        if (activity === undefined) {
+            quit();
+            return;
+        }
+        state.closeWhenIdle = true;
+        state.open = overlay.cancel(state.open);
+        activity.control.abort(new Error("interrupted"));
+    }
+    function startActivity(kind, label) {
+        if (state.activity !== undefined)
+            return undefined;
+        const activity = begin(kind, label);
+        state.activity = activity;
+        state.status = label;
+        spinTimer = setInterval(() => {
+            if (!session.config.reducedMotion)
+                state.spin++;
+            render();
+        }, session.config.reducedMotion ? 1_000 : SPIN_MS);
+        render();
+        return activity;
+    }
+    function finishActivity(activity) {
+        if (state.activity !== activity)
+            return;
+        if (spinTimer !== undefined)
+            clearInterval(spinTimer);
+        spinTimer = undefined;
+        state.activity = undefined;
+        state.status = undefined;
+        state.open = overlay.cancel(state.open);
+        if (state.closeWhenIdle)
+            quit();
+        else
+            render();
+    }
+    const actions = appWorkflows({
+        session,
+        transcriptRoot,
+        state,
+        allowed,
+        feedback,
+        emit,
+        commandOutput,
+        render,
+        refreshSettings: () => {
+            terminal.setReducedMotion(session.config.reducedMotion);
+            paint.invalidate();
+            render();
+        },
+        startActivity,
+        finishActivity,
+    });
+    const input = appInput({
+        session,
+        state,
+        feedback,
+        actions,
+        live: () => live,
+        quit,
+        requestQuit,
+        scrollBy,
+        invalidate: () => paint.invalidate(),
+        transcriptChanged: (block) => transcript.invalidate(block),
+    });
+    terminal.enter(session.config.reducedMotion);
+    stopResize = terminal.onResize(() => {
+        paint.invalidate();
+        draw();
+    });
+    stopInput = terminal.onInput((chunk) => {
+        for (const key of keys.push(chunk))
+            input.handle(key);
+        setTimeout(() => {
+            for (const key of keys.flush())
+                input.handle(key);
+            render();
+        }, ESCAPE_MS);
+        render();
+    });
+    draw();
+    await done;
+}

package/dist/tui/approve.js

@@ -0,0 +1,67 @@
+// The permission question: what is being asked, and the answers on offer.
+//
+// A permission prompt is the one moment the agent hands control back, so it is
+// worth more than a line of prose and a key to guess at. It is a menu — the
+// generic one — with an attention title and three answers written out.
+// Nothing is approved by a key nobody meant to press.
+/**
+ * The narrow permission represented by "always".
+ *
+ * File-changing tools share a grant for one displayed path. Shell grants are
+ * tied to the exact command line. Unknown dangerous tools fall back to their
+ * exact, stable input rather than silently inheriting a tool-wide grant.
+ */
+export function scopeFor(call) {
+    const path = typeof call.input.path === "string" ? call.input.path : undefined;
+    if ((call.name === "write_file" || call.name === "edit_file") && path !== undefined) {
+        return { key: `file\0${path}`, label: `changes to ${path}`, summary: `file changes · ${path}` };
+    }
+    const command = typeof call.input.command === "string" ? call.input.command : undefined;
+    if (call.name === "run_command" && command !== undefined) {
+        return { key: `command\0${command}`, label: "this exact command", summary: `command · ${command}` };
+    }
+    return {
+        key: `${call.name}\0${stable(call.input)}`,
+        label: "this exact call",
+        summary: `${call.name} · ${target(call.input)}`,
+    };
+}
+export function promptFor(call, target, pal) {
+    const scope = scopeFor(call);
+    const options = [
+        { label: `Run this ${call.name === "edit_file" ? "edit" : "call"} once`, hint: "enter", key: "y" },
+        { label: `Allow ${scope.label} this session`, hint: "a", key: "a" },
+        { label: "Deny and add feedback", hint: "esc", key: "n" },
+    ];
+    return {
+        title: [
+            { text: "Permission required", fg: pal.ink.attention, bold: true },
+            { text: `  ${call.name}`, fg: pal.ink.muted },
+            ...(target === "" ? [] : [{ text: ` ${target}`, fg: pal.ink.muted }]),
+        ],
+        description: "Review the exact action above, then choose.",
+        footer: "Enter to select · Esc to deny",
+        options,
+        index: 0,
+    };
+}
+function stable(value) {
+    if (Array.isArray(value))
+        return `[${value.map(stable).join(",")}]`;
+    if (value !== null && typeof value === "object") {
+        return `{${Object.entries(value)
+            .sort(([a], [b]) => a.localeCompare(b))
+            .map(([key, item]) => `${JSON.stringify(key)}:${stable(item)}`)
+            .join(",")}}`;
+    }
+    return JSON.stringify(value);
+}
+function target(input) {
+    const value = input.path ?? input.command;
+    return typeof value === "string" ? value : stable(input);
+}
+const ANSWERS = ["once", "always", "no"];
+/** What picking row `index` meant. Anything unrecognised refuses. */
+export function answerAt(index) {
+    return index === undefined ? "no" : (ANSWERS[index] ?? "no");
+}

package/dist/tui/blocks.js

@@ -0,0 +1,23 @@
+// Semantic transcript blocks routed to small, owned production components.
+import { renderAnswer, renderReasoning, renderUser } from "./components/messages.js";
+import { renderList, renderNotice } from "./components/misc.js";
+import { renderTool } from "./components/tool.js";
+export function render(block, width, pal) {
+    switch (block.kind) {
+        case "user":
+            return renderUser(block, width, pal);
+        case "answer":
+            return renderAnswer(block, width, pal);
+        case "reasoning":
+            return renderReasoning(block, width, pal);
+        case "tool":
+            return renderTool(block, width, pal);
+        case "notice":
+            return renderNotice(block, width, pal);
+        case "list":
+            return renderList(block, width, pal);
+    }
+}
+export function renderAll(blocks, width, pal) {
+    return blocks.flatMap((block) => render(block, width, pal));
+}

package/dist/tui/complete.js

@@ -0,0 +1,54 @@
+// Completing a slash command.
+//
+// A command the user cannot remember is a command that does not exist, and
+// `/help` only helps someone who already knows to ask. So the menu appears
+// while the line is being typed. Selection is state, not an edit: arrows move
+// through the list without rewriting what the user typed.
+import { COMMANDS } from "../commands.js";
+/**
+ * The commands a half-typed line still matches.
+ *
+ * Empty once the line carries an argument: at that point the user is naming a
+ * model, not choosing a command, and a menu would be noise over the answer.
+ */
+export function matches(text) {
+    if (!text.startsWith("/"))
+        return [];
+    const typed = text.slice(1);
+    if (/\s/.test(typed))
+        return [];
+    return COMMANDS.filter((command) => command.name.startsWith(typed.toLowerCase()));
+}
+/**
+ * The nth match of `prefix`, or undefined when there is nothing to complete.
+ *
+ * The prefix is what the user typed, not what tab last wrote: completing `/`
+ * to `/help` would otherwise leave a line that matches only itself, and the
+ * second tab would have nowhere to go.
+ */
+export function pick(prefix, index) {
+    const list = matches(prefix);
+    if (list.length === 0)
+        return undefined;
+    const at = ((index % list.length) + list.length) % list.length;
+    return `/${list[at].name}`;
+}
+export function activate(text) {
+    return matches(text).length === 0 ? undefined : { prefix: text, index: 0 };
+}
+export function move(completion, step) {
+    const count = matches(completion.prefix).length;
+    if (count === 0)
+        return completion;
+    return {
+        ...completion,
+        index: ((completion.index + step) % count + count) % count,
+    };
+}
+export function selected(completion) {
+    return pick(completion.prefix, completion.index);
+}
+/** Suggestions stay visible only while completion mode is active. */
+export function options(completion) {
+    return completion === undefined ? [] : matches(completion.prefix);
+}

package/dist/tui/components/command-menu.js

@@ -0,0 +1,17 @@
+import { menuWindow, renderMenuRows } from "./menu.js";
+const MAX_ROWS = 4;
+export function renderCommandMenu(commands, selected, width, pal) {
+    const selectedIndex = selected === undefined ? 0 : Math.max(0, Math.min(commands.length - 1, selected));
+    const { first, last } = menuWindow(commands.length, selectedIndex, MAX_ROWS);
+    const shown = commands.slice(first, last);
+    if (shown.length === 0)
+        return [];
+    return renderMenuRows(shown.map((command, index) => ({
+        label: `/${command.name}`,
+        description: command.blurb,
+        selected: selectedIndex === first + index,
+    })), width, pal);
+}
+export function commandMenuLimit() {
+    return MAX_ROWS;
+}

package/dist/tui/components/composer.js

@@ -0,0 +1,47 @@
+import { row } from "../../ui/render.js";
+import { charWidth, graphemes } from "../../ui/width.js";
+export function renderComposer(editor, width, maxInputRows, pal) {
+    const laid = layout(editor, Math.max(1, width));
+    const room = Math.max(1, maxInputRows);
+    const first = Math.max(0, Math.min(laid.lines.length - room, laid.cursor.row));
+    const shown = laid.lines.slice(first, first + room);
+    return {
+        rows: shown.map((line) => row(width, [{ text: line, fg: pal.ink.bright }])),
+        cursor: { row: laid.cursor.row - first, col: laid.cursor.col },
+    };
+}
+function layout(editor, width) {
+    const lines = [];
+    let line = "";
+    let used = 0;
+    let index = 0;
+    let cursor = { row: 0, col: 0 };
+    const place = () => {
+        cursor = { row: lines.length, col: used };
+    };
+    const feed = () => {
+        lines.push(line);
+        line = "";
+        used = 0;
+    };
+    for (const cluster of graphemes(editor.text)) {
+        if (index === editor.cursor)
+            place();
+        index += cluster.length;
+        if (cluster === "\n") {
+            feed();
+            continue;
+        }
+        const cells = charWidth(cluster);
+        if (used + cells > width)
+            feed();
+        line += cluster;
+        used += cells;
+        if (used >= width)
+            feed();
+    }
+    if (index === editor.cursor)
+        place();
+    lines.push(line);
+    return { lines, cursor };
+}

package/dist/tui/components/dock.js

@@ -0,0 +1,10 @@
+// The one shell shared by every interaction at the bottom of the screen.
+import { rule } from "../../ui/render.js";
+export function renderDock(body, width, pal, active) {
+    return {
+        rows: [rule(width, active ? pal.focus : pal.rule), ...body.rows, rule(width, active ? pal.focus : pal.rule)],
+        cursor: body.cursor === undefined
+            ? undefined
+            : { row: body.cursor.row + 1, col: body.cursor.col },
+    };
+}

package/dist/tui/components/footer.js

@@ -0,0 +1,21 @@
+import { fitSegs, plainLen, row } from "../../ui/render.js";
+import { elide, textWidth } from "../../ui/width.js";
+export function renderFooter(info, status, width, pal) {
+    const rightLimit = Math.min(width, Math.max(12, Math.floor(width * 0.58)));
+    const right = fitSegs(status, rightLimit);
+    const leftRoom = Math.max(0, width - plainLen(right) - (right.length === 0 ? 0 : 1));
+    const left = identity(info, leftRoom);
+    return [row(width, left === "" ? [] : [{ text: left, fg: pal.ink.muted }], right)];
+}
+function identity(info, cols) {
+    if (cols <= 0)
+        return "";
+    const core = `${info.model || "no model"} · ${info.effort}`;
+    if (textWidth(core) >= cols || info.workspace === "")
+        return elide(core, cols);
+    const divider = " · ";
+    const workspaceRoom = cols - textWidth(core) - textWidth(divider);
+    return workspaceRoom <= 0
+        ? core
+        : `${core}${divider}${elide(info.workspace, workspaceRoom)}`;
+}

package/dist/tui/components/menu.js

@@ -0,0 +1,38 @@
+// One visual row grammar for autocomplete and every interactive selector.
+import { plainLen, row } from "../../ui/render.js";
+import { elide } from "../../ui/width.js";
+export function renderMenuRows(entries, width, pal) {
+    if (entries.length === 0)
+        return [];
+    const widest = Math.max(...entries.map(primaryWidth));
+    const labelWidth = Math.min(42, Math.max(12, widest + 2));
+    return entries.map((entry) => renderEntry(entry, labelWidth, width, pal));
+}
+export function menuWindow(length, selected, visible) {
+    const count = Math.max(0, length);
+    const room = Math.max(1, visible);
+    const at = count === 0 ? 0 : Math.max(0, Math.min(count - 1, selected));
+    const first = Math.max(0, Math.min(at - Math.floor(room / 2), count - room));
+    return { first, last: Math.min(count, first + room) };
+}
+function renderEntry(entry, labelWidth, width, pal) {
+    const fg = entry.selected ? pal.accent : pal.ink.fg;
+    const primary = [
+        { text: entry.selected ? "→ " : "  ", fg },
+        { text: entry.label, fg },
+    ];
+    if (width > 40 && entry.description !== undefined) {
+        const gap = Math.max(2, labelWidth - primaryWidth(entry));
+        primary.push({ text: `${" ".repeat(gap)}${entry.description}`, fg: entry.selected ? pal.accent : pal.ink.muted });
+    }
+    const right = width > 40 && entry.hint !== undefined
+        ? [{
+                text: elide(entry.hint, Math.max(1, Math.floor(width / 4))),
+                fg: entry.selected ? pal.accent : pal.ink.muted,
+            }]
+        : [];
+    return row(width, primary, right);
+}
+function primaryWidth(entry) {
+    return plainLen([{ text: entry.label }]);
+}

package/dist/tui/components/messages.js

@@ -0,0 +1,43 @@
+import { blank, row } from "../../ui/render.js";
+import { markdown } from "../../ui/markdown.js";
+const PAD = 1;
+export const REASONING_PREVIEW_ROWS = 3;
+export function renderUser(block, width, pal) {
+    const inner = Math.max(8, width - PAD * 2);
+    const content = markdown(block.text, inner, pal, inner);
+    return [
+        "",
+        blank(width, pal.surface.subtle),
+        ...content.map((line) => row(width, line.segs, [], pal.surface.subtle, PAD)),
+        blank(width, pal.surface.subtle),
+    ];
+}
+export function renderAnswer(block, width, pal) {
+    const inner = Math.max(8, width - PAD * 2);
+    return [
+        "",
+        ...markdown(block.text, inner, pal, inner).map((line) => row(width, line.segs, [], undefined, PAD)),
+    ];
+}
+export function renderReasoning(block, width, pal) {
+    const inner = Math.max(8, width - PAD * 2);
+    const content = markdown(block.text, inner, pal, inner);
+    const expanded = block.expanded === true;
+    const visible = expanded ? content : content.slice(-REASONING_PREVIEW_ROWS);
+    const action = expanded
+        ? "ctrl+o compact"
+        : content.length > REASONING_PREVIEW_ROWS
+            ? "ctrl+o full"
+            : undefined;
+    return [
+        "",
+        row(width, [
+            {
+                text: block.live === true ? "thinking" : "thought",
+                fg: pal.ink.bright,
+                bold: true,
+            },
+        ], action === undefined ? [] : [{ text: action, fg: pal.ink.muted }], undefined, PAD),
+        ...visible.map((line) => row(width, line.segs.map((seg) => ({ ...seg, fg: pal.ink.muted, italic: true })), [], undefined, PAD)),
+    ];
+}

package/dist/tui/components/misc.js

@@ -0,0 +1,22 @@
+import { row, wrap } from "../../ui/render.js";
+export function renderNotice(block, width, pal) {
+    const fg = {
+        info: pal.ink.muted,
+        warn: pal.ink.attention,
+        error: pal.ink.removed,
+    };
+    const mark = block.tone === "error" ? "× " : block.tone === "warn" ? "! " : "· ";
+    return [
+        "",
+        ...wrap(block.text, Math.max(1, width - 3)).map((line, index) => row(width, [
+            { text: index === 0 ? mark : "  ", fg: fg[block.tone], bold: index === 0 },
+            { text: line, fg: fg[block.tone] },
+        ], [], undefined, 1)),
+    ];
+}
+export function renderList(block, width, pal) {
+    return [
+        "",
+        ...block.items.map((item) => row(width, [{ text: item.text, fg: item.dim ? pal.ink.muted : pal.ink.fg }], [], undefined, 1)),
+    ];
+}

package/dist/tui/components/status.js

@@ -0,0 +1,45 @@
+const SPINNER = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+export function spinner(tick) {
+    return SPINNER[tick % SPINNER.length];
+}
+/** Styled content for the footer's replaceable right-hand status channel. */
+export function renderStatus(info, pal) {
+    const urgent = info.feedback?.tone === "warn" || info.feedback?.tone === "error"
+        ? info.feedback
+        : undefined;
+    if (urgent !== undefined)
+        return withUnseen(feedbackSegments(urgent, pal), info.unseen, pal);
+    if (info.status !== undefined) {
+        return withUnseen([
+            { text: `${info.reducedMotion ? "•" : spinner(info.tick)} `, fg: pal.accent },
+            { text: `${info.status} (esc to interrupt)`, fg: pal.ink.muted },
+        ], info.unseen, pal);
+    }
+    if (info.feedback !== undefined) {
+        return withUnseen(feedbackSegments(info.feedback, pal), info.unseen, pal);
+    }
+    if (info.unseen > 0)
+        return unseenSegments(info.unseen, pal);
+    return info.readiness === undefined ? [] : feedbackSegments(info.readiness, pal);
+}
+function feedbackSegments(feedback, pal) {
+    const mark = feedback.tone === "error" ? "×" : feedback.tone === "warn" ? "!" : "·";
+    const markColor = {
+        info: pal.accent,
+        warn: pal.ink.attention,
+        error: pal.ink.removed,
+    };
+    const textColor = feedback.tone === "error" ? pal.ink.removed : pal.ink.muted;
+    return [
+        { text: `${mark} `, fg: markColor[feedback.tone], bold: true },
+        { text: feedback.text, fg: textColor },
+    ];
+}
+function withUnseen(status, unseen, pal) {
+    return unseen === 0
+        ? status
+        : [...status, { text: " · ", fg: pal.ink.muted }, ...unseenSegments(unseen, pal)];
+}
+function unseenSegments(unseen, pal) {
+    return [{ text: `${unseen} new ↓`, fg: pal.accent, bold: true }];
+}