agent-from-zero 0.35.1 → 0.35.2

package/dist/ink/app.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { stripVTControlCharacters } from "node:util"; // plain text of a styled status line, to find the verb
 import { statusCommand } from "../status.js";
 import React, { useState, useEffect, useRef } from "react";
 import { Box, Text, Static, useInput, useApp } from "ink";
@@ -10,7 +11,7 @@ import { CONFIG, saveGlobalSetting } from "../config.js"; // session allowlist +
 import { effortMenu, setEffort } from "../effort.js";
 import { useSlashCompletion } from "./completion.js";
 import { TerminateReason, listAgentViews } from "../loop.js"; // how a turn can end
-import { compactHistory, COMPACT_AT } from "../context.js"; // /compact
+import { compactHistory, compactThreshold, contextWindowFor } from "../context.js"; // /compact + /model info
 import { forgetFilesExcept } from "../tools.js"; // /clear resets the file read-state
 import { clearUndo } from "../undo.js";
 import { clearTodos } from "../todos.js";
@@ -23,7 +24,7 @@ import { cronItemsPending, consumeCronQueue, cronTriggerContent } from "../cron.
 import { newSessionId, saveSession, listSessions, loadSession, setSessionTitle } from "../session.js";
 import { generateSessionTitle, setTerminalTitle } from "../title.js"; // concise session name, generated after the first message + the terminal tab that shows it
 import { isPlanMode, setPlanMode } from "../permissions.js";
-import { findSkill, skillInstructions } from "../skills.js";
+import { findSkill, userSkillMessages } from "../skills.js";
 import { extractMemories } from "../memory.js";
 import { displayWidth } from "../editor.js"; // display-width measurement (CJK-aware)
 import { runHooks } from "../hooks.js";
@@ -37,10 +38,16 @@ import { detailPage, summarizeActivity } from "./activity.js";
 import { useTerminalSize } from "./viewport.js";
 import { makeInkSink } from "./sink.js"; // turns the loop's output into React state
 import { runInfoCommand, mcpStatusText } from "./commands.js"; // the non-interactive slash commands + /mcp status
-import { listMcpServers, mcpActionsFor, runMcpAction } from "../mcp.js"; // /mcp: list + per-server actions
+import { listMcpServers, MCP_SUBCOMMANDS, mcpActionsFor, mcpProblems, mcpServerDetails, reloadMcpServers, runMcpAction } from "../mcp.js"; // /mcp: list + per-server actions
 // Injected when plan mode turns on, so the model knows the rules it now lives in.
 const PLAN_MODE_NOTICE = `[plan mode ON] Investigate this request using only read-only tools — read_file, search, and safe read-only shell (ls, cat, git status). Do NOT write files, edit, or run mutating commands; the permission gate will block them. When you have a concrete, ordered plan, call the exit_plan_mode tool with that plan. The user reviews and approves it before you make any change.`;
-const SPINNER_FRAMES = ["·", "✢", "✳", "✶", "✻", "✽", "✻", "✶", "✳", "✢"];
+// No ✳ (U+2733): it has an emoji presentation, and terminals that honour it draw
+// it two cells wide — the text after the glyph then jumps on every other frame.
+const SPINNER_FRAMES = ["·", "✢", "✶", "✻", "✽", "✻", "✶", "✢"];
+const SPINNER_COLOR = "#D77757"; // Claude Code's orange
+const SHIMMER_PEAK = "#FFD2BD"; // the highlight that sweeps across the verb
+const SHIMMER_TICK_MS = 100; // one animation clock for glyph + shimmer → one repaint per tick
+const SHIMMER_RADIUS = 3; // how many cells the highlight fades over on each side
 // Cap the live streaming preview to a terminal-aware tail. THIS IS LOAD-BEARING:
 // Ink redraws the whole dynamic region (everything below <Static>) on every
 // token, and when that region grows TALLER than the terminal, Ink can no longer
@@ -56,13 +63,49 @@ function liveTail(s, rows, columns, queued) {
     const page = detailPage(s, 0, maxLines, Math.max(1, columns - 2));
     return (page.pages > 1 ? "… " : "") + page.text;
 }
-function Spinner() {
-    const [f, setF] = useState(0);
+// A shared animation clock. One interval drives both the glyph and the shimmer,
+// so the live region repaints once per tick instead of once per effect.
+function useTick() {
+    const [tick, setTick] = useState(0);
     useEffect(() => {
-        const id = setInterval(() => setF((x) => (x + 1) % SPINNER_FRAMES.length), 120);
+        const id = setInterval(() => setTick((t) => t + 1), SHIMMER_TICK_MS);
         return () => clearInterval(id);
     }, []);
-    return _jsx(Text, { color: "#D77757", children: SPINNER_FRAMES[f] });
+    return tick;
+}
+// The glyph lives in a fixed two-cell box: whatever the frame, the text after it
+// starts in the same column.
+function Glyph({ tick }) {
+    return (_jsx(Box, { width: 2, flexShrink: 0, children: _jsx(Text, { color: SPINNER_COLOR, children: SPINNER_FRAMES[Math.floor(tick / 2) % SPINNER_FRAMES.length] }) }));
+}
+function Spinner() {
+    return _jsx(Glyph, { tick: useTick() });
+}
+// Blend two #rrggbb colours; t = 0 → a, 1 → b.
+function mix(a, b, t) {
+    const ch = (hex, i) => parseInt(hex.slice(1 + i * 2, 3 + i * 2), 16);
+    return "#" + [0, 1, 2].map((i) => Math.round(ch(a, i) + (ch(b, i) - ch(a, i)) * t).toString(16).padStart(2, "0")).join("");
+}
+// The light sweep: each character is coloured by its distance from a moving
+// highlight. Only COLOUR changes between frames — never a character, never a
+// width — so the line shimmers without a single cell moving.
+export function shimmer(text, pos) {
+    return [...text].map((c, i) => {
+        const glow = Math.max(0, 1 - Math.abs(i - pos) / SHIMMER_RADIUS);
+        return chalk.hex(mix(SPINNER_COLOR, SHIMMER_PEAK, glow))(c);
+    }).join("");
+}
+// "✶ Thinking… (3s · ↓ 281 tokens · thought for 1s)": the verb (everything up to
+// and including the first "…") shimmers; the stats after it stay put. A pause
+// between sweeps (the highlight travels past the end) keeps it calm.
+function SpinnerLine({ text }) {
+    const tick = useTick();
+    const plain = stripVTControlCharacters(text);
+    const cut = plain.indexOf("…");
+    const verb = cut >= 0 && text.startsWith(plain.slice(0, cut + 1)) ? plain.slice(0, cut + 1) : ""; // shimmer only an unstyled verb
+    const period = verb.length + SHIMMER_RADIUS * 2 + 8;
+    const pos = (tick % period) - SHIMMER_RADIUS;
+    return (_jsxs(Box, { children: [_jsx(Glyph, { tick: tick }), _jsxs(Text, { color: SPINNER_COLOR, wrap: "truncate-end", children: [verb ? shimmer(verb, pos) : "", text.slice(verb.length)] })] }));
 }
 // One committed line of conversation. `user` is a highlight bar; `answer` is a
 // finished reply rendered as markdown; `note` is already-formatted narration.
@@ -88,6 +131,24 @@ function StatusBar({ model, dir, branch, status }) {
     ];
     return (_jsx(Text, { wrap: "truncate-end", children: parts.map((p, i) => (_jsxs(React.Fragment, { children: [i > 0 && _jsx(Text, { dimColor: true, children: "  ·  " }), p] }, i))) }));
 }
+// Bottom-right MCP health, like Claude Code's footer notice: red when a
+// server failed, yellow when one needs sign-in, dim while servers are still
+// connecting in the background; nothing at all when every server is fine.
+// Re-read on every render (the app ticks once a second), so it follows
+// background connects, /mcp actions and settings reloads with no wiring.
+function McpBadge() {
+    const { failed, needsAuth, pending } = mcpProblems();
+    const parts = [];
+    if (failed.length)
+        parts.push(_jsxs(Text, { color: "red", children: ["\u2717 MCP failed: ", failed.join(", ")] }, "f"));
+    if (needsAuth.length)
+        parts.push(_jsxs(Text, { color: "yellow", children: ["\u25B3 ", needsAuth.join(", "), " needs auth"] }, "a"));
+    if (pending)
+        parts.push(_jsxs(Text, { dimColor: true, children: ["\u25CC connecting ", pending, " MCP server", pending === 1 ? "" : "s", "\u2026"] }, "p"));
+    if (!parts.length)
+        return null;
+    return (_jsx(Box, { flexShrink: 1, marginLeft: 2, children: _jsxs(Text, { wrap: "truncate-end", children: [parts.map((p, i) => _jsxs(React.Fragment, { children: [i > 0 && _jsx(Text, { dimColor: true, children: "  ·  " }), p] }, i)), failed.length || needsAuth.length ? _jsx(Text, { dimColor: true, children: "  · /mcp" }) : null] }) }));
+}
 // One human note per non-Done ending, so the user always learns why a turn stopped.
 const EXIT_NOTES = {
     [TerminateReason.ReviewLimit]: "Repeated automatic denials — stopped. Tell the agent how to proceed; prohibited actions were not executed.",
@@ -102,7 +163,7 @@ const EXIT_NOTES = {
 };
 export function App({ session, runTurn, clipboard }) {
     const { rows, columns } = useTerminalSize();
-    const { client, messages, systemMessage, costMeter, skills, judge, autoMode, model, dir, branch, getStatus } = session;
+    const { client, messages, systemMessage, costMeter, skills: liveSkills, judge, autoMode, model, dir, branch, getStatus } = session;
     // Seed the scrollback with the welcome banner + the dim startup notices.
     const [items, setItems] = useState(() => [{ kind: "note", text: session.bannerText }, ...session.notices.map((n) => ({ kind: "note", text: chalk.dim(n) }))]);
     const [status, setStatus] = useState(null); // the live spinner line
@@ -150,7 +211,7 @@ export function App({ session, runTurn, clipboard }) {
         void client.models.list().then((page) => setCompletionModels(page.data.map((m) => m.id))).catch(() => { });
     }, [wantsModels, client]);
     const completion = useSlashCompletion(input, completing, {
-        model: CONFIG.model, skills, models: completionModels, servers: listMcpServers().map((s) => s.name),
+        model: CONFIG.model, skills: liveSkills(), models: completionModels, servers: listMcpServers().map((s) => s.name),
     }, rows - 10);
     useEffect(() => {
         const id = setInterval(() => setTick((t) => t + 1), 1000);
@@ -162,10 +223,10 @@ export function App({ session, runTurn, clipboard }) {
         setTerminalTitle(session.initialTitle);
     }, [session.initialTitle]);
     // Open a one-of-N menu and run `onChoose` with the picked index (-1 = cancel).
-    const openSelect = (header, options, onChoose) => {
+    const openSelect = (header, options, onChoose, body) => {
         setDetails(null);
         setMenuSel(0);
-        setPending({ kind: "select", header, options, onChoose });
+        setPending({ kind: "select", header, body, options, onChoose });
     };
     // Run one conversation turn through the real loop. `display` is what scrolls up
     // as the prompt (a user highlight bar, or a note for /skill); the loop appends
@@ -336,12 +397,24 @@ export function App({ session, runTurn, clipboard }) {
     // /mcp — list configured servers + status, then pick one to manage it.
     const handleMcpCommand = async (arg) => {
         const parts = arg.trim().split(/\s+/).filter(Boolean);
+        // /mcp reload — re-read settings.json now (the file watcher normally does this on save).
+        if (parts[0] === "reload") {
+            setBusy(true);
+            try {
+                const changes = await reloadMcpServers();
+                note(chalk.dim(changes.length ? `(mcp: ${changes.join(", ")})` : "(mcp: no changes in settings.json)"));
+            }
+            finally {
+                setBusy(false);
+            }
+            return;
+        }
         // Direct subcommands (scriptable, matching Claude Code): /mcp reconnect|auth|enable|disable <name>
-        if (parts.length >= 2 && ["reconnect", "auth", "authenticate", "enable", "disable"].includes(parts[0])) {
+        if (parts.length >= 2 && MCP_SUBCOMMANDS[parts[0]]) {
             const name = parts.slice(1).join(" ");
             setBusy(true);
             try {
-                const action = parts[0] === "auth" || parts[0] === "authenticate" ? "authenticate" : parts[0];
+                const action = MCP_SUBCOMMANDS[parts[0]];
                 const msg = await runMcpAction(name, action, (url) => note(chalk.dim(`authenticate in your browser: ${url}`)));
                 note(chalk.dim(msg));
             }
@@ -364,7 +437,7 @@ export function App({ session, runTurn, clipboard }) {
                 return note(chalk.dim("(cancelled)"));
             const server = servers[i];
             const actions = mcpActionsFor(server);
-            openSelect(`${server.name} — ${mcpStatusText(server)}`, actions.map((a) => a.label), (j) => {
+            openSelect(`${server.name} MCP Server`, actions.map((a) => a.label), (j) => {
                 if (j < 0)
                     return note(chalk.dim("(cancelled)"));
                 setBusy(true);
@@ -372,7 +445,7 @@ export function App({ session, runTurn, clipboard }) {
                     .then((msg) => note(chalk.dim(msg)))
                     .catch((err) => note(chalk.yellow(err.message)))
                     .finally(() => setBusy(false));
-            });
+            }, mcpServerDetails(server)); // Claude Code's server screen: status, auth, protocol, URL, config, capabilities, tools
         });
     };
     const handleCommand = async (line) => {
@@ -418,12 +491,12 @@ export function App({ session, runTurn, clipboard }) {
             setAutoEnabled(autoMode.enabled);
             return true;
         }
-        const info = runInfoCommand(line, { skills, costMeter }); // /help /cost /memory /stats /todos /bg /team /tasks /skills /undo /diff
+        const info = runInfoCommand(line, { skills: liveSkills(), costMeter }); // /help /cost /memory /stats /todos /bg /team /tasks /skills /undo /diff
         if (info !== null) {
             note(info);
             return true;
         }
-        // /mcp [reconnect|auth|enable|disable <name>]
+        // /mcp [reload | reconnect|auth|enable|disable <name>]
         if (line === "/mcp" || line.startsWith("/mcp ")) {
             await handleMcpCommand(line.slice("/mcp".length).trim());
             return true;
@@ -448,7 +521,7 @@ export function App({ session, runTurn, clipboard }) {
                 apply(name);
                 return true;
             }
-            note(chalk.dim(`model: ${CONFIG.model}\nendpoint: ${CONFIG.baseURL}\ncontext window: ${CONFIG.contextWindow} tokens (compaction at ~${COMPACT_AT})`));
+            note(chalk.dim(`model: ${CONFIG.model}\nendpoint: ${CONFIG.baseURL}\ncontext window: ${contextWindowFor()} tokens (auto-compact at ~${compactThreshold()})`));
             let models = [];
             try {
                 const page = await client.models.list();
@@ -468,9 +541,12 @@ export function App({ session, runTurn, clipboard }) {
             });
             return true;
         }
-        // /skill <name> — run a skill on the user's behalf (works for user-only skills)
+        // /skill <name> [args] — run a skill on the user's behalf (works for user-only
+        // skills). Claude Code's pair: a <command-name> marker, then the body.
         if (line === "/skill" || line.startsWith("/skill ")) {
-            const name = line.slice("/skill".length).trim();
+            const skills = liveSkills(); // live — a SKILL.md added mid-session is found
+            const [name = "", ...rest] = line.slice("/skill".length).trim().split(/\s+/);
+            const args = rest.join(" ");
             if (!name) {
                 note(chalk.dim(skills.length ? `usage: /skill <name> — available: ${skills.map((s) => s.name).join(", ")}` : "(no skills in this project — add one at .mini-agent/skills/<name>/SKILL.md)"));
                 return true;
@@ -480,8 +556,8 @@ export function App({ session, runTurn, clipboard }) {
                 note(chalk.yellow(`(no skill named "${name}")`));
                 return true;
             }
-            autoMode.recordRequest(`Run the "${s.name}" skill.`);
-            runConversationTurn(`Run the "${s.name}" skill.\n\n${skillInstructions(s)}`, { kind: "note", text: chalk.dim(`(running skill: ${s.name})`) });
+            autoMode.recordRequest(`/${s.name}${args ? ` ${args}` : ""}`);
+            runConversationTurn(userSkillMessages(s, args), { kind: "note", text: chalk.dim(`(running skill: ${s.name})`) });
             return true;
         }
         switch (line) {
@@ -562,6 +638,8 @@ export function App({ session, runTurn, clipboard }) {
                 return true;
             }
             default:
+                if (line.startsWith("/") && findSkill(liveSkills(), line.slice(1).split(/\s+/)[0]))
+                    return handleCommand(`/skill ${line.slice(1)}`); // /<skill-name> [args], like Claude Code
                 if (line.startsWith("/")) {
                     note(chalk.dim(`unknown command: ${line} — try /help`));
                     return true; // consumed — don't send typos to the model
@@ -854,7 +932,7 @@ export function App({ session, runTurn, clipboard }) {
     const agentDetailView = detailPage(selectedAgent?.transcript || "(Waiting for activity…)", agentPage, Math.max(1, Math.min(10, rows - 10)), Math.max(1, columns - 4));
     const detailView = detailPage(details === "tools" ? getToolCalls() ?? "No tool calls this turn." : details === "reasoning" ? getReasoning() ?? "No thinking recorded this turn." : "", detailOffset, Math.max(1, Math.min(12, rows - 9)), Math.max(1, columns - 4));
     const activity = rows >= 20 && busy && !details && !pending && !subAgentDetail && !followUps.size ? summarizeActivity(getToolActivity(), Date.now(), rows >= 30 && !agents.length ? 2 : 1) : [];
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: items, children: (item, i) => _jsx(ItemView, { item: item }, i) }), _jsxs(Box, { flexDirection: "column", height: !pending && (details || selectedAgent) ? Math.max(1, rows - 1) : undefined, overflow: "hidden", children: [live !== null && !details && !pending && !selectedAgent && (_jsxs(Box, { marginTop: rows >= 20 ? 1 : 0, flexDirection: "row", children: [_jsx(Text, { color: "green", children: "\u23FA " }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { children: live === "" ? chalk.dim("…") : liveTail(live, rows, columns, followUps.size > 0) }) })] })), activity.map((group, i) => (_jsxs(Box, { flexDirection: "column", marginTop: i === 0 ? 1 : 0, children: [_jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: group.failed ? "yellow" : group.running ? "cyan" : "green", children: "\u25CF " }), _jsx(Text, { bold: true, children: group.title })] }), _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["  \u23BF ", group.detail] })] }, i))), !details && !pending && !selectedAgent && (status !== null || busy) && (_jsxs(Box, { marginTop: rows >= 20 ? 1 : 0, children: [_jsx(Spinner, {}), _jsxs(Text, { color: "#D77757", wrap: "truncate-end", children: [" ", status?.replace("Ctrl+C to interrupt", "Esc to interrupt") ?? (live !== null ? "Writing…" : "Working…")] })] })), rows >= 20 && !details && !selectedAgent && !pending && (busy || getToolCallCount() > 0) && (_jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["  ", getToolCallCount(), " tool calls \u00B7 Ctrl+T details \u00B7 Ctrl+R thinking", busy ? " · Esc interrupt" : ""] })), details && !pending && (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "gray", paddingX: 1, children: [_jsxs(Text, { dimColor: true, wrap: "truncate-end", children: [details === "tools" ? "Tool details" : "Thinking", " \u00B7 ", detailView.pages - detailView.page, "/", detailView.pages, " \u00B7 \u2191\u2193 page \u00B7 Esc close", followUps.size ? ` · ${followUps.size} queued` : ""] }), _jsx(Text, { children: detailView.text })] })), selectedAgent && !pending && (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "blue", paddingX: 1, children: [_jsxs(Text, { bold: true, color: "cyan", wrap: "truncate-end", children: [selectedAgent.name, " \u00B7 ", selectedAgent.model, " \u00B7 ", selectedAgent.status, " \u00B7 Esc main"] }), _jsxs(Box, { children: [selectedAgent.status === "running" && _jsx(Spinner, {}), _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: [" ", selectedAgent.activity, " \u00B7 ", selectedAgent.toolCalls, " tools \u00B7 PgUp/PgDn details"] })] }), _jsx(Text, { children: agentDetailView.text })] })), pending?.kind === "select" && (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: "yellow", children: pending.header }), _jsx(Text, { children: renderMenu(pending.options, menuSel) }), _jsx(Text, { children: MENU_HINT })] })), pending?.kind === "form" && formState && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { children: renderForm(pending.questions, formState) }) })), pending && _jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Type a follow-up \u00B7 Enter sends text; empty input selects \u00B7 Esc cancels" }), !details && !selectedAgent && !pending && followUps.size > 0 && (_jsxs(Box, { flexDirection: "column", marginTop: rows >= 20 ? 1 : 0, children: [_jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Messages queued for the next tool boundary \u00B7 Esc / Ctrl+Enter interrupt and send" }), followUps.pending.slice(rows >= 20 ? -2 : -1).map((message, i) => _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["  \u21B3 ", message.displayText ?? message.text] }, i)), followUps.size > 2 && _jsxs(Text, { dimColor: true, children: ["  \u2026 ", followUps.size - 2, " earlier messages queued"] })] })), _jsx(Box, { borderStyle: "round", borderColor: planMode ? "magenta" : CONFIG.bypassPermissions ? "red" : autoEnabled ? "yellow" : "cyan", paddingX: 1, marginTop: rows >= 20 ? 1 : 0, flexDirection: "column", flexShrink: 0, children: (() => {
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: items, children: (item, i) => _jsx(ItemView, { item: item }, i) }), _jsxs(Box, { flexDirection: "column", height: !pending && (details || selectedAgent) ? Math.max(1, rows - 1) : undefined, overflow: "hidden", children: [live !== null && !details && !pending && !selectedAgent && (_jsxs(Box, { marginTop: rows >= 20 ? 1 : 0, flexDirection: "row", children: [_jsx(Text, { color: "green", children: "\u23FA " }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { children: live === "" ? chalk.dim("…") : liveTail(live, rows, columns, followUps.size > 0) }) })] })), activity.map((group, i) => (_jsxs(Box, { flexDirection: "column", marginTop: i === 0 ? 1 : 0, children: [_jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: group.failed ? "yellow" : group.running ? "cyan" : "green", children: "\u25CF " }), _jsx(Text, { bold: true, children: group.title })] }), _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["  \u23BF ", group.detail] })] }, i))), !details && !pending && !selectedAgent && (status !== null || busy) && (_jsx(Box, { marginTop: rows >= 20 ? 1 : 0, children: _jsx(SpinnerLine, { text: status?.replace("Ctrl+C to interrupt", "Esc to interrupt") ?? (live !== null ? "Writing…" : "Working…") }) })), rows >= 20 && !details && !selectedAgent && !pending && (busy || getToolCallCount() > 0) && (_jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["  ", getToolCallCount(), " tool calls \u00B7 Ctrl+T details \u00B7 Ctrl+R thinking", busy ? " · Esc interrupt" : ""] })), details && !pending && (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "gray", paddingX: 1, children: [_jsxs(Text, { dimColor: true, wrap: "truncate-end", children: [details === "tools" ? "Tool details" : "Thinking", " \u00B7 ", detailView.pages - detailView.page, "/", detailView.pages, " \u00B7 \u2191\u2193 page \u00B7 Esc close", followUps.size ? ` · ${followUps.size} queued` : ""] }), _jsx(Text, { children: detailView.text })] })), selectedAgent && !pending && (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: "blue", paddingX: 1, children: [_jsxs(Text, { bold: true, color: "cyan", wrap: "truncate-end", children: [selectedAgent.name, " \u00B7 ", selectedAgent.model, " \u00B7 ", selectedAgent.status, " \u00B7 Esc main"] }), _jsxs(Box, { children: [selectedAgent.status === "running" && _jsx(Spinner, {}), _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: [" ", selectedAgent.activity, " \u00B7 ", selectedAgent.toolCalls, " tools \u00B7 PgUp/PgDn details"] })] }), _jsx(Text, { children: agentDetailView.text })] })), pending?.kind === "select" && (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: "yellow", children: pending.header }), pending.body && _jsx(Box, { marginY: 1, children: _jsx(Text, { children: pending.body }) }), _jsx(Text, { children: renderMenu(pending.options, menuSel) }), _jsx(Text, { children: MENU_HINT })] })), pending?.kind === "form" && formState && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { children: renderForm(pending.questions, formState) }) })), pending && _jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Type a follow-up \u00B7 Enter sends text; empty input selects \u00B7 Esc cancels" }), !details && !selectedAgent && !pending && followUps.size > 0 && (_jsxs(Box, { flexDirection: "column", marginTop: rows >= 20 ? 1 : 0, children: [_jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Messages queued for the next tool boundary \u00B7 Esc / Ctrl+Enter interrupt and send" }), followUps.pending.slice(rows >= 20 ? -2 : -1).map((message, i) => _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["  \u21B3 ", message.displayText ?? message.text] }, i)), followUps.size > 2 && _jsxs(Text, { dimColor: true, children: ["  \u2026 ", followUps.size - 2, " earlier messages queued"] })] })), _jsx(Box, { borderStyle: "round", borderColor: planMode ? "magenta" : CONFIG.bypassPermissions ? "red" : autoEnabled ? "yellow" : "cyan", paddingX: 1, marginTop: rows >= 20 ? 1 : 0, flexDirection: "column", flexShrink: 0, children: (() => {
                             const prompt = "❯ ";
                             const promptColor = planMode ? "magenta" : CONFIG.bypassPermissions ? "red" : autoEnabled ? "yellow" : "cyan";
                             const cols = columns;
@@ -923,5 +1001,5 @@ export function App({ session, runTurn, clipboard }) {
                                 }
                                 return (_jsxs(Box, { children: [i === 0 && _jsx(Text, { color: promptColor, children: prompt }), _jsx(Text, { children: line })] }, i));
                             });
-                        })() }), completion.view, rows >= 20 && busy && !details && !selectedAgent && !pending && _jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Enter queue follow-up \u00B7 Ctrl+Enter interrupt and send now" }), rows >= 20 && !details && !selectedAgent && !pending && !completion.visible && _jsx(AgentList, { agents: agents, focus: subAgentFocus, viewing: subAgentDetail, mainBusy: busy, maxRows: Math.max(2, Math.min(3, rows - 24)) }), _jsx(StatusBar, { model: CONFIG.model, dir: dir, branch: branch, status: getStatus() }), (planMode || autoEnabled || CONFIG.bypassPermissions) && (_jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: planMode ? "magenta" : CONFIG.bypassPermissions ? "red" : "yellow", children: planMode ? "⏸ plan mode on" : CONFIG.bypassPermissions ? "▶▶ bypass permissions on" : "▶▶ auto mode on" }), _jsx(Text, { dimColor: true, children: planMode ? " (/plan to toggle)" : CONFIG.bypassPermissions ? " (this run)" : " (/auto to toggle)" })] }))] })] }));
+                        })() }), completion.view, rows >= 20 && busy && !details && !selectedAgent && !pending && _jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Enter queue follow-up \u00B7 Ctrl+Enter interrupt and send now" }), rows >= 20 && !details && !selectedAgent && !pending && !completion.visible && _jsx(AgentList, { agents: agents, focus: subAgentFocus, viewing: subAgentDetail, mainBusy: busy, maxRows: Math.max(2, Math.min(3, rows - 24)) }), _jsxs(Box, { justifyContent: "space-between", children: [_jsx(Box, { flexShrink: 1, children: _jsx(StatusBar, { model: CONFIG.model, dir: dir, branch: branch, status: getStatus() }) }), _jsx(McpBadge, {})] }), (planMode || autoEnabled || CONFIG.bypassPermissions) && (_jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { color: planMode ? "magenta" : CONFIG.bypassPermissions ? "red" : "yellow", children: planMode ? "⏸ plan mode on" : CONFIG.bypassPermissions ? "▶▶ bypass permissions on" : "▶▶ auto mode on" }), _jsx(Text, { dimColor: true, children: planMode ? " (/plan to toggle)" : CONFIG.bypassPermissions ? " (this run)" : " (/auto to toggle)" })] }))] })] }));
 }

package/dist/ink/chat.js

@@ -8,11 +8,13 @@ import { userContent } from "../images.js";
 // rest. All screen output flows through hooks.output (the Ink sink).
 export function makeRunTurn(client, messages) {
     let reviewBudget = new AutoReviewBudget();
+    // input: one user message, or several in order (a /skill run sends the
+    // <command-name> marker, then the skill body); images ride on the first.
     return async (input, hooks) => {
         if (input !== null)
             reviewBudget = new AutoReviewBudget();
         if (input !== null)
-            messages.push({ role: "user", content: userContent(input, hooks.images ?? []) });
+            [input].flat().forEach((text, i) => messages.push({ role: "user", content: i === 0 ? userContent(text, hooks.images ?? []) : text }));
         return runLoop(messages, {
             client,
             model: CONFIG.model,

package/dist/ink/commands.js

@@ -25,7 +25,8 @@ export const SESSION_HELP = `commands:
   /memory    show the durable facts the agent remembers about this project
   /status    session usage and vendor account balance/cost
   /cost      tokens, cache hit rate and estimated spend this session (local)
-  /mcp       list configured MCP servers + status; select one to authenticate / reconnect / disable
+  /mcp       list configured MCP servers + status; select one to view tools / authenticate / clear auth / reconnect / disable
+  /mcp reload  re-read mcpServers from settings.json (saves are also picked up automatically)
   /plan      toggle plan mode — research-only; the agent presents a plan you approve before any change
   /effort [level]  list/select the current model’s supported reasoning effort
   /auto      toggle auto mode — risky or uncertain actions still require approval
@@ -39,7 +40,7 @@ export const SESSION_HELP = `commands:
   /diff      show every file changed this session, as a diff from where it started
   /resume    list recent sessions in this project and continue one of them
   /skills    list the reusable skills available in this project
-  /skill <name>  run a skill yourself (works even for user-only skills)
+  /skill <name> [args]  run a skill yourself (works even for user-only skills); /<name> [args] works too
   exit       leave (Ctrl+C does the same)
 
 keys (during or after a turn):
@@ -57,6 +58,8 @@ keys (during or after a turn):
 // Colored status word for an MCP server (shared by the Ink + readline /mcp UIs).
 export function mcpStatusText(info) {
     switch (info.status) {
+        case "pending":
+            return chalk.dim("connecting…");
         case "connected":
             return chalk.green("connected");
         case "needs-auth":

package/dist/ink/setup.js

@@ -3,18 +3,18 @@ import path from "node:path";
 import { createRequire } from "node:module";
 import { CONFIG, requireApiKey } from "../config.js";
 import { buildSystemMessage, readProjectInstructions } from "../prompt.js";
-import { estimateHistoryTokens } from "../context.js";
+import { contextPercent } from "../context.js";
 import { initCostMeter, DEFAULT_PRICING } from "../cost.js";
 import { gitBranch } from "../tui.js";
 import { newSessionId, latestSession } from "../session.js";
 import { initTelemetry, emit } from "../telemetry.js";
 import { runHooks } from "../hooks.js";
-import { connectMcpServers } from "../mcp.js";
+import { connectMcpServers, watchMcpConfig } from "../mcp.js";
 import { Judge } from "../judge.js";
 import { AutoMode } from "../auto.js";
 import { registerExternalTool } from "../tools.js";
 import { rememberTool, readMemory } from "../memory.js";
-import { loadSkills, buildSkillTool } from "../skills.js";
+import { currentSkills } from "../skills.js";
 import { killAllBackground } from "../background.js";
 import { killAllSubAgents } from "../loop.js";
 import { loadDurableJobs, startCronScheduler, stopCronScheduler, listJobs } from "../cron.js"; // cron scheduler (Day s14)
@@ -52,10 +52,12 @@ export async function buildInkSession(opts = {}) {
     }
     initTelemetry(sessionId);
     emit("agent_session_start", { mode: "repl" });
-    // MCP servers — must finish before the first model call so their tools appear
-    // in the manual. A server that fails to start is skipped, never fatal.
-    const disconnectMcp = await connectMcpServers();
+    // MCP servers connect in the BACKGROUND, like Claude Code: the prompt is
+    // ready at once, each server's tools join the next model call the moment it
+    // connects, and a failure is flagged in the status bar (red, bottom right).
+    const disconnectMcp = await connectMcpServers({ background: true });
     process.on("exit", disconnectMcp);
+    process.on("exit", watchMcpConfig()); // hot reload: a settings.json save adds/removes/reconnects servers, no restart
     process.on("exit", killAllBackground); // SIGKILL any background job so it never outlives the agent
     process.on("exit", killAllSubAgents); // mark any still-running sub-agents as killed
     process.on("exit", stopCronScheduler); // Day s14: stop the setInterval on exit
@@ -75,13 +77,11 @@ export async function buildInkSession(opts = {}) {
     const memCount = readMemory().length;
     if (memCount)
         notices.push(`(long-term memory: ${memCount} facts loaded)`);
-    // Skills: model-invocable ones get the single `skill` tool; user-only ones are
-    // reachable via /skill <name>.
-    const skills = loadSkills();
-    if (skills.some((s) => !s.disableModelInvocation))
-        registerExternalTool(buildSkillTool(skills));
-    if (skills.length)
-        notices.push(`(skills: ${skills.length} loaded — ${skills.map((s) => s.name).join(", ")})`);
+    // Skills are re-read before every model call (no restart needed); the loop
+    // registers the `skill` tool and sends the listing. Just announce them here.
+    const startupSkills = currentSkills();
+    if (startupSkills.length)
+        notices.push(`(skills: ${startupSkills.length} loaded — ${startupSkills.map((s) => s.name).join(", ")})`);
     const costMeter = initCostMeter({
         inputPerM: CONFIG.pricing.inputPerM ?? DEFAULT_PRICING.inputPerM,
         cachedInputPerM: CONFIG.pricing.cachedInputPerM ?? DEFAULT_PRICING.cachedInputPerM,
@@ -94,7 +94,7 @@ export async function buildInkSession(opts = {}) {
     const dir = path.basename(process.cwd());
     const branch = gitBranch();
     const getStatus = () => ({
-        ctxPct: Math.min(100, Math.round((estimateHistoryTokens(messages) / CONFIG.contextWindow) * 100)),
+        ctxPct: contextPercent(messages), // % of the way to auto-compaction
         cost: costMeter.cost(),
         elapsedMs: Date.now() - startedAt,
     });
@@ -106,7 +106,7 @@ export async function buildInkSession(opts = {}) {
         initialTitle,
         startedAt,
         costMeter,
-        skills,
+        skills: () => currentSkills(),
         judge,
         autoMode,
         model: CONFIG.model,

package/dist/loop.js

@@ -5,7 +5,7 @@ import { toolDefinitions, dispatch, snapshotFileState, restoreFileState, isReadO
 import { classifyError, ApiErrorKind } from "./errors.js"; // failure taxonomy
 import { checkPermission } from "./permissions.js"; // the allow/ask/deny gate
 import { previewChange } from "./diff.js"; // show the diff before a write so approval is informed
-import { estimateHistoryTokens, compactHistory, COMPACT_AT, MAX_COMPACTIONS_PER_QUERY, MAX_COMPACT_FAILURES } from "./context.js"; // context management
+import { contextTokens, compactHistory, compactThreshold, recordContextUsage, MAX_COMPACTIONS_PER_QUERY, MAX_COMPACT_FAILURES } from "./context.js"; // context management
 import { SUB_AGENT_PROMPT, TEAMMATE_PROMPT } from "./prompt.js"; // the sub-agent + teammate constitutions
 import { LEAD, MAX_TEAMMATES, sendMessage, sendProtocol, readInbox, inboxCount, registerTeammate, finishTeammate, teammateExists, teammateCount, createRequest, resolveResponse, setTeammateState, anyTeammateBusy, runningTeammates, markShutdown, shutdownRequestId, resetTeam, listTeammateViews } from "./team.js"; // agent teams (Day 38) + team protocols (Day 39): mailboxes, registry, request/response contracts
 import { createTask, claimTask, completeTask, claimNextAvailable, boardSummary, resetBoard } from "./board.js"; // the shared task board (Day 40): autonomous work claiming
@@ -18,6 +18,7 @@ import { mark, thinkingWord, spinnerText } from "./ui.js"; // centralized termin
 import { recordToolCall, recordToolResult, recordToolDetail, recordReasoning } from "./tui.js"; // folded tool-call trace (Ctrl+T) + the model's hidden thinking (Ctrl+R)
 import { STDOUT_OUTPUT } from "./output.js"; // where the loop's screen output goes (stdout by default, Ink REPL passes its own)
 import { todoNag, getTodos, renderTodos } from "./todos.js"; // the agent's plan: show it on screen + nag when it goes stale
+import { currentSkills, skillBodyMessages, skillListingReminder, syncSkillTool } from "./skills.js"; // skill listing reminders + launched skill bodies
 import { pendingNotifications } from "./background.js"; // background tasks (Day 37): surface finished jobs as a turn
 import { consumeCronQueue, cronItemsPending, cronTriggerContent } from "./cron.js"; // cron scheduler (Day s14): scheduled, recurring work
 export const MAX_RETRIES = 10; // total failed API calls per query, across all rounds
@@ -391,6 +392,7 @@ opts) {
     const idleAbort = new AbortController(); // the watchdog's own kill switch
     const signal = AbortSignal.any([opts.signal, idleAbort.signal]); // either the user or the watchdog can abort
     const word = thinkingWord(modelCallSeq++); // a rotating "thinking" word for this call
+    const sentCount = messages.length; // how much history this request carries — the usage anchor (context.ts)
     const startedAt = Date.now(); // for the spinner's live elapsed counter
     let reportedTokens;
     if (opts.progress) {
@@ -401,7 +403,9 @@ opts) {
     // Reasoning is COLLAPSED by default: while the model thinks, the spinner keeps
     // spinning (with a 💭 hint) instead of dumping the trace; we stash it for Ctrl+R.
     let reasoningBuf = ""; // the accumulated thinking, hidden behind the spinner
-    let reasoningActive = false; // true while reasoning tokens are arriving → spinner shows 💭
+    let reasoningActive = false; // true while reasoning tokens are arriving → spinner says "thinking"
+    let reasoningStartedAt = 0; // when the first reasoning token arrived (0 = no reasoning this call)
+    let reasoningEndedAt = 0; // when it stopped → "thought for Ns"
     let reasoningShown = false; // has this trace been stored for Ctrl+R?
     const spinner = opts.quiet || opts.subAgent
         ? null // the eval harness wants silence
@@ -414,10 +418,11 @@ opts) {
     // - stall (slow but alive for 30s) → log it and keep waiting
     // It also ticks the spinner: elapsed seconds + a live token estimate (~chars/4).
     const watchdog = setInterval(() => {
-        // While the model is reasoning, prefix the spinner with 💭 so "it's thinking"
-        // reads differently from "it's waiting on the first token".
+        // While the model is reasoning the spinner says "thinking", then "thought
+        // for Ns" — inside the parentheses, so the verb never shifts sideways.
+        const thinking = reasoningStartedAt ? { active: reasoningActive, ms: (reasoningActive ? Date.now() : reasoningEndedAt) - reasoningStartedAt } : undefined;
         if (spinner?.spinning)
-            spinner.set((reasoningActive ? chalk.dim("💭 ") : "") + spinnerText(word, Math.floor((Date.now() - startedAt) / 1000), !!opts.subAgent, Math.round(streamedChars / 4)));
+            spinner.set(spinnerText(word, Math.floor((Date.now() - startedAt) / 1000), !!opts.subAgent, Math.round(streamedChars / 4), thinking));
         const quietMs = Date.now() - lastEvent; // ms since the last event
         if (quietMs > IDLE_TIMEOUT_MS) {
             emit("agent_watchdog_idle"); // record the cut — these should be rare
@@ -449,6 +454,7 @@ opts) {
                 return;
             reasoningShown = true;
             reasoningActive = false;
+            reasoningEndedAt = Date.now();
             if (opts.quiet || opts.subAgent)
                 return; // no UI for silent / nested runs
             recordReasoning(reasoningBuf); // keep it for Ctrl+R (never goes into history)
@@ -458,6 +464,7 @@ opts) {
             stallWarned = false; // the stream spoke — reset the stall warning
             if (chunk.usage) {
                 recordUsage(chunk.usage);
+                recordContextUsage(messages, sentCount, chunk.usage); // the real size of what we just sent — anchors the context count
                 if (typeof chunk.usage.completion_tokens === "number")
                     reportedTokens = chunk.usage.completion_tokens;
             } // the final usage chunk — meter it
@@ -474,7 +481,9 @@ opts) {
                 if (opts.progress)
                     opts.progress.liveTokens = Math.ceil(streamedChars / 4);
                 reasoningBuf += reasoning; // stash it for Ctrl+R instead of streaming it
-                reasoningActive = true; // the spinner now shows 💭 (set by the watchdog)
+                reasoningActive = true; // the spinner now says "thinking" (set by the watchdog)
+                if (!reasoningStartedAt)
+                    reasoningStartedAt = Date.now();
             }
             if (delta.content) {
                 flushReasoning();
@@ -1315,14 +1324,26 @@ opts) {
                 return { reason: TerminateReason.ReviewLimit };
             receiveFollowUps();
             // Proactive compaction: act BEFORE the API rejects us. Waiting for the
-            // hard limit means the failure already happened.
-            if (estimateHistoryTokens(messages) > COMPACT_AT) {
+            // hard limit means the failure already happened. The count is the last
+            // response's real prompt_tokens + an estimate of what was added since, so
+            // the threshold can sit close to the window (see compactThreshold).
+            if (contextTokens(messages) > compactThreshold(opts.model)) {
                 if (compaction.count >= MAX_COMPACTIONS_PER_QUERY)
                     return { reason: TerminateReason.CompactionFailed, detail: `already compacted ${compaction.count}x this query — the task is too big for one session` };
                 const ok = await tryCompact(messages, opts, compaction); // shrink the history
                 if (!ok && compaction.failures >= MAX_COMPACT_FAILURES)
                     return { reason: TerminateReason.CompactionFailed, detail: `${compaction.failures} consecutive compaction failures` }; // the compaction circuit breaker
             }
+            // Skills: pick up any SKILL.md added or edited since the last call (no
+            // restart), then tell the model about skills it hasn't seen yet — a
+            // <system-reminder> user message with just the delta, as Claude Code does.
+            // Idempotent: a retry of this same call finds the reminder already sent.
+            // Teammates have no skill tool, so they get no listing.
+            const skills = currentSkills();
+            syncSkillTool(skills);
+            const listing = opts.teammate ? null : skillListingReminder(messages, skills);
+            if (listing)
+                messages.push({ role: "user", content: listing });
             let out;
             try {
                 out = await streamModelCall(messages, opts); // streaming call with spinner + watchdog
@@ -1461,6 +1482,11 @@ opts) {
                 const r = await runOneCall(out.toolCalls[i++], { ...opts, autoHistory: reviewHistory(messages, opts.autoHistory) });
                 messages.push({ role: "tool", tool_call_id: r.id, content: r.content });
             }
+            // A launched skill's body arrives as its own user message, after ALL of
+            // this round's tool results (the tool result itself only says "Launching
+            // skill: <name>"). Same shape as Claude Code's skill invocation.
+            for (const body of skillBodyMessages(out.toolCalls, messages))
+                messages.push({ role: "user", content: body });
             // Cron (Day s14): deliver any triggered scheduled jobs right after this
             // round's results so the model sees them on the next round.
             injectCronMessages(messages, opts);