@webmate-studio/builder 0.2.86 → 0.2.87

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webmate-studio/builder",
-  "version": "0.2.86",
+  "version": "0.2.87",
   "type": "module",
   "description": "Webmate Studio Component Builder",
   "keywords": [

package/src/design-tokens.js

@@ -7,7 +7,7 @@ function generateSemanticColorUtilities(tokens) {
 	if (!tokens.colors) return '';
 
 	let utilities = '\n/* Color Utilities */';
-	utilities += '\n@layer components {';
+	utilities += '\n@layer utilities {';
 
 	// Map of all colors: token name -> utility class base name
 	const colorMap = {

package/src/tailwind-generator.js

@@ -411,6 +411,10 @@ ${themeCSS}
 			result = stripNonUtilityLayers(result);
 			console.log(`[Tailwind Generator] Generated CSS length AFTER stripping: ${result.length}`);
 			console.log(`[Tailwind Generator] CSS contains @layer base: ${result.includes('@layer base')}`);
+
+			// Wrap in @layer components (btn, etc. are components, not utilities)
+			// Utilities from design tokens (@layer utilities) can then override them
+			result = `@layer components {\n${result}\n}`;
 		}
 
 		return result;