@atlaskit/editor-plugin-block-controls 13.0.4 → 13.0.6

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 13.0.6
+
+### Patch Changes
+
+- [`e850980f5a66f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e850980f5a66f) -
+  [EDITOR-6790] Block-controls drag-handle wrapper's background is removed and instead set
+  on`::before` on `.pm-table-container.pm-table-sticky` to keep masking the row insert dots when
+  legacy sticky header is activated while also not overlapping the column insert button.
+- [`7754772ebfa47`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7754772ebfa47) -
+  Fix table text length calculation for Remix/Improve Writing hero prompts: use
+  tableNode.textContent for CellSelection instead of textBetween which only spans anchor/head cell
+  range
+- Updated dependencies
+
+## 13.0.5
+
+### Patch Changes
+
+- [`086e779e3490c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/086e779e3490c) -
+  Add drag and drop support for panel_c1 - allow tables to be dropped into panel_c1, allow panel_c1
+  -> panel when dropping in parents that allow panel (e.g., expand, table) via generic transform
+  functions for future variants
+- Updated dependencies
+
 ## 13.0.4
 
 ### Patch Changes

package/dist/cjs/blockControlsPlugin.js

@@ -10,7 +10,9 @@ var _react = _interopRequireDefault(require("react"));
 var _selection = require("@atlaskit/editor-common/selection");
 var _toolbarFlagCheck = require("@atlaskit/editor-common/toolbar-flag-check");
 var _state = require("@atlaskit/editor-prosemirror/state");
+var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _handleKeyDownWithPreservedSelection = require("./editor-commands/handle-key-down-with-preserved-selection");
 var _mapPreservedSelection2 = require("./editor-commands/map-preserved-selection");
@@ -44,6 +46,27 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
         var blockControlsState = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState();
         var preservedSelection = blockControlsState === null || blockControlsState === void 0 ? void 0 : blockControlsState.preservedSelection;
         if (preservedSelection && preservedSelection.from !== preservedSelection.to) {
+          // CellSelection covers a table: collect each selected cell's text joined with spaces
+          // so that adjacent cells are not fused (e.g. 'hello world' + 'foo' must not
+          // become 'hello worldfoo'). Intl.Segmenter word-counting requires correct
+          // word boundaries, which raw textContent fusion breaks.
+          if (preservedSelection instanceof _cellSelection.CellSelection && (0, _expValEquals.expValEquals)('remix_iw_block_menu_table_calc_fix', 'isEnabled', true)) {
+            // Use node(1) to reliably target the table node regardless of $anchorCell depth.
+            // node(-1) would return tableRow if $anchorCell is at tableCell depth.
+            var tableNode = preservedSelection.$anchorCell.node(1);
+            var cellTexts = [];
+            if (tableNode) {
+              // forEachCell iterates only the selected cells, not all cells in the table.
+              preservedSelection.forEachCell(function (cell) {
+                cellTexts.push(cell.textContent);
+              });
+            }
+            var _textContent = cellTexts.filter(Boolean).join(' ');
+            return {
+              textLength: _textContent.length,
+              textContent: _textContent
+            };
+          }
           var from = preservedSelection.from,
             to = preservedSelection.to;
           var textContent = editorView.state.doc.textBetween(from, to, '\n');

package/dist/cjs/editor-commands/move-node.js

@@ -51,12 +51,23 @@ function transformSourceSlice(nodeCopy, destType) {
   var destTypeInTable = (0, _validation.isInsideTable)(destType);
   var destTypeInDocOrLayoutCol = [doc, layoutColumn].includes(destType);
 
-  // No need to loop over slice content if destination requires no transformations
-  if (!destTypeInTable && !destTypeInDocOrLayoutCol) {
+  // Only run transformation loop if destination may need node conversions:
+  // - Table destinations may need expand → nestedExpand
+  // - Doc/layoutColumn destinations may need nestedExpand → expand
+  // - When panel_c1 experiment is on:
+  // - Expand/table/bodied extension destinations may need panel_c1 → panel downgrade
+  // - Doc/layoutColumn destinations may need panel → panel_c1 upgrade
+  var needsTransformCheck = destTypeInTable || destTypeInDocOrLayoutCol || (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true);
+  if (!needsTransformCheck) {
     return nodeCopy;
   }
   var containsExpand = false;
   var containsNestedExpand = false;
+  // Track variant nodes (e.g. panel_c1) and their base forms (e.g. panel).
+  // Uses getBaseNodeTypeName to auto-detect variants — new variants only need
+  // to be added to variantToBaseNameMap, no changes needed in the detection loop.
+  var variantType = null;
+  var baseOfVariantType = null;
   for (var i = 0; i < nodeCopy.content.childCount; i++) {
     var node = nodeCopy.content.child(i);
     if (node.type === schema.nodes.expand) {
@@ -64,7 +75,15 @@ function transformSourceSlice(nodeCopy, destType) {
     } else if (node.type === schema.nodes.nestedExpand) {
       containsNestedExpand = true;
     }
-    if (containsExpand && containsNestedExpand) {
+    if ((0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true)) {
+      var baseName = (0, _nodeTypeUtils.getBaseNodeTypeName)(node.type);
+      if (baseName !== node.type.name) {
+        variantType = node.type.name;
+      } else if (schema.nodes["".concat(baseName, "_c1")]) {
+        baseOfVariantType = node.type.name;
+      }
+    }
+    if (containsExpand && containsNestedExpand && (variantType || baseOfVariantType)) {
       break;
     }
   }
@@ -73,6 +92,26 @@ function transformSourceSlice(nodeCopy, destType) {
   } else if (containsNestedExpand && destTypeInDocOrLayoutCol) {
     return (0, _transforms.transformSliceNestedExpandToExpand)(nodeCopy, schema);
   }
+
+  // Downgrade variant → base (e.g. panel_c1 → panel) when dest doesn't support the variant
+  if (variantType && schema.nodes[variantType]) {
+    var destParent = destType.createAndFill();
+    if (destParent && !(0, _nodeTypeUtils.isNodeTypeValidChildOf)(variantType, destParent, schema)) {
+      var _baseName = (0, _nodeTypeUtils.getBaseNodeTypeName)(schema.nodes[variantType]);
+      return (0, _validation.transformSliceNodeType)(nodeCopy, schema, variantType, _baseName);
+    }
+  }
+
+  // Upgrade base → variant (e.g. panel → panel_c1) when dest supports the variant
+  if (baseOfVariantType) {
+    var variantName = "".concat(baseOfVariantType, "_c1");
+    if (schema.nodes[variantName]) {
+      var _destParent = destType.createAndFill();
+      if (_destParent && (0, _nodeTypeUtils.isNodeTypeValidChildOf)(variantName, _destParent, schema)) {
+        return (0, _validation.transformSliceNodeType)(nodeCopy, schema, baseOfVariantType, variantName);
+      }
+    }
+  }
   return nodeCopy;
 }
 var nodesSupportDragLayoutColumnInto = ['tableCell', 'tableHeader', 'panel', 'expand', 'nestedExpand'];

package/dist/cjs/pm-plugins/decorations-common.js

@@ -10,6 +10,7 @@ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _uuid = _interopRequireDefault(require("uuid"));
+var _nodeTypeUtils = require("@atlaskit/editor-common/utils/node-type-utils");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _validation = require("./utils/validation");
 // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
@@ -33,7 +34,8 @@ var getSubType = function getSubType(node) {
 };
 var getNodeTypeWithLevel = exports.getNodeTypeWithLevel = function getNodeTypeWithLevel(node) {
   var subType = (0, _expValEquals.expValEquals)('platform_editor_small_font_size', 'isEnabled', true) ? getSubType(node) : node.attrs.level ? "-".concat(node.attrs.level) : '';
-  return node.type.name + subType;
+  var typeName = (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? (0, _nodeTypeUtils.getBaseNodeTypeName)(node.type) : node.type.name;
+  return typeName + subType;
 };
 var ObjHash = /*#__PURE__*/function () {
   function ObjHash() {

package/dist/cjs/pm-plugins/decorations-drop-target-active.js

@@ -9,6 +9,7 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
 var _selection = require("@atlaskit/editor-common/selection");
 var _utils = require("@atlaskit/editor-common/utils");
+var _nodeTypeUtils = require("@atlaskit/editor-common/utils/node-type-utils");
 var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
@@ -33,7 +34,8 @@ var getContainerNodeTypes = (0, _memoizeOne.default)(function () {
   return [].concat(PARENT_WITH_END_DROP_TARGET, (0, _toConsumableArray2.default)((0, _platformFeatureFlags.fg)('confluence_frontend_native_tabs_extension') ? ['multiBodiedExtension'] : []), (0, _toConsumableArray2.default)((0, _experiments.editorExperiment)('platform_synced_block', true) ? ['bodiedSyncBlock'] : []));
 });
 var isContainerNode = function isContainerNode(node) {
-  return getContainerNodeTypes().includes(node.type.name);
+  var nodeName = (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) ? (0, _nodeTypeUtils.getBaseNodeTypeName)(node.type) : node.type.name;
+  return getContainerNodeTypes().includes(nodeName);
 };
 var canMoveNodeOrSliceToPos = exports.canMoveNodeOrSliceToPos = function canMoveNodeOrSliceToPos(state, node, parent, index, $toPos, activeNode) {
   // For deciding to show drop targets or not when multiple nodes are selected

package/dist/cjs/pm-plugins/utils/validation.js

@@ -7,9 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.canCreateNodeWithContentInsideAnotherNode = void 0;
 exports.canMoveNodeToIndex = canMoveNodeToIndex;
 exports.canMoveSliceToIndex = canMoveSliceToIndex;
-exports.transformSliceExpandToNestedExpand = exports.transformFragmentExpandToNestedExpand = exports.transformExpandToNestedExpand = exports.memoizedTransformExpandToNestedExpand = exports.isNestedExpand = exports.isLayoutColumn = exports.isInsideTable = exports.isInSameLayout = exports.isFontSizeMarkActive = exports.isExpand = exports.isDoc = void 0;
+exports.transformSliceNodeType = exports.transformSliceExpandToNestedExpand = exports.transformFragmentNodeType = exports.transformFragmentExpandToNestedExpand = exports.transformExpandToNestedExpand = exports.memoizedTransformExpandToNestedExpand = exports.isNestedExpand = exports.isLayoutColumn = exports.isInsideTable = exports.isInSameLayout = exports.isFontSizeMarkActive = exports.isExpand = exports.isDoc = void 0;
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
 var _nesting = require("@atlaskit/editor-common/nesting");
+var _nodeTypeUtils = require("@atlaskit/editor-common/utils/node-type-utils");
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
@@ -79,6 +80,41 @@ var transformFragmentExpandToNestedExpand = exports.transformFragmentExpandToNes
   }
   return _model.Fragment.fromArray(children);
 };
+
+/**
+ * Generic fragment transformer — converts all nodes of `fromType` to `toType`,
+ * preserving attrs, content, and marks.
+ */
+var transformFragmentNodeType = exports.transformFragmentNodeType = function transformFragmentNodeType(fragment, schema, fromType, toType) {
+  var children = [];
+  var targetType = schema.nodes[toType];
+  if (!targetType) {
+    return null;
+  }
+  try {
+    fragment.forEach(function (node) {
+      if (node.type.name === fromType) {
+        children.push(targetType.create(node.attrs, node.content, node.marks));
+      } else {
+        children.push(node);
+      }
+    });
+  } catch (e) {
+    return null;
+  }
+  return _model.Fragment.fromArray(children);
+};
+
+/**
+ * Generic slice transformer — converts all nodes of `fromType` to `toType`.
+ */
+var transformSliceNodeType = exports.transformSliceNodeType = function transformSliceNodeType(slice, schema, fromType, toType) {
+  var fragment = transformFragmentNodeType(slice.content, schema, fromType, toType);
+  if (!fragment) {
+    return null;
+  }
+  return new _model.Slice(fragment, slice.openStart, slice.openEnd);
+};
 var transformSliceExpandToNestedExpand = exports.transformSliceExpandToNestedExpand = function transformSliceExpandToNestedExpand(slice) {
   var fragment = transformFragmentExpandToNestedExpand(slice.content);
   if (!fragment) {
@@ -163,6 +199,19 @@ function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos,
   } else if ((isDoc(destParent.type) || isLayoutColumn(destParent.type)) && isNestedExpand(srcNodeType)) {
     srcNodeType = expand;
   }
+
+  // Downgrade variant node (e.g. panel_c1 → panel) when dest doesn't support it
+  if ((0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true)) {
+    var baseName = (0, _nodeTypeUtils.getBaseNodeTypeName)(srcNodeType);
+    if (baseName !== srcNodeType.name && !destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType)) {
+      var baseType = schema.nodes[baseName];
+      // Check if the node's content is valid in the base type (e.g. panel with table can't be downgraded)
+      if (!baseType || !baseType.validContent(srcNode.content)) {
+        return false;
+      }
+      srcNodeType = baseType;
+    }
+  }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }
 function canMoveSliceToIndex(slice, sliceFromPos, sliceToPos, destParent, indexIntoParent, $destNodePos, destNode) {

package/dist/cjs/ui/drag-handle.js

@@ -82,6 +82,37 @@ var buttonWrapperStyles = (0, _react2.css)({
     boxSizing: 'border-box'
   }
 });
+
+// EDITOR-6790 - When the `platform_editor_table_col_insert` experiment is enabled,
+// drop the linear-gradient background that paints over the legacy `tr.sticky` table
+// header so the new left-edge column-insert affordance is not visually clipped.
+// Keep all paddings / margins identical to `buttonWrapperStyles` so the drag-handle
+// layout does not shift between the two variants.
+var buttonWrapperStylesNoBackground = (0, _react2.css)({
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-blocks-drag-handle-container]:has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls tr.sticky) &': {
+    marginBottom: "var(--ds-space-negative-200, -16px)",
+    paddingBottom: "var(--ds-space-200, 16px)",
+    marginTop: "var(--ds-space-negative-400, -32px)",
+    paddingTop: "calc(".concat("var(--ds-space-400, 32px)", " - 1px)"),
+    marginRight: "var(--ds-space-negative-150, -12px)",
+    paddingRight: "var(--ds-space-150, 12px)",
+    boxSizing: 'border-box'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-prosemirror-mark-name="breakout"]:has([data-blocks-drag-handle-container]):has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls tr.sticky) &': {
+    marginBottom: "var(--ds-space-negative-200, -16px)",
+    paddingBottom: "var(--ds-space-200, 16px)",
+    marginTop: "var(--ds-space-negative-400, -32px)",
+    paddingTop: "calc(".concat("var(--ds-space-400, 32px)", " - 1px)"),
+    marginRight: "var(--ds-space-negative-150, -12px)",
+    paddingRight: "var(--ds-space-150, 12px)",
+    boxSizing: 'border-box'
+  }
+});
 var buttonWrapperStylesPatch = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
   '[data-blocks-drag-handle-container]:has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls [data-number-column="true"] tr.sticky) &': {
@@ -1092,7 +1123,10 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
         });
       }
     }, (0, _react2.jsx)("span", {
-      css: [(0, _dragHandlePositions.shouldMaskNodeControls)(nodeType, isTopLevelNodeValue) && buttonWrapperStyles, buttonWrapperStylesPatch]
+      css: [(0, _dragHandlePositions.shouldMaskNodeControls)(nodeType, isTopLevelNodeValue) && (
+      // EDITOR-6790 - drop the masking background under the new
+      // column-insert experiment so the left-edge dot is not clipped.
+      (0, _expValEquals.expValEquals)('platform_editor_table_col_insert', 'isEnabled', true) ? buttonWrapperStylesNoBackground : buttonWrapperStyles), buttonWrapperStylesPatch]
     }, renderButton()))));
   };
   var stickyWithoutTooltip = function stickyWithoutTooltip() {
@@ -1108,7 +1142,10 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
     }, (0, _react2.jsx)("span", {
       css: [tooltipContainerStyles, (0, _dragHandlePositions.shouldMaskNodeControls)(nodeType, isTopLevelNodeValue) && tooltipContainerStylesStickyHeaderWithMask, !(0, _dragHandlePositions.shouldMaskNodeControls)(nodeType, isTopLevelNodeValue) && tooltipContainerStylesStickyHeaderWithoutMask]
     }, (0, _react2.jsx)("span", {
-      css: [(0, _dragHandlePositions.shouldMaskNodeControls)(nodeType, isTopLevelNodeValue) && buttonWrapperStyles, buttonWrapperStylesPatch]
+      css: [(0, _dragHandlePositions.shouldMaskNodeControls)(nodeType, isTopLevelNodeValue) && (
+      // EDITOR-6790 - drop the masking background under the new
+      // column-insert experiment so the left-edge dot is not clipped.
+      (0, _expValEquals.expValEquals)('platform_editor_table_col_insert', 'isEnabled', true) ? buttonWrapperStylesNoBackground : buttonWrapperStyles), buttonWrapperStylesPatch]
     }, renderButton())));
   };
   var buttonWithTooltip = function buttonWithTooltip() {

package/dist/cjs/ui/drop-target.js

@@ -11,6 +11,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _hooks = require("@atlaskit/editor-common/hooks");
+var _nodeTypeUtils = require("@atlaskit/editor-common/utils/node-type-utils");
 var _box = require("@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box");
 var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
 var _constants = require("@atlaskit/theme/constants");
@@ -232,7 +233,7 @@ var DropTarget = exports.DropTarget = function DropTarget(props) {
   };
   var dynamicStyle = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
     width: isNestedDropTarget ? 'unset' : '100%'
-  }, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat(lineLength || DEFAULT_DROP_INDICATOR_WIDTH, "px")), EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? (0, _consts.getNestedNodeLeftPaddingMargin)(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, _constants.layers.navigation());
+  }, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat(lineLength || DEFAULT_DROP_INDICATOR_WIDTH, "px")), EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? (0, _expValEquals.expValEquals)('platform_editor_nest_table_in_panel', 'isEnabled', true) && parentNode !== null && parentNode !== void 0 && parentNode.type ? (0, _consts.getNestedNodeLeftPaddingMargin)((0, _nodeTypeUtils.getBaseNodeTypeName)(parentNode.type)) : (0, _consts.getNestedNodeLeftPaddingMargin)(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, _constants.layers.navigation());
   var isShowInlineDropTarget = (0, _inlineDropTarget.shouldAllowInlineDropTarget)(isNestedDropTarget, nextNode, isSameLayout, activeNode, parentNode);
   return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(HoverZone
   // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)

package/dist/es2019/blockControlsPlugin.js

@@ -2,7 +2,9 @@ import React from 'react';
 import { expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { areToolbarFlagsEnabled } from '@atlaskit/editor-common/toolbar-flag-check';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { handleKeyDownWithPreservedSelection } from './editor-commands/handle-key-down-with-preserved-selection';
 import { mapPreservedSelection } from './editor-commands/map-preserved-selection';
@@ -35,6 +37,27 @@ export const blockControlsPlugin = ({
         const blockControlsState = api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState();
         const preservedSelection = blockControlsState === null || blockControlsState === void 0 ? void 0 : blockControlsState.preservedSelection;
         if (preservedSelection && preservedSelection.from !== preservedSelection.to) {
+          // CellSelection covers a table: collect each selected cell's text joined with spaces
+          // so that adjacent cells are not fused (e.g. 'hello world' + 'foo' must not
+          // become 'hello worldfoo'). Intl.Segmenter word-counting requires correct
+          // word boundaries, which raw textContent fusion breaks.
+          if (preservedSelection instanceof CellSelection && expValEquals('remix_iw_block_menu_table_calc_fix', 'isEnabled', true)) {
+            // Use node(1) to reliably target the table node regardless of $anchorCell depth.
+            // node(-1) would return tableRow if $anchorCell is at tableCell depth.
+            const tableNode = preservedSelection.$anchorCell.node(1);
+            const cellTexts = [];
+            if (tableNode) {
+              // forEachCell iterates only the selected cells, not all cells in the table.
+              preservedSelection.forEachCell(cell => {
+                cellTexts.push(cell.textContent);
+              });
+            }
+            const textContent = cellTexts.filter(Boolean).join(' ');
+            return {
+              textLength: textContent.length,
+              textContent
+            };
+          }
           const {
             from,
             to

package/dist/es2019/editor-commands/move-node.js

@@ -5,7 +5,7 @@ import { expandSelectionBounds, GapCursorSelection } from '@atlaskit/editor-comm
 import { transformSliceNestedExpandToExpand } from '@atlaskit/editor-common/transforms';
 import { DIRECTION } from '@atlaskit/editor-common/types';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
-import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
+import { isNodeTypeValidChildOf, getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection, Selection } from '@atlaskit/editor-prosemirror/state';
 import { Mapping, StepMap } from '@atlaskit/editor-prosemirror/transform';
@@ -21,7 +21,7 @@ import { setCursorPositionAtMovedNode } from '../pm-plugins/utils/getSelection';
 import { removeFromSource } from '../pm-plugins/utils/remove-from-source';
 import { getSelectedSlicePosition } from '../pm-plugins/utils/selection';
 import { getInsertLayoutStep, updateSelection } from '../pm-plugins/utils/update-selection';
-import { canMoveNodeToIndex, isInsideTable, transformFragmentExpandToNestedExpand, transformSliceExpandToNestedExpand } from '../pm-plugins/utils/validation';
+import { canMoveNodeToIndex, isInsideTable, transformFragmentExpandToNestedExpand, transformSliceExpandToNestedExpand, transformSliceNodeType } from '../pm-plugins/utils/validation';
 import { getPosWhenMoveNodeDown, getPosWhenMoveNodeUp } from './utils/move-node-utils';
 
 /**
@@ -43,12 +43,23 @@ function transformSourceSlice(nodeCopy, destType) {
   const destTypeInTable = isInsideTable(destType);
   const destTypeInDocOrLayoutCol = [doc, layoutColumn].includes(destType);
 
-  // No need to loop over slice content if destination requires no transformations
-  if (!destTypeInTable && !destTypeInDocOrLayoutCol) {
+  // Only run transformation loop if destination may need node conversions:
+  // - Table destinations may need expand → nestedExpand
+  // - Doc/layoutColumn destinations may need nestedExpand → expand
+  // - When panel_c1 experiment is on:
+  // - Expand/table/bodied extension destinations may need panel_c1 → panel downgrade
+  // - Doc/layoutColumn destinations may need panel → panel_c1 upgrade
+  const needsTransformCheck = destTypeInTable || destTypeInDocOrLayoutCol || expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true);
+  if (!needsTransformCheck) {
     return nodeCopy;
   }
   let containsExpand = false;
   let containsNestedExpand = false;
+  // Track variant nodes (e.g. panel_c1) and their base forms (e.g. panel).
+  // Uses getBaseNodeTypeName to auto-detect variants — new variants only need
+  // to be added to variantToBaseNameMap, no changes needed in the detection loop.
+  let variantType = null;
+  let baseOfVariantType = null;
   for (let i = 0; i < nodeCopy.content.childCount; i++) {
     const node = nodeCopy.content.child(i);
     if (node.type === schema.nodes.expand) {
@@ -56,7 +67,15 @@ function transformSourceSlice(nodeCopy, destType) {
     } else if (node.type === schema.nodes.nestedExpand) {
       containsNestedExpand = true;
     }
-    if (containsExpand && containsNestedExpand) {
+    if (expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true)) {
+      const baseName = getBaseNodeTypeName(node.type);
+      if (baseName !== node.type.name) {
+        variantType = node.type.name;
+      } else if (schema.nodes[`${baseName}_c1`]) {
+        baseOfVariantType = node.type.name;
+      }
+    }
+    if (containsExpand && containsNestedExpand && (variantType || baseOfVariantType)) {
       break;
     }
   }
@@ -65,6 +84,26 @@ function transformSourceSlice(nodeCopy, destType) {
   } else if (containsNestedExpand && destTypeInDocOrLayoutCol) {
     return transformSliceNestedExpandToExpand(nodeCopy, schema);
   }
+
+  // Downgrade variant → base (e.g. panel_c1 → panel) when dest doesn't support the variant
+  if (variantType && schema.nodes[variantType]) {
+    const destParent = destType.createAndFill();
+    if (destParent && !isNodeTypeValidChildOf(variantType, destParent, schema)) {
+      const baseName = getBaseNodeTypeName(schema.nodes[variantType]);
+      return transformSliceNodeType(nodeCopy, schema, variantType, baseName);
+    }
+  }
+
+  // Upgrade base → variant (e.g. panel → panel_c1) when dest supports the variant
+  if (baseOfVariantType) {
+    const variantName = `${baseOfVariantType}_c1`;
+    if (schema.nodes[variantName]) {
+      const destParent = destType.createAndFill();
+      if (destParent && isNodeTypeValidChildOf(variantName, destParent, schema)) {
+        return transformSliceNodeType(nodeCopy, schema, baseOfVariantType, variantName);
+      }
+    }
+  }
   return nodeCopy;
 }
 const nodesSupportDragLayoutColumnInto = ['tableCell', 'tableHeader', 'panel', 'expand', 'nestedExpand'];

package/dist/es2019/pm-plugins/decorations-common.js

@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import ReactDOM from 'react-dom';
 // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 import uuid from 'uuid';
+import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { isFontSizeMarkActive } from './utils/validation';
 export const TYPE_DROP_TARGET_DEC = 'drop-target-decoration';
@@ -23,7 +24,8 @@ const getSubType = node => {
 };
 export const getNodeTypeWithLevel = node => {
   const subType = expValEquals('platform_editor_small_font_size', 'isEnabled', true) ? getSubType(node) : node.attrs.level ? `-${node.attrs.level}` : '';
-  return node.type.name + subType;
+  const typeName = expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? getBaseNodeTypeName(node.type) : node.type.name;
+  return typeName + subType;
 };
 class ObjHash {
   static getForNode(node) {

package/dist/es2019/pm-plugins/decorations-drop-target-active.js

@@ -1,6 +1,7 @@
 import memoizeOne from 'memoize-one';
 import { expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
+import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { findChildrenByType } from '@atlaskit/editor-prosemirror/utils';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
@@ -24,7 +25,8 @@ const NODE_WITH_NO_PARENT_POS = ['tableCell', 'tableHeader', 'layoutColumn'];
 const UNSUPPORTED_LAYOUT_CONTENT = ['syncBlock', 'bodiedSyncBlock'];
 const getContainerNodeTypes = memoizeOne(() => [...PARENT_WITH_END_DROP_TARGET, ...(fg('confluence_frontend_native_tabs_extension') ? ['multiBodiedExtension'] : []), ...(editorExperiment('platform_synced_block', true) ? ['bodiedSyncBlock'] : [])]);
 const isContainerNode = node => {
-  return getContainerNodeTypes().includes(node.type.name);
+  const nodeName = expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? getBaseNodeTypeName(node.type) : node.type.name;
+  return getContainerNodeTypes().includes(nodeName);
 };
 export const canMoveNodeOrSliceToPos = (state, node, parent, index, $toPos, activeNode) => {
   // For deciding to show drop targets or not when multiple nodes are selected

package/dist/es2019/pm-plugins/utils/validation.js

@@ -1,5 +1,6 @@
 import memoizeOne from 'memoize-one';
 import { getParentOfTypeCount, isNestedTablesSupported } from '@atlaskit/editor-common/nesting';
+import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { findChildrenByType } from '@atlaskit/editor-prosemirror/utils';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
@@ -69,6 +70,41 @@ export const transformFragmentExpandToNestedExpand = fragment => {
   }
   return Fragment.fromArray(children);
 };
+
+/**
+ * Generic fragment transformer — converts all nodes of `fromType` to `toType`,
+ * preserving attrs, content, and marks.
+ */
+export const transformFragmentNodeType = (fragment, schema, fromType, toType) => {
+  const children = [];
+  const targetType = schema.nodes[toType];
+  if (!targetType) {
+    return null;
+  }
+  try {
+    fragment.forEach(node => {
+      if (node.type.name === fromType) {
+        children.push(targetType.create(node.attrs, node.content, node.marks));
+      } else {
+        children.push(node);
+      }
+    });
+  } catch (e) {
+    return null;
+  }
+  return Fragment.fromArray(children);
+};
+
+/**
+ * Generic slice transformer — converts all nodes of `fromType` to `toType`.
+ */
+export const transformSliceNodeType = (slice, schema, fromType, toType) => {
+  const fragment = transformFragmentNodeType(slice.content, schema, fromType, toType);
+  if (!fragment) {
+    return null;
+  }
+  return new Slice(fragment, slice.openStart, slice.openEnd);
+};
 export const transformSliceExpandToNestedExpand = slice => {
   const fragment = transformFragmentExpandToNestedExpand(slice.content);
   if (!fragment) {
@@ -152,6 +188,19 @@ export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNo
   } else if ((isDoc(destParent.type) || isLayoutColumn(destParent.type)) && isNestedExpand(srcNodeType)) {
     srcNodeType = expand;
   }
+
+  // Downgrade variant node (e.g. panel_c1 → panel) when dest doesn't support it
+  if (expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true)) {
+    const baseName = getBaseNodeTypeName(srcNodeType);
+    if (baseName !== srcNodeType.name && !destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType)) {
+      const baseType = schema.nodes[baseName];
+      // Check if the node's content is valid in the base type (e.g. panel with table can't be downgraded)
+      if (!baseType || !baseType.validContent(srcNode.content)) {
+        return false;
+      }
+      srcNodeType = baseType;
+    }
+  }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }
 export function canMoveSliceToIndex(slice, sliceFromPos, sliceToPos, destParent, indexIntoParent, $destNodePos, destNode) {

package/dist/es2019/ui/drag-handle.js

@@ -73,6 +73,37 @@ const buttonWrapperStyles = css({
     boxSizing: 'border-box'
   }
 });
+
+// EDITOR-6790 - When the `platform_editor_table_col_insert` experiment is enabled,
+// drop the linear-gradient background that paints over the legacy `tr.sticky` table
+// header so the new left-edge column-insert affordance is not visually clipped.
+// Keep all paddings / margins identical to `buttonWrapperStyles` so the drag-handle
+// layout does not shift between the two variants.
+const buttonWrapperStylesNoBackground = css({
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-blocks-drag-handle-container]:has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls tr.sticky) &': {
+    marginBottom: "var(--ds-space-negative-200, -16px)",
+    paddingBottom: "var(--ds-space-200, 16px)",
+    marginTop: "var(--ds-space-negative-400, -32px)",
+    paddingTop: `calc(${"var(--ds-space-400, 32px)"} - 1px)`,
+    marginRight: "var(--ds-space-negative-150, -12px)",
+    paddingRight: "var(--ds-space-150, 12px)",
+    boxSizing: 'border-box'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-prosemirror-mark-name="breakout"]:has([data-blocks-drag-handle-container]):has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls tr.sticky) &': {
+    marginBottom: "var(--ds-space-negative-200, -16px)",
+    paddingBottom: "var(--ds-space-200, 16px)",
+    marginTop: "var(--ds-space-negative-400, -32px)",
+    paddingTop: `calc(${"var(--ds-space-400, 32px)"} - 1px)`,
+    marginRight: "var(--ds-space-negative-150, -12px)",
+    paddingRight: "var(--ds-space-150, 12px)",
+    boxSizing: 'border-box'
+  }
+});
 const buttonWrapperStylesPatch = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
   '[data-blocks-drag-handle-container]:has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls [data-number-column="true"] tr.sticky) &': {
@@ -1071,7 +1102,10 @@ export const DragHandle = ({
       });
     }
   }, jsx("span", {
-    css: [shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && buttonWrapperStyles, buttonWrapperStylesPatch]
+    css: [shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && (
+    // EDITOR-6790 - drop the masking background under the new
+    // column-insert experiment so the left-edge dot is not clipped.
+    expValEquals('platform_editor_table_col_insert', 'isEnabled', true) ? buttonWrapperStylesNoBackground : buttonWrapperStyles), buttonWrapperStylesPatch]
   }, renderButton()))));
   const stickyWithoutTooltip = () => jsx(Box
   // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
@@ -1085,7 +1119,10 @@ export const DragHandle = ({
   }, jsx("span", {
     css: [tooltipContainerStyles, shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && tooltipContainerStylesStickyHeaderWithMask, !shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && tooltipContainerStylesStickyHeaderWithoutMask]
   }, jsx("span", {
-    css: [shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && buttonWrapperStyles, buttonWrapperStylesPatch]
+    css: [shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && (
+    // EDITOR-6790 - drop the masking background under the new
+    // column-insert experiment so the left-edge dot is not clipped.
+    expValEquals('platform_editor_table_col_insert', 'isEnabled', true) ? buttonWrapperStylesNoBackground : buttonWrapperStyles), buttonWrapperStylesPatch]
   }, renderButton())));
   const buttonWithTooltip = () => jsx(Tooltip, {
     content: tooltipContent,

package/dist/es2019/ui/drop-target.js

@@ -7,6 +7,7 @@ import { Fragment, useEffect, useMemo, useRef, useState } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { DropIndicator } from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';
 import { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { layers } from '@atlaskit/theme/constants';
@@ -222,7 +223,7 @@ export const DropTarget = props => {
   const dynamicStyle = {
     width: isNestedDropTarget ? 'unset' : '100%',
     [EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH]: isNestedDropTarget ? '100%' : `${lineLength || DEFAULT_DROP_INDICATOR_WIDTH}px`,
-    [EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN]: isNestedDropTarget ? getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0',
+    [EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN]: isNestedDropTarget ? expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) && parentNode !== null && parentNode !== void 0 && parentNode.type ? getNestedNodeLeftPaddingMargin(getBaseNodeTypeName(parentNode.type)) : getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0',
     [EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX]: layers.navigation()
   };
   const isShowInlineDropTarget = shouldAllowInlineDropTarget(isNestedDropTarget, nextNode, isSameLayout, activeNode, parentNode);

package/dist/esm/blockControlsPlugin.js

@@ -5,7 +5,9 @@ import React from 'react';
 import { expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { areToolbarFlagsEnabled } from '@atlaskit/editor-common/toolbar-flag-check';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { handleKeyDownWithPreservedSelection } from './editor-commands/handle-key-down-with-preserved-selection';
 import { mapPreservedSelection as _mapPreservedSelection } from './editor-commands/map-preserved-selection';
@@ -37,6 +39,27 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
         var blockControlsState = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState();
         var preservedSelection = blockControlsState === null || blockControlsState === void 0 ? void 0 : blockControlsState.preservedSelection;
         if (preservedSelection && preservedSelection.from !== preservedSelection.to) {
+          // CellSelection covers a table: collect each selected cell's text joined with spaces
+          // so that adjacent cells are not fused (e.g. 'hello world' + 'foo' must not
+          // become 'hello worldfoo'). Intl.Segmenter word-counting requires correct
+          // word boundaries, which raw textContent fusion breaks.
+          if (preservedSelection instanceof CellSelection && expValEquals('remix_iw_block_menu_table_calc_fix', 'isEnabled', true)) {
+            // Use node(1) to reliably target the table node regardless of $anchorCell depth.
+            // node(-1) would return tableRow if $anchorCell is at tableCell depth.
+            var tableNode = preservedSelection.$anchorCell.node(1);
+            var cellTexts = [];
+            if (tableNode) {
+              // forEachCell iterates only the selected cells, not all cells in the table.
+              preservedSelection.forEachCell(function (cell) {
+                cellTexts.push(cell.textContent);
+              });
+            }
+            var _textContent = cellTexts.filter(Boolean).join(' ');
+            return {
+              textLength: _textContent.length,
+              textContent: _textContent
+            };
+          }
           var from = preservedSelection.from,
             to = preservedSelection.to;
           var textContent = editorView.state.doc.textBetween(from, to, '\n');

package/dist/esm/editor-commands/move-node.js

@@ -8,7 +8,7 @@ import { expandSelectionBounds, GapCursorSelection } from '@atlaskit/editor-comm
 import { transformSliceNestedExpandToExpand } from '@atlaskit/editor-common/transforms';
 import { DIRECTION } from '@atlaskit/editor-common/types';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
-import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
+import { isNodeTypeValidChildOf, getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection, Selection } from '@atlaskit/editor-prosemirror/state';
 import { Mapping, StepMap } from '@atlaskit/editor-prosemirror/transform';
@@ -24,7 +24,7 @@ import { setCursorPositionAtMovedNode } from '../pm-plugins/utils/getSelection';
 import { removeFromSource } from '../pm-plugins/utils/remove-from-source';
 import { getSelectedSlicePosition } from '../pm-plugins/utils/selection';
 import { getInsertLayoutStep, updateSelection } from '../pm-plugins/utils/update-selection';
-import { canMoveNodeToIndex, isInsideTable, transformFragmentExpandToNestedExpand, transformSliceExpandToNestedExpand } from '../pm-plugins/utils/validation';
+import { canMoveNodeToIndex, isInsideTable, transformFragmentExpandToNestedExpand, transformSliceExpandToNestedExpand, transformSliceNodeType } from '../pm-plugins/utils/validation';
 import { getPosWhenMoveNodeDown, getPosWhenMoveNodeUp } from './utils/move-node-utils';
 
 /**
@@ -45,12 +45,23 @@ function transformSourceSlice(nodeCopy, destType) {
   var destTypeInTable = isInsideTable(destType);
   var destTypeInDocOrLayoutCol = [doc, layoutColumn].includes(destType);
 
-  // No need to loop over slice content if destination requires no transformations
-  if (!destTypeInTable && !destTypeInDocOrLayoutCol) {
+  // Only run transformation loop if destination may need node conversions:
+  // - Table destinations may need expand → nestedExpand
+  // - Doc/layoutColumn destinations may need nestedExpand → expand
+  // - When panel_c1 experiment is on:
+  // - Expand/table/bodied extension destinations may need panel_c1 → panel downgrade
+  // - Doc/layoutColumn destinations may need panel → panel_c1 upgrade
+  var needsTransformCheck = destTypeInTable || destTypeInDocOrLayoutCol || expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true);
+  if (!needsTransformCheck) {
     return nodeCopy;
   }
   var containsExpand = false;
   var containsNestedExpand = false;
+  // Track variant nodes (e.g. panel_c1) and their base forms (e.g. panel).
+  // Uses getBaseNodeTypeName to auto-detect variants — new variants only need
+  // to be added to variantToBaseNameMap, no changes needed in the detection loop.
+  var variantType = null;
+  var baseOfVariantType = null;
   for (var i = 0; i < nodeCopy.content.childCount; i++) {
     var node = nodeCopy.content.child(i);
     if (node.type === schema.nodes.expand) {
@@ -58,7 +69,15 @@ function transformSourceSlice(nodeCopy, destType) {
     } else if (node.type === schema.nodes.nestedExpand) {
       containsNestedExpand = true;
     }
-    if (containsExpand && containsNestedExpand) {
+    if (expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true)) {
+      var baseName = getBaseNodeTypeName(node.type);
+      if (baseName !== node.type.name) {
+        variantType = node.type.name;
+      } else if (schema.nodes["".concat(baseName, "_c1")]) {
+        baseOfVariantType = node.type.name;
+      }
+    }
+    if (containsExpand && containsNestedExpand && (variantType || baseOfVariantType)) {
       break;
     }
   }
@@ -67,6 +86,26 @@ function transformSourceSlice(nodeCopy, destType) {
   } else if (containsNestedExpand && destTypeInDocOrLayoutCol) {
     return transformSliceNestedExpandToExpand(nodeCopy, schema);
   }
+
+  // Downgrade variant → base (e.g. panel_c1 → panel) when dest doesn't support the variant
+  if (variantType && schema.nodes[variantType]) {
+    var destParent = destType.createAndFill();
+    if (destParent && !isNodeTypeValidChildOf(variantType, destParent, schema)) {
+      var _baseName = getBaseNodeTypeName(schema.nodes[variantType]);
+      return transformSliceNodeType(nodeCopy, schema, variantType, _baseName);
+    }
+  }
+
+  // Upgrade base → variant (e.g. panel → panel_c1) when dest supports the variant
+  if (baseOfVariantType) {
+    var variantName = "".concat(baseOfVariantType, "_c1");
+    if (schema.nodes[variantName]) {
+      var _destParent = destType.createAndFill();
+      if (_destParent && isNodeTypeValidChildOf(variantName, _destParent, schema)) {
+        return transformSliceNodeType(nodeCopy, schema, baseOfVariantType, variantName);
+      }
+    }
+  }
   return nodeCopy;
 }
 var nodesSupportDragLayoutColumnInto = ['tableCell', 'tableHeader', 'panel', 'expand', 'nestedExpand'];

package/dist/esm/pm-plugins/decorations-common.js

@@ -4,6 +4,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import ReactDOM from 'react-dom';
 // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 import uuid from 'uuid';
+import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { isFontSizeMarkActive } from './utils/validation';
 export var TYPE_DROP_TARGET_DEC = 'drop-target-decoration';
@@ -25,7 +26,8 @@ var getSubType = function getSubType(node) {
 };
 export var getNodeTypeWithLevel = function getNodeTypeWithLevel(node) {
   var subType = expValEquals('platform_editor_small_font_size', 'isEnabled', true) ? getSubType(node) : node.attrs.level ? "-".concat(node.attrs.level) : '';
-  return node.type.name + subType;
+  var typeName = expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? getBaseNodeTypeName(node.type) : node.type.name;
+  return typeName + subType;
 };
 var ObjHash = /*#__PURE__*/function () {
   function ObjHash() {

package/dist/esm/pm-plugins/decorations-drop-target-active.js

@@ -2,6 +2,7 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import memoizeOne from 'memoize-one';
 import { expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
+import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { findChildrenByType } from '@atlaskit/editor-prosemirror/utils';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
@@ -27,7 +28,8 @@ var getContainerNodeTypes = memoizeOne(function () {
   return [].concat(PARENT_WITH_END_DROP_TARGET, _toConsumableArray(fg('confluence_frontend_native_tabs_extension') ? ['multiBodiedExtension'] : []), _toConsumableArray(editorExperiment('platform_synced_block', true) ? ['bodiedSyncBlock'] : []));
 });
 var isContainerNode = function isContainerNode(node) {
-  return getContainerNodeTypes().includes(node.type.name);
+  var nodeName = expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) ? getBaseNodeTypeName(node.type) : node.type.name;
+  return getContainerNodeTypes().includes(nodeName);
 };
 export var canMoveNodeOrSliceToPos = function canMoveNodeOrSliceToPos(state, node, parent, index, $toPos, activeNode) {
   // For deciding to show drop targets or not when multiple nodes are selected

package/dist/esm/pm-plugins/utils/validation.js

@@ -1,5 +1,6 @@
 import memoizeOne from 'memoize-one';
 import { getParentOfTypeCount, isNestedTablesSupported } from '@atlaskit/editor-common/nesting';
+import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { findChildrenByType } from '@atlaskit/editor-prosemirror/utils';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
@@ -69,6 +70,41 @@ export var transformFragmentExpandToNestedExpand = function transformFragmentExp
   }
   return Fragment.fromArray(children);
 };
+
+/**
+ * Generic fragment transformer — converts all nodes of `fromType` to `toType`,
+ * preserving attrs, content, and marks.
+ */
+export var transformFragmentNodeType = function transformFragmentNodeType(fragment, schema, fromType, toType) {
+  var children = [];
+  var targetType = schema.nodes[toType];
+  if (!targetType) {
+    return null;
+  }
+  try {
+    fragment.forEach(function (node) {
+      if (node.type.name === fromType) {
+        children.push(targetType.create(node.attrs, node.content, node.marks));
+      } else {
+        children.push(node);
+      }
+    });
+  } catch (e) {
+    return null;
+  }
+  return Fragment.fromArray(children);
+};
+
+/**
+ * Generic slice transformer — converts all nodes of `fromType` to `toType`.
+ */
+export var transformSliceNodeType = function transformSliceNodeType(slice, schema, fromType, toType) {
+  var fragment = transformFragmentNodeType(slice.content, schema, fromType, toType);
+  if (!fragment) {
+    return null;
+  }
+  return new Slice(fragment, slice.openStart, slice.openEnd);
+};
 export var transformSliceExpandToNestedExpand = function transformSliceExpandToNestedExpand(slice) {
   var fragment = transformFragmentExpandToNestedExpand(slice.content);
   if (!fragment) {
@@ -153,6 +189,19 @@ export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNo
   } else if ((isDoc(destParent.type) || isLayoutColumn(destParent.type)) && isNestedExpand(srcNodeType)) {
     srcNodeType = expand;
   }
+
+  // Downgrade variant node (e.g. panel_c1 → panel) when dest doesn't support it
+  if (expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true)) {
+    var baseName = getBaseNodeTypeName(srcNodeType);
+    if (baseName !== srcNodeType.name && !destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType)) {
+      var baseType = schema.nodes[baseName];
+      // Check if the node's content is valid in the base type (e.g. panel with table can't be downgraded)
+      if (!baseType || !baseType.validContent(srcNode.content)) {
+        return false;
+      }
+      srcNodeType = baseType;
+    }
+  }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }
 export function canMoveSliceToIndex(slice, sliceFromPos, sliceToPos, destParent, indexIntoParent, $destNodePos, destNode) {

package/dist/esm/ui/drag-handle.js

@@ -78,6 +78,37 @@ var buttonWrapperStyles = css({
     boxSizing: 'border-box'
   }
 });
+
+// EDITOR-6790 - When the `platform_editor_table_col_insert` experiment is enabled,
+// drop the linear-gradient background that paints over the legacy `tr.sticky` table
+// header so the new left-edge column-insert affordance is not visually clipped.
+// Keep all paddings / margins identical to `buttonWrapperStyles` so the drag-handle
+// layout does not shift between the two variants.
+var buttonWrapperStylesNoBackground = css({
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-blocks-drag-handle-container]:has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls tr.sticky) &': {
+    marginBottom: "var(--ds-space-negative-200, -16px)",
+    paddingBottom: "var(--ds-space-200, 16px)",
+    marginTop: "var(--ds-space-negative-400, -32px)",
+    paddingTop: "calc(".concat("var(--ds-space-400, 32px)", " - 1px)"),
+    marginRight: "var(--ds-space-negative-150, -12px)",
+    paddingRight: "var(--ds-space-150, 12px)",
+    boxSizing: 'border-box'
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
+  '[data-prosemirror-mark-name="breakout"]:has([data-blocks-drag-handle-container]):has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls tr.sticky) &': {
+    marginBottom: "var(--ds-space-negative-200, -16px)",
+    paddingBottom: "var(--ds-space-200, 16px)",
+    marginTop: "var(--ds-space-negative-400, -32px)",
+    paddingTop: "calc(".concat("var(--ds-space-400, 32px)", " - 1px)"),
+    marginRight: "var(--ds-space-negative-150, -12px)",
+    paddingRight: "var(--ds-space-150, 12px)",
+    boxSizing: 'border-box'
+  }
+});
 var buttonWrapperStylesPatch = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
   '[data-blocks-drag-handle-container]:has(+ [data-prosemirror-node-name="table"] .pm-table-with-controls [data-number-column="true"] tr.sticky) &': {
@@ -1088,7 +1119,10 @@ export var DragHandle = function DragHandle(_ref) {
         });
       }
     }, jsx("span", {
-      css: [shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && buttonWrapperStyles, buttonWrapperStylesPatch]
+      css: [shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && (
+      // EDITOR-6790 - drop the masking background under the new
+      // column-insert experiment so the left-edge dot is not clipped.
+      expValEquals('platform_editor_table_col_insert', 'isEnabled', true) ? buttonWrapperStylesNoBackground : buttonWrapperStyles), buttonWrapperStylesPatch]
     }, renderButton()))));
   };
   var stickyWithoutTooltip = function stickyWithoutTooltip() {
@@ -1104,7 +1138,10 @@ export var DragHandle = function DragHandle(_ref) {
     }, jsx("span", {
       css: [tooltipContainerStyles, shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && tooltipContainerStylesStickyHeaderWithMask, !shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && tooltipContainerStylesStickyHeaderWithoutMask]
     }, jsx("span", {
-      css: [shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && buttonWrapperStyles, buttonWrapperStylesPatch]
+      css: [shouldMaskNodeControls(nodeType, isTopLevelNodeValue) && (
+      // EDITOR-6790 - drop the masking background under the new
+      // column-insert experiment so the left-edge dot is not clipped.
+      expValEquals('platform_editor_table_col_insert', 'isEnabled', true) ? buttonWrapperStylesNoBackground : buttonWrapperStyles), buttonWrapperStylesPatch]
     }, renderButton())));
   };
   var buttonWithTooltip = function buttonWithTooltip() {

package/dist/esm/ui/drop-target.js

@@ -9,6 +9,7 @@ import { Fragment, useEffect, useMemo, useRef, useState } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { getBaseNodeTypeName } from '@atlaskit/editor-common/utils/node-type-utils';
 import { DropIndicator } from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';
 import { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { layers } from '@atlaskit/theme/constants';
@@ -223,7 +224,7 @@ export var DropTarget = function DropTarget(props) {
   };
   var dynamicStyle = _defineProperty(_defineProperty(_defineProperty({
     width: isNestedDropTarget ? 'unset' : '100%'
-  }, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat(lineLength || DEFAULT_DROP_INDICATOR_WIDTH, "px")), EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, layers.navigation());
+  }, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat(lineLength || DEFAULT_DROP_INDICATOR_WIDTH, "px")), EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? expValEquals('platform_editor_nest_table_in_panel', 'isEnabled', true) && parentNode !== null && parentNode !== void 0 && parentNode.type ? getNestedNodeLeftPaddingMargin(getBaseNodeTypeName(parentNode.type)) : getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, layers.navigation());
   var isShowInlineDropTarget = shouldAllowInlineDropTarget(isNestedDropTarget, nextNode, isSameLayout, activeNode, parentNode);
   return jsx(Fragment, null, jsx(HoverZone
   // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)

package/dist/types/pm-plugins/utils/validation.d.ts

@@ -1,6 +1,5 @@
 import type { MemoizedFn } from 'memoize-one';
-import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
-import type { NodeType, Node as PMNode, ResolvedPos } from '@atlaskit/editor-prosemirror/model';
+import { Fragment, Slice, type Schema, type NodeType, type Node as PMNode, type ResolvedPos } from '@atlaskit/editor-prosemirror/model';
 export declare const isInsideTable: (nodeType: NodeType) => Boolean;
 export declare const isLayoutColumn: (nodeType: NodeType) => Boolean;
 export declare const isDoc: (nodeType: NodeType) => Boolean;
@@ -17,6 +16,15 @@ export declare const isInSameLayout: ($from: ResolvedPos, $to: ResolvedPos) => b
  */
 export declare const transformExpandToNestedExpand: (expandNode: PMNode) => PMNode | null;
 export declare const transformFragmentExpandToNestedExpand: (fragment: Fragment) => Fragment | null;
+/**
+ * Generic fragment transformer — converts all nodes of `fromType` to `toType`,
+ * preserving attrs, content, and marks.
+ */
+export declare const transformFragmentNodeType: (fragment: Fragment, schema: Schema, fromType: string, toType: string) => Fragment | null;
+/**
+ * Generic slice transformer — converts all nodes of `fromType` to `toType`.
+ */
+export declare const transformSliceNodeType: (slice: Slice, schema: Schema, fromType: string, toType: string) => Slice | null;
 export declare const transformSliceExpandToNestedExpand: (slice: Slice) => Slice | null;
 export declare const memoizedTransformExpandToNestedExpand: MemoizedFn<(node: PMNode) => PMNode | null>;
 export declare const canCreateNodeWithContentInsideAnotherNode: (nodeTypesToCreate: NodeType[], nodeWithTargetFragment: Fragment) => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "13.0.4",
+	"version": "13.0.6",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -21,7 +21,7 @@
 	"atlaskit:src": "src/index.ts",
 	"dependencies": {
 		"@atlaskit/browser-apis": "^1.0.0",
-		"@atlaskit/button": "^24.0.0",
+		"@atlaskit/button": "^24.1.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^12.0.0",
 		"@atlaskit/editor-plugin-analytics": "^12.0.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^12.0.0",
@@ -48,7 +48,7 @@
 		"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^4.0.0",
 		"@atlaskit/primitives": "^20.0.0",
 		"@atlaskit/theme": "^26.0.0",
-		"@atlaskit/tmp-editor-statsig": "^108.0.0",
+		"@atlaskit/tmp-editor-statsig": "^109.1.0",
 		"@atlaskit/tokens": "^14.0.0",
 		"@atlaskit/tooltip": "^23.0.0",
 		"@babel/runtime": "^7.0.0",
@@ -59,7 +59,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^116.3.0",
+		"@atlaskit/editor-common": "^116.8.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"