@atlaskit/editor-plugin-table 5.8.2 → 5.8.4
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 +13 -0
- package/dist/cjs/nodeviews/TableComponent.js +17 -62
- package/dist/cjs/pm-plugins/drag-and-drop/plugin.js +153 -123
- package/dist/cjs/pm-plugins/drag-and-drop/utils/autoscrollers.js +53 -0
- package/dist/cjs/pm-plugins/drag-and-drop/utils/index.js +8 -1
- package/dist/cjs/ui/DragHandle/index.js +8 -3
- package/dist/cjs/ui/FloatingContextualMenu/ContextualMenu.js +2 -2
- package/dist/cjs/ui/FloatingDragMenu/DragMenu.js +103 -12
- package/dist/cjs/ui/FloatingDragMenu/index.js +2 -2
- package/dist/es2019/nodeviews/TableComponent.js +5 -55
- package/dist/es2019/pm-plugins/drag-and-drop/plugin.js +158 -124
- package/dist/es2019/pm-plugins/drag-and-drop/utils/autoscrollers.js +50 -0
- package/dist/es2019/pm-plugins/drag-and-drop/utils/index.js +2 -1
- package/dist/es2019/ui/DragHandle/index.js +10 -3
- package/dist/es2019/ui/FloatingContextualMenu/ContextualMenu.js +2 -2
- package/dist/es2019/ui/FloatingDragMenu/DragMenu.js +106 -11
- package/dist/es2019/ui/FloatingDragMenu/index.js +1 -1
- package/dist/esm/nodeviews/TableComponent.js +7 -52
- package/dist/esm/pm-plugins/drag-and-drop/plugin.js +152 -122
- package/dist/esm/pm-plugins/drag-and-drop/utils/autoscrollers.js +47 -0
- package/dist/esm/pm-plugins/drag-and-drop/utils/index.js +2 -1
- package/dist/esm/ui/DragHandle/index.js +8 -3
- package/dist/esm/ui/FloatingContextualMenu/ContextualMenu.js +2 -2
- package/dist/esm/ui/FloatingDragMenu/DragMenu.js +102 -11
- package/dist/esm/ui/FloatingDragMenu/index.js +1 -1
- package/dist/types/pm-plugins/drag-and-drop/utils/autoscrollers.d.ts +7 -0
- package/dist/types/pm-plugins/drag-and-drop/utils/index.d.ts +1 -0
- package/dist/types/ui/DragHandle/index.d.ts +5 -1
- package/dist/types/ui/FloatingDragMenu/DragMenu.d.ts +7 -2
- package/dist/types/utils/drag-menu.d.ts +2 -1
- package/dist/types-ts4.5/pm-plugins/drag-and-drop/utils/autoscrollers.d.ts +7 -0
- package/dist/types-ts4.5/pm-plugins/drag-and-drop/utils/index.d.ts +1 -0
- package/dist/types-ts4.5/ui/DragHandle/index.d.ts +5 -1
- package/dist/types-ts4.5/ui/FloatingDragMenu/DragMenu.d.ts +7 -2
- package/dist/types-ts4.5/utils/drag-menu.d.ts +2 -1
- package/package.json +2 -2
- package/src/__tests__/unit/ui/FloatingDragMenu.tsx +129 -105
- package/src/nodeviews/TableComponent.tsx +5 -49
- package/src/pm-plugins/drag-and-drop/plugin.ts +202 -157
- package/src/pm-plugins/drag-and-drop/utils/autoscrollers.ts +52 -0
- package/src/pm-plugins/drag-and-drop/utils/index.ts +2 -0
- package/src/ui/DragHandle/index.tsx +13 -2
- package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +2 -2
- package/src/ui/FloatingDragMenu/DragMenu.tsx +137 -12
- package/src/ui/FloatingDragMenu/index.tsx +1 -1
- package/src/utils/drag-menu.ts +17 -1
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { autoScrollForElements } from '@atlaskit/pragmatic-drag-and-drop-auto-scroll/element';
|
|
2
|
+
import { unsafeOverflowAutoScrollForElements } from '@atlaskit/pragmatic-drag-and-drop-auto-scroll/unsafe-overflow/element';
|
|
3
|
+
import { dropTargetExtendedWidth } from '../../../ui/consts';
|
|
4
|
+
export var autoScrollerFactory = function autoScrollerFactory(_ref) {
|
|
5
|
+
var tableWrapper = _ref.tableWrapper,
|
|
6
|
+
getNode = _ref.getNode;
|
|
7
|
+
return [autoScrollForElements({
|
|
8
|
+
element: tableWrapper,
|
|
9
|
+
canScroll: function canScroll(_ref2) {
|
|
10
|
+
var source = _ref2.source;
|
|
11
|
+
var _ref3 = source.data,
|
|
12
|
+
localId = _ref3.localId,
|
|
13
|
+
type = _ref3.type;
|
|
14
|
+
var node = getNode();
|
|
15
|
+
return localId === (node === null || node === void 0 ? void 0 : node.attrs.localId) && type === 'table-column';
|
|
16
|
+
}
|
|
17
|
+
}), unsafeOverflowAutoScrollForElements({
|
|
18
|
+
element: tableWrapper,
|
|
19
|
+
canScroll: function canScroll(_ref4) {
|
|
20
|
+
var source = _ref4.source;
|
|
21
|
+
var _ref5 = source.data,
|
|
22
|
+
localId = _ref5.localId,
|
|
23
|
+
type = _ref5.type;
|
|
24
|
+
var node = getNode();
|
|
25
|
+
return localId === (node === null || node === void 0 ? void 0 : node.attrs.localId) && type === 'table-column';
|
|
26
|
+
},
|
|
27
|
+
getOverflow: function getOverflow() {
|
|
28
|
+
return {
|
|
29
|
+
fromTopEdge: {
|
|
30
|
+
top: dropTargetExtendedWidth,
|
|
31
|
+
right: dropTargetExtendedWidth,
|
|
32
|
+
left: dropTargetExtendedWidth
|
|
33
|
+
},
|
|
34
|
+
fromRightEdge: {
|
|
35
|
+
right: dropTargetExtendedWidth,
|
|
36
|
+
top: dropTargetExtendedWidth,
|
|
37
|
+
bottom: dropTargetExtendedWidth
|
|
38
|
+
},
|
|
39
|
+
fromLeftEdge: {
|
|
40
|
+
top: dropTargetExtendedWidth,
|
|
41
|
+
left: dropTargetExtendedWidth,
|
|
42
|
+
bottom: dropTargetExtendedWidth
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
})];
|
|
47
|
+
};
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export { getDraggableDataFromEvent } from './monitor';
|
|
1
|
+
export { getDraggableDataFromEvent } from './monitor';
|
|
2
|
+
export { autoScrollerFactory } from './autoscrollers';
|
|
@@ -3,6 +3,8 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
|
3
3
|
import React, { useEffect, useMemo, useRef, useState } from 'react';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import ReactDOM from 'react-dom';
|
|
6
|
+
import { injectIntl } from 'react-intl-next';
|
|
7
|
+
import { tableMessages as messages } from '@atlaskit/editor-common/messages';
|
|
6
8
|
import { browser } from '@atlaskit/editor-common/utils';
|
|
7
9
|
import { draggable } from '@atlaskit/pragmatic-drag-and-drop/adapter/element';
|
|
8
10
|
import { setCustomNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/util/set-custom-native-drag-preview';
|
|
@@ -11,7 +13,7 @@ import { TableCssClassName as ClassName } from '../../types';
|
|
|
11
13
|
import { hasMergedCellsInColumn, hasMergedCellsInRow } from '../../utils';
|
|
12
14
|
import { DragPreview } from '../DragPreview';
|
|
13
15
|
import { HandleIconComponent } from './HandleIconComponent';
|
|
14
|
-
|
|
16
|
+
var DragHandleComponent = function DragHandleComponent(_ref) {
|
|
15
17
|
var isDragMenuTarget = _ref.isDragMenuTarget,
|
|
16
18
|
tableLocalId = _ref.tableLocalId,
|
|
17
19
|
_ref$direction = _ref.direction,
|
|
@@ -29,7 +31,8 @@ export var DragHandle = function DragHandle(_ref) {
|
|
|
29
31
|
onClick = _ref.onClick,
|
|
30
32
|
editorView = _ref.editorView,
|
|
31
33
|
_ref$canDrag = _ref.canDrag,
|
|
32
|
-
_canDrag = _ref$canDrag === void 0 ? false : _ref$canDrag
|
|
34
|
+
_canDrag = _ref$canDrag === void 0 ? false : _ref$canDrag,
|
|
35
|
+
formatMessage = _ref.intl.formatMessage;
|
|
33
36
|
var dragHandleDivRef = useRef(null);
|
|
34
37
|
var _useState = useState(null),
|
|
35
38
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -114,6 +117,7 @@ export var DragHandle = function DragHandle(_ref) {
|
|
|
114
117
|
transform: direction === 'column' ? 'none' : 'rotate(90deg)'
|
|
115
118
|
},
|
|
116
119
|
"data-testid": "table-drag-handle-button",
|
|
120
|
+
"aria-label": formatMessage(direction === 'row' ? messages.rowDragHandle : messages.columnDragHandle),
|
|
117
121
|
onMouseOver: onMouseOver,
|
|
118
122
|
onMouseOut: onMouseOut,
|
|
119
123
|
onMouseUp: function onMouseUp(e) {
|
|
@@ -132,4 +136,5 @@ export var DragHandle = function DragHandle(_ref) {
|
|
|
132
136
|
width: previewWidth,
|
|
133
137
|
height: previewHeight
|
|
134
138
|
}), previewContainer));
|
|
135
|
-
};
|
|
139
|
+
};
|
|
140
|
+
export var DragHandle = injectIntl(DragHandleComponent);
|
|
@@ -143,7 +143,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
143
143
|
var _getPluginState3 = getPluginState(editorView.state),
|
|
144
144
|
isDragAndDropEnabled = _getPluginState3.isDragAndDropEnabled;
|
|
145
145
|
return {
|
|
146
|
-
content: formatMessage(isDragAndDropEnabled && getBooleanFF('platform.editor.table.new-cell-context-menu-styling') ? messages.
|
|
146
|
+
content: formatMessage(isDragAndDropEnabled && getBooleanFF('platform.editor.table.new-cell-context-menu-styling') ? messages.addColumnRight : messages.insertColumn),
|
|
147
147
|
value: {
|
|
148
148
|
name: 'insert_column'
|
|
149
149
|
},
|
|
@@ -160,7 +160,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
160
160
|
var _getPluginState4 = getPluginState(editorView.state),
|
|
161
161
|
isDragAndDropEnabled = _getPluginState4.isDragAndDropEnabled;
|
|
162
162
|
return {
|
|
163
|
-
content: formatMessage(isDragAndDropEnabled && getBooleanFF('platform.editor.table.new-cell-context-menu-styling') ? messages.
|
|
163
|
+
content: formatMessage(isDragAndDropEnabled && getBooleanFF('platform.editor.table.new-cell-context-menu-styling') ? messages.addRowBelow : messages.insertRow),
|
|
164
164
|
value: {
|
|
165
165
|
name: 'insert_row'
|
|
166
166
|
},
|
|
@@ -4,7 +4,9 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
|
4
4
|
/** @jsx jsx */
|
|
5
5
|
import { useState } from 'react';
|
|
6
6
|
import { jsx } from '@emotion/react';
|
|
7
|
+
import { injectIntl } from 'react-intl-next';
|
|
7
8
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
9
|
+
import { tableMessages as messages } from '@atlaskit/editor-common/messages';
|
|
8
10
|
import { DropdownMenuSharedCssClassName } from '@atlaskit/editor-common/styles';
|
|
9
11
|
import { backgroundPaletteTooltipMessages, cellBackgroundColorPalette, ColorPalette } from '@atlaskit/editor-common/ui-color';
|
|
10
12
|
import { ArrowKeyNavigationType, DropdownMenu } from '@atlaskit/editor-common/ui-menu';
|
|
@@ -26,22 +28,109 @@ import { checkIfHeaderColumnEnabled, checkIfHeaderRowEnabled, checkIfNumberColum
|
|
|
26
28
|
import { getDragMenuConfig } from '../../utils/drag-menu';
|
|
27
29
|
import { dragMenuDropdownWidth } from '../consts';
|
|
28
30
|
import { cellColourPreviewStyles, dragMenuBackgroundColorStyles, toggleStyles } from './styles';
|
|
31
|
+
var MapDragMenuOptionIdToMessage = {
|
|
32
|
+
add_row_above: {
|
|
33
|
+
message: messages.addRowAbove,
|
|
34
|
+
plural: null
|
|
35
|
+
},
|
|
36
|
+
add_row_below: {
|
|
37
|
+
message: messages.addRowBelow,
|
|
38
|
+
plural: null
|
|
39
|
+
},
|
|
40
|
+
add_column_left: {
|
|
41
|
+
message: messages.addColumnLeft,
|
|
42
|
+
plural: null
|
|
43
|
+
},
|
|
44
|
+
add_column_right: {
|
|
45
|
+
message: messages.addColumnRight,
|
|
46
|
+
plural: null
|
|
47
|
+
},
|
|
48
|
+
distribute_columns: {
|
|
49
|
+
message: messages.distributeColumns,
|
|
50
|
+
plural: 'noOfCols'
|
|
51
|
+
},
|
|
52
|
+
clear_cells: {
|
|
53
|
+
message: messages.clearCells,
|
|
54
|
+
plural: 'noOfCells'
|
|
55
|
+
},
|
|
56
|
+
delete_row: {
|
|
57
|
+
message: messages.removeRows,
|
|
58
|
+
plural: 'noOfRows'
|
|
59
|
+
},
|
|
60
|
+
delete_column: {
|
|
61
|
+
message: messages.removeColumns,
|
|
62
|
+
plural: 'noOfCols'
|
|
63
|
+
},
|
|
64
|
+
move_column_left: {
|
|
65
|
+
message: messages.moveColumnLeft,
|
|
66
|
+
plural: 'noOfCols'
|
|
67
|
+
},
|
|
68
|
+
move_column_right: {
|
|
69
|
+
message: messages.moveColumnRight,
|
|
70
|
+
plural: 'noOfCols'
|
|
71
|
+
},
|
|
72
|
+
move_row_up: {
|
|
73
|
+
message: messages.moveRowUp,
|
|
74
|
+
plural: 'noOfRows'
|
|
75
|
+
},
|
|
76
|
+
move_row_down: {
|
|
77
|
+
message: messages.moveRowDown,
|
|
78
|
+
plural: 'noOfRows'
|
|
79
|
+
},
|
|
80
|
+
sort_column_asc: {
|
|
81
|
+
message: messages.sortColumnIncreasing,
|
|
82
|
+
plural: null
|
|
83
|
+
},
|
|
84
|
+
sort_column_desc: {
|
|
85
|
+
message: messages.sortColumnDecreasing,
|
|
86
|
+
plural: null
|
|
87
|
+
}
|
|
88
|
+
};
|
|
29
89
|
var groupedDragMenuConfig = [['add_row_above', 'add_row_below', 'add_column_left', 'add_column_right', 'distribute_columns', 'clear_cells', 'delete_row', 'delete_column'], ['move_column_left', 'move_column_right', 'move_row_up', 'move_row_down'], ['sort_column_asc', 'sort_column_desc']];
|
|
30
|
-
var convertToDropdownItems = function convertToDropdownItems(dragMenuConfig) {
|
|
90
|
+
var convertToDropdownItems = function convertToDropdownItems(dragMenuConfig, formatMessage, selectionRect) {
|
|
31
91
|
var menuItemsArr = _toConsumableArray(Array(groupedDragMenuConfig.length)).map(function () {
|
|
32
92
|
return [];
|
|
33
93
|
});
|
|
34
94
|
var menuCallback = {};
|
|
35
95
|
dragMenuConfig.forEach(function (item) {
|
|
96
|
+
var _MapDragMenuOptionIdT;
|
|
36
97
|
var menuGroupIndex = groupedDragMenuConfig.findIndex(function (group) {
|
|
37
98
|
return group.includes(item.id);
|
|
38
99
|
});
|
|
39
100
|
if (menuGroupIndex === -1) {
|
|
40
101
|
return;
|
|
41
102
|
}
|
|
103
|
+
var isPlural = Boolean((_MapDragMenuOptionIdT = MapDragMenuOptionIdToMessage[item.id]) === null || _MapDragMenuOptionIdT === void 0 ? void 0 : _MapDragMenuOptionIdT.plural);
|
|
104
|
+
var plural = 0;
|
|
105
|
+
if (isPlural && selectionRect) {
|
|
106
|
+
var top = selectionRect.top,
|
|
107
|
+
bottom = selectionRect.bottom,
|
|
108
|
+
right = selectionRect.right,
|
|
109
|
+
left = selectionRect.left;
|
|
110
|
+
switch (MapDragMenuOptionIdToMessage[item.id].plural) {
|
|
111
|
+
case 'noOfCols':
|
|
112
|
+
{
|
|
113
|
+
plural = right - left;
|
|
114
|
+
break;
|
|
115
|
+
}
|
|
116
|
+
case 'noOfRows':
|
|
117
|
+
{
|
|
118
|
+
plural = bottom - top;
|
|
119
|
+
break;
|
|
120
|
+
}
|
|
121
|
+
case 'noOfCells':
|
|
122
|
+
{
|
|
123
|
+
plural = Math.max(right - left, bottom - top);
|
|
124
|
+
break;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
var options = isPlural ? {
|
|
129
|
+
0: plural
|
|
130
|
+
} : undefined;
|
|
42
131
|
menuItemsArr[menuGroupIndex].push({
|
|
43
132
|
key: item.id,
|
|
44
|
-
content: item.
|
|
133
|
+
content: formatMessage(MapDragMenuOptionIdToMessage[item.id].message, options),
|
|
45
134
|
value: {
|
|
46
135
|
name: item.id
|
|
47
136
|
},
|
|
@@ -51,7 +140,7 @@ var convertToDropdownItems = function convertToDropdownItems(dragMenuConfig) {
|
|
|
51
140
|
display: 'flex'
|
|
52
141
|
}
|
|
53
142
|
}, jsx(item.icon, {
|
|
54
|
-
label: item.
|
|
143
|
+
label: formatMessage(MapDragMenuOptionIdToMessage[item.id].message, options)
|
|
55
144
|
})) : undefined,
|
|
56
145
|
elemAfter: item.keymap ? jsx("div", {
|
|
57
146
|
css: shortcutStyle
|
|
@@ -85,7 +174,8 @@ export var DragMenu = function DragMenu(_ref) {
|
|
|
85
174
|
getEditorContainerWidth = _ref.getEditorContainerWidth,
|
|
86
175
|
canDrag = _ref.canDrag,
|
|
87
176
|
editorAnalyticsAPI = _ref.editorAnalyticsAPI,
|
|
88
|
-
pluginConfig = _ref.pluginConfig
|
|
177
|
+
pluginConfig = _ref.pluginConfig,
|
|
178
|
+
formatMessage = _ref.intl.formatMessage;
|
|
89
179
|
var state = editorView.state,
|
|
90
180
|
dispatch = editorView.dispatch;
|
|
91
181
|
var selection = state.selection;
|
|
@@ -100,7 +190,7 @@ export var DragMenu = function DragMenu(_ref) {
|
|
|
100
190
|
var hasMergedCellsInTable = getMergedCellsPositions(state.tr).length > 0;
|
|
101
191
|
var allowBackgroundColor = (_pluginConfig$allowBa = pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.allowBackgroundColor) !== null && _pluginConfig$allowBa !== void 0 ? _pluginConfig$allowBa : false;
|
|
102
192
|
var dragMenuConfig = getDragMenuConfig(direction, getEditorContainerWidth, !!canDrag && !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI);
|
|
103
|
-
var _convertToDropdownIte = convertToDropdownItems(dragMenuConfig),
|
|
193
|
+
var _convertToDropdownIte = convertToDropdownItems(dragMenuConfig, formatMessage, selectionRect),
|
|
104
194
|
menuItems = _convertToDropdownIte.menuItems,
|
|
105
195
|
menuCallback = _convertToDropdownIte.menuCallback;
|
|
106
196
|
var handleSubMenuRef = function handleSubMenuRef(ref) {
|
|
@@ -130,12 +220,12 @@ export var DragMenu = function DragMenu(_ref) {
|
|
|
130
220
|
var node = targetCellPosition ? state.doc.nodeAt(targetCellPosition) : null;
|
|
131
221
|
var background = hexToEditorBackgroundPaletteColor((node === null || node === void 0 || (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.background) || '#ffffff');
|
|
132
222
|
return {
|
|
133
|
-
content:
|
|
223
|
+
content: formatMessage(messages.backgroundColor),
|
|
134
224
|
value: {
|
|
135
225
|
name: 'background'
|
|
136
226
|
},
|
|
137
227
|
elemBefore: jsx(EditorBackgroundColorIcon, {
|
|
138
|
-
label:
|
|
228
|
+
label: formatMessage(messages.backgroundColor),
|
|
139
229
|
size: "medium"
|
|
140
230
|
}),
|
|
141
231
|
elemAfter: jsx("div", {
|
|
@@ -170,7 +260,7 @@ export var DragMenu = function DragMenu(_ref) {
|
|
|
170
260
|
};
|
|
171
261
|
var createhHeaderRowColumnMenuItem = function createhHeaderRowColumnMenuItem(direction) {
|
|
172
262
|
return direction === 'column' ? {
|
|
173
|
-
content:
|
|
263
|
+
content: formatMessage(messages.headerColumn),
|
|
174
264
|
value: {
|
|
175
265
|
name: 'header_column'
|
|
176
266
|
},
|
|
@@ -182,7 +272,7 @@ export var DragMenu = function DragMenu(_ref) {
|
|
|
182
272
|
isChecked: checkIfHeaderColumnEnabled(selection)
|
|
183
273
|
}))
|
|
184
274
|
} : {
|
|
185
|
-
content:
|
|
275
|
+
content: formatMessage(messages.headerRow),
|
|
186
276
|
value: {
|
|
187
277
|
name: 'header_row'
|
|
188
278
|
},
|
|
@@ -197,7 +287,7 @@ export var DragMenu = function DragMenu(_ref) {
|
|
|
197
287
|
};
|
|
198
288
|
var createRowNumbersMenuItem = function createRowNumbersMenuItem() {
|
|
199
289
|
return {
|
|
200
|
-
content:
|
|
290
|
+
content: formatMessage(messages.rowNumbers),
|
|
201
291
|
value: {
|
|
202
292
|
name: 'row_numbers'
|
|
203
293
|
},
|
|
@@ -325,4 +415,5 @@ export var DragMenu = function DragMenu(_ref) {
|
|
|
325
415
|
hasSeparator: true
|
|
326
416
|
}
|
|
327
417
|
});
|
|
328
|
-
};
|
|
418
|
+
};
|
|
419
|
+
export default injectIntl(DragMenu);
|
|
@@ -3,7 +3,7 @@ import { Popup } from '@atlaskit/editor-common/ui';
|
|
|
3
3
|
import { akEditorFloatingDialogZIndex, akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
|
|
4
4
|
import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
|
|
5
5
|
import { dragMenuDropdownWidth } from '../consts';
|
|
6
|
-
import
|
|
6
|
+
import DragMenu from './DragMenu';
|
|
7
7
|
var FloatingDragMenu = function FloatingDragMenu(_ref) {
|
|
8
8
|
var mountPoint = _ref.mountPoint,
|
|
9
9
|
boundariesElement = _ref.boundariesElement,
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
|
|
2
|
+
type AutoScrollerFactory = {
|
|
3
|
+
tableWrapper: HTMLElement;
|
|
4
|
+
getNode: () => PmNode;
|
|
5
|
+
};
|
|
6
|
+
export declare const autoScrollerFactory: ({ tableWrapper, getNode, }: AutoScrollerFactory) => import("@atlaskit/pragmatic-drag-and-drop/types").CleanupFn[];
|
|
7
|
+
export {};
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import type { MouseEventHandler } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { WrappedComponentProps } from 'react-intl-next';
|
|
2
4
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
3
5
|
import type { TableDirection } from '../../types';
|
|
4
6
|
type DragHandleAppearance = 'default' | 'selected' | 'disabled' | 'danger';
|
|
@@ -18,5 +20,7 @@ type DragHandleProps = {
|
|
|
18
20
|
canDrag?: boolean;
|
|
19
21
|
isDragMenuTarget: boolean;
|
|
20
22
|
};
|
|
21
|
-
export declare const DragHandle: (
|
|
23
|
+
export declare const DragHandle: React.FC<import("react-intl-next").WithIntlProps<DragHandleProps & WrappedComponentProps<"intl">>> & {
|
|
24
|
+
WrappedComponent: React.ComponentType<DragHandleProps & WrappedComponentProps<"intl">>;
|
|
25
|
+
};
|
|
22
26
|
export {};
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { jsx } from '@emotion/react';
|
|
3
|
+
import type { WrappedComponentProps } from 'react-intl-next';
|
|
2
4
|
import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
|
|
3
5
|
import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
|
|
4
6
|
import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
|
|
@@ -20,5 +22,8 @@ type DragMenuProps = {
|
|
|
20
22
|
canDrag?: boolean;
|
|
21
23
|
editorAnalyticsAPI?: EditorAnalyticsAPI;
|
|
22
24
|
};
|
|
23
|
-
export declare const DragMenu: ({ direction, index, isOpen, editorView, tableNode, mountPoint, boundariesElement, scrollableElement, targetCellPosition, getEditorContainerWidth, canDrag, editorAnalyticsAPI, pluginConfig, }: DragMenuProps) => jsx.JSX.Element | null;
|
|
24
|
-
|
|
25
|
+
export declare const DragMenu: ({ direction, index, isOpen, editorView, tableNode, mountPoint, boundariesElement, scrollableElement, targetCellPosition, getEditorContainerWidth, canDrag, editorAnalyticsAPI, pluginConfig, intl: { formatMessage }, }: DragMenuProps & WrappedComponentProps) => jsx.JSX.Element | null;
|
|
26
|
+
declare const _default: import("react").FC<import("react-intl-next").WithIntlProps<DragMenuProps & WrappedComponentProps<"intl">>> & {
|
|
27
|
+
WrappedComponent: import("react").ComponentType<DragMenuProps & WrappedComponentProps<"intl">>;
|
|
28
|
+
};
|
|
29
|
+
export default _default;
|
|
@@ -4,8 +4,9 @@ import type { Command, DropdownOptionT, GetEditorContainerWidth, IconProps } fro
|
|
|
4
4
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
5
5
|
import type { Rect, TableMap } from '@atlaskit/editor-tables/table-map';
|
|
6
6
|
import type { TableDirection } from '../types';
|
|
7
|
+
export type DragMenuOptionIdType = 'add_row_above' | 'add_row_below' | 'add_column_left' | 'add_column_right' | 'distribute_columns' | 'clear_cells' | 'delete_row' | 'delete_column' | 'move_column_left' | 'move_column_right' | 'move_row_up' | 'move_row_down' | 'sort_column_asc' | 'sort_column_desc';
|
|
7
8
|
export interface DragMenuConfig extends DropdownOptionT<Command> {
|
|
8
|
-
id:
|
|
9
|
+
id: DragMenuOptionIdType;
|
|
9
10
|
icon?: React.ComponentType<IconProps>;
|
|
10
11
|
keymap?: string;
|
|
11
12
|
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
|
|
2
|
+
type AutoScrollerFactory = {
|
|
3
|
+
tableWrapper: HTMLElement;
|
|
4
|
+
getNode: () => PmNode;
|
|
5
|
+
};
|
|
6
|
+
export declare const autoScrollerFactory: ({ tableWrapper, getNode, }: AutoScrollerFactory) => import("@atlaskit/pragmatic-drag-and-drop/types").CleanupFn[];
|
|
7
|
+
export {};
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import type { MouseEventHandler } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { WrappedComponentProps } from 'react-intl-next';
|
|
2
4
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
3
5
|
import type { TableDirection } from '../../types';
|
|
4
6
|
type DragHandleAppearance = 'default' | 'selected' | 'disabled' | 'danger';
|
|
@@ -18,5 +20,7 @@ type DragHandleProps = {
|
|
|
18
20
|
canDrag?: boolean;
|
|
19
21
|
isDragMenuTarget: boolean;
|
|
20
22
|
};
|
|
21
|
-
export declare const DragHandle: (
|
|
23
|
+
export declare const DragHandle: React.FC<import("react-intl-next").WithIntlProps<DragHandleProps & WrappedComponentProps<"intl">>> & {
|
|
24
|
+
WrappedComponent: React.ComponentType<DragHandleProps & WrappedComponentProps<"intl">>;
|
|
25
|
+
};
|
|
22
26
|
export {};
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
import { jsx } from '@emotion/react';
|
|
3
|
+
import type { WrappedComponentProps } from 'react-intl-next';
|
|
2
4
|
import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
|
|
3
5
|
import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
|
|
4
6
|
import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
|
|
@@ -20,5 +22,8 @@ type DragMenuProps = {
|
|
|
20
22
|
canDrag?: boolean;
|
|
21
23
|
editorAnalyticsAPI?: EditorAnalyticsAPI;
|
|
22
24
|
};
|
|
23
|
-
export declare const DragMenu: ({ direction, index, isOpen, editorView, tableNode, mountPoint, boundariesElement, scrollableElement, targetCellPosition, getEditorContainerWidth, canDrag, editorAnalyticsAPI, pluginConfig, }: DragMenuProps) => jsx.JSX.Element | null;
|
|
24
|
-
|
|
25
|
+
export declare const DragMenu: ({ direction, index, isOpen, editorView, tableNode, mountPoint, boundariesElement, scrollableElement, targetCellPosition, getEditorContainerWidth, canDrag, editorAnalyticsAPI, pluginConfig, intl: { formatMessage }, }: DragMenuProps & WrappedComponentProps) => jsx.JSX.Element | null;
|
|
26
|
+
declare const _default: import("react").FC<import("react-intl-next").WithIntlProps<DragMenuProps & WrappedComponentProps<"intl">>> & {
|
|
27
|
+
WrappedComponent: import("react").ComponentType<DragMenuProps & WrappedComponentProps<"intl">>;
|
|
28
|
+
};
|
|
29
|
+
export default _default;
|
|
@@ -4,8 +4,9 @@ import type { Command, DropdownOptionT, GetEditorContainerWidth, IconProps } fro
|
|
|
4
4
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
5
5
|
import type { Rect, TableMap } from '@atlaskit/editor-tables/table-map';
|
|
6
6
|
import type { TableDirection } from '../types';
|
|
7
|
+
export type DragMenuOptionIdType = 'add_row_above' | 'add_row_below' | 'add_column_left' | 'add_column_right' | 'distribute_columns' | 'clear_cells' | 'delete_row' | 'delete_column' | 'move_column_left' | 'move_column_right' | 'move_row_up' | 'move_row_down' | 'sort_column_asc' | 'sort_column_desc';
|
|
7
8
|
export interface DragMenuConfig extends DropdownOptionT<Command> {
|
|
8
|
-
id:
|
|
9
|
+
id: DragMenuOptionIdType;
|
|
9
10
|
icon?: React.ComponentType<IconProps>;
|
|
10
11
|
keymap?: string;
|
|
11
12
|
}
|
package/package.json
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-table",
|
|
3
|
-
"version": "5.8.
|
|
3
|
+
"version": "5.8.4",
|
|
4
4
|
"description": "Table plugin for the @atlaskit/editor",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
7
7
|
},
|
|
8
|
-
"repository": "https://bitbucket.org/atlassian/atlassian-frontend",
|
|
8
|
+
"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
|
|
9
9
|
"author": "Atlassian Pty Ltd",
|
|
10
10
|
"main": "dist/cjs/index.js",
|
|
11
11
|
"module": "dist/esm/index.js",
|