fix: migrate to babel-plugin-syntax-hermes-parser (#822)

### Summary

Fixes compatibility of `react-native-builder-bob/babel-preset` with
React Native versions `>= 0.76.0` — likely broken today, without user
config modifications.

- `@babel/preset-flow` is
[discontinued](babel/babel#16264). The Flow
language has since evolved (e.g. `as` syntax) and newer `react-native`
versions can no longer be parsed.
- This is succeeded by
[babel-plugin-syntax-hermes-parser](https://github.com/facebook/hermes/tree/main/tools/hermes-parser/js/babel-plugin-syntax-hermes-parser).

Context:

- facebook/react-native#50683 (comment)

Co-authored-by: Satyajit Sahoo <[email protected]>

Author: huntie

packages/create-react-native-library/templates/common/babel.config.js

@@ -1,6 +1,9 @@
 module.exports = {
-  presets: ['module:react-native-builder-bob/babel-preset'],
   overrides: [
+    {
+      exclude: /\/node_modules\//,
+      presets: ['module:react-native-builder-bob/babel-preset'],
+    },
     {
       include: /\/node_modules\//,
       presets: ['module:@react-native/babel-preset'],

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

@@ -50,10 +50,14 @@ module.exports = function (api, options, cwd) {
         },
       ],
       require.resolve('@babel/preset-typescript'),
-      require.resolve('@babel/preset-flow'),
     ],
     plugins: [
       require.resolve('@babel/plugin-transform-strict-mode'),
+      [
+        require.resolve('babel-plugin-syntax-hermes-parser'),
+        { parseLangTypes: 'flow' },
+      ],
+      require.resolve('@babel/plugin-transform-flow-strip-types'),
       [
         require.resolve('./lib/babel'),
         {

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

@@ -46,13 +46,14 @@
   },
   "dependencies": {
     "@babel/core": "^7.25.2",
+    "@babel/plugin-transform-flow-strip-types": "^7.26.5",
     "@babel/plugin-transform-strict-mode": "^7.24.7",
     "@babel/preset-env": "^7.25.2",
-    "@babel/preset-flow": "^7.24.7",
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
     "arktype": "^2.1.15",
     "babel-plugin-module-resolver": "^5.0.2",
+    "babel-plugin-syntax-hermes-parser": "^0.28.0",
     "browserslist": "^4.20.4",
     "cross-spawn": "^7.0.3",
     "dedent": "^0.7.0",

yarn.lock

@@ -244,6 +244,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-plugin-utils@npm:^7.25.9, @babel/helper-plugin-utils@npm:^7.26.5":
+  version: 7.26.5
+  resolution: "@babel/helper-plugin-utils@npm:7.26.5"
+  checksum: 4771fbb1711c624c62d12deabc2ed7435a6e6994b6ce09d5ede1bc1bf19be59c3775461a1e693bdd596af865685e87bb2abc778f62ceadc1b2095a8e2aa74180
+  languageName: node
+  linkType: hard
+
 "@babel/helper-remap-async-to-generator@npm:^7.24.7, @babel/helper-remap-async-to-generator@npm:^7.25.0":
   version: 7.25.0
   resolution: "@babel/helper-remap-async-to-generator@npm:7.25.0"
@@ -487,14 +494,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/plugin-syntax-flow@npm:^7.24.7":
-  version: 7.24.7
-  resolution: "@babel/plugin-syntax-flow@npm:7.24.7"
+"@babel/plugin-syntax-flow@npm:^7.26.0":
+  version: 7.26.0
+  resolution: "@babel/plugin-syntax-flow@npm:7.26.0"
   dependencies:
-    "@babel/helper-plugin-utils": ^7.24.7
+    "@babel/helper-plugin-utils": ^7.25.9
   peerDependencies:
     "@babel/core": ^7.0.0-0
-  checksum: 43b78b5fcdedb2a6d80c3d02a1a564fbfde86b73b442d616a8f318f673caa6ce0151513af5a00fcae42a512f144e70ef259d368b9537ee35d40336a6c895a7d4
+  checksum: fdc0d0a7b512e00d933e12cf93c785ea4645a193f4b539230b7601cfaa8c704410199318ce9ea14e5fca7d13e9027822f7d81a7871d3e854df26b6af04cc3c6c
   languageName: node
   linkType: hard
 
@@ -859,15 +866,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/plugin-transform-flow-strip-types@npm:^7.24.7":
-  version: 7.25.2
-  resolution: "@babel/plugin-transform-flow-strip-types@npm:7.25.2"
+"@babel/plugin-transform-flow-strip-types@npm:^7.26.5":
+  version: 7.26.5
+  resolution: "@babel/plugin-transform-flow-strip-types@npm:7.26.5"
   dependencies:
-    "@babel/helper-plugin-utils": ^7.24.8
-    "@babel/plugin-syntax-flow": ^7.24.7
+    "@babel/helper-plugin-utils": ^7.26.5
+    "@babel/plugin-syntax-flow": ^7.26.0
   peerDependencies:
     "@babel/core": ^7.0.0-0
-  checksum: 9f7b96cbd374077eaf04b59e468976d2e89ec353807d7ac28f129f686945447df92aeb5b60acf906f3ec0f9ebef5d9f88735c7aa39af97033a6ab96c79c9a909
+  checksum: a15ae76aea55f1801a5c8ebdfdd0e4616f256ca1eeb504b0781120242aae5a2174439a084bacd2b9e3e83d2a8463cf10c2a8c9f0f0504ded21144297c2b4a380
   languageName: node
   linkType: hard
 
@@ -1433,19 +1440,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/preset-flow@npm:^7.24.7":
-  version: 7.24.7
-  resolution: "@babel/preset-flow@npm:7.24.7"
-  dependencies:
-    "@babel/helper-plugin-utils": ^7.24.7
-    "@babel/helper-validator-option": ^7.24.7
-    "@babel/plugin-transform-flow-strip-types": ^7.24.7
-  peerDependencies:
-    "@babel/core": ^7.0.0-0
-  checksum: 4caca02a6e0a477eb22994d686a1fbf65b5ab0240ae77530696434dba7efff4c5dcbf9186a774168dd4c492423141a22af3f2874c356aa22429f3c83eaf34419
-  languageName: node
-  linkType: hard
-
 "@babel/preset-modules@npm:0.1.6-no-external-plugins":
   version: 0.1.6-no-external-plugins
   resolution: "@babel/preset-modules@npm:0.1.6-no-external-plugins"
@@ -4616,6 +4610,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"babel-plugin-syntax-hermes-parser@npm:^0.28.0":
+  version: 0.28.0
+  resolution: "babel-plugin-syntax-hermes-parser@npm:0.28.0"
+  dependencies:
+    hermes-parser: 0.28.0
+  checksum: 62d16a422f935d2a313fc64a9258cea07974cf97d66fce888bc58c044bbfa84ef891ae7dff7cddd3b891f81936534d29df087040f1e8447d6d60668c5e449f50
+  languageName: node
+  linkType: hard
+
 "babel-preset-current-node-syntax@npm:^1.0.0":
   version: 1.0.1
   resolution: "babel-preset-current-node-syntax@npm:1.0.1"
@@ -8121,6 +8124,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"hermes-estree@npm:0.28.0":
+  version: 0.28.0
+  resolution: "hermes-estree@npm:0.28.0"
+  checksum: d4cf9dd2b718bb0ac0681b015befb96c9a3d3709735ebb5e191bbca559cae06215fac37949cb67e3e8d2dd1af829779d2bfe389763759416dac28129b2462ffe
+  languageName: node
+  linkType: hard
+
 "hermes-parser@npm:0.20.1":
   version: 0.20.1
   resolution: "hermes-parser@npm:0.20.1"
@@ -8130,6 +8140,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"hermes-parser@npm:0.28.0":
+  version: 0.28.0
+  resolution: "hermes-parser@npm:0.28.0"
+  dependencies:
+    hermes-estree: 0.28.0
+  checksum: 42aa969f4afb29bb76f0df44f7a672c0ce67814e639882091e1c94f579f2e158dcb761885080c66af89287845073f8a115e72a143bc28e5f6ab9814397524930
+  languageName: node
+  linkType: hard
+
 "hosted-git-info@npm:^2.1.4":
   version: 2.8.9
   resolution: "hosted-git-info@npm:2.8.9"
@@ -12731,9 +12750,9 @@ __metadata:
   dependencies:
     "@babel/cli": ^7.24.8
     "@babel/core": ^7.25.2
+    "@babel/plugin-transform-flow-strip-types": ^7.26.5
     "@babel/plugin-transform-strict-mode": ^7.24.7
     "@babel/preset-env": ^7.25.2
-    "@babel/preset-flow": ^7.24.7
     "@babel/preset-react": ^7.24.7
     "@babel/preset-typescript": ^7.24.7
     "@jest/globals": ^29.7.0
@@ -12751,6 +12770,7 @@ __metadata:
     "@types/yargs": ^17.0.10
     arktype: ^2.1.15
     babel-plugin-module-resolver: ^5.0.2
+    babel-plugin-syntax-hermes-parser: ^0.28.0
     browserslist: ^4.20.4
     concurrently: ^7.2.2
     cross-spawn: ^7.0.3