feat: switch to new jsx runtime

Author: satya164

.github/workflows/build-templates.yml

@@ -200,8 +200,6 @@ jobs:
  working-directory: ${{ env.work_dir }}
  run: |
  yarn typecheck
- # FIXME: Remove this once we fix the typecheck errors
- continue-on-error: true
 
  - name: Test library
  working-directory: ${{ env.work_dir }}

packages/create-react-native-library/templates/common-example/example/src/App.tsx

@@ -1,9 +1,10 @@
-import * as React from 'react';
-
 <% if (project.view) { -%>
 import { StyleSheet, View } from 'react-native';
 import { <%- project.name -%>View } from '<%- project.slug -%>';
 <% } else { -%>
+<% if (project.arch !== 'new') { -%>
+import { useState, useEffect } from 'react';
+<% } -%>
 import { StyleSheet, View, Text } from 'react-native';
 import { multiply } from '<%- project.slug -%>';
 <% } -%>
@@ -28,9 +29,9 @@ export default function App() {
 }
 <% } else { -%>
 export default function App() {
- const [result, setResult] = React.useState<number | undefined>();
+ const [result, setResult] = useState<number | undefined>();
 
- React.useEffect(() => {
+ useEffect(() => {
  multiply(3, 7).then(setResult);
  }, []);
 

packages/create-react-native-library/templates/common/$package.json

@@ -129,6 +129,7 @@
  "prettier"
  ],
  "rules": {
+ "react/react-in-jsx-scope": "off",
  "prettier/prettier": [
  "error",
  {

packages/create-react-native-library/templates/common/tsconfig.json

@@ -8,7 +8,7 @@
  "allowUnusedLabels": false,
  "esModuleInterop": true,
  "forceConsistentCasingInFileNames": true,
- "jsx": "react",
+ "jsx": "react-jsx",
  "lib": ["esnext"],
  "module": "esnext",
  "moduleResolution": "node",

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

@@ -27,7 +27,12 @@ module.exports = function (api, options, cwd) {
  modules: options.modules || false,
  },
  ],
- require.resolve('@babel/preset-react'),
+ [
+ require.resolve('@babel/preset-react'),
+ {
+ runtime: 'automatic',
+ },
+ ],
  require.resolve('@babel/preset-typescript'),
  require.resolve('@babel/preset-flow'),
  ],

packages/react-native-builder-bob/src/index.ts

@@ -179,7 +179,7 @@ yargs
  allowUnusedLabels: false,
  esModuleInterop: true,
  forceConsistentCasingInFileNames: true,
- jsx: 'react',
+ jsx: 'react-jsx',
  lib: ['esnext'],
  module: 'esnext',
  moduleResolution: 'node',

tsconfig.json

@@ -12,7 +12,7 @@
  "allowUnusedLabels": false,
  "esModuleInterop": true,
  "forceConsistentCasingInFileNames": true,
- "jsx": "react",
+ "jsx": "react-jsx",
  "lib": ["esnext", "dom"],
  "module": "esnext",
  "moduleResolution": "node",