@atlaskit/editor-plugin-table 1.2.1 → 1.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/cjs/i18n/en.js +43 -0
  3. package/dist/cjs/i18n/en_GB.js +43 -0
  4. package/dist/cjs/plugins/table/nodeviews/OverflowShadowsObserver.js +13 -26
  5. package/dist/cjs/plugins/table/nodeviews/TableComponent.js +17 -1
  6. package/dist/cjs/plugins/table/nodeviews/table.js +7 -0
  7. package/dist/cjs/plugins/table/transforms/delete-rows.js +1 -1
  8. package/dist/cjs/plugins/table/transforms/index.js +3 -3
  9. package/dist/cjs/plugins/table/transforms/merge.js +39 -54
  10. package/dist/cjs/plugins/table/ui/common-styles.js +2 -2
  11. package/dist/cjs/plugins/table/utils/row-controls.js +3 -2
  12. package/dist/cjs/version.json +1 -1
  13. package/dist/es2019/i18n/en.js +36 -0
  14. package/dist/es2019/i18n/en_GB.js +36 -0
  15. package/dist/es2019/plugins/table/nodeviews/OverflowShadowsObserver.js +13 -26
  16. package/dist/es2019/plugins/table/nodeviews/TableComponent.js +21 -1
  17. package/dist/es2019/plugins/table/nodeviews/table.js +7 -0
  18. package/dist/es2019/plugins/table/transforms/delete-rows.js +2 -2
  19. package/dist/es2019/plugins/table/transforms/index.js +1 -1
  20. package/dist/es2019/plugins/table/transforms/merge.js +39 -43
  21. package/dist/es2019/plugins/table/ui/common-styles.js +20 -1
  22. package/dist/es2019/plugins/table/utils/row-controls.js +3 -2
  23. package/dist/es2019/version.json +1 -1
  24. package/dist/esm/i18n/en.js +36 -0
  25. package/dist/esm/i18n/en_GB.js +36 -0
  26. package/dist/esm/plugins/table/nodeviews/OverflowShadowsObserver.js +13 -26
  27. package/dist/esm/plugins/table/nodeviews/TableComponent.js +17 -1
  28. package/dist/esm/plugins/table/nodeviews/table.js +7 -0
  29. package/dist/esm/plugins/table/transforms/delete-rows.js +2 -2
  30. package/dist/esm/plugins/table/transforms/index.js +1 -1
  31. package/dist/esm/plugins/table/transforms/merge.js +38 -53
  32. package/dist/esm/plugins/table/ui/common-styles.js +2 -2
  33. package/dist/esm/plugins/table/utils/row-controls.js +3 -2
  34. package/dist/esm/version.json +1 -1
  35. package/dist/types/i18n/en.d.ts +35 -0
  36. package/dist/types/i18n/en_GB.d.ts +35 -0
  37. package/dist/types/plugins/table/nodeviews/OverflowShadowsObserver.d.ts +4 -5
  38. package/dist/types/plugins/table/nodeviews/TableComponent.d.ts +1 -0
  39. package/dist/types/plugins/table/nodeviews/__mocks__/OverflowShadowsObserver.d.ts +3 -3
  40. package/dist/types/plugins/table/transforms/index.d.ts +1 -1
  41. package/dist/types/plugins/table/transforms/merge.d.ts +1 -1
  42. package/dist/types/plugins/table/types.d.ts +2 -0
  43. package/package.json +7 -6
  44. package/src/__tests__/integration/__fixtures__/table-and-paragraph-adf.ts +130 -0
  45. package/src/__tests__/integration/horizontal-scroll-shadows.ts +199 -0
  46. package/src/__tests__/integration/meta-arrowup-cursor-in-first-row.ts +4 -2
  47. package/src/__tests__/unit/commands/sort.ts +4 -0
  48. package/src/__tests__/unit/commands.ts +2 -0
  49. package/src/__tests__/unit/index.ts +2 -0
  50. package/src/__tests__/unit/keymap.ts +4 -2
  51. package/src/__tests__/unit/layout.ts +2 -0
  52. package/src/__tests__/unit/nodeviews/OverflowShadowsObserver.ts +20 -11
  53. package/src/__tests__/unit/pm-plugins/main-with-allow-collapse.ts +2 -0
  54. package/src/__tests__/unit/transforms/delete-rows.ts +45 -0
  55. package/src/__tests__/unit/utils/collapse.ts +4 -1
  56. package/src/i18n/en.ts +36 -0
  57. package/src/i18n/en_GB.ts +36 -0
  58. package/src/plugins/table/nodeviews/OverflowShadowsObserver.ts +24 -40
  59. package/src/plugins/table/nodeviews/TableComponent.tsx +19 -2
  60. package/src/plugins/table/nodeviews/__mocks__/OverflowShadowsObserver.ts +3 -3
  61. package/src/plugins/table/nodeviews/table.tsx +12 -0
  62. package/src/plugins/table/transforms/delete-rows.ts +2 -2
  63. package/src/plugins/table/transforms/index.ts +1 -1
  64. package/src/plugins/table/transforms/merge.ts +41 -43
  65. package/src/plugins/table/ui/common-styles.ts +20 -0
  66. package/src/plugins/table/utils/row-controls.ts +3 -2
  67. package/src/__tests__/integration/__fixtures__/table-and-paragraph-adf.json +0 -130
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-table
2
2
 
3
+ ## 1.2.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`ef830fdabfa`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ef830fdabfa) - [ED-17294] Enable type checking for Preset plugins on unit tests
8
+ - [`b7f9b82ecd8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b7f9b82ecd8) - [ED-16109] Fix deleting rows with row above and below having merged cells
9
+ - [`7946da1848a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7946da1848a) - [ux] [ED-16668] Update table shadow intersection table to observe new shadow sentinels instead of first and last cell
10
+ - Updated dependencies
11
+
3
12
  ## 1.2.1
4
13
 
5
14
  ### Patch Changes
@@ -0,0 +1,43 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ /* prettier-ignore */
8
+ /**
9
+ * NOTE:
10
+ *
11
+ * This file is automatically generated by Traduki 2.0.
12
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
13
+ */
14
+ //
15
+ var _default = {
16
+ 'fabric.editor.canNotSortTable': "⚠️ You can't sort a table with merged cells",
17
+ 'fabric.editor.cellBackground': 'Cell background',
18
+ 'fabric.editor.cellOptions': 'Cell options',
19
+ 'fabric.editor.clearCells': 'Clear {0, plural, one {cell} other {cells}}',
20
+ 'fabric.editor.collapseTable': 'Collapse table',
21
+ 'fabric.editor.cornerControl': 'Highlight table',
22
+ 'fabric.editor.distributeColumns': 'Distribute columns',
23
+ 'fabric.editor.extension.confirmDeleteLinkedModalMessagePrefix': 'Deleting',
24
+ 'fabric.editor.extension.deleteElementTitle': 'Delete element',
25
+ 'fabric.editor.extension.sourceNoTitledName': 'this element',
26
+ 'fabric.editor.floatingToolbar.confirmModalCheckboxLabel': 'Also delete connected elements',
27
+ 'fabric.editor.headerColumn': 'Header column',
28
+ 'fabric.editor.headerRow': 'Header row',
29
+ 'fabric.editor.insertColumn': 'Insert column right',
30
+ 'fabric.editor.insertRow': 'Insert row below',
31
+ 'fabric.editor.mergeCells': 'Merge cells',
32
+ 'fabric.editor.numberedColumn': 'Numbered column',
33
+ 'fabric.editor.removeColumns': 'Delete {0, plural, one {column} other {columns}}',
34
+ 'fabric.editor.removeRows': 'Delete {0, plural, one {row} other {rows}}',
35
+ 'fabric.editor.rowControl': 'Highlight row',
36
+ 'fabric.editor.sortColumnASC': 'Sort column A → Z',
37
+ 'fabric.editor.sortColumnDESC': 'Sort column Z → A',
38
+ 'fabric.editor.splitCell': 'Split cell',
39
+ 'fabric.editor.tableOptions': 'Table options',
40
+ 'fabric.editor.tables.confirmDeleteLinkedModalMessage': 'Deleting {nodeName} will break anything connected to it.',
41
+ 'fabric.editor.tables.confirmDeleteLinkedModalOKButton': 'Delete'
42
+ };
43
+ exports.default = _default;
@@ -0,0 +1,43 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ /* prettier-ignore */
8
+ /**
9
+ * NOTE:
10
+ *
11
+ * This file is automatically generated by Traduki 2.0.
12
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
13
+ */
14
+ //English (United Kingdom)
15
+ var _default = {
16
+ 'fabric.editor.canNotSortTable': "⚠️ You can't sort a table with merged cells",
17
+ 'fabric.editor.cellBackground': 'Cell background',
18
+ 'fabric.editor.cellOptions': 'Cell options',
19
+ 'fabric.editor.clearCells': 'Clear {0, plural, one {cell} other {cells}}',
20
+ 'fabric.editor.collapseTable': 'Collapse table',
21
+ 'fabric.editor.cornerControl': 'Highlight table',
22
+ 'fabric.editor.distributeColumns': 'Distribute columns',
23
+ 'fabric.editor.extension.confirmDeleteLinkedModalMessagePrefix': 'Deleting',
24
+ 'fabric.editor.extension.deleteElementTitle': 'Delete element',
25
+ 'fabric.editor.extension.sourceNoTitledName': 'this element',
26
+ 'fabric.editor.floatingToolbar.confirmModalCheckboxLabel': 'Also delete connected elements',
27
+ 'fabric.editor.headerColumn': 'Header column',
28
+ 'fabric.editor.headerRow': 'Header row',
29
+ 'fabric.editor.insertColumn': 'Insert column right',
30
+ 'fabric.editor.insertRow': 'Insert row below',
31
+ 'fabric.editor.mergeCells': 'Merge cells',
32
+ 'fabric.editor.numberedColumn': 'Numbered column',
33
+ 'fabric.editor.removeColumns': 'Delete {0, plural, one {column} other {columns}}',
34
+ 'fabric.editor.removeRows': 'Delete {0, plural, one {row} other {rows}}',
35
+ 'fabric.editor.rowControl': 'Highlight row',
36
+ 'fabric.editor.sortColumnASC': 'Sort column A → Z',
37
+ 'fabric.editor.sortColumnDESC': 'Sort column Z → A',
38
+ 'fabric.editor.splitCell': 'Split cell',
39
+ 'fabric.editor.tableOptions': 'Table options',
40
+ 'fabric.editor.tables.confirmDeleteLinkedModalMessage': 'Deleting {nodeName} will break anything connected to it.',
41
+ 'fabric.editor.tables.confirmDeleteLinkedModalOKButton': 'Delete'
42
+ };
43
+ exports.default = _default;
@@ -16,16 +16,9 @@ var OverflowShadowsObserver = /*#__PURE__*/function () {
16
16
  function OverflowShadowsObserver(updateShadowState, _table, wrapper) {
17
17
  var _this = this;
18
18
  (0, _classCallCheck2.default)(this, OverflowShadowsObserver);
19
- (0, _defineProperty2.default)(this, "firstCell", null);
20
- (0, _defineProperty2.default)(this, "lastCell", null);
21
- (0, _defineProperty2.default)(this, "getFirstCell", function (isSticky, hasHeaderRow) {
22
- var _this$table;
23
- return (_this$table = _this.table) === null || _this$table === void 0 ? void 0 : _this$table.querySelector(isSticky || !hasHeaderRow ? 'table tbody tr td' : 'table tbody tr th');
24
- });
25
- (0, _defineProperty2.default)(this, "getLastCell", function (isSticky, hasHeaderRow) {
26
- var _this$table2;
27
- return (_this$table2 = _this.table) === null || _this$table2 === void 0 ? void 0 : _this$table2.querySelector(isSticky || !hasHeaderRow ? 'table tbody tr td:last-child' : 'table tbody tr th:last-child');
28
- });
19
+ (0, _defineProperty2.default)(this, "leftShadowSentinel", null);
20
+ (0, _defineProperty2.default)(this, "rightShadowSentinel", null);
21
+ (0, _defineProperty2.default)(this, "shadowsObserved", false);
29
22
  (0, _defineProperty2.default)(this, "isSticky", false);
30
23
  (0, _defineProperty2.default)(this, "stickyRowHeight", 0);
31
24
  (0, _defineProperty2.default)(this, "init", function () {
@@ -39,11 +32,11 @@ var OverflowShadowsObserver = /*#__PURE__*/function () {
39
32
  if (!((_entry$rootBounds = entry.rootBounds) !== null && _entry$rootBounds !== void 0 && _entry$rootBounds.height) && !((_entry$rootBounds2 = entry.rootBounds) !== null && _entry$rootBounds2 !== void 0 && _entry$rootBounds2.width)) {
40
33
  return;
41
34
  }
42
- if (entry.target !== _this.firstCell && entry.target !== _this.lastCell) {
35
+ if (entry.target !== _this.leftShadowSentinel && entry.target !== _this.rightShadowSentinel) {
43
36
  return;
44
37
  }
45
38
  _this.updateStickyShadowsHeightIfChanged();
46
- _this.checkIntersectionEvent(entry, _this.firstCell === entry.target ? _types.ShadowEvent.SHOW_BEFORE_SHADOW : _types.ShadowEvent.SHOW_AFTER_SHADOW);
39
+ _this.checkIntersectionEvent(entry, _this.leftShadowSentinel === entry.target ? _types.ShadowEvent.SHOW_BEFORE_SHADOW : _types.ShadowEvent.SHOW_AFTER_SHADOW);
47
40
  };
48
41
  _this.tableIntersectionObserver = new IntersectionObserver(function (entries, _) {
49
42
  entries.forEach(function (entry) {
@@ -68,25 +61,19 @@ var OverflowShadowsObserver = /*#__PURE__*/function () {
68
61
  _this.updateShadowState(shadowKey, true);
69
62
  }
70
63
  });
71
- (0, _defineProperty2.default)(this, "observeCells", function (isSticky, hasHeaderRow) {
72
- var stickyChanged = !!isSticky !== _this.isSticky;
64
+ (0, _defineProperty2.default)(this, "observeShadowSentinels", function (isSticky) {
65
+ var _this$table, _this$table2;
73
66
  _this.isSticky = !!isSticky;
74
67
 
75
68
  // update sticky shadows
76
69
  _this.updateStickyShadowsHeightIfChanged();
77
- if (!stickyChanged) {
78
- var firstCell = _this.getFirstCell(isSticky, hasHeaderRow);
79
- var lastCell = _this.getLastCell(isSticky, hasHeaderRow);
80
- if (!firstCell || !lastCell || firstCell === _this.firstCell && lastCell === _this.lastCell) {
81
- return;
82
- }
83
- }
84
- _this.firstCell = _this.getFirstCell(isSticky, hasHeaderRow);
85
- _this.lastCell = _this.getLastCell(isSticky, hasHeaderRow);
86
- if (_this.tableIntersectionObserver && _this.firstCell && _this.lastCell) {
70
+ _this.leftShadowSentinel = (_this$table = _this.table) === null || _this$table === void 0 ? void 0 : _this$table.querySelector(".".concat(_types.TableCssClassName.TABLE_SHADOW_SENTINEL_LEFT));
71
+ _this.rightShadowSentinel = (_this$table2 = _this.table) === null || _this$table2 === void 0 ? void 0 : _this$table2.querySelector(".".concat(_types.TableCssClassName.TABLE_SHADOW_SENTINEL_RIGHT));
72
+ if (_this.tableIntersectionObserver && _this.leftShadowSentinel && _this.rightShadowSentinel && !_this.shadowsObserved) {
87
73
  _this.tableIntersectionObserver.disconnect();
88
- _this.tableIntersectionObserver.observe(_this.firstCell);
89
- _this.tableIntersectionObserver.observe(_this.lastCell);
74
+ _this.tableIntersectionObserver.observe(_this.leftShadowSentinel);
75
+ _this.tableIntersectionObserver.observe(_this.rightShadowSentinel);
76
+ _this.shadowsObserved = true;
90
77
  }
91
78
  });
92
79
  (0, _defineProperty2.default)(this, "updateStickyShadows", function (stickyRowHeight) {
@@ -64,6 +64,16 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
64
64
  }
65
65
  _this.setState((0, _defineProperty3.default)({}, shadowKey, value));
66
66
  });
67
+ (0, _defineProperty3.default)((0, _assertThisInitialized2.default)(_this), "createShadowSentinels", function (table) {
68
+ if (table) {
69
+ var shadowSentinelLeft = document.createElement('span');
70
+ shadowSentinelLeft.className = _types.TableCssClassName.TABLE_SHADOW_SENTINEL_LEFT;
71
+ var shadowSentinelRight = document.createElement('span');
72
+ shadowSentinelRight.className = _types.TableCssClassName.TABLE_SHADOW_SENTINEL_RIGHT;
73
+ table.prepend(shadowSentinelLeft);
74
+ table.prepend(shadowSentinelRight);
75
+ }
76
+ });
67
77
  (0, _defineProperty3.default)((0, _assertThisInitialized2.default)(_this), "onStickyState", function (state) {
68
78
  var _this$props$getEditor = _this.props.getEditorFeatureFlags(),
69
79
  tableOverflowShadowsOptimization = _this$props$getEditor.tableOverflowShadowsOptimization;
@@ -112,6 +122,11 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
112
122
  if (!tableOverflowShadowsOptimization) {
113
123
  _this.updateShadows();
114
124
  }
125
+ if (_this.wrapper.scrollLeft === 0) {
126
+ _this.setState((0, _defineProperty3.default)({}, _types.ShadowEvent.SHOW_BEFORE_SHADOW, false));
127
+ } else {
128
+ _this.setState((0, _defineProperty3.default)({}, _types.ShadowEvent.SHOW_BEFORE_SHADOW, true));
129
+ }
115
130
  });
116
131
  (0, _defineProperty3.default)((0, _assertThisInitialized2.default)(_this), "handleTableResizing", function () {
117
132
  var _this$props = _this.props,
@@ -367,7 +382,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
367
382
  }
368
383
  if (this.overflowShadowsObserver) {
369
384
  var _this$state$stickyHea;
370
- this.overflowShadowsObserver.observeCells((_this$state$stickyHea = this.state.stickyHeader) === null || _this$state$stickyHea === void 0 ? void 0 : _this$state$stickyHea.sticky, (0, _utils4.containsHeaderRow)(getNode()));
385
+ this.overflowShadowsObserver.observeShadowSentinels((_this$state$stickyHea = this.state.stickyHeader) === null || _this$state$stickyHea === void 0 ? void 0 : _this$state$stickyHea.sticky);
371
386
  }
372
387
  }
373
388
  var currentTable = getNode();
@@ -495,6 +510,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
495
510
  var tableElement = elem.querySelector('table');
496
511
  if (tableElement !== _this2.table) {
497
512
  _this2.table = tableElement;
513
+ _this2.createShadowSentinels(_this2.table);
498
514
  }
499
515
  }
500
516
  }
@@ -179,6 +179,13 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
179
179
  if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
180
180
  return false;
181
181
  }
182
+
183
+ // ED-16668
184
+ // Do not remove this fixes an issue with windows firefox that relates to
185
+ // the addition of the shadow sentinels
186
+ 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')) {
187
+ return false;
188
+ }
182
189
  return true;
183
190
  }
184
191
  }, {
@@ -114,7 +114,7 @@ var deleteRows = function deleteRows(rect) {
114
114
  })(tr);
115
115
  }
116
116
  var newTable = table.node.type.createChecked(table.node.attrs, rows, table.node.marks);
117
- var fixedTable = (0, _merge.removeEmptyColumns)(newTable);
117
+ var fixedTable = (0, _merge.mergeEmptyColumns)(newTable);
118
118
  if (fixedTable === null) {
119
119
  return (0, _metadata.setMeta)({
120
120
  type: 'DELETE_ROWS',
@@ -45,10 +45,10 @@ Object.defineProperty(exports, "mergeCells", {
45
45
  return _merge.mergeCells;
46
46
  }
47
47
  });
48
- Object.defineProperty(exports, "removeEmptyColumns", {
48
+ Object.defineProperty(exports, "mergeEmptyColumns", {
49
49
  enumerable: true,
50
50
  get: function get() {
51
- return _merge.removeEmptyColumns;
51
+ return _merge.mergeEmptyColumns;
52
52
  }
53
53
  });
54
54
  Object.defineProperty(exports, "replaceSelectedTable", {
@@ -69,8 +69,8 @@ Object.defineProperty(exports, "updateColumnWidths", {
69
69
  return _columnWidth.updateColumnWidths;
70
70
  }
71
71
  });
72
- var _merge = require("./merge");
73
72
  var _fixTables = require("./fix-tables");
73
+ var _merge = require("./merge");
74
74
  var _deleteColumns = require("./delete-columns");
75
75
  var _deleteRows = require("./delete-rows");
76
76
  var _columnWidth = require("./column-width");
@@ -6,9 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.canMergeCells = canMergeCells;
8
8
  exports.mergeCells = mergeCells;
9
- exports.removeEmptyColumns = removeEmptyColumns;
10
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
11
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
9
+ exports.mergeEmptyColumns = mergeEmptyColumns;
12
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
11
  var _prosemirrorModel = require("prosemirror-model");
14
12
  var _prosemirrorState = require("prosemirror-state");
@@ -120,7 +118,7 @@ function mergeCells(tr) {
120
118
  })(tr);
121
119
  }
122
120
  var newTable = table.node.type.createChecked(table.node.attrs, rows, table.node.marks);
123
- var fixedTable = removeEmptyColumns(newTable);
121
+ var fixedTable = mergeEmptyColumns(newTable);
124
122
  if (fixedTable === null) {
125
123
  return (0, _metadata.setMeta)({
126
124
  type: 'MERGE_CELLS',
@@ -190,81 +188,68 @@ function cellsOverlapRectangle(_ref, rect) {
190
188
  }
191
189
 
192
190
  // returns an array of numbers, each number indicates the minimum colSpan in each column
193
- function getMinColSpans(table) {
191
+ function getEmptyColumnIndexes(table) {
194
192
  var map = _tableMap.TableMap.get(table);
195
- var minColspans = [];
196
- for (var colIndex = map.width - 1; colIndex >= 0; colIndex--) {
197
- var cellsPositions = map.cellsInRect({
193
+ var emptyColumnIndexes = new Set();
194
+
195
+ // Loop throuh each column
196
+ for (var colIndex = 0; colIndex < map.width; colIndex++) {
197
+ // Get the cells in each row for this column
198
+ var cellPositions = map.cellsInRect({
198
199
  left: colIndex,
199
200
  right: colIndex + 1,
200
201
  top: 0,
201
202
  bottom: map.height
202
203
  });
203
- if (cellsPositions.length) {
204
- var colspans = cellsPositions.map(function (cellPos) {
205
- var cell = table.nodeAt(cellPos);
206
- if (cell) {
207
- return cell.attrs.colspan;
208
- }
209
- });
210
- var minColspan = Math.min.apply(Math, (0, _toConsumableArray2.default)(colspans));
211
- // only care about the case when the next column is invisible
212
- if (!minColspans[colIndex + 1]) {
213
- minColspans[colIndex] = minColspan;
214
- } else {
215
- minColspans[colIndex] = 1;
216
- }
204
+
205
+ // If no cells exist in that column it is empty
206
+ if (!cellPositions.length) {
207
+ emptyColumnIndexes.add(colIndex);
217
208
  }
218
209
  }
219
- return minColspans;
210
+ return emptyColumnIndexes;
220
211
  }
221
- function removeEmptyColumns(table) {
212
+ function mergeEmptyColumns(table) {
213
+ var rows = [];
222
214
  var map = _tableMap.TableMap.get(table);
223
- var minColSpans = getMinColSpans(table);
224
- if (!minColSpans.some(function (colspan) {
225
- return colspan > 1;
226
- })) {
215
+ var emptyColumnIndexes = getEmptyColumnIndexes(table);
216
+
217
+ // We don't need to remove any so return early.
218
+ if (emptyColumnIndexes.size === 0) {
227
219
  return table;
228
220
  }
229
- var rows = [];
230
- var _loop = function _loop(rowIndex) {
221
+ for (var rowIndex = 0; rowIndex < map.height; rowIndex++) {
231
222
  var cellsByCols = {};
232
- var cols = Object.keys(minColSpans).map(Number);
233
- for (var idx in cols) {
234
- var colIndex = cols[idx];
223
+
224
+ // Work backwards so that calculating colwidths is easier with Array.slice
225
+ for (var colIndex = map.width - 1; colIndex >= 0; colIndex--) {
235
226
  var cellPos = map.map[colIndex + rowIndex * map.width];
236
227
  var rect = map.findCell(cellPos);
237
228
  var cell = cellsByCols[rect.left] || table.nodeAt(cellPos);
238
- if (cell && rect.top === rowIndex) {
239
- if (minColSpans[colIndex] > 1) {
240
- var colspan = cell.attrs.colspan - minColSpans[colIndex] + 1;
241
- if (colspan < 1) {
242
- return {
243
- v: null
244
- };
245
- }
246
- var colwidth = cell.attrs.colwidth;
247
- var newCell = cell.type.createChecked(_objectSpread(_objectSpread({}, cell.attrs), {}, {
248
- colspan: colspan,
229
+ if (rect.top !== rowIndex) {
230
+ continue;
231
+ }
232
+
233
+ // If this column is empty, we want to decrement the colspan of its corresponding
234
+ // cell as this column is being "merged"
235
+ if (emptyColumnIndexes.has(colIndex)) {
236
+ var _cell$attrs = cell.attrs,
237
+ colspan = _cell$attrs.colspan,
238
+ colwidth = _cell$attrs.colwidth;
239
+ if (colspan > 1) {
240
+ cell = cell.type.createChecked(_objectSpread(_objectSpread({}, cell.attrs), {}, {
241
+ colspan: colspan - 1,
249
242
  colwidth: colwidth ? colwidth.slice(0, colspan) : null
250
243
  }), cell.content, cell.marks);
251
- cellsByCols[rect.left] = newCell;
252
- } else {
253
- cellsByCols[rect.left] = cell;
254
244
  }
255
245
  }
246
+ cellsByCols[rect.left] = cell;
256
247
  }
257
- var rowCells = Object.keys(cellsByCols).map(function (col) {
258
- return cellsByCols[col];
259
- });
248
+ var rowCells = Object.values(cellsByCols);
260
249
  var row = table.child(rowIndex);
261
250
  if (row) {
262
251
  rows.push(row.type.createChecked(row.attrs, rowCells, row.marks));
263
252
  }
264
- };
265
- for (var rowIndex = 0; rowIndex < map.height; rowIndex++) {
266
- var _ret = _loop(rowIndex);
267
- if ((0, _typeof2.default)(_ret) === "object") return _ret.v;
268
253
  }
269
254
  if (!rows.length) {
270
255
  return null;
@@ -27,7 +27,7 @@ var insertColumnButtonOffset = _consts.tableInsertColumnButtonSize / 2;
27
27
  exports.insertColumnButtonOffset = insertColumnButtonOffset;
28
28
  var rangeSelectionStyles = "\n.".concat(_types.TableCssClassName.NODEVIEW_WRAPPER, ".").concat(_editorSharedStyles.akEditorSelectedNodeClassName, " table tbody tr {\n th,td {\n ").concat((0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.Blanket, _editorSharedStyles.SelectionStyle.Border]), "\n }\n}\n");
29
29
  var sentinelStyles = ".".concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_TOP, ", > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n position: absolute;\n width: 100%;\n height: 1px;\n margin-top: -1px;\n // need this to avoid sentinel being focused via keyboard\n // this still allows it to be detected by intersection observer\n visibility: hidden;\n }\n > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_TOP, " {\n top: ").concat(_consts.columnControlsDecorationHeight, "px;\n }\n > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n bottom: ").concat(_consts.tableScrollbarOffset + _consts.stickyRowOffsetTop + _consts.tablePadding * 2 + 23, "px;\n }\n &.").concat(_types.TableCssClassName.WITH_CONTROLS, " {\n > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_TOP, " {\n top: 0px;\n }\n > .").concat(_types.TableCssClassName.TABLE_STICKY_SENTINEL_BOTTOM, " {\n margin-bottom: ").concat(_consts.columnControlsDecorationHeight, "px;\n }\n }\n}");
30
-
30
+ var shadowSentinelStyles = "\n .".concat(_types.TableCssClassName.TABLE_SHADOW_SENTINEL_LEFT, ",\n .").concat(_types.TableCssClassName.TABLE_SHADOW_SENTINEL_RIGHT, " {\n position: absolute;\n top: 0;\n height: 100%;\n width: 1px;\n visibility: hidden;\n }\n .").concat(_types.TableCssClassName.TABLE_SHADOW_SENTINEL_LEFT, " {\n left: 0;\n }\n .").concat(_types.TableCssClassName.TABLE_SHADOW_SENTINEL_RIGHT, " {\n right: 0;\n }\n");
31
31
  // previous styles to add spacing to numbered lists with
32
32
  // large item markers (e.g. 101, 102, ...) when nested inside tables
33
33
  var listLargeNumericMarkersOldStyles = "\n .ProseMirror .pm-table-cell-content-wrap ol[data-child-count='100+'] {\n padding-left: revert;\n }\n";
@@ -35,7 +35,7 @@ var listLargeNumericMarkersOldStyles = "\n .ProseMirror .pm-table-cell-content-
35
35
  // TODO: https://product-fabric.atlassian.net/browse/DSP-4139
36
36
  var tableStyles = function tableStyles(props) {
37
37
  var _props$featureFlags, _props$featureFlags2;
38
- return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n .", " button {\n background: ", ";\n color: ", ";\n cursor: none;\n }\n\n .", ":not(.", ") button:hover {\n background: ", ";\n color: ", " !important;\n cursor: pointer;\n }\n\n .ProseMirror {\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n\n .", " {\n margin-bottom: 0;\n }\n\n .", " {\n td.", ", th.", " {\n position: relative;\n overflow: visible;\n }\n\n td.", " {\n background-color: ", ";\n\n // ED-15246: Trello card is visible through a border of a table border\n // This fixes a border issue caused by relative positioned table cells\n &::after {\n height: 100%;\n content: '';\n border-left: 1px solid ", ";\n border-bottom: 1px solid ", ";\n position: absolute;\n right: 0px;\n top: 0px;\n bottom: 0;\n width: 100%;\n display: inline-block;\n pointer-events: none;\n }\n }\n }\n\n .", " {\n ", "\n }\n\n .", " {\n ", "\n }\n\n /* Delete button */\n ", "\n /* Ends Delete button */\n\n /* sticky styles */\n .", " .", " .", ":first-of-type {\n margin-top: ", "px;\n width: ", "px;\n\n position: fixed !important;\n z-index: ", " !important;\n box-shadow: 0px -", "px ", ";\n border-right: 0 none;\n /* top set by NumberColumn component */\n }\n\n .", " .", ".sticky {\n position: fixed !important;\n /* needs to be above row controls */\n z-index: ", " !important;\n background: ", ";\n\n width: ", "px;\n height: ", "px;\n }\n\n .", ".sticky .", " {\n border-bottom: 0px none;\n border-right: 0px none;\n\n height: ", "px;\n width: ", "px;\n }\n\n .", " .", " {\n z-index: 0;\n }\n\n .", "\n .", "\n .", ".sticky {\n position: fixed !important;\n z-index: ", " !important;\n display: flex;\n border-left: ", "px solid\n ", ";\n margin-left: -", "px;\n }\n\n .", " col:first-of-type {\n /* moving rows out of a table layout does weird things in Chrome */\n border-right: 1px solid ", ";\n }\n\n tr.sticky {\n padding-top: ", "px;\n position: fixed;\n display: grid;\n\n /* to keep it above cell selection */\n z-index: ", ";\n\n overflow-y: visible;\n overflow-x: hidden;\n\n grid-auto-flow: column;\n\n /* background for where controls apply */\n background: ", ";\n box-sizing: content-box;\n\n margin-top: 2px;\n\n box-shadow: ", ";\n margin-left: -1px;\n\n &.no-pointer-events {\n pointer-events: none;\n }\n }\n\n .", " .", " {\n left: unset;\n position: fixed;\n z-index: ", ";\n }\n\n .", ".", "\n .", " {\n padding-bottom: ", "px;\n }\n\n tr.sticky th {\n border-bottom: ", "px solid\n ", ";\n margin-right: -1px;\n }\n\n .", " tr.sticky > th:last-child {\n border-right-width: 1px;\n }\n\n /* add left edge for first cell */\n .", " tr.sticky > th:first-of-type {\n margin-left: 0px;\n }\n\n /* add a little bit so the scroll lines up with the table */\n .", " tr.sticky::after {\n content: ' ';\n width: ", "px;\n }\n\n /* To fix jumpiness caused in Chrome Browsers for sticky headers */\n .", " .sticky + tr {\n min-height: 0px;\n }\n\n /* move resize line a little in sticky bar */\n .", ".", " {\n tr.sticky\n td.", ",\n tr.sticky\n th.", " {\n .", "::after {\n right: ", "px;\n }\n }\n\n /* when selected put it back to normal -- :not selector would be nicer */\n tr.sticky\n td.", ".", ",\n tr.sticky\n th.", ".", " {\n .", "::after {\n right: ", "px;\n }\n }\n }\n\n tr.sticky\n .", ",\n tr.sticky\n .", " {\n z-index: 1;\n }\n\n .", " tr.sticky {\n padding-top: ", "px;\n }\n\n .", ".", "\n .", "\n .", ":first-of-type {\n margin-top: ", "px;\n }\n\n .", ".sticky {\n border-top: ", "px solid\n ", ";\n }\n\n ", "\n ", "\n\n .", " .", " {\n height: 0; // stop overflow flash & set correct height in update-overflow-shadows.ts\n }\n\n .less-padding {\n padding: 0 ", "px;\n\n .", " {\n padding: 0 ", "px;\n\n // https://product-fabric.atlassian.net/browse/ED-16386\n // Fixes issue where the extra padding that is added here throws off the position\n // of the rows control dot\n &::after {\n right: 6px !important;\n }\n }\n\n &.", "[data-number-column='true'] {\n padding-left: ", "px;\n }\n\n .", " {\n left: 6px;\n }\n\n .", " {\n left: calc(100% - 6px);\n }\n }\n\n > .", " {\n /**\n * Prevent margins collapsing, aids with placing the gap-cursor correctly\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing\n *\n * TODO: Enable this, many tests will fail!\n * border-top: 1px solid transparent;\n */\n }\n\n /* Breakout only works on top level */\n > * .", " .", " {\n margin-left: unset !important;\n width: 100% !important;\n }\n\n ", ";\n\n /* Corner controls */\n .", " {\n width: ", "px;\n height: ", "px;\n display: none;\n\n .", " {\n position: relative;\n\n ", ";\n }\n }\n\n .", ".sticky {\n .", " {\n /* sticky row insert dot overlaps other row insert and messes things up */\n display: none !important;\n }\n }\n\n .", " {\n position: absolute;\n top: 0;\n width: ", "px;\n height: ", "px;\n border: 1px solid ", ";\n border-radius: 0;\n border-top-left-radius: ", "px;\n background: ", ";\n box-sizing: border-box;\n padding: 0;\n :focus {\n outline: none;\n }\n }\n .active .", " {\n border-color: ", ";\n background: ", ";\n }\n\n .", "[data-number-column='true'] {\n .", ", .", " {\n width: ", "px;\n }\n .", " .", " {\n border-right-width: 0;\n }\n }\n\n :not(.", ") .", ":hover {\n border-color: ", ";\n background: ", ";\n cursor: pointer;\n }\n\n :not(.", ")\n .", ".", " {\n border-color: ", ";\n background: ", ";\n }\n\n /* Row controls */\n .", " {\n width: ", "px;\n box-sizing: border-box;\n display: none;\n position: relative;\n\n ", ";\n\n .", " {\n display: flex;\n flex-direction: column;\n }\n .", ":last-child > button {\n border-bottom-left-radius: ", "px;\n }\n .", " {\n position: relative;\n margin-top: -1px;\n }\n .", ":hover,\n .", ".active,\n .", ":hover {\n z-index: ", ";\n }\n\n ", "\n }\n\n :not(.", ") .", " {\n ", "\n ", "\n }\n\n /* Numbered column */\n .", " {\n position: relative;\n float: right;\n margin-left: ", "px;\n top: ", "px;\n width: ", "px;\n box-sizing: border-box;\n }\n\n .", " {\n border: 1px solid ", ";\n box-sizing: border-box;\n margin-top: -1px;\n padding-bottom: 2px;\n padding: 10px 2px;\n text-align: center;\n font-size: ", ";\n background-color: ", ";\n color: ", ";\n border-color: ", ";\n\n :first-child:not(style),\n style:first-child + * {\n margin-top: 0;\n }\n :last-child {\n border-bottom: 1px solid ", ";\n }\n }\n\n .", " {\n .", ", .", " {\n display: block;\n }\n .", " {\n padding-left: 1px;\n .", " {\n border-left: 0 none;\n }\n\n .", ".active {\n border-bottom: 1px solid ", ";\n border-color: ", ";\n background-color: ", ";\n position: relative;\n z-index: ", ";\n color: ", ";\n }\n }\n }\n :not(.", ") .", " {\n .", " {\n cursor: pointer;\n }\n .", ":hover {\n border-bottom: 1px solid ", ";\n border-color: ", ";\n background-color: ", ";\n position: relative;\n z-index: ", ";\n color: ", ";\n }\n .", ".", " {\n background-color: ", ";\n border: 1px solid ", ";\n border-left: 0;\n color: ", ";\n position: relative;\n z-index: ", ";\n }\n }\n\n /* Table */\n .", " > table {\n table-layout: fixed;\n white-space: normal;\n border-top: none;\n // 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212\n margin-right: -1px;\n\n > tbody > tr {\n white-space: pre-wrap;\n }\n\n .", " + * {\n margin-top: 0;\n }\n\n /*\n * Headings have a top margin by default, but we don't want this on the\n * first heading within table header cells.\n *\n * This specifically sets margin-top for the first heading within a header\n * cell when center/right aligned.\n */\n th.", " > .fabric-editor-block-mark {\n > h1:first-of-type,\n > h2:first-of-type,\n > h3:first-of-type,\n > h4:first-of-type,\n > h5:first-of-type,\n > h6:first-of-type {\n margin-top: 0;\n }\n }\n\n .", ", .", " {\n position: relative;\n }\n /* Give selected cells a blue overlay */\n .", "::after,\n .", "::after {\n z-index: ", ";\n position: absolute;\n content: '';\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n width: 100%;\n pointer-events: none;\n }\n .", " {\n border: 1px solid ", ";\n }\n .", "::after {\n background: ", ";\n z-index: ", ";\n }\n th.", "::after,\n td.", "::after {\n background: ", ";\n z-index: ", ";\n }\n // ED-15246: Trello card is visible through a border of a table border\n td.", ", td.", " {\n &::after {\n height: 100%;\n width: 100%;\n border: 1px solid ", ";\n content: '';\n position: absolute;\n left: -1px;\n top: -1px;\n bottom: 0;\n z-index: ", ";\n display: inline-block;\n pointer-events: none;\n }\n &.", "::after {\n border: 1px solid ", ";\n z-index: ", ";\n }\n }\n }\n .", " {\n position: absolute;\n /* top of corner control is table margin top - corner control height + 1 pixel of table border. */\n top: ", "px;\n }\n .", ".", " {\n z-index: ", ";\n }\n .", " {\n left: -", "px;\n }\n .", " {\n padding-right: ", "px;\n margin-right: -", "px;\n padding-bottom: 0px;\n /* fixes gap cursor height */\n overflow: auto;\n overflow-y: hidden;\n position: relative;\n }\n }\n\n .ProseMirror.", " {\n .", " {\n overflow-x: auto;\n ", ";\n }\n }\n\n .ProseMirror.", " {\n cursor: col-resize;\n }\n\n /*\n ED-15882: When custom start numbers is enabled for lists, we have\n styles that handle this generally (in editor-common) so we can\n throw away the older table-specific styles here.\n */\n ", "\n"])), _types.TableCssClassName.LAYOUT_BUTTON, "var(--ds-background-neutral, ".concat(_colors.N20A, ")"), "var(--ds-icon, ".concat(_colors.N300, ")"), _types.TableCssClassName.LAYOUT_BUTTON, _types.TableCssClassName.IS_RESIZING, "var(--ds-background-neutral-hovered, ".concat(_colors.B300, ")"), "var(--ds-icon, white)", (0, _styles.tableSharedStyle)(props), (0, _uiStyles.columnControlsLineMarker)(props), _uiStyles.hoveredDeleteButton, _uiStyles.hoveredCell, _uiStyles.hoveredWarningCell, _uiStyles.resizeHandle, rangeSelectionStyles, _types.TableCssClassName.LAST_ITEM_IN_CELL, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.TABLE_CELL, (0, _consts.tableCellBackgroundColor)(props), (0, _consts.tableBorderColor)(props), (0, _consts.tableBorderColor)(props), _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_COLUMN, _uiStyles.insertColumnButtonWrapper, _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_ROW, _uiStyles.insertRowButtonWrapper, _uiStyles.DeleteButton, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts.stickyRowOffsetTop + 2, _editorSharedStyles.akEditorTableNumberColumnWidth, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts.stickyRowOffsetTop, "var(--ds-surface, white)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.CORNER_CONTROLS, _editorSharedStyles.akEditorSmallZIndex, "var(--ds-surface, white)", _consts.tableToolbarSize, _consts.tableToolbarSize, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts.tableToolbarSize, _consts.tableToolbarSize, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts.tableToolbarSize, "var(--ds-surface, white)", _consts.tableToolbarSize, _types.TableCssClassName.TABLE_STICKY, "var(--ds-surface, green)", _consts.stickyRowOffsetTop, _consts.stickyRowZIndex, "var(--ds-surface, white)", "var(--ds-shadow-overflow, ".concat("0 6px 4px -4px ".concat(_colors.N40A), ")"), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts.stickyRowZIndex + 1, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts.tableToolbarSize, _consts.stickyHeaderBorderBottomWidth, (0, _consts.tableBorderColor)(props), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY, insertColumnButtonOffset + 1, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, (_consts.resizeHandlerAreaWidth - _consts.resizeLineWidth) / 2 + 1, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, (_consts.resizeHandlerAreaWidth - _consts.resizeLineWidth) / 2, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.WITH_CONTROLS, _consts.tableControlsSpacing, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts.tableControlsSpacing + 2, _types.TableCssClassName.CORNER_CONTROLS, _consts.tableControlsSpacing - _consts.tableToolbarSize + 2, "var(--ds-surface, white)", (_props$featureFlags = props.featureFlags) !== null && _props$featureFlags !== void 0 && _props$featureFlags.stickyHeadersOptimization ? sentinelStyles : '', (0, _uiStyles.OverflowShadow)(props), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts.tablePadding, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts.tablePadding, _types.TableCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts.tablePadding - 1, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.NODEVIEW_WRAPPER, _types.TableCssClassName.NODEVIEW_WRAPPER, _types.TableCssClassName.TABLE_CONTAINER, (0, _uiStyles.columnControlsDecoration)(props), _types.TableCssClassName.CORNER_CONTROLS, _consts.tableToolbarSize + 1, cornerControlHeight, _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, (0, _uiStyles.InsertMarker)(props, "\n left: -11px;\n top: 9px;\n "), _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts.tableToolbarSize + 1, _consts.tableToolbarSize + 1, (0, _consts.tableBorderColor)(props), _consts.tableBorderRadiusSize, (0, _consts.tableToolbarColor)(props), _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts.tableBorderSelectedColor, "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _editorSharedStyles.akEditorTableToolbarSize + _editorSharedStyles.akEditorTableNumberColumnWidth, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.CONTROLS_BUTTON, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts.tableBorderSelectedColor, "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts.tableBorderDeleteColor, "var(--ds-background-danger, ".concat(_consts.tableToolbarDeleteColor, ")"), _types.TableCssClassName.ROW_CONTROLS, _consts.tableToolbarSize, (0, _uiStyles.InsertMarker)(props, "\n bottom: -1px;\n left: -11px;\n "), _types.TableCssClassName.ROW_CONTROLS_INNER, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _consts.tableBorderRadiusSize, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _types.TableCssClassName.CONTROLS_BUTTON, _editorSharedStyles.akEditorUnitZIndex, (0, _uiStyles.HeaderButton)(props, "\n border-bottom: 1px solid ".concat((0, _consts.tableBorderColor)(props), ";\n border-right: 0px;\n border-radius: 0;\n height: 100%;\n width: ").concat(_consts.tableToolbarSize, "px;\n\n .").concat(_types.TableCssClassName.CONTROLS_BUTTON_OVERLAY, " {\n position: absolute;\n width: 30px;\n height: 50%;\n right: 0;\n bottom: 0;\n }\n .").concat(_types.TableCssClassName.CONTROLS_BUTTON_OVERLAY, ":first-of-type {\n top: 0;\n }\n ")), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.ROW_CONTROLS, (0, _uiStyles.HeaderButtonHover)(), (0, _uiStyles.HeaderButtonDanger)(), _types.TableCssClassName.NUMBERED_COLUMN, _editorSharedStyles.akEditorTableToolbarSize - 1, _editorSharedStyles.akEditorTableToolbarSize, _editorSharedStyles.akEditorTableNumberColumnWidth + 1, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, (0, _consts.tableBorderColor)(props), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _consts.tableToolbarColor)(props), (0, _consts.tableTextColor)(props), (0, _consts.tableBorderColor)(props), (0, _consts.tableBorderColor)(props), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts.tableBorderSelectedColor, _consts.tableBorderSelectedColor, "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _editorSharedStyles.akEditorUnitZIndex, "var(--ds-text-selected, ".concat(_colors.N0, ")"), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts.tableBorderSelectedColor, _consts.tableBorderSelectedColor, "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _editorSharedStyles.akEditorUnitZIndex, "var(--ds-text-selected, ".concat(_colors.N0, ")"), _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-background-danger, ".concat(_consts.tableToolbarDeleteColor, ")"), _consts.tableBorderDeleteColor, "var(--ds-text-danger, ".concat(_colors.R500, ")"), _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.SELECTED_CELL, _consts.tableBorderSelectedColor, _types.TableCssClassName.SELECTED_CELL, _consts.tableCellSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts.tableCellDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _consts.tableBorderSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _styles.tableMarginTop - cornerControlHeight + 1, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_LEFT_SHADOW, _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts.tableToolbarSize, _types.TableCssClassName.TABLE_NODE_WRAPPER, insertColumnButtonOffset, insertColumnButtonOffset, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.TABLE_NODE_WRAPPER, _scrollbar.scrollbarStyles, _types.TableCssClassName.RESIZE_CURSOR, props !== null && props !== void 0 && (_props$featureFlags2 = props.featureFlags) !== null && _props$featureFlags2 !== void 0 && _props$featureFlags2.restartNumberedLists ? "" : listLargeNumericMarkersOldStyles);
38
+ return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n .", " button {\n background: ", ";\n color: ", ";\n cursor: none;\n }\n\n .", ":not(.", ") button:hover {\n background: ", ";\n color: ", " !important;\n cursor: pointer;\n }\n\n .ProseMirror {\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n\n .", " {\n margin-bottom: 0;\n }\n\n .", " {\n td.", ", th.", " {\n position: relative;\n overflow: visible;\n }\n\n td.", " {\n background-color: ", ";\n\n // ED-15246: Trello card is visible through a border of a table border\n // This fixes a border issue caused by relative positioned table cells\n &::after {\n height: 100%;\n content: '';\n border-left: 1px solid ", ";\n border-bottom: 1px solid ", ";\n position: absolute;\n right: 0px;\n top: 0px;\n bottom: 0;\n width: 100%;\n display: inline-block;\n pointer-events: none;\n }\n }\n }\n\n .", " {\n ", "\n }\n\n .", " {\n ", "\n }\n\n /* Delete button */\n ", "\n /* Ends Delete button */\n\n /* sticky styles */\n .", " .", " .", ":first-of-type {\n margin-top: ", "px;\n width: ", "px;\n\n position: fixed !important;\n z-index: ", " !important;\n box-shadow: 0px -", "px ", ";\n border-right: 0 none;\n /* top set by NumberColumn component */\n }\n\n .", " .", ".sticky {\n position: fixed !important;\n /* needs to be above row controls */\n z-index: ", " !important;\n background: ", ";\n\n width: ", "px;\n height: ", "px;\n }\n\n .", ".sticky .", " {\n border-bottom: 0px none;\n border-right: 0px none;\n\n height: ", "px;\n width: ", "px;\n }\n\n .", " .", " {\n z-index: 0;\n }\n\n .", "\n .", "\n .", ".sticky {\n position: fixed !important;\n z-index: ", " !important;\n display: flex;\n border-left: ", "px solid\n ", ";\n margin-left: -", "px;\n }\n\n .", " col:first-of-type {\n /* moving rows out of a table layout does weird things in Chrome */\n border-right: 1px solid ", ";\n }\n\n tr.sticky {\n padding-top: ", "px;\n position: fixed;\n display: grid;\n\n /* to keep it above cell selection */\n z-index: ", ";\n\n overflow-y: visible;\n overflow-x: hidden;\n\n grid-auto-flow: column;\n\n /* background for where controls apply */\n background: ", ";\n box-sizing: content-box;\n\n margin-top: 2px;\n\n box-shadow: ", ";\n margin-left: -1px;\n\n &.no-pointer-events {\n pointer-events: none;\n }\n }\n\n .", " .", " {\n left: unset;\n position: fixed;\n z-index: ", ";\n }\n\n .", ".", "\n .", " {\n padding-bottom: ", "px;\n }\n\n tr.sticky th {\n border-bottom: ", "px solid\n ", ";\n margin-right: -1px;\n }\n\n .", " tr.sticky > th:last-child {\n border-right-width: 1px;\n }\n\n /* add left edge for first cell */\n .", " tr.sticky > th:first-of-type {\n margin-left: 0px;\n }\n\n /* add a little bit so the scroll lines up with the table */\n .", " tr.sticky::after {\n content: ' ';\n width: ", "px;\n }\n\n /* To fix jumpiness caused in Chrome Browsers for sticky headers */\n .", " .sticky + tr {\n min-height: 0px;\n }\n\n /* move resize line a little in sticky bar */\n .", ".", " {\n tr.sticky\n td.", ",\n tr.sticky\n th.", " {\n .", "::after {\n right: ", "px;\n }\n }\n\n /* when selected put it back to normal -- :not selector would be nicer */\n tr.sticky\n td.", ".", ",\n tr.sticky\n th.", ".", " {\n .", "::after {\n right: ", "px;\n }\n }\n }\n\n tr.sticky\n .", ",\n tr.sticky\n .", " {\n z-index: 1;\n }\n\n .", " tr.sticky {\n padding-top: ", "px;\n }\n\n .", ".", "\n .", "\n .", ":first-of-type {\n margin-top: ", "px;\n }\n\n .", ".sticky {\n border-top: ", "px solid\n ", ";\n }\n\n ", "\n ", "\n\n .", " .", " {\n height: 0; // stop overflow flash & set correct height in update-overflow-shadows.ts\n }\n\n .less-padding {\n padding: 0 ", "px;\n\n .", " {\n padding: 0 ", "px;\n\n // https://product-fabric.atlassian.net/browse/ED-16386\n // Fixes issue where the extra padding that is added here throws off the position\n // of the rows control dot\n &::after {\n right: 6px !important;\n }\n }\n\n &.", "[data-number-column='true'] {\n padding-left: ", "px;\n }\n\n .", " {\n left: 6px;\n }\n\n .", " {\n left: calc(100% - 6px);\n }\n }\n\n > .", " {\n /**\n * Prevent margins collapsing, aids with placing the gap-cursor correctly\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing\n *\n * TODO: Enable this, many tests will fail!\n * border-top: 1px solid transparent;\n */\n }\n\n /* Breakout only works on top level */\n > * .", " .", " {\n margin-left: unset !important;\n width: 100% !important;\n }\n\n ", ";\n\n /* Corner controls */\n .", " {\n width: ", "px;\n height: ", "px;\n display: none;\n\n .", " {\n position: relative;\n\n ", ";\n }\n }\n\n .", ".sticky {\n .", " {\n /* sticky row insert dot overlaps other row insert and messes things up */\n display: none !important;\n }\n }\n\n .", " {\n position: absolute;\n top: 0;\n width: ", "px;\n height: ", "px;\n border: 1px solid ", ";\n border-radius: 0;\n border-top-left-radius: ", "px;\n background: ", ";\n box-sizing: border-box;\n padding: 0;\n :focus {\n outline: none;\n }\n }\n .active .", " {\n border-color: ", ";\n background: ", ";\n }\n\n .", "[data-number-column='true'] {\n .", ", .", " {\n width: ", "px;\n }\n .", " .", " {\n border-right-width: 0;\n }\n }\n\n :not(.", ") .", ":hover {\n border-color: ", ";\n background: ", ";\n cursor: pointer;\n }\n\n :not(.", ")\n .", ".", " {\n border-color: ", ";\n background: ", ";\n }\n\n /* Row controls */\n .", " {\n width: ", "px;\n box-sizing: border-box;\n display: none;\n position: relative;\n\n ", ";\n\n .", " {\n display: flex;\n flex-direction: column;\n }\n .", ":last-child > button {\n border-bottom-left-radius: ", "px;\n }\n .", " {\n position: relative;\n margin-top: -1px;\n }\n .", ":hover,\n .", ".active,\n .", ":hover {\n z-index: ", ";\n }\n\n ", "\n }\n\n :not(.", ") .", " {\n ", "\n ", "\n }\n\n /* Numbered column */\n .", " {\n position: relative;\n float: right;\n margin-left: ", "px;\n top: ", "px;\n width: ", "px;\n box-sizing: border-box;\n }\n\n .", " {\n border: 1px solid ", ";\n box-sizing: border-box;\n margin-top: -1px;\n padding-bottom: 2px;\n padding: 10px 2px;\n text-align: center;\n font-size: ", ";\n background-color: ", ";\n color: ", ";\n border-color: ", ";\n\n :first-child:not(style),\n style:first-child + * {\n margin-top: 0;\n }\n :last-child {\n border-bottom: 1px solid ", ";\n }\n }\n\n .", " {\n .", ", .", " {\n display: block;\n }\n .", " {\n padding-left: 1px;\n .", " {\n border-left: 0 none;\n }\n\n .", ".active {\n border-bottom: 1px solid ", ";\n border-color: ", ";\n background-color: ", ";\n position: relative;\n z-index: ", ";\n color: ", ";\n }\n }\n }\n :not(.", ") .", " {\n .", " {\n cursor: pointer;\n }\n .", ":hover {\n border-bottom: 1px solid ", ";\n border-color: ", ";\n background-color: ", ";\n position: relative;\n z-index: ", ";\n color: ", ";\n }\n .", ".", " {\n background-color: ", ";\n border: 1px solid ", ";\n border-left: 0;\n color: ", ";\n position: relative;\n z-index: ", ";\n }\n }\n\n /* Table */\n .", " > table {\n table-layout: fixed;\n white-space: normal;\n border-top: none;\n // 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212\n margin-right: -1px;\n // Allows better positioning for the shadow sentinels - ED-16668\n position: relative;\n\n > tbody > tr {\n white-space: pre-wrap;\n }\n\n .", " + * {\n margin-top: 0;\n }\n\n /*\n * Headings have a top margin by default, but we don't want this on the\n * first heading within table header cells.\n *\n * This specifically sets margin-top for the first heading within a header\n * cell when center/right aligned.\n */\n th.", " > .fabric-editor-block-mark {\n > h1:first-of-type,\n > h2:first-of-type,\n > h3:first-of-type,\n > h4:first-of-type,\n > h5:first-of-type,\n > h6:first-of-type {\n margin-top: 0;\n }\n }\n\n .", ", .", " {\n position: relative;\n }\n /* Give selected cells a blue overlay */\n .", "::after,\n .", "::after {\n z-index: ", ";\n position: absolute;\n content: '';\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n width: 100%;\n pointer-events: none;\n }\n .", " {\n border: 1px solid ", ";\n }\n .", "::after {\n background: ", ";\n z-index: ", ";\n }\n th.", "::after,\n td.", "::after {\n background: ", ";\n z-index: ", ";\n }\n // ED-15246: Trello card is visible through a border of a table border\n td.", ", td.", " {\n &::after {\n height: 100%;\n width: 100%;\n border: 1px solid ", ";\n content: '';\n position: absolute;\n left: -1px;\n top: -1px;\n bottom: 0;\n z-index: ", ";\n display: inline-block;\n pointer-events: none;\n }\n &.", "::after {\n border: 1px solid ", ";\n z-index: ", ";\n }\n }\n }\n .", " {\n position: absolute;\n /* top of corner control is table margin top - corner control height + 1 pixel of table border. */\n top: ", "px;\n }\n .", ".", " {\n z-index: ", ";\n }\n .", " {\n left: -", "px;\n }\n .", " {\n padding-right: ", "px;\n margin-right: -", "px;\n padding-bottom: 0px;\n /* fixes gap cursor height */\n overflow: auto;\n overflow-y: hidden;\n position: relative;\n }\n }\n\n .ProseMirror.", " {\n .", " {\n overflow-x: auto;\n ", ";\n }\n }\n\n .ProseMirror.", " {\n cursor: col-resize;\n }\n\n /*\n ED-15882: When custom start numbers is enabled for lists, we have\n styles that handle this generally (in editor-common) so we can\n throw away the older table-specific styles here.\n */\n ", "\n\n ", "\n"])), _types.TableCssClassName.LAYOUT_BUTTON, "var(--ds-background-neutral, ".concat(_colors.N20A, ")"), "var(--ds-icon, ".concat(_colors.N300, ")"), _types.TableCssClassName.LAYOUT_BUTTON, _types.TableCssClassName.IS_RESIZING, "var(--ds-background-neutral-hovered, ".concat(_colors.B300, ")"), "var(--ds-icon, white)", (0, _styles.tableSharedStyle)(props), (0, _uiStyles.columnControlsLineMarker)(props), _uiStyles.hoveredDeleteButton, _uiStyles.hoveredCell, _uiStyles.hoveredWarningCell, _uiStyles.resizeHandle, rangeSelectionStyles, _types.TableCssClassName.LAST_ITEM_IN_CELL, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.TABLE_CELL, (0, _consts.tableCellBackgroundColor)(props), (0, _consts.tableBorderColor)(props), (0, _consts.tableBorderColor)(props), _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_COLUMN, _uiStyles.insertColumnButtonWrapper, _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_ROW, _uiStyles.insertRowButtonWrapper, _uiStyles.DeleteButton, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts.stickyRowOffsetTop + 2, _editorSharedStyles.akEditorTableNumberColumnWidth, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts.stickyRowOffsetTop, "var(--ds-surface, white)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.CORNER_CONTROLS, _editorSharedStyles.akEditorSmallZIndex, "var(--ds-surface, white)", _consts.tableToolbarSize, _consts.tableToolbarSize, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts.tableToolbarSize, _consts.tableToolbarSize, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts.tableToolbarSize, "var(--ds-surface, white)", _consts.tableToolbarSize, _types.TableCssClassName.TABLE_STICKY, "var(--ds-surface, green)", _consts.stickyRowOffsetTop, _consts.stickyRowZIndex, "var(--ds-surface, white)", "var(--ds-shadow-overflow, ".concat("0 6px 4px -4px ".concat(_colors.N40A), ")"), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts.stickyRowZIndex + 1, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts.tableToolbarSize, _consts.stickyHeaderBorderBottomWidth, (0, _consts.tableBorderColor)(props), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY, insertColumnButtonOffset + 1, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, (_consts.resizeHandlerAreaWidth - _consts.resizeLineWidth) / 2 + 1, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, (_consts.resizeHandlerAreaWidth - _consts.resizeLineWidth) / 2, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.WITH_CONTROLS, _consts.tableControlsSpacing, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts.tableControlsSpacing + 2, _types.TableCssClassName.CORNER_CONTROLS, _consts.tableControlsSpacing - _consts.tableToolbarSize + 2, "var(--ds-surface, white)", (_props$featureFlags = props.featureFlags) !== null && _props$featureFlags !== void 0 && _props$featureFlags.stickyHeadersOptimization ? sentinelStyles : '', (0, _uiStyles.OverflowShadow)(props), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts.tablePadding, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts.tablePadding, _types.TableCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts.tablePadding - 1, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.NODEVIEW_WRAPPER, _types.TableCssClassName.NODEVIEW_WRAPPER, _types.TableCssClassName.TABLE_CONTAINER, (0, _uiStyles.columnControlsDecoration)(props), _types.TableCssClassName.CORNER_CONTROLS, _consts.tableToolbarSize + 1, cornerControlHeight, _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, (0, _uiStyles.InsertMarker)(props, "\n left: -11px;\n top: 9px;\n "), _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts.tableToolbarSize + 1, _consts.tableToolbarSize + 1, (0, _consts.tableBorderColor)(props), _consts.tableBorderRadiusSize, (0, _consts.tableToolbarColor)(props), _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts.tableBorderSelectedColor, "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _editorSharedStyles.akEditorTableToolbarSize + _editorSharedStyles.akEditorTableNumberColumnWidth, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.CONTROLS_BUTTON, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts.tableBorderSelectedColor, "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts.tableBorderDeleteColor, "var(--ds-background-danger, ".concat(_consts.tableToolbarDeleteColor, ")"), _types.TableCssClassName.ROW_CONTROLS, _consts.tableToolbarSize, (0, _uiStyles.InsertMarker)(props, "\n bottom: -1px;\n left: -11px;\n "), _types.TableCssClassName.ROW_CONTROLS_INNER, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _consts.tableBorderRadiusSize, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _types.TableCssClassName.CONTROLS_BUTTON, _editorSharedStyles.akEditorUnitZIndex, (0, _uiStyles.HeaderButton)(props, "\n border-bottom: 1px solid ".concat((0, _consts.tableBorderColor)(props), ";\n border-right: 0px;\n border-radius: 0;\n height: 100%;\n width: ").concat(_consts.tableToolbarSize, "px;\n\n .").concat(_types.TableCssClassName.CONTROLS_BUTTON_OVERLAY, " {\n position: absolute;\n width: 30px;\n height: 50%;\n right: 0;\n bottom: 0;\n }\n .").concat(_types.TableCssClassName.CONTROLS_BUTTON_OVERLAY, ":first-of-type {\n top: 0;\n }\n ")), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.ROW_CONTROLS, (0, _uiStyles.HeaderButtonHover)(), (0, _uiStyles.HeaderButtonDanger)(), _types.TableCssClassName.NUMBERED_COLUMN, _editorSharedStyles.akEditorTableToolbarSize - 1, _editorSharedStyles.akEditorTableToolbarSize, _editorSharedStyles.akEditorTableNumberColumnWidth + 1, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, (0, _consts.tableBorderColor)(props), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _consts.tableToolbarColor)(props), (0, _consts.tableTextColor)(props), (0, _consts.tableBorderColor)(props), (0, _consts.tableBorderColor)(props), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts.tableBorderSelectedColor, _consts.tableBorderSelectedColor, "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _editorSharedStyles.akEditorUnitZIndex, "var(--ds-text-selected, ".concat(_colors.N0, ")"), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts.tableBorderSelectedColor, _consts.tableBorderSelectedColor, "var(--ds-background-selected, ".concat(_consts.tableToolbarSelectedColor, ")"), _editorSharedStyles.akEditorUnitZIndex, "var(--ds-text-selected, ".concat(_colors.N0, ")"), _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-background-danger, ".concat(_consts.tableToolbarDeleteColor, ")"), _consts.tableBorderDeleteColor, "var(--ds-text-danger, ".concat(_colors.R500, ")"), _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.SELECTED_CELL, _consts.tableBorderSelectedColor, _types.TableCssClassName.SELECTED_CELL, _consts.tableCellSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts.tableCellDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _consts.tableBorderSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _styles.tableMarginTop - cornerControlHeight + 1, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_LEFT_SHADOW, _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts.tableToolbarSize, _types.TableCssClassName.TABLE_NODE_WRAPPER, insertColumnButtonOffset, insertColumnButtonOffset, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.TABLE_NODE_WRAPPER, _scrollbar.scrollbarStyles, _types.TableCssClassName.RESIZE_CURSOR, props !== null && props !== void 0 && (_props$featureFlags2 = props.featureFlags) !== null && _props$featureFlags2 !== void 0 && _props$featureFlags2.restartNumberedLists ? "" : listLargeNumericMarkersOldStyles, shadowSentinelStyles);
39
39
  };
40
40
  exports.tableStyles = tableStyles;
41
41
  var tableFullPageEditorStyles = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n .ProseMirror .", " > table {\n margin-left: 0;\n // 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212\n margin-right: -1px;\n width: 100%;\n }\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER);
@@ -17,8 +17,9 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
17
17
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
18
18
  var getRowHeights = function getRowHeights(tableRef) {
19
19
  var heights = [];
20
- if (tableRef.lastChild) {
21
- var rows = tableRef.lastChild.childNodes;
20
+ var tableBody = tableRef.querySelector('tbody');
21
+ if (tableBody) {
22
+ var rows = tableBody.childNodes;
22
23
  for (var i = 0, count = rows.length; i < count; i++) {
23
24
  var row = rows[i];
24
25
  heights[i] = row.getBoundingClientRect().height + 1;
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "1.2.1",
3
+ "version": "1.2.2",
4
4
  "sideEffects": false
5
5
  }
@@ -0,0 +1,36 @@
1
+ /* prettier-ignore */
2
+ /**
3
+ * NOTE:
4
+ *
5
+ * This file is automatically generated by Traduki 2.0.
6
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
7
+ */
8
+ //
9
+ export default {
10
+ 'fabric.editor.canNotSortTable': "⚠️ You can't sort a table with merged cells",
11
+ 'fabric.editor.cellBackground': 'Cell background',
12
+ 'fabric.editor.cellOptions': 'Cell options',
13
+ 'fabric.editor.clearCells': 'Clear {0, plural, one {cell} other {cells}}',
14
+ 'fabric.editor.collapseTable': 'Collapse table',
15
+ 'fabric.editor.cornerControl': 'Highlight table',
16
+ 'fabric.editor.distributeColumns': 'Distribute columns',
17
+ 'fabric.editor.extension.confirmDeleteLinkedModalMessagePrefix': 'Deleting',
18
+ 'fabric.editor.extension.deleteElementTitle': 'Delete element',
19
+ 'fabric.editor.extension.sourceNoTitledName': 'this element',
20
+ 'fabric.editor.floatingToolbar.confirmModalCheckboxLabel': 'Also delete connected elements',
21
+ 'fabric.editor.headerColumn': 'Header column',
22
+ 'fabric.editor.headerRow': 'Header row',
23
+ 'fabric.editor.insertColumn': 'Insert column right',
24
+ 'fabric.editor.insertRow': 'Insert row below',
25
+ 'fabric.editor.mergeCells': 'Merge cells',
26
+ 'fabric.editor.numberedColumn': 'Numbered column',
27
+ 'fabric.editor.removeColumns': 'Delete {0, plural, one {column} other {columns}}',
28
+ 'fabric.editor.removeRows': 'Delete {0, plural, one {row} other {rows}}',
29
+ 'fabric.editor.rowControl': 'Highlight row',
30
+ 'fabric.editor.sortColumnASC': 'Sort column A → Z',
31
+ 'fabric.editor.sortColumnDESC': 'Sort column Z → A',
32
+ 'fabric.editor.splitCell': 'Split cell',
33
+ 'fabric.editor.tableOptions': 'Table options',
34
+ 'fabric.editor.tables.confirmDeleteLinkedModalMessage': 'Deleting {nodeName} will break anything connected to it.',
35
+ 'fabric.editor.tables.confirmDeleteLinkedModalOKButton': 'Delete'
36
+ };