@caspeco/eslint-config-react 5.2.1 → 5.4.0

package/README.md

@@ -32,6 +32,24 @@ import config from "@caspeco/eslint-config-react";
 export default [{ ignores: ["dist/**/*", "build/**/*"] }, ...config];
 ```
 
+### React Compiler (opt-in)
+
+If your project has adopted the [React Compiler](https://react.dev/learn/react-compiler), use the
+`/compiler` entry point instead. It is a drop-in replacement that enables the full
+`eslint-plugin-react-hooks` recommended ruleset, including the React Compiler rules
+(`react-hooks/purity`, `react-hooks/static-components`, `react-hooks/use-memo`,
+`react-hooks/immutability`, `react-hooks/set-state-in-render`, and more):
+
+```js
+import config from "@caspeco/eslint-config-react/compiler";
+
+export default [{ ignores: ["dist/**/*", "build/**/*"] }, ...config];
+```
+
+The default config (`@caspeco/eslint-config-react`) intentionally enables only
+`react-hooks/rules-of-hooks` and `react-hooks/exhaustive-deps`, so teams that have not
+yet adopted the React Compiler are not flooded with compiler-specific warnings.
+
 ## What's Included
 
 This configuration includes everything from our TypeScript config plus React-specific rules:

package/dist/compiler.d.ts

@@ -0,0 +1,4 @@
+export default flatConfig;
+/** @type {import('typescript-eslint').ConfigArray} */
+declare const flatConfig: import("typescript-eslint").ConfigArray;
+//# sourceMappingURL=compiler.d.ts.map

package/dist/compiler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"compiler.d.ts","sourceRoot":"","sources":["../src/compiler.js"],"names":[],"mappings":";AAGA,sDAAsD;AACtD,0BADW,OAAO,mBAAmB,EAAE,WAAW,CAK/C"}

package/dist/create-config.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Builds the Caspeco React flat config. The only part that varies between the
+ * default and the React Compiler opt-in config is the set of `react-hooks` rules.
+ *
+ * @param {object} options
+ * @param {import('eslint').Linter.RulesRecord} options.reactHooksRules
+ * @returns {import('typescript-eslint').ConfigArray}
+ */
+export function createConfig({ reactHooksRules }: {
+    reactHooksRules: import("eslint").Linter.RulesRecord;
+}): import("typescript-eslint").ConfigArray;
+//# sourceMappingURL=create-config.d.ts.map

package/dist/create-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-config.d.ts","sourceRoot":"","sources":["../src/create-config.js"],"names":[],"mappings":"AAOA;;;;;;;GAOG;AACH,kDAHG;IAAqD,eAAe,EAA5D,OAAO,QAAQ,EAAE,MAAM,CAAC,WAAW;CAC3C,GAAU,OAAO,mBAAmB,EAAE,WAAW,CA4DnD"}

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.js"],"names":[],"mappings":";AAOA,sDAAsD;AACtD,0BADW,OAAO,mBAAmB,EAAE,WAAW,CAgEhD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.js"],"names":[],"mappings":";AAEA,sDAAsD;AACtD,0BADW,OAAO,mBAAmB,EAAE,WAAW,CAM/C"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@caspeco/eslint-config-react",
-	"version": "5.2.1",
+	"version": "5.4.0",
 	"description": "Caspeco ESLint configuration for React projects",
 	"keywords": [
 		"eslint",
@@ -20,6 +20,17 @@
 	},
 	"license": "MIT",
 	"type": "module",
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"default": "./src/index.js"
+		},
+		"./compiler": {
+			"types": "./dist/compiler.d.ts",
+			"default": "./src/compiler.js"
+		},
+		"./package.json": "./package.json"
+	},
 	"main": "src/index.js",
 	"types": "dist/index.d.ts",
 	"bin": {
@@ -32,12 +43,12 @@
 	],
 	"scripts": {
 		"build": "tsc --project tsconfig.build.json",
-		"check:types": "attw --pack . --ignore-rules=cjs-resolves-to-esm",
+		"check:types": "attw --pack . --ignore-rules=cjs-resolves-to-esm --profile node16",
 		"prepublishOnly": "npm run build",
 		"test": "vitest"
 	},
 	"dependencies": {
-		"@caspeco/eslint-config-ts": "5.2.1"
+		"@caspeco/eslint-config-ts": "5.4.0"
 	},
 	"devDependencies": {
 		"@caspeco/test-utils": "*",

package/src/compiler.js

@@ -0,0 +1,11 @@
+import reactHooksPlugin from "eslint-plugin-react-hooks";
+import { createConfig } from "./create-config.js";
+
+/** @type {import('typescript-eslint').ConfigArray} */
+const flatConfig = createConfig({
+	reactHooksRules: {
+		...reactHooksPlugin.configs.recommended.rules,
+	},
+});
+
+export default flatConfig;

package/src/create-config.js

@@ -0,0 +1,74 @@
+import tsConfig from "@caspeco/eslint-config-ts";
+import reactRefresh from "eslint-plugin-react-refresh";
+import reactPlugin from "eslint-plugin-react";
+import reactHooksPlugin from "eslint-plugin-react-hooks";
+import caspecoReactPlugin from "./plugins/caspeco-react.js";
+import globals from "globals";
+
+/**
+ * Builds the Caspeco React flat config. The only part that varies between the
+ * default and the React Compiler opt-in config is the set of `react-hooks` rules.
+ *
+ * @param {object} options
+ * @param {import('eslint').Linter.RulesRecord} options.reactHooksRules
+ * @returns {import('typescript-eslint').ConfigArray}
+ */
+export function createConfig({ reactHooksRules }) {
+	return [
+		// Extend the vanilla TypeScript config
+		...tsConfig,
+		// React plugin recommended config
+		{
+			...reactPlugin.configs.flat?.recommended,
+			files: ["**/*.ts", "**/*.tsx", "**/*.jsx"],
+			settings: {
+				react: {
+					version: "detect",
+				},
+			},
+			languageOptions: {
+				...reactPlugin.configs.flat?.recommended.languageOptions,
+				globals: {
+					...globals.serviceworker,
+					...globals.browser,
+				},
+				parserOptions: {
+					...reactPlugin.configs.flat?.recommended.languageOptions?.parserOptions,
+					ecmaVersion: "latest",
+				},
+			},
+			rules: {
+				...reactPlugin.configs.flat?.recommended.rules,
+				"react/react-in-jsx-scope": "off",
+				"react/prop-types": "off",
+				"react/display-name": "off",
+			},
+		},
+		// React hooks plugin config
+		{
+			...reactHooksPlugin.configs.recommended,
+			plugins: { "react-hooks": reactHooksPlugin },
+			files: ["**/*.ts", "**/*.tsx", "**/*.jsx"],
+			rules: reactHooksRules,
+		},
+		// React refresh plugin config
+		{
+			...reactRefresh.configs.recommended,
+			files: ["**/*.ts", "**/*.tsx", "**/*.jsx"],
+			rules: {
+				...reactRefresh.configs.recommended.rules,
+				"react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
+			},
+		},
+		// Caspeco React custom rules
+		{
+			files: ["**/*.ts", "**/*.tsx", "**/*.jsx"],
+			plugins: {
+				"caspeco-react": caspecoReactPlugin,
+			},
+			rules: {
+				"caspeco-react/discourage-chakra-import": "error",
+			},
+		},
+	];
+}

package/src/index.js

@@ -1,74 +1,11 @@
-import tsConfig from "@caspeco/eslint-config-ts";
-import reactRefresh from "eslint-plugin-react-refresh";
-import reactPlugin from "eslint-plugin-react";
-import reactHooksPlugin from "eslint-plugin-react-hooks";
-import caspecoReactPlugin from "./plugins/caspeco-react.js";
-import globals from "globals";
+import { createConfig } from "./create-config.js";
 
 /** @type {import('typescript-eslint').ConfigArray} */
-const flatConfig = [
-	// Extend the vanilla TypeScript config
-	...tsConfig,
-	// React plugin recommended config
-	{
-		...reactPlugin.configs.flat?.recommended,
-		files: ["**/*.ts", "**/*.tsx", "**/*.jsx"],
-		settings: {
-			react: {
-				version: "detect",
-			},
-		},
-		languageOptions: {
-			...reactPlugin.configs.flat?.recommended.languageOptions,
-			globals: {
-				...globals.serviceworker,
-				...globals.browser,
-			},
-			parserOptions: {
-				...reactPlugin.configs.flat?.recommended.languageOptions?.parserOptions,
-				ecmaVersion: "latest",
-			},
-		},
-		rules: {
-			...reactPlugin.configs.flat?.recommended.rules,
-			"react/react-in-jsx-scope": "off",
-			"react/prop-types": "off",
-			"react/display-name": "off",
-		},
+const flatConfig = createConfig({
+	reactHooksRules: {
+		"react-hooks/rules-of-hooks": "error",
+		"react-hooks/exhaustive-deps": "warn",
 	},
-	// React hooks plugin recommended config
-	{
-		...reactHooksPlugin.configs.recommended,
-		plugins: { "react-hooks": reactHooksPlugin },
-		files: ["**/*.ts", "**/*.tsx", "**/*.jsx"],
-		rules: {
-			"react-hooks/rules-of-hooks": "error",
-			"react-hooks/exhaustive-deps": "warn",
-			// We ignore the compiler specific rules as we need React 19 for this.
-			// https://github.com/facebook/react/tree/main/packages/eslint-plugin-react-hooks#flat-config-eslintconfigjsts-1
-			// When we support this, we can add:
-			// ...reactHooksPlugin.configs.recommended.rules,
-		},
-	},
-	// React refresh plugin config
-	{
-		...reactRefresh.configs.recommended,
-		files: ["**/*.ts", "**/*.tsx", "**/*.jsx"],
-		rules: {
-			...reactRefresh.configs.recommended.rules,
-			"react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
-		},
-	},
-	// Caspeco React custom rules
-	{
-		files: ["**/*.ts", "**/*.tsx", "**/*.jsx"],
-		plugins: {
-			"caspeco-react": caspecoReactPlugin,
-		},
-		rules: {
-			"caspeco-react/discourage-chakra-import": "error",
-		},
-	},
-];
+});
 
 export default flatConfig;