@marvalt/wparser 0.1.43 → 0.1.45

package/dist/index.d.ts

@@ -493,6 +493,11 @@ declare function extractBackgroundColor(block: WordPressBlock, context: RenderCo
  * @returns CSS class string (e.g., 'text-white') or null if no mapping
  */
 declare function extractTextColor(block: WordPressBlock, context: RenderContext): string | null;
+/**
+ * Infer a readable text color class based on a background class string.
+ * Supports bg-[#hex] and bg-[rgb(...)].
+ */
+declare function inferTextColorFromBackground(backgroundClass: string | null): string | null;
 /**
  * Extract spacer height from block attributes or innerHTML
  * Returns height in pixels, or null if not found
@@ -550,5 +555,5 @@ interface SectionWrapperProps {
  */
 declare const SectionWrapper: React$1.FC<SectionWrapperProps>;
 
-export { SectionWrapper, WPContent, WPErrorBoundary, WPPage, buildClassName, convertImageToCloudflareVariant, convertImageUrl, convertImageUrls, createDefaultRegistry, createEnhancedRegistry, extractAlignment, extractBackgroundColor, extractBackgroundImage, extractButtonsFromInnerBlocks, extractContent, extractDimRatio, extractFontSize, extractHeadingLevel, extractImageAttributes, extractImageUrl, extractImageUrlWithFallback, extractMediaPosition, extractMinHeight, extractOverlayColor, extractSpacerHeight, extractSubtitleFromInnerBlocks, extractTextAlign, extractTextAlignFromInnerBlocks, extractTextColor, extractTextFromHTML, extractTitle, extractTitleFromInnerBlocks, extractVerticalAlignment, extractVideoIframeFromInnerBlocks, findMatchingMapping, findShortcodes, getAlignmentClasses, getBlockTextContent, getCloudflareVariantUrl, getContainerClasses, getContentSpacingClasses, getFontSizeClasses, getImageAttributes, getImageUrl, getSectionSpacingClasses, getTextAlignClasses, isCloudflareImageUrl, isValidCloudflareUrl, matchesPattern, parseContentPosition, parseGutenbergBlocks, parseShortcodeAttrs, renderNodes, renderTextWithShortcodes };
+export { SectionWrapper, WPContent, WPErrorBoundary, WPPage, buildClassName, convertImageToCloudflareVariant, convertImageUrl, convertImageUrls, createDefaultRegistry, createEnhancedRegistry, extractAlignment, extractBackgroundColor, extractBackgroundImage, extractButtonsFromInnerBlocks, extractContent, extractDimRatio, extractFontSize, extractHeadingLevel, extractImageAttributes, extractImageUrl, extractImageUrlWithFallback, extractMediaPosition, extractMinHeight, extractOverlayColor, extractSpacerHeight, extractSubtitleFromInnerBlocks, extractTextAlign, extractTextAlignFromInnerBlocks, extractTextColor, extractTextFromHTML, extractTitle, extractTitleFromInnerBlocks, extractVerticalAlignment, extractVideoIframeFromInnerBlocks, findMatchingMapping, findShortcodes, getAlignmentClasses, getBlockTextContent, getCloudflareVariantUrl, getContainerClasses, getContentSpacingClasses, getFontSizeClasses, getImageAttributes, getImageUrl, getSectionSpacingClasses, getTextAlignClasses, inferTextColorFromBackground, isCloudflareImageUrl, isValidCloudflareUrl, matchesPattern, parseContentPosition, parseGutenbergBlocks, parseShortcodeAttrs, renderNodes, renderTextWithShortcodes };
 export type { AuthMode, BlockPattern, BlockRenderer, BlockRendererProps, CloudflareVariantOptions, ColorMapper, ComponentMapping, ComponentRegistry, EnhancedRegistry, ImageConversionOptions, ParseOptions, ParsedShortcode, RenderContext, RenderOptions, SectionWrapperProps, ShortcodeAttributes, ShortcodeRenderer, SpacingConfig, WPContentProps, WPNode, WPPageProps, WordPressBlock, WordPressEmbedded, WordPressFeaturedMedia, WordPressPageMinimal, WordPressTitleField };

package/dist/index.esm.js

@@ -2134,6 +2134,7 @@ function extractBackgroundColor(block, context) {
  */
 function extractTextColor(block, context) {
     const attrs = block.attributes || {};
+    const mapper = context.colorMapper;
     // Try multiple possible attribute names for text color
     let wpColorName = attrs['textColor'] ||
         attrs['text'] ||
@@ -2169,17 +2170,23 @@ function extractTextColor(block, context) {
         }
     }
     if (!wpColorName || typeof wpColorName !== 'string') {
-        return null;
+        wpColorName = null;
     }
     // Use colorMapper from context if available
     // Note: colorMapper returns combined classes like "bg-[#FBFAF3] text-gray-900"
     // We need to extract just the text color part
-    if (context.colorMapper) {
-        const mapped = context.colorMapper(wpColorName);
+    if (mapper && wpColorName) {
+        const mapped = mapper(wpColorName);
         if (mapped) {
-            // Extract text color classes (e.g., "text-white", "text-gray-900")
-            // Match text- classes but not text- in the middle of other classes
-            const textColorMatch = mapped.match(/\btext-[\w-]+/g);
+            // If the mapper provided a background arbitrary value, derive a text color class directly from it
+            const bgArbitrary = mapped.match(/\bbg-\[([^\]]+)\]/);
+            if (bgArbitrary && bgArbitrary[1]) {
+                const derivedText = `text-[${bgArbitrary[1]}]`;
+                return derivedText;
+            }
+            // Extract text color classes (e.g., "text-white", "text-gray-900", "text-[#123456]")
+            // Match text- classes including arbitrary values in brackets
+            const textColorMatch = mapped.match(/\btext-(\[[^\]]+\]|[\w-]+)/g);
             if (textColorMatch && textColorMatch.length > 0) {
                 // Return the last text color class (in case there are multiple)
                 const result = textColorMatch[textColorMatch.length - 1];
@@ -2197,6 +2204,34 @@ function extractTextColor(block, context) {
     // Fallback: return null (no text color applied, will inherit from parent)
     return null;
 }
+/**
+ * Infer a readable text color class based on a background class string.
+ * Supports bg-[#hex] and bg-[rgb(...)].
+ */
+function inferTextColorFromBackground(backgroundClass) {
+    if (!backgroundClass)
+        return null;
+    // Try to extract hex color from arbitrary value class bg-[#xxxxxx]
+    const hexMatch = backgroundClass.match(/bg-\[#?([0-9a-fA-F]{6})\]/);
+    if (hexMatch) {
+        const hex = hexMatch[1];
+        const r = parseInt(hex.slice(0, 2), 16);
+        const g = parseInt(hex.slice(2, 4), 16);
+        const b = parseInt(hex.slice(4, 6), 16);
+        const brightness = (r * 299 + g * 587 + b * 114) / 1000;
+        return brightness < 140 ? 'text-white' : 'text-gray-900';
+    }
+    // Try rgb() form
+    const rgbMatch = backgroundClass.match(/bg-\[rgb\((\d+),\s*(\d+),\s*(\d+)\)\]/i);
+    if (rgbMatch) {
+        const r = parseInt(rgbMatch[1], 10);
+        const g = parseInt(rgbMatch[2], 10);
+        const b = parseInt(rgbMatch[3], 10);
+        const brightness = (r * 299 + g * 587 + b * 114) / 1000;
+        return brightness < 140 ? 'text-white' : 'text-gray-900';
+    }
+    return null;
+}
 /**
  * Extract spacer height from block attributes or innerHTML
  * Returns height in pixels, or null if not found
@@ -2495,6 +2530,8 @@ const Group = ({ block, children, context }) => {
     const layout = attrs['layout'];
     // Extract background color using color mapper
     const backgroundColor = extractBackgroundColor(block, context);
+    // Extract text color (apply on the wrapper so children inherit)
+    const textColor = extractTextColor(block, context) || inferTextColorFromBackground(backgroundColor);
     // Determine if this is a section-level group (has alignment) or content-level
     const isSection = align === 'full' || align === 'wide';
     const containerClass = getContainerClasses(align, layout);
@@ -2508,8 +2545,8 @@ const Group = ({ block, children, context }) => {
         ? 'container'
         : containerClass;
     // Build className with background color if present
-    const className = buildClassName(finalContainerClass, spacingClass, backgroundColor // This will be null if no mapping, which is fine
-    );
+    const className = buildClassName(finalContainerClass, spacingClass, backgroundColor, // This will be null if no mapping, which is fine
+    textColor);
     return (jsxRuntimeExports.jsx("div", { className: className, children: children }));
 };
 const Columns = ({ block, children }) => {
@@ -2523,9 +2560,10 @@ const Column = ({ block, children, context }) => {
     const width = attrs['width'];
     // Extract background color using color mapper
     const backgroundColor = extractBackgroundColor(block, context);
+    const textColor = extractTextColor(block, context) || inferTextColorFromBackground(backgroundColor);
     // Handle column width (e.g., "50%" becomes flex-basis)
     const style = width ? { flexBasis: width } : undefined;
-    return (jsxRuntimeExports.jsx("div", { className: buildClassName('space-y-4 p-6 rounded-lg', backgroundColor), style: style, children: children }));
+    return (jsxRuntimeExports.jsx("div", { className: buildClassName('space-y-4 p-6 rounded-lg', backgroundColor, textColor), style: style, children: children }));
 };
 const Separator = () => jsxRuntimeExports.jsx("hr", { className: "border-gray-200 my-8" });
 const ButtonBlock = ({ block, context }) => {
@@ -3039,5 +3077,5 @@ const SectionWrapper = ({ children, background = 'light', spacing = 'medium', co
     return (jsxRuntimeExports.jsx("section", { className: buildClassName(backgroundClasses[finalBackground] || backgroundClasses.light, spacingClasses[finalSpacing] || spacingClasses.medium, containerClasses[finalContainer] || containerClasses.contained, className), children: children }));
 };
 
-export { SectionWrapper, WPContent, WPErrorBoundary, WPPage, buildClassName, convertImageToCloudflareVariant, convertImageUrl, convertImageUrls, createDefaultRegistry, createEnhancedRegistry, extractAlignment, extractBackgroundColor, extractBackgroundImage, extractButtonsFromInnerBlocks, extractContent, extractDimRatio, extractFontSize, extractHeadingLevel, extractImageAttributes, extractImageUrl, extractImageUrlWithFallback, extractMediaPosition, extractMinHeight, extractOverlayColor, extractSpacerHeight, extractSubtitleFromInnerBlocks, extractTextAlign, extractTextAlignFromInnerBlocks, extractTextColor, extractTextFromHTML, extractTitle, extractTitleFromInnerBlocks, extractVerticalAlignment, extractVideoIframeFromInnerBlocks, findMatchingMapping, findShortcodes, getAlignmentClasses, getBlockTextContent, getCloudflareVariantUrl, getContainerClasses, getContentSpacingClasses, getFontSizeClasses, getImageAttributes, getImageUrl, getSectionSpacingClasses, getTextAlignClasses, isCloudflareImageUrl, isValidCloudflareUrl, matchesPattern, parseContentPosition, parseGutenbergBlocks, parseShortcodeAttrs, renderNodes, renderTextWithShortcodes };
+export { SectionWrapper, WPContent, WPErrorBoundary, WPPage, buildClassName, convertImageToCloudflareVariant, convertImageUrl, convertImageUrls, createDefaultRegistry, createEnhancedRegistry, extractAlignment, extractBackgroundColor, extractBackgroundImage, extractButtonsFromInnerBlocks, extractContent, extractDimRatio, extractFontSize, extractHeadingLevel, extractImageAttributes, extractImageUrl, extractImageUrlWithFallback, extractMediaPosition, extractMinHeight, extractOverlayColor, extractSpacerHeight, extractSubtitleFromInnerBlocks, extractTextAlign, extractTextAlignFromInnerBlocks, extractTextColor, extractTextFromHTML, extractTitle, extractTitleFromInnerBlocks, extractVerticalAlignment, extractVideoIframeFromInnerBlocks, findMatchingMapping, findShortcodes, getAlignmentClasses, getBlockTextContent, getCloudflareVariantUrl, getContainerClasses, getContentSpacingClasses, getFontSizeClasses, getImageAttributes, getImageUrl, getSectionSpacingClasses, getTextAlignClasses, inferTextColorFromBackground, isCloudflareImageUrl, isValidCloudflareUrl, matchesPattern, parseContentPosition, parseGutenbergBlocks, parseShortcodeAttrs, renderNodes, renderTextWithShortcodes };
 //# sourceMappingURL=index.esm.js.map