Skip to content

Cancel drag-and-drop with the Esc key (#1301)#1305

Merged
mstijak merged 1 commit into
masterfrom
feature/esc-cancel-drag-drop
Jun 22, 2026
Merged

Cancel drag-and-drop with the Esc key (#1301)#1305
mstijak merged 1 commit into
masterfrom
feature/esc-cancel-drag-drop

Conversation

@mstijak

@mstijak mstijak commented Jun 22, 2026

Copy link
Copy Markdown
Member

Closes #1301.

Summary

Pressing Esc during a drag-and-drop operation now cancels it: nothing is dropped, drop zones reset their state, the drag clone is removed, and the mouse/touch capture is released.

Changes

drag-drop/ops.tsx

  • A global keydown listener is registered for the duration of a drag. On Escape it runs the end sequence via notifyDragDrop(null, /*cancelled*/ true) — skipping onDrop — and tears down the capture.
  • Introduces a dedicated DragEndEvent with a cancelled flag, so onDragEnd handlers can distinguish a cancel from a drop (and still read result). On a keyboard cancel there is no pointer event, so its event and cursor are null.

overlay/captureMouse.ts

  • The capture helpers (captureMouse/captureMouseOrTouch and the *2 variants) now return a teardown function so the capture can be released programmatically. Additive — existing callers ignore the return value.

DropZone / DragSource / Grid

  • onDragEnd now receives a DragEndEvent. onDrop and onDragAway continue to use DragEvent (they only fire on a real pointer drop).

Behavior notes

  • The normal drop path is unchanged: onDrop / onDragAway / onDragEnd fire as before with cancelled: false.
  • On cancel, onDrop and the end-of-drag onDragAway do not fire (no pointer event); onDragEnd fires for every started zone, which fully resets zone state, with cancelled: true.

Tests

yarn check-types clean, yarn test 525 passing. Drag-and-drop is event/DOM-driven with no unit coverage, so this was verified by type-checking and manual reasoning through both the drop and cancel paths.

Notes

  • Changelog intentionally omitted — to be added with the release.

A drag-and-drop operation could only be ended by dropping. Pressing Esc
during a drag now cancels it: nothing is dropped, drop zones reset, the
drag clone is removed, and the mouse/touch capture is released.

- ops: register a global keydown listener during a drag; on Escape run
  the end sequence without invoking onDrop, and tear down the capture.
- captureMouse: the capture helpers return a teardown function so the
  capture can be released programmatically (additive; callers may ignore).
- Introduce a dedicated `DragEndEvent` with a `cancelled` flag so
  onDragEnd handlers can tell a cancel from a drop. On a keyboard cancel
  its `event`/`cursor` are null. `onDragEnd` now receives it on
  DropZone, DragSource and Grid; onDrop/onDragAway keep using DragEvent.

Closes #1301
@mstijak mstijak merged commit a64e94f into master Jun 22, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Pressing the Esc key during drag and drop operation should cancel the operation

1 participant