eslint-plugin-vue-scoped-css 2.7.2 → 2.8.1

package/README.md

@@ -40,7 +40,7 @@ npm install --save-dev eslint eslint-plugin-vue-scoped-css vue-eslint-parser
 ```
 
 > **Requirements**
-> 
+>
 > - ESLint v6.0.0 and above
 > - Node.js v12.22.x, v14.17.x, v16.x and above
 
@@ -49,8 +49,32 @@ npm install --save-dev eslint eslint-plugin-vue-scoped-css vue-eslint-parser
 ## Usage
 
 <!--USAGE_SECTION_START-->
+<!--USAGE_GUIDE_START-->
 
-Create `.eslintrc.*` file to configure rules. See also: [http://eslint.org/docs/user-guide/configuring](http://eslint.org/docs/user-guide/configuring).
+### New Config (`eslint.config.js`)
+
+Use `eslint.config.js` file to configure rules. See also: <https://eslint.org/docs/latest/use/configure/configuration-files-new>.
+
+Example **eslint.config.js**:
+
+```js
+import eslintPluginVueScopedCSS from 'eslint-plugin-vue-scoped-css';
+export default [
+  // add more generic rule sets here, such as:
+  // js.configs.recommended,
+  ...eslintPluginVueScopedCSS.configs['flat/recommended'],
+  {
+    rules: {
+      // override/add rules settings here, such as:
+      // 'vue-scoped-css/no-unused-selector': 'error'
+    }
+  }
+];
+```
+
+### Legacy Config (`.eslintrc`)
+
+Use `.eslintrc.*` file to configure rules. See also: <https://eslint.org/docs/latest/use/configure/>.
 
 Example **.eslintrc.js**:
 
@@ -72,11 +96,21 @@ module.exports = {
 
 This plugin provides some predefined configs:
 
+### New Config (`eslint.config.js`)
+
+- `*.configs['flat/base']` - Settings and rules to enable this plugin
+- `*.configs['flat/recommended']` - `/base`, plus rules for better ways to help you avoid problems for Vue.js 3.x
+- `*.configs['flat/vue2-recommended']` - `/base`, plus rules for better ways to help you avoid problems for Vue.js 2.x
+- `*.configs['flat/all']` - All rules of this plugin are included
+
+### Legacy Config (`.eslintrc`)
+
 - `plugin:vue-scoped-css/base` - Settings and rules to enable this plugin
 - `plugin:vue-scoped-css/recommended` - `/base`, plus rules for better ways to help you avoid problems for Vue.js 2.x
 - `plugin:vue-scoped-css/vue3-recommended` - `/base`, plus rules for better ways to help you avoid problems for Vue.js 3.x
 - `plugin:vue-scoped-css/all` - All rules of this plugin are included
 
+<!--USAGE_GUIDE_END-->
 <!--USAGE_SECTION_END-->
 
 ## Rules
@@ -91,9 +125,17 @@ The `--fix` option on the [command line](https://eslint.org/docs/user-guide/comm
 
 Enforce all the rules in this category with:
 
+```js
+export default [
+  ...eslintPluginVueScopedCSS.configs['flat/recommended'],
+]
+```
+
+or
+
 ```json
 {
-  "extends": "plugin:vue-scoped-css/vue3-recommended"
+  "extends": ["plugin:vue-scoped-css/vue3-recommended"]
 }
 ```
 
@@ -113,9 +155,17 @@ Enforce all the rules in this category with:
 
 Enforce all the rules in this category with:
 
+```js
+export default [
+  ...eslintPluginVueScopedCSS.configs['flat/vue2-recommended'],
+]
+```
+
+or
+
 ```json
 {
-  "extends": "plugin:vue-scoped-css/recommended"
+  "extends": ["plugin:vue-scoped-css/recommended"]
 }
 ```
 

package/dist/configs/all.js

@@ -1,6 +1,12 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 const rules_1 = require("../utils/rules");
+const path_1 = __importDefault(require("path"));
+const base = require.resolve("./base");
+const baseExtend = path_1.default.extname(`${base}`) === ".ts" ? "plugin:vue-scoped-css/base" : base;
 module.exports = {
-    extends: require.resolve("./base"),
+    extends: baseExtend,
     rules: (0, rules_1.collectRules)(),
 };

package/dist/configs/flat/all.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const rules_1 = require("../../utils/rules");
+const base_1 = __importDefault(require("./base"));
+exports.default = [
+    ...base_1.default,
+    {
+        rules: (0, rules_1.collectRules)(),
+    },
+];

package/dist/configs/flat/base.js

@@ -0,0 +1,41 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const vueParser = __importStar(require("vue-eslint-parser"));
+exports.default = [
+    {
+        plugins: {
+            get "vue-scoped-css"() {
+                return require("../../index");
+            },
+        },
+    },
+    {
+        files: ["*.vue", "**/*.vue"],
+        languageOptions: {
+            parser: vueParser,
+        },
+    },
+];

package/dist/configs/flat/recommended.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const rules_1 = require("../../utils/rules");
+const base_1 = __importDefault(require("./base"));
+exports.default = [
+    ...base_1.default,
+    {
+        rules: (0, rules_1.collectRules)("vue3-recommended"),
+    },
+];

package/dist/configs/flat/vue2-recommended.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const rules_1 = require("../../utils/rules");
+const base_1 = __importDefault(require("./base"));
+exports.default = [
+    ...base_1.default,
+    {
+        rules: (0, rules_1.collectRules)("vue2-recommended"),
+    },
+];

package/dist/configs/recommended.js

@@ -1,6 +1,12 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 const rules_1 = require("../utils/rules");
+const path_1 = __importDefault(require("path"));
+const base = require.resolve("./base");
+const baseExtend = path_1.default.extname(`${base}`) === ".ts" ? "plugin:vue-scoped-css/base" : base;
 module.exports = {
-    extends: require.resolve("./base"),
-    rules: (0, rules_1.collectRules)("recommended"),
+    extends: baseExtend,
+    rules: (0, rules_1.collectRules)("vue2-recommended"),
 };

package/dist/configs/vue3-recommended.js

@@ -1,6 +1,12 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 const rules_1 = require("../utils/rules");
+const path_1 = __importDefault(require("path"));
+const base = require.resolve("./base");
+const baseExtend = path_1.default.extname(`${base}`) === ".ts" ? "plugin:vue-scoped-css/base" : base;
 module.exports = {
-    extends: require.resolve("./base"),
+    extends: baseExtend,
     rules: (0, rules_1.collectRules)("vue3-recommended"),
 };

package/dist/index.js

@@ -1,10 +1,21 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 const rules_1 = require("./utils/rules");
+const base_1 = __importDefault(require("./configs/flat/base"));
+const recommended_1 = __importDefault(require("./configs/flat/recommended"));
+const vue2_recommended_1 = __importDefault(require("./configs/flat/vue2-recommended"));
+const all_1 = __importDefault(require("./configs/flat/all"));
 const configs = {
     base: require("./configs/base"),
     recommended: require("./configs/recommended"),
     "vue3-recommended": require("./configs/vue3-recommended"),
     all: require("./configs/all"),
+    "flat/base": base_1.default,
+    "flat/recommended": recommended_1.default,
+    "flat/vue2-recommended": vue2_recommended_1.default,
+    "flat/all": all_1.default,
 };
 const rules = rules_1.rules.reduce((obj, r) => {
     var _a;

package/dist/rules/enforce-style-type.js

@@ -10,7 +10,7 @@ module.exports = {
     meta: {
         docs: {
             description: "enforce the `<style>` tags to be plain or have the `scoped` or `module` attribute",
-            categories: ["recommended", "vue3-recommended"],
+            categories: ["vue2-recommended", "vue3-recommended"],
             default: "warn",
             url: "https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/enforce-style-type.html",
             suggestion: true,

package/dist/rules/no-parsing-error.js

@@ -4,7 +4,7 @@ module.exports = {
     meta: {
         docs: {
             description: "disallow parsing errors in `<style>`",
-            categories: ["recommended", "vue3-recommended"],
+            categories: ["vue2-recommended", "vue3-recommended"],
             default: "warn",
             url: "https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/no-parsing-error.html",
         },

package/dist/rules/no-unused-keyframes.js

@@ -7,7 +7,7 @@ module.exports = {
     meta: {
         docs: {
             description: "disallow `@keyframes` which don't use in Scoped CSS",
-            categories: ["recommended", "vue3-recommended"],
+            categories: ["vue2-recommended", "vue3-recommended"],
             default: "warn",
             url: "https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/no-unused-keyframes.html",
         },

package/dist/rules/no-unused-selector.js

@@ -54,7 +54,7 @@ module.exports = {
     meta: {
         docs: {
             description: "disallow selectors defined in Scoped CSS that don't use in `<template>`",
-            categories: ["recommended", "vue3-recommended"],
+            categories: ["vue2-recommended", "vue3-recommended"],
             default: "warn",
             url: "https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/no-unused-selector.html",
         },

package/dist/rules/require-scoped.js

@@ -6,7 +6,7 @@ module.exports = {
         deprecated: true,
         docs: {
             description: "enforce the `<style>` tags to has the `scoped` attribute",
-            categories: ["recommended", "vue3-recommended"],
+            categories: ["vue2-recommended", "vue3-recommended"],
             default: "warn",
             url: "https://future-architect.github.io/eslint-plugin-vue-scoped-css/rules/require-scoped.html",
             suggestion: true,

package/dist/styles/context/vue-components/index.js

@@ -74,11 +74,16 @@ function extractVueComponentData(dataNode, context) {
     if ((dataNode.type === "ArrowFunctionExpression" &&
         dataNode.body.type === "BlockStatement") ||
         dataNode.type === "FunctionExpression") {
-        for (const returnStatement of getReturnStatements(dataNode.body, context)) {
-            if (returnStatement.argument) {
-                dataNodes.push(returnStatement.argument);
+        if (dataNode.body.type === "BlockStatement") {
+            for (const returnStatement of getReturnStatements(dataNode.body, context)) {
+                if (returnStatement.argument) {
+                    dataNodes.push(returnStatement.argument);
+                }
             }
         }
+        else {
+            dataNodes.push(dataNode.body);
+        }
     }
     else if (dataNode.type === "ArrowFunctionExpression" &&
         dataNode.body.type !== "BlockStatement") {
@@ -143,10 +148,15 @@ function extractVueComponentComputed(computedNode, context) {
         if ((func.type === "ArrowFunctionExpression" &&
             func.body.type === "BlockStatement") ||
             func.type === "FunctionExpression") {
-            const exprs = getReturnStatements(func.body, context)
-                .map((r) => r.argument)
-                .filter(utils_1.isDefined);
-            values.push(...exprs);
+            if (func.body.type === "BlockStatement") {
+                const exprs = getReturnStatements(func.body, context)
+                    .map((r) => r.argument)
+                    .filter(utils_1.isDefined);
+                values.push(...exprs);
+            }
+            else {
+                values.push(func.body);
+            }
         }
         else if (func.type === "ArrowFunctionExpression" &&
             func.body.type !== "BlockStatement") {

package/dist/styles/parser/selector/css-selector-parser.js

@@ -88,7 +88,9 @@ class CSSSelectorParser {
         }
     }
     convertSelectorNode(node, loc, start, end, parent) {
-        let source = this.sourceCode.text.slice(start, end);
+        const sourceCode = this.sourceCode;
+        const code = sourceCode.text;
+        let source = code.slice(start, end);
         const beforeSpaces = /^\s+/u.exec(source);
         if (beforeSpaces === null || beforeSpaces === void 0 ? void 0 : beforeSpaces[0]) {
             start = start + beforeSpaces[0].length;
@@ -101,18 +103,53 @@ class CSSSelectorParser {
             loc.end = this.sourceCode.getLocFromIndex(end);
             source = source.slice(0, -afterSpaces[0].length);
         }
-        const beforeTrivials = /^\(\s*/u.exec(source);
-        const afterTrivials = /\s*\)$/u.exec(source);
-        if ((beforeTrivials === null || beforeTrivials === void 0 ? void 0 : beforeTrivials[0]) && (afterTrivials === null || afterTrivials === void 0 ? void 0 : afterTrivials[0])) {
-            start = start + beforeTrivials[0].length;
-            loc.start = this.sourceCode.getLocFromIndex(start);
-            end = end - afterTrivials[0].length;
-            loc.end = this.sourceCode.getLocFromIndex(end);
-            source = source.slice(beforeTrivials[0].length, -afterTrivials[0].length);
-        }
+        adjustBeforeParenLocation();
+        adjustAfterParenLocation();
         return new ast_1.VCSSSelector(node, loc, start, end, {
             parent: parent,
         });
+        function adjustBeforeParenLocation() {
+            const beforeTrivials = /^\(\s*/u.exec(source);
+            if (!(beforeTrivials === null || beforeTrivials === void 0 ? void 0 : beforeTrivials[0]))
+                return;
+            let withinParen = false;
+            for (let index = end - 1; index < code.length; index++) {
+                const ch = code[index];
+                if (ch === ")") {
+                    withinParen = true;
+                    break;
+                }
+                else if ((ch === null || ch === void 0 ? void 0 : ch.trim()) && index !== end - 1) {
+                    return;
+                }
+            }
+            if (!withinParen)
+                return;
+            start = start + beforeTrivials[0].length;
+            loc.start = sourceCode.getLocFromIndex(start);
+            source = source.slice(beforeTrivials[0].length);
+        }
+        function adjustAfterParenLocation() {
+            const afterTrivials = /\s*\)$/u.exec(source);
+            if (!(afterTrivials === null || afterTrivials === void 0 ? void 0 : afterTrivials[0]))
+                return;
+            let withinParen = false;
+            for (let index = start - 1; index >= 0; index--) {
+                const ch = code[index];
+                if (ch === "(") {
+                    withinParen = true;
+                    break;
+                }
+                else if (ch === null || ch === void 0 ? void 0 : ch.trim()) {
+                    return;
+                }
+            }
+            if (!withinParen)
+                return;
+            end = end - afterTrivials[0].length;
+            loc.end = sourceCode.getLocFromIndex(end);
+            source = source.slice(0, -afterTrivials[0].length);
+        }
     }
     convertTagNode(node, loc, start, end, parent) {
         return new ast_1.VCSSTypeSelector(node, loc, start, end, {

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "eslint-plugin-vue-scoped-css",
-  "version": "2.7.2",
+  "version": "2.8.1",
   "description": "ESLint plugin for Scoped CSS in Vue.js",
   "main": "dist/index.js",
   "scripts": {
     "prebuild": "npm run -s clean",
     "build": "tsc --project ./tsconfig.build.json",
     "clean": "rimraf .nyc_output dist coverage",
-    "lint": "eslint . --ext .js,.vue,.ts,.json",
-    "eslint-fix": "eslint . --ext .js,.vue,.ts,.json --fix",
+    "lint": "eslint .",
+    "eslint-fix": "eslint . --fix",
     "pretest": "npm run build",
     "test:base": "mocha --require ts-node/register \"tests/**/*.ts\" --reporter dot --timeout 60000",
     "test": "npm run test:nyc",
@@ -17,9 +17,10 @@
     "test:watch": "npm run test:base -- --watch",
     "update": "ts-node ./tools/update.ts && npm run eslint-fix && npm run test:nyc",
     "new": "ts-node ./tools/new-rule.ts",
-    "docs:watch": "npm run vuepress -- dev --debug docs",
-    "docs:build": "npm run build && npm run vuepress -- build docs --no-cache",
-    "vuepress": "node --openssl-legacy-provider ./node_modules/vuepress/cli.js",
+    "predocs:watch": "npm run build",
+    "docs:watch": "vitepress dev docs",
+    "docs:build": "npm run build && vitepress build docs",
+    "docs:open-dist": "cd ./docs/.vitepress/dist && npx -y http-server --open http://localhost:8080/eslint-plugin-vue-scoped-css/",
     "preversion": "npm test && npm run update && git add .",
     "version": "npm run lint -- --fix && git add .",
     "version:ci": "npm run update && changeset version",
@@ -51,51 +52,56 @@
     "dist"
   ],
   "devDependencies": {
-    "@changesets/cli": "^2.24.2",
-    "@ota-meshi/eslint-plugin": "^0.15.1",
+    "@changesets/cli": "^2.27.5",
+    "@eslint-community/eslint-plugin-eslint-comments": "^4.3.0",
+    "@ota-meshi/eslint-plugin": "^0.17.4",
+    "@ota-meshi/site-kit-eslint-editor-vue": "^0.2.1",
     "@svitejs/changesets-changelog-github-compact": "^1.1.0",
-    "@types/eslint": "^8.0.0",
-    "@types/eslint-visitor-keys": "^1.0.0",
-    "@types/estree": "^1.0.0",
-    "@types/lodash": "^4.14.158",
-    "@types/mocha": "^10.0.0",
-    "@types/semver": "^7.3.1",
-    "@typescript-eslint/eslint-plugin": "^6.0.0",
-    "@typescript-eslint/parser": "^6.0.0",
-    "cross-env": "^7.0.2",
-    "eslint": "^8.0.0",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-plugin-eslint-comments": "^3.2.0",
-    "eslint-plugin-eslint-plugin": "^5.2.1",
-    "eslint-plugin-json-schema-validator": "^4.6.1",
-    "eslint-plugin-jsonc": "^2.0.0",
-    "eslint-plugin-n": "^16.0.0",
-    "eslint-plugin-node-dependencies": "^0.11.1",
-    "eslint-plugin-prettier": "^5.0.0",
-    "eslint-plugin-regexp": "^2.0.0",
-    "eslint-plugin-vue": "^9.19.2",
-    "eslint-plugin-vue-scoped-css": "^2.0.0",
-    "eslint-plugin-yml": "^1.0.0",
+    "@types/eslint": "^8.56.10",
+    "@types/estree": "^1.0.5",
+    "@types/lodash": "^4.17.5",
+    "@types/mocha": "^10.0.7",
+    "@types/node": "^20.14.8",
+    "@types/semver": "^7.5.8",
+    "@typescript-eslint/eslint-plugin": "^7.13.1",
+    "@typescript-eslint/parser": "^7.13.1",
+    "assert": "^2.1.0",
+    "cross-env": "^7.0.3",
+    "eslint": "^9.5.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-eslint-plugin": "^6.1.0",
+    "eslint-plugin-jsdoc": "^48.2.15",
+    "eslint-plugin-json-schema-validator": "^5.1.1",
+    "eslint-plugin-jsonc": "^2.16.0",
+    "eslint-plugin-n": "^17.9.0",
+    "eslint-plugin-node-dependencies": "^0.12.0",
+    "eslint-plugin-prettier": "^5.1.3",
+    "eslint-plugin-regexp": "^2.6.0",
+    "eslint-plugin-vue": "^9.26.0",
+    "eslint-plugin-vue-scoped-css": "^2.8.0",
+    "eslint-plugin-yml": "^1.14.0",
+    "events": "^3.3.0",
     "mocha": "^10.0.0",
-    "nyc": "^15.1.0",
-    "pack": "^2.2.0",
+    "nyc": "^17.0.0",
+    "pako": "^2.1.0",
     "prettier": "^3.1.0",
-    "raw-loader": "^4.0.1",
     "rimraf": "^3.0.2",
     "semver": "^7.3.2",
     "stylelint": "^16.0.0",
     "stylelint-config-recommended-vue": "^1.1.0",
     "stylelint-config-standard": "^36.0.0",
+    "stylelint-config-standard-vue": "^1.0.0",
     "stylelint-stylus": "^1.0.0",
     "ts-node": "^10.9.1",
-    "typescript": "^5.0.0",
-    "vue-eslint-editor": "^1.1.0",
-    "vue-eslint-parser": "^9.0.0",
-    "vuepress": "^1.8.2"
+    "typescript": "~5.0.0",
+    "typescript-eslint": "^7.13.1",
+    "vite-plugin-eslint4b": "^0.4.6",
+    "vitepress": "^1.0.1",
+    "vue-eslint-parser": "^9.0.0"
   },
   "dependencies": {
     "@eslint-community/eslint-utils": "^4.4.0",
-    "eslint-compat-utils": "^0.4.0",
+    "eslint-compat-utils": "^0.5.0",
     "lodash": "^4.17.21",
     "postcss": "^8.4.31",
     "postcss-safe-parser": "^6.0.0",