feat(cli): galaxy visualizer — self-contained interactive HTML graph explorer (6F.8)

[officialCodeWork]

Summary

Implements the feature you requested: once scan emits the graph JSON, ui-lineage visualize turns it into an interactive HTML page you can open in a browser and explore — all nodes and their interconnections laid out like a galaxy, with options to inspect your own repo.

ui-lineage scan ./src -o app.graph.json
ui-lineage visualize -g app.graph.json -o app.galaxy.html
open app.galaxy.html   # no server, no network

What it produces

A single self-contained HTML file — graph JSON plus all CSS/JS inlined, zero network requests — safe to double-click or share. The client is a canvas force-directed "galaxy": components are the stars, their instances/hooks/state/data-sources cluster around them, routes act as gravitational centers. All 9 node kinds are color-coded with a legend.

Exploration options:

• Toggle any node kind or edge kind on/off (with all/none)
• Search a node and fly the camera to it
• Click a node → detail panel (name, kind, file:line, connection count, flags) with its neighborhood highlighted and everything else dimmed — a visual blast radius
• Drag to pin a node, scroll to zoom, pause the physics, always-on labels

Built with grid-approximated repulsion (neighbor cells only) so it stays responsive at real-codebase scale (thousands of nodes) where SVG would choke.

Design & safety

• renderVisualization(graph) is a pure function (graph in, HTML string out) — trivially testable; toViewModel trims nodes to what the client needs and drops dangling edges
• Embedded JSON escapes <, so rendered text containing </script> can't break out of the data script (tested)

Verification

• Driven live in the in-app browser against the demo-app graph: renders, filters, physics toggle, and search→select all work with zero console errors; loads over file:// and http:// with no external requests
• CLI package gained a test script + vitest; 5 new tests (embed round-trip, dangling-edge drop, </script> breakout guard, self-contained assertions)
• pnpm eval unaffected (290/0/0/0); typecheck clean; README documents the command

Note

This is 6F.8. The only remaining Phase 6F step is 6F.6 (test-coverage hardening), which is blocked on a real failing sample — our fixture's custom-wrapper test shape already produces covered-by edges, so the field's "1 edge app-wide" failure comes from a variant we haven't seen yet.

🤖 Generated with Claude Code