@atlaskit/editor-plugin-table 8.2.1 → 8.3.0

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

@@ -30,17 +30,17 @@ export const autoScrollerFactory = ({
       return localId === (node === null || node === void 0 ? void 0 : node.attrs.localId) && type === 'table-column';
     },
     getOverflow: () => ({
-      fromTopEdge: {
+      forTopEdge: {
         top: dropTargetExtendedWidth,
         right: dropTargetExtendedWidth,
         left: dropTargetExtendedWidth
       },
-      fromRightEdge: {
+      forRightEdge: {
         right: dropTargetExtendedWidth,
         top: dropTargetExtendedWidth,
         bottom: dropTargetExtendedWidth
       },
-      fromLeftEdge: {
+      forLeftEdge: {
         top: dropTargetExtendedWidth,
         left: dropTargetExtendedWidth,
         bottom: dropTargetExtendedWidth

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

@@ -1,11 +1,13 @@
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { addColumnAfter, addColumnAfterVO, addColumnBefore, addColumnBeforeVO, addRowAfter, addRowAfterVO, addRowBefore, addRowBeforeVO, backspace, bindKeymapWithCommand, decreaseMediaSize, deleteColumn, deleteRow, escape, focusToContextMenuTrigger, increaseMediaSize, moveColumnLeft, moveColumnRight, moveLeft, moveRight, moveRowDown, moveRowUp, nextCell, previousCell, startColumnResizing, toggleTable } from '@atlaskit/editor-common/keymaps';
+import { editorCommandToPMCommand } from '@atlaskit/editor-common/preset';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { goToNextCell, moveCursorBackward, setFocusToCellMenu } from '../commands';
 import { addRowAroundSelection, changeColumnWidthByStepWithAnalytics, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut, deleteTableIfSelectedWithAnalytics, emptyMultipleCellsWithAnalytics } from '../commands-with-analytics';
 import { activateNextResizeArea, initiateKeyboardColumnResizing, stopKeyboardColumnResizing } from '../commands/column-resize';
-import { addColumnAfter as addColumnAfterCommand, addColumnBefore as addColumnBeforeCommand, createTable } from '../commands/insert';
+import { addColumnAfter as addColumnAfterCommand, addColumnBefore as addColumnBeforeCommand, createTable, insertTableWithNestingSupport } from '../commands/insert';
 import { moveSourceWithAnalyticsViaShortcut } from '../pm-plugins/drag-and-drop/commands-with-analytics';
 export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled = false, isTableAlignmentEnabled = false, isFullWidthEnabled, pluginInjectionApi, getIntl, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, isTableResizingEnabled) {
   var _pluginInjectionApi$a;
@@ -13,7 +15,22 @@ export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProvide
   const ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
   bindKeymapWithCommand(nextCell.common, goToNextCell(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(1), list);
   bindKeymapWithCommand(previousCell.common, goToNextCell(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(-1), list);
-  bindKeymapWithCommand(toggleTable.common, createTable(isTableScalingEnabled, isTableAlignmentEnabled, !!isFullWidthEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled), list);
+  bindKeymapWithCommand(toggleTable.common, fg('platform_editor_use_nested_table_pm_nodes') ? editorCommandToPMCommand(insertTableWithNestingSupport({
+    isTableScalingEnabled,
+    isTableAlignmentEnabled,
+    isFullWidthModeEnabled: !!isFullWidthEnabled,
+    isCommentEditor: isCommentEditor,
+    isChromelessEditor: isChromelessEditor,
+    isTableResizingEnabled
+  }, api, {
+    action: ACTION.INSERTED,
+    actionSubject: ACTION_SUBJECT.DOCUMENT,
+    actionSubjectId: ACTION_SUBJECT_ID.TABLE,
+    attributes: {
+      inputMethod: INPUT_METHOD.SHORTCUT
+    },
+    eventType: EVENT_TYPE.TRACK
+  })) : createTable(isTableScalingEnabled, isTableAlignmentEnabled, !!isFullWidthEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled), list);
   bindKeymapWithCommand(backspace.common, chainCommands(deleteTableIfSelectedWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD), emptyMultipleCellsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD)), list);
   bindKeymapWithCommand(backspace.common, moveCursorBackward, list);
 

package/dist/es2019/ui/FloatingDragMenu/DragMenu.js

@@ -21,6 +21,7 @@ import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { findCellRectClosestToPos, getSelectionRect, isSelectionType } from '@atlaskit/editor-tables/utils';
 import EditorBackgroundColorIcon from '@atlaskit/icon/core/migration/paint-bucket--editor-background-color';
 import PaintBucketIcon from '@atlaskit/icon/core/paint-bucket';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, xcss } from '@atlaskit/primitives';
 import Toggle from '@atlaskit/toggle';
 import { clearHoverSelection, hoverColumns, hoverRows } from '../../commands';
@@ -505,7 +506,7 @@ const DragMenu = /*#__PURE__*/React.memo(({
     fitHeight: fitHeight,
     fitWidth: fitWidth,
     direction: direction,
-    mountPoint: mountPoint,
+    mountPoint: fg('platform_editor_table_drag_menu_mount_point_fix') ? undefined : mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement
   });

package/dist/esm/commands/insert.js

@@ -1,10 +1,16 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 // #region Imports
 import { AddColumnStep } from '@atlaskit/custom-steps';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD, TABLE_OVERFLOW_CHANGE_TRIGGER } from '@atlaskit/editor-common/analytics';
-import { Selection } from '@atlaskit/editor-prosemirror/state';
-import { safeInsert } from '@atlaskit/editor-prosemirror/utils';
+import { getParentOfTypeCount, getPositionAfterTopParentNodeOfType } from '@atlaskit/editor-common/nesting';
+import { Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { hasParentNodeOfType, safeInsert } from '@atlaskit/editor-prosemirror/utils';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { addColumnAt as addColumnAtPMUtils, addRowAt, findTable, selectedRect } from '@atlaskit/editor-tables/utils';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { updateRowOrColumnMovedTransform } from '../pm-plugins/analytics/commands';
 import { META_KEYS } from '../pm-plugins/table-analytics';
 import { rescaleColumns } from '../transforms/column-width';
@@ -141,6 +147,12 @@ export var insertRow = function insertRow(row, moveCursorToTheNewRow) {
     return true;
   };
 };
+
+/**
+ * @private
+ * @deprecated This function is deprecated - please use insertTableWithNestingSupport instead.
+ * (To be removed with feature gate: `platform_editor_use_nested_table_pm_nodes`)
+ */
 export var createTable = function createTable(isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled) {
   return function (state, dispatch) {
     var table = createTableWithWidth({
@@ -169,6 +181,12 @@ export var createTable = function createTable(isTableScalingEnabled, isTableAlig
     return true;
   };
 };
+
+/**
+ * @private
+ * @deprecated This function is deprecated - please use insertTableWithNestingSupport instead.
+ * (To be removed with feature gate: `platform_editor_use_nested_table_pm_nodes`)
+ */
 export var insertTableWithSize = function insertTableWithSize(isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor) {
   return function (rowsCount, colsCount, inputMethod) {
     return function (_ref) {
@@ -201,4 +219,81 @@ export var insertTableWithSize = function insertTableWithSize(isFullWidthModeEna
       return newTr;
     };
   };
+};
+
+/**
+ * Unified command to insert a new table into the editor.
+ *
+ * @param {Object} options - Configuration options for table insertion.
+ * @param {boolean} [options.isTableScalingEnabled=false] - Flag to enable table scaling.
+ * @param {boolean} [options.isTableAlignmentEnabled=false] - Flag to enable table alignment.
+ * @param {boolean} [options.isFullWidthModeEnabled=false] - Flag to enable full-width mode for the table.
+ * @param {boolean} [options.isCommentEditor=false] - Flag to indicate if the editor is in comment mode.
+ * @param {boolean} [options.isChromelessEditor=false] - Flag to indicate if the editor is chromeless.
+ * @param {boolean} [options.isTableResizingEnabled=false] - Flag to enable table resizing.
+ * @param {Object} [options.createTableProps={}] - Additional properties for table creation, including table size.
+ * @param {Object} api - PluginInjectinoApi object for content insertion commands.
+ * @param {Object} analyticsPayload - Payload for analytics tracking.
+ *
+ * @returns {Function} A function that takes a transaction and inserts a table.
+ */
+export var insertTableWithNestingSupport = function insertTableWithNestingSupport(_ref2, api, analyticsPayload) {
+  var _ref2$isTableScalingE = _ref2.isTableScalingEnabled,
+    isTableScalingEnabled = _ref2$isTableScalingE === void 0 ? false : _ref2$isTableScalingE,
+    _ref2$isTableAlignmen = _ref2.isTableAlignmentEnabled,
+    isTableAlignmentEnabled = _ref2$isTableAlignmen === void 0 ? false : _ref2$isTableAlignmen,
+    _ref2$isFullWidthMode = _ref2.isFullWidthModeEnabled,
+    isFullWidthModeEnabled = _ref2$isFullWidthMode === void 0 ? false : _ref2$isFullWidthMode,
+    _ref2$isCommentEditor = _ref2.isCommentEditor,
+    isCommentEditor = _ref2$isCommentEditor === void 0 ? false : _ref2$isCommentEditor,
+    _ref2$isChromelessEdi = _ref2.isChromelessEditor,
+    isChromelessEditor = _ref2$isChromelessEdi === void 0 ? false : _ref2$isChromelessEdi,
+    _ref2$isTableResizing = _ref2.isTableResizingEnabled,
+    isTableResizingEnabled = _ref2$isTableResizing === void 0 ? false : _ref2$isTableResizing,
+    _ref2$createTableProp = _ref2.createTableProps,
+    createTableProps = _ref2$createTableProp === void 0 ? {} : _ref2$createTableProp;
+  return function (_ref3) {
+    var _api$contentInsertion;
+    var tr = _ref3.tr;
+    var schema = tr.doc.type.schema;
+    var node = createTableWithWidth({
+      isTableScalingEnabled: isTableScalingEnabled,
+      isTableAlignmentEnabled: isTableAlignmentEnabled,
+      isFullWidthModeEnabled: isFullWidthModeEnabled,
+      isCommentEditor: isCommentEditor,
+      isChromelessEditor: isChromelessEditor,
+      isTableResizingEnabled: isTableResizingEnabled,
+      createTableProps: createTableProps
+    })(schema);
+
+    // If the cursor is inside a table
+    var insertAt;
+    if (hasParentNodeOfType(schema.nodes.table)(tr.selection) && fg('platform_editor_use_nested_table_pm_nodes')) {
+      // If the experiment is disabled, or we're trying to nest deeper than one level, we insert the table after the top table
+      if (editorExperiment('nested-tables-in-tables', false, {
+        exposure: true
+      }) || getParentOfTypeCount(schema.nodes.table)(tr.selection) > 1) {
+        var positionAfterTopTable = getPositionAfterTopParentNodeOfType(schema.nodes.table)(tr.selection);
+        if (!positionAfterTopTable) {
+          return tr;
+        }
+        insertAt = TextSelection.create(tr.doc, positionAfterTopTable);
+      }
+    }
+    api === null || api === void 0 || (_api$contentInsertion = api.contentInsertion) === null || _api$contentInsertion === void 0 || (_api$contentInsertion = _api$contentInsertion.commands) === null || _api$contentInsertion === void 0 || _api$contentInsertion.insert({
+      node: node,
+      options: {
+        selectNodeInserted: false,
+        analyticsPayload: analyticsPayload ? _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+          attributes: _objectSpread(_objectSpread({}, analyticsPayload.attributes), {}, {
+            localId: node.attrs.localId
+          })
+        }) : undefined,
+        insertAt: insertAt
+      }
+    })({
+      tr: tr
+    });
+    return tr;
+  };
 };

package/dist/esm/plugin.js

@@ -10,15 +10,15 @@ 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 { getParentOfTypeCount, getPositionAfterTopParentNodeOfType } from '@atlaskit/editor-common/nesting';
+import { editorCommandToPMCommand } from '@atlaskit/editor-common/preset';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
-import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { hasParentNodeOfType, safeInsert } from '@atlaskit/editor-prosemirror/utils';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { tableEditing } from '@atlaskit/editor-tables/pm-plugins';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
-import { insertTableWithSize } from './commands/insert';
+import { insertTableWithNestingSupport, insertTableWithSize } from './commands/insert';
 import { pluginConfig } from './create-plugin-config';
 import { createPlugin as createTableAnalyticsPlugin } from './pm-plugins/analytics/plugin';
 import { pluginKey as tableAnalyticsPluginKey } from './pm-plugins/analytics/plugin-key';
@@ -109,53 +109,72 @@ var tablesPlugin = function tablesPlugin(_ref) {
     actions: {
       insertTable: function insertTable(analyticsPayload) {
         return function (state, dispatch) {
-          var _api$contentInsertion, _api$contentInsertion2;
-          var node = createTableWithWidth({
-            isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
-            isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
-            isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
-            isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
-            isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
-            isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing
-          })(state.schema);
-
-          // If the cursor is inside a table
-          var insertAt;
-          if (hasParentNodeOfType(state.schema.nodes.table)(state.selection) && fg('platform_editor_use_nested_table_pm_nodes')) {
-            // If the experiment is disabled, or we're trying to nest deeper than one level, we insert the table after the top table
-            if (editorExperiment('nested-tables-in-tables', false, {
-              exposure: true
-            }) || getParentOfTypeCount(state.schema.nodes.table)(state.selection) > 1) {
-              var positionAfterTopTable = getPositionAfterTopParentNodeOfType(state.schema.nodes.table)(state.selection);
-              if (!positionAfterTopTable) {
-                return false;
+          if (fg('platform_editor_use_nested_table_pm_nodes')) {
+            return editorCommandToPMCommand(insertTableWithNestingSupport({
+              isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
+              isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
+              isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
+              isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
+              isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
+              isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing
+            }, api, analyticsPayload))(state, dispatch);
+          } else {
+            var _api$contentInsertion, _api$contentInsertion2;
+            var node = createTableWithWidth({
+              isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
+              isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
+              isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
+              isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
+              isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
+              isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing
+            })(state.schema);
+            return (_api$contentInsertion = api === null || api === void 0 || (_api$contentInsertion2 = api.contentInsertion) === null || _api$contentInsertion2 === void 0 || (_api$contentInsertion2 = _api$contentInsertion2.actions) === null || _api$contentInsertion2 === void 0 ? void 0 : _api$contentInsertion2.insert({
+              state: state,
+              dispatch: dispatch,
+              node: node,
+              options: {
+                selectNodeInserted: false,
+                analyticsPayload: _objectSpread(_objectSpread({}, analyticsPayload), {}, {
+                  attributes: _objectSpread(_objectSpread({}, analyticsPayload.attributes), {}, {
+                    localId: node.attrs.localId
+                  })
+                })
               }
-              insertAt = TextSelection.create(state.doc, positionAfterTopTable);
-            }
+            })) !== null && _api$contentInsertion !== void 0 ? _api$contentInsertion : false;
           }
-          return (_api$contentInsertion = api === null || api === void 0 || (_api$contentInsertion2 = api.contentInsertion) === null || _api$contentInsertion2 === void 0 || (_api$contentInsertion2 = _api$contentInsertion2.actions) === null || _api$contentInsertion2 === void 0 ? void 0 : _api$contentInsertion2.insert({
-            state: state,
-            dispatch: dispatch,
-            node: node,
-            options: {
-              selectNodeInserted: false,
-              analyticsPayload: _objectSpread(_objectSpread({}, analyticsPayload), {}, {
-                attributes: _objectSpread(_objectSpread({}, analyticsPayload.attributes), {}, {
-                  localId: node.attrs.localId
-                })
-              }),
-              insertAt: insertAt
-            }
-          })) !== null && _api$contentInsertion !== void 0 ? _api$contentInsertion : false;
         };
       }
     },
     commands: {
-      insertTableWithSize: insertTableWithSize(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, options === null || options === void 0 ? void 0 : options.isCommentEditor)
+      insertTableWithSize: fg('platform_editor_use_nested_table_pm_nodes') ? function (rowsCount, colsCount, inputMethod) {
+        return insertTableWithNestingSupport({
+          isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
+          isTableAlignmentEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment,
+          isFullWidthModeEnabled: options === null || options === void 0 ? void 0 : options.fullWidthEnabled,
+          isCommentEditor: options === null || options === void 0 ? void 0 : options.isCommentEditor,
+          isChromelessEditor: options === null || options === void 0 ? void 0 : options.isChromelessEditor,
+          isTableResizingEnabled: options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing,
+          createTableProps: {
+            rowsCount: rowsCount,
+            colsCount: colsCount
+          }
+        }, api, {
+          action: ACTION.INSERTED,
+          actionSubject: ACTION_SUBJECT.DOCUMENT,
+          actionSubjectId: ACTION_SUBJECT_ID.TABLE,
+          attributes: {
+            inputMethod: inputMethod !== null && inputMethod !== void 0 ? inputMethod : INPUT_METHOD.PICKER,
+            totalRowCount: rowsCount,
+            totalColumnCount: colsCount
+          },
+          eventType: EVENT_TYPE.TRACK
+        });
+      } : insertTableWithSize(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, options === null || options === void 0 ? void 0 : options.tableOptions.allowTableAlignment, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, options === null || options === void 0 ? void 0 : options.isCommentEditor)
     },
     nodes: function nodes() {
       var _pluginConfig = pluginConfig(options === null || options === void 0 ? void 0 : options.tableOptions),
         allowColumnResizing = _pluginConfig.allowColumnResizing;
+      // TODO: ED-25901 - We need to move this into a plugin config option so we don't accidentally enable nested nodes in Jira
       var isNestingSupported = fg('platform_editor_use_nested_table_pm_nodes');
       return isNestingSupported ? [{
         name: 'table',

package/dist/esm/pm-plugins/drag-and-drop/utils/autoscrollers.js

@@ -26,17 +26,17 @@ export var autoScrollerFactory = function autoScrollerFactory(_ref) {
     },
     getOverflow: function getOverflow() {
       return {
-        fromTopEdge: {
+        forTopEdge: {
           top: dropTargetExtendedWidth,
           right: dropTargetExtendedWidth,
           left: dropTargetExtendedWidth
         },
-        fromRightEdge: {
+        forRightEdge: {
           right: dropTargetExtendedWidth,
           top: dropTargetExtendedWidth,
           bottom: dropTargetExtendedWidth
         },
-        fromLeftEdge: {
+        forLeftEdge: {
           top: dropTargetExtendedWidth,
           left: dropTargetExtendedWidth,
           bottom: dropTargetExtendedWidth

package/dist/esm/pm-plugins/keymap.js

@@ -1,11 +1,13 @@
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { addColumnAfter, addColumnAfterVO, addColumnBefore, addColumnBeforeVO, addRowAfter, addRowAfterVO, addRowBefore, addRowBeforeVO, backspace, bindKeymapWithCommand, decreaseMediaSize, deleteColumn, deleteRow, escape, focusToContextMenuTrigger, increaseMediaSize, moveColumnLeft, moveColumnRight, moveLeft, moveRight, moveRowDown, moveRowUp, nextCell, previousCell, startColumnResizing, toggleTable } from '@atlaskit/editor-common/keymaps';
+import { editorCommandToPMCommand } from '@atlaskit/editor-common/preset';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { goToNextCell, moveCursorBackward, setFocusToCellMenu } from '../commands';
 import { addRowAroundSelection, changeColumnWidthByStepWithAnalytics, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut, deleteTableIfSelectedWithAnalytics, emptyMultipleCellsWithAnalytics } from '../commands-with-analytics';
 import { activateNextResizeArea, initiateKeyboardColumnResizing, stopKeyboardColumnResizing } from '../commands/column-resize';
-import { addColumnAfter as addColumnAfterCommand, addColumnBefore as addColumnBeforeCommand, createTable } from '../commands/insert';
+import { addColumnAfter as addColumnAfterCommand, addColumnBefore as addColumnBeforeCommand, createTable, insertTableWithNestingSupport } from '../commands/insert';
 import { moveSourceWithAnalyticsViaShortcut } from '../pm-plugins/drag-and-drop/commands-with-analytics';
 export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled) {
   var _pluginInjectionApi$a;
@@ -23,7 +25,22 @@ export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProvide
   var ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
   bindKeymapWithCommand(nextCell.common, goToNextCell(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(1), list);
   bindKeymapWithCommand(previousCell.common, goToNextCell(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(-1), list);
-  bindKeymapWithCommand(toggleTable.common, createTable(isTableScalingEnabled, isTableAlignmentEnabled, !!isFullWidthEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled), list);
+  bindKeymapWithCommand(toggleTable.common, fg('platform_editor_use_nested_table_pm_nodes') ? editorCommandToPMCommand(insertTableWithNestingSupport({
+    isTableScalingEnabled: isTableScalingEnabled,
+    isTableAlignmentEnabled: isTableAlignmentEnabled,
+    isFullWidthModeEnabled: !!isFullWidthEnabled,
+    isCommentEditor: isCommentEditor,
+    isChromelessEditor: isChromelessEditor,
+    isTableResizingEnabled: isTableResizingEnabled
+  }, api, {
+    action: ACTION.INSERTED,
+    actionSubject: ACTION_SUBJECT.DOCUMENT,
+    actionSubjectId: ACTION_SUBJECT_ID.TABLE,
+    attributes: {
+      inputMethod: INPUT_METHOD.SHORTCUT
+    },
+    eventType: EVENT_TYPE.TRACK
+  })) : createTable(isTableScalingEnabled, isTableAlignmentEnabled, !!isFullWidthEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled), list);
   bindKeymapWithCommand(backspace.common, chainCommands(deleteTableIfSelectedWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD), emptyMultipleCellsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD)), list);
   bindKeymapWithCommand(backspace.common, moveCursorBackward, list);
 

package/dist/esm/ui/FloatingDragMenu/DragMenu.js

@@ -23,6 +23,7 @@ import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { findCellRectClosestToPos, getSelectionRect, isSelectionType } from '@atlaskit/editor-tables/utils';
 import EditorBackgroundColorIcon from '@atlaskit/icon/core/migration/paint-bucket--editor-background-color';
 import PaintBucketIcon from '@atlaskit/icon/core/paint-bucket';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, xcss } from '@atlaskit/primitives';
 import Toggle from '@atlaskit/toggle';
 import { clearHoverSelection, hoverColumns, hoverRows } from '../../commands';
@@ -495,7 +496,7 @@ var DragMenu = /*#__PURE__*/React.memo(function (_ref) {
     fitHeight: fitHeight,
     fitWidth: fitWidth,
     direction: direction,
-    mountPoint: mountPoint,
+    mountPoint: fg('platform_editor_table_drag_menu_mount_point_fix') ? undefined : mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement
   });

package/dist/types/commands/insert.d.ts

@@ -1,13 +1,53 @@
-import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+import type { AnalyticsEventPayload, EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import type { Command, EditorCommand } from '@atlaskit/editor-common/types';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { PluginInjectionAPI } from '../types';
+type InsertTableWithNestingSupportCommand = (options: {
+    isTableScalingEnabled?: boolean;
+    isTableAlignmentEnabled?: boolean;
+    isFullWidthModeEnabled?: boolean;
+    isCommentEditor?: boolean;
+    isChromelessEditor?: boolean;
+    isTableResizingEnabled?: boolean;
+    createTableProps?: {
+        rowsCount?: number;
+        colsCount?: number;
+    };
+}, api: PluginInjectionAPI | undefined | null, analyticsPayload?: AnalyticsEventPayload) => EditorCommand;
 export declare function addColumnAt(api: PluginInjectionAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean): (column: number, allowAddColumnCustomStep: boolean | undefined, view: EditorView | undefined) => (tr: Transaction) => Transaction;
 export declare const addColumnBefore: (api: PluginInjectionAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean) => Command;
 export declare const addColumnAfter: (api: PluginInjectionAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean) => Command;
 export declare const insertColumn: (api: PluginInjectionAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean) => (column: number) => Command;
 export declare const insertRow: (row: number, moveCursorToTheNewRow: boolean) => Command;
+/**
+ * @private
+ * @deprecated This function is deprecated - please use insertTableWithNestingSupport instead.
+ * (To be removed with feature gate: `platform_editor_use_nested_table_pm_nodes`)
+ */
 export declare const createTable: (isTableScalingEnabled?: boolean, isTableAlignmentEnabled?: boolean, isFullWidthModeEnabled?: boolean, editorAnalyticsAPI?: EditorAnalyticsAPI | undefined | null, isCommentEditor?: boolean, isChromelessEditor?: boolean, isTableResizingEnabled?: boolean) => Command;
+/**
+ * @private
+ * @deprecated This function is deprecated - please use insertTableWithNestingSupport instead.
+ * (To be removed with feature gate: `platform_editor_use_nested_table_pm_nodes`)
+ */
 export declare const insertTableWithSize: (isFullWidthModeEnabled?: boolean, isTableScalingEnabled?: boolean, isTableAlignmentEnabled?: boolean, editorAnalyticsAPI?: EditorAnalyticsAPI, isCommentEditor?: boolean, isChromelessEditor?: boolean) => (rowsCount: number, colsCount: number, inputMethod?: INPUT_METHOD.PICKER) => EditorCommand;
+/**
+ * Unified command to insert a new table into the editor.
+ *
+ * @param {Object} options - Configuration options for table insertion.
+ * @param {boolean} [options.isTableScalingEnabled=false] - Flag to enable table scaling.
+ * @param {boolean} [options.isTableAlignmentEnabled=false] - Flag to enable table alignment.
+ * @param {boolean} [options.isFullWidthModeEnabled=false] - Flag to enable full-width mode for the table.
+ * @param {boolean} [options.isCommentEditor=false] - Flag to indicate if the editor is in comment mode.
+ * @param {boolean} [options.isChromelessEditor=false] - Flag to indicate if the editor is chromeless.
+ * @param {boolean} [options.isTableResizingEnabled=false] - Flag to enable table resizing.
+ * @param {Object} [options.createTableProps={}] - Additional properties for table creation, including table size.
+ * @param {Object} api - PluginInjectinoApi object for content insertion commands.
+ * @param {Object} analyticsPayload - Payload for analytics tracking.
+ *
+ * @returns {Function} A function that takes a transaction and inserts a table.
+ */
+export declare const insertTableWithNestingSupport: InsertTableWithNestingSupportCommand;
+export {};

package/dist/types/ui/TableFloatingColumnControls/ColumnControls/index.d.ts

@@ -43,7 +43,6 @@ export declare const ColumnControls: ({ editorView, tableActive, tableRef, hover
             }, import("@atlaskit/editor-common/types").FeatureFlags>>];
             actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
         }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"contentInsertion", {
-            actions: import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI;
             dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
                 pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
                 sharedState: {
@@ -57,7 +56,7 @@ export declare const ColumnControls: ({ editorView, tableActive, tableRef, hover
                 }, import("@atlaskit/editor-common/types").FeatureFlags>>];
                 actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
             }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>];
-        }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
+        } & import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
             sharedState: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
         }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"guideline", {
             dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {

package/dist/types/ui/TableFloatingControls/CornerControls/DragCornerControls.d.ts

@@ -24,7 +24,6 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
             }, import("@atlaskit/editor-common/types").FeatureFlags>>];
             actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
         }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"contentInsertion", {
-            actions: import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI;
             dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
                 pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
                 sharedState: {
@@ -38,7 +37,7 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                 }, import("@atlaskit/editor-common/types").FeatureFlags>>];
                 actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
             }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>];
-        }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
+        } & import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
             sharedState: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
         }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"guideline", {
             dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
@@ -111,7 +110,6 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                 }, import("@atlaskit/editor-common/types").FeatureFlags>>];
                 actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
             }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"contentInsertion", {
-                actions: import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI;
                 dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
                     pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
                     sharedState: {
@@ -125,7 +123,7 @@ export declare const DragCornerControlsWithSelection: React.FC<import("react-int
                     }, import("@atlaskit/editor-common/types").FeatureFlags>>];
                     actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
                 }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>];
-            }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
+            } & import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
                 sharedState: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
             }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"guideline", {
                 dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {

package/dist/types/ui/TableFloatingControls/index.d.ts

@@ -53,7 +53,6 @@ export declare const TableFloatingControls: ({ editorView, tableRef, tableNode,
             }, import("@atlaskit/editor-common/types").FeatureFlags>>];
             actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
         }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"contentInsertion", {
-            actions: import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI;
             dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
                 pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
                 sharedState: {
@@ -67,7 +66,7 @@ export declare const TableFloatingControls: ({ editorView, tableRef, tableNode,
                 }, import("@atlaskit/editor-common/types").FeatureFlags>>];
                 actions: import("@atlaskit/editor-common/analytics").EditorAnalyticsAPI;
             }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>];
-        }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
+        } & import("@atlaskit/editor-plugin-content-insertion").InsertNodeAPI, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {
             sharedState: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
         }, undefined>, import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"guideline", {
             dependencies: [import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"width", {

package/dist/types/utils/drag-menu.d.ts

@@ -5,15 +5,15 @@ import type { AriaLiveElementAttributes } from '@atlaskit/editor-plugin-accessib
 import type { Selection } from '@atlaskit/editor-prosemirror/state';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { Rect, TableMap } from '@atlaskit/editor-tables/table-map';
-import type { UNSAFE_NewIconProps } from '@atlaskit/icon/types';
+import type { NewIconProps } from '@atlaskit/icon/types';
 import type { DraggableData, DraggableType, PluginInjectionAPI, TableDirection } from '../types';
 export declare const getTargetIndex: (selectedIndexes: number[], direction: DraggableData['direction']) => number;
 export declare const canMove: (sourceType: DraggableType, direction: DraggableData['direction'], totalItemsOfSourceTypeCount: number, selection: Selection, selectionRect?: Rect) => boolean;
 export type DragMenuOptionIdType = 'add_row_above' | 'add_row_below' | 'add_column_left' | 'add_column_right' | 'distribute_columns' | 'clear_cells' | 'delete_row' | 'delete_column' | 'move_column_left' | 'move_column_right' | 'move_row_up' | 'move_row_down' | 'sort_column_asc' | 'sort_column_desc';
 export interface DragMenuConfig extends Omit<DropdownOptionT<Command>, 'icon'> {
     id: DragMenuOptionIdType;
-    icon?: React.ComponentType<React.PropsWithChildren<UNSAFE_NewIconProps>>;
-    iconFallback?: React.ComponentType<React.PropsWithChildren<UNSAFE_NewIconProps>>;
+    icon?: React.ComponentType<React.PropsWithChildren<NewIconProps>>;
+    iconFallback?: React.ComponentType<React.PropsWithChildren<NewIconProps>>;
     keymap?: string;
 }
 export declare const getDragMenuConfig: (direction: TableDirection, getEditorContainerWidth: GetEditorContainerWidth, hasMergedCellsInTable: boolean, editorView: EditorView, api: PluginInjectionAPI | undefined | null, tableMap?: TableMap, index?: number, targetCellPosition?: number, selectionRect?: Rect, editorAnalyticsAPI?: EditorAnalyticsAPI, isHeaderRowRequired?: boolean, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, ariaNotifyPlugin?: ((message: string, ariaLiveElementAttributes?: AriaLiveElementAttributes) => void) | undefined, isCommentEditor?: boolean) => DragMenuConfig[];