@tommy-mitchell/eslint-config-xo 2.0.0-beta.6 → 2.0.0-beta.8

package/package.json

@@ -1,60 +1,59 @@
 {
 	"name": "@tommy-mitchell/eslint-config-xo",
-	"version": "2.0.0-beta.6",
+	"version": "2.0.0-beta.8",
 	"description": "Personal config for XO.",
-	"keywords": [
-		"nodejs",
-		"config",
-		"xo"
-	],
-	"repository": "tommy-mitchell/eslint-config-xo",
 	"license": "MIT",
-	"author": {
-		"name": "Tommy Mitchell",
-		"url": "https://tommymitchell.io"
-	},
-	"sideEffects": false,
+	"repository": "tommy-mitchell/eslint-config-xo",
+	"author": "Tommy Mitchell (https://tommymitchell.io)",
 	"type": "module",
-	"files": [
-		"src"
-	],
 	"exports": {
 		"types": "./src/index.d.ts",
 		"default": "./src/index.js"
 	},
+	"sideEffects": false,
+	"engines": {
+		"node": "^22.22 || ^24.15 || >=26"
+	},
 	"scripts": {
-		"format": "dprint fmt && xo --fix",
 		"lint": "xo",
+		"format": "dprint fmt && xo --fix",
 		"test": "ava"
 	},
+	"files": [
+		"src"
+	],
+	"keywords": [
+		"nodejs",
+		"config",
+		"xo"
+	],
 	"dependencies": {
-		"@eslint-react/eslint-plugin": "^3.0.0",
-		"@next/eslint-plugin-next": "^16.0.5",
-		"@tanstack/eslint-plugin-router": "^1.161.6",
-		"eslint-plugin-better-tailwindcss": "^4.3.2",
-		"eslint-plugin-jsx-a11y": "^6.10.2",
-		"eslint-plugin-perfectionist": "^5.7.0",
-		"eslint-plugin-react-refresh": "^0.5.2",
-		"eslint-plugin-simple-import-sort": "^12.1.1",
-		"eslint-plugin-sort-react-dependency-arrays": "^1.0.0"
+		"@next/eslint-plugin-next": "^16.3.7",
+		"@tanstack/eslint-plugin-router": "^1.162.0",
+		"eslint-plugin-better-tailwindcss": "^4.7.0",
+		"eslint-plugin-perfectionist": "^5.12.1",
+		"eslint-plugin-react-refresh": "^0.5.7",
+		"eslint-plugin-simple-import-sort": "^14.0.0"
 	},
 	"devDependencies": {
-		"@stylistic/eslint-plugin": "^5.6.1",
-		"@tommy-mitchell/dprint-config": "0.6.0",
-		"ava": "^7.0.0",
+		"@stylistic/eslint-plugin": "^5.10.0",
+		"@tommy-mitchell/dprint-config": "^0.8.0",
+		"@tommy-mitchell/tsconfig": "^4.0.0",
+		"@types/node": "^22.20.4",
+		"@types/react": "^19.3.0",
+		"ava": "^8.0.1",
 		"dprint": "0.x",
-		"execa": "^9.6.0",
-		"react": "^19.2.0",
-		"tailwindcss": "^4.1.17",
-		"tempy": "^3.1.0",
-		"typescript": "6.0.2",
-		"xo": "~2.0.2"
+		"eslint-config-xo-react": "^0.32.0",
+		"react": "^19.3.0",
+		"tailwindcss": "^4.3.3",
+		"typescript": "~6.0.3",
+		"xo": "~5.0.1"
 	},
 	"peerDependencies": {
 		"dprint": "0.x",
 		"react": "19.x",
 		"tailwindcss": "4.x",
-		"xo": "2.x"
+		"xo": "5.x"
 	},
 	"peerDependenciesMeta": {
 		"dprint": {
@@ -67,10 +66,10 @@
 			"optional": true
 		}
 	},
-	"engines": {
-		"node": ">=22"
-	},
 	"ava": {
+		"extensions": [
+			"ts"
+		],
 		"timeout": "30s"
 	}
 }

package/readme.md

@@ -45,9 +45,9 @@ pnpm add --save-dev @tommy-mitchell/eslint-config-xo xo @tommy-mitchell/dprint-c
 ### Peer Dependencies
 
 - [xo](https://github.com/xojs/xo) - JavaScript/TypeScript linter (ESLint wrapper) with great defaults.
-- [dprint](https://github.com/dprint/dprint) (*Optional*) - Pluggable and configurable code formatting platform written in Rust.
-- [react](https://react.dev) (*Optional*) - The library for web and native user interfaces.
-- [tailwindcss](https://tailwindcss.com) (*Optional*) - A utility-first CSS framework for rapid UI development.
+- [dprint](https://github.com/dprint/dprint) (_Optional_) - Pluggable and configurable code formatting platform written in Rust.
+- [react](https://react.dev) (_Optional_) - The library for web and native user interfaces.
+- [tailwindcss](https://tailwindcss.com) (_Optional_) - A utility-first CSS framework for rapid UI development.
 
 ## Usage (Flat Config)
 
@@ -58,13 +58,27 @@ import * as configs from "@tommy-mitchell/eslint-config-xo";
 /** @type {import('xo').FlatXoConfig} */
 export default [
 	...configs.xo,
-	...configs.react({ version: "19" }), // If using React
+	...configs.react, // If using React
 	...configs.next, // If using Next.js
 	...configs.tanstack, // If using TanStack Start
 	...configs.tailwind({ config: "src/tailwind.css" }), // If using TailwindCSS
 	...configs.dprint, // If using dprint (must be last to override stylistic rules)
 	// Plus any overrides
-]
+];
+```
+
+### TailwindCSS
+
+Add the following to your `settings.json` to prevent duplicate lints:
+
+```jsonc
+"tailwindCSS.lint.suggestCanonicalClasses": "ignore",
+```
+
+If using TailwindCSS v3:
+
+```js
+configs.tailwind({ config: "tailwind.config.ts", version: "3" }),
 ```
 
 ### VS Code
@@ -81,7 +95,7 @@ Add the following to your `settings.json`:
 If formatting with `dprint`:
 
 ```jsonc
-"[javascript][javascriptreact][typescript][typescriptreact]": {
+"[javascript][javascriptreact][typescript][typescriptreact][json][jsonc][yaml][markdown]": {
 	"editor.formatOnSave": true,
 	"editor.defaultFormatter": "dprint.dprint",
 	"editor.codeActionsOnSave": {

package/src/index.d.ts

@@ -3,6 +3,6 @@ import type { FlatXoConfig } from "xo";
 export declare const dprint: FlatXoConfig;
 export declare const next: FlatXoConfig;
 export declare const react: FlatXoConfig;
-export declare const tailwind: ({ config }: { config: string; }) => FlatXoConfig;
+export declare const tailwind: (options: { config: string; version?: "3" | "4"; }) => FlatXoConfig;
 export declare const tanstack: FlatXoConfig;
 export declare const xo: FlatXoConfig;

package/src/index.js

@@ -1,7 +1,6 @@
 export { default as dprint } from "./dprint.js";
 export { default as next } from "./next.js";
 export { default as react } from "./react.js";
-// TODO: only load if tailwind is installed
 export { default as tailwind } from "./tailwind.js";
 export { default as tanstack } from "./tanstack.js";
 export { default as xo } from "./xo.js";

package/src/react.js

@@ -1,28 +1,48 @@
-import eslintReact from "@eslint-react/eslint-plugin";
-import jsxA11y from "eslint-plugin-jsx-a11y";
+import eslintConfigXoReact from "eslint-config-xo-react";
 import { reactRefresh } from "eslint-plugin-react-refresh";
-import sortReactDependencyArrays from "eslint-plugin-sort-react-dependency-arrays";
+
+const customGroups = [
+	{ elementNamePattern: "^on[A-Z].*", groupName: "callback" },
+	{ elementNamePattern: "^(children|dangerouslySetInnerHTML|key|ref)$", groupName: "reserved" },
+];
+
+const reactDependencyHooks = [
+	"useCallback",
+	"useEffect",
+	"useImperativeHandle",
+	"useInsertionEffect",
+	"useLayoutEffect",
+	"useMemo",
+];
+
+// useX()
+const reactHookCallees = reactDependencyHooks.map(hook => ([
+	"[callee.type=\"Identifier\"]",
+	`[callee.name="${hook}"]`,
+].join(""))).join(", ");
+
+// React.useX()
+const reactHookMemberCallees = reactDependencyHooks.map(hook => ([
+	"[callee.type=\"MemberExpression\"]",
+	"[callee.object.type=\"Identifier\"]",
+	"[callee.object.name=\"React\"]",
+	"[callee.property.type=\"Identifier\"]",
+	`[callee.property.name="${hook}"]`,
+].join(""))).join(", ");
 
 /** @type {import('xo').FlatXoConfig} */
-export default [jsxA11y.flatConfigs.recommended, {
-	...eslintReact.configs.strict,
-	files: "**/*.{jsx}",
-}, {
-	...eslintReact.configs["strict-type-checked"],
-	files: "**/*.{tsx}",
-}, {
+export default [...eslintConfigXoReact(), {
 	plugins: {
 		"react-refresh": reactRefresh.plugin,
-		"sort-react-dependency-arrays": sortReactDependencyArrays,
 	},
-	// TODO: boolean-prop-naming
 	rules: {
+		"perfectionist/sort-arrays": ["error", {
+			useConfigurationIf: {
+				matchesAstSelector: `CallExpression:is(${reactHookCallees}, ${reactHookMemberCallees}) > ArrayExpression`,
+			},
+		}],
 		"perfectionist/sort-jsx-props": ["error", {
-			customGroups: [
-				// TODO: move groups to a constant for reuse
-				{ elementNamePattern: "^on[A-Z].*", groupName: "callback" },
-				{ elementNamePattern: "^(children|dangerouslySetInnerHTML|key|ref)$", groupName: "reserved" },
-			],
+			customGroups,
 			groups: ["reserved", "shorthand-prop", "unknown", "callback"],
 		}],
 		"react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
@@ -38,7 +58,6 @@ export default [jsxA11y.flatConfigs.recommended, {
 				String.raw`^.+\.s?css$`,
 			]],
 		}],
-		"sort-react-dependency-arrays/sort": "error",
 		"unicorn/filename-case": ["error", {
 			cases: {
 				camelCase: true,
@@ -47,20 +66,15 @@ export default [jsxA11y.flatConfigs.recommended, {
 			},
 		}],
 	},
-}, {
-	files: ["src/constants/**/*.{ts,cts,mts,tsx}", "**/constants.{ts,cts,mts,tsx}"],
-	rules: {
-		"@typescript-eslint/naming-convention": "off",
-	},
 }, {
 	files: "**/*.{ts,cts,mts,tsx}",
 	rules: {
 		"perfectionist/sort-interfaces": ["error", {
-			customGroups: [{ elementNamePattern: "^on[A-Z].*", groupName: "callback" }],
+			customGroups,
 			groups: ["unknown", "callback"],
 		}],
 		"perfectionist/sort-object-types": ["error", {
-			customGroups: [{ elementNamePattern: "^on[A-Z].*", groupName: "callback" }],
+			customGroups,
 			groups: ["unknown", "callback"],
 		}],
 	},

package/src/tailwind.js

@@ -1,23 +1,23 @@
 import eslintPluginBetterTailwindcss from "eslint-plugin-better-tailwindcss";
 
-/** @type {({config}: {config: string}) => import('xo').FlatXoConfig} */
-export default ({ config }) => [{
-	plugins: {
-		"better-tailwindcss": eslintPluginBetterTailwindcss,
-	},
+// eslint-disable-next-line jsdoc/require-description
+/** @type {(options: {config: string; version?: "3" | "4"}) => import('xo').FlatXoConfig} */
+export default ({ config, version = "4" }) => [{
+	...eslintPluginBetterTailwindcss.configs.recommended,
 	rules: {
-		...eslintPluginBetterTailwindcss.configs.recommended.rules,
 		"better-tailwindcss/enforce-consistent-line-wrapping": ["warn", {
 			indent: "tab",
 			preferSingleLine: true,
 			printWidth: 120,
+			tabWidth: 2,
 		}],
+		"better-tailwindcss/enforce-logical-properties": ["warn"],
 	},
 	settings: {
 		"better-tailwindcss": {
 			callees: ["clsx", "cn", "cnx", "cva", "cx", "tv", "twJoin", "twMerge"],
 			detectComponentClasses: true,
-			entryPoint: config, // v4 config path
+			...(version === "3" ? { tailwindConfig: config } : { entryPoint: config }),
 		},
 	},
 }];

package/src/tanstack.js

@@ -17,6 +17,7 @@ export default [
 		],
 	}),
 	{
+		files: "**/**.{ts,cts,mts,tsx}",
 		rules: {
 			"@typescript-eslint/only-throw-error": ["error", {
 				allow: [{

package/src/xo.js

@@ -28,6 +28,7 @@ export default [{
 		}],
 		"unicorn/prefer-regexp-test": "off",
 		"unicorn/prevent-abbreviations": "off",
+		"unicorn/single-line-block-comment-style": ["error", "single-line"],
 	},
 	settings: {
 		perfectionist: {