@stream-mdx/react 0.4.0 → 0.5.0

package/dist/index.mjs

@@ -81,7 +81,7 @@ var init_mdx_client = __esm({
         if (block.type !== "mdx") {
           throw new Error("Block is not MDX type");
         }
-        const cacheKey = block.id;
+        const cacheKey = `${block.id}\0${block.payload.raw ?? ""}`;
         const cachedPromise = this.cache.get(cacheKey);
         if (cachedPromise) {
           return cachedPromise;
@@ -384,6 +384,321 @@ var init_mdx_client = __esm({
   }
 });
 
+// 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;
+function clamp01(value) {
+  if (value < 0) return 0;
+  if (value > 1) return 1;
+  return value;
+}
+function easeOutCubic(value) {
+  return 1 - (1 - value) ** 3;
+}
+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;
+  return { scrollTop, scrollHeight, clientHeight, maxScrollTop, distanceToBottom, isOverflowing };
+}
+function DefaultJumpButton({ canJump, jumpToBottom }) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: jumpToBottom,
+      "aria-label": "Scroll to bottom",
+      style: {
+        pointerEvents: canJump ? "auto" : "none",
+        borderRadius: 9999,
+        border: "1px solid color-mix(in srgb, currentColor 20%, transparent)",
+        width: 40,
+        height: 40,
+        display: "grid",
+        placeItems: "center",
+        boxShadow: "0 8px 20px rgba(0,0,0,0.18)",
+        background: "color-mix(in srgb, var(--background, #fff) 92%, transparent)",
+        color: "var(--foreground, #111)",
+        cursor: canJump ? "pointer" : "default"
+      },
+      children: /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "\u2193" })
+    }
+  );
+}
+function BottomStickScrollArea({
+  children,
+  className,
+  viewportClassName,
+  contentClassName,
+  showJumpToBottom = true,
+  onDebugStateChange,
+  onModeChange,
+  debugDomAttributes = false,
+  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(
+    (next) => {
+      modeRef.current = next;
+      setMode(next);
+      onModeChange?.(next);
+    },
+    [onModeChange]
+  );
+  const updateDebug = useCallback(() => {
+    const 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?.({
+      mode: modeRef.current,
+      isOverflowing: m.isOverflowing,
+      distanceToBottom: m.distanceToBottom,
+      scrollTop: m.scrollTop,
+      maxScrollTop: m.maxScrollTop,
+      scrollHeight: m.scrollHeight,
+      clientHeight: m.clientHeight,
+      programmaticWrites: programmaticWriteCountRef.current
+    });
+    setDistanceToBottom(
+      (previous) => Math.abs(previous - m.distanceToBottom) <= 0.1 ? previous : m.distanceToBottom
+    );
+  }, [debugDomAttributes, onDebugStateChange]);
+  const writeScrollTop = useCallback((nextTop) => {
+    const 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;
+    }
+    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);
+    if (initial.distanceToBottom <= EPS_BOTTOM_PX) {
+      setModeBoth("STICKY_INSTANT");
+      stickToBottomInstant();
+      updateDebug();
+      return;
+    }
+    const durationMs = Math.max(
+      RETURN_MIN_MS,
+      Math.min(RETURN_MAX_MS, initial.distanceToBottom / RETURN_PX_PER_MS)
+    );
+    returnAnimRef.current = {
+      startTime: performance.now(),
+      startTop: initial.scrollTop,
+      durationMs,
+      settleFrames: 0
+    };
+    setModeBoth("RETURNING_SMOOTH");
+    const tick = (now2) => {
+      const viewportCurrent = viewportRef.current;
+      const 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;
+      if (doneByTime && doneBySettle) {
+        cancelReturn();
+        setModeBoth("STICKY_INSTANT");
+        stickToBottomInstant();
+        updateDebug();
+        return;
+      }
+      updateDebug();
+      returnRafRef.current = requestAnimationFrame(tick);
+    };
+    returnRafRef.current = requestAnimationFrame(tick);
+  }, [cancelPendingStick, cancelReturn, setModeBoth, stickToBottomInstant, updateDebug, writeScrollTop]);
+  const onViewportScroll = useCallback(
+    (event) => {
+      const viewport = event.currentTarget;
+      const 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();
+    },
+    [cancelPendingStick, cancelReturn, setModeBoth, stickToBottomInstant, updateDebug]
+  );
+  useEffect(() => {
+    const viewport = viewportRef.current;
+    const 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();
+    });
+    observer.observe(content);
+    observer.observe(viewport);
+    return () => observer.disconnect();
+  }, [stickToBottomInstant, updateDebug]);
+  useLayoutEffect(() => {
+    const 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();
+    };
+  }, [cancelPendingStick, cancelReturn]);
+  const canJump = isOverflowing && mode === "DETACHED";
+  const jumpButton = renderJumpToBottom?.({
+    mode,
+    canJump,
+    isOverflowing,
+    distanceToBottom,
+    jumpToBottom: startReturnToBottomSmooth
+  }) ?? /* @__PURE__ */ jsx(DefaultJumpButton, { canJump, jumpToBottom: startReturnToBottomSmooth });
+  const jumpContainerClassNameBase = "pointer-events-none absolute z-20";
+  const jumpContainerStyle = {
+    position: "absolute",
+    zIndex: 20,
+    left: 0,
+    right: 0,
+    bottom: 12,
+    display: "flex",
+    justifyContent: "center",
+    opacity: canJump ? 1 : 0,
+    transform: canJump ? "translateY(0px)" : "translateY(4px)",
+    transition: "opacity 150ms ease, transform 150ms ease",
+    pointerEvents: "none"
+  };
+  return /* @__PURE__ */ jsxs("div", { className: joinClasses("relative h-full w-full overflow-hidden", className), children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: viewportRef,
+        className: joinClasses("h-full w-full overflow-auto", viewportClassName),
+        onScroll: onViewportScroll,
+        "data-testid": "sticky-scroll-viewport",
+        children: /* @__PURE__ */ jsx("div", { ref: contentRef, className: joinClasses("flex min-h-full w-full flex-col", contentClassName), children })
+      }
+    ),
+    showJumpToBottom ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: joinClasses(jumpContainerClassNameBase, jumpContainerClassName),
+        style: jumpContainerStyle,
+        "aria-hidden": !canJump,
+        children: /* @__PURE__ */ jsx("div", { className: canJump ? "pointer-events-auto" : "pointer-events-none", children: jumpButton })
+      }
+    ) : null
+  ] });
+}
+
 // src/components/index.ts
 import { createTrustedHTML, sanitizeHTML } from "@stream-mdx/core";
 
@@ -619,11 +934,11 @@ function prefetchMdxRuntime() {
 }
 
 // src/renderer/use-deferred-render.ts
-import { useEffect, useState } from "react";
+import { useEffect as useEffect2, useState as useState2 } from "react";
 function useDeferredRender(ref, options) {
   const enabled = options?.enabled ?? true;
-  const [shouldRender, setShouldRender] = useState(!enabled);
-  useEffect(() => {
+  const [shouldRender, setShouldRender] = useState2(!enabled);
+  useEffect2(() => {
     if (!enabled) {
       setShouldRender(true);
       return;
@@ -948,12 +1263,12 @@ var INLINE_ELEMENTS = /* @__PURE__ */ new Set([
 ]);
 
 // src/components/link-safety-modal.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var DefaultLinkSafetyModal = ({ url, isOpen, isChecking, onClose, onConfirm, onCopy }) => {
   if (!isOpen) {
     return null;
   }
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx2(
     "div",
     {
       className: "stream-mdx-link-modal-backdrop",
@@ -971,7 +1286,7 @@ var DefaultLinkSafetyModal = ({ url, isOpen, isChecking, onClose, onConfirm, onC
         padding: "24px"
       },
       onClick: onClose,
-      children: /* @__PURE__ */ jsxs(
+      children: /* @__PURE__ */ jsxs2(
         "div",
         {
           className: "stream-mdx-link-modal",
@@ -986,12 +1301,12 @@ var DefaultLinkSafetyModal = ({ url, isOpen, isChecking, onClose, onConfirm, onC
           },
           onClick: (event) => event.stopPropagation(),
           children: [
-            /* @__PURE__ */ jsx("div", { style: { fontWeight: 600, marginBottom: 8 }, children: "Open external link?" }),
-            /* @__PURE__ */ jsx("div", { style: { fontSize: 13, opacity: 0.8, wordBreak: "break-all", marginBottom: 16 }, children: url }),
-            /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end" }, children: [
-              /* @__PURE__ */ jsx("button", { type: "button", onClick: onCopy, disabled: isChecking, style: buttonStyle, children: "Copy link" }),
-              /* @__PURE__ */ jsx("button", { type: "button", onClick: onConfirm, disabled: isChecking, style: primaryButtonStyle, children: "Open link" }),
-              /* @__PURE__ */ jsx("button", { type: "button", onClick: onClose, style: buttonStyle, children: "Cancel" })
+            /* @__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" })
             ] })
           ]
         }
@@ -1166,7 +1481,11 @@ var defaultInlineComponents = {
     const n = number ?? "?";
     const href = number ? `#fn:${n}` : void 0;
     const id = number ? `fnref:${n}` : void 0;
-    return React4.createElement("sup", { className: "footnote-ref" }, React4.createElement("a", { href, id, "data-label": label }, String(n)));
+    return React4.createElement(
+      "sup",
+      { className: "footnote-ref" },
+      React4.createElement("a", { href, id, "data-label": label, style: { color: "var(--foreground)", textDecoration: "underline" } }, String(n))
+    );
   }
 };
 var defaultBlockComponents = {
@@ -1309,7 +1628,7 @@ var defaultBlockComponents = {
       dangerouslySetInnerHTML: { __html: htmlString }
     });
   },
-  mdx: ({ compiledRef, compiledModule, status, errorMessage, raw }) => {
+  mdx: ({ compiledRef, compiledModule, status, errorMessage }) => {
     const [Comp, setComp] = React4.useState(null);
     const [internalError, setInternalError] = React4.useState(null);
     const [renderError, setRenderError] = React4.useState(null);
@@ -1410,7 +1729,6 @@ var defaultBlockComponents = {
     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 rawFallback = typeof raw === "string" && raw.trim().length > 0 ? React4.createElement("pre", { className: "markdown-mdx-fallback" }, raw) : null;
     const allowRetry = Boolean(internalError || renderError);
     const retryButton = allowRetry ? React4.createElement(
       "button",
@@ -1422,9 +1740,10 @@ var defaultBlockComponents = {
       "Retry hydration"
     ) : null;
     const errorPanel = React4.createElement(
-      "div",
-      { className: "markdown-mdx-error" },
-      React4.createElement(React4.Fragment, null, React4.createElement("strong", null, "MDX failed"), React4.createElement("div", null, message))
+      React4.Fragment,
+      null,
+      React4.createElement("strong", null, "MDX failed"),
+      React4.createElement("div", null, message)
     );
     if (Comp && !failureMessage) {
       return React4.createElement(
@@ -1447,14 +1766,13 @@ var defaultBlockComponents = {
       return React4.createElement(
         "div",
         {
-          className: "markdown-mdx",
+          className: "markdown-mdx error",
           ref: containerRef,
           "data-mdx-ref": pendingId,
           "data-mdx-status": "error",
           "data-mdx-mode": compileMode
         },
         errorPanel,
-        rawFallback,
         retryButton
       );
     }
@@ -1481,7 +1799,16 @@ var defaultBlockComponents = {
         { 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" }, "\u21A9")
+        React4.createElement(
+          "a",
+          {
+            href: `#fnref:${item.number}`,
+            className: "footnote-backref",
+            "aria-label": "Back to content",
+            style: { color: "var(--foreground)", textDecoration: "underline" }
+          },
+          "\u21A9"
+        )
       )
     );
     return React4.createElement("section", { className: "footnotes" }, React4.createElement("hr", {}), React4.createElement("ol", {}, listItems));
@@ -2021,19 +2348,20 @@ init_mdx_client();
 
 // src/mdx-coordinator.ts
 init_mdx_client();
-import { useCallback, useEffect as useEffect2, useMemo, useRef, useState as useState2 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef2, useState as useState3 } from "react";
 function useMdxCoordinator(blocks, compileEndpoint, options) {
-  const mdxClientRef = useRef(getMDXClient(compileEndpoint));
+  const mdxClientRef = useRef2(getMDXClient(compileEndpoint));
   const mode = options?.mode ?? "server";
-  const [compiledMap, setCompiledMap] = useState2(/* @__PURE__ */ new Map());
-  const blockSignatureRef = useRef(/* @__PURE__ */ new Map());
-  const applyCompiledRef = useCallback(
+  const [compiledMap, setCompiledMap] = useState3(/* @__PURE__ */ new Map());
+  const blockSignatureRef = useRef2(/* @__PURE__ */ new Map());
+  const failedSignatureRef = useRef2(/* @__PURE__ */ new Map());
+  const applyCompiledRef = useCallback2(
     (block, compiledId) => {
       if (mode === "worker") {
         return;
       }
       if (options?.workerClient) {
-        options.workerClient.setMdxCompiled(block.id, compiledId);
+        options.workerClient.setMdxCompiled(block.id, compiledId, block.payload.raw ?? "");
         return;
       }
       const store = options?.store;
@@ -2044,6 +2372,9 @@ function useMdxCoordinator(blocks, compileEndpoint, options) {
       const index = currentBlocks.findIndex((candidate) => candidate.id === block.id);
       if (index === -1) return;
       const current = currentBlocks[index];
+      if ((current.payload.raw ?? "") !== (block.payload.raw ?? "")) {
+        return;
+      }
       if (current.payload.compiledMdxRef?.id === compiledId) {
         return;
       }
@@ -2069,11 +2400,17 @@ function useMdxCoordinator(blocks, compileEndpoint, options) {
     },
     [options?.workerClient, options?.store, mode]
   );
-  useEffect2(() => {
+  useEffect3(() => {
     if (mode === "worker") {
       return;
     }
-    const targets = blocks.filter((b) => b.type === "mdx" && b.isFinalized && !b.payload.compiledMdxRef && !compiledMap.has(b.id));
+    const targets = blocks.filter((b) => {
+      if (b.type !== "mdx" || !b.isFinalized || b.payload.compiledMdxRef || compiledMap.has(b.id)) {
+        return false;
+      }
+      const raw = b.payload.raw ?? "";
+      return failedSignatureRef.current.get(b.id) !== raw;
+    });
     if (targets.length === 0) return;
     let cancelled = false;
     (async () => {
@@ -2092,22 +2429,29 @@ function useMdxCoordinator(blocks, compileEndpoint, options) {
             next.set(block.id, compiled.id);
             return next;
           });
+          failedSignatureRef.current.delete(block.id);
           applyCompiledRef(block, compiled.id);
         } catch (e) {
           console.warn("MDX compile failed for block", block.id, e);
+          failedSignatureRef.current.set(block.id, block.payload.raw ?? "");
           if (options?.workerClient) {
-            options.workerClient.setMdxError(block.id, e instanceof Error ? e.message : String(e));
+            options.workerClient.setMdxError(block.id, e instanceof Error ? e.message : String(e), block.payload.raw ?? "");
           } else if (options?.store) {
+            const currentBlocks = options.store.getBlocks();
+            const current = currentBlocks.find((candidate) => candidate.id === block.id);
+            if (!current || (current.payload.raw ?? "") !== (block.payload.raw ?? "")) {
+              continue;
+            }
             options.store.applyPatches([
               {
                 op: "setProps",
                 at: { blockId: block.id, nodeId: block.id },
                 props: {
                   block: {
-                    ...block,
+                    ...current,
                     payload: {
-                      ...block.payload,
-                      meta: { ...block.payload.meta ?? {}, mdxStatus: "error", mdxError: e instanceof Error ? e.message : String(e) }
+                      ...current.payload,
+                      meta: { ...current.payload.meta ?? {}, mdxStatus: "error", mdxError: e instanceof Error ? e.message : String(e) }
                     }
                   }
                 }
@@ -2121,7 +2465,7 @@ function useMdxCoordinator(blocks, compileEndpoint, options) {
       cancelled = true;
     };
   }, [blocks, compiledMap, applyCompiledRef, options?.workerClient, options?.store, mode]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (mode === "worker") {
       return;
     }
@@ -2140,6 +2484,7 @@ function useMdxCoordinator(blocks, compileEndpoint, options) {
         const currentSignature = candidate.payload.raw ?? "";
         if (previousSignature !== void 0 && previousSignature !== currentSignature) {
           next.delete(blockId);
+          failedSignatureRef.current.delete(blockId);
           mutated = true;
         }
       }
@@ -2149,11 +2494,14 @@ function useMdxCoordinator(blocks, compileEndpoint, options) {
     for (const block of blocks) {
       if (block.type === "mdx") {
         signatureMap.set(block.id, block.payload.raw ?? "");
+        if (!block.isFinalized || block.payload.compiledMdxRef) {
+          failedSignatureRef.current.delete(block.id);
+        }
       }
     }
     blockSignatureRef.current = signatureMap;
   }, [blocks, mode]);
-  const derivedBlocks = useMemo(() => {
+  const derivedBlocks = useMemo2(() => {
     if (mode === "worker") {
       return blocks;
     }
@@ -2336,7 +2684,7 @@ async function prefetchMdxBundle(request) {
 }
 
 // src/math/display-wrapper.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx3 } from "react/jsx-runtime";
 var BASE_CLASS = "katex-block-wrapper my-2";
 var SCROLL_ROOT_CLASS = "katex-scroll relative overflow-x-hidden w-full max-w-full";
 var VIEWPORT_CLASS = "katex-scroll-viewport h-full w-full rounded-[inherit]";
@@ -2351,14 +2699,14 @@ function combineClassNames(base, extra) {
 }
 function DisplayMathWrapper({ children, className = "" }) {
   const wrapperClass = combineClassNames(BASE_CLASS, className);
-  return /* @__PURE__ */ jsx2("div", { className: wrapperClass, children: /* @__PURE__ */ jsx2("div", { dir: "ltr", className: SCROLL_ROOT_CLASS, children: /* @__PURE__ */ jsx2("div", { className: VIEWPORT_CLASS, style: VIEWPORT_STYLE, children: /* @__PURE__ */ jsx2("div", { style: SHIM_STYLE, children }) }) }) });
+  return /* @__PURE__ */ jsx3("div", { className: wrapperClass, children: /* @__PURE__ */ jsx3("div", { dir: "ltr", className: SCROLL_ROOT_CLASS, children: /* @__PURE__ */ jsx3("div", { className: VIEWPORT_CLASS, style: VIEWPORT_STYLE, children: /* @__PURE__ */ jsx3("div", { style: SHIM_STYLE, children }) }) }) });
 }
 function renderDisplayMathWithHtml(html, className) {
-  return /* @__PURE__ */ jsx2(DisplayMathWrapper, { className, children: /* @__PURE__ */ jsx2("div", { className: "katex-block", dangerouslySetInnerHTML: { __html: html } }) });
+  return /* @__PURE__ */ jsx3(DisplayMathWrapper, { className, children: /* @__PURE__ */ jsx3("div", { className: "katex-block", dangerouslySetInnerHTML: { __html: html } }) });
 }
 
 // src/renderer.tsx
-import React9, { useCallback as useCallback3, useEffect as useEffect4, useRef as useRef3, useState as useState4 } from "react";
+import React9, { useCallback as useCallback4, useEffect as useEffect5, useRef as useRef4, useState as useState5 } from "react";
 import { createDefaultWorker, releaseDefaultWorker } from "@stream-mdx/worker";
 init_mdx_client();
 
@@ -2370,7 +2718,10 @@ function useCodeHighlightRequester() {
 }
 
 // src/renderer/patch-batching.ts
-import { isHeavyPatch, splitPatchBatch } from "@stream-mdx/core/perf/patch-batching";
+import { getPatchKind, isHeavyPatch, splitPatchBatch } from "@stream-mdx/core/perf/patch-batching";
+
+// src/renderer/patch-commit-scheduler.ts
+import { getPatchKind as getPatchKind2 } from "@stream-mdx/core/perf/patch-batching";
 
 // src/renderer/patch-coalescing.ts
 import {
@@ -2388,6 +2739,9 @@ var COALESCING_DURATION_ACTIVATE_MS = 6;
 var COALESCING_DURATION_DEACTIVATE_MS = 4;
 var RETAIN_TOUCHED_IN_HISTORY = typeof process !== "undefined" && process.env ? process.env.NODE_ENV !== "production" : true;
 var EMPTY_TOUCHED_SET = /* @__PURE__ */ new Set();
+function shouldSkipCoalescing(patches) {
+  return patches.length <= 1;
+}
 function getDefaultNow() {
   if (typeof performance !== "undefined" && typeof performance.now === "function") {
     return () => performance.now();
@@ -2414,8 +2768,9 @@ function getDefaultCancelRaf() {
 }
 var PatchCommitScheduler = class {
   constructor(params) {
-    this.highQueue = [];
-    this.lowQueue = [];
+    this.semanticQueue = [];
+    this.enrichmentHighQueue = [];
+    this.enrichmentLowQueue = [];
     this.scheduled = false;
     this.flushing = false;
     this.scheduledHandle = null;
@@ -2427,6 +2782,7 @@ var PatchCommitScheduler = class {
     this.scheduleToken = 0;
     this.coalescingDurationSamples = [];
     this.adaptiveBudgetActive = false;
+    this.flushCount = 0;
     this.store = params.store;
     this.onFlush = params.onFlush;
     this.frameBudgetMs = Math.max(1, params.options?.frameBudgetMs ?? 10);
@@ -2442,6 +2798,8 @@ var PatchCommitScheduler = class {
     this.maxLowPriorityBatchesPerFlush = params.options?.maxLowPriorityBatchesPerFlush ?? 2;
     this.urgentQueueThreshold = Math.max(1, params.options?.urgentQueueThreshold ?? 4);
     this.historyLimit = Math.max(1, params.options?.historyLimit ?? 200);
+    this.startupMicrotaskFlushes = Math.max(0, Math.floor(params.options?.startupMicrotaskFlushes ?? 0));
+    this.adaptiveBudgeting = params.options?.adaptiveBudgeting ?? true;
     const requestedBatch = params.options?.batch;
     if (requestedBatch === "microtask") {
       this.batchStrategy = "microtask";
@@ -2468,19 +2826,23 @@ var PatchCommitScheduler = class {
       patches: input.patches,
       meta: input.meta ?? {},
       receivedAt: input.meta?.receivedAt ?? this.now(),
+      kind: input.meta?.kind === "semantic" || input.meta?.kind === "enrichment" ? input.meta.kind : input.patches.some((patch) => getPatchKind2(patch) === "semantic") ? "semantic" : "enrichment",
       priority: input.meta?.priority === "low" ? "low" : "high"
     };
-    if (batch.priority === "low") {
-      this.lowQueue.push(batch);
+    if (batch.kind === "semantic") {
+      batch.priority = "high";
+      this.semanticQueue.push(batch);
+    } else if (batch.priority === "low") {
+      this.enrichmentLowQueue.push(batch);
     } else {
-      this.highQueue.push(batch);
+      this.enrichmentHighQueue.push(batch);
     }
     if (!this.paused) {
       this.schedule();
     }
   }
   flushAll() {
-    if (this.highQueue.length === 0 && this.lowQueue.length === 0 && !this.flushing) {
+    if (this.semanticQueue.length === 0 && this.enrichmentHighQueue.length === 0 && this.enrichmentLowQueue.length === 0 && !this.flushing) {
       return null;
     }
     this.cancelScheduled();
@@ -2490,9 +2852,11 @@ var PatchCommitScheduler = class {
   }
   clear() {
     this.cancelScheduled();
-    this.highQueue = [];
-    this.lowQueue = [];
+    this.semanticQueue = [];
+    this.enrichmentHighQueue = [];
+    this.enrichmentLowQueue = [];
     this.flushing = false;
+    this.flushCount = 0;
     this.coalescingDurationSamples = [];
     this.adaptiveBudgetActive = false;
     this.adaptiveHighBatchCap = void 0;
@@ -2500,10 +2864,10 @@ var PatchCommitScheduler = class {
     this.maybeResolveIdle();
   }
   getPendingCount() {
-    return this.highQueue.length + this.lowQueue.length;
+    return this.semanticQueue.length + this.enrichmentHighQueue.length + this.enrichmentLowQueue.length;
   }
   isIdle() {
-    return !this.flushing && !this.scheduled && this.highQueue.length === 0 && this.lowQueue.length === 0;
+    return !this.flushing && !this.scheduled && this.semanticQueue.length === 0 && this.enrichmentHighQueue.length === 0 && this.enrichmentLowQueue.length === 0;
   }
   awaitIdle() {
     if (this.isIdle()) {
@@ -2543,7 +2907,8 @@ var PatchCommitScheduler = class {
       this.runFlush(this.frameBudgetMs, false);
       this.maybeResolveIdle();
     };
-    if (this.batchStrategy === "microtask" && typeof queueMicrotask === "function") {
+    const useStartupMicrotask = this.batchStrategy !== "microtask" && this.startupMicrotaskFlushes > 0 && this.flushCount < this.startupMicrotaskFlushes && typeof queueMicrotask === "function";
+    if ((this.batchStrategy === "microtask" || useStartupMicrotask) && typeof queueMicrotask === "function") {
       this.scheduledViaRaf = false;
       this.scheduledHandle = token;
       queueMicrotask(execute);
@@ -2573,12 +2938,14 @@ var PatchCommitScheduler = class {
     if (this.paused && !manual) {
       return null;
     }
-    if (this.highQueue.length === 0 && this.lowQueue.length === 0) {
+    if (this.semanticQueue.length === 0 && this.enrichmentHighQueue.length === 0 && this.enrichmentLowQueue.length === 0) {
       return null;
     }
     this.flushing = true;
     const startedAt = this.now();
-    const initialQueueSize = this.highQueue.length + this.lowQueue.length;
+    const initialSemanticQueueSize = this.semanticQueue.length;
+    const initialEnrichmentQueueSize = this.enrichmentHighQueue.length + this.enrichmentLowQueue.length;
+    const initialQueueSize = initialSemanticQueueSize + initialEnrichmentQueueSize;
     const batches = [];
     let totalInputPatches = 0;
     let totalAppliedPatches = 0;
@@ -2593,7 +2960,15 @@ var PatchCommitScheduler = class {
         consumed += 1;
         const applyStart = this.now();
         const queueDelayMs = Math.max(0, applyStart - next.receivedAt);
-        const { patches: coalesced, metrics: coalescingMetrics } = coalescePatchesWithMetrics(next.patches, DEFAULT_COALESCE_CONFIG);
+        let coalesced;
+        let coalescingMetrics;
+        if (shouldSkipCoalescing(next.patches)) {
+          coalesced = next.patches;
+        } else {
+          const result = coalescePatchesWithMetrics(next.patches, DEFAULT_COALESCE_CONFIG);
+          coalesced = result.patches;
+          coalescingMetrics = result.metrics;
+        }
         const touched = this.store.applyPatches(coalesced, {
           coalesced: true,
           metrics: coalescingMetrics
@@ -2613,6 +2988,7 @@ var PatchCommitScheduler = class {
           receivedAt: next.receivedAt,
           appliedAt: applyStart,
           priority: next.priority,
+          kind: next.kind,
           coalescing: coalescingMetrics
         });
         if (maxBatches && batches.length - startingBatchCount >= maxBatches) {
@@ -2629,27 +3005,32 @@ var PatchCommitScheduler = class {
         queue.splice(0, consumed);
       }
     };
-    const initialHighQueueSize = this.highQueue.length;
+    processQueue(this.semanticQueue, void 0, Number.POSITIVE_INFINITY);
+    const initialHighQueueSize = this.enrichmentHighQueue.length;
     const configuredHighLimit = manual || !this.maxBatchesPerFlush ? void 0 : initialHighQueueSize > this.maxBatchesPerFlush ? void 0 : this.maxBatchesPerFlush;
-    const highBatchLimit = this.adaptiveHighBatchCap ?? configuredHighLimit;
-    processQueue(this.highQueue, highBatchLimit, budgetMs);
+    const highBatchLimit = this.adaptiveBudgeting ? this.adaptiveHighBatchCap ?? configuredHighLimit : configuredHighLimit;
+    processQueue(this.enrichmentHighQueue, highBatchLimit, budgetMs);
     if (manual) {
-      processQueue(this.lowQueue, void 0, Number.POSITIVE_INFINITY);
-    } else if (this.lowQueue.length > 0) {
+      processQueue(this.enrichmentLowQueue, void 0, Number.POSITIVE_INFINITY);
+    } else if (this.enrichmentLowQueue.length > 0) {
       elapsed = this.now() - startedAt;
       const budgetForLow = Math.max(0, this.lowPriorityFrameBudgetMs - elapsed);
-      if (budgetForLow > 0) {
-        const initialLowQueueSize = this.lowQueue.length;
+      const processedHigherPriorityWork = batches.length > 0;
+      if (budgetForLow > 0 || !processedHigherPriorityWork) {
+        const initialLowQueueSize = this.enrichmentLowQueue.length;
         const configuredLowLimit = manual || !this.maxLowPriorityBatchesPerFlush ? void 0 : initialLowQueueSize > this.maxLowPriorityBatchesPerFlush ? void 0 : this.maxLowPriorityBatchesPerFlush;
-        const lowBatchLimit = this.adaptiveLowBatchCap ?? configuredLowLimit;
-        processQueue(this.lowQueue, lowBatchLimit, budgetForLow);
+        const lowBatchLimit = this.adaptiveBudgeting ? this.adaptiveLowBatchCap ?? configuredLowLimit : configuredLowLimit;
+        processQueue(this.enrichmentLowQueue, lowBatchLimit, budgetForLow);
       }
     }
     this.flushing = false;
     const completedAt = this.now();
     const totalDurationMs = completedAt - startedAt;
-    const remaining = this.highQueue.length + this.lowQueue.length;
+    const remainingSemantic = this.semanticQueue.length;
+    const remainingEnrichment = this.enrichmentHighQueue.length + this.enrichmentLowQueue.length;
+    const remaining = remainingSemantic + remainingEnrichment;
     if (batches.length > 0) {
+      this.flushCount += 1;
       try {
         this.onFlush({
           batches,
@@ -2657,7 +3038,11 @@ var PatchCommitScheduler = class {
           totalAppliedPatches,
           totalDurationMs,
           remainingQueueSize: remaining,
+          remainingSemanticQueueSize: remainingSemantic,
+          remainingEnrichmentQueueSize: remainingEnrichment,
           queueDepthBefore: initialQueueSize,
+          semanticQueueDepthBefore: initialSemanticQueueSize,
+          enrichmentQueueDepthBefore: initialEnrichmentQueueSize,
           flushStartedAt: startedAt,
           flushCompletedAt: completedAt
         });
@@ -2668,21 +3053,27 @@ var PatchCommitScheduler = class {
     if (remaining > 0 && !this.paused) {
       this.schedule();
     }
-    const coalescingStats = this.computeCoalescingDurationStats();
-    this.updateAdaptiveBudget(coalescingStats.p95);
-    const adaptiveState = this.snapshotAdaptiveBudget(coalescingStats.p95 ?? null);
+    const coalescingStats = this.adaptiveBudgeting ? this.computeCoalescingDurationStats() : { sampleCount: this.coalescingDurationSamples.length, p95: null };
+    if (this.adaptiveBudgeting) {
+      this.updateAdaptiveBudget(coalescingStats.p95);
+    }
+    const adaptiveState = this.adaptiveBudgeting ? this.snapshotAdaptiveBudget(coalescingStats.p95 ?? null) : void 0;
     const flushResult = batches.length > 0 ? {
       batches,
       totalPatches: totalInputPatches,
       totalAppliedPatches,
       totalDurationMs,
       remainingQueueSize: remaining,
+      remainingSemanticQueueSize: remainingSemantic,
+      remainingEnrichmentQueueSize: remainingEnrichment,
       queueDepthBefore: initialQueueSize,
+      semanticQueueDepthBefore: initialSemanticQueueSize,
+      enrichmentQueueDepthBefore: initialEnrichmentQueueSize,
       flushStartedAt: startedAt,
       flushCompletedAt: completedAt,
       coalescingDurationP95: coalescingStats.p95 ?? void 0,
       coalescingDurationSampleCount: coalescingStats.sampleCount,
-      adaptiveBudgetActive: adaptiveState.active,
+      adaptiveBudgetActive: adaptiveState?.active,
       adaptiveBudgetState: adaptiveState
     } : null;
     if (flushResult) {
@@ -2718,6 +3109,9 @@ var PatchCommitScheduler = class {
     };
   }
   updateAdaptiveBudget(p95) {
+    if (!this.adaptiveBudgeting) {
+      return;
+    }
     if (p95 !== null && p95 > COALESCING_DURATION_ACTIVATE_MS) {
       if (!this.adaptiveBudgetActive) {
         this.adaptiveBudgetActive = true;
@@ -2791,11 +3185,13 @@ var PatchCommitScheduler = class {
   }
   restart() {
     this.cancelScheduled();
-    this.highQueue = [];
-    this.lowQueue = [];
+    this.semanticQueue = [];
+    this.enrichmentHighQueue = [];
+    this.enrichmentLowQueue = [];
     this.flushing = false;
     this.sequence = 0;
     this.history = [];
+    this.flushCount = 0;
     this.scheduleToken++;
     this.paused = false;
     this.coalescingDurationSamples = [];
@@ -2842,6 +3238,12 @@ var PatchCommitScheduler = class {
     if (typeof options.historyLimit !== "undefined") {
       this.setHistoryLimit(options.historyLimit);
     }
+    if (typeof options.startupMicrotaskFlushes !== "undefined") {
+      this.startupMicrotaskFlushes = Math.max(0, Math.floor(options.startupMicrotaskFlushes));
+    }
+    if (typeof options.adaptiveBudgeting !== "undefined") {
+      this.adaptiveBudgeting = options.adaptiveBudgeting;
+    }
     if (typeof options.batch !== "undefined") {
       const requestedBatch = options.batch;
       if (requestedBatch === "microtask") {
@@ -2876,6 +3278,7 @@ import {
   sanitizeHTML as sanitizeHTML2,
   PATCH_ROOT_ID
 } from "@stream-mdx/core";
+import { getPatchKind as getPatchKind3 } from "@stream-mdx/core/perf/patch-batching";
 
 // src/renderer/list-utils.ts
 function updateNodeDepth(node, depth) {
@@ -2971,12 +3374,28 @@ function snapshotToBlock(node) {
   }
   return null;
 }
-var nodeSnapshotCache = /* @__PURE__ */ new Map();
-var childrenSnapshotCache = /* @__PURE__ */ new Map();
+var nodeSnapshotCacheByMap = /* @__PURE__ */ new WeakMap();
+var childrenSnapshotCacheByMap = /* @__PURE__ */ new WeakMap();
 var NODE_SNAPSHOT_CACHE_LIMIT = 5e4;
 var CHILDREN_SNAPSHOT_CACHE_LIMIT = 5e4;
 var NODE_SNAPSHOT_CACHE_BUFFER = Math.max(200, Math.floor(NODE_SNAPSHOT_CACHE_LIMIT * 0.1));
 var CHILDREN_SNAPSHOT_CACHE_BUFFER = Math.max(200, Math.floor(CHILDREN_SNAPSHOT_CACHE_LIMIT * 0.1));
+function getNodeSnapshotCacheForMap(map) {
+  let cache = nodeSnapshotCacheByMap.get(map);
+  if (!cache) {
+    cache = /* @__PURE__ */ new Map();
+    nodeSnapshotCacheByMap.set(map, cache);
+  }
+  return cache;
+}
+function getChildrenSnapshotCacheForMap(map) {
+  let cache = childrenSnapshotCacheByMap.get(map);
+  if (!cache) {
+    cache = /* @__PURE__ */ new Map();
+    childrenSnapshotCacheByMap.set(map, cache);
+  }
+  return cache;
+}
 function pruneCache(cache, max, buffer) {
   if (cache.size <= max + buffer) return;
   let remaining = cache.size - max;
@@ -2986,6 +3405,14 @@ function pruneCache(cache, max, buffer) {
     if (remaining <= 0) break;
   }
 }
+function deleteSnapshotCacheEntry(map, id) {
+  getNodeSnapshotCacheForMap(map).delete(id);
+  getChildrenSnapshotCacheForMap(map).delete(id);
+}
+function clearSnapshotCaches(map) {
+  getNodeSnapshotCacheForMap(map).clear();
+  getChildrenSnapshotCacheForMap(map).clear();
+}
 var EMPTY_CHILDREN = Object.freeze([]);
 var EMPTY_NODE_SNAPSHOT = Object.freeze({ version: -1, node: void 0 });
 var EMPTY_CHILDREN_SNAPSHOT = Object.freeze({
@@ -3153,9 +3580,57 @@ function createRootRecord() {
     parentId: null,
     children: [],
     props: {},
-    version: 0
+    version: 0,
+    blockEpoch: 0
   };
 }
+function readNumericEpoch(value) {
+  if (typeof value !== "number" || !Number.isFinite(value) || value < 0) {
+    return void 0;
+  }
+  return value;
+}
+function readSnapshotBlockEpoch(snapshot) {
+  return readNumericEpoch(snapshot.meta?.blockEpoch);
+}
+function readPatchBlockEpoch(patch) {
+  if (patch.op === "setHTML") {
+    return readNumericEpoch(patch.patchMeta?.blockEpoch);
+  }
+  return readNumericEpoch(patch.meta?.blockEpoch);
+}
+function readPatchParseEpoch(patch) {
+  if (patch.op === "setHTML") {
+    return readNumericEpoch(patch.patchMeta?.parseEpoch);
+  }
+  return readNumericEpoch(patch.meta?.parseEpoch);
+}
+function readPatchTx(patch) {
+  if (patch.op === "setHTML") {
+    return readNumericEpoch(patch.patchMeta?.tx);
+  }
+  return readNumericEpoch(patch.meta?.tx);
+}
+function assignSubtreeBlockEpoch(map, rootId, blockEpoch, touched) {
+  const root = map.get(rootId);
+  if (!root) return;
+  const stack = [root];
+  while (stack.length > 0) {
+    const node = stack.pop();
+    if (!node) continue;
+    if (node.blockEpoch !== blockEpoch) {
+      node.blockEpoch = blockEpoch;
+      node.version += 1;
+      touched?.add(node.id);
+    }
+    for (const childId of node.children) {
+      const child = map.get(childId);
+      if (child) {
+        stack.push(child);
+      }
+    }
+  }
+}
 function ensureArray(value) {
   return Array.isArray(value) ? value : [];
 }
@@ -3215,7 +3690,7 @@ function escapeHtml2(value) {
 }
 function stripOuterLineSpan(html) {
   if (!html) return null;
-  const openTagMatch = html.match(/<span[^>]*>/i);
+  const openTagMatch = html.match(/<span[^>]*class="[^"]*\bline\b[^"]*"[^>]*>/i);
   if (!openTagMatch) {
     return null;
   }
@@ -3264,8 +3739,7 @@ function normalizeCodeBlockChildren(nodes, parent, touched) {
     if (node.type !== "code-line") {
       anomalies.push(`type-mismatch:${node.id}:${node.type}`);
       nodes.delete(node.id);
-      nodeSnapshotCache.delete(node.id);
-      childrenSnapshotCache.delete(node.id);
+      deleteSnapshotCacheEntry(nodes, node.id);
       touched.add(node.id);
       continue;
     }
@@ -3309,16 +3783,14 @@ function normalizeCodeBlockChildren(nodes, parent, touched) {
     const existing = nodes.get(desiredId);
     if (existing && existing !== node) {
       nodes.delete(desiredId);
-      nodeSnapshotCache.delete(desiredId);
-      childrenSnapshotCache.delete(desiredId);
+      deleteSnapshotCacheEntry(nodes, desiredId);
       touched.add(desiredId);
       mutated = true;
     }
     if (node.id !== desiredId) {
       const previousId = node.id;
       nodes.delete(node.id);
-      nodeSnapshotCache.delete(previousId);
-      childrenSnapshotCache.delete(previousId);
+      deleteSnapshotCacheEntry(nodes, previousId);
       node.id = desiredId;
       nodes.set(desiredId, node);
       touched.add(desiredId);
@@ -3349,8 +3821,7 @@ function normalizeCodeBlockChildren(nodes, parent, touched) {
   for (const [id, record] of nodes) {
     if (record.parentId === parent.id && record.type === "code-line" && !allowed.has(id)) {
       nodes.delete(id);
-      nodeSnapshotCache.delete(id);
-      childrenSnapshotCache.delete(id);
+      deleteSnapshotCacheEntry(nodes, id);
       touched.add(id);
       mutated = true;
     }
@@ -3434,8 +3905,10 @@ function normalizeCodeLineProps(incoming, previous) {
 }
 function createCodeLineProps(index, text, highlight, tokens) {
   const safeText = typeof text === "string" ? text : "";
-  const sanitized = sanitizeLineInnerHtml(highlight, safeText);
-  const html = sanitized && sanitized.length >= safeText.length ? sanitized : escapeHtml2(safeText);
+  const hasIncomingHighlight = typeof highlight === "string" && highlight.trim().length > 0;
+  const sanitized = hasIncomingHighlight ? sanitizeLineInnerHtml(highlight, safeText) : null;
+  const hasRenderableTokens = tokens !== void 0 && tokens !== null;
+  const html = sanitized && sanitized.length >= safeText.length ? sanitized : hasRenderableTokens ? null : escapeHtml2(safeText);
   const props = {
     index,
     text: safeText,
@@ -3546,6 +4019,18 @@ function validateCodeBlockChildren(nodes, parent) {
       issues.push({ kind: "dangling-node", id });
     }
   }
+  if (parent.block?.isFinalized) {
+    const snapshot = createBlockSnapshot(cloneBlock(parent.block));
+    const expectedChildren = ensureArray(snapshot.children).filter((child) => child.type === "code-line");
+    if (expectedChildren.length !== parent.children.length) {
+      issues.push({
+        kind: "line-count-mismatch",
+        id: parent.id,
+        expected: expectedChildren.length,
+        actual: parent.children.length
+      });
+    }
+  }
   return { ok: issues.length === 0, issues };
 }
 function rebuildCodeBlockFromSnapshot(nodes, parent, touched, issues) {
@@ -3562,7 +4047,7 @@ function rebuildCodeBlockFromSnapshot(nodes, parent, touched, issues) {
   }
   const snapshot = createBlockSnapshot(cloneBlock(parent.block));
   removeSubtree(nodes, parent.id, touched);
-  const inserted = insertSnapshotAt(nodes, ancestor, index, snapshot);
+  const inserted = insertSnapshotAt(nodes, ancestor, index, snapshot, touched, parent.blockEpoch);
   if (!inserted) {
     return false;
   }
@@ -3585,7 +4070,55 @@ function arraysEqual(a, b) {
   }
   return true;
 }
-function buildNodeFromSnapshot(map, snapshot, parentId) {
+function expectedCodeLineId(parentId, index) {
+  return `${parentId}::line:${index}`;
+}
+function collectStoreInvariantViolations(nodes) {
+  const violations = [];
+  for (const [id, node] of nodes) {
+    if (node.type === "__root__") continue;
+    if (node.children.length > 1) {
+      const seen = /* @__PURE__ */ new Set();
+      for (const childId of node.children) {
+        if (seen.has(childId)) {
+          violations.push(`duplicate child id:${id}:${childId}`);
+        } else {
+          seen.add(childId);
+        }
+      }
+    }
+    if (node.type === "list") {
+      const parent = node.parentId ? nodes.get(node.parentId) : void 0;
+      if (parent?.type === "list-item" && node.children.length === 0) {
+        violations.push(`empty nested list:${id}`);
+      }
+    }
+    if (node.type === "code") {
+      for (let index = 0; index < node.children.length; index += 1) {
+        const childId = node.children[index];
+        const child = nodes.get(childId);
+        if (!child) {
+          violations.push(`missing code-line node:${node.id}:${childId}`);
+          continue;
+        }
+        if (child.type !== "code-line") {
+          violations.push(`non-code child in code block:${node.id}:${child.id}:${child.type}`);
+          continue;
+        }
+        const expectedId = expectedCodeLineId(node.id, index);
+        if (child.id !== expectedId) {
+          violations.push(`code-line id mismatch:${node.id}:${child.id}:${expectedId}`);
+        }
+        const indexProp = typeof child.props?.index === "number" ? child.props.index : null;
+        if (indexProp !== index) {
+          violations.push(`code-line index mismatch:${node.id}:${child.id}:${indexProp}:${index}`);
+        }
+      }
+    }
+  }
+  return violations;
+}
+function buildNodeFromSnapshot(map, snapshot, parentId, blockEpoch) {
   const record = {
     id: snapshot.id,
     type: snapshot.type,
@@ -3595,6 +4128,7 @@ function buildNodeFromSnapshot(map, snapshot, parentId) {
     meta: snapshot.meta ? { ...snapshot.meta } : void 0,
     range: snapshot.range ? { ...snapshot.range } : void 0,
     version: 0,
+    blockEpoch,
     block: snapshotToBlock(snapshot) ?? void 0
   };
   if (record.type === "code") {
@@ -3603,7 +4137,7 @@ function buildNodeFromSnapshot(map, snapshot, parentId) {
   map.set(record.id, record);
   const childSnapshots = ensureArray(snapshot.children);
   for (const child of childSnapshots) {
-    const childRecord = buildNodeFromSnapshot(map, child, record.id);
+    const childRecord = buildNodeFromSnapshot(map, child, record.id, blockEpoch);
     record.children.push(childRecord.id);
   }
   return record;
@@ -3631,8 +4165,7 @@ function removeSubtree(map, id, touched) {
       }
     }
     map.delete(node.id);
-    nodeSnapshotCache.delete(node.id);
-    childrenSnapshotCache.delete(node.id);
+    deleteSnapshotCacheEntry(map, node.id);
     touched.add(node.id);
     for (const childId of node.children) {
       const child = map.get(childId);
@@ -3664,13 +4197,13 @@ function resolveParent(map, path) {
   }
   return map.get(path.blockId);
 }
-function insertSnapshotAt(map, parent, index, snapshot, touched) {
+function insertSnapshotAt(map, parent, index, snapshot, touched, blockEpoch) {
   if (!parent) return null;
   const existingIndex = parent.children.indexOf(snapshot.id);
   if (existingIndex !== -1) {
     removeSubtree(map, parent.children[existingIndex], touched ?? /* @__PURE__ */ new Set());
   }
-  const record = buildNodeFromSnapshot(map, snapshot, parent.id);
+  const record = buildNodeFromSnapshot(map, snapshot, parent.id, blockEpoch ?? readSnapshotBlockEpoch(snapshot) ?? parent.blockEpoch);
   const insertedIds = [];
   const queue = [record];
   while (queue.length > 0) {
@@ -3688,13 +4221,13 @@ function insertSnapshotAt(map, parent, index, snapshot, touched) {
   ensureUniqueChildren(parent, touched);
   return { record, insertedIds };
 }
-function replaceSnapshotAt(map, parent, index, snapshot, touched) {
+function replaceSnapshotAt(map, parent, index, snapshot, touched, blockEpoch) {
   if (!parent) return;
   if (index < 0 || index >= parent.children.length) return;
   const targetId = parent.children[index];
   parent.children.splice(index, 1);
   removeSubtree(map, targetId, touched);
-  const inserted = insertSnapshotAt(map, parent, index, snapshot, touched);
+  const inserted = insertSnapshotAt(map, parent, index, snapshot, touched, blockEpoch);
   if (inserted) {
     for (const id of inserted.insertedIds) {
       touched.add(id);
@@ -3714,6 +4247,24 @@ function createRendererStore(initialBlocks = []) {
   const listeners = /* @__PURE__ */ new Set();
   let notifyScheduled = false;
   let lastCoalescingMetrics = null;
+  let invariantViolations = [];
+  let transientDiagnostics = [];
+  let nextBlockEpoch = 1;
+  const debugCounters = {
+    appendLineGuardRejected: 0,
+    staleEpochRejected: 0,
+    storeInvariantViolationCount: 0
+  };
+  const allocateBlockEpoch = (preferred) => {
+    const resolved = readNumericEpoch(preferred);
+    if (resolved !== void 0) {
+      nextBlockEpoch = Math.max(nextBlockEpoch, resolved + 1);
+      return resolved;
+    }
+    const epoch = nextBlockEpoch;
+    nextBlockEpoch += 1;
+    return epoch;
+  };
   const getRaf = () => {
     if (typeof globalThis !== "undefined" && typeof globalThis.requestAnimationFrame === "function") {
       return globalThis.requestAnimationFrame;
@@ -3745,9 +4296,12 @@ function createRendererStore(initialBlocks = []) {
       }
     }
   }
+  function appendDiagnostic(message) {
+    transientDiagnostics = [...transientDiagnostics, message];
+    invariantViolations = [...invariantViolations, message];
+  }
   function rebuildFromBlocks(blocks) {
-    nodeSnapshotCache.clear();
-    childrenSnapshotCache.clear();
+    clearSnapshotCaches(nodes);
     nodes = /* @__PURE__ */ new Map();
     const root = createRootRecord();
     nodes.set(root.id, root);
@@ -3756,9 +4310,12 @@ function createRendererStore(initialBlocks = []) {
     for (let i = 0; i < blocks.length; i++) {
       const block = cloneBlock(blocks[i]);
       const snapshot = createBlockSnapshot(block);
-      insertSnapshotAt(nodes, root, root.children.length, snapshot);
+      insertSnapshotAt(nodes, root, root.children.length, snapshot, void 0, allocateBlockEpoch(readSnapshotBlockEpoch(snapshot)));
     }
     normalizeAllListDepths(nodes, /* @__PURE__ */ new Set(), PATCH_ROOT_ID);
+    transientDiagnostics = [];
+    invariantViolations = collectStoreInvariantViolations(nodes);
+    debugCounters.storeInvariantViolationCount += invariantViolations.length;
     version++;
     blocksDirty = true;
     scheduleNotify();
@@ -3823,11 +4380,57 @@ function createRendererStore(initialBlocks = []) {
           listDepthDirty = true;
         }
       };
-      const applyPropsUpdate = (at, props) => {
+      const semanticTxEpochs = /* @__PURE__ */ new Map();
+      const resolveBlockEpochTarget = (patch, at) => {
+        if ((patch.op === "insertChild" || patch.op === "replaceChild") && at.blockId === PATCH_ROOT_ID) {
+          const nodeId = patch.node?.id;
+          return nodeId ? nodes.get(nodeId) : void 0;
+        }
+        return nodes.get(at.blockId) ?? (at.nodeId ? nodes.get(at.nodeId) : void 0);
+      };
+      const rejectStaleEpochPatch = (patch, at) => {
+        const expectedBlockEpoch = readPatchBlockEpoch(patch);
+        const patchTx = readPatchTx(patch);
+        if (expectedBlockEpoch === void 0) {
+          return false;
+        }
+        if (getPatchKind3(patch) !== "semantic" || !at) {
+          return false;
+        }
+        const target = resolveBlockEpochTarget(patch, at);
+        if (!target || target.blockEpoch === expectedBlockEpoch) {
+          return false;
+        }
+        const txEpoch = at.blockId && patchTx !== void 0 ? semanticTxEpochs.get(at.blockId) : void 0;
+        if (txEpoch && txEpoch.tx === patchTx && txEpoch.blockEpoch === target.blockEpoch) {
+          return false;
+        }
+        debugCounters.staleEpochRejected += 1;
+        appendDiagnostic(
+          `stale epoch rejected:${patch.op}:${target.id}:expected=${expectedBlockEpoch}:actual=${target.blockEpoch}`
+        );
+        return true;
+      };
+      const advanceBlockEpoch = (blockId, touchedSet, preferredEpoch, tx) => {
+        if (!blockId || blockId === PATCH_ROOT_ID) {
+          return null;
+        }
+        const blockRoot = nodes.get(blockId);
+        if (!blockRoot) {
+          return null;
+        }
+        const nextEpoch = allocateBlockEpoch(preferredEpoch);
+        assignSubtreeBlockEpoch(nodes, blockRoot.id, nextEpoch, touchedSet);
+        if (tx !== void 0) {
+          semanticTxEpochs.set(blockRoot.id, { tx, blockEpoch: nextEpoch });
+        }
+        return nextEpoch;
+      };
+      const applyPropsUpdate = (at, props, preferredEpoch, tx, semanticUpdate = false) => {
         const perfStartLocal = perfEnabled ? getPerfNow() : 0;
         const targetId = at.nodeId ?? at.blockId;
         if (!targetId) return;
-        const target = nodes.get(targetId);
+        let target = nodes.get(targetId);
         if (!target) return;
         const parentType = target.parentId ? nodes.get(target.parentId)?.type : void 0;
         if (debugListPatches && (isListRelated(target.type) || isListRelated(parentType))) {
@@ -3854,6 +4457,9 @@ function createRendererStore(initialBlocks = []) {
             propsChanged = true;
           }
           if (propsChanged) {
+            if (semanticUpdate) {
+              advanceBlockEpoch(at.blockId, touched, preferredEpoch, tx);
+            }
             target.version++;
             touched.add(target.id);
             const parent = target.parentId ? nodes.get(target.parentId) : void 0;
@@ -3917,16 +4523,56 @@ function createRendererStore(initialBlocks = []) {
           }
         }
         let blockChanged = false;
+        let typeChanged = false;
+        let rebuiltFromFinalizedBlock = false;
+        let blockEpochAdvanced = false;
         const incomingBlock = props?.block;
         if (incomingBlock && typeof incomingBlock === "object") {
           target.block = cloneBlock(incomingBlock);
+          const previousType = target.type;
+          const incomingType = typeof target.block.type === "string" ? target.block.type : target.type;
+          if (incomingType !== target.type) {
+            target.type = incomingType;
+            typeChanged = true;
+            if (isListRelated(previousType) || isListRelated(target.type)) {
+              markListDepthDirty(target.id);
+            }
+          }
           if (target.type === "code") {
             applyCodeBlockMetadata(target);
           }
+          if (semanticUpdate) {
+            advanceBlockEpoch(at.blockId, touched, preferredEpoch, tx);
+            blockEpochAdvanced = true;
+          }
+          const shouldRebuildFinalizedTree = !at.nodeId && target.id === at.blockId && Boolean(target.block?.isFinalized) && target.type !== "code" && Boolean(target.parentId);
+          if (shouldRebuildFinalizedTree) {
+            const parent = target.parentId ? nodes.get(target.parentId) : void 0;
+            const index = parent ? parent.children.indexOf(target.id) : -1;
+            if (parent && index !== -1) {
+              const snapshot = createBlockSnapshot(cloneBlock(target.block));
+              replaceSnapshotAt(nodes, parent, index, snapshot, touched, target.blockEpoch);
+              mutatedBlocks = true;
+              blockChanged = true;
+              rebuiltFromFinalizedBlock = true;
+              const rebuilt = nodes.get(target.id);
+              if (isListRelated(previousType) || isListRelated(rebuilt?.type)) {
+                markListDepthDirty(target.id);
+              }
+              target = rebuilt ?? target;
+            }
+          }
           mutatedBlocks = true;
           blockChanged = true;
         }
-        if (propsChanged || blockChanged) {
+        if (rebuiltFromFinalizedBlock) {
+          return;
+        }
+        if (propsChanged || blockChanged || typeChanged) {
+          if (semanticUpdate && !blockEpochAdvanced) {
+            advanceBlockEpoch(at.blockId, touched, preferredEpoch, tx);
+            blockEpochAdvanced = true;
+          }
           target.version++;
           touched.add(target.id);
           let parentForNormalization;
@@ -3969,13 +4615,22 @@ function createRendererStore(initialBlocks = []) {
       const applyPatch = (patch) => {
         switch (patch.op) {
           case "insertChild": {
+            if (rejectStaleEpochPatch(patch, patch.at)) break;
             const parent = resolveParent(nodes, patch.at);
-            const inserted = insertSnapshotAt(nodes, parent, patch.index, patch.node, touched);
+            const inserted = insertSnapshotAt(
+              nodes,
+              parent,
+              patch.index,
+              patch.node,
+              touched,
+              allocateBlockEpoch(readPatchParseEpoch(patch) ?? readSnapshotBlockEpoch(patch.node))
+            );
             if (inserted) {
               for (const id of inserted.insertedIds) {
                 touched.add(id);
               }
               mutatedBlocks = true;
+              advanceBlockEpoch(patch.at.blockId, touched, readPatchParseEpoch(patch), readPatchTx(patch));
               if (isListRelated(inserted.record.type) || isListRelated(parent?.type)) {
                 markListDepthDirty(inserted.record.id);
                 if (parent) {
@@ -3995,6 +4650,7 @@ function createRendererStore(initialBlocks = []) {
             break;
           }
           case "deleteChild": {
+            if (rejectStaleEpochPatch(patch, patch.at)) break;
             const parent = resolveParent(nodes, patch.at);
             if (!parent) break;
             if (patch.index < 0 || patch.index >= parent.children.length) break;
@@ -4006,6 +4662,7 @@ function createRendererStore(initialBlocks = []) {
               touched.add(parent.id);
               ensureUniqueChildren(parent, touched);
               mutatedBlocks = true;
+              advanceBlockEpoch(patch.at.blockId, touched, readPatchParseEpoch(patch), readPatchTx(patch));
               if (isListRelated(parent.type) || isListRelated(removedNode?.type)) {
                 markListDepthDirty(parent.id);
               }
@@ -4022,11 +4679,20 @@ function createRendererStore(initialBlocks = []) {
             break;
           }
           case "replaceChild": {
+            if (rejectStaleEpochPatch(patch, patch.at)) break;
             const parent = resolveParent(nodes, patch.at);
             if (!parent) break;
-            replaceSnapshotAt(nodes, parent, patch.index, patch.node, touched);
+            replaceSnapshotAt(
+              nodes,
+              parent,
+              patch.index,
+              patch.node,
+              touched,
+              allocateBlockEpoch(readPatchParseEpoch(patch) ?? readSnapshotBlockEpoch(patch.node))
+            );
             touched.add(parent.id);
             mutatedBlocks = true;
+            advanceBlockEpoch(patch.at.blockId, touched, readPatchParseEpoch(patch), readPatchTx(patch));
             if (isListRelated(parent.type)) {
               markListDepthDirty(parent.id);
             }
@@ -4040,18 +4706,33 @@ function createRendererStore(initialBlocks = []) {
             break;
           }
           case "setProps": {
-            applyPropsUpdate(patch.at, patch.props);
+            if (rejectStaleEpochPatch(patch, patch.at)) break;
+            applyPropsUpdate(patch.at, patch.props, readPatchParseEpoch(patch), readPatchTx(patch), getPatchKind3(patch) === "semantic");
             break;
           }
           case "setPropsBatch": {
             const entries2 = Array.isArray(patch.entries) ? patch.entries : [];
             for (const entry of entries2) {
               if (!entry || !entry.at) continue;
-              applyPropsUpdate(entry.at, entry.props);
+              const entryPatch = {
+                op: "setProps",
+                at: entry.at,
+                props: entry.props,
+                meta: entry.meta ?? patch.meta
+              };
+              if (rejectStaleEpochPatch(entryPatch, entry.at)) continue;
+              applyPropsUpdate(
+                entry.at,
+                entry.props,
+                readPatchParseEpoch(entryPatch),
+                readPatchTx(entryPatch),
+                getPatchKind3(entryPatch) === "semantic"
+              );
             }
             break;
           }
           case "finalize": {
+            if (rejectStaleEpochPatch(patch, patch.at)) break;
             const target = nodes.get(patch.at.nodeId ?? patch.at.blockId);
             if (!target || !target.block) break;
             if (!target.block.isFinalized) {
@@ -4060,6 +4741,17 @@ function createRendererStore(initialBlocks = []) {
               target.version++;
               touched.add(target.id);
               mutatedBlocks = true;
+              if (!patch.at.nodeId && target.id === patch.at.blockId && target.type !== "code" && target.parentId) {
+                const parent = nodes.get(target.parentId);
+                const index = parent ? parent.children.indexOf(target.id) : -1;
+                if (parent && index !== -1) {
+                  const snapshot = createBlockSnapshot(cloneBlock(target.block));
+                  replaceSnapshotAt(nodes, parent, index, snapshot, touched, target.blockEpoch);
+                  if (isListRelated(target.type) || isListRelated(snapshot.type)) {
+                    markListDepthDirty(target.id);
+                  }
+                }
+              }
             }
             if (isListRelated(target.type)) {
               markListDepthDirty(target.id);
@@ -4073,6 +4765,7 @@ function createRendererStore(initialBlocks = []) {
             break;
           }
           case "reorder": {
+            if (rejectStaleEpochPatch(patch, patch.at)) break;
             const parent = resolveParent(nodes, patch.at);
             if (!parent) break;
             const length = parent.children.length;
@@ -4087,6 +4780,9 @@ function createRendererStore(initialBlocks = []) {
             parent.children.splice(to, 0, ...moved);
             parent.version++;
             touched.add(parent.id);
+            if (getPatchKind3(patch) === "semantic") {
+              advanceBlockEpoch(patch.at.blockId, touched, readPatchParseEpoch(patch), readPatchTx(patch));
+            }
             if (isListRelated(parent.type)) {
               markListDepthDirty(parent.id);
             }
@@ -4102,15 +4798,31 @@ function createRendererStore(initialBlocks = []) {
             break;
           }
           case "appendLines": {
+            if (rejectStaleEpochPatch(patch, patch.at)) break;
             const parent = resolveParent(nodes, patch.at);
             if (!parent) break;
-            const startIndex = Math.max(0, Math.min(patch.startIndex, parent.children.length));
+            if (parent.type !== "code") {
+              debugCounters.appendLineGuardRejected += 1;
+              appendDiagnostic(`appendLines target not code:${parent.id}:${parent.type}`);
+              break;
+            }
+            const requestedStartIndex = Math.max(0, patch.startIndex);
+            const startIndex = Math.max(0, Math.min(requestedStartIndex, parent.children.length));
             const lineCount = patch.lines?.length ?? 0;
             if (lineCount === 0) break;
+            const prefixMatches = parent.children.every((childId, index) => childId === expectedCodeLineId(parent.id, index));
+            const isStrictTailAppend = requestedStartIndex === parent.children.length;
+            if (!isStrictTailAppend || !prefixMatches) {
+              debugCounters.appendLineGuardRejected += 1;
+              appendDiagnostic(
+                `appendLines guard rejected:${parent.id}:requestedStart=${requestedStartIndex}:childCount=${parent.children.length}:prefixMatches=${prefixMatches}`
+              );
+              break;
+            }
             const originalChildren = parent.children.slice();
             const insertedIds = [];
             const insertedSet = /* @__PURE__ */ new Set();
-            const isTrailingAppend = startIndex >= originalChildren.length;
+            const isTrailingAppend = true;
             let parentChildrenChanged = false;
             let codeLinesMutated = false;
             for (let offset = 0; offset < lineCount; offset++) {
@@ -4152,7 +4864,8 @@ function createRendererStore(initialBlocks = []) {
                   parentId: parent.id,
                   children: [],
                   props: nextLineProps,
-                  version: 0
+                  version: 0,
+                  blockEpoch: parent.blockEpoch
                 };
                 nodes.set(lineId, record);
                 touched.add(lineId);
@@ -4202,6 +4915,7 @@ function createRendererStore(initialBlocks = []) {
             break;
           }
           case "setHTML": {
+            if (rejectStaleEpochPatch(patch, patch.at)) break;
             const target = nodes.get(patch.at.nodeId ?? patch.at.blockId);
             if (!target) break;
             const sanitized = patch.sanitized ? patch.html : sanitizeHTML2(patch.html);
@@ -4244,6 +4958,30 @@ function createRendererStore(initialBlocks = []) {
           applyPatch(patch);
         }
       }
+      const finalizedTableRoots = /* @__PURE__ */ new Set();
+      for (const touchedId of touched) {
+        let cursor = nodes.get(touchedId);
+        while (cursor && cursor.id !== PATCH_ROOT_ID) {
+          if (cursor.type === "table" && cursor.block?.isFinalized && cursor.parentId) {
+            finalizedTableRoots.add(cursor.id);
+            break;
+          }
+          cursor = cursor.parentId ? nodes.get(cursor.parentId) : void 0;
+        }
+      }
+      if (finalizedTableRoots.size > 0) {
+        for (const tableId of finalizedTableRoots) {
+          const tableNode = nodes.get(tableId);
+          if (!tableNode || !tableNode.block || !tableNode.parentId) continue;
+          const parent = nodes.get(tableNode.parentId);
+          if (!parent) continue;
+          const index = parent.children.indexOf(tableNode.id);
+          if (index === -1) continue;
+          const snapshot = createBlockSnapshot(cloneBlock(tableNode.block));
+          replaceSnapshotAt(nodes, parent, index, snapshot, touched, tableNode.blockEpoch);
+          mutatedBlocks = true;
+        }
+      }
       if (mutatedBlocks) {
         blocksDirty = true;
       }
@@ -4264,6 +5002,8 @@ function createRendererStore(initialBlocks = []) {
           normalizeListDepthsForIds(nodes, touched, listDepthDirtyNodes, PATCH_ROOT_ID);
         }
       }
+      invariantViolations = [...collectStoreInvariantViolations(nodes), ...transientDiagnostics];
+      debugCounters.storeInvariantViolationCount += invariantViolations.length;
       if (touched.size > 0 || mutatedBlocks) {
         version++;
         scheduleNotify();
@@ -4312,6 +5052,7 @@ function createRendererStore(initialBlocks = []) {
       if (!record) {
         return EMPTY_NODE_SNAPSHOT;
       }
+      const nodeSnapshotCache = getNodeSnapshotCacheForMap(nodes);
       const cached = nodeSnapshotCache.get(id);
       if (cached && cached.version === record.version && cached.node === record) {
         return cached;
@@ -4331,6 +5072,7 @@ function createRendererStore(initialBlocks = []) {
       if (!record) {
         return EMPTY_CHILDREN_SNAPSHOT;
       }
+      const childrenSnapshotCache = getChildrenSnapshotCacheForMap(nodes);
       const cached = childrenSnapshotCache.get(id);
       if (cached && cached.version === record.version) {
         return cached;
@@ -4340,6 +5082,12 @@ function createRendererStore(initialBlocks = []) {
       pruneCache(childrenSnapshotCache, CHILDREN_SNAPSHOT_CACHE_LIMIT, CHILDREN_SNAPSHOT_CACHE_BUFFER);
       return snapshot;
     },
+    getInvariantViolations() {
+      return invariantViolations.slice();
+    },
+    getDebugCounters() {
+      return { ...debugCounters };
+    },
     getLastCoalescingMetrics() {
       return lastCoalescingMetrics;
     },
@@ -4354,11 +5102,11 @@ function createRendererStore(initialBlocks = []) {
 }
 
 // src/renderer/blocks-renderer.tsx
-import React8, { useMemo as useMemo4 } from "react";
+import React8, { useMemo as useMemo5 } from "react";
 import { getBlockKey, PATCH_ROOT_ID as PATCH_ROOT_ID2 } from "@stream-mdx/core";
 
 // src/renderer/hooks.ts
-import { useMemo as useMemo2, useSyncExternalStore } from "react";
+import { useMemo as useMemo3, useSyncExternalStore } from "react";
 function useRendererBlocks(store) {
   return useSyncExternalStore(
     store.subscribe,
@@ -4367,14 +5115,14 @@ function useRendererBlocks(store) {
   );
 }
 function useRendererNode(store, id) {
-  const selector = useMemo2(() => {
+  const selector = useMemo3(() => {
     return () => store.getNodeWithVersion(id);
   }, [store, id]);
   const snapshot = useSyncExternalStore(store.subscribe, selector, selector);
   return snapshot.node;
 }
 function useRendererChildren(store, id) {
-  const selector = useMemo2(() => {
+  const selector = useMemo3(() => {
     return () => store.getChildrenWithVersion(id);
   }, [store, id]);
   const snapshot = useSyncExternalStore(store.subscribe, selector, selector);
@@ -4382,7 +5130,7 @@ function useRendererChildren(store, id) {
 }
 
 // src/renderer/node-views.tsx
-import { stripCodeFence } from "@stream-mdx/core";
+import { getDefaultCodeWrapperAttributes as getDefaultCodeWrapperAttributes2, stripCodeFence } from "@stream-mdx/core";
 import React7 from "react";
 
 // src/renderer/deferred-render-context.tsx
@@ -4390,7 +5138,7 @@ import React6 from "react";
 var DeferredRenderContext = React6.createContext(null);
 
 // src/renderer/virtualized-code.tsx
-import { useCallback as useCallback2, useEffect as useEffect3, useMemo as useMemo3, useRef as useRef2, useState as useState3 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect4, useMemo as useMemo4, useRef as useRef3, useState as useState4 } from "react";
 var DEFAULT_VIRTUALIZED_CODE_CONFIG = {
   enabled: true,
   windowSize: 100,
@@ -4430,11 +5178,11 @@ function calculateCodeWindow(lines, scrollTop, containerHeight, lineHeight, conf
   };
 }
 function useVirtualizedCode(lines, config = DEFAULT_VIRTUALIZED_CODE_CONFIG) {
-  const containerRef = useRef2(null);
-  const [scrollTop, setScrollTop] = useState3(0);
-  const [containerHeight, setContainerHeight] = useState3(0);
-  const lineHeightRef = useRef2(20);
-  useEffect3(() => {
+  const containerRef = useRef3(null);
+  const [scrollTop, setScrollTop] = useState4(0);
+  const [containerHeight, setContainerHeight] = useState4(0);
+  const lineHeightRef = useRef3(20);
+  useEffect4(() => {
     if (!containerRef.current || lines.length === 0) return;
     const timeoutId = setTimeout(() => {
       if (!containerRef.current) return;
@@ -4448,12 +5196,12 @@ function useVirtualizedCode(lines, config = DEFAULT_VIRTUALIZED_CODE_CONFIG) {
     }, 0);
     return () => clearTimeout(timeoutId);
   }, [lines.length]);
-  const handleScroll = useCallback2((e) => {
+  const handleScroll = useCallback3((e) => {
     const target = e.currentTarget;
     setScrollTop(target.scrollTop);
     setContainerHeight(target.clientHeight);
   }, []);
-  useEffect3(() => {
+  useEffect4(() => {
     if (!containerRef.current) return;
     const resizeObserver = new ResizeObserver((entries2) => {
       for (const entry of entries2) {
@@ -4463,10 +5211,10 @@ function useVirtualizedCode(lines, config = DEFAULT_VIRTUALIZED_CODE_CONFIG) {
     resizeObserver.observe(containerRef.current);
     return () => resizeObserver.disconnect();
   }, []);
-  const window2 = useMemo3(() => {
+  const window2 = useMemo4(() => {
     return calculateCodeWindow(lines, scrollTop, containerHeight, lineHeightRef.current, config);
   }, [lines, scrollTop, containerHeight, config]);
-  const scrollToLine = useCallback2((lineIndex) => {
+  const scrollToLine = useCallback3((lineIndex) => {
     if (!containerRef.current) return;
     const targetScrollTop = lineIndex * lineHeightRef.current;
     containerRef.current.scrollTop = targetScrollTop;
@@ -4483,26 +5231,26 @@ function useVirtualizedCode(lines, config = DEFAULT_VIRTUALIZED_CODE_CONFIG) {
 }
 
 // src/renderer/node-views.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 var BlockNodeRenderer = ({ store, blockId, registry }) => {
   const node = useRendererNode(store, blockId);
   const block = node?.block;
   if (!node || !block) return null;
   switch (block.type) {
     case "paragraph":
-      return /* @__PURE__ */ jsx3(ParagraphBlockView, { store, blockId: block.id, registry });
+      return /* @__PURE__ */ jsx4(ParagraphBlockView, { store, blockId: block.id, registry });
     case "blockquote":
-      return /* @__PURE__ */ jsx3(BlockquoteBlockView, { store, blockId: block.id, registry });
+      return /* @__PURE__ */ jsx4(BlockquoteBlockView, { store, blockId: block.id, registry });
     case "list":
-      return /* @__PURE__ */ jsx3(ListBlockView, { store, blockId: block.id, registry, depth: 0 });
+      return /* @__PURE__ */ jsx4(ListBlockView, { store, blockId: block.id, registry, depth: 0 });
     case "table":
-      return /* @__PURE__ */ jsx3(TableBlockView, { store, blockId: block.id, registry });
+      return /* @__PURE__ */ jsx4(TableBlockView, { store, blockId: block.id, registry });
     case "code":
-      return /* @__PURE__ */ jsx3(CodeBlockView, { store, blockId: block.id, registry });
+      return /* @__PURE__ */ jsx4(CodeBlockView, { store, blockId: block.id, registry });
     case "html":
-      return /* @__PURE__ */ jsx3(HtmlBlockView, { store, blockId: block.id, registry });
+      return /* @__PURE__ */ jsx4(HtmlBlockView, { store, blockId: block.id, registry });
     case "mdx":
-      return /* @__PURE__ */ jsx3(MdxBlockView, { store, blockId: block.id, registry });
+      return /* @__PURE__ */ jsx4(MdxBlockView, { store, blockId: block.id, registry });
     default:
       return registry.renderBlock(block);
   }
@@ -4522,7 +5270,7 @@ var ParagraphBlockView = React7.memo(({ store, blockId, registry }) => {
     if (segments2.length > 0) {
       const allowMixedStreaming = Boolean(meta.allowMixedStreaming);
       if (!allowMixedStreaming) {
-        return /* @__PURE__ */ jsx3("p", { className: "markdown-paragraph streaming-partial", children: raw });
+        return /* @__PURE__ */ jsx4("p", { className: "markdown-paragraph streaming-partial", children: raw });
       }
       const structured = renderParagraphMixedSegments(segments2, inlineComponents, DEFAULT_INLINE_HTML_RENDERERS);
       if (structured.length === 1) {
@@ -4549,15 +5297,15 @@ var ParagraphBlockView = React7.memo(({ store, blockId, registry }) => {
         }
         return structured;
       }
-      return /* @__PURE__ */ jsx3("p", { className: "markdown-paragraph streaming-partial", children: renderInlineNodes(inlineNodes2, inlineComponents) });
+      return /* @__PURE__ */ jsx4("p", { className: "markdown-paragraph streaming-partial", children: renderInlineNodes(inlineNodes2, inlineComponents) });
     }
-    return /* @__PURE__ */ jsx3("p", { className: "markdown-paragraph streaming-partial", children: raw });
+    return /* @__PURE__ */ jsx4("p", { className: "markdown-paragraph streaming-partial", children: raw });
   }
   const propsBlock = node.props?.block;
   const inlineStatus = propsBlock?.payload?.meta?.inlineStatus ?? block.payload.meta?.inlineStatus ?? node.props?.inlineStatus;
   if (inlineStatus && inlineStatus !== "complete") {
     const raw = typeof block.payload.raw === "string" ? block.payload.raw : "";
-    return /* @__PURE__ */ jsx3("p", { className: "markdown-paragraph", children: raw });
+    return /* @__PURE__ */ jsx4("p", { className: "markdown-paragraph", children: raw });
   }
   const segments = Array.isArray(block.payload.meta?.mixedSegments) ? block.payload.meta.mixedSegments : void 0;
   if (segments && segments.length > 0) {
@@ -4592,17 +5340,17 @@ var ParagraphBlockView = React7.memo(({ store, blockId, registry }) => {
     meta: block.payload.meta
   });
   if (childIds.length > 0) {
-    const renderedChildren = childIds.map((childId) => /* @__PURE__ */ jsx3(MixedSegmentView, { store, nodeId: childId, inlineComponents }, childId));
+    const renderedChildren = childIds.map((childId) => /* @__PURE__ */ jsx4(MixedSegmentView, { store, nodeId: childId, inlineComponents }, childId));
     if (React7.isValidElement(baseElement)) {
       const { children: _ignored, className = "markdown-paragraph", inlines: _inlines, raw: _raw, meta: _meta, ...rest } = baseElement.props ?? {};
       return React7.createElement("p", { ...rest, className }, renderedChildren);
     }
-    return /* @__PURE__ */ jsx3("p", { className: "markdown-paragraph", children: renderedChildren });
+    return /* @__PURE__ */ jsx4("p", { className: "markdown-paragraph", children: renderedChildren });
   }
   if (React7.isValidElement(baseElement)) {
     return baseElement;
   }
-  return /* @__PURE__ */ jsx3("p", { className: "markdown-paragraph", children: renderInlineNodes(block.payload.inline ?? [], inlineComponents) });
+  return /* @__PURE__ */ jsx4("p", { className: "markdown-paragraph", children: renderInlineNodes(block.payload.inline ?? [], inlineComponents) });
 });
 ParagraphBlockView.displayName = "ParagraphBlockView";
 var BlockquoteBlockView = React7.memo(({ store, blockId, registry }) => {
@@ -4623,9 +5371,9 @@ var BlockquoteBlockView = React7.memo(({ store, blockId, registry }) => {
     return lines.map((line, idx) => {
       const key = `${keyPrefix}${offset}`;
       offset += line.length + 1;
-      return /* @__PURE__ */ jsxs2("span", { className: "markdown-blockquote-line", children: [
+      return /* @__PURE__ */ jsxs3("span", { className: "markdown-blockquote-line", children: [
         line,
-        idx < lastIndex ? /* @__PURE__ */ jsx3("br", {}) : null
+        idx < lastIndex ? /* @__PURE__ */ jsx4("br", {}) : null
       ] }, key);
     });
   };
@@ -4663,16 +5411,16 @@ var BlockquoteBlockView = React7.memo(({ store, blockId, registry }) => {
         }
         case "mdx":
           elements.push(
-            /* @__PURE__ */ jsx3("span", { "data-mdx-status": segment.status ?? "pending", children: segment.value }, `blockquote-mdx-${block.id}-${segmentIndex}`)
+            /* @__PURE__ */ jsx4("span", { "data-mdx-status": segment.status ?? "pending", children: segment.value }, `blockquote-mdx-${block.id}-${segmentIndex}`)
           );
           break;
         default: {
           const inline = renderInlineContent(segment.inline, `blockquote-text-inline-${block.id}-${segmentIndex}-`);
           if (inline) {
-            elements.push(/* @__PURE__ */ jsx3(React7.Fragment, { children: inline }, `blockquote-inline-${block.id}-${segmentIndex}`));
+            elements.push(/* @__PURE__ */ jsx4(React7.Fragment, { children: inline }, `blockquote-inline-${block.id}-${segmentIndex}`));
           } else {
             elements.push(
-              /* @__PURE__ */ jsx3(React7.Fragment, { children: renderTextWithBreaks(segment.value, `blockquote-text-${block.id}-${segmentIndex}-`) }, `blockquote-text-${block.id}-${segmentIndex}`)
+              /* @__PURE__ */ jsx4(React7.Fragment, { children: renderTextWithBreaks(segment.value, `blockquote-text-${block.id}-${segmentIndex}-`) }, `blockquote-text-${block.id}-${segmentIndex}`)
             );
           }
           break;
@@ -4689,9 +5437,9 @@ var BlockquoteBlockView = React7.memo(({ store, blockId, registry }) => {
     const streamingContent = mixedSegmentElements.length ? mixedSegmentElements : inlineElements ? inlineElements : fallbackElements;
     const shouldShowStreaming = !block.isFinalized && (!streamingContent || Array.isArray(streamingContent) && streamingContent.length === 0);
     const className = shouldShowStreaming ? "markdown-blockquote streaming-partial" : "markdown-blockquote";
-    return /* @__PURE__ */ jsx3("blockquote", { className, children: streamingContent });
+    return /* @__PURE__ */ jsx4("blockquote", { className, children: streamingContent });
   }
-  const childContent = childIds.map((childId) => /* @__PURE__ */ jsx3(MixedSegmentView, { store, nodeId: childId, inlineComponents }, childId));
+  const childContent = childIds.map((childId) => /* @__PURE__ */ jsx4(MixedSegmentView, { store, nodeId: childId, inlineComponents }, childId));
   const renderedContent = (() => {
     if (mixedSegmentElements.length > 0) {
       return mixedSegmentElements;
@@ -4722,7 +5470,7 @@ var BlockquoteBlockView = React7.memo(({ store, blockId, registry }) => {
   if (React7.isValidElement(baseElement)) {
     return baseElement;
   }
-  return /* @__PURE__ */ jsx3("blockquote", { className: "markdown-blockquote", children: renderedContent });
+  return /* @__PURE__ */ jsx4("blockquote", { className: "markdown-blockquote", children: renderedContent });
 });
 BlockquoteBlockView.displayName = "BlockquoteBlockView";
 var MixedSegmentView = React7.memo(({ store, nodeId, inlineComponents }) => {
@@ -4765,13 +5513,13 @@ var MixedSegmentView = React7.memo(({ store, nodeId, inlineComponents }) => {
       const status = node.props?.status ?? "pending";
       const raw = typeof node.props?.raw === "string" ? node.props?.raw : "";
       if (status === "compiled") {
-        return /* @__PURE__ */ jsx3("span", { className: "markdown-mdx-inline", "data-mdx-status": "compiled" });
+        return /* @__PURE__ */ jsx4("span", { className: "markdown-mdx-inline", "data-mdx-status": "compiled" });
       }
       if (status === "error") {
         const message = raw || "MDX error";
-        return /* @__PURE__ */ jsx3("span", { className: "markdown-mdx-inline text-destructive", "data-mdx-status": "error", children: message });
+        return /* @__PURE__ */ jsx4("span", { className: "markdown-mdx-inline text-destructive", "data-mdx-status": "error", children: message });
       }
-      return /* @__PURE__ */ jsx3("span", { className: "markdown-mdx-inline", "data-mdx-status": status, children: status === "compiled" ? "" : raw });
+      return /* @__PURE__ */ jsx4("span", { className: "markdown-mdx-inline", "data-mdx-status": status, children: status === "compiled" ? "" : raw });
     }
     default:
       return null;
@@ -4824,8 +5572,10 @@ var ListBlockView = React7.memo(
         isFinalized: block?.isFinalized ?? false
       });
     }, [listDebugEnabled, blockId, depth, ordered, childIds, listItemIds, store, block?.isFinalized]);
-    const listStyle = React7.useMemo(() => {
-      if (!ordered || listItemIds.length === 0) return void 0;
+    const { listStyle, markerDigits } = React7.useMemo(() => {
+      if (!ordered || listItemIds.length === 0) {
+        return { listStyle: void 0, markerDigits: 1 };
+      }
       let maxDigits = 1;
       listItemIds.forEach((childId, index) => {
         const childNode = store.getNode(childId);
@@ -4837,20 +5587,26 @@ var ListBlockView = React7.memo(
         const digits = digitMatch ? digitMatch.length : text.length;
         if (digits > maxDigits) maxDigits = digits;
       });
-      const baseIndent = depth === 0 ? "2.5rem" : depth === 1 ? "2rem" : "1.5rem";
+      const baseIndent = depth === 0 ? "2rem" : depth === 1 ? "1.75rem" : "1.5rem";
+      const extraDigits = Math.max(0, maxDigits - 1);
       return {
-        ["--list-indent"]: `calc(${baseIndent} + ${maxDigits}ch)`
+        markerDigits: maxDigits,
+        listStyle: {
+          ["--list-indent"]: extraDigits > 0 ? `calc(${baseIndent} + ${extraDigits}ch)` : baseIndent,
+          ["--list-marker-digits"]: String(maxDigits)
+        }
       };
     }, [ordered, listItemIds, store, depth]);
     if (listItemIds.length === 0) return null;
-    return /* @__PURE__ */ jsx3(
+    return /* @__PURE__ */ jsx4(
       Tag,
       {
         className: `markdown-list ${ordered ? "ordered" : "unordered"}`,
         "data-list-depth": depth,
+        "data-marker-digits": ordered ? markerDigits : void 0,
         "data-list-id": listDebugEnabled ? blockId : void 0,
         style: listStyle,
-        children: listItemIds.map((childId, index) => /* @__PURE__ */ jsx3(
+        children: listItemIds.map((childId, index) => /* @__PURE__ */ jsx4(
           ListItemView,
           {
             store,
@@ -4898,7 +5654,7 @@ var ListItemView = React7.memo(({ store, nodeId, inlineComponents, registry, ord
     return [segments, structural];
   }, [childIds, store]);
   const segmentElements = React7.useMemo(() => {
-    return segmentChildIds.map((childId) => /* @__PURE__ */ jsx3(MixedSegmentView, { store, nodeId: childId, inlineComponents }, childId));
+    return segmentChildIds.map((childId) => /* @__PURE__ */ jsx4(MixedSegmentView, { store, nodeId: childId, inlineComponents }, childId));
   }, [segmentChildIds, store, inlineComponents]);
   const primaryContent = React7.useMemo(() => {
     if (segmentChildIds.length > 0) {
@@ -4913,12 +5669,12 @@ var ListItemView = React7.memo(({ store, nodeId, inlineComponents, registry, ord
       switch (childNode.type) {
         case "paragraph": {
           const childInline = childNode.props?.inline ?? [];
-          return /* @__PURE__ */ jsx3("p", { className: "markdown-list-item-paragraph", children: renderInlineNodes(childInline, inlineComponents) }, childId);
+          return /* @__PURE__ */ jsx4("p", { className: "markdown-list-item-paragraph", children: renderInlineNodes(childInline, inlineComponents) }, childId);
         }
         case "list":
-          return /* @__PURE__ */ jsx3(ListBlockView, { store, blockId: childId, registry, depth: depth + 1 }, childId);
+          return /* @__PURE__ */ jsx4(ListBlockView, { store, blockId: childId, registry, depth: depth + 1 }, childId);
         default:
-          return /* @__PURE__ */ jsx3(BlockNodeRenderer, { store, blockId: childId, registry }, childId);
+          return /* @__PURE__ */ jsx4(BlockNodeRenderer, { store, blockId: childId, registry }, childId);
       }
     });
   }, [contentChildIds, store, inlineComponents, registry, depth]);
@@ -4960,7 +5716,7 @@ var ListItemView = React7.memo(({ store, nodeId, inlineComponents, registry, ord
     store,
     block?.isFinalized
   ]);
-  return /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsxs3(
     "li",
     {
       className: `markdown-list-item${isTask ? " markdown-list-item-task" : ""}`,
@@ -4968,11 +5724,11 @@ var ListItemView = React7.memo(({ store, nodeId, inlineComponents, registry, ord
       "data-list-depth": depth,
       "data-list-item-id": listDebugEnabled ? nodeId : void 0,
       children: [
-        isTask ? /* @__PURE__ */ jsxs2("div", { className: "markdown-task", children: [
-          /* @__PURE__ */ jsx3("input", { type: "checkbox", className: "markdown-task-checkbox", checked: isChecked, readOnly: true, disabled: true, tabIndex: -1, "aria-checked": isChecked }),
-          /* @__PURE__ */ jsx3("span", { className: "markdown-task-content", children: primaryContent })
+        isTask ? /* @__PURE__ */ jsxs3("div", { className: "markdown-task", children: [
+          /* @__PURE__ */ jsx4("input", { type: "checkbox", className: "markdown-task-checkbox", checked: isChecked, readOnly: true, disabled: true, tabIndex: -1, "aria-checked": isChecked }),
+          /* @__PURE__ */ jsx4("span", { className: "markdown-task-content", children: primaryContent })
         ] }) : primaryContent,
-        hasChildren ? /* @__PURE__ */ jsx3("div", { className: "markdown-list-item-children", children: filteredChildren }) : null
+        hasChildren ? /* @__PURE__ */ jsx4("div", { className: "markdown-list-item-children", children: filteredChildren }) : null
       ]
     }
   );
@@ -4981,7 +5737,7 @@ ListItemView.displayName = "ListItemView";
 var TableBlockView = React7.memo(({ store, blockId, registry }) => {
   const tableElements = registry.getTableElements();
   const childIds = useRendererChildren(store, blockId);
-  return /* @__PURE__ */ jsx3(tableElements.Table, { className: "markdown-table w-full caption-bottom text-base", children: childIds.map((sectionId) => /* @__PURE__ */ jsx3(TableSectionView, { store, nodeId: sectionId, registry }, sectionId)) });
+  return /* @__PURE__ */ jsx4(tableElements.Table, { className: "markdown-table w-full caption-bottom text-base", children: childIds.map((sectionId) => /* @__PURE__ */ jsx4(TableSectionView, { store, nodeId: sectionId, registry }, sectionId)) });
 });
 TableBlockView.displayName = "TableBlockView";
 var TableSectionView = React7.memo(({ store, nodeId, registry }) => {
@@ -4990,11 +5746,11 @@ var TableSectionView = React7.memo(({ store, nodeId, registry }) => {
   const tableElements = registry.getTableElements();
   if (node.type === "table-header") {
     const childIds = useRendererChildren(store, nodeId);
-    return /* @__PURE__ */ jsx3(tableElements.Thead, { children: /* @__PURE__ */ jsx3(tableElements.Tr, { children: childIds.map((cellId) => /* @__PURE__ */ jsx3(TableCellView, { store, nodeId: cellId, registry }, cellId)) }) });
+    return /* @__PURE__ */ jsx4(tableElements.Thead, { children: /* @__PURE__ */ jsx4(tableElements.Tr, { children: childIds.map((cellId) => /* @__PURE__ */ jsx4(TableCellView, { store, nodeId: cellId, registry }, cellId)) }) });
   }
   if (node.type === "table-body") {
     const rowIds = useRendererChildren(store, nodeId);
-    return /* @__PURE__ */ jsx3(tableElements.Tbody, { children: rowIds.map((rowId) => /* @__PURE__ */ jsx3(TableRowView, { store, nodeId: rowId, registry }, rowId)) });
+    return /* @__PURE__ */ jsx4(tableElements.Tbody, { children: rowIds.map((rowId) => /* @__PURE__ */ jsx4(TableRowView, { store, nodeId: rowId, registry }, rowId)) });
   }
   return null;
 });
@@ -5002,7 +5758,7 @@ TableSectionView.displayName = "TableSectionView";
 var TableRowView = React7.memo(({ store, nodeId, registry }) => {
   const tableElements = registry.getTableElements();
   const cellIds = useRendererChildren(store, nodeId);
-  return /* @__PURE__ */ jsx3(tableElements.Tr, { children: cellIds.map((cellId) => /* @__PURE__ */ jsx3(TableCellView, { store, nodeId: cellId, registry }, cellId)) });
+  return /* @__PURE__ */ jsx4(tableElements.Tr, { children: cellIds.map((cellId) => /* @__PURE__ */ jsx4(TableCellView, { store, nodeId: cellId, registry }, cellId)) });
 });
 TableRowView.displayName = "TableRowView";
 var TableCellView = React7.memo(({ store, nodeId, registry }) => {
@@ -5015,7 +5771,7 @@ var TableCellView = React7.memo(({ store, nodeId, registry }) => {
   const align = node.props?.align;
   const content = renderInlineNodes(inline, inlineComponents);
   const alignProps = align ? { align } : void 0;
-  return /* @__PURE__ */ jsx3(Tag, { ...alignProps, children: content });
+  return /* @__PURE__ */ jsx4(Tag, { ...alignProps, children: content });
 });
 TableCellView.displayName = "TableCellView";
 var CodeBlockView = React7.memo(({ store, blockId, registry }) => {
@@ -5029,6 +5785,7 @@ var CodeBlockView = React7.memo(({ store, blockId, registry }) => {
     deferredConfig ? { ...deferredConfig, enabled: true } : { enabled: false }
   );
   if (!node || !node.block) return null;
+  const blockIsFinalized = node.block.isFinalized;
   const nodeVersion = node.version;
   const lines = React7.useMemo(() => {
     const seenIds = /* @__PURE__ */ new Set();
@@ -5059,13 +5816,25 @@ var CodeBlockView = React7.memo(({ store, blockId, registry }) => {
   const lang = typeof node.props?.lang === "string" ? node.props?.lang : node.block.payload.meta?.lang;
   const preAttrs = node.props?.preAttrs ?? void 0;
   const codeAttrs = node.props?.codeAttrs ?? void 0;
+  const blockMeta = node.block.payload.meta ?? void 0;
+  const lazyEnabled = Boolean(blockMeta?.lazyTokenization);
+  const lazyTokenizedUntil = typeof blockMeta?.lazyTokenizedUntil === "number" ? blockMeta.lazyTokenizedUntil : 0;
+  const lazyHighlightedLines = Array.isArray(blockMeta?.highlightedLines) ? blockMeta.highlightedLines.length : 0;
+  const lazyTokenLines = Array.isArray(blockMeta?.tokenLines) ? blockMeta.tokenLines.length : 0;
+  const lazySourceTextLineCount = React7.useMemo(() => {
+    const raw = typeof node.block?.payload.raw === "string" ? node.block.payload.raw : "";
+    const metaCode = typeof blockMeta?.code === "string" ? blockMeta.code : null;
+    const sourceText = resolveCodeSourceText(raw, metaCode);
+    if (sourceText.length === 0) return 0;
+    return sourceText.split("\n").length;
+  }, [blockMeta, node.block?.payload.raw]);
+  const totalLazyLineCount = Math.max(lines.length, lazyHighlightedLines, lazyTokenLines, lazySourceTextLineCount);
   const virtualizationConfig = DEFAULT_VIRTUALIZED_CODE_CONFIG;
   const virtualizationDisabled = typeof process !== "undefined" && typeof process.env === "object" && process.env.STREAM_MDX_DISABLE_VIRTUALIZED_CODE === "true";
-  const shouldVirtualize = !virtualizationDisabled && virtualizationConfig.enabled && lines.length >= virtualizationConfig.virtualizeThreshold;
+  const canVirtualize = node.block.isFinalized && !lazyEnabled;
+  const shouldVirtualize = canVirtualize && !virtualizationDisabled && virtualizationConfig.enabled && lines.length >= virtualizationConfig.virtualizeThreshold;
   const virtualization = useVirtualizedCode(lines, shouldVirtualize ? virtualizationConfig : { ...virtualizationConfig, enabled: false });
   const highlightRequester = useCodeHighlightRequester();
-  const lazyEnabled = Boolean(node.block.payload.meta?.lazyTokenization);
-  const lazyTokenizedUntil = typeof node.block.payload.meta?.lazyTokenizedUntil === "number" ? node.block.payload.meta.lazyTokenizedUntil : 0;
   const lastRangeRef = React7.useRef(null);
   const rafRef = React7.useRef(null);
   const idleRef = React7.useRef(null);
@@ -5146,30 +5915,112 @@ var CodeBlockView = React7.memo(({ store, blockId, registry }) => {
     virtualization.window.startIndex,
     virtualization.window.endIndex
   ]);
-  const highlightedHtml = React7.useMemo(() => {
-    if (!shouldVirtualize && node.block?.payload.highlightedHtml) {
-      return node.block.payload.highlightedHtml;
+  React7.useEffect(() => {
+    if (shouldVirtualize || !blockIsFinalized || !lazyEnabled || !highlightRequester) return;
+    if (totalLazyLineCount <= 0 || lazyTokenizedUntil >= totalLazyLineCount) return;
+    const nextRange = {
+      visibleStart: 0,
+      visibleEnd: totalLazyLineCount,
+      prefetchStart: 0,
+      prefetchEnd: totalLazyLineCount,
+      tokenizedUntil: lazyTokenizedUntil
+    };
+    const last = lastRangeRef.current;
+    if (last && last.visibleStart === nextRange.visibleStart && last.visibleEnd === nextRange.visibleEnd && last.prefetchStart === nextRange.prefetchStart && last.prefetchEnd === nextRange.prefetchEnd && last.tokenizedUntil === nextRange.tokenizedUntil) {
+      return;
     }
+    lastRangeRef.current = nextRange;
+    if (rafRef.current !== null && typeof cancelAnimationFrame === "function") {
+      cancelAnimationFrame(rafRef.current);
+    }
+    const requestFullHighlight = () => {
+      highlightRequester({
+        blockId,
+        startLine: 0,
+        endLine: totalLazyLineCount,
+        priority: "visible",
+        reason: "finalize-full"
+      });
+      rafRef.current = null;
+    };
+    if (typeof requestAnimationFrame === "function") {
+      rafRef.current = requestAnimationFrame(requestFullHighlight);
+    } else {
+      requestFullHighlight();
+    }
+  }, [blockId, blockIsFinalized, highlightRequester, lazyEnabled, lazyTokenizedUntil, shouldVirtualize, totalLazyLineCount]);
+  const highlightedHtml = React7.useMemo(() => {
+    const blockHtml = node.block?.payload.highlightedHtml ?? "";
+    const raw = typeof node.block?.payload.raw === "string" ? node.block.payload.raw : "";
+    const metaCode = typeof node.block?.payload.meta?.code === "string" ? (node.block?.payload.meta).code : null;
+    const sourceText = resolveCodeSourceText(raw, metaCode);
+    const sourceEndsWithNewline = sourceText.endsWith("\n");
+    const sourceLines = sourceText.length > 0 ? sourceText.split("\n") : [];
+    const rawFallbackLines = buildCodeFallbackLines(raw);
+    const deterministicWrapperAttrs = getDefaultCodeWrapperAttributes2(lang);
+    const composedPreAttrs = deterministicWrapperAttrs.preAttrs;
+    const composedCodeAttrs = deterministicWrapperAttrs.codeAttrs;
+    const shouldAppendTerminalNewline = (renderedLines) => {
+      if (!sourceEndsWithNewline || renderedLines.length === 0 || lines.length === 0) {
+        return false;
+      }
+      const lastRendered = renderedLines[renderedLines.length - 1];
+      const lastKnown = lines[lines.length - 1];
+      if (!lastRendered || !lastKnown || lastRendered.index !== lastKnown.index || lastRendered.text === "") {
+        return false;
+      }
+      const expectedRenderedLineCount = Math.max(0, sourceLines.length - 1);
+      const expectedLastRenderedLine = sourceLines.length >= 2 ? sourceLines[sourceLines.length - 2] ?? "" : "";
+      return renderedLines.length === expectedRenderedLineCount && lastRendered.text === expectedLastRenderedLine;
+    };
     if (lines.length > 0) {
       const hasLineHtml = lines.some((line) => typeof line.html === "string" && line.html.length > 0);
-      if (!hasLineHtml && node.block?.payload.highlightedHtml) {
-        return node.block.payload.highlightedHtml;
+      if (!hasLineHtml && blockHtml) {
+        return blockHtml;
       }
       if (shouldVirtualize) {
-        return composeHighlightedHtml(virtualization.window.visibleLines, preAttrs, codeAttrs);
+        return composeHighlightedHtml(
+          virtualization.window.visibleLines,
+          composedPreAttrs,
+          composedCodeAttrs,
+          shouldAppendTerminalNewline(virtualization.window.visibleLines)
+        );
       }
-      return composeHighlightedHtml(lines, preAttrs, codeAttrs);
+      return composeHighlightedHtml(lines, composedPreAttrs, composedCodeAttrs, shouldAppendTerminalNewline(lines));
+    }
+    if (!shouldVirtualize && blockHtml) {
+      const hasHighlightedLines = blockHtml.includes('class="line"');
+      if (!hasHighlightedLines && rawFallbackLines.length > 0) {
+        return composeHighlightedHtml(
+          rawFallbackLines,
+          composedPreAttrs,
+          composedCodeAttrs,
+          sourceEndsWithNewline && rawFallbackLines[rawFallbackLines.length - 1]?.text !== ""
+        );
+      }
+      return blockHtml;
     }
-    const blockHtml = node.block?.payload.highlightedHtml ?? "";
     if (blockHtml?.trim().match(/^```[\w-]*\s*$/)) {
-      const raw = node.block?.payload.raw ?? "";
-      if (raw.trim().length > 0) {
-        return composeHighlightedHtml([{ index: 0, text: raw, html: null, id: "temp" }], preAttrs, codeAttrs);
+      if (rawFallbackLines.length > 0) {
+        return composeHighlightedHtml(
+          rawFallbackLines,
+          composedPreAttrs,
+          composedCodeAttrs,
+          sourceEndsWithNewline && rawFallbackLines[rawFallbackLines.length - 1]?.text !== ""
+        );
       }
     }
+    if (!blockHtml && rawFallbackLines.length > 0) {
+      return composeHighlightedHtml(
+        rawFallbackLines,
+        composedPreAttrs,
+        composedCodeAttrs,
+        sourceEndsWithNewline && rawFallbackLines[rawFallbackLines.length - 1]?.text !== ""
+      );
+    }
     return blockHtml;
-  }, [shouldVirtualize, node.block?.payload.highlightedHtml, lines, preAttrs, codeAttrs, virtualization.window.visibleLines, node.block?.payload.raw]);
-  const rendered = /* @__PURE__ */ jsx3(
+  }, [blockIsFinalized, shouldVirtualize, node.block?.payload.highlightedHtml, node.block?.payload.meta, lines, lang, virtualization.window.visibleLines, node.block?.payload.raw]);
+  const rendered = /* @__PURE__ */ jsx4(
     CodeComponent,
     {
       html: highlightedHtml,
@@ -5180,20 +6031,26 @@ var CodeBlockView = React7.memo(({ store, blockId, registry }) => {
       codeAttrs
     }
   );
+  const effectiveLineCount = React7.useMemo(() => {
+    if (lines.length > 0) {
+      return lines.length;
+    }
+    return 1;
+  }, [lines.length]);
   const codeFrameClass = "not-prose flex flex-col rounded-lg border border-input pt-1 font-mono text-sm";
   const codeMetricsAttrs = {
     "data-code-block": "true",
     "data-block-id": blockId,
     "data-code-virtualized": shouldVirtualize ? "true" : "false",
-    "data-code-total-lines": String(lines.length),
-    "data-code-mounted-lines": String(shouldVirtualize ? virtualization.window.mountedLines : lines.length),
+    "data-code-total-lines": String(effectiveLineCount),
+    "data-code-mounted-lines": String(shouldVirtualize ? virtualization.window.mountedLines : effectiveLineCount),
     "data-code-window-size": String(virtualization.config.windowSize)
   };
   const codeView = shouldVirtualize ? (() => {
     const { containerRef, window: window2, handleScroll, lineHeight } = virtualization;
     const spacerTop = window2.startIndex * lineHeight;
     const spacerBottom = (window2.totalLines - window2.endIndex) * lineHeight;
-    return /* @__PURE__ */ jsx3("pre", { className: codeFrameClass, ...codeMetricsAttrs, children: /* @__PURE__ */ jsxs2(
+    return /* @__PURE__ */ jsx4("pre", { className: codeFrameClass, ...codeMetricsAttrs, children: /* @__PURE__ */ jsxs3(
       "div",
       {
         ref: containerRef,
@@ -5201,13 +6058,13 @@ var CodeBlockView = React7.memo(({ store, blockId, registry }) => {
         style: { overflowY: "auto", overflowX: "hidden", maxHeight: "600px" },
         onScroll: handleScroll,
         children: [
-          /* @__PURE__ */ jsx3("div", { style: { height: spacerTop }, "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx4("div", { style: { height: spacerTop }, "aria-hidden": "true" }),
           rendered,
-          /* @__PURE__ */ jsx3("div", { style: { height: spacerBottom }, "aria-hidden": "true" })
+          /* @__PURE__ */ jsx4("div", { style: { height: spacerBottom }, "aria-hidden": "true" })
         ]
       }
     ) });
-  })() : /* @__PURE__ */ jsx3("pre", { className: codeFrameClass, ...codeMetricsAttrs, children: rendered });
+  })() : /* @__PURE__ */ jsx4("pre", { className: codeFrameClass, ...codeMetricsAttrs, children: rendered });
   const blockComponentMap = registry.getBlockComponentMap();
   const MermaidComponent = Object.prototype.hasOwnProperty.call(blockComponentMap, "mermaid") ? blockComponentMap.mermaid : null;
   if ((lang ?? "").toLowerCase() === "mermaid" && MermaidComponent) {
@@ -5215,7 +6072,7 @@ var CodeBlockView = React7.memo(({ store, blockId, registry }) => {
     const fenced = stripCodeFence(raw);
     const code = fenced.hadFence ? fenced.code : raw;
     if (deferredConfig) {
-      return /* @__PURE__ */ jsx3("div", { ref: deferredRef, children: shouldRenderDeferred ? React7.createElement(MermaidComponent, {
+      return /* @__PURE__ */ jsx4("div", { ref: deferredRef, children: shouldRenderDeferred ? React7.createElement(MermaidComponent, {
         code,
         renderCode: codeView,
         meta: node.block.payload.meta,
@@ -5232,21 +6089,152 @@ var CodeBlockView = React7.memo(({ store, blockId, registry }) => {
   return codeView;
 });
 CodeBlockView.displayName = "CodeBlockView";
-function composeHighlightedHtml(lines, preAttrs, codeAttrs) {
+function composeHighlightedHtml(lines, preAttrs, codeAttrs, appendTerminalNewline = false) {
   const lineMarkup = lines.map((line) => {
-    const content = line.html ?? escapeHtml3(line.text);
+    const content = line.html ?? renderTokenLineHtml(line.tokens) ?? escapeHtml3(line.text);
     const dataLine = Number.isFinite(line.index) ? ` data-line="${line.index + 1}"` : "";
     return `<span class="line"${dataLine}>${content}</span>`;
   }).join("\n");
   const preAttr = attrsToString(preAttrs);
   const codeAttr = attrsToString(codeAttrs);
-  return `<pre${preAttr}><code${codeAttr}>${lineMarkup}
-</code></pre>`;
+  return `<pre${preAttr}><code${codeAttr}>${lineMarkup}${appendTerminalNewline ? "\n" : ""}</code></pre>`;
+}
+var TOKEN_FONT_STYLE_ITALIC = 1;
+var TOKEN_FONT_STYLE_BOLD = 2;
+var TOKEN_FONT_STYLE_UNDERLINE = 4;
+var TOKEN_FONT_STYLE_STRIKETHROUGH = 8;
+function renderTokenLineHtml(tokens) {
+  if (!tokens || !Array.isArray(tokens.spans)) {
+    return null;
+  }
+  return mergeRenderableTokenSpans(tokens.spans).map((span) => renderTokenSpanHtml(span)).join("");
+}
+function renderTokenSpanHtml(span) {
+  const dark = span.v?.dark;
+  const light = span.v?.light;
+  const single = span.s;
+  const styles = [];
+  if (dark?.fg) {
+    styles.push(`--shiki-dark:${dark.fg}`);
+  }
+  if (light?.fg) {
+    styles.push(`--shiki-light:${light.fg}`);
+  }
+  if (!light?.fg && !dark?.fg && single?.fg) {
+    styles.push(`color:${single.fg}`);
+  }
+  const fontStyle = light?.fs ?? dark?.fs ?? single?.fs;
+  if (typeof fontStyle === "number" && fontStyle > 0) {
+    if (fontStyle & TOKEN_FONT_STYLE_ITALIC) {
+      styles.push("font-style: italic");
+    }
+    if (fontStyle & TOKEN_FONT_STYLE_BOLD) {
+      styles.push("font-weight: bold");
+    }
+    const decorations = [];
+    if (fontStyle & TOKEN_FONT_STYLE_UNDERLINE) {
+      decorations.push("underline");
+    }
+    if (fontStyle & TOKEN_FONT_STYLE_STRIKETHROUGH) {
+      decorations.push("line-through");
+    }
+    if (decorations.length > 0) {
+      styles.push(`text-decoration: ${decorations.join(" ")}`);
+    }
+  }
+  const content = escapeHtml3(span.t ?? "");
+  if (styles.length === 0) {
+    return content;
+  }
+  return `<span style="${styles.join(";")}">${content}</span>`;
+}
+function mergeRenderableTokenSpans(spans) {
+  if (spans.length <= 1) {
+    return spans.slice();
+  }
+  const merged = [];
+  let pendingWhitespace = "";
+  for (const span of spans) {
+    const text = typeof span.t === "string" ? span.t : "";
+    if (/^[\t ]+$/.test(text)) {
+      pendingWhitespace += text;
+      continue;
+    }
+    const nextSpan = pendingWhitespace ? { ...span, t: `${pendingWhitespace}${text}` } : span;
+    pendingWhitespace = "";
+    const previous = merged[merged.length - 1];
+    if (previous && sameTokenSpanStyle(previous, nextSpan)) {
+      previous.t += nextSpan.t;
+    } else {
+      merged.push({ ...nextSpan });
+    }
+  }
+  if (pendingWhitespace) {
+    const previous = merged[merged.length - 1];
+    if (previous) {
+      previous.t += pendingWhitespace;
+    } else {
+      merged.push({ t: pendingWhitespace });
+    }
+  }
+  return merged;
+}
+function sameTokenSpanStyle(a, b) {
+  const variantKeys = /* @__PURE__ */ new Set([
+    ...Object.keys(a.v ?? {}),
+    ...Object.keys(b.v ?? {})
+  ]);
+  for (const key of variantKeys) {
+    const aStyle = a.v?.[key];
+    const bStyle = b.v?.[key];
+    if ((aStyle?.fg ?? null) !== (bStyle?.fg ?? null)) return false;
+    if ((aStyle?.bg ?? null) !== (bStyle?.bg ?? null)) return false;
+    if ((aStyle?.fs ?? null) !== (bStyle?.fs ?? null)) return false;
+  }
+  if ((a.s?.fg ?? null) !== (b.s?.fg ?? null)) return false;
+  if ((a.s?.bg ?? null) !== (b.s?.bg ?? null)) return false;
+  if ((a.s?.fs ?? null) !== (b.s?.fs ?? null)) return false;
+  return true;
+}
+function resolveCodeSourceText(raw, metaCode) {
+  if (metaCode !== null) {
+    return metaCode.replace(/\r\n?/g, "\n");
+  }
+  if (!raw) return "";
+  const normalized = raw.replace(/\r\n?/g, "\n");
+  const fenced = stripCodeFence(normalized);
+  return fenced.hadFence ? fenced.code : normalized;
 }
 function attrsToString(attrs) {
   if (!attrs) return "";
   return Object.entries(attrs).map(([key, value]) => ` ${key}="${escapeAttribute(value)}"`).join("");
 }
+function buildCodeFallbackLines(raw) {
+  const normalized = normalizeCodeFallbackRaw(raw);
+  if (normalized.length === 0) {
+    if (/^\s*```[^\n]*\n?\s*$/.test(raw)) {
+      return [{ id: "temp-0", index: 0, text: "", html: null }];
+    }
+    return [];
+  }
+  return normalized.split("\n").map((line, index) => ({
+    id: `temp-${index}`,
+    index,
+    text: line,
+    html: null
+  }));
+}
+function normalizeCodeFallbackRaw(raw) {
+  if (!raw) return "";
+  const normalized = raw.replace(/\r\n?/g, "\n");
+  const fenced = stripCodeFence(normalized);
+  if (!fenced.hadFence) {
+    return normalized.replace(/\n+$/, "");
+  }
+  let code = fenced.code;
+  code = code.replace(/\n+$/, "");
+  return code;
+}
 function escapeHtml3(value) {
   return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
@@ -5267,7 +6255,7 @@ var MarkdownBlocksRenderer = React8.memo(({ blocks, componentRegistry, className
       React8.createElement(StoreBackedBlocks, { store, componentRegistry })
     );
   }
-  const renderedBlocks = useMemo4(() => {
+  const renderedBlocks = useMemo5(() => {
     return blocks.map((block) => {
       const key = getBlockKey(block);
       return React8.createElement(BlockRenderer, {
@@ -5300,7 +6288,7 @@ var StoreBackedBlocks = React8.memo(
 );
 StoreBackedBlocks.displayName = "StoreBackedBlocks";
 var BlockRenderer = React8.memo(({ block, componentRegistry, isFinalized }) => {
-  const element = useMemo4(() => {
+  const element = useMemo5(() => {
     return componentRegistry.renderBlock(block);
   }, [block, componentRegistry]);
   const className = `markdown-block markdown-block-${block.type} ${isFinalized ? "finalized" : "dirty"}`;
@@ -5370,7 +6358,9 @@ var MarkdownRenderer = class {
         lowPriorityFrameBudgetMs: this.config.performance?.lowPriorityFrameBudgetMs,
         urgentQueueThreshold: this.config.performance?.urgentQueueThreshold,
         batch: this.config.performance?.batch,
-        historyLimit: this.config.performance?.historyLimit
+        historyLimit: this.config.performance?.historyLimit,
+        startupMicrotaskFlushes: this.config.performance?.startupMicrotaskFlushes,
+        adaptiveBudgeting: this.config.performance?.adaptiveBudgeting
       }
     });
   }
@@ -5564,18 +6554,8 @@ var MarkdownRenderer = class {
           const receivedAt = typeof performance !== "undefined" && typeof performance.now === "function" ? performance.now() : Date.now();
           const batches = splitPatchBatch(message.patches);
           batches.forEach((batch, index) => {
-            const hasStructural = batch.some((patch) => {
-              switch (patch.op) {
-                case "insertChild":
-                case "replaceChild":
-                case "deleteChild":
-                case "reorder":
-                  return true;
-                default:
-                  return false;
-              }
-            });
-            const priority = hasStructural ? "high" : batch.some(isHeavyPatch) ? "low" : "high";
+            const hasSemantic = batch.some((patch) => getPatchKind(patch) === "semantic");
+            const priority = hasSemantic ? "high" : batch.some(isHeavyPatch) ? "low" : "high";
             this.patchScheduler.enqueue({
               patches: batch,
               meta: {
@@ -5712,10 +6692,10 @@ var MarkdownRenderer = class {
   }
 };
 function useMarkdownRenderer(config = {}) {
-  const [renderer] = useState4(() => new MarkdownRenderer(config));
-  const [blocks, setBlocks] = useState4([]);
-  const workerRef = useRef3(null);
-  useEffect4(() => {
+  const [renderer] = useState5(() => new MarkdownRenderer(config));
+  const [blocks, setBlocks] = useState5([]);
+  const workerRef = useRef4(null);
+  useEffect5(() => {
     if (!workerRef.current) {
       const fallbackFactory = () => new Worker("/workers/markdown-worker.js", { type: "module", name: "markdown-v2" });
       const worker = createDefaultWorker() ?? fallbackFactory();
@@ -5730,41 +6710,41 @@ function useMarkdownRenderer(config = {}) {
       }
     };
   }, [renderer]);
-  useEffect4(() => {
+  useEffect5(() => {
     const unsubscribe = renderer.onUpdate(setBlocks);
     return unsubscribe;
   }, [renderer]);
   const mdxComponents = config.mdx?.components;
-  useEffect4(() => {
+  useEffect5(() => {
     if (mdxComponents && Object.keys(mdxComponents).length > 0) {
       renderer.setMdxComponents(mdxComponents);
     }
   }, [renderer, mdxComponents]);
-  const append = useCallback3(
+  const append = useCallback4(
     (text) => {
       renderer.append(text);
     },
     [renderer]
   );
-  const renderStatic = useCallback3(
+  const renderStatic = useCallback4(
     (text) => {
       return renderer.renderStatic(text);
     },
     [renderer]
   );
-  const setBlockComponents = useCallback3(
+  const setBlockComponents = useCallback4(
     (components) => {
       renderer.setBlockComponents(components);
     },
     [renderer]
   );
-  const setInlineComponents = useCallback3(
+  const setInlineComponents = useCallback4(
     (components) => {
       renderer.setInlineComponents(components);
     },
     [renderer]
   );
-  const setMdxComponents = useCallback3(
+  const setMdxComponents = useCallback4(
     (components) => {
       renderer.setMdxComponents(components);
     },
@@ -5783,13 +6763,13 @@ function useMarkdownRenderer(config = {}) {
 }
 var MarkdownRenderer2 = ({ config, className, onBlocksChange, children }) => {
   const api = useMarkdownRenderer(config);
-  const highlightRequester = useCallback3(
+  const highlightRequester = useCallback4(
     (request) => {
       api.renderer.requestCodeHighlightRange(request);
     },
     [api.renderer]
   );
-  useEffect4(() => {
+  useEffect5(() => {
     if (onBlocksChange) {
       onBlocksChange(api.blocks);
     }
@@ -5813,9 +6793,9 @@ function createMarkdownRenderer(config = {}) {
 }
 
 // src/streaming-markdown.tsx
-import React10, { forwardRef, useCallback as useCallback4, useEffect as useEffect5, useImperativeHandle, useMemo as useMemo5, useRef as useRef4, useState as useState5 } from "react";
+import React10, { forwardRef, useCallback as useCallback5, useEffect as useEffect6, useImperativeHandle, useMemo as useMemo6, useRef as useRef5, useState as useState6 } from "react";
 import { createDefaultWorker as createDefaultWorker2, releaseDefaultWorker as releaseDefaultWorker2 } from "@stream-mdx/worker";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 var EMPTY_BLOCKS = [];
 function createConfigSignature(input) {
   return JSON.stringify(input);
@@ -5827,13 +6807,13 @@ var MdxCoordinatorBridge = ({ store, mode }) => {
 };
 var MdxPrefetchBridge = ({ store }) => {
   const blocks = useRendererBlocks(store);
-  const prefetchedRuntimeRef = useRef4(false);
-  const trackedIdsRef = useRef4(/* @__PURE__ */ new Set());
-  const queueRef = useRef4(null);
+  const prefetchedRuntimeRef = useRef5(false);
+  const trackedIdsRef = useRef5(/* @__PURE__ */ new Set());
+  const queueRef = useRef5(null);
   if (!queueRef.current) {
     queueRef.current = new MdxPrefetchQueue();
   }
-  useEffect5(() => {
+  useEffect6(() => {
     const queue = queueRef.current;
     if (!queue) return;
     const nextIds = /* @__PURE__ */ new Map();
@@ -5871,7 +6851,7 @@ var MdxPrefetchBridge = ({ store }) => {
     }
     trackedIdsRef.current = new Set(nextIds.keys());
   }, [blocks]);
-  useEffect5(() => {
+  useEffect6(() => {
     return () => {
       queueRef.current?.cancelAll();
     };
@@ -5945,7 +6925,7 @@ function StreamingMarkdownComponent({
   const effectiveScheduling = scheduling ?? DEFAULT_SCHEDULING;
   const adaptiveSwitchEnabled = effectiveScheduling.batch === "microtask" && (scheduling?.adaptiveSwitch ?? true);
   const adaptiveQueueThreshold = scheduling?.adaptiveQueueThreshold ?? (typeof effectiveScheduling.maxBatchesPerFlush === "number" ? effectiveScheduling.maxBatchesPerFlush : DEFAULT_ADAPTIVE_QUEUE_THRESHOLD);
-  const configSignature = useMemo5(
+  const configSignature = useMemo6(
     () => createConfigSignature({
       features,
       prewarm: prewarmLangs,
@@ -5956,16 +6936,16 @@ function StreamingMarkdownComponent({
     }),
     [features, prewarmLangs, effectiveScheduling, mdxCompileMode, mdxComponents, mdxHydration]
   );
-  const mdxHydrationController = useMemo5(() => createMdxHydrationController(mdxHydration), [mdxHydration]);
-  const mdxHydrationContextValue = useMemo5(
+  const mdxHydrationController = useMemo6(() => createMdxHydrationController(mdxHydration), [mdxHydration]);
+  const mdxHydrationContextValue = useMemo6(
     () => ({
       controller: mdxHydrationController,
       options: mdxHydration
     }),
     [mdxHydrationController, mdxHydration]
   );
-  const rendererRef = useRef4();
-  const [session, setSession] = useState5(0);
+  const rendererRef = useRef5();
+  const [session, setSession] = useState6(0);
   const rendererKey = `${configSignature}:${session}`;
   const historyLimit = effectiveScheduling.historyLimit ?? DEFAULT_HISTORY_LIMIT;
   if (!rendererRef.current || rendererRef.current.signature !== rendererKey) {
@@ -5984,7 +6964,9 @@ function StreamingMarkdownComponent({
         lowPriorityFrameBudgetMs: effectiveScheduling.lowPriorityFrameBudgetMs,
         urgentQueueThreshold: effectiveScheduling.urgentQueueThreshold,
         batch: effectiveScheduling.batch,
-        historyLimit
+        historyLimit,
+        startupMicrotaskFlushes: effectiveScheduling.startupMicrotaskFlushes,
+        adaptiveBudgeting: effectiveScheduling.adaptiveBudgeting
       },
       mdx: mdxConfig
     };
@@ -5994,7 +6976,7 @@ function StreamingMarkdownComponent({
     };
   }
   const renderer = rendererRef.current.renderer;
-  const highlightRequester = useCallback4(
+  const highlightRequester = useCallback5(
     (request) => {
       renderer.requestCodeHighlightRange(request);
     },
@@ -6002,15 +6984,15 @@ function StreamingMarkdownComponent({
   );
   const store = renderer.getStore();
   const blocks = useRendererBlocks(store);
-  const adaptiveSwitchedRef = useRef4(false);
-  const adaptiveFirstFlushRef = useRef4(false);
+  const adaptiveSwitchedRef = useRef5(false);
+  const adaptiveFirstFlushRef = useRef5(false);
   const mdxMode = mdxCompileMode ?? "server";
-  const [workerReady, setWorkerReady] = useState5(false);
-  const workerReadyRef = useRef4(false);
-  const [streamStatus, setStreamStatus] = useState5("idle");
-  const lastMetricsRef = useRef4(null);
-  const patchHistoryRef = useRef4([]);
-  useEffect5(() => {
+  const [workerReady, setWorkerReady] = useState6(false);
+  const workerReadyRef = useRef5(false);
+  const [streamStatus, setStreamStatus] = useState6("idle");
+  const lastMetricsRef = useRef5(null);
+  const patchHistoryRef = useRef5([]);
+  useEffect6(() => {
     if (typeof window === "undefined" || typeof PerformanceObserver === "undefined") {
       return void 0;
     }
@@ -6034,27 +7016,27 @@ function StreamingMarkdownComponent({
       observer?.disconnect();
     };
   }, []);
-  const previousTextRef = useRef4();
-  useEffect5(() => {
+  const previousTextRef = useRef5();
+  useEffect6(() => {
     if (text !== void 0 && text !== previousTextRef.current) {
       previousTextRef.current = text;
       setSession((prev) => prev + 1);
     }
   }, [text]);
-  const previousStreamRef = useRef4();
-  useEffect5(() => {
+  const previousStreamRef = useRef5();
+  useEffect6(() => {
     if (stream && stream !== previousStreamRef.current) {
       previousStreamRef.current = stream;
       setSession((prev) => prev + 1);
     }
   }, [stream]);
   const linkSafetyEnabled = Boolean(linkSafety?.enabled);
-  const [linkModalState, setLinkModalState] = useState5({
+  const [linkModalState, setLinkModalState] = useState6({
     url: "",
     isOpen: false,
     isChecking: false
   });
-  const openLink = useMemo5(() => {
+  const openLink = useMemo6(() => {
     return (url) => {
       if (typeof window === "undefined") return;
       if (url.startsWith("http://") || url.startsWith("https://")) {
@@ -6064,7 +7046,7 @@ function StreamingMarkdownComponent({
       }
     };
   }, []);
-  const handleLinkClick = useMemo5(() => {
+  const handleLinkClick = useMemo6(() => {
     return async (url) => {
       if (!linkSafetyEnabled) {
         openLink(url);
@@ -6086,10 +7068,10 @@ function StreamingMarkdownComponent({
       setLinkModalState({ url, isOpen: true, isChecking: false });
     };
   }, [linkSafety, linkSafetyEnabled, openLink]);
-  const handleLinkClose = useMemo5(() => {
+  const handleLinkClose = useMemo6(() => {
     return () => setLinkModalState((prev) => ({ ...prev, isOpen: false }));
   }, []);
-  const handleLinkConfirm = useMemo5(() => {
+  const handleLinkConfirm = useMemo6(() => {
     return () => {
       const url = linkModalState.url;
       setLinkModalState((prev) => ({ ...prev, isOpen: false }));
@@ -6098,7 +7080,7 @@ function StreamingMarkdownComponent({
       }
     };
   }, [linkModalState.url, openLink]);
-  const handleLinkCopy = useMemo5(() => {
+  const handleLinkCopy = useMemo6(() => {
     return () => {
       const url = linkModalState.url;
       if (!url || typeof navigator === "undefined") return;
@@ -6119,7 +7101,7 @@ function StreamingMarkdownComponent({
       }
     };
   }, [linkModalState.url]);
-  const resolvedInlineComponents = useMemo5(() => {
+  const resolvedInlineComponents = useMemo6(() => {
     if (!linkSafetyEnabled) {
       return inlineComponents;
     }
@@ -6146,14 +7128,14 @@ function StreamingMarkdownComponent({
     };
     return { ...inlineComponents ?? {}, link: LinkComponent };
   }, [handleLinkClick, inlineComponents, linkSafetyEnabled]);
-  useEffect5(() => {
+  useEffect6(() => {
     setStreamStatus("idle");
   }, [session]);
-  useEffect5(() => {
+  useEffect6(() => {
     adaptiveSwitchedRef.current = false;
     adaptiveFirstFlushRef.current = false;
   }, [renderer]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!adaptiveSwitchEnabled) return void 0;
     const unsubscribe = renderer.addFlushListener((result) => {
       if (adaptiveSwitchedRef.current) return;
@@ -6175,12 +7157,12 @@ function StreamingMarkdownComponent({
     });
     return unsubscribe;
   }, [renderer, adaptiveSwitchEnabled, adaptiveQueueThreshold]);
-  useEffect5(() => {
+  useEffect6(() => {
     lastMetricsRef.current = null;
     patchHistoryRef.current = [];
     void renderer;
   }, [renderer]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (components) {
       renderer.setBlockComponents(components);
     }
@@ -6199,7 +7181,7 @@ function StreamingMarkdownComponent({
       renderer.getComponentRegistry().setHtmlElements(htmlElements);
     }
   }, [renderer, components, mdxComponents, inlineComponents, resolvedInlineComponents, tableElements, htmlElements]);
-  useEffect5(() => {
+  useEffect6(() => {
     const removeListener = renderer.addFlushListener((result) => {
       const metrics = summarizeFlush(result);
       lastMetricsRef.current = metrics;
@@ -6217,12 +7199,12 @@ function StreamingMarkdownComponent({
     });
     return removeListener;
   }, [renderer, historyLimit, onMetrics]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (patchHistoryRef.current.length > historyLimit) {
       patchHistoryRef.current.splice(0, patchHistoryRef.current.length - historyLimit);
     }
   }, [historyLimit]);
-  useEffect5(() => {
+  useEffect6(() => {
     const restartToken = session;
     void restartToken;
     if (process.env.NODE_ENV !== "production" && DEBUG_WORKER) {
@@ -6278,7 +7260,7 @@ function StreamingMarkdownComponent({
       }
     };
   }, [renderer, workerSource, session, onError, managedWorker]);
-  useEffect5(() => {
+  useEffect6(() => {
     const restartToken = session;
     void restartToken;
     let cancelled = false;
@@ -6395,8 +7377,8 @@ function StreamingMarkdownComponent({
     }),
     [renderer, store]
   );
-  const hasActiveBlocks = useMemo5(() => blocks.some((block) => !block.isFinalized), [blocks]);
-  const caretValue = useMemo5(() => {
+  const hasActiveBlocks = useMemo6(() => blocks.some((block) => !block.isFinalized), [blocks]);
+  const caretValue = useMemo6(() => {
     if (!caret) {
       return null;
     }
@@ -6417,7 +7399,7 @@ function StreamingMarkdownComponent({
     ...style ?? {},
     ["--stream-mdx-caret"]: JSON.stringify(caretValue)
   } : style;
-  const deferredConfig = useMemo5(() => {
+  const deferredConfig = useMemo6(() => {
     if (!deferHeavyBlocks) {
       return null;
     }
@@ -6434,10 +7416,10 @@ function StreamingMarkdownComponent({
     onConfirm: handleLinkConfirm,
     onCopy: handleLinkCopy
   }) : null;
-  return /* @__PURE__ */ jsx4(MdxHydrationContext.Provider, { value: mdxHydrationContextValue, children: /* @__PURE__ */ jsxs3(DeferredRenderContext.Provider, { value: deferredConfig, children: [
-    /* @__PURE__ */ jsx4(MdxPrefetchBridge, { store }),
-    mdxMode === "server" ? /* @__PURE__ */ jsx4(MdxCoordinatorBridge, { store, mode: mdxMode }) : null,
-    /* @__PURE__ */ jsx4(CodeHighlightRequestContext.Provider, { value: highlightRequester, children: /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx5(MdxHydrationContext.Provider, { value: mdxHydrationContextValue, children: /* @__PURE__ */ jsxs4(DeferredRenderContext.Provider, { value: deferredConfig, children: [
+    /* @__PURE__ */ jsx5(MdxPrefetchBridge, { store }),
+    mdxMode === "server" ? /* @__PURE__ */ jsx5(MdxCoordinatorBridge, { store, mode: mdxMode }) : null,
+    /* @__PURE__ */ jsx5(CodeHighlightRequestContext.Provider, { value: highlightRequester, children: /* @__PURE__ */ jsx5(
       MarkdownBlocksRenderer,
       {
         blocks: EMPTY_BLOCKS,
@@ -6556,6 +7538,7 @@ function percentile2(values, ratio) {
   return sorted[index];
 }
 export {
+  BottomStickScrollArea,
   ComponentRegistry,
   DEFAULT_COALESCE_CONFIG,
   DEFAULT_VIRTUALIZED_CODE_CONFIG,
@@ -6581,6 +7564,7 @@ export {
   defaultInlineComponents,
   getMDXClient,
   getMDXComponentFactory,
+  getPatchKind,
   isHeavyPatch,
   isListPatchDebugEnabled,
   mapHtmlToReact,