@atlaskit/editor-plugin-table 23.3.4 → 23.3.5

package/dist/cjs/ui/TableFloatingControls/RowControls/DragControls.js

@@ -8,14 +8,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.DragControlsWithSelection = exports.DragControls = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
+var _analytics = require("@atlaskit/editor-common/analytics");
 var _hooks = require("@atlaskit/editor-common/hooks");
 var _editorTables = require("@atlaskit/editor-tables");
 var _utils = require("@atlaskit/editor-tables/utils");
 var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _commands = require("../../../pm-plugins/commands");
-var _commandsWithAnalytics = require("../../../pm-plugins/commands/commands-with-analytics");
-var _commandsWithAnalytics2 = require("../../../pm-plugins/drag-and-drop/commands-with-analytics");
+var _commandsWithAnalytics = require("../../../pm-plugins/drag-and-drop/commands-with-analytics");
 var _pluginFactory = require("../../../pm-plugins/plugin-factory");
 var _rowControls = require("../../../pm-plugins/utils/row-controls");
 var _selection = require("../../../pm-plugins/utils/selection");
@@ -37,7 +37,7 @@ var getSelectedRows = function getSelectedRows(selection) {
   return [];
 };
 var DragControls = exports.DragControls = function DragControls(_ref) {
-  var _tableNode$attrs$loca, _tableNode$attrs, _api$analytics3;
+  var _tableNode$attrs$loca, _tableNode$attrs;
   var tableRef = _ref.tableRef,
     tableNode = _ref.tableNode,
     tableWidth = _ref.tableWidth,
@@ -92,18 +92,49 @@ var DragControls = exports.DragControls = function DragControls(_ref) {
   var toggleDragMenuHandler = (0, _react.useCallback)(function (trigger, event) {
     var _api$analytics2;
     if (event !== null && event !== void 0 && event.shiftKey) {
+      // Shift-click extends the selection rather than toggling the menu, but the
+      // open drag menu would otherwise stay anchored to a stale row. Close it here
+      // for the updated menu (legacy menu closes via outside-click on its dropdown).
+      if ((0, _expValEquals.expValEquals)('platform_editor_table_menu_updates', 'isEnabled', true)) {
+        api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
+      }
       return;
     }
     var rowIndex = hoveredCell === null || hoveredCell === void 0 ? void 0 : hoveredCell.rowIndex;
     if ((0, _expValEquals.expValEquals)('platform_editor_table_menu_updates', 'isEnabled', true)) {
-      if (rowIndex !== undefined) {
-        var _api$analytics;
-        (0, _commandsWithAnalytics.toggleActiveTableMenuWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)('row', rowIndex, trigger)(editorView.state, editorView.dispatch);
+      if (rowIndex !== undefined && api) {
+        var _getTablePluginState2 = (0, _pluginFactory.getPluginState)(editorView.state),
+          currentActiveTableMenu = _getTablePluginState2.activeTableMenu;
+        var isSameActiveMenu = (currentActiveTableMenu === null || currentActiveTableMenu === void 0 ? void 0 : currentActiveTableMenu.type) === 'row' && currentActiveTableMenu.index === rowIndex;
+        api.core.actions.execute(function (_ref4) {
+          var tr = _ref4.tr;
+          if (!isSameActiveMenu) {
+            var _api$analytics;
+            (_api$analytics = api.analytics) === null || _api$analytics === void 0 || (_api$analytics = _api$analytics.actions) === null || _api$analytics === void 0 || _api$analytics.attachAnalyticsEvent({
+              action: _analytics.TABLE_ACTION.DRAG_MENU_OPENED,
+              actionSubject: _analytics.ACTION_SUBJECT.TABLE,
+              actionSubjectId: null,
+              eventType: _analytics.EVENT_TYPE.TRACK,
+              attributes: {
+                inputMethod: trigger === 'keyboard' ? _analytics.INPUT_METHOD.KEYBOARD : _analytics.INPUT_METHOD.MOUSE,
+                direction: 'row'
+              }
+            })(tr);
+          }
+          (0, _commands.toggleActiveTableMenu)({
+            type: 'row',
+            index: rowIndex,
+            openedBy: trigger
+          }, currentActiveTableMenu, api)({
+            tr: tr
+          });
+          return tr;
+        });
       }
       return;
     }
-    (0, _commandsWithAnalytics2.toggleDragMenuWithAnalytics)(api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions)(undefined, 'row', rowIndex, trigger)(editorView.state, editorView.dispatch);
-  }, [editorView, hoveredCell === null || hoveredCell === void 0 ? void 0 : hoveredCell.rowIndex, api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions]);
+    (0, _commandsWithAnalytics.toggleDragMenuWithAnalytics)(api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions)(undefined, 'row', rowIndex, trigger)(editorView.state, editorView.dispatch);
+  }, [editorView, hoveredCell === null || hoveredCell === void 0 ? void 0 : hoveredCell.rowIndex, api]);
   var rowIndex = hoveredCell === null || hoveredCell === void 0 ? void 0 : hoveredCell.rowIndex;
   var handleMouseOut = (0, _react.useCallback)(function () {
     if (tableActive) {
@@ -234,9 +265,9 @@ var DragControls = exports.DragControls = function DragControls(_ref) {
     },
     onMouseMove: handleMouseMove,
     contentEditable: false
-  }, rowsParams.map(function (_ref4, index) {
-    var startIndex = _ref4.startIndex,
-      endIndex = _ref4.endIndex;
+  }, rowsParams.map(function (_ref5, index) {
+    var startIndex = _ref5.startIndex,
+      endIndex = _ref5.endIndex;
     return (
       /*#__PURE__*/
       // Ignored via go/ees005
@@ -287,21 +318,21 @@ var DragControls = exports.DragControls = function DragControls(_ref) {
     );
   }), rowHandles());
 };
-var DragControlsWithSelection = exports.DragControlsWithSelection = function DragControlsWithSelection(_ref5) {
-  var editorView = _ref5.editorView,
-    tableRef = _ref5.tableRef,
-    tableNode = _ref5.tableNode,
-    tableWidth = _ref5.tableWidth,
-    tableActive = _ref5.tableActive,
-    hoveredCell = _ref5.hoveredCell,
-    isInDanger = _ref5.isInDanger,
-    isTableHovered = _ref5.isTableHovered,
-    isResizing = _ref5.isResizing,
-    hoverRows = _ref5.hoverRows,
-    selectRow = _ref5.selectRow,
-    selectRows = _ref5.selectRows,
-    updateCellHoverLocation = _ref5.updateCellHoverLocation,
-    api = _ref5.api;
+var DragControlsWithSelection = exports.DragControlsWithSelection = function DragControlsWithSelection(_ref6) {
+  var editorView = _ref6.editorView,
+    tableRef = _ref6.tableRef,
+    tableNode = _ref6.tableNode,
+    tableWidth = _ref6.tableWidth,
+    tableActive = _ref6.tableActive,
+    hoveredCell = _ref6.hoveredCell,
+    isInDanger = _ref6.isInDanger,
+    isTableHovered = _ref6.isTableHovered,
+    isResizing = _ref6.isResizing,
+    hoverRows = _ref6.hoverRows,
+    selectRow = _ref6.selectRow,
+    selectRows = _ref6.selectRows,
+    updateCellHoverLocation = _ref6.updateCellHoverLocation,
+    api = _ref6.api;
   var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['selection'], function (states) {
       var _states$selectionStat;
       return {

package/dist/cjs/ui/TableMenu/cell/items/MergeCellsItem.js

@@ -33,7 +33,7 @@ var MergeCellsItem = exports.MergeCellsItem = function MergeCellsItem(_ref) {
       return;
     }
     (0, _commandsWithAnalytics.mergeCellsWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)(_analytics.INPUT_METHOD.CONTEXT_MENU)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   if (!shouldShowMergeCells(tableMenuContext)) {

package/dist/cjs/ui/TableMenu/cell/items/SplitCellItem.js

@@ -33,7 +33,7 @@ var SplitCellItem = exports.SplitCellItem = function SplitCellItem(_ref) {
       return;
     }
     (0, _commandsWithAnalytics.splitCellWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)(_analytics.INPUT_METHOD.CONTEXT_MENU)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   if (!shouldShowSplitCell(tableMenuContext)) {

package/dist/cjs/ui/TableMenu/cell/items/VerticalAlignDropdownItem.js

@@ -39,7 +39,7 @@ var VerticalAlignDropdownItem = exports.VerticalAlignDropdownItem = function Ver
       }, targetCellPosition)({
         tr: tr
       });
-      (0, _commands.closeActiveTableMenu)()({
+      (0, _commands.closeActiveTableMenu)(api)({
         tr: tr
       });
       return tr;

package/dist/cjs/ui/TableMenu/column/items/AddColumnLeftItem.js

@@ -46,7 +46,7 @@ var AddColumnLeftItem = exports.AddColumnLeftItem = function AddColumnLeftItem(_
     }
     var shouldUseIncreasedScalingPercent = isTableScalingEnabled && (isTableFixedColumnWidthsOptionEnabled || isCommentEditor);
     (0, _commandsWithAnalytics.insertColumnWithAnalytics)(api, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, index)(editorView.state, editorView.dispatch, editorView);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/cjs/ui/TableMenu/column/items/AddColumnRightItem.js

@@ -46,7 +46,7 @@ var AddColumnRightItem = exports.AddColumnRightItem = function AddColumnRightIte
     }
     var shouldUseIncreasedScalingPercent = isTableScalingEnabled && (isTableFixedColumnWidthsOptionEnabled || isCommentEditor);
     (0, _commandsWithAnalytics.insertColumnWithAnalytics)(api, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, index)(editorView.state, editorView.dispatch, editorView);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/cjs/ui/TableMenu/column/items/DeleteColumnItem.js

@@ -64,7 +64,7 @@ var DeleteColumnItem = exports.DeleteColumnItem = function DeleteColumnItem(_ref
     }
     var shouldUseIncreasedScalingPercent = isTableScalingEnabled && (isTableFixedColumnWidthsOptionEnabled || isCommentEditor);
     (0, _commandsWithAnalytics.deleteColumnsWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, api, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, selectionRect)(editorView.state, editorView.dispatch, editorView);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/cjs/ui/TableMenu/column/items/DistributeColumnsItem.js

@@ -55,7 +55,7 @@ var DistributeColumnsItem = exports.DistributeColumnsItem = function DistributeC
       return;
     }
     (0, _commandsWithAnalytics.distributeColumnsWidthsWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, api)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, newResizeState)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   if (!shouldShowDistributeColumns(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.selectedColumnCount)) {

package/dist/cjs/ui/TableMenu/column/items/MoveColumnLeftItem.js

@@ -49,7 +49,7 @@ var MoveColumnLeftItem = exports.MoveColumnLeftItem = function MoveColumnLeftIte
       return;
     }
     (0, _commandsWithAnalytics.moveSourceWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, api === null || api === void 0 || (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify, (0, _pluginFactory.getPluginState)(editorView.state).getIntl)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, _consts.TABLE_COLUMN, (0, _selection.getSelectedColumnIndexes)(selectionRect), selectionRect.left - 1)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   if (!tableNode || !shouldShowMoveColumnLeft(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.isFirstColumn)) {

package/dist/cjs/ui/TableMenu/column/items/MoveColumnRightItem.js

@@ -48,7 +48,7 @@ var MoveColumnRightItem = exports.MoveColumnRightItem = function MoveColumnRight
       return;
     }
     (0, _commandsWithAnalytics.moveSourceWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, api === null || api === void 0 || (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify, (0, _pluginFactory.getPluginState)(editorView.state).getIntl)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, _consts.TABLE_COLUMN, (0, _selection.getSelectedColumnIndexes)(selectionRect), selectionRect.right)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   if (!tableNode || !shouldShowMoveColumnRight(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.isLastColumn)) {

package/dist/cjs/ui/TableMenu/column/items/SortDecreasingItem.js

@@ -33,7 +33,7 @@ var SortDecreasingItem = exports.SortDecreasingItem = function SortDecreasingIte
       return;
     }
     (0, _commandsWithAnalytics.sortColumnWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, columnIndex, _customSteps.TableSortOrder.DESC)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/cjs/ui/TableMenu/column/items/SortIncreasingItem.js

@@ -33,7 +33,7 @@ var SortIncreasingItem = exports.SortIncreasingItem = function SortIncreasingIte
       return;
     }
     (0, _commandsWithAnalytics.sortColumnWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, columnIndex, _customSteps.TableSortOrder.ASC)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/cjs/ui/TableMenu/row/items/AddRowAboveItem.js

@@ -36,7 +36,7 @@ var AddRowAboveItem = exports.AddRowAboveItem = function AddRowAboveItem(props)
       index: index,
       moveCursorToInsertedRow: true
     })(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/cjs/ui/TableMenu/row/items/AddRowBelowItem.js

@@ -36,7 +36,7 @@ var AddRowBelowItem = exports.AddRowBelowItem = function AddRowBelowItem(props)
       index: index,
       moveCursorToInsertedRow: true
     })(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/cjs/ui/TableMenu/row/items/DeleteRowItem.js

@@ -59,7 +59,7 @@ var DeleteRowItem = exports.DeleteRowItem = function DeleteRowItem(props) {
       return;
     }
     (0, _commandsWithAnalytics.deleteRowsWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, selectionRect, !!isHeaderRowRequired)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/cjs/ui/TableMenu/row/items/MoveRowDownItem.js

@@ -48,7 +48,7 @@ var MoveRowDownItem = exports.MoveRowDownItem = function MoveRowDownItem(props)
       return;
     }
     (0, _commandsWithAnalytics.moveSourceWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, api === null || api === void 0 || (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify, (0, _pluginFactory.getPluginState)(editorView.state).getIntl)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, _consts.TABLE_ROW, (0, _selection.getSelectedRowIndexes)(selectionRect), selectionRect.bottom)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   if (!tableNode || !shouldShowMoveRowDown(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.isLastRow)) {

package/dist/cjs/ui/TableMenu/row/items/MoveRowUpItem.js

@@ -48,7 +48,7 @@ var MoveRowUpItem = exports.MoveRowUpItem = function MoveRowUpItem(props) {
       return;
     }
     (0, _commandsWithAnalytics.moveSourceWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions, api === null || api === void 0 || (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify, (0, _pluginFactory.getPluginState)(editorView.state).getIntl)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, _consts.TABLE_ROW, (0, _selection.getSelectedRowIndexes)(selectionRect), selectionRect.top - 1)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   if (!tableNode || !shouldShowMoveRowUp(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.isFirstRow)) {

package/dist/cjs/ui/TableMenu/shared/TableMenu.js

@@ -37,17 +37,17 @@ var TableMenu = exports.TableMenu = /*#__PURE__*/(0, _react.memo)(function (_ref
     tableNode = _useSharedPluginState.tableNode,
     selection = _useSharedPluginState.selection;
   var tableMenuContext = (0, _react.useMemo)(function () {
-    if (!selection || !tableNode) {
-      return {
-        editorView: editorView
-      };
+    // rely on selection plugins state to re-render the row/column menu, but use editorView.selection
+    // for cell menu state as the selection plugin won't update when text selection changes within cells
+    if (!tableNode || !editorView || !selection) {
+      return undefined;
     }
     var tableMap = _tableMap.TableMap.get(tableNode);
-    var selectionRect = (0, _utils.getSelectionRect)(selection);
+    var selectionRect = (0, _utils.getSelectionRect)(editorView.state.selection);
     var cellOps = {
       editorView: editorView,
-      canMergeCells: (0, _merge.canMergeCellSelection)(selection),
-      canSplitCell: (0, _splitCell.canSplitCellSelection)(selection),
+      canMergeCells: (0, _merge.canMergeCellSelection)(editorView.state.selection),
+      canSplitCell: (0, _splitCell.canSplitCellSelection)(editorView.state.selection),
       hasMergedCellsInTable: tableMap.hasMergedCells()
     };
     if (!selectionRect) {
@@ -61,7 +61,7 @@ var TableMenu = exports.TableMenu = /*#__PURE__*/(0, _react.memo)(function (_ref
       isLastColumn: selectionRect.right === tableMap.width,
       selectedColumnCount: selectionRect.right - selectionRect.left
     });
-  }, [editorView, selection, tableNode]);
+  }, [editorView, tableNode, selection]);
   if (components.length === 0) {
     return null;
   }

package/dist/cjs/ui/TableMenu/shared/consts.js

@@ -5,6 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TABLE_ROW = exports.TABLE_MENU_WIDTH = exports.TABLE_MENU_SELECTOR = exports.TABLE_COLUMN = void 0;
 var TABLE_MENU_WIDTH = exports.TABLE_MENU_WIDTH = 280;
-var TABLE_MENU_SELECTOR = exports.TABLE_MENU_SELECTOR = '[data-testid="column-handle-menu"], [data-testid="row-handle-menu"], [data-toolbar-nested-dropdown-menu]';
+var TABLE_MENU_SELECTOR = exports.TABLE_MENU_SELECTOR = '[data-testid="column-handle-menu"], [data-testid="row-handle-menu"], [data-toolbar-component="menu"], [data-toolbar-nested-dropdown-menu]';
 var TABLE_ROW = exports.TABLE_ROW = 'table-row';
 var TABLE_COLUMN = exports.TABLE_COLUMN = 'table-column';

package/dist/cjs/ui/TableMenu/shared/items/BackgroundColorItem.js

@@ -50,7 +50,7 @@ var BackgroundColorItem = exports.BackgroundColorItem = function BackgroundColor
       return;
     }
     (0, _commandsWithAnalytics.setColorWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, color, editorView)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   }, [api, editorView]);
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage

package/dist/cjs/ui/TableMenu/shared/items/ClearCellsItem.js

@@ -32,7 +32,7 @@ var ClearCellsItem = exports.ClearCellsItem = function ClearCellsItem(_ref) {
     var _getPluginState = (0, _pluginFactory.getPluginState)(editorView.state),
       targetCellPosition = _getPluginState.targetCellPosition;
     (0, _commandsWithAnalytics.emptyMultipleCellsWithAnalytics)(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, targetCellPosition)(editorView.state, editorView.dispatch);
-    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)());
+    api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
     api === null || api === void 0 || api.core.actions.focus();
   };
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {

package/dist/es2019/pm-plugins/commands/active-table-menu.js

@@ -1,15 +1,24 @@
 import { pluginKey } from '../plugin-key';
-export const closeActiveTableMenu = () => ({
+const applyMenuUserIntent = (tr, api, nextActiveTableMenu) => {
+  var _api$userIntent;
+  const isRowOrColumnMenuOpen = nextActiveTableMenu.type === 'row' || nextActiveTableMenu.type === 'column';
+  api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent(isRowOrColumnMenuOpen ? 'tableDragMenuPopupOpen' : 'default')({
+    tr
+  });
+};
+export const closeActiveTableMenu = api => ({
   tr
 }) => {
+  const nextActiveTableMenu = {
+    type: 'none'
+  };
   tr.setMeta(pluginKey, {
     type: 'SET_ACTIVE_TABLE_MENU',
     data: {
-      activeTableMenu: {
-        type: 'none'
-      }
+      activeTableMenu: nextActiveTableMenu
     }
   });
+  applyMenuUserIntent(tr, api, nextActiveTableMenu);
   if (!tr.docChanged) {
     tr.setMeta('addToHistory', false);
   }
@@ -24,17 +33,19 @@ const isSameActiveTableMenu = (current, next) => {
   }
   return true;
 };
-export const toggleActiveTableMenu = (activeTableMenu, currentActiveTableMenu) => ({
+export const toggleActiveTableMenu = (activeTableMenu, currentActiveTableMenu, api) => ({
   tr
 }) => {
+  const nextActiveTableMenu = isSameActiveTableMenu(currentActiveTableMenu, activeTableMenu) ? {
+    type: 'none'
+  } : activeTableMenu;
   tr.setMeta(pluginKey, {
     type: 'SET_ACTIVE_TABLE_MENU',
     data: {
-      activeTableMenu: isSameActiveTableMenu(currentActiveTableMenu, activeTableMenu) ? {
-        type: 'none'
-      } : activeTableMenu
+      activeTableMenu: nextActiveTableMenu
     }
   });
+  applyMenuUserIntent(tr, api, nextActiveTableMenu);
   tr.setMeta('addToHistory', false);
   return tr;
 };

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

@@ -10,7 +10,6 @@ import { deleteRows } from '../transforms/delete-rows';
 import { mergeCells } from '../transforms/merge';
 import { withEditorAnalyticsAPI, getSelectedCellInfo, getSelectedTableInfo } from '../utils/analytics';
 import { checkIfNumberColumnEnabled } from '../utils/nodes';
-import { toggleActiveTableMenu } from './active-table-menu';
 import { clearMultipleCells } from './clear';
 import { wrapTableInExpand } from './collapse';
 import { changeColumnWidthByStep } from './column-resize';
@@ -21,44 +20,6 @@ import { deleteTable, deleteTableIfSelected, getTableSelectionType, setMultipleC
 import { sortByColumn } from './sort';
 import { splitCell } from './split-cell';
 import { toggleHeaderColumn, toggleHeaderRow, toggleNumberColumn } from './toggle';
-export const toggleActiveTableMenuWithAnalytics = editorAnalyticsAPI => (direction, index, trigger = 'mouse') => {
-  return withEditorAnalyticsAPI(state => {
-    const {
-      activeTableMenu: previousActiveTableMenu
-    } = getPluginState(state);
-    const isSameActiveMenu = (previousActiveTableMenu === null || previousActiveTableMenu === void 0 ? void 0 : previousActiveTableMenu.type) === direction && previousActiveTableMenu.index === index;
-    if (isSameActiveMenu) {
-      return undefined;
-    }
-    return {
-      action: TABLE_ACTION.DRAG_MENU_OPENED,
-      actionSubject: ACTION_SUBJECT.TABLE,
-      actionSubjectId: null,
-      eventType: EVENT_TYPE.TRACK,
-      attributes: {
-        inputMethod: trigger === 'keyboard' ? INPUT_METHOD.KEYBOARD : INPUT_METHOD.MOUSE,
-        direction
-      }
-    };
-  })(editorAnalyticsAPI)((state, dispatch) => {
-    if (dispatch) {
-      const {
-        activeTableMenu: currentActiveTableMenu
-      } = getPluginState(state);
-      const newTr = toggleActiveTableMenu({
-        type: direction,
-        index,
-        openedBy: trigger
-      }, currentActiveTableMenu)({
-        tr: state.tr
-      });
-      if (newTr) {
-        dispatch(newTr);
-      }
-    }
-    return true;
-  });
-};
 export const emptyMultipleCellsWithAnalytics = editorAnalyticsAPI => (inputMethod, targetCellPosition) => withEditorAnalyticsAPI(({
   selection
 }) => {

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

@@ -98,7 +98,7 @@ const destroyFn = (editorView, editorAnalyticsAPI, isTableScalingEnabled, isTabl
           tr
         }) => {
           var _api$userIntent;
-          closeActiveTableMenu()({
+          closeActiveTableMenu(api)({
             tr
           });
           api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('dragging')({

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

@@ -44,7 +44,7 @@ const updateTargetCellPosition = ({
     }
     const hasTargetCellChanged = pluginState.targetCellPosition !== targetCellPosition;
     const hasActiveTableMenu = pluginState.activeTableMenu != null && pluginState.activeTableMenu.type !== 'none';
-    const shouldCloseMenu = hasActiveTableMenu && (!tableNode || hasTargetCellChanged || !(tr.selection instanceof CellSelection));
+    const shouldCloseMenu = hasActiveTableMenu && tr.selectionSet && (!tableNode || hasTargetCellChanged || !(tr.selection instanceof CellSelection));
     if (!hasTargetCellChanged && !shouldCloseMenu) {
       return pluginState;
     }

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

@@ -41,6 +41,9 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
     isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
     isHeaderColumnEnabled: false,
     isTableScalingEnabled: isTableScalingEnabled,
+    activeTableMenu: {
+      type: 'none'
+    },
     ...defaultHoveredCell,
     ...defaultTableSelection,
     getIntl

package/dist/es2019/ui/ContentComponent.js

@@ -5,6 +5,7 @@ import { getDomRefFromSelection } from '@atlaskit/editor-common/get-dom-ref-from
 import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import { ResizerBreakoutModeLabel } from '@atlaskit/editor-common/resizer';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import FloatingContextualButton from './FloatingContextualButton';
 import FloatingContextualMenu from './FloatingContextualMenu';
@@ -12,6 +13,7 @@ import FloatingDragMenu from './FloatingDragMenu';
 // Ignored via go/ees005
 // eslint-disable-next-line import/no-named-as-default
 import FloatingInsertButton from './FloatingInsertButton';
+import FloatingTableMenu from './FloatingTableMenu';
 import { FloatingToolbarLabel } from './FloatingToolbarLabel/FloatingToolbarLabel';
 import { GlobalStylesWrapper } from './global-styles';
 import { SizeSelector } from './SizeSelector';
@@ -138,7 +140,15 @@ const ContentComponentInternal = ({
     isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
     api: api,
     isDragMenuOpen: isDragMenuOpen
-  }), /*#__PURE__*/React.createElement(FloatingDragMenu, {
+  }), expValEquals('platform_editor_table_menu_updates', 'isEnabled', true) ? /*#__PURE__*/React.createElement(FloatingTableMenu, {
+    api: api,
+    boundariesElement: popupsBoundariesElement,
+    editorView: editorView,
+    mountPoint: popupsMountPoint,
+    stickyHeaders: stickyHeader,
+    tableWrapper: tableWrapperTarget,
+    targetCellPosition: targetCellPosition
+  }) : /*#__PURE__*/React.createElement(FloatingDragMenu, {
     editorView: editorView,
     mountPoint: popupsMountPoint,
     boundariesElement: popupsBoundariesElement,

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

@@ -76,7 +76,7 @@ const FloatingContextualButtonInner = /*#__PURE__*/React.memo(props => {
         toggleActiveTableMenu({
           type: 'cell',
           openedBy: 'mouse'
-        }, currentActiveTableMenu)({
+        }, currentActiveTableMenu, api)({
           tr
         });
         return tr;
@@ -115,7 +115,7 @@ const FloatingContextualButtonInner = /*#__PURE__*/React.memo(props => {
           toggleActiveTableMenu({
             type: 'cell',
             openedBy: 'keyboard'
-          }, currentActiveTableMenu)({
+          }, currentActiveTableMenu, api)({
             tr
           });
           return tr;

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

@@ -32,11 +32,11 @@ export const CellMenuPopup = ({
     const {
       isCellMenuOpenByKeyboard
     } = getPluginState(editorView.state);
-    api === null || api === void 0 ? void 0 : api.core.actions.execute(closeActiveTableMenu());
+    api === null || api === void 0 ? void 0 : api.core.actions.execute(closeActiveTableMenu(api));
     if (isCellMenuOpenByKeyboard) {
       setFocusToCellMenu(false)(editorView.state, editorView.dispatch);
     }
-  }, [api === null || api === void 0 ? void 0 : api.core.actions, editorView]);
+  }, [api, editorView]);
   const isEventInsideCellMenu = useCallback(event => {
     var _popupContentRef$curr;
     const target = event.target;