@atlaskit/editor-plugin-block-controls 3.8.7 → 3.8.8

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 3.8.8
+
+### Patch Changes
+
+- [#138622](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/138622)
+  [`09f425c925d38`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/09f425c925d38) -
+  Add support for quick insert in cell selection
+
 ## 3.8.7
 
 ### Patch Changes

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

@@ -84,17 +84,13 @@ function transformSourceSlice(nodeCopy, destType) {
   }
   return nodeCopy;
 }
-var isDragLayoutColumnToTopLevel = function isDragLayoutColumnToTopLevel($from, $to) {
+var nodesSupportDragLayoutColumnInto = ['tableCell', 'tableHeader', 'panel', 'expand', 'nestedExpand'];
+var isDragLayoutColumnIntoSupportedNodes = function isDragLayoutColumnIntoSupportedNodes($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;
-};
-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');
-};
-var isDragLayoutColumnIntoPanel = function isDragLayoutColumnIntoPanel($from, $to) {
-  var _$from$nodeAfter3;
-  return ((_$from$nodeAfter3 = $from.nodeAfter) === null || _$from$nodeAfter3 === void 0 ? void 0 : _$from$nodeAfter3.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && $to.parent.type.name === 'panel';
+  var isTopLevel = $to.depth === 0;
+  var isDragIntoNodes = nodesSupportDragLayoutColumnInto.includes($to.parent.type.name);
+  var supportedCondition = (0, _platformFeatureFlags.fg)('platform_editor_drag_layout_column_into_nodes') ? isDragIntoNodes || isTopLevel : isTopLevel;
+  return ((_$from$nodeAfter = $from.nodeAfter) === null || _$from$nodeAfter === void 0 ? void 0 : _$from$nodeAfter.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && supportedCondition;
 };
 
 /**
@@ -383,19 +379,15 @@ 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);
-      var dragLayoutColumnIntoPanel = isDragLayoutColumnIntoPanel($handlePos, $to);
 
       //TODO: ED-26959 - Does this need to be updated with new selection logic above? ^
-      // Move a layout column to top level
-      // Move a layout column into a table cell, only moves the content into the cell
-      // Move a layout column into a panel, only moves the content into the panel
-      if (sourceNode && (dragLayoutColumnToTopLevel || dragLayoutColumnIntoTable || dragLayoutColumnIntoPanel)) {
+      // Move a layout column to top level, or table cell, or panel, or expand, only moves the content into them
+      if (sourceNode && isDragLayoutColumnIntoSupportedNodes($handlePos, $to)) {
         // need update after we support single column layout.
         var layoutColumnContent = sourceNode.content;
         var fragment;
-        if (dragLayoutColumnIntoTable) {
+        // if drop into table, and layout column contains expand, transform it to nestedExpand
+        if (['tableCell', 'tableHeader'].includes($to.parent.type.name)) {
           var contentContainsExpand = (0, _utils2.findChildrenByType)(sourceNode, expand).length > 0;
           fragment = contentContainsExpand ? (0, _validation.transformFragmentExpandToNestedExpand)(_model.Fragment.from(layoutColumnContent)) : _model.Fragment.from(layoutColumnContent);
           if (!fragment) {

package/dist/cjs/pm-plugins/first-node-dec-plugin.js

@@ -10,7 +10,6 @@ var _transform = require("@atlaskit/editor-prosemirror/transform");
 var _view = require("@atlaskit/editor-prosemirror/view");
 var firstNodeDecPluginKey = exports.firstNodeDecPluginKey = new _state.PluginKey('firstNodeDec');
 var createFirstNodeDecSet = function createFirstNodeDecSet(state) {
-  ;
   var firstNode = state.doc.firstChild;
   if (!firstNode) {
     return _view.DecorationSet.empty;

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

@@ -90,8 +90,8 @@ var memoizedTransformExpandToNestedExpand = exports.memoizedTransformExpandToNes
 });
 var canCreateNodeWithContentInsideAnotherNode = exports.canCreateNodeWithContentInsideAnotherNode = function canCreateNodeWithContentInsideAnotherNode(nodeTypesToCreate, nodeWithTargetFragment) {
   try {
-    return !!nodeTypesToCreate.every(function (nodeType) {
-      return nodeType.createChecked({}, nodeWithTargetFragment);
+    return !!nodeTypesToCreate.every(function (nodeTypeToCreate) {
+      return nodeTypeToCreate.createChecked({}, nodeWithTargetFragment);
     });
   } catch (e) {
     return false;
@@ -100,24 +100,29 @@ var canCreateNodeWithContentInsideAnotherNode = exports.canCreateNodeWithContent
 function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos, destNode) {
   var srcNodeType = srcNode.type;
   var schema = srcNodeType.schema;
-  var destParentNodeType = destParent === null || destParent === void 0 ? void 0 : destParent.type.name;
-  var activeNodeType = srcNode === null || srcNode === void 0 ? void 0 : srcNode.type.name;
+  var _schema$nodes = schema.nodes,
+    table = _schema$nodes.table,
+    tableCell = _schema$nodes.tableCell,
+    tableHeader = _schema$nodes.tableHeader,
+    expand = _schema$nodes.expand,
+    nestedExpand = _schema$nodes.nestedExpand,
+    doc = _schema$nodes.doc,
+    panel = _schema$nodes.panel,
+    layoutColumn = _schema$nodes.layoutColumn,
+    layoutSection = _schema$nodes.layoutSection;
+  var destParentNodeType = destParent === null || destParent === void 0 ? void 0 : destParent.type;
+  var activeNodeType = srcNode === null || srcNode === void 0 ? void 0 : srcNode.type;
   var layoutColumnContent = srcNode.content;
   var isNestingTablesSupported = (0, _platformFeatureFlags.fg)('platform_editor_use_nested_table_pm_nodes') && (0, _experiments.editorExperiment)('nested-tables-in-tables', true, {
     exposure: true
   });
-  var tableNodeType = schema.nodes.table;
-  if (activeNodeType === 'layoutColumn' && (0, _experiments.editorExperiment)('advanced_layouts', true)) {
+  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' || destParentNodeType === 'doc') {
+    if ((destNode === null || destNode === void 0 ? void 0 : destNode.type) === layoutSection || destParentNodeType === doc) {
       return true;
     }
     if ((0, _platformFeatureFlags.fg)('platform_editor_drag_layout_column_into_nodes')) {
-      if (destParentNodeType === 'tableCell' || destParentNodeType === 'tableHeader') {
-        var _schema$nodes = schema.nodes,
-          tableCell = _schema$nodes.tableCell,
-          tableHeader = _schema$nodes.tableHeader,
-          expand = _schema$nodes.expand;
+      if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
         var contentContainsExpand = (0, _utils.findChildrenByType)(srcNode, expand).length > 0;
         //convert expand to nestedExpand if there are expands inside the layout column
         // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
@@ -127,36 +132,41 @@ function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos,
         }
         return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
       }
-      if (destParentNodeType === 'panel') {
-        var panel = schema.nodes.panel;
+      if (destParentNodeType === panel) {
         return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
       }
+      if (destParentNodeType === expand) {
+        return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
+      }
+      if (destParentNodeType === nestedExpand) {
+        return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
+      }
     }
   }
 
   // Place experiments here instead of just inside move-node.ts as it stops the drag marker from appearing.
   if ((0, _experiments.editorExperiment)('nested-expand-in-expand', false)) {
-    if (destParentNodeType === 'expand' && (activeNodeType === 'expand' || activeNodeType === 'nestedExpand')) {
+    if (destParentNodeType === expand && (activeNodeType === expand || activeNodeType === nestedExpand)) {
       return false;
     }
   }
 
   // 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 ((destParentNodeType === 'tableCell' || destParentNodeType === 'tableHeader') && activeNodeType === 'table') {
-    var nestingDepth = (0, _nesting.getParentOfTypeCount)(tableNodeType)($destNodePos);
+  if ((destParentNodeType === tableCell || destParentNodeType === tableHeader) && activeNodeType === table) {
+    var nestingDepth = (0, _nesting.getParentOfTypeCount)(table)($destNodePos);
     if (!isNestingTablesSupported || isNestingTablesSupported && nestingDepth > 1) {
       return false;
     }
   }
   if (isInsideTable(destParent.type) && isExpand(srcNodeType)) {
     if (memoizedTransformExpandToNestedExpand(srcNode)) {
-      srcNodeType = schema.nodes.nestedExpand;
+      srcNodeType = nestedExpand;
     } else {
       return false;
     }
   } else if ((isDoc(destParent.type) || isLayoutColumn(destParent.type)) && isNestedExpand(srcNodeType)) {
-    srcNodeType = schema.nodes.expand;
+    srcNodeType = expand;
   }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }

package/dist/cjs/ui/quick-insert-button.js

@@ -15,6 +15,7 @@ var _messages = require("@atlaskit/editor-common/messages");
 var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
+var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 var _add = _interopRequireDefault(require("@atlaskit/icon/utility/add"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
@@ -206,10 +207,11 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
     if (start !== undefined) {
       // if the selection is not within the node this decoration is rendered at
       // or the node is non-editable, then insert a newline and trigger quick insert
-      if (!(0, _documentChecks.isSelectionInNode)(start, view) || (0, _documentChecks.isNonEditableBlock)(start, view)) {
+      var isSelectionInsideNode = (0, _documentChecks.isSelectionInNode)(start, view);
+      if (!isSelectionInsideNode || (0, _documentChecks.isNonEditableBlock)(start, view)) {
         api.core.actions.execute((0, _editorCommands.createNewLine)(start));
       }
-      if ((0, _documentChecks.isSelectionInNode)(start, view)) {
+      if (isSelectionInsideNode) {
         // text or element with be deselected and the / added immediately after the paragraph
         // unless the selection is empty
         var currentSelection = view.state.selection;
@@ -246,6 +248,24 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
             });
           }
         }
+        if (currentSelection instanceof _cellSelection.CellSelection && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_4')) {
+          // find the last inline position in the selection
+          var lastInlinePosition = _state.TextSelection.near(view.state.selection.$to, -1);
+          lastInlinePosition && api.core.actions.execute(function (_ref4) {
+            var tr = _ref4.tr;
+            if (!(lastInlinePosition instanceof _state.TextSelection)) {
+              // this will create a new line after the node
+              (0, _editorCommands.createNewLine)(lastInlinePosition.from)({
+                tr: tr
+              });
+              // this will find the next valid text position after the node
+              tr.setSelection(_state.TextSelection.create(tr.doc, lastInlinePosition.to));
+            } else {
+              tr.setSelection(lastInlinePosition);
+            }
+            return tr;
+          });
+        }
       }
     }
     (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 || _api$quickInsert.actions.openTypeAhead('blockControl', true);
@@ -293,16 +313,16 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
     xcss: [tooltipContainerStyles]
   }, tooltipPressable()) : tooltipPressable());
 };
-var QuickInsertWithVisibility = exports.QuickInsertWithVisibility = function QuickInsertWithVisibility(_ref4) {
-  var view = _ref4.view,
-    api = _ref4.api,
-    formatMessage = _ref4.formatMessage,
-    getPos = _ref4.getPos,
-    nodeType = _ref4.nodeType,
-    anchorName = _ref4.anchorName,
-    rootAnchorName = _ref4.rootAnchorName,
-    rootNodeType = _ref4.rootNodeType,
-    anchorRectCache = _ref4.anchorRectCache;
+var QuickInsertWithVisibility = exports.QuickInsertWithVisibility = function QuickInsertWithVisibility(_ref5) {
+  var view = _ref5.view,
+    api = _ref5.api,
+    formatMessage = _ref5.formatMessage,
+    getPos = _ref5.getPos,
+    nodeType = _ref5.nodeType,
+    anchorName = _ref5.anchorName,
+    rootAnchorName = _ref5.rootAnchorName,
+    rootNodeType = _ref5.rootNodeType,
+    anchorRectCache = _ref5.anchorRectCache;
   return /*#__PURE__*/_react.default.createElement(_visibilityContainer.VisibilityContainer, {
     api: api
   }, /*#__PURE__*/_react.default.createElement(TypeAheadControl, {

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

@@ -77,17 +77,13 @@ function transformSourceSlice(nodeCopy, destType) {
   }
   return nodeCopy;
 }
-const isDragLayoutColumnToTopLevel = ($from, $to) => {
+const nodesSupportDragLayoutColumnInto = ['tableCell', 'tableHeader', 'panel', 'expand', 'nestedExpand'];
+const isDragLayoutColumnIntoSupportedNodes = ($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');
-};
-const isDragLayoutColumnIntoPanel = ($from, $to) => {
-  var _$from$nodeAfter3;
-  return ((_$from$nodeAfter3 = $from.nodeAfter) === null || _$from$nodeAfter3 === void 0 ? void 0 : _$from$nodeAfter3.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && $to.parent.type.name === 'panel';
+  const isTopLevel = $to.depth === 0;
+  const isDragIntoNodes = nodesSupportDragLayoutColumnInto.includes($to.parent.type.name);
+  const supportedCondition = fg('platform_editor_drag_layout_column_into_nodes') ? isDragIntoNodes || isTopLevel : isTopLevel;
+  return ((_$from$nodeAfter = $from.nodeAfter) === null || _$from$nodeAfter === void 0 ? void 0 : _$from$nodeAfter.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && supportedCondition;
 };
 
 /**
@@ -386,19 +382,15 @@ 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);
-  const dragLayoutColumnIntoPanel = isDragLayoutColumnIntoPanel($handlePos, $to);
 
   //TODO: ED-26959 - Does this need to be updated with new selection logic above? ^
-  // Move a layout column to top level
-  // Move a layout column into a table cell, only moves the content into the cell
-  // Move a layout column into a panel, only moves the content into the panel
-  if (sourceNode && (dragLayoutColumnToTopLevel || dragLayoutColumnIntoTable || dragLayoutColumnIntoPanel)) {
+  // Move a layout column to top level, or table cell, or panel, or expand, only moves the content into them
+  if (sourceNode && isDragLayoutColumnIntoSupportedNodes($handlePos, $to)) {
     // need update after we support single column layout.
     const layoutColumnContent = sourceNode.content;
     let fragment;
-    if (dragLayoutColumnIntoTable) {
+    // if drop into table, and layout column contains expand, transform it to nestedExpand
+    if (['tableCell', 'tableHeader'].includes($to.parent.type.name)) {
       const contentContainsExpand = findChildrenByType(sourceNode, expand).length > 0;
       fragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(Fragment.from(layoutColumnContent)) : Fragment.from(layoutColumnContent);
       if (!fragment) {

package/dist/es2019/pm-plugins/first-node-dec-plugin.js

@@ -4,7 +4,6 @@ import { ReplaceAroundStep, ReplaceStep } from '@atlaskit/editor-prosemirror/tra
 import { DecorationSet, Decoration } from '@atlaskit/editor-prosemirror/view';
 export const firstNodeDecPluginKey = new PluginKey('firstNodeDec');
 const createFirstNodeDecSet = state => {
-  ;
   const firstNode = state.doc.firstChild;
   if (!firstNode) {
     return DecorationSet.empty;

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

@@ -82,7 +82,7 @@ export const memoizedTransformExpandToNestedExpand = memoizeOne(node => {
 });
 export const canCreateNodeWithContentInsideAnotherNode = (nodeTypesToCreate, nodeWithTargetFragment) => {
   try {
-    return !!nodeTypesToCreate.every(nodeType => nodeType.createChecked({}, nodeWithTargetFragment));
+    return !!nodeTypesToCreate.every(nodeTypeToCreate => nodeTypeToCreate.createChecked({}, nodeWithTargetFragment));
   } catch (e) {
     return false;
   }
@@ -90,25 +90,30 @@ export const canCreateNodeWithContentInsideAnotherNode = (nodeTypesToCreate, nod
 export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos, destNode) {
   let srcNodeType = srcNode.type;
   const schema = srcNodeType.schema;
-  const destParentNodeType = destParent === null || destParent === void 0 ? void 0 : destParent.type.name;
-  const activeNodeType = srcNode === null || srcNode === void 0 ? void 0 : srcNode.type.name;
+  const {
+    table,
+    tableCell,
+    tableHeader,
+    expand,
+    nestedExpand,
+    doc,
+    panel,
+    layoutColumn,
+    layoutSection
+  } = schema.nodes;
+  const destParentNodeType = destParent === null || destParent === void 0 ? void 0 : destParent.type;
+  const activeNodeType = srcNode === null || srcNode === void 0 ? void 0 : srcNode.type;
   const layoutColumnContent = srcNode.content;
   const isNestingTablesSupported = fg('platform_editor_use_nested_table_pm_nodes') && editorExperiment('nested-tables-in-tables', true, {
     exposure: true
   });
-  const tableNodeType = schema.nodes.table;
-  if (activeNodeType === 'layoutColumn' && editorExperiment('advanced_layouts', true)) {
+  if (activeNodeType === layoutColumn && 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' || destParentNodeType === 'doc') {
+    if ((destNode === null || destNode === void 0 ? void 0 : destNode.type) === layoutSection || destParentNodeType === doc) {
       return true;
     }
     if (fg('platform_editor_drag_layout_column_into_nodes')) {
-      if (destParentNodeType === 'tableCell' || destParentNodeType === 'tableHeader') {
-        const {
-          tableCell,
-          tableHeader,
-          expand
-        } = schema.nodes;
+      if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
         const contentContainsExpand = findChildrenByType(srcNode, expand).length > 0;
         //convert expand to nestedExpand if there are expands inside the layout column
         // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
@@ -118,38 +123,41 @@ export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNo
         }
         return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
       }
-      if (destParentNodeType === 'panel') {
-        const {
-          panel
-        } = schema.nodes;
+      if (destParentNodeType === panel) {
         return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
       }
+      if (destParentNodeType === expand) {
+        return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
+      }
+      if (destParentNodeType === nestedExpand) {
+        return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
+      }
     }
   }
 
   // Place experiments here instead of just inside move-node.ts as it stops the drag marker from appearing.
   if (editorExperiment('nested-expand-in-expand', false)) {
-    if (destParentNodeType === 'expand' && (activeNodeType === 'expand' || activeNodeType === 'nestedExpand')) {
+    if (destParentNodeType === expand && (activeNodeType === expand || activeNodeType === nestedExpand)) {
       return false;
     }
   }
 
   // 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 ((destParentNodeType === 'tableCell' || destParentNodeType === 'tableHeader') && activeNodeType === 'table') {
-    const nestingDepth = getParentOfTypeCount(tableNodeType)($destNodePos);
+  if ((destParentNodeType === tableCell || destParentNodeType === tableHeader) && activeNodeType === table) {
+    const nestingDepth = getParentOfTypeCount(table)($destNodePos);
     if (!isNestingTablesSupported || isNestingTablesSupported && nestingDepth > 1) {
       return false;
     }
   }
   if (isInsideTable(destParent.type) && isExpand(srcNodeType)) {
     if (memoizedTransformExpandToNestedExpand(srcNode)) {
-      srcNodeType = schema.nodes.nestedExpand;
+      srcNodeType = nestedExpand;
     } else {
       return false;
     }
   } else if ((isDoc(destParent.type) || isLayoutColumn(destParent.type)) && isNestedExpand(srcNodeType)) {
-    srcNodeType = schema.nodes.expand;
+    srcNodeType = expand;
   }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }

package/dist/es2019/ui/quick-insert-button.js

@@ -5,6 +5,7 @@ import { blockControlsMessages as messages } from '@atlaskit/editor-common/messa
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNode } from '@atlaskit/editor-prosemirror/utils';
+import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import AddIcon from '@atlaskit/icon/utility/add';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Pressable, xcss } from '@atlaskit/primitives';
@@ -192,10 +193,11 @@ export const TypeAheadControl = ({
     if (start !== undefined) {
       // if the selection is not within the node this decoration is rendered at
       // or the node is non-editable, then insert a newline and trigger quick insert
-      if (!isSelectionInNode(start, view) || isNonEditableBlock(start, view)) {
+      const isSelectionInsideNode = isSelectionInNode(start, view);
+      if (!isSelectionInsideNode || isNonEditableBlock(start, view)) {
         api.core.actions.execute(createNewLine(start));
       }
-      if (isSelectionInNode(start, view)) {
+      if (isSelectionInsideNode) {
         // text or element with be deselected and the / added immediately after the paragraph
         // unless the selection is empty
         const currentSelection = view.state.selection;
@@ -232,6 +234,25 @@ export const TypeAheadControl = ({
             });
           }
         }
+        if (currentSelection instanceof CellSelection && fg('platform_editor_controls_patch_4')) {
+          // find the last inline position in the selection
+          const lastInlinePosition = TextSelection.near(view.state.selection.$to, -1);
+          lastInlinePosition && api.core.actions.execute(({
+            tr
+          }) => {
+            if (!(lastInlinePosition instanceof TextSelection)) {
+              // this will create a new line after the node
+              createNewLine(lastInlinePosition.from)({
+                tr
+              });
+              // this will find the next valid text position after the node
+              tr.setSelection(TextSelection.create(tr.doc, lastInlinePosition.to));
+            } else {
+              tr.setSelection(lastInlinePosition);
+            }
+            return tr;
+          });
+        }
       }
     }
     (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 ? void 0 : _api$quickInsert.actions.openTypeAhead('blockControl', true);

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

@@ -78,17 +78,13 @@ function transformSourceSlice(nodeCopy, destType) {
   }
   return nodeCopy;
 }
-var isDragLayoutColumnToTopLevel = function isDragLayoutColumnToTopLevel($from, $to) {
+var nodesSupportDragLayoutColumnInto = ['tableCell', 'tableHeader', 'panel', 'expand', 'nestedExpand'];
+var isDragLayoutColumnIntoSupportedNodes = function isDragLayoutColumnIntoSupportedNodes($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;
-};
-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');
-};
-var isDragLayoutColumnIntoPanel = function isDragLayoutColumnIntoPanel($from, $to) {
-  var _$from$nodeAfter3;
-  return ((_$from$nodeAfter3 = $from.nodeAfter) === null || _$from$nodeAfter3 === void 0 ? void 0 : _$from$nodeAfter3.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && $to.parent.type.name === 'panel';
+  var isTopLevel = $to.depth === 0;
+  var isDragIntoNodes = nodesSupportDragLayoutColumnInto.includes($to.parent.type.name);
+  var supportedCondition = fg('platform_editor_drag_layout_column_into_nodes') ? isDragIntoNodes || isTopLevel : isTopLevel;
+  return ((_$from$nodeAfter = $from.nodeAfter) === null || _$from$nodeAfter === void 0 ? void 0 : _$from$nodeAfter.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && supportedCondition;
 };
 
 /**
@@ -377,19 +373,15 @@ export var 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);
-      var dragLayoutColumnIntoPanel = isDragLayoutColumnIntoPanel($handlePos, $to);
 
       //TODO: ED-26959 - Does this need to be updated with new selection logic above? ^
-      // Move a layout column to top level
-      // Move a layout column into a table cell, only moves the content into the cell
-      // Move a layout column into a panel, only moves the content into the panel
-      if (sourceNode && (dragLayoutColumnToTopLevel || dragLayoutColumnIntoTable || dragLayoutColumnIntoPanel)) {
+      // Move a layout column to top level, or table cell, or panel, or expand, only moves the content into them
+      if (sourceNode && isDragLayoutColumnIntoSupportedNodes($handlePos, $to)) {
         // need update after we support single column layout.
         var layoutColumnContent = sourceNode.content;
         var fragment;
-        if (dragLayoutColumnIntoTable) {
+        // if drop into table, and layout column contains expand, transform it to nestedExpand
+        if (['tableCell', 'tableHeader'].includes($to.parent.type.name)) {
           var contentContainsExpand = findChildrenByType(sourceNode, expand).length > 0;
           fragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(Fragment.from(layoutColumnContent)) : Fragment.from(layoutColumnContent);
           if (!fragment) {

package/dist/esm/pm-plugins/first-node-dec-plugin.js

@@ -4,7 +4,6 @@ import { ReplaceAroundStep, ReplaceStep } from '@atlaskit/editor-prosemirror/tra
 import { DecorationSet, Decoration } from '@atlaskit/editor-prosemirror/view';
 export var firstNodeDecPluginKey = new PluginKey('firstNodeDec');
 var createFirstNodeDecSet = function createFirstNodeDecSet(state) {
-  ;
   var firstNode = state.doc.firstChild;
   if (!firstNode) {
     return DecorationSet.empty;

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

@@ -80,8 +80,8 @@ export var memoizedTransformExpandToNestedExpand = memoizeOne(function (node) {
 });
 export var canCreateNodeWithContentInsideAnotherNode = function canCreateNodeWithContentInsideAnotherNode(nodeTypesToCreate, nodeWithTargetFragment) {
   try {
-    return !!nodeTypesToCreate.every(function (nodeType) {
-      return nodeType.createChecked({}, nodeWithTargetFragment);
+    return !!nodeTypesToCreate.every(function (nodeTypeToCreate) {
+      return nodeTypeToCreate.createChecked({}, nodeWithTargetFragment);
     });
   } catch (e) {
     return false;
@@ -90,24 +90,29 @@ export var canCreateNodeWithContentInsideAnotherNode = function canCreateNodeWit
 export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos, destNode) {
   var srcNodeType = srcNode.type;
   var schema = srcNodeType.schema;
-  var destParentNodeType = destParent === null || destParent === void 0 ? void 0 : destParent.type.name;
-  var activeNodeType = srcNode === null || srcNode === void 0 ? void 0 : srcNode.type.name;
+  var _schema$nodes = schema.nodes,
+    table = _schema$nodes.table,
+    tableCell = _schema$nodes.tableCell,
+    tableHeader = _schema$nodes.tableHeader,
+    expand = _schema$nodes.expand,
+    nestedExpand = _schema$nodes.nestedExpand,
+    doc = _schema$nodes.doc,
+    panel = _schema$nodes.panel,
+    layoutColumn = _schema$nodes.layoutColumn,
+    layoutSection = _schema$nodes.layoutSection;
+  var destParentNodeType = destParent === null || destParent === void 0 ? void 0 : destParent.type;
+  var activeNodeType = srcNode === null || srcNode === void 0 ? void 0 : srcNode.type;
   var layoutColumnContent = srcNode.content;
   var isNestingTablesSupported = fg('platform_editor_use_nested_table_pm_nodes') && editorExperiment('nested-tables-in-tables', true, {
     exposure: true
   });
-  var tableNodeType = schema.nodes.table;
-  if (activeNodeType === 'layoutColumn' && editorExperiment('advanced_layouts', true)) {
+  if (activeNodeType === layoutColumn && 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' || destParentNodeType === 'doc') {
+    if ((destNode === null || destNode === void 0 ? void 0 : destNode.type) === layoutSection || destParentNodeType === doc) {
       return true;
     }
     if (fg('platform_editor_drag_layout_column_into_nodes')) {
-      if (destParentNodeType === 'tableCell' || destParentNodeType === 'tableHeader') {
-        var _schema$nodes = schema.nodes,
-          tableCell = _schema$nodes.tableCell,
-          tableHeader = _schema$nodes.tableHeader,
-          expand = _schema$nodes.expand;
+      if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
         var contentContainsExpand = findChildrenByType(srcNode, expand).length > 0;
         //convert expand to nestedExpand if there are expands inside the layout column
         // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
@@ -117,36 +122,41 @@ export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNo
         }
         return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
       }
-      if (destParentNodeType === 'panel') {
-        var panel = schema.nodes.panel;
+      if (destParentNodeType === panel) {
         return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
       }
+      if (destParentNodeType === expand) {
+        return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
+      }
+      if (destParentNodeType === nestedExpand) {
+        return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
+      }
     }
   }
 
   // Place experiments here instead of just inside move-node.ts as it stops the drag marker from appearing.
   if (editorExperiment('nested-expand-in-expand', false)) {
-    if (destParentNodeType === 'expand' && (activeNodeType === 'expand' || activeNodeType === 'nestedExpand')) {
+    if (destParentNodeType === expand && (activeNodeType === expand || activeNodeType === nestedExpand)) {
       return false;
     }
   }
 
   // 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 ((destParentNodeType === 'tableCell' || destParentNodeType === 'tableHeader') && activeNodeType === 'table') {
-    var nestingDepth = getParentOfTypeCount(tableNodeType)($destNodePos);
+  if ((destParentNodeType === tableCell || destParentNodeType === tableHeader) && activeNodeType === table) {
+    var nestingDepth = getParentOfTypeCount(table)($destNodePos);
     if (!isNestingTablesSupported || isNestingTablesSupported && nestingDepth > 1) {
       return false;
     }
   }
   if (isInsideTable(destParent.type) && isExpand(srcNodeType)) {
     if (memoizedTransformExpandToNestedExpand(srcNode)) {
-      srcNodeType = schema.nodes.nestedExpand;
+      srcNodeType = nestedExpand;
     } else {
       return false;
     }
   } else if ((isDoc(destParent.type) || isLayoutColumn(destParent.type)) && isNestedExpand(srcNodeType)) {
-    srcNodeType = schema.nodes.expand;
+    srcNodeType = expand;
   }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }

package/dist/esm/ui/quick-insert-button.js

@@ -9,6 +9,7 @@ import { blockControlsMessages as messages } from '@atlaskit/editor-common/messa
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNode } from '@atlaskit/editor-prosemirror/utils';
+import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import AddIcon from '@atlaskit/icon/utility/add';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Pressable, xcss } from '@atlaskit/primitives';
@@ -196,10 +197,11 @@ export var TypeAheadControl = function TypeAheadControl(_ref) {
     if (start !== undefined) {
       // if the selection is not within the node this decoration is rendered at
       // or the node is non-editable, then insert a newline and trigger quick insert
-      if (!isSelectionInNode(start, view) || isNonEditableBlock(start, view)) {
+      var isSelectionInsideNode = isSelectionInNode(start, view);
+      if (!isSelectionInsideNode || isNonEditableBlock(start, view)) {
         api.core.actions.execute(createNewLine(start));
       }
-      if (isSelectionInNode(start, view)) {
+      if (isSelectionInsideNode) {
         // text or element with be deselected and the / added immediately after the paragraph
         // unless the selection is empty
         var currentSelection = view.state.selection;
@@ -236,6 +238,24 @@ export var TypeAheadControl = function TypeAheadControl(_ref) {
             });
           }
         }
+        if (currentSelection instanceof CellSelection && fg('platform_editor_controls_patch_4')) {
+          // find the last inline position in the selection
+          var lastInlinePosition = TextSelection.near(view.state.selection.$to, -1);
+          lastInlinePosition && api.core.actions.execute(function (_ref4) {
+            var tr = _ref4.tr;
+            if (!(lastInlinePosition instanceof TextSelection)) {
+              // this will create a new line after the node
+              createNewLine(lastInlinePosition.from)({
+                tr: tr
+              });
+              // this will find the next valid text position after the node
+              tr.setSelection(TextSelection.create(tr.doc, lastInlinePosition.to));
+            } else {
+              tr.setSelection(lastInlinePosition);
+            }
+            return tr;
+          });
+        }
       }
     }
     (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 || _api$quickInsert.actions.openTypeAhead('blockControl', true);
@@ -283,16 +303,16 @@ export var TypeAheadControl = function TypeAheadControl(_ref) {
     xcss: [tooltipContainerStyles]
   }, tooltipPressable()) : tooltipPressable());
 };
-export var QuickInsertWithVisibility = function QuickInsertWithVisibility(_ref4) {
-  var view = _ref4.view,
-    api = _ref4.api,
-    formatMessage = _ref4.formatMessage,
-    getPos = _ref4.getPos,
-    nodeType = _ref4.nodeType,
-    anchorName = _ref4.anchorName,
-    rootAnchorName = _ref4.rootAnchorName,
-    rootNodeType = _ref4.rootNodeType,
-    anchorRectCache = _ref4.anchorRectCache;
+export var QuickInsertWithVisibility = function QuickInsertWithVisibility(_ref5) {
+  var view = _ref5.view,
+    api = _ref5.api,
+    formatMessage = _ref5.formatMessage,
+    getPos = _ref5.getPos,
+    nodeType = _ref5.nodeType,
+    anchorName = _ref5.anchorName,
+    rootAnchorName = _ref5.rootAnchorName,
+    rootNodeType = _ref5.rootNodeType,
+    anchorRectCache = _ref5.anchorRectCache;
   return /*#__PURE__*/React.createElement(VisibilityContainer, {
     api: api
   }, /*#__PURE__*/React.createElement(TypeAheadControl, {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "3.8.7",
+	"version": "3.8.8",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -33,7 +33,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^47.6.0",
-		"@atlaskit/editor-common": "^103.1.0",
+		"@atlaskit/editor-common": "^103.3.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^2.0.0",
 		"@atlaskit/editor-plugin-analytics": "^2.2.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
@@ -176,6 +176,9 @@
 		},
 		"platform_editor_controls_widget_visibility": {
 			"type": "boolean"
+		},
+		"platform_editor_controls_patch_4": {
+			"type": "boolean"
 		}
 	}
 }