@progress/kendo-editor-common 1.9.0-dev.202204081457 → 1.9.0-dev.202204180753

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.
Files changed (33) hide show
  1. package/dist/cdn/js/kendo-editor-common.js +2 -2
  2. package/dist/cdn/main.js +1 -1
  3. package/dist/es/config/constants.js +2 -1
  4. package/dist/es/plugins/image-resize.js +4 -14
  5. package/dist/es/plugins/resize-utils.js +11 -0
  6. package/dist/es/plugins/table-resize/column-resize.js +28 -49
  7. package/dist/es/plugins/table-resize/row-resize.js +40 -54
  8. package/dist/es/plugins/table-resize/table-resize.js +38 -64
  9. package/dist/es/plugins/table-resize/table-view.js +9 -9
  10. package/dist/es/plugins/table-resize/utils.js +26 -2
  11. package/dist/es2015/config/constants.js +2 -1
  12. package/dist/es2015/plugins/image-resize.js +4 -14
  13. package/dist/es2015/plugins/resize-utils.js +11 -0
  14. package/dist/es2015/plugins/table-resize/column-resize.js +28 -49
  15. package/dist/es2015/plugins/table-resize/row-resize.js +40 -54
  16. package/dist/es2015/plugins/table-resize/table-resize.js +40 -66
  17. package/dist/es2015/plugins/table-resize/table-view.js +9 -9
  18. package/dist/es2015/plugins/table-resize/utils.js +26 -2
  19. package/dist/npm/config/constants.d.ts +2 -1
  20. package/dist/npm/config/constants.js +2 -1
  21. package/dist/npm/plugins/image-resize.js +6 -16
  22. package/dist/npm/plugins/resize-utils.d.ts +35 -0
  23. package/dist/npm/plugins/resize-utils.js +13 -0
  24. package/dist/npm/plugins/table-resize/column-resize.js +28 -49
  25. package/dist/npm/plugins/table-resize/row-resize.js +39 -53
  26. package/dist/npm/plugins/table-resize/table-resize.d.ts +2 -4
  27. package/dist/npm/plugins/table-resize/table-resize.js +37 -63
  28. package/dist/npm/plugins/table-resize/table-view.d.ts +7 -7
  29. package/dist/npm/plugins/table-resize/table-view.js +8 -8
  30. package/dist/npm/plugins/table-resize/utils.d.ts +10 -0
  31. package/dist/npm/plugins/table-resize/utils.js +29 -2
  32. package/dist/systemjs/kendo-editor-common.js +1 -1
  33. package/package.json +1 -1
@@ -13,7 +13,7 @@ var TableRowView = /** @class */ (function () {
13
13
  return TableRowView;
14
14
  }());
15
15
  function rowResizing() {
16
- var handleWidth = 5, rowMinHeight = 25, lastRowResizable = true;
16
+ var handleWidth = 5;
17
17
  var plugin = new prosemirror_state_1.Plugin({
18
18
  key: utils_1.tableRowResizing,
19
19
  state: {
@@ -36,7 +36,7 @@ function rowResizing() {
36
36
  handleDOMEvents: {
37
37
  mousemove: function (view, event) {
38
38
  if (!utils_1.otherResizing(utils_1.tableRowResizing, view.state)) {
39
- handleMouseMove(view, event, handleWidth, rowMinHeight, lastRowResizable);
39
+ handleMouseMove(view, event, handleWidth);
40
40
  }
41
41
  return false;
42
42
  },
@@ -45,7 +45,7 @@ function rowResizing() {
45
45
  return false;
46
46
  },
47
47
  mousedown: function (view, event) {
48
- return handleMouseDown(view, event, rowMinHeight);
48
+ return handleMouseDown(view, event);
49
49
  }
50
50
  },
51
51
  decorations: function (state) {
@@ -79,7 +79,7 @@ var ResizeState = /** @class */ (function () {
79
79
  if (action && action.setDragging !== undefined) {
80
80
  return new ResizeState(state.activeHandle, action.setDragging);
81
81
  }
82
- if (state.activeHandle > -1) { // && tr.docChanged
82
+ if (state.activeHandle > -1) {
83
83
  var handle = tr.mapping.map(state.activeHandle, -1);
84
84
  if (!pointsAtCell(tr.doc.resolve(handle))) {
85
85
  handle = null;
@@ -90,30 +90,22 @@ var ResizeState = /** @class */ (function () {
90
90
  };
91
91
  return ResizeState;
92
92
  }());
93
- function handleMouseMove(view, event, handleWidth, _rowMinHeight, lastRowResizable) {
93
+ function handleMouseMove(view, event, handleWidth) {
94
94
  var pluginState = utils_1.tableRowResizing.getState(view.state);
95
95
  if (!pluginState.dragging) {
96
- var target = domCellAround(event.target), cell = -1;
96
+ var target = utils_1.domCellAround(event.target), row = -1;
97
97
  if (target) {
98
98
  var rowDom = target.parentNode;
99
99
  var domRect = rowDom.getBoundingClientRect();
100
- if (event.clientY - domRect.top <= handleWidth) {
101
- cell = edgeCell(view, event, 'up');
100
+ if (Math.abs(event.clientY - domRect.top) <= handleWidth && rowDom.rowIndex > 0) {
101
+ row = edgeRow(view, event, rowDom.rowIndex - 1);
102
102
  }
103
- else if (domRect.bottom - event.clientY <= handleWidth) {
104
- cell = edgeCell(view, event, 'down');
103
+ else if (domRect.bottom - event.clientY > 0 && domRect.bottom - event.clientY <= handleWidth) {
104
+ row = edgeRow(view, event, rowDom.rowIndex);
105
105
  }
106
106
  }
107
- if (cell !== pluginState.activeHandle) {
108
- if (!lastRowResizable && cell !== -1) {
109
- // let $cell = view.state.doc.resolve(cell);
110
- // let table = $cell.node(-1), map = TableMap.get(table), start = $cell.start(-1);
111
- // let col = map.colCount($cell.pos - start) + $cell.nodeAfter.attrs.colspan - 1;
112
- // if (col === map.width - 1) {
113
- // return;
114
- // }
115
- }
116
- updateHandle(view, cell);
107
+ if (row !== pluginState.activeHandle) {
108
+ updateHandle(view, row);
117
109
  }
118
110
  }
119
111
  }
@@ -123,7 +115,7 @@ function handleMouseLeave(view) {
123
115
  updateHandle(view, -1);
124
116
  }
125
117
  }
126
- function handleMouseDown(view, event, rowMinHeight) {
118
+ function handleMouseDown(view, event) {
127
119
  var pluginState = utils_1.tableRowResizing.getState(view.state);
128
120
  if (pluginState.activeHandle === -1 || pluginState.dragging) {
129
121
  return false;
@@ -151,7 +143,7 @@ function handleMouseDown(view, event, rowMinHeight) {
151
143
  var curPluginState = utils_1.tableRowResizing.getState(view.state);
152
144
  if (curPluginState.dragging) {
153
145
  var tr = view.state.tr.setMeta(utils_1.tableRowResizing, { setDragging: null });
154
- updateRowHeight(view, tr, curPluginState.activeHandle, draggedHeight(curPluginState.dragging, ev, rowMinHeight));
146
+ updateRowHeight(view, tr, curPluginState.activeHandle);
155
147
  view.dispatch(tr);
156
148
  }
157
149
  }
@@ -160,54 +152,45 @@ function handleMouseDown(view, event, rowMinHeight) {
160
152
  return finish(ev);
161
153
  }
162
154
  var curPluginState = utils_1.tableRowResizing.getState(view.state);
163
- var dragged = draggedHeight(curPluginState.dragging, ev, rowMinHeight);
155
+ var dragged = draggedHeight(curPluginState.dragging, ev);
164
156
  var offset = ev.clientY - curPluginState.dragging.startY;
165
- displayRowHeight(view, curPluginState.activeHandle, dragged, rowMinHeight, offset, tableHeight);
157
+ displayRowHeight(view, curPluginState.activeHandle, dragged, offset, tableHeight);
166
158
  }
167
159
  event.view.addEventListener('mouseup', finish);
168
160
  event.view.addEventListener('mousemove', move);
169
161
  event.preventDefault();
170
162
  return true;
171
163
  }
172
- function domCellAround(target) {
173
- while (target && target.nodeName !== 'TD' && target.nodeName !== 'TH') {
174
- target = target.classList.contains('ProseMirror') ? null : target.parentNode;
175
- }
176
- return target;
177
- }
178
- function edgeCell(view, event, side) {
164
+ function edgeRow(view, event, rowIndex) {
179
165
  var found = view.posAtCoords({ left: event.clientX, top: event.clientY });
180
166
  if (!found) {
181
167
  return -1;
182
168
  }
183
- var pos = found.pos;
184
- var doc = view.state.doc;
185
- var $pos = doc.resolve(pos);
186
- var rowDepth = new Array($pos.depth + 1).fill(0).findIndex(function (_, i) { return $pos.node(i).type.spec.tableRole === 'row'; });
187
- if (rowDepth === -1) {
188
- return -1;
189
- }
190
- var tableDepth = rowDepth - 1;
191
- var rowIndex = $pos.index(tableDepth);
192
- rowIndex += side === 'up' ? -1 : 0;
193
- if (rowIndex < 0) {
169
+ var $pos = view.state.doc.resolve(found.pos);
170
+ var parentTable = utils_1.parentNode($pos, function (n) { return n.type.spec.tableRole === 'table'; });
171
+ if (parentTable === null) {
194
172
  return -1;
195
173
  }
196
- var rowPos = $pos.posAtIndex(rowIndex, tableDepth);
197
- return rowPos;
174
+ var tablePos = $pos.start(parentTable.depth);
175
+ var tableNode = parentTable.node;
176
+ var map = prosemirror_tables_1.TableMap.get(tableNode);
177
+ var row = tablePos + map.map[(map.width * rowIndex)] - 1;
178
+ return row;
198
179
  }
199
- function draggedHeight(dragging, event, rowMinHeight) {
180
+ function draggedHeight(dragging, event) {
200
181
  var offset = event.clientY - dragging.startY;
201
- return Math.max(rowMinHeight, dragging.startHeight.rowHeight + offset);
182
+ return dragging.startHeight.rowHeight + offset;
202
183
  }
203
184
  function updateHandle(view, value) {
204
185
  view.dispatch(view.state.tr.setMeta(utils_1.tableRowResizing, { setHandle: value }));
205
186
  }
206
- function updateRowHeight(view, tr, rowPos, height) {
187
+ function updateRowHeight(view, tr, rowPos) {
207
188
  var doc = view.state.doc;
208
189
  var row = doc.nodeAt(rowPos);
209
- tr.setNodeMarkup(rowPos, null, utils_1.setNodeStyle(row.attrs, 'height', height + 'px'));
210
190
  var dom = view.nodeDOM(rowPos);
191
+ var win = (dom.ownerDocument && dom.ownerDocument.defaultView) || window;
192
+ dom.style.height = win.getComputedStyle(dom).height;
193
+ tr.setNodeMarkup(rowPos, null, utils_1.setNodeStyle(row.attrs, 'height', dom.style.height));
211
194
  var table = dom && dom.closest('table');
212
195
  var tableHeight = table && table.style.height;
213
196
  if (tableHeight) {
@@ -216,29 +199,32 @@ function updateRowHeight(view, tr, rowPos, height) {
216
199
  tr.setNodeMarkup(tablePos, null, utils_1.setNodeStyle($pos.parent.attrs, 'height', tableHeight));
217
200
  }
218
201
  }
219
- // tslint:disable-next-line:max-line-length
220
- function displayRowHeight(view, rowPos, height, rowMinHeight, offset, tableHeight) {
202
+ function displayRowHeight(view, rowPos, height, offset, tableHeight) {
221
203
  var dom = view.nodeDOM(rowPos);
222
204
  if (dom) {
223
- dom.style.height = Math.max(height, rowMinHeight) + 'px';
205
+ dom.style.height = height + 'px';
206
+ var win = (dom.ownerDocument && dom.ownerDocument.defaultView) || window;
207
+ dom.style.height = win.getComputedStyle(dom).height;
224
208
  var table = dom.closest('table');
225
209
  var newHeight = (parseFloat(tableHeight) + offset) + 'px';
226
210
  var current = table && table.style.height;
227
211
  if (current && current !== newHeight) {
228
212
  table.style.height = (parseFloat(tableHeight) + offset) + 'px';
213
+ table.style.height = win.getComputedStyle(table).height;
229
214
  }
230
215
  }
231
216
  }
232
217
  function handleDecorations(state, pos) {
233
218
  var decorations = [];
234
219
  if (typeof pos !== 'number') {
235
- return;
220
+ return prosemirror_view_1.DecorationSet.empty;
236
221
  }
237
222
  var $row = state.doc.resolve(pos), table = $row.parent, map = prosemirror_tables_1.TableMap.get(table), rowIndex = $row.index($row.depth), start = $row.start($row.depth);
238
223
  for (var col = 0; col < map.width; col++) {
239
224
  var index = col + rowIndex * map.width;
240
225
  var cellPos = map.map[index];
241
- var widgetPos = start + cellPos + table.nodeAt(cellPos).nodeSize - 1;
226
+ var cell = table.nodeAt(cellPos);
227
+ var widgetPos = start + cellPos + (cell ? cell.nodeSize : 0) - 1;
242
228
  var dom = document.createElement('div');
243
229
  dom.className = 'row-resize-handle';
244
230
  decorations.push(prosemirror_view_1.Decoration.widget(widgetPos, dom));
@@ -1,6 +1,4 @@
1
1
  import { Plugin } from 'prosemirror-state';
2
- export interface NodeResizeOptions {
2
+ export declare const tableResizing: (options?: {
3
3
  node: string;
4
- lockRatio: boolean;
5
- }
6
- export declare const tableResizing: (options?: NodeResizeOptions) => Plugin<any, any>;
4
+ }) => Plugin<any, any>;
@@ -4,25 +4,7 @@ var tslib_1 = require("tslib");
4
4
  var prosemirror_state_1 = require("prosemirror-state");
5
5
  var constants_1 = require("../../config/constants");
6
6
  var utils_1 = require("./utils");
7
- function parentNode(pos, predicate) {
8
- for (var d = pos.depth; d > 0; d--) {
9
- var node = pos.node(d);
10
- if (predicate(node)) {
11
- return node;
12
- }
13
- }
14
- return null;
15
- }
16
- var directions = {
17
- 'southeast': { x: 1, y: 1 },
18
- 'east': { x: 1, y: 0 },
19
- 'south': { x: 0, y: 1 },
20
- 'north': { x: 0, y: -1 },
21
- 'west': { x: -1, y: 0 },
22
- 'southwest': { x: -1, y: 1 },
23
- 'northwest': { x: -1, y: -1 },
24
- 'northeast': { x: 1, y: -1 } // top right
25
- };
7
+ var resize_utils_1 = require("./../resize-utils");
26
8
  var commonDir = {
27
9
  'southeast': true,
28
10
  'southwest': true,
@@ -31,9 +13,6 @@ var commonDir = {
31
13
  };
32
14
  var horizontalDir = tslib_1.__assign({ 'east': true, 'west': true }, commonDir);
33
15
  var verticalDir = tslib_1.__assign({ 'south': true, 'north': true }, commonDir);
34
- var setSize = function (domNode, sizeType, value) {
35
- domNode.style[sizeType] = value + 'px';
36
- };
37
16
  var ResizeState = /** @class */ (function () {
38
17
  function ResizeState(activeHandle, dragging, nodePosition) {
39
18
  this.activeHandle = activeHandle;
@@ -50,73 +29,62 @@ var ResizeState = /** @class */ (function () {
50
29
  };
51
30
  return ResizeState;
52
31
  }());
53
- var handleMouseMove = function (view, event, options) {
32
+ var handleMouseMove = function (view, event) {
54
33
  var state = utils_1.tableResizeKey.getState(view.state);
55
34
  var dragging = state.dragging, nodePosition = state.nodePosition, activeHandle = state.activeHandle;
56
35
  if (nodePosition < 0 || !dragging) {
57
36
  return;
58
37
  }
59
- var resizedNode = utils_1.getTable(view.nodeDOM(nodePosition));
60
- var rect = resizedNode.getBoundingClientRect();
61
- var dir = directions[activeHandle];
38
+ var tableDom = utils_1.getTable(view.nodeDOM(nodePosition));
39
+ var rect = tableDom.getBoundingClientRect();
40
+ var dir = resize_utils_1.directions[activeHandle];
62
41
  var diffX = (event.clientX - dragging.startX) * dir.x;
63
42
  var diffY = (event.clientY - dragging.startY) * dir.y;
64
- var nodeWidth = resizedNode.offsetWidth;
65
- var nodeHeight = resizedNode.offsetHeight;
43
+ var win = (tableDom.ownerDocument && tableDom.ownerDocument.defaultView) || window;
44
+ var compStyles = win.getComputedStyle(tableDom);
45
+ var nodeWidth = /px/.test(compStyles.width) ? parseFloat(compStyles.width) : tableDom.offsetWidth;
46
+ var nodeHeight = /px/.test(compStyles.height) ? parseFloat(compStyles.height) : tableDom.offsetHeight;
66
47
  var width = dir.x ? diffX + nodeWidth : rect.width;
67
48
  var height = dir.y ? diffY + nodeHeight : rect.height;
68
- if (options.lockRatio && dir.x && dir.y) {
69
- var ratio = Math.min(width / nodeWidth, height / nodeHeight);
70
- var lockWidth = nodeWidth * ratio;
71
- var lockHeight = nodeHeight * ratio;
72
- dragging.startX = event.clientX - (width - lockWidth) * dir.x;
73
- dragging.startY = event.clientY - (height - lockHeight) * dir.y;
74
- width = lockWidth;
75
- height = lockHeight;
76
- }
77
- else {
78
- dragging.startX = dir.x ? event.clientX : dragging.startX;
79
- dragging.startY = dir.y ? event.clientY : dragging.startY;
80
- }
49
+ dragging.startX = dir.x ? event.clientX : dragging.startX;
50
+ dragging.startY = dir.y ? event.clientY : dragging.startY;
81
51
  if (horizontalDir[activeHandle]) {
82
- setSize(resizedNode, 'width', width);
52
+ tableDom.style.width = width + 'px';
83
53
  }
84
54
  if (verticalDir[activeHandle]) {
85
- setSize(resizedNode, 'height', height);
55
+ tableDom.style.height = height + 'px';
86
56
  }
87
57
  };
88
58
  var toPercents = function (view, tr, tablePos) {
89
59
  var tableNode = view.state.doc.nodeAt(tablePos);
90
60
  var tableDom = utils_1.getTable(view.nodeDOM(tablePos));
91
- var _a = tableSize(tableDom), tableWidth = _a.width, tableHeight = _a.height, colsWidth = _a.colsWidth;
61
+ var _a = tableSize(tableDom), width = _a.width, height = _a.height, colsWidth = _a.colsWidth, rowsHeight = _a.rowsHeight, offsetWidth = _a.offsetWidth, offsetHeight = _a.offsetHeight;
92
62
  var colgroup = tableDom.firstChild;
93
63
  var cols = Array.from((colgroup && colgroup.children) || []);
94
- // const borders = new Array(cols.length).fill(tableWidth / tableOffsetWidth / cols.length);
95
64
  var widthChanged = false;
96
65
  cols.forEach(function (col, i) {
97
66
  if (col.style.width && !/%$/.test(col.style.width)) {
98
- col.style.width = ((colsWidth[i]) * 100 / tableWidth) + '%';
67
+ col.style.width = ((colsWidth[i]) * 100 / width) + '%';
99
68
  widthChanged = true;
100
69
  }
101
70
  });
102
- var rows = Array.from(tableDom.rows);
103
71
  var heightChange = false;
104
72
  tableNode.forEach(function (row, offset, index) {
105
73
  var rowHeight = utils_1.parseStyle(row.attrs.style).height;
106
74
  if (rowHeight && !/%$/.test(rowHeight)) {
107
- tr.setNodeMarkup(tablePos + offset + 1, null, utils_1.setNodeStyle(row.attrs, 'height', (rows[index].offsetHeight * 100 / tableHeight) + '%'));
75
+ tr.setNodeMarkup(tablePos + offset + 1, null, utils_1.setNodeStyle(row.attrs, 'height', (rowsHeight[index] * 100 / height) + '%'));
108
76
  heightChange = true;
109
77
  }
110
78
  });
111
79
  var tableAttrs = tableNode.attrs;
112
- if (utils_1.parseStyle(tableAttrs.style).width !== tableWidth + 'px') {
113
- tableAttrs = utils_1.setNodeStyle(tableAttrs, 'width', tableWidth + 'px');
80
+ if (utils_1.parseStyle(tableAttrs.style).width !== offsetWidth + 'px') {
81
+ tableAttrs = utils_1.setNodeStyle(tableAttrs, 'width', offsetWidth + 'px');
114
82
  }
115
83
  if (widthChanged) {
116
84
  tableAttrs[constants_1.colgroupAttr] = colgroup.outerHTML;
117
85
  }
118
86
  if (heightChange) {
119
- tableAttrs = utils_1.setNodeStyle(tableAttrs, 'height', tableHeight + 'px');
87
+ tableAttrs = utils_1.setNodeStyle(tableAttrs, 'height', offsetHeight + 'px');
120
88
  }
121
89
  if (widthChanged || heightChange) {
122
90
  tr.setNodeMarkup(tablePos, null, tableAttrs);
@@ -125,11 +93,13 @@ var toPercents = function (view, tr, tablePos) {
125
93
  var toPixels = function (view, tr, tablePos, attrs) {
126
94
  var tableNode = view.state.doc.nodeAt(tablePos);
127
95
  var tableDom = utils_1.getTable(view.nodeDOM(tablePos));
96
+ var win = (tableDom.ownerDocument && tableDom.ownerDocument.defaultView) || window;
97
+ var calcStyle = win.getComputedStyle;
128
98
  var rows = Array.from(tableDom.rows);
129
99
  tableNode.forEach(function (row, offset, index) {
130
100
  var rowHeight = utils_1.parseStyle(row.attrs.style).height;
131
101
  if (rowHeight && !/px$/.test(rowHeight)) {
132
- tr.setNodeMarkup(tablePos + offset + 1, null, utils_1.setNodeStyle(row.attrs, 'height', rows[index].offsetHeight + 'px'));
102
+ tr.setNodeMarkup(tablePos + offset + 1, null, utils_1.setNodeStyle(row.attrs, 'height', calcStyle(rows[index]).height));
133
103
  }
134
104
  });
135
105
  var colgroup = tableDom.firstChild;
@@ -137,7 +107,7 @@ var toPixels = function (view, tr, tablePos, attrs) {
137
107
  var widthChanged = false;
138
108
  cols.forEach(function (col, i) {
139
109
  if (col.style.width && !/px$/.test(col.style.width)) {
140
- col.style.width = cols[i].offsetWidth + 'px';
110
+ col.style.width = calcStyle(cols[i]).width;
141
111
  widthChanged = true;
142
112
  }
143
113
  });
@@ -150,9 +120,12 @@ var toPixels = function (view, tr, tablePos, attrs) {
150
120
  var tableSize = function (table) {
151
121
  var cols = Array.from(table.firstChild.children);
152
122
  var colsWidth = cols.map(function (c) { return c.offsetWidth; });
123
+ var rowsHeight = Array.from(table.rows).map(function (row) { return row.offsetHeight; });
153
124
  var width = colsWidth.reduce(function (acc, cur) { return acc + cur; }, 0);
154
- var height = table.offsetHeight; // Array.from(table.rows).reduce((acc, cur) => acc + cur.offsetHeight, 0);
155
- return { width: width, height: height, colsWidth: colsWidth, offsetWidth: table.offsetWidth };
125
+ var height = rowsHeight.reduce(function (acc, cur) { return acc + cur; }, 0);
126
+ var offsetHeight = table.offsetHeight;
127
+ var offsetWidth = table.offsetWidth;
128
+ return { width: width, height: height, colsWidth: colsWidth, rowsHeight: rowsHeight, offsetWidth: offsetWidth, offsetHeight: offsetHeight };
156
129
  };
157
130
  var handleMouseUp = function (view) {
158
131
  var _a = utils_1.tableResizeKey.getState(view.state), dragging = _a.dragging, nodePosition = _a.nodePosition, activeHandle = _a.activeHandle;
@@ -162,7 +135,7 @@ var handleMouseUp = function (view) {
162
135
  var rect = tableSize(dom);
163
136
  if (node) {
164
137
  var width = rect.offsetWidth + 'px';
165
- var height = rect.height + 'px';
138
+ var height = rect.offsetHeight + 'px';
166
139
  var tr = view.state.tr;
167
140
  var attrs = node.attrs;
168
141
  var parsedStyles = utils_1.parseStyle(attrs.style);
@@ -172,7 +145,7 @@ var handleMouseUp = function (view) {
172
145
  if (verticalDir[activeHandle] && dom.style.height && parsedStyles.height !== height) {
173
146
  attrs = utils_1.setNodeStyle(attrs, 'height', height);
174
147
  }
175
- toPixels(view, tr, nodePosition, attrs);
148
+ attrs = toPixels(view, tr, nodePosition, attrs);
176
149
  tr.setNodeMarkup(nodePosition, null, attrs);
177
150
  tr.setMeta('commandName', 'node-resize');
178
151
  tr.setMeta('args', attrs);
@@ -185,9 +158,9 @@ var handleMouseUp = function (view) {
185
158
  }
186
159
  }
187
160
  };
188
- var handleMouseDown = function (view, event, options) {
161
+ var handleMouseDown = function (view, event) {
189
162
  var target = event.target;
190
- var activeHandle = target.getAttribute(constants_1.dataDirection);
163
+ var activeHandle = target.getAttribute(constants_1.dataResizeDirTable);
191
164
  if (!activeHandle) {
192
165
  return false;
193
166
  }
@@ -204,7 +177,7 @@ var handleMouseDown = function (view, event, options) {
204
177
  view.dispatch(transaction);
205
178
  var curWindow = event.view || window;
206
179
  function move(e) {
207
- handleMouseMove(view, e, options);
180
+ handleMouseMove(view, e);
208
181
  }
209
182
  function finish(_e) {
210
183
  curWindow.removeEventListener('mouseup', finish);
@@ -216,7 +189,7 @@ var handleMouseDown = function (view, event, options) {
216
189
  return true;
217
190
  };
218
191
  exports.tableResizing = function (options) {
219
- if (options === void 0) { options = { node: 'table', lockRatio: false }; }
192
+ if (options === void 0) { options = { node: 'table' }; }
220
193
  return new prosemirror_state_1.Plugin({
221
194
  key: utils_1.tableResizeKey,
222
195
  view: function (_viewObj) { return ({
@@ -226,7 +199,8 @@ exports.tableResizing = function (options) {
226
199
  if (isNodeSelected && selection instanceof prosemirror_state_1.NodeSelection) {
227
200
  return { node: selection.node, pos: selection.from };
228
201
  }
229
- var node = parentNode(selection.$from, function (n) { return n.type === nodeType; });
202
+ var parent = utils_1.parentNode(selection.$from, function (n) { return n.type === nodeType; });
203
+ var node = parent && parent.node;
230
204
  if (node) {
231
205
  var tableDepth = new Array(selection.$from.depth + 1).fill(0)
232
206
  .findIndex(function (_, i) { return selection.$from.node(i).type.spec.tableRole === 'table'; });
@@ -275,7 +249,7 @@ exports.tableResizing = function (options) {
275
249
  props: {
276
250
  handleDOMEvents: {
277
251
  mousedown: function (view, event) {
278
- return handleMouseDown(view, event, options);
252
+ return handleMouseDown(view, event);
279
253
  }
280
254
  }
281
255
  }
@@ -1,13 +1,13 @@
1
1
  import { Node } from 'prosemirror-model';
2
2
  import { EditorView } from 'prosemirror-view';
3
3
  export declare class TableView {
4
- node: Node;
5
- view: EditorView;
6
- table: HTMLTableElement;
7
- colgroup: HTMLTableColElement;
8
- dom: HTMLElement;
9
- contentDOM: HTMLElement;
10
- private resizeHandles;
4
+ node?: Node;
5
+ view?: EditorView;
6
+ table?: HTMLTableElement;
7
+ colgroup?: HTMLTableColElement;
8
+ dom?: HTMLElement;
9
+ contentDOM?: HTMLElement;
10
+ private resizeHandles?;
11
11
  constructor(node: Node, view: EditorView);
12
12
  update(node: Node): boolean;
13
13
  ignoreMutation(record: MutationRecord): boolean;
@@ -2,7 +2,7 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  var constants_1 = require("../../config/constants");
4
4
  var schema_1 = require("../../config/schema");
5
- var directions = ['northwest', 'north', 'northeast', 'southwest', 'south', 'southeast', 'west', 'east'];
5
+ var resize_utils_1 = require("./../resize-utils");
6
6
  var TableView = /** @class */ (function () {
7
7
  function TableView(node, view) {
8
8
  this.node = node;
@@ -15,10 +15,10 @@ var TableView = /** @class */ (function () {
15
15
  }
16
16
  var tBody = this.table.appendChild(document.createElement('tbody'));
17
17
  this.setAttributes(this.table, node.attrs);
18
- this.resizeHandles = directions.map(function (dir) {
18
+ this.resizeHandles = resize_utils_1.handles.map(function (dir) {
19
19
  var handle = document.createElement('span');
20
20
  handle.className = constants_1.resizeHandle + ' ' + dir;
21
- handle.setAttribute(constants_1.dataDirection, dir);
21
+ handle.setAttribute(constants_1.dataResizeDirTable, dir);
22
22
  return handle;
23
23
  });
24
24
  this.contentDOM = tBody;
@@ -54,11 +54,11 @@ var TableView = /** @class */ (function () {
54
54
  return result;
55
55
  };
56
56
  TableView.prototype.destroy = function () {
57
- this.node = null;
58
- this.view = null;
59
- this.table = null;
60
- this.colgroup = null;
61
- this.resizeHandles = null;
57
+ this.node = undefined;
58
+ this.view = undefined;
59
+ this.table = undefined;
60
+ this.colgroup = undefined;
61
+ this.resizeHandles = undefined;
62
62
  };
63
63
  TableView.prototype.renderColgroup = function (colgroupStr) {
64
64
  if (this.table && this.table.firstChild && this.table.firstChild.nodeName === 'COLGROUP') {
@@ -1,3 +1,4 @@
1
+ import { Node, ResolvedPos } from 'prosemirror-model';
1
2
  import { EditorState, PluginKey } from 'prosemirror-state';
2
3
  export declare const reAnyValue: RegExp;
3
4
  export declare const parseStyle: (styleText: string) => {
@@ -10,3 +11,12 @@ export declare const tableRowResizing: PluginKey<any, any>;
10
11
  export declare function otherResizing(current: PluginKey, state: EditorState): boolean;
11
12
  export declare function otherResizeHandle(current: PluginKey, state: EditorState): boolean;
12
13
  export declare function getTable(dom: HTMLElement): HTMLTableElement;
14
+ export declare function domCellAround(target: any): HTMLTableCellElement | null;
15
+ export declare function cellIndexes(cell: HTMLTableCellElement): {
16
+ cellIndex: number;
17
+ rowIndex: number;
18
+ };
19
+ export declare function parentNode(pos: ResolvedPos, predicate: (node: Node) => boolean): {
20
+ node: Node;
21
+ depth: number;
22
+ } | null;
@@ -44,9 +44,11 @@ exports.otherResizing = otherResizing;
44
44
  function otherResizeHandle(current, state) {
45
45
  var activeResize = false;
46
46
  activeResize = activeResize ||
47
- (current !== exports.tableColumnResizing && exports.tableColumnResizing.get(state) && exports.tableColumnResizing.getState(state).activeHandle > -1);
47
+ (current !== exports.tableColumnResizing &&
48
+ Boolean(exports.tableColumnResizing.get(state)) &&
49
+ exports.tableColumnResizing.getState(state).activeHandle > -1);
48
50
  activeResize = activeResize ||
49
- (current !== exports.tableRowResizing && exports.tableRowResizing.get(state) && exports.tableRowResizing.getState(state).activeHandle > -1);
51
+ (current !== exports.tableRowResizing && Boolean(exports.tableRowResizing.get(state)) && exports.tableRowResizing.getState(state).activeHandle > -1);
50
52
  return activeResize;
51
53
  }
52
54
  exports.otherResizeHandle = otherResizeHandle;
@@ -57,3 +59,28 @@ function getTable(dom) {
57
59
  return dom;
58
60
  }
59
61
  exports.getTable = getTable;
62
+ function domCellAround(target) {
63
+ while (target && target.nodeName !== 'TD' && target.nodeName !== 'TH') {
64
+ target = target.classList.contains('ProseMirror') ? null : target.parentNode;
65
+ }
66
+ return target;
67
+ }
68
+ exports.domCellAround = domCellAround;
69
+ function cellIndexes(cell) {
70
+ var row = cell.parentNode;
71
+ return {
72
+ cellIndex: cell.cellIndex,
73
+ rowIndex: row.rowIndex
74
+ };
75
+ }
76
+ exports.cellIndexes = cellIndexes;
77
+ function parentNode(pos, predicate) {
78
+ for (var depth = pos.depth; depth > 0; depth--) {
79
+ var node = pos.node(depth);
80
+ if (predicate(node)) {
81
+ return { node: node, depth: depth };
82
+ }
83
+ }
84
+ return null;
85
+ }
86
+ exports.parentNode = parentNode;