Table of Contents
Scroll-spy outline that highlights the current section with smooth jump links and nested levels.
Copy a prompt for your AI coding tool with the source, dependencies and usage
Props
TableOfContentsProps
Also accepts all props of Omit<React.ComponentProps<"nav">, "children" | "title">
| Prop | Type | Default | Description |
|---|---|---|---|
| headings* required | TocHeading[] | — | — |
| title | string | "On this page" | — |
| scrollTarget | React.RefObject<HTMLElement | null> | — | Scroll container the headings live in; the window when omitted |
| offset | number | 24 | Distance from the top of the container at which a heading counts as current |
Install
$ npx shadcn@latest add https://chromotion.dev/r/table-of-contents.json