@bamboocss/eslint-plugin 1.37.13 → 1.39.0

package/dist/index.cjs

@@ -8,7 +8,7 @@ require("@typescript-eslint/utils/ts-eslint");
 let _bamboocss_shared = require("@bamboocss/shared");
 //#region package.json
 var name = "@bamboocss/eslint-plugin";
-var version = "1.37.13";
+var version = "1.39.0";
 //#endregion
 //#region src/utils/index.ts
 const createRule = _typescript_eslint_utils.ESLintUtils.RuleCreator((name) => `https://github.com/gajus/bamboocss/blob/main/packages/eslint-plugin/docs/rules/${name}.md`);
@@ -302,8 +302,8 @@ function isRecipeVariant(node, context) {
 }
 //#endregion
 //#region src/rules/file-not-included.ts
-const RULE_NAME$21 = "file-not-included";
-const rule$21 = createRule({
+const RULE_NAME$22 = "file-not-included";
+const rule$22 = createRule({
 	create(context) {
 		if (isValidFile(context)) return {};
 		let hasReported = false;
@@ -324,11 +324,11 @@ const rule$21 = createRule({
 		schema: [],
 		type: "problem"
 	},
-	name: RULE_NAME$21
+	name: RULE_NAME$22
 });
 //#endregion
 //#region src/rules/no-config-function-in-source.ts
-const RULE_NAME$20 = "no-config-function-in-source";
+const RULE_NAME$21 = "no-config-function-in-source";
 const CONFIG_FUNCTIONS = new Set([
 	"defineConfig",
 	"defineGlobalStyles",
@@ -343,7 +343,7 @@ const CONFIG_FUNCTIONS = new Set([
 	"defineTokens",
 	"defineUtility"
 ]);
-const rule$20 = createRule({
+const rule$21 = createRule({
 	create(context) {
 		if (!hasPkgImport(context)) return {};
 		if (!isValidFile(context)) return {};
@@ -383,12 +383,12 @@ const rule$20 = createRule({
 		schema: [],
 		type: "problem"
 	},
-	name: RULE_NAME$20
+	name: RULE_NAME$21
 });
 //#endregion
 //#region src/rules/no-debug.ts
-const RULE_NAME$19 = "no-debug";
-const rule$19 = createRule({
+const RULE_NAME$20 = "no-debug";
+const rule$20 = createRule({
 	create(context) {
 		const processedNodes = /* @__PURE__ */ new WeakSet();
 		const checkObjectForDebug = (object) => {
@@ -457,12 +457,12 @@ const rule$19 = createRule({
 		schema: [],
 		type: "problem"
 	},
-	name: RULE_NAME$19
+	name: RULE_NAME$20
 });
 //#endregion
 //#region src/rules/no-deprecated-tokens.ts
-const RULE_NAME$18 = "no-deprecated-tokens";
-const rule$18 = createRule({
+const RULE_NAME$19 = "no-deprecated-tokens";
+const rule$19 = createRule({
 	create(context) {
 		const deprecatedTokensCache = /* @__PURE__ */ new Map();
 		const sendReport = (property, node, value) => {
@@ -516,6 +516,100 @@ const rule$18 = createRule({
 		schema: [],
 		type: "problem"
 	},
+	name: RULE_NAME$19
+});
+//#endregion
+//#region src/rules/no-descendant-selectors.ts
+const RULE_NAME$18 = "no-descendant-selectors";
+/**
+* Split a selector on combinators that are not inside brackets, parentheses or quotes.
+*
+* `:is(p, li)` and `[data-label="a b"]` both contain characters that separate compounds
+* elsewhere, and neither is a combinator. Nesting is shallow by construction — a selector
+* cannot nest brackets inside quotes inside parentheses in a way this misreads — so a depth
+* counter is enough, and it keeps the rule free of a selector parser.
+*/
+const splitTopLevel = (selector, separators) => {
+	const parts = [];
+	let depth = 0;
+	let quote;
+	let escaped = false;
+	let current = "";
+	for (const character of selector) {
+		if (escaped) {
+			escaped = false;
+			current += character;
+			continue;
+		}
+		if (character === "\\") {
+			escaped = true;
+			current += character;
+			continue;
+		}
+		if (quote) {
+			current += character;
+			if (character === quote) quote = void 0;
+			continue;
+		}
+		if (character === "\"" || character === "'") {
+			quote = character;
+			current += character;
+			continue;
+		}
+		if (character === "(" || character === "[") depth++;
+		if (character === ")" || character === "]") depth = Math.max(0, depth - 1);
+		if (depth === 0 && separators.includes(character)) {
+			if (current.trim()) parts.push(current.trim());
+			current = "";
+			continue;
+		}
+		current += character;
+	}
+	if (current.trim()) parts.push(current.trim());
+	return parts;
+};
+/**
+* Does this selector style something other than the element the class is on?
+*
+* Decided by the **subject** — the last compound — rather than by the presence of a
+* combinator. `'.dark &'` and `'.group:hover &'` both contain one and both still style `&`
+* itself, which is how conditions are written and not what this is about. `'& p'`,
+* `'& > .card'` and `'& :is(p, li) a'` end somewhere else, and that is the case that outranks
+* whatever is applied to that element directly.
+*/
+const reachesAnotherElement = (selector) => splitTopLevel(selector, ",").some((part) => {
+	const compounds = splitTopLevel(part, " 	\n>+~");
+	const subject = compounds.at(-1);
+	return compounds.length > 1 && subject !== void 0 && !subject.includes("&");
+});
+const selectorOf = (node) => {
+	if (isLiteral(node) && typeof node.value === "string") return node.value;
+	if (isTemplateLiteral(node) && node.expressions.length === 0) return node.quasis[0]?.value.raw;
+};
+const rule$18 = createRule({
+	create(context) {
+		return { "Property[key.type!=/Identifier/][value.type=\"ObjectExpression\"]"(node) {
+			const selector = selectorOf(node.key);
+			if (!selector?.includes("&")) return;
+			if (!reachesAnotherElement(selector)) return;
+			if (!isInBambooFunction(node, context) && !isInJSXProp(node, context)) return;
+			context.report({
+				messageId: "descendantSelector",
+				node: node.key
+			});
+		} };
+	},
+	defaultOptions: [],
+	meta: {
+		docs: { description: "Disallow nested selectors that style a different element than the class is applied to." },
+		messages: { descendantSelector: [
+			"This styles another element, and outranks anything applied to that element directly.",
+			"Cascade layers do not separate them — two `css()` calls are always in the same layer, where specificity decides, and a nested selector is more specific than a class.",
+			"Style that element itself. Narrowing the selector (`& > p`) bounds what it can reach, which is worth doing, but a descendant rule still outranks a class on its target — so this rule reports it either way."
+		].join(" ") },
+		schema: [],
+		type: "problem"
+	},
 	name: RULE_NAME$18
 });
 //#endregion
@@ -1365,10 +1459,15 @@ const RULE_NAME$8 = "no-unlayered-override";
 * The call whose result is a class string in the `utilities` layer — the same layer a
 * consumer's `css()` is in, so neither can win over the other by cascade.
 *
-* `cva` and `sva` are deliberately absent. Their output is named semantically and emitted
-* into `recipes`, whether they are declared inline or in `theme.recipes`, so a consumer's
-* `css()` beats them by layer in every build. That is the fix this rule points at, and it
-* would be incoherent to report it.
+* `cva` and `sva` are deliberately absent. On the extraction path their output is named
+* semantically and emitted into `recipes`, whether they are declared inline or in
+* `theme.recipes`, so a consumer's `css()` beats them by layer. That is one of the fixes this
+* rule points at, and it would be incoherent to report it.
+*
+* Under the Vite compiler there is no `recipes` layer — selections are resolved to the same
+* global atoms `css()` uses, in `utilities` — so that fix does not apply there and the style
+* object one does. The rule cannot tell which build it is linting for, so the message names
+* both.
 */
 const STYLING_CALLS = new Set(["css"]);
 const calleeName = (node) => {
@@ -1410,7 +1509,7 @@ const rule$8 = createRule({
 		messages: { unlayeredOverride: [
 			"`cx` joins class names, it does not resolve conflicts between them.",
 			"These styles and the ones being joined are both in the `utilities` layer, so which applies is decided by stylesheet order rather than by the caller.",
-			"Declare the component styles with `cva` so they land in the `recipes` layer, or accept a style object and merge it with `css(base, props.css)`."
+			"Accept a style object and merge it with `css(base, props.css)`, which resolves per property in every build — or, on the extraction path only, declare the component styles with `cva` so they land in the `recipes` layer."
 		].join(" ") },
 		schema: [],
 		type: "problem"
@@ -2487,6 +2586,7 @@ const rule = createRule({
 //#endregion
 //#region src/rules/index.ts
 const rules = {
+	[RULE_NAME$22]: rule$22,
 	[RULE_NAME$21]: rule$21,
 	[RULE_NAME$20]: rule$20,
 	[RULE_NAME$19]: rule$19,
@@ -2513,8 +2613,8 @@ const rules = {
 //#endregion
 //#region src/configs/all.ts
 const errorRules = [
+	RULE_NAME$22,
 	RULE_NAME$21,
-	RULE_NAME$20,
 	RULE_NAME$12
 ];
 //#endregion

package/dist/index.mjs

@@ -8,7 +8,7 @@ import "@typescript-eslint/utils/ts-eslint";
 import { getArbitraryValue, parseFallbackValue } from "@bamboocss/shared";
 //#region package.json
 var name = "@bamboocss/eslint-plugin";
-var version = "1.37.13";
+var version = "1.39.0";
 //#endregion
 //#region src/utils/index.ts
 const createRule = ESLintUtils.RuleCreator((name) => `https://github.com/gajus/bamboocss/blob/main/packages/eslint-plugin/docs/rules/${name}.md`);
@@ -302,8 +302,8 @@ function isRecipeVariant(node, context) {
 }
 //#endregion
 //#region src/rules/file-not-included.ts
-const RULE_NAME$21 = "file-not-included";
-const rule$21 = createRule({
+const RULE_NAME$22 = "file-not-included";
+const rule$22 = createRule({
 	create(context) {
 		if (isValidFile(context)) return {};
 		let hasReported = false;
@@ -324,11 +324,11 @@ const rule$21 = createRule({
 		schema: [],
 		type: "problem"
 	},
-	name: RULE_NAME$21
+	name: RULE_NAME$22
 });
 //#endregion
 //#region src/rules/no-config-function-in-source.ts
-const RULE_NAME$20 = "no-config-function-in-source";
+const RULE_NAME$21 = "no-config-function-in-source";
 const CONFIG_FUNCTIONS = new Set([
 	"defineConfig",
 	"defineGlobalStyles",
@@ -343,7 +343,7 @@ const CONFIG_FUNCTIONS = new Set([
 	"defineTokens",
 	"defineUtility"
 ]);
-const rule$20 = createRule({
+const rule$21 = createRule({
 	create(context) {
 		if (!hasPkgImport(context)) return {};
 		if (!isValidFile(context)) return {};
@@ -383,12 +383,12 @@ const rule$20 = createRule({
 		schema: [],
 		type: "problem"
 	},
-	name: RULE_NAME$20
+	name: RULE_NAME$21
 });
 //#endregion
 //#region src/rules/no-debug.ts
-const RULE_NAME$19 = "no-debug";
-const rule$19 = createRule({
+const RULE_NAME$20 = "no-debug";
+const rule$20 = createRule({
 	create(context) {
 		const processedNodes = /* @__PURE__ */ new WeakSet();
 		const checkObjectForDebug = (object) => {
@@ -457,12 +457,12 @@ const rule$19 = createRule({
 		schema: [],
 		type: "problem"
 	},
-	name: RULE_NAME$19
+	name: RULE_NAME$20
 });
 //#endregion
 //#region src/rules/no-deprecated-tokens.ts
-const RULE_NAME$18 = "no-deprecated-tokens";
-const rule$18 = createRule({
+const RULE_NAME$19 = "no-deprecated-tokens";
+const rule$19 = createRule({
 	create(context) {
 		const deprecatedTokensCache = /* @__PURE__ */ new Map();
 		const sendReport = (property, node, value) => {
@@ -516,6 +516,100 @@ const rule$18 = createRule({
 		schema: [],
 		type: "problem"
 	},
+	name: RULE_NAME$19
+});
+//#endregion
+//#region src/rules/no-descendant-selectors.ts
+const RULE_NAME$18 = "no-descendant-selectors";
+/**
+* Split a selector on combinators that are not inside brackets, parentheses or quotes.
+*
+* `:is(p, li)` and `[data-label="a b"]` both contain characters that separate compounds
+* elsewhere, and neither is a combinator. Nesting is shallow by construction — a selector
+* cannot nest brackets inside quotes inside parentheses in a way this misreads — so a depth
+* counter is enough, and it keeps the rule free of a selector parser.
+*/
+const splitTopLevel = (selector, separators) => {
+	const parts = [];
+	let depth = 0;
+	let quote;
+	let escaped = false;
+	let current = "";
+	for (const character of selector) {
+		if (escaped) {
+			escaped = false;
+			current += character;
+			continue;
+		}
+		if (character === "\\") {
+			escaped = true;
+			current += character;
+			continue;
+		}
+		if (quote) {
+			current += character;
+			if (character === quote) quote = void 0;
+			continue;
+		}
+		if (character === "\"" || character === "'") {
+			quote = character;
+			current += character;
+			continue;
+		}
+		if (character === "(" || character === "[") depth++;
+		if (character === ")" || character === "]") depth = Math.max(0, depth - 1);
+		if (depth === 0 && separators.includes(character)) {
+			if (current.trim()) parts.push(current.trim());
+			current = "";
+			continue;
+		}
+		current += character;
+	}
+	if (current.trim()) parts.push(current.trim());
+	return parts;
+};
+/**
+* Does this selector style something other than the element the class is on?
+*
+* Decided by the **subject** — the last compound — rather than by the presence of a
+* combinator. `'.dark &'` and `'.group:hover &'` both contain one and both still style `&`
+* itself, which is how conditions are written and not what this is about. `'& p'`,
+* `'& > .card'` and `'& :is(p, li) a'` end somewhere else, and that is the case that outranks
+* whatever is applied to that element directly.
+*/
+const reachesAnotherElement = (selector) => splitTopLevel(selector, ",").some((part) => {
+	const compounds = splitTopLevel(part, " 	\n>+~");
+	const subject = compounds.at(-1);
+	return compounds.length > 1 && subject !== void 0 && !subject.includes("&");
+});
+const selectorOf = (node) => {
+	if (isLiteral(node) && typeof node.value === "string") return node.value;
+	if (isTemplateLiteral(node) && node.expressions.length === 0) return node.quasis[0]?.value.raw;
+};
+const rule$18 = createRule({
+	create(context) {
+		return { "Property[key.type!=/Identifier/][value.type=\"ObjectExpression\"]"(node) {
+			const selector = selectorOf(node.key);
+			if (!selector?.includes("&")) return;
+			if (!reachesAnotherElement(selector)) return;
+			if (!isInBambooFunction(node, context) && !isInJSXProp(node, context)) return;
+			context.report({
+				messageId: "descendantSelector",
+				node: node.key
+			});
+		} };
+	},
+	defaultOptions: [],
+	meta: {
+		docs: { description: "Disallow nested selectors that style a different element than the class is applied to." },
+		messages: { descendantSelector: [
+			"This styles another element, and outranks anything applied to that element directly.",
+			"Cascade layers do not separate them — two `css()` calls are always in the same layer, where specificity decides, and a nested selector is more specific than a class.",
+			"Style that element itself. Narrowing the selector (`& > p`) bounds what it can reach, which is worth doing, but a descendant rule still outranks a class on its target — so this rule reports it either way."
+		].join(" ") },
+		schema: [],
+		type: "problem"
+	},
 	name: RULE_NAME$18
 });
 //#endregion
@@ -1365,10 +1459,15 @@ const RULE_NAME$8 = "no-unlayered-override";
 * The call whose result is a class string in the `utilities` layer — the same layer a
 * consumer's `css()` is in, so neither can win over the other by cascade.
 *
-* `cva` and `sva` are deliberately absent. Their output is named semantically and emitted
-* into `recipes`, whether they are declared inline or in `theme.recipes`, so a consumer's
-* `css()` beats them by layer in every build. That is the fix this rule points at, and it
-* would be incoherent to report it.
+* `cva` and `sva` are deliberately absent. On the extraction path their output is named
+* semantically and emitted into `recipes`, whether they are declared inline or in
+* `theme.recipes`, so a consumer's `css()` beats them by layer. That is one of the fixes this
+* rule points at, and it would be incoherent to report it.
+*
+* Under the Vite compiler there is no `recipes` layer — selections are resolved to the same
+* global atoms `css()` uses, in `utilities` — so that fix does not apply there and the style
+* object one does. The rule cannot tell which build it is linting for, so the message names
+* both.
 */
 const STYLING_CALLS = new Set(["css"]);
 const calleeName = (node) => {
@@ -1410,7 +1509,7 @@ const rule$8 = createRule({
 		messages: { unlayeredOverride: [
 			"`cx` joins class names, it does not resolve conflicts between them.",
 			"These styles and the ones being joined are both in the `utilities` layer, so which applies is decided by stylesheet order rather than by the caller.",
-			"Declare the component styles with `cva` so they land in the `recipes` layer, or accept a style object and merge it with `css(base, props.css)`."
+			"Accept a style object and merge it with `css(base, props.css)`, which resolves per property in every build — or, on the extraction path only, declare the component styles with `cva` so they land in the `recipes` layer."
 		].join(" ") },
 		schema: [],
 		type: "problem"
@@ -2487,6 +2586,7 @@ const rule = createRule({
 //#endregion
 //#region src/rules/index.ts
 const rules = {
+	[RULE_NAME$22]: rule$22,
 	[RULE_NAME$21]: rule$21,
 	[RULE_NAME$20]: rule$20,
 	[RULE_NAME$19]: rule$19,
@@ -2513,8 +2613,8 @@ const rules = {
 //#endregion
 //#region src/configs/all.ts
 const errorRules = [
+	RULE_NAME$22,
 	RULE_NAME$21,
-	RULE_NAME$20,
 	RULE_NAME$12
 ];
 //#endregion

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bamboocss/eslint-plugin",
-  "version": "1.37.13",
+  "version": "1.39.0",
   "description": "ESLint plugin for Bamboo CSS",
   "homepage": "https://bamboocss.com",
   "license": "MIT",
@@ -36,9 +36,9 @@
     "@typescript-eslint/utils": "^8.21.0",
     "micromatch": "^4.0.8",
     "synckit": "^0.9.0",
-    "@bamboocss/config": "1.37.13",
-    "@bamboocss/generator": "1.37.13",
-    "@bamboocss/shared": "1.37.13"
+    "@bamboocss/config": "1.39.0",
+    "@bamboocss/generator": "1.39.0",
+    "@bamboocss/shared": "1.39.0"
   },
   "devDependencies": {
     "@types/micromatch": "^4.0.10",
@@ -46,10 +46,10 @@
     "eslint": "^9.35.0",
     "multiline-ts": "^4.0.1",
     "typescript": "^5.7.2",
-    "@bamboocss/dev": "1.37.13",
-    "@bamboocss/preset-bamboo": "1.37.13",
-    "@bamboocss/preset-base": "1.37.13",
-    "@bamboocss/types": "1.37.13"
+    "@bamboocss/dev": "1.39.0",
+    "@bamboocss/preset-bamboo": "1.39.0",
+    "@bamboocss/preset-base": "1.39.0",
+    "@bamboocss/types": "1.39.0"
   },
   "peerDependencies": {
     "eslint": "*"