@arbidocs/blocks 0.4.116 → 0.4.118

package/dist/{chunk-GMDAQIRC.js → chunk-BDSKKIFZ.js}

@@ -4490,6 +4490,7 @@ function CompactToolbar() {
   ] });
 }
 var fixedZoomMode = { type: "fixed" };
+var ZOOM_LEVELS = [50, 75, 100, 125, 150, 200];
 function NativeDocxEditor({
   documentId,
   title,
@@ -4505,7 +4506,9 @@ function NativeDocxEditor({
   const [ready, setReady] = useState(), [error, setError] = useState(""), [retry, setRetry] = useState(0);
   const [status, setStatus] = useState("Connecting\u2026"), [dirty, setDirty] = useState(false), [saving, setSaving] = useState(false), [offline, setOffline] = useState(false);
   const revision = useRef(0);
-  const stageRef = useRef(null), fitCleanup = useRef(void 0);
+  const stageRef = useRef(null), fitCleanup = useRef(void 0), refit = useRef(void 0);
+  const fitting = useRef(true), fitted = useRef(void 0);
+  const [fitWidth, setFitWidth] = useState(true), [zoomPercent, setZoomPercent] = useState(100);
   const ref = useRef(null), dirtyRef = useRef(false), draftTimer = useRef(void 0);
   const isDraft = draftContent !== void 0;
   const streamRef = useRef(stream);
@@ -4755,16 +4758,29 @@ function NativeDocxEditor({
       updateStream();
     }
     fitCleanup.current?.();
+    fitted.current = void 0;
     const viewport = stageRef.current?.querySelector(".native-docx-viewport");
     if (!viewport) return;
+    let surface = null;
     const fit = () => {
+      const page = viewport.querySelector(".docx-paginated-surface");
+      if (page && page !== surface) resize.observe(surface = page);
+      const current = editor.getZoom();
+      if (fitting.current && fitted.current !== void 0 && Math.abs(current - fitted.current) > 1e-3)
+        fitting.current = false;
+      setFitWidth(fitting.current);
+      setZoomPercent(Math.round(current * 100));
+      if (!fitting.current) return;
       const pageWidth = editor.getPageGeometry()[0]?.box.width;
       if (!pageWidth) return;
       const style = getComputedStyle(viewport);
       const available = viewport.clientWidth - parseFloat(style.paddingLeft) - parseFloat(style.paddingRight);
-      const zoom = Math.max(0.1, Math.min(compact ? 1 : 2.5, available / pageWidth));
-      if (Math.abs(editor.getZoom() - zoom) > 1e-3) editor.setZoom(zoom);
+      const zoom = Math.max(0.1, Math.min(compact ? 1 : 5, available / pageWidth));
+      if (Math.abs(current - zoom) > 1e-3) editor.setZoom(zoom);
+      fitted.current = editor.getZoom();
+      setZoomPercent(Math.round(fitted.current * 100));
     };
+    refit.current = fit;
     const resize = new ResizeObserver(fit);
     const chrome = new MutationObserver(fit);
     resize.observe(viewport);
@@ -4772,12 +4788,30 @@ function NativeDocxEditor({
       attributes: true,
       attributeFilter: ["style", "data-review-pane", "data-review-margin"]
     });
+    const mount = viewport.querySelector(".docx-content-mount");
+    if (mount) chrome.observe(mount, { childList: true });
+    if (!fitting.current) editor.setZoom(zoomPercent / 100);
     fit();
     fitCleanup.current = () => {
       resize.disconnect();
       chrome.disconnect();
+      refit.current = void 0;
     };
   }
+  function pickZoom(value) {
+    const editor = ref.current;
+    if (!editor) return;
+    if (value === "fit") {
+      fitting.current = true;
+      fitted.current = void 0;
+      refit.current?.();
+      return;
+    }
+    fitting.current = false;
+    setFitWidth(false);
+    setZoomPercent(Number(value));
+    editor.setZoom(Number(value) / 100);
+  }
   function changed() {
     if (snapshot) return;
     revision.current += 1;
@@ -4941,6 +4975,24 @@ function NativeDocxEditor({
             status
           ] }),
           /* @__PURE__ */ jsx(DocxParticipants, { session: ready?.room?.session }),
+          !compact && /* @__PURE__ */ jsxs(
+            "select",
+            {
+              className: "native-docx-zoom",
+              "aria-label": "Zoom",
+              "data-testid": "native-docx-zoom",
+              disabled: !ready,
+              value: fitWidth ? "fit" : String(zoomPercent),
+              onChange: (event) => pickZoom(event.target.value),
+              children: [
+                /* @__PURE__ */ jsx("option", { value: "fit", children: "Fit width" }),
+                [.../* @__PURE__ */ new Set([...ZOOM_LEVELS, ...fitWidth ? [] : [zoomPercent]])].sort((a, b) => a - b).map((level) => /* @__PURE__ */ jsxs("option", { value: String(level), children: [
+                  level,
+                  "%"
+                ] }, level))
+              ]
+            }
+          ),
           !compact && /* @__PURE__ */ jsxs(
             "button",
             {
@@ -4973,5 +5025,5 @@ function NativeDocxEditor({
 }
 
 export { BUILTIN_TEMPLATE_NAME, CrossReferenceDialog, CrossReferencesProvider, DEFAULT_CROSS_REFERENCES_LABELS, DEFAULT_DEFINED_TERMS_LABELS, DEFINED_TERM_TRIGGER, DefinedTermsProvider, DocxAuthorContext, DocxCommentActivity, DocxEditorReview, DocxMentions, DocxParticipants, DocxRibbon, GenerateImageButton, HouseTemplateProvider, LinkHoverCard, NativeDocxEditor, builtinHouseTemplate, contentPath, editorPort, normalizeDocxExport, referenceText, referencesPort, resolveHouseTemplate, reviewModule, shortTitle, structuralPort, templateFileName, trackedOrNoted, useCrossReferences, useDefinedTerms, useHouseTemplate, useReview, useReviewItem, useTrackedOrNoted, withDirectEditing };
-//# sourceMappingURL=chunk-GMDAQIRC.js.map
-//# sourceMappingURL=chunk-GMDAQIRC.js.map
+//# sourceMappingURL=chunk-BDSKKIFZ.js.map
+//# sourceMappingURL=chunk-BDSKKIFZ.js.map