@readme/markdown 11.14.1 → 12.0.0

package/dist/main.js

@@ -11362,7 +11362,6 @@ __webpack_require__.d(__webpack_exports__, {
   exports: () => (/* reexport */ lib_exports),
   gemojiRegex: () => (/* reexport */ gemoji_regex),
   hast: () => (/* reexport */ lib_hast),
-  isPlainText: () => (/* reexport */ isPlainText),
   mdast: () => (/* reexport */ lib_mdast),
   mdastV6: () => (/* reexport */ lib_mdastV6),
   mdx: () => (/* reexport */ lib_mdx),
@@ -52944,12 +52943,40 @@ const plain = (node, opts = {}) => {
 };
 /* harmony default export */ const lib_plain = (plain);
 
+;// ./processor/transform/extract-text.ts
+/**
+ * Extracts text content from a single AST node recursively.
+ * Works with both MDAST and HAST-like node structures.
+ *
+ * Placed this outside of the utils.ts file to avoid circular dependencies.
+ *
+ * @param node - The node to extract text from (can be MDAST Node or HAST-like structure)
+ * @returns The concatenated text content
+ */
+const extractText = (node) => {
+    if (node.type === 'text' && typeof node.value === 'string') {
+        return node.value;
+    }
+    if (node.children && Array.isArray(node.children)) {
+        return node.children
+            .map(child => {
+            if (child && typeof child === 'object' && 'type' in child) {
+                return extractText(child);
+            }
+            return '';
+        })
+            .join('');
+    }
+    return '';
+};
+
 ;// ./processor/transform/callouts.ts
 
 
 
 
 
+
 const callouts_regex = `^(${emoji_regex().source}|⚠)(\\s+|$)`;
 const findFirst = (node) => {
     if ('children' in node)
@@ -52970,42 +52997,76 @@ const wrapHeading = (node) => {
         },
     };
 };
+/**
+ * Checks if a blockquote matches the expected callout structure:
+ * blockquote > paragraph > text node
+ */
+const isCalloutStructure = (node) => {
+    const firstChild = node.children?.[0];
+    if (!firstChild || firstChild.type !== 'paragraph')
+        return false;
+    if (!('children' in firstChild))
+        return false;
+    const firstTextChild = firstChild.children?.[0];
+    return firstTextChild?.type === 'text';
+};
+const processBlockquote = (node, index, parent) => {
+    if (!isCalloutStructure(node)) {
+        // Only stringify empty blockquotes (no extractable text content)
+        // Preserve blockquotes with actual content (e.g., headings, lists, etc.)
+        const content = extractText(node);
+        const isEmpty = !content || content.trim() === '';
+        if (isEmpty && index !== undefined && parent) {
+            const textNode = {
+                type: 'text',
+                value: '>',
+            };
+            const paragraphNode = {
+                type: 'paragraph',
+                children: [textNode],
+                position: node.position,
+            };
+            parent.children.splice(index, 1, paragraphNode);
+        }
+        return;
+    }
+    // isCalloutStructure ensures node.children[0] is a Paragraph with children
+    const firstParagraph = node.children[0];
+    const startText = lib_plain(firstParagraph).toString();
+    const [match, icon] = startText.match(callouts_regex) || [];
+    if (icon && match) {
+        const heading = startText.slice(match.length);
+        const empty = !heading.length && firstParagraph.children.length === 1;
+        const theme = themes[icon] || 'default';
+        const firstChild = findFirst(node.children[0]);
+        if (firstChild && 'value' in firstChild && typeof firstChild.value === 'string') {
+            firstChild.value = firstChild.value.slice(match.length);
+        }
+        if (heading) {
+            node.children[0] = wrapHeading(node);
+            // @note: We add to the offset/column the length of the unicode
+            // character that was stripped off, so that the start position of the
+            // heading/text matches where it actually starts.
+            node.children[0].position.start.offset += match.length;
+            node.children[0].position.start.column += match.length;
+        }
+        Object.assign(node, {
+            type: NodeTypes.callout,
+            data: {
+                hName: 'Callout',
+                hProperties: {
+                    icon,
+                    ...(empty && { empty }),
+                    theme,
+                },
+            },
+        });
+    }
+};
 const calloutTransformer = () => {
     return (tree) => {
-        visit(tree, 'blockquote', (node) => {
-            if (!(node.children[0].type === 'paragraph' && node.children[0].children[0].type === 'text'))
-                return;
-            // @ts-expect-error -- @todo: update plain to accept mdast
-            const startText = lib_plain(node.children[0]).toString();
-            const [match, icon] = startText.match(callouts_regex) || [];
-            if (icon && match) {
-                const heading = startText.slice(match.length);
-                const empty = !heading.length && node.children[0].children.length === 1;
-                const theme = themes[icon] || 'default';
-                const firstChild = findFirst(node.children[0]);
-                if (firstChild && 'value' in firstChild && typeof firstChild.value === 'string') {
-                    firstChild.value = firstChild.value.slice(match.length);
-                }
-                if (heading) {
-                    node.children[0] = wrapHeading(node);
-                    // @note: We add to the offset/column the length of the unicode
-                    // character that was stripped off, so that the start position of the
-                    // heading/text matches where it actually starts.
-                    node.children[0].position.start.offset += match.length;
-                    node.children[0].position.start.column += match.length;
-                }
-                Object.assign(node, {
-                    type: NodeTypes.callout,
-                    data: {
-                        hName: 'Callout',
-                        hProperties: {
-                            icon,
-                            ...(empty && { empty }),
-                            theme,
-                        },
-                    },
-                });
-            }
+        visit(tree, 'blockquote', (node, index, parent) => {
+            processBlockquote(node, index, parent);
         });
     };
 };
@@ -70621,10 +70682,13 @@ const tagAttributePattern = /([a-zA-Z_:][-a-zA-Z0-9_:.]*)(?:\s*=\s*("[^"]*"|'[^'
 const MAX_LOOKAHEAD = 30;
 /**
  * Tags that have dedicated transformers and should NOT be handled by this plugin.
- * These components have special parsing requirements that the generic component
- * block transformer cannot handle correctly.
+ * These components either have special parsing requirements that the generic component
+ * block transformer cannot handle correctly, or are inline components that we don't
+ * want to convert to mdxJsxFlowElement which is a block level element.
+ *
+ * Glossary and Anchor are inline components.
  */
-const EXCLUDED_TAGS = new Set(['HTMLBlock', 'Table']);
+const EXCLUDED_TAGS = new Set(['HTMLBlock', 'Table', 'Glossary', 'Anchor']);
 const inlineMdProcessor = unified().use(remarkParse);
 const isClosingTag = (value, tag) => value.trim() === `</${tag}>`;
 /**
@@ -70668,6 +70732,17 @@ const parseTag = (value) => {
         contentAfterTag,
     };
 };
+/**
+ * Parse substring content of a node and update the parent's children to include the new nodes.
+ */
+const parseSibling = (stack, parent, index, sibling) => {
+    const siblingNodes = parseMdChildren(sibling);
+    // The new sibling nodes might contain new components to be processed
+    if (siblingNodes.length > 0) {
+        parent.children.splice(index + 1, 0, ...siblingNodes);
+        stack.push(parent);
+    }
+};
 /**
  * Create an MdxJsxFlowElement node from component data.
  */
@@ -70810,11 +70885,12 @@ const mdxishComponentBlocks = () => tree => {
         if ('children' in node && Array.isArray(node.children)) {
             stack.push(node);
         }
-        // Only visit HTML nodes with an actual html tag
+        // Only visit HTML nodes with an actual html tag,
+        // which means a potential unparsed MDX component
         const value = node.value;
         if (node.type !== 'html' || typeof value !== 'string')
             return;
-        const parsed = parseTag(value);
+        const parsed = parseTag(value.trim());
         if (!parsed)
             return;
         const { tag, attributes, selfClosing, contentAfterTag = '' } = parsed;
@@ -70831,11 +70907,19 @@ const mdxishComponentBlocks = () => tree => {
                 startPosition: node.position,
             });
             substituteNodeWithMdxNode(parent, index, componentNode);
+            // Check and parse if there's relevant content after the current closing tag
+            const remainingContent = contentAfterTag.trim();
+            if (remainingContent) {
+                parseSibling(stack, parent, index, remainingContent);
+            }
             return;
         }
         // Case 2: Self-contained block (closing tag in content)
         if (contentAfterTag.includes(closingTagStr)) {
-            const componentInnerContent = contentAfterTag.substring(0, contentAfterTag.lastIndexOf(closingTagStr)).trim();
+            // Find the first closing tag
+            const closingTagIndex = contentAfterTag.indexOf(closingTagStr);
+            const componentInnerContent = contentAfterTag.substring(0, closingTagIndex).trim();
+            const contentAfterClose = contentAfterTag.substring(closingTagIndex + closingTagStr.length).trim();
             const componentNode = createComponentNode({
                 tag,
                 attributes,
@@ -70843,6 +70927,14 @@ const mdxishComponentBlocks = () => tree => {
                 startPosition: node.position,
             });
             substituteNodeWithMdxNode(parent, index, componentNode);
+            // After the closing tag, there might be more content to be processed
+            if (contentAfterClose) {
+                parseSibling(stack, parent, index, contentAfterClose);
+            }
+            else if (componentNode.children.length > 0) {
+                // The content inside the component block might contain new components to be processed
+                stack.push(componentNode);
+            }
             return;
         }
         // Case 3: Multi-sibling component (closing tag in a following sibling)
@@ -70868,8 +70960,13 @@ const mdxishComponentBlocks = () => tree => {
         });
         // Remove all nodes from opening tag to closing tag (inclusive) and replace with component node
         parent.children.splice(index, closingIndex - index + 1, componentNode);
+        // Since we might be merging sibling nodes together and combining content,
+        // there might be new components to process
+        if (componentNode.children.length > 0) {
+            stack.push(componentNode);
+        }
     };
-    // Travel the tree depth-first
+    // Process the nodes with the components depth-first to maintain the correct order of the nodes
     while (stack.length) {
         const parent = stack.pop();
         if (parent?.children) {
@@ -70890,6 +70987,7 @@ const mdxishComponentBlocks = () => tree => {
 
 
 
+
 const isTableCell = (node) => isMDXElement(node) && ['th', 'td'].includes(node.name);
 const tableTypes = {
     tr: 'tableRow',
@@ -70914,18 +71012,13 @@ const isTextOnly = (children) => {
     });
 };
 /**
- * Extract text content from children nodes
+ * Convenience wrapper that extracts text content from an array of children nodes.
  */
-const extractText = (children) => {
+const extractTextFromChildren = (children) => {
     return children
         .map(child => {
         if (child && typeof child === 'object' && 'type' in child) {
-            if (child.type === 'text' && 'value' in child && typeof child.value === 'string') {
-                return child.value;
-            }
-            if (child.type === 'mdxJsxTextElement' && 'children' in child && Array.isArray(child.children)) {
-                return extractText(child.children);
-            }
+            return extractText(child);
         }
         return '';
     })
@@ -70956,7 +71049,7 @@ const processTableNode = (node, index, parent) => {
             let parsedChildren = cellChildren;
             // If cell contains only text nodes, try to re-parse as markdown
             if (isTextOnly(cellChildren)) {
-                const textContent = extractText(cellChildren);
+                const textContent = extractTextFromChildren(cellChildren);
                 if (textContent.trim()) {
                     try {
                         const parsed = parseMarkdown(textContent);
@@ -86371,7 +86464,7 @@ const CUSTOM_PROP_BOUNDARIES = [
 /**
  * Tags that should be passed through and handled at runtime (not by the mdxish plugin)
  */
-const RUNTIME_COMPONENT_TAGS = new Set(['Variable', 'variable']);
+const RUNTIME_COMPONENT_TAGS = new Set(['Variable', 'variable', 'rdme-pin']);
 /**
  * Standard HTML tags that should never be treated as custom components.
  * Uses the html-tags package, converted to a Set<string> for efficient lookups.
@@ -93002,6 +93095,33 @@ const INLINE_COMPONENT_TAGS = new Set(['anchor', 'glossary']);
 function isElementContentNode(node) {
     return node.type === 'element' || node.type === 'text' || node.type === 'comment';
 }
+/**
+ * Components are assumed to be block-level, so whitespace between them can be removed
+ * We want to remove them because it can be treated as actual children of the component
+ * when it doesn't need to.
+ *
+ * It can be a problem because it can be passed as args to the components, like the ones
+ * defined in /components, which can break the type assumptions of the components and cause
+ * type errors, accessing properties that don't exist.
+ */
+function areAllChildrenComponents(children) {
+    return children.every(child => {
+        // Whitespace-only text nodes don't affect the check
+        if (child.type === 'text' && !child.value.trim())
+            return true;
+        // Text with actual content means we have mixed content
+        if (child.type === 'text')
+            return false;
+        // Comments don't affect the check
+        if (child.type === 'comment')
+            return true;
+        // Standard HTML tags are not considered components
+        if (child.type === 'element' && 'tagName' in child) {
+            return !STANDARD_HTML_TAGS.has(child.tagName.toLowerCase());
+        }
+        return false;
+    });
+}
 /** Check if nodes represent a single paragraph with only text (no markdown formatting) */
 function isSingleParagraphTextNode(nodes) {
     return (nodes.length === 1 &&
@@ -93046,6 +93166,7 @@ function isActualHtmlTag(tagName, originalExcerpt) {
 function parseTextChildren(node, processMarkdown) {
     if (!node.children?.length)
         return;
+    // First pass: Recursively process text children as they may contain stringified markdown / mdx content
     node.children = node.children.flatMap(child => {
         if (child.type !== 'text' || !child.value.trim())
             return [child];
@@ -93057,6 +93178,15 @@ function parseTextChildren(node, processMarkdown) {
         }
         return children;
     });
+    // Post-processing: remove whitespace-only text nodes if all siblings are components
+    // This prevents whitespace between component children from being counted as extra children
+    if (areAllChildrenComponents(node.children)) {
+        node.children = node.children.filter(child => {
+            if (child.type === 'text' && !child.value.trim())
+                return false;
+            return true;
+        });
+    }
 }
 /** Convert node properties from kebab-case/lowercase to camelCase */
 function normalizeProperties(node) {
@@ -93119,6 +93249,15 @@ const mdxExpressionHandler = (_state, node) => ({
     type: 'text',
     value: node.value || '',
 });
+// Since we serialize component / html tag attributes
+function decodeHtmlEntities(value) {
+    return value
+        .replace(/&quot;/g, '"')
+        .replace(/&lt;/g, '<')
+        .replace(/&gt;/g, '>')
+        .replace(/&#10;/g, '\n')
+        .replace(/&amp;/g, '&');
+}
 // Convert MDX JSX elements to HAST elements, preserving attributes and children
 const mdxJsxElementHandler = (state, node) => {
     const { attributes = [], name } = node;
@@ -93130,7 +93269,7 @@ const mdxJsxElementHandler = (state, node) => {
             properties[attribute.name] = true;
         }
         else if (typeof attribute.value === 'string') {
-            properties[attribute.name] = attribute.value;
+            properties[attribute.name] = decodeHtmlEntities(attribute.value);
         }
         else {
             properties[attribute.name] = attribute.value.value;
@@ -93192,6 +93331,17 @@ function base64Decode(str) {
     }
     return decodeURIComponent(escape(atob(str)));
 }
+function escapeHtmlAttribute(value) {
+    return value
+        .replace(/&/g, '&amp;')
+        .replace(/"/g, '&quot;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/\n/g, '&#10;');
+}
+// Marker prefix for JSON-serialized complex values (arrays/objects)
+// Using a prefix that won't conflict with regular string values
+const JSON_VALUE_MARKER = '__MDXISH_JSON__';
 // Markers for protected HTMLBlock content (HTML comments avoid markdown parsing issues)
 const HTML_BLOCK_CONTENT_START = '<!--RDMX_HTMLBLOCK:';
 const HTML_BLOCK_CONTENT_END = ':RDMX_HTMLBLOCK-->';
@@ -93321,6 +93471,16 @@ function extractBalancedBraces(content, start) {
         return null;
     return { content: content.slice(start, pos - 1), end: pos };
 }
+function restoreInlineCode(content, protectedCode) {
+    return content.replace(/___INLINE_CODE_(\d+)___/g, (_m, idx) => {
+        return protectedCode.inlineCode[parseInt(idx, 10)];
+    });
+}
+function restoreCodeBlocks(content, protectedCode) {
+    return content.replace(/___CODE_BLOCK_(\d+)___/g, (_m, idx) => {
+        return protectedCode.codeBlocks[parseInt(idx, 10)];
+    });
+}
 /**
  * Converts JSX attribute expressions (attribute={expression}) to HTML attributes (attribute="value").
  * Handles style objects (camelCase → kebab-case), className → class, and JSON stringifies objects.
@@ -93336,7 +93496,7 @@ function extractBalancedBraces(content, start) {
  * // Returns: '<a href="https://example.com">Link</a>'
  * ```
  */
-function evaluateAttributeExpressions(content, context) {
+function evaluateAttributeExpressions(content, context, protectedCode) {
     const attrStartRegex = /(\w+)=\{/g;
     let result = '';
     let lastEnd = 0;
@@ -93346,7 +93506,14 @@ function evaluateAttributeExpressions(content, context) {
         const braceStart = match.index + match[0].length;
         const extracted = extractBalancedBraces(content, braceStart);
         if (extracted) {
-            const expression = extracted.content;
+            // The expression might contain template literals in MDX component tag props
+            // E.g. <Component greeting={`Hello World!`} />
+            // that is marked as inline code. So we need to restore the inline codes
+            // in the expression to evaluate it
+            let expression = extracted.content;
+            if (protectedCode) {
+                expression = restoreInlineCode(expression, protectedCode);
+            }
             const fullMatchEnd = extracted.end;
             result += content.slice(lastEnd, match.index);
             try {
@@ -93362,14 +93529,20 @@ function evaluateAttributeExpressions(content, context) {
                         result += `style="${cssString}"`;
                     }
                     else {
-                        result += `${attributeName}='${JSON.stringify(evalResult)}'`;
+                        // These are arrays / objects attribute values
+                        // Mark JSON-serialized values with a prefix so they can be parsed back correctly
+                        const jsonValue = escapeHtmlAttribute(JSON_VALUE_MARKER + JSON.stringify(evalResult));
+                        // Use double quotes so that multi-paragraph values are not split into multiple attributes by the processors
+                        result += `${attributeName}="${jsonValue}"`;
                     }
                 }
                 else if (attributeName === 'className') {
-                    result += `class="${evalResult}"`;
+                    // Escape special characters so that it doesn't break and split the attribute value to nodes
+                    // This will be restored later in the pipeline
+                    result += `class="${escapeHtmlAttribute(String(evalResult))}"`;
                 }
                 else {
-                    result += `${attributeName}="${evalResult}"`;
+                    result += `${attributeName}="${escapeHtmlAttribute(String(evalResult))}"`;
                 }
             }
             catch (_error) {
@@ -93400,13 +93573,9 @@ function evaluateAttributeExpressions(content, context) {
  * // Returns: 'Text with `inline` and ```js\ncode\n```'
  * ```
  */
-function restoreCodeBlocks(content, protectedCode) {
-    let restored = content.replace(/___CODE_BLOCK_(\d+)___/g, (_match, index) => {
-        return protectedCode.codeBlocks[parseInt(index, 10)];
-    });
-    restored = restored.replace(/___INLINE_CODE_(\d+)___/g, (_match, index) => {
-        return protectedCode.inlineCode[parseInt(index, 10)];
-    });
+function restoreProtectedCodes(content, protectedCode) {
+    let restored = restoreCodeBlocks(content, protectedCode);
+    restored = restoreInlineCode(restored, protectedCode);
     return restored;
 }
 /**
@@ -93427,9 +93596,9 @@ function preprocessJSXExpressions(content, context = {}) {
     // Step 3: Evaluate attribute expressions (JSX attribute syntax: href={baseUrl})
     // For inline expressions, we use a library to parse the expression & evaluate it later
     // For attribute expressions, it was difficult to use a library to parse them, so do it manually
-    processed = evaluateAttributeExpressions(processed, context);
+    processed = evaluateAttributeExpressions(processed, context, protectedCode);
     // Step 4: Restore protected code blocks
-    processed = restoreCodeBlocks(processed, protectedCode);
+    processed = restoreProtectedCodes(processed, protectedCode);
     return processed;
 }
 
@@ -93841,7 +94010,7 @@ const wrapPinnedBlocks = (node, json) => {
         return node;
     return {
         children: [node],
-        data: { className: 'pin', hName: 'rdme-pin' },
+        data: { hName: 'rdme-pin', hProperties: { className: 'pin' } },
         type: 'rdme-pin',
     };
 };
@@ -93929,15 +94098,16 @@ function parseMagicBlock(raw, options = {}) {
                 type: 'code',
                 value: obj.code.trim(),
             }));
-            // Single code block without a tab name renders as a plain code block
+            // Single code block without a tab name (meta or language) renders as a plain code block
+            // Otherwise, we want to render it as a code tabs block
             if (children.length === 1) {
                 if (!children[0].value)
                     return [];
-                if (children[0].meta)
+                if (!(children[0].meta || children[0].lang))
                     return [wrapPinnedBlocks(children[0], json)];
             }
-            // Multiple code blocks render as tabbed code blocks
-            return [wrapPinnedBlocks({ children, className: 'tabs', data: { hName: 'code-tabs' }, type: 'code-tabs' }, json)];
+            // Multiple code blocks or a single code block with a tab name (meta or language) renders as a code tabs block
+            return [wrapPinnedBlocks({ children, className: 'tabs', data: { hName: 'CodeTabs' }, type: 'code-tabs' }, json)];
         }
         // API header: renders as a heading element (h1-h6)
         case 'api-header': {
@@ -94138,11 +94308,31 @@ function parseMagicBlock(raw, options = {}) {
     }
 }
 /**
- * Check if a child node is a flow element that needs unwrapping (mdxJsxFlowElement, etc.)
+ * Block-level node types that cannot be nested inside paragraphs.
  */
-const needsUnwrapping = (child) => {
-    return child.type === 'mdxJsxFlowElement';
-};
+const blockTypes = [
+    'heading',
+    'code',
+    'code-tabs',
+    'paragraph',
+    'blockquote',
+    'list',
+    'table',
+    'thematicBreak',
+    'html',
+    'yaml',
+    'toml',
+    'rdme-pin',
+    'rdme-callout',
+    'html-block',
+    'embed',
+    'figure',
+    'mdxJsxFlowElement',
+];
+/**
+ * Check if a node is a block-level node (cannot be inside a paragraph)
+ */
+const isBlockNode = (node) => blockTypes.includes(node.type);
 /**
  * Unified plugin that restores magic blocks from placeholder tokens.
  *
@@ -94155,8 +94345,9 @@ const magicBlockRestorer = ({ blocks }) => tree => {
         return;
     // Map: key → original raw magic block content
     const magicBlockKeys = new Map(blocks.map(({ key, raw }) => [key, raw]));
-    // Find inlineCode nodes that match our placeholder tokens
-    const modifications = [];
+    // Collect replacements to apply (we need to visit in reverse to maintain indices)
+    const replacements = [];
+    // First pass: collect all replacements
     visit(tree, 'inlineCode', (node, index, parent) => {
         if (!parent || index == null)
             return undefined;
@@ -94166,31 +94357,73 @@ const magicBlockRestorer = ({ blocks }) => tree => {
         const children = parseMagicBlock(raw);
         if (!children.length)
             return undefined;
-        if (children[0] && needsUnwrapping(children[0]) && parent.type === 'paragraph') {
-            // Find paragraph's parent and unwrap
-            let paragraphParent;
-            visit(tree, 'paragraph', (p, pIndex, pParent) => {
-                if (p === parent && pParent && 'children' in pParent) {
-                    paragraphParent = pParent;
-                    return false;
+        // If parent is a paragraph and we're inserting block nodes (which must not be in paragraphs), lift them out
+        if (parent.type === 'paragraph' && children.some(child => isBlockNode(child))) {
+            const blockNodes = [];
+            const inlineNodes = [];
+            // Separate block and inline nodes
+            children.forEach(child => {
+                if (isBlockNode(child)) {
+                    blockNodes.push(child);
                 }
-                return undefined;
-            });
-            if (paragraphParent) {
-                const paragraphIndex = paragraphParent.children.indexOf(parent);
-                if (paragraphIndex !== -1) {
-                    modifications.push({ children, index: paragraphIndex, parent: paragraphParent });
+                else {
+                    inlineNodes.push(child);
                 }
-            }
-            return SKIP;
+            });
+            const before = parent.children.slice(0, index);
+            const after = parent.children.slice(index + 1);
+            replacements.push({
+                parent,
+                blockNodes,
+                inlineNodes,
+                before,
+                after,
+            });
         }
-        parent.children.splice(index, 1, ...children);
-        return [SKIP, index + children.length];
-    });
-    // Apply modifications in reverse order to avoid index shifting
-    modifications.reverse().forEach(({ children, index, parent }) => {
-        parent.children.splice(index, 1, ...children);
+        else {
+            // Normal case: just replace the inlineCode with the children
+            parent.children.splice(index, 1, ...children);
+        }
+        return undefined;
     });
+    // Second pass: apply replacements that require lifting block nodes out of paragraphs
+    // Process in reverse order to maintain correct indices
+    for (let i = replacements.length - 1; i >= 0; i -= 1) {
+        const { after, before, blockNodes, inlineNodes, parent } = replacements[i];
+        // Find the paragraph's position in the root
+        const rootChildren = tree.children;
+        const paraIndex = rootChildren.findIndex(child => child === parent);
+        if (paraIndex === -1) {
+            // Paragraph not found in root - fall back to normal replacement
+            // This shouldn't happen normally, but handle it gracefully
+            // Reconstruct the original index from before.length
+            const originalIndex = before.length;
+            parent.children.splice(originalIndex, 1, ...blockNodes, ...inlineNodes);
+            // eslint-disable-next-line no-continue
+            continue;
+        }
+        // Update or remove the paragraph
+        if (inlineNodes.length > 0) {
+            // Keep paragraph with inline nodes
+            parent.children = [...before, ...inlineNodes, ...after];
+            // Insert block nodes after the paragraph
+            if (blockNodes.length > 0) {
+                rootChildren.splice(paraIndex + 1, 0, ...blockNodes);
+            }
+        }
+        else if (before.length === 0 && after.length === 0) {
+            // Remove empty paragraph and replace with block nodes
+            rootChildren.splice(paraIndex, 1, ...blockNodes);
+        }
+        else {
+            // Keep paragraph with remaining content
+            parent.children = [...before, ...after];
+            // Insert block nodes after the paragraph
+            if (blockNodes.length > 0) {
+                rootChildren.splice(paraIndex + 1, 0, ...blockNodes);
+            }
+        }
+    }
 };
 /* harmony default export */ const mdxish_magic_blocks = (magicBlockRestorer);
 
@@ -94414,6 +94647,92 @@ const normalizeEmphasisAST = () => (tree) => {
 };
 /* harmony default export */ const normalize_malformed_md_syntax = (normalizeEmphasisAST);
 
+;// ./processor/transform/mdxish/normalize-table-separator.ts
+/**
+ * Preprocessor to normalize malformed GFM table separator syntax.
+ *
+ * Fixes the common mistake where the alignment colon is placed after the pipe
+ * instead of before the dashes:
+ *
+ * Invalid: `|: ---` or `|:---` (colon after pipe)
+ * Valid:   `| :---` (colon before dashes)
+ *
+ * Also handles right alignment:
+ * Invalid: `| ---:| ` with space before pipe
+ * Valid:   `| ---:|` (no space before closing pipe)
+ *
+ * This runs before remark-parse to ensure the table is recognized as a valid GFM table.
+ */
+/**
+ * Pattern to match a table separator row.
+ * A separator row consists of cells that contain only dashes, colons (for alignment), and spaces.
+ *
+ * Valid GFM separator formats:
+ * - `---` or `----` (no alignment, defaults to left)
+ * - `:---` (left aligned)
+ * - `---:` (right aligned)
+ * - `:---:` (center aligned)
+ *
+ * Invalid formats this fixes:
+ * - `|: ---` → `| :---` (colon wrongly placed after pipe)
+ * - `|:---` → `| :---` (colon directly after pipe, missing space)
+ * - `|::---` or `| ::---` → `| :---` (double colon typo)
+ */
+// Match a line that looks like a table separator row
+// This regex captures the whole line if it contains only pipe-separated cells with dashes/colons
+const TABLE_SEPARATOR_LINE_REGEX = /^(\|[:\s-]+)+\|?\s*$/;
+// Match malformed left-alignment: `|: ` or `|:` followed by dashes
+// Captures: group 1 = pipe, group 2 = spaces after colon, group 3 = dashes
+const MALFORMED_LEFT_ALIGN_REGEX = /\|:(\s*)(-+)/g;
+// Match malformed double colon: `|::---` or `| ::---` → `| :---`
+const MALFORMED_DOUBLE_COLON_REGEX = /\|\s*::(\s*)(-+)/g;
+// Match malformed patterns with spaces before closing colons: `| --- : |` → `| ---: |`
+const MALFORMED_RIGHT_ALIGN_SPACE_REGEX = /(-+)\s+:(\s*\|)/g;
+// Match malformed center alignment with spaces: `| : --- : |` → `| :---: |`
+const MALFORMED_CENTER_ALIGN_REGEX = /\|:(\s+)(-+)(\s+):/g;
+/**
+ * Normalizes a single table separator line.
+ */
+function normalizeTableSeparatorLine(line) {
+    // Check if this line looks like a table separator
+    if (!TABLE_SEPARATOR_LINE_REGEX.test(line)) {
+        return line;
+    }
+    let normalized = line;
+    // Fix `|::---` → `| :---` (double colon typo)
+    // Must run before single colon fix to avoid partial replacement
+    normalized = normalized.replace(MALFORMED_DOUBLE_COLON_REGEX, '| :$2');
+    // Fix `|: ---` or `|:---` → `| :---`
+    // The colon should be adjacent to the dashes, not the pipe
+    normalized = normalized.replace(MALFORMED_LEFT_ALIGN_REGEX, '| :$2');
+    // Fix `| --- : |` → `| ---: |`
+    // Remove space before right-alignment colon
+    normalized = normalized.replace(MALFORMED_RIGHT_ALIGN_SPACE_REGEX, '$1:$2');
+    // Fix `| : --- : |` → `| :---: |`
+    // Remove spaces around center-aligned dashes
+    normalized = normalized.replace(MALFORMED_CENTER_ALIGN_REGEX, '| :$2:');
+    return normalized;
+}
+/**
+ * Preprocesses markdown content to normalize malformed table separator syntax.
+ *
+ * @param content - The raw markdown content
+ * @returns The content with normalized table separators
+ */
+function normalizeTableSeparator(content) {
+    const lines = content.split('\n');
+    const normalizedLines = lines.map((line, index) => {
+        const prevLine = index > 0 ? lines[index - 1] : '';
+        const isPrevLineTableRow = prevLine.trim().startsWith('|');
+        if (isPrevLineTableRow) {
+            return normalizeTableSeparatorLine(line);
+        }
+        return line;
+    });
+    return normalizedLines.join('\n');
+}
+/* harmony default export */ const normalize_table_separator = ((/* unused pure expression or super */ null && (normalizeTableSeparator)));
+
 ;// ./processor/transform/mdxish/restore-snake-case-component-name.ts
 
 
@@ -94677,6 +94996,7 @@ function loadComponents() {
 
 
 
+
 
 
 const defaultTransformers = [callouts, code_tabs, gemoji_, transform_embeds];
@@ -94689,9 +95009,11 @@ function mdxishAstProcessor(mdContent, opts = {}) {
     // Preprocessing pipeline: Transform content to be parser-ready
     // Step 1: Extract legacy magic blocks
     const { replaced: contentAfterMagicBlocks, blocks } = extractMagicBlocks(mdContent);
-    // Step 2: Evaluate JSX expressions in attributes
-    const contentAfterJSXEvaluation = preprocessJSXExpressions(contentAfterMagicBlocks, jsxContext);
-    // Step 3: Replace snake_case component names with parser-safe placeholders
+    // Step 2: Normalize malformed table separator syntax (e.g., `|: ---` → `| :---`)
+    const contentAfterTableNormalization = normalizeTableSeparator(contentAfterMagicBlocks);
+    // Step 3: Evaluate JSX expressions in attributes
+    const contentAfterJSXEvaluation = preprocessJSXExpressions(contentAfterTableNormalization, jsxContext);
+    // Step 4: Replace snake_case component names with parser-safe placeholders
     // (e.g., <Snake_case /> → <MDXishSnakeCase0 /> which will be restored after parsing)
     const { content: parserReadyContent, mapping: snakeCaseMapping } = processSnakeCaseComponent(contentAfterJSXEvaluation);
     // Create string map for tailwind transformer
@@ -94955,6 +95277,40 @@ const makeUseMDXComponents = (more = {}) => {
 
 
 
+
+/**
+ * Parse JSON-marked string values in props back to their original types.
+ * This handles arrays and objects that were serialized during JSX preprocessing.
+ */
+function parseJsonProps(props) {
+    if (!props)
+        return props;
+    const parsed = {};
+    Object.entries(props).forEach(([key, value]) => {
+        if (typeof value === 'string' && value.startsWith(JSON_VALUE_MARKER)) {
+            try {
+                parsed[key] = JSON.parse(value.slice(JSON_VALUE_MARKER.length));
+            }
+            catch {
+                // If parsing fails, use the value without the marker
+                parsed[key] = value.slice(JSON_VALUE_MARKER.length);
+            }
+        }
+        else {
+            parsed[key] = value;
+        }
+    });
+    return parsed;
+}
+/**
+ * Custom createElement wrapper that parses JSON-marked string props.
+ * This is needed because rehype-react converts HAST to React, but complex
+ * types (arrays/objects) get serialized to strings during markdown parsing.
+ */
+function createElementWithJsonProps(type, props, ...children) {
+    const parsedProps = parseJsonProps(props);
+    return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement(type, parsedProps, ...children);
+}
 /** Flatten CustomComponents into a component map for rehype-react */
 function exportComponentsForRehype(components) {
     const exported = Object.entries(components).reduce((memo, [tag, mod]) => {
@@ -94986,7 +95342,7 @@ function exportComponentsForRehype(components) {
 function createRehypeReactProcessor(components) {
     // @ts-expect-error - rehype-react types are incompatible with React.Fragment return type
     return unified().use((rehype_react_default()), {
-        createElement: (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default()).createElement,
+        createElement: createElementWithJsonProps,
         Fragment: (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default()).Fragment,
         components,
     });
@@ -95295,89 +95651,6 @@ async function stripComments(doc, { mdx } = {}) {
 }
 /* harmony default export */ const lib_stripComments = (stripComments);
 
-;// ./lib/utils/isPlainText.ts
-
-/**
- * Detects if content contains HTML, magic blocks, or MDX syntax.
- *
- * We can use this in some pipelines to determine if we should have to parse content through
- * `.plain() or if it is already plain text and it should be able to detect everything that would
- * be stripped or sanitized by `.plain()`.
- *
- */
-function isPlainText(content) {
-    if (!content || typeof content !== 'string') {
-        return true;
-    }
-    // Exclude markdown code blocks and inline code to avoid false positives
-    // Match code blocks with optional language identifier: ```lang\n...\n```
-    const codeBlockRegex = /```[^\n]*\n[\s\S]*?```/g;
-    // Match inline code: `code` (but not escaped backticks)
-    const inlineCodeRegex = /`[^`\n]+`/g;
-    // Remove code blocks and inline code to avoid false positives
-    let contentWithoutCode = structuredClone(content);
-    contentWithoutCode = contentWithoutCode.replace(codeBlockRegex, '');
-    contentWithoutCode = contentWithoutCode.replace(inlineCodeRegex, '');
-    // Check for magic blocks: `[block:TYPE]...[/block]`
-    // Only check after removing code blocks to avoid detecting magic blocks in code
-    if (contentWithoutCode.match(MAGIC_BLOCK_REGEX) !== null) {
-        return false;
-    }
-    // Check for markdown links: [text](url) or [text][reference]
-    // Pattern matches inline links and reference-style links
-    // Exclude images which start with ! before the bracket
-    // Only check after removing code blocks
-    const markdownLinkPattern = /(?<!!)\[([^\]]+)\]\(([^)]+)\)|(?<!!)\[([^\]]+)\]\[([^\]]*)\]/;
-    if (markdownLinkPattern.test(contentWithoutCode)) {
-        return false;
-    }
-    // Check for JSX elements (PascalCase components) in the original content
-    // This includes code blocks since JSX code examples should be detected
-    // Pattern matches:
-    // - Self-closing: <Component /> or <Component/>
-    // - With attributes: <Component prop="value" />
-    // - With children: <Component>...</Component>
-    // Use simpler, safer patterns to avoid ReDoS from backtracking
-    // Match self-closing tags with bounded attribute length to prevent excessive backtracking
-    const jsxSelfClosingPattern = /<[A-Z][a-zA-Z0-9]*(?:\s[^>]{0,50})?\/>/;
-    if (jsxSelfClosingPattern.test(content)) {
-        return false;
-    }
-    // For components with children, use a safer pattern that limits backtracking
-    // Match opening tag with bounded attributes, then look for closing tag with same name
-    const jsxWithChildrenPattern = /<([A-Z][a-zA-Z0-9]*)(?:\s[^>]{0,50})?>[\s\S]{0,50}<\/\1>/;
-    if (jsxWithChildrenPattern.test(content)) {
-        return false;
-    }
-    // Check for MDX expressions and HTML tags in the original content
-    // HTML/JSX/MDX in code blocks should be detected (as per test requirements)
-    // But exclude inline code that contains magic block patterns to avoid false positives
-    let contentForHtmlMdx = content;
-    // Find inline code blocks and check if they contain [block: pattern
-    // Exclude these from HTML/MDX detection to avoid false positives
-    const inlineCodePattern = /`[^`\n]+`/g;
-    let inlineCodeMatch;
-    inlineCodePattern.lastIndex = 0;
-    while ((inlineCodeMatch = inlineCodePattern.exec(content)) !== null) {
-        if (inlineCodeMatch[0].includes('[block:')) {
-            contentForHtmlMdx = contentForHtmlMdx.replace(inlineCodeMatch[0], '');
-        }
-    }
-    // Match simple MDX variable expressions like {variable}, {user.name}, {getValue()}, {}
-    // Use bounded quantifier to prevent ReDoS - limit to reasonable variable name length
-    // Allow empty braces {} to be detected as well
-    const jsxExpressionPattern = /\{[^}"]{0,50}\}/;
-    if (jsxExpressionPattern.test(contentForHtmlMdx)) {
-        return false;
-    }
-    // Match HTML tags with bounded attribute length to prevent ReDoS
-    const htmlTagPattern = /<[a-z][a-z0-9]*(?:\s[^>]{0,50})?(?:\/>|>)/i;
-    if (htmlTagPattern.test(contentForHtmlMdx)) {
-        return false;
-    }
-    return true;
-}
-
 ;// ./lib/index.ts
 
 
@@ -95396,7 +95669,6 @@ function isPlainText(content) {
 
 
 
-
 ;// ./index.tsx