rehype-sectionize

Divide headings into sections

:warning: This is a work in progress.

---

Usage

This package is available as a Rehype plugin.

API usage:

``js require("@rstacruz/rehype-sectionize").plugin(options)(root);`

Usage with rehype:

`js const rehype = require("rehype"); const sectionize = require("@rstacruz/rehype-sectionize").plugin;

rehype() .use(sectionize, { level: "h2" }) .process(fs.readFileSync("hello.html"), (err, file) => { if (err) throw err; console.log(String(file)); });`

Usage with gatsby-plugin-mdx:

`js // gatsby-config.js module.exports = { plugins: [ { resolve: "gatsby-plugin-mdx", options: { rehypePlugins: [ [ require("@rstacruz/rehype-sectionize").plugin, { / Options here / level: "h2", }, ], ], }, }, ], };`

`Configuration`

| Key | Default value | Description | | ------------------------- | ------------------------------------------ | ------------------------------------------------------------------------ | |level | "h2"| The heading to fix up | |allowedTypes | { element: true, jsx: true, text: true }| What node types to allow to be placed inside a section | | | | | |prelude.enabled | true| If true, then elements before the first h2 is wrapped on its own section | |prelude.tagName | "section"| Tag name used in the prelude section | |prelude.properties | {}| Properties to add to the prelude section | | | | | |section.tagName | "section"| Tag name used in the section | |section.properties | {}| Properties to add to the section | |section.addHeadingClass | true| If true, class names from the H2 will be added to the section | | | | | |body.enabled | false| Enables the body wrapper | |body.tagName | "div"| Tag name used in the body inside the section | |body.properties | {}| Properties to add to the body wrapper | |body.addHeadingClass | false` | If true, class names from the H2 will be added to the body element |

Thanks

> ricostacruz.com ·
> GitHub @rstacruz ·
> Twitter @rstacruz

![](https://github.com/rstacruz)
![](https://twitter.com/rstacruz)

[mit]: http://mit-license.org/
[contributors]: http://github.com/rstacruz/rehype-sectionize/contributors

Usage

This package is available as a Rehype plugin.

API usage:

js
require("@rstacruz/rehype-sectionize").plugin(options)(root);

Usage with rehype:

js
const rehype = require("rehype");
const sectionize = require("@rstacruz/rehype-sectionize").plugin;

rehype()
  .use(sectionize, { level: "h2" })
  .process(fs.readFileSync("hello.html"), (err, file) => {
    if (err) throw err;
    console.log(String(file));
  });

js
// gatsby-config.js
module.exports = {
  plugins: [
    {
      resolve: "gatsby-plugin-mdx",
      options: {
        rehypePlugins: [
          [
            require("@rstacruz/rehype-sectionize").plugin,
            {
              / Options here /
              level: "h2",
            },
          ],
        ],
      },
    },
  ],
};

Configuration

| Key                       | Default value                              | Description                                                              |
| ------------------------- | ------------------------------------------ | ------------------------------------------------------------------------ |
|

level | "h2"

                                     | The heading to fix up                                                    |
|

allowedTypes | { element: true, jsx: true, text: true }

 | What node types to allow to be placed inside a section                   |
|                           |                                            |                                                                          |
|

prelude.enabled | true

                                     | If true, then elements before the first h2 is wrapped on its own section |
|

prelude.tagName | "section"

                                | Tag name used in the prelude section                                     |
|

prelude.properties | {}

                                       | Properties to add to the prelude section                                 |
|                           |                                            |                                                                          |
|

section.tagName | "section"

                                | Tag name used in the section                                             |
|

section.properties | {}

                                       | Properties to add to the section                                         |
|

section.addHeadingClass | true

                                     | If true, class names from the H2 will be added to the section            |
|                           |                                            |                                                                          |
|

body.enabled | false

                                    | Enables the body wrapper                                                 |
|

body.tagName | "div"

                                    | Tag name used in the body inside the section                             |
|

body.properties | {}

                                       | Properties to add to the body wrapper                                    |
|

body.addHeadingClass | false` | If true, class names from the H2 will be added to the body element |

Thanks

![](https://github.com/rstacruz)
![](https://twitter.com/rstacruz)

[mit]: http://mit-license.org/
[contributors]: http://github.com/rstacruz/rehype-sectionize/contributors