@atlaskit/editor-plugin-table 7.5.4 → 7.5.6

package/dist/cjs/nodeviews/table.js

@@ -79,7 +79,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "hasHoveredRows", false);
     _this.getPos = props.getPos;
     _this.eventDispatcher = props.eventDispatcher;
-    _this.getEditorFeatureFlags = props.getEditorFeatureFlags;
+    _this.options = props.options;
     return _this;
   }
   (0, _createClass2.default)(TableView, [{
@@ -87,12 +87,10 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
     value: function getContentDOM() {
       var rendered = _model.DOMSerializer.renderSpec(document, toDOM(this.node, this.reactComponentProps));
       if (rendered.dom) {
+        var _this$options;
         this.table = rendered.dom;
-        var _this$getEditorFeatur = this.getEditorFeatureFlags(),
-          _this$getEditorFeatur2 = _this$getEditorFeatur.tablePreserveWidth,
-          tablePreserveWidth = _this$getEditorFeatur2 === void 0 ? false : _this$getEditorFeatur2;
         // Preserve Table Width cannot have inline width set on the table
-        if (!tablePreserveWidth) {
+        if (!((_this$options = this.options) !== null && _this$options !== void 0 && _this$options.isTableScalingEnabled)) {
           var tableInlineWidth = getInlineWidth(this.node, this.reactComponentProps.options, this.reactComponentProps.view.state, this.reactComponentProps.getPos());
           if (tableInlineWidth) {
             handleInlineTableWidth(this.table, tableInlineWidth);
@@ -186,6 +184,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
             isHeaderRowEnabled: pluginState.isHeaderRowEnabled,
             isHeaderColumnEnabled: pluginState.isHeaderColumnEnabled,
             isDragAndDropEnabled: pluginState.isDragAndDropEnabled,
+            isTableScalingEnabled: pluginState.isTableScalingEnabled,
             tableActive: tableActive,
             ordering: pluginState.ordering,
             isResizing: isResizing,
@@ -194,8 +193,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
             contentDOM: forwardRef,
             getEditorFeatureFlags: props.getEditorFeatureFlags,
             dispatchAnalyticsEvent: props.dispatchAnalyticsEvent,
-            pluginInjectionApi: props.pluginInjectionApi,
-            tableRef: _this3.table
+            pluginInjectionApi: props.pluginInjectionApi
           });
         }
       });
@@ -267,7 +265,8 @@ var createTableView = exports.createTableView = function createTableView(node, v
     isFullWidthModeEnabled = _getPluginState2.isFullWidthModeEnabled,
     wasFullWidthModeEnabled = _getPluginState2.wasFullWidthModeEnabled,
     isTableResizingEnabled = _getPluginState2.isTableResizingEnabled,
-    isDragAndDropEnabled = _getPluginState2.isDragAndDropEnabled;
+    isDragAndDropEnabled = _getPluginState2.isDragAndDropEnabled,
+    isTableScalingEnabled = _getPluginState2.isTableScalingEnabled;
   var _getPluginConfig = (0, _createPluginConfig.pluginConfig)(pluginConfig),
     allowColumnResizing = _getPluginConfig.allowColumnResizing;
   var hasIntlContext = true;
@@ -283,7 +282,8 @@ var createTableView = exports.createTableView = function createTableView(node, v
       isFullWidthModeEnabled: isFullWidthModeEnabled,
       wasFullWidthModeEnabled: wasFullWidthModeEnabled,
       isTableResizingEnabled: isTableResizingEnabled,
-      isDragAndDropEnabled: isDragAndDropEnabled
+      isDragAndDropEnabled: isDragAndDropEnabled,
+      isTableScalingEnabled: isTableScalingEnabled
     },
     getEditorContainerWidth: getEditorContainerWidth,
     getEditorFeatureFlags: getEditorFeatureFlags,

package/dist/cjs/plugin.js

@@ -25,6 +25,7 @@ var _plugin2 = require("./pm-plugins/decorations/plugin");
 var _dragAndDrop = require("./pm-plugins/drag-and-drop");
 var _keymap = require("./pm-plugins/keymap");
 var _main = require("./pm-plugins/main");
+var _pluginFactory = require("./pm-plugins/plugin-factory");
 var _pluginKey2 = require("./pm-plugins/plugin-key");
 var _safariDeleteCompositionTextIssueWorkaround = require("./pm-plugins/safari-delete-composition-text-issue-workaround");
 var _stickyHeaders = require("./pm-plugins/sticky-headers");
@@ -56,11 +57,10 @@ var tablesPlugin = function tablesPlugin(_ref) {
     current: null
   };
   var defaultGetEditorContainerWidth = function defaultGetEditorContainerWidth() {
-    var _document$body$offset, _document, _api$width$sharedStat, _api$width;
-    var defaultState = {
+    var _api$width$sharedStat, _api$width, _document$body$offset, _document;
+    return (_api$width$sharedStat = api === null || api === void 0 || (_api$width = api.width) === null || _api$width === void 0 ? void 0 : _api$width.sharedState.currentState()) !== null && _api$width$sharedStat !== void 0 ? _api$width$sharedStat : {
       width: (_document$body$offset = (_document = document) === null || _document === void 0 || (_document = _document.body) === null || _document === void 0 ? void 0 : _document.offsetWidth) !== null && _document$body$offset !== void 0 ? _document$body$offset : 500
     };
-    return (_api$width$sharedStat = api === null || api === void 0 || (_api$width = api.width) === null || _api$width === void 0 ? void 0 : _api$width.sharedState.currentState()) !== null && _api$width$sharedStat !== void 0 ? _api$width$sharedStat : defaultState;
   };
   var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   return {
@@ -77,7 +77,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
       insertTable: function insertTable(analyticsPayload) {
         return function (state, dispatch) {
           var _api$contentInsertion, _api$contentInsertion2;
-          var node = (0, _utils2.createTableWithWidth)(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags)(state.schema);
+          var node = (0, _utils2.createTableWithWidth)(options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, options === null || options === void 0 ? void 0 : options.fullWidthEnabled)(state.schema);
           return (_api$contentInsertion = api === null || api === void 0 || (_api$contentInsertion2 = api.contentInsertion) === null || _api$contentInsertion2 === void 0 || (_api$contentInsertion2 = _api$contentInsertion2.actions) === null || _api$contentInsertion2 === void 0 ? void 0 : _api$contentInsertion2.insert({
             state: state,
             dispatch: dispatch,
@@ -91,7 +91,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
       }
     },
     commands: {
-      insertTableWithSize: (0, _insert.insertTableWithSize)(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions)
+      insertTableWithSize: (0, _insert.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 ? _adfSchema.tableWithCustomWidth : _adfSchema.table;
@@ -125,8 +125,9 @@ var tablesPlugin = function tablesPlugin(_ref) {
             breakoutEnabled = _ref3.breakoutEnabled,
             tableOptions = _ref3.tableOptions,
             getEditorFeatureFlags = _ref3.getEditorFeatureFlags,
-            dragAndDropEnabled = _ref3.dragAndDropEnabled;
-          return (0, _main.createPlugin)(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, (0, _createPluginConfig.pluginConfig)(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api);
+            dragAndDropEnabled = _ref3.dragAndDropEnabled,
+            isTableScalingEnabled = _ref3.isTableScalingEnabled;
+          return (0, _main.createPlugin)(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, (0, _createPluginConfig.pluginConfig)(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled);
         }
       }, {
         name: 'tablePMColResizing',
@@ -155,8 +156,9 @@ var tablesPlugin = function tablesPlugin(_ref) {
         plugin: function plugin() {
           var _ref6 = options || {},
             dragAndDropEnabled = _ref6.dragAndDropEnabled,
-            getEditorFeatureFlags = _ref6.getEditorFeatureFlags;
-          return (0, _keymap.keymapPlugin)(defaultGetEditorContainerWidth, editorAnalyticsAPI, getEditorFeatureFlags, dragAndDropEnabled);
+            _ref6$isTableScalingE = _ref6.isTableScalingEnabled,
+            isTableScalingEnabled = _ref6$isTableScalingE === void 0 ? false : _ref6$isTableScalingE;
+          return (0, _keymap.keymapPlugin)(defaultGetEditorContainerWidth, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled);
         }
       }, {
         name: 'tableSelectionKeymap',
@@ -190,47 +192,45 @@ var tablesPlugin = function tablesPlugin(_ref) {
         plugin: function plugin(_ref9) {
           var dispatch = _ref9.dispatch,
             eventDispatcher = _ref9.eventDispatcher;
-          return options && options.tableOptions.stickyHeaders ? (0, _stickyHeaders.createPlugin)(dispatch, eventDispatcher, function () {
+          return options && options.tableOptions.stickyHeaders ? (0, _stickyHeaders.createPlugin)(dispatch, function () {
             return [];
-          }, (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags) : undefined;
+          }) : undefined;
         }
       }, {
         name: 'tableDragAndDrop',
         plugin: function plugin(_ref10) {
           var dispatch = _ref10.dispatch;
-          var _ref11 = options || {},
-            getEditorFeatureFlags = _ref11.getEditorFeatureFlags;
-          return options !== null && options !== void 0 && options.dragAndDropEnabled ? (0, _dragAndDrop.createPlugin)(dispatch, getEditorFeatureFlags, editorAnalyticsAPI) : undefined;
+          return options !== null && options !== void 0 && options.dragAndDropEnabled ? (0, _dragAndDrop.createPlugin)(dispatch, editorAnalyticsAPI) : undefined;
         }
       }, {
         name: 'tableLocalId',
-        plugin: function plugin(_ref12) {
-          var dispatch = _ref12.dispatch;
+        plugin: function plugin(_ref11) {
+          var dispatch = _ref11.dispatch;
           return (0, _tableLocalId.createPlugin)(dispatch);
         }
       }, {
         name: 'tableWidth',
-        plugin: function plugin(_ref13) {
+        plugin: function plugin(_ref12) {
           var _options$fullWidthEna;
-          var dispatchAnalyticsEvent = _ref13.dispatchAnalyticsEvent,
-            dispatch = _ref13.dispatch;
-          return options !== null && options !== void 0 && options.tableResizingEnabled ? (0, _tableWidth.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options === null || options === void 0 ? void 0 : options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) : undefined;
+          var dispatchAnalyticsEvent = _ref12.dispatchAnalyticsEvent,
+            dispatch = _ref12.dispatch;
+          return options !== null && options !== void 0 && options.tableResizingEnabled ? (0, _tableWidth.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options === null || options === void 0 ? void 0 : options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false) : undefined;
         }
       },
       // TODO: should be deprecated and eventually replaced with 'tableAnalyticsPlugin'
       {
         name: 'tableOverflowAnalyticsPlugin',
-        plugin: function plugin(_ref14) {
+        plugin: function plugin(_ref13) {
           var _options$tableResizin;
-          var dispatch = _ref14.dispatch,
-            dispatchAnalyticsEvent = _ref14.dispatchAnalyticsEvent;
+          var dispatch = _ref13.dispatch,
+            dispatchAnalyticsEvent = _ref13.dispatchAnalyticsEvent;
           return (0, _tableAnalytics.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$tableResizin = options === null || options === void 0 ? void 0 : options.tableResizingEnabled) !== null && _options$tableResizin !== void 0 ? _options$tableResizin : false);
         }
       }, {
         name: 'tableAnalyticsPlugin',
-        plugin: function plugin(_ref15) {
-          var dispatch = _ref15.dispatch,
-            dispatchAnalyticsEvent = _ref15.dispatchAnalyticsEvent;
+        plugin: function plugin(_ref14) {
+          var dispatch = _ref14.dispatch,
+            dispatchAnalyticsEvent = _ref14.dispatchAnalyticsEvent;
           return (0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.analytics-plugin-moved-event') ? (0, _plugin.createPlugin)(dispatch, dispatchAnalyticsEvent) : undefined;
         }
       }, {
@@ -261,12 +261,12 @@ var tablesPlugin = function tablesPlugin(_ref) {
       }
       return plugins;
     },
-    contentComponent: function contentComponent(_ref16) {
-      var editorView = _ref16.editorView,
-        popupsMountPoint = _ref16.popupsMountPoint,
-        popupsBoundariesElement = _ref16.popupsBoundariesElement,
-        popupsScrollableElement = _ref16.popupsScrollableElement,
-        dispatchAnalyticsEvent = _ref16.dispatchAnalyticsEvent;
+    contentComponent: function contentComponent(_ref15) {
+      var editorView = _ref15.editorView,
+        popupsMountPoint = _ref15.popupsMountPoint,
+        popupsBoundariesElement = _ref15.popupsBoundariesElement,
+        popupsScrollableElement = _ref15.popupsScrollableElement,
+        dispatchAnalyticsEvent = _ref15.dispatchAnalyticsEvent;
       return /*#__PURE__*/_react.default.createElement(_errorBoundary.ErrorBoundary, {
         component: _analytics.ACTION_SUBJECT.TABLES_PLUGIN,
         dispatchAnalyticsEvent: dispatchAnalyticsEvent,
@@ -280,30 +280,30 @@ var tablesPlugin = function tablesPlugin(_ref) {
           stickyHeadersState: _stickyHeaders.pluginKey,
           dragAndDropState: _dragAndDrop.pluginKey
         },
-        render: function render(_ref17) {
-          var resizingPluginState = _ref17.tableResizingPluginState,
-            stickyHeadersState = _ref17.stickyHeadersState,
-            tablePluginState = _ref17.tablePluginState,
-            tableWidthPluginState = _ref17.tableWidthPluginState,
-            dragAndDropState = _ref17.dragAndDropState;
+        render: function render(_ref16) {
+          var resizingPluginState = _ref16.tableResizingPluginState,
+            stickyHeadersState = _ref16.stickyHeadersState,
+            tablePluginState = _ref16.tablePluginState,
+            tableWidthPluginState = _ref16.tableWidthPluginState,
+            dragAndDropState = _ref16.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;
-          var _ref18 = tablePluginState,
-            tableNode = _ref18.tableNode,
-            tablePos = _ref18.tablePos,
-            targetCellPosition = _ref18.targetCellPosition,
-            isContextualMenuOpen = _ref18.isContextualMenuOpen,
-            layout = _ref18.layout,
-            tableRef = _ref18.tableRef,
-            pluginConfig = _ref18.pluginConfig,
-            insertColumnButtonIndex = _ref18.insertColumnButtonIndex,
-            insertRowButtonIndex = _ref18.insertRowButtonIndex,
-            isHeaderColumnEnabled = _ref18.isHeaderColumnEnabled,
-            isHeaderRowEnabled = _ref18.isHeaderRowEnabled,
-            isDragAndDropEnabled = _ref18.isDragAndDropEnabled,
-            tableWrapperTarget = _ref18.tableWrapperTarget;
+          var _ref17 = tablePluginState,
+            tableNode = _ref17.tableNode,
+            tablePos = _ref17.tablePos,
+            targetCellPosition = _ref17.targetCellPosition,
+            isContextualMenuOpen = _ref17.isContextualMenuOpen,
+            layout = _ref17.layout,
+            tableRef = _ref17.tableRef,
+            pluginConfig = _ref17.pluginConfig,
+            insertColumnButtonIndex = _ref17.insertColumnButtonIndex,
+            insertRowButtonIndex = _ref17.insertRowButtonIndex,
+            isHeaderColumnEnabled = _ref17.isHeaderColumnEnabled,
+            isHeaderRowEnabled = _ref17.isHeaderRowEnabled,
+            isDragAndDropEnabled = _ref17.isDragAndDropEnabled,
+            tableWrapperTarget = _ref17.tableWrapperTarget;
           var allowControls = pluginConfig.allowControls;
           var stickyHeader = stickyHeadersState ? (0, _stickyHeaders.findStickyHeaderForTable)(stickyHeadersState, tablePos) : undefined;
           var LayoutContent = options && !options.tableResizingEnabled && (0, _utils2.isLayoutSupported)(state) && options.breakoutEnabled ? /*#__PURE__*/_react.default.createElement(_LayoutButton.default, {
@@ -344,8 +344,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
             hasStickyHeaders: stickyHeader && stickyHeader.sticky,
             dispatchAnalyticsEvent: dispatchAnalyticsEvent,
             editorAnalyticsAPI: editorAnalyticsAPI,
-            getEditorContainerWidth: defaultGetEditorContainerWidth,
-            getEditorFeatureFlags: (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags
+            getEditorContainerWidth: defaultGetEditorContainerWidth
           }), (options === null || options === void 0 ? void 0 : options.allowContextualMenu) && /*#__PURE__*/_react.default.createElement(_FloatingContextualMenu.default, {
             editorView: editorView,
             mountPoint: popupsMountPoint,
@@ -369,8 +368,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
             getEditorContainerWidth: defaultGetEditorContainerWidth,
             editorAnalyticsAPI: editorAnalyticsAPI,
             stickyHeaders: stickyHeader,
-            pluginConfig: pluginConfig,
-            getEditorFeatureFlags: (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags
+            pluginConfig: pluginConfig
           }), allowControls && !isDragAndDropEnabled && !isResizing && /*#__PURE__*/_react.default.createElement(_FloatingDeleteButton.default, {
             editorView: editorView,
             selection: editorView.state.selection,
@@ -386,8 +384,8 @@ var tablesPlugin = function tablesPlugin(_ref) {
       }));
     },
     pluginsOptions: {
-      quickInsert: function quickInsert(_ref19) {
-        var formatMessage = _ref19.formatMessage;
+      quickInsert: function quickInsert(_ref18) {
+        var formatMessage = _ref18.formatMessage;
         return [{
           id: 'table',
           title: formatMessage(_messages.toolbarInsertBlockMessages.table),
@@ -402,7 +400,10 @@ var tablesPlugin = function tablesPlugin(_ref) {
             var _api$table;
             // see comment on tablesPlugin.getSharedState on usage
             var tableState = api === null || api === void 0 || (_api$table = api.table) === null || _api$table === void 0 ? void 0 : _api$table.sharedState.currentState();
-            var tr = insert((0, _utils2.createTableWithWidth)(tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled, options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags)(state.schema));
+            var _getPluginState = (0, _pluginFactory.getPluginState)(state),
+              _getPluginState$isTab = _getPluginState.isTableScalingEnabled,
+              isTableScalingEnabled = _getPluginState$isTab === void 0 ? false : _getPluginState$isTab;
+            var tr = insert((0, _utils2.createTableWithWidth)(isTableScalingEnabled, tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled)(state.schema));
             editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
               action: _analytics.ACTION.INSERTED,
               actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,

package/dist/cjs/pm-plugins/drag-and-drop/plugin.js

@@ -23,7 +23,7 @@ var _consts = require("./consts");
 var _pluginFactory2 = require("./plugin-factory");
 var _pluginKey2 = require("./plugin-key");
 var _monitor = require("./utils/monitor");
-var destroyFn = function destroyFn(editorView, editorAnalyticsAPI, getEditorFeatureFlags) {
+var destroyFn = function destroyFn(editorView, editorAnalyticsAPI) {
   var editorPageScrollContainer = document.querySelector('.fabric-editor-popup-scroll-parent');
   var rowAutoScrollers = editorPageScrollContainer ? [(0, _adapter.monitorForElements)({
     canMonitor: function canMonitor(_ref) {
@@ -153,10 +153,10 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI, getEditorFeat
             tableRef = _getTablePluginState3.tableRef,
             tableNode = _getTablePluginState3.tableNode;
           if (tableRef && tableNode) {
-            var _ref8 = (getEditorFeatureFlags === null || getEditorFeatureFlags === void 0 ? void 0 : getEditorFeatureFlags()) || {},
-              _ref8$tablePreserveWi = _ref8.tablePreserveWidth,
-              tablePreserveWidth = _ref8$tablePreserveWi === void 0 ? false : _ref8$tablePreserveWi;
-            (0, _utils3.insertColgroupFromNode)(tableRef, tableNode, tablePreserveWidth);
+            var _getTablePluginState4 = (0, _pluginFactory.getPluginState)(editorView.state),
+              _getTablePluginState5 = _getTablePluginState4.isTableScalingEnabled,
+              isTableScalingEnabled = _getTablePluginState5 === void 0 ? false : _getTablePluginState5;
+            (0, _utils3.insertColgroupFromNode)(tableRef, tableNode, isTableScalingEnabled);
           }
         }
         editorView.focus();
@@ -164,7 +164,7 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI, getEditorFeat
     }
   })]));
 };
-var createPlugin = exports.createPlugin = function createPlugin(dispatch, getEditorFeatureFlags, editorAnalyticsAPI) {
+var createPlugin = exports.createPlugin = function createPlugin(dispatch, editorAnalyticsAPI) {
   return new _safePlugin.SafePlugin({
     state: (0, _pluginFactory2.createPluginState)(dispatch, function (state) {
       return {
@@ -179,10 +179,10 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getEdi
     }),
     key: _pluginKey2.pluginKey,
     appendTransaction: function appendTransaction(transactions, oldState, newState) {
-      var _getTablePluginState4 = (0, _pluginFactory.getPluginState)(oldState),
-        oldTargetCellPosition = _getTablePluginState4.targetCellPosition;
-      var _getTablePluginState5 = (0, _pluginFactory.getPluginState)(newState),
-        newTargetCellPosition = _getTablePluginState5.targetCellPosition;
+      var _getTablePluginState6 = (0, _pluginFactory.getPluginState)(oldState),
+        oldTargetCellPosition = _getTablePluginState6.targetCellPosition;
+      var _getTablePluginState7 = (0, _pluginFactory.getPluginState)(newState),
+        newTargetCellPosition = _getTablePluginState7.targetCellPosition;
       var _getPluginState = (0, _pluginFactory2.getPluginState)(newState),
         isDragMenuOpen = _getPluginState.isDragMenuOpen,
         dragMenuIndex = _getPluginState.dragMenuIndex;
@@ -232,7 +232,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getEdi
     },
     view: function view(editorView) {
       return {
-        destroy: destroyFn(editorView, editorAnalyticsAPI, getEditorFeatureFlags)
+        destroy: destroyFn(editorView, editorAnalyticsAPI)
       };
     },
     props: {
@@ -242,7 +242,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getEdi
         return decorationSet;
       },
       handleKeyDown: function handleKeyDown(view, event) {
-        var _ref9;
+        var _ref8;
         var tr = view.state.tr;
         var keysToTrapWhen = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];
 
@@ -263,7 +263,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getEdi
             return true;
           }
         }
-        var isDragHandleFocused = ['drag-handle-button-row', 'drag-handle-button-column'].includes((_ref9 = event.target || null) === null || _ref9 === void 0 ? void 0 : _ref9.id);
+        var isDragHandleFocused = ['drag-handle-button-row', 'drag-handle-button-column'].includes((_ref8 = event.target || null) === null || _ref8 === void 0 ? void 0 : _ref8.id);
         var keysToTrap = ['Enter', ' '];
         var _getPluginState3 = (0, _pluginFactory2.getPluginState)(view.state),
           isDragMenuOpen = _getPluginState3.isDragMenuOpen;

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

@@ -27,7 +27,8 @@ var createTableWithAnalytics = function createTableWithAnalytics(editorAnalytics
     eventType: _analytics.EVENT_TYPE.TRACK
   })(editorAnalyticsAPI)((0, _commands2.createTable)());
 };
-function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, getEditorFeatureFlags, dragAndDropEnabled) {
+function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, dragAndDropEnabled) {
+  var isTableScalingEnabled = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
   var list = {};
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.nextCell.common, (0, _commands2.goToNextCell)(editorAnalyticsAPI)(1), list);
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.previousCell.common, (0, _commands2.goToNextCell)(editorAnalyticsAPI)(-1), list);
@@ -38,8 +39,8 @@ function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, getEditorFeat
   // Add row/column shortcuts
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.addRowBefore.common, (0, _commandsWithAnalytics.addRowAroundSelection)(editorAnalyticsAPI)('TOP'), list);
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.addRowAfter.common, (0, _commandsWithAnalytics.addRowAroundSelection)(editorAnalyticsAPI)('BOTTOM'), list);
-  (0, _keymaps.bindKeymapWithCommand)(_keymaps.addColumnBefore.common, (0, _insert.addColumnBefore)(getEditorContainerWidth), list);
-  (0, _keymaps.bindKeymapWithCommand)(_keymaps.addColumnAfter.common, (0, _insert.addColumnAfter)(getEditorContainerWidth), list);
+  (0, _keymaps.bindKeymapWithCommand)(_keymaps.addColumnBefore.common, (0, _insert.addColumnBefore)(isTableScalingEnabled), list);
+  (0, _keymaps.bindKeymapWithCommand)(_keymaps.addColumnAfter.common, (0, _insert.addColumnAfter)(isTableScalingEnabled), list);
   if (dragAndDropEnabled) {
     // Move row/column shortcuts
     /**
@@ -59,14 +60,11 @@ function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, getEditorFeat
     (0, _keymaps.bindKeymapWithCommand)(_keymaps.deleteRow.common, (0, _commandsWithAnalytics.deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut)(editorAnalyticsAPI), list);
   }
   if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.a11y-column-resizing_emcvz')) {
-    var _ref = getEditorFeatureFlags ? getEditorFeatureFlags() : {},
-      _ref$tablePreserveWid = _ref.tablePreserveWidth,
-      tablePreserveWidth = _ref$tablePreserveWid === void 0 ? false : _ref$tablePreserveWid;
     (0, _keymaps.bindKeymapWithCommand)(_keymaps.startColumnResizing.common, _columnResize.initiateKeyboardColumnResizing, list);
     (0, _keymaps.bindKeymapWithCommand)(_keymaps.moveRight.common, (0, _columnResize.activateNextResizeArea)(1), list);
     (0, _keymaps.bindKeymapWithCommand)(_keymaps.moveLeft.common, (0, _columnResize.activateNextResizeArea)(-1), list);
-    (0, _keymaps.bindKeymapWithCommand)(_keymaps.decreaseMediaSize.common, (0, _commandsWithAnalytics.changeColumnWidthByStepWithAnalytics)(editorAnalyticsAPI)(-10, getEditorContainerWidth, tablePreserveWidth, _analytics.INPUT_METHOD.SHORTCUT), list);
-    (0, _keymaps.bindKeymapWithCommand)(_keymaps.increaseMediaSize.common, (0, _commandsWithAnalytics.changeColumnWidthByStepWithAnalytics)(editorAnalyticsAPI)(10, getEditorContainerWidth, tablePreserveWidth, _analytics.INPUT_METHOD.SHORTCUT), list);
+    (0, _keymaps.bindKeymapWithCommand)(_keymaps.decreaseMediaSize.common, (0, _commandsWithAnalytics.changeColumnWidthByStepWithAnalytics)(editorAnalyticsAPI)(-10, getEditorContainerWidth, isTableScalingEnabled, _analytics.INPUT_METHOD.SHORTCUT), list);
+    (0, _keymaps.bindKeymapWithCommand)(_keymaps.increaseMediaSize.common, (0, _commandsWithAnalytics.changeColumnWidthByStepWithAnalytics)(editorAnalyticsAPI)(10, getEditorContainerWidth, isTableScalingEnabled, _analytics.INPUT_METHOD.SHORTCUT), list);
     (0, _keymaps.bindKeymapWithCommand)(_keymaps.escape.common, (0, _columnResize.stopKeyboardColumnResizing)(), list);
   }
   return (0, _keymap.keymap)(list);

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

@@ -32,8 +32,7 @@ var _pluginFactory = require("./plugin-factory");
 var _pluginKey = require("./plugin-key");
 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, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi) {
-  var _window;
+var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled) {
   var state = (0, _pluginFactory.createPluginState)(dispatch, _objectSpread(_objectSpread(_objectSpread({
     pluginConfig: pluginConfig,
     isTableHovered: false,
@@ -45,19 +44,11 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
     isTableResizingEnabled: tableResizingEnabled,
     isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
     isHeaderColumnEnabled: false,
-    isDragAndDropEnabled: dragAndDropEnabled
+    isDragAndDropEnabled: dragAndDropEnabled,
+    isTableScalingEnabled: isTableScalingEnabled
   }, _defaultTableSelection.defaultHoveredCell), _defaultTableSelection.defaultTableSelection), {}, {
     getIntl: getIntl
   }));
-  var elementContentRects = {};
-  var observer = (_window = window) !== null && _window !== void 0 && _window.ResizeObserver ? new ResizeObserver(function (entries) {
-    entries.forEach(function (entry) {
-      if (!entry.target.id) {
-        return;
-      }
-      elementContentRects[entry.target.id] = entry.contentRect;
-    });
-  }) : undefined;
 
   // Used to prevent invalid table cell spans being reported more than once per editor/document
   var invalidTableIds = [];
@@ -95,12 +86,9 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
           }
         });
       }
-      var _getEditorFeatureFlag = getEditorFeatureFlags(),
-        _getEditorFeatureFlag2 = _getEditorFeatureFlag.tablePreserveWidth,
-        tablePreserveWidth = _getEditorFeatureFlag2 === void 0 ? false : _getEditorFeatureFlag2;
       if (tr) {
         // "fixTables" removes empty rows as we don't allow that in schema
-        var updatedTr = (0, _eventHandlers.handleCut)(tr, oldState, newState, editorAnalyticsAPI, editorViewRef || undefined, tablePreserveWidth);
+        var updatedTr = (0, _eventHandlers.handleCut)(tr, oldState, newState, editorAnalyticsAPI, editorViewRef || undefined, isTableScalingEnabled);
         return (0, _transforms2.fixTables)(updatedTr) || updatedTr;
       }
       if (transactions.find(function (tr) {
@@ -163,11 +151,6 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
           } else if (pluginState.isResizeHandleWidgetAdded) {
             (0, _misc.removeResizeHandleDecorations)()(state, dispatch);
           }
-        },
-        destroy: function destroy() {
-          if (observer) {
-            observer.disconnect();
-          }
         }
       };
     },
@@ -273,10 +256,10 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
           return new _TableRow.default(node, view, getPos, eventDispatcher);
         },
         tableCell: function tableCell(node, view, getPos) {
-          return new _TableCell.default(node, view, getPos, eventDispatcher, observer);
+          return new _TableCell.default(node, view, getPos, eventDispatcher);
         },
         tableHeader: function tableHeader(node, view, getPos) {
-          return new _TableCell.default(node, view, getPos, eventDispatcher, observer);
+          return new _TableCell.default(node, view, getPos, eventDispatcher);
         }
       },
       handleDOMEvents: {
@@ -286,7 +269,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
         mouseover: (0, _eventHandlers.withCellTracking)((0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseOver)),
         mouseleave: _eventHandlers.handleMouseLeave,
         mouseout: (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseOut),
-        mousemove: (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseMove, elementContentRects),
+        mousemove: (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseMove),
         mouseenter: _eventHandlers.handleMouseEnter,
         mouseup: (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseUp),
         click: (0, _eventHandlers.withCellTracking)((0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleClick))

package/dist/cjs/pm-plugins/sticky-headers/plugin.js

@@ -7,11 +7,10 @@ exports.createPlugin = void 0;
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _pluginKey = require("./plugin-key");
 var _pluginState = require("./plugin-state");
-var createPlugin = exports.createPlugin = function createPlugin(dispatch, eventDispatcher) {
-  var initialState = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function () {
+var createPlugin = exports.createPlugin = function createPlugin(dispatch) {
+  var initialState = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {
     return [];
   };
-  var getEditorFeatureFlags = arguments.length > 3 ? arguments[3] : undefined;
   return new _safePlugin.SafePlugin({
     state: (0, _pluginState.createPluginState)(dispatch, initialState),
     key: _pluginKey.pluginKey

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

@@ -25,14 +25,14 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
     dispatch = view.dispatch;
   var editorDisabled = !view.editable;
   var domAtPos = view.domAtPos.bind(view);
-  var _getEditorFeatureFlag = getEditorFeatureFlags(),
-    _getEditorFeatureFlag2 = _getEditorFeatureFlag.tablePreserveWidth,
-    tablePreserveWidth = _getEditorFeatureFlag2 === void 0 ? false : _getEditorFeatureFlag2;
+  var _getTablePluginState = (0, _pluginFactory.getPluginState)(state),
+    _getTablePluginState$ = _getTablePluginState.isTableScalingEnabled,
+    isTableScalingEnabled = _getTablePluginState$ === void 0 ? false : _getTablePluginState$;
   if (editorDisabled || localResizeHandlePos === null || !(0, _utils3.pointsAtCell)(state.doc.resolve(localResizeHandlePos))) {
     return false;
   }
-  var _getTablePluginState = (0, _pluginFactory.getPluginState)(state),
-    isKeyboardResize = _getTablePluginState.isKeyboardResize;
+  var _getTablePluginState2 = (0, _pluginFactory.getPluginState)(state),
+    isKeyboardResize = _getTablePluginState2.isKeyboardResize;
   event.preventDefault();
   var tr = view.state.tr;
   tr.setMeta(_tableAnalytics.META_KEYS.OVERFLOW_TRIGGER, {
@@ -74,7 +74,7 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
     tableRef: dom,
     start: start,
     domAtPos: domAtPos,
-    tablePreserveWidth: tablePreserveWidth
+    isTableScalingEnabled: isTableScalingEnabled
   });
   if ((0, _commands.evenColumns)({
     resizeState: resizeState,
@@ -103,8 +103,8 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
     var _getPluginState = (0, _pluginFactory2.getPluginState)(state),
       dragging = _getPluginState.dragging,
       resizeHandlePos = _getPluginState.resizeHandlePos;
-    var _getTablePluginState2 = (0, _pluginFactory.getPluginState)(state),
-      isTableHovered = _getTablePluginState2.isTableHovered;
+    var _getTablePluginState3 = (0, _pluginFactory.getPluginState)(state),
+      isTableHovered = _getTablePluginState3.isTableHovered;
     if (resizeHandlePos === null) {
       return (0, _commands.stopResizing)()(state, dispatch);
     }
@@ -146,7 +146,7 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
         var selectedColumns = selectionRect ? (0, _utils2.getSelectedColumnIndexes)(selectionRect) : [];
         // only selected (or selected - 1) columns should be distributed
         var resizingSelectedColumns = selectedColumns.indexOf(colIndex) > -1 || selectedColumns.indexOf(colIndex + 1) > -1;
-        var newResizeState = (0, _utils3.resizeColumn)(resizeState, colIndex, clientX - startX, dom, resizingSelectedColumns ? selectedColumns : undefined, tablePreserveWidth);
+        var newResizeState = (0, _utils3.resizeColumn)(resizeState, colIndex, clientX - startX, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, isTableScalingEnabled);
         var resizedDelta = clientX - startX;
         tr = (0, _transforms.updateColumnWidths)(newResizeState, table, start)(tr);
         if (colIndex === map.width - 1) {
@@ -200,8 +200,8 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
     var _getPluginState2 = (0, _pluginFactory2.getPluginState)(state),
       dragging = _getPluginState2.dragging,
       resizeHandlePos = _getPluginState2.resizeHandlePos;
-    var _getTablePluginState3 = (0, _pluginFactory.getPluginState)(state),
-      isTableHovered = _getTablePluginState3.isTableHovered;
+    var _getTablePluginState4 = (0, _pluginFactory.getPluginState)(state),
+      isTableHovered = _getTablePluginState4.isTableHovered;
     if (!which || !dragging || resizeHandlePos === null || !(0, _utils3.pointsAtCell)(state.doc.resolve(resizeHandlePos)) || !isTableHovered && (0, _platformFeatureFlags.getBooleanFF)('platform.editor.a11y-column-resizing_emcvz')) {
       return finish(event);
     }
@@ -209,7 +209,7 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(view, e
     var table = $cell.node(-1);
     var map = _tableMap.TableMap.get(table);
     var colIndex = map.colCount($cell.pos - $cell.start(-1)) + $cell.nodeAfter.attrs.colspan - 1;
-    (0, _utils3.resizeColumn)(resizeState, colIndex, clientX - dragging.startX, dom, undefined, tablePreserveWidth);
+    (0, _utils3.resizeColumn)(resizeState, colIndex, clientX - dragging.startX, dom, table, undefined, isTableScalingEnabled);
     (0, _utils3.updateControls)()(state);
   }
   window.addEventListener('mouseup', finish);

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

@@ -90,13 +90,13 @@ var generateColgroup = exports.generateColgroup = function generateColgroup(tabl
   return cols;
 };
 var insertColgroupFromNode = exports.insertColgroupFromNode = function insertColgroupFromNode(tableRef, table) {
-  var tablePreserveWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+  var isTableScalingEnabled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
   var shouldRemove = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
   var colgroup = tableRef.querySelector('colgroup');
   if (colgroup && shouldRemove) {
     tableRef.removeChild(colgroup);
   }
-  colgroup = renderColgroupFromNode(table, tablePreserveWidth ? tableRef : undefined);
+  colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef : undefined);
   if (shouldRemove) {
     tableRef.insertBefore(colgroup, tableRef.firstChild);
   }

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

@@ -3,8 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TABLE_MAX_WIDTH = exports.TABLE_DEFAULT_WIDTH = exports.MAX_SCALING_PERCENT = exports.COLUMN_MIN_WIDTH = void 0;
+exports.TABLE_MAX_WIDTH = exports.TABLE_EDITOR_MARGIN = exports.TABLE_DEFAULT_WIDTH = exports.MAX_SCALING_PERCENT = exports.COLUMN_MIN_WIDTH = void 0;
 var COLUMN_MIN_WIDTH = exports.COLUMN_MIN_WIDTH = 48;
 var TABLE_DEFAULT_WIDTH = exports.TABLE_DEFAULT_WIDTH = 760;
 var TABLE_MAX_WIDTH = exports.TABLE_MAX_WIDTH = 1800;
-var MAX_SCALING_PERCENT = exports.MAX_SCALING_PERCENT = 0.3;
+var MAX_SCALING_PERCENT = exports.MAX_SCALING_PERCENT = 0.3;
+// Used to calculate the width of a table using the Editor width
+var TABLE_EDITOR_MARGIN = exports.TABLE_EDITOR_MARGIN = 76;

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

@@ -135,10 +135,10 @@ Object.defineProperty(exports, "getResizeState", {
     return _resizeState.getResizeState;
   }
 });
-Object.defineProperty(exports, "getTableContainerElement", {
+Object.defineProperty(exports, "getTableContainerElementWidth", {
   enumerable: true,
   get: function get() {
-    return _misc.getTableContainerElement;
+    return _misc.getTableContainerElementWidth;
   }
 });
 Object.defineProperty(exports, "getTableElementWidth", {