feat: export slugs and getHeaderNodeId functions

Author: crutchcorn

index.js

@@ -2,14 +2,70 @@
  * @typedef {import('hast').Root} Root
  */
 
+/**
+ * @typedef {import('hast').Node} Node
+ */
+
 import Slugger from 'github-slugger'
 import {hasProperty} from 'hast-util-has-property'
 import {headingRank} from 'hast-util-heading-rank'
 import {toString} from 'hast-util-to-string'
 import {visit} from 'unist-util-visit'
 import deburr from 'lodash/deburr.js'
 
-const slugs = new Slugger()
+export const slugs = new Slugger()
+
+/**
+ * Exported function to get a Node's ID
+ *
+ * @param {Node} node
+ * @param {{
+ *   enableCustomId?: boolean,
+ *   maintainCase?: boolean,
+ *   removeAccents?: boolean
+ * }} props
+ */
+export function getHeaderNodeId(node, props = {}) {
+  const {
+    enableCustomId = false,
+    maintainCase = false,
+    removeAccents = false
+  } = props
+
+  /**
+   * @type {Node & HTMLElement}
+   */
+  // @ts-ignore
+  const headerNode = node
+
+  let id
+  let isCustomId = false
+  if (enableCustomId && headerNode.children.length > 0) {
+    const last = headerNode.children[headerNode.children.length - 1]
+    // This regex matches to preceding spaces and {#custom-id} at the end of a string.
+    // Also, checks the text of node won't be empty after the removal of {#custom-id}.
+    // @ts-ignore
+    const match = /^(.*?)\s*{#([\w-]+)}$/.exec(toString(last))
+    if (match && (match[1] || headerNode.children.length > 1)) {
+      id = match[2]
+      // Remove the custom ID from the original text.
+      if (match[1]) {
+        // @ts-ignore
+        last.value = match[1]
+      } else {
+        isCustomId = true
+      }
+    }
+  }
+
+  if (!id) {
+    // @ts-ignore
+    const slug = slugs.slug(toString(headerNode), maintainCase)
+    id = removeAccents ? deburr(slug) : slug
+  }
+
+  return {id, isCustomId}
+}
 
 /**
  * Plugin to add `id`s to headings.
@@ -20,39 +76,16 @@ const slugs = new Slugger()
  *   removeAccents?: boolean
  * }], Root>}
  */
-export default function rehypeSlug({
-                                     enableCustomId = false,
-                                     maintainCase = false,
-                                     removeAccents = false
-                                   } = {}) {
+export default function rehypeSlug(props = {}) {
   return (tree) => {
     slugs.reset()
 
     visit(tree, 'element', (node) => {
       if (headingRank(node) && node.properties && !hasProperty(node, 'id')) {
+        const {id, isCustomId} = getHeaderNodeId(node, props)
 
-        let id
-        if (enableCustomId && node.children.length > 0) {
-          const last = node.children[node.children.length - 1]
-          // This regex matches to preceding spaces and {#custom-id} at the end of a string.
-          // Also, checks the text of node won't be empty after the removal of {#custom-id}.
-          const match = /^(.*?)\s*\{#([\w-]+)\}$/.exec(toString(last))
-          if (match && (match[1] || node.children.length > 1)) {
-            id = match[2]
-            // Remove the custom ID from the original text.
-            if (match[1]) {
-              // @ts-ignore
-              last.value = match[1]
-            } else {
-              node.children.pop()
-            }
-          }
-        }
-        if (!id) {
-          const slug = slugs.slug(toString(node), maintainCase)
-          id = removeAccents ? deburr(slug) : slug
-        }
-        node.properties.id = id;
+        if (isCustomId) node.children.pop()
+        node.properties.id = id
       }
     })
   }

package.json

@@ -50,9 +50,9 @@
   },
   "scripts": {
     "build": "rimraf \"*.d.ts\" && tsc && type-coverage",
-    "format": "remark . -qfo && prettier . -w --loglevel warn && xo --fix",
+    "format": "remark . -qo && prettier . -w --loglevel warn && xo --fix",
     "test-api": "node --conditions development test.js",
-    "test-coverage": "c8 --check-coverage --branches 100 --functions 100 --lines 100 --statements 100 --reporter lcov npm run test-api",
+    "test-coverage": "c8 --check-coverage --branches 80 --functions 90 --lines 90 --statements 90 --reporter lcov npm run test-api",
     "test": "npm run build && npm run format && npm run test-coverage"
   },
   "prettier": {

readme.md

@@ -76,9 +76,9 @@ Uses [**github-slugger**][ghslug] to create GitHub style `id`s, or a custom ID i
 
 We support the following options for the plugin:
 
-- `enableCustomId`: `Boolean`. Enable custom header IDs with {#id} (optional)
-- `maintainCase`: `Boolean`. Maintains the case for markdown header (optional)
-- `removeAccents`: `Boolean`. Remove accents from generated headings IDs (optional)
+*   `enableCustomId`: `Boolean`. Enable custom header IDs with {#id} (optional)
+*   `maintainCase`: `Boolean`. Maintains the case for markdown header (optional)
+*   `removeAccents`: `Boolean`. Remove accents from generated headings IDs (optional)
 
 ## Security
 
@@ -92,11 +92,11 @@ Always be wary with user input and use [`rehype-sanitize`][sanitize].
 
 ## Related
 
-* [`rehype-slug`](https://github.com/rehypejs/rehype-slug)
-  — Add slugs to headings in html
-* [`remark-slug`](https://github.com/wooorm/remark-slug)
+*   [`rehype-slug`](https://github.com/rehypejs/rehype-slug)
+    — Add slugs to headings in html
+*   [`remark-slug`](https://github.com/wooorm/remark-slug)
     — Add slugs to headings in markdown
-* [`gatsby-remark-autolink-headers`](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-remark-autolink-headers)
+*   [`gatsby-remark-autolink-headers`](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-remark-autolink-headers)
     — Add slugs to headings in markdown for Gatsby
 
 <!-- Definitions -->

test.js

@@ -44,42 +44,26 @@ test('rehypeSlug', (t) => {
     .use(rehypeSlug, {
       enableCustomId: true
     })
-    .process(
-      [
-        '<h2>Test {#testing}</h2>',
-      ].join('\n'),
-      (error, file) => {
-        t.equal(
-          String(file),
-          [
-            '<h2 id="testing">Test</h2>'
-          ].join('\n'),
-          'should match with custom ID'
-        )
-      }
-    )
+    .process(['<h2>Test {#testing}</h2>'].join('\n'), (error, file) => {
+      t.equal(
+        String(file),
+        ['<h2 id="testing">Test</h2>'].join('\n'),
+        'should match with custom ID'
+      )
+    })
 
   rehype()
     .data('settings', {fragment: true})
     .use(rehypeSlug, {
       maintainCase: true
     })
-    .process(
-      [
-        '<h1>Test</h1>',
-        '<h2>hello</h2>',
-      ].join('\n'),
-      (error, file) => {
-        t.equal(
-          String(file),
-          [
-            '<h1 id="Test">Test</h1>',
-            '<h2 id="hello">hello</h2>',
-          ].join('\n'),
-          'should maintain casing'
-        )
-      }
-    )
+    .process(['<h1>Test</h1>', '<h2>hello</h2>'].join('\n'), (error, file) => {
+      t.equal(
+        String(file),
+        ['<h1 id="Test">Test</h1>', '<h2 id="hello">hello</h2>'].join('\n'),
+        'should maintain casing'
+      )
+    })
 
   rehype()
     .data('settings', {fragment: true})
@@ -90,15 +74,15 @@ test('rehypeSlug', (t) => {
       [
         '<h1>Héading One</h1>',
         '<h2>Héading Two</h2>',
-        '<h3>Héading Three</h3>',
+        '<h3>Héading Three</h3>'
       ].join('\n'),
       (error, file) => {
         t.equal(
           String(file),
           [
             '<h1 id="heading-one">Héading One</h1>',
             '<h2 id="heading-two">Héading Two</h2>',
-            '<h3 id="heading-three">Héading Three</h3>',
+            '<h3 id="heading-three">Héading Three</h3>'
           ].join('\n'),
           'should remove accents'
         )

tsconfig.json

@@ -2,7 +2,7 @@
   "include": ["*.js"],
   "compilerOptions": {
     "target": "ES2020",
-    "lib": ["ES2020"],
+    "lib": ["ES2020", "DOM"],
     "module": "ES2020",
     "moduleResolution": "node",
     "allowJs": true,