@beunec/rivine 0.1.3 → 0.1.5

package/dist/protocol/permissions.js

@@ -214,6 +214,18 @@ export function nextMode(current) {
         return 'default';
     return CYCLE_MODES[(index + 1) % CYCLE_MODES.length];
 }
+export function modeName(mode) {
+    switch (mode) {
+        case 'plan':
+            return 'plan';
+        case 'default':
+            return 'default';
+        case 'acceptEdits':
+            return 'accept edits';
+        case 'bypass':
+            return 'bypass';
+    }
+}
 export function describeMode(mode) {
     switch (mode) {
         case 'plan':

package/dist/ui/App.js

@@ -23,13 +23,14 @@ import { diff as gitDiff, gitBranchLine, prCreate } from '../protocol/git.js';
 import { Activity, ApprovalPrompt, Banner, ModePicker, WORDMARK_MIN_COLUMNS, ChoicePrompt, Completions, HelpPanel, StatusBar, TranscriptLine, ShellPane, SHELL_PANE_LINES, } from './components.js';
 import { TokenBuffer, terminalWidth } from './render.js';
 import { color } from './theme.js';
-import { completionsFor } from './slashCommands.js';
+import { completeInput, completionsFor } from './slashCommands.js';
 function trimToPane(text) {
     const lines = text.split('\n');
     return lines.length > SHELL_PANE_LINES * 2
         ? lines.slice(-SHELL_PANE_LINES * 2).join('\n')
         : text;
 }
+const ESC = String.fromCharCode(27);
 function grantKey(category, request) {
     if (category !== 'mcp')
         return category;
@@ -48,6 +49,14 @@ export function App({ cwd, initialMode, askForMode, oneShot }) {
     const [tool, setTool] = useState('');
     const [mode, setMode] = useState(initialMode);
     const [input, setInput] = useState('');
+    const [inputSeed, setInputSeed] = useState('');
+    const [inputNonce, setInputNonce] = useState(0);
+    const [screenGeneration, setScreenGeneration] = useState(0);
+    const setPromptText = useCallback((text) => {
+        setInput(text);
+        setInputSeed(text);
+        setInputNonce((n) => n + 1);
+    }, []);
     const [showHelp, setShowHelp] = useState(false);
     const [approval, setApproval] = useState(null);
     const [question, setQuestion] = useState(null);
@@ -114,6 +123,9 @@ export function App({ cwd, initialMode, askForMode, oneShot }) {
         }
         push('system', 'Ask for anything. /help for commands.');
     }, [push]);
+    const cancelModePick = useCallback(() => {
+        setPhase(sessionReadyRef.current ? 'ready' : 'starting');
+    }, []);
     const quit = useCallback(() => {
         void runnerRef.current?.shutdown().finally(() => exit());
     }, [exit]);
@@ -137,10 +149,13 @@ export function App({ cwd, initialMode, askForMode, oneShot }) {
                 quit();
                 return true;
             case '/clear':
+                process.stdout.write(ESC + '[2J' + ESC + '[3J' + ESC + '[H');
                 setLines([]);
+                setShowHelp(false);
+                setScreenGeneration((n) => n + 1);
                 return true;
             case '/mode':
-                cycleMode();
+                setPhase('mode');
                 return true;
             case '/plan':
                 setMode('plan');
@@ -201,7 +216,7 @@ export function App({ cwd, initialMode, askForMode, oneShot }) {
     }, [cwd, cycleMode, mode, push, quit, refreshBalance, status]);
     const submit = useCallback(async (message) => {
         const text = message.trim();
-        setInput('');
+        setPromptText('');
         if (!runnerRef.current)
             return;
         if (runnerRef.current.interactiveShell) {
@@ -418,6 +433,12 @@ export function App({ cwd, initialMode, askForMode, oneShot }) {
             cycleMode();
             return;
         }
+        if (key.tab) {
+            const completed = completeInput(input);
+            if (completed !== input)
+                setPromptText(completed);
+            return;
+        }
         if (key.escape && runnerRef.current?.killShell()) {
             push('notice', 'Stopped the running command.');
             return;
@@ -459,15 +480,16 @@ export function App({ cwd, initialMode, askForMode, oneShot }) {
         push(answer.approved ? 'system' : 'notice', answer.approved ? 'Approved.' : 'Declined.');
         resolve?.(answer);
     }, [push]);
+    const staticItems = useMemo(() => [{ kind: 'banner' }, ...lines.map((line) => ({ kind: 'line', line }))], [lines]);
     if (phase === 'fatal') {
         return (_jsx(Box, { flexDirection: "column", paddingX: 1, paddingY: 1, children: _jsx(Text, { color: color('danger'), children: fatal }) }));
     }
     const compactBanner = terminalWidth() < WORDMARK_MIN_COLUMNS || Boolean(oneShot);
     const matches = completionsFor(input);
     const busy = phase !== 'ready';
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: [{ id: 'banner' }], children: (item) => _jsx(Banner, { compact: compactBanner }, item.id) }), _jsx(Static, { items: lines, children: (line) => _jsx(TranscriptLine, { line: line }, line.id) }), live ? (_jsx(Box, { paddingX: 1, children: _jsx(Text, { color: color('text'), children: live }) })) : null, shellView ? _jsx(ShellPane, { text: shellView, live: shellActive }) : null, phase === 'running' && stage ? _jsx(Activity, { stage: stage, tool: tool }) : null, phase === 'mode' ? _jsx(ModePicker, { onPick: pickMode }) : null, phase === 'approval' && approval ? (_jsx(ApprovalPrompt, { approval: approval, allowAlways: isBatchable(approval.category), onChoice: answerApproval })) : null, phase === 'question' && question ? (question.options?.length ? (_jsx(ChoicePrompt, { prompt: question.prompt, options: question.options, onPick: answerQuestion })) : (_jsxs(Box, { flexDirection: "column", paddingX: 1, paddingY: 1, children: [_jsx(Text, { color: color('accent'), bold: true, children: question.prompt }), _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: color('user'), children: '› ' }), _jsx(TextInput, { placeholder: "your answer", onSubmit: answerQuestion })] })] }))) : null, phase === 'hitl' && hitl ? (_jsx(ChoicePrompt, { prompt: hitl.tool ? `${hitl.tool} — ${hitl.message}` : hitl.message, options: hitl.options?.length ? hitl.options : ['Approve', 'Decline'], onPick: (value) => answerHitl(hitl.options?.length
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: staticItems, children: (item) => item.kind === 'banner' ? (_jsx(Banner, { compact: compactBanner }, "banner")) : (_jsx(TranscriptLine, { line: item.line }, item.line.id)) }, screenGeneration), live ? (_jsx(Box, { paddingX: 1, children: _jsx(Text, { color: color('text'), children: live }) })) : null, shellView ? _jsx(ShellPane, { text: shellView, live: shellActive }) : null, phase === 'running' && stage ? _jsx(Activity, { stage: stage, tool: tool }) : null, phase === 'mode' ? (_jsx(ModePicker, { onPick: pickMode, current: modeChosenRef.current ? mode : undefined, onCancel: modeChosenRef.current ? cancelModePick : undefined })) : null, phase === 'approval' && approval ? (_jsx(ApprovalPrompt, { approval: approval, allowAlways: isBatchable(approval.category), onChoice: answerApproval })) : null, phase === 'question' && question ? (question.options?.length ? (_jsx(ChoicePrompt, { prompt: question.prompt, options: question.options, onPick: answerQuestion })) : (_jsxs(Box, { flexDirection: "column", paddingX: 1, paddingY: 1, children: [_jsx(Text, { color: color('accent'), bold: true, children: question.prompt }), _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: color('user'), children: '› ' }), _jsx(TextInput, { placeholder: "your answer", onSubmit: answerQuestion })] })] }))) : null, phase === 'hitl' && hitl ? (_jsx(ChoicePrompt, { prompt: hitl.tool ? `${hitl.tool} — ${hitl.message}` : hitl.message, options: hitl.options?.length ? hitl.options : ['Approve', 'Decline'], onPick: (value) => answerHitl(hitl.options?.length
                     ? { approved: true, feedback: value }
-                    : { approved: value === 'Approve' }) })) : null, showHelp && phase === 'ready' ? _jsx(HelpPanel, {}) : null, phase === 'ready' && !oneShot ? (_jsxs(_Fragment, { children: [_jsxs(Box, { paddingX: 1, children: [_jsx(Text, { color: color('user'), children: '› ' }), _jsx(TextInput, { placeholder: "What should Rivine build?", onChange: setInput, onSubmit: (value) => void submit(value) })] }), _jsx(Completions, { matches: matches })] })) : null, phase === 'starting' ? _jsx(Activity, { stage: "Starting\u2026", tool: "" }) : null, _jsx(StatusBar, { info: {
+                    : { approved: value === 'Approve' }) })) : null, showHelp && phase === 'ready' ? _jsx(HelpPanel, {}) : null, phase === 'ready' && !oneShot ? (_jsxs(_Fragment, { children: [_jsxs(Box, { paddingX: 1, children: [_jsx(Text, { color: color('user'), children: '› ' }), _jsx(TextInput, { defaultValue: inputSeed, placeholder: "What should Rivine build?", onChange: setInput, onSubmit: (value) => void submit(value) }, inputNonce)] }), _jsx(Completions, { matches: matches })] })) : null, phase === 'starting' ? _jsx(Activity, { stage: "Starting\u2026", tool: "" }) : null, _jsx(StatusBar, { info: {
                     mode,
                     project: status.project,
                     cloudhandle: status.cloudhandle,

package/dist/ui/components.js

@@ -9,12 +9,13 @@
  * redistribution or derivative works.
  */
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
 import { Box, Text, useInput } from 'ink';
 import { Spinner } from '@inkjs/ui';
 import { ASCII_ONLY, BOX, color, glyph, lineColor } from './theme.js';
-import { fit, terminalWidth, wrap } from './render.js';
+import { fit, terminalWidth, wrap, terminalColumns } from './render.js';
 import { SLASH_COMMANDS } from './slashCommands.js';
-import { describeMode } from '../protocol/permissions.js';
+import { describeMode, modeName } from '../protocol/permissions.js';
 const WORDMARK = [
     '█▀▄ ▀█▀ █   █ ▀█▀ █▄ █ █▀▀    █▀▀ █▀█ █▀▄ █▀▀',
     '█▀▄  █  ▀▄ ▄▀  █  █ ▀█ █▀     █   █ █ █ █ █▀ ',
@@ -39,7 +40,7 @@ export function Activity({ stage, tool }) {
     const label = tool ? `${stage} · ${tool}` : stage;
     return (_jsx(Box, { paddingX: 1, children: _jsx(Spinner, { label: fit(label, width - 6) }) }));
 }
-export function ModePicker({ onPick }) {
+export function ModePicker({ onPick, current, onCancel, }) {
     const width = terminalWidth();
     const options = [
         { key: '1', mode: 'plan', label: 'Plan', detail: 'reads and answers, changes nothing' },
@@ -48,15 +49,25 @@ export function ModePicker({ onPick }) {
         { key: '4', mode: 'bypass', label: 'Full speed', detail: 'no prompts inside this project' },
     ];
     useInput((input, key) => {
+        if (key.escape && onCancel) {
+            onCancel();
+            return;
+        }
         if (key.return) {
-            onPick('acceptEdits');
+            onPick(current ?? 'acceptEdits');
             return;
         }
         const found = options.find((o) => o.key === input);
         if (found)
             onPick(found.mode);
     });
-    return (_jsxs(Box, { flexDirection: "column", paddingX: 1, paddingY: 1, children: [_jsx(Text, { color: color('text'), bold: true, children: "How should Rivine work in this project?" }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: options.map((o) => (_jsxs(Box, { children: [_jsx(Text, { color: color('accent'), children: `  ${o.key}` }), _jsx(Text, { color: color('faint'), children: " \u00B7 " }), _jsx(Text, { color: color('text'), children: o.label.padEnd(13) }), _jsx(Text, { color: color('muted'), children: fit(o.detail, Math.max(10, width - 24)) })] }, o.key))) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: color('faint'), children: fit('press a number · enter for accept edits · shift+tab changes it later', width - 4) }) })] }));
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 1, paddingY: 1, children: [_jsx(Text, { color: color('text'), bold: true, children: "How should Rivine work in this project?" }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: options.map((o) => {
+                    const active = o.mode === current;
+                    return (_jsxs(Box, { children: [_jsx(Text, { color: active ? color('success') : color('faint'), children: active ? ' ›' : '  ' }), _jsx(Text, { color: color('accent'), children: o.key }), _jsx(Text, { color: color('faint'), children: " \u00B7 " }), _jsx(Text, { color: active ? color('text') : color('muted'), bold: active, children: o.label.padEnd(13) }), _jsx(Text, { color: color('muted'), children: fit(o.detail, Math.max(10, width - 26)) })] }, o.key));
+                }) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: color('faint'), children: fit(current
+                        ?
+                            `press a number · enter keeps ${options.find((o) => o.mode === current)?.label ?? 'this'} · esc cancels`
+                        : 'press a number · enter for accept edits · shift+tab changes it later', width - 4) }) })] }));
 }
 export const SHELL_PANE_LINES = 12;
 export function ShellPane({ text, live }) {
@@ -104,8 +115,51 @@ export function HelpPanel() {
     return (_jsxs(Box, { flexDirection: "column", paddingX: 1, paddingY: 1, children: [_jsx(Text, { color: color('text'), bold: true, children: "Commands" }), SLASH_COMMANDS.map((c) => (_jsxs(Box, { children: [_jsx(Text, { color: color('accent'), children: `  ${c.name}`.padEnd(12) }), _jsx(Text, { color: color('muted'), children: c.summary })] }, c.name))), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { color: color('faint'), children: "  shift+tab   change permission mode" }), _jsx(Text, { color: color('faint'), children: "  esc         stop the current turn" }), _jsx(Text, { color: color('faint'), children: "  ctrl+c      quit" })] })] }));
 }
 export function StatusBar({ info }) {
-    const width = terminalWidth();
-    const narrow = width < 76;
+    const width = terminalColumns();
     const dot = info.busy ? color('warn') : color('success');
-    return (_jsxs(Box, { paddingX: 1, children: [_jsxs(Text, { color: dot, children: [BOX.dot, " "] }), _jsx(Text, { color: color('muted'), children: describeMode(info.mode) }), info.project ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: color('faint'), children: " \u00B7 " }), _jsx(Text, { color: color('muted'), children: fit(info.project, 18, true) })] })) : null, !narrow && info.cloudhandle ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: color('faint'), children: " \u00B7 " }), _jsx(Text, { color: color('brand'), children: fit(info.cloudhandle, 22) }), info.bcidMasked ? _jsx(Text, { color: color('faint'), children: ` ${info.bcidMasked}` }) : null] })) : null, info.balance !== null ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: color('faint'), children: " \u00B7 " }), _jsxs(Text, { color: info.balance < 10 ? color('warn') : color('muted'), children: ["$", info.balance.toFixed(2)] })] })) : null, !narrow ? _jsx(Text, { color: color('faint'), children: '  /help' }) : null] }));
+    const segments = [];
+    let used = 2;
+    let full = true;
+    const add = (text, node) => {
+        if (!full)
+            return false;
+        const cost = (segments.length > 0 ? 3 : 0) + text.length;
+        if (used + cost > width - 2) {
+            full = false;
+            return false;
+        }
+        used += cost;
+        segments.push({ node, text });
+        return true;
+    };
+    const modeText = describeMode(info.mode);
+    const modeShort = modeName(info.mode);
+    const brand = 'Rivine';
+    const fitsBrandAndFullMode = 2 + brand.length + 3 + modeText.length <= width - 2;
+    if (2 + brand.length + 3 + modeShort.length <= width - 2) {
+        add(brand, (_jsx(Text, { color: color('brand'), bold: true, children: brand })));
+    }
+    const shownMode = fitsBrandAndFullMode ? modeText : modeShort;
+    used += (segments.length > 0 ? 3 : 0) + shownMode.length;
+    segments.push({
+        node: _jsx(Text, { color: color('muted'), children: shownMode }),
+        text: shownMode,
+    });
+    if (info.balance !== null) {
+        const money = `$${info.balance.toFixed(2)}`;
+        add(money, _jsx(Text, { color: info.balance < 10 ? color('warn') : color('muted'), children: money }));
+    }
+    if (info.project) {
+        const project = fit(info.project, 18, true);
+        add(project, _jsx(Text, { color: color('muted'), children: project }));
+    }
+    if (info.cloudhandle) {
+        const handle = fit(info.cloudhandle, 22);
+        const masked = info.bcidMasked ? ` ${info.bcidMasked}` : '';
+        add(handle + masked, _jsxs(_Fragment, { children: [_jsx(Text, { color: color('brand'), children: handle }), masked ? _jsx(Text, { color: color('faint'), children: masked }) : null] }));
+    }
+    if (used + 8 <= width - 2) {
+        segments.push({ node: _jsx(Text, { color: color('faint'), children: '  /help' }), text: '  /help' });
+    }
+    return (_jsxs(Box, { paddingX: 1, children: [_jsxs(Text, { color: dot, children: [BOX.dot, " "] }), segments.map((segment, i) => (_jsxs(React.Fragment, { children: [i > 0 && segment.text !== '  /help' ? (_jsx(Text, { color: color('faint'), children: " \u00B7 " })) : null, segment.node] }, i)))] }));
 }

package/dist/ui/render.js

@@ -49,6 +49,10 @@ export class TokenBuffer {
         this.pending = '';
     }
 }
+export function terminalColumns() {
+    const columns = process.stdout.columns;
+    return Math.max(20, columns && columns > 0 ? columns : 80);
+}
 export function terminalWidth() {
     const columns = process.stdout.columns;
     return Math.max(48, Math.min(columns && columns > 0 ? columns : 80, 120));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beunec/rivine",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "Rivine Code in your terminal — Beunec's software engineering runtime constructs, working on the files you already have open.",
   "license": "UNLICENSED",
   "author": "Beunec Technologies",