@smartive/eslint-config 7.1.0-next.2 → 8.0.0-next.1

package/README.md

@@ -8,6 +8,8 @@ This package provides smartive's default [eslint](https://eslint.org/) configura
 $ npm install eslint @smartive/eslint-config -D
 ```
 
+Requires **ESLint 10.0.0 or newer** — see [ESLint 10 is required](#eslint-10-is-required).
+
 ## Usage
 
 This package offers three different rule sets, one for plain TypeScript applications, a separate one for React applications and one that works well with Next.js applications (minimum supported version is Next.js v16).
@@ -39,3 +41,79 @@ To use eslint add the following to your package.json:
   "lint:fix": "eslint {your source directory} --fix"
 }
 ```
+
+## Included plugins
+
+- [`typescript-eslint`](https://typescript-eslint.io/)
+- [`eslint-plugin-import-x`](https://github.com/un-ts/eslint-plugin-import-x) (`typescript` and `react` rule sets)
+- [`@eslint-react/eslint-plugin`](https://eslint-react.xyz/) (`react` and `nextjs` rule sets)
+- [`eslint-plugin-prettier`](https://github.com/prettier/eslint-plugin-prettier)
+
+`eslint-plugin-react`, `eslint-plugin-react-hooks` and `eslint-plugin-import` are no longer used.
+
+### ESLint 10 is required
+
+`@eslint-react/eslint-plugin` dropped ESLint 9 in its v3.0.0, which declares a `^10.0.0` peer range. Note
+that its `peerDependencies` say `eslint: "*"`, so npm will not warn you about an older ESLint — it will
+simply misbehave at some point.
+
+### `eslint-config-next` and ESLint 10
+
+`eslint-config-next` bundles `eslint-plugin-react`, which supports ESLint 9 at most — its peer range ends
+at `^9.7`, and on ESLint 10 every one of its rules throws while loading, because React version detection
+uses the `context.getFilename()` API that ESLint 10 removed. The same config parses plain JavaScript with
+the Babel parser Next.js bundles, and that parser calls `scopeManager.addGlobals()`, also removed in
+ESLint 10, so linting any `.js` file throws as well
+([vercel/next.js#89764](https://github.com/vercel/next.js/issues/89764), still open — there is no fix in
+`eslint-config-next@canary` either).
+
+The `nextjs` rule set therefore:
+
+- turns off every rule `eslint-config-next` enables that comes from a plugin replaced here —
+  `eslint-plugin-react` (38 rules), `eslint-plugin-react-hooks` (16) and `eslint-plugin-import` (1). The
+  list is derived from the loaded config rather than hard-coded, so it tracks upstream changes.
+- restores the one import rule from `eslint-plugin-import-x`, so no coverage is lost.
+- pins `settings.react.version`, so re-enabling any of those rules in a consuming project degrades to a
+  normal lint result instead of a crash.
+- parses `.js`, `.jsx` and `.mjs` with the typescript-eslint parser instead of the Babel one.
+
+`jsx-a11y` (6 rules) and `@next/next` (22 rules) are left untouched — nothing here replaces them. Both
+declare peer ranges ending at ESLint 9, but both work on ESLint 10.
+
+ESLint React covers most of what is turned off. What is genuinely lost:
+
+| Rule                                                                                                                      | Replacement                                                       |
+| ------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------- |
+| `import/no-anonymous-default-export`                                                                                      | `import-x/no-anonymous-default-export`, enabled in its place      |
+| `react/jsx-no-duplicate-props`                                                                                            | TypeScript reports this as `TS17001`                              |
+| `react/jsx-uses-react`, `react/jsx-uses-vars`, `react/jsx-no-undef`                                                       | redundant — ESLint 10 tracks JSX references natively              |
+| `react/no-is-mounted`, `react/require-render-return`                                                                      | class-component patterns, not relevant to modern React            |
+| `react-hooks/config`, `react-hooks/gating`, `react-hooks/incompatible-library`, `react-hooks/preserve-manual-memoization` | none — ESLint React does not implement these React Compiler rules |
+| `react/no-unescaped-entities`                                                                                             | none                                                              |
+
+## Custom rules
+
+### `smartive/forbid-component-props`
+
+Forbids the given props on components (`<Foo />`, `<Foo.Bar />`) while leaving intrinsic elements
+(`<div />`) alone. It replaces `react/forbid-component-props`, which has no equivalent in ESLint React.
+Enabled in the `react` and `nextjs` rule sets as:
+
+```javascript
+'smartive/forbid-component-props': ['warn', { forbid: ['style', 'className'] }]
+```
+
+## Development
+
+```sh
+$ npm run check-types  # type-check the config sources
+$ npm run prettier     # formatting
+$ npm test             # build, type-check the tests, then run them
+```
+
+The tests in `test/` lint the fixtures in `test/fixtures/` with each of the three rule sets and assert that
+a given fixture line is flagged. They deliberately never assert on rule ids, so that swapping out a plugin
+for an equivalent one does not require rewriting them.
+
+> `npm test` runs the TypeScript test files directly through Node's type stripping, which needs Node
+> 22.18 or newer.

package/dist/configs.d.ts

@@ -1,3 +1,3 @@
-export declare const flatConfigTypescript: (rulesOnly?: boolean) => import("eslint/config").Config[];
-export declare const flatConfigReact: () => import("eslint/config").Config[];
-export declare const flatConfigNext: () => import("eslint/config").Config[];
+export declare const flatConfigTypescript: (rulesOnly?: boolean) => import("eslint/config").ConfigObject[];
+export declare const flatConfigReact: () => import("eslint/config").ConfigObject[];
+export declare const flatConfigNext: () => import("eslint/config").ConfigObject[];

package/dist/configs.js

@@ -1,13 +1,13 @@
-import { fixupConfigRules, fixupPluginRules } from '@eslint/compat';
+import eslintReact from '@eslint-react/eslint-plugin';
 import js from '@eslint/js';
-import { flatConfigs as eslintPluginImportConfigs } from 'eslint-plugin-import';
+import { createTypeScriptImportResolver } from 'eslint-import-resolver-typescript';
+import { createNodeResolver, importX } from 'eslint-plugin-import-x';
 import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended';
-import reactPlugin from 'eslint-plugin-react';
-import reactHooks from 'eslint-plugin-react-hooks';
 import { defineConfig } from 'eslint/config';
 import globals from 'globals';
 import { createRequire } from 'node:module';
 import tsEslint from 'typescript-eslint';
+import { smartivePlugin } from './plugin/index.js';
 import { defaultRules, prettierRules, reactRules, typescriptRules } from './rules.js';
 const tsEslintConfigs = [...tsEslint.configs.recommendedTypeChecked, ...tsEslint.configs.stylisticTypeChecked];
 const baseConfig = {
@@ -30,57 +30,128 @@ const baseConfig = {
         },
     },
 };
-const reactConfig = { name: '@smartive/eslint-config/react', rules: reactRules };
+/**
+ * Type-aware rules cannot run on plain JavaScript.
+ *
+ * This has to come *after* every block that switches such a rule on — `typescriptRules` in
+ * `baseConfig` and `reactRules` both do — because in flat config the later block wins. Applied too
+ * early, ESLint fails with "You have used a rule which requires type information" on `.js` files.
+ */
+const jsDisableTypeChecked = {
+    name: '@smartive/eslint-config/js-disable-type-checked',
+    files: ['**/*.js', '**/*.mjs'],
+    rules: tsEslint.configs.disableTypeChecked.rules,
+};
+/** The same, for the type-aware rules ESLint React contributes. Applied last, for the same reason. */
+const jsDisableTypeCheckedReact = {
+    name: '@smartive/eslint-config/js-disable-type-checked-react',
+    files: ['**/*.js', '**/*.mjs'],
+    rules: eslintReact.configs['disable-type-checked'].rules,
+};
+const reactConfig = {
+    name: '@smartive/eslint-config/react',
+    plugins: { smartive: smartivePlugin },
+    rules: reactRules,
+};
 export const flatConfigTypescript = (rulesOnly = false) => defineConfig([
     js.configs.recommended,
     eslintPluginPrettierRecommended,
     ...(rulesOnly
         ? [
             {
+                // `eslint-config-next` registers this plugin, but only for `**/*.ts` and `**/*.tsx`. Without
+                // registering it here, every `@typescript-eslint/*` rule reference — these, plus the ones in
+                // `typescriptRules` and `reactRules` — makes ESLint fail with `Could not find plugin` the
+                // moment a `.js` file is linted. Registering it twice is harmless: it is the same instance,
+                // since npm dedupes `typescript-eslint` between this package and `eslint-config-next`.
+                plugins: { '@typescript-eslint': tsEslint.plugin },
                 rules: tsEslintConfigs.reduce((combinedRules, { rules }) => ({ ...combinedRules, ...(rules ? rules : {}) }), {}),
             },
         ]
         : [
-            fixupConfigRules(eslintPluginImportConfigs.errors),
-            fixupConfigRules(eslintPluginImportConfigs.warnings),
-            fixupConfigRules(eslintPluginImportConfigs.typescript),
+            importX.flatConfigs.errors,
+            importX.flatConfigs.warnings,
+            importX.flatConfigs.typescript,
             {
                 settings: {
-                    'import/resolver': {
-                        node: true,
-                        typescript: {
-                            alwaysTryTypes: true,
-                        },
-                    },
+                    'import-x/resolver-next': [createTypeScriptImportResolver({ alwaysTryTypes: true }), createNodeResolver()],
                 },
             },
             ...tsEslint.configs.recommendedTypeChecked,
             ...tsEslint.configs.stylisticTypeChecked,
         ]),
-    {
-        files: ['**/*.js', '**/*.mjs'],
-        extends: [tsEslint.configs.disableTypeChecked],
-    },
     baseConfig,
+    jsDisableTypeChecked,
+]);
+export const flatConfigReact = () => defineConfig([
+    ...flatConfigTypescript(),
+    eslintReact.configs['recommended-type-checked'],
+    reactConfig,
+    jsDisableTypeChecked,
+    jsDisableTypeCheckedReact,
 ]);
-export const flatConfigReact = () => {
-    const reactPluginFixed = fixupPluginRules(reactPlugin);
+/**
+ * Prefixes of every plugin `eslint-config-next` bundles that this config replaces.
+ *
+ * `jsx-a11y` and `@next/next` are deliberately absent — nothing here replaces those, so their rules stay
+ * on. Both declare a peer range ending at ESLint 9 but work on ESLint 10.
+ */
+const replacedNextRulePrefixes = ['react/', 'react-hooks/', 'import/'];
+/**
+ * Every rule `eslint-config-next` switches on that comes from a plugin this config replaces, turned off.
+ *
+ * `eslint-config-next` bundles `eslint-plugin-react`, `eslint-plugin-react-hooks` and
+ * `eslint-plugin-import`; ESLint React and `eslint-plugin-import-x` take their place here. Leaving the
+ * bundled ones on means duplicate reports, and for `eslint-plugin-react` a hard failure: its peer range
+ * ends at `^9.7`, and on ESLint 10 every one of its rules throws while loading, because React version
+ * detection calls the `context.getFilename()` API that ESLint 10 removed.
+ *
+ * Derived from the loaded config rather than hard-coded, so it keeps up with `eslint-config-next`.
+ *
+ * @see https://github.com/vercel/next.js/issues/89764
+ */
+const disableReplacedNextRules = (configs) => Object.fromEntries(configs
+    .flatMap((nextConfig) => Object.keys(nextConfig.rules ?? {}))
+    .filter((rule) => replacedNextRulePrefixes.some((prefix) => rule.startsWith(prefix)))
+    .map((rule) => [rule, 'off']));
+export const flatConfigNext = () => {
+    const nextConfigs = createRequire(import.meta.url)('eslint-config-next/core-web-vitals');
     return defineConfig([
-        ...flatConfigTypescript(),
+        ...nextConfigs,
+        ...flatConfigTypescript(true),
+        eslintReact.configs['recommended-type-checked'],
         {
-            ...reactPlugin.configs.flat.recommended,
-            plugins: { react: reactPluginFixed },
+            name: '@smartive/eslint-config/next-compat',
+            rules: disableReplacedNextRules(nextConfigs),
+            // Belt and braces: `eslint-config-next` sets `react.version: 'detect'`, and the bundled
+            // `eslint-plugin-react` implements detection via `context.getFilename()`, which ESLint 10
+            // removed. Pinning the version skips that path, so re-enabling one of the rules above in a
+            // consuming project degrades to a normal lint result instead of a crash.
+            settings: { react: { version: '19.0' } },
         },
         {
-            ...reactPlugin.configs.flat['jsx-runtime'],
-            plugins: { react: reactPluginFixed },
+            name: '@smartive/eslint-config/next-import-x',
+            // `import/no-anonymous-default-export` is the only import rule `eslint-config-next` switches on,
+            // and it was just turned off with the rest of `eslint-plugin-import`. Restore it from
+            // `eslint-plugin-import-x` so the Next.js rule set keeps the coverage.
+            plugins: importX.flatConfigs.errors.plugins,
+            rules: { 'import-x/no-anonymous-default-export': 'warn' },
+        },
+        {
+            name: '@smartive/eslint-config/next-js-parser',
+            files: ['**/*.js', '**/*.jsx', '**/*.mjs'],
+            // `eslint-config-next` parses plain JavaScript with the Babel parser Next.js bundles, and that
+            // parser calls `scopeManager.addGlobals()`, which ESLint 10 removed — so linting any `.js` file
+            // throws. The typescript-eslint parser handles plain JavaScript including JSX, and is ESLint 10
+            // compatible, so it takes over for those files.
+            // https://github.com/vercel/next.js/issues/89764
+            languageOptions: {
+                parser: tsEslint.parser,
+                parserOptions: { ecmaFeatures: { jsx: true } },
+            },
         },
-        reactHooks.configs.flat.recommended,
         reactConfig,
+        jsDisableTypeChecked,
+        jsDisableTypeCheckedReact,
     ]);
 };
-export const flatConfigNext = () => defineConfig([
-    ...createRequire(import.meta.url)('eslint-config-next/core-web-vitals'),
-    ...flatConfigTypescript(true),
-    reactConfig,
-]);

package/dist/plugin/forbid-component-props.d.ts

@@ -0,0 +1,6 @@
+import type { Rule } from 'eslint';
+/**
+ * Replacement for `react/forbid-component-props`, which has no equivalent in
+ * `@eslint-react/eslint-plugin` (https://eslint-react.xyz/docs/migrating-from-eslint-plugin-react).
+ */
+export declare const forbidComponentProps: Rule.RuleModule;

package/dist/plugin/forbid-component-props.js

@@ -0,0 +1,69 @@
+/**
+ * Distinguishes components (`<Foo />`, `<Foo.Bar />`) from intrinsic elements (`<div />`, `<svg:rect />`).
+ */
+const isComponent = (name) => {
+    switch (name.type) {
+        case 'JSXIdentifier':
+            return /^[A-Z]/.test(name.name);
+        case 'JSXMemberExpression':
+            return true;
+        default:
+            return false;
+    }
+};
+/**
+ * Replacement for `react/forbid-component-props`, which has no equivalent in
+ * `@eslint-react/eslint-plugin` (https://eslint-react.xyz/docs/migrating-from-eslint-plugin-react).
+ */
+export const forbidComponentProps = {
+    meta: {
+        type: 'suggestion',
+        docs: {
+            description: 'Forbid certain props on components.',
+            url: 'https://github.com/smartive/eslint-config#smartiveforbid-component-props',
+        },
+        schema: [
+            {
+                type: 'object',
+                properties: {
+                    forbid: {
+                        type: 'array',
+                        items: { type: 'string' },
+                        uniqueItems: true,
+                    },
+                },
+                additionalProperties: false,
+            },
+        ],
+        messages: {
+            forbiddenProp: 'Prop "{{prop}}" is forbidden on components.',
+        },
+    },
+    create(context) {
+        const { forbid = [] } = (context.options[0] ?? {});
+        const forbidden = new Set(forbid);
+        if (forbidden.size === 0) {
+            return {};
+        }
+        return {
+            JSXOpeningElement(node) {
+                const element = node;
+                if (!isComponent(element.name)) {
+                    return;
+                }
+                for (const attribute of element.attributes) {
+                    if (attribute.type !== 'JSXAttribute' || attribute.name.type !== 'JSXIdentifier') {
+                        continue;
+                    }
+                    if (forbidden.has(attribute.name.name)) {
+                        context.report({
+                            node: attribute,
+                            messageId: 'forbiddenProp',
+                            data: { prop: attribute.name.name },
+                        });
+                    }
+                }
+            },
+        };
+    },
+};

package/dist/plugin/index.d.ts

@@ -0,0 +1,2 @@
+import type { ESLint } from 'eslint';
+export declare const smartivePlugin: ESLint.Plugin;

package/dist/plugin/index.js

@@ -0,0 +1,7 @@
+import { forbidComponentProps } from './forbid-component-props.js';
+export const smartivePlugin = {
+    meta: { name: '@smartive/eslint-config' },
+    rules: {
+        'forbid-component-props': forbidComponentProps,
+    },
+};

package/dist/rules.js

@@ -24,9 +24,7 @@ export const typescriptRules = {
     '@typescript-eslint/no-explicit-any': ['error', { fixToUnknown: true }],
 };
 export const reactRules = {
-    'react/prop-types': 'off',
-    'react/display-name': 'off',
-    'react/forbid-component-props': ['warn', { forbid: ['style', 'className'] }],
+    'smartive/forbid-component-props': ['warn', { forbid: ['style', 'className'] }],
     '@typescript-eslint/no-misused-promises': [
         'error',
         {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@smartive/eslint-config",
-  "version": "7.1.0-next.2",
+  "version": "8.0.0-next.1",
   "description": "ESLint configuration by smartive",
   "files": [
     "README.md",
@@ -27,19 +27,18 @@
   },
   "homepage": "https://github.com/smartive/eslint-config#readme",
   "dependencies": {
+    "@eslint-react/eslint-plugin": "^5.18.6",
     "@typescript-eslint/eslint-plugin": "^8.15.0",
     "@typescript-eslint/parser": "^8.15.0",
     "eslint-config-prettier": "^10.1.8",
     "eslint-import-resolver-typescript": "^4.4.4",
-    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-import-x": "^4.17.1",
     "eslint-plugin-prettier": "^5.5.4",
-    "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "^7.0.1",
     "globals": "^17.0.0",
     "typescript-eslint": "^8.15.0"
   },
   "peerDependencies": {
-    "eslint": "^9.22.0 || ^10.0.0",
+    "eslint": "^10.0.0",
     "eslint-config-next": "^16.0.0",
     "next": "^16.0.0"
   },
@@ -52,35 +51,41 @@
     }
   },
   "devDependencies": {
-    "@commitlint/cli": "21.0.0",
-    "@commitlint/config-conventional": "21.0.0",
-    "@eslint/compat": "2.1.0",
-    "@eslint/js": "10.0.1",
+    "@commitlint/cli": "21.2.2",
+    "@commitlint/config-conventional": "21.2.2",
+    "@eslint/js": "9.39.5",
     "@smartive/prettier-config": "3.1.2",
-    "@types/node": "24.12.3",
+    "@types/node": "25.9.6",
+    "@types/react": "19.3.0",
+    "@types/react-dom": "19.3.0",
     "cz-conventional-changelog": "3.3.0",
-    "eslint": "10.3.0",
+    "eslint": "10.9.1",
+    "eslint-config-next": "16.3.5",
     "husky": "9.1.7",
-    "prettier": "3.8.3",
-    "typescript": "5.9.3"
-  },
-  "overrides": {
-    "eslint": "$eslint"
+    "next": "16.3.5",
+    "prettier": "3.9.6",
+    "react": "19.3.0",
+    "react-dom": "19.3.0",
+    "typescript": "6.0.3"
   },
   "engines": {
-    "node": "^20.19.0 || >=22.12"
+    "node": "^20.19.0 || ^22.13.0 || >=24"
   },
   "scripts": {
     "tsc": "tsc",
-    "prettier": "prettier --check .",
+    "prettier": "prettier --check . --ignore-path .prettierignore-cli",
     "check-types": "tsc --noEmit",
     "build": "rm -rf dist && tsc",
     "commitlint": "commitlint --edit",
-    "prepare": "[ ! -f node_modules/.bin/husky ] || husky"
+    "prepare": "[ ! -f node_modules/.bin/husky ] || husky",
+    "test": "npm run build && tsc --noEmit -p tsconfig.test.json && node --test \"test/**/*.test.ts\""
   },
   "config": {
     "commitizen": {
       "path": "./node_modules/cz-conventional-changelog"
     }
+  },
+  "allowScripts": {
+    "unrs-resolver@1.12.2": true
   }
 }