@bamboocss/parser 1.14.0 → 1.16.0

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import { FileSystemRefreshResult, Project as Project$1, ProjectOptions as ProjectOptions$1, SourceFile } from "ts-morph";
 import { Context, ParserOptions, StyleDecoder, Stylesheet } from "@bamboocss/core";
-import { ArtifactId, BambooHooks, ConfigTsOptions, CssArtifactType, JsxFactoryResultTransform, LoadConfigResult, ParserResultConfigureOptions, ParserResultInterface, ResultItem, Runtime, SpecFile, SpecType, SpecTypeMap } from "@bamboocss/types";
+import { ArtifactId, BambooHooks, ConfigTsOptions, CssArtifactType, LoadConfigResult, ParserResultConfigureOptions, ParserResultInterface, ResultItem, Runtime, SpecFile, SpecType, SpecTypeMap } from "@bamboocss/types";
 
 //#region ../generator/dist/index.d.cts
 //#region src/generator.d.ts
@@ -93,6 +93,20 @@ declare class Generator extends Context {
    */
   private getAlwaysKeptTokenVars;
   getParserCss: (decoder: StyleDecoder) => string;
+  /**
+   * The grouped class names this build emitted a rule for.
+   *
+   * Derived from the encoder rather than the decoder, so it is available as soon as
+   * extraction finishes and before a stylesheet exists. Both sides go through
+   * `groupClassName`, which is the same function the browser runtime calls — a registry
+   * built any other way would be a third spelling of a name that already has two.
+   *
+   * Unescaped, unlike `StyleDecoder`'s class names: this is compared against what `css()`
+   * returns into a `class` attribute, not against a selector. A grouped class is an opaque
+   * hash, so the two only differ in principle, but the principle is the one that matters
+   * here — the registry is only useful if it holds exactly what the runtime will ask about.
+   */
+  getGroupRegistry: () => string[];
   getCss: (stylesheet?: Stylesheet) => string;
   /**
    * Get CSS for a specific layer from the stylesheet
@@ -119,29 +133,94 @@ declare class Generator extends Context {
  * Get CSS for a specific theme
  */
 //#endregion
+//#region src/unresolved-styles.d.ts
+interface UnresolvedStyle {
+  /** The property the build could not resolve, or `undefined` when only the count differs. */
+  prop?: string;
+  filePath: string;
+  line: number;
+  column: number;
+  /**
+   * How the build lost the call:
+   *
+   * - `unresolvable-value` — a value it could not evaluate.
+   * - `missing-property` — a key that never arrived in the box tree at all.
+   * - `unenumerable-keys` — a spread or computed key, so it cannot say what the call sets.
+   * - `ambiguous-merge` — two arguments setting one property, which it cannot tell from a
+   *   pair of alternatives.
+   * - `too-many-combinations` — more ternary branches than it will enumerate.
+   */
+  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[];
+//#endregion
 //#region src/parser-result.d.ts
 declare class ParserResult implements ParserResultInterface {
   private context;
   /** Ordered list of all ResultItem */
   all: ResultItem[];
-  jsx: Set<ResultItem>;
   css: Set<ResultItem>;
   cva: Set<ResultItem>;
   sva: Set<ResultItem>;
   token: Set<ResultItem>;
+  viewTransition: Set<ResultItem>;
   recipe: Map<string, Set<ResultItem>>;
   pattern: Map<string, Set<ResultItem>>;
   filePath: string | undefined;
   encoder: ParserOptions['encoder'];
+  /**
+   * `css()` calls whose styles the build could not fully see.
+   *
+   * Only collected under `cssMode: 'grouped'`, where one class names the whole call, so a
+   * property the build cannot resolve changes the class rather than dropping a declaration
+   * from it — and the element renders with no styles at all. Under `atomic` the same call
+   * keeps everything the build did resolve, which is not worth interrupting a build over.
+   */
+  unresolved: UnresolvedStyle[];
   constructor(context: ParserOptions, encoder?: ParserOptions['encoder']);
+  /**
+   * Record a call whose styles the build could not fully see, at the call's own position.
+   *
+   * Used for losses the box tree cannot show — a ternary past the combination cap emits
+   * fragments rather than whole objects, and every individual box in it resolved fine.
+   */
+  private reportUnresolved;
   append(result: ResultItem): ResultItem;
   set(name: 'cva' | 'css' | 'sva' | 'token', result: ResultItem): void;
   setCss(result: ResultItem): void;
+  /**
+   * How many arguments the call this result came from was written with.
+   *
+   * Returns 1 for anything that is not a call — a JSX element, or a box that lost its node —
+   * since the question only separates operands from branches and neither has operands.
+   */
+  private callArgumentCount;
   setCva(result: ResultItem): void;
   setSva(result: ResultItem): void;
   setToken(result: ResultItem): void;
-  setJsx(result: ResultItem): void;
+  setViewTransition(result: ResultItem): void;
   setPattern(name: string, result: ResultItem): void;
+  /**
+   * Whether the group encoded for this result is the one the runtime will ask for.
+   *
+   * True only when the build saw the whole thing at once: one style object, with every
+   * value in it resolved. Several objects means the runtime merges them into a call this
+   * never encoded — `setCss` reconstructs those combinations, and nothing else does — and
+   * an unresolved value means the merge would not have matched anyway.
+   *
+   * Answering "no" costs a call site its atomic rules, which is CSS that duplicates the
+   * group. Answering a wrong "yes" costs the element every style it has, so this is
+   * deliberately conservative.
+   */
+  private groupIsExact;
   setRecipe(recipeName: string, result: ResultItem): void;
   isEmpty(): boolean;
   setFilePath(filePath: string): this;
@@ -152,7 +231,7 @@ declare class ParserResult implements ParserResultInterface {
     cva: ResultItem[];
     sva: ResultItem[];
     token: ResultItem[];
-    jsx: ResultItem[];
+    viewTransition: ResultItem[];
     recipe: {
       [k: string]: ResultItem[];
     };
@@ -163,7 +242,7 @@ declare class ParserResult implements ParserResultInterface {
 }
 //#endregion
 //#region src/parser.d.ts
-declare function createParser(context: ParserOptions): (sourceFile: SourceFile | undefined, encoder?: Generator["encoder"], options?: ParserResultConfigureOptions & Partial<JsxFactoryResultTransform>) => ParserResult | undefined;
+declare function createParser(context: ParserOptions): (sourceFile: SourceFile | undefined, encoder?: Generator["encoder"], options?: ParserResultConfigureOptions) => ParserResult | undefined;
 //#endregion
 //#region src/project.d.ts
 interface ProjectOptions extends ProjectOptions$1 {
@@ -248,4 +327,4 @@ declare class Project {
   classify: (fileMap: Map<string, ParserResultInterface>) => import("@bamboocss/types").ClassifyReport;
 }
 //#endregion
-export { ParserResult, Project, ProjectOptions };
+export { ParserResult, Project, ProjectOptions, type UnresolvedStyle, findUnresolvedStyles };

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import { Node, Project as Project$1, ScriptKind, ts } from "ts-morph";
 import { box, clearBoxNodeCache, extract, unbox } from "@bamboocss/extractor";
-import { BambooError, astish, compact, getOrCreateSet, patternFns } from "@bamboocss/shared";
+import { BambooError, compact, getOrCreateSet, patternFns } from "@bamboocss/shared";
 import { logger } from "@bamboocss/logger";
 import { match } from "ts-pattern";
 import { resolveTsPathPattern } from "@bamboocss/config/ts-path";
@@ -43,7 +43,7 @@ function classifyProject(ctx, resultMap) {
 	const processPattern = (opts) => {
 		const { boxNode, data, item, filepath, localMaps } = opts;
 		const name = item.componentName;
-		const pattern = ctx.patterns.details.find((p) => p.match.test(name) || p.baseName === name);
+		const pattern = ctx.patterns.details.find((p) => p.baseName === name);
 		if (!pattern) return;
 		const cssObj = pattern.config.transform?.(data || {}, patternFns) ?? {};
 		const newItem = {
@@ -75,7 +75,7 @@ function classifyProject(ctx, resultMap) {
 			contains: [],
 			debug: Reflect.has(item, "debug")
 		};
-		if (item.type === "pattern" || item.type === "jsx-pattern") return processPattern({
+		if (item.type === "pattern") return processPattern({
 			boxNode: item.box,
 			data: item.data[0],
 			item: componentReportItem,
@@ -200,14 +200,6 @@ function classifyProject(ctx, resultMap) {
 	resultMap.forEach((parserResult, filepath) => {
 		if (parserResult.isEmpty()) return;
 		const localMaps = createReportMaps();
-		const componentFn = (item) => {
-			processResultItemFn({
-				item,
-				filepath,
-				localMaps,
-				type: "component"
-			});
-		};
 		const functionFn = (item) => {
 			processResultItemFn({
 				item,
@@ -216,7 +208,6 @@ function classifyProject(ctx, resultMap) {
 				type: "function"
 			});
 		};
-		parserResult.jsx.forEach(componentFn);
 		parserResult.css.forEach(functionFn);
 		parserResult.cva.forEach(functionFn);
 		parserResult.pattern.forEach((itemList) => {
@@ -465,6 +456,120 @@ function getImportDeclarations(context, sourceFile) {
 	return importDeclarations;
 }
 //#endregion
+//#region src/unresolved-styles.ts
+/**
+* Whether every box under this one carries a value the build can actually see.
+*
+* Mirrors `isStaticBox` in `@bamboocss/vite`, which asks the same question to decide
+* whether a call is safe to fold. Duplicated rather than shared for now because the fold's
+* copy also answers questions about ternaries that a diagnostic does not care about;
+* unifying them is worth doing when the fold's detection moves out of the vite package.
+*/
+const findUnresolvable = (node, path, out, seen = /* @__PURE__ */ new Set()) => {
+	if (!node || seen.has(node)) return;
+	seen.add(node);
+	if (box.isUnresolvable(node)) {
+		out.push(path.join("."));
+		return;
+	}
+	if (box.isConditional(node)) return;
+	if (box.isLiteral(node) && node.value === void 0) {
+		if (Node.isTemplateExpression(node.getNode())) out.push(path.join("."));
+		return;
+	}
+	if (box.isMap(node)) {
+		for (const [key, child] of node.value) findUnresolvable(child, [...path, key], out, seen);
+		return;
+	}
+	if (box.isArray(node)) node.value.forEach((child, index) => findUnresolvable(child, [...path, String(index)], out, seen));
+};
+/**
+* Property names written at the top level of the call's own object literal.
+*
+* A key whose value the extractor could not evaluate at all is not boxed as
+* `unresolvable` — `maybeBoxNode` returns nothing and the pair is never recorded
+* (`get-object-literal-expression-prop-pairs.ts` has no fallback), so the property
+* disappears with no trace in the box tree. Reading the source back is the only way to
+* notice, and it is why `css({ color: getColor() })` needs this and not just the walk above.
+*
+* Returns `undefined` only when the argument is not a single object literal at all, so the
+* caller reports nothing rather than something wrong.
+*/
+const writtenProps = (node) => {
+	let literal = node;
+	if (literal && Node.isCallExpression(literal)) {
+		const args = literal.getArguments();
+		if (args.length !== 1) return void 0;
+		literal = args[0];
+	}
+	if (!literal || !Node.isObjectLiteralExpression(literal)) return void 0;
+	const names = [];
+	let uncertain = false;
+	for (const property of literal.getProperties()) {
+		if (Node.isPropertyAssignment(property) || Node.isShorthandPropertyAssignment(property)) {
+			const name = property.getName();
+			if (name.startsWith("[")) {
+				uncertain = true;
+				continue;
+			}
+			names.push(name.replace(/^['"]|['"]$/g, ""));
+			continue;
+		}
+		uncertain = true;
+	}
+	return {
+		names,
+		uncertain
+	};
+};
+/**
+* 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.
+*/
+const findUnresolvedStyles = (item) => {
+	const boxNode = item.box;
+	if (!boxNode) return [];
+	const node = boxNode.getNode();
+	const sourceFile = node?.getSourceFile();
+	if (!node || !sourceFile) return [];
+	const found = [];
+	findUnresolvable(boxNode, [], found);
+	const losses = found.map((prop) => ({
+		prop: prop || void 0,
+		reason: "unresolvable-value"
+	}));
+	const written = writtenProps(node);
+	if (written) {
+		const resolved = /* @__PURE__ */ new Set();
+		for (const entry of item.data) if (entry && typeof entry === "object") for (const key of Object.keys(entry)) resolved.add(key);
+		if (box.isMap(boxNode)) for (const key of boxNode.value.keys()) resolved.add(key);
+		for (const prop of written.names) if (!resolved.has(prop)) losses.push({
+			prop,
+			reason: "missing-property"
+		});
+		if (written.uncertain && !hasKeyOutside(resolved, written.names)) losses.push({ reason: "unenumerable-keys" });
+	}
+	if (!losses.length) return [];
+	const { line, column } = sourceFile.getLineAndColumnAtPos(node.getStart());
+	const at = {
+		filePath: sourceFile.getFilePath(),
+		line,
+		column
+	};
+	return losses.map((loss) => ({
+		...at,
+		...loss
+	}));
+};
+const hasKeyOutside = (resolved, names) => {
+	for (const key of resolved) if (!names.includes(key)) return true;
+	return false;
+};
+//#endregion
 //#region src/parser-result.ts
 function cartesian(arrays) {
 	if (arrays.length === 0) return [[]];
@@ -476,19 +581,46 @@ var ParserResult = class {
 	context;
 	/** Ordered list of all ResultItem */
 	all = [];
-	jsx = /* @__PURE__ */ new Set();
 	css = /* @__PURE__ */ new Set();
 	cva = /* @__PURE__ */ new Set();
 	sva = /* @__PURE__ */ new Set();
 	token = /* @__PURE__ */ new Set();
+	viewTransition = /* @__PURE__ */ new Set();
 	recipe = /* @__PURE__ */ new Map();
 	pattern = /* @__PURE__ */ new Map();
 	filePath;
 	encoder;
+	/**
+	* `css()` calls whose styles the build could not fully see.
+	*
+	* Only collected under `cssMode: 'grouped'`, where one class names the whole call, so a
+	* property the build cannot resolve changes the class rather than dropping a declaration
+	* from it — and the element renders with no styles at all. Under `atomic` the same call
+	* keeps everything the build did resolve, which is not worth interrupting a build over.
+	*/
+	unresolved = [];
 	constructor(context, encoder) {
 		this.context = context;
 		this.encoder = encoder ?? context.encoder;
 	}
+	/**
+	* Record a call whose styles the build could not fully see, at the call's own position.
+	*
+	* Used for losses the box tree cannot show — a ternary past the combination cap emits
+	* fragments rather than whole objects, and every individual box in it resolved fine.
+	*/
+	reportUnresolved(result, reason) {
+		const node = result.box?.getNode();
+		const sourceFile = node?.getSourceFile();
+		if (!node || !sourceFile) return;
+		const { line, column } = sourceFile.getLineAndColumnAtPos(node.getStart());
+		this.unresolved.push({
+			filePath: sourceFile.getFilePath(),
+			line,
+			column,
+			reason
+		});
+	}
 	append(result) {
 		this.all.push(result);
 		return result;
@@ -514,24 +646,36 @@ var ParserResult = class {
 		this.css.add(this.append(Object.assign({ type: "css" }, result)));
 		const encoder = this.encoder;
 		const grouped = this.context.config.cssMode === "grouped";
-		if (!grouped || result.data.length <= 1) {
-			result.data.forEach((obj) => grouped ? encoder.processGrouped(obj) : encoder.processAtomic(obj));
+		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));
+			}
+		}
+		if (!grouped || data.length <= 1) {
+			data.forEach((obj) => grouped ? encoder.processGrouped(obj) : encoder.processAtomic(obj));
 			return;
 		}
 		const keyCounts = /* @__PURE__ */ new Map();
-		for (const obj of result.data) for (const key of Object.keys(obj)) keyCounts.set(key, (keyCounts.get(key) || 0) + 1);
+		for (const obj of data) for (const key of Object.keys(obj)) keyCounts.set(key, (keyCounts.get(key) || 0) + 1);
 		if (!Array.from(keyCounts.values()).some((c) => c > 1)) {
-			encoder.processGrouped(Object.assign({}, ...result.data));
+			encoder.processGroupedMerge(data);
 			return;
 		}
+		if (this.callArgumentCount(result) > 1) {
+			this.reportUnresolved(result, "ambiguous-merge");
+			data.forEach((obj) => encoder.processAtomic(obj));
+		}
 		const overlappingKeys = /* @__PURE__ */ new Set();
 		keyCounts.forEach((count, key) => {
 			if (count > 1) overlappingKeys.add(key);
 		});
-		const base = {};
+		const baseEntries = [];
 		const branchEntries = [];
-		for (const obj of result.data) if (Object.keys(obj).some((k) => overlappingKeys.has(k))) branchEntries.push(obj);
-		else Object.assign(base, obj);
+		for (const obj of data) if (Object.keys(obj).some((k) => overlappingKeys.has(k))) branchEntries.push(obj);
+		else baseEntries.push(obj);
 		const branchGroups = /* @__PURE__ */ new Map();
 		for (const entry of branchEntries) {
 			const keySet = Object.keys(entry).sort().join("\0");
@@ -541,10 +685,24 @@ var ParserResult = class {
 		}
 		const groupArrays = Array.from(branchGroups.values());
 		if (groupArrays.reduce((acc, g) => acc * g.length, 1) > 32) {
-			result.data.forEach((obj) => encoder.processGrouped(obj));
+			this.reportUnresolved(result, "too-many-combinations");
+			data.forEach((obj) => {
+				encoder.processGrouped(obj);
+				encoder.processAtomic(obj);
+			});
 			return;
 		}
-		for (const combo of cartesian(groupArrays)) encoder.processGrouped(Object.assign({}, base, ...combo));
+		for (const combo of cartesian(groupArrays)) encoder.processGroupedMerge([...baseEntries, ...combo]);
+	}
+	/**
+	* How many arguments the call this result came from was written with.
+	*
+	* Returns 1 for anything that is not a call — a JSX element, or a box that lost its node —
+	* since the question only separates operands from branches and neither has operands.
+	*/
+	callArgumentCount(result) {
+		const node = result.box?.getNode();
+		return node && Node.isCallExpression(node) ? node.getArguments().length : 1;
 	}
 	setCva(result) {
 		this.cva.add(this.append(Object.assign({ type: "cva" }, result)));
@@ -559,11 +717,10 @@ var ParserResult = class {
 	setToken(result) {
 		this.token.add(this.append(Object.assign({ type: "token" }, result)));
 	}
-	setJsx(result) {
-		this.jsx.add(this.append(Object.assign({ type: "jsx" }, result)));
+	setViewTransition(result) {
+		this.viewTransition.add(this.append(Object.assign({ type: "viewTransition" }, result)));
 		const encoder = this.encoder;
-		const grouped = this.context.config.cssMode === "grouped";
-		result.data.forEach((obj) => encoder.processStyleProps(obj, grouped));
+		result.data.forEach((obj) => encoder.processViewTransition(obj));
 	}
 	setPattern(name, result) {
 		getOrCreateSet(this.pattern, name).add(this.append(Object.assign({
@@ -571,7 +728,25 @@ var ParserResult = class {
 			name
 		}, result)));
 		const encoder = this.encoder;
-		result.data.forEach((obj) => encoder.processPattern(name, obj, result.type ?? "pattern", result.name));
+		const grouped = this.context.config.cssMode === "grouped";
+		result.data.forEach((obj) => encoder.processPattern(name, obj, grouped));
+		if (grouped && !this.groupIsExact(result)) result.data.forEach((obj) => encoder.processPattern(name, obj, false));
+	}
+	/**
+	* Whether the group encoded for this result is the one the runtime will ask for.
+	*
+	* True only when the build saw the whole thing at once: one style object, with every
+	* value in it resolved. Several objects means the runtime merges them into a call this
+	* never encoded — `setCss` reconstructs those combinations, and nothing else does — and
+	* an unresolved value means the merge would not have matched anyway.
+	*
+	* Answering "no" costs a call site its atomic rules, which is CSS that duplicates the
+	* group. Answering a wrong "yes" costs the element every style it has, so this is
+	* deliberately conservative.
+	*/
+	groupIsExact(result) {
+		if (result.data.length !== 1) return false;
+		return findUnresolvedStyles(result).length === 0;
 	}
 	setRecipe(recipeName, result) {
 		getOrCreateSet(this.recipe, recipeName).add(this.append(Object.assign({ type: "recipe" }, result)));
@@ -600,7 +775,7 @@ var ParserResult = class {
 		result.cva.forEach((item) => this.cva.add(this.append(item)));
 		result.sva.forEach((item) => this.sva.add(this.append(item)));
 		result.token.forEach((item) => this.token.add(this.append(item)));
-		result.jsx.forEach((item) => this.jsx.add(this.append(item)));
+		result.viewTransition.forEach((item) => this.viewTransition.add(this.append(item)));
 		result.recipe.forEach((items, name) => {
 			const set = getOrCreateSet(this.recipe, name);
 			items.forEach((item) => set.add(this.append(item)));
@@ -609,6 +784,7 @@ var ParserResult = class {
 			const set = getOrCreateSet(this.pattern, name);
 			items.forEach((item) => set.add(this.append(item)));
 		});
+		if (result.unresolved.length) this.unresolved.push(...result.unresolved);
 		return this;
 	}
 	toArray() {
@@ -620,7 +796,7 @@ var ParserResult = class {
 			cva: Array.from(this.cva),
 			sva: Array.from(this.sva),
 			token: Array.from(this.token),
-			jsx: Array.from(this.jsx),
+			viewTransition: Array.from(this.viewTransition),
 			recipe: Object.fromEntries(Array.from(this.recipe.entries()).map(([key, value]) => [key, Array.from(value)])),
 			pattern: Object.fromEntries(Array.from(this.pattern.entries()).map(([key, value]) => [key, Array.from(value)]))
 		};
@@ -645,8 +821,7 @@ const defaultEnv = { preset: "ECMA" };
 const fallbackImpl = (...values) => values.some((value) => value === void 0) ? void 0 : `fallback(${values.join(", ")})`;
 const evaluateOptions = { environment: defaultEnv };
 function createParser(context) {
-	const { jsx, imports, recipes, config } = context;
-	const syntax = config.syntax;
+	const { jsx, imports, recipes } = context;
 	return function parse(sourceFile, encoder, options) {
 		if (!sourceFile) return;
 		const importDeclarations = getImportDeclarations(context, sourceFile);
@@ -681,12 +856,8 @@ function createParser(context) {
 			functions: {
 				matchFn: (prop) => file.matchFn(prop.fnName),
 				matchProp: () => true,
-				matchArg: (prop) => {
-					if (file.isJsxFactory(prop.fnName) && prop.index === 1 && Node.isIdentifier(prop.argNode)) return false;
-					return true;
-				}
+				matchArg: () => true
 			},
-			taggedTemplates: syntax === "template-literal" ? { matchTaggedTemplate: (tag) => file.matchFn(tag.fnName) } : void 0,
 			getEvaluateOptions: (node) => {
 				if (!Node.isCallExpression(node)) return evaluateOptions;
 				const propAccessExpr = node.getExpression();
@@ -720,14 +891,6 @@ function createParser(context) {
 						box: query.box.value[0] ?? box.fallback(query.box),
 						data: combineResult(unbox(query.box.value[0]))
 					});
-					else if (query.kind === "tagged-template") {
-						const obj = astish(query.box.value);
-						parserResult.set(name, {
-							name,
-							box: query.box ?? box.fallback(query.box),
-							data: [obj]
-						});
-					}
 				});
 			}).when(imports.matchers.tokens.match, (name) => {
 				result.queryList.forEach((query) => {
@@ -753,116 +916,28 @@ function createParser(context) {
 						data: combineResult(unbox(query.box.value[0]))
 					});
 				});
-			}).when(jsx.isJsxFactory, () => {
-				result.queryList.forEach((query) => {
-					if (query.kind === "call-expression" && query.box.value[1]) {
-						const map = query.box.value[1];
-						const boxNode = box.isMap(map) ? map : box.fallback(query.box);
-						const combined = combineResult(unbox(boxNode));
-						const result = {
-							name,
-							box: boxNode,
-							data: options?.transform?.({
-								type: "jsx-factory",
-								data: combined
-							}) ?? combined
-						};
-						if (box.isRecipe(map)) parserResult.setCva(result);
-						else parserResult.set("css", result);
-						const recipeOptions = query.box.value[2];
-						if (box.isUnresolvable(map) && recipeOptions && box.isMap(recipeOptions) && recipeOptions.value.has("defaultProps")) {
-							const maybeIdentifier = map.getNode();
-							if (Node.isIdentifier(maybeIdentifier)) {
-								const name = maybeIdentifier.getText();
-								const recipeName = file.getName(name);
-								parserResult.setRecipe(recipeName, {
-									type: "jsx-recipe",
-									name: recipeName,
-									box: recipeOptions,
-									data: combineResult(unbox(recipeOptions.value.get("defaultProps")))
-								});
-							}
-						}
-					} else if (query.kind === "tagged-template") {
-						const obj = astish(query.box.value);
-						parserResult.set("css", {
-							name,
-							box: query.box ?? box.fallback(query.box),
-							data: [obj]
-						});
-					}
-				});
-			}).when(file.isJsxFactory, (name) => {
+			}).when(file.isViewTransitionFn, (name) => {
 				result.queryList.forEach((query) => {
-					if (query.kind === "call-expression") {
-						const map = query.box.value[0];
-						const boxNode = box.isMap(map) ? map : box.fallback(query.box);
-						const combined = combineResult(unbox(boxNode));
-						const result = {
-							name,
-							box: boxNode,
-							data: options?.transform?.({
-								type: "jsx-factory",
-								data: combined
-							}) ?? combined
-						};
-						if (box.isRecipe(map)) parserResult.setCva(result);
-						else parserResult.set("css", result);
-					} else if (query.kind === "tagged-template") {
-						const obj = astish(query.box.value);
-						parserResult.set("css", {
-							name,
-							box: query.box ?? box.fallback(query.box),
-							data: [obj]
-						});
-					}
+					if (query.kind === "call-expression") parserResult.setViewTransition({
+						name,
+						box: query.box.value[0] ?? box.fallback(query.box),
+						data: combineResult(unbox(query.box.value[0]))
+					});
 				});
 			}).otherwise(() => {});
 			else if (jsx.isEnabled && result.kind === "component") result.queryList.forEach((query) => {
 				const data = combineResult(unbox(query.box));
-				switch (true) {
-					case file.isJsxFactory(name) || file.isJsxFactory(alias):
-						parserResult.setJsx({
-							type: "jsx-factory",
-							name,
-							box: query.box,
-							data
-						});
-						break;
-					case jsx.isJsxTagPattern(name) || jsx.isJsxTagPattern(alias):
-						parserResult.setPattern(name, {
-							type: "jsx-pattern",
-							name,
+				for (const tag of [name, alias]) {
+					if (!jsx.isJsxTagRecipe(tag)) continue;
+					recipes.filter(tag).forEach((recipe) => {
+						parserResult.setRecipe(recipe.baseName, {
+							type: "jsx-recipe",
+							name: tag,
 							box: query.box,
 							data
 						});
-						break;
-					case jsx.isJsxTagRecipe(name):
-						recipes.filter(name).map((recipe) => {
-							parserResult.setRecipe(recipe.baseName, {
-								type: "jsx-recipe",
-								name,
-								box: query.box,
-								data
-							});
-						});
-						break;
-					case jsx.isJsxTagRecipe(alias):
-						recipes.filter(alias).map((recipe) => {
-							parserResult.setRecipe(recipe.baseName, {
-								type: "jsx-recipe",
-								name: alias,
-								box: query.box,
-								data
-							});
-						});
-						break;
-					default: parserResult.setJsx({
-						type: "jsx",
-						name,
-						box: query.box,
-						data
 					});
+					break;
 				}
 			});
 		});
@@ -1073,7 +1148,6 @@ var Project = class {
 			}
 		}) ?? this.transformFile(filePath, original);
 		if (original !== transformed) sourceFile.replaceWithText(transformed);
-		if (hooks["parser:preprocess"]) options.transform = hooks["parser:preprocess"];
 		const result = this.parser(sourceFile, encoder, options)?.setFilePath(filePath);
 		hooks["parser:after"]?.({
 			filePath,
@@ -1090,4 +1164,4 @@ var Project = class {
 	};
 };
 //#endregion
-export { ParserResult, Project };
+export { ParserResult, Project, findUnresolvedStyles };