@dauphaihau/eslint-config 0.2.0 → 0.2.2

package/README.md

@@ -2,7 +2,7 @@
 
 - Auto fix for formatting (aimed to be used standalone without Prettier)
 - Opinionated, but very customizable
-- Optional TypeScript support
+- Auto-detects your tech stack (React, TypeScript, Tailwind, etc.)
 - ESLint Flat config, compose easily!
 
 ## Installation
@@ -15,9 +15,12 @@ And create `eslint.config.mjs` in your project root:
 
 ```js
 // eslint.config.mjs
-import dauphaihau from '@dauphaihau/eslint-config'
+import dauphaihauConfig from '@dauphaihau/eslint-config'
+import { defineConfig } from 'eslint/config'
 
-export default dauphaihau()
+export default defineConfig([
+  ...(await dauphaihauConfig())
+])
 ```
 
 ### Add script for package.json
@@ -36,25 +39,40 @@ For example:
 ## Usage
 
 ### Basic
-Normally you only need to import the dauphaihau preset:
+Normally you only need to import the dauphaihauConfig preset:
 
 ```js
 // eslint.config.js
-import dauphaihau from '@dauphaihau/eslint-config'
+import dauphaihauConfig from '@dauphaihau/eslint-config'
+import { defineConfig } from 'eslint/config'
 
-export default dauphaihau()
+export default defineConfig([
+  ...(await dauphaihauConfig())
+])
 ```
 
 ### Customize
 
+The config auto-detects your tech stack. Pass `false` to explicitly disable rules for a specific stack:
+
 ```js
 // eslint.config.js
-import dauphaihau from '@dauphaihau/eslint-config'
-
-export default dauphaihau({
-  typescript: true,
-})
-
+import dauphaihauConfig from '@dauphaihau/eslint-config'
+import { defineConfig } from 'eslint/config'
+
+export default defineConfig([
+  ...(await dauphaihauConfig({
+    tailwind: false, // disable Tailwind rules
+  })),
+
+  // Your configs and overrides
+  {
+    files: ['**/*.{ts,tsx}'],
+    rules: {
+      '@typescript-eslint/explicit-function-return-type': 'off',
+    },
+  },
+])
 ```
 ## License
 

package/dist/index.d.ts

@@ -4,6 +4,7 @@ type Options = {
     typescript?: boolean;
     react?: boolean;
     vue?: boolean;
+    tailwind?: boolean;
 };
 /**
  * Default factory function for creating ESLint configurations.
@@ -11,10 +12,10 @@ type Options = {
  *
  * @example
  * ```ts
- * import dauphaihau from '@dauphaihau/eslint-config'
- * export default dauphaihau({ typescript: true })
+ * import eslintConfig from '@dauphaihau/eslint-config'
+ * export default eslintConfig({ typescript: true })
  * ```
  */
-declare function dauphaihau(options?: Options): Promise<Config[]>;
+declare function eslintConfig(options?: Options): Promise<Config[]>;
 
-export { type Options, dauphaihau as default };
+export { type Options, eslintConfig as default };

package/dist/index.js

@@ -109,6 +109,27 @@ var ComponentFilesStrategy = class {
     return true;
   }
 };
+var TailwindStrategy = class {
+  getName() {
+    return "tailwind";
+  }
+  getFilePatterns(options) {
+    const patterns = ["**/*.html"];
+    if (options.react) {
+      patterns.push(options.typescript ? "**/*.{jsx,tsx}" : "**/*.jsx");
+    }
+    if (options.vue) {
+      patterns.push("**/*.vue");
+    }
+    if (!options.react && !options.vue) {
+      patterns.push(options.typescript ? "**/*.{jsx,tsx}" : "**/*.jsx");
+    }
+    return patterns;
+  }
+  shouldApply(options) {
+    return options.tailwind === true;
+  }
+};
 
 // src/strategies/strategy-manager.ts
 var StrategyManager = class {
@@ -122,6 +143,7 @@ var StrategyManager = class {
     this.register(new AllFilesStrategy());
     this.register(new SourceFilesStrategy());
     this.register(new ComponentFilesStrategy());
+    this.register(new TailwindStrategy());
   }
   /**
    * Register a new strategy.
@@ -195,6 +217,12 @@ var StrategyManager = class {
   getTestFiles(options) {
     return this.getFilePatterns("test", options);
   }
+  /**
+   * Convenience method: Get Tailwind CSS file patterns.
+   */
+  getTailwindFiles(options) {
+    return this.getFilePatterns("tailwind", options);
+  }
 };
 var strategyManager = new StrategyManager();
 
@@ -264,7 +292,14 @@ function baseConfig(options = {}) {
         // Operators
         "@stylistic/multiline-ternary": ["error", "always-multiline"],
         "@stylistic/no-mixed-operators": "error",
-        "@stylistic/operator-linebreak": ["error", "after"],
+        "@stylistic/operator-linebreak": ["error", "after", {
+          overrides: {
+            "?": "before",
+            "|": "before",
+            ":": "before",
+            "||": "before"
+          }
+        }],
         "@stylistic/dot-location": ["error", "property"],
         // Disallow
         "@stylistic/no-multiple-empty-lines": ["error", { max: 2, maxEOF: 0 }],
@@ -515,8 +550,150 @@ async function reactConfig(options = {}) {
   ];
 }
 
+// src/configs/tailwind.ts
+async function tailwindConfig(options = {}) {
+  const tailwindFiles = strategyManager.getTailwindFiles(options);
+  if (tailwindFiles.length === 0) {
+    return [];
+  }
+  const { default: tailwind } = await import("eslint-plugin-tailwindcss");
+  return [
+    {
+      name: "dauphaihau/tailwind",
+      files: tailwindFiles,
+      plugins: { tailwindcss: tailwind },
+      settings: {
+        tailwindcss: {
+          // Common utility function callees to analyze for class names
+          callees: ["classnames", "clsx", "ctl", "cva", "cx", "cn"],
+          // Support tagged template literals: tw`bg-blue-500`
+          tags: ["tw"]
+        }
+      },
+      rules: {
+        "tailwindcss/classnames-order": "warn",
+        "tailwindcss/enforces-negative-arbitrary-values": "warn",
+        "tailwindcss/enforces-shorthand": "warn",
+        "tailwindcss/migration-from-tailwind-2": "off",
+        // projects target v3+
+        "tailwindcss/no-arbitrary-value": "off",
+        // too restrictive globally; colors enforced below via no-restricted-syntax
+        "tailwindcss/no-contradicting-classname": "error",
+        "tailwindcss/no-custom-classname": "warn",
+        "tailwindcss/no-unnecessary-arbitrary-value": "warn",
+        // Partial enforcement of no-arbitrary-value scoped to color utilities.
+        // Arbitrary color values (bg-[#fff], text-[rgba(...)]) bypass the design
+        // system and should use config tokens instead. Covers: bg, text, border,
+        // ring, fill, stroke, from, via, to, accent, caret, decoration, outline,
+        // placeholder, shadow, divide — for hex, rgb(), rgba(), hsl(), hsla(), oklch().
+        "no-restricted-syntax": [
+          "warn",
+          {
+            selector: "Literal[value=/(?:^|\\s)(?:bg|text|border|ring|fill|stroke|from|via|to|accent|caret|decoration|outline|placeholder|shadow|divide)-\\[(?:#[0-9a-fA-F]|rgba?\\(|hsla?\\(|oklch\\()/]",
+            message: "Avoid arbitrary color values (e.g. bg-[#fff]). Use a design system color token from the Tailwind config instead."
+          }
+        ]
+      }
+    }
+  ];
+}
+
 // src/configs/naming.ts
 import ts2 from "typescript-eslint";
+var identifierQualityRules = {
+  // Invalid example: const n = 'Name User'
+  "id-length": [
+    "warn",
+    {
+      min: 2,
+      exceptions: ["i", "j", "x", "y"]
+    }
+  ],
+  // Discourage vague placeholder names.
+  // Prefer domain-specific names such as users, payload, responseBody, or config.
+  "id-denylist": ["warn", "foo", "bar", "baz", "tmp", "arr", "obj", "data"]
+};
+var variableNamingSelectors = [
+  // ---------- Boolean naming ----------
+  {
+    selector: "variable",
+    types: ["boolean"],
+    format: ["PascalCase", "camelCase"],
+    prefix: ["is", "has", "should", "can", "did", "will"],
+    filter: { regex: "^(is|has|should|can|did|will)[A-Z]", match: true }
+  },
+  {
+    // Valid examples: apiBaseUrl, DEFAULT_TIMEOUT_MS, _internalValue
+    selector: "variable",
+    modifiers: ["const"],
+    format: ["camelCase", "UPPER_CASE"],
+    leadingUnderscore: "allow"
+  },
+  // Valid examples: userName, fetchUsers, _internalValue
+  {
+    selector: ["variable", "function"],
+    format: ["camelCase"],
+    leadingUnderscore: "allow"
+    // allows _privateVar
+  }
+];
+var baseNamingSelectors = [
+  ...variableNamingSelectors,
+  // ---------- Interfaces ----------
+  {
+    selector: "interface",
+    format: ["PascalCase"],
+    custom: { regex: "^I[A-Z]", match: false }
+    // forbid I prefix
+  },
+  // ---------- Type Aliases ----------
+  {
+    selector: "typeAlias",
+    format: ["PascalCase"]
+    // User, UserPayload
+  },
+  // ---------- Classes ----------
+  {
+    selector: "class",
+    format: ["PascalCase"]
+  },
+  // ---------- Enums ----------
+  {
+    selector: "enum",
+    format: ["PascalCase"]
+  },
+  {
+    selector: "enumMember",
+    format: ["UPPER_CASE"]
+    // STATUS.OK
+  },
+  // ---------- Parameters ----------
+  {
+    selector: "parameter",
+    format: ["camelCase"],
+    leadingUnderscore: "allow"
+    // allow _unused
+  },
+  // ---------- Properties (object keys) ----------
+  {
+    selector: "objectLiteralProperty",
+    format: null
+    // allow anything -> API response, snake_case keys allowed
+  },
+  {
+    // internal domain types
+    selector: "typeProperty",
+    format: ["camelCase"]
+  },
+  // ---------- Private members ----------
+  {
+    selector: "classProperty",
+    modifiers: ["private"],
+    format: ["camelCase"],
+    leadingUnderscore: "allow"
+    // _value
+  }
+];
 function namingConfig(options = {}) {
   const { typescript = false } = options;
   if (!typescript) {
@@ -537,93 +714,11 @@ function namingConfig(options = {}) {
         "@typescript-eslint": ts2.plugin
       },
       rules: {
-        // Naming conventions
-        "@typescript-eslint/naming-convention": [
-          "error",
-          // ---------- Variable, Function ----------
-          {
-            selector: ["variable", "function"],
-            format: ["camelCase"],
-            leadingUnderscore: "allow"
-            // allows _privateVar
-          },
-          {
-            selector: "variable",
-            // constants (like env, config)
-            modifiers: ["const"],
-            format: ["UPPER_CASE"],
-            filter: {
-              regex: "^[A-Z0-9_]+$",
-              match: true
-            }
-          },
-          // ---------- Interfaces ----------
-          {
-            selector: "interface",
-            format: ["PascalCase"],
-            custom: { regex: "^I[A-Z]", match: false }
-            // forbid I prefix
-          },
-          // ---------- Type Aliases ----------
-          {
-            selector: "typeAlias",
-            format: ["PascalCase"]
-            // User, UserPayload
-          },
-          // ---------- Classes ----------
-          {
-            selector: "class",
-            format: ["PascalCase"]
-          },
-          // ---------- Enums ----------
-          {
-            selector: "enum",
-            format: ["PascalCase"]
-          },
-          {
-            selector: "enumMember",
-            format: ["UPPER_CASE"]
-            // STATUS.OK
-          },
-          // ---------- Parameters ----------
-          {
-            selector: "parameter",
-            format: ["camelCase"],
-            leadingUnderscore: "allow"
-            // allow _unused
-          },
-          // ---------- Properties (object keys) ----------
-          {
-            selector: "objectLiteralProperty",
-            format: null
-            // allow anything -> API response, snake_case keys allowed
-          },
-          {
-            // internal domain types
-            selector: "typeProperty",
-            format: ["camelCase"]
-          },
-          // ---------- Private members ----------
-          {
-            selector: "classProperty",
-            modifiers: ["private"],
-            format: ["camelCase"],
-            leadingUnderscore: "allow"
-            // _value
-          },
-          // ---------- Boolean naming ----------
-          {
-            selector: "variable",
-            types: ["boolean"],
-            format: ["PascalCase", "camelCase"],
-            prefix: ["is", "has", "should", "can", "did", "will"],
-            filter: { regex: "^(is|has|should|can|did|will)[A-Z]", match: true }
-          }
-        ]
+        ...identifierQualityRules,
+        "@typescript-eslint/naming-convention": ["error", ...baseNamingSelectors]
       }
     },
-    // TSX/JSX specific: Allow PascalCase for functions (React components)
-    // Helper functions will still be camelCase due to the general rule above
+    // TSX/JSX specific: Allow PascalCase for functions (React components) and component variables
     {
       name: "dauphaihau/naming-tsx",
       files: componentFiles,
@@ -634,23 +729,23 @@ function namingConfig(options = {}) {
         "@typescript-eslint": ts2.plugin
       },
       rules: {
+        ...identifierQualityRules,
         "@typescript-eslint/naming-convention": [
           "error",
+          // TSX overrides come first — same-specificity selectors use first-match wins
           {
             selector: "function",
             format: ["PascalCase", "camelCase"]
-            // Allow both for components and helpers
           },
           {
             selector: "variable",
             format: ["camelCase", "PascalCase"],
-            // Allow PascalCase for component variables
             filter: {
-              // Only allow PascalCase if it's likely a component (starts with uppercase)
-              regex: "^[A-Z]",
+              regex: "^[A-Z][a-zA-Z0-9]*$",
               match: true
             }
-          }
+          },
+          ...baseNamingSelectors
         ]
       }
     }
@@ -708,6 +803,7 @@ var ESLintConfigBuilder = class {
     this.fileNamesAdded = false;
     this.typescriptAdded = false;
     this.reactAdded = false;
+    this.tailwindAdded = false;
   }
   /**
    * Set options that will be used for all subsequent config additions.
@@ -787,6 +883,21 @@ var ESLintConfigBuilder = class {
     this.reactAdded = true;
     return this;
   }
+  /**
+   * Add Tailwind CSS-specific rules and plugins.
+   * Requires tailwind option to be set to true.
+   */
+  withTailwind(options) {
+    const mergedOptions = { ...this.options, ...options };
+    if (!mergedOptions.tailwind) {
+      console.warn(
+        "ESLintConfigBuilder: Tailwind config added but tailwind option is not set. Consider calling setOptions({ tailwind: true }) first."
+      );
+    }
+    this.pendingConfigs.push(tailwindConfig(mergedOptions));
+    this.tailwindAdded = true;
+    return this;
+  }
   /**
    * Add a custom config object directly.
    * Useful for adding project-specific rules or third-party configs.
@@ -816,6 +927,9 @@ var ESLintConfigBuilder = class {
     if (mergedOptions.react) {
       this.withReact(mergedOptions);
     }
+    if (mergedOptions.tailwind) {
+      this.withTailwind(mergedOptions);
+    }
     return this;
   }
   /**
@@ -839,6 +953,7 @@ var ESLintConfigBuilder = class {
     this.fileNamesAdded = false;
     this.typescriptAdded = false;
     this.reactAdded = false;
+    this.tailwindAdded = false;
     return this;
   }
   /**
@@ -868,6 +983,9 @@ var ESLintConfigBuilder = class {
   hasReact() {
     return this.reactAdded;
   }
+  hasTailwind() {
+    return this.tailwindAdded;
+  }
 };
 
 // src/index.ts
@@ -889,14 +1007,31 @@ var hasReact = () => {
   }
   return false;
 };
-function dauphaihau(options = {}) {
+var hasTailwind = () => {
+  try {
+    const packageJsonPath = "package.json";
+    if (fs2.existsSync(packageJsonPath)) {
+      const packageJson = JSON.parse(fs2.readFileSync(packageJsonPath, "utf-8"));
+      const deps = {
+        ...packageJson.dependencies,
+        ...packageJson.devDependencies,
+        ...packageJson.peerDependencies
+      };
+      if ("tailwindcss" in deps) return true;
+    }
+  } catch {
+  }
+  return fs2.existsSync("tailwind.config.js") || fs2.existsSync("tailwind.config.ts") || fs2.existsSync("tailwind.config.mjs") || fs2.existsSync("tailwind.config.cjs");
+};
+function eslintConfig(options = {}) {
   const finalOptions = {
     typescript: options.typescript ?? hasTsConfig,
     react: options.react ?? hasReact(),
+    tailwind: options.tailwind ?? hasTailwind(),
     ...options
   };
   return new ESLintConfigBuilder().setOptions(finalOptions).withAll().build();
 }
 export {
-  dauphaihau as default
+  eslintConfig as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dauphaihau/eslint-config",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -19,7 +19,8 @@
     "typescript-eslint": "^8.56.1"
   },
   "peerDependencies": {
-    "eslint": "^9.0.0 || ^10.0.0"
+    "eslint": "^9.0.0 || ^10.0.0",
+    "eslint-plugin-tailwindcss": ">=3.0.0"
   },
   "peerDependenciesMeta": {
     "eslint-plugin-react": {
@@ -30,6 +31,9 @@
     },
     "eslint-plugin-react-refresh": {
       "optional": true
+    },
+    "eslint-plugin-tailwindcss": {
+      "optional": true
     }
   },
   "devDependencies": {
@@ -38,17 +42,22 @@
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^7.0.1",
     "eslint-plugin-react-refresh": "^0.5.2",
+    "eslint-plugin-tailwindcss": "^3.18.2",
     "jiti": "^2.0.0",
     "tsup": "^8.0.0",
-    "typescript": "^5.4.0"
+    "typescript": "^5.4.0",
+    "vitest": "^3.2.4"
   },
   "scripts": {
-    "build": "pnpm exec tsup src/index.ts --dts --format esm --external @eslint/js --external @stylistic/eslint-plugin --external typescript-eslint --external eslint-plugin-check-file --external eslint-plugin-react --external eslint-plugin-react-hooks --external eslint-plugin-react-refresh",
+    "build": "pnpm exec tsup src/index.ts --dts --format esm --external @eslint/js --external @stylistic/eslint-plugin --external typescript-eslint --external eslint-plugin-check-file --external eslint-plugin-react --external eslint-plugin-react-hooks --external eslint-plugin-react-refresh --external eslint-plugin-tailwindcss",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
+    "test": "vitest run",
     "typecheck": "tsc --noEmit",
-    "release:patch": "pnpm build && pnpm version patch && pnpm publish --no-git-checks",
-    "release:minor": "pnpm build && pnpm version minor && pnpm publish --no-git-checks",
-    "release:major": "pnpm build && pnpm version major && pnpm publish --no-git-checks"
+    "version:patch": "pnpm build && pnpm version patch",
+    "version:minor": "pnpm build && pnpm version minor",
+    "version:major": "pnpm build && pnpm version major",
+    "push:tags": "git push --follow-tags",
+    "ship": "pnpm publish --no-git-checks"
   }
 }