@atlaskit/editor-plugin-table 27.0.13 → 27.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/dist/cjs/nodeviews/table.js +2 -1
- package/dist/cjs/ui/FloatingInsertButton/index.js +5 -13
- package/dist/cjs/ui/TableFloatingColumnControls/ColumnControls/index.js +2 -6
- package/dist/cjs/ui/common-styles.js +3 -8
- package/dist/es2019/nodeviews/table.js +2 -1
- package/dist/es2019/ui/FloatingInsertButton/index.js +5 -13
- package/dist/es2019/ui/TableFloatingColumnControls/ColumnControls/index.js +2 -6
- package/dist/es2019/ui/common-styles.js +23 -26
- package/dist/esm/nodeviews/table.js +2 -1
- package/dist/esm/ui/FloatingInsertButton/index.js +5 -13
- package/dist/esm/ui/TableFloatingColumnControls/ColumnControls/index.js +2 -6
- package/dist/esm/ui/common-styles.js +3 -8
- package/package.json +13 -13
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,29 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-table
|
|
2
2
|
|
|
3
|
+
## 27.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`d96f86ff344b8`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d96f86ff344b8) -
|
|
8
|
+
Use @atlaskit/platform-feature-experiments directly for
|
|
9
|
+
platform_editor_vc90_transition_expand_icon, platform_editor_add_image_editing,
|
|
10
|
+
platform_editor_ai_multi_format_streaming, platform_editor_default_toolbar_state,
|
|
11
|
+
platform_editor_early_exit_return_draft, platform_editor_fix_focus_MediaInsertPicker,
|
|
12
|
+
platform_editor_fix_table_move_shortcut, platform_editor_menu_radius_update,
|
|
13
|
+
platform_editor_react19_migration, and show_mentions_in_suggest_reply.
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
19
|
+
## 27.0.14
|
|
20
|
+
|
|
21
|
+
### Patch Changes
|
|
22
|
+
|
|
23
|
+
- [`6cf283ca60155`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6cf283ca60155) -
|
|
24
|
+
Clean up experiment `platform_editor_table_col_insert`
|
|
25
|
+
- Updated dependencies
|
|
26
|
+
|
|
3
27
|
## 27.0.13
|
|
4
28
|
|
|
5
29
|
### Patch Changes
|
|
@@ -23,6 +23,7 @@ var _state = require("@atlaskit/editor-prosemirror/state");
|
|
|
23
23
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
24
24
|
var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
|
|
25
25
|
var _tableMap = require("@atlaskit/editor-tables/table-map");
|
|
26
|
+
var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
|
|
26
27
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
27
28
|
var _createPluginConfig = require("../pm-plugins/create-plugin-config");
|
|
28
29
|
var _pluginFactory = require("../pm-plugins/plugin-factory");
|
|
@@ -148,7 +149,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
|
|
|
148
149
|
if (node && this.table && !node.contains(this.table)) {
|
|
149
150
|
// Patch to prevent selection collapsing when moving the table down with ctrl + shift + down
|
|
150
151
|
var selectionBeforeMove = this.view.state.selection;
|
|
151
|
-
var shouldPreserveCellSelection = (0,
|
|
152
|
+
var shouldPreserveCellSelection = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_fix_table_move_shortcut') && selectionBeforeMove instanceof _cellSelection.CellSelection;
|
|
152
153
|
|
|
153
154
|
// Store the current ignoreMutation handler so we can restore it later
|
|
154
155
|
oldIgnoreMutation = this.ignoreMutation;
|
|
@@ -54,18 +54,12 @@ var FloatingInsertButton = exports.FloatingInsertButton = /*#__PURE__*/function
|
|
|
54
54
|
tableRef = _this$props.tableRef,
|
|
55
55
|
mountPoint = _this$props.mountPoint,
|
|
56
56
|
boundariesElement = _this$props.boundariesElement,
|
|
57
|
-
isHeaderColumnEnabled = _this$props.isHeaderColumnEnabled,
|
|
58
57
|
isHeaderRowEnabled = _this$props.isHeaderRowEnabled,
|
|
59
58
|
dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
|
|
60
59
|
isChromelessEditor = _this$props.isChromelessEditor;
|
|
61
60
|
|
|
62
|
-
//
|
|
63
|
-
|
|
64
|
-
var isFirstColumnInsertEnabled = (0, _expValEquals.expValEquals)('platform_editor_table_col_insert', 'isEnabled', true);
|
|
65
|
-
|
|
66
|
-
// ED-26961 - disable insert button for first row, and keep first-column behavior
|
|
67
|
-
// disabled until platform_editor_table_col_insert is enabled.
|
|
68
|
-
if (insertColumnButtonIndex === 0 && !isFirstColumnInsertEnabled || insertRowButtonIndex === 0) {
|
|
61
|
+
// ED-26961 - disable insert button for first row.
|
|
62
|
+
if (insertRowButtonIndex === 0) {
|
|
69
63
|
return null;
|
|
70
64
|
}
|
|
71
65
|
var type = typeof insertColumnButtonIndex !== 'undefined' ? 'column' : typeof insertRowButtonIndex !== 'undefined' ? 'row' : null;
|
|
@@ -73,11 +67,9 @@ var FloatingInsertButton = exports.FloatingInsertButton = /*#__PURE__*/function
|
|
|
73
67
|
return null;
|
|
74
68
|
}
|
|
75
69
|
|
|
76
|
-
// We can
|
|
77
|
-
// when the header row
|
|
78
|
-
|
|
79
|
-
// column (index 0) insert button even when the header column is enabled.
|
|
80
|
-
if (type === 'column' && isHeaderColumnEnabled && insertColumnButtonIndex === 0 && !isFirstColumnInsertEnabled || type === 'row' && isHeaderRowEnabled && insertRowButtonIndex === 0) {
|
|
70
|
+
// We can't display the insert button for row index 0
|
|
71
|
+
// when the header row is enabled.
|
|
72
|
+
if (type === 'row' && isHeaderRowEnabled && insertRowButtonIndex === 0) {
|
|
81
73
|
return null;
|
|
82
74
|
}
|
|
83
75
|
var tr = editorView.state.tr;
|
|
@@ -192,10 +192,6 @@ var ColumnControls = exports.ColumnControls = function ColumnControls(_ref) {
|
|
|
192
192
|
var _getScrollOffset;
|
|
193
193
|
columnControlsRef.current.scrollLeft = (_getScrollOffset = getScrollOffset === null || getScrollOffset === void 0 ? void 0 : getScrollOffset()) !== null && _getScrollOffset !== void 0 ? _getScrollOffset : 0;
|
|
194
194
|
}
|
|
195
|
-
|
|
196
|
-
// EDITOR-6790 - render a dot on the left edge of the first column so users have a visible
|
|
197
|
-
// affordance to insert a column to the left of the first column.
|
|
198
|
-
var isFirstColumnInsertEnabled = (0, _expValEquals.expValEquals)('platform_editor_table_col_insert', 'isEnabled', true);
|
|
199
195
|
var generateHandleByType = function generateHandleByType(type, appearance, gridColumn, indexes) {
|
|
200
196
|
var _rowHeights$reduce, _colWidths$reduce;
|
|
201
197
|
var isHover = type === 'hover';
|
|
@@ -229,7 +225,7 @@ var ColumnControls = exports.ColumnControls = function ColumnControls(_ref) {
|
|
|
229
225
|
width: '100%',
|
|
230
226
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
231
227
|
position: 'relative',
|
|
232
|
-
pointerEvents: isPlaceholder
|
|
228
|
+
pointerEvents: isPlaceholder ? 'none' : undefined
|
|
233
229
|
},
|
|
234
230
|
"data-testid": "table-floating-column-".concat(isHover ? colIndex : isPlaceholder ? appearance : selectedColIndexes[0], "-drag-handle")
|
|
235
231
|
}, /*#__PURE__*/_react.default.createElement(_DragHandle.DragHandle, {
|
|
@@ -312,7 +308,7 @@ var ColumnControls = exports.ColumnControls = function ColumnControls(_ref) {
|
|
|
312
308
|
// eslint-disable-next-line react/no-array-index-key
|
|
313
309
|
,
|
|
314
310
|
key: index
|
|
315
|
-
},
|
|
311
|
+
}, index === 0 && /*#__PURE__*/_react.default.createElement("div", {
|
|
316
312
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
317
313
|
className: _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT
|
|
318
314
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
@@ -75,16 +75,11 @@ var tableStickyHeaderFirefoxFixStyle = function tableStickyHeaderFirefoxFixStyle
|
|
|
75
75
|
}
|
|
76
76
|
};
|
|
77
77
|
var baseTableStylesWithoutSharedStyle = function baseTableStylesWithoutSharedStyle(props) {
|
|
78
|
-
return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", "\n\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\t\t", ";\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\t\t", ";\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\t\t", ";\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.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/* use :before element to hide table row insert dots when legacy table sticky header is activated */\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: ", ";\n\t\tbox-shadow:\n\t\t\tinset -1px 1px ", ",\n\t\t\tinset 1px -1px ", ";\n\n\t\t&.", " {\n\t\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\tth.", "::after {\n\t\t\theight: 100%;\n\t\t\tcontent: '';\n\t\t\tborder-left: 1px solid ", ";\n\t\t\tborder-bottom: 1px solid ", ";\n\t\t\tposition: absolute;\n\t\t\tright: 0px;\n\t\t\ttop: 0px;\n\t\t\tbottom: 0;\n\t\t\twidth: 100%;\n\t\t\tdisplay: inline-block;\n\t\t\tpointer-events: none;\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 transparent;\n\t\tz-index: ", ";\n\t}\n\n\t.", ":has(tr.", ")::before {\n\t\tborder-top: ", "px solid\n\t\t\t", ";\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(.", " tr.", ")\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\t\t", ";\n\t}\n\n\t", "\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\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: ", " 2px;\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\tposition: absolute;\n\t\ttop: ", "px;\n\t}\n\n\t.", " > .", " {\n\t\t/* +2px is to overlap the table border on the sides */\n\t\twidth: calc(anchor-size(width) + 2px);\n\t\theight: ", "px;\n\t\tbackground: ", ";\n\t\ttop: unset;\n\t\tposition: fixed;\n\t\tposition-area: top center;\n\t\tposition-visibility: anchors-visible;\n\t\tz-index: ", ";\n\t\t", "\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: ", ";\n\t\theight: ", ";\n\t\tmargin-left: ", ";\n\t\t", "\n\t\toutline: ", ";\n\t\tborder-left: ", ";\n\t\t", "\n\t\tbackground: ", ";\n\t\tborder-top: 1px solid ", ";\n\t}\n\n\t.ak-editor-selected-node .", "[data-number-column=\"true\"]:not(.", ") .", " tr:first-of-type th:first-of-type {\n\t\t/* Recolour the number-column corner mask to match the selected cells. Keep this identical\n\t\t to the .selectedCell ::before rule below \u2014 never set margin-top (the base negative\n\t\t margin aligns the mask) or radius (rounded generically by data-reaches-* rules). */\n\t\t&::before {\n\t\t\toutline: none;\n\t\t\tborder-left-color: ", ";\n\t\t\t", "\n\t\t\tborder-top-color: ", ";\n\t\t\tbackground: ", ";\n\t\t}\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\tborder-top-color: ", ";\n\t\tbackground: ", ";\n\t}\n\n\t.", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":first-of-type::before, .", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":not(.", "):first-of-type::before {\n\t\toutline: none;\n\t\t", "\n\t}\n\t.", "[data-number-column=\"true\"].", ".", " .", " tr:first-of-type th: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\tborder-top-color: ", ";\n\t\tbackground: ", ";\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)(),
|
|
78
|
+
return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", "\n\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\t\t", ";\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\t\t", ";\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\t\t", ";\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.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/* use :before element to hide table row insert dots when legacy table sticky header is activated */\n\t.", ".", ":has(tr.sticky)::before {\n\t\tcontent: ' ';\n\t\tposition: sticky;\n\t\tpointer-events: none;\n\t\ttop: 0;\n\t\tfloat: left;\n\t\ttransform: translateX(calc(-1 * (", "px + ", ")));\n\t\tmargin-bottom: calc(\n\t\t\t-1 * (", " - 1px + ", " + ", ")\n\t\t);\n\t\theight: calc(", " - 1px + ", " + ", ");\n\t\twidth: calc(", "px + ", ");\n\t\tbackground: linear-gradient(\n\t\t\tto bottom,\n\t\t\t", "\n\t\t\t\t90%,\n\t\t\ttransparent\n\t\t);\n\t\tz-index: ", ";\n\t}\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: ", ";\n\t\tbox-shadow:\n\t\t\tinset -1px 1px ", ",\n\t\t\tinset 1px -1px ", ";\n\n\t\t&.", " {\n\t\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\tth.", "::after {\n\t\t\theight: 100%;\n\t\t\tcontent: '';\n\t\t\tborder-left: 1px solid ", ";\n\t\t\tborder-bottom: 1px solid ", ";\n\t\t\tposition: absolute;\n\t\t\tright: 0px;\n\t\t\ttop: 0px;\n\t\t\tbottom: 0;\n\t\t\twidth: 100%;\n\t\t\tdisplay: inline-block;\n\t\t\tpointer-events: none;\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 transparent;\n\t\tz-index: ", ";\n\t}\n\n\t.", ":has(tr.", ")::before {\n\t\tborder-top: ", "px solid\n\t\t\t", ";\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(.", " tr.", ")\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\t\t", ";\n\t}\n\n\t", "\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\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: ", " 2px;\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\tposition: absolute;\n\t\ttop: ", "px;\n\t}\n\n\t.", " > .", " {\n\t\t/* +2px is to overlap the table border on the sides */\n\t\twidth: calc(anchor-size(width) + 2px);\n\t\theight: ", "px;\n\t\tbackground: ", ";\n\t\ttop: unset;\n\t\tposition: fixed;\n\t\tposition-area: top center;\n\t\tposition-visibility: anchors-visible;\n\t\tz-index: ", ";\n\t\t", "\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: ", ";\n\t\theight: ", ";\n\t\tmargin-left: ", ";\n\t\t", "\n\t\toutline: ", ";\n\t\tborder-left: ", ";\n\t\t", "\n\t\tbackground: ", ";\n\t\tborder-top: 1px solid ", ";\n\t}\n\n\t.ak-editor-selected-node .", "[data-number-column=\"true\"]:not(.", ") .", " tr:first-of-type th:first-of-type {\n\t\t/* Recolour the number-column corner mask to match the selected cells. Keep this identical\n\t\t to the .selectedCell ::before rule below \u2014 never set margin-top (the base negative\n\t\t margin aligns the mask) or radius (rounded generically by data-reaches-* rules). */\n\t\t&::before {\n\t\t\toutline: none;\n\t\t\tborder-left-color: ", ";\n\t\t\t", "\n\t\t\tborder-top-color: ", ";\n\t\t\tbackground: ", ";\n\t\t}\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\tborder-top-color: ", ";\n\t\tbackground: ", ";\n\t}\n\n\t.", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":first-of-type::before, .", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":not(.", "):first-of-type::before {\n\t\toutline: none;\n\t\t", "\n\t}\n\t.", "[data-number-column=\"true\"].", ".", " .", " tr:first-of-type th: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\tborder-top-color: ", ";\n\t\tbackground: ", ";\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)(),
|
|
79
79
|
// Only block getSelectionStyles when our replacement (gated by q4) owns the
|
|
80
80
|
// decoration, so node selection is never left unstyled.
|
|
81
|
-
(0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? rangeSelectionStylesForRoundedTable : rangeSelectionStyles, rangeSelectionStylesForFakeBorders, viewModeSortStyles(), (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "\n\t\t.ak-editor-panel:not([data-panel-type=\"custom\"]) .".concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-blue-subtlest, #E9F2FE)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"note\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-purple-subtlest, #F8EEFE)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"tip\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-green-subtlest, #DCFFF1)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"warning\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-yellow-subtlest, #FEF7C8)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"error\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-red-subtlest, #FFECEB)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"success\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-green-subtlest, #DCFFF1)", ";\n\t\t}\n\t") : '', (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, _consts3.tableCellBackgroundColor, _consts3.tableBorderColor, _consts3.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, _consts3.stickyRowOffsetTop, _editorSharedStyles.akEditorTableNumberColumnWidth, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts3.stickyRowOffsetTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "\n\t\t\twidth: ".concat(_editorSharedStyles.akEditorTableNumberColumnWidth + 1, "px;\n\t\t\tborder-left: 1px solid ").concat(_consts3.tableBorderColor, ";\n\n\t\t\t/* Keep the new fixed left border in sync with the selected/danger states,\n\t\t\t which would otherwise leave it the default colour (.active recolours the\n\t\t\t rest of the border) or drop it entirely (delete-hover sets border-left: 0). */\n\t\t\t&.active {\n\t\t\t\tborder-left-color: ").concat(_consts3.tableBorderSelectedColor, ";\n\t\t\t}\n\t\t\t&.").concat(_types.TableCssClassName.HOVERED_CELL_IN_DANGER, " {\n\t\t\t\tborder-left: 1px solid ").concat(_consts3.tableBorderDeleteColor, ";\n\t\t\t}\n\t\t\t") : '', _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.CORNER_CONTROLS, _editorSharedStyles.akEditorSmallZIndex, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.tableToolbarSize, _consts3.tableToolbarSize, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts3.tableToolbarSize, _consts3.tableToolbarSize, tableStickyHeaderColumnControlsDecorationsStyle(), tableStickyHeaderFirefoxFixStyle(), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts3.tableToolbarSize, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.tableToolbarSize, _types.TableCssClassName.TABLE_STICKY, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.stickyRowOffsetTop, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex - 5, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", "var(--ds-shadow-overflow-perimeter, #1E1F211f)", _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _consts3.stickyHeaderBorderBottomWidth, _consts3.tableBorderColor, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY, insertColumnButtonOffset + 1, (0, _expValEquals.expValEquals)('
|
|
82
|
-
// editor-plugin-block-controls/src/ui/drag-handle.tsx
|
|
83
|
-
// (`buttonWrapperStyles`):
|
|
84
|
-
// height = paddingTop (=calc(space.400 - 1px)) + paddingBottom (=space.200) + DRAG_HANDLE_HEIGHT
|
|
85
|
-
// width = DRAG_HANDLE_WIDTH + paddingRight('space.150')
|
|
86
|
-
".".concat(_types.TableCssClassName.TABLE_CONTAINER, ".").concat(_types.TableCssClassName.TABLE_STICKY, ":has(tr.sticky)::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: sticky;\n\t\t\tpointer-events: none;\n\t\t\ttop: 0;\n\t\t\tfloat: left;\n\t\t\ttransform: translateX(calc(-1 * (").concat(_styles.DRAG_HANDLE_WIDTH, "px + ", "var(--ds-space-150, 12px)", ")));\n\t\t\tmargin-bottom: calc(-1 * (", "var(--ds-space-400, 32px)", " - 1px + ", "var(--ds-space-200, 16px)", " + ", "var(--ds-space-300, 24px)", "));\n\t\t\theight: calc(", "var(--ds-space-400, 32px)", " - 1px + ", "var(--ds-space-200, 16px)", " + ", "var(--ds-space-300, 24px)", ");\n\t\t\twidth: calc(").concat(_styles.DRAG_HANDLE_WIDTH, "px + ", "var(--ds-space-150, 12px)", ");\n\t\t\tbackground: linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t").concat((0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", " 90%,\n\t\t\t\ttransparent\n\t\t\t);\n\t\t\tz-index: ").concat(_consts3.rowControlsZIndex + 5, ";\n\t\t}\n\t\t").concat((0, _platformFeatureFlags.fg)('platform_editor_col_insert_patch_1') ? // Shift the mask left by the numbered column width so it sits to the left of it.
|
|
87
|
-
".".concat(_types.TableCssClassName.TABLE_CONTAINER, ".").concat(_types.TableCssClassName.TABLE_STICKY, "[data-number-column='true']:has(tr.sticky)::before {\n\t\t\ttransform: translateX(calc(-1 * (").concat(_styles.DRAG_HANDLE_WIDTH, "px + ", "var(--ds-space-150, 12px)", " + ").concat(_editorSharedStyles.akEditorTableNumberColumnWidth, "px)));\n\t\t}") : "") : "", _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, (_consts3.resizeHandlerAreaWidth - _consts3.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, (_consts3.resizeHandlerAreaWidth - _consts3.resizeLineWidth) / 2, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? _editorSharedStyles.akEditorSmallZIndex : "calc(".concat(_editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex, " - 5)"), _consts3.tableBorderColor, _consts3.tableBorderColor, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "z-index: ".concat(_consts3.nativeStickyHeaderZIndex, ";") : '', _consts3.tableBorderColor, _consts3.tableBorderColor, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", _types.TableCssClassName.TABLE_HEADER_CELL, _consts3.tableBorderColor, _consts3.tableBorderColor, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, _styles.tableMarginTop, _consts3.stickyRowZIndex, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.DRAG_ROW_CONTROLS, _consts3.tableColumnControlsHeight, _consts3.aboveNativeStickyHeaderZIndex, (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_12', 'isEnabled', true) ? "\n\t\t\t.".concat(_types.TableCssClassName.TABLE_CONTAINER, ":has(> .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ")\n\t\t\t\t> .").concat(_types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, " {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\t") : "\n\t\t\t.".concat(_types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, ":has(~ .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ") {\n\t\t\t\tmargin-top: 0;\n\t\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, _consts3.belowNativeStickyHeaderZIndex, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _consts3.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, _consts3.tableControlsSpacing, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts3.tableControlsSpacing, _types.TableCssClassName.CORNER_CONTROLS, _consts3.tableControlsSpacing - _consts3.tableToolbarSize, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", sentinelStyles, stickyScrollbarStyles, _consts3.tablePadding, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts3.tablePadding, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _consts3.tablePadding, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts3.tablePadding - 1, _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, _consts3.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, _consts3.tableToolbarSize + 1, _consts3.tableToolbarSize + 1, _consts3.tableBorderColor, _consts3.tableBorderRadiusSize, _consts3.tableHeaderCellBackgroundColor, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts3.tableBorderSelectedColor, _consts3.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, _consts3.tableBorderSelectedColor, _consts3.tableToolbarSelectedColor, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts3.tableBorderDeleteColor, _consts3.tableToolbarDeleteColor, _types.TableCssClassName.ROW_CONTROLS, _consts3.tableToolbarSize, (0, _uiStyles.InsertMarker)("\n bottom: -1px;\n left: -11px;\n "), _types.TableCssClassName.ROW_CONTROLS_INNER, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _consts3.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(_consts3.tableBorderColor, ";\n border-right: 0px;\n border-radius: 0;\n height: 100%;\n width: ").concat(_consts3.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, _consts3.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, _consts3.tableColumnControlsHeight, "var(--ds-space-negative-150, -12px)", _consts3.resizeHandlerZIndex, _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER, _consts3.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, _consts3.tableBorderColor, (0, _editorSharedStyles.relativeSizeToBaseFontSize)(10), (0, _editorSharedStyles.relativeSizeToBaseFontSize)(14), _consts3.tableHeaderCellBackgroundColor, _consts3.tableTextColor, _consts3.tableBorderColor, _consts3.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, _consts3.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, _consts3.tableToolbarDeleteColor, _consts3.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(_consts3.tableToolbarDeleteColor, ";\n\t\t\t\tborder: 1px solid ").concat(_consts3.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(_consts3.tableBorderSelectedColor, ";"), _types.TableCssClassName.SELECTED_CELL, _consts3.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(_consts3.tableBorderDeleteColor, ";\n\t\t\tborder-top-color: ").concat(_consts3.tableBorderDeleteColor, ";"), _consts3.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _consts3.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, _consts3.tableBorderSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), _editorSharedStyles.akEditorUnitZIndex * 100, _consts3.tableCellDeleteColor, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), _editorSharedStyles.akEditorUnitZIndex * 100, _consts3.tableCellDeleteColor, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? (0, _roundedTableStyles.roundedTableOverrides)() : '', _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _styles.tableMarginTop, _consts3.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(_consts3.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(_consts3.tableToolbarSize, "px;\n\t\t"), _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _styles.tableMarginTop, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.nativeStickyHeaderZIndex + 1, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "\n\t\t/* Leave a 1px gap so the sticky header row's top border stays visible. */\n\t\ttranslate: 0 -1px;" : "", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts3.dragRowControlsWidth, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts3.dragRowControlsWidth, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.nativeStickyHeaderZIndex - 1, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "".concat(_editorSharedStyles.akEditorTableNumberColumnWidth, "px") : "".concat(_editorSharedStyles.akEditorTableNumberColumnWidth - 1, "px"), (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? 'calc(100% + 2px)' : '100%', (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "-".concat(_editorSharedStyles.akEditorTableNumberColumnWidth + 1, "px") : "-".concat(_editorSharedStyles.akEditorTableNumberColumnWidth, "px"), (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? // Anchor the mask with an explicit `top` so `vertical-align` (data-valign) on the cell
|
|
81
|
+
(0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? rangeSelectionStylesForRoundedTable : rangeSelectionStyles, rangeSelectionStylesForFakeBorders, viewModeSortStyles(), (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "\n\t\t.ak-editor-panel:not([data-panel-type=\"custom\"]) .".concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-blue-subtlest, #E9F2FE)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"note\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-purple-subtlest, #F8EEFE)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"tip\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-green-subtlest, #DCFFF1)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"warning\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-yellow-subtlest, #FEF7C8)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"error\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-red-subtlest, #FFECEB)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"success\"] .").concat(_types.TableCssClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(_consts.akEditorTableContainerBg, ": ", "var(--ds-background-accent-green-subtlest, #DCFFF1)", ";\n\t\t}\n\t") : '', (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, _consts3.tableCellBackgroundColor, _consts3.tableBorderColor, _consts3.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, _consts3.stickyRowOffsetTop, _editorSharedStyles.akEditorTableNumberColumnWidth, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts3.stickyRowOffsetTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "\n\t\t\twidth: ".concat(_editorSharedStyles.akEditorTableNumberColumnWidth + 1, "px;\n\t\t\tborder-left: 1px solid ").concat(_consts3.tableBorderColor, ";\n\n\t\t\t/* Keep the new fixed left border in sync with the selected/danger states,\n\t\t\t which would otherwise leave it the default colour (.active recolours the\n\t\t\t rest of the border) or drop it entirely (delete-hover sets border-left: 0). */\n\t\t\t&.active {\n\t\t\t\tborder-left-color: ").concat(_consts3.tableBorderSelectedColor, ";\n\t\t\t}\n\t\t\t&.").concat(_types.TableCssClassName.HOVERED_CELL_IN_DANGER, " {\n\t\t\t\tborder-left: 1px solid ").concat(_consts3.tableBorderDeleteColor, ";\n\t\t\t}\n\t\t\t") : '', _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.CORNER_CONTROLS, _editorSharedStyles.akEditorSmallZIndex, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.tableToolbarSize, _consts3.tableToolbarSize, _types.TableCssClassName.CORNER_CONTROLS, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts3.tableToolbarSize, _consts3.tableToolbarSize, tableStickyHeaderColumnControlsDecorationsStyle(), tableStickyHeaderFirefoxFixStyle(), _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.ROW_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _editorSharedStyles.akEditorStickyHeaderZIndex, _consts3.tableToolbarSize, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.tableToolbarSize, _types.TableCssClassName.TABLE_STICKY, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.stickyRowOffsetTop, _editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex - 5, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", "var(--ds-shadow-overflow-perimeter, #1E1F211f)", _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _types.TableCssClassName.NESTED_TABLE_WITH_CONTROLS, _consts3.stickyHeaderBorderBottomWidth, _consts3.tableBorderColor, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_STICKY, insertColumnButtonOffset + 1, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_STICKY, _styles.DRAG_HANDLE_WIDTH, "var(--ds-space-150, 12px)", "var(--ds-space-400, 32px)", "var(--ds-space-200, 16px)", "var(--ds-space-300, 24px)", "var(--ds-space-400, 32px)", "var(--ds-space-200, 16px)", "var(--ds-space-300, 24px)", _styles.DRAG_HANDLE_WIDTH, "var(--ds-space-150, 12px)", (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.rowControlsZIndex + 5, (0, _platformFeatureFlags.fg)('platform_editor_col_insert_patch_1') ? // Shift the mask left by the numbered column width so it sits to the left of it.
|
|
82
|
+
".".concat(_types.TableCssClassName.TABLE_CONTAINER, ".").concat(_types.TableCssClassName.TABLE_STICKY, "[data-number-column='true']:has(tr.sticky)::before {\n\t\ttransform: translateX(calc(-1 * (").concat(_styles.DRAG_HANDLE_WIDTH, "px + ", "var(--ds-space-150, 12px)", " + ").concat(_editorSharedStyles.akEditorTableNumberColumnWidth, "px)));\n\t}") : "", _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, (_consts3.resizeHandlerAreaWidth - _consts3.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, (_consts3.resizeHandlerAreaWidth - _consts3.resizeLineWidth) / 2, _types.TableCssClassName.HOVERED_CELL, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? _editorSharedStyles.akEditorSmallZIndex : "calc(".concat(_editorSharedStyles.akEditorTableCellOnStickyHeaderZIndex, " - 5)"), _consts3.tableBorderColor, _consts3.tableBorderColor, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "z-index: ".concat(_consts3.nativeStickyHeaderZIndex, ";") : '', _consts3.tableBorderColor, _consts3.tableBorderColor, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", _types.TableCssClassName.TABLE_HEADER_CELL, _consts3.tableBorderColor, _consts3.tableBorderColor, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY, _styles.tableMarginTop, _styles.tableMarginTop, _consts3.stickyRowZIndex, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.NATIVE_STICKY_ACTIVE, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.DRAG_ROW_CONTROLS, _consts3.tableColumnControlsHeight, _consts3.aboveNativeStickyHeaderZIndex, (0, _expValEquals.expValEquals)('platform_editor_table_sticky_header_patch_12', 'isEnabled', true) ? "\n\t\t\t.".concat(_types.TableCssClassName.TABLE_CONTAINER, ":has(> .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ")\n\t\t\t\t> .").concat(_types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, " {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\t") : "\n\t\t\t.".concat(_types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, ":has(~ .").concat(_types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ") {\n\t\t\t\tmargin-top: 0;\n\t\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, _consts3.belowNativeStickyHeaderZIndex, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.NATIVE_STICKY, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _consts3.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, _consts3.tableControlsSpacing, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.NUMBERED_COLUMN, _types.TableCssClassName.NUMBERED_COLUMN_BUTTON, _consts3.tableControlsSpacing, _types.TableCssClassName.CORNER_CONTROLS, _consts3.tableControlsSpacing - _consts3.tableToolbarSize, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", sentinelStyles, stickyScrollbarStyles, _consts3.tablePadding, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts3.tablePadding, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _consts3.tablePadding, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _types.TableCssClassName.TABLE_CHROMELESS, _types.TableCssClassName.TABLE_CONTAINER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts3.tablePadding - 1, _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, _consts3.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, _consts3.tableToolbarSize + 1, _consts3.tableToolbarSize + 1, _consts3.tableBorderColor, _consts3.tableBorderRadiusSize, _consts3.tableHeaderCellBackgroundColor, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _consts3.tableBorderSelectedColor, _consts3.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, _consts3.tableBorderSelectedColor, _consts3.tableToolbarSelectedColor, _types.TableCssClassName.IS_RESIZING, _types.TableCssClassName.CONTROLS_CORNER_BUTTON, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _consts3.tableBorderDeleteColor, _consts3.tableToolbarDeleteColor, _types.TableCssClassName.ROW_CONTROLS, _consts3.tableToolbarSize, (0, _uiStyles.InsertMarker)("\n bottom: -1px;\n left: -11px;\n "), _types.TableCssClassName.ROW_CONTROLS_INNER, _types.TableCssClassName.ROW_CONTROLS_BUTTON_WRAP, _consts3.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(_consts3.tableBorderColor, ";\n border-right: 0px;\n border-radius: 0;\n height: 100%;\n width: ").concat(_consts3.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, _consts3.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, _consts3.tableColumnControlsHeight, "var(--ds-space-negative-150, -12px)", _consts3.resizeHandlerZIndex, _types.TableCssClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER, _consts3.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, _consts3.tableBorderColor, (0, _editorSharedStyles.relativeSizeToBaseFontSize)(10), (0, _editorSharedStyles.relativeSizeToBaseFontSize)(14), _consts3.tableHeaderCellBackgroundColor, _consts3.tableTextColor, _consts3.tableBorderColor, _consts3.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, _consts3.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, _consts3.tableToolbarDeleteColor, _consts3.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(_consts3.tableToolbarDeleteColor, ";\n\t\t\t\tborder: 1px solid ").concat(_consts3.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(_consts3.tableBorderSelectedColor, ";"), _types.TableCssClassName.SELECTED_CELL, _consts3.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(_consts3.tableBorderDeleteColor, ";\n\t\t\tborder-top-color: ").concat(_consts3.tableBorderDeleteColor, ";"), _consts3.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex * 100, _consts3.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, _consts3.tableBorderSelectedColor, _editorSharedStyles.akEditorSmallZIndex, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), _editorSharedStyles.akEditorUnitZIndex * 100, _consts3.tableCellDeleteColor, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), _editorSharedStyles.akEditorUnitZIndex * 100, _consts3.tableCellDeleteColor, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? (0, _roundedTableStyles.roundedTableOverrides)() : '', _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _styles.tableMarginTop, _consts3.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(_consts3.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(_consts3.tableToolbarSize, "px;\n\t\t"), _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _styles.tableMarginTop, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.nativeStickyHeaderZIndex + 1, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "\n\t\t/* Leave a 1px gap so the sticky header row's top border stays visible. */\n\t\ttranslate: 0 -1px;" : "", _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_WRAPPER, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts3.dragRowControlsWidth, _editorSharedStyles.akEditorTableNumberColumnWidth + _consts3.dragRowControlsWidth, _styles.tableMarginTop, (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(_consts.akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", _consts3.nativeStickyHeaderZIndex - 1, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "".concat(_editorSharedStyles.akEditorTableNumberColumnWidth, "px") : "".concat(_editorSharedStyles.akEditorTableNumberColumnWidth - 1, "px"), (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? 'calc(100% + 2px)' : '100%', (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "-".concat(_editorSharedStyles.akEditorTableNumberColumnWidth + 1, "px") : "-".concat(_editorSharedStyles.akEditorTableNumberColumnWidth, "px"), (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? // Anchor the mask with an explicit `top` so `vertical-align` (data-valign) on the cell
|
|
88
83
|
// doesn't shift it; the calc reproduces the previous top-aligned offset.
|
|
89
84
|
"top: calc(".concat("var(--ds-space-100, 8px)", " - ", _consts3.stickyRowOffsetTop + 1, "px);") : "margin-top: -".concat(_consts3.stickyRowOffsetTop, "px;"), (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? 'none' : "0.5px solid ".concat(_consts3.tableBorderColor), (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "1px solid ".concat(_consts3.tableBorderColor) : 'none', (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "border-bottom: 1px solid ".concat(_consts3.tableBorderColor, ";") : "", "var(--ds-background-accent-gray-subtlest, #F0F1F2)", _consts3.tableBorderColor, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _consts3.tableBorderSelectedColor, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "border-bottom-color: ".concat(_consts3.tableBorderSelectedColor, ";") : '', _consts3.tableBorderSelectedColor, _consts3.tableHeaderCellSelectedColor, _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, _consts3.tableBorderSelectedColor, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? "border-bottom-color: ".concat(_consts3.tableBorderSelectedColor) : '', _consts3.tableBorderSelectedColor, _consts3.tableHeaderCellSelectedColor, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_SELECTED, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? // Recolour the corner edges to the delete border and composite the translucent danger
|
|
90
85
|
// fill over the mask's gray so it matches the adjacent cells instead of reading as transparent.
|
|
@@ -9,6 +9,7 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
|
|
|
9
9
|
import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
|
|
10
10
|
import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
|
|
11
11
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
12
|
+
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
12
13
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
13
14
|
import { pluginConfig as getPluginConfig } from '../pm-plugins/create-plugin-config';
|
|
14
15
|
import { getPluginState } from '../pm-plugins/plugin-factory';
|
|
@@ -118,7 +119,7 @@ export default class TableView extends ReactNodeView {
|
|
|
118
119
|
if (node && this.table && !node.contains(this.table)) {
|
|
119
120
|
// Patch to prevent selection collapsing when moving the table down with ctrl + shift + down
|
|
120
121
|
const selectionBeforeMove = this.view.state.selection;
|
|
121
|
-
const shouldPreserveCellSelection =
|
|
122
|
+
const shouldPreserveCellSelection = isExperimentEnabled('platform_editor_fix_table_move_shortcut') && selectionBeforeMove instanceof CellSelection;
|
|
122
123
|
|
|
123
124
|
// Store the current ignoreMutation handler so we can restore it later
|
|
124
125
|
oldIgnoreMutation = this.ignoreMutation;
|
|
@@ -34,19 +34,13 @@ export class FloatingInsertButton extends React.Component {
|
|
|
34
34
|
tableRef,
|
|
35
35
|
mountPoint,
|
|
36
36
|
boundariesElement,
|
|
37
|
-
isHeaderColumnEnabled,
|
|
38
37
|
isHeaderRowEnabled,
|
|
39
38
|
dispatchAnalyticsEvent,
|
|
40
39
|
isChromelessEditor
|
|
41
40
|
} = this.props;
|
|
42
41
|
|
|
43
|
-
//
|
|
44
|
-
|
|
45
|
-
const isFirstColumnInsertEnabled = expValEquals('platform_editor_table_col_insert', 'isEnabled', true);
|
|
46
|
-
|
|
47
|
-
// ED-26961 - disable insert button for first row, and keep first-column behavior
|
|
48
|
-
// disabled until platform_editor_table_col_insert is enabled.
|
|
49
|
-
if (insertColumnButtonIndex === 0 && !isFirstColumnInsertEnabled || insertRowButtonIndex === 0) {
|
|
42
|
+
// ED-26961 - disable insert button for first row.
|
|
43
|
+
if (insertRowButtonIndex === 0) {
|
|
50
44
|
return null;
|
|
51
45
|
}
|
|
52
46
|
const type = typeof insertColumnButtonIndex !== 'undefined' ? 'column' : typeof insertRowButtonIndex !== 'undefined' ? 'row' : null;
|
|
@@ -54,11 +48,9 @@ export class FloatingInsertButton extends React.Component {
|
|
|
54
48
|
return null;
|
|
55
49
|
}
|
|
56
50
|
|
|
57
|
-
// We can
|
|
58
|
-
// when the header row
|
|
59
|
-
|
|
60
|
-
// column (index 0) insert button even when the header column is enabled.
|
|
61
|
-
if (type === 'column' && isHeaderColumnEnabled && insertColumnButtonIndex === 0 && !isFirstColumnInsertEnabled || type === 'row' && isHeaderRowEnabled && insertRowButtonIndex === 0) {
|
|
51
|
+
// We can't display the insert button for row index 0
|
|
52
|
+
// when the header row is enabled.
|
|
53
|
+
if (type === 'row' && isHeaderRowEnabled && insertRowButtonIndex === 0) {
|
|
62
54
|
return null;
|
|
63
55
|
}
|
|
64
56
|
const {
|
|
@@ -195,10 +195,6 @@ export const ColumnControls = ({
|
|
|
195
195
|
var _getScrollOffset;
|
|
196
196
|
columnControlsRef.current.scrollLeft = (_getScrollOffset = getScrollOffset === null || getScrollOffset === void 0 ? void 0 : getScrollOffset()) !== null && _getScrollOffset !== void 0 ? _getScrollOffset : 0;
|
|
197
197
|
}
|
|
198
|
-
|
|
199
|
-
// EDITOR-6790 - render a dot on the left edge of the first column so users have a visible
|
|
200
|
-
// affordance to insert a column to the left of the first column.
|
|
201
|
-
const isFirstColumnInsertEnabled = expValEquals('platform_editor_table_col_insert', 'isEnabled', true);
|
|
202
198
|
const generateHandleByType = (type, appearance, gridColumn, indexes) => {
|
|
203
199
|
var _rowHeights$reduce, _colWidths$reduce;
|
|
204
200
|
const isHover = type === 'hover';
|
|
@@ -228,7 +224,7 @@ export const ColumnControls = ({
|
|
|
228
224
|
width: '100%',
|
|
229
225
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
230
226
|
position: 'relative',
|
|
231
|
-
pointerEvents: isPlaceholder
|
|
227
|
+
pointerEvents: isPlaceholder ? 'none' : undefined
|
|
232
228
|
},
|
|
233
229
|
"data-testid": `table-floating-column-${isHover ? colIndex : isPlaceholder ? appearance : selectedColIndexes[0]}-drag-handle`
|
|
234
230
|
}, /*#__PURE__*/React.createElement(DragHandle, {
|
|
@@ -311,7 +307,7 @@ export const ColumnControls = ({
|
|
|
311
307
|
// eslint-disable-next-line react/no-array-index-key
|
|
312
308
|
,
|
|
313
309
|
key: index
|
|
314
|
-
},
|
|
310
|
+
}, index === 0 && /*#__PURE__*/React.createElement("div", {
|
|
315
311
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
316
312
|
className: ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT
|
|
317
313
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
@@ -412,34 +412,31 @@ expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? rangeS
|
|
|
412
412
|
}
|
|
413
413
|
|
|
414
414
|
/* use :before element to hide table row insert dots when legacy table sticky header is activated */
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
z-index: ${rowControlsZIndex + 5};
|
|
437
|
-
}
|
|
438
|
-
${fg('platform_editor_col_insert_patch_1') ?
|
|
415
|
+
.${ClassName.TABLE_CONTAINER}.${ClassName.TABLE_STICKY}:has(tr.sticky)::before {
|
|
416
|
+
content: ' ';
|
|
417
|
+
position: sticky;
|
|
418
|
+
pointer-events: none;
|
|
419
|
+
top: 0;
|
|
420
|
+
float: left;
|
|
421
|
+
transform: translateX(calc(-1 * (${DRAG_HANDLE_WIDTH}px + ${"var(--ds-space-150, 12px)"})));
|
|
422
|
+
margin-bottom: calc(
|
|
423
|
+
-1 * (${"var(--ds-space-400, 32px)"} - 1px + ${"var(--ds-space-200, 16px)"} + ${"var(--ds-space-300, 24px)"})
|
|
424
|
+
);
|
|
425
|
+
height: calc(${"var(--ds-space-400, 32px)"} - 1px + ${"var(--ds-space-200, 16px)"} + ${"var(--ds-space-300, 24px)"});
|
|
426
|
+
width: calc(${DRAG_HANDLE_WIDTH}px + ${"var(--ds-space-150, 12px)"});
|
|
427
|
+
background: linear-gradient(
|
|
428
|
+
to bottom,
|
|
429
|
+
${expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? `var(${akEditorTableContainerBg}, ${"var(--ds-surface, #FFFFFF)"})` : "var(--ds-surface, #FFFFFF)"}
|
|
430
|
+
90%,
|
|
431
|
+
transparent
|
|
432
|
+
);
|
|
433
|
+
z-index: ${rowControlsZIndex + 5};
|
|
434
|
+
}
|
|
435
|
+
${fg('platform_editor_col_insert_patch_1') ?
|
|
439
436
|
// Shift the mask left by the numbered column width so it sits to the left of it.
|
|
440
437
|
`.${ClassName.TABLE_CONTAINER}.${ClassName.TABLE_STICKY}[data-number-column='true']:has(tr.sticky)::before {
|
|
441
|
-
|
|
442
|
-
|
|
438
|
+
transform: translateX(calc(-1 * (${DRAG_HANDLE_WIDTH}px + ${"var(--ds-space-150, 12px)"} + ${akEditorTableNumberColumnWidth}px)));
|
|
439
|
+
}` : ``}
|
|
443
440
|
|
|
444
441
|
/* To fix jumpiness caused in Chrome Browsers for sticky headers */
|
|
445
442
|
.${ClassName.TABLE_STICKY} .sticky + tr {
|
|
@@ -19,6 +19,7 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
|
|
|
19
19
|
import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
|
|
20
20
|
import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
|
|
21
21
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
22
|
+
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
22
23
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
23
24
|
import { pluginConfig as getPluginConfig } from '../pm-plugins/create-plugin-config';
|
|
24
25
|
import { getPluginState } from '../pm-plugins/plugin-factory';
|
|
@@ -141,7 +142,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
|
|
|
141
142
|
if (node && this.table && !node.contains(this.table)) {
|
|
142
143
|
// Patch to prevent selection collapsing when moving the table down with ctrl + shift + down
|
|
143
144
|
var selectionBeforeMove = this.view.state.selection;
|
|
144
|
-
var shouldPreserveCellSelection =
|
|
145
|
+
var shouldPreserveCellSelection = isExperimentEnabled('platform_editor_fix_table_move_shortcut') && selectionBeforeMove instanceof CellSelection;
|
|
145
146
|
|
|
146
147
|
// Store the current ignoreMutation handler so we can restore it later
|
|
147
148
|
oldIgnoreMutation = this.ignoreMutation;
|
|
@@ -47,18 +47,12 @@ export var FloatingInsertButton = /*#__PURE__*/function (_React$Component) {
|
|
|
47
47
|
tableRef = _this$props.tableRef,
|
|
48
48
|
mountPoint = _this$props.mountPoint,
|
|
49
49
|
boundariesElement = _this$props.boundariesElement,
|
|
50
|
-
isHeaderColumnEnabled = _this$props.isHeaderColumnEnabled,
|
|
51
50
|
isHeaderRowEnabled = _this$props.isHeaderRowEnabled,
|
|
52
51
|
dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
|
|
53
52
|
isChromelessEditor = _this$props.isChromelessEditor;
|
|
54
53
|
|
|
55
|
-
//
|
|
56
|
-
|
|
57
|
-
var isFirstColumnInsertEnabled = expValEquals('platform_editor_table_col_insert', 'isEnabled', true);
|
|
58
|
-
|
|
59
|
-
// ED-26961 - disable insert button for first row, and keep first-column behavior
|
|
60
|
-
// disabled until platform_editor_table_col_insert is enabled.
|
|
61
|
-
if (insertColumnButtonIndex === 0 && !isFirstColumnInsertEnabled || insertRowButtonIndex === 0) {
|
|
54
|
+
// ED-26961 - disable insert button for first row.
|
|
55
|
+
if (insertRowButtonIndex === 0) {
|
|
62
56
|
return null;
|
|
63
57
|
}
|
|
64
58
|
var type = typeof insertColumnButtonIndex !== 'undefined' ? 'column' : typeof insertRowButtonIndex !== 'undefined' ? 'row' : null;
|
|
@@ -66,11 +60,9 @@ export var FloatingInsertButton = /*#__PURE__*/function (_React$Component) {
|
|
|
66
60
|
return null;
|
|
67
61
|
}
|
|
68
62
|
|
|
69
|
-
// We can
|
|
70
|
-
// when the header row
|
|
71
|
-
|
|
72
|
-
// column (index 0) insert button even when the header column is enabled.
|
|
73
|
-
if (type === 'column' && isHeaderColumnEnabled && insertColumnButtonIndex === 0 && !isFirstColumnInsertEnabled || type === 'row' && isHeaderRowEnabled && insertRowButtonIndex === 0) {
|
|
63
|
+
// We can't display the insert button for row index 0
|
|
64
|
+
// when the header row is enabled.
|
|
65
|
+
if (type === 'row' && isHeaderRowEnabled && insertRowButtonIndex === 0) {
|
|
74
66
|
return null;
|
|
75
67
|
}
|
|
76
68
|
var tr = editorView.state.tr;
|
|
@@ -184,10 +184,6 @@ export var ColumnControls = function ColumnControls(_ref) {
|
|
|
184
184
|
var _getScrollOffset;
|
|
185
185
|
columnControlsRef.current.scrollLeft = (_getScrollOffset = getScrollOffset === null || getScrollOffset === void 0 ? void 0 : getScrollOffset()) !== null && _getScrollOffset !== void 0 ? _getScrollOffset : 0;
|
|
186
186
|
}
|
|
187
|
-
|
|
188
|
-
// EDITOR-6790 - render a dot on the left edge of the first column so users have a visible
|
|
189
|
-
// affordance to insert a column to the left of the first column.
|
|
190
|
-
var isFirstColumnInsertEnabled = expValEquals('platform_editor_table_col_insert', 'isEnabled', true);
|
|
191
187
|
var generateHandleByType = function generateHandleByType(type, appearance, gridColumn, indexes) {
|
|
192
188
|
var _rowHeights$reduce, _colWidths$reduce;
|
|
193
189
|
var isHover = type === 'hover';
|
|
@@ -221,7 +217,7 @@ export var ColumnControls = function ColumnControls(_ref) {
|
|
|
221
217
|
width: '100%',
|
|
222
218
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
223
219
|
position: 'relative',
|
|
224
|
-
pointerEvents: isPlaceholder
|
|
220
|
+
pointerEvents: isPlaceholder ? 'none' : undefined
|
|
225
221
|
},
|
|
226
222
|
"data-testid": "table-floating-column-".concat(isHover ? colIndex : isPlaceholder ? appearance : selectedColIndexes[0], "-drag-handle")
|
|
227
223
|
}, /*#__PURE__*/React.createElement(DragHandle, {
|
|
@@ -304,7 +300,7 @@ export var ColumnControls = function ColumnControls(_ref) {
|
|
|
304
300
|
// eslint-disable-next-line react/no-array-index-key
|
|
305
301
|
,
|
|
306
302
|
key: index
|
|
307
|
-
},
|
|
303
|
+
}, index === 0 && /*#__PURE__*/React.createElement("div", {
|
|
308
304
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
309
305
|
className: ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT
|
|
310
306
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
@@ -70,16 +70,11 @@ var tableStickyHeaderFirefoxFixStyle = function tableStickyHeaderFirefoxFixStyle
|
|
|
70
70
|
}
|
|
71
71
|
};
|
|
72
72
|
var baseTableStylesWithoutSharedStyle = function baseTableStylesWithoutSharedStyle(props) {
|
|
73
|
-
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", "\n\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\t\t", ";\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\t\t", ";\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\t\t", ";\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.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/* use :before element to hide table row insert dots when legacy table sticky header is activated */\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: ", ";\n\t\tbox-shadow:\n\t\t\tinset -1px 1px ", ",\n\t\t\tinset 1px -1px ", ";\n\n\t\t&.", " {\n\t\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\tth.", "::after {\n\t\t\theight: 100%;\n\t\t\tcontent: '';\n\t\t\tborder-left: 1px solid ", ";\n\t\t\tborder-bottom: 1px solid ", ";\n\t\t\tposition: absolute;\n\t\t\tright: 0px;\n\t\t\ttop: 0px;\n\t\t\tbottom: 0;\n\t\t\twidth: 100%;\n\t\t\tdisplay: inline-block;\n\t\t\tpointer-events: none;\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 transparent;\n\t\tz-index: ", ";\n\t}\n\n\t.", ":has(tr.", ")::before {\n\t\tborder-top: ", "px solid\n\t\t\t", ";\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(.", " tr.", ")\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\t\t", ";\n\t}\n\n\t", "\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\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: ", " 2px;\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\tposition: absolute;\n\t\ttop: ", "px;\n\t}\n\n\t.", " > .", " {\n\t\t/* +2px is to overlap the table border on the sides */\n\t\twidth: calc(anchor-size(width) + 2px);\n\t\theight: ", "px;\n\t\tbackground: ", ";\n\t\ttop: unset;\n\t\tposition: fixed;\n\t\tposition-area: top center;\n\t\tposition-visibility: anchors-visible;\n\t\tz-index: ", ";\n\t\t", "\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: ", ";\n\t\theight: ", ";\n\t\tmargin-left: ", ";\n\t\t", "\n\t\toutline: ", ";\n\t\tborder-left: ", ";\n\t\t", "\n\t\tbackground: ", ";\n\t\tborder-top: 1px solid ", ";\n\t}\n\n\t.ak-editor-selected-node .", "[data-number-column=\"true\"]:not(.", ") .", " tr:first-of-type th:first-of-type {\n\t\t/* Recolour the number-column corner mask to match the selected cells. Keep this identical\n\t\t to the .selectedCell ::before rule below \u2014 never set margin-top (the base negative\n\t\t margin aligns the mask) or radius (rounded generically by data-reaches-* rules). */\n\t\t&::before {\n\t\t\toutline: none;\n\t\t\tborder-left-color: ", ";\n\t\t\t", "\n\t\t\tborder-top-color: ", ";\n\t\t\tbackground: ", ";\n\t\t}\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\tborder-top-color: ", ";\n\t\tbackground: ", ";\n\t}\n\n\t.", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":first-of-type::before, .", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":not(.", "):first-of-type::before {\n\t\toutline: none;\n\t\t", "\n\t}\n\t.", "[data-number-column=\"true\"].", ".", " .", " tr:first-of-type th: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\tborder-top-color: ", ";\n\t\tbackground: ", ";\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"])), columnControlsLineMarker(), hoveredDeleteButton(), hoveredCell(), hoveredWarningCell, insertLine(), resizeHandle(),
|
|
73
|
+
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\t", ";\n\n\t", "\n\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\t\t", ";\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\t\t", ";\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\t\t", ";\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.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/* use :before element to hide table row insert dots when legacy table sticky header is activated */\n\t.", ".", ":has(tr.sticky)::before {\n\t\tcontent: ' ';\n\t\tposition: sticky;\n\t\tpointer-events: none;\n\t\ttop: 0;\n\t\tfloat: left;\n\t\ttransform: translateX(calc(-1 * (", "px + ", ")));\n\t\tmargin-bottom: calc(\n\t\t\t-1 * (", " - 1px + ", " + ", ")\n\t\t);\n\t\theight: calc(", " - 1px + ", " + ", ");\n\t\twidth: calc(", "px + ", ");\n\t\tbackground: linear-gradient(\n\t\t\tto bottom,\n\t\t\t", "\n\t\t\t\t90%,\n\t\t\ttransparent\n\t\t);\n\t\tz-index: ", ";\n\t}\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: ", ";\n\t\tbox-shadow:\n\t\t\tinset -1px 1px ", ",\n\t\t\tinset 1px -1px ", ";\n\n\t\t&.", " {\n\t\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\tth.", "::after {\n\t\t\theight: 100%;\n\t\t\tcontent: '';\n\t\t\tborder-left: 1px solid ", ";\n\t\t\tborder-bottom: 1px solid ", ";\n\t\t\tposition: absolute;\n\t\t\tright: 0px;\n\t\t\ttop: 0px;\n\t\t\tbottom: 0;\n\t\t\twidth: 100%;\n\t\t\tdisplay: inline-block;\n\t\t\tpointer-events: none;\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 transparent;\n\t\tz-index: ", ";\n\t}\n\n\t.", ":has(tr.", ")::before {\n\t\tborder-top: ", "px solid\n\t\t\t", ";\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(.", " tr.", ")\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\t\t", ";\n\t}\n\n\t", "\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\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: ", " 2px;\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\tposition: absolute;\n\t\ttop: ", "px;\n\t}\n\n\t.", " > .", " {\n\t\t/* +2px is to overlap the table border on the sides */\n\t\twidth: calc(anchor-size(width) + 2px);\n\t\theight: ", "px;\n\t\tbackground: ", ";\n\t\ttop: unset;\n\t\tposition: fixed;\n\t\tposition-area: top center;\n\t\tposition-visibility: anchors-visible;\n\t\tz-index: ", ";\n\t\t", "\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: ", ";\n\t\theight: ", ";\n\t\tmargin-left: ", ";\n\t\t", "\n\t\toutline: ", ";\n\t\tborder-left: ", ";\n\t\t", "\n\t\tbackground: ", ";\n\t\tborder-top: 1px solid ", ";\n\t}\n\n\t.ak-editor-selected-node .", "[data-number-column=\"true\"]:not(.", ") .", " tr:first-of-type th:first-of-type {\n\t\t/* Recolour the number-column corner mask to match the selected cells. Keep this identical\n\t\t to the .selectedCell ::before rule below \u2014 never set margin-top (the base negative\n\t\t margin aligns the mask) or radius (rounded generically by data-reaches-* rules). */\n\t\t&::before {\n\t\t\toutline: none;\n\t\t\tborder-left-color: ", ";\n\t\t\t", "\n\t\t\tborder-top-color: ", ";\n\t\t\tbackground: ", ";\n\t\t}\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\tborder-top-color: ", ";\n\t\tbackground: ", ";\n\t}\n\n\t.", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":first-of-type::before, .", "[data-number-column=\"true\"] .", " tr:first-of-type th.", ":not(.", "):first-of-type::before {\n\t\toutline: none;\n\t\t", "\n\t}\n\t.", "[data-number-column=\"true\"].", ".", " .", " tr:first-of-type th: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\tborder-top-color: ", ";\n\t\tbackground: ", ";\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"])), columnControlsLineMarker(), hoveredDeleteButton(), hoveredCell(), hoveredWarningCell, insertLine(), resizeHandle(),
|
|
74
74
|
// Only block getSelectionStyles when our replacement (gated by q4) owns the
|
|
75
75
|
// decoration, so node selection is never left unstyled.
|
|
76
|
-
expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? rangeSelectionStylesForRoundedTable : rangeSelectionStyles, rangeSelectionStylesForFakeBorders, viewModeSortStyles(), expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "\n\t\t.ak-editor-panel:not([data-panel-type=\"custom\"]) .".concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-blue-subtlest, #E9F2FE)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"note\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-purple-subtlest, #F8EEFE)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"tip\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-green-subtlest, #DCFFF1)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"warning\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-yellow-subtlest, #FEF7C8)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"error\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-red-subtlest, #FFECEB)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"success\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-green-subtlest, #DCFFF1)", ";\n\t\t}\n\t") : '', expValEquals('platform_editor_table_sticky_header_improvements', 'cohort', 'test_with_overflow') && tableAnchorStyles, ClassName.TABLE_NODE_WRAPPER, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.TABLE_CELL, tableCellBackgroundColor, tableBorderColor, tableBorderColor, ClassName.CONTROLS_FLOATING_BUTTON_COLUMN, insertColumnButtonWrapper(), ClassName.CONTROLS_FLOATING_BUTTON_ROW, insertRowButtonWrapper(), dragInsertButtonWrapper(), dragCornerControlButton(), DeleteButton(), ClassName.TABLE_STICKY, props.isDragAndDropEnabled ? ClassName.DRAG_ROW_CONTROLS_WRAPPER : ClassName.ROW_CONTROLS_WRAPPER, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, stickyRowOffsetTop, akEditorTableNumberColumnWidth, akEditorStickyHeaderZIndex, stickyRowOffsetTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "\n\t\t\twidth: ".concat(akEditorTableNumberColumnWidth + 1, "px;\n\t\t\tborder-left: 1px solid ").concat(tableBorderColor, ";\n\n\t\t\t/* Keep the new fixed left border in sync with the selected/danger states,\n\t\t\t which would otherwise leave it the default colour (.active recolours the\n\t\t\t rest of the border) or drop it entirely (delete-hover sets border-left: 0). */\n\t\t\t&.active {\n\t\t\t\tborder-left-color: ").concat(tableBorderSelectedColor, ";\n\t\t\t}\n\t\t\t&.").concat(ClassName.HOVERED_CELL_IN_DANGER, " {\n\t\t\t\tborder-left: 1px solid ").concat(tableBorderDeleteColor, ";\n\t\t\t}\n\t\t\t") : '', ClassName.TABLE_STICKY, ClassName.CORNER_CONTROLS, akEditorSmallZIndex, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", tableToolbarSize, tableToolbarSize, ClassName.CORNER_CONTROLS, ClassName.CONTROLS_CORNER_BUTTON, tableToolbarSize, tableToolbarSize, tableStickyHeaderColumnControlsDecorationsStyle(), tableStickyHeaderFirefoxFixStyle(), ClassName.TABLE_STICKY, ClassName.ROW_CONTROLS, ClassName.ROW_CONTROLS_BUTTON_WRAP, akEditorStickyHeaderZIndex, tableToolbarSize, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", tableToolbarSize, ClassName.TABLE_STICKY, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", stickyRowOffsetTop, akEditorTableCellOnStickyHeaderZIndex - 5, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", "var(--ds-shadow-overflow-perimeter, #1E1F211f)", ClassName.NESTED_TABLE_WITH_CONTROLS, ClassName.NESTED_TABLE_WITH_CONTROLS, stickyHeaderBorderBottomWidth, tableBorderColor, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY, insertColumnButtonOffset + 1, expValEquals('
|
|
77
|
-
// editor-plugin-block-controls/src/ui/drag-handle.tsx
|
|
78
|
-
// (`buttonWrapperStyles`):
|
|
79
|
-
// height = paddingTop (=calc(space.400 - 1px)) + paddingBottom (=space.200) + DRAG_HANDLE_HEIGHT
|
|
80
|
-
// width = DRAG_HANDLE_WIDTH + paddingRight('space.150')
|
|
81
|
-
".".concat(ClassName.TABLE_CONTAINER, ".").concat(ClassName.TABLE_STICKY, ":has(tr.sticky)::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: sticky;\n\t\t\tpointer-events: none;\n\t\t\ttop: 0;\n\t\t\tfloat: left;\n\t\t\ttransform: translateX(calc(-1 * (").concat(DRAG_HANDLE_WIDTH, "px + ", "var(--ds-space-150, 12px)", ")));\n\t\t\tmargin-bottom: calc(-1 * (", "var(--ds-space-400, 32px)", " - 1px + ", "var(--ds-space-200, 16px)", " + ", "var(--ds-space-300, 24px)", "));\n\t\t\theight: calc(", "var(--ds-space-400, 32px)", " - 1px + ", "var(--ds-space-200, 16px)", " + ", "var(--ds-space-300, 24px)", ");\n\t\t\twidth: calc(").concat(DRAG_HANDLE_WIDTH, "px + ", "var(--ds-space-150, 12px)", ");\n\t\t\tbackground: linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t").concat(expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", " 90%,\n\t\t\t\ttransparent\n\t\t\t);\n\t\t\tz-index: ").concat(rowControlsZIndex + 5, ";\n\t\t}\n\t\t").concat(fg('platform_editor_col_insert_patch_1') ? // Shift the mask left by the numbered column width so it sits to the left of it.
|
|
82
|
-
".".concat(ClassName.TABLE_CONTAINER, ".").concat(ClassName.TABLE_STICKY, "[data-number-column='true']:has(tr.sticky)::before {\n\t\t\ttransform: translateX(calc(-1 * (").concat(DRAG_HANDLE_WIDTH, "px + ", "var(--ds-space-150, 12px)", " + ").concat(akEditorTableNumberColumnWidth, "px)));\n\t\t}") : "") : "", ClassName.TABLE_STICKY, ClassName.TABLE_CONTAINER, ClassName.TABLE_STICKY, ClassName.WITH_RESIZE_LINE, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, (resizeHandlerAreaWidth - resizeLineWidth) / 2 + 1, ClassName.WITH_RESIZE_LINE, ClassName.SELECTED_CELL, ClassName.WITH_RESIZE_LINE, ClassName.SELECTED_CELL, ClassName.RESIZE_HANDLE_DECORATION, (resizeHandlerAreaWidth - resizeLineWidth) / 2, ClassName.HOVERED_CELL, ClassName.SELECTED_CELL, ClassName.NATIVE_STICKY, tableMarginTop, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? akEditorSmallZIndex : "calc(".concat(akEditorTableCellOnStickyHeaderZIndex, " - 5)"), tableBorderColor, tableBorderColor, ClassName.NATIVE_STICKY_ACTIVE, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "z-index: ".concat(nativeStickyHeaderZIndex, ";") : '', tableBorderColor, tableBorderColor, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", ClassName.TABLE_HEADER_CELL, tableBorderColor, tableBorderColor, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, tableMarginTop, tableMarginTop, stickyRowZIndex, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY_ACTIVE, tableMarginTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.DRAG_ROW_CONTROLS, tableColumnControlsHeight, aboveNativeStickyHeaderZIndex, expValEquals('platform_editor_table_sticky_header_patch_12', 'isEnabled', true) ? "\n\t\t\t.".concat(ClassName.TABLE_CONTAINER, ":has(> .").concat(ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ")\n\t\t\t\t> .").concat(ClassName.DRAG_ROW_CONTROLS_WRAPPER, " {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\t") : "\n\t\t\t.".concat(ClassName.DRAG_ROW_CONTROLS_WRAPPER, ":has(~ .").concat(ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ") {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t"), ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.DRAG_ROW_CONTROLS, belowNativeStickyHeaderZIndex, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.NATIVE_STICKY, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.NUMBERED_COLUMN, tableColumnControlsHeight, ClassName.NATIVE_STICKY, akEditorTableNumberColumnWidth, akEditorTableNumberColumnWidth, ClassName.TABLE_CONTAINER, ClassName.WITH_CONTROLS, ClassName.DRAG_ROW_FLOATING_DRAG_HANDLE, ClassName.WITH_CONTROLS, ClassName.NATIVE_STICKY, tableMarginTop, ClassName.WITH_CONTROLS, tableControlsSpacing, ClassName.WITH_CONTROLS, ClassName.TABLE_STICKY, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, tableControlsSpacing, ClassName.CORNER_CONTROLS, tableControlsSpacing - tableToolbarSize, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", sentinelStyles, stickyScrollbarStyles, tablePadding, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.ROW_CONTROLS_WRAPPER, tablePadding, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.TABLE_CHROMELESS, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tablePadding, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, ClassName.TABLE_CHROMELESS, ClassName.TABLE_CONTAINER, akEditorTableNumberColumnWidth + tablePadding - 1, TableSharedCssClassName.TABLE_LEFT_BORDER, TableSharedCssClassName.TABLE_RIGHT_BORDER, ClassName.NODEVIEW_WRAPPER, breakoutWidthStyling(), columnControlsDecoration(), rowControlsWrapperDotStyle(), ClassName.CORNER_CONTROLS, tableToolbarSize + 1, cornerControlHeight, ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, InsertMarker("\n left: -11px;\n top: 9px;\n "), ClassName.CORNER_CONTROLS, ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, ClassName.CONTROLS_CORNER_BUTTON, tableToolbarSize + 1, tableToolbarSize + 1, tableBorderColor, tableBorderRadiusSize, tableHeaderCellBackgroundColor, ClassName.CONTROLS_CORNER_BUTTON, tableBorderSelectedColor, tableToolbarSelectedColor, ClassName.TABLE_CONTAINER, ClassName.CORNER_CONTROLS, ClassName.CONTROLS_CORNER_BUTTON, akEditorTableToolbarSize + akEditorTableNumberColumnWidth + 1, ClassName.ROW_CONTROLS, ClassName.CONTROLS_BUTTON, ClassName.IS_RESIZING, ClassName.CONTROLS_CORNER_BUTTON, tableBorderSelectedColor, tableToolbarSelectedColor, ClassName.IS_RESIZING, ClassName.CONTROLS_CORNER_BUTTON, ClassName.HOVERED_CELL_IN_DANGER, tableBorderDeleteColor, tableToolbarDeleteColor, ClassName.ROW_CONTROLS, tableToolbarSize, InsertMarker("\n bottom: -1px;\n left: -11px;\n "), ClassName.ROW_CONTROLS_INNER, ClassName.ROW_CONTROLS_BUTTON_WRAP, tableBorderRadiusSize, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.CONTROLS_BUTTON, akEditorUnitZIndex, HeaderButton("\n border-bottom: 1px solid ".concat(tableBorderColor, ";\n border-right: 0px;\n border-radius: 0;\n height: 100%;\n width: ").concat(tableToolbarSize, "px;\n\n .").concat(ClassName.CONTROLS_BUTTON_OVERLAY, " {\n position: absolute;\n width: 30px;\n height: 50%;\n right: 0;\n bottom: 0;\n }\n .").concat(ClassName.CONTROLS_BUTTON_OVERLAY, ":first-of-type {\n top: 0;\n }\n ")), ClassName.DRAG_ROW_CONTROLS, rowControlsZIndex + 4, ClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER, ClassName.DRAG_ROW_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #DDDEE1)", ClassName.DRAG_COLUMN_CONTROLS, ClassName.DRAG_COLUMN_CONTROLS_INNER, tableColumnControlsHeight, "var(--ds-space-negative-150, -12px)", resizeHandlerZIndex, ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER, tableColumnControlsHeight, ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #DDDEE1)", ClassName.DRAG_HANDLE_BUTTON_CLICKABLE_ZONE, ClassName.DRAG_HANDLE_BUTTON_CONTAINER, "var(--ds-surface, #FFFFFF)", ClassName.DRAG_HANDLE_DISABLED, ClassName.DRAG_HANDLE_MINIMISED, "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-background-accent-gray-subtlest, #F0F1F2)", "var(--ds-icon-disabled, #080F214A)", ClassName.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)", floatingColumnControls(), ClassName.IS_RESIZING, ClassName.ROW_CONTROLS, HeaderButtonHover(), HeaderButtonDanger(), ClassName.NUMBERED_COLUMN, akEditorTableToolbarSize, props.isDragAndDropEnabled ? 0 : akEditorTableToolbarSize, akEditorTableNumberColumnWidth + 1, ClassName.NUMBERED_COLUMN_BUTTON, tableBorderColor, relativeSizeToBaseFontSize(10), relativeSizeToBaseFontSize(14), tableHeaderCellBackgroundColor, tableTextColor, tableBorderColor, tableBorderColor, ClassName.TABLE_STICKY, props.isDragAndDropEnabled ? ClassName.DRAG_ROW_CONTROLS_WRAPPER : ClassName.ROW_CONTROLS_WRAPPER, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, "var(--ds-surface, #FFFFFF)", ClassName.WITH_CONTROLS, ClassName.CORNER_CONTROLS, ClassName.ROW_CONTROLS, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON, numberedColumnButtonSelectedStyles, ClassName.TABLE_CONTAINER, ClassName.NUMBERED_COLUMN_BUTTON, tableBorderColor, editorExperiment('platform_editor_block_menu', true) ? "/* Apply numbered column styling when table is selected via text selection (e.g., block menu) */\n\t.".concat(akEditorSelectedNodeClassName, " {\n\t\t.").concat(ClassName.NUMBERED_COLUMN, " {\n\t\t\t.").concat(ClassName.NUMBERED_COLUMN_BUTTON, " {\n\t\t\t\t").concat(numberedColumnButtonSelectedStyles, "\n\t\t\t\t").concat(hideNativeBrowserTextSelectionStyles, "\n\t\t\t}\n\t\t}\n\t}") : '', ClassName.IS_RESIZING, ClassName.WITH_CONTROLS, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, numberedColumnButtonSelectedStyles, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.HOVERED_CELL_IN_DANGER, tableToolbarDeleteColor, tableBorderDeleteColor, "var(--ds-text-danger, #AE2E24)", akEditorUnitZIndex, editorExperiment('platform_editor_block_menu', true) ? ".tableView-content-wrap.danger {\n\t\t:not(.".concat(ClassName.IS_RESIZING, ") .").concat(ClassName.WITH_CONTROLS, " {\n\t\t\t.").concat(ClassName.NUMBERED_COLUMN_BUTTON, " {\n\t\t\t\tbackground-color: ").concat(tableToolbarDeleteColor, ";\n\t\t\t\tborder: 1px solid ").concat(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(akEditorUnitZIndex, ";\n\t\t\t}\n\t\t}\n\t}") : '', ClassName.TABLE_NODE_WRAPPER, ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, akEditorSmallZIndex, ClassName.SELECTED_CELL, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? '' /* Cell borders handled by ::after overlay in rounded mode. */ : "border: 1px solid ".concat(tableBorderSelectedColor, ";"), ClassName.SELECTED_CELL, tableCellSelectedColor, akEditorSmallZIndex, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.TABLE_CELL, ClassName.HOVERED_CELL_IN_DANGER, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? '' /* Cell border colors are handled by the ::after overlay in rounded mode. */ : "border-left-color: ".concat(tableBorderDeleteColor, ";\n\t\t\tborder-top-color: ").concat(tableBorderDeleteColor, ";"), tableBorderDeleteColor, akEditorUnitZIndex * 100, tableCellDeleteColor, ClassName.HOVERED_CELL, ClassName.SELECTED_CELL, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_CELL, tableBorderSelectedColor, akEditorSmallZIndex, ClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), akEditorUnitZIndex * 100, tableCellDeleteColor, ClassName.HOVERED_NO_HIGHLIGHT, ClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), akEditorUnitZIndex * 100, tableCellDeleteColor, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableOverrides() : '', ClassName.DRAG_ROW_CONTROLS_WRAPPER, tableMarginTop, tableToolbarSize + 1, ClassName.ROW_CONTROLS_WRAPPER, props.isDragAndDropEnabled ? "\n\t\t\tmargin-top: ".concat(tableMarginTop, "px;\n\t\t\ttop: 0;\n\t\t\tleft: -").concat(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(tableMarginTop - cornerControlHeight + 1, "px;\n\t\t\tmargin-top: 0;\n\t\t\tleft: -").concat(tableToolbarSize, "px;\n\t\t"), ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tableMarginTop, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tableMarginTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", nativeStickyHeaderZIndex + 1, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "\n\t\t/* Leave a 1px gap so the sticky header row's top border stays visible. */\n\t\ttranslate: 0 -1px;" : "", ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, akEditorTableNumberColumnWidth + dragRowControlsWidth, akEditorTableNumberColumnWidth + dragRowControlsWidth, tableMarginTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", nativeStickyHeaderZIndex - 1, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "".concat(akEditorTableNumberColumnWidth, "px") : "".concat(akEditorTableNumberColumnWidth - 1, "px"), expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? 'calc(100% + 2px)' : '100%', expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "-".concat(akEditorTableNumberColumnWidth + 1, "px") : "-".concat(akEditorTableNumberColumnWidth, "px"), expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? // Anchor the mask with an explicit `top` so `vertical-align` (data-valign) on the cell
|
|
76
|
+
expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? rangeSelectionStylesForRoundedTable : rangeSelectionStyles, rangeSelectionStylesForFakeBorders, viewModeSortStyles(), expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "\n\t\t.ak-editor-panel:not([data-panel-type=\"custom\"]) .".concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-blue-subtlest, #E9F2FE)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"note\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-purple-subtlest, #F8EEFE)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"tip\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-green-subtlest, #DCFFF1)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"warning\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-yellow-subtlest, #FEF7C8)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"error\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-red-subtlest, #FFECEB)", ";\n\t\t}\n\t\t.ak-editor-panel[data-panel-type=\"success\"] .").concat(ClassName.TABLE_CONTAINER, " {\n\t\t\t").concat(akEditorTableContainerBg, ": ", "var(--ds-background-accent-green-subtlest, #DCFFF1)", ";\n\t\t}\n\t") : '', expValEquals('platform_editor_table_sticky_header_improvements', 'cohort', 'test_with_overflow') && tableAnchorStyles, ClassName.TABLE_NODE_WRAPPER, ClassName.TABLE_CELL, ClassName.TABLE_HEADER_CELL, ClassName.TABLE_CELL, tableCellBackgroundColor, tableBorderColor, tableBorderColor, ClassName.CONTROLS_FLOATING_BUTTON_COLUMN, insertColumnButtonWrapper(), ClassName.CONTROLS_FLOATING_BUTTON_ROW, insertRowButtonWrapper(), dragInsertButtonWrapper(), dragCornerControlButton(), DeleteButton(), ClassName.TABLE_STICKY, props.isDragAndDropEnabled ? ClassName.DRAG_ROW_CONTROLS_WRAPPER : ClassName.ROW_CONTROLS_WRAPPER, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, stickyRowOffsetTop, akEditorTableNumberColumnWidth, akEditorStickyHeaderZIndex, stickyRowOffsetTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "\n\t\t\twidth: ".concat(akEditorTableNumberColumnWidth + 1, "px;\n\t\t\tborder-left: 1px solid ").concat(tableBorderColor, ";\n\n\t\t\t/* Keep the new fixed left border in sync with the selected/danger states,\n\t\t\t which would otherwise leave it the default colour (.active recolours the\n\t\t\t rest of the border) or drop it entirely (delete-hover sets border-left: 0). */\n\t\t\t&.active {\n\t\t\t\tborder-left-color: ").concat(tableBorderSelectedColor, ";\n\t\t\t}\n\t\t\t&.").concat(ClassName.HOVERED_CELL_IN_DANGER, " {\n\t\t\t\tborder-left: 1px solid ").concat(tableBorderDeleteColor, ";\n\t\t\t}\n\t\t\t") : '', ClassName.TABLE_STICKY, ClassName.CORNER_CONTROLS, akEditorSmallZIndex, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", tableToolbarSize, tableToolbarSize, ClassName.CORNER_CONTROLS, ClassName.CONTROLS_CORNER_BUTTON, tableToolbarSize, tableToolbarSize, tableStickyHeaderColumnControlsDecorationsStyle(), tableStickyHeaderFirefoxFixStyle(), ClassName.TABLE_STICKY, ClassName.ROW_CONTROLS, ClassName.ROW_CONTROLS_BUTTON_WRAP, akEditorStickyHeaderZIndex, tableToolbarSize, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", tableToolbarSize, ClassName.TABLE_STICKY, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", stickyRowOffsetTop, akEditorTableCellOnStickyHeaderZIndex - 5, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", "var(--ds-shadow-overflow-perimeter, #1E1F211f)", ClassName.NESTED_TABLE_WITH_CONTROLS, ClassName.NESTED_TABLE_WITH_CONTROLS, stickyHeaderBorderBottomWidth, tableBorderColor, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY, ClassName.TABLE_STICKY, insertColumnButtonOffset + 1, ClassName.TABLE_CONTAINER, ClassName.TABLE_STICKY, DRAG_HANDLE_WIDTH, "var(--ds-space-150, 12px)", "var(--ds-space-400, 32px)", "var(--ds-space-200, 16px)", "var(--ds-space-300, 24px)", "var(--ds-space-400, 32px)", "var(--ds-space-200, 16px)", "var(--ds-space-300, 24px)", DRAG_HANDLE_WIDTH, "var(--ds-space-150, 12px)", expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", rowControlsZIndex + 5, fg('platform_editor_col_insert_patch_1') ? // Shift the mask left by the numbered column width so it sits to the left of it.
|
|
77
|
+
".".concat(ClassName.TABLE_CONTAINER, ".").concat(ClassName.TABLE_STICKY, "[data-number-column='true']:has(tr.sticky)::before {\n\t\ttransform: translateX(calc(-1 * (").concat(DRAG_HANDLE_WIDTH, "px + ", "var(--ds-space-150, 12px)", " + ").concat(akEditorTableNumberColumnWidth, "px)));\n\t}") : "", ClassName.TABLE_STICKY, ClassName.TABLE_CONTAINER, ClassName.TABLE_STICKY, ClassName.WITH_RESIZE_LINE, ClassName.WITH_RESIZE_LINE, ClassName.RESIZE_HANDLE_DECORATION, (resizeHandlerAreaWidth - resizeLineWidth) / 2 + 1, ClassName.WITH_RESIZE_LINE, ClassName.SELECTED_CELL, ClassName.WITH_RESIZE_LINE, ClassName.SELECTED_CELL, ClassName.RESIZE_HANDLE_DECORATION, (resizeHandlerAreaWidth - resizeLineWidth) / 2, ClassName.HOVERED_CELL, ClassName.SELECTED_CELL, ClassName.NATIVE_STICKY, tableMarginTop, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? akEditorSmallZIndex : "calc(".concat(akEditorTableCellOnStickyHeaderZIndex, " - 5)"), tableBorderColor, tableBorderColor, ClassName.NATIVE_STICKY_ACTIVE, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "z-index: ".concat(nativeStickyHeaderZIndex, ";") : '', tableBorderColor, tableBorderColor, "var(--ds-shadow-overflow-perimeter, #1E1F211f)", ClassName.TABLE_HEADER_CELL, tableBorderColor, tableBorderColor, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY, tableMarginTop, tableMarginTop, stickyRowZIndex, ClassName.TABLE_NODE_WRAPPER, ClassName.NATIVE_STICKY_ACTIVE, tableMarginTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.DRAG_ROW_CONTROLS, tableColumnControlsHeight, aboveNativeStickyHeaderZIndex, expValEquals('platform_editor_table_sticky_header_patch_12', 'isEnabled', true) ? "\n\t\t\t.".concat(ClassName.TABLE_CONTAINER, ":has(> .").concat(ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ")\n\t\t\t\t> .").concat(ClassName.DRAG_ROW_CONTROLS_WRAPPER, " {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\t") : "\n\t\t\t.".concat(ClassName.DRAG_ROW_CONTROLS_WRAPPER, ":has(~ .").concat(ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ") {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t"), ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.DRAG_ROW_CONTROLS, belowNativeStickyHeaderZIndex, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.NATIVE_STICKY, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.NUMBERED_COLUMN, tableColumnControlsHeight, ClassName.NATIVE_STICKY, akEditorTableNumberColumnWidth, akEditorTableNumberColumnWidth, ClassName.TABLE_CONTAINER, ClassName.WITH_CONTROLS, ClassName.DRAG_ROW_FLOATING_DRAG_HANDLE, ClassName.WITH_CONTROLS, ClassName.NATIVE_STICKY, tableMarginTop, ClassName.WITH_CONTROLS, tableControlsSpacing, ClassName.WITH_CONTROLS, ClassName.TABLE_STICKY, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, tableControlsSpacing, ClassName.CORNER_CONTROLS, tableControlsSpacing - tableToolbarSize, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", sentinelStyles, stickyScrollbarStyles, tablePadding, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.ROW_CONTROLS_WRAPPER, tablePadding, ClassName.DRAG_ROW_CONTROLS_WRAPPER, ClassName.TABLE_CHROMELESS, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tablePadding, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, ClassName.TABLE_CHROMELESS, ClassName.TABLE_CONTAINER, akEditorTableNumberColumnWidth + tablePadding - 1, TableSharedCssClassName.TABLE_LEFT_BORDER, TableSharedCssClassName.TABLE_RIGHT_BORDER, ClassName.NODEVIEW_WRAPPER, breakoutWidthStyling(), columnControlsDecoration(), rowControlsWrapperDotStyle(), ClassName.CORNER_CONTROLS, tableToolbarSize + 1, cornerControlHeight, ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, InsertMarker("\n left: -11px;\n top: 9px;\n "), ClassName.CORNER_CONTROLS, ClassName.CORNER_CONTROLS_INSERT_ROW_MARKER, ClassName.CONTROLS_CORNER_BUTTON, tableToolbarSize + 1, tableToolbarSize + 1, tableBorderColor, tableBorderRadiusSize, tableHeaderCellBackgroundColor, ClassName.CONTROLS_CORNER_BUTTON, tableBorderSelectedColor, tableToolbarSelectedColor, ClassName.TABLE_CONTAINER, ClassName.CORNER_CONTROLS, ClassName.CONTROLS_CORNER_BUTTON, akEditorTableToolbarSize + akEditorTableNumberColumnWidth + 1, ClassName.ROW_CONTROLS, ClassName.CONTROLS_BUTTON, ClassName.IS_RESIZING, ClassName.CONTROLS_CORNER_BUTTON, tableBorderSelectedColor, tableToolbarSelectedColor, ClassName.IS_RESIZING, ClassName.CONTROLS_CORNER_BUTTON, ClassName.HOVERED_CELL_IN_DANGER, tableBorderDeleteColor, tableToolbarDeleteColor, ClassName.ROW_CONTROLS, tableToolbarSize, InsertMarker("\n bottom: -1px;\n left: -11px;\n "), ClassName.ROW_CONTROLS_INNER, ClassName.ROW_CONTROLS_BUTTON_WRAP, tableBorderRadiusSize, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.ROW_CONTROLS_BUTTON_WRAP, ClassName.CONTROLS_BUTTON, akEditorUnitZIndex, HeaderButton("\n border-bottom: 1px solid ".concat(tableBorderColor, ";\n border-right: 0px;\n border-radius: 0;\n height: 100%;\n width: ").concat(tableToolbarSize, "px;\n\n .").concat(ClassName.CONTROLS_BUTTON_OVERLAY, " {\n position: absolute;\n width: 30px;\n height: 50%;\n right: 0;\n bottom: 0;\n }\n .").concat(ClassName.CONTROLS_BUTTON_OVERLAY, ":first-of-type {\n top: 0;\n }\n ")), ClassName.DRAG_ROW_CONTROLS, rowControlsZIndex + 4, ClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER, ClassName.DRAG_ROW_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #DDDEE1)", ClassName.DRAG_COLUMN_CONTROLS, ClassName.DRAG_COLUMN_CONTROLS_INNER, tableColumnControlsHeight, "var(--ds-space-negative-150, -12px)", resizeHandlerZIndex, ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT_WRAPPER, tableColumnControlsHeight, ClassName.DRAG_COLUMN_FLOATING_INSERT_DOT, "var(--ds-background-accent-gray-subtler, #DDDEE1)", ClassName.DRAG_HANDLE_BUTTON_CLICKABLE_ZONE, ClassName.DRAG_HANDLE_BUTTON_CONTAINER, "var(--ds-surface, #FFFFFF)", ClassName.DRAG_HANDLE_DISABLED, ClassName.DRAG_HANDLE_MINIMISED, "var(--ds-background-accent-gray-subtler, #DDDEE1)", "var(--ds-background-accent-gray-subtlest, #F0F1F2)", "var(--ds-icon-disabled, #080F214A)", ClassName.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)", floatingColumnControls(), ClassName.IS_RESIZING, ClassName.ROW_CONTROLS, HeaderButtonHover(), HeaderButtonDanger(), ClassName.NUMBERED_COLUMN, akEditorTableToolbarSize, props.isDragAndDropEnabled ? 0 : akEditorTableToolbarSize, akEditorTableNumberColumnWidth + 1, ClassName.NUMBERED_COLUMN_BUTTON, tableBorderColor, relativeSizeToBaseFontSize(10), relativeSizeToBaseFontSize(14), tableHeaderCellBackgroundColor, tableTextColor, tableBorderColor, tableBorderColor, ClassName.TABLE_STICKY, props.isDragAndDropEnabled ? ClassName.DRAG_ROW_CONTROLS_WRAPPER : ClassName.ROW_CONTROLS_WRAPPER, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, "var(--ds-surface, #FFFFFF)", ClassName.WITH_CONTROLS, ClassName.CORNER_CONTROLS, ClassName.ROW_CONTROLS, ClassName.NUMBERED_COLUMN, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON, numberedColumnButtonSelectedStyles, ClassName.TABLE_CONTAINER, ClassName.NUMBERED_COLUMN_BUTTON, tableBorderColor, editorExperiment('platform_editor_block_menu', true) ? "/* Apply numbered column styling when table is selected via text selection (e.g., block menu) */\n\t.".concat(akEditorSelectedNodeClassName, " {\n\t\t.").concat(ClassName.NUMBERED_COLUMN, " {\n\t\t\t.").concat(ClassName.NUMBERED_COLUMN_BUTTON, " {\n\t\t\t\t").concat(numberedColumnButtonSelectedStyles, "\n\t\t\t\t").concat(hideNativeBrowserTextSelectionStyles, "\n\t\t\t}\n\t\t}\n\t}") : '', ClassName.IS_RESIZING, ClassName.WITH_CONTROLS, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.NUMBERED_COLUMN_BUTTON_DISABLED, numberedColumnButtonSelectedStyles, ClassName.NUMBERED_COLUMN_BUTTON, ClassName.HOVERED_CELL_IN_DANGER, tableToolbarDeleteColor, tableBorderDeleteColor, "var(--ds-text-danger, #AE2E24)", akEditorUnitZIndex, editorExperiment('platform_editor_block_menu', true) ? ".tableView-content-wrap.danger {\n\t\t:not(.".concat(ClassName.IS_RESIZING, ") .").concat(ClassName.WITH_CONTROLS, " {\n\t\t\t.").concat(ClassName.NUMBERED_COLUMN_BUTTON, " {\n\t\t\t\tbackground-color: ").concat(tableToolbarDeleteColor, ";\n\t\t\t\tborder: 1px solid ").concat(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(akEditorUnitZIndex, ";\n\t\t\t}\n\t\t}\n\t}") : '', ClassName.TABLE_NODE_WRAPPER, ClassName.COLUMN_CONTROLS_DECORATIONS, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, akEditorSmallZIndex, ClassName.SELECTED_CELL, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? '' /* Cell borders handled by ::after overlay in rounded mode. */ : "border: 1px solid ".concat(tableBorderSelectedColor, ";"), ClassName.SELECTED_CELL, tableCellSelectedColor, akEditorSmallZIndex, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.TABLE_CELL, ClassName.HOVERED_CELL_IN_DANGER, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? '' /* Cell border colors are handled by the ::after overlay in rounded mode. */ : "border-left-color: ".concat(tableBorderDeleteColor, ";\n\t\t\tborder-top-color: ").concat(tableBorderDeleteColor, ";"), tableBorderDeleteColor, akEditorUnitZIndex * 100, tableCellDeleteColor, ClassName.HOVERED_CELL, ClassName.SELECTED_CELL, ClassName.TABLE_HEADER_CELL, ClassName.SELECTED_CELL, ClassName.TABLE_HEADER_CELL, ClassName.HOVERED_CELL, tableBorderSelectedColor, akEditorSmallZIndex, ClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), akEditorUnitZIndex * 100, tableCellDeleteColor, ClassName.HOVERED_NO_HIGHLIGHT, ClassName.HOVERED_CELL_IN_DANGER, tableBorderStyles(), akEditorUnitZIndex * 100, tableCellDeleteColor, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableOverrides() : '', ClassName.DRAG_ROW_CONTROLS_WRAPPER, tableMarginTop, tableToolbarSize + 1, ClassName.ROW_CONTROLS_WRAPPER, props.isDragAndDropEnabled ? "\n\t\t\tmargin-top: ".concat(tableMarginTop, "px;\n\t\t\ttop: 0;\n\t\t\tleft: -").concat(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(tableMarginTop - cornerControlHeight + 1, "px;\n\t\t\tmargin-top: 0;\n\t\t\tleft: -").concat(tableToolbarSize, "px;\n\t\t"), ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tableMarginTop, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, tableMarginTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", nativeStickyHeaderZIndex + 1, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "\n\t\t/* Leave a 1px gap so the sticky header row's top border stays visible. */\n\t\ttranslate: 0 -1px;" : "", ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.DRAG_COLUMN_CONTROLS_WRAPPER, akEditorTableNumberColumnWidth + dragRowControlsWidth, akEditorTableNumberColumnWidth + dragRowControlsWidth, tableMarginTop, expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? "var(".concat(akEditorTableContainerBg, ", ", "var(--ds-surface, #FFFFFF)", ")") : "var(--ds-surface, #FFFFFF)", nativeStickyHeaderZIndex - 1, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "".concat(akEditorTableNumberColumnWidth, "px") : "".concat(akEditorTableNumberColumnWidth - 1, "px"), expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? 'calc(100% + 2px)' : '100%', expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "-".concat(akEditorTableNumberColumnWidth + 1, "px") : "-".concat(akEditorTableNumberColumnWidth, "px"), expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? // Anchor the mask with an explicit `top` so `vertical-align` (data-valign) on the cell
|
|
83
78
|
// doesn't shift it; the calc reproduces the previous top-aligned offset.
|
|
84
79
|
"top: calc(".concat("var(--ds-space-100, 8px)", " - ", stickyRowOffsetTop + 1, "px);") : "margin-top: -".concat(stickyRowOffsetTop, "px;"), expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? 'none' : "0.5px solid ".concat(tableBorderColor), expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "1px solid ".concat(tableBorderColor) : 'none', expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "border-bottom: 1px solid ".concat(tableBorderColor, ";") : "", "var(--ds-background-accent-gray-subtlest, #F0F1F2)", tableBorderColor, ClassName.TABLE_CONTAINER, ClassName.TABLE_SELECTED, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, tableBorderSelectedColor, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "border-bottom-color: ".concat(tableBorderSelectedColor, ";") : '', tableBorderSelectedColor, tableHeaderCellSelectedColor, ClassName.TABLE_CONTAINER, ClassName.TABLE_SELECTED, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.SELECTED_CELL, ClassName.HOVERED_CELL_IN_DANGER, ClassName.COLUMN_SELECTED, tableBorderSelectedColor, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? "border-bottom-color: ".concat(tableBorderSelectedColor) : '', tableBorderSelectedColor, tableHeaderCellSelectedColor, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.HOVERED_CELL_IN_DANGER, ClassName.TABLE_CONTAINER, ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW, ClassName.HOVERED_CELL_IN_DANGER, ClassName.COLUMN_SELECTED, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? // Recolour the corner edges to the delete border and composite the translucent danger
|
|
85
80
|
// fill over the mask's gray so it matches the adjacent cells instead of reading as transparent.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-table",
|
|
3
|
-
"version": "27.0
|
|
3
|
+
"version": "27.1.0",
|
|
4
4
|
"description": "Table plugin for the @atlaskit/editor",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@atlaskit/adf-schema": "^57.0.0",
|
|
24
|
-
"@atlaskit/button": "^25.
|
|
24
|
+
"@atlaskit/button": "^25.2.0",
|
|
25
25
|
"@atlaskit/custom-steps": "^1.0.0",
|
|
26
26
|
"@atlaskit/editor-palette": "^3.4.0",
|
|
27
27
|
"@atlaskit/editor-plugin-accessibility-utils": "^15.0.0",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"@atlaskit/editor-plugin-batch-attribute-updates": "^15.0.0",
|
|
30
30
|
"@atlaskit/editor-plugin-content-insertion": "^15.0.0",
|
|
31
31
|
"@atlaskit/editor-plugin-editor-viewmode": "^17.0.0",
|
|
32
|
-
"@atlaskit/editor-plugin-extension": "18.0.
|
|
32
|
+
"@atlaskit/editor-plugin-extension": "18.0.11",
|
|
33
33
|
"@atlaskit/editor-plugin-guideline": "^15.0.0",
|
|
34
34
|
"@atlaskit/editor-plugin-interaction": "^26.0.0",
|
|
35
35
|
"@atlaskit/editor-plugin-limited-mode": "^12.0.0",
|
|
@@ -41,22 +41,22 @@
|
|
|
41
41
|
"@atlaskit/editor-prosemirror": "^8.0.0",
|
|
42
42
|
"@atlaskit/editor-shared-styles": "^4.0.0",
|
|
43
43
|
"@atlaskit/editor-tables": "^3.0.0",
|
|
44
|
-
"@atlaskit/editor-toolbar": "^2.
|
|
44
|
+
"@atlaskit/editor-toolbar": "^2.6.0",
|
|
45
45
|
"@atlaskit/editor-ui-control-model": "^2.7.0",
|
|
46
|
-
"@atlaskit/icon": "^37.
|
|
47
|
-
"@atlaskit/icon-lab": "^7.
|
|
46
|
+
"@atlaskit/icon": "^37.5.0",
|
|
47
|
+
"@atlaskit/icon-lab": "^7.7.0",
|
|
48
48
|
"@atlaskit/insm": "^2.0.0",
|
|
49
|
-
"@atlaskit/menu": "^10.
|
|
49
|
+
"@atlaskit/menu": "^10.1.0",
|
|
50
50
|
"@atlaskit/platform-feature-experiments": "^0.3.0",
|
|
51
51
|
"@atlaskit/platform-feature-flags": "^2.1.0",
|
|
52
52
|
"@atlaskit/pragmatic-drag-and-drop": "^3.0.0",
|
|
53
53
|
"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^3.1.0",
|
|
54
54
|
"@atlaskit/pragmatic-drag-and-drop-hitbox": "^2.1.0",
|
|
55
|
-
"@atlaskit/primitives": "^22.
|
|
56
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
57
|
-
"@atlaskit/toggle": "^17.
|
|
58
|
-
"@atlaskit/tokens": "^16.
|
|
59
|
-
"@atlaskit/tooltip": "^24.
|
|
55
|
+
"@atlaskit/primitives": "^22.4.0",
|
|
56
|
+
"@atlaskit/tmp-editor-statsig": "^157.0.0",
|
|
57
|
+
"@atlaskit/toggle": "^17.2.0",
|
|
58
|
+
"@atlaskit/tokens": "^16.8.0",
|
|
59
|
+
"@atlaskit/tooltip": "^24.2.0",
|
|
60
60
|
"@babel/runtime": "^7.0.0",
|
|
61
61
|
"@compiled/react": "^1.0.2",
|
|
62
62
|
"@emotion/react": "^11.7.1",
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
"uuid": "^3.1.0"
|
|
69
69
|
},
|
|
70
70
|
"peerDependencies": {
|
|
71
|
-
"@atlaskit/editor-common": "^119.
|
|
71
|
+
"@atlaskit/editor-common": "^119.13.0",
|
|
72
72
|
"react": "^18.2.0 || ^19.2.0",
|
|
73
73
|
"react-dom": "^18.2.0 || ^19.2.0",
|
|
74
74
|
"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
|