@marvalt/wparser 0.1.39 → 0.1.41

package/dist/index.esm.js

@@ -2081,13 +2081,45 @@ function extractVideoIframeFromInnerBlocks(block) {
  */
 function extractBackgroundColor(block, context) {
     const attrs = block.attributes || {};
-    const wpColorName = attrs['backgroundColor'] || attrs['background'];
+    // Try multiple possible attribute names for background color
+    // WordPress can store it as backgroundColor, background, or in style
+    let wpColorName = attrs['backgroundColor'] ||
+        attrs['background'] ||
+        attrs['backgroundColorSlug'] ||
+        null;
+    // If not found in attributes, check className for WordPress color classes
+    // WordPress uses classes like: has-accent-4-background-color, has-contrast-background-color
+    if (!wpColorName && attrs['className']) {
+        const className = attrs['className'];
+        const colorMatch = className.match(/has-([\w-]+)-background-color/);
+        if (colorMatch && colorMatch[1]) {
+            // Convert kebab-case to slug (e.g., "accent-4" stays "accent-4", "contrast" stays "contrast")
+            wpColorName = colorMatch[1];
+        }
+    }
+    // Debug logging in development
+    if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'development') {
+        if (!wpColorName && context.colorMapper) {
+            console.log('🔍 extractBackgroundColor - No backgroundColor found in block:', {
+                blockName: block.name,
+                hasClassName: !!attrs['className'],
+                className: attrs['className'],
+                hasStyle: !!attrs['style'],
+                availableAttrs: Object.keys(attrs),
+            });
+        }
+    }
     if (!wpColorName || typeof wpColorName !== 'string') {
         return null;
     }
     // Use colorMapper from context if available
     if (context.colorMapper) {
-        return context.colorMapper(wpColorName);
+        const result = context.colorMapper(wpColorName);
+        // Debug logging
+        if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'development') {
+            console.log('🎨 extractBackgroundColor - Mapped', wpColorName, '→', result);
+        }
+        return result;
     }
     // Fallback: return null (no background applied)
     return null;