block editor: try direct drag if no text selection

WordPress · Nov 26, 2024 · a72439c · a72439c
1 parent e349487
commit a72439c
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 1 deletion.
diff --git a/packages/block-editor/src/components/block-draggable/content.scss b/packages/block-editor/src/components/block-draggable/content.scss
@@ -18,3 +18,7 @@
 		content: none !important;
 	}
 }
+
+img:not([draggable]) {
+	pointer-events: none;
+}
diff --git a/packages/block-editor/src/components/block-list/use-block-props/index.js b/packages/block-editor/src/components/block-list/use-block-props/index.js
@@ -152,6 +152,7 @@ export function useBlockProps( props = {}, { __unstableIsHtml } = {} ) {
 
 	return {
 		tabIndex: blockEditingMode === 'disabled' ? -1 : 0,
+		draggable: true,
 		...wrapperProps,
 		...props,
 		ref: mergedRefs,

diff --git a/...ock-editor/src/components/block-list/use-block-props/use-selected-block-event-handlers.js b/...ock-editor/src/components/block-list/use-block-props/use-selected-block-event-handlers.js
@@ -76,7 +76,25 @@ export function useEventHandlers( { clientId, isSelected } ) {
 			 * @param {DragEvent} event Drag event.
 			 */
 			function onDragStart( event ) {
-				event.preventDefault();
+				const { ownerDocument } = node;
+				const { defaultView } = ownerDocument;
+				const selection = defaultView.getSelection();
+				if (
+					node !== event.target ||
+					node.contains( selection.anchorNode ) ||
+					node.contains( selection.focusNode )
+				) {
+					event.preventDefault();
+					return;
+				}
+				const data = JSON.stringify( {
+					type: 'block',
+					srcClientIds: [ clientId ],
+					srcRootClientId: getBlockRootClientId( clientId ),
+				} );
+				event.dataTransfer.clearData();
+				event.dataTransfer.setData( 'wp-blocks', data );
+				selection.removeAllRanges();
 			}
 
 			node.addEventListener( 'keydown', onKeyDown );