@atlaskit/editor-plugin-table 10.8.3 → 10.9.2

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # @atlaskit/editor-plugin-table
 
+## 10.9.2
+
+### Patch Changes
+
+- [#144209](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/144209)
+  [`7110eac24db43`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7110eac24db43) -
+  ED-26373: Remove parentOffset logic from \_handleTableRef. This was preventing the users cursor
+  selection from being the first cell in the table upon table creation.
+- Updated dependencies
+
+## 10.9.1
+
+### Patch Changes
+
+- [#145186](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/145186)
+  [`6a555b119bc46`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6a555b119bc46) -
+  ED-27719: Add checks to \_handleTableRef so this.dom is not used if it is undefined. This was
+  causing sentry errors.
+- [#144194](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/144194)
+  [`542b82e03416e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/542b82e03416e) -
+  [ux] Remove separators within group in Editor floating toolbar
+- Updated dependencies
+
+## 10.9.0
+
+### Minor Changes
+
+- [#142156](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/142156)
+  [`9e2d56551d2cc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9e2d56551d2cc) -
+  Remove WithPluginState from Table via platform_editor_usesharedpluginstateselector
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 10.8.3
 
 ### Patch Changes

package/dist/cjs/nodeviews/table.js

@@ -143,12 +143,10 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
       var _this2 = this;
       var oldIgnoreMutation;
       var selectionBookmark;
-      var parentOffset = 0;
       var mutationsIgnored = false;
 
       // Only proceed if we have both a node and table, and the table isn't already inside the node
       if (node && this.table && !node.contains(this.table)) {
-        var _this$view$state$sele;
         // Store the current ignoreMutation handler so we can restore it later
         oldIgnoreMutation = this.ignoreMutation;
 
@@ -156,7 +154,7 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
         // - Ignores all DOM mutations except selection changes
         // - Tracks when mutations have been ignored via mutationsIgnored flag
         this.ignoreMutation = function (m) {
-          var isSelectionMutation = m.target instanceof Selection;
+          var isSelectionMutation = m.type === 'selection';
           if (!isSelectionMutation) {
             mutationsIgnored = true;
           }
@@ -169,15 +167,8 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
           selectionBookmark = this.view.state.selection.getBookmark();
         }
 
-        // Store the current cursor position within the parent node
-        // Used to determine if we need to restore selection later
-        if (((_this$view$state$sele = this.view.state.selection) === null || _this$view$state$sele === void 0 ? void 0 : _this$view$state$sele.ranges.length) > 0) {
-          var _this$view$state$sele2, _this$view$state$sele3;
-          parentOffset = (_this$view$state$sele2 = (_this$view$state$sele3 = this.view.state.selection) === null || _this$view$state$sele3 === void 0 || (_this$view$state$sele3 = _this$view$state$sele3.ranges[0].$from) === null || _this$view$state$sele3 === void 0 ? void 0 : _this$view$state$sele3.parentOffset) !== null && _this$view$state$sele2 !== void 0 ? _this$view$state$sele2 : 0;
-        }
-
         // Remove the ProseMirror table DOM structure to avoid duplication, as it's replaced with the React table node.
-        if (this.renderedDOM) {
+        if (this.dom && this.renderedDOM) {
           this.dom.removeChild(this.renderedDOM);
         }
         // Move the table from the ProseMirror table structure into the React rendered table node.
@@ -191,9 +182,13 @@ var TableView = exports.default = /*#__PURE__*/function (_ReactNodeView) {
           // Restore the selection only if:
           // - We have a selection bookmark
           // - Mutations were ignored during the table move
-          // - The cursor wasn't at the start of the node
-          if (selectionBookmark && mutationsIgnored && parentOffset > 0) {
-            _this2.view.dispatch(_this2.view.state.tr.setSelection(selectionBookmark.resolve(_this2.view.state.tr.doc)));
+          // - The bookmarked selection is different from the current selection.
+          if (selectionBookmark && mutationsIgnored) {
+            var resolvedSelection = selectionBookmark.resolve(_this2.view.state.tr.doc);
+            // Don't set the selection if it's the same as the current selection.
+            if (!resolvedSelection.eq(_this2.view.state.selection)) {
+              _this2.view.dispatch(_this2.view.state.tr.setSelection(resolvedSelection));
+            }
           }
         });
       }

package/dist/cjs/tablePlugin.js

@@ -37,7 +37,6 @@ var _plugin3 = require("./pm-plugins/drag-and-drop/plugin");
 var _pluginKey2 = require("./pm-plugins/drag-and-drop/plugin-key");
 var _keymap = require("./pm-plugins/keymap");
 var _main = require("./pm-plugins/main");
-var _pluginFactory = require("./pm-plugins/plugin-factory");
 var _pluginKey3 = require("./pm-plugins/plugin-key");
 var _safariDeleteCompositionTextIssueWorkaround = require("./pm-plugins/safari-delete-composition-text-issue-workaround");
 var _plugin4 = require("./pm-plugins/sticky-headers/plugin");
@@ -46,7 +45,7 @@ var _util = require("./pm-plugins/sticky-headers/util");
 var _tableAnalytics = require("./pm-plugins/table-analytics");
 var _tableLocalId = require("./pm-plugins/table-local-id");
 var _plugin5 = require("./pm-plugins/table-resizing/plugin");
-var _pluginFactory2 = require("./pm-plugins/table-resizing/plugin-factory");
+var _pluginFactory = require("./pm-plugins/table-resizing/plugin-factory");
 var _pluginKey5 = require("./pm-plugins/table-resizing/plugin-key");
 var _tableSelectionKeymap = require("./pm-plugins/table-selection-keymap");
 var _tableSizeSelector = require("./pm-plugins/table-size-selector");
@@ -54,6 +53,7 @@ var _tableWidth = require("./pm-plugins/table-width");
 var _tableWidthInCommentFix = require("./pm-plugins/table-width-in-comment-fix");
 var _create = require("./pm-plugins/utils/create");
 var _viewModeSort = require("./pm-plugins/view-mode-sort");
+var _ContentComponent = require("./ui/ContentComponent");
 var _FloatingContextualButton = _interopRequireDefault(require("./ui/FloatingContextualButton"));
 var _FloatingContextualMenu = _interopRequireDefault(require("./ui/FloatingContextualMenu"));
 var _FloatingDeleteButton = _interopRequireDefault(require("./ui/FloatingDeleteButton"));
@@ -103,13 +103,19 @@ var tablePlugin = function tablePlugin(_ref) {
     // Use getSharedState to store fullWidthEnabled and wasFullWidthModeEnabled to guarantee access
     // to most up to date values - passing to createPluginState will not re-initialise the state
     getSharedState: function getSharedState(editorState) {
+      var _tablePluginState$tab, _tableWidthResizingPl;
       if (!editorState) {
         return undefined;
       }
-      var tablePluginState = (0, _pluginFactory.getPluginState)(editorState);
-      var tableResizingPluginState = (0, _pluginFactory2.getPluginState)(editorState);
+
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      var tablePluginState = _pluginKey3.pluginKey.getState(editorState);
+      var tableResizingPluginState = (0, _pluginFactory.getPluginState)(editorState);
       var tableWidthResizingPluginState = _tableWidth.pluginKey.getState(editorState);
-      return {
+      var stickyHeadersState = _pluginKey4.pluginKey.getState(editorState);
+      var stickyHeader = stickyHeadersState ? (0, _util.findStickyHeaderForTable)(stickyHeadersState, tablePluginState === null || tablePluginState === void 0 ? void 0 : tablePluginState.tablePos) : undefined;
+      var dragAndDropState = _pluginKey2.pluginKey.getState(editorState);
+      var sharedStateInternal = {
         isFullWidthModeEnabled: !!(options !== null && options !== void 0 && options.fullWidthEnabled),
         wasFullWidthModeEnabled: !!(options !== null && options !== void 0 && options.wasFullWidthEnabled),
         isHeaderRowEnabled: tablePluginState.isHeaderRowEnabled,
@@ -126,8 +132,25 @@ var tablePlugin = function tablePlugin(_ref) {
         // IMPORTANT: Need to continue to pass tableNode to control re-renders
         // TableComponent listens for node attribute changes to update colgroups
         tableNode: tablePluginState.tableNode,
-        widthToWidest: tablePluginState.widthToWidest
+        widthToWidest: tablePluginState.widthToWidest,
+        resizingTableLocalId: tableWidthResizingPluginState === null || tableWidthResizingPluginState === void 0 ? void 0 : tableWidthResizingPluginState.tableLocalId,
+        tableRef: (_tablePluginState$tab = tablePluginState === null || tablePluginState === void 0 ? void 0 : tablePluginState.tableRef) !== null && _tablePluginState$tab !== void 0 ? _tablePluginState$tab : undefined,
+        resizingTableRef: (_tableWidthResizingPl = tableWidthResizingPluginState === null || tableWidthResizingPluginState === void 0 ? void 0 : tableWidthResizingPluginState.tableRef) !== null && _tableWidthResizingPl !== void 0 ? _tableWidthResizingPl : undefined,
+        tablePos: tablePluginState.tablePos,
+        targetCellPosition: tablePluginState.targetCellPosition,
+        isContextualMenuOpen: tablePluginState.isContextualMenuOpen,
+        pluginConfig: tablePluginState.pluginConfig,
+        insertColumnButtonIndex: tablePluginState.insertColumnButtonIndex,
+        insertRowButtonIndex: tablePluginState.insertRowButtonIndex,
+        isDragAndDropEnabled: tablePluginState.isDragAndDropEnabled,
+        tableWrapperTarget: tablePluginState.tableWrapperTarget,
+        isCellMenuOpenByKeyboard: tablePluginState.isCellMenuOpenByKeyboard,
+        stickyHeader: stickyHeader,
+        dragMenuDirection: dragAndDropState === null || dragAndDropState === void 0 ? void 0 : dragAndDropState.dragMenuDirection,
+        dragMenuIndex: dragAndDropState === null || dragAndDropState === void 0 ? void 0 : dragAndDropState.dragMenuIndex,
+        isDragMenuOpen: dragAndDropState === null || dragAndDropState === void 0 ? void 0 : dragAndDropState.isDragMenuOpen
       };
+      return sharedStateInternal;
     },
     actions: {
       insertTable: function insertTable(analyticsPayload) {
@@ -428,6 +451,19 @@ var tablePlugin = function tablePlugin(_ref) {
         popupsBoundariesElement = _ref20.popupsBoundariesElement,
         popupsScrollableElement = _ref20.popupsScrollableElement,
         dispatchAnalyticsEvent = _ref20.dispatchAnalyticsEvent;
+      if ((0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)) {
+        return /*#__PURE__*/_react.default.createElement(_ContentComponent.ContentComponent, {
+          api: api,
+          editorView: editorView,
+          dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+          options: options,
+          popupsMountPoint: popupsMountPoint,
+          popupsBoundariesElement: popupsBoundariesElement,
+          popupsScrollableElement: popupsScrollableElement,
+          defaultGetEditorContainerWidth: defaultGetEditorContainerWidth,
+          defaultGetEditorFeatureFlags: defaultGetEditorFeatureFlags
+        });
+      }
       return /*#__PURE__*/_react.default.createElement(_errorBoundary.ErrorBoundary, {
         component: _analytics.ACTION_SUBJECT.TABLES_PLUGIN,
         dispatchAnalyticsEvent: dispatchAnalyticsEvent,

package/dist/cjs/ui/ContentComponent.js

@@ -0,0 +1,180 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ContentComponent = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _analytics = require("@atlaskit/editor-common/analytics");
+var _errorBoundary = require("@atlaskit/editor-common/error-boundary");
+var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
+var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _FloatingContextualButton = _interopRequireDefault(require("./FloatingContextualButton"));
+var _FloatingContextualMenu = _interopRequireDefault(require("./FloatingContextualMenu"));
+var _FloatingDeleteButton = _interopRequireDefault(require("./FloatingDeleteButton"));
+var _FloatingDragMenu = _interopRequireDefault(require("./FloatingDragMenu"));
+var _FloatingInsertButton = _interopRequireDefault(require("./FloatingInsertButton"));
+var _FloatingToolbarLabel = require("./FloatingToolbarLabel/FloatingToolbarLabel");
+var _globalStyles = require("./global-styles");
+var _TableFullWidthLabel = require("./TableFullWidthLabel");
+// Ignored via go/ees005
+// eslint-disable-next-line import/no-named-as-default
+
+var useSharedTablePluginStateSelector = function useSharedTablePluginStateSelector(api, key) {
+  var value = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, "table.".concat(key));
+  return value;
+};
+var ContentComponentInternal = function ContentComponentInternal(_ref) {
+  var _api$analytics, _api$accessibilityUti;
+  var api = _ref.api,
+    editorView = _ref.editorView,
+    dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent,
+    options = _ref.options,
+    popupsMountPoint = _ref.popupsMountPoint,
+    popupsBoundariesElement = _ref.popupsBoundariesElement,
+    popupsScrollableElement = _ref.popupsScrollableElement,
+    defaultGetEditorContainerWidth = _ref.defaultGetEditorContainerWidth,
+    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');
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/_react.default.createElement(_FloatingContextualButton.default, {
+    isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
+    editorView: editorView,
+    tableNode: tableNode,
+    mountPoint: popupsMountPoint,
+    targetCellPosition: targetCellPosition,
+    scrollableElement: popupsScrollableElement,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    isContextualMenuOpen: isContextualMenuOpen,
+    stickyHeader: stickyHeader,
+    tableWrapper: tableWrapperTarget,
+    isCellMenuOpenByKeyboard: isCellMenuOpenByKeyboard
+  }), allowControls && /*#__PURE__*/_react.default.createElement(_FloatingInsertButton.default, {
+    tableNode: tableNode,
+    tableRef: tableRef,
+    insertColumnButtonIndex: insertColumnButtonIndex,
+    insertRowButtonIndex: insertRowButtonIndex,
+    isHeaderColumnEnabled: isHeaderColumnEnabled,
+    isHeaderRowEnabled: isHeaderRowEnabled,
+    isDragAndDropEnabled: isDragAndDropEnabled,
+    isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
+    editorView: editorView,
+    mountPoint: popupsMountPoint,
+    boundariesElement: popupsBoundariesElement,
+    scrollableElement: popupsScrollableElement,
+    hasStickyHeaders: stickyHeader && stickyHeader.sticky,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    editorAnalyticsAPI: editorAnalyticsAPI,
+    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,
+    isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor
+  }), (options === null || options === void 0 ? void 0 : options.allowContextualMenu) && /*#__PURE__*/_react.default.createElement(_FloatingContextualMenu.default, {
+    editorView: editorView,
+    mountPoint: popupsMountPoint,
+    boundariesElement: popupsBoundariesElement,
+    targetCellPosition: targetCellPosition,
+    isOpen: Boolean(isContextualMenuOpen) && !isResizing,
+    pluginConfig: pluginConfig,
+    editorAnalyticsAPI: editorAnalyticsAPI,
+    getEditorContainerWidth: defaultGetEditorContainerWidth,
+    getEditorFeatureFlags: (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags,
+    isCellMenuOpenByKeyboard: isCellMenuOpenByKeyboard,
+    isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
+    api: api
+  }), isDragAndDropEnabled && /*#__PURE__*/_react.default.createElement(_FloatingDragMenu.default, {
+    editorView: editorView,
+    mountPoint: popupsMountPoint,
+    boundariesElement: popupsBoundariesElement,
+    tableRef: tableRef,
+    tableNode: tableNode,
+    targetCellPosition: targetCellPosition,
+    direction: dragMenuDirection,
+    index: dragMenuIndex,
+    isOpen: !!isDragMenuOpen && !isResizing,
+    getEditorContainerWidth: defaultGetEditorContainerWidth,
+    editorAnalyticsAPI: editorAnalyticsAPI,
+    stickyHeaders: stickyHeader,
+    pluginConfig: pluginConfig,
+    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,
+    isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor
+  }), allowControls && !isDragAndDropEnabled && !isResizing && /*#__PURE__*/_react.default.createElement(_FloatingDeleteButton.default, {
+    editorView: editorView,
+    selection: editorView.state.selection,
+    tableRef: tableRef,
+    mountPoint: popupsMountPoint,
+    boundariesElement: popupsBoundariesElement,
+    scrollableElement: popupsScrollableElement,
+    stickyHeaders: stickyHeader,
+    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.tableOptions.allowTableResizing) && options.isCommentEditor) && isTableResizing && widthToWidest && resizingTableLocalId && resizingTableRef && widthToWidest[resizingTableLocalId] && /*#__PURE__*/_react.default.createElement(_FloatingToolbarLabel.FloatingToolbarLabel, {
+    target: resizingTableRef,
+    content: /*#__PURE__*/_react.default.createElement(_TableFullWidthLabel.FullWidthDisplay, null),
+    alignX: 'center',
+    alignY: 'bottom',
+    stick: true,
+    forcePlacement: true,
+    zIndex: _editorSharedStyles.akEditorFloatingPanelZIndex,
+    offset: [0, 10]
+  }));
+};
+var ContentComponent = exports.ContentComponent = function ContentComponent(_ref2) {
+  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;
+  return /*#__PURE__*/_react.default.createElement(_errorBoundary.ErrorBoundary, {
+    component: _analytics.ACTION_SUBJECT.TABLES_PLUGIN,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    fallbackComponent: null
+  }, /*#__PURE__*/_react.default.createElement(_globalStyles.GlobalStylesWrapper, {
+    featureFlags: api === null || api === void 0 || (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState(),
+    isDragAndDropEnabledOption: options === null || options === void 0 ? void 0 : options.dragAndDropEnabled,
+    api: api
+  }), /*#__PURE__*/_react.default.createElement(ContentComponentInternal, {
+    api: api,
+    editorView: editorView,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    options: options,
+    popupsMountPoint: popupsMountPoint,
+    popupsBoundariesElement: popupsBoundariesElement,
+    popupsScrollableElement: popupsScrollableElement,
+    defaultGetEditorContainerWidth: defaultGetEditorContainerWidth,
+    defaultGetEditorFeatureFlags: defaultGetEditorFeatureFlags
+  }));
+};

package/dist/cjs/ui/toolbar.js

@@ -494,6 +494,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
             onBlur: (0, _commands.clearHoverSelection)()
           };
         };
+        var shouldGroupWithoutSeparators = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6');
         return {
           title: toolbarTitle,
           getDomRef: getDomRef,
@@ -504,12 +505,15 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
           },
           zIndex: _editorSharedStyles.akEditorFloatingPanelZIndex + 1,
           // Place the context menu slightly above the others
-          items: [menu, separator(menu.hidden)].concat((0, _toConsumableArray2.default)(alignmentMenu), [separator(alignmentMenu.length === 0)], (0, _toConsumableArray2.default)(cellItems), (0, _toConsumableArray2.default)(columnSettingsItems), (0, _toConsumableArray2.default)(colorPicker), (0, _toConsumableArray2.default)((0, _experiments.editorExperiment)('platform_editor_controls', 'control') ? [{
+          items: [menu].concat((0, _toConsumableArray2.default)(!shouldGroupWithoutSeparators ? [separator(menu.hidden)] : []), (0, _toConsumableArray2.default)(alignmentMenu), (0, _toConsumableArray2.default)(!shouldGroupWithoutSeparators ? [separator(alignmentMenu.length === 0)] : []), (0, _toConsumableArray2.default)(cellItems), (0, _toConsumableArray2.default)(columnSettingsItems), (0, _toConsumableArray2.default)(colorPicker), (0, _toConsumableArray2.default)((0, _experiments.editorExperiment)('platform_editor_controls', 'control') ? [{
             type: 'extensions-placeholder',
             separator: 'end'
           }, copyButton, {
             type: 'separator'
-          }, deleteButton] : [{
+          }, deleteButton] : [shouldGroupWithoutSeparators && {
+            type: 'separator',
+            fullHeight: true
+          }, {
             type: 'overflow-dropdown',
             dropdownWidth: 220,
             options: [{
@@ -639,7 +643,7 @@ var getColumnSettingItems = function getColumnSettingItems(editorState, editorVi
       disabled: !wouldChange
     });
   }
-  if (items.length !== 0) {
+  if (items.length !== 0 && (!(0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') || !(0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6'))) {
     items.push({
       type: 'separator'
     });

package/dist/es2019/nodeviews/table.js

@@ -114,12 +114,10 @@ export default class TableView extends ReactNodeView {
   _handleTableRef(node) {
     let oldIgnoreMutation;
     let selectionBookmark;
-    let parentOffset = 0;
     let mutationsIgnored = false;
 
     // Only proceed if we have both a node and table, and the table isn't already inside the node
     if (node && this.table && !node.contains(this.table)) {
-      var _this$view$state$sele;
       // Store the current ignoreMutation handler so we can restore it later
       oldIgnoreMutation = this.ignoreMutation;
 
@@ -127,7 +125,7 @@ export default class TableView extends ReactNodeView {
       // - Ignores all DOM mutations except selection changes
       // - Tracks when mutations have been ignored via mutationsIgnored flag
       this.ignoreMutation = m => {
-        const isSelectionMutation = m.target instanceof Selection;
+        const isSelectionMutation = m.type === 'selection';
         if (!isSelectionMutation) {
           mutationsIgnored = true;
         }
@@ -140,15 +138,8 @@ export default class TableView extends ReactNodeView {
         selectionBookmark = this.view.state.selection.getBookmark();
       }
 
-      // Store the current cursor position within the parent node
-      // Used to determine if we need to restore selection later
-      if (((_this$view$state$sele = this.view.state.selection) === null || _this$view$state$sele === void 0 ? void 0 : _this$view$state$sele.ranges.length) > 0) {
-        var _this$view$state$sele2, _this$view$state$sele3, _this$view$state$sele4;
-        parentOffset = (_this$view$state$sele2 = (_this$view$state$sele3 = this.view.state.selection) === null || _this$view$state$sele3 === void 0 ? void 0 : (_this$view$state$sele4 = _this$view$state$sele3.ranges[0].$from) === null || _this$view$state$sele4 === void 0 ? void 0 : _this$view$state$sele4.parentOffset) !== null && _this$view$state$sele2 !== void 0 ? _this$view$state$sele2 : 0;
-      }
-
       // Remove the ProseMirror table DOM structure to avoid duplication, as it's replaced with the React table node.
-      if (this.renderedDOM) {
+      if (this.dom && this.renderedDOM) {
         this.dom.removeChild(this.renderedDOM);
       }
       // Move the table from the ProseMirror table structure into the React rendered table node.
@@ -162,9 +153,13 @@ export default class TableView extends ReactNodeView {
         // Restore the selection only if:
         // - We have a selection bookmark
         // - Mutations were ignored during the table move
-        // - The cursor wasn't at the start of the node
-        if (selectionBookmark && mutationsIgnored && parentOffset > 0) {
-          this.view.dispatch(this.view.state.tr.setSelection(selectionBookmark.resolve(this.view.state.tr.doc)));
+        // - The bookmarked selection is different from the current selection.
+        if (selectionBookmark && mutationsIgnored) {
+          const resolvedSelection = selectionBookmark.resolve(this.view.state.tr.doc);
+          // Don't set the selection if it's the same as the current selection.
+          if (!resolvedSelection.eq(this.view.state.selection)) {
+            this.view.dispatch(this.view.state.tr.setSelection(resolvedSelection));
+          }
         }
       });
     }

package/dist/es2019/tablePlugin.js

@@ -28,7 +28,6 @@ import { createPlugin as createDragAndDropPlugin } from './pm-plugins/drag-and-d
 import { pluginKey as dragAndDropPluginKey } from './pm-plugins/drag-and-drop/plugin-key';
 import { keymapPlugin } from './pm-plugins/keymap';
 import { createPlugin } from './pm-plugins/main';
-import { getPluginState } from './pm-plugins/plugin-factory';
 import { pluginKey } from './pm-plugins/plugin-key';
 import { createPlugin as createTableSafariDeleteCompositionTextIssueWorkaroundPlugin } from './pm-plugins/safari-delete-composition-text-issue-workaround';
 import { createPlugin as createStickyHeadersPlugin } from './pm-plugins/sticky-headers/plugin';
@@ -45,6 +44,7 @@ import { createPlugin as createTableWidthPlugin, pluginKey as tableWidthPluginKe
 import { createPlugin as createTableWidthInCommentFixPlugin } from './pm-plugins/table-width-in-comment-fix';
 import { createTableWithWidth } from './pm-plugins/utils/create';
 import { createPlugin as createViewModeSortPlugin } from './pm-plugins/view-mode-sort';
+import { ContentComponent } from './ui/ContentComponent';
 import FloatingContextualButton from './ui/FloatingContextualButton';
 import FloatingContextualMenu from './ui/FloatingContextualMenu';
 import FloatingDeleteButton from './ui/FloatingDeleteButton';
@@ -90,13 +90,19 @@ const tablePlugin = ({
     // Use getSharedState to store fullWidthEnabled and wasFullWidthModeEnabled to guarantee access
     // to most up to date values - passing to createPluginState will not re-initialise the state
     getSharedState: editorState => {
+      var _tablePluginState$tab, _tableWidthResizingPl;
       if (!editorState) {
         return undefined;
       }
-      const tablePluginState = getPluginState(editorState);
+
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      const tablePluginState = pluginKey.getState(editorState);
       const tableResizingPluginState = getFlexiResizingPlugin(editorState);
       const tableWidthResizingPluginState = tableWidthPluginKey.getState(editorState);
-      return {
+      const stickyHeadersState = stickyHeadersPluginKey.getState(editorState);
+      const stickyHeader = stickyHeadersState ? findStickyHeaderForTable(stickyHeadersState, tablePluginState === null || tablePluginState === void 0 ? void 0 : tablePluginState.tablePos) : undefined;
+      const dragAndDropState = dragAndDropPluginKey.getState(editorState);
+      const sharedStateInternal = {
         isFullWidthModeEnabled: !!(options !== null && options !== void 0 && options.fullWidthEnabled),
         wasFullWidthModeEnabled: !!(options !== null && options !== void 0 && options.wasFullWidthEnabled),
         isHeaderRowEnabled: tablePluginState.isHeaderRowEnabled,
@@ -113,8 +119,25 @@ const tablePlugin = ({
         // IMPORTANT: Need to continue to pass tableNode to control re-renders
         // TableComponent listens for node attribute changes to update colgroups
         tableNode: tablePluginState.tableNode,
-        widthToWidest: tablePluginState.widthToWidest
+        widthToWidest: tablePluginState.widthToWidest,
+        resizingTableLocalId: tableWidthResizingPluginState === null || tableWidthResizingPluginState === void 0 ? void 0 : tableWidthResizingPluginState.tableLocalId,
+        tableRef: (_tablePluginState$tab = tablePluginState === null || tablePluginState === void 0 ? void 0 : tablePluginState.tableRef) !== null && _tablePluginState$tab !== void 0 ? _tablePluginState$tab : undefined,
+        resizingTableRef: (_tableWidthResizingPl = tableWidthResizingPluginState === null || tableWidthResizingPluginState === void 0 ? void 0 : tableWidthResizingPluginState.tableRef) !== null && _tableWidthResizingPl !== void 0 ? _tableWidthResizingPl : undefined,
+        tablePos: tablePluginState.tablePos,
+        targetCellPosition: tablePluginState.targetCellPosition,
+        isContextualMenuOpen: tablePluginState.isContextualMenuOpen,
+        pluginConfig: tablePluginState.pluginConfig,
+        insertColumnButtonIndex: tablePluginState.insertColumnButtonIndex,
+        insertRowButtonIndex: tablePluginState.insertRowButtonIndex,
+        isDragAndDropEnabled: tablePluginState.isDragAndDropEnabled,
+        tableWrapperTarget: tablePluginState.tableWrapperTarget,
+        isCellMenuOpenByKeyboard: tablePluginState.isCellMenuOpenByKeyboard,
+        stickyHeader,
+        dragMenuDirection: dragAndDropState === null || dragAndDropState === void 0 ? void 0 : dragAndDropState.dragMenuDirection,
+        dragMenuIndex: dragAndDropState === null || dragAndDropState === void 0 ? void 0 : dragAndDropState.dragMenuIndex,
+        isDragMenuOpen: dragAndDropState === null || dragAndDropState === void 0 ? void 0 : dragAndDropState.isDragMenuOpen
       };
+      return sharedStateInternal;
     },
     actions: {
       insertTable: analyticsPayload => (state, dispatch) => {
@@ -416,6 +439,19 @@ const tablePlugin = ({
       dispatchAnalyticsEvent
     }) {
       var _api$featureFlags;
+      if (editorExperiment('platform_editor_usesharedpluginstateselector', true)) {
+        return /*#__PURE__*/React.createElement(ContentComponent, {
+          api: api,
+          editorView: editorView,
+          dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+          options: options,
+          popupsMountPoint: popupsMountPoint,
+          popupsBoundariesElement: popupsBoundariesElement,
+          popupsScrollableElement: popupsScrollableElement,
+          defaultGetEditorContainerWidth: defaultGetEditorContainerWidth,
+          defaultGetEditorFeatureFlags: defaultGetEditorFeatureFlags
+        });
+      }
       return /*#__PURE__*/React.createElement(ErrorBoundary, {
         component: ACTION_SUBJECT.TABLES_PLUGIN,
         dispatchAnalyticsEvent: dispatchAnalyticsEvent,