@harbour-enterprises/superdoc 1.3.1-next.3 → 1.4.0-next.2

package/dist/chunks/{index-DLX_v-vr.cjs → index-DJuBZura.cjs}

@@ -1,7 +1,7 @@
 "use strict";
 const jszip = require("./jszip-C8_CqJxM.cjs");
 const helpers$1 = require("./helpers-nOdwpmwb.cjs");
-const superEditor_converter = require("./SuperConverter-p1tQGIew.cjs");
+const superEditor_converter = require("./SuperConverter-Dy4wkQEB.cjs");
 const vue = require("./vue-De9wkgLl.cjs");
 require("./jszip.min-BPh2MMAa.cjs");
 const eventemitter3 = require("./eventemitter3-BQuRcMPI.cjs");
@@ -15457,7 +15457,7 @@ const canUseDOM = () => {
     return false;
   }
 };
-const summaryVersion = "1.3.1-next.3";
+const summaryVersion = "1.4.0-next.2";
 const nodeKeys = ["group", "content", "marks", "inline", "atom", "defining", "code", "tableRole", "summary"];
 const markKeys = ["group", "inclusive", "excludes", "spanning", "code"];
 function mapAttributes(attrs) {
@@ -18089,7 +18089,7 @@ class Editor extends EventEmitter {
    * Process collaboration migrations
    */
   processCollaborationMigrations() {
-    console.debug("[checkVersionMigrations] Current editor version", "1.3.1-next.3");
+    console.debug("[checkVersionMigrations] Current editor version", "1.4.0-next.2");
     if (!this.options.ydoc) return;
     const metaMap = this.options.ydoc.getMap("meta");
     let docVersion = metaMap.get("version");
@@ -23822,6 +23822,9 @@ const renderTableCell = (deps) => {
         imgEl.style.width = "100%";
         imgEl.style.height = "100%";
         imgEl.style.objectFit = block.objectFit ?? "contain";
+        if (block.objectFit === "cover") {
+          imgEl.style.objectPosition = "left top";
+        }
         imgEl.style.display = "block";
         imageWrapper.appendChild(imgEl);
         content.appendChild(imageWrapper);
@@ -23851,6 +23854,9 @@ const renderTableCell = (deps) => {
           img.style.width = "100%";
           img.style.height = "100%";
           img.style.objectFit = block.objectFit ?? "contain";
+          if (block.objectFit === "cover") {
+            img.style.objectPosition = "left top";
+          }
           drawingInner.appendChild(img);
         } else if (renderDrawingContent) {
           const drawingContent = renderDrawingContent(block);
@@ -26422,7 +26428,7 @@ class DomPainter {
       if (fragment.pmEnd != null) {
         fragmentEl.dataset.pmEnd = String(fragment.pmEnd);
       }
-      if (fragment.metadata) {
+      if (fragment.metadata && !block.attrs?.vmlWatermark) {
         fragmentEl.setAttribute("data-image-metadata", JSON.stringify(fragment.metadata));
       }
       const img = this.doc.createElement("img");
@@ -26433,7 +26439,28 @@ class DomPainter {
       img.style.width = "100%";
       img.style.height = "100%";
       img.style.objectFit = block.objectFit ?? "contain";
+      if (block.objectFit === "cover") {
+        img.style.objectPosition = "left top";
+      }
       img.style.display = block.display === "inline" ? "inline-block" : "block";
+      const filters = [];
+      if (block.gain != null || block.blacklevel != null) {
+        if (block.gain && typeof block.gain === "string" && block.gain.endsWith("f")) {
+          const contrast = Math.max(0, parseInt(block.gain) / 65536);
+          if (contrast > 0) {
+            filters.push(`contrast(${contrast})`);
+          }
+        }
+        if (block.blacklevel && typeof block.blacklevel === "string" && block.blacklevel.endsWith("f")) {
+          const brightness = Math.max(0, 1 + parseInt(block.blacklevel) / 327 / 100) + 0.5;
+          if (brightness > 0) {
+            filters.push(`brightness(${brightness})`);
+          }
+        }
+        if (filters.length > 0) {
+          img.style.filter = filters.join(" ");
+        }
+      }
       fragmentEl.appendChild(img);
       return fragmentEl;
     } catch (error) {
@@ -26513,6 +26540,9 @@ class DomPainter {
     img.style.width = "100%";
     img.style.height = "100%";
     img.style.objectFit = drawing.objectFit ?? "contain";
+    if (drawing.objectFit === "cover") {
+      img.style.objectPosition = "left top";
+    }
     img.style.display = "block";
     return img;
   }
@@ -31263,13 +31293,8 @@ function computeAnchorX(anchor, columnIndex, columns, imageWidth, margins, pageW
   let baseX;
   let availableWidth;
   if (relativeFrom === "page") {
-    if (columns.count === 1) {
-      baseX = contentLeft;
-      availableWidth = contentWidth;
-    } else {
-      baseX = 0;
-      availableWidth = pageWidth != null ? pageWidth : contentWidth;
-    }
+    baseX = 0;
+    availableWidth = pageWidth != null ? pageWidth : contentWidth + marginLeft + marginRight;
   } else if (relativeFrom === "margin") {
     baseX = contentLeft;
     availableWidth = contentWidth;
@@ -32758,7 +32783,9 @@ function collectPreRegisteredAnchors(blocks, measures) {
     if (!isImage && !isDrawing) continue;
     const drawingBlock = block;
     const drawingMeasure = measure;
-    if (!drawingBlock.anchor?.isAnchored) continue;
+    if (!drawingBlock.anchor?.isAnchored) {
+      continue;
+    }
     if (isPageRelativeAnchor(drawingBlock)) {
       result.push({ block: drawingBlock, measure: drawingMeasure });
     }
@@ -41868,7 +41895,13 @@ const spacingPxToPt = (spacing) => {
   const result = {};
   if (spacing.before != null) result.before = pxToPt(spacing.before);
   if (spacing.after != null) result.after = pxToPt(spacing.after);
-  if (spacing.line != null) result.line = pxToPt(spacing.line);
+  if (spacing.line != null) {
+    if (spacing.lineRule === "auto" && spacing.line > 0 && spacing.line <= MAX_AUTO_LINE_MULTIPLIER) {
+      result.line = spacing.line;
+    } else {
+      result.line = pxToPt(spacing.line);
+    }
+  }
   if (spacing.lineRule) result.lineRule = spacing.lineRule;
   return result;
 };
@@ -41892,8 +41925,13 @@ const spacingPtToPx = (spacing, rawSpacing) => {
       if (after != null) result.after = after;
     }
     if (rawSpacing.line != null) {
-      const line = ptToPx(spacing.line);
-      if (line != null) result.line = line;
+      const isAutoMultiplier = spacing.lineRule === "auto" && spacing.line != null && spacing.line > 0 && spacing.line <= MAX_AUTO_LINE_MULTIPLIER;
+      if (isAutoMultiplier) {
+        result.line = spacing.line;
+      } else {
+        const line = ptToPx(spacing.line);
+        if (line != null) result.line = line;
+      }
       if (spacing.lineRule) result.lineRule = spacing.lineRule;
     }
   }
@@ -41973,7 +42011,7 @@ const normalizeLineValue = (value, lineRule) => {
     if (value > 0 && value <= MAX_AUTO_LINE_MULTIPLIER) {
       return value;
     }
-    return twipsToPx$1(value);
+    return value / 240;
   }
   return twipsToPx$1(value);
 };
@@ -45895,8 +45933,9 @@ function imageNodeToBlock(node, nextBlockId, positions, _trackedMeta, _trackedCh
   const isInline2 = normalizedWrap?.type === "Inline" || typeof attrs.inline === "boolean" && attrs.inline;
   const display = explicitDisplay === "inline" || explicitDisplay === "block" ? explicitDisplay : isInline2 ? "inline" : "block";
   const explicitObjectFit = typeof attrs.objectFit === "string" ? attrs.objectFit : void 0;
+  const shouldCover = attrs.shouldCover === true;
   const isAnchor = anchor?.isAnchored ?? (typeof attrs.isAnchor === "boolean" ? attrs.isAnchor : false);
-  const objectFit = isAllowedObjectFit(explicitObjectFit) ? explicitObjectFit : display === "inline" ? "scale-down" : isAnchor ? "contain" : "contain";
+  const objectFit = isAllowedObjectFit(explicitObjectFit) ? explicitObjectFit : shouldCover ? "cover" : display === "inline" ? "scale-down" : isAnchor ? "contain" : "contain";
   return {
     kind: "image",
     id: nextBlockId("image"),
@@ -45911,7 +45950,10 @@ function imageNodeToBlock(node, nextBlockId, positions, _trackedMeta, _trackedCh
     margin: toBoxSpacing(attrs.marginOffset),
     anchor,
     wrap: normalizedWrap,
-    attrs: attrsWithPm
+    attrs: attrsWithPm,
+    // VML image adjustments for watermark effects
+    gain: typeof attrs.gain === "string" || typeof attrs.gain === "number" ? attrs.gain : void 0,
+    blacklevel: typeof attrs.blacklevel === "string" || typeof attrs.blacklevel === "number" ? attrs.blacklevel : void 0
   };
 }
 function handleImageNode(node, context) {
@@ -49861,11 +49903,13 @@ async function measureImageBlock(block, constraints) {
   const intrinsic = getIntrinsicImageSize(block, constraints.maxWidth);
   const isBlockBehindDoc = block.anchor?.behindDoc;
   const isBlockWrapBehindDoc = block.wrap?.type === "None" && block.wrap?.behindDoc;
-  const bypassWidthConstraint = isBlockBehindDoc || isBlockWrapBehindDoc;
+  const isPageRelativeAnchor2 = block.anchor?.isAnchored && (block.anchor?.hRelativeFrom === "page" || block.anchor?.hRelativeFrom === "margin");
+  const bypassWidthConstraint = isBlockBehindDoc || isBlockWrapBehindDoc || isPageRelativeAnchor2;
   const isWidthConstraintBypassed = bypassWidthConstraint || constraints.maxWidth <= 0;
   const maxWidth = isWidthConstraintBypassed ? intrinsic.width : constraints.maxWidth;
   const hasNegativeVerticalPosition = block.anchor?.isAnchored && (typeof block.anchor?.offsetV === "number" && block.anchor.offsetV < 0 || typeof block.margin?.top === "number" && block.margin.top < 0);
-  const maxHeight = hasNegativeVerticalPosition || !constraints.maxHeight || constraints.maxHeight <= 0 ? Infinity : constraints.maxHeight;
+  const shouldBypassHeightConstraint = hasNegativeVerticalPosition || block.objectFit === "cover";
+  const maxHeight = shouldBypassHeightConstraint || !constraints.maxHeight || constraints.maxHeight <= 0 ? Infinity : constraints.maxHeight;
   const widthScale = maxWidth / intrinsic.width;
   const heightScale = maxHeight / intrinsic.height;
   const scale = Math.min(1, widthScale, heightScale);
@@ -50114,7 +50158,8 @@ const resolveLineHeight = (spacing, baseLineHeight) => {
     return baseLineHeight;
   }
   const raw = spacing.line;
-  const treatAsMultiplier = (spacing.lineRule === "auto" || spacing.lineRule == null) && raw > 0 && raw <= 10;
+  const isAuto = spacing.lineRule === "auto";
+  const treatAsMultiplier = (isAuto || spacing.lineRule == null) && raw > 0 && (isAuto || raw <= 10);
   if (treatAsMultiplier) {
     return raw * baseLineHeight;
   }
@@ -50461,6 +50506,8 @@ class PresentationEditor extends EventEmitter {
       debugLabel: options.layoutEngineOptions?.debugLabel,
       layoutMode: options.layoutEngineOptions?.layoutMode ?? "vertical",
       trackedChanges: options.layoutEngineOptions?.trackedChanges,
+      emitCommentPositionsInViewing: options.layoutEngineOptions?.emitCommentPositionsInViewing,
+      enableCommentsInViewing: options.layoutEngineOptions?.enableCommentsInViewing,
       presence: validatedPresence
     };
     this.#trackedChangesOverrides = options.layoutEngineOptions?.trackedChanges;
@@ -51049,6 +51096,33 @@ class PresentationEditor extends EventEmitter {
       this.#scheduleRerender();
     }
   }
+  /**
+   * Update viewing-mode comment rendering behavior and re-render if needed.
+   *
+   * @param options - Viewing mode comment options.
+   */
+  setViewingCommentOptions(options = {}) {
+    if (options !== void 0 && (typeof options !== "object" || options === null || Array.isArray(options))) {
+      throw new TypeError("[PresentationEditor] setViewingCommentOptions expects an object or undefined");
+    }
+    let hasChanges = false;
+    if (typeof options.emitCommentPositionsInViewing === "boolean") {
+      if (this.#layoutOptions.emitCommentPositionsInViewing !== options.emitCommentPositionsInViewing) {
+        this.#layoutOptions.emitCommentPositionsInViewing = options.emitCommentPositionsInViewing;
+        hasChanges = true;
+      }
+    }
+    if (typeof options.enableCommentsInViewing === "boolean") {
+      if (this.#layoutOptions.enableCommentsInViewing !== options.enableCommentsInViewing) {
+        this.#layoutOptions.enableCommentsInViewing = options.enableCommentsInViewing;
+        hasChanges = true;
+      }
+    }
+    if (hasChanges) {
+      this.#pendingDocChange = true;
+      this.#scheduleRerender();
+    }
+  }
   /**
    * Toggle the custom context menu at runtime to respect host-level guardrails.
    */
@@ -53430,7 +53504,7 @@ class PresentationEditor extends EventEmitter {
         } : void 0;
         const atomNodeTypes = getAtomNodeTypes(this.#editor?.schema ?? null);
         const positionMap = this.#editor?.state?.doc && docJson ? buildPositionMapFromPmDoc(this.#editor.state.doc, docJson) : null;
-        const commentsEnabled = this.#documentMode !== "viewing";
+        const commentsEnabled = this.#documentMode !== "viewing" || this.#layoutOptions.enableCommentsInViewing === true;
         const result = toFlowBlocks(docJson, {
           mediaFiles: this.#editor?.storage?.image?.media,
           emitSectionBreaks: true,
@@ -53570,7 +53644,8 @@ class PresentationEditor extends EventEmitter {
       const payload = { layout, blocks, measures, metrics };
       this.emit("layoutUpdated", payload);
       this.emit("paginationUpdate", payload);
-      if (this.#documentMode !== "viewing") {
+      const allowViewingCommentPositions = this.#layoutOptions.emitCommentPositionsInViewing === true;
+      if (this.#documentMode !== "viewing" || allowViewingCommentPositions) {
         const commentPositions = this.#collectCommentPositions();
         const positionKeys = Object.keys(commentPositions);
         if (positionKeys.length > 0) {
@@ -64496,18 +64571,18 @@ const Image = Node$1.create({
       // Used during DOCX export to restore the original metafile format.
       originalExtension: { rendered: false },
       originalSrc: { rendered: false },
-      shouldStretch: {
+      shouldCover: {
         default: false,
         rendered: false
       },
       size: {
         default: {},
-        renderDOM: ({ size: size2, shouldStretch }) => {
+        renderDOM: ({ size: size2, shouldCover }) => {
           let style2 = "";
           let { width, height } = size2 ?? {};
           if (width) style2 += `width: ${width}px;`;
-          if (height && shouldStretch) {
-            style2 += `height: ${height}px; object-fit: fill;`;
+          if (height && shouldCover) {
+            style2 += `height: ${height}px; object-fit: cover; object-position: left top;`;
           } else if (height) style2 += "height: auto;";
           return { style: style2 };
         }
@@ -72790,6 +72865,9 @@ const nodeResizer = (nodeNames = ["image"], editor) => {
         if (!node || !nodeNames.includes(node.type.name)) {
           return DecorationSet.empty;
         }
+        if (node.attrs?.vmlWatermark === true) {
+          return DecorationSet.empty;
+        }
         const decorations = [];
         if (nodeNames.includes(selection.node?.type.name)) {
           decorations.push(
@@ -72872,6 +72950,7 @@ const nodeResizer = (nodeNames = ["image"], editor) => {
     const pos = Number.parseInt(wrapper.getAttribute("data-pos"), 10);
     const node = view.state.doc.nodeAt(pos);
     if (!nodeNames.includes(node?.type.name)) return;
+    if (node?.attrs?.vmlWatermark === true) return;
     currentWrapper = wrapper;
     resizeContainer = document.createElement("div");
     resizeContainer.className = "sd-editor-resize-container";

package/dist/chunks/{index-BQYtE-5U.cjs → index-DpgrTjYC.cjs}

@@ -1,6 +1,6 @@
 "use strict";
-const index = require("./index-DLX_v-vr.cjs");
-require("./SuperConverter-p1tQGIew.cjs");
+const index = require("./index-DJuBZura.cjs");
+require("./SuperConverter-Dy4wkQEB.cjs");
 const blankDocx = require("./blank-docx-DfW3Eeh2.cjs");
 const eventemitter3 = require("./eventemitter3-BQuRcMPI.cjs");
 const provider = require("@hocuspocus/provider");
@@ -5161,6 +5161,11 @@ const useCommentsStore = /* @__PURE__ */ defineStore("comments", () => {
     allowResolve: true,
     showResolved: false
   });
+  const viewingVisibility = vue.reactive({
+    documentMode: "editing",
+    commentsVisible: false,
+    trackChangesVisible: false
+  });
   const isDebugging = false;
   const debounceTimers = {};
   const COMMENT_EVENTS = index.comments_module_events;
@@ -5187,6 +5192,7 @@ const useCommentsStore = /* @__PURE__ */ defineStore("comments", () => {
   const isFloatingCommentsReady = vue.ref(false);
   const generalCommentIds = vue.ref([]);
   const pendingComment = vue.ref(null);
+  const isViewingMode = vue.computed(() => viewingVisibility.documentMode === "viewing");
   const init = (config = {}) => {
     const updatedConfig = { ...commentsConfig, ...config };
     Object.assign(commentsConfig, updatedConfig);
@@ -5199,6 +5205,17 @@ const useCommentsStore = /* @__PURE__ */ defineStore("comments", () => {
     if (id === void 0 || id === null) return null;
     return commentsList.value.find((c) => c.commentId == id || c.importedId == id);
   };
+  const getThreadParent = (comment) => {
+    if (!comment?.parentCommentId) return comment;
+    return getComment(comment.parentCommentId);
+  };
+  const isThreadVisible = (comment) => {
+    if (!isViewingMode.value) return true;
+    const parent = getThreadParent(comment);
+    if (!parent && comment?.parentCommentId) return false;
+    const isTrackedChange = Boolean(parent?.trackedChange);
+    return isTrackedChange ? viewingVisibility.trackChangesVisible : viewingVisibility.commentsVisible;
+  };
   const setActiveComment = (superdoc, id) => {
     if (id === void 0 || id === null) {
       activeComment.value = null;
@@ -5300,6 +5317,7 @@ const useCommentsStore = /* @__PURE__ */ defineStore("comments", () => {
     const resolvedComments = [];
     const childCommentMap = /* @__PURE__ */ new Map();
     commentsList.value.forEach((comment) => {
+      if (!isThreadVisible(comment)) return;
       if (comment.resolvedTime) {
         resolvedComments.push(comment);
       } else if (!comment.parentCommentId && !comment.resolvedTime) {
@@ -5508,6 +5526,17 @@ const useCommentsStore = /* @__PURE__ */ defineStore("comments", () => {
     });
     return comments;
   });
+  const setViewingVisibility = ({ documentMode, commentsVisible, trackChangesVisible } = {}) => {
+    if (typeof documentMode === "string") {
+      viewingVisibility.documentMode = documentMode;
+    }
+    if (typeof commentsVisible === "boolean") {
+      viewingVisibility.commentsVisible = commentsVisible;
+    }
+    if (typeof trackChangesVisible === "boolean") {
+      viewingVisibility.trackChangesVisible = trackChangesVisible;
+    }
+  };
   const normalizeCommentForEditor = (node) => {
     if (!node || typeof node !== "object") return node;
     const cloneMarks = (marks) => Array.isArray(marks) ? marks.filter(Boolean).map((mark) => ({
@@ -5587,6 +5616,7 @@ const useCommentsStore = /* @__PURE__ */ defineStore("comments", () => {
     getFloatingComments,
     // Actions
     init,
+    setViewingVisibility,
     getComment,
     setActiveComment,
     getCommentLocation,
@@ -6576,7 +6606,7 @@ const _sfc_main$a = {
     const superdocStore = useSuperdocStore();
     const commentsStore = useCommentsStore();
     const { COMMENT_EVENTS } = commentsStore;
-    const { documentsWithConverations, activeComment, floatingCommentsOffset, commentsList } = storeToRefs(commentsStore);
+    const { documentsWithConverations, activeComment, floatingCommentsOffset, getGroupedComments } = storeToRefs(commentsStore);
     const { documents, activeZoom } = storeToRefs(superdocStore);
     const { proxy } = vue.getCurrentInstance();
     const emit = __emit;
@@ -6638,7 +6668,7 @@ const _sfc_main$a = {
       emit("highlight-click", comment);
     };
     const getCurrentComments = vue.computed(() => {
-      return commentsList.value.filter((c) => !c.parentCommentId).filter((c) => c.selection && c.selection.selectionBounds?.top).filter((c) => !c.resolvedTime).filter((c) => c.selection?.source !== "super-editor");
+      return getGroupedComments.value?.parentComments.filter((c) => c.selection && c.selection.selectionBounds?.top).filter((c) => !c.resolvedTime).filter((c) => c.selection?.source !== "super-editor");
     });
     vue.watch(activeComment, (newVal) => {
       if (!newVal) return;
@@ -6666,7 +6696,7 @@ const _sfc_main$a = {
     };
   }
 };
-const CommentsLayer = /* @__PURE__ */ index._export_sfc(_sfc_main$a, [["__scopeId", "data-v-d019784c"]]);
+const CommentsLayer = /* @__PURE__ */ index._export_sfc(_sfc_main$a, [["__scopeId", "data-v-7d21d613"]]);
 const _hoisted_1$8 = { class: "sidebar-container calculation-container" };
 const _hoisted_2$3 = ["id"];
 const _sfc_main$9 = {
@@ -7466,7 +7496,7 @@ const _sfc_main = {
   __name: "SuperDoc",
   emits: ["selection-update"],
   setup(__props, { emit: __emit }) {
-    const PdfViewer = vue.defineAsyncComponent(() => Promise.resolve().then(() => require("./PdfViewer-BXbmY3Fc.cjs")));
+    const PdfViewer = vue.defineAsyncComponent(() => Promise.resolve().then(() => require("./PdfViewer-DqN1vOXI.cjs")));
     const superdocStore = useSuperdocStore();
     const commentsStore = useCommentsStore();
     const {
@@ -7508,6 +7538,16 @@ const _sfc_main = {
     const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode();
     const { uiFontFamily } = useUiFontFamily();
     const isViewingMode = () => proxy?.$superdoc?.config?.documentMode === "viewing";
+    const isViewingCommentsVisible = vue.computed(
+      () => isViewingMode() && proxy?.$superdoc?.config?.comments?.visible === true
+    );
+    const isViewingTrackChangesVisible = vue.computed(
+      () => isViewingMode() && proxy?.$superdoc?.config?.trackChanges?.visible === true
+    );
+    const shouldRenderCommentsInViewing = vue.computed(() => {
+      if (!isViewingMode()) return true;
+      return isViewingCommentsVisible.value || isViewingTrackChangesVisible.value;
+    });
     const commentsModuleConfig = vue.computed(() => {
       const config = modules.comments;
       if (config === false || config == null) return null;
@@ -7602,7 +7642,7 @@ const _sfc_main = {
         const commentsConfig = proxy.$superdoc.config.modules?.comments;
         if (!commentsConfig || commentsConfig === false) return;
         if (!positions || Object.keys(positions).length === 0) return;
-        if (isViewingMode()) {
+        if (!shouldRenderCommentsInViewing.value) {
           commentsStore.clearEditorCommentPositions?.();
           return;
         }
@@ -7797,7 +7837,9 @@ const _sfc_main = {
         layoutEngineOptions: useLayoutEngine ? {
           ...proxy.$superdoc.config.layoutEngineOptions || {},
           debugLabel: proxy.$superdoc.config.layoutEngineOptions?.debugLabel ?? doc.name ?? doc.id,
-          zoom: (activeZoom.value ?? 100) / 100
+          zoom: (activeZoom.value ?? 100) / 100,
+          emitCommentPositionsInViewing: isViewingMode() && shouldRenderCommentsInViewing.value,
+          enableCommentsInViewing: isViewingCommentsVisible.value
         } : void 0,
         permissionResolver: (payload = {}) => proxy.$superdoc.canPerformPermission({
           role: proxy.$superdoc.config.role,
@@ -7810,7 +7852,7 @@ const _sfc_main = {
     const onEditorCommentLocationsUpdate = (doc, { allCommentIds: activeThreadId, allCommentPositions } = {}) => {
       const commentsConfig = proxy.$superdoc.config.modules?.comments;
       if (!commentsConfig || commentsConfig === false) return;
-      if (isViewingMode()) {
+      if (!shouldRenderCommentsInViewing.value) {
         commentsStore.clearEditorCommentPositions?.();
         return;
       }
@@ -7869,7 +7911,7 @@ const _sfc_main = {
     };
     const isCommentsEnabled = vue.computed(() => Boolean(commentsModuleConfig.value));
     const showCommentsSidebar = vue.computed(() => {
-      if (isViewingMode()) return false;
+      if (!shouldRenderCommentsInViewing.value) return false;
       return pendingComment.value || getFloatingComments.value?.length > 0 && isReady.value && layers.value && isCommentsEnabled.value && !isCommentsListVisible.value;
     });
     const showToolsFloatingMenu = vue.computed(() => {
@@ -8211,7 +8253,7 @@ const _sfc_main = {
     };
   }
 };
-const App = /* @__PURE__ */ index._export_sfc(_sfc_main, [["__scopeId", "data-v-5196811d"]]);
+const App = /* @__PURE__ */ index._export_sfc(_sfc_main, [["__scopeId", "data-v-78737564"]]);
 const createSuperdocVueApp = () => {
   const app = vue.createApp(App);
   const pinia = createPinia();
@@ -8317,6 +8359,8 @@ class SuperDoc extends eventemitter3.EventEmitter {
     title: "SuperDoc",
     conversations: [],
     isInternal: false,
+    comments: { visible: false },
+    trackChanges: { visible: false },
     // toolbar config
     toolbar: null,
     // Optional DOM element to render the toolbar in
@@ -8366,6 +8410,16 @@ class SuperDoc extends eventemitter3.EventEmitter {
       ...this.config,
       ...config
     };
+    if (!this.config.comments || typeof this.config.comments !== "object") {
+      this.config.comments = { visible: false };
+    } else if (typeof this.config.comments.visible !== "boolean") {
+      this.config.comments.visible = false;
+    }
+    if (!this.config.trackChanges || typeof this.config.trackChanges !== "object") {
+      this.config.trackChanges = { visible: false };
+    } else if (typeof this.config.trackChanges.visible !== "boolean") {
+      this.config.trackChanges.visible = false;
+    }
     const incomingUser = this.config.user;
     if (!incomingUser || typeof incomingUser !== "object") {
       this.config.user = { ...DEFAULT_USER };
@@ -8383,9 +8437,10 @@ class SuperDoc extends eventemitter3.EventEmitter {
     }
     if (!this.config.layoutEngineOptions.trackedChanges) {
       const isViewingMode = this.config.documentMode === "viewing";
+      const viewingTrackedChangesVisible = isViewingMode && this.config.trackChanges?.visible === true;
       this.config.layoutEngineOptions.trackedChanges = {
-        mode: isViewingMode ? "final" : "review",
-        enabled: !isViewingMode
+        mode: isViewingMode ? viewingTrackedChangesVisible ? "review" : "original" : "review",
+        enabled: true
       };
     }
     this.config.modules = this.config.modules || {};
@@ -8395,7 +8450,7 @@ class SuperDoc extends eventemitter3.EventEmitter {
     this.config.colors = shuffleArray(this.config.colors);
     this.userColorMap = /* @__PURE__ */ new Map();
     this.colorIndex = 0;
-    this.version = "1.3.1-next.3";
+    this.version = "1.4.0-next.2";
     this.#log("🦋 [superdoc] Using SuperDoc version:", this.version);
     this.superdocId = config.superdocId || uuid.v4();
     this.colors = this.config.colors;
@@ -8532,6 +8587,7 @@ class SuperDoc extends eventemitter3.EventEmitter {
     this.superdocStore.init(this.config);
     const commentsModuleConfig = this.config.modules.comments;
     this.commentsStore.init(commentsModuleConfig && commentsModuleConfig !== false ? commentsModuleConfig : {});
+    this.#syncViewingVisibility();
   }
   #initListeners() {
     this.on("editorBeforeCreate", this.config.onEditorBeforeCreate);
@@ -8833,6 +8889,7 @@ class SuperDoc extends eventemitter3.EventEmitter {
     if (!type) return;
     type = type.toLowerCase();
     this.config.documentMode = type;
+    this.#syncViewingVisibility();
     const types = {
       viewing: () => this.#setModeViewing(),
       editing: () => this.#setModeEditing(),
@@ -8912,10 +8969,20 @@ class SuperDoc extends eventemitter3.EventEmitter {
   }
   #setModeViewing() {
     this.toolbar.activeEditor = null;
-    this.setTrackedChangesPreferences({ mode: "original", enabled: true });
-    this.commentsStore?.clearEditorCommentPositions?.();
+    const commentsVisible = this.config.comments?.visible === true;
+    const trackChangesVisible = this.config.trackChanges?.visible === true;
+    this.setTrackedChangesPreferences(
+      trackChangesVisible ? { mode: "review", enabled: true } : { mode: "original", enabled: true }
+    );
+    if (!commentsVisible && !trackChangesVisible) {
+      this.commentsStore?.clearEditorCommentPositions?.();
+    }
     this.superdocStore.documents.forEach((doc) => {
-      doc.removeComments();
+      if (commentsVisible || trackChangesVisible) {
+        doc.restoreComments();
+      } else {
+        doc.removeComments();
+      }
       this.#applyDocumentMode(doc, "viewing");
     });
     if (this.toolbar) {
@@ -8923,6 +8990,31 @@ class SuperDoc extends eventemitter3.EventEmitter {
       this.toolbar.updateToolbarState();
     }
   }
+  #syncViewingVisibility() {
+    const commentsVisible = this.config.comments?.visible === true;
+    const trackChangesVisible = this.config.trackChanges?.visible === true;
+    const isViewingMode = this.config.documentMode === "viewing";
+    const shouldRenderCommentsInViewing = commentsVisible || trackChangesVisible;
+    if (this.commentsStore?.setViewingVisibility) {
+      this.commentsStore.setViewingVisibility({
+        documentMode: this.config.documentMode,
+        commentsVisible,
+        trackChangesVisible
+      });
+    }
+    const docs = this.superdocStore?.documents;
+    if (Array.isArray(docs) && docs.length > 0) {
+      docs.forEach((doc) => {
+        const presentationEditor = typeof doc.getPresentationEditor === "function" ? doc.getPresentationEditor() : null;
+        if (presentationEditor?.setViewingCommentOptions) {
+          presentationEditor.setViewingCommentOptions({
+            emitCommentPositionsInViewing: isViewingMode && shouldRenderCommentsInViewing,
+            enableCommentsInViewing: isViewingMode && commentsVisible
+          });
+        }
+      });
+    }
+  }
   /**
    * Search for text or regex in the active editor
    * @param {string | RegExp} text The text or regex to search for