superdoc 1.0.0-beta.2 → 1.0.0-beta.20

package/dist/super-editor/super-editor.es.js

@@ -8,15 +8,15 @@ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _SuperToolbar_instances, initToolbarGroups_fn, _interceptedCommands, makeToolbarItems_fn, initDefaultFonts_fn, updateHighlightColors_fn, deactivateAll_fn, updateToolbarHistory_fn, enrichTrackedChanges_fn, runCommandWithArgumentOnly_fn;
-import { aJ as getDefaultExportFromCjs, a0 as v4, T as TextSelection$1, v as getMarkRange, aM as vClickOutside, aN as getActiveFormatting, aC as isInTable, U as findParentNode, aq as calculateResolvedParagraphProperties, a7 as twipsToLines, V as isList, a8 as pixelsToTwips, aO as getFileObject, aP as translator, aQ as translator$1, aR as translator$2, aS as translator$3, aT as translator$4, aU as translator$5, aV as translator$6, aW as translator$7, aX as translator$8, aY as translator$9, aZ as translator$a, a_ as translator$b, a$ as translator$c, b0 as translator$d, b1 as translator$e, b2 as commentRangeEndTranslator, b3 as commentRangeStartTranslator, b4 as translator$f, b5 as translator$g, b6 as translator$h, b7 as translator$i, b8 as translator$j, b9 as translator$k, ba as translator$l, bb as translator$m, bc as translator$n, bd as translator$o, be as translator$p, bf as translator$q, bg as translator$r, bh as translator$s, bi as translator$t, bj as translator$u, bk as translator$v, bl as translator$w, bm as translator$x, bn as translator$y, bo as translator$z, bp as translator$A, bq as translator$B, br as translator$C, bs as translator$D, bt as translator$E, bu as translator$F, bv as translator$G, bw as translator$H, bx as translator$I, by as translator$J, bz as translator$K, bA as translator$L, bB as translator$M, bC as translator$N, bD as translator$O, bE as translator$P, bF as translator$Q, bG as translator$R, bH as translator$S, bI as translator$T, bJ as translator$U, bK as translator$V, bL as translator$W, bM as translator$X, bN as translator$Y, bO as translator$Z, bP as translator$_, bQ as translator$$, bR as translator$10, bS as translator$11, bT as translator$12, bU as translator$13, bV as translator$14, bW as translator$15, bX as translator$16, bY as translator$17, bZ as translator$18, b_ as translator$19, b$ as translator$1a, c0 as translator$1b, c1 as translator$1c, c2 as translator$1d, c3 as translator$1e, c4 as translator$1f, c5 as translator$1g, c6 as translator$1h, c7 as translator$1i, c8 as translator$1j, P as PluginKey, a as Plugin } from "./chunks/converter-BFGB7hqj.js";
-import { ac, i, a9 } from "./chunks/converter-BFGB7hqj.js";
-import { _ as _export_sfc, u as useHighContrastMode, a as getQuickFormatList, b as generateLinkedStyleString, c as getFileOpener, d as checkAndProcessImage, r as replaceSelectionWithImagePlaceholder, e as uploadAndInsertImage, f as collectTrackedChanges, i as isTrackedChangeActionAllowed, y as yUndoPluginKey, h as undoDepth, j as redoDepth, k as getEditorSurfaceElement, l as collectTrackedChangesForContext, s as shouldBypassContextMenu, S as SlashMenuPluginKey, m as measureCache, n as isHeadless, E as Editor, o as getStarterExtensions, P as PresentationEditor, p as Placeholder, q as getRichTextExtensions, D as DecorationSet, t as Decoration, M as Mark, v as Extension, A as Attribute, N as Node } from "./chunks/editor-CtI4XnMw.js";
-import { z, F, B, T, w, C, x } from "./chunks/editor-CtI4XnMw.js";
-import { ref, onMounted, createElementBlock, openBlock, normalizeClass, unref, Fragment, renderList, createElementVNode, withModifiers, toDisplayString, createCommentVNode, normalizeStyle, computed, watch, withDirectives, withKeys, vModelText, createTextVNode, createVNode, h, createApp, markRaw, nextTick, onBeforeUnmount, defineComponent, reactive, onUnmounted, renderSlot, shallowRef, createBlock, withCtx, resolveDynamicComponent, normalizeProps, guardReactiveProps } from "vue";
-import { t as toolbarIcons, s as sanitizeNumber, T as Toolbar, p as plusIconSvg, a as trashIconSvg, b as borderNoneIconSvg, c as arrowsToDotIconSvg, d as arrowsLeftRightIconSvg, w as wrenchIconSvg, m as magicWandIcon, e as checkIconSvg$1, x as xMarkIconSvg, l as linkIconSvg, f as tableIconSvg, g as scissorsIconSvg, h as copyIconSvg, i as pasteIconSvg, u as useMessage, N as NSkeleton } from "./chunks/toolbar-BydALv4o.js";
+var _MARK_TOGGLE_NAMES, _SuperToolbar_instances, initToolbarGroups_fn, _interceptedCommands, makeToolbarItems_fn, initDefaultFonts_fn, updateHighlightColors_fn, deactivateAll_fn, updateToolbarHistory_fn, enrichTrackedChanges_fn, runCommandWithArgumentOnly_fn, syncStickyMarksFromState_fn, restoreStickyMarksIfNeeded_fn, ensureStoredMarksForMarkToggle_fn;
+import { aK as getDefaultExportFromCjs, a0 as v4, T as TextSelection$1, v as getMarkRange, aN as vClickOutside, aO as getActiveFormatting, aD as isInTable, U as findParentNode, ar as calculateResolvedParagraphProperties, a7 as twipsToLines, V as isList, al as parseSizeUnit, a8 as pixelsToTwips, aP as getFileObject, P as PluginKey, a as Plugin } from "./chunks/converter-m2x13P8G.js";
+import { ac, i, a9, aQ } from "./chunks/converter-m2x13P8G.js";
+import { _ as _export_sfc, u as useHighContrastMode, a as getQuickFormatList, b as generateLinkedStyleString, c as getFileOpener, d as checkAndProcessImage, r as replaceSelectionWithImagePlaceholder, e as uploadAndInsertImage, f as collectTrackedChanges, i as isTrackedChangeActionAllowed, y as yUndoPluginKey, h as undoDepth, j as redoDepth, k as getEditorSurfaceElement, l as collectTrackedChangesForContext, s as shouldBypassContextMenu, S as SlashMenuPluginKey, m as measureCache, n as isHeadless, E as Editor, o as getStarterExtensions, P as PresentationEditor, p as Placeholder, q as getRichTextExtensions, D as DecorationSet, t as Decoration, M as Mark, v as Extension, A as Attribute, N as Node } from "./chunks/editor-C9r_Jbbg.js";
+import { z, F, B, T, w, C, x } from "./chunks/editor-C9r_Jbbg.js";
+import { ref, onMounted, createElementBlock, openBlock, normalizeClass, unref, Fragment, renderList, createElementVNode, withModifiers, toDisplayString, createCommentVNode, normalizeStyle, computed, watch, withDirectives, withKeys, vModelText, createTextVNode, createVNode, h, createApp, markRaw, nextTick, onBeforeUnmount, defineComponent, reactive, onUnmounted, renderSlot, useCssVars, shallowRef, createBlock, withCtx, resolveDynamicComponent, normalizeProps, guardReactiveProps } from "vue";
+import { t as toolbarIcons, s as sanitizeNumber, T as Toolbar, p as plusIconSvg, a as trashIconSvg, b as borderNoneIconSvg, c as arrowsToDotIconSvg, d as arrowsLeftRightIconSvg, w as wrenchIconSvg, m as magicWandIcon, e as checkIconSvg$1, x as xMarkIconSvg, l as linkIconSvg, f as tableIconSvg, g as scissorsIconSvg, h as copyIconSvg, i as pasteIconSvg, u as useMessage, N as NSkeleton } from "./chunks/toolbar-fnptYAcU.js";
 import AIWriter from "./ai-writer.es.js";
-import { D } from "./chunks/docx-zipper-OPbzIk16.js";
+import { D } from "./chunks/docx-zipper-CRSKJF-o.js";
 import { createZip } from "./file-zipper.es.js";
 var eventemitter3 = { exports: {} };
 var hasRequiredEventemitter3;
@@ -236,7 +236,7 @@ const useToolbarItem = (options) => {
     if (!Array.isArray(options.options)) throw new Error("Invalid toolbar item options - " + options.options);
     nestedOptions.value?.push(...options.options);
   }
-  const activate = (attrs, ...args) => {
+  const activate = (attrs = {}, ...args) => {
     onActivate(attrs, ...args);
     if (suppressActiveHighlight.value) return;
     active.value = true;
@@ -311,8 +311,8 @@ const useToolbarItem = (options) => {
     onDeactivate
   };
 };
-const _hoisted_1$e = ["onClick", "innerHTML", "aria-label", "onKeydown"];
-const _sfc_main$f = {
+const _hoisted_1$f = ["onClick", "innerHTML", "aria-label", "onKeydown"];
+const _sfc_main$h = {
   __name: "AlignmentButtons",
   emits: ["select"],
   setup(__props, { emit: __emit }) {
@@ -397,20 +397,20 @@ const _sfc_main$f = {
             ref_key: "alignmentButtonsRefs",
             ref: alignmentButtonsRefs,
             onKeydown: withModifiers((event) => handleKeyDown(event, index), ["prevent"])
-          }, null, 40, _hoisted_1$e);
+          }, null, 40, _hoisted_1$f);
         }), 64))
       ], 2);
     };
   }
 };
-const AlignmentButtons = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-d84f57b6"]]);
-const _hoisted_1$d = ["onClick", "onKeydown"];
+const AlignmentButtons = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-d84f57b6"]]);
+const _hoisted_1$e = ["onClick", "onKeydown"];
 const _hoisted_2$9 = { class: "document-mode-column icon-column" };
 const _hoisted_3$7 = ["innerHTML"];
 const _hoisted_4$3 = { class: "document-mode-column text-column" };
 const _hoisted_5$2 = { class: "document-mode-type" };
 const _hoisted_6$1 = { class: "document-mode-description" };
-const _sfc_main$e = {
+const _sfc_main$g = {
   __name: "DocumentMode",
   props: {
     options: {
@@ -484,19 +484,20 @@ const _sfc_main$e = {
               createElementVNode("div", _hoisted_5$2, toDisplayString(option.label), 1),
               createElementVNode("div", _hoisted_6$1, toDisplayString(option.description), 1)
             ])
-          ], 42, _hoisted_1$d);
+          ], 42, _hoisted_1$e);
         }), 256))
       ], 2);
     };
   }
 };
-const DocumentMode = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-8730b752"]]);
-const _hoisted_1$c = {
+const DocumentMode = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-8730b752"]]);
+const _hoisted_1$d = {
   key: 0,
-  class: "linked-style-buttons"
+  class: "linked-style-buttons",
+  "data-editor-ui-surface": ""
 };
 const _hoisted_2$8 = ["onClick", "onKeydown", "aria-label"];
-const _sfc_main$d = {
+const _sfc_main$f = {
   __name: "LinkedStyle",
   props: {
     editor: {
@@ -550,7 +551,7 @@ const _sfc_main$d = {
       styleRefs.value[0].focus();
     });
     return (_ctx, _cache) => {
-      return props.editor ? (openBlock(), createElementBlock("div", _hoisted_1$c, [
+      return props.editor ? (openBlock(), createElementBlock("div", _hoisted_1$d, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(unref(getQuickFormatList)(__props.editor), (style, index) => {
           return openBlock(), createElementBlock("div", {
             class: normalizeClass(["style-item", { selected: __props.selectedOption === style.id }]),
@@ -572,8 +573,8 @@ const _sfc_main$d = {
     };
   }
 };
-const LinkedStyle = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-b53508a8"]]);
-const _hoisted_1$b = {
+const LinkedStyle = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-ecb78965"]]);
+const _hoisted_1$c = {
   key: 0,
   class: "link-title"
 };
@@ -601,7 +602,7 @@ const _hoisted_13 = {
   key: 4,
   class: "input-row go-to-anchor clickable"
 };
-const _sfc_main$c = {
+const _sfc_main$e = {
   __name: "LinkInput",
   props: {
     showInput: {
@@ -740,7 +741,7 @@ const _sfc_main$c = {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["link-input-ctn", { "high-contrast": unref(isHighContrastMode) }])
       }, [
-        isAnchor.value ? (openBlock(), createElementBlock("div", _hoisted_1$b, "Page anchor")) : isEditing.value ? (openBlock(), createElementBlock("div", _hoisted_2$7, "Edit link")) : (openBlock(), createElementBlock("div", _hoisted_3$6, "Add link")),
+        isAnchor.value ? (openBlock(), createElementBlock("div", _hoisted_1$c, "Page anchor")) : isEditing.value ? (openBlock(), createElementBlock("div", _hoisted_2$7, "Edit link")) : (openBlock(), createElementBlock("div", _hoisted_3$6, "Add link")),
         __props.showInput && !isAnchor.value ? (openBlock(), createElementBlock("div", _hoisted_4$2, [
           createElementVNode("div", _hoisted_5$1, [
             _cache[4] || (_cache[4] = createElementVNode("div", { class: "input-icon text-input-icon" }, "T", -1)),
@@ -807,12 +808,12 @@ const _sfc_main$c = {
     };
   }
 };
-const LinkInput = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-ba50627b"]]);
-const _hoisted_1$a = ["aria-label", "onClick", "onKeydown"];
+const LinkInput = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-ba50627b"]]);
+const _hoisted_1$b = ["aria-label", "onClick", "onKeydown"];
 const _hoisted_2$6 = ["innerHTML"];
 const _hoisted_3$5 = ["innerHTML"];
 const ROW_SIZE$1 = 7;
-const _sfc_main$b = {
+const _sfc_main$d = {
   __name: "IconGridRow",
   props: {
     icons: {
@@ -938,19 +939,19 @@ const _sfc_main$b = {
                 innerHTML: unref(toolbarIcons).colorOptionCheck,
                 style: normalizeStyle(getCheckStyle(option.value, optionIndex))
               }, null, 12, _hoisted_3$5)) : createCommentVNode("", true)
-            ], 40, _hoisted_1$a);
+            ], 40, _hoisted_1$b);
           }), 128))
         ]);
       }), 128);
     };
   }
 };
-const IconGridRow = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-0f479b6c"]]);
+const IconGridRow = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-0f479b6c"]]);
 const DropIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M320 512c53.2 0 101.4-21.6 136.1-56.6l-298.3-235C140 257.1 128 292.3 128 320c0 106 86 192 192 192zM505.2 370.7c4.4-16.2 6.8-33.1 6.8-50.7c0-91.2-130.2-262.3-166.6-308.3C339.4 4.2 330.5 0 320.9 0l-1.8 0c-9.6 0-18.5 4.2-24.5 11.7C277.8 33 240.7 81.3 205.8 136L38.8 5.1C28.4-3.1 13.3-1.2 5.1 9.2S-1.2 34.7 9.2 42.9l592 464c10.4 8.2 25.5 6.3 33.7-4.1s6.3-25.5-4.1-33.7L505.2 370.7zM224 336c0 44.2 35.8 80 80 80c8.8 0 16 7.2 16 16s-7.2 16-16 16c-61.9 0-112-50.1-112-112c0-8.8 7.2-16 16-16s16 7.2 16 16z"/></svg>\n';
-const _hoisted_1$9 = { class: "options-grid-wrap" };
+const _hoisted_1$a = { class: "options-grid-wrap" };
 const _hoisted_2$5 = ["innerHTML"];
 const _hoisted_3$4 = { class: "option-grid-ctn" };
-const _sfc_main$a = {
+const _sfc_main$c = {
   __name: "IconGrid",
   props: {
     icons: {
@@ -977,7 +978,7 @@ const _sfc_main$a = {
       emit("select", option);
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$9, [
+      return openBlock(), createElementBlock("div", _hoisted_1$a, [
         __props.hasNoneIcon ? (openBlock(), createElementBlock("div", {
           key: 0,
           class: "none-option",
@@ -1010,7 +1011,7 @@ const _sfc_main$a = {
     };
   }
 };
-const IconGrid = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-3d19fedf"]]);
+const IconGrid = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-3d19fedf"]]);
 const closeDropdown$1 = (dropdown) => {
   dropdown.expand.value = false;
 };
@@ -1119,10 +1120,10 @@ const icons = [
 const getAvailableColorOptions = () => {
   return icons.flat().map((item) => item.value);
 };
-const _hoisted_1$8 = ["data-cols", "data-rows", "onKeydown", "onClick"];
+const _hoisted_1$9 = ["data-cols", "data-rows", "onKeydown", "onClick"];
 const _hoisted_2$4 = ["aria-valuetext"];
 const ROW_SIZE = 5;
-const _sfc_main$9 = {
+const _sfc_main$b = {
   __name: "TableGrid",
   emits: ["select", "clickoutside"],
   setup(__props, { emit: __emit }) {
@@ -1238,7 +1239,7 @@ const _sfc_main$9 = {
                   ref: tableGridItems,
                   onKeydown: withModifiers((event) => handleKeyDown(event, n, i2), ["prevent"]),
                   onClick: withModifiers(($event) => handleClick({ cols: n, rows: i2 }), ["stop", "prevent"])
-                }, null, 40, _hoisted_1$8);
+                }, null, 40, _hoisted_1$9);
               }), 64))
             ], 64);
           }), 64))
@@ -1251,13 +1252,13 @@ const _sfc_main$9 = {
     };
   }
 };
-const TableGrid = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-92e8d5fb"]]);
-const _hoisted_1$7 = { class: "toolbar-table-actions" };
+const TableGrid = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-92e8d5fb"]]);
+const _hoisted_1$8 = { class: "toolbar-table-actions" };
 const _hoisted_2$3 = ["onClick", "data-item", "ariaLabel"];
 const _hoisted_3$3 = { class: "toolbar-table-actions__icon" };
 const _hoisted_4$1 = ["innerHTML"];
 const _hoisted_5 = { class: "toolbar-table-actions__label" };
-const _sfc_main$8 = {
+const _sfc_main$a = {
   __name: "TableActions",
   props: {
     options: {
@@ -1271,7 +1272,7 @@ const _sfc_main$8 = {
       emit("select", { command: item.command });
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$7, [
+      return openBlock(), createElementBlock("div", _hoisted_1$8, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option) => {
           return openBlock(), createElementBlock("div", {
             class: normalizeClass(["toolbar-table-actions__item", { "toolbar-table-actions__item--border": option.bottomBorder }]),
@@ -1293,7 +1294,7 @@ const _sfc_main$8 = {
     };
   }
 };
-const TableActions = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-990b9a25"]]);
+const TableActions = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-990b9a25"]]);
 function getScrollableParent(element) {
   let currentElement = element;
   while (currentElement) {
@@ -1317,10 +1318,10 @@ function scrollToElement(targetElement, options = { behavior: "smooth", block: "
   });
 }
 const checkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"/></svg>\n';
-const _hoisted_1$6 = { class: "search-input-ctn" };
+const _hoisted_1$7 = { class: "search-input-ctn" };
 const _hoisted_2$2 = { class: "row" };
 const _hoisted_3$2 = ["onKeydown"];
-const _sfc_main$7 = {
+const _sfc_main$9 = {
   __name: "SearchInput",
   props: {
     searchRef: {
@@ -1335,7 +1336,7 @@ const _sfc_main$7 = {
       emit("submit", { value: searchValue.value });
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$6, [
+      return openBlock(), createElementBlock("div", _hoisted_1$7, [
         createElementVNode("div", _hoisted_2$2, [
           withDirectives(createElementVNode("input", {
             ref: __props.searchRef,
@@ -1359,7 +1360,7 @@ const _sfc_main$7 = {
     };
   }
 };
-const SearchInput = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-957cbcf2"]]);
+const SearchInput = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-957cbcf2"]]);
 const TOOLBAR_FONTS = [
   {
     label: "Georgia",
@@ -2508,7 +2509,7 @@ const isNegatedMark = (name, attrs = {}) => {
   if (typeof checker !== "function") return false;
   return Boolean(checker(attrs));
 };
-class SuperToolbar extends EventEmitter {
+const _SuperToolbar = class _SuperToolbar extends EventEmitter {
   /**
    * Creates a new SuperToolbar instance
    * @param {ToolbarConfig} config - The configuration for the toolbar
@@ -2561,11 +2562,11 @@ class SuperToolbar extends EventEmitter {
         const isSmallScreen = window.matchMedia("(max-width: 834px)").matches;
         if (isMobileDevice && isSmallScreen) {
           layers.style.transformOrigin = "0 0";
-          layers.style.transform = `scale(${parseInt(argument) / 100})`;
+          layers.style.transform = `scale(${parseInt(argument, 10) / 100})`;
         } else {
-          layers.style.zoom = parseInt(argument) / 100;
+          layers.style.zoom = parseInt(argument, 10) / 100;
         }
-        this.superdoc.superdocStore.activeZoom = parseInt(argument);
+        this.superdoc.superdocStore.activeZoom = parseInt(argument, 10);
       },
       /**
        * Sets the document mode
@@ -2647,31 +2648,37 @@ class SuperToolbar extends EventEmitter {
        * @returns {Promise<void>}
        */
       startImageUpload: async () => {
-        let open = getFileOpener();
-        let result = await open();
-        if (!result?.file) {
-          return;
-        }
-        const { size, file } = await checkAndProcessImage({
-          file: result.file,
-          getMaxContentSize: () => this.activeEditor.getMaxContentSize()
-        });
-        if (!file) {
-          return;
+        try {
+          let open = getFileOpener();
+          let result = await open();
+          if (!result?.file) {
+            return;
+          }
+          const { size, file } = await checkAndProcessImage({
+            file: result.file,
+            getMaxContentSize: () => this.activeEditor.getMaxContentSize()
+          });
+          if (!file) {
+            return;
+          }
+          const id = {};
+          replaceSelectionWithImagePlaceholder({
+            view: this.activeEditor.view,
+            editorOptions: this.activeEditor.options,
+            id
+          });
+          await uploadAndInsertImage({
+            editor: this.activeEditor,
+            view: this.activeEditor.view,
+            file,
+            size,
+            id
+          });
+        } catch (error) {
+          const err = new Error("[super-toolbar 🎨] Image upload failed");
+          this.emit("exception", { error: err, editor: this.activeEditor, originalError: error });
+          console.error(err, error);
         }
-        const id = {};
-        replaceSelectionWithImagePlaceholder({
-          view: this.activeEditor.view,
-          editorOptions: this.activeEditor.options,
-          id
-        });
-        await uploadAndInsertImage({
-          editor: this.activeEditor,
-          view: this.activeEditor.view,
-          file,
-          size,
-          id
-        });
       },
       /**
        * Increases text indentation or list level
@@ -2844,6 +2851,13 @@ class SuperToolbar extends EventEmitter {
     };
     this.config.hideButtons = config.hideButtons ?? true;
     this.config.responsiveToContainer = config.responsiveToContainer ?? false;
+    this.pendingMarkCommands = [];
+    this.stickyStoredMarks = null;
+    this._boundEditorHandlers = {
+      transaction: null,
+      selectionUpdate: null,
+      focus: null
+    };
     if (!this.config.selector && this.config.element) {
       this.config.selector = this.config.element;
     }
@@ -2903,12 +2917,28 @@ class SuperToolbar extends EventEmitter {
   }
   /**
    * The toolbar expects an active Super Editor instance.
-   * @param {Object} editor - The editor instance to attach to the toolbar
+   * Removes listeners from the previous editor (if any) before attaching to the new one.
+   * @param {Object|null} editor - The editor instance to attach to the toolbar, or null to detach
    * @returns {void}
    */
   setActiveEditor(editor) {
+    if (this.activeEditor && this._boundEditorHandlers.transaction) {
+      this.activeEditor.off("transaction", this._boundEditorHandlers.transaction);
+      this.activeEditor.off("selectionUpdate", this._boundEditorHandlers.selectionUpdate);
+      this.activeEditor.off("focus", this._boundEditorHandlers.focus);
+      this._boundEditorHandlers.transaction = null;
+      this._boundEditorHandlers.selectionUpdate = null;
+      this._boundEditorHandlers.focus = null;
+    }
     this.activeEditor = editor;
-    this.activeEditor.on("transaction", this.onEditorTransaction.bind(this));
+    if (editor) {
+      this._boundEditorHandlers.transaction = this.onEditorTransaction.bind(this);
+      this._boundEditorHandlers.selectionUpdate = this.onEditorSelectionUpdate.bind(this);
+      this._boundEditorHandlers.focus = this.onEditorFocus.bind(this);
+      this.activeEditor.on("transaction", this._boundEditorHandlers.transaction);
+      this.activeEditor.on("selectionUpdate", this._boundEditorHandlers.selectionUpdate);
+      this.activeEditor.on("focus", this._boundEditorHandlers.focus);
+    }
   }
   /**
    * Get toolbar items by group name
@@ -3056,15 +3086,28 @@ class SuperToolbar extends EventEmitter {
    * @returns {*} The result of the executed command, undefined if no result is returned
    */
   emitCommand({ item, argument, option }) {
+    const hasFocusFn = this.activeEditor?.view?.hasFocus;
+    const wasFocused = Boolean(typeof hasFocusFn === "function" && hasFocusFn.call(this.activeEditor.view));
+    const { command } = item;
+    const isMarkToggle = this.isMarkToggle(item);
+    if (!wasFocused && isMarkToggle) {
+      this.pendingMarkCommands.push({ command, argument, item });
+      item?.activate?.();
+      if (this.activeEditor && !this.activeEditor.options.isHeaderOrFooter) {
+        this.activeEditor.focus();
+      }
+      return;
+    }
     if (this.activeEditor && !this.activeEditor.options.isHeaderOrFooter) {
       this.activeEditor.focus();
     }
-    const { command } = item;
     if (!command) {
       return;
     }
     if (command in __privateGet(this, _interceptedCommands)) {
-      return __privateGet(this, _interceptedCommands)[command]({ item, argument });
+      const result = __privateGet(this, _interceptedCommands)[command]({ item, argument });
+      if (isMarkToggle) __privateMethod(this, _SuperToolbar_instances, syncStickyMarksFromState_fn).call(this);
+      return result;
     }
     if (this.activeEditor && this.activeEditor.commands && command in this.activeEditor.commands) {
       this.activeEditor.commands[command](argument);
@@ -3075,9 +3118,67 @@ class SuperToolbar extends EventEmitter {
       this.emit("exception", { error, editor: this.activeEditor });
       throw error;
     }
+    if (isMarkToggle) __privateMethod(this, _SuperToolbar_instances, syncStickyMarksFromState_fn).call(this);
     this.updateToolbarState();
   }
-}
+  /**
+   * Processes and executes pending mark commands when editor selection updates.
+   * This is triggered by the editor's 'selectionUpdate' event after focus is restored.
+   * Clears the pending queue after execution.
+   * @returns {void}
+   */
+  onEditorSelectionUpdate() {
+    if (!this.activeEditor) return;
+    if (this.pendingMarkCommands.length) {
+      const pending = this.pendingMarkCommands;
+      this.pendingMarkCommands = [];
+      pending.forEach(({ command, argument, item }) => {
+        if (!command) return;
+        try {
+          if (command in __privateGet(this, _interceptedCommands)) {
+            __privateGet(this, _interceptedCommands)[command]({ item, argument });
+          } else if (this.activeEditor.commands && command in this.activeEditor.commands) {
+            this.activeEditor.commands[command](argument);
+          }
+          __privateMethod(this, _SuperToolbar_instances, ensureStoredMarksForMarkToggle_fn).call(this, { command, argument });
+        } catch (error) {
+          const err = new Error(`[super-toolbar 🎨] Failed to execute pending command: ${command}`);
+          this.emit("exception", { error: err, editor: this.activeEditor, originalError: error });
+          console.error(err, error);
+        }
+      });
+      __privateMethod(this, _SuperToolbar_instances, syncStickyMarksFromState_fn).call(this);
+      this.updateToolbarState();
+      return;
+    }
+    const restored = __privateMethod(this, _SuperToolbar_instances, restoreStickyMarksIfNeeded_fn).call(this);
+    if (restored) this.updateToolbarState();
+  }
+  /**
+   * Handles editor focus events by flushing any pending mark commands.
+   * This is triggered by the editor's 'focus' event.
+   * @returns {void}
+   */
+  onEditorFocus() {
+    if (this.pendingMarkCommands.length) {
+      this.onEditorSelectionUpdate();
+      return;
+    }
+    const restored = __privateMethod(this, _SuperToolbar_instances, restoreStickyMarksIfNeeded_fn).call(this);
+    if (restored) this.updateToolbarState();
+  }
+  /**
+   * Determines if a toolbar item represents a mark toggle command.
+   * Mark toggles include text formatting commands like bold, italic, underline, etc.
+   * @param {ToolbarItem} item - The toolbar item to check
+   * @returns {boolean} True if the item is a mark toggle, false otherwise
+   */
+  isMarkToggle(item) {
+    const name = item?.name?.value;
+    return __privateGet(_SuperToolbar, _MARK_TOGGLE_NAMES).has(name);
+  }
+};
+_MARK_TOGGLE_NAMES = new WeakMap();
 _SuperToolbar_instances = new WeakSet();
 /**
  * Initiate toolbar groups
@@ -3186,14 +3287,19 @@ deactivateAll_fn = function() {
  * @returns {void}
  */
 updateToolbarHistory_fn = function() {
-  if (!this.activeEditor) return;
-  if (this.activeEditor.options.ydoc) {
-    const undoManager = yUndoPluginKey.getState(this.activeEditor.state)?.undoManager;
-    this.undoDepth = undoManager?.undoStack.length || 0;
-    this.redoDepth = undoManager?.redoStack.length || 0;
-  } else {
-    this.undoDepth = undoDepth(this.activeEditor.state);
-    this.redoDepth = redoDepth(this.activeEditor.state);
+  if (!this.activeEditor?.state) return;
+  try {
+    if (this.activeEditor.options.ydoc) {
+      const undoManager = yUndoPluginKey.getState(this.activeEditor.state)?.undoManager;
+      this.undoDepth = undoManager?.undoStack.length || 0;
+      this.redoDepth = undoManager?.redoStack.length || 0;
+    } else {
+      this.undoDepth = undoDepth(this.activeEditor.state);
+      this.redoDepth = redoDepth(this.activeEditor.state);
+    }
+  } catch {
+    this.undoDepth = 0;
+    this.redoDepth = 0;
   }
 };
 enrichTrackedChanges_fn = function(trackedChanges = []) {
@@ -3235,6 +3341,82 @@ runCommandWithArgumentOnly_fn = function({ item, argument, noArgumentCallback =
     this.updateToolbarState();
   }
 };
+/**
+ * Capture stored marks when a mark toggle is used on an empty selection
+ * so they can be re-applied after focus/selection changes.
+ * @private
+ * @returns {void}
+ */
+syncStickyMarksFromState_fn = function() {
+  if (!this.activeEditor) return;
+  const { selection, storedMarks } = this.activeEditor.state || {};
+  if (!selection?.empty) return;
+  this.stickyStoredMarks = storedMarks?.length ? [...storedMarks] : null;
+};
+/**
+ * Re-apply stored marks captured from toolbar toggles when the current
+ * selection is empty and unformatted.
+ * @private
+ * @returns {boolean} True if marks were restored
+ */
+restoreStickyMarksIfNeeded_fn = function() {
+  if (!this.activeEditor) return false;
+  if (!this.stickyStoredMarks?.length) return false;
+  const { state, view } = this.activeEditor;
+  const { selection, storedMarks } = state || {};
+  if (!selection?.empty) return false;
+  if (storedMarks?.length) return false;
+  if (!view?.dispatch || !state?.tr) return false;
+  const hasActiveMarkToggle = getActiveFormatting(this.activeEditor).some(
+    (mark) => __privateGet(_SuperToolbar, _MARK_TOGGLE_NAMES).has(mark.name)
+  );
+  if (hasActiveMarkToggle) return false;
+  const tr = state.tr.setStoredMarks(this.stickyStoredMarks);
+  view.dispatch(tr);
+  return true;
+};
+/**
+ * Fallback to ensure stored marks exist for mark toggles when executed off-focus.
+ * Helps cases where a command doesn't set storedMarks (e.g., font size from toolbar before focus).
+ * @private
+ * @param {Object} params
+ * @param {string} params.command
+ * @param {*} params.argument
+ * @returns {void}
+ */
+ensureStoredMarksForMarkToggle_fn = function({ command, argument }) {
+  if (!this.activeEditor) return;
+  if (!this.activeEditor.state?.selection?.empty) return;
+  if (this.activeEditor.state?.storedMarks?.length) return;
+  if (command !== "setFontSize") return;
+  const { state, view } = this.activeEditor;
+  const textStyleMark = state.schema?.marks?.textStyle;
+  if (!textStyleMark || !view?.dispatch || !state?.tr) return;
+  const [value, unit] = parseSizeUnit(argument ?? "");
+  if (Number.isNaN(value)) return;
+  const clamped = Math.min(96, Math.max(8, Number(value)));
+  const resolvedUnit = unit || "pt";
+  const mark = textStyleMark.create({ fontSize: `${clamped}${resolvedUnit}` });
+  const tr = state.tr.setStoredMarks([mark]);
+  view.dispatch(tr);
+};
+/**
+ * Mark toggle names used to identify mark commands that need special handling
+ * when the editor is not focused.
+ * @type {Set<string>}
+ * @private
+ */
+__privateAdd(_SuperToolbar, _MARK_TOGGLE_NAMES, /* @__PURE__ */ new Set([
+  "bold",
+  "italic",
+  "underline",
+  "strike",
+  "highlight",
+  "color",
+  "fontSize",
+  "fontFamily"
+]));
+let SuperToolbar = _SuperToolbar;
 const onMarginClickCursorChange = (event, editor) => {
   const y = event.clientY;
   const x2 = event.clientX;
@@ -4030,7 +4212,7 @@ function getItems(context, customItems = [], includeDefaultItems = true) {
   }).filter((section) => section.items.length > 0);
   return filteredSections;
 }
-const _hoisted_1$5 = { class: "slash-menu-items" };
+const _hoisted_1$6 = { class: "slash-menu-items" };
 const _hoisted_2$1 = {
   key: 0,
   class: "slash-menu-divider",
@@ -4038,7 +4220,7 @@ const _hoisted_2$1 = {
 };
 const _hoisted_3$1 = ["onClick"];
 const _hoisted_4 = ["innerHTML"];
-const _sfc_main$6 = {
+const _sfc_main$8 = {
   __name: "SlashMenu",
   props: {
     editor: {
@@ -4166,7 +4348,7 @@ const _sfc_main$6 = {
       customItemRefs.clear();
     };
     const handleGlobalKeyDown = (event) => {
-      if (event.key === "Escape") {
+      if (event.key === "Escape" && isOpen.value) {
         event.preventDefault();
         event.stopPropagation();
         closeMenu();
@@ -4354,7 +4536,7 @@ const _sfc_main$6 = {
         }, null, 544), [
           [vModelText, searchQuery.value]
         ]),
-        createElementVNode("div", _hoisted_1$5, [
+        createElementVNode("div", _hoisted_1$6, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(filteredSections.value, (section, sectionIndex) => {
             return openBlock(), createElementBlock(Fragment, {
               key: section.id
@@ -4389,8 +4571,8 @@ const _sfc_main$6 = {
     };
   }
 };
-const _hoisted_1$4 = ["accept"];
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+const _hoisted_1$5 = ["accept"];
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "BasicUpload",
   props: {
     accept: { default: ".docx, .pdf, .html, .md" }
@@ -4411,15 +4593,15 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
           id: "fileInput",
           onChange: onFileChange,
           accept: __props.accept
-        }, null, 40, _hoisted_1$4)
+        }, null, 40, _hoisted_1$5)
       ]);
     };
   }
 });
-const _hoisted_1$3 = { class: "numbering" };
+const _hoisted_1$4 = { class: "numbering" };
 const MIN_WIDTH = 200;
 const alignment = "flex-end";
-const _sfc_main$4 = {
+const _sfc_main$6 = {
   __name: "Ruler",
   props: {
     orientation: {
@@ -4604,7 +4786,7 @@ const _sfc_main$4 = {
             class: normalizeClass(unit.className),
             style: normalizeStyle(getStyle.value(unit))
           }, [
-            createElementVNode("div", _hoisted_1$3, toDisplayString(unit.numbering), 1),
+            createElementVNode("div", _hoisted_1$4, toDisplayString(unit.numbering), 1),
             (openBlock(true), createElementBlock(Fragment, null, renderList(unit.elements, (half) => {
               return openBlock(), createElementBlock("div", {
                 class: normalizeClass(half.className),
@@ -4624,8 +4806,8 @@ const _sfc_main$4 = {
     };
   }
 };
-const Ruler = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-79f9a944"]]);
-const _sfc_main$3 = {
+const Ruler = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-79f9a944"]]);
+const _sfc_main$5 = {
   __name: "GenericPopover",
   props: {
     editor: { type: Object, required: true },
@@ -4653,22 +4835,22 @@ const _sfc_main$3 = {
       () => props.visible,
       (val) => {
         if (val) {
-          document.addEventListener("mousedown", handleClickOutside);
+          document.addEventListener("pointerdown", handleClickOutside);
           document.addEventListener("keydown", handleEscape);
         } else {
-          document.removeEventListener("mousedown", handleClickOutside);
+          document.removeEventListener("pointerdown", handleClickOutside);
           document.removeEventListener("keydown", handleEscape);
         }
       }
     );
     onMounted(() => {
       if (props.visible) {
-        document.addEventListener("mousedown", handleClickOutside);
+        document.addEventListener("pointerdown", handleClickOutside);
         document.addEventListener("keydown", handleEscape);
       }
     });
     onBeforeUnmount(() => {
-      document.removeEventListener("mousedown", handleClickOutside);
+      document.removeEventListener("pointerdown", handleClickOutside);
       document.removeEventListener("keydown", handleEscape);
     });
     const derivedStyles = computed(() => ({
@@ -4683,7 +4865,7 @@ const _sfc_main$3 = {
         style: normalizeStyle(derivedStyles.value),
         ref_key: "popover",
         ref: popover,
-        onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {
+        onPointerdown: _cache[0] || (_cache[0] = withModifiers(() => {
         }, ["stop"])),
         onClick: _cache[1] || (_cache[1] = withModifiers(() => {
         }, ["stop"]))
@@ -4693,9 +4875,15 @@ const _sfc_main$3 = {
     };
   }
 };
-const GenericPopover = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-cbddcc0f"]]);
-const _hoisted_1$2 = ["data-boundary-index", "data-boundary-type", "onMousedown"];
-const _sfc_main$2 = {
+const GenericPopover = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-157855b5"]]);
+const _hoisted_1$3 = ["data-boundary-index", "data-boundary-type", "onMousedown"];
+const RESIZE_HANDLE_WIDTH_PX = 9;
+const RESIZE_HANDLE_OFFSET_PX = 4;
+const DRAG_OVERLAY_EXTENSION_PX = 1e3;
+const MIN_DRAG_OVERLAY_WIDTH_PX = 2e3;
+const THROTTLE_INTERVAL_MS = 16;
+const MIN_RESIZE_DELTA_PX = 1;
+const _sfc_main$4 = {
   __name: "TableResizeOverlay",
   props: {
     /** Editor instance for dispatching transactions */
@@ -4718,26 +4906,73 @@ const _sfc_main$2 = {
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emit = __emit;
+    const overlayRect = ref(null);
     const tableMetadata = ref(null);
     const dragState = ref(null);
     const forcedCleanup = ref(false);
+    let rafId = null;
+    let isUnmounted = false;
+    function startOverlayTracking() {
+      if (rafId !== null) return;
+      const step = () => {
+        updateOverlayRect();
+        rafId = requestAnimationFrame(step);
+      };
+      rafId = requestAnimationFrame(step);
+    }
+    function stopOverlayTracking() {
+      if (rafId !== null) {
+        cancelAnimationFrame(rafId);
+        rafId = null;
+      }
+    }
     const overlayStyle = computed(() => {
-      if (!props.tableElement) return {};
-      const rect = props.tableElement.getBoundingClientRect();
+      if (!overlayRect.value || !props.tableElement) return {};
+      const rect = overlayRect.value;
       let overlayWidth = rect.width;
       if (dragState.value) {
-        overlayWidth = Math.max(rect.width + 1e3, 2e3);
+        overlayWidth = Math.max(rect.width + DRAG_OVERLAY_EXTENSION_PX, MIN_DRAG_OVERLAY_WIDTH_PX);
       }
       return {
         position: "absolute",
-        left: `${props.tableElement.offsetLeft}px`,
-        top: `${props.tableElement.offsetTop}px`,
+        left: `${rect.left}px`,
+        top: `${rect.top}px`,
         width: `${overlayWidth}px`,
         height: `${rect.height}px`,
         pointerEvents: dragState.value ? "auto" : "none",
         zIndex: 10
       };
     });
+    function updateOverlayRect() {
+      if (!props.tableElement) {
+        overlayRect.value = null;
+        return;
+      }
+      const parent = props.tableElement.offsetParent;
+      const tableRect = props.tableElement.getBoundingClientRect();
+      if (tableRect.width === 0 || tableRect.height === 0) {
+        overlayRect.value = null;
+        return;
+      }
+      if (parent) {
+        const parentRect = parent.getBoundingClientRect();
+        const left = tableRect.left - parentRect.left + (parent.scrollLeft || 0);
+        const top = tableRect.top - parentRect.top + (parent.scrollTop || 0);
+        overlayRect.value = {
+          left,
+          top,
+          width: tableRect.width,
+          height: tableRect.height
+        };
+      } else {
+        overlayRect.value = {
+          left: props.tableElement.offsetLeft,
+          top: props.tableElement.offsetTop,
+          width: tableRect.width,
+          height: tableRect.height
+        };
+      }
+    }
     const resizableBoundaries = computed(() => {
       if (!tableMetadata.value?.columns) {
         return [];
@@ -4763,21 +4998,39 @@ const _sfc_main$2 = {
       });
       return boundaries;
     });
-    function getHandleStyle(boundary) {
+    function getBoundarySegments(boundary) {
+      if (boundary.type === "right-edge") {
+        return [{ y: 0, h: null }];
+      }
+      const segmentsData = tableMetadata.value?.segments;
+      if (!segmentsData || !Array.isArray(segmentsData)) {
+        return [{ y: 0, h: null }];
+      }
+      const boundaryColIndex = boundary.index + 1;
+      const colSegments = segmentsData[boundaryColIndex];
+      if (!colSegments || colSegments.length === 0) {
+        return [];
+      }
+      return colSegments.filter((seg) => seg && typeof seg === "object").map((seg) => ({
+        y: typeof seg.y === "number" ? seg.y : 0,
+        h: seg.h !== null && typeof seg.h === "number" ? seg.h : null
+      }));
+    }
+    function getSegmentHandleStyle(boundary, segment) {
       return {
         position: "absolute",
         left: `${boundary.x}px`,
-        top: "0",
-        width: "9px",
-        height: "100%",
-        transform: "translateX(-4px)",
+        top: segment.y != null ? `${segment.y}px` : "0",
+        width: `${RESIZE_HANDLE_WIDTH_PX}px`,
+        height: segment.h != null ? `${segment.h}px` : "100%",
+        transform: `translateX(-${RESIZE_HANDLE_OFFSET_PX}px)`,
         cursor: "col-resize",
         pointerEvents: "auto"
       };
     }
     const guidelineStyle = computed(() => {
       if (!dragState.value || !tableMetadata.value) return { display: "none" };
-      const initialBoundary = resizableBoundaries.value[dragState.value.boundaryIndex];
+      const initialBoundary = resizableBoundaries.value[dragState.value.resizableBoundaryIndex];
       if (!initialBoundary) return { display: "none" };
       const newX = initialBoundary.x + dragState.value.constrainedDelta;
       return {
@@ -4824,7 +5077,8 @@ const _sfc_main$2 = {
           });
           return;
         }
-        tableMetadata.value = { columns: validatedColumns };
+        const segments = Array.isArray(parsed.segments) ? parsed.segments : void 0;
+        tableMetadata.value = { columns: validatedColumns, segments };
       } catch (error) {
         tableMetadata.value = null;
         emit("resize-error", {
@@ -4833,11 +5087,11 @@ const _sfc_main$2 = {
         });
       }
     }
-    function onHandleMouseDown(event, boundaryIndex) {
+    function onHandleMouseDown(event, resizableBoundaryIndex) {
       event.preventDefault();
       event.stopPropagation();
       if (!tableMetadata.value?.columns) return;
-      const boundary = resizableBoundaries.value[boundaryIndex];
+      const boundary = resizableBoundaries.value[resizableBoundaryIndex];
       if (!boundary) return;
       const columns = tableMetadata.value.columns;
       const isRightEdge = boundary.type === "right-edge";
@@ -4845,7 +5099,7 @@ const _sfc_main$2 = {
       const rightColumn = isRightEdge ? null : columns[boundary.index + 1];
       dragState.value = {
         columnIndex: boundary.index,
-        boundaryIndex,
+        resizableBoundaryIndex,
         isRightEdge,
         initialX: event.clientX,
         initialWidths: columns.map((col) => col.w),
@@ -4859,15 +5113,28 @@ const _sfc_main$2 = {
         } : null,
         constrainedDelta: 0
       };
+      if (!props.editor?.view?.dom) {
+        emit("resize-error", { error: "Editor view not available" });
+        dragState.value = null;
+        return;
+      }
       const pmView = props.editor.view.dom;
       pmView.style.pointerEvents = "none";
-      document.addEventListener("mousemove", onDocumentMouseMove);
-      document.addEventListener("mouseup", onDocumentMouseUp);
-      emit("resize-start", {
-        columnIndex: boundary.index,
-        isRightEdge,
-        initialWidths: dragState.value.initialWidths
-      });
+      try {
+        document.addEventListener("mousemove", onDocumentMouseMove);
+        document.addEventListener("mouseup", onDocumentMouseUp);
+        emit("resize-start", {
+          columnIndex: boundary.index,
+          isRightEdge,
+          initialWidths: dragState.value.initialWidths
+        });
+      } catch (error) {
+        document.removeEventListener("mousemove", onDocumentMouseMove);
+        document.removeEventListener("mouseup", onDocumentMouseUp);
+        pmView.style.pointerEvents = "auto";
+        dragState.value = null;
+        emit("resize-error", { error: error instanceof Error ? error.message : String(error) });
+      }
     }
     function throttle(func, limit) {
       let inThrottle;
@@ -4892,7 +5159,7 @@ const _sfc_main$2 = {
       return { throttled, cancel };
     }
     const mouseMoveThrottle = throttle((event) => {
-      if (!dragState.value) return;
+      if (isUnmounted || !dragState.value) return;
       const delta = event.clientX - dragState.value.initialX;
       const minDelta = -(dragState.value.leftColumn.width - dragState.value.leftColumn.minWidth);
       let maxDelta;
@@ -4918,7 +5185,7 @@ const _sfc_main$2 = {
         columnIndex: dragState.value.columnIndex,
         delta: constrainedDelta
       });
-    }, 16);
+    }, THROTTLE_INTERVAL_MS);
     const onDocumentMouseMove = mouseMoveThrottle.throttled;
     function onDocumentMouseUp(event) {
       if (!dragState.value) return;
@@ -4933,13 +5200,11 @@ const _sfc_main$2 = {
       }
       document.removeEventListener("mousemove", onDocumentMouseMove);
       document.removeEventListener("mouseup", onDocumentMouseUp);
-      if (props.editor?.view) {
+      if (props.editor?.view?.dom) {
         const pmView = props.editor.view.dom;
-        if (pmView && pmView.style) {
-          pmView.style.pointerEvents = "auto";
-        }
+        pmView.style.pointerEvents = "auto";
       }
-      if (!forcedCleanup.value && Math.abs(finalDelta) > 1) {
+      if (!forcedCleanup.value && Math.abs(finalDelta) > MIN_RESIZE_DELTA_PX) {
         dispatchResizeTransaction(columnIndex, newWidths);
         emit("resize-end", {
           columnIndex,
@@ -4986,7 +5251,7 @@ const _sfc_main$2 = {
         updateCellColwidths(tr, tableNode, tablePos, affectedColumns, newWidths);
         dispatch(tr);
         const blockId = props.tableElement?.getAttribute("data-sd-block-id");
-        if (blockId) {
+        if (blockId && blockId.trim()) {
           measureCache.invalidate([blockId]);
         }
         emit("resize-success", { columnIndex, newWidths });
@@ -5002,7 +5267,14 @@ const _sfc_main$2 = {
       if (!pmElement) {
         return null;
       }
-      const pmStart = parseInt(pmElement.getAttribute("data-pm-start"), 10);
+      const pmStartAttr = pmElement.getAttribute("data-pm-start");
+      if (!pmStartAttr) {
+        return null;
+      }
+      const pmStart = parseInt(pmStartAttr, 10);
+      if (!Number.isFinite(pmStart)) {
+        return null;
+      }
       let tablePos = null;
       state.doc.descendants((node, pos) => {
         if (node.type.name === "table") {
@@ -5054,6 +5326,12 @@ const _sfc_main$2 = {
       () => props.tableElement,
       () => {
         parseTableMetadata();
+        updateOverlayRect();
+        if (props.visible && props.tableElement) {
+          startOverlayTracking();
+        } else if (!props.tableElement) {
+          stopOverlayTracking();
+        }
       },
       { immediate: true }
     );
@@ -5062,7 +5340,10 @@ const _sfc_main$2 = {
       (visible) => {
         if (visible) {
           parseTableMetadata();
+          updateOverlayRect();
+          startOverlayTracking();
         } else {
+          stopOverlayTracking();
           if (dragState.value) {
             forcedCleanup.value = true;
             onDocumentMouseUp(new MouseEvent("mouseup"));
@@ -5071,8 +5352,15 @@ const _sfc_main$2 = {
         }
       }
     );
+    onMounted(() => {
+      window.addEventListener("scroll", updateOverlayRect, true);
+      window.addEventListener("resize", updateOverlayRect);
+      updateOverlayRect();
+    });
     onBeforeUnmount(() => {
+      isUnmounted = true;
       mouseMoveThrottle.cancel();
+      stopOverlayTracking();
       if (dragState.value) {
         document.removeEventListener("mousemove", onDocumentMouseMove);
         document.removeEventListener("mouseup", onDocumentMouseUp);
@@ -5080,6 +5368,8 @@ const _sfc_main$2 = {
           props.editor.view.dom.style.pointerEvents = "auto";
         }
       }
+      window.removeEventListener("scroll", updateOverlayRect, true);
+      window.removeEventListener("resize", updateOverlayRect);
     });
     return (_ctx, _cache) => {
       return __props.visible && tableMetadata.value ? (openBlock(), createElementBlock("div", {
@@ -5089,17 +5379,456 @@ const _sfc_main$2 = {
         onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {
         }, ["stop"]))
       }, [
-        (openBlock(true), createElementBlock(Fragment, null, renderList(resizableBoundaries.value, (boundary, index) => {
+        (openBlock(true), createElementBlock(Fragment, null, renderList(resizableBoundaries.value, (boundary, resizableBoundaryIndex) => {
+          return openBlock(), createElementBlock(Fragment, {
+            key: `boundary-${resizableBoundaryIndex}`
+          }, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(getBoundarySegments(boundary), (segment, segmentIndex) => {
+              return openBlock(), createElementBlock("div", {
+                key: `handle-${boundary.type}-${boundary.index}-${segmentIndex}`,
+                class: normalizeClass(["resize-handle", {
+                  "resize-handle--active": dragState.value && dragState.value.resizableBoundaryIndex === resizableBoundaryIndex,
+                  "resize-handle--edge": boundary.type === "right-edge"
+                }]),
+                "data-boundary-index": resizableBoundaryIndex,
+                "data-boundary-type": boundary.type,
+                style: normalizeStyle(getSegmentHandleStyle(boundary, segment)),
+                onMousedown: ($event) => onHandleMouseDown($event, resizableBoundaryIndex)
+              }, null, 46, _hoisted_1$3);
+            }), 128))
+          ], 64);
+        }), 128)),
+        dragState.value ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: "resize-guideline",
+          style: normalizeStyle(guidelineStyle.value)
+        }, null, 4)) : createCommentVNode("", true)
+      ], 36)) : createCommentVNode("", true);
+    };
+  }
+};
+const TableResizeOverlay = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-2fdf7836"]]);
+const _hoisted_1$2 = ["data-handle-position", "onMousedown"];
+const OVERLAY_EXPANSION_PX = 2e3;
+const RESIZE_HANDLE_SIZE_PX = 12;
+const MOUSE_MOVE_THROTTLE_MS = 16;
+const DIMENSION_CHANGE_THRESHOLD_PX = 1;
+const Z_INDEX_OVERLAY = 10;
+const Z_INDEX_HANDLE = 15;
+const Z_INDEX_GUIDELINE = 20;
+const _sfc_main$3 = {
+  __name: "ImageResizeOverlay",
+  props: {
+    /** Editor instance for dispatching transactions */
+    editor: {
+      type: Object,
+      required: true
+    },
+    /** Show or hide the overlay */
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    /** Image fragment element containing data-image-metadata */
+    imageElement: {
+      type: Object,
+      default: null
+    }
+  },
+  emits: ["resize-start", "resize-move", "resize-end", "resize-success", "resize-error"],
+  setup(__props, { emit: __emit }) {
+    useCssVars((_ctx) => ({
+      "v1e81f81d": RESIZE_HANDLE_SIZE_PX + "px",
+      "v12763124": Z_INDEX_HANDLE
+    }));
+    function isValidEditor(editor) {
+      return editor && typeof editor === "object" && editor.view && typeof editor.view === "object" && editor.view.dom instanceof HTMLElement && editor.view.state && typeof editor.view.dispatch === "function";
+    }
+    const props = __props;
+    const emit = __emit;
+    const imageMetadata = ref(null);
+    const dragState = ref(null);
+    const forcedCleanup = ref(false);
+    const overlayStyle = computed(() => {
+      if (!props.imageElement || !props.imageElement.isConnected) return {};
+      const imageRect = props.imageElement.getBoundingClientRect();
+      const wrapper = props.imageElement.closest(".super-editor");
+      if (!wrapper) {
+        return {
+          position: "absolute",
+          left: `${props.imageElement.offsetLeft}px`,
+          top: `${props.imageElement.offsetTop}px`,
+          width: `${imageRect.width}px`,
+          height: `${imageRect.height}px`,
+          pointerEvents: dragState.value ? "auto" : "none",
+          zIndex: Z_INDEX_OVERLAY
+        };
+      }
+      const wrapperRect = wrapper.getBoundingClientRect();
+      const scrollLeft = wrapper.scrollLeft || 0;
+      const scrollTop = wrapper.scrollTop || 0;
+      const relativeLeft = imageRect.left - wrapperRect.left + scrollLeft;
+      const relativeTop = imageRect.top - wrapperRect.top + scrollTop;
+      let overlayWidth = imageRect.width;
+      let overlayHeight = imageRect.height;
+      let offsetX = 0;
+      let offsetY = 0;
+      if (dragState.value) {
+        const expansion = OVERLAY_EXPANSION_PX;
+        overlayWidth = imageRect.width + expansion * 2;
+        overlayHeight = imageRect.height + expansion * 2;
+        offsetX = -expansion;
+        offsetY = -expansion;
+      }
+      return {
+        position: "absolute",
+        left: `${relativeLeft + offsetX}px`,
+        top: `${relativeTop + offsetY}px`,
+        width: `${overlayWidth}px`,
+        height: `${overlayHeight}px`,
+        pointerEvents: dragState.value ? "auto" : "none",
+        zIndex: Z_INDEX_OVERLAY
+      };
+    });
+    const resizeHandles = computed(() => {
+      if (!imageMetadata.value || !props.imageElement) {
+        return [];
+      }
+      const rect = props.imageElement.getBoundingClientRect();
+      const width = rect.width;
+      const height = rect.height;
+      const handleSize = RESIZE_HANDLE_SIZE_PX;
+      const offset = handleSize / 2;
+      const expansion = dragState.value ? OVERLAY_EXPANSION_PX : 0;
+      return [
+        {
+          position: "nw",
+          style: {
+            left: `${expansion - offset}px`,
+            top: `${expansion - offset}px`,
+            cursor: "nwse-resize"
+          }
+        },
+        {
+          position: "ne",
+          style: {
+            left: `${expansion + width - offset}px`,
+            top: `${expansion - offset}px`,
+            cursor: "nesw-resize"
+          }
+        },
+        {
+          position: "sw",
+          style: {
+            left: `${expansion - offset}px`,
+            top: `${expansion + height - offset}px`,
+            cursor: "nesw-resize"
+          }
+        },
+        {
+          position: "se",
+          style: {
+            left: `${expansion + width - offset}px`,
+            top: `${expansion + height - offset}px`,
+            cursor: "nwse-resize"
+          }
+        }
+      ];
+    });
+    const guidelineStyle = computed(() => {
+      if (!dragState.value || !props.imageElement) {
+        return { display: "none" };
+      }
+      const expansion = OVERLAY_EXPANSION_PX;
+      return {
+        position: "absolute",
+        left: `${expansion}px`,
+        top: `${expansion}px`,
+        width: `${dragState.value.constrainedWidth}px`,
+        height: `${dragState.value.constrainedHeight}px`,
+        border: "2px solid #4A90E2",
+        pointerEvents: "none",
+        zIndex: Z_INDEX_GUIDELINE,
+        boxSizing: "border-box"
+      };
+    });
+    function parseImageMetadata() {
+      if (!props.imageElement || !props.imageElement.isConnected) {
+        imageMetadata.value = null;
+        return;
+      }
+      try {
+        const metadataAttr = props.imageElement.getAttribute("data-image-metadata");
+        if (!metadataAttr) {
+          imageMetadata.value = null;
+          return;
+        }
+        const parsed = JSON.parse(metadataAttr);
+        if (!parsed || typeof parsed !== "object") {
+          imageMetadata.value = null;
+          return;
+        }
+        const required = [
+          "originalWidth",
+          "originalHeight",
+          "maxWidth",
+          "maxHeight",
+          "aspectRatio",
+          "minWidth",
+          "minHeight"
+        ];
+        for (const field of required) {
+          if (!Number.isFinite(parsed[field]) || parsed[field] <= 0) {
+            console.warn(`[ImageResizeOverlay] Invalid or missing metadata field: ${field}`);
+            imageMetadata.value = null;
+            return;
+          }
+        }
+        imageMetadata.value = parsed;
+      } catch (error) {
+        imageMetadata.value = null;
+        emit("resize-error", {
+          error: error instanceof Error ? error.message : "Failed to parse image metadata",
+          rawMetadata: props.imageElement?.getAttribute("data-image-metadata")
+        });
+      }
+    }
+    function onHandleMouseDown(event, handlePosition) {
+      event.preventDefault();
+      event.stopPropagation();
+      if (!isValidEditor(props.editor) || !imageMetadata.value || !props.imageElement) return;
+      const rect = props.imageElement.getBoundingClientRect();
+      dragState.value = {
+        handle: handlePosition,
+        initialX: event.clientX,
+        initialY: event.clientY,
+        initialWidth: rect.width,
+        initialHeight: rect.height,
+        aspectRatio: imageMetadata.value.aspectRatio,
+        constrainedWidth: rect.width,
+        constrainedHeight: rect.height
+      };
+      const pmView = props.editor.view.dom;
+      pmView.style.pointerEvents = "none";
+      document.addEventListener("mousemove", onDocumentMouseMove);
+      document.addEventListener("mouseup", onDocumentMouseUp);
+      document.addEventListener("keydown", onEscapeKey);
+      emit("resize-start", {
+        blockId: props.imageElement.getAttribute("data-sd-block-id"),
+        initialWidth: rect.width,
+        initialHeight: rect.height
+      });
+    }
+    function throttle(func, limit) {
+      let inThrottle;
+      let timeoutId = null;
+      const throttled = function(...args) {
+        if (!inThrottle) {
+          func.apply(this, args);
+          inThrottle = true;
+          timeoutId = setTimeout(() => {
+            inThrottle = false;
+            timeoutId = null;
+          }, limit);
+        }
+      };
+      const cancel = () => {
+        if (timeoutId !== null) {
+          clearTimeout(timeoutId);
+          timeoutId = null;
+          inThrottle = false;
+        }
+      };
+      return { throttled, cancel };
+    }
+    const mouseMoveThrottle = throttle((event) => {
+      if (!dragState.value || !imageMetadata.value) return;
+      let deltaX = event.clientX - dragState.value.initialX;
+      let deltaY = event.clientY - dragState.value.initialY;
+      const handle = dragState.value.handle;
+      if (handle === "nw") {
+        deltaX = -deltaX;
+        deltaY = -deltaY;
+      } else if (handle === "ne") {
+        deltaY = -deltaY;
+      } else if (handle === "sw") {
+        deltaX = -deltaX;
+      }
+      const scaleX = (dragState.value.initialWidth + deltaX) / dragState.value.initialWidth;
+      const scaleY = (dragState.value.initialHeight + deltaY) / dragState.value.initialHeight;
+      const scale = Math.max(scaleX, scaleY);
+      let newWidth = dragState.value.initialWidth * scale;
+      let newHeight = dragState.value.initialHeight * scale;
+      const minWidth = imageMetadata.value.minWidth;
+      const minHeight = imageMetadata.value.minHeight;
+      const maxWidth = imageMetadata.value.maxWidth;
+      const maxHeight = imageMetadata.value.maxHeight;
+      if (newWidth < minWidth) {
+        newWidth = minWidth;
+        newHeight = newWidth / dragState.value.aspectRatio;
+      }
+      if (newHeight < minHeight) {
+        newHeight = minHeight;
+        newWidth = newHeight * dragState.value.aspectRatio;
+      }
+      if (newWidth > maxWidth) {
+        newWidth = maxWidth;
+        newHeight = newWidth / dragState.value.aspectRatio;
+      }
+      if (newHeight > maxHeight) {
+        newHeight = maxHeight;
+        newWidth = newHeight * dragState.value.aspectRatio;
+      }
+      dragState.value.constrainedWidth = newWidth;
+      dragState.value.constrainedHeight = newHeight;
+      emit("resize-move", {
+        blockId: props.imageElement.getAttribute("data-sd-block-id"),
+        width: newWidth,
+        height: newHeight
+      });
+    }, MOUSE_MOVE_THROTTLE_MS);
+    const onDocumentMouseMove = mouseMoveThrottle.throttled;
+    function onEscapeKey(event) {
+      if (event.key === "Escape" && dragState.value) {
+        forcedCleanup.value = true;
+        onDocumentMouseUp(new MouseEvent("mouseup"));
+        forcedCleanup.value = false;
+      }
+    }
+    function onDocumentMouseUp(event) {
+      if (!dragState.value) return;
+      const finalWidth = dragState.value.constrainedWidth;
+      const finalHeight = dragState.value.constrainedHeight;
+      const blockId = props.imageElement?.getAttribute("data-sd-block-id");
+      document.removeEventListener("mousemove", onDocumentMouseMove);
+      document.removeEventListener("mouseup", onDocumentMouseUp);
+      document.removeEventListener("keydown", onEscapeKey);
+      if (props.editor?.view) {
+        const pmView = props.editor.view.dom;
+        if (pmView && pmView.style) {
+          pmView.style.pointerEvents = "auto";
+        }
+      }
+      const widthDelta = Math.abs(finalWidth - dragState.value.initialWidth);
+      const heightDelta = Math.abs(finalHeight - dragState.value.initialHeight);
+      if (!forcedCleanup.value && (widthDelta > DIMENSION_CHANGE_THRESHOLD_PX || heightDelta > DIMENSION_CHANGE_THRESHOLD_PX)) {
+        dispatchResizeTransaction(blockId, finalWidth, finalHeight);
+        emit("resize-end", {
+          blockId,
+          finalWidth,
+          finalHeight
+        });
+      }
+      dragState.value = null;
+    }
+    function dispatchResizeTransaction(blockId, newWidth, newHeight) {
+      if (!isValidEditor(props.editor) || !props.imageElement) {
+        return;
+      }
+      if (!Number.isFinite(newWidth) || !Number.isFinite(newHeight) || newWidth <= 0 || newHeight <= 0) {
+        emit("resize-error", {
+          blockId,
+          error: "Invalid dimensions: width and height must be positive finite numbers"
+        });
+        return;
+      }
+      try {
+        const { state, dispatch } = props.editor.view;
+        const tr = state.tr;
+        const pmStartAttr = props.imageElement.getAttribute("data-pm-start");
+        if (!pmStartAttr) {
+          emit("resize-error", {
+            blockId,
+            error: "Image position marker (data-pm-start) not found"
+          });
+          return;
+        }
+        const imagePos = parseInt(pmStartAttr, 10);
+        if (!Number.isFinite(imagePos) || imagePos < 0) {
+          emit("resize-error", {
+            blockId,
+            error: "Invalid image position marker"
+          });
+          return;
+        }
+        const imageNode = state.doc.nodeAt(imagePos);
+        if (!imageNode || imageNode.type.name !== "image") {
+          emit("resize-error", {
+            blockId,
+            error: "Invalid image node at position"
+          });
+          return;
+        }
+        const newAttrs = {
+          ...imageNode.attrs,
+          size: {
+            width: Math.round(newWidth),
+            height: Math.round(newHeight)
+          }
+        };
+        tr.setNodeMarkup(imagePos, null, newAttrs);
+        dispatch(tr);
+        if (blockId && blockId.trim()) {
+          measureCache.invalidate([blockId]);
+        }
+        emit("resize-success", { blockId, newWidth, newHeight });
+      } catch (error) {
+        emit("resize-error", {
+          blockId,
+          error: error instanceof Error ? error.message : String(error)
+        });
+      }
+    }
+    watch(
+      () => props.imageElement,
+      () => {
+        parseImageMetadata();
+      },
+      { immediate: true }
+    );
+    watch(
+      () => props.visible,
+      (visible) => {
+        if (visible) {
+          parseImageMetadata();
+        } else {
+          if (dragState.value) {
+            forcedCleanup.value = true;
+            onDocumentMouseUp(new MouseEvent("mouseup"));
+            forcedCleanup.value = false;
+          }
+        }
+      }
+    );
+    onBeforeUnmount(() => {
+      mouseMoveThrottle.cancel();
+      if (dragState.value) {
+        document.removeEventListener("mousemove", onDocumentMouseMove);
+        document.removeEventListener("mouseup", onDocumentMouseUp);
+        document.removeEventListener("keydown", onEscapeKey);
+        if (props.editor?.view?.dom) {
+          props.editor.view.dom.style.pointerEvents = "auto";
+        }
+      }
+    });
+    return (_ctx, _cache) => {
+      return __props.visible && imageMetadata.value ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        class: "superdoc-image-resize-overlay",
+        style: normalizeStyle(overlayStyle.value),
+        onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {
+        }, ["stop"]))
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(resizeHandles.value, (handle) => {
           return openBlock(), createElementBlock("div", {
-            key: `handle-${boundary.type}-${boundary.index}`,
+            key: handle.position,
             class: normalizeClass(["resize-handle", {
-              "resize-handle--active": dragState.value && dragState.value.boundaryIndex === index,
-              "resize-handle--edge": boundary.type === "right-edge"
+              "resize-handle--active": dragState.value && dragState.value.handle === handle.position,
+              [`resize-handle--${handle.position}`]: true
             }]),
-            "data-boundary-index": index,
-            "data-boundary-type": boundary.type,
-            style: normalizeStyle(getHandleStyle(boundary)),
-            onMousedown: ($event) => onHandleMouseDown($event, index)
+            style: normalizeStyle(handle.style),
+            "data-handle-position": handle.position,
+            onMousedown: ($event) => onHandleMouseDown($event, handle.position)
           }, null, 46, _hoisted_1$2);
         }), 128)),
         dragState.value ? (openBlock(), createElementBlock("div", {
@@ -5111,7 +5840,81 @@ const _sfc_main$2 = {
     };
   }
 };
-const TableResizeOverlay = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-acc51d8d"]]);
+const ImageResizeOverlay = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-e66ec7bb"]]);
+const _sfc_main$2 = {
+  __name: "LinkClickHandler",
+  props: {
+    editor: {
+      type: Object,
+      required: true
+    },
+    openPopover: {
+      type: Function,
+      required: true
+    },
+    closePopover: {
+      type: Function,
+      required: true
+    },
+    popoverVisible: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const handleLinkClick = (event) => {
+      if (props.popoverVisible) {
+        props.closePopover();
+        return;
+      }
+      if (!props.editor || !props.editor.state) {
+        return;
+      }
+      const surface = getEditorSurfaceElement(props.editor);
+      if (!surface) {
+        return;
+      }
+      moveCursorToMouseEvent(event.detail, props.editor);
+      setTimeout(() => {
+        const currentState = props.editor.state;
+        const hasLink = selectionHasNodeOrMark(currentState, "link", { requireEnds: true });
+        if (hasLink) {
+          const surfaceRect = surface.getBoundingClientRect();
+          if (!surfaceRect) return;
+          props.openPopover(
+            markRaw(LinkInput),
+            {
+              showInput: true,
+              editor: props.editor,
+              closePopover: props.closePopover
+            },
+            {
+              left: `${event.detail.clientX - surfaceRect.left}px`,
+              top: `${event.detail.clientY - surfaceRect.top + 15}px`
+            }
+          );
+        }
+      }, 10);
+    };
+    let surfaceElement = null;
+    onMounted(() => {
+      if (!props.editor) return;
+      surfaceElement = getEditorSurfaceElement(props.editor);
+      if (surfaceElement) {
+        surfaceElement.addEventListener("superdoc-link-click", handleLinkClick);
+      }
+    });
+    onBeforeUnmount(() => {
+      if (surfaceElement) {
+        surfaceElement.removeEventListener("superdoc-link-click", handleLinkClick);
+      }
+    });
+    return (_ctx, _cache) => {
+      return null;
+    };
+  }
+};
 function adjustPaginationBreaks(editorElem, editor) {
   if (!editorElem.value || !editor?.value?.options?.scale || isHeadless(editor)) return;
   const zoom = editor.value.options.scale;
@@ -5136,6 +5939,8 @@ const _hoisted_2 = {
 };
 const _hoisted_3 = { class: "placeholder-title" };
 const DOCX = "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
+const TABLE_RESIZE_HOVER_THRESHOLD = 8;
+const TABLE_RESIZE_THROTTLE_MS = 16;
 const _sfc_main$1 = {
   __name: "SuperEditor",
   props: {
@@ -5200,7 +6005,63 @@ const _sfc_main$1 = {
       visible: false,
       tableElement: null
     });
+    const imageResizeState = reactive({
+      visible: false,
+      imageElement: null,
+      blockId: null
+    });
+    let lastUpdateTableResizeTimestamp = 0;
+    const isNearColumnBoundary = (event, tableElement) => {
+      if (!event || typeof event.clientX !== "number" || typeof event.clientY !== "number") {
+        console.warn("[isNearColumnBoundary] Invalid event: missing clientX or clientY", event);
+        return false;
+      }
+      if (!tableElement || !(tableElement instanceof HTMLElement)) {
+        console.warn("[isNearColumnBoundary] Invalid tableElement: not an HTMLElement", tableElement);
+        return false;
+      }
+      const boundariesAttr = tableElement.getAttribute("data-table-boundaries");
+      if (!boundariesAttr) return false;
+      try {
+        const metadata = JSON.parse(boundariesAttr);
+        if (!metadata.columns || !Array.isArray(metadata.columns)) return false;
+        const tableRect = tableElement.getBoundingClientRect();
+        const mouseX = event.clientX - tableRect.left;
+        const mouseY = event.clientY - tableRect.top;
+        for (let i2 = 0; i2 < metadata.columns.length; i2++) {
+          const col = metadata.columns[i2];
+          const boundaryX = col.x + col.w;
+          if (Math.abs(mouseX - boundaryX) <= TABLE_RESIZE_HOVER_THRESHOLD) {
+            const segmentColIndex = i2 + 1;
+            const segments = metadata.segments?.[segmentColIndex];
+            if (!segments || segments.length === 0) {
+              if (i2 === metadata.columns.length - 1) return true;
+              continue;
+            }
+            for (const seg of segments) {
+              const segTop = seg.y || 0;
+              const segBottom = seg.h != null ? segTop + seg.h : tableRect.height;
+              if (mouseY >= segTop && mouseY <= segBottom) {
+                return true;
+              }
+            }
+          }
+        }
+        if (Math.abs(mouseX) <= TABLE_RESIZE_HOVER_THRESHOLD) {
+          return true;
+        }
+        return false;
+      } catch (e) {
+        console.warn("[isNearColumnBoundary] Failed to parse table boundary metadata:", e);
+        return false;
+      }
+    };
     const updateTableResizeOverlay = (event) => {
+      const now = Date.now();
+      if (now - lastUpdateTableResizeTimestamp < TABLE_RESIZE_THROTTLE_MS) {
+        return;
+      }
+      lastUpdateTableResizeTimestamp = now;
       if (!editorElem.value) return;
       let target = event.target;
       while (target && target !== editorElem.value) {
@@ -5208,8 +6069,13 @@ const _sfc_main$1 = {
           return;
         }
         if (target.classList?.contains("superdoc-table-fragment") && target.hasAttribute("data-table-boundaries")) {
-          tableResizeState.visible = true;
-          tableResizeState.tableElement = target;
+          if (isNearColumnBoundary(event, target)) {
+            tableResizeState.visible = true;
+            tableResizeState.tableElement = target;
+          } else {
+            tableResizeState.visible = false;
+            tableResizeState.tableElement = null;
+          }
           return;
         }
         target = target.parentElement;
@@ -5221,6 +6087,38 @@ const _sfc_main$1 = {
       tableResizeState.visible = false;
       tableResizeState.tableElement = null;
     };
+    const updateImageResizeOverlay = (event) => {
+      if (!editorElem.value) return;
+      let target = event.target;
+      while (target && target !== document.body) {
+        if (target.classList?.contains("superdoc-image-resize-overlay") || target.closest?.(".superdoc-image-resize-overlay")) {
+          return;
+        }
+        if (target.classList?.contains("superdoc-image-fragment") && target.hasAttribute("data-image-metadata")) {
+          imageResizeState.visible = true;
+          imageResizeState.imageElement = target;
+          imageResizeState.blockId = target.getAttribute("data-sd-block-id");
+          return;
+        }
+        target = target.parentElement;
+      }
+      imageResizeState.visible = false;
+      imageResizeState.imageElement = null;
+      imageResizeState.blockId = null;
+    };
+    const hideImageResizeOverlay = () => {
+      imageResizeState.visible = false;
+      imageResizeState.imageElement = null;
+      imageResizeState.blockId = null;
+    };
+    const handleOverlayUpdates = (event) => {
+      updateTableResizeOverlay(event);
+      updateImageResizeOverlay(event);
+    };
+    const handleOverlayHide = () => {
+      hideTableResizeOverlay();
+      hideImageResizeOverlay();
+    };
     let dataPollTimeout;
     const stopPolling = () => {
       clearTimeout(dataPollTimeout);
@@ -5307,6 +6205,22 @@ const _sfc_main$1 = {
         const paginationTarget = editor.value?.editor ? { value: base } : editor;
         adjustPaginationBreaks(editorElem, paginationTarget);
       });
+      if (editor.value instanceof PresentationEditor) {
+        editor.value.on("layoutUpdated", () => {
+          if (imageResizeState.visible && imageResizeState.blockId) {
+            const newElement = editorElem.value?.querySelector(
+              `.superdoc-image-fragment[data-sd-block-id="${imageResizeState.blockId}"]`
+            );
+            if (newElement) {
+              imageResizeState.imageElement = newElement;
+            } else {
+              imageResizeState.visible = false;
+              imageResizeState.imageElement = null;
+              imageResizeState.blockId = null;
+            }
+          }
+        });
+      }
       editor.value.on("collaborationReady", () => {
         setTimeout(() => {
           editorReady.value = true;
@@ -5391,8 +6305,8 @@ const _sfc_main$1 = {
           onKeydown: handleSuperEditorKeydown,
           onClick: handleSuperEditorClick,
           onMousedown: handleMarginClick,
-          onMousemove: updateTableResizeOverlay,
-          onMouseleave: hideTableResizeOverlay
+          onMousemove: handleOverlayUpdates,
+          onMouseleave: handleOverlayHide
         }, [
           createElementVNode("div", {
             ref_key: "editorElem",
@@ -5400,19 +6314,32 @@ const _sfc_main$1 = {
             class: "editor-element super-editor__element",
             role: "presentation"
           }, null, 512),
-          !contextMenuDisabled.value && editorReady.value && activeEditor.value ? (openBlock(), createBlock(_sfc_main$6, {
+          !contextMenuDisabled.value && editorReady.value && activeEditor.value ? (openBlock(), createBlock(_sfc_main$8, {
             key: 0,
             editor: activeEditor.value,
             popoverControls,
             openPopover,
             closePopover
           }, null, 8, ["editor", "popoverControls"])) : createCommentVNode("", true),
-          editorReady.value && activeEditor.value ? (openBlock(), createBlock(TableResizeOverlay, {
+          editorReady.value && activeEditor.value ? (openBlock(), createBlock(_sfc_main$2, {
             key: 1,
             editor: activeEditor.value,
+            openPopover,
+            closePopover,
+            popoverVisible: popoverControls.visible
+          }, null, 8, ["editor", "popoverVisible"])) : createCommentVNode("", true),
+          editorReady.value && activeEditor.value ? (openBlock(), createBlock(TableResizeOverlay, {
+            key: 2,
+            editor: activeEditor.value,
             visible: tableResizeState.visible,
             tableElement: tableResizeState.tableElement
-          }, null, 8, ["editor", "visible", "tableElement"])) : createCommentVNode("", true)
+          }, null, 8, ["editor", "visible", "tableElement"])) : createCommentVNode("", true),
+          editorReady.value && activeEditor.value ? (openBlock(), createBlock(ImageResizeOverlay, {
+            key: 3,
+            editor: activeEditor.value,
+            visible: imageResizeState.visible,
+            imageElement: imageResizeState.imageElement
+          }, null, 8, ["editor", "visible", "imageElement"])) : createCommentVNode("", true)
         ], 544),
         !editorReady.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
           createElementVNode("div", _hoisted_3, [
@@ -5475,7 +6402,7 @@ const _sfc_main$1 = {
     };
   }
 };
-const SuperEditor = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-f1e98438"]]);
+const SuperEditor = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-ed5a08ee"]]);
 const _hoisted_1 = ["innerHTML"];
 const _sfc_main = {
   __name: "SuperInput",
@@ -5567,98 +6494,6 @@ const _sfc_main = {
   }
 };
 const SuperInput = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4d5cff52"]]);
-const additionalHandlers = Object.freeze({
-  "mc:AlternateContent": translator$1j,
-  "sd:pageReference": translator$1i,
-  "sd:tableOfContents": translator$1h,
-  "w:b": translator$1g,
-  "w:bCs": translator$1f,
-  "w:bidiVisual": translator$1e,
-  "w:bookmarkEnd": translator$1d,
-  "w:bookmarkStart": translator$1c,
-  "w:bottom": translator$1b,
-  "w:br": translator$1a,
-  "w:cantSplit": translator$19,
-  "w:caps": translator$18,
-  "w:cnfStyle": translator$17,
-  "w:color": translator$16,
-  "w:divId": translator$15,
-  "w:drawing": translator$14,
-  "w:end": translator$13,
-  "w:gridAfter": translator$12,
-  "w:gridBefore": translator$11,
-  "w:gridCol": translator$10,
-  "w:hidden": translator$$,
-  "w:highlight": translator$_,
-  "w:hyperlink": translator$Z,
-  "w:i": translator$Y,
-  "w:insideH": translator$X,
-  "w:insideV": translator$W,
-  "w:jc": translator$V,
-  "w:left": translator$U,
-  "w:p": translator$T,
-  "w:r": translator$S,
-  "w:rFonts": translator$R,
-  "w:rPr": translator$Q,
-  "w:rStyle": translator$P,
-  "w:right": translator$O,
-  "w:sdt": translator$N,
-  "w:shd": translator$M,
-  "w:start": translator$L,
-  "w:strike": translator$K,
-  "w:sz": translator$J,
-  "w:szCs": translator$I,
-  "w:tab": translator$H,
-  "w:tbl": translator$G,
-  "w:tblBorders": translator$F,
-  "w:tblCaption": translator$E,
-  "w:tblCellMar": translator$D,
-  "w:tblCellSpacing": translator$C,
-  "w:tblDescription": translator$B,
-  "w:tblGrid": translator$A,
-  "w:tblHeader": translator$z,
-  "w:tblInd": translator$y,
-  "w:tblLayout": translator$x,
-  "w:tblLook": translator$w,
-  "w:tblOverlap": translator$v,
-  "w:tblPr": translator$u,
-  "w:tblStyle": translator$t,
-  "w:tblStyleColBandSize": translator$s,
-  "w:tblStyleRowBandSize": translator$r,
-  "w:tblW": translator$q,
-  "w:tblpPr": translator$p,
-  "w:tc": translator$o,
-  "w:top": translator$n,
-  "w:tr": translator$m,
-  "w:trHeight": translator$l,
-  "w:trPr": translator$k,
-  "w:u": translator$j,
-  "w:wAfter": translator$i,
-  "w:wBefore": translator$h,
-  "wp:anchor": translator$g,
-  "wp:inline": translator$f,
-  "w:commentRangeStart": commentRangeStartTranslator,
-  "w:commentRangeEnd": commentRangeEndTranslator,
-  "w:vMerge": translator$e,
-  "w:gridSpan": translator$d,
-  "w:vAlign": translator$c,
-  "w:noWrap": translator$b,
-  "w:tcFitText": translator$a,
-  "w:tcW": translator$9,
-  "w:hideMark": translator$8,
-  "w:textDirection": translator$7,
-  "w:tl2br": translator$6,
-  "w:tr2bl": translator$5,
-  "w:header": translator$4,
-  "w:headers": translator$3,
-  "w:tcBorders": translator$2,
-  "w:tcMar": translator$1,
-  "w:tcPr": translator
-});
-const baseHandlers = {
-  ...additionalHandlers
-};
-const registeredHandlers = Object.freeze(baseHandlers);
 const Extensions = {
   Node,
   Attribute,
@@ -5673,14 +6508,14 @@ const Extensions = {
 export {
   AIWriter,
   z as AnnotatorHelpers,
-  _sfc_main$5 as BasicUpload,
+  _sfc_main$7 as BasicUpload,
   F as CommentsPluginKey,
   D as DocxZipper,
   Editor,
   Extensions,
   PresentationEditor,
   B as SectionHelpers,
-  _sfc_main$6 as SlashMenu,
+  _sfc_main$8 as SlashMenu,
   ac as SuperConverter,
   SuperEditor,
   SuperInput,
@@ -5695,6 +6530,6 @@ export {
   getRichTextExtensions,
   getStarterExtensions,
   a9 as helpers,
-  registeredHandlers,
+  aQ as registeredHandlers,
   x as trackChangesHelpers
 };