@readme/markdown 14.11.5 → 14.12.0

package/dist/main.js

@@ -1,13 +1,13 @@
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("@readme/syntax-highlighter"), require("@readme/variable"), require("@tippyjs/react"), require("acorn"), require("mermaid"), require("react"), require("react-dom"));
+		module.exports = factory(require("@readme/syntax-highlighter"), require("@readme/variable"), require("@tippyjs/react"), require("acorn"), require("react"), require("react-dom"));
 	else if(typeof define === 'function' && define.amd)
-		define(["@readme/syntax-highlighter", "@readme/variable", "@tippyjs/react", "acorn", "mermaid", "react", "react-dom"], factory);
+		define(["@readme/syntax-highlighter", "@readme/variable", "@tippyjs/react", "acorn", "react", "react-dom"], factory);
 	else {
-		var a = typeof exports === 'object' ? factory(require("@readme/syntax-highlighter"), require("@readme/variable"), require("@tippyjs/react"), require("acorn"), require("mermaid"), require("react"), require("react-dom")) : factory(root["@readme/syntax-highlighter"], root["@readme/variable"], root["@tippyjs/react"], root["acorn"], root["mermaid"], root["React"], root["ReactDOM"]);
+		var a = typeof exports === 'object' ? factory(require("@readme/syntax-highlighter"), require("@readme/variable"), require("@tippyjs/react"), require("acorn"), require("react"), require("react-dom")) : factory(root["@readme/syntax-highlighter"], root["@readme/variable"], root["@tippyjs/react"], root["acorn"], root["React"], root["ReactDOM"]);
 		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
 	}
-})(self, (__WEBPACK_EXTERNAL_MODULE__3966__, __WEBPACK_EXTERNAL_MODULE__8167__, __WEBPACK_EXTERNAL_MODULE__4189__, __WEBPACK_EXTERNAL_MODULE__6473__, __WEBPACK_EXTERNAL_MODULE__1387__, __WEBPACK_EXTERNAL_MODULE__1307__, __WEBPACK_EXTERNAL_MODULE__8759__) => {
+})(self, (__WEBPACK_EXTERNAL_MODULE__3966__, __WEBPACK_EXTERNAL_MODULE__8167__, __WEBPACK_EXTERNAL_MODULE__4189__, __WEBPACK_EXTERNAL_MODULE__6473__, __WEBPACK_EXTERNAL_MODULE__1307__, __WEBPACK_EXTERNAL_MODULE__8759__) => {
 return /******/ (() => { // webpackBootstrap
 /******/ 	var __webpack_modules__ = ({
 
@@ -11327,6 +11327,14 @@ module.exports = function () {
 };
 
 
+/***/ }),
+
+/***/ 9446:
+/***/ ((module) => {
+
+"use strict";
+module.exports = import("mermaid");;
+
 /***/ }),
 
 /***/ 3966:
@@ -11361,14 +11369,6 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__6473__;
 
 /***/ }),
 
-/***/ 1387:
-/***/ ((module) => {
-
-"use strict";
-module.exports = __WEBPACK_EXTERNAL_MODULE__1387__;
-
-/***/ }),
-
 /***/ 1307:
 /***/ ((module) => {
 
@@ -11975,7 +11975,7 @@ function queueMermaidNode(node, theme) {
             const nodes = [...mermaidQueue];
             mermaidQueue = [];
             mermaidFlushTimer = null;
-            const module = await Promise.resolve(/* import() */).then(__webpack_require__.t.bind(__webpack_require__, 1387, 23));
+            const module = await Promise.resolve(/* import() */).then(__webpack_require__.bind(__webpack_require__, 9446));
             mermaid = module.default;
             mermaid.initialize({
                 startOnLoad: false,
@@ -12211,17 +12211,12 @@ const extractScripts = (html = '') => {
     return [cleaned, () => scripts.map(js => window.eval(js))];
 };
 const HTMLBlock = ({ children = '', html: htmlProp, runScripts, safeMode: safeModeRaw = false }) => {
-    // Determine HTML source: MDXish uses html prop (from HAST), MDX uses children
-    let html = '';
-    if (htmlProp !== undefined) {
-        html = htmlProp;
-    }
-    else {
-        if (typeof children !== 'string') {
-            throw new TypeError('HTMLBlock: children must be a string');
-        }
-        html = children;
-    }
+    // Determine HTML source: MDXish uses html prop (from HAST), MDX uses children.
+    // A non-string child (no html prop) can't be injected as raw HTML — see the
+    // fail-soft fallback below.
+    const htmlSource = htmlProp !== undefined ? htmlProp : children;
+    const nonStringChildren = typeof htmlSource !== 'string';
+    const html = nonStringChildren ? '' : htmlSource;
     // eslint-disable-next-line no-param-reassign
     runScripts = typeof runScripts !== 'boolean' ? runScripts === 'true' : runScripts;
     // In MDX mode, safeMode is passed in as a boolean from JSX parsing
@@ -12232,6 +12227,11 @@ const HTMLBlock = ({ children = '', html: htmlProp, runScripts, safeMode: safeMo
         if (typeof window !== 'undefined' && typeof runScripts === 'boolean' && runScripts)
             exec();
     }, [runScripts, exec]);
+    if (nonStringChildren) {
+        // Fail soft: a non-string child (e.g. JSX that wasn't serialized back to a
+        // raw string) should never throw, so render the child nodes directly
+        return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("div", { className: "rdmd-html" }, children);
+    }
     if (safeMode) {
         return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("pre", { className: "html-unsafe" },
             external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("code", null, html)));
@@ -76446,6 +76446,9 @@ const TOP_LEVEL_TABLE_TAG_RE = /^<(?:table|Table)(?=[\s/>])/;
  * Uses `walkTags` so `<table>`s inside code spans / fenced blocks (masked away)
  * are never matched.
  *
+ * `<table>`s inside an `<HTMLBlock>` body are also ignored: that body is opaque
+ * raw HTML, so lifting a table out of it would corrupt the block.
+ *
  * Note: An implicitly-closed table (no `</table>`, so htmlparser2 synthesizes the
  * close at a later tag) is skipped: splitting there would swallow whatever
  * followed the table into the fragment and drop it, so we leave such a node
@@ -76453,21 +76456,35 @@ const TOP_LEVEL_TABLE_TAG_RE = /^<(?:table|Table)(?=[\s/>])/;
  */
 const findTableRanges = (html) => {
     const ranges = [];
-    let depth = 0;
+    let tableDepth = 0;
+    let htmlBlockDepth = 0;
     let start = 0;
     walkTags(html, {
-        onOpen: ({ name, start: openStart, isStrayCloser }) => {
-            if (name.toLowerCase() !== 'table' || isStrayCloser)
+        onOpen: ({ name, start: openStart, isSelfClosing, isStrayCloser }) => {
+            if (isStrayCloser)
                 return;
-            if (depth === 0)
+            // `<HTMLBlock/>` has no body to protect; only a real open enters one.
+            if (name === 'HTMLBlock') {
+                if (!isSelfClosing)
+                    htmlBlockDepth += 1;
+                return;
+            }
+            if (htmlBlockDepth > 0 || name.toLowerCase() !== 'table')
+                return;
+            if (tableDepth === 0)
                 start = openStart;
-            depth += 1;
+            tableDepth += 1;
         },
         onClose: ({ name, end, implicit }) => {
-            if (implicit || name.toLowerCase() !== 'table' || depth === 0)
+            if (name === 'HTMLBlock') {
+                if (!implicit && htmlBlockDepth > 0)
+                    htmlBlockDepth -= 1;
                 return;
-            depth -= 1;
-            if (depth === 0)
+            }
+            if (implicit || htmlBlockDepth > 0 || name.toLowerCase() !== 'table' || tableDepth === 0)
+                return;
+            tableDepth -= 1;
+            if (tableDepth === 0)
                 ranges.push({ start, end });
         },
     });
@@ -76487,7 +76504,9 @@ const splitHtmlWithNestedTables = (node) => {
     // This is a top-level table, so we don't need to split it
     if (TOP_LEVEL_TABLE_TAG_RE.test(value))
         return null;
-    // No table text anywhere in the value → skip the htmlparser2 walk entirely.
+    // No table text anywhere → skip the htmlparser2 walk entirely. (A `<table>` that
+    // only appears inside an `<HTMLBlock>` body still yields no ranges below, so it's
+    // left whole for `mdxishHtmlBlocks` to convert to an html-block next.)
     if (!/<\/?table/i.test(value))
         return null;
     const ranges = findTableRanges(value);
@@ -99649,6 +99668,55 @@ function emptyTaskListItemFromMarkdown() {
     };
 }
 
+;// ./lib/mdast-util/jsx-table/index.ts
+const jsx_table_contextMap = new WeakMap();
+function findJsxTableToken() {
+    const events = this.tokenStack;
+    for (let i = events.length - 1; i >= 0; i -= 1) {
+        if (events[i][0].type === 'jsxTable')
+            return events[i][0];
+    }
+    return undefined;
+}
+function enterJsxTable(token) {
+    jsx_table_contextMap.set(token, { chunks: [], lastEndLine: token.start.line });
+    this.enter({ type: 'html', value: '' }, token);
+}
+function exitJsxTableData(token) {
+    const tableToken = findJsxTableToken.call(this);
+    if (!tableToken)
+        return;
+    const ctx = jsx_table_contextMap.get(tableToken);
+    if (ctx) {
+        const gap = token.start.line - ctx.lastEndLine;
+        if (ctx.chunks.length > 0 && gap > 0) {
+            ctx.chunks.push('\n'.repeat(gap));
+        }
+        ctx.chunks.push(this.sliceSerialize(token));
+        ctx.lastEndLine = token.end.line;
+    }
+}
+function exitJsxTable(token) {
+    const ctx = jsx_table_contextMap.get(token);
+    const node = this.stack[this.stack.length - 1];
+    if (ctx) {
+        node.value = ctx.chunks.join('');
+        jsx_table_contextMap.delete(token);
+    }
+    this.exit(token);
+}
+function jsxTableFromMarkdown() {
+    return {
+        enter: {
+            jsxTable: enterJsxTable,
+        },
+        exit: {
+            jsxTableData: exitJsxTableData,
+            jsxTable: exitJsxTable,
+        },
+    };
+}
+
 ;// ./lib/mdast-util/magic-block/index.ts
 const magic_block_contextMap = new WeakMap();
 /**
@@ -99838,867 +99906,16 @@ function mdxComponentFromMarkdown() {
     };
 }
 
-;// ./lib/micromark/magic-block/syntax.ts
-
-
-/**
- * Known magic block types that the tokenizer will recognize.
- * Unknown types will not be tokenized as magic blocks.
- */
-const KNOWN_BLOCK_TYPES = new Set([
-    'code',
-    'api-header',
-    'image',
-    'callout',
-    'parameters',
-    'table',
-    'embed',
-    'html',
-    'recipe',
-    'tutorial-tile',
-]);
-/**
- * Check if a character is valid for a magic block type identifier.
- * Types can contain alphanumeric characters and hyphens (e.g., "api-header", "tutorial-tile")
- */
-function isTypeChar(code) {
-    return asciiAlphanumeric(code) || code === codes.dash;
-}
-/**
- * Creates the opening marker state machine: [block:
- * Returns the first state function to start parsing.
- */
-function createOpeningMarkerParser(effects, nok, onComplete) {
-    const expectB = (code) => {
-        if (code !== codes.lowercaseB)
-            return nok(code);
-        effects.consume(code);
-        return expectL;
-    };
-    const expectL = (code) => {
-        if (code !== codes.lowercaseL)
-            return nok(code);
-        effects.consume(code);
-        return expectO;
-    };
-    const expectO = (code) => {
-        if (code !== codes.lowercaseO)
-            return nok(code);
-        effects.consume(code);
-        return expectC;
-    };
-    const expectC = (code) => {
-        if (code !== codes.lowercaseC)
-            return nok(code);
-        effects.consume(code);
-        return expectK;
-    };
-    const expectK = (code) => {
-        if (code !== codes.lowercaseK)
-            return nok(code);
-        effects.consume(code);
-        return expectColon;
-    };
-    const expectColon = (code) => {
-        if (code !== codes.colon)
-            return nok(code);
-        effects.consume(code);
-        effects.exit('magicBlockMarkerStart');
-        effects.enter('magicBlockType');
-        return onComplete;
-    };
-    return expectB;
-}
-/**
- * Creates the type capture state machine.
- * Captures type characters until ] and validates against known types.
- */
-function createTypeCaptureParser(effects, nok, onComplete, blockTypeRef) {
-    const captureTypeFirst = (code) => {
-        // Reject empty type name [block:]
-        if (code === codes.rightSquareBracket) {
-            return nok(code);
-        }
-        if (isTypeChar(code)) {
-            blockTypeRef.value += String.fromCharCode(code);
-            effects.consume(code);
-            return captureType;
-        }
-        return nok(code);
-    };
-    const captureType = (code) => {
-        if (code === codes.rightSquareBracket) {
-            if (!KNOWN_BLOCK_TYPES.has(blockTypeRef.value)) {
-                return nok(code);
-            }
-            effects.exit('magicBlockType');
-            effects.enter('magicBlockMarkerTypeEnd');
-            effects.consume(code);
-            effects.exit('magicBlockMarkerTypeEnd');
-            return onComplete;
-        }
-        if (isTypeChar(code)) {
-            blockTypeRef.value += String.fromCharCode(code);
-            effects.consume(code);
-            return captureType;
-        }
-        return nok(code);
-    };
-    return { first: captureTypeFirst, remaining: captureType };
-}
-/**
- * Creates the closing marker state machine: /block]
- * Handles partial matches by calling onMismatch to fall back to data capture.
- */
-function createClosingMarkerParser(effects, onSuccess, onMismatch, onEof, jsonState) {
-    const handleMismatch = (code) => {
-        if (jsonState && code === codes.quotationMark) {
-            jsonState.inString = true;
-        }
-        return onMismatch(code);
-    };
-    const expectSlash = (code) => {
-        if (code === null)
-            return onEof(code);
-        if (code !== codes.slash)
-            return handleMismatch(code);
-        effects.consume(code);
-        return expectB;
-    };
-    const expectB = (code) => {
-        if (code === null)
-            return onEof(code);
-        if (code !== codes.lowercaseB)
-            return handleMismatch(code);
-        effects.consume(code);
-        return expectL;
-    };
-    const expectL = (code) => {
-        if (code === null)
-            return onEof(code);
-        if (code !== codes.lowercaseL)
-            return handleMismatch(code);
-        effects.consume(code);
-        return expectO;
-    };
-    const expectO = (code) => {
-        if (code === null)
-            return onEof(code);
-        if (code !== codes.lowercaseO)
-            return handleMismatch(code);
-        effects.consume(code);
-        return expectC;
-    };
-    const expectC = (code) => {
-        if (code === null)
-            return onEof(code);
-        if (code !== codes.lowercaseC)
-            return handleMismatch(code);
-        effects.consume(code);
-        return expectK;
-    };
-    const expectK = (code) => {
-        if (code === null)
-            return onEof(code);
-        if (code !== codes.lowercaseK)
-            return handleMismatch(code);
-        effects.consume(code);
-        return expectBracket;
-    };
-    const expectBracket = (code) => {
-        if (code === null)
-            return onEof(code);
-        if (code !== codes.rightSquareBracket)
-            return handleMismatch(code);
-        effects.consume(code);
-        return onSuccess;
-    };
-    return { expectSlash };
-}
-/**
- * Partial construct for checking non-lazy continuation.
- * This is used by the flow tokenizer to check if we can continue
- * parsing on the next line.
- */
-const syntax_nonLazyContinuation = {
-    partial: true,
-    tokenize: syntax_tokenizeNonLazyContinuation,
-};
-/**
- * Tokenizer for non-lazy continuation checking.
- * Returns ok if the next line is non-lazy (can continue), nok if lazy.
- */
-function syntax_tokenizeNonLazyContinuation(effects, ok, nok) {
-    const lineStart = (code) => {
-        // `this` here refers to the micromark parser
-        // since we are just passing functions as references and not actually calling them
-        // micromarks's internal parser will call this automatically with appropriate arguments
-        return this.parser.lazy[this.now().line] ? nok(code) : ok(code);
-    };
-    const start = (code) => {
-        if (code === null) {
-            return nok(code);
-        }
-        if (!markdownLineEnding(code)) {
-            return nok(code);
-        }
-        effects.enter('magicBlockLineEnding');
-        effects.consume(code);
-        effects.exit('magicBlockLineEnding');
-        return lineStart;
-    };
-    return start;
-}
+;// ./node_modules/micromark-util-symbol/lib/types.js
 /**
- * Create a micromark extension for magic block syntax.
- *
- * This extension handles both single-line and multiline magic blocks:
- * - Flow construct (concrete): Handles block-level multiline magic blocks at document level
- * - Text construct: Handles inline magic blocks in lists, paragraphs, etc.
+ * This module is compiled away!
  *
- * The flow construct is marked as "concrete" which prevents it from being
- * interrupted by container markers (like `>` for blockquotes or `-` for lists).
- */
-function magicBlock() {
-    return {
-        // Flow construct - handles block-level magic blocks at document root
-        // Marked as concrete to prevent interruption by containers
-        flow: {
-            [codes.leftSquareBracket]: {
-                name: 'magicBlock',
-                concrete: true,
-                tokenize: tokenizeMagicBlockFlow,
-            },
-        },
-        // Text construct - handles magic blocks in inline contexts (lists, paragraphs)
-        text: {
-            [codes.leftSquareBracket]: {
-                name: 'magicBlock',
-                tokenize: tokenizeMagicBlockText,
-            },
-        },
-    };
-}
-/**
- * Flow tokenizer for block-level magic blocks (multiline).
- * Uses the continuation checking pattern from code fences.
- */
-function tokenizeMagicBlockFlow(effects, ok, nok) {
-    // State for tracking JSON content
-    const jsonState = { escapeNext: false, inString: false };
-    const blockTypeRef = { value: '' };
-    let seenOpenBrace = false;
-    // Create shared parsers for opening marker and type capture
-    const typeParser = createTypeCaptureParser(effects, nok, beforeData, blockTypeRef);
-    const openingMarkerParser = createOpeningMarkerParser(effects, nok, typeParser.first);
-    return start;
-    function start(code) {
-        if (code !== codes.leftSquareBracket)
-            return nok(code);
-        effects.enter('magicBlock');
-        effects.enter('magicBlockMarkerStart');
-        effects.consume(code);
-        return openingMarkerParser;
-    }
-    /**
-     * State before data content - handles line endings or starts data capture.
-     */
-    function beforeData(code) {
-        // EOF - magic block must be closed
-        if (code === null) {
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        // Line ending before any data - check continuation
-        if (markdownLineEnding(code)) {
-            return effects.check(syntax_nonLazyContinuation, continuationOkBeforeData, after)(code);
-        }
-        // Check for closing marker directly (without entering data)
-        // This handles cases like [block:type]\n{}\n\n[/block] where there are
-        // newlines after the data object
-        if (code === codes.leftSquareBracket) {
-            effects.enter('magicBlockMarkerEnd');
-            effects.consume(code);
-            return expectSlashFromContinuation;
-        }
-        // If we've already seen the opening brace, just continue capturing data
-        if (seenOpenBrace) {
-            effects.enter('magicBlockData');
-            return captureData(code);
-        }
-        // Skip whitespace (spaces/tabs) before the data - stay in beforeData
-        // Don't enter magicBlockData token yet until we confirm there's a '{'
-        if (code === codes.space || code === codes.horizontalTab) {
-            return beforeDataWhitespace(code);
-        }
-        // Data must start with '{' for valid JSON
-        if (code !== codes.leftCurlyBrace) {
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        // We have '{' - enter data token and start capturing
-        seenOpenBrace = true;
-        effects.enter('magicBlockData');
-        return captureData(code);
-    }
-    /**
-     * Consume whitespace before the data without creating a token.
-     * Uses a temporary token to satisfy micromark's requirement.
-     */
-    function beforeDataWhitespace(code) {
-        if (code === null) {
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (markdownLineEnding(code)) {
-            return effects.check(syntax_nonLazyContinuation, continuationOkBeforeData, after)(code);
-        }
-        if (code === codes.space || code === codes.horizontalTab) {
-            // We need to consume this but can't without a token - use magicBlockData
-            // and track that we haven't seen '{' yet
-            effects.enter('magicBlockData');
-            effects.consume(code);
-            return beforeDataWhitespaceContinue;
-        }
-        if (code === codes.leftCurlyBrace) {
-            seenOpenBrace = true;
-            effects.enter('magicBlockData');
-            return captureData(code);
-        }
-        effects.exit('magicBlock');
-        return nok(code);
-    }
-    /**
-     * Continue consuming whitespace or validate the opening brace.
-     */
-    function beforeDataWhitespaceContinue(code) {
-        if (code === null) {
-            effects.exit('magicBlockData');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (markdownLineEnding(code)) {
-            effects.exit('magicBlockData');
-            return effects.check(syntax_nonLazyContinuation, continuationOk, after)(code);
-        }
-        if (code === codes.space || code === codes.horizontalTab) {
-            effects.consume(code);
-            return beforeDataWhitespaceContinue;
-        }
-        if (code === codes.leftCurlyBrace) {
-            seenOpenBrace = true;
-            return captureData(code);
-        }
-        effects.exit('magicBlockData');
-        effects.exit('magicBlock');
-        return nok(code);
-    }
-    /**
-     * Continuation OK before we've entered data token.
-     */
-    function continuationOkBeforeData(code) {
-        effects.enter('magicBlockLineEnding');
-        effects.consume(code);
-        effects.exit('magicBlockLineEnding');
-        return beforeData; // Stay in beforeData state - don't enter magicBlockData yet
-    }
-    function captureData(code) {
-        // EOF - magic block must be closed
-        if (code === null) {
-            effects.exit('magicBlockData');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        // At line ending, check if we can continue on the next line
-        if (markdownLineEnding(code)) {
-            effects.exit('magicBlockData');
-            return effects.check(syntax_nonLazyContinuation, continuationOk, after)(code);
-        }
-        if (jsonState.escapeNext) {
-            jsonState.escapeNext = false;
-            effects.consume(code);
-            return captureData;
-        }
-        if (jsonState.inString) {
-            if (code === codes.backslash) {
-                jsonState.escapeNext = true;
-                effects.consume(code);
-                return captureData;
-            }
-            if (code === codes.quotationMark) {
-                jsonState.inString = false;
-            }
-            effects.consume(code);
-            return captureData;
-        }
-        if (code === codes.quotationMark) {
-            jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        if (code === codes.leftSquareBracket) {
-            effects.exit('magicBlockData');
-            effects.enter('magicBlockMarkerEnd');
-            effects.consume(code);
-            return expectSlash;
-        }
-        effects.consume(code);
-        return captureData;
-    }
-    /**
-     * Called when non-lazy continuation check passes - we can continue parsing.
-     */
-    function continuationOk(code) {
-        // Consume the line ending
-        effects.enter('magicBlockLineEnding');
-        effects.consume(code);
-        effects.exit('magicBlockLineEnding');
-        return continuationStart;
-    }
-    /**
-     * Start of continuation line - check for more line endings, closing marker, or start capturing data.
-     */
-    function continuationStart(code) {
-        // Handle consecutive line endings
-        if (code === null) {
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (markdownLineEnding(code)) {
-            return effects.check(syntax_nonLazyContinuation, continuationOkBeforeData, after)(code);
-        }
-        // Check if this is the start of the closing marker [/block]
-        // If so, handle it directly without entering magicBlockData
-        if (code === codes.leftSquareBracket) {
-            effects.enter('magicBlockMarkerEnd');
-            effects.consume(code);
-            return expectSlashFromContinuation;
-        }
-        effects.enter('magicBlockData');
-        return captureData(code);
-    }
-    /**
-     * Check for closing marker slash when coming from continuation.
-     * If not a closing marker, create an empty data token and continue.
-     */
-    function expectSlashFromContinuation(code) {
-        if (code === null) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (markdownLineEnding(code)) {
-            effects.exit('magicBlockMarkerEnd');
-            return effects.check(syntax_nonLazyContinuation, continuationOkBeforeData, after)(code);
-        }
-        if (code === codes.slash) {
-            effects.consume(code);
-            return expectClosingB;
-        }
-        // Not a closing marker - this is data content
-        // Exit marker and enter data
-        effects.exit('magicBlockMarkerEnd');
-        effects.enter('magicBlockData');
-        // The [ was consumed by the marker, so we need to conceptually "have it" in our data
-        // But since we already consumed it into the marker, we need a different approach
-        // Re-classify: consume this character as data and continue
-        if (code === codes.quotationMark)
-            jsonState.inString = true;
-        effects.consume(code);
-        return captureData;
-    }
-    function expectSlash(code) {
-        if (code === null) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        // At line ending during marker parsing
-        if (markdownLineEnding(code)) {
-            effects.exit('magicBlockMarkerEnd');
-            return effects.check(syntax_nonLazyContinuation, continuationOk, after)(code);
-        }
-        if (code !== codes.slash) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.enter('magicBlockData');
-            if (code === codes.quotationMark)
-                jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        effects.consume(code);
-        return expectClosingB;
-    }
-    function expectClosingB(code) {
-        if (code === null) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (code !== codes.lowercaseB) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.enter('magicBlockData');
-            if (code === codes.quotationMark)
-                jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        effects.consume(code);
-        return expectClosingL;
-    }
-    function expectClosingL(code) {
-        if (code === null) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (code !== codes.lowercaseL) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.enter('magicBlockData');
-            if (code === codes.quotationMark)
-                jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        effects.consume(code);
-        return expectClosingO;
-    }
-    function expectClosingO(code) {
-        if (code === null) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (code !== codes.lowercaseO) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.enter('magicBlockData');
-            if (code === codes.quotationMark)
-                jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        effects.consume(code);
-        return expectClosingC;
-    }
-    function expectClosingC(code) {
-        if (code === null) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (code !== codes.lowercaseC) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.enter('magicBlockData');
-            if (code === codes.quotationMark)
-                jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        effects.consume(code);
-        return expectClosingK;
-    }
-    function expectClosingK(code) {
-        if (code === null) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (code !== codes.lowercaseK) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.enter('magicBlockData');
-            if (code === codes.quotationMark)
-                jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        effects.consume(code);
-        return expectClosingBracket;
-    }
-    function expectClosingBracket(code) {
-        if (code === null) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.exit('magicBlock');
-            return nok(code);
-        }
-        if (code !== codes.rightSquareBracket) {
-            effects.exit('magicBlockMarkerEnd');
-            effects.enter('magicBlockData');
-            if (code === codes.quotationMark)
-                jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        effects.consume(code);
-        effects.exit('magicBlockMarkerEnd');
-        // Check for trailing whitespace on the same line
-        return consumeTrailing;
-    }
-    /**
-     * Consume trailing whitespace (spaces/tabs) on the same line after [/block].
-     * For concrete flow constructs, we must end at eol/eof or fail.
-     * Trailing whitespace is consumed; other content causes nok (text tokenizer handles it).
-     */
-    function consumeTrailing(code) {
-        // End of file - done
-        if (code === null) {
-            effects.exit('magicBlock');
-            return ok(code);
-        }
-        // Line ending - done
-        if (markdownLineEnding(code)) {
-            effects.exit('magicBlock');
-            return ok(code);
-        }
-        // Space or tab - consume as trailing whitespace
-        if (code === codes.space || code === codes.horizontalTab) {
-            effects.enter('magicBlockTrailing');
-            effects.consume(code);
-            return consumeTrailingContinue;
-        }
-        // Any other character - fail flow tokenizer, let text tokenizer handle it
-        effects.exit('magicBlock');
-        return nok(code);
-    }
-    /**
-     * Continue consuming trailing whitespace.
-     */
-    function consumeTrailingContinue(code) {
-        // End of file - done
-        if (code === null) {
-            effects.exit('magicBlockTrailing');
-            effects.exit('magicBlock');
-            return ok(code);
-        }
-        // Line ending - done
-        if (markdownLineEnding(code)) {
-            effects.exit('magicBlockTrailing');
-            effects.exit('magicBlock');
-            return ok(code);
-        }
-        // More space or tab - keep consuming
-        if (code === codes.space || code === codes.horizontalTab) {
-            effects.consume(code);
-            return consumeTrailingContinue;
-        }
-        // Non-whitespace after whitespace - fail flow tokenizer
-        effects.exit('magicBlockTrailing');
-        effects.exit('magicBlock');
-        return nok(code);
-    }
-    /**
-     * Called when we can't continue (lazy line or EOF) - exit the construct.
-     */
-    function after(code) {
-        effects.exit('magicBlock');
-        return nok(code);
-    }
-}
-/**
- * Text tokenizer for single-line magic blocks only.
- * Used in inline contexts like list items and paragraphs.
- * Multiline blocks are handled by the flow tokenizer.
- */
-function tokenizeMagicBlockText(effects, ok, nok) {
-    // State for tracking JSON content
-    const jsonState = { escapeNext: false, inString: false };
-    const blockTypeRef = { value: '' };
-    let seenOpenBrace = false;
-    // Create shared parsers for opening marker and type capture
-    const typeParser = createTypeCaptureParser(effects, nok, beforeData, blockTypeRef);
-    const openingMarkerParser = createOpeningMarkerParser(effects, nok, typeParser.first);
-    // Success handler for closing marker - exits tokens and returns ok
-    const closingSuccess = (code) => {
-        effects.exit('magicBlockMarkerEnd');
-        effects.exit('magicBlock');
-        return ok(code);
-    };
-    // Mismatch handler - falls back to data capture
-    const closingMismatch = (code) => {
-        effects.exit('magicBlockMarkerEnd');
-        effects.enter('magicBlockData');
-        if (code === codes.quotationMark)
-            jsonState.inString = true;
-        effects.consume(code);
-        return captureData;
-    };
-    // EOF handler
-    const closingEof = (_code) => nok(_code);
-    // Create closing marker parsers
-    const closingFromBeforeData = createClosingMarkerParser(effects, closingSuccess, closingMismatch, closingEof, jsonState);
-    const closingFromData = createClosingMarkerParser(effects, closingSuccess, closingMismatch, closingEof, jsonState);
-    return start;
-    function start(code) {
-        if (code !== codes.leftSquareBracket)
-            return nok(code);
-        effects.enter('magicBlock');
-        effects.enter('magicBlockMarkerStart');
-        effects.consume(code);
-        return openingMarkerParser;
-    }
-    /**
-     * State before data content - handles line endings before entering data token.
-     * Whitespace before '{' is allowed.
-     */
-    function beforeData(code) {
-        // Fail on EOF - magic block must be closed
-        if (code === null) {
-            return nok(code);
-        }
-        // Handle line endings before any data - consume them without entering data token
-        if (markdownLineEnding(code)) {
-            effects.enter('magicBlockLineEnding');
-            effects.consume(code);
-            effects.exit('magicBlockLineEnding');
-            return beforeData;
-        }
-        // Check for closing marker directly (without entering data)
-        if (code === codes.leftSquareBracket) {
-            effects.enter('magicBlockMarkerEnd');
-            effects.consume(code);
-            return closingFromBeforeData.expectSlash;
-        }
-        // If we've already seen the opening brace, just continue capturing data
-        if (seenOpenBrace) {
-            effects.enter('magicBlockData');
-            return captureData(code);
-        }
-        // Skip whitespace (spaces/tabs) before the data
-        if (code === codes.space || code === codes.horizontalTab) {
-            return beforeDataWhitespace(code);
-        }
-        // Data must start with '{' for valid JSON
-        if (code !== codes.leftCurlyBrace) {
-            return nok(code);
-        }
-        // We have '{' - enter data token and start capturing
-        seenOpenBrace = true;
-        effects.enter('magicBlockData');
-        return captureData(code);
-    }
-    /**
-     * Consume whitespace before the data.
-     */
-    function beforeDataWhitespace(code) {
-        if (code === null) {
-            return nok(code);
-        }
-        if (markdownLineEnding(code)) {
-            effects.enter('magicBlockLineEnding');
-            effects.consume(code);
-            effects.exit('magicBlockLineEnding');
-            return beforeData;
-        }
-        if (code === codes.space || code === codes.horizontalTab) {
-            effects.enter('magicBlockData');
-            effects.consume(code);
-            return beforeDataWhitespaceContinue;
-        }
-        if (code === codes.leftCurlyBrace) {
-            seenOpenBrace = true;
-            effects.enter('magicBlockData');
-            return captureData(code);
-        }
-        return nok(code);
-    }
-    /**
-     * Continue consuming whitespace or validate the opening brace.
-     */
-    function beforeDataWhitespaceContinue(code) {
-        if (code === null) {
-            effects.exit('magicBlockData');
-            return nok(code);
-        }
-        if (markdownLineEnding(code)) {
-            effects.exit('magicBlockData');
-            effects.enter('magicBlockLineEnding');
-            effects.consume(code);
-            effects.exit('magicBlockLineEnding');
-            return beforeData;
-        }
-        if (code === codes.space || code === codes.horizontalTab) {
-            effects.consume(code);
-            return beforeDataWhitespaceContinue;
-        }
-        if (code === codes.leftCurlyBrace) {
-            seenOpenBrace = true;
-            return captureData(code);
-        }
-        effects.exit('magicBlockData');
-        return nok(code);
-    }
-    function captureData(code) {
-        // Fail on EOF - magic block must be closed
-        if (code === null) {
-            effects.exit('magicBlockData');
-            return nok(code);
-        }
-        // Handle multiline magic blocks within text/paragraphs
-        // Exit data, consume line ending with proper token, then re-enter data
-        if (markdownLineEnding(code)) {
-            effects.exit('magicBlockData');
-            effects.enter('magicBlockLineEnding');
-            effects.consume(code);
-            effects.exit('magicBlockLineEnding');
-            return beforeData; // Go back to beforeData to handle potential empty lines
-        }
-        if (jsonState.escapeNext) {
-            jsonState.escapeNext = false;
-            effects.consume(code);
-            return captureData;
-        }
-        if (jsonState.inString) {
-            if (code === codes.backslash) {
-                jsonState.escapeNext = true;
-                effects.consume(code);
-                return captureData;
-            }
-            if (code === codes.quotationMark) {
-                jsonState.inString = false;
-            }
-            effects.consume(code);
-            return captureData;
-        }
-        if (code === codes.quotationMark) {
-            jsonState.inString = true;
-            effects.consume(code);
-            return captureData;
-        }
-        if (code === codes.leftSquareBracket) {
-            effects.exit('magicBlockData');
-            effects.enter('magicBlockMarkerEnd');
-            effects.consume(code);
-            return closingFromData.expectSlash;
-        }
-        effects.consume(code);
-        return captureData;
-    }
-}
-/* harmony default export */ const syntax = ((/* unused pure expression or super */ null && (magicBlock)));
-
-;// ./lib/micromark/magic-block/index.ts
-/**
- * Micromark extension for magic block syntax.
- *
- * Usage:
- * ```ts
- * import { magicBlock } from './lib/micromark/magic-block';
- *
- * const processor = unified()
- *   .data('micromarkExtensions', [magicBlock()])
- * ```
- */
-
-
-;// ./node_modules/micromark-util-symbol/lib/types.js
-/**
- * This module is compiled away!
- *
- * Here is the list of all types of tokens exposed by micromark, with a short
- * explanation of what they include and where they are found.
- * In picking names, generally, the rule is to be as explicit as possible
- * instead of reusing names.
- * For example, there is a `definitionDestination` and a `resourceDestination`,
- * instead of one shared name.
+ * Here is the list of all types of tokens exposed by micromark, with a short
+ * explanation of what they include and where they are found.
+ * In picking names, generally, the rule is to be as explicit as possible
+ * instead of reusing names.
+ * For example, there is a `definitionDestination` and a `resourceDestination`,
+ * instead of one shared name.
  */
 
 // Note: when changing the next record, you must also change `TokenTypeMap`
@@ -101144,36 +100361,18 @@ const types_types = /** @type {const} */ ({
   chunkString: 'chunkString'
 })
 
-;// ./lib/micromark/mdx-component/syntax.ts
-
-
-
+;// ./lib/micromark/jsx-table/syntax.ts
 
 
-// Raw tags (type-1: pre/script/style/textarea) and block tags (type-6: div,
-// section, …) always start a block, so they stay flow even with trailing
-// content. Other lowercase tags (i, span, …) follow the type-7 rule and only
-// stay flow when nothing trails the close tag.
-const htmlFlowTagNames = new Set([...htmlRawNames, ...htmlBlockNames]);
-// Lowercase type-6 block tags claimable in flow even without a `{…}` attribute, so
-// blank lines between nested JSX siblings don't fragment the block. Excludes table
-// tags (mdxishTables owns their blank lines) and voids (never close).
-const plainBlockClaimTagNames = new Set([...htmlBlockNames].filter(tag => !HTML_TABLE_STRUCTURE_TAGS.has(tag) && !HTML_VOID_ELEMENTS.has(tag)));
 const syntax_nonLazyContinuationStart = {
     tokenize: syntax_tokenizeNonLazyContinuationStart,
     partial: true,
 };
-// Lookahead for `plainClaimLineStart`: is this line markup-only, or a paragraph
-// that merely starts with a tag? Run via `effects.check` so it never consumes.
-const markupOnlyContinuation = {
-    tokenize: tokenizeMarkupOnlyContinuation,
-    partial: true,
-};
-function resolveToMdxComponent(events) {
+function resolveToJsxTable(events) {
     let index = events.length;
     while (index > 0) {
         index -= 1;
-        if (events[index][0] === 'enter' && events[index][1].type === 'mdxComponent') {
+        if (events[index][0] === 'enter' && events[index][1].type === 'jsxTable') {
             break;
         }
     }
@@ -101184,59 +100383,1165 @@ function resolveToMdxComponent(events) {
     }
     return events;
 }
-const mdxComponentFlowConstruct = {
-    name: 'mdxComponent',
-    tokenize: createTokenize('flow'),
-    resolveTo: resolveToMdxComponent,
+const jsxTableConstruct = {
+    name: 'jsxTable',
+    tokenize: tokenizeJsxTable,
+    resolveTo: resolveToJsxTable,
     concrete: true,
 };
-const mdxComponentTextConstruct = {
-    name: 'mdxComponentText',
-    tokenize: createTokenize('text'),
-};
-/**
- * Factory for both flow (block) and text (inline) variants.
- *
- * **Flow** — the original behavior: claims PascalCase components (always) and
- * lowercase HTML tags that carry at least one `{…}` attribute expression.
- * Multi-line, concrete, `afterClose` consumes the rest of the line.
- *
- * **Text** — runs inside paragraphs / inline context. Claims lowercase tags and
- * inline PascalCase components (`INLINE_COMPONENT_TAGS` — Anchor, Glossary), both
- * gated on at least one `{…}` brace attribute. All other PascalCase stays
- * flow-only, matching how ReadMe's custom components are authored. Aborts on line
- * endings (inline constructs don't span lines) and exits immediately after
- * `</tag>` so the paragraph's inline parser picks up the trailing text.
- */
-function createTokenize(mode) {
-    const isFlow = mode === 'flow';
-    return function tokenize(effects, ok, nok) {
-        // eslint-disable-next-line @typescript-eslint/no-this-alias
-        const self = this;
-        let tagName = '';
-        let depth = 0;
-        let closingTagName = '';
-        // For lowercase tags we only want to claim the block if it uses JSX
-        // attribute expression syntax (`attr={...}`). Plain HTML should fall
-        // through to CommonMark html-flow. Flow mode claims any PascalCase block
-        // component; text mode claims only inline PascalCase components
-        // (INLINE_COMPONENT_TAGS — Anchor, Glossary), also brace-gated.
-        let isLowercaseTag = false;
-        let sawBraceAttr = false;
-        // A plain lowercase block tag claimed without a `{…}` attribute, gated by
-        // `plainClaimLineStart`: after a blank line it may only continue on a tag line.
-        let isPlainBlockClaim = false;
-        let pendingBlankLine = false;
-        // Code span tracking
-        let codeSpanOpenSize = 0;
-        let codeSpanCloseSize = 0;
-        // Fenced code block tracking
-        let fenceChar = null;
-        let fenceLength = 0;
-        let fenceCloseLength = 0;
-        let atLineStart = false;
-        // True once this construct consumes any line ending; lets `afterClose`
-        // treat only single-line lowercase tags as inline candidates.
+function tokenizeJsxTable(effects, ok, nok) {
+    let codeSpanOpenSize = 0;
+    let codeSpanCloseSize = 0;
+    let depth = 1;
+    const ABLE_SUFFIX = [codes.lowercaseA, codes.lowercaseB, codes.lowercaseL, codes.lowercaseE];
+    /** Build a state chain that matches a sequence of character codes. */
+    function matchChars(chars, onMatch, onFail) {
+        if (chars.length === 0)
+            return onMatch;
+        return ((code) => {
+            if (code === chars[0]) {
+                effects.consume(code);
+                return matchChars(chars.slice(1), onMatch, onFail);
+            }
+            return onFail(code);
+        });
+    }
+    return start;
+    function start(code) {
+        if (code !== codes.lessThan)
+            return nok(code);
+        effects.enter('jsxTable');
+        effects.enter('jsxTableData');
+        effects.consume(code);
+        return afterLessThan;
+    }
+    function afterLessThan(code) {
+        if (code === codes.uppercaseT || code === codes.lowercaseT) {
+            effects.consume(code);
+            return matchChars(ABLE_SUFFIX, afterTagName, nok);
+        }
+        return nok(code);
+    }
+    function afterTagName(code) {
+        if (code === codes.greaterThan || code === codes.slash || code === codes.space || code === codes.horizontalTab) {
+            effects.consume(code);
+            return body;
+        }
+        return nok(code);
+    }
+    function body(code) {
+        // Reject unclosed <Table> so it falls back to normal HTML block parsing
+        // instead of swallowing all subsequent content to EOF
+        if (code === null) {
+            return nok(code);
+        }
+        if (markdownLineEnding(code)) {
+            effects.exit('jsxTableData');
+            return continuationStart(code);
+        }
+        if (code === codes.backslash) {
+            effects.consume(code);
+            return escapedChar;
+        }
+        if (code === codes.lessThan) {
+            effects.consume(code);
+            return closeSlash;
+        }
+        // Skip over backtick code spans so `</Table>` in inline code isn't
+        // treated as the closing tag
+        if (code === codes.graveAccent) {
+            codeSpanOpenSize = 0;
+            return countOpenTicks(code);
+        }
+        effects.consume(code);
+        return body;
+    }
+    function countOpenTicks(code) {
+        if (code === codes.graveAccent) {
+            codeSpanOpenSize += 1;
+            effects.consume(code);
+            return countOpenTicks;
+        }
+        return inCodeSpan(code);
+    }
+    function inCodeSpan(code) {
+        if (code === null || markdownLineEnding(code))
+            return body(code);
+        if (code === codes.graveAccent) {
+            codeSpanCloseSize = 0;
+            return countCloseTicks(code);
+        }
+        effects.consume(code);
+        return inCodeSpan;
+    }
+    function countCloseTicks(code) {
+        if (code === codes.graveAccent) {
+            codeSpanCloseSize += 1;
+            effects.consume(code);
+            return countCloseTicks;
+        }
+        return codeSpanCloseSize === codeSpanOpenSize ? body(code) : inCodeSpan(code);
+    }
+    function escapedChar(code) {
+        if (code === null || markdownLineEnding(code)) {
+            return body(code);
+        }
+        effects.consume(code);
+        return body;
+    }
+    function closeSlash(code) {
+        if (code === codes.slash) {
+            effects.consume(code);
+            return closeTagFirstChar;
+        }
+        if (code === codes.uppercaseT || code === codes.lowercaseT) {
+            effects.consume(code);
+            return matchChars(ABLE_SUFFIX, openAfterTagName, body);
+        }
+        return body(code);
+    }
+    function closeTagFirstChar(code) {
+        if (code === codes.uppercaseT || code === codes.lowercaseT) {
+            effects.consume(code);
+            return matchChars(ABLE_SUFFIX, closeGt, body);
+        }
+        return body(code);
+    }
+    function openAfterTagName(code) {
+        if (code === codes.greaterThan || code === codes.slash || code === codes.space || code === codes.horizontalTab) {
+            depth += 1;
+            effects.consume(code);
+            return body;
+        }
+        return body(code);
+    }
+    function closeGt(code) {
+        if (code === codes.greaterThan) {
+            depth -= 1;
+            effects.consume(code);
+            if (depth === 0) {
+                return afterClose;
+            }
+            return body;
+        }
+        return body(code);
+    }
+    function afterClose(code) {
+        if (code === null || markdownLineEnding(code)) {
+            effects.exit('jsxTableData');
+            effects.exit('jsxTable');
+            return ok(code);
+        }
+        effects.consume(code);
+        return afterClose;
+    }
+    // Line ending handling — follows the htmlFlow pattern
+    function continuationStart(code) {
+        return effects.check(syntax_nonLazyContinuationStart, continuationStartNonLazy, continuationAfter)(code);
+    }
+    function continuationStartNonLazy(code) {
+        effects.enter(types_types.lineEnding);
+        effects.consume(code);
+        effects.exit(types_types.lineEnding);
+        return continuationBefore;
+    }
+    function continuationBefore(code) {
+        if (code === null || markdownLineEnding(code)) {
+            return continuationStart(code);
+        }
+        effects.enter('jsxTableData');
+        return body(code);
+    }
+    function continuationAfter(code) {
+        // At EOF without </Table>, reject so content isn't swallowed
+        if (code === null) {
+            return nok(code);
+        }
+        effects.exit('jsxTable');
+        return ok(code);
+    }
+}
+function syntax_tokenizeNonLazyContinuationStart(effects, ok, nok) {
+    // eslint-disable-next-line @typescript-eslint/no-this-alias
+    const self = this;
+    return start;
+    function start(code) {
+        if (markdownLineEnding(code)) {
+            effects.enter(types_types.lineEnding);
+            effects.consume(code);
+            effects.exit(types_types.lineEnding);
+            return after;
+        }
+        return nok(code);
+    }
+    function after(code) {
+        if (self.parser.lazy[self.now().line]) {
+            return nok(code);
+        }
+        return ok(code);
+    }
+}
+/**
+ * Micromark extension that tokenizes `<Table>...</Table>` and `<table>...</table>`
+ * as a single flow block.
+ *
+ * Prevents CommonMark HTML block type 6 from fragmenting table blocks at blank lines.
+ */
+function jsxTable() {
+    return {
+        flow: {
+            [codes.lessThan]: [jsxTableConstruct],
+        },
+    };
+}
+
+;// ./lib/micromark/jsx-table/index.ts
+
+
+;// ./lib/micromark/magic-block/syntax.ts
+
+
+/**
+ * Known magic block types that the tokenizer will recognize.
+ * Unknown types will not be tokenized as magic blocks.
+ */
+const KNOWN_BLOCK_TYPES = new Set([
+    'code',
+    'api-header',
+    'image',
+    'callout',
+    'parameters',
+    'table',
+    'embed',
+    'html',
+    'recipe',
+    'tutorial-tile',
+]);
+/**
+ * Check if a character is valid for a magic block type identifier.
+ * Types can contain alphanumeric characters and hyphens (e.g., "api-header", "tutorial-tile")
+ */
+function isTypeChar(code) {
+    return asciiAlphanumeric(code) || code === codes.dash;
+}
+/**
+ * Creates the opening marker state machine: [block:
+ * Returns the first state function to start parsing.
+ */
+function createOpeningMarkerParser(effects, nok, onComplete) {
+    const expectB = (code) => {
+        if (code !== codes.lowercaseB)
+            return nok(code);
+        effects.consume(code);
+        return expectL;
+    };
+    const expectL = (code) => {
+        if (code !== codes.lowercaseL)
+            return nok(code);
+        effects.consume(code);
+        return expectO;
+    };
+    const expectO = (code) => {
+        if (code !== codes.lowercaseO)
+            return nok(code);
+        effects.consume(code);
+        return expectC;
+    };
+    const expectC = (code) => {
+        if (code !== codes.lowercaseC)
+            return nok(code);
+        effects.consume(code);
+        return expectK;
+    };
+    const expectK = (code) => {
+        if (code !== codes.lowercaseK)
+            return nok(code);
+        effects.consume(code);
+        return expectColon;
+    };
+    const expectColon = (code) => {
+        if (code !== codes.colon)
+            return nok(code);
+        effects.consume(code);
+        effects.exit('magicBlockMarkerStart');
+        effects.enter('magicBlockType');
+        return onComplete;
+    };
+    return expectB;
+}
+/**
+ * Creates the type capture state machine.
+ * Captures type characters until ] and validates against known types.
+ */
+function createTypeCaptureParser(effects, nok, onComplete, blockTypeRef) {
+    const captureTypeFirst = (code) => {
+        // Reject empty type name [block:]
+        if (code === codes.rightSquareBracket) {
+            return nok(code);
+        }
+        if (isTypeChar(code)) {
+            blockTypeRef.value += String.fromCharCode(code);
+            effects.consume(code);
+            return captureType;
+        }
+        return nok(code);
+    };
+    const captureType = (code) => {
+        if (code === codes.rightSquareBracket) {
+            if (!KNOWN_BLOCK_TYPES.has(blockTypeRef.value)) {
+                return nok(code);
+            }
+            effects.exit('magicBlockType');
+            effects.enter('magicBlockMarkerTypeEnd');
+            effects.consume(code);
+            effects.exit('magicBlockMarkerTypeEnd');
+            return onComplete;
+        }
+        if (isTypeChar(code)) {
+            blockTypeRef.value += String.fromCharCode(code);
+            effects.consume(code);
+            return captureType;
+        }
+        return nok(code);
+    };
+    return { first: captureTypeFirst, remaining: captureType };
+}
+/**
+ * Creates the closing marker state machine: /block]
+ * Handles partial matches by calling onMismatch to fall back to data capture.
+ */
+function createClosingMarkerParser(effects, onSuccess, onMismatch, onEof, jsonState) {
+    const handleMismatch = (code) => {
+        if (jsonState && code === codes.quotationMark) {
+            jsonState.inString = true;
+        }
+        return onMismatch(code);
+    };
+    const expectSlash = (code) => {
+        if (code === null)
+            return onEof(code);
+        if (code !== codes.slash)
+            return handleMismatch(code);
+        effects.consume(code);
+        return expectB;
+    };
+    const expectB = (code) => {
+        if (code === null)
+            return onEof(code);
+        if (code !== codes.lowercaseB)
+            return handleMismatch(code);
+        effects.consume(code);
+        return expectL;
+    };
+    const expectL = (code) => {
+        if (code === null)
+            return onEof(code);
+        if (code !== codes.lowercaseL)
+            return handleMismatch(code);
+        effects.consume(code);
+        return expectO;
+    };
+    const expectO = (code) => {
+        if (code === null)
+            return onEof(code);
+        if (code !== codes.lowercaseO)
+            return handleMismatch(code);
+        effects.consume(code);
+        return expectC;
+    };
+    const expectC = (code) => {
+        if (code === null)
+            return onEof(code);
+        if (code !== codes.lowercaseC)
+            return handleMismatch(code);
+        effects.consume(code);
+        return expectK;
+    };
+    const expectK = (code) => {
+        if (code === null)
+            return onEof(code);
+        if (code !== codes.lowercaseK)
+            return handleMismatch(code);
+        effects.consume(code);
+        return expectBracket;
+    };
+    const expectBracket = (code) => {
+        if (code === null)
+            return onEof(code);
+        if (code !== codes.rightSquareBracket)
+            return handleMismatch(code);
+        effects.consume(code);
+        return onSuccess;
+    };
+    return { expectSlash };
+}
+/**
+ * Partial construct for checking non-lazy continuation.
+ * This is used by the flow tokenizer to check if we can continue
+ * parsing on the next line.
+ */
+const syntax_nonLazyContinuation = {
+    partial: true,
+    tokenize: syntax_tokenizeNonLazyContinuation,
+};
+/**
+ * Tokenizer for non-lazy continuation checking.
+ * Returns ok if the next line is non-lazy (can continue), nok if lazy.
+ */
+function syntax_tokenizeNonLazyContinuation(effects, ok, nok) {
+    const lineStart = (code) => {
+        // `this` here refers to the micromark parser
+        // since we are just passing functions as references and not actually calling them
+        // micromarks's internal parser will call this automatically with appropriate arguments
+        return this.parser.lazy[this.now().line] ? nok(code) : ok(code);
+    };
+    const start = (code) => {
+        if (code === null) {
+            return nok(code);
+        }
+        if (!markdownLineEnding(code)) {
+            return nok(code);
+        }
+        effects.enter('magicBlockLineEnding');
+        effects.consume(code);
+        effects.exit('magicBlockLineEnding');
+        return lineStart;
+    };
+    return start;
+}
+/**
+ * Create a micromark extension for magic block syntax.
+ *
+ * This extension handles both single-line and multiline magic blocks:
+ * - Flow construct (concrete): Handles block-level multiline magic blocks at document level
+ * - Text construct: Handles inline magic blocks in lists, paragraphs, etc.
+ *
+ * The flow construct is marked as "concrete" which prevents it from being
+ * interrupted by container markers (like `>` for blockquotes or `-` for lists).
+ */
+function magicBlock() {
+    return {
+        // Flow construct - handles block-level magic blocks at document root
+        // Marked as concrete to prevent interruption by containers
+        flow: {
+            [codes.leftSquareBracket]: {
+                name: 'magicBlock',
+                concrete: true,
+                tokenize: tokenizeMagicBlockFlow,
+            },
+        },
+        // Text construct - handles magic blocks in inline contexts (lists, paragraphs)
+        text: {
+            [codes.leftSquareBracket]: {
+                name: 'magicBlock',
+                tokenize: tokenizeMagicBlockText,
+            },
+        },
+    };
+}
+/**
+ * Flow tokenizer for block-level magic blocks (multiline).
+ * Uses the continuation checking pattern from code fences.
+ */
+function tokenizeMagicBlockFlow(effects, ok, nok) {
+    // State for tracking JSON content
+    const jsonState = { escapeNext: false, inString: false };
+    const blockTypeRef = { value: '' };
+    let seenOpenBrace = false;
+    // Create shared parsers for opening marker and type capture
+    const typeParser = createTypeCaptureParser(effects, nok, beforeData, blockTypeRef);
+    const openingMarkerParser = createOpeningMarkerParser(effects, nok, typeParser.first);
+    return start;
+    function start(code) {
+        if (code !== codes.leftSquareBracket)
+            return nok(code);
+        effects.enter('magicBlock');
+        effects.enter('magicBlockMarkerStart');
+        effects.consume(code);
+        return openingMarkerParser;
+    }
+    /**
+     * State before data content - handles line endings or starts data capture.
+     */
+    function beforeData(code) {
+        // EOF - magic block must be closed
+        if (code === null) {
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        // Line ending before any data - check continuation
+        if (markdownLineEnding(code)) {
+            return effects.check(syntax_nonLazyContinuation, continuationOkBeforeData, after)(code);
+        }
+        // Check for closing marker directly (without entering data)
+        // This handles cases like [block:type]\n{}\n\n[/block] where there are
+        // newlines after the data object
+        if (code === codes.leftSquareBracket) {
+            effects.enter('magicBlockMarkerEnd');
+            effects.consume(code);
+            return expectSlashFromContinuation;
+        }
+        // If we've already seen the opening brace, just continue capturing data
+        if (seenOpenBrace) {
+            effects.enter('magicBlockData');
+            return captureData(code);
+        }
+        // Skip whitespace (spaces/tabs) before the data - stay in beforeData
+        // Don't enter magicBlockData token yet until we confirm there's a '{'
+        if (code === codes.space || code === codes.horizontalTab) {
+            return beforeDataWhitespace(code);
+        }
+        // Data must start with '{' for valid JSON
+        if (code !== codes.leftCurlyBrace) {
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        // We have '{' - enter data token and start capturing
+        seenOpenBrace = true;
+        effects.enter('magicBlockData');
+        return captureData(code);
+    }
+    /**
+     * Consume whitespace before the data without creating a token.
+     * Uses a temporary token to satisfy micromark's requirement.
+     */
+    function beforeDataWhitespace(code) {
+        if (code === null) {
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (markdownLineEnding(code)) {
+            return effects.check(syntax_nonLazyContinuation, continuationOkBeforeData, after)(code);
+        }
+        if (code === codes.space || code === codes.horizontalTab) {
+            // We need to consume this but can't without a token - use magicBlockData
+            // and track that we haven't seen '{' yet
+            effects.enter('magicBlockData');
+            effects.consume(code);
+            return beforeDataWhitespaceContinue;
+        }
+        if (code === codes.leftCurlyBrace) {
+            seenOpenBrace = true;
+            effects.enter('magicBlockData');
+            return captureData(code);
+        }
+        effects.exit('magicBlock');
+        return nok(code);
+    }
+    /**
+     * Continue consuming whitespace or validate the opening brace.
+     */
+    function beforeDataWhitespaceContinue(code) {
+        if (code === null) {
+            effects.exit('magicBlockData');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (markdownLineEnding(code)) {
+            effects.exit('magicBlockData');
+            return effects.check(syntax_nonLazyContinuation, continuationOk, after)(code);
+        }
+        if (code === codes.space || code === codes.horizontalTab) {
+            effects.consume(code);
+            return beforeDataWhitespaceContinue;
+        }
+        if (code === codes.leftCurlyBrace) {
+            seenOpenBrace = true;
+            return captureData(code);
+        }
+        effects.exit('magicBlockData');
+        effects.exit('magicBlock');
+        return nok(code);
+    }
+    /**
+     * Continuation OK before we've entered data token.
+     */
+    function continuationOkBeforeData(code) {
+        effects.enter('magicBlockLineEnding');
+        effects.consume(code);
+        effects.exit('magicBlockLineEnding');
+        return beforeData; // Stay in beforeData state - don't enter magicBlockData yet
+    }
+    function captureData(code) {
+        // EOF - magic block must be closed
+        if (code === null) {
+            effects.exit('magicBlockData');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        // At line ending, check if we can continue on the next line
+        if (markdownLineEnding(code)) {
+            effects.exit('magicBlockData');
+            return effects.check(syntax_nonLazyContinuation, continuationOk, after)(code);
+        }
+        if (jsonState.escapeNext) {
+            jsonState.escapeNext = false;
+            effects.consume(code);
+            return captureData;
+        }
+        if (jsonState.inString) {
+            if (code === codes.backslash) {
+                jsonState.escapeNext = true;
+                effects.consume(code);
+                return captureData;
+            }
+            if (code === codes.quotationMark) {
+                jsonState.inString = false;
+            }
+            effects.consume(code);
+            return captureData;
+        }
+        if (code === codes.quotationMark) {
+            jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        if (code === codes.leftSquareBracket) {
+            effects.exit('magicBlockData');
+            effects.enter('magicBlockMarkerEnd');
+            effects.consume(code);
+            return expectSlash;
+        }
+        effects.consume(code);
+        return captureData;
+    }
+    /**
+     * Called when non-lazy continuation check passes - we can continue parsing.
+     */
+    function continuationOk(code) {
+        // Consume the line ending
+        effects.enter('magicBlockLineEnding');
+        effects.consume(code);
+        effects.exit('magicBlockLineEnding');
+        return continuationStart;
+    }
+    /**
+     * Start of continuation line - check for more line endings, closing marker, or start capturing data.
+     */
+    function continuationStart(code) {
+        // Handle consecutive line endings
+        if (code === null) {
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (markdownLineEnding(code)) {
+            return effects.check(syntax_nonLazyContinuation, continuationOkBeforeData, after)(code);
+        }
+        // Check if this is the start of the closing marker [/block]
+        // If so, handle it directly without entering magicBlockData
+        if (code === codes.leftSquareBracket) {
+            effects.enter('magicBlockMarkerEnd');
+            effects.consume(code);
+            return expectSlashFromContinuation;
+        }
+        effects.enter('magicBlockData');
+        return captureData(code);
+    }
+    /**
+     * Check for closing marker slash when coming from continuation.
+     * If not a closing marker, create an empty data token and continue.
+     */
+    function expectSlashFromContinuation(code) {
+        if (code === null) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (markdownLineEnding(code)) {
+            effects.exit('magicBlockMarkerEnd');
+            return effects.check(syntax_nonLazyContinuation, continuationOkBeforeData, after)(code);
+        }
+        if (code === codes.slash) {
+            effects.consume(code);
+            return expectClosingB;
+        }
+        // Not a closing marker - this is data content
+        // Exit marker and enter data
+        effects.exit('magicBlockMarkerEnd');
+        effects.enter('magicBlockData');
+        // The [ was consumed by the marker, so we need to conceptually "have it" in our data
+        // But since we already consumed it into the marker, we need a different approach
+        // Re-classify: consume this character as data and continue
+        if (code === codes.quotationMark)
+            jsonState.inString = true;
+        effects.consume(code);
+        return captureData;
+    }
+    function expectSlash(code) {
+        if (code === null) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        // At line ending during marker parsing
+        if (markdownLineEnding(code)) {
+            effects.exit('magicBlockMarkerEnd');
+            return effects.check(syntax_nonLazyContinuation, continuationOk, after)(code);
+        }
+        if (code !== codes.slash) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.enter('magicBlockData');
+            if (code === codes.quotationMark)
+                jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        effects.consume(code);
+        return expectClosingB;
+    }
+    function expectClosingB(code) {
+        if (code === null) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (code !== codes.lowercaseB) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.enter('magicBlockData');
+            if (code === codes.quotationMark)
+                jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        effects.consume(code);
+        return expectClosingL;
+    }
+    function expectClosingL(code) {
+        if (code === null) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (code !== codes.lowercaseL) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.enter('magicBlockData');
+            if (code === codes.quotationMark)
+                jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        effects.consume(code);
+        return expectClosingO;
+    }
+    function expectClosingO(code) {
+        if (code === null) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (code !== codes.lowercaseO) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.enter('magicBlockData');
+            if (code === codes.quotationMark)
+                jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        effects.consume(code);
+        return expectClosingC;
+    }
+    function expectClosingC(code) {
+        if (code === null) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (code !== codes.lowercaseC) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.enter('magicBlockData');
+            if (code === codes.quotationMark)
+                jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        effects.consume(code);
+        return expectClosingK;
+    }
+    function expectClosingK(code) {
+        if (code === null) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (code !== codes.lowercaseK) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.enter('magicBlockData');
+            if (code === codes.quotationMark)
+                jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        effects.consume(code);
+        return expectClosingBracket;
+    }
+    function expectClosingBracket(code) {
+        if (code === null) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.exit('magicBlock');
+            return nok(code);
+        }
+        if (code !== codes.rightSquareBracket) {
+            effects.exit('magicBlockMarkerEnd');
+            effects.enter('magicBlockData');
+            if (code === codes.quotationMark)
+                jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        effects.consume(code);
+        effects.exit('magicBlockMarkerEnd');
+        // Check for trailing whitespace on the same line
+        return consumeTrailing;
+    }
+    /**
+     * Consume trailing whitespace (spaces/tabs) on the same line after [/block].
+     * For concrete flow constructs, we must end at eol/eof or fail.
+     * Trailing whitespace is consumed; other content causes nok (text tokenizer handles it).
+     */
+    function consumeTrailing(code) {
+        // End of file - done
+        if (code === null) {
+            effects.exit('magicBlock');
+            return ok(code);
+        }
+        // Line ending - done
+        if (markdownLineEnding(code)) {
+            effects.exit('magicBlock');
+            return ok(code);
+        }
+        // Space or tab - consume as trailing whitespace
+        if (code === codes.space || code === codes.horizontalTab) {
+            effects.enter('magicBlockTrailing');
+            effects.consume(code);
+            return consumeTrailingContinue;
+        }
+        // Any other character - fail flow tokenizer, let text tokenizer handle it
+        effects.exit('magicBlock');
+        return nok(code);
+    }
+    /**
+     * Continue consuming trailing whitespace.
+     */
+    function consumeTrailingContinue(code) {
+        // End of file - done
+        if (code === null) {
+            effects.exit('magicBlockTrailing');
+            effects.exit('magicBlock');
+            return ok(code);
+        }
+        // Line ending - done
+        if (markdownLineEnding(code)) {
+            effects.exit('magicBlockTrailing');
+            effects.exit('magicBlock');
+            return ok(code);
+        }
+        // More space or tab - keep consuming
+        if (code === codes.space || code === codes.horizontalTab) {
+            effects.consume(code);
+            return consumeTrailingContinue;
+        }
+        // Non-whitespace after whitespace - fail flow tokenizer
+        effects.exit('magicBlockTrailing');
+        effects.exit('magicBlock');
+        return nok(code);
+    }
+    /**
+     * Called when we can't continue (lazy line or EOF) - exit the construct.
+     */
+    function after(code) {
+        effects.exit('magicBlock');
+        return nok(code);
+    }
+}
+/**
+ * Text tokenizer for single-line magic blocks only.
+ * Used in inline contexts like list items and paragraphs.
+ * Multiline blocks are handled by the flow tokenizer.
+ */
+function tokenizeMagicBlockText(effects, ok, nok) {
+    // State for tracking JSON content
+    const jsonState = { escapeNext: false, inString: false };
+    const blockTypeRef = { value: '' };
+    let seenOpenBrace = false;
+    // Create shared parsers for opening marker and type capture
+    const typeParser = createTypeCaptureParser(effects, nok, beforeData, blockTypeRef);
+    const openingMarkerParser = createOpeningMarkerParser(effects, nok, typeParser.first);
+    // Success handler for closing marker - exits tokens and returns ok
+    const closingSuccess = (code) => {
+        effects.exit('magicBlockMarkerEnd');
+        effects.exit('magicBlock');
+        return ok(code);
+    };
+    // Mismatch handler - falls back to data capture
+    const closingMismatch = (code) => {
+        effects.exit('magicBlockMarkerEnd');
+        effects.enter('magicBlockData');
+        if (code === codes.quotationMark)
+            jsonState.inString = true;
+        effects.consume(code);
+        return captureData;
+    };
+    // EOF handler
+    const closingEof = (_code) => nok(_code);
+    // Create closing marker parsers
+    const closingFromBeforeData = createClosingMarkerParser(effects, closingSuccess, closingMismatch, closingEof, jsonState);
+    const closingFromData = createClosingMarkerParser(effects, closingSuccess, closingMismatch, closingEof, jsonState);
+    return start;
+    function start(code) {
+        if (code !== codes.leftSquareBracket)
+            return nok(code);
+        effects.enter('magicBlock');
+        effects.enter('magicBlockMarkerStart');
+        effects.consume(code);
+        return openingMarkerParser;
+    }
+    /**
+     * State before data content - handles line endings before entering data token.
+     * Whitespace before '{' is allowed.
+     */
+    function beforeData(code) {
+        // Fail on EOF - magic block must be closed
+        if (code === null) {
+            return nok(code);
+        }
+        // Handle line endings before any data - consume them without entering data token
+        if (markdownLineEnding(code)) {
+            effects.enter('magicBlockLineEnding');
+            effects.consume(code);
+            effects.exit('magicBlockLineEnding');
+            return beforeData;
+        }
+        // Check for closing marker directly (without entering data)
+        if (code === codes.leftSquareBracket) {
+            effects.enter('magicBlockMarkerEnd');
+            effects.consume(code);
+            return closingFromBeforeData.expectSlash;
+        }
+        // If we've already seen the opening brace, just continue capturing data
+        if (seenOpenBrace) {
+            effects.enter('magicBlockData');
+            return captureData(code);
+        }
+        // Skip whitespace (spaces/tabs) before the data
+        if (code === codes.space || code === codes.horizontalTab) {
+            return beforeDataWhitespace(code);
+        }
+        // Data must start with '{' for valid JSON
+        if (code !== codes.leftCurlyBrace) {
+            return nok(code);
+        }
+        // We have '{' - enter data token and start capturing
+        seenOpenBrace = true;
+        effects.enter('magicBlockData');
+        return captureData(code);
+    }
+    /**
+     * Consume whitespace before the data.
+     */
+    function beforeDataWhitespace(code) {
+        if (code === null) {
+            return nok(code);
+        }
+        if (markdownLineEnding(code)) {
+            effects.enter('magicBlockLineEnding');
+            effects.consume(code);
+            effects.exit('magicBlockLineEnding');
+            return beforeData;
+        }
+        if (code === codes.space || code === codes.horizontalTab) {
+            effects.enter('magicBlockData');
+            effects.consume(code);
+            return beforeDataWhitespaceContinue;
+        }
+        if (code === codes.leftCurlyBrace) {
+            seenOpenBrace = true;
+            effects.enter('magicBlockData');
+            return captureData(code);
+        }
+        return nok(code);
+    }
+    /**
+     * Continue consuming whitespace or validate the opening brace.
+     */
+    function beforeDataWhitespaceContinue(code) {
+        if (code === null) {
+            effects.exit('magicBlockData');
+            return nok(code);
+        }
+        if (markdownLineEnding(code)) {
+            effects.exit('magicBlockData');
+            effects.enter('magicBlockLineEnding');
+            effects.consume(code);
+            effects.exit('magicBlockLineEnding');
+            return beforeData;
+        }
+        if (code === codes.space || code === codes.horizontalTab) {
+            effects.consume(code);
+            return beforeDataWhitespaceContinue;
+        }
+        if (code === codes.leftCurlyBrace) {
+            seenOpenBrace = true;
+            return captureData(code);
+        }
+        effects.exit('magicBlockData');
+        return nok(code);
+    }
+    function captureData(code) {
+        // Fail on EOF - magic block must be closed
+        if (code === null) {
+            effects.exit('magicBlockData');
+            return nok(code);
+        }
+        // Handle multiline magic blocks within text/paragraphs
+        // Exit data, consume line ending with proper token, then re-enter data
+        if (markdownLineEnding(code)) {
+            effects.exit('magicBlockData');
+            effects.enter('magicBlockLineEnding');
+            effects.consume(code);
+            effects.exit('magicBlockLineEnding');
+            return beforeData; // Go back to beforeData to handle potential empty lines
+        }
+        if (jsonState.escapeNext) {
+            jsonState.escapeNext = false;
+            effects.consume(code);
+            return captureData;
+        }
+        if (jsonState.inString) {
+            if (code === codes.backslash) {
+                jsonState.escapeNext = true;
+                effects.consume(code);
+                return captureData;
+            }
+            if (code === codes.quotationMark) {
+                jsonState.inString = false;
+            }
+            effects.consume(code);
+            return captureData;
+        }
+        if (code === codes.quotationMark) {
+            jsonState.inString = true;
+            effects.consume(code);
+            return captureData;
+        }
+        if (code === codes.leftSquareBracket) {
+            effects.exit('magicBlockData');
+            effects.enter('magicBlockMarkerEnd');
+            effects.consume(code);
+            return closingFromData.expectSlash;
+        }
+        effects.consume(code);
+        return captureData;
+    }
+}
+/* harmony default export */ const syntax = ((/* unused pure expression or super */ null && (magicBlock)));
+
+;// ./lib/micromark/magic-block/index.ts
+/**
+ * Micromark extension for magic block syntax.
+ *
+ * Usage:
+ * ```ts
+ * import { magicBlock } from './lib/micromark/magic-block';
+ *
+ * const processor = unified()
+ *   .data('micromarkExtensions', [magicBlock()])
+ * ```
+ */
+
+
+;// ./lib/micromark/mdx-component/syntax.ts
+
+
+
+
+
+// Raw tags (type-1: pre/script/style/textarea) and block tags (type-6: div,
+// section, …) always start a block, so they stay flow even with trailing
+// content. Other lowercase tags (i, span, …) follow the type-7 rule and only
+// stay flow when nothing trails the close tag.
+const htmlFlowTagNames = new Set([...htmlRawNames, ...htmlBlockNames]);
+// Lowercase type-6 block tags claimable in flow even without a `{…}` attribute, so
+// blank lines between nested JSX siblings don't fragment the block. Excludes table
+// tags (mdxishTables owns their blank lines) and voids (never close).
+const plainBlockClaimTagNames = new Set([...htmlBlockNames].filter(tag => !HTML_TABLE_STRUCTURE_TAGS.has(tag) && !HTML_VOID_ELEMENTS.has(tag)));
+const mdx_component_syntax_nonLazyContinuationStart = {
+    tokenize: mdx_component_syntax_tokenizeNonLazyContinuationStart,
+    partial: true,
+};
+// Lookahead for `plainClaimLineStart`: is this line markup-only, or a paragraph
+// that merely starts with a tag? Run via `effects.check` so it never consumes.
+const markupOnlyContinuation = {
+    tokenize: tokenizeMarkupOnlyContinuation,
+    partial: true,
+};
+function resolveToMdxComponent(events) {
+    let index = events.length;
+    while (index > 0) {
+        index -= 1;
+        if (events[index][0] === 'enter' && events[index][1].type === 'mdxComponent') {
+            break;
+        }
+    }
+    if (index > 1 && events[index - 2][1].type === types_types.linePrefix) {
+        events[index][1].start = events[index - 2][1].start;
+        events[index + 1][1].start = events[index - 2][1].start;
+        events.splice(index - 2, 2);
+    }
+    return events;
+}
+const mdxComponentFlowConstruct = {
+    name: 'mdxComponent',
+    tokenize: createTokenize('flow'),
+    resolveTo: resolveToMdxComponent,
+    concrete: true,
+};
+const mdxComponentTextConstruct = {
+    name: 'mdxComponentText',
+    tokenize: createTokenize('text'),
+};
+/**
+ * Factory for both flow (block) and text (inline) variants.
+ *
+ * **Flow** — the original behavior: claims PascalCase components (always) and
+ * lowercase HTML tags that carry at least one `{…}` attribute expression.
+ * Multi-line, concrete, `afterClose` consumes the rest of the line.
+ *
+ * **Text** — runs inside paragraphs / inline context. Claims lowercase tags and
+ * inline PascalCase components (`INLINE_COMPONENT_TAGS` — Anchor, Glossary), both
+ * gated on at least one `{…}` brace attribute. All other PascalCase stays
+ * flow-only, matching how ReadMe's custom components are authored. Aborts on line
+ * endings (inline constructs don't span lines) and exits immediately after
+ * `</tag>` so the paragraph's inline parser picks up the trailing text.
+ */
+function createTokenize(mode) {
+    const isFlow = mode === 'flow';
+    return function tokenize(effects, ok, nok) {
+        // eslint-disable-next-line @typescript-eslint/no-this-alias
+        const self = this;
+        let tagName = '';
+        let depth = 0;
+        let closingTagName = '';
+        // For lowercase tags we only want to claim the block if it uses JSX
+        // attribute expression syntax (`attr={...}`). Plain HTML should fall
+        // through to CommonMark html-flow. Flow mode claims any PascalCase block
+        // component; text mode claims only inline PascalCase components
+        // (INLINE_COMPONENT_TAGS — Anchor, Glossary), also brace-gated.
+        let isLowercaseTag = false;
+        let sawBraceAttr = false;
+        // A plain lowercase block tag claimed without a `{…}` attribute, gated by
+        // `plainClaimLineStart`: after a blank line it may only continue on a tag line.
+        let isPlainBlockClaim = false;
+        let pendingBlankLine = false;
+        // Code span tracking
+        let codeSpanOpenSize = 0;
+        let codeSpanCloseSize = 0;
+        // Fenced code block tracking
+        let fenceChar = null;
+        let fenceLength = 0;
+        let fenceCloseLength = 0;
+        let atLineStart = false;
+        // True once this construct consumes any line ending; lets `afterClose`
+        // treat only single-line lowercase tags as inline candidates.
         let sawLineEnding = false;
         // Bail when the opener line has unmatched tag-like tokens in its body.
         // `<Foo>_<Bar>.csv` leaves opens > closes; matched shapes like
@@ -101526,7 +101831,7 @@ function createTokenize(mode) {
         }
         // Continuation for multi-line opening tags
         function openTagContinuationStart(code) {
-            return effects.check(syntax_nonLazyContinuationStart, openTagContinuationNonLazy, continuationAfter)(code);
+            return effects.check(mdx_component_syntax_nonLazyContinuationStart, openTagContinuationNonLazy, continuationAfter)(code);
         }
         function openTagContinuationNonLazy(code) {
             sawLineEnding = true;
@@ -101651,7 +101956,7 @@ function createTokenize(mode) {
             return inFencedCode;
         }
         function fencedCodeContinuationStart(code) {
-            return effects.check(syntax_nonLazyContinuationStart, fencedCodeContinuationNonLazy, continuationAfter)(code);
+            return effects.check(mdx_component_syntax_nonLazyContinuationStart, fencedCodeContinuationNonLazy, continuationAfter)(code);
         }
         function fencedCodeContinuationNonLazy(code) {
             sawLineEnding = true;
@@ -101666,6 +101971,16 @@ function createTokenize(mode) {
             }
             effects.enter('mdxComponentData');
             fenceCloseLength = 0;
+            return fencedCodeMaybeClose(code);
+        }
+        // Skip leading indentation before the closing-fence check: an indented fence
+        // (the norm in a component body) closes on an equally-indented line, else the
+        // closer is never matched and scanning runs to EOF (CX-3704).
+        function fencedCodeMaybeClose(code) {
+            if (markdownSpace(code)) {
+                effects.consume(code);
+                return fencedCodeMaybeClose;
+            }
             // Check for closing fence
             if (code === fenceChar) {
                 fenceCloseLength = 1;
@@ -101849,7 +102164,7 @@ function createTokenize(mode) {
         }
         // ── Body continuation (line endings) ───────────────────────────────────
         function bodyContinuationStart(code) {
-            return effects.check(syntax_nonLazyContinuationStart, bodyContinuationNonLazy, continuationAfter)(code);
+            return effects.check(mdx_component_syntax_nonLazyContinuationStart, bodyContinuationNonLazy, continuationAfter)(code);
         }
         function bodyContinuationNonLazy(code) {
             sawLineEnding = true;
@@ -101881,6 +102196,13 @@ function createTokenize(mode) {
         }
         // Dispatch a non-blank continuation line: fenced code at line start, else body.
         function bodyLineStart(code) {
+            // Skip leading indentation while staying "at line start" so an indented
+            // fence is still recognized. Otherwise the first space clears `atLineStart`
+            // and its content — including any unbalanced `{` — stays live text (CX-3704).
+            if (atLineStart && markdownSpace(code)) {
+                effects.consume(code);
+                return bodyLineStart;
+            }
             if (atLineStart && code === codes.tilde)
                 return bodyAfterLineStart(code);
             if (atLineStart && code === codes.graveAccent) {
@@ -101931,7 +102253,7 @@ function createTokenize(mode) {
         }
     };
 }
-function syntax_tokenizeNonLazyContinuationStart(effects, ok, nok) {
+function mdx_component_syntax_tokenizeNonLazyContinuationStart(effects, ok, nok) {
     // eslint-disable-next-line @typescript-eslint/no-this-alias
     const self = this;
     return start;
@@ -102039,9 +102361,20 @@ function mdxComponent() {
 
 
 
+
+
+
+
+
+
 const buildInlineMdProcessor = (safeMode) => {
-    const micromarkExts = [mdxComponent(), syntax_gemoji(), legacyVariable(), magicBlock()];
+    // `jsxTable` must be present so a `<Table>`/`<table>` nested in a component
+    // body (e.g. a `<Callout>`) is captured as one html node. Without it, blank
+    // lines between rows let CommonMark HTML block type 6 fragment the table and
+    // its rows spill out as text / indented code blocks (CX-3705).
+    const micromarkExts = [jsxTable(), mdxComponent(), syntax_gemoji(), legacyVariable(), magicBlock()];
     const fromMarkdownExts = [
+        jsxTableFromMarkdown(),
         mdxComponentFromMarkdown(),
         gemojiFromMarkdown(),
         legacyVariableFromMarkdown(),
@@ -102101,6 +102434,65 @@ const toMdxJsxTextElement = (name, attributes, children, position) => ({
     children,
     ...(position ? { position } : {}),
 });
+// Raw-body tags (pre/script/style/textarea) must stay byte-exact; table
+// structure (`table` + `tableTags`) is owned by `mdxishTables` and figures by
+// `mdxishJsxToMdast`, both of which run later on raw html nodes.
+const NON_PROMOTABLE_PLAIN_TAGS = new Set([...htmlRawNames, ...tableTags, 'table', 'figure', 'figcaption']);
+const NESTED_TABLE_RE = /<table[\s>]/i;
+const isMarkdownPromotableHtmlTag = (tag) => !NON_PROMOTABLE_PLAIN_TAGS.has(tag);
+// Expression nodes count as plain so `<div>{1+1}</div>` keeps its current
+// literal-brace behavior; variables/glossary already resolve inside raw html.
+const PLAIN_CONTENT_TYPES = new Set([
+    'paragraph',
+    'text',
+    'html',
+    'mdxTextExpression',
+    'mdxFlowExpression',
+    NodeTypes.variable,
+    NodeTypes.glossary,
+]);
+// Promoting plain HTML is only worth bypassing rehype-raw's parse5 pass when
+// the body parses into an actual markdown construct.
+const containsMarkdownConstruct = (nodes) => nodes.some(node => !PLAIN_CONTENT_TYPES.has(node.type) ||
+    ('children' in node && Array.isArray(node.children) && containsMarkdownConstruct(node.children)));
+/**
+ * Index of the `</tag>` that balances the already-consumed opening tag (the
+ * caller starts us one level deep). `lastIndexOf` mis-slices sibling same-tag
+ * pairs like `<div>**a**</div><div>**b**</div>`, so we depth-match instead —
+ * delegating to `walkTags` (htmlparser2) so quoted attributes (`title="</div>"`),
+ * code spans, and legacy `<<VARIABLE>>` are handled for free. Returns -1 when
+ * the wrapper is left open.
+ */
+function findBalancedClosingTagIndex(content, tag) {
+    const target = tag.toLowerCase();
+    const canonicalCloserLength = tag.length + 3; // `</tag>`
+    // The caller already stripped the opening tag, so re-attach one: htmlparser2
+    // drops an unmatched closer, and we want it balanced. Offsets shift by the
+    // prefix length.
+    const prefix = `<${tag}>`;
+    let depth = 0;
+    let closeIndex = -1;
+    walkTags(prefix + content, {
+        onOpen: ({ name, isSelfClosing, isStrayCloser }) => {
+            if (closeIndex >= 0 || isSelfClosing || isStrayCloser)
+                return;
+            if (name.toLowerCase() === target)
+                depth += 1;
+        },
+        onClose: ({ name, start, end, implicit }) => {
+            if (closeIndex >= 0 || implicit || name.toLowerCase() !== target)
+                return;
+            // Only canonical `</tag>` closers — the caller slices by that length, so a
+            // whitespaced `</tag >` would misalign; leaving it unmatched keeps it raw.
+            if (end - start !== canonicalCloserLength)
+                return;
+            depth -= 1;
+            if (depth === 0)
+                closeIndex = start - prefix.length;
+        },
+    });
+    return closeIndex;
+}
 
 ;// ./processor/transform/mdxish/components/inline-html.ts
 
@@ -102425,6 +102817,10 @@ const substituteNodeWithMdxNode = (parent, index, mdxNode) => {
  * This transformer identifies these patterns and converts them to proper MDX JSX elements so they
  * can be accurately recognized and rendered later with their component definition code.
  *
+ * Note: The main goal is to promote PascalCase tags to MDX elements, but we want to promote
+ * normal HTML to MDX elements in some cases so they get the full custom parsing behavior.
+ * E.g. tags with JSX expressions, nested components, etc.
+ *
  * The mdx-component micromark tokenizer ensures that multi-line components are captured
  * as single HTML nodes, so this transformer only needs to handle two cases:
  *
@@ -102471,6 +102867,7 @@ const mdxishMdxComponentBlocks = (opts = {}) => (tree, file) => {
         if (GENERIC_MDX_COMPONENT_EXCLUDED_TAGS.has(tag))
             return; // owned by dedicated transformers
         const isPascal = isPascalCase(tag);
+        // ==== SPECIAL CASES TO PROMOTE NORMAL HTML TO MDX ELEMENTS ====
         // Lowercase inline tags with `{…}` attributes belong to
         // mdxishInlineComponentBlocks; leave them as html for that pass. PascalCase
         // components stay flow-level even when inline (ReadMe's component model).
@@ -102479,11 +102876,19 @@ const mdxishMdxComponentBlocks = (opts = {}) => (tree, file) => {
         // A lowercase wrapper is only promoted when it (or a descendant) carries a
         // JSX expression or nests a component; otherwise it would swallow that inner
         // JSX/component as literal text that rehype-raw's parse5 pass can't handle.
-        // Table-structural wrappers are excluded — `mdxishTables` re-parses those.
-        const hasNestedExpressionAttr = !selfClosing && NESTED_ATTR_EXPRESSION_RE.test(contentAfterTag);
+        // Table-structural wrappers are excluded from both — `mdxishTables` re-parses
+        // those, so a `{…}` in a cell (e.g. `<code>--depth={n}</code>`) must not
+        // accidentally promote the table to an MDX element prematurely.
         const isTableStructuralTag = tag === 'table' || tableTags.has(tag);
+        const hasNestedExpressionAttr = !selfClosing && !isTableStructuralTag && NESTED_ATTR_EXPRESSION_RE.test(contentAfterTag);
         const hasNestedComponentTag = !selfClosing && !isTableStructuralTag && hasNestedGenericComponentTag(contentAfterTag);
-        if (!isPascal && !hasExpressionAttr(attributes) && !hasNestedExpressionAttr && !hasNestedComponentTag)
+        // Promotion: By default commonmark doesn't parse markdown in single line HTML tags (e.g. <div>**bold**</div>)
+        // To support that, we try to promote them to MDX elements so the markdown gets parsed
+        const isPlainLowercaseHtml = !isPascal && !hasExpressionAttr(attributes) && !hasNestedExpressionAttr && !hasNestedComponentTag;
+        const plainClosingTagIndex = isPlainLowercaseHtml && !selfClosing && isMarkdownPromotableHtmlTag(tag) && !NESTED_TABLE_RE.test(contentAfterTag)
+            ? findBalancedClosingTagIndex(contentAfterTag, tag)
+            : -1;
+        if (isPlainLowercaseHtml && plainClosingTagIndex < 0)
             return;
         const closingTagStr = `</${tag}>`;
         // Case 1: Self-closing tag
@@ -102504,14 +102909,26 @@ const mdxishMdxComponentBlocks = (opts = {}) => (tree, file) => {
             return;
         }
         // Case 2: Self-contained block (closing tag in content)
-        if (contentAfterTag.includes(closingTagStr)) {
-            const closingTagIndex = contentAfterTag.lastIndexOf(closingTagStr);
+        const closingTagIndex = isPlainLowercaseHtml ? plainClosingTagIndex : contentAfterTag.lastIndexOf(closingTagStr);
+        if (closingTagIndex >= 0) {
             // Untrimmed so parseMdChildren can dedent before trimming.
             const componentInnerContent = contentAfterTag.substring(0, closingTagIndex);
             const contentAfterClose = contentAfterTag.substring(closingTagIndex + closingTagStr.length).trim();
-            let parsedChildren = componentInnerContent.trim()
-                ? parseMdChildren(componentInnerContent, safeMode)
-                : [];
+            let parsedChildren = [];
+            if (componentInnerContent.trim()) {
+                try {
+                    parsedChildren = parseMdChildren(componentInnerContent, safeMode);
+                }
+                catch (error) {
+                    // Plain HTML bodies can hold anything (e.g. stray braces the strict
+                    // expression parser rejects) — keep the node raw instead of throwing.
+                    if (isPlainLowercaseHtml)
+                        return;
+                    throw error;
+                }
+            }
+            if (isPlainLowercaseHtml && !containsMarkdownConstruct(parsedChildren))
+                return;
             // Lowercase tags are usually inline; unwrap a sole paragraph so their
             // phrasing content isn't spuriously block-wrapped.
             if (!isPascal && parsedChildren.length === 1 && parsedChildren[0].type === 'paragraph') {
@@ -104076,9 +104493,6 @@ const magicBlockTransformer = (options = {}) => tree => {
 // single-line `<div>…</div>`). CommonMark slurps the whole div as one `html`
 // node, so the tokenizer never sees the HTMLBlock — we recover it here.
 const RAW_HTML_BLOCK_RE = /<HTMLBlock\b([^>]*)>\s*\{\s*`((?:[^`\\]|\\.)*)`\s*\}\s*<\/HTMLBlock>/g;
-// Opening `<HTMLBlock …>` as its own `html` node — produced inside a paragraph
-// when an HTMLBlock appears inline alongside text.
-const HTML_BLOCK_OPEN_RE = /^<HTMLBlock\b([^>]*)>$/;
 /**
  * Builds the canonical `html-block` MDAST node the renderer expects.
  */
@@ -104159,13 +104573,14 @@ const splitRawHtmlBlocks = (node) => {
 /**
  * Converts every `<HTMLBlock>` shape that survives parsing into the canonical
  * `html-block` MDAST node, reading the body from the tokenizer's template-literal
- * expression. Three shapes occur:
+ * expression. Two shapes occur:
  *
- *   1. JSX element (`mdxJsxFlowElement`/`mdxJsxTextElement`) — multiline/block
- *      context and table cells (after their remarkMdx re-parse).
- *   2. Raw `html` blob (`splitRawHtmlBlocks`) — single-line top-level, or nested
- *      in raw HTML like an inline `<div>`.
- *   3. Inline-in-paragraph — split into `html` + expression + `html` siblings.
+ *   1. JSX element (`mdxJsxFlowElement`/`mdxJsxTextElement`) — table cells, after
+ *      their remarkMdx re-parse (that re-parse runs without the htmlBlockComponent
+ *      tokenizer, so `<HTMLBlock>` arrives as JSX rather than an opaque `html` node).
+ *   2. Raw `html` blob (`splitRawHtmlBlocks`) — the htmlBlockComponent tokenizer's
+ *      opaque output (top-level and inline), or an `<HTMLBlock>` embedded in a
+ *      larger raw-HTML node like an inline `<div>` that the tokenizer never saw.
  *
  * Runs *after* `mdxishTables` so table cells are re-parsed first;
  * `mdxishTables` recognizes the still-JSX `<HTMLBlock>` element when deciding to
@@ -104190,36 +104605,6 @@ const mdxishHtmlBlocks = () => tree => {
         if (replacement)
             parent.children.splice(index, 1, ...replacement);
     });
-    // Shape 3: inline within a paragraph — `<HTMLBlock>` open/close arrive as
-    // separate `html` siblings with the template-literal expression between them.
-    visit(tree, 'paragraph', (paragraph) => {
-        // An html-block is block content, so it isn't a valid PhrasingContent child;
-        // widen to RootContent (which HTMLBlock belongs to) for the in-place splice.
-        const children = paragraph.children;
-        for (let i = 0; i < children.length; i += 1) {
-            const open = children[i];
-            const openMatch = open.type === 'html' ? open.value.match(HTML_BLOCK_OPEN_RE) : null;
-            if (!openMatch)
-                continue; // eslint-disable-line no-continue
-            const closeIdx = children.findIndex((child, j) => j > i && child.type === 'html' && child.value === '</HTMLBlock>');
-            if (closeIdx === -1)
-                continue; // eslint-disable-line no-continue
-            const body = children
-                .slice(i + 1, closeIdx)
-                .map(child => {
-                if (child.type === 'mdxTextExpression' || child.type === 'mdxFlowExpression') {
-                    return extractTemplateLiteral(child.value);
-                }
-                // Preserve raw text from any other phrasing sibling (e.g. stray
-                // whitespace or content the tokenizer didn't claim) so it isn't
-                // silently dropped from the html payload.
-                return 'value' in child && typeof child.value === 'string' ? child.value : '';
-            })
-                .join('');
-            const openingTagIndent = (open.position?.start.column ?? 1) - 1;
-            children.splice(i, closeIdx - i + 1, htmlBlockFromRaw(openMatch[1], body, open.position, openingTagIndent));
-        }
-    });
 };
 /* harmony default export */ const mdxish_html_blocks = (mdxishHtmlBlocks);
 
@@ -104919,6 +105304,29 @@ const mdxishMermaidTransformer = () => (tree) => {
 };
 /* harmony default export */ const mdxish_mermaid = (mdxishMermaidTransformer);
 
+;// ./processor/transform/mdxish/normalize-closing-tag-whitespace.ts
+
+
+// Spaces/tabs only — newlines would let prose `<` / `>` across lines look like one tag.
+const SPACED_CLOSING_TAG_RE = /<\/[ \t]*([a-zA-Z][a-zA-Z0-9-]*)[ \t]*>/g;
+/**
+ * Canonicalize spaced closing tags (`</ td >` → `</td>`) for known HTML names.
+ *
+ * In HTML, `</` + whitespace is a bogus comment, so `</ table >` never closes the
+ * table (jsxTable misses it → empty table + pre; CX-3706). Only standard HTML tags;
+ * custom components, prose (`a </ b`), and code blocks are left alone.
+ *
+ * @example
+ * normalizeClosingTagWhitespace('</ td >')   // '</td>'
+ * normalizeClosingTagWhitespace('</table >') // '</table>'
+ * normalizeClosingTagWhitespace('a </ b >')  // unchanged
+ */
+function normalizeClosingTagWhitespace(content) {
+    const { protectedContent, protectedCode } = protectCodeBlocks(content);
+    const result = protectedContent.replace(SPACED_CLOSING_TAG_RE, (match, tagName) => STANDARD_HTML_TAGS.has(tagName.toLowerCase()) ? `</${tagName}>` : match);
+    return restoreCodeBlocks(result, protectedCode);
+}
+
 ;// ./processor/transform/mdxish/normalize-compact-headings.ts
 
 /**
@@ -105399,186 +105807,463 @@ function resolveCodeVariables(value, resolvedVariables) {
                 return name.toUpperCase();
             return name in resolvedVariables ? resolvedVariables[name] : name.toUpperCase();
         }
-        // MDX variable: {user.*}
-        if (mdxEscapePrefix || mdxEscapeSuffix)
-            return match;
-        if (mdxVarName in resolvedVariables)
-            return resolvedVariables[mdxVarName];
-        const fullPath = match.slice(1, -1);
-        return fullPath.toUpperCase();
-    });
-}
-/**
- * A remark mdast plugin that resolves legacy variables <<...>> and MDX variables {user.*} inside code and inline code nodes
- * to their values. Uses regexes from the readme variable to search for variables in the code string.
- *
- * This is needed because variables in code blocks and inline cannot be tokenized, and also we need to maintain the code string
- * in the code nodes. This enables engine side variable resolution in codes which improves UX
- */
-const variablesCodeResolver = ({ variables } = {}) => tree => {
-    const resolvedVariables = variables_code_flattenVariables(variables);
-    visit(tree, 'inlineCode', (node) => {
-        if (!node.value)
-            return;
-        node.value = resolveCodeVariables(node.value, resolvedVariables);
-    });
-    visit(tree, 'code', (node) => {
-        if (!node.value)
-            return;
-        if (node.lang === 'mermaid')
-            return;
-        const nextValue = resolveCodeVariables(node.value, resolvedVariables);
-        node.value = nextValue;
-        // Keep code-tabs/readme-components hProperties in sync with node.value
-        // because renderers read `value` from hProperties.
-        if (node.data?.hProperties && typeof node.data.hProperties === 'object') {
-            node.data.hProperties.value = nextValue;
+        // MDX variable: {user.*}
+        if (mdxEscapePrefix || mdxEscapeSuffix)
+            return match;
+        if (mdxVarName in resolvedVariables)
+            return resolvedVariables[mdxVarName];
+        const fullPath = match.slice(1, -1);
+        return fullPath.toUpperCase();
+    });
+}
+/**
+ * A remark mdast plugin that resolves legacy variables <<...>> and MDX variables {user.*} inside code and inline code nodes
+ * to their values. Uses regexes from the readme variable to search for variables in the code string.
+ *
+ * This is needed because variables in code blocks and inline cannot be tokenized, and also we need to maintain the code string
+ * in the code nodes. This enables engine side variable resolution in codes which improves UX
+ */
+const variablesCodeResolver = ({ variables } = {}) => tree => {
+    const resolvedVariables = variables_code_flattenVariables(variables);
+    visit(tree, 'inlineCode', (node) => {
+        if (!node.value)
+            return;
+        node.value = resolveCodeVariables(node.value, resolvedVariables);
+    });
+    visit(tree, 'code', (node) => {
+        if (!node.value)
+            return;
+        if (node.lang === 'mermaid')
+            return;
+        const nextValue = resolveCodeVariables(node.value, resolvedVariables);
+        node.value = nextValue;
+        // Keep code-tabs/readme-components hProperties in sync with node.value
+        // because renderers read `value` from hProperties.
+        if (node.data?.hProperties && typeof node.data.hProperties === 'object') {
+            node.data.hProperties.value = nextValue;
+        }
+    });
+    return tree;
+};
+/* harmony default export */ const variables_code = (variablesCodeResolver);
+
+;// ./processor/transform/mdxish/variables-text.ts
+
+
+/**
+ * Matches {user.<field>} patterns:
+ * - {user.name}
+ * - {user.email}
+ * - {user['field']}
+ * - {user["field"]}
+ *
+ * Captures the field name in group 1 (dot notation) or group 2 (bracket notation)
+ */
+const USER_VAR_REGEX = /\{user\.(\w+)\}|\{user\[['"](\w+)['"]\]\}/g;
+function makeVariableNode(varName, rawValue) {
+    return {
+        type: NodeTypes.variable,
+        data: {
+            hName: 'Variable',
+            hProperties: { name: varName },
+        },
+        value: rawValue,
+    };
+}
+/**
+ * A remark plugin that parses {user.<field>} patterns from text nodes and
+ * mdx expression nodes, creating Variable nodes for runtime resolution.
+ *
+ * Handles:
+ * - `text` nodes: when safeMode is true or after expression evaluation
+ * - `mdxTextExpression` nodes: when mdxExpression has parsed {user.*} before evaluation
+ * - `mdxFlowExpression` nodes: when {user.*} appears on its own line (e.g. inside JSX table cells)
+ *
+ * Supports any user field: name, email, email_verified, exp, iat, etc.
+ */
+function visitExpressionNode(node, index, parent) {
+    if (index === undefined || !parent)
+        return;
+    const wrapped = `{${(node.value ?? '').trim()}}`;
+    const matches = [...wrapped.matchAll(USER_VAR_REGEX)];
+    if (matches.length !== 1)
+        return;
+    const varName = matches[0][1] || matches[0][2];
+    parent.children.splice(index, 1, makeVariableNode(varName, wrapped));
+}
+const variablesTextTransformer = () => tree => {
+    visit(tree, 'mdxTextExpression', (node, index, parent) => {
+        visitExpressionNode(node, index, parent);
+    });
+    visit(tree, 'mdxFlowExpression', (node, index, parent) => {
+        visitExpressionNode(node, index, parent);
+    });
+    visit(tree, 'text', (node, index, parent) => {
+        if (index === undefined || !parent)
+            return;
+        // Skip if inside inline code
+        if (parent.type === 'inlineCode')
+            return;
+        const text = node.value;
+        if (typeof text !== 'string' || !text.trim())
+            return;
+        if (!text.includes('{user.') && !text.includes('{user['))
+            return;
+        const matches = [...text.matchAll(USER_VAR_REGEX)];
+        if (matches.length === 0)
+            return;
+        const parts = [];
+        let lastIndex = 0;
+        matches.forEach(match => {
+            const matchIndex = match.index ?? 0;
+            // Add text before the match
+            if (matchIndex > lastIndex) {
+                parts.push({ type: 'text', value: text.slice(lastIndex, matchIndex) });
+            }
+            // Extract variable name from either capture group (dot or bracket notation)
+            const varName = match[1] || match[2];
+            parts.push(makeVariableNode(varName, match[0]));
+            lastIndex = matchIndex + match[0].length;
+        });
+        // Add remaining text after last match
+        if (lastIndex < text.length) {
+            parts.push({ type: 'text', value: text.slice(lastIndex) });
+        }
+        // Replace node with parts
+        if (parts.length > 1 || (parts.length === 1 && parts[0].type !== 'text')) {
+            parent.children.splice(index, 1, ...parts);
+        }
+    });
+    return tree;
+};
+/* harmony default export */ const variables_text = (variablesTextTransformer);
+
+;// ./lib/mdast-util/html-block-component/index.ts
+const html_block_component_contextMap = new WeakMap();
+function findHtmlBlockComponentToken() {
+    const events = this.tokenStack;
+    for (let i = events.length - 1; i >= 0; i -= 1) {
+        if (events[i][0].type === 'htmlBlockComponent')
+            return events[i][0];
+    }
+    return undefined;
+}
+function enterHtmlBlockComponent(token) {
+    html_block_component_contextMap.set(token, { chunks: [], lastEndLine: token.start.line });
+    this.enter({ type: 'html', value: '' }, token);
+}
+function exitHtmlBlockComponentData(token) {
+    const componentToken = findHtmlBlockComponentToken.call(this);
+    if (!componentToken)
+        return;
+    const ctx = html_block_component_contextMap.get(componentToken);
+    if (ctx) {
+        const gap = token.start.line - ctx.lastEndLine;
+        if (ctx.chunks.length > 0 && gap > 0) {
+            ctx.chunks.push('\n'.repeat(gap));
+        }
+        ctx.chunks.push(this.sliceSerialize(token));
+        ctx.lastEndLine = token.end.line;
+    }
+}
+function exitHtmlBlockComponent(token) {
+    const ctx = html_block_component_contextMap.get(token);
+    const node = this.stack[this.stack.length - 1];
+    if (ctx) {
+        node.value = ctx.chunks.join('');
+        html_block_component_contextMap.delete(token);
+    }
+    this.exit(token);
+}
+function htmlBlockComponentFromMarkdown() {
+    return {
+        enter: {
+            htmlBlockComponent: enterHtmlBlockComponent,
+        },
+        exit: {
+            htmlBlockComponentData: exitHtmlBlockComponentData,
+            htmlBlockComponent: exitHtmlBlockComponent,
+        },
+    };
+}
+
+;// ./lib/micromark/html-block-component/syntax.ts
+
+
+const TAG_SUFFIX = [
+    codes.uppercaseT,
+    codes.uppercaseM,
+    codes.uppercaseL,
+    codes.uppercaseB,
+    codes.lowercaseL,
+    codes.lowercaseO,
+    codes.lowercaseC,
+    codes.lowercaseK,
+];
+// ---------------------------------------------------------------------------
+// Shared tokenizer factory
+// ---------------------------------------------------------------------------
+/**
+ * Creates a tokenize function for `<HTMLBlock>...</HTMLBlock>`.
+ *
+ * - **flow** (block-level): supports multiline content via line continuations,
+ *   consumes trailing whitespace after the closing tag.
+ * - **text** (inline): single-line only, exits immediately after the closing tag.
+ */
+function syntax_createTokenize(mode) {
+    return function tokenize(effects, ok, nok) {
+        let depth = 1;
+        function matchChars(chars, onMatch, onFail) {
+            if (chars.length === 0)
+                return onMatch;
+            const next = (code) => {
+                if (code === chars[0]) {
+                    effects.consume(code);
+                    return matchChars(chars.slice(1), onMatch, onFail);
+                }
+                return onFail(code);
+            };
+            return next;
+        }
+        function matchTagName(onMatch, onFail) {
+            const next = (code) => {
+                if (code === codes.uppercaseH) {
+                    effects.consume(code);
+                    return matchChars(TAG_SUFFIX, onMatch, onFail);
+                }
+                return onFail(code);
+            };
+            return next;
+        }
+        return start;
+        function start(code) {
+            if (code !== codes.lessThan)
+                return nok(code);
+            effects.enter('htmlBlockComponent');
+            effects.enter('htmlBlockComponentData');
+            effects.consume(code);
+            return matchTagName(afterTagName, nok);
+        }
+        function afterTagName(code) {
+            if (code === codes.greaterThan) {
+                effects.consume(code);
+                return body;
+            }
+            if (code === codes.space || code === codes.horizontalTab) {
+                effects.consume(code);
+                return inAttributes;
+            }
+            if (mode === 'flow' && markdownLineEnding(code)) {
+                effects.exit('htmlBlockComponentData');
+                return attributeContinuationStart(code);
+            }
+            if (code === codes.slash) {
+                effects.consume(code);
+                return selfClose;
+            }
+            return nok(code);
+        }
+        function inAttributes(code) {
+            if (code === codes.greaterThan) {
+                effects.consume(code);
+                return body;
+            }
+            if (code === null) {
+                return nok(code);
+            }
+            if (markdownLineEnding(code)) {
+                if (mode === 'text')
+                    return nok(code);
+                effects.exit('htmlBlockComponentData');
+                return attributeContinuationStart(code);
+            }
+            effects.consume(code);
+            return inAttributes;
+        }
+        function attributeContinuationStart(code) {
+            return effects.check(html_block_component_syntax_nonLazyContinuationStart, attributeContinuationNonLazy, continuationAfter)(code);
+        }
+        function attributeContinuationNonLazy(code) {
+            effects.enter(types_types.lineEnding);
+            effects.consume(code);
+            effects.exit(types_types.lineEnding);
+            return attributeContinuationBefore;
+        }
+        function attributeContinuationBefore(code) {
+            if (code === null || markdownLineEnding(code)) {
+                return attributeContinuationStart(code);
+            }
+            effects.enter('htmlBlockComponentData');
+            return inAttributes(code);
+        }
+        function selfClose(code) {
+            if (code === codes.greaterThan) {
+                effects.consume(code);
+                return mode === 'flow' ? afterClose : done(code);
+            }
+            return nok(code);
+        }
+        function body(code) {
+            if (code === null)
+                return nok(code);
+            if (markdownLineEnding(code)) {
+                if (mode === 'text') {
+                    // Text constructs operate on paragraph content which spans lines
+                    effects.consume(code);
+                    return body;
+                }
+                effects.exit('htmlBlockComponentData');
+                return continuationStart(code);
+            }
+            if (code === codes.lessThan) {
+                effects.consume(code);
+                return closeSlash;
+            }
+            effects.consume(code);
+            return body;
+        }
+        function closeSlash(code) {
+            if (code === codes.slash) {
+                effects.consume(code);
+                return matchTagName(closeGt, body);
+            }
+            return matchTagName(openAfterTagName, body)(code);
+        }
+        function openAfterTagName(code) {
+            if (code === codes.greaterThan || code === codes.space || code === codes.horizontalTab) {
+                depth += 1;
+                effects.consume(code);
+                return body;
+            }
+            return body(code);
+        }
+        function closeGt(code) {
+            if (code === codes.greaterThan) {
+                depth -= 1;
+                effects.consume(code);
+                if (depth === 0) {
+                    return mode === 'flow' ? afterClose : done(code);
+                }
+                return body;
+            }
+            return body(code);
         }
-    });
-    return tree;
-};
-/* harmony default export */ const variables_code = (variablesCodeResolver);
-
-;// ./processor/transform/mdxish/variables-text.ts
-
-
-/**
- * Matches {user.<field>} patterns:
- * - {user.name}
- * - {user.email}
- * - {user['field']}
- * - {user["field"]}
- *
- * Captures the field name in group 1 (dot notation) or group 2 (bracket notation)
- */
-const USER_VAR_REGEX = /\{user\.(\w+)\}|\{user\[['"](\w+)['"]\]\}/g;
-function makeVariableNode(varName, rawValue) {
-    return {
-        type: NodeTypes.variable,
-        data: {
-            hName: 'Variable',
-            hProperties: { name: varName },
-        },
-        value: rawValue,
-    };
-}
-/**
- * A remark plugin that parses {user.<field>} patterns from text nodes and
- * mdx expression nodes, creating Variable nodes for runtime resolution.
- *
- * Handles:
- * - `text` nodes: when safeMode is true or after expression evaluation
- * - `mdxTextExpression` nodes: when mdxExpression has parsed {user.*} before evaluation
- * - `mdxFlowExpression` nodes: when {user.*} appears on its own line (e.g. inside JSX table cells)
- *
- * Supports any user field: name, email, email_verified, exp, iat, etc.
- */
-function visitExpressionNode(node, index, parent) {
-    if (index === undefined || !parent)
-        return;
-    const wrapped = `{${(node.value ?? '').trim()}}`;
-    const matches = [...wrapped.matchAll(USER_VAR_REGEX)];
-    if (matches.length !== 1)
-        return;
-    const varName = matches[0][1] || matches[0][2];
-    parent.children.splice(index, 1, makeVariableNode(varName, wrapped));
-}
-const variablesTextTransformer = () => tree => {
-    visit(tree, 'mdxTextExpression', (node, index, parent) => {
-        visitExpressionNode(node, index, parent);
-    });
-    visit(tree, 'mdxFlowExpression', (node, index, parent) => {
-        visitExpressionNode(node, index, parent);
-    });
-    visit(tree, 'text', (node, index, parent) => {
-        if (index === undefined || !parent)
-            return;
-        // Skip if inside inline code
-        if (parent.type === 'inlineCode')
-            return;
-        const text = node.value;
-        if (typeof text !== 'string' || !text.trim())
-            return;
-        if (!text.includes('{user.') && !text.includes('{user['))
-            return;
-        const matches = [...text.matchAll(USER_VAR_REGEX)];
-        if (matches.length === 0)
-            return;
-        const parts = [];
-        let lastIndex = 0;
-        matches.forEach(match => {
-            const matchIndex = match.index ?? 0;
-            // Add text before the match
-            if (matchIndex > lastIndex) {
-                parts.push({ type: 'text', value: text.slice(lastIndex, matchIndex) });
+        // -- flow-only states ---------------------------------------------------
+        function afterClose(code) {
+            if (code === null || markdownLineEnding(code)) {
+                return done(code);
             }
-            // Extract variable name from either capture group (dot or bracket notation)
-            const varName = match[1] || match[2];
-            parts.push(makeVariableNode(varName, match[0]));
-            lastIndex = matchIndex + match[0].length;
-        });
-        // Add remaining text after last match
-        if (lastIndex < text.length) {
-            parts.push({ type: 'text', value: text.slice(lastIndex) });
+            if (code === codes.space || code === codes.horizontalTab) {
+                effects.consume(code);
+                return afterClose;
+            }
+            // Reject so the block re-parses as a paragraph, deferring to the
+            // text tokenizer which preserves trailing content in the same line.
+            return nok(code);
         }
-        // Replace node with parts
-        if (parts.length > 1 || (parts.length === 1 && parts[0].type !== 'text')) {
-            parent.children.splice(index, 1, ...parts);
+        // -- flow-only: line continuation ---------------------------------------
+        function continuationStart(code) {
+            return effects.check(html_block_component_syntax_nonLazyContinuationStart, continuationStartNonLazy, continuationAfter)(code);
         }
-    });
-    return tree;
+        function continuationStartNonLazy(code) {
+            effects.enter(types_types.lineEnding);
+            effects.consume(code);
+            effects.exit(types_types.lineEnding);
+            return continuationBefore;
+        }
+        function continuationBefore(code) {
+            if (code === null || markdownLineEnding(code)) {
+                return continuationStart(code);
+            }
+            effects.enter('htmlBlockComponentData');
+            return body(code);
+        }
+        function continuationAfter(code) {
+            if (code === null)
+                return nok(code);
+            effects.exit('htmlBlockComponent');
+            return ok(code);
+        }
+        // -- shared exit --------------------------------------------------------
+        function done(_code) {
+            effects.exit('htmlBlockComponentData');
+            effects.exit('htmlBlockComponent');
+            return ok(_code);
+        }
+    };
+}
+// ---------------------------------------------------------------------------
+// Flow construct (block-level)
+// ---------------------------------------------------------------------------
+const html_block_component_syntax_nonLazyContinuationStart = {
+    tokenize: html_block_component_syntax_tokenizeNonLazyContinuationStart,
+    partial: true,
 };
-/* harmony default export */ const variables_text = (variablesTextTransformer);
-
-;// ./lib/mdast-util/jsx-table/index.ts
-const jsx_table_contextMap = new WeakMap();
-function findJsxTableToken() {
-    const events = this.tokenStack;
-    for (let i = events.length - 1; i >= 0; i -= 1) {
-        if (events[i][0].type === 'jsxTable')
-            return events[i][0];
+function resolveToHtmlBlockComponent(events) {
+    let index = events.length;
+    while (index > 0) {
+        index -= 1;
+        if (events[index][0] === 'enter' && events[index][1].type === 'htmlBlockComponent') {
+            break;
+        }
     }
-    return undefined;
-}
-function enterJsxTable(token) {
-    jsx_table_contextMap.set(token, { chunks: [], lastEndLine: token.start.line });
-    this.enter({ type: 'html', value: '' }, token);
+    if (index > 1 && events[index - 2][1].type === types_types.linePrefix) {
+        events[index][1].start = events[index - 2][1].start;
+        events[index + 1][1].start = events[index - 2][1].start;
+        events.splice(index - 2, 2);
+    }
+    return events;
 }
-function exitJsxTableData(token) {
-    const tableToken = findJsxTableToken.call(this);
-    if (!tableToken)
-        return;
-    const ctx = jsx_table_contextMap.get(tableToken);
-    if (ctx) {
-        const gap = token.start.line - ctx.lastEndLine;
-        if (ctx.chunks.length > 0 && gap > 0) {
-            ctx.chunks.push('\n'.repeat(gap));
+const htmlBlockComponentFlowConstruct = {
+    name: 'htmlBlockComponent',
+    tokenize: syntax_createTokenize('flow'),
+    resolveTo: resolveToHtmlBlockComponent,
+    concrete: true,
+};
+function html_block_component_syntax_tokenizeNonLazyContinuationStart(effects, ok, nok) {
+    // eslint-disable-next-line @typescript-eslint/no-this-alias
+    const self = this;
+    return start;
+    function start(code) {
+        if (markdownLineEnding(code)) {
+            effects.enter(types_types.lineEnding);
+            effects.consume(code);
+            effects.exit(types_types.lineEnding);
+            return after;
         }
-        ctx.chunks.push(this.sliceSerialize(token));
-        ctx.lastEndLine = token.end.line;
+        return nok(code);
     }
-}
-function exitJsxTable(token) {
-    const ctx = jsx_table_contextMap.get(token);
-    const node = this.stack[this.stack.length - 1];
-    if (ctx) {
-        node.value = ctx.chunks.join('');
-        jsx_table_contextMap.delete(token);
+    function after(code) {
+        if (self.parser.lazy[self.now().line]) {
+            return nok(code);
+        }
+        return ok(code);
     }
-    this.exit(token);
 }
-function jsxTableFromMarkdown() {
+// ---------------------------------------------------------------------------
+// Text construct (inline)
+// ---------------------------------------------------------------------------
+const htmlBlockComponentTextConstruct = {
+    name: 'htmlBlockComponent',
+    tokenize: syntax_createTokenize('text'),
+};
+// ---------------------------------------------------------------------------
+// Extension
+// ---------------------------------------------------------------------------
+function htmlBlockComponent() {
     return {
-        enter: {
-            jsxTable: enterJsxTable,
+        flow: {
+            [codes.lessThan]: [htmlBlockComponentFlowConstruct],
         },
-        exit: {
-            jsxTableData: exitJsxTableData,
-            jsxTable: exitJsxTable,
+        text: {
+            [codes.lessThan]: [htmlBlockComponentTextConstruct],
         },
     };
 }
 
+;// ./lib/micromark/html-block-component/index.ts
+
+
 ;// ./lib/micromark/jsx-comment/syntax.ts
 
 
@@ -105701,243 +106386,6 @@ function jsxComment() {
     };
 }
 
-;// ./lib/micromark/jsx-table/syntax.ts
-
-
-const jsx_table_syntax_nonLazyContinuationStart = {
-    tokenize: jsx_table_syntax_tokenizeNonLazyContinuationStart,
-    partial: true,
-};
-function resolveToJsxTable(events) {
-    let index = events.length;
-    while (index > 0) {
-        index -= 1;
-        if (events[index][0] === 'enter' && events[index][1].type === 'jsxTable') {
-            break;
-        }
-    }
-    if (index > 1 && events[index - 2][1].type === types_types.linePrefix) {
-        events[index][1].start = events[index - 2][1].start;
-        events[index + 1][1].start = events[index - 2][1].start;
-        events.splice(index - 2, 2);
-    }
-    return events;
-}
-const jsxTableConstruct = {
-    name: 'jsxTable',
-    tokenize: tokenizeJsxTable,
-    resolveTo: resolveToJsxTable,
-    concrete: true,
-};
-function tokenizeJsxTable(effects, ok, nok) {
-    let codeSpanOpenSize = 0;
-    let codeSpanCloseSize = 0;
-    let depth = 1;
-    const ABLE_SUFFIX = [codes.lowercaseA, codes.lowercaseB, codes.lowercaseL, codes.lowercaseE];
-    /** Build a state chain that matches a sequence of character codes. */
-    function matchChars(chars, onMatch, onFail) {
-        if (chars.length === 0)
-            return onMatch;
-        return ((code) => {
-            if (code === chars[0]) {
-                effects.consume(code);
-                return matchChars(chars.slice(1), onMatch, onFail);
-            }
-            return onFail(code);
-        });
-    }
-    return start;
-    function start(code) {
-        if (code !== codes.lessThan)
-            return nok(code);
-        effects.enter('jsxTable');
-        effects.enter('jsxTableData');
-        effects.consume(code);
-        return afterLessThan;
-    }
-    function afterLessThan(code) {
-        if (code === codes.uppercaseT || code === codes.lowercaseT) {
-            effects.consume(code);
-            return matchChars(ABLE_SUFFIX, afterTagName, nok);
-        }
-        return nok(code);
-    }
-    function afterTagName(code) {
-        if (code === codes.greaterThan || code === codes.slash || code === codes.space || code === codes.horizontalTab) {
-            effects.consume(code);
-            return body;
-        }
-        return nok(code);
-    }
-    function body(code) {
-        // Reject unclosed <Table> so it falls back to normal HTML block parsing
-        // instead of swallowing all subsequent content to EOF
-        if (code === null) {
-            return nok(code);
-        }
-        if (markdownLineEnding(code)) {
-            effects.exit('jsxTableData');
-            return continuationStart(code);
-        }
-        if (code === codes.backslash) {
-            effects.consume(code);
-            return escapedChar;
-        }
-        if (code === codes.lessThan) {
-            effects.consume(code);
-            return closeSlash;
-        }
-        // Skip over backtick code spans so `</Table>` in inline code isn't
-        // treated as the closing tag
-        if (code === codes.graveAccent) {
-            codeSpanOpenSize = 0;
-            return countOpenTicks(code);
-        }
-        effects.consume(code);
-        return body;
-    }
-    function countOpenTicks(code) {
-        if (code === codes.graveAccent) {
-            codeSpanOpenSize += 1;
-            effects.consume(code);
-            return countOpenTicks;
-        }
-        return inCodeSpan(code);
-    }
-    function inCodeSpan(code) {
-        if (code === null || markdownLineEnding(code))
-            return body(code);
-        if (code === codes.graveAccent) {
-            codeSpanCloseSize = 0;
-            return countCloseTicks(code);
-        }
-        effects.consume(code);
-        return inCodeSpan;
-    }
-    function countCloseTicks(code) {
-        if (code === codes.graveAccent) {
-            codeSpanCloseSize += 1;
-            effects.consume(code);
-            return countCloseTicks;
-        }
-        return codeSpanCloseSize === codeSpanOpenSize ? body(code) : inCodeSpan(code);
-    }
-    function escapedChar(code) {
-        if (code === null || markdownLineEnding(code)) {
-            return body(code);
-        }
-        effects.consume(code);
-        return body;
-    }
-    function closeSlash(code) {
-        if (code === codes.slash) {
-            effects.consume(code);
-            return closeTagFirstChar;
-        }
-        if (code === codes.uppercaseT || code === codes.lowercaseT) {
-            effects.consume(code);
-            return matchChars(ABLE_SUFFIX, openAfterTagName, body);
-        }
-        return body(code);
-    }
-    function closeTagFirstChar(code) {
-        if (code === codes.uppercaseT || code === codes.lowercaseT) {
-            effects.consume(code);
-            return matchChars(ABLE_SUFFIX, closeGt, body);
-        }
-        return body(code);
-    }
-    function openAfterTagName(code) {
-        if (code === codes.greaterThan || code === codes.slash || code === codes.space || code === codes.horizontalTab) {
-            depth += 1;
-            effects.consume(code);
-            return body;
-        }
-        return body(code);
-    }
-    function closeGt(code) {
-        if (code === codes.greaterThan) {
-            depth -= 1;
-            effects.consume(code);
-            if (depth === 0) {
-                return afterClose;
-            }
-            return body;
-        }
-        return body(code);
-    }
-    function afterClose(code) {
-        if (code === null || markdownLineEnding(code)) {
-            effects.exit('jsxTableData');
-            effects.exit('jsxTable');
-            return ok(code);
-        }
-        effects.consume(code);
-        return afterClose;
-    }
-    // Line ending handling — follows the htmlFlow pattern
-    function continuationStart(code) {
-        return effects.check(jsx_table_syntax_nonLazyContinuationStart, continuationStartNonLazy, continuationAfter)(code);
-    }
-    function continuationStartNonLazy(code) {
-        effects.enter(types_types.lineEnding);
-        effects.consume(code);
-        effects.exit(types_types.lineEnding);
-        return continuationBefore;
-    }
-    function continuationBefore(code) {
-        if (code === null || markdownLineEnding(code)) {
-            return continuationStart(code);
-        }
-        effects.enter('jsxTableData');
-        return body(code);
-    }
-    function continuationAfter(code) {
-        // At EOF without </Table>, reject so content isn't swallowed
-        if (code === null) {
-            return nok(code);
-        }
-        effects.exit('jsxTable');
-        return ok(code);
-    }
-}
-function jsx_table_syntax_tokenizeNonLazyContinuationStart(effects, ok, nok) {
-    // eslint-disable-next-line @typescript-eslint/no-this-alias
-    const self = this;
-    return start;
-    function start(code) {
-        if (markdownLineEnding(code)) {
-            effects.enter(types_types.lineEnding);
-            effects.consume(code);
-            effects.exit(types_types.lineEnding);
-            return after;
-        }
-        return nok(code);
-    }
-    function after(code) {
-        if (self.parser.lazy[self.now().line]) {
-            return nok(code);
-        }
-        return ok(code);
-    }
-}
-/**
- * Micromark extension that tokenizes `<Table>...</Table>` and `<table>...</table>`
- * as a single flow block.
- *
- * Prevents CommonMark HTML block type 6 from fragmenting table blocks at blank lines.
- */
-function jsxTable() {
-    return {
-        flow: {
-            [codes.lessThan]: [jsxTableConstruct],
-        },
-    };
-}
-
-;// ./lib/micromark/jsx-table/index.ts
-
-
 ;// ./lib/micromark/mdx-expression-lenient/syntax.ts
 
 
@@ -106113,6 +106561,9 @@ function loadComponents() {
 
 
 
+
+
+
 
 
 
@@ -106127,15 +106578,19 @@ const defaultTransformers = [
  * CommonMark/remark limitations and reach parity with legacy (rdmd) rendering.
  *
  * Runs a series of string-level transformations before micromark/remark parsing:
- * 1. Normalize malformed table separator syntax (e.g., `|: ---` → `| :---`)
- * 2. Terminate HTML flow blocks so subsequent content isn't swallowed
- * 3. Close invalid "self-closing" HTML tags (e.g., `<i />` → `<i></i>`)
- * 4. Normalize compact ATX headings (e.g., `#Heading` → `# Heading`)
- * 5. Replace snake_case component names with parser-safe placeholders
+ * 1. Canonicalize closing tags with stray whitespace (e.g., `</ td >` → `</td>`)
+ * 2. Normalize malformed table separator syntax (e.g., `|: ---` → `| :---`)
+ * 3. Terminate HTML flow blocks so subsequent content isn't swallowed
+ * 4. Close invalid "self-closing" HTML tags (e.g., `<i />` → `<i></i>`)
+ * 5. Normalize compact ATX headings (e.g., `#Heading` → `# Heading`)
+ * 6. Replace snake_case component names with parser-safe placeholders
  */
 function preprocessContent(content, opts) {
     const { knownComponents } = opts;
-    let result = normalizeTableSeparator(content);
+    // Runs first so `jsxTable` sees a literal `</table>` (and the HTML-line
+    // classification in `terminateHtmlFlowBlocks` is accurate)
+    let result = normalizeClosingTagWhitespace(content);
+    result = normalizeTableSeparator(result);
     result = terminateHtmlFlowBlocks(result);
     result = closeSelfClosingHtmlTags(result);
     result = normalizeCompactHeadings(result);
@@ -106164,6 +106619,7 @@ function mdxishAstProcessor(mdContent, opts = {}) {
         syntax_gemoji(),
         legacyVariable(),
         looseHtmlEntity(),
+        htmlBlockComponent(),
     ];
     const fromMarkdownExts = [
         jsxTableFromMarkdown(),
@@ -106173,6 +106629,7 @@ function mdxishAstProcessor(mdContent, opts = {}) {
         legacyVariableFromMarkdown(),
         emptyTaskListItemFromMarkdown(),
         looseHtmlEntityFromMarkdown(),
+        htmlBlockComponentFromMarkdown(),
     ];
     if (!safeMode) {
         // Insert mdx expression (text-only, no flow) after gemoji at index 3
@@ -106186,6 +106643,10 @@ function mdxishAstProcessor(mdContent, opts = {}) {
         // JSX comment tokenizer must come before magicBlock so it claims `{/* ... */}` first
         micromarkExts.unshift(jsxComment());
     }
+    // Claim `<HTMLBlock>` as one opaque token so broad tokenizers can't fragment its body
+    // We put this last as micromark tries the last-registered extension first, so push (not unshift) to win the `<` race.
+    // micromarkExts.push(htmlBlockComponent());
+    // fromMarkdownExts.push(htmlBlockComponentFromMarkdown());
     const processor = unified()
         .data('micromarkExtensions', micromarkExts)
         .data('fromMarkdownExtensions', fromMarkdownExts)
@@ -106785,332 +107246,6 @@ const mdxishTags_tags = (doc) => {
 };
 /* harmony default export */ const mdxishTags = (mdxishTags_tags);
 
-;// ./lib/mdast-util/html-block-component/index.ts
-const html_block_component_contextMap = new WeakMap();
-function findHtmlBlockComponentToken() {
-    const events = this.tokenStack;
-    for (let i = events.length - 1; i >= 0; i -= 1) {
-        if (events[i][0].type === 'htmlBlockComponent')
-            return events[i][0];
-    }
-    return undefined;
-}
-function enterHtmlBlockComponent(token) {
-    html_block_component_contextMap.set(token, { chunks: [], lastEndLine: token.start.line });
-    this.enter({ type: 'html', value: '' }, token);
-}
-function exitHtmlBlockComponentData(token) {
-    const componentToken = findHtmlBlockComponentToken.call(this);
-    if (!componentToken)
-        return;
-    const ctx = html_block_component_contextMap.get(componentToken);
-    if (ctx) {
-        const gap = token.start.line - ctx.lastEndLine;
-        if (ctx.chunks.length > 0 && gap > 0) {
-            ctx.chunks.push('\n'.repeat(gap));
-        }
-        ctx.chunks.push(this.sliceSerialize(token));
-        ctx.lastEndLine = token.end.line;
-    }
-}
-function exitHtmlBlockComponent(token) {
-    const ctx = html_block_component_contextMap.get(token);
-    const node = this.stack[this.stack.length - 1];
-    if (ctx) {
-        node.value = ctx.chunks.join('');
-        html_block_component_contextMap.delete(token);
-    }
-    this.exit(token);
-}
-function htmlBlockComponentFromMarkdown() {
-    return {
-        enter: {
-            htmlBlockComponent: enterHtmlBlockComponent,
-        },
-        exit: {
-            htmlBlockComponentData: exitHtmlBlockComponentData,
-            htmlBlockComponent: exitHtmlBlockComponent,
-        },
-    };
-}
-
-;// ./lib/micromark/html-block-component/syntax.ts
-
-
-const TAG_SUFFIX = [
-    codes.uppercaseT,
-    codes.uppercaseM,
-    codes.uppercaseL,
-    codes.uppercaseB,
-    codes.lowercaseL,
-    codes.lowercaseO,
-    codes.lowercaseC,
-    codes.lowercaseK,
-];
-// ---------------------------------------------------------------------------
-// Shared tokenizer factory
-// ---------------------------------------------------------------------------
-/**
- * Creates a tokenize function for `<HTMLBlock>...</HTMLBlock>`.
- *
- * - **flow** (block-level): supports multiline content via line continuations,
- *   consumes trailing whitespace after the closing tag.
- * - **text** (inline): single-line only, exits immediately after the closing tag.
- */
-function syntax_createTokenize(mode) {
-    return function tokenize(effects, ok, nok) {
-        let depth = 1;
-        function matchChars(chars, onMatch, onFail) {
-            if (chars.length === 0)
-                return onMatch;
-            const next = (code) => {
-                if (code === chars[0]) {
-                    effects.consume(code);
-                    return matchChars(chars.slice(1), onMatch, onFail);
-                }
-                return onFail(code);
-            };
-            return next;
-        }
-        function matchTagName(onMatch, onFail) {
-            const next = (code) => {
-                if (code === codes.uppercaseH) {
-                    effects.consume(code);
-                    return matchChars(TAG_SUFFIX, onMatch, onFail);
-                }
-                return onFail(code);
-            };
-            return next;
-        }
-        return start;
-        function start(code) {
-            if (code !== codes.lessThan)
-                return nok(code);
-            effects.enter('htmlBlockComponent');
-            effects.enter('htmlBlockComponentData');
-            effects.consume(code);
-            return matchTagName(afterTagName, nok);
-        }
-        function afterTagName(code) {
-            if (code === codes.greaterThan) {
-                effects.consume(code);
-                return body;
-            }
-            if (code === codes.space || code === codes.horizontalTab) {
-                effects.consume(code);
-                return inAttributes;
-            }
-            if (mode === 'flow' && markdownLineEnding(code)) {
-                effects.exit('htmlBlockComponentData');
-                return attributeContinuationStart(code);
-            }
-            if (code === codes.slash) {
-                effects.consume(code);
-                return selfClose;
-            }
-            return nok(code);
-        }
-        function inAttributes(code) {
-            if (code === codes.greaterThan) {
-                effects.consume(code);
-                return body;
-            }
-            if (code === null) {
-                return nok(code);
-            }
-            if (markdownLineEnding(code)) {
-                if (mode === 'text')
-                    return nok(code);
-                effects.exit('htmlBlockComponentData');
-                return attributeContinuationStart(code);
-            }
-            effects.consume(code);
-            return inAttributes;
-        }
-        function attributeContinuationStart(code) {
-            return effects.check(html_block_component_syntax_nonLazyContinuationStart, attributeContinuationNonLazy, continuationAfter)(code);
-        }
-        function attributeContinuationNonLazy(code) {
-            effects.enter(types_types.lineEnding);
-            effects.consume(code);
-            effects.exit(types_types.lineEnding);
-            return attributeContinuationBefore;
-        }
-        function attributeContinuationBefore(code) {
-            if (code === null || markdownLineEnding(code)) {
-                return attributeContinuationStart(code);
-            }
-            effects.enter('htmlBlockComponentData');
-            return inAttributes(code);
-        }
-        function selfClose(code) {
-            if (code === codes.greaterThan) {
-                effects.consume(code);
-                return mode === 'flow' ? afterClose : done(code);
-            }
-            return nok(code);
-        }
-        function body(code) {
-            if (code === null)
-                return nok(code);
-            if (markdownLineEnding(code)) {
-                if (mode === 'text') {
-                    // Text constructs operate on paragraph content which spans lines
-                    effects.consume(code);
-                    return body;
-                }
-                effects.exit('htmlBlockComponentData');
-                return continuationStart(code);
-            }
-            if (code === codes.lessThan) {
-                effects.consume(code);
-                return closeSlash;
-            }
-            effects.consume(code);
-            return body;
-        }
-        function closeSlash(code) {
-            if (code === codes.slash) {
-                effects.consume(code);
-                return matchTagName(closeGt, body);
-            }
-            return matchTagName(openAfterTagName, body)(code);
-        }
-        function openAfterTagName(code) {
-            if (code === codes.greaterThan || code === codes.space || code === codes.horizontalTab) {
-                depth += 1;
-                effects.consume(code);
-                return body;
-            }
-            return body(code);
-        }
-        function closeGt(code) {
-            if (code === codes.greaterThan) {
-                depth -= 1;
-                effects.consume(code);
-                if (depth === 0) {
-                    return mode === 'flow' ? afterClose : done(code);
-                }
-                return body;
-            }
-            return body(code);
-        }
-        // -- flow-only states ---------------------------------------------------
-        function afterClose(code) {
-            if (code === null || markdownLineEnding(code)) {
-                return done(code);
-            }
-            if (code === codes.space || code === codes.horizontalTab) {
-                effects.consume(code);
-                return afterClose;
-            }
-            // Reject so the block re-parses as a paragraph, deferring to the
-            // text tokenizer which preserves trailing content in the same line.
-            return nok(code);
-        }
-        // -- flow-only: line continuation ---------------------------------------
-        function continuationStart(code) {
-            return effects.check(html_block_component_syntax_nonLazyContinuationStart, continuationStartNonLazy, continuationAfter)(code);
-        }
-        function continuationStartNonLazy(code) {
-            effects.enter(types_types.lineEnding);
-            effects.consume(code);
-            effects.exit(types_types.lineEnding);
-            return continuationBefore;
-        }
-        function continuationBefore(code) {
-            if (code === null || markdownLineEnding(code)) {
-                return continuationStart(code);
-            }
-            effects.enter('htmlBlockComponentData');
-            return body(code);
-        }
-        function continuationAfter(code) {
-            if (code === null)
-                return nok(code);
-            effects.exit('htmlBlockComponent');
-            return ok(code);
-        }
-        // -- shared exit --------------------------------------------------------
-        function done(_code) {
-            effects.exit('htmlBlockComponentData');
-            effects.exit('htmlBlockComponent');
-            return ok(_code);
-        }
-    };
-}
-// ---------------------------------------------------------------------------
-// Flow construct (block-level)
-// ---------------------------------------------------------------------------
-const html_block_component_syntax_nonLazyContinuationStart = {
-    tokenize: html_block_component_syntax_tokenizeNonLazyContinuationStart,
-    partial: true,
-};
-function resolveToHtmlBlockComponent(events) {
-    let index = events.length;
-    while (index > 0) {
-        index -= 1;
-        if (events[index][0] === 'enter' && events[index][1].type === 'htmlBlockComponent') {
-            break;
-        }
-    }
-    if (index > 1 && events[index - 2][1].type === types_types.linePrefix) {
-        events[index][1].start = events[index - 2][1].start;
-        events[index + 1][1].start = events[index - 2][1].start;
-        events.splice(index - 2, 2);
-    }
-    return events;
-}
-const htmlBlockComponentFlowConstruct = {
-    name: 'htmlBlockComponent',
-    tokenize: syntax_createTokenize('flow'),
-    resolveTo: resolveToHtmlBlockComponent,
-    concrete: true,
-};
-function html_block_component_syntax_tokenizeNonLazyContinuationStart(effects, ok, nok) {
-    // eslint-disable-next-line @typescript-eslint/no-this-alias
-    const self = this;
-    return start;
-    function start(code) {
-        if (markdownLineEnding(code)) {
-            effects.enter(types_types.lineEnding);
-            effects.consume(code);
-            effects.exit(types_types.lineEnding);
-            return after;
-        }
-        return nok(code);
-    }
-    function after(code) {
-        if (self.parser.lazy[self.now().line]) {
-            return nok(code);
-        }
-        return ok(code);
-    }
-}
-// ---------------------------------------------------------------------------
-// Text construct (inline)
-// ---------------------------------------------------------------------------
-const htmlBlockComponentTextConstruct = {
-    name: 'htmlBlockComponent',
-    tokenize: syntax_createTokenize('text'),
-};
-// ---------------------------------------------------------------------------
-// Extension
-// ---------------------------------------------------------------------------
-function htmlBlockComponent() {
-    return {
-        flow: {
-            [codes.lessThan]: [htmlBlockComponentFlowConstruct],
-        },
-        text: {
-            [codes.lessThan]: [htmlBlockComponentTextConstruct],
-        },
-    };
-}
-
-;// ./lib/micromark/html-block-component/index.ts
-
-
 ;// ./lib/utils/extractMagicBlocks.ts
 /**
  * The content matching in this regex captures everything between `[block:TYPE]`