Merge branch 'main' into @atlj/store-project-metadata

.github/workflows/build-templates.yml

@@ -11,6 +11,9 @@ on:
   pull_request:
     branches:
       - main
+  merge_group:
+    types:
+      - checks_requested
 
 jobs:
   build:
@@ -134,6 +137,15 @@ jobs:
           rm -f example/yarn.lock # Workaround for cached yarn.lock from older version
           yarn install --no-immutable
 
+      - name: Use local version of react-native-builder-bob
+        run: |
+          cd packages/react-native-builder-bob
+          npm pack
+          tgz=$(ls react-native-builder-bob-*.tgz)
+          cd -
+          cd ${{ env.work_dir }}
+          YARN_CHECKSUM_BEHAVIOR=ignore yarn add --dev ../packages/react-native-builder-bob/$tgz
+
       - name: Get build target
         working-directory: ${{ env.work_dir }}
         run: |
@@ -185,6 +197,8 @@ 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 }}
@@ -200,7 +214,7 @@ jobs:
         working-directory: ${{ env.work_dir }}
         if: matrix.language == 'js'
         run: |
-          yarn example expo export:web
+          yarn example expo export --platform web
 
       - name: Install JDK
         if: env.android_build == 1 && env.turbo_cache_hit_android != 1

.github/workflows/check-project.yml

@@ -6,6 +6,9 @@ on:
   pull_request:
     branches:
       - main
+  merge_group:
+    types:
+      - checks_requested
 
 jobs:
   check-project:
@@ -23,5 +26,8 @@ jobs:
       - name: Typecheck
         run: yarn typecheck
 
+      - name: Test
+        run: yarn test
+
       - name: Build packages
         run: yarn lerna run prepare

docs/pages/build.md

@@ -156,7 +156,9 @@ By default, the code is compiled to support last 2 versions of modern browsers.
 
 In addition, the following options are supported:
 
-- `configFile` & `babelrc` (`boolean`): To customize the babel config used, you can pass the [`configFile`](https://babeljs.io/docs/en/options#configfile) option as `true` if you have a `babel.config.js` or [`babelrc`](https://babeljs.io/docs/en/options#babelrc) option if you have a `.babelrc`. This may break the default configuration, so use these options only if you know what you're doing.
+- `configFile` (`boolean` | `string`): To customize the babel config used, you can pass the [`configFile`](https://babeljs.io/docs/en/options#configfile) option as `true` if you have a `babel.config.js` or a path to a custom config file. This will override the default configuration. You can extend the default configuration by using the [`react-native-builder-bob/babel-preset`](https://github.com/callstack/react-native-builder-bob/blob/main/packages/react-native-builder-bob/babel-preset.js) preset.
+
+- `babelrc` (`boolean`): You can set the [`babelrc`](https://babeljs.io/docs/en/options#babelrc) option to `true` to enable using `.babelrc` files.
 
 - `copyFlow` (`boolean`): If your source code is written in [Flow](http://www.typescriptlang.org/), You can specify the `copyFlow` option to copy the source files as `.js.flow` to the output folder. If the `main` entry in `package.json` points to the `index` file in the output folder, the flow type checker will pick these files up to use for type definitions.
 

package.json

@@ -18,6 +18,7 @@
     "lint": "eslint \"**/*.{js,ts,tsx}\"",
     "typecheck": "tsc --noEmit",
     "watch": "concurrently 'yarn typecheck --watch' 'lerna run --parallel prepare -- --watch'",
+    "test": "yarn workspace react-native-builder-bob test",
     "docs": "yarn workspace docs"
   },
   "devDependencies": {
@@ -48,7 +49,8 @@
     "node_modules/",
     "coverage/",
     "lib/",
-    "templates/"
+    "templates/",
+    "__fixtures__/"
   ],
   "prettier": {
     "singleQuote": true,

packages/create-react-native-library/src/utils/generateExampleApp.ts

@@ -38,15 +38,11 @@ const PACKAGES_TO_ADD_DEV = {
 };
 
 const PACKAGES_TO_ADD_WEB = {
+  '@expo/metro-runtime': '~3.2.1',
   'react-dom': '18.2.0',
   'react-native-web': '~0.18.10',
 };
 
-const PACKAGES_TO_ADD_WEB_DEV = {
-  '@expo/webpack-config': '^18.0.1',
-  'babel-loader': '^8.1.0',
-};
-
 export default async function generateExampleApp({
   type,
   dest,
@@ -67,7 +63,7 @@ export default async function generateExampleApp({
     type === 'native'
       ? // `npx react-native init <projectName> --directory example --skip-install`
         [
-          'react-native@latest',
+          `react-native@${reactNativeVersion}`,
           'init',
           `${projectName}Example`,
           '--directory',
@@ -113,8 +109,8 @@ export default async function generateExampleApp({
 
   const SCRIPTS_TO_ADD = {
     'build:android':
-      'cd android && ./gradlew assembleDebug --no-daemon --console=plain -PreactNativeArchitectures=arm64-v8a',
-    'build:ios': `cd ios && xcodebuild -workspace ${projectName}Example.xcworkspace -scheme ${projectName}Example -configuration Debug -sdk iphonesimulator CC=clang CPLUSPLUS=clang++ LD=clang LDPLUSPLUS=clang++ GCC_OPTIMIZATION_LEVEL=0 GCC_PRECOMPILE_PREFIX_HEADER=YES ASSETCATALOG_COMPILER_OPTIMIZATION=time DEBUG_INFORMATION_FORMAT=dwarf COMPILER_INDEX_STORE_ENABLE=NO`,
+      'react-native build-android --extra-params "--no-daemon --console=plain -PreactNativeArchitectures=arm64-v8a"',
+    'build:ios': `react-native build-ios --scheme ${projectName}Example --mode Debug --extra-params "-sdk iphonesimulator CC=clang CPLUSPLUS=clang++ LD=clang LDPLUSPLUS=clang++ GCC_OPTIMIZATION_LEVEL=0 GCC_PRECOMPILE_PREFIX_HEADER=YES ASSETCATALOG_COMPILER_OPTIMIZATION=time DEBUG_INFORMATION_FORMAT=dwarf COMPILER_INDEX_STORE_ENABLE=NO"`,
   };
 
   if (type === 'native') {
@@ -161,10 +157,6 @@ export default async function generateExampleApp({
       dependencies[name] = bundledNativeModules[name] || version;
     });
 
-    Object.entries(PACKAGES_TO_ADD_WEB_DEV).forEach(([name, version]) => {
-      devDependencies[name] = bundledNativeModules[name] || version;
-    });
-
     scripts.web = 'expo start --web';
   }
 

packages/create-react-native-library/templates/common/$.github/workflows/ci.yml

@@ -6,6 +6,9 @@ on:
   pull_request:
     branches:
       - main
+  merge_group:
+    types:
+      - checks_requested
 
 jobs:
   lint:
@@ -165,5 +168,5 @@ jobs:
 
       - name: Build example for Web
         run: |
-          yarn example expo export:web
+          yarn example expo export --platform web
 <% } -%>

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

@@ -0,0 +1,35 @@
+/* eslint-disable import/no-commonjs */
+
+const browserslist = require('browserslist');
+
+module.exports = function (api, options, cwd) {
+  return {
+    presets: [
+      [
+        require.resolve('@babel/preset-env'),
+        {
+          targets: browserslist.findConfig(cwd) || {
+            browsers: [
+              '>1%',
+              'last 2 chrome versions',
+              'last 2 edge versions',
+              'last 2 firefox versions',
+              'last 2 safari versions',
+              'not dead',
+              'not ie <= 11',
+              'not op_mini all',
+              'not android <= 4.4',
+              'not samsung <= 4',
+            ],
+            node: '18',
+          },
+          useBuiltIns: false,
+          modules: options.modules || false,
+        },
+      ],
+      require.resolve('@babel/preset-react'),
+      require.resolve('@babel/preset-typescript'),
+      require.resolve('@babel/preset-flow'),
+    ],
+  };
+};

packages/react-native-builder-bob/package.json

@@ -23,7 +23,8 @@
   },
   "files": [
     "bin",
-    "lib"
+    "lib",
+    "babel-preset.js"
   ],
   "engines": {
     "node": ">= 18.0.0"
@@ -33,7 +34,13 @@
     "registry": "https://registry.npmjs.org/"
   },
   "scripts": {
-    "prepare": "babel --extensions .ts,.tsx src --out-dir lib --source-maps --delete-dir-on-start"
+    "prepare": "babel --extensions .ts,.tsx src --out-dir lib --source-maps --delete-dir-on-start",
+    "test": "jest"
+  },
+  "jest": {
+    "testPathIgnorePatterns": [
+      "/lib/"
+    ]
   },
   "dependencies": {
     "@babel/core": "^7.18.5",
@@ -58,6 +65,7 @@
   },
   "devDependencies": {
     "@babel/cli": "^7.17.10",
+    "@jest/globals": "^29.7.0",
     "@types/babel__core": "^7.1.19",
     "@types/browserslist": "^4.15.0",
     "@types/cross-spawn": "^6.0.2",
@@ -69,6 +77,7 @@
     "@types/prompts": "^2.0.14",
     "@types/which": "^2.0.1",
     "@types/yargs": "^17.0.10",
-    "concurrently": "^7.2.2"
+    "concurrently": "^7.2.2",
+    "jest": "^29.7.0"
   }
 }

packages/react-native-builder-bob/src/__fixtures__/project/code/$alias-input.ts

@@ -0,0 +1,7 @@
+import "@";
+import f from "@/f";
+import "@something";
+import "./@";
+import "file";
+import { something } from "something";
+import "something/somefile";

packages/react-native-builder-bob/src/__fixtures__/project/code/$alias-output.ts

@@ -0,0 +1,7 @@
+import "..";
+import f from "../f";
+import "@something";
+import "./@";
+import "../f";
+import { something } from "another";
+import "another/somefile";

packages/react-native-builder-bob/src/__fixtures__/project/code/$exports-input.ts

@@ -0,0 +1,20 @@
+export * as a from "a";
+export * as b from "./b";
+export * as c from "./c";
+export * as d from "./d";
+export * as e from "./e.story";
+export * as f from "../f";
+export * as pac from "..";
+export * as pak from "../";
+export * as pax from "../index";
+
+export { a as a1 } from "./a";
+export * from "./b";
+
+export type { A } from "./a";
+
+export const foo = "foo";
+
+const bar = "bar";
+
+export { bar };

packages/react-native-builder-bob/src/__fixtures__/project/code/$exports-output.ts

@@ -0,0 +1,15 @@
+export * as a from "a";
+export * as b from "./b.mjs";
+export * as c from "./c.mjs";
+export * as d from "./d";
+export * as e from "./e.story.mjs";
+export * as f from "../f.mjs";
+export * as pac from "../index.mjs";
+export * as pak from "../index.mjs";
+export * as pax from "../index.mjs";
+export { a as a1 } from "./a.mjs";
+export * from "./b.mjs";
+export type { A } from "./a";
+export const foo = "foo";
+const bar = "bar";
+export { bar };

packages/react-native-builder-bob/src/__fixtures__/project/code/$imports-input.ts

@@ -0,0 +1,16 @@
+import "./a";
+import a from "a";
+import b from "./b";
+import c from "./c";
+import d from "./d";
+import e from "./e.story";
+import f from "../f";
+import pac from "..";
+import pak from "../";
+import pax from "../index";
+
+import { a as a1 } from "./a";
+import * as b1 from "./b";
+import something, { c as c1 } from "./c";
+
+import type { A } from "./a";

packages/react-native-builder-bob/src/__fixtures__/project/code/$imports-output.ts

@@ -0,0 +1,14 @@
+import "./a.mjs";
+import a from "a";
+import b from "./b.mjs";
+import c from "./c.mjs";
+import d from "./d";
+import e from "./e.story.mjs";
+import f from "../f.mjs";
+import pac from "../index.mjs";
+import pak from "../index.mjs";
+import pax from "../index.mjs";
+import { a as a1 } from "./a.mjs";
+import * as b1 from "./b.mjs";
+import something, { c as c1 } from "./c.mjs";
+import type { A } from "./a";