@spzxg/cli-ui 0.6.0 → 0.6.1

package/dist/cli-ui-jszip.min-DIavJzUG.js

@@ -0,0 +1,26 @@
+import { a } from "./cli-ui-embed-Dk2QGHxn.js";
+import { r as p } from "./cli-ui-jszip.min-B9tqMA-e.js";
+function f(t, n) {
+  for (var o = 0; o < n.length; o++) {
+    const e = n[o];
+    if (typeof e != "string" && !Array.isArray(e)) {
+      for (const r in e)
+        if (r !== "default" && !(r in t)) {
+          const i = Object.getOwnPropertyDescriptor(e, r);
+          i && Object.defineProperty(t, r, i.get ? i : {
+            enumerable: !0,
+            get: () => e[r]
+          });
+        }
+    }
+  }
+  return Object.freeze(Object.defineProperty(t, Symbol.toStringTag, { value: "Module" }));
+}
+var s = p();
+const c = /* @__PURE__ */ a(s), l = /* @__PURE__ */ f({
+  __proto__: null,
+  default: c
+}, [s]);
+export {
+  l as j
+};

package/dist/cli-ui-xlsx-BKHhqcoa.js

@@ -0,0 +1,93 @@
+const I = "http://schemas.openxmlformats.org/spreadsheetml/2006/main", X = "http://schemas.openxmlformats.org/officeDocument/2006/relationships", j = /* @__PURE__ */ new Set([14, 15, 16, 17, 18, 19, 20, 21, 22, 27, 30, 36, 45, 46, 47, 50, 57]), b = (e) => new DOMParser().parseFromString(e, "application/xml"), g = (e, t) => Array.from(e.getElementsByTagNameNS(I, t));
+function _(e) {
+  let t = 0;
+  for (const n of e) {
+    const o = n.toUpperCase().charCodeAt(0);
+    if (o < 65 || o > 90) break;
+    t = t * 26 + (o - 64);
+  }
+  return t - 1;
+}
+function B(e) {
+  const t = e.replace(/"[^"]*"/g, "").replace(/\[[^\]]*\]/g, "").replace(/\\./g, "");
+  return /[ymdhs]/i.test(t) && !/^[#0.,%E+\-\s]*$/i.test(t);
+}
+function L(e) {
+  const t = Math.round((e - 25569) * 864e5), n = new Date(t);
+  if (Number.isNaN(n.getTime())) return String(e);
+  const o = (w) => String(w).padStart(2, "0"), m = `${n.getUTCFullYear()}-${o(n.getUTCMonth() + 1)}-${o(n.getUTCDate())}`;
+  if (!(n.getUTCHours() * 3600 + n.getUTCMinutes() * 60 + n.getUTCSeconds())) return m;
+  const d = `${o(n.getUTCHours())}:${o(n.getUTCMinutes())}${n.getUTCSeconds() ? `:${o(n.getUTCSeconds())}` : ""}`;
+  return e < 1 ? d : `${m} ${d}`;
+}
+function v(e) {
+  return g(e, "t").filter((t) => {
+    var n;
+    return ((n = t.parentElement) == null ? void 0 : n.localName) !== "rPh";
+  }).map((t) => t.textContent ?? "").join("");
+}
+async function R(e) {
+  var E;
+  const t = await import("./cli-ui-jszip.min-DIavJzUG.js").then((s) => s.j), o = await (t.default ?? t).loadAsync(e), m = async (s) => {
+    const a = o.file(s);
+    return a ? a.async("string") : null;
+  }, S = await m("xl/workbook.xml");
+  if (!S) throw new Error("不是 Excel 工作簿");
+  const d = /* @__PURE__ */ new Map(), w = await m("xl/_rels/workbook.xml.rels");
+  if (w)
+    for (const s of Array.from(b(w).getElementsByTagName("Relationship"))) {
+      const a = s.getAttribute("Target") ?? "";
+      d.set(s.getAttribute("Id") ?? "", a.startsWith("/") ? a.slice(1) : `xl/${a}`);
+    }
+  const T = [], $ = await m("xl/sharedStrings.xml");
+  if ($) for (const s of g(b($), "si")) T.push(v(s));
+  const y = /* @__PURE__ */ new Set(), C = /* @__PURE__ */ new Set(), U = await m("xl/styles.xml");
+  if (U) {
+    const s = b(U), a = new Map(g(s, "numFmt").map((l) => [Number(l.getAttribute("numFmtId")), l.getAttribute("formatCode") ?? ""])), N = g(s, "cellXfs")[0];
+    N && Array.from(N.children).filter((l) => l.localName === "xf").forEach((l, h) => {
+      const i = Number(l.getAttribute("numFmtId") ?? 0), r = a.get(i);
+      j.has(i) || r !== void 0 && B(r) ? y.add(h) : (i === 9 || i === 10 || r !== void 0 && r.replace(/"[^"]*"/g, "").includes("%")) && C.add(h);
+    });
+  }
+  const x = [];
+  for (const s of g(b(S), "sheet")) {
+    const a = s.getAttribute("name") ?? `Sheet${x.length + 1}`, N = d.get(s.getAttributeNS(X, "id") ?? s.getAttribute("r:id") ?? "") ?? `xl/worksheets/sheet${x.length + 1}.xml`, l = await m(N);
+    if (!l) continue;
+    const h = [];
+    for (const r of g(b(l), "row")) {
+      const D = Number(r.getAttribute("r")) || h.length + 1, F = [];
+      let M = 0;
+      for (const u of Array.from(r.children).filter((A) => A.localName === "c")) {
+        const A = u.getAttribute("r"), k = A ? _(A) : M;
+        M = k + 1;
+        const p = u.getAttribute("t"), c = ((E = g(u, "v")[0]) == null ? void 0 : E.textContent) ?? "";
+        let f;
+        p === "s" ? f = T[Number(c)] ?? "" : p === "inlineStr" ? f = v(u) : p === "b" ? f = c === "1" ? "TRUE" : c === "0" ? "FALSE" : c : p === "str" || p === "e" || !c ? f = c : y.has(Number(u.getAttribute("s") ?? -1)) && Number.isFinite(Number(c)) ? f = L(Number(c)) : C.has(Number(u.getAttribute("s") ?? -1)) && Number.isFinite(Number(c)) ? f = `${Number((Number(c) * 100).toPrecision(12))}%` : f = c, F[k] = f;
+      }
+      h[D - 1] = Array.from(F, (u) => u ?? "");
+    }
+    const i = Array.from(h, (r) => r ?? []);
+    for (; i.length && i[i.length - 1].every((r) => !r); ) i.pop();
+    for (const r of i) for (; r.length && !r[r.length - 1]; ) r.pop();
+    x.push({ name: a, hidden: (s.getAttribute("state") ?? "visible") !== "visible", rows: i });
+  }
+  return x;
+}
+const P = (e) => /[",\n\r]/.test(e) ? `"${e.replace(/"/g, '""')}"` : e;
+function H(e) {
+  return e.map((t) => {
+    const n = `## 工作表：${t.name}${t.hidden ? "（隐藏）" : ""}（${t.rows.length} 行）`;
+    return t.rows.length ? `${n}
+${t.rows.map((o) => o.map(P).join(",")).join(`
+`)}` : `${n}
+（空）`;
+  }).join(`
+
+`);
+}
+export {
+  _ as columnIndex,
+  L as excelDate,
+  R as readXlsx,
+  H as sheetsToText
+};

package/dist/cli-ui.js

@@ -1,4 +1,4 @@
-import { C as a, b as i, d as r, e as t, f as o, h as C, i as l, j as n, k as m, m as d, l as u, n as w, o as B, p as f } from "./cli-ui-embed-CXdmrwo1.js";
+import { C as a, b as i, d as r, e as t, f as o, h as C, i as l, j as n, k as m, m as d, l as u, n as w, o as B, p as f } from "./cli-ui-embed-Dk2QGHxn.js";
 export {
   a as CliBoard,
   i as CliBrowserView,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spzxg/cli-ui",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "type": "module",
   "description": "任务中心（cli-task-center）对话任务的前端积木：cli-msglist 消息对话列表、cli-chat 对话，数据全部来自 center 服务。",
   "main": "src/index.ts",
@@ -44,6 +44,7 @@
     "vitest": "^2.1.8"
   },
   "dependencies": {
+    "jszip": "^3.10.2",
     "mammoth": "^1.13.0",
     "react-markdown": "^10.1.0",
     "rehype-highlight": "^7.0.2",

package/src/board/CliBoard.tsx

@@ -264,9 +264,9 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, defaultTab, re
   useEffect(() => {
     if (!jobId || !autoView) return;
     store.setViewing(jobId, viewingPath
-      ? { id: `file:${viewingPath}`, kind: "file", label: viewingPath.split("/").pop() || viewingPath, text: `当前在看板里打开的文件 ${viewingPath}` }
+      ? { id: `file:${viewingPath}`, kind: "file", label: viewingPath.split("/").pop() || viewingPath, text: `用户当前在看板里打开着工作区文件 ${viewingPath}` }
       : viewingPage
-        ? { id: "browser:page", kind: "browser", label: viewingPage.title || viewingPage.url, text: `当前在看板里看的任务浏览器页面：${viewingPage.title ? `${viewingPage.title} — ` : ""}${viewingPage.url}` }
+        ? { id: "browser:page", kind: "browser", label: viewingPage.title || viewingPage.url, text: `用户当前在看板里看着任务浏览器页面：${viewingPage.title ? `${viewingPage.title} — ` : ""}${viewingPage.url}` }
         : null, owner);
   }, [store, jobId, autoView, viewingPath, viewingPage?.url, viewingPage?.title, owner]); // eslint-disable-line react-hooks/exhaustive-deps
   useEffect(() => () => { if (jobId) store.setViewing(jobId, null, owner); }, [store, jobId, owner]);

package/src/board/FileViewer.tsx

@@ -6,14 +6,17 @@
 //     流式加载、支持断点，不把文件读进浏览器内存。中枢太旧发不了短期链接时才先 fetch 成 blob，这时超大的文件不预览、只给下载。
 //   · 文本只读开头 512 KB（Range），超过的可以切到「看末尾」（日志）；GBK 导出的文件按 GB18030 解。
 //   · 文件在变（任务还在写）：看板递增 version 时重读；读的时候保留滚动位置，原本在最底下的继续贴着底（像 tail -f）。
-import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, type ReactNode } from "react";
+import { Fragment, memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, type ReactNode, type RefObject } from "react";
 import { fileUrlFromBase, type BoardBackend } from "../core/client.js";
 import { Icon } from "../ui/icons.js";
 import { Markdown } from "../ui/Markdown.js";
 import { FileLinkContext, FileOpenContext } from "../ui/fileLinks.js";
-import { codeLang, fmtSize, parseCsv, previewKind, resolveRelative, type PreviewKind } from "./fileKind.js";
+import { codeLang, fmtSize, parseCsv, previewKind, resolveRelative, splitMarkdown, type PreviewKind } from "./fileKind.js";
+import { loadText, refreshText, type LoadedText } from "./textLoad.js";
+import { decodeText } from "../core/textDecode.js";
 import { relTime } from "../ui/format.js";
 import { downloadFile, mimeOf } from "./fileOps.js";
+import { bridgeDoc, frameToken, type FrameSelMessage } from "./frameQuote.js";
 
 export { downloadFile };
 
@@ -26,14 +29,19 @@ export interface FileAction {
   onClick: (file: { path: string; name: string; url: string; downloadUrl: string }, jobId: string) => void;
 }
 
-const TEXT_MAX = 512 * 1024;
-const HIGHLIGHT_MAX = 120 * 1024;
-/** Markdown 超过这么多按纯文本显示（渲染几百 KB 的 Markdown 会让页面卡住）。 */
-const MARKDOWN_RENDER_MAX = 300 * 1024;
-/** 只能先 fetch 成 blob 时（中枢太旧）：超过这么大的不预览、不在浏览器里拼下载。 */
-const BLOB_PREVIEW_MAX = 50 * 1024 * 1024;
+// 预览能看多大（实测 Chromium：32 MB 纯文本排版约 3 秒，60 MB 的 HTML 报告约 12 秒显示出来）：
+/** 文本（代码、日志、Markdown、CSV、HTML 源文件）一次最多读这么多；更大的看开头 / 末尾。 */
+export const TEXT_MAX = 32 * 1024 * 1024;
+/** HTML 预览（能选中引用）最多读这么多进来；更大的直接按地址打开（能看，不能选中引用）。 */
+export const HTML_QUOTE_MAX = 100 * 1024 * 1024;
+/** 代码高亮到这么大（约 1 MB/秒）；更大的按纯文本显示（照样能选中引用）。 */
+const HIGHLIGHT_MAX = 512 * 1024;
+/** 大 Markdown 分段渲染，每段这么多字（渲染耗时随长度超线性增长：300 KB 约 0.7 秒，3 MB 一次渲染要 30 秒）。 */
+const MARKDOWN_SECTION = 128 * 1024;
+/** 只能先 fetch 成 blob 时（中枢太旧）：超过这么大的图片 / PDF 不预览、不在浏览器里拼下载。 */
+const BLOB_PREVIEW_MAX = 100 * 1024 * 1024;
 /** Word 在浏览器里转换，太大的只给下载。 */
-const DOCX_PREVIEW_MAX = 30 * 1024 * 1024;
+const DOCX_PREVIEW_MAX = 50 * 1024 * 1024;
 /** 短期链接 30 分钟有效：每 5 分钟问一次（客户端缓存着，快到期才真的换），长时间开着的预览不会失效。 */
 const LINK_RECHECK_MS = 5 * 60_000;
 
@@ -97,7 +105,7 @@ function useFileSrc(backend: BoardBackend, jobId: string, path: string, enabled:
 }
 
 type Loaded =
-  | { kind: "text"; text: string; truncated: boolean; size: number; tail: boolean; encoding?: string }
+  | ({ kind: "text" } & LoadedText)
   | { kind: "docx"; html: string }
   | { kind: "none" };
 
@@ -118,7 +126,7 @@ export interface FileViewerProps {
   actions?: FileAction[];
   /** 隐藏头部（宿主自己做）。 */
   bare?: boolean;
-  /** 给了就支持「选中文字 → 引用到对话」：在预览里选中一段文字时浮出按钮（Markdown / 代码 / 文本 / 表格）。 */
+  /** 给了就支持「选中文字 → 引用到对话」：在预览里选中一段文字时浮出按钮（Markdown / 代码 / 文本 / 表格 / HTML / Word，及各自的源文件）。 */
   onQuoteText?: (text: string) => void;
 }
 
@@ -149,23 +157,79 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
     return () => { window.removeEventListener("keydown", onKey); document.body.style.overflow = prev; };
   }, [big]);
   const needsSrc = kind === "image" || kind === "pdf" || kind === "html";
+  // 这个预览的口令：iframe 里的选区桥报上来的消息只认它（见 frameQuote.ts）。
+  const token = useMemo(frameToken, []);
   const links = useFileLinks(backend, jobId);
   const knownSize = size ?? (loaded?.kind === "text" ? loaded.size : undefined);
-  const src = useFileSrc(backend, jobId, path, needsSrc, version, knownSize, links, attempt);
+  // 读大文件时的进度（已收到的字节数）。
+  const [progress, setProgress] = useState(0);
+  // HTML 要能选中引用：整个读进来（最多 HTML_QUOTE_MAX）、插上选区桥，用 srcdoc 显示（见 frameQuote.ts）。
+  // 更大的、读失败的退回原来的 src 方式（能看，不能选中引用）。相对资源按文件地址解析；中枢太旧拿不到地址时相对资源显示不了（和以前一样）。
+  // 文件地址在读到的那一刻定下来：短期链接定时换新时不重载页面。
+  const linksRef = useRef(links);
+  linksRef.current = links;
+  const htmlTooBig = size !== undefined && size > HTML_QUOTE_MAX;
+  const htmlBridge = !!onQuoteText && kind === "html" && mode === "preview" && !links.pending && !htmlTooBig;
+  const [htmlDoc, setHtmlDoc] = useState<{ srcDoc: string } | "fallback" | "toobig" | null>(null);
+  // 走 srcdoc 时不用再按地址取（中枢太旧时那是又整个读一遍）。
+  const bridged = htmlBridge && htmlDoc !== "fallback" && htmlDoc !== "toobig";
+  const src = useFileSrc(backend, jobId, path, needsSrc && !bridged, version, knownSize, links, attempt);
+  useEffect(() => {
+    if (!htmlBridge) return;
+    const ctl = new AbortController();
+    let over = false;
+    setHtmlDoc(null);
+    setProgress(0);
+    backend.readBuffer(jobId, path, {
+      signal: ctl.signal,
+      // 大小事先不知道（从对话里打开的）：读着读着超过上限就停下，改成直接打开。
+      onBytes: (n) => { setProgress(n); if (n > HTML_QUOTE_MAX && !over) { over = true; ctl.abort(); } },
+    }).then((buffer) => {
+      if (ctl.signal.aborted) return;
+      const url = linksRef.current.url?.(path);
+      const base = url ? withVersion(new URL(url, window.location.href).href, version) : undefined;
+      setHtmlDoc({ srcDoc: bridgeDoc(decodeText(new Uint8Array(buffer)).text, { token, base }) });
+    }, () => { if (over) setHtmlDoc("toobig"); else if (!ctl.signal.aborted) setHtmlDoc("fallback"); });
+    return () => { if (!over) ctl.abort(); };
+  }, [htmlBridge, backend, jobId, path, version, attempt, token]);
 
   // 重读时保留滚动位置；原本贴着底（或在看末尾）的继续贴着底——任务在往文件里写时像 tail -f。
   const bodyRef = useRef<HTMLDivElement | null>(null);
+  const loadedRef = useRef(loaded);
+  loadedRef.current = loaded;
+  const textKey = useRef("");
   const rootRef = useRef<HTMLDivElement | null>(null);
   const stick = useRef(false);
   // 选中文字 → 浮出「引用到对话」。按钮放在选区上方；滚动、点别处、选区清空时收起。
-  const [sel, setSel] = useState<{ text: string; x: number; y: number } | null>(null);
+  // frame = 选区在 HTML / Word 预览的 iframe 里（由插进去的小脚本报上来，见 frameQuote.ts）。
+  const [sel, setSel] = useState<{ text: string; x: number; y: number; frame?: boolean } | null>(null);
+  const frameRef = useRef<HTMLIFrameElement | null>(null);
+  useEffect(() => {
+    if (!onQuoteText) return;
+    const onMessage = (e: MessageEvent) => {
+      const frame = frameRef.current;
+      const root = rootRef.current;
+      const data = e.data as FrameSelMessage | null;
+      if (!frame || !root || e.source !== frame.contentWindow || !data || data.cliUiSel !== token) return;
+      const text = data.scroll ? "" : (data.text ?? "").trim();
+      if (!text) { setSel((cur) => (cur?.frame ? null : cur)); return; }
+      const box = root.getBoundingClientRect();
+      const fr = frame.getBoundingClientRect();
+      const r = data.rect ?? { left: fr.width / 2, top: 48, width: 0 };
+      setSel({ text, frame: true, x: Math.min(Math.max(8, fr.left - box.left + r.left + r.width / 2), box.width - 8), y: Math.max(40, fr.top - box.top + r.top) });
+    };
+    window.addEventListener("message", onMessage);
+    return () => window.removeEventListener("message", onMessage);
+  }, [onQuoteText, token]);
   useEffect(() => {
     if (!onQuoteText) return;
     const read = () => {
       const s = window.getSelection();
       const body = bodyRef.current;
       const root = rootRef.current;
-      if (!s || s.isCollapsed || !s.rangeCount || !body || !root || !body.contains(s.anchorNode) || !body.contains(s.focusNode)) { setSel(null); return; }
+      // 宿主页面上没有选区：iframe 里的选区（另一个文档）不在这里，交给上面的消息处理，不清掉。
+      if (!s || s.isCollapsed || !s.rangeCount) { setSel((cur) => (cur?.frame ? cur : null)); return; }
+      if (!body || !root || !body.contains(s.anchorNode) || !body.contains(s.focusNode)) { setSel(null); return; }
       const text = s.toString().trim();
       if (!text) { setSel(null); return; }
       const box = root.getBoundingClientRect();
@@ -175,14 +239,18 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
       setSel({ text, x: Math.min(Math.max(8, r.left - box.left + r.width / 2), box.width - 8), y: Math.max(40, r.top - box.top) });
     };
     const onUp = () => setTimeout(read, 0);
-    const onChange = () => { const s = window.getSelection(); if (!s || s.isCollapsed) setSel(null); };
+    const onChange = () => { const s = window.getSelection(); if (!s || s.isCollapsed) setSel((cur) => (cur?.frame ? cur : null)); };
     const body = bodyRef.current;
     document.addEventListener("mouseup", onUp);
     document.addEventListener("keyup", onUp);
     document.addEventListener("selectionchange", onChange);
     const onScroll = () => setSel(null);
+    // 选区在 iframe 里时，点宿主页面别处（不是这个按钮）就收起。
+    const onDown = (e: MouseEvent) => { if (!(e.target instanceof Element && e.target.closest(".cli-fv-selq"))) setSel((cur) => (cur?.frame ? null : cur)); };
     body?.addEventListener("scroll", onScroll, { passive: true });
+    document.addEventListener("mousedown", onDown);
     return () => {
+      document.removeEventListener("mousedown", onDown);
       document.removeEventListener("mouseup", onUp);
       document.removeEventListener("keyup", onUp);
       document.removeEventListener("selectionchange", onChange);
@@ -193,7 +261,8 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
     if (!sel || !onQuoteText) return;
     const text = sel.text.length > QUOTE_SELECTION_MAX ? `${sel.text.slice(0, QUOTE_SELECTION_MAX)}…` : sel.text;
     onQuoteText(text);
-    window.getSelection()?.removeAllRanges();
+    if (sel.frame) frameRef.current?.contentWindow?.postMessage({ cliUiClear: token }, "*");
+    else window.getSelection()?.removeAllRanges();
     setSel(null);
   };
   useEffect(() => {
@@ -202,7 +271,8 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
     if (needsSrc || kind === "binary") { setLoaded({ kind: "none" }); return; }
     if (kind === "docx") {
       if (size !== undefined && size > DOCX_PREVIEW_MAX) { setError(`文件较大（${fmtSize(size)}），请下载后查看`); return; }
-      backend.readBuffer(jobId, path).then(async (buffer) => {
+      setProgress(0);
+      backend.readBuffer(jobId, path, { onBytes: (n) => { if (alive) setProgress(n); } }).then(async (buffer) => {
         const mammoth = await import("mammoth");
         const convert = (mammoth as unknown as { convertToHtml: typeof import("mammoth").convertToHtml }).convertToHtml
           ?? (mammoth as unknown as { default: typeof import("mammoth") }).default.convertToHtml;
@@ -213,12 +283,18 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
         if (alive) setLoaded({ kind: "docx", html: out.value });
       }).catch((e: unknown) => { if (alive) setError(e instanceof Error ? e.message : String(e)); });
     } else {
-      backend.readText(jobId, path, TEXT_MAX, { tail }).then(
+      // 只是文件变了（同一个文件、同样看开头 / 末尾）：能接上就只取新增的部分（见 textLoad.ts），接不上再整个重读。
+      const key = `${path}|${tail}|${attempt}`;
+      const prev = loadedRef.current?.kind === "text" && textKey.current === key ? loadedRef.current : null;
+      textKey.current = key;
+      if (!prev) setProgress(0);
+      const full = () => loadText(backend, jobId, path, { max: TEXT_MAX, tail, onBytes: (n) => { if (alive && !prev) setProgress(n); } });
+      (prev ? refreshText(backend, jobId, path, prev, TEXT_MAX).then((r) => r ?? full(), full) : full()).then(
         (r) => {
           if (!alive) return;
           const box = bodyRef.current;
           stick.current = tail || (!!box && box.scrollHeight > box.clientHeight && box.scrollHeight - box.scrollTop - box.clientHeight < 40);
-          setLoaded({ kind: "text", text: r.text, truncated: r.truncated, size: r.size, tail: !!r.tail, encoding: r.encoding });
+          setLoaded({ kind: "text", ...r });
         },
         (e: unknown) => { if (alive) setError(e instanceof Error ? e.message : String(e)); },
       );
@@ -251,11 +327,13 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
   const canSource = kind === "markdown" || kind === "html" || kind === "csv";
   const shownSize = knownSize;
   const text = loaded?.kind === "text" ? loaded : null;
-  // 太大的 Markdown 按纯文本显示（渲染会卡住页面）。
-  const mdTooBig = !!text && kind === "markdown" && text.text.length > MARKDOWN_RENDER_MAX;
-  const loading = !error && !src.error && (needsSrc ? !src.url : !loaded);
+  const loading = !error && !src.error && (needsSrc ? (bridged ? htmlDoc === null : !src.url) : !loaded);
   const slow = useSlow(loading);
-  const slowNote = slow ? <div className="cli-fv-slow">网络较慢或执行节点忙，仍在读取{shownSize ? `（${fmtSize(shownSize)}）` : ""}…</div> : null;
+  // 大文件显示读到哪了；很久没读完提示网络慢。
+  const progressText = progress > 0 ? `已读取 ${fmtSize(progress)}${shownSize ? ` / ${fmtSize(shownSize)}` : ""}` : "";
+  const slowNote = progressText || slow
+    ? <div className="cli-fv-slow">{slow ? `网络较慢或执行节点忙，仍在读取${progressText ? `（${progressText}）` : shownSize ? `（${fmtSize(shownSize)}）` : ""}…` : progressText}</div>
+    : null;
 
   return (
     <>
@@ -303,16 +381,25 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
             <button className="btn btn-accent btn-sm" style={{ marginLeft: 8 }} onClick={() => void download()} disabled={busy}>{Icon.download()} 下载</button>
           </div>
         ) : needsSrc ? (
-          !src.url ? <div className="cli-fv-note">加载中…{slowNote}</div>
+          bridged && htmlDoc === null ? <div className="cli-fv-note">加载中…{slowNote}</div>
+          // 可以选中引用：srcdoc + 选区桥。沙箱同样不给同源，页面自己的脚本被插入的 CSP 挡住，只有桥脚本能跑。
+          : bridged && htmlDoc ? <iframe ref={frameRef} className="cli-fv-frame" srcDoc={htmlDoc.srcDoc} title={name} sandbox="allow-scripts allow-popups allow-forms allow-modals" />
+          : !src.url ? <div className="cli-fv-note">加载中…{slowNote}</div>
             : kind === "image" ? <ImageView key={src.url} src={src.url} name={name} onRetry={retry} />
               : kind === "pdf" ? <iframe className="cli-fv-frame" src={src.url} title={name} />
                 : mode === "source" ? <SourceView backend={backend} jobId={jobId} path={path} version={version} />
                   // HTML：节点按沙箱 CSP 返回；这里再加 iframe 沙箱（不给同源），页面脚本碰不到宿主。
-                  : <iframe className="cli-fv-frame" src={src.url} title={name} sandbox="allow-scripts allow-popups allow-forms allow-modals" />
+                  : <>
+                        {onQuoteText && (htmlTooBig || htmlDoc === "toobig") && <div className="cli-fv-trunc">文件超过 {fmtSize(HTML_QUOTE_MAX)}，直接打开显示，不能选中文字引用（可以用「引用到对话」引用整个文件）。</div>}
+                        <iframe className="cli-fv-frame" src={src.url} title={name} sandbox="allow-scripts allow-popups allow-forms allow-modals" />
+                      </>
         ) : !loaded ? (
           <div className="cli-fv-note">加载中…{slowNote}</div>
         ) : loaded.kind === "docx" ? (
-          <iframe className="cli-fv-frame doc" title={name} sandbox="" srcDoc={docxPage(loaded.html)} />
+          // Word：转出来的 HTML 放进沙箱。能选中引用时插上选区桥（只放行桥脚本，文档里不会有别的脚本能跑）。
+          onQuoteText
+            ? <iframe ref={frameRef} className="cli-fv-frame doc" title={name} sandbox="allow-scripts" srcDoc={bridgeDoc(docxPage(loaded.html), { token })} />
+            : <iframe className="cli-fv-frame doc" title={name} sandbox="" srcDoc={docxPage(loaded.html)} />
         ) : text ? (
           <>
             {(text.truncated || tail) && (
@@ -322,11 +409,10 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
                 <button className="cli-fv-btn" onClick={() => setTail(!tail)}>{tail ? "看开头" : "看末尾"}</button>
               </div>
             )}
-            {mdTooBig && <div className="cli-fv-trunc">Markdown 较大，按纯文本显示。</div>}
-            {kind === "markdown" && mode === "preview" && !mdTooBig ? (
+            {kind === "markdown" && mode === "preview" ? (
               <FileLinkContext.Provider value={mdResolve}>
                 <FileOpenContext.Provider value={mdOpen}>
-                  <div className="cli-fv-md"><Markdown>{text.text}</Markdown></div>
+                  <div className="cli-fv-md"><MarkdownSections text={text.text} scrollRef={bodyRef} /></div>
                 </FileOpenContext.Provider>
               </FileLinkContext.Provider>
             ) : kind === "csv" && mode === "preview" ? (
@@ -334,7 +420,8 @@ export function FileViewer({ backend, jobId, path, size, mtime, version = 0, onO
             ) : kind === "code" && text.text.length <= HIGHLIGHT_MAX ? (
               <div className="cli-fv-code"><Markdown>{fenced(text.text, codeLang(path))}</Markdown></div>
             ) : (
-              <pre className="cli-fv-pre">{text.text}</pre>
+              // 追加的内容各是一个文字节点：文件往后长的时候前面的不用重新排版。
+              <pre className="cli-fv-pre">{text.parts.map((p, i) => <Fragment key={i}>{p}</Fragment>)}</pre>
             )}
           </>
         ) : null}
@@ -398,17 +485,58 @@ function ImageView({ src, name, onRetry }: { src: string; name: string; onRetry?
 }
 
 function SourceView({ backend, jobId, path, version }: { backend: BoardBackend; jobId: string; path: string; version: number }) {
-  const [text, setText] = useState<string | null>(null);
+  const [state, setState] = useState<{ text: string; size?: number; truncated?: boolean } | null>(null);
   useEffect(() => {
     let alive = true;
-    backend.readText(jobId, path, TEXT_MAX).then((r) => { if (alive) setText(r.text); }, (e: unknown) => { if (alive) setText(`读取失败：${e instanceof Error ? e.message : String(e)}`); });
+    backend.readText(jobId, path, TEXT_MAX).then((r) => { if (alive) setState({ text: r.text, size: r.size, truncated: r.truncated }); }, (e: unknown) => { if (alive) setState({ text: `读取失败：${e instanceof Error ? e.message : String(e)}` }); });
     return () => { alive = false; };
   }, [backend, jobId, path, version]);
-  return text === null ? <div className="cli-fv-note">加载中…</div> : <pre className="cli-fv-pre">{text}</pre>;
+  if (!state) return <div className="cli-fv-note">加载中…</div>;
+  return (
+    <>
+      {state.truncated && <div className="cli-fv-trunc">文件较大（{fmtSize(state.size ?? 0)}），源文件只显示前 {fmtSize(TEXT_MAX)}；完整内容请下载。</div>}
+      <pre className="cli-fv-pre">{state.text}</pre>
+    </>
+  );
 }
 
+/** 一段 Markdown：内容没变就不重新渲染（文件追加时只有最后一段在变）。 */
+const MarkdownSection = memo(function MarkdownSection({ text }: { text: string }) {
+  return <Markdown>{text}</Markdown>;
+});
+
+/**
+ * 大 Markdown 分段渲染：先渲染前几段，滚到快看完的地方再接着渲染后面的（每段约 MARKDOWN_SECTION 字）。
+ * 小文件就是一段，和整篇渲染一样。没有 IntersectionObserver 的环境（老浏览器、服务端）一次全部渲染。
+ */
+function MarkdownSections({ text, scrollRef }: { text: string; scrollRef: RefObject<HTMLDivElement | null> }) {
+  const sections = useMemo(() => splitMarkdown(text, MARKDOWN_SECTION), [text]);
+  const lazy = typeof IntersectionObserver !== "undefined";
+  const [shown, setShown] = useState(2);
+  const sentinel = useRef<HTMLDivElement | null>(null);
+  const more = shown < sections.length && lazy;
+  useEffect(() => {
+    const el = sentinel.current;
+    if (!more || !el) return;
+    const io = new IntersectionObserver((entries) => { if (entries.some((e) => e.isIntersecting)) setShown((n) => n + 2); }, { root: scrollRef.current, rootMargin: "0px 0px 2000px 0px" });
+    io.observe(el);
+    return () => io.disconnect();
+  }, [more, shown, scrollRef]);
+  const visible = lazy ? sections.slice(0, shown) : sections;
+  return (
+    <>
+      {visible.map((s, i) => <MarkdownSection key={i} text={s} />)}
+      {more && <div ref={sentinel} className="cli-fv-slow">还有 {sections.length - shown} 段，继续往下滚动显示…</div>}
+    </>
+  );
+}
+
+/** 表格先显示这么多行，「再显示」每次多这么多（几十万行一次画出来页面会卡住）。 */
+const CSV_PAGE = 2_000;
+
 function CsvTable({ text }: { text: string }) {
-  const { rows, more } = useMemo(() => parseCsv(text), [text]);
+  const [limit, setLimit] = useState(CSV_PAGE);
+  const { rows, more } = useMemo(() => parseCsv(text, limit + 1), [text, limit]);
   if (!rows.length) return <div className="cli-fv-note">空文件。</div>;
   const [head, ...body] = rows;
   return (
@@ -417,7 +545,12 @@ function CsvTable({ text }: { text: string }) {
         <thead><tr>{head.map((c, i) => <th key={i}>{c}</th>)}</tr></thead>
         <tbody>{body.map((r, i) => <tr key={i}>{r.map((c, j) => <td key={j}>{c}</td>)}</tr>)}</tbody>
       </table>
-      {more && <div className="cli-fv-trunc">只显示前 500 行；完整内容请下载。</div>}
+      {more && (
+        <div className="cli-fv-trunc">已显示前 {body.length.toLocaleString()} 行。
+          <button className="cli-fv-btn" onClick={() => setLimit((n) => n + CSV_PAGE * 5)}>再显示 {(CSV_PAGE * 5).toLocaleString()} 行</button>
+          （也可以切到「源文件」看全部文字）
+        </div>
+      )}
     </div>
   );
 }

package/src/board/fileKind.ts

@@ -79,3 +79,34 @@ export function parseCsv(text: string, maxRows = 500): { rows: string[][]; more:
   if (cell || row.length) { row.push(cell); rows.push(row); }
   return { rows: rows.slice(0, maxRows), more: rows.length > maxRows };
 }
+
+/**
+ * 大 Markdown 分段（每段约 size 字）：在代码块外的空行处切，各段单独渲染（整篇几 MB 一次渲染会卡住页面几十秒）。
+ * 一直没有空行的超长内容到 4 倍大小也切（在代码块里切时补上收尾、下一段重新开头）。
+ */
+export function splitMarkdown(text: string, size: number): string[] {
+  if (text.length <= size) return [text];
+  const out: string[] = [];
+  const lines = text.split("\n");
+  let cur: string[] = [];
+  let len = 0;
+  let fence: string | null = null;
+  for (const line of lines) {
+    const m = /^ {0,3}(`{3,}|~{3,})/.exec(line);
+    if (m) {
+      if (!fence) fence = line.trim();
+      else if (line.trim().startsWith(fence.slice(0, 3)) && line.trim().replace(/[`~]/g, "") === "") fence = null;
+    }
+    cur.push(line);
+    len += line.length + 1;
+    const atBreak = !fence && line.trim() === "" && len >= size;
+    if (atBreak || len >= size * 4) {
+      if (fence) cur.push(fence.replace(/[^`~].*$/, ""));
+      out.push(cur.join("\n"));
+      cur = fence ? [fence] : [];
+      len = 0;
+    }
+  }
+  if (cur.length && cur.some((l) => l !== "")) out.push(cur.join("\n"));
+  return out;
+}

package/src/board/frameQuote.ts

@@ -0,0 +1,50 @@
+// HTML / Word 预览里「选中文字 → 引用到对话」。
+//
+// 这两种预览放在沙箱 iframe 里（不给同源，页面碰不到宿主），宿主反过来也读不到 iframe 里的选区。
+// 所以预览改成 srcdoc：在文档最前面插一段小脚本，选区变了用 postMessage 报给宿主（带口令，宿主只认自己这个 iframe）。
+//   · 页面自己的脚本照旧不让跑（和执行节点返回 HTML 时的 CSP 一致）：插入的 CSP 只放行带 nonce 的这一段；
+//   · 相对路径的样式 / 图片按文件原地址解析（<base>），文档里的 #锚点 在页内滚动（不然会按 <base> 整页跳走）。
+
+/** iframe → 宿主：选区（text 为空 = 取消了选择）或滚动了（收起按钮）。 */
+export interface FrameSelMessage { cliUiSel: string; text?: string; rect?: { left: number; top: number; width: number } | null; scroll?: boolean }
+
+const randomId = () => Math.random().toString(36).slice(2, 12) + Math.random().toString(36).slice(2, 12);
+
+/** 每个预览一个口令 / nonce。 */
+export const frameToken = randomId;
+
+function bridgeScript(token: string) {
+  const t = JSON.stringify(token);
+  return `(function(){var t=${t};function post(m){m.cliUiSel=t;try{parent.postMessage(m,"*")}catch(e){}}
+function send(){var s=getSelection(),text=s&&!s.isCollapsed?String(s).trim():"",rect=null;
+if(text&&s.rangeCount){var b=s.getRangeAt(0).getBoundingClientRect();rect={left:b.left,top:b.top,width:b.width}}post({text:text,rect:rect})}
+function later(){setTimeout(send,0)}
+document.addEventListener("mouseup",later);document.addEventListener("keyup",later);
+document.addEventListener("selectionchange",function(){var s=getSelection();if(!s||s.isCollapsed)post({text:""})});
+addEventListener("scroll",function(){post({scroll:true})},true);
+addEventListener("message",function(e){if(e.source===parent&&e.data&&e.data.cliUiClear===t){var s=getSelection();s&&s.removeAllRanges()}});
+document.addEventListener("click",function(e){var a=e.target&&e.target.closest&&e.target.closest('a[href^="#"]');if(!a)return;e.preventDefault();
+var id=decodeURIComponent(a.getAttribute("href").slice(1)),el=id?document.getElementById(id)||document.getElementsByName(id)[0]:document.body;el&&el.scrollIntoView()});})();`;
+}
+
+const escAttr = (s: string) => s.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;");
+
+/**
+ * 给 HTML 文档插上选区桥：CSP（页面脚本不跑、只能从文件所在地址取资源）、<base>、桥脚本。
+ * base = 文件的绝对地址（相对资源按它解析）；不给（Word 转出来的，图片都内嵌）时只允许 data: 资源。
+ */
+export function bridgeDoc(html: string, opts: { token: string; base?: string }) {
+  let origin = "";
+  if (opts.base) { try { origin = new URL(opts.base).origin; } catch { origin = ""; } }
+  const src = origin ? `${origin} ` : "";
+  const csp = `default-src 'none'; script-src 'nonce-${opts.token}'; img-src ${src}data: blob:; style-src ${src}'unsafe-inline'; font-src ${src}data:; media-src ${src}data: blob:`;
+  const head = `<meta http-equiv="Content-Security-Policy" content="${escAttr(csp)}">`
+    + (opts.base ? `<base href="${escAttr(opts.base)}">` : "")
+    + `<script nonce="${opts.token}">${bridgeScript(opts.token)}</script>`;
+  // 插在 <head> 里最前面；没有 <head> 就插在 doctype 后面（解析器会自动补出 head），不放到 doctype 前面免得变成怪异模式。
+  const headTag = /<head(\s[^>]*)?>/i.exec(html);
+  if (headTag) { const at = headTag.index + headTag[0].length; return html.slice(0, at) + head + html.slice(at); }
+  const doctype = /^\s*<!doctype[^>]*>/i.exec(html);
+  if (doctype) return doctype[0] + head + html.slice(doctype[0].length);
+  return head + html;
+}