TOC

A Table of Contents with active anchor observer and auto scroll.

Usage

import * as Base from 'next-docs-zeta/toc'
 
return (
  <Base.TOCProvider>
    <Base.TOCItem />
  </Base.TOCProvider>
)

TOC Provider

Contains all anchor items. By default, it automatically scrolls to the active anchor.

TOC Item

The anchor element.

Use Active Anchor

A hook for getting the active anchor. It accepts the item url and return a boolean value, must be called under the TOC Provider.

Useful for implementing advanced styling.

import { useActiveAnchor } from 'next-docs-zeta/toc'
 
const isActive = useActiveAnchor(item.url)