@atlaskit/editor-plugin-block-controls 2.14.2 → 2.15.0

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 2.15.0
+
+### Minor Changes
+
+- [#173846](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/173846)
+  [`9db562f586e8b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/9db562f586e8b) -
+  ED-25939 prevent native dnd and use block controls
+
+### Patch Changes
+
+- Updated dependencies
+
+## 2.14.3
+
+### Patch Changes
+
+- [#169746](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/169746)
+  [`5bfb485e85507`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5bfb485e85507) -
+  [ux] [ED-25925] After drag and drop to create a new layout or update an existing layout,
+  placecursor at the end of last node in the newly created column
+
 ## 2.14.2
 
 ### Patch Changes

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

@@ -7,6 +7,7 @@ exports.moveToLayout = void 0;
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _state = require("@atlaskit/editor-prosemirror/state");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _consts = require("../pm-plugins/utils/consts");
 var _fireAnalytics = require("../pm-plugins/utils/fire-analytics");
 var _removeFromSource = require("../pm-plugins/utils/remove-from-source");
@@ -44,13 +45,21 @@ var moveToExistingLayout = function moveToExistingLayout(toLayout, toLayoutPos,
     // reorder columns
     tr.delete(from, from + sourceNode.nodeSize);
     var mappedTo = tr.mapping.map(to);
-    tr.insert(mappedTo, sourceNode).setSelection(new _state.NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+    tr.insert(mappedTo, sourceNode);
+    if (!(0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
+      tr.setSelection(new _state.NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+    }
     (0, _fireAnalytics.fireMoveNodeAnalytics)(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);
   } else if (toLayout.childCount < (0, _consts.maxLayoutColumnSupported)()) {
     var _$originalFrom$nodeAf2;
-    insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
-    var mappedFrom = tr.mapping.map(from);
-    (0, _removeFromSource.removeFromSource)(tr, tr.doc.resolve(mappedFrom));
+    if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
+      (0, _removeFromSource.removeFromSource)(tr, tr.doc.resolve(from));
+      insertToDestination(tr, tr.mapping.map(to), sourceNode, toLayout, tr.mapping.map(toLayoutPos));
+    } else {
+      insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
+      var mappedFrom = tr.mapping.map(from);
+      (0, _removeFromSource.removeFromSource)(tr, tr.doc.resolve(mappedFrom));
+    }
     (0, _fireAnalytics.fireMoveNodeAnalytics)(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);
   }
   return tr;
@@ -63,7 +72,10 @@ var insertToDestination = function insertToDestination(tr, to, sourceNode, toLay
   var content = layoutColumn.createChecked({
     width: newColumnWidth
   }, sourceNode.type.name === 'layoutColumn' ? sourceNode.content : sourceNode);
-  tr.insert(to, content).setSelection(new _state.NodeSelection(tr.doc.resolve(to))).scrollIntoView();
+  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;
 };
 
@@ -171,7 +183,10 @@ var moveToLayout = exports.moveToLayout = function moveToLayout(api) {
         if (newLayout) {
           tr = (0, _removeFromSource.removeFromSource)(tr, $from);
           var mappedTo = tr.mapping.map(to);
-          tr.delete(mappedTo, mappedTo + toNodeWithoutBreakout.nodeSize).insert(mappedTo, newLayout).setSelection(new _state.NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+          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/decorations-drag-handle.js

@@ -33,7 +33,7 @@ var dragHandleDecoration = exports.dragHandleDecoration = function dragHandleDec
   (0, _decorationsCommon.unmountDecorations)(nodeViewPortalProviderAPI, 'data-blocks-drag-handle-container', 'data-blocks-drag-handle-key');
   var unbind;
   var key = (0, _uuid.default)();
-  return _view.Decoration.widget(pos, function (view, getPos) {
+  return _view.Decoration.widget(pos, function (view, getPosUnsafe) {
     var element = document.createElement('span');
     // Need to set it to inline to avoid text being split when merging two paragraphs
     // platform_editor_element_dnd_nested_fix_patch_2 -> inline decoration causes focus issues when refocusing Editor into first line
@@ -42,6 +42,13 @@ var dragHandleDecoration = exports.dragHandleDecoration = function dragHandleDec
     element.setAttribute('data-blocks-drag-handle-container', 'true');
     element.setAttribute('data-blocks-drag-handle-key', key);
     var isTopLevelNode = true;
+    var getPos = function getPos() {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     if ((0, _experiments.editorExperiment)('nested-dnd', true)) {
       var newPos = (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? getPos() : pos;
       if (typeof newPos === 'number') {

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

@@ -90,7 +90,14 @@ var findDropTargetDecs = exports.findDropTargetDecs = function findDropTargetDec
 };
 var createDropTargetDecoration = exports.createDropTargetDecoration = function createDropTargetDecoration(pos, props, nodeViewPortalProviderAPI, side, anchorRectCache, isSameLayout) {
   var key = (0, _uuid.default)();
-  return _view.Decoration.widget(pos, function (_, getPos) {
+  return _view.Decoration.widget(pos, function (_, getPosUnsafe) {
+    var getPos = function getPos() {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     var element = document.createElement('div');
     element.setAttribute('data-blocks-drop-target-container', 'true');
     element.setAttribute('data-blocks-drop-target-key', key);
@@ -138,7 +145,14 @@ var createDropTargetDecoration = exports.createDropTargetDecoration = function c
 };
 var createLayoutDropTargetDecoration = exports.createLayoutDropTargetDecoration = function createLayoutDropTargetDecoration(pos, props, nodeViewPortalProviderAPI, anchorRectCache) {
   var key = (0, _uuid.default)();
-  return _view.Decoration.widget(pos, function (_, getPos) {
+  return _view.Decoration.widget(pos, function (_, getPosUnsafe) {
+    var getPos = function getPos() {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     var element = document.createElement('div');
     element.setAttribute('data-blocks-drop-target-container', 'true');
     element.setAttribute('data-blocks-drop-target-key', key);

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

@@ -484,6 +484,11 @@ 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 ((draggable === null || draggable === void 0 ? void 0 : draggable.type.name) === 'layoutColumn' && (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1')) {
+            // we prevent native DnD for layoutColumn to prevent single column layout.
+            event.preventDefault();
+            return false;
+          }
           var nodeElement = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.closest('[data-drag-handler-anchor-name]');
           if (!nodeElement) {
             return false;

package/dist/cjs/pm-plugins/utils/update-selection.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updateSelection = exports.getInsertLayoutStep = void 0;
+var _selection = require("@atlaskit/editor-common/selection");
+var _state = require("@atlaskit/editor-prosemirror/state");
+var _transform = require("@atlaskit/editor-prosemirror/transform");
+var getInsertLayoutStep = exports.getInsertLayoutStep = function getInsertLayoutStep(tr) {
+  return tr.steps.find(function (step) {
+    var _step$slice$content$f;
+    return step instanceof _transform.ReplaceStep && ['layoutSection', 'layoutColumn'].includes(((_step$slice$content$f = step.slice.content.firstChild) === null || _step$slice$content$f === void 0 ? void 0 : _step$slice$content$f.type.name) || '');
+  });
+};
+var updateSelection = exports.updateSelection = function updateSelection(tr, to, insertAtRight) {
+  var _lastNode;
+  var $to = tr.doc.resolve(to);
+  var toNode = $to.nodeAfter;
+  var lastNode = toNode === null || toNode === void 0 ? void 0 : toNode.content.lastChild;
+  if (!toNode || !lastNode) {
+    return tr;
+  }
+  var offset = toNode.nodeSize;
+
+  // drop at the start of the layoutSection or to create a new layoutSection
+  if (toNode.type.name === 'layoutSection') {
+    if (insertAtRight) {
+      var _toNode$content$lastC;
+      lastNode = (_toNode$content$lastC = toNode.content.lastChild) === null || _toNode$content$lastC === void 0 ? void 0 : _toNode$content$lastC.lastChild;
+      offset = toNode.nodeSize - 1;
+    } else {
+      var _toNode$content$first, _toNode$content$first2;
+      lastNode = (_toNode$content$first = toNode.content.firstChild) === null || _toNode$content$first === void 0 ? void 0 : _toNode$content$first.lastChild;
+      offset = 1 + (((_toNode$content$first2 = toNode.content.firstChild) === null || _toNode$content$first2 === void 0 ? void 0 : _toNode$content$first2.nodeSize) || 0);
+    }
+  }
+  if (['paragraph', 'heading'].includes(((_lastNode = lastNode) === null || _lastNode === void 0 ? void 0 : _lastNode.type.name) || '')) {
+    tr.setSelection(_state.TextSelection.near(tr.doc.resolve(to + offset - 2)));
+  } else if (lastNode) {
+    tr.setSelection(new _selection.GapCursorSelection(tr.doc.resolve(to + offset - 1), _selection.Side.RIGHT));
+  }
+  return tr;
+};

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

@@ -146,7 +146,17 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
   // but ensures the preview is generated correctly.
   var handleMouseDown = (0, _react.useCallback)(function () {
     var _api$core3;
-    if (!(isLayoutColumn && (0, _experiments.editorExperiment)('advanced_layouts', true)) && (0, _platformFeatureFlags.fg)('platform_editor_element_drag_and_drop_ed_24885')) {
+    if ((0, _experiments.editorExperiment)('advanced_layouts', true)) {
+      // 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();
+      }
+      if (!isLayoutColumn) {
+        return undefined;
+      }
+    }
+    if ((0, _platformFeatureFlags.fg)('platform_editor_element_drag_and_drop_ed_24885')) {
       return undefined;
     }
     api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(function (_ref3) {
@@ -363,8 +373,8 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
   (0, _react.useEffect)(function () {
     if (handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused && buttonRef.current && (0, _platformFeatureFlags.fg)('platform_editor_element_drag_and_drop_ed_23873')) {
       var id = requestAnimationFrame(function () {
-        var _buttonRef$current;
-        (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 || _buttonRef$current.focus();
+        var _buttonRef$current2;
+        (_buttonRef$current2 = buttonRef.current) === null || _buttonRef$current2 === void 0 || _buttonRef$current2.focus();
       });
       return function () {
         cancelAnimationFrame(id);

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

@@ -10,6 +10,7 @@ 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");
@@ -17,6 +18,7 @@ var _decorationsCommon = require("../pm-plugins/decorations-common");
 var _activeAnchorTracker = require("../pm-plugins/utils/active-anchor-tracker");
 var _anchorUtils = require("../pm-plugins/utils/anchor-utils");
 var _dragTargetDebug = require("../pm-plugins/utils/drag-target-debug");
+var _updateSelection = require("../pm-plugins/utils/update-selection");
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -78,10 +80,32 @@ var DropTargetLayout = exports.DropTargetLayout = function DropTargetLayout(prop
       return;
     }
     var to = getPos();
+    var mappedTo;
     if (to !== undefined) {
-      var _api$core, _api$blockControls2;
+      var _api$core;
       var from = activeNode.pos;
-      api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.moveToLayout(from, to));
+      api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(function (_ref2) {
+        var _api$blockControls2;
+        var tr = _ref2.tr;
+        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;
+        }
+        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

@@ -134,6 +134,16 @@ var legacyBreakoutWideLayoutStyle = (0, _react.css)({
     }
   }
 });
+var globalDnDStyle = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.ProseMirror': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
+    '[data-layout-content]': {
+      userDrag: 'none',
+      userSelect: 'none'
+    }
+  }
+});
 var globalStyles = function globalStyles() {
   return (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? (0, _react.css)({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
@@ -219,6 +229,6 @@ var blockCardWithoutLayout = (0, _react.css)({
 });
 var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWrapper() {
   return (0, _react.jsx)(_react.Global, {
-    styles: [globalStyles(), (0, _experiments.editorExperiment)('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, (0, _experiments.editorExperiment)('advanced_layouts', true) ? blockCardWithoutLayout : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, (0, _experiments.editorExperiment)('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
+    styles: [globalStyles(), (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1') && globalDnDStyle, (0, _experiments.editorExperiment)('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, (0, _experiments.editorExperiment)('advanced_layouts', true) ? blockCardWithoutLayout : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, (0, _experiments.editorExperiment)('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
   });
 };

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

@@ -10,6 +10,7 @@ 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");
@@ -17,6 +18,7 @@ var _decorationsCommon = require("../pm-plugins/decorations-common");
 var _activeAnchorTracker = require("../pm-plugins/utils/active-anchor-tracker");
 var _anchorUtils = require("../pm-plugins/utils/anchor-utils");
 var _dragTargetDebug = require("../pm-plugins/utils/drag-target-debug");
+var _updateSelection = require("../pm-plugins/utils/update-selection");
 /* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
 /* eslint-disable @atlaskit/ui-styling-standard/no-unsafe-values */
 /**
@@ -188,16 +190,39 @@ var InlineDropTarget = exports.InlineDropTarget = function InlineDropTarget(_ref
       return;
     }
     var toPos = getPos();
+    var mappedTo;
     if (activeNode && toPos !== undefined) {
-      var _api$core, _api$blockControls2;
+      var _api$core;
       var start = activeNode.pos;
-      api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.moveToLayout(start, toPos, {
-        moveToEnd: position === 'right'
-      }));
+      var moveToEnd = position === 'right';
+      api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(function (_ref3) {
+        var _api$blockControls2;
+        var tr = _ref3.tr;
+        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(start, toPos, {
+          moveToEnd: moveToEnd
+        })({
+          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;
+        }
+        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 () {
-    var _ref3;
+    var _ref5;
     var isLayoutNode = (nextNode === null || nextNode === void 0 ? void 0 : nextNode.type.name) === 'layoutSection';
     var layoutAdjustment = isLayoutNode ? {
       width: 11,
@@ -205,7 +230,7 @@ var InlineDropTarget = exports.InlineDropTarget = function InlineDropTarget(_ref
       top: 6,
       bottom: 2
     } : undefined;
-    return _ref3 = {}, (0, _defineProperty2.default)(_ref3, HOVER_ZONE_WIDTH, nodeDimension.widthOffset ? "calc((100% - ".concat(nodeDimension.width, ")/2 - ").concat(GAP, "px + ").concat(nodeDimension.widthOffset, " - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.width) || 0, "px)") : "calc((100% - ".concat(nodeDimension.width, ")/2 - ").concat(GAP, "px - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.width) || 0, "px)")), (0, _defineProperty2.default)(_ref3, HOVER_ZONE_HEIGHT, "calc(".concat(nodeDimension.height, " + ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.height) || 0, "px)")), (0, _defineProperty2.default)(_ref3, HOVER_ZONE_TOP, "calc(".concat(nodeDimension.top, " + ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.top) || 0, "px)")), (0, _defineProperty2.default)(_ref3, HOVER_ZONE_BOTTOM, "calc(".concat(nodeDimension.bottom, " - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.bottom) || 0, "px)")), (0, _defineProperty2.default)(_ref3, HOVER_ZONE_ANCHOR_NAME, anchorName), _ref3;
+    return _ref5 = {}, (0, _defineProperty2.default)(_ref5, HOVER_ZONE_WIDTH, nodeDimension.widthOffset ? "calc((100% - ".concat(nodeDimension.width, ")/2 - ").concat(GAP, "px + ").concat(nodeDimension.widthOffset, " - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.width) || 0, "px)") : "calc((100% - ".concat(nodeDimension.width, ")/2 - ").concat(GAP, "px - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.width) || 0, "px)")), (0, _defineProperty2.default)(_ref5, HOVER_ZONE_HEIGHT, "calc(".concat(nodeDimension.height, " + ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.height) || 0, "px)")), (0, _defineProperty2.default)(_ref5, HOVER_ZONE_TOP, "calc(".concat(nodeDimension.top, " + ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.top) || 0, "px)")), (0, _defineProperty2.default)(_ref5, HOVER_ZONE_BOTTOM, "calc(".concat(nodeDimension.bottom, " - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.bottom) || 0, "px)")), (0, _defineProperty2.default)(_ref5, HOVER_ZONE_ANCHOR_NAME, anchorName), _ref5;
   }, [nextNode === null || nextNode === void 0 ? void 0 : nextNode.type.name, nodeDimension, anchorName]);
   var dropIndicatorPos = (0, _react.useMemo)(function () {
     return isLeftPosition ? 'right' : 'left';

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

@@ -1,6 +1,7 @@
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { maxLayoutColumnSupported } from '../pm-plugins/utils/consts';
 import { fireInsertLayoutAnalytics, fireMoveNodeAnalytics } from '../pm-plugins/utils/fire-analytics';
 import { removeFromSource } from '../pm-plugins/utils/remove-from-source';
@@ -39,13 +40,21 @@ const moveToExistingLayout = (toLayout, toLayoutPos, sourceNode, from, to, tr, $
     // reorder columns
     tr.delete(from, from + sourceNode.nodeSize);
     const mappedTo = tr.mapping.map(to);
-    tr.insert(mappedTo, sourceNode).setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+    tr.insert(mappedTo, sourceNode);
+    if (!fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+      tr.setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+    }
     fireMoveNodeAnalytics(tr, 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);
   } else if (toLayout.childCount < maxLayoutColumnSupported()) {
     var _$originalFrom$nodeAf2;
-    insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
-    const mappedFrom = tr.mapping.map(from);
-    removeFromSource(tr, tr.doc.resolve(mappedFrom));
+    if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+      removeFromSource(tr, tr.doc.resolve(from));
+      insertToDestination(tr, tr.mapping.map(to), sourceNode, toLayout, tr.mapping.map(toLayoutPos));
+    } else {
+      insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
+      const mappedFrom = tr.mapping.map(from);
+      removeFromSource(tr, tr.doc.resolve(mappedFrom));
+    }
     fireMoveNodeAnalytics(tr, 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);
   }
   return tr;
@@ -60,7 +69,10 @@ const insertToDestination = (tr, to, sourceNode, toLayout, toLayoutPos) => {
   const content = layoutColumn.createChecked({
     width: newColumnWidth
   }, sourceNode.type.name === 'layoutColumn' ? sourceNode.content : sourceNode);
-  tr.insert(to, content).setSelection(new NodeSelection(tr.doc.resolve(to))).scrollIntoView();
+  tr.insert(to, content);
+  if (!fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+    tr.setSelection(new NodeSelection(tr.doc.resolve(to))).scrollIntoView();
+  }
   return tr;
 };
 
@@ -166,7 +178,10 @@ export const moveToLayout = api => (from, to, options) => ({
     if (newLayout) {
       tr = removeFromSource(tr, $from);
       const mappedTo = tr.mapping.map(to);
-      tr.delete(mappedTo, mappedTo + toNodeWithoutBreakout.nodeSize).insert(mappedTo, newLayout).setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+      tr.delete(mappedTo, mappedTo + toNodeWithoutBreakout.nodeSize).insert(mappedTo, newLayout);
+      if (!fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+        tr.setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+      }
       breakoutMode && tr.setNodeMarkup(mappedTo, newLayout.type, newLayout.attrs, [breakout.create({
         mode: breakoutMode
       })]);

package/dist/es2019/pm-plugins/decorations-drag-handle.js

@@ -24,7 +24,7 @@ export const dragHandleDecoration = (api, formatMessage, pos, anchorName, nodeTy
   unmountDecorations(nodeViewPortalProviderAPI, 'data-blocks-drag-handle-container', 'data-blocks-drag-handle-key');
   let unbind;
   const key = uuid();
-  return Decoration.widget(pos, (view, getPos) => {
+  return Decoration.widget(pos, (view, getPosUnsafe) => {
     const element = document.createElement('span');
     // Need to set it to inline to avoid text being split when merging two paragraphs
     // platform_editor_element_dnd_nested_fix_patch_2 -> inline decoration causes focus issues when refocusing Editor into first line
@@ -33,6 +33,13 @@ export const dragHandleDecoration = (api, formatMessage, pos, anchorName, nodeTy
     element.setAttribute('data-blocks-drag-handle-container', 'true');
     element.setAttribute('data-blocks-drag-handle-key', key);
     let isTopLevelNode = true;
+    const getPos = () => {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     if (editorExperiment('nested-dnd', true)) {
       const newPos = fg('platform_editor_element_dnd_nested_fix_patch_3') ? getPos() : pos;
       if (typeof newPos === 'number') {

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

@@ -78,7 +78,14 @@ export const findDropTargetDecs = (decorations, from, to) => {
 };
 export const createDropTargetDecoration = (pos, props, nodeViewPortalProviderAPI, side, anchorRectCache, isSameLayout) => {
   const key = uuid();
-  return Decoration.widget(pos, (_, getPos) => {
+  return Decoration.widget(pos, (_, getPosUnsafe) => {
+    const getPos = () => {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     const element = document.createElement('div');
     element.setAttribute('data-blocks-drop-target-container', 'true');
     element.setAttribute('data-blocks-drop-target-key', key);
@@ -127,7 +134,14 @@ export const createDropTargetDecoration = (pos, props, nodeViewPortalProviderAPI
 };
 export const createLayoutDropTargetDecoration = (pos, props, nodeViewPortalProviderAPI, anchorRectCache) => {
   const key = uuid();
-  return Decoration.widget(pos, (_, getPos) => {
+  return Decoration.widget(pos, (_, getPosUnsafe) => {
+    const getPos = () => {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     const element = document.createElement('div');
     element.setAttribute('data-blocks-drop-target-container', 'true');
     element.setAttribute('data-blocks-drop-target-key', key);

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

@@ -461,6 +461,11 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
           // Currently we can only drag one node at a time
           // so we only need to check first child
           const draggable = dragging === null || dragging === void 0 ? void 0 : dragging.slice.content.firstChild;
+          if ((draggable === null || draggable === void 0 ? void 0 : draggable.type.name) === 'layoutColumn' && fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+            // we prevent native DnD for layoutColumn to prevent single column layout.
+            event.preventDefault();
+            return false;
+          }
           const nodeElement = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.closest('[data-drag-handler-anchor-name]');
           if (!nodeElement) {
             return false;

package/dist/es2019/pm-plugins/utils/update-selection.js

@@ -0,0 +1,36 @@
+import { GapCursorSelection, Side } from '@atlaskit/editor-common/selection';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { ReplaceStep } from '@atlaskit/editor-prosemirror/transform';
+export const getInsertLayoutStep = tr => tr.steps.find(step => {
+  var _step$slice$content$f;
+  return step instanceof ReplaceStep && ['layoutSection', 'layoutColumn'].includes(((_step$slice$content$f = step.slice.content.firstChild) === null || _step$slice$content$f === void 0 ? void 0 : _step$slice$content$f.type.name) || '');
+});
+export const updateSelection = (tr, to, insertAtRight) => {
+  var _lastNode;
+  const $to = tr.doc.resolve(to);
+  const toNode = $to.nodeAfter;
+  let lastNode = toNode === null || toNode === void 0 ? void 0 : toNode.content.lastChild;
+  if (!toNode || !lastNode) {
+    return tr;
+  }
+  let offset = toNode.nodeSize;
+
+  // drop at the start of the layoutSection or to create a new layoutSection
+  if (toNode.type.name === 'layoutSection') {
+    if (insertAtRight) {
+      var _toNode$content$lastC;
+      lastNode = (_toNode$content$lastC = toNode.content.lastChild) === null || _toNode$content$lastC === void 0 ? void 0 : _toNode$content$lastC.lastChild;
+      offset = toNode.nodeSize - 1;
+    } else {
+      var _toNode$content$first, _toNode$content$first2;
+      lastNode = (_toNode$content$first = toNode.content.firstChild) === null || _toNode$content$first === void 0 ? void 0 : _toNode$content$first.lastChild;
+      offset = 1 + (((_toNode$content$first2 = toNode.content.firstChild) === null || _toNode$content$first2 === void 0 ? void 0 : _toNode$content$first2.nodeSize) || 0);
+    }
+  }
+  if (['paragraph', 'heading'].includes(((_lastNode = lastNode) === null || _lastNode === void 0 ? void 0 : _lastNode.type.name) || '')) {
+    tr.setSelection(TextSelection.near(tr.doc.resolve(to + offset - 2)));
+  } else if (lastNode) {
+    tr.setSelection(new GapCursorSelection(tr.doc.resolve(to + offset - 1), Side.RIGHT));
+  }
+  return tr;
+};

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

@@ -129,7 +129,17 @@ export const DragHandle = ({
   // but ensures the preview is generated correctly.
   const handleMouseDown = useCallback(() => {
     var _api$core3;
-    if (!(isLayoutColumn && editorExperiment('advanced_layouts', true)) && fg('platform_editor_element_drag_and_drop_ed_24885')) {
+    if (editorExperiment('advanced_layouts', true)) {
+      // prevent native drag and drop.
+      if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+        var _buttonRef$current;
+        (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 ? void 0 : _buttonRef$current.focus();
+      }
+      if (!isLayoutColumn) {
+        return undefined;
+      }
+    }
+    if (fg('platform_editor_element_drag_and_drop_ed_24885')) {
       return undefined;
     }
     api === null || api === void 0 ? void 0 : (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(({
@@ -344,8 +354,8 @@ export const DragHandle = ({
   useEffect(() => {
     if (handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused && buttonRef.current && fg('platform_editor_element_drag_and_drop_ed_23873')) {
       const id = requestAnimationFrame(() => {
-        var _buttonRef$current;
-        (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 ? void 0 : _buttonRef$current.focus();
+        var _buttonRef$current2;
+        (_buttonRef$current2 = buttonRef.current) === null || _buttonRef$current2 === void 0 ? void 0 : _buttonRef$current2.focus();
       });
       return () => {
         cancelAnimationFrame(id);

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

@@ -7,6 +7,7 @@ import { useCallback, useEffect, useRef, useState } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
 import { css, jsx } from '@emotion/react';
 import { layoutBreakpointWidth } from '@atlaskit/editor-shared-styles';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { DropIndicator } from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';
 import { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { B200 } from '@atlaskit/theme/colors';
@@ -14,6 +15,7 @@ import { getNodeAnchor } from '../pm-plugins/decorations-common';
 import { useActiveAnchorTracker } from '../pm-plugins/utils/active-anchor-tracker';
 import { isAnchorSupported } from '../pm-plugins/utils/anchor-utils';
 import { isBlocksDragTargetDebug } from '../pm-plugins/utils/drag-target-debug';
+import { getInsertLayoutStep, updateSelection } from '../pm-plugins/utils/update-selection';
 
 // 8px gap + 16px on left and right
 const DROP_TARGET_LAYOUT_DROP_ZONE_WIDTH = 40;
@@ -70,12 +72,36 @@ export const DropTargetLayout = props => {
       return;
     }
     const to = getPos();
+    let mappedTo;
     if (to !== undefined) {
-      var _api$core, _api$blockControls2, _api$blockControls2$c;
+      var _api$core;
       const {
         pos: from
       } = activeNode;
-      api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$c = _api$blockControls2.commands) === null || _api$blockControls2$c === void 0 ? void 0 : _api$blockControls2$c.moveToLayout(from, to));
+      api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(({
+        tr
+      }) => {
+        var _api$blockControls2, _api$blockControls2$c;
+        api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$c = _api$blockControls2.commands) === null || _api$blockControls2$c === void 0 ? void 0 : _api$blockControls2$c.moveToLayout(from, to)({
+          tr
+        });
+        if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+          const insertColumnStep = getInsertLayoutStep(tr);
+          mappedTo = insertColumnStep === null || insertColumnStep === void 0 ? void 0 : insertColumnStep.from;
+        }
+        return tr;
+      });
+      if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+        var _api$core2;
+        api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(({
+          tr
+        }) => {
+          if (mappedTo !== undefined) {
+            updateSelection(tr, mappedTo);
+          }
+          return tr;
+        });
+      }
     }
   }, [api, getPos, activeNode]);
   useEffect(() => {

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

@@ -160,6 +160,16 @@ const legacyBreakoutWideLayoutStyle = css({
     }
   }
 });
+const globalDnDStyle = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.ProseMirror': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
+    '[data-layout-content]': {
+      userDrag: 'none',
+      userSelect: 'none'
+    }
+  }
+});
 const globalStyles = () => fg('platform_editor_element_dnd_nested_fix_patch_3') ? css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '.ProseMirror-widget:first-child + *:not([data-panel-type], .code-block, [data-node-type="nestedExpand"], [data-layout-section="true"])': {
@@ -261,6 +271,6 @@ const blockCardWithoutLayout = css({
 });
 export const GlobalStylesWrapper = () => {
   return jsx(Global, {
-    styles: [globalStyles(), editorExperiment('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, editorExperiment('advanced_layouts', true) ? blockCardWithoutLayout : undefined, fg('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, editorExperiment('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
+    styles: [globalStyles(), fg('platform_editor_advanced_layouts_post_fix_patch_1') && globalDnDStyle, editorExperiment('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, editorExperiment('advanced_layouts', true) ? blockCardWithoutLayout : undefined, fg('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, editorExperiment('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
   });
 };

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

@@ -9,6 +9,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
 import { css, jsx } from '@emotion/react';
 import { akEditorBreakoutPadding } from '@atlaskit/editor-shared-styles';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { DropIndicator } from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';
 import { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { B200 } from '@atlaskit/theme/colors';
@@ -16,6 +17,7 @@ import { getNodeAnchor } from '../pm-plugins/decorations-common';
 import { useActiveAnchorTracker } from '../pm-plugins/utils/active-anchor-tracker';
 import { isAnchorSupported } from '../pm-plugins/utils/anchor-utils';
 import { isBlocksDragTargetDebug } from '../pm-plugins/utils/drag-target-debug';
+import { getInsertLayoutStep, updateSelection } from '../pm-plugins/utils/update-selection';
 const HOVER_ZONE_WIDTH = '--editor-blocks-inline-hover-zone-width';
 const HOVER_ZONE_HEIGHT = '--editor-blocks-inline-hover-zone-height';
 const HOVER_ZONE_TOP = '--editor-blocks-inline-hover-zone-top';
@@ -175,14 +177,39 @@ export const InlineDropTarget = ({
       return;
     }
     const toPos = getPos();
+    let mappedTo;
     if (activeNode && toPos !== undefined) {
-      var _api$core, _api$blockControls2, _api$blockControls2$c;
+      var _api$core;
       const {
         pos: start
       } = activeNode;
-      api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$c = _api$blockControls2.commands) === null || _api$blockControls2$c === void 0 ? void 0 : _api$blockControls2$c.moveToLayout(start, toPos, {
-        moveToEnd: position === 'right'
-      }));
+      const moveToEnd = position === 'right';
+      api === null || api === void 0 ? void 0 : (_api$core = api.core) === null || _api$core === void 0 ? void 0 : _api$core.actions.execute(({
+        tr
+      }) => {
+        var _api$blockControls2, _api$blockControls2$c;
+        api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$c = _api$blockControls2.commands) === null || _api$blockControls2$c === void 0 ? void 0 : _api$blockControls2$c.moveToLayout(start, toPos, {
+          moveToEnd
+        })({
+          tr
+        });
+        if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+          const insertLayoutStep = getInsertLayoutStep(tr);
+          mappedTo = insertLayoutStep === null || insertLayoutStep === void 0 ? void 0 : insertLayoutStep.from;
+        }
+        return tr;
+      });
+      if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+        var _api$core2;
+        api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(({
+          tr
+        }) => {
+          if (mappedTo !== undefined) {
+            updateSelection(tr, mappedTo, moveToEnd);
+          }
+          return tr;
+        });
+      }
     }
   }, [api, getPos, position]);
   const hoverZoneRectStyle = useMemo(() => {

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

@@ -1,6 +1,7 @@
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { maxLayoutColumnSupported } from '../pm-plugins/utils/consts';
 import { fireInsertLayoutAnalytics, fireMoveNodeAnalytics } from '../pm-plugins/utils/fire-analytics';
 import { removeFromSource } from '../pm-plugins/utils/remove-from-source';
@@ -38,13 +39,21 @@ var moveToExistingLayout = function moveToExistingLayout(toLayout, toLayoutPos,
     // reorder columns
     tr.delete(from, from + sourceNode.nodeSize);
     var mappedTo = tr.mapping.map(to);
-    tr.insert(mappedTo, sourceNode).setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+    tr.insert(mappedTo, sourceNode);
+    if (!fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+      tr.setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+    }
     fireMoveNodeAnalytics(tr, 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);
   } else if (toLayout.childCount < maxLayoutColumnSupported()) {
     var _$originalFrom$nodeAf2;
-    insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
-    var mappedFrom = tr.mapping.map(from);
-    removeFromSource(tr, tr.doc.resolve(mappedFrom));
+    if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+      removeFromSource(tr, tr.doc.resolve(from));
+      insertToDestination(tr, tr.mapping.map(to), sourceNode, toLayout, tr.mapping.map(toLayoutPos));
+    } else {
+      insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
+      var mappedFrom = tr.mapping.map(from);
+      removeFromSource(tr, tr.doc.resolve(mappedFrom));
+    }
     fireMoveNodeAnalytics(tr, 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);
   }
   return tr;
@@ -57,7 +66,10 @@ var insertToDestination = function insertToDestination(tr, to, sourceNode, toLay
   var content = layoutColumn.createChecked({
     width: newColumnWidth
   }, sourceNode.type.name === 'layoutColumn' ? sourceNode.content : sourceNode);
-  tr.insert(to, content).setSelection(new NodeSelection(tr.doc.resolve(to))).scrollIntoView();
+  tr.insert(to, content);
+  if (!fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+    tr.setSelection(new NodeSelection(tr.doc.resolve(to))).scrollIntoView();
+  }
   return tr;
 };
 
@@ -165,7 +177,10 @@ export var moveToLayout = function moveToLayout(api) {
         if (newLayout) {
           tr = removeFromSource(tr, $from);
           var mappedTo = tr.mapping.map(to);
-          tr.delete(mappedTo, mappedTo + toNodeWithoutBreakout.nodeSize).insert(mappedTo, newLayout).setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+          tr.delete(mappedTo, mappedTo + toNodeWithoutBreakout.nodeSize).insert(mappedTo, newLayout);
+          if (!fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+            tr.setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
+          }
           breakoutMode && tr.setNodeMarkup(mappedTo, newLayout.type, newLayout.attrs, [breakout.create({
             mode: breakoutMode
           })]);

package/dist/esm/pm-plugins/decorations-drag-handle.js

@@ -26,7 +26,7 @@ export var dragHandleDecoration = function dragHandleDecoration(api, formatMessa
   unmountDecorations(nodeViewPortalProviderAPI, 'data-blocks-drag-handle-container', 'data-blocks-drag-handle-key');
   var unbind;
   var key = uuid();
-  return Decoration.widget(pos, function (view, getPos) {
+  return Decoration.widget(pos, function (view, getPosUnsafe) {
     var element = document.createElement('span');
     // Need to set it to inline to avoid text being split when merging two paragraphs
     // platform_editor_element_dnd_nested_fix_patch_2 -> inline decoration causes focus issues when refocusing Editor into first line
@@ -35,6 +35,13 @@ export var dragHandleDecoration = function dragHandleDecoration(api, formatMessa
     element.setAttribute('data-blocks-drag-handle-container', 'true');
     element.setAttribute('data-blocks-drag-handle-key', key);
     var isTopLevelNode = true;
+    var getPos = function getPos() {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     if (editorExperiment('nested-dnd', true)) {
       var newPos = fg('platform_editor_element_dnd_nested_fix_patch_3') ? getPos() : pos;
       if (typeof newPos === 'number') {

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

@@ -83,7 +83,14 @@ export var findDropTargetDecs = function findDropTargetDecs(decorations, from, t
 };
 export var createDropTargetDecoration = function createDropTargetDecoration(pos, props, nodeViewPortalProviderAPI, side, anchorRectCache, isSameLayout) {
   var key = uuid();
-  return Decoration.widget(pos, function (_, getPos) {
+  return Decoration.widget(pos, function (_, getPosUnsafe) {
+    var getPos = function getPos() {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     var element = document.createElement('div');
     element.setAttribute('data-blocks-drop-target-container', 'true');
     element.setAttribute('data-blocks-drop-target-key', key);
@@ -131,7 +138,14 @@ export var createDropTargetDecoration = function createDropTargetDecoration(pos,
 };
 export var createLayoutDropTargetDecoration = function createLayoutDropTargetDecoration(pos, props, nodeViewPortalProviderAPI, anchorRectCache) {
   var key = uuid();
-  return Decoration.widget(pos, function (_, getPos) {
+  return Decoration.widget(pos, function (_, getPosUnsafe) {
+    var getPos = function getPos() {
+      try {
+        return getPosUnsafe();
+      } catch (e) {
+        return undefined;
+      }
+    };
     var element = document.createElement('div');
     element.setAttribute('data-blocks-drop-target-container', 'true');
     element.setAttribute('data-blocks-drop-target-key', key);

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

@@ -477,6 +477,11 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
           // 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 ((draggable === null || draggable === void 0 ? void 0 : draggable.type.name) === 'layoutColumn' && fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+            // we prevent native DnD for layoutColumn to prevent single column layout.
+            event.preventDefault();
+            return false;
+          }
           var nodeElement = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.closest('[data-drag-handler-anchor-name]');
           if (!nodeElement) {
             return false;

package/dist/esm/pm-plugins/utils/update-selection.js

@@ -0,0 +1,38 @@
+import { GapCursorSelection, Side } from '@atlaskit/editor-common/selection';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { ReplaceStep } from '@atlaskit/editor-prosemirror/transform';
+export var getInsertLayoutStep = function getInsertLayoutStep(tr) {
+  return tr.steps.find(function (step) {
+    var _step$slice$content$f;
+    return step instanceof ReplaceStep && ['layoutSection', 'layoutColumn'].includes(((_step$slice$content$f = step.slice.content.firstChild) === null || _step$slice$content$f === void 0 ? void 0 : _step$slice$content$f.type.name) || '');
+  });
+};
+export var updateSelection = function updateSelection(tr, to, insertAtRight) {
+  var _lastNode;
+  var $to = tr.doc.resolve(to);
+  var toNode = $to.nodeAfter;
+  var lastNode = toNode === null || toNode === void 0 ? void 0 : toNode.content.lastChild;
+  if (!toNode || !lastNode) {
+    return tr;
+  }
+  var offset = toNode.nodeSize;
+
+  // drop at the start of the layoutSection or to create a new layoutSection
+  if (toNode.type.name === 'layoutSection') {
+    if (insertAtRight) {
+      var _toNode$content$lastC;
+      lastNode = (_toNode$content$lastC = toNode.content.lastChild) === null || _toNode$content$lastC === void 0 ? void 0 : _toNode$content$lastC.lastChild;
+      offset = toNode.nodeSize - 1;
+    } else {
+      var _toNode$content$first, _toNode$content$first2;
+      lastNode = (_toNode$content$first = toNode.content.firstChild) === null || _toNode$content$first === void 0 ? void 0 : _toNode$content$first.lastChild;
+      offset = 1 + (((_toNode$content$first2 = toNode.content.firstChild) === null || _toNode$content$first2 === void 0 ? void 0 : _toNode$content$first2.nodeSize) || 0);
+    }
+  }
+  if (['paragraph', 'heading'].includes(((_lastNode = lastNode) === null || _lastNode === void 0 ? void 0 : _lastNode.type.name) || '')) {
+    tr.setSelection(TextSelection.near(tr.doc.resolve(to + offset - 2)));
+  } else if (lastNode) {
+    tr.setSelection(new GapCursorSelection(tr.doc.resolve(to + offset - 1), Side.RIGHT));
+  }
+  return tr;
+};

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

@@ -137,7 +137,17 @@ export var DragHandle = function DragHandle(_ref) {
   // but ensures the preview is generated correctly.
   var handleMouseDown = useCallback(function () {
     var _api$core3;
-    if (!(isLayoutColumn && editorExperiment('advanced_layouts', true)) && fg('platform_editor_element_drag_and_drop_ed_24885')) {
+    if (editorExperiment('advanced_layouts', true)) {
+      // prevent native drag and drop.
+      if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+        var _buttonRef$current;
+        (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 || _buttonRef$current.focus();
+      }
+      if (!isLayoutColumn) {
+        return undefined;
+      }
+    }
+    if (fg('platform_editor_element_drag_and_drop_ed_24885')) {
       return undefined;
     }
     api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(function (_ref3) {
@@ -354,8 +364,8 @@ export var DragHandle = function DragHandle(_ref) {
   useEffect(function () {
     if (handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused && buttonRef.current && fg('platform_editor_element_drag_and_drop_ed_23873')) {
       var id = requestAnimationFrame(function () {
-        var _buttonRef$current;
-        (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 || _buttonRef$current.focus();
+        var _buttonRef$current2;
+        (_buttonRef$current2 = buttonRef.current) === null || _buttonRef$current2 === void 0 || _buttonRef$current2.focus();
       });
       return function () {
         cancelAnimationFrame(id);

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

@@ -9,6 +9,7 @@ import { useCallback, useEffect, useRef, useState } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
 import { css, jsx } from '@emotion/react';
 import { layoutBreakpointWidth } from '@atlaskit/editor-shared-styles';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { DropIndicator } from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';
 import { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { B200 } from '@atlaskit/theme/colors';
@@ -16,6 +17,7 @@ import { getNodeAnchor } from '../pm-plugins/decorations-common';
 import { useActiveAnchorTracker } from '../pm-plugins/utils/active-anchor-tracker';
 import { isAnchorSupported } from '../pm-plugins/utils/anchor-utils';
 import { isBlocksDragTargetDebug } from '../pm-plugins/utils/drag-target-debug';
+import { getInsertLayoutStep, updateSelection } from '../pm-plugins/utils/update-selection';
 
 // 8px gap + 16px on left and right
 var DROP_TARGET_LAYOUT_DROP_ZONE_WIDTH = 40;
@@ -71,10 +73,32 @@ export var DropTargetLayout = function DropTargetLayout(props) {
       return;
     }
     var to = getPos();
+    var mappedTo;
     if (to !== undefined) {
-      var _api$core, _api$blockControls2;
+      var _api$core;
       var from = activeNode.pos;
-      api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.moveToLayout(from, to));
+      api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(function (_ref2) {
+        var _api$blockControls2;
+        var tr = _ref2.tr;
+        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 (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+          var insertColumnStep = getInsertLayoutStep(tr);
+          mappedTo = insertColumnStep === null || insertColumnStep === void 0 ? void 0 : insertColumnStep.from;
+        }
+        return tr;
+      });
+      if (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) {
+            updateSelection(tr, mappedTo);
+          }
+          return tr;
+        });
+      }
     }
   }, [api, getPos, activeNode]);
   useEffect(function () {

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

@@ -127,6 +127,16 @@ var legacyBreakoutWideLayoutStyle = css({
     }
   }
 });
+var globalDnDStyle = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
+  '.ProseMirror': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
+    '[data-layout-content]': {
+      userDrag: 'none',
+      userSelect: 'none'
+    }
+  }
+});
 var globalStyles = function globalStyles() {
   return fg('platform_editor_element_dnd_nested_fix_patch_3') ? css({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
@@ -212,6 +222,6 @@ var blockCardWithoutLayout = css({
 });
 export var GlobalStylesWrapper = function GlobalStylesWrapper() {
   return jsx(Global, {
-    styles: [globalStyles(), editorExperiment('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, editorExperiment('advanced_layouts', true) ? blockCardWithoutLayout : undefined, fg('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, editorExperiment('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
+    styles: [globalStyles(), fg('platform_editor_advanced_layouts_post_fix_patch_1') && globalDnDStyle, editorExperiment('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, editorExperiment('advanced_layouts', true) ? blockCardWithoutLayout : undefined, fg('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, editorExperiment('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
   });
 };

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

@@ -11,6 +11,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
 import { css, jsx } from '@emotion/react';
 import { akEditorBreakoutPadding } from '@atlaskit/editor-shared-styles';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { DropIndicator } from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';
 import { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { B200 } from '@atlaskit/theme/colors';
@@ -18,6 +19,7 @@ import { getNodeAnchor } from '../pm-plugins/decorations-common';
 import { useActiveAnchorTracker } from '../pm-plugins/utils/active-anchor-tracker';
 import { isAnchorSupported } from '../pm-plugins/utils/anchor-utils';
 import { isBlocksDragTargetDebug } from '../pm-plugins/utils/drag-target-debug';
+import { getInsertLayoutStep, updateSelection } from '../pm-plugins/utils/update-selection';
 var HOVER_ZONE_WIDTH = '--editor-blocks-inline-hover-zone-width';
 var HOVER_ZONE_HEIGHT = '--editor-blocks-inline-hover-zone-height';
 var HOVER_ZONE_TOP = '--editor-blocks-inline-hover-zone-top';
@@ -180,16 +182,39 @@ export var InlineDropTarget = function InlineDropTarget(_ref) {
       return;
     }
     var toPos = getPos();
+    var mappedTo;
     if (activeNode && toPos !== undefined) {
-      var _api$core, _api$blockControls2;
+      var _api$core;
       var start = activeNode.pos;
-      api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.moveToLayout(start, toPos, {
-        moveToEnd: position === 'right'
-      }));
+      var moveToEnd = position === 'right';
+      api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(function (_ref3) {
+        var _api$blockControls2;
+        var tr = _ref3.tr;
+        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(start, toPos, {
+          moveToEnd: moveToEnd
+        })({
+          tr: tr
+        });
+        if (fg('platform_editor_advanced_layouts_post_fix_patch_1')) {
+          var insertLayoutStep = getInsertLayoutStep(tr);
+          mappedTo = insertLayoutStep === null || insertLayoutStep === void 0 ? void 0 : insertLayoutStep.from;
+        }
+        return tr;
+      });
+      if (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) {
+            updateSelection(tr, mappedTo, moveToEnd);
+          }
+          return tr;
+        });
+      }
     }
   }, [api, getPos, position]);
   var hoverZoneRectStyle = useMemo(function () {
-    var _ref3;
+    var _ref5;
     var isLayoutNode = (nextNode === null || nextNode === void 0 ? void 0 : nextNode.type.name) === 'layoutSection';
     var layoutAdjustment = isLayoutNode ? {
       width: 11,
@@ -197,7 +222,7 @@ export var InlineDropTarget = function InlineDropTarget(_ref) {
       top: 6,
       bottom: 2
     } : undefined;
-    return _ref3 = {}, _defineProperty(_ref3, HOVER_ZONE_WIDTH, nodeDimension.widthOffset ? "calc((100% - ".concat(nodeDimension.width, ")/2 - ").concat(GAP, "px + ").concat(nodeDimension.widthOffset, " - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.width) || 0, "px)") : "calc((100% - ".concat(nodeDimension.width, ")/2 - ").concat(GAP, "px - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.width) || 0, "px)")), _defineProperty(_ref3, HOVER_ZONE_HEIGHT, "calc(".concat(nodeDimension.height, " + ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.height) || 0, "px)")), _defineProperty(_ref3, HOVER_ZONE_TOP, "calc(".concat(nodeDimension.top, " + ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.top) || 0, "px)")), _defineProperty(_ref3, HOVER_ZONE_BOTTOM, "calc(".concat(nodeDimension.bottom, " - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.bottom) || 0, "px)")), _defineProperty(_ref3, HOVER_ZONE_ANCHOR_NAME, anchorName), _ref3;
+    return _ref5 = {}, _defineProperty(_ref5, HOVER_ZONE_WIDTH, nodeDimension.widthOffset ? "calc((100% - ".concat(nodeDimension.width, ")/2 - ").concat(GAP, "px + ").concat(nodeDimension.widthOffset, " - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.width) || 0, "px)") : "calc((100% - ".concat(nodeDimension.width, ")/2 - ").concat(GAP, "px - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.width) || 0, "px)")), _defineProperty(_ref5, HOVER_ZONE_HEIGHT, "calc(".concat(nodeDimension.height, " + ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.height) || 0, "px)")), _defineProperty(_ref5, HOVER_ZONE_TOP, "calc(".concat(nodeDimension.top, " + ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.top) || 0, "px)")), _defineProperty(_ref5, HOVER_ZONE_BOTTOM, "calc(".concat(nodeDimension.bottom, " - ").concat((layoutAdjustment === null || layoutAdjustment === void 0 ? void 0 : layoutAdjustment.bottom) || 0, "px)")), _defineProperty(_ref5, HOVER_ZONE_ANCHOR_NAME, anchorName), _ref5;
   }, [nextNode === null || nextNode === void 0 ? void 0 : nextNode.type.name, nodeDimension, anchorName]);
   var dropIndicatorPos = useMemo(function () {
     return isLeftPosition ? 'right' : 'left';

package/dist/types/pm-plugins/utils/update-selection.d.ts

@@ -0,0 +1,3 @@
+import { type Transaction } from '@atlaskit/editor-prosemirror/state';
+export declare const getInsertLayoutStep: (tr: Transaction) => import("prosemirror-transform").Step | undefined;
+export declare const updateSelection: (tr: Transaction, to: number, insertAtRight?: boolean) => Transaction;

package/dist/types-ts4.5/pm-plugins/utils/update-selection.d.ts

@@ -0,0 +1,3 @@
+import { type Transaction } from '@atlaskit/editor-prosemirror/state';
+export declare const getInsertLayoutStep: (tr: Transaction) => import("prosemirror-transform").Step | undefined;
+export declare const updateSelection: (tr: Transaction, to: number, insertAtRight?: boolean) => Transaction;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "2.14.2",
+	"version": "2.15.0",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -31,24 +31,24 @@
 	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^46.1.0",
-		"@atlaskit/editor-common": "^96.0.0",
+		"@atlaskit/editor-common": "^96.3.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^1.2.0",
 		"@atlaskit/editor-plugin-analytics": "^1.10.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^1.3.0",
 		"@atlaskit/editor-plugin-feature-flags": "^1.2.0",
-		"@atlaskit/editor-plugin-quick-insert": "^1.7.0",
+		"@atlaskit/editor-plugin-quick-insert": "^1.8.0",
 		"@atlaskit/editor-plugin-width": "^1.3.0",
 		"@atlaskit/editor-prosemirror": "6.2.1",
 		"@atlaskit/editor-shared-styles": "^3.2.0",
 		"@atlaskit/editor-tables": "^2.8.0",
-		"@atlaskit/icon": "^23.0.0",
+		"@atlaskit/icon": "^23.1.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@atlaskit/pragmatic-drag-and-drop": "^1.4.0",
-		"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^2.0.0",
+		"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^2.1.0",
 		"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^1.1.0",
 		"@atlaskit/primitives": "^13.3.0",
 		"@atlaskit/theme": "^14.0.0",
-		"@atlaskit/tmp-editor-statsig": "^2.22.0",
+		"@atlaskit/tmp-editor-statsig": "^2.23.0",
 		"@atlaskit/tokens": "^2.4.0",
 		"@atlaskit/tooltip": "^18.9.0",
 		"@babel/runtime": "^7.0.0",
@@ -165,6 +165,9 @@
 		},
 		"platform_editor_use_nested_table_pm_nodes": {
 			"type": "boolean"
+		},
+		"platform_editor_advanced_layouts_post_fix_patch_1": {
+			"type": "boolean"
 		}
 	}
 }