@atlaskit/editor-plugin-table 4.2.1 → 5.1.0

package/src/__tests__/unit/transforms/delete-columns.ts

@@ -1,11 +1,11 @@
 import { uuid } from '@atlaskit/adf-schema';
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { Rect } from '@atlaskit/editor-tables/table-map';

package/src/__tests__/unit/transforms/delete-rows.ts

@@ -1,11 +1,11 @@
 import { uuid } from '@atlaskit/adf-schema';
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { Rect } from '@atlaskit/editor-tables/table-map';

package/src/__tests__/unit/transforms/merging.ts

@@ -1,11 +1,11 @@
 import { uuid } from '@atlaskit/adf-schema';
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';

package/src/__tests__/unit/ui/ContextualMenu.tsx

@@ -4,11 +4,11 @@ import { render, screen } from '@testing-library/react';
 import { createIntl } from 'react-intl-next';
 
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';

package/src/__tests__/unit/ui/CornerControls.tsx

@@ -5,11 +5,11 @@ import { IntlProvider } from 'react-intl-next';
 
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import { isTableSelected } from '@atlaskit/editor-tables/utils';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';

package/src/__tests__/unit/ui/FloatingContextualButton.tsx

@@ -6,11 +6,11 @@ import { IntlProvider } from 'react-intl-next';
 import type { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { ContentNodeWithPos } from '@atlaskit/editor-prosemirror/utils';
 import * as prosemirrorUtils from '@atlaskit/editor-prosemirror/utils';

package/src/__tests__/unit/ui/FloatingContextualMenu.tsx

@@ -4,11 +4,11 @@ import { render, screen } from '@testing-library/react';
 import { IntlProvider } from 'react-intl-next';
 
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';

package/src/__tests__/unit/ui/RowControls.tsx

@@ -6,11 +6,11 @@ import { IntlProvider } from 'react-intl-next';
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 import { setTextSelection } from '@atlaskit/editor-common/utils';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import { getSelectionRect, selectRow } from '@atlaskit/editor-tables/utils';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';

package/src/__tests__/unit/ui/TableFloatingControls.tsx

@@ -5,11 +5,11 @@ import { IntlProvider } from 'react-intl-next';
 
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';

package/src/__tests__/unit/undo-redo.ts

@@ -2,11 +2,11 @@ import clone from 'lodash/clone';
 
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import { redo, undo } from '@atlaskit/editor-prosemirror/history';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';

package/src/__tests__/unit/utils/collapse.ts

@@ -1,10 +1,10 @@
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies

package/src/__tests__/unit/utils/nodes.ts

@@ -1,10 +1,10 @@
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import { findTable } from '@atlaskit/editor-tables/utils';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';

package/src/__tests__/unit/utils/row-controls.ts

@@ -1,11 +1,11 @@
 import { uuid } from '@atlaskit/adf-schema';
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { findTable } from '@atlaskit/editor-tables/utils';

package/src/__tests__/unit/utils.ts

@@ -1,10 +1,10 @@
 import type { DocBuilder } from '@atlaskit/editor-common/types';
 // eslint-disable-next-line import/no-extraneous-dependencies -- Removed import for fixing circular dependencies
-import selectionPlugin from '@atlaskit/editor-core/src/plugins/selection';
 import { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import { contentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import { featureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import { guidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import { selectionPlugin } from '@atlaskit/editor-plugin-selection';
 import { widthPlugin } from '@atlaskit/editor-plugin-width';
 import type { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import type { LightEditorPlugin } from '@atlaskit/editor-test-helpers/create-prosemirror-editor';

package/src/plugins/table/commands/selection.ts

@@ -1,13 +1,16 @@
+import type { SelectionSharedState } from '@atlaskit/editor-common/selection';
 import {
-  EditorSelectionAPI,
   GapCursorSelection,
   isSelectionAtEndOfNode,
   isSelectionAtStartOfNode,
   RelativeSelectionPos,
   Side,
 } from '@atlaskit/editor-common/selection';
-import type { Command } from '@atlaskit/editor-common/types';
-import {
+import type {
+  Command,
+  ExtractInjectionAPI,
+} from '@atlaskit/editor-common/types';
+import type {
   Node as PmNode,
   ResolvedPos,
 } from '@atlaskit/editor-prosemirror/model';
@@ -16,13 +19,19 @@ import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { findTable, isTableSelected } from '@atlaskit/editor-tables/utils';
 
+import type tablePlugin from '../index';
+
 export enum TableSelectionDirection {
   TopToBottom = 'TopToBottom',
   BottomToTop = 'BottomToTop',
 }
 
 export const arrowLeftFromTable =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (): Command =>
   (state, dispatch) => {
     const { selection } = state;
@@ -43,7 +52,11 @@ export const arrowLeftFromTable =
   };
 
 export const arrowRightFromTable =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (): Command =>
   (state, dispatch) => {
     const { selection } = state;
@@ -65,22 +78,30 @@ export const arrowRightFromTable =
   };
 
 const arrowLeftFromCellSelection =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (selection: CellSelection): Command =>
   (state, dispatch) => {
     if (isTableSelected(state.selection) && editorSelectionAPI) {
-      const { selectionRelativeToNode } =
-        editorSelectionAPI.getSelectionPluginState(state);
-      if (selectionRelativeToNode === RelativeSelectionPos.Start) {
+      const selectionState: SelectionSharedState =
+        editorSelectionAPI.sharedState.currentState() || {};
+      if (
+        selectionState?.selectionRelativeToNode === RelativeSelectionPos.Start
+      ) {
         // we have full table cell selection and want to set gap cursor selection before table
         return setGapCursorBeforeTable(editorSelectionAPI)()(state, dispatch);
-      } else if (selectionRelativeToNode === RelativeSelectionPos.End) {
+      } else if (
+        selectionState?.selectionRelativeToNode === RelativeSelectionPos.End
+      ) {
         // we have full table cell selection and want to set selection at end of last cell
         return setSelectionAtEndOfLastCell(editorSelectionAPI)(selection)(
           state,
           dispatch,
         );
-      } else if (selectionRelativeToNode === undefined) {
+      } else if (selectionState?.selectionRelativeToNode === undefined) {
         // we have full table cell selection and want to set selection at start of first cell
         return setSelectionAtStartOfFirstCell(editorSelectionAPI)(
           selection,
@@ -92,12 +113,16 @@ const arrowLeftFromCellSelection =
   };
 
 const arrowRightFromCellSelection =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (selection: CellSelection): Command =>
   (state, dispatch) => {
     if (isTableSelected(state.selection) && editorSelectionAPI) {
       const { selectionRelativeToNode } =
-        editorSelectionAPI.getSelectionPluginState(state);
+        editorSelectionAPI.sharedState.currentState() || {};
 
       if (selectionRelativeToNode === RelativeSelectionPos.Start) {
         // we have full table cell selection and want to set selection at start of first cell
@@ -117,7 +142,11 @@ const arrowRightFromCellSelection =
   };
 
 const arrowLeftFromGapCursor =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (selection: GapCursorSelection): Command =>
   (state, dispatch) => {
     const { doc } = state;
@@ -139,9 +168,12 @@ const arrowLeftFromGapCursor =
         isSelectionAtStartOfTable($from, selection) &&
         editorSelectionAPI
       ) {
-        const { selectionRelativeToNode } =
-          editorSelectionAPI.getSelectionPluginState(state);
-        if (selectionRelativeToNode === RelativeSelectionPos.Before) {
+        const selectionState: SelectionSharedState =
+          editorSelectionAPI.sharedState.currentState() || {};
+        if (
+          selectionState?.selectionRelativeToNode ===
+          RelativeSelectionPos.Before
+        ) {
           // we have a gap cursor at start of first table cell and want to set a gap cursor selection before table
           return setGapCursorBeforeTable(editorSelectionAPI)()(state, dispatch);
         } else {
@@ -158,7 +190,11 @@ const arrowLeftFromGapCursor =
   };
 
 const arrowRightFromGapCursor =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (selection: GapCursorSelection): Command =>
   (state, dispatch) => {
     const { $from, from, $to, side } = selection;
@@ -187,7 +223,11 @@ const arrowRightFromGapCursor =
   };
 
 const arrowLeftFromText =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (selection: TextSelection): Command =>
   (state, dispatch) => {
     const table = findTable(selection);
@@ -199,9 +239,13 @@ const arrowLeftFromText =
         $from.depth === table.depth + 3 && // + 3 for: row, cell & paragraph nodes
         editorSelectionAPI
       ) {
-        const { selectionRelativeToNode } =
-          editorSelectionAPI.getSelectionPluginState(state);
-        if (selectionRelativeToNode === RelativeSelectionPos.Before) {
+        const selectionState: SelectionSharedState =
+          editorSelectionAPI.sharedState.currentState() || {};
+
+        if (
+          selectionState?.selectionRelativeToNode ===
+          RelativeSelectionPos.Before
+        ) {
           // we have a text selection at start of first table cell, directly inside a top level paragraph,
           // and want to set gap cursor selection before table
           return setGapCursorBeforeTable(editorSelectionAPI)()(state, dispatch);
@@ -220,7 +264,11 @@ const arrowLeftFromText =
   };
 
 const arrowRightFromText =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (selection: TextSelection): Command =>
   (state, dispatch) => {
     const table = findTable(selection);
@@ -250,7 +298,11 @@ const arrowRightFromText =
  * pos in the selection plugin
  */
 const selectFullTable =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   ({
     node,
     startPos,
@@ -276,7 +328,7 @@ const selectFullTable =
       selectionRelativeToNode = RelativeSelectionPos.Start;
     }
     if (editorSelectionAPI) {
-      const tr = editorSelectionAPI.setSelectionRelativeToNode({
+      const tr = editorSelectionAPI.actions.selectNearNode({
         selectionRelativeToNode,
         selection: fullTableSelection,
       })(state);
@@ -290,7 +342,11 @@ const selectFullTable =
   };
 
 const setSelectionAtStartOfFirstCell =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (
     selection: CellSelection,
     selectionRelativeToNode?: RelativeSelectionPos,
@@ -307,7 +363,7 @@ const setSelectionAtStartOfFirstCell =
       : Selection.findFrom($firstPosInsideCell, 1);
 
     if (editorSelectionAPI) {
-      const tr = editorSelectionAPI.setSelectionRelativeToNode({
+      const tr = editorSelectionAPI.actions.selectNearNode({
         selectionRelativeToNode,
         selection: selectionAtStartOfCell,
       })(state);
@@ -321,7 +377,11 @@ const setSelectionAtStartOfFirstCell =
   };
 
 const setSelectionAtEndOfLastCell =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (
     selection: CellSelection,
     selectionRelativeToNode?: RelativeSelectionPos,
@@ -341,7 +401,7 @@ const setSelectionAtEndOfLastCell =
       : Selection.findFrom($lastPosInsideCell, -1);
 
     if (editorSelectionAPI) {
-      const tr = editorSelectionAPI.setSelectionRelativeToNode({
+      const tr = editorSelectionAPI.actions.selectNearNode({
         selectionRelativeToNode,
         selection: selectionAtEndOfCell,
       })(state);
@@ -355,7 +415,11 @@ const setSelectionAtEndOfLastCell =
   };
 
 const setGapCursorBeforeTable =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (): Command =>
   (state, dispatch) => {
     const table = findTable(state.selection);
@@ -367,7 +431,7 @@ const setGapCursorBeforeTable =
           Side.LEFT,
         );
         if (editorSelectionAPI) {
-          const tr = editorSelectionAPI.setSelectionRelativeToNode({
+          const tr = editorSelectionAPI.actions.selectNearNode({
             selectionRelativeToNode: undefined,
             selection: selectionBeforeTable,
           })(state);
@@ -383,7 +447,11 @@ const setGapCursorBeforeTable =
   };
 
 const setGapCursorAfterTable =
-  (editorSelectionAPI: EditorSelectionAPI | undefined | null) =>
+  (
+    editorSelectionAPI:
+      | ExtractInjectionAPI<typeof tablePlugin>['selection']
+      | undefined,
+  ) =>
   (): Command =>
   (state, dispatch) => {
     const table = findTable(state.selection);
@@ -396,7 +464,7 @@ const setGapCursorAfterTable =
         );
 
         if (editorSelectionAPI) {
-          const tr = editorSelectionAPI.setSelectionRelativeToNode({
+          const tr = editorSelectionAPI.actions.selectNearNode({
             selectionRelativeToNode: undefined,
             selection: selectionAfterTable,
           })(state);

package/src/plugins/table/index.tsx

@@ -21,21 +21,19 @@ import { IconTable } from '@atlaskit/editor-common/icons';
 import { toggleTable, tooltip } from '@atlaskit/editor-common/keymaps';
 import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import type { EditorSelectionAPI } from '@atlaskit/editor-common/selection';
 import type {
   Command,
-  EditorCommand,
   EditorPlugin,
   GetEditorContainerWidth,
   GetEditorFeatureFlags,
   NextEditorPlugin,
-  OptionalPlugin,
 } from '@atlaskit/editor-common/types';
 import { browser } from '@atlaskit/editor-common/utils';
 import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { ContentInsertionPlugin } from '@atlaskit/editor-plugin-content-insertion';
 import type { GuidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
@@ -45,6 +43,10 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
 import { pluginConfig } from './create-plugin-config';
 import { createPlugin as createDecorationsPlugin } from './pm-plugins/decorations/plugin';
+import {
+  createPlugin as createDragAndDropPlugin,
+  pluginKey as dragAndDropPluginKey,
+} from './pm-plugins/drag-and-drop';
 import { keymapPlugin } from './pm-plugins/keymap';
 import { createPlugin } from './pm-plugins/main';
 import { pluginKey } from './pm-plugins/plugin-key';
@@ -76,7 +78,6 @@ import FloatingDeleteButton from './ui/FloatingDeleteButton';
 import FloatingInsertButton from './ui/FloatingInsertButton';
 import LayoutButton from './ui/LayoutButton';
 import { isLayoutSupported } from './utils';
-
 interface TablePluginOptions {
   tableOptions: PluginConfig;
   // experimental custom table resizing experience, set inside editor-core behind a feature flag
@@ -88,22 +89,11 @@ interface TablePluginOptions {
   // TODO these two need to be rethought
   fullWidthEnabled?: boolean;
   wasFullWidthEnabled?: boolean;
-  editorSelectionAPI?: EditorSelectionAPI;
   getEditorFeatureFlags?: GetEditorFeatureFlags;
 }
 
 type InsertTableAction = (analyticsPayload: AnalyticsEventPayload) => Command;
 
-// TODO: duplicated SelectionPlugin type as it's still in editor-core, doing this avoid
-// circular dependencies
-type SelectionPlugin = NextEditorPlugin<
-  'selection',
-  {
-    pluginConfiguration: unknown;
-    commands: { displayGapCursor: (toggle: boolean) => EditorCommand };
-  }
->;
-
 const defaultGetEditorFeatureFlags = () => ({});
 
 export type TablePlugin = NextEditorPlugin<
@@ -118,7 +108,7 @@ export type TablePlugin = NextEditorPlugin<
       ContentInsertionPlugin,
       WidthPlugin,
       GuidelinePlugin,
-      OptionalPlugin<SelectionPlugin>,
+      SelectionPlugin,
     ];
   }
 >;
@@ -242,7 +232,7 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
         },
         {
           name: 'tableSelectionKeymap',
-          plugin: () => tableSelectionKeymapPlugin(options?.editorSelectionAPI),
+          plugin: () => tableSelectionKeymapPlugin(api?.selection),
         },
         {
           name: 'tableEditing',
@@ -280,6 +270,13 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
                 )
               : undefined,
         },
+        {
+          name: 'tableDragAndDrop',
+          plugin: ({ dispatch, eventDispatcher }) =>
+            options?.dragAndDropEnabled
+              ? createDragAndDropPlugin(dispatch, eventDispatcher)
+              : undefined,
+        },
         {
           name: 'tableLocalId',
           plugin: ({ dispatch }) => createTableLocalIdPlugin(dispatch),
@@ -357,6 +354,7 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
               tableWidthPluginState: tableWidthPluginKey,
               tableResizingPluginState: tableResizingPluginKey,
               stickyHeadersState: stickyHeadersPluginKey,
+              dragAndDropState: dragAndDropPluginKey,
             }}
             render={({
               tableResizingPluginState: resizingPluginState,

package/src/plugins/table/pm-plugins/drag-and-drop/actions.ts

@@ -0,0 +1,29 @@
+import type { DropTargetType } from './consts';
+
+export interface DragAndDropAction<T, D> {
+  type: T;
+  data: D;
+}
+
+export const DragAndDropActionType = {
+  SET_DROP_TARGET: 'SET_DROP_TARGET',
+  CLEAR_DROP_TARGET: 'CLEAR_DROP_TARGET',
+} as const;
+
+export type DragAndDropSetDropTargetAction = DragAndDropAction<
+  typeof DragAndDropActionType.SET_DROP_TARGET,
+  {
+    type: DropTargetType;
+    index: number;
+  }
+>;
+
+export type DragAndDropClearDropTargetAction = DragAndDropAction<
+  typeof DragAndDropActionType.CLEAR_DROP_TARGET,
+  undefined
+>;
+
+// NOTE: This should be a Union of all possible actions
+export type DragAndDropPluginAction =
+  | DragAndDropSetDropTargetAction
+  | DragAndDropClearDropTargetAction;

package/src/plugins/table/pm-plugins/drag-and-drop/commands.ts

@@ -0,0 +1,32 @@
+import type { Transaction } from '@atlaskit/editor-prosemirror/state';
+
+import { DragAndDropActionType } from './actions';
+import type { DropTargetType } from './consts';
+import { createCommand } from './plugin-factory';
+
+// TODO: This command is a placeholder example. Please replace this if required.
+export const setDropTarget = (
+  type: DropTargetType,
+  index: number,
+  tr?: Transaction,
+) =>
+  createCommand(
+    {
+      type: DragAndDropActionType.SET_DROP_TARGET,
+      data: {
+        type,
+        index,
+      },
+    },
+    (originalTr: Transaction) =>
+      (tr || originalTr).setMeta('addToHistory', false),
+  );
+
+export const clearDropTarget = (tr?: Transaction) =>
+  createCommand(
+    {
+      type: DragAndDropActionType.CLEAR_DROP_TARGET,
+    },
+    (originalTr: Transaction) =>
+      (tr || originalTr).setMeta('addToHistory', false),
+  );