diff --git a/.changeset/handle-cancel-events.md b/.changeset/handle-cancel-events.md new file mode 100644 index 000000000..82525111f --- /dev/null +++ b/.changeset/handle-cancel-events.md @@ -0,0 +1,5 @@ +--- +'@dnd-kit/core': patch +--- + +Handle `touchcancel` and `pointercancel` events. diff --git a/packages/core/src/sensors/pointer/AbstractPointerSensor.ts b/packages/core/src/sensors/pointer/AbstractPointerSensor.ts index 5c39f6de9..04bae0a45 100644 --- a/packages/core/src/sensors/pointer/AbstractPointerSensor.ts +++ b/packages/core/src/sensors/pointer/AbstractPointerSensor.ts @@ -32,6 +32,7 @@ interface EventDescriptor { } export interface PointerEventHandlers { + cancel?: EventDescriptor; move: EventDescriptor; end: EventDescriptor; } @@ -109,6 +110,11 @@ export class AbstractPointerSensor implements SensorInstance { this.listeners.add(events.move.name, this.handleMove, {passive: false}); this.listeners.add(events.end.name, this.handleEnd); + + if (events.cancel) { + this.listeners.add(events.cancel.name, this.handleCancel); + } + this.windowListeners.add(EventName.Resize, this.handleCancel); this.windowListeners.add(EventName.DragStart, preventDefault); this.windowListeners.add(EventName.VisibilityChange, this.handleCancel); diff --git a/packages/core/src/sensors/pointer/PointerSensor.ts b/packages/core/src/sensors/pointer/PointerSensor.ts index a415c55a6..6faa6aaed 100644 --- a/packages/core/src/sensors/pointer/PointerSensor.ts +++ b/packages/core/src/sensors/pointer/PointerSensor.ts @@ -9,6 +9,7 @@ import { } from './AbstractPointerSensor'; const events: PointerEventHandlers = { + cancel: {name: 'pointercancel'}, move: {name: 'pointermove'}, end: {name: 'pointerup'}, }; diff --git a/packages/core/src/sensors/touch/TouchSensor.ts b/packages/core/src/sensors/touch/TouchSensor.ts index 57a10bfd3..3812955f7 100644 --- a/packages/core/src/sensors/touch/TouchSensor.ts +++ b/packages/core/src/sensors/touch/TouchSensor.ts @@ -9,6 +9,7 @@ import { import type {SensorProps} from '../types'; const events: PointerEventHandlers = { + cancel: {name: 'touchcancel'}, move: {name: 'touchmove'}, end: {name: 'touchend'}, };