The drag image element for the drag object.
The mime data for the drag object.
The proposed drop action for the drag object.
Get the drag source for the drag object.
The supported drop actions for the drag object.
The internal id for the active cursor override.
Test whether the drag object is disposed.
Add the document event listeners for the drag object.
Attach the drag image element at the specified location.
This is a no-op if there is no drag image element.
Detach the drag image element from the DOM.
This is a no-op if there is no drag image element.
Handle the 'keydown' event for the drag object.
Handle the 'mousemove' event for the drag object.
Handle the 'mouseup' event for the drag object.
Finalize the drag operation and resolve the drag promise.
Move the drag image element to the specified location.
This is a no-op if there is no drag image element.
The scroll loop handler function.
Remove the document event listeners for the drag object.
Set the internal drop action state and update the drag cursor.
Update the current target node using the given mouse event.
Update the drag scroll element under the mouse.
Dispose of the resources held by the drag object.
This will cancel the drag operation if it is active.
Handle the DOM events for the drag operation.
The DOM event sent to the drag object.
This method implements the DOM EventListener interface and is
called in response to events on the document. It should not be
called directly by user code.
Start the drag operation at the specified client position.
The client X position for the drag start.
The client Y position for the drag start.
A promise which resolves to the result of the drag.
If the drag has already been started, the promise created by the
first call to start is returned.
If the drag operation has ended, or if the drag object has been
disposed, the returned promise will resolve to 'none'.
The drag object will be automatically disposed when drag operation
completes. This means Drag objects are for single-use only.
This method assumes the left mouse button is already held down.
Override the cursor icon for the entire document.
The string representing the cursor style.
A disposable which will clear the override when disposed.
The most recent call to overrideCursor takes precedence.
Disposing an old override has no effect on the current override.
This utility function is used by the Drag class to override the
mouse cursor during a drag-drop operation, but it can also be used
by other classes to fix the cursor icon during normal mouse drags.
import { Drag } from '@phosphor/dragdrop';
// Force the cursor to be 'wait' for the entire document.
let override = Drag.overrideCursor('wait');
// Clear the override by disposing the return value.
override.dispose();Generated using TypeDoc
An object which manages a drag-drop operation. The namespace for the
Dragclass statics.A drag object dispatches four different events to drop targets:
'p-dragenter'- Dispatched when the mouse enters the target element. This event must be canceled in order to receive any of the other events.'p-dragover'- Dispatched when the mouse moves over the drop target. It must cancel the event and set thedropActionto one of the supported actions in order to receive drop events.'p-dragleave'- Dispatched when the mouse leaves the target element. This includes moving the mouse into child elements.'p-drop'- Dispatched when the mouse is released over the target element when the target indicates an appropriate drop action. If the event is canceled, the indicated drop action is returned to the initiator through the resolved promise.A drag operation can be terminated at any time by pressing
Escapeor by disposing the drag object.A drag object has the ability to automatically scroll a scrollable element when the mouse is hovered near one of its edges. To enable this, add the
data-p-dragscrollattribute to any element which the drag object should consider for scrolling.Notes
This class is designed to be used when dragging and dropping custom data within a single application. It is not a replacement for the native drag-drop API. Instead, it provides an API which allows drag operations to be initiated programmatically and enables the transfer of arbitrary non-string objects; features which are not possible with the native drag-drop API.