@atlaskit/editor-plugin-table 15.2.0 → 15.2.2

package/dist/esm/nodeviews/TableComponentNext.js

@@ -300,7 +300,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         isNumberOfColumnsChanged = params.isNumberOfColumnsChanged,
         isFullWidthModeAndLineLengthChanged = params.isFullWidthModeAndLineLengthChanged;
       var isFullPageEditor = !((_this$props$options = _this.props.options) !== null && _this$props$options !== void 0 && _this$props$options.isCommentEditor) && !((_this$props$options2 = _this.props.options) !== null && _this$props$options2 !== void 0 && _this$props$options2.isChromelessEditor);
-      if (expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) && isFullPageEditor) {
+      if (isFullPageEditor) {
         return !!isWindowResized || isColumnsDistributed || !!isTableResizedFullWidth || isTableDisplayModeChanged || isNumberColumnChanged || isNumberOfColumnsChanged || !!isFullWidthModeAndLineLengthChanged;
       }
       return isWidthChanged || isTableWidthChanged || isColumnsDistributed || !!isTableResizedFullWidth || isTableDisplayModeChanged || isNumberColumnChanged || isNumberOfColumnsChanged || !!isFullWidthModeAndLineLengthChanged;
@@ -382,10 +382,9 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
             }
           }
         });
-        if (expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
-          // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
-          window.addEventListener('resize', this.handleWindowResizeNewDebounced);
-        }
+
+        // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
+        window.addEventListener('resize', this.handleWindowResizeNewDebounced);
       }
     }
   }, {
@@ -400,9 +399,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         allowTableResizing = _this$props6.allowTableResizing,
         eventDispatcher = _this$props6.eventDispatcher,
         isDragAndDropEnabled = _this$props6.isDragAndDropEnabled,
-        getNode = _this$props6.getNode,
-        getEditorFeatureFlags = _this$props6.getEditorFeatureFlags,
-        isTableScalingEnabled = _this$props6.isTableScalingEnabled;
+        getNode = _this$props6.getNode;
 
       // Ignored via go/ees005
       // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
@@ -415,17 +412,6 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       // Ignored via go/ees005
       // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
       this === null || this === void 0 || (_this$table3 = this.table) === null || _this$table3 === void 0 || _this$table3.addEventListener('mouseover', this.handleMouseOver);
-      var _getEditorFeatureFlag = getEditorFeatureFlags(),
-        _getEditorFeatureFlag2 = _getEditorFeatureFlag.tableWithFixedColumnWidthsOption,
-        tableWithFixedColumnWidthsOption = _getEditorFeatureFlag2 === void 0 ? false : _getEditorFeatureFlag2;
-      if (!expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
-        if (isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
-          this.handleColgroupUpdates(true);
-        }
-        if (isTableScalingEnabled && tableWithFixedColumnWidthsOption && getNode().attrs.displayMode !== 'fixed') {
-          this.handleColgroupUpdates(true);
-        }
-      }
       if (this.wrapper) {
         this.wrapperReisizeObserver = new ResizeObserver(function (entries) {
           var _iterator2 = _createForOfIteratorHelper(entries),
@@ -526,10 +512,9 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
         window.removeEventListener('resize', this.handleWindowResizeDebounced);
       }
-      if (expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
-        // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
-        window.removeEventListener('resize', this.handleWindowResizeNewDebounced);
-      }
+
+      // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
+      window.removeEventListener('resize', this.handleWindowResizeNewDebounced);
 
       // Ignored via go/ees005
       // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
@@ -616,7 +601,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         containerLineLength = containerWidth.lineLength;
       var isLineLengthChanged = ((_this$containerWidth = this.containerWidth) === null || _this$containerWidth === void 0 ? void 0 : _this$containerWidth.lineLength) !== containerLineLength;
       var isFullWidthModeAndLineLengthChanged = this.updateColGroupFromFullWidthChange && isLineLengthChanged && fg('platform_editor_table_overflow_in_full_width_fix');
-      var maybeScale = isTableSquashed || isTableWidthChanged || isTableResizedFullWidth && !(options !== null && options !== void 0 && options.isCommentEditor) || isNumberColumnChanged || isNumberOfColumnsChanged || expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) && this.state.windowResized;
+      var maybeScale = isTableSquashed || isTableWidthChanged || isTableResizedFullWidth && !(options !== null && options !== void 0 && options.isCommentEditor) || isNumberColumnChanged || isNumberOfColumnsChanged || this.state.windowResized;
       if (force || maybeScale || isFullWidthModeAndLineLengthChanged) {
         var _this$containerWidth2, _this$props$options3, _this$props$options4, _this$props$options5;
         var isWidthChanged = ((_this$containerWidth2 = this.containerWidth) === null || _this$containerWidth2 === void 0 ? void 0 : _this$containerWidth2.width) !== containerWidthValue;
@@ -635,9 +620,9 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           isNumberOfColumnsChanged: isNumberOfColumnsChanged,
           isFullWidthModeAndLineLengthChanged: isFullWidthModeAndLineLengthChanged
         });
-        var _getEditorFeatureFlag3 = getEditorFeatureFlags(),
-          _getEditorFeatureFlag4 = _getEditorFeatureFlag3.tableWithFixedColumnWidthsOption,
-          tableWithFixedColumnWidthsOption = _getEditorFeatureFlag4 === void 0 ? false : _getEditorFeatureFlag4;
+        var _getEditorFeatureFlag = getEditorFeatureFlags(),
+          _getEditorFeatureFlag2 = _getEditorFeatureFlag.tableWithFixedColumnWidthsOption,
+          tableWithFixedColumnWidthsOption = _getEditorFeatureFlag2 === void 0 ? false : _getEditorFeatureFlag2;
         var isTableScalingWithFixedColumnWidthsOptionEnabled = !!((_this$props$options3 = this.props.options) !== null && _this$props$options3 !== void 0 && _this$props$options3.isTableScalingEnabled) && tableWithFixedColumnWidthsOption;
         var shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled || !!((_this$props$options4 = this.props.options) !== null && _this$props$options4 !== void 0 && _this$props$options4.isTableScalingEnabled) && !!((_this$props$options5 = this.props.options) !== null && _this$props$options5 !== void 0 && _this$props$options5.isCommentEditor);
         if (force || !isResizing && shouldUpdateColgroup) {
@@ -718,9 +703,9 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       var table = findTable(view.state.selection);
       var shouldScale = false;
       var shouldHandleColgroupUpdates = false;
-      var _getEditorFeatureFlag5 = getEditorFeatureFlags(),
-        _getEditorFeatureFlag6 = _getEditorFeatureFlag5.tableWithFixedColumnWidthsOption,
-        tableWithFixedColumnWidthsOption = _getEditorFeatureFlag6 === void 0 ? false : _getEditorFeatureFlag6;
+      var _getEditorFeatureFlag3 = getEditorFeatureFlags(),
+        _getEditorFeatureFlag4 = _getEditorFeatureFlag3.tableWithFixedColumnWidthsOption,
+        tableWithFixedColumnWidthsOption = _getEditorFeatureFlag4 === void 0 ? false : _getEditorFeatureFlag4;
       if (isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
         shouldScale = true;
         shouldHandleColgroupUpdates = true;
@@ -731,7 +716,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         shouldScale = true;
         shouldHandleColgroupUpdates = true;
       }
-      if (expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) && this.state.windowResized) {
+      if (this.state.windowResized) {
         shouldHandleColgroupUpdates = true;
       }
       if (shouldHandleColgroupUpdates) {
@@ -889,9 +874,9 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         tablePos = undefined;
       }
       var isNested = isTableNested(view.state, tablePos);
-      var _getEditorFeatureFlag7 = getEditorFeatureFlags(),
-        _getEditorFeatureFlag8 = _getEditorFeatureFlag7.tableWithFixedColumnWidthsOption,
-        tableWithFixedColumnWidthsOption = _getEditorFeatureFlag8 === void 0 ? false : _getEditorFeatureFlag8;
+      var _getEditorFeatureFlag5 = getEditorFeatureFlags(),
+        _getEditorFeatureFlag6 = _getEditorFeatureFlag5.tableWithFixedColumnWidthsOption,
+        tableWithFixedColumnWidthsOption = _getEditorFeatureFlag6 === void 0 ? false : _getEditorFeatureFlag6;
       var shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption || !!((_this$props$options10 = this.props.options) !== null && _this$props$options10 !== void 0 && _this$props$options10.isCommentEditor));
       return /*#__PURE__*/React.createElement(TableContainer
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

package/dist/esm/nodeviews/TableContainer.js

@@ -7,8 +7,6 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
 import { akEditorDefaultLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
 import { getPluginState } from '../pm-plugins/plugin-factory';
@@ -75,8 +73,8 @@ var AlignmentTableContainer = function AlignmentTableContainer(_ref2) {
   }, [alignment]);
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": "table-alignment-container",
-    "data-ssr-placeholder": expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? "table-".concat(node.attrs.localId) : undefined,
-    "data-ssr-placeholder-replace": expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? "table-".concat(node.attrs.localId) : undefined
+    "data-ssr-placeholder": "table-".concat(node.attrs.localId),
+    "data-ssr-placeholder-replace": "table-".concat(node.attrs.localId)
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     ,
     style: style
@@ -92,8 +90,8 @@ var AlignmentTableContainerWrapper = function AlignmentTableContainerWrapper(_re
   if (!isTableAlignmentEnabled) {
     return /*#__PURE__*/React.createElement("div", {
       "data-testid": "table-alignment-container",
-      "data-ssr-placeholder": expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? "table-".concat(node.attrs.localId) : undefined,
-      "data-ssr-placeholder-replace": expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? "table-".concat(node.attrs.localId) : undefined,
+      "data-ssr-placeholder": "table-".concat(node.attrs.localId),
+      "data-ssr-placeholder-replace": "table-".concat(node.attrs.localId),
       style: {
         // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         display: 'flex',
@@ -120,7 +118,7 @@ var getPadding = function getPadding(containerWidth) {
     exposure: true
   }) ? akEditorGutterPaddingReduced : akEditorGutterPaddingDynamic();
 };
-var ResizableTableContainerLegacy = /*#__PURE__*/React.memo(function (_ref4) {
+export var ResizableTableContainer = /*#__PURE__*/React.memo(function (_ref4) {
   var children = _ref4.children,
     className = _ref4.className,
     node = _ref4.node,
@@ -137,7 +135,9 @@ var ResizableTableContainerLegacy = /*#__PURE__*/React.memo(function (_ref4) {
     isTableWithFixedColumnWidthsOptionEnabled = _ref4.isTableWithFixedColumnWidthsOptionEnabled,
     isTableAlignmentEnabled = _ref4.isTableAlignmentEnabled,
     shouldUseIncreasedScalingPercent = _ref4.shouldUseIncreasedScalingPercent,
-    isCommentEditor = _ref4.isCommentEditor;
+    isCommentEditor = _ref4.isCommentEditor,
+    isChromelessEditor = _ref4.isChromelessEditor;
+  var tableWidth = getTableContainerWidth(node);
   var containerRef = useRef(null);
   var tableWidthRef = useRef(akEditorDefaultLayoutWidth);
   var _useState = useState(false),
@@ -201,186 +201,6 @@ var ResizableTableContainerLegacy = /*#__PURE__*/React.memo(function (_ref4) {
     var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$s;
     return (_pluginInjectionApi$c = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c2 = pluginInjectionApi.core) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$s = pluginInjectionApi.selection) === null || _pluginInjectionApi$s === void 0 ? void 0 : _pluginInjectionApi$s.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c !== void 0 ? _pluginInjectionApi$c : false;
   }, [pluginInjectionApi]);
-  var tableWidth = getTableContainerWidth(node);
-  var responsiveContainerWidth = 0;
-  var resizeHandleSpacing = 12;
-  var padding = getPadding(containerWidth);
-  // When Full width editor enabled, a Mac OS user can change "ak-editor-content-area" width by
-  // updating Settings -> Appearance -> Show scroll bars from "When scrolling" to "Always". It causes
-  // issues when viwport width is less than full width Editor's width. To detect avoid them
-  // we need to use lineLength to defined responsiveWidth instead of containerWidth
-  // (which does not get updated when Mac setting changes) in Full-width editor.
-  if (isFullWidthModeEnabled) {
-    // When: Show scroll bars -> containerWidth = akEditorGutterPadding * 2 + lineLength;
-    // When: Always -> containerWidth = akEditorGutterPadding * 2 + lineLength + scrollbarWidth;
-    // scrollbarWidth can vary. Values can be 14, 15, 16 and up to 20px;
-    responsiveContainerWidth = isTableScalingEnabled ? lineLength : containerWidth - padding * 2 - resizeHandleSpacing;
-
-    // platform_editor_table_fw_numcol_overflow_fix:
-    // lineLength is undefined on first paint → width: NaN → wrapper expands to page
-    // width. rAF col-sizing then runs before the number-column padding and
-    // the final shrink, so column widths are locked in wrong.
-    // With the flag ON, if the value isn’t finite we fall back to gutterWidth
-    // for that first frame—no flash, no premature rAF.
-    //
-    // Type clean-up comes later:
-    // 1) ship this runtime guard (quick fix, no breakage);
-    // 2) TODO: widen lineLength to `number|undefined` and remove this block.
-    if (fg('platform_editor_table_fw_numcol_overflow_fix')) {
-      if (isTableScalingEnabled && !Number.isFinite(responsiveContainerWidth)) {
-        responsiveContainerWidth = containerWidth - padding * 2 - resizeHandleSpacing;
-      }
-    }
-  } else if (isCommentEditor) {
-    responsiveContainerWidth = containerWidth - TABLE_OFFSET_IN_COMMENT_EDITOR;
-  } else {
-    // 76 is currently an accepted padding value considering the spacing for resizer handle
-    // containerWidth = width of a DIV with test id="ak-editor-fp-content-area". It is a parent of
-    // a DIV with className="ak-editor-content-area". This DIV has padding left and padding right.
-    // padding left = padding right = akEditorGutterPadding = 32
-    responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
-  }
-  // Fix for HOT-119925: Ensure table width is properly constrained and responsive
-  // For wide tables, ensure they don't exceed container width and can be scrolled
-  var calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
-
-  // Ensure minimum width for usability while respecting container constraints
-  var width = Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300));
-  if (!isResizing) {
-    tableWidthRef.current = width;
-  }
-  var maxResizerWidth = isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, TABLE_MAX_WIDTH);
-  var tableResizerProps = {
-    width: width,
-    maxWidth: maxResizerWidth,
-    containerWidth: containerWidth,
-    lineLength: lineLength,
-    updateWidth: updateWidth,
-    editorView: editorView,
-    getPos: getPos,
-    node: node,
-    tableRef: tableRef,
-    displayGuideline: displayGuideline,
-    attachAnalyticsEvent: attachAnalyticsEvent,
-    displayGapCursor: displayGapCursor,
-    isTableAlignmentEnabled: isTableAlignmentEnabled,
-    isFullWidthModeEnabled: isFullWidthModeEnabled,
-    isTableScalingEnabled: isTableScalingEnabled,
-    isTableWithFixedColumnWidthsOptionEnabled: isTableWithFixedColumnWidthsOptionEnabled,
-    isWholeTableInDanger: isWholeTableInDanger,
-    shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent,
-    pluginInjectionApi: pluginInjectionApi,
-    onResizeStart: onResizeStart,
-    onResizeStop: onResizeStop,
-    isCommentEditor: isCommentEditor
-  };
-  var isLivePageViewMode = mode === 'view';
-  return /*#__PURE__*/React.createElement(AlignmentTableContainerWrapper, {
-    isTableAlignmentEnabled: isTableAlignmentEnabled,
-    node: node,
-    pluginInjectionApi: pluginInjectionApi,
-    getPos: getPos,
-    editorView: editorView
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      width: tableWidthRef.current,
-      height: resizing ? updateContainerHeight(tableWrapperHeight !== null && tableWrapperHeight !== void 0 ? tableWrapperHeight : 'auto') : 'auto',
-      position: isLivePageViewMode ? 'relative' : 'unset'
-    }
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: ClassName.TABLE_RESIZER_CONTAINER,
-    ref: containerRef
-  }, /*#__PURE__*/React.createElement(TableResizer, _extends({}, tableResizerProps, {
-    disabled: isLivePageViewMode
-  }), /*#__PURE__*/React.createElement(InnerContainer, {
-    className: className,
-    node: node
-  }, children))));
-});
-var ResizableTableContainerNext = /*#__PURE__*/React.memo(function (_ref5) {
-  var children = _ref5.children,
-    className = _ref5.className,
-    node = _ref5.node,
-    containerWidth = _ref5.containerWidth,
-    lineLength = _ref5.lineLength,
-    editorView = _ref5.editorView,
-    getPos = _ref5.getPos,
-    tableRef = _ref5.tableRef,
-    isResizing = _ref5.isResizing,
-    pluginInjectionApi = _ref5.pluginInjectionApi,
-    tableWrapperHeight = _ref5.tableWrapperHeight,
-    isWholeTableInDanger = _ref5.isWholeTableInDanger,
-    isTableScalingEnabled = _ref5.isTableScalingEnabled,
-    isTableWithFixedColumnWidthsOptionEnabled = _ref5.isTableWithFixedColumnWidthsOptionEnabled,
-    isTableAlignmentEnabled = _ref5.isTableAlignmentEnabled,
-    shouldUseIncreasedScalingPercent = _ref5.shouldUseIncreasedScalingPercent,
-    isCommentEditor = _ref5.isCommentEditor,
-    isChromelessEditor = _ref5.isChromelessEditor;
-  var tableWidth = getTableContainerWidth(node);
-  var containerRef = useRef(null);
-  var tableWidthRef = useRef(akEditorDefaultLayoutWidth);
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    resizing = _useState4[0],
-    setIsResizing = _useState4[1];
-  var _useSharedPluginState3 = useSharedPluginStateWithSelector(pluginInjectionApi, ['table', 'editorViewMode'], selector),
-    tableState = _useSharedPluginState3.tableState,
-    editorViewModeState = _useSharedPluginState3.editorViewModeState;
-  var isFullWidthModeEnabled = tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled;
-  var mode = editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode;
-  var updateContainerHeight = useCallback(function (height) {
-    var _containerRef$current3;
-    // current StickyHeader State is not stable to be fetch.
-    // we need to update stickyHeader plugin to make sure state can be
-    //    consistently fetch and refactor below
-    var stickyHeaders = (_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.getElementsByClassName('pm-table-sticky');
-    if (!stickyHeaders || stickyHeaders.length < 1) {
-      // when starting to drag, we need to keep the original space,
-      // -- When sticky header not appear, margin top(24px) and margin bottom(16px), should be 40px,
-      //    1px is border width but collapse make it 0.5.
-      // -- When sticky header appear, we should add first row height but reduce
-      //    collapsed border
-      return typeof height === 'number' ? "".concat(height + 40.5, "px") : 'auto';
-    } else {
-      var _containerRef$current4;
-      var stickyHeaderHeight = ((_containerRef$current4 = containerRef.current) === null || _containerRef$current4 === void 0 ? void 0 : _containerRef$current4.getElementsByTagName('th')[0].getBoundingClientRect().height) || 0;
-      return typeof height === 'number' ? "".concat(height + stickyHeaderHeight + 39.5, "px") : 'auto';
-    }
-  }, []);
-  var onResizeStart = useCallback(function () {
-    setIsResizing(true);
-  }, []);
-  var onResizeStop = useCallback(function () {
-    setIsResizing(false);
-  }, []);
-  var updateWidth = useCallback(function (width) {
-    if (!containerRef.current) {
-      return;
-    }
-
-    // make sure during resizing
-    // the pm-table-resizer-container width is the same as its child div resizer-item
-    // otherwise when resize table from wider to narrower , pm-table-resizer-container stays wider
-    // and cause the fabric-editor-popup-scroll-parent to overflow
-    if (containerRef.current.style.width !== "".concat(width, "px")) {
-      containerRef.current.style.width = "".concat(width, "px");
-    }
-  }, []);
-  var displayGuideline = useCallback(function (guidelines) {
-    var _pluginInjectionApi$g3, _pluginInjectionApi$g4;
-    return (_pluginInjectionApi$g3 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$g4 = pluginInjectionApi.guideline) === null || _pluginInjectionApi$g4 === void 0 || (_pluginInjectionApi$g4 = _pluginInjectionApi$g4.actions) === null || _pluginInjectionApi$g4 === void 0 ? void 0 : _pluginInjectionApi$g4.displayGuideline(editorView)({
-      guidelines: guidelines
-    })) !== null && _pluginInjectionApi$g3 !== void 0 ? _pluginInjectionApi$g3 : false;
-  }, [pluginInjectionApi, editorView]);
-  var attachAnalyticsEvent = useCallback(function (payload) {
-    var _pluginInjectionApi$a3;
-    return pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.actions.attachAnalyticsEvent(payload);
-  }, [pluginInjectionApi]);
-  var displayGapCursor = useCallback(function (toggle) {
-    var _pluginInjectionApi$c3, _pluginInjectionApi$c4, _pluginInjectionApi$s2;
-    return (_pluginInjectionApi$c3 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c4 = pluginInjectionApi.core) === null || _pluginInjectionApi$c4 === void 0 ? void 0 : _pluginInjectionApi$c4.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$s2 = pluginInjectionApi.selection) === null || _pluginInjectionApi$s2 === void 0 ? void 0 : _pluginInjectionApi$s2.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c3 !== void 0 ? _pluginInjectionApi$c3 : false;
-  }, [pluginInjectionApi]);
   var isFullPageAppearance = !isCommentEditor && !isChromelessEditor;
   var _useMemo = useMemo(function () {
       var responsiveContainerWidth = 0;
@@ -510,32 +330,28 @@ var ResizableTableContainerNext = /*#__PURE__*/React.memo(function (_ref5) {
     node: node
   }, children))));
 });
-export var ResizableTableContainer = componentWithCondition(function () {
-  return expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true);
-}, ResizableTableContainerNext, ResizableTableContainerLegacy);
-export var TableContainer = function TableContainer(_ref6) {
-  var _node$attrs$width;
-  var children = _ref6.children,
-    node = _ref6.node,
-    className = _ref6.className,
-    _ref6$containerWidth = _ref6.containerWidth,
-    editorWidth = _ref6$containerWidth.width,
-    lineLength = _ref6$containerWidth.lineLength,
-    editorView = _ref6.editorView,
-    getPos = _ref6.getPos,
-    tableRef = _ref6.tableRef,
-    isNested = _ref6.isNested,
-    tableWrapperHeight = _ref6.tableWrapperHeight,
-    isResizing = _ref6.isResizing,
-    pluginInjectionApi = _ref6.pluginInjectionApi,
-    isWholeTableInDanger = _ref6.isWholeTableInDanger,
-    isTableResizingEnabled = _ref6.isTableResizingEnabled,
-    isTableScalingEnabled = _ref6.isTableScalingEnabled,
-    isTableWithFixedColumnWidthsOptionEnabled = _ref6.isTableWithFixedColumnWidthsOptionEnabled,
-    isTableAlignmentEnabled = _ref6.isTableAlignmentEnabled,
-    shouldUseIncreasedScalingPercent = _ref6.shouldUseIncreasedScalingPercent,
-    isCommentEditor = _ref6.isCommentEditor,
-    isChromelessEditor = _ref6.isChromelessEditor;
+export var TableContainer = function TableContainer(_ref5) {
+  var children = _ref5.children,
+    node = _ref5.node,
+    className = _ref5.className,
+    _ref5$containerWidth = _ref5.containerWidth,
+    editorWidth = _ref5$containerWidth.width,
+    lineLength = _ref5$containerWidth.lineLength,
+    editorView = _ref5.editorView,
+    getPos = _ref5.getPos,
+    tableRef = _ref5.tableRef,
+    isNested = _ref5.isNested,
+    tableWrapperHeight = _ref5.tableWrapperHeight,
+    isResizing = _ref5.isResizing,
+    pluginInjectionApi = _ref5.pluginInjectionApi,
+    isWholeTableInDanger = _ref5.isWholeTableInDanger,
+    isTableResizingEnabled = _ref5.isTableResizingEnabled,
+    isTableScalingEnabled = _ref5.isTableScalingEnabled,
+    isTableWithFixedColumnWidthsOptionEnabled = _ref5.isTableWithFixedColumnWidthsOptionEnabled,
+    isTableAlignmentEnabled = _ref5.isTableAlignmentEnabled,
+    shouldUseIncreasedScalingPercent = _ref5.shouldUseIncreasedScalingPercent,
+    isCommentEditor = _ref5.isCommentEditor,
+    isChromelessEditor = _ref5.isChromelessEditor;
   if (isTableResizingEnabled && !isNested) {
     return /*#__PURE__*/React.createElement(ResizableTableContainer
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -568,7 +384,7 @@ export var TableContainer = function TableContainer(_ref6) {
   var _getPluginState = getPluginState(editorView.state),
     isDragAndDropEnabled = _getPluginState.isDragAndDropEnabled;
   var isFullPageAppearance = !isCommentEditor && !isChromelessEditor;
-  var resizableTableWidth = expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? isFullPageAppearance ? getTableResizerContainerForFullPageWidthInCSS(node, isTableScalingEnabled) : "calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2))" : "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ".concat((_node$attrs$width = node.attrs.width) !== null && _node$attrs$width !== void 0 ? _node$attrs$width : '100%', ")");
+  var resizableTableWidth = isFullPageAppearance ? getTableResizerContainerForFullPageWidthInCSS(node, isTableScalingEnabled) : "calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2))";
   return /*#__PURE__*/React.createElement(InnerContainer, {
     node: node
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766

package/dist/esm/nodeviews/TableResizer.js

@@ -409,15 +409,8 @@ export var TableResizer = function TableResizer(_ref) {
   }, [editorView, getPos, node, isCommentEditor, widthToWidest, isToolbarAIFCEnabled, endMeasure, displayGapCursor, displayGuideline, updateWidth, scheduleResize, onResizeStop, pluginInjectionApi, attachAnalyticsEvent, tableRef, isTableScalingEnabled, shouldUseIncreasedScalingPercent, formatMessage]);
   var handleTableSizeChangeOnKeypress = useCallback(function (step) {
     var newWidth = width + step;
-    if (expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
-      if (newWidth < resizerMinWidth) {
-        return;
-      }
-    } else {
-      // maxWidth when platform_editor_tables_scaling_css off is always a number
-      if (newWidth > maxWidth || newWidth < resizerMinWidth) {
-        return;
-      }
+    if (newWidth < resizerMinWidth) {
+      return;
     }
     handleResizeStop({
       width: width,
@@ -428,7 +421,7 @@ export var TableResizer = function TableResizer(_ref) {
       width: step,
       height: 0
     });
-  }, [width, handleResizeStop, maxWidth, resizerMinWidth]);
+  }, [width, handleResizeStop, resizerMinWidth]);
   var handleEscape = useCallback(function () {
     editorView === null || editorView === void 0 || editorView.focus();
   }, [editorView]);

package/dist/esm/nodeviews/table.js

@@ -16,7 +16,6 @@ import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { pluginConfig as getPluginConfig } from '../pm-plugins/create-plugin-config';
 import { getPluginState } from '../pm-plugins/plugin-factory';
 import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
@@ -142,7 +141,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
         if (this.view.state.selection.visible) {
           selectionBookmark = this.view.state.selection.getBookmark();
         }
-        if (this.dom && expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
+        if (this.dom) {
           this.dom.setAttribute('data-ssr-placeholder', "table-nodeview-".concat(this.node.attrs.localId));
           this.dom.setAttribute('data-ssr-placeholder-replace', "table-nodeview-".concat(this.node.attrs.localId));
         }

package/dist/esm/nodeviews/toDOM.js

@@ -6,10 +6,8 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import kebabCase from 'lodash/kebabCase';
 import { table, tableWithNestedTable } from '@atlaskit/adf-schema';
 import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
-import { akEditorGutterPaddingDynamic } from '@atlaskit/editor-shared-styles';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
-import { generateColgroup, generateColgroupFromNode, getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
+import { generateColgroupFromNode, getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
 import { TABLE_MAX_WIDTH } from '../pm-plugins/table-resizing/utils/consts';
 import { getTableResizerContainerMaxWidthInCSS, getTableResizerContainerForFullPageWidthInCSS, getTableResizerItemWidthInCSS } from '../pm-plugins/table-resizing/utils/misc';
 import { getAlignmentStyle } from './table-container-styles';
@@ -17,16 +15,6 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
   var tableNode = config.isNestingSupported ? tableWithNestedTable : table;
   return _objectSpread(_objectSpread({}, tableNode), {}, {
     toDOM: function toDOM(node) {
-      var _node$attrs$width;
-      var gutterPadding = function gutterPadding() {
-        if (editorExperiment('platform_editor_preview_panel_responsiveness', true, {
-          exposure: true
-        })) {
-          return 'calc(var(--ak-editor--large-gutter-padding) * 2)';
-        } else {
-          return "".concat(akEditorGutterPaddingDynamic() * 2, "px");
-        }
-      };
       var alignmentStyle = Object.entries(getAlignmentStyle(node.attrs.layout)).map(function (_ref) {
         var _ref2 = _slicedToArray(_ref, 2),
           k = _ref2[0],
@@ -34,29 +22,23 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
         return "".concat(kebabCase(k), ": ").concat(kebabCase(v));
       }).join(';');
       var tableMinWidth = getResizerMinWidth(node);
-      var tableWidthAttribute = node.attrs.width ? "".concat(node.attrs.width, "px") : "100%";
       var isFullPageEditor = !config.isChromelessEditor && !config.isCommentEditor;
-      var attrs = _objectSpread({
+      var attrs = {
         'data-number-column': node.attrs.isNumberColumnEnabled,
         'data-layout': node.attrs.layout,
         'data-autosize': node.attrs.__autoSize,
         'data-table-local-id': node.attrs.localId,
-        'data-table-width': node.attrs.width
-      }, expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) && {
+        'data-table-width': node.attrs.width,
         'data-ssr-placeholder': "table-".concat(node.attrs.localId),
         'data-ssr-placeholder-replace': "table-".concat(node.attrs.localId)
-      });
+      };
 
       // This would be used for table scaling in colgroup CSS
       // cqw, or px is well supported
-      var resizableTableWidth = expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? isFullPageEditor ? getTableResizerContainerForFullPageWidthInCSS(node, config.isTableScalingEnabled) : "calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2))" : "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ".concat((_node$attrs$width = node.attrs.width) !== null && _node$attrs$width !== void 0 ? _node$attrs$width : '100%', ")");
+      var resizableTableWidth = isFullPageEditor ? getTableResizerContainerForFullPageWidthInCSS(node, config.isTableScalingEnabled) : "calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2))";
       var colgroup = '';
       if (config.allowColumnResizing) {
-        if (expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
-          colgroup = ['colgroup', {}].concat(_toConsumableArray(generateColgroupFromNode(node, config.isCommentEditor, config.isChromelessEditor, config.isNested, config.isTableScalingEnabled, config.shouldUseIncreasedScalingPercent)));
-        } else {
-          colgroup = ['colgroup', {}].concat(_toConsumableArray(generateColgroup(node)));
-        }
+        colgroup = ['colgroup', {}].concat(_toConsumableArray(generateColgroupFromNode(node, config.isCommentEditor, config.isChromelessEditor, config.isNested, config.isTableScalingEnabled, config.shouldUseIncreasedScalingPercent)));
       }
 
       // For Chromeless editor, and nested tables in full page editor
@@ -105,7 +87,7 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
         'data-testid': 'sticky-sentinel-bottom'
       }]];
       var tableContainerDiv = expValEquals('platform_editor_disable_table_overflow_shadows', 'cohort', 'variant1') || expValEquals('platform_editor_disable_table_overflow_shadows', 'cohort', 'variant2') || expValEquals('platform_editor_disable_table_overflow_shadows', 'cohort', 'variant3') ? tableContainerDivNext : tableContainerDivLegacy;
-      if (!config.tableResizingEnabled || expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) && config.isNested) {
+      if (!config.tableResizingEnabled || config.isNested) {
         return ['div', {
           class: 'tableView-content-wrap',
           'data-prosemirror-initial-toDOM-render': 'true',
@@ -122,7 +104,7 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
         style: convertToInlineCss({
           '--ak-editor-table-gutter-padding': config.isTableScalingEnabled ? 'calc(var(--ak-editor--large-gutter-padding) * 2)' : 'calc(var(--ak-editor--large-gutter-padding) * 2 - var(--ak-editor-resizer-handle-spacing))',
           '--ak-editor-table-width': resizableTableWidth,
-          width: expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? "var(--ak-editor-table-width)" : "min(calc(100cqw - ".concat(gutterPadding(), "), ").concat(tableWidthAttribute, ")")
+          width: "var(--ak-editor-table-width)"
         })
       }, ['div', {
         class: 'resizer-item display-handle',
@@ -133,8 +115,8 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
           '--ak-editor-table-max-width': "".concat(TABLE_MAX_WIDTH, "px"),
           '--ak-editor-table-min-width': "".concat(tableMinWidth, "px"),
           minWidth: 'var(--ak-editor-table-min-width)',
-          maxWidth: expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? getTableResizerContainerMaxWidthInCSS(config.isCommentEditor, config.isChromelessEditor, config.isTableScalingEnabled) : "min(calc(100cqw - var(--ak-editor-table-gutter-padding)), var(--ak-editor-table-max-width))",
-          width: expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) ? getTableResizerItemWidthInCSS(node, config.isCommentEditor, config.isChromelessEditor) : "min(calc(100cqw - var(--ak-editor-table-gutter-padding)), ".concat(tableWidthAttribute, ")")
+          maxWidth: getTableResizerContainerMaxWidthInCSS(config.isCommentEditor, config.isChromelessEditor, config.isTableScalingEnabled),
+          width: getTableResizerItemWidthInCSS(node, config.isCommentEditor, config.isChromelessEditor)
         })
       }, ['span', {
         class: 'resizer-hover-zone'

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

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { insideTable, isSSR } from '@atlaskit/editor-common/core-utils';
+import { insideTable } from '@atlaskit/editor-common/core-utils';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { transformSliceToRemoveOpenBodiedExtension, transformSliceToRemoveOpenExpand, transformSliceToRemoveOpenLayoutNodes, transformSliceToRemoveOpenMultiBodiedExtension, transformSliceToRemoveOpenNestedExpand } from '@atlaskit/editor-common/transforms';
 import { browser, closestElement } from '@atlaskit/editor-common/utils';
@@ -10,7 +10,6 @@ import { findParentDomRefOfType, findParentNodeOfType } from '@atlaskit/editor-p
 import { TableMap } from '@atlaskit/editor-tables';
 import { findTable } from '@atlaskit/editor-tables/utils';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { tableCellView, tableHeaderView, tableRowView, tableView } from '../nodeviews/table-node-views';
 import { pluginKey as decorationsPluginKey } from '../pm-plugins/decorations/plugin';
 import { TableCssClassName as ClassName } from '../types';
@@ -54,36 +53,6 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
     return editorView.state;
   };
   var getNodeView = function getNodeView() {
-    // Because the layout shift issues has been fixed under experiment platform_editor_tables_scaling_css, so still want to load nodeview on SSR if experiment is enabled
-    if (expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
-      return {
-        table: tableView({
-          portalProviderAPI: portalProviderAPI,
-          eventDispatcher: eventDispatcher,
-          getEditorContainerWidth: getEditorContainerWidth,
-          getEditorFeatureFlags: getEditorFeatureFlags,
-          dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-          pluginInjectionApi: pluginInjectionApi,
-          isCommentEditor: isCommentEditor,
-          isChromelessEditor: isChromelessEditor
-        }),
-        tableRow: tableRowView({
-          eventDispatcher: eventDispatcher,
-          pluginInjectionApi: pluginInjectionApi
-        }),
-        tableCell: tableCellView({
-          eventDispatcher: eventDispatcher,
-          pluginInjectionApi: pluginInjectionApi
-        }),
-        tableHeader: tableHeaderView({
-          eventDispatcher: eventDispatcher,
-          pluginInjectionApi: pluginInjectionApi
-        })
-      };
-    }
-    if (isSSR()) {
-      return undefined;
-    }
     return {
       table: tableView({
         portalProviderAPI: portalProviderAPI,