@atlaskit/editor-plugin-table 7.16.18 → 7.17.0

package/dist/types-ts4.5/ui/TableFloatingColumnControls/ColumnControls/index.d.ts

@@ -155,7 +155,11 @@ export declare const ColumnControls: ({ editorView, tableActive, tableRef, hover
                     };
                 }, {
                     mode?: import("@atlaskit/editor-plugin-editor-viewmode").ViewMode | undefined;
-                } | undefined>>
+                } | undefined>>,
+                import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                    pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+                    sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+                }, import("@atlaskit/editor-common/types").FeatureFlags>>
             ];
         }, import("../../../plugin").TablePluginOptions | undefined>,
         import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
@@ -281,7 +285,11 @@ export declare const ColumnControls: ({ editorView, tableActive, tableRef, hover
             };
         }, {
             mode?: import("@atlaskit/editor-plugin-editor-viewmode").ViewMode | undefined;
-        } | undefined>>
+        } | undefined>>,
+        import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+            pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+            sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+        }, import("@atlaskit/editor-common/types").FeatureFlags>>
     ]> | undefined;
 }) => JSX.Element;
 export default ColumnControls;

package/dist/types-ts4.5/ui/TableFloatingControls/CornerControls/DragCornerControls.d.ts

@@ -136,7 +136,11 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                     };
                 }, {
                     mode?: import("@atlaskit/editor-plugin-editor-viewmode").ViewMode | undefined;
-                } | undefined>>
+                } | undefined>>,
+                import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                    pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+                    sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+                }, import("@atlaskit/editor-common/types").FeatureFlags>>
             ];
         }, import("../../../plugin").TablePluginOptions | undefined>,
         import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
@@ -262,7 +266,11 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
             };
         }, {
             mode?: import("@atlaskit/editor-plugin-editor-viewmode").ViewMode | undefined;
-        } | undefined>>
+        } | undefined>>,
+        import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+            pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+            sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+        }, import("@atlaskit/editor-common/types").FeatureFlags>>
     ]> | undefined;
 }>> & {
     WrappedComponent: React.ComponentType<CornerControlProps & WrappedComponentProps & {
@@ -400,7 +408,11 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                         };
                     }, {
                         mode?: import("@atlaskit/editor-plugin-editor-viewmode").ViewMode | undefined;
-                    } | undefined>>
+                    } | undefined>>,
+                    import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                        pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+                        sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+                    }, import("@atlaskit/editor-common/types").FeatureFlags>>
                 ];
             }, import("../../../plugin").TablePluginOptions | undefined>,
             import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
@@ -526,7 +538,11 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                 };
             }, {
                 mode?: import("@atlaskit/editor-plugin-editor-viewmode").ViewMode | undefined;
-            } | undefined>>
+            } | undefined>>,
+            import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+                sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+            }, import("@atlaskit/editor-common/types").FeatureFlags>>
         ]> | undefined;
     }>;
 };

package/dist/types-ts4.5/ui/TableFloatingControls/index.d.ts

@@ -164,7 +164,11 @@ export declare const TableFloatingControls: ({ editorView, tableRef, tableNode,
                     };
                 }, {
                     mode?: import("@atlaskit/editor-plugin-editor-viewmode").ViewMode | undefined;
-                } | undefined>>
+                } | undefined>>,
+                import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                    pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+                    sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+                }, import("@atlaskit/editor-common/types").FeatureFlags>>
             ];
         }, import("../../plugin").TablePluginOptions | undefined>,
         import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
@@ -290,7 +294,11 @@ export declare const TableFloatingControls: ({ editorView, tableRef, tableNode,
             };
         }, {
             mode?: import("@atlaskit/editor-plugin-editor-viewmode").ViewMode | undefined;
-        } | undefined>>
+        } | undefined>>,
+        import("@atlaskit/editor-common/types").OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+            pluginConfiguration: import("@atlaskit/editor-common/types").FeatureFlags;
+            sharedState: import("@atlaskit/editor-common/types").FeatureFlags;
+        }, import("@atlaskit/editor-common/types").FeatureFlags>>
     ]> | undefined;
 }) => JSX.Element | null;
 export default TableFloatingControls;

package/dist/types-ts4.5/utils/drag-menu.d.ts

@@ -13,4 +13,4 @@ export interface DragMenuConfig extends DropdownOptionT<Command> {
     icon?: React.ComponentType<React.PropsWithChildren<IconProps>>;
     keymap?: string;
 }
-export declare const getDragMenuConfig: (direction: TableDirection, getEditorContainerWidth: GetEditorContainerWidth, canDrag: boolean, hasMergedCellsInTable: boolean, editorView: EditorView, tableMap?: TableMap, index?: number, targetCellPosition?: number, selectionRect?: Rect, editorAnalyticsAPI?: EditorAnalyticsAPI, isHeaderRowRequired?: boolean, isTableScalingEnabled?: boolean, tableDuplicateCellColouring?: boolean, shouldUseIncreasedScalingPercent?: boolean) => DragMenuConfig[];
+export declare const getDragMenuConfig: (direction: TableDirection, getEditorContainerWidth: GetEditorContainerWidth, canDrag: boolean, hasMergedCellsInTable: boolean, editorView: EditorView, tableMap?: TableMap, index?: number, targetCellPosition?: number, selectionRect?: Rect, editorAnalyticsAPI?: EditorAnalyticsAPI, isHeaderRowRequired?: boolean, isTableScalingEnabled?: boolean, tableDuplicateCellColouring?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean) => DragMenuConfig[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "7.16.18",
+  "version": "7.17.0",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -31,7 +31,7 @@
     "@atlaskit/adf-schema": "^36.10.7",
     "@atlaskit/button": "^17.17.0",
     "@atlaskit/custom-steps": "^0.2.0",
-    "@atlaskit/editor-common": "^82.1.0",
+    "@atlaskit/editor-common": "^82.3.0",
     "@atlaskit/editor-palette": "1.6.0",
     "@atlaskit/editor-plugin-accessibility-utils": "^1.1.0",
     "@atlaskit/editor-plugin-analytics": "^1.2.0",
@@ -52,7 +52,7 @@
     "@atlaskit/primitives": "^7.0.0",
     "@atlaskit/theme": "^12.9.0",
     "@atlaskit/toggle": "^13.1.0",
-    "@atlaskit/tokens": "^1.49.0",
+    "@atlaskit/tokens": "^1.50.0",
     "@atlaskit/tooltip": "^18.4.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
@@ -123,9 +123,6 @@
     "platform.editor.table.cmd-a-select-table": {
       "type": "boolean"
     },
-    "platform.editor.table.preserve-widths-with-lock-button": {
-      "type": "boolean"
-    },
     "platform.editor.table.use-shared-state-hook": {
       "type": "boolean"
     },
@@ -146,9 +143,6 @@
     },
     "platform.editor.table.editor-num-col-style-changes": {
       "type": "boolean"
-    },
-    "platform.editor.drag-and-drop_wmv9t": {
-      "type": "boolean"
     }
   }
 }

package/src/commands/column-resize.ts

@@ -257,12 +257,14 @@ export const changeColumnWidthByStep =
 		stepSize,
 		getEditorContainerWidth,
 		isTableScalingEnabled,
+		isTableFixedColumnWidthsOptionEnabled,
 		ariaNotify,
 		getIntl,
 	}: {
 		stepSize: number;
 		getEditorContainerWidth: GetEditorContainerWidth;
 		isTableScalingEnabled: boolean;
+		isTableFixedColumnWidthsOptionEnabled: boolean;
 		ariaNotify?: (message: string, ariaLiveElementAttributes?: AriaLiveElementAttributes) => void;
 		getIntl?: () => IntlShape;
 		originalTr?: Transaction;
@@ -326,15 +328,13 @@ export const changeColumnWidthByStep =
 		});
 
 		let isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
-		const isTableScalingEnabledWithLockButton =
-			isTableScalingEnabled &&
-			getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
-		if (isTableScalingEnabledWithLockButton) {
+		const isTableScalingWithFixedColumnWidthsOptionEnabled =
+			isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled;
+		if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
 			isTableScalingEnabledOnCurrentTable = originalTable.attrs.displayMode !== 'fixed';
 		}
-
 		const shouldUseIncreasedScalingPercent =
-			isTableScalingEnabledWithLockButton &&
+			isTableScalingWithFixedColumnWidthsOptionEnabled &&
 			getBooleanFF('platform.editor.table.use-increased-scaling-percent');
 
 		const initialResizeState = getResizeState({

package/src/commands/delete.ts

@@ -5,13 +5,19 @@ import { deleteColumns } from '../transforms/delete-columns';
 import { getAllowAddColumnCustomStep } from '../utils/get-allow-add-column-custom-step';
 
 export const deleteColumnsCommand =
-	(rect: Rect, isTableScalingEnabled = false, shouldUseIncreasedScalingPercent = false): Command =>
+	(
+		rect: Rect,
+		isTableScalingEnabled = false,
+		isTableFixedColumnWidthsOptionEnabled = false,
+		shouldUseIncreasedScalingPercent = false,
+	): Command =>
 	(state, dispatch, view) => {
 		const tr = deleteColumns(
 			rect,
 			getAllowAddColumnCustomStep(state),
 			view,
 			isTableScalingEnabled,
+			isTableFixedColumnWidthsOptionEnabled,
 			shouldUseIncreasedScalingPercent,
 		)(state.tr);
 		if (dispatch) {

package/src/commands/insert.ts

@@ -41,6 +41,7 @@ function addColumnAtCustomStep(column: number) {
 export function addColumnAt(
 	isTableScalingEnabled = false,
 	isCellBackgroundDuplicated?: boolean,
+	isTableFixedColumnWidthsOptionEnabled?: boolean,
 	shouldUseIncreasedScalingPercent?: boolean,
 ) {
 	return (
@@ -58,7 +59,11 @@ export function addColumnAt(
 			const table = findTable(updatedTr.selection);
 			if (table) {
 				// [ED-8288] Update colwidths manually to avoid multiple dispatch in TableComponent
-				updatedTr = rescaleColumns(isTableScalingEnabled, shouldUseIncreasedScalingPercent)(
+				updatedTr = rescaleColumns(
+					isTableScalingEnabled,
+					isTableFixedColumnWidthsOptionEnabled,
+					shouldUseIncreasedScalingPercent,
+				)(
 					table,
 					view,
 				)(updatedTr);
@@ -83,7 +88,12 @@ export function addColumnAt(
 // :: (EditorState, dispatch: ?(tr: Transaction)) → bool
 // Command to add a column before the column with the selection.
 export const addColumnBefore =
-	(isTableScalingEnabled = false, shouldUseIncreasedScalingPercent = false): Command =>
+	(
+		isTableScalingEnabled = false,
+		isCellBackgroundDuplicated = false,
+		isTableFixedColumnWidthsOptionEnabled = false,
+		shouldUseIncreasedScalingPercent = false,
+	): Command =>
 	(state, dispatch, view) => {
 		const table = findTable(state.selection);
 		if (!table) {
@@ -92,7 +102,12 @@ export const addColumnBefore =
 		if (dispatch) {
 			let rect = selectedRect(state);
 			dispatch(
-				addColumnAt(isTableScalingEnabled, shouldUseIncreasedScalingPercent)(
+				addColumnAt(
+					isTableScalingEnabled,
+					isCellBackgroundDuplicated,
+					isTableFixedColumnWidthsOptionEnabled,
+					shouldUseIncreasedScalingPercent,
+				)(
 					rect.left,
 					getAllowAddColumnCustomStep(state),
 					view,
@@ -105,16 +120,27 @@ export const addColumnBefore =
 // :: (EditorState, dispatch: ?(tr: Transaction)) → bool
 // Command to add a column after the column with the selection.
 export const addColumnAfter =
-	(isTableScalingEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean): Command =>
+	(
+		isTableScalingEnabled?: boolean,
+		isCellBackgroundDuplicated?: boolean,
+		isTableFixedColumnWidthsOptionEnabled?: boolean,
+		shouldUseIncreasedScalingPercent?: boolean,
+	): Command =>
 	(state, dispatch, view) => {
 		const table = findTable(state.selection);
 		if (!table) {
 			return false;
 		}
+
 		if (dispatch) {
 			let rect = selectedRect(state);
 			dispatch(
-				addColumnAt(isTableScalingEnabled, shouldUseIncreasedScalingPercent)(
+				addColumnAt(
+					isTableScalingEnabled,
+					isCellBackgroundDuplicated,
+					isTableFixedColumnWidthsOptionEnabled,
+					shouldUseIncreasedScalingPercent,
+				)(
 					rect.right,
 					getAllowAddColumnCustomStep(state),
 					view,
@@ -128,6 +154,7 @@ export const insertColumn =
 	(
 		isTableScalingEnabled = false,
 		isCellBackgroundDuplicated?: boolean,
+		isTableFixedColumnWidthsOptionEnabled?: boolean,
 		shouldUseIncreasedScalingPercent?: boolean,
 	) =>
 	(column: number): Command =>
@@ -135,6 +162,7 @@ export const insertColumn =
 		let tr = addColumnAt(
 			isTableScalingEnabled,
 			isCellBackgroundDuplicated,
+			isTableFixedColumnWidthsOptionEnabled,
 			shouldUseIncreasedScalingPercent,
 		)(
 			column,

package/src/commands-with-analytics.ts

@@ -240,6 +240,7 @@ export const changeColumnWidthByStepWithAnalytics =
 		stepSize: number,
 		getEditorContainerWidth: GetEditorContainerWidth,
 		isTableScalingEnabled: boolean,
+		isTableFixedColumnWidthsOptionEnabled: boolean,
 		inputMethod: INPUT_METHOD.SHORTCUT,
 		ariaNotify?: (message: string) => void,
 		getIntl?: () => IntlShape,
@@ -268,7 +269,8 @@ export const changeColumnWidthByStepWithAnalytics =
 			changeColumnWidthByStep({
 				stepSize: stepSize,
 				getEditorContainerWidth: getEditorContainerWidth,
-				isTableScalingEnabled: isTableScalingEnabled,
+				isTableScalingEnabled,
+				isTableFixedColumnWidthsOptionEnabled,
 				ariaNotify: ariaNotify,
 				getIntl: getIntl,
 			}),
@@ -279,6 +281,7 @@ export const insertColumnWithAnalytics =
 		editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
 		isTableScalingEnabled = false,
 		isCellbackgroundDuplicated = false,
+		isTableFixedColumnWidthsOptionEnabled = false,
 		shouldUseIncreasedScalingPercent = false,
 	) =>
 	(
@@ -308,6 +311,7 @@ export const insertColumnWithAnalytics =
 			insertColumn(
 				isTableScalingEnabled,
 				isCellbackgroundDuplicated,
+				isTableFixedColumnWidthsOptionEnabled,
 				shouldUseIncreasedScalingPercent,
 			)(position),
 		);
@@ -351,6 +355,7 @@ export const deleteColumnsWithAnalytics =
 	(
 		editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
 		isTableScalingEnabled = false,
+		isTableFixedColumnWidthsOptionEnabled = false,
 		shouldUseIncreasedScalingPercent = false,
 	) =>
 	(
@@ -379,13 +384,19 @@ export const deleteColumnsWithAnalytics =
 				eventType: EVENT_TYPE.TRACK,
 			};
 		})(editorAnalyticsAPI)(
-			deleteColumnsCommand(rect, isTableScalingEnabled, shouldUseIncreasedScalingPercent),
+			deleteColumnsCommand(
+				rect,
+				isTableScalingEnabled,
+				isTableFixedColumnWidthsOptionEnabled,
+				shouldUseIncreasedScalingPercent,
+			),
 		);
 
 export const deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut =
 	(
 		editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
 		isTableScalingEnabled?: boolean,
+		isTableFixedColumnWidthsOptionEnabled?: boolean,
 		shouldUseIncreasedScalingPercent?: boolean,
 	): Command =>
 	(state, dispatch) => {
@@ -414,6 +425,7 @@ export const deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut =
 			return deleteColumnsWithAnalytics(
 				editorAnalyticsAPI,
 				isTableScalingEnabled,
+				isTableFixedColumnWidthsOptionEnabled,
 				shouldUseIncreasedScalingPercent,
 			)(INPUT_METHOD.SHORTCUT, rect)(state, dispatch);
 		} else {

package/src/event-handlers.ts

@@ -477,6 +477,7 @@ export const handleCut = (
 	editorAnalyticsAPI?: EditorAnalyticsAPI,
 	editorView?: EditorView,
 	isTableScalingEnabled = false,
+	isTableFixedColumnWidthsOptionEnabled = false,
 	shouldUseIncreasedScalingPercent = false,
 ): Transaction => {
 	const oldSelection = oldState.tr.selection;
@@ -525,6 +526,7 @@ export const handleCut = (
 							getAllowAddColumnCustomStep(oldState),
 							editorView,
 							isTableScalingEnabled,
+							isTableFixedColumnWidthsOptionEnabled,
 							shouldUseIncreasedScalingPercent,
 						)(tr);
 					}

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