@vibecodeqa/cli 0.10.0 → 0.11.0

package/dist/cli.js

@@ -22,7 +22,7 @@ import { runTypeSafety } from "./runners/type-safety.js";
 import { computeScore } from "./score.js";
 import { computeTrend, formatTrend } from "./trend.js";
 import { gradeFromScore } from "./types.js";
-const VERSION = "0.10.0";
+const VERSION = "0.11.0";
 const args = process.argv.slice(2);
 const flags = new Set(args.filter((a) => a.startsWith("--")));
 const cwd = resolve(args.find((a) => !a.startsWith("--")) || ".");
@@ -30,6 +30,7 @@ const outputDir = join(cwd, ".vibe-check");
 const jsonOnly = flags.has("--json");
 const ciMode = flags.has("--ci");
 const skipTests = flags.has("--skip-tests");
+const watchMode = flags.has("--watch");
 function color(grade) {
     if (grade === "A")
         return "\x1b[32m";
@@ -141,7 +142,7 @@ async function main() {
     if (ciMode && score < 60) {
         process.exit(1);
     }
-    if (!jsonOnly && !ciMode) {
+    if (!jsonOnly && !ciMode && !watchMode) {
         try {
             const { execSync } = await import("node:child_process");
             const openCmd = process.platform === "darwin" ? "open" : "xdg-open";
@@ -149,6 +150,32 @@ async function main() {
         }
         catch { /* failed to open browser */ }
     }
+    // Watch mode — re-run on file changes
+    if (watchMode) {
+        const { watch } = await import("node:fs");
+        const srcDirs = ["src", "web/src"].map((d) => join(cwd, d)).filter((d) => existsSync(d));
+        if (srcDirs.length === 0) {
+            console.log("  \x1b[31mNo src/ directory to watch\x1b[0m");
+            process.exit(1);
+        }
+        console.log("  \x1b[2mWatching for changes... (Ctrl+C to stop)\x1b[0m");
+        console.log("");
+        let debounce = null;
+        for (const dir of srcDirs) {
+            watch(dir, { recursive: true }, (_event, filename) => {
+                if (!filename || filename.includes("node_modules") || filename.includes(".vibe-check"))
+                    return;
+                if (debounce)
+                    clearTimeout(debounce);
+                debounce = setTimeout(() => {
+                    console.log(`  \x1b[2mChanged: ${filename} — re-scanning...\x1b[0m`);
+                    main().catch(() => { });
+                }, 500);
+            });
+        }
+        // Keep process alive
+        await new Promise(() => { });
+    }
 }
 main().catch((err) => {
     console.error("vibe-check error:", err);

package/dist/report/html.js

@@ -78,6 +78,7 @@ export function generateHTML(report) {
         ...GROUPS.map((g) => ({ id: g.id, label: g.label })),
         { id: "issues", label: `Issues (${totalIssues})` },
         { id: "files", label: "File Map" },
+        { id: "heatmap", label: "Heatmap" },
     ];
     const topNav = topNavItems.map((t) => `<a class="tn" data-page="${t.id}" onclick="go('${t.id}')">${t.label}</a>`).join("");
     // Overview page
@@ -189,6 +190,29 @@ ${allIssues.length > 200 ? `<p style="color:var(--muted);text-align:center;margi
 <h2>File Heatmap</h2>
 <p style="color:var(--muted);font-size:0.78rem;margin-bottom:1rem">Top ${topFiles.length} files by total issues across all checks</p>
 ${fileRows || '<p style="color:var(--muted)">No file-level issues found.</p>'}
+</div>`;
+    // Codebase heatmap — each file = row of pixels, color = issue density
+    const heatmapFiles = [...fileIssues.entries()]
+        .sort((a, b) => b[1].errors + b[1].warnings - a[1].errors - a[1].warnings)
+        .slice(0, 30);
+    let heatmapHtml = "";
+    if (heatmapFiles.length > 0) {
+        const maxIssues = Math.max(...heatmapFiles.map(([, d]) => d.errors + d.warnings));
+        heatmapHtml = heatmapFiles.map(([file, d]) => {
+            const total = d.errors + d.warnings;
+            const intensity = maxIssues > 0 ? total / maxIssues : 0;
+            const r = Math.round(239 * intensity); // red channel
+            const g = Math.round(68 * (1 - intensity) + 197 * (d.errors === 0 ? 0.3 : 0)); // green
+            const color = `rgb(${r},${g},30)`;
+            const barW = Math.max(4, Math.round(intensity * 200));
+            const checks = [...d.checks].join(", ");
+            return `<div class="hm-row"><span class="hm-name">${fl(file)}</span><div class="hm-bar" style="width:${barW}px;background:${color}" title="${total} issues (${checks})"></div><span class="hm-count">${d.errors}E ${d.warnings}W</span></div>`;
+        }).join("");
+    }
+    const heatmapPage = `<div id="p-heatmap" class="page">
+<h2>Code Heatmap</h2>
+<p style="color:var(--muted);font-size:0.78rem;margin-bottom:1rem">Visual density of issues per file. Red = errors, orange = warnings. Bar width = relative issue count.</p>
+${heatmapHtml || '<p style="color:var(--muted)">No issues to visualize.</p>'}
 </div>`;
     return `<!DOCTYPE html>
 <html lang="en">
@@ -316,6 +340,10 @@ h3{font-size:0.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:
 .footer a{color:var(--muted)}
 .flink{color:var(--accent);text-decoration:none;font-family:"SF Mono",monospace}.flink:hover{text-decoration:underline}
 .arch-svg{margin:1rem 0;overflow-x:auto}
+.hm-row{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.2rem;font-size:0.7rem}
+.hm-name{width:200px;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:"SF Mono",monospace;font-size:0.65rem}
+.hm-bar{height:14px;border-radius:3px;min-width:4px}
+.hm-count{color:var(--muted);font-size:0.65rem;flex-shrink:0}
 .arch-svg svg{border-radius:8px}
 .cp-btn{background:none;border:none;cursor:pointer;font-size:0.6rem;opacity:0.3;padding:0 0.2rem;flex-shrink:0}.cp-btn:hover{opacity:1}
 .ir:hover .cp-btn{opacity:0.6}
@@ -345,6 +373,7 @@ h3{font-size:0.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:
   ${catPages}
   ${issuesPage}
   ${filesPage}
+  ${heatmapPage}
   <div class="footer">Generated by <a href="https://vibecodeqa.online">VibeCode QA</a> v${report.version} &mdash; <code>npx @vibecodeqa/cli</code></div>
 </div>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vibecodeqa/cli",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "description": "Code health scanner for the AI coding era. 15 checks, zero config, full report.",
   "type": "module",
   "bin": {