@atlaskit/editor-plugin-table 7.24.8 → 7.25.1

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 CHANGED
@@ -1,5 +1,32 @@
1
1
  # @atlaskit/editor-plugin-table
2
2
 
3
+ ## 7.25.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#128458](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/128458)
8
+ [`26e17a7d801e4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/26e17a7d801e4) -
9
+ ED-24514 Added ignore mutation for lazy node view
10
+ - [#128458](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/128458)
11
+ [`f372e089c10cf`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f372e089c10cf) -
12
+ Fix an issue where hovering over the column divider does not show the blue hover decoration in
13
+ React 18
14
+ - Updated dependencies
15
+
16
+ ## 7.25.0
17
+
18
+ ### Minor Changes
19
+
20
+ - [#128347](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/128347)
21
+ [`e33566cebd5d1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e33566cebd5d1) -
22
+ [ED-24175] bump @atlaskit/adf-schema to 40.8.1 and @atlassian/adf-schema-json to 1.22.0 to
23
+ promotecodeblocks & media in quotes, and nested expands in expands to full schema, and allow
24
+ quotes in panels and decisions in lists in stage0 schema, and a validator spec change
25
+
26
+ ### Patch Changes
27
+
28
+ - Updated dependencies
29
+
3
30
  ## 7.24.8
4
31
 
5
32
  ### Patch Changes
@@ -81,6 +81,12 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
81
81
  }
82
82
  return (0, _eventHandlers.handleMouseOut)(_this.props.view, event);
83
83
  });
84
+ (0, _defineProperty3.default)((0, _assertThisInitialized2.default)(_this), "handleMouseOver", function (event) {
85
+ if (!(0, _eventHandlers.isTableInFocus)(_this.props.view)) {
86
+ return false;
87
+ }
88
+ return (0, _eventHandlers.withCellTracking)(_eventHandlers.handleMouseOver)(_this.props.view, event);
89
+ });
84
90
  (0, _defineProperty3.default)((0, _assertThisInitialized2.default)(_this), "handleMouseEnter", function () {
85
91
  var node = _this.props.getNode();
86
92
  var pos = _this.props.getPos();
@@ -375,6 +381,10 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
375
381
  var _this$table2;
376
382
  this === null || this === void 0 || (_this$table2 = this.table) === null || _this$table2 === void 0 || _this$table2.addEventListener('mouseout', this.handleMouseOut);
377
383
  }
384
+ if ((0, _platformFeatureFlags.fg)('platform_editor_react_18_table_column_resize_hover')) {
385
+ var _this$table3;
386
+ this === null || this === void 0 || (_this$table3 = this.table) === null || _this$table3 === void 0 || _this$table3.addEventListener('mouseover', this.handleMouseOver);
387
+ }
378
388
  var _getEditorFeatureFlag = getEditorFeatureFlags(),
379
389
  _getEditorFeatureFlag2 = _getEditorFeatureFlag.tableWithFixedColumnWidthsOption,
380
390
  tableWithFixedColumnWidthsOption = _getEditorFeatureFlag2 === void 0 ? false : _getEditorFeatureFlag2,
@@ -456,12 +466,16 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
456
466
  window.removeEventListener('resize', this.handleWindowResizeDebounced);
457
467
  }
458
468
  if ((0, _platformFeatureFlags.fg)('platform.editor.table.live-pages-sorting_4malx')) {
459
- var _this$table3;
460
- this === null || this === void 0 || (_this$table3 = this.table) === null || _this$table3 === void 0 || _this$table3.removeEventListener('mouseenter', this.handleMouseEnter);
469
+ var _this$table4;
470
+ this === null || this === void 0 || (_this$table4 = this.table) === null || _this$table4 === void 0 || _this$table4.removeEventListener('mouseenter', this.handleMouseEnter);
461
471
  }
462
472
  if ((0, _platformFeatureFlags.fg)('editor_react_18_fix_table_delete_col_decorations')) {
463
- var _this$table4;
464
- this === null || this === void 0 || (_this$table4 = this.table) === null || _this$table4 === void 0 || _this$table4.removeEventListener('mouseout', this.handleMouseOut);
473
+ var _this$table5;
474
+ this === null || this === void 0 || (_this$table5 = this.table) === null || _this$table5 === void 0 || _this$table5.removeEventListener('mouseout', this.handleMouseOut);
475
+ }
476
+ if ((0, _platformFeatureFlags.fg)('platform_editor_react_18_table_column_resize_hover')) {
477
+ var _this$table6;
478
+ this === null || this === void 0 || (_this$table6 = this.table) === null || _this$table6 === void 0 || _this$table6.removeEventListener('mouseover', this.handleMouseOver);
465
479
  }
466
480
  if (this.overflowShadowsObserver) {
467
481
  this.overflowShadowsObserver.dispose();
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _default = exports.default = function _default(mutation) {
8
+ var type = mutation.type,
9
+ _mutation$target = mutation.target,
10
+ nodeName = _mutation$target.nodeName,
11
+ firstChild = _mutation$target.firstChild;
12
+ if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
13
+ return false;
14
+ }
15
+
16
+ // ED-16668
17
+ // Do not remove this fixes an issue with windows firefox that relates to
18
+ // the addition of the shadow sentinels
19
+ if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'TABLE' && ((firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'COLGROUP' || (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'SPAN')) {
20
+ return false;
21
+ }
22
+ return true;
23
+ };
@@ -8,6 +8,7 @@ exports.lazyTableView = exports.lazyTableRowView = exports.lazyTableHeaderView =
8
8
  var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
9
9
  var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
10
10
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
11
+ var _ignoreMutationDelegate = _interopRequireDefault(require("./ignore-mutation-delegate"));
11
12
  var _table = require("./table");
12
13
  var _TableCell = _interopRequireDefault(require("./TableCell"));
13
14
  var _TableRow = _interopRequireDefault(require("./TableRow"));
@@ -46,7 +47,10 @@ var lazyTableView = exports.lazyTableView = function lazyTableView(options) {
46
47
  getNodeViewOptions: function getNodeViewOptions() {
47
48
  return options;
48
49
  },
49
- loader: loader
50
+ loader: loader,
51
+ lazyNodeViewOptions: {
52
+ ignoreMutationDelegate: _ignoreMutationDelegate.default
53
+ }
50
54
  });
51
55
  };
52
56
  var lazyTableCellView = exports.lazyTableCellView = function lazyTableCellView(options) {
@@ -31,6 +31,7 @@ var _tableResizing = require("../pm-plugins/table-resizing");
31
31
  var _utils = require("../pm-plugins/table-resizing/utils");
32
32
  var _tableWidth = require("../pm-plugins/table-width");
33
33
  var _utils2 = require("../utils");
34
+ var _ignoreMutationDelegate = _interopRequireDefault(require("./ignore-mutation-delegate"));
34
35
  var _TableComponent = _interopRequireDefault(require("./TableComponent"));
35
36
  var _TableComponentWithSharedState = require("./TableComponentWithSharedState");
36
37
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
@@ -261,21 +262,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
261
262
  }, {
262
263
  key: "ignoreMutation",
263
264
  value: function ignoreMutation(mutation) {
264
- var type = mutation.type,
265
- _mutation$target = mutation.target,
266
- nodeName = _mutation$target.nodeName,
267
- firstChild = _mutation$target.firstChild;
268
- if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
269
- return false;
270
- }
271
-
272
- // ED-16668
273
- // Do not remove this fixes an issue with windows firefox that relates to
274
- // the addition of the shadow sentinels
275
- if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'TABLE' && ((firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'COLGROUP' || (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'SPAN')) {
276
- return false;
277
- }
278
- return true;
265
+ return (0, _ignoreMutationDelegate.default)(mutation);
279
266
  }
280
267
  }, {
281
268
  key: "destroy",
@@ -279,7 +279,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
279
279
  focus: _eventHandlers.handleFocus,
280
280
  blur: _eventHandlers.handleBlur,
281
281
  mousedown: (0, _eventHandlers.withCellTracking)(_eventHandlers.handleMouseDown),
282
- mouseover: (0, _eventHandlers.withCellTracking)((0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseOver)),
282
+ mouseover: (0, _platformFeatureFlags.fg)('platform_editor_react_18_table_column_resize_hover') ? undefined : (0, _eventHandlers.withCellTracking)((0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseOver)),
283
283
  mouseleave: _eventHandlers.handleMouseLeave,
284
284
  mouseout: (0, _platformFeatureFlags.fg)('editor_react_18_fix_table_delete_col_decorations') ? undefined : (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseOut),
285
285
  mousemove: (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseMove),
@@ -14,7 +14,7 @@ import { findTable, isTableSelected } from '@atlaskit/editor-tables/utils';
14
14
  import { fg } from '@atlaskit/platform-feature-flags';
15
15
  import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
16
16
  import { autoSizeTable, clearHoverSelection } from '../commands';
17
- import { handleMouseOut, isTableInFocus } from '../event-handlers';
17
+ import { handleMouseOut, handleMouseOver, isTableInFocus, withCellTracking } from '../event-handlers';
18
18
  import { autoScrollerFactory } from '../pm-plugins/drag-and-drop/utils';
19
19
  import { getPluginState } from '../pm-plugins/plugin-factory';
20
20
  import { findStickyHeaderForTable, pluginKey as stickyHeadersPluginKey } from '../pm-plugins/sticky-headers';
@@ -59,6 +59,12 @@ class TableComponent extends React.Component {
59
59
  }
60
60
  return handleMouseOut(this.props.view, event);
61
61
  });
62
+ _defineProperty(this, "handleMouseOver", event => {
63
+ if (!isTableInFocus(this.props.view)) {
64
+ return false;
65
+ }
66
+ return withCellTracking(handleMouseOver)(this.props.view, event);
67
+ });
62
68
  _defineProperty(this, "handleMouseEnter", () => {
63
69
  const node = this.props.getNode();
64
70
  const pos = this.props.getPos();
@@ -359,6 +365,10 @@ class TableComponent extends React.Component {
359
365
  var _this$table2;
360
366
  this === null || this === void 0 ? void 0 : (_this$table2 = this.table) === null || _this$table2 === void 0 ? void 0 : _this$table2.addEventListener('mouseout', this.handleMouseOut);
361
367
  }
368
+ if (fg('platform_editor_react_18_table_column_resize_hover')) {
369
+ var _this$table3;
370
+ this === null || this === void 0 ? void 0 : (_this$table3 = this.table) === null || _this$table3 === void 0 ? void 0 : _this$table3.addEventListener('mouseover', this.handleMouseOver);
371
+ }
362
372
  const {
363
373
  tableWithFixedColumnWidthsOption = false,
364
374
  stickyScrollbar
@@ -440,12 +450,16 @@ class TableComponent extends React.Component {
440
450
  window.removeEventListener('resize', this.handleWindowResizeDebounced);
441
451
  }
442
452
  if (fg('platform.editor.table.live-pages-sorting_4malx')) {
443
- var _this$table3;
444
- this === null || this === void 0 ? void 0 : (_this$table3 = this.table) === null || _this$table3 === void 0 ? void 0 : _this$table3.removeEventListener('mouseenter', this.handleMouseEnter);
453
+ var _this$table4;
454
+ this === null || this === void 0 ? void 0 : (_this$table4 = this.table) === null || _this$table4 === void 0 ? void 0 : _this$table4.removeEventListener('mouseenter', this.handleMouseEnter);
445
455
  }
446
456
  if (fg('editor_react_18_fix_table_delete_col_decorations')) {
447
- var _this$table4;
448
- this === null || this === void 0 ? void 0 : (_this$table4 = this.table) === null || _this$table4 === void 0 ? void 0 : _this$table4.removeEventListener('mouseout', this.handleMouseOut);
457
+ var _this$table5;
458
+ this === null || this === void 0 ? void 0 : (_this$table5 = this.table) === null || _this$table5 === void 0 ? void 0 : _this$table5.removeEventListener('mouseout', this.handleMouseOut);
459
+ }
460
+ if (fg('platform_editor_react_18_table_column_resize_hover')) {
461
+ var _this$table6;
462
+ this === null || this === void 0 ? void 0 : (_this$table6 = this.table) === null || _this$table6 === void 0 ? void 0 : _this$table6.removeEventListener('mouseover', this.handleMouseOver);
449
463
  }
450
464
  if (this.overflowShadowsObserver) {
451
465
  this.overflowShadowsObserver.dispose();
@@ -0,0 +1,20 @@
1
+ export default (mutation => {
2
+ const {
3
+ type,
4
+ target: {
5
+ nodeName,
6
+ firstChild
7
+ }
8
+ } = mutation;
9
+ if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
10
+ return false;
11
+ }
12
+
13
+ // ED-16668
14
+ // Do not remove this fixes an issue with windows firefox that relates to
15
+ // the addition of the shadow sentinels
16
+ if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'TABLE' && ((firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'COLGROUP' || (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'SPAN')) {
17
+ return false;
18
+ }
19
+ return true;
20
+ });
@@ -1,5 +1,6 @@
1
1
  import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
2
2
  import { fg } from '@atlaskit/platform-feature-flags';
3
+ import ignoreMutationDelegate from './ignore-mutation-delegate';
3
4
  // TODO: Clean up ED-23976
4
5
  import { createTableView } from './table';
5
6
  import TableCell from './TableCell';
@@ -35,7 +36,10 @@ export const lazyTableView = options => {
35
36
  return withLazyLoading({
36
37
  nodeName: 'table',
37
38
  getNodeViewOptions: () => options,
38
- loader
39
+ loader,
40
+ lazyNodeViewOptions: {
41
+ ignoreMutationDelegate
42
+ }
39
43
  });
40
44
  };
41
45
  export const lazyTableCellView = options => {
@@ -15,6 +15,7 @@ import { pluginKey as tableResizingPluginKey } from '../pm-plugins/table-resizin
15
15
  import { generateColgroup } from '../pm-plugins/table-resizing/utils';
16
16
  import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
17
17
  import { isTableNested } from '../utils';
18
+ import ignoreMutationDelegate from './ignore-mutation-delegate';
18
19
  import TableComponent from './TableComponent';
19
20
  import { TableComponentWithSharedState } from './TableComponentWithSharedState';
20
21
  const tableAttributes = node => {
@@ -227,24 +228,7 @@ export default class TableView extends ReactNodeView {
227
228
  });
228
229
  }
229
230
  ignoreMutation(mutation) {
230
- const {
231
- type,
232
- target: {
233
- nodeName,
234
- firstChild
235
- }
236
- } = mutation;
237
- if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
238
- return false;
239
- }
240
-
241
- // ED-16668
242
- // Do not remove this fixes an issue with windows firefox that relates to
243
- // the addition of the shadow sentinels
244
- if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'TABLE' && ((firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'COLGROUP' || (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'SPAN')) {
245
- return false;
246
- }
247
- return true;
231
+ return ignoreMutationDelegate(mutation);
248
232
  }
249
233
  destroy() {
250
234
  var _this$eventDispatcher;
@@ -277,7 +277,7 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
277
277
  focus: handleFocus,
278
278
  blur: handleBlur,
279
279
  mousedown: withCellTracking(handleMouseDown),
280
- mouseover: withCellTracking(whenTableInFocus(handleMouseOver)),
280
+ mouseover: fg('platform_editor_react_18_table_column_resize_hover') ? undefined : withCellTracking(whenTableInFocus(handleMouseOver)),
281
281
  mouseleave: handleMouseLeave,
282
282
  mouseout: fg('editor_react_18_fix_table_delete_col_decorations') ? undefined : whenTableInFocus(handleMouseOut),
283
283
  mousemove: whenTableInFocus(handleMouseMove),
@@ -28,7 +28,7 @@ import { findTable, isTableSelected } from '@atlaskit/editor-tables/utils';
28
28
  import { fg } from '@atlaskit/platform-feature-flags';
29
29
  import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
30
30
  import { autoSizeTable, clearHoverSelection } from '../commands';
31
- import { handleMouseOut, isTableInFocus } from '../event-handlers';
31
+ import { handleMouseOut, handleMouseOver, isTableInFocus, withCellTracking } from '../event-handlers';
32
32
  import { autoScrollerFactory } from '../pm-plugins/drag-and-drop/utils';
33
33
  import { getPluginState } from '../pm-plugins/plugin-factory';
34
34
  import { findStickyHeaderForTable, pluginKey as stickyHeadersPluginKey } from '../pm-plugins/sticky-headers';
@@ -74,6 +74,12 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
74
74
  }
75
75
  return handleMouseOut(_this.props.view, event);
76
76
  });
77
+ _defineProperty(_assertThisInitialized(_this), "handleMouseOver", function (event) {
78
+ if (!isTableInFocus(_this.props.view)) {
79
+ return false;
80
+ }
81
+ return withCellTracking(handleMouseOver)(_this.props.view, event);
82
+ });
77
83
  _defineProperty(_assertThisInitialized(_this), "handleMouseEnter", function () {
78
84
  var node = _this.props.getNode();
79
85
  var pos = _this.props.getPos();
@@ -368,6 +374,10 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
368
374
  var _this$table2;
369
375
  this === null || this === void 0 || (_this$table2 = this.table) === null || _this$table2 === void 0 || _this$table2.addEventListener('mouseout', this.handleMouseOut);
370
376
  }
377
+ if (fg('platform_editor_react_18_table_column_resize_hover')) {
378
+ var _this$table3;
379
+ this === null || this === void 0 || (_this$table3 = this.table) === null || _this$table3 === void 0 || _this$table3.addEventListener('mouseover', this.handleMouseOver);
380
+ }
371
381
  var _getEditorFeatureFlag = getEditorFeatureFlags(),
372
382
  _getEditorFeatureFlag2 = _getEditorFeatureFlag.tableWithFixedColumnWidthsOption,
373
383
  tableWithFixedColumnWidthsOption = _getEditorFeatureFlag2 === void 0 ? false : _getEditorFeatureFlag2,
@@ -449,12 +459,16 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
449
459
  window.removeEventListener('resize', this.handleWindowResizeDebounced);
450
460
  }
451
461
  if (fg('platform.editor.table.live-pages-sorting_4malx')) {
452
- var _this$table3;
453
- this === null || this === void 0 || (_this$table3 = this.table) === null || _this$table3 === void 0 || _this$table3.removeEventListener('mouseenter', this.handleMouseEnter);
462
+ var _this$table4;
463
+ this === null || this === void 0 || (_this$table4 = this.table) === null || _this$table4 === void 0 || _this$table4.removeEventListener('mouseenter', this.handleMouseEnter);
454
464
  }
455
465
  if (fg('editor_react_18_fix_table_delete_col_decorations')) {
456
- var _this$table4;
457
- this === null || this === void 0 || (_this$table4 = this.table) === null || _this$table4 === void 0 || _this$table4.removeEventListener('mouseout', this.handleMouseOut);
466
+ var _this$table5;
467
+ this === null || this === void 0 || (_this$table5 = this.table) === null || _this$table5 === void 0 || _this$table5.removeEventListener('mouseout', this.handleMouseOut);
468
+ }
469
+ if (fg('platform_editor_react_18_table_column_resize_hover')) {
470
+ var _this$table6;
471
+ this === null || this === void 0 || (_this$table6 = this.table) === null || _this$table6 === void 0 || _this$table6.removeEventListener('mouseover', this.handleMouseOver);
458
472
  }
459
473
  if (this.overflowShadowsObserver) {
460
474
  this.overflowShadowsObserver.dispose();
@@ -0,0 +1,17 @@
1
+ export default (function (mutation) {
2
+ var type = mutation.type,
3
+ _mutation$target = mutation.target,
4
+ nodeName = _mutation$target.nodeName,
5
+ firstChild = _mutation$target.firstChild;
6
+ if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
7
+ return false;
8
+ }
9
+
10
+ // ED-16668
11
+ // Do not remove this fixes an issue with windows firefox that relates to
12
+ // the addition of the shadow sentinels
13
+ if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'TABLE' && ((firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'COLGROUP' || (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'SPAN')) {
14
+ return false;
15
+ }
16
+ return true;
17
+ });
@@ -1,5 +1,6 @@
1
1
  import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
2
2
  import { fg } from '@atlaskit/platform-feature-flags';
3
+ import ignoreMutationDelegate from './ignore-mutation-delegate';
3
4
  // TODO: Clean up ED-23976
4
5
  import { createTableView } from './table';
5
6
  import TableCell from './TableCell';
@@ -35,7 +36,10 @@ export var lazyTableView = function lazyTableView(options) {
35
36
  getNodeViewOptions: function getNodeViewOptions() {
36
37
  return options;
37
38
  },
38
- loader: loader
39
+ loader: loader,
40
+ lazyNodeViewOptions: {
41
+ ignoreMutationDelegate: ignoreMutationDelegate
42
+ }
39
43
  });
40
44
  };
41
45
  export var lazyTableCellView = function lazyTableCellView(options) {
@@ -26,6 +26,7 @@ import { pluginKey as tableResizingPluginKey } from '../pm-plugins/table-resizin
26
26
  import { generateColgroup } from '../pm-plugins/table-resizing/utils';
27
27
  import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
28
28
  import { isTableNested } from '../utils';
29
+ import ignoreMutationDelegate from './ignore-mutation-delegate';
29
30
  import TableComponent from './TableComponent';
30
31
  import { TableComponentWithSharedState } from './TableComponentWithSharedState';
31
32
  var tableAttributes = function tableAttributes(node) {
@@ -254,21 +255,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
254
255
  }, {
255
256
  key: "ignoreMutation",
256
257
  value: function ignoreMutation(mutation) {
257
- var type = mutation.type,
258
- _mutation$target = mutation.target,
259
- nodeName = _mutation$target.nodeName,
260
- firstChild = _mutation$target.firstChild;
261
- if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
262
- return false;
263
- }
264
-
265
- // ED-16668
266
- // Do not remove this fixes an issue with windows firefox that relates to
267
- // the addition of the shadow sentinels
268
- if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'TABLE' && ((firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'COLGROUP' || (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'SPAN')) {
269
- return false;
270
- }
271
- return true;
258
+ return ignoreMutationDelegate(mutation);
272
259
  }
273
260
  }, {
274
261
  key: "destroy",
@@ -272,7 +272,7 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
272
272
  focus: handleFocus,
273
273
  blur: handleBlur,
274
274
  mousedown: withCellTracking(handleMouseDown),
275
- mouseover: withCellTracking(whenTableInFocus(handleMouseOver)),
275
+ mouseover: fg('platform_editor_react_18_table_column_resize_hover') ? undefined : withCellTracking(whenTableInFocus(handleMouseOver)),
276
276
  mouseleave: handleMouseLeave,
277
277
  mouseout: fg('editor_react_18_fix_table_delete_col_decorations') ? undefined : whenTableInFocus(handleMouseOut),
278
278
  mousemove: whenTableInFocus(handleMouseMove),
@@ -0,0 +1,5 @@
1
+ declare const _default: (mutation: MutationRecord | {
2
+ type: 'selection';
3
+ target: Element;
4
+ }) => boolean;
5
+ export default _default;
@@ -0,0 +1,5 @@
1
+ declare const _default: (mutation: MutationRecord | {
2
+ type: 'selection';
3
+ target: Element;
4
+ }) => boolean;
5
+ export default _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "7.24.8",
3
+ "version": "7.25.1",
4
4
  "description": "Table plugin for the @atlaskit/editor",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -28,14 +28,14 @@
28
28
  "runReact18": false
29
29
  },
30
30
  "dependencies": {
31
- "@atlaskit/adf-schema": "^40.3.0",
31
+ "@atlaskit/adf-schema": "^40.8.1",
32
32
  "@atlaskit/button": "^19.1.0",
33
- "@atlaskit/custom-steps": "^0.6.0",
34
- "@atlaskit/editor-common": "^87.5.0",
33
+ "@atlaskit/custom-steps": "^0.7.0",
34
+ "@atlaskit/editor-common": "^87.6.0",
35
35
  "@atlaskit/editor-palette": "1.6.0",
36
36
  "@atlaskit/editor-plugin-accessibility-utils": "^1.2.0",
37
- "@atlaskit/editor-plugin-analytics": "^1.6.0",
38
- "@atlaskit/editor-plugin-content-insertion": "^1.6.0",
37
+ "@atlaskit/editor-plugin-analytics": "^1.7.0",
38
+ "@atlaskit/editor-plugin-content-insertion": "^1.7.0",
39
39
  "@atlaskit/editor-plugin-editor-viewmode": "^2.1.0",
40
40
  "@atlaskit/editor-plugin-guideline": "^1.2.0",
41
41
  "@atlaskit/editor-plugin-selection": "^1.3.0",
@@ -43,13 +43,13 @@
43
43
  "@atlaskit/editor-prosemirror": "5.0.1",
44
44
  "@atlaskit/editor-shared-styles": "^2.13.0",
45
45
  "@atlaskit/editor-tables": "^2.8.0",
46
- "@atlaskit/icon": "^22.10.0",
46
+ "@atlaskit/icon": "^22.11.0",
47
47
  "@atlaskit/menu": "^2.10.0",
48
48
  "@atlaskit/platform-feature-flags": "^0.3.0",
49
- "@atlaskit/pragmatic-drag-and-drop": "^1.2.0",
49
+ "@atlaskit/pragmatic-drag-and-drop": "^1.3.0",
50
50
  "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^1.4.0",
51
51
  "@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.0.0",
52
- "@atlaskit/primitives": "^11.1.0",
52
+ "@atlaskit/primitives": "^12.0.0",
53
53
  "@atlaskit/theme": "^12.11.0",
54
54
  "@atlaskit/toggle": "^13.2.0",
55
55
  "@atlaskit/tokens": "^1.57.0",
@@ -125,6 +125,9 @@
125
125
  },
126
126
  "platform_editor_announce_cell_options_hotkeys": {
127
127
  "type": "boolean"
128
+ },
129
+ "platform_editor_react_18_table_column_resize_hover": {
130
+ "type": "boolean"
128
131
  }
129
132
  }
130
133
  }
@@ -26,7 +26,12 @@ import type { CleanupFn } from '@atlaskit/pragmatic-drag-and-drop/types';
26
26
  import { token } from '@atlaskit/tokens';
27
27
 
28
28
  import { autoSizeTable, clearHoverSelection } from '../commands';
29
- import { handleMouseOut, isTableInFocus } from '../event-handlers';
29
+ import {
30
+ handleMouseOut,
31
+ handleMouseOver,
32
+ isTableInFocus,
33
+ withCellTracking,
34
+ } from '../event-handlers';
30
35
  import { autoScrollerFactory } from '../pm-plugins/drag-and-drop/utils';
31
36
  import { getPluginState } from '../pm-plugins/plugin-factory';
32
37
  import type { RowStickyState, StickyPluginState } from '../pm-plugins/sticky-headers';
@@ -194,6 +199,13 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
194
199
  return handleMouseOut(this.props.view, event);
195
200
  };
196
201
 
202
+ private handleMouseOver = (event: Event) => {
203
+ if (!isTableInFocus(this.props.view)) {
204
+ return false;
205
+ }
206
+ return withCellTracking(handleMouseOver)(this.props.view, event);
207
+ };
208
+
197
209
  componentDidMount() {
198
210
  const {
199
211
  allowColumnResizing,
@@ -215,6 +227,9 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
215
227
  if (fg('editor_react_18_fix_table_delete_col_decorations')) {
216
228
  this?.table?.addEventListener('mouseout', this.handleMouseOut);
217
229
  }
230
+ if (fg('platform_editor_react_18_table_column_resize_hover')) {
231
+ this?.table?.addEventListener('mouseover', this.handleMouseOver);
232
+ }
218
233
 
219
234
  const { tableWithFixedColumnWidthsOption = false, stickyScrollbar } = getEditorFeatureFlags();
220
235
 
@@ -322,6 +337,9 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
322
337
  if (fg('editor_react_18_fix_table_delete_col_decorations')) {
323
338
  this?.table?.removeEventListener('mouseout', this.handleMouseOut);
324
339
  }
340
+ if (fg('platform_editor_react_18_table_column_resize_hover')) {
341
+ this?.table?.removeEventListener('mouseover', this.handleMouseOver);
342
+ }
325
343
 
326
344
  if (this.overflowShadowsObserver) {
327
345
  this.overflowShadowsObserver.dispose();
@@ -0,0 +1,28 @@
1
+ export default (mutation: MutationRecord | { type: 'selection'; target: Element }) => {
2
+ const {
3
+ type,
4
+ target: { nodeName, firstChild },
5
+ } = mutation;
6
+
7
+ if (
8
+ type === 'selection' &&
9
+ nodeName?.toUpperCase() === 'DIV' &&
10
+ firstChild?.nodeName.toUpperCase() === 'TABLE'
11
+ ) {
12
+ return false;
13
+ }
14
+
15
+ // ED-16668
16
+ // Do not remove this fixes an issue with windows firefox that relates to
17
+ // the addition of the shadow sentinels
18
+ if (
19
+ type === 'selection' &&
20
+ nodeName?.toUpperCase() === 'TABLE' &&
21
+ (firstChild?.nodeName.toUpperCase() === 'COLGROUP' ||
22
+ firstChild?.nodeName.toUpperCase() === 'SPAN')
23
+ ) {
24
+ return false;
25
+ }
26
+
27
+ return true;
28
+ };
@@ -9,6 +9,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
9
9
 
10
10
  import type { PluginInjectionAPI } from '../types';
11
11
 
12
+ import ignoreMutationDelegate from './ignore-mutation-delegate';
12
13
  // TODO: Clean up ED-23976
13
14
  import { createTableView } from './table';
14
15
  import TableCell from './TableCell';
@@ -93,6 +94,9 @@ export const lazyTableView = (options: TableViewOptions) => {
93
94
  nodeName: 'table',
94
95
  getNodeViewOptions: () => options,
95
96
  loader,
97
+ lazyNodeViewOptions: {
98
+ ignoreMutationDelegate,
99
+ },
96
100
  });
97
101
  };
98
102
 
@@ -31,6 +31,7 @@ import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
31
31
  import type { PluginInjectionAPI } from '../types';
32
32
  import { isTableNested } from '../utils';
33
33
 
34
+ import ignoreMutationDelegate from './ignore-mutation-delegate';
34
35
  import TableComponent from './TableComponent';
35
36
  import { TableComponentWithSharedState } from './TableComponentWithSharedState';
36
37
  import type { Props } from './types';
@@ -315,32 +316,7 @@ export default class TableView extends ReactNodeView<Props> {
315
316
  }
316
317
 
317
318
  ignoreMutation(mutation: MutationRecord | { type: 'selection'; target: Element }) {
318
- const {
319
- type,
320
- target: { nodeName, firstChild },
321
- } = mutation;
322
-
323
- if (
324
- type === 'selection' &&
325
- nodeName?.toUpperCase() === 'DIV' &&
326
- firstChild?.nodeName.toUpperCase() === 'TABLE'
327
- ) {
328
- return false;
329
- }
330
-
331
- // ED-16668
332
- // Do not remove this fixes an issue with windows firefox that relates to
333
- // the addition of the shadow sentinels
334
- if (
335
- type === 'selection' &&
336
- nodeName?.toUpperCase() === 'TABLE' &&
337
- (firstChild?.nodeName.toUpperCase() === 'COLGROUP' ||
338
- firstChild?.nodeName.toUpperCase() === 'SPAN')
339
- ) {
340
- return false;
341
- }
342
-
343
- return true;
319
+ return ignoreMutationDelegate(mutation);
344
320
  }
345
321
 
346
322
  destroy() {
@@ -371,7 +371,9 @@ export const createPlugin = (
371
371
  focus: handleFocus,
372
372
  blur: handleBlur,
373
373
  mousedown: withCellTracking(handleMouseDown),
374
- mouseover: withCellTracking(whenTableInFocus(handleMouseOver)),
374
+ mouseover: fg('platform_editor_react_18_table_column_resize_hover')
375
+ ? undefined
376
+ : withCellTracking(whenTableInFocus(handleMouseOver)),
375
377
  mouseleave: handleMouseLeave,
376
378
  mouseout: fg('editor_react_18_fix_table_delete_col_decorations')
377
379
  ? undefined