@atlaskit/editor-plugin-table 24.3.14 → 24.4.1

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/drag-and-drop/plugin.js

@@ -33,20 +33,16 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI, isTableScalin
       return type === 'table-row';
     },
     onDragStart: function onDragStart() {
-      if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-        var _insm$session;
-        (_insm$session = insm.session) === null || _insm$session === void 0 || _insm$session.startFeature('tableDragAndDrop');
-      }
+      var _insm$session;
+      (_insm$session = insm.session) === null || _insm$session === void 0 || _insm$session.startFeature('tableDragAndDrop');
       // auto scroller doesn't work when scroll-behavior: smooth is set, this monitor temporarily removes it via inline styles
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
       editorPageScrollContainer.style.setProperty('scroll-behavior', 'unset');
     },
     onDrop: function onDrop() {
-      if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-        var _insm$session2;
-        (_insm$session2 = insm.session) === null || _insm$session2 === void 0 || _insm$session2.endFeature('tableDragAndDrop');
-      }
+      var _insm$session2;
+      (_insm$session2 = insm.session) === null || _insm$session2 === void 0 || _insm$session2.endFeature('tableDragAndDrop');
       // 'null' will remove the inline style
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
@@ -82,10 +78,8 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI, isTableScalin
       return localId === (tableNode === null || tableNode === void 0 ? void 0 : tableNode.attrs.localId);
     },
     onDragStart: function onDragStart() {
-      if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-        var _insm$session3;
-        (_insm$session3 = insm.session) === null || _insm$session3 === void 0 || _insm$session3.startFeature('tableDragAndDrop');
-      }
+      var _insm$session3;
+      (_insm$session3 = insm.session) === null || _insm$session3 === void 0 || _insm$session3.startFeature('tableDragAndDrop');
       if (expValEquals('platform_editor_table_menu_updates', 'isEnabled', true)) {
         api === null || api === void 0 || api.core.actions.execute(function (_ref7) {
           var _api$userIntent;
@@ -154,13 +148,10 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI, isTableScalin
       }
       // If no data can be found then it's most like we do not want to perform any drop action
       if (!data) {
-        var _event$source, _event$source2;
+        var _insm$session4, _event$source, _event$source2;
         // If we're able to determine the source type of the dropped element then we should report to analytics that
         // the drop event was cancelled. Otherwise we will cancel silently.
-        if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-          var _insm$session4;
-          (_insm$session4 = insm.session) === null || _insm$session4 === void 0 || _insm$session4.endFeature('tableDragAndDrop');
-        }
+        (_insm$session4 = insm.session) === null || _insm$session4 === void 0 || _insm$session4.endFeature('tableDragAndDrop');
         if ((event === null || event === void 0 || (_event$source = event.source) === null || _event$source === void 0 || (_event$source = _event$source.data) === null || _event$source === void 0 ? void 0 : _event$source.type) === 'table-row' || (event === null || event === void 0 || (_event$source2 = event.source) === null || _event$source2 === void 0 || (_event$source2 = _event$source2.data) === null || _event$source2 === void 0 ? void 0 : _event$source2.type) === 'table-column') {
           var _event$source$data;
           return clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, event.source.data.type, (_event$source$data = event.source.data) === null || _event$source$data === void 0 ? void 0 : _event$source$data.indexes, TABLE_STATUS.CANCELLED, tr)(editorView.state, editorView.dispatch);
@@ -184,16 +175,15 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI, isTableScalin
 
       // If the drop target index contains merged cells then we should not allow the drop to occur.
       if (hasMergedCellsInBetween([targetAdjustedIndex - 1, targetAdjustedIndex], sourceType === 'table-row' ? DropTargetType.ROW : DropTargetType.COLUMN)(editorView.state.selection)) {
+        var _insm$session5;
         clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndexes,
         // This event is mrked as invalid because the user is attempting to drop an element in an area which has merged cells.
         TABLE_STATUS.INVALID, tr)(editorView.state, editorView.dispatch);
-        if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-          var _insm$session5;
-          (_insm$session5 = insm.session) === null || _insm$session5 === void 0 || _insm$session5.endFeature('tableDragAndDrop');
-        }
+        (_insm$session5 = insm.session) === null || _insm$session5 === void 0 || _insm$session5.endFeature('tableDragAndDrop');
         return;
       }
       requestAnimationFrame(function () {
+        var _insm$session6;
         if (behaviour === 'clone') {
           cloneSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndexes, targetIndex, targetDirection, tr)(editorView.state, editorView.dispatch);
         } else {
@@ -220,10 +210,7 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI, isTableScalin
           }
         }
         editorView.focus();
-        if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-          var _insm$session6;
-          (_insm$session6 = insm.session) === null || _insm$session6 === void 0 || _insm$session6.endFeature('tableDragAndDrop');
-        }
+        (_insm$session6 = insm.session) === null || _insm$session6 === void 0 || _insm$session6.endFeature('tableDragAndDrop');
       });
     }
   })]));

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/event-handlers.js

@@ -3,7 +3,6 @@ import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { getSelectionRect } from '@atlaskit/editor-tables/utils';
 import { insm } from '@atlaskit/insm';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { stopKeyboardColumnResizing } from '../commands/column-resize';
 import { updateResizeHandleDecorations } from '../commands/misc';
 import { getPluginState as getTablePluginState } from '../plugin-factory';
@@ -19,7 +18,7 @@ import { currentColWidth, getTableMaxWidth, pointsAtCell, getScalingPercentForTa
 import { resizeColumn } from './utils/resize-column';
 import { getResizeState } from './utils/resize-state';
 export var handleMouseDown = function handleMouseDown(view, event, localResizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, isTableScalingEnabled, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isCommentEditor) {
-  var _originalTable$attrs;
+  var _insm$session, _originalTable$attrs;
   var state = view.state,
     dispatch = view.dispatch;
   var editorDisabled = !view.editable;
@@ -32,10 +31,7 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
   var _getTablePluginState = getTablePluginState(state),
     isKeyboardResize = _getTablePluginState.isKeyboardResize;
   event.preventDefault();
-  if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-    var _insm$session;
-    (_insm$session = insm.session) === null || _insm$session === void 0 || _insm$session.startFeature('tableColumnResize');
-  }
+  (_insm$session = insm.session) === null || _insm$session === void 0 || _insm$session.startFeature('tableColumnResize');
   var tr = view.state.tr;
   tr.setMeta(META_KEYS.OVERFLOW_TRIGGER, {
     name: TABLE_OVERFLOW_CHANGE_TRIGGER.RESIZED_COLUMN
@@ -126,17 +122,13 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
     var _getTablePluginState2 = getTablePluginState(state),
       isTableHovered = _getTablePluginState2.isTableHovered;
     if (resizeHandlePos === null) {
-      if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-        var _insm$session2;
-        (_insm$session2 = insm.session) === null || _insm$session2 === void 0 || _insm$session2.endFeature('tableColumnResize');
-      }
+      var _insm$session2;
+      (_insm$session2 = insm.session) === null || _insm$session2 === void 0 || _insm$session2.endFeature('tableColumnResize');
       return stopResizing()(state, dispatch);
     }
     if (!pointsAtCell(state.doc.resolve(resizeHandlePos))) {
-      if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-        var _insm$session3;
-        (_insm$session3 = insm.session) === null || _insm$session3 === void 0 || _insm$session3.endFeature('tableColumnResize');
-      }
+      var _insm$session3;
+      (_insm$session3 = insm.session) === null || _insm$session3 === void 0 || _insm$session3.endFeature('tableColumnResize');
       return;
     }
     // resizeHandlePos could be remapped via a collab change.
@@ -149,10 +141,8 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
 
     // If we let go in the same place we started, don't need to do anything.
     if (dragging && clientX === dragging.startX) {
-      if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-        var _insm$session4;
-        (_insm$session4 = insm.session) === null || _insm$session4 === void 0 || _insm$session4.endFeature('tableColumnResize');
-      }
+      var _insm$session4;
+      (_insm$session4 = insm.session) === null || _insm$session4 === void 0 || _insm$session4.endFeature('tableColumnResize');
       if (isKeyboardResize || !isTableHovered) {
         /** if column resize had started via keyboard but continued by mouse
          *  or mouse pointer leaves the table but mouse button still pressed
@@ -164,6 +154,7 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
     }
     var tr = state.tr;
     if (dragging) {
+      var _insm$session5;
       var startX = dragging.startX;
 
       // If the dimensions of the table have changed through a remote modification by another
@@ -219,10 +210,7 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
           }
         })(tr);
       }
-      if (expValEquals('cc_editor_interactivity_monitoring', 'isEnabled', true)) {
-        var _insm$session5;
-        (_insm$session5 = insm.session) === null || _insm$session5 === void 0 || _insm$session5.endFeature('tableColumnResize');
-      }
+      (_insm$session5 = insm.session) === null || _insm$session5 === void 0 || _insm$session5.endFeature('tableColumnResize');
       if (isKeyboardResize || !isTableHovered) {
         /** if column resize had started via keyboard but continued by mouse
          *  or mouse pointer leaves the table but mouse button still pressed

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);