Table of Content
Table of Content provides an in-page navigation list allowing users to jump to sections within a long-form page.
Installation
npx sdaia-ui@latest add table-of-content
Usage
import { TableOfContent } from "@/components/ui/table-of-content"<TableOfContent items={[]} />Examples
Default
A table of contents with hierarchical navigation links for in-page sections.
Loading preview…
1
<TableOfContent pageName="[Page Name]" lists={[[{ id: '1', label: 'Page Section', level: 1, selected: true }]]} />API Reference
TableOfContentProps
Props for the TableOfContent component.
Prop | Type | Default | Required |
|---|---|---|---|
label | ReactNode | 'On this page' | optional |
pageName | ReactNode | - | required |
lists | TableOfContentListItem[][] | - | required |