@bamboocss/parser 1.16.0 → 1.17.0

package/dist/index.cjs

@@ -531,7 +531,109 @@ const writtenProps = (node) => {
 * the element renders with no styles at all. Under `atomic` the same call loses one
 * declaration and keeps the rest, which is why this is not reported there.
 */
-const findUnresolvedStyles = (item) => {
+/**
+* A recipe config the build could not fully read, level by level.
+*
+* `findUnresolvedStyles` reads the *call's* literal, which for a recipe holds `base` and
+* `variants` rather than declarations — so a loss inside `base` is nested out of its reach.
+* This walks the written source against the resolved data instead, and reports three ways a
+* level can lose something:
+*
+* - a key written in the source that never arrived in the data — an unresolvable *value*,
+*   which leaves no trace in the box tree because the pair is never recorded at all;
+* - a spread or computed key that contributed no keys beyond those written beside it;
+* - the config not being an object literal at all, so nothing can be compared.
+*
+* Every level is unwrapped first. `as const` and `satisfies` are idiomatic on a recipe
+* config, and reading through them is what the extractor does — a diagnostic that stops at
+* the cast reports nothing for the exact configs most likely to be written that way.
+*/
+const findUnresolvedInValue = (node, resolved, path, out) => {
+	const value = node ? (0, _bamboocss_extractor.unwrapExpression)(node) : void 0;
+	if (!value) return;
+	if (ts_morph.Node.isArrayLiteralExpression(value)) {
+		value.getElements().forEach((element, index) => {
+			const at = path ? `${path}.${index}` : String(index);
+			const element_ = resolved?.[index];
+			if (ts_morph.Node.isSpreadElement(element) && element_ == null) {
+				out.push({
+					prop: at || void 0,
+					reason: "unenumerable-keys"
+				});
+				return;
+			}
+			findUnresolvedInValue(element, element_, at, out);
+		});
+		return;
+	}
+	if (!ts_morph.Node.isObjectLiteralExpression(value)) return;
+	const properties = value.getProperties();
+	const written = [];
+	let uncertain = false;
+	for (const property of properties) {
+		if (ts_morph.Node.isSpreadAssignment(property)) {
+			const spread = (0, _bamboocss_extractor.unwrapExpression)(property.getExpression());
+			if (ts_morph.Node.isObjectLiteralExpression(spread)) {
+				for (const inner of spread.getProperties()) {
+					if (!ts_morph.Node.isPropertyAssignment(inner) && !ts_morph.Node.isShorthandPropertyAssignment(inner)) continue;
+					const innerName = inner.getName();
+					if (!innerName.startsWith("[")) written.push(innerName.replace(/^['"]|['"]$/g, ""));
+				}
+				continue;
+			}
+			uncertain = true;
+			continue;
+		}
+		if (!ts_morph.Node.isPropertyAssignment(property) && !ts_morph.Node.isShorthandPropertyAssignment(property)) continue;
+		const name = property.getName();
+		if (name.startsWith("[")) {
+			uncertain = true;
+			continue;
+		}
+		written.push(name.replace(/^['"]|['"]$/g, ""));
+	}
+	const resolvedKeys = Boolean(resolved) && typeof resolved === "object" ? Object.keys(resolved) : [];
+	for (const name of written) if (!resolvedKeys.includes(name)) out.push({
+		prop: path ? `${path}.${name}` : name,
+		reason: "missing-property"
+	});
+	if (uncertain && !resolvedKeys.some((key) => !written.includes(key))) out.push({
+		prop: path || void 0,
+		reason: "unenumerable-keys"
+	});
+	for (const property of properties) {
+		if (!ts_morph.Node.isPropertyAssignment(property)) continue;
+		const name = property.getName().replace(/^['"]|['"]$/g, "");
+		if (name.startsWith("[")) continue;
+		findUnresolvedInValue(property.getInitializer(), resolved?.[name], path ? `${path}.${name}` : name, out);
+	}
+};
+/** A recipe config the build could not fully read — see `findUnresolvedInValue`. */
+const findUnresolvedRecipeStyles = (item) => {
+	const node = item.box?.getNode();
+	const sourceFile = node?.getSourceFile();
+	if (!node || !sourceFile) return [];
+	let argument = node;
+	if (ts_morph.Node.isCallExpression(argument)) {
+		const args = argument.getArguments();
+		if (args.length !== 1) return [];
+		argument = args[0];
+	}
+	const losses = [];
+	const config = argument ? (0, _bamboocss_extractor.unwrapExpression)(argument) : void 0;
+	if (!config || !ts_morph.Node.isObjectLiteralExpression(config)) losses.push({ reason: "unresolvable-value" });
+	else findUnresolvedInValue(config, item.data[0], "", losses);
+	if (!losses.length) return [];
+	const { line, column } = sourceFile.getLineAndColumnAtPos(node.getStart());
+	return losses.map((loss) => ({
+		column,
+		filePath: sourceFile.getFilePath(),
+		kind: "recipe",
+		line,
+		...loss
+	}));
+};
+const findUnresolvedStyles = (item, kind) => {
 	const boxNode = item.box;
 	if (!boxNode) return [];
 	const node = boxNode.getNode();
@@ -563,6 +665,7 @@ const findUnresolvedStyles = (item) => {
 	};
 	return losses.map((loss) => ({
 		...at,
+		kind,
 		...loss
 	}));
 };
@@ -617,6 +720,7 @@ var ParserResult = class {
 		const { line, column } = sourceFile.getLineAndColumnAtPos(node.getStart());
 		this.unresolved.push({
 			filePath: sourceFile.getFilePath(),
+			kind: "grouped",
 			line,
 			column,
 			reason
@@ -648,12 +752,10 @@ var ParserResult = class {
 		const encoder = this.encoder;
 		const grouped = this.context.config.cssMode === "grouped";
 		const data = result.data.some(Array.isArray) ? result.data.flatMap((obj) => Array.isArray(obj) ? obj : [obj]) : result.data;
-		if (grouped) {
-			const unresolved = findUnresolvedStyles(result);
-			if (unresolved.length) {
-				this.unresolved.push(...unresolved);
-				data.forEach((obj) => encoder.processAtomic(obj));
-			}
+		const unresolved = findUnresolvedStyles(result, grouped ? "grouped" : "atomic").filter((entry) => grouped || entry.reason === "unenumerable-keys");
+		if (unresolved.length) {
+			this.unresolved.push(...unresolved);
+			if (grouped) data.forEach((obj) => encoder.processAtomic(obj));
 		}
 		if (!grouped || data.length <= 1) {
 			data.forEach((obj) => grouped ? encoder.processGrouped(obj) : encoder.processAtomic(obj));
@@ -707,14 +809,37 @@ var ParserResult = class {
 	}
 	setCva(result) {
 		this.cva.add(this.append(Object.assign({ type: "cva" }, result)));
+		this.reportUnresolvedRecipe(result);
 		const encoder = this.encoder;
 		result.data.forEach((data) => encoder.processAtomicRecipe(data));
 	}
 	setSva(result) {
 		this.sva.add(this.append(Object.assign({ type: "sva" }, result)));
+		this.reportUnresolvedRecipe(result);
 		const encoder = this.encoder;
 		result.data.forEach((data) => encoder.processAtomicSlotRecipe(data));
 	}
+	/**
+	* Record a recipe config the build could not fully read.
+	*
+	* Not gated on `cssMode`, unlike the `css()` check in `setCss`. That one exists because
+	* grouping names a whole call with one class; this one exists because a recipe is named
+	* from a *hash of its config*, which is true in every mode. A declaration the build cannot
+	* see changes the hash, so the build emits rules under one name and the browser asks for
+	* another, and the element renders with no styles at all.
+	*
+	* There is no fallback to pair with it either. Grouped can emit atomic rules alongside the
+	* group and let the runtime's degraded naming land on them; nothing can rescue a diverged
+	* hash except an explicit `className`, which is what the message says to reach for.
+	*/
+	reportUnresolvedRecipe(result) {
+		if (result.data.every((data) => {
+			const className = data?.className;
+			return typeof className === "string" && className !== "";
+		})) return;
+		const unresolved = findUnresolvedRecipeStyles(result);
+		if (unresolved.length) this.unresolved.push(...unresolved);
+	}
 	setToken(result) {
 		this.token.add(this.append(Object.assign({ type: "token" }, result)));
 	}
@@ -747,7 +872,7 @@ var ParserResult = class {
 	*/
 	groupIsExact(result) {
 		if (result.data.length !== 1) return false;
-		return findUnresolvedStyles(result).length === 0;
+		return findUnresolvedStyles(result, "grouped").length === 0;
 	}
 	setRecipe(recipeName, result) {
 		(0, _bamboocss_shared.getOrCreateSet)(this.recipe, recipeName).add(this.append(Object.assign({ type: "recipe" }, result)));

package/dist/index.d.cts

@@ -135,6 +135,19 @@ declare class Generator extends Context {
 //#endregion
 //#region src/unresolved-styles.d.ts
 interface UnresolvedStyle {
+  /**
+   * What the loss costs, which decides how it is explained.
+   *
+   * - `grouped` — a `css()` call under `cssMode: 'grouped'`. It degrades: the runtime falls
+   *   back to naming each declaration, and the build emits atomic rules alongside the group
+   *   so the ones it resolved still apply.
+   * - `atomic` — a `css()` call under `cssMode: 'atomic'`. The declarations the build saw
+   *   still apply; the ones it did not have no rule behind them, so they are simply absent.
+   * - `recipe` — a `cva`/`sva` config. There is no degrading. A recipe's classes are named
+   *   from a hash of its config, so a declaration the build cannot see gives the two sides
+   *   different names and *every* rule misses.
+   */
+  kind: 'grouped' | 'atomic' | 'recipe';
   /** The property the build could not resolve, or `undefined` when only the count differs. */
   prop?: string;
   filePath: string;
@@ -152,15 +165,7 @@ interface UnresolvedStyle {
    */
   reason: 'unresolvable-value' | 'missing-property' | 'unenumerable-keys' | 'ambiguous-merge' | 'too-many-combinations';
 }
-/**
- * Every property of a `css()` call that will not reach the stylesheet.
- *
- * Only meaningful under `cssMode: 'grouped'`, where one class names the whole call: a
- * property the build cannot resolve does not merely go missing, it changes the class, and
- * the element renders with no styles at all. Under `atomic` the same call loses one
- * declaration and keeps the rest, which is why this is not reported there.
- */
-declare const findUnresolvedStyles: (item: ResultItem) => UnresolvedStyle[];
+declare const findUnresolvedStyles: (item: ResultItem, kind: "grouped" | "atomic") => UnresolvedStyle[];
 //#endregion
 //#region src/parser-result.d.ts
 declare class ParserResult implements ParserResultInterface {
@@ -205,6 +210,20 @@ declare class ParserResult implements ParserResultInterface {
   private callArgumentCount;
   setCva(result: ResultItem): void;
   setSva(result: ResultItem): void;
+  /**
+   * Record a recipe config the build could not fully read.
+   *
+   * Not gated on `cssMode`, unlike the `css()` check in `setCss`. That one exists because
+   * grouping names a whole call with one class; this one exists because a recipe is named
+   * from a *hash of its config*, which is true in every mode. A declaration the build cannot
+   * see changes the hash, so the build emits rules under one name and the browser asks for
+   * another, and the element renders with no styles at all.
+   *
+   * There is no fallback to pair with it either. Grouped can emit atomic rules alongside the
+   * group and let the runtime's degraded naming land on them; nothing can rescue a diverged
+   * hash except an explicit `className`, which is what the message says to reach for.
+   */
+  private reportUnresolvedRecipe;
   setToken(result: ResultItem): void;
   setViewTransition(result: ResultItem): void;
   setPattern(name: string, result: ResultItem): void;

package/dist/index.d.mts

@@ -135,6 +135,19 @@ declare class Generator extends Context {
 //#endregion
 //#region src/unresolved-styles.d.ts
 interface UnresolvedStyle {
+  /**
+   * What the loss costs, which decides how it is explained.
+   *
+   * - `grouped` — a `css()` call under `cssMode: 'grouped'`. It degrades: the runtime falls
+   *   back to naming each declaration, and the build emits atomic rules alongside the group
+   *   so the ones it resolved still apply.
+   * - `atomic` — a `css()` call under `cssMode: 'atomic'`. The declarations the build saw
+   *   still apply; the ones it did not have no rule behind them, so they are simply absent.
+   * - `recipe` — a `cva`/`sva` config. There is no degrading. A recipe's classes are named
+   *   from a hash of its config, so a declaration the build cannot see gives the two sides
+   *   different names and *every* rule misses.
+   */
+  kind: 'grouped' | 'atomic' | 'recipe';
   /** The property the build could not resolve, or `undefined` when only the count differs. */
   prop?: string;
   filePath: string;
@@ -152,15 +165,7 @@ interface UnresolvedStyle {
    */
   reason: 'unresolvable-value' | 'missing-property' | 'unenumerable-keys' | 'ambiguous-merge' | 'too-many-combinations';
 }
-/**
- * Every property of a `css()` call that will not reach the stylesheet.
- *
- * Only meaningful under `cssMode: 'grouped'`, where one class names the whole call: a
- * property the build cannot resolve does not merely go missing, it changes the class, and
- * the element renders with no styles at all. Under `atomic` the same call loses one
- * declaration and keeps the rest, which is why this is not reported there.
- */
-declare const findUnresolvedStyles: (item: ResultItem) => UnresolvedStyle[];
+declare const findUnresolvedStyles: (item: ResultItem, kind: "grouped" | "atomic") => UnresolvedStyle[];
 //#endregion
 //#region src/parser-result.d.ts
 declare class ParserResult implements ParserResultInterface {
@@ -205,6 +210,20 @@ declare class ParserResult implements ParserResultInterface {
   private callArgumentCount;
   setCva(result: ResultItem): void;
   setSva(result: ResultItem): void;
+  /**
+   * Record a recipe config the build could not fully read.
+   *
+   * Not gated on `cssMode`, unlike the `css()` check in `setCss`. That one exists because
+   * grouping names a whole call with one class; this one exists because a recipe is named
+   * from a *hash of its config*, which is true in every mode. A declaration the build cannot
+   * see changes the hash, so the build emits rules under one name and the browser asks for
+   * another, and the element renders with no styles at all.
+   *
+   * There is no fallback to pair with it either. Grouped can emit atomic rules alongside the
+   * group and let the runtime's degraded naming land on them; nothing can rescue a diverged
+   * hash except an explicit `className`, which is what the message says to reach for.
+   */
+  private reportUnresolvedRecipe;
   setToken(result: ResultItem): void;
   setViewTransition(result: ResultItem): void;
   setPattern(name: string, result: ResultItem): void;

package/dist/index.mjs

@@ -1,5 +1,5 @@
 import { Node, Project as Project$1, ScriptKind, ts } from "ts-morph";
-import { box, clearBoxNodeCache, extract, unbox } from "@bamboocss/extractor";
+import { box, clearBoxNodeCache, extract, unbox, unwrapExpression } from "@bamboocss/extractor";
 import { BambooError, compact, getOrCreateSet, patternFns } from "@bamboocss/shared";
 import { logger } from "@bamboocss/logger";
 import { match } from "ts-pattern";
@@ -530,7 +530,109 @@ const writtenProps = (node) => {
 * the element renders with no styles at all. Under `atomic` the same call loses one
 * declaration and keeps the rest, which is why this is not reported there.
 */
-const findUnresolvedStyles = (item) => {
+/**
+* A recipe config the build could not fully read, level by level.
+*
+* `findUnresolvedStyles` reads the *call's* literal, which for a recipe holds `base` and
+* `variants` rather than declarations — so a loss inside `base` is nested out of its reach.
+* This walks the written source against the resolved data instead, and reports three ways a
+* level can lose something:
+*
+* - a key written in the source that never arrived in the data — an unresolvable *value*,
+*   which leaves no trace in the box tree because the pair is never recorded at all;
+* - a spread or computed key that contributed no keys beyond those written beside it;
+* - the config not being an object literal at all, so nothing can be compared.
+*
+* Every level is unwrapped first. `as const` and `satisfies` are idiomatic on a recipe
+* config, and reading through them is what the extractor does — a diagnostic that stops at
+* the cast reports nothing for the exact configs most likely to be written that way.
+*/
+const findUnresolvedInValue = (node, resolved, path, out) => {
+	const value = node ? unwrapExpression(node) : void 0;
+	if (!value) return;
+	if (Node.isArrayLiteralExpression(value)) {
+		value.getElements().forEach((element, index) => {
+			const at = path ? `${path}.${index}` : String(index);
+			const element_ = resolved?.[index];
+			if (Node.isSpreadElement(element) && element_ == null) {
+				out.push({
+					prop: at || void 0,
+					reason: "unenumerable-keys"
+				});
+				return;
+			}
+			findUnresolvedInValue(element, element_, at, out);
+		});
+		return;
+	}
+	if (!Node.isObjectLiteralExpression(value)) return;
+	const properties = value.getProperties();
+	const written = [];
+	let uncertain = false;
+	for (const property of properties) {
+		if (Node.isSpreadAssignment(property)) {
+			const spread = unwrapExpression(property.getExpression());
+			if (Node.isObjectLiteralExpression(spread)) {
+				for (const inner of spread.getProperties()) {
+					if (!Node.isPropertyAssignment(inner) && !Node.isShorthandPropertyAssignment(inner)) continue;
+					const innerName = inner.getName();
+					if (!innerName.startsWith("[")) written.push(innerName.replace(/^['"]|['"]$/g, ""));
+				}
+				continue;
+			}
+			uncertain = true;
+			continue;
+		}
+		if (!Node.isPropertyAssignment(property) && !Node.isShorthandPropertyAssignment(property)) continue;
+		const name = property.getName();
+		if (name.startsWith("[")) {
+			uncertain = true;
+			continue;
+		}
+		written.push(name.replace(/^['"]|['"]$/g, ""));
+	}
+	const resolvedKeys = Boolean(resolved) && typeof resolved === "object" ? Object.keys(resolved) : [];
+	for (const name of written) if (!resolvedKeys.includes(name)) out.push({
+		prop: path ? `${path}.${name}` : name,
+		reason: "missing-property"
+	});
+	if (uncertain && !resolvedKeys.some((key) => !written.includes(key))) out.push({
+		prop: path || void 0,
+		reason: "unenumerable-keys"
+	});
+	for (const property of properties) {
+		if (!Node.isPropertyAssignment(property)) continue;
+		const name = property.getName().replace(/^['"]|['"]$/g, "");
+		if (name.startsWith("[")) continue;
+		findUnresolvedInValue(property.getInitializer(), resolved?.[name], path ? `${path}.${name}` : name, out);
+	}
+};
+/** A recipe config the build could not fully read — see `findUnresolvedInValue`. */
+const findUnresolvedRecipeStyles = (item) => {
+	const node = item.box?.getNode();
+	const sourceFile = node?.getSourceFile();
+	if (!node || !sourceFile) return [];
+	let argument = node;
+	if (Node.isCallExpression(argument)) {
+		const args = argument.getArguments();
+		if (args.length !== 1) return [];
+		argument = args[0];
+	}
+	const losses = [];
+	const config = argument ? unwrapExpression(argument) : void 0;
+	if (!config || !Node.isObjectLiteralExpression(config)) losses.push({ reason: "unresolvable-value" });
+	else findUnresolvedInValue(config, item.data[0], "", losses);
+	if (!losses.length) return [];
+	const { line, column } = sourceFile.getLineAndColumnAtPos(node.getStart());
+	return losses.map((loss) => ({
+		column,
+		filePath: sourceFile.getFilePath(),
+		kind: "recipe",
+		line,
+		...loss
+	}));
+};
+const findUnresolvedStyles = (item, kind) => {
 	const boxNode = item.box;
 	if (!boxNode) return [];
 	const node = boxNode.getNode();
@@ -562,6 +664,7 @@ const findUnresolvedStyles = (item) => {
 	};
 	return losses.map((loss) => ({
 		...at,
+		kind,
 		...loss
 	}));
 };
@@ -616,6 +719,7 @@ var ParserResult = class {
 		const { line, column } = sourceFile.getLineAndColumnAtPos(node.getStart());
 		this.unresolved.push({
 			filePath: sourceFile.getFilePath(),
+			kind: "grouped",
 			line,
 			column,
 			reason
@@ -647,12 +751,10 @@ var ParserResult = class {
 		const encoder = this.encoder;
 		const grouped = this.context.config.cssMode === "grouped";
 		const data = result.data.some(Array.isArray) ? result.data.flatMap((obj) => Array.isArray(obj) ? obj : [obj]) : result.data;
-		if (grouped) {
-			const unresolved = findUnresolvedStyles(result);
-			if (unresolved.length) {
-				this.unresolved.push(...unresolved);
-				data.forEach((obj) => encoder.processAtomic(obj));
-			}
+		const unresolved = findUnresolvedStyles(result, grouped ? "grouped" : "atomic").filter((entry) => grouped || entry.reason === "unenumerable-keys");
+		if (unresolved.length) {
+			this.unresolved.push(...unresolved);
+			if (grouped) data.forEach((obj) => encoder.processAtomic(obj));
 		}
 		if (!grouped || data.length <= 1) {
 			data.forEach((obj) => grouped ? encoder.processGrouped(obj) : encoder.processAtomic(obj));
@@ -706,14 +808,37 @@ var ParserResult = class {
 	}
 	setCva(result) {
 		this.cva.add(this.append(Object.assign({ type: "cva" }, result)));
+		this.reportUnresolvedRecipe(result);
 		const encoder = this.encoder;
 		result.data.forEach((data) => encoder.processAtomicRecipe(data));
 	}
 	setSva(result) {
 		this.sva.add(this.append(Object.assign({ type: "sva" }, result)));
+		this.reportUnresolvedRecipe(result);
 		const encoder = this.encoder;
 		result.data.forEach((data) => encoder.processAtomicSlotRecipe(data));
 	}
+	/**
+	* Record a recipe config the build could not fully read.
+	*
+	* Not gated on `cssMode`, unlike the `css()` check in `setCss`. That one exists because
+	* grouping names a whole call with one class; this one exists because a recipe is named
+	* from a *hash of its config*, which is true in every mode. A declaration the build cannot
+	* see changes the hash, so the build emits rules under one name and the browser asks for
+	* another, and the element renders with no styles at all.
+	*
+	* There is no fallback to pair with it either. Grouped can emit atomic rules alongside the
+	* group and let the runtime's degraded naming land on them; nothing can rescue a diverged
+	* hash except an explicit `className`, which is what the message says to reach for.
+	*/
+	reportUnresolvedRecipe(result) {
+		if (result.data.every((data) => {
+			const className = data?.className;
+			return typeof className === "string" && className !== "";
+		})) return;
+		const unresolved = findUnresolvedRecipeStyles(result);
+		if (unresolved.length) this.unresolved.push(...unresolved);
+	}
 	setToken(result) {
 		this.token.add(this.append(Object.assign({ type: "token" }, result)));
 	}
@@ -746,7 +871,7 @@ var ParserResult = class {
 	*/
 	groupIsExact(result) {
 		if (result.data.length !== 1) return false;
-		return findUnresolvedStyles(result).length === 0;
+		return findUnresolvedStyles(result, "grouped").length === 0;
 	}
 	setRecipe(recipeName, result) {
 		getOrCreateSet(this.recipe, recipeName).add(this.append(Object.assign({ type: "recipe" }, result)));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bamboocss/parser",
-  "version": "1.16.0",
+  "version": "1.17.0",
   "description": "The static parser for bamboo css",
   "homepage": "https://bamboocss.com",
   "license": "MIT",
@@ -34,17 +34,17 @@
   "dependencies": {
     "ts-morph": "28.0.0",
     "ts-pattern": "5.9.0",
-    "@bamboocss/config": "^1.16.0",
-    "@bamboocss/core": "^1.16.0",
-    "@bamboocss/extractor": "1.16.0",
-    "@bamboocss/logger": "1.16.0",
-    "@bamboocss/shared": "1.16.0",
-    "@bamboocss/types": "1.16.0"
+    "@bamboocss/config": "^1.17.0",
+    "@bamboocss/core": "^1.17.0",
+    "@bamboocss/extractor": "1.17.0",
+    "@bamboocss/logger": "1.17.0",
+    "@bamboocss/shared": "1.17.0",
+    "@bamboocss/types": "1.17.0"
   },
   "devDependencies": {
-    "@bamboocss/generator": "1.16.0",
-    "@bamboocss/plugin-svelte": "1.16.0",
-    "@bamboocss/plugin-vue": "1.16.0"
+    "@bamboocss/generator": "1.17.0",
+    "@bamboocss/plugin-svelte": "1.17.0",
+    "@bamboocss/plugin-vue": "1.17.0"
   },
   "scripts": {
     "build": "tsdown src/index.ts --format=esm,cjs --dts",