header index library for rehype
This package is ESM only:
Node 12+ is needed to use it and it must be import
ed instead of require
d.
[npm][]:
npm install rehype-indexes
this library is intended to support react-markdown interactively. as named indexes, It supports heading
tag to have suffix index number with anchor
tag.
following source code shows how to use with react-markdown
.
import rehypIndex from 'rehype-indexes';
///... for index
<ReactMarkDown rehypePlugins={[[rehypeIndex, {mode: 'index'} ]]}>
{text}
</ReactMarkDown>
///... for origin document
<ReactMarkDown rehypePlugins={[[rehypeIndex, {mode: 'document'}]]}>
{text}
</ReactMarkDown>
{mode: 'index'}
or non-option.
- works for index.
- It remove all non-heading tags exclude tags inside heading tag. (! you don't need to remove non-heading tag by yourself.)
- It appends anchor tag 1 based.
- anchor tag has link to document heading id.
{mode: 'document'}
- works for document.
- It add id tag to heading.
unist-util-visit
— Recursively walk over nodesreact-markdown
— Mainly targeted.
All contributes are wellcome! 😀
[MIT][license] © Jeong Yo Han