@dkkoval/tui-preview 0.1.1 → 0.2.1

package/dist/core/normalize.js

@@ -1,8 +1,11 @@
 const DEFAULT_SIZE = { cols: 80, rows: 24 };
 const EMPTY_ENV = {};
 const EMPTY_ARGV = [];
-function isModernProps(props) {
-    return "wasm" in props;
+function normalizeMode(mode) {
+    if (mode === "static") {
+        return "static";
+    }
+    return "interactive";
 }
 function resolveArgvInput(argv) {
     const value = argv ?? EMPTY_ARGV;
@@ -11,80 +14,30 @@ function resolveArgvInput(argv) {
     }
     return () => value;
 }
-function resolveLegacySize(props) {
-    const hasExplicitSize = props.cols !== undefined || props.rows !== undefined;
-    if (!hasExplicitSize) {
-        return { fit: "container", size: DEFAULT_SIZE };
-    }
-    return {
-        fit: "none",
-        size: {
-            cols: Math.max(1, props.cols ?? DEFAULT_SIZE.cols),
-            rows: Math.max(1, props.rows ?? DEFAULT_SIZE.rows),
-        },
-    };
-}
-let warnedLegacyProps = false;
-export function warnLegacyPropsOnce(usedLegacyProps) {
-    if (!usedLegacyProps || warnedLegacyProps)
-        return;
-    warnedLegacyProps = true;
-    console.warn("[tui-preview] Legacy props (`app`, `args`, `cols`, `rows`, `fontSize`, `fontFamily`, `theme`) are deprecated. " +
-        "Use `wasm`, `argv`, `fit`, `size`, and `terminal`.");
-}
 export function resolveTuiPreviewProps(props) {
-    if (isModernProps(props)) {
-        const fit = props.fit ?? (props.size ? "none" : "container");
-        const size = fit === "none"
-            ? {
-                cols: Math.max(1, props.size?.cols ?? DEFAULT_SIZE.cols),
-                rows: Math.max(1, props.size?.rows ?? DEFAULT_SIZE.rows),
-            }
-            : {
-                cols: Math.max(1, props.size?.cols ?? DEFAULT_SIZE.cols),
-                rows: Math.max(1, props.size?.rows ?? DEFAULT_SIZE.rows),
-            };
-        const mode = (props.mode ?? "terminal");
-        return {
-            wasm: props.wasm,
-            env: props.env ?? EMPTY_ENV,
-            interactive: mode === "static" ? false : (props.interactive ?? true),
-            mode,
-            fit,
-            size,
-            terminal: {
-                fontSize: props.terminal?.fontSize ?? 14,
-                fontFamily: props.terminal?.fontFamily ?? "monospace",
-                cursorBlink: props.terminal?.cursorBlink ?? true,
-                convertEol: props.terminal?.convertEol ?? true,
-                theme: props.terminal?.theme,
-            },
-            resolveArgv: resolveArgvInput(props.argv),
-            onExit: props.onExit,
-            onError: props.onError,
-            onStatusChange: props.onStatusChange,
-            usedLegacyProps: false,
-        };
-    }
-    const { fit, size } = resolveLegacySize(props);
+    const fit = props.fit ?? (props.size ? "none" : "container");
+    const size = {
+        cols: Math.max(1, props.size?.cols ?? DEFAULT_SIZE.cols),
+        rows: Math.max(1, props.size?.rows ?? DEFAULT_SIZE.rows),
+    };
+    const mode = normalizeMode(props.mode);
     return {
-        wasm: props.app,
+        wasm: props.wasm,
         env: props.env ?? EMPTY_ENV,
-        interactive: props.interactive ?? true,
-        mode: "terminal",
+        interactive: mode === "static" ? false : (props.interactive ?? true),
+        mode,
         fit,
         size,
         terminal: {
-            fontSize: props.fontSize ?? 14,
-            fontFamily: props.fontFamily ?? "monospace",
-            cursorBlink: true,
-            convertEol: true,
-            theme: props.theme,
+            fontSize: props.terminal?.fontSize ?? 14,
+            fontFamily: props.terminal?.fontFamily ?? "monospace",
+            wasmUrl: props.terminal?.wasmUrl,
+            convertEol: props.terminal?.convertEol ?? true,
+            theme: props.terminal?.theme,
         },
-        resolveArgv: resolveArgvInput(props.args),
+        resolveArgv: resolveArgvInput(props.argv),
         onExit: props.onExit,
         onError: props.onError,
         onStatusChange: props.onStatusChange,
-        usedLegacyProps: true,
     };
 }

package/dist/core/wasi.d.ts

@@ -1,19 +1,23 @@
 /**
- * WASI bridge — connects a wasm32-wasi TUI app to a ghostty-web terminal.
+ * WASI bridge — connects a wasm32-wasi TUI app to a terminal surface.
  *
  * Implements a minimal WASI preview1 surface sufficient for interactive TUI apps:
  *   - fd_write (stdout/stderr → terminal)
  *   - fd_read (stdin ← keyboard input queue)
- *   - poll_oneoff (non-blocking stdin check, needed by crossterm/ratatui)
+ *   - poll_oneoff (suspending stdin wait via JSPI, needed by crossterm/ratatui)
  *   - proc_exit
  *   - environ_get / environ_sizes_get
  *   - args_get / args_sizes_get
  */
 import type { WasiOptions } from "../types.js";
+/** Feature-detect JSPI (WebAssembly.Suspending / WebAssembly.promising). */
+export declare const hasJSPI: boolean;
 export declare class WasiBridge {
     private opts;
     private inputQueue;
     private memory;
+    /** Resolvers waiting for input to arrive (used by suspending poll_oneoff). */
+    private inputWaiters;
     constructor(opts: WasiOptions);
     /** Push keyboard data from the terminal into the app's stdin */
     pushInput(data: string | Uint8Array): void;
@@ -21,6 +25,8 @@ export declare class WasiBridge {
     attachMemory(memory: WebAssembly.Memory): void;
     private view;
     private u8;
+    /** Wait until the input queue has data, or until the given timeout (ms). */
+    private waitForInput;
     get imports(): WebAssembly.ModuleImports;
     private envEntries;
 }

package/dist/core/wasi.js

@@ -1,10 +1,10 @@
 /**
- * WASI bridge — connects a wasm32-wasi TUI app to a ghostty-web terminal.
+ * WASI bridge — connects a wasm32-wasi TUI app to a terminal surface.
  *
  * Implements a minimal WASI preview1 surface sufficient for interactive TUI apps:
  *   - fd_write (stdout/stderr → terminal)
  *   - fd_read (stdin ← keyboard input queue)
- *   - poll_oneoff (non-blocking stdin check, needed by crossterm/ratatui)
+ *   - poll_oneoff (suspending stdin wait via JSPI, needed by crossterm/ratatui)
  *   - proc_exit
  *   - environ_get / environ_sizes_get
  *   - args_get / args_sizes_get
@@ -12,13 +12,20 @@
 const WASI_ESUCCESS = 0;
 const WASI_EAGAIN = 6;
 const WASI_BADF = 8;
+const WASI_EVENTTYPE_CLOCK = 0;
+const WASI_EVENTTYPE_FD_READ = 1;
 const STDIN_FD = 0;
 const STDOUT_FD = 1;
 const STDERR_FD = 2;
+/** Feature-detect JSPI (WebAssembly.Suspending / WebAssembly.promising). */
+export const hasJSPI = typeof WebAssembly.Suspending === "function" &&
+    typeof WebAssembly.promising === "function";
 export class WasiBridge {
     opts;
     inputQueue = [];
     memory;
+    /** Resolvers waiting for input to arrive (used by suspending poll_oneoff). */
+    inputWaiters = [];
     constructor(opts) {
         this.opts = opts;
     }
@@ -26,6 +33,10 @@ export class WasiBridge {
     pushInput(data) {
         const chunk = typeof data === "string" ? new TextEncoder().encode(data) : data;
         this.inputQueue.push(chunk);
+        // Wake any suspended poll_oneoff calls.
+        for (const resolve of this.inputWaiters.splice(0)) {
+            resolve();
+        }
     }
     /** Attach the WASM instance's memory after instantiation */
     attachMemory(memory) {
@@ -37,6 +48,24 @@ export class WasiBridge {
     u8() {
         return new Uint8Array(this.memory.buffer);
     }
+    /** Wait until the input queue has data, or until the given timeout (ms). */
+    waitForInput(timeoutMs) {
+        if (this.inputQueue.length > 0)
+            return Promise.resolve();
+        return new Promise((resolve) => {
+            const waiter = () => {
+                clearTimeout(timer);
+                resolve();
+            };
+            const timer = setTimeout(() => {
+                const idx = this.inputWaiters.indexOf(waiter);
+                if (idx >= 0)
+                    this.inputWaiters.splice(idx, 1);
+                resolve();
+            }, timeoutMs);
+            this.inputWaiters.push(waiter);
+        });
+    }
     // ── WASI imports object ────────────────────────────────────────────────
     get imports() {
         return {
@@ -115,7 +144,7 @@ export class WasiBridge {
             fd_read: (fd, iovsPtr, iovsLen, nreadPtr) => {
                 if (fd !== STDIN_FD)
                     return WASI_BADF;
-                const chunk = this.inputQueue.shift();
+                const chunk = this.inputQueue[0];
                 if (!chunk)
                     return WASI_EAGAIN;
                 const view = this.view();
@@ -128,26 +157,91 @@ export class WasiBridge {
                     u8.set(chunk.subarray(nread, nread + toCopy), ptr);
                     nread += toCopy;
                 }
+                if (nread >= chunk.length) {
+                    this.inputQueue.shift();
+                }
+                else if (nread > 0) {
+                    this.inputQueue[0] = chunk.subarray(nread);
+                }
                 view.setUint32(nreadPtr, nread, true);
                 return WASI_ESUCCESS;
             },
-            poll_oneoff: (inPtr, outPtr, nsubscriptions, neventsPtr) => {
-                const view = this.view();
-                let nevents = 0;
-                for (let i = 0; i < nsubscriptions; i++) {
-                    const subPtr = inPtr + i * 48;
-                    const type = view.getUint8(subPtr + 8);
-                    if (type === 0 && this.inputQueue.length > 0) {
-                        const evPtr = outPtr + nevents * 32;
-                        view.setBigUint64(evPtr, view.getBigUint64(subPtr, true), true);
-                        view.setUint16(evPtr + 8, 0, true);
-                        view.setUint8(evPtr + 10, type);
-                        nevents++;
+            // poll_oneoff — the critical syscall for event-loop TUI apps.
+            //
+            // With JSPI: wrapped as a WebAssembly.Suspending import so the WASM
+            // instance suspends while we await input, yielding to the browser
+            // event loop. This is what allows keyboard events to arrive.
+            //
+            // Without JSPI: synchronous non-blocking check (legacy/replay mode).
+            poll_oneoff: hasJSPI
+                ? async (inPtr, outPtr, nsubscriptions, neventsPtr) => {
+                    const view = this.view();
+                    // Check if any FD_READ subscription can be satisfied immediately.
+                    let hasFdRead = false;
+                    let clockTimeoutNs = -1n;
+                    for (let i = 0; i < nsubscriptions; i++) {
+                        const subPtr = inPtr + i * 48;
+                        const type = view.getUint8(subPtr + 8);
+                        if (type === WASI_EVENTTYPE_FD_READ) {
+                            hasFdRead = true;
+                        }
+                        if (type === WASI_EVENTTYPE_CLOCK) {
+                            const timeout = view.getBigUint64(subPtr + 24, true);
+                            if (clockTimeoutNs < 0n || timeout < clockTimeoutNs) {
+                                clockTimeoutNs = timeout;
+                            }
+                        }
+                    }
+                    // If there's an FD_READ subscription and no data yet, suspend.
+                    if (hasFdRead && this.inputQueue.length === 0) {
+                        const timeoutMs = clockTimeoutNs >= 0n
+                            ? Number(clockTimeoutNs / 1000000n)
+                            : 60_000;
+                        await this.waitForInput(Math.max(1, Math.min(timeoutMs, 60_000)));
                     }
+                    // Now fill out the events.
+                    let nevents = 0;
+                    for (let i = 0; i < nsubscriptions; i++) {
+                        const subPtr = inPtr + i * 48;
+                        const type = view.getUint8(subPtr + 8);
+                        const userdata = view.getBigUint64(subPtr, true);
+                        if (type === WASI_EVENTTYPE_FD_READ && this.inputQueue.length > 0) {
+                            const evPtr = outPtr + nevents * 32;
+                            view.setBigUint64(evPtr, userdata, true);
+                            view.setUint16(evPtr + 8, 0, true); // error = 0
+                            view.setUint8(evPtr + 10, type);
+                            nevents++;
+                        }
+                        else if (type === WASI_EVENTTYPE_CLOCK) {
+                            // Clock subscriptions always fire (we already waited).
+                            const evPtr = outPtr + nevents * 32;
+                            view.setBigUint64(evPtr, userdata, true);
+                            view.setUint16(evPtr + 8, 0, true);
+                            view.setUint8(evPtr + 10, type);
+                            nevents++;
+                        }
+                    }
+                    view.setUint32(neventsPtr, nevents, true);
+                    return WASI_ESUCCESS;
                 }
-                view.setUint32(neventsPtr, nevents, true);
-                return WASI_ESUCCESS;
-            },
+                : (inPtr, outPtr, nsubscriptions, neventsPtr) => {
+                    // Fallback: synchronous non-blocking check (no JSPI).
+                    const view = this.view();
+                    let nevents = 0;
+                    for (let i = 0; i < nsubscriptions; i++) {
+                        const subPtr = inPtr + i * 48;
+                        const type = view.getUint8(subPtr + 8);
+                        if (type === WASI_EVENTTYPE_FD_READ && this.inputQueue.length > 0) {
+                            const evPtr = outPtr + nevents * 32;
+                            view.setBigUint64(evPtr, view.getBigUint64(subPtr, true), true);
+                            view.setUint16(evPtr + 8, 0, true);
+                            view.setUint8(evPtr + 10, type);
+                            nevents++;
+                        }
+                    }
+                    view.setUint32(neventsPtr, nevents, true);
+                    return WASI_ESUCCESS;
+                },
             proc_exit: (code) => {
                 this.opts.onExit(code);
                 throw new WasiExitError(code);
@@ -199,22 +293,37 @@ export async function instantiateApp(source, bridge) {
     let module = moduleCache.get(key);
     if (!module) {
         const response = await fetch(source);
+        if (!response.ok) {
+            throw new Error(`Failed to load app wasm: ${response.status} ${response.statusText}`);
+        }
         const bytes = await response.arrayBuffer();
+        if (bytes.byteLength === 0) {
+            throw new Error("App wasm is empty.");
+        }
         module = await WebAssembly.compile(bytes);
         moduleCache.set(key, module);
     }
+    const wasiImports = bridge.imports;
+    if (hasJSPI) {
+        wasiImports.poll_oneoff = new WebAssembly.Suspending(wasiImports.poll_oneoff);
+    }
     const importObject = {
-        wasi_snapshot_preview1: bridge.imports,
+        wasi_snapshot_preview1: wasiImports,
     };
     const instance = await WebAssembly.instantiate(module, importObject);
     bridge.attachMemory(instance.exports.memory);
-    const _start = instance.exports._start;
-    if (!_start)
+    const rawStart = instance.exports._start;
+    if (!rawStart)
         throw new Error("WASM module has no _start export");
+    // With JSPI, wrap _start so it returns a Promise that resolves when the
+    // WASM app finishes (or suspends on poll_oneoff and resumes later).
+    const _start = hasJSPI
+        ? WebAssembly.promising(rawStart)
+        : rawStart;
     return {
         run: async () => {
             try {
-                _start();
+                await _start();
             }
             catch (e) {
                 if (!(e instanceof WasiExitError))

package/dist/index.d.ts

@@ -1,3 +1,3 @@
 export { TuiPreview } from "./TuiPreview.js";
-export type { GhosttyTheme, ResolvedTuiPreviewOptions, TuiArgv, TuiFitMode, TuiRenderMode, TuiPreviewCommonProps, TuiPreviewLegacyProps, TuiPreviewModernProps, TuiPreviewProps, TuiPreviewStatus, TuiRuntimeSize, TuiTerminalOptions, WasiOptions, } from "./types.js";
-export { WasiBridge, WasiExitError, instantiateApp } from "./wasi.js";
+export type { GhosttyTheme, ResolvedTuiPreviewOptions, TuiArgv, TuiFitMode, TuiRenderMode, TuiPreviewCommonProps, TuiPreviewModernProps, TuiPreviewProps, TuiPreviewStatus, TuiRuntimeSize, TuiTerminalOptions, WasiOptions, } from "./types.js";
+export { WasiBridge, WasiExitError, instantiateApp } from "./core/wasi.js";