@atlaskit/editor-plugin-table 21.0.0 → 22.1.0

package/CHANGELOG.md

@@ -1,5 +1,57 @@
 # @atlaskit/editor-plugin-table
 
+## 22.1.0
+
+### Minor Changes
+
+- [`3394e81c10e6e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3394e81c10e6e) -
+  Fix table flicker on focus: defer data-initial-width-mode removal to after colgroup update.
+  Consolidate isTableInContentMode and hasTableBeenResized into editor-common/table.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 22.0.0
+
+### Major Changes
+
+- [`b47ee185c5ac4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b47ee185c5ac4) -
+  Remove deprecated dragAndDropEnabled plugin option Drag and drop table rows/ columns and advanced
+  table controls used to be toggled with dragAndDropEnabled table plugin option however we're
+  deprecating this prop to make this the default behaviour.
+
+  ```
+  // Before - to turn on drag and drop:
+
+  const createPreset = () =>
+    createDefaultPreset({ featureFlags: {}, paste: {} })
+      .add([tablePlugin, {tableOptions: {}, dragAndDropEnabled: true}])
+
+  const { preset } = usePreset(createPreset);
+
+  // Now - drag and drop enabled even without prop
+  const createPreset = () =>
+    createDefaultPreset({ featureFlags: {}, paste: {} })
+      .add([tablePlugin, {tableOptions: {}}])
+
+  const { preset } = usePreset(createPreset);
+  ```
+
+  The `dragAndDropEnabled` property has also been removed from the `TablePluginOptions` TypeScript
+  interface.
+
+  **Note:** If you previously set `dragAndDropEnabled: false` to explicitly disable drag and drop,
+  this is no longer supported — drag and drop is now always enabled and cannot be turned off via
+  this option.
+
+  If issues occur when bumping editor package, please check if dragAndDropEnabled is still present
+  in editor integration.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 21.0.0
 
 ### Major Changes

package/dist/cjs/nodeviews/TableComponent.js

@@ -21,6 +21,7 @@ var _collab = require("@atlaskit/editor-common/collab");
 var _nesting = require("@atlaskit/editor-common/nesting");
 var _nodeVisibility = require("@atlaskit/editor-common/node-visibility");
 var _nodeWidth = require("@atlaskit/editor-common/node-width");
+var _table = require("@atlaskit/editor-common/table");
 var _utils = require("@atlaskit/editor-common/utils");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _utils2 = require("@atlaskit/editor-tables/utils");
@@ -38,7 +39,8 @@ var _misc = require("../pm-plugins/table-resizing/utils/misc");
 var _resizeState = require("../pm-plugins/table-resizing/utils/resize-state");
 var _scaleTable = require("../pm-plugins/table-resizing/utils/scale-table");
 var _nodes = require("../pm-plugins/utils/nodes");
-var _table = require("../pm-plugins/utils/table");
+var _table2 = require("../pm-plugins/utils/table");
+var _tableMode = require("../pm-plugins/utils/tableMode");
 var _types = require("../types");
 var _eventHandlers = require("../ui/event-handlers");
 var _TableFloatingColumnControls = _interopRequireDefault(require("../ui/TableFloatingColumnControls"));
@@ -720,7 +722,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       var isNoOfRowsChanged = (0, _nodes.tablesHaveDifferentNoOfRows)(currentTable, previousTable);
       if (isNoOfColumnsChanged || isNoOfRowsChanged) {
         var _this$props$pluginInj;
-        (_this$props$pluginInj = this.props.pluginInjectionApi) === null || _this$props$pluginInj === void 0 || (_this$props$pluginInj = _this$props$pluginInj.accessibilityUtils) === null || _this$props$pluginInj === void 0 || _this$props$pluginInj.actions.ariaNotify((0, _table.getAssistiveMessage)(previousTable, currentTable, this.props.intl), {
+        (_this$props$pluginInj = this.props.pluginInjectionApi) === null || _this$props$pluginInj === void 0 || (_this$props$pluginInj = _this$props$pluginInj.accessibilityUtils) === null || _this$props$pluginInj === void 0 || _this$props$pluginInj.actions.ariaNotify((0, _table2.getAssistiveMessage)(previousTable, currentTable, this.props.intl), {
           priority: 'important'
         });
       }
@@ -737,10 +739,24 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           var view = this.props.view;
           var shouldRecreateResizeCols = !allowTableResizing || !isResizing || isNoOfColumnsChanged && isResizing;
           if (shouldRecreateResizeCols) {
+            var _this$table7, _this$props$options10, _this$props$options11;
             var start = getPos() || 0;
             var depth = view.state.doc.resolve(start).depth;
             shouldScale = depth === 0 && shouldScale;
             (0, _colgroup.insertColgroupFromNode)(this.table, currentTable, shouldScale, undefined, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor);
+
+            // Deferred from setDomAttrs — remove only once colgroup is updated and table has left content mode.
+            if ((_this$table7 = this.table) !== null && _this$table7 !== void 0 && _this$table7.hasAttribute('data-initial-width-mode') && !(0, _table.isTableInContentMode)({
+              tableNode: currentTable,
+              isSupported: (0, _tableMode.isContentModeSupported)({
+                allowColumnResizing: !!allowColumnResizing,
+                allowTableResizing: !!allowTableResizing,
+                isFullPageEditor: !((_this$props$options10 = this.props.options) !== null && _this$props$options10 !== void 0 && _this$props$options10.isCommentEditor) && !((_this$props$options11 = this.props.options) !== null && _this$props$options11 !== void 0 && _this$props$options11.isChromelessEditor)
+              }),
+              isTableNested: (0, _nodes.isTableNested)(view.state, getPos())
+            })) {
+              this.table.removeAttribute('data-initial-width-mode');
+            }
           }
           (0, _dom.updateControls)()(view.state);
         }
@@ -768,7 +784,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       var _this5 = this,
-        _this$props$options10;
+        _this$props$options12;
       var _this$props10 = this.props,
         view = _this$props10.view,
         getNode = _this$props10.getNode,
@@ -872,7 +888,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       var _getEditorFeatureFlag3 = getEditorFeatureFlags(),
         _getEditorFeatureFlag4 = _getEditorFeatureFlag3.tableWithFixedColumnWidthsOption,
         tableWithFixedColumnWidthsOption = _getEditorFeatureFlag4 === void 0 ? false : _getEditorFeatureFlag4;
-      var shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption || !!((_this$props$options10 = this.props.options) !== null && _this$props$options10 !== void 0 && _this$props$options10.isCommentEditor));
+      var shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption || !!((_this$props$options12 = this.props.options) !== null && _this$props$options12 !== void 0 && _this$props$options12.isCommentEditor));
       return /*#__PURE__*/_react.default.createElement(_TableContainer.TableContainer
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       , {

package/dist/cjs/nodeviews/table.js

@@ -16,13 +16,13 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _nodeWidth = require("@atlaskit/editor-common/node-width");
 var _reactNodeView = _interopRequireDefault(require("@atlaskit/editor-common/react-node-view"));
+var _table = require("@atlaskit/editor-common/table");
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _tableMap = require("@atlaskit/editor-tables/table-map");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
-var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
 var _createPluginConfig = require("../pm-plugins/create-plugin-config");
 var _pluginFactory = require("../pm-plugins/plugin-factory");
 var _tableWidth = require("../pm-plugins/table-width");
@@ -206,7 +206,9 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
   }, {
     key: "setDomAttrs",
     value: function setDomAttrs(node) {
-      var _this3 = this,
+      var _this$reactComponentP6,
+        _this$reactComponentP7,
+        _this3 = this,
         _this$reactComponentP8,
         _this$getEditorFeatur2,
         _this$options3,
@@ -215,19 +217,19 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
         return; // width / attribute application to actual table will happen later when table is set
       }
       var attrs = tableAttributes(node);
-      if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true)) {
-        var _this$reactComponentP6, _this$reactComponentP7;
-        if ((0, _tableMode.isTableInContentMode)({
-          node: node,
+
+      // render table with content-mode attribute which removes all width constraints from the table
+      // fire exposure here
+      if ((0, _table.isTableInContentMode)({
+        tableNode: node,
+        isSupported: (0, _tableMode.isContentModeSupported)({
           allowColumnResizing: !!this.reactComponentProps.allowColumnResizing,
           allowTableResizing: !!this.reactComponentProps.allowTableResizing,
-          isFullPageEditor: !((_this$reactComponentP6 = this.reactComponentProps.options) !== null && _this$reactComponentP6 !== void 0 && _this$reactComponentP6.isCommentEditor) && !((_this$reactComponentP7 = this.reactComponentProps.options) !== null && _this$reactComponentP7 !== void 0 && _this$reactComponentP7.isChromelessEditor),
-          isTableNested: (0, _nodes.isTableNested)(this.view.state, this.getPos())
-        }) && (0, _expValEquals.expValEquals)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true)) {
-          attrs['data-initial-width-mode'] = 'content';
-        } else {
-          this.table.removeAttribute('data-initial-width-mode');
-        }
+          isFullPageEditor: !((_this$reactComponentP6 = this.reactComponentProps.options) !== null && _this$reactComponentP6 !== void 0 && _this$reactComponentP6.isCommentEditor) && !((_this$reactComponentP7 = this.reactComponentProps.options) !== null && _this$reactComponentP7 !== void 0 && _this$reactComponentP7.isChromelessEditor)
+        }),
+        isTableNested: (0, _nodes.isTableNested)(this.view.state, this.getPos())
+      }) && (0, _expValEquals.expValEquals)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true)) {
+        attrs['data-initial-width-mode'] = 'content';
       }
       Object.keys(attrs).forEach(function (attr) {
         // Ignored via go/ees005

package/dist/cjs/nodeviews/toDOM.js

@@ -12,6 +12,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _kebabCase = _interopRequireDefault(require("lodash/kebabCase"));
 var _adfSchema = require("@atlaskit/adf-schema");
 var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
+var _table = require("@atlaskit/editor-common/table");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _colgroup = require("../pm-plugins/table-resizing/utils/colgroup");
 var _consts = require("../pm-plugins/table-resizing/utils/consts");
@@ -25,11 +26,13 @@ var tableNodeSpecWithFixedToDOM = exports.tableNodeSpecWithFixedToDOM = function
   return _objectSpread(_objectSpread({}, tableNode), {}, {
     toDOM: function toDOM(node) {
       var isFullPageEditor = !config.isChromelessEditor && !config.isCommentEditor;
-      var isInContentMode = (0, _tableMode.isTableInContentMode)({
-        node: node,
-        allowColumnResizing: config.allowColumnResizing,
-        allowTableResizing: config.tableResizingEnabled,
-        isFullPageEditor: isFullPageEditor,
+      var isInContentMode = (0, _table.isTableInContentMode)({
+        tableNode: node,
+        isSupported: (0, _tableMode.isContentModeSupported)({
+          allowColumnResizing: config.allowColumnResizing,
+          allowTableResizing: config.tableResizingEnabled,
+          isFullPageEditor: isFullPageEditor
+        }),
         isTableNested: config.isNested
       }) && (0, _expValEquals.expValEquals)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true);
       var alignmentStyle = Object.entries((0, _tableContainerStyles.getAlignmentStyle)(node.attrs.layout)).map(function (_ref) {

package/dist/cjs/pm-plugins/keymap.js

@@ -17,18 +17,18 @@ var _columnResize = require("./commands/column-resize");
 var _commandsWithAnalytics2 = require("./commands/commands-with-analytics");
 var _goToNextCell = require("./commands/go-to-next-cell");
 var _insert = require("./commands/insert");
-function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled) {
+function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI) {
   var _pluginInjectionApi$a;
-  var isTableScalingEnabled = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
-  var isTableAlignmentEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
-  var isFullWidthEnabled = arguments.length > 7 ? arguments[7] : undefined;
-  var pluginInjectionApi = arguments.length > 8 ? arguments[8] : undefined;
-  var getIntl = arguments.length > 9 ? arguments[9] : undefined;
-  var isTableFixedColumnWidthsOptionEnabled = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
-  var shouldUseIncreasedScalingPercent = arguments.length > 11 ? arguments[11] : undefined;
-  var isCommentEditor = arguments.length > 12 ? arguments[12] : undefined;
-  var isChromelessEditor = arguments.length > 13 ? arguments[13] : undefined;
-  var isTableResizingEnabled = arguments.length > 14 ? arguments[14] : undefined;
+  var isTableScalingEnabled = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
+  var isTableAlignmentEnabled = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
+  var isFullWidthEnabled = arguments.length > 6 ? arguments[6] : undefined;
+  var pluginInjectionApi = arguments.length > 7 ? arguments[7] : undefined;
+  var getIntl = arguments.length > 8 ? arguments[8] : undefined;
+  var isTableFixedColumnWidthsOptionEnabled = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
+  var shouldUseIncreasedScalingPercent = arguments.length > 10 ? arguments[10] : undefined;
+  var isCommentEditor = arguments.length > 11 ? arguments[11] : undefined;
+  var isChromelessEditor = arguments.length > 12 ? arguments[12] : undefined;
+  var isTableResizingEnabled = arguments.length > 13 ? arguments[13] : undefined;
   var list = {};
   var ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
   (0, _keymaps.bindKeymapWithCommand)(
@@ -99,7 +99,7 @@ function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, e
   // Ignored via go/ees005
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   _keymaps.addColumnAfterVO.common, (0, _insert.addColumnAfter)(api, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent), list);
-  if (dragAndDropEnabled && _keymaps.moveRowDown.common && _keymaps.moveRowUp.common && _keymaps.moveColumnLeft.common && _keymaps.moveColumnRight.common) {
+  if (_keymaps.moveRowDown.common && _keymaps.moveRowUp.common && _keymaps.moveColumnLeft.common && _keymaps.moveColumnRight.common) {
     var isNewKeyMapExperiment = (0, _expValEquals.expValEquals)('editor-a11y-fy26-keyboard-move-row-column', 'isEnabled', true);
     // Move row/column shortcuts
     /**

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

@@ -36,7 +36,7 @@ var _paste = require("./utils/paste");
 var _tableMode = require("./utils/tableMode");
 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 createPlugin = exports.createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) {
+var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) {
   var _accessibilityUtils;
   var state = (0, _pluginFactory.createPluginState)(dispatch, _objectSpread(_objectSpread(_objectSpread({
     pluginConfig: pluginConfig,
@@ -49,7 +49,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
     wasFullWidthModeEnabled: previousFullWidthModeEnabled,
     isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
     isHeaderColumnEnabled: false,
-    isDragAndDropEnabled: dragAndDropEnabled,
+    isDragAndDropEnabled: true,
     isTableScalingEnabled: isTableScalingEnabled
   }, _defaultTableSelection.defaultHoveredCell), _defaultTableSelection.defaultTableSelection), {}, {
     getIntl: getIntl
@@ -82,7 +82,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
       tableRow: (0, _tableNodeViews.tableRowView)({
         eventDispatcher: eventDispatcher,
         pluginInjectionApi: pluginInjectionApi,
-        isDragAndDropEnabled: dragAndDropEnabled
+        isDragAndDropEnabled: true
       }),
       tableCell: (0, _tableNodeViews.tableCellView)({
         eventDispatcher: eventDispatcher,

package/dist/cjs/pm-plugins/table-width.js

@@ -9,6 +9,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _steps = require("@atlaskit/adf-schema/steps");
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+var _table = require("@atlaskit/editor-common/table");
 var _document = require("@atlaskit/editor-common/utils/document");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
@@ -69,11 +70,13 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, dispat
       var tr = newState.tr;
       if (isReplaceDocumentOperation && !isCommentEditor) {
         newState.doc.forEach(function (node, offset) {
-          if ((0, _tableMode.isTableInContentMode)({
-            node: node,
-            allowColumnResizing: true,
-            allowTableResizing: true,
-            isFullPageEditor: true,
+          if ((0, _table.isTableInContentMode)({
+            tableNode: node,
+            isSupported: (0, _tableMode.isContentModeSupported)({
+              allowColumnResizing: true,
+              allowTableResizing: true,
+              isFullPageEditor: true
+            }),
             isTableNested: false
           })) {
             return;

package/dist/cjs/pm-plugins/utils/tableMode.js

@@ -3,41 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isTableInContentMode = exports.isContentModeSupported = exports.hasTableBeenResized = exports.applyMeasuredWidthToSelectedTable = exports.applyMeasuredWidthToAllTables = void 0;
+exports.isContentModeSupported = exports.applyMeasuredWidthToSelectedTable = exports.applyMeasuredWidthToAllTables = void 0;
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _styles = require("@atlaskit/editor-common/styles");
+var _table = require("@atlaskit/editor-common/table");
 var _utils = require("@atlaskit/editor-tables/utils");
-var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
-var _colgroup = require("../table-resizing/utils/colgroup");
 var _contentMode = require("../transforms/content-mode");
-var _alignment = require("./alignment");
-var isTableInContentMode = exports.isTableInContentMode = function isTableInContentMode(_ref) {
+var isContentModeSupported = exports.isContentModeSupported = function isContentModeSupported(_ref) {
   var allowColumnResizing = _ref.allowColumnResizing,
     allowTableResizing = _ref.allowTableResizing,
-    isFullPageEditor = _ref.isFullPageEditor,
-    isTableNested = _ref.isTableNested,
-    node = _ref.node;
-  if (!(0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true)) {
-    return false;
-  }
-  if (!node || isTableNested) {
-    return false;
-  }
-  return isContentModeSupported({
-    allowColumnResizing: allowColumnResizing,
-    allowTableResizing: allowTableResizing,
-    isFullPageEditor: isFullPageEditor
-  }) && !hasTableBeenResized(node) && node.attrs.layout === _alignment.ALIGN_START;
-};
-var isContentModeSupported = exports.isContentModeSupported = function isContentModeSupported(_ref2) {
-  var allowColumnResizing = _ref2.allowColumnResizing,
-    allowTableResizing = _ref2.allowTableResizing,
-    isFullPageEditor = _ref2.isFullPageEditor;
+    isFullPageEditor = _ref.isFullPageEditor;
   return allowColumnResizing && allowTableResizing && isFullPageEditor;
 };
-var hasTableBeenResized = exports.hasTableBeenResized = function hasTableBeenResized(node) {
-  return node.attrs.width !== null || (0, _colgroup.hasTableColumnBeenResized)(node);
-};
 
 /**
  * Iterates all top-level tables in the document, and for those in content mode,
@@ -55,7 +32,7 @@ var applyMeasuredWidthToAllTables = exports.applyMeasuredWidthToAllTables = func
 
   // modify only top-level tables
   doc.forEach(function (node, offset) {
-    if (node.type !== table || hasTableBeenResized(node) && node.attrs.layout !== _alignment.ALIGN_START) {
+    if (node.type !== table || (0, _table.hasTableBeenResized)(node) && node.attrs.layout !== 'align-start') {
       return;
     }
     var domNode = view.domAtPos(offset + 1).node;
@@ -70,10 +47,10 @@ var applyMeasuredWidthToAllTables = exports.applyMeasuredWidthToAllTables = func
       measurement: (0, _contentMode.getTableMeasurement)(tableRef)
     });
   });
-  measuredTables.forEach(function (_ref3) {
-    var node = _ref3.node,
-      offset = _ref3.offset,
-      measurement = _ref3.measurement;
+  measuredTables.forEach(function (_ref2) {
+    var node = _ref2.node,
+      offset = _ref2.offset,
+      measurement = _ref2.measurement;
     tr = (0, _contentMode.applyTableMeasurement)(tr, node, measurement, offset);
     modified = true;
   });
@@ -87,8 +64,8 @@ var applyMeasuredWidthToAllTables = exports.applyMeasuredWidthToAllTables = func
       attributes: {
         editorContainerWidth: (_pluginInjectionApi$w = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$w2 = pluginInjectionApi.width) === null || _pluginInjectionApi$w2 === void 0 || (_pluginInjectionApi$w2 = _pluginInjectionApi$w2.sharedState.currentState()) === null || _pluginInjectionApi$w2 === void 0 ? void 0 : _pluginInjectionApi$w2.width) !== null && _pluginInjectionApi$w !== void 0 ? _pluginInjectionApi$w : 0,
         totalTablesResized: measuredTables.length,
-        measurements: measuredTables.map(function (_ref4) {
-          var measurement = _ref4.measurement;
+        measurements: measuredTables.map(function (_ref3) {
+          var measurement = _ref3.measurement;
           return {
             tableWidth: measurement.tableWidth,
             totalColumnCount: measurement.colWidths.length
@@ -99,6 +76,10 @@ var applyMeasuredWidthToAllTables = exports.applyMeasuredWidthToAllTables = func
     view.dispatch(tr.setMeta('addToHistory', false));
   }
 };
+
+/**
+ * Used to measure a selected table width with it's content being laid out natively by the browser
+ */
 var applyMeasuredWidthToSelectedTable = exports.applyMeasuredWidthToSelectedTable = function applyMeasuredWidthToSelectedTable(view, api) {
   var _api$analytics, _api$width$sharedStat, _api$width;
   var tableObject = (0, _utils.findTable)(view.state.selection);

package/dist/cjs/tablePlugin.js

@@ -75,7 +75,6 @@ var tablePlugin = function tablePlugin(_ref) {
   };
   var options = _objectSpread(_objectSpread({}, config), {}, {
     tableOptions: (_config$tableOptions = config === null || config === void 0 ? void 0 : config.tableOptions) !== null && _config$tableOptions !== void 0 ? _config$tableOptions : {},
-    dragAndDropEnabled: (config === null || config === void 0 ? void 0 : config.dragAndDropEnabled) || (0, _platformFeatureFlags.fg)('platform_editor_enable_table_dnd'),
     isTableScalingEnabled: (config === null || config === void 0 ? void 0 : config.isTableScalingEnabled) || (0, _platformFeatureFlags.fg)('platform_editor_enable_table_scaling')
   });
   var defaultGetEditorContainerWidth = function defaultGetEditorContainerWidth() {
@@ -292,11 +291,10 @@ var tablePlugin = function tablePlugin(_ref) {
             wasFullWidthEnabled = _ref3.wasFullWidthEnabled,
             tableOptions = _ref3.tableOptions,
             getEditorFeatureFlags = _ref3.getEditorFeatureFlags,
-            dragAndDropEnabled = _ref3.dragAndDropEnabled,
             isTableScalingEnabled = _ref3.isTableScalingEnabled,
             isCommentEditor = _ref3.isCommentEditor,
             isChromelessEditor = _ref3.isChromelessEditor;
-          return (0, _main.createPlugin)(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, (0, _createPluginConfig.pluginConfig)(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
+          return (0, _main.createPlugin)(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, (0, _createPluginConfig.pluginConfig)(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
         }
       }, {
         name: 'tablePMColResizing',
@@ -328,7 +326,6 @@ var tablePlugin = function tablePlugin(_ref) {
           var getIntl = _ref6.getIntl,
             nodeViewPortalProviderAPI = _ref6.nodeViewPortalProviderAPI;
           var _ref7 = options || {},
-            dragAndDropEnabled = _ref7.dragAndDropEnabled,
             _ref7$isTableScalingE = _ref7.isTableScalingEnabled,
             isTableScalingEnabled = _ref7$isTableScalingE === void 0 ? false : _ref7$isTableScalingE,
             _ref7$fullWidthEnable = _ref7.fullWidthEnabled,
@@ -338,7 +335,7 @@ var tablePlugin = function tablePlugin(_ref) {
             _ref7$isChromelessEdi = _ref7.isChromelessEditor,
             isChromelessEditor = _ref7$isChromelessEdi === void 0 ? false : _ref7$isChromelessEdi,
             tableOptions = _ref7.tableOptions;
-          return (0, _keymap.keymapPlugin)(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
+          return (0, _keymap.keymapPlugin)(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
         }
       }, {
         name: 'tableSelectionKeymap',
@@ -349,12 +346,10 @@ var tablePlugin = function tablePlugin(_ref) {
       }, {
         name: 'tableEditing',
         plugin: function plugin() {
-          var _ref9 = options || {},
-            dragAndDropEnabled = _ref9.dragAndDropEnabled;
           return (0, _pmPlugins.tableEditing)({
-            reportFixedTable: function reportFixedTable(_ref0) {
-              var tr = _ref0.tr,
-                reason = _ref0.reason;
+            reportFixedTable: function reportFixedTable(_ref9) {
+              var tr = _ref9.tr,
+                reason = _ref9.reason;
               editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
                 action: _analytics.TABLE_ACTION.FIXED,
                 actionSubject: _analytics.ACTION_SUBJECT.TABLE,
@@ -365,71 +360,71 @@ var tablePlugin = function tablePlugin(_ref) {
                 eventType: _analytics.EVENT_TYPE.TRACK
               })(tr);
             },
-            dragAndDropEnabled: dragAndDropEnabled
+            dragAndDropEnabled: true
           });
         }
       }, {
         name: 'tableStickyHeaders',
-        plugin: function plugin(_ref1) {
-          var dispatch = _ref1.dispatch;
+        plugin: function plugin(_ref0) {
+          var dispatch = _ref0.dispatch;
           return options && options.tableOptions.stickyHeaders ? (0, _plugin4.createPlugin)(dispatch, function () {
             return [];
           }) : undefined;
         }
       }, {
         name: 'tableDragAndDrop',
-        plugin: function plugin(_ref10) {
-          var dispatch = _ref10.dispatch;
-          return options !== null && options !== void 0 && options.dragAndDropEnabled ? (0, _plugin3.createPlugin)(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor, api) : undefined;
+        plugin: function plugin(_ref1) {
+          var dispatch = _ref1.dispatch;
+          return (0, _plugin3.createPlugin)(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor, api);
         }
       }, {
         name: 'tableViewModeSort',
-        plugin: function plugin(_ref11) {
-          var nodeViewPortalProviderAPI = _ref11.nodeViewPortalProviderAPI;
+        plugin: function plugin(_ref10) {
+          var nodeViewPortalProviderAPI = _ref10.nodeViewPortalProviderAPI;
           return api !== null && api !== void 0 && api.editorViewMode ? (0, _viewModeSort.createPlugin)(api, nodeViewPortalProviderAPI) : undefined;
         }
       }, {
         name: 'tableLocalId',
-        plugin: function plugin(_ref12) {
-          var dispatch = _ref12.dispatch;
+        plugin: function plugin(_ref11) {
+          var dispatch = _ref11.dispatch;
           return !(0, _platformFeatureFlags.fg)('platform_editor_adf_with_localid') ? (0, _tableLocalId.createPlugin)(dispatch) : undefined;
         }
       }, {
         name: 'tableWidth',
-        plugin: function plugin(_ref13) {
+        plugin: function plugin(_ref12) {
           var _options$fullWidthEna, _options$maxWidthEnab, _options$isTableScali, _options$tableOptions3, _options$isCommentEdi;
-          var dispatchAnalyticsEvent = _ref13.dispatchAnalyticsEvent,
-            dispatch = _ref13.dispatch;
+          var dispatchAnalyticsEvent = _ref12.dispatchAnalyticsEvent,
+            dispatch = _ref12.dispatch;
           return options !== null && options !== void 0 && options.tableOptions.allowTableResizing ? (0, _tableWidth.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$maxWidthEnab = options.maxWidthEnabled) !== null && _options$maxWidthEnab !== void 0 ? _options$maxWidthEnab : false, (_options$isTableScali = options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$tableOptions3 = options.tableOptions.allowTableResizing) !== null && _options$tableOptions3 !== void 0 ? _options$tableOptions3 : false, (_options$isCommentEdi = options.isCommentEditor) !== null && _options$isCommentEdi !== void 0 ? _options$isCommentEdi : false) : undefined;
         }
       }, {
         name: 'tableWidthInCommentFix',
-        plugin: function plugin(_ref14) {
+        plugin: function plugin(_ref13) {
           var _options$tableOptions4;
-          var dispatch = _ref14.dispatch;
+          var dispatch = _ref13.dispatch;
           return options !== null && options !== void 0 && options.tableOptions.allowTableResizing && options !== null && options !== void 0 && options.isCommentEditor ? (0, _tableWidthInCommentFix.createPlugin)(dispatch, (_options$tableOptions4 = options.tableOptions.allowTableAlignment) !== null && _options$tableOptions4 !== void 0 ? _options$tableOptions4 : false) : undefined;
         }
       },
       // TODO: ED-26961 - should be deprecated and eventually replaced with 'tableAnalyticsPlugin'
       {
         name: 'tableOverflowAnalyticsPlugin',
-        plugin: function plugin(_ref15) {
+        plugin: function plugin(_ref14) {
           var _options$tableOptions5;
-          var dispatch = _ref15.dispatch,
-            dispatchAnalyticsEvent = _ref15.dispatchAnalyticsEvent;
+          var dispatch = _ref14.dispatch,
+            dispatchAnalyticsEvent = _ref14.dispatchAnalyticsEvent;
           return (0, _tableAnalytics.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$tableOptions5 = options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing) !== null && _options$tableOptions5 !== void 0 ? _options$tableOptions5 : false);
         }
       }, {
         name: 'tableAnalyticsPlugin',
-        plugin: function plugin(_ref16) {
-          var dispatch = _ref16.dispatch,
-            dispatchAnalyticsEvent = _ref16.dispatchAnalyticsEvent;
+        plugin: function plugin(_ref15) {
+          var dispatch = _ref15.dispatch,
+            dispatchAnalyticsEvent = _ref15.dispatchAnalyticsEvent;
           return (0, _plugin.createPlugin)(dispatch, dispatchAnalyticsEvent);
         }
       }, {
         name: 'tableGetEditorViewReferencePlugin',
-        plugin: function plugin(_ref17) {
-          var dispatchAnalyticsEvent = _ref17.dispatchAnalyticsEvent;
+        plugin: function plugin(_ref16) {
+          var dispatchAnalyticsEvent = _ref16.dispatchAnalyticsEvent;
           return new _safePlugin.SafePlugin({
             view: function view(editorView) {
               editorViewRef.current = editorView;
@@ -483,8 +478,8 @@ var tablePlugin = function tablePlugin(_ref) {
         }
       }, {
         name: 'tableSizeSelectorPlugin',
-        plugin: function plugin(_ref18) {
-          var dispatch = _ref18.dispatch;
+        plugin: function plugin(_ref17) {
+          var dispatch = _ref17.dispatch;
           return isTableSelectorEnabled ? (0, _tableSizeSelector.createPlugin)(dispatch) : undefined;
         }
       }, {
@@ -515,12 +510,12 @@ var tablePlugin = function tablePlugin(_ref) {
       }
       return plugins;
     },
-    contentComponent: function contentComponent(_ref19) {
-      var editorView = _ref19.editorView,
-        popupsMountPoint = _ref19.popupsMountPoint,
-        popupsBoundariesElement = _ref19.popupsBoundariesElement,
-        popupsScrollableElement = _ref19.popupsScrollableElement,
-        dispatchAnalyticsEvent = _ref19.dispatchAnalyticsEvent;
+    contentComponent: function contentComponent(_ref18) {
+      var editorView = _ref18.editorView,
+        popupsMountPoint = _ref18.popupsMountPoint,
+        popupsBoundariesElement = _ref18.popupsBoundariesElement,
+        popupsScrollableElement = _ref18.popupsScrollableElement,
+        dispatchAnalyticsEvent = _ref18.dispatchAnalyticsEvent;
       return /*#__PURE__*/_react.default.createElement(_ContentComponent.ContentComponent, {
         api: api,
         editorView: editorView,
@@ -535,8 +530,8 @@ var tablePlugin = function tablePlugin(_ref) {
       });
     },
     pluginsOptions: {
-      quickInsert: function quickInsert(_ref20) {
-        var formatMessage = _ref20.formatMessage;
+      quickInsert: function quickInsert(_ref19) {
+        var formatMessage = _ref19.formatMessage;
         return [{
           id: 'table',
           title: formatMessage(_messages.toolbarInsertBlockMessages.table),
@@ -606,8 +601,8 @@ var tablePlugin = function tablePlugin(_ref) {
         return editorViewRef.current;
       }, options, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)((0, _createPluginConfig.pluginConfig)(options === null || options === void 0 ? void 0 : options.tableOptions))
     },
-    usePluginHook: function usePluginHook(_ref21) {
-      var editorView = _ref21.editorView;
+    usePluginHook: function usePluginHook(_ref20) {
+      var editorView = _ref20.editorView;
       var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['editorViewMode'], function (states) {
           var _states$editorViewMod;
           return {

package/dist/cjs/ui/ContentComponent.js

@@ -219,7 +219,6 @@ var ContentComponent = exports.ContentComponent = function ContentComponent(_ref
     fallbackComponent: null
   }, /*#__PURE__*/_react.default.createElement(_globalStyles.GlobalStylesWrapper, {
     featureFlags: api === null || api === void 0 || (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState(),
-    isDragAndDropEnabledOption: options === null || options === void 0 ? void 0 : options.dragAndDropEnabled,
     api: api
   }), /*#__PURE__*/_react.default.createElement(ContentComponentInternal, {
     api: api,

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

@@ -15,7 +15,6 @@ var _commonStyles = require("./common-styles");
 
 var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWrapper(_ref) {
   var featureFlags = _ref.featureFlags,
-    isDragAndDropEnabledOption = _ref.isDragAndDropEnabledOption,
     api = _ref.api;
   var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['editorViewMode'], function (states) {
       var _states$editorViewMod;
@@ -28,7 +27,7 @@ var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWra
   return (0, _react.jsx)(_react.Global, {
     styles: (0, _commonStyles.tableStyles)({
       featureFlags: featureFlags,
-      isDragAndDropEnabled: isDragAndDropEnabledOption && !isLivePageViewMode
+      isDragAndDropEnabled: !isLivePageViewMode
     })
   });
 };