nou-cli 0.2.0 → 0.3.0

package/dist/src/ui/Chat.js

@@ -5,8 +5,8 @@ import { wrap } from "./text.js";
 import { ChatInput, inputHeight } from "./ChatInput.js";
 import { C, SPINNER } from "./theme.js";
 import { Pane } from "./Pane.js";
-export const COMMANDS = ["/model", "/models", "/settings", "/clear", "/help"];
-export function Chat({ width, height, focused, entries, streaming, busy, approval, approvalNote, contextChip, onSubmit }) {
+export const COMMANDS = ["/model", "/models", "/settings", "/undo", "/rewind", "/history", "/problems", "/version", "/clear", "/help"];
+export function Chat({ width, height, focused, entries, streaming, busy, approval, approvalNote, contextChip, wheel, onSubmit }) {
     const [input, setInput] = useState("");
     const [scrollBack, setScrollBack] = useState(0);
     const { frame } = useAnimation({ interval: 80, isActive: !!busy });
@@ -74,6 +74,10 @@ export function Chat({ width, height, focused, entries, streaming, busy, approva
     const maxBack = Math.max(0, lines.length - rows);
     const back = Math.min(scrollBack, maxBack);
     const visible = lines.slice(Math.max(0, lines.length - rows - back), lines.length - back);
+    useEffect(() => {
+        if (wheel)
+            setScrollBack((b) => Math.max(0, Math.min(maxBack, b - wheel.dir * 3)));
+    }, [wheel?.nonce]);
     useInput((_input, key) => {
         if (key.pageUp || (key.upArrow && key.shift))
             setScrollBack((b) => Math.min(maxBack, b + Math.max(1, rows - 2)));
@@ -90,7 +94,9 @@ export function Chat({ width, height, focused, entries, streaming, busy, approva
     };
     const render = (line, key) => (_jsxs(Text, { wrap: "truncate-end", children: [line.bar ? _jsx(Text, { color: line.bar, children: "\u258C " }) : null, _jsx(Text, { bold: !!line.bold, dimColor: !!line.dim, ...(line.color ? { color: line.color } : {}), children: line.text || " " })] }, key));
     const empty = entries.length === 0 && !streaming;
-    const title = _jsxs(_Fragment, { children: [" ", _jsx(Text, { color: C.accent2, children: "\u25C6" }), " Chat", back ? _jsxs(Text, { color: C.dim, children: [" \u2191", back, " more"] }) : null] });
+    const title = (_jsxs(_Fragment, { children: [" ", _jsx(Text, { color: C.accent2, children: "\u25C6" }), " Chat", back
+                ? _jsxs(Text, { color: C.yellow, children: ["  \u2191 scrolled ", back, " lines \u00B7 Shift+\u2193 / PgDn / wheel to go back"] })
+                : maxBack > 0 ? _jsx(Text, { color: C.dim, children: "  Shift+\u2191 / PgUp / wheel to scroll" }) : null] }));
     return (_jsxs(Pane, { title: title, width: width, height: height, focused: focused, children: [_jsx(Box, { flexDirection: "column", height: rows, children: empty ? (_jsxs(Box, { flexDirection: "column", paddingX: 1, children: [_jsx(Text, { color: C.dim, children: "Try:" }), _jsx(Text, { color: C.text, children: "  \u201Cexplain this file\u201D" }), _jsx(Text, { color: C.text, children: "  \u201Cwhat changed since my last commit?\u201D" }), _jsx(Text, { color: C.text, children: "  \u201Cadd error handling here\u201D" }), _jsx(Text, { children: " " }), _jsx(Text, { color: C.dim, children: "I can see the file you have open." })] })) : visible.map((line, i) => render(line, i)) }), _jsx(Box, { flexDirection: "column", children: footer.map((line, i) => render(line, `f${i}`)) }), _jsx(Text, { wrap: "truncate-end", color: C.dim, children: suggestions.length
                     ? _jsxs(Text, { color: C.accent, children: [suggestions.join("  "), "  ", _jsx(Text, { color: C.dim, children: suggestions.length === 1 ? "Enter ↵" : "" })] })
                     : contextChip ? _jsxs(_Fragment, { children: [_jsx(Text, { color: C.cyan, children: "@" }), " ", contextChip] }) : " " }), _jsx(Text, { color: focused ? C.accent : C.dim, children: "─".repeat(Math.max(0, inner)) }), _jsx(ChatInput, { value: input, onChange: setInput, onSubmit: submit, focus: focused && !approval, width: inner, history: history, placeholder: busy ? "working… Esc to stop" : "Ask anything · / for commands · ↑ history" })] }));

package/dist/src/ui/CodeView.js

@@ -6,7 +6,7 @@ import { artWork } from "../util/index.js";
 import { highlightLines, sideBySide } from "./text.js";
 import { C, fileIcon, gradient } from "./theme.js";
 import { Pane } from "./Pane.js";
-export function CodeView({ width, height, focused, filePath, content, diff, diffLabel, pending, marked, problems, focusLine, syntaxVersion, diffNote, onViewport }) {
+export function CodeView({ width, height, focused, filePath, content, diff, diffLabel, pending, marked, problems, focusLine, syntaxVersion, diffNote, wheel, onViewport }) {
     const [top, setTop] = useState(0);
     const rows = Math.max(1, height - 3);
     const inner = width - 2;
@@ -32,6 +32,10 @@ export function CodeView({ width, height, focused, filePath, content, diff, diff
     }, [focusLine]);
     const maxTop = Math.max(0, total - rows);
     const start = Math.min(top, maxTop);
+    useEffect(() => {
+        if (wheel)
+            setTop((t) => Math.max(0, Math.min(maxTop, Math.min(t, maxTop) + wheel.dir * 3)));
+    }, [wheel?.nonce]);
     useEffect(() => {
         if (filePath && !diff)
             onViewport(start + 1, Math.min(total, start + rows));

package/dist/src/ui/Editor.js

@@ -7,7 +7,7 @@ import { SEVERITY_STYLE } from "./ProblemsView.js";
 import { Pane } from "./Pane.js";
 const expand = (s) => s.replace(/\t/g, "  ");
 /** A small modal text editor: arrows to move, type to insert, Ctrl+S save, Ctrl+Z undo, Esc leave. */
-export function Editor({ width, height, focused, filePath, initial, baseline, startLine, problems, autoSave, syntaxVersion, onSave, onExit, onState, onHover, onDefinition }) {
+export function Editor({ width, height, focused, filePath, initial, baseline, startLine, problems, autoSave, syntaxVersion, wheel, onSave, onExit, onState, onHover, onDefinition }) {
     const eol = useMemo(() => (baseline.includes("\r\n") ? "\r\n" : "\n"), [baseline]);
     const indentUnit = useMemo(() => (/^\t/m.test(initial) ? "\t" : "  "), [initial]);
     const [buf, setBuf] = useState(() => {
@@ -91,6 +91,10 @@ export function Editor({ width, height, focused, filePath, initial, baseline, st
     }, [focused]);
     const position = () => ({ text: buf.lines.join("\n"), line: buf.row + 1, col: buf.col + 1 });
     const rows = Math.max(1, height - 4);
+    useEffect(() => {
+        if (wheel)
+            move((b) => ({ row: b.row + wheel.dir * 3 }));
+    }, [wheel?.nonce]);
     usePaste((text) => insert(text), { isActive: focused });
     useInput((input, key) => {
         if (confirmExit) {

package/dist/src/ui/FileTree.js

@@ -30,7 +30,7 @@ function flatten(expanded) {
     walk(".", 0);
     return nodes;
 }
-export function FileTree({ width, height, focused, openFile, reveal, version, changed, git, problemCounts, onOpen, onHover }) {
+export function FileTree({ width, height, focused, openFile, reveal, version, changed, git, problemCounts, wheel, click, onOpen, onHover }) {
     const [expanded, setExpanded] = useState(() => new Set(["src"]));
     const [cursor, setCursor] = useState(0);
     const [changesOnly, setChangesOnly] = useState(false);
@@ -118,6 +118,23 @@ export function FileTree({ width, height, focused, openFile, reveal, version, ch
     }, { isActive: focused });
     const start = Math.max(0, Math.min(cursor - Math.floor(rows / 2), nodes.length - rows));
     const visible = nodes.slice(start, start + rows);
+    useEffect(() => {
+        if (wheel)
+            setCursor((c) => Math.max(0, Math.min(nodes.length - 1, c + wheel.dir * 3)));
+    }, [wheel?.nonce]);
+    // Clicking a row selects it; a file opens, a folder expands or collapses.
+    useEffect(() => {
+        if (!click)
+            return;
+        const node = visible[click.row];
+        if (!node)
+            return;
+        setCursor(start + click.row);
+        if (node.isDir)
+            toggle(node.path);
+        else
+            onOpen(node.path);
+    }, [click?.nonce]);
     const inner = width - 2;
     const title = changesOnly
         ? _jsxs(_Fragment, { children: [" ", _jsx(Text, { color: C.yellow, children: "\u00B1" }), " Changes ", _jsxs(Text, { color: C.dim, children: ["(", nodes.length, ")  c: all files"] })] })

package/dist/src/ui/Header.js

@@ -2,8 +2,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import path from "path";
 import { Box, Text, useAnimation } from "ink";
 import { C, SPINNER, gradient } from "./theme.js";
+import { currentVersion } from "../update/index.js";
+const VERSION = `v${currentVersion()}`;
 export function Header({ width, branch, changes, model, local, busy, update }) {
     const { frame } = useAnimation({ interval: 120, isActive: !!busy });
     const project = path.basename(process.cwd());
-    return (_jsxs(Box, { width: width, justifyContent: "space-between", children: [_jsxs(Text, { wrap: "truncate-end", children: [" ", gradient("◆ NOU", busy ? frame : 0).map((g, i) => _jsx(Text, { bold: true, color: g.color, children: g.ch }, i)), _jsx(Text, { color: C.dim, children: "  \u2502  " }), _jsx(Text, { color: C.text, children: project }), branch && (_jsxs(_Fragment, { children: [_jsx(Text, { color: C.dim, children: "  \u2502  " }), _jsxs(Text, { color: C.accent2, children: ["\u2387 ", branch] }), changes > 0 && _jsxs(Text, { color: C.yellow, children: [" \u00B1", changes] })] })), busy && _jsxs(Text, { color: C.accent2, children: ["  ", SPINNER[frame % SPINNER.length], " ", busy] })] }), _jsxs(Text, { children: [update && _jsxs(Text, { color: C.green, bold: true, children: ["\u2B06 v", update, " available \u00B7 run `nou update`  "] }), _jsx(Text, { backgroundColor: local ? C.green : C.accent2, color: "black", bold: true, children: ` ${local ? "⌂ LOCAL" : "☁ CLOUD"} ` }), _jsx(Text, { backgroundColor: C.panel, color: C.text, children: ` ${model} ` }), " "] })] }));
+    return (_jsxs(Box, { width: width, justifyContent: "space-between", children: [_jsxs(Text, { wrap: "truncate-end", children: [" ", gradient("◆ NOU", busy ? frame : 0).map((g, i) => _jsx(Text, { bold: true, color: g.color, children: g.ch }, i)), _jsxs(Text, { color: C.dim, children: [" ", VERSION] }), _jsx(Text, { color: C.dim, children: "  \u2502  " }), _jsx(Text, { color: C.text, children: project }), branch && (_jsxs(_Fragment, { children: [_jsx(Text, { color: C.dim, children: "  \u2502  " }), _jsxs(Text, { color: C.accent2, children: ["\u2387 ", branch] }), changes > 0 && _jsxs(Text, { color: C.yellow, children: [" \u00B1", changes] })] })), busy && _jsxs(Text, { color: C.accent2, children: ["  ", SPINNER[frame % SPINNER.length], " ", busy] })] }), _jsxs(Text, { children: [update && _jsxs(Text, { color: C.green, bold: true, children: ["\u2B06 v", update, " available \u00B7 run `nou update`  "] }), _jsx(Text, { backgroundColor: local ? C.green : C.accent2, color: "black", bold: true, children: ` ${local ? "⌂ LOCAL" : "☁ CLOUD"} ` }), _jsx(Text, { backgroundColor: C.panel, color: C.text, children: ` ${model} ` }), " "] })] }));
 }

package/dist/src/ui/ProblemsView.js

@@ -8,7 +8,7 @@ export const SEVERITY_STYLE = {
     warning: { icon: "▲", color: C.yellow },
     info: { icon: "ℹ", color: C.accent },
 };
-export function ProblemsView({ width, height, focused, problems, checking, onJump, onClose }) {
+export function ProblemsView({ width, height, focused, problems, checking, wheel, onJump, onClose }) {
     const [cursor, setCursor] = useState(0);
     const [onlyErrors, setOnlyErrors] = useState(false);
     const { frame } = useAnimation({ interval: 80, isActive: checking.length > 0 });
@@ -32,6 +32,10 @@ export function ProblemsView({ width, height, focused, problems, checking, onJum
         return out;
     }, [problems, onlyErrors]);
     useEffect(() => setCursor((c) => Math.min(c, Math.max(0, rows.length - 1))), [rows.length]);
+    useEffect(() => {
+        if (wheel)
+            setCursor((c) => Math.max(0, Math.min(rows.length - 1, c + wheel.dir * 3)));
+    }, [wheel?.nonce]);
     const visibleRows = Math.max(1, height - 4);
     useInput((input, key) => {
         if (key.upArrow || input === "k")

package/dist/src/ui/Settings.js

@@ -3,42 +3,82 @@ import { useEffect, useState } from "react";
 import { Box, Text, useAnimation, useInput } from "ink";
 import TextInput from "ink-text-input";
 import { AUTO_SAVE, EFFORTS } from "../config/index.js";
+import { saveCredentials } from "../config/credentials.js";
+import { originOf, setOutsideNou } from "../config/origins.js";
 import { PLUGIN_DIRS, isEnabled, trustState } from "../plugins/index.js";
 import { currentVersion } from "../update/index.js";
 import { describe, providers } from "../providers/index.js";
+import { ENGINES, isInstalled } from "../engines/index.js";
 import { C, SPINNER } from "./theme.js";
-const TABS = ["Model", "Preferences", "Plugins"];
+const TABS = ["Model", "Engine", "Preferences", "Plugins"];
 const PREFS = [
     { key: "effort", label: "Reasoning effort", help: "How hard Claude thinks (low → max). Higher is smarter but slower and pricier." },
     { key: "autoSave", label: "Auto-save", help: "delay: a second after you stop typing · focus: when you leave the editor · off: only Ctrl+S." },
+    { key: "mouse", label: "Mouse", help: "Wheel scrolls the pane under the pointer; click to focus or open files. Hold Shift to select text." },
     { key: "followMode", label: "Follow mode on start", help: "The code view jumps to files Nou reads and edits." },
+    { key: "reuseToolConfig", label: "Use Claude Code / Codex keys", help: "Use the API keys from Claude Code's or Codex's settings when you haven't set one. Applies on restart." },
     { key: "gitContext", label: "Git context", help: "Give the model your branch, changes and commits, plus git tools." },
     { key: "autoApproveEdits", label: "Auto-approve edits", help: "Apply file edits without asking (diffs are still shown).", warn: true },
     { key: "autoApproveCommands", label: "Auto-approve commands", help: "Run shell commands without asking. Only turn on if you trust the model.", warn: true },
 ];
-export function Settings({ width, height, settings, choice, plugins, onModel, onChange, onTogglePlugin, onRescanPlugins, onClose }) {
+export function Settings({ width, height, settings, choice, plugins, connectTo, onModel, onEngine, onChange, onTogglePlugin, onRescanPlugins, onClose }) {
     const [tab, setTab] = useState("Model");
-    const [row, setRow] = useState(0);
+    const [row, setRow] = useState(() => Math.max(0, providers.indexOf(connectTo ?? choice.provider)));
     const [column, setColumn] = useState("providers");
     const [modelRow, setModelRow] = useState(0);
     const [typing, setTyping] = useState(false);
     const [custom, setCustom] = useState("");
     const [models, setModels] = useState({});
+    const [connecting, setConnecting] = useState(connectTo?.connect ? { step: 0, values: {} } : null);
+    const [field, setField] = useState(() => (connectTo?.connect ? initialValue(connectTo.connect[0]) : ""));
     const { frame } = useAnimation({ interval: 80 });
     const provider = providers[row] ?? providers[0];
     const listed = models[provider.id];
     // Load the model list for the highlighted provider.
     useEffect(() => {
-        if (tab !== "Model" || provider.unavailable() || models[provider.id])
+        if (tab !== "Model" || connecting || provider.unavailable() || models[provider.id])
             return;
         setModels((m) => ({ ...m, [provider.id]: "loading" }));
         provider.listModels()
             .then((list) => setModels((m) => ({ ...m, [provider.id]: list })))
             .catch((error) => setModels((m) => ({ ...m, [provider.id]: { error: String(error.message ?? error) } })));
-    }, [tab, provider.id]);
+    }, [tab, provider.id, connecting]);
+    const startConnect = () => {
+        if (!provider.connect)
+            return;
+        setConnecting({ step: 0, values: {} });
+        setField(initialValue(provider.connect[0]));
+    };
+    /** Takes the current field's answer; after the last one, saves everything and shows the provider's models. */
+    const submitField = (value) => {
+        const fields = provider.connect;
+        const current = fields[connecting.step];
+        // Required, and nothing set yet: ask again.
+        if (!value.trim() && !current.optional && !process.env[current.env])
+            return;
+        const values = { ...connecting.values, [current.env]: value };
+        const next = connecting.step + 1;
+        if (next < fields.length) {
+            setConnecting({ step: next, values });
+            setField(initialValue(fields[next]));
+            return;
+        }
+        saveCredentials(values);
+        setConnecting(null);
+        setModels((m) => Object.fromEntries(Object.entries(m).filter(([id]) => id !== provider.id)));
+        if (!provider.unavailable()) {
+            setColumn("models");
+            setModelRow(0);
+        }
+    };
     const modelItems = Array.isArray(listed) ? listed : [];
-    const rowsFor = (t) => (t === "Model" ? providers.length : t === "Preferences" ? PREFS.length : plugins.length);
+    const rowsFor = (t) => (t === "Model" ? providers.length : t === "Engine" ? ENGINES.length : t === "Preferences" ? PREFS.length : plugins.length);
     useInput((input, key) => {
+        if (connecting) {
+            if (key.escape)
+                setConnecting(null);
+            return;
+        }
         if (typing) {
             if (key.escape)
                 setTyping(false);
@@ -47,7 +87,7 @@ export function Settings({ width, height, settings, choice, plugins, onModel, on
         if (key.tab) {
             const next = TABS[(TABS.indexOf(tab) + (key.shift ? TABS.length - 1 : 1)) % TABS.length];
             setTab(next);
-            setRow(next === "Model" ? Math.max(0, providers.indexOf(choice.provider)) : 0);
+            setRow(next === "Model" ? Math.max(0, providers.indexOf(choice.provider)) : next === "Engine" ? Math.max(0, ENGINES.findIndex((e) => e.id === settings.engine)) : 0);
             setColumn("providers");
             return;
         }
@@ -66,6 +106,8 @@ export function Settings({ width, height, settings, choice, plugins, onModel, on
                 setModelRow((r) => Math.min(count - 1, r + 1));
             else if (key.leftArrow)
                 setColumn("providers");
+            else if (input === "k")
+                startConnect();
             else if (key.return) {
                 if (modelRow === 0) {
                     setCustom("");
@@ -85,6 +127,14 @@ export function Settings({ width, height, settings, choice, plugins, onModel, on
                 setColumn("models");
                 setModelRow(0);
             }
+            else
+                startConnect();
+        }
+        else if (tab === "Model" && input === "k") {
+            startConnect();
+        }
+        else if (tab === "Engine" && (key.return || input === " ")) {
+            onEngine(ENGINES[row].id);
         }
         else if (tab === "Preferences" && (key.return || input === " " || key.leftArrow || key.rightArrow)) {
             const pref = PREFS[row];
@@ -111,16 +161,32 @@ export function Settings({ width, height, settings, choice, plugins, onModel, on
     const body = () => {
         if (tab === "Model") {
             const leftWidth = Math.min(46, Math.floor(width * 0.45));
+            // Room for the label next to the marker, "local"/"cloud" and the lock (plus the border).
+            const labelWidth = Math.max(10, leftWidth - 14);
             return (_jsxs(Box, { flexDirection: "row", height: boxHeight, children: [_jsxs(Box, { flexDirection: "column", width: leftWidth, borderStyle: "round", borderColor: column === "providers" ? C.accent : C.dim, children: [_jsx(Text, { color: C.dim, bold: true, children: " PROVIDER" }), providers.map((p, i) => {
                                 const problem = p.unavailable();
                                 const selected = i === row;
                                 const current = p.id === choice.provider.id;
-                                return (_jsxs(Text, { wrap: "truncate-end", ...(selected && column === "providers" ? { backgroundColor: C.panel } : {}), children: [_jsx(Text, { color: current ? C.green : C.dim, children: current ? " ● " : "   " }), _jsx(Text, { color: problem ? C.dim : C.text, bold: selected, children: p.label.padEnd(26).slice(0, 26) }), _jsx(Text, { color: p.local ? C.green : C.accent2, children: p.local ? " local" : " cloud" }), problem ? _jsx(Text, { color: C.dim, children: " \uD83D\uDD12" }) : null] }, p.id));
-                            })] }), _jsxs(Box, { flexDirection: "column", flexGrow: 1, borderStyle: "round", borderColor: column === "models" ? C.accent : C.dim, paddingX: 1, children: [_jsxs(Text, { color: C.dim, bold: true, children: ["MODELS \u00B7 ", provider.label] }), provider.unavailable() ? (_jsxs(_Fragment, { children: [_jsxs(Text, { color: C.yellow, children: ["Not set up: ", provider.unavailable()] }), _jsx(Text, { color: C.dim, children: "Add it to a .env file in your project (see .env.example) or your environment, then restart Nou." })] })) : (_jsxs(_Fragment, { children: [typing ? (_jsxs(Text, { children: [_jsx(Text, { color: C.accent2, children: "\u270E " }), _jsx(TextInput, { value: custom, onChange: setCustom, onSubmit: (v) => {
+                                return (_jsxs(Text, { wrap: "truncate-end", ...(selected && column === "providers" ? { backgroundColor: C.panel } : {}), children: [_jsx(Text, { color: current ? C.green : C.dim, children: current ? " ● " : "   " }), _jsx(Text, { color: problem ? C.dim : C.text, bold: selected, children: p.label.padEnd(labelWidth).slice(0, labelWidth) }), _jsx(Text, { color: p.local ? C.green : C.accent2, children: p.local ? " local" : " cloud" }), problem ? _jsx(Text, { color: C.dim, children: " \uD83D\uDD12" }) : null] }, p.id));
+                            })] }), _jsxs(Box, { flexDirection: "column", flexGrow: 1, borderStyle: "round", borderColor: column === "models" ? C.accent : C.dim, paddingX: 1, children: [_jsxs(Text, { color: C.dim, bold: true, children: ["MODELS \u00B7 ", provider.label] }), connecting && provider.connect ? (_jsxs(_Fragment, { children: [_jsxs(Text, { color: C.accent2, bold: true, children: ["Connect ", provider.label] }), provider.connect.map((f, i) => {
+                                        const entered = connecting.values[f.env];
+                                        const shown = (v) => (f.secret ? "•".repeat(Math.min(v.length, 12)) : v);
+                                        if (i < connecting.step) {
+                                            return _jsxs(Text, { color: C.dim, wrap: "truncate-end", children: ["\u2713 ", f.label, ": ", entered ? shown(entered) : "unchanged"] }, f.env);
+                                        }
+                                        if (i > connecting.step)
+                                            return _jsxs(Text, { color: C.dim, children: ["  ", f.label, f.optional ? " (optional)" : ""] }, f.env);
+                                        return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [_jsxs(Text, { color: C.accent2, children: ["\u270E ", f.label, f.optional ? " (optional)" : "", ": "] }), _jsx(TextInput, { value: field, onChange: setField, onSubmit: submitField, ...(f.secret ? { mask: "•" } : {}), ...(f.placeholder ? { placeholder: f.placeholder } : {}) })] }), _jsxs(Text, { color: C.dim, wrap: "truncate-end", children: ["  ", f.env, process.env[f.env] ? (f.secret ? ` is set (from ${originOf(f.env)}); Enter keeps it` : "") : f.optional ? "; Enter skips" : ""] }), setOutsideNou(f.env) && (_jsxs(Text, { color: C.yellow, wrap: "wrap", children: ["  A new one works now, but ", originOf(f.env), " sets ", f.env, " too and wins when Nou restarts: change or remove it there."] }))] }, f.env));
+                                    }), _jsx(Text, { children: " " }), _jsx(Text, { color: C.dim, wrap: "truncate-end", children: "Saved to ~/.nou/credentials.json (only you can read it). Your environment and .env still win." })] })) : provider.unavailable() ? (_jsxs(_Fragment, { children: [_jsxs(Text, { color: C.yellow, children: ["Not set up: ", provider.unavailable()] }), provider.connect
+                                        ? _jsx(Text, { color: C.accent2, children: "Press Enter to connect it: paste your key here, no restart needed." })
+                                        : null, _jsx(Text, { color: C.dim, children: "Or add it to a .env file in your project (see .env.example) or your environment." })] })) : (_jsxs(_Fragment, { children: [typing ? (_jsxs(Text, { children: [_jsx(Text, { color: C.accent2, children: "\u270E " }), _jsx(TextInput, { value: custom, onChange: setCustom, onSubmit: (v) => {
                                                     setTyping(false);
                                                     if (v.trim())
                                                         onModel({ provider, model: v.trim() });
-                                                }, placeholder: `e.g. ${provider.defaultModel}` })] })) : (_jsx(Text, { ...(column === "models" && modelRow === 0 ? { backgroundColor: C.panel } : {}), color: C.accent2, children: "\u270E Type a model name\u2026" })), listed === "loading" && _jsxs(Text, { color: C.accent2, children: [SPINNER[frame % SPINNER.length], " loading models\u2026"] }), listed && typeof listed === "object" && !Array.isArray(listed) && _jsxs(Text, { color: C.red, children: ["Couldn't list models: ", listed.error] }), (() => {
+                                                }, placeholder: `e.g. ${provider.defaultModel}` })] })) : (_jsx(Text, { ...(column === "models" && modelRow === 0 ? { backgroundColor: C.panel } : {}), color: C.accent2, children: "\u270E Type a model name\u2026" })), listed === "loading" && _jsxs(Text, { color: C.accent2, children: [SPINNER[frame % SPINNER.length], " loading models\u2026"] }), listed && typeof listed === "object" && !Array.isArray(listed) && (_jsxs(_Fragment, { children: [_jsxs(Text, { color: C.red, children: ["Couldn't list models: ", listed.error] }), rejectedKey(listed.error) && provider.connect?.some((f) => f.secret) && (() => {
+                                                const key = provider.connect.find((f) => f.secret).env;
+                                                return _jsxs(Text, { color: C.yellow, wrap: "wrap", children: ["The ", key, " ", originOf(key) ? `from ${originOf(key)} ` : "", "was rejected. Press k to enter a different key."] });
+                                            })()] })), (() => {
                                         const visibleCount = Math.max(1, boxHeight - 6);
                                         const offset = Math.max(0, Math.min(modelRow - 1 - Math.floor(visibleCount / 2), modelItems.length - visibleCount));
                                         return modelItems.slice(offset, offset + visibleCount).map((m, i) => {
@@ -131,6 +197,13 @@ export function Settings({ width, height, settings, choice, plugins, onModel, on
                                         });
                                     })()] }))] })] }));
         }
+        if (tab === "Engine") {
+            return (_jsxs(Box, { flexDirection: "column", height: boxHeight, borderStyle: "round", borderColor: C.accent, paddingX: 1, children: [ENGINES.map((engine, i) => {
+                        const selected = i === row;
+                        const active = engine.id === settings.engine;
+                        return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsxs(Text, { ...(selected ? { backgroundColor: C.panel } : {}), children: [_jsx(Text, { color: selected ? C.accent2 : C.dim, children: selected ? "▸ " : "  " }), _jsx(Text, { color: active ? C.green : C.dim, bold: true, children: active ? "● " : "○ " }), _jsx(Text, { color: C.text, bold: selected, children: engine.label.padEnd(14) }), _jsxs(Text, { color: C.dim, children: [active ? "in use · " : "", isInstalled(engine) ? "" : "installs on first use · ", "model: ", engine.model(choice)] })] }), _jsxs(Text, { color: C.dim, wrap: "truncate-end", children: ["    ", engine.description] }), engine.approvals === "after" && _jsx(Text, { color: C.orange, wrap: "truncate-end", children: "    Nou can't ask before its edits; it shows them afterwards so you can undo them." })] }, engine.id));
+                    }), _jsx(Text, { color: C.dim, wrap: "truncate-end", children: "The engine is the agent that answers in the chat. Diffs, approvals, undo and problems work with each one." })] }));
+        }
         if (tab === "Preferences") {
             return (_jsx(Box, { flexDirection: "column", height: boxHeight, borderStyle: "round", borderColor: C.accent, paddingX: 1, children: PREFS.map((pref, i) => {
                     const selected = i === row;
@@ -151,15 +224,21 @@ export function Settings({ width, height, settings, choice, plugins, onModel, on
                             (p.plugin.diagnostics ?? []).length && "checker",
                         ].filter(Boolean)
                         : [];
-                    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { ...(selected ? { backgroundColor: C.panel } : {}), children: [_jsx(Text, { color: selected ? C.accent2 : C.dim, children: selected ? "▸ " : "  " }), toggle(enabled), _jsxs(Text, { color: C.text, bold: true, children: [" ", p.plugin?.name ?? p.id] }), _jsxs(Text, { color: C.dim, children: [" ", p.plugin?.version ? `v${p.plugin.version} · ` : "", p.scope, parts.length ? ` · ${parts.join(", ")}` : ""] })] }), state === "changed"
+                    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { ...(selected ? { backgroundColor: C.panel } : {}), children: [_jsx(Text, { color: selected ? C.accent2 : C.dim, children: selected ? "▸ " : "  " }), p.scope === "starter" ? _jsx(Text, { color: C.accent2, bold: true, children: "+ ADD" }) : toggle(enabled), _jsxs(Text, { color: C.text, bold: true, children: [" ", p.plugin?.name ?? p.id] }), _jsxs(Text, { color: C.dim, children: [" ", p.plugin?.version ? `v${p.plugin.version} · ` : "", p.scope === "starter" ? "starter, optional" : p.scope, parts.length ? ` · ${parts.join(", ")}` : ""] })] }), state === "changed"
                                 ? _jsx(Text, { color: C.yellow, wrap: "truncate-end", children: "    \u26A0 Changed since you enabled it. Review the code, then press Enter to enable again." })
                                 : p.error
                                     ? _jsxs(Text, { color: C.red, wrap: "truncate-end", children: ["    \u2716 ", p.error] })
                                     : _jsxs(Text, { color: C.dim, wrap: "truncate-end", children: ["    ", p.plugin?.description ?? (enabled ? "" : "Enable to load it.")] })] }, p.id));
-                }), _jsx(Text, { children: " " }), _jsxs(Text, { color: C.dim, wrap: "truncate-end", children: ["Add your own: drop a .js/.mjs file into ", PLUGIN_DIRS.map((d) => d.dir).join(" or "), ", then press r."] }), _jsx(Text, { color: C.dim, wrap: "truncate-end", children: "Example: examples/plugins/word-count.mjs in the Nou repo." })] }));
+                }), _jsx(Text, { children: " " }), _jsxs(Text, { color: C.dim, wrap: "truncate-end", children: ["Starters: Enter adds one to ", PLUGIN_DIRS.find((d) => d.scope === "user").dir, ", where you can edit it."] }), _jsxs(Text, { color: C.dim, wrap: "truncate-end", children: ["Write your own: /plugins new <name>, or drop a .js/.mjs file into ", PLUGIN_DIRS.map((d) => d.dir).join(" or "), ", then press r."] })] }));
     };
     const hints = tab === "Model"
-        ? column === "models" ? "↑↓ choose · Enter use model · ← providers" : "↑↓ provider · Enter/→ pick a model"
-        : tab === "Preferences" ? "↑↓ move · Enter/Space toggle · ←→ change option" : "↑↓ move · Enter toggle · r rescan";
+        ? connecting ? "Enter next · Esc cancel" : column === "models" ? `↑↓ choose · Enter use model · ← providers${provider.connect ? " · k change key" : ""}` : `↑↓ provider · Enter/→ ${provider.unavailable() ? "connect" : "pick a model"}${provider.connect ? " · k change key" : ""}`
+        : tab === "Engine" ? "↑↓ move · Enter use this engine" : tab === "Preferences" ? "↑↓ move · Enter/Space toggle · ←→ change option" : "↑↓ move · Enter toggle · r rescan";
     return (_jsxs(Box, { flexDirection: "column", width: width, height: height, paddingX: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: C.accent2, bold: true, children: "\u2699 Settings  " }), TABS.map((t) => (_jsx(Text, { ...(t === tab ? { backgroundColor: C.accent2, color: "black" } : { color: C.dim }), bold: t === tab, children: ` ${t} ` }, t))), _jsx(Text, { color: C.dim, children: "   current: " }), _jsx(Text, { color: C.green, children: describe(choice) }), _jsxs(Text, { color: C.dim, children: ["   nou v", currentVersion()] })] }), _jsx(Text, { children: " " }), body(), _jsxs(Text, { color: C.dim, children: [" Tab next section \u00B7 ", hints, " \u00B7 Esc close   ", _jsx(Text, { color: C.dim, children: "saved to ~/.nou/config.json" })] })] }));
 }
+/** What a connect field starts with: the current URL to edit (keys stay hidden, so they start empty). */
+function initialValue(f) {
+    return f.secret ? "" : process.env[f.env] ?? "";
+}
+/** Whether a provider error means the API key is wrong (rather than, say, the server being down). */
+const rejectedKey = (error) => /\b(401|403)\b|api key|unauthori[sz]ed|authentication/i.test(error);

package/dist/src/ui/mouse.js

@@ -0,0 +1,52 @@
+import { useEffect, useRef } from "react";
+import { useStdin } from "ink";
+// Report clicks and wheel (1000) using SGR coordinates (1006), which work past column 223.
+const ENABLE = "\x1b[?1000h\x1b[?1006h";
+const DISABLE = "\x1b[?1000l\x1b[?1006l";
+/** Mouse events in a chunk of terminal input (SGR format: ESC [ < button ; x ; y M|m). */
+export function parseMouse(chunk) {
+    const events = [];
+    // eslint-disable-next-line no-control-regex -- mouse reports start with ESC
+    for (const m of chunk.matchAll(/\x1b\[<(\d+);(\d+);(\d+)([Mm])/g)) {
+        const code = Number(m[1]);
+        const x = Number(m[2]) - 1;
+        const y = Number(m[3]) - 1;
+        const button = code & 0b11000011; // drop the shift/alt/ctrl bits
+        if (button === 64 || button === 65)
+            events.push({ kind: "wheel", dir: button === 64 ? -1 : 1, x, y });
+        else if (button === 0 && m[4] === "M")
+            events.push({ kind: "click", x, y });
+    }
+    return events;
+}
+let exitHookInstalled = false;
+/**
+ * Turns on mouse reporting while mounted and calls `handler` for wheel and click events.
+ * Ink keeps reading the keyboard as usual: a 'data' listener sees the same chunks Ink reads, and Ink
+ * already ignores mouse sequences, so they never show up as typed text.
+ */
+export function useMouse(handler, enabled) {
+    const { stdin } = useStdin();
+    const latest = useRef(handler);
+    latest.current = handler;
+    useEffect(() => {
+        if (!enabled || !stdin)
+            return;
+        const terminal = process.stdout.isTTY ? process.stdout : null;
+        terminal?.write(ENABLE);
+        if (terminal && !exitHookInstalled) {
+            // Leave the terminal clean even if Nou crashes; otherwise the shell gets mouse garbage.
+            process.on("exit", () => process.stdout.write(DISABLE));
+            exitHookInstalled = true;
+        }
+        const onData = (data) => {
+            for (const event of parseMouse(String(data)))
+                latest.current(event);
+        };
+        stdin.on("data", onData);
+        return () => {
+            stdin.off("data", onData);
+            terminal?.write(DISABLE);
+        };
+    }, [enabled, stdin]);
+}

package/dist/src/ui/text.js

@@ -98,3 +98,15 @@ export function changedLines(before, after) {
     }
     return lines;
 }
+/** Lines added and removed, for summaries like "+12 -3". */
+export function lineCounts(before, after) {
+    let added = 0;
+    let removed = 0;
+    for (const part of diffLines(before.replace(/\r\n/g, "\n"), after.replace(/\r\n/g, "\n"))) {
+        if (part.added)
+            added += part.count ?? 0;
+        else if (part.removed)
+            removed += part.count ?? 0;
+    }
+    return { added, removed };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nou-cli",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Nou: an IDE-style AI coding assistant for your terminal. Local (Ollama, LM Studio) and cloud (Claude, OpenAI, Gemini...) models, live diffs, git-aware, built-in editor.",
   "type": "module",
   "bin": {
@@ -8,6 +8,7 @@
   },
   "files": [
     "dist",
+    "plugins",
     ".env.example",
     "README.md"
   ],
@@ -19,7 +20,8 @@
     "build": "tsc -p tsconfig.build.json && node scripts/copy-grammars.mjs",
     "start": "node dist/index.js",
     "typecheck": "tsc --noEmit -p .",
-    "lint": "eslint index.ts src",
+    "lint": "eslint index.ts src evals plugins",
+    "eval": "tsx evals/run.ts",
     "prepublishOnly": "npm run build",
     "screenshot": "node -e \"process.env.FORCE_COLOR='3';require('child_process').execSync('npx tsx scripts/screenshot.tsx',{stdio:'inherit'})\"",
     "test": "tsx tests/unit.ts && tsx tests/e2e.tsx"
@@ -57,7 +59,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^10.0.1",
-    "@types/node": "^25.5.0",
+    "@types/node": "^22.20.5",
     "@types/react": "^19.3.0",
     "eslint": "^10.2.0",
     "globals": "^17.4.0",

package/plugins/fetch-url.mjs

@@ -0,0 +1,82 @@
+// Starter plugin: lets the model read a web page (docs, an issue, a changelog) as plain text.
+const MAX_CHARS = 20_000;
+const TIMEOUT_MS = 15_000;
+
+const ENTITIES = { nbsp: " ", lt: "<", gt: ">", quot: "\"", "#39": "'", amp: "&" };
+
+/** Elements whose contents aren't page text. */
+const SKIPPED = new Set(["script", "style", "noscript", "svg"]);
+/** Tags that end a line of text. */
+const BREAKS = new Set(["br", "/p", "/div", "/li", "/tr", "/h1", "/h2", "/h3", "/h4", "/h5", "/h6"]);
+
+/**
+ * Keeps the text between tags. Every "<" starts a tag (page text writes a literal one as &lt;), which
+ * runs to the next ">"; skipped elements lose their contents too. Nothing tag-like can survive.
+ */
+function stripTags(html) {
+  const lower = html.toLowerCase();
+  let out = "";
+  let i = 0;
+  while (i < html.length) {
+    const open = lower.indexOf("<", i);
+    if (open < 0) return out + html.slice(i);
+    out += html.slice(i, open);
+    const end = lower.indexOf(">", open);
+    if (end < 0) return out; // a tag that never closes: the rest is inside it
+    // "p" for <p class=x>, "/p" for </p>, "br" for <br/>.
+    const inner = lower.slice(open + 1, end);
+    const closing = inner.startsWith("/");
+    const name = `${closing ? "/" : ""}${inner.slice(closing ? 1 : 0).split(/[\s/]/)[0]}`;
+    if (BREAKS.has(name)) out += "\n";
+    i = end + 1;
+    if (SKIPPED.has(name)) {
+      const close = lower.indexOf(`</${name}`, i);
+      if (close < 0) return out; // never closed: the rest is its contents
+      const closeEnd = lower.indexOf(">", close);
+      i = closeEnd < 0 ? html.length : closeEnd + 1;
+    }
+  }
+  return out;
+}
+
+/** Rough HTML to text: drops scripts, styles and tags, keeps the words. */
+export function htmlToText(html) {
+  // Entities after the tags, in one pass, so "&amp;lt;" becomes "&lt;", not "<".
+  return stripTags(html)
+    .replace(/&(nbsp|lt|gt|quot|#39|amp);/g, (_, name) => ENTITIES[name])
+    .replace(/[ \t]+/g, " ")
+    .replace(/\n\s*\n+/g, "\n\n")
+    .trim();
+}
+
+async function fetchText(url) {
+  if (!/^https?:\/\//i.test(url)) throw new Error("only http(s) URLs");
+  const response = await fetch(url, { signal: AbortSignal.timeout(TIMEOUT_MS), headers: { "user-agent": "nou-fetch-url" } });
+  const type = response.headers.get("content-type") ?? "";
+  const body = await response.text();
+  const text = type.includes("html") ? htmlToText(body) : body;
+  const cut = text.length > MAX_CHARS ? `${text.slice(0, MAX_CHARS)}\n[... ${text.length - MAX_CHARS} more chars cut]` : text;
+  return `${response.status} ${response.statusText} · ${url}\n\n${cut}`;
+}
+
+export default {
+  name: "Fetch URL",
+  version: "0.1.0",
+  description: "Adds a fetch_url tool so the model can read docs and web pages (asks first).",
+
+  tools: [
+    {
+      // Not read-only: it reaches the network, so you approve each URL.
+      definition: {
+        name: "fetch_url",
+        description: "Fetch a web page or file over http(s) and return it as text",
+        parameters: {
+          type: "object",
+          properties: { url: { type: "string", description: "The http(s) URL" } },
+          required: ["url"],
+        },
+      },
+      run: (args) => fetchText(String(args.url)),
+    },
+  ],
+};

package/plugins/project-rules.mjs

@@ -0,0 +1,43 @@
+// Starter plugin: gives the model the instructions you already wrote for other coding agents
+// (AGENTS.md, CLAUDE.md, Cursor and Copilot rules), so you don't have to repeat them in NOU.md.
+import { existsSync, readFileSync } from "fs";
+import path from "path";
+import process from "process";
+
+const FILES = ["AGENTS.md", "CLAUDE.md", "GEMINI.md", ".cursorrules", ".github/copilot-instructions.md"];
+const MAX_CHARS = 8_000;
+
+function readRules(cwd) {
+  return FILES.filter((file) => existsSync(path.join(cwd, file)))
+    .map((file) => {
+      const text = readFileSync(path.join(cwd, file), "utf-8").trim();
+      return { file, text: text.length > MAX_CHARS ? `${text.slice(0, MAX_CHARS)}\n[... cut]` : text };
+    })
+    .filter((rule) => rule.text);
+}
+
+export default {
+  name: "Project rules",
+  version: "0.1.0",
+  description: "Reads AGENTS.md, CLAUDE.md, .cursorrules and Copilot instructions into the system prompt. /rules lists them.",
+
+  // A getter, so edits to those files are picked up whenever the prompt is rebuilt.
+  get systemPrompt() {
+    const rules = readRules(process.cwd());
+    if (!rules.length) return undefined;
+    return `Follow the project's own instructions:\n${rules.map((r) => `--- ${r.file} ---\n${r.text}`).join("\n\n")}`;
+  },
+
+  commands: [
+    {
+      name: "rules",
+      description: "Show which instruction files are in use",
+      run(args, ctx) {
+        const rules = readRules(ctx.cwd);
+        return rules.length
+          ? `Using: ${rules.map((r) => `${r.file} (${r.text.length} chars)`).join(", ")}`
+          : `None found. Looked for ${FILES.join(", ")}.`;
+      },
+    },
+  ],
+};