@atlaskit/editor-plugin-table 7.16.18 → 7.16.19

package/src/nodeviews/TableComponent.tsx

@@ -204,16 +204,15 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 			}
 		}
 
-		if (
-			isTableScalingEnabled &&
-			!getBooleanFF('platform.editor.table.preserve-widths-with-lock-button')
-		) {
+		const { tableWithFixedColumnWidthsOption = false, stickyScrollbar } = getEditorFeatureFlags();
+
+		if (isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
 			this.handleColgroupUpdates(true);
 		}
 
 		if (
 			isTableScalingEnabled &&
-			getBooleanFF('platform.editor.table.preserve-widths-with-lock-button') &&
+			tableWithFixedColumnWidthsOption &&
 			getNode().attrs.displayMode !== 'fixed'
 		) {
 			this.handleColgroupUpdates(true);
@@ -224,8 +223,6 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 				passive: true,
 			});
 
-			const { stickyScrollbar } = getEditorFeatureFlags();
-
 			if (stickyScrollbar) {
 				if (this.table) {
 					this.stickyScrollbar = new TableStickyScrollbar(this.wrapper, this.props.view);
@@ -332,7 +329,7 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 	};
 
 	handleColgroupUpdates(force = false) {
-		const { getNode, containerWidth, isResizing, view, getPos } = this.props;
+		const { getNode, containerWidth, isResizing, view, getPos, getEditorFeatureFlags } = this.props;
 
 		if (!this.table) {
 			return;
@@ -383,12 +380,13 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 				isNumberColumnChanged ||
 				isNumberOfColumnsChanged;
 
-			const isTableScalingEnabledWithLockButton =
-				this.props.options?.isTableScalingEnabled &&
-				getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
+			const { tableWithFixedColumnWidthsOption = false } = getEditorFeatureFlags();
+
+			const isTableScalingWithFixedColumnWidthsOptionEnabled =
+				this.props.options?.isTableScalingEnabled && tableWithFixedColumnWidthsOption;
 
 			const shouldUseIncreasedScalingPercent =
-				(isTableScalingEnabledWithLockButton &&
+				(isTableScalingWithFixedColumnWidthsOptionEnabled &&
 					getBooleanFF('platform.editor.table.use-increased-scaling-percent')) ||
 				false;
 
@@ -405,14 +403,14 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 				});
 
 				let shouldScaleOnColgroupUpdate = false;
-				if (
-					this.props.options?.isTableScalingEnabled &&
-					!getBooleanFF('platform.editor.table.preserve-widths-with-lock-button')
-				) {
+				if (this.props.options?.isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
 					shouldScaleOnColgroupUpdate = true;
 				}
 
-				if (isTableScalingEnabledWithLockButton && tableNode.attrs.displayMode !== 'fixed') {
+				if (
+					isTableScalingWithFixedColumnWidthsOptionEnabled &&
+					tableNode.attrs.displayMode !== 'fixed'
+				) {
 					shouldScaleOnColgroupUpdate = true;
 				}
 
@@ -443,6 +441,7 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 			options,
 			isTableScalingEnabled, // we could use options.isTableScalingEnabled here
 			getPos,
+			getEditorFeatureFlags,
 		} = this.props;
 		let { isInDanger } = this.props;
 
@@ -455,23 +454,23 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 
 		let shouldScale = false;
 		let shouldHandleColgroupUpdates = false;
+		const { tableWithFixedColumnWidthsOption = false } = getEditorFeatureFlags();
 
-		if (
-			isTableScalingEnabled &&
-			!getBooleanFF('platform.editor.table.preserve-widths-with-lock-button')
-		) {
+		if (isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
 			shouldScale = true;
 			shouldHandleColgroupUpdates = true;
 		}
 
-		const isTableScalingEnabledWithLockButton =
-			isTableScalingEnabled &&
-			getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
+		const isTableScalingWithFixedColumnWidthsOptionEnabled =
+			isTableScalingEnabled && tableWithFixedColumnWidthsOption;
 		const shouldUseIncreasedScalingPercent =
-			isTableScalingEnabledWithLockButton &&
+			isTableScalingWithFixedColumnWidthsOptionEnabled &&
 			getBooleanFF('platform.editor.table.use-increased-scaling-percent');
 
-		if (isTableScalingEnabledWithLockButton && getNode().attrs.displayMode !== 'fixed') {
+		if (
+			isTableScalingWithFixedColumnWidthsOptionEnabled &&
+			getNode().attrs.displayMode !== 'fixed'
+		) {
 			shouldScale = true;
 			shouldHandleColgroupUpdates = true;
 		}
@@ -743,11 +742,11 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 			: this.state.stickyHeader &&
 				this.state.stickyHeader.top + this.state.stickyHeader.padding + shadowPadding + 2;
 
-		const { stickyScrollbar } = getEditorFeatureFlags();
+		const { stickyScrollbar, tableWithFixedColumnWidthsOption = false } = getEditorFeatureFlags();
 
 		const shouldUseIncreasedScalingPercent =
 			isTableScalingEnabled &&
-			getBooleanFF('platform.editor.table.preserve-widths-with-lock-button') &&
+			tableWithFixedColumnWidthsOption &&
 			getBooleanFF('platform.editor.table.use-increased-scaling-percent');
 
 		return (
@@ -770,6 +769,7 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 				isTableResizingEnabled={options?.isTableResizingEnabled}
 				isResizing={isResizing}
 				isTableScalingEnabled={isTableScalingEnabled}
+				isTableWithFixedColumnWidthsOptionEnabled={tableWithFixedColumnWidthsOption}
 				isWholeTableInDanger={isWholeTableInDanger}
 				isTableAlignmentEnabled={isTableAlignmentEnabled}
 				shouldUseIncreasedScalingPercent={shouldUseIncreasedScalingPercent}

package/src/nodeviews/TableContainer.tsx

@@ -171,6 +171,7 @@ type ResizableTableContainerProps = {
 	isWholeTableInDanger?: boolean;
 
 	isTableScalingEnabled?: boolean;
+	isTableWithFixedColumnWidthsOptionEnabled?: boolean;
 	isTableAlignmentEnabled?: boolean;
 	shouldUseIncreasedScalingPercent?: boolean;
 };
@@ -190,6 +191,7 @@ export const ResizableTableContainer = React.memo(
 		tableWrapperHeight,
 		isWholeTableInDanger,
 		isTableScalingEnabled,
+		isTableWithFixedColumnWidthsOptionEnabled,
 		isTableAlignmentEnabled,
 		shouldUseIncreasedScalingPercent,
 	}: PropsWithChildren<ResizableTableContainerProps>) => {
@@ -319,6 +321,7 @@ export const ResizableTableContainer = React.memo(
 			isTableAlignmentEnabled,
 			isFullWidthModeEnabled,
 			isTableScalingEnabled,
+			isTableWithFixedColumnWidthsOptionEnabled,
 			isWholeTableInDanger,
 			shouldUseIncreasedScalingPercent,
 			pluginInjectionApi,
@@ -385,6 +388,7 @@ type TableContainerProps = {
 
 	isTableResizingEnabled: boolean | undefined;
 	isTableScalingEnabled?: boolean;
+	isTableWithFixedColumnWidthsOptionEnabled?: boolean;
 	isTableAlignmentEnabled?: boolean;
 	shouldUseIncreasedScalingPercent?: boolean;
 };
@@ -404,6 +408,7 @@ export const TableContainer = ({
 	isWholeTableInDanger,
 	isTableResizingEnabled,
 	isTableScalingEnabled,
+	isTableWithFixedColumnWidthsOptionEnabled,
 	isTableAlignmentEnabled,
 	shouldUseIncreasedScalingPercent,
 }: PropsWithChildren<TableContainerProps>) => {
@@ -422,6 +427,7 @@ export const TableContainer = ({
 				isResizing={isResizing}
 				pluginInjectionApi={pluginInjectionApi}
 				isTableScalingEnabled={isTableScalingEnabled}
+				isTableWithFixedColumnWidthsOptionEnabled={isTableWithFixedColumnWidthsOptionEnabled}
 				isWholeTableInDanger={isWholeTableInDanger}
 				isTableAlignmentEnabled={isTableAlignmentEnabled}
 				shouldUseIncreasedScalingPercent={shouldUseIncreasedScalingPercent}

package/src/nodeviews/TableResizer.tsx

@@ -78,6 +78,7 @@ interface TableResizerProps {
 	displayGapCursor: (toggle: boolean) => boolean;
 	pluginInjectionApi?: PluginInjectionAPI;
 	isTableScalingEnabled?: boolean;
+	isTableWithFixedColumnWidthsOptionEnabled?: boolean;
 	isTableAlignmentEnabled?: boolean;
 	isWholeTableInDanger?: boolean;
 	isFullWidthModeEnabled?: boolean;
@@ -193,6 +194,7 @@ export const TableResizer = ({
 	attachAnalyticsEvent,
 	displayGapCursor,
 	isTableScalingEnabled,
+	isTableWithFixedColumnWidthsOptionEnabled,
 	isTableAlignmentEnabled,
 	isWholeTableInDanger,
 	shouldUseIncreasedScalingPercent,
@@ -413,6 +415,7 @@ export const TableResizer = ({
 				},
 				editorView.domAtPos.bind(editorView),
 				isTableScalingEnabled,
+				isTableWithFixedColumnWidthsOptionEnabled,
 			);
 
 			const editorContainerWidth = isFullWidthModeEnabled
@@ -470,6 +473,7 @@ export const TableResizer = ({
 		[
 			countFrames,
 			isTableScalingEnabled,
+			isTableWithFixedColumnWidthsOptionEnabled,
 			isFullWidthModeEnabled,
 			excludeGuidelineConfig,
 			tableRef,

package/src/nodeviews/table.tsx

@@ -92,6 +92,7 @@ export default class TableView extends ReactNodeView<Props> {
 	eventDispatcher?: EventDispatcher;
 	getPos: getPosHandlerNode;
 	options;
+	getEditorFeatureFlags;
 
 	constructor(props: Props) {
 		super(
@@ -109,6 +110,7 @@ export default class TableView extends ReactNodeView<Props> {
 		this.getPos = props.getPos;
 		this.eventDispatcher = props.eventDispatcher;
 		this.options = props.options;
+		this.getEditorFeatureFlags = props.getEditorFeatureFlags;
 	}
 
 	getContentDOM() {
@@ -126,7 +128,7 @@ export default class TableView extends ReactNodeView<Props> {
 			if (
 				!this.options?.isTableScalingEnabled ||
 				(this.options?.isTableScalingEnabled &&
-					getBooleanFF('platform.editor.table.preserve-widths-with-lock-button') &&
+					this.getEditorFeatureFlags?.().tableWithFixedColumnWidthsOption &&
 					this.node.attrs.displayMode === 'fixed')
 			) {
 				const tableInlineWidth = getInlineWidth(
@@ -157,7 +159,7 @@ export default class TableView extends ReactNodeView<Props> {
 		if (
 			!this.options?.isTableScalingEnabled ||
 			(this.options?.isTableScalingEnabled &&
-				getBooleanFF('platform.editor.table.preserve-widths-with-lock-button') &&
+				this.getEditorFeatureFlags?.().tableWithFixedColumnWidthsOption &&
 				node.attrs.displayMode === 'fixed')
 		) {
 			// handle inline style when table been resized

package/src/plugin.tsx

@@ -153,13 +153,15 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
 	};
 	const editorAnalyticsAPI = api?.analytics?.actions;
 
-	const isTableScalingWithFixedColumnWidthsOptionEnabled =
-		options?.isTableScalingEnabled &&
-		getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
-	const shouldUseIncreasedScalingPercent =
-		isTableScalingWithFixedColumnWidthsOptionEnabled &&
+	const isTableFixedColumnWidthsOptionEnabled =
+		options?.getEditorFeatureFlags?.().tableWithFixedColumnWidthsOption || false;
+	const shouldUseIncreasedScalingPercent = options?.isTableScalingEnabled;
+	isTableFixedColumnWidthsOptionEnabled &&
 		getBooleanFF('platform.editor.table.use-increased-scaling-percent');
 
+	const isCellBackgroundDuplicated =
+		options?.getEditorFeatureFlags?.().tableDuplicateCellColouring || false;
+
 	return {
 		name: 'table',
 
@@ -331,6 +333,8 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
 							fullWidthEnabled,
 							api,
 							getIntl,
+							isCellBackgroundDuplicated,
+							isTableFixedColumnWidthsOptionEnabled,
 							shouldUseIncreasedScalingPercent,
 						);
 					},
@@ -371,7 +375,12 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
 					name: 'tableDragAndDrop',
 					plugin: ({ dispatch }) => {
 						return options?.dragAndDropEnabled
-							? createDragAndDropPlugin(dispatch, editorAnalyticsAPI)
+							? createDragAndDropPlugin(
+									dispatch,
+									editorAnalyticsAPI,
+									options?.isTableScalingEnabled,
+									isTableFixedColumnWidthsOptionEnabled,
+								)
 							: undefined;
 					},
 				},
@@ -533,6 +542,7 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
 											isHeaderColumnEnabled={isHeaderColumnEnabled}
 											isHeaderRowEnabled={isHeaderRowEnabled}
 											isDragAndDropEnabled={isDragAndDropEnabled}
+											isTableScalingEnabled={options?.isTableScalingEnabled}
 											editorView={editorView}
 											mountPoint={popupsMountPoint}
 											boundariesElement={popupsBoundariesElement}
@@ -662,7 +672,7 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
 				options?.getEditorFeatureFlags || defaultGetEditorFeatureFlags,
 				() => editorViewRef.current,
 				options,
-				isTableScalingWithFixedColumnWidthsOptionEnabled,
+				isTableFixedColumnWidthsOptionEnabled,
 				shouldUseIncreasedScalingPercent,
 			)(pluginConfig(options?.tableOptions)),
 		},

package/src/pm-plugins/drag-and-drop/plugin.ts

@@ -29,7 +29,12 @@ import { createPluginState, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
 import { getDraggableDataFromEvent } from './utils/monitor';
 
-const destroyFn = (editorView: EditorView, editorAnalyticsAPI: any) => {
+const destroyFn = (
+	editorView: EditorView,
+	editorAnalyticsAPI: any,
+	isTableScalingEnabled: boolean,
+	isTableFixedColumnWidthsOptionEnabled: boolean,
+) => {
 	const editorPageScrollContainer = document.querySelector('.fabric-editor-popup-scroll-parent');
 
 	const rowAutoScrollers = editorPageScrollContainer
@@ -211,24 +216,22 @@ const destroyFn = (editorView: EditorView, editorAnalyticsAPI: any) => {
 					if (sourceType === 'table-column') {
 						const { tableRef, tableNode } = getTablePluginState(editorView.state);
 						if (tableRef && tableNode) {
-							const { isTableScalingEnabled = false } = getTablePluginState(editorView.state);
-
 							let isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
-							const isTableScalingEnabledWithLockButton =
-								isTableScalingEnabled &&
-								getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
-							const shouldUseIncreasedScalingPercent =
-								isTableScalingEnabledWithLockButton &&
-								getBooleanFF('platform.editor.table.use-increased-scaling-percent');
-
-							if (isTableScalingEnabledWithLockButton) {
+							const isTableScalingWithFixedColumnWidthsOptionEnabled =
+								isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled;
+							if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
 								isTableScalingEnabledOnCurrentTable = tableNode.attrs.displayMode !== 'fixed';
 							}
 
+							const shouldUseIncreasedScalingPercent =
+								isTableScalingWithFixedColumnWidthsOptionEnabled &&
+								getBooleanFF('platform.editor.table.use-increased-scaling-percent');
+
 							insertColgroupFromNode(
 								tableRef,
 								tableNode,
 								isTableScalingEnabledOnCurrentTable,
+								undefined,
 								shouldUseIncreasedScalingPercent,
 							);
 						}
@@ -241,7 +244,12 @@ const destroyFn = (editorView: EditorView, editorAnalyticsAPI: any) => {
 	);
 };
 
-export const createPlugin = (dispatch: Dispatch, editorAnalyticsAPI?: EditorAnalyticsAPI) => {
+export const createPlugin = (
+	dispatch: Dispatch,
+	editorAnalyticsAPI?: EditorAnalyticsAPI,
+	isTableScalingEnabled = false,
+	isTableFixedColumnWidthsOptionEnabled = false,
+) => {
 	return new SafePlugin({
 		state: createPluginState(dispatch, (state) => ({
 			decorationSet: DecorationSet.empty,
@@ -310,7 +318,12 @@ export const createPlugin = (dispatch: Dispatch, editorAnalyticsAPI?: EditorAnal
 		},
 		view: (editorView: EditorView) => {
 			return {
-				destroy: destroyFn(editorView, editorAnalyticsAPI),
+				destroy: destroyFn(
+					editorView,
+					editorAnalyticsAPI,
+					isTableScalingEnabled,
+					isTableFixedColumnWidthsOptionEnabled,
+				),
 			};
 		},
 		props: {

package/src/pm-plugins/keymap.ts

@@ -65,6 +65,8 @@ export function keymapPlugin(
 	isFullWidthEnabled?: boolean,
 	pluginInjectionApi?: PluginInjectionAPIWithA11y,
 	getIntl?: () => IntlShape,
+	isCellBackgroundDuplicated = false,
+	isTableFixedColumnWidthsOptionEnabled = false,
 	shouldUseIncreasedScalingPercent?: boolean,
 ): SafePlugin {
 	const list = {};
@@ -116,13 +118,23 @@ export function keymapPlugin(
 
 	bindKeymapWithCommand(
 		addColumnBefore.common!,
-		addColumnBeforeCommand(isTableScalingEnabled, shouldUseIncreasedScalingPercent),
+		addColumnBeforeCommand(
+			isTableScalingEnabled,
+			isCellBackgroundDuplicated,
+			isTableFixedColumnWidthsOptionEnabled,
+			shouldUseIncreasedScalingPercent,
+		),
 		list,
 	);
 
 	bindKeymapWithCommand(
 		addColumnAfter.common!,
-		addColumnAfterCommand(isTableScalingEnabled, shouldUseIncreasedScalingPercent),
+		addColumnAfterCommand(
+			isTableScalingEnabled,
+			isCellBackgroundDuplicated,
+			isTableFixedColumnWidthsOptionEnabled,
+			shouldUseIncreasedScalingPercent,
+		),
 		list,
 	);
 
@@ -141,13 +153,23 @@ export function keymapPlugin(
 
 		bindKeymapWithCommand(
 			addColumnBeforeVO.common!,
-			addColumnBeforeCommand(isTableScalingEnabled),
+			addColumnBeforeCommand(
+				isTableScalingEnabled,
+				isCellBackgroundDuplicated,
+				isTableFixedColumnWidthsOptionEnabled,
+				shouldUseIncreasedScalingPercent,
+			),
 			list,
 		);
 
 		bindKeymapWithCommand(
 			addColumnAfterVO.common!,
-			addColumnAfterCommand(isTableScalingEnabled),
+			addColumnAfterCommand(
+				isTableScalingEnabled,
+				isCellBackgroundDuplicated,
+				isTableFixedColumnWidthsOptionEnabled,
+				shouldUseIncreasedScalingPercent,
+			),
 			list,
 		);
 	}
@@ -191,6 +213,7 @@ export function keymapPlugin(
 			deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut(
 				editorAnalyticsAPI,
 				isTableScalingEnabled,
+				isTableFixedColumnWidthsOptionEnabled,
 				shouldUseIncreasedScalingPercent,
 			),
 			list,
@@ -201,6 +224,7 @@ export function keymapPlugin(
 			deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut(
 				editorAnalyticsAPI,
 				isTableScalingEnabled,
+				isTableFixedColumnWidthsOptionEnabled,
 				shouldUseIncreasedScalingPercent,
 			),
 			list,
@@ -243,6 +267,7 @@ export function keymapPlugin(
 				-10,
 				getEditorContainerWidth,
 				isTableScalingEnabled,
+				isTableFixedColumnWidthsOptionEnabled,
 				INPUT_METHOD.SHORTCUT,
 				ariaNotifyPlugin,
 				getIntl,
@@ -256,6 +281,7 @@ export function keymapPlugin(
 				10,
 				getEditorContainerWidth,
 				isTableScalingEnabled,
+				isTableFixedColumnWidthsOptionEnabled,
 				INPUT_METHOD.SHORTCUT,
 				ariaNotifyPlugin,
 				getIntl,

package/src/pm-plugins/main.ts

@@ -158,6 +158,7 @@ export const createPlugin = (
 			}
 
 			if (tr) {
+				const { tableWithFixedColumnWidthsOption = false } = getEditorFeatureFlags();
 				// "fixTables" removes empty rows as we don't allow that in schema
 				const updatedTr = handleCut(
 					tr,
@@ -166,6 +167,7 @@ export const createPlugin = (
 					editorAnalyticsAPI,
 					editorViewRef || undefined,
 					isTableScalingEnabled,
+					tableWithFixedColumnWidthsOption,
 					shouldUseIncreasedScalingPercent,
 				);
 				return fixTables(updatedTr) || updatedTr;

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

@@ -84,10 +84,12 @@ export const handleMouseDown = (
 	});
 
 	let shouldScale = tableDepth === 0 && isTableScalingEnabled;
+	const { tableWithFixedColumnWidthsOption = false } = getEditorFeatureFlags();
 
-	const isTableScalingEnabledWithLockButton =
-		isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
-	if (isTableScalingEnabledWithLockButton) {
+	const isTableScalingWithFixedColumnWidthsOptionEnabled =
+		isTableScalingEnabled && tableWithFixedColumnWidthsOption;
+
+	if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
 		shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
 	}
 
@@ -100,7 +102,7 @@ export const handleMouseDown = (
 		domAtPos,
 		isTableScalingEnabled: shouldScale,
 		shouldUseIncreasedScalingPercent:
-			isTableScalingEnabledWithLockButton &&
+			isTableScalingWithFixedColumnWidthsOptionEnabled &&
 			getBooleanFF('platform.editor.table.use-increased-scaling-percent'),
 	});
 
@@ -183,10 +185,8 @@ export const handleMouseDown = (
 					selectedColumns.indexOf(colIndex) > -1 || selectedColumns.indexOf(colIndex + 1) > -1;
 
 				let shouldScale = tableDepth === 0 && isTableScalingEnabled;
-				const isTableScalingEnabledWithLockButton =
-					isTableScalingEnabled &&
-					getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
-				if (isTableScalingEnabledWithLockButton) {
+
+				if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
 					shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
 				}
 
@@ -213,7 +213,7 @@ export const handleMouseDown = (
 						originalTable,
 						resizingSelectedColumns ? selectedColumns : undefined,
 						shouldScale,
-						isTableScalingEnabledWithLockButton &&
+						isTableScalingWithFixedColumnWidthsOptionEnabled &&
 							getBooleanFF('platform.editor.table.use-increased-scaling-percent'),
 					);
 					tr = updateColumnWidths(newResizeState, table, start)(tr);
@@ -289,13 +289,11 @@ export const handleMouseDown = (
 		const colIndex = map.colCount($cell.pos - $cell.start(-1)) + $cell.nodeAfter!.attrs.colspan - 1;
 
 		let shouldScale = tableDepth === 0 && isTableScalingEnabled;
-		const isTableScalingEnabledWithLockButton =
-			isTableScalingEnabled &&
-			getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
+
 		const shouldUseIncreasedScalingPercent =
-			isTableScalingEnabledWithLockButton &&
+			isTableScalingWithFixedColumnWidthsOptionEnabled &&
 			getBooleanFF('platform.editor.table.use-increased-scaling-percent');
-		if (isTableScalingEnabledWithLockButton) {
+		if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
 			shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
 		}
 

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

@@ -325,6 +325,7 @@ export const getNewResizeStateFromSelectedColumns = (
 	domAtPos: (pos: number) => { node: Node; offset: number },
 	getEditorContainerWidth: GetEditorContainerWidth,
 	isTableScalingEnabled = false,
+	isTableFixedColumnWidthsOptionEnabled = false,
 ): ResizeStateWithAnalytics | undefined => {
 	// Fail early so that we don't do complex calculations for no reason
 	const numColumnsSelected = rect.right - rect.left;
@@ -367,10 +368,9 @@ export const getNewResizeStateFromSelectedColumns = (
 	let resizeState;
 
 	let isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
-
-	const isTableScalingEnabledWithLockButton =
-		isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
-	if (isTableScalingEnabledWithLockButton) {
+	const isTableScalingWithFixedColumnWidthsOptionEnabled =
+		isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled;
+	if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
 		isTableScalingEnabledOnCurrentTable = table.node.attrs.displayMode !== 'fixed';
 	}
 
@@ -383,7 +383,7 @@ export const getNewResizeStateFromSelectedColumns = (
 		domAtPos,
 		isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
 		shouldUseIncreasedScalingPercent:
-			isTableScalingEnabledWithLockButton &&
+			isTableScalingWithFixedColumnWidthsOptionEnabled &&
 			getBooleanFF('platform.editor.table.use-increased-scaling-percent'),
 	});
 

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

@@ -153,6 +153,7 @@ export const previewScaleTable = (
 	options: ScaleOptions,
 	domAtPos: DomAtPos,
 	isTableScalingEnabled: boolean = false,
+	isTableWithFixedColumnWidthsOptionEnabled: boolean = false,
 ) => {
 	const { node, start, parentWidth } = options;
 
@@ -169,9 +170,10 @@ export const previewScaleTable = (
 	}
 
 	let isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
-	const isTableScalingEnabledWithLockButton =
-		isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
-	if (isTableScalingEnabledWithLockButton) {
+	const isTableScalingWithFixedColumnWidthsOptionEnabled =
+		isTableScalingEnabled && isTableWithFixedColumnWidthsOptionEnabled;
+
+	if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
 		isTableScalingEnabledOnCurrentTable =
 			isTableScalingEnabled && node.attrs.displayMode !== 'fixed';
 	}
@@ -183,7 +185,7 @@ export const previewScaleTable = (
 	}
 
 	const shouldUseIncreasedScalingPercent =
-		isTableScalingEnabledWithLockButton &&
+		isTableScalingWithFixedColumnWidthsOptionEnabled &&
 		getBooleanFF('platform.editor.table.use-increased-scaling-percent');
 
 	const resizeState = parentWidth