[compiler] Wrap inline jsx transform codegen in conditional (#31267)

JSX inlining is a prod-only optimization. We want to enforce this while
maintaining the same compiler output in DEV and PROD.

Here we add a conditional to the transform that only replaces JSX with
object literals outside of DEV. Then a later build step can handle DCE
based on the value of `__DEV__`

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

@@ -55,6 +55,7 @@ export const ReactElementSymbolSchema = z.object({
     z.literal('react.element'),
     z.literal('react.transitional.element'),
   ]),
+  globalDevVar: z.string(),
 });
 
 export const ExternalFunctionSchema = z.object({

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

@@ -1243,6 +1243,17 @@ export function makeTemporaryIdentifier(
   };
 }
 
+export function forkTemporaryIdentifier(
+  id: IdentifierId,
+  source: Identifier,
+): Identifier {
+  return {
+    ...source,
+    mutableRange: {start: makeInstructionId(0), end: makeInstructionId(0)},
+    id,
+  };
+}
+
 /**
  * Creates a valid identifier name. This should *not* be used for synthesizing
  * identifier names: only call this method for identifier names that appear in the