@atlaskit/editor-plugin-table 7.10.0 → 7.10.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.
- package/CHANGELOG.md +12 -0
- package/dist/cjs/commands/column-resize.js +7 -1
- package/dist/cjs/commands/insert.js +4 -7
- package/dist/cjs/commands/misc.js +10 -3
- package/dist/cjs/nodeviews/TableRow.js +1 -1
- package/dist/cjs/plugin.js +1 -1
- package/dist/cjs/pm-plugins/analytics/plugin.js +17 -22
- package/dist/cjs/pm-plugins/table-resizing/utils/colgroup.js +4 -4
- package/dist/cjs/pm-plugins/table-resizing/utils/misc.js +1 -1
- package/dist/cjs/pm-plugins/table-resizing/utils/resize-column.js +5 -3
- package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js +9 -7
- package/dist/cjs/transforms/column-width.js +3 -1
- package/dist/cjs/ui/TableFloatingControls/RowControls/DragControls.js +19 -6
- package/dist/es2019/commands/column-resize.js +7 -1
- package/dist/es2019/commands/insert.js +4 -7
- package/dist/es2019/commands/misc.js +10 -3
- package/dist/es2019/nodeviews/TableRow.js +1 -1
- package/dist/es2019/plugin.js +1 -1
- package/dist/es2019/pm-plugins/analytics/plugin.js +21 -26
- package/dist/es2019/pm-plugins/table-resizing/utils/colgroup.js +4 -4
- package/dist/es2019/pm-plugins/table-resizing/utils/misc.js +1 -1
- package/dist/es2019/pm-plugins/table-resizing/utils/resize-column.js +5 -3
- package/dist/es2019/pm-plugins/table-resizing/utils/resize-state.js +9 -7
- package/dist/es2019/transforms/column-width.js +3 -1
- package/dist/es2019/ui/TableFloatingControls/RowControls/DragControls.js +19 -6
- package/dist/esm/commands/column-resize.js +7 -1
- package/dist/esm/commands/insert.js +4 -7
- package/dist/esm/commands/misc.js +10 -3
- package/dist/esm/nodeviews/TableRow.js +1 -1
- package/dist/esm/plugin.js +1 -1
- package/dist/esm/pm-plugins/analytics/plugin.js +17 -22
- package/dist/esm/pm-plugins/table-resizing/utils/colgroup.js +4 -4
- package/dist/esm/pm-plugins/table-resizing/utils/misc.js +1 -1
- package/dist/esm/pm-plugins/table-resizing/utils/resize-column.js +5 -3
- package/dist/esm/pm-plugins/table-resizing/utils/resize-state.js +9 -7
- package/dist/esm/transforms/column-width.js +3 -1
- package/dist/esm/ui/TableFloatingControls/RowControls/DragControls.js +19 -6
- package/dist/types/pm-plugins/table-resizing/utils/colgroup.d.ts +1 -1
- package/dist/types/pm-plugins/table-resizing/utils/misc.d.ts +1 -1
- package/dist/types/pm-plugins/table-resizing/utils/resize-column.d.ts +1 -1
- package/dist/types/pm-plugins/table-resizing/utils/resize-state.d.ts +2 -2
- package/dist/types/ui/TableFloatingColumnControls/ColumnControls/index.d.ts +2 -2
- package/dist/types/ui/TableFloatingControls/CornerControls/DragCornerControls.d.ts +4 -4
- package/dist/types/ui/TableFloatingControls/index.d.ts +2 -2
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/colgroup.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/misc.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/resize-column.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/resize-state.d.ts +2 -2
- package/dist/types-ts4.5/ui/TableFloatingColumnControls/ColumnControls/index.d.ts +2 -2
- package/dist/types-ts4.5/ui/TableFloatingControls/CornerControls/DragCornerControls.d.ts +4 -4
- package/dist/types-ts4.5/ui/TableFloatingControls/index.d.ts +2 -2
- package/package.json +8 -8
- package/src/commands/column-resize.ts +11 -3
- package/src/commands/insert.ts +7 -13
- package/src/commands/misc.ts +14 -8
- package/src/nodeviews/TableRow.ts +2 -2
- package/src/plugin.tsx +1 -3
- package/src/pm-plugins/analytics/plugin.ts +24 -33
- package/src/pm-plugins/table-resizing/utils/colgroup.ts +5 -5
- package/src/pm-plugins/table-resizing/utils/misc.ts +2 -2
- package/src/pm-plugins/table-resizing/utils/resize-column.ts +7 -5
- package/src/pm-plugins/table-resizing/utils/resize-state.ts +16 -10
- package/src/transforms/column-width.ts +10 -2
- package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +28 -11
|
@@ -4,6 +4,7 @@ import React, { Fragment, useCallback, useEffect, useMemo, useState } from 'reac
|
|
|
4
4
|
import { injectIntl } from 'react-intl-next';
|
|
5
5
|
import { CellSelection } from '@atlaskit/editor-tables';
|
|
6
6
|
import { getSelectionRect } from '@atlaskit/editor-tables/utils';
|
|
7
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
7
8
|
import { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
|
|
8
9
|
import { clearHoverSelection } from '../../../commands';
|
|
9
10
|
import { toggleDragMenu } from '../../../pm-plugins/drag-and-drop/commands';
|
|
@@ -90,14 +91,26 @@ const DragControlsComponent = ({
|
|
|
90
91
|
}
|
|
91
92
|
}, [editorView, tableActive]);
|
|
92
93
|
const handleMouseMove = useCallback(e => {
|
|
93
|
-
|
|
94
|
-
|
|
94
|
+
if (getBooleanFF('platform.editor.explicit-html-element-check')) {
|
|
95
|
+
const target = e.nativeEvent.target instanceof Element ? e.nativeEvent.target : null;
|
|
96
|
+
const isParentDragControls = target === null || target === void 0 ? void 0 : target.closest(`.${ClassName.DRAG_ROW_CONTROLS}`);
|
|
97
|
+
const rowIndex = target === null || target === void 0 ? void 0 : target.getAttribute('data-start-index');
|
|
95
98
|
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
+
// avoid updating if event target is not related
|
|
100
|
+
if (!isParentDragControls || !rowIndex) {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
updateCellHoverLocation(Number(rowIndex));
|
|
104
|
+
} else {
|
|
105
|
+
const isParentDragControls = e.nativeEvent.target.closest(`.${ClassName.DRAG_ROW_CONTROLS}`);
|
|
106
|
+
const rowIndex = e.nativeEvent.target.getAttribute('data-start-index');
|
|
107
|
+
|
|
108
|
+
// avoid updating if event target is not related
|
|
109
|
+
if (!isParentDragControls || !rowIndex) {
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
updateCellHoverLocation(Number(rowIndex));
|
|
99
113
|
}
|
|
100
|
-
updateCellHoverLocation(Number(rowIndex));
|
|
101
114
|
}, [updateCellHoverLocation]);
|
|
102
115
|
const rowIndexes = useMemo(() => {
|
|
103
116
|
return [rowIndex];
|
|
@@ -176,7 +176,13 @@ export var changeColumnWidthByStep = function changeColumnWidthByStep(_ref4) {
|
|
|
176
176
|
var map = TableMap.get(originalTable);
|
|
177
177
|
var domAtPos = view.domAtPos.bind(view);
|
|
178
178
|
var colIndex = map.colCount($cell.pos - tableStartPosition) + ($cell.nodeAfter ? $cell.nodeAfter.attrs.colspan : 1) - 1;
|
|
179
|
-
var dom =
|
|
179
|
+
var dom = null;
|
|
180
|
+
if (getBooleanFF('platform.editor.explicit-html-element-check')) {
|
|
181
|
+
var domAtPosition = domAtPos(tableStartPosition);
|
|
182
|
+
dom = domAtPosition.node instanceof HTMLTableElement ? domAtPosition.node : null;
|
|
183
|
+
} else {
|
|
184
|
+
dom = domAtPos(tableStartPosition).node;
|
|
185
|
+
}
|
|
180
186
|
if (dom && dom.nodeName !== 'TABLE') {
|
|
181
187
|
dom = dom.closest('table');
|
|
182
188
|
}
|
|
@@ -5,7 +5,6 @@ import { Selection } from '@atlaskit/editor-prosemirror/state';
|
|
|
5
5
|
import { safeInsert } from '@atlaskit/editor-prosemirror/utils';
|
|
6
6
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
7
7
|
import { addColumnAt as addColumnAtPMUtils, addRowAt, findTable, selectedRect } from '@atlaskit/editor-tables/utils';
|
|
8
|
-
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
9
8
|
import { updateRowOrColumnMovedTransform } from '../pm-plugins/analytics/commands';
|
|
10
9
|
import { META_KEYS } from '../pm-plugins/table-analytics';
|
|
11
10
|
import { rescaleColumns } from '../transforms/column-width';
|
|
@@ -37,7 +36,7 @@ export function addColumnAt() {
|
|
|
37
36
|
// [ED-8288] Update colwidths manually to avoid multiple dispatch in TableComponent
|
|
38
37
|
updatedTr = rescaleColumns(isTableScalingEnabled)(table, view)(updatedTr);
|
|
39
38
|
}
|
|
40
|
-
if (
|
|
39
|
+
if (view) {
|
|
41
40
|
updatedTr = updateRowOrColumnMovedTransform({
|
|
42
41
|
type: 'column'
|
|
43
42
|
}, 'addRowOrColumn')(view.state, updatedTr);
|
|
@@ -125,11 +124,9 @@ export var insertRow = function insertRow(row, moveCursorToTheNewRow) {
|
|
|
125
124
|
} else {
|
|
126
125
|
tr.setSelection(selection.map(tr.doc, tr.mapping));
|
|
127
126
|
}
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
}, 'addRowOrColumn')(state, tr);
|
|
132
|
-
}
|
|
127
|
+
updateRowOrColumnMovedTransform({
|
|
128
|
+
type: 'row'
|
|
129
|
+
}, 'addRowOrColumn')(state, tr);
|
|
133
130
|
dispatch(tr);
|
|
134
131
|
}
|
|
135
132
|
return true;
|
|
@@ -188,9 +188,16 @@ export var getTableElementMoveTypeBySlice = function getTableElementMoveTypeBySl
|
|
|
188
188
|
if (slice.content.childCount === 1 && slice.content.firstChild.type === tableRow) {
|
|
189
189
|
return 'row';
|
|
190
190
|
}
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
return
|
|
191
|
+
|
|
192
|
+
// `TableMap.get` can throw if the content is invalid - in which case we should just
|
|
193
|
+
// return undefined
|
|
194
|
+
try {
|
|
195
|
+
var map = TableMap.get(currentTable.node);
|
|
196
|
+
var slicedMap = TableMap.get(slice.content.firstChild);
|
|
197
|
+
return map.width === slicedMap.width ? 'row' : map.height === slicedMap.height ? 'column' : undefined;
|
|
198
|
+
} catch (e) {
|
|
199
|
+
return undefined;
|
|
200
|
+
}
|
|
194
201
|
};
|
|
195
202
|
export var isInsideFirstCellOfRowOrColumn = function isInsideFirstCellOfRowOrColumn(selection, type) {
|
|
196
203
|
var table = findTable(selection);
|
|
@@ -396,7 +396,7 @@ var TableRow = /*#__PURE__*/function (_ref) {
|
|
|
396
396
|
this.focused = isCurrentTableSelected;
|
|
397
397
|
var wrapper = tree.wrapper;
|
|
398
398
|
var tableContainer = wrapper.parentElement;
|
|
399
|
-
var tableContentWrapper = tableContainer.parentElement;
|
|
399
|
+
var tableContentWrapper = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.parentElement;
|
|
400
400
|
var layoutContainer = tableContentWrapper && tableContentWrapper.parentElement;
|
|
401
401
|
if (isCurrentTableSelected) {
|
|
402
402
|
this.colControlsOffset = tableControlsSpacing;
|
package/dist/esm/plugin.js
CHANGED
|
@@ -248,7 +248,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
248
248
|
plugin: function plugin(_ref15) {
|
|
249
249
|
var dispatch = _ref15.dispatch,
|
|
250
250
|
dispatchAnalyticsEvent = _ref15.dispatchAnalyticsEvent;
|
|
251
|
-
return
|
|
251
|
+
return createTableAnalyticsPlugin(dispatch, dispatchAnalyticsEvent);
|
|
252
252
|
}
|
|
253
253
|
}, {
|
|
254
254
|
name: 'tableGetEditorViewReferencePlugin',
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
|
|
2
2
|
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
3
|
-
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
4
3
|
import { countCellsInSlice, getTableElementMoveTypeBySlice, getTableSelectionType, isInsideFirstCellOfRowOrColumn } from '../../commands/misc';
|
|
5
4
|
import { resetRowOrColumnMovedTransform, updateRowOrColumnMoved } from './commands';
|
|
6
5
|
import { createPluginState } from './plugin-factory';
|
|
@@ -34,33 +33,29 @@ export var createPlugin = function createPlugin(dispatch, dispatchAnalyticsEvent
|
|
|
34
33
|
handlePaste: function handlePaste(_ref, event, slice) {
|
|
35
34
|
var state = _ref.state,
|
|
36
35
|
dispatch = _ref.dispatch;
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
var type = getTableElementMoveTypeBySlice(slice, state);
|
|
36
|
+
var schema = state.schema;
|
|
37
|
+
var type = getTableElementMoveTypeBySlice(slice, state);
|
|
40
38
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
}
|
|
45
|
-
var count = countCellsInSlice(slice, schema, type);
|
|
46
|
-
updateRowOrColumnMoved({
|
|
47
|
-
numberOfCells: count,
|
|
48
|
-
type: type
|
|
49
|
-
}, 'pasted')(state, dispatch);
|
|
39
|
+
// if the selection wasn't in the first cell of a row or column, don't count it
|
|
40
|
+
if (!type || !isInsideFirstCellOfRowOrColumn(state.selection, type)) {
|
|
41
|
+
return;
|
|
50
42
|
}
|
|
43
|
+
var count = countCellsInSlice(slice, schema, type);
|
|
44
|
+
updateRowOrColumnMoved({
|
|
45
|
+
numberOfCells: count,
|
|
46
|
+
type: type
|
|
47
|
+
}, 'pasted')(state, dispatch);
|
|
51
48
|
},
|
|
52
49
|
transformCopied: function transformCopied(slice, _ref2) {
|
|
53
50
|
var state = _ref2.state,
|
|
54
51
|
dispatch = _ref2.dispatch;
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
}, 'copyOrCut')(state, dispatch);
|
|
63
|
-
}
|
|
52
|
+
var schema = state.schema;
|
|
53
|
+
var type = getTableSelectionType(state.selection);
|
|
54
|
+
var count = countCellsInSlice(slice, schema, type);
|
|
55
|
+
updateRowOrColumnMoved({
|
|
56
|
+
numberOfCells: count,
|
|
57
|
+
type: type
|
|
58
|
+
}, 'copyOrCut')(state, dispatch);
|
|
64
59
|
return slice;
|
|
65
60
|
}
|
|
66
61
|
}
|
|
@@ -56,13 +56,13 @@ export var generateColgroup = function generateColgroup(table, tableRef) {
|
|
|
56
56
|
export var insertColgroupFromNode = function insertColgroupFromNode(tableRef, table) {
|
|
57
57
|
var isTableScalingEnabled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
58
58
|
var shouldRemove = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
|
|
59
|
-
var colgroup = tableRef.querySelector('colgroup');
|
|
59
|
+
var colgroup = tableRef === null || tableRef === void 0 ? void 0 : tableRef.querySelector('colgroup');
|
|
60
60
|
if (colgroup && shouldRemove) {
|
|
61
|
-
tableRef.removeChild(colgroup);
|
|
61
|
+
tableRef === null || tableRef === void 0 || tableRef.removeChild(colgroup);
|
|
62
62
|
}
|
|
63
|
-
colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef : undefined);
|
|
63
|
+
colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef !== null && tableRef !== void 0 ? tableRef : undefined : undefined);
|
|
64
64
|
if (shouldRemove) {
|
|
65
|
-
tableRef.insertBefore(colgroup, tableRef.firstChild);
|
|
65
|
+
tableRef === null || tableRef === void 0 || tableRef.insertBefore(colgroup, tableRef === null || tableRef === void 0 ? void 0 : tableRef.firstChild);
|
|
66
66
|
}
|
|
67
67
|
return colgroup.children;
|
|
68
68
|
};
|
|
@@ -93,7 +93,7 @@ export var getTableContainerElementWidth = function getTableContainerElementWidt
|
|
|
93
93
|
export var getTableScalingPercent = function getTableScalingPercent(table, tableRef) {
|
|
94
94
|
var _tableRef$parentEleme;
|
|
95
95
|
var tableWidth = getTableContainerElementWidth(table);
|
|
96
|
-
var renderWidth = ((_tableRef$parentEleme = tableRef.parentElement) === null || _tableRef$parentEleme === void 0 ? void 0 : _tableRef$parentEleme.clientWidth) || tableWidth;
|
|
96
|
+
var renderWidth = (tableRef === null || tableRef === void 0 || (_tableRef$parentEleme = tableRef.parentElement) === null || _tableRef$parentEleme === void 0 ? void 0 : _tableRef$parentEleme.clientWidth) || tableWidth;
|
|
97
97
|
// minus 1 here to avoid any 1px scroll in Firefox
|
|
98
98
|
var scalePercent = (renderWidth - 1) / tableWidth;
|
|
99
99
|
scalePercent = Math.max(scalePercent, 1 - MAX_SCALING_PERCENT);
|
|
@@ -17,7 +17,7 @@ export var resizeColumn = function resizeColumn(resizeState, colIndex, amount, t
|
|
|
17
17
|
var _tableRef$closest;
|
|
18
18
|
// when table initially not overflow, but enter overflow, we need to calculate the resize amount by two part, before and after overflow, before overflow should be double, after should not be double.
|
|
19
19
|
var tableWidth = tableRef === null || tableRef === void 0 ? void 0 : tableRef.clientWidth;
|
|
20
|
-
var tableContainerWidth = (_tableRef$closest = tableRef.closest('.resizer-item')) === null || _tableRef$closest === void 0 ? void 0 : _tableRef$closest.clientWidth;
|
|
20
|
+
var tableContainerWidth = tableRef === null || tableRef === void 0 || (_tableRef$closest = tableRef.closest('.resizer-item')) === null || _tableRef$closest === void 0 ? void 0 : _tableRef$closest.clientWidth;
|
|
21
21
|
var isOverflowed = !!(tableWidth && tableContainerWidth && tableWidth > tableContainerWidth);
|
|
22
22
|
resizeAmount = amount * 2;
|
|
23
23
|
if (isOverflowed) {
|
|
@@ -48,11 +48,13 @@ export var resizeColumn = function resizeColumn(resizeState, colIndex, amount, t
|
|
|
48
48
|
};
|
|
49
49
|
var updateTable = function updateTable(resizeAmount, tableRef, tableNode) {
|
|
50
50
|
var currentWidth = getTableContainerElementWidth(tableNode);
|
|
51
|
-
var resizingContainer = tableRef.closest(".".concat(ClassName.TABLE_RESIZER_CONTAINER));
|
|
51
|
+
var resizingContainer = tableRef === null || tableRef === void 0 ? void 0 : tableRef.closest(".".concat(ClassName.TABLE_RESIZER_CONTAINER));
|
|
52
52
|
var resizingItem = resizingContainer === null || resizingContainer === void 0 ? void 0 : resizingContainer.querySelector('.resizer-item');
|
|
53
53
|
if (resizingContainer && resizingItem) {
|
|
54
54
|
var newWidth = "".concat(currentWidth + resizeAmount, "px");
|
|
55
|
-
tableRef
|
|
55
|
+
if (tableRef) {
|
|
56
|
+
tableRef.style.width = newWidth;
|
|
57
|
+
}
|
|
56
58
|
resizingContainer.style.width = newWidth;
|
|
57
59
|
resizingItem.style.width = newWidth;
|
|
58
60
|
}
|
|
@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
4
4
|
import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
|
|
5
5
|
import { tableCellMinWidth, tableNewColumnMinWidth } from '@atlaskit/editor-common/styles';
|
|
6
6
|
import { calcTableColumnWidths } from '@atlaskit/editor-common/utils';
|
|
7
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
7
8
|
import { getSelectedTableInfo } from '../../../utils';
|
|
8
9
|
import { getColWidthFix, hasTableBeenResized, insertColgroupFromNode } from './colgroup';
|
|
9
10
|
import { getCellsRefsInColumn, getColumnStateFromDOM } from './column-state';
|
|
@@ -85,8 +86,8 @@ export var getResizeState = function getResizeState(_ref) {
|
|
|
85
86
|
|
|
86
87
|
// updates Colgroup DOM node with new widths
|
|
87
88
|
export var updateColgroup = function updateColgroup(state, tableRef, tableNode, isTableScalingEnabled) {
|
|
88
|
-
var cols = tableRef.querySelectorAll('col');
|
|
89
|
-
var columnsCount = cols.length;
|
|
89
|
+
var cols = tableRef === null || tableRef === void 0 ? void 0 : tableRef.querySelectorAll('col');
|
|
90
|
+
var columnsCount = cols === null || cols === void 0 ? void 0 : cols.length;
|
|
90
91
|
/**
|
|
91
92
|
updateColgroup will update whole table scale when click the column resize handle, this behavior will affect when table overflowed, when now resize handle been dragged and extend to make table overflowed, table will show overflow. This need to be confirmed because it conflict with how isTableScalingEnabled work.
|
|
92
93
|
We don't want to scale the table when resizing columns, only when viewpoint shrinks the table.
|
|
@@ -98,11 +99,11 @@ export var updateColgroup = function updateColgroup(state, tableRef, tableNode,
|
|
|
98
99
|
return column && !!column.width;
|
|
99
100
|
}) // if width is 0, we dont want to apply that.
|
|
100
101
|
.forEach(function (column, i) {
|
|
101
|
-
var fixedColWidth = getColWidthFix(column.width, columnsCount);
|
|
102
|
+
var fixedColWidth = getColWidthFix(column.width, columnsCount !== null && columnsCount !== void 0 ? columnsCount : 0);
|
|
102
103
|
var scaledWidth = fixedColWidth * scalePercent;
|
|
103
104
|
var finalWidth = Math.max(scaledWidth, tableCellMinWidth);
|
|
104
105
|
// we aren't handling the remaining pixels here when the 48px min width is reached
|
|
105
|
-
if (cols[i]) {
|
|
106
|
+
if (cols !== null && cols !== void 0 && cols[i]) {
|
|
106
107
|
cols[i].style.width = "".concat(finalWidth, "px");
|
|
107
108
|
}
|
|
108
109
|
});
|
|
@@ -111,8 +112,8 @@ export var updateColgroup = function updateColgroup(state, tableRef, tableNode,
|
|
|
111
112
|
return column && !!column.width;
|
|
112
113
|
}) // if width is 0, we dont want to apply that.
|
|
113
114
|
.forEach(function (column, i) {
|
|
114
|
-
if (cols[i]) {
|
|
115
|
-
cols[i].style.width = "".concat(getColWidthFix(column.width, columnsCount), "px");
|
|
115
|
+
if (cols !== null && cols !== void 0 && cols[i]) {
|
|
116
|
+
cols[i].style.width = "".concat(getColWidthFix(column.width, columnsCount !== null && columnsCount !== void 0 ? columnsCount : 0), "px");
|
|
116
117
|
}
|
|
117
118
|
});
|
|
118
119
|
}
|
|
@@ -312,7 +313,8 @@ export var getNewResizeStateFromSelectedColumns = function getNewResizeStateFrom
|
|
|
312
313
|
return;
|
|
313
314
|
}
|
|
314
315
|
var maybeTable = domAtPos(table.start).node;
|
|
315
|
-
var
|
|
316
|
+
var maybeTableElement = maybeTable instanceof HTMLElement ? maybeTable : null;
|
|
317
|
+
var tableRef = getBooleanFF('platform.editor.explicit-html-element-check') ? maybeTableElement === null || maybeTableElement === void 0 ? void 0 : maybeTableElement.closest('table') : maybeTable === null || maybeTable === void 0 ? void 0 : maybeTable.closest('table');
|
|
316
318
|
if (!tableRef) {
|
|
317
319
|
return;
|
|
318
320
|
}
|
|
@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
4
4
|
import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
|
|
5
5
|
import { AttrStep } from '@atlaskit/editor-prosemirror/transform';
|
|
6
6
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
7
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
7
8
|
import { getTableContainerElementWidth, getTableElementWidth, hasTableBeenResized } from '../pm-plugins/table-resizing/utils';
|
|
8
9
|
import { isMinCellWidthTable } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
9
10
|
import { getResizeState } from '../pm-plugins/table-resizing/utils/resize-state';
|
|
@@ -99,7 +100,8 @@ export var rescaleColumns = function rescaleColumns() {
|
|
|
99
100
|
var newTable = tr.doc.nodeAt(table.pos);
|
|
100
101
|
var domAtPos = view.domAtPos.bind(view);
|
|
101
102
|
var maybeTable = domAtPos(table.start).node;
|
|
102
|
-
var
|
|
103
|
+
var maybeTableElement = getBooleanFF('platform.editor.explicit-html-element-check') ? maybeTable instanceof HTMLElement ? maybeTable : null : maybeTable;
|
|
104
|
+
var tableRef = maybeTableElement === null || maybeTableElement === void 0 ? void 0 : maybeTableElement.closest('table');
|
|
103
105
|
if (!tableRef || !newTable) {
|
|
104
106
|
return tr;
|
|
105
107
|
}
|
|
@@ -5,6 +5,7 @@ import React, { Fragment, useCallback, useEffect, useMemo, useState } from 'reac
|
|
|
5
5
|
import { injectIntl } from 'react-intl-next';
|
|
6
6
|
import { CellSelection } from '@atlaskit/editor-tables';
|
|
7
7
|
import { getSelectionRect } from '@atlaskit/editor-tables/utils';
|
|
8
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
8
9
|
import { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
|
|
9
10
|
import { clearHoverSelection } from '../../../commands';
|
|
10
11
|
import { toggleDragMenu } from '../../../pm-plugins/drag-and-drop/commands';
|
|
@@ -90,14 +91,26 @@ var DragControlsComponent = function DragControlsComponent(_ref) {
|
|
|
90
91
|
}
|
|
91
92
|
}, [editorView, tableActive]);
|
|
92
93
|
var handleMouseMove = useCallback(function (e) {
|
|
93
|
-
|
|
94
|
-
|
|
94
|
+
if (getBooleanFF('platform.editor.explicit-html-element-check')) {
|
|
95
|
+
var target = e.nativeEvent.target instanceof Element ? e.nativeEvent.target : null;
|
|
96
|
+
var isParentDragControls = target === null || target === void 0 ? void 0 : target.closest(".".concat(ClassName.DRAG_ROW_CONTROLS));
|
|
97
|
+
var _rowIndex = target === null || target === void 0 ? void 0 : target.getAttribute('data-start-index');
|
|
95
98
|
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
+
// avoid updating if event target is not related
|
|
100
|
+
if (!isParentDragControls || !_rowIndex) {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
updateCellHoverLocation(Number(_rowIndex));
|
|
104
|
+
} else {
|
|
105
|
+
var _isParentDragControls = e.nativeEvent.target.closest(".".concat(ClassName.DRAG_ROW_CONTROLS));
|
|
106
|
+
var _rowIndex2 = e.nativeEvent.target.getAttribute('data-start-index');
|
|
107
|
+
|
|
108
|
+
// avoid updating if event target is not related
|
|
109
|
+
if (!_isParentDragControls || !_rowIndex2) {
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
updateCellHoverLocation(Number(_rowIndex2));
|
|
99
113
|
}
|
|
100
|
-
updateCellHoverLocation(Number(rowIndex));
|
|
101
114
|
}, [updateCellHoverLocation]);
|
|
102
115
|
var rowIndexes = useMemo(function () {
|
|
103
116
|
return [rowIndex];
|
|
@@ -10,7 +10,7 @@ type Col = Array<string | {
|
|
|
10
10
|
*/
|
|
11
11
|
export declare const getColWidthFix: (colwidth: number, tableColumnCount: number) => number;
|
|
12
12
|
export declare const generateColgroup: (table: PmNode, tableRef?: HTMLElement) => Col[];
|
|
13
|
-
export declare const insertColgroupFromNode: (tableRef: HTMLTableElement, table: PmNode, isTableScalingEnabled?: boolean, shouldRemove?: boolean) => HTMLCollection;
|
|
13
|
+
export declare const insertColgroupFromNode: (tableRef: HTMLTableElement | null, table: PmNode, isTableScalingEnabled?: boolean, shouldRemove?: boolean) => HTMLCollection;
|
|
14
14
|
export declare const hasTableBeenResized: (table: PmNode) => boolean;
|
|
15
15
|
/**
|
|
16
16
|
* Check if a table has all the column width set to tableCellMinWidth(48px) or null
|
|
@@ -24,5 +24,5 @@ export declare const getTableMaxWidth: ({ table, tableStart, state, layout, getE
|
|
|
24
24
|
*/
|
|
25
25
|
export declare const getTableElementWidth: (table: PMNode) => number;
|
|
26
26
|
export declare const getTableContainerElementWidth: (table: PMNode) => number;
|
|
27
|
-
export declare const getTableScalingPercent: (table: PMNode, tableRef: HTMLElement) => number;
|
|
27
|
+
export declare const getTableScalingPercent: (table: PMNode, tableRef: HTMLElement | null) => number;
|
|
28
28
|
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
|
|
2
2
|
import type { ResizeState } from './types';
|
|
3
|
-
export declare const resizeColumn: (resizeState: ResizeState, colIndex: number, amount: number, tableRef: HTMLElement, tableNode: PmNode, selectedColumns?: number[], isTableScalingEnabled?: boolean) => ResizeState;
|
|
3
|
+
export declare const resizeColumn: (resizeState: ResizeState, colIndex: number, amount: number, tableRef: HTMLElement | null, tableNode: PmNode, selectedColumns?: number[], isTableScalingEnabled?: boolean) => ResizeState;
|
|
@@ -7,7 +7,7 @@ export declare const getResizeState: ({ minWidth, maxSize, table, tableRef, star
|
|
|
7
7
|
minWidth: number;
|
|
8
8
|
maxSize: number;
|
|
9
9
|
table: PMNode;
|
|
10
|
-
tableRef: HTMLTableElement;
|
|
10
|
+
tableRef: HTMLTableElement | null;
|
|
11
11
|
start: number;
|
|
12
12
|
domAtPos: (pos: number) => {
|
|
13
13
|
node: Node;
|
|
@@ -15,7 +15,7 @@ export declare const getResizeState: ({ minWidth, maxSize, table, tableRef, star
|
|
|
15
15
|
};
|
|
16
16
|
isTableScalingEnabled: boolean;
|
|
17
17
|
}) => ResizeState;
|
|
18
|
-
export declare const updateColgroup: (state: ResizeState, tableRef: HTMLElement, tableNode?: PMNode, isTableScalingEnabled?: boolean) => void;
|
|
18
|
+
export declare const updateColgroup: (state: ResizeState, tableRef: HTMLElement | null, tableNode?: PMNode, isTableScalingEnabled?: boolean) => void;
|
|
19
19
|
export declare const getTotalWidth: ({ cols }: ResizeState) => number;
|
|
20
20
|
export declare const adjustColumnsWidths: (resizeState: ResizeState, maxSize: number) => ResizeState;
|
|
21
21
|
export declare const evenAllColumnsWidths: (resizeState: ResizeState) => ResizeState;
|