feat: allow to specify JSX Runtime for @babel/preset-react` (#695)

<!-- Please provide enough information so that others can review your pull request. --> <!-- Keep pull requests small and focused on a single change. --> ### Summary In 0595213 the JSX runtime was changed to `automatic` without the option for the user to opt back in for `classic`. The `classic` runtime is needed for NativeWind library, which is dependent on Reanimated. Fixes - software-mansion/react-native-reanimated#6665 - #678 ### Test plan 🚀 --------- Co-authored-by: Satyajit Sahoo <satyajit.happy@gmail.com>

Author: tjzel

docs/pages/build.md

@@ -238,6 +238,10 @@ Example:
 ["module", { "esm": true, "sourceMaps": false }]
 ```
 
+##### `jsxRuntime`
+
+Explicitly set your [runtime](https://babeljs.io/docs/babel-preset-react#runtime). Defaults to `automatic`.
+
 #### `typescript`
 
 Enable generating type definitions with `tsc` if your source code is written in [TypeScript](http://www.typescriptlang.org/).

packages/react-native-builder-bob/babel-preset.js

@@ -6,6 +6,7 @@ const browserslist = require('browserslist');
  * Babel preset for React Native Builder Bob
  * @param {'commonjs' | 'preserve'} options.modules - Whether to compile modules to CommonJS or preserve them
  * @param {Boolean} options.esm - Whether to output ES module compatible code, e.g. by adding extension to import/export statements
+ * @param {'automatic' | 'classic'} options.jsxRuntime - Which JSX runtime to use, defaults to 'automatic'
  */
 module.exports = function (api, options, cwd) {
  const cjs = options.modules === 'commonjs';
@@ -37,7 +38,8 @@ module.exports = function (api, options, cwd) {
  [
  require.resolve('@babel/preset-react'),
  {
- runtime: 'automatic',
+ runtime:
+ options.jsxRuntime !== undefined ? options.jsxRuntime : 'automatic',
  },
  ],
  require.resolve('@babel/preset-typescript'),

packages/react-native-builder-bob/src/utils/compile.ts

@@ -13,6 +13,7 @@ type Options = Input & {
  copyFlow?: boolean;
  modules: 'commonjs' | 'preserve';
  exclude: string;
+ jsxRuntime?: 'automatic' | 'classic';
 };
 
 const sourceExt = /\.([cm])?[jt]sx?$/;
@@ -29,6 +30,7 @@ export default async function compile({
  copyFlow,
  sourceMaps = true,
  report,
+ jsxRuntime = 'automatic',
 }: Options) {
  const files = glob.sync('**/*', {
  cwd: source,
@@ -113,6 +115,7 @@ export default async function compile({
  // If a file is explicitly marked as ESM, then preserve the syntax
  /\.m[jt]s$/.test(filepath) ? 'preserve' : modules,
  esm,
+ jsxRuntime,
  },
  ],
  ],