@atlaskit/editor-plugin-expand 2.6.1 → 2.6.3

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/editor-plugin-expand
 
+## 2.6.3
+
+### Patch Changes
+
+- [#139631](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/139631)
+  [`0c5d47f791446`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0c5d47f791446) -
+  ED-24839 - Added logic to handleDrop for the expand plugin so nested expands are converted to
+  expand nodes when dragged outside of an expand. Prosemirror was automatically wrapping them in an
+  empty parent expand.
+
+## 2.6.2
+
+### Patch Changes
+
+- [#139052](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/139052)
+  [`6e5c1f6bbf028`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/6e5c1f6bbf028) -
+  removed 'platform' from cardPlugin configs
+- Updated dependencies
+
 ## 2.6.1
 
 ### Patch Changes

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

@@ -6,10 +6,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.containsClass = containsClass;
 exports.createPlugin = void 0;
+exports.handleDraggingOfNestedExpand = handleDraggingOfNestedExpand;
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _selection = require("@atlaskit/editor-common/selection");
 var _styles = require("@atlaskit/editor-common/styles");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _commands = require("../commands");
 var _nodeviews = _interopRequireDefault(require("../nodeviews"));
 var _utils2 = require("../utils");
@@ -25,7 +27,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getInt
   var allowInteractiveExpand = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : true;
   var __livePage = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
   var state = (0, _pluginFactory.createPluginState)(dispatch, {});
-  var isMobile = appearance === 'mobile';
+  var isMobile = false;
   return new _safePlugin.SafePlugin({
     state: state,
     key: _pluginFactory.pluginKey,
@@ -59,7 +61,13 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getInt
         return target.classList.contains(_styles.expandClassNames.prefix);
       }, {
         useLongPressSelection: useLongPressSelection
-      })
+      }),
+      handleDrop: function handleDrop(view, event, slice, moved) {
+        if ((0, _platformFeatureFlags.fg)('platform_editor_nest_nested_expand_drag_fix')) {
+          return handleDraggingOfNestedExpand(view, event, slice);
+        }
+        return false;
+      }
     },
     // @see ED-8027 to follow up on this work-around
     filterTransaction: function filterTransaction(tr) {
@@ -85,4 +93,51 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getInt
       };
     }
   });
-};
+};
+
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+function handleDraggingOfNestedExpand(view, event, slice) {
+  var _slice$content$firstC;
+  var state = view.state,
+    dispatch = view.dispatch;
+  var tr = state.tr;
+  var selection = state.selection;
+  var from = selection.from,
+    to = selection.to;
+  var supportedDropLocations = [state.schema.nodes.doc, state.schema.nodes.layoutSection, state.schema.nodes.layoutColumn];
+
+  // Check if the contents of the dragged slice contain a nested expand node.
+  if (((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) !== state.schema.nodes.nestedExpand) {
+    return false;
+  }
+  var dropPos = view.posAtCoords({
+    left: event.clientX,
+    top: event.clientY
+  });
+  if (!dropPos) {
+    return false;
+  }
+  var resolvedPos = state.doc.resolve(dropPos.pos);
+
+  // If not dropping into the root of the document, check if the parent node type of the drop location is supported.
+  if (resolvedPos.depth > 1) {
+    var parentNodeType = resolvedPos.node(resolvedPos.depth - 1).type;
+    // If you're not dropping into a doc or layoutSection, don't transform the nested expand, return false and allow default behaviour.
+    if (!supportedDropLocations.includes(parentNodeType)) {
+      return false;
+    }
+  }
+  var updatedSlice = (0, _utils2.transformSliceNestedExpandToExpand)(slice, state.schema);
+  if (updatedSlice.eq(slice)) {
+    return false;
+  }
+
+  // The drop position will be affected when the original slice is deleted from the document.
+  var updatedDropPos = dropPos.pos > from ? dropPos.pos - updatedSlice.content.size : dropPos.pos;
+  tr.delete(from, to);
+  tr.insert(updatedDropPos, updatedSlice.content);
+  dispatch(tr);
+  return true;
+}

package/dist/cjs/legacyExpand/ui/ExpandIconButton.js

@@ -24,10 +24,10 @@ var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _excluded = ["buttonStyles"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx

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

@@ -5,12 +5,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.containsClass = containsClass;
-exports.pluginKey = exports.createPlugin = void 0;
+exports.createPlugin = void 0;
+exports.handleDraggingOfNestedExpand = handleDraggingOfNestedExpand;
+exports.pluginKey = void 0;
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _selection = require("@atlaskit/editor-common/selection");
 var _styles = require("@atlaskit/editor-common/styles");
 var _state = require("@atlaskit/editor-prosemirror/state");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _nodeViews = _interopRequireDefault(require("../node-views"));
+var _utils = require("../utils");
 var pluginKey = exports.pluginKey = new _state.PluginKey('expandPlugin');
 function containsClass(element, className) {
   var _element$classList;
@@ -22,7 +26,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getInt
   var api = arguments.length > 4 ? arguments[4] : undefined;
   var allowInteractiveExpand = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : true;
   var __livePage = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
-  var isMobile = appearance === 'mobile';
+  var isMobile = false;
   return new _safePlugin.SafePlugin({
     key: pluginKey,
     props: {
@@ -55,7 +59,13 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getInt
         return target.classList.contains(_styles.expandClassNames.prefix);
       }, {
         useLongPressSelection: useLongPressSelection
-      })
+      }),
+      handleDrop: function handleDrop(view, event, slice, moved) {
+        if ((0, _platformFeatureFlags.fg)('platform_editor_nest_nested_expand_drag_fix')) {
+          return handleDraggingOfNestedExpand(view, event, slice);
+        }
+        return false;
+      }
     },
     // @see ED-8027 to follow up on this work-around
     filterTransaction: function filterTransaction(tr) {
@@ -65,4 +75,51 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, getInt
       return true;
     }
   });
-};
+};
+
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+function handleDraggingOfNestedExpand(view, event, slice) {
+  var _slice$content$firstC;
+  var state = view.state,
+    dispatch = view.dispatch;
+  var tr = state.tr;
+  var selection = state.selection;
+  var from = selection.from,
+    to = selection.to;
+  var supportedDropLocations = [state.schema.nodes.doc, state.schema.nodes.layoutSection, state.schema.nodes.layoutColumn];
+
+  // Check if the contents of the dragged slice contain a nested expand node.
+  if (((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) !== state.schema.nodes.nestedExpand) {
+    return false;
+  }
+  var dropPos = view.posAtCoords({
+    left: event.clientX,
+    top: event.clientY
+  });
+  if (!dropPos) {
+    return false;
+  }
+  var resolvedPos = state.doc.resolve(dropPos.pos);
+
+  // If not dropping into the root of the document, check if the parent node type of the drop location is supported.
+  if (resolvedPos.depth > 1) {
+    var parentNodeType = resolvedPos.node(resolvedPos.depth - 1).type;
+    // If you're not dropping into a doc or layoutSection, don't transform the nested expand, return false and allow default behaviour.
+    if (!supportedDropLocations.includes(parentNodeType)) {
+      return false;
+    }
+  }
+  var updatedSlice = (0, _utils.transformSliceNestedExpandToExpand)(slice, state.schema);
+  if (updatedSlice.eq(slice)) {
+    return false;
+  }
+
+  // The drop position will be affected when the original slice is deleted from the document.
+  var updatedDropPos = dropPos.pos > from ? dropPos.pos - updatedSlice.content.size : dropPos.pos;
+  tr.delete(from, to);
+  tr.insert(updatedDropPos, updatedSlice.content);
+  dispatch(tr);
+  return true;
+}

package/dist/cjs/singlePlayerExpand/ui/ExpandButton.js

@@ -24,7 +24,7 @@ var _excluded = ["buttonStyles"];
  */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function withTooltip(Component) {

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

@@ -2,9 +2,10 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
 import { expandClassNames } from '@atlaskit/editor-common/styles';
 import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { setExpandRef } from '../commands';
 import ExpandNodeView from '../nodeviews';
-import { findExpand } from '../utils';
+import { findExpand, transformSliceNestedExpandToExpand } from '../utils';
 import { createPluginState, getPluginState, pluginKey } from './plugin-factory';
 export function containsClass(element, className) {
   var _element$classList;
@@ -12,7 +13,7 @@ export function containsClass(element, className) {
 }
 export const createPlugin = (dispatch, getIntl, appearance = 'full-page', useLongPressSelection = false, api, allowInteractiveExpand = true, __livePage = false) => {
   const state = createPluginState(dispatch, {});
-  const isMobile = appearance === 'mobile';
+  const isMobile = false;
   return new SafePlugin({
     state: state,
     key: pluginKey,
@@ -44,7 +45,13 @@ export const createPlugin = (dispatch, getIntl, appearance = 'full-page', useLon
       },
       handleClickOn: createSelectionClickHandler(['expand', 'nestedExpand'], target => target.classList.contains(expandClassNames.prefix), {
         useLongPressSelection
-      })
+      }),
+      handleDrop(view, event, slice, moved) {
+        if (fg('platform_editor_nest_nested_expand_drag_fix')) {
+          return handleDraggingOfNestedExpand(view, event, slice);
+        }
+        return false;
+      }
     },
     // @see ED-8027 to follow up on this work-around
     filterTransaction(tr) {
@@ -72,4 +79,57 @@ export const createPlugin = (dispatch, getIntl, appearance = 'full-page', useLon
       };
     }
   });
-};
+};
+
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+export function handleDraggingOfNestedExpand(view, event, slice) {
+  var _slice$content$firstC;
+  const {
+    state,
+    dispatch
+  } = view;
+  const tr = state.tr;
+  const {
+    selection
+  } = state;
+  const {
+    from,
+    to
+  } = selection;
+  const supportedDropLocations = [state.schema.nodes.doc, state.schema.nodes.layoutSection, state.schema.nodes.layoutColumn];
+
+  // Check if the contents of the dragged slice contain a nested expand node.
+  if (((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) !== state.schema.nodes.nestedExpand) {
+    return false;
+  }
+  const dropPos = view.posAtCoords({
+    left: event.clientX,
+    top: event.clientY
+  });
+  if (!dropPos) {
+    return false;
+  }
+  const resolvedPos = state.doc.resolve(dropPos.pos);
+
+  // If not dropping into the root of the document, check if the parent node type of the drop location is supported.
+  if (resolvedPos.depth > 1) {
+    const parentNodeType = resolvedPos.node(resolvedPos.depth - 1).type;
+    // If you're not dropping into a doc or layoutSection, don't transform the nested expand, return false and allow default behaviour.
+    if (!supportedDropLocations.includes(parentNodeType)) {
+      return false;
+    }
+  }
+  const updatedSlice = transformSliceNestedExpandToExpand(slice, state.schema);
+  if (updatedSlice.eq(slice)) {
+    return false;
+  }
+
+  // The drop position will be affected when the original slice is deleted from the document.
+  const updatedDropPos = dropPos.pos > from ? dropPos.pos - updatedSlice.content.size : dropPos.pos;
+  tr.delete(from, to);
+  tr.insert(updatedDropPos, updatedSlice.content);
+  dispatch(tr);
+  return true;
+}

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

@@ -2,14 +2,16 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
 import { expandClassNames } from '@atlaskit/editor-common/styles';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+import { fg } from '@atlaskit/platform-feature-flags';
 import ExpandNodeView from '../node-views';
+import { transformSliceNestedExpandToExpand } from '../utils';
 export const pluginKey = new PluginKey('expandPlugin');
 export function containsClass(element, className) {
   var _element$classList;
   return Boolean(element === null || element === void 0 ? void 0 : (_element$classList = element.classList) === null || _element$classList === void 0 ? void 0 : _element$classList.contains(className));
 }
 export const createPlugin = (dispatch, getIntl, appearance = 'full-page', useLongPressSelection = false, api, allowInteractiveExpand = true, __livePage = false) => {
-  const isMobile = appearance === 'mobile';
+  const isMobile = false;
   return new SafePlugin({
     key: pluginKey,
     props: {
@@ -40,7 +42,13 @@ export const createPlugin = (dispatch, getIntl, appearance = 'full-page', useLon
       },
       handleClickOn: createSelectionClickHandler(['expand', 'nestedExpand'], target => target.classList.contains(expandClassNames.prefix), {
         useLongPressSelection
-      })
+      }),
+      handleDrop(view, event, slice, moved) {
+        if (fg('platform_editor_nest_nested_expand_drag_fix')) {
+          return handleDraggingOfNestedExpand(view, event, slice);
+        }
+        return false;
+      }
     },
     // @see ED-8027 to follow up on this work-around
     filterTransaction(tr) {
@@ -50,4 +58,57 @@ export const createPlugin = (dispatch, getIntl, appearance = 'full-page', useLon
       return true;
     }
   });
-};
+};
+
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+export function handleDraggingOfNestedExpand(view, event, slice) {
+  var _slice$content$firstC;
+  const {
+    state,
+    dispatch
+  } = view;
+  const tr = state.tr;
+  const {
+    selection
+  } = state;
+  const {
+    from,
+    to
+  } = selection;
+  const supportedDropLocations = [state.schema.nodes.doc, state.schema.nodes.layoutSection, state.schema.nodes.layoutColumn];
+
+  // Check if the contents of the dragged slice contain a nested expand node.
+  if (((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) !== state.schema.nodes.nestedExpand) {
+    return false;
+  }
+  const dropPos = view.posAtCoords({
+    left: event.clientX,
+    top: event.clientY
+  });
+  if (!dropPos) {
+    return false;
+  }
+  const resolvedPos = state.doc.resolve(dropPos.pos);
+
+  // If not dropping into the root of the document, check if the parent node type of the drop location is supported.
+  if (resolvedPos.depth > 1) {
+    const parentNodeType = resolvedPos.node(resolvedPos.depth - 1).type;
+    // If you're not dropping into a doc or layoutSection, don't transform the nested expand, return false and allow default behaviour.
+    if (!supportedDropLocations.includes(parentNodeType)) {
+      return false;
+    }
+  }
+  const updatedSlice = transformSliceNestedExpandToExpand(slice, state.schema);
+  if (updatedSlice.eq(slice)) {
+    return false;
+  }
+
+  // The drop position will be affected when the original slice is deleted from the document.
+  const updatedDropPos = dropPos.pos > from ? dropPos.pos - updatedSlice.content.size : dropPos.pos;
+  tr.delete(from, to);
+  tr.insert(updatedDropPos, updatedSlice.content);
+  dispatch(tr);
+  return true;
+}

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

@@ -2,9 +2,10 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
 import { expandClassNames } from '@atlaskit/editor-common/styles';
 import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { setExpandRef } from '../commands';
 import ExpandNodeView from '../nodeviews';
-import { findExpand } from '../utils';
+import { findExpand, transformSliceNestedExpandToExpand } from '../utils';
 import { createPluginState, getPluginState, pluginKey } from './plugin-factory';
 export function containsClass(element, className) {
   var _element$classList;
@@ -17,7 +18,7 @@ export var createPlugin = function createPlugin(dispatch, getIntl) {
   var allowInteractiveExpand = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : true;
   var __livePage = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
   var state = createPluginState(dispatch, {});
-  var isMobile = appearance === 'mobile';
+  var isMobile = false;
   return new SafePlugin({
     state: state,
     key: pluginKey,
@@ -51,7 +52,13 @@ export var createPlugin = function createPlugin(dispatch, getIntl) {
         return target.classList.contains(expandClassNames.prefix);
       }, {
         useLongPressSelection: useLongPressSelection
-      })
+      }),
+      handleDrop: function handleDrop(view, event, slice, moved) {
+        if (fg('platform_editor_nest_nested_expand_drag_fix')) {
+          return handleDraggingOfNestedExpand(view, event, slice);
+        }
+        return false;
+      }
     },
     // @see ED-8027 to follow up on this work-around
     filterTransaction: function filterTransaction(tr) {
@@ -77,4 +84,51 @@ export var createPlugin = function createPlugin(dispatch, getIntl) {
       };
     }
   });
-};
+};
+
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+export function handleDraggingOfNestedExpand(view, event, slice) {
+  var _slice$content$firstC;
+  var state = view.state,
+    dispatch = view.dispatch;
+  var tr = state.tr;
+  var selection = state.selection;
+  var from = selection.from,
+    to = selection.to;
+  var supportedDropLocations = [state.schema.nodes.doc, state.schema.nodes.layoutSection, state.schema.nodes.layoutColumn];
+
+  // Check if the contents of the dragged slice contain a nested expand node.
+  if (((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) !== state.schema.nodes.nestedExpand) {
+    return false;
+  }
+  var dropPos = view.posAtCoords({
+    left: event.clientX,
+    top: event.clientY
+  });
+  if (!dropPos) {
+    return false;
+  }
+  var resolvedPos = state.doc.resolve(dropPos.pos);
+
+  // If not dropping into the root of the document, check if the parent node type of the drop location is supported.
+  if (resolvedPos.depth > 1) {
+    var parentNodeType = resolvedPos.node(resolvedPos.depth - 1).type;
+    // If you're not dropping into a doc or layoutSection, don't transform the nested expand, return false and allow default behaviour.
+    if (!supportedDropLocations.includes(parentNodeType)) {
+      return false;
+    }
+  }
+  var updatedSlice = transformSliceNestedExpandToExpand(slice, state.schema);
+  if (updatedSlice.eq(slice)) {
+    return false;
+  }
+
+  // The drop position will be affected when the original slice is deleted from the document.
+  var updatedDropPos = dropPos.pos > from ? dropPos.pos - updatedSlice.content.size : dropPos.pos;
+  tr.delete(from, to);
+  tr.insert(updatedDropPos, updatedSlice.content);
+  dispatch(tr);
+  return true;
+}

package/dist/esm/legacyExpand/ui/ExpandIconButton.js

@@ -9,7 +9,7 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 var _excluded = ["buttonStyles"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic

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

@@ -2,7 +2,9 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
 import { expandClassNames } from '@atlaskit/editor-common/styles';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+import { fg } from '@atlaskit/platform-feature-flags';
 import ExpandNodeView from '../node-views';
+import { transformSliceNestedExpandToExpand } from '../utils';
 export var pluginKey = new PluginKey('expandPlugin');
 export function containsClass(element, className) {
   var _element$classList;
@@ -14,7 +16,7 @@ export var createPlugin = function createPlugin(dispatch, getIntl) {
   var api = arguments.length > 4 ? arguments[4] : undefined;
   var allowInteractiveExpand = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : true;
   var __livePage = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
-  var isMobile = appearance === 'mobile';
+  var isMobile = false;
   return new SafePlugin({
     key: pluginKey,
     props: {
@@ -47,7 +49,13 @@ export var createPlugin = function createPlugin(dispatch, getIntl) {
         return target.classList.contains(expandClassNames.prefix);
       }, {
         useLongPressSelection: useLongPressSelection
-      })
+      }),
+      handleDrop: function handleDrop(view, event, slice, moved) {
+        if (fg('platform_editor_nest_nested_expand_drag_fix')) {
+          return handleDraggingOfNestedExpand(view, event, slice);
+        }
+        return false;
+      }
     },
     // @see ED-8027 to follow up on this work-around
     filterTransaction: function filterTransaction(tr) {
@@ -57,4 +65,51 @@ export var createPlugin = function createPlugin(dispatch, getIntl) {
       return true;
     }
   });
-};
+};
+
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+export function handleDraggingOfNestedExpand(view, event, slice) {
+  var _slice$content$firstC;
+  var state = view.state,
+    dispatch = view.dispatch;
+  var tr = state.tr;
+  var selection = state.selection;
+  var from = selection.from,
+    to = selection.to;
+  var supportedDropLocations = [state.schema.nodes.doc, state.schema.nodes.layoutSection, state.schema.nodes.layoutColumn];
+
+  // Check if the contents of the dragged slice contain a nested expand node.
+  if (((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type) !== state.schema.nodes.nestedExpand) {
+    return false;
+  }
+  var dropPos = view.posAtCoords({
+    left: event.clientX,
+    top: event.clientY
+  });
+  if (!dropPos) {
+    return false;
+  }
+  var resolvedPos = state.doc.resolve(dropPos.pos);
+
+  // If not dropping into the root of the document, check if the parent node type of the drop location is supported.
+  if (resolvedPos.depth > 1) {
+    var parentNodeType = resolvedPos.node(resolvedPos.depth - 1).type;
+    // If you're not dropping into a doc or layoutSection, don't transform the nested expand, return false and allow default behaviour.
+    if (!supportedDropLocations.includes(parentNodeType)) {
+      return false;
+    }
+  }
+  var updatedSlice = transformSliceNestedExpandToExpand(slice, state.schema);
+  if (updatedSlice.eq(slice)) {
+    return false;
+  }
+
+  // The drop position will be affected when the original slice is deleted from the document.
+  var updatedDropPos = dropPos.pos > from ? dropPos.pos - updatedSlice.content.size : dropPos.pos;
+  tr.delete(from, to);
+  tr.insert(updatedDropPos, updatedSlice.content);
+  dispatch(tr);
+  return true;
+}

package/dist/types/legacyExpand/pm-plugins/main.d.ts

@@ -2,6 +2,12 @@ import type { IntlShape } from 'react-intl-next';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { EditorAppearance, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { type Slice } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { ExpandPlugin } from '../../types';
 export declare function containsClass(element: Element | null, className: string): boolean;
 export declare const createPlugin: (dispatch: Dispatch, getIntl: () => IntlShape, appearance: EditorAppearance | undefined, useLongPressSelection: boolean | undefined, api: ExtractInjectionAPI<ExpandPlugin> | undefined, allowInteractiveExpand?: boolean, __livePage?: boolean) => SafePlugin<import("../../types").ExpandPluginState>;
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+export declare function handleDraggingOfNestedExpand(view: EditorView, event: DragEvent, slice: Slice): boolean;

package/dist/types/singlePlayerExpand/pm-plugins/main.d.ts

@@ -2,8 +2,14 @@ import type { IntlShape } from 'react-intl-next';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { EditorAppearance, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { type Slice } from '@atlaskit/editor-prosemirror/model';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { ExpandPlugin } from '../../types';
 export declare const pluginKey: PluginKey<any>;
 export declare function containsClass(element: Element | null, className: string): boolean;
 export declare const createPlugin: (dispatch: Dispatch, getIntl: () => IntlShape, appearance: EditorAppearance | undefined, useLongPressSelection: boolean | undefined, api: ExtractInjectionAPI<ExpandPlugin> | undefined, allowInteractiveExpand?: boolean, __livePage?: boolean) => SafePlugin<any>;
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+export declare function handleDraggingOfNestedExpand(view: EditorView, event: DragEvent, slice: Slice): boolean;

package/dist/types-ts4.5/legacyExpand/pm-plugins/main.d.ts

@@ -2,6 +2,12 @@ import type { IntlShape } from 'react-intl-next';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { EditorAppearance, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { type Slice } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { ExpandPlugin } from '../../types';
 export declare function containsClass(element: Element | null, className: string): boolean;
 export declare const createPlugin: (dispatch: Dispatch, getIntl: () => IntlShape, appearance: EditorAppearance | undefined, useLongPressSelection: boolean | undefined, api: ExtractInjectionAPI<ExpandPlugin> | undefined, allowInteractiveExpand?: boolean, __livePage?: boolean) => SafePlugin<import("../../types").ExpandPluginState>;
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+export declare function handleDraggingOfNestedExpand(view: EditorView, event: DragEvent, slice: Slice): boolean;

package/dist/types-ts4.5/singlePlayerExpand/pm-plugins/main.d.ts

@@ -2,8 +2,14 @@ import type { IntlShape } from 'react-intl-next';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { EditorAppearance, ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { type Slice } from '@atlaskit/editor-prosemirror/model';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { ExpandPlugin } from '../../types';
 export declare const pluginKey: PluginKey<any>;
 export declare function containsClass(element: Element | null, className: string): boolean;
 export declare const createPlugin: (dispatch: Dispatch, getIntl: () => IntlShape, appearance: EditorAppearance | undefined, useLongPressSelection: boolean | undefined, api: ExtractInjectionAPI<ExpandPlugin> | undefined, allowInteractiveExpand?: boolean, __livePage?: boolean) => SafePlugin<any>;
+/**
+ * As the nestedExpand node is not supported outside of the expand node, it must be converted to an expand node when dragged outside of the expand node.
+ */
+export declare function handleDraggingOfNestedExpand(view: EditorView, event: DragEvent, slice: Slice): boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-expand",
-	"version": "2.6.1",
+	"version": "2.6.3",
 	"description": "Expand plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -33,7 +33,7 @@
 	"dependencies": {
 		"@atlaskit/adf-schema": "^40.9.0",
 		"@atlaskit/button": "^20.1.0",
-		"@atlaskit/editor-common": "^88.12.0",
+		"@atlaskit/editor-common": "^89.0.0",
 		"@atlaskit/editor-plugin-analytics": "^1.8.0",
 		"@atlaskit/editor-plugin-decorations": "^1.3.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^1.3.0",
@@ -117,6 +117,9 @@
 		},
 		"platform_editor_nested_expand_in_expand_adf_change": {
 			"type": "boolean"
+		},
+		"platform_editor_nest_nested_expand_drag_fix": {
+			"type": "boolean"
 		}
 	}
 }