defListHastHandlers not working with react-markdown and Typescript

[justinh-kairos]

Trying to use this plugin with react-markdown, but Typescript is throwing an error.

<ReactMarkdown
  children={data}
  remarkPlugins={[remarkDefinitionList]}
  remarkRehypeOptions={{
    handlers: Object.assign({}, defListHastHandlers)
  }}
  components={{
    blockquote: FadedCard,
    h2: ({ node, ...props }) => <h2 className="m-0" {...props}></h2>,
    h6: ({ node, ...props }) => <div className="lead mb-2" {...props}></div>,
    p: "div",
    ul: ({ node, ...props }) => <ul className="m-0" {...props}></ul>
  }}
/>

The error is on the handlers line:

Type '{ [x: string]: Handler; }' is not assignable to type 'Handlers'.
  'string' index signatures are incompatible.
    Type 'import("<project_root>/node_modules/mdast-util-definition-list/node_modules/mdast-util-to-hast/lib/index").Handler' is not assignable to type 'import("<project_root>/node_modules/mdast-util-to-hast/lib/index").Handler'.
      Types of parameters 'h' and 'h' are incompatible.
        Type 'import("<project_root>/node_modules/mdast-util-to-hast/lib/index").H' is not assignable to type 'import("<project_root>/node_modules/mdast-util-definition-list/node_modules/mdast-util-to-hast/lib/index").H'.
          Type 'H' is not assignable to type 'HFields'.
            Types of property 'handlers' are incompatible.
              Type 'import("<project_root>/node_modules/mdast-util-to-hast/lib/index").Handlers' is not assignable to type 'import("<project_root>/node_modules/mdast-util-definition-list/node_modules/mdast-util-to-hast/lib/index").Handlers'.
                'string' index signatures are incompatible.
                  Type 'import("<project_root>/node_modules/mdast-util-to-hast/lib/index").Handler' is not assignable to type 'import("<project_root>/node_modules/mdast-util-definition-list/node_modules/mdast-util-to-hast/lib/index").Handler'.
                    Types of parameters 'h' and 'h' are incompatible.
                      Type 'import("<project_root>/node_modules/mdast-util-definition-list/node_modules/mdast-util-to-hast/lib/index").H' is not assignable to type 'import("<project_root>/node_modules/mdast-util-to-hast/lib/index").H'.
                        Type 'H' is not assignable to type 'HFields'.ts(2322)

If I'm understanding this correctly, it looks like mdast-util-definition-list needs to reference a newer version of mdast-util-to-hast?

[justinh-kairos]

Update: It seems that this is because I have a definition list embedded in a blockquote element, like this:

> ## Title
> 
> Term 1
> : Definition 1
> Term 2
> : Definition 2a
> : Definition 2b

There's a console error being logged: Uncaught AssertionError [ERR_ASSERTION]: expected a chunkFlow found Which seems to be coming from micromark-extension-definition-list.

[justinh-kairos]

Closing since this issue was moved to the appropriate project.