vite-plugin-token-shaker 0.0.2 → 0.0.4

package/dist/index.mjs

@@ -37,7 +37,7 @@ function extractTokensVariables(code, registry) {
 		if (!registry.has(varName)) registry.set(varName, {
 			value: varValue,
 			usageCount: 0,
-			setElsewhere: false,
+			deoptimized: false,
 			isAlias,
 			emitDeclaration: false
 		});
@@ -47,10 +47,10 @@ function extractTokensVariables(code, registry) {
 		}
 	}
 }
-function markVariablesSetElsewhere(code, registry) {
+function markDeoptimizedFromCSS(code, registry) {
 	let codeWithoutTokens = code;
 	for (const layer of findTokensLayers(code)) codeWithoutTokens = codeWithoutTokens.slice(0, layer.start) + " ".repeat(layer.end - layer.start) + codeWithoutTokens.slice(layer.end);
-	for (const [varName, variable] of registry) if (new RegExp(`${escapeRegex(varName)}\\s*:`, "g").test(codeWithoutTokens)) variable.setElsewhere = true;
+	for (const [varName, variable] of registry) if (new RegExp(`${escapeRegex(varName)}\\s*:`, "g").test(codeWithoutTokens)) variable.deoptimized = true;
 }
 function countVariableUsage(code, registry, visited = /* @__PURE__ */ new Set()) {
 	for (const match of code.matchAll(VAR_REF_REGEX)) {
@@ -76,7 +76,10 @@ function resolveVariableValue(varName, registry, depth = 0) {
 	if (depth > 10) return `var(${varName})`;
 	const variable = registry.get(varName);
 	if (!variable) return `var(${varName})`;
-	return variable.value.replace(VAR_REF_REGEX, (_, nestedVarName) => resolveVariableValue(nestedVarName, registry, depth + 1));
+	return variable.value.replace(VAR_REF_REGEX, (_, nestedVarName) => {
+		if (registry.get(nestedVarName)?.deoptimized) return `var(${nestedVarName})`;
+		return resolveVariableValue(nestedVarName, registry, depth + 1);
+	});
 }
 function generateMangledNames(registry, manglePrefix) {
 	const valueToVars = /* @__PURE__ */ new Map();
@@ -122,13 +125,13 @@ function transformCode(code, registry) {
 			const variable = registry.get(varName);
 			if (!variable) continue;
 			if (variable.usageCount == 0) continue;
-			if (variable.setElsewhere) {
+			if (variable.deoptimized) {
 				declarations.push(`${varName}: ${varValue}`);
 				continue;
 			}
 			if (variable.mangledName) {
 				const resolvedValue = resolveVariableValue(varName, registry);
-				if (variable.emitDeclaration && !variable.isAlias) {
+				if (variable.emitDeclaration) {
 					if (!emittedValues.has(resolvedValue)) {
 						declarations.push(`${variable.mangledName}: ${resolvedValue}`);
 						emittedValues.add(resolvedValue);
@@ -142,40 +145,43 @@ function transformCode(code, registry) {
 	result = result.replace(VAR_REF_REGEX, (original, varName, fallback) => {
 		const variable = registry.get(varName);
 		if (!variable) return original;
+		if (variable.deoptimized) return original;
 		if (variable.mangledName) return `var(${variable.mangledName}${fallback ? `, ${fallback}` : ""})`;
-		if (!variable.setElsewhere) return resolveVariableValue(varName, registry);
-		return original;
+		return resolveVariableValue(varName, registry);
 	});
 	return result;
 }
 function getStats(registry, mangledCount) {
 	let drop = 0, inline = 0, mangle = 0, keep = 0;
 	for (const variable of registry.values()) if (variable.usageCount == 0) drop++;
-	else if (variable.setElsewhere) keep++;
+	else if (variable.deoptimized) keep++;
 	else if (variable.mangledName) mangle++;
 	else inline++;
 	return `Analysis: ${drop} drop, ${inline} inline, ${mangle} mangle (${mangledCount} unique values), ${keep} keep`;
 }
 function tokenShaker(options = {}) {
 	const { manglePrefix = "--_", verbose = false } = options;
-	const registry = /* @__PURE__ */ new Map();
 	const log = verbose ? (...args) => console.log("[token-shaker]", ...args) : () => {};
 	return {
 		name: "vite-plugin-token-shaker",
 		enforce: "pre",
 		generateBundle(_outputOptions, bundle) {
-			registry.clear();
 			const cssAssets = Object.entries(bundle).filter(([name, asset]) => asset.type == "asset" && name.endsWith(".css"));
 			if (cssAssets.length == 0) return;
+			const registry = /* @__PURE__ */ new Map();
 			for (const [, asset] of cssAssets) extractTokensVariables(asset.source, registry);
 			if (registry.size == 0) return;
 			const bundledFiles = cssAssets.map(([name, asset]) => [name, asset.source]);
 			log(`Analyzing ${registry.size} variables across ${cssAssets.length} CSS files`);
 			resetUsageCounts(registry);
 			for (const [, code] of bundledFiles) {
-				markVariablesSetElsewhere(code, registry);
+				markDeoptimizedFromCSS(code, registry);
 				countVariableUsage(code, registry);
 			}
+			for (const chunk of Object.values(bundle)) {
+				if (chunk.type != "chunk") continue;
+				for (const [varName, variable] of registry) if (chunk.code.includes(varName)) variable.deoptimized = true;
+			}
 			log(getStats(registry, generateMangledNames(registry, manglePrefix)));
 			for (const [fileName, asset] of cssAssets) {
 				const transformed = transformCode(asset.source, registry);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-token-shaker",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "description": "Clean up anything in @layer tokens",
   "type": "module",
   "license": "MIT",