agentgui 1.0.822 → 1.0.824

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## 2026-04-11
+- refactor: replace jsonl-watcher.js with @lanmower/cc-tail npm package (subclass CCTailWatcher, override _line() to route via JsonlParser); remove custom file-watching logic
+- refactor: split syntax-highlighter.js (216L) into syntax-highlighter.js (132L) + syntax-highlighter-render.js (73L, highlight/createHighlightedElement/highlightElement via prototype extension)
+- refactor: split dialogs.js (268L) into dialogs.js (54L, helpers + window._dialogCore) + dialogs-types.js (112L, window.UIDialog via window._dialogCore)
+- chore: add @lanmower/cc-tail dependency to package.json
+
+## [Unreleased]
+
+### Refactor
+- Split `conversations.js` (737L) into 4 files: conversations.js (117L), conv-sidebar-actions.js (185L), conv-sidebar-clone.js (92L), conv-list-renderer.js (198L)
+- Split `websocket-manager.js` (643L) into 3 files: ws-core.js (163L), ws-latency.js (89L), websocket-manager.js (108L)
+- Split `ui-components.js` (370L) into 2 files: ui-components.js (89L), ui-components-rendering.js (63L)
+- Split `agent-auth.js` into agent-auth.js (147L) and agent-auth-oauth.js (160L)
+- Deleted dead code: event-filter.js (zero external references)
+- Updated index.html script load order for all new split files
+
 ## 2026-04-11
 - refactor: split conversations.js (742L→116L) into conv-sidebar-actions.js (prototype extension: drag/drop, bulk actions, folder browser), conv-list-renderer.js (loadConversations, render, vnode), conv-sidebar-clone.js (clone UI, delete-all); all ≤200 lines
 - refactor: split websocket-manager.js (643L) into ws-core.js (class constructor, connect, onOpen, onMessage, reconnect), websocket-manager.js (sendMessage, subscriptions, state); ws-latency/connection/heartbeat empty stubs deleted

package/lib/jsonl-watcher.js

@@ -1,36 +1,26 @@
 import fs from 'fs';
-import path from 'path';
-import os from 'os';
+import { JsonlWatcher as CCTailWatcher } from '@lanmower/cc-tail';
 import { JsonlParser } from './jsonl-parser.js';
 
-const PROJECTS_DIR = path.join(os.homedir(), '.claude', 'projects');
-const DEBOUNCE_MS = 16;
-
-export class JsonlWatcher {
+export class JsonlWatcher extends CCTailWatcher {
   constructor({ broadcastSync, queries, ownedSessionIds }) {
+    super();
     this._parser = new JsonlParser({ broadcastSync, queries, ownedSessionIds });
-    this._tails = new Map();
-    this._timers = new Map();
-    this._watcher = null;
   }
 
-  start() {
-    if (!fs.existsSync(PROJECTS_DIR)) return;
-    this._scanDir(PROJECTS_DIR, 0);
-    for (const [fp, t] of this._timers.entries()) { clearTimeout(t); this._timers.delete(fp); this._read(fp); }
-    this._parser.endAllStreaming();
-    try {
-      this._watcher = fs.watch(PROJECTS_DIR, { recursive: true }, (_, f) => {
-        if (f && f.endsWith('.jsonl')) this._debounce(path.join(PROJECTS_DIR, f));
-      });
-      this._watcher.on('error', (e) => console.error('[JsonlWatcher]', e.message));
-    } catch (e) { console.error('[JsonlWatcher] start failed:', e.message); }
+  _line(line) {
+    line = line.trim();
+    if (!line) return;
+    let e;
+    try { e = JSON.parse(line); } catch (_) { return; }
+    if (!e || !e.sessionId) return;
+    const cid = this._parser._conv(e.sessionId, e);
+    if (cid) this._parser._route(cid, e.sessionId, e);
   }
 
   stop() {
-    if (this._watcher) try { this._watcher.close(); } catch (_) {}
-    for (const s of this._tails.values()) if (s.fd !== null) try { fs.closeSync(s.fd); } catch (_) {}
-    for (const t of this._timers.values()) clearTimeout(t);
+    super.stop();
+    this._parser.endAllStreaming();
   }
 
   removeConversation(conversationId) {
@@ -54,45 +44,4 @@ export class JsonlWatcher {
     this._timers.clear();
     this._parser.clear();
   }
-
-  _scanDir(dir, depth) {
-    if (depth > 4) return;
-    try {
-      for (const d of fs.readdirSync(dir, { withFileTypes: true })) {
-        const fp = path.join(dir, d.name);
-        if (d.isFile() && d.name.endsWith('.jsonl')) this._debounce(fp);
-        else if (d.isDirectory()) this._scanDir(fp, depth + 1);
-      }
-    } catch (_) {}
-  }
-
-  _debounce(fp) {
-    const t = this._timers.get(fp);
-    if (t) clearTimeout(t);
-    this._timers.set(fp, setTimeout(() => { this._timers.delete(fp); this._read(fp); }, DEBOUNCE_MS));
-  }
-
-  _read(fp) {
-    let s = this._tails.get(fp);
-    if (!s) { s = { fd: null, offset: 0, partial: '' }; this._tails.set(fp, s); }
-    try {
-      if (s.fd === null) s.fd = fs.openSync(fp, 'r');
-      const stat = fs.fstatSync(s.fd);
-      if (stat.size <= s.offset) return;
-      const buf = Buffer.allocUnsafe(stat.size - s.offset);
-      const n = fs.readSync(s.fd, buf, 0, buf.length, s.offset);
-      s.offset += n;
-      const text = s.partial + buf.toString('utf8', 0, n);
-      const t0 = process.hrtime.bigint();
-      const lines = []; let start = 0, idx;
-      while ((idx = text.indexOf('\n', start)) !== -1) { lines.push(text.slice(start, idx)); start = idx + 1; }
-      s.partial = text.slice(start);
-      const ms = Number(process.hrtime.bigint() - t0) / 1e6;
-      if (ms > 5) console.warn(`[JsonlWatcher] hot path ${ms.toFixed(1)}ms (${lines.length} lines)`);
-      for (const l of lines) this._parser._line(fp, l);
-    } catch (e) {
-      if (e.code !== 'ENOENT') console.error('[JsonlWatcher] read error:', e.message);
-      if (s.fd !== null) { try { fs.closeSync(s.fd); } catch (_) {} s.fd = null; }
-    }
-  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentgui",
-  "version": "1.0.822",
+  "version": "1.0.824",
   "description": "Multi-agent ACP client with real-time communication",
   "type": "module",
   "main": "electron/main.js",
@@ -28,6 +28,7 @@
     "@google/gemini-cli": "latest",
     "@huggingface/transformers": "^3.8.1",
     "@kilocode/cli": "latest",
+    "@lanmower/cc-tail": "^1.0.2",
     "audio-decode": "^2.2.3",
     "better-sqlite3": "^12.6.2",
     "busboy": "^1.6.0",

package/static/index.html

@@ -282,6 +282,7 @@
   <script defer src="/gm/js/event-processor.js"></script>
   <script defer src="/gm/js/streaming-renderer.js"></script>
   <script defer src="/gm/js/image-loader.js"></script>
+  <script defer src="/gm/js/image-loader-element.js"></script>
   <script defer src="/gm/lib/webjsx.js"></script>
   <script defer src="/gm/lib/xstate.umd.min.js"></script>
   <script defer src="/gm/js/ws-machine.js"></script>
@@ -298,10 +299,13 @@
   <script defer src="/gm/js/conv-sidebar-clone.js"></script>
   <script defer src="/gm/lib/msgpackr.min.js"></script>
   <script defer src="/gm/js/ws-core.js"></script>
+  <script defer src="/gm/js/ws-latency.js"></script>
   <script defer src="/gm/js/websocket-manager.js"></script>
   <script defer src="/gm/js/ws-client.js"></script>
   <script defer src="/gm/js/syntax-highlighter.js"></script>
+  <script defer src="/gm/js/syntax-highlighter-render.js"></script>
   <script defer src="/gm/js/dialogs.js"></script>
+  <script defer src="/gm/js/dialogs-types.js"></script>
   <script defer src="/gm/js/ui-components.js"></script>
   <script defer src="/gm/js/ui-components-rendering.js"></script>
   <script defer src="/gm/js/state-barrier.js"></script>
@@ -313,7 +317,6 @@
   <script defer src="/gm/js/voice.js"></script>
   <script defer src="/gm/js/pm2-monitor.js"></script>
   <script defer src="/gm/js/event-filter-config.js"></script>
-  <script defer src="/gm/js/event-filter.js"></script>
   <script defer src="/gm/js/client.js"></script>
   <script defer src="/gm/js/features.js"></script>
   <script defer src="/gm/js/agent-auth.js"></script>

package/static/js/dialogs-types.js

@@ -0,0 +1,111 @@
+(function() {
+  var c = window._dialogCore;
+
+  window.UIDialog = {
+    alert: function(message, title) {
+      return new Promise(function(resolve) {
+        var overlay = c.createOverlay();
+        var dialog = document.createElement('div');
+        dialog.className = 'dialog-container';
+        dialog.innerHTML =
+          '<div class="dialog-box"><div class="dialog-header"><h3 class="dialog-title">' + c.escapeHtml(title || 'Alert') + '</h3></div>' +
+          '<div class="dialog-body"><p class="dialog-message">' + c.escapeHtml(message) + '</p></div>' +
+          '<div class="dialog-footer"><button class="dialog-btn dialog-btn-primary" data-action="ok">OK</button></div></div>';
+        var okBtn = dialog.querySelector('[data-action="ok"]');
+        okBtn.addEventListener('click', function() { c.closeDialog(dialog, overlay); resolve(true); });
+        overlay.querySelector('.dialog-backdrop').addEventListener('click', function() { c.closeDialog(dialog, overlay); resolve(true); });
+        document.addEventListener('keydown', function handler(e) {
+          if (e.key === 'Escape' || e.key === 'Enter') { document.removeEventListener('keydown', handler); c.closeDialog(dialog, overlay); resolve(true); }
+        });
+        c.showDialog(dialog, overlay);
+      });
+    },
+
+    confirm: function(message, title) {
+      return new Promise(function(resolve) {
+        var overlay = c.createOverlay();
+        var dialog = document.createElement('div');
+        dialog.className = 'dialog-container';
+        dialog.innerHTML =
+          '<div class="dialog-box"><div class="dialog-header"><h3 class="dialog-title">' + c.escapeHtml(title || 'Confirm') + '</h3></div>' +
+          '<div class="dialog-body"><p class="dialog-message">' + c.escapeHtml(message).replace(/\n/g, '<br>') + '</p></div>' +
+          '<div class="dialog-footer"><button class="dialog-btn dialog-btn-secondary" data-action="cancel">Cancel</button>' +
+          '<button class="dialog-btn dialog-btn-primary dialog-btn-danger" data-action="confirm">Confirm</button></div></div>';
+        var cancelBtn = dialog.querySelector('[data-action="cancel"]');
+        var confirmBtn = dialog.querySelector('[data-action="confirm"]');
+        cancelBtn.addEventListener('click', function() { c.closeDialog(dialog, overlay); resolve(false); });
+        confirmBtn.addEventListener('click', function() { c.closeDialog(dialog, overlay); resolve(true); });
+        overlay.querySelector('.dialog-backdrop').addEventListener('click', function() { c.closeDialog(dialog, overlay); resolve(false); });
+        document.addEventListener('keydown', function handler(e) {
+          if (e.key === 'Escape') { document.removeEventListener('keydown', handler); c.closeDialog(dialog, overlay); resolve(false); }
+          else if (e.key === 'Enter') { document.removeEventListener('keydown', handler); c.closeDialog(dialog, overlay); resolve(true); }
+        });
+        c.showDialog(dialog, overlay);
+      });
+    },
+
+    prompt: function(message, defaultValue, title) {
+      return new Promise(function(resolve) {
+        var overlay = c.createOverlay();
+        var dialog = document.createElement('div');
+        dialog.className = 'dialog-container';
+        dialog.innerHTML =
+          '<div class="dialog-box"><div class="dialog-header"><h3 class="dialog-title">' + c.escapeHtml(title || 'Input') + '</h3></div>' +
+          '<div class="dialog-body"><label class="dialog-label">' + c.escapeHtml(message) + '</label>' +
+          '<input type="text" class="dialog-input" value="' + c.escapeHtml(defaultValue || '') + '"></div>' +
+          '<div class="dialog-footer"><button class="dialog-btn dialog-btn-secondary" data-action="cancel">Cancel</button>' +
+          '<button class="dialog-btn dialog-btn-primary" data-action="ok">OK</button></div></div>';
+        var input = dialog.querySelector('.dialog-input');
+        var cancelBtn = dialog.querySelector('[data-action="cancel"]');
+        var okBtn = dialog.querySelector('[data-action="ok"]');
+        cancelBtn.addEventListener('click', function() { c.closeDialog(dialog, overlay); resolve(null); });
+        okBtn.addEventListener('click', function() { c.closeDialog(dialog, overlay); resolve(input.value); });
+        input.addEventListener('keydown', function(e) { if (e.key === 'Enter') { c.closeDialog(dialog, overlay); resolve(input.value); } });
+        overlay.querySelector('.dialog-backdrop').addEventListener('click', function() { c.closeDialog(dialog, overlay); resolve(null); });
+        document.addEventListener('keydown', function handler(e) {
+          if (e.key === 'Escape') { document.removeEventListener('keydown', handler); c.closeDialog(dialog, overlay); resolve(null); }
+        });
+        c.showDialog(dialog, overlay);
+      });
+    },
+
+    showProgress: function(config) {
+      var overlay = c.createOverlay();
+      var dialog = document.createElement('div');
+      dialog.className = 'dialog-container';
+      dialog.innerHTML =
+        '<div class="dialog-box dialog-box-progress"><div class="dialog-header"><h3 class="dialog-title">' + c.escapeHtml(config.title || 'Please wait') + '</h3></div>' +
+        '<div class="dialog-body"><p class="dialog-message progress-message">' + c.escapeHtml(config.message || 'Loading...') + '</p>' +
+        '<div class="dialog-progress-bar"><div class="dialog-progress-fill" style="width: 0%"></div></div>' +
+        '<p class="dialog-progress-percent">0%</p></div></div>';
+      c.showDialog(dialog, overlay);
+      var progressFill = dialog.querySelector('.dialog-progress-fill');
+      var progressPercent = dialog.querySelector('.dialog-progress-percent');
+      var progressMessage = dialog.querySelector('.progress-message');
+      return {
+        update: function(percent, message) {
+          progressFill.style.width = percent + '%';
+          progressPercent.textContent = Math.round(percent) + '%';
+          if (message) progressMessage.textContent = message;
+        },
+        close: function() { c.closeDialog(dialog, overlay); }
+      };
+    },
+
+    showToast: function(message, type, duration) {
+      var existing = document.querySelector('.toast-notification');
+      if (existing) existing.remove();
+      var toast = document.createElement('div');
+      toast.className = 'toast-notification toast-' + (type || 'info');
+      toast.innerHTML = '<span class="toast-message">' + c.escapeHtml(message) + '</span>';
+      document.body.appendChild(toast);
+      requestAnimationFrame(function() { toast.classList.add('visible'); });
+      setTimeout(function() {
+        toast.classList.remove('visible');
+        setTimeout(function() { if (toast.parentNode) toast.remove(); }, 300);
+      }, duration || 3000);
+    },
+
+    closeAll: c.closeAllDialogs
+  };
+})();

package/static/js/dialogs.js

@@ -1,267 +1,53 @@
-(function() {
-  var activeDialogs = [];
-  var dialogZIndex = 10000;
-
-  function escapeHtml(text) {
-    if (typeof window._escHtml === 'function') return window._escHtml(text);
-    var d = document.createElement('div'); d.textContent = text; return d.innerHTML;
-  }
-
-  function createOverlay() {
-    var overlay = document.createElement('div');
-    overlay.className = 'dialog-overlay';
-    overlay.innerHTML = '<div class="dialog-backdrop"></div>';
-    return overlay;
-  }
-
-  function showDialog(dialog, overlay) {
-    dialogZIndex++;
-    if (overlay) {
-      overlay.style.zIndex = dialogZIndex;
-      document.body.appendChild(overlay);
-    }
-    dialog.style.zIndex = dialogZIndex + 1;
-    document.body.appendChild(dialog);
-    activeDialogs.push({ dialog: dialog, overlay: overlay });
-
-    requestAnimationFrame(function() {
-      dialog.classList.add('visible');
-      if (overlay) overlay.classList.add('visible');
-      var input = dialog.querySelector('input, textarea');
-      if (input) input.focus();
-      else {
-        var btn = dialog.querySelector('.dialog-btn-primary');
-        if (btn) btn.focus();
-      }
-    });
-  }
-
-  function closeDialog(dialog, overlay) {
-    dialog.classList.remove('visible');
-    if (overlay) overlay.classList.remove('visible');
-    setTimeout(function() {
-      if (dialog.parentNode) dialog.remove();
-      if (overlay && overlay.parentNode) overlay.remove();
-    }, 200);
-    activeDialogs = activeDialogs.filter(function(d) {
-      return d.dialog !== dialog;
-    });
-  }
-
-  function closeAllDialogs() {
-    activeDialogs.forEach(function(d) {
-      closeDialog(d.dialog, d.overlay);
-    });
-  }
-
-  window.UIDialog = {
-    alert: function(message, title) {
-      return new Promise(function(resolve) {
-        var overlay = createOverlay();
-        var dialog = document.createElement('div');
-        dialog.className = 'dialog-container';
-        dialog.innerHTML = 
-          '<div class="dialog-box">' +
-            '<div class="dialog-header">' +
-              '<h3 class="dialog-title">' + escapeHtml(title || 'Alert') + '</h3>' +
-            '</div>' +
-            '<div class="dialog-body">' +
-              '<p class="dialog-message">' + escapeHtml(message) + '</p>' +
-            '</div>' +
-            '<div class="dialog-footer">' +
-              '<button class="dialog-btn dialog-btn-primary" data-action="ok">OK</button>' +
-            '</div>' +
-          '</div>';
-        
-        var okBtn = dialog.querySelector('[data-action="ok"]');
-        okBtn.addEventListener('click', function() {
-          closeDialog(dialog, overlay);
-          resolve(true);
-        });
-        
-        overlay.querySelector('.dialog-backdrop').addEventListener('click', function() {
-          closeDialog(dialog, overlay);
-          resolve(true);
-        });
-        
-        document.addEventListener('keydown', function handler(e) {
-          if (e.key === 'Escape' || e.key === 'Enter') {
-            document.removeEventListener('keydown', handler);
-            closeDialog(dialog, overlay);
-            resolve(true);
-          }
-        });
-        
-        showDialog(dialog, overlay);
-      });
-    },
-
-    confirm: function(message, title) {
-      return new Promise(function(resolve) {
-        var overlay = createOverlay();
-        var dialog = document.createElement('div');
-        dialog.className = 'dialog-container';
-        dialog.innerHTML = 
-          '<div class="dialog-box">' +
-            '<div class="dialog-header">' +
-              '<h3 class="dialog-title">' + escapeHtml(title || 'Confirm') + '</h3>' +
-            '</div>' +
-            '<div class="dialog-body">' +
-              '<p class="dialog-message">' + escapeHtml(message).replace(/\n/g, '<br>') + '</p>' +
-            '</div>' +
-            '<div class="dialog-footer">' +
-              '<button class="dialog-btn dialog-btn-secondary" data-action="cancel">Cancel</button>' +
-              '<button class="dialog-btn dialog-btn-primary dialog-btn-danger" data-action="confirm">Confirm</button>' +
-            '</div>' +
-          '</div>';
-        
-        var cancelBtn = dialog.querySelector('[data-action="cancel"]');
-        var confirmBtn = dialog.querySelector('[data-action="confirm"]');
-        
-        cancelBtn.addEventListener('click', function() {
-          closeDialog(dialog, overlay);
-          resolve(false);
-        });
-        
-        confirmBtn.addEventListener('click', function() {
-          closeDialog(dialog, overlay);
-          resolve(true);
-        });
-        
-        overlay.querySelector('.dialog-backdrop').addEventListener('click', function() {
-          closeDialog(dialog, overlay);
-          resolve(false);
-        });
-        
-        document.addEventListener('keydown', function handler(e) {
-          if (e.key === 'Escape') {
-            document.removeEventListener('keydown', handler);
-            closeDialog(dialog, overlay);
-            resolve(false);
-          } else if (e.key === 'Enter') {
-            document.removeEventListener('keydown', handler);
-            closeDialog(dialog, overlay);
-            resolve(true);
-          }
-        });
-        
-        showDialog(dialog, overlay);
-      });
-    },
-
-    prompt: function(message, defaultValue, title) {
-      return new Promise(function(resolve) {
-        var overlay = createOverlay();
-        var dialog = document.createElement('div');
-        dialog.className = 'dialog-container';
-        dialog.innerHTML = 
-          '<div class="dialog-box">' +
-            '<div class="dialog-header">' +
-              '<h3 class="dialog-title">' + escapeHtml(title || 'Input') + '</h3>' +
-            '</div>' +
-            '<div class="dialog-body">' +
-              '<label class="dialog-label">' + escapeHtml(message) + '</label>' +
-              '<input type="text" class="dialog-input" value="' + escapeHtml(defaultValue || '') + '">' +
-            '</div>' +
-            '<div class="dialog-footer">' +
-              '<button class="dialog-btn dialog-btn-secondary" data-action="cancel">Cancel</button>' +
-              '<button class="dialog-btn dialog-btn-primary" data-action="ok">OK</button>' +
-            '</div>' +
-          '</div>';
-        
-        var input = dialog.querySelector('.dialog-input');
-        var cancelBtn = dialog.querySelector('[data-action="cancel"]');
-        var okBtn = dialog.querySelector('[data-action="ok"]');
-        
-        cancelBtn.addEventListener('click', function() {
-          closeDialog(dialog, overlay);
-          resolve(null);
-        });
-        
-        okBtn.addEventListener('click', function() {
-          closeDialog(dialog, overlay);
-          resolve(input.value);
-        });
-        
-        input.addEventListener('keydown', function(e) {
-          if (e.key === 'Enter') {
-            closeDialog(dialog, overlay);
-            resolve(input.value);
-          }
-        });
-        
-        overlay.querySelector('.dialog-backdrop').addEventListener('click', function() {
-          closeDialog(dialog, overlay);
-          resolve(null);
-        });
-        
-        document.addEventListener('keydown', function handler(e) {
-          if (e.key === 'Escape') {
-            document.removeEventListener('keydown', handler);
-            closeDialog(dialog, overlay);
-            resolve(null);
-          }
-        });
-        
-        showDialog(dialog, overlay);
-      });
-    },
-
-    showProgress: function(config) {
-      var overlay = createOverlay();
-      var dialog = document.createElement('div');
-      dialog.className = 'dialog-container';
-      dialog.innerHTML = 
-        '<div class="dialog-box dialog-box-progress">' +
-          '<div class="dialog-header">' +
-            '<h3 class="dialog-title">' + escapeHtml(config.title || 'Please wait') + '</h3>' +
-          '</div>' +
-          '<div class="dialog-body">' +
-            '<p class="dialog-message progress-message">' + escapeHtml(config.message || 'Loading...') + '</p>' +
-            '<div class="dialog-progress-bar">' +
-              '<div class="dialog-progress-fill" style="width: 0%"></div>' +
-            '</div>' +
-            '<p class="dialog-progress-percent">0%</p>' +
-          '</div>' +
-        '</div>';
-      
-      showDialog(dialog, overlay);
-      
-      var progressFill = dialog.querySelector('.dialog-progress-fill');
-      var progressPercent = dialog.querySelector('.dialog-progress-percent');
-      var progressMessage = dialog.querySelector('.progress-message');
-      
-      return {
-        update: function(percent, message) {
-          progressFill.style.width = percent + '%';
-          progressPercent.textContent = Math.round(percent) + '%';
-          if (message) progressMessage.textContent = message;
-        },
-        close: function() {
-          closeDialog(dialog, overlay);
-        }
-      };
-    },
-
-    showToast: function(message, type, duration) {
-      var existing = document.querySelector('.toast-notification');
-      if (existing) existing.remove();
-      
-      var toast = document.createElement('div');
-      toast.className = 'toast-notification toast-' + (type || 'info');
-      toast.innerHTML = '<span class="toast-message">' + escapeHtml(message) + '</span>';
-      document.body.appendChild(toast);
-      
-      requestAnimationFrame(function() {
-        toast.classList.add('visible');
-      });
-      
-      setTimeout(function() {
-        toast.classList.remove('visible');
-        setTimeout(function() { if (toast.parentNode) toast.remove(); }, 300);
-      }, duration || 3000);
-    },
-
-    closeAll: closeAllDialogs
-  };
-})();
+(function() {
+  var activeDialogs = [];
+  var dialogZIndex = 10000;
+
+  function escapeHtml(text) {
+    if (typeof window._escHtml === 'function') return window._escHtml(text);
+    var d = document.createElement('div'); d.textContent = text; return d.innerHTML;
+  }
+
+  function createOverlay() {
+    var overlay = document.createElement('div');
+    overlay.className = 'dialog-overlay';
+    overlay.innerHTML = '<div class="dialog-backdrop"></div>';
+    return overlay;
+  }
+
+  function showDialog(dialog, overlay) {
+    dialogZIndex++;
+    if (overlay) {
+      overlay.style.zIndex = dialogZIndex;
+      document.body.appendChild(overlay);
+    }
+    dialog.style.zIndex = dialogZIndex + 1;
+    document.body.appendChild(dialog);
+    activeDialogs.push({ dialog: dialog, overlay: overlay });
+    requestAnimationFrame(function() {
+      dialog.classList.add('visible');
+      if (overlay) overlay.classList.add('visible');
+      var input = dialog.querySelector('input, textarea');
+      if (input) input.focus();
+      else {
+        var btn = dialog.querySelector('.dialog-btn-primary');
+        if (btn) btn.focus();
+      }
+    });
+  }
+
+  function closeDialog(dialog, overlay) {
+    dialog.classList.remove('visible');
+    if (overlay) overlay.classList.remove('visible');
+    setTimeout(function() {
+      if (dialog.parentNode) dialog.remove();
+      if (overlay && overlay.parentNode) overlay.remove();
+    }, 200);
+    activeDialogs = activeDialogs.filter(function(d) { return d.dialog !== dialog; });
+  }
+
+  function closeAllDialogs() {
+    activeDialogs.forEach(function(d) { closeDialog(d.dialog, d.overlay); });
+  }
+
+  window._dialogCore = { escapeHtml: escapeHtml, createOverlay: createOverlay, showDialog: showDialog, closeDialog: closeDialog, closeAllDialogs: closeAllDialogs };
+})();