diff --git a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts index 70f32c85b2603..87cc05e4626a4 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts @@ -131,6 +131,8 @@ const CompilationModeSchema = z.enum([ * This is the default mode */ "infer", + // Compile only components using Flow component syntax and hooks using hook syntax. + "syntax", // Compile only functions which are explicitly annotated with "use forget" "annotation", // Compile all top-level functions diff --git a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts index b47795106b5ca..085ac44f49bcb 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts @@ -499,23 +499,28 @@ function getReactFunctionType( return getComponentOrHookLike(fn, hookPattern) ?? "Other"; } } + + // Component and hook declarations are known components/hooks + let componentSyntaxType: ReactFunctionType | null = null; + if (fn.isFunctionDeclaration()) { + if (isComponentDeclaration(fn.node)) { + componentSyntaxType = "Component"; + } else if (isHookDeclaration(fn.node)) { + componentSyntaxType = "Hook"; + } + } + switch (pass.opts.compilationMode) { case "annotation": { // opt-ins are checked above return null; } case "infer": { - // Component and hook declarations are known components/hooks - if (fn.isFunctionDeclaration()) { - if (isComponentDeclaration(fn.node)) { - return "Component"; - } else if (isHookDeclaration(fn.node)) { - return "Hook"; - } - } - - // Otherwise check if this is a component or hook-like function - return getComponentOrHookLike(fn, hookPattern); + // Check if this is a component or hook-like function + return componentSyntaxType ?? getComponentOrHookLike(fn, hookPattern); + } + case "syntax": { + return componentSyntaxType; } case "all": { // Compile only top level functions