@bratislava/eslint-config-next 0.12.0 → 0.14.0

package/README.md

@@ -7,7 +7,7 @@ Part of a monorepo of shareable ESLint configurations — see the [full repo](ht
 ## Installation
 
 ```bash
-npm install --save-dev @bratislava/eslint-config-next eslint typescript eslint-plugin-tailwindcss
+npm install --save-dev @bratislava/eslint-config-next eslint typescript eslint-plugin-better-tailwindcss
 ```
 
 ## Usage
@@ -32,62 +32,29 @@ export default createNextConfig({
 
 ## Tailwind CSS
 
-`eslint-plugin-tailwindcss` is a peer dependency — you install the version that matches your project's Tailwind version.
-
-### Tailwind v3
+`eslint-plugin-better-tailwindcss` is a peer dependency. It supports both Tailwind v3 and v4 without separate beta versions.
 
 ```bash
-npm install --save-dev eslint-plugin-tailwindcss
+npm install --save-dev eslint-plugin-better-tailwindcss
 ```
 
-No additional configuration needed — the preconfigured rules work out of the box with v3.
-
-### Tailwind v4
+No additional configuration needed — the recommended ruleset works out of the box.
 
-```bash
-npm install --save-dev eslint-plugin-tailwindcss@beta
-```
+## Prettier
 
-The beta version might have issues — see the [v4 branch](https://github.com/francoismassart/eslint-plugin-tailwindcss/tree/alpha/v4) for more info.
+`prettierBase` is re-exported from this package. Spread it in your `prettier.config.mjs` and add project-specific options:
 
-Tailwind v4 users must include the following settings in their `eslint.config.mjs`:
+```js
+// prettier.config.mjs
+import { prettierBase } from '@bratislava/eslint-config-next'
 
-```javascript
-// eslint.config.mjs
-import { dirname } from "path";
-import { fileURLToPath } from "url";
-import { createNextConfig } from "@bratislava/eslint-config-next";
-
-export default [
-  ...createNextConfig(),
-  {
-    settings: {
-      tailwindcss: {
-        // The absolute path pointing to your main Tailwind CSS v4 config file.
-        // It must be a `.css` file (v4), not a `.js` file (v3)
-        // REQUIRED, default value will not help
-        cssConfigPath: dirname(fileURLToPath(import.meta.url)) + "/styles/tailwind.css",
-
-        // Optional, generally not needed in bratislava FE projects:
-
-        // Attributes/props that could contain Tailwind CSS classes...
-        // Optional, default values: ["class", "className", "ngClass", "@apply"]
-        // attributes: ["..."],
-
-        // Functions/tagFunctions that will be parsed by the plugin.
-        // Optional, default values: ["classnames", "clsx", "ctl", "cva", "tv", "tw"]
-        // functions: ["..."]
-      },
-    },
-  },
-];
-```
-
-Additionally, v4 requires an empty `tailwind.config.js` at the project root, otherwise the plugin throws "Cannot resolve default tailwindcss config path" warnings. See [this issue](https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/431) for details.
-
-```javascript
-// tailwind.config.js
-export default {};
+export default {
+  ...prettierBase,
+  plugins: ['prettier-plugin-tailwindcss'],
+  tailwindFunctions: ['clsx', 'cn'],
+  // project-specific:
+  tailwindStylesheet: './src/pages/globals.css',
+}
 ```
 
 ## What's Included
@@ -106,7 +73,7 @@ Everything from `@bratislava/eslint-config` (base), plus:
 ## Peer Dependencies
 
 - `eslint` >= 9
-- `eslint-plugin-tailwindcss` >= 3.18.3 or >= 4.0.0-0 (beta)
+- `eslint-plugin-better-tailwindcss` >= 4.0.0
 - `typescript` >= 5
 
 ## License

package/index.js

@@ -5,16 +5,18 @@
  * Extends base config with Next.js, React, and i18n-specific rules.
  */
 
-import { baseConfig } from "@bratislava/eslint-config";
+import { baseConfig, prettierBase } from "@bratislava/eslint-config";
 import nextPlugin from "@next/eslint-plugin-next";
 import tanstackQuery from "@tanstack/eslint-plugin-query";
 import i18next from "eslint-plugin-i18next";
 import jsxA11y from "eslint-plugin-jsx-a11y";
 import react from "eslint-plugin-react";
 import reactHooks from "eslint-plugin-react-hooks";
-import tailwindcss from "eslint-plugin-tailwindcss";
+import betterTailwindcss from "eslint-plugin-better-tailwindcss";
 import globals from "globals";
 
+export { prettierBase };
+
 /**
  * React-specific rules overrides
  */
@@ -139,7 +141,7 @@ export function createNextConfig(options = {}) {
     // Next.js specific configs
     i18next.configs["flat/recommended"],
     ...tanstackQuery.configs["flat/recommended"],
-    ...tailwindcss.configs["flat/recommended"],
+    betterTailwindcss.configs.recommended,
 
     // Frontend rules and overrides
     {
@@ -147,7 +149,7 @@ export function createNextConfig(options = {}) {
         ...frontendRules,
         ...reactRules,
         ...nextRules,
-        "tailwindcss/migration-from-tailwind-2": "off",
+
         "sonarjs/different-types-comparison": "off", // TODO consider removing
       },
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bratislava/eslint-config-next",
-  "version": "0.12.0",
+  "version": "0.14.0",
   "description": "ESLint configuration for Next.js frontend projects",
   "keywords": [
     "eslint",
@@ -28,11 +28,11 @@
   ],
   "peerDependencies": {
     "eslint": ">= 9",
-    "eslint-plugin-tailwindcss": ">= 3.18.3 || >= 4.0.0-0",
+    "eslint-plugin-better-tailwindcss": ">= 4.0.0",
     "typescript": ">= 5"
   },
   "dependencies": {
-    "@bratislava/eslint-config": "0.12.0",
+    "@bratislava/eslint-config": "0.14.0",
     "@next/eslint-plugin-next": "15.5.2",
     "@tanstack/eslint-plugin-query": "5.91.2",
     "eslint-plugin-i18next": "6.1.3",