Skip to content

feat(toc): add constellation variant#21

Open
stanley-910 wants to merge 2 commits intotoc-variantsfrom
toc-constellation
Open

feat(toc): add constellation variant#21
stanley-910 wants to merge 2 commits intotoc-variantsfrom
toc-constellation

Conversation

@stanley-910
Copy link
Copy Markdown
Owner

Stacked on #20 — merge that first.

Summary

  • Fourth TableOfContents variant that renders section headings as a star map: dots laid out deterministically per-post (seeded PRNG, mulberry32 + repulsion), connected by faint amber edges in reading order. Active node glows amber; the active → next edge brightens from 0.2 → 0.5 opacity.
  • New lib/toc-starmap.ts helper owns the layout (hashStr + mulberry32 + rejection sampling). Seed is the post pathname, so positions are stable across reloads.
  • Auto-fallback to staffline when headings.length > 12 (constellation breaks visually past ~10 nodes) or when the user has prefers-reduced-motion: reduce.
  • Ship-behind-opt-in: no post is wired to variant="constellation" yet, and the tag → variant map is unchanged. Enable per-post later.

Test plan

  • With variant="constellation" on the Whitten post (4 headings), renders 4 nodes + 3 edges; labels in Instrument Serif, dots muted until active.
  • Scrolling to a section marks it active in amber; active-outgoing edge increases to 0.5 stroke-opacity.
  • On the Dijkstra post (18 headings w/ variant="constellation"), falls back to staffline list.
  • No visual regression on classic / staffline / vim variants.
  • Reduced-motion fallback (manual: toggle OS setting → should render as staffline).

Adds a fourth TableOfContents variant that renders headings as a
star map: dots laid out deterministically per-post (seeded PRNG),
connected by faint amber edges in reading order. Active node glows;
active edge brightens.

- lib/toc-starmap.ts: seeded mulberry32 + repulsion layout so each
  post gets stable positions across reloads.
- toc.css: scoped .toc-variant-constellation block (dot, label, edge,
  active states); extends shared positioning with the other variants.
- toc.tsx: ConstellationToc sub-component. Auto-falls back to
  staffline when headings.length > 12 or prefers-reduced-motion.

No post opts in yet — ship behind explicit variant="constellation".
@vercel
Copy link
Copy Markdown
Contributor

vercel Bot commented Apr 21, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
stanley Ready Ready Preview, Comment Apr 21, 2026 9:29pm

Opts the RNN post into variant="constellation" for a visible demo
of the new star-map TOC. Nine headings is at the upper edge of what
the narrow sidebar handles cleanly — labels can overlap when a pair
of stars lands close in a horizontal row. If that becomes a problem
we can either widen the sidebar, shorten headings, or drop back to
the vim variant.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant