nou-cli 0.2.0 → 0.2.1

package/README.md

@@ -73,6 +73,8 @@ Every change is reviewed like a code review:
 
 | Key | Does |
 | --- | --- |
+| 🖱️ Mouse | wheel scrolls the pane under the pointer · click a pane to focus it · click a file to open it (hold <kbd>Shift</kbd> to select text; turn off in settings) |
+| <kbd>Shift</kbd>+<kbd>↑</kbd>/<kbd>↓</kbd>, <kbd>PgUp</kbd>/<kbd>PgDn</kbd> | scroll the chat history |
 | <kbd>Tab</kbd> | switch between files, code and chat |
 | <kbd>Ctrl</kbd>+<kbd>P</kbd> | fuzzy-find a file |
 | <kbd>e</kbd> | edit the open file (<kbd>Ctrl</kbd>+<kbd>S</kbd> save · <kbd>Ctrl</kbd>+<kbd>Z</kbd>/<kbd>Y</kbd> undo/redo · <kbd>Ctrl</kbd>+<kbd>K</kbd> info · <kbd>Ctrl</kbd>+<kbd>G</kbd> definition · <kbd>Esc</kbd> close) |

package/dist/src/config/index.js

@@ -13,6 +13,7 @@ export const DEFAULT_SETTINGS = {
     autoApproveCommands: false,
     gitContext: true,
     autoSave: "delay",
+    mouse: true,
     plugins: {},
     trustedPlugins: {},
 };

package/dist/src/ui/App.js

@@ -13,9 +13,10 @@ import { DiagnosticsManager, formatDiagnostic, newProblems } from "../diagnostic
 import { Timeline } from "../history/index.js";
 import { lsp } from "../lsp/index.js";
 import { onGrammarLoaded, preload } from "../syntax/index.js";
-import { checkForUpdate } from "../update/index.js";
+import { checkForUpdate, currentVersion } from "../update/index.js";
 import { changedLines } from "./text.js";
 import { ProblemsView } from "./ProblemsView.js";
+import { useMouse } from "./mouse.js";
 import { C } from "./theme.js";
 import { FileTree } from "./FileTree.js";
 import { CodeView } from "./CodeView.js";
@@ -35,6 +36,7 @@ const HELP = `Commands:
   /undo                undo Nou's last change (also: u)
   /rewind              undo everything from Nou's last turn
   /history             recent changes
+  /version             which version of Nou this is
 Keys:
   Ctrl+P  find a file      Tab  switch pane      Esc  stop / back
   e  edit open file        v    diff (git / Nou)  f   follow mode
@@ -84,6 +86,10 @@ export function App({ initialModel, permContext }) {
     const [pendingNote, setPendingNote] = useState(null);
     const [exitArmed, setExitArmed] = useState(false);
     const [update, setUpdate] = useState(null);
+    const [wheel, setWheel] = useState(null);
+    const [treeClick, setTreeClick] = useState(null);
+    // Pane geometry from the last render, so mouse events can be mapped to the pane under the pointer.
+    const layout = useRef({ treeWidth: 0, codeWidth: 0, paneHeight: 0 });
     const diagnosticsRef = useRef(null);
     diagnosticsRef.current ??= new DiagnosticsManager();
     const diagnostics = diagnosticsRef.current;
@@ -311,6 +317,26 @@ export function App({ initialModel, permContext }) {
         setExitArmed(true);
         setTimeout(() => setExitArmed(false), 2000);
     };
+    // Mouse: the wheel scrolls whatever pane is under the pointer; a click focuses that pane
+    // (and in the file tree, opens the clicked file).
+    useMouse((event) => {
+        if (view !== "main" || quickOpen)
+            return;
+        const { treeWidth, codeWidth, paneHeight } = layout.current;
+        if (event.y < 1 || event.y > paneHeight)
+            return; // header or status bar
+        const pane = event.x < treeWidth ? "tree" : event.x < treeWidth + codeWidth ? "code" : "chat";
+        if (event.kind === "wheel") {
+            setWheel((w) => ({ pane, dir: event.dir, nonce: (w?.nonce ?? 0) + 1 }));
+            return;
+        }
+        if (approval)
+            return;
+        setFocus(pane);
+        // Rows start under the pane's top border (y=1) and title (y=2).
+        if (pane === "tree" && event.y >= 3)
+            setTreeClick((c) => ({ row: event.y - 3, nonce: (c?.nonce ?? 0) + 1 }));
+    }, settings.mouse);
     // Ctrl+C: stop Nou if it's working; otherwise press twice to quit.
     useInput((input, key) => {
         if (!(key.ctrl && input === "c"))
@@ -558,6 +584,8 @@ ${snippet}
                 agentRef.current.clear();
                 setEntries([]);
                 return;
+            case "version":
+                return info(`nou v${currentVersion()}${update ? ` · v${update} is available, run \`nou update\`` : " · up to date"}`);
             case "help":
                 return info(HELP);
             default: {
@@ -618,6 +646,8 @@ ${snippet}
     const treeWidth = Math.max(24, Math.floor(columns * 0.2));
     const chatWidth = Math.max(34, Math.floor(columns * 0.3));
     const codeWidth = Math.max(20, columns - treeWidth - chatWidth);
+    layout.current = { treeWidth, codeWidth, paneHeight: height };
+    const wheelFor = (pane) => (wheel?.pane === pane ? wheel : null);
     const edited = new Set([...changes].filter(([, c]) => c.status === "applied").map(([p]) => p));
     const fileProblems = openFile ? diagnostics.get(openFile) : [];
     const totals = diagnostics.counts();
@@ -634,14 +664,14 @@ ${snippet}
         : showEditor && focus === "code"
             ? `Ctrl+S save${settings.autoSave === "off" ? "" : " (auto-save on)"} · Ctrl+Z/Y undo/redo · Ctrl+K info · Ctrl+G definition · Esc close`
             : focus === "chat"
-                ? busy ? "Esc stop · Tab switch pane" : "Enter send · / commands · Ctrl+P find file · Tab switch pane"
+                ? busy ? "Esc stop · Shift+↑↓ scroll chat · Tab switch pane" : "Enter send · Shift+↑↓ / PgUp scroll · / commands · Ctrl+P find file · Tab switch pane"
                 : focus === "tree"
                     ? "↑↓ move · Enter open · c changes · e edit · p problems · u undo · Ctrl+P find · s settings"
                     : diff ? "n/N next/prev change · v cycle diff · Esc close diff" : "↑↓ scroll · e edit · v diff · p problems · u undo · s settings";
-    return (_jsxs(Box, { flexDirection: "column", width: columns, height: rows, children: [_jsx(Header, { width: columns, branch: branch, changes: git.size, model: describe(choice), local: choice.provider.local, busy: busy, update: update }), _jsxs(Box, { flexDirection: "row", height: height, children: [_jsx(FileTree, { width: treeWidth, height: height, focused: focus === "tree" && !approval, openFile: openFile, reveal: reveal, version: treeVersion, changed: edited, git: git, problemCounts: diagnostics.fileCounts(), onOpen: (filePath) => {
+    return (_jsxs(Box, { flexDirection: "column", width: columns, height: rows, children: [_jsx(Header, { width: columns, branch: branch, changes: git.size, model: describe(choice), local: choice.provider.local, busy: busy, update: update }), _jsxs(Box, { flexDirection: "row", height: height, children: [_jsx(FileTree, { width: treeWidth, height: height, focused: focus === "tree" && !approval, openFile: openFile, reveal: reveal, version: treeVersion, changed: edited, git: git, problemCounts: diagnostics.fileCounts(), wheel: wheelFor("tree"), click: treeClick, onOpen: (filePath) => {
                             open(filePath);
                             setFocus("code");
-                        }, onHover: () => { } }), codePanel === "problems" && !pendingChange ? (_jsx(ProblemsView, { width: codeWidth, height: height, focused: focus === "code" && !approval, problems: diagnostics.all(), checking: checking, onJump: (file, line) => openAt(file, line), onClose: () => setCodePanel("code") })) : showEditor ? (_jsx(Editor, { width: codeWidth, height: height, focused: focus === "code", filePath: openFile, initial: draft.current?.path === openFile ? draft.current.text : content, baseline: draft.current?.path === openFile ? draft.current.baseline : content, startLine: editorStart.line, problems: fileProblems, autoSave: settings.autoSave, syntaxVersion: syntaxVersion, onHover: (text, line, col) => (lspEnabled ? lsp.hover(openFile, text, line, col) : Promise.resolve(null)), onDefinition: (text, line, col) => {
+                        }, onHover: () => { } }), codePanel === "problems" && !pendingChange ? (_jsx(ProblemsView, { width: codeWidth, height: height, focused: focus === "code" && !approval, problems: diagnostics.all(), checking: checking, wheel: wheelFor("code"), onJump: (file, line) => openAt(file, line), onClose: () => setCodePanel("code") })) : showEditor ? (_jsx(Editor, { width: codeWidth, height: height, focused: focus === "code", filePath: openFile, initial: draft.current?.path === openFile ? draft.current.text : content, baseline: draft.current?.path === openFile ? draft.current.baseline : content, startLine: editorStart.line, problems: fileProblems, autoSave: settings.autoSave, syntaxVersion: syntaxVersion, wheel: wheelFor("code"), onHover: (text, line, col) => (lspEnabled ? lsp.hover(openFile, text, line, col) : Promise.resolve(null)), onDefinition: (text, line, col) => {
                             if (!lspEnabled)
                                 return info("Go to definition needs a language server (see /settings → Plugins).", "error");
                             void lsp.definition(openFile, text, line, col).then((target) => {
@@ -660,7 +690,7 @@ ${snippet}
                             draft.current = state.dirty
                                 ? { path: openFile, text: state.lines.join("\n"), baseline: draft.current?.path === openFile ? draft.current.baseline : content }
                                 : null;
-                        } }, `${openFile}:${editorStart.nonce}`)) : (_jsx(CodeView, { width: codeWidth, height: height, focused: focus === "code" && !approval, filePath: openFile, content: content, diff: diff, diffLabel: diffMode === "git" ? "vs HEAD" : "Nou's edit", pending: !!pendingChange, marked: record?.lines ?? NO_LINES, problems: fileProblems, focusLine: focusLine, syntaxVersion: syntaxVersion, diffNote: pendingChange ? pendingNote?.short ?? (checking.length ? "checking…" : null) : null, onViewport: (top, bottom) => setViewport((v) => (v?.top === top && v.bottom === bottom ? v : { top, bottom })) })), _jsx(Chat, { width: chatWidth, height: height, focused: focus === "chat", entries: entries, streaming: streaming, busy: busy, approval: approval?.request ?? null, approvalNote: pendingChange ? pendingNote?.detail ?? null : null, contextChip: contextChip, onSubmit: send })] }), _jsx(Box, { children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { backgroundColor: mode.color, color: "black", bold: true, children: ` ${mode.label} ` }), _jsx(Text, { backgroundColor: C.panel, color: follow ? C.green : C.dim, children: follow ? " ◉ follow " : " ○ follow " }), _jsx(Text, { backgroundColor: C.panel, color: totals.errors ? C.red : C.dim, children: ` ✖ ${totals.errors}` }), _jsx(Text, { backgroundColor: C.panel, color: totals.warnings ? C.yellow : C.dim, children: ` ▲ ${totals.warnings} ` }), checking.length > 0 && _jsxs(Text, { color: C.accent2, children: [" \u27F3 ", checking.join(", ")] }), exitArmed
+                        } }, `${openFile}:${editorStart.nonce}`)) : (_jsx(CodeView, { width: codeWidth, height: height, focused: focus === "code" && !approval, filePath: openFile, content: content, diff: diff, diffLabel: diffMode === "git" ? "vs HEAD" : "Nou's edit", pending: !!pendingChange, marked: record?.lines ?? NO_LINES, problems: fileProblems, focusLine: focusLine, syntaxVersion: syntaxVersion, diffNote: pendingChange ? pendingNote?.short ?? (checking.length ? "checking…" : null) : null, wheel: wheelFor("code"), onViewport: (top, bottom) => setViewport((v) => (v?.top === top && v.bottom === bottom ? v : { top, bottom })) })), _jsx(Chat, { width: chatWidth, height: height, focused: focus === "chat", entries: entries, streaming: streaming, busy: busy, approval: approval?.request ?? null, approvalNote: pendingChange ? pendingNote?.detail ?? null : null, contextChip: contextChip, wheel: wheelFor("chat"), onSubmit: send })] }), _jsx(Box, { children: _jsxs(Text, { wrap: "truncate-end", children: [_jsx(Text, { backgroundColor: mode.color, color: "black", bold: true, children: ` ${mode.label} ` }), _jsx(Text, { backgroundColor: C.panel, color: follow ? C.green : C.dim, children: follow ? " ◉ follow " : " ○ follow " }), _jsx(Text, { backgroundColor: C.panel, color: totals.errors ? C.red : C.dim, children: ` ✖ ${totals.errors}` }), _jsx(Text, { backgroundColor: C.panel, color: totals.warnings ? C.yellow : C.dim, children: ` ▲ ${totals.warnings} ` }), checking.length > 0 && _jsxs(Text, { color: C.accent2, children: [" \u27F3 ", checking.join(", ")] }), exitArmed
                             ? _jsxs(Text, { color: C.yellow, bold: true, children: ["  ", "Press again to quit", draft.current && settings.autoSave === "off" ? ` (unsaved changes in ${draft.current.path} will be lost)` : ""] })
                             : _jsxs(Text, { color: C.dim, children: ["  ", hints] })] }) }), quickOpen && (_jsx(QuickOpen, { width: columns, top: 3, files: allFiles, onPick: (file) => {
                     setQuickOpen(false);

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

@@ -11,6 +11,7 @@ const TABS = ["Model", "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: "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 },

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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nou-cli",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "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": {
@@ -57,7 +57,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",