update react hooks & compiler

Author: dai-shi

eslint.config.js

@@ -1,11 +1,10 @@
 import eslint from '@eslint/js';
-import { FlatCompat } from '@eslint/eslintrc';
 import tseslint from 'typescript-eslint';
 import importPlugin from 'eslint-plugin-import';
 import jsxA11y from 'eslint-plugin-jsx-a11y';
 import react from 'eslint-plugin-react';
-
-const compat = new FlatCompat();
+import reactHooks from 'eslint-plugin-react-hooks';
+import reactCompiler from 'eslint-plugin-react-compiler';
 
 export default tseslint.config(
   { ignores: ['dist/', 'website/'] },
@@ -15,7 +14,8 @@ export default tseslint.config(
   jsxA11y.flatConfigs.recommended,
   react.configs.flat.recommended,
   react.configs.flat['jsx-runtime'],
-  ...compat.extends('plugin:react-hooks/recommended'),
+  reactHooks.configs['recommended-latest'],
+  reactCompiler.configs.recommended,
   {
     settings: {
       'import/resolver': { typescript: true },

examples/08_comparison/src/ContextWithMemo.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable react-compiler/react-compiler */
+
 import {
   createContext,
   memo,

examples/08_comparison/src/ContextWithUseMemo.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable react-compiler/react-compiler */
+
 import { createContext, useContext, useReducer, useRef, useMemo } from 'react';
 import type { Reducer } from 'react';
 

examples/08_comparison/src/NaiveContext.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable react-compiler/react-compiler */
+
 import {
   createContext,
   useContext,

examples/08_comparison/src/ReactTracked.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable react-compiler/react-compiler */
+
 import { useReducer, useRef, useEffect } from 'react';
 import type { Reducer } from 'react';
 

examples/08_comparison/src/SplitContext.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable react-compiler/react-compiler */
+
 import {
   createContext,
   memo,

package.json

@@ -101,7 +101,8 @@
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-react": "^7.37.4",
-    "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint-plugin-react-compiler": "19.0.0-beta-decd7b8-20250118",
+    "eslint-plugin-react-hooks": "5.2.0-canary-de1eaa26-20250124",
     "happy-dom": "^16.7.2",
     "immer": "^10.1.1",
     "npm-run-all": "^4.1.5",

pnpm-lock.yaml

@@ -3,6 +3,8 @@ import { createProxy, isChanged } from 'proxy-compare';
 
 import { useAffectedDebugValue } from './utils.js';
 
+const condUseAffectedDebugValue = useAffectedDebugValue;
+
 const hasGlobalProcess = typeof process === 'object';
 
 export const createTrackedSelector = <State>(
@@ -41,8 +43,7 @@ export const createTrackedSelector = <State>(
     );
     const state = useSelector(selector);
     if (hasGlobalProcess && process.env.NODE_ENV !== 'production') {
-      // eslint-disable-next-line react-hooks/rules-of-hooks
-      useAffectedDebugValue(state, affected);
+      condUseAffectedDebugValue(state, affected);
     }
     const proxyCache = useMemo(() => new WeakMap(), []); // per-hook proxyCache
     return createProxy(state, affected, proxyCache);