@atlaskit/editor-plugin-table 7.5.4 → 7.5.5

package/src/pm-plugins/keymap.ts

@@ -30,10 +30,7 @@ import {
   toggleTable,
 } from '@atlaskit/editor-common/keymaps';
 import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import type {
-  GetEditorContainerWidth,
-  GetEditorFeatureFlags,
-} from '@atlaskit/editor-common/types';
+import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
@@ -72,8 +69,8 @@ const createTableWithAnalytics = (
 export function keymapPlugin(
   getEditorContainerWidth: GetEditorContainerWidth,
   editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
-  getEditorFeatureFlags?: GetEditorFeatureFlags,
   dragAndDropEnabled?: boolean,
+  isTableScalingEnabled = false,
 ): SafePlugin {
   const list = {};
 
@@ -121,13 +118,13 @@ export function keymapPlugin(
 
   bindKeymapWithCommand(
     addColumnBefore.common!,
-    addColumnBeforeCommand(getEditorContainerWidth),
+    addColumnBeforeCommand(isTableScalingEnabled),
     list,
   );
 
   bindKeymapWithCommand(
     addColumnAfter.common!,
-    addColumnAfterCommand(getEditorContainerWidth),
+    addColumnAfterCommand(isTableScalingEnabled),
     list,
   );
 
@@ -182,10 +179,6 @@ export function keymapPlugin(
   }
 
   if (getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
-    const { tablePreserveWidth = false } = getEditorFeatureFlags
-      ? getEditorFeatureFlags()
-      : {};
-
     bindKeymapWithCommand(
       startColumnResizing.common!,
       initiateKeyboardColumnResizing,
@@ -201,7 +194,7 @@ export function keymapPlugin(
       changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(
         -10,
         getEditorContainerWidth,
-        tablePreserveWidth,
+        isTableScalingEnabled,
         INPUT_METHOD.SHORTCUT,
       ),
       list,
@@ -212,7 +205,7 @@ export function keymapPlugin(
       changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(
         10,
         getEditorContainerWidth,
-        tablePreserveWidth,
+        isTableScalingEnabled,
         INPUT_METHOD.SHORTCUT,
       ),
       list,

package/src/pm-plugins/main.ts

@@ -114,6 +114,7 @@ export const createPlugin = (
   dragAndDropEnabled?: boolean,
   editorAnalyticsAPI?: EditorAnalyticsAPI,
   pluginInjectionApi?: PluginInjectionAPI,
+  isTableScalingEnabled?: boolean,
 ) => {
   const state = createPluginState(dispatch, {
     pluginConfig,
@@ -127,6 +128,7 @@ export const createPlugin = (
     isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
     isHeaderColumnEnabled: false,
     isDragAndDropEnabled: dragAndDropEnabled,
+    isTableScalingEnabled: isTableScalingEnabled,
     ...defaultHoveredCell,
     ...defaultTableSelection,
     getIntl,
@@ -188,8 +190,6 @@ export const createPlugin = (
         });
       }
 
-      const { tablePreserveWidth = false } = getEditorFeatureFlags();
-
       if (tr) {
         // "fixTables" removes empty rows as we don't allow that in schema
         const updatedTr = handleCut(
@@ -198,7 +198,7 @@ export const createPlugin = (
           newState,
           editorAnalyticsAPI,
           editorViewRef || undefined,
-          tablePreserveWidth,
+          isTableScalingEnabled,
         );
         return fixTables(updatedTr) || updatedTr;
       }

package/src/pm-plugins/sticky-headers/plugin.ts

@@ -1,19 +1,10 @@
-import type {
-  Dispatch,
-  EventDispatcher,
-} from '@atlaskit/editor-common/event-dispatcher';
+import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import type { GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
 
 import { pluginKey } from './plugin-key';
 import { createPluginState } from './plugin-state';
 
-export const createPlugin = (
-  dispatch: Dispatch,
-  eventDispatcher: EventDispatcher,
-  initialState = () => [],
-  getEditorFeatureFlags: GetEditorFeatureFlags,
-) => {
+export const createPlugin = (dispatch: Dispatch, initialState = () => []) => {
   return new SafePlugin({
     state: createPluginState(dispatch, initialState),
     key: pluginKey,

package/src/pm-plugins/table-resizing/event-handlers.ts

@@ -49,7 +49,7 @@ export const handleMouseDown = (
   const { state, dispatch } = view;
   const editorDisabled = !view.editable;
   const domAtPos = view.domAtPos.bind(view);
-  const { tablePreserveWidth = false } = getEditorFeatureFlags();
+  const { isTableScalingEnabled = false } = getTablePluginState(state);
 
   if (
     editorDisabled ||
@@ -119,7 +119,7 @@ export const handleMouseDown = (
     tableRef: dom,
     start,
     domAtPos,
-    tablePreserveWidth,
+    isTableScalingEnabled: isTableScalingEnabled,
   });
 
   if (
@@ -209,8 +209,9 @@ export const handleMouseDown = (
           colIndex,
           clientX - startX,
           dom,
+          originalTable,
           resizingSelectedColumns ? selectedColumns : undefined,
-          tablePreserveWidth,
+          isTableScalingEnabled,
         );
 
         const resizedDelta = clientX - startX;
@@ -292,8 +293,9 @@ export const handleMouseDown = (
       colIndex,
       clientX - dragging.startX,
       dom,
+      table,
       undefined,
-      tablePreserveWidth,
+      isTableScalingEnabled,
     );
 
     updateControls()(state);

package/src/pm-plugins/table-resizing/utils/colgroup.ts

@@ -95,7 +95,7 @@ export const generateColgroup = (table: PmNode, tableRef?: HTMLElement) => {
 export const insertColgroupFromNode = (
   tableRef: HTMLTableElement,
   table: PmNode,
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
   shouldRemove = true,
 ): HTMLCollection => {
   let colgroup = tableRef.querySelector('colgroup') as HTMLElement;
@@ -105,7 +105,7 @@ export const insertColgroupFromNode = (
 
   colgroup = renderColgroupFromNode(
     table,
-    tablePreserveWidth ? tableRef : undefined,
+    isTableScalingEnabled ? tableRef : undefined,
   );
   if (shouldRemove) {
     tableRef.insertBefore(colgroup, tableRef.firstChild);

package/src/pm-plugins/table-resizing/utils/consts.ts

@@ -2,3 +2,5 @@ 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;
+// Used to calculate the width of a table using the Editor width
+export const TABLE_EDITOR_MARGIN = 76;

package/src/pm-plugins/table-resizing/utils/index.ts

@@ -31,7 +31,7 @@ export {
   domCellAround,
   getTableMaxWidth,
   getTableElementWidth,
-  getTableContainerElement,
+  getTableContainerElementWidth,
 } from './misc';
 export { updateControls, isClickNear, getResizeCellPos } from './dom';
 export {

package/src/pm-plugins/table-resizing/utils/misc.ts

@@ -150,9 +150,9 @@ export const getTableElementWidth = (table: PMNode) => {
     return calcTableColumnWidths(table).reduce((sum, width) => sum + width, 0);
   }
 
-  return getTableContainerElement(table);
+  return getTableContainerElementWidth(table);
 };
 
-export const getTableContainerElement = (table: PMNode) => {
+export const getTableContainerElementWidth = (table: PMNode) => {
   return getTableContainerWidth(table);
 };

package/src/pm-plugins/table-resizing/utils/resize-column.ts

@@ -1,4 +1,6 @@
 // Resize a given column by an amount from the current state
+import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
+
 import { growColumn, shrinkColumn } from './resize-logic';
 import { updateColgroup } from './resize-state';
 import type { ResizeState } from './types';
@@ -8,8 +10,9 @@ export const resizeColumn = (
   colIndex: number,
   amount: number,
   tableRef: HTMLElement,
+  tableNode: PmNode,
   selectedColumns?: number[],
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
 ): ResizeState => {
   const newState =
     amount > 0
@@ -18,7 +21,7 @@ export const resizeColumn = (
       ? shrinkColumn(resizeState, colIndex, amount, selectedColumns)
       : resizeState;
 
-  updateColgroup(newState, tableRef, tablePreserveWidth);
+  updateColgroup(newState, tableRef, tableNode, isTableScalingEnabled);
 
   return newState;
 };

package/src/pm-plugins/table-resizing/utils/resize-state.ts

@@ -20,10 +20,14 @@ import {
 import type { ColumnState } from './column-state';
 import { getCellsRefsInColumn, getColumnStateFromDOM } from './column-state';
 import { syncStickyRowToTable } from './dom';
-import { getTableMaxWidth } from './misc';
+import { getTableContainerElementWidth, getTableMaxWidth } from './misc';
 import type { ResizeState, ResizeStateWithAnalytics } from './types';
 
-import { MAX_SCALING_PERCENT, TABLE_DEFAULT_WIDTH } from './index';
+import {
+  COLUMN_MIN_WIDTH,
+  MAX_SCALING_PERCENT,
+  TABLE_DEFAULT_WIDTH,
+} from './index';
 
 export const getResizeState = ({
   minWidth,
@@ -32,7 +36,7 @@ export const getResizeState = ({
   tableRef,
   start,
   domAtPos,
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
 }: {
   minWidth: number;
   maxSize: number;
@@ -40,7 +44,7 @@ export const getResizeState = ({
   tableRef: HTMLTableElement;
   start: number;
   domAtPos: (pos: number) => { node: Node; offset: number };
-  tablePreserveWidth: boolean;
+  isTableScalingEnabled: boolean;
 }): ResizeState => {
   // If the table has been resized, we can use the column widths from the table node
   if (hasTableBeenResized(table)) {
@@ -63,23 +67,23 @@ export const getResizeState = ({
     };
   }
 
-  const shouldReinsertColgroup = !tablePreserveWidth;
+  const shouldReinsertColgroup = !isTableScalingEnabled;
 
   // Getting the resize state from DOM
   const colgroupChildren = insertColgroupFromNode(
     tableRef,
     table,
-    tablePreserveWidth,
+    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);
@@ -104,14 +108,15 @@ export const getResizeState = ({
 export const updateColgroup = (
   state: ResizeState,
   tableRef: HTMLElement,
-  tablePreserveWidth?: boolean,
+  tableNode?: PMNode,
+  isTableScalingEnabled?: boolean,
 ): void => {
   const cols = tableRef.querySelectorAll('col');
 
   if (getBooleanFF('platform.editor.custom-table-width')) {
     const columnsCount = cols.length;
-    if (tablePreserveWidth) {
-      const tableWidth = parseInt(tableRef.dataset?.tableWidth || ''); // TODO - get this value from the table node, not the dom
+    if (isTableScalingEnabled && tableNode) {
+      const tableWidth = getTableContainerElementWidth(tableNode);
       if (tableWidth) {
         let renderWidth =
           tableRef.parentElement?.clientWidth || TABLE_DEFAULT_WIDTH;
@@ -349,7 +354,7 @@ export const getNewResizeStateFromSelectedColumns = (
   state: EditorState,
   domAtPos: (pos: number) => { node: Node; offset: number },
   getEditorContainerWidth: GetEditorContainerWidth,
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
 ): ResizeStateWithAnalytics | undefined => {
   // Fail early so that we don't do complex calculations for no reason
   const numColumnsSelected = rect.right - rect.left;
@@ -394,7 +399,7 @@ export const getNewResizeStateFromSelectedColumns = (
     tableRef,
     start: table.start,
     domAtPos,
-    tablePreserveWidth,
+    isTableScalingEnabled,
   });
 
   const newResizeState = evenSelectedColumnsWidths(resizeState, rect);

package/src/pm-plugins/table-resizing/utils/scale-table.ts

@@ -39,7 +39,7 @@ export const scale = (
   tableRef: HTMLTableElement,
   options: ScaleOptions,
   domAtPos: DomAtPos,
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
 ): ResizeState | undefined => {
   /**
    * isBreakoutEnabled === true -> default center aligned
@@ -98,7 +98,7 @@ export const scale = (
     tableRef,
     start,
     domAtPos,
-    tablePreserveWidth,
+    isTableScalingEnabled,
   });
 
   return scaleTableTo(resizeState, newWidth);
@@ -110,7 +110,7 @@ export const scaleWithParent = (
   table: PMNode,
   start: number,
   domAtPos: DomAtPos,
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
 ) => {
   const resizeState = getResizeState({
     minWidth: tableCellMinWidth,
@@ -119,7 +119,7 @@ export const scaleWithParent = (
     tableRef,
     start,
     domAtPos,
-    tablePreserveWidth,
+    isTableScalingEnabled,
   });
 
   if (table.attrs.isNumberColumnEnabled) {
@@ -158,7 +158,7 @@ export const previewScaleTable = (
   tableRef: HTMLTableElement | null | undefined,
   options: ScaleOptions,
   domAtPos: DomAtPos,
-  tablePreserveWidth: boolean = false,
+  isTableScalingEnabled: boolean = false,
 ) => {
   const { node, start, parentWidth } = options;
 
@@ -175,8 +175,8 @@ export const previewScaleTable = (
   }
 
   // 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;
   }
@@ -188,12 +188,12 @@ export const previewScaleTable = (
         node,
         start,
         domAtPos,
-        tablePreserveWidth,
+        isTableScalingEnabled,
       )
-    : scale(tableRef, options, domAtPos, tablePreserveWidth);
+    : scale(tableRef, options, domAtPos, isTableScalingEnabled);
 
   if (resizeState) {
-    updateColgroup(resizeState, tableRef, tablePreserveWidth);
+    updateColgroup(resizeState, tableRef, node, isTableScalingEnabled);
   }
 };
 
@@ -203,7 +203,7 @@ export const scaleTable =
     tableRef: HTMLTableElement | null | undefined,
     options: ScaleOptions,
     domAtPos: DomAtPos,
-    tablePreserveWidth = false,
+    isTableScalingEnabled = false,
   ) =>
   (tr: Transaction) => {
     if (!tableRef) {
@@ -215,7 +215,7 @@ export const scaleTable =
     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);
@@ -230,10 +230,10 @@ export const scaleTable =
         node,
         start,
         domAtPos,
-        tablePreserveWidth,
+        isTableScalingEnabled,
       );
     } else {
-      resizeState = scale(tableRef, options, domAtPos, tablePreserveWidth);
+      resizeState = scale(tableRef, options, domAtPos, isTableScalingEnabled);
     }
 
     if (resizeState) {

package/src/pm-plugins/table-width.ts

@@ -14,7 +14,6 @@ import {
 import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import type { GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { ReplaceStep } from '@atlaskit/editor-prosemirror/transform';
 import {
@@ -24,6 +23,7 @@ import {
 } 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';
 
 type __ReplaceStep = ReplaceStep & {
@@ -44,7 +44,6 @@ const createPlugin = (
   dispatch: Dispatch,
   dispatchAnalyticsEvent: DispatchAnalyticsEvent,
   fullWidthEnabled: boolean,
-  getEditorFeatureFlags?: GetEditorFeatureFlags,
 ) => {
   return new SafePlugin({
     key: pluginKey,
@@ -123,10 +122,9 @@ const createPlugin = (
         tr.getMeta('referentialityTableInserted'),
       );
 
-      const shouldPatchTable =
-        fullWidthEnabled &&
-        getEditorFeatureFlags &&
-        getEditorFeatureFlags()['tablePreserveWidth'];
+      const { isTableScalingEnabled = false } = getPluginState(newState);
+
+      const shouldPatchTable = fullWidthEnabled && isTableScalingEnabled;
 
       if (
         !isReplaceDocumentOperation &&

package/src/toolbar.tsx

@@ -169,7 +169,7 @@ export const getToolbarCellOptionsConfig = (
   { formatMessage }: ToolbarMenuContext,
   getEditorContainerWidth: GetEditorContainerWidth,
   editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
 ): FloatingToolbarDropdown<Command> => {
   const { top, bottom, right, left } = initialSelectionRect;
   const numberOfColumns = right - left;
@@ -188,11 +188,10 @@ export const getToolbarCellOptionsConfig = (
         const selectionRect = getClosestSelectionRect(state);
         const index = 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;
       },
@@ -294,7 +293,7 @@ export const getToolbarCellOptionsConfig = (
           editorState,
           editorView.domAtPos.bind(editorView),
           getEditorContainerWidth,
-          tablePreserveWidth,
+          isTableScalingEnabled,
         )
       : undefined;
     const wouldChange = newResizeStateWithAnalytics?.changed ?? false;
@@ -462,19 +461,18 @@ export const getToolbarConfig =
         editorAnalyticsAPI,
       );
 
-      const { tablePreserveWidth = false } = getEditorFeatureFlags();
+      const { isTableScalingEnabled = false } = getPluginState(state);
 
       let cellItems: Array<FloatingToolbarItem<Command>>;
       cellItems = pluginState.isDragAndDropEnabled
         ? []
         : getCellItems(
-            config,
             state,
             getEditorView(),
             intl,
             getEditorContainerWidth,
             editorAnalyticsAPI,
-            tablePreserveWidth,
+            isTableScalingEnabled,
           );
 
       let columnSettingsItems;
@@ -487,7 +485,7 @@ export const getToolbarConfig =
               intl,
               getEditorContainerWidth,
               editorAnalyticsAPI,
-              tablePreserveWidth,
+              isTableScalingEnabled,
             )
           : [];
       const colorPicker = getColorPicker(state, menu, intl, editorAnalyticsAPI);
@@ -607,13 +605,12 @@ const separator = (hidden?: boolean): FloatingToolbarItem<Command> => {
 };
 
 const getCellItems = (
-  pluginConfig: PluginConfig,
   state: EditorState,
   view: EditorView | null,
   { formatMessage }: ToolbarMenuContext,
   getEditorContainerWidth: GetEditorContainerWidth,
   editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
 ): Array<FloatingToolbarItem<Command>> => {
   const initialSelectionRect = getClosestSelectionRect(state);
   if (initialSelectionRect) {
@@ -624,7 +621,7 @@ const getCellItems = (
       { formatMessage },
       getEditorContainerWidth,
       editorAnalyticsAPI,
-      tablePreserveWidth,
+      isTableScalingEnabled,
     );
     return [cellOptions, separator(cellOptions.hidden!)];
   }
@@ -635,7 +632,7 @@ export const getDistributeConfig =
   (
     getEditorContainerWidth: GetEditorContainerWidth,
     editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
-    tablePreserveWidth = false,
+    isTableScalingEnabled = false,
   ): Command =>
   (state, dispatch, editorView) => {
     const selectionOrTableRect = getClosestSelectionOrTableRect(state);
@@ -647,7 +644,7 @@ export const getDistributeConfig =
       state,
       editorView.domAtPos.bind(editorView),
       getEditorContainerWidth,
-      tablePreserveWidth,
+      isTableScalingEnabled,
     );
 
     if (newResizeStateWithAnalytics) {
@@ -668,7 +665,7 @@ const getColumnSettingItems = (
   { formatMessage }: ToolbarMenuContext,
   getEditorContainerWidth: GetEditorContainerWidth,
   editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
-  tablePreserveWidth = false,
+  isTableScalingEnabled = false,
 ): Array<FloatingToolbarItem<Command>> => {
   const pluginState = getPluginState(editorState);
   const selectionOrTableRect = getClosestSelectionOrTableRect(editorState);
@@ -682,7 +679,7 @@ const getColumnSettingItems = (
     editorState,
     editorView.domAtPos.bind(editorView),
     getEditorContainerWidth,
-    tablePreserveWidth,
+    isTableScalingEnabled,
   );
 
   const wouldChange = newResizeStateWithAnalytics?.changed ?? false;
@@ -701,7 +698,7 @@ const getColumnSettingItems = (
           getDistributeConfig(
             getEditorContainerWidth,
             editorAnalyticsAPI,
-            tablePreserveWidth,
+            isTableScalingEnabled,
           )(state, dispatch, view),
         disabled: !wouldChange,
       },

package/src/transforms/column-width.ts

@@ -10,7 +10,7 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
 import type { ResizeState } from '../pm-plugins/table-resizing/utils';
 import {
-  getTableContainerElement,
+  getTableContainerElementWidth,
   getTableElementWidth,
   hasTableBeenResized,
 } from '../pm-plugins/table-resizing/utils';
@@ -108,7 +108,7 @@ export const updateColumnWidths =
  * @returns Updated transaction with rescaled columns for a given table
  */
 export const rescaleColumns =
-  (tablePreserveWidth = false) =>
+  (isTableScalingEnabled = false) =>
   (table: ContentNodeWithPos, view: EditorView | undefined) =>
   (tr: Transaction): Transaction => {
     if (!view) {
@@ -132,13 +132,14 @@ export const rescaleColumns =
       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,
+          ? getTableContainerElementWidth(table.node)
+          : getTableContainerElementWidth(table.node) -
+            insertColumnButtonOffset,
         isResized,
       };
     } else {
@@ -216,7 +217,7 @@ export const rescaleColumns =
       tableRef,
       domAtPos,
       maxSize: previousTableInfo.possibleMaxWidth,
-      tablePreserveWidth,
+      isTableScalingEnabled,
     });
 
     // Two scenarios that require scaling:

package/src/transforms/delete-columns.ts

@@ -253,7 +253,7 @@ export const deleteColumns =
     rect: Rect,
     allowCustomStep: boolean,
     view?: EditorView,
-    tablePreserveWidth = false,
+    isTableScalingEnabled = false,
   ) =>
   (tr: Transaction) => {
     let updatedTr = tr;
@@ -269,7 +269,7 @@ export const deleteColumns =
     const table = findTable(updatedTr.selection);
 
     if (table) {
-      updatedTr = rescaleColumns(tablePreserveWidth)(table, view)(updatedTr);
+      updatedTr = rescaleColumns(isTableScalingEnabled)(table, view)(updatedTr);
     }
     return updatedTr;
   };

package/src/types.ts

@@ -138,6 +138,7 @@ export interface TablePluginState {
   isTableResizingEnabled?: boolean;
   isDragAndDropEnabled?: boolean;
   isTableHovered?: boolean;
+  isTableScalingEnabled?: boolean;
 }
 
 export type TablePluginAction =