[Compiler Bug]: Uncaught SyntaxError: Unexpected token, expected "," (12:151)

[dimaMachina]

What kind of issue is this?

• React Compiler core (the JS output is incorrect, or your app works incorrectly after optimization)
• babel-plugin-react-compiler (build issue installing or using the Babel plugin)
• eslint-plugin-react-hooks (build issue installing or using the eslint plugin)
• react-compiler-healthcheck (build issue installing or using the healthcheck script)

Link to repro

https://playground.react.dev/#N4Igzg9grgTgxgUxALhASwLYAcIwC4AEwBUYCAyngIZ4IEC+BAZjBBgQOQwJVx4cBuADoA7UQgAeOfMygi+aCCIIBBKHgAWAWQSaIAEwDCSpmgDmsGopEAKAJRFRBAnCVhCAbTRhyUAEYYaHh4aCJmALoEALwkZJQ0CDZMVAA2ZHbCYsoE3HiwymCQAAqsAG5o+ggwYAB0GFRYNjZYZRVVDlEAfI7Zzrn5BDZOziMAPPpopQQA1ggAnlHALRDllTA1y6tVAJL69J3DI2PkAO5BcBoEE2BUfikI+ovevgFBIWGMVDBoVAC0KbcEClFgADAAqEDMZnuBAAJEtWmsatcsAC5gA5KgYBD0EGMAD0B16Y3xE1KRKOGWG9CpInoohAABoQK4RKYzCgQMBhkIQAgROVWCJsSI8LzkD0jrz+bd7gApMASADy6hSoVCZnFBDwMCgCGponoTPAGggJ22oqqIlSYBQyTSOKAA

Repro steps

Unable to compile following code

import { useState } from 'react';

export function AuthMethodConfiguration() {
  const [isSubmitting] = useState(false);

  return ssoProviders.map((provider) => {
    return (
      <div key={provider.providerId}>
        <Switch disabled={isSubmitting} aria-label={`Toggle ${provider.displayName}`} />
      </div>
    );
  });
}

with enabled option

{
  "environment": {
    "enableJsxOutlining": true
  }
}

How often does this bug happen?

Every time

What version of React are you using?

19

What version of React Compiler are you using?

latest