@ctzhian/tiptap 1.7.0 → 1.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,6 +5,7 @@ interface TableContextMenuProps {
5
5
  onClose: () => void;
6
6
  onCommandExecute?: () => void;
7
7
  hasMultipleSelection: boolean;
8
+ hasMultipleCellElements: boolean;
8
9
  }
9
10
  declare const TableContextMenu: React.FC<TableContextMenuProps>;
10
11
  export default TableContextMenu;
@@ -5,6 +5,7 @@ var TableContextMenu = function TableContextMenu(_ref) {
5
5
  var editor = _ref.editor,
6
6
  onClose = _ref.onClose,
7
7
  hasMultipleSelection = _ref.hasMultipleSelection,
8
+ hasMultipleCellElements = _ref.hasMultipleCellElements,
8
9
  onCommandExecute = _ref.onCommandExecute;
9
10
  var handleCommand = function handleCommand(command) {
10
11
  command();
@@ -88,7 +89,7 @@ var TableContextMenu = function TableContextMenu(_ref) {
88
89
  return editor.chain().focus().splitCell().run();
89
90
  });
90
91
  },
91
- show: true
92
+ show: !hasMultipleSelection && hasMultipleCellElements
92
93
  }, {
93
94
  label: '切换表头行',
94
95
  icon: /*#__PURE__*/React.createElement(LayoutTop2LineIcon, {
@@ -19,32 +19,33 @@ var hasMultipleCellSelection = function hasMultipleCellSelection(editor) {
19
19
  return cellSelection.$anchorCell.pos !== cellSelection.$headCell.pos;
20
20
  }
21
21
  }
22
- var selectionAny = selection;
23
- var isColSelection = selectionAny.isColSelection();
24
- var isRowSelection = selectionAny.isRowSelection();
25
- // console.log('3️⃣ selectionAny.isColSelection', isColSelection)
26
- // console.log('3️⃣ selectionAny.isRowSelection', isRowSelection)
27
- if (isColSelection || isRowSelection) {
28
- return true;
29
- }
22
+ return false;
23
+ // const selectionAny = selection as any;
24
+ // const isColSelection = selectionAny.isColSelection;
25
+ // const isRowSelection = selectionAny.isRowSelection;
26
+ // // console.log('3️⃣ selectionAny.isColSelection', isColSelection)
27
+ // // console.log('3️⃣ selectionAny.isRowSelection', isRowSelection)
28
+ // if (isColSelection || isRowSelection) {
29
+ // return true;
30
+ // }
30
31
  // console.log('3️⃣ selection.from', selection.from)
31
32
  // console.log('3️⃣ selection.to', selection.to)
32
- if (selection.from !== selection.to) {
33
- var resolvedFrom = editor.state.doc.resolve(selection.from);
34
- var resolvedTo = editor.state.doc.resolve(selection.to);
35
- // console.log('4️⃣ resolvedFrom.nodeAfter', resolvedFrom.nodeAfter)
36
- // console.log('4️⃣ resolvedTo.nodeBefore', resolvedTo.nodeBefore)
37
- if (resolvedFrom.nodeAfter && resolvedTo.nodeBefore) {
38
- var fromCell = resolvedFrom.node();
39
- var toCell = resolvedTo.node();
40
- // console.log('5️⃣ fromCell', fromCell)
41
- // console.log('5️⃣ toCell', toCell)
42
- if (fromCell !== toCell && (fromCell.type.name === 'tableCell' || fromCell.type.name === 'tableHeader')) {
43
- return true;
44
- }
45
- }
46
- }
47
- return false;
33
+ // if (selection.from !== selection.to) {
34
+ // const resolvedFrom = editor.state.doc.resolve(selection.from);
35
+ // const resolvedTo = editor.state.doc.resolve(selection.to);
36
+ // console.log('4️⃣ resolvedFrom.nodeAfter', resolvedFrom.nodeAfter)
37
+ // console.log('4️⃣ resolvedTo.nodeBefore', resolvedTo.nodeBefore)
38
+ // if (resolvedFrom.nodeAfter && resolvedTo.nodeBefore) {
39
+ // const fromCell = resolvedFrom.node();
40
+ // const toCell = resolvedTo.node();
41
+ // console.log('5️⃣ fromCell', fromCell)
42
+ // console.log('5️⃣ toCell', toCell)
43
+ // if (fromCell !== toCell && (fromCell.type.name === 'tableCell' || fromCell.type.name === 'tableHeader')) {
44
+ // return true;
45
+ // }
46
+ // }
47
+ // }
48
+ // return false;
48
49
  };
49
50
  var isClickedCellInSelection = function isClickedCellInSelection(editor, clickedElement) {
50
51
  var selection = editor.state.selection;
@@ -179,7 +180,7 @@ export var createTableContextMenuPlugin = function createTableContextMenuPlugin(
179
180
  commandExecuted = false;
180
181
  preventSelectionLoss = false;
181
182
  };
182
- var showContextMenu = function showContextMenu(anchorEl, hasMultipleSelection) {
183
+ var showContextMenu = function showContextMenu(anchorEl, hasMultipleSelection, hasMultipleCellElements) {
183
184
  // console.log('🍊 showContextMenu', anchorEl, 'hasMultipleSelection', hasMultipleSelection)
184
185
  var _createMenuContainer = createMenuContainer(),
185
186
  root = _createMenuContainer.root;
@@ -199,6 +200,7 @@ export var createTableContextMenuPlugin = function createTableContextMenuPlugin(
199
200
  }, /*#__PURE__*/React.createElement(TableContextMenu, {
200
201
  editor: editor,
201
202
  hasMultipleSelection: hasMultipleSelection,
203
+ hasMultipleCellElements: hasMultipleCellElements,
202
204
  onClose: handleClose,
203
205
  onCommandExecute: handleCommandExecute
204
206
  })));
@@ -233,6 +235,7 @@ export var createTableContextMenuPlugin = function createTableContextMenuPlugin(
233
235
  event.preventDefault();
234
236
  event.stopPropagation();
235
237
  var cellElement = getTableCell(target);
238
+ console.log('🍊 cellElement', cellElement === null || cellElement === void 0 ? void 0 : cellElement.getAttribute('colspan'), cellElement === null || cellElement === void 0 ? void 0 : cellElement.getAttribute('rowspan'));
236
239
  if (!cellElement) {
237
240
  preventSelectionLoss = false;
238
241
  return false;
@@ -246,8 +249,9 @@ export var createTableContextMenuPlugin = function createTableContextMenuPlugin(
246
249
  }, 50);
247
250
  }
248
251
  var hasMultipleSelection = savedSelection ? true : hasMultipleCellSelection(editor);
252
+ var hasMultipleCellElements = (cellElement === null || cellElement === void 0 ? void 0 : cellElement.getAttribute('colspan')) && parseInt(cellElement.getAttribute('colspan') || '1') > 1 || (cellElement === null || cellElement === void 0 ? void 0 : cellElement.getAttribute('rowspan')) && parseInt(cellElement.getAttribute('rowspan') || '1') > 1 || false;
249
253
  // console.log('🍊 contextmenu hasMultipleSelection', hasMultipleSelection)
250
- showContextMenu(cellElement, hasMultipleSelection);
254
+ showContextMenu(cellElement, hasMultipleSelection, hasMultipleCellElements);
251
255
  preventSelectionLoss = false;
252
256
  return true;
253
257
  },
@@ -1,5 +1,5 @@
1
1
  import { Extension } from '@tiptap/core';
2
2
  export declare const TableExtension: ({ editable }: {
3
3
  editable: boolean;
4
- }) => (import("@tiptap/core").Node<import("@tiptap/extension-table").TableOptions, any> | import("@tiptap/core").Node<import("@tiptap/extension-table").TableHeaderOptions, any> | Extension<any, any>)[];
4
+ }) => (Extension<any, any> | import("@tiptap/core").Node<import("@tiptap/extension-table").TableOptions, any> | import("@tiptap/core").Node<import("@tiptap/extension-table").TableHeaderOptions, any>)[];
5
5
  export default TableExtension;
package/dist/index.css CHANGED
@@ -369,6 +369,11 @@
369
369
  line-height: 24px;
370
370
  }
371
371
 
372
+ .tiptap.ProseMirror table th *,
373
+ .tiptap.ProseMirror table td * {
374
+ word-break: break-all;
375
+ }
376
+
372
377
  /* 表格单元格基础样式 */
373
378
  .tiptap.ProseMirror table td,
374
379
  .tiptap.ProseMirror table th {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ctzhian/tiptap",
3
- "version": "1.7.0",
3
+ "version": "1.7.2",
4
4
  "description": "基于 Tiptap 二次开发的编辑器组件",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",