[BUG]: React 19 global JSX namespace deprecation

[bagedevimo]

What happened?

As part of the React 19 release they've deprecated the JSX global namespace, in favour of React.JSX.Element. While y'all aren't explicitly using JSX.Element anywhere, it does it appear in the emitted type definition files, specifically:

node_modules/@stripe/react-stripe-js/dist/react-stripe.d.ts:715:79 - error TS2503: Cannot find namespace 'JSX'.

715 declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => JSX.Element;

The "easy" fix for this is to use React 19 in the package.json which shouldn't really cause any changes in your library. I had a little try at this locally and discovered the following diffs - ignoring the crappy one-liner to find all the diffs.

❯ ls -1 dist-before/* | cut -d '/' -f 2 | xargs -I{} bash -c "echo {} && diff dist-before/{} dist/{}"
react-stripe.d.ts
1a2
> import React from "react";
715c716
< declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => JSX.Element;
---
> declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => React.JSX.Element;
react-stripe.esm.d.mts
1a2
> import React from "react";
715c716
< declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => JSX.Element;
---
> declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => React.JSX.Element;
react-stripe.esm.mjs
react-stripe.js
react-stripe.umd.d.ts
1a2
> import React from "react";
715c716
< declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => JSX.Element;
---
> declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => React.JSX.Element;
react-stripe.umd.js
react-stripe.umd.min.d.ts
1a2
> import React from "react";
715c716
< declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => JSX.Element;
---
> declare const EmbeddedCheckout: ({ id, className }: EmbeddedCheckoutProps) => React.JSX.Element;
react-stripe.umd.min.js

However, yarn build now fails due to the script/check-imports script. I'm not 100% sure what the plan with that is, so didn't want to make an pull request without understanding the goal of this script.

Environment

No response

Reproduction

No response

[bagedevimo]

Here's the diff I used to generate the above diffs

❯ git --no-pager diff --no-ext-diff -p
diff --git a/package.json b/package.json
index 01d8843..8ca26d5 100644
--- a/package.json
+++ b/package.json
@@ -74,8 +74,8 @@
     "@testing-library/react": "^13.1.1",
     "@testing-library/react-hooks": "^8.0.0",
     "@types/jest": "^25.1.1",
-    "@types/react": "^18.0.0",
-    "@types/react-dom": "^18.0.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
     "@typescript-eslint/eslint-plugin": "^2.18.0",
     "@typescript-eslint/parser": "^2.18.0",
     "babel-eslint": "^10.0.3",
@@ -104,9 +104,6 @@
     "ts-loader": "^6.2.1",
     "typescript": "^4.1.2"
   },
-  "resolutions": {
-    "@types/react": "18.0.5"
-  },
   "peerDependencies": {
     "@stripe/stripe-js": "^1.44.1 || ^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0",
     "react": ">=16.8.0 <20.0.0",
diff --git a/yarn.lock b/yarn.lock
index 831a00a..7d0b7e0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2662,6 +2662,11 @@
   dependencies:
     "@types/react" "*"

+"@types/react-dom@^19.0.0":
+  version "19.0.3"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-19.0.3.tgz#0804dfd279a165d5a0ad8b53a5b9e65f338050a4"
+  integrity sha512-0Knk+HJiMP/qOZgMyNFamlIjw9OFCsyC2ZbigmEEyXXixgre6IQpm/4V+r3qH4GC1JPvRJKInw+on2rV6YZLeA==
+
 "@types/[email protected]":
   version "11.0.5"
   resolved "https://registry.yarnpkg.com/@types/react-syntax-highlighter/-/react-syntax-highlighter-11.0.5.tgz#0d546261b4021e1f9d85b50401c0a42acb106087"
@@ -2669,7 +2674,7 @@
   dependencies:
     "@types/react" "*"

-"@types/react@*", "@types/[email protected]", "@types/react@^18.0.0":
+"@types/react@*":
   version "18.0.5"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.5.tgz#1a4d4b705ae6af5aed369dec22800b20f89f5301"
   integrity sha512-UPxNGInDCIKlfqBrm8LDXYWNfLHwIdisWcsH5GpMyGjhEDLFgTtlRBaoWuCua9HcyuE0rMkmAeZ3FXV1pYLIYQ==
@@ -2678,6 +2683,13 @@
     "@types/scheduler" "*"
     csstype "^3.0.2"

+"@types/react@^19.0.0":
+  version "19.0.8"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-19.0.8.tgz#7098e6159f2a61e4f4cef2c1223c044a9bec590e"
+  integrity sha512-9P/o1IGdfmQxrujGbIMDyYaaCykhLKc0NGCtYcECNUr9UAaDe4gwvV9bR6tvd5Br1SG0j+PBpbKr2UYY8CwqSw==
+  dependencies:
+    csstype "^3.0.2"
+
 "@types/[email protected]":
   version "1.20.2"
   resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.20.2.tgz#97d26e00cd4a0423b4af620abecf3e6f442b7975"

[GIgako19929]

❯ git --no-pager diff --no-ext-diff -p
diff --git a/package.json b/package.json
index 01d8843..8ca26d5 100644
--- a/package.json
+++ b/package.json
@@ -74,8 +74,8 @@
"@testing-library/react": "^13.1.1",
"@testing-library/react-hooks": "^8.0.0",
"@types/jest": "^25.1.1",

• "@types/react": "^18.0.0",
• "@types/react-dom": "^18.0.0",

• "@types/react": "^19.0.0",
• "@types/react-dom": "^19.0.0",
  "@typescript-eslint/eslint-plugin": "^2.18.0",
  "@typescript-eslint/parser": "^2.18.0",
  "babel-eslint": "^10.0.3",
  @@ -104,9 +104,6 @@
  "ts-loader": "^6.2.1",
  "typescript": "^4.1.2"
  },

• "resolutions": {
• "@types/react": "18.0.5"
• },
  "peerDependencies": {
  "@stripe/stripe-js": "^1.44.1 || ^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0",
  "react": ">=16.8.0 <20.0.0",
  diff --git a/yarn.lock b/yarn.lock
  index 831a00a..7d0b7e0 100644
  --- a/yarn.lock
  +++ b/yarn.lock
  @@ -2662,6 +2662,11 @@
  dependencies:
  "@types/react" "*"

+"@types/react-dom@^19.0.0":

• version "19.0.3"
• resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-19.0.3.tgz#0804dfd279a165d5a0ad8b53a5b9e65f338050a4"
• integrity sha512-0Knk+HJiMP/qOZgMyNFamlIjw9OFCsyC2ZbigmEEyXXixgre6IQpm/4V+r3qH4GC1JPvRJKInw+on2rV6YZLeA==

"@types/[email protected]":
version "11.0.5"
resolved "https://registry.yarnpkg.com/@types/react-syntax-highlighter/-/react-syntax-highlighter-11.0.5.tgz#0d546261b4021e1f9d85b50401c0a42acb106087"
@@ -2669,7 +2674,7 @@
dependencies:
"@types/react" "*"

-"@types/react@", "@types/[email protected]", "@types/react@^18.0.0":
+"@types/react@":
version "18.0.5"
resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.5.tgz#1a4d4b705ae6af5aed369dec22800b20f89f5301"
integrity sha512-UPxNGInDCIKlfqBrm8LDXYWNfLHwIdisWcsH5GpMyGjhEDLFgTtlRBaoWuCua9HcyuE0rMkmAeZ3FXV1pYLIYQ==
@@ -2678,6 +2683,13 @@
"@types/scheduler" "*"
csstype "^3.0.2"

+"@types/react@^19.0.0":

• version "19.0.8"
• resolved "https://registry.yarnpkg.com/@types/react/-/react-19.0.8.tgz#7098e6159f2a61e4f4cef2c1223c044a9bec590e"
• integrity sha512-9P/o1IGdfmQxrujGbIMDyYaaCykhLKc0NGCtYcECNUr9UAaDe4gwvV9bR6tvd5Br1SG0j+PBpbKr2UYY8CwqSw==
• dependencies:
• csstype "^3.0.2"

"@types/[email protected]":
version "1.20.2"
resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.20.2.tgz#97d26e00cd4a0423b4af620abecf3e6f442b7975"

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[bagedevimo]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

I don't think this should be marked stale - its an ongoing issue. Just commenting to count as activity.

[magnetnation]

This is the only library in our project that holds us from upgrading to React 19.
The required change in definitions is minor. Please consider supporting React 19.