@steerable/agent-cli 0.6.57 → 0.6.59

package/dist/tui/run.js

@@ -3,6 +3,50 @@ import { installAgentKeybindings } from './keys.js';
 import { AgentTui } from './session.js';
 export async function runTui(options) {
     installAgentKeybindings();
+    if (options.terminal)
+        return runPlainTui(options);
+    try {
+        return await runOpenTui(options);
+    }
+    catch (error) {
+        if (!openTuiUnavailable(error))
+            throw error;
+        return runPlainTui(options);
+    }
+}
+async function runOpenTui(options) {
+    const { createCliRenderer } = await import('@opentui/core');
+    const { OpenTuiView } = await import('./view.js');
+    const renderer = await createCliRenderer({
+        exitOnCtrlC: false,
+        useMouse: false,
+        consoleMode: 'disabled',
+        openConsoleOnError: false,
+        screenMode: 'alternate-screen',
+        backgroundColor: '#16161e',
+        targetFps: 30,
+    });
+    return new Promise((resolve) => {
+        const session = new AgentTui(options.client, {
+            product: options.product,
+            ...(options.dataDir ? { dataDir: options.dataDir } : {}),
+            onChange() {
+                view.apply(session.snapshot());
+            },
+            onExit() {
+                renderer.destroy();
+                resolve(0);
+            },
+        });
+        const view = new OpenTuiView(renderer);
+        renderer.prependInputHandler((sequence) => {
+            session.handleInput(sequence);
+            return true;
+        });
+        void session.open().then(() => view.apply(session.snapshot()));
+    });
+}
+function runPlainTui(options) {
     const terminal = options.terminal ?? new ProcessTerminal();
     const tui = new TuiAltScreen(terminal);
     return new Promise((resolve) => {
@@ -23,3 +67,10 @@ export async function runTui(options) {
         tui.start();
     });
 }
+function openTuiUnavailable(error) {
+    const cause = error instanceof Error && error.cause instanceof Error ? error.cause.message : '';
+    const message = `${error instanceof Error ? error.message : String(error)} ${cause}`;
+    return message.includes('OpenTUI native FFI')
+        || message.includes('--experimental-ffi')
+        || message.includes('node:ffi');
+}

package/dist/tui/screen.d.ts

@@ -30,4 +30,13 @@ export interface TuiScreen {
     status: string;
 }
 export declare function renderScreen(screen: TuiScreen, width: number): string[];
+export declare function toolText(line: TranscriptLine): string;
+export declare function chatText(chat: ChatRow): string;
+export declare function helpLines(): string[];
+export declare function approvalLines(approval: {
+    toolName: string;
+    summary: string;
+}): string[];
+export declare function footerText(): string;
+export declare const readOnlyText = "\u53EA\u8BFB \u00B7 \u53E6\u4E00\u4E2A\u8FDB\u7A0B\u6B63\u5728\u8FD0\u884C";
 export declare function visibleText(lines: string[]): string;

package/dist/tui/screen.js

@@ -6,26 +6,45 @@ export function renderScreen(screen, width) {
         box.addChild(new PlainLine(line));
     return box.render(width);
 }
+export function toolText(line) {
+    return `▸ ${line.name}  ${line.args}  ${line.status ?? ''}`.trimEnd();
+}
+export function chatText(chat) {
+    const mark = chat.selected ? '*' : ' ';
+    const busy = chat.busy ? '  只读' : '';
+    return `${mark} ${chat.id}  ${chat.title}${busy}`;
+}
+export function helpLines() {
+    return ['/new 新会话', '/model 查看或切换模型', '/clear 清屏', '/help 帮助'];
+}
+export function approvalLines(approval) {
+    return [
+        `审批 ${approval.toolName} ${approval.summary}`.trimEnd(),
+        `${keyLabel('agent.approval.allowOnce')} 本次允许  ${keyLabel('agent.approval.allowSession')} 本会话  ${keyLabel('agent.approval.allowAlways')} 总是`,
+        `${keyLabel('agent.approval.denyOnce')} 拒绝  ${keyLabel('agent.approval.denySession')} 本会话拒绝  ${keyLabel('agent.approval.denyAlways')} 总是拒绝  ${keyLabel('agent.approval.abort')} 中止`,
+    ];
+}
+export function footerText() {
+    return `${keyLabel('agent.interrupt')} 中断 · ${keyLabel('agent.chats')} 会话 · /help`;
+}
+export const readOnlyText = '只读 · 另一个进程正在运行';
 export function visibleText(lines) {
     return lines.map((line) => line.trimEnd()).join('\n');
 }
 function screenLines(screen) {
     const lines = [`${screen.product} · ${screen.title} · ${screen.modelName}`];
     if (screen.help) {
-        lines.push('/new 新会话', '/model 查看或切换模型', '/clear 清屏', '/help 帮助');
+        lines.push(...helpLines());
     }
     else if (screen.chats) {
         lines.push('会话');
-        for (const chat of screen.chats) {
-            const mark = chat.selected ? '*' : ' ';
-            const busy = chat.busy ? '  只读' : '';
-            lines.push(`${mark} ${chat.id}  ${chat.title}${busy}`);
-        }
+        for (const chat of screen.chats)
+            lines.push(chatText(chat));
     }
     else {
         for (const line of screen.lines) {
             if (line.kind === 'tool')
-                lines.push(`▸ ${line.name}  ${line.args}  ${line.status ?? ''}`.trimEnd());
+                lines.push(toolText(line));
             else if (line.kind === 'user')
                 lines.push(`user ${line.text ?? ''}`);
             else
@@ -33,18 +52,15 @@ function screenLines(screen) {
         }
     }
     if (screen.readOnly)
-        lines.push('只读 · 另一个进程正在运行');
-    if (screen.approval) {
-        lines.push(`审批 ${screen.approval.toolName} ${screen.approval.summary}`.trimEnd());
-        lines.push(`${keyLabel('agent.approval.allowOnce')} 本次允许  ${keyLabel('agent.approval.allowSession')} 本会话  ${keyLabel('agent.approval.allowAlways')} 总是`);
-        lines.push(`${keyLabel('agent.approval.denyOnce')} 拒绝  ${keyLabel('agent.approval.denySession')} 本会话拒绝  ${keyLabel('agent.approval.denyAlways')} 总是拒绝  ${keyLabel('agent.approval.abort')} 中止`);
-    }
+        lines.push(readOnlyText);
+    if (screen.approval)
+        lines.push(...approvalLines(screen.approval));
     if (screen.ask)
         lines.push(`追问 ${screen.ask.prompt}`);
     lines.push(`> ${screen.draft}`);
     if (screen.status)
         lines.push(screen.status);
-    lines.push(`${keyLabel('agent.interrupt')} 中断 · ${keyLabel('agent.chats')} 会话 · /help`);
+    lines.push(footerText());
     return lines;
 }
 class PlainLine {

package/dist/tui/session.d.ts

@@ -1,5 +1,6 @@
 import { type Component } from '@earendil-works/pi-tui';
 import { type AgentClient } from '@steerable/agent-client';
+import { type TuiScreen } from './screen.js';
 export interface AgentTuiOptions {
     product: string;
     dataDir?: string;
@@ -31,6 +32,7 @@ export declare class AgentTui implements Component {
     settled(): Promise<void>;
     invalidate(): void;
     render(width: number): string[];
+    snapshot(): TuiScreen;
     handleInput(data: string): void;
     private screen;
     private showChats;

package/dist/tui/session.js

@@ -45,7 +45,10 @@ export class AgentTui {
     }
     invalidate() { }
     render(width) {
-        return renderScreen(this.screen(), width);
+        return renderScreen(this.snapshot(), width);
+    }
+    snapshot() {
+        return this.screen();
     }
     handleInput(data) {
         if (data.length > 1 && !data.includes('\x1b')) {

package/dist/tui/view.d.ts

@@ -0,0 +1,20 @@
+import { type CliRenderer } from '@opentui/core';
+import { type TuiScreen } from './screen.js';
+/** Live terminal picture. The session still owns input and the text snapshot. */
+export declare class OpenTuiView {
+    private readonly renderer;
+    private readonly heading;
+    private readonly model;
+    private readonly body;
+    private readonly readOnly;
+    private readonly overlay;
+    private readonly draft;
+    private readonly status;
+    private readonly footer;
+    private bodyKey;
+    private overlayKey;
+    constructor(renderer: CliRenderer);
+    apply(screen: TuiScreen): void;
+    private paintOverlay;
+    private replaceBody;
+}

package/dist/tui/view.js

@@ -0,0 +1,194 @@
+import { BoxRenderable, ScrollBoxRenderable, TextRenderable, } from '@opentui/core';
+import { approvalLines, chatText, footerText, helpLines, readOnlyText, toolText, } from './screen.js';
+const canvas = '#16161e';
+const bar = '#24283b';
+const ink = '#c0caf5';
+const dim = '#565f89';
+const user = '#7aa2f7';
+const tool = '#9ece6a';
+const warn = '#e0af68';
+const danger = '#f7768e';
+const prompt = '#bb9af7';
+const selected = '#33467c';
+/** Live terminal picture. The session still owns input and the text snapshot. */
+export class OpenTuiView {
+    renderer;
+    heading;
+    model;
+    body;
+    readOnly;
+    overlay;
+    draft;
+    status;
+    footer;
+    bodyKey = '';
+    overlayKey = '';
+    constructor(renderer) {
+        this.renderer = renderer;
+        const shell = new BoxRenderable(renderer, {
+            width: '100%',
+            height: '100%',
+            flexDirection: 'column',
+            backgroundColor: canvas,
+        });
+        const header = new BoxRenderable(renderer, {
+            width: '100%',
+            height: 1,
+            flexDirection: 'row',
+            justifyContent: 'space-between',
+            backgroundColor: bar,
+            paddingLeft: 1,
+            paddingRight: 1,
+        });
+        this.heading = text(renderer, ink);
+        this.model = text(renderer, user);
+        header.add(this.heading);
+        header.add(this.model);
+        this.body = new ScrollBoxRenderable(renderer, {
+            flexGrow: 1,
+            flexShrink: 1,
+            width: '100%',
+            stickyScroll: true,
+            stickyStart: 'bottom',
+            viewportCulling: false,
+            rootOptions: { backgroundColor: canvas },
+            contentOptions: { backgroundColor: canvas, paddingLeft: 1, paddingRight: 1, gap: 1 },
+        });
+        this.readOnly = text(renderer, danger);
+        this.readOnly.content = readOnlyText;
+        this.overlay = new BoxRenderable(renderer, {
+            width: '100%',
+            border: true,
+            borderStyle: 'rounded',
+            borderColor: warn,
+            backgroundColor: '#2d2a1f',
+            paddingLeft: 1,
+            paddingRight: 1,
+            visible: false,
+        });
+        const input = new BoxRenderable(renderer, {
+            width: '100%',
+            height: 1,
+            backgroundColor: bar,
+            paddingLeft: 1,
+            paddingRight: 1,
+        });
+        this.draft = text(renderer, prompt);
+        input.add(this.draft);
+        this.status = text(renderer, warn);
+        this.footer = text(renderer, dim);
+        const footerBar = new BoxRenderable(renderer, {
+            width: '100%',
+            height: 1,
+            backgroundColor: canvas,
+            paddingLeft: 1,
+            paddingRight: 1,
+        });
+        footerBar.add(this.footer);
+        shell.add(header);
+        shell.add(this.body);
+        shell.add(this.readOnly);
+        shell.add(this.overlay);
+        shell.add(input);
+        shell.add(this.status);
+        shell.add(footerBar);
+        renderer.root.add(shell);
+    }
+    apply(screen) {
+        this.heading.content = `${screen.product}  ${screen.title}`;
+        this.model.content = screen.modelName;
+        this.readOnly.visible = screen.readOnly;
+        this.draft.content = `> ${screen.draft}`;
+        this.status.content = screen.status;
+        this.status.visible = screen.status.length > 0;
+        this.footer.content = footerText();
+        this.paintOverlay(screen);
+        const key = bodyKey(screen);
+        if (key === this.bodyKey)
+            return;
+        this.bodyKey = key;
+        this.replaceBody(screen);
+    }
+    paintOverlay(screen) {
+        const lines = screen.approval
+            ? approvalLines(screen.approval)
+            : screen.ask
+                ? [`追问 ${screen.ask.prompt}`]
+                : [];
+        const key = lines.join('\n');
+        if (key === this.overlayKey)
+            return;
+        this.overlayKey = key;
+        for (const child of this.overlay.getChildren()) {
+            this.overlay.remove(child);
+            child.destroyRecursively();
+        }
+        this.overlay.visible = lines.length > 0;
+        this.overlay.height = lines.length === 0 ? 0 : lines.length + 2;
+        if (lines.length === 0)
+            return;
+        this.overlay.add(new TextRenderable(this.renderer, {
+            content: lines.join('\n'),
+            fg: ink,
+            width: '100%',
+            height: lines.length,
+            wrapMode: 'none',
+        }));
+    }
+    replaceBody(screen) {
+        for (const child of this.body.getChildren()) {
+            this.body.remove(child);
+            child.destroyRecursively();
+        }
+        const renderer = this.renderer;
+        if (screen.help) {
+            for (const line of helpLines())
+                this.body.add(text(renderer, dim, line));
+            return;
+        }
+        if (screen.chats) {
+            this.body.add(text(renderer, dim, '会话'));
+            for (const chat of screen.chats) {
+                const row = new BoxRenderable(renderer, {
+                    width: '100%',
+                    height: 1,
+                    backgroundColor: chat.selected ? selected : canvas,
+                    paddingLeft: 1,
+                });
+                row.add(text(renderer, chat.selected ? ink : dim, chatText(chat)));
+                this.body.add(row);
+            }
+            return;
+        }
+        for (const line of screen.lines)
+            this.body.add(transcriptRow(renderer, line));
+    }
+}
+function bodyKey(screen) {
+    return JSON.stringify({
+        help: screen.help,
+        chats: screen.chats,
+        lines: screen.lines,
+    });
+}
+function transcriptRow(renderer, line) {
+    if (line.kind === 'tool') {
+        const card = new BoxRenderable(renderer, {
+            width: '100%',
+            border: true,
+            borderStyle: 'rounded',
+            borderColor: tool,
+            paddingLeft: 1,
+            paddingRight: 1,
+        });
+        card.add(text(renderer, tool, toolText(line)));
+        return card;
+    }
+    if (line.kind === 'user') {
+        return text(renderer, user, `user ${line.text ?? ''}`);
+    }
+    return text(renderer, ink, line.text && line.text.length > 0 ? line.text : ' ');
+}
+function text(renderer, fg, content = '') {
+    return new TextRenderable(renderer, { content, fg, wrapMode: 'word' });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@steerable/agent-cli",
-  "version": "0.6.57",
+  "version": "0.6.59",
   "description": "Product-neutral command line for a Steerable host. Products supply the bin name and brand.",
   "license": "Apache-2.0",
   "homepage": "https://steerableframework.com/",
@@ -33,13 +33,14 @@
     "provenance": true
   },
   "engines": {
-    "node": ">=20"
+    "node": ">=26"
   },
   "dependencies": {
     "@earendil-works/pi-tui": "0.87.1",
-    "@steerable/agent-client": "0.6.57",
-    "@steerable/agent-protocol": "0.6.57",
-    "@steerable/agent-shell": "0.6.57"
+    "@opentui/core": "0.5.12",
+    "@steerable/agent-client": "0.6.59",
+    "@steerable/agent-protocol": "0.6.59",
+    "@steerable/agent-shell": "0.6.59"
   },
   "devDependencies": {
     "@types/node": "^22.10.5",