feat(react): react compiler preset (#784)

Author: hyoban

src/configs/react.ts

@@ -1,5 +1,5 @@
 /* eslint-disable perfectionist/sort-objects */
-import type { OptionsFiles, OptionsOverrides, OptionsTypeScriptParserOptions, OptionsTypeScriptWithTypes, TypedFlatConfigItem } from '../types'
+import type { OptionsFiles, OptionsReact, OptionsTypeScriptParserOptions, OptionsTypeScriptWithTypes, TypedFlatConfigItem } from '../types'
 
 import { isPackageExists } from 'local-pkg'
 import { GLOB_ASTRO_TS, GLOB_MARKDOWN, GLOB_SRC, GLOB_TS, GLOB_TSX } from '../globs'
@@ -25,9 +25,12 @@ const ReactRouterPackages = [
 const NextJsPackages = [
   'next',
 ]
+const ReactCompilerPackages = [
+  'babel-plugin-react-compiler',
+]
 
 export async function react(
-  options: OptionsTypeScriptParserOptions & OptionsTypeScriptWithTypes & OptionsOverrides & OptionsFiles = {},
+  options: OptionsTypeScriptParserOptions & OptionsTypeScriptWithTypes & OptionsReact & OptionsFiles = {},
 ): Promise<TypedFlatConfigItem[]> {
   const {
     files = [GLOB_SRC],
@@ -38,6 +41,7 @@ export async function react(
     ],
     overrides = {},
     tsconfigPath,
+    reactCompiler = ReactCompilerPackages.some(i => isPackageExists(i)),
   } = options
 
   await ensurePackages([
@@ -153,8 +157,31 @@ export async function react(
         'react-dom/no-use-form-state': 'error',
         'react-dom/no-void-elements-with-children': 'error',
 
-        // recommended rules eslint-plugin-react-hooks https://github.com/facebook/react/tree/main/packages/eslint-plugin-react-hooks/src/rules
-        ...pluginReactHooks.configs.recommended.rules,
+        // recommended rules eslint-plugin-react-hooks https://github.com/facebook/react/blob/main/packages/eslint-plugin-react-hooks/README.md
+        // Core hooks rules
+        'react-hooks/rules-of-hooks': 'error',
+        'react-hooks/exhaustive-deps': 'warn',
+
+        // React Compiler rules
+        ...(reactCompiler
+          ? {
+              'react-hooks/config': 'error',
+              'react-hooks/error-boundaries': 'error',
+              'react-hooks/component-hook-factories': 'error',
+              'react-hooks/gating': 'error',
+              'react-hooks/globals': 'error',
+              'react-hooks/immutability': 'error',
+              'react-hooks/preserve-manual-memoization': 'error',
+              'react-hooks/purity': 'error',
+              'react-hooks/refs': 'error',
+              'react-hooks/set-state-in-effect': 'error',
+              'react-hooks/set-state-in-render': 'error',
+              'react-hooks/static-components': 'error',
+              'react-hooks/unsupported-syntax': 'warn',
+              'react-hooks/use-memo': 'error',
+              'react-hooks/incompatible-library': 'warn',
+            }
+          : {}),
 
         // recommended rules from eslint-plugin-react-hooks-extra https://eslint-react.xyz/docs/rules/overview#hooks-extra-rules
         'react-hooks-extra/no-direct-set-state-in-use-effect': 'warn',

src/factory.ts

@@ -229,6 +229,7 @@ export function antfu(
   if (enableReact) {
     configs.push(react({
       ...typescriptOptions,
+      ...resolveSubOptions(options, 'react'),
       overrides: getOverrides(options, 'react'),
       tsconfigPath,
     }))

src/types.ts

@@ -270,6 +270,10 @@ export interface OptionsUnoCSS extends OptionsOverrides {
   strict?: boolean
 }
 
+export interface OptionsReact extends OptionsOverrides {
+  reactCompiler?: boolean
+}
+
 export interface OptionsConfig extends OptionsComponentExts, OptionsProjectType {
   /**
    * Enable gitignore support.
@@ -422,7 +426,7 @@ export interface OptionsConfig extends OptionsComponentExts, OptionsProjectType
    *
    * @default false
    */
-  react?: boolean | OptionsOverrides
+  react?: boolean | OptionsReact
 
   /**
    * Enable nextjs rules.