@marvalt/wparser 0.1.59 → 0.1.61

package/dist/index.cjs

@@ -1406,115 +1406,6 @@ 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
@@ -2258,6 +2149,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) {
@@ -2268,9 +2163,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);
+                }
             }
         }
     }
@@ -2374,109 +2277,24 @@ function buildClassName(...classes) {
 function getSpacing(spacingConfig, key, fallback) {
     return spacingConfig?.[key] || fallback;
 }
-// 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 || ''; // Don't hardcode - let CSS variables handle default
-    // Extract font size if specified
-    const fontSize = extractFontSize(block, context);
-    const fontSizeClass = fontSize ? getFontSizeClasses(fontSize) : '';
-    // Check if innerHTML contains HTML elements (like links, strong, em, etc.)
-    const hasHTML = block.innerHTML && /<[a-z][\s\S]*>/i.test(block.innerHTML);
-    // Check if content contains shortcodes (check both HTML and text content)
-    const htmlContent = block.innerHTML || '';
-    const textContent = getBlockTextContent(block);
-    const hasShortcodes = /\[(\w+)/.test(htmlContent) || /\[(\w+)/.test(textContent);
-    // If shortcodes are present, always process them (even if HTML is also present)
-    if (hasShortcodes && context.registry.shortcodes) {
-        // Process shortcodes from text content
-        const parts = renderTextWithShortcodes(textContent, context.registry);
-        // Check if any part is a block-level element (section, div, etc.)
-        const isBlockLevelElement = (element) => {
-            if (!React.isValidElement(element)) {
-                return false;
-            }
-            const type = element.type;
-            // Check for block-level HTML elements
-            if (typeof type === 'string' && ['section', 'div', 'article', 'header', 'footer', 'aside', 'nav'].includes(type)) {
-                return true;
-            }
-            // Check if it's React.Fragment - recursively check its children
-            if (type === React.Fragment) {
-                const fragmentProps = element.props;
-                const children = React.Children.toArray(fragmentProps.children);
-                return children.some((child) => isBlockLevelElement(child));
-            }
-            // Check if it's a React component (likely block-level)
-            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) {
-            // Render block-level content without <p> wrapper, but add spacing wrapper
-            const fontSize = extractFontSize(block, context);
-            const fontSizeClass = fontSize ? getFontSizeClasses(fontSize) : '';
-            return jsxRuntimeExports.jsx("div", { className: buildClassName(spacing, textColorClass, fontSizeClass), children: parts });
-        }
-        // Render shortcode parts inside paragraph (shortcodes are processed as React components)
-        return jsxRuntimeExports.jsx("p", { className: buildClassName(spacing, textAlign, textColorClass, fontSizeClass), children: parts });
-    }
-    // If innerHTML contains HTML elements but no shortcodes, render it directly (preserves links, formatting, etc.)
-    if (hasHTML && block.innerHTML) {
-        // Check if innerHTML already contains a paragraph tag - if so, extract content to avoid double nesting
-        const trimmedContent = htmlContent.trim();
-        if (trimmedContent.startsWith('<p') && trimmedContent.endsWith('</p>')) {
-            // Extract content from paragraph tag
-            const contentMatch = trimmedContent.match(/<p[^>]*>(.*?)<\/p>/s);
-            if (contentMatch) {
-                const innerContent = contentMatch[1];
-                // Check if inner content also has a paragraph (double nesting)
-                if (innerContent.trim().startsWith('<p')) {
-                    // Render as div to avoid invalid HTML
-                    return jsxRuntimeExports.jsx("div", { className: buildClassName(spacing, textAlign, textColorClass, fontSizeClass), dangerouslySetInnerHTML: { __html: innerContent } });
-                }
-                // Render the extracted content in a paragraph
-                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 } });
+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 } });
     }
-    // No HTML and no shortcodes, just render plain text content
-    return jsxRuntimeExports.jsx("p", { className: buildClassName(spacing, textAlign, textColorClass, fontSizeClass), children: textContent });
+    const textContent = getBlockTextContent(block);
+    return jsxRuntimeExports.jsx("p", { children: textContent });
 };
-const Heading = ({ block, children, context }) => {
+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 attrs = block.attributes || {};
     const { level = 2 } = attrs;
     const content = getBlockTextContent(block);
-    const textAlign = getTextAlignClasses(attrs['textAlign']);
-    // Extract font size - check both fontSize attribute and style.typography.fontSize
-    const extractedFontSize = extractFontSize(block, context);
-    const fontSize = extractedFontSize ? getFontSizeClasses(extractedFontSize) : '';
     const Tag = `h${Math.min(Math.max(Number(level) || 2, 1), 6)}`;
-    // Use CSS variables for font sizes (defined in index.css) instead of Tailwind classes
-    // Only use Tailwind class if explicitly set via fontSize attribute
-    const sizeClass = fontSize || ''; // Let CSS variables handle default sizes
-    // Get spacing from config with improved defaults
-    const spacingClass = getHeadingSpacing(context.spacingConfig || context.registry.spacingConfig, level);
-    // Extract text color if specified, otherwise inherit from parent (CSS variables handle default)
-    const textColor = extractTextColor(block, context);
-    const textColorClass = textColor || ''; // Don't hardcode - let CSS variables handle default
-    // Don't hardcode font-bold - let CSS variables handle font weight from WordPress
-    return (jsxRuntimeExports.jsx(Tag, { className: buildClassName(textColorClass, sizeClass, textAlign, spacingClass), children: children ?? content }));
+    return jsxRuntimeExports.jsx(Tag, { children: children ?? content });
 };
 const Image = ({ block, context }) => {
     const imageAttrs = getImageAttributes(block);
@@ -2850,7 +2668,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
@@ -3139,6 +2960,115 @@ 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
  *