@spacecorexdev/core 0.0.4 → 0.0.5

package/src/ui/UIFilePreview/filetypes/wordExportPdf.tsx

@@ -0,0 +1,427 @@
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import { FileViewer } from '@file-viewer/react';
+import { wordRenderer } from '@file-viewer/renderer-word';
+import { withPolyfillWorkerBootstrap } from '../../../utils/workerBootstrap';
+
+/**
+ * Word（docx/doc）导出 PDF：离屏挂载 file-viewer 分页渲染 → SVG foreignObject 逐页
+ * 光栅化 → jsPDF 直接下载（不经过浏览器打印对话框）。
+ *
+ * 为什么用 foreignObject 而不是 html2canvas：
+ * html2canvas 自行重算行盒堆叠，当文档使用「固定行距 < 字体自然高度」时，相邻行
+ * 文字会被叠压（浏览器是 overflow visible 完整绘制，紧贴但不重叠）；且对
+ * border-collapse 表格边框绘制有硬伤。foreignObject 把 DOM 交还给浏览器自身渲染，
+ * 行距、两端对齐、加粗、表格边框均与屏幕预览像素级一致，从根本上消除这类差异。
+ *
+ * 关键点：
+ * 1. docx.visualPagination:true 让渲染器按 Word 原生分页产出独立 .docx-page-frame，
+ *    每个 frame 内一个固定尺寸的 section.docx（inline width/height 以 pt 写明纸张），
+ *    一 frame 对应 PDF 一页；
+ * 2. 分页视图中 section 为 absolute + translateX(-50%) scale(k)，光栅化前先重置为
+ *    静态布局，确保量到纸张原始 CSS 像素尺寸；
+ * 3. 把当前文档样式表整体收进 SVG（DOM 保留 class），比逐元素内联计算样式的 SVG
+ *    小得多，且伪元素 / CSS 变量 / 字体栈更完整；
+ * 4. data URL SVG 出于安全限制无法加载其中的 blob: 图片，序列化前统一把 <img>
+ *    转成 data: URL 内联。
+ */
+
+const DOCX_MIME_TYPE = 'application/vnd.openxmlformats-officedocument.wordprocessingml.document';
+/** 光栅化倍率：文字在 PDF 中仍清晰，单页 canvas 约 2448×3168，低于浏览器尺寸上限 */
+const SCALE = 3;
+/** 分页渲染最长等待时间（ms） */
+const RENDER_TIMEOUT = 90000;
+
+export interface ExportWordPdfOptions {
+  /** docx/doc 文件（编辑器侧应传入含最新修改的 save() 产物） */
+  file: Blob;
+  /** 文件名（.docx/.doc 后缀会被替换为 .pdf） */
+  fileName: string;
+  /** 逐页进度回调（当前页 / 总页数） */
+  onProgress?: (page: number, total: number) => void;
+}
+
+/** Word 预览页使用的 FileViewer 配置（连续滚动视图、隐藏内置工具栏） */
+export const buildWordViewerOptions = () => ({
+  locale: 'zh-CN' as const,
+  rendererMode: 'replace' as const,
+  styleIsolation: 'none' as const,
+  // FileViewer 的 renderers 类型与各 renderer 包的独立版本类型不完全对齐，原预览页同样用 as any
+  renderers: [wordRenderer] as any,
+  theme: 'light' as const,
+  toolbar: {
+    position: 'bottom-right' as const,
+    download: false,
+    print: false,
+    exportHtml: false,
+  },
+  docx: {
+    // ?v= 用于 worker 补丁更新后强制浏览器重新拉取（importScripts 走 HTTP 缓存）
+    // docgrid5：docGrid 行距 + 制表位页码 + 分页边界 + 页眉页脚锚定
+    //           + 浮动对象 align 定位 + 文本框 spAutoFit 自适应
+    workerUrl: withPolyfillWorkerBootstrap('/vendor/docx/docx.worker.js?v=docgrid5'),
+    workerJsZipUrl: '/vendor/docx/jszip.min.js',
+    // 在线预览与导出 PDF 统一使用 Word 原生分页（一 frame 一页）
+    visualPagination: true,
+  },
+});
+
+/** 导出 PDF 使用的配置：与预览一致，均为分页视图（一 frame 一页） */
+const buildWordPdfViewerOptions = () => buildWordViewerOptions();
+
+/** 分页视图里 section 是 absolute + translateX(-50%) scale(k)，重置为无偏移无缩放布局。
+ * 注意必须用 relative 而非 static：页眉/页脚是 position:absolute（见 worker 补丁），
+ * 其包含块是最近定位祖先；section 变 static 后包含块会跳到外层宿主（宽度不同），
+ * 导致内联计算样式时 left/right/百分比全部按错误宽度解析，克隆光栅化后页脚偏移。 */
+const resetSectionLayout = (sec: HTMLElement) => {
+  sec.style.setProperty('position', 'relative', 'important');
+  sec.style.setProperty('left', 'auto', 'important');
+  sec.style.setProperty('top', 'auto', 'important');
+  sec.style.setProperty('transform', 'none', 'important');
+  sec.style.setProperty('margin', '0', 'important');
+  sec.style.setProperty('box-shadow', 'none', 'important');
+  sec.style.setProperty('outline', 'none', 'important');
+};
+
+/** 把 clone 内的 blob:/远程 <img> 统一转成 data: URL（SVG data URL 内无法加载它们） */
+const inlineCloneImages = async (root: HTMLElement): Promise<void> => {
+  await Promise.all(
+    Array.from(root.querySelectorAll('img')).map(async (img) => {
+      const src = img.getAttribute('src') || '';
+      if (!src || src.startsWith('data:')) return;
+      try {
+        const blob = await fetch(src).then((r) => r.blob());
+        const dataUrl = await new Promise<string>((resolve, reject) => {
+          const fr = new FileReader();
+          fr.onload = () => resolve(fr.result as string);
+          fr.onerror = reject;
+          fr.readAsDataURL(blob);
+        });
+        img.setAttribute('src', dataUrl);
+      } catch {
+        // 单张图片失败不阻断整体导出
+      }
+    }),
+  );
+};
+
+const CSS_URL_RE = /url\(\s*(['"]?)([^'")]+)\1\s*\)/g;
+
+/** 不内联的计算样式：动画/过渡（光栅化瞬间不应运行） */
+const SKIP_PROP_RE = /^(animation|transition)(-|$)/;
+
+const readAllCss = (cs: CSSStyleDeclaration, skip?: string): string => {
+  let css = '';
+  for (let i = 0; i < cs.length; i++) {
+    const prop = cs[i];
+    if (prop === skip || SKIP_PROP_RE.test(prop)) continue;
+    const val = cs.getPropertyValue(prop);
+    if (val) css += `${prop}:${val};`;
+  }
+  return css;
+};
+
+/** 把 blob:/http(s):/相对路径 的 CSS url() 引用统一内联为 data URL（SVG 作为 <img> 加载时禁止外链） */
+const inlineCssUrls = async (cssTexts: string[]): Promise<Map<string, string>> => {
+  const urls = new Set<string>();
+  cssTexts.forEach((text) => {
+    let m: RegExpExecArray | null;
+    CSS_URL_RE.lastIndex = 0;
+    while ((m = CSS_URL_RE.exec(text))) {
+      const u = m[2];
+      if (u && !u.startsWith('data:')) urls.add(u);
+    }
+  });
+  const map = new Map<string, string>();
+  await Promise.all(
+    Array.from(urls).map(async (u) => {
+      try {
+        const blob = await fetch(u).then((r) => r.blob());
+        const dataUrl = await new Promise<string>((resolve, reject) => {
+          const fr = new FileReader();
+          fr.onload = () => resolve(fr.result as string);
+          fr.onerror = reject;
+          fr.readAsDataURL(blob);
+        });
+        map.set(u, dataUrl);
+      } catch {
+        // 单个资源失败不阻断（保留原引用时仅该背景缺失）
+      }
+    }),
+  );
+  return map;
+};
+
+const replaceCssUrls = (cssText: string, map: Map<string, string>): string =>
+  cssText.replace(CSS_URL_RE, (full, _quote: string, u: string) => {
+    const dataUrl = map.get(u);
+    return dataUrl ? `url("${dataUrl}")` : full;
+  });
+
+/**
+ * 把 src 子树的全部计算样式逐元素内联到 dst，并返回伪元素（列表符号/TOC 前导点
+ * 由 ::before 承载）所需的 CSS 文本。
+ *
+ * 为什么「全量内联」而非白名单：渲染器把关键布局放在样式表/内联混合处，例如
+ * section.docx 是样式表定义的 display:flex; flex-flow:column nowrap，文本框是内联
+ * flex 列布局——漏掉任何一个 flex/grid 属性，克隆到独立 SVG 后布局就会崩（实测
+ * 漏 flex-direction 时 section 退化为 row，后续流内兄弟被横向推到纸外裁切）。
+ * 全量计算样式随克隆走，与源元素渲染必然一致；同时：
+ *  - 所有 CSS url()（页面背景 blob:、列表符号等）统一转 data URL；
+ *  - CSS 自定义属性（--docx-*，含符号图片变量）也在枚举内，var() 在克隆中可解析；
+ *  - computed 值由 XMLSerializer 自动 XML 转义，无需手工处理特殊字符。
+ */
+const inlineStyles = async (src: Element, dst: Element): Promise<string> => {
+  interface Pending {
+    el: Element;
+    css: string;
+  }
+  const pending: Pending[] = [];
+  const pseudoBodies: string[] = [];
+  const pseudoRules: string[] = [];
+  let pseudoSeq = 0;
+  const win = src.ownerDocument.defaultView ?? window;
+
+  const collectPseudo = (s: Element, d: Element, which: '::before' | '::after') => {
+    const cs = win.getComputedStyle(s, which);
+    const content = cs.getPropertyValue('content');
+    if (!content || content === 'none' || content === 'normal') return;
+    const key = which.slice(2); // before / after
+    const id = `wpe-${++pseudoSeq}`;
+    d.setAttribute(`data-pseudo-${key}`, id);
+    const body = `content:${content};${readAllCss(cs, 'content')}`;
+    pseudoBodies.push(body);
+    pseudoRules.push(`[data-pseudo-${key}="${id}"]${which}{${body}}`);
+  };
+
+  const collect = (s: Element, d: Element) => {
+    pending.push({ el: d, css: readAllCss(win.getComputedStyle(s)) });
+    collectPseudo(s, d, '::before');
+    collectPseudo(s, d, '::after');
+    const sk = s.children;
+    const dk = d.children;
+    for (let i = 0; i < sk.length; i++) collect(sk[i], dk[i]);
+  };
+  collect(src, dst);
+
+  const urlMap = await inlineCssUrls([
+    ...pending.map((p) => p.css),
+    ...pseudoBodies,
+  ]);
+  pending.forEach(({ el, css }) => {
+    el.setAttribute('style', replaceCssUrls(css, urlMap));
+  });
+  return pseudoRules
+    .map((rule) => replaceCssUrls(rule, urlMap))
+    .join('\n');
+};
+
+/**
+ * 用 SVG foreignObject 把一个分页 section 光栅化为 canvas。
+ * 排版完全由浏览器完成，行距 / 两端对齐 / 加粗 / 表格边框与屏幕预览一致。
+ */
+const captureSection = async (section: HTMLElement): Promise<HTMLCanvasElement> => {
+  // 静态化原 section 以便量取纸张原始 CSS 像素尺寸（离屏宿主，不影响用户视图）
+  resetSectionLayout(section);
+  const rect = section.getBoundingClientRect();
+  const w = Math.max(1, Math.ceil(rect.width));
+  const h = Math.max(1, Math.ceil(rect.height));
+
+  const clone = section.cloneNode(true) as HTMLElement;
+  clone.setAttribute('xmlns', 'http://www.w3.org/1999/xhtml');
+  await inlineCloneImages(clone);
+  // 全量内联计算样式（基于已静态化的原 section，含 CSS 背景图与列表符号内联），根节点保持静态
+  const pseudoCss = await inlineStyles(section, clone);
+  resetSectionLayout(clone);
+
+  const xhtml = new XMLSerializer().serializeToString(clone);
+  // 伪元素规则用 CDATA 包裹（content 文本可能含特殊字符）
+  const pseudoStyle = pseudoCss ? `<style><![CDATA[${pseudoCss.replace(/\]\]>/g, ']] >')}]]></style>` : '';
+  const svg =
+    `<svg xmlns="http://www.w3.org/2000/svg" width="${w * SCALE}" height="${h * SCALE}">` +
+    `<g transform="scale(${SCALE})">` +
+    `<foreignObject x="0" y="0" width="${w}" height="${h}">` +
+    `<body xmlns="http://www.w3.org/1999/xhtml" style="margin:0;padding:0;background:#ffffff">` +
+    `${pseudoStyle}${xhtml}</body>` +
+    `</foreignObject></g></svg>`;
+
+  // 必须用 data URL 而非 Blob URL：Blob URL 加载的 SVG 会被浏览器视为跨 origin，
+  // drawImage 后污染 canvas 导致 toDataURL 抛 SecurityError；data URL 不污染。
+  const url = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;
+  const img = new Image();
+  await new Promise<void>((resolve, reject) => {
+    img.onload = () => resolve();
+    img.onerror = () => {
+      // 诊断：XML 解析错误 + 残留外链（SVG 作为 <img> 加载时禁止任何 blob:/http 外链）
+      const parts: string[] = [];
+      try {
+        const parsed = new DOMParser().parseFromString(svg, 'image/svg+xml');
+        const err = parsed.querySelector('parsererror');
+        if (err) parts.push(`XML错误: ${(err.textContent || '').slice(0, 150)}`);
+      } catch { /* 忽略诊断异常 */ }
+      const blobRefs = (svg.match(/blob:/g) || []).length;
+      const httpRefs = (svg.match(/url\(\s*['"]?https?:/g) || []).length;
+      if (blobRefs || httpRefs) parts.push(`残留外链 blob:${blobRefs} http:${httpRefs}`);
+      parts.push(`SVG大小:${(svg.length / 1024).toFixed(0)}KB`);
+      reject(new Error(`页面光栅化失败（${parts.join('；')}）`));
+    };
+    img.src = url;
+  });
+
+  const canvas = document.createElement('canvas');
+  canvas.width = w * SCALE;
+  canvas.height = h * SCALE;
+  const ctx = canvas.getContext('2d');
+  if (!ctx) throw new Error('无法创建绘图上下文');
+  ctx.fillStyle = '#ffffff';
+  ctx.fillRect(0, 0, canvas.width, canvas.height);
+  ctx.drawImage(img, 0, 0);
+  return canvas;
+};
+
+/** 等待分页渲染完成：frame 数稳定（600ms 内不再增长）且每页 section 已有尺寸 */
+const waitForPagedFrames = (host: HTMLElement): Promise<HTMLElement[]> =>
+  new Promise((resolve, reject) => {
+    const start = Date.now();
+    let lastCount = -1;
+    let stableSince = 0;
+    const timer = window.setInterval(() => {
+      const frames = Array.from(host.querySelectorAll<HTMLElement>('.docx-page-frame'));
+      const ready = frames.filter((frame) => {
+        const sec = frame.querySelector<HTMLElement>('section.docx');
+        return sec && sec.getBoundingClientRect().height > 100;
+      });
+      if (ready.length >= 1 && ready.length === lastCount) {
+        if (!stableSince) stableSince = Date.now();
+        // 页数稳定 600ms 视为渲染完成（最后一页可能稍慢）
+        if (Date.now() - stableSince >= 600) {
+          window.clearInterval(timer);
+          resolve(frames);
+        }
+      } else {
+        stableSince = 0;
+      }
+      lastCount = ready.length;
+      if (Date.now() - start > RENDER_TIMEOUT) {
+        window.clearInterval(timer);
+        reject(new Error('Word 文档渲染超时'));
+      }
+    }, 150);
+  });
+
+/** 离屏挂载分页视图，返回卸载函数 */
+const mountPagedViewer = (file: File, fileName: string): {
+  host: HTMLElement;
+  unmount: () => void;
+} => {
+  const host = document.createElement('div');
+  host.setAttribute('data-word-export-root', 'true');
+  Object.assign(host.style, {
+    position: 'fixed',
+    top: '0',
+    left: '-100000px',
+    width: '1400px',
+    background: '#ffffff',
+    pointerEvents: 'none',
+  } as Partial<CSSStyleDeclaration>);
+  document.body.appendChild(host);
+
+  const root = createRoot(host);
+  root.render(<FileViewer file={file} name={fileName} options={buildWordPdfViewerOptions()} />);
+
+  return {
+    host,
+    unmount: () => {
+      root.unmount();
+      host.remove();
+    },
+  };
+};
+
+/**
+ * 取纸张的原始尺寸（pt）。渲染器在 section inline style 上以 pt 写明 Word 纸张大小
+ * （如 612pt×792pt），不受视觉 scale(k) 影响；单位异常时退回 CSS 像素换算。
+ */
+const getSectionPaperSizePt = (section: HTMLElement): { wPt: number; hPt: number } => {
+  const parse = (value: string, rectPx: number): number => {
+    const pt = /^([\d.]+)pt$/i.exec(value);
+    if (pt) return parseFloat(pt[1]);
+    const px = /^([\d.]+)px$/i.exec(value);
+    if (px) return parseFloat(px[1]) * 0.75;
+    return rectPx * 0.75;
+  };
+  const rect = section.getBoundingClientRect();
+  return {
+    wPt: parse(section.style.width || '', rect.width),
+    hPt: parse(section.style.height || '', rect.height),
+  };
+};
+
+/**
+ * Word 文档导出 PDF（SVG foreignObject 逐页光栅化 → jsPDF 直接下载）。
+ * @returns 生成的 PDF 文件名
+ */
+export const exportWordPdf = async ({
+  file,
+  fileName,
+  onProgress,
+}: ExportWordPdfOptions): Promise<string> => {
+  const baseName = /\.(docx|docm|dotx|dotm|doc|dot)$/i.test(fileName)
+    ? fileName.replace(/\.(docx|docm|dotx|dotm|doc|dot)$/i, '')
+    : fileName;
+  const docxName = `${baseName}.docx`;
+  const pdfName = `${baseName}.pdf`;
+  const docxFile = file instanceof File ? file : new File([file], docxName, { type: DOCX_MIME_TYPE });
+
+  // jsPDF 仅在点击导出时加载（vite 会把它归入 vendor-md-pdf-export chunk）
+  const { jsPDF } = await import('jspdf');
+
+  const { host, unmount } = mountPagedViewer(docxFile, docxName);
+  try {
+    const frames = await waitForPagedFrames(host);
+    // 双 raf：等字体、图片解码与最后布局提交
+    await new Promise<void>((resolve) =>
+      requestAnimationFrame(() => requestAnimationFrame(() => resolve())),
+    );
+
+    const sections = frames
+      .map((frame) => frame.querySelector<HTMLElement>('section.docx'))
+      .filter((sec): sec is HTMLElement => Boolean(sec));
+    if (sections.length === 0) {
+      throw new Error('未获取到可导出的文档页面');
+    }
+    const total = sections.length;
+
+    // PDF 页面尺寸按 Word 纸张原始 pt 尺寸（section inline width/height），
+    // 与光栅化内容（静态化后恢复原始尺寸）严格一致，图片铺满整页（Word 页面本身含页边距）。
+    const firstSize = getSectionPaperSizePt(sections[0]);
+    const pdf = new jsPDF({
+      orientation: firstSize.wPt > firstSize.hPt ? 'landscape' : 'portrait',
+      unit: 'pt',
+      format: [firstSize.wPt, firstSize.hPt],
+      compress: true,
+    });
+
+    for (let i = 0; i < total; i++) {
+      onProgress?.(i + 1, total);
+      const section = sections[i];
+      const { wPt, hPt } = getSectionPaperSizePt(section);
+
+      const canvas = await captureSection(section);
+      const dataUrl = canvas.toDataURL('image/png');
+      if (i > 0) {
+        pdf.addPage([wPt, hPt], wPt > hPt ? 'landscape' : 'portrait');
+      }
+      pdf.addImage(dataUrl, 'PNG', 0, 0, wPt, hPt, undefined, 'FAST');
+      // 及时释放 canvas 位图内存（多页大文档）
+      canvas.width = 0;
+      canvas.height = 0;
+    }
+
+    pdf.save(pdfName);
+    return pdfName;
+  } finally {
+    // 卸载离屏宿主，避免污染日常页面
+    unmount();
+  }
+};

package/src/ui/UIFilePreview/index.ts

@@ -0,0 +1,35 @@
+
+/**
+ * UIFilePreview 使用示例
+ *
+ * @example 获取文件预览类型
+ * const previewType = getFilePreviewType('document.pdf'); // 'pdf'
+ *
+ * @example 获取文件完整URL
+ * const fileUrl = getFileUrl('/files/document.pdf'); // 'https://example.com/files/document.pdf'
+ *
+ * @example 获取文件图标
+ * const icon = getFileIcon({ fileName: 'report.pdf', fileType: 'application/pdf', size: 24 });
+ *
+ * @example 下载文件
+ * await downloadFile('/files/report.pdf');
+ *
+ * @example 获取文件Buffer（带进度回调）
+ * const abortController = new AbortController();
+ * const result = await fetchFileBuffer('/files/report.pdf', abortController, (percent) => {
+ *   console.log(`下载进度: ${percent}%`);
+ * });
+ * const { buffer, headers, status } = result;
+ */
+import { UIFilePreview } from './UIFilePreview';
+import { getFileUrl, getFilePreviewType, downloadFile, fetchFileBuffer, getFileIcon } from './previewUtils';
+
+export { UIFilePreview };
+
+export const uiFilePreview = {
+  downloadFile,
+  fetchFileBuffer,
+  getFileIcon,
+  getFileUrl,
+  getFilePreviewType,
+};

package/src/ui/UIFilePreview/pdfPagination.ts

@@ -0,0 +1,143 @@
+/**
+ * PDF 导出的分页计算（Markdown 导出与块文档导出共用）。
+ *
+ * 分页优先落在内容块边界上；当单个块放不下时退到"行级"边界（文本行、表格行、图片等），
+ * 保证不会把一行文字从中间切开——这是 html2canvas 按 y 坐标硬切最容易出现的问题。
+ */
+
+export interface PdfBlockBound {
+  /** 块在容器内的纵向起点 */
+  top: number;
+  /** 块在容器内的纵向终点 */
+  bottom: number;
+  /** 块内部可用的切分位置（相对容器），按升序排列 */
+  lineTops: number[];
+}
+
+export interface PdfPageSlice {
+  y: number;
+  height: number;
+}
+
+/** 收集块内部的行起始位置：文本按行盒取，替换元素（图片/表格行等）按自身矩形取 */
+const collectInnerTops = (
+  block: Element,
+  originTop: number,
+  min: number,
+  max: number,
+): number[] => {
+  const tops = new Set<number>();
+
+  const push = (top: number, bottom: number) => {
+    if (!Number.isFinite(top) || bottom - top <= 0.5) return;
+    // 只保留块内部的换行点：以块自身首尾为边界，避免把一个单行块切成两页
+    if (top <= min + 1 || top >= max - 1) return;
+    tops.add(Math.round(top * 2) / 2);
+  };
+
+  try {
+    const walker = document.createTreeWalker(block, NodeFilter.SHOW_TEXT);
+    let node = walker.nextNode();
+    while (node) {
+      const value = node.nodeValue;
+      if (value && value.trim()) {
+        const range = document.createRange();
+        range.selectNodeContents(node);
+        Array.from(range.getClientRects()).forEach((rect) =>
+          push(rect.top - originTop, rect.bottom - originTop),
+        );
+        if (typeof range.detach === 'function') {
+          range.detach();
+        }
+      }
+      node = walker.nextNode();
+    }
+  } catch {
+    // 取不到行盒时退回块边界分页
+  }
+
+  block.querySelectorAll('img, hr, tr, canvas, svg, video, figure').forEach((el) => {
+    const rect = el.getBoundingClientRect();
+    push(rect.top - originTop, rect.bottom - originTop);
+  });
+
+  return Array.from(tops).sort((a, b) => a - b);
+};
+
+/** 计算各内容块在容器内的纵向区间与可切分位置 */
+export const measureBlocks = (root: HTMLElement, blocks: Element[]): PdfBlockBound[] => {
+  const rootTop = root.getBoundingClientRect().top;
+
+  return blocks
+    .map((block) => {
+      const rect = block.getBoundingClientRect();
+      const top = rect.top - rootTop;
+      const bottom = rect.bottom - rootTop;
+      return {
+        top,
+        bottom,
+        lineTops: collectInnerTops(block, rootTop, top, bottom),
+      };
+    })
+    .filter((bound) => bound.bottom - bound.top > 0.5);
+};
+
+/** 在 (pageStart, limit] 区间内找出最靠后的行边界 */
+const pickCut = (block: PdfBlockBound, pageStart: number, limit: number): number | null => {
+  let cut: number | null = null;
+  for (const top of block.lineTops) {
+    if (top > limit) break;
+    if (top > pageStart + 1) cut = top;
+  }
+  return cut;
+};
+
+/**
+ * 按块/行边界把内容划分为若干页。
+ * 返回的每一段都是 [y, y + height]，互不重叠，且不会切断文本行。
+ */
+export const buildPageSlices = (bounds: PdfBlockBound[], pageHeight: number): PdfPageSlice[] => {
+  const slices: PdfPageSlice[] = [];
+  if (bounds.length === 0) return slices;
+
+  let pageStart = Math.max(0, bounds[0].top);
+  let pageEnd = pageStart;
+
+  for (const block of bounds) {
+    let top = block.top;
+
+    while (block.bottom - pageStart > pageHeight) {
+      const limit = pageStart + pageHeight;
+      const cut = pickCut(block, pageStart, limit);
+
+      // 1. 本页能容纳该块的开头若干行：在最后一行之前断页
+      if (cut !== null) {
+        slices.push({ y: pageStart, height: cut - pageStart });
+        pageStart = cut;
+        top = Math.max(top, cut);
+        continue;
+      }
+
+      // 2. 该块在本页还没开始、且第一行也放不下：整块移到下一页
+      if (top > pageStart + 0.5) {
+        slices.push({ y: pageStart, height: top - pageStart });
+        pageStart = top;
+        top = block.top;
+        continue;
+      }
+
+      // 3. 单块高于整页且没有可用行边界（大图/大表格等）：只能按页高切分
+      slices.push({ y: pageStart, height: pageHeight });
+      pageStart += pageHeight;
+      top = pageStart;
+    }
+
+    pageEnd = Math.max(pageEnd, block.bottom);
+  }
+
+  if (pageEnd > pageStart) {
+    slices.push({ y: pageStart, height: pageEnd - pageStart });
+  }
+
+  return slices;
+};