@atlaskit/editor-plugin-table 22.4.2 → 22.4.3
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/TableCell.js +85 -8
- package/dist/cjs/nodeviews/table.js +75 -0
- package/dist/cjs/ui/TableFloatingControls/NumberColumn/index.js +4 -4
- package/dist/cjs/ui/common-styles.js +21 -9
- package/dist/cjs/ui/ui-styles.js +3 -2
- package/dist/es2019/nodeviews/TableCell.js +81 -8
- package/dist/es2019/nodeviews/table.js +67 -0
- package/dist/es2019/ui/TableFloatingControls/NumberColumn/index.js +4 -4
- package/dist/es2019/ui/common-styles.js +335 -16
- package/dist/es2019/ui/ui-styles.js +4 -3
- package/dist/esm/nodeviews/TableCell.js +85 -8
- package/dist/esm/nodeviews/table.js +75 -0
- package/dist/esm/ui/TableFloatingControls/NumberColumn/index.js +4 -4
- package/dist/esm/ui/common-styles.js +21 -9
- package/dist/esm/ui/ui-styles.js +3 -2
- package/dist/types/nodeviews/TableCell.d.ts +12 -0
- package/dist/types/nodeviews/table.d.ts +4 -1
- package/dist/types-ts4.5/nodeviews/TableCell.d.ts +12 -0
- package/dist/types-ts4.5/nodeviews/table.d.ts +4 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-table
|
|
2
2
|
|
|
3
|
+
## 22.4.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`3a69722c61c6a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3a69722c61c6a) -
|
|
8
|
+
Add rounded corners to table node in editor. This works by hiding the actual table border and
|
|
9
|
+
adding a pseudo element with rounded corners.
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
3
12
|
## 22.4.2
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
|
@@ -14,6 +14,8 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
|
|
|
14
14
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
15
|
var _adfSchema = require("@atlaskit/adf-schema");
|
|
16
16
|
var _analytics = require("@atlaskit/editor-common/analytics");
|
|
17
|
+
var _editorTables = require("@atlaskit/editor-tables");
|
|
18
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
17
19
|
var _TableNodeViewBase = _interopRequireDefault(require("./TableNodeViewBase"));
|
|
18
20
|
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
|
|
19
21
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
@@ -49,6 +51,22 @@ var TableCell = exports.default = /*#__PURE__*/function (_TableNodeView) {
|
|
|
49
51
|
var _this;
|
|
50
52
|
(0, _classCallCheck2.default)(this, TableCell);
|
|
51
53
|
_this = _callSuper(this, TableCell, [node, view, getPos, eventDispatcher]);
|
|
54
|
+
/** Cached edge state to avoid redundant DOM writes. */
|
|
55
|
+
(0, _defineProperty2.default)(_this, "prevReachesTop", false);
|
|
56
|
+
(0, _defineProperty2.default)(_this, "prevReachesBottom", false);
|
|
57
|
+
(0, _defineProperty2.default)(_this, "prevReachesLeft", false);
|
|
58
|
+
(0, _defineProperty2.default)(_this, "prevReachesRight", false);
|
|
59
|
+
(0, _defineProperty2.default)(_this, "destroy", function () {
|
|
60
|
+
if (_this.delayHandle && typeof window !== 'undefined') {
|
|
61
|
+
var _window, _window$cancelIdleCal, _window2, _window2$cancelAnimat;
|
|
62
|
+
// eslint-disable-next-line compat/compat
|
|
63
|
+
(_window = window) === null || _window === void 0 || (_window$cancelIdleCal = _window.cancelIdleCallback) === null || _window$cancelIdleCal === void 0 || _window$cancelIdleCal.call(_window, _this.delayHandle);
|
|
64
|
+
(_window2 = window) === null || _window2 === void 0 || (_window2$cancelAnimat = _window2.cancelAnimationFrame) === null || _window2$cancelAnimat === void 0 || _window2$cancelAnimat.call(_window2, _this.delayHandle);
|
|
65
|
+
}
|
|
66
|
+
});
|
|
67
|
+
if ((0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true)) {
|
|
68
|
+
_this.updateTableEdgeAttrs(node);
|
|
69
|
+
}
|
|
52
70
|
|
|
53
71
|
// CONFCLOUD-78239: Previously we had a bug which tried to invert the heading colour of a table
|
|
54
72
|
// Obviously design tokens can't be inverted and so it would result in `VAR(--DS-BACKGROUND-ACCENT-GRAY-SUBTLEST, #F4F5F7)`
|
|
@@ -60,14 +78,6 @@ var TableCell = exports.default = /*#__PURE__*/function (_TableNodeView) {
|
|
|
60
78
|
// This is a workaround to fix those cases on the fly. Note it is super specific on purpose
|
|
61
79
|
// so that it just fixes the heading token (other tokens should be unaffected)
|
|
62
80
|
// At some point in the future
|
|
63
|
-
(0, _defineProperty2.default)(_this, "destroy", function () {
|
|
64
|
-
if (_this.delayHandle && typeof window !== 'undefined') {
|
|
65
|
-
var _window, _window$cancelIdleCal, _window2, _window2$cancelAnimat;
|
|
66
|
-
// eslint-disable-next-line compat/compat
|
|
67
|
-
(_window = window) === null || _window === void 0 || (_window$cancelIdleCal = _window.cancelIdleCallback) === null || _window$cancelIdleCal === void 0 || _window$cancelIdleCal.call(_window, _this.delayHandle);
|
|
68
|
-
(_window2 = window) === null || _window2 === void 0 || (_window2$cancelAnimat = _window2.cancelAnimationFrame) === null || _window2$cancelAnimat === void 0 || _window2$cancelAnimat.call(_window2, _this.delayHandle);
|
|
69
|
-
}
|
|
70
|
-
});
|
|
71
81
|
if (cssVariablePattern.test(node.attrs.background)) {
|
|
72
82
|
_this.delayHandle = delayUntilIdle(function () {
|
|
73
83
|
var pos = getPos();
|
|
@@ -98,6 +108,70 @@ var TableCell = exports.default = /*#__PURE__*/function (_TableNodeView) {
|
|
|
98
108
|
}
|
|
99
109
|
return didUpdate;
|
|
100
110
|
}
|
|
111
|
+
|
|
112
|
+
/**
|
|
113
|
+
* Detects whether this cell visually reaches the bottom or right edge of the table
|
|
114
|
+
* (accounting for rowspan/colspan) and sets data attributes so CSS can apply
|
|
115
|
+
* rounded corners and transparent borders to merged cells that span to the table edges.
|
|
116
|
+
*/
|
|
117
|
+
}, {
|
|
118
|
+
key: "updateTableEdgeAttrs",
|
|
119
|
+
value: function updateTableEdgeAttrs(node) {
|
|
120
|
+
var pos = this.getPos();
|
|
121
|
+
if (pos === undefined) {
|
|
122
|
+
return;
|
|
123
|
+
}
|
|
124
|
+
try {
|
|
125
|
+
var resolvedPos = this.view.state.doc.resolve(pos);
|
|
126
|
+
|
|
127
|
+
// Cell → row → table: depth-1 is the table, depth is the row
|
|
128
|
+
var tableDepth = resolvedPos.depth - 1;
|
|
129
|
+
var rowDepth = resolvedPos.depth;
|
|
130
|
+
if (tableDepth < 0 || rowDepth < 0) {
|
|
131
|
+
return;
|
|
132
|
+
}
|
|
133
|
+
var tableNode = resolvedPos.node(tableDepth);
|
|
134
|
+
if (tableNode.type.name !== 'table') {
|
|
135
|
+
return;
|
|
136
|
+
}
|
|
137
|
+
var tableMap = _editorTables.TableMap.get(tableNode);
|
|
138
|
+
var cellStartInTable = pos - resolvedPos.start(tableDepth);
|
|
139
|
+
var cellRect = tableMap.findCell(cellStartInTable);
|
|
140
|
+
var reachesTop = cellRect.top === 0;
|
|
141
|
+
var reachesBottom = cellRect.bottom >= tableMap.height;
|
|
142
|
+
var reachesLeft = cellRect.left === 0;
|
|
143
|
+
var reachesRight = cellRect.right >= tableMap.width;
|
|
144
|
+
|
|
145
|
+
// Only touch DOM attributes that actually changed
|
|
146
|
+
if (reachesTop !== this.prevReachesTop) {
|
|
147
|
+
this.prevReachesTop = reachesTop;
|
|
148
|
+
this.setDataAttr('data-reaches-top', reachesTop);
|
|
149
|
+
}
|
|
150
|
+
if (reachesBottom !== this.prevReachesBottom) {
|
|
151
|
+
this.prevReachesBottom = reachesBottom;
|
|
152
|
+
this.setDataAttr('data-reaches-bottom', reachesBottom);
|
|
153
|
+
}
|
|
154
|
+
if (reachesLeft !== this.prevReachesLeft) {
|
|
155
|
+
this.prevReachesLeft = reachesLeft;
|
|
156
|
+
this.setDataAttr('data-reaches-left', reachesLeft);
|
|
157
|
+
}
|
|
158
|
+
if (reachesRight !== this.prevReachesRight) {
|
|
159
|
+
this.prevReachesRight = reachesRight;
|
|
160
|
+
this.setDataAttr('data-reaches-right', reachesRight);
|
|
161
|
+
}
|
|
162
|
+
} catch (_unused) {
|
|
163
|
+
// Position may be stale during document mutations; silently ignore.
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
}, {
|
|
167
|
+
key: "setDataAttr",
|
|
168
|
+
value: function setDataAttr(attr, value) {
|
|
169
|
+
if (value) {
|
|
170
|
+
this.dom.setAttribute(attr, 'true');
|
|
171
|
+
} else {
|
|
172
|
+
this.dom.removeAttribute(attr);
|
|
173
|
+
}
|
|
174
|
+
}
|
|
101
175
|
}, {
|
|
102
176
|
key: "updateNodeView",
|
|
103
177
|
value: function updateNodeView(node) {
|
|
@@ -137,6 +211,9 @@ var TableCell = exports.default = /*#__PURE__*/function (_TableNodeView) {
|
|
|
137
211
|
removedAttrs.forEach(function (key) {
|
|
138
212
|
return _this2.dom.removeAttribute(key);
|
|
139
213
|
});
|
|
214
|
+
if ((0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true)) {
|
|
215
|
+
this.updateTableEdgeAttrs(node);
|
|
216
|
+
}
|
|
140
217
|
return true;
|
|
141
218
|
}
|
|
142
219
|
|
|
@@ -64,6 +64,37 @@ var handleInlineTableWidth = function handleInlineTableWidth(table, width) {
|
|
|
64
64
|
}
|
|
65
65
|
table.style.setProperty('width', "".concat(width, "px"));
|
|
66
66
|
};
|
|
67
|
+
var setDataAttr = function setDataAttr(cell, attr, value) {
|
|
68
|
+
var hasAttr = cell.hasAttribute(attr);
|
|
69
|
+
if (value && !hasAttr) {
|
|
70
|
+
cell.setAttribute(attr, 'true');
|
|
71
|
+
} else if (!value && hasAttr) {
|
|
72
|
+
cell.removeAttribute(attr);
|
|
73
|
+
}
|
|
74
|
+
};
|
|
75
|
+
var refreshRoundedTableEdgeAttrs = function refreshRoundedTableEdgeAttrs(table, tableNode) {
|
|
76
|
+
try {
|
|
77
|
+
var tableMap = _tableMap.TableMap.get(tableNode);
|
|
78
|
+
var cells = Array.from(table.rows).flatMap(function (row) {
|
|
79
|
+
return Array.from(row.cells);
|
|
80
|
+
});
|
|
81
|
+
var cellOffsets = Array.from(new Set(tableMap.map));
|
|
82
|
+
cellOffsets.forEach(function (cellOffset, cellIndex) {
|
|
83
|
+
var cell = cells[cellIndex];
|
|
84
|
+
if (!cell) {
|
|
85
|
+
return;
|
|
86
|
+
}
|
|
87
|
+
var cellRect = tableMap.findCell(cellOffset);
|
|
88
|
+
setDataAttr(cell, 'data-reaches-top', cellRect.top === 0);
|
|
89
|
+
setDataAttr(cell, 'data-reaches-bottom', cellRect.bottom >= tableMap.height);
|
|
90
|
+
setDataAttr(cell, 'data-reaches-left', cellRect.left === 0);
|
|
91
|
+
setDataAttr(cell, 'data-reaches-right', cellRect.right >= tableMap.width);
|
|
92
|
+
});
|
|
93
|
+
} catch (_unused) {
|
|
94
|
+
// Table structure can be transient while ProseMirror normalises transactions.
|
|
95
|
+
// Keep existing edge attrs if the current shape cannot be mapped safely.
|
|
96
|
+
}
|
|
97
|
+
};
|
|
67
98
|
var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
|
|
68
99
|
function TableView(props) {
|
|
69
100
|
var _this;
|
|
@@ -248,6 +279,46 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
|
|
|
248
279
|
}
|
|
249
280
|
}
|
|
250
281
|
}
|
|
282
|
+
}, {
|
|
283
|
+
key: "scheduleRoundedTableEdgeRefresh",
|
|
284
|
+
value:
|
|
285
|
+
// Each TableCell node view refreshes its own edge attrs when its cell attrs change.
|
|
286
|
+
// However, when the table's shape changes (e.g. a new row is inserted below the
|
|
287
|
+
// last row), ProseMirror may reuse the existing neighbouring cells as-is, so those
|
|
288
|
+
// cells never get a chance to update their edge attrs on their own.
|
|
289
|
+
//
|
|
290
|
+
// To cover those cases, we refresh edge attrs from the table node view here.
|
|
291
|
+
//
|
|
292
|
+
// The refresh runs on the next animation frame because ReactNodeView.update()
|
|
293
|
+
// schedules the table's React render via the portal provider. If we read
|
|
294
|
+
// `this.table.rows` synchronously, we'd still see the previous DOM.
|
|
295
|
+
function scheduleRoundedTableEdgeRefresh(node) {
|
|
296
|
+
var _this4 = this;
|
|
297
|
+
if (this.roundedTableEdgeRefreshHandle !== undefined) {
|
|
298
|
+
cancelAnimationFrame(this.roundedTableEdgeRefreshHandle);
|
|
299
|
+
}
|
|
300
|
+
this.roundedTableEdgeRefreshHandle = requestAnimationFrame(function () {
|
|
301
|
+
_this4.roundedTableEdgeRefreshHandle = undefined;
|
|
302
|
+
if (_this4.table instanceof HTMLTableElement) {
|
|
303
|
+
refreshRoundedTableEdgeAttrs(_this4.table, node);
|
|
304
|
+
}
|
|
305
|
+
});
|
|
306
|
+
}
|
|
307
|
+
}, {
|
|
308
|
+
key: "update",
|
|
309
|
+
value: function update(node, decorations, innerDecorations, validUpdate) {
|
|
310
|
+
if (!(0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true)) {
|
|
311
|
+
return _superPropGet(TableView, "update", this, 3)([node, decorations, innerDecorations, validUpdate]);
|
|
312
|
+
}
|
|
313
|
+
var currentTableMap = _tableMap.TableMap.get(this.node);
|
|
314
|
+
var nextTableMap = _tableMap.TableMap.get(node);
|
|
315
|
+
var tableGeometryChanged = currentTableMap.width !== nextTableMap.width || currentTableMap.height !== nextTableMap.height;
|
|
316
|
+
var didUpdate = _superPropGet(TableView, "update", this, 3)([node, decorations, innerDecorations, validUpdate]);
|
|
317
|
+
if (didUpdate && tableGeometryChanged) {
|
|
318
|
+
this.scheduleRoundedTableEdgeRefresh(node);
|
|
319
|
+
}
|
|
320
|
+
return didUpdate;
|
|
321
|
+
}
|
|
251
322
|
}, {
|
|
252
323
|
key: "render",
|
|
253
324
|
value: function render(props, forwardRef) {
|
|
@@ -325,6 +396,10 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
|
|
|
325
396
|
key: "destroy",
|
|
326
397
|
value: function destroy() {
|
|
327
398
|
var _this$eventDispatcher;
|
|
399
|
+
if (this.roundedTableEdgeRefreshHandle !== undefined) {
|
|
400
|
+
cancelAnimationFrame(this.roundedTableEdgeRefreshHandle);
|
|
401
|
+
this.roundedTableEdgeRefreshHandle = undefined;
|
|
402
|
+
}
|
|
328
403
|
if (this.resizeObserver) {
|
|
329
404
|
this.resizeObserver.disconnect();
|
|
330
405
|
}
|
|
@@ -80,9 +80,9 @@ var NumberColumn = exports.default = /*#__PURE__*/function (_Component) {
|
|
|
80
80
|
style: {
|
|
81
81
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
82
82
|
marginTop: hasHeaderRow && this.props.stickyTop !== undefined ? rowHeights[0] : undefined,
|
|
83
|
-
borderLeft:
|
|
83
|
+
borderLeft: isDragAndDropEnabled && tableActive && !(0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true)
|
|
84
84
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
85
|
-
|
|
85
|
+
? "1px solid ".concat(_consts.tableBorderColor) : undefined,
|
|
86
86
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
87
87
|
visibility: 'hidden' // Ensure the column is not visible during SSR
|
|
88
88
|
},
|
|
@@ -95,9 +95,9 @@ var NumberColumn = exports.default = /*#__PURE__*/function (_Component) {
|
|
|
95
95
|
style: {
|
|
96
96
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
97
97
|
marginTop: hasHeaderRow && this.props.stickyTop !== undefined ? rowHeights[0] : undefined,
|
|
98
|
-
borderLeft:
|
|
98
|
+
borderLeft: isDragAndDropEnabled && tableActive && !(0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true)
|
|
99
99
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
100
|
-
|
|
100
|
+
? "1px solid ".concat(_consts.tableBorderColor) : undefined,
|
|
101
101
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
102
102
|
visibility: 'visible'
|
|
103
103
|
},
|
|
@@ -20,7 +20,7 @@ var _consts = require("../pm-plugins/view-mode-sort/consts");
|
|
|
20
20
|
var _types = require("../types");
|
|
21
21
|
var _consts2 = require("./consts");
|
|
22
22
|
var _uiStyles = require("./ui-styles");
|
|
23
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1;
|
|
23
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
|
|
24
24
|
/* eslint-disable @atlaskit/editor/no-re-export */
|
|
25
25
|
// Entry file in package.json
|
|
26
26
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression */
|
|
@@ -69,26 +69,38 @@ var tableStickyHeaderFirefoxFixStyle = function tableStickyHeaderFirefoxFixStyle
|
|
|
69
69
|
return (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t.", " > tbody::before {\n\t\t\t\tcontent: '';\n\t\t\t}\n\t\t"])), _types.TableCssClassName.TABLE_STICKY);
|
|
70
70
|
}
|
|
71
71
|
};
|
|
72
|
-
var
|
|
73
|
-
return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t
|
|
72
|
+
var roundedTableCellCornerStyles = function roundedTableCellCornerStyles() {
|
|
73
|
+
return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " > table {\n\t\t/* Round table corner cells (including merged cells that span to the edge)\n\t\t and their interaction overlays. The data-reaches-* attributes are set by the\n\t\t TableCell node view based on each cell's position + rowspan/colspan. */\n\t\t> tbody > tr > td[data-reaches-top][data-reaches-left],\n\t\t> tbody > tr > th[data-reaches-top][data-reaches-left] {\n\t\t\tborder-top-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t&.", ".", "::after {\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-top][data-reaches-right],\n\t\t> tbody > tr > th[data-reaches-top][data-reaches-right] {\n\t\t\tborder-top-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t&.", ".", "::after {\n\t\t\t\tborder-top-right-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-bottom][data-reaches-left],\n\t\t> tbody > tr > th[data-reaches-bottom][data-reaches-left] {\n\t\t\tborder-bottom-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t&.", ".", "::after {\n\t\t\t\tborder-bottom-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-bottom][data-reaches-right],\n\t\t> tbody > tr > th[data-reaches-bottom][data-reaches-right] {\n\t\t\tborder-bottom-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&.", "::after,\n\t\t\t&.", ".", "::after {\n\t\t\t\tborder-bottom-right-radius: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)");
|
|
74
|
+
};
|
|
75
|
+
var roundedTableInteractionOverlayStyles = function roundedTableInteractionOverlayStyles() {
|
|
76
|
+
return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " > table {\n\t\t/* Active-cell highlight base properties (replaces activeCellHighlightStyles).\n\t\t width/height: auto overrides the base cell ::after which uses width: 100%; height: 100%,\n\t\t so that left/right/top/bottom determine the size instead. */\n\t\ttd.", ".", "::after,\n\t\tth.", ".", "::after {\n\t\t\tborder: 1px solid ", ";\n\t\t\tbox-shadow: ", ";\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\ttop: -1px;\n\t\t\tleft: -1px;\n\t\t\tright: -1px;\n\t\t\tbottom: -1px;\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t\tz-index: ", ";\n\t\t\tpointer-events: none;\n\t\t}\n\n\t\t/* Normalize selected/hover/danger overlays to the same box model as active-cell.\n\t\t width/height: auto overrides the base cell ::after which uses width: 100%; height: 100%. */\n\t\ttd.", "::after,\n\t\ttd.", "::after,\n\t\tth.", ".", "::after,\n\t\tth.", ".", "::after,\n\t\tth.", ".", "::after,\n\t\ttd.", ".", "::after {\n\t\t\tleft: -1px;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\tbottom: -1px;\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t}\n\n\t\t/* Active-cell overlays: clamp outer sides using data-reaches-* attributes.\n\t\t Internal sides keep -1px overlap; true outer edges are clamped to 0. */\n\t\t> tbody > tr > td[data-reaches-top].", "::after,\n\t\t> tbody > tr > th[data-reaches-top].", "::after {\n\t\t\ttop: 0;\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-left].", "::after,\n\t\t> tbody > tr > th[data-reaches-left].", "::after {\n\t\t\tleft: 0;\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-right].", "::after,\n\t\t> tbody > tr > th[data-reaches-right].", "::after {\n\t\t\tright: 0;\n\t\t}\n\n\t\t> tbody > tr > td[data-reaches-bottom].", "::after,\n\t\t> tbody > tr > th[data-reaches-bottom].", "::after {\n\t\t\tbottom: 0;\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer left side and draw overlay border. */\n\t\t> tbody > tr > td[data-reaches-left].", ",\n\t\t> tbody > tr > th[data-reaches-left].", ",\n\t\t> tbody > tr > td[data-reaches-left].", ",\n\t\t> tbody > tr > th[data-reaches-left].", ",\n\t\t> tbody > tr > td[data-reaches-left].", ",\n\t\t> tbody > tr > th[data-reaches-left].", " {\n\t\t\tborder-left-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tleft: 0;\n\t\t\t\tborder-left-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer left side. */\n\t\t> tbody > tr > td[data-reaches-left].", ",\n\t\t> tbody > tr > th[data-reaches-left].", " {\n\t\t\tborder-left-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tleft: 0;\n\t\t\t\tborder-left-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer right side. */\n\t\t> tbody > tr > td[data-reaches-right].", ",\n\t\t> tbody > tr > th[data-reaches-right].", ",\n\t\t> tbody > tr > td[data-reaches-right].", ",\n\t\t> tbody > tr > th[data-reaches-right].", ",\n\t\t> tbody > tr > td[data-reaches-right].", ",\n\t\t> tbody > tr > th[data-reaches-right].", " {\n\t\t\tborder-right-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tright: 0;\n\t\t\t\tborder-right-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer right side. */\n\t\t> tbody > tr > td[data-reaches-right].", ",\n\t\t> tbody > tr > th[data-reaches-right].", " {\n\t\t\tborder-right-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tright: 0;\n\t\t\t\tborder-right-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Selected/hover/active overlays: clamp outer bottom side. */\n\t\t> tbody > tr > td[data-reaches-bottom].", ",\n\t\t> tbody > tr > th[data-reaches-bottom].", ",\n\t\t> tbody > tr > td[data-reaches-bottom].", ",\n\t\t> tbody > tr > th[data-reaches-bottom].", ",\n\t\t> tbody > tr > td[data-reaches-bottom].", ",\n\t\t> tbody > tr > th[data-reaches-bottom].", " {\n\t\t\tborder-bottom-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tborder-bottom-color: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Danger/delete overlays: clamp outer bottom side. */\n\t\t> tbody > tr > td[data-reaches-bottom].", ",\n\t\t> tbody > tr > th[data-reaches-bottom].", " {\n\t\t\tborder-bottom-color: transparent;\n\n\t\t\t&::after {\n\t\t\t\tborder-bottom-color: ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, "var(--ds-border-selected, #1868DB)", "var(--ds-shadow-raised, 0px 1px 1px #1E1F2140, 0px 0px 1px #1E1F214f)", _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _types.TableCssClassName.ACTIVE_CURSOR_CELL, _consts2.tableBorderSelectedColor, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor);
|
|
77
|
+
};
|
|
78
|
+
var roundedTableNumberedColumnStyles = function roundedTableNumberedColumnStyles() {
|
|
79
|
+
return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n\t/* Numbered columns are separate, so they need their own rounded edge owner. */\n\t.", "[data-number-column='true'] {\n\t\t/* Override the inline/container left border and replace it with one rounded pseudo-border. */\n\t\t> .", " .", ",\n\t\t> .", " .", " {\n\t\t\tposition: relative;\n\t\t\tborder-left: 0;\n\n\t\t\t&::before {\n\t\t\t\tcontent: '';\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 0;\n\t\t\t\tleft: 0;\n\t\t\t\tbottom: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\tborder-left: 1px solid ", ";\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t\tborder-bottom-left-radius: ", ";\n\t\t\t\tpointer-events: none;\n\t\t\t\tz-index: ", ";\n\t\t\t}\n\t\t}\n\n\t\t/* Prevent individual number buttons from drawing a straight left border. */\n\t\t> .", " .", ",\n\t\t> .", " .", " {\n\t\t\tborder-left-color: transparent;\n\t\t}\n\n\t\t> .", " .", ".", ",\n\t\t> .", " .", ".", ",\n\t\t> .", " .", ".", ",\n\t\t> .", " .", ".", ",\n\t\t> .", " .", ".active,\n\t\t> .", " .", ".active {\n\t\t\tborder-left-color: transparent;\n\t\t}\n\n\t\t/* When numbered column is present, the visual left edge belongs to the number column widget.\n\t\t Zero out any left-side border-radius on the cell and its overlays/pseudo-borders \u2014\n\t\t but leave right-side radii untouched so right-edge cells still round correctly. */\n\t\t.", " > table > tbody > tr > th[data-reaches-top][data-reaches-left],\n\t\t.", " > table > tbody > tr > td[data-reaches-top][data-reaches-left] {\n\t\t\tborder-top-left-radius: 0;\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-left-radius: 0;\n\t\t\t}\n\t\t}\n\n\t\t.", " > table > tbody > tr > th[data-reaches-bottom][data-reaches-left],\n\t\t.", " > table > tbody > tr > td[data-reaches-bottom][data-reaches-left] {\n\t\t\tborder-bottom-left-radius: 0;\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-bottom-left-radius: 0;\n\t\t\t}\n\t\t}\n\n\t\t/* Preserve rounded numbered-column corners across normal, active, and danger states. */\n\t\t.", ":first-of-type {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ":last-of-type {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":first-of-type,\n\t\t.", ".", ":first-of-type,\n\t\t.", ".active:first-of-type {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":last-of-type,\n\t\t.", ".", ":last-of-type,\n\t\t.", ".active:last-of-type {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":first-of-type::after {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\n\t\t.", ".", ":last-of-type::after {\n\t\t\tborder-bottom-left-radius: ", ";\n\t\t}\n\n\t\t/* Sticky numbered-column mask also needs the same top-left radius. */\n\t\t.", " tr th[data-reaches-top][data-reaches-left]::before {\n\t\t\tborder-top-left-radius: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _consts2.tableBorderColor, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_ACTIVE, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, "var(--ds-radius-medium, 6px)");
|
|
80
|
+
};
|
|
81
|
+
var roundedTableStickyHeaderStyles = function roundedTableStickyHeaderStyles() {
|
|
82
|
+
return (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t/* Sticky header rows have independent border/shadow/mask painting, so patch the sticky-only painters too. */\n\t.", " > table > tbody > tr.", ",\n\t.", " > table.", " > tbody > tr.sticky {\n\t\t> th[data-reaches-left],\n\t\t> td[data-reaches-left] {\n\t\t\tborder-top-left-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-left-radius: ", ";\n\t\t\t}\n\t\t}\n\n\t\t> td[data-reaches-right],\n\t\t> th[data-reaches-right] {\n\t\t\tborder-top-right-radius: ", ";\n\n\t\t\t&::after,\n\t\t\t&::before {\n\t\t\t\tborder-top-right-radius: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " .", "::after {\n\t\tborder-left-color: transparent;\n\t}\n\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\tclip-path: inset(0 0 0 0 round ", " 0 0 0);\n\t\tbox-shadow: none !important;\n\t}\n\n\t.", " > table > tbody > tr.", ",\n\t.", " > table.", " > tbody > tr.sticky {\n\t\tbox-shadow: none !important;\n\t}\n\n\t.", ".", ":has(tr.sticky) .", " .", ":first-of-type {\n\t\tbox-shadow: none !important;\n\t}\n\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_STICKY, "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _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-medium, 6px)", "var(--ds-radius-medium, 6px)", _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON);
|
|
83
|
+
};
|
|
84
|
+
var roundedTableOverrides = function roundedTableOverrides() {
|
|
85
|
+
return (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t", "\n\t", "\n\t", "\n\t", "\n"])), roundedTableCellCornerStyles(), roundedTableInteractionOverlayStyles(), roundedTableNumberedColumnStyles(), roundedTableStickyHeaderStyles());
|
|
74
86
|
};
|
|
75
87
|
var baseTableStylesWithoutSharedStyle = function baseTableStylesWithoutSharedStyle(props) {
|
|
76
|
-
return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t.", " {\n\t\ttd.", ", th.", " {\n\t\t\tposition: relative;\n\t\t\toverflow: visible;\n\t\t}\n\n\t\ttd.", " {\n\t\t\tbackground-color: ", ";\n\t\t\t&::after {\n\t\t\t\theight: 100%;\n\t\t\t\tcontent: '';\n\t\t\t\tborder-left: 1px solid ", ";\n\t\t\t\tborder-bottom: 1px solid ", ";\n\t\t\t\tposition: absolute;\n\t\t\t\tright: 0px;\n\t\t\t\ttop: 0px;\n\t\t\t\tbottom: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t", "\n\t}\n\n\t.", " {\n\t\t", "\n\t}\n\n\t", "\n\n\t", "\n\n\t/* Delete button */\n\t", "\n\t/* Ends Delete button */\n\n\t/* sticky styles */\n\t.", " > .", " .", " .", ":first-of-type {\n\t\tmargin-top: ", "px;\n\t\twidth: ", "px;\n\n\t\tposition: fixed !important;\n\t\tz-index: ", " !important;\n\t\tbox-shadow: 0px -", "px ", ";\n\t\tborder-right: 0 none;\n\t\t/* top set by NumberColumn component */\n\t}\n\n\t.", " .", ".sticky {\n\t\tposition: fixed !important;\n\t\t/* needs to be above row controls */\n\t\tz-index: ", " !important;\n\t\tbackground: ", ";\n\n\t\twidth: ", "px;\n\t\theight: ", "px;\n\t}\n\n\t.", ".sticky .", " {\n\t\tborder-bottom: 0px none;\n\t\tborder-right: 0px none;\n\n\t\theight: ", "px;\n\t\twidth: ", "px;\n\t}\n\n\t", "\n\n\t", "\n\n .", "\n .", "\n .", ".sticky {\n\t\tposition: fixed !important;\n\t\tz-index: ", " !important;\n\t\tdisplay: flex;\n\t\tborder-left: ", "px solid ", ";\n\t\tmargin-left: -", "px;\n\t}\n\n\t.", " col:first-of-type {\n\t\t/* moving rows out of a table layout does weird things in Chrome */\n\t\tborder-right: 1px solid ", ";\n\t}\n\n\ttr.sticky {\n\t\tpadding-top: ", "px;\n\t\tposition: fixed;\n\t\tdisplay: grid;\n\n\t\t/* to keep it above cell selection but below date and other nodes popups that are inside sticky header */\n\t\tz-index: ", ";\n\n\t\toverflow-y: visible;\n\t\toverflow-x: hidden;\n\n\t\tgrid-auto-flow: column;\n\n\t\t/* background for where controls apply */\n\t\tbackground: ", ";\n\t\tbox-sizing: content-box;\n\t\tbox-shadow: 0 6px 4px -4px ", ";\n\n\t\tmargin-left: -1px;\n\n\t\t&.no-pointer-events {\n\t\t\tpointer-events: none;\n\t\t}\n\t}\n\n\t.", " .", " {\n\t\tleft: unset;\n\t\tposition: fixed;\n\t\t/* needs to be above sticky header row and below date and other nodes popups that are inside sticky header */\n\t\tz-index: ", ";\n\t}\n\n\t.", ".", " .", " {\n\t\tpadding-bottom: ", "px;\n\t}\n\n\t.tableView-content-wrap:has(.tableView-content-wrap):has(\n\t\t\t.", "\n\t\t) {\n\t\tpadding-left: unset;\n\t}\n\n\t.tableView-content-wrap:has(.", ") {\n\t\tpadding-left: 15px;\n\t}\n\n\ttr.sticky th {\n\t\tborder-bottom: ", "px solid ", ";\n\t\tmargin-right: -1px;\n\t}\n\n\t.", " tr.sticky > th:last-child {\n\t\tborder-right-width: 1px;\n\t}\n\n\t/* add left edge for first cell */\n\t.", " tr.sticky > th:first-of-type {\n\t\tmargin-left: 0px;\n\t}\n\n\t/* add a little bit so the scroll lines up with the table */\n\t.", " tr.sticky::after {\n\t\tcontent: ' ';\n\t\twidth: ", "px;\n\t}\n\n\t/* To fix jumpiness caused in Chrome Browsers for sticky headers */\n\t.", " .sticky + tr {\n\t\tmin-height: 0px;\n\t}\n\n\t/* move resize line a little in sticky bar */\n\t.", ".", " {\n\t\ttr.sticky td.", ", tr.sticky th.", " {\n\t\t\t.", "::after {\n\t\t\t\tright: ", "px;\n\t\t\t}\n\t\t}\n\n\t\t/* when selected put it back to normal -- :not selector would be nicer */\n\t\ttr.sticky\n\t\t\ttd.", ".", ",\n\t\t\ttr.sticky\n\t\t\tth.", ".", " {\n\t\t\t.", "::after {\n\t\t\t\tright: ", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\ttr.sticky .", ", tr.sticky .", " {\n\t\tz-index: 1;\n\t}\n\n\ttr.", " {\n\t\tposition: sticky;\n\t\ttop: ", "px;\n\t\tz-index: calc(", " - 5);\n\t\tbox-shadow:\n\t\t\tinset -1px 1px ", ",\n\t\t\tinset 1px -1px ", ";\n\n\t\t&.", " {\n\t\t\tbox-shadow:\n\t\t\t\tinset -1px 1px ", ",\n\t\t\t\tinset 1px -1px ", ",\n\t\t\t\t0 6px 4px -4px ", ";\n\t\t}\n\n\t\t", "\n\t}\n\n\t/** Adds mask above sticky header to prevent table content from bleeding through on scroll */\n\t.", ":has(tr.", ")::before {\n\t\tcontent: ' ';\n\t\tdisplay: block;\n\t\ttop: 0;\n\t\tbox-sizing: border-box;\n\t\twidth: 100%;\n\t\theight: 0;\n\t\tmargin-bottom: -", "px;\n\t\tposition: sticky;\n\t\tborder-top: ", "px solid ", ";\n\t\tz-index: ", ";\n\t}\n\n\t/** When cleaning up, merge this with the mask style above */\n\t", "\n\n\t/** Corrects position of drag row controls when sticky header top mask is present */\n\t.", ":has(.", ")\n\t\t> .", "\n\t\t> div\n\t\t> .", " {\n\t\ttop: ", "px;\n\t\tz-index: ", ";\n\t}\n\n\t", "\n\n\t.", "[data-table-header-is-stuck='true']:has(.", ")\n\t\t> .", "\n\t\t> div\n\t\t> .", " {\n\t\tz-index: ", ";\n\t}\n\n\t/** Corrects position of numbered column when sticky header top mask is present */\n\t.", ":has(.", " ", ")\n\t\t> .", "\n\t\t> div\n\t\t> .", " {\n\t\ttop: ", "px;\n\t}\n\n\t/** Expands the mask to encompass the numbered column */\n\t.pm-table-wrapper:has([data-number-column='true'] tr.", ")::before {\n\t\tmargin-left: -", "px;\n\t\twidth: calc(100% + ", "px);\n\t}\n\n\t/** Hides the header row drag handle when the position:sticky table header is 'stuck'\n\t *\n\t * 1. We check that the header is 'stuck'.\n\t * - The table container has attribute data-table-header-is-stuck='true' when sticky positioned header is 'stuck'\n\t *\n\t * 2. We check that the header row drag handle is in the first row or the first row is selected\n\t * - The header row drag handle has the data-row-index='0' attribute (i.e. hovered), OR\n\t * - The header row drag handle has the data-selected-row-index='0' attribute\n\t * \t\tAND does not have the data-handle-appearance='default' attribute (i.e. selected)\n\t*/\n\t.", ".", "[data-table-header-is-stuck='true']\n\t.", ":is([data-row-index='0'], [data-selected-row-index='0']:not([data-handle-appearance='default'])) {\n\t\tvisibility: hidden;\n\t}\n\n\t.", " tr.", " {\n\t\ttop: ", "px;\n\t}\n\n\t.", " tr.sticky {\n\t\tpadding-top: ", "px;\n\t}\n\n\t.", ".", "\n\t\t> .", "\n\t\t.", "\n\t\t.", ":first-of-type {\n\t\tmargin-top: ", "px;\n\t}\n\n\t.", ".sticky {\n\t\tborder-top: ", "px solid ", ";\n\t}\n\n\t", "\n\t", "\n ", "\n\n .", " .", " {\n\t\theight: 0; /* stop overflow flash & set correct height in update-overflow-shadows.ts */\n\t}\n\n\t.less-padding {\n\t\tpadding: 0 ", "px;\n\n\t\t.", ", .", " {\n\t\t\tpadding: 0 ", "px;\n\n\t\t\t/* https://product-fabric.atlassian.net/browse/ED-16386\n\t\t\tFixes issue where the extra padding that is added here throws off the position\n\t\t\tof the rows control dot */\n\t\t\t&::after {\n\t\t\t\tright: 6px !important;\n\t\t\t}\n\t\t}\n\n\t\t.", ".", " {\n\t\t\tleft: -4px;\n\t\t}\n\n\t\t.", " {\n\t\t\tpadding: 0 ", "px;\n\t\t}\n\n\t\t.", ".", " {\n\t\t\tleft: -8px;\n\t\t}\n\n\t\t&.", "[data-number-column='true'] {\n\t\t\tpadding-left: ", "px;\n\t\t}\n\t\t.", ", .", " {\n\t\t\twidth: ", "px;\n\t\t}\n\n\t\t.", " {\n\t\t\tleft: 6px;\n\t\t}\n\t\t.", ".", " {\n\t\t\tleft: 8px;\n\t\t}\n\n\t\t.", " {\n\t\t\tleft: calc(100% - 6px);\n\t\t}\n\t\t.", ".", " {\n\t\t\tleft: calc(100% - 16px);\n\t\t}\n\n\t\t.", " {\n\t\t\tleft: 8px;\n\t\t}\n\t\t.", " {\n\t\t\tright: 8px;\n\t\t}\n\t}\n\n\t> .", " {\n\t\t/**\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\t}\n\n\t/* Breakout only works on top level unless wrapped in fragment mark */\n\t", "\n\n\t", ";\n\t", ";\n\n\t/* Corner controls */\n\t.", " {\n\t\twidth: ", "px;\n\t\theight: ", "px;\n\t\tdisplay: none;\n\n\t\t.", " {\n\t\t\tposition: relative;\n\n\t\t\t", ";\n\t\t}\n\t}\n\n\t.", ".sticky {\n\t\t.", " {\n\t\t\t/* sticky row insert dot overlaps other row insert and messes things up */\n\t\t\tdisplay: none !important;\n\t\t}\n\t}\n\n\t.", " {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\twidth: ", "px;\n\t\theight: ", "px;\n\t\tborder: 1px solid ", ";\n\t\tborder-radius: 0;\n\t\tborder-top-left-radius: ", "px;\n\t\tbackground: ", ";\n\t\tbox-sizing: border-box;\n\t\tpadding: 0;\n\t\t:focus {\n\t\t\toutline: none;\n\t\t}\n\t}\n\t.active .", " {\n\t\tborder-color: ", ";\n\t\tbackground: ", ";\n\t}\n\n\t.", "[data-number-column='true'] {\n\t\t.", ", .", " {\n\t\t\twidth: ", "px;\n\t\t}\n\t\t.", " .", " {\n\t\t\tborder-right-width: 0;\n\t\t}\n\t}\n\n\t:not(.", ") .", ":hover {\n\t\tborder-color: ", ";\n\t\tbackground: ", ";\n\t\tcursor: pointer;\n\t}\n\n\t:not(.", ")\n\t\t.", ".", " {\n\t\tborder-color: ", ";\n\t\tbackground: ", ";\n\t}\n\n\t/* Row controls */\n\t.", " {\n\t\twidth: ", "px;\n\t\tbox-sizing: border-box;\n\t\tdisplay: none;\n\t\tposition: relative;\n\n\t\t", ";\n\n\t\t.", " {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t}\n\t\t.", ":last-child > button {\n\t\t\tborder-bottom-left-radius: ", "px;\n\t\t}\n\t\t.", " {\n\t\t\tposition: relative;\n\t\t\tmargin-top: -1px;\n\t\t}\n\t\t.", ":hover,\n\t\t\t.", ".active,\n\t\t\t.", ":hover {\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t", "\n\t}\n\n\t.", " {\n\t\tdisplay: grid;\n\t\talign-items: center;\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\n\t\t.", " {\n\t\t\tposition: absolute;\n\t\t\talign-self: end;\n\t\t\theight: 100%;\n\t\t\twidth: 18px;\n\t\t}\n\n\t\t.", " {\n\t\t\tposition: absolute;\n\t\t\tbottom: -3px;\n\t\t\tleft: 2px;\n\t\t\tbackground-color: ", ";\n\t\t\theight: 4px;\n\t\t\twidth: 4px;\n\t\t\tborder-radius: 50%;\n\t\t\tpointer-events: none;\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " {\n\t\t\theight: ", "px;\n\t\t\tposition: absolute;\n\t\t\ttop: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t.", " {\n\t\t\tposition: absolute;\n\t\t\theight: ", "px;\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.", " {\n\t\t\tbackground-color: ", ";\n\t\t\theight: 4px;\n\t\t\twidth: 4px;\n\t\t\tborder-radius: 50%;\n\t\t\tposition: absolute;\n\t\t\tright: -2px;\n\t\t}\n\t}\n\n\t.", " {\n\t\tbackground: none;\n\t\tborder: none;\n\t\toutline: none;\n\t\tposition: absolute;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tcursor: pointer;\n\n\t\t:focus {\n\t\t\toutline: none;\n\t\t}\n\t}\n\n\t.", " {\n\t\tcursor: grab;\n\t\tpointer-events: auto;\n\n\t\tline-height: 0;\n\t\tpadding: 0;\n\t\tborder-radius: 6px;\n\t\twidth: max-content;\n\t\tborder: 2px solid ", ";\n\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tbackground: transparent;\n\t\toutline: none;\n\n\t\t&.placeholder {\n\t\t\tbackground-color: transparent;\n\t\t\tborder: 2px solid transparent;\n\t\t}\n\n\t\t&.", " {\n\t\t\tcursor: pointer;\n\t\t\t& svg {\n\t\t\t\t& > rect.", " {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t\t& > rect {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t\t& > g > rect {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&:not(.", ") {\n\t\t\t& svg {\n\t\t\t\trect {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t\tg {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&:hover {\n\t\t\t\tsvg {\n\t\t\t\t\trect {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t\tg {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&:active {\n\t\t\t\tcursor: grabbing;\n\t\t\t}\n\n\t\t\t&.selected {\n\t\t\t\t:focus {\n\t\t\t\t\toutline: 2px solid ", ";\n\t\t\t\t\toutline-offset: 1px;\n\t\t\t\t}\n\n\t\t\t\t&:active {\n\t\t\t\t\toutline: none;\n\t\t\t\t}\n\n\t\t\t\tsvg {\n\t\t\t\t\trect {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t\tg {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.danger {\n\t\t\t\tsvg {\n\t\t\t\t\trect {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t\tg {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n\n\t:not(.", ") .", " {\n\t\t", "\n\t\t", "\n\t}\n\n\t/* Numbered column */\n\t.", " {\n\t\tposition: relative;\n\t\tfloat: right;\n\t\tmargin-left: ", "px;\n\t\ttop: ", "px;\n\t\twidth: ", "px;\n\t\tbox-sizing: border-box;\n\t}\n\n\t.", " {\n\t\tborder: 1px solid ", ";\n\t\tbox-sizing: border-box;\n\t\tmargin-top: -1px;\n\t\tpadding-bottom: 2px;\n\t\tpadding: ", "\n\t\t\t2px;\n\t\ttext-align: center;\n\t\tfont-size: ", ";\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\tborder-color: ", ";\n\n\t\t:first-child:not(style),\n\t\tstyle:first-child + * {\n\t\t\tmargin-top: 0;\n\t\t}\n\t\t:last-child {\n\t\t\tborder-bottom: 1px solid ", ";\n\t\t}\n\t}\n\n\t/* add a background above the first numbered column cell when sticky header is engaged\n\twhich hides the table when scrolling */\n\t.", "\n\t\t> .", " {\n\t\t.", ":first-of-type::after {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\theight: 33px;\n\t\t\twidth: 100%;\n\t\t\tbackground-color: ", ";\n\t\t\tposition: absolute;\n\n\t\t\t/* the extra pixel is accounting for borders */\n\t\t\ttop: -34px;\n\t\t\tleft: -1px;\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", ", .", " {\n\t\t\tdisplay: block;\n\t\t}\n\t\t.", " {\n\t\t\tpadding-left: 0px;\n\n\t\t\t.", " {\n\t\t\t\tborder-left: 0 none;\n\t\t\t}\n\n\t\t\t.", ".active {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t/* nested tables should be ignored when we apply border-left: 0 to the parent table */\n\t\t.", " {\n\t\t\t.", " {\n\t\t\t\tborder-left: 1px solid ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n\n\t:not(.", ") .", " {\n\t\t.", ":not(.", ") {\n\t\t\tcursor: pointer;\n\t\t}\n\t\t.", ":not(.", "):hover {\n\t\t\t", "\n\t\t}\n\t\t.", ".", " {\n\t\t\tbackground-color: ", ";\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-left: 0;\n\t\t\tcolor: ", ";\n\t\t\tposition: relative;\n\t\t\tz-index: ", ";\n\t\t}\n\t}\n\n\t", "\n\n\t/* Table */\n\t.", " > table {\n\t\ttable-layout: fixed;\n\t\twhite-space: normal;\n\t\tborder-top: none;\n\t\t/* 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212 */\n\t\tmargin-right: -1px;\n\t\t/* Allows better positioning for the shadow sentinels - ED-16668 */\n\t\tposition: relative;\n\n\t\t> tbody > tr {\n\t\t\twhite-space: pre-wrap;\n\t\t}\n\n\t\t.", " + * {\n\t\t\tmargin-top: 0;\n\t\t}\n\n\t\t/*\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\t\tth.", " > .fabric-editor-block-mark {\n\t\t\t> h1:first-of-type,\n\t\t\t> h2:first-of-type,\n\t\t\t> h3:first-of-type,\n\t\t\t> h4:first-of-type,\n\t\t\t> h5:first-of-type,\n\t\t\t> h6:first-of-type {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t.", ", .", " {\n\t\t\tposition: relative;\n\t\t}\n\t\t/* Give selected cells a blue overlay */\n\t\t.", "::after, .", "::after {\n\t\t\tz-index: ", ";\n\t\t\tposition: absolute;\n\t\t\tcontent: '';\n\t\t\tleft: 0;\n\t\t\tright: 0;\n\t\t\ttop: 0;\n\t\t\tbottom: 0;\n\t\t\twidth: 100%;\n\t\t\tpointer-events: none;\n\t\t}\n\t\t.", " {\n\t\t\tborder: 1px solid ", ";\n\t\t}\n\t\t.", "::after {\n\t\t\tbackground: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\t\t/* Override border colors for danger state */\n\t\tth.", ".", ",\n\t\t\ttd.", ".", " {\n\t\t\tborder-left-color: ", ";\n\t\t\tborder-top-color: ", ";\n\t\t\t&::after {\n\t\t\t\theight: 100%;\n\t\t\t\twidth: 100%;\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t\tcontent: '';\n\t\t\t\tposition: absolute;\n\t\t\t\tleft: -1px;\n\t\t\t\ttop: -1px;\n\t\t\t\tbottom: 0;\n\t\t\t\tz-index: ", ";\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpointer-events: none;\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t\ttd.", ",\n\t\t\ttd.", ",\n\t\t\tth.", ".", ",\n\t\t\tth.", ".", " {\n\t\t\t&::after {\n\t\t\t\theight: 100%;\n\t\t\t\twidth: 100%;\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t\tcontent: '';\n\t\t\t\tposition: absolute;\n\t\t\t\tleft: -1px;\n\t\t\t\ttop: -1px;\n\t\t\t\tbottom: 0;\n\t\t\t\tz-index: ", ";\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t\t&.", "::after {\n\t\t\t\t", ";\n\t\t\t\tz-index: ", ";\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\n\t\t\t&.", ".", "::after {\n\t\t\t\t", ";\n\t\t\t\tz-index: ", ";\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t/* Active cursor cell highlight */\n\t", "\n\n\t/* override for DnD controls */\n\t.", " {\n\t\tposition: absolute;\n\t\tmargin-top: ", "px;\n\t\tleft: -", "px;\n\t}\n\n\t.", " {\n\t\tposition: absolute;\n\t\t/* this is to fix the misalignment of the numbered column in live page view mode */\n\t\t", "\n\t}\n\n\t.", ".", ",\n\t\t.", ".", " {\n\t\tz-index: ", ";\n\t}\n\n\t.", " {\n\t\tposition: absolute;\n\t\ttop: ", "px;\n\t}\n\n\t", "\n\n\t/** Mask for content to the left of the column controls */\n\n\t.", "[data-number-column=\"true\"] .", " > .", "::before {\n\t\tcontent: '';\n\t\tposition: relative;\n\t\tdisplay: inline-block;\n\t\tmargin-left: -", "px;\n\t\twidth: ", "px;\n\t\theight: ", "px;\n\t\tbackground: ", ";\n\t\tz-index: ", ";\n\t}\n\n\t/** Mask for numbered column content to the left of the header row */\n\t.", "[data-number-column=\"true\"] .", " tr:first-of-type th:first-of-type::before {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t\tleft: 0;\n\t\twidth: ", "px;\n\t\theight: 100%;\n\t\tmargin-left: -", "px;\n\t\tmargin-top: -", "px;\n\t\toutline: ", ";\n\t\tborder-left: ", ";\n\t\tbackground: ", ";\n\t\t", "\n\n\t\t", "\n\t}\n\n\t", "\n\n\t.", "[data-number-column=\"true\"].", " .", " tr:first-of-type th.", ":not(.", "):first-of-type::before, .", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":not(.", ", .", "):first-of-type::before {\n\t\toutline: none;\n\t\tborder-left-color: ", ";\n\t\t", "\n\t\tbackground: ", ";\n\t}\n\n\t", "\n\n\t.", "[data-number-column=\"true\"] .", " .", " th:first-of-type::before {\n\t\tbox-shadow: 0 6px 4px -4px ", ";\n\t}\n\n\t.", "\n\t\t.", ":not(.", " *) {\n\t\t/* !important to override the inline style in the inner controls component */\n\t\tmargin-top: ", "px !important;\n\t}\n\n\t.", " .", " {\n\t\tposition: fixed;\n\t\t/* higher zIndex than sticky header which is akEditorTableCellOnStickyHeaderZIndex - 5 */\n\t\tz-index: ", ";\n\t}\n\n\t", "\n\n\t/* nested tables */\n\t.", " {\n\t\t.", " .", " {\n\t\t\tposition: absolute;\n\t\t\tz-index: ", ";\n\t\t}\n\t}\n\n\t.", " {\n\t\tpadding-bottom: 0px;\n\t\t/* fixes gap cursor height */\n\t\toverflow: auto;\n\t\toverflow-y: hidden;\n\t\tposition: relative;\n\t}\n\n\t.", ".", " {\n\t\toverflow: visible;\n\t}\n"])), (0, _uiStyles.columnControlsLineMarker)(), (0, _uiStyles.hoveredDeleteButton)(), (0, _uiStyles.hoveredCell)(), _uiStyles.hoveredWarningCell, (0, _uiStyles.insertLine)(), (0, _uiStyles.resizeHandle)(), rangeSelectionStyles, rangeSelectionStylesForFakeBorders, viewModeSortStyles(), (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_improvements', 'cohort', 'test_with_overflow') && tableAnchorStyles, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.TABLE_CELL, _consts2.tableCellBackgroundColor, _consts2.tableBorderColor, _consts2.tableBorderColor, _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_COLUMN, (0, _uiStyles.insertColumnButtonWrapper)(), _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_ROW, (0, _uiStyles.insertRowButtonWrapper)(), (0, _uiStyles.dragInsertButtonWrapper)(), (0, _uiStyles.dragCornerControlButton)(), (0, _uiStyles.DeleteButton)(), _types.TableCssClassName.TABLE_STICKY, props.isDragAndDropEnabled ? _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER : _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts2.stickyRowOffsetTop, _editorSharedStyles.akEditorTableNumberColumnWidth, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts2.stickyRowOffsetTop, "var(--ds-surface, #FFFFFF)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.CORNER_CONTROLS, _editorSharedStyles.akEditorSmallZIndex, "var(--ds-surface, #FFFFFF)", _consts2.tableToolbarSize, _consts2.tableToolbarSize, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts2.tableToolbarSize, _consts2.tableToolbarSize, tableStickyHeaderColumnControlsDecorationsStyle(), tableStickyHeaderFirefoxFixStyle(), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts2.tableToolbarSize, "var(--ds-surface, #FFFFFF)", _consts2.tableToolbarSize, _types.TableCssClassName.TABLE_STICKY, "var(--ds-surface, #FFFFFF)", _consts2.stickyRowOffsetTop, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex - 5, "var(--ds-surface, #FFFFFF)", "var(--ds-shadow-overflow-perimeter, #1E1F211f)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts2.tableToolbarSize, _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _consts2.stickyHeaderBorderBottomWidth, _consts2.tableBorderColor, _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, (_consts2.resizeHandlerAreaWidth - _consts2.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, (_consts2.resizeHandlerAreaWidth - _consts2.resizeLineWidth) / 2, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex, _consts2.tableBorderColor, _consts2.tableBorderColor, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _consts2.tableBorderColor, _consts2.tableBorderColor, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "th.".concat(_types.TableCssClassName.TABLE_HEADER_CELL, "::after {\n\t\t\t\theight: 100%;\n\t\t\t\tcontent: '';\n\t\t\t\tborder-left: 1px solid ").concat(_consts2.tableBorderColor, ";\n\t\t\t\tborder-bottom: 1px solid ").concat(_consts2.tableBorderColor, ";\n\t\t\t\tposition: absolute;\n\t\t\t\tright: 0px;\n\t\t\t\ttop: 0px;\n\t\t\t\tbottom: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpointer-events: none;\n\t\t\t}") : "", _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, _styles.tableMarginTop, "var(--ds-surface, #FFFFFF)", _consts2.stickyRowZIndex, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_2') ? "\n\t\t.".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER, ":has(tr.").concat(_types.TableCssClassName.NATIVE_STICKY, ")::before {\n\t\t\tborder-top: ").concat(_styles.tableMarginTop, "px solid transparent;\n\t\t}\n\n\t\t.").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER, ":has(tr.").concat(_types.TableCssClassName.NATIVE_STICKY_ACTIVE, ")::before {\n\t\t\tborder-top: ").concat(_styles.tableMarginTop, "px solid ", "var(--ds-surface, #FFFFFF)", ";\n\t\t}") : (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "\n\t\t\t.".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER, ":has(tr.").concat(_types.TableCssClassName.NATIVE_STICKY, ")::before {\n\t\t\t\tmargin-top: 1px;\n\t\t\t}") : "", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.DRAG_ROW_CONTROLS, _consts2.tableColumnControlsHeight, _consts2.aboveNativeStickyHeaderZIndex, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_7') ? "\n\t\t.".concat(_types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, ":has(~ .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ") {\n\t\t\tmargin-top: 0;\n\t\t}\n\t") : "", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.DRAG_ROW_CONTROLS, _consts2.belowNativeStickyHeaderZIndex, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_4') ? "tr.".concat(_types.TableCssClassName.NATIVE_STICKY) : '', _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _consts2.tableColumnControlsHeight, _types.TableCssClassName.NATIVE_STICKY, _editorSharedStyles.akEditorTableNumberColumnWidth, _editorSharedStyles.akEditorTableNumberColumnWidth, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.DRAG_ROW_FLOATING_DRAG_HANDLE, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, _types.TableCssClassName.WITH_CONTROLS, _consts2.tableControlsSpacing, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts2.tableControlsSpacing, _types.TableCssClassName.CORNER_CONTROLS, _consts2.tableControlsSpacing - _consts2.tableToolbarSize, "var(--ds-surface, #FFFFFF)", sentinelStyles, (0, _uiStyles.OverflowShadow)(), stickyScrollbarStyles, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts2.tablePadding, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts2.tablePadding, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _consts2.tablePadding, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts2.tablePadding - 1, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _consts2.tableOverflowShadowWidth, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.TABLE_CHROMELESS, _styles.TableSharedCssClassName.TABLE_LEFT_BORDER, _styles.TableSharedCssClassName.TABLE_RIGHT_BORDER, _types.TableCssClassName.NODEVIEW_WRAPPER, breakoutWidthStyling(), (0, _uiStyles.columnControlsDecoration)(), (0, _uiStyles.rowControlsWrapperDotStyle)(), _types.TableCssClassName.CORNER_CONTROLS, _consts2.tableToolbarSize + 1, cornerControlHeight, _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, (0, _uiStyles.InsertMarker)("\n left: -11px;\n top: 9px;\n "), _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts2.tableToolbarSize + 1, _consts2.tableToolbarSize + 1, _consts2.tableBorderColor, _consts2.tableBorderRadiusSize, _consts2.tableHeaderCellBackgroundColor, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts2.tableBorderSelectedColor, _consts2.tableToolbarSelectedColor, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _editorSharedStyles.akEditorTableToolbarSize + _editorSharedStyles.akEditorTableNumberColumnWidth + 1, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.CONTROLS_BUTTON, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts2.tableBorderSelectedColor, _consts2.tableToolbarSelectedColor, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _consts2.tableToolbarDeleteColor, _types.TableCssClassName.ROW_CONTROLS, _consts2.tableToolbarSize, (0, _uiStyles.InsertMarker)("\n bottom: -1px;\n left: -11px;\n "), _types.TableCssClassName.ROW_CONTROLS_INNER, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _consts2.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)("\n border-bottom: 1px solid ".concat(_consts2.tableBorderColor, ";\n border-right: 0px;\n border-radius: 0;\n height: 100%;\n width: ").concat(_consts2.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.DRAG_ROW_CONTROLS, _consts2.rowControlsZIndex + 4, _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER, _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #DDDEE1)", _types.TableCssClassName.DRAG_COLUMN_CONTROLS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER, _consts2.tableColumnControlsHeight, "var(--ds-space-negative-150, -12px)", _consts2.resizeHandlerZIndex, _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER, _consts2.tableColumnControlsHeight, _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #DDDEE1)", _types.TableCssClassName.DRAG_HANDLE_BUTTON_CLICKABLE_ZONE, _types.TableCssClassName.DRAG_HANDLE_BUTTON_CONTAINER, "var(--ds-surface, #FFFFFF)", _types.TableCssClassName.DRAG_HANDLE_DISABLED, _types.TableCssClassName.DRAG_HANDLE_MINIMISED, "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-background-accent-gray-subtlest, #F0F1F2)", "var(--ds-icon-disabled, #080F214A)", _types.TableCssClassName.DRAG_HANDLE_DISABLED, "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-icon-subtle, #505258)", "var(--ds-background-accent-blue-subtle, #669DF1)", "var(--ds-icon-inverse, #FFFFFF)", "var(--ds-border-focused, #4688EC)", "var(--ds-background-accent-blue-subtle, #669DF1)", "var(--ds-icon-inverse, #FFFFFF)", "var(--ds-background-accent-red-subtler-pressed, #FD9891)", "var(--ds-border-inverse, #FFFFFF)", (0, _uiStyles.floatingColumnControls)(), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.ROW_CONTROLS, (0, _uiStyles.HeaderButtonHover)(), (0, _uiStyles.HeaderButtonDanger)(), _types.TableCssClassName.NUMBERED_COLUMN, _editorSharedStyles.akEditorTableToolbarSize, props.isDragAndDropEnabled ? 0 : _editorSharedStyles.akEditorTableToolbarSize, _editorSharedStyles.akEditorTableNumberColumnWidth + 1, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts2.tableBorderColor, (0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) || (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp') ? (0, _editorSharedStyles.relativeSizeToBaseFontSize)(10) : "10px", (0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) || (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp') ? (0, _editorSharedStyles.relativeSizeToBaseFontSize)(14) : (0, _editorSharedStyles.relativeFontSizeToBase16)(14), _consts2.tableHeaderCellBackgroundColor, _consts2.tableTextColor, _consts2.tableBorderColor, _consts2.tableBorderColor, _types.TableCssClassName.TABLE_STICKY, props.isDragAndDropEnabled ? _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER : _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON_DISABLED, "var(--ds-surface, #FFFFFF)", _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, numberedColumnButtonSelectedStyles, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts2.tableBorderColor, (0, _experiments.editorExperiment)('platform_editor_block_menu', true) ? "/* Apply numbered column styling when table is selected via text selection (e.g., block menu) */\n\t.".concat(_editorSharedStyles.akEditorSelectedNodeClassName, " {\n\t\t.").concat(_types.TableCssClassName.NUMBERED_COLUMN, " {\n\t\t\t.").concat(_types.TableCssClassName.NUMBERED_COLUMN_BUTTON, " {\n\t\t\t\t").concat(numberedColumnButtonSelectedStyles, "\n\t\t\t\t").concat(_selection.hideNativeBrowserTextSelectionStyles, "\n\t\t\t}\n\t\t}\n\t}") : '', _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON_DISABLED, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON_DISABLED, numberedColumnButtonSelectedStyles, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableToolbarDeleteColor, _consts2.tableBorderDeleteColor, "var(--ds-text-danger, #AE2E24)", _editorSharedStyles.akEditorUnitZIndex, (0, _experiments.editorExperiment)('platform_editor_block_menu', true) ? ".tableView-content-wrap.danger {\n\t\t:not(.".concat(_types.TableCssClassName.IS_RESIZING, ") .").concat(_types.TableCssClassName.WITH_CONTROLS, " {\n\t\t\t.").concat(_types.TableCssClassName.NUMBERED_COLUMN_BUTTON, " {\n\t\t\t\tbackground-color: ").concat(_consts2.tableToolbarDeleteColor, ";\n\t\t\t\tborder: 1px solid ").concat(_consts2.tableBorderDeleteColor, ";\n\t\t\t\tborder-left: 0;\n\t\t\t\tcolor: ", "var(--ds-text-danger, #AE2E24)", ";\n\t\t\t\tposition: relative;\n\t\t\t\tz-index: ").concat(_editorSharedStyles.akEditorUnitZIndex, ";\n\t\t\t}\n\t\t}\n\t}") : '', _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, _consts2.tableBorderSelectedColor, _types.TableCssClassName.SELECTED_CELL, _consts2.tableCellSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _consts2.tableBorderDeleteColor, _consts2.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _consts2.tableCellDeleteColor, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL, _consts2.tableBorderSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), _editorSharedStyles.akEditorUnitZIndex * 100, _consts2.tableCellDeleteColor, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), _editorSharedStyles.akEditorUnitZIndex * 100, _consts2.tableCellDeleteColor, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? activeCellHighlightStyles() : '', _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _styles.tableMarginTop, _consts2.tableToolbarSize + 1, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, props.isDragAndDropEnabled ? "\n\t\t\tmargin-top: ".concat(_styles.tableMarginTop, "px;\n\t\t\ttop: 0;\n\t\t\tleft: -").concat(_consts2.tableToolbarSize + 1, "px;\n\t\t") : "\n\t\t\t/* top of corner control is table margin top - corner control height + 1 pixel of table border. */\n\t\t\ttop: ".concat(_styles.tableMarginTop - cornerControlHeight + 1, "px;\n\t\t\tmargin-top: 0;\n\t\t\tleft: -").concat(_consts2.tableToolbarSize, "px;\n\t\t"), _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_LEFT_SHADOW, _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _styles.tableMarginTop, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "\n\t.".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " > .").concat(_types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, " {\n\t\t/* +2px is to overlap the table border on the sides */\n\t\twidth: calc(anchor-size(width) + 2px);\n\t\theight: ").concat(_styles.tableMarginTop, "px;\n\t\tbackground: ", "var(--ds-surface, #FFFFFF)", ";\n\t\ttop: unset;\n\t\tposition: fixed;\n\t\tposition-area: top center;\n\t\tposition-visibility: anchors-visible;\n\t\tz-index: ").concat(_consts2.nativeStickyHeaderZIndex + 1, ";\n\t}") : ".".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " > .").concat(_types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, " {\n\t\t/* +2px is to overlap the table border on the sides */\n\t\twidth: calc(anchor-size(width) + 2px);\n\t\theight: ").concat(_styles.tableMarginTop, "px;\n\t\tbackground: ", "var(--ds-surface, #FFFFFF)", ";\n\t\tposition: fixed;\n\t\tposition-area: top center;\n\t\tposition-visibility: anchors-visible;\n\t\tz-index: ").concat(_consts2.nativeStickyHeaderZIndex + 1, ";\n\t}"), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts2.dragRowControlsWidth, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts2.dragRowControlsWidth, _styles.tableMarginTop, "var(--ds-surface, #FFFFFF)", _consts2.nativeStickyHeaderZIndex - 1, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _editorSharedStyles.akEditorTableNumberColumnWidth - 1, _editorSharedStyles.akEditorTableNumberColumnWidth, _consts2.stickyRowOffsetTop, (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_9', 'isEnabled', true) ? "0.5px solid ".concat(_consts2.tableBorderColor) : "1px solid ".concat(_consts2.tableBorderColor), (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_9', 'isEnabled', true) ? 'none' : "1px solid ".concat(_consts2.tableBorderColor), "var(--ds-background-accent-gray-subtlest, #F0F1F2)", (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "border-top: 1px solid ".concat(_consts2.tableBorderColor, ";") : "", (0, _browser.getBrowserInfo)().gecko && (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_9', 'isEnabled', true) ? "border-top: 1px solid ".concat(_consts2.tableBorderColor, ";") : "border-top: none;", (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_7') ? ".ak-editor-selected-node .".concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"]:not(.").concat(_types.TableCssClassName.TABLE_SELECTED, ") .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th:first-of-type {\n\t\t\t&::before {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\t&::after {\n\t\t\t\twidth: 100%;\n\t\t\t\tborder-left: 1px solid ").concat(_consts2.tableBorderSelectedColor, ";\n\t\t\t\tbackground: ").concat(_consts2.tableCellSelectedColor, ";\n\t\t\t}\n\t}") : '', _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_SELECTED, _consts2.tableBorderSelectedColor, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "border-top-color: ".concat(_consts2.tableBorderSelectedColor, ";") : "", _consts2.tableHeaderCellSelectedColor, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? ".".concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"] .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.HOVERED_CELL_IN_DANGER, ":first-of-type::before, .").concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"] .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.HOVERED_CELL_IN_DANGER, ":not(.").concat(_types.TableCssClassName.COLUMN_SELECTED, "):first-of-type::before {\n\t\t\toutline: none;\n\t\t\tborder-left: unset;\n\t\t\tborder-top: unset;\n\t\t\tbackground: ").concat(_consts2.tableCellDeleteColor, ";\n\t\t}\n\t\t.").concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"].").concat(_types.TableCssClassName.TABLE_SELECTED, ".").concat(_types.TableCssClassName.HOVERED_DELETE_BUTTON, " .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th:first-of-type::before, .").concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"].").concat(_types.TableCssClassName.HOVERED_DELETE_BUTTON, " .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.SELECTED_CELL, ":not(.").concat(_types.TableCssClassName.COLUMN_SELECTED, "):first-of-type::before {\n\t\toutline: none;\n\t\tborder-left-color: ").concat(_consts2.tableBorderDeleteColor, ";\n\t\tborder-top-color: ").concat(_consts2.tableBorderDeleteColor, ";\n\t\tbackground: ").concat(_consts2.tableCellDeleteColor, ";\n\t\t}") : "\t.".concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"] .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.HOVERED_CELL_IN_DANGER, ":not(.").concat(_types.TableCssClassName.COLUMN_SELECTED, "):first-of-type::before {\n\t\t\t\toutline: none;\n\t\t\t\tbackground: ").concat(_consts2.tableCellDeleteColor, ";\n\t\t\t}\n\t\t\t.").concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"].").concat(_types.TableCssClassName.HOVERED_DELETE_BUTTON, " .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.SELECTED_CELL, ":not(.").concat(_types.TableCssClassName.COLUMN_SELECTED, "):first-of-type::before {\n\t\t\t\toutline: none;\n\t\t\t\tborder-left-color: ").concat(_consts2.tableBorderDeleteColor, ";\n\t\t\t\tbackground: ").concat(_consts2.tableCellDeleteColor, ";\n\t\t}"), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER, _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _styles.tableMarginTop, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex - 4, (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_improvements', 'cohort', 'test_with_overflow') && (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_6') ? ".".concat(_types.TableCssClassName.TABLE_CONTAINER, ".").concat(_types.TableCssClassName.WITH_CONTROLS, ":has(tr.sticky) .").concat(_types.TableCssClassName.NUMBERED_COLUMN, " .").concat(_types.TableCssClassName.NUMBERED_COLUMN_BUTTON, ":first-of-type {\n\t\t\tbox-shadow: 0 -5px 0 1px ").concat(_consts2.tableBorderColor, ";\n\t\t}") : "", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW);
|
|
88
|
+
return (0, _react.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t.", " {\n\t\ttd.", ", th.", " {\n\t\t\tposition: relative;\n\t\t\toverflow: visible;\n\t\t}\n\n\t\ttd.", " {\n\t\t\tbackground-color: ", ";\n\t\t\t&::after {\n\t\t\t\theight: 100%;\n\t\t\t\tcontent: '';\n\t\t\t\tborder-left: 1px solid ", ";\n\t\t\t\tborder-bottom: 1px solid ", ";\n\t\t\t\tposition: absolute;\n\t\t\t\tright: 0px;\n\t\t\t\ttop: 0px;\n\t\t\t\tbottom: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\t", "\n\t}\n\n\t.", " {\n\t\t", "\n\t}\n\n\t", "\n\n\t", "\n\n\t/* Delete button */\n\t", "\n\t/* Ends Delete button */\n\n\t/* sticky styles */\n\t.", " > .", " .", " .", ":first-of-type {\n\t\tmargin-top: ", "px;\n\t\twidth: ", "px;\n\n\t\tposition: fixed !important;\n\t\tz-index: ", " !important;\n\t\tbox-shadow: 0px -", "px ", ";\n\t\tborder-right: 0 none;\n\t\t/* top set by NumberColumn component */\n\t}\n\n\t.", " .", ".sticky {\n\t\tposition: fixed !important;\n\t\t/* needs to be above row controls */\n\t\tz-index: ", " !important;\n\t\tbackground: ", ";\n\n\t\twidth: ", "px;\n\t\theight: ", "px;\n\t}\n\n\t.", ".sticky .", " {\n\t\tborder-bottom: 0px none;\n\t\tborder-right: 0px none;\n\n\t\theight: ", "px;\n\t\twidth: ", "px;\n\t}\n\n\t", "\n\n\t", "\n\n .", "\n .", "\n .", ".sticky {\n\t\tposition: fixed !important;\n\t\tz-index: ", " !important;\n\t\tdisplay: flex;\n\t\tborder-left: ", "px solid ", ";\n\t\tmargin-left: -", "px;\n\t}\n\n\t.", " col:first-of-type {\n\t\t/* moving rows out of a table layout does weird things in Chrome */\n\t\tborder-right: 1px solid ", ";\n\t}\n\n\ttr.sticky {\n\t\tpadding-top: ", "px;\n\t\tposition: fixed;\n\t\tdisplay: grid;\n\n\t\t/* to keep it above cell selection but below date and other nodes popups that are inside sticky header */\n\t\tz-index: ", ";\n\n\t\toverflow-y: visible;\n\t\toverflow-x: hidden;\n\n\t\tgrid-auto-flow: column;\n\n\t\t/* background for where controls apply */\n\t\tbackground: ", ";\n\t\tbox-sizing: content-box;\n\t\tbox-shadow: 0 6px 4px -4px ", ";\n\n\t\tmargin-left: -1px;\n\n\t\t&.no-pointer-events {\n\t\t\tpointer-events: none;\n\t\t}\n\t}\n\n\t.", " .", " {\n\t\tleft: unset;\n\t\tposition: fixed;\n\t\t/* needs to be above sticky header row and below date and other nodes popups that are inside sticky header */\n\t\tz-index: ", ";\n\t}\n\n\t.", ".", " .", " {\n\t\tpadding-bottom: ", "px;\n\t}\n\n\t.tableView-content-wrap:has(.tableView-content-wrap):has(\n\t\t\t.", "\n\t\t) {\n\t\tpadding-left: unset;\n\t}\n\n\t.tableView-content-wrap:has(.", ") {\n\t\tpadding-left: 15px;\n\t}\n\n\ttr.sticky th {\n\t\tborder-bottom: ", "px solid ", ";\n\t\tmargin-right: -1px;\n\t}\n\n\t.", " tr.sticky > th:last-child {\n\t\tborder-right-width: 1px;\n\t}\n\n\t/* add left edge for first cell */\n\t.", " tr.sticky > th:first-of-type {\n\t\tmargin-left: 0px;\n\t}\n\n\t/* add a little bit so the scroll lines up with the table */\n\t.", " tr.sticky::after {\n\t\tcontent: ' ';\n\t\twidth: ", "px;\n\t}\n\n\t/* To fix jumpiness caused in Chrome Browsers for sticky headers */\n\t.", " .sticky + tr {\n\t\tmin-height: 0px;\n\t}\n\n\t/* move resize line a little in sticky bar */\n\t.", ".", " {\n\t\ttr.sticky td.", ", tr.sticky th.", " {\n\t\t\t.", "::after {\n\t\t\t\tright: ", "px;\n\t\t\t}\n\t\t}\n\n\t\t/* when selected put it back to normal -- :not selector would be nicer */\n\t\ttr.sticky\n\t\t\ttd.", ".", ",\n\t\t\ttr.sticky\n\t\t\tth.", ".", " {\n\t\t\t.", "::after {\n\t\t\t\tright: ", "px;\n\t\t\t}\n\t\t}\n\t}\n\n\ttr.sticky .", ", tr.sticky .", " {\n\t\tz-index: 1;\n\t}\n\n\ttr.", " {\n\t\tposition: sticky;\n\t\ttop: ", "px;\n\t\tz-index: calc(", " - 5);\n\t\tbox-shadow:\n\t\t\tinset -1px 1px ", ",\n\t\t\tinset 1px -1px ", ";\n\n\t\t&.", " {\n\t\t\tbox-shadow:\n\t\t\t\tinset -1px 1px ", ",\n\t\t\t\tinset 1px -1px ", ",\n\t\t\t\t0 6px 4px -4px ", ";\n\t\t}\n\n\t\t", "\n\t}\n\n\t/** Adds mask above sticky header to prevent table content from bleeding through on scroll */\n\t.", ":has(tr.", ")::before {\n\t\tcontent: ' ';\n\t\tdisplay: block;\n\t\ttop: 0;\n\t\tbox-sizing: border-box;\n\t\twidth: 100%;\n\t\theight: 0;\n\t\tmargin-bottom: -", "px;\n\t\tposition: sticky;\n\t\tborder-top: ", "px solid ", ";\n\t\tz-index: ", ";\n\t}\n\n\t/** When cleaning up, merge this with the mask style above */\n\t", "\n\n\t/** Corrects position of drag row controls when sticky header top mask is present */\n\t.", ":has(.", ")\n\t\t> .", "\n\t\t> div\n\t\t> .", " {\n\t\ttop: ", "px;\n\t\tz-index: ", ";\n\t}\n\n\t", "\n\n\t.", "[data-table-header-is-stuck='true']:has(.", ")\n\t\t> .", "\n\t\t> div\n\t\t> .", " {\n\t\tz-index: ", ";\n\t}\n\n\t/** Corrects position of numbered column when sticky header top mask is present */\n\t.", ":has(.", " ", ")\n\t\t> .", "\n\t\t> div\n\t\t> .", " {\n\t\ttop: ", "px;\n\t}\n\n\t/** Expands the mask to encompass the numbered column */\n\t.pm-table-wrapper:has([data-number-column='true'] tr.", ")::before {\n\t\tmargin-left: -", "px;\n\t\twidth: calc(100% + ", "px);\n\t}\n\n\t/** Hides the header row drag handle when the position:sticky table header is 'stuck'\n\t *\n\t * 1. We check that the header is 'stuck'.\n\t * - The table container has attribute data-table-header-is-stuck='true' when sticky positioned header is 'stuck'\n\t *\n\t * 2. We check that the header row drag handle is in the first row or the first row is selected\n\t * - The header row drag handle has the data-row-index='0' attribute (i.e. hovered), OR\n\t * - The header row drag handle has the data-selected-row-index='0' attribute\n\t * \t\tAND does not have the data-handle-appearance='default' attribute (i.e. selected)\n\t*/\n\t.", ".", "[data-table-header-is-stuck='true']\n\t.", ":is([data-row-index='0'], [data-selected-row-index='0']:not([data-handle-appearance='default'])) {\n\t\tvisibility: hidden;\n\t}\n\n\t.", " tr.", " {\n\t\ttop: ", "px;\n\t}\n\n\t.", " tr.sticky {\n\t\tpadding-top: ", "px;\n\t}\n\n\t.", ".", "\n\t\t> .", "\n\t\t.", "\n\t\t.", ":first-of-type {\n\t\tmargin-top: ", "px;\n\t}\n\n\t.", ".sticky {\n\t\tborder-top: ", "px solid ", ";\n\t}\n\n\t", "\n\t", "\n ", "\n\n .", " .", " {\n\t\theight: 0; /* stop overflow flash & set correct height in update-overflow-shadows.ts */\n\t}\n\n\t.less-padding {\n\t\tpadding: 0 ", "px;\n\n\t\t.", ", .", " {\n\t\t\tpadding: 0 ", "px;\n\n\t\t\t/* https://product-fabric.atlassian.net/browse/ED-16386\n\t\t\tFixes issue where the extra padding that is added here throws off the position\n\t\t\tof the rows control dot */\n\t\t\t&::after {\n\t\t\t\tright: 6px !important;\n\t\t\t}\n\t\t}\n\n\t\t.", ".", " {\n\t\t\tleft: -4px;\n\t\t}\n\n\t\t.", " {\n\t\t\tpadding: 0 ", "px;\n\t\t}\n\n\t\t.", ".", " {\n\t\t\tleft: -8px;\n\t\t}\n\n\t\t&.", "[data-number-column='true'] {\n\t\t\tpadding-left: ", "px;\n\t\t}\n\t\t.", ", .", " {\n\t\t\twidth: ", "px;\n\t\t}\n\n\t\t.", " {\n\t\t\tleft: 6px;\n\t\t}\n\t\t.", ".", " {\n\t\t\tleft: 8px;\n\t\t}\n\n\t\t.", " {\n\t\t\tleft: calc(100% - 6px);\n\t\t}\n\t\t.", ".", " {\n\t\t\tleft: calc(100% - 16px);\n\t\t}\n\n\t\t.", " {\n\t\t\tleft: 8px;\n\t\t}\n\t\t.", " {\n\t\t\tright: 8px;\n\t\t}\n\t}\n\n\t> .", " {\n\t\t/**\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\t}\n\n\t/* Breakout only works on top level unless wrapped in fragment mark */\n\t", "\n\n\t", ";\n\t", ";\n\n\t/* Corner controls */\n\t.", " {\n\t\twidth: ", "px;\n\t\theight: ", "px;\n\t\tdisplay: none;\n\n\t\t.", " {\n\t\t\tposition: relative;\n\n\t\t\t", ";\n\t\t}\n\t}\n\n\t.", ".sticky {\n\t\t.", " {\n\t\t\t/* sticky row insert dot overlaps other row insert and messes things up */\n\t\t\tdisplay: none !important;\n\t\t}\n\t}\n\n\t.", " {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\twidth: ", "px;\n\t\theight: ", "px;\n\t\tborder: 1px solid ", ";\n\t\tborder-radius: 0;\n\t\tborder-top-left-radius: ", "px;\n\t\tbackground: ", ";\n\t\tbox-sizing: border-box;\n\t\tpadding: 0;\n\t\t:focus {\n\t\t\toutline: none;\n\t\t}\n\t}\n\t.active .", " {\n\t\tborder-color: ", ";\n\t\tbackground: ", ";\n\t}\n\n\t.", "[data-number-column='true'] {\n\t\t.", ", .", " {\n\t\t\twidth: ", "px;\n\t\t}\n\t\t.", " .", " {\n\t\t\tborder-right-width: 0;\n\t\t}\n\t}\n\n\t:not(.", ") .", ":hover {\n\t\tborder-color: ", ";\n\t\tbackground: ", ";\n\t\tcursor: pointer;\n\t}\n\n\t:not(.", ")\n\t\t.", ".", " {\n\t\tborder-color: ", ";\n\t\tbackground: ", ";\n\t}\n\n\t/* Row controls */\n\t.", " {\n\t\twidth: ", "px;\n\t\tbox-sizing: border-box;\n\t\tdisplay: none;\n\t\tposition: relative;\n\n\t\t", ";\n\n\t\t.", " {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t}\n\t\t.", ":last-child > button {\n\t\t\tborder-bottom-left-radius: ", "px;\n\t\t}\n\t\t.", " {\n\t\t\tposition: relative;\n\t\t\tmargin-top: -1px;\n\t\t}\n\t\t.", ":hover,\n\t\t\t.", ".active,\n\t\t\t.", ":hover {\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t", "\n\t}\n\n\t.", " {\n\t\tdisplay: grid;\n\t\talign-items: center;\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\n\t\t.", " {\n\t\t\tposition: absolute;\n\t\t\talign-self: end;\n\t\t\theight: 100%;\n\t\t\twidth: 18px;\n\t\t}\n\n\t\t.", " {\n\t\t\tposition: absolute;\n\t\t\tbottom: -3px;\n\t\t\tleft: 2px;\n\t\t\tbackground-color: ", ";\n\t\t\theight: 4px;\n\t\t\twidth: 4px;\n\t\t\tborder-radius: 50%;\n\t\t\tpointer-events: none;\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", " {\n\t\t\theight: ", "px;\n\t\t\tposition: absolute;\n\t\t\ttop: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t.", " {\n\t\t\tposition: absolute;\n\t\t\theight: ", "px;\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.", " {\n\t\t\tbackground-color: ", ";\n\t\t\theight: 4px;\n\t\t\twidth: 4px;\n\t\t\tborder-radius: 50%;\n\t\t\tposition: absolute;\n\t\t\tright: -2px;\n\t\t}\n\t}\n\n\t.", " {\n\t\tbackground: none;\n\t\tborder: none;\n\t\toutline: none;\n\t\tposition: absolute;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tcursor: pointer;\n\n\t\t:focus {\n\t\t\toutline: none;\n\t\t}\n\t}\n\n\t.", " {\n\t\tcursor: grab;\n\t\tpointer-events: auto;\n\n\t\tline-height: 0;\n\t\tpadding: 0;\n\t\tborder-radius: 6px;\n\t\twidth: max-content;\n\t\tborder: 2px solid ", ";\n\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tbackground: transparent;\n\t\toutline: none;\n\n\t\t&.placeholder {\n\t\t\tbackground-color: transparent;\n\t\t\tborder: 2px solid transparent;\n\t\t}\n\n\t\t&.", " {\n\t\t\tcursor: pointer;\n\t\t\t& svg {\n\t\t\t\t& > rect.", " {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t\t& > rect {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t\t& > g > rect {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&:not(.", ") {\n\t\t\t& svg {\n\t\t\t\trect {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t\tg {\n\t\t\t\t\tfill: ", ";\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&:hover {\n\t\t\t\tsvg {\n\t\t\t\t\trect {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t\tg {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&:active {\n\t\t\t\tcursor: grabbing;\n\t\t\t}\n\n\t\t\t&.selected {\n\t\t\t\t:focus {\n\t\t\t\t\toutline: 2px solid ", ";\n\t\t\t\t\toutline-offset: 1px;\n\t\t\t\t}\n\n\t\t\t\t&:active {\n\t\t\t\t\toutline: none;\n\t\t\t\t}\n\n\t\t\t\tsvg {\n\t\t\t\t\trect {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t\tg {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.danger {\n\t\t\t\tsvg {\n\t\t\t\t\trect {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t\tg {\n\t\t\t\t\t\tfill: ", ";\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n\n\t:not(.", ") .", " {\n\t\t", "\n\t\t", "\n\t}\n\n\t/* Numbered column */\n\t.", " {\n\t\tposition: relative;\n\t\tfloat: right;\n\t\tmargin-left: ", "px;\n\t\ttop: ", "px;\n\t\twidth: ", "px;\n\t\tbox-sizing: border-box;\n\t}\n\n\t.", " {\n\t\tborder: 1px solid ", ";\n\t\tbox-sizing: border-box;\n\t\tmargin-top: -1px;\n\t\tpadding-bottom: 2px;\n\t\tpadding: ", "\n\t\t\t2px;\n\t\ttext-align: center;\n\t\tfont-size: ", ";\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t\tborder-color: ", ";\n\n\t\t:first-child:not(style),\n\t\tstyle:first-child + * {\n\t\t\tmargin-top: 0;\n\t\t}\n\t\t:last-child {\n\t\t\tborder-bottom: 1px solid ", ";\n\t\t}\n\t}\n\n\t/* add a background above the first numbered column cell when sticky header is engaged\n\twhich hides the table when scrolling */\n\t.", "\n\t\t> .", " {\n\t\t.", ":first-of-type::after {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\theight: 33px;\n\t\t\twidth: 100%;\n\t\t\tbackground-color: ", ";\n\t\t\tposition: absolute;\n\n\t\t\t/* the extra pixel is accounting for borders */\n\t\t\ttop: -34px;\n\t\t\tleft: -1px;\n\t\t}\n\t}\n\n\t.", " {\n\t\t.", ", .", " {\n\t\t\tdisplay: block;\n\t\t}\n\t\t.", " {\n\t\t\tpadding-left: 0px;\n\n\t\t\t.", " {\n\t\t\t\tborder-left: 0 none;\n\t\t\t}\n\n\t\t\t.", ".active {\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t/* nested tables should be ignored when we apply border-left: 0 to the parent table */\n\t\t.", " {\n\t\t\t.", " {\n\t\t\t\tborder-left: 1px solid ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n\n\t:not(.", ") .", " {\n\t\t.", ":not(.", ") {\n\t\t\tcursor: pointer;\n\t\t}\n\t\t.", ":not(.", "):hover {\n\t\t\t", "\n\t\t}\n\t\t.", ".", " {\n\t\t\tbackground-color: ", ";\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-left: 0;\n\t\t\tcolor: ", ";\n\t\t\tposition: relative;\n\t\t\tz-index: ", ";\n\t\t}\n\t}\n\n\t", "\n\n\t/* Table */\n\t.", " > table {\n\t\ttable-layout: fixed;\n\t\twhite-space: normal;\n\t\tborder-top: none;\n\t\t/* 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212 */\n\t\tmargin-right: -1px;\n\t\t/* Allows better positioning for the shadow sentinels - ED-16668 */\n\t\tposition: relative;\n\n\t\t> tbody > tr {\n\t\t\twhite-space: pre-wrap;\n\t\t}\n\n\t\t.", " + * {\n\t\t\tmargin-top: 0;\n\t\t}\n\n\t\t/*\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\t\tth.", " > .fabric-editor-block-mark {\n\t\t\t> h1:first-of-type,\n\t\t\t> h2:first-of-type,\n\t\t\t> h3:first-of-type,\n\t\t\t> h4:first-of-type,\n\t\t\t> h5:first-of-type,\n\t\t\t> h6:first-of-type {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t}\n\n\t\t.", ", .", " {\n\t\t\tposition: relative;\n\t\t}\n\t\t/* Give selected cells a blue overlay */\n\t\t.", "::after, .", "::after {\n\t\t\tz-index: ", ";\n\t\t\tposition: absolute;\n\t\t\tcontent: '';\n\t\t\tleft: 0;\n\t\t\tright: 0;\n\t\t\ttop: 0;\n\t\t\tbottom: 0;\n\t\t\twidth: 100%;\n\t\t\tpointer-events: none;\n\t\t}\n\t\t.", " {\n\t\t\t", "\n\t\t}\n\t\t.", "::after {\n\t\t\tbackground: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\t\t/* Override border colors for danger state */\n\t\tth.", ".", ",\n\t\t\ttd.", ".", " {\n\t\t\t", "\n\t\t\t&::after {\n\t\t\t\theight: 100%;\n\t\t\t\twidth: 100%;\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t\tcontent: '';\n\t\t\t\tposition: absolute;\n\t\t\t\tleft: -1px;\n\t\t\t\ttop: -1px;\n\t\t\t\tbottom: 0;\n\t\t\t\tz-index: ", ";\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpointer-events: none;\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t\ttd.", ",\n\t\t\ttd.", ",\n\t\t\tth.", ".", ",\n\t\t\tth.", ".", " {\n\t\t\t&::after {\n\t\t\t\theight: 100%;\n\t\t\t\twidth: 100%;\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t\tcontent: '';\n\t\t\t\tposition: absolute;\n\t\t\t\tleft: -1px;\n\t\t\t\ttop: -1px;\n\t\t\t\tbottom: 0;\n\t\t\t\tz-index: ", ";\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t\t&.", "::after {\n\t\t\t\t", ";\n\t\t\t\tz-index: ", ";\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\n\t\t\t&.", ".", "::after {\n\t\t\t\t", ";\n\t\t\t\tz-index: ", ";\n\t\t\t\tbackground: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t", "\n\n\t/* override for DnD controls */\n\t.", " {\n\t\tposition: absolute;\n\t\tmargin-top: ", "px;\n\t\tleft: -", "px;\n\t}\n\n\t.", " {\n\t\tposition: absolute;\n\t\t/* this is to fix the misalignment of the numbered column in live page view mode */\n\t\t", "\n\t}\n\n\t.", ".", ",\n\t\t.", ".", " {\n\t\tz-index: ", ";\n\t}\n\n\t.", " {\n\t\tposition: absolute;\n\t\ttop: ", "px;\n\t}\n\n\t", "\n\n\t/** Mask for content to the left of the column controls */\n\n\t.", "[data-number-column=\"true\"] .", " > .", "::before {\n\t\tcontent: '';\n\t\tposition: relative;\n\t\tdisplay: inline-block;\n\t\tmargin-left: -", "px;\n\t\twidth: ", "px;\n\t\theight: ", "px;\n\t\tbackground: ", ";\n\t\tz-index: ", ";\n\t}\n\n\t/** Mask for numbered column content to the left of the header row */\n\t.", "[data-number-column=\"true\"] .", " tr:first-of-type th:first-of-type::before {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t\tleft: 0;\n\t\twidth: ", "px;\n\t\theight: 100%;\n\t\tmargin-left: -", "px;\n\t\tmargin-top: -", "px;\n\t\toutline: ", ";\n\t\tborder-left: ", ";\n\t\tbackground: ", ";\n\t\t", "\n\n\t\t", "\n\t}\n\n\t", "\n\n\t.", "[data-number-column=\"true\"].", " .", " tr:first-of-type th.", ":not(.", "):first-of-type::before, .", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":not(.", ", .", "):first-of-type::before {\n\t\toutline: none;\n\t\tborder-left-color: ", ";\n\t\t", "\n\t\tbackground: ", ";\n\t}\n\n\t", "\n\n\t.", "[data-number-column=\"true\"] .", " .", " th:first-of-type::before {\n\t\tbox-shadow: 0 6px 4px -4px ", ";\n\t}\n\n\t.", "\n\t\t.", ":not(.", " *) {\n\t\t/* !important to override the inline style in the inner controls component */\n\t\tmargin-top: ", "px !important;\n\t}\n\n\t.", " .", " {\n\t\tposition: fixed;\n\t\t/* higher zIndex than sticky header which is akEditorTableCellOnStickyHeaderZIndex - 5 */\n\t\tz-index: ", ";\n\t}\n\n\t", "\n\n\t/* nested tables */\n\t.", " {\n\t\t.", " .", " {\n\t\t\tposition: absolute;\n\t\t\tz-index: ", ";\n\t\t}\n\t}\n\n\t.", " {\n\t\tpadding-bottom: 0px;\n\t\t/* fixes gap cursor height */\n\t\toverflow: auto;\n\t\toverflow-y: hidden;\n\t\tposition: relative;\n\t}\n\n\t.", ".", " {\n\t\toverflow: visible;\n\t}\n"])), (0, _uiStyles.columnControlsLineMarker)(), (0, _uiStyles.hoveredDeleteButton)(), (0, _uiStyles.hoveredCell)(), _uiStyles.hoveredWarningCell, (0, _uiStyles.insertLine)(), (0, _uiStyles.resizeHandle)(), rangeSelectionStyles, rangeSelectionStylesForFakeBorders, viewModeSortStyles(), (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_improvements', 'cohort', 'test_with_overflow') && tableAnchorStyles, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.TABLE_CELL, _consts2.tableCellBackgroundColor, _consts2.tableBorderColor, _consts2.tableBorderColor, _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_COLUMN, (0, _uiStyles.insertColumnButtonWrapper)(), _types.TableCssClassName.CONTROLS_FLOATING_BUTTON_ROW, (0, _uiStyles.insertRowButtonWrapper)(), (0, _uiStyles.dragInsertButtonWrapper)(), (0, _uiStyles.dragCornerControlButton)(), (0, _uiStyles.DeleteButton)(), _types.TableCssClassName.TABLE_STICKY, props.isDragAndDropEnabled ? _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER : _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts2.stickyRowOffsetTop, _editorSharedStyles.akEditorTableNumberColumnWidth, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts2.stickyRowOffsetTop, "var(--ds-surface, #FFFFFF)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.CORNER_CONTROLS, _editorSharedStyles.akEditorSmallZIndex, "var(--ds-surface, #FFFFFF)", _consts2.tableToolbarSize, _consts2.tableToolbarSize, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts2.tableToolbarSize, _consts2.tableToolbarSize, tableStickyHeaderColumnControlsDecorationsStyle(), tableStickyHeaderFirefoxFixStyle(), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts2.tableToolbarSize, "var(--ds-surface, #FFFFFF)", _consts2.tableToolbarSize, _types.TableCssClassName.TABLE_STICKY, "var(--ds-surface, #FFFFFF)", _consts2.stickyRowOffsetTop, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex - 5, "var(--ds-surface, #FFFFFF)", "var(--ds-shadow-overflow-perimeter, #1E1F211f)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts2.tableToolbarSize, _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _consts2.stickyHeaderBorderBottomWidth, _consts2.tableBorderColor, _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, (_consts2.resizeHandlerAreaWidth - _consts2.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, (_consts2.resizeHandlerAreaWidth - _consts2.resizeLineWidth) / 2, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex, _consts2.tableBorderColor, _consts2.tableBorderColor, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _consts2.tableBorderColor, _consts2.tableBorderColor, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "th.".concat(_types.TableCssClassName.TABLE_HEADER_CELL, "::after {\n\t\t\t\theight: 100%;\n\t\t\t\tcontent: '';\n\t\t\t\tborder-left: 1px solid ").concat(_consts2.tableBorderColor, ";\n\t\t\t\tborder-bottom: 1px solid ").concat(_consts2.tableBorderColor, ";\n\t\t\t\tposition: absolute;\n\t\t\t\tright: 0px;\n\t\t\t\ttop: 0px;\n\t\t\t\tbottom: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpointer-events: none;\n\t\t\t}") : "", _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, _styles.tableMarginTop, "var(--ds-surface, #FFFFFF)", _consts2.stickyRowZIndex, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_2') ? "\n\t\t.".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER, ":has(tr.").concat(_types.TableCssClassName.NATIVE_STICKY, ")::before {\n\t\t\tborder-top: ").concat(_styles.tableMarginTop, "px solid transparent;\n\t\t}\n\n\t\t.").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER, ":has(tr.").concat(_types.TableCssClassName.NATIVE_STICKY_ACTIVE, ")::before {\n\t\t\tborder-top: ").concat(_styles.tableMarginTop, "px solid ", "var(--ds-surface, #FFFFFF)", ";\n\t\t}") : (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "\n\t\t\t.".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER, ":has(tr.").concat(_types.TableCssClassName.NATIVE_STICKY, ")::before {\n\t\t\t\tmargin-top: 1px;\n\t\t\t}") : "", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.DRAG_ROW_CONTROLS, _consts2.tableColumnControlsHeight, _consts2.aboveNativeStickyHeaderZIndex, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_7') ? "\n\t\t.".concat(_types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, ":has(~ .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ") {\n\t\t\tmargin-top: 0;\n\t\t}\n\t") : "", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.DRAG_ROW_CONTROLS, _consts2.belowNativeStickyHeaderZIndex, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_4') ? "tr.".concat(_types.TableCssClassName.NATIVE_STICKY) : '', _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _consts2.tableColumnControlsHeight, _types.TableCssClassName.NATIVE_STICKY, _editorSharedStyles.akEditorTableNumberColumnWidth, _editorSharedStyles.akEditorTableNumberColumnWidth, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.DRAG_ROW_FLOATING_DRAG_HANDLE, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, _types.TableCssClassName.WITH_CONTROLS, _consts2.tableControlsSpacing, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts2.tableControlsSpacing, _types.TableCssClassName.CORNER_CONTROLS, _consts2.tableControlsSpacing - _consts2.tableToolbarSize, "var(--ds-surface, #FFFFFF)", sentinelStyles, (0, _uiStyles.OverflowShadow)(), stickyScrollbarStyles, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY_SHADOW, _consts2.tablePadding, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts2.tablePadding, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _consts2.tablePadding, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts2.tablePadding - 1, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _consts2.tableOverflowShadowWidth, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.TABLE_RIGHT_SHADOW, _types.TableCssClassName.TABLE_CHROMELESS, _styles.TableSharedCssClassName.TABLE_LEFT_BORDER, _styles.TableSharedCssClassName.TABLE_RIGHT_BORDER, _types.TableCssClassName.NODEVIEW_WRAPPER, breakoutWidthStyling(), (0, _uiStyles.columnControlsDecoration)(), (0, _uiStyles.rowControlsWrapperDotStyle)(), _types.TableCssClassName.CORNER_CONTROLS, _consts2.tableToolbarSize + 1, cornerControlHeight, _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, (0, _uiStyles.InsertMarker)("\n left: -11px;\n top: 9px;\n "), _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts2.tableToolbarSize + 1, _consts2.tableToolbarSize + 1, _consts2.tableBorderColor, _consts2.tableBorderRadiusSize, _consts2.tableHeaderCellBackgroundColor, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts2.tableBorderSelectedColor, _consts2.tableToolbarSelectedColor, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _editorSharedStyles.akEditorTableToolbarSize + _editorSharedStyles.akEditorTableNumberColumnWidth + 1, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.CONTROLS_BUTTON, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts2.tableBorderSelectedColor, _consts2.tableToolbarSelectedColor, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableBorderDeleteColor, _consts2.tableToolbarDeleteColor, _types.TableCssClassName.ROW_CONTROLS, _consts2.tableToolbarSize, (0, _uiStyles.InsertMarker)("\n bottom: -1px;\n left: -11px;\n "), _types.TableCssClassName.ROW_CONTROLS_INNER, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _consts2.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)("\n border-bottom: 1px solid ".concat(_consts2.tableBorderColor, ";\n border-right: 0px;\n border-radius: 0;\n height: 100%;\n width: ").concat(_consts2.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.DRAG_ROW_CONTROLS, _consts2.rowControlsZIndex + 4, _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER, _types.TableCssClassName.DRAG_ROW_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #DDDEE1)", _types.TableCssClassName.DRAG_COLUMN_CONTROLS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER, _consts2.tableColumnControlsHeight, "var(--ds-space-negative-150, -12px)", _consts2.resizeHandlerZIndex, _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER, _consts2.tableColumnControlsHeight, _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #DDDEE1)", _types.TableCssClassName.DRAG_HANDLE_BUTTON_CLICKABLE_ZONE, _types.TableCssClassName.DRAG_HANDLE_BUTTON_CONTAINER, "var(--ds-surface, #FFFFFF)", _types.TableCssClassName.DRAG_HANDLE_DISABLED, _types.TableCssClassName.DRAG_HANDLE_MINIMISED, "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-background-accent-gray-subtlest, #F0F1F2)", "var(--ds-icon-disabled, #080F214A)", _types.TableCssClassName.DRAG_HANDLE_DISABLED, "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-icon-subtle, #505258)", "var(--ds-background-accent-blue-subtle, #669DF1)", "var(--ds-icon-inverse, #FFFFFF)", "var(--ds-border-focused, #4688EC)", "var(--ds-background-accent-blue-subtle, #669DF1)", "var(--ds-icon-inverse, #FFFFFF)", "var(--ds-background-accent-red-subtler-pressed, #FD9891)", "var(--ds-border-inverse, #FFFFFF)", (0, _uiStyles.floatingColumnControls)(), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.ROW_CONTROLS, (0, _uiStyles.HeaderButtonHover)(), (0, _uiStyles.HeaderButtonDanger)(), _types.TableCssClassName.NUMBERED_COLUMN, _editorSharedStyles.akEditorTableToolbarSize, props.isDragAndDropEnabled ? 0 : _editorSharedStyles.akEditorTableToolbarSize, _editorSharedStyles.akEditorTableNumberColumnWidth + 1, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts2.tableBorderColor, (0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) || (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp') ? (0, _editorSharedStyles.relativeSizeToBaseFontSize)(10) : "10px", (0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) || (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp') ? (0, _editorSharedStyles.relativeSizeToBaseFontSize)(14) : (0, _editorSharedStyles.relativeFontSizeToBase16)(14), _consts2.tableHeaderCellBackgroundColor, _consts2.tableTextColor, _consts2.tableBorderColor, _consts2.tableBorderColor, _types.TableCssClassName.TABLE_STICKY, props.isDragAndDropEnabled ? _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER : _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON_DISABLED, "var(--ds-surface, #FFFFFF)", _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, numberedColumnButtonSelectedStyles, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts2.tableBorderColor, (0, _experiments.editorExperiment)('platform_editor_block_menu', true) ? "/* Apply numbered column styling when table is selected via text selection (e.g., block menu) */\n\t.".concat(_editorSharedStyles.akEditorSelectedNodeClassName, " {\n\t\t.").concat(_types.TableCssClassName.NUMBERED_COLUMN, " {\n\t\t\t.").concat(_types.TableCssClassName.NUMBERED_COLUMN_BUTTON, " {\n\t\t\t\t").concat(numberedColumnButtonSelectedStyles, "\n\t\t\t\t").concat(_selection.hideNativeBrowserTextSelectionStyles, "\n\t\t\t}\n\t\t}\n\t}") : '', _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON_DISABLED, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON_DISABLED, numberedColumnButtonSelectedStyles, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts2.tableToolbarDeleteColor, _consts2.tableBorderDeleteColor, "var(--ds-text-danger, #AE2E24)", _editorSharedStyles.akEditorUnitZIndex, (0, _experiments.editorExperiment)('platform_editor_block_menu', true) ? ".tableView-content-wrap.danger {\n\t\t:not(.".concat(_types.TableCssClassName.IS_RESIZING, ") .").concat(_types.TableCssClassName.WITH_CONTROLS, " {\n\t\t\t.").concat(_types.TableCssClassName.NUMBERED_COLUMN_BUTTON, " {\n\t\t\t\tbackground-color: ").concat(_consts2.tableToolbarDeleteColor, ";\n\t\t\t\tborder: 1px solid ").concat(_consts2.tableBorderDeleteColor, ";\n\t\t\t\tborder-left: 0;\n\t\t\t\tcolor: ", "var(--ds-text-danger, #AE2E24)", ";\n\t\t\t\tposition: relative;\n\t\t\t\tz-index: ").concat(_editorSharedStyles.akEditorUnitZIndex, ";\n\t\t\t}\n\t\t}\n\t}") : '', _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, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? '' /* Cell borders handled by ::after overlay in rounded mode. */ : "border: 1px solid ".concat(_consts2.tableBorderSelectedColor, ";"), _types.TableCssClassName.SELECTED_CELL, _consts2.tableCellSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? '' /* Cell border colors are handled by the ::after overlay in rounded mode. */ : "border-left-color: ".concat(_consts2.tableBorderDeleteColor, ";\n\t\t\tborder-top-color: ").concat(_consts2.tableBorderDeleteColor, ";"), _consts2.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _consts2.tableCellDeleteColor, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_CELL, _consts2.tableBorderSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), _editorSharedStyles.akEditorUnitZIndex * 100, _consts2.tableCellDeleteColor, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), _editorSharedStyles.akEditorUnitZIndex * 100, _consts2.tableCellDeleteColor, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableOverrides() : '', _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _styles.tableMarginTop, _consts2.tableToolbarSize + 1, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, props.isDragAndDropEnabled ? "\n\t\t\tmargin-top: ".concat(_styles.tableMarginTop, "px;\n\t\t\ttop: 0;\n\t\t\tleft: -").concat(_consts2.tableToolbarSize + 1, "px;\n\t\t") : "\n\t\t\t/* top of corner control is table margin top - corner control height + 1 pixel of table border. */\n\t\t\ttop: ".concat(_styles.tableMarginTop - cornerControlHeight + 1, "px;\n\t\t\tmargin-top: 0;\n\t\t\tleft: -").concat(_consts2.tableToolbarSize, "px;\n\t\t"), _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_LEFT_SHADOW, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_LEFT_SHADOW, _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _styles.tableMarginTop, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "\n\t.".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " > .").concat(_types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, " {\n\t\t/* +2px is to overlap the table border on the sides */\n\t\twidth: calc(anchor-size(width) + 2px);\n\t\theight: ").concat(_styles.tableMarginTop, "px;\n\t\tbackground: ", "var(--ds-surface, #FFFFFF)", ";\n\t\ttop: unset;\n\t\tposition: fixed;\n\t\tposition-area: top center;\n\t\tposition-visibility: anchors-visible;\n\t\tz-index: ").concat(_consts2.nativeStickyHeaderZIndex + 1, ";\n\t}") : ".".concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " > .").concat(_types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, " {\n\t\t/* +2px is to overlap the table border on the sides */\n\t\twidth: calc(anchor-size(width) + 2px);\n\t\theight: ").concat(_styles.tableMarginTop, "px;\n\t\tbackground: ", "var(--ds-surface, #FFFFFF)", ";\n\t\tposition: fixed;\n\t\tposition-area: top center;\n\t\tposition-visibility: anchors-visible;\n\t\tz-index: ").concat(_consts2.nativeStickyHeaderZIndex + 1, ";\n\t}"), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts2.dragRowControlsWidth, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts2.dragRowControlsWidth, _styles.tableMarginTop, "var(--ds-surface, #FFFFFF)", _consts2.nativeStickyHeaderZIndex - 1, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _editorSharedStyles.akEditorTableNumberColumnWidth - 1, _editorSharedStyles.akEditorTableNumberColumnWidth, _consts2.stickyRowOffsetTop, (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_9', 'isEnabled', true) ? "0.5px solid ".concat(_consts2.tableBorderColor) : "1px solid ".concat(_consts2.tableBorderColor), (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_9', 'isEnabled', true) ? 'none' : "1px solid ".concat(_consts2.tableBorderColor), "var(--ds-background-accent-gray-subtlest, #F0F1F2)", (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "border-top: 1px solid ".concat(_consts2.tableBorderColor, ";") : "", (0, _browser.getBrowserInfo)().gecko && (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_9', 'isEnabled', true) ? "border-top: 1px solid ".concat(_consts2.tableBorderColor, ";") : "border-top: none;", (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_7') ? ".ak-editor-selected-node .".concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"]:not(.").concat(_types.TableCssClassName.TABLE_SELECTED, ") .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th:first-of-type {\n\t\t\t&::before {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\t&::after {\n\t\t\t\twidth: 100%;\n\t\t\t\tborder-left: 1px solid ").concat(_consts2.tableBorderSelectedColor, ";\n\t\t\t\tbackground: ").concat(_consts2.tableCellSelectedColor, ";\n\t\t\t}\n\t}") : '', _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_SELECTED, _consts2.tableBorderSelectedColor, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? "border-top-color: ".concat(_consts2.tableBorderSelectedColor, ";") : "", _consts2.tableHeaderCellSelectedColor, (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_1') ? ".".concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"] .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.HOVERED_CELL_IN_DANGER, ":first-of-type::before, .").concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"] .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.HOVERED_CELL_IN_DANGER, ":not(.").concat(_types.TableCssClassName.COLUMN_SELECTED, "):first-of-type::before {\n\t\t\toutline: none;\n\t\t\tborder-left: unset;\n\t\t\tborder-top: unset;\n\t\t\tbackground: ").concat(_consts2.tableCellDeleteColor, ";\n\t\t}\n\t\t.").concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"].").concat(_types.TableCssClassName.TABLE_SELECTED, ".").concat(_types.TableCssClassName.HOVERED_DELETE_BUTTON, " .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th:first-of-type::before, .").concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"].").concat(_types.TableCssClassName.HOVERED_DELETE_BUTTON, " .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.SELECTED_CELL, ":not(.").concat(_types.TableCssClassName.COLUMN_SELECTED, "):first-of-type::before {\n\t\toutline: none;\n\t\tborder-left-color: ").concat(_consts2.tableBorderDeleteColor, ";\n\t\tborder-top-color: ").concat(_consts2.tableBorderDeleteColor, ";\n\t\tbackground: ").concat(_consts2.tableCellDeleteColor, ";\n\t\t}") : "\t.".concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"] .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.HOVERED_CELL_IN_DANGER, ":not(.").concat(_types.TableCssClassName.COLUMN_SELECTED, "):first-of-type::before {\n\t\t\t\toutline: none;\n\t\t\t\tbackground: ").concat(_consts2.tableCellDeleteColor, ";\n\t\t\t}\n\t\t\t.").concat(_types.TableCssClassName.TABLE_CONTAINER, "[data-number-column=\"true\"].").concat(_types.TableCssClassName.HOVERED_DELETE_BUTTON, " .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, " tr:first-of-type th.").concat(_types.TableCssClassName.SELECTED_CELL, ":not(.").concat(_types.TableCssClassName.COLUMN_SELECTED, "):first-of-type::before {\n\t\t\t\toutline: none;\n\t\t\t\tborder-left-color: ").concat(_consts2.tableBorderDeleteColor, ";\n\t\t\t\tbackground: ").concat(_consts2.tableCellDeleteColor, ";\n\t\t}"), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER, _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _styles.tableMarginTop, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex - 4, (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_improvements', 'cohort', 'test_with_overflow') && (0, _platformFeatureFlags.fg)('platform_editor_table_sticky_header_patch_6') ? ".".concat(_types.TableCssClassName.TABLE_CONTAINER, ".").concat(_types.TableCssClassName.WITH_CONTROLS, ":has(tr.sticky) .").concat(_types.TableCssClassName.NUMBERED_COLUMN, " .").concat(_types.TableCssClassName.NUMBERED_COLUMN_BUTTON, ":first-of-type {\n\t\t\tbox-shadow: 0 -5px 0 1px ").concat(_consts2.tableBorderColor, ";\n\t\t}") : "", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _editorSharedStyles.akEditorUnitZIndex, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW);
|
|
77
89
|
};
|
|
78
90
|
|
|
79
91
|
// re-exporting these styles to use in Gemini test when table node view is rendered outside of PM
|
|
80
92
|
var baseTableStyles = exports.baseTableStyles = function baseTableStyles(props) {
|
|
81
|
-
return (0, _react.css)(
|
|
93
|
+
return (0, _react.css)(_templateObject1 || (_templateObject1 = (0, _taggedTemplateLiteral2.default)(["\n\t", ";\n\t", ";\n"])), (0, _styles.tableSharedStyle)(), baseTableStylesWithoutSharedStyle(props));
|
|
82
94
|
};
|
|
83
95
|
|
|
84
96
|
// TODO: DSP-4139 - Remove this when we have a better solution for the table toolbar
|
|
85
97
|
var tableStyles = exports.tableStyles = function tableStyles(props) {
|
|
86
|
-
return (0, _react.css)(
|
|
98
|
+
return (0, _react.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror {\n\t\t", ";\n\t}\n\n\t.ProseMirror.", " {\n\t\t.", " {\n\t\t\toverflow-x: auto;\n\t\t\t", ";\n\t\t}\n\t}\n\n\t.ProseMirror.", " {\n\t\tcursor: col-resize;\n\t}\n\n\t", "\n"])), baseTableStylesWithoutSharedStyle(props), _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.TABLE_NODE_WRAPPER, _scrollbar.scrollbarStyles, _types.TableCssClassName.RESIZE_CURSOR, shadowSentinelStyles);
|
|
87
99
|
};
|
|
88
100
|
|
|
89
101
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
90
|
-
var tableFullPageEditorStyles = exports.tableFullPageEditorStyles = (0, _react.css)(
|
|
102
|
+
var tableFullPageEditorStyles = exports.tableFullPageEditorStyles = (0, _react.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror .", " > table {\n\t\tmargin-left: 0;\n\t\t/* 1px border width offset added here to prevent unwanted overflow and scolling - ED-16212 */\n\t\tmargin-right: -1px;\n\t\twidth: 100%;\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER);
|
|
91
103
|
|
|
92
104
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
93
|
-
var tableCommentEditorStyles = exports.tableCommentEditorStyles = (0, _react.css)(
|
|
94
|
-
var tableAnchorStyles = (0, _react.css)(
|
|
105
|
+
var tableCommentEditorStyles = exports.tableCommentEditorStyles = (0, _react.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n\t.ProseMirror .", " > table {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t\t", ";\n\t}\n"])), _types.TableCssClassName.TABLE_NODE_WRAPPER, _scrollbar.scrollbarStyles);
|
|
106
|
+
var tableAnchorStyles = (0, _react.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n\t.pm-table-with-controls .pm-table-wrapper-no-overflow [data-prosemirror-node-name='tableHeader'] {\n\t\tanchor-name: var(", ", attr(data-node-anchor type(<custom-ident>)));\n\t}\n\n\t.pm-table-with-controls .pm-table-wrapper-no-overflow [data-prosemirror-node-name='tableRow'] {\n\t\tanchor-name: var(", ", attr(data-node-anchor type(<custom-ident>)));\n\t}\n"])), _styles.ANCHOR_VARIABLE_NAME, _styles.ANCHOR_VARIABLE_NAME);
|