Incompatible with react-markdown 5.0.3

[villesau]

I'm getting following error:

scheduler.development.js?3069:171 Uncaught Error: Renderer for type `section` not defined or is not renderable
    at astToReact (ast-to-react.js?515f:34)
    at eval (ast-to-react.js?515f:42)
    at Array.map (<anonymous>)
    at resolveChildren (ast-to-react.js?515f:41)
    at astToReact (ast-to-react.js?515f:38)
    at eval (react-markdown.js?22e8:48)
    at Array.forEach (<anonymous>)
    at ReactMarkdown (react-markdown.js?22e8:47)
    at renderWithHooks (react-dom.development.js?61bb:14985)
    at mountIndeterminateComponent (react-dom.development.js?61bb:17811)

when using this with react-markdown 5.0.3. react-markdown should be compatible with remark plugins as that's what it uses under the hood.

[jake-low]

I was able to reproduce this.

I believe you need to provide a renderer for the section node type, like this:

import ReactMarkdown from "react-markdown";
import sectionize from "remark-sectionize";

const md = `
# Hello, world!

This is some top-level content.

## Subsection

This content is part of a second-level section.
`;

const renderers = {
  section: ({ children }) => <section>{children}</section>
};

ReactDOM.render(
  <ReactMarkdown plugins={[sectionize]} renderers={renderers}>{md}</ReactMarkdown>,
  document.body
);

remark-sectionize introduces a new mdast node type called section. I wrote it for use with rehype, which looks for a .data.hName property on the node (which sectionize provides) to determine what HTML element the node should be mapped to (by default, <section>). As far as I can tell, react-markdown works differently and expects custom render functions to be provided for any unfamiliar node types. The developers of react-markdown may be able to tell you more if you have further questions.