@atlaskit/editor-plugin-table 8.2.2 → 8.3.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/editor-plugin-table
 
+## 8.3.0
+
+### Minor Changes
+
+- [#170735](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/170735)
+  [`147418939b2eb`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/147418939b2eb) -
+  [ux] ED-25880 Use consistent table insertion logic for primary toolbar button, primary toolbar
+  size selector dropdown and table insert keyboard shortcut which handles node nesting support
+
+### Patch Changes
+
+- [#170839](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/170839)
+  [`90284312a1050`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/90284312a1050) -
+  Internal change to account for a dependency change.
+- [#171994](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/171994)
+  [`be58e4bb2e387`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/be58e4bb2e387) -
+  Migrating usages of UNSAFE types and entrypoints that have been renamed in `@atlaskit/icon` and
+  `@atlaskit/icon-lab`.
+- Updated dependencies
+
 ## 8.2.2
 
 ### Patch Changes

package/dist/cjs/commands/insert.js

@@ -1,24 +1,29 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.addColumnAfter = void 0;
 exports.addColumnAt = addColumnAt;
-exports.insertTableWithSize = exports.insertRow = exports.insertColumn = exports.createTable = exports.addColumnBefore = void 0;
+exports.insertTableWithSize = exports.insertTableWithNestingSupport = exports.insertRow = exports.insertColumn = exports.createTable = exports.addColumnBefore = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _customSteps = require("@atlaskit/custom-steps");
 var _analytics = require("@atlaskit/editor-common/analytics");
+var _nesting = require("@atlaskit/editor-common/nesting");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _tableMap = require("@atlaskit/editor-tables/table-map");
 var _utils2 = require("@atlaskit/editor-tables/utils");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _commands = require("../pm-plugins/analytics/commands");
 var _tableAnalytics = require("../pm-plugins/table-analytics");
 var _columnWidth = require("../transforms/column-width");
 var _utils3 = require("../utils");
 var _getAllowAddColumnCustomStep = require("../utils/get-allow-add-column-custom-step");
-// #region Imports
-
+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) { (0, _defineProperty2.default)(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
 function addColumnAtCustomStep(column) {
   return function (tr) {
     var table = (0, _utils2.findTable)(tr.selection);
@@ -150,6 +155,12 @@ var insertRow = exports.insertRow = function insertRow(row, moveCursorToTheNewRo
     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`)
+ */
 var createTable = exports.createTable = function createTable(isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled) {
   return function (state, dispatch) {
     var table = (0, _utils3.createTableWithWidth)({
@@ -178,6 +189,12 @@ var createTable = exports.createTable = function createTable(isTableScalingEnabl
     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`)
+ */
 var insertTableWithSize = exports.insertTableWithSize = function insertTableWithSize(isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor) {
   return function (rowsCount, colsCount, inputMethod) {
     return function (_ref) {
@@ -210,4 +227,81 @@ var insertTableWithSize = exports.insertTableWithSize = function insertTableWith
       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.
+ */
+var insertTableWithNestingSupport = exports.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 = (0, _utils3.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 ((0, _utils.hasParentNodeOfType)(schema.nodes.table)(tr.selection) && (0, _platformFeatureFlags.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 ((0, _experiments.editorExperiment)('nested-tables-in-tables', false, {
+        exposure: true
+      }) || (0, _nesting.getParentOfTypeCount)(schema.nodes.table)(tr.selection) > 1) {
+        var positionAfterTopTable = (0, _nesting.getPositionAfterTopParentNodeOfType)(schema.nodes.table)(tr.selection);
+        if (!positionAfterTopTable) {
+          return tr;
+        }
+        insertAt = _state.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/cjs/plugin.js

@@ -15,9 +15,9 @@ var _icons = require("@atlaskit/editor-common/icons");
 var _keymaps = require("@atlaskit/editor-common/keymaps");
 var _messages = require("@atlaskit/editor-common/messages");
 var _nesting = require("@atlaskit/editor-common/nesting");
+var _preset = require("@atlaskit/editor-common/preset");
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _withPluginState = require("@atlaskit/editor-common/with-plugin-state");
-var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _pmPlugins = require("@atlaskit/editor-tables/pm-plugins");
@@ -116,53 +116,72 @@ var tablesPlugin = function tablesPlugin(_ref) {
     actions: {
       insertTable: function insertTable(analyticsPayload) {
         return function (state, dispatch) {
-          var _api$contentInsertion, _api$contentInsertion2;
-          var node = (0, _utils2.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 ((0, _utils.hasParentNodeOfType)(state.schema.nodes.table)(state.selection) && (0, _platformFeatureFlags.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 ((0, _experiments.editorExperiment)('nested-tables-in-tables', false, {
-              exposure: true
-            }) || (0, _nesting.getParentOfTypeCount)(state.schema.nodes.table)(state.selection) > 1) {
-              var positionAfterTopTable = (0, _nesting.getPositionAfterTopParentNodeOfType)(state.schema.nodes.table)(state.selection);
-              if (!positionAfterTopTable) {
-                return false;
+          if ((0, _platformFeatureFlags.fg)('platform_editor_use_nested_table_pm_nodes')) {
+            return (0, _preset.editorCommandToPMCommand)((0, _insert.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 = (0, _utils2.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 = _state.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: (0, _insert.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: (0, _platformFeatureFlags.fg)('platform_editor_use_nested_table_pm_nodes') ? function (rowsCount, colsCount, inputMethod) {
+        return (0, _insert.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: _analytics.ACTION.INSERTED,
+          actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,
+          actionSubjectId: _analytics.ACTION_SUBJECT_ID.TABLE,
+          attributes: {
+            inputMethod: inputMethod !== null && inputMethod !== void 0 ? inputMethod : _analytics.INPUT_METHOD.PICKER,
+            totalRowCount: rowsCount,
+            totalColumnCount: colsCount
+          },
+          eventType: _analytics.EVENT_TYPE.TRACK
+        });
+      } : (0, _insert.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 = (0, _createPluginConfig.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 = (0, _platformFeatureFlags.fg)('platform_editor_use_nested_table_pm_nodes');
       return isNestingSupported ? [{
         name: 'table',

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

@@ -32,17 +32,17 @@ var autoScrollerFactory = exports.autoScrollerFactory = function autoScrollerFac
     },
     getOverflow: function getOverflow() {
       return {
-        fromTopEdge: {
+        forTopEdge: {
           top: _consts.dropTargetExtendedWidth,
           right: _consts.dropTargetExtendedWidth,
           left: _consts.dropTargetExtendedWidth
         },
-        fromRightEdge: {
+        forRightEdge: {
           right: _consts.dropTargetExtendedWidth,
           top: _consts.dropTargetExtendedWidth,
           bottom: _consts.dropTargetExtendedWidth
         },
-        fromLeftEdge: {
+        forLeftEdge: {
           top: _consts.dropTargetExtendedWidth,
           left: _consts.dropTargetExtendedWidth,
           bottom: _consts.dropTargetExtendedWidth

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

@@ -7,8 +7,10 @@ exports.default = void 0;
 exports.keymapPlugin = keymapPlugin;
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _keymaps = require("@atlaskit/editor-common/keymaps");
+var _preset = require("@atlaskit/editor-common/preset");
 var _commands = require("@atlaskit/editor-prosemirror/commands");
 var _keymap = require("@atlaskit/editor-prosemirror/keymap");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _commands2 = require("../commands");
 var _commandsWithAnalytics = require("../commands-with-analytics");
 var _columnResize = require("../commands/column-resize");
@@ -30,7 +32,22 @@ function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, e
   var ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.nextCell.common, (0, _commands2.goToNextCell)(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(1), list);
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.previousCell.common, (0, _commands2.goToNextCell)(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(-1), list);
-  (0, _keymaps.bindKeymapWithCommand)(_keymaps.toggleTable.common, (0, _insert.createTable)(isTableScalingEnabled, isTableAlignmentEnabled, !!isFullWidthEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled), list);
+  (0, _keymaps.bindKeymapWithCommand)(_keymaps.toggleTable.common, (0, _platformFeatureFlags.fg)('platform_editor_use_nested_table_pm_nodes') ? (0, _preset.editorCommandToPMCommand)((0, _insert.insertTableWithNestingSupport)({
+    isTableScalingEnabled: isTableScalingEnabled,
+    isTableAlignmentEnabled: isTableAlignmentEnabled,
+    isFullWidthModeEnabled: !!isFullWidthEnabled,
+    isCommentEditor: isCommentEditor,
+    isChromelessEditor: isChromelessEditor,
+    isTableResizingEnabled: isTableResizingEnabled
+  }, api, {
+    action: _analytics.ACTION.INSERTED,
+    actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,
+    actionSubjectId: _analytics.ACTION_SUBJECT_ID.TABLE,
+    attributes: {
+      inputMethod: _analytics.INPUT_METHOD.SHORTCUT
+    },
+    eventType: _analytics.EVENT_TYPE.TRACK
+  })) : (0, _insert.createTable)(isTableScalingEnabled, isTableAlignmentEnabled, !!isFullWidthEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled), list);
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.backspace.common, (0, _commands.chainCommands)((0, _commandsWithAnalytics.deleteTableIfSelectedWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.KEYBOARD), (0, _commandsWithAnalytics.emptyMultipleCellsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.KEYBOARD)), list);
   (0, _keymaps.bindKeymapWithCommand)(_keymaps.backspace.common, _commands2.moveCursorBackward, list);
 

package/dist/es2019/commands/insert.js

@@ -1,10 +1,13 @@
 // #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';
@@ -119,6 +122,12 @@ export const insertRow = (row, moveCursorToTheNewRow) => (state, dispatch) => {
   }
   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 const createTable = (isTableScalingEnabled, isTableAlignmentEnabled, isFullWidthModeEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor, isTableResizingEnabled) => (state, dispatch) => {
   const table = createTableWithWidth({
     isTableScalingEnabled,
@@ -145,6 +154,12 @@ export const createTable = (isTableScalingEnabled, isTableAlignmentEnabled, isFu
   }
   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 const insertTableWithSize = (isFullWidthModeEnabled, isTableScalingEnabled, isTableAlignmentEnabled, editorAnalyticsAPI, isCommentEditor, isChromelessEditor) => (rowsCount, colsCount, inputMethod) => {
   return ({
     tr
@@ -176,4 +191,78 @@ export const insertTableWithSize = (isFullWidthModeEnabled, isTableScalingEnable
     }
     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 const insertTableWithNestingSupport = ({
+  isTableScalingEnabled = false,
+  isTableAlignmentEnabled = false,
+  isFullWidthModeEnabled = false,
+  isCommentEditor = false,
+  isChromelessEditor = false,
+  isTableResizingEnabled = false,
+  createTableProps = {}
+}, api, analyticsPayload) => ({
+  tr
+}) => {
+  var _api$contentInsertion, _api$contentInsertion2;
+  const {
+    schema
+  } = tr.doc.type;
+  const node = createTableWithWidth({
+    isTableScalingEnabled,
+    isTableAlignmentEnabled,
+    isFullWidthModeEnabled,
+    isCommentEditor,
+    isChromelessEditor,
+    isTableResizingEnabled,
+    createTableProps
+  })(schema);
+
+  // If the cursor is inside a table
+  let 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) {
+      const positionAfterTopTable = getPositionAfterTopParentNodeOfType(schema.nodes.table)(tr.selection);
+      if (!positionAfterTopTable) {
+        return tr;
+      }
+      insertAt = TextSelection.create(tr.doc, positionAfterTopTable);
+    }
+  }
+  api === null || api === void 0 ? void 0 : (_api$contentInsertion = api.contentInsertion) === null || _api$contentInsertion === void 0 ? void 0 : (_api$contentInsertion2 = _api$contentInsertion.commands) === null || _api$contentInsertion2 === void 0 ? void 0 : _api$contentInsertion2.insert({
+    node,
+    options: {
+      selectNodeInserted: false,
+      analyticsPayload: analyticsPayload ? {
+        ...analyticsPayload,
+        attributes: {
+          ...analyticsPayload.attributes,
+          localId: node.attrs.localId
+        }
+      } : undefined,
+      insertAt
+    }
+  })({
+    tr
+  });
+  return tr;
 };

package/dist/es2019/plugin.js

@@ -7,15 +7,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';
@@ -104,55 +104,72 @@ const tablesPlugin = ({
     },
     actions: {
       insertTable: analyticsPayload => (state, dispatch) => {
-        var _api$contentInsertion, _api$contentInsertion2, _api$contentInsertion3;
-        const 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
-        let 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) {
-            const 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, _api$contentInsertion3;
+          const 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 ? void 0 : (_api$contentInsertion2 = api.contentInsertion) === null || _api$contentInsertion2 === void 0 ? void 0 : (_api$contentInsertion3 = _api$contentInsertion2.actions) === null || _api$contentInsertion3 === void 0 ? void 0 : _api$contentInsertion3.insert({
+            state,
+            dispatch,
+            node,
+            options: {
+              selectNodeInserted: false,
+              analyticsPayload: {
+                ...analyticsPayload,
+                attributes: {
+                  ...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 ? void 0 : (_api$contentInsertion2 = api.contentInsertion) === null || _api$contentInsertion2 === void 0 ? void 0 : (_api$contentInsertion3 = _api$contentInsertion2.actions) === null || _api$contentInsertion3 === void 0 ? void 0 : _api$contentInsertion3.insert({
-          state,
-          dispatch,
-          node,
-          options: {
-            selectNodeInserted: false,
-            analyticsPayload: {
-              ...analyticsPayload,
-              attributes: {
-                ...analyticsPayload.attributes,
-                localId: node.attrs.localId
-              }
-            },
-            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 ? 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') ? (rowsCount, colsCount, inputMethod) => 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,
+          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 ? 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() {
       const {
         allowColumnResizing
       } = pluginConfig(options === null || options === void 0 ? void 0 : options.tableOptions);
+      // TODO: ED-25901 - We need to move this into a plugin config option so we don't accidentally enable nested nodes in Jira
       const isNestingSupported = fg('platform_editor_use_nested_table_pm_nodes');
       return isNestingSupported ? [{
         name: 'table',

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