@files-preview-app/preview-file 1.2.6 → 1.2.8

package/dist/index.js

@@ -1,4 +1,4 @@
-import DOMPurify2 from 'dompurify';
+import DOMPurify6 from 'dompurify';
 import * as pdfjsLib from 'pdfjs-dist';
 import * as docx from 'docx-preview';
 import { unzipSync, strFromU8, unzip } from 'fflate';
@@ -356,7 +356,7 @@ async function sourceToArrayBuffer(source, signal) {
     if (magicMime === "application/zip") {
       const ooxmlMime = detectOoxmlType(buffer);
       if (ooxmlMime && ooxmlMime !== "application/zip") {
-        metadata.mimeType = ooxmlMime;
+        metadata.mimeType = metadata.mimeType ?? ooxmlMime;
         if (ooxmlMime.includes("wordprocessing")) metadata.extension = metadata.extension ?? ".docx";
         else if (ooxmlMime.includes("spreadsheet")) metadata.extension = metadata.extension ?? ".xlsx";
         else if (ooxmlMime.includes("presentation")) metadata.extension = metadata.extension ?? ".pptx";
@@ -385,12 +385,12 @@ async function sourceToArrayBuffer(source, signal) {
   return { buffer, metadata };
 }
 function sanitizeHTML(html) {
-  return DOMPurify2.sanitize(html, {
+  return DOMPurify6.sanitize(html, {
     USE_PROFILES: { html: true }
   });
 }
 function sanitizeSVG(svg) {
-  return DOMPurify2.sanitize(svg, {
+  return DOMPurify6.sanitize(svg, {
     USE_PROFILES: { svg: true, svgFilters: true }
   });
 }
@@ -476,7 +476,8 @@ function createElement(tag, attrs, ...children) {
 }
 var ICON_ZOOM_IN = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line><line x1="11" y1="8" x2="11" y2="14"></line><line x1="8" y1="11" x2="14" y2="11"></line></svg>`;
 var ICON_ZOOM_OUT = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line><line x1="8" y1="11" x2="14" y2="11"></line></svg>`;
-var ICON_FIT_PAGE = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 3 21 3 21 9"></polyline><polyline points="9 21 3 21 3 15"></polyline><line x1="21" y1="3" x2="14" y2="10"></line><line x1="3" y1="21" x2="10" y2="14"></line></svg>`;
+var ICON_FIT_PAGE = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"></rect><line x1="8" y1="12" x2="16" y2="12"></line><polyline points="11 9 8 12 11 15"></polyline><polyline points="13 9 16 12 13 15"></polyline></svg>`;
+var ICON_FIT_WIDTH = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="2" y1="12" x2="22" y2="12"></line><polyline points="5 9 2 12 5 15"></polyline><polyline points="19 9 22 12 19 15"></polyline><line x1="2" y1="5" x2="2" y2="19"></line><line x1="22" y1="5" x2="22" y2="19"></line></svg>`;
 var ICON_ROTATE_CW = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"></polyline><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"></path></svg>`;
 var ICON_ROTATE_CCW = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="1 4 1 10 7 10"></polyline><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"></path></svg>`;
 var ICON_DOWNLOAD = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg>`;
@@ -496,6 +497,7 @@ var ICON_MAP = {
   "zoom-in": ICON_ZOOM_IN,
   "zoom-out": ICON_ZOOM_OUT,
   "fit-page": ICON_FIT_PAGE,
+  "fit-width": ICON_FIT_WIDTH,
   "fit-slide": ICON_FIT_PAGE,
   "rotate-cw": ICON_ROTATE_CW,
   "rotate-ccw": ICON_ROTATE_CCW,
@@ -1442,6 +1444,7 @@ var PdfPlugin = class {
     let currentPage = 1;
     let zoomScale = 1;
     let rotation = 0;
+    let fitMode = "width";
     let currentRenderTask = null;
     const renderPage = async (pageNum) => {
       if (currentRenderTask) {
@@ -1461,11 +1464,16 @@ var PdfPlugin = class {
       const containerWidth = container.clientWidth || 900;
       const containerHeight = container.clientHeight || 700;
       const unscaledVp = page.getViewport({ scale: 1, rotation });
-      const availWidth = Math.max(100, containerWidth - 48);
-      const availHeight = Math.max(100, containerHeight - 88);
+      const availWidth = Math.max(280, containerWidth - 48);
+      const availHeight = Math.max(280, containerHeight - 88);
       const scaleW = availWidth / unscaledVp.width;
       const scaleH = availHeight / unscaledVp.height;
-      const fitScale = Math.min(scaleW, scaleH);
+      let fitScale;
+      if (fitMode === "page") {
+        fitScale = Math.max(0.5, Math.min(scaleW, scaleH));
+      } else {
+        fitScale = Math.max(0.65, Math.min(1.15, scaleW));
+      }
       const effectiveScale = (fitScale > 0 ? fitScale : 1) * zoomScale;
       const pixelRatio = window.devicePixelRatio || 1;
       const viewport = page.getViewport({ scale: effectiveScale, rotation });
@@ -1491,7 +1499,19 @@ var PdfPlugin = class {
       }
     };
     await renderPage(1);
+    let resizeTimer = null;
+    const resizeObserver = new ResizeObserver(() => {
+      if (resizeTimer) clearTimeout(resizeTimer);
+      resizeTimer = setTimeout(() => {
+        if (Math.abs(zoomScale - 1) < 0.05) {
+          renderPage(currentPage);
+        }
+      }, 150);
+    });
+    resizeObserver.observe(container);
     const cleanup = () => {
+      resizeObserver.disconnect();
+      if (resizeTimer) clearTimeout(resizeTimer);
       if (currentRenderTask) {
         try {
           currentRenderTask.cancel();
@@ -1522,6 +1542,7 @@ var PdfPlugin = class {
         renderPage(currentPage);
       },
       fitToPage: () => {
+        fitMode = fitMode === "width" ? "page" : "width";
         zoomScale = 1;
         rotation = 0;
         renderPage(currentPage);
@@ -2075,8 +2096,53 @@ var DocxPlugin = class {
         }
       }
     }
-    const sections = wrapper.querySelectorAll("section.docx");
-    const cards = wrapper.querySelectorAll(".fp-docx-page-card");
+    let sections = Array.from(wrapper.querySelectorAll("section.docx"));
+    const cards = Array.from(wrapper.querySelectorAll(".fp-docx-page-card"));
+    if (sections.length === 1 && cards.length === 0) {
+      const singleSec = sections[0];
+      const pageH = 1056;
+      const secH = singleSec.offsetHeight || singleSec.scrollHeight;
+      if (secH > pageH * 1.25) {
+        const children = Array.from(singleSec.children);
+        if (children.length > 1) {
+          const parent = singleSec.parentElement || wrapper;
+          const newSections = [singleSec];
+          singleSec.innerHTML = "";
+          singleSec.style.minHeight = `${pageH}px`;
+          singleSec.style.maxHeight = `${pageH}px`;
+          singleSec.style.overflow = "hidden";
+          singleSec.style.boxSizing = "border-box";
+          let curSec = singleSec;
+          let curH = 0;
+          const maxH = pageH - 96;
+          for (let i = 0; i < children.length; i++) {
+            const child = children[i];
+            curSec.appendChild(child);
+            const chH = child.offsetHeight || 28;
+            curH += chH;
+            if (curH >= maxH && i < children.length - 1) {
+              const nextSec = document.createElement("section");
+              nextSec.className = singleSec.className;
+              nextSec.style.cssText = singleSec.style.cssText;
+              nextSec.style.width = singleSec.style.width || "816px";
+              nextSec.style.minHeight = `${pageH}px`;
+              nextSec.style.maxHeight = `${pageH}px`;
+              nextSec.style.overflow = "hidden";
+              nextSec.style.boxSizing = "border-box";
+              nextSec.style.backgroundColor = "#ffffff";
+              nextSec.style.boxShadow = "0 4px 24px rgba(0, 0, 0, 0.08)";
+              nextSec.style.borderRadius = "4px";
+              nextSec.style.marginBottom = "24px";
+              parent.appendChild(nextSec);
+              newSections.push(nextSec);
+              curSec = nextSec;
+              curH = 0;
+            }
+          }
+          sections = newSections;
+        }
+      }
+    }
     const pageElements = sections.length > 0 ? sections : cards;
     const totalPages = Math.max(1, pageElements.length);
     let currentPage = 1;
@@ -2120,22 +2186,27 @@ var DocxPlugin = class {
     }
     scale = 1;
     let rotation = 0;
-    const calculateFitScale = () => {
+    let fitMode = "width";
+    const calculateFitScale = (mode = fitMode) => {
       const activeEl = pageElements[currentPage - 1] || wrapper.firstElementChild || wrapper;
       const elW = activeEl.offsetWidth || 816;
-      const elH = activeEl.offsetHeight || 1056;
-      const availW = Math.max(200, ctx.container.clientWidth - 48);
-      const availH = Math.max(200, ctx.container.clientHeight - 80);
+      const singlePageH = Math.min(activeEl.offsetHeight || 1056, Math.round(elW * 1.32));
+      const availW = Math.max(280, ctx.container.clientWidth - 48);
+      const availH = Math.max(280, ctx.container.clientHeight - 80);
       const sW = availW / elW;
-      const sH = availH / elH;
-      return Math.min(1.1, Math.min(sW, sH));
+      const sH = availH / singlePageH;
+      if (mode === "page") {
+        return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
+      }
+      return Math.max(0.65, Math.min(1.05, sW));
     };
     const applyTransform = () => {
       wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
       wrapper.style.transformOrigin = "top center";
     };
     setTimeout(() => {
-      scale = calculateFitScale();
+      fitMode = "width";
+      scale = calculateFitScale("width");
       applyTransform();
     }, 60);
     const cleanup = () => {
@@ -2169,7 +2240,8 @@ var DocxPlugin = class {
         applyTransform();
       },
       fitToPage: () => {
-        scale = calculateFitScale();
+        fitMode = fitMode === "width" ? "page" : "width";
+        scale = calculateFitScale(fitMode);
         rotation = 0;
         applyTransform();
       },
@@ -2239,90 +2311,149 @@ var DocxPlugin = class {
         console.warn("[DocxPlugin] Error parsing relationships:", relsErr);
       }
     }
-    const card = document.createElement("div");
-    card.className = "fp-docx-page-card";
-    card.style.backgroundColor = "#ffffff";
-    card.style.borderRadius = "6px";
-    card.style.boxShadow = "0 4px 24px rgba(0,0,0,0.08)";
-    card.style.padding = "48px 56px";
-    card.style.fontFamily = 'Calibri, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
-    card.style.color = "#1e293b";
-    card.style.lineHeight = "1.6";
+    const sectPrs = Array.from(doc.getElementsByTagNameNS("*", "sectPr"));
+    const lastSectPr = sectPrs[sectPrs.length - 1];
+    let defaultW = 12240;
+    let defaultH = 15840;
+    let margins = { top: 1440, right: 1440, bottom: 1440, left: 1440 };
+    if (lastSectPr) {
+      const pgSz = lastSectPr.getElementsByTagNameNS("*", "pgSz")[0];
+      if (pgSz) {
+        defaultW = parseInt(pgSz.getAttribute("w:w") || pgSz.getAttribute("w") || "12240", 10);
+        defaultH = parseInt(pgSz.getAttribute("w:h") || pgSz.getAttribute("h") || "15840", 10);
+      }
+      const pgMar = lastSectPr.getElementsByTagNameNS("*", "pgMar")[0];
+      if (pgMar) {
+        margins.top = parseInt(pgMar.getAttribute("w:top") || pgMar.getAttribute("top") || "1440", 10);
+        margins.bottom = parseInt(pgMar.getAttribute("w:bottom") || pgMar.getAttribute("bottom") || "1440", 10);
+        margins.left = parseInt(pgMar.getAttribute("w:left") || pgMar.getAttribute("left") || "1440", 10);
+        margins.right = parseInt(pgMar.getAttribute("w:right") || pgMar.getAttribute("right") || "1440", 10);
+      }
+    }
+    const createPageCard = () => {
+      const card = document.createElement("div");
+      card.className = "fp-docx-page-card";
+      card.style.backgroundColor = "#ffffff";
+      card.style.borderRadius = "4px";
+      card.style.boxShadow = "0 4px 24px rgba(0,0,0,0.08)";
+      card.style.fontFamily = 'Calibri, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
+      card.style.color = "#1e293b";
+      card.style.lineHeight = "1.6";
+      card.style.boxSizing = "border-box";
+      card.style.overflow = "hidden";
+      card.style.position = "relative";
+      card.style.marginBottom = "24px";
+      card.style.width = `${defaultW / 15}px`;
+      card.style.height = `${defaultH / 15}px`;
+      card.style.padding = `${margins.top / 15}px ${margins.right / 15}px ${margins.bottom / 15}px ${margins.left / 15}px`;
+      return card;
+    };
+    let currentCard = createPageCard();
+    let currentHtml = "";
+    const pages = [{ card: currentCard, html: "" }];
+    const flushHtml = () => {
+      pages[pages.length - 1].html += currentHtml;
+      currentHtml = "";
+    };
+    const newPage = () => {
+      flushHtml();
+      currentCard = createPageCard();
+      pages.push({ card: currentCard, html: "" });
+    };
     const body = doc.getElementsByTagNameNS("*", "body")[0] || doc.documentElement;
-    let html = "";
     for (const child of Array.from(body.children)) {
       const tag = child.localName || child.nodeName.split(":").pop();
       if (tag === "p") {
         const pStyle = child.getElementsByTagNameNS("*", "pStyle")[0];
         const styleVal = pStyle?.getAttribute("w:val") || pStyle?.getAttribute("val") || "";
         const numPr = child.getElementsByTagNameNS("*", "numPr")[0];
-        const textContent = this.extractParagraphHtml(child, imageMap);
-        if (!textContent.trim()) {
-          html += '<div style="height: 10px;"></div>';
-          continue;
-        }
-        const lowerStyle = styleVal.toLowerCase();
-        if (lowerStyle.includes("title")) {
-          html += `<h1 style="font-size: 28px; font-weight: 700; color: #1e3a8a; margin: 24px 0 12px; border-bottom: 2px solid #e2e8f0; padding-bottom: 8px;">${textContent}</h1>`;
-        } else if (lowerStyle.includes("heading1") || styleVal === "1") {
-          html += `<h2 style="font-size: 22px; font-weight: 700; color: #1e40af; margin: 20px 0 10px;">${textContent}</h2>`;
-        } else if (lowerStyle.includes("heading2") || styleVal === "2") {
-          html += `<h3 style="font-size: 18px; font-weight: 600; color: #2563eb; margin: 16px 0 8px;">${textContent}</h3>`;
-        } else if (lowerStyle.includes("heading3") || styleVal === "3") {
-          html += `<h4 style="font-size: 15px; font-weight: 600; color: #334155; margin: 12px 0 6px;">${textContent}</h4>`;
-        } else if (numPr) {
-          html += `<div style="display: flex; gap: 8px; margin: 4px 0 4px 20px;"><span style="color: #2563eb; font-weight: bold;">\u2022</span><span>${textContent}</span></div>`;
-        } else {
-          html += `<p style="margin: 8px 0; font-size: 14px;">${textContent}</p>`;
+        const chunks = this.extractParagraphChunks(child, imageMap);
+        for (let i = 0; i < chunks.length; i++) {
+          if (i > 0) {
+            newPage();
+          }
+          const textContent = chunks[i];
+          if (!textContent.trim() && !textContent.includes("<img")) {
+            currentHtml += '<div style="height: 10px;"></div>';
+            continue;
+          }
+          const lowerStyle = styleVal.toLowerCase();
+          if (lowerStyle.includes("title")) {
+            currentHtml += `<h1 style="font-size: 28px; font-weight: 700; color: #1e3a8a; margin: 24px 0 12px; border-bottom: 2px solid #e2e8f0; padding-bottom: 8px;">${textContent}</h1>`;
+          } else if (lowerStyle.includes("heading1") || styleVal === "1") {
+            currentHtml += `<h2 style="font-size: 22px; font-weight: 700; color: #1e40af; margin: 20px 0 10px;">${textContent}</h2>`;
+          } else if (lowerStyle.includes("heading2") || styleVal === "2") {
+            currentHtml += `<h3 style="font-size: 18px; font-weight: 600; color: #2563eb; margin: 16px 0 8px;">${textContent}</h3>`;
+          } else if (lowerStyle.includes("heading3") || styleVal === "3") {
+            currentHtml += `<h4 style="font-size: 15px; font-weight: 600; color: #334155; margin: 12px 0 6px;">${textContent}</h4>`;
+          } else if (numPr) {
+            currentHtml += `<div style="display: flex; gap: 8px; margin: 4px 0 4px 20px;"><span style="color: #2563eb; font-weight: bold;">\u2022</span><span>${textContent}</span></div>`;
+          } else {
+            currentHtml += `<p style="margin: 8px 0; font-size: 14px;">${textContent}</p>`;
+          }
         }
       } else if (tag === "tbl") {
-        html += '<table style="width: 100%; border-collapse: collapse; margin: 20px 0; border: 1px solid #cbd5e1;">';
+        currentHtml += '<table style="width: 100%; border-collapse: collapse; margin: 20px 0; border: 1px solid #cbd5e1;">';
         const rows = Array.from(child.getElementsByTagNameNS("*", "tr"));
         rows.forEach((tr, rIdx) => {
-          html += `<tr style="${rIdx === 0 ? "background-color: #f8fafc; font-weight: 600;" : ""}">`;
+          currentHtml += `<tr style="${rIdx === 0 ? "background-color: #f8fafc; font-weight: 600;" : ""}">`;
           const cells = Array.from(tr.getElementsByTagNameNS("*", "tc"));
           cells.forEach((tc) => {
             const cellText = this.extractParagraphHtml(tc, imageMap);
-            html += `<td style="border: 1px solid #cbd5e1; padding: 8px 12px; font-size: 13px;">${cellText || "&nbsp;"}</td>`;
+            currentHtml += `<td style="border: 1px solid #cbd5e1; padding: 8px 12px; font-size: 13px;">${cellText || "&nbsp;"}</td>`;
           });
-          html += "</tr>";
+          currentHtml += "</tr>";
         });
-        html += "</table>";
+        currentHtml += "</table>";
       }
     }
-    card.innerHTML = DOMPurify2.sanitize(html, {
-      ADD_TAGS: ["h1", "h2", "h3", "h4", "p", "table", "tr", "td", "span", "b", "i", "u", "s", "strike", "img", "div", "br"],
-      ADD_ATTR: ["style", "src", "alt", "colspan", "rowspan"]
-    });
-    wrapper.appendChild(card);
+    flushHtml();
+    for (const page of pages) {
+      page.card.innerHTML = DOMPurify6.sanitize(page.html, {
+        ADD_TAGS: ["h1", "h2", "h3", "h4", "p", "table", "tr", "td", "span", "b", "i", "u", "s", "strike", "img", "div", "br"],
+        ADD_ATTR: ["style", "src", "alt", "colspan", "rowspan"]
+      });
+      wrapper.appendChild(page.card);
+    }
   }
   extractParagraphHtml(pElement, imageMap = {}) {
-    let result = "";
+    return this.extractParagraphChunks(pElement, imageMap).join("<br/>");
+  }
+  extractParagraphChunks(pElement, imageMap = {}) {
+    const chunks = [""];
+    let currentChunkIndex = 0;
     const drawings = Array.from(pElement.getElementsByTagNameNS("*", "drawing"));
     for (const drawing of drawings) {
       const blip = drawing.getElementsByTagNameNS("*", "blip")[0];
       const rId = blip?.getAttribute("r:embed") || blip?.getAttribute("r:id");
       if (rId && imageMap[rId]) {
-        result += `<div style="text-align:center; margin: 12px 0;"><img src="${imageMap[rId]}" style="max-width: 100%; height: auto; border-radius: 4px;" /></div>`;
+        chunks[currentChunkIndex] += `<div style="text-align:center; margin: 12px 0;"><img src="${imageMap[rId]}" style="max-width: 100%; height: auto; border-radius: 4px;" /></div>`;
       }
     }
     const runs = Array.from(pElement.getElementsByTagNameNS("*", "r"));
-    if (runs.length === 0 && !result) {
-      return DOMPurify2.sanitize(pElement.textContent || "");
+    if (runs.length === 0 && !chunks[currentChunkIndex]) {
+      chunks[currentChunkIndex] = DOMPurify6.sanitize(pElement.textContent || "");
+      return chunks;
     }
     for (const r of runs) {
       const blip = r.getElementsByTagNameNS("*", "blip")[0] || r.getElementsByTagNameNS("*", "imagedata")[0];
       const rId = blip?.getAttribute("r:embed") || blip?.getAttribute("r:id");
       if (rId && imageMap[rId]) {
-        result += `<img src="${imageMap[rId]}" style="max-width: 100%; height: auto; display: inline-block; margin: 4px;" />`;
+        chunks[currentChunkIndex] += `<img src="${imageMap[rId]}" style="max-width: 100%; height: auto; display: inline-block; margin: 4px;" />`;
       }
-      const brs = r.getElementsByTagNameNS("*", "br");
-      for (let i = 0; i < brs.length; i++) {
-        result += "<br/>";
+      const brs = Array.from(r.getElementsByTagNameNS("*", "br"));
+      for (const br of brs) {
+        const type = br.getAttribute("w:type") || br.getAttribute("type");
+        if (type === "page") {
+          chunks.push("");
+          currentChunkIndex++;
+        } else {
+          chunks[currentChunkIndex] += "<br/>";
+        }
       }
       const tabs = r.getElementsByTagNameNS("*", "tab");
       if (tabs.length > 0) {
-        result += "&emsp;";
+        chunks[currentChunkIndex] += "&emsp;";
       }
       const rPr = r.getElementsByTagNameNS("*", "rPr")[0];
       const isBold = !!rPr?.getElementsByTagNameNS("*", "b")[0];
@@ -2336,7 +2467,7 @@ var DocxPlugin = class {
       const texts = Array.from(r.getElementsByTagNameNS("*", "t"));
       let text = texts.map((t) => t.textContent || "").join("");
       if (!text) continue;
-      text = DOMPurify2.sanitize(text);
+      text = DOMPurify6.sanitize(text);
       let styles = "";
       if (isBold) styles += "font-weight: bold; ";
       if (isItalic) styles += "font-style: italic; ";
@@ -2348,12 +2479,12 @@ var DocxPlugin = class {
         if (!isNaN(pt) && pt > 0) styles += `font-size: ${pt}pt; `;
       }
       if (styles) {
-        result += `<span style="${styles}">${text}</span>`;
+        chunks[currentChunkIndex] += `<span style="${styles}">${text}</span>`;
       } else {
-        result += text;
+        chunks[currentChunkIndex] += text;
       }
     }
-    return result;
+    return chunks;
   }
   renderBinaryDocFallback(ctx, wrapper) {
     const card = document.createElement("div");
@@ -2370,14 +2501,14 @@ var DocxPlugin = class {
       const wordDocStream = cfbf.readStream("WordDocument");
       if (wordDocStream && wordDocStream.length >= 512) {
         const text2 = this.extractReadableStrings(wordDocStream);
-        card.innerHTML = `<div style="white-space: pre-wrap;">${DOMPurify2.sanitize(text2)}</div>`;
+        card.innerHTML = `<div style="white-space: pre-wrap;">${DOMPurify6.sanitize(text2)}</div>`;
         wrapper.appendChild(card);
         return;
       }
     } catch {
     }
     const text = this.extractReadableStrings(new Uint8Array(ctx.buffer));
-    card.innerHTML = `<div style="white-space: pre-wrap;">${DOMPurify2.sanitize(text)}</div>`;
+    card.innerHTML = `<div style="white-space: pre-wrap;">${DOMPurify6.sanitize(text)}</div>`;
     wrapper.appendChild(card);
   }
   extractReadableStrings(bytes) {
@@ -2554,11 +2685,9 @@ var ExcelPlugin = class {
     const calculateFitScale = () => {
       const table = contentArea.querySelector("table");
       if (!table) return 1;
-      const availW = Math.max(200, container.clientWidth - 48);
-      const availH = Math.max(200, container.clientHeight - 80);
+      const availW = Math.max(280, container.clientWidth - 48);
       const tW = table.offsetWidth || 800;
-      const tH = table.offsetHeight || 600;
-      return Math.min(1, Math.min(availW / tW, availH / tH));
+      return Math.max(0.65, Math.min(1, availW / tW));
     };
     try {
       wb = XLSX.read(new Uint8Array(ctx.buffer), { type: "array", cellDates: true });
@@ -2976,41 +3105,94 @@ var CodePlugin = class {
   async render(ctx) {
     const decoder = new TextDecoder("utf-8");
     const fullText = decoder.decode(ctx.buffer);
-    const pageSplitRegex = /(?:\f|\x0C|(?:\r?\n|^)\s*[-=_]{3,}\s*(?:PAGE|Page|page break|Page Break)[\s\d\w-]*[-=_]{3,}\s*(?:\r?\n|$))/i;
-    const rawPages = fullText.split(pageSplitRegex).map((p) => p.trim()).filter((p) => p.length > 0);
+    const extRaw = ctx.metadata.extension?.toLowerCase();
+    const mimeRaw = ctx.metadata.mimeType?.toLowerCase();
+    const isTxt = extRaw === ".txt" || mimeRaw === "text/plain" && (!extRaw || !this.extensions.filter((e) => e !== ".txt").includes(extRaw));
+    let rawPages = [];
+    if (isTxt) {
+      const explicitPages = fullText.split(/(?:\f|\x0C)/);
+      for (const ep of explicitPages) {
+        const lines = ep.split(/\r?\n/);
+        let currentChunk = [];
+        for (let i = 0; i < lines.length; i++) {
+          currentChunk.push(lines[i]);
+          if (currentChunk.length >= 46) {
+            rawPages.push(currentChunk.join("\n"));
+            currentChunk = [];
+          }
+        }
+        if (currentChunk.length > 0 || lines.length === 0) {
+          rawPages.push(currentChunk.join("\n"));
+        }
+      }
+      if (rawPages.length === 0) rawPages = [""];
+    } else {
+      const pageSplitRegex = /(?:\f|\x0C|(?:\r?\n|^)\s*[-=_]{3,}\s*(?:PAGE|Page|page break|Page Break)[\s\d\w-]*[-=_]{3,}\s*(?:\r?\n|$))/i;
+      rawPages = fullText.split(pageSplitRegex).map((p) => p.trim()).filter((p) => p.length > 0);
+    }
     const totalPages = Math.max(1, rawPages.length);
     let currentPage = 1;
     const container = document.createElement("div");
     container.style.width = "100%";
     container.style.height = "100%";
     container.style.overflow = "auto";
-    container.style.backgroundColor = "#1e1e1e";
-    container.style.color = "#d4d4d4";
-    container.style.padding = "16px";
-    container.style.boxSizing = "border-box";
     let fontSize = 13;
     let rotation = 0;
+    let zoomLevel = 1;
     const pre = document.createElement("pre");
-    pre.style.margin = "0";
-    pre.style.fontFamily = "Consolas, Menlo, Monaco, monospace";
-    pre.style.fontSize = `${fontSize}px`;
-    pre.style.lineHeight = "1.5";
-    pre.style.whiteSpace = "pre-wrap";
-    pre.style.wordBreak = "break-all";
     const code = document.createElement("code");
+    if (isTxt) {
+      container.style.backgroundColor = "#f1f5f9";
+      container.style.padding = "32px";
+      container.style.boxSizing = "border-box";
+      container.style.display = "flex";
+      container.style.flexDirection = "column";
+      container.style.alignItems = "center";
+      pre.style.margin = "0";
+      pre.style.fontFamily = "Consolas, 'Courier New', monospace";
+      pre.style.fontSize = "13px";
+      pre.style.color = "#1e293b";
+      pre.style.lineHeight = "1.5";
+      pre.style.whiteSpace = "pre-wrap";
+      pre.style.wordBreak = "break-word";
+      pre.style.backgroundColor = "#ffffff";
+      pre.style.width = "816px";
+      pre.style.minHeight = "1056px";
+      pre.style.padding = "72px 56px";
+      pre.style.boxSizing = "border-box";
+      pre.style.boxShadow = "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)";
+      pre.style.borderRadius = "4px";
+      pre.style.transformOrigin = "top center";
+    } else {
+      container.style.backgroundColor = "#1e1e1e";
+      container.style.color = "#d4d4d4";
+      container.style.padding = "16px";
+      container.style.boxSizing = "border-box";
+      pre.style.margin = "0";
+      pre.style.fontFamily = "Consolas, Menlo, Monaco, monospace";
+      pre.style.fontSize = `${fontSize}px`;
+      pre.style.lineHeight = "1.5";
+      pre.style.whiteSpace = "pre-wrap";
+      pre.style.wordBreak = "break-all";
+      pre.style.transformOrigin = "top left";
+    }
     const ext = (ctx.metadata.extension || "").replace(".", "");
     const renderCodePage = (text) => {
-      try {
-        if (ext && hljs.getLanguage(ext)) {
-          code.innerHTML = hljs.highlight(text, { language: ext }).value;
-        } else {
-          code.innerHTML = hljs.highlightAuto(text).value;
-        }
-      } catch {
+      if (isTxt) {
         code.textContent = text;
+      } else {
+        try {
+          if (ext && hljs.getLanguage(ext)) {
+            code.innerHTML = hljs.highlight(text, { language: ext }).value;
+          } else {
+            code.innerHTML = hljs.highlightAuto(text).value;
+          }
+        } catch {
+          code.textContent = text;
+        }
       }
     };
-    renderCodePage(rawPages[0] || fullText);
+    renderCodePage(rawPages[0] || (isTxt ? "" : fullText));
     pre.appendChild(code);
     container.appendChild(pre);
     let indicator = null;
@@ -3019,15 +3201,22 @@ var CodePlugin = class {
       indicator.className = "fp-code-page-indicator";
       indicator.style.position = "sticky";
       indicator.style.bottom = "16px";
-      indicator.style.backgroundColor = "rgba(15, 23, 42, 0.85)";
-      indicator.style.backdropFilter = "blur(8px)";
-      indicator.style.color = "#f8fafc";
+      if (isTxt) {
+        indicator.style.backgroundColor = "rgba(255, 255, 255, 0.9)";
+        indicator.style.color = "#334155";
+        indicator.style.border = "1px solid #e2e8f0";
+        indicator.style.boxShadow = "0 1px 3px rgba(0,0,0,0.1)";
+      } else {
+        indicator.style.backgroundColor = "rgba(15, 23, 42, 0.85)";
+        indicator.style.color = "#f8fafc";
+        indicator.style.border = "1px solid rgba(255, 255, 255, 0.15)";
+        indicator.style.boxShadow = "0 4px 12px rgba(0, 0, 0, 0.3)";
+        indicator.style.backdropFilter = "blur(8px)";
+      }
       indicator.style.fontSize = "12px";
       indicator.style.fontWeight = "600";
       indicator.style.padding = "5px 14px";
       indicator.style.borderRadius = "20px";
-      indicator.style.border = "1px solid rgba(255, 255, 255, 0.15)";
-      indicator.style.boxShadow = "0 4px 12px rgba(0, 0, 0, 0.3)";
       indicator.style.zIndex = "10";
       indicator.style.userSelect = "none";
       indicator.style.pointerEvents = "none";
@@ -3038,7 +3227,7 @@ var CodePlugin = class {
     }
     const showPage = (pageNum) => {
       currentPage = Math.max(1, Math.min(totalPages, pageNum));
-      renderCodePage(rawPages[currentPage - 1] || fullText);
+      renderCodePage(rawPages[currentPage - 1] || (isTxt ? "" : fullText));
       if (indicator) {
         indicator.textContent = `Page ${currentPage} of ${totalPages}`;
       }
@@ -3054,39 +3243,57 @@ var CodePlugin = class {
       ctx.container.innerHTML = "";
     };
     ctx.signal.addEventListener("abort", cleanup);
+    const updateTransform = () => {
+      if (isTxt) {
+        pre.style.transform = `scale(${zoomLevel}) rotate(${rotation}deg)`;
+      } else {
+        pre.style.transform = `rotate(${rotation}deg)`;
+        pre.style.fontSize = `${fontSize}px`;
+      }
+    };
     return {
       destroy: cleanup,
       getPageCount: () => totalPages,
       getCurrentPage: () => currentPage,
       goToPage: (page) => showPage(page),
       zoomIn: () => {
-        fontSize = Math.min(32, fontSize + 2);
-        pre.style.fontSize = `${fontSize}px`;
+        if (isTxt) {
+          zoomLevel = Math.min(3, zoomLevel + 0.1);
+        } else {
+          fontSize = Math.min(32, fontSize + 2);
+        }
+        updateTransform();
       },
       zoomOut: () => {
-        fontSize = Math.max(8, fontSize - 2);
-        pre.style.fontSize = `${fontSize}px`;
+        if (isTxt) {
+          zoomLevel = Math.max(0.1, zoomLevel - 0.1);
+        } else {
+          fontSize = Math.max(8, fontSize - 2);
+        }
+        updateTransform();
       },
-      getZoom: () => fontSize / 13,
+      getZoom: () => isTxt ? zoomLevel : fontSize / 13,
       setZoom: (level) => {
-        fontSize = Math.round(13 * level);
-        pre.style.fontSize = `${fontSize}px`;
+        if (isTxt) {
+          zoomLevel = level;
+        } else {
+          fontSize = Math.round(13 * level);
+        }
+        updateTransform();
       },
       fitToPage: () => {
         fontSize = 13;
         rotation = 0;
-        pre.style.fontSize = "13px";
-        pre.style.transform = "none";
+        zoomLevel = isTxt ? Math.max(0.65, Math.min(1.05, (container.clientWidth - 48) / 816)) : 1;
+        updateTransform();
       },
       rotateCW: () => {
         rotation = (rotation + 90) % 360;
-        pre.style.transform = `rotate(${rotation}deg)`;
-        pre.style.transformOrigin = "top left";
+        updateTransform();
       },
       rotateCCW: () => {
         rotation = (rotation - 90 + 360) % 360;
-        pre.style.transform = `rotate(${rotation}deg)`;
-        pre.style.transformOrigin = "top left";
+        updateTransform();
       },
       download: () => {
         const mimeType = ctx.metadata.mimeType || "text/plain";
@@ -3385,7 +3592,7 @@ var MarkdownPlugin = class {
       gfm: true,
       breaks: true
     });
-    const cleanHtml = DOMPurify2.sanitize(rawHtml, {
+    const cleanHtml = DOMPurify6.sanitize(rawHtml, {
       USE_PROFILES: { html: true }
     });
     const wrapper = document.createElement("div");
@@ -4021,6 +4228,14 @@ var RtfPlugin = class {
         group: "actions",
         execute: () => instance.download?.()
       },
+      {
+        id: "copy",
+        icon: "copy",
+        label: "Copy Text",
+        type: "button",
+        group: "actions",
+        execute: () => instance.copy?.()
+      },
       {
         id: "print",
         icon: "print",
@@ -4051,20 +4266,27 @@ var RtfPlugin = class {
     let scale = 1;
     let rotation = 0;
     let pageElements = [];
-    const calculateFitScale = () => {
+    let fitMode = "width";
+    const calculateFitScale = (mode = fitMode) => {
       const activeEl = pageElements[currentPage - 1] || wrapper;
       const elW = activeEl.offsetWidth || 850;
-      const elH = activeEl.offsetHeight || 1e3;
-      const availW = Math.max(200, ctx.container.clientWidth - 48);
-      const availH = Math.max(200, ctx.container.clientHeight - 80);
-      return Math.min(1.1, Math.min(availW / elW, availH / elH));
+      const singlePageH = Math.min(activeEl.offsetHeight || 1056, Math.round(elW * 1.32));
+      const availW = Math.max(280, ctx.container.clientWidth - 48);
+      const availH = Math.max(280, ctx.container.clientHeight - 80);
+      const sW = availW / elW;
+      const sH = availH / singlePageH;
+      if (mode === "page") {
+        return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
+      }
+      return Math.max(0.65, Math.min(1.05, sW));
     };
     const applyTransform = () => {
       wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
       wrapper.style.transformOrigin = "top center";
     };
     setTimeout(() => {
-      scale = calculateFitScale();
+      fitMode = "width";
+      scale = calculateFitScale("width");
       applyTransform();
     }, 60);
     try {
@@ -4082,14 +4304,31 @@ var RtfPlugin = class {
     } catch (err) {
       console.warn("[RtfPlugin] RTF render error, fallback text:", err);
       const text = new TextDecoder("latin1").decode(ctx.buffer);
-      const clean = text.replace(/\\par[d]?/g, "\n").replace(/\\[a-zA-Z0-9\-]+/g, "").replace(/[{}]/g, "");
-      const pre = document.createElement("pre");
-      pre.style.whiteSpace = "pre-wrap";
-      pre.style.fontFamily = "serif";
-      pre.style.color = "#333";
-      pre.textContent = clean;
-      wrapper.appendChild(pre);
-      pageElements = [pre];
+      const rawPages = text.split(/\\page\b/).map((segment) => {
+        return segment.replace(/\\par[d]?/g, "\n").replace(/\\[a-zA-Z0-9\-]+/g, "").replace(/[{}]/g, "").trim();
+      }).filter((p) => p.length > 0);
+      const pages = rawPages.length > 0 ? rawPages : [text.replace(/\\par[d]?/g, "\n").replace(/\\[a-zA-Z0-9\-]+/g, "").replace(/[{}]/g, "").trim()];
+      for (let i = 0; i < pages.length; i++) {
+        const pageCard = document.createElement("div");
+        pageCard.className = "fp-rtf-page-card";
+        pageCard.style.backgroundColor = "#ffffff";
+        pageCard.style.boxShadow = "0 2px 12px rgba(0,0,0,0.08)";
+        pageCard.style.borderRadius = "4px";
+        pageCard.style.padding = "72px 56px";
+        pageCard.style.width = "816px";
+        pageCard.style.minHeight = "1056px";
+        pageCard.style.maxWidth = "100%";
+        pageCard.style.boxSizing = "border-box";
+        pageCard.style.fontFamily = "serif";
+        pageCard.style.fontSize = "12pt";
+        pageCard.style.lineHeight = "1.6";
+        pageCard.style.color = "#1e293b";
+        pageCard.style.whiteSpace = "pre-wrap";
+        pageCard.style.display = i === 0 ? "block" : "none";
+        pageCard.textContent = pages[i];
+        wrapper.appendChild(pageCard);
+        pageElements.push(pageCard);
+      }
     }
     const totalPages = Math.max(1, pageElements.length);
     let currentPage = 1;
@@ -4156,7 +4395,8 @@ var RtfPlugin = class {
         applyTransform();
       },
       fitToPage: () => {
-        scale = calculateFitScale();
+        fitMode = fitMode === "width" ? "page" : "width";
+        scale = calculateFitScale(fitMode);
         rotation = 0;
         applyTransform();
       },
@@ -4177,6 +4417,10 @@ var RtfPlugin = class {
         a.click();
         URL.revokeObjectURL(url);
       },
+      copy: () => {
+        const text = wrapper.textContent || "";
+        navigator.clipboard?.writeText(text);
+      },
       print: () => {
         window.print();
       }
@@ -4251,7 +4495,7 @@ var HtmlPreviewPlugin = class {
   }
   async render(ctx) {
     const rawHtml = new TextDecoder("utf-8").decode(ctx.buffer);
-    const sanitized = DOMPurify2.sanitize(rawHtml, {
+    const sanitized = DOMPurify6.sanitize(rawHtml, {
       WHOLE_DOCUMENT: true,
       ADD_TAGS: ["style", "link"],
       ADD_ATTR: ["target", "rel"]
@@ -4471,19 +4715,29 @@ var OpenDocumentPlugin = class {
     ctx.container.appendChild(container);
     let scale = 1;
     let rotation = 0;
-    const calculateFitScale = () => {
+    let fitMode = "width";
+    const calculateFitScale = (mode = fitMode) => {
       const elW = wrapper.offsetWidth || 850;
-      const elH = wrapper.offsetHeight || (isPresentation ? 540 : 1e3);
-      const availW = Math.max(200, ctx.container.clientWidth - 48);
-      const availH = Math.max(200, ctx.container.clientHeight - 80);
-      return Math.min(1, Math.min(availW / elW, availH / elH));
+      const singlePageH = Math.min(wrapper.offsetHeight || 1056, Math.round(elW * 1.32));
+      const availW = Math.max(280, ctx.container.clientWidth - 48);
+      const availH = Math.max(280, ctx.container.clientHeight - 80);
+      const sW = availW / elW;
+      const sH = availH / (isPresentation ? 540 : singlePageH);
+      if (isPresentation) {
+        return Math.min(1, Math.min(sW, sH));
+      }
+      if (mode === "page") {
+        return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
+      }
+      return Math.max(0.65, Math.min(1.05, sW));
     };
     const applyTransform = () => {
       wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
       wrapper.style.transformOrigin = "top center";
     };
     setTimeout(() => {
-      scale = calculateFitScale();
+      fitMode = "width";
+      scale = calculateFitScale("width");
       applyTransform();
     }, 60);
     let currentPage = 1;
@@ -4517,14 +4771,97 @@ var OpenDocumentPlugin = class {
         wrapper.textContent = contentDoc.documentElement.textContent || "Formula content";
       }
     } else {
-      wrapper.style.maxWidth = "850px";
-      wrapper.style.padding = "48px";
+      wrapper.style.maxWidth = "none";
+      wrapper.style.padding = "0";
       wrapper.style.minHeight = "100%";
+      wrapper.style.backgroundColor = "transparent";
+      wrapper.style.boxShadow = "none";
+      wrapper.style.position = "relative";
+      const dims = this.getPageDimensions(stylesDoc, contentDoc);
       const bodyHtml = this.renderOdfBody(contentDoc, styleMap, imageUrls);
-      wrapper.innerHTML = DOMPurify2.sanitize(bodyHtml, {
-        ADD_TAGS: ["math", "semantics", "mrow", "mi", "mo", "mn", "msup", "msub"],
+      const tempDiv = document.createElement("div");
+      tempDiv.style.width = `${dims.width - dims.marginLeft - dims.marginRight}px`;
+      tempDiv.style.position = "absolute";
+      tempDiv.style.visibility = "hidden";
+      tempDiv.innerHTML = DOMPurify6.sanitize(bodyHtml, {
+        ADD_TAGS: ["math", "semantics", "mrow", "mi", "mo", "mn", "msup", "msub", "hr"],
         ADD_ATTR: ["style", "colspan", "rowspan"]
       });
+      document.body.appendChild(tempDiv);
+      const contentHeight = dims.height - dims.marginTop - dims.marginBottom;
+      const pageElements = [[]];
+      let currentHeight = 0;
+      let currentPageIdx = 0;
+      Array.from(tempDiv.children).forEach((child) => {
+        const el = child;
+        const style = el.getAttribute("style") || "";
+        const isBreakBefore = style.includes("page-break-before: always");
+        const isBreakAfter = style.includes("page-break-after: always");
+        const isSoftBreak = el.classList.contains("odf-page-break");
+        if (isBreakBefore) {
+          if (pageElements[currentPageIdx].length > 0) {
+            currentPageIdx++;
+            pageElements.push([]);
+            currentHeight = 0;
+          }
+        }
+        const h = el.offsetHeight || 0;
+        if (currentHeight + h > contentHeight && pageElements[currentPageIdx].length > 0 && !isSoftBreak) {
+          currentPageIdx++;
+          pageElements.push([]);
+          currentHeight = 0;
+        }
+        if (!isSoftBreak) {
+          pageElements[currentPageIdx].push(el.cloneNode(true));
+          currentHeight += h;
+        }
+        if (isBreakAfter || isSoftBreak) {
+          currentPageIdx++;
+          pageElements.push([]);
+          currentHeight = 0;
+        }
+      });
+      document.body.removeChild(tempDiv);
+      if (pageElements.length > 1 && pageElements[pageElements.length - 1].length === 0) {
+        pageElements.pop();
+      }
+      totalPages = Math.max(1, pageElements.length);
+      pageElements.forEach((elements, idx) => {
+        const page = document.createElement("div");
+        page.className = `fp-odt-page fp-odt-page-${idx + 1}`;
+        page.style.width = `${dims.width}px`;
+        page.style.minHeight = `${dims.height}px`;
+        page.style.padding = `${dims.marginTop}px ${dims.marginRight}px ${dims.marginBottom}px ${dims.marginLeft}px`;
+        page.style.margin = "0 auto";
+        page.style.backgroundColor = "#ffffff";
+        page.style.boxShadow = "0 2px 10px rgba(0,0,0,0.08)";
+        page.style.borderRadius = "4px";
+        page.style.boxSizing = "border-box";
+        page.style.display = idx === 0 ? "block" : "none";
+        page.style.position = "absolute";
+        page.style.top = "0";
+        page.style.left = "50%";
+        page.style.transform = "translateX(-50%)";
+        elements.forEach((el) => page.appendChild(el));
+        wrapper.appendChild(page);
+        slides.push(page);
+      });
+      const pageIndicator = document.createElement("div");
+      pageIndicator.className = "fp-odt-page-indicator";
+      pageIndicator.style.position = "sticky";
+      pageIndicator.style.bottom = "16px";
+      pageIndicator.style.left = "50%";
+      pageIndicator.style.transform = "translateX(-50%)";
+      pageIndicator.style.backgroundColor = "rgba(0, 0, 0, 0.6)";
+      pageIndicator.style.color = "#fff";
+      pageIndicator.style.padding = "6px 12px";
+      pageIndicator.style.borderRadius = "16px";
+      pageIndicator.style.fontSize = "12px";
+      pageIndicator.style.zIndex = "100";
+      pageIndicator.style.display = "inline-block";
+      pageIndicator.style.width = "fit-content";
+      pageIndicator.textContent = `Page 1 of ${totalPages}`;
+      container.appendChild(pageIndicator);
     }
     const cleanup = () => {
       imageUrls.forEach((url) => URL.revokeObjectURL(url));
@@ -4533,11 +4870,15 @@ var OpenDocumentPlugin = class {
     };
     ctx.signal.addEventListener("abort", cleanup);
     const goToPage = (page) => {
-      if (!isPresentation || page < 1 || page > totalPages) return;
+      if (page < 1 || page > totalPages) return;
       currentPage = page;
       slides.forEach((s, idx) => {
         s.style.display = idx === page - 1 ? "block" : "none";
       });
+      const indicator = container.querySelector(".fp-odt-page-indicator");
+      if (indicator) {
+        indicator.textContent = `Page ${currentPage} of ${totalPages}`;
+      }
       ctx.emit("page-change", { page: currentPage, total: totalPages });
     };
     return {
@@ -4557,7 +4898,8 @@ var OpenDocumentPlugin = class {
         applyTransform();
       },
       fitToPage: () => {
-        scale = calculateFitScale();
+        fitMode = fitMode === "width" ? "page" : "width";
+        scale = calculateFitScale(fitMode);
         rotation = 0;
         applyTransform();
       },
@@ -4606,6 +4948,43 @@ var OpenDocumentPlugin = class {
       }
     };
   }
+  getPageDimensions(stylesDoc, contentDoc) {
+    let width = 850;
+    let height = 1123;
+    let marginTop = 48;
+    let marginBottom = 48;
+    let marginLeft = 48;
+    let marginRight = 48;
+    const parseUnit = (val) => {
+      if (!val) return null;
+      if (val.endsWith("cm")) return parseFloat(val) * 37.8;
+      if (val.endsWith("mm")) return parseFloat(val) * 3.78;
+      if (val.endsWith("in")) return parseFloat(val) * 96;
+      if (val.endsWith("pt")) return parseFloat(val) * 1.33;
+      if (val.endsWith("px")) return parseFloat(val);
+      return parseFloat(val);
+    };
+    const docs = [stylesDoc, contentDoc].filter(Boolean);
+    for (const doc of docs) {
+      const pageLayout = doc.querySelector("page-layout-properties, [page-width]");
+      if (pageLayout) {
+        const w = parseUnit(pageLayout.getAttribute("fo:page-width") || pageLayout.getAttribute("page-width"));
+        const h = parseUnit(pageLayout.getAttribute("fo:page-height") || pageLayout.getAttribute("page-height"));
+        const mt = parseUnit(pageLayout.getAttribute("fo:margin-top") || pageLayout.getAttribute("margin-top"));
+        const mb = parseUnit(pageLayout.getAttribute("fo:margin-bottom") || pageLayout.getAttribute("margin-bottom"));
+        const ml = parseUnit(pageLayout.getAttribute("fo:margin-left") || pageLayout.getAttribute("margin-left"));
+        const mr = parseUnit(pageLayout.getAttribute("fo:margin-right") || pageLayout.getAttribute("margin-right"));
+        if (w !== null) width = w;
+        if (h !== null) height = h;
+        if (mt !== null) marginTop = mt;
+        if (mb !== null) marginBottom = mb;
+        if (ml !== null) marginLeft = ml;
+        if (mr !== null) marginRight = mr;
+        break;
+      }
+    }
+    return { width, height, marginTop, marginBottom, marginLeft, marginRight };
+  }
   extractStyles(stylesDoc, contentDoc) {
     const map = /* @__PURE__ */ new Map();
     const styleNodes = [];
@@ -4628,14 +5007,21 @@ var OpenDocumentPlugin = class {
         if (color) css += `color: ${color}; `;
         if (size) css += `font-size: ${size}; `;
       }
-      const paraProp = node.querySelector("paragraph-properties, [text-align]");
+      let paraProp = node.querySelector("paragraph-properties, [text-align]");
+      if (!paraProp) {
+        paraProp = Array.from(node.children).find((c) => c.tagName.includes("paragraph-properties")) || null;
+      }
       if (paraProp) {
         const align = paraProp.getAttribute("fo:text-align") || paraProp.getAttribute("text-align");
         const mt = paraProp.getAttribute("fo:margin-top") || paraProp.getAttribute("margin-top");
         const mb = paraProp.getAttribute("fo:margin-bottom") || paraProp.getAttribute("margin-bottom");
+        const breakBefore = paraProp.getAttribute("fo:break-before") || paraProp.getAttribute("break-before");
+        const breakAfter = paraProp.getAttribute("fo:break-after") || paraProp.getAttribute("break-after");
         if (align) css += `text-align: ${align}; `;
         if (mt) css += `margin-top: ${mt}; `;
         if (mb) css += `margin-bottom: ${mb}; `;
+        if (breakBefore === "page") css += "page-break-before: always; ";
+        if (breakAfter === "page") css += "page-break-after: always; ";
       }
       if (css) map.set(name, css);
     }
@@ -4720,6 +5106,8 @@ var OpenDocumentPlugin = class {
           result += "&emsp;";
         } else if (tag === "line-break") {
           result += "<br/>";
+        } else if (tag === "soft-page-break") {
+          result += '<hr class="odf-page-break" style="page-break-after: always; border: none; margin: 0; padding: 0; height: 0;" />';
         } else {
           result += el.textContent || "";
         }
@@ -4880,20 +5268,9 @@ var DocPlugin = class {
     container.style.overflow = "auto";
     container.style.padding = "32px 16px";
     container.style.backgroundColor = "#f1f5f9";
-    const wrapper = document.createElement("div");
-    wrapper.className = "fp-doc-wrapper";
-    wrapper.style.maxWidth = "850px";
-    wrapper.style.margin = "0 auto";
-    wrapper.style.backgroundColor = "#ffffff";
-    wrapper.style.boxShadow = "0 2px 12px rgba(0,0,0,0.08)";
-    wrapper.style.borderRadius = "4px";
-    wrapper.style.padding = "56px 48px";
-    wrapper.style.minHeight = "100%";
-    wrapper.style.transformOrigin = "top center";
-    wrapper.style.transition = "transform 0.2s ease";
-    wrapper.style.fontFamily = 'Calibri, "Segoe UI", Arial, sans-serif';
-    wrapper.style.color = "#1e293b";
-    container.appendChild(wrapper);
+    container.style.display = "flex";
+    container.style.justifyContent = "center";
+    container.style.alignItems = "flex-start";
     ctx.container.appendChild(container);
     let scale = 1;
     let extractedRawText = "";
@@ -4920,21 +5297,27 @@ var DocPlugin = class {
     const rawPages = this.splitIntoPages(extractedRawText);
     const totalPages = Math.max(1, rawPages.length);
     let currentPage = 1;
-    wrapper.innerHTML = "";
     const pageCards = [];
     for (let i = 0; i < totalPages; i++) {
       const pageCard = document.createElement("div");
       pageCard.className = "fp-doc-page-card";
+      pageCard.style.width = "816px";
+      pageCard.style.height = "1056px";
       pageCard.style.backgroundColor = "#ffffff";
       pageCard.style.boxShadow = "0 2px 12px rgba(0,0,0,0.08)";
       pageCard.style.borderRadius = "4px";
-      pageCard.style.padding = "56px 48px";
-      pageCard.style.minHeight = "100%";
+      pageCard.style.padding = "96px 72px";
+      pageCard.style.boxSizing = "border-box";
+      pageCard.style.overflow = "hidden";
       pageCard.style.display = i === 0 ? "block" : "none";
+      pageCard.style.transformOrigin = "top center";
+      pageCard.style.transition = "transform 0.2s ease";
+      pageCard.style.fontFamily = 'Calibri, "Segoe UI", Arial, sans-serif';
+      pageCard.style.color = "#1e293b";
       if (isFallback && i === 0) {
         pageCard.innerHTML = `
           <div style="border-bottom: 1px solid #e2e8f0; padding-bottom: 12px; margin-bottom: 24px;">
-            <h2 style="margin: 0 0 6px; font-size: 20px; color: #334155;">${DOMPurify2.sanitize(ctx.metadata.name || "Word Document (.doc)")}</h2>
+            <h2 style="margin: 0 0 6px; font-size: 20px; color: #334155;">${DOMPurify6.sanitize(ctx.metadata.name || "Word Document (.doc)")}</h2>
             <span style="font-size: 12px; color: #64748b; background: #f1f5f9; padding: 2px 8px; border-radius: 4px;">Legacy Word 97-2003 Binary Preview</span>
           </div>
           ${this.formatDocToHtml(rawPages[i], ctx.metadata.name || "Document")}
@@ -4942,15 +5325,17 @@ var DocPlugin = class {
       } else {
         pageCard.innerHTML = this.formatDocToHtml(rawPages[i], ctx.metadata.name || "Document");
       }
-      wrapper.appendChild(pageCard);
+      container.appendChild(pageCard);
       pageCards.push(pageCard);
     }
     let indicator = null;
     if (totalPages > 1) {
       indicator = document.createElement("div");
       indicator.className = "fp-doc-page-indicator";
-      indicator.style.position = "sticky";
+      indicator.style.position = "fixed";
       indicator.style.bottom = "16px";
+      indicator.style.left = "50%";
+      indicator.style.transform = "translateX(-50%)";
       indicator.style.backgroundColor = "rgba(15, 23, 42, 0.85)";
       indicator.style.backdropFilter = "blur(8px)";
       indicator.style.color = "#f8fafc";
@@ -4964,17 +5349,25 @@ var DocPlugin = class {
       indicator.style.userSelect = "none";
       indicator.style.pointerEvents = "none";
       indicator.style.textAlign = "center";
-      indicator.style.width = "fit-content";
-      indicator.style.margin = "16px auto 0";
       container.appendChild(indicator);
     }
+    let rotation = 0;
+    const applyTransform = () => {
+      const activeCard = pageCards[currentPage - 1];
+      if (activeCard) {
+        activeCard.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
+      }
+    };
     const showPage = (pageNum) => {
       currentPage = Math.max(1, Math.min(totalPages, pageNum));
-      if (totalPages > 1) {
-        pageCards.forEach((card, idx) => {
-          card.style.display = idx + 1 === currentPage ? "block" : "none";
-        });
-      }
+      pageCards.forEach((card, idx) => {
+        if (idx + 1 === currentPage) {
+          card.style.display = "block";
+          card.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
+        } else {
+          card.style.display = "none";
+        }
+      });
       if (indicator) {
         indicator.textContent = `Page ${currentPage} of ${totalPages}`;
       }
@@ -4983,21 +5376,22 @@ var DocPlugin = class {
     if (totalPages > 1) {
       showPage(1);
     }
-    let rotation = 0;
-    const calculateFitScale = () => {
-      const activeCard = pageCards[currentPage - 1] || wrapper;
-      const elW = activeCard.offsetWidth || 850;
-      const elH = activeCard.offsetHeight || 1e3;
-      const availW = Math.max(200, ctx.container.clientWidth - 48);
-      const availH = Math.max(200, ctx.container.clientHeight - 80);
-      return Math.min(1.1, Math.min(availW / elW, availH / elH));
-    };
-    const applyTransform = () => {
-      wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
-      wrapper.style.transformOrigin = "top center";
+    let fitMode = "width";
+    const calculateFitScale = (mode = fitMode) => {
+      const elW = 816;
+      const elH = 1056;
+      const availW = Math.max(280, ctx.container.clientWidth - 48);
+      const availH = Math.max(280, ctx.container.clientHeight - 80);
+      const sW = availW / elW;
+      const sH = availH / elH;
+      if (mode === "page") {
+        return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
+      }
+      return Math.max(0.65, Math.min(1.05, sW));
     };
     setTimeout(() => {
-      scale = calculateFitScale();
+      fitMode = "width";
+      scale = calculateFitScale("width");
       applyTransform();
     }, 60);
     const cleanup = () => {
@@ -5025,7 +5419,8 @@ var DocPlugin = class {
         applyTransform();
       },
       fitToPage: () => {
-        scale = calculateFitScale();
+        fitMode = fitMode === "width" ? "page" : "width";
+        scale = calculateFitScale(fitMode);
         rotation = 0;
         applyTransform();
       },
@@ -5153,8 +5548,28 @@ var DocPlugin = class {
   }
   splitIntoPages(text) {
     if (!text) return [""];
-    const parts = text.split(/[\x0C\f]|\r?\n\s*[-=_]{3,}\s*(?:PAGE|Page|page break)[\s\d\w-]*[-=_]{3,}\s*\r?\n/i).map((p) => p.trim()).filter((p) => p.length > 0);
-    return parts.length > 0 ? parts : [text];
+    const explicitParts = text.split(/[\x0C\f]|\r?\n\s*[-=_]{3,}\s*(?:PAGE|Page|page break)[\s\d\w-]*[-=_]{3,}\s*\r?\n/i).map((p) => p.trim()).filter((p) => p.length > 0);
+    if (explicitParts.length === 0) explicitParts.push(text);
+    const maxLinesPerPage = 48;
+    const finalPages = [];
+    for (const part of explicitParts) {
+      const lines = part.split(/\r?\n/);
+      let currentLines = [];
+      let count = 0;
+      for (const line of lines) {
+        currentLines.push(line);
+        count++;
+        if (count >= maxLinesPerPage) {
+          finalPages.push(currentLines.join("\n"));
+          currentLines = [];
+          count = 0;
+        }
+      }
+      if (currentLines.length > 0) {
+        finalPages.push(currentLines.join("\n"));
+      }
+    }
+    return finalPages.length > 0 ? finalPages : [text];
   }
   /**
    * Format cleaned extracted text into attractive HTML paragraphs, headings, and lists
@@ -5163,17 +5578,65 @@ var DocPlugin = class {
     const lines = text.replace(/\r\n/g, "\n").replace(/\r/g, "\n").replace(/\x0B/g, "\n").split("\n");
     let html = "";
     let inList = false;
-    for (const rawLine of lines) {
-      const line = rawLine.trim();
+    let tableLines = [];
+    const flushTable = () => {
+      if (tableLines.length > 0) {
+        html += '<table style="width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 12px;">';
+        for (const tLine of tableLines) {
+          html += "<tr>";
+          const cols = tLine.split("	");
+          for (const col of cols) {
+            html += `<td style="border: 1px solid #cbd5e1; padding: 6px 8px;">${DOMPurify6.sanitize(col.trim())}</td>`;
+          }
+          html += "</tr>";
+        }
+        html += "</table>";
+        tableLines = [];
+      }
+    };
+    let i = 0;
+    while (i < lines.length) {
+      let line = lines[i];
+      let tabCount = (line.match(/\t/g) || []).length;
+      if (tabCount > 0) {
+        let consecutiveTableLines = 1;
+        let j = i + 1;
+        while (j < lines.length) {
+          const nextTabCount = (lines[j].match(/\t/g) || []).length;
+          if (nextTabCount === tabCount) {
+            consecutiveTableLines++;
+            j++;
+          } else {
+            break;
+          }
+        }
+        if (consecutiveTableLines >= 3) {
+          if (inList) {
+            html += "</ul>";
+            inList = false;
+          }
+          tableLines = lines.slice(i, j);
+          flushTable();
+          i = j;
+          continue;
+        }
+      }
+      line = line.trim();
       if (!line) {
         if (inList) {
           html += "</ul>";
           inList = false;
         }
+        html += '<div style="height: 1.15em;"></div>';
+        i++;
+        continue;
+      }
+      if (/^[\x00-\x1F\x7F-\x9F]+$/.test(line)) {
+        i++;
         continue;
       }
-      if (/^[\x00-\x1F\x7F-\x9F]+$/.test(line)) continue;
-      if (line.includes("Normal.dot") || line.includes("Microsoft Word") || line.includes("Times New Roman") && line.length < 30) {
+      if ((line.includes("Normal.dot") || line.includes("Microsoft Word") || line.includes("Times New Roman")) && line.length < 30) {
+        i++;
         continue;
       }
       if (line.length < 60 && !line.endsWith(".") && (/^[A-Z0-9\s:_-]+$/.test(line) || line.startsWith("#"))) {
@@ -5181,24 +5644,26 @@ var DocPlugin = class {
           html += "</ul>";
           inList = false;
         }
-        html += `<h2 style="font-size: 18px; font-weight: 700; color: #1e3a8a; margin: 20px 0 8px; border-bottom: 1px solid #e2e8f0; padding-bottom: 4px;">${DOMPurify2.sanitize(line)}</h2>`;
+        html += `<h2 style="font-size: 16px; font-weight: 700; color: #1e3a8a; margin: 16px 0 8px; border-bottom: 1px solid #e2e8f0; padding-bottom: 4px;">${DOMPurify6.sanitize(line)}</h2>`;
       } else if (line.startsWith("\u2022") || line.startsWith("-") || line.startsWith("*")) {
         if (!inList) {
           html += '<ul style="margin: 8px 0; padding-left: 24px;">';
           inList = true;
         }
         const bulletText = line.replace(/^[•\-\*]\s*/, "");
-        html += `<li style="margin: 4px 0; line-height: 1.6;">${DOMPurify2.sanitize(bulletText)}</li>`;
+        html += `<li style="margin: 4px 0; line-height: 1.15; font-size: 12pt;">${DOMPurify6.sanitize(bulletText)}</li>`;
       } else {
         if (inList) {
           html += "</ul>";
           inList = false;
         }
-        html += `<p style="line-height: 1.7; margin: 10px 0; font-size: 14px; text-align: justify;">${DOMPurify2.sanitize(line)}</p>`;
+        html += `<p style="line-height: 1.15; margin: 0; font-size: 12pt; text-align: justify;">${DOMPurify6.sanitize(line)}</p>`;
       }
+      i++;
     }
     if (inList) html += "</ul>";
-    return html || `<p style="color: #64748b; font-style: italic;">(No readable text found in ${DOMPurify2.sanitize(filename)})</p>`;
+    flushTable();
+    return html || `<p style="color: #64748b; font-style: italic;">(No readable text found in ${DOMPurify6.sanitize(filename)})</p>`;
   }
 };
 function docPlugin() {
@@ -5376,7 +5841,7 @@ var PptPlugin = class {
       if (s.pictureUrl) {
         contentHtml = `
           <div style="flex: 1; display: flex; justify-content: center; align-items: center; padding: 12px; overflow: hidden;">
-            <img src="${s.pictureUrl}" alt="${DOMPurify2.sanitize(s.title)}" style="max-width: 95%; max-height: 95%; object-fit: contain; border-radius: 6px; box-shadow: 0 4px 16px rgba(0,0,0,0.1); background: #ffffff;" />
+            <img src="${s.pictureUrl}" alt="${DOMPurify6.sanitize(s.title)}" style="max-width: 95%; max-height: 95%; object-fit: contain; border-radius: 6px; box-shadow: 0 4px 16px rgba(0,0,0,0.1); background: #ffffff;" />
           </div>
         `;
       } else if (s.tableColumns.length > 0) {
@@ -5386,7 +5851,7 @@ var PptPlugin = class {
             <table style="width: 100%; border-collapse: collapse; border: 1px solid #cbd5e1; border-radius: 6px; overflow: hidden; background: #ffffff;">
               <thead>
                 <tr style="background: #e2e8f0; color: #1e293b; font-weight: 600; font-size: 14px;">
-                  ${cols.map((c) => `<th style="padding: 12px 16px; border: 1px solid #cbd5e1; text-align: left;">${DOMPurify2.sanitize(c)}</th>`).join("")}
+                  ${cols.map((c) => `<th style="padding: 12px 16px; border: 1px solid #cbd5e1; text-align: left;">${DOMPurify6.sanitize(c)}</th>`).join("")}
                 </tr>
               </thead>
               <tbody>
@@ -5402,7 +5867,7 @@ var PptPlugin = class {
       } else {
         const pTags = s.paragraphs.map((p) => {
           const lines = p.split(/[\r\n]+/).map((l) => l.trim()).filter(Boolean);
-          return lines.map((l) => `<p style="margin: 0 0 14px; font-size: 14px; line-height: 1.65; color: #334155; text-align: justify;">${DOMPurify2.sanitize(l)}</p>`).join("");
+          return lines.map((l) => `<p style="margin: 0 0 14px; font-size: 14px; line-height: 1.65; color: #334155; text-align: justify;">${DOMPurify6.sanitize(l)}</p>`).join("");
         }).join("");
         contentHtml = `
           <div style="flex: 1; overflow: auto; padding: 4px 8px; display: flex; flex-direction: column; justify-content: flex-start;">
@@ -5415,11 +5880,11 @@ var PptPlugin = class {
           <!-- Header Banner matching PowerPoint design -->
           <div style="background: linear-gradient(90deg, #a3e635 0%, #84cc16 100%); padding: 12px 24px; border-radius: 4px; display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); flex-shrink: 0;">
             <h1 style="margin: 0; font-size: 26px; font-weight: 700; color: #1e293b; letter-spacing: -0.3px;">
-              ${DOMPurify2.sanitize(s.title)}
+              ${DOMPurify6.sanitize(s.title)}
             </h1>
             ${s.subtitle ? `
               <span style="background: #38bdf8; color: #ffffff; padding: 4px 14px; border-radius: 4px; font-weight: 700; font-size: 13px; letter-spacing: 0.5px; box-shadow: 0 1px 4px rgba(0,0,0,0.15);">
-                ${DOMPurify2.sanitize(s.subtitle)}
+                ${DOMPurify6.sanitize(s.subtitle)}
               </span>
             ` : `
               <span style="font-size: 12px; color: #365314; font-weight: 600;">