mdx icon indicating copy to clipboard operation
mdx copied to clipboard

React 19 types compatibility

Open snowystinger opened this issue 1 year ago • 5 comments

Initial checklist

Problem

React has removed the JSX global namespace in React 19, as a result, it needs to be accessed via the React global namespace now React.JSX.

node_modules/@mdx-js/react/lib/index.d.ts:29:85 - error TS2503: Cannot find namespace 'JSX'.

29 export function MDXProvider({ components, children, disableParentContext }: Props): JSX.Element;

Solution

Update references to JSX

Follow https://github.com/DefinitelyTyped/DefinitelyTyped/pull/69022 for how to install the pre-release of the types and if you can, use the codemod

Alternatives

I don't think there's an alternative here

snowystinger avatar May 30 '24 03:05 snowystinger

See the discussion at https://github.com/DefinitelyTyped/DefinitelyTyped/pull/69142 In particular https://github.com/DefinitelyTyped/DefinitelyTyped/pull/69142#issuecomment-2037677573 and https://github.com/DefinitelyTyped/DefinitelyTyped/pull/69142#issuecomment-2049931211

ChristianMurphy avatar May 30 '24 03:05 ChristianMurphy

Ah, thanks for the links, I find it hard to keep track of what's happening in definitely typed vs in the actual home of the project

snowystinger avatar May 30 '24 05:05 snowystinger

Seems like there's another discussion thread over here:

  • https://github.com/DefinitelyTyped/DefinitelyTyped/pull/69022#discussion_r1652550623

I asked about it in that thread, but maybe the plans for the global JSX namespace in React 19 types indicate that MDX and related packages should be importing JSX somehow instead of using it as a global namespace.

karlhorky avatar Jun 25 '24 11:06 karlhorky

You need to do the same you're already doing for Preact and other libraries using JSX. Considering how you test types with other libraries, I'd assume you want something like DefinitelyTyped/DefinitelyTyped@ca06234 (#69142)

eps1lon avatar Jun 25 '24 11:06 eps1lon

Inlining what I believe Sebastian links to:

Users can support ~the unreleased version of~ React 19’s types by defining the JSX namespace that they remove:

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
  }
}

wooorm avatar Oct 11 '24 15:10 wooorm

I believe this no longer appears; the code in the OP is no longer there:

export function MDXProvider(properties: Readonly<Props>): React.ReactElement;

Last local use of JSX was in the docs: https://github.com/mdx-js/mdx/commit/f0d20da86dcc8d78b90daddae7ae8ef1fcb5eacb

wooorm avatar Feb 27 '25 10:02 wooorm

Looks like it's still in the package @types/mdx as of 2.0.13 and there is no 3 release for that library

snowystinger avatar Mar 07 '25 04:03 snowystinger