@atlaskit/editor-plugin-table 7.5.3 → 7.5.5

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

@@ -11,9 +11,10 @@ import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { ReplaceStep } from '@atlaskit/editor-prosemirror/transform';
 import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorWideLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { findTable } from '@atlaskit/editor-tables/utils';
+import { getPluginState } from './plugin-factory';
 import { TABLE_MAX_WIDTH } from './table-resizing/utils';
 export const pluginKey = new PluginKey('tableWidthPlugin');
-const createPlugin = (dispatch, dispatchAnalyticsEvent, fullWidthEnabled, getEditorFeatureFlags) => {
+const createPlugin = (dispatch, dispatchAnalyticsEvent, fullWidthEnabled) => {
   return new SafePlugin({
     key: pluginKey,
     state: {
@@ -78,7 +79,10 @@ const createPlugin = (dispatch, dispatchAnalyticsEvent, fullWidthEnabled, getEdi
         return hasStepReplacingEntireDocument;
       });
       const referentialityTr = transactions.find(tr => tr.getMeta('referentialityTableInserted'));
-      const shouldPatchTable = fullWidthEnabled && getEditorFeatureFlags && getEditorFeatureFlags()['tablePreserveWidth'];
+      const {
+        isTableScalingEnabled = false
+      } = getPluginState(newState);
+      const shouldPatchTable = fullWidthEnabled && isTableScalingEnabled;
       if (!isReplaceDocumentOperation && (!shouldPatchTable || !referentialityTr)) {
         return null;
       }

package/dist/es2019/toolbar.js

@@ -80,7 +80,7 @@ export const getToolbarMenuConfig = (config, state, {
 // with native widgets. It's enabled via a plugin config.
 export const getToolbarCellOptionsConfig = (editorState, editorView, initialSelectionRect, {
   formatMessage
-}, getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth = false) => {
+}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false) => {
   var _pluginState$pluginCo, _pluginState$pluginCo2;
   const {
     top,
@@ -98,7 +98,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
       const selectionRect = getClosestSelectionRect(state);
       const index = selectionRect === null || selectionRect === void 0 ? void 0 : selectionRect.right;
       if (index) {
-        insertColumnWithAnalytics(getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth)(INPUT_METHOD.FLOATING_TB, index)(state, dispatch, view);
+        insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled)(INPUT_METHOD.FLOATING_TB, index)(state, dispatch, view);
       }
       return true;
     },
@@ -177,7 +177,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
   }];
   if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo = pluginState.pluginConfig) !== null && _pluginState$pluginCo !== void 0 && _pluginState$pluginCo.allowDistributeColumns) {
     var _newResizeStateWithAn;
-    const newResizeStateWithAnalytics = editorView ? getNewResizeStateFromSelectedColumns(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, tablePreserveWidth) : undefined;
+    const newResizeStateWithAnalytics = editorView ? getNewResizeStateFromSelectedColumns(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled) : undefined;
     const wouldChange = (_newResizeStateWithAn = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn !== void 0 ? _newResizeStateWithAn : false;
     const distributeColumnWidths = (state, dispatch) => {
       if (newResizeStateWithAnalytics) {
@@ -297,12 +297,12 @@ export const getToolbarConfig = (getEditorContainerWidth, editorAnalyticsAPI, ge
     const nodeType = state.schema.nodes.table;
     const menu = getToolbarMenuConfig(config, pluginState, intl, editorAnalyticsAPI);
     const {
-      tablePreserveWidth = false
-    } = getEditorFeatureFlags();
+      isTableScalingEnabled = false
+    } = getPluginState(state);
     let cellItems;
-    cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(config, state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth);
+    cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled);
     let columnSettingsItems;
-    columnSettingsItems = pluginState.isDragAndDropEnabled && getBooleanFF('platform.editor.table.new-cell-context-menu-styling') ? getColumnSettingItems(state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth) : [];
+    columnSettingsItems = pluginState.isDragAndDropEnabled && getBooleanFF('platform.editor.table.new-cell-context-menu-styling') ? getColumnSettingItems(state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled) : [];
     const colorPicker = getColorPicker(state, menu, intl, editorAnalyticsAPI);
 
     // Check if we need to show confirm dialog for delete button
@@ -391,24 +391,24 @@ const separator = hidden => {
     hidden: hidden
   };
 };
-const getCellItems = (pluginConfig, state, view, {
+const getCellItems = (state, view, {
   formatMessage
-}, getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth = false) => {
+}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false) => {
   const initialSelectionRect = getClosestSelectionRect(state);
   if (initialSelectionRect) {
     const cellOptions = getToolbarCellOptionsConfig(state, view, initialSelectionRect, {
       formatMessage
-    }, getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth);
+    }, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled);
     return [cellOptions, separator(cellOptions.hidden)];
   }
   return [];
 };
-export const getDistributeConfig = (getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth = false) => (state, dispatch, editorView) => {
+export const getDistributeConfig = (getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false) => (state, dispatch, editorView) => {
   const selectionOrTableRect = getClosestSelectionOrTableRect(state);
   if (!editorView || !selectionOrTableRect) {
     return false;
   }
-  const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, tablePreserveWidth);
+  const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled);
   if (newResizeStateWithAnalytics) {
     distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.FLOATING_TB, newResizeStateWithAnalytics)(state, dispatch);
     return true;
@@ -420,14 +420,14 @@ export const getDistributeConfig = (getEditorContainerWidth, editorAnalyticsAPI,
 // fixed column button should be in this function call in the future
 const getColumnSettingItems = (editorState, editorView, {
   formatMessage
-}, getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth = false) => {
+}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false) => {
   var _newResizeStateWithAn2, _pluginState$pluginCo3;
   const pluginState = getPluginState(editorState);
   const selectionOrTableRect = getClosestSelectionOrTableRect(editorState);
   if (!selectionOrTableRect || !editorView) {
     return [];
   }
-  const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, tablePreserveWidth);
+  const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled);
   const wouldChange = (_newResizeStateWithAn2 = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn2 !== void 0 ? _newResizeStateWithAn2 : false;
   if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo3 = pluginState.pluginConfig) !== null && _pluginState$pluginCo3 !== void 0 && _pluginState$pluginCo3.allowDistributeColumns && pluginState.isDragAndDropEnabled) {
     return [{
@@ -435,7 +435,7 @@ const getColumnSettingItems = (editorState, editorView, {
       type: 'button',
       title: formatMessage(messages.distributeColumns),
       icon: DistributeColumnIcon,
-      onClick: (state, dispatch, view) => getDistributeConfig(getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth)(state, dispatch, view),
+      onClick: (state, dispatch, view) => getDistributeConfig(getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled)(state, dispatch, view),
       disabled: !wouldChange
     }, {
       type: 'separator'

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

@@ -2,7 +2,7 @@ import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { AttrStep } from '@atlaskit/editor-prosemirror/transform';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { getTableContainerElement, getTableElementWidth, hasTableBeenResized } from '../pm-plugins/table-resizing/utils';
+import { getTableContainerElementWidth, getTableElementWidth, hasTableBeenResized } from '../pm-plugins/table-resizing/utils';
 import { isMinCellWidthTable } from '../pm-plugins/table-resizing/utils/colgroup';
 import { getResizeState } from '../pm-plugins/table-resizing/utils/resize-state';
 import { scaleTableTo } from '../pm-plugins/table-resizing/utils/scale-table';
@@ -85,7 +85,7 @@ export const updateColumnWidths = (resizeState, table, start) => tr => {
  * @param view
  * @returns Updated transaction with rescaled columns for a given table
  */
-export const rescaleColumns = (tablePreserveWidth = false) => (table, view) => tr => {
+export const rescaleColumns = (isTableScalingEnabled = false) => (table, view) => tr => {
   if (!view) {
     return tr;
   }
@@ -102,11 +102,11 @@ export const rescaleColumns = (tablePreserveWidth = false) => (table, view) => t
     possibleMaxWidth: 0,
     isResized
   };
-  if (tablePreserveWidth) {
+  if (isTableScalingEnabled) {
     previousTableInfo = {
       // TODO - ensure correct width is returned when table doesn't have a width value
       width: getTableElementWidth(table.node),
-      possibleMaxWidth: getBooleanFF('platform.editor.custom-table-width') ? getTableContainerElement(table.node) : getTableContainerElement(table.node) - insertColumnButtonOffset,
+      possibleMaxWidth: getBooleanFF('platform.editor.custom-table-width') ? getTableContainerElementWidth(table.node) : getTableContainerElementWidth(table.node) - insertColumnButtonOffset,
       isResized
     };
   } else {
@@ -162,7 +162,7 @@ export const rescaleColumns = (tablePreserveWidth = false) => (table, view) => t
     tableRef,
     domAtPos,
     maxSize: previousTableInfo.possibleMaxWidth,
-    tablePreserveWidth
+    isTableScalingEnabled
   });
 
   // Two scenarios that require scaling:

package/dist/es2019/transforms/delete-columns.js

@@ -192,7 +192,7 @@ function fixRowSpans(table) {
   }
   return table.type.createChecked(table.attrs, rows, table.marks);
 }
-export const deleteColumns = (rect, allowCustomStep, view, tablePreserveWidth = false) => tr => {
+export const deleteColumns = (rect, allowCustomStep, view, isTableScalingEnabled = false) => tr => {
   let updatedTr = tr;
   updatedTr.setMeta(META_KEYS.OVERFLOW_TRIGGER, {
     name: TABLE_OVERFLOW_CHANGE_TRIGGER.DELETED_COLUMN
@@ -204,7 +204,7 @@ export const deleteColumns = (rect, allowCustomStep, view, tablePreserveWidth =
   }
   const table = findTable(updatedTr.selection);
   if (table) {
-    updatedTr = rescaleColumns(tablePreserveWidth)(table, view)(updatedTr);
+    updatedTr = rescaleColumns(isTableScalingEnabled)(table, view)(updatedTr);
   }
   return updatedTr;
 };

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

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
-import React from 'react';
 import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';

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

@@ -302,11 +302,11 @@ export class ContextualMenu extends Component {
         }
       } = getPluginState(editorView.state);
       if (allowDistributeColumns && (!isDragAndDropEnabled || !getBooleanFF('platform.editor.table.new-cell-context-menu-styling'))) {
-        var _this$props$getEditor, _this$props, _newResizeState$chang;
+        var _newResizeState$chang;
         const {
-          tablePreserveWidth = false
-        } = ((_this$props$getEditor = (_this$props = this.props).getEditorFeatureFlags) === null || _this$props$getEditor === void 0 ? void 0 : _this$props$getEditor.call(_this$props)) || {};
-        const newResizeState = getNewResizeStateFromSelectedColumns(selectionRect, editorView.state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, tablePreserveWidth);
+          isTableScalingEnabled = false
+        } = getPluginState(editorView.state);
+        const newResizeState = getNewResizeStateFromSelectedColumns(selectionRect, editorView.state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled);
         const wouldChange = (_newResizeState$chang = newResizeState === null || newResizeState === void 0 ? void 0 : newResizeState.changed) !== null && _newResizeState$chang !== void 0 ? _newResizeState$chang : false;
         return {
           content: formatMessage(messages.distributeColumns),
@@ -400,8 +400,7 @@ export class ContextualMenu extends Component {
         editorView,
         selectionRect,
         editorAnalyticsAPI,
-        getEditorContainerWidth,
-        getEditorFeatureFlags
+        getEditorContainerWidth
       } = this.props;
       // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
       const {
@@ -409,11 +408,9 @@ export class ContextualMenu extends Component {
         dispatch
       } = editorView;
       const {
-        targetCellPosition
+        targetCellPosition,
+        isTableScalingEnabled = false
       } = getPluginState(state);
-      const {
-        tablePreserveWidth = false
-      } = (getEditorFeatureFlags === null || getEditorFeatureFlags === void 0 ? void 0 : getEditorFeatureFlags()) || {};
       switch (item.value.name) {
         case 'sort_column_desc':
           sortColumnWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.CONTEXT_MENU, selectionRect.left, SortOrder.DESC)(state, dispatch);
@@ -432,7 +429,7 @@ export class ContextualMenu extends Component {
           this.toggleOpen();
           break;
         case 'distribute_columns':
-          const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionRect, state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, tablePreserveWidth);
+          const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionRect, state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled);
           if (newResizeStateWithAnalytics) {
             distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.CONTEXT_MENU, newResizeStateWithAnalytics)(state, dispatch);
             this.toggleOpen();
@@ -443,7 +440,7 @@ export class ContextualMenu extends Component {
           this.toggleOpen();
           break;
         case 'insert_column':
-          insertColumnWithAnalytics(getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth)(INPUT_METHOD.CONTEXT_MENU, selectionRect.right)(state, dispatch, editorView);
+          insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled)(INPUT_METHOD.CONTEXT_MENU, selectionRect.right)(state, dispatch, editorView);
           this.toggleOpen();
           break;
         case 'insert_row':

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

@@ -16,8 +16,7 @@ const FloatingContextualMenu = ({
   isOpen,
   pluginConfig,
   editorAnalyticsAPI,
-  getEditorContainerWidth,
-  getEditorFeatureFlags
+  getEditorContainerWidth
 }) => {
   // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
   const {
@@ -69,8 +68,7 @@ const FloatingContextualMenu = ({
     selectionRect: selectionRect,
     boundariesElement: boundariesElement,
     editorAnalyticsAPI: editorAnalyticsAPI,
-    getEditorContainerWidth: getEditorContainerWidth,
-    getEditorFeatureFlags: getEditorFeatureFlags
+    getEditorContainerWidth: getEditorContainerWidth
   })));
 };
 FloatingContextualMenu.displayName = 'FloatingContextualMenu';

package/dist/es2019/ui/FloatingDragMenu/DragMenu.js

@@ -176,7 +176,7 @@ export const DragMenu = /*#__PURE__*/React.memo(({
   mountPoint,
   scrollableElement,
   boundariesElement,
-  tablePreserveWidth
+  isTableScalingEnabled
 }) => {
   var _pluginConfig$allowBa;
   const {
@@ -196,7 +196,7 @@ export const DragMenu = /*#__PURE__*/React.memo(({
   const shouldMoveDisabled = index !== undefined && hasMergedCells(index)(selection);
   const hasMergedCellsInTable = getMergedCellsPositions(state.tr).length > 0;
   const allowBackgroundColor = (_pluginConfig$allowBa = pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.allowBackgroundColor) !== null && _pluginConfig$allowBa !== void 0 ? _pluginConfig$allowBa : false;
-  const dragMenuConfig = getDragMenuConfig(direction, getEditorContainerWidth, !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.isHeaderRowRequired, tablePreserveWidth);
+  const dragMenuConfig = getDragMenuConfig(direction, getEditorContainerWidth, !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.isHeaderRowRequired, isTableScalingEnabled);
   const {
     menuItems,
     menuCallback

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

@@ -2,6 +2,7 @@ import React from 'react';
 import { Popup } from '@atlaskit/editor-common/ui';
 import { akEditorFloatingDialogZIndex, akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
+import { getPluginState } from '../../pm-plugins/plugin-factory';
 import { dragMenuDropdownWidth, tablePopupMenuFitHeight } from '../consts';
 import DragMenu from './DragMenu';
 const FloatingDragMenu = ({
@@ -17,8 +18,7 @@ const FloatingDragMenu = ({
   getEditorContainerWidth,
   editorAnalyticsAPI,
   stickyHeaders,
-  pluginConfig,
-  getEditorFeatureFlags
+  pluginConfig
 }) => {
   if (!isOpen || !targetCellPosition || editorView.state.doc.nodeSize <= targetCellPosition) {
     return null;
@@ -30,8 +30,8 @@ const FloatingDragMenu = ({
     return null;
   }
   const {
-    tablePreserveWidth = false
-  } = getEditorFeatureFlags();
+    isTableScalingEnabled = false
+  } = getPluginState(editorView.state);
   return /*#__PURE__*/React.createElement(Popup, {
     alignX: direction === 'row' ? 'right' : undefined,
     alignY: direction === 'row' ? 'start' : undefined,
@@ -65,7 +65,7 @@ const FloatingDragMenu = ({
     mountPoint: mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement,
-    tablePreserveWidth: tablePreserveWidth
+    isTableScalingEnabled: isTableScalingEnabled
   }));
 };
 FloatingDragMenu.displayName = 'FloatingDragMenu';

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

@@ -11,6 +11,7 @@ import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { findTable } from '@atlaskit/editor-tables/utils';
 import { insertColumnWithAnalytics, insertRowWithAnalytics } from '../../commands-with-analytics';
+import { getPluginState } from '../../pm-plugins/plugin-factory';
 import { TableCssClassName as ClassName } from '../../types';
 import { checkIfNumberColumnEnabled } from '../../utils';
 import getPopupOptions from './getPopupOptions';
@@ -173,20 +174,18 @@ export class FloatingInsertButton extends React.Component {
     const {
       editorView,
       insertColumnButtonIndex,
-      editorAnalyticsAPI,
-      getEditorContainerWidth
+      editorAnalyticsAPI
     } = this.props;
     if (typeof insertColumnButtonIndex !== 'undefined') {
-      var _this$props$getEditor, _this$props;
       event.preventDefault();
       const {
-        tablePreserveWidth = false
-      } = ((_this$props$getEditor = (_this$props = this.props).getEditorFeatureFlags) === null || _this$props$getEditor === void 0 ? void 0 : _this$props$getEditor.call(_this$props)) || {};
+        isTableScalingEnabled = false
+      } = getPluginState(editorView.state);
       const {
         state,
         dispatch
       } = editorView;
-      insertColumnWithAnalytics(getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth)(INPUT_METHOD.BUTTON, insertColumnButtonIndex)(state, dispatch, editorView);
+      insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled)(INPUT_METHOD.BUTTON, insertColumnButtonIndex)(state, dispatch, editorView);
     }
   }
 }

package/dist/es2019/utils/create.js

@@ -1,10 +1,7 @@
 import { createTable } from '@atlaskit/editor-tables/utils';
 import { TABLE_MAX_WIDTH } from '../pm-plugins/table-resizing/utils';
-export const createTableWithWidth = (isFullWidthModeEnabled, getEditorFeatureFlags, createTableProps) => schema => {
-  const {
-    tablePreserveWidth = false
-  } = (getEditorFeatureFlags === null || getEditorFeatureFlags === void 0 ? void 0 : getEditorFeatureFlags()) || {};
-  if (tablePreserveWidth && isFullWidthModeEnabled) {
+export const createTableWithWidth = (isTableScalingEnabled, isFullWidthModeEnabled, createTableProps) => schema => {
+  if (isTableScalingEnabled && isFullWidthModeEnabled) {
     return createTable({
       schema,
       tableWidth: TABLE_MAX_WIDTH,

package/dist/es2019/utils/drag-menu.js

@@ -58,7 +58,7 @@ const defaultSelectionRect = {
   right: 0,
   bottom: 0
 };
-export const getDragMenuConfig = (direction, getEditorContainerWidth, canDrag, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, isHeaderRowRequired, tablePreserveWidth = false) => {
+export const getDragMenuConfig = (direction, getEditorContainerWidth, canDrag, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, isHeaderRowRequired, isTableScalingEnabled = false) => {
   var _tableMap$height, _tableMap$height2, _tableMap$width, _tableMap$width2;
   const addOptions = direction === 'row' ? [{
     label: 'above',
@@ -138,7 +138,7 @@ export const getDragMenuConfig = (direction, getEditorContainerWidth, canDrag, h
           moveCursorToInsertedRow: true
         })(state, dispatch);
       } else {
-        insertColumnWithAnalytics(getEditorContainerWidth, editorAnalyticsAPI, tablePreserveWidth)(INPUT_METHOD.TABLE_CONTEXT_MENU, (index !== null && index !== void 0 ? index : 0) + offset)(state, dispatch, editorView);
+        insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled)(INPUT_METHOD.TABLE_CONTEXT_MENU, (index !== null && index !== void 0 ? index : 0) + offset)(state, dispatch, editorView);
       }
       return true;
     },
@@ -150,7 +150,7 @@ export const getDragMenuConfig = (direction, getEditorContainerWidth, canDrag, h
     onClick: (state, dispatch) => {
       const selectionRect = getClosestSelectionRect(state);
       if (selectionRect) {
-        const newResizeState = getNewResizeStateFromSelectedColumns(selectionRect, state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, tablePreserveWidth);
+        const newResizeState = getNewResizeStateFromSelectedColumns(selectionRect, state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled);
         if (newResizeState) {
           distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, newResizeState)(state, dispatch);
           return true;
@@ -176,7 +176,7 @@ export const getDragMenuConfig = (direction, getEditorContainerWidth, canDrag, h
       if (direction === 'row') {
         deleteRowsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, selectionRect !== null && selectionRect !== void 0 ? selectionRect : defaultSelectionRect, !!isHeaderRowRequired)(state, dispatch);
       } else {
-        deleteColumnsWithAnalytics(editorAnalyticsAPI, tablePreserveWidth)(INPUT_METHOD.TABLE_CONTEXT_MENU, selectionRect !== null && selectionRect !== void 0 ? selectionRect : defaultSelectionRect)(state, dispatch, editorView);
+        deleteColumnsWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled)(INPUT_METHOD.TABLE_CONTEXT_MENU, selectionRect !== null && selectionRect !== void 0 ? selectionRect : defaultSelectionRect)(state, dispatch, editorView);
       }
       return true;
     },

package/dist/es2019/utils/guidelines.js

@@ -1,6 +1,7 @@
 import { createFixedGuidelinesFromLengths } from '@atlaskit/editor-common/guideline';
-import { calculateDefaultSnappings } from './snapping';
+import { calculateDefaultSnappings, calculateDefaultTablePreserveSnappings } from './snapping';
 
 // NOTE: We have to take 1 pixel off every length due to the fact that the tbody is 1px smaller then the table container.
 // If we don't do this then the guidelines will not align correctly to the edge of the table
-export const defaultGuidelines = createFixedGuidelinesFromLengths([0, ...calculateDefaultSnappings(-1)]);
+export const defaultGuidelines = createFixedGuidelinesFromLengths([0, ...calculateDefaultSnappings(-1)]);
+export const defaultGuidelinesForPreserveTable = editorContainerWidth => createFixedGuidelinesFromLengths([0, ...calculateDefaultTablePreserveSnappings(-1, editorContainerWidth)]);

package/dist/es2019/utils/snapping.js

@@ -1,10 +1,21 @@
 import { isVerticalPosition } from '@atlaskit/editor-common/guideline';
-import { akEditorCalculatedWideLayoutWidth, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
+import { akEditorCalculatedWideLayoutWidth, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorMediaResizeHandlerPaddingWide } from '@atlaskit/editor-shared-styles';
 const numberOfLanesInDefaultLayoutWidth = 12;
 const calculateSubSnappingWidths = (totalLanes, totalWidth) => new Array(Math.round(totalLanes / 2) - 1).fill(totalWidth / totalLanes).map((v, i) => v * (i + 1) * 2);
 export const calculateDefaultSnappings = (lengthOffset = 0) => [...calculateSubSnappingWidths(numberOfLanesInDefaultLayoutWidth, akEditorDefaultLayoutWidth + lengthOffset), akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset, akEditorFullWidthLayoutWidth + lengthOffset];
+
+// FF TablePreserve for calculateDefaultSnappings
+export const calculateDefaultTablePreserveSnappings = (lengthOffset = 0, editorContainerWith = akEditorFullWidthLayoutWidth) => {
+  const dynamicFullWidthLine = editorContainerWith - akEditorGutterPadding * 2 >= akEditorFullWidthLayoutWidth ? akEditorFullWidthLayoutWidth : editorContainerWith - akEditorGutterPadding * 2 - akEditorMediaResizeHandlerPaddingWide;
+  return [...calculateSubSnappingWidths(numberOfLanesInDefaultLayoutWidth, akEditorDefaultLayoutWidth + lengthOffset), akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset, dynamicFullWidthLine - lengthOffset];
+};
 export const defaultSnappingWidths = calculateDefaultSnappings();
 
+// FF TablePreserve for defaultSnappingWidths
+export const defaultTablePreserveSnappingWidths = editorContainerWidth => {
+  return editorContainerWidth - akEditorGutterPadding * 2 > akEditorFullWidthLayoutWidth ? calculateDefaultSnappings() : calculateDefaultTablePreserveSnappings(0, editorContainerWidth);
+};
+
 /**
  * Returns keys of guidelines that are closest to the table and withthin the snapGap
  */

package/dist/esm/commands/column-resize.js

@@ -122,7 +122,7 @@ export var activateNextResizeArea = function activateNextResizeArea(direction) {
   };
 };
 export var changeColumnWidthByStep = function changeColumnWidthByStep(stepSize, getEditorContainerWidth) {
-  var tablePreserveWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+  var isTableScalingEnabled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
   return function (state, dispatch, view) {
     var customTr = state.tr;
     var fakeDispatch = function fakeDispatch(tr) {
@@ -172,14 +172,14 @@ export var changeColumnWidthByStep = function changeColumnWidthByStep(stepSize,
       tableRef: dom,
       start: tableStartPosition,
       domAtPos: domAtPos,
-      tablePreserveWidth: tablePreserveWidth
+      isTableScalingEnabled: isTableScalingEnabled
     });
     updateControls()(state);
     var selectionRect = getSelectionRect(state.selection);
     var selectedColumns = selectionRect ? getSelectedColumnIndexes(selectionRect) : [];
     // only selected (or selected - 1) columns should be distributed
     var resizingSelectedColumns = selectedColumns.indexOf(colIndex) > -1 || selectedColumns.indexOf(colIndex + 1) > -1;
-    var newResizeState = resizeColumn(initialResizeState, colIndex, stepSize, dom, resizingSelectedColumns ? selectedColumns : undefined, tablePreserveWidth);
+    var newResizeState = resizeColumn(initialResizeState, colIndex, stepSize, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, isTableScalingEnabled);
     customTr = updateColumnWidths(newResizeState, originalTable, tableStartPosition)(customTr);
     if (dispatch) {
       dispatch(customTr);

package/dist/esm/commands/delete.js

@@ -1,9 +1,9 @@
 import { deleteColumns } from '../transforms/delete-columns';
 import { getAllowAddColumnCustomStep } from '../utils/get-allow-add-column-custom-step';
 export var deleteColumnsCommand = function deleteColumnsCommand(rect) {
-  var tablePreserveWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  var isTableScalingEnabled = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   return function (state, dispatch, view) {
-    var tr = deleteColumns(rect, getAllowAddColumnCustomStep(state), view, tablePreserveWidth)(state.tr);
+    var tr = deleteColumns(rect, getAllowAddColumnCustomStep(state), view, isTableScalingEnabled)(state.tr);
     if (dispatch) {
       dispatch(tr);
       return true;

package/dist/esm/commands/insert.js

@@ -20,8 +20,8 @@ function addColumnAtCustomStep(column) {
     return tr;
   };
 }
-export function addColumnAt(getEditorContainerWidth) {
-  var tablePreserveWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+export function addColumnAt() {
+  var isTableScalingEnabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
   return function (column) {
     var allowAddColumnCustomStep = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
     var view = arguments.length > 2 ? arguments[2] : undefined;
@@ -35,7 +35,7 @@ export function addColumnAt(getEditorContainerWidth) {
       var table = findTable(updatedTr.selection);
       if (table) {
         // [ED-8288] Update colwidths manually to avoid multiple dispatch in TableComponent
-        updatedTr = rescaleColumns(tablePreserveWidth)(table, view)(updatedTr);
+        updatedTr = rescaleColumns(isTableScalingEnabled)(table, view)(updatedTr);
       }
       if (getBooleanFF('platform.editor.table.analytics-plugin-moved-event') && view) {
         updatedTr = updateRowOrColumnMovedTransform({
@@ -52,8 +52,8 @@ export function addColumnAt(getEditorContainerWidth) {
 
 // :: (EditorState, dispatch: ?(tr: Transaction)) → bool
 // Command to add a column before the column with the selection.
-export var addColumnBefore = function addColumnBefore(getEditorContainerWidth) {
-  var tablePreserveWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+export var addColumnBefore = function addColumnBefore() {
+  var isTableScalingEnabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
   return function (state, dispatch, view) {
     var table = findTable(state.selection);
     if (!table) {
@@ -61,7 +61,7 @@ export var addColumnBefore = function addColumnBefore(getEditorContainerWidth) {
     }
     if (dispatch) {
       var rect = selectedRect(state);
-      dispatch(addColumnAt(getEditorContainerWidth, tablePreserveWidth)(rect.left, getAllowAddColumnCustomStep(state), view)(state.tr));
+      dispatch(addColumnAt(isTableScalingEnabled)(rect.left, getAllowAddColumnCustomStep(state), view)(state.tr));
     }
     return true;
   };
@@ -69,7 +69,7 @@ export var addColumnBefore = function addColumnBefore(getEditorContainerWidth) {
 
 // :: (EditorState, dispatch: ?(tr: Transaction)) → bool
 // Command to add a column after the column with the selection.
-export var addColumnAfter = function addColumnAfter(getEditorContainerWidth) {
+export var addColumnAfter = function addColumnAfter(isTableScalingEnabled) {
   return function (state, dispatch, view) {
     var table = findTable(state.selection);
     if (!table) {
@@ -77,16 +77,16 @@ export var addColumnAfter = function addColumnAfter(getEditorContainerWidth) {
     }
     if (dispatch) {
       var rect = selectedRect(state);
-      dispatch(addColumnAt(getEditorContainerWidth)(rect.right, getAllowAddColumnCustomStep(state), view)(state.tr));
+      dispatch(addColumnAt(isTableScalingEnabled)(rect.right, getAllowAddColumnCustomStep(state), view)(state.tr));
     }
     return true;
   };
 };
-export var insertColumn = function insertColumn(getEditorContainerWidth) {
-  var tablePreserveWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+export var insertColumn = function insertColumn() {
+  var isTableScalingEnabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
   return function (column) {
     return function (state, dispatch, view) {
-      var tr = addColumnAt(getEditorContainerWidth, tablePreserveWidth)(column, getAllowAddColumnCustomStep(state), view)(state.tr);
+      var tr = addColumnAt(isTableScalingEnabled)(column, getAllowAddColumnCustomStep(state), view)(state.tr);
       var table = findTable(tr.selection);
       if (!table) {
         return false;
@@ -135,20 +135,20 @@ export var insertRow = function insertRow(row, moveCursorToTheNewRow) {
     return true;
   };
 };
-export var createTable = function createTable(isFullWidthModeEnabled, getEditorFeatureFlags) {
+export var createTable = function createTable(isTableScalingEnabled, isFullWidthModeEnabled) {
   return function (state, dispatch) {
-    var table = createTableWithWidth(isFullWidthModeEnabled, getEditorFeatureFlags)(state.schema);
+    var table = createTableWithWidth(isTableScalingEnabled, isFullWidthModeEnabled)(state.schema);
     if (dispatch) {
       dispatch(safeInsert(table)(state.tr).scrollIntoView());
     }
     return true;
   };
 };
-export var insertTableWithSize = function insertTableWithSize(isFullWidthModeEnabled, getEditorFeatureFlags, editorAnalyticsAPI) {
+export var insertTableWithSize = function insertTableWithSize(isFullWidthModeEnabled, isTableScalingEnabled, editorAnalyticsAPI) {
   return function (rowsCount, colsCount, inputMethod) {
     return function (_ref) {
       var tr = _ref.tr;
-      var tableNode = createTableWithWidth(isFullWidthModeEnabled, getEditorFeatureFlags, {
+      var tableNode = createTableWithWidth(isTableScalingEnabled, isFullWidthModeEnabled, {
         rowsCount: rowsCount,
         colsCount: colsCount
       })(tr.doc.type.schema);

package/dist/esm/commands-with-analytics.js

@@ -184,7 +184,7 @@ export var insertRowWithAnalytics = function insertRowWithAnalytics(editorAnalyt
   };
 };
 export var changeColumnWidthByStepWithAnalytics = function changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI) {
-  return function (stepSize, getEditorContainerWidth, tablePreserveWidth, inputMethod) {
+  return function (stepSize, getEditorContainerWidth, isTableScalingEnabled, inputMethod) {
     return withEditorAnalyticsAPI(function (state) {
       var _getSelectedTableInfo2 = getSelectedTableInfo(state.selection),
         table = _getSelectedTableInfo2.table,
@@ -206,11 +206,11 @@ export var changeColumnWidthByStepWithAnalytics = function changeColumnWidthBySt
           totalColumnCount: totalColumnCount
         }
       };
-    })(editorAnalyticsAPI)(changeColumnWidthByStep(stepSize, getEditorContainerWidth, tablePreserveWidth));
+    })(editorAnalyticsAPI)(changeColumnWidthByStep(stepSize, getEditorContainerWidth, isTableScalingEnabled));
   };
 };
-export var insertColumnWithAnalytics = function insertColumnWithAnalytics(getEditorContainerWidth, editorAnalyticsAPI) {
-  var tablePreserveWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+export var insertColumnWithAnalytics = function insertColumnWithAnalytics(editorAnalyticsAPI) {
+  var isTableScalingEnabled = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   return function (inputMethod, position) {
     return withEditorAnalyticsAPI(function (state) {
       var _getSelectedTableInfo3 = getSelectedTableInfo(state.selection),
@@ -228,7 +228,7 @@ export var insertColumnWithAnalytics = function insertColumnWithAnalytics(getEdi
         },
         eventType: EVENT_TYPE.TRACK
       };
-    })(editorAnalyticsAPI)(insertColumn(getEditorContainerWidth, tablePreserveWidth)(position));
+    })(editorAnalyticsAPI)(insertColumn(isTableScalingEnabled)(position));
   };
 };
 export var deleteRowsWithAnalytics = function deleteRowsWithAnalytics(editorAnalyticsAPI) {
@@ -260,7 +260,7 @@ export var deleteRowsWithAnalytics = function deleteRowsWithAnalytics(editorAnal
   };
 };
 export var deleteColumnsWithAnalytics = function deleteColumnsWithAnalytics(editorAnalyticsAPI) {
-  var tablePreserveWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  var isTableScalingEnabled = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   return function (inputMethod, rect) {
     return withEditorAnalyticsAPI(function (_ref6) {
       var selection = _ref6.selection;
@@ -280,7 +280,7 @@ export var deleteColumnsWithAnalytics = function deleteColumnsWithAnalytics(edit
         },
         eventType: EVENT_TYPE.TRACK
       };
-    })(editorAnalyticsAPI)(deleteColumnsCommand(rect, tablePreserveWidth));
+    })(editorAnalyticsAPI)(deleteColumnsCommand(rect, isTableScalingEnabled));
   };
 };
 export var deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut = function deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut(editorAnalyticsAPI) {