@atlaskit/editor-plugin-table 8.4.14 → 9.0.1

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @atlaskit/editor-plugin-table
 
+## 9.0.1
+
+### Patch Changes
+
+- [#98104](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/98104)
+  [`7c7c2dc094742`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/7c7c2dc094742) -
+  [ux] [ED-25529] This change adds padding to nested tables when active, to allow space for the row
+  and column controls. It also prevents the Insert Row/ Insert Column buttons from being hidden too
+  early.
+
+## 9.0.0
+
+### Major Changes
+
+- [#98966](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/98966)
+  [`5c8e4c2ce26bf`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5c8e4c2ce26bf) -
+  Remove platform_editor_table_new_column_resizing experiment, remove options and all logic inside
+  editor-plugin-table and remove it from feature flag plugin config.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 8.4.14
 
 ### Patch Changes

package/dist/cjs/nodeviews/TableRow.js

@@ -413,6 +413,7 @@ var TableRow = exports.default = /*#__PURE__*/function (_TableNodeView) {
   }, {
     key: "onTablePluginState",
     value: function onTablePluginState(state) {
+      var _parentContainer$pare, _parentContainer$pare2;
       var tableRef = state.tableRef;
       var tree = (0, _dom2.getTree)(this.dom);
       if (!tree) {
@@ -437,22 +438,31 @@ var TableRow = exports.default = /*#__PURE__*/function (_TableNodeView) {
       var wrapper = tree.wrapper;
       var tableContainer = wrapper.parentElement;
       var tableContentWrapper = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.parentElement;
-      var layoutContainer = tableContentWrapper && tableContentWrapper.parentElement;
-      if (isCurrentTableSelected) {
-        this.colControlsOffset = _consts.tableControlsSpacing;
-        if (layoutContainer && layoutContainer.getAttribute('data-layout-content')) {
+      var parentContainer = tableContentWrapper && tableContentWrapper.parentElement;
+      var isTableInsideLayout = parentContainer && parentContainer.getAttribute('data-layout-content');
+      var isNestedTable = parentContainer && (parentContainer.className === 'pm-table-header-content-wrap' || parentContainer.className === 'pm-table-cell-content-wrap');
+      var isNestedDataTable = parentContainer && parentContainer.getAttribute('data-mark-type') === 'fragment' && (((_parentContainer$pare = parentContainer.parentElement) === null || _parentContainer$pare === void 0 ? void 0 : _parentContainer$pare.className) === 'pm-table-header-content-wrap' || ((_parentContainer$pare2 = parentContainer.parentElement) === null || _parentContainer$pare2 === void 0 ? void 0 : _parentContainer$pare2.className) === 'pm-table-cell-content-wrap');
+      var isTableInsideTable = isNestedTable || isNestedDataTable;
+      if (tableContentWrapper) {
+        if (isCurrentTableSelected) {
+          this.colControlsOffset = _consts.tableControlsSpacing;
+
           // move table a little out of the way
           // to provide spacing for table controls
-          // Ignored via go/ees005
-          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-          tableContentWrapper.style.paddingLeft = '11px';
-        }
-      } else {
-        this.colControlsOffset = 0;
-        if (layoutContainer && layoutContainer.getAttribute('data-layout-content')) {
-          // Ignored via go/ees005
-          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-          tableContentWrapper.style.removeProperty('padding-left');
+          if (isTableInsideLayout) {
+            tableContentWrapper.style.paddingLeft = '11px';
+          } else if (isTableInsideTable) {
+            tableContentWrapper.style.paddingLeft = '15px';
+            tableContentWrapper.style.paddingRight = '4px';
+          }
+        } else {
+          this.colControlsOffset = 0;
+          if (isTableInsideLayout) {
+            tableContentWrapper.style.removeProperty('padding-left');
+          } else if (isTableInsideTable) {
+            tableContentWrapper.style.removeProperty('padding-left');
+            tableContentWrapper.style.removeProperty('padding-right');
+          }
         }
       }
 

package/dist/cjs/pm-plugins/table-resizing/event-handlers.js

@@ -1,11 +1,9 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.handleMouseDown = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _styles = require("@atlaskit/editor-common/styles");
 var _tableMap = require("@atlaskit/editor-tables/table-map");
@@ -15,8 +13,6 @@ var _misc = require("../commands/misc");
 var _pluginFactory = require("../plugin-factory");
 var _tableAnalytics = require("../table-analytics");
 var _columnWidth = require("../transforms/column-width");
-var _alignment = require("../utils/alignment");
-var _nodes = require("../utils/nodes");
 var _selection = require("../utils/selection");
 var _commands = require("./commands");
 var _pluginFactory2 = require("./plugin-factory");
@@ -25,9 +21,7 @@ var _dom = require("./utils/dom");
 var _misc2 = require("./utils/misc");
 var _resizeColumn = require("./utils/resize-column");
 var _resizeState = require("./utils/resize-state");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, event, localResizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isNewColumnResizingEnabled, isTableAlignmentEnabled, isCommentEditor
+var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, event, localResizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isCommentEditor
 // Ignored via go/ees005
 // eslint-disable-next-line @typescript-eslint/max-params
 ) {
@@ -37,7 +31,6 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
   var editorDisabled = !view.editable;
   var domAtPos = view.domAtPos.bind(view);
   var _getEditorContainerWi = getEditorContainerWidth(),
-    lineLength = _getEditorContainerWi.lineLength,
     editorWidth = _getEditorContainerWi.width;
   if (editorDisabled || localResizeHandlePos === null || !(0, _misc2.pointsAtCell)(state.doc.resolve(localResizeHandlePos))) {
     return false;
@@ -119,18 +112,6 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
   // When we start resizing a column we need to ensure the underlying tooltip is removed from the decoration to avoid
   // unnecessary tooltips being displayed during drag.
   (0, _misc.updateResizeHandleDecorations)(nodeViewPortalProviderAPI, undefined, undefined, false)(state, dispatch);
-
-  // for new column resizing, take the current scaled version of table widths and use those as the basis for resizing
-  // implication: the scaled version of the table becomes the source of truth
-  if (isNewColumnResizingEnabled && shouldScale) {
-    resizeState = (0, _resizeColumn.scaleResizeState)({
-      resizeState: resizeState,
-      tableRef: dom,
-      tableNode: originalTable,
-      editorWidth: editorWidth,
-      shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent
-    });
-  }
   function finish(event) {
     // Ignored via go/ees005
     // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
@@ -179,9 +160,8 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
       // For example, if a table col is deleted we won't be able to reliably remap the new widths
       // There may be a more elegant solution to this, to avoid a jarring experience.
       if (table.eq(originalTable)) {
+        var _table$attrs;
         var map = _tableMap.TableMap.get(table);
-        var totalRowCount = map.height;
-        var totalColumnCount = map.width;
         var colIndex = map.colCount($cell.pos - start) + ($cell.nodeAfter ? $cell.nodeAfter.attrs.colspan : 1) - 1;
         var selectionRect = (0, _utils.getSelectionRect)(state.selection);
         var selectedColumns = selectionRect ? (0, _selection.getSelectedColumnIndexes)(selectionRect) : [];
@@ -193,50 +173,9 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
         }
         var resizedDelta = clientX - startX;
         var _shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled || isTableScalingEnabled && !!isCommentEditor;
-        if (isNewColumnResizingEnabled && !(0, _nodes.isTableNested)(state, tablePos)) {
-          var newResizeState = (0, _resizeColumn.resizeColumnAndTable)({
-            resizeState: resizeState,
-            colIndex: colIndex,
-            amount: resizedDelta,
-            tableRef: dom,
-            tableNode: originalTable,
-            width: editorWidth,
-            lineLength: lineLength,
-            isTableAlignmentEnabled: isTableAlignmentEnabled
-          });
-          tr = (0, _columnWidth.updateColumnWidths)(newResizeState, table, start, api)(tr);
-
-          // If the table is aligned to the start and the table width is greater than the line length, we should change the alignment to center
-          var shouldChangeAlignment = (0, _alignment.shouldChangeAlignmentToCenterResized)(isTableAlignmentEnabled, originalTable, lineLength, newResizeState.maxSize);
-          if (shouldChangeAlignment) {
-            tr = tr.setNodeMarkup(start - 1, state.schema.nodes.table, _objectSpread(_objectSpread({}, table.attrs), {}, {
-              width: newResizeState.maxSize,
-              layout: _alignment.ALIGN_CENTER
-            }));
-            editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
-              action: _analytics.TABLE_ACTION.CHANGED_ALIGNMENT,
-              actionSubject: _analytics.ACTION_SUBJECT.TABLE,
-              actionSubjectId: null,
-              attributes: {
-                tableWidth: newResizeState.maxSize,
-                newAlignment: _alignment.ALIGN_CENTER,
-                previousAlignment: _alignment.ALIGN_START,
-                totalRowCount: totalRowCount,
-                totalColumnCount: totalColumnCount,
-                inputMethod: _analytics.INPUT_METHOD.AUTO,
-                reason: _analytics.CHANGE_ALIGNMENT_REASON.TABLE_COLUMN_RESIZED
-              },
-              eventType: _analytics.EVENT_TYPE.TRACK
-            })(tr);
-          } else {
-            tr.setNodeAttribute(start - 1, 'width', newResizeState.maxSize);
-          }
-        } else {
-          var _table$attrs;
-          var scalePercent = isTableScalingEnabled && isCommentEditor && !((_table$attrs = table.attrs) !== null && _table$attrs !== void 0 && _table$attrs.width) ? (0, _misc2.getScalingPercentForTableWithoutWidth)(originalTable, dom) : (0, _misc2.getTableScalingPercent)(originalTable, dom, _shouldUseIncreasedScalingPercent);
-          var _newResizeState = (0, _resizeColumn.resizeColumn)(resizeState, colIndex, resizedDelta, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, _shouldScale, scalePercent);
-          tr = (0, _columnWidth.updateColumnWidths)(_newResizeState, table, start, api)(tr);
-        }
+        var scalePercent = isTableScalingEnabled && isCommentEditor && !((_table$attrs = table.attrs) !== null && _table$attrs !== void 0 && _table$attrs.width) ? (0, _misc2.getScalingPercentForTableWithoutWidth)(originalTable, dom) : (0, _misc2.getTableScalingPercent)(originalTable, dom, _shouldUseIncreasedScalingPercent);
+        var newResizeState = (0, _resizeColumn.resizeColumn)(resizeState, colIndex, resizedDelta, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, _shouldScale, scalePercent);
+        tr = (0, _columnWidth.updateColumnWidths)(newResizeState, table, start, api)(tr);
         if (colIndex === map.width - 1) {
           var mouseUpTime = event.timeStamp;
           editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
@@ -280,6 +219,7 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
     }
   }
   function move(event) {
+    var _table$attrs2;
     var clientX = event.clientX,
       which = event.which;
     var state = view.state;
@@ -289,12 +229,11 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
     var _getTablePluginState3 = (0, _pluginFactory.getPluginState)(state),
       isTableHovered = _getTablePluginState3.isTableHovered;
     var tablePos = state.doc.resolve(start).start(-1);
-    if (!which || !dragging || resizeHandlePos === null || !(0, _misc2.pointsAtCell)(state.doc.resolve(resizeHandlePos)) || (!isNewColumnResizingEnabled || (0, _nodes.isTableNested)(state, tablePos)) && !isTableHovered) {
+    if (!which || !dragging || resizeHandlePos === null || !(0, _misc2.pointsAtCell)(state.doc.resolve(resizeHandlePos)) || !isTableHovered) {
       return finish(event);
     }
     var $cell = state.doc.resolve(resizeHandlePos);
     var table = $cell.node(-1);
-    // const tablePos = state.doc.resolve(start).start(-1);
     var tableDepth = state.doc.resolve(tablePos).depth;
     var map = _tableMap.TableMap.get(table);
     // Ignored via go/ees005
@@ -306,22 +245,8 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
       shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
     }
     var resizedDelta = clientX - dragging.startX;
-    if (isNewColumnResizingEnabled && !(0, _nodes.isTableNested)(state, tablePos) && !isCommentEditor) {
-      (0, _resizeColumn.resizeColumnAndTable)({
-        resizeState: resizeState,
-        colIndex: colIndex,
-        amount: resizedDelta,
-        tableRef: dom,
-        tableNode: originalTable,
-        width: editorWidth,
-        lineLength: lineLength,
-        isTableAlignmentEnabled: isTableAlignmentEnabled
-      });
-    } else {
-      var _table$attrs2;
-      var scalePercent = isTableScalingEnabled && isCommentEditor && !((_table$attrs2 = table.attrs) !== null && _table$attrs2 !== void 0 && _table$attrs2.width) ? (0, _misc2.getScalingPercentForTableWithoutWidth)(table, dom) : (0, _misc2.getTableScalingPercent)(originalTable, dom, shouldUseIncreasedScalingPercent);
-      (0, _resizeColumn.resizeColumn)(resizeState, colIndex, resizedDelta, dom, table, undefined, shouldScale, scalePercent);
-    }
+    var scalePercent = isTableScalingEnabled && isCommentEditor && !((_table$attrs2 = table.attrs) !== null && _table$attrs2 !== void 0 && _table$attrs2.width) ? (0, _misc2.getScalingPercentForTableWithoutWidth)(table, dom) : (0, _misc2.getTableScalingPercent)(originalTable, dom, shouldUseIncreasedScalingPercent);
+    (0, _resizeColumn.resizeColumn)(resizeState, colIndex, resizedDelta, dom, table, undefined, shouldScale, scalePercent);
     (0, _dom.updateControls)()(state);
   }
 

package/dist/cjs/pm-plugins/table-resizing/plugin.js

@@ -17,7 +17,7 @@ var _pluginKey = require("./plugin-key");
 var _dom = require("./utils/dom");
 // Ignored via go/ees005
 // eslint-disable-next-line @typescript-eslint/max-params
-function createPlugin(dispatch, _ref, getEditorContainerWidth, getEditorFeatureFlags, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled, isNewColumnResizingEnabled, isTableAlignmentEnabled, isCommentEditor) {
+function createPlugin(dispatch, _ref, getEditorContainerWidth, getEditorFeatureFlags, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled, isCommentEditor) {
   var _ref$lastColumnResiza = _ref.lastColumnResizable,
     lastColumnResizable = _ref$lastColumnResiza === void 0 ? true : _ref$lastColumnResiza;
   return new _safePlugin.SafePlugin({
@@ -54,7 +54,7 @@ function createPlugin(dispatch, _ref, getEditorContainerWidth, getEditorFeatureF
             isColumnKeyboardResizeStarted = isKeyboardResize;
           }
           if (resizeHandlePos !== null && (!dragging || isColumnKeyboardResizeStarted)) {
-            if ((0, _eventHandlers.handleMouseDown)(view, event, resizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled || false, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isNewColumnResizingEnabled, isTableAlignmentEnabled, isCommentEditor)) {
+            if ((0, _eventHandlers.handleMouseDown)(view, event, resizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled || false, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isCommentEditor)) {
               var _state = view.state,
                 _dispatch = view.dispatch;
               return (0, _commands.setResizeHandlePos)(resizeHandlePos)(_state, _dispatch);

package/dist/cjs/pm-plugins/table-resizing/utils/resize-column.js

@@ -1,20 +1,13 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.scaleResizeState = exports.resizeColumnAndTable = exports.resizeColumn = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _styles = require("@atlaskit/editor-common/styles");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _types = require("../../../types");
-var _alignment = require("../../utils/alignment");
-var _misc = require("./misc");
+exports.resizeColumn = void 0;
 var _resizeLogic = require("./resize-logic");
 var _resizeState = require("./resize-state");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // Resize a given column by an amount from the current state
+// Resize a given column by an amount from the current state
+
 var resizeColumn = exports.resizeColumn = function resizeColumn(resizeState, colIndex, amount, tableRef, tableNode, selectedColumns) {
   var isTableScalingEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
   var scalePercent = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 1;
@@ -25,138 +18,4 @@ var resizeColumn = exports.resizeColumn = function resizeColumn(resizeState, col
   var newState = resizeAmount > 0 ? (0, _resizeLogic.growColumn)(resizeState, colIndex, resizeAmount, selectedColumns) : resizeAmount < 0 ? (0, _resizeLogic.shrinkColumn)(resizeState, colIndex, resizeAmount, selectedColumns) : resizeState;
   (0, _resizeState.updateColgroup)(newState, tableRef, tableNode, isTableScalingEnabled, scalePercent);
   return newState;
-};
-var resizeColumnAndTable = exports.resizeColumnAndTable = function resizeColumnAndTable(_ref) {
-  var resizeState = _ref.resizeState,
-    colIndex = _ref.colIndex,
-    amount = _ref.amount,
-    tableRef = _ref.tableRef,
-    tableNode = _ref.tableNode,
-    lineLength = _ref.lineLength,
-    editorWidth = _ref.width,
-    isTableAlignmentEnabled = _ref.isTableAlignmentEnabled;
-  var editorContainerWidth = getEditorContainerWidth(editorWidth);
-  var isTableLeftAligned = tableNode.attrs.layout === _alignment.ALIGN_START;
-  var isNumberColumnEnabled = tableNode.attrs.isNumberColumnEnabled;
-  var isOverflow = resizeState.tableWidth > resizeState.maxSize;
-  var resizeAmount = isTableLeftAligned ? amount : amount * 2;
-  var willTableHitEditorEdge = resizeState.maxSize + resizeAmount > editorContainerWidth;
-  var willResizedTableStayInOverflow = isOverflow && resizeState.tableWidth + resizeAmount / 2 > resizeState.maxSize;
-
-  // STEP 1: Update col width
-  if (willTableHitEditorEdge || willResizedTableStayInOverflow) {
-    var _tableRef$closest;
-    var tableContainerWidth = (_tableRef$closest = tableRef.closest('.pm-table-container')) === null || _tableRef$closest === void 0 ? void 0 : _tableRef$closest.clientWidth;
-    resizeAmount = amount < 0 ? amount :
-    // Ignored via go/ees005
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    resizeAmount - (resizeState.maxSize + resizeAmount - tableContainerWidth) / 2;
-  } else {
-    var diff = -(resizeState.tableWidth - resizeState.maxSize);
-    var rest = amount - diff;
-    var final = isTableLeftAligned ? diff + rest : diff + rest * 2;
-    resizeAmount = final;
-  }
-  var newState = (0, _resizeLogic.updateAffectedColumn)(resizeState, colIndex, resizeAmount);
-
-  // STEP 2: Update table container width
-  // columns have a min width, so delta !== resizeAmount when this is reached, use this for calculations
-  var delta = newState.cols[colIndex].width - resizeState.cols[colIndex].width;
-  newState.maxSize = Math.round(isOverflow ? willResizedTableStayInOverflow ?
-  // CASE 1A: table will stay in overflow
-  // do not grow the table because resize is happening in the overflow region
-  // and the overall table container needs to be retained
-  isNumberColumnEnabled ? resizeState.maxSize + _editorSharedStyles.akEditorTableNumberColumnWidth : resizeState.maxSize :
-  // CASE 1B: table will no longer be in overflow, so adjust container width
-  // ensure the table is resized without any 'big jumps' by working out
-  // the difference between the new table width and the max size and adding the resize
-  isNumberColumnEnabled ? resizeState.maxSize + _editorSharedStyles.akEditorTableNumberColumnWidth + (resizeState.tableWidth - resizeState.maxSize + _editorSharedStyles.akEditorTableNumberColumnWidth + delta) : resizeState.maxSize + (resizeState.tableWidth - resizeState.maxSize + delta) : willTableHitEditorEdge ?
-  // CASE 2: table will hit editor edge
-  editorContainerWidth :
-  // CASE 3: table is being resized from a non-overflow state
-  isNumberColumnEnabled ? resizeState.maxSize + _editorSharedStyles.akEditorTableNumberColumnWidth + delta : resizeState.maxSize + delta);
-
-  // do not apply scaling logic because resize state is already scaled
-  (0, _resizeState.updateColgroup)(newState, tableRef, tableNode, false, 1);
-  updateTablePreview(tableRef, newState.maxSize, (0, _alignment.shouldChangeAlignmentToCenterResized)(isTableAlignmentEnabled, tableNode, lineLength, newState.maxSize));
-  return newState;
-};
-var updateTablePreview = function updateTablePreview(tableRef, newTableWidth, shouldChangeAlignment) {
-  var resizingContainer = tableRef.closest(".".concat(_types.TableCssClassName.TABLE_RESIZER_CONTAINER));
-  var resizingItem = resizingContainer === null || resizingContainer === void 0 ? void 0 : resizingContainer.querySelector('.resizer-item');
-  var alignmentContainer = resizingContainer === null || resizingContainer === void 0 ? void 0 : resizingContainer.parentElement;
-  if (resizingItem) {
-    var newWidth = "".concat(newTableWidth, "px");
-    // Ignored via go/ees005
-    // eslint-disable-next-line @atlaskit/editor/no-as-casting
-    resizingContainer.style.width = newWidth;
-    // Ignored via go/ees005
-    // eslint-disable-next-line @atlaskit/editor/no-as-casting
-    resizingItem.style.width = newWidth;
-    if (shouldChangeAlignment && alignmentContainer) {
-      alignmentContainer.style.justifyContent = _alignment.ALIGN_CENTER;
-    }
-  }
-};
-var getEditorContainerWidth = function getEditorContainerWidth(editorWidth) {
-  return Math.min(editorWidth - (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() * 2, _editorSharedStyles.akEditorFullWidthLayoutWidth);
-};
-
-/**
- * Apply a scaling factor to resize state
- */
-var scaleResizeState = exports.scaleResizeState = function scaleResizeState(_ref2) {
-  var resizeState = _ref2.resizeState,
-    tableRef = _ref2.tableRef,
-    tableNode = _ref2.tableNode,
-    editorWidth = _ref2.editorWidth,
-    shouldUseIncreasedScalingPercent = _ref2.shouldUseIncreasedScalingPercent;
-  var isNumberColumnEnabled = tableNode.attrs.isNumberColumnEnabled;
-  var isTableScaled = isNumberColumnEnabled || resizeState.maxSize > getEditorContainerWidth(editorWidth);
-
-  // Tables with number column can cause the table to be in two different states:
-  // 1. The table sum of col widths will be smaller than the max size, which is incorrect. For this
-  // avoid scaling and take the document width
-  // 2. The table sum of col widths will be the same size as max width, which happens when the table
-  // is scaled using preserve table width logic, for this apply a scaled width
-  // return early if table isn't scaled
-  if (!isTableScaled || isNumberColumnEnabled && resizeState.maxSize > resizeState.tableWidth) {
-    return resizeState;
-  }
-  var scalePercent = (0, _misc.getTableScalingPercent)(tableNode, tableRef, shouldUseIncreasedScalingPercent);
-  var scaledTableWidth = Math.round(resizeState.tableWidth * scalePercent);
-  var cols = resizeState.cols.map(function (col) {
-    return _objectSpread(_objectSpread({}, col), {}, {
-      minWidth: _styles.tableCellMinWidth,
-      width: Math.max(Math.round(col.width * scalePercent), _styles.tableCellMinWidth)
-    });
-  });
-  var calculatedTableWidth = cols.reduce(function (prev, curr) {
-    return prev + curr.width;
-  }, 0);
-
-  // using Math.round can cause the sum of col widths to be larger than the table width
-  // distribute the difference to the first column
-  if (calculatedTableWidth > scaledTableWidth) {
-    var diff = calculatedTableWidth - scaledTableWidth;
-    var hasDiffBeenDistributed = false;
-    cols = cols.map(function (col) {
-      if (!hasDiffBeenDistributed && col.width - diff >= col.minWidth) {
-        hasDiffBeenDistributed = true;
-        return _objectSpread(_objectSpread({}, col), {}, {
-          width: col.width - diff
-        });
-      }
-      return col;
-    });
-  }
-  var maxSize = isNumberColumnEnabled ? Math.round((resizeState.maxSize + _editorSharedStyles.akEditorTableNumberColumnWidth) * scalePercent) : Math.round(resizeState.maxSize * scalePercent);
-  return _objectSpread(_objectSpread({}, resizeState), {}, {
-    widths: cols.map(function (col) {
-      return col.width;
-    }),
-    tableWidth: scaledTableWidth,
-    maxSize: maxSize,
-    cols: cols
-  });
 };

package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js

@@ -339,7 +339,6 @@ var getNewResizeStateFromSelectedColumns = exports.getNewResizeStateFromSelected
     layout: layout,
     getEditorContainerWidth: getEditorContainerWidth
   });
-  var resizeState;
   var isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
   var isTableScalingWithFixedColumnWidthsOptionEnabled = isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled;
   if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
@@ -350,7 +349,7 @@ var getNewResizeStateFromSelectedColumns = exports.getNewResizeStateFromSelected
     isTableScalingEnabledOnCurrentTable = true;
     shouldUseIncreasedScalingPercent = true;
   }
-  resizeState = getResizeState({
+  var resizeState = getResizeState({
     minWidth: _styles.tableCellMinWidth,
     maxSize: maxSize,
     table: table.node,

package/dist/cjs/pm-plugins/view-mode-sort/utils.js

@@ -74,6 +74,9 @@ var toggleSort = exports.toggleSort = function toggleSort(view, event, pluginSta
   if (!tableId || !tableNode || (tableNode === null || tableNode === void 0 || (_tableNode$type = tableNode.type) === null || _tableNode$type === void 0 ? void 0 : _tableNode$type.name) !== 'table') {
     return;
   }
+
+  // Ignored via go/ees005
+  // eslint-disable-next-line prefer-const
   var _ref = (pluginState === null || pluginState === void 0 ? void 0 : pluginState[tableId]) || {},
     index = _ref.index,
     direction = _ref.direction,

package/dist/cjs/tablePlugin.js

@@ -253,14 +253,12 @@ var tablesPlugin = function tablesPlugin(_ref) {
             fullWidthEnabled = _ref5.fullWidthEnabled,
             tableOptions = _ref5.tableOptions,
             getEditorFeatureFlags = _ref5.getEditorFeatureFlags,
-            isTableScalingEnabled = _ref5.isTableScalingEnabled,
-            isNewColumnResizingEnabled = _ref5.isNewColumnResizingEnabled;
+            isTableScalingEnabled = _ref5.isTableScalingEnabled;
           var _pluginConfig2 = (0, _createPluginConfig.pluginConfig)(tableOptions),
-            allowColumnResizing = _pluginConfig2.allowColumnResizing,
-            allowTableAlignment = _pluginConfig2.allowTableAlignment;
+            allowColumnResizing = _pluginConfig2.allowColumnResizing;
           return allowColumnResizing ? (0, _plugin5.createPlugin)(dispatch, {
             lastColumnResizable: !fullWidthEnabled
-          }, defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled || false, isNewColumnResizingEnabled, allowTableAlignment, !!(options !== null && options !== void 0 && options.isCommentEditor)) : undefined;
+          }, defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled || false, !!(options !== null && options !== void 0 && options.isCommentEditor)) : undefined;
         }
       }, {
         name: 'tableEditing',

package/dist/cjs/ui/DragPreview/index.js

@@ -36,6 +36,7 @@ var DragPreview = exports.DragPreview = function DragPreview(_ref) {
       marginLeft: "".concat(marginLeft, "px"),
       // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
       marginTop: "".concat(marginTop, "px"),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
       transform: transform
     }
   }));

package/dist/cjs/ui/FloatingContextualButton/index.js

@@ -59,8 +59,7 @@ var FloatingContextualButtonInner = /*#__PURE__*/_react.default.memo(function (p
     }
   };
   var domAtPos = editorView.domAtPos.bind(editorView);
-  var targetCellRef;
-  targetCellRef = (0, _utils.findDomRefAtPos)(targetCellPosition, domAtPos);
+  var targetCellRef = (0, _utils.findDomRefAtPos)(targetCellPosition, domAtPos);
   (0, _react.useEffect)(function () {
     if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
       var state = editorView.state,

package/dist/cjs/ui/FloatingContextualMenu/ContextualMenu.js

@@ -112,14 +112,12 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
         var _node$attrs, _node$attrs2;
         var node = isOpen && targetCellPosition ? state.doc.nodeAt(targetCellPosition) : null;
         var background = (0, _editorPalette.hexToEditorBackgroundPaletteColor)((node === null || node === void 0 || (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.background) || '#ffffff');
-        var selectedRowIndex;
-        var selectedColumnIndex;
         var selectedRowAndColumnFromPalette = (0, _uiColor.getSelectedRowAndColumnFromPalette)(_uiColor.cellBackgroundColorPalette,
         // Ignored via go/ees005
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         background, _consts.colorPalletteColumns);
-        selectedRowIndex = selectedRowAndColumnFromPalette.selectedRowIndex;
-        selectedColumnIndex = selectedRowAndColumnFromPalette.selectedColumnIndex;
+        var selectedRowIndex = selectedRowAndColumnFromPalette.selectedRowIndex;
+        var selectedColumnIndex = selectedRowAndColumnFromPalette.selectedColumnIndex;
         return {
           content: isDragAndDropEnabled ? formatMessage(_messages.tableMessages.backgroundColor) : formatMessage(_messages.tableMessages.cellBackground),
           value: {

package/dist/cjs/ui/TableFullWidthLabel/index.js

@@ -15,6 +15,7 @@ var tableFullWidthLabelWrapperStyles = (0, _primitives.xcss)({
   backgroundColor: 'elevation.surface.overlay',
   borderRadius: 'border.radius',
   boxShadow: 'elevation.shadow.overlay',
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   lineHeight: 1,
   boxSizing: 'border-box',
   alignItems: 'center'

package/dist/cjs/ui/event-handlers.js

@@ -10,11 +10,13 @@ exports.withCellTracking = exports.whenTableInFocus = exports.isTableInFocus = v
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _rafSchd = _interopRequireDefault(require("raf-schd"));
 var _analytics = require("@atlaskit/editor-common/analytics");
+var _nesting = require("@atlaskit/editor-common/nesting");
 var _utils = require("@atlaskit/editor-common/utils");
 var _state5 = require("@atlaskit/editor-prosemirror/state");
+var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 var _tableMap = require("@atlaskit/editor-tables/table-map");
-var _utils2 = require("@atlaskit/editor-tables/utils");
+var _utils3 = require("@atlaskit/editor-tables/utils");
 var _commands = require("../pm-plugins/commands");
 var _pluginFactory = require("../pm-plugins/drag-and-drop/plugin-factory");
 var _pluginFactory2 = require("../pm-plugins/plugin-factory");
@@ -66,7 +68,7 @@ var handleClick = exports.handleClick = function handleClick(view, event) {
   var element = event.target;
   // Ignored via go/ees005
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  var table = (0, _utils2.findTable)(view.state.selection);
+  var table = (0, _utils3.findTable)(view.state.selection);
 
   // Ignored via go/ees005
   // eslint-disable-next-line @atlaskit/editor/no-as-casting
@@ -149,7 +151,16 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, m
       _dispatch2 = view.dispatch;
     return (0, _commands.hoverColumns)([_startIndex], false)(_state, _dispatch2);
   }
-  if (((0, _dom.isCell)(target) || (0, _dom.isCornerButton)(target)) && (typeof insertColumnButtonIndex === 'number' || typeof insertRowButtonIndex === 'number')) {
+  var isNestedTable = (0, _nesting.getParentOfTypeCount)(state.schema.nodes.table)(state.selection.$from) > 1;
+  if (isNestedTable) {
+    // if the table is nested inside a table, we only call hideInsertColumnOrRowButton if the table nearest to the mouse target is NOT the parent table
+    var nearestTable = (0, _utils.closestElement)(target, 'table');
+    var nestedTable = (0, _utils2.findParentNodeOfTypeClosestToPos)(state.doc.resolve(state.selection.from), [state.schema.nodes.table]);
+    var parentTable = (0, _utils2.findParentNodeOfTypeClosestToPos)(state.doc.resolve((nestedTable === null || nestedTable === void 0 ? void 0 : nestedTable.pos) || 0), [state.schema.nodes.table]);
+    if ((nearestTable === null || nearestTable === void 0 ? void 0 : nearestTable.dataset.tableLocalId) !== (parentTable === null || parentTable === void 0 ? void 0 : parentTable.node.attrs.localId)) {
+      return (0, _commands.hideInsertColumnOrRowButton)()(state, dispatch);
+    }
+  } else if (((0, _dom.isCell)(target) || (0, _dom.isCornerButton)(target)) && (typeof insertColumnButtonIndex === 'number' || typeof insertRowButtonIndex === 'number')) {
     return (0, _commands.hideInsertColumnOrRowButton)()(state, dispatch);
   }
   if ((0, _dom.isResizeHandleDecoration)(target)) {
@@ -319,7 +330,7 @@ var handleMouseMoveDebounce = function handleMouseMoveDebounce(nodeViewPortalPro
         var isKeyboardResize = (0, _pluginFactory2.getPluginState)(_state4).isKeyboardResize;
         var tableCell = (0, _utils.closestElement)(element, 'td, th');
         var cellStartPosition = view.posAtDOM(tableCell, 0);
-        var rect = (0, _utils2.findCellRectClosestToPos)(_state4.doc.resolve(cellStartPosition));
+        var rect = (0, _utils3.findCellRectClosestToPos)(_state4.doc.resolve(cellStartPosition));
         if (rect) {
           var columnEndIndexTarget = _positionColumn === 'left' ? rect.left : rect.right;
           var rowIndexTarget = rect.top;
@@ -354,7 +365,7 @@ var handleMouseMove = exports.handleMouseMove = function handleMouseMove(nodeVie
 function handleTripleClick(view, pos) {
   var state = view.state,
     dispatch = view.dispatch;
-  var $cellPos = (0, _utils2.cellAround)(state.doc.resolve(pos));
+  var $cellPos = (0, _utils3.cellAround)(state.doc.resolve(pos));
   if (!$cellPos) {
     return false;
   }
@@ -381,7 +392,7 @@ var handleCut = exports.handleCut = function handleCut(oldTr, oldState, newState
     var cellSelection = new _cellSelection.CellSelection($anchorCell, $headCell);
     tr.setSelection(cellSelection);
     if (tr.selection instanceof _cellSelection.CellSelection) {
-      var rect = (0, _utils2.getSelectionRect)(cellSelection);
+      var rect = (0, _utils3.getSelectionRect)(cellSelection);
       if (rect) {
         var _getSelectedCellInfo = (0, _analytics2.getSelectedCellInfo)(tr.selection),
           verticalCells = _getSelectedCellInfo.verticalCells,
@@ -409,7 +420,7 @@ var handleCut = exports.handleCut = function handleCut(oldTr, oldState, newState
         if (tr.selection instanceof _cellSelection.CellSelection) {
           var isTableSelected = tr.selection.isRowSelection() && tr.selection.isColSelection();
           if (isTableSelected) {
-            tr = (0, _utils2.removeTable)(tr);
+            tr = (0, _utils3.removeTable)(tr);
           } else if (tr.selection.isRowSelection()) {
             var _getPluginState9 = (0, _pluginFactory2.getPluginState)(newState),
               isHeaderRowRequired = _getPluginState9.pluginConfig.isHeaderRowRequired;

package/dist/cjs/ui/toolbar.js

@@ -373,10 +373,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
 
       // We don't want to show floating toolbar while resizing the table
       var isWidthResizing = tableWidthState === null || tableWidthState === void 0 ? void 0 : tableWidthState.resizing;
-
-      // Hide floating toolbar when resizing column and internal column width is on
-      var shouldHideToolbarForInternalColumnWidth = Boolean((options === null || options === void 0 ? void 0 : options.isNewColumnResizingEnabled) && resizeState && resizeState.dragging);
-      if (tableObject && pluginState.editorHasFocus && !isWidthResizing && !shouldHideToolbarForInternalColumnWidth) {
+      if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
         var nodeType = state.schema.nodes.table;
         var isNested = pluginState.tablePos && (0, _nodes.isTableNested)(state, pluginState.tablePos);
         var isTableScalingWithFixedColumnWidthsOptionShown = isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled && !isNested;

package/dist/es2019/nodeviews/TableContainer.js

@@ -208,7 +208,7 @@ export const ResizableTableContainer = /*#__PURE__*/React.memo(({
     // padding left = padding right = akEditorGutterPadding = 32
     responsiveContainerWidth = isTableScalingEnabled ? containerWidth - akEditorGutterPaddingDynamic() * 2 : containerWidth - akEditorGutterPaddingDynamic() * 2 - resizeHandleSpacing;
   }
-  let width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+  const width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
   if (!isResizing) {
     tableWidthRef.current = width;
   }