@marvalt/wparser 0.1.60 → 0.1.62

package/dist/index.cjs

@@ -1406,6 +1406,115 @@ function renderBlock(block, registry, key, options, page) {
     return jsxRuntimeExports.jsx(React.Fragment, { children: node }, key);
 }
 
+/**
+ * Parse shortcode attributes from a string
+ * Supports: [shortcode attr="value" attr2="value2"]
+ */
+function parseShortcodeAttrs(attrString) {
+    if (!attrString || !attrString.trim()) {
+        return {};
+    }
+    const attrs = {};
+    // Match key="value" or key='value' patterns
+    const attrRegex = /(\w+)=["']([^"']+)["']/g;
+    let match;
+    while ((match = attrRegex.exec(attrString)) !== null) {
+        attrs[match[1]] = match[2];
+    }
+    return attrs;
+}
+/**
+ * Find all shortcodes in text
+ * Supports: [shortcode], [shortcode attr="value"], [shortcode]content[/shortcode]
+ */
+function findShortcodes(text) {
+    const shortcodes = [];
+    // First, find closing tag pairs: [shortcode]content[/shortcode]
+    const closingTagRegex = /\[(\w+)(?:\s+([^\]]+))?\](.*?)\[\/\1\]/gs;
+    let match;
+    const processedRanges = [];
+    while ((match = closingTagRegex.exec(text)) !== null) {
+        const name = match[1];
+        const attrString = match[2] || '';
+        const content = match[3] || '';
+        const attrs = parseShortcodeAttrs(attrString);
+        shortcodes.push({
+            name,
+            attrs,
+            content,
+            fullMatch: match[0],
+            startIndex: match.index,
+            endIndex: match.index + match[0].length,
+        });
+        processedRanges.push({
+            start: match.index,
+            end: match.index + match[0].length,
+        });
+    }
+    // Then, find self-closing: [shortcode attr="value"]
+    // Skip ranges already processed by closing tags
+    const selfClosingRegex = /\[(\w+)(?:\s+([^\]]+))?\]/g;
+    let selfClosingMatch;
+    while ((selfClosingMatch = selfClosingRegex.exec(text)) !== null) {
+        // Check if this match is within a processed range
+        const isProcessed = processedRanges.some(range => selfClosingMatch.index >= range.start && selfClosingMatch.index < range.end);
+        if (isProcessed) {
+            continue;
+        }
+        const name = selfClosingMatch[1];
+        const attrString = selfClosingMatch[2] || '';
+        const attrs = parseShortcodeAttrs(attrString);
+        shortcodes.push({
+            name,
+            attrs,
+            fullMatch: selfClosingMatch[0],
+            startIndex: selfClosingMatch.index,
+            endIndex: selfClosingMatch.index + selfClosingMatch[0].length,
+        });
+    }
+    // Sort by start index
+    shortcodes.sort((a, b) => a.startIndex - b.startIndex);
+    return shortcodes;
+}
+/**
+ * Render text with shortcodes replaced by React components
+ */
+function renderTextWithShortcodes(text, registry) {
+    const shortcodes = findShortcodes(text);
+    if (shortcodes.length === 0) {
+        return [text];
+    }
+    const parts = [];
+    let lastIndex = 0;
+    for (const shortcode of shortcodes) {
+        // Add text before shortcode
+        if (shortcode.startIndex > lastIndex) {
+            const textBefore = text.substring(lastIndex, shortcode.startIndex);
+            if (textBefore) {
+                parts.push(textBefore);
+            }
+        }
+        // Render shortcode
+        const renderer = registry.shortcodes[shortcode.name];
+        if (renderer) {
+            parts.push(jsxRuntimeExports.jsx(React.Fragment, { children: renderer(shortcode.attrs, shortcode.content) }, `shortcode-${shortcode.startIndex}`));
+        }
+        else {
+            // Keep original shortcode if no renderer found
+            parts.push(shortcode.fullMatch);
+        }
+        lastIndex = shortcode.endIndex;
+    }
+    // Add remaining text
+    if (lastIndex < text.length) {
+        const remainingText = text.substring(lastIndex);
+        if (remainingText) {
+            parts.push(remainingText);
+        }
+    }
+    return parts;
+}
+
 /**
  * Content extraction utilities for WordPress blocks
  * Extracts text content from various block formats
@@ -2149,6 +2258,10 @@ function extractSpacerHeight(block) {
         return height;
     }
     if (typeof height === 'string') {
+        // If it's a CSS var or clamp, return as-is
+        if (height.startsWith('var(') || height.includes('clamp(')) {
+            return height;
+        }
         // Parse "100px" or "100" to number
         const match = height.match(/^(\d+)/);
         if (match) {
@@ -2159,9 +2272,17 @@ function extractSpacerHeight(block) {
     if (block.innerHTML) {
         const styleMatch = block.innerHTML.match(/style=["']([^"']+)["']/i);
         if (styleMatch) {
-            const heightMatch = styleMatch[1].match(/height:\s*(\d+)px/i);
-            if (heightMatch) {
-                return parseInt(heightMatch[1], 10);
+            // First look for CSS var or clamp
+            const cssVarMatch = styleMatch[1].match(/height:\s*([^;]+);?/i);
+            if (cssVarMatch) {
+                const cssHeight = cssVarMatch[1].trim();
+                if (cssHeight.startsWith('var(') || cssHeight.includes('clamp(')) {
+                    return cssHeight;
+                }
+                const numericMatch = cssHeight.match(/^(\d+)/);
+                if (numericMatch) {
+                    return parseInt(numericMatch[1], 10);
+                }
             }
         }
     }
@@ -2265,24 +2386,80 @@ function buildClassName(...classes) {
 function getSpacing(spacingConfig, key, fallback) {
     return spacingConfig?.[key] || fallback;
 }
-const Paragraph = ({ block }) => {
-    // If innerHTML exists, render it as-is to preserve WP classes/styles
-    if (block.innerHTML) {
-        return jsxRuntimeExports.jsx("div", { dangerouslySetInnerHTML: { __html: block.innerHTML } });
-    }
+// Helper function to get heading spacing
+function getHeadingSpacing(spacingConfig, level) {
+    const headingConfig = spacingConfig?.heading;
+    if (level === 1)
+        return headingConfig?.h1 || 'mt-10 mb-8';
+    if (level === 2)
+        return headingConfig?.h2 || 'mt-8 mb-6';
+    return headingConfig?.h3 || 'mt-6 mb-4';
+}
+const Paragraph = ({ block, context }) => {
+    const attrs = block.attributes || {};
+    const textAlign = getTextAlignClasses(attrs['align']);
+    const spacing = getSpacing(context.spacingConfig || context.registry.spacingConfig, 'paragraph', 'my-6');
+    // Extract text color if specified, otherwise inherit from parent (CSS variables handle default)
+    const textColor = extractTextColor(block, context);
+    const textColorClass = textColor || '';
+    // Extract font size if specified
+    const fontSize = extractFontSize(block, context);
+    const fontSizeClass = fontSize ? getFontSizeClasses(fontSize) : '';
+    const hasHTML = block.innerHTML && /<[a-z][\s\S]*>/i.test(block.innerHTML);
+    const htmlContent = block.innerHTML || '';
     const textContent = getBlockTextContent(block);
-    return jsxRuntimeExports.jsx("p", { children: textContent });
-};
-const Heading = ({ block, children }) => {
-    // If innerHTML exists, render it as-is to preserve WP classes/styles (font sizes, weights)
-    if (block.innerHTML) {
-        return jsxRuntimeExports.jsx("div", { dangerouslySetInnerHTML: { __html: block.innerHTML } });
+    const hasShortcodes = /\[(\w+)/.test(htmlContent) || /\[(\w+)/.test(textContent);
+    if (hasShortcodes && context.registry.shortcodes) {
+        const parts = renderTextWithShortcodes(textContent, context.registry);
+        const isBlockLevelElement = (element) => {
+            if (!React.isValidElement(element))
+                return false;
+            const type = element.type;
+            if (typeof type === 'string' && ['section', 'div', 'article', 'header', 'footer', 'aside', 'nav'].includes(type))
+                return true;
+            if (type === React.Fragment) {
+                const children = React.Children.toArray(element.props.children);
+                return children.some((child) => isBlockLevelElement(child));
+            }
+            if (typeof type === 'function' || (typeof type === 'object' && type !== null && type !== React.Fragment))
+                return true;
+            return false;
+        };
+        const hasBlockLevelContent = React.Children.toArray(parts).some((part) => isBlockLevelElement(part));
+        if (hasBlockLevelContent) {
+            return jsxRuntimeExports.jsx("div", { className: buildClassName(spacing, textColorClass, fontSizeClass), children: parts });
+        }
+        return jsxRuntimeExports.jsx("p", { className: buildClassName(spacing, textAlign, textColorClass, fontSizeClass), children: parts });
+    }
+    if (hasHTML && block.innerHTML) {
+        const trimmedContent = htmlContent.trim();
+        if (trimmedContent.startsWith('<p') && trimmedContent.endsWith('</p>')) {
+            const contentMatch = trimmedContent.match(/<p[^>]*>(.*?)<\/p>/s);
+            if (contentMatch) {
+                const innerContent = contentMatch[1];
+                if (innerContent.trim().startsWith('<p')) {
+                    return jsxRuntimeExports.jsx("div", { className: buildClassName(spacing, textAlign, textColorClass, fontSizeClass), dangerouslySetInnerHTML: { __html: innerContent } });
+                }
+                return jsxRuntimeExports.jsx("p", { className: buildClassName(spacing, textAlign, textColorClass, fontSizeClass), dangerouslySetInnerHTML: { __html: innerContent } });
+            }
+        }
+        return jsxRuntimeExports.jsx("p", { className: buildClassName(spacing, textAlign, textColorClass, fontSizeClass), dangerouslySetInnerHTML: { __html: htmlContent } });
     }
+    return jsxRuntimeExports.jsx("p", { className: buildClassName(spacing, textAlign, textColorClass, fontSizeClass), children: textContent });
+};
+const Heading = ({ block, children, context }) => {
     const attrs = block.attributes || {};
     const { level = 2 } = attrs;
     const content = getBlockTextContent(block);
+    const textAlign = getTextAlignClasses(attrs['textAlign']);
+    const extractedFontSize = extractFontSize(block, context);
+    const fontSize = extractedFontSize ? getFontSizeClasses(extractedFontSize) : '';
     const Tag = `h${Math.min(Math.max(Number(level) || 2, 1), 6)}`;
-    return jsxRuntimeExports.jsx(Tag, { children: children ?? content });
+    const sizeClass = fontSize || '';
+    const spacingClass = getHeadingSpacing(context.spacingConfig || context.registry.spacingConfig, level);
+    const textColor = extractTextColor(block, context);
+    const textColorClass = textColor || '';
+    return (jsxRuntimeExports.jsx(Tag, { className: buildClassName(textColorClass, sizeClass, textAlign, spacingClass), children: children ?? content }));
 };
 const Image = ({ block, context }) => {
     const imageAttrs = getImageAttributes(block);
@@ -2656,7 +2833,10 @@ function createDefaultRegistry(colorMapper, spacingConfig) {
         // Spacer block - adds vertical spacing
         'core/spacer': ({ block }) => {
             const height = extractSpacerHeight(block);
-            if (height && height > 0) {
+            if (typeof height === 'string') {
+                return jsxRuntimeExports.jsx("div", { style: { height }, "aria-hidden": "true" });
+            }
+            if (typeof height === 'number' && height > 0) {
                 return jsxRuntimeExports.jsx("div", { style: { height: `${height}px` }, "aria-hidden": "true" });
             }
             // Default fallback if height not found
@@ -2945,115 +3125,6 @@ class WPErrorBoundary extends React.Component {
     }
 }
 
-/**
- * Parse shortcode attributes from a string
- * Supports: [shortcode attr="value" attr2="value2"]
- */
-function parseShortcodeAttrs(attrString) {
-    if (!attrString || !attrString.trim()) {
-        return {};
-    }
-    const attrs = {};
-    // Match key="value" or key='value' patterns
-    const attrRegex = /(\w+)=["']([^"']+)["']/g;
-    let match;
-    while ((match = attrRegex.exec(attrString)) !== null) {
-        attrs[match[1]] = match[2];
-    }
-    return attrs;
-}
-/**
- * Find all shortcodes in text
- * Supports: [shortcode], [shortcode attr="value"], [shortcode]content[/shortcode]
- */
-function findShortcodes(text) {
-    const shortcodes = [];
-    // First, find closing tag pairs: [shortcode]content[/shortcode]
-    const closingTagRegex = /\[(\w+)(?:\s+([^\]]+))?\](.*?)\[\/\1\]/gs;
-    let match;
-    const processedRanges = [];
-    while ((match = closingTagRegex.exec(text)) !== null) {
-        const name = match[1];
-        const attrString = match[2] || '';
-        const content = match[3] || '';
-        const attrs = parseShortcodeAttrs(attrString);
-        shortcodes.push({
-            name,
-            attrs,
-            content,
-            fullMatch: match[0],
-            startIndex: match.index,
-            endIndex: match.index + match[0].length,
-        });
-        processedRanges.push({
-            start: match.index,
-            end: match.index + match[0].length,
-        });
-    }
-    // Then, find self-closing: [shortcode attr="value"]
-    // Skip ranges already processed by closing tags
-    const selfClosingRegex = /\[(\w+)(?:\s+([^\]]+))?\]/g;
-    let selfClosingMatch;
-    while ((selfClosingMatch = selfClosingRegex.exec(text)) !== null) {
-        // Check if this match is within a processed range
-        const isProcessed = processedRanges.some(range => selfClosingMatch.index >= range.start && selfClosingMatch.index < range.end);
-        if (isProcessed) {
-            continue;
-        }
-        const name = selfClosingMatch[1];
-        const attrString = selfClosingMatch[2] || '';
-        const attrs = parseShortcodeAttrs(attrString);
-        shortcodes.push({
-            name,
-            attrs,
-            fullMatch: selfClosingMatch[0],
-            startIndex: selfClosingMatch.index,
-            endIndex: selfClosingMatch.index + selfClosingMatch[0].length,
-        });
-    }
-    // Sort by start index
-    shortcodes.sort((a, b) => a.startIndex - b.startIndex);
-    return shortcodes;
-}
-/**
- * Render text with shortcodes replaced by React components
- */
-function renderTextWithShortcodes(text, registry) {
-    const shortcodes = findShortcodes(text);
-    if (shortcodes.length === 0) {
-        return [text];
-    }
-    const parts = [];
-    let lastIndex = 0;
-    for (const shortcode of shortcodes) {
-        // Add text before shortcode
-        if (shortcode.startIndex > lastIndex) {
-            const textBefore = text.substring(lastIndex, shortcode.startIndex);
-            if (textBefore) {
-                parts.push(textBefore);
-            }
-        }
-        // Render shortcode
-        const renderer = registry.shortcodes[shortcode.name];
-        if (renderer) {
-            parts.push(jsxRuntimeExports.jsx(React.Fragment, { children: renderer(shortcode.attrs, shortcode.content) }, `shortcode-${shortcode.startIndex}`));
-        }
-        else {
-            // Keep original shortcode if no renderer found
-            parts.push(shortcode.fullMatch);
-        }
-        lastIndex = shortcode.endIndex;
-    }
-    // Add remaining text
-    if (lastIndex < text.length) {
-        const remainingText = text.substring(lastIndex);
-        if (remainingText) {
-            parts.push(remainingText);
-        }
-    }
-    return parts;
-}
-
 /**
  * Convert image URL with optional Cloudflare variant transformation
  *