@atlaskit/editor-plugin-table 22.4.3 → 22.4.5

package/dist/es2019/ui/common-styles.js

@@ -229,7 +229,7 @@ const roundedTableCellCornerStyles = () => css`
 
 			&::after,
 			&.${ClassName.HOVERED_CELL_IN_DANGER}::after,
-			&.${ClassName.HOVERED_NO_HIGHLIGHT}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
+				&.${ClassName.HOVERED_NO_HIGHLIGHT}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
 				border-top-left-radius: ${"var(--ds-radius-medium, 6px)"};
 			}
 		}
@@ -240,7 +240,7 @@ const roundedTableCellCornerStyles = () => css`
 
 			&::after,
 			&.${ClassName.HOVERED_CELL_IN_DANGER}::after,
-			&.${ClassName.HOVERED_NO_HIGHLIGHT}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
+				&.${ClassName.HOVERED_NO_HIGHLIGHT}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
 				border-top-right-radius: ${"var(--ds-radius-medium, 6px)"};
 			}
 		}
@@ -251,7 +251,7 @@ const roundedTableCellCornerStyles = () => css`
 
 			&::after,
 			&.${ClassName.HOVERED_CELL_IN_DANGER}::after,
-			&.${ClassName.HOVERED_NO_HIGHLIGHT}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
+				&.${ClassName.HOVERED_NO_HIGHLIGHT}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
 				border-bottom-left-radius: ${"var(--ds-radius-medium, 6px)"};
 			}
 		}
@@ -262,7 +262,7 @@ const roundedTableCellCornerStyles = () => css`
 
 			&::after,
 			&.${ClassName.HOVERED_CELL_IN_DANGER}::after,
-			&.${ClassName.HOVERED_NO_HIGHLIGHT}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
+				&.${ClassName.HOVERED_NO_HIGHLIGHT}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
 				border-bottom-right-radius: ${"var(--ds-radius-medium, 6px)"};
 			}
 		}
@@ -274,7 +274,7 @@ const roundedTableInteractionOverlayStyles = () => css`
 		   width/height: auto overrides the base cell ::after which uses width: 100%; height: 100%,
 		   so that left/right/top/bottom determine the size instead. */
 		td.${ClassName.TABLE_CELL}.${ClassName.ACTIVE_CURSOR_CELL}::after,
-		th.${ClassName.TABLE_HEADER_CELL}.${ClassName.ACTIVE_CURSOR_CELL}::after {
+			th.${ClassName.TABLE_HEADER_CELL}.${ClassName.ACTIVE_CURSOR_CELL}::after {
 			border: 1px solid ${"var(--ds-border-selected, #1868DB)"};
 			box-shadow: ${"var(--ds-shadow-raised, 0px 1px 1px #1E1F2140, 0px 0px 1px #1E1F214f)"};
 			content: '';
@@ -292,11 +292,11 @@ const roundedTableInteractionOverlayStyles = () => css`
 		/* Normalize selected/hover/danger overlays to the same box model as active-cell.
 		   width/height: auto overrides the base cell ::after which uses width: 100%; height: 100%. */
 		td.${ClassName.HOVERED_CELL}::after,
-		td.${ClassName.SELECTED_CELL}::after,
-		th.${ClassName.TABLE_HEADER_CELL}.${ClassName.SELECTED_CELL}::after,
-		th.${ClassName.TABLE_HEADER_CELL}.${ClassName.HOVERED_CELL}::after,
-		th.${ClassName.TABLE_HEADER_CELL}.${ClassName.HOVERED_CELL_IN_DANGER}::after,
-		td.${ClassName.TABLE_CELL}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
+			td.${ClassName.SELECTED_CELL}::after,
+			th.${ClassName.TABLE_HEADER_CELL}.${ClassName.SELECTED_CELL}::after,
+			th.${ClassName.TABLE_HEADER_CELL}.${ClassName.HOVERED_CELL}::after,
+			th.${ClassName.TABLE_HEADER_CELL}.${ClassName.HOVERED_CELL_IN_DANGER}::after,
+			td.${ClassName.TABLE_CELL}.${ClassName.HOVERED_CELL_IN_DANGER}::after {
 			left: -1px;
 			right: -1px;
 			top: -1px;
@@ -307,33 +307,61 @@ const roundedTableInteractionOverlayStyles = () => css`
 
 		/* Active-cell overlays: clamp outer sides using data-reaches-* attributes.
 		   Internal sides keep -1px overlap; true outer edges are clamped to 0. */
-		> tbody > tr > td[data-reaches-top].${ClassName.ACTIVE_CURSOR_CELL}::after,
-		> tbody > tr > th[data-reaches-top].${ClassName.ACTIVE_CURSOR_CELL}::after {
+		> tbody
+			> tr
+			> td[data-reaches-top].${ClassName.ACTIVE_CURSOR_CELL}::after,
+			> tbody
+			> tr
+			> th[data-reaches-top].${ClassName.ACTIVE_CURSOR_CELL}::after {
 			top: 0;
 		}
 
-		> tbody > tr > td[data-reaches-left].${ClassName.ACTIVE_CURSOR_CELL}::after,
-		> tbody > tr > th[data-reaches-left].${ClassName.ACTIVE_CURSOR_CELL}::after {
+		> tbody
+			> tr
+			> td[data-reaches-left].${ClassName.ACTIVE_CURSOR_CELL}::after,
+			> tbody
+			> tr
+			> th[data-reaches-left].${ClassName.ACTIVE_CURSOR_CELL}::after {
 			left: 0;
 		}
 
-		> tbody > tr > td[data-reaches-right].${ClassName.ACTIVE_CURSOR_CELL}::after,
-		> tbody > tr > th[data-reaches-right].${ClassName.ACTIVE_CURSOR_CELL}::after {
+		> tbody
+			> tr
+			> td[data-reaches-right].${ClassName.ACTIVE_CURSOR_CELL}::after,
+			> tbody
+			> tr
+			> th[data-reaches-right].${ClassName.ACTIVE_CURSOR_CELL}::after {
 			right: 0;
 		}
 
-		> tbody > tr > td[data-reaches-bottom].${ClassName.ACTIVE_CURSOR_CELL}::after,
-		> tbody > tr > th[data-reaches-bottom].${ClassName.ACTIVE_CURSOR_CELL}::after {
+		> tbody
+			> tr
+			> td[data-reaches-bottom].${ClassName.ACTIVE_CURSOR_CELL}::after,
+			> tbody
+			> tr
+			> th[data-reaches-bottom].${ClassName.ACTIVE_CURSOR_CELL}::after {
 			bottom: 0;
 		}
 
 		/* Selected/hover/active overlays: clamp outer left side and draw overlay border. */
-		> tbody > tr > td[data-reaches-left].${ClassName.SELECTED_CELL},
-		> tbody > tr > th[data-reaches-left].${ClassName.SELECTED_CELL},
-		> tbody > tr > td[data-reaches-left].${ClassName.HOVERED_CELL},
-		> tbody > tr > th[data-reaches-left].${ClassName.HOVERED_CELL},
-		> tbody > tr > td[data-reaches-left].${ClassName.ACTIVE_CURSOR_CELL},
-		> tbody > tr > th[data-reaches-left].${ClassName.ACTIVE_CURSOR_CELL} {
+		> tbody
+			> tr
+			> td[data-reaches-left].${ClassName.SELECTED_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-left].${ClassName.SELECTED_CELL},
+			> tbody
+			> tr
+			> td[data-reaches-left].${ClassName.HOVERED_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-left].${ClassName.HOVERED_CELL},
+			> tbody
+			> tr
+			> td[data-reaches-left].${ClassName.ACTIVE_CURSOR_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-left].${ClassName.ACTIVE_CURSOR_CELL} {
 			border-left-color: transparent;
 
 			&::after {
@@ -343,8 +371,12 @@ const roundedTableInteractionOverlayStyles = () => css`
 		}
 
 		/* Danger/delete overlays: clamp outer left side. */
-		> tbody > tr > td[data-reaches-left].${ClassName.HOVERED_CELL_IN_DANGER},
-		> tbody > tr > th[data-reaches-left].${ClassName.HOVERED_CELL_IN_DANGER} {
+		> tbody
+			> tr
+			> td[data-reaches-left].${ClassName.HOVERED_CELL_IN_DANGER},
+			> tbody
+			> tr
+			> th[data-reaches-left].${ClassName.HOVERED_CELL_IN_DANGER} {
 			border-left-color: transparent;
 
 			&::after {
@@ -354,12 +386,24 @@ const roundedTableInteractionOverlayStyles = () => css`
 		}
 
 		/* Selected/hover/active overlays: clamp outer right side. */
-		> tbody > tr > td[data-reaches-right].${ClassName.SELECTED_CELL},
-		> tbody > tr > th[data-reaches-right].${ClassName.SELECTED_CELL},
-		> tbody > tr > td[data-reaches-right].${ClassName.HOVERED_CELL},
-		> tbody > tr > th[data-reaches-right].${ClassName.HOVERED_CELL},
-		> tbody > tr > td[data-reaches-right].${ClassName.ACTIVE_CURSOR_CELL},
-		> tbody > tr > th[data-reaches-right].${ClassName.ACTIVE_CURSOR_CELL} {
+		> tbody
+			> tr
+			> td[data-reaches-right].${ClassName.SELECTED_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-right].${ClassName.SELECTED_CELL},
+			> tbody
+			> tr
+			> td[data-reaches-right].${ClassName.HOVERED_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-right].${ClassName.HOVERED_CELL},
+			> tbody
+			> tr
+			> td[data-reaches-right].${ClassName.ACTIVE_CURSOR_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-right].${ClassName.ACTIVE_CURSOR_CELL} {
 			border-right-color: transparent;
 
 			&::after {
@@ -369,8 +413,12 @@ const roundedTableInteractionOverlayStyles = () => css`
 		}
 
 		/* Danger/delete overlays: clamp outer right side. */
-		> tbody > tr > td[data-reaches-right].${ClassName.HOVERED_CELL_IN_DANGER},
-		> tbody > tr > th[data-reaches-right].${ClassName.HOVERED_CELL_IN_DANGER} {
+		> tbody
+			> tr
+			> td[data-reaches-right].${ClassName.HOVERED_CELL_IN_DANGER},
+			> tbody
+			> tr
+			> th[data-reaches-right].${ClassName.HOVERED_CELL_IN_DANGER} {
 			border-right-color: transparent;
 
 			&::after {
@@ -380,12 +428,24 @@ const roundedTableInteractionOverlayStyles = () => css`
 		}
 
 		/* Selected/hover/active overlays: clamp outer bottom side. */
-		> tbody > tr > td[data-reaches-bottom].${ClassName.SELECTED_CELL},
-		> tbody > tr > th[data-reaches-bottom].${ClassName.SELECTED_CELL},
-		> tbody > tr > td[data-reaches-bottom].${ClassName.HOVERED_CELL},
-		> tbody > tr > th[data-reaches-bottom].${ClassName.HOVERED_CELL},
-		> tbody > tr > td[data-reaches-bottom].${ClassName.ACTIVE_CURSOR_CELL},
-		> tbody > tr > th[data-reaches-bottom].${ClassName.ACTIVE_CURSOR_CELL} {
+		> tbody
+			> tr
+			> td[data-reaches-bottom].${ClassName.SELECTED_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-bottom].${ClassName.SELECTED_CELL},
+			> tbody
+			> tr
+			> td[data-reaches-bottom].${ClassName.HOVERED_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-bottom].${ClassName.HOVERED_CELL},
+			> tbody
+			> tr
+			> td[data-reaches-bottom].${ClassName.ACTIVE_CURSOR_CELL},
+			> tbody
+			> tr
+			> th[data-reaches-bottom].${ClassName.ACTIVE_CURSOR_CELL} {
 			border-bottom-color: transparent;
 
 			&::after {
@@ -394,8 +454,12 @@ const roundedTableInteractionOverlayStyles = () => css`
 		}
 
 		/* Danger/delete overlays: clamp outer bottom side. */
-		> tbody > tr > td[data-reaches-bottom].${ClassName.HOVERED_CELL_IN_DANGER},
-		> tbody > tr > th[data-reaches-bottom].${ClassName.HOVERED_CELL_IN_DANGER} {
+		> tbody
+			> tr
+			> td[data-reaches-bottom].${ClassName.HOVERED_CELL_IN_DANGER},
+			> tbody
+			> tr
+			> th[data-reaches-bottom].${ClassName.HOVERED_CELL_IN_DANGER} {
 			border-bottom-color: transparent;
 
 			&::after {
@@ -408,8 +472,10 @@ const roundedTableNumberedColumnStyles = () => css`
 	/* Numbered columns are separate, so they need their own rounded edge owner. */
 	.${ClassName.TABLE_CONTAINER}[data-number-column='true'] {
 		/* Override the inline/container left border and replace it with one rounded pseudo-border. */
-		> .${ClassName.ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN},
-		> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN} {
+		> .${ClassName.ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN},
+			> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN} {
 			position: relative;
 			border-left: 0;
 
@@ -429,17 +495,25 @@ const roundedTableNumberedColumnStyles = () => css`
 		}
 
 		/* Prevent individual number buttons from drawing a straight left border. */
-		> .${ClassName.ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN_BUTTON},
-		> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN_BUTTON} {
+		> .${ClassName.ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN_BUTTON},
+			> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN_BUTTON} {
 			border-left-color: transparent;
 		}
 
-		> .${ClassName.ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_IN_DANGER},
-		> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_IN_DANGER},
-		> .${ClassName.ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_ACTIVE},
-		> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_ACTIVE},
-		> .${ClassName.ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN_BUTTON}.active,
-		> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER} .${ClassName.NUMBERED_COLUMN_BUTTON}.active {
+		> .${ClassName.ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_IN_DANGER},
+			> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_IN_DANGER},
+			> .${ClassName.ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_ACTIVE},
+			> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_ACTIVE},
+			> .${ClassName.ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.active,
+			> .${ClassName.DRAG_ROW_CONTROLS_WRAPPER}
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.active {
 			border-left-color: transparent;
 		}
 
@@ -447,7 +521,11 @@ const roundedTableNumberedColumnStyles = () => css`
 		   Zero out any left-side border-radius on the cell and its overlays/pseudo-borders —
 		   but leave right-side radii untouched so right-edge cells still round correctly. */
 		.${ClassName.TABLE_NODE_WRAPPER} > table > tbody > tr > th[data-reaches-top][data-reaches-left],
-		.${ClassName.TABLE_NODE_WRAPPER} > table > tbody > tr > td[data-reaches-top][data-reaches-left] {
+		.${ClassName.TABLE_NODE_WRAPPER}
+			> table
+			> tbody
+			> tr
+			> td[data-reaches-top][data-reaches-left] {
 			border-top-left-radius: 0;
 
 			&::after,
@@ -456,8 +534,16 @@ const roundedTableNumberedColumnStyles = () => css`
 			}
 		}
 
-		.${ClassName.TABLE_NODE_WRAPPER} > table > tbody > tr > th[data-reaches-bottom][data-reaches-left],
-		.${ClassName.TABLE_NODE_WRAPPER} > table > tbody > tr > td[data-reaches-bottom][data-reaches-left] {
+		.${ClassName.TABLE_NODE_WRAPPER}
+			> table
+			> tbody
+			> tr
+			> th[data-reaches-bottom][data-reaches-left],
+		.${ClassName.TABLE_NODE_WRAPPER}
+			> table
+			> tbody
+			> tr
+			> td[data-reaches-bottom][data-reaches-left] {
 			border-bottom-left-radius: 0;
 
 			&::after,
@@ -476,14 +562,14 @@ const roundedTableNumberedColumnStyles = () => css`
 		}
 
 		.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_IN_DANGER}:first-of-type,
-		.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_ACTIVE}:first-of-type,
-		.${ClassName.NUMBERED_COLUMN_BUTTON}.active:first-of-type {
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_ACTIVE}:first-of-type,
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.active:first-of-type {
 			border-top-left-radius: ${"var(--ds-radius-medium, 6px)"};
 		}
 
 		.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_IN_DANGER}:last-of-type,
-		.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_ACTIVE}:last-of-type,
-		.${ClassName.NUMBERED_COLUMN_BUTTON}.active:last-of-type {
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.${ClassName.HOVERED_CELL_ACTIVE}:last-of-type,
+			.${ClassName.NUMBERED_COLUMN_BUTTON}.active:last-of-type {
 			border-bottom-left-radius: ${"var(--ds-radius-medium, 6px)"};
 		}
 
@@ -496,15 +582,23 @@ const roundedTableNumberedColumnStyles = () => css`
 		}
 
 		/* Sticky numbered-column mask also needs the same top-left radius. */
-		.${ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW} tr th[data-reaches-top][data-reaches-left]::before {
+		.${ClassName.TABLE_NODE_WRAPPER_NO_OVERFLOW}
+			tr
+			th[data-reaches-top][data-reaches-left]::before {
 			border-top-left-radius: ${"var(--ds-radius-medium, 6px)"};
 		}
 	}
 `;
 const roundedTableStickyHeaderStyles = () => css`
 	/* Sticky header rows have independent border/shadow/mask painting, so patch the sticky-only painters too. */
-	.${ClassName.TABLE_NODE_WRAPPER} > table > tbody > tr.${ClassName.NATIVE_STICKY},
-	.${ClassName.TABLE_NODE_WRAPPER} > table.${ClassName.TABLE_STICKY} > tbody > tr.sticky {
+	.${ClassName.TABLE_NODE_WRAPPER}
+		> table
+		> tbody
+		> tr.${ClassName.NATIVE_STICKY},
+		.${ClassName.TABLE_NODE_WRAPPER}
+		> table.${ClassName.TABLE_STICKY}
+		> tbody
+		> tr.sticky {
 		> th[data-reaches-left],
 		> td[data-reaches-left] {
 			border-top-left-radius: ${"var(--ds-radius-medium, 6px)"};
@@ -538,15 +632,22 @@ const roundedTableStickyHeaderStyles = () => css`
 		box-shadow: none !important;
 	}
 
-	.${ClassName.TABLE_NODE_WRAPPER} > table > tbody > tr.${ClassName.NATIVE_STICKY},
-	.${ClassName.TABLE_NODE_WRAPPER} > table.${ClassName.TABLE_STICKY} > tbody > tr.sticky {
+	.${ClassName.TABLE_NODE_WRAPPER}
+		> table
+		> tbody
+		> tr.${ClassName.NATIVE_STICKY},
+		.${ClassName.TABLE_NODE_WRAPPER}
+		> table.${ClassName.TABLE_STICKY}
+		> tbody
+		> tr.sticky {
 		box-shadow: none !important;
 	}
 
-	.${ClassName.TABLE_CONTAINER}.${ClassName.WITH_CONTROLS}:has(tr.sticky) .${ClassName.NUMBERED_COLUMN} .${ClassName.NUMBERED_COLUMN_BUTTON}:first-of-type {
+	.${ClassName.TABLE_CONTAINER}.${ClassName.WITH_CONTROLS}:has(tr.sticky)
+		.${ClassName.NUMBERED_COLUMN}
+		.${ClassName.NUMBERED_COLUMN_BUTTON}:first-of-type {
 		box-shadow: none !important;
 	}
-
 `;
 const roundedTableOverrides = () => css`
 	${roundedTableCellCornerStyles()}

package/dist/esm/nodeviews/TableComponent.js

@@ -137,7 +137,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       var tablePos = _this.props.getPos();
       var isNested = isTableNested(_this.props.view.state, tablePos);
       var parentWidth = _this.getParentNodeWidth();
-      var useMeasuredWidthForBodiedSyncBlock = isNested && typeof tablePos === 'number' && isTableNestedUnderBodiedSyncBlock(_this.props.view.state, tablePos) && fg('platform_synced_block_patch_9');
+      var useMeasuredWidthForBodiedSyncBlock = isNested && typeof tablePos === 'number' && isTableNestedUnderBodiedSyncBlock(_this.props.view.state, tablePos);
       if (useMeasuredWidthForBodiedSyncBlock) {
         // Prefer the live DOM measurement (`clientWidth`) over the ResizeObserver-cached
         // value (`wrapperWidth`) because clientWidth is synchronous and more up-to-date

package/dist/esm/pm-plugins/table-resizing/utils/scale-table.js

@@ -5,7 +5,6 @@ import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { BodiedSyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
 import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { updateColumnWidths } from '../../transforms/column-width';
 import { getTableWidth } from '../../utils/nodes';
 import { getLayoutSize } from '../utils/misc';
@@ -171,7 +170,7 @@ export var scaleTable = function scaleTable(tableRef, options, domAtPos, api) {
       // table's outer width to exceed the colgroup width by 1px. Subtract 1px from the
       // parentWidth here so that the scaled colgroup fits within the sync-block
       // container without overflowing.
-      var isNestedInBodiedSyncBlock = !!((_tableRef$closest = tableRef.closest) !== null && _tableRef$closest !== void 0 && _tableRef$closest.call(tableRef, ".".concat(BodiedSyncBlockSharedCssClassName.content))) && fg('platform_synced_block_patch_9');
+      var isNestedInBodiedSyncBlock = !!((_tableRef$closest = tableRef.closest) !== null && _tableRef$closest !== void 0 && _tableRef$closest.call(tableRef, ".".concat(BodiedSyncBlockSharedCssClassName.content)));
       var BORDER_COLLAPSE_WIDTH_PX = 1;
       var adjustedParentWidth = isNestedInBodiedSyncBlock ? parentWidth - BORDER_COLLAPSE_WIDTH_PX : parentWidth;
       resizeState = scaleWithParent(tableRef, adjustedParentWidth, node, start, domAtPos, isTableScalingEnabledOnCurrentTable, shouldUseIncreasedScalingPercent);

package/dist/esm/tablePlugin.js

@@ -46,7 +46,7 @@ import { getHeightInfoPayload, getWidthInfoPayload } from './pm-plugins/utils/an
 import { createTableWithWidth } from './pm-plugins/utils/create';
 import { createPlugin as createViewModeSortPlugin } from './pm-plugins/view-mode-sort';
 import { ContentComponent } from './ui/ContentComponent';
-import { getRowMenuComponents } from './ui/TableMenu/row/getRowMenuComponents';
+import { getTableMenuComponents } from './ui/TableMenu/shared/getTableMenuComponents';
 import { getToolbarConfig } from './ui/toolbar';
 var defaultGetEditorFeatureFlags = function defaultGetEditorFeatureFlags() {
   return {};
@@ -85,7 +85,7 @@ var tablePlugin = function tablePlugin(_ref) {
   !(options !== null && options !== void 0 && options.isChromelessEditor) && !(options !== null && options !== void 0 && options.isCommentEditor) && (options === null || options === void 0 || (_options$getEditorFea2 = options.getEditorFeatureFlags) === null || _options$getEditorFea2 === void 0 ? void 0 : _options$getEditorFea2.call(options).tableSelector) && editorExperiment('platform_editor_controls', 'variant1');
   if (expValEquals('platform_editor_table_menu_updates', 'isEnabled', true)) {
     var _api$uiControlRegistr;
-    api === null || api === void 0 || (_api$uiControlRegistr = api.uiControlRegistry) === null || _api$uiControlRegistr === void 0 || _api$uiControlRegistr.actions.register(getRowMenuComponents());
+    api === null || api === void 0 || (_api$uiControlRegistr = api.uiControlRegistry) === null || _api$uiControlRegistr === void 0 || _api$uiControlRegistr.actions.register(getTableMenuComponents());
   }
   return {
     name: 'table',

package/dist/esm/ui/FloatingDragMenu/index.js

@@ -6,10 +6,12 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { TableCssClassName as ClassName } from '../../types';
 import { dragMenuDropdownWidth, dragTableInsertColumnButtonSize, tablePopupMenuFitHeight } from '../consts';
-import { RowMenu } from '../TableMenu/row/RowMenu';
-import { newMenuWidth } from '../TableMenu/shared/consts';
+import { COLUMN_MENU } from '../TableMenu/column/keys';
+import { ROW_MENU } from '../TableMenu/row/keys';
+import { TABLE_MENU_WIDTH } from '../TableMenu/shared/consts';
+import { TableMenu } from '../TableMenu/shared/TableMenu';
 import DragMenu from './DragMenu';
-var rowMenuOffset = dragTableInsertColumnButtonSize + 4;
+var TABLE_MENU_OFFSET = dragTableInsertColumnButtonSize + 4;
 var FloatingDragMenu = function FloatingDragMenu(_ref) {
   var _getEditorFeatureFlag;
   var mountPoint = _ref.mountPoint,
@@ -53,7 +55,7 @@ var FloatingDragMenu = function FloatingDragMenu(_ref) {
     mountTo: mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement,
-    fitWidth: expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? newMenuWidth : dragMenuDropdownWidth,
+    fitWidth: expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? TABLE_MENU_WIDTH : dragMenuDropdownWidth,
     fitHeight: tablePopupMenuFitHeight
     // z-index value below is to ensure that this menu is above other floating menu
     // in table, but below floating dialogs like typeaheads, pickers, etc.
@@ -61,10 +63,11 @@ var FloatingDragMenu = function FloatingDragMenu(_ref) {
     ,
     zIndex: inStickyMode ? akEditorFloatingDialogZIndex : akEditorFloatingOverlapPanelZIndex,
     forcePlacement: true,
-    offset: expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? [rowMenuOffset, 0] : direction === 'row' ? [-9, 0] : [0, -7],
+    offset: expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? [TABLE_MENU_OFFSET, 0] : direction === 'row' ? [-9, 0] : [0, -7],
     stick: true
-  }, expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? /*#__PURE__*/React.createElement(RowMenu, {
-    api: api
+  }, expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? /*#__PURE__*/React.createElement(TableMenu, {
+    api: api,
+    surface: direction === 'row' ? ROW_MENU : COLUMN_MENU
   }) : /*#__PURE__*/React.createElement(DragMenu, {
     editorView: editorView,
     isOpen: isOpen,

package/dist/esm/ui/TableFloatingControls/NumberColumn/index.js

@@ -71,9 +71,8 @@ var NumberColumn = /*#__PURE__*/function (_Component) {
           style: {
             // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
             marginTop: hasHeaderRow && this.props.stickyTop !== undefined ? rowHeights[0] : undefined,
-            borderLeft: isDragAndDropEnabled && tableActive && !expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true)
-            // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-            ? "1px solid ".concat(tableBorderColor) : undefined,
+            borderLeft: isDragAndDropEnabled && tableActive && !expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+            "1px solid ".concat(tableBorderColor) : undefined,
             // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
             visibility: 'hidden' // Ensure the column is not visible during SSR
           },
@@ -86,9 +85,8 @@ var NumberColumn = /*#__PURE__*/function (_Component) {
         style: {
           // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
           marginTop: hasHeaderRow && this.props.stickyTop !== undefined ? rowHeights[0] : undefined,
-          borderLeft: isDragAndDropEnabled && tableActive && !expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true)
-          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-          ? "1px solid ".concat(tableBorderColor) : undefined,
+          borderLeft: isDragAndDropEnabled && tableActive && !expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+          "1px solid ".concat(tableBorderColor) : undefined,
           // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
           visibility: 'visible'
         },