rehype-heading-anchor
Advanced tools
Comparing version 0.0.1 to 0.1.0
{ | ||
"name": "rehype-heading-anchor", | ||
"version": "0.0.1", | ||
"version": "0.1.0", | ||
"description": "rehype plugin to add anchor tags to headings", | ||
@@ -5,0 +5,0 @@ "main": "dist/index.js", |
@@ -13,6 +13,7 @@ # rehype-heading-anchor | ||
This plugin will wrap headings (h1, h2, h3, ... , h6) with anchor tags. For basic use, specifying the plugin should just work. | ||
```js | ||
import { rehype } from 'rehype'; | ||
import rehypeHeadingAnchor from '../src/index.js'; | ||
import rehypeSlug from 'rehype-slug'; | ||
import rehypeHeadingAnchor from 'rehype-heading-anchor'; | ||
@@ -30,5 +31,37 @@ const result = await rehype() | ||
```html | ||
<a href="#hello-world" class="heading-anchor"><h1 id="hello-world">Hello World!</h1></a> | ||
<a href="#hello-world"><h1 id="hello-world">Hello World!</h1></a> | ||
``` | ||
Note that only headings with ids will be processed. Using the plugin along with plugins such as [rehype-slug](https://github.com/rehypejs/rehype-slug) is recommended to auto generate ids. | ||
Note that only headings with ids will be processed. Apply plugins such as [rehype-slug](https://github.com/rehypejs/rehype-slug) before this plugin to auto generate ids. | ||
## API | ||
``` | ||
unified().use(rehypeHeadingAnchor[, options]) | ||
``` | ||
`options.className` pass an array of string to add class names to the generated anchor tag | ||
```js | ||
import { rehype } from 'rehype'; | ||
import rehypeHeadingAnchor from 'rehype-heading-anchor'; | ||
const result = await rehype() | ||
.data('settings', { fragment: true }) | ||
.use(rehypeHeadingAnchor, { className: ['custom-class'] }) | ||
.process('<h1 id="hello-world">Hello World!</h1>'); | ||
console.log(result); | ||
``` | ||
Running the example above will yield | ||
```html | ||
<a href="#hello-world"> | ||
<h1 id="hello-world" className="custom-class">Hello World!</h1> | ||
</a> | ||
``` | ||
## License | ||
MIT © Kazushi Konosu |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
66
5104
5
44