@css-modules-kit/eslint-plugin 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 mizdra
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,43 @@
+# `@css-modules-kit/eslint-plugin`
+
+A eslint plugin for CSS Modules
+
+## Installation
+
+```bash
+npm i -D @css-modules-kit/eslint-plugin
+```
+
+## Usage
+
+```js
+// eslint.config.js
+import { defineConfig } from 'eslint/config';
+import css from '@eslint/css';
+import cssModulesKit from '@css-modules-kit/eslint-plugin';
+
+export default defineConfig([
+  {
+    files: ['**/*.css'],
+    language: 'css/css',
+    languageOptions: {
+      tolerant: true, // Required if you use `@value` rule or `composes` property
+    },
+    extends: [css.configs.recommended, cssModulesKit.configs.recommended],
+  },
+]);
+```
+
+For vscode-eslint users, you need to add the following configuration to your `settings.json`:
+
+```jsonc
+// .vscode/settings.json
+{
+  "eslint.validate": ["css"],
+}
+```
+
+## Rules
+
+- `css-modules-kit/no-unused-class-names`
+- `css-modules-kit/no-missing-component-file`

package/dist/index.d.ts

@@ -0,0 +1,37 @@
+declare const plugin: {
+    meta: {
+        name: string;
+        version: string;
+    };
+    rules: {
+        'no-missing-component-file': import("eslint").Rule.RuleModule;
+        'no-unused-class-names': import("eslint").Rule.RuleModule;
+    };
+    configs: {
+        recommended: {
+            languageOptions: {
+                customSyntax: {
+                    atrules: {
+                        value: {
+                            prelude: string;
+                        };
+                    };
+                    properties: {
+                        composes: {
+                            syntax: string;
+                        };
+                    };
+                };
+            };
+            plugins: {
+                'css-modules-kit': {};
+            };
+            rules: {
+                'css-modules-kit/no-missing-component-file': "error";
+                'css-modules-kit/no-unused-class-names': "error";
+            };
+        };
+    };
+};
+export = plugin;
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAKA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwDa,CAAC;AAG1B,SAAS,MAAM,CAAC"}

package/dist/index.js

@@ -0,0 +1,66 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+const package_json_1 = __importDefault(require("../package.json"));
+const no_missing_component_file_js_1 = require("./rules/no-missing-component-file.js");
+const no_unused_class_names_js_1 = require("./rules/no-unused-class-names.js");
+const plugin = {
+    meta: {
+        name: package_json_1.default.name,
+        version: package_json_1.default.version,
+    },
+    rules: {
+        'no-missing-component-file': no_missing_component_file_js_1.noMissingComponentFile,
+        'no-unused-class-names': no_unused_class_names_js_1.noUnusedClassNames,
+    },
+    configs: {
+        recommended: {
+            languageOptions: {
+                customSyntax: {
+                    atrules: {
+                        value: {
+                            // Example:
+                            // - `@value a: #123;`
+                            // - `@value empty:;`
+                            // - `@value withoutSemicolon #123;`
+                            // - `@value a from './test.module.css';`
+                            // - `@value a, b from './test.module.css';`
+                            // - `@value a as aliased_a from './test.module.css';`
+                            //
+                            // CSS Modules Kit does not support the following for implementation simplicity:
+                            // - `@value (a, b) from '...';`
+                            // - `@value a from moduleName;`
+                            //
+                            // ref: https://github.com/css-modules/postcss-icss-values/blob/acdf34a62cc2537a9507b1e9fd34db486e5cb0f8/test/test.js
+                            prelude: '<custom-ident> :? <declaration-value>? | [ [ <custom-ident> [ as <custom-ident> ]? ]# from <string> ]',
+                        },
+                    },
+                    properties: {
+                        composes: {
+                            // Example:
+                            // - `composes: a;`
+                            // - `composes: a from './test.module.css';`
+                            // - `composes: a, b from './test.module.css';`
+                            // - `composes: a b from './test.module.css';`
+                            // - `composes: global(a) from './test.module.css';`
+                            //
+                            // ref: https://github.com/css-modules/postcss-modules-extract-imports/blob/16f9c570e517cf3558b88cf96dcadf794230965a/src/index.js
+                            syntax: '[ [ <custom-ident> | global(<custom-ident>) ] ,? ]+ [ from <string> ]?',
+                        },
+                    },
+                },
+            },
+            plugins: {
+                'css-modules-kit': {},
+            },
+            rules: {
+                'css-modules-kit/no-missing-component-file': 'error',
+                'css-modules-kit/no-unused-class-names': 'error',
+            },
+        },
+    },
+};
+plugin.configs.recommended.plugins['css-modules-kit'] = plugin;
+module.exports = plugin;
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;AACA,mEAA0C;AAC1C,uFAA8E;AAC9E,+EAAsE;AAEtE,MAAM,MAAM,GAAG;IACb,IAAI,EAAE;QACJ,IAAI,EAAE,sBAAW,CAAC,IAAI;QACtB,OAAO,EAAE,sBAAW,CAAC,OAAO;KAC7B;IACD,KAAK,EAAE;QACL,2BAA2B,EAAE,qDAAsB;QACnD,uBAAuB,EAAE,6CAAkB;KAC5C;IACD,OAAO,EAAE;QACP,WAAW,EAAE;YACX,eAAe,EAAE;gBACf,YAAY,EAAE;oBACZ,OAAO,EAAE;wBACP,KAAK,EAAE;4BACL,WAAW;4BACX,sBAAsB;4BACtB,qBAAqB;4BACrB,oCAAoC;4BACpC,yCAAyC;4BACzC,4CAA4C;4BAC5C,sDAAsD;4BACtD,EAAE;4BACF,gFAAgF;4BAChF,gCAAgC;4BAChC,gCAAgC;4BAChC,EAAE;4BACF,qHAAqH;4BACrH,OAAO,EACL,uGAAuG;yBAC1G;qBACF;oBACD,UAAU,EAAE;wBACV,QAAQ,EAAE;4BACR,WAAW;4BACX,mBAAmB;4BACnB,4CAA4C;4BAC5C,+CAA+C;4BAC/C,8CAA8C;4BAC9C,oDAAoD;4BACpD,EAAE;4BACF,iIAAiI;4BACjI,MAAM,EAAE,wEAAwE;yBACjF;qBACF;iBACF;aACF;YACD,OAAO,EAAE;gBACP,iBAAiB,EAAE,EAAE;aACtB;YACD,KAAK,EAAE;gBACL,2CAA2C,EAAE,OAAO;gBACpD,uCAAuC,EAAE,OAAO;aACjD;SACF;KACF;CACsB,CAAC;AAC1B,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC;AAE/D,iBAAS,MAAM,CAAC"}

package/dist/rules/no-missing-component-file.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+export declare const noMissingComponentFile: Rule.RuleModule;
+//# sourceMappingURL=no-missing-component-file.d.ts.map

package/dist/rules/no-missing-component-file.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"no-missing-component-file.d.ts","sourceRoot":"","sources":["../../src/rules/no-missing-component-file.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAGnC,eAAO,MAAM,sBAAsB,EAAE,IAAI,CAAC,UAsBzC,CAAC"}

package/dist/rules/no-missing-component-file.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.noMissingComponentFile = void 0;
+const core_1 = require("@css-modules-kit/core");
+const util_js_1 = require("../util.js");
+exports.noMissingComponentFile = {
+    meta: {
+        type: 'problem',
+        language: 'css/css',
+        messages: {
+            disallow: 'The corresponding component file is not found.',
+        },
+    },
+    create(context) {
+        const fileName = context.filename;
+        if (fileName === undefined || !(0, core_1.isCSSModuleFile)(fileName))
+            return {};
+        const componentFile = (0, core_1.findComponentFileSync)(fileName, util_js_1.readFile);
+        if (componentFile === undefined) {
+            context.report({
+                loc: { line: 1, column: 0 },
+                messageId: 'disallow',
+            });
+        }
+        return {};
+    },
+};
+//# sourceMappingURL=no-missing-component-file.js.map

package/dist/rules/no-missing-component-file.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"no-missing-component-file.js","sourceRoot":"","sources":["../../src/rules/no-missing-component-file.ts"],"names":[],"mappings":";;;AAAA,gDAA+E;AAE/E,wCAAsC;AAEzB,QAAA,sBAAsB,GAAoB;IACrD,IAAI,EAAE;QACJ,IAAI,EAAE,SAAS;QACf,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE;YACR,QAAQ,EAAE,gDAAgD;SAC3D;KACF;IACD,MAAM,CAAC,OAAO;QACZ,MAAM,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAC;QAClC,IAAI,QAAQ,KAAK,SAAS,IAAI,CAAC,IAAA,sBAAe,EAAC,QAAQ,CAAC;YAAE,OAAO,EAAE,CAAC;QAEpE,MAAM,aAAa,GAAG,IAAA,4BAAqB,EAAC,QAAQ,EAAE,kBAAQ,CAAC,CAAC;QAEhE,IAAI,aAAa,KAAK,SAAS,EAAE,CAAC;YAChC,OAAO,CAAC,MAAM,CAAC;gBACb,GAAG,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE;gBAC3B,SAAS,EAAE,UAAU;aACtB,CAAC,CAAC;QACL,CAAC;QACD,OAAO,EAAE,CAAC;IACZ,CAAC;CACF,CAAC"}

package/dist/rules/no-unused-class-names.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+export declare const noUnusedClassNames: Rule.RuleModule;
+//# sourceMappingURL=no-unused-class-names.d.ts.map

package/dist/rules/no-unused-class-names.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"no-unused-class-names.d.ts","sourceRoot":"","sources":["../../src/rules/no-unused-class-names.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAInC,eAAO,MAAM,kBAAkB,EAAE,IAAI,CAAC,UAiDrC,CAAC"}

package/dist/rules/no-unused-class-names.js

@@ -0,0 +1,57 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.noUnusedClassNames = void 0;
+const core_1 = require("@css-modules-kit/core");
+const postcss_safe_parser_1 = __importDefault(require("postcss-safe-parser"));
+const util_js_1 = require("../util.js");
+exports.noUnusedClassNames = {
+    meta: {
+        type: 'problem',
+        language: 'css/css',
+        messages: {
+            disallow: '"{{className}}" is defined but never used in "{{componentFileName}}"',
+        },
+    },
+    create(context) {
+        const fileName = context.filename;
+        if (fileName === undefined || !(0, core_1.isCSSModuleFile)(fileName))
+            return {};
+        const componentFile = (0, core_1.findComponentFileSync)(fileName, util_js_1.readFile);
+        // If the corresponding component file is not found, it is treated as a CSS Module file shared by the entire project.
+        // It is difficult to determine where class names in a shared CSS Module file are used. Therefore, it is
+        // assumed that all class names are used.
+        if (componentFile === undefined)
+            return {};
+        const usedTokenNames = (0, core_1.findUsedTokenNames)(componentFile.text);
+        const root = (0, postcss_safe_parser_1.default)(context.sourceCode.text, { from: fileName });
+        root.walkRules((rule) => {
+            const { classSelectors } = (0, core_1.parseRule)(rule);
+            for (const classSelector of classSelectors) {
+                if (!usedTokenNames.has(classSelector.name)) {
+                    context.report({
+                        loc: {
+                            start: {
+                                line: classSelector.loc.start.line,
+                                column: classSelector.loc.start.column,
+                            },
+                            end: {
+                                line: classSelector.loc.end.line,
+                                column: classSelector.loc.end.column,
+                            },
+                        },
+                        messageId: 'disallow',
+                        data: {
+                            className: classSelector.name,
+                            componentFileName: (0, core_1.basename)(componentFile.fileName),
+                        },
+                    });
+                }
+            }
+        });
+        return {};
+    },
+};
+//# sourceMappingURL=no-unused-class-names.js.map

package/dist/rules/no-unused-class-names.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"no-unused-class-names.js","sourceRoot":"","sources":["../../src/rules/no-unused-class-names.ts"],"names":[],"mappings":";;;;;;AAAA,gDAAwH;AAExH,8EAA6C;AAC7C,wCAAsC;AAEzB,QAAA,kBAAkB,GAAoB;IACjD,IAAI,EAAE;QACJ,IAAI,EAAE,SAAS;QACf,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE;YACR,QAAQ,EAAE,sEAAsE;SACjF;KACF;IACD,MAAM,CAAC,OAAO;QACZ,MAAM,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAC;QAClC,IAAI,QAAQ,KAAK,SAAS,IAAI,CAAC,IAAA,sBAAe,EAAC,QAAQ,CAAC;YAAE,OAAO,EAAE,CAAC;QAEpE,MAAM,aAAa,GAAG,IAAA,4BAAqB,EAAC,QAAQ,EAAE,kBAAQ,CAAC,CAAC;QAEhE,qHAAqH;QACrH,wGAAwG;QACxG,yCAAyC;QACzC,IAAI,aAAa,KAAK,SAAS;YAAE,OAAO,EAAE,CAAC;QAE3C,MAAM,cAAc,GAAG,IAAA,yBAAkB,EAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAE9D,MAAM,IAAI,GAAG,IAAA,6BAAU,EAAC,OAAO,CAAC,UAAU,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;QACrE,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE;YACtB,MAAM,EAAE,cAAc,EAAE,GAAG,IAAA,gBAAS,EAAC,IAAI,CAAC,CAAC;YAE3C,KAAK,MAAM,aAAa,IAAI,cAAc,EAAE,CAAC;gBAC3C,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC;oBAC5C,OAAO,CAAC,MAAM,CAAC;wBACb,GAAG,EAAE;4BACH,KAAK,EAAE;gCACL,IAAI,EAAE,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI;gCAClC,MAAM,EAAE,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM;6BACvC;4BACD,GAAG,EAAE;gCACH,IAAI,EAAE,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI;gCAChC,MAAM,EAAE,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM;6BACrC;yBACF;wBACD,SAAS,EAAE,UAAU;wBACrB,IAAI,EAAE;4BACJ,SAAS,EAAE,aAAa,CAAC,IAAI;4BAC7B,iBAAiB,EAAE,IAAA,eAAQ,EAAC,aAAa,CAAC,QAAQ,CAAC;yBACpD;qBACF,CAAC,CAAC;gBACL,CAAC;YACH,CAAC;QACH,CAAC,CAAC,CAAC;QACH,OAAO,EAAE,CAAC;IACZ,CAAC;CACF,CAAC"}

package/dist/util.d.ts

@@ -0,0 +1,2 @@
+export declare function readFile(path: string): string;
+//# sourceMappingURL=util.d.ts.map

package/dist/util.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../src/util.ts"],"names":[],"mappings":"AAEA,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAE7C"}

package/dist/util.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.readFile = readFile;
+const node_fs_1 = __importDefault(require("node:fs"));
+function readFile(path) {
+    return node_fs_1.default.readFileSync(path, 'utf-8');
+}
+//# sourceMappingURL=util.js.map

package/dist/util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.js","sourceRoot":"","sources":["../src/util.ts"],"names":[],"mappings":";;;;;AAEA,4BAEC;AAJD,sDAAyB;AAEzB,SAAgB,QAAQ,CAAC,IAAY;IACnC,OAAO,iBAAE,CAAC,YAAY,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;AACxC,CAAC"}

package/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@css-modules-kit/eslint-plugin",
+  "description": "A eslint plugin for CSS Modules",
+  "version": "0.0.1",
+  "type": "commonjs",
+  "sideEffects": false,
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/mizdra/css-modules-kit.git",
+    "directory": "packages/eslint-plugin"
+  },
+  "author": "mizdra <pp.mizdra@gmail.com>",
+  "license": "MIT",
+  "private": false,
+  "main": "./dist/index.js",
+  "scripts": {
+    "build": "tsc -b tsconfig.build.json"
+  },
+  "engines": {
+    "node": ">=22.0.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "keywords": [
+    "css-modules",
+    "eslint",
+    "eslint-plugin"
+  ],
+  "files": [
+    "bin",
+    "src",
+    "!src/**/*.test.ts",
+    "!src/**/__snapshots__",
+    "!src/test",
+    "dist"
+  ],
+  "dependencies": {
+    "@css-modules-kit/core": "^0.1.0",
+    "postcss-safe-parser": "^7.0.1"
+  },
+  "peerDependencies": {
+    "@eslint/css": ">=0.4.0",
+    "eslint": ">=9.0.0"
+  }
+}

package/src/index.ts

@@ -0,0 +1,65 @@
+import type { ESLint } from 'eslint';
+import packageJson from '../package.json';
+import { noMissingComponentFile } from './rules/no-missing-component-file.js';
+import { noUnusedClassNames } from './rules/no-unused-class-names.js';
+
+const plugin = {
+  meta: {
+    name: packageJson.name,
+    version: packageJson.version,
+  },
+  rules: {
+    'no-missing-component-file': noMissingComponentFile,
+    'no-unused-class-names': noUnusedClassNames,
+  },
+  configs: {
+    recommended: {
+      languageOptions: {
+        customSyntax: {
+          atrules: {
+            value: {
+              // Example:
+              // - `@value a: #123;`
+              // - `@value empty:;`
+              // - `@value withoutSemicolon #123;`
+              // - `@value a from './test.module.css';`
+              // - `@value a, b from './test.module.css';`
+              // - `@value a as aliased_a from './test.module.css';`
+              //
+              // CSS Modules Kit does not support the following for implementation simplicity:
+              // - `@value (a, b) from '...';`
+              // - `@value a from moduleName;`
+              //
+              // ref: https://github.com/css-modules/postcss-icss-values/blob/acdf34a62cc2537a9507b1e9fd34db486e5cb0f8/test/test.js
+              prelude:
+                '<custom-ident> :? <declaration-value>? | [ [ <custom-ident> [ as <custom-ident> ]? ]# from <string> ]',
+            },
+          },
+          properties: {
+            composes: {
+              // Example:
+              // - `composes: a;`
+              // - `composes: a from './test.module.css';`
+              // - `composes: a, b from './test.module.css';`
+              // - `composes: a b from './test.module.css';`
+              // - `composes: global(a) from './test.module.css';`
+              //
+              // ref: https://github.com/css-modules/postcss-modules-extract-imports/blob/16f9c570e517cf3558b88cf96dcadf794230965a/src/index.js
+              syntax: '[ [ <custom-ident> | global(<custom-ident>) ] ,? ]+ [ from <string> ]?',
+            },
+          },
+        },
+      },
+      plugins: {
+        'css-modules-kit': {},
+      },
+      rules: {
+        'css-modules-kit/no-missing-component-file': 'error',
+        'css-modules-kit/no-unused-class-names': 'error',
+      },
+    },
+  },
+} satisfies ESLint.Plugin;
+plugin.configs.recommended.plugins['css-modules-kit'] = plugin;
+
+export = plugin;

package/src/rules/no-missing-component-file.ts

@@ -0,0 +1,27 @@
+import { findComponentFileSync, isCSSModuleFile } from '@css-modules-kit/core';
+import type { Rule } from 'eslint';
+import { readFile } from '../util.js';
+
+export const noMissingComponentFile: Rule.RuleModule = {
+  meta: {
+    type: 'problem',
+    language: 'css/css',
+    messages: {
+      disallow: 'The corresponding component file is not found.',
+    },
+  },
+  create(context) {
+    const fileName = context.filename;
+    if (fileName === undefined || !isCSSModuleFile(fileName)) return {};
+
+    const componentFile = findComponentFileSync(fileName, readFile);
+
+    if (componentFile === undefined) {
+      context.report({
+        loc: { line: 1, column: 0 },
+        messageId: 'disallow',
+      });
+    }
+    return {};
+  },
+};

package/src/rules/no-unused-class-names.ts

@@ -0,0 +1,55 @@
+import { basename, findComponentFileSync, findUsedTokenNames, isCSSModuleFile, parseRule } from '@css-modules-kit/core';
+import type { Rule } from 'eslint';
+import safeParser from 'postcss-safe-parser';
+import { readFile } from '../util.js';
+
+export const noUnusedClassNames: Rule.RuleModule = {
+  meta: {
+    type: 'problem',
+    language: 'css/css',
+    messages: {
+      disallow: '"{{className}}" is defined but never used in "{{componentFileName}}"',
+    },
+  },
+  create(context) {
+    const fileName = context.filename;
+    if (fileName === undefined || !isCSSModuleFile(fileName)) return {};
+
+    const componentFile = findComponentFileSync(fileName, readFile);
+
+    // If the corresponding component file is not found, it is treated as a CSS Module file shared by the entire project.
+    // It is difficult to determine where class names in a shared CSS Module file are used. Therefore, it is
+    // assumed that all class names are used.
+    if (componentFile === undefined) return {};
+
+    const usedTokenNames = findUsedTokenNames(componentFile.text);
+
+    const root = safeParser(context.sourceCode.text, { from: fileName });
+    root.walkRules((rule) => {
+      const { classSelectors } = parseRule(rule);
+
+      for (const classSelector of classSelectors) {
+        if (!usedTokenNames.has(classSelector.name)) {
+          context.report({
+            loc: {
+              start: {
+                line: classSelector.loc.start.line,
+                column: classSelector.loc.start.column,
+              },
+              end: {
+                line: classSelector.loc.end.line,
+                column: classSelector.loc.end.column,
+              },
+            },
+            messageId: 'disallow',
+            data: {
+              className: classSelector.name,
+              componentFileName: basename(componentFile.fileName),
+            },
+          });
+        }
+      }
+    });
+    return {};
+  },
+};

package/src/util.ts

@@ -0,0 +1,5 @@
+import fs from 'node:fs';
+
+export function readFile(path: string): string {
+  return fs.readFileSync(path, 'utf-8');
+}