@readme/markdown 13.7.1 → 13.7.3

package/dist/main.js

@@ -11704,10 +11704,47 @@ var dist_utils_default = /*#__PURE__*/__webpack_require__.n(dist_utils);
 
 let mermaid;
 const { uppercase } = (dist_utils_default());
+// Module-level queue that batches mermaid nodes across all CodeTabs instances into a
+// single mermaid.run() call. This is necessary because mermaid generates SVG element IDs
+// using Date.now(), which collides when multiple diagrams render in the same millisecond.
+// Colliding IDs cause diagrams to overlap or break layout.
+//
+// Why not use `deterministicIDSeed` with a unique ID per diagram? Mermaid's implementation
+// only uses seed.length (not the seed value) to compute the starting ID, so every UUID
+// (36 chars) produces the same `mermaid-36` prefix — the collision remains.
+// See: https://github.com/mermaid-js/mermaid/blob/mermaid%4011.12.0/packages/mermaid/src/utils.ts#L755-L761
+//
+// These vars must be module-scoped (not per-instance refs) because the batching requires
+// cross-instance coordination. They are short-lived: the queue drains on the next macrotask
+// and cleanup clears everything on unmount.
+let mermaidQueue = [];
+let mermaidFlushTimer = null;
+let currentTheme;
+function queueMermaidNode(node, theme) {
+    mermaidQueue.push(node);
+    currentTheme = theme;
+    if (!mermaidFlushTimer) {
+        // setTimeout(0) defers to a macrotask, after all useEffects have queued their nodes
+        mermaidFlushTimer = setTimeout(async () => {
+            const nodes = [...mermaidQueue];
+            mermaidQueue = [];
+            mermaidFlushTimer = null;
+            const module = await Promise.resolve(/* import() */).then(__webpack_require__.t.bind(__webpack_require__, 1387, 23));
+            mermaid = module.default;
+            mermaid.initialize({
+                startOnLoad: false,
+                theme: currentTheme === 'dark' ? 'dark' : 'default',
+                deterministicIds: true,
+            });
+            await mermaid.run({ nodes });
+        }, 0);
+    }
+}
 const CodeTabs = (props) => {
     const { children } = props;
     const theme = (0,external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_.useContext)(Theme);
     const isHydrated = useHydrated();
+    const mermaidRef = (0,external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_.useRef)(null);
     // Handle both array (from rehype-react in rendering mdxish) and single element (MDX/JSX runtime) cases
     // The children here is the individual code block objects
     const childrenArray = Array.isArray(children) ? children : [children];
@@ -11718,22 +11755,20 @@ const CodeTabs = (props) => {
         return Array.isArray(pre?.props?.children) ? pre.props.children[0] : pre?.props?.children;
     };
     const containAtLeastOneMermaid = childrenArray.some(pre => getCodeComponent(pre)?.props?.lang === 'mermaid');
-    // Render Mermaid diagram
     (0,external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_.useEffect)(() => {
-        // Ensure we only render mermaids when frontend is hydrated to avoid hydration errors
-        // because mermaid mutates the DOM before react hydrates
-        if (typeof window !== 'undefined' && containAtLeastOneMermaid && isHydrated) {
-            Promise.resolve(/* import() */).then(__webpack_require__.t.bind(__webpack_require__, 1387, 23)).then(module => {
-                mermaid = module.default;
-                mermaid.initialize({
-                    startOnLoad: false,
-                    theme: theme === 'dark' ? 'dark' : 'default',
-                });
-                mermaid.run({
-                    nodes: document.querySelectorAll('.mermaid-render'),
-                });
-            });
-        }
+        // Wait for hydration so mermaid's DOM mutations don't cause mismatches
+        if (typeof window !== 'undefined' && containAtLeastOneMermaid && isHydrated && mermaidRef.current) {
+            queueMermaidNode(mermaidRef.current, theme);
+        }
+        return () => {
+            // Clear the batch timer on unmount to prevent mermaid from running
+            // after the DOM is torn down
+            if (mermaidFlushTimer) {
+                clearTimeout(mermaidFlushTimer);
+                mermaidFlushTimer = null;
+                mermaidQueue = [];
+            }
+        };
     }, [containAtLeastOneMermaid, theme, isHydrated]);
     function handleClick({ target }, index) {
         const $wrap = target.parentElement.parentElement;
@@ -11749,15 +11784,13 @@ const CodeTabs = (props) => {
         const codeComponent = getCodeComponent(childrenArray[0]);
         if (codeComponent?.props?.lang === 'mermaid') {
             const value = codeComponent?.props?.value;
-            return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("pre", { className: "mermaid-render mermaid_single" }, value);
+            return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("pre", { ref: mermaidRef, className: "mermaid-render mermaid_single" }, value));
         }
     }
     return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("div", { className: `CodeTabs CodeTabs_initial theme-${theme}` },
         external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("div", { className: "CodeTabs-toolbar" }, childrenArray.map((pre, i) => {
             // the first or only child should be our Code component
-            const tabCodeComponent = Array.isArray(pre.props?.children)
-                ? pre.props.children[0]
-                : pre.props?.children;
+            const tabCodeComponent = Array.isArray(pre.props?.children) ? pre.props.children[0] : pre.props?.children;
             const lang = tabCodeComponent?.props?.lang;
             const meta = tabCodeComponent?.props?.meta;
             /* istanbul ignore next */
@@ -12309,10 +12342,19 @@ const TailwindStyle = ({ children, darkModeDataAttribute }) => {
             records.forEach(record => {
                 if (record.type === 'childList') {
                     record.addedNodes.forEach(node => {
-                        if (!(node instanceof HTMLElement) || !node.classList.contains(tailwindPrefix))
+                        if (!(node instanceof HTMLElement))
                             return;
-                        traverse(node, addClasses);
-                        shouldUpdate = true;
+                        // Check the added node itself
+                        if (node.classList.contains(tailwindPrefix)) {
+                            traverse(node, addClasses);
+                            shouldUpdate = true;
+                        }
+                        // Also check descendants — React may insert a parent node
+                        // whose children contain TailwindRoot elements
+                        node.querySelectorAll(`.${tailwindPrefix}`).forEach(child => {
+                            traverse(child, addClasses);
+                            shouldUpdate = true;
+                        });
                     });
                 }
                 else if (record.type === 'attributes') {
@@ -12321,10 +12363,10 @@ const TailwindStyle = ({ children, darkModeDataAttribute }) => {
                     addClasses(record.target);
                     shouldUpdate = true;
                 }
-                if (shouldUpdate) {
-                    setClasses(Array.from(classesSet.current));
-                }
             });
+            if (shouldUpdate) {
+                setClasses(Array.from(classesSet.current));
+            }
         });
         observer.observe(ref.current.parentElement, {
             subtree: true,
@@ -70410,9 +70452,416 @@ const mdast = (text, opts = {}) => {
 };
 /* harmony default export */ const lib_mdast = (mdast);
 
+;// ./lib/utils/mdxish/protect-code-blocks.ts
+/**
+ * Replaces code blocks and inline code with placeholders to protect them from preprocessing.
+ *
+ * @param content - The markdown content to process
+ * @returns Object containing protected content and arrays of original code blocks
+ * @example
+ * ```typescript
+ * const input = 'Text with `inline code` and ```fenced block```';
+ * protectCodeBlocks(input)
+ * // Returns: {
+ * //   protectedCode: {
+ * //     codeBlocks: ['```fenced block```'],
+ * //     inlineCode: ['`inline code`']
+ * //   },
+ * //   protectedContent: 'Text with ___INLINE_CODE_0___ and ___CODE_BLOCK_0___'
+ * // }
+ * ```
+ */
+function protectCodeBlocks(content) {
+    const codeBlocks = [];
+    const inlineCode = [];
+    let protectedContent = '';
+    let remaining = content;
+    let codeBlockStart = remaining.indexOf('```');
+    while (codeBlockStart !== -1) {
+        protectedContent += remaining.slice(0, codeBlockStart);
+        remaining = remaining.slice(codeBlockStart);
+        const codeBlockEnd = remaining.indexOf('```', 3);
+        if (codeBlockEnd === -1) {
+            break;
+        }
+        const match = remaining.slice(0, codeBlockEnd + 3);
+        const index = codeBlocks.length;
+        codeBlocks.push(match);
+        protectedContent += `___CODE_BLOCK_${index}___`;
+        remaining = remaining.slice(codeBlockEnd + 3);
+        codeBlockStart = remaining.indexOf('```');
+    }
+    protectedContent += remaining;
+    protectedContent = protectedContent.replace(/`([^`\n]+)`/g, match => {
+        const index = inlineCode.length;
+        inlineCode.push(match);
+        return `___INLINE_CODE_${index}___`;
+    });
+    return { protectedCode: { codeBlocks, inlineCode }, protectedContent };
+}
+/**
+ * Restores inline code by replacing placeholders with original content.
+ *
+ * @param content - Content with inline code placeholders
+ * @param protectedCode - The protected code arrays
+ * @returns Content with inline code restored
+ */
+function restoreInlineCode(content, protectedCode) {
+    return content.replace(/___INLINE_CODE_(\d+)___/g, (_m, idx) => {
+        return protectedCode.inlineCode[parseInt(idx, 10)];
+    });
+}
+/**
+ * Restores fenced code blocks by replacing placeholders with original content.
+ *
+ * @param content - Content with code block placeholders
+ * @param protectedCode - The protected code arrays
+ * @returns Content with code blocks restored
+ */
+function restoreFencedCodeBlocks(content, protectedCode) {
+    return content.replace(/___CODE_BLOCK_(\d+)___/g, (_m, idx) => {
+        return protectedCode.codeBlocks[parseInt(idx, 10)];
+    });
+}
+/**
+ * Restores all code blocks and inline code by replacing placeholders with original content.
+ *
+ * @param content - Content with code placeholders
+ * @param protectedCode - The protected code arrays
+ * @returns Content with all code blocks and inline code restored
+ * @example
+ * ```typescript
+ * const content = 'Text with ___INLINE_CODE_0___ and ___CODE_BLOCK_0___';
+ * const protectedCode = {
+ *   codeBlocks: ['```js\ncode\n```'],
+ *   inlineCode: ['`inline`']
+ * };
+ * restoreCodeBlocks(content, protectedCode)
+ * // Returns: 'Text with `inline` and ```js\ncode\n```'
+ * ```
+ */
+function restoreCodeBlocks(content, protectedCode) {
+    let restored = restoreFencedCodeBlocks(content, protectedCode);
+    restored = restoreInlineCode(restored, protectedCode);
+    return restored;
+}
+
+;// ./processor/transform/mdxish/preprocess-jsx-expressions.ts
+
+// Base64 encode (Node.js + browser compatible)
+function base64Encode(str) {
+    if (typeof Buffer !== 'undefined') {
+        return Buffer.from(str, 'utf-8').toString('base64');
+    }
+    return btoa(unescape(encodeURIComponent(str)));
+}
+// Base64 decode (Node.js + browser compatible)
+function base64Decode(str) {
+    if (typeof Buffer !== 'undefined') {
+        return Buffer.from(str, 'base64').toString('utf-8');
+    }
+    return decodeURIComponent(escape(atob(str)));
+}
+function escapeHtmlAttribute(value) {
+    return value
+        .replace(/&/g, '&')
+        .replace(/"/g, '"')
+        .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-->';
+/**
+ * Evaluates a JavaScript expression using context variables.
+ *
+ * @param expression
+ * @param context
+ * @returns The evaluated result
+ * @example
+ * ```typescript
+ * const context = { baseUrl: 'https://example.com', path: '/api' };
+ * evaluateExpression('baseUrl + path', context)
+ * // Returns: 'https://example.com/api'
+ * ```
+ */
+function evaluateExpression(expression, context) {
+    const contextKeys = Object.keys(context);
+    const contextValues = Object.values(context);
+    // eslint-disable-next-line no-new-func
+    const func = new Function(...contextKeys, `return ${expression}`);
+    return func(...contextValues);
+}
+/**
+ * Base64 encodes HTMLBlock template literal content to prevent markdown parser from consuming <script>/<style> tags.
+ *
+ * @param content
+ * @returns Content with HTMLBlock template literals base64 encoded in HTML comments
+ * @example
+ * ```typescript
+ * const input = '<HTMLBlock>{`<script>alert("xss")</script>`}</HTMLBlock>';
+ * protectHTMLBlockContent(input)
+ * // Returns: '<HTMLBlock><!--RDMX_HTMLBLOCK:PHNjcmlwdD5hbGVydCgieHNzIik8L3NjcmlwdD4=:RDMX_HTMLBLOCK--></HTMLBlock>'
+ * ```
+ */
+function protectHTMLBlockContent(content) {
+    return content.replace(/(<HTMLBlock[^>]*>)\{\s*`((?:[^`\\]|\\.)*)`\s*\}(<\/HTMLBlock>)/g, (_match, openTag, templateContent, closeTag) => {
+        const encoded = base64Encode(templateContent);
+        return `${openTag}${HTML_BLOCK_CONTENT_START}${encoded}${HTML_BLOCK_CONTENT_END}${closeTag}`;
+    });
+}
+/**
+ * Removes JSX-style comments (e.g., { /* comment *\/ }) from content.
+ *
+ * @param content
+ * @returns Content with JSX comments removed
+ * @example
+ * ```typescript
+ * removeJSXComments('Text { /* comment *\/ } more text')
+ * // Returns: 'Text  more text'
+ * ```
+ */
+function removeJSXComments(content) {
+    return content.replace(/\{\s*\/\*[^*]*(?:\*(?!\/)[^*]*)*\*\/\s*\}/g, '');
+}
+/**
+ * Extracts content between balanced braces, handling nested braces.
+ *
+ * @param content
+ * @param start
+ * @returns Object with extracted content and end position, or null if braces are unbalanced
+ * @example
+ * ```typescript
+ * const input = 'foo{bar{baz}qux}end';
+ * extractBalancedBraces(input, 3) // start at position 3 (after '{')
+ * // Returns: { content: 'bar{baz}qux', end: 16 }
+ * ```
+ */
+function extractBalancedBraces(content, start) {
+    let depth = 1;
+    let pos = start;
+    while (pos < content.length && depth > 0) {
+        const char = content[pos];
+        if (char === '{')
+            depth += 1;
+        else if (char === '}')
+            depth -= 1;
+        pos += 1;
+    }
+    if (depth !== 0)
+        return null;
+    return { content: content.slice(start, pos - 1), end: pos };
+}
+/**
+ * Escapes problematic braces in content to prevent MDX expression parsing errors.
+ * Handles three cases:
+ * 1. Unbalanced braces (e.g., `{foo` without closing `}`)
+ * 2. Paragraph-spanning expressions (e.g., `{\n\n}` where blank line splits paragraphs)
+ * 3. Skips HTML elements to prevent backslashes appearing in output
+ *
+ */
+function escapeProblematicBraces(content) {
+    // Skip HTML elements — their content should never be escaped because
+    // rehypeRaw parses them into hast elements, making `\` literal text in output
+    const htmlElements = [];
+    const safe = content.replace(/<([a-z][a-zA-Z0-9]*)(?:\s[^>]*)?>[\s\S]*?<\/\1>/g, match => {
+        const idx = htmlElements.length;
+        htmlElements.push(match);
+        return `___HTML_ELEM_${idx}___`;
+    });
+    const toEscape = new Set();
+    // Convert to array of Unicode code points to handle emojis and multi-byte characters correctly
+    const chars = Array.from(safe);
+    let strDelim = null;
+    let strEscaped = false;
+    // Stack of open braces with their state
+    const openStack = [];
+    // Track position of last newline (outside strings) to detect blank lines
+    let lastNewlinePos = -2; // -2 means no recent newline
+    for (let i = 0; i < chars.length; i += 1) {
+        const ch = chars[i];
+        // Track string delimiters inside expressions to ignore braces within them
+        if (openStack.length > 0) {
+            if (strDelim) {
+                if (strEscaped)
+                    strEscaped = false;
+                else if (ch === '\\')
+                    strEscaped = true;
+                else if (ch === strDelim)
+                    strDelim = null;
+                // eslint-disable-next-line no-continue
+                continue;
+            }
+            if (ch === '"' || ch === "'" || ch === '`') {
+                strDelim = ch;
+                // eslint-disable-next-line no-continue
+                continue;
+            }
+            // Track newlines to detect blank lines (paragraph boundaries)
+            if (ch === '\n') {
+                // Check if this newline creates a blank line (only whitespace since last newline)
+                if (lastNewlinePos >= 0) {
+                    const between = chars.slice(lastNewlinePos + 1, i).join('');
+                    if (/^[ \t]*$/.test(between)) {
+                        // This is a blank line - mark all open expressions as paragraph-spanning
+                        openStack.forEach(entry => {
+                            entry.hasBlankLine = true;
+                        });
+                    }
+                }
+                lastNewlinePos = i;
+            }
+        }
+        // Skip already-escaped braces (count preceding backslashes)
+        if (ch === '{' || ch === '}') {
+            let bs = 0;
+            for (let j = i - 1; j >= 0 && chars[j] === '\\'; j -= 1)
+                bs += 1;
+            if (bs % 2 === 1) {
+                // eslint-disable-next-line no-continue
+                continue;
+            }
+        }
+        if (ch === '{') {
+            openStack.push({ pos: i, hasBlankLine: false });
+            lastNewlinePos = -2; // Reset newline tracking for new expression
+        }
+        else if (ch === '}') {
+            if (openStack.length > 0) {
+                const entry = openStack.pop();
+                // If expression spans paragraph boundary, escape both braces
+                if (entry.hasBlankLine) {
+                    toEscape.add(entry.pos);
+                    toEscape.add(i);
+                }
+            }
+            else {
+                // Unbalanced closing brace (no matching open)
+                toEscape.add(i);
+            }
+        }
+    }
+    // Any remaining open braces are unbalanced
+    openStack.forEach(entry => toEscape.add(entry.pos));
+    // If there are no problematic braces, return safe content as-is;
+    // otherwise, escape each problematic `{` or `}` so MDX doesn't treat them as expressions.
+    let result = toEscape.size === 0
+        ? safe
+        : chars.map((ch, i) => (toEscape.has(i) ? `\\${ch}` : ch)).join('');
+    // Restore HTML elements
+    if (htmlElements.length > 0) {
+        result = result.replace(/___HTML_ELEM_(\d+)___/g, (_m, idx) => htmlElements[parseInt(idx, 10)]);
+    }
+    return result;
+}
+/**
+ * Converts JSX attribute expressions (attribute={expression}) to HTML attributes (attribute="value").
+ * Handles style objects (camelCase → kebab-case), className → class, and JSON stringifies objects.
+ *
+ * @param content
+ * @param context
+ * @returns Content with attribute expressions evaluated and converted to HTML attributes
+ * @example
+ * ```typescript
+ * const context = { baseUrl: 'https://example.com' };
+ * const input = '<a href={baseUrl}>Link</a>';
+ * evaluateAttributeExpressions(input, context)
+ * // Returns: '<a href="https://example.com">Link</a>'
+ * ```
+ */
+function evaluateAttributeExpressions(content, context, protectedCode) {
+    const attrStartRegex = /(\w+)=\{/g;
+    let result = '';
+    let lastEnd = 0;
+    let match = attrStartRegex.exec(content);
+    while (match !== null) {
+        const attributeName = match[1];
+        const braceStart = match.index + match[0].length;
+        const extracted = extractBalancedBraces(content, braceStart);
+        if (extracted) {
+            // 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 {
+                const evalResult = evaluateExpression(expression, context);
+                if (typeof evalResult === 'object' && evalResult !== null) {
+                    if (attributeName === 'style') {
+                        const cssString = Object.entries(evalResult)
+                            .map(([key, value]) => {
+                            const cssKey = key.replace(/([A-Z])/g, '-$1').toLowerCase();
+                            return `${cssKey}: ${value}`;
+                        })
+                            .join('; ');
+                        result += `style="${cssString}"`;
+                    }
+                    else {
+                        // 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') {
+                    // 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}="${escapeHtmlAttribute(String(evalResult))}"`;
+                }
+            }
+            catch (_error) {
+                result += content.slice(match.index, fullMatchEnd);
+            }
+            lastEnd = fullMatchEnd;
+            attrStartRegex.lastIndex = fullMatchEnd;
+        }
+        match = attrStartRegex.exec(content);
+    }
+    result += content.slice(lastEnd);
+    return result;
+}
+/**
+ * Preprocesses JSX-like expressions in markdown before parsing.
+ * Inline expressions are handled separately; attribute expressions are processed here.
+ *
+ * @param content
+ * @param context
+ * @returns Preprocessed content ready for markdown parsing
+ */
+function preprocessJSXExpressions(content, context = {}) {
+    // Step 0: Base64 encode HTMLBlock content
+    let processed = protectHTMLBlockContent(content);
+    // Step 1: Protect code blocks and inline code
+    const { protectedCode, protectedContent } = protectCodeBlocks(processed);
+    // Step 2: 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(protectedContent, context, protectedCode);
+    // Step 3: Escape problematic braces to prevent MDX expression parsing errors
+    // This handles both unbalanced braces and paragraph-spanning expressions in one pass
+    processed = escapeProblematicBraces(processed);
+    // Step 4: Restore protected code blocks
+    processed = restoreCodeBlocks(processed, protectedCode);
+    return processed;
+}
+
 ;// ./processor/utils.ts
 
 
+
 /**
  * Formats the hProperties of a node as a string, so they can be compiled back into JSX/MDX.
  * This currently sets all the values to a string since we process/compile the MDX on the fly
@@ -70468,7 +70917,17 @@ const getHPropKeys = (node) => {
 const getAttrs = (jsx) => jsx.attributes.reduce((memo, attr) => {
     if ('name' in attr) {
         if (typeof attr.value === 'string') {
-            memo[attr.name] = attr.value;
+            if (attr.value.startsWith(JSON_VALUE_MARKER)) {
+                try {
+                    memo[attr.name] = JSON.parse(attr.value.slice(JSON_VALUE_MARKER.length));
+                }
+                catch {
+                    memo[attr.name] = attr.value;
+                }
+            }
+            else {
+                memo[attr.name] = attr.value;
+            }
         }
         else if (attr.value === null) {
             memo[attr.name] = true;
@@ -71242,10 +71701,10 @@ const hasFlowContent = (nodes) => {
  * Process a Table node: re-parse text-only cell content, then output as
  * a markdown table (phrasing-only) or keep as JSX <Table> (has flow content).
  */
-const processTableNode = (node, index, parent) => {
+const processTableNode = (node, index, parent, documentPosition) => {
     if (node.name !== 'Table')
         return;
-    const { position } = node;
+    const position = documentPosition ?? node.position;
     const { align: alignAttr } = getAttrs(node);
     const align = Array.isArray(alignAttr) ? alignAttr : null;
     let tableHasFlowContent = false;
@@ -71368,7 +71827,7 @@ const mdxishTables = () => tree => {
             const parsed = tableNodeProcessor.runSync(tableNodeProcessor.parse(node.value));
             visit(parsed, isMDXElement, (tableNode) => {
                 if (tableNode.name === 'Table') {
-                    processTableNode(tableNode, index, parent);
+                    processTableNode(tableNode, index, parent, node.position);
                     // Stop after the outermost Table so nested Tables don't overwrite parent.children[index]
                     // we let it get handled naturally
                     return EXIT;
@@ -93843,412 +94302,6 @@ const mdxComponentHandlers = {
     [NodeTypes.htmlBlock]: htmlBlockHandler,
 };
 
-;// ./lib/utils/mdxish/protect-code-blocks.ts
-/**
- * Replaces code blocks and inline code with placeholders to protect them from preprocessing.
- *
- * @param content - The markdown content to process
- * @returns Object containing protected content and arrays of original code blocks
- * @example
- * ```typescript
- * const input = 'Text with `inline code` and ```fenced block```';
- * protectCodeBlocks(input)
- * // Returns: {
- * //   protectedCode: {
- * //     codeBlocks: ['```fenced block```'],
- * //     inlineCode: ['`inline code`']
- * //   },
- * //   protectedContent: 'Text with ___INLINE_CODE_0___ and ___CODE_BLOCK_0___'
- * // }
- * ```
- */
-function protectCodeBlocks(content) {
-    const codeBlocks = [];
-    const inlineCode = [];
-    let protectedContent = '';
-    let remaining = content;
-    let codeBlockStart = remaining.indexOf('```');
-    while (codeBlockStart !== -1) {
-        protectedContent += remaining.slice(0, codeBlockStart);
-        remaining = remaining.slice(codeBlockStart);
-        const codeBlockEnd = remaining.indexOf('```', 3);
-        if (codeBlockEnd === -1) {
-            break;
-        }
-        const match = remaining.slice(0, codeBlockEnd + 3);
-        const index = codeBlocks.length;
-        codeBlocks.push(match);
-        protectedContent += `___CODE_BLOCK_${index}___`;
-        remaining = remaining.slice(codeBlockEnd + 3);
-        codeBlockStart = remaining.indexOf('```');
-    }
-    protectedContent += remaining;
-    protectedContent = protectedContent.replace(/`([^`\n]+)`/g, match => {
-        const index = inlineCode.length;
-        inlineCode.push(match);
-        return `___INLINE_CODE_${index}___`;
-    });
-    return { protectedCode: { codeBlocks, inlineCode }, protectedContent };
-}
-/**
- * Restores inline code by replacing placeholders with original content.
- *
- * @param content - Content with inline code placeholders
- * @param protectedCode - The protected code arrays
- * @returns Content with inline code restored
- */
-function restoreInlineCode(content, protectedCode) {
-    return content.replace(/___INLINE_CODE_(\d+)___/g, (_m, idx) => {
-        return protectedCode.inlineCode[parseInt(idx, 10)];
-    });
-}
-/**
- * Restores fenced code blocks by replacing placeholders with original content.
- *
- * @param content - Content with code block placeholders
- * @param protectedCode - The protected code arrays
- * @returns Content with code blocks restored
- */
-function restoreFencedCodeBlocks(content, protectedCode) {
-    return content.replace(/___CODE_BLOCK_(\d+)___/g, (_m, idx) => {
-        return protectedCode.codeBlocks[parseInt(idx, 10)];
-    });
-}
-/**
- * Restores all code blocks and inline code by replacing placeholders with original content.
- *
- * @param content - Content with code placeholders
- * @param protectedCode - The protected code arrays
- * @returns Content with all code blocks and inline code restored
- * @example
- * ```typescript
- * const content = 'Text with ___INLINE_CODE_0___ and ___CODE_BLOCK_0___';
- * const protectedCode = {
- *   codeBlocks: ['```js\ncode\n```'],
- *   inlineCode: ['`inline`']
- * };
- * restoreCodeBlocks(content, protectedCode)
- * // Returns: 'Text with `inline` and ```js\ncode\n```'
- * ```
- */
-function restoreCodeBlocks(content, protectedCode) {
-    let restored = restoreFencedCodeBlocks(content, protectedCode);
-    restored = restoreInlineCode(restored, protectedCode);
-    return restored;
-}
-
-;// ./processor/transform/mdxish/preprocess-jsx-expressions.ts
-
-// Base64 encode (Node.js + browser compatible)
-function base64Encode(str) {
-    if (typeof Buffer !== 'undefined') {
-        return Buffer.from(str, 'utf-8').toString('base64');
-    }
-    return btoa(unescape(encodeURIComponent(str)));
-}
-// Base64 decode (Node.js + browser compatible)
-function base64Decode(str) {
-    if (typeof Buffer !== 'undefined') {
-        return Buffer.from(str, 'base64').toString('utf-8');
-    }
-    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-->';
-/**
- * Evaluates a JavaScript expression using context variables.
- *
- * @param expression
- * @param context
- * @returns The evaluated result
- * @example
- * ```typescript
- * const context = { baseUrl: 'https://example.com', path: '/api' };
- * evaluateExpression('baseUrl + path', context)
- * // Returns: 'https://example.com/api'
- * ```
- */
-function evaluateExpression(expression, context) {
-    const contextKeys = Object.keys(context);
-    const contextValues = Object.values(context);
-    // eslint-disable-next-line no-new-func
-    const func = new Function(...contextKeys, `return ${expression}`);
-    return func(...contextValues);
-}
-/**
- * Base64 encodes HTMLBlock template literal content to prevent markdown parser from consuming <script>/<style> tags.
- *
- * @param content
- * @returns Content with HTMLBlock template literals base64 encoded in HTML comments
- * @example
- * ```typescript
- * const input = '<HTMLBlock>{`<script>alert("xss")</script>`}</HTMLBlock>';
- * protectHTMLBlockContent(input)
- * // Returns: '<HTMLBlock><!--RDMX_HTMLBLOCK:PHNjcmlwdD5hbGVydCgieHNzIik8L3NjcmlwdD4=:RDMX_HTMLBLOCK--></HTMLBlock>'
- * ```
- */
-function protectHTMLBlockContent(content) {
-    return content.replace(/(<HTMLBlock[^>]*>)\{\s*`((?:[^`\\]|\\.)*)`\s*\}(<\/HTMLBlock>)/g, (_match, openTag, templateContent, closeTag) => {
-        const encoded = base64Encode(templateContent);
-        return `${openTag}${HTML_BLOCK_CONTENT_START}${encoded}${HTML_BLOCK_CONTENT_END}${closeTag}`;
-    });
-}
-/**
- * Removes JSX-style comments (e.g., { /* comment *\/ }) from content.
- *
- * @param content
- * @returns Content with JSX comments removed
- * @example
- * ```typescript
- * removeJSXComments('Text { /* comment *\/ } more text')
- * // Returns: 'Text  more text'
- * ```
- */
-function removeJSXComments(content) {
-    return content.replace(/\{\s*\/\*[^*]*(?:\*(?!\/)[^*]*)*\*\/\s*\}/g, '');
-}
-/**
- * Extracts content between balanced braces, handling nested braces.
- *
- * @param content
- * @param start
- * @returns Object with extracted content and end position, or null if braces are unbalanced
- * @example
- * ```typescript
- * const input = 'foo{bar{baz}qux}end';
- * extractBalancedBraces(input, 3) // start at position 3 (after '{')
- * // Returns: { content: 'bar{baz}qux', end: 16 }
- * ```
- */
-function extractBalancedBraces(content, start) {
-    let depth = 1;
-    let pos = start;
-    while (pos < content.length && depth > 0) {
-        const char = content[pos];
-        if (char === '{')
-            depth += 1;
-        else if (char === '}')
-            depth -= 1;
-        pos += 1;
-    }
-    if (depth !== 0)
-        return null;
-    return { content: content.slice(start, pos - 1), end: pos };
-}
-/**
- * Escapes problematic braces in content to prevent MDX expression parsing errors.
- * Handles three cases:
- * 1. Unbalanced braces (e.g., `{foo` without closing `}`)
- * 2. Paragraph-spanning expressions (e.g., `{\n\n}` where blank line splits paragraphs)
- * 3. Skips HTML elements to prevent backslashes appearing in output
- *
- */
-function escapeProblematicBraces(content) {
-    // Skip HTML elements — their content should never be escaped because
-    // rehypeRaw parses them into hast elements, making `\` literal text in output
-    const htmlElements = [];
-    const safe = content.replace(/<([a-z][a-zA-Z0-9]*)(?:\s[^>]*)?>[\s\S]*?<\/\1>/g, match => {
-        const idx = htmlElements.length;
-        htmlElements.push(match);
-        return `___HTML_ELEM_${idx}___`;
-    });
-    const toEscape = new Set();
-    // Convert to array of Unicode code points to handle emojis and multi-byte characters correctly
-    const chars = Array.from(safe);
-    let strDelim = null;
-    let strEscaped = false;
-    // Stack of open braces with their state
-    const openStack = [];
-    // Track position of last newline (outside strings) to detect blank lines
-    let lastNewlinePos = -2; // -2 means no recent newline
-    for (let i = 0; i < chars.length; i += 1) {
-        const ch = chars[i];
-        // Track string delimiters inside expressions to ignore braces within them
-        if (openStack.length > 0) {
-            if (strDelim) {
-                if (strEscaped)
-                    strEscaped = false;
-                else if (ch === '\\')
-                    strEscaped = true;
-                else if (ch === strDelim)
-                    strDelim = null;
-                // eslint-disable-next-line no-continue
-                continue;
-            }
-            if (ch === '"' || ch === "'" || ch === '`') {
-                strDelim = ch;
-                // eslint-disable-next-line no-continue
-                continue;
-            }
-            // Track newlines to detect blank lines (paragraph boundaries)
-            if (ch === '\n') {
-                // Check if this newline creates a blank line (only whitespace since last newline)
-                if (lastNewlinePos >= 0) {
-                    const between = chars.slice(lastNewlinePos + 1, i).join('');
-                    if (/^[ \t]*$/.test(between)) {
-                        // This is a blank line - mark all open expressions as paragraph-spanning
-                        openStack.forEach(entry => {
-                            entry.hasBlankLine = true;
-                        });
-                    }
-                }
-                lastNewlinePos = i;
-            }
-        }
-        // Skip already-escaped braces (count preceding backslashes)
-        if (ch === '{' || ch === '}') {
-            let bs = 0;
-            for (let j = i - 1; j >= 0 && chars[j] === '\\'; j -= 1)
-                bs += 1;
-            if (bs % 2 === 1) {
-                // eslint-disable-next-line no-continue
-                continue;
-            }
-        }
-        if (ch === '{') {
-            openStack.push({ pos: i, hasBlankLine: false });
-            lastNewlinePos = -2; // Reset newline tracking for new expression
-        }
-        else if (ch === '}') {
-            if (openStack.length > 0) {
-                const entry = openStack.pop();
-                // If expression spans paragraph boundary, escape both braces
-                if (entry.hasBlankLine) {
-                    toEscape.add(entry.pos);
-                    toEscape.add(i);
-                }
-            }
-            else {
-                // Unbalanced closing brace (no matching open)
-                toEscape.add(i);
-            }
-        }
-    }
-    // Any remaining open braces are unbalanced
-    openStack.forEach(entry => toEscape.add(entry.pos));
-    // If there are no problematic braces, return safe content as-is;
-    // otherwise, escape each problematic `{` or `}` so MDX doesn't treat them as expressions.
-    let result = toEscape.size === 0
-        ? safe
-        : chars.map((ch, i) => (toEscape.has(i) ? `\\${ch}` : ch)).join('');
-    // Restore HTML elements
-    if (htmlElements.length > 0) {
-        result = result.replace(/___HTML_ELEM_(\d+)___/g, (_m, idx) => htmlElements[parseInt(idx, 10)]);
-    }
-    return result;
-}
-/**
- * Converts JSX attribute expressions (attribute={expression}) to HTML attributes (attribute="value").
- * Handles style objects (camelCase → kebab-case), className → class, and JSON stringifies objects.
- *
- * @param content
- * @param context
- * @returns Content with attribute expressions evaluated and converted to HTML attributes
- * @example
- * ```typescript
- * const context = { baseUrl: 'https://example.com' };
- * const input = '<a href={baseUrl}>Link</a>';
- * evaluateAttributeExpressions(input, context)
- * // Returns: '<a href="https://example.com">Link</a>'
- * ```
- */
-function evaluateAttributeExpressions(content, context, protectedCode) {
-    const attrStartRegex = /(\w+)=\{/g;
-    let result = '';
-    let lastEnd = 0;
-    let match = attrStartRegex.exec(content);
-    while (match !== null) {
-        const attributeName = match[1];
-        const braceStart = match.index + match[0].length;
-        const extracted = extractBalancedBraces(content, braceStart);
-        if (extracted) {
-            // 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 {
-                const evalResult = evaluateExpression(expression, context);
-                if (typeof evalResult === 'object' && evalResult !== null) {
-                    if (attributeName === 'style') {
-                        const cssString = Object.entries(evalResult)
-                            .map(([key, value]) => {
-                            const cssKey = key.replace(/([A-Z])/g, '-$1').toLowerCase();
-                            return `${cssKey}: ${value}`;
-                        })
-                            .join('; ');
-                        result += `style="${cssString}"`;
-                    }
-                    else {
-                        // 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') {
-                    // 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}="${escapeHtmlAttribute(String(evalResult))}"`;
-                }
-            }
-            catch (_error) {
-                result += content.slice(match.index, fullMatchEnd);
-            }
-            lastEnd = fullMatchEnd;
-            attrStartRegex.lastIndex = fullMatchEnd;
-        }
-        match = attrStartRegex.exec(content);
-    }
-    result += content.slice(lastEnd);
-    return result;
-}
-/**
- * Preprocesses JSX-like expressions in markdown before parsing.
- * Inline expressions are handled separately; attribute expressions are processed here.
- *
- * @param content
- * @param context
- * @returns Preprocessed content ready for markdown parsing
- */
-function preprocessJSXExpressions(content, context = {}) {
-    // Step 0: Base64 encode HTMLBlock content
-    let processed = protectHTMLBlockContent(content);
-    // Step 1: Protect code blocks and inline code
-    const { protectedCode, protectedContent } = protectCodeBlocks(processed);
-    // Step 2: 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(protectedContent, context, protectedCode);
-    // Step 3: Escape problematic braces to prevent MDX expression parsing errors
-    // This handles both unbalanced braces and paragraph-spanning expressions in one pass
-    processed = escapeProblematicBraces(processed);
-    // Step 4: Restore protected code blocks
-    processed = restoreCodeBlocks(processed, protectedCode);
-    return processed;
-}
-
 ;// ./processor/transform/mdxish/evaluate-expressions.ts
 
 
@@ -96042,11 +96095,33 @@ const parseBlock = (text) => {
     const tree = contentParser.runSync(contentParser.parse(text));
     return tree.children;
 };
-const parseInline = (text) => {
+/**
+ * Minimal parser for api-header titles.
+ * Disables markdown constructs that are not parsed in legacy (headings, lists)
+ */
+const apiHeaderTitleParser = unified()
+    .data('micromarkExtensions', [
+    legacyVariable(),
+    looseHtmlEntity(),
+    {
+        disable: {
+            null: [
+                'blockQuote',
+                'headingAtx',
+                'list',
+                'thematicBreak',
+            ],
+        },
+    },
+])
+    .data('fromMarkdownExtensions', [legacyVariableFromMarkdown(), looseHtmlEntityFromMarkdown()])
+    .use(remarkParse)
+    .use(remarkGfm);
+const parseApiHeaderTitle = (text) => {
     if (!text.trim())
         return textToInline(text);
-    const tree = contentParser.runSync(contentParser.parse(text));
-    return tree.children;
+    const tree = apiHeaderTitleParser.runSync(apiHeaderTitleParser.parse(text));
+    return tree.children.flatMap(n => n.type === 'paragraph' && 'children' in n ? n.children : [n]);
 };
 /**
  * Transform a magicBlock node into final MDAST nodes.
@@ -96105,7 +96180,7 @@ function transformMagicBlock(blockType, data, rawValue, options = {}) {
             const depth = headerJson.level || (compatibilityMode ? 1 : 2);
             return [
                 wrapPinnedBlocks({
-                    children: 'title' in headerJson ? parseInline(headerJson.title || '') : [],
+                    children: 'title' in headerJson ? parseApiHeaderTitle(headerJson.title || '') : [],
                     depth,
                     type: 'heading',
                 }, data),
@@ -97337,11 +97412,66 @@ const transformMagicBlockEmbed = (node) => {
         position,
     };
 };
+const mdxish_jsx_to_mdast_isTableCell = (node) => isMDXElement(node) && ['th', 'td'].includes(node.name);
+/**
+ * Converts a JSX <Table> element to an MDAST table node with alignment.
+ * Returns null for header-less tables since MDAST always promotes the first row to <thead>.
+ */
+const transformTable = (jsx) => {
+    let hasThead = false;
+    visit(jsx, isMDXElement, (child) => {
+        if (child.name === 'thead')
+            hasThead = true;
+    });
+    if (!hasThead)
+        return null;
+    const { align: alignAttr } = getAttrs(jsx);
+    const align = Array.isArray(alignAttr) ? alignAttr : null;
+    const rows = [];
+    visit(jsx, isMDXElement, (child) => {
+        if (child.name !== 'thead' && child.name !== 'tbody')
+            return;
+        visit(child, isMDXElement, (row) => {
+            if (row.name !== 'tr')
+                return;
+            const cells = [];
+            visit(row, mdxish_jsx_to_mdast_isTableCell, (cell) => {
+                const parsedChildren = cell.children.flatMap(parsedNode => {
+                    if (parsedNode.type === 'paragraph' && 'children' in parsedNode && parsedNode.children) {
+                        return parsedNode.children;
+                    }
+                    return [parsedNode];
+                });
+                cells.push({
+                    type: 'tableCell',
+                    children: parsedChildren,
+                    position: cell.position,
+                });
+            });
+            rows.push({
+                type: 'tableRow',
+                children: cells,
+                position: row.position,
+            });
+        });
+    });
+    const columnCount = rows[0]?.children?.length || 0;
+    const alignArray = align && columnCount > 0
+        ? align.slice(0, columnCount).concat(Array.from({ length: Math.max(0, columnCount - align.length) }, () => null))
+        : Array.from({ length: columnCount }, () => null);
+    return {
+        type: 'table',
+        align: alignArray,
+        position: jsx.position,
+        children: rows,
+    };
+};
 const COMPONENT_MAP = {
     Callout: transformCallout,
     Embed: transformEmbed,
     Image: transformImage,
     Recipe: transformRecipe,
+    Table: transformTable,
 };
 /**
  * Transform mdxJsxFlowElement nodes and magic block nodes into proper MDAST node types.
@@ -97364,6 +97494,8 @@ const mdxishJsxToMdast = () => tree => {
         if (!transformer)
             return;
         const newNode = transformer(node);
+        if (!newNode)
+            return;
         // Replace the JSX node with the MDAST node
         parent.children[index] = newNode;
     });
@@ -97644,6 +97776,126 @@ function restoreSnakeCase(placeholderName, mapping) {
     return matchingKey ? mapping[matchingKey] : placeholderName;
 }
 
+;// ./processor/transform/mdxish/mdxish-tables-to-jsx.ts
+
+
+const mdxish_tables_to_jsx_alignToStyle = (align) => {
+    if (!align || align === 'left')
+        return null;
+    return {
+        type: 'mdxJsxAttribute',
+        name: 'style',
+        value: {
+            type: 'mdxJsxAttributeValueExpression',
+            value: `{ textAlign: "${align}" }`,
+        },
+    };
+};
+const mdxish_tables_to_jsx_isTableCell = (node) => ['tableHead', 'tableCell'].includes(node.type);
+const mdxish_tables_to_jsx_isLiteral = (node) => 'value' in node;
+/**
+ * Mdxish-specific version of `tablesToJsx`. Differs from the shared MDX version:
+ *
+ * - Excludes `html` nodes from triggering JSX conversion because raw HTML
+ *   inside JSX `<Table>` breaks remarkMdx parsing on the deserialization roundtrip.
+ * - Skips empty cells instead of aborting the entire visit so that flow content
+ *   in later cells is still detected.
+ */
+const mdxishTablesToJsx = () => tree => {
+    visit(tree, (node) => ['table', 'tableau'].includes(node.type), (table, index, parent) => {
+        let hasFlowContent = false;
+        visit(table, mdxish_tables_to_jsx_isTableCell, (cell) => {
+            if (cell.children.length === 0)
+                return;
+            const content = cell.children.length === 1 && cell.children[0].type === 'paragraph'
+                ? cell.children[0].children[0]
+                : cell.children[0];
+            if (!content)
+                return;
+            visit(cell, 'break', (_, breakIndex, breakParent) => {
+                breakParent.children.splice(breakIndex, 1, { type: 'text', value: '\n' });
+            });
+            if (!(phrasing(content) || content.type === 'plain') && content.type !== 'escape') {
+                if (content.type === 'html')
+                    return;
+                hasFlowContent = true;
+                return EXIT;
+            }
+            visit(cell, mdxish_tables_to_jsx_isLiteral, (node) => {
+                if (node.value.match(/\n/)) {
+                    hasFlowContent = true;
+                    return EXIT;
+                }
+            });
+        });
+        if (!hasFlowContent) {
+            table.type = 'table';
+            return;
+        }
+        const styles = table.align.map(mdxish_tables_to_jsx_alignToStyle);
+        const head = {
+            attributes: [],
+            type: 'mdxJsxFlowElement',
+            name: 'thead',
+            children: [
+                {
+                    attributes: [],
+                    type: 'mdxJsxFlowElement',
+                    name: 'tr',
+                    children: table.children[0].children.map((cell, cellIndex) => {
+                        return {
+                            attributes: [],
+                            type: 'mdxJsxFlowElement',
+                            name: 'th',
+                            children: cell.children,
+                            ...(styles[cellIndex] && { attributes: [styles[cellIndex]] }),
+                        };
+                    }),
+                },
+            ],
+        };
+        const body = {
+            attributes: [],
+            type: 'mdxJsxFlowElement',
+            name: 'tbody',
+            children: table.children.splice(1).map(row => {
+                return {
+                    attributes: [],
+                    type: 'mdxJsxFlowElement',
+                    name: 'tr',
+                    children: row.children.map((cell, cellIndex) => {
+                        return {
+                            type: 'mdxJsxFlowElement',
+                            name: 'td',
+                            children: cell.children,
+                            ...(styles[cellIndex] && { attributes: [styles[cellIndex]] }),
+                        };
+                    }),
+                };
+            }),
+        };
+        const attributes = [
+            {
+                type: 'mdxJsxAttribute',
+                name: 'align',
+                value: {
+                    type: 'mdxJsxAttributeValueExpression',
+                    value: JSON.stringify(table.align),
+                },
+            },
+        ];
+        const jsx = {
+            type: 'mdxJsxFlowElement',
+            name: 'Table',
+            attributes: table.align.find(a => a) ? attributes : [],
+            children: [head, body],
+        };
+        parent.children[index] = jsx;
+    });
+    return tree;
+};
+/* harmony default export */ const mdxish_tables_to_jsx = (mdxishTablesToJsx);
+
 ;// ./processor/transform/mdxish/normalize-table-separator.ts
 /**
  * Preprocessor to normalize malformed GFM table separator syntax.
@@ -99812,6 +100064,8 @@ function loadComponents() {
 
 
 
+
+
 
 
 
@@ -99909,18 +100163,28 @@ function mdxishAstProcessor(mdContent, opts = {}) {
     };
 }
 /**
- * Converts an Mdast to a Markdown string.
+ * Registers the mdx-jsx serialization extension so remark-stringify
+ * can convert JSX nodes (e.g. `<Table>`) to markdown.
+ */
+function mdxJsxStringify() {
+    const data = this.data();
+    const extensions = data.toMarkdownExtensions || (data.toMarkdownExtensions = []);
+    extensions.push({ extensions: [mdxJsxToMarkdown()] });
+}
+/**
+ * Serializes an Mdast back into a markdown string.
  */
 function mdxishMdastToMd(mdast) {
-    const md = unified()
+    const processor = unified()
         .use(remarkGfm)
+        .use(mdxish_tables_to_jsx)
         .use(mdxishCompilers)
+        .use(mdxJsxStringify)
         .use(remarkStringify, {
         bullet: '-',
         emphasis: '_',
-    })
-        .stringify(mdast);
-    return md;
+    });
+    return processor.stringify(processor.runSync(mdast));
 }
 /**
  * Processes markdown content with MDX syntax support and returns a HAST.