@8btc/mditor 0.0.13 → 0.0.14

package/src/ts/util/attachLineNumbers.ts

@@ -1,9 +1,10 @@
 /**
- * 为编辑区域添加行号标记：
- * - 为所有包含 `data-block` 的块级节点写入 `data-linenumber`
- * - 额外为每个 `ul` 的直接 `li` 子元素写入 `data-linenumber`（不修改 `ul` 本身）
- * 通过解析传入的 Markdown 源文本，建立内容到源文件行号的映射，
- * 兼顾多行文本、嵌套列表、重复内容及空白/特殊字符，并提供基础错误保护。
+ * 功能：为编辑区域批量添加行号与列表/表格标记（O(n)）
+ * - 块级：为所有 `data-block` 写入 `data-linenumber`
+ * - 列表：为 `ul/ol > li` 写入 `data-linenumber`、`data-list-level`、`data-list-number`
+ * - 表格：为 `table` 的 `tr` 写入 `data-linenumber`（不为 `th` 设置）
+ * - 性能：一次解析 Markdown 建索引，批量收集并一次性更新属性，缓存避免重复计算
+ * - 精度：支持嵌套列表、换行列表项、多级序号；表格跨页连续行号，容忍合并单元格
  */
 export const attachLineNumbersToBlocks = (
     root: HTMLElement,
@@ -12,6 +13,39 @@ export const attachLineNumbersToBlocks = (
     if (!root || !sourceMarkdown) {
         return;
     }
+    const t0 = performance.now();
+
+    const computeHash = (s: string): string => {
+        let h = 0;
+        for (let i = 0; i < s.length; i++) {
+            h = (h * 31 + s.charCodeAt(i)) | 0;
+        }
+        return `${s.length}:${h}`;
+    };
+    type ParseCache = {
+        srcNorm: string;
+        srcLines: string[];
+        strippedLines: string[];
+        lineLookup: Map<string, number[]>;
+        unorderedListEntries: Array<{ ln: number; content: string }>;
+        unorderedLookup: Map<string, number[]>;
+        orderedListEntries: Array<{ ln: number; content: string }>;
+        orderedLookup: Map<string, number[]>;
+        orderedGroups: Array<number[]>;
+        tableRowLookup: Map<string, number[]>;
+        tableGroups: Array<{ rows: number[]; rowTexts: string[] }>;
+    };
+    const GLOBAL_CACHE: Map<string, ParseCache> =
+        (
+            globalThis as unknown as {
+                __VDITOR_LINE_CACHE__?: Map<string, ParseCache>;
+            }
+        ).__VDITOR_LINE_CACHE__ || new Map<string, ParseCache>();
+    (
+        globalThis as unknown as {
+            __VDITOR_LINE_CACHE__?: Map<string, ParseCache>;
+        }
+    ).__VDITOR_LINE_CACHE__ = GLOBAL_CACHE;
 
     const ZWSP = "\u200b";
 
@@ -25,7 +59,10 @@ export const attachLineNumbersToBlocks = (
     };
 
     const srcNorm = normalize(sourceMarkdown);
-    const srcLines = srcNorm.split("\n");
+    const tNorm = performance.now();
+    const hash = computeHash(srcNorm);
+    const cached = GLOBAL_CACHE.get(hash);
+    const srcLines = cached?.srcLines ?? srcNorm.split("\n");
     const stripInlineMD = (text: string): string => {
         return (
             text
@@ -58,14 +95,17 @@ export const attachLineNumbersToBlocks = (
                 .trim()
         );
     };
-    const strippedLines = srcLines.map((l) => stripInlineMD(l));
-    const lineLookup = new Map<string, number[]>();
-    for (let i = 0; i < strippedLines.length; i++) {
-        const key = strippedLines[i];
-        if (!lineLookup.has(key)) {
-            lineLookup.set(key, [i + 1]);
-        } else {
-            lineLookup.get(key)!.push(i + 1);
+    const strippedLines =
+        cached?.strippedLines ?? srcLines.map((l) => stripInlineMD(l));
+    const lineLookup = cached?.lineLookup ?? new Map<string, number[]>();
+    if (!cached) {
+        for (let i = 0; i < strippedLines.length; i++) {
+            const key = strippedLines[i];
+            if (!lineLookup.has(key)) {
+                lineLookup.set(key, [i + 1]);
+            } else {
+                lineLookup.get(key)!.push(i + 1);
+            }
         }
     }
     const usedLines = new Set<number>();
@@ -96,19 +136,26 @@ export const attachLineNumbersToBlocks = (
      * 预处理：收集 Markdown 中所有无序列表（ul）行及其去除行内标记后的内容，构建快速查找结构。
      * 仅匹配以 `*`、`-`、`+` 开头的条目，支持任务列表如 `- [ ]`、`* [x]`。
      */
-    const unorderedListEntries: Array<{ ln: number; content: string }> = [];
-    const unorderedLookup = new Map<string, number[]>();
+    const unorderedListEntries: Array<{ ln: number; content: string }> =
+        cached?.unorderedListEntries ?? [];
+    const unorderedLookup =
+        cached?.unorderedLookup ?? new Map<string, number[]>();
     const usedUnorderedLines = new Set<number>();
-    for (let i = 0; i < srcLines.length; i++) {
-        const raw = srcLines[i];
-        const m = raw.match(/^\s*[*+-]\s+(?:\[(?: |x|X)\]\s+)?(.*)$/);
-        if (m && typeof m[1] === "string") {
-            const contentStripped = stripInlineForList(m[1]);
-            unorderedListEntries.push({ ln: i + 1, content: contentStripped });
-            if (!unorderedLookup.has(contentStripped)) {
-                unorderedLookup.set(contentStripped, [i + 1]);
-            } else {
-                unorderedLookup.get(contentStripped)!.push(i + 1);
+    if (!cached) {
+        for (let i = 0; i < srcLines.length; i++) {
+            const raw = srcLines[i];
+            const m = raw.match(/^\s*[*+-]\s+(?:\[(?: |x|X)\]\s+)?(.*)$/);
+            if (m && typeof m[1] === "string") {
+                const contentStripped = stripInlineForList(m[1]);
+                unorderedListEntries.push({
+                    ln: i + 1,
+                    content: contentStripped,
+                });
+                if (!unorderedLookup.has(contentStripped)) {
+                    unorderedLookup.set(contentStripped, [i + 1]);
+                } else {
+                    unorderedLookup.get(contentStripped)!.push(i + 1);
+                }
             }
         }
     }
@@ -147,43 +194,48 @@ export const attachLineNumbersToBlocks = (
     /**
      * 预处理：收集 Markdown 中所有有序列表（ol）行及其内容，支持 `1.` 或 `1)` 以及任务列表前缀。
      */
-    const orderedListEntries: Array<{ ln: number; content: string }> = [];
-    const orderedLookup = new Map<string, number[]>();
+    const orderedListEntries: Array<{ ln: number; content: string }> =
+        cached?.orderedListEntries ?? [];
+    const orderedLookup = cached?.orderedLookup ?? new Map<string, number[]>();
     const usedOrderedLines = new Set<number>();
     const ORDERED_RE =
         /\s*\d+(?:[.)、．。]|[\uFF0E\uFF09\u3001])\s+(?:\[(?: |x|X)\]\s+)?(.*)/;
     const ORDERED_FULL = new RegExp(`^${ORDERED_RE.source}$`);
-    for (let i = 0; i < srcLines.length; i++) {
-        const raw = srcLines[i];
-        const m = raw.match(ORDERED_FULL);
-        if (m && typeof m[1] === "string") {
-            const contentStripped = stripInlineForList(m[1]);
-            orderedListEntries.push({ ln: i + 1, content: contentStripped });
-            if (!orderedLookup.has(contentStripped)) {
-                orderedLookup.set(contentStripped, [i + 1]);
-            } else {
-                orderedLookup.get(contentStripped)!.push(i + 1);
+    if (!cached) {
+        for (let i = 0; i < srcLines.length; i++) {
+            const raw = srcLines[i];
+            const m = raw.match(ORDERED_FULL);
+            if (m && typeof m[1] === "string") {
+                const contentStripped = stripInlineForList(m[1]);
+                orderedListEntries.push({
+                    ln: i + 1,
+                    content: contentStripped,
+                });
+                if (!orderedLookup.has(contentStripped)) {
+                    orderedLookup.set(contentStripped, [i + 1]);
+                } else {
+                    orderedLookup.get(contentStripped)!.push(i + 1);
+                }
             }
         }
     }
-    console.debug("[LineNumber][ol:index]", {
-        total: orderedListEntries.length,
-    });
 
-    const orderedGroups: Array<number[]> = [];
-    for (let i = 0; i < srcLines.length; ) {
-        const raw = srcLines[i];
-        if (ORDERED_FULL.test(raw)) {
-            const group: number[] = [];
-            while (i < srcLines.length && ORDERED_FULL.test(srcLines[i])) {
-                group.push(i + 1);
+    const orderedGroups: Array<number[]> = cached?.orderedGroups ?? [];
+    if (!cached) {
+        for (let i = 0; i < srcLines.length; ) {
+            const raw = srcLines[i];
+            if (ORDERED_FULL.test(raw)) {
+                const group: number[] = [];
+                while (i < srcLines.length && ORDERED_FULL.test(srcLines[i])) {
+                    group.push(i + 1);
+                    i++;
+                }
+                if (group.length > 0) {
+                    orderedGroups.push(group);
+                }
+            } else {
                 i++;
             }
-            if (group.length > 0) {
-                orderedGroups.push(group);
-            }
-        } else {
-            i++;
         }
     }
 
@@ -235,6 +287,8 @@ export const attachLineNumbersToBlocks = (
         return buf;
     };
 
+    const attrUpdates: Array<[HTMLElement, string, string]> = [];
+
     const blocks = root.querySelectorAll("[data-block]");
     blocks.forEach((el) => {
         try {
@@ -244,23 +298,27 @@ export const attachLineNumbersToBlocks = (
                 return;
             }
 
-            // 仅 li 需要行号：跳过并清理 ul/ol 自身及其内部嵌套的 p/div 等块
             const tagName = container.tagName;
             if (tagName === "UL" || tagName === "OL") {
-                container.removeAttribute("data-linenumber");
+                if (container.getAttribute("data-linenumber")) {
+                    attrUpdates.push([container, "data-linenumber", ""]);
+                }
                 return;
             }
             const liAncestor = container.closest("li");
             if (liAncestor) {
-                container.removeAttribute("data-linenumber");
+                if (container.getAttribute("data-linenumber")) {
+                    attrUpdates.push([container, "data-linenumber", ""]);
+                }
                 return;
             }
 
             const text = container.textContent || "";
             const normText = normalize(text);
-            // 跳过纯空白块
             if (!normText.trim()) {
-                container.removeAttribute("data-linenumber");
+                if (container.getAttribute("data-linenumber")) {
+                    attrUpdates.push([container, "data-linenumber", ""]);
+                }
                 return;
             }
 
@@ -292,12 +350,17 @@ export const attachLineNumbersToBlocks = (
 
             if (lineNumber !== -1) {
                 usedLines.add(lineNumber);
-                container.setAttribute("data-linenumber", String(lineNumber));
+                const cur = container.getAttribute("data-linenumber");
+                const val = String(lineNumber);
+                if (cur !== val) {
+                    attrUpdates.push([container, "data-linenumber", val]);
+                }
             }
         } catch {
             void 0;
         }
     });
+    const tBlockDone = performance.now();
 
     /**
      * 为所有 `ul` 下的每个直接 `li` 子元素追加 `data-linenumber`，不修改 `ul` 本身。
@@ -316,27 +379,59 @@ export const attachLineNumbersToBlocks = (
                     norm.split("\n").find((l) => l.trim().length > 0) || norm;
 
                 const ln = findUnorderedListLineNumber(firstLine);
+                const level = (() => {
+                    let depth = 0;
+                    let p: HTMLElement | null = li;
+                    while (p) {
+                        p = p.parentElement as HTMLElement | null;
+                        if (!p) break;
+                        const tag = p.tagName;
+                        if (tag === "UL" || tag === "OL") depth++;
+                    }
+                    return depth;
+                })();
+                const levelStr = String(level);
+                const curLevel = li.getAttribute("data-list-level");
+                if (curLevel !== levelStr) {
+                    attrUpdates.push([li, "data-list-level", levelStr]);
+                }
                 if (ln !== -1) {
                     usedUnorderedLines.add(ln);
-                    li.setAttribute("data-linenumber", String(ln));
+                    const curLn = li.getAttribute("data-linenumber");
+                    const val = String(ln);
+                    if (curLn !== val) {
+                        attrUpdates.push([li, "data-linenumber", val]);
+                    }
                 } else {
-                    li.setAttribute("data-linenumber", "");
+                    if (li.getAttribute("data-linenumber")) {
+                        attrUpdates.push([li, "data-linenumber", ""]);
+                    }
                 }
             }
         } catch {
             void 0;
         }
     });
+    const tUlDone = performance.now();
 
     /**
      * 为所有 `ol` 下的每个直接 `li` 子元素追加 `data-linenumber`，不修改 `ol` 本身。
      */
     const olElements = root.querySelectorAll("ol");
+    const orderedIndexMap = new WeakMap<HTMLElement, number>();
     olElements.forEach((ol) => {
         try {
             let currentGroupIdx = -1;
             let lastAssigned = -1;
+            const startAttr = Number((ol as HTMLElement).getAttribute("start"));
+            const start =
+                Number.isFinite(startAttr) && startAttr > 0 ? startAttr : 1;
             const children = Array.from(ol.children);
+            let seq = start;
+            for (const child of children) {
+                if (child.tagName !== "LI") continue;
+                orderedIndexMap.set(child as HTMLElement, seq++);
+            }
             for (const child of children) {
                 if (child.tagName !== "LI") continue;
                 const li = child as HTMLElement;
@@ -347,21 +442,15 @@ export const attachLineNumbersToBlocks = (
 
                 const stripped0 = stripInlineForList(firstLine);
                 const stripped = stripped0 || stripInlineMD(firstLine);
-                const candidates = orderedLookup.get(stripped) || [];
-                const available = candidates.filter(
-                    (n) => !usedOrderedLines.has(n)
-                );
+                orderedLookup.get(stripped);
                 const ln = findOrderedListLineNumber(firstLine);
                 if (ln !== -1) {
                     usedOrderedLines.add(ln);
-                    li.setAttribute("data-linenumber", String(ln));
-                    // 成功映射日志
-                    console.debug("[LineNumber][ol>li]", {
-                        text: firstLine,
-                        stripped,
-                        line: ln,
-                    });
-                    // 记录当前组
+                    const cur = li.getAttribute("data-linenumber");
+                    const val = String(ln);
+                    if (cur !== val) {
+                        attrUpdates.push([li, "data-linenumber", val]);
+                    }
                     for (let gi = 0; gi < orderedGroups.length; gi++) {
                         if (orderedGroups[gi].includes(ln)) {
                             currentGroupIdx = gi;
@@ -370,12 +459,10 @@ export const attachLineNumbersToBlocks = (
                     }
                     lastAssigned = ln;
                 } else {
-                    // 顺序回退：基于当前组或猜测组，按序分配下一未使用行
                     let assigned = -1;
                     const pickNextFromGroup = (gi: number): number | -1 => {
                         if (gi < 0 || gi >= orderedGroups.length) return -1;
                         const lines = orderedGroups[gi];
-                        // 优先从上次分配后续查找
                         let startIdx = 0;
                         if (lastAssigned !== -1) {
                             const idx = lines.indexOf(lastAssigned);
@@ -396,7 +483,6 @@ export const attachLineNumbersToBlocks = (
                         assigned = pickNextFromGroup(currentGroupIdx);
                     }
                     if (assigned === -1) {
-                        // 猜测组：选择拥有可用行的首个组
                         for (
                             let gi = 0;
                             gi < orderedGroups.length && assigned === -1;
@@ -412,37 +498,235 @@ export const attachLineNumbersToBlocks = (
 
                     if (assigned !== -1) {
                         usedOrderedLines.add(assigned);
-                        li.setAttribute("data-linenumber", String(assigned));
-                        console.debug("[LineNumber][ol>li][fallback-seq]", {
-                            text: firstLine,
-                            stripped,
-                            line: assigned,
-                            group: currentGroupIdx,
-                        });
+                        const cur = li.getAttribute("data-linenumber");
+                        const val = String(assigned);
+                        if (cur !== val) {
+                            attrUpdates.push([li, "data-linenumber", val]);
+                        }
                         lastAssigned = assigned;
                     } else {
-                        li.setAttribute("data-linenumber", "");
-                        // 失败诊断日志
-                        console.warn("[LineNumber][ol>li][missing]", {
-                            text: firstLine,
-                            stripped,
-                            candidates,
-                            available,
-                            reason: !stripped0
-                                ? "empty-after-strip"
-                                : candidates.length === 0
-                                  ? "no-index-candidates"
-                                  : available.length === 0
-                                    ? "all-candidates-consumed"
-                                    : "fallback-no-match",
-                        });
+                        if (li.getAttribute("data-linenumber")) {
+                            attrUpdates.push([li, "data-linenumber", ""]);
+                        }
                     }
                 }
+
+                const level = (() => {
+                    let depth = 0;
+                    let p: HTMLElement | null = li;
+                    while (p) {
+                        p = p.parentElement as HTMLElement | null;
+                        if (!p) break;
+                        const tag = p.tagName;
+                        if (tag === "UL" || tag === "OL") depth++;
+                    }
+                    return depth;
+                })();
+                const levelStr = String(level);
+                const curLevel = li.getAttribute("data-list-level");
+                if (curLevel !== levelStr) {
+                    attrUpdates.push([li, "data-list-level", levelStr]);
+                }
+
+                const numbering = (() => {
+                    const parts: number[] = [];
+                    let node: HTMLElement | null = li;
+                    while (node) {
+                        const parentOl = node.closest("ol");
+                        if (!parentOl) break;
+                        const parentLi =
+                            parentOl.parentElement?.closest("li") ||
+                            (parentOl.parentElement as HTMLElement | null);
+                        const idx = orderedIndexMap.get(node);
+                        if (typeof idx === "number") {
+                            parts.push(idx);
+                        }
+                        node = parentLi as HTMLElement | null;
+                    }
+                    return parts.reverse().join(".");
+                })();
+                const curNum = li.getAttribute("data-list-number") || "";
+                if (numbering && curNum !== numbering) {
+                    attrUpdates.push([li, "data-list-number", numbering]);
+                }
             }
         } catch {
             void 0;
         }
     });
+    const tOlDone = performance.now();
+
+    const tableRowLookup: Map<string, number[]> =
+        cached?.tableRowLookup ?? new Map<string, number[]>();
+    const tableGroups: Array<{ rows: number[]; rowTexts: string[] }> =
+        cached?.tableGroups ?? [];
+    if (!cached) {
+        const isTableRowLine = (line: string): boolean => {
+            return /^\s*\|.*\|\s*$/.test(line);
+        };
+        const isAlignLine = (line: string): boolean => {
+            return /^\s*\|?(?:\s*:?-{2,}:?\s*\|)+\s*:?-{2,}:?\s*\|?\s*$/.test(
+                line
+            );
+        };
+        for (let i = 0; i < srcLines.length; ) {
+            const header = srcLines[i];
+            const align = srcLines[i + 1];
+            if (isTableRowLine(header) && isAlignLine(align || "")) {
+                const groupRows: number[] = [i + 1];
+                const groupRowTexts: string[] = [
+                    stripInlineMD(header.replace(/^\s*\|?|\|?\s*$/g, "")),
+                ];
+                i += 2;
+                while (i < srcLines.length && isTableRowLine(srcLines[i])) {
+                    groupRows.push(i + 1);
+                    groupRowTexts.push(
+                        stripInlineMD(
+                            srcLines[i].replace(/^\s*\|?|\|?\s*$/g, "")
+                        )
+                    );
+                    i++;
+                }
+                tableGroups.push({
+                    rows: groupRows,
+                    rowTexts: groupRowTexts,
+                });
+                for (let t = 0; t < groupRowTexts.length; t++) {
+                    const key = groupRowTexts[t];
+                    const ln = groupRows[t];
+                    const arr = tableRowLookup.get(key);
+                    if (arr) arr.push(ln);
+                    else tableRowLookup.set(key, [ln]);
+                }
+            } else {
+                i++;
+            }
+        }
+    }
+    const usedTableLines = new Set<number>();
+    const tIndexDone = performance.now();
+
+    const tables = root.querySelectorAll("table");
+    let groupPtr = 0;
+    tables.forEach((table) => {
+        try {
+            const trs = table.querySelectorAll("tr");
+            trs.forEach((tr) => {
+                const cells = Array.from(tr.cells);
+                const rowText = cells.map((c) => c.textContent || "").join("|");
+                const normRow = stripInlineMD(normalize(rowText));
+                let ln = pickFirstUnused(tableRowLookup.get(normRow));
+                if (ln === -1) {
+                    while (
+                        groupPtr < tableGroups.length &&
+                        tableGroups[groupPtr].rows.every((r) =>
+                            usedTableLines.has(r)
+                        )
+                    ) {
+                        groupPtr++;
+                    }
+                    if (groupPtr < tableGroups.length) {
+                        const g = tableGroups[groupPtr];
+                        let chosen = -1;
+                        for (let k = 0; k < g.rows.length; k++) {
+                            const cand = g.rows[k];
+                            if (!usedTableLines.has(cand)) {
+                                chosen = cand;
+                                break;
+                            }
+                        }
+                        ln = chosen;
+                    }
+                }
+                if (ln !== -1) {
+                    usedTableLines.add(ln);
+                    const cur = (tr as HTMLElement).getAttribute(
+                        "data-linenumber"
+                    );
+                    const val = String(ln);
+                    if (cur !== val) {
+                        attrUpdates.push([
+                            tr as HTMLElement,
+                            "data-linenumber",
+                            val,
+                        ]);
+                    }
+                } else {
+                    const cur = (tr as HTMLElement).getAttribute(
+                        "data-linenumber"
+                    );
+                    if (cur) {
+                        attrUpdates.push([
+                            tr as HTMLElement,
+                            "data-linenumber",
+                            "",
+                        ]);
+                    }
+                }
+                const ths = tr.querySelectorAll("th");
+                ths.forEach((th) => {
+                    const curTh = (th as HTMLElement).getAttribute(
+                        "data-linenumber"
+                    );
+                    if (curTh) {
+                        attrUpdates.push([
+                            th as HTMLElement,
+                            "data-linenumber",
+                            "",
+                        ]);
+                    }
+                });
+            });
+        } catch {
+            void 0;
+        }
+    });
+    const tTableDone = performance.now();
+
+    for (const [el, attr, val] of attrUpdates) {
+        if (val === "") {
+            el.removeAttribute(attr);
+        } else {
+            el.setAttribute(attr, val);
+        }
+    }
+    const tApplyDone = performance.now();
+
+    if (!cached) {
+        GLOBAL_CACHE.set(hash, {
+            srcNorm,
+            srcLines,
+            strippedLines,
+            lineLookup,
+            unorderedListEntries,
+            unorderedLookup,
+            orderedListEntries,
+            orderedLookup,
+            orderedGroups,
+            tableRowLookup,
+            tableGroups,
+        });
+    }
+    console.log("[LineNumber][perf]", {
+        cached: !!cached,
+        times: {
+            normalize: Math.round((tNorm - t0) * 100) / 100,
+            index: Math.round((tIndexDone - tNorm) * 100) / 100,
+            blocks: Math.round((tBlockDone - tIndexDone) * 100) / 100,
+            ul: Math.round((tUlDone - tBlockDone) * 100) / 100,
+            ol: Math.round((tOlDone - tUlDone) * 100) / 100,
+            table: Math.round((tTableDone - tIndexDone) * 100) / 100,
+            apply: Math.round((tApplyDone - tTableDone) * 100) / 100,
+            total: Math.round((tApplyDone - t0) * 100) / 100,
+        },
+        counts: {
+            blocks: blocks.length,
+            ul: ulElements.length,
+            ol: olElements.length,
+            tables: tables.length,
+            updates: attrUpdates.length,
+        },
+    });
 };
 
 /**