@atlaskit/editor-plugin-table 7.6.14 → 7.7.1

package/dist/es2019/transforms/column-width.js

@@ -1,12 +1,10 @@
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { AttrStep } from '@atlaskit/editor-prosemirror/transform';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { getTableContainerElementWidth, getTableElementWidth, hasTableBeenResized } from '../pm-plugins/table-resizing/utils';
 import { isMinCellWidthTable } from '../pm-plugins/table-resizing/utils/colgroup';
 import { getResizeState } from '../pm-plugins/table-resizing/utils/resize-state';
 import { scaleTableTo } from '../pm-plugins/table-resizing/utils/scale-table';
-import { insertColumnButtonOffset } from '../ui/common-styles';
 
 /**
  * Given a new ResizeState object, create a transaction that replaces and updates the table node based on new state.
@@ -111,16 +109,16 @@ export const rescaleColumns = (isTableScalingEnabled = false) => (table, view) =
   if (shouldScale) {
     previousTableInfo = {
       width: getTableElementWidth(table.node),
-      possibleMaxWidth: getBooleanFF('platform.editor.custom-table-width') ? getTableContainerElementWidth(table.node) : getTableContainerElementWidth(table.node) - insertColumnButtonOffset,
+      possibleMaxWidth: getTableContainerElementWidth(table.node),
       isResized
     };
   } else {
-    var _tableRef$parentEleme, _tableRef$parentEleme2;
+    var _tableRef$parentEleme;
     previousTableInfo = {
       // when table is resized the tableRef client width will be 1px larger than colGroup, which is used in calculations
       width: isResized ? tableRef.clientWidth - 1 : tableRef.clientWidth,
       /** the is the width the table can reach before overflowing */
-      possibleMaxWidth: getBooleanFF('platform.editor.custom-table-width') ? (tableRef === null || tableRef === void 0 ? void 0 : (_tableRef$parentEleme = tableRef.parentElement) === null || _tableRef$parentEleme === void 0 ? void 0 : _tableRef$parentEleme.clientWidth) || 0 : ((tableRef === null || tableRef === void 0 ? void 0 : (_tableRef$parentEleme2 = tableRef.parentElement) === null || _tableRef$parentEleme2 === void 0 ? void 0 : _tableRef$parentEleme2.clientWidth) || 0) - insertColumnButtonOffset,
+      possibleMaxWidth: (tableRef === null || tableRef === void 0 ? void 0 : (_tableRef$parentEleme = tableRef.parentElement) === null || _tableRef$parentEleme === void 0 ? void 0 : _tableRef$parentEleme.clientWidth) || 0,
       isResized
     };
   }

package/dist/es2019/types.js

@@ -69,7 +69,6 @@ export const TableCssClassName = {
   CONTROLS_INSERT_BUTTON_WRAP: `${tablePrefixSelector}-controls__insert-button-wrap`,
   CONTROLS_INSERT_LINE: `${tablePrefixSelector}-controls__insert-line`,
   CONTROLS_BUTTON_OVERLAY: `${tablePrefixSelector}-controls__button-overlay`,
-  LAYOUT_BUTTON: `${tablePrefixSelector}-layout-button`,
   DRAG_CONTROLS_INSERT_BUTTON: `${tablePrefixSelector}-controls__drag-insert-button`,
   DRAG_CONTROLS_INSERT_BUTTON_INNER: `${tablePrefixSelector}-controls__drag-insert-button-inner`,
   DRAG_CONTROLS_INSERT_BUTTON_INNER_COLUMN: `${tablePrefixSelector}-controls__drag-insert-button-inner-column`,

package/dist/es2019/ui/ColumnResizeWidget/index.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
+import { startColumnResizing, ToolTipContent } from '@atlaskit/editor-common/keymaps';
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';
 import Tooltip from '@atlaskit/tooltip';
 import { TableCssClassName } from '../../types';
@@ -21,7 +22,10 @@ export const ColumnResizeWidget = ({
     });
   }
   return jsx(Tooltip, {
-    content: formatMessage(messages.adjustColumns),
+    content: jsx(ToolTipContent, {
+      description: formatMessage(messages.adjustColumns),
+      keymap: startColumnResizing
+    }),
     hideTooltipOnClick: true,
     hideTooltipOnMouseDown: true,
     position: "mouse",

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

@@ -6,7 +6,7 @@ import { browser } from '@atlaskit/editor-common/utils';
 import { akEditorSelectedNodeClassName, akEditorSmallZIndex, akEditorStickyHeaderZIndex, akEditorTableCellOnStickyHeaderZIndex, akEditorTableNumberColumnWidth, akEditorTableToolbarSize, akEditorUnitZIndex, getSelectionStyles, MAX_BROWSER_SCROLLBAR_HEIGHT, relativeFontSizeToBase16, SelectionStyle } from '@atlaskit/editor-shared-styles';
 import { scrollbarStyles } from '@atlaskit/editor-shared-styles/scrollbar';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { B300, N0, N20A, N300, N40A, R500 } from '@atlaskit/theme/colors';
+import { N0, N40A, R500 } from '@atlaskit/theme/colors';
 import { fontSize } from '@atlaskit/theme/constants';
 import { TableCssClassName as ClassName } from '../types';
 import { columnControlsDecorationHeight, resizeHandlerAreaWidth, resizeHandlerZIndex, resizeLineWidth, rowControlsZIndex, stickyHeaderBorderBottomWidth, stickyRowOffsetTop, tableBorderColor, tableBorderDeleteColor, tableBorderRadiusSize, tableBorderSelectedColor, tableCellBackgroundColor, tableCellDeleteColor, tableCellSelectedColor, tableControlsSpacing, tableHeaderCellBackgroundColor, tableInsertColumnButtonSize, tableOverflowShadowWidth, tablePadding, tableScrollbarOffset, tableTextColor, tableToolbarDeleteColor, tableToolbarSelectedColor, tableToolbarSize } from './consts';
@@ -177,35 +177,6 @@ const tableStickyHeaderFirefoxFixStyle = () => {
     `;
   }
 };
-const tableWrapperStyles = () => {
-  if (getBooleanFF('platform.editor.custom-table-width')) {
-    return css`
-      .${ClassName.TABLE_NODE_WRAPPER} {
-        padding-bottom: 0px;
-        /* fixes gap cursor height */
-        overflow: auto;
-        overflow-y: hidden;
-        position: relative;
-
-        > table[data-number-column='true'] {
-          width: calc(100% - 1px);
-        }
-      }
-    `;
-  } else {
-    return css`
-      .${ClassName.TABLE_NODE_WRAPPER} {
-        padding-right: ${insertColumnButtonOffset}px;
-        margin-right: -${insertColumnButtonOffset}px;
-        padding-bottom: 0px;
-        /* fixes gap cursor height */
-        overflow: auto;
-        overflow-y: hidden;
-        position: relative;
-      }
-    `;
-  }
-};
 
 // re-exporting these styles to use in Gemini test when table node view is rendered outside of PM
 export const baseTableStyles = props => {
@@ -526,7 +497,7 @@ export const baseTableStyles = props => {
 
   .${ClassName.TABLE_CONTAINER}[data-number-column='true'] {
     .${ClassName.CORNER_CONTROLS}, .${ClassName.CONTROLS_CORNER_BUTTON} {
-      width: ${getBooleanFF('platform.editor.custom-table-width') ? akEditorTableToolbarSize + akEditorTableNumberColumnWidth + 1 : akEditorTableToolbarSize + akEditorTableNumberColumnWidth}px;
+      width: ${akEditorTableToolbarSize + akEditorTableNumberColumnWidth + 1}px;
     }
     .${ClassName.ROW_CONTROLS} .${ClassName.CONTROLS_BUTTON} {
       border-right-width: 0;
@@ -764,7 +735,7 @@ export const baseTableStyles = props => {
   .${ClassName.NUMBERED_COLUMN} {
     position: relative;
     float: right;
-    margin-left: ${getBooleanFF('platform.editor.custom-table-width') ? akEditorTableToolbarSize : akEditorTableToolbarSize - 1}px;
+    margin-left: ${akEditorTableToolbarSize}px;
     top: ${(_props$featureFlags4 = props.featureFlags) !== null && _props$featureFlags4 !== void 0 && _props$featureFlags4.tableDragAndDrop ? 0 : akEditorTableToolbarSize}px;
     width: ${akEditorTableNumberColumnWidth + 1}px;
     box-sizing: border-box;
@@ -813,7 +784,7 @@ export const baseTableStyles = props => {
       display: block;
     }
     .${ClassName.NUMBERED_COLUMN} {
-      padding-left: ${getBooleanFF('platform.editor.custom-table-width') ? 0 : 1}px;
+      padding-left: 0px;
 
       .${ClassName.NUMBERED_COLUMN_BUTTON} {
         border-left: 0 none;
@@ -979,24 +950,22 @@ export const baseTableStyles = props => {
     z-index: ${akEditorTableCellOnStickyHeaderZIndex - 4};
   }
 
-  ${tableWrapperStyles()}
+  .${ClassName.TABLE_NODE_WRAPPER} {
+    padding-bottom: 0px;
+    /* fixes gap cursor height */
+    overflow: auto;
+    overflow-y: hidden;
+    position: relative;
+
+    > table[data-number-column='true'] {
+      width: calc(100% - 1px);
+    }
+  }
 `;
 };
 
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4139
 export const tableStyles = props => css`
-  .${ClassName.LAYOUT_BUTTON} button {
-    background: ${`var(--ds-background-neutral, ${N20A})`};
-    color: ${`var(--ds-icon, ${N300})`};
-    cursor: none;
-  }
-
-  .${ClassName.LAYOUT_BUTTON}:not(.${ClassName.IS_RESIZING}) button:hover {
-    background: ${`var(--ds-background-neutral-hovered, ${B300})`};
-    color: ${"var(--ds-icon, white)"} !important;
-    cursor: pointer;
-  }
-
   .ProseMirror {
     ${baseTableStyles(props)}
   }

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

@@ -296,7 +296,7 @@ export const OverflowShadow = isDragAndDropEnabled => css`
         ${"var(--ds-shadow-overflow-perimeter, transparent)"} 0px,
         transparent 1px
       );
-    left: ${getBooleanFF('platform.editor.custom-table-width') ? `calc(100% - ${tableOverflowShadowWidthWide}px)` : `calc(100% - ${tableOverflowShadowWidthWide - 10}px)`};
+    left: calc(100% - ${tableOverflowShadowWidthWide}px);
   }
   .${ClassName.WITH_CONTROLS} {
     ${overflowShadowWidhoutDnD(isDragAndDropEnabled)}
@@ -346,24 +346,24 @@ const columnHeaderButtonSelected = () => css({
   zIndex: columnControlsSelectedZIndex
 });
 const getFloatingDotOverrides = () => {
-  return getBooleanFF('platform.editor.custom-table-width') ? css`
-        tr
-          th:last-child
-          .${ClassName.COLUMN_CONTROLS_DECORATIONS}::before,
-          tr
-          td:last-child
-          .${ClassName.COLUMN_CONTROLS_DECORATIONS}::before {
-          content: '';
-          background-color: ${tableBorderColor};
-          position: absolute;
-          height: ${lineMarkerSize}px;
-          width: ${lineMarkerSize}px;
-          border-radius: 50%;
-          pointer-events: none;
-          top: ${"var(--ds-space-025, 2px)"};
-          right: 0px;
-        }
-      ` : '';
+  return css`
+    tr
+      th:last-child
+      .${ClassName.COLUMN_CONTROLS_DECORATIONS}::before,
+      tr
+      td:last-child
+      .${ClassName.COLUMN_CONTROLS_DECORATIONS}::before {
+      content: '';
+      background-color: ${tableBorderColor};
+      position: absolute;
+      height: ${lineMarkerSize}px;
+      width: ${lineMarkerSize}px;
+      border-radius: 50%;
+      pointer-events: none;
+      top: ${"var(--ds-space-025, 2px)"};
+      right: 0px;
+    }
+  `;
 };
 export const floatingColumnControls = () => {
   return css`
@@ -647,27 +647,6 @@ export const hoveredWarningCell = css`
   }
 `;
 
-// move the resize handle zone completely inside the table cell to avoid overflow
-const getLastColumnResizerOverrides = () => {
-  return getBooleanFF('platform.editor.custom-table-width') ? css`
-        tr
-          th:last-child
-          .${ClassName.RESIZE_HANDLE_DECORATION},
-          tr
-          td:last-child
-          .${ClassName.RESIZE_HANDLE_DECORATION} {
-          background-color: transparent;
-          position: absolute;
-          width: ${resizeHandlerAreaWidth / 2}px;
-          height: 100%;
-          top: 0;
-          right: 0;
-          cursor: col-resize;
-          z-index: ${resizeHandlerZIndex};
-        }
-      ` : '';
-};
-
 // 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
 const resizeHandleOverrides = isDragAndDropEnabled => {
@@ -757,7 +736,21 @@ export const resizeHandle = isDragAndDropEnabled => css`
       z-index: ${resizeHandlerZIndex};
     }
 
-    ${getLastColumnResizerOverrides()}
+    tr
+      th:last-child
+      .${ClassName.RESIZE_HANDLE_DECORATION},
+      tr
+      td:last-child
+      .${ClassName.RESIZE_HANDLE_DECORATION} {
+      background-color: transparent;
+      position: absolute;
+      width: ${resizeHandlerAreaWidth / 2}px;
+      height: 100%;
+      top: 0;
+      right: 0;
+      cursor: col-resize;
+      z-index: ${resizeHandlerZIndex};
+    }
 
     ${resizeHandleOverrides(isDragAndDropEnabled)}
 

package/dist/es2019/utils/index.js

@@ -1,6 +1,6 @@
 export { getSelectedColumnIndexes, getSelectedRowIndexes, normalizeSelection, isSelectionUpdated } from './selection';
 export { findControlsHoverDecoration, createControlsHoverDecoration, createColumnControlsDecoration, createColumnSelectedDecoration, createCellHoverDecoration, updateDecorations, createResizeHandleDecoration, createColumnInsertLine, createColumnLineResize, createRowInsertLine } from './decoration';
-export { isIsolating, containsHeaderColumn, containsHeaderRow, checkIfHeaderColumnEnabled, checkIfHeaderRowEnabled, checkIfNumberColumnEnabled, isLayoutSupported, getTableWidth, tablesHaveDifferentColumnWidths, tablesHaveDifferentNoOfColumns, isTableNested, anyChildCellMergedAcrossRow, supportedHeaderRow } from './nodes';
+export { isIsolating, containsHeaderColumn, containsHeaderRow, checkIfHeaderColumnEnabled, checkIfHeaderRowEnabled, checkIfNumberColumnEnabled, getTableWidth, tablesHaveDifferentColumnWidths, tablesHaveDifferentNoOfColumns, isTableNested, anyChildCellMergedAcrossRow, supportedHeaderRow } from './nodes';
 export { unwrapContentFromTable, removeTableFromFirstChild, removeTableFromLastChild, transformSliceToRemoveOpenTable, transformSliceToCorrectEmptyTableCells, transformSliceToFixHardBreakProblemOnCopyFromCell } from './paste';
 export { isCell, isCornerButton, isInsertRowButton, isColumnControlsDecorations, isTableControlsButton, isTableContainerOrWrapper, isRowControlsButton, isDragRowControlsButton, isDragColumnFloatingInsertDot, isDragRowFloatingInsertDot, isDragCornerButton, getColumnOrRowIndex, getMousePositionHorizontalRelativeByElement, getMousePositionVerticalRelativeByElement, isResizeHandleDecoration, hasResizeHandler, findNearestCellIndexToPoint } from './dom';
 export { convertHTMLCellIndexToColumnIndex, getColumnsWidths, isColumnDeleteButtonVisible, getColumnDeleteButtonParams, getColumnClassNames, getColumnIndexMappedToColumnIndexInFirstRow } from './column-controls';

package/dist/es2019/utils/nodes.js

@@ -1,8 +1,6 @@
 import { mapChildren } from '@atlaskit/editor-common/utils';
-import { hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { findTable } from '@atlaskit/editor-tables/utils';
-import { pluginKey } from '../pm-plugins/plugin-key';
 export const isIsolating = node => {
   return !!node.type.spec.isolating;
 };
@@ -40,19 +38,6 @@ export const containsHeaderRow = table => {
 export const checkIfHeaderColumnEnabled = selection => filterNearSelection(selection, findTable, containsHeaderColumn, false);
 export const checkIfHeaderRowEnabled = selection => filterNearSelection(selection, findTable, containsHeaderRow, false);
 export const checkIfNumberColumnEnabled = selection => filterNearSelection(selection, findTable, table => !!table.attrs.isNumberColumnEnabled, false);
-export const isLayoutSupported = state => {
-  var _pluginKey$getState;
-  const {
-    permittedLayouts
-  } = ((_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.pluginConfig) || {};
-  const {
-    bodiedExtension,
-    layoutSection,
-    expand,
-    extensionFrame
-  } = state.schema.nodes;
-  return !hasParentNodeOfType([expand, layoutSection, bodiedExtension, extensionFrame])(state.selection) && !!permittedLayouts && (permittedLayouts === 'all' || permittedLayouts.indexOf('default') > -1 && permittedLayouts.indexOf('wide') > -1 && permittedLayouts.indexOf('full-width') > -1);
-};
 export const getTableWidth = node => {
   return getTableWidths(node).reduce((acc, current) => acc + current, 0);
 };

package/dist/esm/commands/misc.js

@@ -31,7 +31,6 @@ export var setTableRef = function setTableRef(ref) {
     var tableNode = ref && foundTable ? foundTable.node : undefined;
     var tablePos = ref && foundTable ? foundTable.pos : undefined;
     var tableWrapperTarget = closestElement(tableRef, ".".concat(ClassName.TABLE_NODE_WRAPPER)) || undefined;
-    var layout = tableNode ? tableNode.attrs.layout : undefined;
     var _getPluginState = getPluginState(state),
       isDragAndDropEnabled = _getPluginState.isDragAndDropEnabled;
     return {
@@ -41,7 +40,6 @@ export var setTableRef = function setTableRef(ref) {
         tableNode: tableNode,
         tablePos: tablePos,
         tableWrapperTarget: tableWrapperTarget,
-        layout: layout || 'default',
         isNumberColumnEnabled: checkIfNumberColumnEnabled(state.selection),
         isHeaderRowEnabled: checkIfHeaderRowEnabled(state.selection),
         isHeaderColumnEnabled: checkIfHeaderColumnEnabled(state.selection),

package/dist/esm/nodeviews/OverflowShadowsObserver.js

@@ -2,9 +2,7 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import rafSchedule from 'raf-schd';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { TableCssClassName as ClassName, ShadowEvent } from '../types';
-import { tableInsertColumnButtonSize } from '../ui/consts';
 import { updateShadowListForStickyStyles } from './update-overflow-shadows';
 export var OverflowShadowsObserver = /*#__PURE__*/function () {
   // updateShadowState is a method to update shadow key
@@ -36,7 +34,7 @@ export var OverflowShadowsObserver = /*#__PURE__*/function () {
         }, {
           threshold: [0, 1],
           root: _this.wrapper,
-          rootMargin: getBooleanFF('platform.editor.custom-table-width') ? '0px' : "0px ".concat(tableInsertColumnButtonSize / 2, "px 0px 0px")
+          rootMargin: '0px'
         });
         return;
       }

package/dist/esm/nodeviews/TableComponent.js

@@ -128,16 +128,12 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       var node = getNode();
       var prevAttrs = prevNode.attrs;
       var isNested = isTableNested(_this.props.view.state, _this.props.getPos());
-      // We only consider a layout change valid if it's done outside of an autoSize.
-      var layoutChanged = prevAttrs.layout !== node.attrs.layout && prevAttrs.__autoSize === node.attrs.__autoSize;
       var parentWidth = _this.getParentNodeWidth();
       var parentWidthChanged = parentWidth && parentWidth !== _this.state.parentWidth;
       var layoutSize = _this.tableNodeLayoutSize(node, containerWidth.width, options);
       var hasNumberedColumnChanged = prevAttrs.isNumberColumnEnabled !== node.attrs.isNumberColumnEnabled;
       var noOfColumnsChanged = tablesHaveDifferentNoOfColumns(node, prevNode);
       if (
-      // Breakout mode/layout changed
-      layoutChanged ||
       // We need to react if our parent changes
       // Scales the cols widths relative to the new parent width.
       parentWidthChanged ||
@@ -151,8 +147,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         // If column has been inserted/deleted avoid multi dispatch
         if (shouldScaleTable) {
           _this.scaleTable({
-            parentWidth: parentWidth,
-            layoutChanged: layoutChanged
+            parentWidth: parentWidth
           });
         }
 
@@ -160,8 +155,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         if (options !== null && options !== void 0 && options.isTableResizingEnabled && hasNumberedColumnChanged) {
           if (!hasTableBeenResized(prevNode)) {
             _this.scaleTable({
-              parentWidth: node.attrs.width,
-              layoutChanged: layoutChanged
+              parentWidth: node.attrs.width
             });
           }
         }
@@ -239,21 +233,16 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       }
     });
     _defineProperty(_assertThisInitialized(_this), "handleWindowResize", function () {
-      var _node$attrs, _node$attrs2;
       var _this$props5 = _this.props,
         getNode = _this$props5.getNode,
         containerWidth = _this$props5.containerWidth;
       var node = getNode();
-      var prevNode = _this.node;
       var layoutSize = _this.tableNodeLayoutSize(node);
-      var prevAttrs = prevNode === null || prevNode === void 0 ? void 0 : prevNode.attrs;
-      var layoutChanged = (prevAttrs === null || prevAttrs === void 0 ? void 0 : prevAttrs.layout) !== (node === null || node === void 0 || (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.layout) && (prevAttrs === null || prevAttrs === void 0 ? void 0 : prevAttrs.__autoSize) === (node === null || node === void 0 || (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.__autoSize);
       if (containerWidth.width > layoutSize) {
         return;
       }
       var parentWidth = _this.getParentNodeWidth();
       _this.scaleTableDebounced({
-        layoutChanged: layoutChanged,
         parentWidth: parentWidth
       });
     });
@@ -706,7 +695,6 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         node: node,
         tableRef: tableRef,
         containerWidth: containerWidth,
-        isBreakoutEnabled: options === null || options === void 0 ? void 0 : options.isBreakoutEnabled,
         isNested: isNested,
         pluginInjectionApi: pluginInjectionApi,
         tableWrapperHeight: this.state.tableWrapperHeight,
@@ -777,10 +765,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       }), this.state.stickyHeader && /*#__PURE__*/React.createElement("div", {
         style: {
           position: 'absolute',
-          right: getBooleanFF('platform.editor.custom-table-width') ? "var(--ds-space-400, 32px)" // tableOverflowShadowWidthWide
-          :
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-          '22px'
+          right: "var(--ds-space-400, 32px)" // tableOverflowShadowWidthWide
         }
       }, /*#__PURE__*/React.createElement("div", {
         className: "".concat(ClassName.TABLE_RIGHT_SHADOW, " ").concat(ClassName.TABLE_STICKY_SHADOW),

package/dist/esm/nodeviews/TableContainer.js

@@ -6,22 +6,10 @@ import React, { forwardRef, useCallback, useRef, useState } from 'react';
 import classNames from 'classnames';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
-import { calcTableWidth } from '@atlaskit/editor-common/styles';
 import { akEditorDefaultLayoutWidth, akEditorGutterPadding, akEditorMediaResizeHandlerPaddingWide, akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { TABLE_MAX_WIDTH } from '../pm-plugins/table-resizing/utils';
 import { TableCssClassName as ClassName } from '../types';
 import { TableResizer } from './TableResizer';
-var getMarginLeft = function getMarginLeft(lineLength, tableWidth) {
-  var marginLeft;
-  if (tableWidth !== 'inherit' && lineLength) {
-    var containerWidth = tableWidth;
-    if (containerWidth) {
-      marginLeft = (lineLength - containerWidth) / 2;
-    }
-  }
-  return marginLeft;
-};
 export var InnerContainer = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var className = _ref.className,
     style = _ref.style,
@@ -134,12 +122,10 @@ export var ResizableTableContainer = /*#__PURE__*/React.memo(function (_ref2) {
     isWholeTableInDanger: isWholeTableInDanger,
     pluginInjectionApi: pluginInjectionApi
   };
-  if (getBooleanFF('platform.editor.resizing-table-height-improvement')) {
-    tableResizerProps = _objectSpread(_objectSpread({}, tableResizerProps), {}, {
-      onResizeStart: onResizeStart,
-      onResizeStop: onResizeStop
-    });
-  }
+  tableResizerProps = _objectSpread(_objectSpread({}, tableResizerProps), {}, {
+    onResizeStart: onResizeStart,
+    onResizeStop: onResizeStop
+  });
   return /*#__PURE__*/React.createElement("div", {
     style: {
       display: 'flex',
@@ -164,11 +150,8 @@ export var TableContainer = function TableContainer(_ref3) {
   var children = _ref3.children,
     node = _ref3.node,
     className = _ref3.className,
-    _ref3$containerWidth = _ref3.containerWidth,
-    lineLength = _ref3$containerWidth.lineLength,
-    editorWidth = _ref3$containerWidth.width,
+    editorWidth = _ref3.containerWidth.width,
     isTableResizingEnabled = _ref3.isTableResizingEnabled,
-    isBreakoutEnabled = _ref3.isBreakoutEnabled,
     editorView = _ref3.editorView,
     getPos = _ref3.getPos,
     tableRef = _ref3.tableRef,
@@ -193,15 +176,13 @@ export var TableContainer = function TableContainer(_ref3) {
       isWholeTableInDanger: isWholeTableInDanger
     }, children);
   }
-  var tableWidth = isBreakoutEnabled ? calcTableWidth(node.attrs.layout, editorWidth) : 'inherit';
   return /*#__PURE__*/React.createElement(InnerContainer, {
     node: node,
     className: classNames(className, {
       'less-padding': editorWidth < akEditorMobileBreakoutPoint && !isNested
     }),
     style: {
-      width: tableWidth,
-      marginLeft: getMarginLeft(lineLength, tableWidth)
+      width: 'inherit'
     }
   }, children);
 };

package/dist/esm/nodeviews/TableResizer.js

@@ -160,7 +160,7 @@ export var TableResizer = function TableResizer(_ref) {
     dispatch(tr);
     var visibleGuidelines = getVisibleGuidelines(isTableScalingEnabled ? defaultGuidelinesForPreserveTable(containerWidth) : defaultGuidelines, containerWidth);
     setSnappingEnabled(displayGuideline(visibleGuidelines));
-    if (getBooleanFF('platform.editor.resizing-table-height-improvement') && onResizeStart) {
+    if (onResizeStart) {
       onResizeStart();
     }
   }, [startMeasure, editorView, displayGapCursor, isTableScalingEnabled, containerWidth, displayGuideline, onResizeStart]);
@@ -264,7 +264,7 @@ export var TableResizer = function TableResizer(_ref) {
     displayGuideline([]);
     updateWidth(newWidth);
     scheduleResize.cancel();
-    if (getBooleanFF('platform.editor.resizing-table-height-improvement') && onResizeStop) {
+    if (onResizeStop) {
       onResizeStop();
     }
     return newWidth;

package/dist/esm/nodeviews/table.js

@@ -273,7 +273,6 @@ export { TableView as default };
 export var createTableView = function createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi) {
   var _getPluginState2 = getPluginState(view.state),
     pluginConfig = _getPluginState2.pluginConfig,
-    isBreakoutEnabled = _getPluginState2.isBreakoutEnabled,
     isFullWidthModeEnabled = _getPluginState2.isFullWidthModeEnabled,
     wasFullWidthModeEnabled = _getPluginState2.wasFullWidthModeEnabled,
     isTableResizingEnabled = _getPluginState2.isTableResizingEnabled,
@@ -292,7 +291,6 @@ export var createTableView = function createTableView(node, view, getPos, portal
     eventDispatcher: eventDispatcher,
     getPos: getPos,
     options: {
-      isBreakoutEnabled: isBreakoutEnabled,
       isFullWidthModeEnabled: isFullWidthModeEnabled,
       wasFullWidthModeEnabled: wasFullWidthModeEnabled,
       isTableResizingEnabled: isTableResizingEnabled,

package/dist/esm/plugin.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { table, tableCell, tableHeader, tableRow, tableWithCustomWidth } from '@atlaskit/adf-schema';
+import { table, tableCell, tableHeader, tableRow } from '@atlaskit/adf-schema';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
 import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
 import { IconTable } from '@atlaskit/editor-common/icons';
@@ -33,8 +33,7 @@ import FloatingContextualMenu from './ui/FloatingContextualMenu';
 import FloatingDeleteButton from './ui/FloatingDeleteButton';
 import FloatingDragMenu from './ui/FloatingDragMenu';
 import FloatingInsertButton from './ui/FloatingInsertButton';
-import LayoutButton from './ui/LayoutButton';
-import { createTableWithWidth, isLayoutSupported } from './utils';
+import { createTableWithWidth } from './utils';
 var defaultGetEditorFeatureFlags = function defaultGetEditorFeatureFlags() {
   return {};
 };
@@ -110,10 +109,9 @@ var tablesPlugin = function tablesPlugin(_ref) {
       insertTableWithSize: insertTableWithSize(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions)
     },
     nodes: function nodes() {
-      var tableNode = options !== null && options !== void 0 && options.tableResizingEnabled ? tableWithCustomWidth : table;
       return [{
         name: 'table',
-        node: tableNode
+        node: table
       }, {
         name: 'tableHeader',
         node: tableHeader
@@ -138,12 +136,11 @@ var tablesPlugin = function tablesPlugin(_ref) {
             fullWidthEnabled = _ref3.fullWidthEnabled,
             wasFullWidthEnabled = _ref3.wasFullWidthEnabled,
             tableResizingEnabled = _ref3.tableResizingEnabled,
-            breakoutEnabled = _ref3.breakoutEnabled,
             tableOptions = _ref3.tableOptions,
             getEditorFeatureFlags = _ref3.getEditorFeatureFlags,
             dragAndDropEnabled = _ref3.dragAndDropEnabled,
             isTableScalingEnabled = _ref3.isTableScalingEnabled;
-          return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled);
+          return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled);
         }
       }, {
         name: 'tablePMColResizing',
@@ -305,7 +302,6 @@ var tablesPlugin = function tablesPlugin(_ref) {
             tablePluginState = _ref17.tablePluginState,
             tableWidthPluginState = _ref17.tableWidthPluginState,
             dragAndDropState = _ref17.dragAndDropState;
-          var state = editorView.state;
           var isColumnResizing = resizingPluginState === null || resizingPluginState === void 0 ? void 0 : resizingPluginState.dragging;
           var isTableResizing = tableWidthPluginState === null || tableWidthPluginState === void 0 ? void 0 : tableWidthPluginState.resizing;
           var isResizing = isColumnResizing || isTableResizing;
@@ -314,7 +310,6 @@ var tablesPlugin = function tablesPlugin(_ref) {
             tablePos = _ref18.tablePos,
             targetCellPosition = _ref18.targetCellPosition,
             isContextualMenuOpen = _ref18.isContextualMenuOpen,
-            layout = _ref18.layout,
             tableRef = _ref18.tableRef,
             pluginConfig = _ref18.pluginConfig,
             insertColumnButtonIndex = _ref18.insertColumnButtonIndex,
@@ -325,17 +320,6 @@ var tablesPlugin = function tablesPlugin(_ref) {
             tableWrapperTarget = _ref18.tableWrapperTarget;
           var allowControls = pluginConfig.allowControls;
           var stickyHeader = stickyHeadersState ? findStickyHeaderForTable(stickyHeadersState, tablePos) : undefined;
-          var LayoutContent = options && !options.tableResizingEnabled && isLayoutSupported(state) && options.breakoutEnabled ? /*#__PURE__*/React.createElement(LayoutButton, {
-            editorView: editorView,
-            mountPoint: popupsMountPoint,
-            boundariesElement: popupsBoundariesElement,
-            scrollableElement: popupsScrollableElement,
-            targetRef: tableWrapperTarget,
-            layout: layout,
-            isResizing: !!resizingPluginState && !!resizingPluginState.dragging,
-            stickyHeader: stickyHeader,
-            editorAnalyticsAPI: editorAnalyticsAPI
-          }) : null;
           return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && tableRef && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
             isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
             editorView: editorView,
@@ -345,7 +329,6 @@ var tablesPlugin = function tablesPlugin(_ref) {
             scrollableElement: popupsScrollableElement,
             dispatchAnalyticsEvent: dispatchAnalyticsEvent,
             isContextualMenuOpen: isContextualMenuOpen,
-            layout: layout,
             stickyHeader: stickyHeader,
             tableWrapper: tableWrapperTarget
           }), allowControls && /*#__PURE__*/React.createElement(FloatingInsertButton, {
@@ -398,7 +381,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
             stickyHeaders: stickyHeader,
             isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
             editorAnalyticsAPI: editorAnalyticsAPI
-          }), LayoutContent);
+          }));
         }
       }));
     },

package/dist/esm/pm-plugins/main.js

@@ -25,7 +25,7 @@ import { isHeaderRowRequired } from '../utils/paste';
 import { defaultHoveredCell, defaultTableSelection } from './default-table-selection';
 import { createPluginState, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
-export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled) {
+export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled) {
   var _accessibilityUtils;
   var state = createPluginState(dispatch, _objectSpread(_objectSpread(_objectSpread({
     pluginConfig: pluginConfig,
@@ -33,7 +33,6 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
     insertColumnButtonIndex: undefined,
     insertRowButtonIndex: undefined,
     isFullWidthModeEnabled: fullWidthModeEnabled,
-    isBreakoutEnabled: breakoutEnabled,
     wasFullWidthModeEnabled: previousFullWidthModeEnabled,
     isTableResizingEnabled: tableResizingEnabled,
     isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,