@atlaskit/editor-plugin-block-controls 1.4.24 → 1.4.25

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 1.4.25
+
+### Patch Changes
+
+- [#112850](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/112850)
+  [`b5b96fe430ecb`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b5b96fe430ecb) -
+  ED-23767 Add drop listener to prevent default behaviour of duplicating dropped node
+
 ## 1.4.24
 
 ### Patch Changes

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

@@ -221,6 +221,27 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
           return;
         }
         return (_key$getState = key.getState(state)) === null || _key$getState === void 0 ? void 0 : _key$getState.decorations;
+      },
+      handleDOMEvents: {
+        drop: function drop(view, event) {
+          var _pluginState$activeNo;
+          // prosemirror has sends a default transaction on drop (meta where uiEvent is 'drop'),
+          // this duplicates the an empty version of the node it was dropping,
+          // Adding some check here to prevent that if drop position is within activeNode
+          var state = view.state;
+          var pluginState = key.getState(state);
+          if (!(event.target instanceof HTMLElement) || !(pluginState !== null && pluginState !== void 0 && pluginState.activeNode)) {
+            return false;
+          }
+          var node = view.nodeDOM(pluginState === null || pluginState === void 0 || (_pluginState$activeNo = pluginState.activeNode) === null || _pluginState$activeNo === void 0 ? void 0 : _pluginState$activeNo.pos);
+          var isActiveNode = (node === null || node === void 0 ? void 0 : node.contains(event.target)) || event.target === node;
+          if (isActiveNode) {
+            // Prevent the default drop behavior if the position is within the activeNode
+            event.preventDefault();
+            return true;
+          }
+          return false;
+        }
       }
     },
     view: function view(editorView) {

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

@@ -214,6 +214,29 @@ export const createPlugin = api => {
           return;
         }
         return (_key$getState = key.getState(state)) === null || _key$getState === void 0 ? void 0 : _key$getState.decorations;
+      },
+      handleDOMEvents: {
+        drop(view, event) {
+          var _pluginState$activeNo;
+          // prosemirror has sends a default transaction on drop (meta where uiEvent is 'drop'),
+          // this duplicates the an empty version of the node it was dropping,
+          // Adding some check here to prevent that if drop position is within activeNode
+          const {
+            state
+          } = view;
+          const pluginState = key.getState(state);
+          if (!(event.target instanceof HTMLElement) || !(pluginState !== null && pluginState !== void 0 && pluginState.activeNode)) {
+            return false;
+          }
+          const node = view.nodeDOM(pluginState === null || pluginState === void 0 ? void 0 : (_pluginState$activeNo = pluginState.activeNode) === null || _pluginState$activeNo === void 0 ? void 0 : _pluginState$activeNo.pos);
+          const isActiveNode = (node === null || node === void 0 ? void 0 : node.contains(event.target)) || event.target === node;
+          if (isActiveNode) {
+            // Prevent the default drop behavior if the position is within the activeNode
+            event.preventDefault();
+            return true;
+          }
+          return false;
+        }
       }
     },
     view: editorView => {

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

@@ -214,6 +214,27 @@ export var createPlugin = function createPlugin(api) {
           return;
         }
         return (_key$getState = key.getState(state)) === null || _key$getState === void 0 ? void 0 : _key$getState.decorations;
+      },
+      handleDOMEvents: {
+        drop: function drop(view, event) {
+          var _pluginState$activeNo;
+          // prosemirror has sends a default transaction on drop (meta where uiEvent is 'drop'),
+          // this duplicates the an empty version of the node it was dropping,
+          // Adding some check here to prevent that if drop position is within activeNode
+          var state = view.state;
+          var pluginState = key.getState(state);
+          if (!(event.target instanceof HTMLElement) || !(pluginState !== null && pluginState !== void 0 && pluginState.activeNode)) {
+            return false;
+          }
+          var node = view.nodeDOM(pluginState === null || pluginState === void 0 || (_pluginState$activeNo = pluginState.activeNode) === null || _pluginState$activeNo === void 0 ? void 0 : _pluginState$activeNo.pos);
+          var isActiveNode = (node === null || node === void 0 ? void 0 : node.contains(event.target)) || event.target === node;
+          if (isActiveNode) {
+            // Prevent the default drop behavior if the position is within the activeNode
+            event.preventDefault();
+            return true;
+          }
+          return false;
+        }
       }
     },
     view: function view(editorView) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "1.4.24",
+	"version": "1.4.25",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",