@ctzhian/tiptap 2.13.7 → 3.0.1

package/dist/features/table/plugin/drag-helpers.js

@@ -0,0 +1,188 @@
+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 _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 { TextSelection } from '@tiptap/pm/state';
+import { CellSelection } from '@tiptap/pm/tables';
+import { getTableFromDOM, isTableNode, safeClosest } from "../../../utils/table";
+import { createTableDragImage } from "./create-image";
+import { getTableHandleRuntime, tableHandlePluginKey } from "./shared";
+var disableDrag = function disableDrag(event) {
+  if (event.dataTransfer) {
+    event.dataTransfer.effectAllowed = 'none';
+  }
+};
+var recoverStateFromDataset = function recoverStateFromDataset(editor, handleElement, orientation) {
+  var dataIndex = handleElement.dataset.tableIndex;
+  var dataTablePos = handleElement.dataset.tablePos;
+  if (!dataIndex || !dataTablePos) {
+    return null;
+  }
+  var index = Number.parseInt(dataIndex, 10);
+  var blockPos = Number.parseInt(dataTablePos, 10);
+  if (Number.isNaN(index) || Number.isNaN(blockPos)) {
+    return null;
+  }
+  var tableNode = editor.state.doc.nodeAt(blockPos);
+  if (!tableNode || !isTableNode(tableNode)) {
+    return null;
+  }
+  var tableWrapper = safeClosest(handleElement, '.tableWrapper');
+  var tbody = tableWrapper === null || tableWrapper === void 0 ? void 0 : tableWrapper.querySelector('tbody');
+  if (!tbody) {
+    return null;
+  }
+  var tableRect = tbody.getBoundingClientRect();
+  return {
+    show: true,
+    showAddOrRemoveRowsButton: false,
+    showAddOrRemoveColumnsButton: false,
+    referencePosTable: tableRect,
+    block: tableNode,
+    blockPos: blockPos,
+    colIndex: orientation === 'col' ? index : undefined,
+    rowIndex: orientation === 'row' ? index : undefined,
+    referencePosCell: undefined,
+    widgetContainer: undefined
+  };
+};
+var recoverStateFromDom = function recoverStateFromDom(editor, handleElement, orientation) {
+  var tableWrapper = safeClosest(handleElement, '.tableWrapper');
+  if (!tableWrapper) {
+    return null;
+  }
+  var tableInfo = getTableFromDOM(tableWrapper, editor);
+  if (!tableInfo) {
+    return null;
+  }
+  var tbody = tableWrapper.querySelector('tbody');
+  if (!tbody) {
+    return null;
+  }
+  var tableRect = tbody.getBoundingClientRect();
+  var handleRect = handleElement.getBoundingClientRect();
+  var approximateIndex = 0;
+  if (orientation === 'row') {
+    var rowHeight = tableRect.height / tableInfo.node.content.childCount;
+    approximateIndex = Math.floor((handleRect.top - tableRect.top) / rowHeight);
+  } else {
+    var _tableInfo$node$conte, _tableInfo$node$conte2;
+    var colWidth = tableRect.width / ((_tableInfo$node$conte = (_tableInfo$node$conte2 = tableInfo.node.content.firstChild) === null || _tableInfo$node$conte2 === void 0 ? void 0 : _tableInfo$node$conte2.content.childCount) !== null && _tableInfo$node$conte !== void 0 ? _tableInfo$node$conte : 1);
+    approximateIndex = Math.floor((handleRect.left - tableRect.left) / colWidth);
+  }
+  return {
+    show: true,
+    showAddOrRemoveRowsButton: false,
+    showAddOrRemoveColumnsButton: false,
+    referencePosTable: tableRect,
+    block: tableInfo.node,
+    blockPos: tableInfo.pos,
+    colIndex: orientation === 'col' ? approximateIndex : undefined,
+    rowIndex: orientation === 'row' ? approximateIndex : undefined,
+    referencePosCell: undefined,
+    widgetContainer: undefined
+  };
+};
+var ensureTableState = function ensureTableState(editor, event, orientation) {
+  var _runtime$state;
+  var runtime = getTableHandleRuntime();
+  if (!runtime) {
+    return null;
+  }
+  if (runtime.state) {
+    return runtime.state;
+  }
+  var handleElement = event.currentTarget;
+  runtime.state = recoverStateFromDataset(editor, handleElement, orientation) || recoverStateFromDom(editor, handleElement, orientation) || undefined;
+  return (_runtime$state = runtime.state) !== null && _runtime$state !== void 0 ? _runtime$state : null;
+};
+var tableDragStart = function tableDragStart(orientation, event) {
+  var runtime = getTableHandleRuntime();
+  if (!runtime) {
+    disableDrag(event);
+    return;
+  }
+  if (!runtime.editor.isEditable) {
+    disableDrag(event);
+    return;
+  }
+  var state = ensureTableState(runtime.editor, event, orientation);
+  if (!state) {
+    disableDrag(event);
+    return;
+  }
+  var index = orientation === 'col' ? state.colIndex : state.rowIndex;
+  if (index === undefined) {
+    disableDrag(event);
+    return;
+  }
+  var blockPos = state.blockPos,
+    referencePosCell = state.referencePosCell;
+  var mousePos = orientation === 'col' ? event.clientX : event.clientY;
+  if (runtime.editor.state.selection instanceof CellSelection) {
+    var safeSel = TextSelection.near(runtime.editor.state.doc.resolve(blockPos), 1);
+    runtime.editor.view.dispatch(runtime.editor.state.tr.setSelection(safeSel));
+  }
+  var dragImage = createTableDragImage(runtime.editor, orientation, index, blockPos);
+  if (event.dataTransfer) {
+    var handleRect = event.currentTarget.getBoundingClientRect();
+    var 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);
+  }
+  var cleanup = function cleanup() {
+    var _dragImage$parentNode;
+    return (_dragImage$parentNode = dragImage.parentNode) === null || _dragImage$parentNode === void 0 ? void 0 : _dragImage$parentNode.removeChild(dragImage);
+  };
+  document.addEventListener('drop', cleanup, {
+    once: true
+  });
+  document.addEventListener('dragend', cleanup, {
+    once: true
+  });
+  var initialOffset = referencePosCell ? (orientation === 'col' ? referencePosCell.left : referencePosCell.top) - mousePos : 0;
+  var originalCellSize = referencePosCell ? {
+    width: referencePosCell.width,
+    height: referencePosCell.height
+  } : undefined;
+  runtime.state = _objectSpread(_objectSpread({}, state), {}, {
+    draggingState: {
+      draggedCellOrientation: orientation,
+      originalIndex: index,
+      mousePos: mousePos,
+      initialOffset: initialOffset,
+      originalCellSize: originalCellSize
+    }
+  });
+  runtime.emitUpdate();
+  runtime.editor.view.dispatch(runtime.editor.state.tr.setMeta(tableHandlePluginKey, true));
+};
+export var colDragStart = function colDragStart(event) {
+  return tableDragStart('col', _objectSpread(_objectSpread({}, event), {}, {
+    clientY: 0
+  }));
+};
+export var rowDragStart = function rowDragStart(event) {
+  return tableDragStart('row', _objectSpread(_objectSpread({}, event), {}, {
+    clientX: 0
+  }));
+};
+export var dragEnd = function dragEnd() {
+  var runtime = getTableHandleRuntime();
+  if (!runtime || runtime.state === undefined) {
+    return;
+  }
+  runtime.state = _objectSpread(_objectSpread({}, runtime.state), {}, {
+    draggingState: undefined
+  });
+  runtime.emitUpdate();
+  runtime.editor.view.dispatch(runtime.editor.state.tr.setMeta(tableHandlePluginKey, null));
+};

package/dist/features/table/plugin/hover-state.d.ts

@@ -0,0 +1,27 @@
+import type { Node as TiptapNode } from '@tiptap/pm/model';
+import type { TableHandlesState } from './shared';
+export declare const buildWrapperHoverState: ({ previousState, tableRect, referencePosLastRow, referencePosLastCol, block, blockPos, widgetContainer, keepColIndex, nextRowIndex, nextReferencePosCell, resetIndices, }: {
+    previousState?: TableHandlesState | undefined;
+    tableRect: DOMRect;
+    referencePosLastRow?: DOMRect | undefined;
+    referencePosLastCol?: DOMRect | undefined;
+    block: TiptapNode;
+    blockPos: number;
+    widgetContainer?: HTMLElement | undefined;
+    keepColIndex?: number | undefined;
+    nextRowIndex?: number | undefined;
+    nextReferencePosCell?: DOMRect | undefined;
+    resetIndices: boolean;
+}) => TableHandlesState;
+export declare const buildCellHoverState: ({ tableRect, referencePosLastRow, referencePosLastCol, block, blockPos, widgetContainer, draggingState, referencePosCell, colIndex, rowIndex, }: {
+    tableRect: DOMRect;
+    referencePosLastRow?: DOMRect | undefined;
+    referencePosLastCol?: DOMRect | undefined;
+    block: TiptapNode;
+    blockPos: number;
+    widgetContainer?: HTMLElement | undefined;
+    draggingState?: TableHandlesState['draggingState'];
+    referencePosCell: DOMRect;
+    colIndex: number;
+    rowIndex: number;
+}) => TableHandlesState;

package/dist/features/table/plugin/hover-state.js

@@ -0,0 +1,60 @@
+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 _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); }
+export var buildWrapperHoverState = function buildWrapperHoverState(_ref) {
+  var previousState = _ref.previousState,
+    tableRect = _ref.tableRect,
+    referencePosLastRow = _ref.referencePosLastRow,
+    referencePosLastCol = _ref.referencePosLastCol,
+    block = _ref.block,
+    blockPos = _ref.blockPos,
+    widgetContainer = _ref.widgetContainer,
+    keepColIndex = _ref.keepColIndex,
+    nextRowIndex = _ref.nextRowIndex,
+    nextReferencePosCell = _ref.nextReferencePosCell,
+    resetIndices = _ref.resetIndices;
+  return _objectSpread(_objectSpread({}, previousState), {}, {
+    show: true,
+    showAddOrRemoveRowsButton: !!referencePosLastRow,
+    showAddOrRemoveColumnsButton: !!referencePosLastCol,
+    referencePosTable: tableRect,
+    referencePosLastRow: referencePosLastRow,
+    referencePosLastCol: referencePosLastCol,
+    block: block,
+    blockPos: blockPos,
+    widgetContainer: widgetContainer,
+    colIndex: resetIndices ? undefined : keepColIndex,
+    rowIndex: resetIndices ? undefined : nextRowIndex !== null && nextRowIndex !== void 0 ? nextRowIndex : previousState === null || previousState === void 0 ? void 0 : previousState.rowIndex,
+    referencePosCell: resetIndices ? undefined : nextReferencePosCell !== null && nextReferencePosCell !== void 0 ? nextReferencePosCell : previousState === null || previousState === void 0 ? void 0 : previousState.referencePosCell
+  });
+};
+export var buildCellHoverState = function buildCellHoverState(_ref2) {
+  var tableRect = _ref2.tableRect,
+    referencePosLastRow = _ref2.referencePosLastRow,
+    referencePosLastCol = _ref2.referencePosLastCol,
+    block = _ref2.block,
+    blockPos = _ref2.blockPos,
+    widgetContainer = _ref2.widgetContainer,
+    draggingState = _ref2.draggingState,
+    referencePosCell = _ref2.referencePosCell,
+    colIndex = _ref2.colIndex,
+    rowIndex = _ref2.rowIndex;
+  return {
+    show: true,
+    showAddOrRemoveColumnsButton: !!referencePosLastCol,
+    showAddOrRemoveRowsButton: !!referencePosLastRow,
+    referencePosTable: tableRect,
+    referencePosLastRow: referencePosLastRow,
+    referencePosLastCol: referencePosLastCol,
+    block: block,
+    blockPos: blockPos,
+    draggingState: draggingState,
+    referencePosCell: referencePosCell,
+    colIndex: colIndex,
+    rowIndex: rowIndex,
+    widgetContainer: widgetContainer
+  };
+};

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

@@ -0,0 +1,17 @@
+import { Extension } from '@tiptap/core';
+import type { TableHandlesState } from './shared';
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        tableHandle: {
+            freezeHandles: () => ReturnType;
+            unfreezeHandles: () => ReturnType;
+        };
+    }
+    interface EditorEvents {
+        tableHandleState: TableHandlesState;
+    }
+}
+export declare const TableHandleExtension: Extension<any, any>;
+export * from './plugin';
+export * from './drag-helpers';
+export * from './shared';

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

@@ -0,0 +1,36 @@
+import { Extension } from '@tiptap/core';
+import { TableHandlePlugin } from "./plugin";
+import { tableHandlePluginKey } from "./shared";
+export var TableHandleExtension = Extension.create({
+  name: 'tableHandleExtension',
+  addCommands: function addCommands() {
+    return {
+      freezeHandles: function freezeHandles() {
+        return function (_ref) {
+          var tr = _ref.tr,
+            dispatch = _ref.dispatch;
+          if (dispatch) tr.setMeta(tableHandlePluginKey, true);
+          return true;
+        };
+      },
+      unfreezeHandles: function unfreezeHandles() {
+        return function (_ref2) {
+          var tr = _ref2.tr,
+            dispatch = _ref2.dispatch;
+          if (dispatch) tr.setMeta(tableHandlePluginKey, false);
+          return true;
+        };
+      }
+    };
+  },
+  addProseMirrorPlugins: function addProseMirrorPlugins() {
+    var _this = this;
+    var editor = this.editor;
+    return [TableHandlePlugin(editor, function (state) {
+      _this.editor.emit('tableHandleState', state);
+    })];
+  }
+});
+export * from "./plugin";
+export * from "./drag-helpers";
+export * from "./shared";

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

@@ -0,0 +1,4 @@
+import type { Editor } from '@tiptap/core';
+import { Plugin } from '@tiptap/pm/state';
+import { TableHandlesState } from './shared';
+export declare function TableHandlePlugin(editor: Editor, emitUpdate: (state: TableHandlesState) => void): Plugin;