@atlaskit/editor-plugin-table 7.25.3 → 7.25.5

package/dist/es2019/event-handlers.js

@@ -232,7 +232,7 @@ export const handleMouseLeave = (view, event) => {
   if (isTableHovered) {
     if (isDragAndDropEnabled) {
       const {
-        isDragMenuOpen
+        isDragMenuOpen = false
       } = getDragDropPluginState(state);
       !isDragMenuOpen && setTableHovered(false)(state, dispatch);
     } else {
@@ -449,7 +449,7 @@ const trackCellLocation = (view, mouseEvent) => {
   hoverCell(htmlRowIndex, colIndex)(view.state, view.dispatch);
 };
 export const withCellTracking = eventHandler => (view, mouseEvent) => {
-  if (getPluginState(view.state).isDragAndDropEnabled && !getDragDropPluginState(view.state).isDragging) {
+  if (getPluginState(view.state).isDragAndDropEnabled && getDragDropPluginState(view.state) && !getDragDropPluginState(view.state).isDragging) {
     trackCellLocation(view, mouseEvent);
   }
   return eventHandler(view, mouseEvent);

package/dist/es2019/nodeviews/TableComponent.js

@@ -518,7 +518,7 @@ class TableComponent extends React.Component {
     const isNumberOfColumnsChanged = tablesHaveDifferentNoOfColumns(tableNode, this.node);
     const maybeScale = isTableSquashed || isTableWidthChanged || isTableResizedFullWidth || isNumberColumnChanged || isNumberOfColumnsChanged;
     if (force || maybeScale) {
-      var _this$containerWidth, _this$props$options;
+      var _this$containerWidth, _this$props$options, _this$props$options2, _this$props$options3;
       const {
         width: containerWidthValue
       } = containerWidth;
@@ -531,10 +531,12 @@ class TableComponent extends React.Component {
       const {
         tableWithFixedColumnWidthsOption = false
       } = getEditorFeatureFlags();
-      const isTableScalingWithFixedColumnWidthsOptionEnabled = ((_this$props$options = this.props.options) === null || _this$props$options === void 0 ? void 0 : _this$props$options.isTableScalingEnabled) && tableWithFixedColumnWidthsOption;
-      const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') || false;
+      const isTableScalingWithFixedColumnWidthsOptionEnabled = !!((_this$props$options = this.props.options) !== null && _this$props$options !== void 0 && _this$props$options.isTableScalingEnabled) && tableWithFixedColumnWidthsOption;
+      const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') ||
+      // When in comment editor, we need the scaling percent to be 40% while tableWithFixedColumnWidthsOption is not visible
+      !!((_this$props$options2 = this.props.options) !== null && _this$props$options2 !== void 0 && _this$props$options2.isTableScalingEnabled) && !!((_this$props$options3 = this.props.options) !== null && _this$props$options3 !== void 0 && _this$props$options3.isCommentEditor);
       if (force || !isResizing && shouldUpdateColgroup) {
-        var _this$props$options2;
+        var _this$props$options4;
         const resizeState = getResizeState({
           minWidth: COLUMN_MIN_WIDTH,
           maxSize: tableRenderWidth,
@@ -546,7 +548,7 @@ class TableComponent extends React.Component {
           shouldUseIncreasedScalingPercent
         });
         let shouldScaleOnColgroupUpdate = false;
-        if ((_this$props$options2 = this.props.options) !== null && _this$props$options2 !== void 0 && _this$props$options2.isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
+        if ((_this$props$options4 = this.props.options) !== null && _this$props$options4 !== void 0 && _this$props$options4.isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
           shouldScaleOnColgroupUpdate = true;
         }
         if (isTableScalingWithFixedColumnWidthsOptionEnabled && tableNode.attrs.displayMode !== 'fixed') {
@@ -564,7 +566,7 @@ class TableComponent extends React.Component {
     this.containerWidth = containerWidth;
   }
   componentDidUpdate(_, prevState) {
-    var _this$props$options3, _this$wrapper;
+    var _this$props$options5, _this$props$options6, _this$wrapper;
     const {
       view,
       getNode,
@@ -594,8 +596,8 @@ class TableComponent extends React.Component {
       shouldScale = true;
       shouldHandleColgroupUpdates = true;
     }
-    const isTableScalingWithFixedColumnWidthsOptionEnabled = isTableScalingEnabled && tableWithFixedColumnWidthsOption;
-    const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent');
+    const isTableScalingWithFixedColumnWidthsOptionEnabled = !!isTableScalingEnabled && tableWithFixedColumnWidthsOption;
+    const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') || !!isTableScalingEnabled && !!((_this$props$options5 = this.props.options) !== null && _this$props$options5 !== void 0 && _this$props$options5.isCommentEditor);
     if (isTableScalingWithFixedColumnWidthsOptionEnabled && getNode().attrs.displayMode !== 'fixed') {
       shouldScale = true;
       shouldHandleColgroupUpdates = true;
@@ -606,7 +608,7 @@ class TableComponent extends React.Component {
     if (isInDanger && !table) {
       clearHoverSelection()(view.state, view.dispatch);
     }
-    if ((_this$props$options3 = this.props.options) !== null && _this$props$options3 !== void 0 && _this$props$options3.isCommentEditor && options !== null && options !== void 0 && options.isTableResizingEnabled) {
+    if ((_this$props$options6 = this.props.options) !== null && _this$props$options6 !== void 0 && _this$props$options6.isCommentEditor && options !== null && options !== void 0 && options.isTableResizingEnabled) {
       this.removeInlineTableWidth();
     }
     if ((_this$wrapper = this.wrapper) !== null && _this$wrapper !== void 0 && _this$wrapper.parentElement && this.table && !this.overflowShadowsObserver) {
@@ -693,6 +695,7 @@ class TableComponent extends React.Component {
     }
   }
   render() {
+    var _this$props$options7;
     const {
       view,
       getNode,
@@ -811,7 +814,7 @@ class TableComponent extends React.Component {
       stickyScrollbar,
       tableWithFixedColumnWidthsOption = false
     } = getEditorFeatureFlags();
-    const shouldUseIncreasedScalingPercent = isTableScalingEnabled && tableWithFixedColumnWidthsOption && fg('platform.editor.table.use-increased-scaling-percent');
+    const shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption && fg('platform.editor.table.use-increased-scaling-percent') || !!((_this$props$options7 = this.props.options) !== null && _this$props$options7 !== void 0 && _this$props$options7.isCommentEditor));
     return /*#__PURE__*/React.createElement(TableContainer
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     , {

package/dist/es2019/nodeviews/TableResizer.js

@@ -258,7 +258,7 @@ export const TableResizer = ({
       prevNode: node,
       start: pos + 1,
       parentWidth: newWidth
-    }, editorView.domAtPos.bind(editorView), isTableScalingEnabled, isTableWithFixedColumnWidthsOptionEnabled);
+    }, editorView.domAtPos.bind(editorView), isTableScalingEnabled, isTableWithFixedColumnWidthsOptionEnabled, isCommentEditor);
     const editorContainerWidth = isFullWidthModeEnabled ? lineLength + 2 * akEditorGutterPaddingDynamic() : containerWidth;
     const closestSnap = findClosestSnap(newWidth, isTableScalingEnabled ? defaultTablePreserveSnappingWidths(PRESERVE_TABLE_SNAPPING_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig) : defaultSnappingWidths, isTableScalingEnabled ? defaultGuidelinesForPreserveTable(PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig) : defaultGuidelines, TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE);
     updateActiveGuidelines(closestSnap);

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

@@ -1,6 +1,5 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
 import { fg } from '@atlaskit/platform-feature-flags';
-import ignoreMutationDelegate from './ignore-mutation-delegate';
 // TODO: Clean up ED-23976
 import { createTableView } from './table';
 import TableCell from './TableCell';
@@ -36,10 +35,7 @@ export const lazyTableView = options => {
   return withLazyLoading({
     nodeName: 'table',
     getNodeViewOptions: () => options,
-    loader,
-    lazyNodeViewOptions: {
-      ignoreMutationDelegate
-    }
+    loader
   });
 };
 export const lazyTableCellView = options => {

package/dist/es2019/nodeviews/table.js

@@ -15,7 +15,6 @@ import { pluginKey as tableResizingPluginKey } from '../pm-plugins/table-resizin
 import { generateColgroup } from '../pm-plugins/table-resizing/utils';
 import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
 import { isTableNested } from '../utils';
-import ignoreMutationDelegate from './ignore-mutation-delegate';
 import TableComponent from './TableComponent';
 import { TableComponentWithSharedState } from './TableComponentWithSharedState';
 const tableAttributes = node => {
@@ -228,16 +227,30 @@ export default class TableView extends ReactNodeView {
     });
   }
   ignoreMutation(mutation) {
-    const ignoreMutation = ignoreMutationDelegate(mutation);
+    const {
+      type,
+      target: {
+        nodeName,
+        firstChild
+      }
+    } = mutation;
+    if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'DIV' && (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'TABLE') {
+      return false;
+    }
+
+    // ED-16668
+    // Do not remove this fixes an issue with windows firefox that relates to
+    // the addition of the shadow sentinels
+    if (type === 'selection' && (nodeName === null || nodeName === void 0 ? void 0 : nodeName.toUpperCase()) === 'TABLE' && ((firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'COLGROUP' || (firstChild === null || firstChild === void 0 ? void 0 : firstChild.nodeName.toUpperCase()) === 'SPAN')) {
+      return false;
+    }
     if (fg('platform_editor_react_18_table_insertion_cursor')) {
-      if (ignoreMutation) {
-        if (!this.contentDOM) {
-          return true;
-        }
-        return !this.contentDOM.contains(mutation.target) && mutation.type !== 'selection';
+      if (!this.contentDOM) {
+        return true;
       }
+      return !this.contentDOM.contains(mutation.target) && mutation.type !== 'selection';
     }
-    return ignoreMutation;
+    return true;
   }
   destroy() {
     var _this$eventDispatcher;

package/dist/es2019/plugin.js

@@ -64,7 +64,8 @@ const tablesPlugin = ({
   const editorAnalyticsAPI = api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   const ariaNotifyPlugin = api === null || api === void 0 ? void 0 : (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify;
   const isTableFixedColumnWidthsOptionEnabled = (options === null || options === void 0 ? void 0 : (_options$getEditorFea = options.getEditorFeatureFlags) === null || _options$getEditorFea === void 0 ? void 0 : _options$getEditorFea.call(options).tableWithFixedColumnWidthsOption) || false;
-  const shouldUseIncreasedScalingPercent = (options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) && isTableFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent');
+  const shouldUseIncreasedScalingPercent = (options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) && (isTableFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') || ( // When in comment editor, we need the scaling percent to be 40% while tableWithFixedColumnWidthsOption is not visible
+  options === null || options === void 0 ? void 0 : options.isCommentEditor));
   const isCellBackgroundDuplicated = (options === null || options === void 0 ? void 0 : (_options$getEditorFea2 = options.getEditorFeatureFlags) === null || _options$getEditorFea2 === void 0 ? void 0 : _options$getEditorFea2.call(options).tableDuplicateCellColouring) || false;
   return {
     name: 'table',
@@ -189,7 +190,7 @@ const tablesPlugin = ({
           } = pluginConfig(tableOptions);
           return allowColumnResizing ? createFlexiResizingPlugin(dispatch, {
             lastColumnResizable: !fullWidthEnabled
-          }, defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, editorAnalyticsAPI, isTableScalingEnabled || false, isNewColumnResizingEnabled, isTableAlignmentEnabled) : undefined;
+          }, defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, editorAnalyticsAPI, isTableScalingEnabled || false, isNewColumnResizingEnabled, isTableAlignmentEnabled, !!(options !== null && options !== void 0 && options.isCommentEditor)) : undefined;
         }
       }, {
         name: 'tableEditing',
@@ -252,7 +253,7 @@ const tablesPlugin = ({
         plugin: ({
           dispatch
         }) => {
-          return options !== null && options !== void 0 && options.dragAndDropEnabled ? createDragAndDropPlugin(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled) : undefined;
+          return options !== null && options !== void 0 && options.dragAndDropEnabled ? createDragAndDropPlugin(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor) : undefined;
         }
       }, {
         name: 'tableViewModeSort',
@@ -411,7 +412,8 @@ const tablesPlugin = ({
             editorAnalyticsAPI: editorAnalyticsAPI,
             getEditorContainerWidth: defaultGetEditorContainerWidth,
             getEditorFeatureFlags: (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags,
-            isCellMenuOpenByKeyboard: isCellMenuOpenByKeyboard
+            isCellMenuOpenByKeyboard: isCellMenuOpenByKeyboard,
+            isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor
           }), isDragAndDropEnabled && /*#__PURE__*/React.createElement(FloatingDragMenu, {
             editorView: editorView,
             mountPoint: popupsMountPoint,

package/dist/es2019/pm-plugins/drag-and-drop/plugin.js

@@ -18,7 +18,7 @@ import { DropTargetType } from './consts';
 import { createPluginState, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
 import { getDraggableDataFromEvent } from './utils/monitor';
-const destroyFn = (editorView, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled) => {
+const destroyFn = (editorView, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor) => {
   const editorPageScrollContainer = document.querySelector('.fabric-editor-popup-scroll-parent');
   const rowAutoScrollers = editorPageScrollContainer ? [monitorForElements({
     canMonitor({
@@ -173,7 +173,9 @@ const destroyFn = (editorView, editorAnalyticsAPI, isTableScalingEnabled, isTabl
             if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
               isTableScalingEnabledOnCurrentTable = tableNode.attrs.displayMode !== 'fixed';
             }
-            const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent');
+            const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') ||
+            // When in comment editor, we need the scaling percent to be 40% while tableWithFixedColumnWidthsOption is not visible
+            isTableScalingEnabled && isCommentEditor;
             insertColgroupFromNode(tableRef, tableNode, isTableScalingEnabledOnCurrentTable, undefined, shouldUseIncreasedScalingPercent);
           }
         }
@@ -182,7 +184,7 @@ const destroyFn = (editorView, editorAnalyticsAPI, isTableScalingEnabled, isTabl
     }
   }));
 };
-export const createPlugin = (dispatch, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false) => {
+export const createPlugin = (dispatch, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, isCommentEditor = false) => {
   return new SafePlugin({
     state: createPluginState(dispatch, state => ({
       decorationSet: DecorationSet.empty,
@@ -202,7 +204,7 @@ export const createPlugin = (dispatch, editorAnalyticsAPI, isTableScalingEnabled
         targetCellPosition: newTargetCellPosition
       } = getTablePluginState(newState);
       const {
-        isDragMenuOpen,
+        isDragMenuOpen = false,
         dragMenuIndex
       } = getPluginState(newState);
       transactions.forEach(transaction => {
@@ -251,7 +253,7 @@ export const createPlugin = (dispatch, editorAnalyticsAPI, isTableScalingEnabled
     },
     view: editorView => {
       return {
-        destroy: destroyFn(editorView, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled)
+        destroy: destroyFn(editorView, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor)
       };
     },
     props: {
@@ -291,7 +293,7 @@ export const createPlugin = (dispatch, editorAnalyticsAPI, isTableScalingEnabled
         const isDragHandleFocused = ['drag-handle-button-row', 'drag-handle-button-column'].includes((_ref = event.target || null) === null || _ref === void 0 ? void 0 : _ref.id);
         const keysToTrap = ['Enter', ' '];
         const {
-          isDragMenuOpen
+          isDragMenuOpen = false
         } = getPluginState(view.state);
 
         // drag handle is focused, and user presses any key return them back to editing

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

@@ -59,8 +59,8 @@ export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, dragAn
     ariaNotify: ariaNotifyPlugin,
     getIntl: getIntl
   }), list);
-  bindKeymapWithCommand(decreaseMediaSize.common, changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(-10, getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, INPUT_METHOD.SHORTCUT, ariaNotifyPlugin, getIntl), list);
-  bindKeymapWithCommand(increaseMediaSize.common, changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(10, getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, INPUT_METHOD.SHORTCUT, ariaNotifyPlugin, getIntl), list);
+  bindKeymapWithCommand(decreaseMediaSize.common, changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(-10, getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, !!isCommentEditor, INPUT_METHOD.SHORTCUT, ariaNotifyPlugin, getIntl), list);
+  bindKeymapWithCommand(increaseMediaSize.common, changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI)(10, getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, !!isCommentEditor, INPUT_METHOD.SHORTCUT, ariaNotifyPlugin, getIntl), list);
   bindKeymapWithCommand(escape.common, stopKeyboardColumnResizing({
     ariaNotify: ariaNotifyPlugin,
     getIntl: getIntl

package/dist/es2019/pm-plugins/table-resizing/event-handlers.js

@@ -14,7 +14,7 @@ import { evenColumns, setDragging, stopResizing } from './commands';
 import { getPluginState } from './plugin-factory';
 import { currentColWidth, getResizeState, getTableMaxWidth, pointsAtCell, resizeColumn, resizeColumnAndTable, updateControls } from './utils';
 import { scaleResizeState } from './utils/resize-column';
-export const handleMouseDown = (view, event, localResizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled, editorAnalyticsAPI, isNewColumnResizingEnabled, isTableAlignmentEnabled) => {
+export const handleMouseDown = (view, event, localResizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled, editorAnalyticsAPI, isNewColumnResizingEnabled, isTableAlignmentEnabled, isCommentEditor) => {
   const {
     state,
     dispatch
@@ -71,7 +71,9 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
     start,
     domAtPos,
     isTableScalingEnabled: shouldScale,
-    shouldUseIncreasedScalingPercent: isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent')
+    shouldUseIncreasedScalingPercent: isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') ||
+    // When in comment editor, we need the scaling percent to be 40% while tableWithFixedColumnWidthsOption is not visible
+    isTableScalingEnabled && !!isCommentEditor
   });
   if (evenColumns({
     resizeState,
@@ -169,7 +171,7 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
           shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
         }
         const resizedDelta = clientX - startX;
-        const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent');
+        const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') || isTableScalingEnabled && !!isCommentEditor;
         if (isNewColumnResizingEnabled && !isTableNested(state, tablePos)) {
           const newResizeState = resizeColumnAndTable({
             resizeState,
@@ -281,7 +283,7 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
     const map = TableMap.get(table);
     const colIndex = map.colCount($cell.pos - $cell.start(-1)) + $cell.nodeAfter.attrs.colspan - 1;
     let shouldScale = tableDepth === 0 && isTableScalingEnabled;
-    const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent');
+    const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') || isTableScalingEnabled && isCommentEditor;
     if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
       shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
     }

package/dist/es2019/pm-plugins/table-resizing/plugin.js

@@ -9,7 +9,7 @@ import { pluginKey } from './plugin-key';
 import { getResizeCellPos } from './utils';
 export function createPlugin(dispatch, {
   lastColumnResizable = true
-}, getEditorContainerWidth, getEditorFeatureFlags, editorAnalyticsAPI, isTableScalingEnabled, isNewColumnResizingEnabled, isTableAlignmentEnabled) {
+}, getEditorContainerWidth, getEditorFeatureFlags, editorAnalyticsAPI, isTableScalingEnabled, isNewColumnResizingEnabled, isTableAlignmentEnabled, isCommentEditor) {
   return new SafePlugin({
     key: pluginKey,
     state: createPluginState(dispatch, {
@@ -51,7 +51,7 @@ export function createPlugin(dispatch, {
             isColumnKeyboardResizeStarted = isKeyboardResize;
           }
           if (resizeHandlePos !== null && (!dragging || isColumnKeyboardResizeStarted)) {
-            if (handleMouseDown(view, event, resizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled || false, editorAnalyticsAPI, isNewColumnResizingEnabled, isTableAlignmentEnabled)) {
+            if (handleMouseDown(view, event, resizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled || false, editorAnalyticsAPI, isNewColumnResizingEnabled, isTableAlignmentEnabled, isCommentEditor)) {
               const {
                 state,
                 dispatch

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

@@ -1,7 +1,7 @@
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
 import { tableCellMinWidth, tableNewColumnMinWidth } from '@atlaskit/editor-common/styles';
 import { calcTableColumnWidths } from '@atlaskit/editor-common/utils';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { getSelectedTableInfo } from '../../../utils';
 import { getColWidthFix, hasTableBeenResized, insertColgroupFromNode } from './colgroup';
 import { getCellsRefsInColumn, getColumnStateFromDOM } from './column-state';
@@ -273,7 +273,7 @@ export const normaliseTableLayout = input => {
       return 'default';
   }
 };
-export const getNewResizeStateFromSelectedColumns = (rect, state, domAtPos, getEditorContainerWidth, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false) => {
+export const getNewResizeStateFromSelectedColumns = (rect, state, domAtPos, getEditorContainerWidth, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, isCommentEditor = false) => {
   // Fail early so that we don't do complex calculations for no reason
   const numColumnsSelected = rect.right - rect.left;
   if (numColumnsSelected <= 1) {
@@ -320,7 +320,7 @@ export const getNewResizeStateFromSelectedColumns = (rect, state, domAtPos, getE
     start: table.start,
     domAtPos,
     isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
-    shouldUseIncreasedScalingPercent: isTableScalingWithFixedColumnWidthsOptionEnabled && getBooleanFF('platform.editor.table.use-increased-scaling-percent')
+    shouldUseIncreasedScalingPercent: isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') || isTableScalingEnabled && isCommentEditor
   });
   const newResizeState = evenSelectedColumnsWidths(resizeState, rect);
   const widthsBefore = resizeState.widths;

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

@@ -1,7 +1,7 @@
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { updateColumnWidths } from '../../../transforms';
 import { getTableWidth } from '../../../utils';
 import { getLayoutSize } from '../utils/misc';
@@ -98,7 +98,7 @@ export function scaleTableTo(state, maxSize) {
   }
   return adjustColumnsWidths(newState, maxSize);
 }
-export const previewScaleTable = (tableRef, options, domAtPos, isTableScalingEnabled = false, isTableWithFixedColumnWidthsOptionEnabled = false) => {
+export const previewScaleTable = (tableRef, options, domAtPos, isTableScalingEnabled = false, isTableWithFixedColumnWidthsOptionEnabled = false, isCommentEditor = false) => {
   const {
     node,
     start,
@@ -123,7 +123,9 @@ export const previewScaleTable = (tableRef, options, domAtPos, isTableScalingEna
     syncStickyRowToTable(tableRef);
     return;
   }
-  const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && getBooleanFF('platform.editor.table.use-increased-scaling-percent');
+  const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') ||
+  // When in comment editor, we need the scaling percent to be 40% while tableWithFixedColumnWidthsOption is not visible
+  isTableScalingEnabled && isCommentEditor;
   const resizeState = parentWidth ? scaleWithParent(tableRef, parentWidth, node, start, domAtPos, false,
   // Here isTableScalingEnabled = false
   shouldUseIncreasedScalingPercent) : scale(tableRef, options, domAtPos, false, shouldUseIncreasedScalingPercent);

package/dist/es2019/toolbar.js

@@ -115,7 +115,7 @@ export const getToolbarMenuConfig = (config, state, {
 // with native widgets. It's enabled via a plugin config.
 export const getToolbarCellOptionsConfig = (editorState, editorView, initialSelectionRect, {
   formatMessage
-}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false, isCellBackgroundDuplicated = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false) => {
+}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false, isCellBackgroundDuplicated = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => {
   var _pluginState$pluginCo, _pluginState$pluginCo2;
   const {
     top,
@@ -217,7 +217,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
   }
   if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo = pluginState.pluginConfig) !== null && _pluginState$pluginCo !== void 0 && _pluginState$pluginCo.allowDistributeColumns) {
     var _newResizeStateWithAn;
-    const newResizeStateWithAnalytics = editorView ? getNewResizeStateFromSelectedColumns(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled) : undefined;
+    const newResizeStateWithAnalytics = editorView ? getNewResizeStateFromSelectedColumns(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor) : undefined;
     const wouldChange = (_newResizeStateWithAn = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn !== void 0 ? _newResizeStateWithAn : false;
     const distributeColumnWidths = (state, dispatch) => {
       if (newResizeStateWithAnalytics) {
@@ -359,8 +359,8 @@ export const getToolbarConfig = (getEditorContainerWidth, editorAnalyticsAPI, ge
     const menu = getToolbarMenuConfig(config, pluginState, intl, editorAnalyticsAPI, isTableScalingWithFixedColumnWidthsOptionShown, areTableColumWidthsFixed);
     const alignmentMenu = options !== null && options !== void 0 && options.isTableAlignmentEnabled && !isNested ? getAlignmentOptionsConfig(state, intl, editorAnalyticsAPI, getEditorContainerWidth, getDomRef, editorView, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
     const isCellBackgroundDuplicated = getEditorFeatureFlags().tableDuplicateCellColouring || false;
-    const cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, isCellBackgroundDuplicated, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent);
-    const columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled) : [];
+    const cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, isCellBackgroundDuplicated, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor);
+    const columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
     const colorPicker = getColorPicker(state, menu, intl, editorAnalyticsAPI, getEditorView);
 
     // Check if we need to show confirm dialog for delete button
@@ -440,22 +440,22 @@ const separator = hidden => {
 };
 const getCellItems = (state, view, {
   formatMessage
-}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false, isCellBackgroundDuplicated = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false) => {
+}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false, isCellBackgroundDuplicated = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => {
   const initialSelectionRect = getClosestSelectionRect(state);
   if (initialSelectionRect) {
     const cellOptions = getToolbarCellOptionsConfig(state, view, initialSelectionRect, {
       formatMessage
-    }, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, isCellBackgroundDuplicated, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent);
+    }, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, isCellBackgroundDuplicated, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor);
     return [cellOptions, separator(cellOptions.hidden)];
   }
   return [];
 };
-export const getDistributeConfig = (getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false) => (state, dispatch, editorView) => {
+export const getDistributeConfig = (getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, isCommentEditor = false) => (state, dispatch, editorView) => {
   const selectionOrTableRect = getClosestSelectionOrTableRect(state);
   if (!editorView || !selectionOrTableRect) {
     return false;
   }
-  const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled);
+  const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, state, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
   if (newResizeStateWithAnalytics) {
     distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.FLOATING_TB, newResizeStateWithAnalytics)(state, dispatch);
     return true;
@@ -467,7 +467,7 @@ export const getDistributeConfig = (getEditorContainerWidth, editorAnalyticsAPI,
 // fixed column button should be in this function call in the future
 const getColumnSettingItems = (editorState, editorView, {
   formatMessage
-}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false) => {
+}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, isCommentEditor = false) => {
   var _newResizeStateWithAn2, _pluginState$pluginCo3;
   const pluginState = getPluginState(editorState);
   const selectionOrTableRect = getClosestSelectionOrTableRect(editorState);
@@ -483,7 +483,7 @@ const getColumnSettingItems = (editorState, editorView, {
       type: 'button',
       title: formatMessage(messages.distributeColumns),
       icon: DistributeColumnIcon,
-      onClick: (state, dispatch, view) => getDistributeConfig(getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled)(state, dispatch, view),
+      onClick: (state, dispatch, view) => getDistributeConfig(getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor)(state, dispatch, view),
       disabled: !wouldChange
     });
   }

package/dist/es2019/ui/DragHandle/index.js

@@ -47,7 +47,7 @@ const DragHandleComponent = ({
     hoveredRows
   } = getPluginState(state);
   const {
-    isDragMenuOpen
+    isDragMenuOpen = false
   } = getDnDPluginState(state);
   const isRow = direction === 'row';
   const isColumn = direction === 'column';

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

@@ -492,7 +492,8 @@ export class ContextualMenu extends Component {
         editorAnalyticsAPI,
         getEditorContainerWidth,
         getEditorFeatureFlags,
-        isCellMenuOpenByKeyboard
+        isCellMenuOpenByKeyboard,
+        isCommentEditor
       } = this.props;
       // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
       const {
@@ -522,7 +523,9 @@ export class ContextualMenu extends Component {
         dispatch(tr);
         editorView.dom.focus(); // otherwise cursor disappears from cell
       }
-      const shouldUseIncreasedScalingPercent = isTableScalingEnabled && tableWithFixedColumnWidthsOption && fg('platform.editor.table.use-increased-scaling-percent');
+      const shouldUseIncreasedScalingPercent = isTableScalingEnabled && (tableWithFixedColumnWidthsOption && fg('platform.editor.table.use-increased-scaling-percent') ||
+      // When in comment editor, we need the scaling percent to be 40% while tableWithFixedColumnWidthsOption is not visible
+      isCommentEditor);
       switch (item.value.name) {
         case 'sort_column_desc':
           sortColumnWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.CONTEXT_MENU, selectionRect.left, SortOrder.DESC)(state, dispatch);

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

@@ -22,7 +22,8 @@ const FloatingContextualMenu = ({
   editorAnalyticsAPI,
   getEditorContainerWidth,
   getEditorFeatureFlags,
-  isCellMenuOpenByKeyboard
+  isCellMenuOpenByKeyboard,
+  isCommentEditor
 }) => {
   // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
   const {
@@ -76,7 +77,8 @@ const FloatingContextualMenu = ({
     editorAnalyticsAPI: editorAnalyticsAPI,
     getEditorContainerWidth: getEditorContainerWidth,
     getEditorFeatureFlags: getEditorFeatureFlags,
-    isCellMenuOpenByKeyboard: isCellMenuOpenByKeyboard
+    isCellMenuOpenByKeyboard: isCellMenuOpenByKeyboard,
+    isCommentEditor: isCommentEditor
   })));
 };
 FloatingContextualMenu.displayName = 'FloatingContextualMenu';

package/dist/esm/commands/column-resize.js

@@ -149,6 +149,7 @@ export var changeColumnWidthByStep = function changeColumnWidthByStep(_ref4) {
     getEditorContainerWidth = _ref4.getEditorContainerWidth,
     isTableScalingEnabled = _ref4.isTableScalingEnabled,
     isTableFixedColumnWidthsOptionEnabled = _ref4.isTableFixedColumnWidthsOptionEnabled,
+    isCommentEditor = _ref4.isCommentEditor,
     ariaNotify = _ref4.ariaNotify,
     getIntl = _ref4.getIntl;
   return function (state, dispatch, view) {
@@ -197,7 +198,9 @@ export var changeColumnWidthByStep = function changeColumnWidthByStep(_ref4) {
     if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
       isTableScalingEnabledOnCurrentTable = originalTable.attrs.displayMode !== 'fixed';
     }
-    var shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent');
+    var shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') ||
+    // When in comment editor, we need the scaling percent to be 40% while tableWithFixedColumnWidthsOption is not visible
+    isTableScalingEnabled && isCommentEditor;
     var initialResizeState = getResizeState({
       minWidth: tableCellMinWidth,
       maxSize: maxSize,

package/dist/esm/commands-with-analytics.js

@@ -188,7 +188,7 @@ export var insertRowWithAnalytics = function insertRowWithAnalytics(editorAnalyt
   };
 };
 export var changeColumnWidthByStepWithAnalytics = function changeColumnWidthByStepWithAnalytics(editorAnalyticsAPI) {
-  return function (stepSize, getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, inputMethod, ariaNotify, getIntl) {
+  return function (stepSize, getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor, inputMethod, ariaNotify, getIntl) {
     return withEditorAnalyticsAPI(function (state) {
       var _getSelectedTableInfo2 = getSelectedTableInfo(state.selection),
         table = _getSelectedTableInfo2.table,
@@ -215,6 +215,7 @@ export var changeColumnWidthByStepWithAnalytics = function changeColumnWidthBySt
       getEditorContainerWidth: getEditorContainerWidth,
       isTableScalingEnabled: isTableScalingEnabled,
       isTableFixedColumnWidthsOptionEnabled: isTableFixedColumnWidthsOptionEnabled,
+      isCommentEditor: isCommentEditor,
       ariaNotify: ariaNotify,
       getIntl: getIntl
     }));

package/dist/esm/event-handlers.js

@@ -220,7 +220,8 @@ export var handleMouseLeave = function handleMouseLeave(view, event) {
   if (isTableHovered) {
     if (isDragAndDropEnabled) {
       var _getDragDropPluginSta = getDragDropPluginState(state),
-        isDragMenuOpen = _getDragDropPluginSta.isDragMenuOpen;
+        _getDragDropPluginSta2 = _getDragDropPluginSta.isDragMenuOpen,
+        isDragMenuOpen = _getDragDropPluginSta2 === void 0 ? false : _getDragDropPluginSta2;
       !isDragMenuOpen && setTableHovered(false)(state, dispatch);
     } else {
       setTableHovered(false)(state, dispatch);
@@ -430,7 +431,7 @@ var trackCellLocation = function trackCellLocation(view, mouseEvent) {
 };
 export var withCellTracking = function withCellTracking(eventHandler) {
   return function (view, mouseEvent) {
-    if (getPluginState(view.state).isDragAndDropEnabled && !getDragDropPluginState(view.state).isDragging) {
+    if (getPluginState(view.state).isDragAndDropEnabled && getDragDropPluginState(view.state) && !getDragDropPluginState(view.state).isDragging) {
       trackCellLocation(view, mouseEvent);
     }
     return eventHandler(view, mouseEvent);