@master/eslint-plugin-css 2.0.0-rc.74 → 2.0.0-rc.76

package/README.md

@@ -60,6 +60,8 @@ npm install -D @master/eslint-plugin-css
 
 The recommended config is also available through `@master/eslint-config-css`.
 
+In Visual Studio Code, install the VS Code ESLint extension to surface these diagnostics and run sort-on-save. The Master CSS extension provides completion, hover, colors, highlighting, directive diagnostics, manifest diagnostics, and directive formatting; it does not duplicate class policy warnings by default.
+
 ## Usage
 
 Use ESLint flat configuration:
@@ -83,7 +85,7 @@ export default [
             parser: tsParser
         }
     },
-    css,
+    ...css,
     {
         rules: {
             '@master/css/no-invalid-classes': ['error', {
@@ -154,6 +156,18 @@ export default [
 
 For example, this rule can fix `text-align:center` to `text-center`, `font:16px` to `font:md`, `margin:md` to `m:md`, `m:1rem|1.5rem` to `m:md|lg`, `fg:var(--color-red-60)` to `fg:red-60`, `w:md h:md` to `size:md`, `mt:md mb:md` to `my:md`, and `block@dark@sm` to `block@sm@dark`.
 
+The same canonicalization applies to unquoted `@compose` class lists. In CSS, declaration-like classes are moved to native declarations and suffixes are moved to `@variant`, `@dark`, or `@light` blocks when the rewrite is safe.
+
+Standalone CSS files are included by default when using `@master/eslint-config-css`:
+
+```js
+import css from '@master/eslint-config-css'
+
+export default [...css]
+```
+
+Direct plugin users can add `css.configs.stylesheet` from `@master/eslint-plugin-css` alongside the recommended config.
+
 You can disable specific canonicalization families:
 
 ```js
@@ -167,7 +181,9 @@ export default [
                 preferVariableReferences: true,
                 preferMultiValueTokens: true,
                 preferCompositionUtilities: true,
-                preferConditionOrder: true
+                preferConditionOrder: true,
+                preferNativeDeclarationsInCompose: true,
+                preferVariantBlocksInCompose: true
             }]
         }
     }

package/dist/configs/stylesheet.d.ts

@@ -0,0 +1,6 @@
+import { Linter } from "eslint";
+
+//#region src/configs/stylesheet.d.ts
+declare const _default: Linter.Config;
+//#endregion
+export { _default as default };

package/dist/configs/stylesheet.js

@@ -0,0 +1,11 @@
+import plugin from "../plugin.js";
+import stylesheet_parser_default from "../stylesheet-parser.js";
+//#region src/configs/stylesheet.ts
+var stylesheet_default = {
+	files: ["**/*.{css,scss,less}"],
+	plugins: { "@master/css": plugin },
+	languageOptions: { parser: stylesheet_parser_default },
+	rules: { "@master/css/prefer-canonical-classes": "warn" }
+};
+//#endregion
+export { stylesheet_default as default };

package/dist/index.d.ts

@@ -8,6 +8,7 @@ declare const masterCSSPlugin: Omit<TSESLint.Linter.Plugin, 'configs'> & {
     legacy: unknown;
     base: Linter.Config;
     recommended: Linter.Config;
+    stylesheet: Linter.Config;
   };
   settings: typeof settings;
 };

package/dist/index.js

@@ -3,13 +3,15 @@ import plugin from "./plugin.js";
 import base_default from "./configs/base.js";
 import recommended_default from "./configs/recommended.js";
 import legacy_default from "./configs/legacy.js";
+import stylesheet_default from "./configs/stylesheet.js";
 //#region src/index.ts
 const masterCSSPlugin = {
 	...plugin,
 	configs: {
 		legacy: legacy_default,
 		base: base_default,
-		recommended: recommended_default
+		recommended: recommended_default,
+		stylesheet: stylesheet_default
 	},
 	settings
 };

package/dist/rules/no-conflicting-classes.js

@@ -1,7 +1,8 @@
 import create_rule_default from "../create-rule.js";
 import defineVisitors from "../utils/define-visitors.js";
 import resolveContext from "../utils/resolve-context.js";
-import { findClassConflicts, findPartialClassConflicts, removeClassNamesFromClassList, replaceClassNameInClassList } from "@master/css-lint";
+import reportLintDiagnostics from "../utils/report-lint-diagnostics.js";
+import { createConflictingClassesReport } from "@master/css-lint";
 //#region src/rules/no-conflicting-classes.ts
 var no_conflicting_classes_default = create_rule_default({
 	name: "no-conflicting-classes",
@@ -21,54 +22,8 @@ var no_conflicting_classes_default = create_rule_default({
 		return defineVisitors({
 			context,
 			settings
-		}, (_, { raw, start, end, unescape, classNodes, classValues }) => {
-			const conflicts = findClassConflicts(classValues, css);
-			if (conflicts.length) {
-				const classNamesToRemove = conflicts.map(({ className }) => className);
-				const keptClassNames = [...new Set(conflicts.flatMap(({ conflicts }) => conflicts))];
-				const formatClassName = (className) => `"${className}"`;
-				const formatClassList = (classNames) => {
-					if (classNames.length <= 2) return classNames.map(formatClassName).join(" and ");
-					return `${classNames.slice(0, -1).map(formatClassName).join(", ")}, and ${formatClassName(classNames[classNames.length - 1])}`;
-				};
-				const fixedRaw = removeClassNamesFromClassList(raw, classNamesToRemove, { unescape });
-				const firstClassNode = classNodes.find((node) => node.value === classNamesToRemove[0]);
-				context.report({
-					loc: firstClassNode.loc,
-					messageId: "collisionClass",
-					data: { message: `${formatClassList(classNamesToRemove)} ${classNamesToRemove.length === 1 ? "is" : "are"} overridden by ${formatClassList(keptClassNames)}.` },
-					fix: function(fixer) {
-						return fixer.replaceTextRange([start, end], fixedRaw);
-					}
-				});
-				return;
-			}
-			const partialConflicts = findPartialClassConflicts(classValues, css);
-			if (!partialConflicts.length) return;
-			let fixedRaw = raw;
-			for (const conflict of partialConflicts) fixedRaw = replaceClassNameInClassList(fixedRaw, conflict.className, conflict.replacement, { unescape });
-			const classNodeQueues = /* @__PURE__ */ new Map();
-			for (const classNode of classNodes) {
-				const queue = classNodeQueues.get(classNode.value);
-				if (queue) queue.push(classNode);
-				else classNodeQueues.set(classNode.value, [classNode]);
-			}
-			for (const conflict of partialConflicts) {
-				const classNode = classNodeQueues.get(conflict.className)?.shift();
-				if (!classNode) continue;
-				context.report({
-					loc: classNode.loc,
-					messageId: "partialCollisionClass",
-					data: {
-						actual: conflict.className,
-						replacement: conflict.replacement,
-						conflict: conflict.conflict
-					},
-					fix(fixer) {
-						return fixer.replaceTextRange([start, end], fixedRaw);
-					}
-				});
-			}
+		}, (node, resolved) => {
+			reportLintDiagnostics(context, node, resolved, createConflictingClassesReport(resolved.raw, css, { unescape: resolved.unescape }).diagnostics);
 		});
 	}
 });

package/dist/rules/no-invalid-classes.js

@@ -1,8 +1,9 @@
 import create_rule_default from "../create-rule.js";
 import defineVisitors from "../utils/define-visitors.js";
 import resolveContext from "../utils/resolve-context.js";
+import reportLintDiagnostics from "../utils/report-lint-diagnostics.js";
 import { noInvalidClassesOptionsSchema } from "../settings-schema.js";
-import { getClassValidationIssues } from "@master/css-lint";
+import { createInvalidClassesReport } from "@master/css-lint";
 //#region src/rules/no-invalid-classes.ts
 var no_invalid_classes_default = create_rule_default({
 	name: "no-invalid-classes",
@@ -22,18 +23,11 @@ var no_invalid_classes_default = create_rule_default({
 		return defineVisitors({
 			context,
 			settings
-		}, (_, { classNodes }) => {
-			for (const node of classNodes) {
-				const issues = getClassValidationIssues(node.value, css, {
-					disallowUnknownClass: options.disallowUnknownClass,
-					displayClassName: node.raw
-				});
-				for (const issue of issues) context.report({
-					loc: node.loc,
-					messageId: issue.kind === "invalid" ? "invalidClass" : "disallowUnknownClass",
-					data: { message: issue.message }
-				});
-			}
+		}, (node, resolved) => {
+			reportLintDiagnostics(context, node, resolved, createInvalidClassesReport(resolved.raw, css, {
+				unescape: resolved.unescape,
+				disallowUnknownClass: options.disallowUnknownClass
+			}).diagnostics);
 		});
 	}
 });

package/dist/rules/no-unapproved-raw-values.js

@@ -1,7 +1,8 @@
 import create_rule_default from "../create-rule.js";
 import defineVisitors from "../utils/define-visitors.js";
 import resolveContext from "../utils/resolve-context.js";
-import { findUnapprovedRawValueClasses } from "@master/css-lint";
+import reportLintDiagnostics from "../utils/report-lint-diagnostics.js";
+import { createUnapprovedRawValueClassesReport } from "@master/css-lint";
 //#region src/rules/no-unapproved-raw-values.ts
 var no_unapproved_raw_values_default = create_rule_default({
 	name: "no-unapproved-raw-values",
@@ -39,21 +40,11 @@ var no_unapproved_raw_values_default = create_rule_default({
 		return defineVisitors({
 			context,
 			settings
-		}, (node, { classNodes, classValues }) => {
-			const issues = findUnapprovedRawValueClasses(classValues, css, options);
-			for (const issue of issues) {
-				const classNode = classNodes.find((node) => node.value === issue.className);
-				if (!classNode) continue;
-				context.report({
-					node,
-					loc: classNode.loc,
-					messageId: "unapprovedRawValue",
-					data: {
-						className: issue.className,
-						value: issue.value
-					}
-				});
-			}
+		}, (node, resolved) => {
+			reportLintDiagnostics(context, node, resolved, createUnapprovedRawValueClassesReport(resolved.raw, css, {
+				...options,
+				unescape: resolved.unescape
+			}).diagnostics);
 		});
 	}
 });

package/dist/rules/prefer-canonical-classes.js

@@ -1,7 +1,9 @@
 import create_rule_default from "../create-rule.js";
 import defineVisitors from "../utils/define-visitors.js";
 import resolveContext from "../utils/resolve-context.js";
-import { defaultCanonicalClassNameOptions, replaceClassGroupInClassList, replaceClassNameInClassList, suggestCanonicalClassGroups, suggestCanonicalClassName } from "@master/css-lint";
+import reportLintDiagnostics from "../utils/report-lint-diagnostics.js";
+import resolveComposeDirectiveClassNodes from "../utils/resolve-compose-directive-class-nodes.js";
+import { createCanonicalClassesReport, createCanonicalComposeDirectiveReport, defaultCanonicalClassNameOptions } from "@master/css-lint";
 //#region src/rules/prefer-canonical-classes.ts
 var prefer_canonical_classes_default = create_rule_default({
 	name: "prefer-canonical-classes",
@@ -19,7 +21,9 @@ var prefer_canonical_classes_default = create_rule_default({
 				preferVariableReferences: { type: "boolean" },
 				preferMultiValueTokens: { type: "boolean" },
 				preferCompositionUtilities: { type: "boolean" },
-				preferConditionOrder: { type: "boolean" }
+				preferConditionOrder: { type: "boolean" },
+				preferNativeDeclarationsInCompose: { type: "boolean" },
+				preferVariantBlocksInCompose: { type: "boolean" }
 			},
 			additionalProperties: false
 		}]
@@ -31,49 +35,54 @@ var prefer_canonical_classes_default = create_rule_default({
 			...defaultCanonicalClassNameOptions,
 			...context.options[0] || {}
 		};
-		return defineVisitors({
+		const reportCanonicalClassList = (node, { raw, start, end, unescape, classNodes, classValues }) => {
+			reportLintDiagnostics(context, node, {
+				raw,
+				start,
+				end,
+				unescape,
+				classNodes,
+				classValues,
+				nodes: [],
+				value: raw
+			}, createCanonicalClassesReport(raw, css, {
+				...options,
+				unescape
+			}).diagnostics);
+		};
+		const reportCanonicalComposeDirective = (node, classNode) => {
+			reportLintDiagnostics(context, node, classNode, createCanonicalComposeDirectiveReport(classNode.raw, css, options).diagnostics, { getFix(_, fix) {
+				if (fix.scope !== "directive") return {
+					range: [classNode.start + fix.range.start, classNode.start + fix.range.end],
+					text: fix.text
+				};
+				return {
+					range: [classNode.directiveStart, classNode.directiveEnd],
+					text: formatComposeDirectiveReplacement(context.sourceCode.getText(), classNode.directiveStart, fix.text)
+				};
+			} });
+		};
+		const visitors = defineVisitors({
 			context,
 			settings
-		}, (node, { raw, start, end, unescape, classNodes, classValues }) => {
-			const groupSuggestions = suggestCanonicalClassGroups(classValues, css, options);
-			const coveredClassNames = new Set(groupSuggestions.flatMap((suggestion) => suggestion.classNames));
-			const reports = [];
-			let fixedRaw = raw;
-			for (const suggestion of groupSuggestions) {
-				const firstClassNode = classNodes.find((node) => node.value === suggestion.classNames[0]);
-				if (!firstClassNode) continue;
-				fixedRaw = replaceClassGroupInClassList(fixedRaw, suggestion.classNames, suggestion.recommended, { unescape });
-				reports.push({
-					loc: firstClassNode.loc,
-					actual: suggestion.classNames.join(" "),
-					recommended: suggestion.recommended
-				});
+		}, reportCanonicalClassList);
+		const visitProgram = visitors.Program;
+		return {
+			...visitors,
+			Program(node) {
+				if (typeof visitProgram === "function") visitProgram(node);
+				for (const classNode of resolveComposeDirectiveClassNodes(context)) reportCanonicalComposeDirective(node, classNode);
 			}
-			for (const classNode of classNodes) {
-				if (coveredClassNames.has(classNode.value)) continue;
-				const recommended = suggestCanonicalClassName(classNode.value, css, options);
-				if (!recommended) continue;
-				fixedRaw = replaceClassNameInClassList(fixedRaw, classNode.value, recommended, { unescape });
-				reports.push({
-					loc: classNode.loc,
-					actual: classNode.value,
-					recommended
-				});
-			}
-			for (const report of reports) context.report({
-				node,
-				loc: report.loc,
-				messageId: "preferClass",
-				data: {
-					actual: report.actual,
-					recommended: report.recommended
-				},
-				fix(fixer) {
-					return fixer.replaceTextRange([start, end], fixedRaw);
-				}
-			});
-		});
+		};
 	}
 });
+function getLinePrefix(source, index) {
+	return source.slice(source.lastIndexOf("\n", index - 1) + 1, index);
+}
+function formatComposeDirectiveReplacement(source, index, replacement) {
+	const linePrefix = getLinePrefix(source, index);
+	if (/\S/.test(linePrefix)) return replacement.replace(/\n\s*/g, " ");
+	return replacement.replace(/\n/g, `\n${linePrefix}`);
+}
 //#endregion
 export { prefer_canonical_classes_default as default };

package/dist/rules/sort-classes.js

@@ -1,7 +1,8 @@
 import create_rule_default from "../create-rule.js";
 import defineVisitors from "../utils/define-visitors.js";
 import resolveContext from "../utils/resolve-context.js";
-import { sortClassList } from "@master/css-lint";
+import reportLintDiagnostics from "../utils/report-lint-diagnostics.js";
+import { createSortClassesReport } from "@master/css-lint";
 //#region src/rules/sort-classes.ts
 var sort_classes_default = create_rule_default({
 	name: "sort-classes",
@@ -15,24 +16,21 @@ var sort_classes_default = create_rule_default({
 	defaultOptions: [],
 	create: function(context) {
 		const { settings, css } = resolveContext(context);
-		const { sourceCode } = context;
 		return defineVisitors({
 			context,
 			settings
 		}, (node, { raw, start, end, nodes, unescape }) => {
 			if (nodes.length <= 1) return;
-			const orderedRaw = sortClassList(raw, css, { unescape });
-			if (raw !== orderedRaw) context.report({
-				node,
-				loc: {
-					start: sourceCode.getLocFromIndex(start),
-					end: sourceCode.getLocFromIndex(end)
-				},
-				messageId: "invalidClassOrder",
-				fix: function(fixer) {
-					return fixer.replaceTextRange([start, end], orderedRaw);
-				}
-			});
+			reportLintDiagnostics(context, node, {
+				raw,
+				start,
+				end,
+				nodes,
+				unescape,
+				value: raw,
+				classNodes: [],
+				classValues: []
+			}, createSortClassesReport(raw, css, { unescape }).diagnostics);
 		});
 	}
 });

package/dist/stylesheet-parser.d.ts

@@ -0,0 +1,31 @@
+//#region src/stylesheet-parser.d.ts
+declare const _default: {
+  meta: {
+    name: string;
+  };
+  parseForESLint(source: string): {
+    ast: {
+      type: string;
+      body: any[];
+      comments: any[];
+      tokens: any[];
+      sourceType: string;
+      range: number[];
+      loc: {
+        start: {
+          line: number;
+          column: number;
+        };
+        end: {
+          line: number;
+          column: number;
+        };
+      };
+    };
+    visitorKeys: {
+      Program: any[];
+    };
+  };
+};
+//#endregion
+export { _default as default };

package/dist/stylesheet-parser.js

@@ -0,0 +1,33 @@
+//#region src/stylesheet-parser.ts
+function getLocFromIndex(source, index) {
+	const lines = source.slice(0, index).split(/\r\n|[\n\r]/);
+	return {
+		line: lines.length,
+		column: lines[lines.length - 1].length
+	};
+}
+var stylesheet_parser_default = {
+	meta: { name: "@master/eslint-plugin-css/stylesheet-parser" },
+	parseForESLint(source) {
+		return {
+			ast: {
+				type: "Program",
+				body: [],
+				comments: [],
+				tokens: [],
+				sourceType: "module",
+				range: [0, source.length],
+				loc: {
+					start: {
+						line: 1,
+						column: 0
+					},
+					end: getLocFromIndex(source, source.length)
+				}
+			},
+			visitorKeys: { Program: [] }
+		};
+	}
+};
+//#endregion
+export { stylesheet_parser_default as default };

package/dist/utils/report-lint-diagnostics.d.ts

@@ -0,0 +1,16 @@
+import { TSESTree } from "@typescript-eslint/utils";
+import { MasterCSSLintDiagnostic, MasterCSSLintFix } from "@master/css-lint";
+import { RuleContext } from "@typescript-eslint/utils/ts-eslint";
+import { ResolvedClassNode } from "./resolve-class-node.js";
+
+//#region src/utils/report-lint-diagnostics.d.ts
+type FixRange = [number, number];
+interface ReportLintDiagnosticsOptions {
+  getFix?: (diagnostic: MasterCSSLintDiagnostic, fix: MasterCSSLintFix) => {
+    range: FixRange;
+    text: string;
+  } | undefined;
+}
+declare function reportLintDiagnostics(context: RuleContext<any, any[]>, node: TSESTree.Node, resolved: ResolvedClassNode, diagnostics: MasterCSSLintDiagnostic[], options?: ReportLintDiagnosticsOptions): void;
+//#endregion
+export { reportLintDiagnostics as default };

package/dist/utils/report-lint-diagnostics.js

@@ -0,0 +1,46 @@
+//#region src/utils/report-lint-diagnostics.ts
+const messageIdByCode = {
+	"invalid-class-order": "invalidClassOrder",
+	"invalid-class": "invalidClass",
+	"unknown-class": "disallowUnknownClass",
+	"conflicting-class": "collisionClass",
+	"partially-conflicting-class": "partialCollisionClass",
+	"prefer-canonical-class": "preferClass",
+	"prefer-native-declaration": "preferClass",
+	"prefer-variant-block": "preferClass",
+	"unapproved-raw-value": "unapprovedRawValue"
+};
+function stringifyData(data = {}) {
+	return Object.fromEntries(Object.entries(data).filter(([, value]) => value !== void 0).map(([key, value]) => [key, Array.isArray(value) ? value.join(", ") : String(value)]));
+}
+function defaultFix(resolved, fix) {
+	if (fix.scope === "directive") return;
+	return {
+		range: [resolved.start + fix.range.start, resolved.start + fix.range.end],
+		text: fix.text
+	};
+}
+function reportLintDiagnostics(context, node, resolved, diagnostics, options = {}) {
+	const { sourceCode } = context;
+	for (const diagnostic of diagnostics) {
+		const start = resolved.start + diagnostic.range.start;
+		const end = resolved.start + diagnostic.range.end;
+		const messageId = messageIdByCode[diagnostic.code];
+		const fix = diagnostic.fix ? options.getFix?.(diagnostic, diagnostic.fix) || defaultFix(resolved, diagnostic.fix) : void 0;
+		const descriptor = {
+			node,
+			loc: {
+				start: sourceCode.getLocFromIndex(start),
+				end: sourceCode.getLocFromIndex(end)
+			},
+			...messageId ? {
+				messageId,
+				data: stringifyData(diagnostic.data || { message: diagnostic.message })
+			} : { message: diagnostic.message }
+		};
+		if (fix) descriptor.fix = (fixer) => fixer.replaceTextRange(fix.range, fix.text);
+		context.report(descriptor);
+	}
+}
+//#endregion
+export { reportLintDiagnostics as default };

package/dist/utils/resolve-compose-directive-class-nodes.d.ts

@@ -0,0 +1,11 @@
+import { RuleContext } from "@typescript-eslint/utils/ts-eslint";
+import { ResolvedClassNode } from "./resolve-class-node.js";
+
+//#region src/utils/resolve-compose-directive-class-nodes.d.ts
+interface ResolvedComposeDirectiveClassNode extends ResolvedClassNode {
+  directiveStart: number;
+  directiveEnd: number;
+}
+declare function resolveComposeDirectiveClassNodes(context: RuleContext<any, any[]>): ResolvedComposeDirectiveClassNode[];
+//#endregion
+export { ResolvedComposeDirectiveClassNode, resolveComposeDirectiveClassNodes as default };

package/dist/utils/resolve-compose-directive-class-nodes.js

@@ -0,0 +1,157 @@
+import { collectCSSDirectiveRanges, parseMasterCSSClassList } from "@master/css-lexer";
+//#region src/utils/resolve-compose-directive-class-nodes.ts
+const CSS_LIKE_FILE_RE = /\.(?:css|scss|sass|less|pcss|postcss)$/i;
+const CSS_LINE_COMMENT_FILE_RE = /\.(?:scss|sass|less)$/i;
+const STYLE_CONTAINER_FILE_RE = /\.(?:vue|svelte|astro|html|htm|mdx)$/i;
+const STYLE_LINE_COMMENT_RE = /\blang\s*=\s*(?:"(?:scss|sass|less)"|'(?:scss|sass|less)'|(?:scss|sass|less)\b)/i;
+function getFilename(context) {
+	return (context.filename || context.getFilename?.() || "").split(/[?#]/)[0];
+}
+function isWhitespace(char) {
+	return char !== void 0 && /\s/.test(char);
+}
+function findHTMLTagEnd(source, start) {
+	let quote = "";
+	for (let index = start; index < source.length; index++) {
+		const char = source[index];
+		if (quote) {
+			if (char === quote) quote = "";
+			continue;
+		}
+		if (char === "\"" || char === "'") {
+			quote = char;
+			continue;
+		}
+		if (char === ">") return index + 1;
+	}
+	return -1;
+}
+function collectStyleContentRanges(source) {
+	const ranges = [];
+	const openStylePattern = /<style\b/gi;
+	let match;
+	while (match = openStylePattern.exec(source)) {
+		const openStart = match.index;
+		const openEnd = findHTMLTagEnd(source, openStart);
+		if (openEnd === -1) break;
+		const openTag = source.slice(openStart, openEnd);
+		const closeMatch = /<\/style\s*>/i.exec(source.slice(openEnd));
+		const closeStart = closeMatch ? openEnd + closeMatch.index : source.length;
+		ranges.push({
+			start: openEnd,
+			end: closeStart,
+			lineComments: STYLE_LINE_COMMENT_RE.test(openTag)
+		});
+		openStylePattern.lastIndex = closeMatch ? closeStart + closeMatch[0].length : source.length;
+	}
+	return ranges;
+}
+function collectLineCommentRanges(source, start, end) {
+	const ranges = [];
+	let quote = "";
+	let blockComment = false;
+	for (let index = start; index < end; index++) {
+		const char = source[index];
+		const next = source[index + 1];
+		if (blockComment) {
+			if (char === "*" && next === "/") {
+				blockComment = false;
+				index++;
+			}
+			continue;
+		}
+		if (quote) {
+			if (char === "\\") index++;
+			else if (char === quote) quote = "";
+			continue;
+		}
+		if (char === "/" && next === "*") {
+			blockComment = true;
+			index++;
+			continue;
+		}
+		if (char === "\"" || char === "'") {
+			quote = char;
+			continue;
+		}
+		if (char === "/" && next === "/") {
+			const lineEnd = source.indexOf("\n", index + 2);
+			const commentEnd = lineEnd === -1 ? end : Math.min(lineEnd, end);
+			ranges.push({
+				start: index,
+				end: commentEnd
+			});
+			index = commentEnd;
+		}
+	}
+	return ranges;
+}
+function overlapsRange(start, end, ranges) {
+	return ranges.some((range) => start < range.end && end > range.start);
+}
+function collectCandidateRanges(source, filename) {
+	if (CSS_LIKE_FILE_RE.test(filename)) return [{
+		start: 0,
+		end: source.length,
+		lineComments: CSS_LINE_COMMENT_FILE_RE.test(filename)
+	}];
+	if (STYLE_CONTAINER_FILE_RE.test(filename)) return collectStyleContentRanges(source);
+	return [];
+}
+function resolveComposeDirectiveClassNode(source, sourceCode, start, end) {
+	while (start < end && isWhitespace(source[start])) start++;
+	while (end > start && isWhitespace(source[end - 1])) end--;
+	if (start >= end) return;
+	const raw = source.slice(start, end);
+	const nodes = parseMasterCSSClassList(raw, { preserveSpaces: true }).map((item) => {
+		const startOffset = start + item.start;
+		const endOffset = start + item.end;
+		return {
+			type: item.type,
+			value: item.token,
+			raw: item.raw,
+			range: [startOffset, endOffset],
+			loc: {
+				start: sourceCode.getLocFromIndex(startOffset),
+				end: sourceCode.getLocFromIndex(endOffset)
+			}
+		};
+	});
+	const classNodes = nodes.filter((node) => node.type === "class");
+	if (!classNodes.length) return;
+	return {
+		nodes,
+		start,
+		end,
+		raw,
+		value: raw,
+		unescape: false,
+		classNodes,
+		classValues: classNodes.map((node) => node.value)
+	};
+}
+function resolveComposeDirectiveClassNodes(context) {
+	const filename = getFilename(context);
+	const source = context.sourceCode.getText();
+	const nodes = [];
+	for (const range of collectCandidateRanges(source, filename)) {
+		const lineCommentRanges = range.lineComments ? collectLineCommentRanges(source, range.start, range.end) : [];
+		const rangeSource = source.slice(range.start, range.end);
+		for (const directive of collectCSSDirectiveRanges(rangeSource)) {
+			if (directive.name !== "compose") continue;
+			if (directive.blockRange || directive.quotedStringRanges.length) continue;
+			if (overlapsRange(range.start + directive.keywordRange.start, range.start + directive.keywordRange.end, lineCommentRanges)) continue;
+			const classNode = resolveComposeDirectiveClassNode(source, context.sourceCode, range.start + directive.preludeRange.start, range.start + directive.preludeRange.end);
+			if (!classNode) continue;
+			if (overlapsRange(classNode.start, classNode.end, lineCommentRanges)) continue;
+			nodes.push({
+				...classNode,
+				directiveStart: range.start + directive.start,
+				directiveEnd: range.start + (directive.semicolonRange?.end ?? directive.end)
+			});
+		}
+	}
+	return nodes;
+}
+//#endregion
+export { resolveComposeDirectiveClassNodes as default };

package/package.json

@@ -47,12 +47,12 @@
   "dependencies": {
     "@typescript-eslint/utils": "^8.61.1",
     "typescript-eslint": "^8.61.1",
-    "@master/css": "^2.0.0-rc.74",
-    "@master/css-lexer": "^2.0.0-rc.74",
-    "@master/css-lint": "^2.0.0-rc.74",
-    "@master/css-project": "^2.0.0-rc.74",
-    "@master/css-preset": "^2.0.0-rc.74",
-    "@master/css-validator": "^2.0.0-rc.74"
+    "@master/css": "^2.0.0-rc.76",
+    "@master/css-lexer": "^2.0.0-rc.76",
+    "@master/css-lint": "^2.0.0-rc.76",
+    "@master/css-project": "^2.0.0-rc.76",
+    "@master/css-preset": "^2.0.0-rc.76",
+    "@master/css-validator": "^2.0.0-rc.76"
   },
   "devDependencies": {
     "@angular-eslint/template-parser": "^21.4.0",
@@ -65,9 +65,9 @@
     "svelte-eslint-parser": "^1.8.0",
     "ts-node": "^10.9.2",
     "vue-eslint-parser": "^10.4.1",
-    "@master/css-schema": "^2.0.0-rc.74"
+    "@master/css-schema": "^2.0.0-rc.76"
   },
-  "version": "2.0.0-rc.74",
+  "version": "2.0.0-rc.76",
   "scripts": {
     "build": "tsdown --config ../../shared/tsdown-package.config.ts",
     "dev": "tsdown --config ../../shared/tsdown-package.config.ts --watch",