@atlaskit/editor-plugin-block-controls 2.2.1 → 2.2.2

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 2.2.2
+
+### Patch Changes
+
+- [#151024](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/151024)
+  [`73afcf51ef0da`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/73afcf51ef0da) -
+  ED-20516 Set selection at end of node after drop instead of selecting entire moved node
+- Updated dependencies
+
 ## 2.2.1
 
 ### Patch Changes

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

@@ -18,6 +18,7 @@ var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _consts = require("../consts");
 var _main = require("../pm-plugins/main");
 var _utils4 = require("../utils");
+var _getSelection = require("../utils/getSelection");
 var _validation = require("../utils/validation");
 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; }
@@ -189,7 +190,7 @@ var moveNode = exports.moveNode = function moveNode(api) {
         mappedTo = tr.mapping.map(to);
         tr.insert(mappedTo, _nodeCopy); // insert the content at the new position
       }
-      tr = (0, _utils4.selectNode)(tr, mappedTo, node.type.name);
+      tr = inputMethod === _analytics.INPUT_METHOD.DRAG_AND_DROP && (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_2') ? (0, _getSelection.setCursorPositionAtMovedNode)(tr, mappedTo) : (0, _utils4.selectNode)(tr, mappedTo, node.type.name);
       tr.setMeta(_main.key, {
         nodeMoved: true
       });

package/dist/cjs/utils/getSelection.js

@@ -3,9 +3,32 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.selectNode = exports.getSelection = void 0;
+exports.setCursorPositionAtMovedNode = exports.selectNode = exports.getSelection = exports.getInlineNodePos = void 0;
+var _selection = require("@atlaskit/editor-common/selection");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-tables/utils");
+var getInlineNodePos = exports.getInlineNodePos = function getInlineNodePos(tr, start, nodeSize) {
+  var $startPos = tr.doc.resolve(start);
+  // To trigger the annotation floating toolbar for non-selectable node, we need to select inline nodes
+  // Find the first inline node in the node
+  var inlineNodePos = start;
+  var foundInlineNode = false;
+  var inlineNodeEndPos = 0;
+  tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, function (n, pos) {
+    if (n.isInline) {
+      inlineNodeEndPos = pos + n.nodeSize;
+    }
+    if (n.isInline && !foundInlineNode) {
+      inlineNodePos = pos;
+      foundInlineNode = true;
+    }
+    return true;
+  });
+  return {
+    inlineNodePos: inlineNodePos,
+    inlineNodeEndPos: inlineNodeEndPos
+  };
+};
 var getSelection = exports.getSelection = function getSelection(tr, start) {
   var node = tr.doc.nodeAt(start);
   var isNodeSelection = node && _state.NodeSelection.isSelectable(node);
@@ -25,21 +48,9 @@ var getSelection = exports.getSelection = function getSelection(tr, start) {
   nodeName === 'mediaGroup') {
     return new _state.NodeSelection($startPos);
   } else {
-    // To trigger the annotation floating toolbar for non-selectable node, we need to select inline nodes
-    // Find the first inline node in the node
-    var inlineNodePos = start;
-    var foundInlineNode = false;
-    var inlineNodeEndPos = 0;
-    tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, function (n, pos) {
-      if (n.isInline) {
-        inlineNodeEndPos = pos + n.nodeSize;
-      }
-      if (n.isInline && !foundInlineNode) {
-        inlineNodePos = pos;
-        foundInlineNode = true;
-      }
-      return true;
-    });
+    var _getInlineNodePos = getInlineNodePos(tr, start, nodeSize),
+      inlineNodePos = _getInlineNodePos.inlineNodePos,
+      inlineNodeEndPos = _getInlineNodePos.inlineNodeEndPos;
     return new _state.TextSelection(tr.doc.resolve(inlineNodeEndPos), tr.doc.resolve(inlineNodePos));
   }
 };
@@ -51,4 +62,20 @@ var selectNode = exports.selectNode = function selectNode(tr, start, nodeType) {
     tr.setSelection(getSelection(tr, start));
   }
   return tr;
+};
+var setCursorPositionAtMovedNode = exports.setCursorPositionAtMovedNode = function setCursorPositionAtMovedNode(tr, start) {
+  var node = tr.doc.nodeAt(start);
+  var isNodeSelection = node && _state.NodeSelection.isSelectable(node);
+  var nodeSize = node ? node.nodeSize : 1;
+  var selection;
+  // decisionList node is not selectable, but we want to select the whole node not just text
+  if (isNodeSelection || (node === null || node === void 0 ? void 0 : node.type.name) === 'decisionList') {
+    selection = new _selection.GapCursorSelection(tr.doc.resolve(start + node.nodeSize), _selection.Side.RIGHT);
+  } else {
+    var _getInlineNodePos2 = getInlineNodePos(tr, start, nodeSize),
+      inlineNodeEndPos = _getInlineNodePos2.inlineNodeEndPos;
+    selection = new _state.TextSelection(tr.doc.resolve(inlineNodeEndPos));
+  }
+  tr.setSelection(selection);
+  return tr;
 };

package/dist/cjs/utils/index.js

@@ -3,6 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "getInlineNodePos", {
+  enumerable: true,
+  get: function get() {
+    return _getSelection.getInlineNodePos;
+  }
+});
 Object.defineProperty(exports, "getNestedNodePosition", {
   enumerable: true,
   get: function get() {
@@ -21,5 +27,11 @@ Object.defineProperty(exports, "selectNode", {
     return _getSelection.selectNode;
   }
 });
+Object.defineProperty(exports, "setCursorPositionAtMovedNode", {
+  enumerable: true,
+  get: function get() {
+    return _getSelection.setCursorPositionAtMovedNode;
+  }
+});
 var _getSelection = require("./getSelection");
 var _getNestedNodePosition = require("./getNestedNodePosition");

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

@@ -10,6 +10,7 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { DIRECTION } from '../consts';
 import { key } from '../pm-plugins/main';
 import { getNestedNodePosition, selectNode } from '../utils';
+import { setCursorPositionAtMovedNode } from '../utils/getSelection';
 import { canMoveNodeToIndex, isInsideTable, transformSliceExpandToNestedExpand } from '../utils/validation';
 
 /**
@@ -183,7 +184,7 @@ export const moveNode = api => (start, to, inputMethod = INPUT_METHOD.DRAG_AND_D
     mappedTo = tr.mapping.map(to);
     tr.insert(mappedTo, nodeCopy); // insert the content at the new position
   }
-  tr = selectNode(tr, mappedTo, node.type.name);
+  tr = inputMethod === INPUT_METHOD.DRAG_AND_DROP && fg('platform_editor_element_dnd_nested_fix_patch_2') ? setCursorPositionAtMovedNode(tr, mappedTo) : selectNode(tr, mappedTo, node.type.name);
   tr.setMeta(key, {
     nodeMoved: true
   });

package/dist/es2019/utils/getSelection.js

@@ -1,5 +1,28 @@
+import { GapCursorSelection, Side } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { selectTableClosestToPos } from '@atlaskit/editor-tables/utils';
+export const getInlineNodePos = (tr, start, nodeSize) => {
+  const $startPos = tr.doc.resolve(start);
+  // To trigger the annotation floating toolbar for non-selectable node, we need to select inline nodes
+  // Find the first inline node in the node
+  let inlineNodePos = start;
+  let foundInlineNode = false;
+  let inlineNodeEndPos = 0;
+  tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, (n, pos) => {
+    if (n.isInline) {
+      inlineNodeEndPos = pos + n.nodeSize;
+    }
+    if (n.isInline && !foundInlineNode) {
+      inlineNodePos = pos;
+      foundInlineNode = true;
+    }
+    return true;
+  });
+  return {
+    inlineNodePos,
+    inlineNodeEndPos
+  };
+};
 export const getSelection = (tr, start) => {
   const node = tr.doc.nodeAt(start);
   const isNodeSelection = node && NodeSelection.isSelectable(node);
@@ -19,21 +42,10 @@ export const getSelection = (tr, start) => {
   nodeName === 'mediaGroup') {
     return new NodeSelection($startPos);
   } else {
-    // To trigger the annotation floating toolbar for non-selectable node, we need to select inline nodes
-    // Find the first inline node in the node
-    let inlineNodePos = start;
-    let foundInlineNode = false;
-    let inlineNodeEndPos = 0;
-    tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, (n, pos) => {
-      if (n.isInline) {
-        inlineNodeEndPos = pos + n.nodeSize;
-      }
-      if (n.isInline && !foundInlineNode) {
-        inlineNodePos = pos;
-        foundInlineNode = true;
-      }
-      return true;
-    });
+    const {
+      inlineNodePos,
+      inlineNodeEndPos
+    } = getInlineNodePos(tr, start, nodeSize);
     return new TextSelection(tr.doc.resolve(inlineNodeEndPos), tr.doc.resolve(inlineNodePos));
   }
 };
@@ -45,4 +57,21 @@ export const selectNode = (tr, start, nodeType) => {
     tr.setSelection(getSelection(tr, start));
   }
   return tr;
+};
+export const setCursorPositionAtMovedNode = (tr, start) => {
+  const node = tr.doc.nodeAt(start);
+  const isNodeSelection = node && NodeSelection.isSelectable(node);
+  const nodeSize = node ? node.nodeSize : 1;
+  let selection;
+  // decisionList node is not selectable, but we want to select the whole node not just text
+  if (isNodeSelection || (node === null || node === void 0 ? void 0 : node.type.name) === 'decisionList') {
+    selection = new GapCursorSelection(tr.doc.resolve(start + node.nodeSize), Side.RIGHT);
+  } else {
+    const {
+      inlineNodeEndPos
+    } = getInlineNodePos(tr, start, nodeSize);
+    selection = new TextSelection(tr.doc.resolve(inlineNodeEndPos));
+  }
+  tr.setSelection(selection);
+  return tr;
 };

package/dist/es2019/utils/index.js

@@ -1,2 +1,2 @@
-export { getSelection, selectNode } from './getSelection';
+export { getInlineNodePos, getSelection, selectNode, setCursorPositionAtMovedNode } from './getSelection';
 export { getNestedNodePosition } from './getNestedNodePosition';

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

@@ -13,6 +13,7 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { DIRECTION } from '../consts';
 import { key } from '../pm-plugins/main';
 import { getNestedNodePosition, selectNode } from '../utils';
+import { setCursorPositionAtMovedNode } from '../utils/getSelection';
 import { canMoveNodeToIndex, isInsideTable, transformSliceExpandToNestedExpand } from '../utils/validation';
 
 /**
@@ -183,7 +184,7 @@ export var moveNode = function moveNode(api) {
         mappedTo = tr.mapping.map(to);
         tr.insert(mappedTo, _nodeCopy); // insert the content at the new position
       }
-      tr = selectNode(tr, mappedTo, node.type.name);
+      tr = inputMethod === INPUT_METHOD.DRAG_AND_DROP && fg('platform_editor_element_dnd_nested_fix_patch_2') ? setCursorPositionAtMovedNode(tr, mappedTo) : selectNode(tr, mappedTo, node.type.name);
       tr.setMeta(key, {
         nodeMoved: true
       });

package/dist/esm/utils/getSelection.js

@@ -1,5 +1,28 @@
+import { GapCursorSelection, Side } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { selectTableClosestToPos } from '@atlaskit/editor-tables/utils';
+export var getInlineNodePos = function getInlineNodePos(tr, start, nodeSize) {
+  var $startPos = tr.doc.resolve(start);
+  // To trigger the annotation floating toolbar for non-selectable node, we need to select inline nodes
+  // Find the first inline node in the node
+  var inlineNodePos = start;
+  var foundInlineNode = false;
+  var inlineNodeEndPos = 0;
+  tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, function (n, pos) {
+    if (n.isInline) {
+      inlineNodeEndPos = pos + n.nodeSize;
+    }
+    if (n.isInline && !foundInlineNode) {
+      inlineNodePos = pos;
+      foundInlineNode = true;
+    }
+    return true;
+  });
+  return {
+    inlineNodePos: inlineNodePos,
+    inlineNodeEndPos: inlineNodeEndPos
+  };
+};
 export var getSelection = function getSelection(tr, start) {
   var node = tr.doc.nodeAt(start);
   var isNodeSelection = node && NodeSelection.isSelectable(node);
@@ -19,21 +42,9 @@ export var getSelection = function getSelection(tr, start) {
   nodeName === 'mediaGroup') {
     return new NodeSelection($startPos);
   } else {
-    // To trigger the annotation floating toolbar for non-selectable node, we need to select inline nodes
-    // Find the first inline node in the node
-    var inlineNodePos = start;
-    var foundInlineNode = false;
-    var inlineNodeEndPos = 0;
-    tr.doc.nodesBetween($startPos.pos, $startPos.pos + nodeSize, function (n, pos) {
-      if (n.isInline) {
-        inlineNodeEndPos = pos + n.nodeSize;
-      }
-      if (n.isInline && !foundInlineNode) {
-        inlineNodePos = pos;
-        foundInlineNode = true;
-      }
-      return true;
-    });
+    var _getInlineNodePos = getInlineNodePos(tr, start, nodeSize),
+      inlineNodePos = _getInlineNodePos.inlineNodePos,
+      inlineNodeEndPos = _getInlineNodePos.inlineNodeEndPos;
     return new TextSelection(tr.doc.resolve(inlineNodeEndPos), tr.doc.resolve(inlineNodePos));
   }
 };
@@ -45,4 +56,20 @@ export var selectNode = function selectNode(tr, start, nodeType) {
     tr.setSelection(getSelection(tr, start));
   }
   return tr;
+};
+export var setCursorPositionAtMovedNode = function setCursorPositionAtMovedNode(tr, start) {
+  var node = tr.doc.nodeAt(start);
+  var isNodeSelection = node && NodeSelection.isSelectable(node);
+  var nodeSize = node ? node.nodeSize : 1;
+  var selection;
+  // decisionList node is not selectable, but we want to select the whole node not just text
+  if (isNodeSelection || (node === null || node === void 0 ? void 0 : node.type.name) === 'decisionList') {
+    selection = new GapCursorSelection(tr.doc.resolve(start + node.nodeSize), Side.RIGHT);
+  } else {
+    var _getInlineNodePos2 = getInlineNodePos(tr, start, nodeSize),
+      inlineNodeEndPos = _getInlineNodePos2.inlineNodeEndPos;
+    selection = new TextSelection(tr.doc.resolve(inlineNodeEndPos));
+  }
+  tr.setSelection(selection);
+  return tr;
 };

package/dist/esm/utils/index.js

@@ -1,2 +1,2 @@
-export { getSelection, selectNode } from './getSelection';
+export { getInlineNodePos, getSelection, selectNode, setCursorPositionAtMovedNode } from './getSelection';
 export { getNestedNodePosition } from './getNestedNodePosition';

package/dist/types/utils/getSelection.d.ts

@@ -1,3 +1,8 @@
 import { NodeSelection, TextSelection, type Transaction } from '@atlaskit/editor-prosemirror/state';
+export declare const getInlineNodePos: (tr: Transaction, start: number, nodeSize: number) => {
+    inlineNodePos: number;
+    inlineNodeEndPos: number;
+};
 export declare const getSelection: (tr: Transaction, start: number) => NodeSelection | TextSelection;
 export declare const selectNode: (tr: Transaction, start: number, nodeType: string) => Transaction;
+export declare const setCursorPositionAtMovedNode: (tr: Transaction, start: number) => Transaction;

package/dist/types/utils/index.d.ts

@@ -1,2 +1,2 @@
-export { getSelection, selectNode } from './getSelection';
+export { getInlineNodePos, getSelection, selectNode, setCursorPositionAtMovedNode, } from './getSelection';
 export { getNestedNodePosition } from './getNestedNodePosition';

package/dist/types-ts4.5/utils/getSelection.d.ts

@@ -1,3 +1,8 @@
 import { NodeSelection, TextSelection, type Transaction } from '@atlaskit/editor-prosemirror/state';
+export declare const getInlineNodePos: (tr: Transaction, start: number, nodeSize: number) => {
+    inlineNodePos: number;
+    inlineNodeEndPos: number;
+};
 export declare const getSelection: (tr: Transaction, start: number) => NodeSelection | TextSelection;
 export declare const selectNode: (tr: Transaction, start: number, nodeType: string) => Transaction;
+export declare const setCursorPositionAtMovedNode: (tr: Transaction, start: number) => Transaction;

package/dist/types-ts4.5/utils/index.d.ts

@@ -1,2 +1,2 @@
-export { getSelection, selectNode } from './getSelection';
+export { getInlineNodePos, getSelection, selectNode, setCursorPositionAtMovedNode, } from './getSelection';
 export { getNestedNodePosition } from './getNestedNodePosition';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "2.2.1",
+	"version": "2.2.2",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -31,7 +31,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^40.9.0",
-		"@atlaskit/editor-common": "^93.1.0",
+		"@atlaskit/editor-common": "^93.2.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^1.2.0",
 		"@atlaskit/editor-plugin-analytics": "^1.8.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^1.3.0",
@@ -43,7 +43,7 @@
 		"@atlaskit/editor-tables": "^2.8.0",
 		"@atlaskit/icon": "^22.22.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
-		"@atlaskit/pragmatic-drag-and-drop": "^1.3.0",
+		"@atlaskit/pragmatic-drag-and-drop": "^1.4.0",
 		"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^1.4.0",
 		"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^1.1.0",
 		"@atlaskit/primitives": "^12.2.0",