@atlaskit/editor-plugin-table 7.25.9 → 7.25.11

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

@@ -1,5 +1,5 @@
 import { tableBackgroundColorPalette } from '@atlaskit/adf-schema';
-import { ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD, TABLE_ACTION, TABLE_BREAKOUT, TABLE_DISPLAY_MODE } from '@atlaskit/editor-common/analytics';
+import { ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD, TABLE_ACTION, TABLE_DISPLAY_MODE } from '@atlaskit/editor-common/analytics';
 import { editorCommandToPMCommand } from '@atlaskit/editor-common/preset';
 import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
@@ -13,17 +13,12 @@ import { insertColumn, insertRow } from './commands/insert';
 import { deleteTable, deleteTableIfSelected, getTableSelectionType, setMultipleCellAttrs, setTableAlignment, setTableAlignmentWithTableContentWithPos } from './commands/misc';
 import { sortByColumn } from './commands/sort';
 import { splitCell } from './commands/split-cell';
-import { getNextLayout, toggleHeaderColumn, toggleHeaderRow, toggleNumberColumn, toggleTableLayout } from './commands/toggle';
+import { toggleHeaderColumn, toggleHeaderRow, toggleNumberColumn } from './commands/toggle';
 import { getPluginState } from './pm-plugins/plugin-factory';
 import { distributeColumnsWidths } from './pm-plugins/table-resizing/commands';
 import { deleteRows, mergeCells } from './transforms';
 import { checkIfNumberColumnEnabled, getSelectedCellInfo, getSelectedTableInfo } from './utils';
 import { withEditorAnalyticsAPI } from './utils/analytics';
-const TABLE_BREAKOUT_NAME_MAPPING = {
-  default: TABLE_BREAKOUT.NORMAL,
-  wide: TABLE_BREAKOUT.WIDE,
-  'full-width': TABLE_BREAKOUT.FULL_WIDTH
-};
 
 // #region Analytics wrappers
 export const emptyMultipleCellsWithAnalytics = editorAnalyticsAPI => (inputMethod, targetCellPosition) => withEditorAnalyticsAPI(({
@@ -206,7 +201,7 @@ export const changeColumnWidthByStepWithAnalytics = (editorAnalyticsAPI, api) =>
   getIntl: getIntl,
   api
 }));
-export const insertColumnWithAnalytics = (api, editorAnalyticsAPI, isTableScalingEnabled = false, isCellbackgroundDuplicated = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false) => (inputMethod, position) => withEditorAnalyticsAPI(state => {
+export const insertColumnWithAnalytics = (api, editorAnalyticsAPI, isTableScalingEnabled = false, isCellbackgroundDuplicated = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => (inputMethod, position) => withEditorAnalyticsAPI(state => {
   const {
     totalRowCount,
     totalColumnCount
@@ -223,7 +218,7 @@ export const insertColumnWithAnalytics = (api, editorAnalyticsAPI, isTableScalin
     },
     eventType: EVENT_TYPE.TRACK
   };
-})(editorAnalyticsAPI)(insertColumn(api, isTableScalingEnabled, isCellbackgroundDuplicated, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)(position));
+})(editorAnalyticsAPI)(insertColumn(api, isTableScalingEnabled, isCellbackgroundDuplicated, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor)(position));
 export const deleteRowsWithAnalytics = editorAnalyticsAPI => (inputMethod, rect, isHeaderRowRequired) => withEditorAnalyticsAPI(({
   selection
 }) => {
@@ -250,7 +245,7 @@ export const deleteRowsWithAnalytics = editorAnalyticsAPI => (inputMethod, rect,
   }
   return true;
 });
-export const deleteColumnsWithAnalytics = (editorAnalyticsAPI, api, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false) => (inputMethod, rect) => withEditorAnalyticsAPI(({
+export const deleteColumnsWithAnalytics = (editorAnalyticsAPI, api, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => (inputMethod, rect) => withEditorAnalyticsAPI(({
   selection
 }) => {
   const {
@@ -270,7 +265,7 @@ export const deleteColumnsWithAnalytics = (editorAnalyticsAPI, api, isTableScali
     },
     eventType: EVENT_TYPE.TRACK
   };
-})(editorAnalyticsAPI)(deleteColumnsCommand(rect, api, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent));
+})(editorAnalyticsAPI)(deleteColumnsCommand(rect, api, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor));
 export const deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut = (editorAnalyticsAPI, api, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent) => (state, dispatch) => {
   const {
     selection
@@ -375,31 +370,6 @@ export const toggleNumberColumnWithAnalytics = editorAnalyticsAPI => withEditorA
     eventType: EVENT_TYPE.TRACK
   };
 })(editorAnalyticsAPI)(toggleNumberColumn);
-export const toggleTableLayoutWithAnalytics = editorAnalyticsAPI => withEditorAnalyticsAPI(state => {
-  const {
-    table,
-    totalRowCount,
-    totalColumnCount
-  } = getSelectedTableInfo(state.selection);
-  if (table) {
-    const {
-      layout
-    } = table.node.attrs;
-    return {
-      action: TABLE_ACTION.CHANGED_BREAKOUT_MODE,
-      actionSubject: ACTION_SUBJECT.TABLE,
-      actionSubjectId: null,
-      attributes: {
-        newBreakoutMode: TABLE_BREAKOUT_NAME_MAPPING[getNextLayout(layout)],
-        previousBreakoutMode: TABLE_BREAKOUT_NAME_MAPPING[layout],
-        totalRowCount,
-        totalColumnCount
-      },
-      eventType: EVENT_TYPE.TRACK
-    };
-  }
-  return;
-})(editorAnalyticsAPI)(toggleTableLayout);
 export const sortColumnWithAnalytics = editorAnalyticsAPI => (inputMethod, columnIndex, sortOrder) => withEditorAnalyticsAPI(state => {
   const {
     totalRowCount,

package/dist/es2019/nodeviews/TableComponent.js

@@ -21,8 +21,9 @@ import { findStickyHeaderForTable, pluginKey as stickyHeadersPluginKey } from '.
 import { META_KEYS } from '../pm-plugins/table-analytics';
 import { COLUMN_MIN_WIDTH, getLayoutSize, getResizeState, insertColgroupFromNode, scaleTable, updateColgroup } from '../pm-plugins/table-resizing/utils';
 import { hasTableBeenResized } from '../pm-plugins/table-resizing/utils/colgroup';
-import { TABLE_EDITOR_MARGIN } from '../pm-plugins/table-resizing/utils/consts';
+import { TABLE_EDITOR_MARGIN, TABLE_OFFSET_IN_COMMENT_EDITOR } from '../pm-plugins/table-resizing/utils/consts';
 import { updateControls } from '../pm-plugins/table-resizing/utils/dom';
+import { getScalingPercentForTableWithoutWidth, getTableScalingPercent } from '../pm-plugins/table-resizing/utils/misc';
 import { TableCssClassName as ClassName, ShadowEvent } from '../types';
 import TableFloatingColumnControls from '../ui/TableFloatingColumnControls';
 import TableFloatingControls from '../ui/TableFloatingControls';
@@ -482,7 +483,8 @@ class TableComponent extends React.Component {
       isResizing,
       view,
       getPos,
-      getEditorFeatureFlags
+      getEditorFeatureFlags,
+      options
     } = this.props;
     if (!this.table) {
       return;
@@ -490,21 +492,24 @@ class TableComponent extends React.Component {
 
     // Remove any widths styles after resizing preview is completed
     this.table.style.width = '';
-    const tableRenderWidth = containerWidth.width - TABLE_EDITOR_MARGIN;
     const tableNode = getNode();
     const start = getPos() || 0;
     const depth = view.state.doc.resolve(start).depth;
     if (depth !== 0) {
       return;
     }
-    const tableNodeWidth = getTableContainerWidth(tableNode);
+    let tableNodeWidth = getTableContainerWidth(tableNode);
     const isTableResizedFullWidth = tableNodeWidth === 1800 && this.wasResizing && !isResizing;
+
     // Needed for undo / redo
     const isTableWidthChanged = tableNodeWidth !== this.tableNodeWidth;
+    const tableRenderWidth = options !== null && options !== void 0 && options.isCommentEditor ? containerWidth.width - (TABLE_OFFSET_IN_COMMENT_EDITOR + 1) // should be the same as this.table.parentElement?.clientWidth - 1, subtract 1 to avoid overflow
+    : containerWidth.width - TABLE_EDITOR_MARGIN;
+    tableNodeWidth = options !== null && options !== void 0 && options.isCommentEditor && !tableNode.attrs.width ? tableRenderWidth : tableNodeWidth;
     const isTableSquashed = tableRenderWidth < tableNodeWidth;
     const isNumberColumnChanged = tableNode.attrs.isNumberColumnEnabled !== this.node.attrs.isNumberColumnEnabled;
     const isNumberOfColumnsChanged = tablesHaveDifferentNoOfColumns(tableNode, this.node);
-    const maybeScale = isTableSquashed || isTableWidthChanged || isTableResizedFullWidth || isNumberColumnChanged || isNumberOfColumnsChanged;
+    const maybeScale = isTableSquashed || isTableWidthChanged || isTableResizedFullWidth && !(options !== null && options !== void 0 && options.isCommentEditor) || isNumberColumnChanged || isNumberOfColumnsChanged;
     if (force || maybeScale) {
       var _this$containerWidth, _this$props$options, _this$props$options2, _this$props$options3;
       const {
@@ -524,7 +529,7 @@ class TableComponent extends React.Component {
       // 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$options4;
+        var _this$props$options4, _this$props$options5, _this$props$options6, _this$props$options7, _this$props$options8, _this$props$options9;
         const resizeState = getResizeState({
           minWidth: COLUMN_MIN_WIDTH,
           maxSize: tableRenderWidth,
@@ -533,19 +538,29 @@ class TableComponent extends React.Component {
           start,
           domAtPos: view.domAtPos.bind(view),
           isTableScalingEnabled: true,
-          shouldUseIncreasedScalingPercent
+          shouldUseIncreasedScalingPercent,
+          isCommentEditor: !!((_this$props$options4 = this.props.options) !== null && _this$props$options4 !== void 0 && _this$props$options4.isCommentEditor)
         });
         let shouldScaleOnColgroupUpdate = false;
-        if ((_this$props$options4 = this.props.options) !== null && _this$props$options4 !== void 0 && _this$props$options4.isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
+        if ((_this$props$options5 = this.props.options) !== null && _this$props$options5 !== void 0 && _this$props$options5.isTableScalingEnabled && !tableWithFixedColumnWidthsOption) {
           shouldScaleOnColgroupUpdate = true;
         }
         if (isTableScalingWithFixedColumnWidthsOptionEnabled && tableNode.attrs.displayMode !== 'fixed') {
           shouldScaleOnColgroupUpdate = true;
         }
+        if ((_this$props$options6 = this.props.options) !== null && _this$props$options6 !== void 0 && _this$props$options6.isTableScalingEnabled && (_this$props$options7 = this.props.options) !== null && _this$props$options7 !== void 0 && _this$props$options7.isCommentEditor) {
+          shouldScaleOnColgroupUpdate = true;
+        }
+        let scalePercent = 1;
+        if (!((_this$props$options8 = this.props.options) !== null && _this$props$options8 !== void 0 && _this$props$options8.isCommentEditor) || (_this$props$options9 = this.props.options) !== null && _this$props$options9 !== void 0 && _this$props$options9.isCommentEditor && tableNode.attrs.width) {
+          scalePercent = getTableScalingPercent(tableNode, this.table, shouldUseIncreasedScalingPercent);
+        } else {
+          scalePercent = getScalingPercentForTableWithoutWidth(tableNode, this.table);
+        }
 
         // Request animation frame required for Firefox
         requestAnimationFrame(() => {
-          updateColgroup(resizeState, this.table, tableNode, shouldScaleOnColgroupUpdate, shouldUseIncreasedScalingPercent);
+          updateColgroup(resizeState, this.table, tableNode, shouldScaleOnColgroupUpdate, scalePercent);
         });
       }
     }
@@ -554,7 +569,7 @@ class TableComponent extends React.Component {
     this.containerWidth = containerWidth;
   }
   componentDidUpdate(_, prevState) {
-    var _this$props$options5, _this$props$options6, _this$wrapper;
+    var _this$props$options10, _this$props$options11, _this$wrapper;
     const {
       view,
       getNode,
@@ -585,7 +600,7 @@ class TableComponent extends React.Component {
       shouldHandleColgroupUpdates = true;
     }
     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);
+    const shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent') || !!isTableScalingEnabled && !!((_this$props$options10 = this.props.options) !== null && _this$props$options10 !== void 0 && _this$props$options10.isCommentEditor);
     if (isTableScalingWithFixedColumnWidthsOptionEnabled && getNode().attrs.displayMode !== 'fixed') {
       shouldScale = true;
       shouldHandleColgroupUpdates = true;
@@ -596,7 +611,7 @@ class TableComponent extends React.Component {
     if (isInDanger && !table) {
       clearHoverSelection()(view.state, view.dispatch);
     }
-    if ((_this$props$options6 = this.props.options) !== null && _this$props$options6 !== void 0 && _this$props$options6.isCommentEditor && options !== null && options !== void 0 && options.isTableResizingEnabled) {
+    if ((_this$props$options11 = this.props.options) !== null && _this$props$options11 !== void 0 && _this$props$options11.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) {
@@ -643,7 +658,7 @@ class TableComponent extends React.Component {
           const start = getPos() || 0;
           const depth = view.state.doc.resolve(start).depth;
           shouldScale = depth === 0 && shouldScale;
-          insertColgroupFromNode(this.table, currentTable, shouldScale, undefined, shouldUseIncreasedScalingPercent);
+          insertColgroupFromNode(this.table, currentTable, shouldScale, undefined, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor);
         }
         updateControls()(view.state);
       }
@@ -683,7 +698,7 @@ class TableComponent extends React.Component {
     }
   }
   render() {
-    var _this$props$options7;
+    var _this$props$options12;
     const {
       view,
       getNode,
@@ -802,7 +817,7 @@ class TableComponent extends React.Component {
       stickyScrollbar,
       tableWithFixedColumnWidthsOption = false
     } = getEditorFeatureFlags();
-    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));
+    const shouldUseIncreasedScalingPercent = !!isTableScalingEnabled && (tableWithFixedColumnWidthsOption && fg('platform.editor.table.use-increased-scaling-percent') || !!((_this$props$options12 = this.props.options) !== null && _this$props$options12 !== void 0 && _this$props$options12.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/TableContainer.js

@@ -11,7 +11,7 @@ import { TableCssClassName as ClassName } from '../types';
 import { ALIGN_CENTER, ALIGN_START } from '../utils/alignment';
 import { getAlignmentStyle } from './table-container-styles';
 import { TableResizer } from './TableResizer';
-export const InnerContainer = /*#__PURE__*/forwardRef(({
+const InnerContainer = /*#__PURE__*/forwardRef(({
   className,
   style,
   node,

package/dist/es2019/nodeviews/TableResizer.js

@@ -325,7 +325,7 @@ export const TableResizer = ({
         prevNode: node,
         start: pos + 1,
         parentWidth: newWidth
-      }, editorView.domAtPos.bind(editorView), pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent || false)(tr);
+      }, editorView.domAtPos.bind(editorView), pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent || false, isCommentEditor)(tr);
       const scaledNode = tr.doc.nodeAt(pos);
       (_attachAnalyticsEvent2 = attachAnalyticsEvent(generateResizedPayload({
         originalNode: node,

package/dist/es2019/plugin.js

@@ -403,7 +403,8 @@ const tablesPlugin = ({
             getEditorContainerWidth: defaultGetEditorContainerWidth,
             getEditorFeatureFlags: (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags,
             isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
-            api: api
+            api: api,
+            isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor
           }), (options === null || options === void 0 ? void 0 : options.allowContextualMenu) && /*#__PURE__*/React.createElement(FloatingContextualMenu, {
             editorView: editorView,
             mountPoint: popupsMountPoint,
@@ -434,7 +435,8 @@ const tablesPlugin = ({
             isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
             getEditorFeatureFlags: (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags,
             ariaNotifyPlugin: ariaNotifyPlugin,
-            api: api
+            api: api,
+            isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor
           }), allowControls && !isDragAndDropEnabled && !isResizing && /*#__PURE__*/React.createElement(FloatingDeleteButton, {
             editorView: editorView,
             selection: editorView.state.selection,

package/dist/es2019/pm-plugins/decorations/utils/index.js

@@ -1,3 +1,2 @@
 export { buildColumnControlsDecorations, maybeUpdateColumnControlsSelectedDecoration } from './column-controls';
-export { buildColumnResizingDecorations, clearColumnResizingDecorations } from './column-resizing';
-export { composeDecorations } from './compose-decorations';
+export { buildColumnResizingDecorations, clearColumnResizingDecorations } from './column-resizing';

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

@@ -7,11 +7,11 @@ import { DropTargetType } from './consts';
 import { createCommand, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
 // TODO: This command is a placeholder example. Please replace this if required.
-export const getDecorations = state => {
+const getDecorations = state => {
   var _pluginKey$getState;
   return ((_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.decorationSet) || DecorationSet.empty;
 };
-export const updatePluginStateDecorations = (state, decorations, key) => updateDecorations(state.doc, getDecorations(state), decorations, key);
+const updatePluginStateDecorations = (state, decorations, key) => updateDecorations(state.doc, getDecorations(state), decorations, key);
 export const setDropTarget = (type, index, hasMergedCells, tr) => createCommand(state => {
   const {
     dropTargetType,

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

@@ -1,3 +1,2 @@
 export { createPlugin } from './plugin';
-export { pluginKey } from './plugin-key';
-export { setDropTarget, clearDropTarget } from './commands';
+export { pluginKey } from './plugin-key';

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

@@ -173,10 +173,13 @@ const destroyFn = (editorView, editorAnalyticsAPI, isTableScalingEnabled, isTabl
             if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
               isTableScalingEnabledOnCurrentTable = tableNode.attrs.displayMode !== 'fixed';
             }
+            if (isTableScalingEnabled && isCommentEditor) {
+              isTableScalingEnabledOnCurrentTable = true;
+            }
             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);
+            insertColgroupFromNode(tableRef, tableNode, isTableScalingEnabledOnCurrentTable, undefined, shouldUseIncreasedScalingPercent, isCommentEditor);
           }
         }
         editorView.focus();

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

@@ -1,2 +1 @@
-export { getDraggableDataFromEvent } from './monitor';
 export { autoScrollerFactory } from './autoscrollers';

package/dist/es2019/pm-plugins/safari-delete-composition-text-issue-workaround.js

@@ -6,7 +6,7 @@
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
-export const tableSafariDeleteCompositionTextIssueWorkaroundKey = new PluginKey('tableSafariDeleteCompositionTextIssueWorkaround');
+const tableSafariDeleteCompositionTextIssueWorkaroundKey = new PluginKey('tableSafariDeleteCompositionTextIssueWorkaround');
 export const createPlugin = () => {
   return new SafePlugin({
     key: tableSafariDeleteCompositionTextIssueWorkaroundKey,

package/dist/es2019/pm-plugins/sticky-headers/index.js

@@ -1,4 +1,3 @@
 export { createPlugin } from './plugin';
 export { pluginKey } from './plugin-key';
-export { findStickyHeaderForTable } from './util';
-export { updateStickyState, removeStickyState } from './commands';
+export { findStickyHeaderForTable } from './util';

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

@@ -4,7 +4,7 @@
 import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION, TABLE_OVERFLOW_CHANGE_TRIGGER } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-export const pluginKey = new PluginKey('tableOverflowAnalyticsPlugin');
+const pluginKey = new PluginKey('tableOverflowAnalyticsPlugin');
 export const META_KEYS = {
   OVERFLOW_TRIGGER: 'tableOverflowTrigger',
   OVERFLOW_STATE_CHANGED: 'tableOverflowStateChanged'

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

@@ -58,7 +58,7 @@ export const setDragging = (dragging, tr) => createCommand({
     dragging
   }
 }, originalTr => (tr || originalTr).setMeta('is-resizer-resizing', true));
-export const setLastClick = (lastClick, transform) => createCommand({
+const setLastClick = (lastClick, transform) => createCommand({
   type: 'SET_LAST_CLICK',
   data: {
     lastClick

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

@@ -13,8 +13,11 @@ import { META_KEYS } from '../table-analytics';
 import { evenColumns, setDragging, stopResizing } from './commands';
 import { getPluginState } from './plugin-factory';
 import { currentColWidth, getResizeState, getTableMaxWidth, pointsAtCell, resizeColumn, resizeColumnAndTable, updateControls } from './utils';
+import { TABLE_OFFSET_IN_COMMENT_EDITOR } from './utils/consts';
+import { getScalingPercentForTableWithoutWidth, getTableScalingPercent } from './utils/misc';
 import { scaleResizeState } from './utils/resize-column';
 export const handleMouseDown = (view, event, localResizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled, api, editorAnalyticsAPI, isNewColumnResizingEnabled, isTableAlignmentEnabled, isCommentEditor) => {
+  var _originalTable$attrs;
   const {
     state,
     dispatch
@@ -48,13 +51,18 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
   if (dom && dom.nodeName !== 'TABLE') {
     dom = dom.closest('table');
   }
-  const maxSize = getTableMaxWidth({
-    table: originalTable,
-    tableStart: start,
-    state,
-    layout: originalTable.attrs.layout,
-    getEditorContainerWidth
-  });
+  let maxSize = 0;
+  if (isTableScalingEnabled && isCommentEditor && !((_originalTable$attrs = originalTable.attrs) !== null && _originalTable$attrs !== void 0 && _originalTable$attrs.width)) {
+    maxSize = editorWidth - TABLE_OFFSET_IN_COMMENT_EDITOR;
+  } else {
+    maxSize = getTableMaxWidth({
+      table: originalTable,
+      tableStart: start,
+      state,
+      layout: originalTable.attrs.layout,
+      getEditorContainerWidth
+    });
+  }
   let shouldScale = tableDepth === 0 && isTableScalingEnabled;
   const {
     tableWithFixedColumnWidthsOption = false
@@ -63,6 +71,11 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
   if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
     shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
   }
+  let shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled && fg('platform.editor.table.use-increased-scaling-percent');
+  if (isTableScalingEnabled && isCommentEditor) {
+    shouldScale = tableDepth === 0;
+    shouldUseIncreasedScalingPercent = true;
+  }
   let resizeState = getResizeState({
     minWidth: tableCellMinWidth,
     maxSize,
@@ -71,9 +84,8 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
     start,
     domAtPos,
     isTableScalingEnabled: shouldScale,
-    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
+    shouldUseIncreasedScalingPercent,
+    isCommentEditor: isCommentEditor || false
   });
   if (evenColumns({
     resizeState,
@@ -102,7 +114,8 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
       resizeState,
       tableRef: dom,
       tableNode: originalTable,
-      editorWidth
+      editorWidth,
+      shouldUseIncreasedScalingPercent
     });
   }
   function finish(event) {
@@ -213,7 +226,9 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
             tr.setNodeAttribute(start - 1, 'width', newResizeState.maxSize);
           }
         } else {
-          const newResizeState = resizeColumn(resizeState, colIndex, resizedDelta, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, shouldScale, shouldUseIncreasedScalingPercent);
+          var _table$attrs;
+          const scalePercent = isTableScalingEnabled && isCommentEditor && !((_table$attrs = table.attrs) !== null && _table$attrs !== void 0 && _table$attrs.width) ? getScalingPercentForTableWithoutWidth(originalTable, dom) : getTableScalingPercent(originalTable, dom, shouldUseIncreasedScalingPercent);
+          const newResizeState = resizeColumn(resizeState, colIndex, resizedDelta, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, shouldScale, scalePercent);
           tr = updateColumnWidths(newResizeState, table, start, api)(tr);
         }
         if (colIndex === map.width - 1) {
@@ -289,7 +304,7 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
       shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
     }
     const resizedDelta = clientX - dragging.startX;
-    if (isNewColumnResizingEnabled && !isTableNested(state, tablePos)) {
+    if (isNewColumnResizingEnabled && !isTableNested(state, tablePos) && !isCommentEditor) {
       resizeColumnAndTable({
         resizeState,
         colIndex,
@@ -301,7 +316,10 @@ export const handleMouseDown = (view, event, localResizeHandlePos, getEditorCont
         isTableAlignmentEnabled
       });
     } else {
-      resizeColumn(resizeState, colIndex, resizedDelta, dom, table, undefined, shouldScale, shouldUseIncreasedScalingPercent);
+      var _table$attrs2;
+      const scalePercent = isTableScalingEnabled && isCommentEditor && !((_table$attrs2 = table.attrs) !== null && _table$attrs2 !== void 0 && _table$attrs2.width) ? getScalingPercentForTableWithoutWidth(table, dom) : getTableScalingPercent(originalTable, dom, shouldUseIncreasedScalingPercent);
+      // This function is called for Full-page/Fixed-page tables and table that have width attr value in Comment editor
+      resizeColumn(resizeState, colIndex, resizedDelta, dom, table, undefined, shouldScale, scalePercent);
     }
     updateControls()(state);
   }

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

@@ -2,7 +2,7 @@ import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { getFragmentBackingArray } from '@atlaskit/editor-common/utils';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
-import { getTableScalingPercent } from './misc';
+import { getScalingPercentForTableWithoutWidth, getTableScalingPercent } from './misc';
 /**
  * This ensures the combined width of the columns (and tbody) of table is always smaller or equal
  * than the table and table wrapper elements. This is necessary as there is no longer
@@ -10,7 +10,7 @@ import { getTableScalingPercent } from './misc';
  * overflow.
  */
 export const getColWidthFix = (colwidth, tableColumnCount) => colwidth - 1 / tableColumnCount;
-export const generateColgroup = (table, tableRef, shouldUseIncreasedScalingPercent) => {
+export const generateColgroup = (table, tableRef, shouldUseIncreasedScalingPercent, isCommentEditor) => {
   const cols = [];
   const map = TableMap.get(table);
   table.content.firstChild.content.forEach(cell => {
@@ -19,7 +19,14 @@ export const generateColgroup = (table, tableRef, shouldUseIncreasedScalingPerce
       // We slice here to guard against our colwidth array having more entries
       // Than the we actually span. We'll patch the document at a later point.
       if (tableRef) {
-        const scalePercent = getTableScalingPercent(table, tableRef, shouldUseIncreasedScalingPercent);
+        var _table$attrs;
+        // if we have tableRef here, isTableScalingEnabled is true
+        let scalePercent = 1;
+        if (isCommentEditor && !((_table$attrs = table.attrs) !== null && _table$attrs !== void 0 && _table$attrs.width)) {
+          scalePercent = getScalingPercentForTableWithoutWidth(table, tableRef);
+        } else {
+          scalePercent = getTableScalingPercent(table, tableRef, shouldUseIncreasedScalingPercent);
+        }
         cell.attrs.colwidth.slice(0, colspan).forEach(width => {
           const fixedColWidth = getColWidthFix(width, map.width);
           const scaledWidth = fixedColWidth * scalePercent;
@@ -48,12 +55,12 @@ export const generateColgroup = (table, tableRef, shouldUseIncreasedScalingPerce
   });
   return cols;
 };
-export const insertColgroupFromNode = (tableRef, table, isTableScalingEnabled = false, shouldRemove = true, shouldUseIncreasedScalingPercent = false) => {
+export const insertColgroupFromNode = (tableRef, table, isTableScalingEnabled = false, shouldRemove = true, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => {
   let colgroup = tableRef === null || tableRef === void 0 ? void 0 : tableRef.querySelector('colgroup');
   if (colgroup && shouldRemove) {
     tableRef === null || tableRef === void 0 ? void 0 : tableRef.removeChild(colgroup);
   }
-  colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef !== null && tableRef !== void 0 ? tableRef : undefined : undefined, shouldUseIncreasedScalingPercent);
+  colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef !== null && tableRef !== void 0 ? tableRef : undefined : undefined, shouldUseIncreasedScalingPercent, isCommentEditor);
   if (shouldRemove) {
     tableRef === null || tableRef === void 0 ? void 0 : tableRef.insertBefore(colgroup, tableRef === null || tableRef === void 0 ? void 0 : tableRef.firstChild);
   }
@@ -62,6 +69,7 @@ export const insertColgroupFromNode = (tableRef, table, isTableScalingEnabled =
 export const hasTableBeenResized = table => {
   return !!getFragmentBackingArray(table.content.firstChild.content).find(cell => cell.attrs.colwidth);
 };
+export const hasTableColumnBeenResized = hasTableBeenResized;
 
 /**
  * Check if a table has all the column width set to tableCellMinWidth(48px) or null
@@ -76,8 +84,8 @@ export const isMinCellWidthTable = table => {
   });
   return isTableMinCellWidth;
 };
-function renderColgroupFromNode(table, maybeTableRef, shouldUseIncreasedScalingPercent) {
-  const rendered = DOMSerializer.renderSpec(document, ['colgroup', {}, ...generateColgroup(table, maybeTableRef, shouldUseIncreasedScalingPercent)]);
+function renderColgroupFromNode(table, maybeTableRef, shouldUseIncreasedScalingPercent, isCommentEditor) {
+  const rendered = DOMSerializer.renderSpec(document, ['colgroup', {}, ...generateColgroup(table, maybeTableRef, shouldUseIncreasedScalingPercent, isCommentEditor)]);
   return rendered.dom;
 }
 export const getColgroupChildrenLength = table => {

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

@@ -1,5 +1,4 @@
 export const COLUMN_MIN_WIDTH = 48;
-export const TABLE_DEFAULT_WIDTH = 760;
 export const TABLE_MAX_WIDTH = 1800;
 export const FULL_WIDTH_EDITOR_CONTENT_WIDTH = 1800;
 export const MAX_SCALING_PERCENT = 0.3;

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

@@ -62,7 +62,7 @@ export const updateStickyMargins = table => {
   const firstRowHeight = row.getBoundingClientRect().height - paddingTop - tableCellBorderWidth;
   table.style.marginTop = `${tableMarginTop + firstRowHeight}px`;
 };
-export const applyColWidthsToStickyRow = (colGroup, headerRow) => {
+const applyColWidthsToStickyRow = (colGroup, headerRow) => {
   // sync column widths for the sticky row
   const newCols = colWidthsForRow(headerRow);
   if (newCols) {
@@ -80,7 +80,7 @@ export const syncStickyRowToTable = tableRef => {
   applyColWidthsToStickyRow(tableRef.querySelector('colgroup'), headerRow);
   applyTableWidthToStickyRow(tableRef, headerRow);
 };
-export const applyTableWidthToStickyRow = (tableRef, headerRow) => {
+const applyTableWidthToStickyRow = (tableRef, headerRow) => {
   const tbody = tableRef.querySelector('tbody');
   const wrapper = tableRef.parentElement;
   if (tbody && wrapper) {

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

@@ -1,10 +1,9 @@
 export { generateColgroup, insertColgroupFromNode, hasTableBeenResized, getColgroupChildrenLength } from './colgroup';
 export { contentWidth } from './content-width';
-export { getColumnStateFromDOM, getFreeSpace, getCellsRefsInColumn, calculateColumnWidth, addContainerLeftRightPadding } from './column-state';
-export { growColumn, shrinkColumn, reduceSpace } from './resize-logic';
-export { getResizeState, updateColgroup, getTotalWidth, evenAllColumnsWidths, bulkColumnsResize, areColumnsEven, adjustColumnsWidths } from './resize-state';
-export { getLayoutSize, getDefaultLayoutMaxWidth, pointsAtCell, currentColWidth, domCellAround, getTableMaxWidth, getTableElementWidth, getTableContainerElementWidth } from './misc';
+export { getCellsRefsInColumn, calculateColumnWidth } from './column-state';
+export { getResizeState, updateColgroup, evenAllColumnsWidths } from './resize-state';
+export { getLayoutSize, pointsAtCell, currentColWidth, getTableMaxWidth, getTableElementWidth, getTableContainerElementWidth } from './misc';
 export { updateControls, isClickNear, getResizeCellPos } from './dom';
-export { scale, scaleWithParent, scaleTable, previewScaleTable } from './scale-table';
+export { scaleTable, previewScaleTable } from './scale-table';
 export { resizeColumn, resizeColumnAndTable } from './resize-column';
-export { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_DEFAULT_WIDTH, MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION, TABLE_OFFSET_IN_COMMENT_EDITOR } from './consts';
+export { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR } from './consts';