antri_cli 1.57.28 → 1.57.31

package/dist/desktop/public/index.html

@@ -15,7 +15,7 @@
   <header class="app-header">
     <div class="brand-zone">
       <span class="logo-mark">ANTRI</span>
-      <span class="version-tag">v1.57.28</span>
+      <span class="version-tag">v1.57.31</span>
     </div>
 
     <!-- Mode Toggle -->
@@ -79,6 +79,15 @@
       <button class="nav-item active" onclick="showTab('chat')">
         <span class="nav-label">Agent Studio</span>
       </button>
+      <button class="nav-item" onclick="showTab('codebase')">
+        <span class="nav-label">🫁 Codebase Radar</span>
+      </button>
+      <button class="nav-item" onclick="showTab('workspace')">
+        <span class="nav-label">💻 Code Workspace</span>
+      </button>
+      <button class="nav-item" onclick="showTab('timeline')">
+        <span class="nav-label">🧠 Thinking Timeline</span>
+      </button>
       <button class="nav-item" onclick="showTab('dialectic')">
         <span class="nav-label">Dialectic Arena</span>
       </button>
@@ -497,6 +506,145 @@
         </div>
       </section>
 
+      <!-- TAB 9: Codebase Intelligence Radar (Desktop Exclusive) -->
+      <section id="tab-codebase" class="tab-panel">
+        <div class="panel-header">
+          <div class="panel-title-group">
+            <h2 class="panel-title">🫁 Codebase Intelligence Radar</h2>
+            <p class="panel-subtitle">Pre-analyzed codebase cache, technology stack matrix, subsystem modules, and Git workspace status.</p>
+          </div>
+          <button class="action-btn" id="btn-codebase-breathe" onclick="triggerCodebaseBreathe()">🫁 Breathe & Re-Index Codebase</button>
+        </div>
+
+        <div id="codebase-breathing-bar" class="breathing-progress-bar hidden">
+          <div class="breathing-pulse-indicator">✨ ANTRI is breathing... Analyzing codebase architecture & indexing context...</div>
+        </div>
+
+        <div id="codebase-dashboard-content" class="codebase-dashboard-layout">
+          <!-- Populated dynamically via loadCodebaseTab() -->
+        </div>
+      </section>
+
+      <!-- TAB 10: Code Workspace & Live File Editor (Desktop Exclusive) -->
+      <section id="tab-workspace" class="tab-panel">
+        <div class="panel-header">
+          <div class="panel-title-group">
+            <h2 class="panel-title">💻 Live Code Workspace & Playground</h2>
+            <p class="panel-subtitle">Browse workspace files, edit source code directly, and preview live HTML artifacts in real-time sandbox.</p>
+          </div>
+          <div style="display:flex;gap:8px;">
+            <button class="action-btn-secondary" onclick="loadWorkspaceTree()">⟳ Refresh Tree</button>
+            <button class="action-btn" id="btn-save-workspace-file" onclick="saveWorkspaceFile()">💾 Save File</button>
+          </div>
+        </div>
+
+        <div class="workspace-editor-layout">
+          <!-- Left: File Tree Browser -->
+          <div class="workspace-tree-sidebar">
+            <div class="tree-header">
+              <span>Workspace Files</span>
+            </div>
+            <div id="workspace-tree-list" class="workspace-tree-list">
+              <!-- Populated dynamically via JS -->
+            </div>
+          </div>
+
+          <!-- Center/Right: Code Editor & Live Preview -->
+          <div class="workspace-code-pane">
+            <div class="editor-header">
+              <span id="active-workspace-filename" class="active-file-tag">Select a file to inspect or edit</span>
+              <div class="device-toggles" id="workspace-device-toggles" style="display:none;">
+                <button class="device-btn active" onclick="setSandboxDevice('desktop')">🖥️ Desktop</button>
+                <button class="device-btn" onclick="setSandboxDevice('tablet')">📱 Tablet</button>
+                <button class="device-btn" onclick="setSandboxDevice('mobile')">📲 Mobile</button>
+              </div>
+            </div>
+            <textarea id="workspace-file-editor" class="profile-textarea code-font" placeholder="// Select a file from the left sidebar to edit..." spellcheck="false"></textarea>
+            <div id="workspace-sandbox-container" class="workspace-sandbox-container hidden">
+              <iframe id="workspace-sandbox-iframe" sandbox="allow-scripts allow-same-origin allow-popups allow-forms" class="sandbox-iframe"></iframe>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      <!-- TAB 11: Autonomous Thinking Timeline (Desktop Exclusive) -->
+      <section id="tab-timeline" class="tab-panel">
+        <div class="panel-header">
+          <div class="panel-title-group">
+            <h2 class="panel-title">🧠 Autonomous Engineering Mission Control</h2>
+            <p class="panel-subtitle">Deep multi-stage thinking pipeline, architectural planning protocols, and anti-shallow code verification.</p>
+          </div>
+          <button class="action-btn" onclick="showTab('chat')">🚀 Start Coding in Studio</button>
+        </div>
+
+        <div class="thinking-timeline-layout">
+          <div class="timeline-stage-card">
+            <div class="stage-number">01</div>
+            <div class="stage-content">
+              <h3>🫁 Codebase Breathing & Intelligence Cache Retrieval</h3>
+              <p>On boot, ANTRI takes 1-2 seconds to index manifests, technology stack, directory layout, and entrypoints into active memory cache without blocking.</p>
+              <div class="stage-tags">
+                <span class="badge">1.2s Warmup</span>
+                <span class="badge">Project Radar</span>
+                <span class="badge">Git Context</span>
+              </div>
+            </div>
+          </div>
+
+          <div class="timeline-stage-card">
+            <div class="stage-number">02</div>
+            <div class="stage-content">
+              <h3>🏛️ Deep Architectural Blueprint & Type Schema Design</h3>
+              <p>Before coding, ANTRI models domain entities, DTOs, data flow, responsive breakpoints, state management, and edge cases to eliminate 4-5 line shallow codebases.</p>
+              <div class="stage-tags">
+                <span class="badge">Anti-Trivial Mandate</span>
+                <span class="badge">TypeScript Strict</span>
+                <span class="badge">State Modeling</span>
+              </div>
+            </div>
+          </div>
+
+          <div class="timeline-stage-card">
+            <div class="stage-number">03</div>
+            <div class="stage-content">
+              <h3>🧱 Modular File Scaffolding & Multi-File Generation</h3>
+              <p>Writes real physical source files directly to the project directory (<code>index.html</code>, <code>style.css</code>, <code>app.js</code>, <code>package.json</code>, components) with zero fake placeholders.</p>
+              <div class="stage-tags">
+                <span class="badge">write_file</span>
+                <span class="badge">Multi-File Architecture</span>
+                <span class="badge">Zero Placeholders</span>
+              </div>
+            </div>
+          </div>
+
+          <div class="timeline-stage-card">
+            <div class="stage-number">04</div>
+            <div class="stage-content">
+              <h3>🛡️ Defensive Engineering & High-Craft Polish</h3>
+              <p>Integrates Web Audio API sound synthesizers, keyframe animations, Chart.js visualizations, Canvas-Confetti celebrations, and comprehensive error handling.</p>
+              <div class="stage-tags">
+                <span class="badge">Web Audio API</span>
+                <span class="badge">Glassmorphism</span>
+                <span class="badge">Tactile UX</span>
+              </div>
+            </div>
+          </div>
+
+          <div class="timeline-stage-card">
+            <div class="stage-number">05</div>
+            <div class="stage-content">
+              <h3>🌐 Dual-Delivery Synergy</h3>
+              <p>Real production files safely persisted on disk for deployment & Git, plus instant interactive single-page application artifact for in-chat desktop preview.</p>
+              <div class="stage-tags">
+                <span class="badge">Disk Source Files</span>
+                <span class="badge">Live Artifact Sandbox</span>
+                <span class="badge">Instant Testing</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </section>
+
     </main>
   </div>
 

package/dist/desktop/public/style.css

@@ -1804,5 +1804,361 @@ body.antri-app {
   margin-top: 12px;
 }
 
+/* 🫁 CODEBASE INTELLIGENCE RADAR STYLES */
+.breathing-progress-bar {
+  background: linear-gradient(90deg, rgba(168, 85, 247, 0.15), rgba(99, 102, 241, 0.25), rgba(168, 85, 247, 0.15));
+  border: 1px solid rgba(168, 85, 247, 0.4);
+  border-radius: var(--radius-sm);
+  padding: 12px 16px;
+  margin-bottom: 1.5rem;
+  animation: breathingGlow 2s infinite ease-in-out;
+}
+
+@keyframes breathingGlow {
+  0%, 100% { box-shadow: 0 0 10px rgba(168, 85, 247, 0.2); }
+  50% { box-shadow: 0 0 25px rgba(168, 85, 247, 0.5); }
+}
+
+.breathing-pulse-indicator {
+  font-weight: 600;
+  font-size: 0.9rem;
+  color: #c084fc;
+  text-align: center;
+}
+
+.codebase-dashboard-layout {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+}
+
+.codebase-hero-card {
+  background: var(--bg-card);
+  border: 1px solid var(--border-main);
+  border-radius: var(--radius-md);
+  padding: 1.5rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 1.5rem;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
+}
+
+.project-identity {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 10px;
+  flex-wrap: wrap;
+}
+
+.project-title {
+  font-size: 1.4rem;
+  font-weight: 800;
+  color: var(--text-primary);
+}
+
+.project-version {
+  font-size: 0.85rem;
+  color: var(--text-muted);
+  font-family: var(--font-mono);
+}
+
+.tech-stack-row {
+  display: flex;
+  gap: 6px;
+  flex-wrap: wrap;
+}
+
+.tech-pill {
+  background: var(--bg-subtle);
+  border: 1px solid var(--border-main);
+  color: var(--text-primary);
+  font-size: 0.76rem;
+  font-weight: 600;
+  padding: 3px 8px;
+  border-radius: var(--radius-xs);
+}
+
+.hero-stats-grid {
+  display: flex;
+  gap: 1.5rem;
+}
+
+.stat-box {
+  background: var(--bg-subtle);
+  border: 1px solid var(--border-main);
+  border-radius: var(--radius-sm);
+  padding: 10px 18px;
+  text-align: center;
+  min-width: 100px;
+}
+
+.stat-number {
+  display: block;
+  font-size: 1.4rem;
+  font-weight: 800;
+  color: var(--accent-primary);
+}
+
+.stat-label {
+  font-size: 0.72rem;
+  color: var(--text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  font-weight: 600;
+}
+
+.git-status-badge {
+  background: var(--bg-card);
+  border: 1px solid var(--border-main);
+  border-radius: var(--radius-sm);
+  padding: 10px 16px;
+  display: flex;
+  gap: 20px;
+  flex-wrap: wrap;
+  font-size: 0.82rem;
+  color: var(--text-secondary);
+}
+
+.codebase-columns-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  gap: 1.5rem;
+}
+
+.codebase-col-card {
+  background: var(--bg-card);
+  border: 1px solid var(--border-main);
+  border-radius: var(--radius-md);
+  padding: 1.25rem;
+}
+
+.codebase-col-card h3 {
+  font-size: 0.95rem;
+  font-weight: 700;
+  color: var(--text-primary);
+  margin-bottom: 1rem;
+}
+
+.subsystems-list, .key-files-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.subsystem-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: var(--bg-subtle);
+  padding: 8px 12px;
+  border-radius: var(--radius-xs);
+  font-size: 0.84rem;
+}
+
+.subsystem-name {
+  font-weight: 600;
+  color: var(--text-primary);
+}
+
+.subsystem-count {
+  color: var(--text-muted);
+  font-size: 0.76rem;
+}
+
+.key-file-tag {
+  background: var(--bg-subtle);
+  padding: 6px 10px;
+  border-radius: var(--radius-xs);
+  font-size: 0.8rem;
+  font-family: var(--font-mono);
+  color: var(--text-primary);
+}
+
+.deps-cloud {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.dep-pill {
+  background: rgba(99, 102, 241, 0.1);
+  border: 1px solid rgba(99, 102, 241, 0.25);
+  color: #818cf8;
+  font-size: 0.76rem;
+  padding: 4px 8px;
+  border-radius: var(--radius-xs);
+  font-family: var(--font-mono);
+}
+
+/* 💻 LIVE WORKSPACE & PLAYGROUND STYLES */
+.workspace-editor-layout {
+  display: grid;
+  grid-template-columns: 260px 1fr;
+  gap: 1.25rem;
+  height: calc(100vh - 200px);
+}
+
+.workspace-tree-sidebar {
+  background: var(--bg-card);
+  border: 1px solid var(--border-main);
+  border-radius: var(--radius-md);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+
+.tree-header {
+  padding: 10px 14px;
+  border-bottom: 1px solid var(--border-main);
+  font-weight: 700;
+  font-size: 0.84rem;
+  color: var(--text-primary);
+}
+
+.workspace-tree-list {
+  padding: 8px;
+  overflow-y: auto;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.tree-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 6px 10px;
+  border-radius: var(--radius-xs);
+  font-size: 0.82rem;
+  color: var(--text-secondary);
+  cursor: pointer;
+  transition: all 0.15s;
+}
+
+.tree-item:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+}
+
+.tree-item.active {
+  background: var(--primary-subtle);
+  color: var(--accent-primary);
+  font-weight: 600;
+}
+
+.workspace-code-pane {
+  background: var(--bg-card);
+  border: 1px solid var(--border-main);
+  border-radius: var(--radius-md);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+
+.active-file-tag {
+  font-size: 0.86rem;
+  font-weight: 600;
+  font-family: var(--font-mono);
+  color: var(--text-primary);
+}
+
+.device-toggles {
+  display: flex;
+  gap: 4px;
+}
+
+.device-btn {
+  background: var(--bg-subtle);
+  border: 1px solid var(--border-main);
+  color: var(--text-secondary);
+  padding: 4px 8px;
+  border-radius: var(--radius-xs);
+  font-size: 0.76rem;
+  cursor: pointer;
+}
+
+.device-btn.active {
+  background: var(--accent-primary);
+  color: var(--text-inverted);
+}
+
+.code-font {
+  font-family: var(--font-mono) !important;
+  font-size: 0.85rem !important;
+  line-height: 1.5 !important;
+  flex: 1;
+}
+
+.workspace-sandbox-container {
+  height: 45%;
+  border-top: 1px solid var(--border-main);
+  background: #ffffff;
+}
+
+.sandbox-iframe {
+  width: 100%;
+  height: 100%;
+  border: none;
+}
+
+/* 🧠 THINKING TIMELINE STYLES */
+.thinking-timeline-layout {
+  display: flex;
+  flex-direction: column;
+  gap: 1.25rem;
+  max-width: 900px;
+}
+
+.timeline-stage-card {
+  background: var(--bg-card);
+  border: 1px solid var(--border-main);
+  border-radius: var(--radius-md);
+  padding: 1.5rem;
+  display: flex;
+  gap: 1.5rem;
+  align-items: flex-start;
+  transition: all 0.2s ease;
+}
+
+.timeline-stage-card:hover {
+  border-color: var(--accent-primary);
+  transform: translateY(-2px);
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
+}
+
+.stage-number {
+  font-size: 1.8rem;
+  font-weight: 900;
+  color: var(--accent-primary);
+  opacity: 0.8;
+  font-family: var(--font-mono);
+  min-width: 45px;
+}
+
+.stage-content h3 {
+  font-size: 1.1rem;
+  font-weight: 700;
+  color: var(--text-primary);
+  margin-bottom: 0.4rem;
+}
+
+.stage-content p {
+  font-size: 0.88rem;
+  color: var(--text-secondary);
+  line-height: 1.5;
+  margin-bottom: 0.8rem;
+}
+
+.stage-tags {
+  display: flex;
+  gap: 6px;
+  flex-wrap: wrap;
+}
+
+
 
 

package/dist/desktop/server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/desktop/server.ts"],"names":[],"mappings":"AAqCA,qBAAa,aAAa;IACxB,OAAO,CAAC,MAAM,CAA4B;IAC1C,OAAO,CAAC,IAAI,CAAQ;IACpB,OAAO,CAAC,WAAW,CAAa;IAChC,OAAO,CAAC,kBAAkB,CAAiD;IAC3E,OAAO,CAAC,gBAAgB,CAAqD;;IAO7E,OAAO,CAAC,sBAAsB;IA2BjB,KAAK,IAAI,OAAO,CAAC,MAAM,CAAC;IAqExB,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;YAUpB,SAAS;WA4mBH,aAAa,IAAI,OAAO,CAAC,IAAI,CAAC;CAyBnD"}
+{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/desktop/server.ts"],"names":[],"mappings":"AAsCA,qBAAa,aAAa;IACxB,OAAO,CAAC,MAAM,CAA4B;IAC1C,OAAO,CAAC,IAAI,CAAQ;IACpB,OAAO,CAAC,WAAW,CAAa;IAChC,OAAO,CAAC,kBAAkB,CAAiD;IAC3E,OAAO,CAAC,gBAAgB,CAAqD;;IAO7E,OAAO,CAAC,sBAAsB;IA2BjB,KAAK,IAAI,OAAO,CAAC,MAAM,CAAC;IAqExB,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;YAUpB,SAAS;WAwrBH,aAAa,IAAI,OAAO,CAAC,IAAI,CAAC;CAyBnD"}

package/dist/desktop/server.js

@@ -16,6 +16,7 @@ import { getAllActiveTools, ToolExecutor } from '../core/tools.js';
 import { getAvailableModels } from '../providers/models.js';
 import { PROMPT_TOOLKIT_COMMANDS } from '../cli/promptToolkit.js';
 import { FilePickerService } from '../cli/dialogs/filePicker.js';
+import { CodebaseBreather, ProjectContextCache } from '../core/codebaseBreather.js';
 import chalk from 'chalk';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -246,6 +247,51 @@ export class DesktopServer {
             res.end(JSON.stringify({ artifacts, grouped }));
             return;
         }
+        // GET /api/codebase/cache (Codebase Intelligence Radar)
+        if (pathname === '/api/codebase/cache' && req.method === 'GET') {
+            let cache = ProjectContextCache.get(config.workingDir);
+            if (!cache) {
+                cache = CodebaseBreather.analyzeCodebase(config.workingDir);
+                ProjectContextCache.set(config.workingDir, cache);
+            }
+            res.writeHead(200, { 'Content-Type': 'application/json' });
+            res.end(JSON.stringify({ cache }));
+            return;
+        }
+        // GET /api/workspace/tree (Interactive File Explorer Tree)
+        if (pathname === '/api/workspace/tree' && req.method === 'GET') {
+            const query = url.searchParams.get('query') || '';
+            const tree = FilePickerService.listDirectory(config.workingDir, query);
+            res.writeHead(200, { 'Content-Type': 'application/json' });
+            res.end(JSON.stringify(tree));
+            return;
+        }
+        // GET /api/workspace/file (Inspect & View file content)
+        if (pathname === '/api/workspace/file' && req.method === 'GET') {
+            const relPath = url.searchParams.get('path') || '';
+            const fullPath = path.resolve(config.workingDir, relPath);
+            if (!fullPath.startsWith(path.resolve(config.workingDir))) {
+                res.writeHead(403, { 'Content-Type': 'application/json' });
+                res.end(JSON.stringify({ error: 'Access denied' }));
+                return;
+            }
+            try {
+                if (fs.existsSync(fullPath) && fs.statSync(fullPath).isFile()) {
+                    const content = fs.readFileSync(fullPath, 'utf-8');
+                    res.writeHead(200, { 'Content-Type': 'application/json' });
+                    res.end(JSON.stringify({ success: true, path: relPath, content }));
+                }
+                else {
+                    res.writeHead(404, { 'Content-Type': 'application/json' });
+                    res.end(JSON.stringify({ error: 'File not found' }));
+                }
+            }
+            catch (err) {
+                res.writeHead(500, { 'Content-Type': 'application/json' });
+                res.end(JSON.stringify({ error: err.message }));
+            }
+            return;
+        }
         // GET /api/artifacts/:id/view (Render standalone HTML / visual graph artifact)
         if (pathname?.startsWith('/api/artifacts/') && pathname.endsWith('/view') && req.method === 'GET') {
             const { artifactManager } = await import('../core/artifactManager.js');
@@ -312,6 +358,35 @@ export class DesktopServer {
                     }));
                     return;
                 }
+                // POST /api/codebase/breathe (Trigger 1-2s Codebase Analysis & Cache Re-indexing)
+                if (pathname === '/api/codebase/breathe' && req.method === 'POST') {
+                    const freshCache = await CodebaseBreather.breathe(config.workingDir, { minDurationMs: 1200, silent: true });
+                    res.writeHead(200, { 'Content-Type': 'application/json' });
+                    res.end(JSON.stringify({ success: true, cache: freshCache }));
+                    return;
+                }
+                // POST /api/workspace/file (Edit / Save workspace file directly)
+                if (pathname === '/api/workspace/file' && req.method === 'POST') {
+                    const relPath = payload.path || '';
+                    const content = payload.content || '';
+                    const fullPath = path.resolve(config.workingDir, relPath);
+                    if (!fullPath.startsWith(path.resolve(config.workingDir))) {
+                        res.writeHead(403, { 'Content-Type': 'application/json' });
+                        res.end(JSON.stringify({ error: 'Access denied' }));
+                        return;
+                    }
+                    try {
+                        fs.mkdirSync(path.dirname(fullPath), { recursive: true });
+                        fs.writeFileSync(fullPath, content, 'utf-8');
+                        res.writeHead(200, { 'Content-Type': 'application/json' });
+                        res.end(JSON.stringify({ success: true, path: relPath }));
+                    }
+                    catch (err) {
+                        res.writeHead(500, { 'Content-Type': 'application/json' });
+                        res.end(JSON.stringify({ error: err.message }));
+                    }
+                    return;
+                }
                 // POST /api/permission/response (Desktop tool confirmation response)
                 if (pathname === '/api/permission/response' && req.method === 'POST') {
                     const { requestId, allowed, alwaysAllow } = payload;