@atlaskit/editor-plugin-table 7.31.3 → 8.0.0

package/dist/es2019/event-handlers.js

@@ -414,10 +414,21 @@ export const isTableInFocus = view => {
   var _getPluginState, _getResizePluginState;
   return !!((_getPluginState = getPluginState(view.state)) !== null && _getPluginState !== void 0 && _getPluginState.tableNode) && !((_getResizePluginState = getResizePluginState(view.state)) !== null && _getResizePluginState !== void 0 && _getResizePluginState.dragging);
 };
-export const whenTableInFocus = eventHandler => (view, mouseEvent) => {
+export const whenTableInFocus = (eventHandler, pluginInjectionApi) => (view, mouseEvent) => {
+  var _pluginInjectionApi$e, _pluginInjectionApi$e2;
   if (!isTableInFocus(view)) {
     return false;
   }
+  const isViewMode = (pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$e = pluginInjectionApi.editorViewMode) === null || _pluginInjectionApi$e === void 0 ? void 0 : (_pluginInjectionApi$e2 = _pluginInjectionApi$e.sharedState.currentState()) === null || _pluginInjectionApi$e2 === void 0 ? void 0 : _pluginInjectionApi$e2.mode) === 'view';
+  /**
+   * Table cannot be in focus if we are in view mode.
+   * This will prevent an infinite flow of adding and removing
+   * resize handle decorations in view mode that causes unpredictable
+   * selections.
+   */
+  if (isViewMode) {
+    return false;
+  }
   return eventHandler(view, mouseEvent);
 };
 const trackCellLocation = (view, mouseEvent) => {

package/dist/es2019/nodeviews/TableComponent.js

@@ -137,7 +137,8 @@ class TableComponent extends React.Component {
       const {
         getNode,
         containerWidth,
-        options
+        options,
+        allowTableResizing
       } = this.props;
       const prevNode = this.node;
       const node = getNode();
@@ -172,7 +173,7 @@ class TableComponent extends React.Component {
       // This last check is also to cater for dynamic text sizing changing the 'default' layout width
       // Usually happens on window resize.
       layoutSize !== this.layoutSize || noOfColumnsChanged) {
-        const shouldScaleTable = (!(options !== null && options !== void 0 && options.isTableResizingEnabled) || (options === null || options === void 0 ? void 0 : options.isTableResizingEnabled) && isNested) && !hasNumberedColumnChanged && !noOfColumnsChanged;
+        const shouldScaleTable = (!allowTableResizing || allowTableResizing && isNested) && !hasNumberedColumnChanged && !noOfColumnsChanged;
 
         // If column has been inserted/deleted avoid multi dispatch
         if (shouldScaleTable) {
@@ -182,7 +183,7 @@ class TableComponent extends React.Component {
         }
 
         // only when table resizing is enabled and toggle numbered column to run scaleTable
-        if (options !== null && options !== void 0 && options.isTableResizingEnabled && hasNumberedColumnChanged) {
+        if (allowTableResizing && hasNumberedColumnChanged) {
           if (!hasTableBeenResized(prevNode)) {
             this.scaleTable({
               parentWidth: node.attrs.width
@@ -240,7 +241,7 @@ class TableComponent extends React.Component {
       const {
         dispatchAnalyticsEvent,
         containerWidth,
-        options
+        allowTableResizing
       } = this.props;
       const parentWidth = ((_this$state = this.state) === null || _this$state === void 0 ? void 0 : _this$state.parentWidth) || 0;
       this.initialOverflowCaptureTimerId = setTimeout(() => {
@@ -252,7 +253,7 @@ class TableComponent extends React.Component {
           attributes: {
             editorWidth: containerWidth.width || 0,
             isOverflowing,
-            tableResizingEnabled: (options === null || options === void 0 ? void 0 : options.isTableResizingEnabled) || false,
+            tableResizingEnabled: allowTableResizing || false,
             width: this.node.attrs.width || 0,
             parentWidth
           }
@@ -361,8 +362,8 @@ class TableComponent extends React.Component {
     var _this$table, _this$table2, _this$table3;
     const {
       allowColumnResizing,
+      allowTableResizing,
       eventDispatcher,
-      options,
       isDragAndDropEnabled,
       getNode,
       getEditorFeatureFlags,
@@ -407,7 +408,7 @@ class TableComponent extends React.Component {
        * We no longer use `containerWidth` as a variable to determine an update for table resizing (avoids unnecessary updates).
        * Instead we use the resize event to only trigger updates when necessary.
        */
-      if (!(options !== null && options !== void 0 && options.isTableResizingEnabled)) {
+      if (!allowTableResizing) {
         window.addEventListener('resize', this.handleWindowResizeDebounced);
       }
       this.handleTableResizingDebounced();
@@ -426,8 +427,8 @@ class TableComponent extends React.Component {
     var _this$resizeObserver, _this$wrapperReisizeO, _this$table4, _this$table5, _this$table6;
     const {
       allowColumnResizing,
+      allowTableResizing,
       eventDispatcher,
-      options,
       isDragAndDropEnabled
     } = this.props;
     if (this.wrapper && !isIE11) {
@@ -445,10 +446,10 @@ class TableComponent extends React.Component {
     this.scaleTableDebounced.cancel();
     this.handleTableResizingDebounced.cancel();
     this.handleAutoSizeDebounced.cancel();
-    if (!(options !== null && options !== void 0 && options.isTableResizingEnabled)) {
+    if (!allowTableResizing) {
       this.handleWindowResizeDebounced.cancel();
     }
-    if (!(options !== null && options !== void 0 && options.isTableResizingEnabled) && allowColumnResizing) {
+    if (!allowTableResizing && allowColumnResizing) {
       window.removeEventListener('resize', this.handleWindowResizeDebounced);
     }
     this === null || this === void 0 ? void 0 : (_this$table4 = this.table) === null || _this$table4 === void 0 ? void 0 : _this$table4.removeEventListener('mouseenter', this.handleMouseEnter);
@@ -587,6 +588,7 @@ class TableComponent extends React.Component {
       getNode,
       isMediaFullscreen,
       allowColumnResizing,
+      allowTableResizing,
       isResizing,
       options,
       isTableScalingEnabled,
@@ -623,7 +625,7 @@ class TableComponent extends React.Component {
     if (isInDanger && !table) {
       clearHoverSelection()(view.state, view.dispatch);
     }
-    if ((_this$props$options11 = this.props.options) !== null && _this$props$options11 !== void 0 && _this$props$options11.isCommentEditor && options !== null && options !== void 0 && options.isTableResizingEnabled && !(options !== null && options !== void 0 && options.isTableScalingEnabled)) {
+    if ((_this$props$options11 = this.props.options) !== null && _this$props$options11 !== void 0 && _this$props$options11.isCommentEditor && allowTableResizing && !(options !== null && options !== void 0 && options.isTableScalingEnabled)) {
       this.removeInlineTableWidth();
     }
     if ((_this$wrapper = this.wrapper) !== null && _this$wrapper !== void 0 && _this$wrapper.parentElement && this.table && !this.overflowShadowsObserver) {
@@ -665,7 +667,7 @@ class TableComponent extends React.Component {
         const {
           view
         } = this.props;
-        const shouldRecreateResizeCols = !(options !== null && options !== void 0 && options.isTableResizingEnabled) || !isResizing || isNoOfColumnsChanged && isResizing;
+        const shouldRecreateResizeCols = !allowTableResizing || !isResizing || isNoOfColumnsChanged && isResizing;
         if (shouldRecreateResizeCols) {
           const start = getPos() || 0;
           const depth = view.state.doc.resolve(start).depth;
@@ -728,7 +730,8 @@ class TableComponent extends React.Component {
       getEditorFeatureFlags,
       isTableScalingEnabled,
       // here we can use options.isTableScalingEnabled
-      isTableAlignmentEnabled
+      allowTableResizing,
+      allowTableAlignment
     } = this.props;
     let {
       isInDanger,
@@ -848,12 +851,12 @@ class TableComponent extends React.Component {
       isNested: isNested,
       pluginInjectionApi: pluginInjectionApi,
       tableWrapperHeight: this.state.tableWrapperHeight,
-      isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.isTableResizingEnabled,
+      isTableResizingEnabled: allowTableResizing,
       isResizing: isResizing,
       isTableScalingEnabled: isTableScalingEnabled,
       isTableWithFixedColumnWidthsOptionEnabled: tableWithFixedColumnWidthsOption,
       isWholeTableInDanger: isWholeTableInDanger,
-      isTableAlignmentEnabled: isTableAlignmentEnabled,
+      isTableAlignmentEnabled: allowTableAlignment,
       shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent,
       isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
       isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor

package/dist/es2019/nodeviews/TableComponentWithSharedState.js

@@ -16,7 +16,9 @@ export const TableComponentWithSharedState = ({
   allowColumnResizing,
   allowControls,
   getPos,
-  forwardRef
+  forwardRef,
+  allowTableAlignment,
+  allowTableResizing
 }) => {
   const {
     widthState,
@@ -65,7 +67,8 @@ export const TableComponentWithSharedState = ({
     isHeaderColumnEnabled: isHeaderColumnEnabled,
     isDragAndDropEnabled: options === null || options === void 0 ? void 0 : options.isDragAndDropEnabled,
     isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
-    isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled,
+    allowTableAlignment: allowTableAlignment,
+    allowTableResizing: allowTableResizing,
     tableActive: tableActive,
     ordering: ordering,
     isResizing: isResizing,

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

@@ -7,7 +7,7 @@ import TableRow from './TableRow';
 export const lazyTableView = options => {
   if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return (node, view, getPos) => {
-      return createTableView(node, view, getPos, options.portalProviderAPI, options.eventDispatcher, options.getEditorContainerWidth, options.getEditorFeatureFlags, options.dispatchAnalyticsEvent, options.pluginInjectionApi, options.isTableAlignmentEnabled, options.isCommentEditor, options.isChromelessEditor);
+      return createTableView(node, view, getPos, options.portalProviderAPI, options.eventDispatcher, options.getEditorContainerWidth, options.getEditorFeatureFlags, options.dispatchAnalyticsEvent, options.pluginInjectionApi, options.isCommentEditor, options.isChromelessEditor);
     };
   }
   const loader = () => {
@@ -23,11 +23,10 @@ export const lazyTableView = options => {
           getEditorFeatureFlags,
           dispatchAnalyticsEvent,
           pluginInjectionApi,
-          isTableAlignmentEnabled,
           isCommentEditor,
           isChromelessEditor
         } = getNodeViewOptions();
-        return createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isTableAlignmentEnabled, isCommentEditor, isChromelessEditor);
+        return createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isCommentEditor, isChromelessEditor);
       };
     });
     return result;

package/dist/es2019/nodeviews/table.js

@@ -27,15 +27,15 @@ const tableAttributes = node => {
     'data-table-display-mode': node.attrs.displayMode
   };
 };
-const getInlineWidth = (node, options, state, pos) => {
-  if (!node.attrs.width && options !== null && options !== void 0 && options.isCommentEditor && options !== null && options !== void 0 && options.isTableResizingEnabled) {
+const getInlineWidth = (node, options, state, pos, allowTableResizing) => {
+  if (!node.attrs.width && options !== null && options !== void 0 && options.isCommentEditor && allowTableResizing) {
     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
-  const shouldHaveInlineWidth = (options === null || options === void 0 ? void 0 : options.isTableResizingEnabled) && !isTableNested(state, pos);
+  const shouldHaveInlineWidth = allowTableResizing && !isTableNested(state, pos);
   let widthValue = getTableContainerWidth(node);
   if (node.attrs.isNumberColumnEnabled) {
     widthValue -= akEditorTableNumberColumnWidth;
@@ -73,7 +73,7 @@ export default class TableView extends ReactNodeView {
       var _this$options, _this$options2, _this$getEditorFeatur;
       this.table = rendered.dom;
       if (!((_this$options = this.options) !== null && _this$options !== void 0 && _this$options.isTableScalingEnabled) || (_this$options2 = this.options) !== null && _this$options2 !== void 0 && _this$options2.isTableScalingEnabled && (_this$getEditorFeatur = this.getEditorFeatureFlags) !== null && _this$getEditorFeatur !== void 0 && _this$getEditorFeatur.call(this).tableWithFixedColumnWidthsOption && this.node.attrs.displayMode === 'fixed') {
-        const tableInlineWidth = getInlineWidth(this.node, this.reactComponentProps.options, this.reactComponentProps.view.state, this.reactComponentProps.getPos());
+        const tableInlineWidth = getInlineWidth(this.node, this.reactComponentProps.options, this.reactComponentProps.view.state, this.reactComponentProps.getPos(), this.reactComponentProps.allowTableResizing);
         if (tableInlineWidth) {
           handleInlineTableWidth(this.table, tableInlineWidth);
         }
@@ -95,7 +95,7 @@ export default class TableView extends ReactNodeView {
     if (!((_this$options3 = this.options) !== null && _this$options3 !== void 0 && _this$options3.isTableScalingEnabled) || (_this$options4 = this.options) !== null && _this$options4 !== void 0 && _this$options4.isTableScalingEnabled && (_this$getEditorFeatur2 = this.getEditorFeatureFlags) !== null && _this$getEditorFeatur2 !== void 0 && _this$getEditorFeatur2.call(this).tableWithFixedColumnWidthsOption && node.attrs.displayMode === 'fixed') {
       var _tableWidthPluginKey$;
       // handle inline style when table been resized
-      const tableInlineWidth = getInlineWidth(node, this.reactComponentProps.options, this.view.state, this.getPos());
+      const tableInlineWidth = getInlineWidth(node, this.reactComponentProps.options, this.view.state, this.getPos(), this.reactComponentProps.allowTableResizing);
       const isTableResizing = (_tableWidthPluginKey$ = tableWidthPluginKey.getState(this.view.state)) === null || _tableWidthPluginKey$ === void 0 ? void 0 : _tableWidthPluginKey$.resizing;
       if (!isTableResizing && tableInlineWidth) {
         handleInlineTableWidth(this.table, tableInlineWidth);
@@ -112,6 +112,8 @@ export default class TableView extends ReactNodeView {
         eventDispatcher: props.eventDispatcher,
         api: props.pluginInjectionApi,
         allowColumnResizing: props.allowColumnResizing,
+        allowTableAlignment: props.allowTableAlignment,
+        allowTableResizing: props.allowTableResizing,
         allowControls: props.allowControls,
         getPos: props.getPos,
         getEditorFeatureFlags: props.getEditorFeatureFlags,
@@ -149,7 +151,7 @@ export default class TableView extends ReactNodeView {
       },
       editorView: props.view,
       render: pluginStates => {
-        var _props$options, _props$options2;
+        var _props$options;
         const {
           tableResizingPluginState,
           tableWidthPluginState,
@@ -185,7 +187,8 @@ export default class TableView extends ReactNodeView {
           isDragAndDropEnabled: pluginState.isDragAndDropEnabled,
           isTableScalingEnabled: (_props$options = props.options) === null || _props$options === void 0 ? void 0 : _props$options.isTableScalingEnabled // this.options?.isTableScalingEnabled same as TableOptions.isTableScalingEnabled same as pluginState.isTableScalingEnabled
           ,
-          isTableAlignmentEnabled: (_props$options2 = props.options) === null || _props$options2 === void 0 ? void 0 : _props$options2.isTableAlignmentEnabled,
+          allowTableAlignment: props.allowTableAlignment,
+          allowTableResizing: props.allowTableResizing,
           tableActive: tableActive,
           ordering: pluginState.ordering,
           isResizing: isResizing,
@@ -258,23 +261,26 @@ export default class TableView extends ReactNodeView {
     super.destroy();
   }
 }
-export const createTableView = (node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isTableAlignmentEnabled, isCommentEditor, isChromelessEditor) => {
+export const createTableView = (node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isCommentEditor, isChromelessEditor) => {
   const {
     pluginConfig,
     isFullWidthModeEnabled,
     wasFullWidthModeEnabled,
-    isTableResizingEnabled,
     isDragAndDropEnabled,
     isTableScalingEnabled // same as options.isTableScalingEnabled
   } = getPluginState(view.state);
   const {
     allowColumnResizing,
-    allowControls
+    allowControls,
+    allowTableResizing,
+    allowTableAlignment
   } = getPluginConfig(pluginConfig);
   return new TableView({
     node,
     view,
     allowColumnResizing,
+    allowTableResizing,
+    allowTableAlignment,
     allowControls,
     portalProviderAPI,
     eventDispatcher,
@@ -282,11 +288,9 @@ export const createTableView = (node, view, getPos, portalProviderAPI, eventDisp
     options: {
       isFullWidthModeEnabled,
       wasFullWidthModeEnabled,
-      isTableResizingEnabled,
       isDragAndDropEnabled,
       isTableScalingEnabled,
       // same as options.isTableScalingEnabled
-      isTableAlignmentEnabled,
       isCommentEditor,
       isChromelessEditor
     },

package/dist/es2019/plugin.js

@@ -107,11 +107,11 @@ const tablesPlugin = ({
         var _api$contentInsertion, _api$contentInsertion2, _api$contentInsertion3;
         const node = createTableWithWidth({
           isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
-          isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled,
+          isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
           isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
           isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
           isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
-          isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableResizingEnabled
+          isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing
         })(state.schema);
 
         // If the cursor is inside a table
@@ -147,7 +147,7 @@ const tablesPlugin = ({
       }
     },
     commands: {
-      insertTableWithSize: insertTableWithSize(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, options === null || options === void 0 ? void 0 : options.isCommentEditor)
+      insertTableWithSize: insertTableWithSize(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, options === null || options === void 0 ? void 0 : options.isCommentEditor)
     },
     nodes() {
       const {
@@ -158,7 +158,7 @@ const tablesPlugin = ({
         name: 'table',
         node: tableNodeSpecWithFixedToDOM({
           allowColumnResizing: Boolean(allowColumnResizing),
-          tableResizingEnabled: Boolean(options === null || options === void 0 ? void 0 : options.tableResizingEnabled),
+          tableResizingEnabled: Boolean(options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing),
           getEditorContainerWidth: defaultGetEditorContainerWidth,
           isNestingSupported
         })
@@ -175,7 +175,7 @@ const tablesPlugin = ({
         name: 'table',
         node: tableNodeSpecWithFixedToDOM({
           allowColumnResizing: Boolean(allowColumnResizing),
-          tableResizingEnabled: Boolean(options === null || options === void 0 ? void 0 : options.tableResizingEnabled),
+          tableResizingEnabled: Boolean(options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing),
           getEditorContainerWidth: defaultGetEditorContainerWidth,
           isNestingSupported
         })
@@ -204,16 +204,14 @@ const tablesPlugin = ({
           const {
             fullWidthEnabled,
             wasFullWidthEnabled,
-            tableResizingEnabled,
             tableOptions,
             getEditorFeatureFlags,
             dragAndDropEnabled,
             isTableScalingEnabled,
-            isTableAlignmentEnabled,
             isCommentEditor,
             isChromelessEditor
           } = options || {};
-          return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor);
+          return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor);
         }
       }, {
         name: 'tablePMColResizing',
@@ -226,15 +224,15 @@ const tablesPlugin = ({
             tableOptions,
             getEditorFeatureFlags,
             isTableScalingEnabled,
-            isNewColumnResizingEnabled,
-            isTableAlignmentEnabled
+            isNewColumnResizingEnabled
           } = options || {};
           const {
-            allowColumnResizing
+            allowColumnResizing,
+            allowTableAlignment
           } = pluginConfig(tableOptions);
           return allowColumnResizing ? createFlexiResizingPlugin(dispatch, {
             lastColumnResizable: !fullWidthEnabled
-          }, defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled || false, isNewColumnResizingEnabled, isTableAlignmentEnabled, !!(options !== null && options !== void 0 && options.isCommentEditor)) : undefined;
+          }, defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled || false, isNewColumnResizingEnabled, allowTableAlignment, !!(options !== null && options !== void 0 && options.isCommentEditor)) : undefined;
         }
       }, {
         name: 'tableEditing',
@@ -251,13 +249,12 @@ const tablesPlugin = ({
           const {
             dragAndDropEnabled,
             isTableScalingEnabled = false,
-            isTableAlignmentEnabled = false,
             fullWidthEnabled = false,
             isCommentEditor = false,
             isChromelessEditor = false,
-            tableResizingEnabled = false
+            tableOptions
           } = options || {};
-          return keymapPlugin(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled, isTableAlignmentEnabled, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableResizingEnabled);
+          return keymapPlugin(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
         }
       }, {
         name: 'tableSelectionKeymap',
@@ -319,16 +316,16 @@ const tablesPlugin = ({
           dispatchAnalyticsEvent,
           dispatch
         }) => {
-          var _options$fullWidthEna, _options$isTableScali, _options$isTableAlign, _options$isCommentEdi;
-          return options !== null && options !== void 0 && options.tableResizingEnabled ? createTableWidthPlugin(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, (_options$isCommentEdi = options === null || options === void 0 ? void 0 : options.isCommentEditor) !== null && _options$isCommentEdi !== void 0 ? _options$isCommentEdi : false) : undefined;
+          var _options$fullWidthEna, _options$isTableScali, _options$tableOptions, _options$isCommentEdi;
+          return options !== null && options !== void 0 && options.tableOptions.allowTableResizing ? createTableWidthPlugin(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$isTableScali = options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$tableOptions = options.tableOptions.allowTableResizing) !== null && _options$tableOptions !== void 0 ? _options$tableOptions : false, (_options$isCommentEdi = options.isCommentEditor) !== null && _options$isCommentEdi !== void 0 ? _options$isCommentEdi : false) : undefined;
         }
       }, {
         name: 'tableWidthInCommentFix',
         plugin: ({
           dispatch
         }) => {
-          var _options$isTableAlign2;
-          return options !== null && options !== void 0 && options.tableResizingEnabled && options !== null && options !== void 0 && options.isCommentEditor ? createTableWidthInCommentFixPlugin(dispatch, (_options$isTableAlign2 = options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled) !== null && _options$isTableAlign2 !== void 0 ? _options$isTableAlign2 : false) : undefined;
+          var _options$tableOptions2;
+          return options !== null && options !== void 0 && options.tableOptions.allowTableResizing && options !== null && options !== void 0 && options.isCommentEditor ? createTableWidthInCommentFixPlugin(dispatch, (_options$tableOptions2 = options.tableOptions.allowTableAlignment) !== null && _options$tableOptions2 !== void 0 ? _options$tableOptions2 : false) : undefined;
         }
       },
       // TODO: should be deprecated and eventually replaced with 'tableAnalyticsPlugin'
@@ -338,8 +335,8 @@ const tablesPlugin = ({
           dispatch,
           dispatchAnalyticsEvent
         }) => {
-          var _options$tableResizin;
-          return createTableOverflowAnalyticsPlugin(dispatch, dispatchAnalyticsEvent, (_options$tableResizin = options === null || options === void 0 ? void 0 : options.tableResizingEnabled) !== null && _options$tableResizin !== void 0 ? _options$tableResizin : false);
+          var _options$tableOptions3;
+          return createTableOverflowAnalyticsPlugin(dispatch, dispatchAnalyticsEvent, (_options$tableOptions3 = options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing) !== null && _options$tableOptions3 !== void 0 ? _options$tableOptions3 : false);
         }
       }, {
         name: 'tableAnalyticsPlugin',
@@ -506,7 +503,7 @@ const tablesPlugin = ({
             isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
             editorAnalyticsAPI: editorAnalyticsAPI,
             api: api
-          }), ((options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) || (options === null || options === void 0 ? void 0 : options.tableResizingEnabled) && options.isCommentEditor) && isTableResizing && widthToWidest && resizingTableLocalId && resizingTableRef && widthToWidest[resizingTableLocalId] && /*#__PURE__*/React.createElement(FloatingToolbarLabel, {
+          }), ((options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) || (options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing) && options.isCommentEditor) && isTableResizing && widthToWidest && resizingTableLocalId && resizingTableRef && widthToWidest[resizingTableLocalId] && /*#__PURE__*/React.createElement(FloatingToolbarLabel, {
             target: resizingTableRef,
             content: /*#__PURE__*/React.createElement(FullWidthDisplay, null),
             alignX: 'center',
@@ -536,11 +533,11 @@ const tablesPlugin = ({
           const tableState = api === null || api === void 0 ? void 0 : (_api$table = api.table) === null || _api$table === void 0 ? void 0 : _api$table.sharedState.currentState();
           const tableNode = createTableWithWidth({
             isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
-            isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.isTableAlignmentEnabled,
+            isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
             isFullWidthModeEnabled: tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled,
             isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
             isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
-            isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableResizingEnabled
+            isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing
           })(state.schema);
           let {
             tr

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

@@ -19,7 +19,7 @@ import { isHeaderRowRequired, transformSliceTableLayoutDefaultToCenter } from '.
 import { defaultHoveredCell, defaultTableSelection } from './default-table-selection';
 import { createPluginState, getPluginState } from './plugin-factory';
 import { pluginKey } from './plugin-key';
-export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor) => {
+export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor) => {
   var _accessibilityUtils;
   const state = createPluginState(dispatch, {
     pluginConfig,
@@ -28,7 +28,6 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
     insertRowButtonIndex: undefined,
     isFullWidthModeEnabled: fullWidthModeEnabled,
     wasFullWidthModeEnabled: previousFullWidthModeEnabled,
-    isTableResizingEnabled: tableResizingEnabled,
     isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
     isHeaderColumnEnabled: false,
     isDragAndDropEnabled: dragAndDropEnabled,
@@ -168,7 +167,7 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
 
         // fix for when pasting a table with default layout into comment editor
         // table lose width and expand to full width
-        if (!insideTable(editorState) && isCommentEditor && isTableAlignmentEnabled && isTableScalingEnabled) {
+        if (!insideTable(editorState) && isCommentEditor && pluginConfig.allowTableAlignment && isTableScalingEnabled) {
           slice = transformSliceTableLayoutDefaultToCenter(slice, schema);
         }
         slice = transformSliceToFixHardBreakProblemOnCopyFromCell(slice, schema);
@@ -262,7 +261,6 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
           getEditorFeatureFlags,
           dispatchAnalyticsEvent,
           pluginInjectionApi,
-          isTableAlignmentEnabled,
           isCommentEditor,
           isChromelessEditor
         }),
@@ -283,7 +281,7 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
         blur: handleBlur,
         mousedown: withCellTracking(handleMouseDown),
         mouseleave: handleMouseLeave,
-        mousemove: whenTableInFocus(handleMouseMove(nodeViewPortalProviderAPI)),
+        mousemove: whenTableInFocus(handleMouseMove(nodeViewPortalProviderAPI), pluginInjectionApi),
         mouseenter: handleMouseEnter,
         mouseup: whenTableInFocus(handleMouseUp),
         click: withCellTracking(whenTableInFocus(handleClick))

package/dist/es2019/toolbar.js

@@ -366,7 +366,7 @@ export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAP
       return element;
     };
     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 alignmentMenu = config.allowTableAlignment && !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 cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor);
     const columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
     const colorPicker = getColorPicker(state, menu, intl, editorAnalyticsAPI, getEditorView);

package/dist/esm/event-handlers.js

@@ -398,11 +398,22 @@ export var isTableInFocus = function isTableInFocus(view) {
   var _getPluginState10, _getResizePluginState;
   return !!((_getPluginState10 = getPluginState(view.state)) !== null && _getPluginState10 !== void 0 && _getPluginState10.tableNode) && !((_getResizePluginState = getResizePluginState(view.state)) !== null && _getResizePluginState !== void 0 && _getResizePluginState.dragging);
 };
-export var whenTableInFocus = function whenTableInFocus(eventHandler) {
+export var whenTableInFocus = function whenTableInFocus(eventHandler, pluginInjectionApi) {
   return function (view, mouseEvent) {
+    var _pluginInjectionApi$e;
     if (!isTableInFocus(view)) {
       return false;
     }
+    var isViewMode = (pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$e = pluginInjectionApi.editorViewMode) === null || _pluginInjectionApi$e === void 0 || (_pluginInjectionApi$e = _pluginInjectionApi$e.sharedState.currentState()) === null || _pluginInjectionApi$e === void 0 ? void 0 : _pluginInjectionApi$e.mode) === 'view';
+    /**
+     * Table cannot be in focus if we are in view mode.
+     * This will prevent an infinite flow of adding and removing
+     * resize handle decorations in view mode that causes unpredictable
+     * selections.
+     */
+    if (isViewMode) {
+      return false;
+    }
     return eventHandler(view, mouseEvent);
   };
 };