agentgui 1.0.34 → 1.0.36

package/bin/gmgui.cjs

@@ -21,9 +21,12 @@ async function gmgui(args = []) {
     const useBun = hasBun();
     const installer = useBun ? 'bun' : 'npm';
 
-    // Ensure dependencies are installed
+    // Ensure dependencies are installed only if node_modules is missing
+    // Skip this for bunx which manages dependencies independently
     const nodeModulesPath = path.join(projectRoot, 'node_modules');
-    if (!fs.existsSync(nodeModulesPath)) {
+    const isBunx = process.env.npm_execpath && process.env.npm_execpath.includes('bunx');
+
+    if (!isBunx && !fs.existsSync(nodeModulesPath)) {
       console.log(`Installing dependencies with ${installer}...`);
       const installResult = spawnSync(installer, ['install'], {
         cwd: projectRoot,
@@ -45,12 +48,17 @@ async function gmgui(args = []) {
         stdio: 'inherit'
       });
 
+      ps.on('error', reject);
+
+      // Keep this process alive indefinitely to keep the server running
+      process.stdin.resume();
+
+      // If server exits, keep this process alive
       ps.on('exit', (code) => {
-        if (code === 0) resolve();
-        else reject(new Error(`Server exited with code ${code}`));
+        if (code !== 0) {
+          console.error(`Server exited with code ${code}`);
+        }
       });
-
-      ps.on('error', reject);
     });
   } else {
     throw new Error(`Unknown command: ${command}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentgui",
-  "version": "1.0.34",
+  "version": "1.0.36",
   "description": "Multi-agent ACP client with real-time communication",
   "type": "module",
   "main": "server.js",

package/static/app.js

@@ -1458,7 +1458,57 @@ class GMGUIApp {
     }
     const content = document.createElement('div');
     content.className = 'html-content';
-    content.innerHTML = this.sanitizeHtml(event.html);
+
+    // Get current theme to apply to HTML content
+    const currentTheme = document.documentElement.getAttribute('data-theme') ||
+                        (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
+
+    // Apply theme-aware CSS for consistent colors in dark/light mode
+    const themeCSS = currentTheme === 'dark'
+      ? `<style>
+           .html-content {
+             color: #f8fafc;
+             background: transparent;
+           }
+           .html-content p { color: #cbd5e1; }
+           .html-content h1, .html-content h2, .html-content h3,
+           .html-content h4, .html-content h5, .html-content h6 {
+             color: #f8fafc;
+           }
+           .html-content a { color: #6366f1; }
+           .html-content code { color: #c7d2fe; background: rgba(0,0,0,0.3); }
+           .html-content pre { background: rgba(0,0,0,0.5); color: #e0e7ff; }
+           .html-content table { border-color: #334155; }
+           .html-content th { background: #1a202c; color: #f8fafc; }
+           .html-content td { border-color: #334155; }
+           .html-content blockquote { border-color: #334155; color: #cbd5e1; }
+           .html-content ul, .html-content ol { color: #cbd5e1; }
+           .html-content li { color: #cbd5e1; }
+        </style>`
+      : `<style>
+           .html-content {
+             color: #1d2129;
+             background: transparent;
+           }
+           .html-content p { color: #475569; }
+           .html-content h1, .html-content h2, .html-content h3,
+           .html-content h4, .html-content h5, .html-content h6 {
+             color: #1d2129;
+           }
+           .html-content a { color: #4f46e5; }
+           .html-content code { color: #6366f1; background: rgba(99,102,241,0.1); }
+           .html-content pre { background: #f3f4f6; color: #1d2129; }
+           .html-content table { border-color: #e5e7eb; }
+           .html-content th { background: #f9fafb; color: #1d2129; }
+           .html-content td { border-color: #e5e7eb; }
+           .html-content blockquote { border-color: #e5e7eb; color: #475569; }
+           .html-content ul, .html-content ol { color: #475569; }
+           .html-content li { color: #475569; }
+        </style>`;
+
+    const enhancedHtml = themeCSS + this.sanitizeHtml(event.html);
+    content.innerHTML = enhancedHtml;
+    content.setAttribute('data-theme', currentTheme);
     wrap.appendChild(content);
     return wrap;
   }