@readme/markdown 13.7.2 → 13.7.4

package/dist/main.js

@@ -11704,10 +11704,47 @@ var dist_utils_default = /*#__PURE__*/__webpack_require__.n(dist_utils);
 
 let mermaid;
 const { uppercase } = (dist_utils_default());
+// Module-level queue that batches mermaid nodes across all CodeTabs instances into a
+// single mermaid.run() call. This is necessary because mermaid generates SVG element IDs
+// using Date.now(), which collides when multiple diagrams render in the same millisecond.
+// Colliding IDs cause diagrams to overlap or break layout.
+//
+// Why not use `deterministicIDSeed` with a unique ID per diagram? Mermaid's implementation
+// only uses seed.length (not the seed value) to compute the starting ID, so every UUID
+// (36 chars) produces the same `mermaid-36` prefix — the collision remains.
+// See: https://github.com/mermaid-js/mermaid/blob/mermaid%4011.12.0/packages/mermaid/src/utils.ts#L755-L761
+//
+// These vars must be module-scoped (not per-instance refs) because the batching requires
+// cross-instance coordination. They are short-lived: the queue drains on the next macrotask
+// and cleanup clears everything on unmount.
+let mermaidQueue = [];
+let mermaidFlushTimer = null;
+let currentTheme;
+function queueMermaidNode(node, theme) {
+    mermaidQueue.push(node);
+    currentTheme = theme;
+    if (!mermaidFlushTimer) {
+        // setTimeout(0) defers to a macrotask, after all useEffects have queued their nodes
+        mermaidFlushTimer = setTimeout(async () => {
+            const nodes = [...mermaidQueue];
+            mermaidQueue = [];
+            mermaidFlushTimer = null;
+            const module = await Promise.resolve(/* import() */).then(__webpack_require__.t.bind(__webpack_require__, 1387, 23));
+            mermaid = module.default;
+            mermaid.initialize({
+                startOnLoad: false,
+                theme: currentTheme === 'dark' ? 'dark' : 'default',
+                deterministicIds: true,
+            });
+            await mermaid.run({ nodes });
+        }, 0);
+    }
+}
 const CodeTabs = (props) => {
     const { children } = props;
     const theme = (0,external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_.useContext)(Theme);
     const isHydrated = useHydrated();
+    const mermaidRef = (0,external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_.useRef)(null);
     // Handle both array (from rehype-react in rendering mdxish) and single element (MDX/JSX runtime) cases
     // The children here is the individual code block objects
     const childrenArray = Array.isArray(children) ? children : [children];
@@ -11718,22 +11755,20 @@ const CodeTabs = (props) => {
         return Array.isArray(pre?.props?.children) ? pre.props.children[0] : pre?.props?.children;
     };
     const containAtLeastOneMermaid = childrenArray.some(pre => getCodeComponent(pre)?.props?.lang === 'mermaid');
-    // Render Mermaid diagram
     (0,external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_.useEffect)(() => {
-        // Ensure we only render mermaids when frontend is hydrated to avoid hydration errors
-        // because mermaid mutates the DOM before react hydrates
-        if (typeof window !== 'undefined' && containAtLeastOneMermaid && isHydrated) {
-            Promise.resolve(/* import() */).then(__webpack_require__.t.bind(__webpack_require__, 1387, 23)).then(module => {
-                mermaid = module.default;
-                mermaid.initialize({
-                    startOnLoad: false,
-                    theme: theme === 'dark' ? 'dark' : 'default',
-                });
-                mermaid.run({
-                    nodes: document.querySelectorAll('.mermaid-render'),
-                });
-            });
-        }
+        // Wait for hydration so mermaid's DOM mutations don't cause mismatches
+        if (typeof window !== 'undefined' && containAtLeastOneMermaid && isHydrated && mermaidRef.current) {
+            queueMermaidNode(mermaidRef.current, theme);
+        }
+        return () => {
+            // Clear the batch timer on unmount to prevent mermaid from running
+            // after the DOM is torn down
+            if (mermaidFlushTimer) {
+                clearTimeout(mermaidFlushTimer);
+                mermaidFlushTimer = null;
+                mermaidQueue = [];
+            }
+        };
     }, [containAtLeastOneMermaid, theme, isHydrated]);
     function handleClick({ target }, index) {
         const $wrap = target.parentElement.parentElement;
@@ -11749,15 +11784,13 @@ const CodeTabs = (props) => {
         const codeComponent = getCodeComponent(childrenArray[0]);
         if (codeComponent?.props?.lang === 'mermaid') {
             const value = codeComponent?.props?.value;
-            return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("pre", { className: "mermaid-render mermaid_single" }, value);
+            return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("pre", { ref: mermaidRef, className: "mermaid-render mermaid_single" }, value));
         }
     }
     return (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("div", { className: `CodeTabs CodeTabs_initial theme-${theme}` },
         external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("div", { className: "CodeTabs-toolbar" }, childrenArray.map((pre, i) => {
             // the first or only child should be our Code component
-            const tabCodeComponent = Array.isArray(pre.props?.children)
-                ? pre.props.children[0]
-                : pre.props?.children;
+            const tabCodeComponent = Array.isArray(pre.props?.children) ? pre.props.children[0] : pre.props?.children;
             const lang = tabCodeComponent?.props?.lang;
             const meta = tabCodeComponent?.props?.meta;
             /* istanbul ignore next */
@@ -11840,6 +11873,8 @@ const GlossaryContext = (0,external_amd_react_commonjs_react_commonjs2_react_roo
 
 const Glossary = ({ children, term: termProp, terms }) => {
     const term = (Array.isArray(children) ? children[0] : children) || termProp;
+    if (!term)
+        return null;
     const foundTerm = terms.find(i => term.toLowerCase() === i?.term?.toLowerCase());
     if (!foundTerm)
         return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("span", null, term);
@@ -12309,19 +12344,10 @@ const TailwindStyle = ({ children, darkModeDataAttribute }) => {
             records.forEach(record => {
                 if (record.type === 'childList') {
                     record.addedNodes.forEach(node => {
-                        if (!(node instanceof HTMLElement))
+                        if (!(node instanceof HTMLElement) || !node.classList.contains(tailwindPrefix))
                             return;
-                        // Check the added node itself
-                        if (node.classList.contains(tailwindPrefix)) {
-                            traverse(node, addClasses);
-                            shouldUpdate = true;
-                        }
-                        // Also check descendants — React may insert a parent node
-                        // whose children contain TailwindRoot elements
-                        node.querySelectorAll(`.${tailwindPrefix}`).forEach(child => {
-                            traverse(child, addClasses);
-                            shouldUpdate = true;
-                        });
+                        traverse(node, addClasses);
+                        shouldUpdate = true;
                     });
                 }
                 else if (record.type === 'attributes') {
@@ -12330,10 +12356,10 @@ const TailwindStyle = ({ children, darkModeDataAttribute }) => {
                     addClasses(record.target);
                     shouldUpdate = true;
                 }
-                if (shouldUpdate) {
-                    setClasses(Array.from(classesSet.current));
-                }
             });
+            if (shouldUpdate) {
+                setClasses(Array.from(classesSet.current));
+            }
         });
         observer.observe(ref.current.parentElement, {
             subtree: true,
@@ -52956,6 +52982,10 @@ const plain = (node, opts = {}) => {
 };
 /* harmony default export */ const lib_plain = (plain);
 
+;// ./processor/compile/gemoji.ts
+const gemoji = (node) => `:${node.name}:`;
+/* harmony default export */ const compile_gemoji = (gemoji);
+
 ;// ./processor/compile/variable.ts
 const variable = (node) => `{user.${node.data?.hProperties?.name || ''}}`;
 /* harmony default export */ const compile_variable = (variable);
@@ -53006,6 +53036,7 @@ const extractText = (node) => {
 
 
 
+
 const titleParser = unified().use(remarkParse).use(remarkGfm);
 // The title paragraph may contain custom AST nodes that `toMarkdown` doesn't
 // natively understand
@@ -53013,8 +53044,8 @@ const toMarkdownExtensions = [
     gfmToMarkdown(),
     // For mdx variable syntaxes (e.g., {user.name})
     mdxExpressionToMarkdown(),
-    // Important: This is required and would crash the parser if there's no variable node handler
-    { handlers: { [NodeTypes.variable]: compile_variable } },
+    // Important: This is required and would crash the parser if there's no variable and gemoji node handler
+    { handlers: { [NodeTypes.variable]: compile_variable, [NodeTypes.emoji]: compile_gemoji } },
 ];
 const callouts_regex = `^(${emoji_regex().source}|⚠)(\\s+|$)`;
 const findFirst = (node) => {
@@ -53409,7 +53440,7 @@ const embedTransformer = () => {
  *
  * @type {Array<Gemoji>}
  */
-const gemoji = [
+const gemoji_gemoji = [
   {
     emoji: '😀',
     names: ['grinning'],
@@ -70352,7 +70383,7 @@ class Owlmoji {
         return null;
     };
     static nameToEmoji = nameToEmoji;
-    static owlmoji = gemoji.concat(owlmoji);
+    static owlmoji = gemoji_gemoji.concat(owlmoji);
 }
 
 ;// ./processor/transform/gemoji+.ts
@@ -71262,6 +71293,316 @@ const mdxToHast = () => tree => {
 };
 /* harmony default export */ const mdx_to_hast = (mdxToHast);
 
+;// ./lib/mdast-util/gemoji/index.ts
+
+
+function exitGemoji(token) {
+    const name = this.sliceSerialize(token).slice(1, -1); // strip surrounding colons
+    switch (Owlmoji.kind(name)) {
+        case 'gemoji': {
+            this.enter({ type: NodeTypes.emoji, value: Owlmoji.nameToEmoji[name], name }, token);
+            this.exit(token);
+            break;
+        }
+        case 'fontawesome': {
+            this.enter({
+                type: NodeTypes.i,
+                value: name,
+                data: { hName: 'i', hProperties: { className: ['fa-regular', name] } },
+            }, token);
+            this.exit(token);
+            break;
+        }
+        case 'owlmoji': {
+            this.enter({
+                type: NodeTypes.emoji,
+                value: `:${name}:`,
+                name,
+                data: {
+                    hName: 'img',
+                    hProperties: {
+                        src: `/public/img/emojis/${name}.png`,
+                        alt: `:${name}:`,
+                        title: `:${name}:`,
+                        className: 'emoji',
+                        align: 'absmiddle',
+                        height: '20',
+                        width: '20',
+                    },
+                },
+            }, token);
+            this.exit(token);
+            break;
+        }
+        default: {
+            // Unknown shortcode, emit as literal text `:name:`
+            this.enter({ type: 'text', value: `:${name}:` }, token);
+            this.exit(token);
+            break;
+        }
+    }
+}
+function gemojiFromMarkdown() {
+    return {
+        exit: {
+            gemoji: exitGemoji,
+        },
+    };
+}
+
+;// ./node_modules/micromark-util-symbol/lib/codes.js
+/**
+ * Character codes.
+ *
+ * This module is compiled away!
+ *
+ * micromark works based on character codes.
+ * This module contains constants for the ASCII block and the replacement
+ * character.
+ * A couple of them are handled in a special way, such as the line endings
+ * (CR, LF, and CR+LF, commonly known as end-of-line: EOLs), the tab (horizontal
+ * tab) and its expansion based on what column it’s at (virtual space),
+ * and the end-of-file (eof) character.
+ * As values are preprocessed before handling them, the actual characters LF,
+ * CR, HT, and NUL (which is present as the replacement character), are
+ * guaranteed to not exist.
+ *
+ * Unicode basic latin block.
+ */
+const codes = /** @type {const} */ ({
+  carriageReturn: -5,
+  lineFeed: -4,
+  carriageReturnLineFeed: -3,
+  horizontalTab: -2,
+  virtualSpace: -1,
+  eof: null,
+  nul: 0,
+  soh: 1,
+  stx: 2,
+  etx: 3,
+  eot: 4,
+  enq: 5,
+  ack: 6,
+  bel: 7,
+  bs: 8,
+  ht: 9, // `\t`
+  lf: 10, // `\n`
+  vt: 11, // `\v`
+  ff: 12, // `\f`
+  cr: 13, // `\r`
+  so: 14,
+  si: 15,
+  dle: 16,
+  dc1: 17,
+  dc2: 18,
+  dc3: 19,
+  dc4: 20,
+  nak: 21,
+  syn: 22,
+  etb: 23,
+  can: 24,
+  em: 25,
+  sub: 26,
+  esc: 27,
+  fs: 28,
+  gs: 29,
+  rs: 30,
+  us: 31,
+  space: 32,
+  exclamationMark: 33, // `!`
+  quotationMark: 34, // `"`
+  numberSign: 35, // `#`
+  dollarSign: 36, // `$`
+  percentSign: 37, // `%`
+  ampersand: 38, // `&`
+  apostrophe: 39, // `'`
+  leftParenthesis: 40, // `(`
+  rightParenthesis: 41, // `)`
+  asterisk: 42, // `*`
+  plusSign: 43, // `+`
+  comma: 44, // `,`
+  dash: 45, // `-`
+  dot: 46, // `.`
+  slash: 47, // `/`
+  digit0: 48, // `0`
+  digit1: 49, // `1`
+  digit2: 50, // `2`
+  digit3: 51, // `3`
+  digit4: 52, // `4`
+  digit5: 53, // `5`
+  digit6: 54, // `6`
+  digit7: 55, // `7`
+  digit8: 56, // `8`
+  digit9: 57, // `9`
+  colon: 58, // `:`
+  semicolon: 59, // `;`
+  lessThan: 60, // `<`
+  equalsTo: 61, // `=`
+  greaterThan: 62, // `>`
+  questionMark: 63, // `?`
+  atSign: 64, // `@`
+  uppercaseA: 65, // `A`
+  uppercaseB: 66, // `B`
+  uppercaseC: 67, // `C`
+  uppercaseD: 68, // `D`
+  uppercaseE: 69, // `E`
+  uppercaseF: 70, // `F`
+  uppercaseG: 71, // `G`
+  uppercaseH: 72, // `H`
+  uppercaseI: 73, // `I`
+  uppercaseJ: 74, // `J`
+  uppercaseK: 75, // `K`
+  uppercaseL: 76, // `L`
+  uppercaseM: 77, // `M`
+  uppercaseN: 78, // `N`
+  uppercaseO: 79, // `O`
+  uppercaseP: 80, // `P`
+  uppercaseQ: 81, // `Q`
+  uppercaseR: 82, // `R`
+  uppercaseS: 83, // `S`
+  uppercaseT: 84, // `T`
+  uppercaseU: 85, // `U`
+  uppercaseV: 86, // `V`
+  uppercaseW: 87, // `W`
+  uppercaseX: 88, // `X`
+  uppercaseY: 89, // `Y`
+  uppercaseZ: 90, // `Z`
+  leftSquareBracket: 91, // `[`
+  backslash: 92, // `\`
+  rightSquareBracket: 93, // `]`
+  caret: 94, // `^`
+  underscore: 95, // `_`
+  graveAccent: 96, // `` ` ``
+  lowercaseA: 97, // `a`
+  lowercaseB: 98, // `b`
+  lowercaseC: 99, // `c`
+  lowercaseD: 100, // `d`
+  lowercaseE: 101, // `e`
+  lowercaseF: 102, // `f`
+  lowercaseG: 103, // `g`
+  lowercaseH: 104, // `h`
+  lowercaseI: 105, // `i`
+  lowercaseJ: 106, // `j`
+  lowercaseK: 107, // `k`
+  lowercaseL: 108, // `l`
+  lowercaseM: 109, // `m`
+  lowercaseN: 110, // `n`
+  lowercaseO: 111, // `o`
+  lowercaseP: 112, // `p`
+  lowercaseQ: 113, // `q`
+  lowercaseR: 114, // `r`
+  lowercaseS: 115, // `s`
+  lowercaseT: 116, // `t`
+  lowercaseU: 117, // `u`
+  lowercaseV: 118, // `v`
+  lowercaseW: 119, // `w`
+  lowercaseX: 120, // `x`
+  lowercaseY: 121, // `y`
+  lowercaseZ: 122, // `z`
+  leftCurlyBrace: 123, // `{`
+  verticalBar: 124, // `|`
+  rightCurlyBrace: 125, // `}`
+  tilde: 126, // `~`
+  del: 127,
+  // Unicode Specials block.
+  byteOrderMarker: 65_279,
+  // Unicode Specials block.
+  replacementCharacter: 65_533 // `�`
+})
+
+;// ./lib/micromark/gemoji/syntax.ts
+
+// Matches the name pattern from the original regex: \+1 or [-\w]+
+// see https://github.com/readmeio/markdown/blob/489a71e19b34f640595ce81e988dad631045186f/processor/transform/gemoji%2B.ts#L9
+function isNameChar(code) {
+    if (code === null)
+        return false;
+    return ((code >= codes.lowercaseA && code <= codes.lowercaseZ) ||
+        (code >= codes.uppercaseA && code <= codes.uppercaseZ) ||
+        (code >= codes.digit0 && code <= codes.digit9) ||
+        code === codes.dash ||
+        code === codes.underscore);
+}
+const gemojiConstruct = {
+    name: 'gemoji',
+    tokenize,
+};
+function tokenize(effects, ok, nok) {
+    let hasName = false;
+    // Entry point — expect opening `:`
+    const start = (code) => {
+        if (code !== codes.colon)
+            return nok(code);
+        effects.enter('gemoji');
+        effects.enter('gemojiMarker');
+        effects.consume(code); // :
+        effects.exit('gemojiMarker');
+        effects.enter('gemojiName');
+        return nameStart;
+    };
+    // First char after `:`, branch on `+` for :+1:, otherwise start normal name
+    const nameStart = (code) => {
+        if (code === codes.plusSign) {
+            effects.consume(code); // +
+            return plusOne;
+        }
+        if (isNameChar(code)) {
+            hasName = true;
+            effects.consume(code);
+            return name;
+        }
+        // Not a valid shortcode start (e.g. `::`, `: `, `:<`)
+        return nok(code);
+    };
+    // After `+`, only `1` is valid (for :+1:), anything else rejects
+    // this is a special case for :+1: 👍 since + isnt a normal name character
+    const plusOne = (code) => {
+        if (code === codes.digit1) {
+            hasName = true;
+            effects.consume(code); // 1
+            return nameEnd;
+        }
+        return nok(code);
+    };
+    // Consume name characters until we hit closing `:` or an invalid char
+    const name = (code) => {
+        if (code === codes.colon) {
+            if (!hasName)
+                return nok(code);
+            return nameEnd(code);
+        }
+        if (isNameChar(code)) {
+            effects.consume(code);
+            return name;
+        }
+        // Invalid character in name (space, newline, special char) — reject
+        return nok(code);
+    };
+    // Expect closing `:`
+    const nameEnd = (code) => {
+        if (code !== codes.colon)
+            return nok(code);
+        effects.exit('gemojiName');
+        effects.enter('gemojiMarker');
+        effects.consume(code); // :
+        effects.exit('gemojiMarker');
+        effects.exit('gemoji');
+        return ok;
+    };
+    return start;
+}
+function syntax_gemoji() {
+    return {
+        text: { [codes.colon]: gemojiConstruct },
+    };
+}
+
+;// ./lib/micromark/gemoji/index.ts
+/**
+ * Micromark extension for :emoji: inline syntax.
+ */
+
+
 ;// ./processor/transform/mdxish/normalize-malformed-md-syntax.ts
 
 // Marker patterns for multi-node emphasis detection
@@ -71618,6 +71959,7 @@ const normalizeEmphasisAST = () => (tree) => {
 
 
 
+
 const isTableCell = (node) => isMDXElement(node) && ['th', 'td'].includes(node.name);
 const tableTypes = {
     tr: 'tableRow',
@@ -71625,10 +71967,12 @@ const tableTypes = {
     td: 'tableCell',
 };
 const tableNodeProcessor = unified()
+    .data('micromarkExtensions', [syntax_gemoji()])
+    .data('fromMarkdownExtensions', [gemojiFromMarkdown()])
     .use(remarkParse)
     .use(remarkMdx)
     .use(normalize_malformed_md_syntax)
-    .use([[callouts, { isMdxish: true }], gemoji_, code_tabs])
+    .use([[callouts, { isMdxish: true }], code_tabs])
     .use(remarkGfm);
 /**
  * Check if children are only text nodes that might contain markdown
@@ -72501,7 +72845,6 @@ const mdxishTransformers = [
     [callouts, { isMdxish: true }],
     code_tabs,
     transform_images,
-    gemoji_,
 ];
 /* harmony default export */ const transform = (Object.values(defaultTransforms));
 
@@ -92283,10 +92626,6 @@ const embed_embed = (node) => {
 };
 /* harmony default export */ const compile_embed = (embed_embed);
 
-;// ./processor/compile/gemoji.ts
-const gemoji_gemoji = (node) => `:${node.name}:`;
-/* harmony default export */ const compile_gemoji = (gemoji_gemoji);
-
 ;// ./processor/compile/html-block.ts
 
 const htmlBlock = (node) => {
@@ -94269,6 +94608,86 @@ const mdxComponentHandlers = {
     [NodeTypes.htmlBlock]: htmlBlockHandler,
 };
 
+;// ./processor/transform/mdxish/close-self-closing-html-tags.ts
+
+/**
+ * HTML void elements that are legitimately self-closing per the HTML spec.
+ * These should NOT be transformed.
+ *
+ * @see https://html.spec.whatwg.org/multipage/syntax.html#void-elements
+ */
+const HTML_VOID_ELEMENTS = new Set([
+    'area',
+    'base',
+    'br',
+    'col',
+    'embed',
+    'hr',
+    'img',
+    'input',
+    'link',
+    'meta',
+    'param',
+    'source',
+    'track',
+    'wbr',
+]);
+/**
+ * Matches self-closing HTML tags: `<tagname/>` or `<tagname attr="val" />`
+ *
+ * Captures:
+ *  1 - tag name (lowercase letters, digits, hyphens)
+ *  2 - attributes (everything between tag name and `/>`)
+ *
+ * The attribute portion skips over quoted strings (`"..."` and `'...'`) so that
+ * a `/>` inside an attribute value (e.g. `title="use /> here"`) does not cause
+ * a premature match.
+ *
+ * Only matches lowercase tag names to avoid interfering with PascalCase
+ * JSX custom components (e.g. `<MyComponent />`), which are handled
+ * separately by mdxish-component-blocks.
+ */
+const SELF_CLOSING_TAG_RE = /<([a-z][a-z0-9-]*)((?:\s+(?:[^>"']*(?:"[^"]*"|'[^']*'))*[^>"']*)?)?\s*\/>/g;
+/**
+ * String-level preprocessor that converts self-closing non-void HTML tags
+ * into explicitly closed tags.
+ *
+ * Problem: `rehype-raw` (via parse5) follows the HTML spec where the `/` in
+ * `<i />` is ignored for non-void elements. This causes `<i />` to be parsed
+ * as an opening `<i>` tag, which then wraps all subsequent content.
+ *
+ * Solution: Transform `<i />` → `<i></i>` before parsing, so rehype-raw
+ * sees a properly closed element.
+ *
+ * This preprocessor:
+ * - Skips void elements (`<br />`, `<hr />`, `<img />`, etc.)
+ * - Skips PascalCase tags (custom components handled elsewhere)
+ * - Protects code blocks from transformation
+ *
+ * @example
+ * closeSelfClosingHtmlTags('<i/> text')          // '<i></i> text'
+ * closeSelfClosingHtmlTags('<br />')             // '<br />' (void, untouched)
+ * closeSelfClosingHtmlTags('<MyComp />')         // '<MyComp />' (PascalCase, untouched)
+ * closeSelfClosingHtmlTags('<i class="icon" />') // '<i class="icon"></i>'
+ */
+function closeSelfClosingHtmlTags(content) {
+    const { protectedContent, protectedCode } = protectCodeBlocks(content);
+    const result = protectedContent.replace(SELF_CLOSING_TAG_RE, (match, tagName, attrs) => {
+        // Skip void elements (legitimately self-closing)
+        if (HTML_VOID_ELEMENTS.has(tagName)) {
+            return match;
+        }
+        // Skip tags with hyphens — these are custom elements (web components)
+        // and should not be rewritten (e.g. <my-component />)
+        if (tagName.includes('-')) {
+            return match;
+        }
+        const attributes = attrs?.trim() ? ` ${attrs.trim()}` : '';
+        return `<${tagName}${attributes}></${tagName}>`;
+    });
+    return restoreCodeBlocks(result, protectedCode);
+}
+
 ;// ./processor/transform/mdxish/evaluate-expressions.ts
 
 
@@ -94558,166 +94977,6 @@ function legacyVariableFromMarkdown() {
     };
 }
 
-;// ./node_modules/micromark-util-symbol/lib/codes.js
-/**
- * Character codes.
- *
- * This module is compiled away!
- *
- * micromark works based on character codes.
- * This module contains constants for the ASCII block and the replacement
- * character.
- * A couple of them are handled in a special way, such as the line endings
- * (CR, LF, and CR+LF, commonly known as end-of-line: EOLs), the tab (horizontal
- * tab) and its expansion based on what column it’s at (virtual space),
- * and the end-of-file (eof) character.
- * As values are preprocessed before handling them, the actual characters LF,
- * CR, HT, and NUL (which is present as the replacement character), are
- * guaranteed to not exist.
- *
- * Unicode basic latin block.
- */
-const codes = /** @type {const} */ ({
-  carriageReturn: -5,
-  lineFeed: -4,
-  carriageReturnLineFeed: -3,
-  horizontalTab: -2,
-  virtualSpace: -1,
-  eof: null,
-  nul: 0,
-  soh: 1,
-  stx: 2,
-  etx: 3,
-  eot: 4,
-  enq: 5,
-  ack: 6,
-  bel: 7,
-  bs: 8,
-  ht: 9, // `\t`
-  lf: 10, // `\n`
-  vt: 11, // `\v`
-  ff: 12, // `\f`
-  cr: 13, // `\r`
-  so: 14,
-  si: 15,
-  dle: 16,
-  dc1: 17,
-  dc2: 18,
-  dc3: 19,
-  dc4: 20,
-  nak: 21,
-  syn: 22,
-  etb: 23,
-  can: 24,
-  em: 25,
-  sub: 26,
-  esc: 27,
-  fs: 28,
-  gs: 29,
-  rs: 30,
-  us: 31,
-  space: 32,
-  exclamationMark: 33, // `!`
-  quotationMark: 34, // `"`
-  numberSign: 35, // `#`
-  dollarSign: 36, // `$`
-  percentSign: 37, // `%`
-  ampersand: 38, // `&`
-  apostrophe: 39, // `'`
-  leftParenthesis: 40, // `(`
-  rightParenthesis: 41, // `)`
-  asterisk: 42, // `*`
-  plusSign: 43, // `+`
-  comma: 44, // `,`
-  dash: 45, // `-`
-  dot: 46, // `.`
-  slash: 47, // `/`
-  digit0: 48, // `0`
-  digit1: 49, // `1`
-  digit2: 50, // `2`
-  digit3: 51, // `3`
-  digit4: 52, // `4`
-  digit5: 53, // `5`
-  digit6: 54, // `6`
-  digit7: 55, // `7`
-  digit8: 56, // `8`
-  digit9: 57, // `9`
-  colon: 58, // `:`
-  semicolon: 59, // `;`
-  lessThan: 60, // `<`
-  equalsTo: 61, // `=`
-  greaterThan: 62, // `>`
-  questionMark: 63, // `?`
-  atSign: 64, // `@`
-  uppercaseA: 65, // `A`
-  uppercaseB: 66, // `B`
-  uppercaseC: 67, // `C`
-  uppercaseD: 68, // `D`
-  uppercaseE: 69, // `E`
-  uppercaseF: 70, // `F`
-  uppercaseG: 71, // `G`
-  uppercaseH: 72, // `H`
-  uppercaseI: 73, // `I`
-  uppercaseJ: 74, // `J`
-  uppercaseK: 75, // `K`
-  uppercaseL: 76, // `L`
-  uppercaseM: 77, // `M`
-  uppercaseN: 78, // `N`
-  uppercaseO: 79, // `O`
-  uppercaseP: 80, // `P`
-  uppercaseQ: 81, // `Q`
-  uppercaseR: 82, // `R`
-  uppercaseS: 83, // `S`
-  uppercaseT: 84, // `T`
-  uppercaseU: 85, // `U`
-  uppercaseV: 86, // `V`
-  uppercaseW: 87, // `W`
-  uppercaseX: 88, // `X`
-  uppercaseY: 89, // `Y`
-  uppercaseZ: 90, // `Z`
-  leftSquareBracket: 91, // `[`
-  backslash: 92, // `\`
-  rightSquareBracket: 93, // `]`
-  caret: 94, // `^`
-  underscore: 95, // `_`
-  graveAccent: 96, // `` ` ``
-  lowercaseA: 97, // `a`
-  lowercaseB: 98, // `b`
-  lowercaseC: 99, // `c`
-  lowercaseD: 100, // `d`
-  lowercaseE: 101, // `e`
-  lowercaseF: 102, // `f`
-  lowercaseG: 103, // `g`
-  lowercaseH: 104, // `h`
-  lowercaseI: 105, // `i`
-  lowercaseJ: 106, // `j`
-  lowercaseK: 107, // `k`
-  lowercaseL: 108, // `l`
-  lowercaseM: 109, // `m`
-  lowercaseN: 110, // `n`
-  lowercaseO: 111, // `o`
-  lowercaseP: 112, // `p`
-  lowercaseQ: 113, // `q`
-  lowercaseR: 114, // `r`
-  lowercaseS: 115, // `s`
-  lowercaseT: 116, // `t`
-  lowercaseU: 117, // `u`
-  lowercaseV: 118, // `v`
-  lowercaseW: 119, // `w`
-  lowercaseX: 120, // `x`
-  lowercaseY: 121, // `y`
-  lowercaseZ: 122, // `z`
-  leftCurlyBrace: 123, // `{`
-  verticalBar: 124, // `|`
-  rightCurlyBrace: 125, // `}`
-  tilde: 126, // `~`
-  del: 127,
-  // Unicode Specials block.
-  byteOrderMarker: 65_279,
-  // Unicode Specials block.
-  replacementCharacter: 65_533 // `�`
-})
-
 ;// ./lib/micromark/legacy-variable/syntax.ts
 
 
@@ -94729,9 +94988,9 @@ function isAllowedValueChar(code) {
 }
 const legacyVariableConstruct = {
     name: 'legacyVariable',
-    tokenize,
+    tokenize: syntax_tokenize,
 };
-function tokenize(effects, ok, nok) {
+function syntax_tokenize(effects, ok, nok) {
     let hasValue = false;
     const start = (code) => {
         if (code !== codes.lessThan)
@@ -95870,6 +96129,8 @@ const EMPTY_CODE_PLACEHOLDER = {
 
 
 
+
+
 
 
 
@@ -95912,8 +96173,8 @@ const preprocessBody = (text) => {
 };
 /** Markdown parser */
 const contentParser = unified()
-    .data('micromarkExtensions', [legacyVariable(), looseHtmlEntity()])
-    .data('fromMarkdownExtensions', [legacyVariableFromMarkdown(), emptyTaskListItemFromMarkdown(), looseHtmlEntityFromMarkdown()])
+    .data('micromarkExtensions', [syntax_gemoji(), legacyVariable(), looseHtmlEntity()])
+    .data('fromMarkdownExtensions', [gemojiFromMarkdown(), legacyVariableFromMarkdown(), emptyTaskListItemFromMarkdown(), looseHtmlEntityFromMarkdown()])
     .use(remarkParse)
     .use(remarkBreaks)
     .use(remarkGfm)
@@ -95926,8 +96187,8 @@ const contentParser = unified()
  * such as `<ul><li>https://a</li>\n</ul>` due to subtokenizing recursion for URLs
  */
 const markdownToHtml = unified()
-    .data('micromarkExtensions', [gfmStrikethrough(), legacyVariable(), looseHtmlEntity()])
-    .data('fromMarkdownExtensions', [gfmStrikethroughFromMarkdown(), legacyVariableFromMarkdown(), emptyTaskListItemFromMarkdown(), looseHtmlEntityFromMarkdown()])
+    .data('micromarkExtensions', [gfmStrikethrough(), syntax_gemoji(), legacyVariable(), looseHtmlEntity()])
+    .data('fromMarkdownExtensions', [gfmStrikethroughFromMarkdown(), gemojiFromMarkdown(), legacyVariableFromMarkdown(), emptyTaskListItemFromMarkdown(), looseHtmlEntityFromMarkdown()])
     .use(remarkParse)
     .use(normalize_malformed_md_syntax)
     .use(remarkRehype)
@@ -96062,11 +96323,34 @@ const parseBlock = (text) => {
     const tree = contentParser.runSync(contentParser.parse(text));
     return tree.children;
 };
-const parseInline = (text) => {
+/**
+ * Minimal parser for api-header titles.
+ * Disables markdown constructs that are not parsed in legacy (headings, lists)
+ */
+const apiHeaderTitleParser = unified()
+    .data('micromarkExtensions', [
+    syntax_gemoji(),
+    legacyVariable(),
+    looseHtmlEntity(),
+    {
+        disable: {
+            null: [
+                'blockQuote',
+                'headingAtx',
+                'list',
+                'thematicBreak',
+            ],
+        },
+    },
+])
+    .data('fromMarkdownExtensions', [gemojiFromMarkdown(), legacyVariableFromMarkdown(), looseHtmlEntityFromMarkdown()])
+    .use(remarkParse)
+    .use(remarkGfm);
+const parseApiHeaderTitle = (text) => {
     if (!text.trim())
         return textToInline(text);
-    const tree = contentParser.runSync(contentParser.parse(text));
-    return tree.children;
+    const tree = apiHeaderTitleParser.runSync(apiHeaderTitleParser.parse(text));
+    return tree.children.flatMap(n => n.type === 'paragraph' && 'children' in n ? n.children : [n]);
 };
 /**
  * Transform a magicBlock node into final MDAST nodes.
@@ -96125,7 +96409,7 @@ function transformMagicBlock(blockType, data, rawValue, options = {}) {
             const depth = headerJson.level || (compatibilityMode ? 1 : 2);
             return [
                 wrapPinnedBlocks({
-                    children: 'title' in headerJson ? parseInline(headerJson.title || '') : [],
+                    children: 'title' in headerJson ? parseApiHeaderTitle(headerJson.title || '') : [],
                     depth,
                     type: 'heading',
                 }, data),
@@ -97173,6 +97457,179 @@ function mdxish_jsx_to_mdast_extractText(nodes) {
     })
         .join('');
 }
+const FIGURE_OPEN_REGEX = /^<figure(\s[^>]*)?>$/;
+const FIGURE_CLOSE_REGEX = /^\s*<\/figure>\s*$/;
+const FIGURE_COMPLETE_REGEX = /^<figure(\s[^>]*)?>[\s\S]*<\/figure>\s*$/;
+const FIGCAPTION_REGEX = /<figcaption>(.*?)<\/figcaption>/s;
+const FIGCAPTION_OPEN_REGEX = /^<figcaption>$/;
+const FIGCAPTION_CLOSE_REGEX = /^<\/figcaption>$/;
+/**
+ * Extracts an image or image-block from a node. If the node itself is an image/image-block,
+ * it is returned directly. If the node is a paragraph, its children are searched for one.
+ * This is needed because standalone markdown images (`![](url)`) may be wrapped in a
+ * paragraph node by the parser, or already transformed to image-block by imageTransformer.
+ */
+function findImageInNode(node) {
+    if (node.type === 'image' || node.type === NodeTypes.imageBlock)
+        return node;
+    if (node.type === 'paragraph') {
+        return node.children.find(child => child.type === 'image' || child.type === NodeTypes.imageBlock);
+    }
+    return undefined;
+}
+/**
+ * Parses a complete `<figure>` HTML string into image URL, alt text, and optional caption.
+ * Returns undefined if the HTML doesn't contain a recognizable image.
+ */
+function parseCompleteFigure(html) {
+    const imageMatch = /!\[([^\]]*)\]\(([^)]+)\)/.exec(html);
+    if (!imageMatch)
+        return undefined;
+    const captionMatch = FIGCAPTION_REGEX.exec(html);
+    return {
+        alt: imageMatch[1],
+        caption: captionMatch?.[1],
+        url: imageMatch[2],
+    };
+}
+/**
+ * Builds a FigureNode containing an image and optional figcaption from parsed figure data.
+ */
+function buildFigureNode(imageNode, captionText, position) {
+    const figureChildren = [imageNode];
+    if (captionText) {
+        figureChildren.push({
+            children: [{ type: 'text', value: captionText }],
+            data: { hName: 'figcaption' },
+            type: 'figcaption',
+        });
+    }
+    return {
+        children: figureChildren,
+        data: { hName: 'figure' },
+        position,
+        type: 'figure',
+    };
+}
+/**
+ * Scans siblings starting at `startIndex` within a parent's children looking for the
+ * figcaption text and </figure> closing tag. Handles three fragmentation patterns:
+ *
+ * 1. Combined: `<figcaption>Hello</figcaption>\n</figure>` in one html node
+ * 2. Separate: `<figcaption>Hello</figcaption>` then `</figure>` as sibling html nodes
+ * 3. Split (table cells): `<figcaption>` + text(Hello) + `</figcaption>` + `</figure>` as siblings
+ */
+function scanForFigcaptionAndClose(children, startIndex) {
+    let captionText;
+    let endIndex = startIndex - 1;
+    let foundClose = false;
+    for (let j = startIndex; j < children.length; j += 1) {
+        const sibling = children[j];
+        const htmlValue = sibling.type === 'html' ? sibling.value : undefined;
+        if (htmlValue === undefined && sibling.type !== 'text')
+            break;
+        // Standalone </figure>
+        if (htmlValue && FIGURE_CLOSE_REGEX.test(htmlValue)) {
+            endIndex = j;
+            foundClose = true;
+            break;
+        }
+        // Combined <figcaption>...</figcaption> in one node (possibly with </figure>)
+        if (htmlValue) {
+            const figcaptionMatch = FIGCAPTION_REGEX.exec(htmlValue);
+            if (figcaptionMatch) {
+                captionText = figcaptionMatch[1];
+                if (FIGURE_CLOSE_REGEX.test(htmlValue.replace(FIGCAPTION_REGEX, ''))) {
+                    endIndex = j;
+                    foundClose = true;
+                    break;
+                }
+                const nextSibling = children[j + 1];
+                if (nextSibling?.type === 'html' && FIGURE_CLOSE_REGEX.test(nextSibling.value)) {
+                    endIndex = j + 1;
+                    foundClose = true;
+                    break;
+                }
+            }
+        }
+        // Split figcaption: <figcaption> + text + </figcaption> as separate nodes (table cells)
+        if (htmlValue && FIGCAPTION_OPEN_REGEX.test(htmlValue)) {
+            const textNode = children[j + 1];
+            const closeCaption = children[j + 2];
+            if (textNode?.type === 'text' &&
+                closeCaption?.type === 'html' &&
+                FIGCAPTION_CLOSE_REGEX.test(closeCaption.value)) {
+                captionText = textNode.value;
+                const closeFigure = children[j + 3];
+                if (closeFigure?.type === 'html' && FIGURE_CLOSE_REGEX.test(closeFigure.value)) {
+                    endIndex = j + 3;
+                    foundClose = true;
+                    break;
+                }
+            }
+        }
+    }
+    return { captionText, endIndex, foundClose };
+}
+/**
+ * Reconstruct fragmented or complete HTML <figure> elements into figure MDAST nodes.
+ *
+ * Handles three html-based cases (the JSX case is handled by transformFigure in COMPONENT_MAP):
+ * 1. Complete: A single html node containing the full `<figure>...<figcaption>...</figure>` block
+ *    (e.g. inside callouts where blockquote parsing keeps it together).
+ * 2. Fragmented siblings: `terminateHtmlFlowBlocks` splits `<figure>` into separate sibling
+ *    nodes (open tag, image, figcaption, close tag).
+ * 3. Split tags (GFM table cells): Each tag becomes its own html node with text nodes between them.
+ *
+ * Runs on all parent nodes so it works inside callouts, tables, and at root level.
+ */
+function reassembleHtmlFigures(tree) {
+    // Case 1: Handle complete <figure> blocks in a single html node (e.g. inside callouts)
+    visit(tree, 'html', (node, index, parent) => {
+        if (!parent || index === undefined)
+            return;
+        if (!FIGURE_COMPLETE_REGEX.test(node.value.trim()))
+            return;
+        const parsed = parseCompleteFigure(node.value);
+        if (!parsed)
+            return;
+        const imageNode = {
+            type: 'image',
+            url: parsed.url,
+            alt: parsed.alt,
+        };
+        const figureNode = buildFigureNode(imageNode, parsed.caption, node.position);
+        parent.children.splice(index, 1, figureNode);
+    });
+    // Case 2 & 3: Handle fragmented <figure> blocks split across sibling nodes
+    const processChildren = (parent) => {
+        const children = parent.children;
+        let i = 0;
+        while (i < children.length) {
+            const node = children[i];
+            const nextNode = children[i + 1];
+            const imageNode = nextNode ? findImageInNode(nextNode) : undefined;
+            if (node.type === 'html' &&
+                FIGURE_OPEN_REGEX.test(node.value.trim()) &&
+                imageNode) {
+                const { captionText, endIndex, foundClose } = scanForFigcaptionAndClose(children, i + 2);
+                if (foundClose) {
+                    const figureNode = buildFigureNode(imageNode, captionText, node.position);
+                    parent.children.splice(i, endIndex - i + 1, figureNode);
+                }
+            }
+            i += 1;
+        }
+    };
+    // Process all parent nodes (root, callouts, blockquotes, table cells, list items)
+    visit(tree, (node) => {
+        if ('children' in node)
+            processChildren(node);
+    });
+}
+/**
+ * Transforms an inline `<Anchor>` JSX element into a readme-anchor MDAST node.
+ */
 const transformAnchor = (jsx) => {
     const attrs = getAttrs(jsx);
     const { href = '', label, target, title } = attrs;
@@ -97191,6 +97648,10 @@ const transformAnchor = (jsx) => {
         position: jsx.position,
     };
 };
+/**
+ * Transforms an `<Image />` JSX element into an image-block MDAST node.
+ * Normalizes attributes (align, border, width→sizing) and parses caption markdown into children.
+ */
 const transformImage = (jsx) => {
     const attrs = getAttrs(jsx);
     const { align, alt = '', border, caption, className, height, lazy, src = '', title = '', width } = attrs;
@@ -97230,6 +97691,9 @@ const transformImage = (jsx) => {
         position: jsx.position,
     };
 };
+/**
+ * Transforms a `<Callout>` JSX element into an rdme-callout MDAST node.
+ */
 const transformCallout = (jsx) => {
     const attrs = getAttrs(jsx);
     const { empty = false, icon = '', theme = '' } = attrs;
@@ -97247,6 +97711,9 @@ const transformCallout = (jsx) => {
         position: jsx.position,
     };
 };
+/**
+ * Transforms an `<Embed />` JSX element into an embed-block MDAST node.
+ */
 const transformEmbed = (jsx) => {
     const attrs = getAttrs(jsx);
     const { favicon, height, href, html, iframe, image, providerName, providerUrl, provider, title = '', typeOfEmbed, url = '', width, } = attrs;
@@ -97275,6 +97742,9 @@ const transformEmbed = (jsx) => {
         position: jsx.position,
     };
 };
+/**
+ * Transforms a `<Recipe />` JSX element into a recipe MDAST node.
+ */
 const transformRecipe = (jsx) => {
     const attrs = getAttrs(jsx);
     const { backgroundColor = '', emoji = '', id = '', link = '', slug = '', title = '' } = attrs;
@@ -97411,21 +97881,44 @@ const transformTable = (jsx) => {
         children: rows,
     };
 };
+/**
+ * Transforms a `<figure>` JSX element into a FigureNode.
+ * Inside JSX tables with blank lines, the parser treats `<figure>` as an mdxJsxFlowElement
+ * containing a paragraph with the image and a `<figcaption>` mdxJsxTextElement as children.
+ */
+const transformFigure = (jsx) => {
+    let imageNode;
+    let captionText;
+    visit(jsx, (child) => {
+        if (!imageNode && (child.type === 'image' || child.type === NodeTypes.imageBlock)) {
+            imageNode = child;
+        }
+        if (!captionText && child.type === 'mdxJsxTextElement' && child.name === 'figcaption') {
+            captionText = mdxish_jsx_to_mdast_extractText(child.children);
+        }
+    });
+    if (!imageNode)
+        return null;
+    return buildFigureNode(imageNode, captionText, jsx.position);
+};
 const COMPONENT_MAP = {
     Callout: transformCallout,
     Embed: transformEmbed,
     Image: transformImage,
+    figure: transformFigure,
     Recipe: transformRecipe,
     Table: transformTable,
 };
 /**
- * Transform mdxJsxFlowElement nodes and magic block nodes into proper MDAST node types.
+ * Transform mdxJsxFlowElement nodes, magic block nodes, and HTML figure elements
+ * into proper MDAST node types.
  *
  * This transformer runs after mdxishComponentBlocks and converts:
- * - JSX component elements (Image, Callout, Embed, Recipe) into their corresponding MDAST types
+ * - JSX component elements (Image, Callout, Embed, Recipe, figure) into their corresponding MDAST types
  * - Magic block image nodes (type: 'image') into image-block
  * - Magic block embed nodes (type: 'embed') into embed-block
- * - Figure nodes (magic blocks with captions) into flat image-block with caption string
+ * - Fragmented HTML <figure> blocks (from terminateHtmlFlowBlocks) back into figure nodes
+ * - Figure nodes (from magic blocks, HTML, or JSX) into flat image-block with caption string
  * - Normalizes all image-block attrs (border, align, sizing, caption) to a consistent shape
  *
  * This is controlled by the `newEditorTypes` flag to maintain backwards compatibility.
@@ -97472,6 +97965,9 @@ const mdxishJsxToMdast = () => tree => {
         parent.children[index] = newNode;
         return SKIP;
     });
+    // Reassembling fragmented HTML <figure> blocks into proper figure/figcaption nodes
+    // this will then later be transformed into image-block nodes by imageTransformer
+    reassembleHtmlFigures(tree);
     // Flatten figure nodes (magic blocks with captions) into image-block nodes
     const isFigure = (node) => node.type === 'figure';
     visit(tree, isFigure, (node, index, parent) => {
@@ -97724,6 +98220,7 @@ function restoreSnakeCase(placeholderName, mapping) {
 ;// ./processor/transform/mdxish/mdxish-tables-to-jsx.ts
 
 
+const SELF_CLOSING_JSX_REGEX = /^\s*<[A-Z][^>]*\/>\s*$/;
 const mdxish_tables_to_jsx_alignToStyle = (align) => {
     if (!align || align === 'left')
         return null;
@@ -97750,7 +98247,7 @@ const mdxishTablesToJsx = () => tree => {
     visit(tree, (node) => ['table', 'tableau'].includes(node.type), (table, index, parent) => {
         let hasFlowContent = false;
         visit(table, mdxish_tables_to_jsx_isTableCell, (cell) => {
-            if (cell.children.length === 0)
+            if (hasFlowContent || cell.children.length === 0)
                 return;
             const content = cell.children.length === 1 && cell.children[0].type === 'paragraph'
                 ? cell.children[0].children[0]
@@ -97761,17 +98258,21 @@ const mdxishTablesToJsx = () => tree => {
                 breakParent.children.splice(breakIndex, 1, { type: 'text', value: '\n' });
             });
             if (!(phrasing(content) || content.type === 'plain') && content.type !== 'escape') {
-                if (content.type === 'html')
-                    return;
-                hasFlowContent = true;
-                return EXIT;
-            }
-            visit(cell, mdxish_tables_to_jsx_isLiteral, (node) => {
-                if (node.value.match(/\n/)) {
+                // Plain HTML (e.g. <div>Hello</div>) is skipped here — it stays in GFM cells fine.
+                // But self-closing JSX components (e.g. <Image src="..." caption="..." />) serialize
+                // with newlines that break GFM cells, so they must trigger JSX <Table> serialization.
+                const isPlainHtml = content.type === 'html' && !SELF_CLOSING_JSX_REGEX.test(content.value);
+                if (!isPlainHtml) {
                     hasFlowContent = true;
-                    return EXIT;
                 }
-            });
+            }
+            if (!hasFlowContent) {
+                visit(cell, mdxish_tables_to_jsx_isLiteral, (node) => {
+                    if (node.value.match(/\n/)) {
+                        hasFlowContent = true;
+                    }
+                });
+            }
         });
         if (!hasFlowContent) {
             table.type = 'table';
@@ -100011,13 +100512,14 @@ function loadComponents() {
 
 
 
+
+
 
 
 
 const defaultTransformers = [
     [callouts, { isMdxish: true }],
     code_tabs,
-    gemoji_,
     transform_embeds,
 ];
 /**
@@ -100027,13 +100529,15 @@ const defaultTransformers = [
  * 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. Evaluate JSX expressions in attributes (unless safeMode)
- * 4. Replace snake_case component names with parser-safe placeholders
+ * 3. Close invalid "self-closing" HTML tags (e.g., `<i />` → `<i></i>`)
+ * 4. Evaluate JSX expressions in attributes (unless safeMode)
+ * 5. Replace snake_case component names with parser-safe placeholders
  */
 function preprocessContent(content, opts) {
     const { safeMode, jsxContext, knownComponents } = opts;
     let result = normalizeTableSeparator(content);
     result = terminateHtmlFlowBlocks(result);
+    result = closeSelfClosingHtmlTags(result);
     result = safeMode ? result : preprocessJSXExpressions(result, jsxContext);
     return processSnakeCaseComponent(result, { knownComponents });
 }
@@ -100063,12 +100567,13 @@ function mdxishAstProcessor(mdContent, opts = {}) {
     };
     const processor = unified()
         .data('micromarkExtensions', safeMode
-        ? [jsxTable(), magicBlock(), legacyVariable(), looseHtmlEntity()]
-        : [jsxTable(), magicBlock(), mdxExprTextOnly, legacyVariable(), looseHtmlEntity()])
+        ? [jsxTable(), magicBlock(), syntax_gemoji(), legacyVariable(), looseHtmlEntity()]
+        : [jsxTable(), magicBlock(), syntax_gemoji(), mdxExprTextOnly, legacyVariable(), looseHtmlEntity()])
         .data('fromMarkdownExtensions', safeMode
         ? [
             jsxTableFromMarkdown(),
             magicBlockFromMarkdown(),
+            gemojiFromMarkdown(),
             legacyVariableFromMarkdown(),
             emptyTaskListItemFromMarkdown(),
             looseHtmlEntityFromMarkdown(),
@@ -100076,6 +100581,7 @@ function mdxishAstProcessor(mdContent, opts = {}) {
         : [
             jsxTableFromMarkdown(),
             magicBlockFromMarkdown(),
+            gemojiFromMarkdown(),
             mdxExpressionFromMarkdown(),
             legacyVariableFromMarkdown(),
             emptyTaskListItemFromMarkdown(),