@atlaskit/editor-plugin-table 7.5.3 → 7.5.5

package/dist/es2019/nodeviews/TableResizer.js

@@ -16,8 +16,8 @@ import { COLUMN_MIN_WIDTH, getColgroupChildrenLength, previewScaleTable, scaleTa
 import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
 import { TABLE_GUIDELINE_VISIBLE_ADJUSTMENT, TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE, TABLE_SNAP_GAP } from '../ui/consts';
 import { generateResizedPayload, generateResizeFrameRatePayloads, useMeasureFramerate } from '../utils/analytics';
-import { defaultGuidelines } from '../utils/guidelines';
-import { defaultSnappingWidths, findClosestSnap } from '../utils/snapping';
+import { defaultGuidelines, defaultGuidelinesForPreserveTable } from '../utils/guidelines';
+import { defaultSnappingWidths, defaultTablePreserveSnappingWidths, findClosestSnap } from '../utils/snapping';
 const DEBOUNCE_TIME_FOR_SCREEN_READER_ANNOUNCER = 1000;
 const RESIZE_STEP_VALUE = 10;
 const handles = {
@@ -83,7 +83,7 @@ export const TableResizer = ({
   displayGuideline,
   attachAnalyticsEvent,
   displayGapCursor,
-  tablePreserveWidth
+  isTableScalingEnabled
 }) => {
   var _findTable, _editorView$state;
   const currentGap = useRef(0);
@@ -130,13 +130,13 @@ export const TableResizer = ({
   }) => {
     if (gap !== currentGap.current) {
       currentGap.current = gap;
-      const visibleGuidelines = getVisibleGuidelines(defaultGuidelines, containerWidth);
+      const visibleGuidelines = getVisibleGuidelines(isTableScalingEnabled ? defaultGuidelinesForPreserveTable(containerWidth) : defaultGuidelines, containerWidth);
       displayGuideline(getGuidelinesWithHighlights(gap, TABLE_SNAP_GAP, keys, visibleGuidelines));
     }
-  }, [displayGuideline, containerWidth]);
+  }, [isTableScalingEnabled, containerWidth, displayGuideline]);
   const guidelineSnaps = useMemo(() => snappingEnabled ? {
-    x: defaultSnappingWidths
-  } : undefined, [snappingEnabled]);
+    x: isTableScalingEnabled ? defaultTablePreserveSnappingWidths(containerWidth) : defaultSnappingWidths
+  } : undefined, [snappingEnabled, isTableScalingEnabled, containerWidth]);
   useEffect(() => {
     return () => {
       // only bring back the cursor if this table was deleted - i.e. if a user was resizing, then another
@@ -174,12 +174,12 @@ export const TableResizer = ({
       name: TABLE_OVERFLOW_CHANGE_TRIGGER.RESIZED
     });
     dispatch(tr);
-    const visibleGuidelines = getVisibleGuidelines(defaultGuidelines, containerWidth);
+    const visibleGuidelines = getVisibleGuidelines(isTableScalingEnabled ? defaultGuidelinesForPreserveTable(containerWidth) : defaultGuidelines, containerWidth);
     setSnappingEnabled(displayGuideline(visibleGuidelines));
     if (getBooleanFF('platform.editor.resizing-table-height-improvement') && onResizeStart) {
       onResizeStart();
     }
-  }, [displayGapCursor, displayGuideline, editorView, startMeasure, onResizeStart, containerWidth]);
+  }, [startMeasure, editorView, displayGapCursor, isTableScalingEnabled, containerWidth, displayGuideline, onResizeStart]);
   const handleResize = useCallback((originalState, delta) => {
     countFrames();
     const newWidth = originalState.width + delta.width;
@@ -197,11 +197,11 @@ export const TableResizer = ({
       prevNode: node,
       start: pos + 1,
       parentWidth: newWidth
-    }, editorView.domAtPos.bind(editorView), tablePreserveWidth);
-    updateActiveGuidelines(findClosestSnap(newWidth, defaultSnappingWidths, defaultGuidelines, TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE));
+    }, editorView.domAtPos.bind(editorView), isTableScalingEnabled);
+    updateActiveGuidelines(findClosestSnap(newWidth, isTableScalingEnabled ? defaultTablePreserveSnappingWidths(containerWidth) : defaultSnappingWidths, isTableScalingEnabled ? defaultGuidelinesForPreserveTable(containerWidth) : defaultGuidelines, TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE));
     updateWidth(newWidth);
     return newWidth;
-  }, [editorView, getPos, node, tableRef, updateWidth, updateActiveGuidelines, countFrames, tablePreserveWidth]);
+  }, [countFrames, isTableScalingEnabled, tableRef, node, editorView, updateActiveGuidelines, containerWidth, updateWidth, getPos]);
   const scheduleResize = useMemo(() => rafSchd(handleResize), [handleResize]);
   const handleResizeStop = useCallback((originalState, delta) => {
     isResizing.current = false;
@@ -238,7 +238,7 @@ export const TableResizer = ({
         prevNode: node,
         start: pos + 1,
         parentWidth: newWidth
-      }, editorView.domAtPos.bind(editorView), tablePreserveWidth)(tr);
+      }, editorView.domAtPos.bind(editorView), isTableScalingEnabled)(tr);
       const scaledNode = tr.doc.nodeAt(pos);
       (_attachAnalyticsEvent2 = attachAnalyticsEvent(generateResizedPayload({
         originalNode: node,
@@ -256,7 +256,7 @@ export const TableResizer = ({
       onResizeStop();
     }
     return newWidth;
-  }, [displayGapCursor, updateWidth, editorView, getPos, node, tableRef, scheduleResize, displayGuideline, attachAnalyticsEvent, endMeasure, onResizeStop, tablePreserveWidth]);
+  }, [displayGapCursor, updateWidth, editorView, getPos, node, tableRef, scheduleResize, displayGuideline, attachAnalyticsEvent, endMeasure, onResizeStop, isTableScalingEnabled]);
   const handleTableSizeChangeOnKeypress = useCallback(step => {
     const newWidth = width + step;
     if (newWidth > maxWidth || newWidth < resizerMinWidth) {

package/dist/es2019/nodeviews/table.js

@@ -57,17 +57,15 @@ export default class TableView extends ReactNodeView {
     _defineProperty(this, "hasHoveredRows", false);
     this.getPos = props.getPos;
     this.eventDispatcher = props.eventDispatcher;
-    this.getEditorFeatureFlags = props.getEditorFeatureFlags;
+    this.options = props.options;
   }
   getContentDOM() {
     const rendered = DOMSerializer.renderSpec(document, toDOM(this.node, this.reactComponentProps));
     if (rendered.dom) {
+      var _this$options;
       this.table = rendered.dom;
-      const {
-        tablePreserveWidth = false
-      } = this.getEditorFeatureFlags();
       // 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)) {
         const tableInlineWidth = getInlineWidth(this.node, this.reactComponentProps.options, this.reactComponentProps.view.state, this.reactComponentProps.getPos());
         if (tableInlineWidth) {
           handleInlineTableWidth(this.table, tableInlineWidth);
@@ -157,6 +155,7 @@ export default class TableView extends ReactNodeView {
           isHeaderRowEnabled: pluginState.isHeaderRowEnabled,
           isHeaderColumnEnabled: pluginState.isHeaderColumnEnabled,
           isDragAndDropEnabled: pluginState.isDragAndDropEnabled,
+          isTableScalingEnabled: pluginState.isTableScalingEnabled,
           tableActive: tableActive,
           ordering: pluginState.ordering,
           isResizing: isResizing,
@@ -165,8 +164,7 @@ export default class TableView extends ReactNodeView {
           contentDOM: forwardRef,
           getEditorFeatureFlags: props.getEditorFeatureFlags,
           dispatchAnalyticsEvent: props.dispatchAnalyticsEvent,
-          pluginInjectionApi: props.pluginInjectionApi,
-          tableRef: this.table
+          pluginInjectionApi: props.pluginInjectionApi
         });
       }
     });
@@ -234,7 +232,8 @@ export const createTableView = (node, view, getPos, portalProviderAPI, eventDisp
     isFullWidthModeEnabled,
     wasFullWidthModeEnabled,
     isTableResizingEnabled,
-    isDragAndDropEnabled
+    isDragAndDropEnabled,
+    isTableScalingEnabled
   } = getPluginState(view.state);
   const {
     allowColumnResizing
@@ -252,7 +251,8 @@ export const createTableView = (node, view, getPos, portalProviderAPI, eventDisp
       isFullWidthModeEnabled,
       wasFullWidthModeEnabled,
       isTableResizingEnabled,
-      isDragAndDropEnabled
+      isDragAndDropEnabled,
+      isTableScalingEnabled
     },
     getEditorContainerWidth,
     getEditorFeatureFlags,

package/dist/es2019/plugin.js

@@ -18,6 +18,7 @@ import { createPlugin as createDecorationsPlugin } from './pm-plugins/decoration
 import { createPlugin as createDragAndDropPlugin, pluginKey as dragAndDropPluginKey } from './pm-plugins/drag-and-drop';
 import { keymapPlugin } from './pm-plugins/keymap';
 import { createPlugin } from './pm-plugins/main';
+import { getPluginState } from './pm-plugins/plugin-factory';
 import { pluginKey } from './pm-plugins/plugin-key';
 import { createPlugin as createTableSafariDeleteCompositionTextIssueWorkaroundPlugin } from './pm-plugins/safari-delete-composition-text-issue-workaround';
 import { createPlugin as createStickyHeadersPlugin, findStickyHeaderForTable, pluginKey as stickyHeadersPluginKey } from './pm-plugins/sticky-headers';
@@ -68,7 +69,7 @@ const tablesPlugin = ({
     actions: {
       insertTable: analyticsPayload => (state, dispatch) => {
         var _api$contentInsertion, _api$contentInsertion2, _api$contentInsertion3;
-        const node = createTableWithWidth(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags)(state.schema);
+        const node = 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 ? void 0 : (_api$contentInsertion2 = api.contentInsertion) === null || _api$contentInsertion2 === void 0 ? void 0 : (_api$contentInsertion3 = _api$contentInsertion2.actions) === null || _api$contentInsertion3 === void 0 ? void 0 : _api$contentInsertion3.insert({
           state,
           dispatch,
@@ -81,7 +82,7 @@ const tablesPlugin = ({
       }
     },
     commands: {
-      insertTableWithSize: insertTableWithSize(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions)
+      insertTableWithSize: insertTableWithSize(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions)
     },
     nodes() {
       const tableNode = options !== null && options !== void 0 && options.tableResizingEnabled ? tableWithCustomWidth : table;
@@ -116,9 +117,10 @@ const tablesPlugin = ({
             breakoutEnabled,
             tableOptions,
             getEditorFeatureFlags,
-            dragAndDropEnabled
+            dragAndDropEnabled,
+            isTableScalingEnabled
           } = options || {};
-          return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api);
+          return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled);
         }
       }, {
         name: 'tablePMColResizing',
@@ -148,9 +150,9 @@ const tablesPlugin = ({
         plugin: () => {
           const {
             dragAndDropEnabled,
-            getEditorFeatureFlags
+            isTableScalingEnabled = false
           } = options || {};
-          return keymapPlugin(defaultGetEditorContainerWidth, editorAnalyticsAPI, getEditorFeatureFlags, dragAndDropEnabled);
+          return keymapPlugin(defaultGetEditorContainerWidth, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled);
         }
       }, {
         name: 'tableSelectionKeymap',
@@ -184,16 +186,13 @@ const tablesPlugin = ({
         plugin: ({
           dispatch,
           eventDispatcher
-        }) => options && options.tableOptions.stickyHeaders ? createStickyHeadersPlugin(dispatch, eventDispatcher, () => [], (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags) : undefined
+        }) => options && options.tableOptions.stickyHeaders ? createStickyHeadersPlugin(dispatch, () => []) : undefined
       }, {
         name: 'tableDragAndDrop',
         plugin: ({
           dispatch
         }) => {
-          const {
-            getEditorFeatureFlags
-          } = options || {};
-          return options !== null && options !== void 0 && options.dragAndDropEnabled ? createDragAndDropPlugin(dispatch, getEditorFeatureFlags, editorAnalyticsAPI) : undefined;
+          return options !== null && options !== void 0 && options.dragAndDropEnabled ? createDragAndDropPlugin(dispatch, editorAnalyticsAPI) : undefined;
         }
       }, {
         name: 'tableLocalId',
@@ -207,7 +206,7 @@ const tablesPlugin = ({
           dispatch
         }) => {
           var _options$fullWidthEna;
-          return options !== null && options !== void 0 && options.tableResizingEnabled ? createTableWidthPlugin(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;
+          return options !== null && options !== void 0 && options.tableResizingEnabled ? createTableWidthPlugin(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'
@@ -344,8 +343,7 @@ const tablesPlugin = ({
             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.createElement(FloatingContextualMenu, {
             editorView: editorView,
             mountPoint: popupsMountPoint,
@@ -369,8 +367,7 @@ const tablesPlugin = ({
             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.createElement(FloatingDeleteButton, {
             editorView: editorView,
             selection: editorView.state.selection,
@@ -400,7 +397,10 @@ const tablesPlugin = ({
           var _api$table;
           // see comment on tablesPlugin.getSharedState on usage
           const tableState = api === null || api === void 0 ? void 0 : (_api$table = api.table) === null || _api$table === void 0 ? void 0 : _api$table.sharedState.currentState();
-          const tr = insert(createTableWithWidth(tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled, options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags)(state.schema));
+          const {
+            isTableScalingEnabled = false
+          } = getPluginState(state);
+          const tr = insert(createTableWithWidth(isTableScalingEnabled, tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled)(state.schema));
           editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
             action: ACTION.INSERTED,
             actionSubject: ACTION_SUBJECT.DOCUMENT,

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

@@ -17,7 +17,7 @@ import { DropTargetType } from './consts';
 import { createPluginState, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
 import { getDraggableDataFromEvent } from './utils/monitor';
-const destroyFn = (editorView, editorAnalyticsAPI, getEditorFeatureFlags) => {
+const destroyFn = (editorView, editorAnalyticsAPI) => {
   const editorPageScrollContainer = document.querySelector('.fabric-editor-popup-scroll-parent');
   const rowAutoScrollers = editorPageScrollContainer ? [monitorForElements({
     canMonitor({
@@ -162,9 +162,9 @@ const destroyFn = (editorView, editorAnalyticsAPI, getEditorFeatureFlags) => {
           } = getTablePluginState(editorView.state);
           if (tableRef && tableNode) {
             const {
-              tablePreserveWidth = false
-            } = (getEditorFeatureFlags === null || getEditorFeatureFlags === void 0 ? void 0 : getEditorFeatureFlags()) || {};
-            insertColgroupFromNode(tableRef, tableNode, tablePreserveWidth);
+              isTableScalingEnabled = false
+            } = getTablePluginState(editorView.state);
+            insertColgroupFromNode(tableRef, tableNode, isTableScalingEnabled);
           }
         }
         editorView.focus();
@@ -172,7 +172,7 @@ const destroyFn = (editorView, editorAnalyticsAPI, getEditorFeatureFlags) => {
     }
   }));
 };
-export const createPlugin = (dispatch, getEditorFeatureFlags, editorAnalyticsAPI) => {
+export const createPlugin = (dispatch, editorAnalyticsAPI) => {
   return new SafePlugin({
     state: createPluginState(dispatch, state => ({
       decorationSet: DecorationSet.empty,
@@ -241,7 +241,7 @@ export const createPlugin = (dispatch, getEditorFeatureFlags, editorAnalyticsAPI
     },
     view: editorView => {
       return {
-        destroy: destroyFn(editorView, editorAnalyticsAPI, getEditorFeatureFlags)
+        destroy: destroyFn(editorView, editorAnalyticsAPI)
       };
     },
     props: {

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

@@ -18,7 +18,7 @@ const createTableWithAnalytics = editorAnalyticsAPI => withEditorAnalyticsAPI({
   },
   eventType: EVENT_TYPE.TRACK
 })(editorAnalyticsAPI)(createTable());
-export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, getEditorFeatureFlags, dragAndDropEnabled) {
+export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled = false) {
   const list = {};
   bindKeymapWithCommand(nextCell.common, goToNextCell(editorAnalyticsAPI)(1), list);
   bindKeymapWithCommand(previousCell.common, goToNextCell(editorAnalyticsAPI)(-1), list);
@@ -29,8 +29,8 @@ export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, getEdi
   // Add row/column shortcuts
   bindKeymapWithCommand(addRowBefore.common, addRowAroundSelection(editorAnalyticsAPI)('TOP'), list);
   bindKeymapWithCommand(addRowAfter.common, addRowAroundSelection(editorAnalyticsAPI)('BOTTOM'), list);
-  bindKeymapWithCommand(addColumnBefore.common, addColumnBeforeCommand(getEditorContainerWidth), list);
-  bindKeymapWithCommand(addColumnAfter.common, addColumnAfterCommand(getEditorContainerWidth), list);
+  bindKeymapWithCommand(addColumnBefore.common, addColumnBeforeCommand(isTableScalingEnabled), list);
+  bindKeymapWithCommand(addColumnAfter.common, addColumnAfterCommand(isTableScalingEnabled), list);
   if (dragAndDropEnabled) {
     // Move row/column shortcuts
     /**
@@ -50,14 +50,11 @@ export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, getEdi
     bindKeymapWithCommand(deleteRow.common, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut(editorAnalyticsAPI), list);
   }
   if (getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
-    const {
-      tablePreserveWidth = false
-    } = getEditorFeatureFlags ? getEditorFeatureFlags() : {};
     bindKeymapWithCommand(startColumnResizing.common, initiateKeyboardColumnResizing, list);
     bindKeymapWithCommand(moveRight.common, activateNextResizeArea(1), list);
     bindKeymapWithCommand(moveLeft.common, activateNextResizeArea(-1), list);
-    bindKeymapWithCommand(decreaseMediaSize.common, changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(-10, getEditorContainerWidth, tablePreserveWidth, INPUT_METHOD.SHORTCUT), list);
-    bindKeymapWithCommand(increaseMediaSize.common, changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(10, getEditorContainerWidth, tablePreserveWidth, INPUT_METHOD.SHORTCUT), list);
+    bindKeymapWithCommand(decreaseMediaSize.common, changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(-10, getEditorContainerWidth, isTableScalingEnabled, INPUT_METHOD.SHORTCUT), list);
+    bindKeymapWithCommand(increaseMediaSize.common, changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(10, getEditorContainerWidth, isTableScalingEnabled, INPUT_METHOD.SHORTCUT), list);
     bindKeymapWithCommand(escape.common, stopKeyboardColumnResizing(), list);
   }
   return keymap(list);

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

@@ -22,7 +22,7 @@ import { isHeaderRowRequired } from '../utils/paste';
 import { defaultHoveredCell, defaultTableSelection } from './default-table-selection';
 import { createPluginState, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
-export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi) => {
+export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, breakoutEnabled, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled) => {
   var _window;
   const state = createPluginState(dispatch, {
     pluginConfig,
@@ -36,6 +36,7 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
     isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
     isHeaderColumnEnabled: false,
     isDragAndDropEnabled: dragAndDropEnabled,
+    isTableScalingEnabled: isTableScalingEnabled,
     ...defaultHoveredCell,
     ...defaultTableSelection,
     getIntl
@@ -82,12 +83,9 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
           }
         });
       }
-      const {
-        tablePreserveWidth = false
-      } = getEditorFeatureFlags();
       if (tr) {
         // "fixTables" removes empty rows as we don't allow that in schema
-        const updatedTr = handleCut(tr, oldState, newState, editorAnalyticsAPI, editorViewRef || undefined, tablePreserveWidth);
+        const updatedTr = handleCut(tr, oldState, newState, editorAnalyticsAPI, editorViewRef || undefined, isTableScalingEnabled);
         return fixTables(updatedTr) || updatedTr;
       }
       if (transactions.find(tr => tr.docChanged)) {

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

@@ -1,7 +1,7 @@
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { pluginKey } from './plugin-key';
 import { createPluginState } from './plugin-state';
-export const createPlugin = (dispatch, eventDispatcher, initialState = () => [], getEditorFeatureFlags) => {
+export const createPlugin = (dispatch, initialState = () => []) => {
   return new SafePlugin({
     state: createPluginState(dispatch, initialState),
     key: pluginKey

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

@@ -22,8 +22,8 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
   const editorDisabled = !view.editable;
   const domAtPos = view.domAtPos.bind(view);
   const {
-    tablePreserveWidth = false
-  } = getEditorFeatureFlags();
+    isTableScalingEnabled = false
+  } = getTablePluginState(state);
   if (editorDisabled || localResizeHandlePos === null || !pointsAtCell(state.doc.resolve(localResizeHandlePos))) {
     return false;
   }
@@ -71,7 +71,7 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
     tableRef: dom,
     start,
     domAtPos,
-    tablePreserveWidth
+    isTableScalingEnabled: isTableScalingEnabled
   });
   if (evenColumns({
     resizeState,
@@ -153,7 +153,7 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
         const selectedColumns = selectionRect ? getSelectedColumnIndexes(selectionRect) : [];
         // only selected (or selected - 1) columns should be distributed
         const resizingSelectedColumns = selectedColumns.indexOf(colIndex) > -1 || selectedColumns.indexOf(colIndex + 1) > -1;
-        const newResizeState = resizeColumn(resizeState, colIndex, clientX - startX, dom, resizingSelectedColumns ? selectedColumns : undefined, tablePreserveWidth);
+        const newResizeState = resizeColumn(resizeState, colIndex, clientX - startX, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, isTableScalingEnabled);
         const resizedDelta = clientX - startX;
         tr = updateColumnWidths(newResizeState, table, start)(tr);
         if (colIndex === map.width - 1) {
@@ -222,7 +222,7 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
     const table = $cell.node(-1);
     const map = TableMap.get(table);
     const colIndex = map.colCount($cell.pos - $cell.start(-1)) + $cell.nodeAfter.attrs.colspan - 1;
-    resizeColumn(resizeState, colIndex, clientX - dragging.startX, dom, undefined, tablePreserveWidth);
+    resizeColumn(resizeState, colIndex, clientX - dragging.startX, dom, table, undefined, isTableScalingEnabled);
     updateControls()(state);
   }
   window.addEventListener('mouseup', finish);

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

@@ -75,12 +75,12 @@ export const generateColgroup = (table, tableRef) => {
   }
   return cols;
 };
-export const insertColgroupFromNode = (tableRef, table, tablePreserveWidth = false, shouldRemove = true) => {
+export const insertColgroupFromNode = (tableRef, table, isTableScalingEnabled = false, shouldRemove = true) => {
   let 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/es2019/pm-plugins/table-resizing/utils/consts.js

@@ -1,4 +1,6 @@
 export const COLUMN_MIN_WIDTH = 48;
 export const TABLE_DEFAULT_WIDTH = 760;
 export const TABLE_MAX_WIDTH = 1800;
-export const MAX_SCALING_PERCENT = 0.3;
+export const MAX_SCALING_PERCENT = 0.3;
+// Used to calculate the width of a table using the Editor width
+export const TABLE_EDITOR_MARGIN = 76;

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

@@ -3,7 +3,7 @@ export { contentWidth } from './content-width';
 export { getColumnStateFromDOM, getFreeSpace, getCellsRefsInColumn, calculateColumnWidth, addContainerLeftRightPadding } from './column-state';
 export { growColumn, shrinkColumn, reduceSpace } from './resize-logic';
 export { getResizeState, updateColgroup, getTotalWidth, evenAllColumnsWidths, bulkColumnsResize, areColumnsEven, adjustColumnsWidths } from './resize-state';
-export { getLayoutSize, getDefaultLayoutMaxWidth, pointsAtCell, currentColWidth, domCellAround, getTableMaxWidth, getTableElementWidth, getTableContainerElement } from './misc';
+export { getLayoutSize, getDefaultLayoutMaxWidth, pointsAtCell, currentColWidth, domCellAround, getTableMaxWidth, getTableElementWidth, getTableContainerElementWidth } from './misc';
 export { updateControls, isClickNear, getResizeCellPos } from './dom';
 export { scale, scaleWithParent, scaleTable, previewScaleTable } from './scale-table';
 export { resizeColumn } from './resize-column';

package/dist/es2019/pm-plugins/table-resizing/utils/misc.js

@@ -85,8 +85,8 @@ export const getTableElementWidth = table => {
     // TODO: is there a scenario where ADF columns are SMALLER than container width?
     return calcTableColumnWidths(table).reduce((sum, width) => sum + width, 0);
   }
-  return getTableContainerElement(table);
+  return getTableContainerElementWidth(table);
 };
-export const getTableContainerElement = table => {
+export const getTableContainerElementWidth = table => {
   return getTableContainerWidth(table);
 };

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

@@ -1,8 +1,9 @@
 // Resize a given column by an amount from the current state
+
 import { growColumn, shrinkColumn } from './resize-logic';
 import { updateColgroup } from './resize-state';
-export const resizeColumn = (resizeState, colIndex, amount, tableRef, selectedColumns, tablePreserveWidth = false) => {
+export const resizeColumn = (resizeState, colIndex, amount, tableRef, tableNode, selectedColumns, isTableScalingEnabled = false) => {
   const newState = amount > 0 ? growColumn(resizeState, colIndex, amount, selectedColumns) : amount < 0 ? shrinkColumn(resizeState, colIndex, amount, selectedColumns) : resizeState;
-  updateColgroup(newState, tableRef, tablePreserveWidth);
+  updateColgroup(newState, tableRef, tableNode, isTableScalingEnabled);
   return newState;
 };

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

@@ -5,8 +5,8 @@ import { getSelectedTableInfo } from '../../../utils';
 import { getColWidthFix, hasTableBeenResized, insertColgroupFromNode } from './colgroup';
 import { getCellsRefsInColumn, getColumnStateFromDOM } from './column-state';
 import { syncStickyRowToTable } from './dom';
-import { getTableMaxWidth } from './misc';
-import { MAX_SCALING_PERCENT, TABLE_DEFAULT_WIDTH } from './index';
+import { getTableContainerElementWidth, getTableMaxWidth } from './misc';
+import { COLUMN_MIN_WIDTH, MAX_SCALING_PERCENT, TABLE_DEFAULT_WIDTH } from './index';
 export const getResizeState = ({
   minWidth,
   maxSize,
@@ -14,7 +14,7 @@ export const getResizeState = ({
   tableRef,
   start,
   domAtPos,
-  tablePreserveWidth = false
+  isTableScalingEnabled = false
 }) => {
   // If the table has been resized, we can use the column widths from the table node
   if (hasTableBeenResized(table)) {
@@ -34,19 +34,19 @@ export const getResizeState = ({
       overflow
     };
   }
-  const shouldReinsertColgroup = !tablePreserveWidth;
+  const shouldReinsertColgroup = !isTableScalingEnabled;
 
   // Getting the resize state from DOM
-  const colgroupChildren = insertColgroupFromNode(tableRef, table, tablePreserveWidth, shouldReinsertColgroup // don't reinsert colgroup when preserving table width - this causes widths to jump
+  const colgroupChildren = insertColgroupFromNode(tableRef, table, isTableScalingEnabled, shouldReinsertColgroup // don't reinsert colgroup when preserving table width - this causes widths to jump
   );
   const cols = Array.from(colgroupChildren).map((_, index) => {
     // If the table hasn't been resized and we have a table width attribute, we can use it
     // to calculate the widths of the columns
-    if (tablePreserveWidth && table.attrs.width) {
+    if (isTableScalingEnabled && table.attrs.width) {
       return {
         index,
         width: table.attrs.width / colgroupChildren.length,
-        minWidth: 48
+        minWidth: COLUMN_MIN_WIDTH
       };
     }
     const cellsRefs = getCellsRefsInColumn(index, table, start, domAtPos);
@@ -65,13 +65,12 @@ export const getResizeState = ({
 };
 
 // updates Colgroup DOM node with new widths
-export const updateColgroup = (state, tableRef, tablePreserveWidth) => {
+export const updateColgroup = (state, tableRef, tableNode, isTableScalingEnabled) => {
   const cols = tableRef.querySelectorAll('col');
   if (getBooleanFF('platform.editor.custom-table-width')) {
     const columnsCount = cols.length;
-    if (tablePreserveWidth) {
-      var _tableRef$dataset;
-      const tableWidth = parseInt(((_tableRef$dataset = tableRef.dataset) === null || _tableRef$dataset === void 0 ? void 0 : _tableRef$dataset.tableWidth) || ''); // TODO - get this value from the table node, not the dom
+    if (isTableScalingEnabled && tableNode) {
+      const tableWidth = getTableContainerElementWidth(tableNode);
       if (tableWidth) {
         var _tableRef$parentEleme;
         let renderWidth = ((_tableRef$parentEleme = tableRef.parentElement) === null || _tableRef$parentEleme === void 0 ? void 0 : _tableRef$parentEleme.clientWidth) || TABLE_DEFAULT_WIDTH;
@@ -275,7 +274,7 @@ export const normaliseTableLayout = input => {
       return 'default';
   }
 };
-export const getNewResizeStateFromSelectedColumns = (rect, state, domAtPos, getEditorContainerWidth, tablePreserveWidth = false) => {
+export const getNewResizeStateFromSelectedColumns = (rect, state, domAtPos, getEditorContainerWidth, isTableScalingEnabled = false) => {
   // Fail early so that we don't do complex calculations for no reason
   const numColumnsSelected = rect.right - rect.left;
   if (numColumnsSelected <= 1) {
@@ -314,7 +313,7 @@ export const getNewResizeStateFromSelectedColumns = (rect, state, domAtPos, getE
     tableRef,
     start: table.start,
     domAtPos,
-    tablePreserveWidth
+    isTableScalingEnabled
   });
   const newResizeState = evenSelectedColumnsWidths(resizeState, rect);
   const widthsBefore = resizeState.widths;

package/dist/es2019/pm-plugins/table-resizing/utils/scale-table.js

@@ -10,7 +10,7 @@ import { hasTableBeenResized, insertColgroupFromNode } from './colgroup';
 import { syncStickyRowToTable } from './dom';
 // Base function to trigger the actual scale on a table node.
 // Will only resize/scale if a table has been previously resized.
-export const scale = (tableRef, options, domAtPos, tablePreserveWidth = false) => {
+export const scale = (tableRef, options, domAtPos, isTableScalingEnabled = false) => {
   /**
    * isBreakoutEnabled === true -> default center aligned
    * isBreakoutEnabled === false -> full width mode
@@ -58,11 +58,11 @@ export const scale = (tableRef, options, domAtPos, tablePreserveWidth = false) =
     tableRef,
     start,
     domAtPos,
-    tablePreserveWidth
+    isTableScalingEnabled
   });
   return scaleTableTo(resizeState, newWidth);
 };
-export const scaleWithParent = (tableRef, parentWidth, table, start, domAtPos, tablePreserveWidth = false) => {
+export const scaleWithParent = (tableRef, parentWidth, table, start, domAtPos, isTableScalingEnabled = false) => {
   const resizeState = getResizeState({
     minWidth: tableCellMinWidth,
     maxSize: parentWidth,
@@ -70,7 +70,7 @@ export const scaleWithParent = (tableRef, parentWidth, table, start, domAtPos, t
     tableRef,
     start,
     domAtPos,
-    tablePreserveWidth
+    isTableScalingEnabled
   });
   if (table.attrs.isNumberColumnEnabled) {
     parentWidth -= akEditorTableNumberColumnWidth;
@@ -105,7 +105,7 @@ export function scaleTableTo(state, maxSize) {
   }
   return adjustColumnsWidths(newState, maxSize);
 }
-export const previewScaleTable = (tableRef, options, domAtPos, tablePreserveWidth = false) => {
+export const previewScaleTable = (tableRef, options, domAtPos, isTableScalingEnabled = false) => {
   const {
     node,
     start,
@@ -121,19 +121,19 @@ export const previewScaleTable = (tableRef, options, domAtPos, tablePreserveWidt
   }
 
   // If the table hasn't been resize, the colgroup 48px width values will gracefully scale down.
-  // If we are scaling the table down with tablePreserveWidth, the colgroup widths may be scaled to a value that is not 48px.
-  if (!hasTableBeenResized(node) && !tablePreserveWidth) {
+  // If we are scaling the table down with isTableScalingEnabled, the colgroup widths may be scaled to a value that is not 48px.
+  if (!hasTableBeenResized(node) && !isTableScalingEnabled) {
     syncStickyRowToTable(tableRef);
     return;
   }
-  const resizeState = parentWidth ? scaleWithParent(tableRef, parentWidth, node, start, domAtPos, tablePreserveWidth) : scale(tableRef, options, domAtPos, tablePreserveWidth);
+  const resizeState = parentWidth ? scaleWithParent(tableRef, parentWidth, node, start, domAtPos, isTableScalingEnabled) : scale(tableRef, options, domAtPos, isTableScalingEnabled);
   if (resizeState) {
-    updateColgroup(resizeState, tableRef, tablePreserveWidth);
+    updateColgroup(resizeState, tableRef, node, isTableScalingEnabled);
   }
 };
 
 // Scale the table to meet new requirements (col, layout change etc)
-export const scaleTable = (tableRef, options, domAtPos, tablePreserveWidth = false) => tr => {
+export const scaleTable = (tableRef, options, domAtPos, isTableScalingEnabled = false) => tr => {
   if (!tableRef) {
     return tr;
   }
@@ -147,7 +147,7 @@ export const scaleTable = (tableRef, options, domAtPos, tablePreserveWidth = fal
   if (hasTableBeenResized(node) === false) {
     // If its not a re-sized table, we still want to re-create cols
     // To force reflow of columns upon delete.
-    if (!tablePreserveWidth) {
+    if (!isTableScalingEnabled) {
       insertColgroupFromNode(tableRef, node);
     }
     tr.setMeta('scrollIntoView', false);
@@ -155,9 +155,9 @@ export const scaleTable = (tableRef, options, domAtPos, tablePreserveWidth = fal
   }
   let resizeState;
   if (parentWidth) {
-    resizeState = scaleWithParent(tableRef, parentWidth, node, start, domAtPos, tablePreserveWidth);
+    resizeState = scaleWithParent(tableRef, parentWidth, node, start, domAtPos, isTableScalingEnabled);
   } else {
-    resizeState = scale(tableRef, options, domAtPos, tablePreserveWidth);
+    resizeState = scale(tableRef, options, domAtPos, isTableScalingEnabled);
   }
   if (resizeState) {
     tr = updateColumnWidths(resizeState, node, start)(tr);