feat(web): highlight active metabar heading

[cjc0013]

The right-side table of contents now tracks the currently viewed heading after scroll or hash navigation. Active links receive aria-current="location" and a more visible style so the current section is easier to spot.

The web generator test now covers that the client bundle hydrates the active-heading behavior for right-side table of contents links.

Validation: node --check src/generators/web/__tests__/generate.test.mjs and git diff --check.

Refs: #529

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
api-docs-tooling	Ready	Preview	Jun 11, 2026 10:57pm

[cursor]

PR Summary

Low Risk
Client-only TOC UX in MetaBar with no auth or data changes; behavior is covered by a new integration assertion on the generated bundle.

Overview
The right-side Table of Contents in MetaBar now highlights the section in view while the user scrolls or follows in-page hash links.

A new useActiveHeadingId hook picks the active heading from DOM positions (with a fixed scroll offset), updates on passive scroll and hashchange via requestAnimationFrame, and passes a custom link component through MetaBar’s as prop. Active entries get aria-current="location", data-active-heading, and .activeHeading styles (green accent, bold, left border).

The web generate test writes a page to a temp output dir and asserts the emitted fs.js client bundle includes the active-heading hydration markers (data-active-heading, aria-current, hashchange, scroll). createEntry now accepts an optional heading depth for nested TOC fixtures.

^{Reviewed by Cursor Bugbot for commit 14e26cf. Bugbot is set up for automated code reviews on this repo. Configure here.}

[cursor]

Cursor Bugbot has reviewed your changes using default effort and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 14e26cf. Configure here.}

[cursor]

Last section not highlighted

Medium Severity

Scroll tracking only promotes a heading when its getBoundingClientRect().top is at or above SCROLL_OFFSET. On the last section, that heading often sits lower on the screen while earlier headings are still above the threshold, so the table of contents keeps the previous link active instead of the section in view.

 

^{Reviewed by Cursor Bugbot for commit 14e26cf. Configure here.}