Carregando…Carregando…Carregando…Carregando…TOC that scans a container's headings via DOM and animates an active-range highlight bar.
Escaneia headings via DOM (id do container) + barra ativa animada
Role a área ao lado — o TOC escaneia os headings deste container automaticamente.
npx kikitocn add modul-inspired-toc
@/lib/motion, motion, skeleton
Envolva o conteúdo com um id e passe idOfParentContainer.
$ npx kikitocn add modul-inspired-toc@/lib/utils@/lib/motionmotionimport { Modul-InspiredTOC } from "@/components/ui/cn/modul-inspired-toc/Modul-InspiredTOC";
export function Modul-InspiredTOCExample() {
return (
<Modul-InspiredTOC idOfParentContainer="Exemplo" />
);
}| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
idOfParentContainer* | string | — | id do container cujos headings (h1-h6) serão escaneados |
maxDepth | number | 3 | Profundidade máxima de heading considerada |
className | string | — | Classes CSS extras |
style | React.CSSProperties | — | Estilos inline extras |