@stream-mdx/react 0.1.1 → 0.3.0

package/dist/renderer/store.mjs

@@ -1,10 +1,15 @@
 "use client";
 
 // src/renderer/store.ts
-import { cloneBlock, createBlockSnapshot } from "@stream-mdx/core";
-import { extractCodeWrapperAttributes } from "@stream-mdx/core";
-import { sanitizeCodeHTML, sanitizeHTML } from "@stream-mdx/core";
-import { PATCH_ROOT_ID } from "@stream-mdx/core";
+import {
+  cloneBlock,
+  createBlockSnapshot,
+  extractCodeWrapperAttributes,
+  getDefaultCodeWrapperAttributes,
+  sanitizeCodeHTML,
+  sanitizeHTML,
+  PATCH_ROOT_ID
+} from "@stream-mdx/core";
 
 // src/renderer/list-utils.ts
 function updateNodeDepth(node, depth) {
@@ -29,6 +34,22 @@ function normalizeAllListDepths(map, touched, rootId = "__root__") {
     }
   }
 }
+function normalizeListDepthsForIds(map, touched, listIds, rootId = "__root__") {
+  if (listIds.size === 0) {
+    normalizeAllListDepths(map, touched, rootId);
+    return;
+  }
+  const visited = /* @__PURE__ */ new Set();
+  for (const listId of listIds) {
+    const base = map.get(listId);
+    if (!base) continue;
+    const listNode = base.type === "list" ? base : findNearestListAncestor(map, base);
+    if (!listNode || visited.has(listNode.id)) continue;
+    visited.add(listNode.id);
+    const depth = computeListDepth(map, listNode, rootId);
+    normalizeListDepthRecursive(map, listNode, depth, touched);
+  }
+}
 function normalizeListDepthRecursive(map, listNode, depth, touched) {
   if (!listNode) return;
   if (updateNodeDepth(listNode, depth)) {
@@ -53,6 +74,28 @@ function normalizeListDepthRecursive(map, listNode, depth, touched) {
     }
   }
 }
+function findNearestListAncestor(map, node) {
+  let current = node;
+  while (current) {
+    if (current.type === "list") return current;
+    if (!current.parentId) return void 0;
+    current = map.get(current.parentId);
+  }
+  return void 0;
+}
+function computeListDepth(map, listNode, rootId) {
+  let depth = 0;
+  let current = listNode;
+  while (current && current.parentId && current.parentId !== rootId) {
+    const parent = map.get(current.parentId);
+    if (!parent) break;
+    if (parent.type === "list") {
+      depth += 1;
+    }
+    current = parent;
+  }
+  return depth;
+}
 
 // src/renderer/patch-coalescing.ts
 import {
@@ -73,12 +116,35 @@ function snapshotToBlock(node) {
 }
 var nodeSnapshotCache = /* @__PURE__ */ new Map();
 var childrenSnapshotCache = /* @__PURE__ */ new Map();
+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 pruneCache(cache, max, buffer) {
+  if (cache.size <= max + buffer) return;
+  let remaining = cache.size - max;
+  for (const key of cache.keys()) {
+    cache.delete(key);
+    remaining -= 1;
+    if (remaining <= 0) break;
+  }
+}
 var EMPTY_CHILDREN = Object.freeze([]);
 var EMPTY_NODE_SNAPSHOT = Object.freeze({ version: -1, node: void 0 });
 var EMPTY_CHILDREN_SNAPSHOT = Object.freeze({
   version: -1,
   children: EMPTY_CHILDREN
 });
+function isListPatchDebugEnabled() {
+  if (typeof globalThis !== "undefined") {
+    const flag = globalThis.__STREAMING_LIST_DEBUG__;
+    if (flag === true) return true;
+  }
+  if (typeof process !== "undefined" && process.env.NEXT_PUBLIC_STREAMING_LIST_DEBUG === "true") {
+    return true;
+  }
+  return false;
+}
 var CODE_BLOCK_DEBUG_ENABLED = (() => {
   try {
     if (typeof process !== "undefined" && process.env && process.env.NEXT_PUBLIC_STREAMING_DEBUG_CODELINES === "1") {
@@ -94,6 +160,128 @@ var CODE_BLOCK_DEBUG_ENABLED = (() => {
   }
   return false;
 })() || false;
+var CODE_BLOCK_VALIDATION_ENABLED = typeof process !== "undefined" && process.env ? process.env.NODE_ENV !== "production" : true;
+var PATCH_PERF_HISTORY_LIMIT = 120;
+var getPerfNow = (() => {
+  if (typeof performance !== "undefined" && typeof performance.now === "function") {
+    return () => performance.now();
+  }
+  return () => Date.now();
+})();
+function isPatchPerfDebugEnabled() {
+  try {
+    if (typeof process !== "undefined" && process.env) {
+      const value = process.env.NEXT_PUBLIC_STREAMING_DEBUG_PATCH_PERF;
+      if (value === "1" || value === "true") {
+        return true;
+      }
+    }
+  } catch {
+  }
+  try {
+    const debug = globalThis.__STREAMING_DEBUG__;
+    if (debug?.patchPerf) {
+      return true;
+    }
+  } catch {
+  }
+  return false;
+}
+function recordPatchPerf(summary) {
+  try {
+    if (typeof globalThis === "undefined") return;
+    const root = globalThis;
+    const history = root.__STREAM_MDX_PATCH_STATS__ ?? [];
+    history.push(summary);
+    if (history.length > PATCH_PERF_HISTORY_LIMIT) {
+      history.splice(0, history.length - PATCH_PERF_HISTORY_LIMIT);
+    }
+    root.__STREAM_MDX_PATCH_STATS__ = history;
+    root.__STREAM_MDX_PATCH_STATS_LAST__ = summary;
+    const totals = root.__STREAM_MDX_PATCH_STATS_TOTALS__ ?? {
+      calls: 0,
+      totalMs: 0,
+      applyMs: 0,
+      coalesceMs: 0,
+      listNormalizeMs: 0,
+      patches: 0,
+      coalescedPatches: 0,
+      ops: {},
+      setPropsByType: {},
+      setPropsBySize: {}
+    };
+    totals.calls += 1;
+    totals.totalMs += summary.totalMs;
+    totals.applyMs += summary.applyMs;
+    totals.coalesceMs += summary.coalesceMs;
+    totals.listNormalizeMs += summary.listNormalizeMs;
+    totals.patches += summary.patches;
+    totals.coalescedPatches += summary.coalescedPatches;
+    for (const [op, stats] of Object.entries(summary.ops)) {
+      const entry = totals.ops[op] ?? { count: 0, durationMs: 0 };
+      entry.count += stats.count;
+      entry.durationMs += stats.durationMs;
+      totals.ops[op] = entry;
+    }
+    if (summary.setPropsByType) {
+      for (const [key, stats] of Object.entries(summary.setPropsByType)) {
+        const entry = totals.setPropsByType[key] ?? { count: 0, durationMs: 0 };
+        entry.count += stats.count;
+        entry.durationMs += stats.durationMs;
+        totals.setPropsByType[key] = entry;
+      }
+    }
+    if (summary.setPropsBySize) {
+      for (const [key, stats] of Object.entries(summary.setPropsBySize)) {
+        const entry = totals.setPropsBySize[key] ?? { count: 0, durationMs: 0 };
+        entry.count += stats.count;
+        entry.durationMs += stats.durationMs;
+        totals.setPropsBySize[key] = entry;
+      }
+    }
+    root.__STREAM_MDX_PATCH_STATS_TOTALS__ = totals;
+  } catch {
+  }
+}
+function estimateBlockPayloadSize(block) {
+  if (!block || !block.payload) return 0;
+  let size = 0;
+  const payload = block.payload;
+  if (typeof payload.raw === "string") size += payload.raw.length;
+  if (typeof payload.highlightedHtml === "string") size += payload.highlightedHtml.length;
+  if (typeof payload.sanitizedHtml === "string") size += payload.sanitizedHtml.length;
+  if (typeof payload.compiledMdxModule?.code === "string") size += payload.compiledMdxModule.code.length;
+  if (Array.isArray(payload.inline)) size += payload.inline.length * 8;
+  return size;
+}
+function estimatePropsSize(props, block) {
+  let size = 0;
+  if (props) {
+    for (const [key, value] of Object.entries(props)) {
+      if (key === "block") continue;
+      if (typeof value === "string") {
+        size += value.length;
+      } else if (typeof value === "number") {
+        size += 8;
+      } else if (typeof value === "boolean") {
+        size += 4;
+      } else if (Array.isArray(value)) {
+        size += value.length * 4;
+      }
+    }
+  }
+  if (block) {
+    size += estimateBlockPayloadSize(block);
+  }
+  return size;
+}
+function bucketBySize(size) {
+  if (size < 1024) return "<1k";
+  if (size < 10 * 1024) return "1-10k";
+  if (size < 50 * 1024) return "10-50k";
+  if (size < 200 * 1024) return "50-200k";
+  return ">=200k";
+}
 function debugCodeBlock(event, payload) {
   if (!CODE_BLOCK_DEBUG_ENABLED) return;
   try {
@@ -170,7 +358,7 @@ function escapeHtml(value) {
 }
 function stripOuterLineSpan(html) {
   if (!html) return null;
-  const openTagMatch = html.match(/<span[^>]*class="[^"]*\bline\b[^"]*"[^>]*>/i);
+  const openTagMatch = html.match(/<span[^>]*>/i);
   if (!openTagMatch) {
     return null;
   }
@@ -287,8 +475,12 @@ function normalizeCodeBlockChildren(nodes, parent, touched) {
       touched.add(node.id);
       mutated = true;
     }
-    const normalizedProps = normalizeCodeLineProps({ index: idx, text: node.props?.text, html: node.props?.html }, node.props);
-    if (node.props?.index !== normalizedProps.index || node.props?.text !== normalizedProps.text || node.props?.html !== normalizedProps.html) {
+    const incoming = { index: idx, text: node.props?.text, html: node.props?.html };
+    if (Object.prototype.hasOwnProperty.call(node.props ?? {}, "tokens")) {
+      incoming.tokens = node.props.tokens;
+    }
+    const normalizedProps = normalizeCodeLineProps(incoming, node.props);
+    if (normalizedProps !== node.props) {
       node.props = normalizedProps;
       node.version++;
       touched.add(node.id);
@@ -334,43 +526,68 @@ function normalizeCodeBlockChildren(nodes, parent, touched) {
       children: parent.children.slice()
     });
   }
-  const validation = validateCodeBlockChildren(nodes, parent);
-  if (!validation.ok) {
-    debugCodeBlock("code-block-validation-failed", {
-      parentId: parent.id,
-      issues: validation.issues
-    });
-    if (!rebuildCodeBlockFromSnapshot(nodes, parent, touched, validation.issues)) {
-      console.warn("[renderer-store] unable to fully normalize code block", {
+  if (CODE_BLOCK_VALIDATION_ENABLED) {
+    const validation = validateCodeBlockChildren(nodes, parent);
+    if (!validation.ok) {
+      debugCodeBlock("code-block-validation-failed", {
         parentId: parent.id,
         issues: validation.issues
       });
+      if (!rebuildCodeBlockFromSnapshot(nodes, parent, touched, validation.issues)) {
+        console.warn("[renderer-store] unable to fully normalize code block", {
+          parentId: parent.id,
+          issues: validation.issues
+        });
+      }
     }
   }
 }
 function normalizeCodeLineProps(incoming, previous) {
-  const index = typeof incoming.index === "number" ? incoming.index : typeof previous?.index === "number" ? previous?.index : 0;
+  const previousIndex = typeof previous?.index === "number" ? previous?.index : 0;
+  const index = typeof incoming.index === "number" ? incoming.index : previousIndex;
   const previousText = typeof previous?.text === "string" ? previous?.text : "";
   const previousHtml = typeof previous?.html === "string" ? previous?.html : null;
+  const previousTokens = Object.prototype.hasOwnProperty.call(previous ?? {}, "tokens") ? previous?.tokens : void 0;
   const hasIncomingText = typeof incoming.text === "string";
+  const hasIncomingHtml = typeof incoming.html === "string";
+  const hasIncomingTokens = Object.prototype.hasOwnProperty.call(incoming, "tokens");
+  const incomingTokens = hasIncomingTokens ? incoming.tokens : void 0;
   const rawText = hasIncomingText ? incoming.text : previousText;
+  if (previous && !hasIncomingHtml && !hasIncomingTokens && index === previousIndex && (!hasIncomingText || rawText === previousText)) {
+    return previous;
+  }
+  if (previous && hasIncomingHtml && !hasIncomingTokens && incoming.html === previousHtml && index === previousIndex && (!hasIncomingText || rawText === previousText)) {
+    return previous;
+  }
   let highlight = null;
-  if (typeof incoming.html === "string") {
+  if (hasIncomingHtml) {
     highlight = incoming.html;
   } else if (!hasIncomingText || rawText === previousText) {
     highlight = previousHtml;
   }
-  return createCodeLineProps(index, rawText, highlight);
+  let tokens = void 0;
+  if (hasIncomingTokens) {
+    tokens = incomingTokens ?? null;
+  } else if (!hasIncomingText || rawText === previousText) {
+    tokens = previousTokens;
+  } else {
+    tokens = null;
+  }
+  return createCodeLineProps(index, rawText, highlight, tokens);
 }
-function createCodeLineProps(index, text, highlight) {
+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 : escapeHtml(safeText);
-  return {
+  const props = {
     index,
     text: safeText,
     html
   };
+  if (tokens !== void 0) {
+    props.tokens = tokens;
+  }
+  return props;
 }
 function clampIndex(index, length) {
   if (!Number.isFinite(index)) return 0;
@@ -412,8 +629,13 @@ function mergeInlineSegmentProps(previous, incoming) {
 function applyCodeBlockMetadata(record) {
   const block = record.block;
   const highlightedHtml = block?.payload.highlightedHtml ?? "";
-  const { preAttrs, codeAttrs } = extractCodeWrapperAttributes(highlightedHtml);
   const lang = typeof block?.payload.meta?.lang === "string" ? block?.payload.meta?.lang : record.props?.lang;
+  let { preAttrs, codeAttrs } = extractCodeWrapperAttributes(highlightedHtml);
+  if (!preAttrs || !codeAttrs) {
+    const defaults = getDefaultCodeWrapperAttributes(typeof lang === "string" ? lang : void 0);
+    preAttrs = preAttrs ?? defaults.preAttrs;
+    codeAttrs = codeAttrs ?? defaults.codeAttrs;
+  }
   record.props = {
     ...record.props ?? {},
     lang,
@@ -426,7 +648,8 @@ function normalizeNodeProps(snapshot) {
     const index = typeof snapshot.props?.index === "number" ? snapshot.props?.index : 0;
     const text = typeof snapshot.props?.text === "string" ? snapshot.props?.text : "";
     const html = typeof snapshot.props?.html === "string" ? snapshot.props?.html : null;
-    return createCodeLineProps(index, text, html);
+    const tokens = Object.prototype.hasOwnProperty.call(snapshot.props ?? {}, "tokens") ? snapshot.props?.tokens : void 0;
+    return createCodeLineProps(index, text, html, tokens);
   }
   if (isInlineSegmentType(snapshot.type)) {
     const incoming = snapshot.props ? { ...snapshot.props } : {};
@@ -694,6 +917,13 @@ function createRendererStore(initialBlocks = []) {
         lastCoalescingMetrics = options?.metrics ?? null;
         return touched;
       }
+      const perfEnabled = isPatchPerfDebugEnabled();
+      const perfStart = perfEnabled ? getPerfNow() : 0;
+      const opStats = perfEnabled ? {} : {};
+      const setPropsByType = perfEnabled ? {} : {};
+      const setPropsBySize = perfEnabled ? {} : {};
+      let applyMs = 0;
+      let listNormalizeMs = 0;
       let coalescedPatches = patches;
       let metrics = options?.metrics ?? null;
       if (!options?.coalesced) {
@@ -708,32 +938,111 @@ function createRendererStore(initialBlocks = []) {
       }
       let mutatedBlocks = false;
       let listDepthDirty = false;
+      const listDepthDirtyNodes = /* @__PURE__ */ new Set();
+      const debugListPatches = isListPatchDebugEnabled();
+      const isListRelated = (type) => type === "list" || type === "list-item";
+      const logListPatch = (label, details) => {
+        if (!debugListPatches) return;
+        try {
+          console.debug(`[list-patch] ${label}`, details);
+        } catch {
+        }
+      };
+      const findNearestListNode = (nodeId) => {
+        if (!nodeId) return void 0;
+        let current = nodes.get(nodeId);
+        while (current) {
+          if (current.type === "list") return current;
+          if (!current.parentId) return void 0;
+          current = nodes.get(current.parentId);
+        }
+        return void 0;
+      };
+      const markListDepthDirty = (nodeId) => {
+        const listNode = findNearestListNode(nodeId);
+        if (listNode) {
+          listDepthDirtyNodes.add(listNode.id);
+        } else {
+          listDepthDirty = true;
+        }
+      };
       const applyPropsUpdate = (at, props) => {
+        const perfStartLocal = perfEnabled ? getPerfNow() : 0;
         const targetId = at.nodeId ?? at.blockId;
         if (!targetId) return;
         const target = nodes.get(targetId);
         if (!target) return;
-        const nextProps = props ? { ...props } : {};
-        const incomingBlock = nextProps.block;
-        if (incomingBlock !== void 0) {
-          nextProps.block = void 0;
+        const parentType = target.parentId ? nodes.get(target.parentId)?.type : void 0;
+        if (debugListPatches && (isListRelated(target.type) || isListRelated(parentType))) {
+          logListPatch("setProps", {
+            id: target.id,
+            type: target.type,
+            parentType,
+            keys: props ? Object.keys(props) : []
+          });
         }
         let propsChanged = false;
         if (target.type === "code-line") {
-          const normalized = normalizeCodeLineProps(nextProps, target.props);
-          if (!shallowEqualRecords(target.props, normalized)) {
+          const incoming = {
+            index: props?.index,
+            text: props?.text,
+            html: props?.html
+          };
+          if (Object.prototype.hasOwnProperty.call(props ?? {}, "tokens")) {
+            incoming.tokens = props.tokens;
+          }
+          const normalized = normalizeCodeLineProps(incoming, target.props);
+          if (normalized !== target.props) {
             target.props = normalized;
             propsChanged = true;
           }
+          if (propsChanged) {
+            target.version++;
+            touched.add(target.id);
+            const parent = target.parentId ? nodes.get(target.parentId) : void 0;
+            if (parent) {
+              parent.version++;
+              touched.add(parent.id);
+              if (parent.type === "code") {
+                normalizeCodeBlockChildren(nodes, parent, touched);
+              }
+            }
+          }
+          if (perfEnabled) {
+            const duration = getPerfNow() - perfStartLocal;
+            const typeKey = target.type || "unknown";
+            const sizeKey = bucketBySize(estimatePropsSize(props, void 0));
+            const typeEntry = setPropsByType[typeKey] ?? { count: 0, durationMs: 0 };
+            typeEntry.count += 1;
+            typeEntry.durationMs += duration;
+            setPropsByType[typeKey] = typeEntry;
+            const sizeEntry = setPropsBySize[sizeKey] ?? { count: 0, durationMs: 0 };
+            sizeEntry.count += 1;
+            sizeEntry.durationMs += duration;
+            setPropsBySize[sizeKey] = sizeEntry;
+          }
+          return;
         } else if (isInlineSegmentType(target.type)) {
+          const nextProps = props ? { ...props } : {};
+          if ("block" in nextProps) {
+            delete nextProps.block;
+          }
           const mergedSegments = mergeInlineSegmentProps(target.props, nextProps);
           if (!shallowEqualRecords(target.props, mergedSegments)) {
             target.props = mergedSegments;
             propsChanged = true;
           }
         } else {
+          const nextProps = props ? { ...props } : {};
+          if ("block" in nextProps) {
+            delete nextProps.block;
+          }
           const base = target.props ? { ...target.props } : {};
           let localChanged = false;
+          if (Object.prototype.hasOwnProperty.call(base, "block")) {
+            delete base.block;
+            localChanged = true;
+          }
           for (const [key, value] of Object.entries(nextProps)) {
             if (value === void 0) {
               if (Object.prototype.hasOwnProperty.call(base, key)) {
@@ -751,6 +1060,7 @@ function createRendererStore(initialBlocks = []) {
           }
         }
         let blockChanged = false;
+        const incomingBlock = props?.block;
         if (incomingBlock && typeof incomingBlock === "object") {
           target.block = cloneBlock(incomingBlock);
           if (target.type === "code") {
@@ -780,13 +1090,26 @@ function createRendererStore(initialBlocks = []) {
           } else if (parentForNormalization) {
             normalizeCodeBlockChildren(nodes, parentForNormalization, touched);
           }
-          const parentType = target.parentId ? nodes.get(target.parentId)?.type : void 0;
-          if (target.type === "list" || target.type === "list-item" || parentType === "list" || parentType === "list-item") {
-            listDepthDirty = true;
+          const parentType2 = target.parentId ? nodes.get(target.parentId)?.type : void 0;
+          if (isListRelated(target.type) || isListRelated(parentType2)) {
+            markListDepthDirty(target.id);
           }
         }
+        if (perfEnabled) {
+          const duration = getPerfNow() - perfStartLocal;
+          const typeKey = target.type || "unknown";
+          const sizeKey = bucketBySize(estimatePropsSize(props, incomingBlock && typeof incomingBlock === "object" ? incomingBlock : void 0));
+          const typeEntry = setPropsByType[typeKey] ?? { count: 0, durationMs: 0 };
+          typeEntry.count += 1;
+          typeEntry.durationMs += duration;
+          setPropsByType[typeKey] = typeEntry;
+          const sizeEntry = setPropsBySize[sizeKey] ?? { count: 0, durationMs: 0 };
+          sizeEntry.count += 1;
+          sizeEntry.durationMs += duration;
+          setPropsBySize[sizeKey] = sizeEntry;
+        }
       };
-      for (const patch of coalescedPatches) {
+      const applyPatch = (patch) => {
         switch (patch.op) {
           case "insertChild": {
             const parent = resolveParent(nodes, patch.at);
@@ -796,8 +1119,20 @@ function createRendererStore(initialBlocks = []) {
                 touched.add(id);
               }
               mutatedBlocks = true;
-              if (inserted.record.type === "list" || inserted.record.type === "list-item" || parent && (parent.type === "list" || parent.type === "list-item")) {
-                listDepthDirty = true;
+              if (isListRelated(inserted.record.type) || isListRelated(parent?.type)) {
+                markListDepthDirty(inserted.record.id);
+                if (parent) {
+                  markListDepthDirty(parent.id);
+                }
+              }
+              if (debugListPatches && (isListRelated(inserted.record.type) || isListRelated(parent?.type))) {
+                logListPatch("insertChild", {
+                  id: inserted.record.id,
+                  type: inserted.record.type,
+                  parentId: parent?.id,
+                  parentType: parent?.type,
+                  index: patch.index
+                });
               }
             }
             break;
@@ -814,8 +1149,17 @@ function createRendererStore(initialBlocks = []) {
               touched.add(parent.id);
               ensureUniqueChildren(parent, touched);
               mutatedBlocks = true;
-              if (parent.type === "list" || parent.type === "list-item" || removedNode?.type === "list" || removedNode?.type === "list-item") {
-                listDepthDirty = true;
+              if (isListRelated(parent.type) || isListRelated(removedNode?.type)) {
+                markListDepthDirty(parent.id);
+              }
+              if (debugListPatches && (isListRelated(parent.type) || isListRelated(removedNode?.type))) {
+                logListPatch("deleteChild", {
+                  id: childId,
+                  type: removedNode?.type,
+                  parentId: parent.id,
+                  parentType: parent.type,
+                  index: patch.index
+                });
               }
             }
             break;
@@ -826,8 +1170,15 @@ function createRendererStore(initialBlocks = []) {
             replaceSnapshotAt(nodes, parent, patch.index, patch.node, touched);
             touched.add(parent.id);
             mutatedBlocks = true;
-            if (parent.type === "list" || parent.type === "list-item") {
-              listDepthDirty = true;
+            if (isListRelated(parent.type)) {
+              markListDepthDirty(parent.id);
+            }
+            if (debugListPatches && isListRelated(parent.type)) {
+              logListPatch("replaceChild", {
+                parentId: parent.id,
+                parentType: parent.type,
+                index: patch.index
+              });
             }
             break;
           }
@@ -853,6 +1204,15 @@ function createRendererStore(initialBlocks = []) {
               touched.add(target.id);
               mutatedBlocks = true;
             }
+            if (isListRelated(target.type)) {
+              markListDepthDirty(target.id);
+            }
+            if (debugListPatches && isListRelated(target.type)) {
+              logListPatch("finalize", {
+                id: target.id,
+                type: target.type
+              });
+            }
             break;
           }
           case "reorder": {
@@ -870,8 +1230,17 @@ function createRendererStore(initialBlocks = []) {
             parent.children.splice(to, 0, ...moved);
             parent.version++;
             touched.add(parent.id);
-            if (parent.type === "list" || parent.type === "list-item") {
-              listDepthDirty = true;
+            if (isListRelated(parent.type)) {
+              markListDepthDirty(parent.id);
+            }
+            if (debugListPatches && isListRelated(parent.type)) {
+              logListPatch("reorder", {
+                parentId: parent.id,
+                parentType: parent.type,
+                from: patch.from,
+                to: patch.to,
+                count: patch.count
+              });
             }
             break;
           }
@@ -892,7 +1261,14 @@ function createRendererStore(initialBlocks = []) {
               const lineId = `${parent.id}::line:${absoluteIndex}`;
               insertedIds.push(lineId);
               insertedSet.add(lineId);
-              const nextLineProps = createCodeLineProps(absoluteIndex, patch.lines[offset] ?? "", patch.highlight?.[offset] ?? null);
+              const hasTokens = Object.prototype.hasOwnProperty.call(patch, "tokens");
+              const nextTokens = hasTokens ? patch.tokens?.[offset] ?? null : void 0;
+              const nextLineProps = createCodeLineProps(
+                absoluteIndex,
+                patch.lines[offset] ?? "",
+                patch.highlight?.[offset] ?? null,
+                nextTokens
+              );
               const existing = nodes.get(lineId);
               if (existing && existing.type === "code-line") {
                 const existingIndex = parent.children.indexOf(lineId);
@@ -945,8 +1321,12 @@ function createRendererStore(initialBlocks = []) {
                 const childId = parent.children[idx];
                 const child = nodes.get(childId);
                 if (child && child.type === "code-line") {
-                  const normalized = normalizeCodeLineProps({ index: idx, text: child.props?.text, html: child.props?.html }, child.props);
-                  if (!shallowEqualRecords(child.props, normalized)) {
+                  const incoming = { index: idx, text: child.props?.text, html: child.props?.html };
+                  if (Object.prototype.hasOwnProperty.call(child.props ?? {}, "tokens")) {
+                    incoming.tokens = child.props.tokens;
+                  }
+                  const normalized = normalizeCodeLineProps(incoming, child.props);
+                  if (normalized !== child.props) {
                     child.props = normalized;
                     child.version++;
                     touched.add(child.id);
@@ -989,17 +1369,66 @@ function createRendererStore(initialBlocks = []) {
           default:
             break;
         }
+      };
+      if (perfEnabled) {
+        const loopStart = getPerfNow();
+        for (const patch of coalescedPatches) {
+          const opStart = getPerfNow();
+          applyPatch(patch);
+          const opDuration = getPerfNow() - opStart;
+          const entry = opStats[patch.op] ?? { count: 0, durationMs: 0 };
+          entry.count += 1;
+          entry.durationMs += opDuration;
+          opStats[patch.op] = entry;
+        }
+        applyMs = getPerfNow() - loopStart;
+      } else {
+        for (const patch of coalescedPatches) {
+          applyPatch(patch);
+        }
       }
       if (mutatedBlocks) {
         blocksDirty = true;
       }
       if (listDepthDirty) {
-        normalizeAllListDepths(nodes, touched, PATCH_ROOT_ID);
+        if (perfEnabled) {
+          const start = getPerfNow();
+          normalizeAllListDepths(nodes, touched, PATCH_ROOT_ID);
+          listNormalizeMs = getPerfNow() - start;
+        } else {
+          normalizeAllListDepths(nodes, touched, PATCH_ROOT_ID);
+        }
+      } else if (listDepthDirtyNodes.size > 0) {
+        if (perfEnabled) {
+          const start = getPerfNow();
+          normalizeListDepthsForIds(nodes, touched, listDepthDirtyNodes, PATCH_ROOT_ID);
+          listNormalizeMs = getPerfNow() - start;
+        } else {
+          normalizeListDepthsForIds(nodes, touched, listDepthDirtyNodes, PATCH_ROOT_ID);
+        }
       }
       if (touched.size > 0 || mutatedBlocks) {
         version++;
         scheduleNotify();
       }
+      if (perfEnabled) {
+        const totalMs = getPerfNow() - perfStart;
+        const coalesceMs = typeof metrics?.durationMs === "number" ? metrics.durationMs : 0;
+        recordPatchPerf({
+          timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+          totalMs,
+          applyMs,
+          coalesceMs,
+          listNormalizeMs,
+          patches: patches.length,
+          coalescedPatches: coalescedPatches.length,
+          touchedCount: touched.size,
+          mutatedBlocks,
+          ops: opStats,
+          setPropsByType,
+          setPropsBySize
+        });
+      }
       return touched;
     },
     getBlocks() {
@@ -1032,6 +1461,7 @@ function createRendererStore(initialBlocks = []) {
       }
       const snapshot = { version: record.version, node: record };
       nodeSnapshotCache.set(id, snapshot);
+      pruneCache(nodeSnapshotCache, NODE_SNAPSHOT_CACHE_LIMIT, NODE_SNAPSHOT_CACHE_BUFFER);
       return snapshot;
     },
     getChildren(id) {
@@ -1045,11 +1475,12 @@ function createRendererStore(initialBlocks = []) {
         return EMPTY_CHILDREN_SNAPSHOT;
       }
       const cached = childrenSnapshotCache.get(id);
-      if (cached && cached.version === record.version && cached.children === record.children) {
+      if (cached && cached.version === record.version) {
         return cached;
       }
-      const snapshot = { version: record.version, children: record.children };
+      const snapshot = { version: record.version, children: record.children.slice() };
       childrenSnapshotCache.set(id, snapshot);
+      pruneCache(childrenSnapshotCache, CHILDREN_SNAPSHOT_CACHE_LIMIT, CHILDREN_SNAPSHOT_CACHE_BUFFER);
       return snapshot;
     },
     getLastCoalescingMetrics() {
@@ -1065,5 +1496,6 @@ function createRendererStore(initialBlocks = []) {
   return store;
 }
 export {
-  createRendererStore
+  createRendererStore,
+  isListPatchDebugEnabled
 };