Add support for React 19 #879

remcohaszing · 2024-12-20T15:45:32Z

Initial checklist

I read the support docs
I read the contributing guide
I agree to follow the code of conduct
I searched issues and discussions and couldn’t find anything or linked relevant results below
I made sure the docs are up to date
I included tests (or that’s not needed)

Description of changes

This adds support for React 19 types, by removing the dependency on the types provided by hast-util-to-jsx-runtime, thus removing the dependency on the JSX global namespace.

Unfortunately the current setup doesn’t really allow testing the types against multiple React versions. #838 would enable that.

Closes #877

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

Comments suppressed due to low confidence (1)

index.js:4

[nitpick] The re-addition of the ExtraProps typedef seems redundant and could be confusing. Consider removing it if not necessary.

* @typedef {import('./lib/index.js').ExtraProps} ExtraProps

ChristianMurphy

LGTM, thanks @remcohaszing

ChristianMurphy · 2024-12-20T18:11:22Z

lib/index.js

+    // @ts-expect-error
+    // React components are allowed to return numbers,
+    // but not according to the types in hast-util-to-jsx-runtime


Is this related to syntax-tree/hast-util-to-jsx-runtime#6 ?

Somewhat yes. But also apparently hast-util-to-jsx-runtime doesn’t support JSX.ElementType, which JSX runtimes may optionally define. That adds another complexity on top of that issue.

Would be nice to solve such things instead of ts-expect-error

I agree, but that issue has been proven hard to resolve upstream. (If it can be resolved upstream at all.) This @ts-expect-error is internal anyway, and this change unblocks a lot of users.

bluepeter · 2024-12-26T12:43:46Z

Let's make this happen!

wooorm · 2025-01-01T12:20:37Z

Why does Copilot review things?

wooorm · 2025-01-01T12:26:24Z

lib/index.js

+/**
+ * @typedef {{
+ *   [Key in Extract<ElementType, string>]?: ElementType<ComponentProps<Key> & ExtraProps>
+ * }} Components
 *   Map tag names to components.


I believe this type is not equivalent to the previous Components.
But this is listed as a patch.
Is it intentional that you remove keyof JSX.IntrinsicElements?

ElementType includes JSX.IntrinsicElements.

@remcohaszing No, I mean keyof? Does this allow b: 'i'. I assume not, because i or all other element names are not related to props?

It does! And there’s also a pre-existing test which covers this.

Weird, I do not see it in the source

react-markdown/test.jsx

Line 523 in 27d3949

renderToStaticMarkup(<Markdown children="# a" components={{h1: 'h2'}} />),

right no that, I meant in the @types/react code

It feels like it could be a bug that @types/react supports this today — that they could remove it somewhere in the future

not sure where it happens but when I change that line to h1: 'x-y' we get a type error — which indicates that I should worry less because it is type checked — even though the types should likely allow custom elements like that.

lib/index.js

wooorm · 2025-01-01T12:31:04Z

lib/index.js

+    // @ts-expect-error
+    // React components are allowed to return numbers,
+    // but not according to the types in hast-util-to-jsx-runtime


Would be nice to solve such things instead of ts-expect-error

ChristianMurphy · 2025-01-01T14:40:15Z

Why does Copilot review things?

What a very somber and philosophical question 😆
Why do you review things?
Why does anyone do anything?

If you are asking why it appeared on this PR as a reviewer.
It is because I invited it as an additional reviewer to see how it would do.

This adds support for React 19 types, by removing the dependency on the types provided by hast-util-to-jsx-runtime, thus removing the dependency on the JSX global namespace.

wooorm · 2025-01-02T14:28:12Z

If you are asking why it appeared on this PR as a reviewer.
It is because I invited it as an additional reviewer to see how it would do.

And, are you happy with it? 😅

I am emboldened in my view that I am not happy with it 😅

remcohaszing · 2025-01-02T14:33:29Z

I’m fine with @ChristianMurphy wanting to try Copilot reviews, but IMO the result is really pointless, at least in this case.

wooorm · 2025-01-02T14:56:52Z

Of course! Always up for trying things out!

ChristianMurphy · 2025-01-02T20:25:25Z

And, are you happy with it? 😅

It's not perfect, but getting better.

I am emboldened in my view that I am not happy with it 😅

Okay

the result is really pointless, at least in this case.

It was in this case.
It is getting less noisy and nitpicky which is good.
I wish there were a way to specify custom criteria.

cyberluke · 2025-01-06T04:13:16Z

Why not reuse this solution: quantizor/markdown-to-jsx@918b44b#diff-4b76aeed93d86ab1e483e12333e1bae64ccdc1a1e4fd27bec2b32f41db08e6cfR5

and just change:
JSX.IntrinsicAttributes

to
React.JSX.IntrinsicAttributes

in complex-types.ts and complex-types.d.ts?

remcohaszing · 2025-01-06T08:49:27Z

The goal of hast-util-to-jsx-runtime is to support any JSX runtime, not just React.

wooorm · 2025-01-06T10:37:12Z

Released in 9.0.2!

sanskar-19 · 2025-01-06T10:48:08Z

Released in 9.0.2!

@wooorm - Ugh, the type declaration files seems to be missing?

wooorm · 2025-01-06T11:16:24Z

done in 9.0.3!

remcohaszing added 🐛 type/bug This is a problem ☂️ area/types This affects typings 👶 semver/patch This is a backwards-compatible fix 🤞 phase/open Post is being triaged manually labels Dec 20, 2024

ChristianMurphy requested review from Copilot, wooorm and ChristianMurphy December 20, 2024 15:57

Copilot AI reviewed Dec 20, 2024

View reviewed changes

ChristianMurphy approved these changes Dec 20, 2024

View reviewed changes

heimoshuiyu mentioned this pull request Dec 31, 2024

[Bug] Markdown render not working heimoshuiyu/chatgpt-api-web#6

Closed

wooorm reviewed Jan 1, 2025

View reviewed changes

Add support for React 19

ac91753

This adds support for React 19 types, by removing the dependency on the types provided by hast-util-to-jsx-runtime, thus removing the dependency on the JSX global namespace.

remcohaszing force-pushed the react-19 branch from 55f79fe to ac91753 Compare January 2, 2025 11:51

wooorm approved these changes Jan 2, 2025

View reviewed changes

wooorm merged commit b151a90 into main Jan 2, 2025
4 checks passed

wooorm deleted the react-19 branch January 2, 2025 14:59

This comment has been minimized.

Sign in to view

wooorm added the 💪 phase/solved Post is done label Jan 2, 2025

github-actions bot removed the 🤞 phase/open Post is being triaged manually label Jan 2, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add support for React 19 #879

Add support for React 19 #879

remcohaszing commented Dec 20, 2024

ChristianMurphy left a comment

ChristianMurphy Dec 20, 2024

remcohaszing Dec 20, 2024

wooorm Jan 1, 2025

remcohaszing Jan 2, 2025

bluepeter commented Dec 26, 2024

wooorm commented Jan 1, 2025

wooorm Jan 1, 2025

remcohaszing Jan 2, 2025

wooorm Jan 2, 2025 •

edited

Loading

remcohaszing Jan 2, 2025

wooorm Jan 2, 2025

remcohaszing Jan 2, 2025

wooorm Jan 2, 2025

wooorm Jan 2, 2025

wooorm Jan 2, 2025

wooorm Jan 1, 2025

ChristianMurphy commented Jan 1, 2025

wooorm commented Jan 2, 2025

remcohaszing commented Jan 2, 2025

wooorm commented Jan 2, 2025

This comment has been minimized.

ChristianMurphy commented Jan 2, 2025

cyberluke commented Jan 6, 2025

remcohaszing commented Jan 6, 2025

wooorm commented Jan 6, 2025

sanskar-19 commented Jan 6, 2025 •

edited

Loading

wooorm commented Jan 6, 2025

Add support for React 19 #879

Add support for React 19 #879

Conversation

remcohaszing commented Dec 20, 2024

Initial checklist

Description of changes

Choose a reason for hiding this comment

ChristianMurphy left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

bluepeter commented Dec 26, 2024

wooorm commented Jan 1, 2025

Choose a reason for hiding this comment

Choose a reason for hiding this comment

wooorm Jan 2, 2025 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ChristianMurphy commented Jan 1, 2025

wooorm commented Jan 2, 2025

remcohaszing commented Jan 2, 2025

wooorm commented Jan 2, 2025

This comment has been minimized.

ChristianMurphy commented Jan 2, 2025

cyberluke commented Jan 6, 2025

remcohaszing commented Jan 6, 2025

wooorm commented Jan 6, 2025

sanskar-19 commented Jan 6, 2025 • edited Loading

wooorm commented Jan 6, 2025

wooorm Jan 2, 2025 •

edited

Loading

sanskar-19 commented Jan 6, 2025 •

edited

Loading