Content & Dashboard
Table of Contents (Sticky, Scroll-Spy)
Sticky table of contents with IntersectionObserver-driven scroll-spy highlighting that degrades to a plain link list without observer support.
$ velocityx add table-of-contents
Built for react.
Needs react already installed
as a peer dependency.
An Astro-only project needs @astrojs/react wired up first — this won't run on its own in plain Astro.
Full docs for Table of Contents (Sticky, Scroll-Spy) →
Needs a licence key —
subscribe here, then
velocityx loginonce.
Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| items | { id, label, depth? }[] | No | DEFAULT_ITEMS | depth 0|1, 1 renders indented |
| title | string, | No | 'On this page' | |
| className | string | No | '' |
File this creates
The CLI writes this path into your project, relative to its root — nothing else moves.
components/velocity/table-of-contents/TableOfContents.jsx Using the Table of Contents (Sticky, Scroll-Spy) component
Install it with velocityx add table-of-contents.
The CLI writes the source straight into your project — no runtime dependency, no registry
lock-in, and it themes itself from the same primary-*/accent-* scale as the rest of the library.
Related components
More from Content & Dashboard.
Client-filtered blog index grid driven by a category pill row built from the posts data.
reactMonth calendar grid with prev/next navigation, locale-aware weekday/month labels via Intl, and per-day event dots.
reactStyled pre/code block with a filename bar and a copy button with a real success state, no syntax highlighter bundled.
reactShare-to-platform link row (X, LinkedIn, Facebook, Email) plus a copy-link button with a real success state.
react