tabminal 3.0.7 → 3.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tabminal",
-  "version": "3.0.7",
+  "version": "3.0.8",
   "description": "Tab(ter)minal, a Cloud-Native terminal and ACP agent workspace for desktop, tablet, and phone.",
   "type": "module",
   "bin": {

package/public/app.js

@@ -108,7 +108,7 @@ const CLOSE_ICON_SVG = '<svg viewBox="0 0 24 24" width="16" height="16" stroke="
 const AGENT_ICON_SVG = '<svg viewBox="0 0 24 24" width="17" height="17" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linecap="round" stroke-linejoin="round"><rect x="7" y="7" width="10" height="10" rx="2"></rect><path d="M9 7V5"></path><path d="M15 7V5"></path><path d="M12 17v2"></path><path d="M5 12H3"></path><path d="M21 12h-2"></path><path d="M9 11h.01"></path><path d="M15 11h.01"></path><path d="M9.5 14c.7.67 1.53 1 2.5 1s1.8-.33 2.5-1"></path></svg>';
 const TERMINAL_TAB_ICON_SVG = '<svg viewBox="0 0 24 24" width="15" height="15" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="5" width="18" height="14" rx="2"></rect><path d="m8 10 3 2-3 2"></path><path d="M13 15h4"></path></svg>';
 const MANAGED_TERMINAL_ICON_SVG = '<svg viewBox="0 0 24 24" width="15" height="15" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="5" width="18" height="14" rx="2"></rect><path d="M7 12h.01"></path><path d="M12 9v6"></path><path d="M9 12h6"></path><path d="M18 8v2"></path><path d="M19 9h-2"></path></svg>';
-const BELL_ICON_SVG = '<svg viewBox="0 0 24 24" width="15" height="15" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M10 5a2 2 0 1 1 4 0"></path><path d="M5 16a7 7 0 1 0 14 0"></path><path d="M4 16h16"></path><path d="M10 20a2 2 0 0 0 4 0"></path></svg>';
+const BELL_ICON_SVG = '<svg viewBox="0 0 24 24" width="15" height="15" stroke="currentColor" stroke-width="2.1" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M12 4.5a4.5 4.5 0 0 0-4.5 4.5v2.4c0 1.2-.41 2.37-1.17 3.3L5 16.5h14l-1.33-1.8a5.66 5.66 0 0 1-1.17-3.3V9A4.5 4.5 0 0 0 12 4.5"></path><path d="M10.25 19a1.75 1.75 0 0 0 3.5 0"></path></svg>';
 const SPINNER_ICON_SVG = '<svg viewBox="0 0 24 24" width="15" height="15" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round"><path d="M12 3a9 9 0 1 0 9 9"></path></svg>';
 const ATTACH_ICON_SVG = '<svg viewBox="0 0 24 24" width="15" height="15" stroke="currentColor" stroke-width="1.9" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="M21.44 11.05 12.25 20.24a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 1 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.82-2.82l8.49-8.49"></path></svg>';
 const CHEVRON_DOWN_ICON_SVG = '<svg viewBox="0 0 24 24" width="15" height="15" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"></path></svg>';
@@ -4464,6 +4464,10 @@ class Session {
             editorFlex: '2 1 0%'
         };
         this.previewRelayoutScheduled = false;
+        this.lastTerminalControlClaimAt = 0;
+        this.boundTerminalClaimRoot = null;
+        this.boundTerminalClaimTextarea = null;
+        this.boundTerminalClaimHandler = null;
         this.wrapperElement = null;
         this._createTerminals();
 
@@ -4529,6 +4533,8 @@ class Session {
         const wasActive = state.activeSessionKey === this.key;
         const previewWrapper = this.wrapperElement;
 
+        this.unbindTerminalControlClaim();
+
         try {
             this.previewTerm?.dispose();
         } catch (e) {
@@ -4556,6 +4562,7 @@ class Session {
         if (wasActive && terminalEl) {
             terminalEl.innerHTML = '';
             this.mainTerm.open(terminalEl);
+            this.bindTerminalControlClaim();
             if (this.fitMainTerminalIfVisible()) {
                 this.mainTerm.focus();
             }
@@ -5067,6 +5074,79 @@ class Session {
         }
     }
 
+    claimTerminalControl(force = false) {
+        if (state.activeSessionKey !== this.key) {
+            return;
+        }
+        if (this.socket?.readyState !== WebSocket.OPEN) {
+            return;
+        }
+
+        const now = Date.now();
+        if (!force && now - this.lastTerminalControlClaimAt < 250) {
+            return;
+        }
+
+        this.lastTerminalControlClaimAt = now;
+        this.send({ type: 'claim_terminal_control' });
+    }
+
+    bindTerminalControlClaim() {
+        this.unbindTerminalControlClaim();
+
+        const root = this.mainTerm?.element;
+        if (!root) {
+            return;
+        }
+
+        const textarea = this.mainTerm.textarea
+            || root.querySelector('textarea');
+        const handler = () => this.claimTerminalControl();
+
+        root.addEventListener('mousedown', handler, true);
+        root.addEventListener('touchstart', handler, true);
+        if (textarea) {
+            textarea.addEventListener('keydown', handler, true);
+            textarea.addEventListener('paste', handler, true);
+        }
+
+        this.boundTerminalClaimRoot = root;
+        this.boundTerminalClaimTextarea = textarea;
+        this.boundTerminalClaimHandler = handler;
+    }
+
+    unbindTerminalControlClaim() {
+        const handler = this.boundTerminalClaimHandler;
+        if (!handler) {
+            return;
+        }
+
+        this.boundTerminalClaimRoot?.removeEventListener(
+            'mousedown',
+            handler,
+            true
+        );
+        this.boundTerminalClaimRoot?.removeEventListener(
+            'touchstart',
+            handler,
+            true
+        );
+        this.boundTerminalClaimTextarea?.removeEventListener(
+            'keydown',
+            handler,
+            true
+        );
+        this.boundTerminalClaimTextarea?.removeEventListener(
+            'paste',
+            handler,
+            true
+        );
+
+        this.boundTerminalClaimRoot = null;
+        this.boundTerminalClaimTextarea = null;
+        this.boundTerminalClaimHandler = null;
+    }
+
     reportResize() {
         if (!this.isMainTerminalVisible()) {
             return;
@@ -5084,6 +5164,7 @@ class Session {
         this.shouldReconnect = false;
         clearTimeout(this.retryTimer);
         this.socket?.close();
+        this.unbindTerminalControlClaim();
         
         try {
             if (this.previewTerm) this.previewTerm.dispose();
@@ -10773,6 +10854,11 @@ async function switchToSession(sessionKey, options = {}) {
         return;
     }
 
+    const previousSession = state.activeSessionKey
+        ? state.sessions.get(state.activeSessionKey)
+        : null;
+    previousSession?.unbindTerminalControlClaim();
+
     state.activeSessionKey = sessionKey;
     renderTabs();
     if (scrollTabIntoView) {
@@ -10789,6 +10875,7 @@ async function switchToSession(sessionKey, options = {}) {
     
     // Mount new session
     session.mainTerm.open(terminalEl);
+    session.bindTerminalControlClaim();
     session.fitMainTerminalIfVisible();
     if (session.isMainTerminalVisible()) {
         session.mainTerm.focus();

package/public/styles.css

@@ -1561,7 +1561,7 @@ kbd {
 .tab-status-icon.is-attention,
 .agent-editor-tab-icon.is-attention,
 .toggle-agent-btn.is-attention {
-    color: var(--warning-color);
+    color: #cb4b16;
 }
 
 .tab-status-icon.is-running,

package/src/terminal-session.mjs

@@ -22,6 +22,7 @@ const SOS_PM_APC_SEQUENCE_REGEX = /\u001b[\^_][\s\S]*?\u001b\\/g;
 const TWO_CHAR_ESCAPE_REGEX = /\u001b[@-Z\\-_]/g;
 const CONTROL_CHAR_REGEX = /[\u0000-\u0008\u000b\u000c\u000e-\u001f\u007f]/g;
 const TITLE_POLL_INTERVAL_MS = 3000;
+const QUERY_RESPONSE_CSI_REGEX = /^\u001b\[[0-9;?]*[Rn]/;
 
 const IGNORED_COMMANDS = [
     'export PROMPT_COMMAND',
@@ -97,6 +98,75 @@ function estimateSnapshotScrollback(cols, rows, historyLimit) {
     return Math.max(safeRows, Math.min(50000, estimatedRows));
 }
 
+function consumeTerminalQueryResponse(input, start = 0) {
+    if (typeof input !== 'string' || start >= input.length) {
+        return 0;
+    }
+
+    const slice = input.slice(start);
+    const csiMatch = QUERY_RESPONSE_CSI_REGEX.exec(slice);
+    if (csiMatch) {
+        return csiMatch[0].length;
+    }
+
+    if (!slice.startsWith('\u001b]')) {
+        return 0;
+    }
+
+    const oscMatch = /^\u001b](4|10|11);/.exec(slice);
+    if (!oscMatch) {
+        return 0;
+    }
+
+    const belIndex = slice.indexOf('\u0007');
+    const stIndex = slice.indexOf('\u001b\\');
+    let endIndex = -1;
+
+    if (belIndex >= 0) {
+        endIndex = belIndex + 1;
+    }
+
+    if (stIndex >= 0) {
+        const stEnd = stIndex + 2;
+        endIndex = endIndex < 0 ? stEnd : Math.min(endIndex, stEnd);
+    }
+
+    return endIndex > 0 ? endIndex : 0;
+}
+
+function isTerminalQueryResponseInput(input) {
+    if (typeof input !== 'string' || !input.startsWith('\u001b')) {
+        return false;
+    }
+
+    let index = 0;
+    while (index < input.length) {
+        const consumed = consumeTerminalQueryResponse(input, index);
+        if (!consumed) {
+            return false;
+        }
+        index += consumed;
+    }
+
+    return index > 0;
+}
+
+function selectFallbackQueryResponder(clients, pendingClients) {
+    for (const client of clients) {
+        if (client?.readyState === WS_STATE_OPEN) {
+            return client;
+        }
+    }
+
+    for (const client of pendingClients.keys()) {
+        if (client?.readyState === WS_STATE_OPEN) {
+            return client;
+        }
+    }
+
+    return null;
+}
+
 export class TerminalSession {
     constructor(pty, options = {}) {
         this.pty = pty;
@@ -129,6 +199,7 @@ export class TerminalSession {
         this.history = '';
         this.clients = new Set();
         this.pendingClients = new Map();
+        this.queryResponseOwner = null;
         this.closed = false;
         this.exitStatus = null;
         this.exitWaiters = [];
@@ -386,9 +457,18 @@ export class TerminalSession {
     attach(ws) {
         if (!ws) throw new Error('WebSocket instance required');
         this.pendingClients.set(ws, []);
+        if (!this.queryResponseOwner) {
+            this.queryResponseOwner = ws;
+        }
         ws.once('close', () => {
             this.clients.delete(ws);
             this.pendingClients.delete(ws);
+            if (this.queryResponseOwner === ws) {
+                this.queryResponseOwner = selectFallbackQueryResponder(
+                    this.clients,
+                    this.pendingClients
+                );
+            }
         });
         ws.on('message', (raw) => this._routeIncoming(raw, ws));
         ws.on('error', () => ws.close());
@@ -473,17 +553,37 @@ export class TerminalSession {
         } catch { return; }
 
         switch (payload.type) {
-            case 'input': this._handleInput(payload.data); break;
+            case 'input': this._handleInput(payload.data, ws); break;
             case 'resize': this._handleResize(payload.cols, payload.rows); break;
+            case 'claim_terminal_control':
+                this._claimTerminalControl(ws);
+                break;
             case 'ping': this._send(ws, { type: 'pong' }); break;
         }
     }
 
-    _handleInput(data) {
+    _handleInput(data, ws) {
         if (this.closed || typeof data !== 'string') return;
+        if (
+            isTerminalQueryResponseInput(data)
+            && this.queryResponseOwner
+            && ws
+            && ws !== this.queryResponseOwner
+        ) {
+            return;
+        }
         this.write(data);
     }
 
+    _claimTerminalControl(ws) {
+        if (!ws) {
+            return;
+        }
+        if (this.clients.has(ws) || this.pendingClients.has(ws)) {
+            this.queryResponseOwner = ws;
+        }
+    }
+
     _isAiEnabled() {
         return Boolean(
             (config.openrouterKey && String(config.openrouterKey).trim()) ||