@atlaskit/editor-plugin-table 10.9.6 → 10.9.8

package/dist/es2019/ui/ContentComponent.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
 import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import FloatingContextualButton from './FloatingContextualButton';
 import FloatingContextualMenu from './FloatingContextualMenu';
 import FloatingDeleteButton from './FloatingDeleteButton';
@@ -12,11 +12,8 @@ import FloatingDragMenu from './FloatingDragMenu';
 import FloatingInsertButton from './FloatingInsertButton';
 import { FloatingToolbarLabel } from './FloatingToolbarLabel/FloatingToolbarLabel';
 import { GlobalStylesWrapper } from './global-styles';
+import { useInternalTablePluginStateSelector } from './hooks/useInternalTablePluginStateSelector';
 import { FullWidthDisplay } from './TableFullWidthLabel';
-const useSharedTablePluginStateSelector = (api, key) => {
-  const value = useSharedPluginStateSelector(api, `table.${key}`);
-  return value;
-};
 const ContentComponentInternal = ({
   api,
   editorView,
@@ -31,30 +28,72 @@ const ContentComponentInternal = ({
   var _api$analytics, _api$accessibilityUti;
   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 resizingTableLocalId = useSharedTablePluginStateSelector(api, 'resizingTableLocalId');
-  const resizingTableRef = useSharedTablePluginStateSelector(api, 'resizingTableRef');
-  const isTableResizing = useSharedTablePluginStateSelector(api, 'isTableResizing');
-  const isResizing = useSharedTablePluginStateSelector(api, 'isResizing');
-  const widthToWidest = useSharedTablePluginStateSelector(api, 'widthToWidest');
-  const tableNode = useSharedTablePluginStateSelector(api, 'tableNode');
-  const targetCellPosition = useSharedTablePluginStateSelector(api, 'targetCellPosition');
-  const isContextualMenuOpen = useSharedTablePluginStateSelector(api, 'isContextualMenuOpen');
-  const tableRef = useSharedTablePluginStateSelector(api, 'tableRef');
-  const pluginConfig = useSharedTablePluginStateSelector(api, 'pluginConfig');
-  const insertColumnButtonIndex = useSharedTablePluginStateSelector(api, 'insertColumnButtonIndex');
-  const insertRowButtonIndex = useSharedTablePluginStateSelector(api, 'insertRowButtonIndex');
-  const isHeaderColumnEnabled = useSharedTablePluginStateSelector(api, 'isHeaderColumnEnabled');
-  const isHeaderRowEnabled = useSharedTablePluginStateSelector(api, 'isHeaderRowEnabled');
-  const isDragAndDropEnabled = useSharedTablePluginStateSelector(api, 'isDragAndDropEnabled');
-  const tableWrapperTarget = useSharedTablePluginStateSelector(api, 'tableWrapperTarget');
-  const isCellMenuOpenByKeyboard = useSharedTablePluginStateSelector(api, 'isCellMenuOpenByKeyboard');
+  const resizingTableLocalId = useInternalTablePluginStateSelector(api, 'resizingTableLocalId', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const resizingTableRef = useInternalTablePluginStateSelector(api, 'resizingTableRef', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isTableResizing = useInternalTablePluginStateSelector(api, 'isTableResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isResizing = useInternalTablePluginStateSelector(api, 'isResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const widthToWidest = useInternalTablePluginStateSelector(api, 'widthToWidest', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const tableNode = useInternalTablePluginStateSelector(api, 'tableNode', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const targetCellPosition = useInternalTablePluginStateSelector(api, 'targetCellPosition', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isContextualMenuOpen = useInternalTablePluginStateSelector(api, 'isContextualMenuOpen', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const tableRef = useInternalTablePluginStateSelector(api, 'tableRef', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const pluginConfig = useInternalTablePluginStateSelector(api, 'pluginConfig', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const insertColumnButtonIndex = useInternalTablePluginStateSelector(api, 'insertColumnButtonIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const insertRowButtonIndex = useInternalTablePluginStateSelector(api, 'insertRowButtonIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isHeaderColumnEnabled = useInternalTablePluginStateSelector(api, 'isHeaderColumnEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isHeaderRowEnabled = useInternalTablePluginStateSelector(api, 'isHeaderRowEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isDragAndDropEnabled = useInternalTablePluginStateSelector(api, 'isDragAndDropEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const tableWrapperTarget = useInternalTablePluginStateSelector(api, 'tableWrapperTarget', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isCellMenuOpenByKeyboard = useInternalTablePluginStateSelector(api, 'isCellMenuOpenByKeyboard', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
   const {
     allowControls
-  } = pluginConfig;
-  const stickyHeader = useSharedTablePluginStateSelector(api, 'stickyHeader');
-  const dragMenuDirection = useSharedTablePluginStateSelector(api, 'dragMenuDirection');
-  const dragMenuIndex = useSharedTablePluginStateSelector(api, 'dragMenuIndex');
-  const isDragMenuOpen = useSharedTablePluginStateSelector(api, 'isDragMenuOpen');
+  } = pluginConfig !== null && pluginConfig !== void 0 ? pluginConfig : {};
+  const stickyHeader = useInternalTablePluginStateSelector(api, 'stickyHeader', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const dragMenuDirection = useInternalTablePluginStateSelector(api, 'dragMenuDirection', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const dragMenuIndex = useInternalTablePluginStateSelector(api, 'dragMenuIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isDragMenuOpen = useInternalTablePluginStateSelector(api, 'isDragMenuOpen', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
   return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
     isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
     editorView: editorView,

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

@@ -7,7 +7,6 @@ import { injectIntl } from 'react-intl-next';
 import { browser } from '@atlaskit/editor-common/browser';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findTable, TableMap } from '@atlaskit/editor-tables';
 import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
@@ -19,6 +18,7 @@ import { findDuplicatePosition, hasMergedCellsInSelection } from '../../pm-plugi
 import { TableCssClassName as ClassName } from '../../types';
 import { dragTableInsertColumnButtonSize } from '../consts';
 import { DragPreview } from '../DragPreview';
+import { useInternalTablePluginStateSelector } from '../hooks/useInternalTablePluginStateSelector';
 import { HandleIconComponent } from './HandleIconComponent';
 const DragHandleComponent = ({
   isDragMenuTarget,
@@ -275,13 +275,13 @@ const DragHandleComponentWithSharedState = ({
   });
 
   // hoveredColumns
-  const hoveredColumnsSelector = useSharedPluginStateSelector(api, 'table.hoveredColumns', {
+  const hoveredColumnsSelector = useInternalTablePluginStateSelector(api, 'hoveredColumns', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   const hoveredColumns = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? hoveredColumnsSelector : tableState === null || tableState === void 0 ? void 0 : tableState.hoveredColumns;
 
   // hoveredRows
-  const hoveredRowsSelector = useSharedPluginStateSelector(api, 'table.hoveredRows', {
+  const hoveredRowsSelector = useInternalTablePluginStateSelector(api, 'hoveredRows', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   const hoveredRows = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? hoveredRowsSelector : tableState === null || tableState === void 0 ? void 0 : tableState.hoveredRows;

package/dist/es2019/ui/hooks/useInternalTablePluginStateSelector.js

@@ -0,0 +1,21 @@
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+/**
+ * **This hook is only for internal use and should not be used outside of the table plugin.**
+ *
+ * Hook to select a value from the internal table plugin state.
+ * This is a wrapper around `useSharedPluginStateSelector` to provide access to the entire
+ * `TableSharedStateInternal` type. Since tables plugin has a lot of internal state that is not
+ * exposed via the `TableSharedState` type, we need to use this hook to access it in a type safe way.
+ *
+ * @param api The editor API
+ * @param key Key of TableSharedStateInternal to select
+ * @returns
+ */
+export const useInternalTablePluginStateSelector = (api, key, options) => {
+  // Need to disable the eslint rule here because the key is for the TableSharedStateInternal type
+  // and we are using it as a string to access the value in the useSharedPluginStateSelector
+  // which is typed only for the public TableSharedState type.
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const value = useSharedPluginStateSelector(api, `table.${key}`, options);
+  return value;
+};

package/dist/esm/nodeviews/TableComponent.js

@@ -248,6 +248,11 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       )(state.tr);
       if (!isUserTriggered) {
         tintDirtyTransaction(tr);
+        if (fg('platform_editor_fix_table_resizing_undo')) {
+          // Avoid adding this transaction separately to the history as these are automatic updates
+          // as a consequence of another action
+          tr.setMeta('addToHistory', false);
+        }
       }
       dispatch(tr);
     });

package/dist/esm/nodeviews/TableComponentWithSharedState.js

@@ -3,18 +3,12 @@ import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { findTable } from '@atlaskit/editor-tables';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import { useInternalTablePluginStateSelector } from '../ui/hooks/useInternalTablePluginStateSelector';
 import TableComponent from './TableComponent';
 
 // Ignored via go/ees005
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
-var useSharedTablePluginStateSelector = function useSharedTablePluginStateSelector(api, key) {
-  var value = useSharedPluginStateSelector(api, "table.".concat(key), {
-    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
-  });
-  return value;
-};
-
 /**
  * Use useSharedPluginState to control re-renders from plugin dependencies
  */
@@ -40,16 +34,36 @@ export var TableComponentWithSharedState = function TableComponentWithSharedStat
     mediaState = _useSharedPluginState.mediaState,
     selectionState = _useSharedPluginState.selectionState,
     editorViewModeState = _useSharedPluginState.editorViewModeState;
-  var isTableResizingSelector = useSharedTablePluginStateSelector(api, 'isTableResizing');
-  var isHeaderColumnEnabledSelector = useSharedTablePluginStateSelector(api, 'isHeaderColumnEnabled');
-  var isHeaderRowEnabledSelector = useSharedTablePluginStateSelector(api, 'isHeaderRowEnabled');
-  var orderingSelector = useSharedTablePluginStateSelector(api, 'ordering');
-  var isResizingSelector = useSharedTablePluginStateSelector(api, 'isResizing');
-  var isInDangerSelector = useSharedTablePluginStateSelector(api, 'isInDanger');
-  var hoveredCellSelector = useSharedTablePluginStateSelector(api, 'hoveredCell');
-  var hoveredRowsSelector = useSharedTablePluginStateSelector(api, 'hoveredRows');
-  var isTableHoveredSelector = useSharedTablePluginStateSelector(api, 'isTableHovered');
-  var isWholeTableInDangerSelector = useSharedTablePluginStateSelector(api, 'isWholeTableInDanger');
+  var isTableResizingSelector = useInternalTablePluginStateSelector(api, 'isTableResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isHeaderColumnEnabledSelector = useInternalTablePluginStateSelector(api, 'isHeaderColumnEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isHeaderRowEnabledSelector = useInternalTablePluginStateSelector(api, 'isHeaderRowEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var orderingSelector = useInternalTablePluginStateSelector(api, 'ordering', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isResizingSelector = useInternalTablePluginStateSelector(api, 'isResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isInDangerSelector = useInternalTablePluginStateSelector(api, 'isInDanger', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var hoveredCellSelector = useInternalTablePluginStateSelector(api, 'hoveredCell', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var hoveredRowsSelector = useInternalTablePluginStateSelector(api, 'hoveredRows', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isTableHoveredSelector = useInternalTablePluginStateSelector(api, 'isTableHovered', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isWholeTableInDangerSelector = useInternalTablePluginStateSelector(api, 'isWholeTableInDanger', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
 
   // mediaState
   var isFullscreenSelector = useSharedPluginStateSelector(api, 'media.isFullscreen', {
@@ -117,8 +131,8 @@ export var TableComponentWithSharedState = function TableComponentWithSharedStat
     isMediaFullscreen: isFullscreen,
     options: options,
     allowControls: allowControls,
-    isHeaderRowEnabled: isHeaderRowEnabled,
-    isHeaderColumnEnabled: isHeaderColumnEnabled,
+    isHeaderRowEnabled: isHeaderRowEnabled !== null && isHeaderRowEnabled !== void 0 ? isHeaderRowEnabled : false,
+    isHeaderColumnEnabled: isHeaderColumnEnabled !== null && isHeaderColumnEnabled !== void 0 ? isHeaderColumnEnabled : false,
     isDragAndDropEnabled: (options === null || options === void 0 ? void 0 : options.isDragAndDropEnabled) && !isLivePageViewMode,
     isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
     allowTableAlignment: allowTableAlignment,

package/dist/esm/nodeviews/TableContainer.js

@@ -58,7 +58,7 @@ var AlignmentTableContainer = function AlignmentTableContainer(_ref2) {
   });
   var wasFullWidthModeEnabled = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? wasFullWidthModeEnabledSelector : tableState === null || tableState === void 0 ? void 0 : tableState.wasFullWidthModeEnabled;
   useEffect(function () {
-    if (editorExperiment('platform_editor_usesharedpluginstateselector', false) && !tableState) {
+    if (!tableState && editorExperiment('platform_editor_usesharedpluginstateselector', false)) {
       return;
     }
     if (editorView && getPos) {

package/dist/esm/nodeviews/TableResizer.js

@@ -13,7 +13,6 @@ import { focusTableResizer, ToolTipContent } from '@atlaskit/editor-common/keyma
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';
 import { logException } from '@atlaskit/editor-common/monitoring';
 import { ResizerNext } from '@atlaskit/editor-common/resizer';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
 import { akEditorGutterPaddingDynamic } from '@atlaskit/editor-shared-styles';
 import { findTable } from '@atlaskit/editor-tables/utils';
@@ -31,6 +30,7 @@ import { generateResizedPayload, generateResizeFrameRatePayloads, useMeasureFram
 import { defaultGuidelines, defaultGuidelinesForPreserveTable, PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET } from '../pm-plugins/utils/guidelines';
 import { defaultSnappingWidths, defaultTablePreserveSnappingWidths, findClosestSnap, PRESERVE_TABLE_SNAPPING_LENGTH_OFFSET } from '../pm-plugins/utils/snapping';
 import { TABLE_GUIDELINE_VISIBLE_ADJUSTMENT, TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE, TABLE_SNAP_GAP } from '../ui/consts';
+import { useInternalTablePluginStateSelector } from '../ui/hooks/useInternalTablePluginStateSelector';
 var RESIZE_STEP_VALUE = 10;
 var handles = {
   right: true
@@ -133,7 +133,7 @@ export var TableResizer = function TableResizer(_ref) {
     tableState = _useSharedPluginState.tableState;
 
   // widthToWidest
-  var widthToWidestSelector = useSharedPluginStateSelector(pluginInjectionApi, 'table.widthToWidest', {
+  var widthToWidestSelector = useInternalTablePluginStateSelector(pluginInjectionApi, 'widthToWidest', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   var widthToWidest = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? widthToWidestSelector : tableState.widthToWidest;

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

@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { updateColumnWidths } from '../../transforms/column-width';
 import { getTableWidth } from '../../utils/nodes';
 import { getLayoutSize } from '../utils/misc';
@@ -169,9 +170,9 @@ export var scaleTable = function scaleTable(tableRef, options, domAtPos, api) {
     }
     if (resizeState) {
       tr = updateColumnWidths(resizeState, node, start, api)(tr);
-      // Avoid adding this transaction separately to the history as these are automatic updates
-      // as a consequence of another action
-      tr.setMeta('addToHistory', false);
+      if (!fg('platform_editor_fix_table_resizing_undo')) {
+        tr.setMeta('addToHistory', false);
+      }
       if (tr.docChanged) {
         tr.setMeta('scrollIntoView', false);
         // TODO: ED-8995 - We need to do this check to reduce the number of race conditions when working with tables.

package/dist/esm/ui/ContentComponent.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
 import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import FloatingContextualButton from './FloatingContextualButton';
 import FloatingContextualMenu from './FloatingContextualMenu';
 import FloatingDeleteButton from './FloatingDeleteButton';
@@ -12,11 +12,8 @@ import FloatingDragMenu from './FloatingDragMenu';
 import FloatingInsertButton from './FloatingInsertButton';
 import { FloatingToolbarLabel } from './FloatingToolbarLabel/FloatingToolbarLabel';
 import { GlobalStylesWrapper } from './global-styles';
+import { useInternalTablePluginStateSelector } from './hooks/useInternalTablePluginStateSelector';
 import { FullWidthDisplay } from './TableFullWidthLabel';
-var useSharedTablePluginStateSelector = function useSharedTablePluginStateSelector(api, key) {
-  var value = useSharedPluginStateSelector(api, "table.".concat(key));
-  return value;
-};
 var ContentComponentInternal = function ContentComponentInternal(_ref) {
   var _api$analytics, _api$accessibilityUti;
   var api = _ref.api,
@@ -30,28 +27,71 @@ var ContentComponentInternal = function ContentComponentInternal(_ref) {
     defaultGetEditorFeatureFlags = _ref.defaultGetEditorFeatureFlags;
   var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   var ariaNotifyPlugin = api === null || api === void 0 || (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify;
-  var resizingTableLocalId = useSharedTablePluginStateSelector(api, 'resizingTableLocalId');
-  var resizingTableRef = useSharedTablePluginStateSelector(api, 'resizingTableRef');
-  var isTableResizing = useSharedTablePluginStateSelector(api, 'isTableResizing');
-  var isResizing = useSharedTablePluginStateSelector(api, 'isResizing');
-  var widthToWidest = useSharedTablePluginStateSelector(api, 'widthToWidest');
-  var tableNode = useSharedTablePluginStateSelector(api, 'tableNode');
-  var targetCellPosition = useSharedTablePluginStateSelector(api, 'targetCellPosition');
-  var isContextualMenuOpen = useSharedTablePluginStateSelector(api, 'isContextualMenuOpen');
-  var tableRef = useSharedTablePluginStateSelector(api, 'tableRef');
-  var pluginConfig = useSharedTablePluginStateSelector(api, 'pluginConfig');
-  var insertColumnButtonIndex = useSharedTablePluginStateSelector(api, 'insertColumnButtonIndex');
-  var insertRowButtonIndex = useSharedTablePluginStateSelector(api, 'insertRowButtonIndex');
-  var isHeaderColumnEnabled = useSharedTablePluginStateSelector(api, 'isHeaderColumnEnabled');
-  var isHeaderRowEnabled = useSharedTablePluginStateSelector(api, 'isHeaderRowEnabled');
-  var isDragAndDropEnabled = useSharedTablePluginStateSelector(api, 'isDragAndDropEnabled');
-  var tableWrapperTarget = useSharedTablePluginStateSelector(api, 'tableWrapperTarget');
-  var isCellMenuOpenByKeyboard = useSharedTablePluginStateSelector(api, 'isCellMenuOpenByKeyboard');
-  var allowControls = pluginConfig.allowControls;
-  var stickyHeader = useSharedTablePluginStateSelector(api, 'stickyHeader');
-  var dragMenuDirection = useSharedTablePluginStateSelector(api, 'dragMenuDirection');
-  var dragMenuIndex = useSharedTablePluginStateSelector(api, 'dragMenuIndex');
-  var isDragMenuOpen = useSharedTablePluginStateSelector(api, 'isDragMenuOpen');
+  var resizingTableLocalId = useInternalTablePluginStateSelector(api, 'resizingTableLocalId', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var resizingTableRef = useInternalTablePluginStateSelector(api, 'resizingTableRef', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isTableResizing = useInternalTablePluginStateSelector(api, 'isTableResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isResizing = useInternalTablePluginStateSelector(api, 'isResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var widthToWidest = useInternalTablePluginStateSelector(api, 'widthToWidest', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var tableNode = useInternalTablePluginStateSelector(api, 'tableNode', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var targetCellPosition = useInternalTablePluginStateSelector(api, 'targetCellPosition', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isContextualMenuOpen = useInternalTablePluginStateSelector(api, 'isContextualMenuOpen', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var tableRef = useInternalTablePluginStateSelector(api, 'tableRef', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var pluginConfig = useInternalTablePluginStateSelector(api, 'pluginConfig', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var insertColumnButtonIndex = useInternalTablePluginStateSelector(api, 'insertColumnButtonIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var insertRowButtonIndex = useInternalTablePluginStateSelector(api, 'insertRowButtonIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isHeaderColumnEnabled = useInternalTablePluginStateSelector(api, 'isHeaderColumnEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isHeaderRowEnabled = useInternalTablePluginStateSelector(api, 'isHeaderRowEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isDragAndDropEnabled = useInternalTablePluginStateSelector(api, 'isDragAndDropEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var tableWrapperTarget = useInternalTablePluginStateSelector(api, 'tableWrapperTarget', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isCellMenuOpenByKeyboard = useInternalTablePluginStateSelector(api, 'isCellMenuOpenByKeyboard', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var _ref2 = pluginConfig !== null && pluginConfig !== void 0 ? pluginConfig : {},
+    allowControls = _ref2.allowControls;
+  var stickyHeader = useInternalTablePluginStateSelector(api, 'stickyHeader', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var dragMenuDirection = useInternalTablePluginStateSelector(api, 'dragMenuDirection', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var dragMenuIndex = useInternalTablePluginStateSelector(api, 'dragMenuIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isDragMenuOpen = useInternalTablePluginStateSelector(api, 'isDragMenuOpen', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
   return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
     isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
     editorView: editorView,
@@ -139,17 +179,17 @@ var ContentComponentInternal = function ContentComponentInternal(_ref) {
     offset: [0, 10]
   }));
 };
-export var ContentComponent = function ContentComponent(_ref2) {
+export var ContentComponent = function ContentComponent(_ref3) {
   var _api$featureFlags;
-  var api = _ref2.api,
-    editorView = _ref2.editorView,
-    dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent,
-    options = _ref2.options,
-    popupsMountPoint = _ref2.popupsMountPoint,
-    popupsBoundariesElement = _ref2.popupsBoundariesElement,
-    popupsScrollableElement = _ref2.popupsScrollableElement,
-    defaultGetEditorContainerWidth = _ref2.defaultGetEditorContainerWidth,
-    defaultGetEditorFeatureFlags = _ref2.defaultGetEditorFeatureFlags;
+  var api = _ref3.api,
+    editorView = _ref3.editorView,
+    dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent,
+    options = _ref3.options,
+    popupsMountPoint = _ref3.popupsMountPoint,
+    popupsBoundariesElement = _ref3.popupsBoundariesElement,
+    popupsScrollableElement = _ref3.popupsScrollableElement,
+    defaultGetEditorContainerWidth = _ref3.defaultGetEditorContainerWidth,
+    defaultGetEditorFeatureFlags = _ref3.defaultGetEditorFeatureFlags;
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
     component: ACTION_SUBJECT.TABLES_PLUGIN,
     dispatchAnalyticsEvent: dispatchAnalyticsEvent,

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

@@ -9,7 +9,6 @@ import { injectIntl } from 'react-intl-next';
 import { browser } from '@atlaskit/editor-common/browser';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findTable, TableMap } from '@atlaskit/editor-tables';
 import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
@@ -21,6 +20,7 @@ import { findDuplicatePosition, hasMergedCellsInSelection } from '../../pm-plugi
 import { TableCssClassName as ClassName } from '../../types';
 import { dragTableInsertColumnButtonSize } from '../consts';
 import { DragPreview } from '../DragPreview';
+import { useInternalTablePluginStateSelector } from '../hooks/useInternalTablePluginStateSelector';
 import { HandleIconComponent } from './HandleIconComponent';
 var DragHandleComponent = function DragHandleComponent(_ref) {
   var isDragMenuTarget = _ref.isDragMenuTarget,
@@ -268,13 +268,13 @@ var DragHandleComponentWithSharedState = function DragHandleComponentWithSharedS
     tableState = _ref6.tableState;
 
   // hoveredColumns
-  var hoveredColumnsSelector = useSharedPluginStateSelector(api, 'table.hoveredColumns', {
+  var hoveredColumnsSelector = useInternalTablePluginStateSelector(api, 'hoveredColumns', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   var hoveredColumns = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? hoveredColumnsSelector : tableState === null || tableState === void 0 ? void 0 : tableState.hoveredColumns;
 
   // hoveredRows
-  var hoveredRowsSelector = useSharedPluginStateSelector(api, 'table.hoveredRows', {
+  var hoveredRowsSelector = useInternalTablePluginStateSelector(api, 'hoveredRows', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   var hoveredRows = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? hoveredRowsSelector : tableState === null || tableState === void 0 ? void 0 : tableState.hoveredRows;

package/dist/esm/ui/hooks/useInternalTablePluginStateSelector.js

@@ -0,0 +1,21 @@
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+/**
+ * **This hook is only for internal use and should not be used outside of the table plugin.**
+ *
+ * Hook to select a value from the internal table plugin state.
+ * This is a wrapper around `useSharedPluginStateSelector` to provide access to the entire
+ * `TableSharedStateInternal` type. Since tables plugin has a lot of internal state that is not
+ * exposed via the `TableSharedState` type, we need to use this hook to access it in a type safe way.
+ *
+ * @param api The editor API
+ * @param key Key of TableSharedStateInternal to select
+ * @returns
+ */
+export var useInternalTablePluginStateSelector = function useInternalTablePluginStateSelector(api, key, options) {
+  // Need to disable the eslint rule here because the key is for the TableSharedStateInternal type
+  // and we are using it as a string to access the value in the useSharedPluginStateSelector
+  // which is typed only for the public TableSharedState type.
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  var value = useSharedPluginStateSelector(api, "table.".concat(key), options);
+  return value;
+};

package/dist/types/ui/hooks/useInternalTablePluginStateSelector.d.ts

@@ -0,0 +1,20 @@
+import { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { TablePlugin } from '../../tablePluginType';
+import { TableSharedStateInternal } from '../../types';
+type Options = {
+    disabled?: boolean;
+};
+/**
+ * **This hook is only for internal use and should not be used outside of the table plugin.**
+ *
+ * Hook to select a value from the internal table plugin state.
+ * This is a wrapper around `useSharedPluginStateSelector` to provide access to the entire
+ * `TableSharedStateInternal` type. Since tables plugin has a lot of internal state that is not
+ * exposed via the `TableSharedState` type, we need to use this hook to access it in a type safe way.
+ *
+ * @param api The editor API
+ * @param key Key of TableSharedStateInternal to select
+ * @returns
+ */
+export declare const useInternalTablePluginStateSelector: <K extends "isFullWidthModeEnabled" | "wasFullWidthModeEnabled" | "isHeaderRowEnabled" | "isHeaderColumnEnabled" | "ordering" | "isInDanger" | "hoveredRows" | "hoveredColumns" | "hoveredCell" | "isTableHovered" | "tableNode" | "widthToWidest" | "tableRef" | "tablePos" | "targetCellPosition" | "isContextualMenuOpen" | "pluginConfig" | "insertColumnButtonIndex" | "insertRowButtonIndex" | "isDragAndDropEnabled" | "tableWrapperTarget" | "isCellMenuOpenByKeyboard" | "isWholeTableInDanger" | "isDragMenuOpen" | "dragMenuDirection" | "dragMenuIndex" | "isResizing" | "isTableResizing" | "resizingTableRef" | "resizingTableLocalId" | "stickyHeader">(api: ExtractInjectionAPI<TablePlugin> | undefined, key: K, options?: Options) => TableSharedStateInternal[K] | undefined;
+export {};

package/dist/types-ts4.5/ui/hooks/useInternalTablePluginStateSelector.d.ts

@@ -0,0 +1,20 @@
+import { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { TablePlugin } from '../../tablePluginType';
+import { TableSharedStateInternal } from '../../types';
+type Options = {
+    disabled?: boolean;
+};
+/**
+ * **This hook is only for internal use and should not be used outside of the table plugin.**
+ *
+ * Hook to select a value from the internal table plugin state.
+ * This is a wrapper around `useSharedPluginStateSelector` to provide access to the entire
+ * `TableSharedStateInternal` type. Since tables plugin has a lot of internal state that is not
+ * exposed via the `TableSharedState` type, we need to use this hook to access it in a type safe way.
+ *
+ * @param api The editor API
+ * @param key Key of TableSharedStateInternal to select
+ * @returns
+ */
+export declare const useInternalTablePluginStateSelector: <K extends "isFullWidthModeEnabled" | "wasFullWidthModeEnabled" | "isHeaderRowEnabled" | "isHeaderColumnEnabled" | "ordering" | "isInDanger" | "hoveredRows" | "hoveredColumns" | "hoveredCell" | "isTableHovered" | "tableNode" | "widthToWidest" | "tableRef" | "tablePos" | "targetCellPosition" | "isContextualMenuOpen" | "pluginConfig" | "insertColumnButtonIndex" | "insertRowButtonIndex" | "isDragAndDropEnabled" | "tableWrapperTarget" | "isCellMenuOpenByKeyboard" | "isWholeTableInDanger" | "isDragMenuOpen" | "dragMenuDirection" | "dragMenuIndex" | "isResizing" | "isTableResizing" | "resizingTableRef" | "resizingTableLocalId" | "stickyHeader">(api: ExtractInjectionAPI<TablePlugin> | undefined, key: K, options?: Options) => TableSharedStateInternal[K] | undefined;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "10.9.6",
+	"version": "10.9.8",
 	"description": "Table plugin for the @atlaskit/editor",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -32,7 +32,7 @@
 		"@atlaskit/adf-schema": "^47.6.0",
 		"@atlaskit/button": "^23.0.0",
 		"@atlaskit/custom-steps": "^0.11.0",
-		"@atlaskit/editor-common": "^103.16.0",
+		"@atlaskit/editor-common": "^103.18.0",
 		"@atlaskit/editor-palette": "^2.1.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^2.0.0",
 		"@atlaskit/editor-plugin-analytics": "^2.2.0",
@@ -49,7 +49,7 @@
 		"@atlaskit/icon": "^25.6.0",
 		"@atlaskit/menu": "^3.2.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/pragmatic-drag-and-drop": "^1.5.0",
+		"@atlaskit/pragmatic-drag-and-drop": "^1.6.0",
 		"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^2.1.0",
 		"@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.0.0",
 		"@atlaskit/primitives": "^14.4.0",
@@ -206,6 +206,9 @@
 		},
 		"platform_editor_controls_patch_6": {
 			"type": "boolean"
+		},
+		"platform_editor_fix_table_resizing_undo": {
+			"type": "boolean"
 		}
 	}
 }

package/src/nodeviews/TableComponent.tsx

@@ -1308,6 +1308,11 @@ class TableComponent extends React.Component<ComponentProps, TableState> {
 
 		if (!isUserTriggered) {
 			tintDirtyTransaction(tr);
+			if (fg('platform_editor_fix_table_resizing_undo')) {
+				// Avoid adding this transaction separately to the history as these are automatic updates
+				// as a consequence of another action
+				tr.setMeta('addToHistory', false);
+			}
 		}
 
 		dispatch(tr);