@ibiz-template-plugin/ibiz-file-previewer 0.0.9 → 0.0.11

package/dist/index.es.js

@@ -18420,7 +18420,7 @@ const ImagePage = (props) => {
       };
       if (props.state.value.mode === ImageMode.WIDTH) {
         Object.assign(result, {
-          width: "".concat(parentStyle.value.width * props.state.value.scale, "px")
+          width: "".concat((parentStyle.value.width - 24 - 6) * props.state.value.scale, "px")
         });
       } else if (props.state.value.mode === ImageMode.PAGE) {
         Object.assign(result, {
@@ -18554,16 +18554,57 @@ const FilePreviewImageGroup = (props) => {
       }
     });
   };
+  let updateIsScrollingTimer;
   const updateIsScrolling = () => {
     isScrolling.value = true;
-    setTimeout(() => {
+    if (updateIsScrollingTimer) {
+      clearTimeout(updateIsScrollingTimer);
+    }
+    updateIsScrollingTimer = setTimeout(() => {
       isScrolling.value = false;
     }, 1e3);
   };
+  const MAX_ATTEMPTS = 30;
+  const STABLE_THRESHOLD = 2;
+  let requestAnimationFrameId;
+  const scrollToPageWhenStable = (pageIndex) => {
+    let lastTop = null;
+    let stableCount = 0;
+    let attempt = 0;
+    const tryScroll = () => {
+      const container = contentRef.current;
+      if (!container) return;
+      const pageElement = container.querySelector(
+        '[data-page-index="'.concat(pageIndex, '"]')
+      );
+      if (!pageElement) return;
+      const rect = pageElement.getBoundingClientRect();
+      if (rect.height > 0) {
+        if (lastTop !== null && Math.abs(rect.top - lastTop) < 1) {
+          stableCount++;
+        } else {
+          stableCount = 0;
+        }
+        lastTop = rect.top;
+        if (stableCount >= STABLE_THRESHOLD) {
+          scrollToPage(pageIndex);
+          updateIsScrolling();
+          return;
+        }
+      }
+      attempt++;
+      if (attempt < MAX_ATTEMPTS) {
+        requestAnimationFrameId = requestAnimationFrame(tryScroll);
+      } else {
+        scrollToPage(pageIndex);
+        updateIsScrolling();
+      }
+    };
+    requestAnimationFrameId = requestAnimationFrame(tryScroll);
+  };
   const handlePageClick = (pageIndex) => {
     controller.updateState({ currentPage: pageIndex });
-    scrollToPage(pageIndex);
-    updateIsScrolling();
+    scrollToPageWhenStable(pageIndex);
   };
   const handleInput = (e2) => {
     const target = e2.target;
@@ -18602,16 +18643,19 @@ const FilePreviewImageGroup = (props) => {
     return () => {
       var _a;
       (_a = contentRef.current) == null ? void 0 : _a.removeEventListener("scroll", handleScroll);
+      if (updateIsScrollingTimer) {
+        clearTimeout(updateIsScrollingTimer);
+      }
+      if (requestAnimationFrameId) {
+        cancelAnimationFrame(requestAnimationFrameId);
+      }
     };
   }, []);
   return /* @__PURE__ */ u("div", { className: "file-preview-image-group", children: [
     /* @__PURE__ */ u(
       "div",
       {
-        className: "image-group-left-container",
-        style: {
-          visibility: state.value.showThumbnailPanel ? "visible" : "hidden"
-        },
+        className: "image-group-left-container ".concat(state.value.showThumbnailPanel ? "image-group-left-container--open" : ""),
         children: /* @__PURE__ */ u(
           ThumbnailPanel,
           {