agentgui 1.0.122 → 1.0.124

package/package.json

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

package/static/js/streaming-renderer.js

@@ -451,8 +451,10 @@ class StreamingRenderer {
       });
     });
 
-    const codeContainer = document.createElement('pre');
-    codeContainer.innerHTML = `<code class="language-${this.escapeHtml(language)}">${this.escapeHtml(code)}</code>`;
+    // Use syntax highlighting instead of just escaping
+    const highlightedHTML = StreamingRenderer.renderCodeWithHighlight(code, this.escapeHtml.bind(this));
+    const codeContainer = document.createElement('div');
+    codeContainer.innerHTML = highlightedHTML;
 
     div.appendChild(header);
     div.appendChild(codeContainer);
@@ -760,16 +762,22 @@ class StreamingRenderer {
       }
     }
 
-    // Check if this looks like `cat -n` output (line numbers followed by →)
+    // Check if this looks like `cat -n` output or grep with line numbers
     const lines = trimmed.split('\n');
     const isCatNOutput = lines.length > 1 && lines[0].match(/^\s*\d+→/);
+    const isGrepOutput = lines.length > 1 && lines[0].match(/^\s*\d+-/);
 
-    if (isCatNOutput) {
-      // Strip line numbers and arrows from cat -n output
+    if (isCatNOutput || isGrepOutput) {
+      // Strip line numbers and arrows/hyphens from output
       const cleanedLines = lines.map(line => {
-        const match = line.match(/^\s*\d+→(.*)/);
+        // Skip grep context separator lines
+        if (line === '--') return null;
+
+        // Handle both cat -n (→) and grep (-n) formats
+        // Also handle grep with colon (:) for matching lines
+        const match = line.match(/^\s*\d+[→\-:](.*)/);
         return match ? match[1] : line;
-      });
+      }).filter(line => line !== null);
       const cleanedContent = cleanedLines.join('\n');
 
       // Try to detect and highlight code based on content patterns
@@ -1151,11 +1159,19 @@ class StreamingRenderer {
     const command = block.command || block.code || '';
     const output = block.output || '';
 
-    div.innerHTML = `
-      <div class="bash-command"><span class="prompt">$</span><code>${this.escapeHtml(command)}</code></div>
-      ${output ? `<pre class="bash-output"><code>${this.escapeHtml(output)}</code></pre>` : ''}
-    `;
+    // For the command, use simple escaping
+    let html = `<div class="bash-command"><span class="prompt">$</span><code>${this.escapeHtml(command)}</code></div>`;
 
+    // For output, check if it looks like code and use syntax highlighting
+    if (output) {
+      if (StreamingRenderer.detectCodeContent(output)) {
+        html += StreamingRenderer.renderCodeWithHighlight(output, this.escapeHtml.bind(this));
+      } else {
+        html += `<pre class="bash-output"><code>${this.escapeHtml(output)}</code></pre>`;
+      }
+    }
+
+    div.innerHTML = html;
     return div;
   }