@files-preview-app/preview-file 1.3.5 → 1.3.6

package/dist/react.d.cts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { FilePreviewViewer } from './index.cjs';
-import { F as FileSource, P as PreviewPlugin, a as PreviewViewerOptions, b as PreviewInstance } from './index.d-B79v0jxi.cjs';
+import { F as FileSource, P as PreviewPlugin, a as PreviewViewerOptions, b as PreviewInstance } from './index.d-DPqVo4OT.cjs';
 
 interface FilePreviewProps {
     /** File to preview. Accepts URL string, File, Blob, ArrayBuffer, or Uint8Array */

package/dist/react.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { FilePreviewViewer } from './index.js';
-import { F as FileSource, P as PreviewPlugin, a as PreviewViewerOptions, b as PreviewInstance } from './index.d-B79v0jxi.js';
+import { F as FileSource, P as PreviewPlugin, a as PreviewViewerOptions, b as PreviewInstance } from './index.d-DPqVo4OT.js';
 
 interface FilePreviewProps {
     /** File to preview. Accepts URL string, File, Blob, ArrayBuffer, or Uint8Array */

package/dist/react.js

@@ -496,6 +496,7 @@ var ICON_COPY = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" str
 var ICON_FAST_FORWARD = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="13 19 22 12 13 5 13 19"></polygon><polygon points="2 19 11 12 2 5 2 19"></polygon></svg>`;
 var ICON_REWIND = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="11 19 2 12 11 5 11 19"></polygon><polygon points="22 19 13 12 22 5 22 19"></polygon></svg>`;
 var ICON_EXTERNAL_WINDOW = `<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="3" y1="8" x2="21" y2="8"></line><circle cx="6" cy="5.5" r="0.75" fill="currentColor"></circle><circle cx="8.5" cy="5.5" r="0.75" fill="currentColor"></circle><polyline points="14 13 18 13 18 17"></polyline><line x1="11" y1="20" x2="18" y2="13"></line></svg>`;
+var ICON_RESET_ZOOM = `<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><path d="M13 11a3 3 0 1 0-3 3"></path><path d="M10 11v3h3"></path></svg>`;
 var ICON_MAP = {
   "zoom-in": ICON_ZOOM_IN,
   "zoom-out": ICON_ZOOM_OUT,
@@ -525,7 +526,10 @@ var ICON_MAP = {
   "open-window": ICON_EXTERNAL_WINDOW,
   "external-window": ICON_EXTERNAL_WINDOW,
   "openWindow": ICON_EXTERNAL_WINDOW,
-  "openSeparateWindow": ICON_EXTERNAL_WINDOW
+  "openSeparateWindow": ICON_EXTERNAL_WINDOW,
+  "reset-zoom": ICON_RESET_ZOOM,
+  "zoom-reset": ICON_RESET_ZOOM,
+  "resetZoom": ICON_RESET_ZOOM
 };
 var ToolbarController = class {
   el;
@@ -558,6 +562,10 @@ var ToolbarController = class {
       this.config.fitToPage = false;
       this.config.fitWidth = false;
     }
+    if (actionId === "reset-zoom" || actionId === "zoom-reset" || actionId === "resetZoom") {
+      this.config.resetZoom = false;
+      this.config.zoomReset = false;
+    }
     if (actionId === "rotate-cw" || actionId === "rotate" || actionId === "rotateCW") this.config.rotate = false;
     if (actionId === "fullscreen") this.config.fullscreen = false;
     if (actionId === "download") this.config.download = false;
@@ -582,6 +590,10 @@ var ToolbarController = class {
       this.config.fitToPage = true;
       this.config.fitWidth = true;
     }
+    if (actionId === "reset-zoom" || actionId === "zoom-reset" || actionId === "resetZoom") {
+      this.config.resetZoom = true;
+      this.config.zoomReset = true;
+    }
     if (actionId === "rotate-cw" || actionId === "rotate" || actionId === "rotateCW") this.config.rotate = true;
     if (actionId === "fullscreen") this.config.fullscreen = true;
     if (actionId === "download") this.config.download = true;
@@ -601,6 +613,7 @@ var ToolbarController = class {
     if (actionId === "zoomIn") return "zoom-in";
     if (actionId === "zoomOut") return "zoom-out";
     if (actionId === "fitPage" || actionId === "fitToPage" || actionId === "fitWidth") return "fit-page";
+    if (actionId === "resetZoom" || actionId === "zoomReset") return "reset-zoom";
     if (actionId === "rotateCW") return "rotate-cw";
     if (actionId === "rotateCCW") return "rotate-ccw";
     if (actionId === "openWindow" || actionId === "openSeparateWindow") return "open-window";
@@ -643,6 +656,9 @@ var ToolbarController = class {
     if ((id === "fit-page" || id === "fit-width" || id === "fit-slide") && (c.fitPage === false || c.fitToPage === false || c.fitWidth === false || c["fit-page"] === false || c["fit-width"] === false)) {
       return false;
     }
+    if ((id === "reset-zoom" || id === "zoom-reset") && (c.resetZoom === false || c.zoomReset === false || c["reset-zoom"] === false || c["zoom-reset"] === false)) {
+      return false;
+    }
     if ((id === "rotate-cw" || id === "rotate-ccw" || id === "rotate") && (c.rotate === false || c.rotateCW === false || c.rotateCCW === false || c["rotate-cw"] === false)) {
       return false;
     }
@@ -1089,6 +1105,9 @@ var FilePreviewViewer = class _FilePreviewViewer {
       this.activeInstance = instance;
       instance.openInSeparateWindow = () => this.openInSeparateWindow();
       instance.toggleThumbnails = () => this.toggleThumbnails();
+      if (!instance.resetZoom && instance.fitToPage) {
+        instance.resetZoom = () => instance.fitToPage?.();
+      }
       this.hideLoading();
       this.eventEmitter.emit("loaded", { metadata, plugin: matchedPlugin.id });
       const isToolbarVisible = options.showToolbar !== false && options.toolbar !== false;
@@ -1372,6 +1391,16 @@ var FilePreviewViewer = class _FilePreviewViewer {
   fitToPage() {
     this.activeInstance?.fitToPage?.();
   }
+  /**
+   * Reset zoom level to initial/default fit state.
+   */
+  resetZoom() {
+    if (this.activeInstance?.resetZoom) {
+      this.activeInstance.resetZoom();
+    } else if (this.activeInstance?.fitToPage) {
+      this.activeInstance.fitToPage();
+    }
+  }
   /**
    * Zoom in.
    */
@@ -1993,6 +2022,14 @@ var PdfPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "fit-width",
         icon: "fit-width",
@@ -2255,6 +2292,14 @@ var PdfPlugin = class {
         zoomScale = 1;
         renderPage(currentPage);
       },
+      resetZoom: () => {
+        fitMode = "page";
+        zoomScale = 1;
+        rotation = 0;
+        container.scrollTop = 0;
+        container.scrollLeft = 0;
+        renderPage(currentPage);
+      },
       fitToWidth: () => {
         fitMode = "width";
         zoomScale = 1;
@@ -2422,6 +2467,16 @@ var MediaPlugin = class {
             instance.fitToPage?.();
           }
         },
+        {
+          id: "reset-zoom",
+          icon: "reset-zoom",
+          label: "Reset Zoom",
+          type: "button",
+          group: "zoom",
+          execute: () => {
+            instance.resetZoom?.();
+          }
+        },
         {
           id: "rotate-cw",
           icon: "rotate-cw",
@@ -2595,6 +2650,13 @@ var MediaPlugin = class {
         rotation = 0;
         applyTransform();
       } : void 0,
+      resetZoom: isImage ? () => {
+        currentZoom = 1;
+        rotation = 0;
+        ctx.container.scrollTop = 0;
+        ctx.container.scrollLeft = 0;
+        applyTransform();
+      } : void 0,
       rotateCW: isImage || isVideo ? () => {
         rotation = (rotation + 90) % 360;
         applyTransform();
@@ -2711,6 +2773,14 @@ var DocxPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "rotate-cw",
         icon: "rotate-cw",
@@ -3027,6 +3097,14 @@ var DocxPlugin = class {
         rotation = 0;
         applyTransform();
       },
+      resetZoom: () => {
+        isUserZoomed = false;
+        scale = calculateFitScale("page");
+        rotation = 0;
+        ctx.container.scrollTop = 0;
+        ctx.container.scrollLeft = 0;
+        applyTransform();
+      },
       rotateCW: () => {
         rotation = (rotation + 90) % 360;
         applyTransform();
@@ -3476,6 +3554,16 @@ var ExcelPlugin = class {
           instance.zoomIn?.();
         }
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => {
+          instance.resetZoom?.();
+        }
+      },
       {
         id: "download",
         icon: "download",
@@ -3663,6 +3751,12 @@ var ExcelPlugin = class {
         scale = calculateFitScale();
         applyTransform();
       },
+      resetZoom: () => {
+        scale = calculateFitScale();
+        contentArea.scrollTop = 0;
+        contentArea.scrollLeft = 0;
+        applyTransform();
+      },
       rotateCW: () => {
       },
       rotateCCW: () => {
@@ -3793,6 +3887,16 @@ var CsvPlugin = class {
           instance.zoomIn?.();
         }
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => {
+          instance.resetZoom?.();
+        }
+      },
       {
         id: "download",
         icon: "download",
@@ -3982,6 +4086,12 @@ var CsvPlugin = class {
         scale = calculateFitScale();
         applyScale();
       },
+      resetZoom: () => {
+        scale = calculateFitScale();
+        container.scrollTop = 0;
+        container.scrollLeft = 0;
+        applyScale();
+      },
       rotateCW: () => {
       },
       rotateCCW: () => {
@@ -4097,6 +4207,16 @@ var CodePlugin = class {
           instance.zoomIn?.();
         }
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => {
+          instance.resetZoom?.();
+        }
+      },
       {
         id: "copy",
         icon: "copy",
@@ -4376,6 +4496,15 @@ var CodePlugin = class {
         zoomLevel = isTxt ? calculateTxtFit() : 1;
         updateTransform();
       },
+      resetZoom: () => {
+        isUserZoomed = false;
+        fontSize = 13;
+        rotation = 0;
+        zoomLevel = isTxt ? calculateTxtFit() : 1;
+        container.scrollTop = 0;
+        container.scrollLeft = 0;
+        updateTransform();
+      },
       rotateCW: () => {
         rotation = (rotation + 90) % 360;
         updateTransform();
@@ -4438,11 +4567,19 @@ var ArchivePlugin = class {
       {
         id: "fit-page",
         icon: "fit-page",
-        label: "Reset Zoom",
+        label: "Fit to Page",
         type: "button",
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "download",
         icon: "download",
@@ -4597,7 +4734,13 @@ var ArchivePlugin = class {
       },
       fitToPage: () => {
         scale = 1;
-        wrapper.style.transform = `scale(1)`;
+        wrapper.style.transform = "scale(1)";
+      },
+      resetZoom: () => {
+        scale = 1;
+        wrapper.style.transform = "scale(1)";
+        ctx.container.scrollTop = 0;
+        ctx.container.scrollLeft = 0;
       },
       download: () => {
         downloadFile(ctx.buffer, ctx.metadata.name || "archive.zip", "application/zip");
@@ -4649,6 +4792,14 @@ var MarkdownPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "copy",
         icon: "copy",
@@ -4802,6 +4953,12 @@ var MarkdownPlugin = class {
         fontSize = 15;
         wrapper.style.fontSize = "15px";
       },
+      resetZoom: () => {
+        fontSize = 15;
+        wrapper.style.fontSize = "15px";
+        ctx.container.scrollTop = 0;
+        ctx.container.scrollLeft = 0;
+      },
       download: () => {
         downloadFile(ctx.buffer, ctx.metadata.name || "document.md", "text/markdown");
       },
@@ -4895,6 +5052,14 @@ var PptxPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "rotate-cw",
         icon: "rotate-cw",
@@ -5014,6 +5179,13 @@ var PptxPlugin = class {
         rotation = 0;
         applyTransform();
       },
+      resetZoom: () => {
+        scale = calculateFitScale();
+        rotation = 0;
+        wrapper.scrollTop = 0;
+        wrapper.scrollLeft = 0;
+        applyTransform();
+      },
       rotateCW: () => {
         rotation = (rotation + 90) % 360;
         applyTransform();
@@ -5089,6 +5261,14 @@ var ThreeDPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "rotate-cw",
         icon: "rotate-cw",
@@ -5225,6 +5405,7 @@ var ThreeDPlugin = class {
         controls.update();
       },
       fitToPage: fitCamera,
+      resetZoom: fitCamera,
       rotateCW: () => {
         isWireframe = !isWireframe;
         materials.forEach((m) => {
@@ -5439,6 +5620,14 @@ var RtfPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "rotate-cw",
         icon: "rotate-cw",
@@ -5908,6 +6097,15 @@ var RtfPlugin = class {
         rotation = 0;
         applyTransform();
       },
+      resetZoom: () => {
+        isUserZoomed = false;
+        fitMode = "width";
+        scale = calculateFitScale("width");
+        rotation = 0;
+        ctx.container.scrollTop = 0;
+        ctx.container.scrollLeft = 0;
+        applyTransform();
+      },
       rotateCW: () => {
         rotation = (rotation + 90) % 360;
         applyTransform();
@@ -5975,6 +6173,14 @@ var HtmlPreviewPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "copy",
         icon: "copy",
@@ -6047,6 +6253,12 @@ var HtmlPreviewPlugin = class {
         scale = 1;
         iframe.style.transform = "scale(1)";
       },
+      resetZoom: () => {
+        scale = 1;
+        iframe.style.transform = "scale(1)";
+        ctx.container.scrollTop = 0;
+        ctx.container.scrollLeft = 0;
+      },
       copy: () => {
         navigator.clipboard.writeText(rawHtml);
       },
@@ -6147,6 +6359,14 @@ var OpenDocumentPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "rotate-cw",
         icon: "rotate-cw",
@@ -6414,6 +6634,15 @@ var OpenDocumentPlugin = class {
         rotation = 0;
         applyTransform();
       },
+      resetZoom: () => {
+        isUserZoomed = false;
+        fitMode = "width";
+        scale = calculateFitScale("width");
+        rotation = 0;
+        container.scrollTop = 0;
+        container.scrollLeft = 0;
+        applyTransform();
+      },
       rotateCW: () => {
         rotation = (rotation + 90) % 360;
         applyTransform();
@@ -6757,6 +6986,14 @@ var DocPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "rotate-cw",
         icon: "rotate-cw",
@@ -6963,6 +7200,15 @@ var DocPlugin = class {
         rotation = 0;
         applyTransform();
       },
+      resetZoom: () => {
+        isUserZoomed = false;
+        fitMode = "width";
+        scale = calculateFitScale("width");
+        rotation = 0;
+        ctx.container.scrollTop = 0;
+        ctx.container.scrollLeft = 0;
+        applyTransform();
+      },
       rotateCW: () => {
         rotation = (rotation + 90) % 360;
         applyTransform();
@@ -7443,6 +7689,14 @@ var PptPlugin = class {
         group: "zoom",
         execute: () => instance.fitToPage?.()
       },
+      {
+        id: "reset-zoom",
+        icon: "reset-zoom",
+        label: "Reset Zoom",
+        type: "button",
+        group: "zoom",
+        execute: () => instance.resetZoom?.()
+      },
       {
         id: "rotate-cw",
         icon: "rotate-cw",
@@ -7631,6 +7885,13 @@ var PptPlugin = class {
         rotation = 0;
         applyTransform();
       },
+      resetZoom: () => {
+        scale = calculateFitScale();
+        rotation = 0;
+        container.scrollTop = 0;
+        container.scrollLeft = 0;
+        applyTransform();
+      },
       rotateCW: () => {
         rotation = (rotation + 90) % 360;
         applyTransform();