JS-DevTools / rehype-toc

A rehype plugin that adds a table of contents (TOC) to the page

Home Page:https://jstools.dev/rehype-toc/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

`Node` Shape Passed to `customizeTOC` Not `unified` Standard

shellscape opened this issue · comments

The shape of the node object passed to customizeTOC doesn't match the Node interface as specified by the latest version of unified. This is what the plugin is passing:

{
    type: 'element',
    tagName: 'ol',
    properties: { className: 'toc toc-level toc-level-1' },
    children: [ [Object] ]
  }

This is what unified expects:

interface Node {
  type: string
  data: Data?
  position: Position?
}

As a result, we've no way to export the TOC using that method to stringify it, store the AST separately, etc.

rehype and hast have official typings for the HTML nodes.
You can find them at https://www.npmjs.com/package/@types/hast

The overall plugin can leverage the Plugin type, for example import('unified').Plugin<[Options] | Array<void>, Root>} (for example: https://github.com/rehypejs/rehype-meta/blob/e5eae88704c300393641c71b9e3f59a780fc3ed7/lib/index.js#L145)

Everything in src/types.ts could probably be replaced with @types/hast.
And the guard in src/type-guards.ts could be simplified after @types/hast is in use, there are a few ways to narrow nodes https://unifiedjs.com/learn/recipe/narrow-node-typescript/