1 | import * as React from 'react';
|
2 | import { NodeMouseEventHandler, NodeDragEventHandler, NodeDragEventParams, NodeMouseEventParams } from './contextTypes';
|
3 | import { DataNode, IconType, Key, FlattenNode, DataEntity, EventDataNode, NodeInstance, ScrollTo, Direction, FieldNames, BasicDataNode } from './interface';
|
4 | import { NodeListRef } from './NodeList';
|
5 | import DropIndicator from './DropIndicator';
|
6 | interface CheckInfo<TreeDataType extends BasicDataNode = DataNode> {
|
7 | event: 'check';
|
8 | node: EventDataNode<TreeDataType>;
|
9 | checked: boolean;
|
10 | nativeEvent: MouseEvent;
|
11 | checkedNodes: TreeDataType[];
|
12 | checkedNodesPositions?: {
|
13 | node: TreeDataType;
|
14 | pos: string;
|
15 | }[];
|
16 | halfCheckedKeys?: Key[];
|
17 | }
|
18 | export interface AllowDropOptions<TreeDataType extends BasicDataNode = DataNode> {
|
19 | dragNode: TreeDataType;
|
20 | dropNode: TreeDataType;
|
21 | dropPosition: -1 | 0 | 1;
|
22 | }
|
23 | export type AllowDrop<TreeDataType extends BasicDataNode = DataNode> = (options: AllowDropOptions<TreeDataType>) => boolean;
|
24 | export type DraggableFn = (node: DataNode) => boolean;
|
25 | export type DraggableConfig = {
|
26 | icon?: React.ReactNode | false;
|
27 | nodeDraggable?: DraggableFn;
|
28 | };
|
29 | export type ExpandAction = false | 'click' | 'doubleClick';
|
30 | export interface TreeProps<TreeDataType extends BasicDataNode = DataNode> {
|
31 | prefixCls: string;
|
32 | className?: string;
|
33 | style?: React.CSSProperties;
|
34 | focusable?: boolean;
|
35 | activeKey?: Key | null;
|
36 | tabIndex?: number;
|
37 | children?: React.ReactNode;
|
38 | treeData?: TreeDataType[];
|
39 | fieldNames?: FieldNames;
|
40 | showLine?: boolean;
|
41 | showIcon?: boolean;
|
42 | icon?: IconType;
|
43 | selectable?: boolean;
|
44 | expandAction?: ExpandAction;
|
45 | disabled?: boolean;
|
46 | multiple?: boolean;
|
47 | checkable?: boolean | React.ReactNode;
|
48 | checkStrictly?: boolean;
|
49 | draggable?: DraggableFn | boolean | DraggableConfig;
|
50 | defaultExpandParent?: boolean;
|
51 | autoExpandParent?: boolean;
|
52 | defaultExpandAll?: boolean;
|
53 | defaultExpandedKeys?: Key[];
|
54 | expandedKeys?: Key[];
|
55 | defaultCheckedKeys?: Key[];
|
56 | checkedKeys?: Key[] | {
|
57 | checked: Key[];
|
58 | halfChecked: Key[];
|
59 | };
|
60 | defaultSelectedKeys?: Key[];
|
61 | selectedKeys?: Key[];
|
62 | allowDrop?: AllowDrop<TreeDataType>;
|
63 | titleRender?: (node: TreeDataType) => React.ReactNode;
|
64 | dropIndicatorRender?: (props: {
|
65 | dropPosition: -1 | 0 | 1;
|
66 | dropLevelOffset: number;
|
67 | indent: number;
|
68 | prefixCls: string;
|
69 | direction: Direction;
|
70 | }) => React.ReactNode;
|
71 | onFocus?: React.FocusEventHandler<HTMLDivElement>;
|
72 | onBlur?: React.FocusEventHandler<HTMLDivElement>;
|
73 | onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
|
74 | onContextMenu?: React.MouseEventHandler<HTMLDivElement>;
|
75 | onClick?: NodeMouseEventHandler;
|
76 | onDoubleClick?: NodeMouseEventHandler;
|
77 | onScroll?: React.UIEventHandler<HTMLElement>;
|
78 | onExpand?: (expandedKeys: Key[], info: {
|
79 | node: EventDataNode<TreeDataType>;
|
80 | expanded: boolean;
|
81 | nativeEvent: MouseEvent;
|
82 | }) => void;
|
83 | onCheck?: (checked: {
|
84 | checked: Key[];
|
85 | halfChecked: Key[];
|
86 | } | Key[], info: CheckInfo<TreeDataType>) => void;
|
87 | onSelect?: (selectedKeys: Key[], info: {
|
88 | event: 'select';
|
89 | selected: boolean;
|
90 | node: EventDataNode<TreeDataType>;
|
91 | selectedNodes: TreeDataType[];
|
92 | nativeEvent: MouseEvent;
|
93 | }) => void;
|
94 | onLoad?: (loadedKeys: Key[], info: {
|
95 | event: 'load';
|
96 | node: EventDataNode<TreeDataType>;
|
97 | }) => void;
|
98 | loadData?: (treeNode: EventDataNode<TreeDataType>) => Promise<any>;
|
99 | loadedKeys?: Key[];
|
100 | onMouseEnter?: (info: NodeMouseEventParams<TreeDataType>) => void;
|
101 | onMouseLeave?: (info: NodeMouseEventParams<TreeDataType>) => void;
|
102 | onRightClick?: (info: {
|
103 | event: React.MouseEvent;
|
104 | node: EventDataNode<TreeDataType>;
|
105 | }) => void;
|
106 | onDragStart?: (info: NodeDragEventParams<TreeDataType>) => void;
|
107 | onDragEnter?: (info: NodeDragEventParams<TreeDataType> & {
|
108 | expandedKeys: Key[];
|
109 | }) => void;
|
110 | onDragOver?: (info: NodeDragEventParams<TreeDataType>) => void;
|
111 | onDragLeave?: (info: NodeDragEventParams<TreeDataType>) => void;
|
112 | onDragEnd?: (info: NodeDragEventParams<TreeDataType>) => void;
|
113 | onDrop?: (info: NodeDragEventParams<TreeDataType> & {
|
114 | dragNode: EventDataNode<TreeDataType>;
|
115 | dragNodesKeys: Key[];
|
116 | dropPosition: number;
|
117 | dropToGap: boolean;
|
118 | }) => void;
|
119 | |
120 |
|
121 |
|
122 |
|
123 | onActiveChange?: (key: Key) => void;
|
124 | filterTreeNode?: (treeNode: EventDataNode<TreeDataType>) => boolean;
|
125 | motion?: any;
|
126 | switcherIcon?: IconType;
|
127 | height?: number;
|
128 | itemHeight?: number;
|
129 | virtual?: boolean;
|
130 | direction?: Direction;
|
131 | rootClassName?: string;
|
132 | rootStyle?: React.CSSProperties;
|
133 | }
|
134 | interface TreeState<TreeDataType extends BasicDataNode = DataNode> {
|
135 | keyEntities: Record<Key, DataEntity<TreeDataType>>;
|
136 | indent: number | null;
|
137 | selectedKeys: Key[];
|
138 | checkedKeys: Key[];
|
139 | halfCheckedKeys: Key[];
|
140 | loadedKeys: Key[];
|
141 | loadingKeys: Key[];
|
142 | expandedKeys: Key[];
|
143 | draggingNodeKey: React.Key;
|
144 | dragChildrenKeys: Key[];
|
145 | dropPosition: -1 | 0 | 1 | null;
|
146 | dropLevelOffset: number | null;
|
147 | dropContainerKey: Key | null;
|
148 | dropTargetKey: Key | null;
|
149 | dropTargetPos: string | null;
|
150 | dropAllowed: boolean;
|
151 | dragOverNodeKey: Key | null;
|
152 | treeData: TreeDataType[];
|
153 | flattenNodes: FlattenNode<TreeDataType>[];
|
154 | focused: boolean;
|
155 | activeKey: Key | null;
|
156 | listChanging: boolean;
|
157 | prevProps: TreeProps;
|
158 | fieldNames: FieldNames;
|
159 | }
|
160 | declare class Tree<TreeDataType extends DataNode | BasicDataNode = DataNode> extends React.Component<TreeProps<TreeDataType>, TreeState<TreeDataType>> {
|
161 | static defaultProps: {
|
162 | prefixCls: string;
|
163 | showLine: boolean;
|
164 | showIcon: boolean;
|
165 | selectable: boolean;
|
166 | multiple: boolean;
|
167 | checkable: boolean;
|
168 | disabled: boolean;
|
169 | checkStrictly: boolean;
|
170 | draggable: boolean;
|
171 | defaultExpandParent: boolean;
|
172 | autoExpandParent: boolean;
|
173 | defaultExpandAll: boolean;
|
174 | defaultExpandedKeys: any[];
|
175 | defaultCheckedKeys: any[];
|
176 | defaultSelectedKeys: any[];
|
177 | dropIndicatorRender: typeof DropIndicator;
|
178 | allowDrop: () => boolean;
|
179 | expandAction: boolean;
|
180 | };
|
181 | static TreeNode: React.FC<import("./interface").TreeNodeProps<DataNode>>;
|
182 | destroyed: boolean;
|
183 | delayedDragEnterLogic: Record<Key, number>;
|
184 | loadingRetryTimes: Record<Key, number>;
|
185 | state: TreeState<TreeDataType>;
|
186 | dragStartMousePosition: any;
|
187 | dragNode: NodeInstance<TreeDataType>;
|
188 | currentMouseOverDroppableNodeKey: any;
|
189 | listRef: React.RefObject<NodeListRef>;
|
190 | componentDidMount(): void;
|
191 | componentDidUpdate(): void;
|
192 | onUpdated(): void;
|
193 | componentWillUnmount(): void;
|
194 | static getDerivedStateFromProps(props: TreeProps, prevState: TreeState): Partial<TreeState<DataNode>>;
|
195 | onNodeDragStart: NodeDragEventHandler<TreeDataType, HTMLDivElement>;
|
196 | |
197 |
|
198 |
|
199 |
|
200 |
|
201 |
|
202 |
|
203 | onNodeDragEnter: (event: React.DragEvent<HTMLDivElement>, node: NodeInstance<TreeDataType>) => void;
|
204 | onNodeDragOver: (event: React.DragEvent<HTMLDivElement>, node: NodeInstance<TreeDataType>) => void;
|
205 | onNodeDragLeave: NodeDragEventHandler<TreeDataType>;
|
206 | onWindowDragEnd: (event: any) => void;
|
207 | onNodeDragEnd: NodeDragEventHandler<TreeDataType>;
|
208 | onNodeDrop: (event: React.DragEvent<HTMLDivElement>, node: any, outsideTree?: boolean) => void;
|
209 | resetDragState(): void;
|
210 | cleanDragState: () => void;
|
211 | triggerExpandActionExpand: NodeMouseEventHandler;
|
212 | onNodeClick: NodeMouseEventHandler;
|
213 | onNodeDoubleClick: NodeMouseEventHandler;
|
214 | onNodeSelect: NodeMouseEventHandler<TreeDataType>;
|
215 | onNodeCheck: (e: React.MouseEvent<HTMLSpanElement>, treeNode: EventDataNode<TreeDataType>, checked: boolean) => void;
|
216 | onNodeLoad: (treeNode: EventDataNode<TreeDataType>) => Promise<void>;
|
217 | onNodeMouseEnter: NodeMouseEventHandler<TreeDataType>;
|
218 | onNodeMouseLeave: NodeMouseEventHandler<TreeDataType>;
|
219 | onNodeContextMenu: NodeMouseEventHandler<TreeDataType>;
|
220 | onFocus: React.FocusEventHandler<HTMLDivElement>;
|
221 | onBlur: React.FocusEventHandler<HTMLDivElement>;
|
222 | getTreeNodeRequiredProps: () => {
|
223 | expandedKeys: Key[];
|
224 | selectedKeys: Key[];
|
225 | loadedKeys: Key[];
|
226 | loadingKeys: Key[];
|
227 | checkedKeys: Key[];
|
228 | halfCheckedKeys: Key[];
|
229 | dragOverNodeKey: Key;
|
230 | dropPosition: 0 | 1 | -1;
|
231 | keyEntities: Record<Key, DataEntity<TreeDataType>>;
|
232 | };
|
233 |
|
234 | setExpandedKeys: (expandedKeys: Key[]) => void;
|
235 | onNodeExpand: (e: React.MouseEvent<HTMLDivElement>, treeNode: EventDataNode<TreeDataType>) => void;
|
236 | onListChangeStart: () => void;
|
237 | onListChangeEnd: () => void;
|
238 | onActiveChange: (newActiveKey: Key | null) => void;
|
239 | getActiveItem: () => FlattenNode<TreeDataType>;
|
240 | offsetActiveKey: (offset: number) => void;
|
241 | onKeyDown: React.KeyboardEventHandler<HTMLDivElement>;
|
242 | |
243 |
|
244 |
|
245 | setUncontrolledState: (state: Partial<TreeState<TreeDataType>>, atomic?: boolean, forceState?: Partial<TreeState<TreeDataType>> | null) => void;
|
246 | scrollTo: ScrollTo;
|
247 | render(): React.JSX.Element;
|
248 | }
|
249 | export default Tree;
|