@atlaskit/editor-plugin-table 38.0.5 → 38.0.7

package/dist/cjs/ui/ui-styles.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.rowControlsWrapperDotStyle = exports.resizeHandle = exports.insertRowButtonWrapper = exports.insertLine = exports.insertColumnButtonWrapper = exports.hoveredWarningCell = exports.hoveredDeleteButton = exports.hoveredCell = exports.floatingColumnControls = exports.dragInsertButtonWrapper = exports.dragCornerControlButton = exports.columnControlsLineMarker = exports.columnControlsDecoration = exports.InsertMarker = exports.HeaderButtonHover = exports.HeaderButtonDanger = exports.HeaderButton = exports.DeleteButton = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("@emotion/react");
-var _styles = require("@atlaskit/editor-common/styles");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _table = require("@atlaskit/editor-common/styles/table");
+var _constants = require("@atlaskit/editor-shared-styles/constants");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _types = require("../types");
 var _consts = require("./consts");
@@ -17,7 +17,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 /* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs mahual remediation */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var InsertLine = function InsertLine(cssString) {
-  return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tbackground: ", ";\n\t\tdisplay: none;\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\t\t", "\n\t}\n"])), _types.TableCssClassName.CONTROLS_INSERT_LINE, _consts.tableBorderSelectedColor, _editorSharedStyles.akEditorUnitZIndex, cssString);
+  return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tbackground: ", ";\n\t\tdisplay: none;\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\t\t", "\n\t}\n"])), _types.TableCssClassName.CONTROLS_INSERT_LINE, _consts.tableBorderSelectedColor, _constants.akEditorUnitZIndex, cssString);
 };
 var Marker = function Marker() {
   return (0, _react.css)({
@@ -48,22 +48,22 @@ var HeaderButtonHover = exports.HeaderButtonHover = function HeaderButtonHover()
   return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t.", ":hover {\n\t\tcolor: ", ";\n\t\tbackground-color: ", ";\n\t\tborder-color: ", ";\n\t\tcursor: pointer;\n\t}\n"])), _types.TableCssClassName.CONTROLS_BUTTON, "var(--ds-icon-inverse, #FFFFFF)", _consts.tableToolbarSelectedColor, _consts.tableBorderSelectedColor);
 };
 var HeaderButtonDanger = exports.HeaderButtonDanger = function HeaderButtonDanger() {
-  return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " .", " {\n\t\tbackground-color: ", ";\n\t\tborder-color: ", ";\n\t\tposition: relative;\n\t\tz-index: ", ";\n\t}\n"])), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.CONTROLS_BUTTON, _consts.tableToolbarDeleteColor, _consts.tableBorderDeleteColor, _editorSharedStyles.akEditorUnitZIndex);
+  return (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " .", " {\n\t\tbackground-color: ", ";\n\t\tborder-color: ", ";\n\t\tposition: relative;\n\t\tz-index: ", ";\n\t}\n"])), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.CONTROLS_BUTTON, _consts.tableToolbarDeleteColor, _consts.tableBorderDeleteColor, _constants.akEditorUnitZIndex);
 };
 var InsertButton = function InsertButton() {
-  return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\t\tbottom: 0;\n\t}\n\t.", ", .", " {\n\t\theight: ", "px;\n\t\twidth: ", "px;\n\t}\n\t.", " {\n\t\t", "\n\t}\n\t.", " {\n\t\tdisplay: none;\n\t}\n\t&:hover .", " {\n\t\tdisplay: flex;\n\t}\n"])), _types.TableCssClassName.CONTROLS_INSERT_BUTTON_INNER, _editorSharedStyles.akEditorUnitZIndex + 10, _types.TableCssClassName.CONTROLS_INSERT_BUTTON_INNER, _types.TableCssClassName.CONTROLS_INSERT_BUTTON, _consts.tableInsertColumnButtonSize, _consts.tableInsertColumnButtonSize, _types.TableCssClassName.CONTROLS_INSERT_BUTTON, Button("\n      background: ".concat("var(--ds-surface-overlay, #FFFFFF)", ";\n      box-shadow: ", "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)", ";\n      color: ", "var(--ds-icon, #292A2E)", ";\n    ")), _types.TableCssClassName.CONTROLS_INSERT_LINE, _types.TableCssClassName.CONTROLS_INSERT_LINE);
+  return (0, _react.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\t\tbottom: 0;\n\t}\n\t.", ", .", " {\n\t\theight: ", "px;\n\t\twidth: ", "px;\n\t}\n\t.", " {\n\t\t", "\n\t}\n\t.", " {\n\t\tdisplay: none;\n\t}\n\t&:hover .", " {\n\t\tdisplay: flex;\n\t}\n"])), _types.TableCssClassName.CONTROLS_INSERT_BUTTON_INNER, _constants.akEditorUnitZIndex + 10, _types.TableCssClassName.CONTROLS_INSERT_BUTTON_INNER, _types.TableCssClassName.CONTROLS_INSERT_BUTTON, _consts.tableInsertColumnButtonSize, _consts.tableInsertColumnButtonSize, _types.TableCssClassName.CONTROLS_INSERT_BUTTON, Button("\n      background: ".concat("var(--ds-surface-overlay, #FFFFFF)", ";\n      box-shadow: ", "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)", ";\n      color: ", "var(--ds-icon, #292A2E)", ";\n    ")), _types.TableCssClassName.CONTROLS_INSERT_LINE, _types.TableCssClassName.CONTROLS_INSERT_LINE);
 };
 var InsertButtonHover = function InsertButtonHover() {
   return (0, _react.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n\t.", ":hover {\n\t\tbackground: ", ";\n\t\tcolor: ", ";\n\t\tcursor: pointer;\n\t}\n"])), _types.TableCssClassName.CONTROLS_INSERT_BUTTON, "var(--ds-background-brand-bold, #1868DB)", "var(--ds-icon-inverse, #FFFFFF)");
 };
 var dragInsertButtonWrapper = exports.dragInsertButtonWrapper = function dragInsertButtonWrapper() {
-  return (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\t}\n\n\t.", " {\n\t\tbottom: -3px;\n\t\tleft: 2px;\n\t}\n\n\t.", " {\n\t\tleft: -3px;\n\t\tbottom: -2px;\n\t}\n\t.", " {\n\t\tleft: 6px;\n\t\tbottom: -2px;\n\t}\n\n\t.", " {\n\t\t", "\n\t}\n\n\t.", ":hover {\n\t\tbackground: ", ";\n\t\tborder: 1px solid ", ";\n\t\tcolor: ", ";\n\t\tcursor: pointer;\n\t}\n"])), _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER, _editorSharedStyles.akEditorUnitZIndex + 10, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER_COLUMN, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER_ROW, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER_ROW_CHROMELESS, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON, Button("\n    background: ".concat("var(--ds-surface-overlay, #FFFFFF)", ";\n    color: ", "var(--ds-icon, #292A2E)", ";\n    border: 1px solid ", "var(--ds-background-accent-gray-subtler, #DDDEE1)", ";\n    border-radius: 50%;\n    height: ", _consts.dragTableInsertColumnButtonSize, "px;\n    width: ").concat(_consts.dragTableInsertColumnButtonSize, "px;\n  ")), _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON, "var(--ds-background-brand-bold, #1868DB)", "var(--ds-background-brand-bold, #1868DB)", "var(--ds-icon-inverse, #FFFFFF)");
+  return (0, _react.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\t}\n\n\t.", " {\n\t\tbottom: -3px;\n\t\tleft: 2px;\n\t}\n\n\t.", " {\n\t\tleft: -3px;\n\t\tbottom: -2px;\n\t}\n\t.", " {\n\t\tleft: 6px;\n\t\tbottom: -2px;\n\t}\n\n\t.", " {\n\t\t", "\n\t}\n\n\t.", ":hover {\n\t\tbackground: ", ";\n\t\tborder: 1px solid ", ";\n\t\tcolor: ", ";\n\t\tcursor: pointer;\n\t}\n"])), _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER, _constants.akEditorUnitZIndex + 10, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER_COLUMN, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER_ROW, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON_INNER_ROW_CHROMELESS, _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON, Button("\n    background: ".concat("var(--ds-surface-overlay, #FFFFFF)", ";\n    color: ", "var(--ds-icon, #292A2E)", ";\n    border: 1px solid ", "var(--ds-background-accent-gray-subtler, #DDDEE1)", ";\n    border-radius: 50%;\n    height: ", _consts.dragTableInsertColumnButtonSize, "px;\n    width: ").concat(_consts.dragTableInsertColumnButtonSize, "px;\n  ")), _types.TableCssClassName.DRAG_CONTROLS_INSERT_BUTTON, "var(--ds-background-brand-bold, #1868DB)", "var(--ds-background-brand-bold, #1868DB)", "var(--ds-icon-inverse, #FFFFFF)");
 };
 
 // Explicit pixel values required here to ensure corner button aligns correctly
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
 var dragCornerControlButton = exports.dragCornerControlButton = function dragCornerControlButton() {
-  return (0, _react.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\twidth: 15px;\n\t\theight: 15px;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tposition: absolute;\n\t\ttop: -17px;\n\t\tleft: -5px;\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tpadding: 0;\n\t\toutline: none;\n\t\tz-index: ", ";\n\n\t\t&.active .", " {\n\t\t\tbackground-color: ", ";\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t\tborder-width: 2px;\n\t\t\tborder-radius: 4px;\n\n\t\t\ttop: 3px;\n\t\t\tleft: 2px;\n\t\t}\n\n\t\t&:hover {\n\t\t\tcursor: pointer;\n\n\t\t\t.", " {\n\t\t\t\twidth: 10px;\n\t\t\t\theight: 10px;\n\t\t\t\tborder-radius: 4px;\n\t\t\t\ttop: 3px;\n\t\t\t\tleft: 2px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\tborder: 1px solid ", ";\n\t\tbackground-color: ", ";\n\t\tborder-radius: 2px;\n\t\twidth: 5px;\n\t\theight: 5px;\n\t\tposition: relative;\n\t}\n"])), _types.TableCssClassName.DRAG_CORNER_BUTTON, _editorSharedStyles.akEditorUnitZIndex * 99, _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, "var(--ds-border-selected, #1868DB)", _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, "var(--ds-border-inverse, #FFFFFF)", "var(--ds-background-accent-gray-subtler, #DDDEE1)");
+  return (0, _react.css)(_templateObject0 || (_templateObject0 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\twidth: 15px;\n\t\theight: 15px;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tposition: absolute;\n\t\ttop: -17px;\n\t\tleft: -5px;\n\t\tbackground-color: transparent;\n\t\tborder: none;\n\t\tpadding: 0;\n\t\toutline: none;\n\t\tz-index: ", ";\n\n\t\t&.active .", " {\n\t\t\tbackground-color: ", ";\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t\tborder-width: 2px;\n\t\t\tborder-radius: 4px;\n\n\t\t\ttop: 3px;\n\t\t\tleft: 2px;\n\t\t}\n\n\t\t&:hover {\n\t\t\tcursor: pointer;\n\n\t\t\t.", " {\n\t\t\t\twidth: 10px;\n\t\t\t\theight: 10px;\n\t\t\t\tborder-radius: 4px;\n\t\t\t\ttop: 3px;\n\t\t\t\tleft: 2px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.", " {\n\t\tborder: 1px solid ", ";\n\t\tbackground-color: ", ";\n\t\tborder-radius: 2px;\n\t\twidth: 5px;\n\t\theight: 5px;\n\t\tposition: relative;\n\t}\n"])), _types.TableCssClassName.DRAG_CORNER_BUTTON, _constants.akEditorUnitZIndex * 99, _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, "var(--ds-border-selected, #1868DB)", _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, _types.TableCssClassName.DRAG_CORNER_BUTTON_INNER, "var(--ds-border-inverse, #FFFFFF)", "var(--ds-background-accent-gray-subtler, #DDDEE1)");
 };
 var insertColumnButtonWrapper = exports.insertColumnButtonWrapper = function insertColumnButtonWrapper() {
   return (0, _react.css)(
@@ -122,10 +122,10 @@ var floatingColumnControls = exports.floatingColumnControls = function floatingC
   return (0, _react.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", " {\n\t\t\tbox-sizing: border-box;\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\n\t\t\t.", " {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: row;\n\t\t\t}\n\t\t}\n\n\t\t.", " {\n\t\t\tbox-sizing: border-box;\n\n\t\t\t.", " {\n\t\t\t\tdisplay: grid;\n\t\t\t\tjustify-items: center;\n\t\t\t}\n\t\t}\n\t"])), _types.TableCssClassName.DRAG_COLUMN_DROP_TARGET_CONTROLS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER, _types.TableCssClassName.DRAG_COLUMN_CONTROLS, _types.TableCssClassName.DRAG_COLUMN_CONTROLS_INNER);
 };
 var rowControlsWrapperDotStyle = exports.rowControlsWrapperDotStyle = function rowControlsWrapperDotStyle() {
-  return (0, _react.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n\t\t/* override for DnD controls */\n\t\tdiv.", ">.", "::after {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tdiv.", ">.", "::after {\n\t\t\tcontent: ' ';\n\t\t\tbackground-color: ", ";\n\t\t\tposition: absolute;\n\t\t\theight: ", "px;\n\t\t\twidth: ", "px;\n\t\t\tborder-radius: 50%;\n\t\t\tpointer-events: none;\n\t\t\ttop: -", "px;\n\t\t\tright: -1px;\n\t\t}\n\t"])), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts.tableBorderColor, _consts.lineMarkerSize, _consts.lineMarkerSize, _consts.tableToolbarSize + _styles.tableCellBorderWidth);
+  return (0, _react.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n\t\t/* override for DnD controls */\n\t\tdiv.", ">.", "::after {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\tdiv.", ">.", "::after {\n\t\t\tcontent: ' ';\n\t\t\tbackground-color: ", ";\n\t\t\tposition: absolute;\n\t\t\theight: ", "px;\n\t\t\twidth: ", "px;\n\t\t\tborder-radius: 50%;\n\t\t\tpointer-events: none;\n\t\t\ttop: -", "px;\n\t\t\tright: -1px;\n\t\t}\n\t"])), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.DRAG_ROW_CONTROLS_WRAPPER, _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.ROW_CONTROLS_WRAPPER, _consts.tableBorderColor, _consts.lineMarkerSize, _consts.lineMarkerSize, _consts.tableToolbarSize + _table.tableCellBorderWidth);
 };
 var columnControlsDecoration = exports.columnControlsDecoration = function columnControlsDecoration() {
-  return (0, _react.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", " {\n\t\t\tdisplay: none;\n\t\t\tcursor: pointer;\n\t\t\tposition: absolute;\n\t\t\twidth: 100%;\n\t\t\tleft: 0;\n\t\t\ttop: -", "px;\n\t\t\theight: ", "px;\n\t\t\t/* floating dot for adding column button */\n\t\t\t&::before {\n\t\t\t\tcontent: ' ';\n\t\t\t\tbackground-color: ", ";\n\t\t\t\tposition: absolute;\n\t\t\t\theight: ", "px;\n\t\t\t\twidth: ", "px;\n\t\t\t\tborder-radius: 50%;\n\t\t\t\tpointer-events: none;\n\t\t\t\ttop: 2px;\n\t\t\t\tright: ", ";\n\t\t\t}\n\n\t\t\t&::after {\n\t\t\t\tcontent: ' ';\n\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t/* floating dot for adding column button - overriding style on last column to avoid scroll */\n\t\t", "\n\n\t\t.", " .", " {\n\t\t\tdisplay: block;\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",table\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", ", &.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t}\n\n\t\t\t\t&.", " .", "::after {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tborder-color: ", ";\n\t\t\t\t\tz-index: ", ";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",table\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", ", &.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t\tborder-left: ", "px solid ", ";\n\t\t\t\t\tleft: -", "px;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t}\n\n\t\t\t\t&.", " .", "::after {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tborder-color: ", ";\n\t\t\t\t\tborder-left: ", "px solid ", ";\n\t\t\t\t\tleft: -", "px;\n\t\t\t\t\tz-index: ", ";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t.", "\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",\n\t\t\t.", "\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t.", "::after {\n\t\t\t\t", ";\n\t\t\t}\n\t\t}\n\t"])), _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.columnControlsDecorationHeight + _styles.tableCellBorderWidth, _consts.columnControlsDecorationHeight, _consts.tableBorderColor, _consts.lineMarkerSize, _consts.lineMarkerSize, "var(--ds-space-negative-025, -2px)", columnHeaderButton("\n        border-right: ".concat(_styles.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n        border-top: ").concat(_styles.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n        border-bottom: ").concat(_styles.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n        box-sizing: content-box;\n        height: ").concat(_consts.tableToolbarSize - 1, "px;\n        width: 100%;\n        position: absolute;\n        top: ").concat(_consts.columnControlsDecorationHeight - _consts.tableToolbarSize, "px;\n        left: 0px;\n        z-index: ").concat(_consts.columnControlsZIndex, ";\n      ")), getFloatingDotOverrides(), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_TABLE, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.tableToolbarDeleteColor, _consts.tableBorderDeleteColor, (0, _stickyHeaderZIndex.getTableZIndexes)().dangerOverlay, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_COLUMN, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _styles.tableCellBorderWidth, _consts.tableBorderSelectedColor, _styles.tableCellBorderWidth, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_COLUMN, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.tableToolbarDeleteColor, _consts.tableBorderDeleteColor, _styles.tableCellBorderWidth, _consts.tableBorderDeleteColor, _styles.tableCellBorderWidth, (0, _stickyHeaderZIndex.getTableZIndexes)().dangerOverlay, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected());
+  return (0, _react.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", " {\n\t\t\tdisplay: none;\n\t\t\tcursor: pointer;\n\t\t\tposition: absolute;\n\t\t\twidth: 100%;\n\t\t\tleft: 0;\n\t\t\ttop: -", "px;\n\t\t\theight: ", "px;\n\t\t\t/* floating dot for adding column button */\n\t\t\t&::before {\n\t\t\t\tcontent: ' ';\n\t\t\t\tbackground-color: ", ";\n\t\t\t\tposition: absolute;\n\t\t\t\theight: ", "px;\n\t\t\t\twidth: ", "px;\n\t\t\t\tborder-radius: 50%;\n\t\t\t\tpointer-events: none;\n\t\t\t\ttop: 2px;\n\t\t\t\tright: ", ";\n\t\t\t}\n\n\t\t\t&::after {\n\t\t\t\tcontent: ' ';\n\n\t\t\t\t", "\n\t\t\t}\n\t\t}\n\n\t\t/* floating dot for adding column button - overriding style on last column to avoid scroll */\n\t\t", "\n\n\t\t.", " .", " {\n\t\t\tdisplay: block;\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",table\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", ", &.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t}\n\n\t\t\t\t&.", " .", "::after {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tborder-color: ", ";\n\t\t\t\t\tz-index: ", ";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",table\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", ", &.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t\tborder-left: ", "px solid ", ";\n\t\t\t\t\tleft: -", "px;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t&.", " {\n\t\t\t\t.", "::after {\n\t\t\t\t\t", ";\n\t\t\t\t}\n\n\t\t\t\t&.", " .", "::after {\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tborder-color: ", ";\n\t\t\t\t\tborder-left: ", "px solid ", ";\n\t\t\t\t\tleft: -", "px;\n\t\t\t\t\tz-index: ", ";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t.", "\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\ttd.", ",\n\t\t\t.", "\n\t\t\ttable\n\t\t\ttr:first-of-type\n\t\t\tth.", " {\n\t\t\t.", "::after {\n\t\t\t\t", ";\n\t\t\t}\n\t\t}\n\t"])), _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.columnControlsDecorationHeight + _table.tableCellBorderWidth, _consts.columnControlsDecorationHeight, _consts.tableBorderColor, _consts.lineMarkerSize, _consts.lineMarkerSize, "var(--ds-space-negative-025, -2px)", columnHeaderButton("\n        border-right: ".concat(_table.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n        border-top: ").concat(_table.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n        border-bottom: ").concat(_table.tableCellBorderWidth, "px solid ").concat(_consts.tableBorderColor, ";\n        box-sizing: content-box;\n        height: ").concat(_consts.tableToolbarSize - 1, "px;\n        width: 100%;\n        position: absolute;\n        top: ").concat(_consts.columnControlsDecorationHeight - _consts.tableToolbarSize, "px;\n        left: 0px;\n        z-index: ").concat(_consts.columnControlsZIndex, ";\n      ")), getFloatingDotOverrides(), _types.TableCssClassName.WITH_CONTROLS, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_TABLE, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.tableToolbarDeleteColor, _consts.tableBorderDeleteColor, (0, _stickyHeaderZIndex.getTableZIndexes)().dangerOverlay, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_COLUMN, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _table.tableCellBorderWidth, _consts.tableBorderSelectedColor, _table.tableCellBorderWidth, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.HOVERED_COLUMN, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected(), _types.TableCssClassName.HOVERED_CELL_IN_DANGER, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, _consts.tableToolbarDeleteColor, _consts.tableBorderDeleteColor, _table.tableCellBorderWidth, _consts.tableBorderDeleteColor, _table.tableCellBorderWidth, (0, _stickyHeaderZIndex.getTableZIndexes)().dangerOverlay, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_CELL, _types.TableCssClassName.TABLE_SELECTED, _types.TableCssClassName.TABLE_HEADER_CELL, _types.TableCssClassName.COLUMN_CONTROLS_DECORATIONS, columnHeaderButtonSelected());
 };
 var hoveredDeleteButton = exports.hoveredDeleteButton = function hoveredDeleteButton() {
   return (0, _react.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n\t.", ".", " {\n\t\t.", ", .", ", .", " {\n\t\t\t", "\n\t\t}\n\t\t.", "::after {\n\t\t\tbackground: ", ";\n\t\t}\n\n\t\t.", " > table {\n\t\t\ttd.", "::after {\n\t\t\t\tbackground: ", ";\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t}\n\t\t\tth.", " {\n\t\t\t\tbackground-color: unset;\n\t\t\t}\n\t\t\tth.", "::after {\n\t\t\t\tbackground: ", ";\n\t\t\t\tborder: 1px solid ", ";\n\t\t\t}\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.HOVERED_DELETE_BUTTON, _types.TableCssClassName.SELECTED_CELL, _types.TableCssClassName.COLUMN_SELECTED, _types.TableCssClassName.HOVERED_CELL, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? '' /* Cell borders handled by ::after overlay in rounded mode. */ : "border: 1px solid ".concat(_consts.tableBorderDeleteColor, ";"), _types.TableCssClassName.SELECTED_CELL, _consts.tableCellDeleteColor, _types.TableCssClassName.TABLE_NODE_WRAPPER, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _consts.tableCellDeleteColor, _consts.tableBorderDeleteColor, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _types.TableCssClassName.HOVERED_NO_HIGHLIGHT, _consts.tableCellDeleteColor, _consts.tableBorderDeleteColor);
@@ -140,10 +140,10 @@ var hoveredWarningCell = exports.hoveredWarningCell = (0, _react.css)(_templateO
 // Explicit pixel values required here to ensure correct positioning and sizes of column resize handle
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
 var resizeLineStyles = function resizeLineStyles() {
-  return (0, _react.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n\t\tth.", "::before, td.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before,\n\t\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t/* Styles when drag and drop is disabled - will be removed */\n\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tleft: ", ";\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t\ttop: -", "px;\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tright: -1px;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t\ttop: -", "px;\n\t\t}\n\t"])), _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE_LAST_COLUMN, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _consts.tableToolbarSize + _styles.tableCellBorderWidth);
+  return (0, _react.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n\t\tth.", "::before, td.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before,\n\t\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t/* Styles when drag and drop is disabled - will be removed */\n\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tleft: ", ";\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t\ttop: -", "px;\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tposition: absolute;\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + 2px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\tth.", "::before {\n\t\t\tcontent: ' ';\n\t\t\tright: -1px;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t\tbackground-color: ", ";\n\t\t\tz-index: ", ";\n\t\t\ttop: -", "px;\n\t\t}\n\t"])), _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE_LAST_COLUMN, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE, "var(--ds-space-negative-025, -2px)", _consts.resizeLineWidth, _consts.tableToolbarSize + _table.tableCellBorderWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _consts.tableToolbarSize + _table.tableCellBorderWidth, _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _types.TableCssClassName.WITH_RESIZE_LINE_LAST_COLUMN, _consts.resizeLineWidth, _consts.tableToolbarSize + _table.tableCellBorderWidth, _consts.tableBorderSelectedColor, _consts.columnControlsZIndex * 2, _consts.tableToolbarSize + _table.tableCellBorderWidth);
 };
 var resizeHandle = exports.resizeHandle = function resizeHandle() {
-  return (0, _react.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\t.", " {\n\t\t\tbackground-color: transparent;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: 100%;\n\t\t\ttop: 0;\n\t\t\tright: -", "px;\n\t\t\tcursor: col-resize;\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\ttr\n\t\t\tth:last-child\n\t\t\t.", ",\n\t\t\ttr\n\t\t\ttd:last-child\n\t\t\t.", " {\n\t\t\tbackground-color: transparent;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: 100%;\n\t\t\ttop: 0;\n\t\t\tright: 0;\n\t\t\tcursor: col-resize;\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t", "\n\n\t\ttable\n      tr:first-of-type\n      th.", "\n      .", "::after,\n      table\n      tr:first-of-type\n      td.", "\n      .", "::after,\n\t  /* Styles when drag and drop is disabled - will be removed */\n\t\ttable\n      tr:first-of-type\n      th.", "\n      .", "::after,\n      table\n      tr:first-of-type\n      td.", "\n      .", "::after {\n\t\t\ttop: -", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth, _consts.resizeHandlerAreaWidth / 2, (0, _stickyHeaderZIndex.getTableZIndexes)().resizeHandle, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth / 2, (0, _stickyHeaderZIndex.getTableZIndexes)().resizeHandle, resizeLineStyles(), _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.tableToolbarSize + _styles.tableCellBorderWidth, _consts.tableToolbarSize + _styles.tableCellBorderWidth);
+  return (0, _react.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\t.", " {\n\t\t\tbackground-color: transparent;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: 100%;\n\t\t\ttop: 0;\n\t\t\tright: -", "px;\n\t\t\tcursor: col-resize;\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\ttr\n\t\t\tth:last-child\n\t\t\t.", ",\n\t\t\ttr\n\t\t\ttd:last-child\n\t\t\t.", " {\n\t\t\tbackground-color: transparent;\n\t\t\tposition: absolute;\n\t\t\twidth: ", "px;\n\t\t\theight: 100%;\n\t\t\ttop: 0;\n\t\t\tright: 0;\n\t\t\tcursor: col-resize;\n\t\t\tz-index: ", ";\n\t\t}\n\n\t\t", "\n\n\t\ttable\n      tr:first-of-type\n      th.", "\n      .", "::after,\n      table\n      tr:first-of-type\n      td.", "\n      .", "::after,\n\t  /* Styles when drag and drop is disabled - will be removed */\n\t\ttable\n      tr:first-of-type\n      th.", "\n      .", "::after,\n      table\n      tr:first-of-type\n      td.", "\n      .", "::after {\n\t\t\ttop: -", "px;\n\t\t\theight: calc(100% + ", "px);\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth, _consts.resizeHandlerAreaWidth / 2, (0, _stickyHeaderZIndex.getTableZIndexes)().resizeHandle, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.resizeHandlerAreaWidth / 2, (0, _stickyHeaderZIndex.getTableZIndexes)().resizeHandle, resizeLineStyles(), _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.WITH_DRAG_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _types.TableCssClassName.WITH_RESIZE_LINE, _types.TableCssClassName.RESIZE_HANDLE_DECORATION, _consts.tableToolbarSize + _table.tableCellBorderWidth, _consts.tableToolbarSize + _table.tableCellBorderWidth);
 };
 
 // Drag and Drop: drop target insert line
@@ -151,7 +151,7 @@ var tableCellColumnInsertLineStyles = (0, _react.css)({
   content: "' '",
   position: 'absolute',
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  height: "calc(100% + ".concat(_styles.tableCellBorderWidth * 2, "px)"),
+  height: "calc(100% + ".concat(_table.tableCellBorderWidth * 2, "px)"),
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   width: "".concat(_consts.insertLineWidth, "px"),
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -164,7 +164,7 @@ var tableCellRowInsertLineStyles = (0, _react.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: "".concat(_consts.insertLineWidth, "px"),
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  width: "calc(100% + ".concat(_styles.tableCellBorderWidth * 2, "px)"),
+  width: "calc(100% + ".concat(_table.tableCellBorderWidth * 2, "px)"),
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   zIndex: _consts.columnControlsZIndex * 2
 });
@@ -181,5 +181,5 @@ var insertLineInactiveColor = (0, _react.css)({
 // or column drag
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
 var insertLine = exports.insertLine = function insertLine() {
-  return (0, _react.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, _styles.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, _styles.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", insertLineActiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", insertLineInactiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", _styles.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", _styles.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, _styles.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, _styles.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor);
+  return (0, _react.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tleft: ", ";\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tright: -1px;\n\t\t\ttop: -", "px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\ttop: -1px;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\ttd.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\n\t\tth.", "::before {\n\t\t\t", "\n\t\t\tbottom: 0;\n\t\t\t", "\n\t\t}\n\t}\n"])), _types.TableCssClassName.TABLE_CONTAINER, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, _table.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_FIRST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, _table.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", insertLineActiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", insertLineInactiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", _table.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, "var(--ds-space-negative-025, -2px)", _table.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE, tableCellColumnInsertLineStyles, _table.tableCellBorderWidth, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_COLUMN_INSERT_LINE_INACTIVE, tableCellColumnInsertLineStyles, _table.tableCellBorderWidth, insertLineInactiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE, tableCellRowInsertLineStyles, insertLineActiveColor, _types.TableCssClassName.WITH_LAST_ROW_INSERT_LINE_INACTIVE, tableCellRowInsertLineStyles, insertLineInactiveColor);
 };

package/dist/es2019/nodeviews/ExternalDropTargets.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import { tableMarginTop } from '@atlaskit/editor-common/styles';
+import { tableMarginTop } from '@atlaskit/editor-common/styles/table';
 import { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/adapter/element-adapter';
 import { getColumnsWidths } from '../pm-plugins/utils/column-controls';
 import { dropTargetExtendedWidth, dropTargetsZIndex } from '../ui/consts';

package/dist/es2019/nodeviews/TableCell.js

@@ -1,6 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { getCellAttrs, getCellDomAttrs } from '@atlaskit/adf-schema/tableNodes';
-import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
+import { ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics/types/enums';
+import { TABLE_ACTION } from '@atlaskit/editor-common/analytics/types/table-events';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { getRoundedTableCellEdgeState } from './rounded-table-edges';
 import TableNodeView from './TableNodeViewBase';

package/dist/es2019/nodeviews/TableComponent.js

@@ -9,9 +9,9 @@ import { getParentOfTypeCount } from '@atlaskit/editor-common/nesting';
 import { nodeVisibilityManager } from '@atlaskit/editor-common/node-visibility';
 import { getParentNodeWidth, getTableContainerWidth } from '@atlaskit/editor-common/node-width';
 import { NodeViewContentHole } from '@atlaskit/editor-common/react-node-view';
-import { isTableInContentMode } from '@atlaskit/editor-common/table';
+import { isTableInContentMode } from '@atlaskit/editor-common/table/content-mode';
 import { isValidPosition } from '@atlaskit/editor-common/utils';
-import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
+import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles/constants';
 import { isTableSelected } from '@atlaskit/editor-tables/utils';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { fg } from '@atlaskit/platform-feature-flags/fg';

package/dist/es2019/nodeviews/TableComponentWithSharedState.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/useSharedPluginStateWithSelector';
 import { findTable } from '@atlaskit/editor-tables';
 import TableComponent from './TableComponent';
 

package/dist/es2019/nodeviews/TableContainer.js

@@ -1,11 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import classNames from 'classnames';
-import { CHANGE_ALIGNMENT_REASON, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics/types/enums';
+import { CHANGE_ALIGNMENT_REASON } from '@atlaskit/editor-common/analytics/types/table-events';
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
 import { resizerHoverZoneClassName, resizerItemClassName } from '@atlaskit/editor-common/styles/resizer';
-import { akEditorDefaultLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/useSharedPluginStateWithSelector';
+import { akEditorDefaultLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles/constants';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
 import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
 import { getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';

package/dist/es2019/nodeviews/TableResizer.js

@@ -1,19 +1,20 @@
 import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import rafSchd from 'raf-schd';
 import { useIntl } from 'react-intl';
-import { CHANGE_ALIGNMENT_REASON, INPUT_METHOD, TABLE_OVERFLOW_CHANGE_TRIGGER } from '@atlaskit/editor-common/analytics';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics/types/enums';
+import { CHANGE_ALIGNMENT_REASON, TABLE_OVERFLOW_CHANGE_TRIGGER } from '@atlaskit/editor-common/analytics/types/table-events';
 import { getBrowserInfo } from '@atlaskit/editor-common/browser';
-import { getGuidelinesWithHighlights } from '@atlaskit/editor-common/guideline';
-import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { getGuidelinesWithHighlights } from '@atlaskit/editor-common/guideline/updateGuideline';
 import { focusTableResizer, ToolTipContent } from '@atlaskit/editor-common/keymaps';
-import { tableMessages as messages } from '@atlaskit/editor-common/messages';
-import { logException } from '@atlaskit/editor-common/monitoring';
-import { ResizerNext } from '@atlaskit/editor-common/resizer';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { messages } from '@atlaskit/editor-common/messages/table';
+import { logException } from '@atlaskit/editor-common/monitoring/error';
+import ResizerNext from '@atlaskit/editor-common/resizer/Resizer';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/useSharedPluginStateSelector';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/useSharedPluginStateWithSelector';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
-import { akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
+import { akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles/constants';
 import { findTable } from '@atlaskit/editor-tables/utils';
-import { insm } from '@atlaskit/insm';
+import { insm } from '@atlaskit/insm/api';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
 import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
 import { updateWidthToWidest } from '../pm-plugins/commands/misc';

package/dist/es2019/nodeviews/TableRow.js

@@ -3,7 +3,7 @@ import debounce from 'lodash/debounce';
 import throttle from 'lodash/throttle';
 import { getParentOfTypeCount } from '@atlaskit/editor-common/nesting';
 import { nodeVisibilityManager } from '@atlaskit/editor-common/node-visibility';
-import { findOverflowScrollParent } from '@atlaskit/editor-common/ui';
+import { findOverflowScrollParent } from '@atlaskit/editor-common/Popup/utils';
 import { findParentNodeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
@@ -73,6 +73,9 @@ export default class TableRow extends TableNodeView {
         this.headerRowMouseScrollEnd();
       }
     }, HEADER_ROW_SCROLL_THROTTLE_TIMEOUT));
+    _defineProperty(this, "onWidthPluginEvent", () => this.updateStickyHeaderWidth());
+    _defineProperty(this, "onTablePluginEvent", state => this.onTablePluginState(state));
+    _defineProperty(this, "onScrollEnd", () => this.refireIntersectionObservers());
     this.isSticky = false;
     const {
       pluginConfig
@@ -194,13 +197,20 @@ export default class TableRow extends TableNodeView {
   destroy() {
     if (this.isStickyHeaderEnabled) {
       this.unsubscribe();
-      this.nodeVisibilityObserverCleanupFn && this.nodeVisibilityObserverCleanupFn();
+      if (!isExperimentEnabled('platform_editor_reduce_memory_leaks')) {
+        this.nodeVisibilityObserverCleanupFn && this.nodeVisibilityObserverCleanupFn();
+      }
       const tree = getTree(this.dom);
       if (tree) {
         this.makeRowHeaderNotSticky(tree.table, true);
       }
       this.emitOff(true);
     }
+    if (isExperimentEnabled('platform_editor_reduce_memory_leaks')) {
+      var _this$nodeVisibilityO;
+      (_this$nodeVisibilityO = this.nodeVisibilityObserverCleanupFn) === null || _this$nodeVisibilityO === void 0 ? void 0 : _this$nodeVisibilityO.call(this);
+      this.nodeVisibilityObserverCleanupFn = undefined;
+    }
     if (isExperimentEnabled('platform_editor_dynamic_limited_mode')) {
       var _this$limitedModeUnsu2;
       (_this$limitedModeUnsu2 = this.limitedModeUnsubscribe) === null || _this$limitedModeUnsu2 === void 0 ? void 0 : _this$limitedModeUnsu2.call(this);
@@ -244,21 +254,28 @@ export default class TableRow extends TableNodeView {
       this.initObservers();
       this.topPosEditorElement = getTop(this.editorScrollableElement);
     }
-    this.eventDispatcher.on('widthPlugin', this.updateStickyHeaderWidth.bind(this));
-
-    // Ignored via go/ees005
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    this.eventDispatcher.on(tablePluginKey.key, this.onTablePluginState.bind(this));
+    if (isExperimentEnabled('platform_editor_reduce_memory_leaks')) {
+      this.eventDispatcher.on('widthPlugin', this.onWidthPluginEvent);
+      // Ignored via go/ees005
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      this.eventDispatcher.on(tablePluginKey.key, this.onTablePluginEvent);
+    } else {
+      this.eventDispatcher.on('widthPlugin', this.updateStickyHeaderWidth.bind(this));
+      // Ignored via go/ees005
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      this.eventDispatcher.on(tablePluginKey.key, this.onTablePluginState.bind(this));
+    }
     this.listening = true;
+    const scrollHandler = isExperimentEnabled('platform_editor_reduce_memory_leaks') ? this.headerRowMouseScroll : this.headerRowMouseScroll.bind(this);
 
     // Ignored via go/ees005
     // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
-    this.dom.addEventListener('wheel', this.headerRowMouseScroll.bind(this), {
+    this.dom.addEventListener('wheel', scrollHandler, {
       passive: true
     });
     // Ignored via go/ees005
     // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
-    this.dom.addEventListener('touchmove', this.headerRowMouseScroll.bind(this), {
+    this.dom.addEventListener('touchmove', scrollHandler, {
       passive: true
     });
   }
@@ -279,10 +296,20 @@ export default class TableRow extends TableNodeView {
     if (this.resizeObserver) {
       this.resizeObserver.disconnect();
     }
-    this.eventDispatcher.off('widthPlugin', this.updateStickyHeaderWidth);
-    // Ignored via go/ees005
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    this.eventDispatcher.off(tablePluginKey.key, this.onTablePluginState);
+    if (isExperimentEnabled('platform_editor_reduce_memory_leaks')) {
+      var _this$editorScrollabl;
+      this.eventDispatcher.off('widthPlugin', this.onWidthPluginEvent);
+      // Ignored via go/ees005
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      this.eventDispatcher.off(tablePluginKey.key, this.onTablePluginEvent);
+      // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
+      (_this$editorScrollabl = this.editorScrollableElement) === null || _this$editorScrollabl === void 0 ? void 0 : _this$editorScrollabl.removeEventListener('scrollend', this.onScrollEnd);
+    } else {
+      this.eventDispatcher.off('widthPlugin', this.updateStickyHeaderWidth);
+      // Ignored via go/ees005
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      this.eventDispatcher.off(tablePluginKey.key, this.onTablePluginState);
+    }
     this.listening = false;
 
     // Ignored via go/ees005
@@ -396,12 +423,12 @@ export default class TableRow extends TableNodeView {
         table
       } = tree;
       entries.forEach(entry => {
-        var _this$editorScrollabl;
+        var _this$editorScrollabl2;
         // On resize of the parent scroll element we need to adjust the width
         // of the sticky header
         // Ignored via go/ees005
         // eslint-disable-next-line @atlaskit/editor/no-as-casting
-        if (entry.target.className === ((_this$editorScrollabl = this.editorScrollableElement) === null || _this$editorScrollabl === void 0 ? void 0 : _this$editorScrollabl.className)) {
+        if (entry.target.className === ((_this$editorScrollabl2 = this.editorScrollableElement) === null || _this$editorScrollabl2 === void 0 ? void 0 : _this$editorScrollabl2.className)) {
           this.updateStickyHeaderWidth();
         } else {
           const newHeight = entry.contentRect ? entry.contentRect.height :
@@ -422,11 +449,11 @@ export default class TableRow extends TableNodeView {
   }
   createIntersectionObserver() {
     this.intersectionObserver = new IntersectionObserver((entries, _) => {
-      var _this$editorScrollabl2, _this$editorScrollabl3;
+      var _this$editorScrollabl3, _this$editorScrollabl4;
       // IMPORTANT: please try and avoid using entry.rootBounds it's terribly inconsistent. For example; sometimes it may return
       // 0 height. In safari it will multiply all values by the window scale factor, however chrome & firfox won't.
       // This is why i just get the scroll view bounding rect here and use it, and fallback to the entry.rootBounds if needed.
-      const rootBounds = (_this$editorScrollabl2 = this.editorScrollableElement) === null || _this$editorScrollabl2 === void 0 ? void 0 : (_this$editorScrollabl3 = _this$editorScrollabl2.getBoundingClientRect) === null || _this$editorScrollabl3 === void 0 ? void 0 : _this$editorScrollabl3.call(_this$editorScrollabl2);
+      const rootBounds = (_this$editorScrollabl3 = this.editorScrollableElement) === null || _this$editorScrollabl3 === void 0 ? void 0 : (_this$editorScrollabl4 = _this$editorScrollabl3.getBoundingClientRect) === null || _this$editorScrollabl4 === void 0 ? void 0 : _this$editorScrollabl4.call(_this$editorScrollabl3);
       entries.forEach(entry => {
         const {
           target,
@@ -636,7 +663,7 @@ export default class TableRow extends TableNodeView {
     }
     const domTop = currentTableTop > 0 ? scrollTop : scrollTop + currentTableTop;
     if (!this.isSticky) {
-      var _this$editorScrollabl4;
+      var _this$editorScrollabl5;
       syncStickyRowToTable(table);
       this.dom.classList.add('sticky');
       table.classList.add(ClassName.TABLE_STICKY);
@@ -649,7 +676,7 @@ export default class TableRow extends TableNodeView {
        */
       // Ignored via go/ees005
       // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
-      (_this$editorScrollabl4 = this.editorScrollableElement) === null || _this$editorScrollabl4 === void 0 ? void 0 : _this$editorScrollabl4.addEventListener('scrollend', this.refireIntersectionObservers, {
+      (_this$editorScrollabl5 = this.editorScrollableElement) === null || _this$editorScrollabl5 === void 0 ? void 0 : _this$editorScrollabl5.addEventListener('scrollend', isExperimentEnabled('platform_editor_reduce_memory_leaks') ? this.onScrollEnd : this.refireIntersectionObservers, {
         passive: true,
         once: true
       });