diff --git a/types/react-beautiful-dnd/index.d.ts b/types/react-beautiful-dnd/index.d.ts index 1fd9e4620c..45ba80b49e 100644 --- a/types/react-beautiful-dnd/index.d.ts +++ b/types/react-beautiful-dnd/index.d.ts @@ -35,6 +35,8 @@ export interface ResponderProvided { announce: Announce; } +export type OnBeforeCaptureResponder = (before: BeforeCapture) => void; + export type OnBeforeDragStartResponder = (start: DragStart) => void; export type OnDragStartResponder = ( @@ -53,6 +55,7 @@ export type OnDragEndResponder = ( ) => void; export interface Responders { + onBeforeCapture?: OnBeforeCaptureResponder; onBeforeDragStart?: OnBeforeDragStartResponder; onDragStart?: OnDragStartResponder; onDragUpdate?: OnDragUpdateResponder; @@ -63,11 +66,14 @@ export interface Responders { * DragDropContext */ -export interface DragStart { +export interface BeforeCapture { draggableId: DraggableId; + mode: MovementMode; +} + +export interface DragStart extends BeforeCapture { type: TypeId; source: DraggableLocation; - mode: MovementMode; } export interface DragUpdate extends DragStart { @@ -87,6 +93,7 @@ export interface DropResult extends DragUpdate { } export interface DragDropContextProps { + onBeforeCapture?(before: BeforeCapture): void; onBeforeDragStart?(initial: DragStart): void; onDragStart?(initial: DragStart, provided: ResponderProvided): void; onDragUpdate?(initial: DragUpdate, provided: ResponderProvided): void; diff --git a/types/react-beautiful-dnd/react-beautiful-dnd-tests.tsx b/types/react-beautiful-dnd/react-beautiful-dnd-tests.tsx index ba02d4a6f5..1ef9b57ed7 100644 --- a/types/react-beautiful-dnd/react-beautiful-dnd-tests.tsx +++ b/types/react-beautiful-dnd/react-beautiful-dnd-tests.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import * as ReactDOM from 'react-dom'; -import { DragDropContext, Draggable, Droppable, DropResult, DragStart, DragUpdate, ResponderProvided, DroppableStateSnapshot, resetServerContext } from 'react-beautiful-dnd'; +import { DragDropContext, Draggable, Droppable, DropResult, BeforeCapture, DragStart, DragUpdate, ResponderProvided, DroppableStateSnapshot, resetServerContext } from 'react-beautiful-dnd'; interface Item { id: string; @@ -48,6 +48,10 @@ class App extends React.Component<{}, AppState> { this.onDragEnd = this.onDragEnd.bind(this); } + onBeforeCapture(beforeCapture: BeforeCapture) { + // + } + onBeforeDragStart(dragStart: DragStart) { // } @@ -84,7 +88,7 @@ class App extends React.Component<{}, AppState> { render() { return ( - + {(provided, snapshot) => (