@atlaskit/editor-plugin-table 24.3.14 → 24.4.0

package/dist/es2019/ui/TableMenu/shared/getSharedItems.js

@@ -1,13 +1,139 @@
 import React from 'react';
-import { CELL_ACTION_SECTION, CELL_DANGER_SECTION, CELL_ACTION_SECTION_RANK, CELL_DANGER_SECTION_RANK } from '../cell/keys';
-import { COLUMN_BACKGROUND_SECTION, COLUMN_DANGER_SECTION, COLUMN_BACKGROUND_SECTION_RANK, COLUMN_DANGER_SECTION_RANK } from '../column/keys';
-import { ROW_BACKGROUND_SECTION, ROW_DANGER_SECTION, ROW_BACKGROUND_SECTION_RANK, ROW_DANGER_SECTION_RANK } from '../row/keys';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { CELL_ACTION_SECTION, CELL_ADD_SECTION, CELL_DANGER_SECTION, CELL_ACTION_SECTION_RANK, CELL_ADD_SECTION_RANK, CELL_DANGER_SECTION_RANK } from '../cell/keys';
+import { AddColumnRightItem } from '../column/items/AddColumnRightItem';
+import { DeleteColumnItem } from '../column/items/DeleteColumnItem';
+import { DistributeColumnsItem } from '../column/items/DistributeColumnsItem';
+import { ADD_COLUMN_RIGHT_ITEM, COLUMN_ADD_SECTION, COLUMN_BACKGROUND_SECTION, COLUMN_DANGER_SECTION, COLUMN_ADD_SECTION_RANK, COLUMN_BACKGROUND_SECTION_RANK, COLUMN_DANGER_SECTION_RANK, DELETE_COLUMN_ITEM, DISTRIBUTE_COLUMNS_ITEM } from '../column/keys';
+import { AddRowBelowItem } from '../row/items/AddRowBelowItem';
+import { DeleteRowItem } from '../row/items/DeleteRowItem';
+import { ADD_ROW_BELOW_ITEM, DELETE_ROW_ITEM, ROW_ADD_SECTION, ROW_BACKGROUND_SECTION, ROW_DANGER_SECTION, ROW_ADD_SECTION_RANK, ROW_BACKGROUND_SECTION_RANK, ROW_DANGER_SECTION_RANK } from '../row/keys';
 import { BackgroundColorItem } from './items/BackgroundColorItem';
 import { ClearCellsItem } from './items/ClearCellsItem';
 import { BACKGROUND_COLOR_ITEM, CLEAR_CELLS_ITEM } from './keys';
 export const getSharedItems = ({
   api
-}) => [{
+}) => fg('platform_editor_table_cell_menu_update') ? [
+// --- Cell menu update ON ---
+// The add/delete items move out of the row/column menu files and are registered here
+// once with an additional cell parent, so they render inside the cell menu too.
+{
+  type: BACKGROUND_COLOR_ITEM.type,
+  key: BACKGROUND_COLOR_ITEM.key,
+  parents: [{
+    type: ROW_BACKGROUND_SECTION.type,
+    key: ROW_BACKGROUND_SECTION.key,
+    rank: ROW_BACKGROUND_SECTION_RANK[BACKGROUND_COLOR_ITEM.key]
+  }, {
+    type: COLUMN_BACKGROUND_SECTION.type,
+    key: COLUMN_BACKGROUND_SECTION.key,
+    rank: COLUMN_BACKGROUND_SECTION_RANK[BACKGROUND_COLOR_ITEM.key]
+  }, {
+    type: CELL_ACTION_SECTION.type,
+    key: CELL_ACTION_SECTION.key,
+    rank: CELL_ACTION_SECTION_RANK[BACKGROUND_COLOR_ITEM.key]
+  }],
+  component: () => /*#__PURE__*/React.createElement(BackgroundColorItem, {
+    api: api
+  })
+}, {
+  type: ADD_COLUMN_RIGHT_ITEM.type,
+  key: ADD_COLUMN_RIGHT_ITEM.key,
+  parents: [{
+    type: COLUMN_ADD_SECTION.type,
+    key: COLUMN_ADD_SECTION.key,
+    rank: COLUMN_ADD_SECTION_RANK[ADD_COLUMN_RIGHT_ITEM.key]
+  }, {
+    type: CELL_ADD_SECTION.type,
+    key: CELL_ADD_SECTION.key,
+    rank: CELL_ADD_SECTION_RANK[ADD_COLUMN_RIGHT_ITEM.key]
+  }],
+  component: () => /*#__PURE__*/React.createElement(AddColumnRightItem, {
+    api: api
+  })
+}, {
+  type: ADD_ROW_BELOW_ITEM.type,
+  key: ADD_ROW_BELOW_ITEM.key,
+  parents: [{
+    type: ROW_ADD_SECTION.type,
+    key: ROW_ADD_SECTION.key,
+    rank: ROW_ADD_SECTION_RANK[ADD_ROW_BELOW_ITEM.key]
+  }, {
+    type: CELL_ADD_SECTION.type,
+    key: CELL_ADD_SECTION.key,
+    rank: CELL_ADD_SECTION_RANK[ADD_ROW_BELOW_ITEM.key]
+  }],
+  component: () => /*#__PURE__*/React.createElement(AddRowBelowItem, {
+    api: api
+  })
+}, {
+  type: DISTRIBUTE_COLUMNS_ITEM.type,
+  key: DISTRIBUTE_COLUMNS_ITEM.key,
+  parents: [{
+    type: COLUMN_ADD_SECTION.type,
+    key: COLUMN_ADD_SECTION.key,
+    rank: COLUMN_ADD_SECTION_RANK[DISTRIBUTE_COLUMNS_ITEM.key]
+  }, {
+    type: CELL_ADD_SECTION.type,
+    key: CELL_ADD_SECTION.key,
+    rank: CELL_ADD_SECTION_RANK[DISTRIBUTE_COLUMNS_ITEM.key]
+  }],
+  component: () => /*#__PURE__*/React.createElement(DistributeColumnsItem, {
+    api: api
+  })
+}, {
+  type: CLEAR_CELLS_ITEM.type,
+  key: CLEAR_CELLS_ITEM.key,
+  parents: [{
+    type: ROW_DANGER_SECTION.type,
+    key: ROW_DANGER_SECTION.key,
+    rank: ROW_DANGER_SECTION_RANK[CLEAR_CELLS_ITEM.key]
+  }, {
+    type: COLUMN_DANGER_SECTION.type,
+    key: COLUMN_DANGER_SECTION.key,
+    rank: COLUMN_DANGER_SECTION_RANK[CLEAR_CELLS_ITEM.key]
+  }, {
+    type: CELL_DANGER_SECTION.type,
+    key: CELL_DANGER_SECTION.key,
+    rank: CELL_DANGER_SECTION_RANK[CLEAR_CELLS_ITEM.key]
+  }],
+  component: () => /*#__PURE__*/React.createElement(ClearCellsItem, {
+    api: api
+  })
+}, {
+  type: DELETE_COLUMN_ITEM.type,
+  key: DELETE_COLUMN_ITEM.key,
+  parents: [{
+    type: COLUMN_DANGER_SECTION.type,
+    key: COLUMN_DANGER_SECTION.key,
+    rank: COLUMN_DANGER_SECTION_RANK[DELETE_COLUMN_ITEM.key]
+  }, {
+    type: CELL_DANGER_SECTION.type,
+    key: CELL_DANGER_SECTION.key,
+    rank: CELL_DANGER_SECTION_RANK[DELETE_COLUMN_ITEM.key]
+  }],
+  component: () => /*#__PURE__*/React.createElement(DeleteColumnItem, {
+    api: api
+  })
+}, {
+  type: DELETE_ROW_ITEM.type,
+  key: DELETE_ROW_ITEM.key,
+  parents: [{
+    type: ROW_DANGER_SECTION.type,
+    key: ROW_DANGER_SECTION.key,
+    rank: ROW_DANGER_SECTION_RANK[DELETE_ROW_ITEM.key]
+  }, {
+    type: CELL_DANGER_SECTION.type,
+    key: CELL_DANGER_SECTION.key,
+    rank: CELL_DANGER_SECTION_RANK[DELETE_ROW_ITEM.key]
+  }],
+  component: () => /*#__PURE__*/React.createElement(DeleteRowItem, {
+    api: api
+  })
+}] : [
+// --- Cell menu update OFF: legacy shared items (background color + clear cells only).
+// The add/delete items are registered by the row/column menu files in this mode.
+{
   type: BACKGROUND_COLOR_ITEM.type,
   key: BACKGROUND_COLOR_ITEM.key,
   parents: [{

package/dist/es2019/ui/TableMenu/shared/selection.js

@@ -0,0 +1,14 @@
+import { findCellRectClosestToPos, getSelectionRect, isSelectionType } from '@atlaskit/editor-tables/utils';
+import { fg } from '@atlaskit/platform-feature-flags';
+
+/**
+ * Resolve the table `Rect` for the current selection. Falls back to the closest cell's rect
+ * for a `TextSelection` (cell menu), where `getSelectionRect` returns `undefined`. Gated:
+ * with the gate off this behaves exactly like `getSelectionRect`.
+ */
+export const getMenuSelectionRect = selection => {
+  if (!fg('platform_editor_table_cell_menu_update')) {
+    return getSelectionRect(selection);
+  }
+  return isSelectionType(selection, 'cell') ? getSelectionRect(selection) : findCellRectClosestToPos(selection.$from);
+};

package/dist/esm/nodeviews/TableSSRReactContextsProvider.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { RawIntlProvider } from 'react-intl';
+import { isSSR, isSSRStreaming } from '@atlaskit/editor-common/core-utils';
+export function TableSSRReactContextsProvider(_ref) {
+  var children = _ref.children,
+    intl = _ref.intl;
+  if (!isSSR() || !isSSRStreaming()) {
+    return children;
+  }
+  if (!intl) {
+    return children;
+  }
+  return /*#__PURE__*/React.createElement(RawIntlProvider, {
+    value: intl
+  }, children);
+}

package/dist/esm/nodeviews/table-node-views.js

@@ -7,7 +7,7 @@ import TableRow from './TableRow';
 import TableRowNativeStickyWithFallback from './TableRowNativeStickyWithFallback';
 export var tableView = function tableView(options) {
   return function (node, view, getPos) {
-    return createTableView(node, view, getPos, options.portalProviderAPI, options.eventDispatcher, options.getEditorContainerWidth, options.getEditorFeatureFlags, options.dispatchAnalyticsEvent, options.pluginInjectionApi, options.isCommentEditor, options.isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
+    return createTableView(node, view, getPos, options.portalProviderAPI, options.eventDispatcher, options.getEditorContainerWidth, options.getEditorFeatureFlags, options.dispatchAnalyticsEvent, options.pluginInjectionApi, options.isCommentEditor, options.isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption, options.intl);
   };
 };
 export var tableCellView = function tableCellView(options) {

package/dist/esm/nodeviews/table.js

@@ -10,7 +10,7 @@ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstruct
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _superPropGet(t, o, e, r) { var p = _get(_getPrototypeOf(1 & r ? t.prototype : t), o, e); return 2 & r && "function" == typeof p ? function (t) { return p.apply(e, t); } : p; }
 import React from 'react';
-import { isSSR, isSSRStreaming } from '@atlaskit/editor-common/core-utils';
+import { isSSRStreaming } from '@atlaskit/editor-common/core-utils';
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { isTableInContentMode } from '@atlaskit/editor-common/table';
@@ -27,6 +27,7 @@ import { isTableNested, tablesHaveDifferentColumnWidths } from '../pm-plugins/ut
 import { isContentModeSupported } from '../pm-plugins/utils/tableMode/is-content-mode-supported';
 import { RoundedTableEdges } from './rounded-table-edges';
 import { TableComponentWithSharedState } from './TableComponentWithSharedState';
+import { TableSSRReactContextsProvider } from './TableSSRReactContextsProvider';
 import { tableNodeSpecWithFixedToDOM } from './toDOM';
 var tableAttributes = function tableAttributes(node) {
   return {
@@ -74,6 +75,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
     _this.eventDispatcher = props.eventDispatcher;
     _this.options = props.options;
     _this.getEditorFeatureFlags = props.getEditorFeatureFlags;
+    _this.intl = props.intl;
     if (expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true)) {
       _this.roundedTableEdges = new RoundedTableEdges(function () {
         return _this.table;
@@ -161,7 +163,11 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
         }
 
         // Remove the ProseMirror table DOM structure to avoid duplication, as it's replaced with the React table node.
-        if (this.dom && this.renderedDOM) {
+        // In SSR streaming the portal renders via `container.innerHTML = html` (portal/common.tsx), which detaches
+        // `renderedDOM` from `dom` before this runs; require it to still be a child so `removeChild` doesn't throw
+        // `NotFoundError` (which would make EditorSSRRenderer fall back to the position-blind schema toDOM and lose
+        // nested detection). CSR keeps the original condition unchanged.
+        if (this.dom && this.renderedDOM && (!isSSRStreaming() || this.renderedDOM.parentNode === this.dom)) {
           this.dom.removeChild(this.renderedDOM);
         }
         // Move the table from the ProseMirror table structure into the React rendered table node.
@@ -265,7 +271,9 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
   }, {
     key: "render",
     value: function render(props, forwardRef) {
-      return /*#__PURE__*/React.createElement(TableComponentWithSharedState, {
+      return /*#__PURE__*/React.createElement(TableSSRReactContextsProvider, {
+        intl: this.intl
+      }, /*#__PURE__*/React.createElement(TableComponentWithSharedState, {
         forwardRef: forwardRef,
         getNode: this.getNode,
         view: props.view,
@@ -280,7 +288,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
         getEditorFeatureFlags: props.getEditorFeatureFlags,
         dispatchAnalyticsEvent: props.dispatchAnalyticsEvent,
         allowFixedColumnWidthOption: props.allowFixedColumnWidthOption
-      });
+      }));
     }
   }, {
     key: "viewShouldUpdate",
@@ -352,7 +360,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
   }]);
 }(ReactNodeView);
 export { TableView as default };
-export var createTableView = function createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) {
+export var createTableView = function createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption, intl) {
   var _pluginInjectionApi$t;
   var _getPluginState2 = getPluginState(view.state),
     pluginConfig = _getPluginState2.pluginConfig,
@@ -367,22 +375,6 @@ export var createTableView = function createTableView(node, view, getPos, portal
     allowTableAlignment = _getPluginConfig.allowTableAlignment;
   var isTableFixedColumnWidthsOptionEnabled = (fg('platform_editor_table_fixed_column_width_prop') ? allowFixedColumnWidthOption : getEditorFeatureFlags === null || getEditorFeatureFlags === void 0 ? void 0 : getEditorFeatureFlags().tableWithFixedColumnWidthsOption) || false;
   var shouldUseIncreasedScalingPercent = isTableScalingEnabled && (isTableFixedColumnWidthsOptionEnabled || isCommentEditor);
-
-  // In SSR use native ProseMirror spec-based render for table nodes
-  if (isSSR() && isSSRStreaming()) {
-    var isNested = isTableNested(view.state, typeof getPos === 'function' ? getPos() : undefined);
-    var tableDOMStructure = tableNodeSpecWithFixedToDOM({
-      allowColumnResizing: allowColumnResizing !== null && allowColumnResizing !== void 0 ? allowColumnResizing : false,
-      tableResizingEnabled: allowTableResizing !== null && allowTableResizing !== void 0 ? allowTableResizing : false,
-      getEditorContainerWidth: getEditorContainerWidth,
-      isTableScalingEnabled: isTableScalingEnabled,
-      shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent,
-      isCommentEditor: isCommentEditor,
-      isChromelessEditor: isChromelessEditor,
-      isNested: isNested
-    }).toDOM(node);
-    return DOMSerializer.renderSpec(document, tableDOMStructure);
-  }
   return new TableView({
     node: node,
     view: view,
@@ -406,6 +398,7 @@ export var createTableView = function createTableView(node, view, getPos, portal
     getEditorFeatureFlags: getEditorFeatureFlags,
     dispatchAnalyticsEvent: dispatchAnalyticsEvent,
     pluginInjectionApi: pluginInjectionApi,
-    allowFixedColumnWidthOption: allowFixedColumnWidthOption
+    allowFixedColumnWidthOption: allowFixedColumnWidthOption,
+    intl: intl
   }).init();
 };

package/dist/esm/pm-plugins/commands/insert.js

@@ -9,7 +9,9 @@ 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 { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { updateRowOrColumnMovedTransform } from '../analytics/commands';
 import { META_KEYS } from '../table-analytics';
 import { rescaleColumns } from '../transforms/column-width';
@@ -264,8 +266,15 @@ export var insertTableWithNestingSupport = function insertTableWithNestingSuppor
     _ref2$createTableProp = _ref2.createTableProps,
     createTableProps = _ref2$createTableProp === void 0 ? {} : _ref2$createTableProp;
   return function (_ref3) {
-    var _api$contentInsertion, _tr$selection$$from$n2;
+    var _api$markdownMode, _api$contentInsertion, _tr$selection$$from$n2;
     var tr = _ref3.tr;
+    // Delegate to the markdown plugin to insert a markdown table string at the CM cursor position.
+    var markdownState = api === null || api === void 0 || (_api$markdownMode = api.markdownMode) === null || _api$markdownMode === void 0 ? void 0 : _api$markdownMode.sharedState.currentState();
+    if (markdownState !== null && markdownState !== void 0 && markdownState.isMarkdownMode && (markdownState === null || markdownState === void 0 ? void 0 : markdownState.view) === 'syntax' && expValEqualsNoExposure('cc-markdown-mode', 'isEnabled', true) && fg('platform_editor_markdown_compatible_toolbar')) {
+      var _api$markdownMode2;
+      api === null || api === void 0 || (_api$markdownMode2 = api.markdownMode) === null || _api$markdownMode2 === void 0 || _api$markdownMode2.actions.insertSourceTable(createTableProps.rowsCount, createTableProps.colsCount);
+      return tr;
+    }
     var schema = tr.doc.type.schema;
 
     // If the cursor is inside a table

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

@@ -4,7 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { bind } from 'bind-event-listener';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { getBrowserInfo } from '@atlaskit/editor-common/browser';
-import { insideTable } from '@atlaskit/editor-common/core-utils';
+import { insideTable, isSSRStreaming } from '@atlaskit/editor-common/core-utils';
 import { isNestedTablesSupported } from '@atlaskit/editor-common/nesting';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { transformSliceToRemoveOpenBodiedExtension, transformSliceToRemoveOpenExpand, transformSliceToRemoveOpenLayoutNodes, transformSliceToRemoveOpenMultiBodiedExtension, transformSliceToRemoveOpenNestedExpand } from '@atlaskit/editor-common/transforms';
@@ -62,6 +62,7 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
     }
     return editorView.state;
   };
+  var intl = isSSRStreaming() ? getIntl() : undefined;
   var getNodeView = function getNodeView() {
     return {
       table: tableView({
@@ -73,7 +74,8 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
         pluginInjectionApi: pluginInjectionApi,
         isCommentEditor: isCommentEditor,
         isChromelessEditor: isChromelessEditor,
-        allowFixedColumnWidthOption: allowFixedColumnWidthOption
+        allowFixedColumnWidthOption: allowFixedColumnWidthOption,
+        intl: intl
       }),
       tableRow: tableRowView({
         eventDispatcher: eventDispatcher,

package/dist/esm/pm-plugins/table-resizing/utils/colgroup.js

@@ -1,4 +1,5 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import { isSSRStreaming } from '@atlaskit/editor-common/core-utils';
 import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { calcTableColumnWidths, getFragmentBackingArray } from '@atlaskit/editor-common/utils';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
@@ -25,7 +26,7 @@ var generateColStyle = function generateColStyle(fixedColWidth, tableWidth, isCo
     if (hasTableBeenResized) {
       return "width: max(".concat(fixedColWidth, "px, ").concat(tableCellMinWidth, "px)");
     }
-    return "width: ".concat(tableCellMinWidth, "px)");
+    return isSSRStreaming() ? "width: ".concat(tableCellMinWidth, "px") : "width: ".concat(tableCellMinWidth, "px)");
   }
   if (isFullPageEditor || !isFullPageEditor && isTableHasWidth) {
     var scaledPercent = isNumberColumnEnabled ? "calc(calc(var(--ak-editor-table-width) - ".concat(akEditorTableNumberColumnWidth, "px - 1px)/").concat(tableWidth, ")") : "calc(calc(var(--ak-editor-table-width) - 1px)/".concat(tableWidth, ")");

package/dist/esm/tablePlugin.js

@@ -16,6 +16,7 @@ import { hasParentNodeOfType, safeInsert } from '@atlaskit/editor-prosemirror/ut
 import { tableEditing } from '@atlaskit/editor-tables/pm-plugins';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { tableNodeSpecWithFixedToDOM } from './nodeviews/toDOM';
 import { createPlugin as createActiveCellHighlightPlugin } from './pm-plugins/active-cell-highlight/plugin';
@@ -554,7 +555,7 @@ var tablePlugin = function tablePlugin(_ref) {
             return /*#__PURE__*/React.createElement(IconTable, null);
           },
           action: function action(insert, state) {
-            var _api$table, _options$tableOptions6, _tr$selection$$from$n;
+            var _api$markdownMode, _api$table, _options$tableOptions6, _tr$selection$$from$n;
             if (isTableSelectorEnabled) {
               var _tr = insert('');
               _tr.setMeta(sizeSelectorPluginKey, {
@@ -563,6 +564,14 @@ var tablePlugin = function tablePlugin(_ref) {
               return _tr;
             }
 
+            // Delegate to the markdown plugin to insert a markdown table string at the CM cursor position.
+            var markdownState = api === null || api === void 0 || (_api$markdownMode = api.markdownMode) === null || _api$markdownMode === void 0 ? void 0 : _api$markdownMode.sharedState.currentState();
+            if (markdownState !== null && markdownState !== void 0 && markdownState.isMarkdownMode && (markdownState === null || markdownState === void 0 ? void 0 : markdownState.view) === 'syntax' && expValEqualsNoExposure('cc-markdown-mode', 'isEnabled', true) && fg('platform_editor_markdown_compatible_toolbar')) {
+              var _api$markdownMode2;
+              api === null || api === void 0 || (_api$markdownMode2 = api.markdownMode) === null || _api$markdownMode2 === void 0 || _api$markdownMode2.actions.insertSourceTable();
+              return state.tr;
+            }
+
             // see comment on tablesPlugin.getSharedState on usage
             var tableState = api === null || api === void 0 || (_api$table = api.table) === null || _api$table === void 0 ? void 0 : _api$table.sharedState.currentState();
             var tableNodeProps = {

package/dist/esm/ui/TableMenu/cell/getCellMenuComponents.js

@@ -4,14 +4,166 @@ import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
 import AlignPositionBottomIcon from '@atlaskit/icon-lab/core/align-position-bottom';
 import AlignPositionCenterVerticalIcon from '@atlaskit/icon-lab/core/align-position-center-vertical';
 import AlignPositionTopIcon from '@atlaskit/icon-lab/core/align-position-top';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { MergeCellsItem } from './items/MergeCellsItem';
 import { SplitCellItem } from './items/SplitCellItem';
 import { VerticalAlignDropdownItem } from './items/VerticalAlignDropdownItem';
 import { VerticalAlignNestedMenu } from './items/VerticalAlignNestedMenu';
-import { CELL_MENU, CELL_ACTION_SECTION, CELL_DANGER_SECTION, CELL_MENU_RANK, MERGE_CELLS_ITEM, SPLIT_CELL_ITEM, CELL_ACTION_SECTION_RANK, VERTICAL_ALIGN_BOTTOM_ITEM, VERTICAL_ALIGN_MENU, VERTICAL_ALIGN_MENU_RANK, VERTICAL_ALIGN_MENU_SECTION, VERTICAL_ALIGN_MENU_SECTION_RANK, VERTICAL_ALIGN_MIDDLE_ITEM, VERTICAL_ALIGN_TOP_ITEM } from './keys';
+import { CELL_MENU, CELL_ACTION_SECTION, CELL_ADD_SECTION, CELL_DANGER_SECTION, CELL_MENU_RANK, MERGE_CELLS_ITEM, SPLIT_CELL_ITEM, CELL_ACTION_SECTION_RANK, CELL_ADD_SECTION_RANK, VERTICAL_ALIGN_BOTTOM_ITEM, VERTICAL_ALIGN_MENU, VERTICAL_ALIGN_MENU_RANK, VERTICAL_ALIGN_MENU_SECTION, VERTICAL_ALIGN_MENU_SECTION_RANK, VERTICAL_ALIGN_MIDDLE_ITEM, VERTICAL_ALIGN_TOP_ITEM } from './keys';
 export var getCellMenuComponents = function getCellMenuComponents(_ref) {
   var api = _ref.api;
-  return [
+  return fg('platform_editor_table_cell_menu_update') ? [
+  // --- Cell menu update ON ---
+  // Merge/Split cells move into the Add section (alongside the shared add/distribute
+  // items); the danger section gains the shared Delete column/row items.
+
+  // --- Menu surface ---
+  {
+    type: CELL_MENU.type,
+    key: CELL_MENU.key
+  },
+  // --- Main action section (Background color, Vertical align) ---
+  {
+    type: CELL_ACTION_SECTION.type,
+    key: CELL_ACTION_SECTION.key,
+    parents: [{
+      type: CELL_MENU.type,
+      key: CELL_MENU.key,
+      rank: CELL_MENU_RANK[CELL_ACTION_SECTION.key]
+    }],
+    component: function component(props) {
+      return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, null, props.children);
+    }
+  }, {
+    type: VERTICAL_ALIGN_MENU.type,
+    key: VERTICAL_ALIGN_MENU.key,
+    parents: [{
+      type: CELL_ACTION_SECTION.type,
+      key: CELL_ACTION_SECTION.key,
+      rank: CELL_ACTION_SECTION_RANK[VERTICAL_ALIGN_MENU.key]
+    }],
+    component: function component(props) {
+      return /*#__PURE__*/React.createElement(VerticalAlignNestedMenu, null, props.children);
+    }
+  }, {
+    type: VERTICAL_ALIGN_MENU_SECTION.type,
+    key: VERTICAL_ALIGN_MENU_SECTION.key,
+    parents: [{
+      type: VERTICAL_ALIGN_MENU.type,
+      key: VERTICAL_ALIGN_MENU.key,
+      rank: VERTICAL_ALIGN_MENU_RANK[VERTICAL_ALIGN_MENU_SECTION.key]
+    }],
+    component: function component(props) {
+      return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, null, props.children);
+    }
+  }, {
+    type: VERTICAL_ALIGN_TOP_ITEM.type,
+    key: VERTICAL_ALIGN_TOP_ITEM.key,
+    parents: [{
+      type: VERTICAL_ALIGN_MENU_SECTION.type,
+      key: VERTICAL_ALIGN_MENU_SECTION.key,
+      rank: VERTICAL_ALIGN_MENU_SECTION_RANK[VERTICAL_ALIGN_TOP_ITEM.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/React.createElement(VerticalAlignDropdownItem, {
+        api: api,
+        icon: AlignPositionTopIcon,
+        label: messages.cellAlignmentTop,
+        value: "top"
+      });
+    }
+  }, {
+    type: VERTICAL_ALIGN_MIDDLE_ITEM.type,
+    key: VERTICAL_ALIGN_MIDDLE_ITEM.key,
+    parents: [{
+      type: VERTICAL_ALIGN_MENU_SECTION.type,
+      key: VERTICAL_ALIGN_MENU_SECTION.key,
+      rank: VERTICAL_ALIGN_MENU_SECTION_RANK[VERTICAL_ALIGN_MIDDLE_ITEM.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/React.createElement(VerticalAlignDropdownItem, {
+        api: api,
+        icon: AlignPositionCenterVerticalIcon,
+        label: messages.cellAlignmentMiddle,
+        value: "middle"
+      });
+    }
+  }, {
+    type: VERTICAL_ALIGN_BOTTOM_ITEM.type,
+    key: VERTICAL_ALIGN_BOTTOM_ITEM.key,
+    parents: [{
+      type: VERTICAL_ALIGN_MENU_SECTION.type,
+      key: VERTICAL_ALIGN_MENU_SECTION.key,
+      rank: VERTICAL_ALIGN_MENU_SECTION_RANK[VERTICAL_ALIGN_BOTTOM_ITEM.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/React.createElement(VerticalAlignDropdownItem, {
+        api: api,
+        icon: AlignPositionBottomIcon,
+        label: messages.cellAlignmentBottom,
+        value: "bottom"
+      });
+    }
+  },
+  // --- Add / Move section (shared Add column right / Add row below / Distribute
+  // columns are registered in `../shared/getSharedItems`; Merge/Split cells below) ---
+  {
+    type: CELL_ADD_SECTION.type,
+    key: CELL_ADD_SECTION.key,
+    parents: [{
+      type: CELL_MENU.type,
+      key: CELL_MENU.key,
+      rank: CELL_MENU_RANK[CELL_ADD_SECTION.key]
+    }],
+    component: function component(props) {
+      return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
+        hasSeparator: true
+      }, props.children);
+    }
+  }, {
+    type: MERGE_CELLS_ITEM.type,
+    key: MERGE_CELLS_ITEM.key,
+    parents: [{
+      type: CELL_ADD_SECTION.type,
+      key: CELL_ADD_SECTION.key,
+      rank: CELL_ADD_SECTION_RANK[MERGE_CELLS_ITEM.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/React.createElement(MergeCellsItem, {
+        api: api
+      });
+    }
+  }, {
+    type: SPLIT_CELL_ITEM.type,
+    key: SPLIT_CELL_ITEM.key,
+    parents: [{
+      type: CELL_ADD_SECTION.type,
+      key: CELL_ADD_SECTION.key,
+      rank: CELL_ADD_SECTION_RANK[SPLIT_CELL_ITEM.key]
+    }],
+    component: function component() {
+      return /*#__PURE__*/React.createElement(SplitCellItem, {
+        api: api
+      });
+    }
+  },
+  // --- Danger section (Clear cell + shared Delete column / Delete row) ---
+  {
+    type: CELL_DANGER_SECTION.type,
+    key: CELL_DANGER_SECTION.key,
+    parents: [{
+      type: CELL_MENU.type,
+      key: CELL_MENU.key,
+      rank: CELL_MENU_RANK[CELL_DANGER_SECTION.key]
+    }],
+    component: function component(props) {
+      return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
+        hasSeparator: true
+      }, props.children);
+    }
+  }] : [
+  // --- Cell menu update OFF: legacy cell menu (Merge/Split live in the action section) ---
+
   // --- Menu surface ---
   {
     type: CELL_MENU.type,

package/dist/esm/ui/TableMenu/cell/keys.js

@@ -1,4 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { ADD_COLUMN_RIGHT_ITEM, DELETE_COLUMN_ITEM, DISTRIBUTE_COLUMNS_ITEM } from '../column/keys';
+import { ADD_ROW_BELOW_ITEM, DELETE_ROW_ITEM } from '../row/keys';
 import { BACKGROUND_COLOR_ITEM, CLEAR_CELLS_ITEM } from '../shared/keys';
 
 // --- Menu surface ---
@@ -14,11 +16,15 @@ export var CELL_ACTION_SECTION = {
   type: 'menu-section',
   key: 'cell-action-section'
 };
+export var CELL_ADD_SECTION = {
+  type: 'menu-section',
+  key: 'cell-add-section'
+};
 export var CELL_DANGER_SECTION = {
   type: 'menu-section',
   key: 'cell-danger-section'
 };
-export var CELL_MENU_RANK = _defineProperty(_defineProperty({}, CELL_ACTION_SECTION.key, 100), CELL_DANGER_SECTION.key, 200);
+export var CELL_MENU_RANK = _defineProperty(_defineProperty(_defineProperty({}, CELL_ACTION_SECTION.key, 100), CELL_ADD_SECTION.key, 200), CELL_DANGER_SECTION.key, 300);
 export var MERGE_CELLS_ITEM = {
   type: 'menu-item',
   key: 'merge-cells'
@@ -49,8 +55,16 @@ export var VERTICAL_ALIGN_BOTTOM_ITEM = {
 };
 
 // --- Item ranks within their sections ---
+//
+// The add/delete items rendered in the cell menu are shared with the row/column
+// menus (registered once in `../shared/getSharedItems` with multiple parents), so
+// we reuse their existing keys here rather than declaring cell-specific ones.
 
 export var CELL_ACTION_SECTION_RANK = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, BACKGROUND_COLOR_ITEM.key, 100), VERTICAL_ALIGN_MENU.key, 200), MERGE_CELLS_ITEM.key, 300), SPLIT_CELL_ITEM.key, 400);
 export var VERTICAL_ALIGN_MENU_RANK = _defineProperty({}, VERTICAL_ALIGN_MENU_SECTION.key, 100);
 export var VERTICAL_ALIGN_MENU_SECTION_RANK = _defineProperty(_defineProperty(_defineProperty({}, VERTICAL_ALIGN_TOP_ITEM.key, 100), VERTICAL_ALIGN_MIDDLE_ITEM.key, 200), VERTICAL_ALIGN_BOTTOM_ITEM.key, 300);
-export var CELL_DANGER_SECTION_RANK = _defineProperty({}, CLEAR_CELLS_ITEM.key, 100);
+
+// Merge/Split cells are relocated from the action section into the add section when the
+// cell menu update gate is on; they sit at the top of the section.
+export var CELL_ADD_SECTION_RANK = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, MERGE_CELLS_ITEM.key, 100), SPLIT_CELL_ITEM.key, 200), ADD_COLUMN_RIGHT_ITEM.key, 300), ADD_ROW_BELOW_ITEM.key, 400), DISTRIBUTE_COLUMNS_ITEM.key, 500);
+export var CELL_DANGER_SECTION_RANK = _defineProperty(_defineProperty(_defineProperty({}, CLEAR_CELLS_ITEM.key, 100), DELETE_COLUMN_ITEM.key, 200), DELETE_ROW_ITEM.key, 300);