@readme/markdown 13.7.3 → 13.8.0

package/dist/main.node.js

@@ -24471,6 +24471,8 @@ const GlossaryContext = (0,external_react_.createContext)([]);
 
 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_react_default().createElement("span", null, term);
@@ -24664,13 +24666,91 @@ const Table = (props) => {
 
 ;// ./components/TableOfContents/index.tsx
 
-function TableOfContents({ children, heading = 'Table of Contents' }) {
-    return (external_react_default().createElement("nav", { "aria-label": "Table of contents", role: "navigation" },
+/**
+ * Build link map and decode the hash to get the id and weird chars
+ */
+function buildLinkMap(nav) {
+    const map = new Map();
+    Array.from(nav.querySelectorAll('a')).forEach(link => {
+        const id = decodeURIComponent(link.hash.slice(1));
+        if (!id)
+            return;
+        const list = map.get(id);
+        if (list)
+            list.push(link);
+        else
+            map.set(id, [link]);
+    });
+    return map;
+}
+/**
+ * Watches headings in the viewport and toggles `active` on the
+ * corresponding TOC links so the reader always knows where they are.
+ */
+function useScrollHighlight(navRef) {
+    const [linkCount, setLinkCount] = (0,external_react_.useState)(0);
+    (0,external_react_.useEffect)(() => {
+        const nav = navRef.current;
+        if (!nav)
+            return;
+        const count = nav.querySelectorAll('a[href^="#"]').length;
+        setLinkCount(count);
+    }, [navRef]);
+    (0,external_react_.useEffect)(() => {
+        const nav = navRef.current;
+        if (!nav || typeof IntersectionObserver === 'undefined' || linkCount === 0)
+            return undefined;
+        const linkMap = buildLinkMap(nav);
+        if (linkMap.size === 0)
+            return undefined;
+        const headings = [...linkMap.keys()]
+            .map(id => document.getElementById(id))
+            .filter((el) => el !== null);
+        if (headings.length === 0)
+            return undefined;
+        let activeId = null;
+        const visible = new Set();
+        const activate = (id) => {
+            if (id === activeId)
+                return;
+            if (activeId)
+                linkMap.get(activeId)?.forEach(a => a.classList.remove('active'));
+            activeId = id;
+            // set active states + border pos/size
+            if (id) {
+                const links = linkMap.get(id);
+                links?.forEach(a => a.classList.add('active'));
+                const link = links?.[0];
+                if (link) {
+                    const navRect = nav.getBoundingClientRect();
+                    const linkRect = link.getBoundingClientRect();
+                    nav.style.setProperty('--ToC-border-active-height', `${linkRect.height}px`);
+                    nav.style.setProperty('--ToC-border-active-top', `${linkRect.top - navRect.top}px`);
+                }
+            }
+        };
+        const observer = new IntersectionObserver(entries => {
+            entries.forEach(e => {
+                if (e.isIntersecting)
+                    visible.add(e.target.id);
+                else
+                    visible.delete(e.target.id);
+            });
+            // Highlight the topmost visible heading; if none are visible,
+            // keep the last active one so the user still has context.
+            const topmost = headings.find(el => visible.has(el.id));
+            if (topmost)
+                activate(topmost.id);
+        }, { rootMargin: '0px 0px -60% 0px', threshold: 0 });
+        headings.forEach(el => { observer.observe(el); });
+        return () => { observer.disconnect(); };
+    }, [navRef, linkCount]);
+}
+function TableOfContents({ children }) {
+    const navRef = (0,external_react_.useRef)(null);
+    useScrollHighlight(navRef);
+    return (external_react_default().createElement("nav", { ref: navRef, "aria-label": "Table of contents", className: "rm-ToC" },
         external_react_default().createElement("ul", { className: "toc-list" },
-            external_react_default().createElement("li", null,
-                external_react_default().createElement("a", { className: "tocHeader", href: "#" },
-                    external_react_default().createElement("i", { className: "icon icon-text-align-left" }),
-                    heading)),
             external_react_default().createElement("li", { className: "toc-children" }, children))));
 }
 /* harmony default export */ const components_TableOfContents = (TableOfContents);
@@ -24938,19 +25018,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') {
@@ -73183,6 +73254,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);
@@ -73233,6 +73308,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
@@ -73240,8 +73316,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) => {
@@ -73636,7 +73712,7 @@ const embedTransformer = () => {
  *
  * @type {Array<Gemoji>}
  */
-const gemoji = [
+const gemoji_gemoji = [
   {
     emoji: '😀',
     names: ['grinning'],
@@ -90579,7 +90655,7 @@ class Owlmoji {
         return null;
     };
     static nameToEmoji = nameToEmoji;
-    static owlmoji = gemoji.concat(owlmoji);
+    static owlmoji = gemoji_gemoji.concat(owlmoji);
 }
 
 ;// ./processor/transform/gemoji+.ts
@@ -91489,6 +91565,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
@@ -91845,6 +92231,7 @@ const normalizeEmphasisAST = () => (tree) => {
 
 
 
+
 const isTableCell = (node) => isMDXElement(node) && ['th', 'td'].includes(node.name);
 const tableTypes = {
     tr: 'tableRow',
@@ -91852,10 +92239,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
@@ -92728,7 +93117,6 @@ const mdxishTransformers = [
     [callouts, { isMdxish: true }],
     code_tabs,
     transform_images,
-    gemoji_,
 ];
 /* harmony default export */ const transform = (Object.values(defaultTransforms));
 
@@ -112510,10 +112898,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) => {
@@ -114496,6 +114880,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
 
 
@@ -114785,166 +115249,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
 
 
@@ -114956,9 +115260,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)
@@ -116097,6 +116401,8 @@ const EMPTY_CODE_PLACEHOLDER = {
 
 
 
+
+
 
 
 
@@ -116139,8 +116445,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)
@@ -116153,8 +116459,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)
@@ -116295,6 +116601,7 @@ const parseBlock = (text) => {
  */
 const apiHeaderTitleParser = unified()
     .data('micromarkExtensions', [
+    syntax_gemoji(),
     legacyVariable(),
     looseHtmlEntity(),
     {
@@ -116308,7 +116615,7 @@ const apiHeaderTitleParser = unified()
         },
     },
 ])
-    .data('fromMarkdownExtensions', [legacyVariableFromMarkdown(), looseHtmlEntityFromMarkdown()])
+    .data('fromMarkdownExtensions', [gemojiFromMarkdown(), legacyVariableFromMarkdown(), looseHtmlEntityFromMarkdown()])
     .use(remarkParse)
     .use(remarkGfm);
 const parseApiHeaderTitle = (text) => {
@@ -117422,6 +117729,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;
@@ -117440,6 +117920,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;
@@ -117479,6 +117963,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;
@@ -117496,6 +117983,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;
@@ -117524,6 +118014,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;
@@ -117660,21 +118153,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.
@@ -117721,6 +118237,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) => {
@@ -117973,6 +118492,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;
@@ -117999,7 +118519,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]
@@ -118010,17 +118530,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';
@@ -120260,13 +120784,14 @@ function loadComponents() {
 
 
 
+
+
 
 
 
 const defaultTransformers = [
     [callouts, { isMdxish: true }],
     code_tabs,
-    gemoji_,
     transform_embeds,
 ];
 /**
@@ -120276,13 +120801,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 });
 }
@@ -120312,12 +120839,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(),
@@ -120325,6 +120853,7 @@ function mdxishAstProcessor(mdContent, opts = {}) {
         : [
             jsxTableFromMarkdown(),
             magicBlockFromMarkdown(),
+            gemojiFromMarkdown(),
             mdxExpressionFromMarkdown(),
             legacyVariableFromMarkdown(),
             emptyTaskListItemFromMarkdown(),
@@ -120683,7 +121212,7 @@ function createTocComponent(tocHast) {
         components: { p: (external_react_default()).Fragment },
     });
     const tocReactElement = tocProcessor.stringify(tocHast);
-    const TocComponent = (props) => tocReactElement ? (external_react_default().createElement(components_TableOfContents, { heading: props.heading }, tocReactElement)) : null;
+    const TocComponent = () => tocReactElement ? (external_react_default().createElement(components_TableOfContents, null, tocReactElement)) : null;
     TocComponent.displayName = 'Toc';
     return TocComponent;
 }
@@ -120849,7 +121378,7 @@ const run_run = (string, _opts = {}) => {
         default: (props) => (external_react_default().createElement(contexts, { baseUrl: baseUrl, copyButtons: copyButtons, terms: terms, theme: theme, variables: variables },
             external_react_default().createElement(Content, { ...props }))),
         toc,
-        Toc: (props) => Toc ? (external_react_default().createElement(components_TableOfContents, { heading: props.heading },
+        Toc: () => Toc ? (external_react_default().createElement(components_TableOfContents, null,
             external_react_default().createElement(Toc, null))) : null,
         stylesheet,
         ...exports,