On this page, and where you are on it
A vertical list of anchor links for long pages. Left alone it watches the scroll position and marks the section under the reader; pass an active id and it becomes a controlled highlight. The current link carries the indicator bar and an aria-current of location. A floating variant collapses the list to a minimap of lines that expands on hover, so it can ride the page edge without taking column width.
Controlled
Floating
The floating variant collapses to one short line per section and costs the page no column width. Hover it, tab into it, or tap it and the full list expands as a panel; the longer, darker line is the current section.
Hover the lines on the right
Tracking this page
This one lists the two sections above and below, and follows along as you scroll.
// From the npm package
import { AnchorNav } from 'rift-ds/components/AnchorNav/AnchorNav';
// Or as source you own, via the shadcn CLI
npx shadcn@latest add https://rift-ds.com/r/anchor-nav.json