@underverse-ui/underverse 1.0.102 → 1.0.104

package/api-reference.json

@@ -1,6 +1,6 @@
 {
   "package": "@underverse-ui/underverse",
-  "version": "1.0.102",
+  "version": "1.0.104",
   "sourceEntry": "src/index.ts",
   "totalExports": 225,
   "exports": [

package/dist/index.cjs

@@ -23278,8 +23278,8 @@ function useLocale2() {
 }
 
 // src/components/UEditor/UEditor.tsx
-var import_react53 = __toESM(require("react"), 1);
-var import_react54 = require("@tiptap/react");
+var import_react54 = __toESM(require("react"), 1);
+var import_react55 = require("@tiptap/react");
 
 // src/components/UEditor/extensions.ts
 var import_extension_document = __toESM(require("@tiptap/extension-document"), 1);
@@ -32052,47 +32052,210 @@ var UEDITOR_PROSEMIRROR_CLASS_NAME = cn(
 );
 
 // src/components/UEditor/use-table-interactions.ts
+var import_react53 = __toESM(require("react"), 1);
+
+// src/components/UEditor/use-table-row-resize.ts
 var import_react52 = __toESM(require("react"), 1);
+function useTableRowResize({
+  editor,
+  setHoveredTableCell,
+  clearHoveredTableCell,
+  showRowGuide,
+  clearAllTableResizeHover,
+  scheduleTableLayoutSync
+}) {
+  const commitFrameRef = (0, import_react52.useRef)(null);
+  const stateRef = (0, import_react52.useRef)(null);
+  const commitPreview = import_react52.default.useCallback(() => {
+    if (!editor) return;
+    const state = stateRef.current;
+    if (!state) return;
+    const nextHeight = state.pendingHeight;
+    if (nextHeight === state.previewHeight) {
+      document.body.style.cursor = "row-resize";
+      showRowGuide(state.tableElement, state.rowElement, state.cellElement);
+      scheduleTableLayoutSync();
+      return;
+    }
+    state.previewHeight = nextHeight;
+    const tr = editor.view.state.tr;
+    tr.setNodeMarkup(state.rowPos, void 0, {
+      ...state.rowNode.attrs,
+      rowHeight: nextHeight
+    });
+    tr.setMeta("addToHistory", false);
+    editor.view.dispatch(tr);
+    state.rowNode = editor.view.state.doc.nodeAt(state.rowPos) ?? state.rowNode;
+    const refreshedRow = state.tableElement.rows.item(state.rowElement.rowIndex);
+    if (refreshedRow instanceof HTMLTableRowElement) {
+      state.rowElement = refreshedRow;
+      const refreshedCell = refreshedRow.cells.item(state.cellIndex);
+      if (refreshedCell instanceof HTMLTableCellElement) {
+        state.cellElement = refreshedCell;
+      }
+    }
+    document.body.style.cursor = "row-resize";
+    showRowGuide(state.tableElement, state.rowElement, state.cellElement);
+    scheduleTableLayoutSync();
+  }, [editor, scheduleTableLayoutSync, showRowGuide]);
+  const scheduleCommit = import_react52.default.useCallback(() => {
+    if (commitFrameRef.current !== null) return;
+    commitFrameRef.current = window.requestAnimationFrame(() => {
+      commitFrameRef.current = null;
+      commitPreview();
+    });
+  }, [commitPreview]);
+  const syncActiveGuide = import_react52.default.useCallback(() => {
+    const state = stateRef.current;
+    if (!state) return false;
+    setHoveredTableCell(state.cellElement);
+    showRowGuide(state.tableElement, state.rowElement, state.cellElement);
+    return true;
+  }, [setHoveredTableCell, showRowGuide]);
+  const isResizing = import_react52.default.useCallback(() => stateRef.current !== null, []);
+  const beginResize = import_react52.default.useCallback((event, table, row, cell) => {
+    if (!editor || !isRowResizeHotspot(cell, event.clientX, event.clientY)) {
+      return false;
+    }
+    setHoveredTableCell(cell);
+    const rowInfo = findTableRowNodeInfo(editor.view, row);
+    if (!rowInfo) return false;
+    const startHeight = row.getBoundingClientRect().height;
+    stateRef.current = {
+      rowElement: row,
+      tableElement: table,
+      cellElement: cell,
+      cellIndex: cell.cellIndex,
+      rowPos: rowInfo.pos,
+      rowNode: rowInfo.node,
+      startY: event.clientY,
+      startHeight,
+      previewHeight: startHeight,
+      pendingHeight: startHeight
+    };
+    showRowGuide(table, row, cell);
+    document.body.style.cursor = "row-resize";
+    event.preventDefault();
+    event.stopPropagation();
+    return true;
+  }, [editor, setHoveredTableCell, showRowGuide]);
+  const handlePointerMove = import_react52.default.useCallback((event) => {
+    const state = stateRef.current;
+    if (!state) return;
+    const nextHeight = Math.max(
+      MIN_TABLE_ROW_HEIGHT,
+      Math.round(state.startHeight + (event.clientY - state.startY))
+    );
+    if (nextHeight === state.pendingHeight) {
+      document.body.style.cursor = "row-resize";
+      showRowGuide(state.tableElement, state.rowElement, state.cellElement);
+      return;
+    }
+    state.pendingHeight = nextHeight;
+    document.body.style.cursor = "row-resize";
+    scheduleCommit();
+  }, [scheduleCommit, showRowGuide]);
+  const handlePointerUp = import_react52.default.useCallback((event) => {
+    if (!editor) return;
+    const state = stateRef.current;
+    if (!state) return;
+    const nextHeight = Math.max(
+      MIN_TABLE_ROW_HEIGHT,
+      Math.round(state.startHeight + (event.clientY - state.startY))
+    );
+    state.pendingHeight = nextHeight;
+    if (commitFrameRef.current !== null) {
+      window.cancelAnimationFrame(commitFrameRef.current);
+      commitFrameRef.current = null;
+    }
+    commitPreview();
+    const latestState = stateRef.current ?? state;
+    const rowNode = editor.view.state.doc.nodeAt(latestState.rowPos) ?? latestState.rowNode;
+    if (rowNode.attrs.rowHeight !== nextHeight) {
+      const tr = editor.view.state.tr;
+      tr.setNodeMarkup(latestState.rowPos, void 0, {
+        ...rowNode.attrs,
+        rowHeight: nextHeight
+      });
+      editor.view.dispatch(tr);
+    }
+    stateRef.current = null;
+    document.body.style.cursor = "";
+    clearHoveredTableCell();
+    clearAllTableResizeHover();
+    scheduleTableLayoutSync();
+  }, [clearAllTableResizeHover, clearHoveredTableCell, commitPreview, editor, scheduleTableLayoutSync]);
+  const cancelResize = import_react52.default.useCallback(() => {
+    if (!stateRef.current) return;
+    if (commitFrameRef.current !== null) {
+      window.cancelAnimationFrame(commitFrameRef.current);
+      commitFrameRef.current = null;
+    }
+    stateRef.current = null;
+    document.body.style.cursor = "";
+    clearHoveredTableCell();
+    clearAllTableResizeHover();
+    scheduleTableLayoutSync();
+  }, [clearAllTableResizeHover, clearHoveredTableCell, scheduleTableLayoutSync]);
+  const cleanup = import_react52.default.useCallback(() => {
+    if (commitFrameRef.current !== null) {
+      window.cancelAnimationFrame(commitFrameRef.current);
+      commitFrameRef.current = null;
+    }
+    stateRef.current = null;
+    document.body.style.cursor = "";
+  }, []);
+  return {
+    beginResize,
+    cancelResize,
+    cleanup,
+    handlePointerMove,
+    handlePointerUp,
+    isResizing,
+    syncActiveGuide
+  };
+}
+
+// src/components/UEditor/use-table-interactions.ts
 function useUEditorTableInteractions(editor) {
-  const editorContentRef = (0, import_react52.useRef)(null);
-  const tableColumnGuideRef = (0, import_react52.useRef)(null);
-  const tableRowGuideRef = (0, import_react52.useRef)(null);
-  const activeTableCellHighlightRef = (0, import_react52.useRef)(null);
-  const hoveredTableCellRef = (0, import_react52.useRef)(null);
-  const activeTableCellRef = (0, import_react52.useRef)(null);
-  const tableLayoutSyncFrameRef = (0, import_react52.useRef)(null);
-  const rowResizeCommitFrameRef = (0, import_react52.useRef)(null);
-  const rowResizeStateRef = (0, import_react52.useRef)(null);
-  const setEditorResizeCursor = import_react52.default.useCallback((cursor) => {
+  const editorContentRef = (0, import_react53.useRef)(null);
+  const tableColumnGuideRef = (0, import_react53.useRef)(null);
+  const tableRowGuideRef = (0, import_react53.useRef)(null);
+  const activeTableCellHighlightRef = (0, import_react53.useRef)(null);
+  const hoveredTableCellRef = (0, import_react53.useRef)(null);
+  const activeTableCellRef = (0, import_react53.useRef)(null);
+  const suppressActiveCellHighlightRef = (0, import_react53.useRef)(false);
+  const tableLayoutSyncFrameRef = (0, import_react53.useRef)(null);
+  const setEditorResizeCursor = import_react53.default.useCallback((cursor) => {
     const proseMirror = editorContentRef.current?.querySelector(".ProseMirror");
     if (proseMirror) {
       proseMirror.style.cursor = cursor;
     }
   }, []);
-  const hideColumnGuide = import_react52.default.useCallback(() => {
+  const hideColumnGuide = import_react53.default.useCallback(() => {
     editorContentRef.current?.classList.remove("resize-cursor");
     const guide = tableColumnGuideRef.current;
     if (guide) {
       guide.style.opacity = "0";
     }
   }, []);
-  const hideRowGuide = import_react52.default.useCallback(() => {
+  const hideRowGuide = import_react53.default.useCallback(() => {
     editorContentRef.current?.classList.remove("resize-row-cursor");
     const guide = tableRowGuideRef.current;
     if (guide) {
       guide.style.opacity = "0";
     }
   }, []);
-  const clearAllTableResizeHover = import_react52.default.useCallback(() => {
+  const clearAllTableResizeHover = import_react53.default.useCallback(() => {
     setEditorResizeCursor("");
     hideColumnGuide();
     hideRowGuide();
   }, [hideColumnGuide, hideRowGuide, setEditorResizeCursor]);
-  const updateActiveCellHighlight = import_react52.default.useCallback((cell) => {
+  const updateActiveCellHighlight = import_react53.default.useCallback((cell) => {
     const surface = editorContentRef.current;
     const highlight = activeTableCellHighlightRef.current;
     if (!highlight) return;
-    if (!surface || !cell) {
+    if (suppressActiveCellHighlightRef.current || !surface || !cell) {
       highlight.style.display = "none";
       return;
     }
@@ -32103,7 +32266,7 @@ function useUEditorTableInteractions(editor) {
     highlight.style.width = `${metrics.width}px`;
     highlight.style.height = `${metrics.height}px`;
   }, []);
-  const scheduleTableLayoutSync = import_react52.default.useCallback(() => {
+  const scheduleTableLayoutSync = import_react53.default.useCallback(() => {
     if (tableLayoutSyncFrameRef.current !== null) return;
     tableLayoutSyncFrameRef.current = window.requestAnimationFrame(() => {
       tableLayoutSyncFrameRef.current = null;
@@ -32111,22 +32274,22 @@ function useUEditorTableInteractions(editor) {
       editorContentRef.current?.dispatchEvent(new CustomEvent(UEDITOR_TABLE_LAYOUT_CHANGE_EVENT));
     });
   }, [updateActiveCellHighlight]);
-  const setActiveTableCell = import_react52.default.useCallback((cell) => {
+  const setActiveTableCell = import_react53.default.useCallback((cell) => {
     if (activeTableCellRef.current === cell) return;
     activeTableCellRef.current = cell;
     updateActiveCellHighlight(activeTableCellRef.current);
   }, [updateActiveCellHighlight]);
-  const clearActiveTableCell = import_react52.default.useCallback(() => {
+  const clearActiveTableCell = import_react53.default.useCallback(() => {
     activeTableCellRef.current = null;
     updateActiveCellHighlight(null);
   }, [updateActiveCellHighlight]);
-  const setHoveredTableCell = import_react52.default.useCallback((cell) => {
+  const setHoveredTableCell = import_react53.default.useCallback((cell) => {
     hoveredTableCellRef.current = cell;
   }, []);
-  const clearHoveredTableCell = import_react52.default.useCallback(() => {
+  const clearHoveredTableCell = import_react53.default.useCallback(() => {
     hoveredTableCellRef.current = null;
   }, []);
-  const showColumnGuide = import_react52.default.useCallback((table, row, cell) => {
+  const showColumnGuide = import_react53.default.useCallback((table, row, cell) => {
     const surface = editorContentRef.current;
     const guide = tableColumnGuideRef.current;
     if (!surface || !guide) return;
@@ -32139,7 +32302,7 @@ function useUEditorTableInteractions(editor) {
     surface.classList.add("resize-cursor");
     setEditorResizeCursor("col-resize");
   }, [setEditorResizeCursor]);
-  const showRowGuide = import_react52.default.useCallback((table, row, cell) => {
+  const showRowGuide = import_react53.default.useCallback((table, row, cell) => {
     const surface = editorContentRef.current;
     const guide = tableRowGuideRef.current;
     if (!surface || !guide) return;
@@ -32152,50 +32315,27 @@ function useUEditorTableInteractions(editor) {
     surface.classList.add("resize-row-cursor");
     setEditorResizeCursor("row-resize");
   }, [setEditorResizeCursor]);
-  const commitRowResizePreview = import_react52.default.useCallback(() => {
-    if (!editor) return;
-    const state = rowResizeStateRef.current;
-    if (!state) return;
-    const nextHeight = state.pendingHeight;
-    if (nextHeight === state.previewHeight) {
-      document.body.style.cursor = "row-resize";
-      showRowGuide(state.tableElement, state.rowElement, state.cellElement);
-      scheduleTableLayoutSync();
-      return;
-    }
-    state.previewHeight = nextHeight;
-    const tr = editor.view.state.tr;
-    tr.setNodeMarkup(state.rowPos, void 0, {
-      ...state.rowNode.attrs,
-      rowHeight: nextHeight
-    });
-    tr.setMeta("addToHistory", false);
-    editor.view.dispatch(tr);
-    state.rowNode = editor.view.state.doc.nodeAt(state.rowPos) ?? state.rowNode;
-    const refreshedRow = state.tableElement.rows.item(state.rowElement.rowIndex);
-    if (refreshedRow instanceof HTMLTableRowElement) {
-      state.rowElement = refreshedRow;
-      const refreshedCell = refreshedRow.cells.item(state.cellIndex);
-      if (refreshedCell instanceof HTMLTableCellElement) {
-        state.cellElement = refreshedCell;
-      }
-    }
-    document.body.style.cursor = "row-resize";
-    showRowGuide(state.tableElement, state.rowElement, state.cellElement);
-    scheduleTableLayoutSync();
-  }, [editor, scheduleTableLayoutSync, showRowGuide]);
-  const scheduleRowResizeCommit = import_react52.default.useCallback(() => {
-    if (rowResizeCommitFrameRef.current !== null) return;
-    rowResizeCommitFrameRef.current = window.requestAnimationFrame(() => {
-      rowResizeCommitFrameRef.current = null;
-      commitRowResizePreview();
-    });
-  }, [commitRowResizePreview]);
-  const syncActiveTableCellFromSelection = import_react52.default.useCallback(() => {
+  const {
+    beginResize,
+    cancelResize,
+    cleanup: cleanupRowResize,
+    handlePointerMove: handleRowResizePointerMove,
+    handlePointerUp: handleRowResizePointerUp,
+    isResizing: isRowResizing,
+    syncActiveGuide: syncActiveRowResizeGuide
+  } = useTableRowResize({
+    editor,
+    setHoveredTableCell,
+    clearHoveredTableCell,
+    showRowGuide,
+    clearAllTableResizeHover,
+    scheduleTableLayoutSync
+  });
+  const syncActiveTableCellFromSelection = import_react53.default.useCallback(() => {
     if (!editor) return;
     setActiveTableCell(getSelectionTableCell(editor.view));
   }, [editor, setActiveTableCell]);
-  (0, import_react52.useEffect)(() => {
+  (0, import_react53.useEffect)(() => {
     if (!editor) return void 0;
     const proseMirror = editor.view.dom;
     const surface = editorContentRef.current;
@@ -32216,10 +32356,7 @@ function useUEditorTableInteractions(editor) {
       updateActiveCellHighlight(activeTableCellRef.current);
     };
     const handleEditorMouseMove = (event) => {
-      const activeRowResize = rowResizeStateRef.current;
-      if (activeRowResize) {
-        setHoveredTableCell(activeRowResize.cellElement);
-        showRowGuide(activeRowResize.tableElement, activeRowResize.rowElement, activeRowResize.cellElement);
+      if (syncActiveRowResizeGuide()) {
         return;
       }
       const target = resolveEventElement(event.target);
@@ -32257,7 +32394,7 @@ function useUEditorTableInteractions(editor) {
     };
     const handleEditorMouseLeave = () => {
       clearHoveredTableCell();
-      if (!rowResizeStateRef.current) {
+      if (!isRowResizing()) {
         clearAllTableResizeHover();
       }
     };
@@ -32278,87 +32415,31 @@ function useUEditorTableInteractions(editor) {
       const row = cell.closest("tr");
       const table = cell.closest("table");
       if (!(row instanceof HTMLTableRowElement) || !(table instanceof HTMLTableElement)) return;
-      if (!isRowResizeHotspot(cell, event.clientX, event.clientY)) {
-        return;
+      if (beginResize(event, table, row, cell)) {
+        suppressActiveCellHighlightRef.current = true;
+        updateActiveCellHighlight(null);
       }
-      setHoveredTableCell(cell);
-      const rowInfo = findTableRowNodeInfo(editor.view, row);
-      if (!rowInfo) return;
-      const startHeight = row.getBoundingClientRect().height;
-      rowResizeStateRef.current = {
-        rowElement: row,
-        tableElement: table,
-        cellElement: cell,
-        cellIndex: cell.cellIndex,
-        rowPos: rowInfo.pos,
-        rowNode: rowInfo.node,
-        startY: event.clientY,
-        startHeight,
-        previewHeight: startHeight,
-        pendingHeight: startHeight
-      };
-      showRowGuide(table, row, cell);
-      document.body.style.cursor = "row-resize";
-      event.preventDefault();
-      event.stopPropagation();
     };
     const handlePointerMove = (event) => {
-      const state = rowResizeStateRef.current;
-      if (!state) return;
-      const nextHeight = Math.max(
-        MIN_TABLE_ROW_HEIGHT,
-        Math.round(state.startHeight + (event.clientY - state.startY))
-      );
-      if (nextHeight === state.pendingHeight) {
-        document.body.style.cursor = "row-resize";
-        showRowGuide(state.tableElement, state.rowElement, state.cellElement);
-        return;
-      }
-      state.pendingHeight = nextHeight;
-      document.body.style.cursor = "row-resize";
-      scheduleRowResizeCommit();
+      handleRowResizePointerMove(event);
     };
     const handlePointerUp = (event) => {
-      const state = rowResizeStateRef.current;
-      if (!state) return;
-      const nextHeight = Math.max(
-        MIN_TABLE_ROW_HEIGHT,
-        Math.round(state.startHeight + (event.clientY - state.startY))
-      );
-      state.pendingHeight = nextHeight;
-      if (rowResizeCommitFrameRef.current !== null) {
-        window.cancelAnimationFrame(rowResizeCommitFrameRef.current);
-        rowResizeCommitFrameRef.current = null;
-      }
-      commitRowResizePreview();
-      const latestState = rowResizeStateRef.current ?? state;
-      const rowNode = editor.view.state.doc.nodeAt(latestState.rowPos) ?? latestState.rowNode;
-      if (rowNode.attrs.rowHeight !== nextHeight) {
-        const tr = editor.view.state.tr;
-        tr.setNodeMarkup(latestState.rowPos, void 0, {
-          ...rowNode.attrs,
-          rowHeight: nextHeight
+      const wasRowResizing = isRowResizing();
+      handleRowResizePointerUp(event);
+      if (wasRowResizing) {
+        suppressActiveCellHighlightRef.current = false;
+        requestAnimationFrame(() => {
+          updateActiveCellHighlight(activeTableCellRef.current);
         });
-        editor.view.dispatch(tr);
       }
-      rowResizeStateRef.current = null;
-      document.body.style.cursor = "";
-      clearHoveredTableCell();
-      clearAllTableResizeHover();
-      scheduleTableLayoutSync();
     };
     const handleWindowBlur = () => {
-      const state = rowResizeStateRef.current;
-      if (!state) return;
-      if (rowResizeCommitFrameRef.current !== null) {
-        window.cancelAnimationFrame(rowResizeCommitFrameRef.current);
-        rowResizeCommitFrameRef.current = null;
+      const wasRowResizing = isRowResizing();
+      cancelResize();
+      if (wasRowResizing) {
+        suppressActiveCellHighlightRef.current = false;
+        updateActiveCellHighlight(activeTableCellRef.current);
       }
-      rowResizeStateRef.current = null;
-      document.body.style.cursor = "";
-      clearHoveredTableCell();
-      clearAllTableResizeHover();
-      scheduleTableLayoutSync();
     };
     proseMirror.addEventListener("mousemove", handleEditorMouseMove);
     proseMirror.addEventListener("mouseleave", handleEditorMouseLeave);
@@ -32401,17 +32482,14 @@ function useUEditorTableInteractions(editor) {
         window.cancelAnimationFrame(tableLayoutSyncFrameRef.current);
         tableLayoutSyncFrameRef.current = null;
       }
-      if (rowResizeCommitFrameRef.current !== null) {
-        window.cancelAnimationFrame(rowResizeCommitFrameRef.current);
-        rowResizeCommitFrameRef.current = null;
-      }
+      cleanupRowResize();
+      suppressActiveCellHighlightRef.current = false;
       document.body.style.cursor = "";
       clearActiveTableCell();
       clearHoveredTableCell();
       clearAllTableResizeHover();
-      rowResizeStateRef.current = null;
     };
-  }, [clearActiveTableCell, clearAllTableResizeHover, clearHoveredTableCell, commitRowResizePreview, editor, hideColumnGuide, hideRowGuide, scheduleRowResizeCommit, scheduleTableLayoutSync, setHoveredTableCell, showColumnGuide, showRowGuide, syncActiveTableCellFromSelection, updateActiveCellHighlight]);
+  }, [beginResize, cancelResize, cleanupRowResize, clearActiveTableCell, clearAllTableResizeHover, clearHoveredTableCell, editor, handleRowResizePointerMove, handleRowResizePointerUp, hideColumnGuide, hideRowGuide, isRowResizing, showColumnGuide, showRowGuide, syncActiveRowResizeGuide, syncActiveTableCellFromSelection, updateActiveCellHighlight]);
   return {
     editorContentRef,
     tableColumnGuideRef,
@@ -32422,7 +32500,7 @@ function useUEditorTableInteractions(editor) {
 
 // src/components/UEditor/UEditor.tsx
 var import_jsx_runtime84 = require("react/jsx-runtime");
-var UEditor = import_react53.default.forwardRef(({
+var UEditor = import_react54.default.forwardRef(({
   content = "",
   onChange,
   onHtmlChange,
@@ -32453,9 +32531,9 @@ var UEditor = import_react53.default.forwardRef(({
 }, ref) => {
   const t = useSmartTranslations("UEditor");
   const effectivePlaceholder = placeholder ?? t("placeholder");
-  const inFlightPrepareRef = (0, import_react53.useRef)(null);
-  const lastAppliedContentRef = (0, import_react53.useRef)(content ?? "");
-  const extensions = (0, import_react53.useMemo)(
+  const inFlightPrepareRef = (0, import_react54.useRef)(null);
+  const lastAppliedContentRef = (0, import_react54.useRef)(content ?? "");
+  const extensions = (0, import_react54.useMemo)(
     () => buildUEditorExtensions({
       placeholder: effectivePlaceholder,
       translate: t,
@@ -32469,7 +32547,7 @@ var UEditor = import_react53.default.forwardRef(({
     }),
     [effectivePlaceholder, t, maxCharacters, uploadImage, imageInsertMode, maxImageFileSize, allowedImageMimeTypes, fallbackToDataUrl, editable]
   );
-  const editor = (0, import_react54.useEditor)({
+  const editor = (0, import_react55.useEditor)({
     immediatelyRender: false,
     extensions,
     content,
@@ -32515,7 +32593,7 @@ var UEditor = import_react53.default.forwardRef(({
     tableRowGuideRef,
     activeTableCellHighlightRef
   } = useUEditorTableInteractions(editor);
-  (0, import_react53.useImperativeHandle)(
+  (0, import_react54.useImperativeHandle)(
     ref,
     () => ({
       prepareContentForSave: async ({ throwOnError = false } = {}) => {
@@ -32538,7 +32616,7 @@ var UEditor = import_react53.default.forwardRef(({
     }),
     [content, editor, uploadImageForSave, uploadImageConcurrency]
   );
-  (0, import_react53.useEffect)(() => {
+  (0, import_react54.useEffect)(() => {
     if (!editor) return;
     const nextContent = content ?? "";
     if (lastAppliedContentRef.current === nextContent) return;
@@ -32624,12 +32702,13 @@ var UEditor = import_react53.default.forwardRef(({
                 {
                   ref: activeTableCellHighlightRef,
                   "aria-hidden": "true",
+                  "data-ueditor-active-cell-highlight": "",
                   className: "pointer-events-none hidden absolute z-20 rounded-[2px] border-2 border-primary bg-primary/10 transition-[left,top,width,height] duration-100"
                 }
               ),
               editable && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(TableControls, { editor, containerRef: editorContentRef }),
               /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
-                import_react54.EditorContent,
+                import_react55.EditorContent,
                 {
                   editor,
                   className: "min-h-full"