@ctzhian/tiptap 2.13.7-beta.0 → 3.0.0

package/dist/features/table/plugin/plugin.js

@@ -0,0 +1,512 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { Plugin, TextSelection } from '@tiptap/pm/state';
+import { CellSelection, moveTableColumn, moveTableRow, TableMap } from '@tiptap/pm/tables';
+import { clamp, domCellAround, getCellIndicesFromDOM, getIndexCoordinates, getTableFromDOM, isHTMLElement, isTableNode, safeClosest, selectCellsByCoords } from "../../../utils/table";
+import { setTableHandleRuntime, tableHandlePluginKey } from "./shared";
+import { buildTableDragDecorations } from "./decorations";
+import { buildCellHoverState, buildWrapperHoverState } from "./hover-state";
+import { getCachedHandleRects, getLastEdgeReferences, getNearestRowReference, isPointerNearHandle, preserveCellRectSize } from "./positioning";
+import { syncTableHandleState } from "./state-sync";
+function hideElements(selector, rootEl) {
+  rootEl.querySelectorAll(selector).forEach(function (el) {
+    el.style.visibility = 'hidden';
+  });
+}
+var TableHandleView = /*#__PURE__*/function () {
+  function TableHandleView(editor, editorView, emitUpdate) {
+    var _this = this;
+    _classCallCheck(this, TableHandleView);
+    _defineProperty(this, "editor", void 0);
+    _defineProperty(this, "editorView", void 0);
+    _defineProperty(this, "state", undefined);
+    _defineProperty(this, "menuFrozen", false);
+    _defineProperty(this, "mouseState", 'up');
+    _defineProperty(this, "tableId", void 0);
+    _defineProperty(this, "tablePos", void 0);
+    _defineProperty(this, "tableElement", void 0);
+    _defineProperty(this, "emitUpdate", void 0);
+    _defineProperty(this, "viewMousedownHandler", function (event) {
+      _this.mouseState = 'down';
+      var _this$editor = _this.editor,
+        state = _this$editor.state,
+        view = _this$editor.view;
+      if (!(state.selection instanceof CellSelection) || _this.editor.isFocused) return;
+      var posInfo = view.posAtCoords({
+        left: event.clientX,
+        top: event.clientY
+      });
+      if (!posInfo) return;
+      var $pos = state.doc.resolve(posInfo.pos);
+      var nodes = state.schema.nodes;
+      var paraDepth = -1;
+      var inTableCell = false;
+      for (var d = $pos.depth; d >= 0; d--) {
+        var node = $pos.node(d);
+        if (!inTableCell && (node.type === nodes.tableCell || node.type === nodes.tableHeader)) {
+          inTableCell = true;
+        }
+        if (paraDepth === -1 && node.type === nodes.paragraph) {
+          paraDepth = d;
+        }
+        if (inTableCell && paraDepth !== -1) break;
+      }
+      if (!inTableCell || paraDepth === -1) return;
+      var from = $pos.start(paraDepth);
+      var to = $pos.end(paraDepth);
+      var nextSel = TextSelection.create(state.doc, from, to);
+      if (state.selection.eq(nextSel)) return;
+      view.dispatch(state.tr.setSelection(nextSel));
+      view.focus();
+    });
+    _defineProperty(this, "mouseUpHandler", function (event) {
+      _this.mouseState = 'up';
+      _this.mouseMoveHandler(event);
+    });
+    _defineProperty(this, "mouseMoveHandler", function (event) {
+      if (_this.menuFrozen || _this.mouseState === 'selecting') return;
+      var target = event.target;
+      // 鼠标不在编辑器内时不处理，避免拖拽出界导致状态被清空
+      if (!isHTMLElement(target) || !_this.editorView.dom.contains(target)) return;
+
+      // 判断是否悬停在手柄或扩展按钮上
+      var elementTarget = target;
+      var isOverHandle = elementTarget.closest('.tiptap-table-handle-menu') !== null;
+      var isOverExtendButton = elementTarget.closest('.tiptap-table-extend-row-column-button, .tiptap-table-add-button') !== null;
+
+      // 悬停其上时保持显示
+      if (isOverHandle || isOverExtendButton) {
+        return;
+      }
+      var handleRects = getCachedHandleRects({
+        root: _this.editorView.root,
+        state: _this.state
+      });
+      if (isPointerNearHandle(event, handleRects)) {
+        return;
+      }
+      _this._handleMouseMoveNow(event);
+    });
+    _defineProperty(this, "dragOverHandler", function (event) {
+      var _this$state;
+      if (((_this$state = _this.state) === null || _this$state === void 0 ? void 0 : _this$state.draggingState) === undefined) {
+        return;
+      }
+      event.preventDefault();
+      event.dataTransfer.dropEffect = 'move';
+      hideElements('.prosemirror-dropcursor-block, .prosemirror-dropcursor-inline', _this.editorView.root);
+
+      // 将鼠标坐标限制在表格包围框内
+      var _this$state$reference = _this.state.referencePosTable,
+        tableLeft = _this$state$reference.left,
+        tableRight = _this$state$reference.right,
+        tableTop = _this$state$reference.top,
+        tableBottom = _this$state$reference.bottom;
+      var boundedMouseCoords = {
+        left: clamp(event.clientX, tableLeft + 1, tableRight - 1),
+        top: clamp(event.clientY, tableTop + 1, tableBottom - 1)
+      };
+
+      // 获取所在位置的单元格元素
+      var tableCellElements = _this.editorView.root.elementsFromPoint(boundedMouseCoords.left, boundedMouseCoords.top).filter(function (element) {
+        return element.tagName === 'TD' || element.tagName === 'TH';
+      });
+      if (tableCellElements.length === 0) {
+        return;
+      }
+      var tableCellElement = tableCellElements[0];
+      if (!isHTMLElement(tableCellElement)) {
+        return;
+      }
+      var cellPosition = getCellIndicesFromDOM(tableCellElement, _this.state.block, _this.editor);
+      if (!cellPosition) return;
+      var rowIndex = cellPosition.rowIndex,
+        colIndex = cellPosition.colIndex;
+
+      // 判断被拖动的索引是否改变
+      var oldIndex = _this.state.draggingState.draggedCellOrientation === 'row' ? _this.state.rowIndex : _this.state.colIndex;
+      var newIndex = _this.state.draggingState.draggedCellOrientation === 'row' ? rowIndex : colIndex;
+      var dispatchDecorationsTransaction = newIndex !== oldIndex;
+      var mousePos = _this.state.draggingState.draggedCellOrientation === 'row' ? boundedMouseCoords.top : boundedMouseCoords.left;
+
+      // 仅在单元格或鼠标位置变化时更新
+      var cellChanged = _this.state.rowIndex !== rowIndex || _this.state.colIndex !== colIndex;
+      var mousePosChanged = _this.state.draggingState.mousePos !== mousePos;
+      if (cellChanged || mousePosChanged) {
+        var _this$state$draggingS;
+        var preservedCellRect = preserveCellRectSize({
+          rect: tableCellElement.getBoundingClientRect(),
+          originalSize: (_this$state$draggingS = _this.state.draggingState) === null || _this$state$draggingS === void 0 ? void 0 : _this$state$draggingS.originalCellSize
+        });
+        _this.state = _objectSpread(_objectSpread({}, _this.state), {}, {
+          rowIndex: rowIndex,
+          colIndex: colIndex,
+          referencePosCell: preservedCellRect,
+          draggingState: _objectSpread(_objectSpread({}, _this.state.draggingState), {}, {
+            mousePos: mousePos
+          })
+        });
+        _this.emitUpdate();
+      }
+
+      // 如需刷新拖拽装饰则派发事务
+      if (dispatchDecorationsTransaction) {
+        _this.editor.view.dispatch(_this.editor.state.tr.setMeta(tableHandlePluginKey, true));
+      }
+    });
+    _defineProperty(this, "dropHandler", function () {
+      _this.mouseState = 'up';
+      var st = _this.state;
+      if (!(st !== null && st !== void 0 && st.draggingState)) return false;
+      var draggingState = st.draggingState,
+        rowIndex = st.rowIndex,
+        colIndex = st.colIndex,
+        blockPos = st.blockPos;
+      if (typeof blockPos !== 'number' || blockPos < 0) return false;
+      if (draggingState.draggedCellOrientation === 'row' && rowIndex === undefined || draggingState.draggedCellOrientation === 'col' && colIndex === undefined) {
+        throw new Error('Attempted to drop table row or column, but no table block was hovered prior.');
+      }
+      var isRow = draggingState.draggedCellOrientation === 'row';
+      var orientation = isRow ? 'row' : 'column';
+      var destIndex = isRow ? rowIndex : colIndex;
+      var cellCoords = getIndexCoordinates({
+        editor: _this.editor,
+        index: draggingState.originalIndex,
+        orientation: orientation,
+        tablePos: blockPos
+      });
+      if (!cellCoords) return false;
+      var stateWithCellSel = selectCellsByCoords(_this.editor, blockPos, cellCoords, {
+        mode: 'state'
+      });
+      if (!stateWithCellSel) return false;
+
+      // mode 为 state 时 selectCellsByCoords 返回 EditorState，这里的断言是安全的
+      var editorState = stateWithCellSel;
+      var dispatch = function dispatch(tr) {
+        return _this.editor.view.dispatch(tr);
+      };
+      if (isRow) {
+        moveTableRow({
+          from: draggingState.originalIndex,
+          to: destIndex,
+          select: true,
+          pos: blockPos + 1
+        })(editorState, dispatch);
+      } else {
+        moveTableColumn({
+          from: draggingState.originalIndex,
+          to: destIndex,
+          select: true,
+          pos: blockPos + 1
+        })(editorState, dispatch);
+      }
+      _this.state = _objectSpread(_objectSpread({}, st), {}, {
+        draggingState: undefined
+      });
+      _this.emitUpdate();
+      _this.editor.view.dispatch(_this.editor.state.tr.setMeta(tableHandlePluginKey, null));
+      return true;
+    });
+    _defineProperty(this, "scrollHandler", function () {
+      var _this$state2, _this$tableElement;
+      // 滚动时若手柄可见则重新计算位置
+      if ((_this$state2 = _this.state) !== null && _this$state2 !== void 0 && _this$state2.show && (_this$tableElement = _this.tableElement) !== null && _this$tableElement !== void 0 && _this$tableElement.isConnected) {
+        // 强制刷新定位
+        _this.updatePositions();
+      }
+    });
+    this.editor = editor;
+    this.editorView = editorView;
+    this.emitUpdate = function () {
+      return _this.state && emitUpdate(_this.state);
+    };
+    this.editorView.dom.addEventListener('mousemove', this.mouseMoveHandler);
+    this.editorView.dom.addEventListener('mousedown', this.viewMousedownHandler);
+    window.addEventListener('mouseup', this.mouseUpHandler);
+    this.editorView.root.addEventListener('dragover', this.dragOverHandler);
+    this.editorView.root.addEventListener('drop', this.dropHandler);
+
+    // 监听滚动事件以更新手柄位置
+    window.addEventListener('scroll', this.scrollHandler, true);
+    // 同时监听窗口尺寸变化
+    window.addEventListener('resize', this.scrollHandler);
+  }
+  _createClass(TableHandleView, [{
+    key: "hideHandles",
+    value: function hideHandles() {
+      var _this$state3;
+      if (!((_this$state3 = this.state) !== null && _this$state3 !== void 0 && _this$state3.show)) return;
+
+      // 拖拽进行中保持手柄显示，保留拖拽状态
+      if (this.state.draggingState) return;
+      this.state = _objectSpread(_objectSpread({}, this.state), {}, {
+        show: false,
+        showAddOrRemoveRowsButton: false,
+        showAddOrRemoveColumnsButton: false,
+        colIndex: undefined,
+        rowIndex: undefined,
+        referencePosCell: undefined,
+        referencePosLastRow: undefined,
+        referencePosLastCol: undefined
+      });
+      this.emitUpdate();
+    }
+  }, {
+    key: "_handleMouseMoveNow",
+    value: function _handleMouseMoveNow(event) {
+      var _this$state4;
+      var around = domCellAround(event.target);
+
+      // 在单元格内拖拽选区时隐藏手柄
+      if ((around === null || around === void 0 ? void 0 : around.type) === 'cell' && this.mouseState === 'down' && !((_this$state4 = this.state) !== null && _this$state4 !== void 0 && _this$state4.draggingState)) {
+        this.mouseState = 'selecting';
+        this.hideHandles();
+        return;
+      }
+      if (!around || !this.editor.isEditable) {
+        this.hideHandles();
+        return;
+      }
+      var tbody = around.tbodyNode;
+      if (!tbody) return;
+      var tableRect = tbody.getBoundingClientRect();
+      var coords = this.editor.view.posAtCoords({
+        left: event.clientX,
+        top: event.clientY
+      });
+      if (!coords) return;
+
+      // 基于坐标解析当前所在的表格节点
+      var $pos = this.editor.view.state.doc.resolve(coords.pos);
+      var blockInfo;
+      for (var d = $pos.depth; d >= 0; d--) {
+        var node = $pos.node(d);
+        if (isTableNode(node)) {
+          blockInfo = {
+            node: node,
+            pos: d === 0 ? 0 : $pos.before(d)
+          };
+          break;
+        }
+      }
+      if (!blockInfo || blockInfo.node.type.name !== 'table') return;
+      this.tableElement = this.editor.view.nodeDOM(blockInfo.pos);
+      this.tablePos = blockInfo.pos;
+      this.tableId = blockInfo.node.attrs.id;
+      var wrapper = safeClosest(around.domNode, '.tableWrapper');
+      var widgetContainer = wrapper === null || wrapper === void 0 ? void 0 : wrapper.querySelector(':scope > .table-controls');
+
+      // 悬停在表格外围（非单元格区域）
+      if (around.type === 'wrapper') {
+        var _this$state5;
+        var below = event.clientY >= tableRect.bottom - 1 && event.clientY < tableRect.bottom + 20;
+        var right = event.clientX >= tableRect.right - 1 && event.clientX < tableRect.right + 20;
+        var cursorBeyondRightOrBottom = event.clientX > tableRect.right || event.clientY > tableRect.bottom;
+        var _ref = below || right ? getLastEdgeReferences({
+            tableBody: tbody,
+            tableNode: blockInfo.node,
+            includeLastRow: below,
+            includeLastColumn: right
+          }) : {
+            referencePosLastRow: undefined,
+            referencePosLastCol: undefined
+          },
+          referencePosLastRow = _ref.referencePosLastRow,
+          referencePosLastCol = _ref.referencePosLastCol;
+        var nearestReference = !cursorBeyondRightOrBottom ? getNearestRowReference(tbody, event.clientY) : {};
+        this.state = buildWrapperHoverState({
+          previousState: this.state,
+          tableRect: tableRect,
+          referencePosLastRow: referencePosLastRow,
+          referencePosLastCol: referencePosLastCol,
+          block: blockInfo.node,
+          blockPos: blockInfo.pos,
+          widgetContainer: widgetContainer,
+          keepColIndex: (_this$state5 = this.state) === null || _this$state5 === void 0 ? void 0 : _this$state5.colIndex,
+          nextRowIndex: nearestReference.rowIndex,
+          nextReferencePosCell: nearestReference.cellRect,
+          resetIndices: cursorBeyondRightOrBottom
+        });
+      } else {
+        var _blockInfo$node$conte, _blockInfo$node$conte2, _this$state6;
+        // 悬停在单元格上
+        var cellPosition = getCellIndicesFromDOM(around.domNode, blockInfo.node, this.editor);
+        if (!cellPosition) return;
+        var tbodyEl = around.tbodyNode;
+        if (!tbodyEl) return;
+        var rowIndex = cellPosition.rowIndex,
+          colIndex = cellPosition.colIndex;
+
+        // 如果单元格跨行，map 计算的 rowIndex 会指向起始行；这里用 DOM 行索引兜底，保证手柄定位在实际行
+        var trEl = safeClosest(around.domNode, 'tr');
+        if (tbodyEl && trEl) {
+          var domRowIndex = Array.from(tbodyEl.children).indexOf(trEl);
+          if (domRowIndex >= 0 && domRowIndex !== rowIndex) {
+            rowIndex = domRowIndex;
+          }
+        }
+        var cellRect = around.domNode.getBoundingClientRect();
+        var map = TableMap.get(blockInfo.node);
+        var cellIndex = rowIndex * map.width + colIndex;
+        var cellOffset = map.map[cellIndex];
+        var rect = cellOffset !== undefined ? map.findCell(cellOffset) : null;
+        var effectiveCellRect = cellRect;
+
+        // 如果单元格跨行，按鼠标所在行拆分高度，句柄高度限定为单行高度
+        if (rect && rect.bottom - rect.top > 1) {
+          var span = rect.bottom - rect.top;
+          var unitHeight = cellRect.height / span;
+          var clampedY = clamp(event.clientY, cellRect.top, cellRect.bottom);
+          var rowOffset = Math.min(span - 1, Math.max(0, Math.floor((clampedY - cellRect.top) / unitHeight)));
+          var rowTop = cellRect.top + unitHeight * rowOffset;
+          rowIndex = rect.top + rowOffset;
+          effectiveCellRect = new DOMRect(cellRect.x, rowTop, cellRect.width, unitHeight);
+        } else if (trEl) {
+          var trRect = trEl.getBoundingClientRect();
+          effectiveCellRect = new DOMRect(cellRect.x, trRect.y, cellRect.width, trRect.height);
+        }
+        var lastRowIndex = blockInfo.node.content.childCount - 1;
+        var lastColIndex = ((_blockInfo$node$conte = (_blockInfo$node$conte2 = blockInfo.node.content.firstChild) === null || _blockInfo$node$conte2 === void 0 ? void 0 : _blockInfo$node$conte2.content.childCount) !== null && _blockInfo$node$conte !== void 0 ? _blockInfo$node$conte : 0) - 1;
+
+        // 与上次同一单元格则跳过
+        if ((_this$state6 = this.state) !== null && _this$state6 !== void 0 && _this$state6.show && this.tableId === blockInfo.node.attrs.id && this.state.rowIndex === rowIndex && this.state.colIndex === colIndex) {
+          return;
+        }
+        var _ref2 = rowIndex === lastRowIndex || colIndex === lastColIndex ? getLastEdgeReferences({
+            tableBody: tbodyEl,
+            tableNode: blockInfo.node,
+            includeLastRow: rowIndex === lastRowIndex,
+            includeLastColumn: colIndex === lastColIndex
+          }) : {
+            referencePosLastRow: undefined,
+            referencePosLastCol: undefined
+          },
+          _referencePosLastRow = _ref2.referencePosLastRow,
+          _referencePosLastCol = _ref2.referencePosLastCol;
+        this.state = buildCellHoverState({
+          tableRect: tableRect,
+          referencePosLastRow: _referencePosLastRow,
+          referencePosLastCol: _referencePosLastCol,
+          block: blockInfo.node,
+          blockPos: blockInfo.pos,
+          widgetContainer: widgetContainer,
+          draggingState: undefined,
+          referencePosCell: effectiveCellRect,
+          colIndex: colIndex,
+          rowIndex: rowIndex
+        });
+      }
+      this.emitUpdate();
+      return false;
+    }
+  }, {
+    key: "update",
+    value: function update(view) {
+      var _this$state7, _this$tableElement2, _this$tableElement3;
+      var pluginState = tableHandlePluginKey.getState(view.state);
+      if (pluginState !== undefined && pluginState !== this.menuFrozen) {
+        this.menuFrozen = pluginState;
+      }
+      if (!((_this$state7 = this.state) !== null && _this$state7 !== void 0 && _this$state7.show)) return;
+      if (!((_this$tableElement2 = this.tableElement) !== null && _this$tableElement2 !== void 0 && _this$tableElement2.isConnected)) {
+        this.hideHandles();
+        return;
+      }
+      var tableInfo = getTableFromDOM(this.tableElement, this.editor);
+      if (!tableInfo) {
+        this.hideHandles();
+        return;
+      }
+
+      // 检查表格是否已变更
+      var blockChanged = this.state.block !== tableInfo.node || this.state.blockPos !== tableInfo.pos;
+      if (!tableInfo.node || tableInfo.node.type.name !== 'table' || !((_this$tableElement3 = this.tableElement) !== null && _this$tableElement3 !== void 0 && _this$tableElement3.isConnected)) {
+        this.hideHandles();
+        return;
+      }
+      var syncResult = syncTableHandleState({
+        editor: this.editor,
+        tableElement: this.tableElement,
+        state: this.state
+      });
+      if (!syncResult) {
+        this.hideHandles();
+        return;
+      }
+      if (blockChanged || syncResult.indicesChanged || syncResult.refPosChanged) {
+        this.state = syncResult.nextState;
+        this.emitUpdate();
+      }
+    }
+  }, {
+    key: "updatePositions",
+    value: function updatePositions() {
+      var _this$state8, _this$tableElement4;
+      if (!((_this$state8 = this.state) !== null && _this$state8 !== void 0 && _this$state8.show) || !((_this$tableElement4 = this.tableElement) !== null && _this$tableElement4 !== void 0 && _this$tableElement4.isConnected)) return;
+      var syncResult = syncTableHandleState({
+        editor: this.editor,
+        tableElement: this.tableElement,
+        state: this.state
+      });
+      if (!syncResult) return;
+      if (syncResult.refPosChanged) {
+        this.state = syncResult.nextState;
+        this.emitUpdate();
+      }
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      this.editorView.dom.removeEventListener('mousemove', this.mouseMoveHandler);
+      window.removeEventListener('mouseup', this.mouseUpHandler);
+      this.editorView.dom.removeEventListener('mousedown', this.viewMousedownHandler);
+      this.editorView.root.removeEventListener('dragover', this.dragOverHandler);
+      this.editorView.root.removeEventListener('drop', this.dropHandler);
+      window.removeEventListener('scroll', this.scrollHandler, true);
+      window.removeEventListener('resize', this.scrollHandler);
+      setTableHandleRuntime(null);
+    }
+  }]);
+  return TableHandleView;
+}();
+var tableHandleView = null;
+export function TableHandlePlugin(editor, emitUpdate) {
+  return new Plugin({
+    key: tableHandlePluginKey,
+    state: {
+      init: function init() {
+        return false;
+      },
+      apply: function apply(tr, frozen) {
+        var meta = tr.getMeta(tableHandlePluginKey);
+        return meta !== undefined ? meta : frozen;
+      }
+    },
+    view: function view(editorView) {
+      tableHandleView = new TableHandleView(editor, editorView, emitUpdate);
+      setTableHandleRuntime(tableHandleView);
+      return tableHandleView;
+    },
+    props: {
+      decorations: function decorations(state) {
+        var _tableHandleView$stat;
+        if (!tableHandleView || !((_tableHandleView$stat = tableHandleView.state) !== null && _tableHandleView$stat !== void 0 && _tableHandleView$stat.draggingState)) {
+          return null;
+        }
+        return buildTableDragDecorations({
+          editor: editor,
+          doc: state.doc,
+          tableState: tableHandleView.state
+        });
+      }
+    }
+  });
+}

package/dist/features/table/plugin/positioning.d.ts

@@ -0,0 +1,40 @@
+import type { Node as TiptapNode } from '@tiptap/pm/model';
+import type { TableHandlesState } from './shared';
+export declare const getCachedHandleRects: ({ root, state, }: {
+    root: Document | ShadowRoot;
+    state?: TableHandlesState | undefined;
+}) => DOMRect[];
+export declare const isPointerNearHandle: (event: MouseEvent, rects: DOMRect[]) => boolean;
+export declare const getNearestRowReference: (tbody: HTMLElement, clientY: number) => {
+    rowIndex?: number | undefined;
+    cellRect?: DOMRect | undefined;
+};
+export declare const getLastEdgeReferences: ({ tableBody, tableNode, includeLastRow, includeLastColumn, }: {
+    tableBody: HTMLElement;
+    tableNode: TiptapNode;
+    includeLastRow: boolean;
+    includeLastColumn: boolean;
+}) => {
+    referencePosLastRow: DOMRect | undefined;
+    referencePosLastCol: DOMRect | undefined;
+};
+export declare const preserveCellRectSize: ({ rect, originalSize, }: {
+    rect: DOMRect;
+    originalSize?: {
+        width: number;
+        height: number;
+    } | undefined;
+}) => DOMRect;
+export declare const getReferenceCellRect: ({ tableBody, rowIndex, colIndex, originalSize, }: {
+    tableBody: HTMLElement;
+    rowIndex?: number | undefined;
+    colIndex?: number | undefined;
+    originalSize?: {
+        width: number;
+        height: number;
+    } | undefined;
+}) => DOMRect | undefined;
+export declare const didReferencePositionsChange: ({ previous, next, }: {
+    previous: Pick<TableHandlesState, 'referencePosCell' | 'referencePosTable' | 'referencePosLastRow' | 'referencePosLastCol'>;
+    next: Pick<TableHandlesState, 'referencePosCell' | 'referencePosTable' | 'referencePosLastRow' | 'referencePosLastCol'>;
+}) => boolean;

package/dist/features/table/plugin/positioning.js

@@ -0,0 +1,124 @@
+import { isHTMLElement } from "../../../utils/table";
+var HANDLE_SELECTOR = '.tiptap-table-handle-menu, .tiptap-table-extend-row-column-button, .tiptap-table-add-button';
+export var getCachedHandleRects = function getCachedHandleRects(_ref) {
+  var root = _ref.root,
+    state = _ref.state;
+  var now = Date.now();
+  if (state !== null && state !== void 0 && state._cachedHandleRects && state._cachedHandleRectsTime && now - state._cachedHandleRectsTime < 100) {
+    return state._cachedHandleRects;
+  }
+  var rects = Array.from(root.querySelectorAll(HANDLE_SELECTOR)).filter(isHTMLElement).map(function (element) {
+    return element.getBoundingClientRect();
+  });
+  if (state) {
+    state._cachedHandleRects = rects;
+    state._cachedHandleRectsTime = now;
+  }
+  return rects;
+};
+export var isPointerNearHandle = function isPointerNearHandle(event, rects) {
+  return rects.some(function (rect) {
+    var expandedRect = new DOMRect(rect.left - 10, rect.top - 10, rect.width + 20, rect.height + 20);
+    return event.clientX >= expandedRect.left && event.clientX <= expandedRect.right && event.clientY >= expandedRect.top && event.clientY <= expandedRect.bottom;
+  });
+};
+export var getNearestRowReference = function getNearestRowReference(tbody, clientY) {
+  var rows = Array.from(tbody.children);
+  var rowIndex;
+  var cellRect;
+  var minDistance = Number.POSITIVE_INFINITY;
+  rows.forEach(function (rowElement, index) {
+    var rowRect = rowElement.getBoundingClientRect();
+    var distance = Math.abs(clientY - (rowRect.top + rowRect.height / 2));
+    if (distance < minDistance) {
+      var _firstCell$getBoundin;
+      minDistance = distance;
+      rowIndex = index;
+      var firstCell = rowElement.children[0];
+      cellRect = (_firstCell$getBoundin = firstCell === null || firstCell === void 0 ? void 0 : firstCell.getBoundingClientRect()) !== null && _firstCell$getBoundin !== void 0 ? _firstCell$getBoundin : rowRect;
+    }
+  });
+  return {
+    rowIndex: rowIndex,
+    cellRect: cellRect
+  };
+};
+export var getLastEdgeReferences = function getLastEdgeReferences(_ref2) {
+  var _tableNode$content$fi, _tableNode$content$fi2;
+  var tableBody = _ref2.tableBody,
+    tableNode = _ref2.tableNode,
+    includeLastRow = _ref2.includeLastRow,
+    includeLastColumn = _ref2.includeLastColumn;
+  var referencePosLastRow;
+  var referencePosLastCol;
+  var lastRowIndex = tableNode.content.childCount - 1;
+  var lastColIndex = ((_tableNode$content$fi = (_tableNode$content$fi2 = tableNode.content.firstChild) === null || _tableNode$content$fi2 === void 0 ? void 0 : _tableNode$content$fi2.content.childCount) !== null && _tableNode$content$fi !== void 0 ? _tableNode$content$fi : 0) - 1;
+  if (includeLastRow) {
+    var lastRow = tableBody.children[lastRowIndex];
+    if (lastRow) {
+      referencePosLastRow = lastRow.getBoundingClientRect();
+    }
+  }
+  if (includeLastColumn) {
+    var maxRight = 0;
+    var lastColRect = null;
+    for (var i = 0; i < tableBody.children.length; i += 1) {
+      var row = tableBody.children[i];
+      if (!row || !row.children[lastColIndex]) continue;
+      var cellRect = row.children[lastColIndex].getBoundingClientRect();
+      if (cellRect.right > maxRight) {
+        maxRight = cellRect.right;
+        lastColRect = cellRect;
+      }
+    }
+    if (lastColRect) {
+      var firstRow = tableBody.children[0];
+      var _lastRow = tableBody.children[lastRowIndex];
+      var firstCell = firstRow === null || firstRow === void 0 ? void 0 : firstRow.children[lastColIndex];
+      if (firstCell && _lastRow) {
+        var firstRect = firstCell.getBoundingClientRect();
+        referencePosLastCol = new DOMRect(lastColRect.right, firstRect.top, 0, _lastRow.getBoundingClientRect().bottom - firstRect.top);
+      }
+    }
+  }
+  return {
+    referencePosLastRow: referencePosLastRow,
+    referencePosLastCol: referencePosLastCol
+  };
+};
+export var preserveCellRectSize = function preserveCellRectSize(_ref3) {
+  var rect = _ref3.rect,
+    originalSize = _ref3.originalSize;
+  if (!originalSize) {
+    return rect;
+  }
+  return new DOMRect(rect.x, rect.y, originalSize.width, originalSize.height);
+};
+export var getReferenceCellRect = function getReferenceCellRect(_ref4) {
+  var tableBody = _ref4.tableBody,
+    rowIndex = _ref4.rowIndex,
+    colIndex = _ref4.colIndex,
+    originalSize = _ref4.originalSize;
+  if (rowIndex === undefined || colIndex === undefined) {
+    return undefined;
+  }
+  var rowElement = tableBody.children[rowIndex];
+  var cellElement = rowElement === null || rowElement === void 0 ? void 0 : rowElement.children[colIndex];
+  if (!cellElement) {
+    return undefined;
+  }
+  return preserveCellRectSize({
+    rect: cellElement.getBoundingClientRect(),
+    originalSize: originalSize
+  });
+};
+export var didReferencePositionsChange = function didReferencePositionsChange(_ref5) {
+  var previous = _ref5.previous,
+    next = _ref5.next;
+  var sameRect = function sameRect(left, right) {
+    if (!left && !right) return true;
+    if (!left || !right) return false;
+    return left.x === right.x && left.y === right.y && left.width === right.width && left.height === right.height;
+  };
+  return !(sameRect(previous.referencePosCell, next.referencePosCell) && sameRect(previous.referencePosTable, next.referencePosTable) && sameRect(previous.referencePosLastRow, next.referencePosLastRow) && sameRect(previous.referencePosLastCol, next.referencePosLastCol));
+};