@ctzhian/tiptap 2.6.1 → 2.7.0

package/dist/extension/node/Table.js

@@ -22,13 +22,98 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 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); }
-// @ts-nocheck
-
 import { Extension } from '@tiptap/core';
 import { Table, TableCell, TableHeader, TableRow } from '@tiptap/extension-table';
 import { TextSelection } from '@tiptap/pm/state';
 import { TableView } from '@tiptap/pm/tables';
 import { TableHandleExtension } from "./TableHandler";
+
+// 表格相关常量
+var TABLE_CONSTANTS = {
+  DEFAULT_CELL_MIN_WIDTH: 100,
+  HANDLE_WIDTH: 5,
+  SHORTCUT_KEY: 'Mod-9',
+  DEFAULT_ROWS: 3,
+  DEFAULT_COLS: 4
+};
+
+// 表格单元格的通用属性定义
+var createCommonCellAttributes = function createCommonCellAttributes() {
+  var isHeader = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  return {
+    bgcolor: {
+      default: null,
+      parseHTML: function parseHTML(element) {
+        return element.getAttribute('data-background-color') || element.style.backgroundColor;
+      },
+      renderHTML: function renderHTML(attributes) {
+        if (isHeader) {
+          return {
+            'data-background-color': attributes.bgcolor,
+            style: "background-color: ".concat(attributes.bgcolor)
+          };
+        } else {
+          return {
+            'data-background-color': attributes.bgcolor,
+            style: "background-color: ".concat(attributes.bgcolor)
+          };
+        }
+      }
+    },
+    textAlign: {
+      default: null,
+      parseHTML: function parseHTML(element) {
+        return element.getAttribute('data-text-align') || element.style.textAlign;
+      },
+      renderHTML: function renderHTML(attributes) {
+        if (!attributes.textAlign) return {};
+        return {
+          style: "text-align: ".concat(attributes.textAlign),
+          'data-text-align': attributes.textAlign
+        };
+      }
+    },
+    verticalAlign: {
+      default: null,
+      parseHTML: function parseHTML(element) {
+        return element.getAttribute('data-vertical-align') || element.style.verticalAlign;
+      },
+      renderHTML: function renderHTML(attributes) {
+        if (!attributes.verticalAlign) return {};
+        return {
+          style: "vertical-align: ".concat(attributes.verticalAlign),
+          'data-vertical-align': attributes.verticalAlign
+        };
+      }
+    },
+    fontSize: {
+      default: null,
+      parseHTML: function parseHTML(element) {
+        return element.getAttribute('data-font-size') || element.style.fontSize;
+      },
+      renderHTML: function renderHTML(attributes) {
+        if (!attributes.fontSize) return {};
+        return {
+          style: "font-size: ".concat(attributes.fontSize),
+          'data-font-size': attributes.fontSize
+        };
+      }
+    },
+    fontWeight: {
+      default: null,
+      parseHTML: function parseHTML(element) {
+        return element.getAttribute('data-font-weight') || element.style.fontWeight;
+      },
+      renderHTML: function renderHTML(attributes) {
+        if (!attributes.fontWeight) return {};
+        return {
+          style: "font-weight: ".concat(attributes.fontWeight),
+          'data-font-weight': attributes.fontWeight
+        };
+      }
+    }
+  };
+};
 export var TableExtension = function TableExtension(_ref) {
   var editable = _ref.editable;
   return [Table.extend({
@@ -122,7 +207,7 @@ export var TableExtension = function TableExtension(_ref) {
           }]);
           return TiptapTableView;
         }(TableView);
-        var cellMinWidth = _this.options.cellMinWidth < 100 ? 100 : _this.options.cellMinWidth;
+        var cellMinWidth = _this.options.cellMinWidth < TABLE_CONSTANTS.DEFAULT_CELL_MIN_WIDTH ? TABLE_CONSTANTS.DEFAULT_CELL_MIN_WIDTH : _this.options.cellMinWidth;
         return new TiptapTableView(node, cellMinWidth, HTMLAttributes);
       };
     },
@@ -131,10 +216,18 @@ export var TableExtension = function TableExtension(_ref) {
         HTMLAttributes = _ref5.HTMLAttributes;
       var firstRow = node.content.firstChild;
       var colCount = firstRow ? firstRow.childCount : 0;
-      var style = "--default-cell-min-width: 100px; min-width: ".concat(colCount * 100, "px;");
+
+      // 构建表格样式
+      var tableStyles = ["--default-cell-min-width: ".concat(TABLE_CONSTANTS.DEFAULT_CELL_MIN_WIDTH, "px"), "min-width: ".concat(colCount * TABLE_CONSTANTS.DEFAULT_CELL_MIN_WIDTH, "px")];
+
+      // 合并现有样式
+      var existingStyle = HTMLAttributes.style;
+      var combinedStyle = existingStyle ? "".concat(existingStyle, "; ").concat(tableStyles.join('; ')) : tableStyles.join('; ');
       var attrs = _objectSpread(_objectSpread({}, HTMLAttributes), {}, {
-        style: HTMLAttributes.style ? "".concat(HTMLAttributes.style, " ").concat(style) : style
+        style: combinedStyle
       });
+
+      // 生成列定义
       var cols = [];
       for (var i = 0; i < colCount; i++) {
         cols.push(['col', {}]);
@@ -179,91 +272,24 @@ export var TableExtension = function TableExtension(_ref) {
     },
     addKeyboardShortcuts: function addKeyboardShortcuts() {
       var _this3 = this;
-      return {
-        'Mod-9': function Mod9() {
-          return _this3.editor.chain().insertTable({
-            rows: 3,
-            cols: 4,
-            withHeaderRow: false
-          }).focus().run();
-        }
-      };
+      return _defineProperty({}, TABLE_CONSTANTS.SHORTCUT_KEY, function () {
+        return _this3.editor.chain().insertTable({
+          rows: TABLE_CONSTANTS.DEFAULT_ROWS,
+          cols: TABLE_CONSTANTS.DEFAULT_COLS,
+          withHeaderRow: false
+        }).focus().run();
+      });
     }
   }).configure({
-    handleWidth: 5,
-    cellMinWidth: 100,
+    handleWidth: TABLE_CONSTANTS.HANDLE_WIDTH,
+    cellMinWidth: TABLE_CONSTANTS.DEFAULT_CELL_MIN_WIDTH,
     resizable: editable,
     lastColumnResizable: editable,
     allowTableNodeSelection: editable
   }), TableHeader.extend({
     addAttributes: function addAttributes() {
       var _this$parent2;
-      return _objectSpread(_objectSpread({}, (_this$parent2 = this.parent) === null || _this$parent2 === void 0 ? void 0 : _this$parent2.call(this)), {}, {
-        bgcolor: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-background-color') || element.style.backgroundColor;
-          },
-          renderHTML: function renderHTML(attributes) {
-            return {
-              'data-background-color': attributes.bgcolor,
-              style: "background-color: ".concat(attributes.bgcolor)
-            };
-          }
-        },
-        textAlign: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-text-align') || element.style.textAlign;
-          },
-          renderHTML: function renderHTML(attributes) {
-            if (!attributes.textAlign) return {};
-            return {
-              style: "text-align: ".concat(attributes.textAlign),
-              'data-text-align': attributes.textAlign
-            };
-          }
-        },
-        verticalAlign: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-vertical-align') || element.style.verticalAlign;
-          },
-          renderHTML: function renderHTML(attributes) {
-            if (!attributes.verticalAlign) return {};
-            return {
-              style: "vertical-align: ".concat(attributes.verticalAlign),
-              'data-vertical-align': attributes.verticalAlign
-            };
-          }
-        },
-        fontSize: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-font-size') || element.style.fontSize;
-          },
-          renderHTML: function renderHTML(attributes) {
-            if (!attributes.fontSize) return {};
-            return {
-              style: "font-size: ".concat(attributes.fontSize),
-              'data-font-size': attributes.fontSize
-            };
-          }
-        },
-        fontWeight: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-font-weight') || element.style.fontWeight;
-          },
-          renderHTML: function renderHTML(attributes) {
-            if (!attributes.fontWeight) return {};
-            return {
-              style: "font-weight: ".concat(attributes.fontWeight),
-              'data-font-weight': attributes.fontWeight
-            };
-          }
-        }
-      });
+      return _objectSpread(_objectSpread({}, (_this$parent2 = this.parent) === null || _this$parent2 === void 0 ? void 0 : _this$parent2.call(this)), createCommonCellAttributes(true));
     }
   }).configure({
     HTMLAttributes: {
@@ -276,87 +302,22 @@ export var TableExtension = function TableExtension(_ref) {
   }), TableCell.extend({
     addAttributes: function addAttributes() {
       var _this$parent3;
-      return _objectSpread(_objectSpread({}, (_this$parent3 = this.parent) === null || _this$parent3 === void 0 ? void 0 : _this$parent3.call(this)), {}, {
-        bgcolor: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-background-color') || element.style.backgroundColor;
-          },
-          renderHTML: function renderHTML(attributes) {
-            return {
-              'data-background-color': attributes.bgcolor,
-              style: "background-color: ".concat(attributes.bgcolor)
-            };
-          }
-        },
-        textAlign: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-text-align') || element.style.textAlign;
-          },
-          renderHTML: function renderHTML(attributes) {
-            if (!attributes.textAlign) return {};
-            return {
-              style: "text-align: ".concat(attributes.textAlign),
-              'data-text-align': attributes.textAlign
-            };
-          }
-        },
-        verticalAlign: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-vertical-align') || element.style.verticalAlign;
-          },
-          renderHTML: function renderHTML(attributes) {
-            if (!attributes.verticalAlign) return {};
-            return {
-              style: "vertical-align: ".concat(attributes.verticalAlign),
-              'data-vertical-align': attributes.verticalAlign
-            };
-          }
-        },
-        fontSize: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-font-size') || element.style.fontSize;
-          },
-          renderHTML: function renderHTML(attributes) {
-            if (!attributes.fontSize) return {};
-            return {
-              style: "font-size: ".concat(attributes.fontSize),
-              'data-font-size': attributes.fontSize
-            };
-          }
-        },
-        fontWeight: {
-          default: null,
-          parseHTML: function parseHTML(element) {
-            return element.getAttribute('data-font-weight') || element.style.fontWeight;
-          },
-          renderHTML: function renderHTML(attributes) {
-            if (!attributes.fontWeight) return {};
-            return {
-              style: "font-weight: ".concat(attributes.fontWeight),
-              'data-font-weight': attributes.fontWeight
-            };
-          }
-        }
-      });
+      return _objectSpread(_objectSpread({}, (_this$parent3 = this.parent) === null || _this$parent3 === void 0 ? void 0 : _this$parent3.call(this)), createCommonCellAttributes(false));
     },
     addKeyboardShortcuts: function addKeyboardShortcuts() {
       var _this4 = this;
       return {
         Tab: function Tab() {
           if (_this4.editor.chain().goToNextCell().focus().run()) {
-            return _this4.editor.chain().cancelSelection().run();
+            return true;
           } else if (!_this4.editor.can().addRowAfter()) {
             return false;
           } else {
-            return _this4.editor.chain().addRowAfter().goToNextCell().cancelSelection().run();
+            return _this4.editor.chain().addRowAfter().goToNextCell().run();
           }
         },
         'Shift-Tab': function ShiftTab() {
-          return _this4.editor.chain().goToPreviousCell().cancelSelection().run();
+          return _this4.editor.chain().goToPreviousCell().run();
         }
       };
     }

package/dist/extension/node/TableHandler/plugin.d.ts

@@ -24,26 +24,22 @@ export type TableHandlesState = {
         };
     } | undefined;
     widgetContainer: HTMLElement | undefined;
+    _cachedHandleRects?: DOMRect[];
+    _cachedHandleRectsTime?: number;
 };
 export declare const tableHandlePluginKey: PluginKey<any>;
 export declare function TableHandlePlugin(editor: Editor, emitUpdate: (state: TableHandlesState) => void): Plugin;
-/**
- * Callback for column drag handle
- */
+/** 列拖拽句柄回调 */
 export declare const colDragStart: (event: {
     dataTransfer: DataTransfer | null;
     currentTarget: EventTarget & Element;
     clientX: number;
 }) => void;
-/**
- * Callback for row drag handle
- */
+/** 行拖拽句柄回调 */
 export declare const rowDragStart: (event: {
     dataTransfer: DataTransfer | null;
     currentTarget: EventTarget & Element;
     clientY: number;
 }) => void;
-/**
- * Drag end cleanup
- */
+/** 拖拽结束后的清理 */
 export declare const dragEnd: () => void;