@atlaskit/editor-plugin-block-controls 3.3.12 → 3.3.14

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 3.3.14
+
+### Patch Changes
+
+- Updated dependencies
+
+## 3.3.13
+
+### Patch Changes
+
+- [#126772](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/126772)
+  [`c64847bdf13d4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c64847bdf13d4) -
+  [ED-27001] This change is cleaning up the feature gate for a drag and drop bugfix to update the
+  drag preview for extensions with iFrames.
+- Updated dependencies
+
 ## 3.3.12
 
 ### Patch Changes

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

@@ -88,6 +88,10 @@ var isDragLayoutColumnToTopLevel = function isDragLayoutColumnToTopLevel($from,
   var _$from$nodeAfter;
   return ((_$from$nodeAfter = $from.nodeAfter) === null || _$from$nodeAfter === void 0 ? void 0 : _$from$nodeAfter.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && $to.depth === 0;
 };
+var isDragLayoutColumnIntoTable = function isDragLayoutColumnIntoTable($from, $to) {
+  var _$from$nodeAfter2;
+  return ((_$from$nodeAfter2 = $from.nodeAfter) === null || _$from$nodeAfter2 === void 0 ? void 0 : _$from$nodeAfter2.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && ($to.parent.type.name === 'tableCell' || $to.parent.type.name === 'tableHeader');
+};
 
 /**
  *
@@ -376,12 +380,25 @@ var moveNode = exports.moveNode = function moveNode(api) {
         var destType = $to.node().type;
         var destParent = $to.node($to.depth);
         var sourceNode = $handlePos.nodeAfter;
+        var dragLayoutColumnToTopLevel = isDragLayoutColumnToTopLevel($handlePos, $to);
+        var dragLayoutColumnIntoTable = isDragLayoutColumnIntoTable($handlePos, $to);
 
         //TODO: ED-26959 - Does this need to be updated with new selection logic above? ^
         // Move a layout column to top level
-        if (sourceNode && isDragLayoutColumnToTopLevel($handlePos, $to)) {
+        // Move a layout column into a table cell, only moves the content into the cell
+        if (sourceNode && (dragLayoutColumnToTopLevel || dragLayoutColumnIntoTable)) {
           // need update after we support single column layout.
-          var fragment = _model.Fragment.from(sourceNode.content);
+          var layoutColumnContent = sourceNode.content;
+          var fragment;
+          if (dragLayoutColumnIntoTable) {
+            var contentContainsExpand = (0, _utils2.findChildrenByType)(sourceNode, expand).length > 0;
+            fragment = contentContainsExpand ? (0, _validation.transformFragmentExpandToNestedExpand)(_model.Fragment.from(layoutColumnContent)) : _model.Fragment.from(layoutColumnContent);
+            if (!fragment) {
+              return tr;
+            }
+          } else {
+            fragment = _model.Fragment.from(layoutColumnContent);
+          }
           (0, _removeFromSource.removeFromSource)(tr, $handlePos, $handlePos.pos + sourceNode.nodeSize);
           var _mappedTo = tr.mapping.map(to);
           tr.insert(_mappedTo, fragment).setSelection(_state.Selection.near(tr.doc.resolve(_mappedTo))).scrollIntoView();

package/dist/cjs/editor-commands/move-to-layout.js

@@ -15,7 +15,6 @@ var _checkFragment = require("../pm-plugins/utils/check-fragment");
 var _consts = require("../pm-plugins/utils/consts");
 var _removeFromSource = require("../pm-plugins/utils/remove-from-source");
 var _selection = require("../pm-plugins/utils/selection");
-var _updateColumnWidths = require("../pm-plugins/utils/update-column-widths");
 var _validation = require("../pm-plugins/utils/validation");
 var _consts2 = require("../ui/consts");
 var createNewLayout = function createNewLayout(schema, layoutContents) {
@@ -70,20 +69,14 @@ var moveToExistingLayout = function moveToExistingLayout(toLayout, toLayoutPos,
     tr.delete(from, sourceContentEndPos);
     var mappedTo = tr.mapping.map(to);
     tr.insert(mappedTo, sourceContent);
-    if (!(0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1') || selectMovedNode) {
+    if (selectMovedNode) {
       tr.setSelection(new _state.NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
     }
     (0, _analytics2.attachMoveNodeAnalytics)(tr, _analytics.INPUT_METHOD.DRAG_AND_DROP, $originalFrom.depth, ((_$originalFrom$nodeAf = $originalFrom.nodeAfter) === null || _$originalFrom$nodeAf === void 0 ? void 0 : _$originalFrom$nodeAf.type.name) || '', 1, 'layoutSection', true, api, sourceNodeTypes, hasSelectedMultipleNodes);
   } else if (toLayout.childCount < (0, _consts.maxLayoutColumnSupported)()) {
     var _$originalFrom$nodeAf2;
-    if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-      (0, _removeFromSource.removeFromSource)(tr, tr.doc.resolve(from), sourceContentEndPos);
-      insertToDestinationNoWidthUpdate(tr, tr.mapping.map(to), sourceContent);
-    } else {
-      insertToDestination(tr, to, sourceContent, toLayout, toLayoutPos);
-      var mappedFrom = tr.mapping.map(from);
-      (0, _removeFromSource.removeFromSource)(tr, tr.doc.resolve(mappedFrom), tr.mapping.map(sourceContentEndPos));
-    }
+    (0, _removeFromSource.removeFromSource)(tr, tr.doc.resolve(from), sourceContentEndPos);
+    insertToDestinationNoWidthUpdate(tr, tr.mapping.map(to), sourceContent);
     (0, _analytics2.attachMoveNodeAnalytics)(tr, _analytics.INPUT_METHOD.DRAG_AND_DROP, $originalFrom.depth, ((_$originalFrom$nodeAf2 = $originalFrom.nodeAfter) === null || _$originalFrom$nodeAf2 === void 0 ? void 0 : _$originalFrom$nodeAf2.type.name) || '', 1, 'layoutSection', false, api, sourceNodeTypes, hasSelectedMultipleNodes);
   }
   return tr;
@@ -128,40 +121,6 @@ var insertToDestinationNoWidthUpdate = function insertToDestinationNoWidthUpdate
   }
   return tr;
 };
-var insertToDestination = function insertToDestination(tr, to, sourceContent, toLayout, toLayoutPos) {
-  var _ref3 = (0, _updateColumnWidths.updateColumnWidths)(tr, toLayout, toLayoutPos, toLayout.childCount + 1) || {},
-    newColumnWidth = _ref3.newColumnWidth;
-  var _ref4 = tr.doc.type.schema.nodes || {},
-    layoutColumn = _ref4.layoutColumn;
-  var content = null;
-  try {
-    if ((0, _experiments.editorExperiment)('platform_editor_element_drag_and_drop_multiselect', true)) {
-      if (sourceContent instanceof _model.Fragment) {
-        var _sourceContent$firstC;
-        content = layoutColumn.createChecked({
-          width: newColumnWidth
-        }, (0, _checkFragment.isFragmentOfType)(sourceContent, 'layoutColumn') ? (_sourceContent$firstC = sourceContent.firstChild) === null || _sourceContent$firstC === void 0 ? void 0 : _sourceContent$firstC.content : sourceContent);
-      }
-    } else {
-      if (sourceContent instanceof _model.Node) {
-        content = layoutColumn.createChecked({
-          width: newColumnWidth
-        }, sourceContent.type.name === 'layoutColumn' ? sourceContent.content : sourceContent);
-      }
-    }
-  } catch (error) {
-    (0, _monitoring.logException)(error, {
-      location: 'editor-plugin-block-controls/move-to-layout'
-    });
-  }
-  if (content) {
-    tr.insert(to, content);
-  }
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-    tr.setSelection(new _state.NodeSelection(tr.doc.resolve(to))).scrollIntoView();
-  }
-  return tr;
-};
 
 /**
  * Check if the node at `from` can be moved to node at `to` to create/expand a layout.
@@ -171,10 +130,10 @@ var canMoveToLayout = function canMoveToLayout(api, from, to, tr, moveNodeAtCurs
   if (from === to) {
     return;
   }
-  var _ref5 = tr.doc.type.schema.nodes || {},
-    layoutSection = _ref5.layoutSection,
-    layoutColumn = _ref5.layoutColumn,
-    doc = _ref5.doc;
+  var _ref3 = tr.doc.type.schema.nodes || {},
+    layoutSection = _ref3.layoutSection,
+    layoutColumn = _ref3.layoutColumn,
+    doc = _ref3.doc;
 
   // layout plugin does not exist
   if (!layoutSection || !layoutColumn) {
@@ -224,8 +183,8 @@ var canMoveToLayout = function canMoveToLayout(api, from, to, tr, moveNodeAtCurs
 };
 var removeBreakoutMarks = function removeBreakoutMarks(tr, $from, to) {
   var fromContentWithoutBreakout = $from.nodeAfter;
-  var _ref6 = tr.doc.type.schema.marks || {},
-    breakout = _ref6.breakout;
+  var _ref4 = tr.doc.type.schema.marks || {},
+    breakout = _ref4.breakout;
   if ((0, _experiments.editorExperiment)('platform_editor_element_drag_and_drop_multiselect', true)) {
     tr.doc.nodesBetween($from.pos, to, function (node, pos, parent) {
       // breakout doesn't exist on nested nodes
@@ -288,8 +247,8 @@ var getBreakoutMode = function getBreakoutMode(content, breakout) {
 // source content variable that has type of `PMNode | Fragment` should be updated to `Fragment` only
 var moveToLayout = exports.moveToLayout = function moveToLayout(api) {
   return function (from, to, options) {
-    return function (_ref7) {
-      var tr = _ref7.tr;
+    return function (_ref5) {
+      var tr = _ref5.tr;
       if (!api) {
         return tr;
       }
@@ -302,11 +261,11 @@ var moveToLayout = exports.moveToLayout = function moveToLayout(api) {
         sourceContent = canMove.sourceContent,
         $sourceFrom = canMove.$sourceFrom,
         sourceTo = canMove.sourceTo;
-      var _ref8 = tr.doc.type.schema.nodes || {},
-        layoutSection = _ref8.layoutSection,
-        layoutColumn = _ref8.layoutColumn;
-      var _ref9 = tr.doc.type.schema.marks || {},
-        breakout = _ref9.breakout;
+      var _ref6 = tr.doc.type.schema.nodes || {},
+        layoutSection = _ref6.layoutSection,
+        layoutColumn = _ref6.layoutColumn;
+      var _ref7 = tr.doc.type.schema.marks || {},
+        breakout = _ref7.breakout;
 
       // get breakout mode from destination node,
       // if not found, get from source node,
@@ -364,9 +323,6 @@ var moveToLayout = exports.moveToLayout = function moveToLayout(api) {
           tr = (0, _removeFromSource.removeFromSource)(tr, $sourceFrom, sourceTo);
           var mappedTo = tr.mapping.map(to);
           tr.delete(mappedTo, mappedTo + toNodeWithoutBreakout.nodeSize).insert(mappedTo, newLayout);
-          if (!(0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-            tr.setSelection(new _state.NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
-          }
           breakoutMode && tr.setNodeMarkup(mappedTo, newLayout.type, newLayout.attrs, [breakout.create({
             mode: breakoutMode
           })]);

package/dist/cjs/pm-plugins/handle-mouse-over.js

@@ -46,7 +46,7 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
     }
     var parentElement = (_rootElement$parentEl = rootElement.parentElement) === null || _rootElement$parentEl === void 0 ? void 0 : _rootElement$parentEl.closest('[data-drag-handler-anchor-name]');
     var parentElementType = parentElement === null || parentElement === void 0 ? void 0 : parentElement.getAttribute('data-drag-handler-node-type');
-    if ((0, _experiments.editorExperiment)('advanced_layouts', true) && (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
+    if ((0, _experiments.editorExperiment)('advanced_layouts', true)) {
       // We want to exclude handles from showing for direct descendant of table nodes (i.e. nodes in cells)
       if (parentElement && (parentElementType === 'table' || parentElementType === 'tableRow') && (0, _experiments.editorExperiment)('nested-dnd', true)) {
         rootElement = parentElement;

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

@@ -642,7 +642,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
           // Currently we can only drag one node at a time
           // so we only need to check first child
           var draggable = dragging === null || dragging === void 0 ? void 0 : dragging.slice.content.firstChild;
-          if (dndDragCancelled && isMultiSelectEnabled || (draggable === null || draggable === void 0 ? void 0 : draggable.type.name) === 'layoutColumn' && (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
+          if (dndDragCancelled && isMultiSelectEnabled || (draggable === null || draggable === void 0 ? void 0 : draggable.type.name) === 'layoutColumn') {
             // we prevent native DnD for layoutColumn to prevent single column layout.
             event.preventDefault();
             return false;

package/dist/cjs/pm-plugins/utils/drag-handle-positions.js

@@ -4,24 +4,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getTopPosition = exports.getLeftPosition = void 0;
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _consts = require("../../ui/consts");
 var getTopPosition = exports.getTopPosition = function getTopPosition(dom, type) {
   if (!dom) {
     return 'auto';
   }
   var table = dom.querySelector('table');
-  var isTable = (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1') ? table && (!type || type === 'table') : table;
+  var isTable = table && (!type || type === 'table');
   if (isTable) {
     return "".concat(dom.offsetTop + ((table === null || table === void 0 ? void 0 : table.offsetTop) || 0), "px");
   } else if (type === 'rule') {
     return "".concat(dom.offsetTop - _consts.DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT, "px");
   } else if (type === 'layoutColumn') {
-    if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-      return "".concat(-dom.offsetTop / 2, "px");
-    } else {
-      return "".concat(-_consts.DRAG_HANDLE_WIDTH, "px");
-    }
+    return "".concat(-dom.offsetTop / 2, "px");
   } else if (type === 'heading-1') {
     return "".concat(dom.offsetTop + _consts.DRAG_HANDLE_H1_TOP_ADJUSTMENT, "px");
   } else if (type === 'heading-2') {

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

@@ -6,10 +6,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.canMoveNodeToIndex = canMoveNodeToIndex;
 exports.canMoveSliceToIndex = canMoveSliceToIndex;
-exports.transformSliceExpandToNestedExpand = exports.transformExpandToNestedExpand = exports.memoizedTransformExpandToNestedExpand = exports.isNestedExpand = exports.isLayoutColumn = exports.isInsideTable = exports.isInSameLayout = exports.isExpand = exports.isDoc = void 0;
+exports.transformSliceExpandToNestedExpand = exports.transformFragmentExpandToNestedExpand = exports.transformExpandToNestedExpand = exports.memoizedTransformExpandToNestedExpand = exports.isNestedExpand = exports.isLayoutColumn = exports.isInsideTable = exports.isInSameLayout = exports.isExpand = exports.isDoc = void 0;
 var _memoizeOne = _interopRequireDefault(require("memoize-one"));
 var _nesting = require("@atlaskit/editor-common/nesting");
 var _model = require("@atlaskit/editor-prosemirror/model");
+var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var isInsideTable = exports.isInsideTable = function isInsideTable(nodeType) {
@@ -54,10 +55,10 @@ var transformExpandToNestedExpand = exports.transformExpandToNestedExpand = func
   }
   return null;
 };
-var transformSliceExpandToNestedExpand = exports.transformSliceExpandToNestedExpand = function transformSliceExpandToNestedExpand(slice) {
+var transformFragmentExpandToNestedExpand = exports.transformFragmentExpandToNestedExpand = function transformFragmentExpandToNestedExpand(fragment) {
   var children = [];
   try {
-    slice.content.forEach(function (node) {
+    fragment.forEach(function (node) {
       if (isExpand(node.type)) {
         var nestedExpandNode = transformExpandToNestedExpand(node);
         if (nestedExpandNode) {
@@ -70,7 +71,14 @@ var transformSliceExpandToNestedExpand = exports.transformSliceExpandToNestedExp
   } catch (e) {
     return null;
   }
-  return new _model.Slice(_model.Fragment.fromArray(children), slice.openStart, slice.openEnd);
+  return _model.Fragment.fromArray(children);
+};
+var transformSliceExpandToNestedExpand = exports.transformSliceExpandToNestedExpand = function transformSliceExpandToNestedExpand(slice) {
+  var fragment = transformFragmentExpandToNestedExpand(slice.content);
+  if (!fragment) {
+    return null;
+  }
+  return new _model.Slice(fragment, slice.openStart, slice.openEnd);
 };
 var memoizedTransformExpandToNestedExpand = exports.memoizedTransformExpandToNestedExpand = (0, _memoizeOne.default)(function (node) {
   try {
@@ -83,11 +91,40 @@ function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos,
   var srcNodeType = srcNode.type;
   var parentNodeType = destParent === null || destParent === void 0 ? void 0 : destParent.type.name;
   var activeNodeType = srcNode === null || srcNode === void 0 ? void 0 : srcNode.type.name;
+  var isNestingTablesSupported = (0, _platformFeatureFlags.fg)('platform_editor_use_nested_table_pm_nodes') && (0, _experiments.editorExperiment)('nested-tables-in-tables', true, {
+    exposure: true
+  });
+  var tableNodeType = srcNode.type.schema.nodes.table;
+  var expandNodeType = srcNode.type.schema.nodes.expand;
   if (activeNodeType === 'layoutColumn' && (0, _experiments.editorExperiment)('advanced_layouts', true)) {
     // Allow drag layout column and drop into layout section
     if ((destNode === null || destNode === void 0 ? void 0 : destNode.type.name) === 'layoutSection' || parentNodeType === 'doc') {
       return true;
     }
+    if ((parentNodeType === 'tableCell' || parentNodeType === 'tableHeader') && (0, _platformFeatureFlags.fg)('platform_editor_drag_layout_column_into_nodes')) {
+      var maybeExpandNodesArray = (0, _utils.findChildrenByType)(srcNode, expandNodeType);
+      var layoutColumnContainExpand = maybeExpandNodesArray.length > 0;
+      var layoutColumnContainTable = (0, _utils.findChildrenByType)(srcNode, tableNodeType).length > 0;
+
+      // when layout column content does not contain table, allow to drop into table cell
+      if (!layoutColumnContainTable) {
+        return true;
+      }
+
+      // when layout column content contains table, but does not contain expand, allow drop into table cell if nesting tables is supported, and the nesting depth does not exceed 1
+      if (layoutColumnContainTable && !layoutColumnContainExpand) {
+        var nestingDepth = (0, _nesting.getParentOfTypeCount)(tableNodeType)($destNodePos);
+        return isNestingTablesSupported && nestingDepth <= 1;
+      }
+
+      // when layout column content contains an expand, and there is a table inside the expand, should not allow to drop into table cell
+      if (layoutColumnContainTable && layoutColumnContainExpand) {
+        var isAnyTableNestedInExpand = maybeExpandNodesArray.some(function (result) {
+          return (0, _utils.findChildrenByType)(result.node, tableNodeType).length > 0;
+        });
+        return !isAnyTableNestedInExpand;
+      }
+    }
   }
 
   // Place experiments here instead of just inside move-node.ts as it stops the drag marker from appearing.
@@ -97,16 +134,11 @@ function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos,
     }
   }
 
-  // Place experiments here instead of just inside move-node.ts as it stops the drag marker from appearing.
-  var isNestingTablesSupported = (0, _platformFeatureFlags.fg)('platform_editor_use_nested_table_pm_nodes') && (0, _experiments.editorExperiment)('nested-tables-in-tables', true, {
-    exposure: true
-  });
-
   // NOTE: this will block drop targets from showing for dragging a table into another table
   // unless nested tables are supported and the nesting depth does not exceed 1
   if ((parentNodeType === 'tableCell' || parentNodeType === 'tableHeader') && activeNodeType === 'table') {
-    var nestingDepth = (0, _nesting.getParentOfTypeCount)(srcNode === null || srcNode === void 0 ? void 0 : srcNode.type)($destNodePos);
-    if (!isNestingTablesSupported || isNestingTablesSupported && nestingDepth > 1) {
+    var _nestingDepth = (0, _nesting.getParentOfTypeCount)(tableNodeType)($destNodePos);
+    if (!isNestingTablesSupported || isNestingTablesSupported && _nestingDepth > 1) {
       return false;
     }
   }

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

@@ -239,11 +239,9 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
   // but ensures the preview is generated correctly.
   var handleMouseDown = (0, _react.useCallback)(function () {
     if ((0, _experiments.editorExperiment)('advanced_layouts', true)) {
+      var _buttonRef$current;
       // prevent native drag and drop.
-      if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-        var _buttonRef$current;
-        (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 || _buttonRef$current.focus();
-      }
+      (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 || _buttonRef$current.focus();
       if (!isLayoutColumn) {
         return undefined;
       }

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

@@ -7,31 +7,21 @@ Object.defineProperty(exports, "__esModule", {
 exports.dragPreview = void 0;
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _browser = require("@atlaskit/editor-common/browser");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
-var previewStyleNew = {
+var previewStyle = {
   borderColor: "var(--ds-border, ".concat(_colors.N30, ")"),
   borderStyle: 'solid',
   borderRadius: "var(--ds-border-radius-100, 3px)",
   borderWidth: "var(--ds-border-width-outline, 2px)",
   backgroundColor: "var(--ds-skeleton-subtle, ".concat(_colors.N20, ")")
 };
-var previewStyleOld = {
-  borderColor: "var(--ds-border-focused, ".concat(_colors.B200, ")"),
-  borderStyle: 'solid',
-  borderRadius: "var(--ds-border-radius-100, 3px)",
-  borderWidth: "var(--ds-border-width-outline, 2px)",
-  backgroundColor: "var(--ds-blanket-selected, #388BFF14)"
-};
 var getPreviewContainerDimensionsForSingle = function getPreviewContainerDimensionsForSingle(dom, nodeType) {
   var nodeContainer = dom;
-  if ((0, _platformFeatureFlags.fg)('platform_editor_elements_drag_and_drop_ed_23189')) {
-    var iframeContainer = dom.querySelector('iframe');
-    if (nodeType === 'embedCard') {
-      nodeContainer = dom.querySelector('.rich-media-item') || dom;
-    } else if (nodeType === 'extension' && iframeContainer) {
-      nodeContainer = iframeContainer;
-    }
+  var iframeContainer = dom.querySelector('iframe');
+  if (nodeType === 'embedCard') {
+    nodeContainer = dom.querySelector('.rich-media-item') || dom;
+  } else if (nodeType === 'extension' && iframeContainer) {
+    nodeContainer = iframeContainer;
   }
   var nodeContainerRect = nodeContainer.getBoundingClientRect();
   return {
@@ -61,7 +51,6 @@ var createGenericPreview = function createGenericPreview() {
   var generalPreview = document.createElement('div');
   // ProseMirror class is required to make sure the cloned dom is styled correctly
   generalPreview.classList.add('ProseMirror', 'block-ctrl-drag-preview');
-  var previewStyle = (0, _platformFeatureFlags.fg)('platform_editor_elements_drag_and_drop_ed_23189') ? previewStyleNew : previewStyleOld;
   generalPreview.style.border = "".concat(previewStyle.borderWidth, " ").concat(previewStyle.borderStyle, " ").concat(previewStyle.borderColor);
   generalPreview.style.borderRadius = previewStyle.borderRadius;
   generalPreview.style.backgroundColor = previewStyle.backgroundColor;
@@ -85,13 +74,13 @@ var createContentPreviewElement = function createContentPreviewElement(dom, node
   clonedDom.style.marginRight = '0';
   clonedDom.style.marginBottom = nodeSpacing ? "".concat(nodeSpacing.bottom) : '0';
   clonedDom.style.boxShadow = 'none';
-  clonedDom.style.opacity = _browser.browser.windows ? '1' : (0, _platformFeatureFlags.fg)('platform_editor_elements_drag_and_drop_ed_23189') ? '0.31' : '0.4';
+  clonedDom.style.opacity = _browser.browser.windows ? '1' : '0.31';
   contentPreviewOneElement.appendChild(clonedDom);
   return contentPreviewOneElement;
 };
 var isGenericPreview = function isGenericPreview(dom, nodeType) {
   var embedCard = dom.querySelector('.embedCardView-content-wrap');
-  return (0, _platformFeatureFlags.fg)('platform_editor_elements_drag_and_drop_ed_23189') ? nodeType === 'embedCard' || !!embedCard || nodeType === 'extension' && !!dom.querySelector('iframe') : nodeType === 'embedCard' || !!embedCard || nodeType === 'extension';
+  return nodeType === 'embedCard' || !!embedCard || nodeType === 'extension' && !!dom.querySelector('iframe');
 };
 var createPreviewForElement = function createPreviewForElement(dom, nodeType, nodeSpacing) {
   var shouldBeGenericPreview = isGenericPreview(dom, nodeType);

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

@@ -10,7 +10,6 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _box = require("@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box");
 var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
 var _colors = require("@atlaskit/theme/colors");
@@ -81,7 +80,7 @@ var DropTargetLayout = exports.DropTargetLayout = function DropTargetLayout(prop
     var to = getPos();
     var mappedTo;
     if (to !== undefined) {
-      var _api$core;
+      var _api$core, _api$core2;
       var from = activeNode.pos;
       api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(function (_ref2) {
         var _api$blockControls2;
@@ -89,22 +88,17 @@ var DropTargetLayout = exports.DropTargetLayout = function DropTargetLayout(prop
         api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 || _api$blockControls2.moveToLayout(from, to)({
           tr: tr
         });
-        if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-          var insertColumnStep = (0, _updateSelection.getInsertLayoutStep)(tr);
-          mappedTo = insertColumnStep === null || insertColumnStep === void 0 ? void 0 : insertColumnStep.from;
+        var insertColumnStep = (0, _updateSelection.getInsertLayoutStep)(tr);
+        mappedTo = insertColumnStep === null || insertColumnStep === void 0 ? void 0 : insertColumnStep.from;
+        return tr;
+      });
+      api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(function (_ref3) {
+        var tr = _ref3.tr;
+        if (mappedTo !== undefined) {
+          (0, _updateSelection.updateSelection)(tr, mappedTo);
         }
         return tr;
       });
-      if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-        var _api$core2;
-        api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(function (_ref3) {
-          var tr = _ref3.tr;
-          if (mappedTo !== undefined) {
-            (0, _updateSelection.updateSelection)(tr, mappedTo);
-          }
-          return tr;
-        });
-      }
     }
   }, [api, getPos, activeNode]);
   (0, _react.useEffect)(function () {

package/dist/cjs/ui/global-styles.js

@@ -8,7 +8,6 @@ exports.GlobalStylesWrapper = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("@emotion/react");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _consts = require("./consts");
 /**
@@ -216,6 +215,6 @@ var blockCardWithoutLayout = (0, _react.css)({
 });
 var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWrapper() {
   return (0, _react.jsx)(_react.Global, {
-    styles: [globalStyles(), (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1') && globalDnDStyle, (0, _experiments.editorExperiment)('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), withInlineNodeStyle, withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, headingWithIndentationInLayoutStyleFix, (0, _experiments.editorExperiment)('advanced_layouts', true) ? blockCardWithoutLayout : undefined, withDividerInPanelStyleFix, withFormatInLayoutStyleFix, withRelativePosStyle, topLevelNodeMarginStyles, (0, _experiments.editorExperiment)('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle,,]
+    styles: [globalStyles(), globalDnDStyle, (0, _experiments.editorExperiment)('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), withInlineNodeStyle, withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, headingWithIndentationInLayoutStyleFix, (0, _experiments.editorExperiment)('advanced_layouts', true) ? blockCardWithoutLayout : undefined, withDividerInPanelStyleFix, withFormatInLayoutStyleFix, withRelativePosStyle, topLevelNodeMarginStyles, (0, _experiments.editorExperiment)('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle,,]
   });
 };

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

@@ -10,7 +10,6 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _box = require("@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box");
 var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
 var _colors = require("@atlaskit/theme/colors");
@@ -191,7 +190,7 @@ var InlineDropTarget = exports.InlineDropTarget = function InlineDropTarget(_ref
     var toPos = getPos();
     var mappedTo;
     if (activeNode && toPos !== undefined) {
-      var _api$core;
+      var _api$core, _api$core2;
       var start = activeNode.pos;
       var moveToEnd = position === 'right';
       api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(function (_ref3) {
@@ -202,22 +201,17 @@ var InlineDropTarget = exports.InlineDropTarget = function InlineDropTarget(_ref
         })({
           tr: tr
         });
-        if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-          var insertLayoutStep = (0, _updateSelection.getInsertLayoutStep)(tr);
-          mappedTo = insertLayoutStep === null || insertLayoutStep === void 0 ? void 0 : insertLayoutStep.from;
+        var insertLayoutStep = (0, _updateSelection.getInsertLayoutStep)(tr);
+        mappedTo = insertLayoutStep === null || insertLayoutStep === void 0 ? void 0 : insertLayoutStep.from;
+        return tr;
+      });
+      api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(function (_ref4) {
+        var tr = _ref4.tr;
+        if (mappedTo !== undefined) {
+          (0, _updateSelection.updateSelection)(tr, mappedTo, moveToEnd);
         }
         return tr;
       });
-      if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
-        var _api$core2;
-        api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(function (_ref4) {
-          var tr = _ref4.tr;
-          if (mappedTo !== undefined) {
-            (0, _updateSelection.updateSelection)(tr, mappedTo, moveToEnd);
-          }
-          return tr;
-        });
-      }
     }
   }, [api, getPos, position]);
   var hoverZoneRectStyle = (0, _react.useMemo)(function () {

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

@@ -6,7 +6,7 @@ import { transformSliceNestedExpandToExpand } from '@atlaskit/editor-common/tran
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { Selection, NodeSelection } from '@atlaskit/editor-prosemirror/state';
-import { findParentNodeOfType, findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
+import { findChildrenByType, findParentNodeOfType, findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
 import { findTable, isInTable, isTableSelected } from '@atlaskit/editor-tables/utils';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -18,7 +18,7 @@ import { selectNode, setCursorPositionAtMovedNode } from '../pm-plugins/utils/ge
 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, transformSliceExpandToNestedExpand } from '../pm-plugins/utils/validation';
+import { canMoveNodeToIndex, isInsideTable, transformSliceExpandToNestedExpand, transformFragmentExpandToNestedExpand } from '../pm-plugins/utils/validation';
 
 /**
  * This function transforms the slice to move
@@ -81,6 +81,10 @@ const isDragLayoutColumnToTopLevel = ($from, $to) => {
   var _$from$nodeAfter;
   return ((_$from$nodeAfter = $from.nodeAfter) === null || _$from$nodeAfter === void 0 ? void 0 : _$from$nodeAfter.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && $to.depth === 0;
 };
+const isDragLayoutColumnIntoTable = ($from, $to) => {
+  var _$from$nodeAfter2;
+  return ((_$from$nodeAfter2 = $from.nodeAfter) === null || _$from$nodeAfter2 === void 0 ? void 0 : _$from$nodeAfter2.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && ($to.parent.type.name === 'tableCell' || $to.parent.type.name === 'tableHeader');
+};
 
 /**
  *
@@ -378,12 +382,25 @@ export const moveNode = api => (start, to, inputMethod = INPUT_METHOD.DRAG_AND_D
     const destType = $to.node().type;
     const destParent = $to.node($to.depth);
     const sourceNode = $handlePos.nodeAfter;
+    const dragLayoutColumnToTopLevel = isDragLayoutColumnToTopLevel($handlePos, $to);
+    const dragLayoutColumnIntoTable = isDragLayoutColumnIntoTable($handlePos, $to);
 
     //TODO: ED-26959 - Does this need to be updated with new selection logic above? ^
     // Move a layout column to top level
-    if (sourceNode && isDragLayoutColumnToTopLevel($handlePos, $to)) {
+    // Move a layout column into a table cell, only moves the content into the cell
+    if (sourceNode && (dragLayoutColumnToTopLevel || dragLayoutColumnIntoTable)) {
       // need update after we support single column layout.
-      const fragment = Fragment.from(sourceNode.content);
+      const layoutColumnContent = sourceNode.content;
+      let fragment;
+      if (dragLayoutColumnIntoTable) {
+        const contentContainsExpand = findChildrenByType(sourceNode, expand).length > 0;
+        fragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(Fragment.from(layoutColumnContent)) : Fragment.from(layoutColumnContent);
+        if (!fragment) {
+          return tr;
+        }
+      } else {
+        fragment = Fragment.from(layoutColumnContent);
+      }
       removeFromSource(tr, $handlePos, $handlePos.pos + sourceNode.nodeSize);
       const mappedTo = tr.mapping.map(to);
       tr.insert(mappedTo, fragment).setSelection(Selection.near(tr.doc.resolve(mappedTo))).scrollIntoView();