fix(sandpack-react): use automatic runtime for jsx (#738)

Author: jeetiss

sandpack-react/babel.config.js

@@ -1,7 +1,7 @@
 module.exports = {
   presets: [
     ["@babel/preset-env", { targets: { node: "current" } }],
-    "@babel/preset-react",
+    ["@babel/preset-react", { runtime: "automatic" }],
     "@babel/preset-typescript",
   ],
 };

sandpack-react/rollup.config.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
 const commonjs = require("@rollup/plugin-commonjs");
 const typescript = require("@rollup/plugin-typescript");
 const replace = require("rollup-plugin-replace");
@@ -28,6 +29,7 @@ const configBase = {
     commonjs({ requireReturnsDefault: "preferred" }),
   ],
   external: [
+    'react/jsx-runtime',
     ...Object.keys(pkg.dependencies),
     ...Object.keys(pkg.devDependencies),
     ...Object.keys(pkg.peerDependencies),

sandpack-react/tsconfig.json

@@ -9,7 +9,7 @@
     "experimentalDecorators": true,
     "emitDecoratorMetadata": true,
     "noImplicitAny": true,
-    "jsx": "react",
+    "jsx": "react-jsx",
     "outDir": "dist/types",
     "skipLibCheck": true
   },