@kopexa/extension-table 17.0.46 → 17.1.1

package/dist/extensions/table-handle-plugin.js

@@ -0,0 +1,1100 @@
+"use client";
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+
+// src/extensions/table-handle-plugin.ts
+var table_handle_plugin_exports = {};
+__export(table_handle_plugin_exports, {
+  TableHandlePlugin: () => TableHandlePlugin,
+  colDragStart: () => colDragStart,
+  dragEnd: () => dragEnd,
+  rowDragStart: () => rowDragStart,
+  tableHandlePluginKey: () => tableHandlePluginKey
+});
+module.exports = __toCommonJS(table_handle_plugin_exports);
+var import_editor_utils = require("@kopexa/editor-utils");
+var import_shared_utils2 = require("@kopexa/shared-utils");
+var import_state = require("@tiptap/pm/state");
+var import_tables2 = require("@tiptap/pm/tables");
+var import_view = require("@tiptap/pm/view");
+
+// src/lib/create-image.ts
+var STYLE_PROPS = [
+  // Box & border
+  "boxSizing",
+  "backgroundColor",
+  "borderTopColor",
+  "borderRightColor",
+  "borderBottomColor",
+  "borderLeftColor",
+  "borderTopStyle",
+  "borderRightStyle",
+  "borderBottomStyle",
+  "borderLeftStyle",
+  "borderTopWidth",
+  "borderRightWidth",
+  "borderBottomWidth",
+  "borderLeftWidth",
+  "borderRadius",
+  // Spacing
+  "paddingTop",
+  "paddingRight",
+  "paddingBottom",
+  "paddingLeft",
+  // Typography
+  "color",
+  "font",
+  "fontFamily",
+  "fontSize",
+  "fontWeight",
+  "fontStyle",
+  "lineHeight",
+  "letterSpacing",
+  "textTransform",
+  "textDecoration",
+  "textAlign",
+  "verticalAlign",
+  "whiteSpace",
+  // Sizing
+  "width",
+  "minWidth",
+  "maxWidth",
+  "height",
+  "minHeight",
+  "maxHeight",
+  // Table specifics
+  "backgroundClip"
+];
+var toDash = (p) => p.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
+function copyComputedStyles(source, target) {
+  const cs = getComputedStyle(source);
+  for (const p of STYLE_PROPS) {
+    const prop = String(p);
+    const val = cs.getPropertyValue(toDash(prop));
+    if (val) target.style[prop] = val;
+  }
+  target.style.overflow = "hidden";
+  target.style.textOverflow = "ellipsis";
+  if (cs.whiteSpace === "" || cs.whiteSpace === "normal") {
+    target.style.whiteSpace = "nowrap";
+  }
+}
+function cloneWithStyles(root) {
+  const clone = root.cloneNode(true);
+  const q = [{ src: root, dst: clone }];
+  while (q.length) {
+    const { src, dst } = q.shift();
+    if (src instanceof HTMLElement && dst instanceof HTMLElement) {
+      copyComputedStyles(src, dst);
+    }
+    const srcChildren = Array.from(src.children);
+    const dstChildren = Array.from(dst.children);
+    const len = Math.min(srcChildren.length, dstChildren.length);
+    for (let i = 0; i < len; i++) {
+      const srcChild = srcChildren[i];
+      const dstChild = dstChildren[i];
+      if (srcChild && dstChild) {
+        q.push({ src: srcChild, dst: dstChild });
+      }
+    }
+  }
+  return clone;
+}
+function styleDragWrapper(el, maxWidth) {
+  Object.assign(el.style, {
+    position: "fixed",
+    top: "-10000px",
+    left: "-10000px",
+    pointerEvents: "none",
+    zIndex: "2147483647",
+    maxWidth: `${maxWidth}px`,
+    borderRadius: "12px",
+    background: "transparent",
+    filter: "drop-shadow(0 8px 24px rgba(0,0,0,0.18)) drop-shadow(0 2px 8px rgba(0,0,0,0.10))",
+    overflow: "hidden"
+  });
+}
+function scaleToFit(el, maxWidth) {
+  if (!el.isConnected) document.body.appendChild(el);
+  const rect = el.getBoundingClientRect();
+  if (rect.width > maxWidth && rect.width > 0) {
+    const scale = maxWidth / rect.width;
+    el.style.transformOrigin = "top left";
+    el.style.transform = `scale(${scale})`;
+  }
+}
+function applyTableBoxStyles(srcTable, dstTable) {
+  const tcs = getComputedStyle(srcTable);
+  dstTable.style.borderCollapse = tcs.borderCollapse;
+  dstTable.style.borderSpacing = tcs.borderSpacing;
+  dstTable.style.tableLayout = "fixed";
+  dstTable.className = srcTable.className;
+}
+function lockCellWidth(fromCell, toCell) {
+  const rect = fromCell.getBoundingClientRect();
+  if (rect.width > 0) {
+    toCell.style.width = `${rect.width}px`;
+    toCell.style.maxWidth = `${rect.width}px`;
+  }
+}
+function buildRowPreview(tableEl, rowIndex) {
+  var _a, _b, _c;
+  const body = (_b = (_a = tableEl.tBodies) == null ? void 0 : _a[0]) != null ? _b : tableEl.querySelector("tbody");
+  if (!body) return null;
+  const row = (_c = body.rows) == null ? void 0 : _c[rowIndex];
+  if (!row) return null;
+  const tableClone = document.createElement("table");
+  const tbodyClone = document.createElement("tbody");
+  const rowClone = cloneWithStyles(row);
+  applyTableBoxStyles(tableEl, tableClone);
+  for (let i = 0; i < row.cells.length; i++) {
+    const src = row.cells[i];
+    const dst = rowClone.cells[i];
+    if (dst) lockCellWidth(src, dst);
+  }
+  tbodyClone.appendChild(rowClone);
+  tableClone.appendChild(tbodyClone);
+  return tableClone;
+}
+function buildColumnPreview(tableEl, colIndex) {
+  var _a, _b, _c;
+  const body = (_b = (_a = tableEl.tBodies) == null ? void 0 : _a[0]) != null ? _b : tableEl.querySelector("tbody");
+  if (!body) return null;
+  const tableClone = document.createElement("table");
+  const tbodyClone = document.createElement("tbody");
+  applyTableBoxStyles(tableEl, tableClone);
+  let firstCellWidth = 0;
+  for (let r = 0; r < body.rows.length; r++) {
+    const srcRow = body.rows[r];
+    if (!srcRow) continue;
+    const srcCell = (_c = srcRow.cells) == null ? void 0 : _c[colIndex];
+    if (!srcCell) continue;
+    const tr = document.createElement("tr");
+    const cellClone = cloneWithStyles(srcCell);
+    const rect = srcCell.getBoundingClientRect();
+    if (!firstCellWidth && rect.width > 0) firstCellWidth = rect.width;
+    lockCellWidth(srcCell, cellClone);
+    tr.appendChild(cellClone);
+    tbodyClone.appendChild(tr);
+  }
+  if (firstCellWidth > 0) {
+    tableClone.style.width = `${firstCellWidth}px`;
+    tableClone.style.maxWidth = `${firstCellWidth}px`;
+  }
+  tableClone.appendChild(tbodyClone);
+  return tableClone;
+}
+function createTableDragImage(editor, orientation, index, tablePos) {
+  const editorRect = editor.view.dom.getBoundingClientRect();
+  const maxWidth = Math.max(0, editorRect.width);
+  const wrapper = document.createElement("div");
+  styleDragWrapper(wrapper, maxWidth);
+  const tableEl = editor.view.nodeDOM(tablePos);
+  if (!tableEl) {
+    document.body.appendChild(wrapper);
+    return wrapper;
+  }
+  const tableRect = tableEl.getBoundingClientRect();
+  const dragWidth = Math.min(tableRect.width, editorRect.width);
+  wrapper.style.width = `${dragWidth}px`;
+  const preview = orientation === "row" ? buildRowPreview(tableEl, index) : buildColumnPreview(tableEl, index);
+  if (preview) {
+    const card = document.createElement("div");
+    Object.assign(card.style, {
+      background: "var(--drag-image-bg, transparent)",
+      overflow: "hidden"
+    });
+    card.appendChild(preview);
+    wrapper.appendChild(card);
+  }
+  scaleToFit(wrapper, maxWidth);
+  return wrapper;
+}
+
+// src/lib/table-utils.ts
+var import_shared_utils = require("@kopexa/shared-utils");
+var import_tables = require("@tiptap/pm/tables");
+var EMPTY_CELLS_RESULT = { cells: [], mergedCells: [] };
+function domCellAround(target) {
+  let current = target;
+  while (current && current.tagName !== "TD" && current.tagName !== "TH" && !current.classList.contains("tableWrapper")) {
+    if (current.classList.contains("ProseMirror")) return void 0;
+    current = (0, import_shared_utils.isHTMLElement)(current.parentNode) ? current.parentNode : null;
+  }
+  if (!current) return void 0;
+  if (current.tagName === "TD" || current.tagName === "TH") {
+    return {
+      type: "cell",
+      domNode: current,
+      tbodyNode: (0, import_shared_utils.safeClosest)(current, "tbody")
+    };
+  }
+  return {
+    type: "wrapper",
+    domNode: current,
+    tbodyNode: current.querySelector("tbody")
+  };
+}
+function getCellIndicesFromDOM(cell, tableNode, editor) {
+  if (!tableNode) return null;
+  try {
+    const cellPos = editor.view.posAtDOM(cell, 0);
+    const $cellPos = editor.view.state.doc.resolve(cellPos);
+    for (let d = $cellPos.depth; d > 0; d--) {
+      const node = $cellPos.node(d);
+      if (node.type.name === "tableCell" || node.type.name === "tableHeader") {
+        const tableMap = import_tables.TableMap.get(tableNode);
+        const cellNodePos = $cellPos.before(d);
+        const tableStart = $cellPos.start(d - 2);
+        const cellOffset = cellNodePos - tableStart;
+        const cellIndex = tableMap.map.indexOf(cellOffset);
+        return {
+          rowIndex: Math.floor(cellIndex / tableMap.width),
+          colIndex: cellIndex % tableMap.width
+        };
+      }
+    }
+  } catch (error) {
+    console.warn("Could not get cell position:", error);
+  }
+  return null;
+}
+function collectCells(editor, orientation, index, tablePos) {
+  if (!editor) return EMPTY_CELLS_RESULT;
+  const { state } = editor;
+  const table = getTable(editor, tablePos);
+  if (!table) return EMPTY_CELLS_RESULT;
+  const tableStart = table.start;
+  const tableNode = table.node;
+  const map = table.map;
+  const resolvedIndex = resolveOrientationIndex(
+    state,
+    table,
+    orientation,
+    index
+  );
+  if (resolvedIndex === null) return EMPTY_CELLS_RESULT;
+  const maxIndex = orientation === "row" ? map.height : map.width;
+  if (resolvedIndex < 0 || resolvedIndex >= maxIndex) {
+    return EMPTY_CELLS_RESULT;
+  }
+  const cells = [];
+  const mergedCells = [];
+  const seenMerged = /* @__PURE__ */ new Set();
+  const iterationCount = orientation === "row" ? map.width : map.height;
+  for (let i = 0; i < iterationCount; i++) {
+    const row = orientation === "row" ? resolvedIndex : i;
+    const col = orientation === "row" ? i : resolvedIndex;
+    const cellIndex = row * map.width + col;
+    const mapCell = map.map[cellIndex];
+    if (mapCell === void 0) continue;
+    const cellPos = tableStart + mapCell;
+    const cellNode = tableNode.nodeAt(mapCell);
+    if (!cellNode) continue;
+    const cell = createCellInfo(row, col, cellPos, cellNode);
+    if (isCellMerged(cellNode)) {
+      if (!seenMerged.has(cellPos)) {
+        mergedCells.push(cell);
+        seenMerged.add(cellPos);
+      }
+    }
+    cells.push(cell);
+  }
+  return { cells, mergedCells };
+}
+function isCellMerged(node) {
+  var _a, _b;
+  if (!node) return false;
+  const colspan = (_a = node.attrs.colspan) != null ? _a : 1;
+  const rowspan = (_b = node.attrs.rowspan) != null ? _b : 1;
+  return colspan > 1 || rowspan > 1;
+}
+function getColumnCells(editor, columnIndex, tablePos) {
+  return collectCells(editor, "column", columnIndex, tablePos);
+}
+function getTable(editor, tablePos) {
+  if (!editor) return null;
+  let table = null;
+  if (typeof tablePos === "number") {
+    const tableNode = editor.state.doc.nodeAt(tablePos);
+    if ((tableNode == null ? void 0 : tableNode.type.name) === "table") {
+      table = {
+        node: tableNode,
+        pos: tablePos,
+        start: tablePos + 1,
+        depth: editor.state.doc.resolve(tablePos).depth
+      };
+    }
+  }
+  if (!table) {
+    const { state } = editor;
+    const $from = state.doc.resolve(state.selection.from);
+    table = (0, import_tables.findTable)($from);
+  }
+  if (!table) return null;
+  const tableMap = import_tables.TableMap.get(table.node);
+  if (!tableMap) return null;
+  return { ...table, map: tableMap };
+}
+function createCellInfo(row, column, cellPos, cellNode) {
+  return {
+    row,
+    column,
+    pos: cellPos,
+    node: cellNode,
+    start: cellPos + 1,
+    depth: cellNode ? cellNode.content.size : 0
+  };
+}
+function resolveOrientationIndex(state, table, orientation, providedIndex) {
+  var _a;
+  if (typeof providedIndex === "number") {
+    return providedIndex;
+  }
+  if (state.selection instanceof import_tables.CellSelection) {
+    const rect2 = (0, import_tables.selectedRect)(state);
+    return orientation === "row" ? rect2.top : rect2.left;
+  }
+  const $cell = (_a = (0, import_tables.cellAround)(state.selection.$anchor)) != null ? _a : (0, import_tables.selectionCell)(state);
+  if (!$cell) return null;
+  const rel = $cell.pos - table.start;
+  const rect = table.map.findCell(rel);
+  return orientation === "row" ? rect.top : rect.left;
+}
+function getIndexCoordinates({
+  editor,
+  index,
+  orientation,
+  tablePos
+}) {
+  if (!editor) return null;
+  const table = getTable(editor, tablePos);
+  if (!table) return null;
+  const { map } = table;
+  const { width, height } = map;
+  if (index < 0) return null;
+  if (orientation === "row" && index >= height) return null;
+  if (orientation === "column" && index >= width) return null;
+  return orientation === "row" ? Array.from({ length: map.width }, (_, col) => ({ row: index, col })) : Array.from({ length: map.height }, (_, row) => ({ row, col: index }));
+}
+function getRowCells(editor, rowIndex, tablePos) {
+  return collectCells(editor, "row", rowIndex, tablePos);
+}
+function getTableFromDOM(tableElement, editor) {
+  try {
+    const pos = editor.view.posAtDOM(tableElement, 0);
+    const $pos = editor.view.state.doc.resolve(pos);
+    for (let d = $pos.depth; d >= 0; d--) {
+      const node = $pos.node(d);
+      if (isTableNode(node)) {
+        return { node, pos: d === 0 ? 0 : $pos.before(d) };
+      }
+    }
+  } catch (error) {
+    console.warn("Could not get table from DOM:", error);
+  }
+  return null;
+}
+function isTableNode(node) {
+  return !!node && (node.type.name === "table" || node.type.spec.tableRole === "table");
+}
+function selectCellsByCoords(editor, tablePos, coords, options = { mode: "state" }) {
+  if (!editor) return;
+  const table = getTable(editor, tablePos);
+  if (!table) return;
+  const { state } = editor;
+  const tableMap = table.map;
+  const cleanedCoords = coords.map((coord) => ({
+    row: (0, import_shared_utils.clamp)(coord.row, 0, tableMap.height - 1),
+    col: (0, import_shared_utils.clamp)(coord.col, 0, tableMap.width - 1)
+  })).filter((coord) => isWithinBounds(coord.row, coord.col, tableMap));
+  if (cleanedCoords.length === 0) {
+    return;
+  }
+  const allRows = cleanedCoords.map((coord) => coord.row);
+  const topRow = Math.min(...allRows);
+  const bottomRow = Math.max(...allRows);
+  const allCols = cleanedCoords.map((coord) => coord.col);
+  const leftCol = Math.min(...allCols);
+  const rightCol = Math.max(...allCols);
+  const getCellPositionFromMap = (row, col) => {
+    const cellOffset = tableMap.map[row * tableMap.width + col];
+    if (cellOffset === void 0) return null;
+    return tablePos + 1 + cellOffset;
+  };
+  const anchorPosition = getCellPositionFromMap(topRow, leftCol);
+  if (anchorPosition === null) return;
+  let headPosition = getCellPositionFromMap(bottomRow, rightCol);
+  if (headPosition === null) return;
+  if (headPosition === anchorPosition) {
+    let foundDifferentCell = false;
+    for (let row = bottomRow; row >= topRow && !foundDifferentCell; row--) {
+      for (let col = rightCol; col >= leftCol && !foundDifferentCell; col--) {
+        const candidatePosition = getCellPositionFromMap(row, col);
+        if (candidatePosition !== null && candidatePosition !== anchorPosition) {
+          headPosition = candidatePosition;
+          foundDifferentCell = true;
+        }
+      }
+    }
+  }
+  try {
+    const anchorRef = state.doc.resolve(anchorPosition);
+    const headRef = state.doc.resolve(headPosition);
+    const cellSelection = new import_tables.CellSelection(anchorRef, headRef);
+    const transaction = state.tr.setSelection(cellSelection);
+    return applySelectionWithMode(state, transaction, options);
+  } catch (error) {
+    console.error("Failed to create cell selection:", error);
+    return;
+  }
+}
+function isWithinBounds(row, col, map) {
+  return row >= 0 && row < map.height && col >= 0 && col < map.width;
+}
+function applySelectionWithMode(state, transaction, options) {
+  var _a;
+  const mode = (_a = options.mode) != null ? _a : "state";
+  switch (mode) {
+    case "dispatch": {
+      const dispatchOptions = options;
+      if (typeof dispatchOptions.dispatch === "function") {
+        dispatchOptions.dispatch(transaction);
+      }
+      return;
+    }
+    case "transaction":
+      return transaction;
+    default:
+      return state.apply(transaction);
+  }
+}
+
+// src/extensions/table-handle-plugin.ts
+function hideElements(selector, rootEl) {
+  rootEl.querySelectorAll(selector).forEach((el) => {
+    el.style.visibility = "hidden";
+  });
+}
+var tableHandlePluginKey = new import_state.PluginKey("tableHandlePlugin");
+var viewRegistry = /* @__PURE__ */ new WeakMap();
+var TableHandleView = class {
+  constructor(editor, editorView, emitUpdate) {
+    __publicField(this, "editor");
+    __publicField(this, "editorView");
+    __publicField(this, "state");
+    __publicField(this, "menuFrozen", false);
+    __publicField(this, "mouseState", "up");
+    __publicField(this, "tableId");
+    __publicField(this, "tablePos");
+    __publicField(this, "tableElement");
+    __publicField(this, "hideTimeout", null);
+    __publicField(this, "emitUpdate");
+    __publicField(this, "viewMousedownHandler", (event) => {
+      this.mouseState = "down";
+      const { state, view } = this.editor;
+      if (!(state.selection instanceof import_tables2.CellSelection) || this.editor.isFocused)
+        return;
+      const posInfo = view.posAtCoords({
+        left: event.clientX,
+        top: event.clientY
+      });
+      if (!posInfo) return;
+      const $pos = state.doc.resolve(posInfo.pos);
+      const { nodes } = state.schema;
+      let paraDepth = -1;
+      let inTableCell = false;
+      for (let d = $pos.depth; d >= 0; d--) {
+        const 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;
+      const from = $pos.start(paraDepth);
+      const to = $pos.end(paraDepth);
+      const nextSel = import_state.TextSelection.create(state.doc, from, to);
+      if (state.selection.eq(nextSel)) return;
+      view.dispatch(state.tr.setSelection(nextSel));
+      view.focus();
+    });
+    __publicField(this, "mouseUpHandler", (event) => {
+      this.mouseState = "up";
+      this.mouseMoveHandler(event);
+    });
+    __publicField(this, "mouseMoveHandler", (event) => {
+      if (this.menuFrozen || this.mouseState === "selecting") return;
+      const target = event.target;
+      if (!(0, import_shared_utils2.isHTMLElement)(target) || !this.editorView.dom.contains(target)) return;
+      this._handleMouseMoveNow(event);
+    });
+    __publicField(this, "dragOverHandler", (event) => {
+      var _a;
+      if (((_a = this.state) == null ? void 0 : _a.draggingState) === void 0) {
+        return;
+      }
+      event.preventDefault();
+      event.dataTransfer.dropEffect = "move";
+      hideElements(
+        ".prosemirror-dropcursor-block, .prosemirror-dropcursor-inline",
+        this.editorView.root
+      );
+      const {
+        left: tableLeft,
+        right: tableRight,
+        top: tableTop,
+        bottom: tableBottom
+      } = this.state.referencePosTable;
+      const boundedMouseCoords = {
+        left: (0, import_shared_utils2.clamp)(event.clientX, tableLeft + 1, tableRight - 1),
+        top: (0, import_shared_utils2.clamp)(event.clientY, tableTop + 1, tableBottom - 1)
+      };
+      const tableCellElements = this.editorView.root.elementsFromPoint(boundedMouseCoords.left, boundedMouseCoords.top).filter(
+        (element) => element.tagName === "TD" || element.tagName === "TH"
+      );
+      if (tableCellElements.length === 0) {
+        return;
+      }
+      const tableCellElement = tableCellElements[0];
+      if (!(0, import_shared_utils2.isHTMLElement)(tableCellElement)) {
+        return;
+      }
+      const cellPosition = getCellIndicesFromDOM(
+        tableCellElement,
+        this.state.block,
+        this.editor
+      );
+      if (!cellPosition) return;
+      const { rowIndex, colIndex } = cellPosition;
+      const oldIndex = this.state.draggingState.draggedCellOrientation === "row" ? this.state.rowIndex : this.state.colIndex;
+      const newIndex = this.state.draggingState.draggedCellOrientation === "row" ? rowIndex : colIndex;
+      const dispatchDecorationsTransaction = newIndex !== oldIndex;
+      const mousePos = this.state.draggingState.draggedCellOrientation === "row" ? boundedMouseCoords.top : boundedMouseCoords.left;
+      const cellChanged = this.state.rowIndex !== rowIndex || this.state.colIndex !== colIndex;
+      const mousePosChanged = this.state.draggingState.mousePos !== mousePos;
+      if (cellChanged || mousePosChanged) {
+        this.state = {
+          ...this.state,
+          rowIndex,
+          colIndex,
+          referencePosCell: tableCellElement.getBoundingClientRect(),
+          draggingState: {
+            ...this.state.draggingState,
+            mousePos
+          }
+        };
+        this.emitUpdate();
+      }
+      if (dispatchDecorationsTransaction) {
+        this.editor.view.dispatch(
+          this.editor.state.tr.setMeta(tableHandlePluginKey, true)
+        );
+      }
+    });
+    __publicField(this, "dropHandler", () => {
+      this.mouseState = "up";
+      const st = this.state;
+      if (!(st == null ? void 0 : st.draggingState)) return false;
+      const { draggingState, rowIndex, colIndex, blockPos } = st;
+      if (!(0, import_editor_utils.isValidPosition)(blockPos)) return false;
+      if (draggingState.draggedCellOrientation === "row" && rowIndex === void 0 || draggingState.draggedCellOrientation === "col" && colIndex === void 0) {
+        console.warn(
+          "Attempted to drop table row or column, but no table block was hovered prior."
+        );
+        return false;
+      }
+      const isRow = draggingState.draggedCellOrientation === "row";
+      const orientation = isRow ? "row" : "column";
+      const destIndex = isRow ? rowIndex : colIndex;
+      const cellCoords = getIndexCoordinates({
+        editor: this.editor,
+        index: draggingState.originalIndex,
+        orientation,
+        tablePos: blockPos
+      });
+      if (!cellCoords) return false;
+      const stateWithCellSel = selectCellsByCoords(
+        this.editor,
+        blockPos,
+        cellCoords,
+        { mode: "state" }
+      );
+      if (!stateWithCellSel) return false;
+      const dispatch = (tr) => this.editor.view.dispatch(tr);
+      if (isRow) {
+        (0, import_tables2.moveTableRow)({
+          from: draggingState.originalIndex,
+          to: destIndex,
+          select: true,
+          pos: blockPos + 1
+        })(stateWithCellSel, dispatch);
+      } else {
+        (0, import_tables2.moveTableColumn)({
+          from: draggingState.originalIndex,
+          to: destIndex,
+          select: true,
+          pos: blockPos + 1
+        })(stateWithCellSel, dispatch);
+      }
+      this.state = { ...st, draggingState: void 0 };
+      this.emitUpdate();
+      this.editor.view.dispatch(
+        this.editor.state.tr.setMeta(tableHandlePluginKey, null)
+      );
+      return true;
+    });
+    this.editor = editor;
+    this.editorView = editorView;
+    this.emitUpdate = () => this.state && emitUpdate(this.state);
+    viewRegistry.set(editor, this);
+    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
+    );
+  }
+  /**
+   * Schedule a delayed hide of handles. This allows the user to cross
+   * gaps between table cells and floating handles without the handles
+   * disappearing prematurely.
+   */
+  scheduleHide() {
+    if (this.hideTimeout) return;
+    this.hideTimeout = setTimeout(() => {
+      this.hideTimeout = null;
+      if (!this.menuFrozen) {
+        this.hideHandles();
+      }
+    }, 200);
+  }
+  cancelScheduledHide() {
+    if (this.hideTimeout) {
+      clearTimeout(this.hideTimeout);
+      this.hideTimeout = null;
+    }
+  }
+  hideHandles() {
+    var _a;
+    this.cancelScheduledHide();
+    if (!((_a = this.state) == null ? void 0 : _a.show)) return;
+    this.state = {
+      ...this.state,
+      show: false,
+      showAddOrRemoveRowsButton: false,
+      showAddOrRemoveColumnsButton: false,
+      colIndex: void 0,
+      rowIndex: void 0,
+      referencePosCell: void 0
+    };
+    this.emitUpdate();
+  }
+  _handleMouseMoveNow(event) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+    const around = domCellAround(event.target);
+    if ((around == null ? void 0 : around.type) === "cell" && this.mouseState === "down" && !((_a = this.state) == null ? void 0 : _a.draggingState)) {
+      this.mouseState = "selecting";
+      this.cancelScheduledHide();
+      this.hideHandles();
+      return;
+    }
+    if (!around || !this.editor.isEditable) {
+      this.scheduleHide();
+      return;
+    }
+    this.cancelScheduledHide();
+    const tbody = around.tbodyNode;
+    if (!tbody) return;
+    let tableRect = tbody.getBoundingClientRect();
+    if (tableRect.width === 0 && tableRect.height === 0) {
+      const fallback = (_b = tbody.closest(".table-container")) != null ? _b : tbody.closest(".tableWrapper");
+      if (!fallback) return;
+      tableRect = fallback.getBoundingClientRect();
+    }
+    const coords = this.editor.view.posAtCoords({
+      left: event.clientX,
+      top: event.clientY
+    });
+    if (!coords) return;
+    const $pos = this.editor.view.state.doc.resolve(coords.pos);
+    let blockInfo;
+    for (let d = $pos.depth; d >= 0; d--) {
+      const node = $pos.node(d);
+      if (isTableNode(node)) {
+        blockInfo = { 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;
+    const widgetContainer = (_c = this.tableElement) == null ? void 0 : _c.querySelector(
+      ".table-controls"
+    );
+    if (around.type === "wrapper") {
+      const below = event.clientY >= tableRect.bottom - 1 && event.clientY < tableRect.bottom + 20;
+      const right = event.clientX >= tableRect.right - 1 && event.clientX < tableRect.right + 20;
+      const cursorBeyondRightOrBottom = event.clientX > tableRect.right || event.clientY > tableRect.bottom;
+      this.state = {
+        ...this.state,
+        show: true,
+        showAddOrRemoveRowsButton: below,
+        showAddOrRemoveColumnsButton: right,
+        referencePosTable: tableRect,
+        block: blockInfo.node,
+        blockPos: blockInfo.pos,
+        widgetContainer,
+        colIndex: cursorBeyondRightOrBottom ? void 0 : (_d = this.state) == null ? void 0 : _d.colIndex,
+        rowIndex: cursorBeyondRightOrBottom ? void 0 : (_e = this.state) == null ? void 0 : _e.rowIndex,
+        referencePosCell: cursorBeyondRightOrBottom ? void 0 : (_f = this.state) == null ? void 0 : _f.referencePosCell
+      };
+    } else {
+      const cellPosition = getCellIndicesFromDOM(
+        around.domNode,
+        blockInfo.node,
+        this.editor
+      );
+      if (!cellPosition) return;
+      const { rowIndex, colIndex } = cellPosition;
+      const cellRect = around.domNode.getBoundingClientRect();
+      const lastRowIndex = blockInfo.node.content.childCount - 1;
+      const lastColIndex = ((_h = (_g = blockInfo.node.content.firstChild) == null ? void 0 : _g.content.childCount) != null ? _h : 0) - 1;
+      if (((_i = this.state) == null ? void 0 : _i.show) && this.tableId === blockInfo.node.attrs.id && this.state.rowIndex === rowIndex && this.state.colIndex === colIndex) {
+        return;
+      }
+      this.state = {
+        show: true,
+        showAddOrRemoveColumnsButton: colIndex === lastColIndex,
+        showAddOrRemoveRowsButton: rowIndex === lastRowIndex,
+        referencePosTable: tableRect,
+        block: blockInfo.node,
+        blockPos: blockInfo.pos,
+        draggingState: void 0,
+        referencePosCell: cellRect,
+        colIndex,
+        rowIndex,
+        widgetContainer
+      };
+    }
+    this.emitUpdate();
+    return false;
+  }
+  update(view) {
+    var _a, _b, _c, _d;
+    const pluginState = tableHandlePluginKey.getState(view.state);
+    if (pluginState !== void 0 && pluginState !== this.menuFrozen) {
+      this.menuFrozen = pluginState;
+      if (this.menuFrozen) {
+        this.cancelScheduledHide();
+      }
+    }
+    if (!((_a = this.state) == null ? void 0 : _a.show)) return;
+    if (!((_b = this.tableElement) == null ? void 0 : _b.isConnected)) {
+      this.hideHandles();
+      return;
+    }
+    const tableInfo = getTableFromDOM(this.tableElement, this.editor);
+    if (!tableInfo) {
+      this.hideHandles();
+      return;
+    }
+    const blockChanged = this.state.block !== tableInfo.node || this.state.blockPos !== tableInfo.pos;
+    if (!tableInfo.node || tableInfo.node.type.name !== "table" || !((_c = this.tableElement) == null ? void 0 : _c.isConnected)) {
+      this.hideHandles();
+      return;
+    }
+    const { height: rowCount, width: colCount } = import_tables2.TableMap.get(tableInfo.node);
+    let newRowIndex = this.state.rowIndex;
+    let newColIndex = this.state.colIndex;
+    if (newRowIndex !== void 0 && newRowIndex >= rowCount) {
+      newRowIndex = rowCount ? rowCount - 1 : void 0;
+    }
+    if (newColIndex !== void 0 && newColIndex >= colCount) {
+      newColIndex = colCount ? colCount - 1 : void 0;
+    }
+    const tableBody = this.tableElement.querySelector("tbody");
+    if (!tableBody) {
+      throw new Error(
+        "Table block does not contain a 'tbody' HTML element. This should never happen."
+      );
+    }
+    let newReferencePosCell = this.state.referencePosCell;
+    if (newRowIndex !== void 0 && newColIndex !== void 0) {
+      const rowEl = tableBody.children[newRowIndex];
+      const cellEl = rowEl == null ? void 0 : rowEl.children[newColIndex];
+      if (cellEl) {
+        newReferencePosCell = cellEl.getBoundingClientRect();
+      } else {
+        newRowIndex = void 0;
+        newColIndex = void 0;
+        newReferencePosCell = void 0;
+      }
+    }
+    let newReferencePosTable = tableBody.getBoundingClientRect();
+    if (newReferencePosTable.width === 0 && newReferencePosTable.height === 0) {
+      const fallback = (_d = tableBody.closest(".table-container")) != null ? _d : tableBody.closest(".tableWrapper");
+      if (fallback) {
+        newReferencePosTable = fallback.getBoundingClientRect();
+      }
+    }
+    const indicesChanged = newRowIndex !== this.state.rowIndex || newColIndex !== this.state.colIndex;
+    const refPosChanged = newReferencePosCell !== this.state.referencePosCell || newReferencePosTable !== this.state.referencePosTable;
+    if (blockChanged || indicesChanged || refPosChanged) {
+      this.state = {
+        ...this.state,
+        block: tableInfo.node,
+        blockPos: tableInfo.pos,
+        rowIndex: newRowIndex,
+        colIndex: newColIndex,
+        referencePosCell: newReferencePosCell,
+        referencePosTable: newReferencePosTable
+      };
+      this.emitUpdate();
+    }
+  }
+  destroy() {
+    this.cancelScheduledHide();
+    viewRegistry.delete(this.editor);
+    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
+    );
+  }
+};
+function TableHandlePlugin(editor, emitUpdate) {
+  let viewInstance = null;
+  return new import_state.Plugin({
+    key: tableHandlePluginKey,
+    state: {
+      init: () => false,
+      apply: (tr, frozen) => {
+        const meta = tr.getMeta(tableHandlePluginKey);
+        return meta !== void 0 ? meta : frozen;
+      }
+    },
+    view: (editorView) => {
+      viewInstance = new TableHandleView(editor, editorView, emitUpdate);
+      return viewInstance;
+    },
+    props: {
+      decorations: (state) => {
+        if (!viewInstance || viewInstance.state === void 0 || viewInstance.state.draggingState === void 0 || viewInstance.tablePos === void 0) {
+          return;
+        }
+        const newIndex = viewInstance.state.draggingState.draggedCellOrientation === "row" ? viewInstance.state.rowIndex : viewInstance.state.colIndex;
+        if (newIndex === void 0) {
+          return;
+        }
+        const decorations = [];
+        const { draggingState } = viewInstance.state;
+        const { originalIndex } = draggingState;
+        if (viewInstance.state.draggingState.draggedCellOrientation === "row") {
+          const originalCells = getRowCells(
+            editor,
+            originalIndex,
+            viewInstance.state.blockPos
+          );
+          originalCells.cells.forEach((cell) => {
+            if (cell.node) {
+              decorations.push(
+                import_view.Decoration.node(cell.pos, cell.pos + cell.node.nodeSize, {
+                  class: "table-cell-dragging-source"
+                })
+              );
+            }
+          });
+        } else {
+          const originalCells = getColumnCells(
+            editor,
+            originalIndex,
+            viewInstance.state.blockPos
+          );
+          originalCells.cells.forEach((cell) => {
+            if (cell.node) {
+              decorations.push(
+                import_view.Decoration.node(cell.pos, cell.pos + cell.node.nodeSize, {
+                  class: "table-cell-dragging-source"
+                })
+              );
+            }
+          });
+        }
+        if (newIndex === originalIndex || !editor) {
+          return import_view.DecorationSet.create(state.doc, decorations);
+        }
+        if (viewInstance.state.draggingState.draggedCellOrientation === "row") {
+          const cellsInRow = getRowCells(
+            editor,
+            newIndex,
+            viewInstance.state.blockPos
+          );
+          cellsInRow.cells.forEach((cell) => {
+            const cellNode = cell.node;
+            if (!cellNode) {
+              return;
+            }
+            const decorationPos = cell.pos + (newIndex > originalIndex ? cellNode.nodeSize - 2 : 2);
+            decorations.push(
+              import_view.Decoration.widget(decorationPos, () => {
+                const widget = document.createElement("div");
+                widget.className = "tiptap-table-dropcursor";
+                widget.style.left = "0";
+                widget.style.right = "0";
+                if (newIndex > originalIndex) {
+                  widget.style.bottom = "-1px";
+                } else {
+                  widget.style.top = "-1px";
+                }
+                widget.style.height = "3px";
+                return widget;
+              })
+            );
+          });
+        } else {
+          const cellsInColumn = getColumnCells(
+            editor,
+            newIndex,
+            viewInstance.state.blockPos
+          );
+          cellsInColumn.cells.forEach((cell) => {
+            const cellNode = cell.node;
+            if (!cellNode) {
+              return;
+            }
+            const decorationPos = cell.pos + (newIndex > originalIndex ? cellNode.nodeSize - 2 : 2);
+            decorations.push(
+              import_view.Decoration.widget(decorationPos, () => {
+                const widget = document.createElement("div");
+                widget.className = "tiptap-table-dropcursor";
+                widget.style.top = "0";
+                widget.style.bottom = "0";
+                if (newIndex > originalIndex) {
+                  widget.style.right = "-1px";
+                } else {
+                  widget.style.left = "-1px";
+                }
+                widget.style.width = "3px";
+                return widget;
+              })
+            );
+          });
+        }
+        return import_view.DecorationSet.create(state.doc, decorations);
+      }
+    }
+  });
+}
+var tableDragStart = (editor, orientation, event) => {
+  const viewInstance = viewRegistry.get(editor);
+  if (!(viewInstance == null ? void 0 : viewInstance.state)) {
+    console.warn(
+      `Attempted to drag table ${orientation}, but no table block was hovered prior.`
+    );
+    return;
+  }
+  const { state } = viewInstance;
+  const index = orientation === "col" ? state.colIndex : state.rowIndex;
+  if (index === void 0) {
+    console.warn(
+      `Attempted to drag table ${orientation}, but no valid index found.`
+    );
+    return;
+  }
+  const { blockPos, referencePosCell } = state;
+  const mousePos = orientation === "col" ? event.clientX : event.clientY;
+  if (editor.state.selection instanceof import_tables2.CellSelection) {
+    const safeSel = import_state.TextSelection.near(editor.state.doc.resolve(blockPos), 1);
+    editor.view.dispatch(editor.state.tr.setSelection(safeSel));
+  }
+  const dragImage = createTableDragImage(editor, orientation, index, blockPos);
+  if (event.dataTransfer) {
+    const handleRect = event.currentTarget.getBoundingClientRect();
+    const offset = orientation === "col" ? { x: handleRect.width / 2, y: 0 } : { x: 0, y: handleRect.height / 2 };
+    event.dataTransfer.effectAllowed = orientation === "col" ? "move" : "copyMove";
+    event.dataTransfer.setDragImage(dragImage, offset.x, offset.y);
+  }
+  const cleanup = () => {
+    var _a;
+    return (_a = dragImage.parentNode) == null ? void 0 : _a.removeChild(dragImage);
+  };
+  document.addEventListener("drop", cleanup, { once: true });
+  document.addEventListener("dragend", cleanup, { once: true });
+  const initialOffset = referencePosCell ? (orientation === "col" ? referencePosCell.left : referencePosCell.top) - mousePos : 0;
+  viewInstance.state = {
+    ...state,
+    draggingState: {
+      draggedCellOrientation: orientation,
+      originalIndex: index,
+      mousePos,
+      initialOffset
+    }
+  };
+  viewInstance.emitUpdate();
+  editor.view.dispatch(editor.state.tr.setMeta(tableHandlePluginKey, true));
+};
+var colDragStart = (editor, event) => tableDragStart(editor, "col", { ...event, clientY: 0 });
+var rowDragStart = (editor, event) => tableDragStart(editor, "row", { ...event, clientX: 0 });
+var dragEnd = (editor) => {
+  const viewInstance = viewRegistry.get(editor);
+  if (!viewInstance || viewInstance.state === void 0) {
+    return;
+  }
+  viewInstance.state = {
+    ...viewInstance.state,
+    draggingState: void 0
+  };
+  viewInstance.emitUpdate();
+  editor.view.dispatch(editor.state.tr.setMeta(tableHandlePluginKey, null));
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TableHandlePlugin,
+  colDragStart,
+  dragEnd,
+  rowDragStart,
+  tableHandlePluginKey
+});