@opensip-cli/dashboard 0.1.0

package/dist/checks.js

@@ -0,0 +1,283 @@
+/**
+ * Checks catalog rendering — browsable catalog of checks with run stats.
+ * Reusable: renderChecksCatalog(container, catalogData) can be called from any panel.
+ * Returns JS code as a string.
+ */
+export function dashboardChecksJs() {
+    return `
+// =======================================================
+// CHECKS CATALOG
+// =======================================================
+
+function computeCheckStats() {
+  const stats = {};
+  for (const s of sessions) {
+    // Per-session detail lives in the tool-owned opaque payload; fitness
+    // sessions carry { summary, checks }. Sessions without checks (graph,
+    // sim) contribute nothing here.
+    const checks = (s.payload && s.payload.checks) || [];
+    for (const ch of checks) {
+      if (!stats[ch.checkSlug]) stats[ch.checkSlug] = { runs: 0, passed: 0, failed: 0, lastRun: null };
+      const st = stats[ch.checkSlug];
+      st.runs++;
+      if (ch.passed) st.passed++; else st.failed++;
+      if (!st.lastRun || s.startedAt > st.lastRun) st.lastRun = s.startedAt;
+    }
+  }
+  return stats;
+}
+const checkStats = computeCheckStats();
+
+/** Render longDescription as DOM nodes with bold and code formatting. Safe — no innerHTML. */
+function renderLongDesc(text) {
+  const container = document.createElement('div');
+  container.className = 'check-long-desc';
+  if (!text) return container;
+  const parts = text.split(/(\\*\\*[^*]+\\*\\*|\\\`[^\\\`]+\\\`|\\n)/g);
+  parts.forEach(part => {
+    if (part === '\\n') {
+      container.appendChild(document.createElement('br'));
+    } else if (part.startsWith('**') && part.endsWith('**')) {
+      const strong = document.createElement('strong');
+      strong.textContent = part.slice(2, -2);
+      container.appendChild(strong);
+    } else if (part.startsWith('\\\`') && part.endsWith('\\\`')) {
+      const code = document.createElement('code');
+      code.textContent = part.slice(1, -1);
+      container.appendChild(code);
+    } else {
+      container.appendChild(document.createTextNode(part));
+    }
+  });
+  return container;
+}
+
+/**
+ * Render a check catalog table into any container element.
+ * @param panel - DOM element to render into
+ * @param catalogData - array of check catalog entries
+ */
+function renderChecksCatalog(panel, catalogData) {
+  if (!catalogData.length) {
+    panel.appendChild(el('div', {class:'empty', text:'No checks registered.'}));
+    return;
+  }
+
+  const allTags = new Set();
+  catalogData.forEach(c => (c.tags || []).forEach(t => allTags.add(t)));
+  const sortedTags = Array.from(allTags).sort();
+
+  // Filter bar
+  const filterBar = el('div', {class:'filter-bar'});
+  const searchInput = el('input', {class:'search-input', type:'text', placeholder:'Search checks...'});
+  const tagSelect = el('select', {class:'filter-select'});
+  tagSelect.appendChild(el('option', {value:'', text:'All tags'}));
+  sortedTags.forEach(t => tagSelect.appendChild(el('option', {value:t, text:t})));
+  const sourceSelect = el('select', {class:'filter-select'});
+  ['', 'built-in', 'community'].forEach(v => {
+    sourceSelect.appendChild(el('option', {value:v, text: v || 'All sources'}));
+  });
+  filterBar.appendChild(searchInput);
+  filterBar.appendChild(tagSelect);
+  filterBar.appendChild(sourceSelect);
+  panel.appendChild(filterBar);
+
+  // Stats summary
+  const totalChecks = catalogData.length;
+  const builtinCount = catalogData.filter(c => c.source === 'built-in').length;
+  const communityCount = catalogData.filter(c => c.source === 'community').length;
+  const statsRow = el('div', {style:'display:flex;gap:16px;margin-bottom:16px;font-size:13px;color:var(--text-muted)'});
+  statsRow.appendChild(el('span', {text: totalChecks + ' total checks'}));
+  statsRow.appendChild(el('span', {text: builtinCount + ' built-in', style:'color:var(--accent)'}));
+  if (communityCount > 0) statsRow.appendChild(el('span', {text: communityCount + ' community', style:'color:var(--accent-sim)'}));
+  panel.appendChild(statsRow);
+
+  // Table
+  const table = el('table', {class:'data-table sortable'});
+  const thead = el('thead');
+  const headerRow = el('tr');
+  ['', 'Check', 'Tags', 'Confidence', 'Source', 'Runs', 'Pass Rate', 'Last Run'].forEach(h => {
+    headerRow.appendChild(el('th', {text: h}));
+  });
+  thead.appendChild(headerRow);
+  table.appendChild(thead);
+
+  const tbody = el('tbody');
+  const sorted = [...catalogData].sort((a, b) => a.slug.localeCompare(b.slug));
+  const uid = 'cc-' + Math.random().toString(36).slice(2, 8);
+
+  sorted.forEach((check, i) => {
+    const st = checkStats[check.slug] || { runs: 0, passed: 0, failed: 0, lastRun: null };
+    const rate = st.runs > 0 ? Math.round((st.passed / st.runs) * 100) : -1;
+    const hasDesc = !!check.longDescription;
+    const expanderId = uid + '-exp-' + i;
+
+    const arrowCell = el('td', {style:'width:24px;text-align:center;color:var(--text-dim);font-size:12px'});
+    if (hasDesc) arrowCell.textContent = '\\u25B6';
+
+    const row = el('tr', {
+      class: hasDesc ? 'clickable' : '',
+      'data-slug': check.slug,
+      'data-tags': (check.tags || []).join(','),
+      'data-source': check.source,
+      'data-name': check.name.toLowerCase(),
+      onclick: hasDesc ? () => {
+        const exp = document.getElementById(expanderId);
+        if (exp) {
+          const isOpen = exp.classList.toggle('open');
+          exp.style.display = isOpen ? 'table-row' : 'none';
+          arrowCell.textContent = isOpen ? '\\u25BC' : '\\u25B6';
+        }
+        row.classList.toggle('expanded');
+      } : undefined
+    });
+    row.appendChild(arrowCell);
+
+    const nameCell = el('td', {style:'font-weight:500'});
+    nameCell.appendChild(document.createTextNode(check.slug));
+    row.appendChild(nameCell);
+
+    const tagsCell = el('td');
+    (check.tags || []).slice(0, 4).forEach(t => {
+      tagsCell.appendChild(el('span', {class:'tag-badge', text:t}));
+    });
+    if ((check.tags || []).length > 4) {
+      tagsCell.appendChild(el('span', {class:'tag-badge', text:'+' + ((check.tags || []).length - 4)}));
+    }
+    row.appendChild(tagsCell);
+
+    const confCell = el('td');
+    confCell.appendChild(el('span', {class:'badge badge-' + check.confidence, text: check.confidence}));
+    row.appendChild(confCell);
+
+    const sourceCell = el('td');
+    const sourceStyle = check.source === 'built-in' ? 'color:var(--accent)' : 'color:var(--accent-sim)';
+    sourceCell.appendChild(el('span', {text: check.source, style: sourceStyle + ';font-size:12px'}));
+    row.appendChild(sourceCell);
+
+    row.appendChild(el('td', {text: st.runs > 0 ? '' + st.runs : '\\u2014', style:'color:var(--text-dim)'}));
+
+    const rateCell = el('td');
+    if (rate >= 0) {
+      const rateColor = rate >= 90 ? 'var(--success)' : rate >= 70 ? 'var(--warning)' : 'var(--error)';
+      const bar = el('span', {class:'pass-rate-bar'});
+      const track = el('span', {class:'pass-rate-track'});
+      track.appendChild(el('span', {class:'pass-rate-fill', style:'width:' + rate + '%;background:' + rateColor}));
+      bar.appendChild(track);
+      bar.appendChild(el('span', {text: rate + '%', style:'font-size:12px;color:' + rateColor}));
+      rateCell.appendChild(bar);
+    } else {
+      rateCell.textContent = '\\u2014';
+      rateCell.style.color = 'var(--text-dim)';
+    }
+    row.appendChild(rateCell);
+
+    row.appendChild(el('td', {
+      text: st.lastRun ? new Date(st.lastRun).toLocaleDateString() : '\\u2014',
+      style:'color:var(--text-dim);font-size:12px'
+    }));
+
+    tbody.appendChild(row);
+
+    if (hasDesc) {
+      const expRow = el('tr', {id: expanderId, class:'expander-row', 'data-slug': check.slug, 'data-tags': (check.tags || []).join(','), 'data-source': check.source, 'data-name': check.name.toLowerCase()});
+      const expCell = el('td', {colspan:'8', style:'padding:0'});
+      const expContent = el('div', {class:'expander-content'});
+      expContent.appendChild(renderLongDesc(check.longDescription));
+      expCell.appendChild(expContent);
+      expRow.appendChild(expCell);
+      tbody.appendChild(expRow);
+    }
+  });
+
+  table.appendChild(tbody);
+  const pag = el('div', {class:'pagination'});
+  const card = el('div', {class:'card'}, [table, pag]);
+  panel.appendChild(card);
+
+  const emptyMsg = el('div', {class:'empty', style:'display:none', text:'No checks match your filters.'});
+  card.insertBefore(emptyMsg, pag);
+  paginateGroupedRows(tbody, pag, 10);
+
+  function applyFilters() {
+    const search = searchInput.value.toLowerCase();
+    const tag = tagSelect.value;
+    const source = sourceSelect.value;
+    const allRows = Array.from(tbody.children);
+    let visibleCount = 0;
+
+    // First pass: mark rows visible/hidden and collapse expanders
+    for (let i = 0; i < allRows.length; i++) {
+      const row = allRows[i];
+      if (row.classList.contains('expander-row')) continue;
+      const slug = row.getAttribute('data-slug') || '';
+      const name = row.getAttribute('data-name') || '';
+      const rowTags = row.getAttribute('data-tags') || '';
+      const rowSource = row.getAttribute('data-source') || '';
+      const matchSearch = !search || slug.includes(search) || name.includes(search);
+      const matchTag = !tag || rowTags.split(',').includes(tag);
+      const matchSource = !source || rowSource === source;
+      const visible = matchSearch && matchTag && matchSource;
+      row.style.display = visible ? '' : 'none';
+      row._filterVisible = visible;
+      if (visible) visibleCount++;
+      if (i + 1 < allRows.length && allRows[i + 1].classList.contains('expander-row')) {
+        allRows[i + 1].style.display = 'none';
+        allRows[i + 1].classList.remove('open');
+        if (row.classList.contains('expanded')) {
+          row.classList.remove('expanded');
+          const arrowTd = row.children[0];
+          if (arrowTd) arrowTd.textContent = '\\u25B6';
+        }
+      }
+    }
+    emptyMsg.style.display = visibleCount === 0 ? '' : 'none';
+
+    // Re-paginate only visible rows
+    const hasFilters = search || tag || source;
+    if (hasFilters) {
+      // Hide all first, then paginate only matching groups
+      const groups = [];
+      for (let i = 0; i < allRows.length; i++) {
+        const row = allRows[i];
+        if (row.classList.contains('expander-row')) continue;
+        if (!row._filterVisible) continue;
+        const group = [row];
+        if (i + 1 < allRows.length && allRows[i+1].classList.contains('expander-row')) {
+          group.push(allRows[i+1]);
+        }
+        groups.push(group);
+      }
+
+      // Custom pagination for filtered results
+      let currentPage = 0;
+      const pageSize = 10;
+      const totalPages = Math.max(1, Math.ceil(groups.length / pageSize));
+
+      function renderFilteredPage() {
+        // Hide all filtered rows first
+        groups.forEach(g => g.forEach(r => { r.style.display = 'none'; }));
+        const start = currentPage * pageSize;
+        const end = start + pageSize;
+        groups.slice(start, end).forEach(g => { g[0].style.display = ''; });
+
+        while (pag.firstChild) pag.removeChild(pag.firstChild);
+        if (groups.length <= pageSize) return;
+        pag.appendChild(el('div', {class:'pagination-info', text: 'Showing ' + (start+1) + '-' + Math.min(end, groups.length) + ' of ' + groups.length + ' checks'}));
+        const btns = el('div', {class:'pagination-btns'});
+        renderPageButtons(btns, currentPage, totalPages, (p) => { currentPage = p; renderFilteredPage(); });
+        pag.appendChild(btns);
+      }
+      renderFilteredPage();
+    } else {
+      paginateGroupedRows(tbody, pag, 10);
+    }
+  }
+
+  searchInput.addEventListener('input', applyFilters);
+  tagSelect.addEventListener('change', applyFilters);
+  sourceSelect.addEventListener('change', applyFilters);
+}
+`;
+}
+//# sourceMappingURL=checks.js.map

package/dist/checks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checks.js","sourceRoot":"","sources":["../src/checks.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,MAAM,UAAU,iBAAiB;IAC/B,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkRR,CAAC;AACF,CAAC"}

package/dist/code-paths/__tests__/views-registry.test.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @fileoverview Restructured Code Paths explore-tab set (Plan D — shipped).
+ *
+ * The explore-tab restructure has shipped: `dashboardCodePathsJs` emits exactly
+ * the kept views (graph / coupling) plus the ranked-distribution "Functions"
+ * affordance, and the single-metric / standalone-SCC view sources were deleted.
+ * The former standalone Search subtab was folded into the Functions view as an
+ * in-table name filter, so it no longer registers a `search` view.
+ * The emitter no longer has a legacy branch — the `restructured` parameter is a
+ * vestigial test-seam arg that always yields the restructured set.
+ */
+export {};
+//# sourceMappingURL=views-registry.test.d.ts.map

package/dist/code-paths/__tests__/views-registry.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"views-registry.test.d.ts","sourceRoot":"","sources":["../../../src/code-paths/__tests__/views-registry.test.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG"}

package/dist/code-paths/__tests__/views-registry.test.js

@@ -0,0 +1,39 @@
+/**
+ * @fileoverview Restructured Code Paths explore-tab set (Plan D — shipped).
+ *
+ * The explore-tab restructure has shipped: `dashboardCodePathsJs` emits exactly
+ * the kept views (graph / coupling) plus the ranked-distribution "Functions"
+ * affordance, and the single-metric / standalone-SCC view sources were deleted.
+ * The former standalone Search subtab was folded into the Functions view as an
+ * in-table name filter, so it no longer registers a `search` view.
+ * The emitter no longer has a legacy branch — the `restructured` parameter is a
+ * vestigial test-seam arg that always yields the restructured set.
+ */
+import { describe, expect, it } from 'vitest';
+import { dashboardCodePathsJs } from '../../code-paths.js';
+/** Pull every `id: '<x>'` from a `views.push({ id: '<x>' ... })` literal. */
+function registeredViewIds(js) {
+    const ids = [];
+    // Split on the literal `views.push({` boundary, then match the first `id:`
+    // in each chunk. Avoids a backtracking-prone whitespace pattern.
+    const chunks = js.split('views.push({');
+    for (let i = 1; i < chunks.length; i++) {
+        const m = /id:\s*'([a-z-]+)'/.exec(chunks[i] ?? '');
+        if (m)
+            ids.push(m[1]);
+    }
+    return ids;
+}
+describe('Code Paths explore-tab set', () => {
+    it('emitter registers exactly {graph, coupling, distribution}', () => {
+        const ids = registeredViewIds(dashboardCodePathsJs());
+        expect(new Set(ids)).toEqual(new Set(['graph', 'coupling', 'distribution']));
+    });
+    it('drops the single-metric + standalone-SCC + standalone-search views', () => {
+        const ids = registeredViewIds(dashboardCodePathsJs());
+        for (const removed of ['big', 'hot', 'wide', 'untested', 'sccs', 'search']) {
+            expect(ids).not.toContain(removed);
+        }
+    });
+});
+//# sourceMappingURL=views-registry.test.js.map

package/dist/code-paths/__tests__/views-registry.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"views-registry.test.js","sourceRoot":"","sources":["../../../src/code-paths/__tests__/views-registry.test.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE9C,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAE3D,6EAA6E;AAC7E,SAAS,iBAAiB,CAAC,EAAU;IACnC,MAAM,GAAG,GAAa,EAAE,CAAC;IACzB,2EAA2E;IAC3E,iEAAiE;IACjE,MAAM,MAAM,GAAG,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;IACxC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACvC,MAAM,CAAC,GAAG,mBAAmB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;QACpD,IAAI,CAAC;YAAE,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACxB,CAAC;IACD,OAAO,GAAG,CAAC;AACb,CAAC;AAED,QAAQ,CAAC,4BAA4B,EAAE,GAAG,EAAE;IAC1C,EAAE,CAAC,2DAA2D,EAAE,GAAG,EAAE;QACnE,MAAM,GAAG,GAAG,iBAAiB,CAAC,oBAAoB,EAAE,CAAC,CAAC;QACtD,MAAM,CAAC,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC,CAAC,OAAO,EAAE,UAAU,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IAC/E,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oEAAoE,EAAE,GAAG,EAAE;QAC5E,MAAM,GAAG,GAAG,iBAAiB,CAAC,oBAAoB,EAAE,CAAC,CAAC;QACtD,KAAK,MAAM,OAAO,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,CAAC;YAC3E,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;QACrC,CAAC;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/code-paths/catalog-provenance.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Catalog provenance bar for the Explore tab.
+ *
+ * The Explore views (Coupling / Functions / Visualization) all render from the
+ * single cached graph catalog — the LATEST `graph` build, whatever its scope.
+ * A scoped run (`graph packages/contracts`) or a stale build therefore narrows
+ * every view, with no on-page indication. Without a provenance line a
+ * single-package catalog reads as "the tool is broken" instead of "this catalog
+ * only covers one package."
+ *
+ * This bar surfaces what the views are built from — package scope, function
+ * count, build time, and engine — so a scoped/stale catalog is self-explanatory.
+ * Every value is DERIVED from the embedded catalog itself, so it is ground truth
+ * and can never drift from what the views render (no separately-persisted
+ * "scope" field to fall out of sync).
+ *
+ * Declares the top-level `renderCatalogProvenance(host, catalog)` consumed by
+ * the Explore body. Depends on `packagesInCatalog` (filters.ts) and the shared
+ * `el` helper, so it must be concatenated AFTER filters.ts in the prelude.
+ */
+export declare function dashboardCatalogProvenanceJs(): string;
+//# sourceMappingURL=catalog-provenance.d.ts.map

package/dist/code-paths/catalog-provenance.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-provenance.d.ts","sourceRoot":"","sources":["../../src/code-paths/catalog-provenance.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,wBAAgB,4BAA4B,IAAI,MAAM,CAsFrD"}

package/dist/code-paths/catalog-provenance.js

@@ -0,0 +1,108 @@
+/**
+ * Catalog provenance bar for the Explore tab.
+ *
+ * The Explore views (Coupling / Functions / Visualization) all render from the
+ * single cached graph catalog — the LATEST `graph` build, whatever its scope.
+ * A scoped run (`graph packages/contracts`) or a stale build therefore narrows
+ * every view, with no on-page indication. Without a provenance line a
+ * single-package catalog reads as "the tool is broken" instead of "this catalog
+ * only covers one package."
+ *
+ * This bar surfaces what the views are built from — package scope, function
+ * count, build time, and engine — so a scoped/stale catalog is self-explanatory.
+ * Every value is DERIVED from the embedded catalog itself, so it is ground truth
+ * and can never drift from what the views render (no separately-persisted
+ * "scope" field to fall out of sync).
+ *
+ * Declares the top-level `renderCatalogProvenance(host, catalog)` consumed by
+ * the Explore body. Depends on `packagesInCatalog` (filters.ts) and the shared
+ * `el` helper, so it must be concatenated AFTER filters.ts in the prelude.
+ */
+export function dashboardCatalogProvenanceJs() {
+    return String.raw `
+// Build engine ('sharded' | 'exact') parsed from the catalog cache key
+// (e.g. "eng=0.1.0|mode=sharded|..."). Null when the marker is absent.
+function catalogEngineMode(catalog) {
+  const m = /(?:^|\|)mode=([a-z]+)/.exec((catalog && catalog.cacheKey) || '');
+  return m ? m[1] : null;
+}
+
+// Total function OCCURRENCES across the catalog (each occurrence is one graph
+// node) — the catalog's size, not just distinct names.
+function catalogFunctionCount(catalog) {
+  if (!catalog || !catalog.functions) return 0;
+  let n = 0;
+  for (const name of Object.keys(catalog.functions)) n += (catalog.functions[name] || []).length;
+  return n;
+}
+
+// Coarse "N <unit> ago" for the build time. Browser Date.now() is fine here
+// (this is page JS, not the engine's Date.now()-free pure layer).
+function provenanceRelTime(iso) {
+  const t = Date.parse(iso);
+  if (isNaN(t)) return '';
+  const secs = Math.max(0, Math.round((Date.now() - t) / 1000));
+  if (secs < 45) return 'just now';
+  const mins = Math.round(secs / 60);
+  if (mins < 60) return mins + ' min' + (mins !== 1 ? 's' : '') + ' ago';
+  const hrs = Math.round(mins / 60);
+  if (hrs < 24) return hrs + ' hour' + (hrs !== 1 ? 's' : '') + ' ago';
+  const days = Math.round(hrs / 24);
+  return days + ' day' + (days !== 1 ? 's' : '') + ' ago';
+}
+
+function provenanceChip(label, value, opts) {
+  opts = opts || {};
+  const chip = el('span', { style: 'display:inline-flex;align-items:baseline;gap:6px' });
+  chip.appendChild(el('span', { text: label, style: 'color:var(--text-dim);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.05em' }));
+  chip.appendChild(el('span', { text: value, title: opts.title || '', style: 'color:' + (opts.color || 'var(--text)') + ';font-weight:600;font-size:13px' }));
+  return chip;
+}
+
+// Render the provenance bar into host. No-op when no catalog is loaded (the
+// caller already shows a "No catalog yet." empty state in that case).
+function renderCatalogProvenance(host, catalog) {
+  if (!catalog) return;
+  const pkgs = packagesInCatalog(catalog);
+  const fnCount = catalogFunctionCount(catalog);
+  const engine = catalogEngineMode(catalog);
+  const builtAt = catalog.builtAt ? new Date(catalog.builtAt) : null;
+
+  const bar = el('div', {
+    class: 'catalog-provenance',
+    style: 'display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;margin:0 0 16px;padding:10px 14px;border:1px solid var(--border);border-radius:8px;background:var(--bg-card)',
+  });
+
+  // Scope is the headline signal: 1 package vs the whole repo. List the names
+  // inline when the set is small (so a scoped build reads "1 package: contracts"
+  // directly); always carry the full sorted list in the title for hover.
+  const pkgLabel = pkgs.length === 1 ? '1 package' : String(pkgs.length) + ' packages';
+  const pkgNames = pkgs.length > 0 && pkgs.length <= 4 ? ': ' + pkgs.join(', ') : '';
+  bar.appendChild(
+    provenanceChip('Scope', pkgLabel + pkgNames, {
+      color: 'var(--accent)',
+      title: pkgs.join(', '),
+    }),
+  );
+
+  bar.appendChild(provenanceChip('Functions', fnCount.toLocaleString()));
+
+  if (builtAt && !isNaN(builtAt.getTime())) {
+    bar.appendChild(
+      provenanceChip('Built', provenanceRelTime(catalog.builtAt), { title: builtAt.toLocaleString() }),
+    );
+  }
+
+  if (engine) bar.appendChild(provenanceChip('Engine', engine));
+
+  // 'fast' resolution = syntactic (approximate) edges, so the coupling matrix /
+  // visualization are approximate too. 'exact' is the default and needs no flag.
+  if (catalog.resolutionMode === 'fast') {
+    bar.appendChild(provenanceChip('Resolution', 'fast (approximate)', { color: 'var(--warning)' }));
+  }
+
+  host.appendChild(bar);
+}
+`;
+}
+//# sourceMappingURL=catalog-provenance.js.map

package/dist/code-paths/catalog-provenance.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-provenance.js","sourceRoot":"","sources":["../../src/code-paths/catalog-provenance.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,MAAM,UAAU,4BAA4B;IAC1C,OAAO,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoFlB,CAAC;AACF,CAAC"}

package/dist/code-paths/catalog-recipes-tables.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Code Paths — Catalog & Recipes subtab tables.
+ *
+ * Declares the two top-level renderers the Code Paths panel mounts for its
+ * "Catalog" (graph rule catalog) and "Recipes" (graph recipe catalog) subtabs.
+ * Extracted from the panel orchestrator (code-paths.ts) to keep that aggregator
+ * focused on wiring; both functions are pure DOM table builders that close over
+ * the shared `el` helper, so they only need to be concatenated after it.
+ */
+export declare function dashboardCatalogRecipesTablesJs(): string;
+//# sourceMappingURL=catalog-recipes-tables.d.ts.map

package/dist/code-paths/catalog-recipes-tables.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-recipes-tables.d.ts","sourceRoot":"","sources":["../../src/code-paths/catalog-recipes-tables.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,wBAAgB,+BAA+B,IAAI,MAAM,CA2ExD"}

package/dist/code-paths/catalog-recipes-tables.js

@@ -0,0 +1,86 @@
+/**
+ * Code Paths — Catalog & Recipes subtab tables.
+ *
+ * Declares the two top-level renderers the Code Paths panel mounts for its
+ * "Catalog" (graph rule catalog) and "Recipes" (graph recipe catalog) subtabs.
+ * Extracted from the panel orchestrator (code-paths.ts) to keep that aggregator
+ * focused on wiring; both functions are pure DOM table builders that close over
+ * the shared `el` helper, so they only need to be concatenated after it.
+ */
+export function dashboardCatalogRecipesTablesJs() {
+    return String.raw `
+// =======================================================
+// CODE PATHS — CATALOG SUBTAB (graph rule catalog)
+// =======================================================
+function renderGraphRuleCatalog(container, rulesData) {
+  if (!rulesData || !rulesData.length) {
+    container.appendChild(el('div', { class: 'empty', text: 'No rules available.' }));
+    return;
+  }
+  const table = el('table', { class: 'data-table' });
+  const thead = el('thead');
+  const headerRow = el('tr');
+  ['Rule', 'Default Severity', 'Source'].forEach(h => {
+    headerRow.appendChild(el('th', { text: h }));
+  });
+  thead.appendChild(headerRow);
+  table.appendChild(thead);
+
+  const tbody = el('tbody');
+  rulesData.forEach(rule => {
+    const row = el('tr');
+    row.appendChild(el('td', { text: rule.slug, style: 'font-weight:500' }));
+    const sevCell = el('td');
+    const sevColor = rule.defaultSeverity === 'error' ? 'color:var(--danger)' : 'color:var(--warning)';
+    sevCell.appendChild(el('span', { text: rule.defaultSeverity, style: sevColor + ';font-size:12px' }));
+    row.appendChild(sevCell);
+    const srcCell = el('td');
+    srcCell.appendChild(el('span', { class: 'badge', style: 'background:var(--bg-hover);color:var(--text-muted)', text: rule.source }));
+    row.appendChild(srcCell);
+    tbody.appendChild(row);
+  });
+  table.appendChild(tbody);
+  container.appendChild(el('div', { class: 'card' }, [table]));
+}
+
+// =======================================================
+// CODE PATHS — RECIPES SUBTAB (graph recipe catalog)
+// =======================================================
+function renderGraphRecipeCatalog(container, recipesData) {
+  if (!recipesData || !recipesData.length) {
+    container.appendChild(el('div', { class: 'empty', text: 'No recipes available.' }));
+    return;
+  }
+  const table = el('table', { class: 'data-table' });
+  const thead = el('thead');
+  const headerRow = el('tr');
+  ['Recipe', 'Description', 'Selector', 'Tags'].forEach(h => {
+    headerRow.appendChild(el('th', { text: h }));
+  });
+  thead.appendChild(headerRow);
+  table.appendChild(thead);
+
+  const tbody = el('tbody');
+  recipesData.forEach(recipe => {
+    const row = el('tr');
+    const nameCell = el('td', { style: 'font-weight:500' });
+    nameCell.appendChild(el('div', { text: recipe.displayName }));
+    nameCell.appendChild(el('div', { text: recipe.name, style: 'font-size:11px;color:var(--text-dim);font-weight:400' }));
+    row.appendChild(nameCell);
+    row.appendChild(el('td', { text: recipe.description, style: 'color:var(--text-muted)' }));
+    const selCell = el('td');
+    selCell.appendChild(el('span', { class: 'badge', style: 'background:var(--bg-hover);color:var(--text-muted)', text: recipe.selectorType }));
+    row.appendChild(selCell);
+    const tagsCell = el('td');
+    (recipe.tags || []).forEach(t => {
+      tagsCell.appendChild(el('span', { class: 'tag-badge', text: t }));
+    });
+    row.appendChild(tagsCell);
+    tbody.appendChild(row);
+  });
+  table.appendChild(tbody);
+  container.appendChild(el('div', { class: 'card' }, [table]));
+}
+`;
+}
+//# sourceMappingURL=catalog-recipes-tables.js.map

package/dist/code-paths/catalog-recipes-tables.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-recipes-tables.js","sourceRoot":"","sources":["../../src/code-paths/catalog-recipes-tables.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,MAAM,UAAU,+BAA+B;IAC7C,OAAO,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyElB,CAAC;AACF,CAAC"}

package/dist/code-paths/cytoscape-vendor.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Vendored Cytoscape emitter.
+ *
+ * Reads the committed `src/vendor/cytoscape-bundle.js` UMD blob at
+ * generation time and returns it as a JS string for inlining into the
+ * report's single `<script>` block. The bundle registers the `cytoscape`
+ * and `cytoscapeDagre` browser globals the Graph view (`view-graph.ts`)
+ * consumes — fully offline, no CDN, no network at view time.
+ *
+ * Architectural note: this module reads the bundle via `node:fs`, it does
+ * NOT `import 'cytoscape'`. That is deliberate — the `dashboard-no-ui-
+ * framework` dependency-cruiser rule forbids importing a visualization
+ * library into `packages/dashboard/src/`. The renderer reaches the report
+ * as committed source text, never as a module dependency. The `cytoscape`
+ * / `cytoscape-dagre` packages are devDependencies used only by the vendor
+ * build script (`scripts/vendor-cytoscape.mjs`), which lives outside
+ * `src/` and so is out of the rule's scope.
+ */
+/**
+ * Emit the vendored Cytoscape UMD bundle as a JS string for inlining.
+ *
+ * MUST be concatenated into the Code Paths script BEFORE any view emitter
+ * that references the `cytoscape` global (i.e. before
+ * `dashboardViewGraphJs()`).
+ */
+export declare function dashboardCytoscapeVendorJs(): string;
+//# sourceMappingURL=cytoscape-vendor.d.ts.map

package/dist/code-paths/cytoscape-vendor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cytoscape-vendor.d.ts","sourceRoot":"","sources":["../../src/code-paths/cytoscape-vendor.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AA8CH;;;;;;GAMG;AACH,wBAAgB,0BAA0B,IAAI,MAAM,CAEnD"}