1 | import * as React from 'react';
|
2 |
|
3 | export type Axis = 'x' | 'y' | 'xy';
|
4 |
|
5 | export type Offset = number | string;
|
6 |
|
7 | export interface SortStart {
|
8 | node: Element;
|
9 | index: number;
|
10 | collection: Offset;
|
11 | isKeySorting: boolean;
|
12 | nodes: HTMLElement[];
|
13 | helper: HTMLElement;
|
14 | }
|
15 |
|
16 | export interface SortOver {
|
17 | index: number;
|
18 | oldIndex: number;
|
19 | newIndex: number;
|
20 | collection: Offset;
|
21 | isKeySorting: boolean;
|
22 | nodes: HTMLElement[];
|
23 | helper: HTMLElement;
|
24 | }
|
25 |
|
26 | export interface SortEnd {
|
27 | oldIndex: number;
|
28 | newIndex: number;
|
29 | collection: Offset;
|
30 | isKeySorting: boolean;
|
31 | nodes: HTMLElement[];
|
32 | }
|
33 |
|
34 | export type SortEvent = React.MouseEvent<any> | React.TouchEvent<any>;
|
35 |
|
36 | export type SortEventWithTag = SortEvent & {
|
37 | target: {
|
38 | tagName: string;
|
39 | };
|
40 | };
|
41 |
|
42 | export type SortStartHandler = (sort: SortStart, event: SortEvent) => void;
|
43 |
|
44 | export type SortMoveHandler = (event: SortEvent) => void;
|
45 |
|
46 | export type SortEndHandler = (sort: SortEnd, event: SortEvent) => void;
|
47 |
|
48 | export type SortOverHandler = (sort: SortOver, event: SortEvent) => void;
|
49 |
|
50 | export type ContainerGetter = (
|
51 | element: React.ReactElement<any>,
|
52 | ) => HTMLElement | Promise<HTMLElement>;
|
53 |
|
54 | export type HelperContainerGetter = () => HTMLElement;
|
55 |
|
56 | export interface Dimensions {
|
57 | width: number;
|
58 | height: number;
|
59 | }
|
60 |
|
61 | export interface SortableContainerProps {
|
62 | axis?: Axis;
|
63 | lockAxis?: Axis;
|
64 | helperClass?: string;
|
65 | transitionDuration?: number;
|
66 | keyboardSortingTransitionDuration?: number;
|
67 | keyCodes?: {
|
68 | lift?: number[];
|
69 | drop?: number[];
|
70 | cancel?: number[];
|
71 | up?: number[];
|
72 | down?: number[];
|
73 | };
|
74 | pressDelay?: number;
|
75 | pressThreshold?: number;
|
76 | distance?: number;
|
77 | shouldCancelStart?: (event: SortEvent | SortEventWithTag) => boolean;
|
78 | updateBeforeSortStart?: SortStartHandler;
|
79 | onSortStart?: SortStartHandler;
|
80 | onSortMove?: SortMoveHandler;
|
81 | onSortEnd?: SortEndHandler;
|
82 | onSortOver?: SortOverHandler;
|
83 | useDragHandle?: boolean;
|
84 | useWindowAsScrollContainer?: boolean;
|
85 | hideSortableGhost?: boolean;
|
86 | lockToContainerEdges?: boolean;
|
87 | lockOffset?: Offset | [Offset, Offset];
|
88 | getContainer?: ContainerGetter;
|
89 | getHelperDimensions?: (sort: SortStart) => Dimensions;
|
90 | helperContainer?: HTMLElement | HelperContainerGetter;
|
91 | }
|
92 |
|
93 | export interface SortableElementProps {
|
94 | index: number;
|
95 | collection?: Offset;
|
96 | disabled?: boolean;
|
97 | }
|
98 |
|
99 | export interface Config {
|
100 | withRef: boolean;
|
101 | }
|
102 |
|
103 | export type WrappedComponentFactory<P> = (props: P) => JSX.Element;
|
104 |
|
105 | export type WrappedComponent<P> =
|
106 | | React.ComponentClass<P>
|
107 | | React.SFC<P>
|
108 | | WrappedComponentFactory<P>;
|
109 |
|
110 | export function SortableContainer<P>(
|
111 | wrappedComponent: WrappedComponent<P>,
|
112 | config?: Config,
|
113 | ): React.ComponentClass<P & SortableContainerProps>;
|
114 |
|
115 | export function SortableElement<P>(
|
116 | wrappedComponent: WrappedComponent<P>,
|
117 | config?: Config,
|
118 | ): React.ComponentClass<P & SortableElementProps>;
|
119 |
|
120 | export function SortableHandle<P>(
|
121 | wrappedComponent: WrappedComponent<P>,
|
122 | config?: Config,
|
123 | ): React.ComponentClass<P>;
|
124 |
|
125 | export function arrayMove<T>(
|
126 | collection: T[],
|
127 | previousIndex: number,
|
128 | newIndex: number,
|
129 | ): T[];
|