@opensip-cli/dashboard 0.1.6 → 0.1.8

package/dist/code-paths/view-coupling.js

@@ -1,218 +0,0 @@
-/**
- * View 4 — "Package coupling heat map".
- *
- * Reads the engine-emitted `catalog.features.edge` rows (Plan C — the
- * dashboard no longer re-aggregates call edges client-side); each row is a
- * { callerPackage, calleePackage, count } directed coupling edge. Renders a
- * per-package N×N table with text-shaded density (CSS custom property
- * --coupling-density).
- *
- * The matrix is the WHOLE-GRAPH (unfiltered) coupling matrix — the filter
- * chips no longer narrow it (it is a whole-graph insight). When the catalog
- * carries no `edge` feature (a non-dashboard run) the view shows a no-data
- * empty state.
- *
- * Empty cells (no calls in this direction) show '·' and are not
- * clickable. Non-empty cells render the count; click → opens a
- * Function Card list of the actual call sites for that pair (the drilldown
- * keeps its own per-call-site walk, which the aggregate edge feature can't
- * provide).
- */
-export function dashboardViewCouplingJs() {
-    return String.raw `
-views.push({
-  id: 'coupling',
-  label: 'Coupling',
-  help: {
-    title: 'Package coupling heat map',
-    sections: [
-      { heading: 'What this is', body: 'A caller-by-callee matrix. Each cell counts the static call edges from one package into another. Darker shading = more calls. Click a cell to see the actual call sites.' },
-      { heading: 'Why you care', body: 'Layered architectures want a clear flow of dependencies. Surprises in this matrix — a leaf package calling into core, a kernel package calling a peer — are usually layering violations or stale abstractions.' },
-      { heading: 'How to read it', body: 'Read rows as "this package calls". Read columns as "this package is called by". The diagonal (a package calling itself) is normally densest. Off-diagonal density tells you which packages know about each other; absence of a cell means no call sites in that direction.' },
-      { heading: 'What to do', body: 'Cells you did not expect deserve investigation. If a package is called by everyone (a column with many filled cells), that is a hub — make sure its API is intentional. If two peers both call into each other, you may have a circular dependency hiding in plain sight.' },
-    ],
-  },
-  render(container, catalog, indexes, filterState) {
-    while (container.firstChild) container.removeChild(container.firstChild);
-    if (!catalog || !catalog.functions) {
-      container.appendChild(el('div', { class: 'empty', text: 'No catalog loaded.' }));
-      return;
-    }
-    // The coupling matrix is read from the engine-emitted 'edge' feature
-    // (Plan C) — the dashboard no longer re-aggregates call edges client-side.
-    // Each edge is { callerPackage, calleePackage, count } computed via the
-    // canonical resolveCallee. Note: the engine matrix is the WHOLE-GRAPH
-    // (unfiltered) matrix; the filter chips no longer narrow it (the matrix is
-    // a whole-graph insight). Absent features ⇒ no-data empty state (a
-    // non-dashboard run does not materialize coupling).
-    const edges = (catalog.features && catalog.features.edge) || null;
-    if (!edges) {
-      container.appendChild(el('div', { class: 'empty', text: 'No coupling data in this catalog. Re-run the graph for a dashboard to compute the package matrix.' }));
-      return;
-    }
-    const counts = new Map();
-    let max = 0;
-    for (const e of edges) {
-      let row = counts.get(e.callerPackage);
-      if (!row) { row = new Map(); counts.set(e.callerPackage, row); }
-      row.set(e.calleePackage, e.count);
-      if (e.count > max) max = e.count;
-    }
-    const pkgs = Array.from(new Set([...counts.keys(), ...[].concat(...Array.from(counts.values(), m => Array.from(m.keys())))])).sort();
-    if (pkgs.length === 0) {
-      container.appendChild(el('div', { class: 'empty', text: 'No cross-package calls found.' }));
-      return;
-    }
-    const section = el('div', { class: 'section' });
-    section.appendChild(makeSectionHeading('Package coupling (' + pkgs.length + '×' + pkgs.length + ')', 'coupling'));
-    // Export the FULL (untruncated) coupling counts as long-format CSV.
-    const toolbar = el('div', { class: 'coupling-toolbar' });
-    toolbar.appendChild(el('button', {
-      class: 'coupling-export-btn',
-      text: 'Export CSV',
-      onclick: () => downloadCouplingCsv(counts),
-    }));
-    section.appendChild(toolbar);
-    const card = el('div', { class: 'card' });
-    const table = el('table', { class: 'coupling-table' });
-    const thead = el('thead');
-    const headRow = el('tr');
-    headRow.appendChild(el('th', { class: 'row-label', text: 'caller \\\\ callee' }));
-    for (const callee of pkgs) headRow.appendChild(el('th', { text: callee }));
-    thead.appendChild(headRow);
-    table.appendChild(thead);
-    const tbody = el('tbody');
-    for (const caller of pkgs) {
-      const row = el('tr');
-      row.appendChild(el('th', { class: 'row-label', text: caller }));
-      const rowCounts = counts.get(caller);
-      for (const callee of pkgs) {
-        const c = (rowCounts && rowCounts.get(callee)) || 0;
-        if (c === 0) {
-          row.appendChild(el('td', { class: 'coupling-cell empty', text: '·' }));
-        } else {
-          const density = max > 0 ? (c / max).toFixed(2) : '0';
-          const cell = el('td', {
-            class: 'coupling-cell',
-            style: '--coupling-density: ' + density,
-            text: String(c),
-            'data-caller': caller,
-            'data-callee': callee,
-            onclick: () => openCouplingDrilldown(caller, callee, indexes, filterState),
-          });
-          row.appendChild(cell);
-        }
-      }
-      tbody.appendChild(row);
-    }
-    table.appendChild(tbody);
-    // Bounded, scrollable viewport: a large N×N matrix would otherwise run off
-    // the page. overflow:auto gives both scrollbars; the sticky header/label
-    // styling (see code-paths.css .coupling-scroll) keeps the axes readable.
-    const scroll = el('div', { class: 'coupling-scroll' });
-    scroll.appendChild(table);
-    card.appendChild(scroll);
-    section.appendChild(card);
-    container.appendChild(section);
-  },
-});
-
-// Build the coupling CSV as the SAME wide matrix the on-screen table shows
-// (Map<callerPkg, Map<calleePkg, count>>): a 'caller \\ callee' corner cell,
-// one column per callee package, one row per caller package, cells = the
-// directed call count (0 where there is no edge). The package set and its sort
-// are computed exactly as the table builds them, so the CSV is the grid —
-// easier to navigate in a spreadsheet than our scrollable matrix on very large
-// repos. Full and untruncated. Returned as a string so it is unit testable
-// without touching the DOM / Blob APIs.
-function buildCouplingCsv(counts) {
-  const callees = [].concat(...Array.from(counts.values(), m => Array.from(m.keys())));
-  const pkgs = Array.from(new Set([...counts.keys(), ...callees])).sort();
-  const header = [csvField('caller \\\\ callee')].concat(pkgs.map(csvField)).join(',');
-  const rows = [header];
-  for (const caller of pkgs) {
-    const row = counts.get(caller);
-    const cells = [csvField(caller)];
-    for (const callee of pkgs) {
-      cells.push(String((row && row.get(callee)) || 0));
-    }
-    rows.push(cells.join(','));
-  }
-  return rows.join('\n');
-}
-
-// RFC-4180-ish field quoting: wrap in double quotes and double any embedded
-// quote when the value contains a comma, quote, CR, or LF. Package names are
-// normally bare, but '<unknown>' and odd repo layouts make this cheap insurance.
-function csvField(value) {
-  let s = String(value == null ? '' : value);
-  // CSV/formula-injection guard: a cell a spreadsheet could read as a formula
-  // (leading =, +, -, @, tab, or CR) is neutralized with a leading apostrophe
-  // so Excel/Sheets treat it as text. Package names are untrusted — they come
-  // from arbitrary analyzed repos and can legitimately start with '@' (scoped
-  // packages) — so guard before the RFC-4180 quoting below.
-  if (s.length > 0 && /^[=+\-@\t\r]/.test(s)) s = "'" + s;
-  if (/[",\r\n]/.test(s)) return '"' + s.replace(/"/g, '""') + '"';
-  return s;
-}
-
-// Trigger a client-side download of the coupling CSV via a Blob + a transient
-// anchor. No-ops gracefully in environments without URL.createObjectURL.
-function downloadCouplingCsv(counts) {
-  const csv = buildCouplingCsv(counts);
-  try {
-    const blob = new Blob([csv], { type: 'text/csv;charset=utf-8' });
-    const url = URL.createObjectURL(blob);
-    const a = el('a', { href: url, download: 'coupling.csv', style: 'display:none' });
-    document.body.appendChild(a);
-    a.click();
-    document.body.removeChild(a);
-    setTimeout(() => { try { URL.revokeObjectURL(url); } catch (e) { /* ignore */ } }, 0);
-  } catch (e) { /* download unsupported in this environment */ }
-}
-
-function openCouplingDrilldown(callerPkg, calleePkg, indexes, filterState) {
-  // Render an inline Function Card overlay listing the call sites for
-  // the (callerPkg, calleePkg) pair. We piggyback on the overlay used
-  // by the universal Function Card to keep the singleton invariant.
-  let overlay = document.querySelector('.function-card-overlay');
-  if (!overlay) {
-    overlay = el('div', { class: 'function-card-overlay' });
-    overlay.addEventListener('click', e => { if (e.target === overlay) closeFunctionCard(); });
-    document.body.appendChild(overlay);
-  }
-  while (overlay.firstChild) overlay.removeChild(overlay.firstChild);
-  const card = el('div', { class: 'function-card' });
-  overlay.appendChild(card);
-  card.appendChild(el('button', { class: 'fc-close', text: '×', onclick: closeFunctionCard }));
-  card.appendChild(el('h3', { text: callerPkg + ' → ' + calleePkg }));
-  card.appendChild(el('div', { class: 'fc-loc', text: 'Call sites between these packages' }));
-  const list = el('ul', { class: 'fc-list' });
-  let count = 0;
-  for (const occ of indexes.byBodyHash.values()) {
-    if (!passesFilter(occ, filterState)) continue;
-    if (pkgOf(occ) !== callerPkg) continue;
-    for (const edge of (occ.calls || [])) {
-      for (const target of (edge.to || [])) {
-        const callee = resolveCalleeOcc(target, occ, indexes);
-        if (!callee) continue;
-        if (pkgOf(callee) !== calleePkg) continue;
-        const item = el('li', {
-          'data-body-hash': occ.bodyHash,
-          text: displayName(occ.simpleName) + '  →  ' + displayName(callee.simpleName) + '   (' + occ.filePath + ':' + edge.line + ')',
-        });
-        item.addEventListener('click', () => openFunctionCard(occ.bodyHash));
-        list.appendChild(item);
-        count++;
-        if (count > 200) break;
-      }
-      if (count > 200) break;
-    }
-    if (count > 200) break;
-  }
-  if (count === 0) list.appendChild(el('li', { class: 'external', text: 'No call sites found.' }));
-  card.appendChild(list);
-}
-`;
-}
-//# sourceMappingURL=view-coupling.js.map

package/dist/code-paths/view-coupling.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"view-coupling.js","sourceRoot":"","sources":["../../src/code-paths/view-coupling.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,MAAM,UAAU,uBAAuB;IACrC,OAAO,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkMlB,CAAC;AACF,CAAC"}

package/dist/code-paths/view-distribution.d.ts

@@ -1,20 +0,0 @@
-/**
- * View — "Functions" (ranked-distribution affordance).
- *
- * Replaces the four single-metric ranked tabs (big / hot / wide / untested)
- * with ONE sortable, paginated, filter-aware function table whose columns are
- * the union those tabs covered: lines, callers (hot), params/width (wide), and
- * a test-reachable flag (untested). The default sort is by lines descending
- * (the most-requested triage axis); the shared `makeSortable` lets the reader
- * re-sort by any column, so the sub-threshold tail (e.g. a 140-line function
- * under a 150 gate) stays triageable once the single-metric tabs are gone.
- *
- * Built on `defineRankedView` (the same skeleton the removed tabs used), so it
- * reuses `renderFunctionRows` / `makeSortable` / `paginateTable` and the
- * row-click → Function Card delegation with no new plumbing.
- *
- * Part of the Plan B Code Paths restructure; concatenated only in the
- * restructured (flag = true) branch of `dashboardCodePathsJs`.
- */
-export declare function dashboardViewDistributionJs(): string;
-//# sourceMappingURL=view-distribution.d.ts.map

package/dist/code-paths/view-distribution.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"view-distribution.d.ts","sourceRoot":"","sources":["../../src/code-paths/view-distribution.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAIH,wBAAgB,2BAA2B,IAAI,MAAM,CA6DpD"}

package/dist/code-paths/view-distribution.js

@@ -1,82 +0,0 @@
-/**
- * View — "Functions" (ranked-distribution affordance).
- *
- * Replaces the four single-metric ranked tabs (big / hot / wide / untested)
- * with ONE sortable, paginated, filter-aware function table whose columns are
- * the union those tabs covered: lines, callers (hot), params/width (wide), and
- * a test-reachable flag (untested). The default sort is by lines descending
- * (the most-requested triage axis); the shared `makeSortable` lets the reader
- * re-sort by any column, so the sub-threshold tail (e.g. a 140-line function
- * under a 150 gate) stays triageable once the single-metric tabs are gone.
- *
- * Built on `defineRankedView` (the same skeleton the removed tabs used), so it
- * reuses `renderFunctionRows` / `makeSortable` / `paginateTable` and the
- * row-click → Function Card delegation with no new plumbing.
- *
- * Part of the Plan B Code Paths restructure; concatenated only in the
- * restructured (flag = true) branch of `dashboardCodePathsJs`.
- */
-import { defineRankedView } from './view-template.js';
-export function dashboardViewDistributionJs() {
-    return defineRankedView({
-        id: 'distribution',
-        label: 'Functions',
-        help: {
-            title: 'Functions (distribution)',
-            sections: [
-                {
-                    heading: 'What this is',
-                    body: 'Every function in the catalog in one sortable table. Columns cover the metrics the former single-metric tabs ranked individually: body length (lines), inbound callers, parameter count (width), and whether the function is reachable only from tests.',
-                },
-                {
-                    heading: 'Why you care',
-                    body: 'Findings surface the rules that actually fired; this table is the raw distribution behind them. It is where you triage the sub-threshold tail — a 140-line function under a 150-line gate, a 3-param function just under a width rule — that a pass/fail findings list cannot show.',
-                },
-                {
-                    heading: 'How to read it',
-                    body: 'Sort by any column (click the header). Lines descending is the default. Callers = 0 plus no test reachability is an orphan; Test-only = yes means production code reached only from tests. Use the filter chips above the tab bar to scope by package, kind, or test-file membership.',
-                },
-                {
-                    heading: 'What to do',
-                    body: 'Click a row to open the Function Card and inspect callers/callees. Long bodies split along callee boundaries; wide signatures often want an options object; test-only functions usually belong in a __tests__/ helper.',
-                },
-            ],
-        },
-        // Default ranking metric: body length (lines). Re-sortable to any column.
-        metric: 'Math.max(0, (occ.endLine || occ.line) - occ.line + 1)',
-        preamble: String.raw `
-    function distCallerCount(o) { return (indexes.callers.get(o.bodyHash) || []).length; }
-    function distParamCount(o) { return (o.params || []).length; }
-    function distTestOnly(o) {
-      if (o.inTestFile) return false;
-      const callers = indexes.callers.get(o.bodyHash) || [];
-      if (callers.length === 0) return false;
-      return callers.every(function(h) {
-        const c = indexes.byBodyHash.get(h);
-        return c && c.inTestFile === true;
-      });
-    }`,
-        columns: [
-            { label: 'Function', value: 'o => displayName(o.simpleName)' },
-            { label: 'Lines', value: 'o => o.__metric' },
-            { label: 'Callers', value: 'o => distCallerCount(o)' },
-            { label: 'Params', value: 'o => distParamCount(o)' },
-            // The former 'Test-only' column moved to a "Test-only" filter toggle (below).
-            { label: 'Kind', value: 'o => o.kind' },
-            { label: 'Package', value: 'o => pkgOf(o)' },
-            { label: 'File', value: "o => o.filePath + ':' + o.line" },
-        ],
-        headingText: 'Functions',
-        emptyMessage: 'No functions match the active filters.',
-        // Absorbs the former standalone Search subtab: a name filter above
-        // the table, re-filtering rows in place by function simple-name.
-        searchByName: true,
-        // Kind (single-select) + Package (single-select) dropdowns in the same
-        // controls row, before the search box: Kind · Package · search.
-        filterByKindPackage: true,
-        // A "Test-only" checkbox after the search box — when checked, narrows the
-        // table to production functions reached only from tests (distTestOnly).
-        filterToggle: { label: 'Test-only', predicate: 'distTestOnly(occ)' },
-    });
-}
-//# sourceMappingURL=view-distribution.js.map

package/dist/code-paths/view-distribution.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"view-distribution.js","sourceRoot":"","sources":["../../src/code-paths/view-distribution.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,MAAM,UAAU,2BAA2B;IACzC,OAAO,gBAAgB,CAAC;QACtB,EAAE,EAAE,cAAc;QAClB,KAAK,EAAE,WAAW;QAClB,IAAI,EAAE;YACJ,KAAK,EAAE,0BAA0B;YACjC,QAAQ,EAAE;gBACR;oBACE,OAAO,EAAE,cAAc;oBACvB,IAAI,EAAE,yPAAyP;iBAChQ;gBACD;oBACE,OAAO,EAAE,cAAc;oBACvB,IAAI,EAAE,qRAAqR;iBAC5R;gBACD;oBACE,OAAO,EAAE,gBAAgB;oBACzB,IAAI,EAAE,uRAAuR;iBAC9R;gBACD;oBACE,OAAO,EAAE,YAAY;oBACrB,IAAI,EAAE,wNAAwN;iBAC/N;aACF;SACF;QACD,0EAA0E;QAC1E,MAAM,EAAE,uDAAuD;QAC/D,QAAQ,EAAE,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;MAWlB;QACF,OAAO,EAAE;YACP,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,gCAAgC,EAAE;YAC9D,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,iBAAiB,EAAE;YAC5C,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,yBAAyB,EAAE;YACtD,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,wBAAwB,EAAE;YACpD,8EAA8E;YAC9E,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE;YACvC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,eAAe,EAAE;YAC5C,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,gCAAgC,EAAE;SAC3D;QACD,WAAW,EAAE,WAAW;QACxB,YAAY,EAAE,wCAAwC;QACtD,mEAAmE;QACnE,iEAAiE;QACjE,YAAY,EAAE,IAAI;QAClB,uEAAuE;QACvE,gEAAgE;QAChE,mBAAmB,EAAE,IAAI;QACzB,0EAA0E;QAC1E,wEAAwE;QACxE,YAAY,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,mBAAmB,EAAE;KACrE,CAAC,CAAC;AACL,CAAC"}

package/dist/code-paths/view-graph.d.ts

@@ -1,35 +0,0 @@
-/**
- * View 8 — "Visualization" (node-link topology, Cytoscape.js + dagre).
- *
- * The non-tabular Code Graph view. A self-contained **Level** control switches
- * what the graph shows:
- *
- *  - PACKAGE level (default) — one node per package, one edge per directed
- *    package→package coupling. Function granularity across the whole repo
- *    produced thousands of nodes, unusable in a node-link layout; the package
- *    rollup is the same data the Coupling matrix shows, drawn as a graph.
- *    Source: the pre-projected `graph-view-model` JSON blob embedded by
- *    `generator.ts` (projector in `graph-view-model.ts`, run at
- *    report-generation time) — NOT the raw catalog. Absent blob → empty state.
- *  - FUNCTION level — the functions of ONE selected package and the calls
- *    among them, projected client-side from the embedded catalog indexes by
- *    `gvBuildFunctionElements`. Scoping to a single package keeps the node
- *    count bounded. The "Edges" toggle chooses intra-package only (default) or
- *    "+ cross-package" (also draw calls leaving the package, to faded external
- *    nodes). Honors the Scope (test inclusion) and Kind (multi-select) filters.
- *
- * The view owns its controls (Level / Scope / Package / Kind / Edges) in
- * `gvRenderControls`; the shared Explore filter chips govern the Functions
- * table, NOT this view. Package + Kind only apply at function level, so they
- * are disabled at package level. Renderer is the vendored `cytoscape` global +
- * the `cytoscapeDagre` layout extension, both inlined by
- * `dashboardCytoscapeVendorJs()` ahead of this emitter in `code-paths.ts`.
- *
- * Features: pan/zoom, layout selector (dagre/cose/breadthfirst), name search,
- * node-click impact highlight (direct caller/callee neighbors), and
- * cross-package cycle highlighting (package level). Visual encoding
- * (totalCoupling→size, weight→edge thickness, sccId→accent, external→faded) is
- * applied in `gvStylesheet` / `gvBuildElements` / `gvBuildFunctionElements`.
- */
-export declare function dashboardViewGraphJs(): string;
-//# sourceMappingURL=view-graph.d.ts.map

package/dist/code-paths/view-graph.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"view-graph.d.ts","sourceRoot":"","sources":["../../src/code-paths/view-graph.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAMH,wBAAgB,oBAAoB,IAAI,MAAM,CAqV7C"}