react-dnd-touch-backend: Add touchSlop, ignoreContextMenu and scrollAngleRanges options. (#25244)

* Add touchSlop, ignoreContextMenu and scrollAngleRanges to the TouchBackendOptions type.

* v4
This commit is contained in:
Toby Rahilly
2018-04-25 09:14:10 +10:00
committed by Wesley Wigham
parent efc15ee34b
commit 7f5ae12581
2 changed files with 19 additions and 1 deletions

View File

@@ -1,4 +1,4 @@
// Type definitions for react-dnd-touch-backend 0.3
// Type definitions for react-dnd-touch-backend 0.4
// Project: https://github.com/yahoo/react-dnd-touch-backend#readme
// Definitions by: Daniel Król <https://github.com/mleko>, Janeene Beeforth <https://github.com/dawnmist>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
@@ -31,4 +31,18 @@ export interface TouchBackendOptions {
* @deprecated replaced by delayTouchStart and delayMouseStart, but is still supported at present.
*/
delay?: number;
/**
* Specifies the pixel distance moved before a drag is signaled. Default 0.
*/
touchSlop?: number;
/**
* If true, prevents the contextmenu event from canceling a drag. Default false.
*/
ignoreContextMenu?: boolean;
/**
* Specifies ranges of angles in degrees that drag events should be ignored. This is useful when you want to allow
* the user to scroll in a particular direction instead of dragging. Degrees move clockwise, 0/360 pointing to the
* left. Default: undefined
*/
scrollAngleRanges?: ReadonlyArray<{ start?: number, end?: number }>;
}

View File

@@ -11,3 +11,7 @@ const dndComponentKeyboardEvents = ReactDnd.DragDropContext(TouchBackend({enable
const dndComponentOldDelay = ReactDnd.DragDropContext(TouchBackend({delay: 300}));
const dndComponentAllCurrentEvents = ReactDnd.DragDropContext(TouchBackend(
{enableKeyboardEvents: true, enableMouseEvents: true, delayMouseStart: 100, delayTouchStart: 200}));
const dndComponentWithScrollAngleRanges = ReactDnd.DragDropContext(TouchBackend(
{ scrollAngleRanges: [{ start: 0, end: 0 }, { start: 0 }, { end: 0 }] }));
const dndComponentWithTouchSlop = ReactDnd.DragDropContext(TouchBackend({ touchSlop: 0 }));
const dndComponentWithIgnoreContextMenu = ReactDnd.DragDropContext(TouchBackend({ ignoreContextMenu: true }));