@stream-mdx/react 0.5.0 → 1.0.0

package/dist/components/index.mjs

@@ -1,403 +1,22 @@
 "use client";
-var __defProp = Object.defineProperty;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __esm = (fn, res) => function __init() {
-  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
-};
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
 
-// src/mdx-client.ts
-var mdx_client_exports = {};
-__export(mdx_client_exports, {
-  MDXClient: () => MDXClient,
-  MDXComponentFactory: () => MDXComponentFactory,
-  getMDXClient: () => getMDXClient,
-  getMDXComponentFactory: () => getMDXComponentFactory,
-  registerInlineMdxModule: () => registerInlineMdxModule,
-  registerMDXComponents: () => registerMDXComponents
-});
-import React2 from "react";
-import * as ReactJsxRuntime from "react/jsx-runtime";
-function assignMdxChildKey(child, index) {
-  if (child == null) return child;
-  if (Array.isArray(child)) {
-    return child.map((entry, subIndex) => assignMdxChildKey(entry, `${index}-${subIndex}`));
-  }
-  if (React2.isValidElement(child)) {
-    if (child.key !== null && child.key !== void 0) {
-      return child;
-    }
-    return React2.cloneElement(child, { key: index });
-  }
-  return child;
-}
-function getMDXClient(compileEndpoint) {
-  if (!globalMDXClient) {
-    globalMDXClient = new MDXClient(compileEndpoint);
-  }
-  return globalMDXClient;
+// src/code-fence-streaming.ts
+function trimProvisionalFenceTail(raw) {
+  if (raw.endsWith(`
+`)) return raw;
+  let opening = raw.match(/^ {0,3}(`{3,}|~{3,})[^\n]*\n/);
+  if (!opening) return raw;
+  let lastNewline = raw.lastIndexOf(`
+`), tail = raw.slice(lastNewline + 1).match(/^ {0,3}(`+|~+)[\t ]*$/);
+  return tail && tail[1][0] === opening[1][0] && tail[1].length < opening[1].length ? raw.slice(0, lastNewline) : raw;
 }
-function getMDXComponentFactory(compileEndpoint) {
-  if (!globalComponentFactory) {
-    const client = getMDXClient(compileEndpoint);
-    globalComponentFactory = new MDXComponentFactory(client);
-  }
-  return globalComponentFactory;
-}
-function registerMDXComponents(components, options) {
-  const factory = getMDXComponentFactory();
-  factory.registerComponents(components, options);
-}
-function registerInlineMdxModule(compiled) {
-  const factory = getMDXComponentFactory();
-  factory.registerInlineModule({
-    id: compiled.id,
-    code: compiled.code,
-    dependencies: compiled.dependencies ?? []
-  });
-}
-var withClassName, MDXClient, MDXComponentFactory, globalMDXClient, globalComponentFactory;
-var init_mdx_client = __esm({
-  "src/mdx-client.ts"() {
-    "use strict";
-    withClassName = (tag, className) => {
-      return (props) => React2.createElement(tag, { className, ...props });
-    };
-    MDXClient = class {
-      constructor(compileEndpoint = "/api/mdx-compile-v2") {
-        this.cache = /* @__PURE__ */ new Map();
-        this.inlineModules = /* @__PURE__ */ new Map();
-        this.compiledCache = /* @__PURE__ */ new Map();
-        this.compiledInflight = /* @__PURE__ */ new Map();
-        this.compileEndpoint = compileEndpoint;
-      }
-      /**
-       * Compile MDX block on server
-       */
-      async compile(block) {
-        if (block.type !== "mdx") {
-          throw new Error("Block is not MDX type");
-        }
-        const cacheKey = `${block.id}\0${block.payload.raw ?? ""}`;
-        const cachedPromise = this.cache.get(cacheKey);
-        if (cachedPromise) {
-          return cachedPromise;
-        }
-        const compilationPromise = this.doCompile(block);
-        this.cache.set(cacheKey, compilationPromise);
-        try {
-          const result = await compilationPromise;
-          return result;
-        } catch (error) {
-          this.cache.delete(cacheKey);
-          throw error;
-        }
-      }
-      async getCompiledInternal(ref) {
-        const inline = this.inlineModules.get(ref.id);
-        if (inline) {
-          return this.cloneCompiled(inline);
-        }
-        const cached = this.compiledCache.get(ref.id);
-        if (cached) {
-          return this.cloneCompiled(cached);
-        }
-        const inflight = this.compiledInflight.get(ref.id);
-        if (inflight) {
-          const resolved = await inflight;
-          return this.cloneCompiled(resolved);
-        }
-        const fetchPromise = this.fetchCompiled(ref);
-        this.compiledInflight.set(ref.id, fetchPromise);
-        try {
-          const data = await fetchPromise;
-          this.compiledCache.set(ref.id, data);
-          return this.cloneCompiled(data);
-        } finally {
-          this.compiledInflight.delete(ref.id);
-        }
-      }
-      async getCompiled(ref, options) {
-        if (options?.signal) {
-          const inline = this.inlineModules.get(ref.id);
-          if (inline) {
-            return this.cloneCompiled(inline);
-          }
-          const cached = this.compiledCache.get(ref.id);
-          if (cached) {
-            return this.cloneCompiled(cached);
-          }
-          const data = await this.fetchCompiled(ref, options);
-          this.compiledCache.set(ref.id, data);
-          return this.cloneCompiled(data);
-        }
-        return this.getCompiledInternal(ref);
-      }
-      /**
-       * Clear compilation cache
-       */
-      clearCache() {
-        this.cache.clear();
-        this.compiledCache.clear();
-        this.compiledInflight.clear();
-      }
-      registerInlineModule(compiled) {
-        this.inlineModules.set(compiled.id, {
-          ...compiled,
-          dependencies: Array.isArray(compiled.dependencies) ? [...compiled.dependencies] : []
-        });
-      }
-      clearInlineModules() {
-        this.inlineModules.clear();
-      }
-      /**
-       * Actual compilation implementation
-       */
-      async doCompile(block) {
-        const response = await fetch(this.compileEndpoint, {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify({
-            content: block.payload.raw,
-            blockId: block.id
-          })
-        });
-        if (!response.ok) {
-          const error = await response.json().catch(() => ({ error: "Unknown error" }));
-          throw new Error(`MDX compilation failed: ${error.error || response.statusText}`);
-        }
-        const data = await response.json();
-        return {
-          id: data.id,
-          code: data.code,
-          dependencies: data.dependencies || [],
-          cached: data.cached || false
-        };
-      }
-      async fetchCompiled(ref, options) {
-        const response = await fetch(`${this.compileEndpoint}?id=${ref.id}`, {
-          signal: options?.signal
-        });
-        if (!response.ok) {
-          throw new Error(`Failed to get compiled MDX: ${response.statusText}`);
-        }
-        const data = await response.json();
-        return {
-          id: data.id,
-          code: data.code,
-          dependencies: data.dependencies || [],
-          timestamp: data.timestamp
-        };
-      }
-      cloneCompiled(compiled) {
-        return {
-          ...compiled,
-          dependencies: Array.isArray(compiled.dependencies) ? [...compiled.dependencies] : []
-        };
-      }
-    };
-    MDXComponentFactory = class {
-      constructor(mdxClient) {
-        this.components = /* @__PURE__ */ new Map();
-        this.customComponents = /* @__PURE__ */ new Map();
-        this.mdxClient = mdxClient;
-        this.baseComponents = this.createBaseComponents();
-      }
-      registerInlineModule(module) {
-        this.mdxClient.registerInlineModule(module);
-        this.components.delete(module.id);
-      }
-      /**
-       * Create React component from compiled MDX
-       */
-      async createComponent(ref) {
-        const cached = this.components.get(ref.id);
-        if (cached) {
-          return cached;
-        }
-        const compiled = await this.mdxClient.getCompiled(ref);
-        const component = this.evaluateCompiledMDX(compiled);
-        this.components.set(ref.id, component);
-        return component;
-      }
-      /**
-       * Safely evaluate compiled MDX code
-       */
-      evaluateCompiledMDX(compiled) {
-        try {
-          const context = this.createEvaluationContext();
-          const argNames = Object.keys(context);
-          const argValues = Object.values(context);
-          const moduleExports = new Function(...argNames, compiled.code)(...argValues);
-          const MDXComponent = this.resolveEvaluatedModule(moduleExports);
-          return (props) => {
-            const registryComponents = this.getComponents();
-            const incomingComponents = props?.components;
-            const mergedComponents = incomingComponents ? { ...registryComponents, ...incomingComponents } : registryComponents;
-            return React2.createElement(MDXComponent, {
-              ...props,
-              components: mergedComponents
-            });
-          };
-        } catch (error) {
-          console.error("Failed to evaluate MDX:", error);
-          return () => React2.createElement(
-            "div",
-            {
-              className: "mdx-error"
-            },
-            `MDX Error: ${error instanceof Error ? error.message : "Unknown error"}`
-          );
-        }
-      }
-      /**
-       * Create safe evaluation context for MDX
-       */
-      createEvaluationContext() {
-        const runtime = ReactJsxRuntime;
-        const createElementWithChildren = (type, props, key) => {
-          const baseProps = props ?? {};
-          const finalProps = key === void 0 || key === null ? baseProps : { ...baseProps, key };
-          if (Array.isArray(finalProps.children)) {
-            finalProps.children = finalProps.children.map((child, index) => assignMdxChildKey(child, index));
-          }
-          return React2.createElement(type, finalProps);
-        };
-        const runtimeJsx = typeof runtime.jsx === "function" ? runtime.jsx.bind(runtime) : createElementWithChildren;
-        const runtimeJsxs = typeof runtime.jsxs === "function" ? runtime.jsxs.bind(runtime) : createElementWithChildren;
-        const runtimeJsxDEV = typeof runtime.jsxDEV === "function" ? runtime.jsxDEV.bind(runtime) : (type, props, key, ..._rest) => createElementWithChildren(type, props, key);
-        const jsxRuntime = {
-          jsx: runtimeJsx,
-          jsxs: runtimeJsxs,
-          jsxDEV: runtimeJsxDEV,
-          Fragment: runtime.Fragment ?? React2.Fragment
-        };
-        return {
-          __mdx_runtime: jsxRuntime,
-          React: React2,
-          Fragment: React2.Fragment,
-          useState: React2.useState,
-          useEffect: React2.useEffect,
-          useMemo: React2.useMemo,
-          useCallback: React2.useCallback,
-          useRef: React2.useRef,
-          useContext: React2.useContext,
-          useReducer: React2.useReducer,
-          useLayoutEffect: React2.useLayoutEffect,
-          console: {
-            log: console.log,
-            warn: console.warn,
-            error: console.error
-          }
-        };
-      }
-      resolveEvaluatedModule(output) {
-        if (!output) {
-          throw new Error("Compiled MDX module returned no exports");
-        }
-        if (typeof output === "function") {
-          return output;
-        }
-        if (typeof output.default === "function") {
-          return output.default;
-        }
-        if (typeof output.MDXContent === "function") {
-          return output.MDXContent;
-        }
-        throw new Error("Compiled MDX module did not export a component");
-      }
-      getComponents() {
-        if (this.customComponents.size === 0) {
-          return { ...this.baseComponents };
-        }
-        const merged = { ...this.baseComponents };
-        for (const [key, component] of this.customComponents) {
-          merged[key] = component;
-        }
-        return merged;
-      }
-      /**
-       * Register or replace custom MDX components
-       */
-      registerComponents(components, options) {
-        if (options?.replace) {
-          this.customComponents.clear();
-        }
-        for (const [key, component] of Object.entries(components)) {
-          if (!component) continue;
-          this.customComponents.set(key, component);
-        }
-      }
-      /**
-       * Get base MDX components
-       */
-      createBaseComponents() {
-        return {
-          // Standard HTML elements
-          h1: withClassName("h1", "mdx-h1"),
-          h2: withClassName("h2", "mdx-h2"),
-          h3: withClassName("h3", "mdx-h3"),
-          h4: withClassName("h4", "mdx-h4"),
-          h5: withClassName("h5", "mdx-h5"),
-          h6: withClassName("h6", "mdx-h6"),
-          p: withClassName("p", "mdx-p"),
-          strong: withClassName("strong", "mdx-strong"),
-          em: withClassName("em", "mdx-em"),
-          code: withClassName("code", "mdx-code"),
-          pre: withClassName("pre", "mdx-pre"),
-          ul: withClassName("ul", "mdx-ul"),
-          ol: withClassName("ol", "mdx-ol"),
-          li: withClassName("li", "mdx-li"),
-          blockquote: withClassName("blockquote", "mdx-blockquote"),
-          a: (props) => React2.createElement("a", {
-            className: "mdx-link",
-            target: props.href?.startsWith("http") ? "_blank" : void 0,
-            rel: props.href?.startsWith("http") ? "noopener noreferrer" : void 0,
-            ...props
-          }),
-          img: (props) => React2.createElement("img", { className: "mdx-img", ...props }),
-          table: withClassName("table", "mdx-table"),
-          thead: withClassName("thead", "mdx-thead"),
-          tbody: withClassName("tbody", "mdx-tbody"),
-          tr: withClassName("tr", "mdx-tr"),
-          th: withClassName("th", "mdx-th"),
-          td: withClassName("td", "mdx-td")
-        };
-      }
-      /**
-       * Clear component cache
-       */
-      clearCache() {
-        this.components.clear();
-      }
-      clearCustomComponents() {
-        this.customComponents.clear();
-      }
-    };
-    globalMDXClient = null;
-    globalComponentFactory = null;
-  }
-});
 
 // src/components/bottom-stick-scroll-area.tsx
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-var EPS_BOTTOM_PX = 2;
-var EPS_OVERFLOW_PX = 1;
-var DETACH_SCROLL_DELTA_PX = 1;
-var RETURN_MIN_MS = 180;
-var RETURN_MAX_MS = 520;
-var RETURN_PX_PER_MS = 2.2;
-var RETURN_SETTLE_FRAMES = 2;
+var EPS_BOTTOM_PX = 2, EPS_OVERFLOW_PX = 1, DETACH_SCROLL_DELTA_PX = 1, RETURN_MIN_MS = 180, RETURN_MAX_MS = 520, RETURN_PX_PER_MS = 2.2, RETURN_SETTLE_FRAMES = 2;
 function clamp01(value) {
-  if (value < 0) return 0;
-  if (value > 1) return 1;
-  return value;
+  return value < 0 ? 0 : value > 1 ? 1 : value;
 }
 function easeOutCubic(value) {
   return 1 - (1 - value) ** 3;
@@ -406,14 +25,34 @@ function joinClasses(...parts) {
   return parts.filter(Boolean).join(" ");
 }
 function measure(viewport) {
-  const scrollTop = viewport.scrollTop;
-  const scrollHeight = viewport.scrollHeight;
-  const clientHeight = viewport.clientHeight;
-  const maxScrollTop = Math.max(0, scrollHeight - clientHeight);
-  const distanceToBottom = Math.max(0, maxScrollTop - scrollTop);
-  const isOverflowing = scrollHeight > clientHeight + EPS_OVERFLOW_PX;
+  let scrollTop = viewport.scrollTop, scrollHeight = viewport.scrollHeight, clientHeight = viewport.clientHeight, maxScrollTop = Math.max(0, scrollHeight - clientHeight), distanceToBottom = Math.max(0, maxScrollTop - scrollTop), isOverflowing = scrollHeight > clientHeight + EPS_OVERFLOW_PX;
   return { scrollTop, scrollHeight, clientHeight, maxScrollTop, distanceToBottom, isOverflowing };
 }
+function isEditableTarget(target) {
+  if (!(target instanceof Element)) return !1;
+  if (target.closest("input, textarea, select, [role='textbox']")) return !0;
+  let contentEditable = target.closest("[contenteditable]");
+  return contentEditable !== null && contentEditable.getAttribute("contenteditable")?.toLowerCase() !== "false";
+}
+function isScrollKeyIntent(event) {
+  if (event.defaultPrevented || isEditableTarget(event.target)) return !1;
+  switch (event.key) {
+    case "ArrowDown":
+    case "ArrowUp":
+    case "PageDown":
+    case "PageUp":
+    case "Home":
+    case "End":
+      return !0;
+    case " ":
+    case "Spacebar":
+      return event.target instanceof Element ? event.target.closest(
+        "button, input, summary, [role='button'], [role='checkbox'], [role='switch'], [role='radio'], [role='menuitem'], [role='menuitemcheckbox'], [role='menuitemradio']"
+      ) === null : !0;
+    default:
+      return !1;
+  }
+}
 function DefaultJumpButton({ canJump, jumpToBottom }) {
   return /* @__PURE__ */ jsx(
     "button",
@@ -434,7 +73,7 @@ function DefaultJumpButton({ canJump, jumpToBottom }) {
         color: "var(--foreground, #111)",
         cursor: canJump ? "pointer" : "default"
       },
-      children: /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "\u2193" })
+      children: /* @__PURE__ */ jsx("span", { "aria-hidden": !0, children: "\u2193" })
     }
   );
 }
@@ -443,45 +82,23 @@ function BottomStickScrollArea({
   className,
   viewportClassName,
   contentClassName,
-  showJumpToBottom = true,
+  showJumpToBottom = !0,
   onDebugStateChange,
   onModeChange,
-  debugDomAttributes = false,
+  debugDomAttributes = !1,
   renderJumpToBottom,
   jumpContainerClassName
 }) {
-  const viewportRef = useRef(null);
-  const contentRef = useRef(null);
-  const modeRef = useRef("STICKY_INSTANT");
-  const [mode, setMode] = useState("STICKY_INSTANT");
-  const [isOverflowing, setIsOverflowing] = useState(false);
-  const [distanceToBottom, setDistanceToBottom] = useState(0);
-  const prevScrollTopRef = useRef(0);
-  const lastProgrammaticWriteRef = useRef(null);
-  const programmaticWriteCountRef = useRef(0);
-  const pendingStickRafRef = useRef(null);
-  const stickRequestedRef = useRef(false);
-  const returnRafRef = useRef(null);
-  const returnAnimRef = useRef(null);
-  const setModeBoth = useCallback(
+  let viewportRef = useRef(null), contentRef = useRef(null), modeRef = useRef("STICKY_INSTANT"), [mode, setMode] = useState("STICKY_INSTANT"), [isOverflowing, setIsOverflowing] = useState(!1), [distanceToBottom, setDistanceToBottom] = useState(0), [prefersReducedMotion, setPrefersReducedMotion] = useState(!1), prefersReducedMotionRef = useRef(!1), prevScrollTopRef = useRef(0), lastProgrammaticWriteRef = useRef(null), programmaticWriteCountRef = useRef(0), pendingStickRafRef = useRef(null), stickRequestedRef = useRef(!1), returnRafRef = useRef(null), returnAnimRef = useRef(null), setModeBoth = useCallback(
     (next) => {
-      modeRef.current = next;
-      setMode(next);
-      onModeChange?.(next);
+      modeRef.current = next, setMode(next), onModeChange?.(next);
     },
     [onModeChange]
-  );
-  const updateDebug = useCallback(() => {
-    const viewport = viewportRef.current;
+  ), updateDebug = useCallback(() => {
+    let viewport = viewportRef.current;
     if (!viewport) return;
-    const m = measure(viewport);
-    if (debugDomAttributes) {
-      viewport.dataset.stickyMode = modeRef.current;
-      viewport.dataset.distanceToBottom = String(m.distanceToBottom);
-      viewport.dataset.isOverflowing = m.isOverflowing ? "1" : "0";
-      viewport.dataset.programmaticWrites = String(programmaticWriteCountRef.current);
-    }
-    onDebugStateChange?.({
+    let m = measure(viewport);
+    debugDomAttributes && (viewport.dataset.stickyMode = modeRef.current, viewport.dataset.distanceToBottom = String(m.distanceToBottom), viewport.dataset.isOverflowing = m.isOverflowing ? "1" : "0", viewport.dataset.programmaticWrites = String(programmaticWriteCountRef.current)), onDebugStateChange?.({
       mode: modeRef.current,
       isOverflowing: m.isOverflowing,
       distanceToBottom: m.distanceToBottom,
@@ -490,60 +107,54 @@ function BottomStickScrollArea({
       scrollHeight: m.scrollHeight,
       clientHeight: m.clientHeight,
       programmaticWrites: programmaticWriteCountRef.current
-    });
-    setDistanceToBottom(
+    }), setDistanceToBottom(
       (previous) => Math.abs(previous - m.distanceToBottom) <= 0.1 ? previous : m.distanceToBottom
     );
-  }, [debugDomAttributes, onDebugStateChange]);
-  const writeScrollTop = useCallback((nextTop) => {
-    const viewport = viewportRef.current;
+  }, [debugDomAttributes, onDebugStateChange]), writeScrollTop = useCallback((nextTop) => {
+    let viewport = viewportRef.current;
+    viewport && (viewport.scrollTop = nextTop, programmaticWriteCountRef.current += 1, lastProgrammaticWriteRef.current = { at: performance.now(), top: nextTop });
+  }, []), cancelPendingStick = useCallback(() => {
+    pendingStickRafRef.current !== null && (cancelAnimationFrame(pendingStickRafRef.current), pendingStickRafRef.current = null), stickRequestedRef.current = !1;
+  }, []), cancelReturn = useCallback(() => {
+    returnRafRef.current !== null && (cancelAnimationFrame(returnRafRef.current), returnRafRef.current = null), returnAnimRef.current = null;
+  }, []), handleReducedMotionChange = useCallback(
+    (matches) => {
+      if (prefersReducedMotionRef.current !== matches && (prefersReducedMotionRef.current = matches, setPrefersReducedMotion(matches)), !matches || modeRef.current !== "RETURNING_SMOOTH") return;
+      cancelPendingStick(), cancelReturn(), setModeBoth("STICKY_INSTANT");
+      let viewport = viewportRef.current;
+      viewport && (writeScrollTop(measure(viewport).maxScrollTop), prevScrollTopRef.current = viewport.scrollTop), updateDebug();
+    },
+    [cancelPendingStick, cancelReturn, setModeBoth, updateDebug, writeScrollTop]
+  ), reducedMotionChangeHandlerRef = useRef(handleReducedMotionChange);
+  reducedMotionChangeHandlerRef.current = handleReducedMotionChange;
+  let interruptReturnForUserIntent = useCallback(() => {
+    modeRef.current === "RETURNING_SMOOTH" && (cancelPendingStick(), cancelReturn(), setModeBoth("DETACHED"), updateDebug());
+  }, [cancelPendingStick, cancelReturn, setModeBoth, updateDebug]), onViewportKeyDown = useCallback(
+    (event) => {
+      isScrollKeyIntent(event) && interruptReturnForUserIntent();
+    },
+    [interruptReturnForUserIntent]
+  ), stickToBottomInstant = useCallback(() => {
+    let viewport = viewportRef.current;
+    viewport && (stickRequestedRef.current = !0, pendingStickRafRef.current === null && (pendingStickRafRef.current = requestAnimationFrame(() => {
+      if (pendingStickRafRef.current = null, !stickRequestedRef.current || (stickRequestedRef.current = !1, modeRef.current !== "STICKY_INSTANT")) return;
+      let m = measure(viewport);
+      writeScrollTop(m.maxScrollTop), updateDebug();
+    })));
+  }, [updateDebug, writeScrollTop]), startReturnToBottomSmooth = useCallback(() => {
+    let viewport = viewportRef.current;
     if (!viewport) return;
-    viewport.scrollTop = nextTop;
-    programmaticWriteCountRef.current += 1;
-    lastProgrammaticWriteRef.current = { at: performance.now(), top: nextTop };
-  }, []);
-  const cancelPendingStick = useCallback(() => {
-    if (pendingStickRafRef.current !== null) {
-      cancelAnimationFrame(pendingStickRafRef.current);
-      pendingStickRafRef.current = null;
-    }
-    stickRequestedRef.current = false;
-  }, []);
-  const cancelReturn = useCallback(() => {
-    if (returnRafRef.current !== null) {
-      cancelAnimationFrame(returnRafRef.current);
-      returnRafRef.current = null;
+    if (prefersReducedMotionRef.current) {
+      cancelPendingStick(), cancelReturn(), setModeBoth("STICKY_INSTANT"), writeScrollTop(measure(viewport).maxScrollTop), prevScrollTopRef.current = viewport.scrollTop, updateDebug();
+      return;
     }
-    returnAnimRef.current = null;
-  }, []);
-  const stickToBottomInstant = useCallback(() => {
-    const viewport = viewportRef.current;
-    if (!viewport) return;
-    stickRequestedRef.current = true;
-    if (pendingStickRafRef.current !== null) return;
-    pendingStickRafRef.current = requestAnimationFrame(() => {
-      pendingStickRafRef.current = null;
-      if (!stickRequestedRef.current) return;
-      stickRequestedRef.current = false;
-      if (modeRef.current !== "STICKY_INSTANT") return;
-      const m = measure(viewport);
-      writeScrollTop(m.maxScrollTop);
-      updateDebug();
-    });
-  }, [updateDebug, writeScrollTop]);
-  const startReturnToBottomSmooth = useCallback(() => {
-    const viewport = viewportRef.current;
-    if (!viewport) return;
-    cancelPendingStick();
-    cancelReturn();
-    const initial = measure(viewport);
+    cancelPendingStick(), cancelReturn();
+    let initial = measure(viewport);
     if (initial.distanceToBottom <= EPS_BOTTOM_PX) {
-      setModeBoth("STICKY_INSTANT");
-      stickToBottomInstant();
-      updateDebug();
+      setModeBoth("STICKY_INSTANT"), stickToBottomInstant(), updateDebug();
       return;
     }
-    const durationMs = Math.max(
+    let durationMs = Math.max(
       RETURN_MIN_MS,
       Math.min(RETURN_MAX_MS, initial.distanceToBottom / RETURN_PX_PER_MS)
     );
@@ -552,118 +163,60 @@ function BottomStickScrollArea({
       startTop: initial.scrollTop,
       durationMs,
       settleFrames: 0
-    };
-    setModeBoth("RETURNING_SMOOTH");
-    const tick = (now2) => {
-      const viewportCurrent = viewportRef.current;
-      const anim = returnAnimRef.current;
+    }, setModeBoth("RETURNING_SMOOTH");
+    let tick = (now) => {
+      let viewportCurrent = viewportRef.current, anim = returnAnimRef.current;
       if (!viewportCurrent || !anim || modeRef.current !== "RETURNING_SMOOTH") {
         cancelReturn();
         return;
       }
-      const before = measure(viewportCurrent);
-      const progress = clamp01((now2 - anim.startTime) / anim.durationMs);
-      const eased = easeOutCubic(progress);
-      const targetBottom = before.maxScrollTop;
-      let nextTop = anim.startTop + (targetBottom - anim.startTop) * eased;
-      if (nextTop < before.scrollTop) {
-        nextTop = before.scrollTop;
-      }
-      writeScrollTop(nextTop);
-      const after = measure(viewportCurrent);
-      if (after.distanceToBottom <= EPS_BOTTOM_PX) {
-        anim.settleFrames += 1;
-      } else {
-        anim.settleFrames = 0;
-      }
-      const doneByTime = progress >= 1;
-      const doneBySettle = anim.settleFrames >= RETURN_SETTLE_FRAMES && progress >= 0.6;
+      let before = measure(viewportCurrent), progress = clamp01((now - anim.startTime) / anim.durationMs), eased = easeOutCubic(progress), targetBottom = before.maxScrollTop, nextTop = anim.startTop + (targetBottom - anim.startTop) * eased;
+      nextTop < before.scrollTop && (nextTop = before.scrollTop), writeScrollTop(nextTop), measure(viewportCurrent).distanceToBottom <= EPS_BOTTOM_PX ? anim.settleFrames += 1 : anim.settleFrames = 0;
+      let doneByTime = progress >= 1, doneBySettle = anim.settleFrames >= RETURN_SETTLE_FRAMES && progress >= 0.6;
       if (doneByTime && doneBySettle) {
-        cancelReturn();
-        setModeBoth("STICKY_INSTANT");
-        stickToBottomInstant();
-        updateDebug();
+        cancelReturn(), setModeBoth("STICKY_INSTANT"), stickToBottomInstant(), updateDebug();
         return;
       }
-      updateDebug();
-      returnRafRef.current = requestAnimationFrame(tick);
+      updateDebug(), returnRafRef.current = requestAnimationFrame(tick);
     };
     returnRafRef.current = requestAnimationFrame(tick);
-  }, [cancelPendingStick, cancelReturn, setModeBoth, stickToBottomInstant, updateDebug, writeScrollTop]);
-  const onViewportScroll = useCallback(
+  }, [cancelPendingStick, cancelReturn, setModeBoth, stickToBottomInstant, updateDebug, writeScrollTop]), onViewportScroll = useCallback(
     (event) => {
-      const viewport = event.currentTarget;
-      const m = measure(viewport);
+      let viewport = event.currentTarget, m = measure(viewport);
       setIsOverflowing((previous) => previous === m.isOverflowing ? previous : m.isOverflowing);
-      const previousTop = prevScrollTopRef.current;
-      const delta = m.scrollTop - previousTop;
-      const lastWrite = lastProgrammaticWriteRef.current;
-      const wroteRecently = lastWrite !== null && performance.now() - lastWrite.at < 60;
-      const isLikelyOwnWrite = wroteRecently && lastWrite !== null && Math.abs(m.scrollTop - lastWrite.top) <= 2;
-      if (modeRef.current === "RETURNING_SMOOTH") {
-        if (!isLikelyOwnWrite && delta < -DETACH_SCROLL_DELTA_PX) {
-          cancelReturn();
-          setModeBoth("DETACHED");
-        }
-      } else if (modeRef.current === "STICKY_INSTANT") {
-        if (!isLikelyOwnWrite && delta < -DETACH_SCROLL_DELTA_PX && m.isOverflowing) {
-          cancelPendingStick();
-          setModeBoth("DETACHED");
-        }
-      } else if (modeRef.current === "DETACHED") {
-        if (m.distanceToBottom <= EPS_BOTTOM_PX) {
-          setModeBoth("STICKY_INSTANT");
-          stickToBottomInstant();
-        }
-      }
-      prevScrollTopRef.current = m.scrollTop;
-      updateDebug();
+      let previousTop = prevScrollTopRef.current, delta = m.scrollTop - previousTop, lastWrite = lastProgrammaticWriteRef.current, isLikelyOwnWrite = lastWrite !== null && performance.now() - lastWrite.at < 60 && lastWrite !== null && Math.abs(m.scrollTop - lastWrite.top) <= 2;
+      modeRef.current === "RETURNING_SMOOTH" ? !isLikelyOwnWrite && delta < -DETACH_SCROLL_DELTA_PX && (cancelReturn(), setModeBoth("DETACHED")) : modeRef.current === "STICKY_INSTANT" ? !isLikelyOwnWrite && delta < -DETACH_SCROLL_DELTA_PX && m.isOverflowing && (cancelPendingStick(), setModeBoth("DETACHED")) : modeRef.current === "DETACHED" && m.distanceToBottom <= EPS_BOTTOM_PX && (setModeBoth("STICKY_INSTANT"), stickToBottomInstant()), prevScrollTopRef.current = m.scrollTop, updateDebug();
     },
     [cancelPendingStick, cancelReturn, setModeBoth, stickToBottomInstant, updateDebug]
   );
   useEffect(() => {
-    const viewport = viewportRef.current;
-    const content = contentRef.current;
+    let viewport = viewportRef.current, content = contentRef.current;
     if (!viewport || !content) return;
-    const observer = new ResizeObserver(() => {
-      const m = measure(viewport);
-      setIsOverflowing((previous) => previous === m.isOverflowing ? previous : m.isOverflowing);
-      if (modeRef.current === "STICKY_INSTANT") {
-        stickToBottomInstant();
-      }
-      updateDebug();
+    let observer = new ResizeObserver(() => {
+      let m = measure(viewport);
+      setIsOverflowing((previous) => previous === m.isOverflowing ? previous : m.isOverflowing), modeRef.current === "STICKY_INSTANT" && stickToBottomInstant(), updateDebug();
     });
-    observer.observe(content);
-    observer.observe(viewport);
-    return () => observer.disconnect();
-  }, [stickToBottomInstant, updateDebug]);
-  useLayoutEffect(() => {
-    const viewport = viewportRef.current;
+    return observer.observe(content), observer.observe(viewport), () => observer.disconnect();
+  }, [stickToBottomInstant, updateDebug]), useLayoutEffect(() => {
+    let viewport = viewportRef.current;
     if (!viewport) return;
     setModeBoth("STICKY_INSTANT");
-    const initial = measure(viewport);
-    writeScrollTop(initial.maxScrollTop);
-    prevScrollTopRef.current = viewport.scrollTop;
-    setIsOverflowing(initial.isOverflowing);
-    setDistanceToBottom(initial.distanceToBottom);
-    updateDebug();
-  }, [setModeBoth, updateDebug, writeScrollTop]);
-  useEffect(() => {
-    return () => {
-      cancelPendingStick();
-      cancelReturn();
-    };
+    let initial = measure(viewport);
+    writeScrollTop(initial.maxScrollTop), prevScrollTopRef.current = viewport.scrollTop, setIsOverflowing(initial.isOverflowing), setDistanceToBottom(initial.distanceToBottom), updateDebug();
+  }, [setModeBoth, updateDebug, writeScrollTop]), useLayoutEffect(() => {
+    if (typeof window > "u" || typeof window.matchMedia != "function") return;
+    let mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)"), onChange = () => reducedMotionChangeHandlerRef.current(mediaQuery.matches);
+    return onChange(), typeof mediaQuery.addEventListener == "function" ? (mediaQuery.addEventListener("change", onChange), () => mediaQuery.removeEventListener("change", onChange)) : (mediaQuery.addListener(onChange), () => mediaQuery.removeListener(onChange));
+  }, []), useEffect(() => () => {
+    cancelPendingStick(), cancelReturn();
   }, [cancelPendingStick, cancelReturn]);
-  const canJump = isOverflowing && mode === "DETACHED";
-  const jumpButton = renderJumpToBottom?.({
+  let canJump = isOverflowing && mode === "DETACHED", jumpButton = renderJumpToBottom?.({
     mode,
     canJump,
     isOverflowing,
     distanceToBottom,
     jumpToBottom: startReturnToBottomSmooth
-  }) ?? /* @__PURE__ */ jsx(DefaultJumpButton, { canJump, jumpToBottom: startReturnToBottomSmooth });
-  const jumpContainerClassNameBase = "pointer-events-none absolute z-20";
-  const jumpContainerStyle = {
+  }) ?? /* @__PURE__ */ jsx(DefaultJumpButton, { canJump, jumpToBottom: startReturnToBottomSmooth }), jumpContainerClassNameBase = "pointer-events-none absolute z-20", jumpContainerStyle = {
     position: "absolute",
     zIndex: 20,
     left: 0,
@@ -672,8 +225,8 @@ function BottomStickScrollArea({
     display: "flex",
     justifyContent: "center",
     opacity: canJump ? 1 : 0,
-    transform: canJump ? "translateY(0px)" : "translateY(4px)",
-    transition: "opacity 150ms ease, transform 150ms ease",
+    transform: prefersReducedMotion ? "none" : canJump ? "translateY(0px)" : "translateY(4px)",
+    transition: prefersReducedMotion ? "none" : "opacity 150ms ease, transform 150ms ease",
     pointerEvents: "none"
   };
   return /* @__PURE__ */ jsxs("div", { className: joinClasses("relative h-full w-full overflow-hidden", className), children: [
@@ -683,6 +236,9 @@ function BottomStickScrollArea({
         ref: viewportRef,
         className: joinClasses("h-full w-full overflow-auto", viewportClassName),
         onScroll: onViewportScroll,
+        onWheel: interruptReturnForUserIntent,
+        onTouchStart: interruptReturnForUserIntent,
+        onKeyDown: onViewportKeyDown,
         "data-testid": "sticky-scroll-viewport",
         children: /* @__PURE__ */ jsx("div", { ref: contentRef, className: joinClasses("flex min-h-full w-full flex-col", contentClassName), children })
       }
@@ -699,200 +255,1102 @@ function BottomStickScrollArea({
   ] });
 }
 
-// src/components/index.ts
-import { createTrustedHTML, sanitizeHTML } from "@stream-mdx/core";
+// src/components/diff-renderer.tsx
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var DefaultDiffRenderer = ({
+  meta,
+  renderCode,
+  className = "",
+  style
+}) => {
+  let diffBlocks = Array.isArray(meta?.diffBlocks) ? meta.diffBlocks : null;
+  return !diffBlocks || diffBlocks.length === 0 ? /* @__PURE__ */ jsx2(Fragment, { children: renderCode }) : /* @__PURE__ */ jsx2(
+    "div",
+    {
+      className: `stream-mdx-diff-container my-4 rounded-md border border-border bg-muted/20 font-mono text-sm overflow-hidden ${className}`.trim(),
+      style,
+      children: diffBlocks.map((diffBlock, bIdx) => /* @__PURE__ */ jsxs2("div", { className: "stream-mdx-diff-block", children: [
+        (diffBlock.filePath || diffBlock.additions != null || diffBlock.deletions != null) && /* @__PURE__ */ jsxs2("div", { className: "stream-mdx-diff-header flex items-center justify-between border-b border-border bg-muted/40 px-4 py-2 text-xs font-semibold text-muted-foreground", children: [
+          /* @__PURE__ */ jsx2("span", { className: "stream-mdx-diff-filepath", children: diffBlock.filePath ?? "diff" }),
+          /* @__PURE__ */ jsxs2("span", { className: "stream-mdx-diff-stats flex gap-2", children: [
+            diffBlock.additions != null && /* @__PURE__ */ jsxs2("span", { className: "stream-mdx-diff-stat-add text-green-600 dark:text-green-400", children: [
+              "+",
+              diffBlock.additions
+            ] }),
+            diffBlock.deletions != null && /* @__PURE__ */ jsxs2("span", { className: "stream-mdx-diff-stat-del text-red-600 dark:text-red-400", children: [
+              "-",
+              diffBlock.deletions
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx2("div", { className: "stream-mdx-diff-lines overflow-x-auto", children: /* @__PURE__ */ jsx2("table", { className: "w-full border-collapse font-mono text-xs", children: /* @__PURE__ */ jsx2("tbody", { children: diffBlock.lines.map((line, lIdx) => {
+          let kindClass = `diff-line-${line.kind} ${line.kind === "add" ? "bg-green-500/10 text-green-900 dark:text-green-200" : line.kind === "del" ? "bg-red-500/10 text-red-900 dark:text-red-200" : line.kind === "hunk" ? "bg-blue-500/10 text-blue-800 dark:text-blue-300 font-semibold" : line.kind === "meta" ? "bg-muted/50 text-muted-foreground italic" : "text-foreground"}`;
+          return /* @__PURE__ */ jsxs2(
+            "tr",
+            {
+              className: `stream-mdx-diff-row ${kindClass}`,
+              "data-diff-kind": line.kind,
+              children: [
+                /* @__PURE__ */ jsx2("td", { className: "stream-mdx-diff-old-no select-none px-2 py-0.5 text-right opacity-50 w-10", children: line.oldNo != null ? line.oldNo : "" }),
+                /* @__PURE__ */ jsx2("td", { className: "stream-mdx-diff-new-no select-none px-2 py-0.5 text-right opacity-50 w-10", children: line.newNo != null ? line.newNo : "" }),
+                /* @__PURE__ */ jsx2("td", { className: "stream-mdx-diff-prefix select-none px-1 py-0.5 text-center w-4 font-bold", children: line.kind === "add" ? "+" : line.kind === "del" ? "-" : line.kind === "hunk" ? "@" : " " }),
+                /* @__PURE__ */ jsx2("td", { className: "stream-mdx-diff-content px-2 py-0.5 whitespace-pre", children: line.tokens && line.tokens.length > 0 ? line.tokens.map((token, tIdx) => /* @__PURE__ */ jsx2(
+                  "span",
+                  {
+                    style: {
+                      color: token.color ?? void 0,
+                      fontStyle: token.fontStyle === 1 || token.fontStyle === 3 ? "italic" : void 0,
+                      fontWeight: token.fontStyle === 2 || token.fontStyle === 3 ? "bold" : void 0
+                    },
+                    children: token.content
+                  },
+                  tIdx
+                )) : /* @__PURE__ */ jsx2("span", { children: line.raw.replace(/^[+\- ]/, "") }) })
+              ]
+            },
+            lIdx
+          );
+        }) }) }) })
+      ] }, bIdx))
+    }
+  );
+};
+DefaultDiffRenderer.displayName = "DefaultDiffRenderer";
 
-// src/mdx-hydration-metrics.ts
-var entries = /* @__PURE__ */ new Map();
-var lastHydrationMs = null;
-function now() {
-  if (typeof performance !== "undefined" && typeof performance.now === "function") {
-    return performance.now();
-  }
-  return Date.now();
-}
-function markMdxHydrationStart(id) {
-  if (!id) return;
-  const entry = entries.get(id) ?? { status: "compiled" };
-  if (entry.startedAt === void 0) {
-    entry.startedAt = now();
-  }
-  entry.status = "compiled";
-  entries.set(id, entry);
-}
-function markMdxHydrated(id) {
-  if (!id) return;
-  const entry = entries.get(id) ?? { status: "hydrated" };
-  if (entry.startedAt === void 0) {
-    entry.startedAt = now();
-  }
-  entry.hydratedAt = now();
-  entry.status = "hydrated";
-  entries.set(id, entry);
-  lastHydrationMs = entry.startedAt ? entry.hydratedAt - entry.startedAt : null;
-}
-function markMdxHydrationError(id) {
-  if (!id) return;
-  const entry = entries.get(id) ?? { status: "error" };
-  entry.status = "error";
-  entries.set(id, entry);
+// src/components/katex-math.tsx
+import { createContext, useContext, useEffect as useEffect2, useMemo, useRef as useRef2, useState as useState2 } from "react";
+import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var katexPromise = null;
+async function loadKaTeX() {
+  return katexPromise || (katexPromise = import("katex").then((mod) => mod && typeof mod == "object" && "default" in mod && mod.default ? mod.default : mod)), katexPromise;
 }
-
-// src/mdx-hydration-context.ts
-import React from "react";
-var MdxHydrationContext = React.createContext({ controller: null });
-
-// src/mdx-runtime.ts
-var mdxRuntimePromise = null;
-function loadMdxRuntime() {
-  if (!mdxRuntimePromise) {
-    mdxRuntimePromise = Promise.resolve().then(() => (init_mdx_client(), mdx_client_exports));
+var DOCUMENT_POSITION_PRECEDING = 2, DOCUMENT_POSITION_FOLLOWING = 4, DocumentMathMacroScope = class {
+  constructor() {
+    this.entries = /* @__PURE__ */ new Set();
+    this.orderedEntries = [];
+    this.macroSnapshots = [];
+    this.katex = null;
+    this.loadError = null;
+    this.loading = !1;
+    this.disposed = !1;
   }
-  return mdxRuntimePromise;
-}
-
-// src/renderer/use-deferred-render.ts
-import { useEffect as useEffect2, useState as useState2 } from "react";
-function useDeferredRender(ref, options) {
-  const enabled = options?.enabled ?? true;
-  const [shouldRender, setShouldRender] = useState2(!enabled);
-  useEffect2(() => {
-    if (!enabled) {
-      setShouldRender(true);
-      return;
+  register(element, tex, displayMode, complete, publish) {
+    let entry = { element, tex, displayMode, complete, publish };
+    return this.entries.add(entry), this.refresh(), () => {
+      this.entries.delete(entry) && this.refresh();
+    };
+  }
+  dispose() {
+    this.disposed = !0, this.entries.clear(), this.orderedEntries = [], this.macroSnapshots = [];
+  }
+  refresh() {
+    if (!this.disposed) {
+      if (this.loadError) {
+        for (let entry of this.entries)
+          entry.publish({ tex: entry.tex, displayMode: entry.displayMode, scope: this, error: this.loadError });
+        return;
+      }
+      if (this.katex) {
+        this.recompute(this.katex);
+        return;
+      }
+      this.loading || (this.loading = !0, loadKaTeX().then((katex) => {
+        this.disposed || (this.katex = katex, this.refresh());
+      }).catch((reason) => {
+        if (!this.disposed) {
+          this.loadError = reason instanceof Error ? reason : new Error(String(reason));
+          for (let entry of this.entries)
+            entry.publish({ tex: entry.tex, displayMode: entry.displayMode, scope: this, error: this.loadError });
+        }
+      }).finally(() => {
+        this.loading = !1;
+      }));
     }
-    const target = ref.current;
-    if (!target) {
-      return;
+  }
+  recompute(katex) {
+    let nextEntries = [...this.entries].sort((left, right) => {
+      let position = left.element.compareDocumentPosition(right.element);
+      return position & DOCUMENT_POSITION_FOLLOWING ? -1 : position & DOCUMENT_POSITION_PRECEDING ? 1 : 0;
+    }), unchangedPrefix = 0;
+    for (; unchangedPrefix < this.orderedEntries.length && unchangedPrefix < nextEntries.length && this.orderedEntries[unchangedPrefix] === nextEntries[unchangedPrefix]; )
+      unchangedPrefix += 1;
+    let macros = unchangedPrefix > 0 ? { ...this.macroSnapshots[unchangedPrefix - 1] } : {};
+    this.orderedEntries = nextEntries, this.macroSnapshots.length = unchangedPrefix;
+    for (let index = unchangedPrefix; index < nextEntries.length; index += 1) {
+      let entry = nextEntries[index], preparation = null;
+      if (entry.complete) {
+        let nextMacros = { ...macros };
+        try {
+          let html = katex.renderToString(entry.tex, {
+            displayMode: entry.displayMode,
+            throwOnError: !1,
+            trust: !1,
+            maxExpand: 1e3,
+            macros: nextMacros
+          });
+          macros = nextMacros, preparation = { tex: entry.tex, displayMode: entry.displayMode, scope: this, html };
+        } catch (reason) {
+          preparation = {
+            tex: entry.tex,
+            displayMode: entry.displayMode,
+            scope: this,
+            error: reason instanceof Error ? reason : new Error(String(reason))
+          };
+        }
+      }
+      this.macroSnapshots[index] = { ...macros }, entry.publish(preparation);
     }
-    let cancelled = false;
-    let idleId = null;
-    let timerId = null;
-    const scheduleRender = () => {
-      if (cancelled) return;
-      setShouldRender(true);
+  }
+}, DocumentMathMacroScopeContext = createContext(null), MathExpressionCompletenessContext = createContext(!0), MathEngineOutputView = ({ engine, tex, displayMode }) => {
+  let output = useMemo(
+    () => engine.render(tex, { displayMode }),
+    [engine, engine.id, tex, displayMode]
+  );
+  return /* @__PURE__ */ jsx3(Fragment2, { children: output });
+};
+function useMathPreparation(tex, displayMode, elementRef, enabled) {
+  let scope = useContext(DocumentMathMacroScopeContext), complete = useContext(MathExpressionCompletenessContext), [preparation, setPreparation] = useState2(null);
+  return useEffect2(() => {
+    if (!enabled) return;
+    let active = !0;
+    if (scope) {
+      let element = elementRef.current;
+      return element ? scope.register(element, tex, displayMode, complete, (result) => {
+        active && setPreparation(result);
+      }) : () => {
+        active = !1;
+      };
+    }
+    return (async () => {
+      try {
+        let html = (await loadKaTeX()).renderToString(tex, {
+          displayMode,
+          throwOnError: !1,
+          trust: !1,
+          maxExpand: 1e3
+        });
+        active && setPreparation({ tex, displayMode, scope: null, html });
+      } catch (reason) {
+        active && setPreparation({
+          tex,
+          displayMode,
+          scope: null,
+          error: reason instanceof Error ? reason : new Error(String(reason))
+        });
+      }
+    })(), () => {
+      active = !1;
     };
-    const runWithIdle = () => {
-      if (typeof globalThis.requestIdleCallback === "function") {
-        idleId = globalThis.requestIdleCallback(scheduleRender, { timeout: options?.idleTimeoutMs ?? 200 });
-      } else {
-        timerId = window.setTimeout(scheduleRender, options?.idleTimeoutMs ?? 200);
+  }, [tex, displayMode, scope, complete, elementRef, enabled]), scope && !complete ? null : preparation?.tex === tex && preparation.displayMode === displayMode && preparation.scope === scope ? preparation : null;
+}
+var KaTeXInlineMath = ({ tex, className = "", fallback, engine }) => {
+  let elementRef = useRef2(null), preparation = useMathPreparation(tex, !1, elementRef, !engine);
+  return engine ? /* @__PURE__ */ jsx3("span", { className: `math-inline ${className}`.trim(), "data-tex": tex, children: /* @__PURE__ */ jsx3(MathEngineOutputView, { engine, tex, displayMode: !1 }) }) : preparation && "error" in preparation && fallback ? /* @__PURE__ */ jsx3(Fragment2, { children: fallback(tex, preparation.error) }) : preparation && "html" in preparation ? /* @__PURE__ */ jsx3(
+    "span",
+    {
+      ref: elementRef,
+      className: `math-inline katex-inline ${className}`.trim(),
+      "data-tex": tex,
+      dangerouslySetInnerHTML: { __html: preparation.html }
+    }
+  ) : /* @__PURE__ */ jsxs3("span", { ref: elementRef, className: `math-inline ${className}`.trim(), "data-tex": tex, children: [
+    "$",
+    tex,
+    "$"
+  ] });
+};
+KaTeXInlineMath.displayName = "KaTeXInlineMath";
+var KaTeXBlockMath = ({ tex, className = "", fallback, engine }) => {
+  let elementRef = useRef2(null), preparation = useMathPreparation(tex, !0, elementRef, !engine);
+  return engine ? /* @__PURE__ */ jsx3(
+    "div",
+    {
+      className: `math-display markdown-math-display ${className}`.trim(),
+      "data-tex": tex,
+      style: { overflowX: "auto" },
+      children: /* @__PURE__ */ jsx3(MathEngineOutputView, { engine, tex, displayMode: !0 })
+    }
+  ) : preparation && "error" in preparation && fallback ? /* @__PURE__ */ jsx3(Fragment2, { children: fallback(tex, preparation.error) }) : preparation && "html" in preparation ? /* @__PURE__ */ jsx3(
+    "div",
+    {
+      ref: elementRef,
+      className: `math-display katex-block markdown-math-display ${className}`.trim(),
+      "data-tex": tex,
+      style: { overflowX: "auto" },
+      dangerouslySetInnerHTML: { __html: preparation.html }
+    }
+  ) : /* @__PURE__ */ jsx3(
+    "div",
+    {
+      ref: elementRef,
+      className: `math-display markdown-math-display ${className}`.trim(),
+      "data-tex": tex,
+      style: { overflowX: "auto" },
+      children: /* @__PURE__ */ jsxs3("span", { className: "math-display-content", children: [
+        "$$",
+        tex,
+        "$$"
+      ] })
+    }
+  );
+};
+KaTeXBlockMath.displayName = "KaTeXBlockMath";
+
+// src/components/controls.tsx
+import React2, { useCallback as useCallback2, useState as useState3 } from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var DEFAULT_CONTROLS_LABELS = {
+  copy: "Copy code",
+  copied: "Copied!",
+  copyError: "Failed to copy",
+  download: "Download snippet",
+  downloadCsv: "Download CSV",
+  downloadTsv: "Download TSV",
+  downloadMarkdown: "Download Markdown",
+  copyTsv: "Copy TSV",
+  copyMarkdown: "Copy Markdown",
+  copyTable: "Copy table",
+  fullscreen: "Enter fullscreen",
+  exitFullscreen: "Exit fullscreen"
+}, LANGUAGE_EXTENSION_MAP = {
+  javascript: "js",
+  js: "js",
+  mjs: "mjs",
+  cjs: "cjs",
+  typescript: "ts",
+  ts: "ts",
+  mts: "mts",
+  cts: "cts",
+  jsx: "jsx",
+  tsx: "tsx",
+  python: "py",
+  py: "py",
+  rust: "rs",
+  rs: "rs",
+  ruby: "rb",
+  rb: "rb",
+  go: "go",
+  golang: "go",
+  c: "c",
+  cpp: "cpp",
+  "c++": "cpp",
+  csharp: "cs",
+  "c#": "cs",
+  cs: "cs",
+  java: "java",
+  kotlin: "kt",
+  kt: "kt",
+  swift: "swift",
+  php: "php",
+  html: "html",
+  css: "css",
+  scss: "scss",
+  sass: "sass",
+  less: "less",
+  json: "json",
+  jsonc: "jsonc",
+  yaml: "yaml",
+  yml: "yaml",
+  toml: "toml",
+  xml: "xml",
+  svg: "svg",
+  markdown: "md",
+  md: "md",
+  mdx: "mdx",
+  sh: "sh",
+  bash: "sh",
+  shell: "sh",
+  zsh: "sh",
+  sql: "sql",
+  diff: "diff",
+  dockerfile: "dockerfile",
+  makefile: "makefile",
+  graphql: "graphql",
+  gql: "graphql",
+  lua: "lua",
+  r: "r",
+  scala: "scala",
+  perl: "pl",
+  pl: "pl",
+  mermaid: "mmd",
+  latex: "tex",
+  tex: "tex",
+  ini: "ini",
+  env: "env",
+  text: "txt",
+  txt: "txt"
+};
+function getExtensionForLanguage(lang) {
+  if (!lang) return "txt";
+  let clean = lang.trim().toLowerCase().split(/\s+/)[0] ?? "";
+  return clean ? LANGUAGE_EXTENSION_MAP[clean] ? LANGUAGE_EXTENSION_MAP[clean] : /^[a-z0-9]+$/.test(clean) ? clean : "txt" : "txt";
+}
+function getCodeSnippetFilename(lang) {
+  return `snippet.${getExtensionForLanguage(lang)}`;
+}
+async function copyToClipboard(text) {
+  if (typeof navigator > "u" || !navigator.clipboard?.writeText)
+    return !1;
+  try {
+    return await navigator.clipboard.writeText(text), !0;
+  } catch {
+    return !1;
+  }
+}
+function downloadFile(content, filename, mimeType = "text/plain;charset=utf-8") {
+  if (!(typeof window > "u" || typeof document > "u"))
+    try {
+      let blob = new Blob([content], { type: mimeType }), url = URL.createObjectURL(blob), a = document.createElement("a");
+      a.href = url, a.download = filename, a.style.display = "none", document.body.appendChild(a);
+      try {
+        a.click();
+      } finally {
+        document.body.removeChild(a), setTimeout(() => {
+          try {
+            URL.revokeObjectURL(url);
+          } catch {
+          }
+        }, 100);
       }
+    } catch {
+    }
+}
+function escapeCsvCell(cell) {
+  return /[",\r\n]/.test(cell) ? `"${cell.replace(/"/g, '""')}"` : cell;
+}
+function escapeTsvCell(cell) {
+  return cell.replace(/\t/g, " ").replace(/\r?\n/g, " ");
+}
+function tableToCsv(headers, rows) {
+  let lines = [];
+  headers.length > 0 && lines.push(headers.map(escapeCsvCell).join(","));
+  for (let row of rows)
+    lines.push(row.map(escapeCsvCell).join(","));
+  return lines.join(`
+`);
+}
+function tableToTsv(headers, rows) {
+  let lines = [];
+  headers.length > 0 && lines.push(headers.map(escapeTsvCell).join("	"));
+  for (let row of rows)
+    lines.push(row.map(escapeTsvCell).join("	"));
+  return lines.join(`
+`);
+}
+function tableToMarkdown(headers, rows, align) {
+  if (headers.length === 0 && rows.length === 0) return "";
+  let columnCount = Math.max(headers.length, ...rows.map((r) => r.length));
+  if (columnCount === 0) return "";
+  let padRow = (row) => {
+    let padded = [...row];
+    for (; padded.length < columnCount; ) padded.push("");
+    return padded.map((cell) => cell.replace(/\r?\n/g, " ").replace(/\|/g, "\\|"));
+  }, headerLine = `| ${padRow(headers.length > 0 ? headers : Array(columnCount).fill("")).join(" | ")} |`, separatorLine = `| ${Array.from({ length: columnCount }, (_, i) => {
+    let a = align?.[i];
+    return a === "center" ? ":---:" : a === "right" ? "---:" : a === "left" ? ":---" : "---";
+  }).join(" | ")} |`, dataLines = rows.map((row) => `| ${padRow(row).join(" | ")} |`);
+  return [headerLine, separatorLine, ...dataLines].join(`
+`);
+}
+function inlineToPlainText(nodes) {
+  if (!Array.isArray(nodes) || nodes.length === 0) return "";
+  let out = "";
+  for (let node of nodes)
+    if (node)
+      switch (node.kind) {
+        case "text":
+        case "code":
+          out += node.text ?? "";
+          break;
+        case "strong":
+        case "em":
+        case "strike":
+          out += inlineToPlainText(node.children);
+          break;
+        case "link":
+          out += inlineToPlainText(node.children) || node.title || node.href || "";
+          break;
+        case "image":
+          out += node.alt || node.title || "";
+          break;
+        case "br":
+          out += `
+`;
+          break;
+        case "html":
+          Array.isArray(node.children) && node.children.length > 0 ? out += inlineToPlainText(node.children) : node.raw && (/<br\s*\/?>/i.test(node.raw) ? out += `
+` : out += node.raw.replace(/<[^>]*>/g, ""));
+          break;
+        case "math-inline":
+        case "math-display":
+          out += node.tex ?? "";
+          break;
+        case "mention":
+          out += `@${node.handle ?? ""}`;
+          break;
+        case "citation":
+          out += `[${node.id ?? ""}]`;
+          break;
+        case "footnote-ref":
+          out += `[${node.label ?? ""}]`;
+          break;
+        case "plugin":
+          Array.isArray(node.children) ? out += inlineToPlainText(node.children) : out += node.raw ?? "";
+          break;
+        default: {
+          let generic = node;
+          generic && typeof generic == "object" && ("text" in generic && typeof generic.text == "string" ? out += generic.text : "children" in generic && Array.isArray(generic.children) && (out += inlineToPlainText(generic.children)));
+          break;
+        }
+      }
+  return out;
+}
+function resolveCodeControls(config) {
+  if (!config)
+    return { enabled: !1, copy: !1, download: !1, labels: DEFAULT_CONTROLS_LABELS };
+  let labels = {
+    ...DEFAULT_CONTROLS_LABELS,
+    ...typeof config == "object" ? config.labels : void 0
+  };
+  if (config === !0)
+    return { enabled: !0, copy: !0, download: !0, labels };
+  let codeOpt = config.code;
+  if (!codeOpt)
+    return { enabled: !1, copy: !1, download: !1, labels };
+  if (codeOpt === !0)
+    return { enabled: !0, copy: !0, download: !0, labels };
+  let copy = !!codeOpt.copy, download = !!codeOpt.download;
+  return { enabled: copy || download, copy, download, labels };
+}
+function resolveTableControls(config) {
+  if (!config)
+    return {
+      enabled: !1,
+      copy: !1,
+      copyFormats: [],
+      download: !1,
+      downloadFormats: [],
+      labels: DEFAULT_CONTROLS_LABELS
+    };
+  let labels = {
+    ...DEFAULT_CONTROLS_LABELS,
+    ...typeof config == "object" ? config.labels : void 0
+  };
+  if (config === !0)
+    return {
+      enabled: !0,
+      copy: !0,
+      copyFormats: ["tsv", "markdown"],
+      download: !0,
+      downloadFormats: ["csv"],
+      labels
+    };
+  let tableOpt = config.table;
+  if (!tableOpt)
+    return {
+      enabled: !1,
+      copy: !1,
+      copyFormats: [],
+      download: !1,
+      downloadFormats: [],
+      labels: DEFAULT_CONTROLS_LABELS
     };
-    const observer = new IntersectionObserver(
-      (entries2) => {
-        for (const entry of entries2) {
-          if (entry.isIntersecting || entry.intersectionRatio > 0) {
-            observer.disconnect();
-            const debounceMs = options?.debounceMs ?? 80;
-            timerId = window.setTimeout(runWithIdle, debounceMs);
-            return;
+  if (tableOpt === !0)
+    return {
+      enabled: !0,
+      copy: !0,
+      copyFormats: ["tsv", "markdown"],
+      download: !0,
+      downloadFormats: ["csv"],
+      labels
+    };
+  let copyVal = tableOpt.copy, copy = !!copyVal, copyFormats = Array.isArray(copyVal) ? copyVal : copyVal ? ["tsv", "markdown"] : [], downloadVal = tableOpt.download, download = !!downloadVal, downloadFormats = Array.isArray(downloadVal) ? downloadVal : downloadVal ? ["csv"] : [];
+  return {
+    enabled: copy || download,
+    copy,
+    copyFormats,
+    download,
+    downloadFormats,
+    labels
+  };
+}
+function resolveMermaidControls(config) {
+  if (!config)
+    return { enabled: !1, copy: !1, fullscreen: !1, labels: DEFAULT_CONTROLS_LABELS };
+  let labels = {
+    ...DEFAULT_CONTROLS_LABELS,
+    ...typeof config == "object" ? config.labels : void 0
+  };
+  if (config === !0)
+    return { enabled: !0, copy: !0, fullscreen: !1, labels };
+  let mermaidOpt = config.mermaid;
+  if (!mermaidOpt)
+    return { enabled: !1, copy: !1, fullscreen: !1, labels };
+  if (mermaidOpt === !0)
+    return { enabled: !0, copy: !0, fullscreen: !1, labels };
+  let copy = !!mermaidOpt.copy, fullscreen = !!mermaidOpt.fullscreen;
+  return { enabled: copy || fullscreen, copy, fullscreen, labels };
+}
+function resolveControlsConfig(config) {
+  return {
+    code: resolveCodeControls(config),
+    table: resolveTableControls(config),
+    mermaid: resolveMermaidControls(config)
+  };
+}
+var CodeControlsBar = ({ code, language, config, className }) => {
+  let [copied, setCopied] = useState3(!1), { labels } = config, handleCopy = useCallback2(async () => {
+    await copyToClipboard(code) && (setCopied(!0), setTimeout(() => setCopied(!1), 2e3));
+  }, [code]), handleDownload = useCallback2(() => {
+    let filename = getCodeSnippetFilename(language);
+    downloadFile(code, filename);
+  }, [code, language]);
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: `stream-mdx-controls stream-mdx-code-controls flex items-center justify-end gap-1 px-2 py-1 text-xs select-none ${className ?? ""}`.trim(),
+      "data-stream-mdx-controls": "code",
+      children: [
+        language ? /* @__PURE__ */ jsx4("span", { className: "stream-mdx-code-language mr-auto text-muted-foreground opacity-60 text-[11px] font-mono", children: language }) : null,
+        config.copy ? /* @__PURE__ */ jsx4(
+          "button",
+          {
+            type: "button",
+            className: "stream-mdx-control stream-mdx-control-copy stream-mdx-control-code-copy inline-flex items-center gap-1 rounded px-2 py-0.5 text-xs hover:bg-muted focus:outline-none",
+            "data-stream-mdx-control": "copy",
+            "data-stream-mdx-target": "code",
+            "data-stream-mdx-action": "copy",
+            "aria-label": copied ? labels.copied ?? "Copied!" : labels.copy ?? "Copy code",
+            onClick: handleCopy,
+            children: copied ? labels.copied ?? "Copied!" : labels.copy ?? "Copy"
+          }
+        ) : null,
+        config.download ? /* @__PURE__ */ jsx4(
+          "button",
+          {
+            type: "button",
+            className: "stream-mdx-control stream-mdx-control-download stream-mdx-control-code-download inline-flex items-center gap-1 rounded px-2 py-0.5 text-xs hover:bg-muted focus:outline-none",
+            "data-stream-mdx-control": "download",
+            "data-stream-mdx-target": "code",
+            "data-stream-mdx-action": "download",
+            "aria-label": labels.download ?? "Download snippet",
+            onClick: handleDownload,
+            children: labels.download ?? "Download"
           }
+        ) : null
+      ]
+    }
+  );
+}, TableControlsBar = ({
+  headers,
+  rows,
+  align,
+  getTableData,
+  getMarkdownSource,
+  isFinalized,
+  config,
+  className
+}) => {
+  let [copiedFormat, setCopiedFormat] = useState3(null), copiedFeedbackTimeout = React2.useRef(void 0), mounted = React2.useRef(!0), { labels } = config;
+  React2.useEffect(() => (mounted.current = !0, () => {
+    mounted.current = !1, window.clearTimeout(copiedFeedbackTimeout.current);
+  }), []);
+  let handleCopy = useCallback2(
+    async (format) => {
+      if (!isFinalized) return;
+      let text;
+      if (format === "markdown") {
+        let source = getMarkdownSource?.();
+        if (source !== void 0)
+          text = source;
+        else {
+          let data = getTableData?.() ?? { headers, rows, align };
+          text = tableToMarkdown(data.headers, data.rows, data.align);
         }
-      },
-      { rootMargin: options?.rootMargin ?? "200px 0px" }
-    );
-    observer.observe(target);
-    return () => {
-      cancelled = true;
-      observer.disconnect();
-      if (idleId !== null && typeof globalThis.cancelIdleCallback === "function") {
-        globalThis.cancelIdleCallback(idleId);
+      } else {
+        let data = getTableData?.() ?? { headers, rows, align };
+        text = tableToTsv(data.headers, data.rows);
       }
-      if (timerId !== null) {
-        window.clearTimeout(timerId);
+      if (await copyToClipboard(text)) {
+        if (!mounted.current) return;
+        setCopiedFormat(format), window.clearTimeout(copiedFeedbackTimeout.current), copiedFeedbackTimeout.current = window.setTimeout(() => {
+          copiedFeedbackTimeout.current = void 0, setCopiedFormat(null);
+        }, 2e3);
       }
-    };
-  }, [enabled, options?.debounceMs, options?.idleTimeoutMs, options?.rootMargin, ref]);
-  return shouldRender;
+    },
+    [headers, rows, align, getTableData, getMarkdownSource, isFinalized]
+  ), handleDownload = useCallback2(
+    (format) => {
+      if (!isFinalized) return;
+      let text = "", filename = "table.csv", mimeType = "text/csv;charset=utf-8";
+      if (format === "markdown") {
+        let source = getMarkdownSource?.();
+        if (source !== void 0)
+          text = source;
+        else {
+          let data = getTableData?.() ?? { headers, rows, align };
+          text = tableToMarkdown(data.headers, data.rows, data.align);
+        }
+        filename = "table.md", mimeType = "text/markdown;charset=utf-8";
+      } else if (format === "tsv") {
+        let data = getTableData?.() ?? { headers, rows, align };
+        text = tableToTsv(data.headers, data.rows), filename = "table.tsv", mimeType = "text/tab-separated-values;charset=utf-8";
+      } else {
+        let data = getTableData?.() ?? { headers, rows, align };
+        text = tableToCsv(data.headers, data.rows);
+      }
+      downloadFile(text, filename, mimeType);
+    },
+    [headers, rows, align, getTableData, getMarkdownSource, isFinalized]
+  );
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: `stream-mdx-controls stream-mdx-table-controls flex items-center justify-end gap-1 px-2 py-1 text-xs select-none ${className ?? ""}`.trim(),
+      "data-stream-mdx-controls": "table",
+      children: [
+        config.copyFormats.map((format) => {
+          let isCopied = copiedFormat === format, defaultLabel = format === "markdown" ? "Copy Markdown" : "Copy TSV", labelText = format === "markdown" ? labels.copyMarkdown ?? defaultLabel : labels.copyTsv ?? defaultLabel;
+          return /* @__PURE__ */ jsx4(
+            "button",
+            {
+              type: "button",
+              disabled: !isFinalized,
+              className: `stream-mdx-control stream-mdx-control-copy stream-mdx-control-table-copy stream-mdx-control-copy-${format} inline-flex items-center gap-1 rounded px-2 py-0.5 text-xs hover:bg-muted focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed`,
+              "data-stream-mdx-control": "copy",
+              "data-stream-mdx-target": "table",
+              "data-stream-mdx-format": format,
+              "data-stream-mdx-action": `copy-${format}`,
+              "data-format": format,
+              "aria-label": isCopied ? labels.copied ?? "Copied!" : labelText,
+              onClick: () => handleCopy(format),
+              children: isCopied ? labels.copied ?? "Copied!" : labelText
+            },
+            `copy-${format}`
+          );
+        }),
+        config.downloadFormats.map((format) => {
+          let defaultLabel = format === "csv" ? "Download CSV" : format === "tsv" ? "Download TSV" : "Download Markdown", labelText = format === "csv" ? labels.downloadCsv ?? defaultLabel : format === "tsv" ? labels.downloadTsv ?? defaultLabel : labels.downloadMarkdown ?? defaultLabel;
+          return /* @__PURE__ */ jsx4(
+            "button",
+            {
+              type: "button",
+              disabled: !isFinalized,
+              className: `stream-mdx-control stream-mdx-control-download stream-mdx-control-table-download stream-mdx-control-download-${format} inline-flex items-center gap-1 rounded px-2 py-0.5 text-xs hover:bg-muted focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed`,
+              "data-stream-mdx-control": "download",
+              "data-stream-mdx-target": "table",
+              "data-stream-mdx-format": format,
+              "data-stream-mdx-action": `download-${format}`,
+              "data-format": format,
+              "aria-label": labelText,
+              onClick: () => handleDownload(format),
+              children: labelText
+            },
+            `download-${format}`
+          );
+        })
+      ]
+    }
+  );
+}, CodeBlockCopyButton = ({
+  code,
+  labels,
+  className,
+  ...props
+}) => {
+  let [copied, setCopied] = useState3(!1), copyLabel = labels?.copy ?? DEFAULT_CONTROLS_LABELS.copy ?? "Copy code", copiedLabel = labels?.copied ?? DEFAULT_CONTROLS_LABELS.copied ?? "Copied!", handleCopy = useCallback2(
+    async (e) => {
+      if (props.onClick?.(e), e.defaultPrevented) return;
+      await copyToClipboard(code) && (setCopied(!0), setTimeout(() => setCopied(!1), 2e3));
+    },
+    [code, props.onClick]
+  );
+  return /* @__PURE__ */ jsx4(
+    "button",
+    {
+      type: "button",
+      className: `stream-mdx-control stream-mdx-control-copy stream-mdx-control-code-copy ${className ?? ""}`.trim(),
+      "data-stream-mdx-control": "copy",
+      "data-stream-mdx-target": "code",
+      "data-stream-mdx-action": "copy",
+      "aria-label": copied ? copiedLabel : copyLabel,
+      ...props,
+      onClick: handleCopy,
+      children: props.children ?? (copied ? copiedLabel : "Copy")
+    }
+  );
+}, CodeBlockDownloadButton = ({
+  code,
+  language,
+  filename,
+  labels,
+  className,
+  ...props
+}) => {
+  let downloadLabel = labels?.download ?? DEFAULT_CONTROLS_LABELS.download ?? "Download snippet", handleDownload = useCallback2(
+    (e) => {
+      if (props.onClick?.(e), e.defaultPrevented) return;
+      let targetFilename = filename ?? getCodeSnippetFilename(language);
+      downloadFile(code, targetFilename);
+    },
+    [code, language, filename, props.onClick]
+  );
+  return /* @__PURE__ */ jsx4(
+    "button",
+    {
+      type: "button",
+      className: `stream-mdx-control stream-mdx-control-download stream-mdx-control-code-download ${className ?? ""}`.trim(),
+      "data-stream-mdx-control": "download",
+      "data-stream-mdx-target": "code",
+      "data-stream-mdx-action": "download",
+      "aria-label": downloadLabel,
+      ...props,
+      onClick: handleDownload,
+      children: props.children ?? labels?.download ?? "Download"
+    }
+  );
+};
+
+// src/animation.ts
+var BUILTIN_ANIMATION_NAMES = {
+  fadeIn: "stream-mdx-fade-in",
+  blurIn: "stream-mdx-blur-in",
+  slideUp: "stream-mdx-slide-up"
+}, DEFAULT_ANIMATED_OPTIONS = {
+  animation: "fadeIn",
+  animationName: "stream-mdx-fade-in",
+  duration: 150,
+  durationStr: "150ms",
+  easing: "ease-out",
+  sep: "word",
+  stagger: 20,
+  maxBacklogMs: 320
+};
+function resolveAnimatedOptions(prop) {
+  if (!prop) return null;
+  if (prop === !0) return DEFAULT_ANIMATED_OPTIONS;
+  let animation = prop.animation ?? DEFAULT_ANIMATED_OPTIONS.animation, duration = typeof prop.duration == "number" ? prop.duration : DEFAULT_ANIMATED_OPTIONS.duration;
+  return {
+    animation,
+    animationName: BUILTIN_ANIMATION_NAMES[animation] ?? animation,
+    duration,
+    durationStr: `${duration}ms`,
+    easing: prop.easing ?? DEFAULT_ANIMATED_OPTIONS.easing,
+    sep: prop.sep ?? DEFAULT_ANIMATED_OPTIONS.sep,
+    stagger: typeof prop.stagger == "number" ? prop.stagger : DEFAULT_ANIMATED_OPTIONS.stagger,
+    maxBacklogMs: typeof prop.maxBacklogMs == "number" ? prop.maxBacklogMs : DEFAULT_ANIMATED_OPTIONS.maxBacklogMs
+  };
+}
+var STREAM_MDX_ANIMATION_CSS = `
+@keyframes stream-mdx-fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
 }
 
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes stream-mdx-blur-in {
+  from {
+    opacity: 0;
+    filter: blur(4px);
+  }
+  to {
+    opacity: 1;
+    filter: blur(0px);
+  }
+}
+
+@keyframes blurIn {
+  from {
+    opacity: 0;
+    filter: blur(4px);
+  }
+  to {
+    opacity: 1;
+    filter: blur(0px);
+  }
+}
+
+@keyframes stream-mdx-slide-up {
+  from {
+    opacity: 0;
+    transform: translateY(4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes slideUp {
+  from {
+    opacity: 0;
+    transform: translateY(4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.stream-mdx-anim {
+  display: inline;
+  animation-name: var(--sm-anim-name, stream-mdx-fade-in);
+  animation-duration: var(--sm-anim-duration, 150ms);
+  animation-timing-function: var(--sm-anim-easing, ease-out);
+  animation-delay: var(--sm-anim-delay, 0ms);
+  animation-fill-mode: both;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .stream-mdx-anim {
+    animation: none !important;
+  }
+}
+`.trim(), WHITESPACE_REGEX = /\s/;
+function splitWordSegments(text) {
+  let result = [], current = "", inWhitespace = !1;
+  for (let char of text) {
+    let isSpace = WHITESPACE_REGEX.test(char);
+    if (isSpace !== inWhitespace && current) {
+      if (isSpace) {
+        current += char, inWhitespace = !0;
+        continue;
+      }
+      result.push(current), current = "";
+    }
+    current += char, inWhitespace = isSpace;
+  }
+  return current && result.push(current), result;
+}
+function splitTextSegments(text, sep) {
+  return sep === "char" ? Array.from(text) : splitWordSegments(text);
+}
+var AnimationTimeline = class {
+  constructor(options) {
+    this.committedEndTime = 0;
+    this.cursorEndTime = 0;
+    this.passActive = !1;
+    this.nodeStates = /* @__PURE__ */ new Map();
+    this.now = options?.now ?? (() => typeof performance < "u" ? performance.now() : Date.now()), this.maxBacklogMs = options?.maxBacklogMs ?? 320, this.stagger = options?.stagger ?? 20;
+  }
+  updateOptions(options) {
+    typeof options.maxBacklogMs == "number" && (this.maxBacklogMs = options.maxBacklogMs), typeof options.stagger == "number" && (this.stagger = options.stagger);
+  }
+  beginPass(currentTime = this.now()) {
+    this.passActive || (this.passActive = !0, this.cursorEndTime = Math.min(
+      Math.max(this.committedEndTime, currentTime),
+      currentTime + this.maxBacklogMs
+    ), typeof queueMicrotask == "function" ? queueMicrotask(() => this.commitPass()) : setTimeout(() => this.commitPass(), 0));
+  }
+  commitPass() {
+    this.committedEndTime = this.cursorEndTime, this.passActive = !1;
+  }
+  schedule(count, stagger = this.stagger, currentTime = this.now()) {
+    if (this.beginPass(currentTime), count <= 0) return [];
+    let d = Math.max(0, stagger), maxDeadline = currentTime + this.maxBacklogMs, start = Math.min(Math.max(this.cursorEndTime, currentTime), maxDeadline), step = count > 1 ? Math.min(d, Math.max(0, maxDeadline - start) / (count - 1)) : d, baseDelay = Math.max(0, start - currentTime);
+    this.cursorEndTime = Math.min(start + count * step, maxDeadline);
+    let delays = [];
+    for (let i = 0; i < count; i++)
+      delays.push(Math.min(this.maxBacklogMs, Math.round(baseDelay + i * step)));
+    return delays;
+  }
+  getNodeState(key) {
+    let state = this.nodeStates.get(key);
+    return state || (state = { count: 0, delays: [] }, this.nodeStates.set(key, state)), state;
+  }
+  reset() {
+    this.committedEndTime = 0, this.cursorEndTime = 0, this.passActive = !1, this.nodeStates.clear();
+  }
+  releasePrefix(prefix) {
+    let prefixColon = `${prefix}:`;
+    for (let key of this.nodeStates.keys())
+      (key === prefix || key.startsWith(prefixColon)) && this.nodeStates.delete(key);
+  }
+};
+
 // src/components/index.ts
+import { defaultUrlTransform as defaultUrlTransform3 } from "@stream-mdx/core";
+import { InlineParser, createTrustedHTML, defaultUrlTransform as defaultUrlTransform4, isForbiddenAttribute as isForbiddenAttribute2, isSafeStyleDeclaration as isSafeStyleDeclaration2, sanitizeHTML, stripCodeFence } from "@stream-mdx/core";
 import { removeHeadingMarkers } from "@stream-mdx/core";
-import React4 from "react";
+import React8 from "react";
 
 // src/utils/inline-html.ts
 import React3 from "react";
-var BACKTICK_CONTENT = /^`([\s\S]+)`$/;
-var DEFAULT_INLINE_HTML_RENDERERS = {
+import { defaultUrlTransform, isForbiddenAttribute, isSafeStyleDeclaration } from "@stream-mdx/core";
+function renderHtmlInlineNode(node, children, elements, key, textValue, urlTransform, filterElement, parentTagName, renderPresentation, renderNativeElement) {
+  if (node.isClose || node.tagName === "script" || node.tagName === "style") return null;
+  if (!node.tagName || node.sanitized === "")
+    return React3.createElement(React3.Fragment, { key }, children);
+  let tag = node.tagName.toLowerCase(), props = mapAttributesToProps(node.attributes ?? {}, urlTransform);
+  props.key = key;
+  let renderElement = () => {
+    let nativeView;
+    return renderNativeElement ? nativeView = renderNativeElement(
+      tag,
+      props,
+      node.isSelfClosing ? void 0 : children,
+      key ?? tag
+    ) : tag === "textarea" ? (props.defaultValue = textValue ?? "", nativeView = React3.createElement(elements?.[tag] ?? tag, props)) : nativeView = React3.createElement(elements?.[tag] ?? tag, props, node.isSelfClosing ? void 0 : children), renderPresentation ? renderPresentation(tag, props, nativeView, children, key ?? tag) : nativeView;
+  };
+  return filterElement ? filterElement(
+    { tagName: tag, properties: props },
+    { source: "html", parentTagName },
+    renderElement,
+    () => children
+  ) : renderElement();
+}
+function renderHtmlOwnershipTree(nodes, elements, renderBlock, renderInline, renderInlineElement, renderParagraph, urlTransform, filterElement, parentTagName, contentComponents, renderPresentation, parentPath = "html", renderComponentPresentation) {
+  return nodes.map((node, index) => {
+    let nodeKey = `${parentPath}:${index}`;
+    if (node.kind === "text") return node.inline && renderInline ? renderInline(node.inline, parentTagName) : node.rawSource ?? node.text;
+    if (node.kind === "block") return renderBlock(node.block, parentTagName);
+    if (node.kind === "component") {
+      let reg = contentComponents?.[node.name];
+      if (!reg)
+        return React3.createElement(React3.Fragment, { key: nodeKey }, node.rawSource ?? `<${node.name} />`);
+      let result = reg.render({
+        props: node.props,
+        key: index,
+        hasChildren: node.children.length > 0,
+        renderChildren: () => renderHtmlOwnershipTree(
+          node.children,
+          elements,
+          renderBlock,
+          renderInline,
+          renderInlineElement,
+          renderParagraph,
+          urlTransform,
+          filterElement,
+          node.name,
+          contentComponents,
+          renderPresentation,
+          nodeKey,
+          renderComponentPresentation
+        ),
+        status: node.status,
+        diagnostic: node.diagnostic
+      });
+      return result.kind === "invalid" ? React3.createElement(React3.Fragment, { key: nodeKey }, node.rawSource ?? `<${node.name} />`) : result.kind === "suppressed" ? null : renderComponentPresentation ? renderComponentPresentation(
+        node.name,
+        result.element,
+        React3.isValidElement(result.element) ? result.element.props.children : void 0,
+        nodeKey,
+        node.status,
+        node.rawSource
+      ) : result.element;
+    }
+    let tag = node.tagName.toLowerCase(), props = mapAttributesToProps(node.attributes, urlTransform);
+    props.key = nodeKey;
+    let children = renderHtmlOwnershipTree(node.children, elements, renderBlock, renderInline, renderInlineElement, renderParagraph, urlTransform, filterElement, tag, contentComponents, renderPresentation, nodeKey, renderComponentPresentation);
+    if (node.paragraphRoot && renderParagraph) {
+      let paragraph = filterElement ? filterElement(
+        { tagName: "p", properties: props, blockType: "paragraph" },
+        { source: "markdown", parentTagName },
+        () => renderParagraph(children),
+        () => children
+      ) : renderParagraph(children);
+      return React3.createElement(React3.Fragment, { key: nodeKey }, paragraph);
+    }
+    if (node.inlineNode && renderInlineElement)
+      return React3.createElement(React3.Fragment, { key: nodeKey }, renderInlineElement(node.inlineNode, children, parentTagName, nodeKey));
+    let renderElement = () => {
+      let nativeView;
+      if (tag === "textarea")
+        props.defaultValue = node.children.map((child) => child.kind === "text" ? child.text : "").join(""), nativeView = React3.createElement(elements[tag] ?? tag, props);
+      else {
+        let content = tag === "pre" && node.children.every((child) => child.kind === "text" && !child.inline) ? node.children.map((child) => child.kind === "text" ? child.text : "").join("") : children;
+        nativeView = React3.createElement(elements[tag] ?? tag, props, node.children.length ? content : void 0);
+      }
+      return renderPresentation ? renderPresentation(tag, props, nativeView, children, nodeKey) : nativeView;
+    };
+    return filterElement ? filterElement(
+      { tagName: tag, properties: props },
+      { source: "html", parentTagName },
+      renderElement,
+      () => children
+    ) : renderElement();
+  });
+}
+var BACKTICK_CONTENT = /^`([\s\S]+)`$/, DEFAULT_INLINE_HTML_RENDERERS = {
   kbd: (descriptor, ctx) => {
-    const trimmed = descriptor.rawInner.trim();
-    const match = BACKTICK_CONTENT.exec(trimmed);
+    let trimmed = descriptor.rawInner.trim(), match = BACKTICK_CONTENT.exec(trimmed);
     if (match) {
-      const codeText = decodeHtmlEntities(match[1]);
-      const props = mapAttributesToProps(descriptor.attributes);
-      if (ctx.key !== void 0 && ctx.key !== null) {
-        props.key = ctx.key;
-      }
-      return React3.createElement("kbd", props, React3.createElement("code", { className: "inline-code" }, codeText));
+      let codeText = decodeHtmlEntities(match[1]), props = mapAttributesToProps(descriptor.attributes);
+      return ctx.key !== void 0 && ctx.key !== null && (props.key = ctx.key), React3.createElement("kbd", props, React3.createElement("code", { className: "inline-code" }, codeText));
     }
     return ctx.defaultRender();
   }
 };
 function renderInlineHtmlSegment(raw, sanitized, options = {}) {
-  const descriptor = parseInlineHtmlDescriptor(raw, sanitized);
-  if (!descriptor) {
+  let descriptor = parseInlineHtmlDescriptor(raw, sanitized);
+  if (!descriptor)
     return null;
-  }
-  const className = options.className ?? "markdown-inline-html";
-  const isInlineTag = INLINE_ELEMENTS.has(descriptor.tagName);
-  const defaultRender = () => {
-    if (!descriptor.sanitized || descriptor.sanitized.length === 0) {
-      if (!descriptor.text) {
-        return null;
-      }
-      if (options.key !== void 0 && options.key !== null) {
-        return React3.createElement(React3.Fragment, { key: options.key }, descriptor.text);
-      }
-      return React3.createElement(React3.Fragment, {}, descriptor.text);
-    }
+  let className = options.className ?? "markdown-inline-html", hasCustomElement = !!options.htmlElements?.[descriptor.tagName], isInlineTag = INLINE_ELEMENTS.has(descriptor.tagName) || hasCustomElement, defaultRender = () => {
+    if (!descriptor.sanitized || descriptor.sanitized.length === 0)
+      return descriptor.text ? options.key !== void 0 && options.key !== null ? React3.createElement(React3.Fragment, { key: options.key }, descriptor.text) : React3.createElement(React3.Fragment, {}, descriptor.text) : null;
     if (isInlineTag) {
-      const parsedElement = renderSanitizedHtmlTree(descriptor.sanitized, options.key);
-      if (parsedElement) {
+      let parsedElement = renderSanitizedHtmlTree(
+        descriptor.sanitized,
+        options.key,
+        options.htmlElements,
+        options.literalTagContent,
+        options.parseMarkdown
+      );
+      if (parsedElement)
         return parsedElement;
-      }
     }
-    const props = {
+    let customElementComp = options.htmlElements?.[descriptor.tagName];
+    if (customElementComp) {
+      let props2 = mapAttributesToProps(descriptor.attributes, options.urlTransform);
+      return options.key !== void 0 && options.key !== null && (props2.key = options.key), React3.createElement(customElementComp, props2, descriptor.text || descriptor.sanitizedInner || void 0);
+    }
+    let props = {
       className,
       dangerouslySetInnerHTML: { __html: descriptor.sanitized }
     };
-    if (options.key !== void 0 && options.key !== null) {
-      props.key = options.key;
-    }
-    return React3.createElement("span", props);
+    return options.key !== void 0 && options.key !== null && (props.key = options.key), React3.createElement("span", props);
   };
-  const allRenderers = options.renderers ? { ...DEFAULT_INLINE_HTML_RENDERERS, ...options.renderers } : DEFAULT_INLINE_HTML_RENDERERS;
-  const renderer = allRenderers[descriptor.tagName];
-  if (renderer) {
-    const rendered = renderer(descriptor, { key: options.key, defaultRender });
-    if (rendered) {
-      if (options.key !== void 0 && options.key !== null && React3.isValidElement(rendered) && rendered.key === null) {
-        return React3.cloneElement(rendered, { key: options.key });
-      }
-      return rendered;
+  if (!hasCustomElement) {
+    let renderer = (options.renderers ? { ...DEFAULT_INLINE_HTML_RENDERERS, ...options.renderers } : DEFAULT_INLINE_HTML_RENDERERS)[descriptor.tagName];
+    if (renderer) {
+      let rendered = renderer(descriptor, { key: options.key, defaultRender });
+      if (rendered)
+        return options.key !== void 0 && options.key !== null && React3.isValidElement(rendered) && rendered.key === null ? React3.cloneElement(rendered, { key: options.key }) : rendered;
     }
   }
   return defaultRender();
 }
 function parseInlineHtmlDescriptor(raw, sanitized) {
-  const normalizedRaw = typeof raw === "string" ? raw.trim() : "";
-  const normalizedSanitized = typeof sanitized === "string" && sanitized.length > 0 ? sanitized.trim() : normalizedRaw;
-  if (!normalizedSanitized) {
-    return null;
-  }
-  const match = normalizedSanitized.match(/^<([A-Za-z][\w:-]*)(\s[^>]*)?>([\s\S]*)<\/\1>$/);
-  if (!match) {
+  let normalizedRaw = typeof raw == "string" ? raw.trim() : "", normalizedSanitized = typeof sanitized == "string" && sanitized.length > 0 ? sanitized.trim() : normalizedRaw;
+  if (!normalizedSanitized)
     return null;
+  let pairedMatch = normalizedSanitized.match(/^<([A-Za-z][\w:-]*)((?:\s+[^>]*)?)>([\s\S]*)<\/\1>$/), tagNameRaw, attrString = "", sanitizedInner = "";
+  if (pairedMatch)
+    tagNameRaw = pairedMatch[1], attrString = pairedMatch[2] ?? "", sanitizedInner = pairedMatch[3] ?? "";
+  else {
+    let selfClosingMatch = normalizedSanitized.match(/^<([A-Za-z][\w:-]*)((?:\s+[^>]*)?)\s*(?:\/?>|>)$/) || normalizedRaw.match(/^<([A-Za-z][\w:-]*)((?:\s+[^>]*)?)\s*(?:\/?>|>)$/);
+    if (!selfClosingMatch)
+      return null;
+    tagNameRaw = selfClosingMatch[1], attrString = selfClosingMatch[2] ?? "", sanitizedInner = "";
   }
-  const [, tagNameRaw, attrString = "", sanitizedInner = ""] = match;
-  const tagName = tagNameRaw.toLowerCase();
-  const attributes = parseAttributes(attrString);
-  let rawInner = "";
+  let tagName = tagNameRaw.toLowerCase(), attributes = parseAttributes(attrString), rawInner = "";
   if (normalizedRaw) {
-    const rawMatch = normalizedRaw.match(/^<([A-Za-z][\w:-]*)(\s[^>]*)?>([\s\S]*)<\/\1>$/);
+    let rawMatch = normalizedRaw.match(/^<([A-Za-z][\w:-]*)(\s[^>]*)?>([\s\S]*)<\/\1>$/);
     rawInner = rawMatch ? rawMatch[3] ?? "" : normalizedRaw;
   }
-  const text = extractPlainText(rawInner || sanitizedInner);
+  let text = extractPlainText(rawInner || sanitizedInner);
   return {
     tagName,
     attributes,
@@ -904,52 +1362,91 @@ function parseInlineHtmlDescriptor(raw, sanitized) {
   };
 }
 function parseAttributes(input) {
-  const attrs = {};
+  let attrs = {};
   if (!input) return attrs;
-  const attrPattern = /([A-Za-z_:][\w:.\-]*)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s"'=<>`]+)))?/g;
-  let match = attrPattern.exec(input);
-  while (match !== null) {
-    const name = match[1];
+  let attrPattern = /([A-Za-z_:][\w:.\-]*)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s"'=<>`]+)))?/g, match = attrPattern.exec(input);
+  for (; match !== null; ) {
+    let name = match[1];
     if (!name) continue;
-    const value = match[2] ?? match[3] ?? match[4] ?? "";
-    attrs[name] = value;
-    match = attrPattern.exec(input);
+    let value = match[2] ?? match[3] ?? match[4] ?? "";
+    attrs[name] = value, match = attrPattern.exec(input);
   }
   return attrs;
 }
-function mapAttributesToProps(attrs) {
-  const props = {};
-  for (const [key, value] of Object.entries(attrs)) {
-    if (key === "class") {
-      props.className = value;
-    } else if (key === "style") {
-      props.style = parseStyleAttribute(value);
-    } else if (key === "tabindex" || key === "tabIndex") {
-      const normalized = normalizeTabIndex(value);
-      if (normalized !== void 0) {
-        props.tabIndex = normalized;
-      }
-    } else {
-      props[key] = value;
-    }
+var BOOLEAN_HTML_PROPS = {
+  allowFullScreen: !0,
+  async: !0,
+  autoFocus: !0,
+  autoPlay: !0,
+  checked: !0,
+  controls: !0,
+  default: !0,
+  defer: !0,
+  disabled: !0,
+  formNoValidate: !0,
+  hidden: !0,
+  inert: !0,
+  loop: !0,
+  multiple: !0,
+  muted: !0,
+  noModule: !0,
+  noValidate: !0,
+  open: !0,
+  playsInline: !0,
+  readOnly: !0,
+  required: !0,
+  reversed: !0,
+  selected: !0,
+  itemScope: !0
+};
+function mapAttributesToProps(attrs, urlTransform) {
+  let props = {}, transform = urlTransform ?? defaultUrlTransform;
+  for (let [key, value] of Object.entries(attrs)) {
+    let lower = key.toLowerCase();
+    if (!isForbiddenAttribute(lower))
+      if (key === "class")
+        props.className = value;
+      else if (key === "style")
+        props.style = parseStyleAttribute(value);
+      else if (key === "tabindex" || key === "tabIndex") {
+        let normalized = normalizeTabIndex(value);
+        normalized !== void 0 && (props.tabIndex = normalized);
+      } else if (lower === "href") {
+        let safe = transform(value, "href", { source: "html" });
+        safe != null && (props.href = safe);
+      } else if (lower === "src") {
+        let safe = transform(value, "src", { source: "html" });
+        safe != null && (props.src = safe);
+      } else if (lower === "action") {
+        let safe = transform(value, "href", { source: "html" });
+        safe != null && (props.action = safe);
+      } else if (lower === "formaction") {
+        let safe = transform(value, "href", { source: "html" });
+        safe != null && (props.formAction = safe);
+      } else if (lower === "xlink:href" || lower === "xlinkhref") {
+        let safe = transform(value, "href", { source: "html" });
+        safe != null && (props.xlinkHref = safe);
+      } else /^(?:data|aria)[A-Z]/.test(key) ? props[key.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`)] = value : BOOLEAN_HTML_PROPS[key] ? props[key] = !0 : props[key] = value;
   }
   return props;
 }
 function parseStyleAttribute(value) {
-  const style = {};
+  let style = {};
   if (!value) return style;
-  const pairs = value.split(";");
-  for (const pair of pairs) {
+  let pairs = value.split(";");
+  for (let pair of pairs) {
     if (!pair.trim()) continue;
-    const [property, rawVal] = pair.split(":");
-    if (!property || rawVal === void 0) continue;
-    const camelProp = property.trim().replace(/-([a-z])/g, (_, char) => char.toUpperCase());
-    style[camelProp] = rawVal.trim();
+    let separator = pair.indexOf(":");
+    if (separator <= 0) continue;
+    let property = pair.slice(0, separator).trim(), rawVal = pair.slice(separator + 1).trim();
+    if (!isSafeStyleDeclaration(property, rawVal)) continue;
+    let camelProp = property.replace(/-([a-z])/g, (_, char) => char.toUpperCase());
+    style[camelProp] = rawVal;
   }
   return style;
 }
 function normalizeTabIndex(value) {
-  const numeric = Number(value);
+  let numeric = Number(value);
   return Number.isNaN(numeric) ? void 0 : numeric;
 }
 function decodeHtmlEntities(value) {
@@ -957,76 +1454,50 @@ function decodeHtmlEntities(value) {
 }
 function extractPlainText(value) {
   if (!value) return "";
-  const withoutTags = value.replace(/<\/?[^>]+>/g, "");
+  let withoutTags = value.replace(/<\/?[^>]+>/g, "");
   return decodeHtmlEntities(withoutTags);
 }
-function renderSanitizedHtmlTree(html, key) {
-  if (typeof DOMParser === "undefined") {
+var DEFAULT_LITERAL_TAGS = /* @__PURE__ */ new Set(["code", "pre", "script", "style", "textarea"]);
+function renderSanitizedHtmlTree(html, key, htmlElements, literalTagContent, parseMarkdown) {
+  if (typeof DOMParser > "u")
     return null;
-  }
   try {
-    const parser = new DOMParser();
-    const doc = parser.parseFromString(html, "text/html");
-    const body = doc.body;
-    const nodes = Array.from(body.childNodes);
-    if (nodes.length === 0) {
+    let body = new DOMParser().parseFromString(html, "text/html").body, nodes = Array.from(body.childNodes);
+    if (nodes.length === 0)
       return null;
-    }
-    const baseKey = typeof key === "string" || typeof key === "number" ? String(key) : "inline-html";
-    const children = nodes.map((node, index) => convertDomNode(node, `${baseKey}-${index}`)).filter((child) => child !== null && child !== void 0);
-    if (children.length === 0) {
+    let literalTags = literalTagContent ? /* @__PURE__ */ new Set([...DEFAULT_LITERAL_TAGS, ...literalTagContent.map((t) => t.toLowerCase())]) : DEFAULT_LITERAL_TAGS, baseKey = typeof key == "string" || typeof key == "number" ? String(key) : "inline-html", children = nodes.map((node, index) => convertDomNode(node, `${baseKey}-${index}`, htmlElements, literalTags, !1, parseMarkdown)).filter((child) => child != null);
+    if (children.length === 0)
       return null;
-    }
     if (children.length === 1) {
-      const [child] = children;
-      if (React3.isValidElement(child)) {
-        if (key !== void 0 && key !== null) {
-          return React3.cloneElement(child, { key });
-        }
-        return child;
-      }
-      if (typeof child === "string" || typeof child === "number") {
-        if (key !== void 0 && key !== null) {
-          return React3.createElement(React3.Fragment, { key }, child);
-        }
-        return React3.createElement(React3.Fragment, {}, child);
-      }
-      return React3.createElement(React3.Fragment, { key }, child);
+      let [child] = children;
+      return React3.isValidElement(child) ? key != null ? React3.cloneElement(child, { key }) : child : typeof child == "string" || typeof child == "number" ? key != null ? React3.createElement(React3.Fragment, { key }, child) : React3.createElement(React3.Fragment, {}, child) : React3.createElement(React3.Fragment, { key }, child);
     }
     return React3.createElement(React3.Fragment, { key }, ...children);
   } catch {
     return null;
   }
 }
-function convertDomNode(node, key) {
+function convertDomNode(node, key, htmlElements, literalTags, parentIsLiteral, parseMarkdown) {
   if (node.nodeType === Node.TEXT_NODE) {
-    return node.textContent ?? "";
+    let rawText = node.textContent ?? "";
+    return parentIsLiteral || !parseMarkdown ? rawText : parseMarkdown(rawText);
   }
-  if (node.nodeType !== Node.ELEMENT_NODE) {
+  if (node.nodeType !== Node.ELEMENT_NODE)
     return null;
-  }
-  const element = node;
-  const tagName = element.tagName.toLowerCase();
-  const attrs = getElementAttributes(element);
-  const props = mapAttributesToProps(attrs);
+  let element = node, tagName = element.tagName.toLowerCase(), attrs = getElementAttributes(element), props = mapAttributesToProps(attrs);
   props.key = key;
-  const children = [];
+  let isLiteral = parentIsLiteral || (literalTags ? literalTags.has(tagName) : !1), children = [];
   element.childNodes.forEach((child, index) => {
-    const converted = convertDomNode(child, `${key}-${index}`);
-    if (converted !== null && converted !== void 0) {
-      children.push(converted);
-    }
+    let converted = convertDomNode(child, `${key}-${index}`, htmlElements, literalTags, isLiteral, parseMarkdown);
+    converted != null && children.push(converted);
   });
-  if (children.length === 0) {
-    return React3.createElement(tagName, props);
-  }
-  return React3.createElement(tagName, props, ...children);
+  let customComponent = htmlElements?.[tagName];
+  return customComponent ? children.length === 0 ? React3.createElement(customComponent, props) : React3.createElement(customComponent, props, ...children) : children.length === 0 ? React3.createElement(tagName, props) : React3.createElement(tagName, props, ...children);
 }
 function getElementAttributes(element) {
-  const attrs = {};
-  for (const attr of Array.from(element.attributes)) {
+  let attrs = {};
+  for (let attr of Array.from(element.attributes))
     attrs[attr.name] = attr.value;
-  }
   return attrs;
 }
 var INLINE_ELEMENTS = /* @__PURE__ */ new Set([
@@ -1036,6 +1507,11 @@ var INLINE_ELEMENTS = /* @__PURE__ */ new Set([
   "bdi",
   "bdo",
   "br",
+  "img",
+  "input",
+  "picture",
+  "del",
+  "ins",
   "cite",
   "code",
   "data",
@@ -1080,67 +1556,404 @@ var INLINE_ELEMENTS = /* @__PURE__ */ new Set([
   "mtd"
 ]);
 
-// src/components/link-safety-modal.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var DefaultLinkSafetyModal = ({ url, isOpen, isChecking, onClose, onConfirm, onCopy }) => {
-  if (!isOpen) {
-    return null;
+// src/components/owned-html.tsx
+import React4 from "react";
+import { defaultUrlTransform as defaultUrlTransform2 } from "@stream-mdx/core";
+function renderOwnedHtmlTree(tree, context) {
+  return renderHtmlOwnershipTree(
+    tree,
+    context.elements,
+    context.renderBlock,
+    context.renderInline,
+    (node, children, parentTagName, key) => {
+      if (node.kind === "strong" || node.kind === "em" || node.kind === "strike" || node.kind === "link") {
+        let component = context.inlineComponents[node.kind], renderElement = () => {
+          let direct;
+          if (node.kind === "link") {
+            if (node.autolink && context.isAutolinkProtocolDisabled(node.href)) return children;
+            let { href, ...linkProps } = node, safeHref = (context.urlTransform ?? defaultUrlTransform2)(href ?? "", "href", { source: "markdown" });
+            direct = component ? React4.createElement(component, {
+              ...linkProps,
+              key,
+              ...safeHref != null ? { href: safeHref } : {},
+              children
+            }) : React4.createElement("a", { key, href: safeHref ?? void 0 }, children);
+          } else {
+            let tag2 = node.kind === "strike" ? "del" : node.kind;
+            direct = component ? React4.createElement(component, { ...node, key, children }) : React4.createElement(tag2, { key }, children);
+          }
+          return context.renderInlinePresentation ? context.renderInlinePresentation(node, direct, key) : direct;
+        };
+        if (!context.filterElement) return renderElement();
+        let tag = node.kind === "strike" ? "del" : node.kind === "link" ? "a" : node.kind, properties = node.kind === "link" ? { href: context.urlTransform?.(node.href ?? "", "href", { source: "markdown" }) ?? node.href, title: node.title } : {};
+        return context.filterElement(
+          { tagName: tag, properties },
+          { source: "markdown", parentTagName },
+          renderElement,
+          () => children
+        );
+      }
+      if (node.kind === "plugin") {
+        let component = context.inlineComponents[node.name] ?? context.inlineComponents.plugin, direct = component ? React4.createElement(component, { ...node.attrs, key, name: node.name, attrs: node.attrs, raw: node.raw, children }) : node.raw;
+        return context.renderInlinePresentation ? context.renderInlinePresentation(node, direct, key, children) : direct;
+      }
+      return context.renderInline([node], parentTagName);
+    },
+    context.renderParagraph,
+    context.urlTransform,
+    context.filterElement,
+    context.parentTagName,
+    context.contentComponents,
+    context.renderHtmlPresentation,
+    void 0,
+    context.renderComponentPresentation
+  );
+}
+
+// src/trusted-mdx/native-inline.tsx
+import React6, { useContext as useContext2 } from "react";
+import { TrustedMdxNativeChildrenContext } from "@stream-mdx/react/_internal/trusted-mdx-native-children";
+
+// src/trusted-mdx-boundary.tsx
+import React5, { createContext as createContext2, useCallback as useCallback3, useEffect as useEffect3, useRef as useRef3, useState as useState4, useSyncExternalStore } from "react";
+import { Fragment as Fragment3, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var EMPTY_PROJECTIONS = Object.freeze({}), EMPTY_COMPONENTS = Object.freeze({}), EMPTY_DOCUMENT_SNAPSHOT = Object.freeze({
+  requestedRevision: 0,
+  projectionRevision: null,
+  renderedRevision: null,
+  status: "idle",
+  error: null,
+  components: EMPTY_COMPONENTS,
+  layout: null,
+  projections: EMPTY_PROJECTIONS
+}), EMPTY_FEED_SNAPSHOT = Object.freeze({
+  generation: 0,
+  version: 0,
+  generationCause: "initial",
+  pendingSource: null,
+  revision: null
+});
+var TrustedMdxProjectionContext = createContext2(null);
+var TrustedMdxProjectionErrorBoundary = class extends React5.Component {
+  constructor() {
+    super(...arguments);
+    this.state = { error: null };
   }
-  return /* @__PURE__ */ jsx2(
-    "div",
-    {
-      className: "stream-mdx-link-modal-backdrop",
-      role: "dialog",
-      "aria-modal": "true",
-      "aria-label": "Link safety confirmation",
-      style: {
-        position: "fixed",
-        inset: 0,
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        background: "rgba(0, 0, 0, 0.4)",
-        zIndex: 9999,
-        padding: "24px"
-      },
-      onClick: onClose,
-      children: /* @__PURE__ */ jsxs2(
-        "div",
-        {
-          className: "stream-mdx-link-modal",
-          style: {
-            width: "min(520px, 100%)",
-            borderRadius: 12,
-            background: "var(--background, #fff)",
-            color: "var(--foreground, #111)",
-            border: "1px solid var(--border, rgba(0, 0, 0, 0.1))",
-            boxShadow: "0 20px 60px rgba(0, 0, 0, 0.25)",
-            padding: 20
-          },
-          onClick: (event) => event.stopPropagation(),
-          children: [
-            /* @__PURE__ */ jsx2("div", { style: { fontWeight: 600, marginBottom: 8 }, children: "Open external link?" }),
-            /* @__PURE__ */ jsx2("div", { style: { fontSize: 13, opacity: 0.8, wordBreak: "break-all", marginBottom: 16 }, children: url }),
-            /* @__PURE__ */ jsxs2("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" }, children: [
-              /* @__PURE__ */ jsx2("button", { type: "button", onClick: onCopy, disabled: isChecking, style: buttonStyle, children: "Copy link" }),
-              /* @__PURE__ */ jsx2("button", { type: "button", onClick: onConfirm, disabled: isChecking, style: primaryButtonStyle, children: "Open link" }),
-              /* @__PURE__ */ jsx2("button", { type: "button", onClick: onClose, style: buttonStyle, children: "Cancel" })
-            ] })
-          ]
-        }
-      )
+  static getDerivedStateFromError(error) {
+    return { error: error instanceof Error ? error : new Error(String(error)) };
+  }
+  componentDidCatch(error) {
+    this.props.revision !== null && this.props.document.reportRenderError(this.props.revision, error);
+  }
+  render() {
+    return this.state.error ? /* @__PURE__ */ jsx5(TrustedMdxProjectionContext.Provider, { value: null, children: this.props.fallback }) : this.props.children;
+  }
+}, CapturedNativeFrameErrorBoundary = class extends React5.Component {
+  constructor() {
+    super(...arguments);
+    this.state = { error: null };
+  }
+  static getDerivedStateFromError(error) {
+    return { error: error instanceof Error ? error : new Error(String(error)) };
+  }
+  render() {
+    return this.state.error ? /* @__PURE__ */ jsxs5("section", { role: "alert", "data-trusted-mdx-retained-frame-error": "true", children: [
+      /* @__PURE__ */ jsxs5("p", { children: [
+        "Previously committed trusted MDX source generation ",
+        this.props.sourceGeneration,
+        ", document revision ",
+        this.props.documentRevision,
+        "failed to render: ",
+        this.state.error.message
+      ] }),
+      /* @__PURE__ */ jsxs5("details", { children: [
+        /* @__PURE__ */ jsxs5("summary", { children: [
+          "Escaped source for generation ",
+          this.props.sourceGeneration,
+          ", document revision ",
+          this.props.documentRevision
+        ] }),
+        /* @__PURE__ */ jsx5("pre", { children: this.props.source })
+      ] })
+    ] }) : this.props.children;
+  }
+};
+
+// src/trusted-mdx-contract.ts
+function assertTrustedMdxNativeChildContinuations(owners, flowChildren) {
+  if (owners.length !== flowChildren.length)
+    throw new Error("A trusted MDX native child continuation has misaligned owner and source spans.");
+  let continuationOwnerIndex;
+  for (let index = 0; index < owners.length; index++) {
+    let owner = owners[index];
+    if (owner?.kind !== "continuation") {
+      continuationOwnerIndex = void 0;
+      continue;
     }
-  );
+    let ownerIndex = owner.ownerIndex, ownerForRun = owners[ownerIndex], previousChild = flowChildren[index - 1], child = flowChildren[index];
+    if (!Number.isSafeInteger(ownerIndex) || ownerIndex < 0 || ownerIndex >= index || (continuationOwnerIndex === void 0 ? ownerIndex !== index - 1 : ownerIndex !== continuationOwnerIndex) || ownerForRun === null || ownerForRun === void 0 || ownerForRun.kind === "continuation" || previousChild?.kind !== "inline" || child?.kind !== "inline" || previousChild.to <= previousChild.from || child.to <= child.from || previousChild.to !== child.from)
+      throw new Error("A trusted MDX native child continuation does not cover one exact contiguous inline run.");
+    continuationOwnerIndex = ownerIndex;
+  }
+}
+
+// src/trusted-mdx/native-inline.tsx
+import { Fragment as Fragment4, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+function renderTrustedMdxOwner(ownerId, snapshot, source, inline, nativeChildren) {
+  let projection = snapshot.projections[ownerId];
+  if (projection?.kind === "native-child") return;
+  if (projection?.kind === "module") return null;
+  if (projection?.kind === "server-content") {
+    if (!projection.nativeChildren) return projection.content;
+    if (nativeChildren === void 0)
+      throw new Error(`Trusted MDX owner "${ownerId}" has no prepared native children.`);
+    return /* @__PURE__ */ jsx6(TrustedMdxNativeChildrenContext.Provider, { value: nativeChildren, children: projection.content });
+  }
+  if (projection?.kind === "render" && projection.nativeChildren && nativeChildren === void 0)
+    throw new Error(`Trusted MDX owner "${ownerId}" has no prepared native children.`);
+  if (projection?.kind === "render") {
+    let nativeChildrenFactory = projection.rootElementName === void 0 || nativeChildren === void 0 ? void 0 : (fallback) => {
+      let owners = projection.nativeChildOwners, flowChildren = projection.flowChildren;
+      if (!owners || !flowChildren || owners.length !== flowChildren.length || !Array.isArray(nativeChildren) || nativeChildren.length !== owners.length)
+        throw new Error(`Trusted MDX owner "${ownerId}" has misaligned native child owners.`);
+      return assertTrustedMdxNativeChildContinuations(owners, flowChildren), owners.map((owner, index) => {
+        if (owner === null) return fallback(index);
+        if (owner.kind === "continuation") return;
+        let child = nativeChildren[index];
+        if (child === void 0)
+          throw new Error(`Trusted MDX owner "${ownerId}" has no rendered native child "${owner.blockId}".`);
+        return child;
+      });
+    };
+    return /* @__PURE__ */ jsx6(Fragment4, { children: projection.regions.map((Region, index) => {
+      let regionProps = {
+        components: snapshot.components,
+        ...nativeChildrenFactory === void 0 ? {} : { children: nativeChildrenFactory }
+      };
+      return React6.createElement(
+        React6.Fragment,
+        { key: `${ownerId}:${index}` },
+        Region(regionProps)
+      );
+    }) });
+  }
+  let diagnostic = projection?.kind === "unmapped" ? projection.diagnostic : snapshot.error ?? `MDX owner "${ownerId}" has no exact trusted source projection.`, status = projection?.kind === "unmapped" ? "unmapped" : snapshot.status === "error" ? "error" : "pending";
+  return (projection?.kind === "unmapped" && projection.placement !== void 0 ? projection.placement === "inline" : inline) ? /* @__PURE__ */ jsxs6("span", { className: "markdown-mdx-inline", "data-mdx-status": status, "data-mdx-diagnostic": diagnostic, children: [
+    source,
+    /* @__PURE__ */ jsx6("span", { className: "markdown-mdx-diagnostic", role: "note", children: diagnostic })
+  ] }) : /* @__PURE__ */ jsxs6("div", { className: "markdown-mdx-inert", "data-mdx-status": status, "data-mdx-diagnostic": diagnostic, children: [
+    /* @__PURE__ */ jsx6("pre", { children: /* @__PURE__ */ jsx6("code", { children: source }) }),
+    /* @__PURE__ */ jsx6("span", { className: "markdown-mdx-diagnostic", role: "note", children: diagnostic })
+  ] });
+}
+function TrustedMdxInlineOwner({ ownerId, source }) {
+  let snapshot = useContext2(TrustedMdxProjectionContext);
+  return snapshot ? /* @__PURE__ */ jsx6(Fragment4, { children: renderTrustedMdxOwner(ownerId, snapshot, source, !0) }) : /* @__PURE__ */ jsx6("span", { className: "markdown-mdx-inline", children: source });
+}
+
+// src/renderer/node-presentations.ts
+import React7 from "react";
+function renderPresentedNode(presentation, nativeView, context, applyPresentationPropsToCustomElements = !1) {
+  if (!presentation) return nativeView;
+  let prepared = nativeView;
+  return presentation.props && React7.isValidElement(prepared) && (typeof prepared.type == "string" || applyPresentationPropsToCustomElements) && (prepared = React7.cloneElement(
+    prepared,
+    mergeNodePresentationProps(prepared.props, presentation.props)
+  )), "view" in presentation && presentation.view ? React7.createElement(presentation.view, {
+    ...context.viewProps,
+    key: context.key
+  }) : "wrapper" in presentation && presentation.wrapper ? React7.createElement(presentation.wrapper, {
+    key: context.key,
+    children: prepared,
+    metadata: context.metadata,
+    actions: context.actions
+  }) : prepared;
+}
+var PRESENTATION_KEY_PATTERNS = [
+  /^[a-z][a-z0-9-]*$/,
+  /^inline:[a-z][a-z0-9-]*$/,
+  /^html:[a-z][a-z0-9-]*(?::[a-z][a-z0-9-]*)?$/,
+  /^component:[A-Za-z][A-Za-z0-9_.-]*$/,
+  /^extension:[A-Za-z][A-Za-z0-9_.-]*$/
+], RESERVED_PRESENTATION_PROPS = {
+  className: !0,
+  style: !0,
+  title: !0
 };
-var buttonStyle = {
+function resolveNodePresentation(presentations, key) {
+  if (!isNodePresentationKey(key))
+    throw new TypeError(`invalid node presentation key: ${key}`);
+  if (!presentations || !Object.prototype.hasOwnProperty.call(presentations, key)) return;
+  let candidate = presentations[key];
+  return validateNodePresentation(key, candidate), candidate;
+}
+function mergeNodePresentationProps(nativeProps, decoration) {
+  if (!decoration) return nativeProps;
+  let merged = {};
+  for (let [property, value] of Object.entries(decoration))
+    if (property === "className") {
+      let nativeClass = nativeProps.className;
+      merged.className = typeof nativeClass == "string" && value ? `${nativeClass} ${value}` : value ?? nativeClass;
+    } else property === "style" ? merged.style = { ...nativeProps.style, ...value } : Object.prototype.hasOwnProperty.call(nativeProps, property) || (merged[property] = value);
+  return merged;
+}
+function validateNodePresentations(presentations) {
+  if (presentations !== void 0) {
+    if (presentations === null || typeof presentations != "object" || Array.isArray(presentations))
+      throw new TypeError("node presentations must be an object");
+    for (let key of Object.keys(presentations)) {
+      if (!isNodePresentationKey(key))
+        throw new TypeError(`invalid node presentation key: ${key}`);
+      validateNodePresentation(key, presentations[key]);
+    }
+  }
+}
+function isNodePresentationKey(key) {
+  return PRESENTATION_KEY_PATTERNS.some((pattern) => pattern.test(key));
+}
+function validateNodePresentation(key, candidate) {
+  if (candidate === null || typeof candidate != "object" || Array.isArray(candidate))
+    throw new TypeError(`node presentation for ${key} must be an object`);
+  let presentation = candidate;
+  if ((key === "table-row" || key === "table-cell") && presentation.view !== void 0)
+    throw new TypeError(
+      `node presentation for ${key}: headless table-part views are not supported; use components.table.view with useTableRows`
+    );
+  if ((key === "table-row" || key === "table-cell") && presentation.slots !== void 0)
+    throw new TypeError(`node presentation for ${key} only supports wrapper and props`);
+  if (key.startsWith("component:") && presentation.view !== void 0)
+    throw new TypeError(`node presentation for ${key}: headless views are not supported for restricted content components`);
+  if (presentation.wrapper !== void 0 && presentation.view !== void 0)
+    throw new TypeError(`node presentation for ${key}: wrapper and view are mutually exclusive`);
+  if (presentation.wrapper !== void 0 && !isComponentType(presentation.wrapper))
+    throw new TypeError(`node presentation for ${key} has an invalid wrapper`);
+  if (presentation.view !== void 0 && !isComponentType(presentation.view))
+    throw new TypeError(`node presentation for ${key} has an invalid view`);
+  presentation.props !== void 0 && validatePresentationProps(key, presentation.props), presentation.slots !== void 0 && validatePresentationSlots(key, presentation.slots);
+  for (let property of Object.keys(presentation))
+    if (property !== "props" && property !== "wrapper" && property !== "view" && property !== "slots")
+      throw new TypeError(`node presentation for ${key} has an unknown field: ${property}`);
+}
+function isComponentType(value) {
+  return typeof value == "function" || typeof value == "object" && value !== null;
+}
+function validatePresentationProps(key, candidate) {
+  if (candidate === null || typeof candidate != "object" || Array.isArray(candidate))
+    throw new TypeError(`node presentation props for ${key} must be an object`);
+  let props = candidate;
+  for (let [property, value] of Object.entries(props)) {
+    let isDataOrAria = /^(data|aria)-[a-z][a-z0-9_.:-]*$/.test(property);
+    if (RESERVED_PRESENTATION_PROPS[property] !== !0 && !isDataOrAria)
+      throw new TypeError(`presentation prop is not allowed: ${property}`);
+    if (property === "style" && (value === null || typeof value != "object" || Array.isArray(value)))
+      throw new TypeError(`presentation style for ${key} must be an object`);
+  }
+}
+function validatePresentationSlots(key, candidate) {
+  if (candidate === null || typeof candidate != "object" || Array.isArray(candidate))
+    throw new TypeError(`node presentation slots for ${key} must be an object`);
+  for (let slot of Object.keys(candidate))
+    if (key !== "code" && key !== "table" || slot !== "actions")
+      throw new TypeError(`presentation slot is not supported for ${key}: ${slot}`);
+}
+
+// src/renderer/virtualized-table.ts
+import { useCallback as useCallback4, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef4, useState as useState5 } from "react";
+import { flushSync } from "react-dom";
+var DEFAULT_TABLE_VIRTUALIZATION_CONFIG = Object.freeze({
+  enabled: !1,
+  minRows: 40,
+  virtualizeThreshold: 40,
+  estimatedRowHeight: 40,
+  overscan: 8,
+  maxHeight: "600px"
+});
+function resolveTableVirtualizationConfig(options) {
+  if (options === !0) return { ...DEFAULT_TABLE_VIRTUALIZATION_CONFIG, enabled: !0 };
+  if (!options) return DEFAULT_TABLE_VIRTUALIZATION_CONFIG;
+  let threshold = options.minRows ?? options.virtualizeThreshold ?? 40, minRows = Number.isFinite(threshold) ? Math.max(1, Math.floor(threshold)) : 40, buffer = options.overscan ?? 8, overscan = Number.isFinite(buffer) ? Math.min(50, Math.max(1, Math.floor(buffer))) : 8, estimate = options.estimatedRowHeight ?? 40;
+  return {
+    enabled: options.enabled ?? !0,
+    minRows,
+    virtualizeThreshold: minRows,
+    estimatedRowHeight: Number.isFinite(estimate) && estimate > 0 ? estimate : 40,
+    overscan,
+    maxHeight: options.maxHeight ?? "600px"
+  };
+}
+
+// src/renderer/virtualized-code.tsx
+import { useCallback as useCallback5, useEffect as useEffect5, useMemo as useMemo3, useRef as useRef5, useState as useState6 } from "react";
+import { flushSync as flushSync2 } from "react-dom";
+var DEFAULT_VIRTUALIZED_CODE_CONFIG = {
+  enabled: !0,
+  windowSize: 100,
+  bufferSize: 50,
+  virtualizeThreshold: 200,
+  followTail: !1
+};
+function resolveVirtualizedCodeConfig(options) {
+  return {
+    ...DEFAULT_VIRTUALIZED_CODE_CONFIG,
+    ...options,
+    followTail: options?.followTail ?? DEFAULT_VIRTUALIZED_CODE_CONFIG.followTail
+  };
+}
+
+// src/components/link-safety-modal.tsx
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+var DefaultLinkSafetyModal = ({ url, isOpen, isChecking, onClose, onConfirm, onCopy }) => isOpen ? /* @__PURE__ */ jsx7(
+  "div",
+  {
+    className: "stream-mdx-link-modal-backdrop",
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-label": "Link safety confirmation",
+    style: {
+      position: "fixed",
+      inset: 0,
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      background: "rgba(0, 0, 0, 0.4)",
+      zIndex: 9999,
+      padding: "24px"
+    },
+    onClick: onClose,
+    children: /* @__PURE__ */ jsxs7(
+      "div",
+      {
+        className: "stream-mdx-link-modal",
+        style: {
+          width: "min(520px, 100%)",
+          borderRadius: 12,
+          background: "var(--background, #fff)",
+          color: "var(--foreground, #111)",
+          border: "1px solid var(--border, rgba(0, 0, 0, 0.1))",
+          boxShadow: "0 20px 60px rgba(0, 0, 0, 0.25)",
+          padding: 20
+        },
+        onClick: (event) => event.stopPropagation(),
+        children: [
+          /* @__PURE__ */ jsx7("div", { style: { fontWeight: 600, marginBottom: 8 }, children: "Open external link?" }),
+          /* @__PURE__ */ jsx7("div", { style: { fontSize: 13, opacity: 0.8, wordBreak: "break-all", marginBottom: 16 }, children: url }),
+          /* @__PURE__ */ jsxs7("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" }, children: [
+            /* @__PURE__ */ jsx7("button", { type: "button", onClick: onCopy, disabled: isChecking, style: buttonStyle, children: "Copy link" }),
+            /* @__PURE__ */ jsx7("button", { type: "button", onClick: onConfirm, disabled: isChecking, style: primaryButtonStyle, children: "Open link" }),
+            /* @__PURE__ */ jsx7("button", { type: "button", onClick: onClose, style: buttonStyle, children: "Cancel" })
+          ] })
+        ]
+      }
+    )
+  }
+) : null, buttonStyle = {
   borderRadius: 8,
   border: "1px solid var(--border, rgba(0, 0, 0, 0.1))",
   padding: "6px 12px",
   background: "var(--background, #fff)",
   color: "inherit",
   fontSize: 13
-};
-var primaryButtonStyle = {
+}, primaryButtonStyle = {
   ...buttonStyle,
   background: "var(--foreground, #111)",
   color: "var(--background, #fff)",
@@ -1148,120 +1961,295 @@ var primaryButtonStyle = {
 };
 
 // src/components/index.ts
-var MdxRuntimeBoundary = class extends React4.Component {
-  constructor() {
-    super(...arguments);
-    this.state = { hasError: false };
-  }
-  static getDerivedStateFromError() {
-    return { hasError: true };
-  }
-  componentDidCatch(error) {
-    this.props.onError(error);
-  }
-  componentDidUpdate(prevProps) {
-    if (prevProps.resetKey !== this.props.resetKey && this.state.hasError) {
-      this.setState({ hasError: false });
-    }
-  }
-  render() {
-    if (this.state.hasError) {
-      return null;
-    }
-    return this.props.children;
-  }
-};
-function renderInlineNodes(nodes, components) {
+function presentationText(node) {
+  return typeof node == "string" || typeof node == "number" ? String(node) : Array.isArray(node) ? node.map(presentationText).join("") : React8.isValidElement(node) ? presentationText(node.props.children) : "";
+}
+function renderInlineNodes(nodes, components, urlTransform, registry, parentTagName, animationContext) {
   return nodes.map((node, index) => {
-    const key = `${node.kind}-${index}`;
+    let key = `${node.kind}-${index}`, itemChildContext = animationContext?.animated && !animationContext.isFinalized ? {
+      ...animationContext,
+      nodeKeyPrefix: animationContext.nodeKeyPrefix ? `${animationContext.nodeKeyPrefix}:${key}` : key
+    } : animationContext, presentInline = (nativeView, renderedChildren) => registry ? registry.renderInlinePresentation(node, nativeView, key, itemChildContext, renderedChildren) : nativeView;
     switch (node.kind) {
       case "text": {
-        const textComponent = components.text;
-        if (textComponent && textComponent !== defaultInlineComponents.text) {
-          return React4.createElement(textComponent, { key, text: node.text });
+        let textComponent = components.text;
+        if (textComponent && textComponent !== defaultInlineComponents.text)
+          return presentInline(React8.createElement(textComponent, { key, text: node.text }));
+        if (animationContext?.animated && !animationContext.isFinalized && animationContext.timeline) {
+          let { animated, timeline, nodeKeyPrefix } = animationContext, nodeKey = nodeKeyPrefix ? `${nodeKeyPrefix}:${key}` : key, segments = splitTextSegments(node.text, animated.sep), state = timeline.getNodeState(nodeKey);
+          if (segments.length > state.count) {
+            let newCount = segments.length - state.count, newDelays = timeline.schedule(newCount, animated.stagger);
+            state.delays.push(...newDelays), state.count = segments.length;
+          } else segments.length < state.count && (state.count = segments.length, state.delays.length = segments.length);
+          let animName = animated.animationName, durationStr = animated.durationStr, spans = segments.map((segment, segmentIndex) => {
+            let delay = state.delays[segmentIndex] ?? 0, animStyle = {
+              "--sm-anim-duration": durationStr,
+              "--sm-anim-easing": animated.easing,
+              "--sm-anim-delay": `${delay}ms`
+            };
+            return animName && (animStyle["--sm-anim-name"] = animName, animStyle.animationName = animName), React8.createElement(
+              "span",
+              {
+                key: segmentIndex,
+                className: "stream-mdx-anim",
+                style: animStyle
+              },
+              segment
+            );
+          });
+          return presentInline(React8.createElement(React8.Fragment, { key }, ...spans));
         }
-        return React4.createElement(React4.Fragment, { key, children: node.text });
+        return presentInline(React8.createElement(React8.Fragment, { key, children: node.text }));
       }
-      case "strong":
-        return React4.createElement(components.strong, {
+      case "strong": {
+        if (!registry?.hasElementFilters())
+          return presentInline(React8.createElement(components.strong, {
+            key,
+            children: renderInlineNodes(node.children, components, urlTransform, registry, "strong", itemChildContext)
+          }));
+        let renderChildren = () => renderInlineNodes(node.children, components, urlTransform, registry, "strong", itemChildContext), renderElement = () => presentInline(React8.createElement(components.strong, {
           key,
-          children: renderInlineNodes(node.children, components)
-        });
-      case "em":
-        return React4.createElement(components.em, {
+          children: renderChildren()
+        }));
+        return registry.filterElement(
+          { tagName: "strong", properties: { key }, blockType: void 0 },
+          { source: "markdown", parentTagName },
+          renderElement,
+          renderChildren
+        );
+      }
+      case "em": {
+        if (!registry?.hasElementFilters())
+          return presentInline(React8.createElement(components.em, {
+            key,
+            children: renderInlineNodes(node.children, components, urlTransform, registry, "em", itemChildContext)
+          }));
+        let renderChildren = () => renderInlineNodes(node.children, components, urlTransform, registry, "em", itemChildContext), renderElement = () => presentInline(React8.createElement(components.em, {
           key,
-          children: renderInlineNodes(node.children, components)
-        });
+          children: renderChildren()
+        }));
+        return registry.filterElement(
+          { tagName: "em", properties: { key }, blockType: void 0 },
+          { source: "markdown", parentTagName },
+          renderElement,
+          renderChildren
+        );
+      }
       case "strike": {
-        const StrikeComponent = components.strike ?? ((props) => React4.createElement("del", {}, props.children));
-        return React4.createElement(StrikeComponent, {
+        let StrikeComponent = components.strike ?? ((props) => React8.createElement("del", {}, props.children));
+        if (!registry?.hasElementFilters())
+          return presentInline(React8.createElement(StrikeComponent, {
+            key,
+            children: renderInlineNodes(node.children, components, urlTransform, registry, "del", itemChildContext)
+          }));
+        let renderChildren = () => renderInlineNodes(node.children, components, urlTransform, registry, "del", itemChildContext), renderElement = () => presentInline(React8.createElement(StrikeComponent, {
           key,
-          children: renderInlineNodes(node.children, components)
-        });
+          children: renderChildren()
+        }));
+        return registry.filterElement(
+          { tagName: "del", properties: { key }, blockType: void 0 },
+          { source: "markdown", parentTagName },
+          renderElement,
+          renderChildren
+        );
       }
-      case "code":
-        return React4.createElement(components.code, { key, text: node.text });
-      case "link":
-        return React4.createElement(
+      case "code": {
+        if (!registry?.hasElementFilters())
+          return presentInline(React8.createElement(components.code, { key, text: node.text }));
+        let renderChildren = () => node.text, renderElement = () => presentInline(React8.createElement(components.code, { key, text: node.text }));
+        return registry.filterElement(
+          { tagName: "code", properties: { key, text: node.text }, blockType: void 0 },
+          { source: "markdown", parentTagName },
+          renderElement,
+          renderChildren
+        );
+      }
+      case "link": {
+        if (node.autolink && registry?.isAutolinkProtocolDisabled(node.href))
+          return renderInlineNodes(node.children, components, urlTransform, registry, parentTagName, itemChildContext);
+        let safeHref = (urlTransform ?? defaultUrlTransform4)(node.href ?? "", "href", { source: "markdown" });
+        if (!registry?.hasElementFilters())
+          return presentInline(React8.createElement(
+            components.link,
+            {
+              key,
+              ...safeHref != null ? { href: safeHref } : {},
+              title: node.title,
+              children: renderInlineNodes(node.children, components, urlTransform, registry, "a", itemChildContext)
+            }
+          ));
+        let renderChildren = () => renderInlineNodes(node.children, components, urlTransform, registry, "a", itemChildContext), renderElement = () => presentInline(React8.createElement(
           components.link,
           {
             key,
-            href: node.href,
+            ...safeHref != null ? { href: safeHref } : {},
             title: node.title,
-            children: renderInlineNodes(node.children, components)
+            children: renderChildren()
           }
+        ));
+        return registry.filterElement(
+          { tagName: "a", properties: { key, href: safeHref, title: node.title }, blockType: void 0 },
+          { source: "markdown", parentTagName },
+          renderElement,
+          renderChildren
         );
-      case "image":
-        return React4.createElement(components.image, {
+      }
+      case "image": {
+        let safeSrc = (urlTransform ?? defaultUrlTransform4)(node.src ?? "", "src", { source: "markdown" });
+        if (!registry?.hasElementFilters())
+          return presentInline(React8.createElement(components.image, {
+            key,
+            ...safeSrc != null ? { src: safeSrc } : {},
+            alt: node.alt ?? "",
+            title: node.title
+          }));
+        let renderElement = () => presentInline(React8.createElement(components.image, {
           key,
-          src: node.src,
-          alt: node.alt,
+          ...safeSrc != null ? { src: safeSrc } : {},
+          alt: node.alt ?? "",
           title: node.title
-        });
-      case "br":
-        return React4.createElement(React4.Fragment, { key }, React4.createElement(components.br, {}));
+        }));
+        return registry.filterElement(
+          { tagName: "img", properties: { key, src: safeSrc, alt: node.alt ?? "", title: node.title }, blockType: void 0 },
+          { source: "markdown", parentTagName },
+          renderElement,
+          void 0
+        );
+      }
+      case "br": {
+        if (!registry?.hasElementFilters())
+          return presentInline(React8.createElement(
+            React8.Fragment,
+            { key },
+            React8.createElement(components.br, {}),
+            `
+`
+          ));
+        let renderElement = () => presentInline(React8.createElement(
+          React8.Fragment,
+          { key },
+          React8.createElement(components.br, {}),
+          `
+`
+        ));
+        return registry.filterElement(
+          { tagName: "br", properties: { key }, blockType: void 0 },
+          { source: "markdown", parentTagName },
+          renderElement,
+          void 0
+        );
+      }
+      case "plugin": {
+        let pluginComponent = components[node.name] ?? components.plugin, hasExtensionPresentation = registry?.getNodePresentation(`extension:${node.name}`) !== void 0, pluginChildren = node.children && (pluginComponent || hasExtensionPresentation) ? renderInlineNodes(node.children, components, urlTransform, registry, parentTagName, itemChildContext) : void 0;
+        return pluginComponent ? presentInline(React8.createElement(pluginComponent, {
+          key,
+          ...node.attrs,
+          name: node.name,
+          attrs: node.attrs,
+          children: pluginChildren,
+          raw: node.raw
+        }), pluginChildren) : hasExtensionPresentation ? presentInline(React8.createElement(React8.Fragment, { key }, pluginChildren ?? node.raw), pluginChildren) : presentInline(React8.createElement(React8.Fragment, { key }, node.raw));
+      }
+      case "trusted-mdx-inline":
+        return React8.createElement(TrustedMdxInlineOwner, { key, ownerId: node.ownerId, source: node.raw });
+      case "html": {
+        let children = node.children ? renderInlineNodes(node.children, components, urlTransform, registry, node.tagName?.toLowerCase(), itemChildContext) : void 0, textValue = node.children?.map((child) => child.kind === "text" ? child.text : "").join(""), htmlRenderer = components.html;
+        return htmlRenderer && !registry?.isDefaultHtmlInlineRenderer(htmlRenderer) ? renderHtmlInlineNode(
+          node,
+          children,
+          void 0,
+          key,
+          textValue,
+          urlTransform,
+          registry?.hasElementFilters() ? (el, ctx, renderElement, renderChildren) => registry.filterElement(el, ctx, renderElement, renderChildren) : void 0,
+          parentTagName,
+          registry ? (tagName, properties, nativeView, htmlChildren, presentationKey) => registry.renderHtmlPresentation(
+            tagName,
+            properties,
+            nativeView,
+            htmlChildren,
+            presentationKey,
+            animationContext?.nodeKeyPrefix,
+            animationContext?.isFinalized,
+            animationContext?.sourceGuard
+          ) : void 0,
+          (tagName, properties, htmlChildren, presentationKey) => React8.createElement(htmlRenderer, {
+            ...node,
+            key: presentationKey,
+            children: htmlChildren,
+            textValue,
+            properties
+          })
+        ) : renderHtmlInlineNode(
+          node,
+          children,
+          void 0,
+          key,
+          textValue,
+          urlTransform,
+          registry?.hasElementFilters() ? (el, ctx, renderElement, renderChildren) => registry.filterElement(el, ctx, renderElement, renderChildren) : void 0,
+          parentTagName,
+          registry ? (tagName, properties, nativeView, htmlChildren, presentationKey) => registry.renderHtmlPresentation(
+            tagName,
+            properties,
+            nativeView,
+            htmlChildren,
+            presentationKey,
+            animationContext?.nodeKeyPrefix,
+            animationContext?.isFinalized,
+            animationContext?.sourceGuard
+          ) : void 0
+        );
+      }
       default: {
-        const component = components[node.kind];
+        let component = components[node.kind];
         if (component) {
-          return React4.createElement(component, { key, ...node });
+          let engine = node.kind === "math-inline" || node.kind === "math-display" ? registry?.getMathEngine() : void 0;
+          return presentInline(React8.createElement(component, { key, ...node, ...engine ? { engine } : {} }));
         }
-        return null;
+        return presentInline(React8.createElement(React8.Fragment, { key }, null));
       }
     }
   });
 }
 var defaultInlineComponents = {
-  text: ({ text }) => React4.createElement(React4.Fragment, {}, text),
-  strong: ({ children }) => React4.createElement("strong", {}, children),
-  em: ({ children }) => React4.createElement("em", {}, children),
-  strike: ({ children }) => React4.createElement("del", {}, children),
-  code: ({ text }) => React4.createElement(
+  text: ({ text }) => React8.createElement(React8.Fragment, {}, text),
+  strong: ({ children }) => React8.createElement("strong", {}, children),
+  em: ({ children }) => React8.createElement("em", {}, children),
+  strike: ({ children }) => React8.createElement("del", {}, children),
+  code: ({ text }) => React8.createElement(
     "code",
     {
       className: "inline-code"
     },
     text
   ),
-  link: ({ href, title, children }) => React4.createElement(
-    "a",
-    {
-      href,
+  link: ({ href, title, children }) => {
+    let safeHref = href == null ? void 0 : defaultUrlTransform4(href, "href", { source: "markdown" });
+    return React8.createElement(
+      "a",
+      {
+        ...safeHref != null ? { href: safeHref } : {},
+        title,
+        className: "markdown-link",
+        target: safeHref?.startsWith("http") ? "_blank" : void 0,
+        rel: safeHref?.startsWith("http") ? "noopener noreferrer" : void 0
+      },
+      children
+    );
+  },
+  image: ({ src, alt, title }) => {
+    let safeSrc = defaultUrlTransform4(src ?? "", "src", { source: "markdown" });
+    return React8.createElement("img", {
+      ...safeSrc != null ? { src: safeSrc } : {},
+      alt,
       title,
-      className: "markdown-link",
-      target: href?.startsWith("http") ? "_blank" : void 0,
-      rel: href?.startsWith("http") ? "noopener noreferrer" : void 0
-    },
-    children
-  ),
-  image: ({ src, alt, title }) => React4.createElement("img", {
-    src,
-    alt,
-    title,
-    className: "markdown-image"
-  }),
-  br: () => React4.createElement("br"),
+      className: "markdown-image"
+    });
+  },
+  br: () => React8.createElement("br"),
   // Custom extensible components
-  mention: ({ handle }) => React4.createElement(
+  mention: ({ handle }) => React8.createElement(
     "span",
     {
       className: "mention",
@@ -1269,7 +2257,7 @@ var defaultInlineComponents = {
     },
     `@${handle}`
   ),
-  citation: ({ id }) => React4.createElement(
+  citation: ({ id }) => React8.createElement(
     "span",
     {
       className: "citation",
@@ -1277,111 +2265,135 @@ var defaultInlineComponents = {
     },
     `[${id}]`
   ),
-  "math-inline": ({ tex }) => React4.createElement(
-    "span",
-    {
-      className: "math-inline",
-      "data-tex": tex
-    },
-    `$${tex}$`
-  ),
-  "math-display": ({ tex }) => React4.createElement(
-    "div",
-    {
-      className: "math-display markdown-math-display",
-      "data-tex": tex,
-      style: { overflowX: "auto" }
-    },
-    React4.createElement("span", { className: "math-display-content" }, `$$${tex}$$`)
-  ),
+  "math-inline": ({ tex, engine }) => React8.createElement(KaTeXInlineMath, { tex, engine }),
+  "math-display": ({ tex, engine }) => React8.createElement(KaTeXBlockMath, { tex, engine }),
   // Footnote inline reference (superscript anchor)
-  "footnote-ref": ({ label, number }) => {
-    const n = number ?? "?";
-    const href = number ? `#fn:${n}` : void 0;
-    const id = number ? `fnref:${n}` : void 0;
-    return React4.createElement(
+  "footnote-ref": ({ label, number, occurrence, defined }) => {
+    if (!number || defined === !1) return React8.createElement(React8.Fragment, null, `[^${label}]`);
+    let n = number, href = `#fn:${n}`, id = `fnref:${n}${occurrence && occurrence > 1 ? `:${occurrence}` : ""}`;
+    return React8.createElement(
       "sup",
       { className: "footnote-ref" },
-      React4.createElement("a", { href, id, "data-label": label, style: { color: "var(--foreground)", textDecoration: "underline" } }, String(n))
+      React8.createElement("a", { href, id, "data-label": label, style: { color: "var(--foreground)", textDecoration: "underline" } }, String(n))
     );
   }
 };
+function blockPresentationProps(props) {
+  let decoration = {};
+  for (let [property, value] of Object.entries(props))
+    (property === "className" || property === "style" || property === "title" || property.startsWith("data-") || property.startsWith("aria-")) && (decoration[property] = value);
+  return Object.keys(decoration).length > 0 ? decoration : void 0;
+}
+function applyBlockPresentationProps(nativeView, decoration) {
+  if (!decoration) return nativeView;
+  if (Array.isArray(nativeView))
+    return nativeView.map((child) => applyBlockPresentationProps(child, decoration));
+  if (!React8.isValidElement(nativeView)) return nativeView;
+  if (nativeView.type === React8.Fragment) {
+    let children = React8.Children.map(
+      nativeView.props.children,
+      (child) => applyBlockPresentationProps(child, decoration)
+    );
+    return React8.cloneElement(nativeView, void 0, children);
+  }
+  return React8.cloneElement(
+    nativeView,
+    mergeNodePresentationProps(nativeView.props, decoration)
+  );
+}
 var defaultBlockComponents = {
-  paragraph: ({ inlines, raw, meta, children }) => {
-    if (children !== void 0) {
-      return React4.createElement(
-        "p",
-        {
-          className: "markdown-paragraph"
-        },
-        children
+  paragraph: (props) => {
+    let { inlines, raw, meta, children } = props, decoration = blockPresentationProps(props);
+    if (children !== void 0)
+      return applyBlockPresentationProps(
+        React8.createElement("p", { className: "markdown-paragraph" }, children),
+        decoration
       );
-    }
-    const segments = Array.isArray(meta?.mixedSegments) ? meta?.mixedSegments : void 0;
+    let segments = Array.isArray(meta?.mixedSegments) ? meta?.mixedSegments : void 0;
     if (segments && segments.length > 0) {
-      const structured = renderParagraphMixedSegments(segments, defaultInlineComponents, DEFAULT_INLINE_HTML_RENDERERS);
-      if (structured.length === 1) {
-        return structured[0];
-      }
-      return React4.createElement(React4.Fragment, {}, ...structured);
+      let structured = renderParagraphMixedSegments(segments, defaultInlineComponents, DEFAULT_INLINE_HTML_RENDERERS);
+      return structured.length === 1 ? applyBlockPresentationProps(structured[0], decoration) : applyBlockPresentationProps(
+        React8.createElement(React8.Fragment, {}, ...structured),
+        decoration
+      );
     }
-    const filteredInlines = inlines && raw && inlines.length > 0 ? inlines.filter((node) => !(node.kind === "text" && node.text === raw)) : inlines ?? [];
-    const effectiveInlines = filteredInlines.length > 0 ? filteredInlines : raw ? [
+    let filteredInlines = inlines && raw && inlines.length > 0 ? inlines.filter((node) => !(node.kind === "text" && node.text === raw)) : inlines ?? [], effectiveInlines = filteredInlines.length > 0 ? filteredInlines : raw ? [
       {
         kind: "text",
         text: raw
       }
     ] : [];
-    return React4.createElement(
-      "p",
-      {
-        className: "markdown-paragraph"
-      },
-      effectiveInlines.length > 0 ? renderInlineNodes(effectiveInlines, defaultInlineComponents) : raw ?? ""
+    return applyBlockPresentationProps(
+      React8.createElement(
+        "p",
+        { className: "markdown-paragraph" },
+        effectiveInlines.length > 0 ? renderInlineNodes(effectiveInlines, defaultInlineComponents) : raw ?? ""
+      ),
+      decoration
     );
   },
-  heading: ({ level, inlines, text, meta }) => {
-    const tag = `h${level}`;
-    const onlyPlainText = Array.isArray(inlines) && inlines.length > 0 && inlines.every((node) => node.kind === "text");
-    const children = onlyPlainText ? inlines.map((node) => node.kind === "text" ? node.text : "").join("") : renderInlineNodes(inlines, defaultInlineComponents);
-    const headingId = typeof meta?.headingId === "string" && meta.headingId.length > 0 ? meta.headingId : void 0;
-    return React4.createElement(
-      tag,
-      {
-        className: `markdown-heading markdown-h${level}`,
-        ...text ? { "data-heading-text": text } : {},
-        ...headingId ? { id: headingId, "data-heading-id": headingId } : {}
-      },
-      children
+  heading: (props) => {
+    let { level, inlines, text, meta, children } = props, decoration = blockPresentationProps(props), tag = `h${level}`, onlyPlainText = Array.isArray(inlines) && inlines.length > 0 && inlines.every((node) => node.kind === "text"), content = children !== void 0 ? children : onlyPlainText ? inlines.map((node) => node.kind === "text" ? node.text : "").join("") : renderInlineNodes(inlines, defaultInlineComponents), headingId = typeof meta?.headingId == "string" && meta.headingId.length > 0 ? meta.headingId : void 0;
+    return applyBlockPresentationProps(
+      React8.createElement(
+        tag,
+        {
+          className: `markdown-heading markdown-h${level}`,
+          ...text ? { "data-heading-text": text } : {},
+          ...headingId ? { id: headingId, "data-heading-id": headingId } : {}
+        },
+        content
+      ),
+      decoration
     );
   },
-  code: ({ html, meta, lines, lang, preAttrs, codeAttrs }) => {
-    const language = typeof lang === "string" ? lang : typeof meta?.lang === "string" ? String(meta.lang) : "text";
-    if (html) {
-      return React4.createElement("div", {
-        className: `markdown-code-block language-${language || "text"}`,
+  code: ({ html, meta, lines, children, lang, preAttrs, codeAttrs }) => {
+    let language = (typeof lang == "string" ? lang : typeof meta?.lang == "string" ? String(meta.lang) : "").trim();
+    if (children !== void 0) {
+      let preAttributes = attrsToProps(preAttrs), codeAttributes = attrsToProps(codeAttrs), preClassName = [preAttributes.className, "markdown-code-block", language ? `language-${language}` : ""].filter(Boolean).join(" "), codeClassName = [codeAttributes.className, language ? `language-${language}` : ""].filter(Boolean).join(" ");
+      return React8.createElement(
+        "div",
+        { className: language ? `markdown-code-block language-${language}` : "markdown-code-block" },
+        React8.createElement(
+          "pre",
+          {
+            ...preAttributes,
+            className: preClassName
+          },
+          React8.createElement(
+            "code",
+            {
+              ...codeAttributes,
+              ...codeClassName ? { className: codeClassName } : {}
+            },
+            children
+          )
+        )
+      );
+    }
+    if (html)
+      return React8.createElement("div", {
+        className: language ? `markdown-code-block language-${language}` : "markdown-code-block",
         /* biome-ignore lint/security/noDangerouslySetInnerHtml: highlighted HTML is generated by our sanitizer */
         dangerouslySetInnerHTML: { __html: html }
       });
-    }
-    const code = meta?.code || "";
+    let code = meta?.code || "";
     if (lines && lines.length > 0) {
-      const preAttributes = attrsToProps(preAttrs);
-      const codeAttributes = attrsToProps(codeAttrs);
-      return React4.createElement(
+      let preAttributes = attrsToProps(preAttrs), codeAttributes = attrsToProps(codeAttrs), preClassName = [preAttributes.className, "markdown-code-block", language ? `language-${language}` : ""].filter(Boolean).join(" "), codeClassName = [codeAttributes.className, language ? `language-${language}` : ""].filter(Boolean).join(" ");
+      return React8.createElement(
         "pre",
         {
           ...preAttributes,
-          className: preAttributes.className ? `${preAttributes.className} markdown-code-block language-${language || "text"}` : `markdown-code-block language-${language || "text"}`
+          className: preClassName
         },
-        React4.createElement(
+        React8.createElement(
           "code",
           {
             ...codeAttributes,
-            className: codeAttributes.className ? `${codeAttributes.className} language-${language || "text"}` : `language-${language || "text"}`
+            ...codeClassName ? { className: codeClassName } : {}
           },
           lines.map(
-            (line) => React4.createElement("span", {
+            (line) => React8.createElement("span", {
               key: line.id,
               className: "line",
               /* biome-ignore lint/security/noDangerouslySetInnerHtml: line HTML is sanitized server-side */
@@ -1391,29 +2403,26 @@ var defaultBlockComponents = {
         )
       );
     }
-    return React4.createElement("pre", {
-      className: `markdown-code-block language-${language || "text"}`,
+    return React8.createElement("pre", {
+      className: language ? `markdown-code-block language-${language}` : "markdown-code-block",
       children: code
     });
   },
-  blockquote: ({ inlines, renderedContent }) => React4.createElement(
+  blockquote: ({ inlines, renderedContent }) => React8.createElement(
     "blockquote",
     {
       className: "markdown-blockquote"
     },
     renderedContent ?? renderInlineNodes(inlines, defaultInlineComponents)
   ),
-  hr: (props) => React4.createElement("hr", props),
+  hr: (props) => React8.createElement("hr", props),
   list: ({ ordered, items }) => {
-    if (items.length === 0) {
+    if (items.length === 0)
       return null;
-    }
-    const tag = ordered ? "ol" : "ul";
-    const listStyle = ordered ? {
-      ["--list-indent"]: `calc(2.5rem + ${String(items.length).length}ch)`
-    } : void 0;
-    const listItems = items.map(
-      (item, index) => React4.createElement(
+    let tag = ordered ? "ol" : "ul", listStyle = ordered ? {
+      "--list-indent": `calc(2.5rem + ${String(items.length).length}ch)`
+    } : void 0, listItems = items.map(
+      (item, index) => React8.createElement(
         "li",
         {
           key: index,
@@ -1424,7 +2433,7 @@ var defaultBlockComponents = {
         renderInlineNodes(item, defaultInlineComponents)
       )
     );
-    return React4.createElement(
+    return React8.createElement(
       tag,
       {
         className: `markdown-list ${ordered ? "ordered" : "unordered"}`,
@@ -1433,214 +2442,69 @@ var defaultBlockComponents = {
       listItems
     );
   },
-  html: ({ __trustedHtml, elements }) => {
-    const raw = typeof __trustedHtml === "string" ? __trustedHtml : __trustedHtml.toString();
-    const htmlString = typeof window === "undefined" ? raw : sanitizeHTML(raw);
-    if (typeof window !== "undefined" && elements) {
-      const content = mapHtmlToReact(htmlString, elements);
-      return React4.createElement("div", { className: "markdown-html" }, content);
+  html: ({ __trustedHtml, elements, isSanitized, literalTagContent, children }) => {
+    if (children !== void 0)
+      return React8.createElement("div", { className: "markdown-html" }, children);
+    let raw = typeof __trustedHtml == "string" ? __trustedHtml : __trustedHtml.toString(), htmlString = isSanitized || typeof window > "u" ? raw : sanitizeHTML(raw);
+    if (typeof window < "u" && elements) {
+      let content = mapHtmlToReact(htmlString, elements, literalTagContent);
+      return React8.createElement("div", { className: "markdown-html" }, content);
     }
-    return React4.createElement("div", {
+    return React8.createElement("div", {
       className: "markdown-html",
       /* biome-ignore lint/security/noDangerouslySetInnerHtml: htmlString is sanitized before injection */
       dangerouslySetInnerHTML: { __html: htmlString }
     });
   },
-  mdx: ({ compiledRef, compiledModule, status, errorMessage }) => {
-    const [Comp, setComp] = React4.useState(null);
-    const [internalError, setInternalError] = React4.useState(null);
-    const [renderError, setRenderError] = React4.useState(null);
-    const [retryKey, setRetryKey] = React4.useState(0);
-    const hydrationContext = React4.useContext(MdxHydrationContext);
-    const hydrationController = hydrationContext?.controller ?? null;
-    const hydrationOptions = hydrationContext?.options;
-    const containerRef = React4.useRef(null);
-    const deferHydration = hydrationOptions?.strategy === "visible";
-    const shouldHydrate = useDeferredRender(
-      containerRef,
-      deferHydration ? {
-        enabled: true,
-        rootMargin: hydrationOptions?.rootMargin,
-        idleTimeoutMs: hydrationOptions?.idleTimeoutMs,
-        debounceMs: hydrationOptions?.debounceMs
-      } : { enabled: false }
-    );
-    const resolvedId = compiledModule?.id ?? (compiledRef?.id && compiledRef.id !== "pending" ? compiledRef.id : void 0);
-    const handleRetry = React4.useCallback(() => {
-      setInternalError(null);
-      setRenderError(null);
-      setComp(null);
-      setRetryKey((prev) => prev + 1);
-    }, []);
-    const handleRuntimeError = React4.useCallback(
-      (error) => {
-        const message2 = error instanceof Error ? error.message : String(error);
-        setRenderError(message2);
-        markMdxHydrationError(resolvedId ?? compiledRef?.id);
-      },
-      [resolvedId, compiledRef?.id]
-    );
-    const effectiveStatus = status ? status : resolvedId ? "compiled" : "pending";
-    const failureMessage = errorMessage ?? internalError ?? renderError ?? null;
-    const moduleDependencies = compiledModule?.dependencies;
-    React4.useEffect(() => {
-      if (!shouldHydrate) {
-        return;
-      }
-      if (status === "error") {
-        markMdxHydrationError(resolvedId ?? compiledRef?.id);
-        return;
-      }
-      let cancelled = false;
-      async function ensure() {
-        let permit = null;
-        try {
-          if (status === "error" || !resolvedId || resolvedId === "pending") {
-            if (!cancelled) {
-              setComp(null);
-              setInternalError(null);
-            }
-            return;
-          }
-          if (hydrationController) {
-            permit = await hydrationController.acquire();
-            if (cancelled) {
-              permit.release();
-              return;
-            }
-          }
-          setInternalError(null);
-          setRenderError(null);
-          markMdxHydrationStart(resolvedId);
-          const { getMDXComponentFactory: getMDXComponentFactory2, registerInlineMdxModule: registerInlineMdxModule2 } = await loadMdxRuntime();
-          if (compiledModule?.code) {
-            registerInlineMdxModule2({
-              id: compiledModule.id,
-              code: compiledModule.code,
-              dependencies: moduleDependencies ?? []
-            });
-          }
-          const factory = getMDXComponentFactory2();
-          const C = await factory.createComponent({ id: resolvedId });
-          if (!cancelled) {
-            setComp(() => C);
-            setInternalError(null);
-            markMdxHydrated(resolvedId);
-          }
-        } catch (error) {
-          if (!cancelled) {
-            const message2 = error instanceof Error ? error.message : String(error);
-            setInternalError(message2);
-            markMdxHydrationError(resolvedId);
-          }
-        } finally {
-          permit?.release();
-        }
-      }
-      ensure();
-      return () => {
-        cancelled = true;
-      };
-    }, [compiledModule?.id, compiledModule?.code, moduleDependencies, resolvedId, status, shouldHydrate, retryKey]);
-    const compileMode = compiledModule?.source === "worker" || compiledRef?.id?.startsWith("worker:") ? "worker" : "server";
-    const pendingId = resolvedId && resolvedId !== "pending" ? resolvedId : compiledRef?.id ?? "pending";
-    const waitingForVisibility = deferHydration && !shouldHydrate && Boolean(resolvedId);
-    const pendingLabel = waitingForVisibility ? "MDX ready (hydrate on view)\u2026" : compileMode === "worker" ? "Compiling MDX (client)\u2026" : "Compiling MDX (server)\u2026";
-    const message = failureMessage ?? (compileMode === "worker" ? "MDX compilation failed in client mode. Try switching back to server rendering or restarting the stream." : "MDX compilation failed. Try restarting the stream.");
-    const allowRetry = Boolean(internalError || renderError);
-    const retryButton = allowRetry ? React4.createElement(
-      "button",
-      {
-        type: "button",
-        className: "markdown-mdx-retry",
-        onClick: handleRetry
-      },
-      "Retry hydration"
-    ) : null;
-    const errorPanel = React4.createElement(
-      React4.Fragment,
-      null,
-      React4.createElement("strong", null, "MDX failed"),
-      React4.createElement("div", null, message)
-    );
-    if (Comp && !failureMessage) {
-      return React4.createElement(
-        "div",
-        {
-          className: "markdown-mdx",
-          ref: containerRef,
-          "data-mdx-ref": resolvedId ?? compiledRef?.id ?? "compiled",
-          "data-mdx-status": failureMessage ? "error" : "compiled",
-          "data-mdx-mode": compileMode
-        },
-        React4.createElement(
-          MdxRuntimeBoundary,
-          { resetKey: retryKey, onError: handleRuntimeError },
-          React4.createElement(Comp, {})
-        )
-      );
-    }
-    if (failureMessage) {
-      return React4.createElement(
-        "div",
-        {
-          className: "markdown-mdx error",
-          ref: containerRef,
-          "data-mdx-ref": pendingId,
-          "data-mdx-status": "error",
-          "data-mdx-mode": compileMode
-        },
-        errorPanel,
-        retryButton
-      );
-    }
-    if (!Comp) {
-      return React4.createElement(
-        "div",
-        {
-          className: "markdown-mdx",
-          ref: containerRef,
-          "data-mdx-ref": pendingId,
-          "data-mdx-status": "pending",
-          "data-mdx-mode": compileMode
-        },
-        pendingLabel
-      );
+  mdx: ({ raw, meta }) => {
+    let originalType = typeof meta?.originalType == "string" ? String(meta.originalType) : void 0, mixedSegments = Array.isArray(meta?.mixedSegments) ? meta.mixedSegments : void 0;
+    if (originalType === "paragraph" && !meta?.mdxStandalone && mixedSegments && mixedSegments.length > 0) {
+      let structured = renderParagraphMixedSegments(mixedSegments, defaultInlineComponents, DEFAULT_INLINE_HTML_RENDERERS);
+      return structured.length === 1 ? structured[0] : React8.createElement(React8.Fragment, {}, ...structured);
     }
+    return React8.createElement(
+      "div",
+      { className: "markdown-mdx-inert", "data-diagnostic": "MDX requires explicit engines.mdx in trusted-mdx mode" },
+      React8.createElement("pre", null, React8.createElement("code", null, raw ?? ""))
+    );
   },
   // Footnotes block rendered at page end
   footnotes: ({ items }) => {
-    if (!items || items.length === 0) return React4.createElement(React4.Fragment, null);
-    const listItems = items.map(
-      (item) => React4.createElement(
+    if (!items || items.length === 0) return React8.createElement(React8.Fragment, null);
+    let listItems = items.map(
+      (item) => React8.createElement(
         "li",
         { key: item.number, id: `fn:${item.number}` },
         renderInlineNodes(item.inlines, defaultInlineComponents),
-        " ",
-        React4.createElement(
-          "a",
-          {
-            href: `#fnref:${item.number}`,
-            className: "footnote-backref",
-            "aria-label": "Back to content",
-            style: { color: "var(--foreground)", textDecoration: "underline" }
-          },
-          "\u21A9"
-        )
+        ...Array.from({ length: item.refCount ?? 1 }, (_, index) => React8.createElement(
+          React8.Fragment,
+          { key: index },
+          " ",
+          React8.createElement(
+            "a",
+            {
+              href: `#fnref:${item.number}${index > 0 ? `:${index + 1}` : ""}`,
+              className: "footnote-backref",
+              "aria-label": index > 0 ? `Back to content (reference ${index + 1})` : "Back to content",
+              style: { color: "var(--foreground)", textDecoration: "underline" }
+            },
+            "\u21A9",
+            index > 0 ? React8.createElement("sup", null, String(index + 1)) : null
+          )
+        ))
       )
     );
-    return React4.createElement("section", { className: "footnotes" }, React4.createElement("hr", {}), React4.createElement("ol", {}, listItems));
+    return React8.createElement("section", { className: "footnotes" }, React8.createElement("hr", {}), React8.createElement("ol", {}, listItems));
   },
   // Footnote definition placeholders (render nothing)
-  "footnote-def": () => React4.createElement(React4.Fragment, null),
+  "footnote-def": () => React8.createElement(React8.Fragment, null),
   // Callouts block
   callout: ({ kind, inlines = [] }) => {
-    const tone = (kind || "NOTE").toUpperCase();
-    const title = tone.charAt(0) + tone.slice(1).toLowerCase();
-    return React4.createElement(
+    let tone = (kind || "NOTE").toUpperCase(), title = tone.charAt(0) + tone.slice(1).toLowerCase();
+    return React8.createElement(
       "div",
       { className: `markdown-callout markdown-callout-${tone.toLowerCase()} border rounded p-3 my-3` },
-      React4.createElement("div", { className: "font-semibold mb-1" }, title),
+      React8.createElement("div", { className: "font-semibold mb-1" }, title),
       inlines.length > 0 ? renderInlineNodes(inlines, defaultInlineComponents) : null
     );
   },
@@ -1651,11 +2515,9 @@ var defaultBlockComponents = {
     align,
     elements
   }) => {
-    const El = getDefaultTableElements(elements);
-    const renderCells = (cells, tag, rowIdx) => cells.map((cell, i) => {
-      const columnAlign = align?.[i] ?? void 0;
-      const cellStyle = columnAlign ? { textAlign: columnAlign } : void 0;
-      return React4.createElement(
+    let El = getDefaultTableElements(elements), renderCells = (cells, tag, rowIdx) => cells.map((cell, i) => {
+      let columnAlign = align?.[i] ?? void 0, cellStyle = columnAlign ? { textAlign: columnAlign } : void 0;
+      return React8.createElement(
         tag === "th" ? El.Th : El.Td,
         {
           key: `${rowIdx}-${i}`,
@@ -1666,54 +2528,228 @@ var defaultBlockComponents = {
         renderInlineNodes(cell, defaultInlineComponents)
       );
     });
-    return React4.createElement(
+    return React8.createElement(
       El.Table,
       { className: "markdown-table" },
-      header && header.length > 0 ? React4.createElement(El.Thead, {}, React4.createElement(El.Tr, {}, renderCells(header, "th", -1))) : null,
-      React4.createElement(
+      header && header.length > 0 ? React8.createElement(El.Thead, {}, React8.createElement(El.Tr, {}, renderCells(header, "th", -1))) : null,
+      rows && rows.length > 0 ? React8.createElement(
         El.Tbody,
         {},
-        rows.map((row, r) => React4.createElement(El.Tr, { key: r }, renderCells(row, "td", r)))
-      )
+        rows.map((row, r) => React8.createElement(El.Tr, { key: r }, renderCells(row, "td", r)))
+      ) : null
     );
   }
-};
-var ComponentRegistry = class {
-  constructor(blockComponents = {}, inlineComponents = {}) {
-    this.blockComponentMapCache = null;
+}, ComponentRegistry = class {
+  constructor(options) {
+    this.nodePresentations = {};
+    this.tableVirtualization = DEFAULT_TABLE_VIRTUALIZATION_CONFIG;
+    this.tableVirtualizationListeners = /* @__PURE__ */ new Set();
+    this.codeVirtualization = DEFAULT_VIRTUALIZED_CODE_CONFIG;
+    this.codeVirtualizationListeners = /* @__PURE__ */ new Set();
     this.inlineComponentMapCache = null;
-    this.blockComponents = { ...defaultBlockComponents, ...blockComponents };
-    this.inlineComponents = { ...defaultInlineComponents, ...inlineComponents };
-    this.htmlElements = getDefaultHtmlElements();
-    this.tableElements = getDefaultTableElements();
+    this.controls = !1;
+    this.animatedOptions = null;
+    this.animationTimeline = null;
+    this.hasFilterConfig = !1;
+    this.mathEngine = options?.engines?.math, this.mermaidEngine = options?.engines?.mermaid, this.inlineComponents = { ...defaultInlineComponents }, this.htmlElements = getDefaultHtmlElements(), options?.urlTransform && (this.urlTransform = options.urlTransform), options?.contentComponents && (this.contentComponents = options.contentComponents);
+    let defaultHtmlInlineRenderer = (node) => renderHtmlInlineNode(node, node.children, this.htmlElements, void 0, node.textValue, this.urlTransform);
+    this.defaultHtmlInlineRenderer = defaultHtmlInlineRenderer, this.inlineComponents.html = defaultHtmlInlineRenderer, this.tableElements = getDefaultTableElements(), this.setNodePresentations(options?.components), options?.tableVirtualization !== void 0 && this.setTableVirtualization(options.tableVirtualization), options?.codeVirtualization !== void 0 && this.setCodeVirtualization(options.codeVirtualization), options?.controls !== void 0 && this.setControls(options.controls), options?.controlsComponent !== void 0 && this.setControlsComponent(options.controlsComponent), options?.animated !== void 0 && this.setAnimated(options.animated), options && this.setElementFilters(options);
   }
-  /**
-   * Update block components
-   */
-  setBlockComponents(components) {
-    this.blockComponents = { ...this.blockComponents, ...components };
-    this.blockComponentMapCache = null;
+  setLinkSafetyRenderer(renderer) {
+    this.inlineComponents = {
+      ...this.inlineComponents,
+      link: renderer ?? defaultInlineComponents.link
+    }, this.inlineComponentMapCache = null;
   }
-  /**
-   * Update inline components
-   */
-  setInlineComponents(components) {
-    this.inlineComponents = { ...this.inlineComponents, ...components };
-    this.inlineComponentMapCache = null;
+  hasElementFilters() {
+    return this.hasFilterConfig;
+  }
+  /** Replaces the whole filter configuration at once so prop swaps (allowed -> disallowed) never trip the exclusivity check. */
+  setElementFilters(options) {
+    let { allowedElements, disallowedElements, allowElement, unwrapDisallowed, disableAutolinkProtocols } = options;
+    if (allowedElements && disallowedElements)
+      throw new Error("Cannot specify both allowedElements and disallowedElements; expected one or the other");
+    let toTagSet = (tags) => tags ? new Set(tags.map((tag) => tag.trim().toLowerCase())) : void 0;
+    this.allowedElements = toTagSet(allowedElements), this.disallowedElements = toTagSet(disallowedElements), this.allowElement = allowElement, this.unwrapDisallowed = unwrapDisallowed, this.disableAutolinkProtocols = disableAutolinkProtocols ? new Set(disableAutolinkProtocols.map((protocol) => protocol.trim().toLowerCase().replace(/:$/, ""))) : void 0, this.hasFilterConfig = !!(this.allowedElements || this.disallowedElements || this.allowElement);
+  }
+  isAutolinkProtocolDisabled(href) {
+    if (!this.disableAutolinkProtocols || !href) return !1;
+    let match = /^[a-zA-Z][a-zA-Z0-9+.-]*(?=:)/.exec(href.trim());
+    return match ? this.disableAutolinkProtocols.has(match[0].toLowerCase()) : !1;
+  }
+  isElementAllowed(element, context) {
+    let tag = element.tagName.toLowerCase();
+    return !(this.allowedElements && !this.allowedElements.has(tag) || this.disallowedElements && this.disallowedElements.has(tag) || this.allowElement && !this.allowElement(
+      { tagName: tag, properties: element.properties ?? {}, blockType: element.blockType },
+      context
+    ));
+  }
+  filterElement(element, context, renderElement, renderChildren) {
+    if (!this.hasFilterConfig || this.isElementAllowed(element, context))
+      return renderElement();
+    if (this.unwrapDisallowed && renderChildren) {
+      let children = renderChildren();
+      if (children == null) return null;
+      let key = element.properties?.key;
+      return React8.createElement(React8.Fragment, key !== void 0 ? { key } : null, children);
+    }
+    return null;
+  }
+  setUrlTransform(transform) {
+    this.urlTransform = transform;
   }
-  /** Update HTML element mapping for html blocks */
-  setHtmlElements(map) {
-    this.htmlElements = { ...this.htmlElements, ...map };
+  setAnimated(animated) {
+    this.animated = animated, this.animatedOptions = resolveAnimatedOptions(animated), this.animatedOptions ? this.animationTimeline ? this.animationTimeline.updateOptions({
+      maxBacklogMs: this.animatedOptions.maxBacklogMs,
+      stagger: this.animatedOptions.stagger
+    }) : this.animationTimeline = new AnimationTimeline({
+      maxBacklogMs: this.animatedOptions.maxBacklogMs,
+      stagger: this.animatedOptions.stagger
+    }) : (this.animationTimeline && this.animationTimeline.reset(), this.animationTimeline = null);
   }
-  /** Update table element mapping for table blocks */
-  setTableElements(map) {
-    this.tableElements = { ...this.tableElements, ...map };
+  getAnimated() {
+    return this.animated;
+  }
+  getAnimatedOptions() {
+    return this.animatedOptions;
+  }
+  getAnimationTimeline() {
+    return this.animationTimeline;
+  }
+  getRenderInlineContext(isFinalized, blockId, sourceGuard) {
+    let context;
+    return isFinalized ? (blockId && this.animationTimeline && this.animationTimeline.releasePrefix(blockId), context = blockId ? { isFinalized: !0, nodeKeyPrefix: blockId } : void 0) : this.animatedOptions && this.animationTimeline && (context = {
+      isFinalized: !1,
+      animated: this.animatedOptions,
+      timeline: this.animationTimeline,
+      nodeKeyPrefix: blockId
+    }), sourceGuard ? { ...context ?? { isFinalized: isFinalized ?? !1 }, sourceGuard } : context;
+  }
+  resetAnimationTimeline() {
+    this.animationTimeline?.reset();
+  }
+  getUrlTransform() {
+    return this.urlTransform;
+  }
+  releaseFinalizedBlockAnimations(blockId) {
+    this.animationTimeline?.releasePrefix(blockId);
+  }
+  setNodePresentations(presentations) {
+    validateNodePresentations(presentations), this.nodePresentations = presentations ?? {};
+  }
+  getNodePresentation(key) {
+    return resolveNodePresentation(this.nodePresentations, key);
+  }
+  isDefaultHtmlInlineRenderer(renderer) {
+    return !renderer || !this.defaultHtmlInlineRenderer ? !1 : renderer === this.defaultHtmlInlineRenderer;
+  }
+  renderInlinePresentation(node, nativeView, key, context, renderedChildren) {
+    let keyName = node.kind === "plugin" ? `extension:${node.name}` : node.kind === "math-inline" || node.kind === "math-display" ? "inline:math" : `inline:${node.kind}`, presentation = this.getNodePresentation(keyName);
+    if (!presentation) return nativeView;
+    let hasPluginComponent = node.kind === "plugin" && (this.inlineComponents[node.name] !== void 0 || this.inlineComponents.plugin !== void 0), preparedNativeView = node.kind === "plugin" && !hasPluginComponent && renderedChildren !== void 0 ? React8.createElement(React8.Fragment, { key }, renderedChildren) : nativeView, presentedNode = node;
+    if ("view" in presentation && presentation.view) {
+      let transform = this.urlTransform ?? defaultUrlTransform4;
+      node.kind === "link" ? presentedNode = {
+        ...node,
+        href: transform(node.href ?? "", "href", { source: "markdown" }) ?? void 0
+      } : node.kind === "image" && (presentedNode = {
+        ...node,
+        src: transform(node.src ?? "", "src", { source: "markdown" }) ?? ""
+      });
+    }
+    let metadata = Object.freeze({
+      id: `${context?.nodeKeyPrefix ?? "inline"}:${String(key)}`,
+      type: keyName,
+      isFinalized: context?.isFinalized ?? !1
+    }), source = () => (context?.sourceGuard?.(), inlineToPlainText([node])), actions = Object.freeze({
+      readSource: source,
+      copy: () => copyToClipboard(source()),
+      download: () => downloadFile(source(), `${node.kind}.txt`)
+    }), children = node.kind === "math-inline" || node.kind === "math-display" ? nativeView : renderedChildren ?? (React8.isValidElement(preparedNativeView) ? preparedNativeView.props.children : void 0);
+    return renderPresentedNode(presentation, preparedNativeView, {
+      key,
+      metadata,
+      actions,
+      viewProps: { node: presentedNode, children, metadata, actions }
+    });
+  }
+  renderHtmlPresentation(tagName, properties, nativeView, children, key, ownerId, isFinalized = !1, sourceGuard) {
+    let keyName = `html:${tagName.toLowerCase()}`, presentation = this.getNodePresentation(keyName);
+    if (!presentation) return nativeView;
+    let viewProperties = {};
+    for (let [property, value] of Object.entries(properties))
+      property !== "key" && (viewProperties[property] = value);
+    let source = () => (sourceGuard?.(), presentationText(children)), metadata = Object.freeze({
+      id: `${ownerId ?? "html"}:${String(key)}`,
+      type: keyName,
+      isFinalized
+    }), actions = Object.freeze({
+      readSource: source,
+      copy: () => copyToClipboard(source()),
+      download: () => downloadFile(source(), `${tagName.toLowerCase()}.txt`)
+    });
+    return renderPresentedNode(presentation, nativeView, {
+      key,
+      metadata,
+      actions,
+      viewProps: { tagName: tagName.toLowerCase(), properties: viewProperties, children, metadata, actions }
+    });
+  }
+  renderComponentPresentation(name, nativeView, children, key, status, rawSource, ownerId, sourceGuard) {
+    let keyName = `component:${name}`, presentation = this.getNodePresentation(keyName);
+    if (!presentation) return nativeView;
+    if ("view" in presentation && presentation.view)
+      throw new TypeError(`node presentation for ${keyName}: headless views are not supported for restricted content components`);
+    let preparedNativeView = presentation.props ? React8.cloneElement(
+      nativeView,
+      mergeNodePresentationProps(nativeView.props, presentation.props)
+    ) : nativeView;
+    if (!("wrapper" in presentation) || !presentation.wrapper) return preparedNativeView;
+    let source = () => (sourceGuard?.(), rawSource ?? presentationText(children)), metadata = Object.freeze({
+      id: `${ownerId ?? "component"}:${String(key)}`,
+      type: keyName,
+      isFinalized: status === "closed"
+    }), actions = Object.freeze({
+      readSource: source,
+      copy: () => copyToClipboard(source()),
+      download: () => downloadFile(source(), `${name}.txt`)
+    });
+    return React8.createElement(presentation.wrapper, { key, children: preparedNativeView, metadata, actions });
+  }
+  /** Get HTML element mapping */
+  getHtmlElements() {
+    return this.htmlElements;
+  }
+  /** Update literal tag content list */
+  setLiteralTagContent(tags) {
+    this.literalTagContent = tags;
+  }
+  /** Get literal tag content list */
+  getLiteralTagContent() {
+    return this.literalTagContent;
+  }
+  setControls(controls) {
+    this.controls = controls ?? !1;
+  }
+  getControls() {
+    return this.controls;
+  }
+  setControlsComponent(component) {
+    this.controlsComponent = component;
+  }
+  getControlsComponent() {
+    if (this.controlsComponent)
+      return this.controlsComponent;
   }
   /**
    * Get block component
    */
   getBlockComponent(type) {
-    return this.blockComponents[type] || this.blockComponents.paragraph;
+    return defaultBlockComponents[type] ?? defaultBlockComponents.paragraph;
+  }
+  getCodeNodeView() {
+    let presentation = this.getNodePresentation("code");
+    return presentation && "view" in presentation ? presentation.view : void 0;
   }
   /**
    * Get inline components
@@ -1721,112 +2757,309 @@ var ComponentRegistry = class {
   getInlineComponents() {
     return this.inlineComponents;
   }
-  getBlockComponentMap() {
-    if (!this.blockComponentMapCache) {
-      this.blockComponentMapCache = { ...this.blockComponents };
-    }
-    return this.blockComponentMapCache;
+  getMathEngine() {
+    return this.mathEngine;
   }
-  getInlineComponentMap() {
-    if (!this.inlineComponentMapCache) {
-      this.inlineComponentMapCache = { ...this.inlineComponents };
-    }
-    return this.inlineComponentMapCache;
+  setMermaidEngine(engine) {
+    this.mermaidEngine = engine;
+  }
+  getMermaidEngine() {
+    return this.mermaidEngine;
+  }
+  setContentComponents(contentComponents) {
+    this.contentComponents = contentComponents;
+  }
+  getContentComponents() {
+    return this.contentComponents;
+  }
+  renderHtmlTree(tree, renderBlock = (block) => this.renderBlock(block), paragraph, parentTagName, renderParagraphPresentation, sourceGuard) {
+    return renderOwnedHtmlTree(
+      tree,
+      this.ownedHtmlRenderContext(renderBlock, paragraph, parentTagName, void 0, renderParagraphPresentation, sourceGuard)
+    );
+  }
+  ownedHtmlRenderContext(renderBlock = (block) => this.renderBlock(block), paragraph, parentTagName, inlineContext, renderParagraphPresentation, sourceGuard) {
+    let renderContext = inlineContext ?? (paragraph ? this.getRenderInlineContext(paragraph.isFinalized, paragraph.id, sourceGuard) : void 0);
+    return {
+      elements: this.htmlElements,
+      renderBlock,
+      renderInline: (nodes, parentTagName2) => renderInlineNodes(nodes, this.inlineComponents, this.urlTransform, this, parentTagName2, renderContext),
+      renderInlinePresentation: (node, nativeView, key, children) => this.renderInlinePresentation(node, nativeView, key, renderContext, children),
+      renderHtmlPresentation: (tagName, properties, nativeView, children, key) => this.renderHtmlPresentation(
+        tagName,
+        properties,
+        nativeView,
+        children,
+        key,
+        renderContext?.nodeKeyPrefix ?? String(paragraph?.id ?? parentTagName ?? "html"),
+        renderContext?.isFinalized ?? paragraph?.isFinalized ?? !1,
+        renderContext?.sourceGuard
+      ),
+      renderComponentPresentation: (name, nativeView, children, key, status, rawSource) => this.renderComponentPresentation(
+        name,
+        nativeView,
+        children,
+        key,
+        status,
+        rawSource,
+        renderContext?.nodeKeyPrefix ?? String(paragraph?.id ?? parentTagName ?? "html"),
+        renderContext?.sourceGuard
+      ),
+      inlineComponents: this.inlineComponents,
+      urlTransform: this.urlTransform,
+      isAutolinkProtocolDisabled: (href) => this.isAutolinkProtocolDisabled(href),
+      filterElement: this.hasElementFilters() ? (element, context, renderElement, renderChildren) => this.filterElement(element, context, renderElement, renderChildren) : void 0,
+      parentTagName,
+      contentComponents: this.contentComponents,
+      renderParagraph: paragraph ? (children) => {
+        let nativeView = React8.createElement(this.getBlockComponent("paragraph"), {
+          ...this.getBlockProps(paragraph, sourceGuard),
+          children
+        });
+        return renderParagraphPresentation ? renderParagraphPresentation(nativeView) : nativeView;
+      } : void 0
+    };
   }
   getTableElements() {
     return this.tableElements;
   }
+  subscribeTableVirtualization(listener) {
+    return this.tableVirtualizationListeners.add(listener), () => {
+      this.tableVirtualizationListeners.delete(listener);
+    };
+  }
+  setTableVirtualization(options) {
+    this.tableVirtualization = resolveTableVirtualizationConfig(options);
+    for (let listener of this.tableVirtualizationListeners)
+      listener();
+  }
+  getTableVirtualization() {
+    return this.tableVirtualization;
+  }
+  subscribeCodeVirtualization(listener) {
+    return this.codeVirtualizationListeners.add(listener), () => {
+      this.codeVirtualizationListeners.delete(listener);
+    };
+  }
+  setCodeVirtualization(options) {
+    this.codeVirtualization = resolveVirtualizedCodeConfig(options);
+    for (let listener of this.codeVirtualizationListeners)
+      listener();
+  }
+  getCodeVirtualization() {
+    return this.codeVirtualization;
+  }
   /**
    * Render a block
    */
-  renderBlock(block) {
-    const Component = this.getBlockComponent(block.type);
-    const props = this.getBlockProps(block);
-    return React4.createElement(Component, {
-      key: block.id,
-      ...props
-    });
+  renderBlock(block, renderPresentation, sourceGuard) {
+    let meta = block.payload.meta, sourceOwnedHtmlTree = meta?.htmlOwnership === !0 && Array.isArray(meta.htmlTree) ? meta.htmlTree : void 0;
+    if (block.type === "paragraph" && sourceOwnedHtmlTree)
+      return React8.createElement(
+        React8.Fragment,
+        {},
+        this.renderHtmlTree(sourceOwnedHtmlTree, void 0, block, void 0, renderPresentation, sourceGuard)
+      );
+    if (block.type === "paragraph" && meta?.htmlParagraphTree)
+      return React8.createElement(
+        React8.Fragment,
+        {},
+        this.renderHtmlTree(meta.htmlParagraphTree, void 0, block, void 0, renderPresentation, sourceGuard)
+      );
+    let Component = this.getBlockComponent(block.type), props = this.getBlockProps(block, sourceGuard), paragraphGroups = block.type === "paragraph" && Array.isArray(block.payload.meta?.mixedSegments) && Array.isArray(props.children) ? props.children : void 0;
+    paragraphGroups && (props.children = paragraphGroups.flatMap(
+      (group) => React8.isValidElement(group) && group.type === "p" ? React8.Children.toArray(group.props.children) : [group]
+    ));
+    let element = paragraphGroups ? React8.createElement(React8.Fragment, { key: block.id }, ...paragraphGroups.map(
+      (group, index) => React8.isValidElement(group) && group.type === "p" ? React8.createElement(Component, { ...props, key: `${block.id}-${index}`, children: group.props.children }) : group
+    )) : React8.createElement(Component, { key: block.id, ...props }), finalElement = (() => {
+      if (block.type === "code") {
+        let meta2 = block.payload.meta ?? {}, lang = typeof meta2.lang == "string" ? String(meta2.lang) : "", raw = typeof block.payload.raw == "string" ? block.payload.raw : "", metaCode = typeof meta2.code == "string" ? meta2.code : null, normalizedRaw = raw.replace(/\r\n?/g, `
+`), fenced = stripCodeFence(block.isFinalized ? normalizedRaw : trimProvisionalFenceTail(normalizedRaw)), codeText = metaCode !== null ? metaCode.replace(/\r\n?/g, `
+`) : fenced.hadFence ? fenced.code : normalizedRaw, codeControls = resolveCodeControls(this.getControls());
+        if (Array.isArray(meta2.diffBlocks) && meta2.diffBlocks.length > 0)
+          return React8.createElement(DefaultDiffRenderer, {
+            key: block.id,
+            meta: meta2,
+            renderCode: element
+          });
+        if (codeControls.enabled) {
+          let ControlsComponent = this.getControlsComponent(), controlsElement = ControlsComponent ? React8.createElement(ControlsComponent, {
+            type: "code",
+            blockId: block.id,
+            code: codeText,
+            language: lang,
+            isFinalized: block.isFinalized,
+            onCopy: () => copyToClipboard(codeText),
+            onDownload: () => downloadFile(codeText, getCodeSnippetFilename(lang)),
+            labels: codeControls.labels
+          }) : React8.createElement(CodeControlsBar, {
+            code: codeText,
+            language: lang,
+            config: codeControls
+          });
+          return React8.createElement("div", { className: "stream-mdx-code-wrapper relative", key: block.id }, controlsElement, element);
+        }
+      }
+      if (block.type === "table") {
+        let tableControls = resolveTableControls(this.getControls());
+        if (tableControls.enabled) {
+          let meta2 = block.payload.meta ?? {}, header = Array.isArray(meta2.header) ? meta2.header.map((cell) => inlineToPlainText(cell)) : [], rows = Array.isArray(meta2.rows) ? meta2.rows.map((r) => r.map((cell) => inlineToPlainText(cell))) : [], align = Array.isArray(meta2.align) ? meta2.align : void 0, isFinalized = !!block.isFinalized, ControlsComponent = this.getControlsComponent(), controlsElement = ControlsComponent ? React8.createElement(ControlsComponent, {
+            type: "table",
+            blockId: block.id,
+            headers: header,
+            rows,
+            align,
+            isFinalized,
+            onCopy: (format) => {
+              if (!isFinalized) return;
+              let text = format === "markdown" ? tableToMarkdown(header, rows, align) : tableToTsv(header, rows);
+              return copyToClipboard(text);
+            },
+            onDownload: (format) => {
+              isFinalized && (format === "tsv" ? downloadFile(tableToTsv(header, rows), "table.tsv", "text/tab-separated-values;charset=utf-8") : format === "markdown" ? downloadFile(tableToMarkdown(header, rows, align), "table.md", "text/markdown;charset=utf-8") : downloadFile(tableToCsv(header, rows), "table.csv", "text/csv;charset=utf-8"));
+            },
+            labels: tableControls.labels
+          }) : React8.createElement(TableControlsBar, {
+            headers: header,
+            rows,
+            align,
+            isFinalized,
+            config: tableControls
+          });
+          return React8.createElement("div", { className: "stream-mdx-table-wrapper relative", key: block.id }, controlsElement, element);
+        }
+      }
+      return element;
+    })();
+    if (this.hasFilterConfig) {
+      let blockTagName = "";
+      switch (block.type) {
+        case "paragraph":
+          blockTagName = "p";
+          break;
+        case "heading": {
+          let meta2 = block.payload.meta ?? {}, levelFromMeta = typeof meta2.headingLevel == "number" ? meta2.headingLevel : void 0, normalizedLevel = Number.isFinite(levelFromMeta) ? Math.min(Math.max(levelFromMeta, 1), 6) : void 0, rawHeading = typeof block.payload.raw == "string" ? block.payload.raw : "";
+          blockTagName = `h${normalizedLevel ?? this.extractHeadingLevel(rawHeading)}`;
+          break;
+        }
+        case "code":
+          blockTagName = "pre";
+          break;
+        case "blockquote":
+          blockTagName = "blockquote";
+          break;
+        case "hr":
+          blockTagName = "hr";
+          break;
+        case "list":
+          blockTagName = block.payload.meta?.ordered ? "ol" : "ul";
+          break;
+        case "table":
+          blockTagName = "table";
+          break;
+      }
+      if (blockTagName) {
+        let renderChildren = () => {
+          if (block.type === "paragraph" || block.type === "heading")
+            return "children" in props ? props.children : void 0;
+          if (block.type === "blockquote")
+            return "renderedContent" in props ? props.renderedContent : void 0;
+          if (block.type === "code") {
+            let meta2 = block.payload.meta;
+            return (meta2 && typeof meta2 == "object" && "code" in meta2 && typeof meta2.code == "string" ? meta2.code : void 0) || block.payload.raw || "";
+          }
+        }, filtered = this.filterElement(
+          { tagName: blockTagName, properties: props, blockType: block.type },
+          { source: "markdown" },
+          () => renderPresentation ? renderPresentation(finalElement) : finalElement,
+          renderChildren
+        );
+        return filtered == null ? React8.createElement(React8.Fragment, { key: block.id }) : React8.isValidElement(filtered) ? filtered : React8.createElement(React8.Fragment, { key: block.id }, filtered);
+      }
+    }
+    let presented = renderPresentation ? renderPresentation(finalElement) : finalElement;
+    return React8.isValidElement(presented) ? presented : React8.createElement(React8.Fragment, { key: block.id }, presented);
   }
   /**
    * Get props for a block based on its type
    */
-  getBlockProps(block) {
+  getBlockProps(block, sourceGuard) {
+    let animCtx = this.getRenderInlineContext(block.isFinalized, block.id, sourceGuard);
     switch (block.type) {
       case "heading": {
-        const meta = block.payload.meta ?? {};
-        const inlineNodes = Array.isArray(block.payload.inline) ? block.payload.inline : [];
-        const levelFromMeta = typeof meta.headingLevel === "number" ? meta.headingLevel : void 0;
-        const normalizedLevel = Number.isFinite(levelFromMeta) ? Math.min(Math.max(levelFromMeta, 1), 6) : void 0;
-        const rawHeading = typeof block.payload.raw === "string" ? block.payload.raw : "";
-        const headingText = typeof meta.headingText === "string" && meta.headingText.trim().length > 0 ? meta.headingText : removeHeadingMarkers(rawHeading).trim();
-        const level = normalizedLevel ?? this.extractHeadingLevel(rawHeading);
+        let meta = block.payload.meta ?? {}, inlineNodes = Array.isArray(block.payload.inline) ? block.payload.inline : [], levelFromMeta = typeof meta.headingLevel == "number" ? meta.headingLevel : void 0, normalizedLevel = Number.isFinite(levelFromMeta) ? Math.min(Math.max(levelFromMeta, 1), 6) : void 0, rawHeading = typeof block.payload.raw == "string" ? block.payload.raw : "", headingText = typeof meta.headingText == "string" && meta.headingText.trim().length > 0 ? meta.headingText : removeHeadingMarkers(rawHeading).trim(), level = normalizedLevel ?? this.extractHeadingLevel(rawHeading), ownedTree = block.payload.meta?.htmlOwnership === !0 ? block.payload.meta.htmlTree : void 0, ownedRoot = ownedTree?.length === 1 ? ownedTree[0] : void 0, ownedChildren = ownedRoot?.kind === "element" && ownedRoot.tagName === `h${level}` ? ownedRoot.children : void 0, renderedChildren = ownedChildren ? renderOwnedHtmlTree(ownedChildren, this.ownedHtmlRenderContext(void 0, void 0, `h${level}`, animCtx)) : renderInlineNodes(inlineNodes, this.inlineComponents, this.urlTransform, this, `h${level}`, animCtx);
         return {
           level,
           inlines: inlineNodes,
           text: headingText,
-          meta
+          meta,
+          children: renderedChildren
         };
       }
-      case "paragraph":
+      case "paragraph": {
+        let segments = block.payload.meta?.mixedSegments;
         return {
           inlines: block.payload.inline || [],
           raw: block.payload.raw,
-          meta: block.payload.meta
+          meta: block.payload.meta,
+          children: Array.isArray(segments) && segments.length > 0 ? renderMixedParagraphSegments(
+            segments,
+            this.inlineComponents,
+            DEFAULT_INLINE_HTML_RENDERERS,
+            this.htmlElements,
+            this.literalTagContent,
+            this.urlTransform,
+            this,
+            animCtx,
+            block.payload.meta?.mixedHtmlTrees,
+            (tree) => renderOwnedHtmlTree(tree, this.ownedHtmlRenderContext(void 0, void 0, "p", animCtx))
+          ) : renderInlineNodes(block.payload.inline ?? [], this.inlineComponents, this.urlTransform, this, "p", animCtx)
         };
+      }
       case "blockquote":
         return {
-          inlines: block.payload.inline || []
+          inlines: block.payload.inline || [],
+          renderedContent: renderInlineNodes(block.payload.inline || [], this.inlineComponents, this.urlTransform, this, "blockquote", animCtx)
         };
       case "hr": {
-        const range = block.payload.range;
+        let range = block.payload.range;
         return {
           className: "markdown-hr",
-          "data-start": typeof range?.from === "number" ? range.from : void 0,
-          "data-end": typeof range?.to === "number" ? range.to : void 0
+          "data-start": typeof range?.from == "number" ? range.from : void 0,
+          "data-end": typeof range?.to == "number" ? range.to : void 0
         };
       }
       case "code":
         return {
           html: block.payload.highlightedHtml,
           meta: block.payload.meta,
-          lang: typeof block.payload.meta?.lang === "string" ? String(block.payload.meta?.lang) : void 0
+          lang: typeof block.payload.meta?.lang == "string" ? String(block.payload.meta?.lang) : void 0
         };
       case "list": {
-        const items = Array.isArray(block.payload.meta?.items) ? block.payload.meta?.items : [];
+        let items = Array.isArray(block.payload.meta?.items) ? block.payload.meta?.items : [];
         return {
-          ordered: Boolean(block.payload.meta?.ordered),
+          ordered: !!block.payload.meta?.ordered,
           items
         };
       }
       case "html": {
-        const trusted = block.payload.sanitizedHtml ?? block.payload.raw;
+        let isWorkerSanitized = !!(block.payload.sanitizedHtml || block.payload.meta?.sanitized), content = block.payload.sanitizedHtml ?? block.payload.raw ?? "", htmlTree = block.payload.meta?.htmlTree;
         return {
-          // Server render should not depend on DOMPurify (which requires a DOM `window`).
-          // In worker-compiled flows, `sanitizedHtml` is already sanitized at the source.
-          __trustedHtml: typeof window === "undefined" ? String(trusted ?? "") : createTrustedHTML(String(trusted ?? "")),
-          elements: this.htmlElements
+          __trustedHtml: isWorkerSanitized || typeof window > "u" ? String(content) : createTrustedHTML(String(content)),
+          elements: this.htmlElements,
+          isSanitized: isWorkerSanitized,
+          literalTagContent: this.literalTagContent,
+          children: htmlTree ? this.renderHtmlTree(htmlTree, void 0, block) : void 0
         };
       }
       case "mdx":
-        return (() => {
-          const meta = block.payload.meta;
-          const rawStatus = typeof meta?.mdxStatus === "string" ? meta.mdxStatus : void 0;
-          const status = rawStatus === "pending" || rawStatus === "compiled" || rawStatus === "error" ? rawStatus : void 0;
-          const errorMessage = typeof meta?.mdxError === "string" ? String(meta.mdxError) : void 0;
-          const compiledModule = block.payload.compiledMdxModule ?? null;
-          const compiledRef = block.payload.compiledMdxRef ?? (compiledModule ? { id: compiledModule.id } : void 0);
-          return {
-            compiledRef: compiledRef ?? { id: "pending" },
-            compiledModule,
-            status,
-            errorMessage,
-            raw: typeof block.payload.raw === "string" ? block.payload.raw : void 0
-          };
-        })();
+        return {
+          raw: typeof block.payload.raw == "string" ? block.payload.raw : void 0,
+          meta: block.payload.meta
+        };
       case "table": {
-        const header = Array.isArray(block.payload.meta?.header) ? block.payload.meta?.header : void 0;
-        const rows = Array.isArray(block.payload.meta?.rows) ? block.payload.meta?.rows : [];
-        const align = Array.isArray(block.payload.meta?.align) ? block.payload.meta?.align : void 0;
+        let header = Array.isArray(block.payload.meta?.header) ? block.payload.meta?.header : void 0, rows = Array.isArray(block.payload.meta?.rows) ? block.payload.meta?.rows : [], align = Array.isArray(block.payload.meta?.align) ? block.payload.meta?.align : void 0;
         return {
           header,
           rows,
@@ -1834,17 +3067,14 @@ var ComponentRegistry = class {
           elements: this.tableElements
         };
       }
-      case "footnotes": {
-        const items = Array.isArray(block.payload.meta?.items) ? block.payload.meta?.items : [];
+      case "footnotes":
         return {
-          items
+          items: Array.isArray(block.payload.meta?.items) ? block.payload.meta?.items : []
         };
-      }
       case "footnote-def":
         return {};
       case "callout": {
-        const kind = typeof block.payload.meta?.kind === "string" ? String(block.payload.meta.kind) : void 0;
-        const inlineNodes = Array.isArray(block.payload.inline) ? block.payload.inline : [];
+        let kind = typeof block.payload.meta?.kind == "string" ? String(block.payload.meta.kind) : void 0, inlineNodes = Array.isArray(block.payload.inline) ? block.payload.inline : [];
         return {
           kind,
           inlines: inlineNodes
@@ -1861,112 +3091,117 @@ var ComponentRegistry = class {
    * Extract heading level from raw markdown
    */
   extractHeadingLevel(raw) {
-    const match = raw.match(/^(#{1,6})\s/);
-    if (match) {
-      return Math.min(match[1].length, 6);
-    }
-    return 1;
+    let match = raw.match(/^(#{1,6})\s/);
+    return match ? Math.min(match[1].length, 6) : 1;
   }
 };
 function getDefaultHtmlElements() {
   return {
     // Text semantics
-    p: (props) => React4.createElement("p", props),
-    strong: (props) => React4.createElement("strong", props),
-    em: (props) => React4.createElement("em", props),
-    code: (props) => React4.createElement("code", props),
-    pre: (props) => React4.createElement("pre", props),
-    span: (props) => React4.createElement("span", props),
-    br: (props) => React4.createElement("br", props),
-    hr: (props) => React4.createElement("hr", props),
+    p: (props) => React8.createElement("p", props),
+    strong: (props) => React8.createElement("strong", props),
+    em: (props) => React8.createElement("em", props),
+    code: (props) => React8.createElement("code", props),
+    pre: (props) => React8.createElement("pre", props),
+    span: (props) => React8.createElement("span", props),
+    br: (props) => React8.createElement("br", props),
+    hr: (props) => React8.createElement("hr", props),
     // Lists
-    ul: (props) => React4.createElement("ul", props),
-    ol: (props) => React4.createElement("ol", props),
-    li: (props) => React4.createElement("li", props),
+    ul: (props) => React8.createElement("ul", props),
+    ol: (props) => React8.createElement("ol", props),
+    li: (props) => React8.createElement("li", props),
     // Links & media
-    a: (props) => React4.createElement("a", props),
-    img: (props) => React4.createElement("img", props),
+    a: (props) => React8.createElement("a", props),
+    img: (props) => React8.createElement("img", props),
     // Blockquotes
-    blockquote: (props) => React4.createElement("blockquote", props),
+    blockquote: (props) => React8.createElement("blockquote", props),
     // Tables
-    table: (props) => React4.createElement("table", props),
-    thead: (props) => React4.createElement("thead", props),
-    tbody: (props) => React4.createElement("tbody", props),
-    tr: (props) => React4.createElement("tr", props),
-    th: (props) => React4.createElement("th", props),
-    td: (props) => React4.createElement("td", props),
+    table: (props) => React8.createElement("table", props),
+    thead: (props) => React8.createElement("thead", props),
+    tbody: (props) => React8.createElement("tbody", props),
+    tr: (props) => React8.createElement("tr", props),
+    th: (props) => React8.createElement("th", props),
+    td: (props) => React8.createElement("td", props),
     // Generic
-    div: (props) => React4.createElement("div", props)
+    div: (props) => React8.createElement("div", props)
   };
 }
 function getDefaultTableElements(overrides) {
-  const base = {
-    Table: (props) => React4.createElement("table", props),
-    Thead: (props) => React4.createElement("thead", props),
-    Tbody: (props) => React4.createElement("tbody", props),
-    Tr: (props) => React4.createElement("tr", props),
-    Th: (props) => React4.createElement("th", props),
-    Td: (props) => React4.createElement("td", props)
-  };
-  return { ...base, ...overrides || {} };
-}
-function mapHtmlToReact(html, elements) {
-  const parser = new DOMParser();
-  const doc = parser.parseFromString(html, "text/html");
-  const children = [];
-  doc.body.childNodes.forEach((node, index) => {
-    const element = toReact(node, elements, `root-${index}`);
-    if (element) {
-      children.push(element);
-    }
-  });
-  return React4.createElement(React4.Fragment, {}, ...children);
+  return { ...{
+    Table: (props) => React8.createElement("table", props),
+    Thead: (props) => React8.createElement("thead", props),
+    Tbody: (props) => React8.createElement("tbody", props),
+    Tr: (props) => React8.createElement("tr", props),
+    Th: (props) => React8.createElement("th", props),
+    Td: (props) => React8.createElement("td", props)
+  }, ...overrides || {} };
+}
+var DEFAULT_LITERAL_TAGS2 = /* @__PURE__ */ new Set(["code", "pre", "script", "style", "textarea"]);
+function mapHtmlToReact(html, elements, literalTagContent, parseMarkdown) {
+  let ParserClass = typeof DOMParser < "u" ? DOMParser : typeof window < "u" ? window.DOMParser : void 0;
+  if (!ParserClass) return null;
+  let doc = new ParserClass().parseFromString(html, "text/html"), children = [], literalTags = literalTagContent ? /* @__PURE__ */ new Set([...DEFAULT_LITERAL_TAGS2, ...literalTagContent.map((t) => t.toLowerCase())]) : DEFAULT_LITERAL_TAGS2;
+  return doc.body.childNodes.forEach((node, index) => {
+    let element = toReact(node, elements, `root-${index}`, void 0, literalTags, !1, parseMarkdown);
+    element && children.push(element);
+  }), React8.createElement(React8.Fragment, {}, ...children);
 }
-function toReact(node, elements, key) {
+var TABLE_TEXT_FORBIDDEN_PARENTS = /* @__PURE__ */ new Set(["table", "thead", "tbody", "tfoot", "tr", "colgroup"]);
+function toReact(node, elements, key, parentTag, literalTags, parentIsLiteral, parseMarkdown) {
   if (node.nodeType === Node.TEXT_NODE) {
-    const text = node.textContent ?? "";
-    return React4.createElement(React4.Fragment, { key }, text);
+    let text = node.textContent ?? "";
+    if (parentTag && TABLE_TEXT_FORBIDDEN_PARENTS.has(parentTag) && text.trim().length === 0)
+      return null;
+    let content = parentIsLiteral || !parseMarkdown ? text : parseMarkdown(text);
+    return React8.createElement(React8.Fragment, { key }, content);
   }
-  if (node.nodeType !== Node.ELEMENT_NODE) {
+  if (node.nodeType !== Node.ELEMENT_NODE)
     return null;
-  }
-  const el = node;
-  const tag = el.tagName.toLowerCase();
-  const props = {};
-  for (const attr of Array.from(el.attributes)) {
-    const name = attr.name === "class" ? "className" : attr.name;
+  let el = node, tag = el.tagName.toLowerCase(), isLiteral = parentIsLiteral || (literalTags ? literalTags.has(tag) : !1), props = {};
+  for (let attr of Array.from(el.attributes)) {
+    let name = attr.name === "class" ? "className" : attr.name;
     props[name] = attr.value;
   }
-  const children = [];
+  if (tag === "textarea")
+    return React8.createElement(elements[tag] ?? tag, { ...props, key, defaultValue: el.textContent ?? "" });
+  let children = [];
   el.childNodes.forEach((childNode, childIndex) => {
-    const child = toReact(childNode, elements, `${key}-${childIndex}`);
-    if (child) {
-      children.push(child);
-    }
+    let child = toReact(childNode, elements, `${key}-${childIndex}`, tag, literalTags, isLiteral, parseMarkdown);
+    child && children.push(child);
   });
-  const component = elements[tag];
-  const elementChildren = children.length > 0 ? children : void 0;
-  if (component) {
-    return React4.createElement(component, { ...props, key }, elementChildren);
-  }
-  return React4.createElement(tag, { ...props, key }, elementChildren);
+  let component = elements[tag], elementChildren = children.length > 0 ? children : void 0;
+  return component ? React8.createElement(component, { ...props, key }, elementChildren) : React8.createElement(tag, { ...props, key }, elementChildren);
 }
 function attrsToProps(attrs) {
   if (!attrs) return {};
-  const result = {};
-  for (const [key, value] of Object.entries(attrs)) {
-    if (key === "class") {
-      result.className = value;
-    } else if (key === "style") {
-      result.style = parseStyleAttribute2(value);
-    } else if (key === "tabindex" || key === "tabIndex") {
-      const numericValue = Number(value);
-      if (!Number.isNaN(numericValue)) {
-        result.tabIndex = numericValue;
-      }
-    } else {
-      result[key] = value;
-    }
+  let result = {};
+  for (let [key, value] of Object.entries(attrs)) {
+    let lower = key.toLowerCase();
+    if (!isForbiddenAttribute2(lower))
+      if (key === "class")
+        result.className = value;
+      else if (key === "style")
+        result.style = parseStyleAttribute2(value);
+      else if (key === "tabindex" || key === "tabIndex") {
+        let numericValue = Number(value);
+        Number.isNaN(numericValue) || (result.tabIndex = numericValue);
+      } else if (lower === "href") {
+        let safe = defaultUrlTransform4(value, "href", { source: "html" });
+        safe != null && (result.href = safe);
+      } else if (lower === "src") {
+        let safe = defaultUrlTransform4(value, "src", { source: "html" });
+        safe != null && (result.src = safe);
+      } else if (lower === "action") {
+        let safe = defaultUrlTransform4(value, "href", { source: "html" });
+        safe != null && (result.action = safe);
+      } else if (lower === "formaction") {
+        let safe = defaultUrlTransform4(value, "href", { source: "html" });
+        safe != null && (result.formAction = safe);
+      } else if (lower === "xlink:href" || lower === "xlinkhref") {
+        let safe = defaultUrlTransform4(value, "href", { source: "html" });
+        safe != null && (result.xlinkHref = safe);
+      } else
+        result[key] = value;
   }
   return result;
 }
@@ -1974,48 +3209,36 @@ function escapeHtml(value) {
   return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
 function parseStyleAttribute2(value) {
-  const style = {};
+  let style = {};
   if (!value) return style;
-  const parts = value.split(";");
-  for (const part of parts) {
+  let parts = value.split(";");
+  for (let part of parts) {
     if (!part.trim()) continue;
-    const [prop, val] = part.split(":");
-    if (!prop || !val) continue;
-    const camelProp = prop.trim().replace(/-([a-z])/g, (_, char) => char.toUpperCase());
-    style[camelProp] = val.trim();
+    let separator = part.indexOf(":");
+    if (separator <= 0) continue;
+    let prop = part.slice(0, separator).trim(), val = part.slice(separator + 1).trim();
+    if (!isSafeStyleDeclaration2(prop, val)) continue;
+    let cssProperty = prop.startsWith("--") ? prop : prop.replace(/-([a-z])/g, (_, char) => char.toUpperCase());
+    style[cssProperty] = val;
   }
   return style;
 }
-function renderParagraphMixedSegments(segments, inlineComponents, inlineHtmlRenderers) {
-  const result = [];
-  let inlineBuffer = [];
-  let inlineGroupIndex = 0;
-  const pushRenderedNodes = (nodes, target, baseKey) => {
+function renderParagraphMixedSegments(segments, inlineComponents, inlineHtmlRenderers, htmlElements, literalTagContent, urlTransform) {
+  return renderMixedParagraphSegments(segments, inlineComponents, inlineHtmlRenderers, htmlElements, literalTagContent, urlTransform);
+}
+function renderMixedParagraphSegments(segments, inlineComponents, inlineHtmlRenderers, htmlElements, literalTagContent, urlTransform, registry, animationContext, htmlTrees, renderOwnedHtml) {
+  let result = [], inlineBuffer = [], inlineGroupIndex = 0, pushRenderedNodes = (nodes, target, baseKey) => {
     nodes.forEach((node, idx) => {
-      if (node === null || node === void 0) return;
-      const key = `${baseKey}-${idx}`;
-      if (React4.isValidElement(node)) {
-        target.push(node.key === key ? node : React4.cloneElement(node, { key }));
-      } else if (typeof node === "string" || typeof node === "number") {
-        target.push(React4.createElement(React4.Fragment, { key }, node));
-      } else {
-        target.push(React4.createElement(React4.Fragment, { key }, node));
-      }
+      if (node == null) return;
+      let key = `${baseKey}-${idx}`;
+      React8.isValidElement(node) ? target.push(node.key === key ? node : React8.cloneElement(node, { key })) : typeof node == "string" || typeof node == "number" ? target.push(React8.createElement(React8.Fragment, { key }, node)) : target.push(React8.createElement(React8.Fragment, { key }, node));
     });
-  };
-  const ensureArray = (value) => {
-    if (value === null || value === void 0) {
-      return [];
-    }
-    return Array.isArray(value) ? value : [value];
-  };
-  const flushInline = () => {
-    if (inlineBuffer.length === 0) {
+  }, ensureArray = (value) => value == null ? [] : Array.isArray(value) ? value : [value], flushInline = () => {
+    if (inlineBuffer.length === 0)
       return;
-    }
-    const key = `paragraph-inline-group-${inlineGroupIndex++}`;
+    let key = `paragraph-inline-group-${inlineGroupIndex++}`;
     result.push(
-      React4.createElement(
+      React8.createElement(
         "p",
         {
           key,
@@ -2023,109 +3246,90 @@ function renderParagraphMixedSegments(segments, inlineComponents, inlineHtmlRend
         },
         inlineBuffer
       )
-    );
-    inlineBuffer = [];
+    ), inlineBuffer = [];
   };
-  segments.forEach((segment, index) => {
-    const key = `paragraph-segment-${index}`;
+  return segments.forEach((segment, index) => {
+    let key = `paragraph-segment-${index}`;
     switch (segment.kind) {
       case "text": {
-        const inlineNodes = Array.isArray(segment.inline) ? segment.inline : [];
+        let inlineNodes = Array.isArray(segment.inline) ? segment.inline : [];
         if (inlineNodes.length === 0) {
-          if (segment.value) {
-            inlineBuffer.push(React4.createElement(React4.Fragment, { key }, segment.value));
-          }
+          segment.value && inlineBuffer.push(React8.createElement(React8.Fragment, { key }, segment.value));
           break;
         }
-        let chunk = [];
-        const pushChunk = (chunkNodes, chunkKey) => {
+        let chunk = [], pushChunk = (chunkNodes, chunkKey) => {
           if (chunkNodes.length === 0) return;
-          const rendered = renderInlineNodes(chunkNodes, inlineComponents);
+          let rendered = renderInlineNodes(chunkNodes, inlineComponents, urlTransform, registry, "p", animationContext);
           pushRenderedNodes(ensureArray(rendered), inlineBuffer, chunkKey);
         };
         inlineNodes.forEach((inlineNode, inlineIdx) => {
           if (inlineNode.kind === "math-display") {
-            pushChunk(chunk, `${key}-chunk-${inlineIdx}`);
-            chunk = [];
-            flushInline();
-            const rendered = renderInlineNodes([inlineNode], inlineComponents);
+            pushChunk(chunk, `${key}-chunk-${inlineIdx}`), chunk = [], flushInline();
+            let rendered = renderInlineNodes([inlineNode], inlineComponents, urlTransform, registry, "p", animationContext);
             pushRenderedNodes(ensureArray(rendered), result, `${key}-math-${inlineIdx}`);
-          } else {
+          } else
             chunk.push(inlineNode);
-          }
-        });
-        pushChunk(chunk, `${key}-chunk-tail`);
+        }), pushChunk(chunk, `${key}-chunk-tail`);
         break;
       }
       case "mdx": {
-        const status = segment.status ?? "pending";
-        let element;
-        if (status === "compiled") {
-          element = React4.createElement("span", { className: "markdown-mdx-inline", "data-mdx-status": "compiled" });
-        } else if (status === "error") {
-          const message = segment.value || "MDX error";
-          element = React4.createElement("span", { className: "markdown-mdx-inline text-destructive", "data-mdx-status": "error" }, message);
-        } else {
-          element = React4.createElement("span", { className: "markdown-mdx-inline", "data-mdx-status": status }, segment.value);
-        }
-        inlineBuffer.push(React4.createElement(React4.Fragment, { key }, element));
+        let element = React8.createElement("span", { className: "markdown-mdx-inline" }, segment.value);
+        inlineBuffer.push(React8.createElement(React8.Fragment, { key }, element));
         break;
       }
       case "html": {
-        const html = segment.sanitized ?? segment.value;
-        const isBlockLevel = isBlockLevelHtml(html);
-        const element = renderInlineHtmlSegment(segment.value, segment.sanitized, {
+        let html = segment.sanitized ?? segment.value, isBlockLevel = isBlockLevelHtml(html);
+        if (registry && htmlTrees?.[index] !== void 0) {
+          let rendered = renderOwnedHtml ? renderOwnedHtml(htmlTrees[index]) : registry.renderHtmlTree(htmlTrees[index]);
+          isBlockLevel ? (flushInline(), pushRenderedNodes(ensureArray(rendered), result, key)) : pushRenderedNodes(ensureArray(rendered), inlineBuffer, key);
+          break;
+        }
+        let parseMarkdown = (text) => !text || !text.includes("*") && !text.includes("_") && !text.includes("[") && !text.includes("`") && !text.includes("#") ? text : renderInlineNodes(new InlineParser().parse(text), inlineComponents, urlTransform, registry, "p", animationContext), element = renderInlineHtmlSegment(segment.value, segment.sanitized, {
           key,
-          renderers: inlineHtmlRenderers
+          renderers: inlineHtmlRenderers,
+          htmlElements,
+          literalTagContent,
+          urlTransform,
+          parseMarkdown
         });
-        if (isBlockLevel) {
-          flushInline();
-          if (element) {
-            result.push(element);
-          } else if (html) {
-            result.push(
-              React4.createElement("div", {
-                key,
-                className: "markdown-inline-html-block",
-                dangerouslySetInnerHTML: { __html: html }
-              })
-            );
-          }
-        } else if (element) {
-          inlineBuffer.push(element);
-        }
+        isBlockLevel ? (flushInline(), element ? result.push(element) : html && result.push(
+          React8.createElement("div", {
+            key,
+            className: "markdown-inline-html-block",
+            dangerouslySetInnerHTML: { __html: html }
+          })
+        )) : element ? inlineBuffer.push(element) : html && inlineBuffer.push(
+          React8.createElement("span", {
+            key,
+            className: "markdown-inline-html",
+            dangerouslySetInnerHTML: { __html: html }
+          })
+        );
         break;
       }
       default:
         break;
     }
-  });
-  flushInline();
-  if (result.length === 0) {
-    return [
-      React4.createElement(
-        "p",
-        {
-          key: "paragraph-inline-group-0",
-          className: "markdown-paragraph"
-        },
-        inlineBuffer
-      )
-    ];
-  }
-  return result;
+  }), flushInline(), result.length === 0 ? [
+    React8.createElement(
+      "p",
+      {
+        key: "paragraph-inline-group-0",
+        className: "markdown-paragraph"
+      },
+      inlineBuffer
+    )
+  ] : result;
 }
 function isBlockLevelHtml(html) {
-  if (!html) return false;
-  const trimmed = html.trim();
-  if (!trimmed.startsWith("<")) {
-    return false;
-  }
-  const match = trimmed.match(/^<([A-Za-z][\w:-]*)\b/);
-  if (!match) {
-    return false;
-  }
-  const tag = match[1].toLowerCase();
+  if (!html) return !1;
+  let trimmed = html.trim();
+  if (!trimmed.startsWith("<"))
+    return !1;
+  let match = trimmed.match(/^<([A-Za-z][\w:-]*)\b/);
+  if (!match)
+    return !1;
+  let tag = match[1].toLowerCase();
   return BLOCK_LEVEL_TAGS.has(tag);
 }
 var BLOCK_LEVEL_TAGS = /* @__PURE__ */ new Set([
@@ -2161,12 +3365,45 @@ var BLOCK_LEVEL_TAGS = /* @__PURE__ */ new Set([
   "math"
 ]);
 export {
+  AnimationTimeline,
   BottomStickScrollArea,
+  CodeBlockCopyButton,
+  CodeBlockDownloadButton,
+  CodeControlsBar,
   ComponentRegistry,
+  DEFAULT_ANIMATED_OPTIONS,
+  DEFAULT_CONTROLS_LABELS,
+  DefaultDiffRenderer,
   DefaultLinkSafetyModal,
-  defaultBlockComponents,
+  DocumentMathMacroScope,
+  DocumentMathMacroScopeContext,
+  KaTeXBlockMath,
+  KaTeXInlineMath,
+  LANGUAGE_EXTENSION_MAP,
+  MathExpressionCompletenessContext,
+  STREAM_MDX_ANIMATION_CSS,
+  TableControlsBar,
+  copyToClipboard,
   defaultInlineComponents,
+  defaultUrlTransform3 as defaultUrlTransform,
+  downloadFile,
+  escapeCsvCell,
+  escapeTsvCell,
+  getCodeSnippetFilename,
+  getExtensionForLanguage,
+  inlineToPlainText,
+  loadKaTeX,
   mapHtmlToReact,
   renderInlineNodes,
-  renderParagraphMixedSegments
+  renderParagraphMixedSegments,
+  resolveAnimatedOptions,
+  resolveCodeControls,
+  resolveControlsConfig,
+  resolveMermaidControls,
+  resolveTableControls,
+  splitTextSegments,
+  splitWordSegments,
+  tableToCsv,
+  tableToMarkdown,
+  tableToTsv
 };