@webmate-studio/builder 0.2.119 → 0.2.121

package/package.json

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

package/src/design-tokens.js

@@ -978,7 +978,9 @@ body {
 
 	// Generate utility classes for buttons
 	if (tokens.buttons) {
+		// IMPORTANT: Buttons in @layer components so Tailwind utilities (rounded-full, etc.) can override
 		globalStyles += '\n\n/* Button Utilities */';
+		globalStyles += '\n@layer components {';
 
 		// Base button class
 		globalStyles += `\n.btn {
@@ -1024,6 +1026,8 @@ body {
   border-color: var(--button-${variantName}-border-hover);
 }`;
 		}
+
+		globalStyles += '\n}'; // Close @layer components
 	}
 
 	// Add responsive media queries for textStyles (OUTSIDE @theme block!)

package/src/tailwind-generator.js

@@ -147,6 +147,32 @@ export function extractTailwindClasses(html) {
 		}
 	}
 
+	// Match .className = '...' and .className = "..." (vanilla JS DOM manipulation in Islands)
+	// Also matches .className = `...` template literals
+	const classNameAssignRegex = /\.className\s*=\s*['"]([^'"]+)['"]/g;
+	while ((match = classNameAssignRegex.exec(html)) !== null) {
+		match[1].split(/\s+/).forEach(cls => {
+			if (cls.trim()) classes.add(cls.trim());
+		});
+	}
+	// Template literal version: .className = `...`
+	const classNameTemplateRegex = /\.className\s*=\s*`([^`]*)`/g;
+	while ((match = classNameTemplateRegex.exec(html)) !== null) {
+		// Extract static parts (before/between/after ${...})
+		const content = match[1].replace(/\$\{[^}]*\}/g, ' ');
+		content.split(/\s+/).forEach(cls => {
+			if (cls.trim()) classes.add(cls.trim());
+		});
+	}
+
+	// Match classList.add('...') patterns
+	const classListAddRegex = /classList\.add\(\s*['"]([^'"]+)['"]/g;
+	while ((match = classListAddRegex.exec(html)) !== null) {
+		match[1].split(/\s+/).forEach(cls => {
+			if (cls.trim()) classes.add(cls.trim());
+		});
+	}
+
 	return classes;
 }