@atlaskit/editor-plugin-table 7.21.2 → 7.21.4

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/editor-plugin-table
 
+## 7.21.4
+
+### Patch Changes
+
+- [#122264](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/122264)
+  [`257d7e96264e0`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/257d7e96264e0) -
+  [ux] Fix table column delete decorations showing when expected in React 18.
+
+## 7.21.3
+
+### Patch Changes
+
+- [`3b20c735bc9ee`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3b20c735bc9ee) -
+  [ux] Insert full-width table in comment editor when table resizing is enabled.
+
 ## 7.21.2
 
 ### Patch Changes

package/dist/cjs/commands/insert.js

@@ -150,12 +150,14 @@ var insertRow = exports.insertRow = function insertRow(row, moveCursorToTheNewRo
     return true;
   };
 };
-var createTable = exports.createTable = function createTable(isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI) {
+var createTable = exports.createTable = function createTable(isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isTableResizingEnabled) {
   return function (state, dispatch) {
     var table = (0, _utils3.createTableWithWidth)({
       isTableScalingEnabled: isTableScalingEnabled,
       isTableAlignmentEnabled: isTableAlignmentEnabled,
-      isFullWidthModeEnabled: isFullWidthModeEnabled
+      isFullWidthModeEnabled: isFullWidthModeEnabled,
+      isCommentEditor: isCommentEditor,
+      isTableResizingEnabled: isTableResizingEnabled
     })(state.schema);
     if (dispatch) {
       var tr = (0, _utils.safeInsert)(table)(state.tr).scrollIntoView();
@@ -175,7 +177,7 @@ var createTable = exports.createTable = function createTable(isTableScalingEnabl
     return true;
   };
 };
-var insertTableWithSize = exports.insertTableWithSize = function insertTableWithSize(isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI) {
+var insertTableWithSize = exports.insertTableWithSize = function insertTableWithSize(isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor) {
   return function (rowsCount, colsCount, inputMethod) {
     return function (_ref) {
       var tr = _ref.tr;
@@ -183,6 +185,7 @@ var insertTableWithSize = exports.insertTableWithSize = function insertTableWith
         isTableScalingEnabled: isTableScalingEnabled,
         isFullWidthModeEnabled: isFullWidthModeEnabled,
         isTableAlignmentEnabled: isTableAlignmentEnabled,
+        isCommentEditor: isCommentEditor,
         createTableProps: {
           rowsCount: rowsCount,
           colsCount: colsCount

package/dist/cjs/nodeviews/TableComponent.js

@@ -28,6 +28,7 @@ var _utils2 = require("@atlaskit/editor-tables/utils");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _combine = require("@atlaskit/pragmatic-drag-and-drop/combine");
 var _commands = require("../commands");
+var _eventHandlers = require("../event-handlers");
 var _utils3 = require("../pm-plugins/drag-and-drop/utils");
 var _pluginFactory = require("../pm-plugins/plugin-factory");
 var _stickyHeaders = require("../pm-plugins/sticky-headers");
@@ -74,6 +75,12 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       scroll: 0,
       parentWidth: undefined
     }, (0, _defineProperty3.default)(_defineProperty2, _types.ShadowEvent.SHOW_BEFORE_SHADOW, false), (0, _defineProperty3.default)(_defineProperty2, _types.ShadowEvent.SHOW_AFTER_SHADOW, false), (0, _defineProperty3.default)(_defineProperty2, "tableWrapperWidth", undefined), (0, _defineProperty3.default)(_defineProperty2, "tableWrapperHeight", undefined), _defineProperty2));
+    (0, _defineProperty3.default)((0, _assertThisInitialized2.default)(_this), "handleMouseOut", function (event) {
+      if (!(0, _eventHandlers.isTableInFocus)(_this.props.view)) {
+        return false;
+      }
+      return (0, _eventHandlers.handleMouseOut)(_this.props.view, event);
+    });
     (0, _defineProperty3.default)((0, _assertThisInitialized2.default)(_this), "handleMouseEnter", function () {
       var node = _this.props.getNode();
       var pos = _this.props.getPos();
@@ -355,7 +362,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         getNode = _this$props7.getNode,
         getEditorFeatureFlags = _this$props7.getEditorFeatureFlags,
         isTableScalingEnabled = _this$props7.isTableScalingEnabled;
-      if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.live-pages-sorting_4malx')) {
+      if ((0, _platformFeatureFlags.fg)('platform.editor.table.live-pages-sorting_4malx')) {
         var _this$props$pluginInj;
         var _ref = ((_this$props$pluginInj = this.props.pluginInjectionApi) === null || _this$props$pluginInj === void 0 || (_this$props$pluginInj = _this$props$pluginInj.editorViewMode) === null || _this$props$pluginInj === void 0 ? void 0 : _this$props$pluginInj.sharedState.currentState()) || {},
           mode = _ref.mode;
@@ -364,6 +371,10 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           this === null || this === void 0 || (_this$table = this.table) === null || _this$table === void 0 || _this$table.addEventListener('mouseenter', this.handleMouseEnter);
         }
       }
+      if ((0, _platformFeatureFlags.fg)('editor_react_18_fix_table_delete_col_decorations')) {
+        var _this$table2;
+        this === null || this === void 0 || (_this$table2 = this.table) === null || _this$table2 === void 0 || _this$table2.addEventListener('mouseout', this.handleMouseOut);
+      }
       var _getEditorFeatureFlag = getEditorFeatureFlags(),
         _getEditorFeatureFlag2 = _getEditorFeatureFlag.tableWithFixedColumnWidthsOption,
         tableWithFixedColumnWidthsOption = _getEditorFeatureFlag2 === void 0 ? false : _getEditorFeatureFlag2,
@@ -444,9 +455,13 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       if (!(options !== null && options !== void 0 && options.isTableResizingEnabled) && allowColumnResizing) {
         window.removeEventListener('resize', this.handleWindowResizeDebounced);
       }
-      if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.live-pages-sorting_4malx')) {
-        var _this$table2;
-        this === null || this === void 0 || (_this$table2 = this.table) === null || _this$table2 === void 0 || _this$table2.removeEventListener('mouseenter', this.handleMouseEnter);
+      if ((0, _platformFeatureFlags.fg)('platform.editor.table.live-pages-sorting_4malx')) {
+        var _this$table3;
+        this === null || this === void 0 || (_this$table3 = this.table) === null || _this$table3 === void 0 || _this$table3.removeEventListener('mouseenter', this.handleMouseEnter);
+      }
+      if ((0, _platformFeatureFlags.fg)('editor_react_18_fix_table_delete_col_decorations')) {
+        var _this$table4;
+        this === null || this === void 0 || (_this$table4 = this.table) === null || _this$table4 === void 0 || _this$table4.removeEventListener('mouseout', this.handleMouseOut);
       }
       if (this.overflowShadowsObserver) {
         this.overflowShadowsObserver.dispose();
@@ -502,7 +517,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           _getEditorFeatureFlag5 = _getEditorFeatureFlag4.tableWithFixedColumnWidthsOption,
           tableWithFixedColumnWidthsOption = _getEditorFeatureFlag5 === void 0 ? false : _getEditorFeatureFlag5;
         var isTableScalingWithFixedColumnWidthsOptionEnabled = ((_this$props$options = this.props.options) === null || _this$props$options === void 0 ? void 0 : _this$props$options.isTableScalingEnabled) && tableWithFixedColumnWidthsOption;
-        var shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && (0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.use-increased-scaling-percent') || false;
+        var shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && (0, _platformFeatureFlags.fg)('platform.editor.table.use-increased-scaling-percent') || false;
         if (force || !isResizing && shouldUpdateColgroup) {
           var _this$props$options2;
           var resizeState = (0, _utils4.getResizeState)({
@@ -550,7 +565,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         getEditorFeatureFlags = _this$props10.getEditorFeatureFlags;
       var isInDanger = this.props.isInDanger;
       var table = (0, _utils2.findTable)(view.state.selection);
-      if (!(0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.use-shared-state-hook')) {
+      if (!(0, _platformFeatureFlags.fg)('platform.editor.table.use-shared-state-hook')) {
         var pluginState = (0, _pluginFactory.getPluginState)(view.state);
         isInDanger = pluginState.isInDanger;
       }
@@ -564,7 +579,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         shouldHandleColgroupUpdates = true;
       }
       var isTableScalingWithFixedColumnWidthsOptionEnabled = isTableScalingEnabled && tableWithFixedColumnWidthsOption;
-      var shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && (0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.use-increased-scaling-percent');
+      var shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && (0, _platformFeatureFlags.fg)('platform.editor.table.use-increased-scaling-percent');
       if (isTableScalingWithFixedColumnWidthsOptionEnabled && getNode().attrs.displayMode !== 'fixed') {
         shouldScale = true;
         shouldHandleColgroupUpdates = true;
@@ -688,7 +703,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         showBeforeShadow = _this$state3.showBeforeShadow,
         showAfterShadow = _this$state3.showAfterShadow;
       var node = getNode();
-      if (!(0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.use-shared-state-hook')) {
+      if (!(0, _platformFeatureFlags.fg)('platform.editor.table.use-shared-state-hook')) {
         var pluginState = (0, _pluginFactory.getPluginState)(view.state);
         isInDanger = pluginState.isInDanger;
         hoveredRows = pluginState.hoveredRows;
@@ -775,7 +790,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         stickyScrollbar = _getEditorFeatureFlag8.stickyScrollbar,
         _getEditorFeatureFlag9 = _getEditorFeatureFlag8.tableWithFixedColumnWidthsOption,
         tableWithFixedColumnWidthsOption = _getEditorFeatureFlag9 === void 0 ? false : _getEditorFeatureFlag9;
-      var shouldUseIncreasedScalingPercent = isTableScalingEnabled && tableWithFixedColumnWidthsOption && (0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.use-increased-scaling-percent');
+      var shouldUseIncreasedScalingPercent = isTableScalingEnabled && tableWithFixedColumnWidthsOption && (0, _platformFeatureFlags.fg)('platform.editor.table.use-increased-scaling-percent');
       return /*#__PURE__*/_react.default.createElement(_TableContainer.TableContainer
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       , {
@@ -794,7 +809,8 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         isTableWithFixedColumnWidthsOptionEnabled: tableWithFixedColumnWidthsOption,
         isWholeTableInDanger: isWholeTableInDanger,
         isTableAlignmentEnabled: isTableAlignmentEnabled,
-        shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent
+        shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent,
+        isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor
       }, /*#__PURE__*/_react.default.createElement("div", {
         // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: _types.TableCssClassName.TABLE_STICKY_SENTINEL_TOP,

package/dist/cjs/nodeviews/TableContainer.js

@@ -128,7 +128,8 @@ var ResizableTableContainer = exports.ResizableTableContainer = /*#__PURE__*/_re
     isTableScalingEnabled = _ref4.isTableScalingEnabled,
     isTableWithFixedColumnWidthsOptionEnabled = _ref4.isTableWithFixedColumnWidthsOptionEnabled,
     isTableAlignmentEnabled = _ref4.isTableAlignmentEnabled,
-    shouldUseIncreasedScalingPercent = _ref4.shouldUseIncreasedScalingPercent;
+    shouldUseIncreasedScalingPercent = _ref4.shouldUseIncreasedScalingPercent,
+    isCommentEditor = _ref4.isCommentEditor;
   var containerRef = (0, _react.useRef)(null);
   var tableWidthRef = (0, _react.useRef)(_editorSharedStyles.akEditorDefaultLayoutWidth);
   var _useState = (0, _react.useState)(false),
@@ -211,13 +212,13 @@ var ResizableTableContainer = exports.ResizableTableContainer = /*#__PURE__*/_re
     // 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 - (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() * 2 : containerWidth - (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() * 2 - resizeHandleSpacing;
+    responsiveContainerWidth = isTableScalingEnabled ? containerWidth - (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() * 2 : containerWidth - (0, _editorSharedStyles.akEditorGutterPaddingDynamic)() * 2 - (isCommentEditor ? 0 : resizeHandleSpacing);
   }
-  var width = Math.min(tableWidth, responsiveContainerWidth);
+  var width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
   if (!isResizing) {
     tableWidthRef.current = width;
   }
-  var maxResizerWidth = Math.min(responsiveContainerWidth, _utils.TABLE_MAX_WIDTH);
+  var maxResizerWidth = isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, _utils.TABLE_MAX_WIDTH);
   var tableResizerProps = {
     width: width,
     maxWidth: maxResizerWidth,
@@ -292,7 +293,8 @@ var TableContainer = exports.TableContainer = function TableContainer(_ref6) {
     isTableScalingEnabled = _ref6.isTableScalingEnabled,
     isTableWithFixedColumnWidthsOptionEnabled = _ref6.isTableWithFixedColumnWidthsOptionEnabled,
     isTableAlignmentEnabled = _ref6.isTableAlignmentEnabled,
-    shouldUseIncreasedScalingPercent = _ref6.shouldUseIncreasedScalingPercent;
+    shouldUseIncreasedScalingPercent = _ref6.shouldUseIncreasedScalingPercent,
+    isCommentEditor = _ref6.isCommentEditor;
   if (isTableResizingEnabled && !isNested) {
     return /*#__PURE__*/_react.default.createElement(ResizableTableContainer
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -311,7 +313,8 @@ var TableContainer = exports.TableContainer = function TableContainer(_ref6) {
       isTableWithFixedColumnWidthsOptionEnabled: isTableWithFixedColumnWidthsOptionEnabled,
       isWholeTableInDanger: isWholeTableInDanger,
       isTableAlignmentEnabled: isTableAlignmentEnabled,
-      shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent
+      shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent,
+      isCommentEditor: isCommentEditor
     }, children);
   }
   return /*#__PURE__*/_react.default.createElement(InnerContainer, {

package/dist/cjs/nodeviews/lazy-node-views.js

@@ -16,7 +16,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 var lazyTableView = exports.lazyTableView = function lazyTableView(options) {
   if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
     return function (node, view, getPos) {
-      return (0, _table.createTableView)(node, view, getPos, options.portalProviderAPI, options.eventDispatcher, options.getEditorContainerWidth, options.getEditorFeatureFlags, options.dispatchAnalyticsEvent, options.pluginInjectionApi, options.isTableAlignmentEnabled);
+      return (0, _table.createTableView)(node, view, getPos, options.portalProviderAPI, options.eventDispatcher, options.getEditorContainerWidth, options.getEditorFeatureFlags, options.dispatchAnalyticsEvent, options.pluginInjectionApi, options.isTableAlignmentEnabled, options.isCommentEditor);
     };
   }
   var loader = function loader() {
@@ -33,8 +33,9 @@ var lazyTableView = exports.lazyTableView = function lazyTableView(options) {
           getEditorFeatureFlags = _getNodeViewOptions.getEditorFeatureFlags,
           dispatchAnalyticsEvent = _getNodeViewOptions.dispatchAnalyticsEvent,
           pluginInjectionApi = _getNodeViewOptions.pluginInjectionApi,
-          isTableAlignmentEnabled = _getNodeViewOptions.isTableAlignmentEnabled;
-        return createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isTableAlignmentEnabled);
+          isTableAlignmentEnabled = _getNodeViewOptions.isTableAlignmentEnabled,
+          isCommentEditor = _getNodeViewOptions.isCommentEditor;
+        return createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isTableAlignmentEnabled, isCommentEditor);
       };
     });
     return result;

package/dist/cjs/nodeviews/table.js

@@ -41,11 +41,15 @@ var tableAttributes = function tableAttributes(node) {
     'data-layout': node.attrs.layout,
     'data-autosize': node.attrs.__autoSize,
     'data-table-local-id': node.attrs.localId || '',
-    'data-table-width': node.attrs.width,
+    'data-table-width': node.attrs.width || 'inherit',
     'data-table-display-mode': node.attrs.displayMode
   };
 };
 var getInlineWidth = function getInlineWidth(node, options, state, pos) {
+  if (!node.attrs.width && options !== null && options !== void 0 && options.isCommentEditor && options !== null && options !== void 0 && options.isTableResizingEnabled) {
+    return;
+  }
+
   // provide a width for tables when custom table width is supported
   // this is to ensure 'responsive' tables (colgroup widths are undefined) become fixed to
   // support screen size adjustments
@@ -286,7 +290,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
   }]);
   return TableView;
 }(_reactNodeView.default);
-var createTableView = exports.createTableView = function createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isTableAlignmentEnabled) {
+var createTableView = exports.createTableView = function createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isTableAlignmentEnabled, isCommentEditor) {
   var _getPluginState2 = (0, _pluginFactory.getPluginState)(view.state),
     pluginConfig = _getPluginState2.pluginConfig,
     isFullWidthModeEnabled = _getPluginState2.isFullWidthModeEnabled,
@@ -312,7 +316,8 @@ var createTableView = exports.createTableView = function createTableView(node, v
       isDragAndDropEnabled: isDragAndDropEnabled,
       isTableScalingEnabled: isTableScalingEnabled,
       // same as options.isTableScalingEnabled
-      isTableAlignmentEnabled: isTableAlignmentEnabled
+      isTableAlignmentEnabled: isTableAlignmentEnabled,
+      isCommentEditor: isCommentEditor
     },
     getEditorContainerWidth: getEditorContainerWidth,
     getEditorFeatureFlags: getEditorFeatureFlags,

package/dist/cjs/plugin.js

@@ -148,7 +148,9 @@ var tablesPlugin = function tablesPlugin(_ref) {
           var node = (0, _utils2.createTableWithWidth)({
             isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
             isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled,
-            isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled
+            isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
+            isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
+            isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableResizingEnabled
           })(state.schema);
           return (_api$contentInsertion = api === null || api === void 0 || (_api$contentInsertion2 = api.contentInsertion) === null || _api$contentInsertion2 === void 0 || (_api$contentInsertion2 = _api$contentInsertion2.actions) === null || _api$contentInsertion2 === void 0 ? void 0 : _api$contentInsertion2.insert({
             state: state,
@@ -201,8 +203,9 @@ var tablesPlugin = function tablesPlugin(_ref) {
             getEditorFeatureFlags = _ref3.getEditorFeatureFlags,
             dragAndDropEnabled = _ref3.dragAndDropEnabled,
             isTableScalingEnabled = _ref3.isTableScalingEnabled,
-            isTableAlignmentEnabled = _ref3.isTableAlignmentEnabled;
-          return (0, _main.createPlugin)(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, (0, _createPluginConfig.pluginConfig)(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent);
+            isTableAlignmentEnabled = _ref3.isTableAlignmentEnabled,
+            isCommentEditor = _ref3.isCommentEditor;
+          return (0, _main.createPlugin)(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, (0, _createPluginConfig.pluginConfig)(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent, isCommentEditor);
         }
       }, {
         name: 'tablePMColResizing',
@@ -240,8 +243,12 @@ var tablesPlugin = function tablesPlugin(_ref) {
             _ref7$isTableAlignmen = _ref7.isTableAlignmentEnabled,
             isTableAlignmentEnabled = _ref7$isTableAlignmen === void 0 ? false : _ref7$isTableAlignmen,
             _ref7$fullWidthEnable = _ref7.fullWidthEnabled,
-            fullWidthEnabled = _ref7$fullWidthEnable === void 0 ? false : _ref7$fullWidthEnable;
-          return (0, _keymap.keymapPlugin)(defaultGetEditorContainerWidth, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled, isTableAlignmentEnabled, fullWidthEnabled, api, getIntl, isCellBackgroundDuplicated, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent);
+            fullWidthEnabled = _ref7$fullWidthEnable === void 0 ? false : _ref7$fullWidthEnable,
+            _ref7$isCommentEditor = _ref7.isCommentEditor,
+            isCommentEditor = _ref7$isCommentEditor === void 0 ? false : _ref7$isCommentEditor,
+            _ref7$tableResizingEn = _ref7.tableResizingEnabled,
+            tableResizingEnabled = _ref7$tableResizingEn === void 0 ? false : _ref7$tableResizingEn;
+          return (0, _keymap.keymapPlugin)(defaultGetEditorContainerWidth, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled, isTableAlignmentEnabled, fullWidthEnabled, api, getIntl, isCellBackgroundDuplicated, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, tableResizingEnabled);
         }
       }, {
         name: 'tableSelectionKeymap',
@@ -303,7 +310,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
           var _options$fullWidthEna, _options$isTableScali, _options$isTableAlign;
           var dispatchAnalyticsEvent = _ref14.dispatchAnalyticsEvent,
             dispatch = _ref14.dispatch;
-          return options !== null && options !== void 0 && options.tableResizingEnabled ? (0, _tableWidth.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options === null || options === void 0 ? void 0 : options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$isTableScali = options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$isTableAlign = options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled) !== null && _options$isTableAlign !== void 0 ? _options$isTableAlign : false) : undefined;
+          return options !== null && options !== void 0 && options.tableResizingEnabled && !(options !== null && options !== void 0 && options.isCommentEditor) ? (0, _tableWidth.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options === null || options === void 0 ? void 0 : options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$isTableScali = options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$isTableAlign = options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled) !== null && _options$isTableAlign !== void 0 ? _options$isTableAlign : false) : undefined;
         }
       },
       // TODO: should be deprecated and eventually replaced with 'tableAnalyticsPlugin'
@@ -498,7 +505,9 @@ var tablesPlugin = function tablesPlugin(_ref) {
             var tableNode = (0, _utils2.createTableWithWidth)({
               isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
               isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled,
-              isFullWidthModeEnabled: tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled
+              isFullWidthModeEnabled: tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled,
+              isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
+              isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableResizingEnabled
             })(state.schema);
             var tr = insert(tableNode);
             editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({

package/dist/cjs/pm-plugins/keymap.js

@@ -25,11 +25,13 @@ function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, dragAndDropEn
   var isCellBackgroundDuplicated = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
   var isTableFixedColumnWidthsOptionEnabled = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
   var shouldUseIncreasedScalingPercent = arguments.length > 10 ? arguments[10] : undefined;
+  var isCommentEditor = arguments.length > 11 ? arguments[11] : undefined;
+  var isTableResizingEnabled = arguments.length > 12 ? arguments[12] : undefined;
   var list = {};
   var ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.nextCell.common, (0, _commands2.goToNextCell)(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(1), list);
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.previousCell.common, (0, _commands2.goToNextCell)(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(-1), list);
-  (0, _keymaps.bindKeymapWithCommand)(_keymaps.toggleTable.common, (0, _insert.createTable)(isTableScalingEnabled, isTableAlignmentEnabled, !!isFullWidthEnabled, editorAnalyticsAPI), list);
+  (0, _keymaps.bindKeymapWithCommand)(_keymaps.toggleTable.common, (0, _insert.createTable)(isTableScalingEnabled, isTableAlignmentEnabled, !!isFullWidthEnabled, editorAnalyticsAPI, isCommentEditor, isTableResizingEnabled), list);
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.backspace.common, (0, _commands.chainCommands)((0, _commandsWithAnalytics.deleteTableIfSelectedWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.KEYBOARD), (0, _commandsWithAnalytics.emptyMultipleCellsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.KEYBOARD)), list);
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.backspace.common, _commands2.moveCursorBackward, list);
 

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

@@ -30,7 +30,7 @@ var _pluginFactory = require("./plugin-factory");
 var _pluginKey = require("./plugin-key");
 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; }
-var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent) {
+var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent, isCommentEditor) {
   var _accessibilityUtils;
   var state = (0, _pluginFactory.createPluginState)(dispatch, _objectSpread(_objectSpread(_objectSpread({
     pluginConfig: pluginConfig,
@@ -263,7 +263,8 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
           getEditorFeatureFlags: getEditorFeatureFlags,
           dispatchAnalyticsEvent: dispatchAnalyticsEvent,
           pluginInjectionApi: pluginInjectionApi,
-          isTableAlignmentEnabled: isTableAlignmentEnabled
+          isTableAlignmentEnabled: isTableAlignmentEnabled,
+          isCommentEditor: isCommentEditor
         }),
         tableRow: (0, _lazyNodeViews.lazyTableRowView)({
           eventDispatcher: eventDispatcher
@@ -281,7 +282,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
         mousedown: (0, _eventHandlers.withCellTracking)(_eventHandlers.handleMouseDown),
         mouseover: (0, _eventHandlers.withCellTracking)((0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseOver)),
         mouseleave: _eventHandlers.handleMouseLeave,
-        mouseout: (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseOut),
+        mouseout: (0, _platformFeatureFlags.fg)('editor_react_18_fix_table_delete_col_decorations') ? undefined : (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseOut),
         mousemove: (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseMove),
         mouseenter: _eventHandlers.handleMouseEnter,
         mouseup: (0, _eventHandlers.whenTableInFocus)(_eventHandlers.handleMouseUp),

package/dist/cjs/toolbar.js

@@ -42,7 +42,10 @@ var _alignment = require("./utils/alignment");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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; } /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+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; } /**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var getToolbarMenuConfig = exports.getToolbarMenuConfig = function getToolbarMenuConfig(config, state, _ref, editorAnalyticsAPI) {
   var formatMessage = _ref.formatMessage;
   var isTableScalingWithFixedColumnWidthsOptionShown = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;

package/dist/cjs/ui/ColumnResizeWidget/index.js

@@ -12,7 +12,10 @@ var _keymaps = require("@atlaskit/editor-common/keymaps");
 var _messages = require("@atlaskit/editor-common/messages");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _types = require("../../types");
-/** @jsx jsx */
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
 var ColumnResizeWidget = exports.ColumnResizeWidget = function ColumnResizeWidget(_ref) {

package/dist/cjs/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.js

@@ -8,7 +8,10 @@ var _react = require("@emotion/react");
 var _button = require("@atlaskit/button");
 var _ui = require("@atlaskit/editor-common/ui");
 var _primitives = require("@atlaskit/primitives");
-/** @jsx jsx */
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
 var containerStyles = (0, _primitives.xcss)({

package/dist/cjs/ui/FloatingContextualButton/index.js

@@ -25,7 +25,10 @@ var _FixedButton = _interopRequireDefault(require("./FixedButton"));
 var _styles = require("./styles");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-/** @jsx jsx */
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 

package/dist/cjs/ui/FloatingContextualMenu/ContextualMenu.js

@@ -48,7 +48,10 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 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; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/prefer-primitives */ /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/prefer-primitives */ /**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var arrowsList = new Set(['ArrowRight', 'ArrowLeft']);
 var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(ContextualMenu, _Component);

package/dist/cjs/ui/FloatingContextualMenu/index.js

@@ -14,7 +14,10 @@ var _pluginFactory = require("../../pm-plugins/plugin-factory");
 var _consts = require("../consts");
 var _ContextualMenu = _interopRequireDefault(require("./ContextualMenu"));
 var _styles = require("./styles");
-/** @jsx jsx */
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
 var FloatingContextualMenu = function FloatingContextualMenu(_ref) {

package/dist/cjs/ui/FloatingDragMenu/DragMenu.js

@@ -38,7 +38,10 @@ var _styles2 = require("./styles");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /* eslint-disable @atlaskit/design-system/prefer-primitives */
-/** @jsx jsx */
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
 /** @jsxFrag */
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766

package/dist/cjs/utils/create.js

@@ -14,15 +14,20 @@ var createTableWithWidth = exports.createTableWithWidth = function createTableWi
   var isTableScalingEnabled = _ref.isTableScalingEnabled,
     isTableAlignmentEnabled = _ref.isTableAlignmentEnabled,
     isFullWidthModeEnabled = _ref.isFullWidthModeEnabled,
+    isCommentEditor = _ref.isCommentEditor,
+    isTableResizingEnabled = _ref.isTableResizingEnabled,
     createTableProps = _ref.createTableProps;
   return function (schema) {
     var attrsOverrides = {};
-    if (isTableScalingEnabled && isFullWidthModeEnabled) {
+    if (isTableScalingEnabled && isFullWidthModeEnabled && !isCommentEditor) {
       attrsOverrides.tableWidth = _utils2.TABLE_MAX_WIDTH;
     }
     if (isTableAlignmentEnabled && isFullWidthModeEnabled) {
       attrsOverrides.layout = 'align-start';
     }
+    if (isCommentEditor && isTableResizingEnabled) {
+      attrsOverrides.tableWidth = 'inherit';
+    }
     return (0, _utils.createTable)(_objectSpread(_objectSpread({
       schema: schema
     }, createTableProps), attrsOverrides));

package/dist/es2019/commands/insert.js

@@ -119,11 +119,13 @@ export const insertRow = (row, moveCursorToTheNewRow, isCellBackgroundDuplicated
   }
   return true;
 };
-export const createTable = (isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI) => (state, dispatch) => {
+export const createTable = (isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isTableResizingEnabled) => (state, dispatch) => {
   const table = createTableWithWidth({
     isTableScalingEnabled,
     isTableAlignmentEnabled,
-    isFullWidthModeEnabled
+    isFullWidthModeEnabled,
+    isCommentEditor,
+    isTableResizingEnabled
   })(state.schema);
   if (dispatch) {
     const tr = safeInsert(table)(state.tr).scrollIntoView();
@@ -142,7 +144,7 @@ export const createTable = (isTableScalingEnabled, isTableAlignmentEnabled, isFu
   }
   return true;
 };
-export const insertTableWithSize = (isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI) => (rowsCount, colsCount, inputMethod) => {
+export const insertTableWithSize = (isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor) => (rowsCount, colsCount, inputMethod) => {
   return ({
     tr
   }) => {
@@ -150,6 +152,7 @@ export const insertTableWithSize = (isFullWidthModeEnabled, isTableScalingEnable
       isTableScalingEnabled,
       isFullWidthModeEnabled,
       isTableAlignmentEnabled,
+      isCommentEditor,
       createTableProps: {
         rowsCount: rowsCount,
         colsCount: colsCount