@atlaskit/editor-plugin-table 15.3.23 → 15.4.0

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/editor-plugin-table
 
+## 15.4.0
+
+### Minor Changes
+
+- [`8f759171c089b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8f759171c089b) -
+  [EDITOR-3322] Make sure that tables are able to handle the new max-width
+
 ## 15.3.23
 
 ### Patch Changes

package/dist/cjs/nodeviews/TableContainer.js

@@ -15,6 +15,7 @@ var _hooks = require("@atlaskit/editor-common/hooks");
 var _nodeWidth = require("@atlaskit/editor-common/node-width");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _commandsWithAnalytics = require("../pm-plugins/commands/commands-with-analytics");
 var _pluginFactory = require("../pm-plugins/plugin-factory");
@@ -257,7 +258,7 @@ var ResizableTableContainer = exports.ResizableTableContainer = /*#__PURE__*/_re
 
       // Ensure minimum width for usability while respecting container constraints
       var width = Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300));
-      var maxResizerWidth = isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, _consts.TABLE_MAX_WIDTH);
+      var maxResizerWidth = isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, (0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? _consts.TABLE_MAX_WIDTH : _consts.TABLE_FULL_WIDTH);
       return {
         width: width,
         maxResizerWidth: maxResizerWidth

package/dist/cjs/nodeviews/TableResizer.js

@@ -306,8 +306,8 @@ var TableResizer = exports.TableResizer = function TableResizer(_ref) {
     var fullWidthGuideline = (0, _guidelines.defaultGuidelinesForPreserveTable)(_guidelines.PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig).filter(function (guideline) {
       return guideline.isFullWidth;
     })[0];
-    var isFullWidthGuidelineActive = closestSnap && closestSnap.keys.includes(fullWidthGuideline.key);
-    var tableMaxWidth = isCommentEditor ? Math.floor(containerWidth - _consts.TABLE_OFFSET_IN_COMMENT_EDITOR) : _consts.TABLE_MAX_WIDTH;
+    var isFullWidthGuidelineActive = (0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? closestSnap && fullWidthGuideline && closestSnap.keys.includes(fullWidthGuideline.key) : closestSnap && closestSnap.keys.includes(fullWidthGuideline.key);
+    var tableMaxWidth = isCommentEditor ? Math.floor(containerWidth - _consts.TABLE_OFFSET_IN_COMMENT_EDITOR) : (0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? _consts.TABLE_MAX_WIDTH : _consts.TABLE_FULL_WIDTH;
     var shouldUpdateWidthToWidest = isCommentEditor ? tableMaxWidth <= newWidth : !!isTableScalingEnabled && isFullWidthGuidelineActive;
     var previewParentWidth = isCommentEditor && shouldUpdateWidthToWidest ? tableMaxWidth : newWidth;
     (0, _scaleTable.previewScaleTable)(tableRef, {
@@ -335,7 +335,7 @@ var TableResizer = exports.TableResizer = function TableResizer(_ref) {
     var pos = getPos();
     var currentTableNodeLocalId = (_node$attrs$localId2 = node === null || node === void 0 || (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.localId) !== null && _node$attrs$localId2 !== void 0 ? _node$attrs$localId2 : '';
     var tableMaxWidth = isCommentEditor ? undefined // Table's full-width in comment appearance inherit the width of the Editor/Renderer
-    : _consts.TABLE_MAX_WIDTH;
+    : (0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? _consts.TABLE_MAX_WIDTH : _consts.TABLE_FULL_WIDTH;
     newWidth = widthToWidest && currentTableNodeLocalId && widthToWidest[currentTableNodeLocalId] ? tableMaxWidth : newWidth;
     var tr = state.tr.setMeta(_tableWidth.pluginKey, {
       resizing: false,

package/dist/cjs/nodeviews/toDOM.js

@@ -119,7 +119,7 @@ var tableNodeSpecWithFixedToDOM = exports.tableNodeSpecWithFixedToDOM = function
           position: 'relative',
           userSelect: 'auto',
           boxSizing: 'border-box',
-          '--ak-editor-table-max-width': "".concat(_consts.TABLE_MAX_WIDTH, "px"),
+          '--ak-editor-table-max-width': "".concat((0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? _consts.TABLE_MAX_WIDTH : _consts.TABLE_FULL_WIDTH, "px"),
           '--ak-editor-table-min-width': "".concat(tableMinWidth, "px"),
           minWidth: 'var(--ak-editor-table-min-width)',
           maxWidth: (0, _misc.getTableResizerContainerMaxWidthInCSS)(config.isCommentEditor, config.isChromelessEditor, config.isTableScalingEnabled),

package/dist/cjs/pm-plugins/commands/insert.js

@@ -163,12 +163,13 @@ var insertRow = exports.insertRow = function insertRow(row, moveCursorToTheNewRo
  * @deprecated This function is deprecated - please use insertTableWithNestingSupport instead.
  * (To be removed with feature gate: `platform_editor_use_nested_table_pm_nodes`)
  */
-var createTable = exports.createTable = function createTable(isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled) {
+var createTable = exports.createTable = function createTable(isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, isMaxWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled) {
   return function (state, dispatch) {
     var table = (0, _create.createTableWithWidth)({
       isTableScalingEnabled: isTableScalingEnabled,
       isTableAlignmentEnabled: isTableAlignmentEnabled,
       isFullWidthModeEnabled: isFullWidthModeEnabled,
+      isMaxWidthModeEnabled: isMaxWidthModeEnabled,
       isCommentEditor: isCommentEditor,
       isChromelessEditor: isChromelessEditor,
       isTableResizingEnabled: isTableResizingEnabled
@@ -197,13 +198,14 @@ var createTable = exports.createTable = function createTable(isTableScalingEnabl
  * @deprecated This function is deprecated - please use insertTableWithNestingSupport instead.
  * (To be removed with feature gate: `platform_editor_use_nested_table_pm_nodes`)
  */
-var insertTableWithSize = exports.insertTableWithSize = function insertTableWithSize(isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor) {
+var insertTableWithSize = exports.insertTableWithSize = function insertTableWithSize(isFullWidthModeEnabled, isMaxWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor) {
   return function (rowsCount, colsCount, inputMethod) {
     return function (_ref) {
       var tr = _ref.tr;
       var tableNode = (0, _create.createTableWithWidth)({
         isTableScalingEnabled: isTableScalingEnabled,
         isFullWidthModeEnabled: isFullWidthModeEnabled,
+        isMaxWidthModeEnabled: isMaxWidthModeEnabled,
         isTableAlignmentEnabled: isTableAlignmentEnabled,
         isCommentEditor: isCommentEditor,
         isChromelessEditor: isChromelessEditor,
@@ -254,6 +256,8 @@ var insertTableWithNestingSupport = exports.insertTableWithNestingSupport = func
     isTableAlignmentEnabled = _ref2$isTableAlignmen === void 0 ? false : _ref2$isTableAlignmen,
     _ref2$isFullWidthMode = _ref2.isFullWidthModeEnabled,
     isFullWidthModeEnabled = _ref2$isFullWidthMode === void 0 ? false : _ref2$isFullWidthMode,
+    _ref2$isMaxWidthModeE = _ref2.isMaxWidthModeEnabled,
+    isMaxWidthModeEnabled = _ref2$isMaxWidthModeE === void 0 ? false : _ref2$isMaxWidthModeE,
     _ref2$isCommentEditor = _ref2.isCommentEditor,
     isCommentEditor = _ref2$isCommentEditor === void 0 ? false : _ref2$isCommentEditor,
     _ref2$isChromelessEdi = _ref2.isChromelessEditor,
@@ -289,6 +293,7 @@ var insertTableWithNestingSupport = exports.insertTableWithNestingSupport = func
       isTableScalingEnabled: isTableScalingEnabled,
       isTableAlignmentEnabled: isTableAlignmentEnabled,
       isFullWidthModeEnabled: isFullWidthModeEnabled,
+      isMaxWidthModeEnabled: isMaxWidthModeEnabled,
       isCommentEditor: isCommentEditor,
       isChromelessEditor: isChromelessEditor,
       isTableResizingEnabled: isTableResizingEnabled,

package/dist/cjs/pm-plugins/table-resizing/utils/consts.js

@@ -3,9 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TABLE_OFFSET_IN_COMMENT_EDITOR = exports.TABLE_MAX_WIDTH = exports.TABLE_EDITOR_MARGIN = exports.MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION = exports.MAX_SCALING_PERCENT = exports.FULL_WIDTH_EDITOR_CONTENT_WIDTH = exports.COLUMN_MIN_WIDTH = void 0;
+exports.TABLE_OFFSET_IN_COMMENT_EDITOR = exports.TABLE_MAX_WIDTH = exports.TABLE_FULL_WIDTH = exports.TABLE_EDITOR_MARGIN = exports.MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION = exports.MAX_SCALING_PERCENT = exports.FULL_WIDTH_EDITOR_CONTENT_WIDTH = exports.COLUMN_MIN_WIDTH = void 0;
 var COLUMN_MIN_WIDTH = exports.COLUMN_MIN_WIDTH = 48;
-var TABLE_MAX_WIDTH = exports.TABLE_MAX_WIDTH = 1800;
+// Remove TABLE_MAX_WIDTH_OLD when cleaning up editor_tinymce_full_width_mode experiment
+var TABLE_FULL_WIDTH = exports.TABLE_FULL_WIDTH = 1800;
+var TABLE_MAX_WIDTH = exports.TABLE_MAX_WIDTH = 4000;
 var FULL_WIDTH_EDITOR_CONTENT_WIDTH = exports.FULL_WIDTH_EDITOR_CONTENT_WIDTH = 1800;
 var MAX_SCALING_PERCENT = exports.MAX_SCALING_PERCENT = 0.3;
 var MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION = exports.MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION = 0.4;

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

@@ -11,6 +11,7 @@ var _nodeWidth = require("@atlaskit/editor-common/node-width");
 var _styles = require("@atlaskit/editor-common/styles");
 var _utils = require("@atlaskit/editor-common/utils");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _colgroup = require("./colgroup");
 var _consts = require("./consts");
@@ -105,7 +106,7 @@ var getTableContainerElementWidth = exports.getTableContainerElementWidth = func
  * @returns The CSS max-width value
  */
 var getTableResizerContainerMaxWidthInCSS = exports.getTableResizerContainerMaxWidthInCSS = function getTableResizerContainerMaxWidthInCSS(isCommentEditor, isChromelessEditor, isTableScalingEnabled) {
-  var maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ".concat(_consts.TABLE_MAX_WIDTH, "px)") : "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2) - var(--ak-editor--resizer-handle-spacing)), ".concat(_consts.TABLE_MAX_WIDTH, "px)");
+  var maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ".concat((0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? _consts.TABLE_MAX_WIDTH : _consts.TABLE_FULL_WIDTH, "px)") : "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2) - var(--ak-editor--resizer-handle-spacing)), ".concat((0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? _consts.TABLE_MAX_WIDTH : _consts.TABLE_FULL_WIDTH, "px)");
   return isCommentEditor || isChromelessEditor ? '100%' : maxResizerWidthForNonCommentEditor;
 };
 

package/dist/cjs/pm-plugins/table-width.js

@@ -12,6 +12,7 @@ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _document = require("@atlaskit/editor-common/utils/document");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _consts = require("./table-resizing/utils/consts");
 var _alignment = require("./utils/alignment");
 var _excluded = ["width"];
@@ -22,7 +23,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * Also holds resizing state to hide / show table controls
  */
 var pluginKey = exports.pluginKey = new _state.PluginKey('tableWidthPlugin');
-var createPlugin = exports.createPlugin = function createPlugin(dispatch, dispatchAnalyticsEvent, fullWidthEnabled, isTableScalingEnabled, isTableAlignmentEnabled, isCommentEditor) {
+var createPlugin = exports.createPlugin = function createPlugin(dispatch, dispatchAnalyticsEvent, fullWidthEnabled, maxWidthEnabled, isTableScalingEnabled, isTableAlignmentEnabled, isCommentEditor) {
   return new _safePlugin.SafePlugin({
     key: pluginKey,
     state: {
@@ -72,7 +73,9 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, dispat
             var layout = node.attrs.layout;
             if (!width && layout) {
               var tableWidthCal;
-              if (fullWidthEnabled) {
+              if (maxWidthEnabled) {
+                tableWidthCal = _editorSharedStyles.akEditorMaxWidthLayoutWidth;
+              } else if (fullWidthEnabled) {
                 tableWidthCal = _editorSharedStyles.akEditorFullWidthLayoutWidth;
               } else {
                 switch (layout) {
@@ -106,8 +109,8 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, dispat
           step.getMap().forEach(function (_, __, newStart, newEnd) {
             newState.doc.nodesBetween(newStart, newEnd, function (node, pos) {
               if (node.type === table) {
-                if (shouldPatchTableWidth && node.attrs.width !== _consts.TABLE_MAX_WIDTH) {
-                  tr.setNodeAttribute(pos, 'width', _consts.TABLE_MAX_WIDTH);
+                if (shouldPatchTableWidth && node.attrs.width !== (0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? _consts.TABLE_MAX_WIDTH : _consts.TABLE_FULL_WIDTH) {
+                  tr.setNodeAttribute(pos, 'width', (0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) ? _consts.TABLE_MAX_WIDTH : _consts.TABLE_FULL_WIDTH);
                 }
                 if (shouldPatchTableAlignment) {
                   tr.setNodeAttribute(pos, 'layout', _alignment.ALIGN_START);

package/dist/cjs/pm-plugins/utils/create.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.createTableWithWidth = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _utils = require("@atlaskit/editor-tables/utils");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _consts = require("../table-resizing/utils/consts");
 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) { (0, _defineProperty2.default)(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; }
@@ -16,6 +17,7 @@ var createTableWithWidth = exports.createTableWithWidth = function createTableWi
   var isTableScalingEnabled = _ref.isTableScalingEnabled,
     isTableAlignmentEnabled = _ref.isTableAlignmentEnabled,
     isFullWidthModeEnabled = _ref.isFullWidthModeEnabled,
+    isMaxWidthModeEnabled = _ref.isMaxWidthModeEnabled,
     isCommentEditor = _ref.isCommentEditor,
     isChromelessEditor = _ref.isChromelessEditor,
     isTableResizingEnabled = _ref.isTableResizingEnabled,
@@ -27,10 +29,14 @@ var createTableWithWidth = exports.createTableWithWidth = function createTableWi
       attrsOverrides.rowsCount = createTableProps !== null && createTableProps !== void 0 && createTableProps.rowsCount ? createTableProps === null || createTableProps === void 0 ? void 0 : createTableProps.rowsCount : NESTED_TABLE_DEFAULT_ROWS;
       attrsOverrides.colsCount = createTableProps !== null && createTableProps !== void 0 && createTableProps.colsCount ? createTableProps === null || createTableProps === void 0 ? void 0 : createTableProps.colsCount : NESTED_TABLE_DEFAULT_COLS;
     }
-    if (isTableScalingEnabled && isFullWidthModeEnabled && !isCommentEditor) {
-      attrsOverrides.tableWidth = _consts.TABLE_MAX_WIDTH;
+    if (isTableScalingEnabled && !isCommentEditor) {
+      if ((0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) && isMaxWidthModeEnabled) {
+        attrsOverrides.tableWidth = _consts.TABLE_MAX_WIDTH;
+      } else if (isFullWidthModeEnabled) {
+        attrsOverrides.tableWidth = _consts.TABLE_FULL_WIDTH;
+      }
     }
-    if (isTableAlignmentEnabled && (isFullWidthModeEnabled || isCommentEditor)) {
+    if (isTableAlignmentEnabled && (isFullWidthModeEnabled || (0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) && isMaxWidthModeEnabled || isCommentEditor)) {
       attrsOverrides.layout = 'align-start';
     }
     if (isCommentEditor && isTableResizingEnabled || isChromelessEditor) {

package/dist/cjs/pm-plugins/utils/snapping.js

@@ -8,6 +8,7 @@ exports.findClosestSnap = exports.defaultTablePreserveSnappingWidths = exports.d
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _guideline = require("@atlaskit/editor-common/guideline");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var numberOfLanesInDefaultLayoutWidth = 12;
 var calculateSubSnappingWidths = function calculateSubSnappingWidths(totalLanes, totalWidth) {
@@ -19,8 +20,8 @@ var calculateDefaultSnappings = exports.calculateDefaultSnappings = function cal
   var lengthOffset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
   return [].concat((0, _toConsumableArray2.default)(calculateSubSnappingWidths(numberOfLanesInDefaultLayoutWidth, _editorSharedStyles.akEditorDefaultLayoutWidth + lengthOffset)), [_editorSharedStyles.akEditorDefaultLayoutWidth + lengthOffset, _editorSharedStyles.akEditorCalculatedWideLayoutWidth + lengthOffset, _editorSharedStyles.akEditorFullWidthLayoutWidth + lengthOffset]);
 };
-var getPadding = function getPadding(editorContainerWith) {
-  return editorContainerWith <= _editorSharedStyles.akEditorFullPageNarrowBreakout && (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
+var getPadding = function getPadding(editorContainerWidth) {
+  return editorContainerWidth <= _editorSharedStyles.akEditorFullPageNarrowBreakout && (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
     exposure: true
   }) ? _editorSharedStyles.akEditorGutterPaddingReduced : (0, _editorSharedStyles.akEditorGutterPaddingDynamic)();
 };
@@ -28,14 +29,18 @@ var getPadding = function getPadding(editorContainerWith) {
 // FF TablePreserve for calculateDefaultSnappings
 var calculateDefaultTablePreserveSnappings = exports.calculateDefaultTablePreserveSnappings = function calculateDefaultTablePreserveSnappings() {
   var lengthOffset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-  var editorContainerWith = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _editorSharedStyles.akEditorFullWidthLayoutWidth;
+  var editorContainerWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _editorSharedStyles.akEditorFullWidthLayoutWidth;
   var exclude = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
     innerGuidelines: false,
     breakoutPoints: false
   };
-  var padding = getPadding(editorContainerWith);
-  var dynamicFullWidthLine = editorContainerWith - padding * 2 >= _editorSharedStyles.akEditorFullWidthLayoutWidth ? _editorSharedStyles.akEditorFullWidthLayoutWidth : editorContainerWith - padding * 2;
+  var padding = getPadding(editorContainerWidth);
+  var dynamicFullWidthLine = editorContainerWidth - padding * 2 >= _editorSharedStyles.akEditorFullWidthLayoutWidth ? _editorSharedStyles.akEditorFullWidthLayoutWidth : editorContainerWidth - padding * 2;
+  var dynamicMaxWidthLine = editorContainerWidth - padding * 2 >= _editorSharedStyles.akEditorMaxWidthLayoutWidth ? _editorSharedStyles.akEditorMaxWidthLayoutWidth : editorContainerWidth - padding * 2;
   var guides = [dynamicFullWidthLine - lengthOffset];
+  if ((0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true)) {
+    guides.push(dynamicMaxWidthLine - lengthOffset);
+  }
   if (!exclude.breakoutPoints) {
     guides.unshift(_editorSharedStyles.akEditorDefaultLayoutWidth + lengthOffset, _editorSharedStyles.akEditorCalculatedWideLayoutWidth + lengthOffset);
   }

package/dist/cjs/tablePlugin.js

@@ -105,6 +105,8 @@ var tablePlugin = function tablePlugin(_ref) {
       var sharedStateInternal = {
         isFullWidthModeEnabled: !!(options !== null && options !== void 0 && options.fullWidthEnabled),
         wasFullWidthModeEnabled: !!(options !== null && options !== void 0 && options.wasFullWidthEnabled),
+        isMaxWidthModeEnabled: !!(options !== null && options !== void 0 && options.maxWidthEnabled),
+        wasMaxWidthModeEnabled: !!(options !== null && options !== void 0 && options.wasMaxWidthEnabled),
         isHeaderRowEnabled: tablePluginState.isHeaderRowEnabled,
         isHeaderColumnEnabled: tablePluginState.isHeaderColumnEnabled,
         ordering: tablePluginState.ordering,
@@ -150,6 +152,7 @@ var tablePlugin = function tablePlugin(_ref) {
               isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
               isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
               isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
+              isMaxWidthModeEnabled: options === null || options === void 0 ? void 0 : options.maxWidthEnabled,
               isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
               isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
               isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing
@@ -160,6 +163,7 @@ var tablePlugin = function tablePlugin(_ref) {
               isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
               isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
               isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
+              isMaxWidthModeEnabled: options === null || options === void 0 ? void 0 : options.maxWidthEnabled,
               isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
               isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
               isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing
@@ -187,6 +191,7 @@ var tablePlugin = function tablePlugin(_ref) {
           isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
           isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
           isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
+          isMaxWidthModeEnabled: options === null || options === void 0 ? void 0 : options.maxWidthEnabled,
           isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
           isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
           isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing,
@@ -384,10 +389,10 @@ var tablePlugin = function tablePlugin(_ref) {
       }, {
         name: 'tableWidth',
         plugin: function plugin(_ref13) {
-          var _options$fullWidthEna, _options$isTableScali, _options$tableOptions3, _options$isCommentEdi;
+          var _options$fullWidthEna, _options$maxWidthEnab, _options$isTableScali, _options$tableOptions3, _options$isCommentEdi;
           var dispatchAnalyticsEvent = _ref13.dispatchAnalyticsEvent,
             dispatch = _ref13.dispatch;
-          return options !== null && options !== void 0 && options.tableOptions.allowTableResizing ? (0, _tableWidth.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$isTableScali = options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$tableOptions3 = options.tableOptions.allowTableResizing) !== null && _options$tableOptions3 !== void 0 ? _options$tableOptions3 : false, (_options$isCommentEdi = options.isCommentEditor) !== null && _options$isCommentEdi !== void 0 ? _options$isCommentEdi : false) : undefined;
+          return options !== null && options !== void 0 && options.tableOptions.allowTableResizing ? (0, _tableWidth.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$maxWidthEnab = options.maxWidthEnabled) !== null && _options$maxWidthEnab !== void 0 ? _options$maxWidthEnab : false, (_options$isTableScali = options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$tableOptions3 = options.tableOptions.allowTableResizing) !== null && _options$tableOptions3 !== void 0 ? _options$tableOptions3 : false, (_options$isCommentEdi = options.isCommentEditor) !== null && _options$isCommentEdi !== void 0 ? _options$isCommentEdi : false) : undefined;
         }
       }, {
         name: 'tableWidthInCommentFix',
@@ -539,6 +544,7 @@ var tablePlugin = function tablePlugin(_ref) {
               isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
               isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
               isFullWidthModeEnabled: tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled,
+              isMaxWidthModeEnabled: tableState === null || tableState === void 0 ? void 0 : tableState.isMaxWidthModeEnabled,
               isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
               isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
               isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing

package/dist/es2019/nodeviews/TableContainer.js

@@ -6,10 +6,11 @@ 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 { 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';
-import { TABLE_MAX_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR } from '../pm-plugins/table-resizing/utils/consts';
+import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR } from '../pm-plugins/table-resizing/utils/consts';
 import { getTableResizerContainerMaxWidthInCSS, getTableResizerContainerForFullPageWidthInCSS } from '../pm-plugins/table-resizing/utils/misc';
 import { ALIGN_CENTER, ALIGN_START } from '../pm-plugins/utils/alignment';
 import { TableCssClassName as ClassName } from '../types';
@@ -253,7 +254,7 @@ export const ResizableTableContainer = /*#__PURE__*/React.memo(({
 
     // Ensure minimum width for usability while respecting container constraints
     const width = Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300));
-    const maxResizerWidth = isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, TABLE_MAX_WIDTH);
+    const maxResizerWidth = isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH);
     return {
       width,
       maxResizerWidth

package/dist/es2019/nodeviews/TableResizer.js

@@ -21,7 +21,7 @@ import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plu
 import { updateWidthToWidest } from '../pm-plugins/commands/misc';
 import { META_KEYS } from '../pm-plugins/table-analytics';
 import { getColgroupChildrenLength } from '../pm-plugins/table-resizing/utils/colgroup';
-import { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR } from '../pm-plugins/table-resizing/utils/consts';
+import { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_FULL_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR } from '../pm-plugins/table-resizing/utils/consts';
 import { previewScaleTable, scaleTable } from '../pm-plugins/table-resizing/utils/scale-table';
 import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
 import { ALIGN_CENTER, ALIGN_START, normaliseAlignment, shouldChangeAlignmentToCenterResized } from '../pm-plugins/utils/alignment';
@@ -299,8 +299,8 @@ export const TableResizer = ({
     } = editorView;
     const currentTableNodeLocalId = (_node$attrs$localId = node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) !== null && _node$attrs$localId !== void 0 ? _node$attrs$localId : '';
     const fullWidthGuideline = defaultGuidelinesForPreserveTable(PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig).filter(guideline => guideline.isFullWidth)[0];
-    const isFullWidthGuidelineActive = closestSnap && closestSnap.keys.includes(fullWidthGuideline.key);
-    const tableMaxWidth = isCommentEditor ? Math.floor(containerWidth - TABLE_OFFSET_IN_COMMENT_EDITOR) : TABLE_MAX_WIDTH;
+    const isFullWidthGuidelineActive = expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? closestSnap && fullWidthGuideline && closestSnap.keys.includes(fullWidthGuideline.key) : closestSnap && closestSnap.keys.includes(fullWidthGuideline.key);
+    const tableMaxWidth = isCommentEditor ? Math.floor(containerWidth - TABLE_OFFSET_IN_COMMENT_EDITOR) : expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH;
     const shouldUpdateWidthToWidest = isCommentEditor ? tableMaxWidth <= newWidth : !!isTableScalingEnabled && isFullWidthGuidelineActive;
     const previewParentWidth = isCommentEditor && shouldUpdateWidthToWidest ? tableMaxWidth : newWidth;
     previewScaleTable(tableRef, {
@@ -330,7 +330,7 @@ export const TableResizer = ({
     const pos = getPos();
     const currentTableNodeLocalId = (_node$attrs$localId2 = node === null || node === void 0 ? void 0 : (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.localId) !== null && _node$attrs$localId2 !== void 0 ? _node$attrs$localId2 : '';
     const tableMaxWidth = isCommentEditor ? undefined // Table's full-width in comment appearance inherit the width of the Editor/Renderer
-    : TABLE_MAX_WIDTH;
+    : expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH;
     newWidth = widthToWidest && currentTableNodeLocalId && widthToWidest[currentTableNodeLocalId] ? tableMaxWidth : newWidth;
     let tr = state.tr.setMeta(tableWidthPluginKey, {
       resizing: false,

package/dist/es2019/nodeviews/toDOM.js

@@ -3,7 +3,7 @@ import { table, tableWithNestedTable } from '@atlaskit/adf-schema';
 import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { generateColgroupFromNode, getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
-import { TABLE_MAX_WIDTH } from '../pm-plugins/table-resizing/utils/consts';
+import { TABLE_MAX_WIDTH, TABLE_FULL_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';
 export const tableNodeSpecWithFixedToDOM = config => {
@@ -103,7 +103,7 @@ export const tableNodeSpecWithFixedToDOM = config => {
           position: 'relative',
           userSelect: 'auto',
           boxSizing: 'border-box',
-          '--ak-editor-table-max-width': `${TABLE_MAX_WIDTH}px`,
+          '--ak-editor-table-max-width': `${expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH}px`,
           '--ak-editor-table-min-width': `${tableMinWidth}px`,
           minWidth: 'var(--ak-editor-table-min-width)',
           maxWidth: getTableResizerContainerMaxWidthInCSS(config.isCommentEditor, config.isChromelessEditor, config.isTableScalingEnabled),

package/dist/es2019/pm-plugins/commands/insert.js

@@ -130,11 +130,12 @@ export const insertRow = (row, moveCursorToTheNewRow) => (state, dispatch) => {
  * @deprecated This function is deprecated - please use insertTableWithNestingSupport instead.
  * (To be removed with feature gate: `platform_editor_use_nested_table_pm_nodes`)
  */
-export const createTable = (isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled) => (state, dispatch) => {
+export const createTable = (isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, isMaxWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled) => (state, dispatch) => {
   const table = createTableWithWidth({
     isTableScalingEnabled,
     isTableAlignmentEnabled,
     isFullWidthModeEnabled,
+    isMaxWidthModeEnabled,
     isCommentEditor,
     isChromelessEditor,
     isTableResizingEnabled
@@ -162,13 +163,14 @@ export const createTable = (isTableScalingEnabled, isTableAlignmentEnabled, isFu
  * @deprecated This function is deprecated - please use insertTableWithNestingSupport instead.
  * (To be removed with feature gate: `platform_editor_use_nested_table_pm_nodes`)
  */
-export const insertTableWithSize = (isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor) => (rowsCount, colsCount, inputMethod) => {
+export const insertTableWithSize = (isFullWidthModeEnabled, isMaxWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor) => (rowsCount, colsCount, inputMethod) => {
   return ({
     tr
   }) => {
     const tableNode = createTableWithWidth({
       isTableScalingEnabled,
       isFullWidthModeEnabled,
+      isMaxWidthModeEnabled,
       isTableAlignmentEnabled,
       isCommentEditor,
       isChromelessEditor,
@@ -215,6 +217,7 @@ export const insertTableWithNestingSupport = ({
   isTableScalingEnabled = false,
   isTableAlignmentEnabled = false,
   isFullWidthModeEnabled = false,
+  isMaxWidthModeEnabled = false,
   isCommentEditor = false,
   isChromelessEditor = false,
   isTableResizingEnabled = false,
@@ -249,6 +252,7 @@ export const insertTableWithNestingSupport = ({
     isTableScalingEnabled,
     isTableAlignmentEnabled,
     isFullWidthModeEnabled,
+    isMaxWidthModeEnabled,
     isCommentEditor,
     isChromelessEditor,
     isTableResizingEnabled,

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

@@ -1,5 +1,7 @@
 export const COLUMN_MIN_WIDTH = 48;
-export const TABLE_MAX_WIDTH = 1800;
+// Remove TABLE_MAX_WIDTH_OLD when cleaning up editor_tinymce_full_width_mode experiment
+export const TABLE_FULL_WIDTH = 1800;
+export const TABLE_MAX_WIDTH = 4000;
 export const FULL_WIDTH_EDITOR_CONTENT_WIDTH = 1800;
 export const MAX_SCALING_PERCENT = 0.3;
 export const MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION = 0.4;

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

@@ -2,9 +2,10 @@ import { getParentNodeWidth, getTableContainerWidth, layoutToWidth } from '@atla
 import { calcTableWidth } from '@atlaskit/editor-common/styles';
 import { calcTableColumnWidths } from '@atlaskit/editor-common/utils';
 import { akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorTableNumberColumnWidth, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { hasTableBeenResized, hasTableColumnBeenResized } from './colgroup';
-import { MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION, TABLE_MAX_WIDTH } from './consts';
+import { MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION, TABLE_MAX_WIDTH, TABLE_FULL_WIDTH } from './consts';
 
 // Translates named layouts in number values.
 export function getLayoutSize(tableLayout, containerWidth = 0, options) {
@@ -97,7 +98,7 @@ export const getTableContainerElementWidth = table => {
  * @returns The CSS max-width value
  */
 export const getTableResizerContainerMaxWidthInCSS = (isCommentEditor, isChromelessEditor, isTableScalingEnabled) => {
-  const maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? `min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ${TABLE_MAX_WIDTH}px)` : `min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2) - var(--ak-editor--resizer-handle-spacing)), ${TABLE_MAX_WIDTH}px)`;
+  const maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? `min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ${expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH}px)` : `min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2) - var(--ak-editor--resizer-handle-spacing)), ${expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH}px)`;
   return isCommentEditor || isChromelessEditor ? '100%' : maxResizerWidthForNonCommentEditor;
 };
 

package/dist/es2019/pm-plugins/table-width.js

@@ -8,11 +8,12 @@ import { SetAttrsStep } from '@atlaskit/adf-schema/steps';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { isReplaceDocOperation } from '@atlaskit/editor-common/utils/document';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorWideLayoutWidth } from '@atlaskit/editor-shared-styles';
-import { TABLE_MAX_WIDTH } from './table-resizing/utils/consts';
+import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorMaxWidthLayoutWidth, akEditorWideLayoutWidth } from '@atlaskit/editor-shared-styles';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH } from './table-resizing/utils/consts';
 import { ALIGN_START } from './utils/alignment';
 export const pluginKey = new PluginKey('tableWidthPlugin');
-const createPlugin = (dispatch, dispatchAnalyticsEvent, fullWidthEnabled, isTableScalingEnabled, isTableAlignmentEnabled, isCommentEditor) => {
+const createPlugin = (dispatch, dispatchAnalyticsEvent, fullWidthEnabled, maxWidthEnabled, isTableScalingEnabled, isTableAlignmentEnabled, isCommentEditor) => {
   return new SafePlugin({
     key: pluginKey,
     state: {
@@ -65,7 +66,9 @@ const createPlugin = (dispatch, dispatchAnalyticsEvent, fullWidthEnabled, isTabl
             const layout = node.attrs.layout;
             if (!width && layout) {
               let tableWidthCal;
-              if (fullWidthEnabled) {
+              if (maxWidthEnabled) {
+                tableWidthCal = akEditorMaxWidthLayoutWidth;
+              } else if (fullWidthEnabled) {
                 tableWidthCal = akEditorFullWidthLayoutWidth;
               } else {
                 switch (layout) {
@@ -101,8 +104,8 @@ const createPlugin = (dispatch, dispatchAnalyticsEvent, fullWidthEnabled, isTabl
           step.getMap().forEach((_, __, newStart, newEnd) => {
             newState.doc.nodesBetween(newStart, newEnd, (node, pos) => {
               if (node.type === table) {
-                if (shouldPatchTableWidth && node.attrs.width !== TABLE_MAX_WIDTH) {
-                  tr.setNodeAttribute(pos, 'width', TABLE_MAX_WIDTH);
+                if (shouldPatchTableWidth && node.attrs.width !== expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH) {
+                  tr.setNodeAttribute(pos, 'width', expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) ? TABLE_MAX_WIDTH : TABLE_FULL_WIDTH);
                 }
                 if (shouldPatchTableAlignment) {
                   tr.setNodeAttribute(pos, 'layout', ALIGN_START);

package/dist/es2019/pm-plugins/utils/create.js

@@ -1,11 +1,13 @@
 import { createTable } from '@atlaskit/editor-tables/utils';
-import { TABLE_MAX_WIDTH } from '../table-resizing/utils/consts';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH } from '../table-resizing/utils/consts';
 const NESTED_TABLE_DEFAULT_ROWS = 2;
 const NESTED_TABLE_DEFAULT_COLS = 2;
 export const createTableWithWidth = ({
   isTableScalingEnabled,
   isTableAlignmentEnabled,
   isFullWidthModeEnabled,
+  isMaxWidthModeEnabled,
   isCommentEditor,
   isChromelessEditor,
   isTableResizingEnabled,
@@ -17,10 +19,14 @@ export const createTableWithWidth = ({
     attrsOverrides.rowsCount = createTableProps !== null && createTableProps !== void 0 && createTableProps.rowsCount ? createTableProps === null || createTableProps === void 0 ? void 0 : createTableProps.rowsCount : NESTED_TABLE_DEFAULT_ROWS;
     attrsOverrides.colsCount = createTableProps !== null && createTableProps !== void 0 && createTableProps.colsCount ? createTableProps === null || createTableProps === void 0 ? void 0 : createTableProps.colsCount : NESTED_TABLE_DEFAULT_COLS;
   }
-  if (isTableScalingEnabled && isFullWidthModeEnabled && !isCommentEditor) {
-    attrsOverrides.tableWidth = TABLE_MAX_WIDTH;
+  if (isTableScalingEnabled && !isCommentEditor) {
+    if (expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) && isMaxWidthModeEnabled) {
+      attrsOverrides.tableWidth = TABLE_MAX_WIDTH;
+    } else if (isFullWidthModeEnabled) {
+      attrsOverrides.tableWidth = TABLE_FULL_WIDTH;
+    }
   }
-  if (isTableAlignmentEnabled && (isFullWidthModeEnabled || isCommentEditor)) {
+  if (isTableAlignmentEnabled && (isFullWidthModeEnabled || expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) && isMaxWidthModeEnabled || isCommentEditor)) {
     attrsOverrides.layout = 'align-start';
   }
   if (isCommentEditor && isTableResizingEnabled || isChromelessEditor) {

package/dist/es2019/pm-plugins/utils/snapping.js

@@ -1,23 +1,28 @@
 import { isVerticalPosition } from '@atlaskit/editor-common/guideline';
-import { akEditorCalculatedWideLayoutWidth, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
+import { akEditorCalculatedWideLayoutWidth, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMaxWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 const numberOfLanesInDefaultLayoutWidth = 12;
 const calculateSubSnappingWidths = (totalLanes, totalWidth) => new Array(Math.round(totalLanes / 2) - 1).fill(totalWidth / totalLanes).map((v, i) => v * (i + 1) * 2);
 export const calculateDefaultSnappings = (lengthOffset = 0) => [...calculateSubSnappingWidths(numberOfLanesInDefaultLayoutWidth, akEditorDefaultLayoutWidth + lengthOffset), akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset, akEditorFullWidthLayoutWidth + lengthOffset];
-const getPadding = editorContainerWith => {
-  return editorContainerWith <= akEditorFullPageNarrowBreakout && editorExperiment('platform_editor_preview_panel_responsiveness', true, {
+const getPadding = editorContainerWidth => {
+  return editorContainerWidth <= akEditorFullPageNarrowBreakout && editorExperiment('platform_editor_preview_panel_responsiveness', true, {
     exposure: true
   }) ? akEditorGutterPaddingReduced : akEditorGutterPaddingDynamic();
 };
 
 // FF TablePreserve for calculateDefaultSnappings
-export const calculateDefaultTablePreserveSnappings = (lengthOffset = 0, editorContainerWith = akEditorFullWidthLayoutWidth, exclude = {
+export const calculateDefaultTablePreserveSnappings = (lengthOffset = 0, editorContainerWidth = akEditorFullWidthLayoutWidth, exclude = {
   innerGuidelines: false,
   breakoutPoints: false
 }) => {
-  const padding = getPadding(editorContainerWith);
-  const dynamicFullWidthLine = editorContainerWith - padding * 2 >= akEditorFullWidthLayoutWidth ? akEditorFullWidthLayoutWidth : editorContainerWith - padding * 2;
+  const padding = getPadding(editorContainerWidth);
+  const dynamicFullWidthLine = editorContainerWidth - padding * 2 >= akEditorFullWidthLayoutWidth ? akEditorFullWidthLayoutWidth : editorContainerWidth - padding * 2;
+  const dynamicMaxWidthLine = editorContainerWidth - padding * 2 >= akEditorMaxWidthLayoutWidth ? akEditorMaxWidthLayoutWidth : editorContainerWidth - padding * 2;
   const guides = [dynamicFullWidthLine - lengthOffset];
+  if (expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true)) {
+    guides.push(dynamicMaxWidthLine - lengthOffset);
+  }
   if (!exclude.breakoutPoints) {
     guides.unshift(akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset);
   }