Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React 19 support #877

Open
prichey opened this issue Dec 18, 2024 · 3 comments · May be fixed by #879
Open

React 19 support #877

prichey opened this issue Dec 18, 2024 · 3 comments · May be fixed by #879
Labels
📦 area/deps This affects dependencies ☂️ area/types This affects typings 👍 phase/yes Post is accepted and can be worked on 🌐 platform/browser This affects browsers 🐢 platform/node This affects Node 🦋 type/enhancement This is great to have 🙆 yes/confirmed This is confirmed and ready to be worked on

Comments

@prichey
Copy link

prichey commented Dec 18, 2024

Followup to #871

react-markdown relies on JSX being in the global namespace, which has been removed in @types/react^19.

Per @ChristianMurphy here:

A new issue would be better, we won't support React 19 RC, only GA.

React 19 is now GA, so this issue is to track.

@github-actions github-actions bot added 👋 phase/new Post is being triaged automatically 🤞 phase/open Post is being triaged manually and removed 👋 phase/new Post is being triaged automatically labels Dec 18, 2024
@ChristianMurphy ChristianMurphy added 📦 area/deps This affects dependencies ☂️ area/types This affects typings 🦋 type/enhancement This is great to have 👍 phase/yes Post is accepted and can be worked on labels Dec 18, 2024
@github-actions github-actions bot removed the 🤞 phase/open Post is being triaged manually label Dec 18, 2024
Copy link

Hi! This was marked as ready to be worked on! Note that while this is ready to be worked on, nothing is said about priority: it may take a while for this to be solved.

Is this something you can and want to work on?

Team: please use the area/* (to describe the scope of the change), platform/* (if this is related to a specific one), and semver/* and type/* labels to annotate this. If this is first-timers friendly, add good first issue and if this could use help, add help wanted.

@ChristianMurphy ChristianMurphy added 🌐 platform/browser This affects browsers 🐢 platform/node This affects Node 🙆 yes/confirmed This is confirmed and ready to be worked on labels Dec 18, 2024
@ChristianMurphy ChristianMurphy pinned this issue Dec 18, 2024
@prichey
Copy link
Author

prichey commented Dec 19, 2024

@wooorm If I upgrade to React 19 in this repo and npm run build, I get the following error:

> [email protected] build
> tsc --build --clean && tsc --build && type-coverage

node_modules/hast-util-to-jsx-runtime/lib/index.d.ts:12:62 - error TS2503: Cannot find namespace 'JSX'.

12 export function toJsxRuntime(tree: Nodes, options: Options): JSX.Element;

In syntax-tree/hast-util-to-jsx-runtime@ae638ba you provide the solution of declaring a global JSX namespace. Would you recommend doing that here?

@0x80
Copy link

0x80 commented Dec 19, 2024

I tried the global JSX namespace suggestion

import type { JSX as Jsx } from "react/jsx-runtime";

declare global {
  namespace JSX {
    type ElementClass = Jsx.ElementClass;
    type Element = Jsx.Element;
    type IntrinsicElements = Jsx.IntrinsicElements;
  }
}

... but it doesn't seem to make a difference for the error I'm getting with React 19:

'ReactMarkdown' cannot be used as a JSX component.
Its type '(options: Readonly) => Element' is not a valid JSX element type.
Type '(options: Readonly) => Element' is not assignable to type '(props: any) => ReactNode | Promise'.
Type 'Element' is not assignable to type 'ReactNode | Promise'.ts(2786)

@remcohaszing remcohaszing linked a pull request Dec 20, 2024 that will close this issue
6 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
📦 area/deps This affects dependencies ☂️ area/types This affects typings 👍 phase/yes Post is accepted and can be worked on 🌐 platform/browser This affects browsers 🐢 platform/node This affects Node 🦋 type/enhancement This is great to have 🙆 yes/confirmed This is confirmed and ready to be worked on
Development

Successfully merging a pull request may close this issue.

3 participants