@kamilio/wire 0.1.9 → 0.1.10

package/node_modules/toolcraft/node_modules/toolcraft-design/dist/explorer/runtime.js

@@ -1,24 +1,25 @@
-import { ScreenBuffer, cellToAnsi, diff } from "../dashboard/buffer.js";
-import { createTerminalDriver } from "../dashboard/terminal.js";
+import { Screen } from "../screen/screen.js";
+import { appendFileSync } from "node:fs";
+import { createTerminalDriver } from "../terminal/driver.js";
 import { createDetailJobs } from "./jobs.js";
 import { computeExplorerLayout } from "./layout.js";
 import { renderExplorer } from "./render/index.js";
 import { step } from "./reducer.js";
-import { createInitialState, REGION_ALL, REGION_MODAL, REGION_TOAST } from "./state.js";
+import { createInitialState, REGION_ALL, REGION_FOOTER, REGION_MODAL, REGION_TOAST, normalizeExplorerConfig } from "./state.js";
 const TOAST_MS = 2500;
 export async function runExplorer(config) {
     if (process.stdout.isTTY !== true) {
         throw new Error("explorer requires a TTY");
     }
-    const driver = createTerminalDriver();
+    const driver = createTerminalDriver({ mouse: config.mouse });
     const runtime = new ExplorerRuntime(config, driver);
     return runtime.run();
 }
 class ExplorerRuntime {
-    config;
     driver;
+    config;
     state;
-    previousBuffer = new ScreenBuffer(0, 0);
+    screen;
     detailJobs;
     runtimeHandles;
     pendingEffects = new Set();
@@ -28,11 +29,14 @@ class ExplorerRuntime {
     rowsRequestToken = 0;
     reorderToken = 0;
     stopped = false;
+    renderScheduled = false;
+    tracePath = process.env.POE_CODE_TUI_TRACE;
     settle;
     constructor(config, driver) {
-        this.config = config;
         this.driver = driver;
-        this.state = createInitialState(config, driver.getSize());
+        this.config = normalizeExplorerConfig(config);
+        this.state = createInitialState(this.config, driver.getSize());
+        this.screen = new Screen(driver.getSize());
         this.detailJobs = createDetailJobs((event) => {
             if (event.type === "detailLoaded") {
                 this.loadDetailContent(event.rowId, event.token, event.items);
@@ -44,11 +48,18 @@ class ExplorerRuntime {
             refresh: async () => {
                 await this.refreshRowsFromSource();
             },
+            reloadDetail: (rowId) => {
+                this.reloadFocusedDetail(rowId);
+            },
             suspendAnd: async (fn) => this.suspendAnd(fn),
+            openModal: (content) => {
+                this.dispatch({ type: "modalOpened", title: content.title, content: content.content });
+            },
             toast: (msg, tone) => {
                 this.showToast(msg, tone);
             },
             confirm: async (prompt) => this.confirm(prompt),
+            promptText: async (options) => this.promptText(options),
             exit: (after) => {
                 this.exit(null, after);
             }
@@ -59,7 +70,11 @@ class ExplorerRuntime {
             this.settle = { resolve, reject };
             try {
                 this.startTerminal();
-                this.render();
+                if (this.config.initialRows !== undefined && this.config.initialRows.length > 0) {
+                    // Seed list/detail before first paint so callers with known rows avoid an empty flash.
+                    this.dispatch({ type: "rowsLoaded", rows: this.config.initialRows });
+                }
+                this.renderNow();
                 this.loadRows().catch((error) => {
                     this.fail(error);
                 });
@@ -70,13 +85,9 @@ class ExplorerRuntime {
         });
     }
     startTerminal() {
-        this.driver.enterRawMode();
-        this.driver.enterAltScreen();
-        this.driver.disableLineWrap();
-        this.driver.hideCursor();
+        this.driver.start();
         this.subscribeKeypress();
-        this.unsubscribeResize = this.driver.onResize(() => {
-            const size = this.driver.getSize();
+        this.unsubscribeResize = this.driver.onResize((size) => {
             this.dispatch({ type: "resize", cols: size.cols, rows: size.rows });
         });
     }
@@ -84,8 +95,35 @@ class ExplorerRuntime {
         if (this.unsubscribeKeypress !== undefined) {
             return;
         }
-        this.unsubscribeKeypress = this.driver.onKeypress((key) => {
-            this.dispatch({ type: "key", key });
+        this.unsubscribeKeypress = this.driver.onEvent((event) => {
+            this.trace("input", { event });
+            if (event.type === "paste") {
+                for (const ch of event.text.replaceAll("\n", "").replaceAll("\r", "")) {
+                    this.dispatch({
+                        type: "key",
+                        // Pasted characters are text, even when they have a key binding.
+                        key: { ch, name: "paste", ctrl: false, meta: false, shift: false }
+                    });
+                }
+                return;
+            }
+            if (event.type === "wheel") {
+                this.dispatch({
+                    type: "key",
+                    key: { name: event.direction, ctrl: false, meta: false, shift: false }
+                });
+                return;
+            }
+            this.dispatch({
+                type: "key",
+                key: {
+                    name: event.name,
+                    ch: event.ch,
+                    ctrl: event.ctrl,
+                    meta: event.alt,
+                    shift: event.shift
+                }
+            });
         });
     }
     pauseKeypress() {
@@ -110,17 +148,17 @@ class ExplorerRuntime {
         const previousState = this.state;
         const next = step(this.state, event, this.runtimeHandles);
         this.state = next.state;
-        this.render();
+        this.scheduleRender();
         this.applyEffects(next.effects, previousState);
     }
     applyEffects(effects, previousState) {
         for (const effect of effects) {
             if (effect.type === "renderDetail") {
-                this.renderDetail(effect.rowId);
+                this.renderDetail(effect.rowId, effect.token);
                 continue;
             }
             if (effect.type === "persistOrder") {
-                this.track(this.persistOrder(effect.orderedIds, previousState.rows, ++this.reorderToken));
+                this.track(this.persistOrder(effect.movedId, effect.orderedIds, previousState.rows, ++this.reorderToken));
                 continue;
             }
             if (effect.type === "suspend") {
@@ -132,7 +170,7 @@ class ExplorerRuntime {
             }
         }
     }
-    renderDetail(rowId) {
+    renderDetail(rowId, token) {
         const row = this.state.rows.find((candidate) => candidate.id === rowId);
         if (row === undefined) {
             return;
@@ -140,15 +178,30 @@ class ExplorerRuntime {
         const layout = computeExplorerLayout({
             cols: this.state.size.cols,
             rows: this.state.size.rows,
-            detailHidden: this.state.layout === "narrow-list-only" || this.state.layout === "too-narrow"
+            detailHidden: this.state.layout === "narrow-list-only" || this.state.layout === "too-narrow",
+            focused: this.state.focused
         });
-        void this.detailJobs.schedule(rowId, (ctx) => this.config.detail.items(row, ctx), {
+        const reloadDetail = () => this.reloadFocusedDetail(rowId);
+        void this.detailJobs.schedule(rowId, token, (ctx) => this.config.detail.items(row, { ...ctx, reloadDetail }), {
             width: layout.detail.width,
             height: layout.detail.height,
             row,
-            signal: new AbortController().signal
+            signal: new AbortController().signal,
+            reloadDetail
         });
     }
+    reloadFocusedDetail(rowId) {
+        const focusedId = this.state.detail.rowId;
+        if (focusedId === null) {
+            return;
+        }
+        if (rowId !== undefined && rowId !== focusedId) {
+            return;
+        }
+        const token = this.state.detail.token + 1;
+        this.state = { ...this.state, detail: { ...this.state.detail, token } };
+        this.renderDetail(focusedId, token);
+    }
     loadDetailContent(rowId, token, items) {
         const row = this.state.rows.find((candidate) => candidate.id === rowId);
         if (row === undefined) {
@@ -157,7 +210,8 @@ class ExplorerRuntime {
         const layout = computeExplorerLayout({
             cols: this.state.size.cols,
             rows: this.state.size.rows,
-            detailHidden: this.state.layout === "narrow-list-only" || this.state.layout === "too-narrow"
+            detailHidden: this.state.layout === "narrow-list-only" || this.state.layout === "too-narrow",
+            focused: this.state.focused
         });
         const context = {
             width: layout.detail.width,
@@ -195,9 +249,10 @@ class ExplorerRuntime {
         });
         this.dispatch({ type: "detailLoaded", rowId, token, items: preparedItems });
     }
-    async persistOrder(orderedIds, previousRows, token) {
+    async persistOrder(movedId, orderedIds, previousRows, token) {
         try {
             await this.config.reorder?.onReorder(orderedIds, {
+                movedId,
                 refresh: this.runtimeHandles.refresh,
                 toast: this.runtimeHandles.toast
             });
@@ -221,19 +276,15 @@ class ExplorerRuntime {
     }
     async suspendAnd(fn) {
         this.pauseKeypress();
-        this.driver.exitAltScreen();
-        this.driver.enableLineWrap();
-        this.driver.showCursor();
-        this.driver.exitRawMode();
+        this.state = { ...this.state, suspended: true };
+        this.driver.stop();
         try {
             return await fn();
         }
         finally {
             if (!this.stopped) {
-                this.driver.enterRawMode();
-                this.driver.enterAltScreen();
-                this.driver.disableLineWrap();
-                this.driver.hideCursor();
+                this.driver.start();
+                this.state = { ...this.state, suspended: false };
                 this.subscribeKeypress();
                 const size = this.driver.getSize();
                 this.dispatch({
@@ -246,23 +297,40 @@ class ExplorerRuntime {
     }
     confirm(prompt) {
         return new Promise((resolve) => {
-            const action = {
-                id: "__confirm__",
-                label: prompt,
-                handler: () => undefined
-            };
-            const row = this.currentRow();
+            const options = typeof prompt === "string"
+                ? { title: "Confirm", message: prompt }
+                : prompt;
             this.state = {
                 ...this.state,
                 modal: {
                     kind: "confirm",
-                    action,
-                    rows: row === undefined ? [] : [row],
+                    title: options.title,
+                    message: options.message,
+                    confirmLabel: options.confirmLabel ?? "Yes",
+                    cancelLabel: options.cancelLabel ?? "No",
+                    destructive: options.destructive ?? false,
                     resolver: resolve
                 },
-                dirty: REGION_MODAL
+                dirty: REGION_MODAL | REGION_FOOTER
             };
-            this.render();
+            this.scheduleRender();
+        });
+    }
+    promptText(options) {
+        return new Promise((resolve) => {
+            this.state = {
+                ...this.state,
+                modal: {
+                    kind: "input",
+                    title: options.title,
+                    label: options.label,
+                    value: options.initialValue ?? "",
+                    placeholder: options.placeholder,
+                    resolver: resolve
+                },
+                dirty: REGION_MODAL | REGION_FOOTER
+            };
+            this.scheduleRender();
         });
     }
     showToast(message, tone = "info") {
@@ -277,7 +345,7 @@ class ExplorerRuntime {
             toast: { message, tone, expiresAt: Date.now() + TOAST_MS },
             dirty: REGION_TOAST
         };
-        this.render();
+        this.scheduleRender();
         this.toastTimer = setTimeout(() => {
             this.dispatch({ type: "toastExpired" });
         }, TOAST_MS);
@@ -285,20 +353,33 @@ class ExplorerRuntime {
     currentRow() {
         return this.state.rows[this.state.filtered[this.state.cursor] ?? -1];
     }
-    render() {
-        if (this.stopped) {
+    scheduleRender() {
+        if (this.stopped || this.state.suspended || this.renderScheduled) {
             return;
         }
+        this.renderScheduled = true;
+        setImmediate(() => {
+            this.renderScheduled = false;
+            this.renderNow();
+        });
+    }
+    renderNow() {
+        if (this.stopped || this.state.suspended)
+            return;
         const size = this.driver.getSize();
         if (size.cols !== this.state.size.cols || size.rows !== this.state.size.rows) {
             this.state = step(this.state, { type: "resize", cols: size.cols, rows: size.rows }, this.runtimeHandles).state;
         }
-        const nextBuffer = this.state.dirty === REGION_ALL
-            ? new ScreenBuffer(this.state.size.cols, this.state.size.rows)
-            : cloneBuffer(this.previousBuffer);
-        renderExplorer(this.state, nextBuffer);
-        this.driver.write(changesToAnsi(diff(this.previousBuffer, nextBuffer)));
-        this.previousBuffer = nextBuffer;
+        if (this.screen.width !== this.state.size.cols || this.screen.height !== this.state.size.rows)
+            this.screen.resize(this.state.size);
+        renderExplorer({ ...this.state, dirty: REGION_ALL }, this.screen);
+        const frame = this.screen.flush();
+        this.driver.writeFrame(frame);
+        this.trace("frame", {
+            bytes: Buffer.byteLength(frame),
+            cols: this.state.size.cols,
+            rows: this.state.size.rows
+        });
         this.state = { ...this.state, dirty: 0 };
     }
     track(promise) {
@@ -318,8 +399,8 @@ class ExplorerRuntime {
         if (this.toastTimer !== undefined) {
             clearTimeout(this.toastTimer);
         }
-        this.driver.destroy();
-        Promise.resolve()
+        this.driver.stop();
+        Promise.allSettled([...this.pendingEffects])
             .then(() => after?.())
             .then(() => {
             this.settle?.resolve(result);
@@ -331,28 +412,13 @@ class ExplorerRuntime {
     fail(error) {
         if (!this.stopped) {
             this.stopped = true;
-            this.driver.destroy();
+            this.driver.stop();
         }
         this.settle?.reject(error);
     }
-}
-function cloneBuffer(buffer) {
-    const next = new ScreenBuffer(buffer.width, buffer.height);
-    for (let y = 0; y < buffer.height; y += 1) {
-        for (let x = 0; x < buffer.width; x += 1) {
-            const cell = buffer.get(x, y);
-            next.put(x, y, cell.ch, cell.style);
-        }
-    }
-    return next;
-}
-function changesToAnsi(changes) {
-    let output = "";
-    for (const change of changes) {
-        output += `${cursorPositionAnsi(change.x, change.y)}${cellToAnsi(change.cell)}`;
+    trace(type, fields) {
+        if (this.tracePath === undefined || this.tracePath.length === 0)
+            return;
+        appendFileSync(this.tracePath, `${JSON.stringify({ type, timestamp: new Date().toISOString(), ...fields })}\n`);
     }
-    return output;
-}
-function cursorPositionAnsi(x, y) {
-    return `\u001b[${Math.max(1, y + 1)};${Math.max(1, x + 1)}H`;
 }

package/node_modules/toolcraft/node_modules/toolcraft-design/dist/explorer/runtime.test-helpers.d.ts

@@ -1,50 +1,36 @@
-import type { Cell } from "../dashboard/types.js";
-import type { KeypressEvent, TerminalDriver } from "../dashboard/terminal.js";
+import type { TerminalDriver, TerminalInputEvent } from "../terminal/driver.js";
 export declare class FakeTerminalDriver implements TerminalDriver {
     private cols;
     private rows;
-    readonly keyQueue: KeypressEvent[];
     readonly writes: string[];
-    readonly flushes: Array<Array<{
-        x: number;
-        y: number;
-        cell: Cell;
-    }>>;
-    rawMode: boolean;
-    altScreen: boolean;
-    lineWrap: boolean;
-    cursorVisible: boolean;
-    destroyed: boolean;
-    enterAltScreenCount: number;
-    exitAltScreenCount: number;
-    enterRawModeCount: number;
-    exitRawModeCount: number;
-    private readonly keypressHandlers;
+    started: boolean;
+    startCount: number;
+    stopCount: number;
+    private readonly eventHandlers;
     private readonly resizeHandlers;
     constructor(cols?: number, rows?: number);
     get output(): string;
-    enterRawMode(): void;
-    exitRawMode(): void;
-    enterAltScreen(): void;
-    exitAltScreen(): void;
-    disableLineWrap(): void;
-    enableLineWrap(): void;
-    hideCursor(): void;
-    showCursor(): void;
-    moveTo(x: number, y: number): void;
-    write(text: string): void;
-    flush(changes: Array<{
-        x: number;
-        y: number;
-        cell: Cell;
-    }>): void;
+    get destroyed(): boolean;
+    get altScreen(): boolean;
+    get enterAltScreenCount(): number;
+    start(): void;
+    stop(): void;
+    onEvent(handler: (event: TerminalInputEvent) => void): () => void;
+    onResize(handler: (size: {
+        cols: number;
+        rows: number;
+    }) => void): () => void;
     getSize(): {
         cols: number;
         rows: number;
     };
+    writeFrame(ansi: string): void;
     resize(cols: number, rows: number): void;
-    onResize(handler: () => void): () => void;
-    onKeypress(handler: (key: KeypressEvent) => void): () => void;
-    press(key: KeypressEvent): void;
-    destroy(): void;
+    press(key: {
+        name?: string;
+        ch?: string;
+        ctrl: boolean;
+        meta: boolean;
+        shift: boolean;
+    }): void;
 }

package/node_modules/toolcraft/node_modules/toolcraft-design/dist/explorer/runtime.test-helpers.js

@@ -1,101 +1,50 @@
 export class FakeTerminalDriver {
     cols;
     rows;
-    keyQueue = [];
     writes = [];
-    flushes = [];
-    rawMode = false;
-    altScreen = false;
-    lineWrap = true;
-    cursorVisible = true;
-    destroyed = false;
-    enterAltScreenCount = 0;
-    exitAltScreenCount = 0;
-    enterRawModeCount = 0;
-    exitRawModeCount = 0;
-    keypressHandlers = new Set();
+    started = false;
+    startCount = 0;
+    stopCount = 0;
+    eventHandlers = new Set();
     resizeHandlers = new Set();
     constructor(cols = 120, rows = 24) {
         this.cols = cols;
         this.rows = rows;
     }
-    get output() {
-        return this.writes.join("");
+    get output() { return this.writes.join(""); }
+    get destroyed() { return !this.started && this.stopCount > 0; }
+    get altScreen() { return this.started; }
+    get enterAltScreenCount() { return this.startCount; }
+    start() { if (!this.started) {
+        this.started = true;
+        this.startCount += 1;
+    } }
+    stop() { if (this.started) {
+        this.started = false;
+        this.stopCount += 1;
+    } }
+    onEvent(handler) {
+        this.eventHandlers.add(handler);
+        return () => { this.eventHandlers.delete(handler); };
     }
-    enterRawMode() {
-        this.rawMode = true;
-        this.enterRawModeCount += 1;
-    }
-    exitRawMode() {
-        this.rawMode = false;
-        this.exitRawModeCount += 1;
-    }
-    enterAltScreen() {
-        this.altScreen = true;
-        this.enterAltScreenCount += 1;
-    }
-    exitAltScreen() {
-        this.altScreen = false;
-        this.exitAltScreenCount += 1;
-    }
-    disableLineWrap() {
-        this.lineWrap = false;
-    }
-    enableLineWrap() {
-        this.lineWrap = true;
-    }
-    hideCursor() {
-        this.cursorVisible = false;
-    }
-    showCursor() {
-        this.cursorVisible = true;
-    }
-    moveTo(x, y) {
-        this.write(`\u001b[${Math.max(1, y + 1)};${Math.max(1, x + 1)}H`);
-    }
-    write(text) {
-        if (!this.destroyed) {
-            this.writes.push(text);
-        }
-    }
-    flush(changes) {
-        this.flushes.push(changes);
-    }
-    getSize() {
-        return { cols: this.cols, rows: this.rows };
+    onResize(handler) {
+        this.resizeHandlers.add(handler);
+        return () => { this.resizeHandlers.delete(handler); };
     }
+    getSize() { return { cols: this.cols, rows: this.rows }; }
+    writeFrame(ansi) { if (this.started)
+        this.writes.push(ansi); }
     resize(cols, rows) {
         this.cols = cols;
         this.rows = rows;
-        for (const handler of this.resizeHandlers) {
-            handler();
-        }
-    }
-    onResize(handler) {
-        this.resizeHandlers.add(handler);
-        return () => {
-            this.resizeHandlers.delete(handler);
-        };
-    }
-    onKeypress(handler) {
-        this.keypressHandlers.add(handler);
-        return () => {
-            this.keypressHandlers.delete(handler);
-        };
+        for (const handler of this.resizeHandlers)
+            handler(this.getSize());
     }
     press(key) {
-        this.keyQueue.push(key);
-        for (const handler of this.keypressHandlers) {
-            handler(key);
-        }
-    }
-    destroy() {
-        this.destroyed = true;
-        this.rawMode = false;
-        this.lineWrap = true;
-        this.altScreen = false;
-        this.cursorVisible = true;
-        this.keypressHandlers.clear();
-        this.resizeHandlers.clear();
+        if (!this.started)
+            return;
+        const event = { type: "key", name: key.name ?? key.ch ?? "", ch: key.ch, ctrl: key.ctrl, alt: key.meta, shift: key.shift };
+        for (const handler of this.eventHandlers)
+            handler(event);
     }
 }