Why rehype-react no longer supported React Fragment types? Options needs comment out // @ts-expect-error: the react types are missing.

[wimpykid719]

I'm new using this kind of this library and I installed My next.js app router project try to use.
But I got this type error when I use without comment out // @ts-expect-error: the react types are missing.

This error will happen in rehype-react version 8.0.0.
But Doesn't happen in rehype-react version 7.1.2.
I can't understand Why is it no longer supported React Fragment types?

Argument of type '[{ Fragment: ExoticComponent<{ children?: ReactNode; }>; components: { a: FC<AnchorHTMLAttributes<HTMLAnchorElement>>; img: FC<...>; }; createElement: { ...; }; }]' is not assignable to parameter of type '[boolean] | [Options]'.
  Type '[{ Fragment: ExoticComponent<{ children?: ReactNode; }>; components: { a: FC<AnchorHTMLAttributes<HTMLAnchorElement>>; img: FC<...>; }; createElement: { ...; }; }]' is not assignable to type '[boolean]'.
    Type '{ Fragment: ExoticComponent<{ children?: ReactNode; }>; components: { a: FC<AnchorHTMLAttributes<HTMLAnchorElement>>; img: FC<...>; }; createElement: { ...; }; }' is not assignable to type 'boolean'.ts(2345)

this is my code

import { Fragment, createElement, ReactElement } from "react";
import rehypeRaw from "rehype-raw";
import rehypeReact from "rehype-react";
import { remark } from "remark";
import remarkBreaks from "remark-breaks";
import remarkGfm from "remark-gfm";
import remarkRehype from "remark-rehype";

import CustomImage from "components/CustomImage";
import CustomLink from "components/CustomLink";

export const markdownToReactElement = (markdownContent: string): ReactElement => {
  return remark()
    .use(remarkGfm)
    .use(remarkBreaks)
    .use(remarkRehype, {
      allowDangerousHtml: true,
    })
    .use(rehypeRaw)
    .use(rehypeReact, {
      Fragment,
      components: {
        a: CustomLink,
        img: CustomImage,
      },
      createElement,
    })
    .processSync(markdownContent).result;
};

[wooorm]

When upgrading, please see the changelog: https://github.com/rehypejs/rehype-react/releases/tag/8.0.0.

The reason: because it uses the automatic JSX runtime now

[wimpykid719]

The reason: because it uses the automatic JSX runtime now

Is this for support another framework??

[wooorm]

Yes, it is so that all jsx frameworks are supported!