@atlaskit/editor-plugin-table 29.1.4 → 29.1.5
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 +9 -0
- package/dist/cjs/nodeviews/TableRowNativeStickyWithFallback.js +7 -7
- package/dist/cjs/ui/rounded-table-styles.js +1 -1
- package/dist/es2019/nodeviews/TableRowNativeStickyWithFallback.js +7 -7
- package/dist/es2019/ui/rounded-table-styles.js +1 -1
- package/dist/esm/nodeviews/TableRowNativeStickyWithFallback.js +7 -7
- package/dist/esm/ui/rounded-table-styles.js +1 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-table
|
|
2
2
|
|
|
3
|
+
## 29.1.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`d92f804b3ec93`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d92f804b3ec93) -
|
|
8
|
+
Permanently enable single-row native sticky header behavior and remove the fully rolled-out
|
|
9
|
+
`platform_editor_table_q4_patch_4` experiment.
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
3
12
|
## 29.1.4
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
|
@@ -111,7 +111,7 @@ var TableRowNativeStickyWithFallback = exports.default = /*#__PURE__*/function (
|
|
|
111
111
|
});
|
|
112
112
|
var rowIndex = (0, _nodes.getTableRowIndex)(view, getPos);
|
|
113
113
|
_this.isHeaderRow = (0, _nodes.supportedHeaderRow)(node, rowIndex);
|
|
114
|
-
if (_this.isHeaderRow
|
|
114
|
+
if (_this.isHeaderRow) {
|
|
115
115
|
_this.isSingleRowTable = _this.checkIsSingleRowTable();
|
|
116
116
|
}
|
|
117
117
|
_this.isLegacySticky = false;
|
|
@@ -220,7 +220,7 @@ var TableRowNativeStickyWithFallback = exports.default = /*#__PURE__*/function (
|
|
|
220
220
|
// Ignored via go/ees005
|
|
221
221
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
222
222
|
function update(node) {
|
|
223
|
-
if (this.isHeaderRow
|
|
223
|
+
if (this.isHeaderRow) {
|
|
224
224
|
this.updateSingleRowTableStickyHeaderState();
|
|
225
225
|
}
|
|
226
226
|
|
|
@@ -340,7 +340,7 @@ var TableRowNativeStickyWithFallback = exports.default = /*#__PURE__*/function (
|
|
|
340
340
|
* be cleaned up.
|
|
341
341
|
*/
|
|
342
342
|
entries.forEach(function (entry) {
|
|
343
|
-
if (
|
|
343
|
+
if (_this4.updateSingleRowTableStickyHeaderState()) {
|
|
344
344
|
return;
|
|
345
345
|
}
|
|
346
346
|
var tableWrapper = _this4.dom.closest(".".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER));
|
|
@@ -437,7 +437,7 @@ var TableRowNativeStickyWithFallback = exports.default = /*#__PURE__*/function (
|
|
|
437
437
|
if (!(observer.root instanceof HTMLElement)) {
|
|
438
438
|
return;
|
|
439
439
|
}
|
|
440
|
-
if (
|
|
440
|
+
if (_this5.updateSingleRowTableStickyHeaderState()) {
|
|
441
441
|
return;
|
|
442
442
|
}
|
|
443
443
|
// Only apply classes if page has scrolled since load
|
|
@@ -490,7 +490,7 @@ var TableRowNativeStickyWithFallback = exports.default = /*#__PURE__*/function (
|
|
|
490
490
|
this.stickyStateObserver = new IntersectionObserver(function (entries) {
|
|
491
491
|
entries.forEach(function (entry) {
|
|
492
492
|
var _entry$rootBounds;
|
|
493
|
-
if (
|
|
493
|
+
if (_this6.updateSingleRowTableStickyHeaderState()) {
|
|
494
494
|
return;
|
|
495
495
|
}
|
|
496
496
|
var tableContainer = _this6.dom.closest(".".concat(_types.TableCssClassName.TABLE_CONTAINER));
|
|
@@ -631,7 +631,7 @@ var TableRowNativeStickyWithFallback = exports.default = /*#__PURE__*/function (
|
|
|
631
631
|
var _this8 = this;
|
|
632
632
|
this.nodeVisibilityObserver = new IntersectionObserver(function (entries) {
|
|
633
633
|
entries.forEach(function (entry) {
|
|
634
|
-
if (
|
|
634
|
+
if (_this8.updateSingleRowTableStickyHeaderState()) {
|
|
635
635
|
return;
|
|
636
636
|
}
|
|
637
637
|
if (!_this8.isNativeSticky) {
|
|
@@ -726,7 +726,7 @@ var TableRowNativeStickyWithFallback = exports.default = /*#__PURE__*/function (
|
|
|
726
726
|
}, {
|
|
727
727
|
key: "refreshLegacyStickyState",
|
|
728
728
|
value: function refreshLegacyStickyState() {
|
|
729
|
-
if (
|
|
729
|
+
if (this.updateSingleRowTableStickyHeaderState()) {
|
|
730
730
|
return;
|
|
731
731
|
}
|
|
732
732
|
var tree = (0, _dom2.getTree)(this.dom);
|
|
@@ -51,7 +51,7 @@ var roundedTableStickyHeaderNumberColumnStyles = function roundedTableStickyHead
|
|
|
51
51
|
return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n\t.", "[data-number-column='true'] .", " tr th[data-reaches-top][data-reaches-left]::before,\n\t.", "[data-number-column='true'] .", " tr.", " th[data-reaches-left]::before,\n\t.", "[data-number-column='true'] .", " .", " th[data-reaches-left]::before {\n\t\tborder-top-left-radius: ", ";\n\t\tborder-bottom: none;\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, "var(--ds-radius-xlarge, 12px)");
|
|
52
52
|
};
|
|
53
53
|
var roundedTableStickyHeaderCornerMaskStyles = function roundedTableStickyHeaderCornerMaskStyles() {
|
|
54
|
-
return (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t/* Same z-index as the sticky row; DOM order keeps the row above this mask and the table border below it. */\n\t.", " {\n\t\tdisplay: none;\n\t\tposition: sticky;\n\t\ttop: calc(", "px - 1px);\n\t\twidth: 12px;\n\t\theight: 12px;\n\t\tmargin-bottom: -12px;\n\t\tbackground: ", ";\n\t\tpointer-events: none;\n\t\tz-index: ", ";\n\t}\n\n\t.", "[data-number-column='true']\n\t\t.", "[data-corner='left'] {\n\t\tmargin-left: -", "px;\n\t}\n\n\t.", "[data-corner='right'] {\n\t\tleft: calc(100% - 11px);\n\t}\n\n\t/*\n\t\tScope the :has() selectors to a DIRECT child table so a nested table that\n\t\thas its own sticky row does not pull the OUTER wrapper's masks into the\n\t\tsticky / fallback layout. The masks belong to the wrapper of the table\n\t\tthat owns the sticky row, never to an ancestor wrapper.\n\t*/\n\t.", ":has(> table > tbody > tr.", ")\n\t\t> .", ",\n\t\t.", ":has(> table.", " > tbody > tr.sticky)\n\t\t> .", " {\n\t\tdisplay: block;\n\t}\n\n\t/*\n\t\tWhen the table overflows horizontally, sticky headers fall back from native\n\t\tposition: sticky to a fixed-position header row. Match that positioning so\n\t\tthe corner masks continue to cover the rounded corners in the fallback path.\n\n\t\tThe direct-child combinator inside :has() is critical: without it a nested\n\t\ttable entering the legacy fallback would incorrectly trigger this rule on\n\t\tthe OUTER wrapper, detaching the outer table's masks from its corners.\n\t*/\n\t.", ":has(> table.", " > tbody > tr.sticky)\n\t\t> .", " {\n\t\tposition: fixed;\n\t\ttop: 30px;\n\t\tz-index: 1;\n\t}\n"])), _types.TableCssClassName.TABLE_CORNER_MASK, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) && (0, _fg.fg)('platform_editor_nest_table_in_panel_patch_3') ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts2.nativeStickyHeaderZIndex, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_CORNER_MASK, _editorSharedStyles.akEditorTableNumberColumnWidth, _types.TableCssClassName.TABLE_CORNER_MASK, _types.TableCssClassName.TABLE_NODE_WRAPPER,
|
|
54
|
+
return (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t/* Same z-index as the sticky row; DOM order keeps the row above this mask and the table border below it. */\n\t.", " {\n\t\tdisplay: none;\n\t\tposition: sticky;\n\t\ttop: calc(", "px - 1px);\n\t\twidth: 12px;\n\t\theight: 12px;\n\t\tmargin-bottom: -12px;\n\t\tbackground: ", ";\n\t\tpointer-events: none;\n\t\tz-index: ", ";\n\t}\n\n\t.", "[data-number-column='true']\n\t\t.", "[data-corner='left'] {\n\t\tmargin-left: -", "px;\n\t}\n\n\t.", "[data-corner='right'] {\n\t\tleft: calc(100% - 11px);\n\t}\n\n\t/*\n\t\tScope the :has() selectors to a DIRECT child table so a nested table that\n\t\thas its own sticky row does not pull the OUTER wrapper's masks into the\n\t\tsticky / fallback layout. The masks belong to the wrapper of the table\n\t\tthat owns the sticky row, never to an ancestor wrapper.\n\t*/\n\t.", ":has(> table > tbody > tr.", ".", ")\n\t\t> .", ",\n\t\t.", ":has(> table.", " > tbody > tr.sticky)\n\t\t> .", " {\n\t\tdisplay: block;\n\t}\n\n\t/*\n\t\tWhen the table overflows horizontally, sticky headers fall back from native\n\t\tposition: sticky to a fixed-position header row. Match that positioning so\n\t\tthe corner masks continue to cover the rounded corners in the fallback path.\n\n\t\tThe direct-child combinator inside :has() is critical: without it a nested\n\t\ttable entering the legacy fallback would incorrectly trigger this rule on\n\t\tthe OUTER wrapper, detaching the outer table's masks from its corners.\n\t*/\n\t.", ":has(> table.", " > tbody > tr.sticky)\n\t\t> .", " {\n\t\tposition: fixed;\n\t\ttop: 30px;\n\t\tz-index: 1;\n\t}\n"])), _types.TableCssClassName.TABLE_CORNER_MASK, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) && (0, _fg.fg)('platform_editor_nest_table_in_panel_patch_3') ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts2.nativeStickyHeaderZIndex, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_CORNER_MASK, _editorSharedStyles.akEditorTableNumberColumnWidth, _types.TableCssClassName.TABLE_CORNER_MASK, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_CORNER_MASK, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_CORNER_MASK, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_CORNER_MASK);
|
|
55
55
|
};
|
|
56
56
|
var roundedTableStickyHeaderOverlayStyles = function roundedTableStickyHeaderOverlayStyles() {
|
|
57
57
|
return (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t/*\n\t\tPaint the pinned sticky row's rounded top edge via each cell's ::after.\n\t\ttop: -1px places it in the reserved transparent border slot, aligned with\n\t\tthe row's inset-shadow bottom border. Longhand border-top-* lets\n\t\tinteraction-state rules override only the colour.\n\t*/\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> th.", "[data-reaches-top]::after,\n\t\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> td.", "[data-reaches-top]::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: -1px;\n\t\tright: -1px;\n\t\ttop: -1px;\n\t\tbottom: -1px;\n\t\twidth: auto;\n\t\theight: auto;\n\t\tpointer-events: none;\n\t\tborder-top-width: 1px;\n\t\tborder-top-style: solid;\n\t\tborder-top-color: ", ";\n\t}\n\n\t/* Selection / hover / active-cursor colour for the painted top edge. */\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> th.", "[data-reaches-top]:is(\n\t\t\t.", ",\n\t\t\t.", ",\n\t\t\t.", "\n\t\t)::after,\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> td.", "[data-reaches-top]:is(\n\t\t\t.", ",\n\t\t\t.", ",\n\t\t\t.", "\n\t\t)::after {\n\t\tborder-top-color: ", ";\n\t}\n\n\t/* Danger colour for the painted top edge. */\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> th.", "[data-reaches-top].", "::after,\n\t\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> td.", "[data-reaches-top].", "::after {\n\t\tborder-top-color: ", ";\n\t}\n\n\t:where(.", " > table > tbody > tr.", ")\n\t\t> th.", "[data-reaches-left]::after {\n\t\tborder-left-color: transparent;\n\t}\n\n\t", "\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_CELL, _consts2.tableBorderColor, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_HEADER_CELL, (0, _react.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\n\t\t/* Node-selected (ak-editor-selected-node) sticky header: the pinned row leaves the table's\n\t\t\t\t rounded overlay behind, so recolour its painted top edge to the selected colour too. */\n\t\t.", ".", "\n\t\t\t.", "\n\t\t\t> table\n\t\t\t> tbody\n\t\t\t> tr.", ".", "\n\t\t\t> th.", "[data-reaches-top]::after,\n\t\t\t.", ".", "\n\t\t\t.", "\n\t\t\t> table\n\t\t\t> tbody\n\t\t\t> tr.", ".", "\n\t\t\t> td.", "[data-reaches-top]::after {\n\t\t\tborder-top-color: ", ";\n\t\t}\n\t"])), _types.TableCssClassName.NODEVIEW_WRAPPER, _editorSharedStyles.akEditorSelectedNodeClassName, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.NODEVIEW_WRAPPER, _editorSharedStyles.akEditorSelectedNodeClassName, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _types.TableCssClassName.TABLE_CELL, _consts2.tableBorderSelectedColor));
|
|
@@ -95,7 +95,7 @@ export default class TableRowNativeStickyWithFallback extends TableNodeView {
|
|
|
95
95
|
});
|
|
96
96
|
const rowIndex = getTableRowIndex(view, getPos);
|
|
97
97
|
this.isHeaderRow = supportedHeaderRow(node, rowIndex);
|
|
98
|
-
if (this.isHeaderRow
|
|
98
|
+
if (this.isHeaderRow) {
|
|
99
99
|
this.isSingleRowTable = this.checkIsSingleRowTable();
|
|
100
100
|
}
|
|
101
101
|
this.isLegacySticky = false;
|
|
@@ -202,7 +202,7 @@ export default class TableRowNativeStickyWithFallback extends TableNodeView {
|
|
|
202
202
|
// Ignored via go/ees005
|
|
203
203
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
204
204
|
update(node, ..._args) {
|
|
205
|
-
if (this.isHeaderRow
|
|
205
|
+
if (this.isHeaderRow) {
|
|
206
206
|
this.updateSingleRowTableStickyHeaderState();
|
|
207
207
|
}
|
|
208
208
|
|
|
@@ -315,7 +315,7 @@ export default class TableRowNativeStickyWithFallback extends TableNodeView {
|
|
|
315
315
|
* be cleaned up.
|
|
316
316
|
*/
|
|
317
317
|
entries.forEach(entry => {
|
|
318
|
-
if (
|
|
318
|
+
if (this.updateSingleRowTableStickyHeaderState()) {
|
|
319
319
|
return;
|
|
320
320
|
}
|
|
321
321
|
const tableWrapper = this.dom.closest(`.${ClassName.TABLE_NODE_WRAPPER}`);
|
|
@@ -407,7 +407,7 @@ export default class TableRowNativeStickyWithFallback extends TableNodeView {
|
|
|
407
407
|
if (!(observer.root instanceof HTMLElement)) {
|
|
408
408
|
return;
|
|
409
409
|
}
|
|
410
|
-
if (
|
|
410
|
+
if (this.updateSingleRowTableStickyHeaderState()) {
|
|
411
411
|
return;
|
|
412
412
|
}
|
|
413
413
|
// Only apply classes if page has scrolled since load
|
|
@@ -457,7 +457,7 @@ export default class TableRowNativeStickyWithFallback extends TableNodeView {
|
|
|
457
457
|
this.stickyStateObserver = new IntersectionObserver(entries => {
|
|
458
458
|
entries.forEach(entry => {
|
|
459
459
|
var _entry$rootBounds;
|
|
460
|
-
if (
|
|
460
|
+
if (this.updateSingleRowTableStickyHeaderState()) {
|
|
461
461
|
return;
|
|
462
462
|
}
|
|
463
463
|
const tableContainer = this.dom.closest(`.${ClassName.TABLE_CONTAINER}`);
|
|
@@ -588,7 +588,7 @@ export default class TableRowNativeStickyWithFallback extends TableNodeView {
|
|
|
588
588
|
initNodeVisibilityObserver() {
|
|
589
589
|
this.nodeVisibilityObserver = new IntersectionObserver(entries => {
|
|
590
590
|
entries.forEach(entry => {
|
|
591
|
-
if (
|
|
591
|
+
if (this.updateSingleRowTableStickyHeaderState()) {
|
|
592
592
|
return;
|
|
593
593
|
}
|
|
594
594
|
if (!this.isNativeSticky) {
|
|
@@ -679,7 +679,7 @@ export default class TableRowNativeStickyWithFallback extends TableNodeView {
|
|
|
679
679
|
});
|
|
680
680
|
}
|
|
681
681
|
refreshLegacyStickyState() {
|
|
682
|
-
if (
|
|
682
|
+
if (this.updateSingleRowTableStickyHeaderState()) {
|
|
683
683
|
return;
|
|
684
684
|
}
|
|
685
685
|
const tree = getTree(this.dom);
|
|
@@ -483,7 +483,7 @@ const roundedTableStickyHeaderCornerMaskStyles = () => css`
|
|
|
483
483
|
sticky / fallback layout. The masks belong to the wrapper of the table
|
|
484
484
|
that owns the sticky row, never to an ancestor wrapper.
|
|
485
485
|
*/
|
|
486
|
-
.${ClassName.TABLE_NODE_WRAPPER}:has(> table > tbody > tr.${
|
|
486
|
+
.${ClassName.TABLE_NODE_WRAPPER}:has(> table > tbody > tr.${ClassName.NATIVE_STICKY}.${ClassName.NATIVE_STICKY_ACTIVE})
|
|
487
487
|
> .${ClassName.TABLE_CORNER_MASK},
|
|
488
488
|
.${ClassName.TABLE_NODE_WRAPPER}:has(> table.${ClassName.TABLE_STICKY} > tbody > tr.sticky)
|
|
489
489
|
> .${ClassName.TABLE_CORNER_MASK} {
|
|
@@ -104,7 +104,7 @@ var TableRowNativeStickyWithFallback = /*#__PURE__*/function (_TableNodeView) {
|
|
|
104
104
|
});
|
|
105
105
|
var rowIndex = getTableRowIndex(view, getPos);
|
|
106
106
|
_this.isHeaderRow = supportedHeaderRow(node, rowIndex);
|
|
107
|
-
if (_this.isHeaderRow
|
|
107
|
+
if (_this.isHeaderRow) {
|
|
108
108
|
_this.isSingleRowTable = _this.checkIsSingleRowTable();
|
|
109
109
|
}
|
|
110
110
|
_this.isLegacySticky = false;
|
|
@@ -213,7 +213,7 @@ var TableRowNativeStickyWithFallback = /*#__PURE__*/function (_TableNodeView) {
|
|
|
213
213
|
// Ignored via go/ees005
|
|
214
214
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
215
215
|
function update(node) {
|
|
216
|
-
if (this.isHeaderRow
|
|
216
|
+
if (this.isHeaderRow) {
|
|
217
217
|
this.updateSingleRowTableStickyHeaderState();
|
|
218
218
|
}
|
|
219
219
|
|
|
@@ -333,7 +333,7 @@ var TableRowNativeStickyWithFallback = /*#__PURE__*/function (_TableNodeView) {
|
|
|
333
333
|
* be cleaned up.
|
|
334
334
|
*/
|
|
335
335
|
entries.forEach(function (entry) {
|
|
336
|
-
if (
|
|
336
|
+
if (_this4.updateSingleRowTableStickyHeaderState()) {
|
|
337
337
|
return;
|
|
338
338
|
}
|
|
339
339
|
var tableWrapper = _this4.dom.closest(".".concat(ClassName.TABLE_NODE_WRAPPER));
|
|
@@ -430,7 +430,7 @@ var TableRowNativeStickyWithFallback = /*#__PURE__*/function (_TableNodeView) {
|
|
|
430
430
|
if (!(observer.root instanceof HTMLElement)) {
|
|
431
431
|
return;
|
|
432
432
|
}
|
|
433
|
-
if (
|
|
433
|
+
if (_this5.updateSingleRowTableStickyHeaderState()) {
|
|
434
434
|
return;
|
|
435
435
|
}
|
|
436
436
|
// Only apply classes if page has scrolled since load
|
|
@@ -483,7 +483,7 @@ var TableRowNativeStickyWithFallback = /*#__PURE__*/function (_TableNodeView) {
|
|
|
483
483
|
this.stickyStateObserver = new IntersectionObserver(function (entries) {
|
|
484
484
|
entries.forEach(function (entry) {
|
|
485
485
|
var _entry$rootBounds;
|
|
486
|
-
if (
|
|
486
|
+
if (_this6.updateSingleRowTableStickyHeaderState()) {
|
|
487
487
|
return;
|
|
488
488
|
}
|
|
489
489
|
var tableContainer = _this6.dom.closest(".".concat(ClassName.TABLE_CONTAINER));
|
|
@@ -624,7 +624,7 @@ var TableRowNativeStickyWithFallback = /*#__PURE__*/function (_TableNodeView) {
|
|
|
624
624
|
var _this8 = this;
|
|
625
625
|
this.nodeVisibilityObserver = new IntersectionObserver(function (entries) {
|
|
626
626
|
entries.forEach(function (entry) {
|
|
627
|
-
if (
|
|
627
|
+
if (_this8.updateSingleRowTableStickyHeaderState()) {
|
|
628
628
|
return;
|
|
629
629
|
}
|
|
630
630
|
if (!_this8.isNativeSticky) {
|
|
@@ -719,7 +719,7 @@ var TableRowNativeStickyWithFallback = /*#__PURE__*/function (_TableNodeView) {
|
|
|
719
719
|
}, {
|
|
720
720
|
key: "refreshLegacyStickyState",
|
|
721
721
|
value: function refreshLegacyStickyState() {
|
|
722
|
-
if (
|
|
722
|
+
if (this.updateSingleRowTableStickyHeaderState()) {
|
|
723
723
|
return;
|
|
724
724
|
}
|
|
725
725
|
var tree = getTree(this.dom);
|
|
@@ -45,7 +45,7 @@ var roundedTableStickyHeaderNumberColumnStyles = function roundedTableStickyHead
|
|
|
45
45
|
return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n\t.", "[data-number-column='true'] .", " tr th[data-reaches-top][data-reaches-left]::before,\n\t.", "[data-number-column='true'] .", " tr.", " th[data-reaches-left]::before,\n\t.", "[data-number-column='true'] .", " .", " th[data-reaches-left]::before {\n\t\tborder-top-left-radius: ", ";\n\t\tborder-bottom: none;\n\t}\n"])), ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.NATIVE_STICKY, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.NATIVE_STICKY_ACTIVE, "var(--ds-radius-xlarge, 12px)");
|
|
46
46
|
};
|
|
47
47
|
var roundedTableStickyHeaderCornerMaskStyles = function roundedTableStickyHeaderCornerMaskStyles() {
|
|
48
|
-
return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n\t/* Same z-index as the sticky row; DOM order keeps the row above this mask and the table border below it. */\n\t.", " {\n\t\tdisplay: none;\n\t\tposition: sticky;\n\t\ttop: calc(", "px - 1px);\n\t\twidth: 12px;\n\t\theight: 12px;\n\t\tmargin-bottom: -12px;\n\t\tbackground: ", ";\n\t\tpointer-events: none;\n\t\tz-index: ", ";\n\t}\n\n\t.", "[data-number-column='true']\n\t\t.", "[data-corner='left'] {\n\t\tmargin-left: -", "px;\n\t}\n\n\t.", "[data-corner='right'] {\n\t\tleft: calc(100% - 11px);\n\t}\n\n\t/*\n\t\tScope the :has() selectors to a DIRECT child table so a nested table that\n\t\thas its own sticky row does not pull the OUTER wrapper's masks into the\n\t\tsticky / fallback layout. The masks belong to the wrapper of the table\n\t\tthat owns the sticky row, never to an ancestor wrapper.\n\t*/\n\t.", ":has(> table > tbody > tr.", ")\n\t\t> .", ",\n\t\t.", ":has(> table.", " > tbody > tr.sticky)\n\t\t> .", " {\n\t\tdisplay: block;\n\t}\n\n\t/*\n\t\tWhen the table overflows horizontally, sticky headers fall back from native\n\t\tposition: sticky to a fixed-position header row. Match that positioning so\n\t\tthe corner masks continue to cover the rounded corners in the fallback path.\n\n\t\tThe direct-child combinator inside :has() is critical: without it a nested\n\t\ttable entering the legacy fallback would incorrectly trigger this rule on\n\t\tthe OUTER wrapper, detaching the outer table's masks from its corners.\n\t*/\n\t.", ":has(> table.", " > tbody > tr.sticky)\n\t\t> .", " {\n\t\tposition: fixed;\n\t\ttop: 30px;\n\t\tz-index: 1;\n\t}\n"])), ClassName.TABLE_CORNER_MASK, tableMarginTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) && fg('platform_editor_nest_table_in_panel_patch_3') ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", nativeStickyHeaderZIndex, ClassName.TABLE_CONTAINER, ClassName.TABLE_CORNER_MASK, akEditorTableNumberColumnWidth, ClassName.TABLE_CORNER_MASK, ClassName.TABLE_NODE_WRAPPER,
|
|
48
|
+
return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n\t/* Same z-index as the sticky row; DOM order keeps the row above this mask and the table border below it. */\n\t.", " {\n\t\tdisplay: none;\n\t\tposition: sticky;\n\t\ttop: calc(", "px - 1px);\n\t\twidth: 12px;\n\t\theight: 12px;\n\t\tmargin-bottom: -12px;\n\t\tbackground: ", ";\n\t\tpointer-events: none;\n\t\tz-index: ", ";\n\t}\n\n\t.", "[data-number-column='true']\n\t\t.", "[data-corner='left'] {\n\t\tmargin-left: -", "px;\n\t}\n\n\t.", "[data-corner='right'] {\n\t\tleft: calc(100% - 11px);\n\t}\n\n\t/*\n\t\tScope the :has() selectors to a DIRECT child table so a nested table that\n\t\thas its own sticky row does not pull the OUTER wrapper's masks into the\n\t\tsticky / fallback layout. The masks belong to the wrapper of the table\n\t\tthat owns the sticky row, never to an ancestor wrapper.\n\t*/\n\t.", ":has(> table > tbody > tr.", ".", ")\n\t\t> .", ",\n\t\t.", ":has(> table.", " > tbody > tr.sticky)\n\t\t> .", " {\n\t\tdisplay: block;\n\t}\n\n\t/*\n\t\tWhen the table overflows horizontally, sticky headers fall back from native\n\t\tposition: sticky to a fixed-position header row. Match that positioning so\n\t\tthe corner masks continue to cover the rounded corners in the fallback path.\n\n\t\tThe direct-child combinator inside :has() is critical: without it a nested\n\t\ttable entering the legacy fallback would incorrectly trigger this rule on\n\t\tthe OUTER wrapper, detaching the outer table's masks from its corners.\n\t*/\n\t.", ":has(> table.", " > tbody > tr.sticky)\n\t\t> .", " {\n\t\tposition: fixed;\n\t\ttop: 30px;\n\t\tz-index: 1;\n\t}\n"])), ClassName.TABLE_CORNER_MASK, tableMarginTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) && fg('platform_editor_nest_table_in_panel_patch_3') ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", nativeStickyHeaderZIndex, ClassName.TABLE_CONTAINER, ClassName.TABLE_CORNER_MASK, akEditorTableNumberColumnWidth, ClassName.TABLE_CORNER_MASK, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_CORNER_MASK, ClassName.TABLE_NODE_WRAPPER, ClassName.TABLE_STICKY, ClassName.TABLE_CORNER_MASK, ClassName.TABLE_NODE_WRAPPER, ClassName.TABLE_STICKY, ClassName.TABLE_CORNER_MASK);
|
|
49
49
|
};
|
|
50
50
|
var roundedTableStickyHeaderOverlayStyles = function roundedTableStickyHeaderOverlayStyles() {
|
|
51
51
|
return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n\t/*\n\t\tPaint the pinned sticky row's rounded top edge via each cell's ::after.\n\t\ttop: -1px places it in the reserved transparent border slot, aligned with\n\t\tthe row's inset-shadow bottom border. Longhand border-top-* lets\n\t\tinteraction-state rules override only the colour.\n\t*/\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> th.", "[data-reaches-top]::after,\n\t\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> td.", "[data-reaches-top]::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: -1px;\n\t\tright: -1px;\n\t\ttop: -1px;\n\t\tbottom: -1px;\n\t\twidth: auto;\n\t\theight: auto;\n\t\tpointer-events: none;\n\t\tborder-top-width: 1px;\n\t\tborder-top-style: solid;\n\t\tborder-top-color: ", ";\n\t}\n\n\t/* Selection / hover / active-cursor colour for the painted top edge. */\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> th.", "[data-reaches-top]:is(\n\t\t\t.", ",\n\t\t\t.", ",\n\t\t\t.", "\n\t\t)::after,\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> td.", "[data-reaches-top]:is(\n\t\t\t.", ",\n\t\t\t.", ",\n\t\t\t.", "\n\t\t)::after {\n\t\tborder-top-color: ", ";\n\t}\n\n\t/* Danger colour for the painted top edge. */\n\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> th.", "[data-reaches-top].", "::after,\n\t\t.", "\n\t\t> table\n\t\t> tbody\n\t\t> tr.", ".", "\n\t\t> td.", "[data-reaches-top].", "::after {\n\t\tborder-top-color: ", ";\n\t}\n\n\t:where(.", " > table > tbody > tr.", ")\n\t\t> th.", "[data-reaches-left]::after {\n\t\tborder-left-color: transparent;\n\t}\n\n\t", "\n"])), ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_HEADER_CELL, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_CELL, tableBorderColor, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL, ClassName.ACTIVE_CURSOR_CELL, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_CELL, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL, ClassName.ACTIVE_CURSOR_CELL, tableBorderSelectedColor, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_CELL, ClassName.HOVERED_CELL_IN_DANGER, tableBorderDeleteColor, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.TABLE_HEADER_CELL, css(_templateObject0 || (_templateObject0 = _taggedTemplateLiteral(["\n\t\t/* Node-selected (ak-editor-selected-node) sticky header: the pinned row leaves the table's\n\t\t\t\t rounded overlay behind, so recolour its painted top edge to the selected colour too. */\n\t\t.", ".", "\n\t\t\t.", "\n\t\t\t> table\n\t\t\t> tbody\n\t\t\t> tr.", ".", "\n\t\t\t> th.", "[data-reaches-top]::after,\n\t\t\t.", ".", "\n\t\t\t.", "\n\t\t\t> table\n\t\t\t> tbody\n\t\t\t> tr.", ".", "\n\t\t\t> td.", "[data-reaches-top]::after {\n\t\t\tborder-top-color: ", ";\n\t\t}\n\t"])), ClassName.NODEVIEW_WRAPPER, akEditorSelectedNodeClassName, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_HEADER_CELL, ClassName.NODEVIEW_WRAPPER, akEditorSelectedNodeClassName, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, ClassName.NATIVE_STICKY_ACTIVE, ClassName.TABLE_CELL, tableBorderSelectedColor));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-table",
|
|
3
|
-
"version": "29.1.
|
|
3
|
+
"version": "29.1.5",
|
|
4
4
|
"description": "Table plugin for the @atlaskit/editor",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"@atlaskit/editor-plugin-batch-attribute-updates": "^17.0.0",
|
|
30
30
|
"@atlaskit/editor-plugin-content-insertion": "^17.0.0",
|
|
31
31
|
"@atlaskit/editor-plugin-editor-viewmode": "^19.0.0",
|
|
32
|
-
"@atlaskit/editor-plugin-extension": "20.0.
|
|
32
|
+
"@atlaskit/editor-plugin-extension": "20.0.5",
|
|
33
33
|
"@atlaskit/editor-plugin-guideline": "^17.0.0",
|
|
34
34
|
"@atlaskit/editor-plugin-interaction": "^28.0.0",
|
|
35
35
|
"@atlaskit/editor-plugin-limited-mode": "^14.1.0",
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"@atlaskit/editor-plugin-width": "^18.0.0",
|
|
41
41
|
"@atlaskit/editor-prosemirror": "^8.0.0",
|
|
42
42
|
"@atlaskit/editor-shared-styles": "^4.1.0",
|
|
43
|
-
"@atlaskit/editor-tables": "^3.
|
|
43
|
+
"@atlaskit/editor-tables": "^3.2.0",
|
|
44
44
|
"@atlaskit/editor-toolbar": "^2.6.0",
|
|
45
45
|
"@atlaskit/editor-ui-control-model": "^2.9.0",
|
|
46
46
|
"@atlaskit/icon": "^37.6.0",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^3.2.0",
|
|
54
54
|
"@atlaskit/pragmatic-drag-and-drop-hitbox": "^2.2.0",
|
|
55
55
|
"@atlaskit/primitives": "^22.5.0",
|
|
56
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
56
|
+
"@atlaskit/tmp-editor-statsig": "^184.0.0",
|
|
57
57
|
"@atlaskit/toggle": "^17.3.0",
|
|
58
58
|
"@atlaskit/tokens": "^16.11.0",
|
|
59
59
|
"@atlaskit/tooltip": "^24.3.0",
|