agent-from-zero 0.30.0 → 0.32.0

package/dist/output.js

@@ -0,0 +1,50 @@
+import ora from "ora"; // the "thinking…" spinner the default sink drives
+import { MarkdownStream } from "./markdown.js"; // the default sink renders the streamed answer as terminal markdown
+import { mark } from "./ui.js"; // the ⏺ answer marker, kept consistent with the rest of the UI
+// ---- the default sink: stdout, identical to the pre-sink behaviour -----------
+class StdoutSpinner {
+    s;
+    constructor(text) {
+        // discardStdin:false — ora would otherwise swallow Ctrl+C while spinning.
+        this.s = ora({ text, discardStdin: false }).start();
+    }
+    set(text) {
+        if (this.s.isSpinning)
+            this.s.text = text;
+    }
+    stop() {
+        if (this.s.isSpinning)
+            this.s.stop();
+    }
+    get spinning() {
+        return this.s.isSpinning;
+    }
+}
+// The sink the readline REPL (and every non-Ink caller) gets when it passes no
+// `output`. Each method is the exact line the loop used to run inline.
+export const STDOUT_OUTPUT = {
+    spinner: (text) => new StdoutSpinner(text),
+    reasoning: (line) => process.stdout.write(line + "\n"),
+    answer: () => {
+        // Lazily build the MarkdownStream on the first token (so a tool-only or
+        // empty turn prints nothing), then end with a single trailing newline —
+        // exactly the old `if (printedPrefix) process.stdout.write("\n")`.
+        let md = null;
+        let printed = false;
+        return {
+            push(token) {
+                if (!md)
+                    md = new MarkdownStream((s) => process.stdout.write(s), { firstPrefix: "\n" + mark.answer, indent: "  " });
+                printed = true;
+                md.push(token);
+            },
+            end() {
+                if (md)
+                    md.end();
+                if (printed)
+                    process.stdout.write("\n");
+            },
+        };
+    },
+    note: (line) => console.log(line),
+};

package/dist/tui.js

@@ -107,6 +107,18 @@ export function revealToolCalls() {
     process.stdout.write(toolCallLog.join("\n") + "\n");
     return true;
 }
+// Ink variants of the two reveals: RETURN the formatted block (or null) instead
+// of writing to stdout, so the Ink REPL can commit it as a note in its tree.
+export function getReasoning() {
+    if (!reasoningTrace.length)
+        return null;
+    return chalk.dim("💭 model's thinking:\n") + chalk.dim(reasoningTrace.join("\n\n— — —\n\n").replace(/^/gm, "  "));
+}
+export function getToolCalls() {
+    if (!toolCallLog.length)
+        return null;
+    return chalk.dim(`tool calls this turn (${toolCallLog.length}):\n`) + toolCallLog.join("\n");
+}
 // ---- cleanup -----------------------------------------------------------------
 // Called on exit. Nothing fancy to restore now (we no longer hijack the bottom
 // of the screen), but keep the hook so callers don't have to change if that

package/dist/ui.js

@@ -1,4 +1,5 @@
 import chalk from "chalk"; // the one place color lives
+import { displayWidth } from "./editor.js"; // CJK-/ANSI-aware width, to pad the sent-message bar to the full row
 // The app's visual theme, in one place. Before this, emoji and colors were
 // sprinkled across agent.ts and loop.ts — no coherent look, and impossible to
 // restyle without hunting. This module owns "what the tool looks like": the
@@ -124,6 +125,19 @@ export function inputRule() {
 export function framedPrompt(planMode) {
     return planMode ? chalk.yellow.bold("⏸ plan ❯ ") : chalk.cyan.bold("❯ ");
 }
+// How a SUBMITTED message is echoed into the scrollback once you hit Enter:
+// a "> …" line on a full-width highlight BAR (like Claude Code), so each turn
+// reads as a distinct sent message scrolling up — not just faint text. The line
+// is padded to the terminal width so the background spans the whole row; if the
+// message is longer than the row it just wraps (the tail line won't be padded,
+// a minor cosmetic). Colors fall back gracefully when the terminal lacks 256.
+export function sentMessage(text) {
+    const cols = Math.max(20, process.stdout.columns || 80);
+    const content = "> " + text;
+    const w = displayWidth(content);
+    const padded = w < cols ? content + " ".repeat(cols - w) : content; // fill the row when it fits
+    return chalk.bgAnsi256(237).ansi256(252)(padded); // light-grey text on a subtle dark-grey bar
+}
 // ---- the selection menu -----------------------------------------------------
 // Render a numbered list of options with one highlighted. The interactive part
 // (raw-mode arrow keys) lives in menu.ts; this is just the pure drawing, so it's

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agent-from-zero",
-  "version": "0.30.0",
+  "version": "0.32.0",
   "description": "Build a Claude Code-style CLI agent from scratch, with AI as your pair programmer — companion code for a 10-day tutorial (DeepSeek by default, any OpenAI-compatible model)",
   "type": "module",
   "bin": {
@@ -12,11 +12,12 @@
   ],
   "scripts": {
     "start": "tsx --env-file=.env src/agent.ts",
+    "ink": "tsx --env-file=.env src/ink/main.tsx",
     "typecheck": "tsc --noEmit",
     "eval": "tsx --env-file=.env eval/run.ts",
     "build": "tsc -p tsconfig.build.json",
     "prepare": "npm run build",
-    "test": "tsx tests/tools.test.ts && tsx tests/permissions.test.ts && tsx tests/context.test.ts && tsx tests/hooks.test.ts && tsx tests/mcp.test.ts && tsx tests/judge.test.ts && tsx tests/memory.test.ts && tsx tests/cost.test.ts && tsx tests/validate.test.ts && tsx tests/plan.test.ts && tsx tests/diff.test.ts && tsx tests/undo.test.ts && tsx tests/tiering.test.ts && tsx tests/mcp-http.test.ts && tsx tests/changes.test.ts && tsx tests/mentions.test.ts && tsx tests/session.test.ts && tsx tests/ui.test.ts && tsx tests/approval.test.ts && tsx tests/form.test.ts && tsx tests/model.test.ts && tsx tests/reasoning.test.ts && tsx tests/skills.test.ts && tsx tests/markdown.test.ts && tsx tests/editor.test.ts && tsx tests/todos.test.ts && tsx tests/background.test.ts && tsx tests/team.test.ts && tsx tests/board.test.ts && tsx tests/drop.test.ts"
+    "test": "tsx tests/tools.test.ts && tsx tests/permissions.test.ts && tsx tests/context.test.ts && tsx tests/hooks.test.ts && tsx tests/mcp.test.ts && tsx tests/judge.test.ts && tsx tests/memory.test.ts && tsx tests/cost.test.ts && tsx tests/validate.test.ts && tsx tests/plan.test.ts && tsx tests/diff.test.ts && tsx tests/undo.test.ts && tsx tests/tiering.test.ts && tsx tests/mcp-http.test.ts && tsx tests/changes.test.ts && tsx tests/mentions.test.ts && tsx tests/session.test.ts && tsx tests/ui.test.ts && tsx tests/approval.test.ts && tsx tests/form.test.ts && tsx tests/model.test.ts && tsx tests/reasoning.test.ts && tsx tests/skills.test.ts && tsx tests/markdown.test.ts && tsx tests/editor.test.ts && tsx tests/todos.test.ts && tsx tests/background.test.ts && tsx tests/team.test.ts && tsx tests/board.test.ts && tsx tests/drop.test.ts && tsx tests/editline.test.ts"
   },
   "engines": {
     "node": ">=20.6"
@@ -25,14 +26,17 @@
   "dependencies": {
     "chalk": "^5.6.2",
     "cli-table3": "^0.6.5",
+    "ink": "^5.2.1",
     "marked": "^15.0.12",
     "marked-terminal": "^7.3.0",
     "openai": "^6.42.0",
     "ora": "^9.4.0",
+    "react": "^18.3.1",
     "wrap-ansi": "^10.0.0"
   },
   "devDependencies": {
     "@types/node": "^25.9.2",
+    "@types/react": "^18.3.31",
     "tsx": "^4.22.4",
     "typescript": "^6.0.3"
   }