@readme/markdown 14.10.2 → 14.11.0

package/dist/main.js

@@ -12060,10 +12060,55 @@ const Columns = ({ children, layout = 'auto' }) => {
 };
 /* harmony default export */ const components_Columns = (Columns);
 
+;// ./components/Embed/normalizeYouTubeUrl.ts
+// YouTube watch/share URLs (youtube.com/watch?v=ID, youtu.be/ID) set X-Frame-Options
+// and refuse to be framed. The player only allows embedding via youtube.com/embed/ID.
+const YOUTUBE_HOSTS = new Set(['youtube.com', 'www.youtube.com', 'm.youtube.com', 'youtu.be', 'www.youtu.be', 'm.youtu.be']);
+// /embed/ accepts `start` (integer seconds), not the watch-page `t` value which may carry units (e.g. 596s, 1h2m3s).
+const toStartSeconds = (timestamp) => {
+    const [, hours, minutes, seconds] = timestamp.match(/^(?:(\d+)h)?(?:(\d+)m)?(?:(\d+)s?)?$/) ?? [];
+    const total = (Number(hours) || 0) * 3600 + (Number(minutes) || 0) * 60 + (Number(seconds) || 0);
+    return total > 0 ? String(total) : null;
+};
+const extractVideoId = (parsed) => {
+    if (parsed.hostname.endsWith('youtu.be'))
+        return parsed.pathname.slice(1).split('/')[0] || null;
+    if (parsed.pathname.startsWith('/watch'))
+        return parsed.searchParams.get('v');
+    if (parsed.pathname.startsWith('/shorts/'))
+        return parsed.pathname.slice('/shorts/'.length).split('/')[0] || null;
+    return null;
+};
+// Most youtube links we get from the browser are watch URLs, like https://www.youtube.com/watch?v=dQw4w9WgXcQ
+// These /watch URLs won't work in an iframe, so we need to convert them to the embed URL if iframe is used
+const normalizeYouTubeUrlToEmbedUrl = (url) => {
+    let parsed;
+    try {
+        parsed = new URL(url);
+    }
+    catch {
+        return url;
+    }
+    if (!YOUTUBE_HOSTS.has(parsed.hostname))
+        return url;
+    if (parsed.pathname.startsWith('/embed/'))
+        return url;
+    const videoId = extractVideoId(parsed);
+    if (!videoId)
+        return url;
+    const embed = new URL(`https://www.youtube.com/embed/${videoId}`);
+    const timestamp = parsed.searchParams.get('start') || parsed.searchParams.get('t');
+    const start = timestamp ? toStartSeconds(timestamp) : null;
+    if (start)
+        embed.searchParams.set('start', start);
+    return embed.toString();
+};
+
 ;// ./components/Embed/index.tsx
 /* eslint-disable no-param-reassign */
 /* eslint-disable react/jsx-props-no-spreading */
 
+
 const Favicon = ({ src, alt = 'favicon', ...attr }) => (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("img", { ...attr, alt: alt, height: "14", src: src, width: "14" }));
 const IFRAME_DERIVABLE_TYPES = new Set(['youtube', 'jsfiddle', 'pdf']);
 // HTML width/height attrs accept bare numbers (interpreted as px), but CSS does not, convert.
@@ -12097,7 +12142,8 @@ const Embed = ({ lazy = true, url, html, providerName, providerUrl, title, ifram
     // Fall back to a direct iframe for URL-derivable embed types when html is missing.
     const renderTypeAsIframe = !html && !explicitOptOut && url && typeOfEmbed && IFRAME_DERIVABLE_TYPES.has(typeOfEmbed);
     if (iframe || renderTypeAsIframe) {
-        return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("iframe", { ...spreadAttrs, src: url, style: iframeStyle, title: title });
+        const src = normalizeYouTubeUrlToEmbedUrl(url);
+        return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement("iframe", { ...spreadAttrs, src: src, style: iframeStyle, title: title });
     }
     if (!providerUrl && url)
         providerUrl = new URL(url).hostname
@@ -100750,6 +100796,12 @@ const types_types = /** @type {const} */ ({
 
 
 
+
+// Raw tags (type-1: pre/script/style/textarea) and block tags (type-6: div,
+// section, …) always start a block, so they stay flow even with trailing
+// content. Other lowercase tags (i, span, …) follow the type-7 rule and only
+// stay flow when nothing trails the close tag.
+const htmlFlowTagNames = new Set([...htmlRawNames, ...htmlBlockNames]);
 const syntax_nonLazyContinuationStart = {
     tokenize: syntax_tokenizeNonLazyContinuationStart,
     partial: true,
@@ -100786,11 +100838,12 @@ const mdxComponentTextConstruct = {
  * lowercase HTML tags that carry at least one `{…}` attribute expression.
  * Multi-line, concrete, `afterClose` consumes the rest of the line.
  *
- * **Text** — runs inside paragraphs / inline context. Claims *only* lowercase
- * tags with brace attributes (PascalCase is intentionally flow-only, matching
- * how ReadMe's custom components are authored). Aborts on line endings (inline
- * constructs don't span lines) and exits immediately after `</tag>` so the
- * paragraph's inline parser picks up the trailing text.
+ * **Text** — runs inside paragraphs / inline context. Claims lowercase tags and
+ * inline PascalCase components (`INLINE_COMPONENT_TAGS` — Anchor, Glossary), both
+ * gated on at least one `{…}` brace attribute. All other PascalCase stays
+ * flow-only, matching how ReadMe's custom components are authored. Aborts on line
+ * endings (inline constructs don't span lines) and exits immediately after
+ * `</tag>` so the paragraph's inline parser picks up the trailing text.
  */
 function createTokenize(mode) {
     const isFlow = mode === 'flow';
@@ -100802,8 +100855,9 @@ function createTokenize(mode) {
         let closingTagName = '';
         // For lowercase tags we only want to claim the block if it uses JSX
         // attribute expression syntax (`attr={...}`). Plain HTML should fall
-        // through to CommonMark html-flow. Uppercase tags are always claimed
-        // (flow only — PascalCase is not accepted in text mode).
+        // through to CommonMark html-flow. Flow mode claims any PascalCase block
+        // component; text mode claims only inline PascalCase components
+        // (INLINE_COMPONENT_TAGS — Anchor, Glossary), also brace-gated.
         let isLowercaseTag = false;
         let sawBraceAttr = false;
         // Code span tracking
@@ -100814,6 +100868,9 @@ function createTokenize(mode) {
         let fenceLength = 0;
         let fenceCloseLength = 0;
         let atLineStart = false;
+        // True once this construct consumes any line ending; lets `afterClose`
+        // treat only single-line lowercase tags as inline candidates.
+        let sawLineEnding = false;
         // Bail when the opener line has unmatched tag-like tokens in its body.
         // `<Foo>_<Bar>.csv` leaves opens > closes; matched shapes like
         // `<Callout>x <strong>y</strong>` balance to 0. Without this,
@@ -100964,13 +101021,13 @@ function createTokenize(mode) {
         }
         // ── Tag name parsing ───────────────────────────────────────────────────
         function tagNameFirst(code) {
-            // Uppercase A-Z → PascalCase MDX component. Flow-only — PascalCase
-            // components are block elements in ReadMe's authoring model.
+            // Uppercase A-Z → PascalCase MDX component. Flow mode claims block
+            // components; text mode only claims inline components (Anchor, Glossary),
+            // which is enforced once the full name is known in `tagNameRest`.
             if (code !== null && code >= codes.uppercaseA && code <= codes.uppercaseZ) {
-                if (!isFlow)
-                    return nok(code);
                 tagName = String.fromCharCode(code);
                 isLowercaseTag = false;
+                sawBraceAttr = false;
                 effects.consume(code);
                 return tagNameRest;
             }
@@ -100998,10 +101055,18 @@ function createTokenize(mode) {
                 effects.consume(code);
                 return tagNameRest;
             }
-            // Tag name complete — check exclusions
-            if (TOKENIZER_MDX_COMPONENT_EXCLUDED_TAGS.has(tagName)) {
+            // Tag name complete — decide whether this tokenizer claims the tag.
+            // Three cases: lowercase tags are always candidates (brace-gated later in
+            // `afterOpenTagName`); flow-mode PascalCase claims any block component
+            // except those with a dedicated tokenizer; text-mode PascalCase claims
+            // only inline components (Anchor, Glossary).
+            const claimable = isLowercaseTag
+                ? true
+                : isFlow
+                    ? !TOKENIZER_MDX_COMPONENT_EXCLUDED_TAGS.has(tagName)
+                    : INLINE_COMPONENT_TAGS.has(tagName);
+            if (!claimable)
                 return nok(code);
-            }
             depth = 1;
             return afterOpenTagName(code);
         }
@@ -101009,6 +101074,10 @@ function createTokenize(mode) {
         function afterOpenTagName(code) {
             if (code === null)
                 return nok(code);
+            // Everything except a flow-mode PascalCase block component must carry a
+            // `{…}` brace attribute to be claimed; plain HTML falls through to
+            // CommonMark.
+            const requiresBraceAttr = isLowercaseTag || !isFlow;
             if (markdownLineEnding(code)) {
                 if (!isFlow)
                     return nok(code);
@@ -101017,14 +101086,14 @@ function createTokenize(mode) {
             }
             // Self-closing />
             if (code === codes.slash) {
-                if (isLowercaseTag && !sawBraceAttr)
+                if (requiresBraceAttr && !sawBraceAttr)
                     return nok(code);
                 effects.consume(code);
                 return selfCloseGt;
             }
             // End of opening tag
             if (code === codes.greaterThan) {
-                if (isLowercaseTag && !sawBraceAttr)
+                if (requiresBraceAttr && !sawBraceAttr)
                     return nok(code);
                 effects.consume(code);
                 onOpenerLine = isFlow;
@@ -101088,6 +101157,7 @@ function createTokenize(mode) {
             return effects.check(syntax_nonLazyContinuationStart, openTagContinuationNonLazy, continuationAfter)(code);
         }
         function openTagContinuationNonLazy(code) {
+            sawLineEnding = true;
             effects.enter(types_types.lineEnding);
             effects.consume(code);
             effects.exit(types_types.lineEnding);
@@ -101211,6 +101281,7 @@ function createTokenize(mode) {
             return effects.check(syntax_nonLazyContinuationStart, fencedCodeContinuationNonLazy, continuationAfter)(code);
         }
         function fencedCodeContinuationNonLazy(code) {
+            sawLineEnding = true;
             effects.enter(types_types.lineEnding);
             effects.consume(code);
             effects.exit(types_types.lineEnding);
@@ -101367,6 +101438,12 @@ function createTokenize(mode) {
                 effects.exit('mdxComponent');
                 return ok(code);
             }
+            // A single-line type-7 lowercase tag with content trailing its close is
+            // inline, so `<i …></i> <a>…</a>` stays on one line instead of splitting
+            // into separate blocks. Raw/block tags (pre, div, …) stay flow.
+            if (isLowercaseTag && !sawLineEnding && !htmlFlowTagNames.has(tagName)) {
+                return afterCloseInlineCandidate(code);
+            }
             if (code === null || markdownLineEnding(code)) {
                 effects.exit('mdxComponentData');
                 effects.exit('mdxComponent');
@@ -101377,11 +101454,26 @@ function createTokenize(mode) {
             effects.consume(code);
             return afterClose;
         }
+        // Whitespace-only to the line ending keeps the flow block; any other
+        // trailing char means inline content, so refuse and let inline parsing run.
+        function afterCloseInlineCandidate(code) {
+            if (code === null || markdownLineEnding(code)) {
+                effects.exit('mdxComponentData');
+                effects.exit('mdxComponent');
+                return ok(code);
+            }
+            if (markdownSpace(code)) {
+                effects.consume(code);
+                return afterCloseInlineCandidate;
+            }
+            return nok(code);
+        }
         // ── Body continuation (line endings) ───────────────────────────────────
         function bodyContinuationStart(code) {
             return effects.check(syntax_nonLazyContinuationStart, bodyContinuationNonLazy, continuationAfter)(code);
         }
         function bodyContinuationNonLazy(code) {
+            sawLineEnding = true;
             effects.enter(types_types.lineEnding);
             effects.consume(code);
             effects.exit(types_types.lineEnding);
@@ -101451,12 +101543,13 @@ function syntax_tokenizeNonLazyContinuationStart(effects, ok, nok) {
  * self-closing `<Component />`). Prevents CommonMark from fragmenting them
  * across multiple HTML / paragraph nodes.
  *
- * **Text (inline)** — registers only for lowercase tags with brace attrs
- * (e.g. `Start <a href={url}>here</a> end`). Picks them up during inline
- * parsing so they render inline inside their paragraph, then are rewritten
- * to `mdxJsxTextElement` by the `components/inline-html` transformer.
- * PascalCase is intentionally flow-only; ReadMe's custom components are
- * authored as block-level elements.
+ * **Text (inline)** — registers for lowercase tags and inline PascalCase
+ * components (Anchor, Glossary) that carry brace attrs (e.g.
+ * `Start <a href={url}>here</a> end`, `<Anchor href={url}>x</Anchor>`). Picks
+ * them up during inline parsing so they render inline inside their paragraph,
+ * then are rewritten to `mdxJsxTextElement` by the `components/inline-html`
+ * transformer. All other PascalCase is flow-only; ReadMe's custom components
+ * are authored as block-level elements.
  *
  * Excludes tags handled by dedicated tokenizers: Table, HTMLBlock, Glossary,
  * Anchor.
@@ -101575,12 +101668,12 @@ const parsePhrasingChildren = (value, safeMode) => {
     return first?.type === 'paragraph' ? first.children : [];
 };
 /**
- * Attempt to promote a lowercase inline `html` node to an
- * `mdxJsxTextElement`. Scope is deliberately narrow: only lowercase tags
- * carrying `{…}` attribute expressions (what the `mdxComponent` text
- * tokenizer claims). PascalCase components — even when inline — stay with
- * `mdxishComponentBlocks` so they remain `mdxJsxFlowElement`, matching
- * ReadMe's flow-level component authoring model.
+ * Attempt to promote an inline `html` node to an `mdxJsxTextElement`. Scope
+ * mirrors what the `mdxComponent` text tokenizer claims: lowercase tags and
+ * inline PascalCase components (`INLINE_COMPONENT_TAGS` — Anchor, Glossary),
+ * both carrying `{…}` attribute expressions. All other PascalCase components
+ * stay with `mdxishComponentBlocks` so they remain `mdxJsxFlowElement`,
+ * matching ReadMe's flow-level component authoring model.
  *
  * Returns the original node unchanged when it doesn't qualify.
  */
@@ -101589,12 +101682,11 @@ const promoteInlineHtml = (node, parseOpts, safeMode) => {
     if (!parsed)
         return node;
     const { tag, attributes, selfClosing, contentAfterTag = '' } = parsed;
-    // PascalCase stays flow-level; handled by mdxishComponentBlocks.
-    if (isPascalCase(tag))
-        return node;
-    // Dedicated tokenizers (Table, HTMLBlock, Glossary, Anchor) handle their
-    // own tags — don't hijack them here.
-    if (GENERIC_MDX_COMPONENT_EXCLUDED_TAGS.has(tag))
+    // Non-inline PascalCase stays flow-level (handled by mdxishComponentBlocks)
+    // and dedicated tokenizers (Table, HTMLBlock) own their tags. Inline
+    // components (Anchor, Glossary) with expression attrs are promoted here —
+    // the text tokenizer captures them as a single html node.
+    if (isPascalCase(tag) && !INLINE_COMPONENT_TAGS.has(tag))
         return node;
     // Plain inline HTML (no expressions) stays as an html node so rehype-raw
     // parses it with parse5 as normal.
@@ -101618,14 +101710,15 @@ const promoteInlineHtml = (node, parseOpts, safeMode) => {
  * Runs after `mdxishComponentBlocks`, which skips paragraph-parented html
  * nodes and leaves them for this pass. Two producers put html nodes inside
  * paragraphs:
- *   1. The `mdxComponent` text tokenizer, for lowercase tags with `{…}`
- *      attribute expressions (e.g. `<a href={url}>here</a>`).
+ *   1. The `mdxComponent` text tokenizer, for lowercase tags and inline
+ *      PascalCase components (Anchor, Glossary) with `{…}` attribute
+ *      expressions (e.g. `<a href={url}>here</a>`, `<Anchor href={url}>x</Anchor>`).
  *   2. CommonMark's built-in html-text tokenizer, for PascalCase components
  *      (e.g. a single html node for self-closing `<C />`).
  *
- * Eligibility mirrors `mdxishComponentBlocks`: lowercase tags only promote
- * when they carry an expression attribute; plain inline HTML like
- * `<a href="x">` stays as an html node for rehype-raw.
+ * Eligibility mirrors `mdxishComponentBlocks`: a tag only promotes when it
+ * carries an expression attribute and isn't a non-inline PascalCase component;
+ * plain inline HTML like `<a href="x">` stays as an html node for rehype-raw.
  */
 const mdxishInlineMdxHtmlBlocks = (opts = {}) => tree => {
     const safeMode = !!opts.safeMode;
@@ -102073,12 +102166,60 @@ function restoreSnakeCase(placeholderName, mapping) {
     return matchingKey ? mapping[matchingKey] : placeholderName;
 }
 
+;// ./processor/transform/mdxish/resolve-esm-imports.ts
+
+// We provide React as a default module so that components can use hooks
+// and it's a common use case. Add other common libraries here.
+const defaultModuleRegistry = { react: (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default()) };
+const isRecord = (value) => typeof value === 'object' && value !== null;
+// Get the value of a named export from a module
+const getModuleExport = (module, importedName) => isRecord(module) && importedName in module ? module[importedName] : undefined;
+/**
+ * Turn `import` declarations into a flat map of binding → value.
+ *
+ * A "binding" is a mapping of a local name to the value of it in the module exports
+ * Example: `import { useState } from 'react'` yields `{ useState: React.useState }`.
+ *
+ * Unsupported specifiers are skipped with a warning rather than throwing, so a
+ * single unknown import can't break the rest of the document.
+ */
+const collectImportValues = (importDeclarations, registry = defaultModuleRegistry) => {
+    const importValues = {};
+    importDeclarations.forEach(declaration => {
+        const libraryName = declaration.source.value;
+        if (typeof libraryName !== 'string')
+            return;
+        if (!(libraryName in registry)) {
+            // eslint-disable-next-line no-console
+            console.warn(`[WARNING] Cannot resolve import "${libraryName}"; it is not a supported library.`);
+            return;
+        }
+        const module = registry[libraryName];
+        declaration.specifiers.forEach(spec => {
+            // Default (`import React`) and namespace (`import * as React`) both bind
+            // the whole module under the local name.
+            if (spec.type === 'ImportDefaultSpecifier' || spec.type === 'ImportNamespaceSpecifier') {
+                importValues[spec.local.name] = module;
+            }
+            else if (spec.type === 'ImportSpecifier') {
+                // Named imports (e.g. `import { useState } from 'react'`, useState is the import name)
+                const importName = spec.imported.type === 'Identifier' ? spec.imported.name : spec.imported.value;
+                if (typeof importName === 'string') {
+                    importValues[spec.local.name] = getModuleExport(module, importName);
+                }
+            }
+        });
+    });
+    return importValues;
+};
+
 ;// ./processor/transform/mdxish/evaluate-exports.ts
 
 
 
 
 
+
 /**
  * Recursively extract all identifier names introduced by a binding pattern.
  * Handles destructuring (`{ a, b }`, `[x, y]`), rest elements (`...rest`),
@@ -102126,6 +102267,7 @@ const collectExportNames = (declaration) => {
 const evaluateExports = () => (tree, file) => {
     const programBody = [];
     const exportNames = [];
+    const importDeclarations = [];
     const nodesToRemove = [];
     visit(tree, isMDXEsm, (node, index, parent) => {
         if (parent && typeof index === 'number') {
@@ -102139,6 +102281,10 @@ const evaluateExports = () => (tree, file) => {
         // handled the same as a named export — the inner declaration carries the
         // binding name
         estreeBody.forEach(statement => {
+            if (statement.type === 'ImportDeclaration') {
+                importDeclarations.push(statement);
+                return;
+            }
             let declaration = null;
             if (statement.type === 'ExportNamedDeclaration' && statement.declaration) {
                 declaration = statement.declaration;
@@ -102166,9 +102312,11 @@ const evaluateExports = () => (tree, file) => {
         const program = { type: 'Program', sourceType: 'module', body: programBody };
         buildJsx(program, { runtime: 'classic', pragma: 'React.createElement', pragmaFrag: 'React.Fragment' });
         const { value: source } = toJs(program);
+        // Make sure import values are available in the scope
+        const importValues = collectImportValues(importDeclarations);
         // Evaluate and build on the expression source
         // Use react to compile JSX codes
-        const evaluatedExports = evaluate(`(() => { ${source}\nreturn { ${exportNames.join(', ')} }; })()`, { React: (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default()) });
+        const evaluatedExports = evaluate(`(() => { ${source}\nreturn { ${exportNames.join(', ')} }; })()`, { React: (external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default()), ...importValues });
         Object.assign(scope, evaluatedExports);
     }
     catch (error) {
@@ -104122,214 +104270,21 @@ const normalizeMdxJsxNodes = () => tree => {
  */
 const JSX_COMMENT_REGEX = /\{\/\*[^*]*(?:\*(?!\/)[^*]*)*\*\/\}/g;
 
-;// ./processor/transform/mdxish/preprocess-jsx-expressions.ts
-
+;// ./processor/transform/mdxish/remove-jsx-comments.ts
 
 /**
  * Removes JSX-style comments (e.g., { /* comment *\/ }) from content.
  *
- * @param content
- * @returns Content with JSX comments removed
- * @example
+ * `@param` content
+ * `@returns` Content with JSX comments removed
+ * `@example`
  * ```typescript
- * removeJSXComments('Text { /* comment *\/ } more text')
- * // Returns: 'Text  more text'
+ * removeJSXComments('Text {/* comment *\/} more text') // => 'Text  more text'
  * ```
  */
 function removeJSXComments(content) {
     return content.replace(JSX_COMMENT_REGEX, '');
 }
-const HTML_ELEM_PLACEHOLDER_PREFIX = '___MDXISH_HTML_ELEM_';
-const HTML_ELEM_PLACEHOLDER = new RegExp(`${HTML_ELEM_PLACEHOLDER_PREFIX}(\\d+)___`, 'g');
-// Matches an HTML element that starts at a line boundary and ends at a line boundary.
-// Allows optional leading indentation and lazily matches until the same closing tag.
-const BLOCK_HTML_RE = /(?<=^|\n)[ \t]*<([a-z][a-zA-Z0-9]*)(?:\s[^>]*)?>[\s\S]*?<\/\1>[ \t]*(?=\n|$)/g;
-/**
- * Hides line-anchored HTML elements from the brace-escaping pass so we don't leak `\{`
- * into rendered output (rehypeRaw renders the `\` literally, e.g. `<div>{foo</div>`).
- *
- * One carve-out: if an interior line at column 0 has bare text containing `{`, mdxish
- * parses that line as a paragraph and the mdxExpression step would throw without an
- * escape — so we leave that case to the brace balancer.
- */
-function protectHTMLElements(content) {
-    const htmlElements = [];
-    const protectedContent = content.replace(BLOCK_HTML_RE, match => {
-        // Look at the lines between the open and close tags. If any of them starts
-        // at column 0 with bare text (not whitespace, not another tag) and contains
-        // `{`, mdxish will parse that line as a paragraph and the brace as an MDX
-        // expression, which would throw an error. So we let the brace balancer escape it.
-        // Otherwise, we need to extract the sequence to protect it from the brace escaping.
-        const interior = match.split('\n').slice(1, -1);
-        const hazard = interior.some(line => line.length > 0 && line[0] !== ' ' && line[0] !== '\t' && line[0] !== '<' && line.includes('{'));
-        if (hazard)
-            return match;
-        htmlElements.push(match);
-        return `${HTML_ELEM_PLACEHOLDER_PREFIX}${htmlElements.length - 1}___`;
-    });
-    return { htmlElements, protectedContent };
-}
-function restoreHTMLElements(content, htmlElements) {
-    if (htmlElements.length === 0)
-        return content;
-    return content.replace(HTML_ELEM_PLACEHOLDER, (_m, idx) => htmlElements[parseInt(idx, 10)]);
-}
-const ESM_DECLARATION_START = /^(?:export|import)\b/;
-/**
- * Whether a line begins a top-level `export`/`import` declaration. Its braces
- * are valid JS owned by the mdxjsEsm tokenizer (which tolerates blank lines),
- * so escaping them would corrupt the source and break acorn parsing.
- */
-function startsEsmDeclaration(chars, lineStart) {
-    return ESM_DECLARATION_START.test(chars.slice(lineStart, lineStart + 7).join(''));
-}
-function isBlankLine(chars, lineStart) {
-    for (let i = lineStart; i < chars.length; i += 1) {
-        if (chars[i] === '\n')
-            return true;
-        if (chars[i] !== ' ' && chars[i] !== '\t')
-            return false;
-    }
-    return true;
-}
-/**
- * Escapes unbalanced and paragraph-spanning braces so MDX doesn't trip on them.
- */
-function escapeProblematicBraces(content) {
-    const { htmlElements, protectedContent } = protectHTMLElements(content);
-    let strDelim = null;
-    let strEscaped = false;
-    // Track position of last newline (outside strings) to detect blank lines
-    // -2 means no recent newline
-    let lastNewlinePos = -2;
-    // Character state machine trackers
-    const toEscape = new Set();
-    // Convert to array of Unicode code points so that emojis and multi-byte characters are correctly tracked
-    const chars = Array.from(protectedContent);
-    const openStack = [];
-    // Whether the current top-level statement is an `export`/`import` declaration.
-    let insideEsmDeclaration = false;
-    for (let i = 0; i < chars.length; i += 1) {
-        const ch = chars[i];
-        // At a top-level (brace depth 0) line start, decide whether we're inside an
-        // ESM declaration. The flag persists across the declaration's own lines.
-        if (openStack.length === 0 && (i === 0 || chars[i - 1] === '\n')) {
-            if (startsEsmDeclaration(chars, i))
-                insideEsmDeclaration = true;
-            else if (isBlankLine(chars, i))
-                insideEsmDeclaration = false;
-        }
-        // Track string delimiters inside expressions to ignore braces within them
-        if (openStack.length > 0) {
-            if (strDelim) {
-                if (strEscaped)
-                    strEscaped = false;
-                else if (ch === '\\')
-                    strEscaped = true;
-                else if (ch === strDelim)
-                    strDelim = null;
-                // eslint-disable-next-line no-continue
-                continue;
-            }
-            if (ch === '"' || ch === "'" || ch === '`') {
-                strDelim = ch;
-                // eslint-disable-next-line no-continue
-                continue;
-            }
-            if (ch === '\n') {
-                if (lastNewlinePos >= 0) {
-                    const between = chars.slice(lastNewlinePos + 1, i).join('');
-                    if (/^[ \t]*$/.test(between)) {
-                        openStack.forEach(entry => { entry.hasBlankLine = true; });
-                    }
-                }
-                lastNewlinePos = i;
-            }
-        }
-        // Skip already-escaped braces (odd run of preceding backslashes).
-        if (ch === '{' || ch === '}') {
-            let bs = 0;
-            for (let j = i - 1; j >= 0 && chars[j] === '\\'; j -= 1)
-                bs += 1;
-            if (bs % 2 === 1) {
-                // eslint-disable-next-line no-continue
-                continue;
-            }
-        }
-        if (ch === '{') {
-            // `=` (after whitespace) before `{` ⇒ JSX attribute expression. The
-            // mdxComponent tokenizer captures the whole component, so blank lines
-            // inside attribute values are harmless. Nested `{` inherits the flag.
-            let isAttrExpr = false;
-            for (let j = i - 1; j >= 0; j -= 1) {
-                const pc = chars[j];
-                if (pc === '=') {
-                    isAttrExpr = true;
-                    break;
-                }
-                if (pc !== ' ' && pc !== '\t')
-                    break;
-            }
-            // Nested `{ ... }` inside an attribute value (e.g. `data={[{ ... }]}` or
-            // `data={{ a: { b: 1 } }}`) must inherit the same exemption; only the
-            // outer `{` is directly after `=`.
-            if (!isAttrExpr && openStack.length > 0 && openStack[openStack.length - 1].isAttrExpr) {
-                isAttrExpr = true;
-            }
-            openStack.push({ pos: i, hasBlankLine: false, isAttrExpr, isEsmDeclaration: insideEsmDeclaration });
-            lastNewlinePos = -2;
-        }
-        else if (ch === '}') {
-            if (openStack.length > 0) {
-                const entry = openStack.pop();
-                // The declaration's braces are closed; later top-level braces are not ESM.
-                if (openStack.length === 0)
-                    insideEsmDeclaration = false;
-                // Pure `{/* ... */}` comments are handled downstream by the jsxComment
-                // tokenizer — escaping their braces would prevent it from running.
-                const isPureJsxComment = chars[entry.pos + 1] === '/' &&
-                    chars[entry.pos + 2] === '*' &&
-                    chars[i - 1] === '/' &&
-                    chars[i - 2] === '*';
-                if (entry.hasBlankLine && !isPureJsxComment && !entry.isAttrExpr && !entry.isEsmDeclaration) {
-                    toEscape.add(entry.pos);
-                    toEscape.add(i);
-                }
-            }
-            else {
-                toEscape.add(i);
-            }
-        }
-        else if (ch === ';' && openStack.length === 0) {
-            // A top-level `;` ends the current statement, ESM or otherwise.
-            insideEsmDeclaration = false;
-        }
-    }
-    // Anything still open is unbalanced.
-    openStack.forEach(entry => {
-        if (!entry.isEsmDeclaration)
-            toEscape.add(entry.pos);
-    });
-    // Reconstruct the content with the escaped braces.
-    const escapedContent = toEscape.size === 0 ? protectedContent : chars.map((ch, i) => (toEscape.has(i) ? `\\${ch}` : ch)).join('');
-    return restoreHTMLElements(escapedContent, htmlElements);
-}
-/**
- * Preprocesses JSX-like markdown content before parsing.
- *
- * JSX attribute expressions (`href={baseUrl}`) are no longer rewritten here —
- * they flow through the tokenizer as `mdxJsxAttributeValueExpression` nodes
- * and are evaluated at the hast handler step.
- *
- * @param content
- * @returns Preprocessed content ready for markdown parsing
- */
-function preprocessJSXExpressions(content) {
-    const { protectedCode, protectedContent } = protectCodeBlocks(content);
-    let processed = escapeProblematicBraces(protectedContent);
-    processed = restoreCodeBlocks(processed, protectedCode);
-    return processed;
-}
 
 ;// ./processor/transform/mdxish/resolve-deferred-attribute-expression-props.ts
 
@@ -105304,6 +105259,85 @@ function jsxTable() {
 ;// ./lib/micromark/jsx-table/index.ts
 
 
+;// ./lib/micromark/mdx-expression-lenient/syntax.ts
+
+
+/**
+ * Lenient MDX text-expression tokenizer (agnostic / no acorn).
+ *
+ * Matches a balanced `{ ... }` run — tracking nested braces and spanning soft
+ * line breaks — and emits the standard `mdxTextExpression*` tokens so the
+ * upstream `mdxExpressionFromMarkdown()` builds the node.
+ *
+ * Reimplements the official micromark mdxExpression, but an unbalanced brace that
+ * reaches end of input returns `nok` instead of throwing: micromark rolls back
+ * and the `{` renders as literal text, making the pipeline forgiving of stray
+ * braces that upstream would hard-error on.
+ */
+function tokenizeTextExpression(effects, ok, nok) {
+    let depth = 0;
+    return start;
+    function start(code) {
+        if (code !== codes.leftCurlyBrace)
+            return nok(code);
+        effects.enter('mdxTextExpression');
+        effects.enter('mdxTextExpressionMarker');
+        effects.consume(code);
+        effects.exit('mdxTextExpressionMarker');
+        return before;
+    }
+    function before(code) {
+        if (code === codes.eof) {
+            effects.exit('mdxTextExpression');
+            return nok(code);
+        }
+        if (markdownLineEnding(code)) {
+            effects.enter('lineEnding');
+            effects.consume(code);
+            effects.exit('lineEnding');
+            return before;
+        }
+        if (code === codes.rightCurlyBrace && depth === 0) {
+            return close(code);
+        }
+        effects.enter('mdxTextExpressionChunk');
+        return inside(code);
+    }
+    function inside(code) {
+        if (code === codes.eof || markdownLineEnding(code)) {
+            effects.exit('mdxTextExpressionChunk');
+            return before(code);
+        }
+        if (code === codes.rightCurlyBrace && depth === 0) {
+            effects.exit('mdxTextExpressionChunk');
+            return close(code);
+        }
+        if (code === codes.leftCurlyBrace)
+            depth += 1;
+        else if (code === codes.rightCurlyBrace)
+            depth -= 1;
+        effects.consume(code);
+        return inside;
+    }
+    function close(code) {
+        effects.enter('mdxTextExpressionMarker');
+        effects.consume(code);
+        effects.exit('mdxTextExpressionMarker');
+        effects.exit('mdxTextExpression');
+        return ok;
+    }
+}
+function mdxExpressionLenient() {
+    return {
+        text: {
+            [codes.leftCurlyBrace]: {
+                name: 'mdxTextExpression',
+                tokenize: tokenizeTextExpression,
+            },
+        },
+    };
+}
+
 ;// ./lib/utils/mdxish/mdxish-load-components.ts
 
 
@@ -105416,7 +105450,7 @@ const defaultTransformers = [
  * 1. Normalize malformed table separator syntax (e.g., `|: ---` → `| :---`)
  * 2. Terminate HTML flow blocks so subsequent content isn't swallowed
  * 3. Close invalid "self-closing" HTML tags (e.g., `<i />` → `<i></i>`)
- * 4. Escape problematic braces so MDX expression parsing doesn't choke
+ * 4. Normalize compact ATX headings (e.g., `#Heading` → `# Heading`)
  * 5. Replace snake_case component names with parser-safe placeholders
  */
 function preprocessContent(content, opts) {
@@ -105425,7 +105459,6 @@ function preprocessContent(content, opts) {
     result = terminateHtmlFlowBlocks(result);
     result = closeSelfClosingHtmlTags(result);
     result = normalizeCompactHeadings(result);
-    result = preprocessJSXExpressions(result);
     return processSnakeCaseComponent(result, { knownComponents });
 }
 function mdxishAstProcessor(mdContent, opts = {}) {
@@ -105442,12 +105475,8 @@ function mdxishAstProcessor(mdContent, opts = {}) {
         acc[key] = String(value);
         return acc;
     }, {});
-    // Get mdxExpression extension and remove its flow construct to prevent
-    // `{...}` from interrupting paragraphs (which breaks multiline magic blocks)
-    const mdxExprExt = mdxExpression({ allowEmpty: true });
-    const mdxExprTextOnly = {
-        text: mdxExprExt.text,
-    };
+    // Parser extension for MDX expressions {}
+    const mdxExprTextOnly = mdxExpressionLenient();
     const micromarkExts = [
         jsxTable(),
         magicBlock(),