@atlaskit/editor-plugin-table 8.1.1 → 8.2.0

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 (43) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/cjs/types.js +1 -1
  3. package/dist/cjs/ui/DragHandle/index.js +6 -2
  4. package/dist/cjs/ui/FloatingContextualMenu/ContextualMenu.js +34 -31
  5. package/dist/cjs/ui/FloatingDeleteButton/DeleteButton.js +31 -27
  6. package/dist/cjs/ui/TableFloatingColumnControls/ColumnControls/index.js +44 -40
  7. package/dist/cjs/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +6 -2
  8. package/dist/cjs/ui/TableFloatingControls/CornerControls/DragCornerControls.js +6 -2
  9. package/dist/cjs/ui/TableFloatingControls/NumberColumn/index.js +17 -5
  10. package/dist/cjs/ui/TableFloatingControls/RowControls/ClassicControls.js +6 -2
  11. package/dist/cjs/ui/TableFloatingControls/RowControls/DragControls.js +54 -50
  12. package/dist/es2019/types.js +1 -1
  13. package/dist/es2019/ui/DragHandle/index.js +6 -2
  14. package/dist/es2019/ui/FloatingContextualMenu/ContextualMenu.js +34 -31
  15. package/dist/es2019/ui/FloatingDeleteButton/DeleteButton.js +4 -1
  16. package/dist/es2019/ui/TableFloatingColumnControls/ColumnControls/index.js +46 -42
  17. package/dist/es2019/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +6 -2
  18. package/dist/es2019/ui/TableFloatingControls/CornerControls/DragCornerControls.js +6 -2
  19. package/dist/es2019/ui/TableFloatingControls/NumberColumn/index.js +17 -5
  20. package/dist/es2019/ui/TableFloatingControls/RowControls/ClassicControls.js +6 -2
  21. package/dist/es2019/ui/TableFloatingControls/RowControls/DragControls.js +57 -53
  22. package/dist/esm/types.js +1 -1
  23. package/dist/esm/ui/DragHandle/index.js +6 -2
  24. package/dist/esm/ui/FloatingContextualMenu/ContextualMenu.js +34 -31
  25. package/dist/esm/ui/FloatingDeleteButton/DeleteButton.js +31 -27
  26. package/dist/esm/ui/TableFloatingColumnControls/ColumnControls/index.js +44 -40
  27. package/dist/esm/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +6 -2
  28. package/dist/esm/ui/TableFloatingControls/CornerControls/DragCornerControls.js +6 -2
  29. package/dist/esm/ui/TableFloatingControls/NumberColumn/index.js +17 -5
  30. package/dist/esm/ui/TableFloatingControls/RowControls/ClassicControls.js +6 -2
  31. package/dist/esm/ui/TableFloatingControls/RowControls/DragControls.js +54 -50
  32. package/package.json +3 -3
  33. package/src/types.ts +1 -1
  34. package/src/ui/DragHandle/index.tsx +2 -0
  35. package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +1 -0
  36. package/src/ui/FloatingDeleteButton/DeleteButton.tsx +1 -0
  37. package/src/ui/TableFloatingColumnControls/ColumnControls/index.tsx +1 -0
  38. package/src/ui/TableFloatingControls/CornerControls/ClassicCornerControls.tsx +2 -0
  39. package/src/ui/TableFloatingControls/CornerControls/DragCornerControls.tsx +2 -0
  40. package/src/ui/TableFloatingControls/NumberColumn/index.tsx +5 -0
  41. package/src/ui/TableFloatingControls/RowControls/ClassicControls.tsx +2 -0
  42. package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +1 -0
  43. package/src/ui/TableFloatingControls/index.tsx +1 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @atlaskit/editor-plugin-table
2
2
 
3
+ ## 8.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#169553](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/169553)
8
+ [`4232aaa0d75e4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4232aaa0d75e4) -
9
+ Fix type on resize handle for drag and drop table class name
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
3
15
  ## 8.1.1
4
16
 
5
17
  ### Patch Changes
package/dist/cjs/types.js CHANGED
@@ -158,7 +158,7 @@ var TableCssClassName = exports.TableCssClassName = _objectSpread(_objectSpread(
158
158
  WITH_LAST_COLUMN_INSERT_LINE_INACTIVE: "".concat(_adfSchema.tablePrefixSelector, "-last-column-insert-line__inactive"),
159
159
  WITH_RESIZE_LINE: "".concat(_adfSchema.tablePrefixSelector, "-column-resize-line"),
160
160
  WITH_RESIZE_LINE_LAST_COLUMN: "".concat(_adfSchema.tablePrefixSelector, "-column-resize-line-last-column"),
161
- WITH_DRAG_RESIZE_LINE: "".concat(_adfSchema.tablePrefixSelector, "-drag-column--resize-line"),
161
+ WITH_DRAG_RESIZE_LINE: "".concat(_adfSchema.tablePrefixSelector, "-drag-column-resize-line"),
162
162
  WITH_DRAG_RESIZE_LINE_LAST_COLUMN: "".concat(_adfSchema.tablePrefixSelector, "-drag-column-resize-line-last-column"),
163
163
  WITH_ROW_INSERT_LINE: "".concat(_adfSchema.tablePrefixSelector, "-row-insert-line"),
164
164
  WITH_ROW_INSERT_LINE_INACTIVE: "".concat(_adfSchema.tablePrefixSelector, "-row-insert-line__inactive"),
@@ -203,8 +203,12 @@ var DragHandleComponent = function DragHandleComponent(_ref) {
203
203
  "data-testid": "table-drag-handle-button",
204
204
  "aria-label": formatMessage(isRow ? _messages.tableMessages.rowDragHandle : _messages.tableMessages.columnDragHandle),
205
205
  "aria-expanded": isDragMenuOpen && isDragMenuTarget ? 'true' : 'false',
206
- "aria-haspopup": "menu",
207
- onMouseOver: onMouseOver,
206
+ "aria-haspopup": "menu"
207
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
208
+ ,
209
+ onMouseOver: onMouseOver
210
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
211
+ ,
208
212
  onMouseOut: onMouseOut,
209
213
  onMouseUp: function onMouseUp(e) {
210
214
  // return focus to editor so copying table selections whilst still works, i cannot call e.preventDefault in a mousemove event as this stops dragstart events from firing
@@ -695,37 +695,40 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
695
695
  var items = isDragAndDropEnabled ? this.createNewContextMenuItems() : this.createOriginalContextMenuItems();
696
696
  var isOpenAllowed = false;
697
697
  isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
698
- return (0, _react2.jsx)("div", {
699
- "data-testid": "table-cell-contextual-menu",
700
- onMouseLeave: this.closeSubmenu,
701
- ref: this.dropdownMenuRef
702
- }, (0, _react2.jsx)(_uiMenu.DropdownMenu, {
703
- mountTo: mountPoint
704
- //This needs be removed when the a11y is completely handled
705
- //Disabling key navigation now as it works only partially
706
- ,
707
- arrowKeyNavigationProviderOptions: {
708
- type: _uiMenu.ArrowKeyNavigationType.MENU,
709
- disableArrowKeyNavigation: !isCellMenuOpenByKeyboard || this.state.isSubmenuOpen
710
- },
711
- items: items,
712
- isOpen: isOpenAllowed,
713
- onOpenChange: this.handleOpenChange,
714
- onItemActivated: this.onMenuItemActivated,
715
- onMouseEnter: this.handleItemMouseEnter,
716
- onMouseLeave: this.handleItemMouseLeave,
717
- fitHeight: 188,
718
- fitWidth: isDragAndDropEnabled ? _consts.contextualMenuDropdownWidthDnD : _consts.contextualMenuDropdownWidth,
719
- shouldFocusFirstItem: function shouldFocusFirstItem() {
720
- return Boolean(isCellMenuOpenByKeyboard);
721
- },
722
- boundariesElement: boundariesElement,
723
- offset: offset,
724
- section: isDragAndDropEnabled ? {
725
- hasSeparator: true
726
- } : undefined,
727
- allowEnterDefaultBehavior: this.state.isSubmenuOpen
728
- }));
698
+ return (
699
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
700
+ (0, _react2.jsx)("div", {
701
+ "data-testid": "table-cell-contextual-menu",
702
+ onMouseLeave: this.closeSubmenu,
703
+ ref: this.dropdownMenuRef
704
+ }, (0, _react2.jsx)(_uiMenu.DropdownMenu, {
705
+ mountTo: mountPoint
706
+ //This needs be removed when the a11y is completely handled
707
+ //Disabling key navigation now as it works only partially
708
+ ,
709
+ arrowKeyNavigationProviderOptions: {
710
+ type: _uiMenu.ArrowKeyNavigationType.MENU,
711
+ disableArrowKeyNavigation: !isCellMenuOpenByKeyboard || this.state.isSubmenuOpen
712
+ },
713
+ items: items,
714
+ isOpen: isOpenAllowed,
715
+ onOpenChange: this.handleOpenChange,
716
+ onItemActivated: this.onMenuItemActivated,
717
+ onMouseEnter: this.handleItemMouseEnter,
718
+ onMouseLeave: this.handleItemMouseLeave,
719
+ fitHeight: 188,
720
+ fitWidth: isDragAndDropEnabled ? _consts.contextualMenuDropdownWidthDnD : _consts.contextualMenuDropdownWidth,
721
+ shouldFocusFirstItem: function shouldFocusFirstItem() {
722
+ return Boolean(isCellMenuOpenByKeyboard);
723
+ },
724
+ boundariesElement: boundariesElement,
725
+ offset: offset,
726
+ section: isDragAndDropEnabled ? {
727
+ hasSeparator: true
728
+ } : undefined,
729
+ allowEnterDefaultBehavior: this.state.isSubmenuOpen
730
+ }))
731
+ );
729
732
  }
730
733
  }]);
731
734
  return ContextualMenu;
@@ -15,32 +15,36 @@ var DeleteButton = function DeleteButton(_ref) {
15
15
  onMouseLeave = _ref.onMouseLeave,
16
16
  removeLabel = _ref.removeLabel,
17
17
  formatMessage = _ref.intl.formatMessage;
18
- return /*#__PURE__*/_react.default.createElement("div", {
19
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
20
- className: _types.TableCssClassName.CONTROLS_DELETE_BUTTON_WRAP
21
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
22
- ,
23
- style: style,
24
- onMouseEnter: onMouseEnter,
25
- onMouseLeave: onMouseLeave
26
- }, /*#__PURE__*/_react.default.createElement("button", {
27
- type: "button",
28
- "aria-label": formatMessage(removeLabel, {
29
- 0: 1
30
- })
31
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
32
- ,
33
- className: _types.TableCssClassName.CONTROLS_DELETE_BUTTON,
34
- onMouseDown: onClick,
35
- onMouseMove: function onMouseMove(e) {
36
- return e.preventDefault();
37
- }
38
- }, /*#__PURE__*/_react.default.createElement("svg", {
39
- className: _types.TableCssClassName.CONTROLS_BUTTON_ICON
40
- }, /*#__PURE__*/_react.default.createElement("path", {
41
- d: "M12.242 10.828L9.414 8l2.828-2.829a.999.999 0 1 0-1.414-1.414L8 6.587l-2.829-2.83a1 1 0 0 0-1.414 1.414l2.83 2.83-2.83 2.827a1 1 0 0 0 1.414 1.414l2.83-2.828 2.827 2.828a.999.999 0 1 0 1.414-1.414",
42
- fill: "currentColor",
43
- fillRule: "evenodd"
44
- }))));
18
+ return (
19
+ /*#__PURE__*/
20
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
21
+ _react.default.createElement("div", {
22
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
23
+ className: _types.TableCssClassName.CONTROLS_DELETE_BUTTON_WRAP
24
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
25
+ ,
26
+ style: style,
27
+ onMouseEnter: onMouseEnter,
28
+ onMouseLeave: onMouseLeave
29
+ }, /*#__PURE__*/_react.default.createElement("button", {
30
+ type: "button",
31
+ "aria-label": formatMessage(removeLabel, {
32
+ 0: 1
33
+ })
34
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
35
+ ,
36
+ className: _types.TableCssClassName.CONTROLS_DELETE_BUTTON,
37
+ onMouseDown: onClick,
38
+ onMouseMove: function onMouseMove(e) {
39
+ return e.preventDefault();
40
+ }
41
+ }, /*#__PURE__*/_react.default.createElement("svg", {
42
+ className: _types.TableCssClassName.CONTROLS_BUTTON_ICON
43
+ }, /*#__PURE__*/_react.default.createElement("path", {
44
+ d: "M12.242 10.828L9.414 8l2.828-2.829a.999.999 0 1 0-1.414-1.414L8 6.587l-2.829-2.83a1 1 0 0 0-1.414 1.414l2.83 2.83-2.83 2.827a1 1 0 0 0 1.414 1.414l2.83-2.828 2.827 2.828a.999.999 0 1 0 1.414-1.414",
45
+ fill: "currentColor",
46
+ fillRule: "evenodd"
47
+ }))))
48
+ );
45
49
  };
46
50
  var _default = exports.default = (0, _reactIntlNext.injectIntl)(DeleteButton);
@@ -197,48 +197,52 @@ var ColumnControls = exports.ColumnControls = function ColumnControls(_ref) {
197
197
  return handles;
198
198
  };
199
199
  var containerWidth = isNumberColumnEnabled && tableContainerWidth ? tableContainerWidth - _editorSharedStyles.akEditorTableNumberColumnWidth : tableContainerWidth;
200
- return /*#__PURE__*/_react.default.createElement("div", {
201
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
202
- className: _types.TableCssClassName.DRAG_COLUMN_CONTROLS,
203
- onMouseMove: handleMouseMove
204
- }, /*#__PURE__*/_react.default.createElement("div", {
205
- ref: columnControlsRef
206
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
207
- ,
208
- className: _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER,
209
- "data-testid": "table-floating-column-controls",
210
- style: {
211
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
212
- gridTemplateColumns: widths,
213
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
214
- marginTop: marginTop,
215
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
216
- width: stickyTop ? containerWidth : undefined,
217
- overflowX: stickyTop ? 'hidden' : 'visible',
218
- pointerEvents: isDragging ? 'none' : undefined
219
- }
220
- }, columnParams.map(function (_ref2, index) {
221
- var startIndex = _ref2.startIndex,
222
- endIndex = _ref2.endIndex;
223
- return /*#__PURE__*/_react.default.createElement("div", {
224
- style: {
225
- gridColumn: "".concat(startIndex + 1, " / span 1")
226
- },
227
- "data-start-index": startIndex,
228
- "data-end-index": endIndex
200
+ return (
201
+ /*#__PURE__*/
202
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
203
+ _react.default.createElement("div", {
229
204
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
230
- ,
231
- className: _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER,
232
- contentEditable: false,
233
- key: index
205
+ className: _types.TableCssClassName.DRAG_COLUMN_CONTROLS,
206
+ onMouseMove: handleMouseMove
234
207
  }, /*#__PURE__*/_react.default.createElement("div", {
208
+ ref: columnControlsRef
235
209
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
236
- className: _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT
237
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
238
210
  ,
239
- style: columnParams.length - 1 === index ? {
240
- right: '0'
241
- } : {}
242
- }));
243
- }), columnHandles()));
211
+ className: _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER,
212
+ "data-testid": "table-floating-column-controls",
213
+ style: {
214
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
215
+ gridTemplateColumns: widths,
216
+ // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
217
+ marginTop: marginTop,
218
+ // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
219
+ width: stickyTop ? containerWidth : undefined,
220
+ overflowX: stickyTop ? 'hidden' : 'visible',
221
+ pointerEvents: isDragging ? 'none' : undefined
222
+ }
223
+ }, columnParams.map(function (_ref2, index) {
224
+ var startIndex = _ref2.startIndex,
225
+ endIndex = _ref2.endIndex;
226
+ return /*#__PURE__*/_react.default.createElement("div", {
227
+ style: {
228
+ gridColumn: "".concat(startIndex + 1, " / span 1")
229
+ },
230
+ "data-start-index": startIndex,
231
+ "data-end-index": endIndex
232
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
233
+ ,
234
+ className: _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER,
235
+ contentEditable: false,
236
+ key: index
237
+ }, /*#__PURE__*/_react.default.createElement("div", {
238
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
239
+ className: _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT
240
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
241
+ ,
242
+ style: columnParams.length - 1 === index ? {
243
+ right: '0'
244
+ } : {}
245
+ }));
246
+ }), columnHandles()))
247
+ );
244
248
  };
@@ -100,8 +100,12 @@ var CornerControlComponent = /*#__PURE__*/function (_Component) {
100
100
  className: (0, _classnames.default)(_types.TableCssClassName.CONTROLS_CORNER_BUTTON, {
101
101
  danger: isActive && isInDanger
102
102
  }),
103
- onClick: this.selectTable,
104
- onMouseOver: this.hoverTable,
103
+ onClick: this.selectTable
104
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
105
+ ,
106
+ onMouseOver: this.hoverTable
107
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
108
+ ,
105
109
  onMouseOut: this.clearHoverSelection
106
110
  }), !isHeaderRowEnabled &&
107
111
  /*#__PURE__*/
@@ -50,7 +50,9 @@ var DragCornerControlsComponent = function DragCornerControlsComponent(_ref) {
50
50
  }),
51
51
  "aria-label": formatMessage(_messages.tableMessages.cornerControl),
52
52
  type: "button",
53
- onClick: handleOnClick,
53
+ onClick: handleOnClick
54
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
55
+ ,
54
56
  onMouseOut: handleMouseOut,
55
57
  contentEditable: false
56
58
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -96,7 +98,9 @@ var DragCornerControlsComponentWithSelection = function DragCornerControlsCompon
96
98
  }),
97
99
  "aria-label": formatMessage(_messages.tableMessages.cornerControl),
98
100
  type: "button",
99
- onClick: handleOnClick,
101
+ onClick: handleOnClick
102
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
103
+ ,
100
104
  onMouseOut: handleMouseOut,
101
105
  contentEditable: false
102
106
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -123,7 +123,10 @@ var NumberColumn = exports.default = /*#__PURE__*/function (_Component) {
123
123
  },
124
124
  contentEditable: false
125
125
  }, rowHeights.map(function (rowHeight, index) {
126
- return isDragAndDropEnabled ? /*#__PURE__*/_react.default.createElement("div", {
126
+ return isDragAndDropEnabled ?
127
+ /*#__PURE__*/
128
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
129
+ _react.default.createElement("div", {
127
130
  key: "wrapper-".concat(index)
128
131
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
129
132
  ,
@@ -131,11 +134,16 @@ var NumberColumn = exports.default = /*#__PURE__*/function (_Component) {
131
134
  "data-index": index
132
135
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
133
136
  ,
134
- style: _this2.getCellStyles(index, rowHeight),
137
+ style: _this2.getCellStyles(index, rowHeight)
138
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
139
+ ,
135
140
  onMouseOver: function onMouseOver() {
136
141
  return updateCellHoverLocation(index);
137
142
  }
138
- }, hasHeaderRow ? index > 0 ? index : null : index + 1) : /*#__PURE__*/_react.default.createElement("div", {
143
+ }, hasHeaderRow ? index > 0 ? index : null : index + 1) :
144
+ /*#__PURE__*/
145
+ // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
146
+ _react.default.createElement("div", {
139
147
  key: "wrapper-".concat(index)
140
148
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
141
149
  ,
@@ -146,10 +154,14 @@ var NumberColumn = exports.default = /*#__PURE__*/function (_Component) {
146
154
  style: _this2.getCellStyles(index, rowHeight),
147
155
  onClick: function onClick(event) {
148
156
  return _this2.selectRow(index, event);
149
- },
157
+ }
158
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
159
+ ,
150
160
  onMouseOver: function onMouseOver() {
151
161
  return _this2.hoverRows(index);
152
- },
162
+ }
163
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
164
+ ,
153
165
  onMouseOut: _this2.clearHoverSelection
154
166
  }, hasHeaderRow ? index > 0 ? index : null : index + 1);
155
167
  }));
@@ -102,10 +102,14 @@ var RowControlsComponent = /*#__PURE__*/function (_Component) {
102
102
  className: "".concat(_types.TableCssClassName.ROW_CONTROLS_BUTTON, " ").concat(_types.TableCssClassName.CONTROLS_BUTTON),
103
103
  onClick: function onClick(event) {
104
104
  return _this2.props.selectRow(startIndex, event.shiftKey);
105
- },
105
+ }
106
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
107
+ ,
106
108
  onMouseOver: function onMouseOver() {
107
109
  return _this2.props.hoverRows([startIndex]);
108
- },
110
+ }
111
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
112
+ ,
109
113
  onMouseOut: _this2.clearHoverSelection,
110
114
  "data-start-index": startIndex,
111
115
  "data-end-index": endIndex
@@ -187,57 +187,61 @@ var DragControlsComponent = function DragControlsComponent(_ref) {
187
187
  if (isResizing) {
188
188
  return null;
189
189
  }
190
- return /*#__PURE__*/_react.default.createElement("div", {
191
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
192
- className: _types.TableCssClassName.DRAG_ROW_CONTROLS,
193
- style: {
194
- gridTemplateRows: heights,
195
- gridTemplateColumns: isDragging ? // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
196
- "".concat(_consts.dropTargetExtendedWidth, "px 14px ").concat(tableWidth, "px") : '0px 14px 0px',
197
- // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
198
- left: isDragging ? // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
199
- "-".concat(_consts.dropTargetExtendedWidth + 2, "px") : "var(--ds-space-negative-025, -2px)"
200
- },
201
- onMouseMove: handleMouseMove,
202
- contentEditable: false
203
- }, rowsParams.map(function (_ref4, index) {
204
- var startIndex = _ref4.startIndex,
205
- endIndex = _ref4.endIndex;
206
- return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
207
- key: index
208
- }, /*#__PURE__*/_react.default.createElement("div", {
209
- style: {
210
- gridRow: "".concat(index + 1, " / span 1"),
211
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
212
- gridColumn: '2'
213
- },
214
- "data-start-index": startIndex,
215
- "data-end-index": endIndex
190
+ return (
191
+ /*#__PURE__*/
192
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
193
+ _react.default.createElement("div", {
216
194
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
217
- ,
218
- className: _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER,
219
- contentEditable: false,
220
- key: "insert-dot-".concat(index)
221
- }, /*#__PURE__*/_react.default.createElement("div", {
222
- className: _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT
223
- })), isDragging && /*#__PURE__*/_react.default.createElement(_RowDropTarget.default, {
224
- key: "drop-target-".concat(index),
225
- index: index,
226
- localId: currentNodeLocalId,
195
+ className: _types.TableCssClassName.DRAG_ROW_CONTROLS,
227
196
  style: {
228
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
229
- gridColumn: '1 / span 3',
230
- gridRow: "".concat(index + 1, " / span 1"),
231
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
232
- height: '100%',
233
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
234
- pointerEvents: 'auto',
235
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
236
- position: 'relative',
237
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
238
- left: "var(--ds-space-negative-100, -8px)"
239
- }
240
- }));
241
- }), rowHandles());
197
+ gridTemplateRows: heights,
198
+ gridTemplateColumns: isDragging ? // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
199
+ "".concat(_consts.dropTargetExtendedWidth, "px 14px ").concat(tableWidth, "px") : '0px 14px 0px',
200
+ // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
201
+ left: isDragging ? // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
202
+ "-".concat(_consts.dropTargetExtendedWidth + 2, "px") : "var(--ds-space-negative-025, -2px)"
203
+ },
204
+ onMouseMove: handleMouseMove,
205
+ contentEditable: false
206
+ }, rowsParams.map(function (_ref4, index) {
207
+ var startIndex = _ref4.startIndex,
208
+ endIndex = _ref4.endIndex;
209
+ return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
210
+ key: index
211
+ }, /*#__PURE__*/_react.default.createElement("div", {
212
+ style: {
213
+ gridRow: "".concat(index + 1, " / span 1"),
214
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
215
+ gridColumn: '2'
216
+ },
217
+ "data-start-index": startIndex,
218
+ "data-end-index": endIndex
219
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
220
+ ,
221
+ className: _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER,
222
+ contentEditable: false,
223
+ key: "insert-dot-".concat(index)
224
+ }, /*#__PURE__*/_react.default.createElement("div", {
225
+ className: _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT
226
+ })), isDragging && /*#__PURE__*/_react.default.createElement(_RowDropTarget.default, {
227
+ key: "drop-target-".concat(index),
228
+ index: index,
229
+ localId: currentNodeLocalId,
230
+ style: {
231
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
232
+ gridColumn: '1 / span 3',
233
+ gridRow: "".concat(index + 1, " / span 1"),
234
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
235
+ height: '100%',
236
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
237
+ pointerEvents: 'auto',
238
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
239
+ position: 'relative',
240
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
241
+ left: "var(--ds-space-negative-100, -8px)"
242
+ }
243
+ }));
244
+ }), rowHandles())
245
+ );
242
246
  };
243
247
  var DragControls = exports.DragControls = (0, _reactIntlNext.injectIntl)(DragControlsComponent);
@@ -150,7 +150,7 @@ export const TableCssClassName = {
150
150
  WITH_LAST_COLUMN_INSERT_LINE_INACTIVE: `${tablePrefixSelector}-last-column-insert-line__inactive`,
151
151
  WITH_RESIZE_LINE: `${tablePrefixSelector}-column-resize-line`,
152
152
  WITH_RESIZE_LINE_LAST_COLUMN: `${tablePrefixSelector}-column-resize-line-last-column`,
153
- WITH_DRAG_RESIZE_LINE: `${tablePrefixSelector}-drag-column--resize-line`,
153
+ WITH_DRAG_RESIZE_LINE: `${tablePrefixSelector}-drag-column-resize-line`,
154
154
  WITH_DRAG_RESIZE_LINE_LAST_COLUMN: `${tablePrefixSelector}-drag-column-resize-line-last-column`,
155
155
  WITH_ROW_INSERT_LINE: `${tablePrefixSelector}-row-insert-line`,
156
156
  WITH_ROW_INSERT_LINE_INACTIVE: `${tablePrefixSelector}-row-insert-line__inactive`,
@@ -198,8 +198,12 @@ const DragHandleComponent = ({
198
198
  "data-testid": "table-drag-handle-button",
199
199
  "aria-label": formatMessage(isRow ? messages.rowDragHandle : messages.columnDragHandle),
200
200
  "aria-expanded": isDragMenuOpen && isDragMenuTarget ? 'true' : 'false',
201
- "aria-haspopup": "menu",
202
- onMouseOver: onMouseOver,
201
+ "aria-haspopup": "menu"
202
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
203
+ ,
204
+ onMouseOver: onMouseOver
205
+ // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
206
+ ,
203
207
  onMouseOut: onMouseOut,
204
208
  onMouseUp: e => {
205
209
  // return focus to editor so copying table selections whilst still works, i cannot call e.preventDefault in a mousemove event as this stops dragstart events from firing
@@ -744,37 +744,40 @@ export class ContextualMenu extends Component {
744
744
  const items = isDragAndDropEnabled ? this.createNewContextMenuItems() : this.createOriginalContextMenuItems();
745
745
  let isOpenAllowed = false;
746
746
  isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
747
- return jsx("div", {
748
- "data-testid": "table-cell-contextual-menu",
749
- onMouseLeave: this.closeSubmenu,
750
- ref: this.dropdownMenuRef
751
- }, jsx(DropdownMenu, {
752
- mountTo: mountPoint
753
- //This needs be removed when the a11y is completely handled
754
- //Disabling key navigation now as it works only partially
755
- ,
756
- arrowKeyNavigationProviderOptions: {
757
- type: ArrowKeyNavigationType.MENU,
758
- disableArrowKeyNavigation: !isCellMenuOpenByKeyboard || this.state.isSubmenuOpen
759
- },
760
- items: items,
761
- isOpen: isOpenAllowed,
762
- onOpenChange: this.handleOpenChange,
763
- onItemActivated: this.onMenuItemActivated,
764
- onMouseEnter: this.handleItemMouseEnter,
765
- onMouseLeave: this.handleItemMouseLeave,
766
- fitHeight: 188,
767
- fitWidth: isDragAndDropEnabled ? contextualMenuDropdownWidthDnD : contextualMenuDropdownWidth,
768
- shouldFocusFirstItem: () => {
769
- return Boolean(isCellMenuOpenByKeyboard);
770
- },
771
- boundariesElement: boundariesElement,
772
- offset: offset,
773
- section: isDragAndDropEnabled ? {
774
- hasSeparator: true
775
- } : undefined,
776
- allowEnterDefaultBehavior: this.state.isSubmenuOpen
777
- }));
747
+ return (
748
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
749
+ jsx("div", {
750
+ "data-testid": "table-cell-contextual-menu",
751
+ onMouseLeave: this.closeSubmenu,
752
+ ref: this.dropdownMenuRef
753
+ }, jsx(DropdownMenu, {
754
+ mountTo: mountPoint
755
+ //This needs be removed when the a11y is completely handled
756
+ //Disabling key navigation now as it works only partially
757
+ ,
758
+ arrowKeyNavigationProviderOptions: {
759
+ type: ArrowKeyNavigationType.MENU,
760
+ disableArrowKeyNavigation: !isCellMenuOpenByKeyboard || this.state.isSubmenuOpen
761
+ },
762
+ items: items,
763
+ isOpen: isOpenAllowed,
764
+ onOpenChange: this.handleOpenChange,
765
+ onItemActivated: this.onMenuItemActivated,
766
+ onMouseEnter: this.handleItemMouseEnter,
767
+ onMouseLeave: this.handleItemMouseLeave,
768
+ fitHeight: 188,
769
+ fitWidth: isDragAndDropEnabled ? contextualMenuDropdownWidthDnD : contextualMenuDropdownWidth,
770
+ shouldFocusFirstItem: () => {
771
+ return Boolean(isCellMenuOpenByKeyboard);
772
+ },
773
+ boundariesElement: boundariesElement,
774
+ offset: offset,
775
+ section: isDragAndDropEnabled ? {
776
+ hasSeparator: true
777
+ } : undefined,
778
+ allowEnterDefaultBehavior: this.state.isSubmenuOpen
779
+ }))
780
+ );
778
781
  }
779
782
  }
780
783
  _defineProperty(ContextualMenu, "defaultProps", {
@@ -10,7 +10,10 @@ const DeleteButton = ({
10
10
  intl: {
11
11
  formatMessage
12
12
  }
13
- }) => /*#__PURE__*/React.createElement("div", {
13
+ }) =>
14
+ /*#__PURE__*/
15
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
16
+ React.createElement("div", {
14
17
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
15
18
  className: ClassName.CONTROLS_DELETE_BUTTON_WRAP
16
19
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766