[compiler] Dedupe @babel/types

Extracting portions of #32416 for easier review. This PR dedupes @babel/types to resolve to 7.26.3, for compatibility in the root workspace where eslint-plugin-react-hooks resides.

I also needed to update @babel/preset-typescript in snap.

The compiler changes in HIR and ReactiveScopes were needed due to types changing. Notably, Babel [added support for optional chaining assignment](babel/babel#15751) (currently [Stage 1](https://github.com/tc39/proposal-optional-chaining-assignment)), so in the latest versions of @babel/types, AssignmentExpression.left can now also be of t.OptionalMemberExpression.

Given that this is in Stage 1, the compiler probably shouldn't support this syntax, so this PR updates HIR to bailout with a TODO if there is a non LVal on the lhs of an Assignment Expression.

There was also a small superficial SourceLocation change needed in `InferReactiveScopeVariables` as Babel 8 changes were [accidentally released in 7](babel/babel#10746 (comment)). It doesn't affect our analysis so it seems fine to just update with the new properties.

Co-authored-by: michael faith <michaelfaith@users.noreply.github.com>

Author: poteto

compiler/package.json

@@ -26,6 +26,7 @@
     "react-is": "0.0.0-experimental-4beb1fd8-20241118"
   },
   "devDependencies": {
+    "@babel/types": "^7.26.0",
     "@tsconfig/strictest": "^2.0.5",
     "concurrently": "^7.4.0",
     "esbuild": "^0.25.0",
@@ -37,13 +38,15 @@
     "prettier-plugin-hermes-parser": "^0.26.0",
     "prompt-promise": "^1.0.3",
     "rimraf": "^5.0.10",
+    "to-fast-properties": "^2.0.0",
     "tsup": "^8.4.0",
     "typescript": "^5.4.3",
     "wait-on": "^7.2.0",
     "yargs": "^17.7.2"
   },
   "resolutions": {
-    "rimraf": "5.0.10"
+    "rimraf": "5.0.10",
+    "@babel/types": "7.26.3"
   },
   "packageManager": "yarn@1.22.22"
 }

compiler/packages/babel-plugin-react-compiler/package.json

@@ -20,7 +20,7 @@
     "watch": "yarn build --watch"
   },
   "dependencies": {
-    "@babel/types": "^7.19.0"
+    "@babel/types": "^7.26.0"
   },
   "devDependencies": {
     "@babel/core": "^7.2.0",

compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts

@@ -1909,16 +1909,31 @@ function lowerExpression(
 
       if (operator === '=') {
         const left = expr.get('left');
-        return lowerAssignment(
-          builder,
-          left.node.loc ?? GeneratedSource,
-          InstructionKind.Reassign,
-          left,
-          lowerExpressionToTemporary(builder, expr.get('right')),
-          left.isArrayPattern() || left.isObjectPattern()
-            ? 'Destructure'
-            : 'Assignment',
-        );
+        if (left.isLVal()) {
+          return lowerAssignment(
+            builder,
+            left.node.loc ?? GeneratedSource,
+            InstructionKind.Reassign,
+            left,
+            lowerExpressionToTemporary(builder, expr.get('right')),
+            left.isArrayPattern() || left.isObjectPattern()
+              ? 'Destructure'
+              : 'Assignment',
+          );
+        } else {
+          /**
+           * OptionalMemberExpressions as the left side of an AssignmentExpression are Stage 1 and
+           * not supported by React Compiler yet.
+           */
+          builder.errors.push({
+            reason: `(BuildHIR::lowerExpression) Unsupported syntax on the left side of an AssignmentExpression`,
+            description: `Expected an LVal, got: ${left.type}`,
+            severity: ErrorSeverity.Todo,
+            loc: left.node.loc ?? null,
+            suggestions: null,
+          });
+          return {kind: 'UnsupportedNode', node: exprNode, loc: exprLoc};
+        }
       }
 
       const operators: {
@@ -2091,7 +2106,7 @@ function lowerExpression(
           propName = namePath.node.name;
           if (propName.indexOf(':') !== -1) {
             builder.errors.push({
-              reason: `(BuildHIR::lowerExpression) Unexpected colon in attribute name \`${name}\``,
+              reason: `(BuildHIR::lowerExpression) Unexpected colon in attribute name \`${namePath.node.name}\``,
               severity: ErrorSeverity.Todo,
               loc: namePath.node.loc ?? null,
               suggestions: null,

compiler/packages/babel-plugin-react-compiler/src/HIR/FindContextIdentifiers.ts

@@ -63,8 +63,20 @@ export function findContextIdentifiers(
         state: FindContextIdentifierState,
       ): void {
         const left = path.get('left');
-        const currentFn = state.currentFn.at(-1) ?? null;
-        handleAssignment(currentFn, state.identifiers, left);
+        if (left.isLVal()) {
+          const currentFn = state.currentFn.at(-1) ?? null;
+          handleAssignment(currentFn, state.identifiers, left);
+        } else {
+          /**
+           * OptionalMemberExpressions as the left side of an AssignmentExpression are Stage 1 and
+           * not supported by React Compiler yet.
+           */
+          CompilerError.throwTodo({
+            reason: `Unsupported syntax on the left side of an AssignmentExpression`,
+            description: `Expected an LVal, got: ${left.type}`,
+            loc: left.node.loc ?? null,
+          });
+        }
       },
       UpdateExpression(
         path: NodePath<t.UpdateExpression>,

compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/InferReactiveScopeVariables.ts

@@ -178,11 +178,15 @@ function mergeLocation(l: SourceLocation, r: SourceLocation): SourceLocation {
     return l;
   } else {
     return {
+      filename: l.filename,
+      identifierName: l.identifierName,
       start: {
+        index: Math.min(l.start.index, r.start.index),
         line: Math.min(l.start.line, r.start.line),
         column: Math.min(l.start.column, r.start.column),
       },
       end: {
+        index: Math.max(l.end.index, r.end.index),
         line: Math.max(l.end.line, r.end.line),
         column: Math.max(l.end.column, r.end.column),
       },
@@ -202,7 +206,7 @@ export function inRange(
   return id >= range.start && id < range.end;
 }
 
-function mayAllocate(env: Environment, instruction: Instruction): boolean {
+function mayAllocate(_env: Environment, instruction: Instruction): boolean {
   const {value} = instruction;
   switch (value.kind) {
     case 'Destructure': {

compiler/packages/babel-plugin-react-compiler/src/index.ts

@@ -22,6 +22,8 @@ export {
   findDirectiveEnablingMemoization,
   findDirectiveDisablingMemoization,
   type CompilerPipelineValue,
+  type Logger,
+  type LoggerEvent,
   type PluginOptions,
 } from './Entrypoint';
 export {

compiler/packages/eslint-plugin-react-compiler/package.json

@@ -22,7 +22,7 @@
   "devDependencies": {
     "@babel/preset-env": "^7.22.4",
     "@babel/preset-typescript": "^7.18.6",
-    "@babel/types": "^7.19.0",
+    "@babel/types": "^7.26.0",
     "@types/eslint": "^8.56.12",
     "@types/node": "^20.2.5",
     "babel-jest": "^29.0.3",

compiler/packages/snap/package.json

@@ -23,7 +23,7 @@
     "@babel/code-frame": "^7.22.5",
     "@babel/plugin-syntax-jsx": "^7.18.6",
     "@babel/preset-flow": "^7.7.4",
-    "@babel/preset-typescript": "^7.18.6",
+    "@babel/preset-typescript": "^7.26.0",
     "@parcel/watcher": "^2.1.0",
     "@testing-library/react": "^13.4.0",
     "babel-plugin-idx": "^3.0.3",