superdoc 1.12.0-next.12 → 1.12.0-next.13

package/dist/chunks/{index-DQM5dy3Q.cjs → index-BF7DfWLs.cjs}

@@ -1,5 +1,5 @@
 "use strict";
-const superEditor_converter = require("./SuperConverter-C4uBfLso.cjs");
+const superEditor_converter = require("./SuperConverter-BMjvGr5r.cjs");
 const helpers$1 = require("./helpers-OFep8CYR.cjs");
 const vue = require("./vue-BkoOkkmT.cjs");
 require("./jszip.min-oAFpNMh5.cjs");
@@ -993,7 +993,7 @@ const DEFAULT_ENDPOINT = "https://ingest.superdoc.dev/v1/collect";
 const COMMUNITY_LICENSE_KEY = "community-and-eval-agplv3";
 function getSuperdocVersion() {
   try {
-    return true ? "1.12.0-next.12" : "unknown";
+    return true ? "1.12.0-next.13" : "unknown";
   } catch {
     return "unknown";
   }
@@ -17068,7 +17068,7 @@ const canUseDOM = () => {
     return false;
   }
 };
-const summaryVersion = "1.12.0-next.12";
+const summaryVersion = "1.12.0-next.13";
 const nodeKeys = ["group", "content", "marks", "inline", "atom", "defining", "code", "tableRole", "summary"];
 const markKeys = ["group", "inclusive", "excludes", "spanning", "code"];
 function mapAttributes(attrs) {
@@ -19872,7 +19872,7 @@ class Editor extends EventEmitter {
    * Process collaboration migrations
    */
   processCollaborationMigrations() {
-    console.debug("[checkVersionMigrations] Current editor version", "1.12.0-next.12");
+    console.debug("[checkVersionMigrations] Current editor version", "1.12.0-next.13");
     if (!this.options.ydoc) return;
     const metaMap = this.options.ydoc.getMap("meta");
     let docVersion = metaMap.get("version");
@@ -20050,6 +20050,300 @@ class Editor extends EventEmitter {
     this.#renderer?.initDevTools?.(this);
   }
 }
+function getEditorSurfaceElement(editor) {
+  if (!editor) return null;
+  if (typeof editor.hitTest === "function" && editor.element instanceof HTMLElement) {
+    return editor.element;
+  }
+  return editor.presentationEditor?.element ?? editor.view?.dom ?? editor.options?.element ?? null;
+}
+function getSurfaceRelativePoint(editor, eventLocation = {}) {
+  const surface = getEditorSurfaceElement(editor);
+  if (!surface) return null;
+  const rect = surface.getBoundingClientRect();
+  let left2;
+  let top2;
+  if (typeof eventLocation.clientX === "number" && typeof eventLocation.clientY === "number") {
+    left2 = eventLocation.clientX - rect.left;
+    top2 = eventLocation.clientY - rect.top;
+  } else if (editor?.state?.selection) {
+    const selectionFrom = editor.state.selection.from;
+    const coords = editor.coordsAtPos?.(selectionFrom);
+    if (coords) {
+      left2 = coords.left - rect.left;
+      top2 = coords.top - rect.top;
+    }
+  }
+  if (!Number.isFinite(left2) || !Number.isFinite(top2)) {
+    return null;
+  }
+  return { left: left2, top: top2 };
+}
+function findContainingBlockAncestor(element) {
+  if (!element) return null;
+  let current = element.parentElement;
+  while (current && current !== document.body && current !== document.documentElement) {
+    try {
+      const style2 = window.getComputedStyle(current);
+      const transform = style2.transform;
+      const filter = style2.filter;
+      const backdropFilter = style2.backdropFilter || style2.webkitBackdropFilter;
+      const perspective = style2.perspective;
+      const willChange = style2.willChange;
+      const contain = style2.contain;
+      if (transform && transform !== "none") {
+        return current;
+      }
+      if (filter && filter !== "none") {
+        return current;
+      }
+      if (backdropFilter && backdropFilter !== "none") {
+        return current;
+      }
+      if (perspective && perspective !== "none") {
+        return current;
+      }
+      if (willChange && willChange !== "auto") {
+        const values = willChange.split(",").map((v) => v.trim());
+        if (values.includes("transform") || values.includes("perspective")) {
+          return current;
+        }
+      }
+      if (contain && /paint|layout|strict|content/.test(contain)) {
+        return current;
+      }
+    } catch (error) {
+      console.warn("SlashMenu: Failed to get computed style for element", current, error);
+    }
+    current = current.parentElement;
+  }
+  return null;
+}
+const SlashMenuPluginKey = new superEditor_converter.PluginKey("slashMenu");
+const MENU_OFFSET_X = 100;
+const MENU_OFFSET_Y = 28;
+const CONTEXT_MENU_OFFSET_X = 10;
+const CONTEXT_MENU_OFFSET_Y = 10;
+const SLASH_COOLDOWN_MS = 5e3;
+const SlashMenu = Extension.create({
+  name: "slashMenu",
+  /**
+   * Initialize default options for the SlashMenu extension
+   * @returns {SlashMenuOptions} Empty options object (configuration is inherited from editor options)
+   */
+  addOptions() {
+    return {};
+  },
+  addPmPlugins() {
+    const editor = this.editor;
+    if (editor.options?.isHeadless) {
+      return [];
+    }
+    let slashCooldown = false;
+    let slashCooldownTimeout = null;
+    const isMenuDisabled = () => Boolean(editor.options?.disableContextMenu);
+    const ensureStateShape = (value = {}) => ({
+      open: false,
+      selected: null,
+      anchorPos: null,
+      menuPosition: null,
+      disabled: isMenuDisabled(),
+      ...value
+    });
+    const slashMenuPlugin = new superEditor_converter.Plugin({
+      key: SlashMenuPluginKey,
+      state: {
+        init: () => ensureStateShape(),
+        /**
+         * Apply transaction to update plugin state
+         * Handles state transitions based on transaction metadata:
+         * - 'open': Opens menu at specified position or cursor location
+         * - 'select': Updates the selected menu item
+         * - 'close': Closes the menu and clears anchor position
+         * - 'updatePosition': Triggers menu position recalculation (no-op in apply)
+         *
+         * @param {import('prosemirror-state').Transaction} tr - The transaction
+         * @param {SlashMenuState} value - Previous plugin state
+         * @returns {SlashMenuState} New plugin state
+         */
+        apply(tr, value) {
+          const meta = tr.getMeta(SlashMenuPluginKey);
+          const disabled = isMenuDisabled();
+          if (disabled) {
+            if (value.open) {
+              editor.emit("slashMenu:close");
+            }
+            return ensureStateShape({ disabled: true });
+          }
+          if (!meta) {
+            if (value.disabled !== disabled) {
+              return ensureStateShape({ ...value, disabled });
+            }
+            return value;
+          }
+          switch (meta.type) {
+            case "open": {
+              if (typeof meta.pos !== "number" || meta.pos < 0 || meta.pos > tr.doc.content.size) {
+                console.warn("SlashMenu: Invalid position", meta.pos);
+                return ensureStateShape(value);
+              }
+              let left2 = 0;
+              let top2 = 0;
+              let isContextMenu = false;
+              if (typeof meta.clientX === "number" && typeof meta.clientY === "number") {
+                left2 = meta.clientX;
+                top2 = meta.clientY;
+                isContextMenu = true;
+              } else {
+                const relativePoint = getSurfaceRelativePoint(editor, meta);
+                if (relativePoint) {
+                  const surface = editor.presentationEditor?.element ?? editor.view?.dom ?? editor.options?.element;
+                  if (surface) {
+                    try {
+                      const rect = surface.getBoundingClientRect();
+                      left2 = rect.left + relativePoint.left;
+                      top2 = rect.top + relativePoint.top;
+                    } catch (error) {
+                      console.warn("SlashMenu: Failed to get surface bounds", error);
+                      return ensureStateShape(value);
+                    }
+                  }
+                }
+              }
+              const menuSurface = editor.presentationEditor?.element ?? editor.view?.dom ?? editor.options?.element;
+              const containingBlock = findContainingBlockAncestor(menuSurface);
+              if (containingBlock) {
+                try {
+                  const cbRect = containingBlock.getBoundingClientRect();
+                  left2 -= cbRect.left;
+                  top2 -= cbRect.top;
+                  left2 += containingBlock.scrollLeft || 0;
+                  top2 += containingBlock.scrollTop || 0;
+                } catch (error) {
+                  console.warn("SlashMenu: Failed to adjust for containing block", error);
+                }
+              }
+              const offsetX = isContextMenu ? CONTEXT_MENU_OFFSET_X : MENU_OFFSET_X;
+              const offsetY = isContextMenu ? CONTEXT_MENU_OFFSET_Y : MENU_OFFSET_Y;
+              const menuPosition = {
+                left: `${left2 + offsetX}px`,
+                top: `${top2 + offsetY}px`
+              };
+              const newState = {
+                ...value,
+                open: true,
+                anchorPos: meta.pos,
+                menuPosition
+              };
+              editor.emit("slashMenu:open", { menuPosition });
+              return ensureStateShape(newState);
+            }
+            case "select": {
+              return ensureStateShape({ ...value, selected: meta.id });
+            }
+            case "close": {
+              editor.emit("slashMenu:close");
+              return ensureStateShape({ ...value, open: false, anchorPos: null });
+            }
+            default:
+              return ensureStateShape({ ...value, disabled });
+          }
+        }
+      },
+      /**
+       * Create view plugin to handle window event listeners
+       * @param {import('prosemirror-view').EditorView} editorView - The ProseMirror editor view
+       * @returns {Object} View plugin with destroy method
+       */
+      view(editorView) {
+        const updatePosition2 = () => {
+          if (isMenuDisabled()) return;
+          const state = SlashMenuPluginKey.getState(editorView.state);
+          if (state.open) {
+            editorView.dispatch(
+              editorView.state.tr.setMeta(SlashMenuPluginKey, {
+                type: "updatePosition"
+              })
+            );
+          }
+        };
+        window.addEventListener("scroll", updatePosition2, true);
+        window.addEventListener("resize", updatePosition2);
+        return {
+          destroy() {
+            window.removeEventListener("scroll", updatePosition2, true);
+            window.removeEventListener("resize", updatePosition2);
+            if (slashCooldownTimeout) {
+              clearTimeout(slashCooldownTimeout);
+              slashCooldownTimeout = null;
+            }
+          }
+        };
+      },
+      props: {
+        /**
+         * Handle keyboard events to open/close the slash menu
+         * - '/': Opens menu at cursor if conditions are met (in paragraph, after space/start)
+         * - 'Escape' or 'ArrowLeft': Closes menu and restores cursor position
+         *
+         * @param {import('prosemirror-view').EditorView} view - The ProseMirror editor view
+         * @param {KeyboardEvent} event - The keyboard event
+         * @returns {boolean} True if the event was handled, false otherwise
+         */
+        handleKeyDown(view, event) {
+          if (isMenuDisabled()) {
+            return false;
+          }
+          const pluginState = this.getState(view.state);
+          if (event.key === "/" && slashCooldown) {
+            return false;
+          }
+          if (event.key === "/" && !pluginState.open) {
+            const { $cursor } = view.state.selection;
+            if (!$cursor) return false;
+            const isParagraph = $cursor.parent.type.name === "paragraph";
+            if (!isParagraph) return false;
+            const textBefore = $cursor.parent.textContent.slice(0, $cursor.parentOffset);
+            const isEmptyOrAfterSpace = !textBefore || textBefore.endsWith(" ");
+            if (!isEmptyOrAfterSpace) return false;
+            event.preventDefault();
+            slashCooldown = true;
+            if (slashCooldownTimeout) clearTimeout(slashCooldownTimeout);
+            slashCooldownTimeout = setTimeout(() => {
+              slashCooldown = false;
+              slashCooldownTimeout = null;
+            }, SLASH_COOLDOWN_MS);
+            view.dispatch(
+              view.state.tr.setMeta(SlashMenuPluginKey, {
+                type: "open",
+                pos: $cursor.pos
+              })
+            );
+            return true;
+          }
+          if (pluginState.open && (event.key === "Escape" || event.key === "ArrowLeft")) {
+            const { anchorPos } = pluginState;
+            view.dispatch(
+              view.state.tr.setMeta(SlashMenuPluginKey, {
+                type: "close"
+              })
+            );
+            if (anchorPos !== null) {
+              const tr = view.state.tr.setSelection(
+                view.state.selection.constructor.near(view.state.doc.resolve(anchorPos))
+              );
+              view.dispatch(tr);
+              view.focus();
+            }
+            return true;
+          }
+          return false;
+        }
+      }
+    });
+    return [slashMenuPlugin];
+  }
+});
 let readFromCache;
 let addToCache;
 if (typeof WeakMap != "undefined") {
@@ -64367,7 +64661,8 @@ class PresentationEditor extends EventEmitter {
     }
     const activeEditor = this.getActiveEditor();
     const hasFocus = activeEditor?.view?.hasFocus?.() ?? false;
-    if (!hasFocus) {
+    const slashMenuOpen = activeEditor?.state ? !!SlashMenuPluginKey.getState(activeEditor.state)?.open : false;
+    if (!hasFocus && !slashMenuOpen) {
       try {
         this.#clearSelectedFieldAnnotationClass();
         this.#localSelectionLayer.innerHTML = "";
@@ -66604,300 +66899,6 @@ const processAiHighlights = (editor, doc2, highlightColor, customClass = null) =
   });
   return { decorations };
 };
-function getEditorSurfaceElement(editor) {
-  if (!editor) return null;
-  if (typeof editor.hitTest === "function" && editor.element instanceof HTMLElement) {
-    return editor.element;
-  }
-  return editor.presentationEditor?.element ?? editor.view?.dom ?? editor.options?.element ?? null;
-}
-function getSurfaceRelativePoint(editor, eventLocation = {}) {
-  const surface = getEditorSurfaceElement(editor);
-  if (!surface) return null;
-  const rect = surface.getBoundingClientRect();
-  let left2;
-  let top2;
-  if (typeof eventLocation.clientX === "number" && typeof eventLocation.clientY === "number") {
-    left2 = eventLocation.clientX - rect.left;
-    top2 = eventLocation.clientY - rect.top;
-  } else if (editor?.state?.selection) {
-    const selectionFrom = editor.state.selection.from;
-    const coords = editor.coordsAtPos?.(selectionFrom);
-    if (coords) {
-      left2 = coords.left - rect.left;
-      top2 = coords.top - rect.top;
-    }
-  }
-  if (!Number.isFinite(left2) || !Number.isFinite(top2)) {
-    return null;
-  }
-  return { left: left2, top: top2 };
-}
-function findContainingBlockAncestor(element) {
-  if (!element) return null;
-  let current = element.parentElement;
-  while (current && current !== document.body && current !== document.documentElement) {
-    try {
-      const style2 = window.getComputedStyle(current);
-      const transform = style2.transform;
-      const filter = style2.filter;
-      const backdropFilter = style2.backdropFilter || style2.webkitBackdropFilter;
-      const perspective = style2.perspective;
-      const willChange = style2.willChange;
-      const contain = style2.contain;
-      if (transform && transform !== "none") {
-        return current;
-      }
-      if (filter && filter !== "none") {
-        return current;
-      }
-      if (backdropFilter && backdropFilter !== "none") {
-        return current;
-      }
-      if (perspective && perspective !== "none") {
-        return current;
-      }
-      if (willChange && willChange !== "auto") {
-        const values = willChange.split(",").map((v) => v.trim());
-        if (values.includes("transform") || values.includes("perspective")) {
-          return current;
-        }
-      }
-      if (contain && /paint|layout|strict|content/.test(contain)) {
-        return current;
-      }
-    } catch (error) {
-      console.warn("SlashMenu: Failed to get computed style for element", current, error);
-    }
-    current = current.parentElement;
-  }
-  return null;
-}
-const SlashMenuPluginKey = new superEditor_converter.PluginKey("slashMenu");
-const MENU_OFFSET_X = 100;
-const MENU_OFFSET_Y = 28;
-const CONTEXT_MENU_OFFSET_X = 10;
-const CONTEXT_MENU_OFFSET_Y = 10;
-const SLASH_COOLDOWN_MS = 5e3;
-const SlashMenu = Extension.create({
-  name: "slashMenu",
-  /**
-   * Initialize default options for the SlashMenu extension
-   * @returns {SlashMenuOptions} Empty options object (configuration is inherited from editor options)
-   */
-  addOptions() {
-    return {};
-  },
-  addPmPlugins() {
-    const editor = this.editor;
-    if (editor.options?.isHeadless) {
-      return [];
-    }
-    let slashCooldown = false;
-    let slashCooldownTimeout = null;
-    const isMenuDisabled = () => Boolean(editor.options?.disableContextMenu);
-    const ensureStateShape = (value = {}) => ({
-      open: false,
-      selected: null,
-      anchorPos: null,
-      menuPosition: null,
-      disabled: isMenuDisabled(),
-      ...value
-    });
-    const slashMenuPlugin = new superEditor_converter.Plugin({
-      key: SlashMenuPluginKey,
-      state: {
-        init: () => ensureStateShape(),
-        /**
-         * Apply transaction to update plugin state
-         * Handles state transitions based on transaction metadata:
-         * - 'open': Opens menu at specified position or cursor location
-         * - 'select': Updates the selected menu item
-         * - 'close': Closes the menu and clears anchor position
-         * - 'updatePosition': Triggers menu position recalculation (no-op in apply)
-         *
-         * @param {import('prosemirror-state').Transaction} tr - The transaction
-         * @param {SlashMenuState} value - Previous plugin state
-         * @returns {SlashMenuState} New plugin state
-         */
-        apply(tr, value) {
-          const meta = tr.getMeta(SlashMenuPluginKey);
-          const disabled = isMenuDisabled();
-          if (disabled) {
-            if (value.open) {
-              editor.emit("slashMenu:close");
-            }
-            return ensureStateShape({ disabled: true });
-          }
-          if (!meta) {
-            if (value.disabled !== disabled) {
-              return ensureStateShape({ ...value, disabled });
-            }
-            return value;
-          }
-          switch (meta.type) {
-            case "open": {
-              if (typeof meta.pos !== "number" || meta.pos < 0 || meta.pos > tr.doc.content.size) {
-                console.warn("SlashMenu: Invalid position", meta.pos);
-                return ensureStateShape(value);
-              }
-              let left2 = 0;
-              let top2 = 0;
-              let isContextMenu = false;
-              if (typeof meta.clientX === "number" && typeof meta.clientY === "number") {
-                left2 = meta.clientX;
-                top2 = meta.clientY;
-                isContextMenu = true;
-              } else {
-                const relativePoint = getSurfaceRelativePoint(editor, meta);
-                if (relativePoint) {
-                  const surface = editor.presentationEditor?.element ?? editor.view?.dom ?? editor.options?.element;
-                  if (surface) {
-                    try {
-                      const rect = surface.getBoundingClientRect();
-                      left2 = rect.left + relativePoint.left;
-                      top2 = rect.top + relativePoint.top;
-                    } catch (error) {
-                      console.warn("SlashMenu: Failed to get surface bounds", error);
-                      return ensureStateShape(value);
-                    }
-                  }
-                }
-              }
-              const menuSurface = editor.presentationEditor?.element ?? editor.view?.dom ?? editor.options?.element;
-              const containingBlock = findContainingBlockAncestor(menuSurface);
-              if (containingBlock) {
-                try {
-                  const cbRect = containingBlock.getBoundingClientRect();
-                  left2 -= cbRect.left;
-                  top2 -= cbRect.top;
-                  left2 += containingBlock.scrollLeft || 0;
-                  top2 += containingBlock.scrollTop || 0;
-                } catch (error) {
-                  console.warn("SlashMenu: Failed to adjust for containing block", error);
-                }
-              }
-              const offsetX = isContextMenu ? CONTEXT_MENU_OFFSET_X : MENU_OFFSET_X;
-              const offsetY = isContextMenu ? CONTEXT_MENU_OFFSET_Y : MENU_OFFSET_Y;
-              const menuPosition = {
-                left: `${left2 + offsetX}px`,
-                top: `${top2 + offsetY}px`
-              };
-              const newState = {
-                ...value,
-                open: true,
-                anchorPos: meta.pos,
-                menuPosition
-              };
-              editor.emit("slashMenu:open", { menuPosition });
-              return ensureStateShape(newState);
-            }
-            case "select": {
-              return ensureStateShape({ ...value, selected: meta.id });
-            }
-            case "close": {
-              editor.emit("slashMenu:close");
-              return ensureStateShape({ ...value, open: false, anchorPos: null });
-            }
-            default:
-              return ensureStateShape({ ...value, disabled });
-          }
-        }
-      },
-      /**
-       * Create view plugin to handle window event listeners
-       * @param {import('prosemirror-view').EditorView} editorView - The ProseMirror editor view
-       * @returns {Object} View plugin with destroy method
-       */
-      view(editorView) {
-        const updatePosition2 = () => {
-          if (isMenuDisabled()) return;
-          const state = SlashMenuPluginKey.getState(editorView.state);
-          if (state.open) {
-            editorView.dispatch(
-              editorView.state.tr.setMeta(SlashMenuPluginKey, {
-                type: "updatePosition"
-              })
-            );
-          }
-        };
-        window.addEventListener("scroll", updatePosition2, true);
-        window.addEventListener("resize", updatePosition2);
-        return {
-          destroy() {
-            window.removeEventListener("scroll", updatePosition2, true);
-            window.removeEventListener("resize", updatePosition2);
-            if (slashCooldownTimeout) {
-              clearTimeout(slashCooldownTimeout);
-              slashCooldownTimeout = null;
-            }
-          }
-        };
-      },
-      props: {
-        /**
-         * Handle keyboard events to open/close the slash menu
-         * - '/': Opens menu at cursor if conditions are met (in paragraph, after space/start)
-         * - 'Escape' or 'ArrowLeft': Closes menu and restores cursor position
-         *
-         * @param {import('prosemirror-view').EditorView} view - The ProseMirror editor view
-         * @param {KeyboardEvent} event - The keyboard event
-         * @returns {boolean} True if the event was handled, false otherwise
-         */
-        handleKeyDown(view, event) {
-          if (isMenuDisabled()) {
-            return false;
-          }
-          const pluginState = this.getState(view.state);
-          if (event.key === "/" && slashCooldown) {
-            return false;
-          }
-          if (event.key === "/" && !pluginState.open) {
-            const { $cursor } = view.state.selection;
-            if (!$cursor) return false;
-            const isParagraph = $cursor.parent.type.name === "paragraph";
-            if (!isParagraph) return false;
-            const textBefore = $cursor.parent.textContent.slice(0, $cursor.parentOffset);
-            const isEmptyOrAfterSpace = !textBefore || textBefore.endsWith(" ");
-            if (!isEmptyOrAfterSpace) return false;
-            event.preventDefault();
-            slashCooldown = true;
-            if (slashCooldownTimeout) clearTimeout(slashCooldownTimeout);
-            slashCooldownTimeout = setTimeout(() => {
-              slashCooldown = false;
-              slashCooldownTimeout = null;
-            }, SLASH_COOLDOWN_MS);
-            view.dispatch(
-              view.state.tr.setMeta(SlashMenuPluginKey, {
-                type: "open",
-                pos: $cursor.pos
-              })
-            );
-            return true;
-          }
-          if (pluginState.open && (event.key === "Escape" || event.key === "ArrowLeft")) {
-            const { anchorPos } = pluginState;
-            view.dispatch(
-              view.state.tr.setMeta(SlashMenuPluginKey, {
-                type: "close"
-              })
-            );
-            if (anchorPos !== null) {
-              const tr = view.state.tr.setSelection(
-                view.state.selection.constructor.near(view.state.doc.resolve(anchorPos))
-              );
-              view.dispatch(tr);
-              view.focus();
-            }
-            return true;
-          }
-          return false;
-        }
-      }
-    });
-    return [slashMenuPlugin];
-  }
-});
 class StructuredContentViewBase {
   node;
   view;
@@ -86720,18 +86721,25 @@ const _hoisted_3$8 = {
 };
 const _hoisted_4$4 = {
   key: 3,
-  class: "link-input-wrapper"
+  class: "link-title"
 };
-const _hoisted_5$2 = { class: "input-row text-input-row" };
-const _hoisted_6$1 = ["onKeydown"];
-const _hoisted_7$1 = { class: "input-row url-input-row" };
-const _hoisted_8$1 = ["innerHTML"];
-const _hoisted_9 = ["onKeydown"];
-const _hoisted_10 = ["innerHTML"];
-const _hoisted_11 = { class: "input-row link-buttons" };
-const _hoisted_12 = ["innerHTML"];
-const _hoisted_13 = {
+const _hoisted_5$2 = {
   key: 4,
+  class: "link-input-wrapper"
+};
+const _hoisted_6$1 = { class: "input-row text-input-row" };
+const _hoisted_7$1 = ["readonly"];
+const _hoisted_8$1 = { class: "input-row url-input-row" };
+const _hoisted_9 = ["innerHTML"];
+const _hoisted_10 = ["readonly", "onKeydown"];
+const _hoisted_11 = ["innerHTML"];
+const _hoisted_12 = {
+  key: 0,
+  class: "input-row link-buttons"
+};
+const _hoisted_13 = ["innerHTML"];
+const _hoisted_14 = {
+  key: 5,
   class: "input-row go-to-anchor clickable"
 };
 const _sfc_main$j = {
@@ -86825,6 +86833,7 @@ const _sfc_main$j = {
     });
     const isEditing = vue.computed(() => !isAnchor.value && !!getLinkHrefAtSelection());
     const isDisabled2 = vue.computed(() => !validUrl.value);
+    const isViewingMode = vue.computed(() => props.editor?.options?.documentMode === "viewing");
     const openLink = () => {
       window.open(url.value, "_blank");
     };
@@ -86850,6 +86859,7 @@ const _sfc_main$j = {
       if (props.showInput) focusInput();
     });
     const handleSubmit = () => {
+      if (isViewingMode.value) return;
       const editor = props.editor;
       if (!editor) return;
       if (!rawUrl.value) {
@@ -86880,36 +86890,38 @@ const _sfc_main$j = {
       return vue.openBlock(), vue.createElementBlock("div", {
         class: vue.normalizeClass(["link-input-ctn", { "high-contrast": vue.unref(isHighContrastMode2) }])
       }, [
-        isAnchor.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$g, "Page anchor")) : isEditing.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$b, "Edit link")) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$8, "Add link")),
-        __props.showInput && !isAnchor.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$4, [
-          vue.createBaseVNode("div", _hoisted_5$2, [
-            _cache[4] || (_cache[4] = vue.createBaseVNode("div", { class: "input-icon text-input-icon" }, "T", -1)),
+        isAnchor.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$g, "Page anchor")) : isViewingMode.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$b, "Link details")) : isEditing.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$8, "Edit link")) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$4, "Add link")),
+        __props.showInput && !isAnchor.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$2, [
+          vue.createBaseVNode("div", _hoisted_6$1, [
+            _cache[5] || (_cache[5] = vue.createBaseVNode("div", { class: "input-icon text-input-icon" }, "T", -1)),
             vue.withDirectives(vue.createBaseVNode("input", {
               type: "text",
               name: "text",
               placeholder: "Text",
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => text.value = $event),
-              onKeydown: vue.withKeys(vue.withModifiers(handleSubmit, ["stop", "prevent"]), ["enter"])
-            }, null, 40, _hoisted_6$1), [
+              readonly: isViewingMode.value,
+              onKeydown: _cache[1] || (_cache[1] = vue.withKeys(vue.withModifiers(($event) => !isViewingMode.value && handleSubmit, ["stop", "prevent"]), ["enter"]))
+            }, null, 40, _hoisted_7$1), [
               [vue.vModelText, text.value]
             ])
           ]),
-          vue.createBaseVNode("div", _hoisted_7$1, [
+          vue.createBaseVNode("div", _hoisted_8$1, [
             vue.createBaseVNode("div", {
               class: "input-icon",
               innerHTML: vue.unref(toolbarIcons).linkInput
-            }, null, 8, _hoisted_8$1),
+            }, null, 8, _hoisted_9),
             vue.withDirectives(vue.createBaseVNode("input", {
               type: "text",
               name: "link",
               placeholder: "Type or paste a link",
               class: vue.normalizeClass({ error: urlError.value }),
-              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => rawUrl.value = $event),
+              "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => rawUrl.value = $event),
+              readonly: isViewingMode.value,
               onKeydown: [
                 vue.withKeys(vue.withModifiers(handleSubmit, ["stop", "prevent"]), ["enter"]),
-                _cache[2] || (_cache[2] = ($event) => urlError.value = false)
+                _cache[3] || (_cache[3] = ($event) => urlError.value = false)
               ]
-            }, null, 42, _hoisted_9), [
+            }, null, 42, _hoisted_10), [
               [vue.vModelText, rawUrl.value]
             ]),
             vue.createBaseVNode("div", {
@@ -86917,9 +86929,9 @@ const _sfc_main$j = {
               innerHTML: vue.unref(toolbarIcons).openLink,
               onClick: openLink,
               "data-item": "btn-link-open"
-            }, null, 10, _hoisted_10)
+            }, null, 10, _hoisted_11)
           ]),
-          vue.createBaseVNode("div", _hoisted_11, [
+          !isViewingMode.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12, [
             isEditing.value ? (vue.openBlock(), vue.createElementBlock("button", {
               key: 0,
               class: "remove-btn",
@@ -86929,25 +86941,25 @@ const _sfc_main$j = {
               vue.createBaseVNode("div", {
                 class: "remove-btn__icon",
                 innerHTML: vue.unref(toolbarIcons).removeLink
-              }, null, 8, _hoisted_12),
-              _cache[5] || (_cache[5] = vue.createTextVNode(" Remove ", -1))
+              }, null, 8, _hoisted_13),
+              _cache[6] || (_cache[6] = vue.createTextVNode(" Remove ", -1))
             ])) : vue.createCommentVNode("", true),
             vue.createBaseVNode("button", {
               class: vue.normalizeClass(["submit-btn", { "disable-btn": isDisabled2.value }]),
               onClick: handleSubmit,
               "data-item": "btn-link-apply"
             }, " Apply ", 2)
-          ])
-        ])) : isAnchor.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_13, [
+          ])) : vue.createCommentVNode("", true)
+        ])) : isAnchor.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14, [
           vue.createBaseVNode("a", {
-            onClick: _cache[3] || (_cache[3] = vue.withModifiers((...args) => __props.goToAnchor && __props.goToAnchor(...args), ["stop", "prevent"]))
+            onClick: _cache[4] || (_cache[4] = vue.withModifiers((...args) => __props.goToAnchor && __props.goToAnchor(...args), ["stop", "prevent"]))
           }, "Go to " + vue.toDisplayString(rawUrl.value.startsWith("#_") ? rawUrl.value.substring(2) : rawUrl.value), 1)
         ])) : vue.createCommentVNode("", true)
       ], 2);
     };
   }
 };
-const LinkInput = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-f64d35e8"]]);
+const LinkInput = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-198fc596"]]);
 const _hoisted_1$f = ["aria-label", "onClick", "onKeydown"];
 const _hoisted_2$a = ["innerHTML"];
 const _hoisted_3$7 = ["innerHTML"];