Support unified 10, remark 14, rehype 12, and rehype-raw 6

[micartey]

Problem

In your Appendix A: HTML in markdown it was mentioned to use rehype-raw as a property of ReactMarkdown. However, 4 days ago, rehype-raw published a new 'big' release (version 6.0.0) which breaks the support for rendering HTML in markdown.

Solution

So far, the only possibility is to stay on version 5.1.0 or ignore HTML completely.

Alternatives

/

[ChristianMurphy]

Thanks for reaching out @Clientastisch!
Unified and remark are midway through a major update unifiedjs/unified#121 with updates going out to all 300+ repositories.
It's getting close to being done, the rest of remark, including react-markdown should be updated within the next couple weeks.
In the meantime, version 5 of rehype-raw will continue working until this repo is updated.

[wooorm]

The new major of rehype raw most likely works seemlesly with the current version of this project. It only switched to esm!

[DanOnCall]

The new major of rehype raw most likely works seemlesly with the current version of this project. It only switched to esm!

The only problem I just had when using rehype-raw@6.0.0 is related to TypeScript:

<ReactMarkdown
    rehypePlugins={[rehypeRaw]}
    children={content}
    components={customMarkdownComponents}
/>

TS2322: Type '(options?: void | Options | undefined) => void | Transformer<Root, Root>' is not assignable to type 'Pluggable<any[], Settings>'.
Type '(options?: void | Options | undefined) => void | Transformer<Root, Root>' is not assignable to type 'Plugin<any[], Settings>'.
Type 'void | Transformer<Root, Root>' is not assignable to type 'void | Transformer'.
Type 'Transformer<Root, Root>' is not assignable to type 'void | Transformer'.
        Type 'Transformer<Root, Root>' is not assignable to type 'Transformer'.
          Types of parameters 'node' and 'node' are incompatible.
            Property 'children' is missing in type 'Node' but required in type 'Root'.
            
The HTML on the Markdown file does get converted. I am using rehype-raw@5.1.0 as outlined in a previous answer to avoid this error on the meantime.

[ceisele-r]

The same applies to remark-breaks v3, it currently breaks a Typescript build with react-markdown:

node_modules/remark-breaks/index.d.ts:8:5 - error TS2315: Type 'Transformer' is not generic.

8   | import('unified').Transformer<import('mdast').Root, import('mdast').Root>

The reason seems to be that react-markdown 6 declares unified 9 as dependency but remark-breaks 3 requires unified 10.

[wooorm]

@ceisele-r You can work around it for now like so: rehypejs/rehype#63.
It’ll be updated soon!

[ceisele-r]

@wooorm thanks for the info but I don't know where to put the @ts-expect-error as the compile error occurs in node_modules/remark-breaks/index.d.ts.
As it's not a call in "our" code, how would we be able to place a @ts-expect-error?

[wooorm]

I’ve added unified as a direct dependency to remark-breaks, which should change that error into one in your code base: https://github.com/remarkjs/remark-breaks/releases/tag/3.0.1.

I personally use skipLibCheck so I don’t see such errors.