@marvalt/wparser 0.1.31 → 0.1.33

package/dist/index.esm.js

@@ -2071,9 +2071,19 @@ function extractTextColor(block, context) {
     if (!wpColorName || typeof wpColorName !== 'string') {
         return null;
     }
+    // Special handling for common WordPress color names when used as text color
+    // These mappings take precedence because text color semantics differ from background color
+    const textColorMap = {
+        'contrast': 'text-gray-900', // Contrast text is typically dark/black (opposite of contrast background)
+        'base': 'text-white', // Base text on dark backgrounds
+    };
+    // Check special text color mappings first
+    if (textColorMap[wpColorName]) {
+        return textColorMap[wpColorName];
+    }
     // Use colorMapper from context if available
     // Note: colorMapper might return combined classes like "bg-gray-900 text-white"
-    // We'll extract just the text color part, or create a separate text color mapping
+    // We'll extract just the text color part
     if (context.colorMapper) {
         const mapped = context.colorMapper(wpColorName);
         if (mapped) {
@@ -2083,8 +2093,6 @@ function extractTextColor(block, context) {
             if (textColorMatch) {
                 return textColorMatch[0];
             }
-            // If no text color in the mapped class, try to infer from the color name
-            // For now, return null and let the app handle it via a separate text color mapper
         }
     }
     return null;
@@ -2264,9 +2272,11 @@ const Paragraph = ({ block, context }) => {
             // Render block-level content without <p> wrapper, but add spacing wrapper
             return jsxRuntimeExports.jsx("div", { className: spacing, children: parts });
         }
-        return jsxRuntimeExports.jsx("p", { className: buildClassName('text-gray-700', spacing, textAlign), children: parts });
+        // Don't hardcode text color - let it inherit from parent (e.g., column with background color)
+        return jsxRuntimeExports.jsx("p", { className: buildClassName(spacing, textAlign), children: parts });
     }
-    return jsxRuntimeExports.jsx("p", { className: buildClassName('text-gray-700', spacing, textAlign), children: content });
+    // Don't hardcode text color - let it inherit from parent (e.g., column with background color)
+    return jsxRuntimeExports.jsx("p", { className: buildClassName(spacing, textAlign), children: content });
 };
 const Heading = ({ block, children, context }) => {
     const attrs = block.attributes || {};
@@ -2279,7 +2289,10 @@ const Heading = ({ block, children, context }) => {
     const sizeClass = fontSize || (level === 1 ? 'text-4xl' : level === 2 ? 'text-3xl' : level === 3 ? 'text-2xl' : 'text-xl');
     // Get spacing from config with improved defaults
     const spacingClass = getHeadingSpacing(context.spacingConfig || context.registry.spacingConfig, level);
-    return (jsxRuntimeExports.jsx(Tag, { className: buildClassName('font-bold text-gray-900', sizeClass, textAlign, spacingClass), children: children ?? content }));
+    // Extract text color if specified, otherwise inherit from parent
+    const textColor = extractTextColor(block, context);
+    const textColorClass = textColor || ''; // Don't hardcode - let it inherit from parent
+    return (jsxRuntimeExports.jsx(Tag, { className: buildClassName('font-bold', textColorClass, sizeClass, textAlign, spacingClass), children: children ?? content }));
 };
 const Image = ({ block, context }) => {
     const imageAttrs = getImageAttributes(block);
@@ -2300,13 +2313,12 @@ const List = ({ block, children, context }) => {
     const { ordered } = attrs;
     const Tag = ordered ? 'ol' : 'ul';
     const spacing = getSpacing(context.spacingConfig || context.registry.spacingConfig, 'list', 'my-6');
-    // Extract text color if specified
+    // Extract text color if specified, otherwise inherit from parent
     const textColor = extractTextColor(block, context);
-    // Default text color if none specified
-    const textColorClass = textColor || 'text-gray-700';
+    const textColorClass = textColor || ''; // Don't hardcode - let it inherit from parent
     return React.createElement(Tag, { className: buildClassName('list-disc pl-6 space-y-2', textColorClass, spacing) }, children);
 };
-const ListItem = ({ block, children }) => {
+const ListItem = ({ block, children, context }) => {
     // List items store their content in innerHTML (e.g., "<li>Text<br>More text</li>")
     // We need to extract the content from inside the <li> tag and render it properly
     let content = null;
@@ -2323,12 +2335,15 @@ const ListItem = ({ block, children }) => {
             }
         }
     }
+    // Extract text color if specified, otherwise inherit from parent
+    const textColor = extractTextColor(block, context);
+    const textColorClass = textColor || ''; // Don't hardcode - let it inherit from parent
     // If we have both innerHTML content and children (innerBlocks), combine them
     if (content && children && React.Children.count(children) > 0) {
-        return (jsxRuntimeExports.jsxs("li", { className: "text-gray-700", children: [content, children] }));
+        return (jsxRuntimeExports.jsxs("li", { className: textColorClass || undefined, children: [content, children] }));
     }
     // Return content from innerHTML if available, otherwise use children
-    return jsxRuntimeExports.jsx("li", { className: "text-gray-700", children: content || children });
+    return jsxRuntimeExports.jsx("li", { className: textColorClass || undefined, children: content || children });
 };
 const Group = ({ block, children, context }) => {
     const attrs = block.attributes || {};
@@ -2393,9 +2408,12 @@ const ButtonBlock = ({ block, context }) => {
     // Extract background and text colors from button attributes
     const backgroundColor = extractBackgroundColor(block, context);
     const textColor = extractTextColor(block, context);
-    // Build button classes - use extracted colors or defaults
+    // Build button classes
+    // Background: use extracted or default (buttons need a background)
     const bgClass = backgroundColor || 'bg-primary';
-    const textClass = textColor || 'text-primary-foreground';
+    // Text color: use extracted if specified, otherwise inherit from parent (don't force default)
+    const textClass = textColor || '';
+    // Hover: adjust based on whether we have a custom background
     const hoverClass = backgroundColor ? 'hover:opacity-90' : 'hover:bg-primary/90';
     // Handle internal vs external links
     const isExternal = url && (url.startsWith('http://') || url.startsWith('https://'));