pi-sdk-web 0.5.15 → 0.5.16

package/dist/server.js

@@ -91,12 +91,10 @@ export class PiWebServer {
         this.runtime = runtime;
         this.port = options.port ?? DEFAULT_PORT;
         this.staticDir = options.staticDir ?? STATIC_DIR;
-        this.uiContext = new WebUIContext((obj) => this.broadcast(obj), {
-            // Dialog timeout tier: with a browser attached the user may step away,
-            // so dialogs wait long; with none attached they settle after a short
-            // grace period instead of blocking the agent loop forever.
-            hasClients: () => this.clients.size > 0,
-        });
+        // Dialog timeouts follow client presence (see WebUIContext): attached ->
+        // wait indefinitely (TUI parity), detached -> fallback guard so a closed
+        // tab cannot block the agent loop. handleConnection / ws close update it.
+        this.uiContext = new WebUIContext((obj) => this.broadcast(obj));
     }
     // ------------------------------------------------------------------
     // Lifecycle
@@ -244,6 +242,8 @@ export class PiWebServer {
             catch {
                 // One broken client must not block delivery to the others
                 this.clients.delete(client);
+                if (this.clients.size === 0)
+                    this.uiContext.setBrowserAttached(false);
             }
         }
     }
@@ -306,8 +306,17 @@ export class PiWebServer {
     // ------------------------------------------------------------------
     handleConnection(ws) {
         this.clients.add(ws);
-        ws.on("close", () => this.clients.delete(ws));
-        ws.on("error", () => this.clients.delete(ws));
+        // A browser is watching again: pending dialogs stop counting down (see
+        // WebUIContext.setBrowserAttached) - the user gets unlimited time.
+        this.uiContext.setBrowserAttached(true);
+        const onGone = () => {
+            this.clients.delete(ws);
+            // Last browser left: arm the fallback so dialogs cannot block the loop.
+            if (this.clients.size === 0)
+                this.uiContext.setBrowserAttached(false);
+        };
+        ws.on("close", onGone);
+        ws.on("error", onGone);
         ws.on("message", (data) => this.handleClientMessage(ws, String(data)));
         // Initial state (state + history), mirroring the Python bridge
         this.sendJson(ws, { type: "state", data: this.buildState() });

package/dist/static/app.js

@@ -204,6 +204,8 @@ class PiWebClient {
     this.modalList = document.getElementById('modal-list');
     this.modalClose = document.getElementById('modal-close');
     this.modalMode = null; // 'model' | 'thinking'
+    this.dialogCountdownTimer = null; // extension dialog countdown (TUI parity)
+    this.dialogCountdownBase = '';
     this.hasConnectedBefore = false;
     this.commandMenuIndex = -1;
     this.extStatus = {};
@@ -1794,6 +1796,7 @@ class PiWebClient {
 
   openModal(title, mode) {
     this.modalMode = mode;
+    this.stopDialogCountdown();
     this.modalTitle.textContent = title;
     this.modalSearch.value = '';
     this.modalList.innerHTML = '';
@@ -1801,6 +1804,29 @@ class PiWebClient {
     this.modalSearch.focus();
   }
 
+  /** Countdown for extension dialogs that carry a deadline (an extension's own
+   * opts.timeout). TUI shows the same "(Ns)" ticker; without a deadline the
+   * dialog waits indefinitely while a browser is attached. */
+  startDialogCountdown(req) {
+    this.stopDialogCountdown();
+    if (!req || typeof req.deadline !== 'number') return;
+    this.dialogCountdownBase = this.modalTitle.textContent || '';
+    const tick = () => {
+      const remain = Math.max(0, Math.ceil((req.deadline - Date.now()) / 1000));
+      this.modalTitle.textContent = `${this.dialogCountdownBase} (${remain}s)`;
+      if (remain <= 0) this.stopDialogCountdown();
+    };
+    tick();
+    this.dialogCountdownTimer = setInterval(tick, 1000);
+  }
+
+  stopDialogCountdown() {
+    if (this.dialogCountdownTimer) {
+      clearInterval(this.dialogCountdownTimer);
+      this.dialogCountdownTimer = null;
+    }
+  }
+
   closeModal() {
     // If an extension dialog (select/confirm/input/editor) was open, notify
     // the server that it was cancelled - otherwise the extension's promise
@@ -1814,6 +1840,7 @@ class PiWebClient {
     this.modalSearch.style.display = 'block';
     this.modalMode = null;
     this.currentExtRequest = null;
+    this.stopDialogCountdown();
     this.inputEl.focus();
   }
 
@@ -1920,6 +1947,7 @@ class PiWebClient {
   openExtensionSelect(req) {
     this.openModal(req.title || 'Select', 'extension-select');
     this.currentExtRequest = req;
+    this.startDialogCountdown(req);
     this.modalSearch.style.display = 'block';
     const items = (req.options || []).map((opt) => ({ name: opt, desc: '', value: opt }));
     this.renderModalItems(items, (item) => {
@@ -1930,6 +1958,7 @@ class PiWebClient {
   openExtensionConfirm(req) {
     this.openModal(req.title || 'Confirm', 'extension-confirm');
     this.currentExtRequest = req;
+    this.startDialogCountdown(req);
     this.modalSearch.style.display = 'none';
     this.modalList.innerHTML = `
       <div class="modal-message">${this.escapeHtml(req.message || '')}</div>
@@ -1950,6 +1979,7 @@ class PiWebClient {
   openExtensionInput(req) {
     this.openModal(req.title || 'Input', 'extension-input');
     this.currentExtRequest = req;
+    this.startDialogCountdown(req);
     this.modalSearch.style.display = 'none';
     this.modalList.innerHTML = `
       <div class="modal-message">${this.escapeHtml(req.message || '')}</div>
@@ -1979,6 +2009,7 @@ class PiWebClient {
   openExtensionEditor(req) {
     this.openModal(req.title || 'Editor', 'extension-editor');
     this.currentExtRequest = req;
+    this.startDialogCountdown(req);
     this.modalSearch.style.display = 'none';
     this.modalList.innerHTML = `
       <div class="modal-message">${this.escapeHtml(req.title || '')}</div>

package/dist/ui-context.js

@@ -3,21 +3,24 @@ import { readFileSync } from "node:fs";
 import { dirname, join } from "node:path";
 import { fileURLToPath } from "node:url";
 /**
- * Default dialog timeouts (pi-web specific guard).
+ * Fallback dialog timeout (pi-web specific guard).
  *
- * TUI and RPC block until the client answers - the user is at the terminal, or
- * the RPC client owns the timeout. A browser tab can be closed mid-turn, so a
- * dialog nobody can see would block the agent loop forever. Two tiers:
+ * TUI and RPC wait for an answer indefinitely - the user is at the terminal,
+ * or the RPC client owns the timeout. With a browser attached pi-web does the
+ * same: a dialog waits forever, so an answer is never taken away from the user
+ * just because they were busy elsewhere.
  *
- * - browser attached: the user may have stepped away; wait long, then settle
- *   with the dialog's default value (confirm -> false, others -> undefined);
- * - no browser attached: a closed tab must not stall the loop, but a page
- *   reload/reconnect takes a moment - short grace period, not instant.
+ * The one case that needs a guard is a browser that is NOT attached (tab
+ * closed mid-turn): nobody can answer, and an extension awaiting the dialog
+ * would block the agent loop forever. Then - and only then - the dialog
+ * settles after this grace period with its default value (confirm -> false,
+ * others -> undefined). Reconnecting cancels the fallback, so a user who comes
+ * back gets as much time as they need.
  *
- * Extensions that pass their own `timeout` (ms) keep it.
+ * Extensions that pass their own `timeout` (ms) keep it exactly (that timer is
+ * their decision, never cancelled here).
  */
-const DIALOG_TIMEOUT_MS = 10 * 60_000;
-const DIALOG_TIMEOUT_NO_CLIENT_MS = 60_000;
+const DIALOG_FALLBACK_TIMEOUT_MS = 10 * 60_000;
 /**
  * Load a Pi theme (dark.json/light.json colors) so extensions calling
  * ui.theme.fg("accent", text) / .bg(...) get REAL ANSI escapes — identical
@@ -85,18 +88,16 @@ export class WebUIContext {
     /** Latest setWidget lines per key (persistent widgets, e.g. TodoOverlay):
      * replayed to late-connecting browsers like setStatus snapshots. */
     widgetMap = new Map();
-    hasClients;
-    dialogTimeoutMs;
-    dialogTimeoutNoClientMs;
+    fallbackTimeoutMs;
+    /** Whether a browser is attached right now (updated by the server). */
+    browserAttached = false;
     /** Current widget snapshot (key -> lines) for new connections. */
     getWidgetSnapshot() {
         return Object.fromEntries(this.widgetMap);
     }
     constructor(sink, options = {}) {
         this.sink = sink;
-        this.hasClients = options.hasClients ?? (() => false);
-        this.dialogTimeoutMs = options.dialogTimeoutMs ?? DIALOG_TIMEOUT_MS;
-        this.dialogTimeoutNoClientMs = options.dialogTimeoutNoClientMs ?? DIALOG_TIMEOUT_NO_CLIENT_MS;
+        this.fallbackTimeoutMs = options.fallbackTimeoutMs ?? DIALOG_FALLBACK_TIMEOUT_MS;
         // Pi's ExtensionRunner wraps the ui context with `{...ui}` (a shallow
         // spread) when building the extension ctx - class prototype members
         // (methods AND the theme getter) would be LOST by that spread (only own
@@ -163,6 +164,40 @@ export class WebUIContext {
     dismissDialog(id, reason) {
         this.sink({ type: "dialog_dismissed", id, reason });
     }
+    /**
+     * Browser presence changed (WS connect/disconnect). Only dialogs without an
+     * extension timeout are affected: while a browser is attached they wait
+     * forever (TUI parity - never take an answer away from the user), while no
+     * browser is attached a fallback timer keeps a closed tab from blocking the
+     * agent loop. Reconnecting cancels the fallback.
+     */
+    setBrowserAttached(attached) {
+        if (this.browserAttached === attached)
+            return;
+        this.browserAttached = attached;
+        for (const [id, entry] of [...this.pending.entries()]) {
+            if (entry.extensionTimeout !== undefined)
+                continue; // extension's own timer
+            if (attached) {
+                if (entry.fallbackTimer && entry.timer) {
+                    clearTimeout(entry.timer);
+                    entry.timer = undefined;
+                    entry.fallbackTimer = false;
+                }
+            }
+            else if (!entry.timer) {
+                this.armFallbackTimer(id, entry);
+            }
+        }
+    }
+    /** Arm the no-browser fallback (settles with the dialog default). */
+    armFallbackTimer(id, entry) {
+        entry.fallbackTimer = true;
+        entry.timer = setTimeout(() => {
+            entry.resolve(undefined);
+            this.dismissDialog(id, "timeout");
+        }, this.fallbackTimeoutMs);
+    }
     createDialog(request, opts, defaultValue, parse) {
         const id = crypto.randomUUID();
         // Same as Pi's RPC/TUI: an already-aborted dialog settles immediately.
@@ -187,30 +222,36 @@ export class WebUIContext {
                 cleanup();
                 resolve(useDefault ? defaultValue : parse(value));
             };
-            // Extension timeout (ms) wins; otherwise the web guard applies so a
-            // closed browser cannot block the agent loop forever.
-            const timeoutMs = typeof opts?.timeout === "number"
-                ? opts.timeout
-                : this.hasClients()
-                    ? this.dialogTimeoutMs
-                    : this.dialogTimeoutNoClientMs;
-            const timer = setTimeout(() => {
-                settle(undefined, true);
-                this.dismissDialog(id, "timeout");
-            }, timeoutMs);
             const onAbort = () => {
                 settle(undefined, true);
                 this.dismissDialog(id, "aborted");
             };
             opts?.signal?.addEventListener("abort", onAbort, { once: true });
-            this.pending.set(id, {
+            const extensionTimeout = typeof opts?.timeout === "number" && opts.timeout > 0 ? opts.timeout : undefined;
+            const deadline = extensionTimeout !== undefined ? Date.now() + extensionTimeout : undefined;
+            const entry = {
                 resolve: (value) => settle(value, false),
-                request: { ...request, id },
-                timer,
+                // `deadline` lets the browser show the same countdown TUI does.
+                request: deadline !== undefined ? { ...request, id, deadline } : { ...request, id },
+                deadline,
+                extensionTimeout,
+                fallbackTimer: false,
                 signal: opts?.signal,
                 onAbort,
-            });
-            this.sink({ type: "extension_ui_request", id, ...request });
+            };
+            this.pending.set(id, entry);
+            if (extensionTimeout !== undefined) {
+                // The extension asked for this deadline - honour it exactly (TUI
+                // shows the same countdown and auto-dismisses on expiry).
+                entry.timer = setTimeout(() => {
+                    settle(undefined, true);
+                    this.dismissDialog(id, "timeout");
+                }, extensionTimeout);
+            }
+            else if (!this.browserAttached) {
+                this.armFallbackTimer(id, entry);
+            }
+            this.sink({ type: "extension_ui_request", id, ...request, ...(deadline !== undefined ? { deadline } : {}) });
         });
     }
     // ------------------------------------------------------------------

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-sdk-web",
-  "version": "0.5.15",
+  "version": "0.5.16",
   "description": "Browser Web access for Pi (AI coding agent) via the Pi SDK - standalone module, zero modification to Pi itself",
   "type": "module",
   "bin": {