react-native-tree-multi-select 3.0.0-beta.2 → 3.0.0-beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (96) hide show
  1. package/README.md +85 -25
  2. package/lib/module/TreeView.js +36 -31
  3. package/lib/module/TreeView.js.map +1 -1
  4. package/lib/module/components/CheckboxView.js +8 -4
  5. package/lib/module/components/CheckboxView.js.map +1 -1
  6. package/lib/module/components/CustomExpandCollapseIcon.js +2 -2
  7. package/lib/module/components/CustomExpandCollapseIcon.js.map +1 -1
  8. package/lib/module/components/DragOverlay.js +17 -5
  9. package/lib/module/components/DragOverlay.js.map +1 -1
  10. package/lib/module/components/DropIndicator.js +2 -2
  11. package/lib/module/components/DropIndicator.js.map +1 -1
  12. package/lib/module/components/NodeList.js +80 -56
  13. package/lib/module/components/NodeList.js.map +1 -1
  14. package/lib/module/constants/treeView.constants.js +3 -0
  15. package/lib/module/constants/treeView.constants.js.map +1 -1
  16. package/lib/module/helpers/expandCollapse.helper.js.map +1 -1
  17. package/lib/module/helpers/moveTreeNode.helper.js +30 -0
  18. package/lib/module/helpers/moveTreeNode.helper.js.map +1 -1
  19. package/lib/module/helpers/selectAll.helper.js.map +1 -1
  20. package/lib/module/helpers/toggleCheckbox.helper.js +44 -61
  21. package/lib/module/helpers/toggleCheckbox.helper.js.map +1 -1
  22. package/lib/module/hooks/useDragDrop.js +141 -34
  23. package/lib/module/hooks/useDragDrop.js.map +1 -1
  24. package/lib/module/{handlers/ScrollToNodeHandler.js → hooks/useScrollToNode.js} +27 -26
  25. package/lib/module/hooks/useScrollToNode.js.map +1 -0
  26. package/lib/module/index.js +1 -0
  27. package/lib/module/index.js.map +1 -1
  28. package/lib/module/jest.setup.js +14 -1
  29. package/lib/module/jest.setup.js.map +1 -1
  30. package/lib/module/store/treeView.store.js +3 -0
  31. package/lib/module/store/treeView.store.js.map +1 -1
  32. package/lib/module/utils/typedMemo.js +3 -3
  33. package/lib/module/utils/typedMemo.js.map +1 -1
  34. package/lib/module/utils/useDeepCompareEffect.js +5 -5
  35. package/lib/module/utils/useDeepCompareEffect.js.map +1 -1
  36. package/lib/typescript/src/TreeView.d.ts +3 -3
  37. package/lib/typescript/src/TreeView.d.ts.map +1 -1
  38. package/lib/typescript/src/components/CheckboxView.d.ts +1 -2
  39. package/lib/typescript/src/components/CheckboxView.d.ts.map +1 -1
  40. package/lib/typescript/src/components/CustomExpandCollapseIcon.d.ts +1 -2
  41. package/lib/typescript/src/components/CustomExpandCollapseIcon.d.ts.map +1 -1
  42. package/lib/typescript/src/components/DragOverlay.d.ts +1 -0
  43. package/lib/typescript/src/components/DragOverlay.d.ts.map +1 -1
  44. package/lib/typescript/src/components/DropIndicator.d.ts +1 -2
  45. package/lib/typescript/src/components/DropIndicator.d.ts.map +1 -1
  46. package/lib/typescript/src/components/NodeList.d.ts.map +1 -1
  47. package/lib/typescript/src/constants/treeView.constants.d.ts +2 -0
  48. package/lib/typescript/src/constants/treeView.constants.d.ts.map +1 -1
  49. package/lib/typescript/src/helpers/expandCollapse.helper.d.ts +2 -2
  50. package/lib/typescript/src/helpers/expandCollapse.helper.d.ts.map +1 -1
  51. package/lib/typescript/src/helpers/moveTreeNode.helper.d.ts.map +1 -1
  52. package/lib/typescript/src/helpers/selectAll.helper.d.ts +4 -4
  53. package/lib/typescript/src/helpers/selectAll.helper.d.ts.map +1 -1
  54. package/lib/typescript/src/helpers/toggleCheckbox.helper.d.ts +3 -0
  55. package/lib/typescript/src/helpers/toggleCheckbox.helper.d.ts.map +1 -1
  56. package/lib/typescript/src/hooks/useDragDrop.d.ts +18 -7
  57. package/lib/typescript/src/hooks/useDragDrop.d.ts.map +1 -1
  58. package/lib/typescript/src/{handlers/ScrollToNodeHandler.d.ts → hooks/useScrollToNode.d.ts} +13 -15
  59. package/lib/typescript/src/hooks/useScrollToNode.d.ts.map +1 -0
  60. package/lib/typescript/src/index.d.ts +4 -3
  61. package/lib/typescript/src/index.d.ts.map +1 -1
  62. package/lib/typescript/src/jest.setup.d.ts +1 -1
  63. package/lib/typescript/src/jest.setup.d.ts.map +1 -1
  64. package/lib/typescript/src/store/treeView.store.d.ts +2 -1
  65. package/lib/typescript/src/store/treeView.store.d.ts.map +1 -1
  66. package/lib/typescript/src/types/dragDrop.types.d.ts +19 -0
  67. package/lib/typescript/src/types/dragDrop.types.d.ts.map +1 -1
  68. package/lib/typescript/src/types/treeView.types.d.ts +149 -35
  69. package/lib/typescript/src/types/treeView.types.d.ts.map +1 -1
  70. package/lib/typescript/src/utils/typedMemo.d.ts +1 -1
  71. package/lib/typescript/src/utils/typedMemo.d.ts.map +1 -1
  72. package/lib/typescript/src/utils/useDeepCompareEffect.d.ts +2 -2
  73. package/lib/typescript/src/utils/useDeepCompareEffect.d.ts.map +1 -1
  74. package/package.json +32 -15
  75. package/src/TreeView.tsx +57 -35
  76. package/src/components/CheckboxView.tsx +7 -4
  77. package/src/components/CustomExpandCollapseIcon.tsx +2 -2
  78. package/src/components/DragOverlay.tsx +19 -6
  79. package/src/components/DropIndicator.tsx +2 -2
  80. package/src/components/NodeList.tsx +90 -58
  81. package/src/constants/treeView.constants.ts +4 -1
  82. package/src/helpers/expandCollapse.helper.ts +5 -5
  83. package/src/helpers/moveTreeNode.helper.ts +33 -0
  84. package/src/helpers/selectAll.helper.ts +10 -10
  85. package/src/helpers/toggleCheckbox.helper.ts +57 -69
  86. package/src/hooks/useDragDrop.ts +182 -46
  87. package/src/{handlers/ScrollToNodeHandler.tsx → hooks/useScrollToNode.ts} +48 -45
  88. package/src/index.tsx +9 -0
  89. package/src/jest.setup.ts +14 -1
  90. package/src/store/treeView.store.ts +6 -1
  91. package/src/types/dragDrop.types.ts +21 -0
  92. package/src/types/treeView.types.ts +157 -41
  93. package/src/utils/typedMemo.ts +3 -3
  94. package/src/utils/useDeepCompareEffect.ts +13 -7
  95. package/lib/module/handlers/ScrollToNodeHandler.js.map +0 -1
  96. package/lib/typescript/src/handlers/ScrollToNodeHandler.d.ts.map +0 -1
package/src/index.tsx CHANGED
@@ -9,20 +9,25 @@ import type {
9
9
  CheckboxValueType,
10
10
  BuiltInCheckBoxViewStyleProps,
11
11
  SelectionPropagation,
12
+ DragAndDropOptions,
12
13
  DragDropCustomizations,
13
14
  DragOverlayStyleProps,
14
15
  DragOverlayComponentProps,
15
16
  DropIndicatorStyleProps,
16
17
  DropIndicatorComponentProps,
18
+ DragHandleProps,
17
19
  } from "./types/treeView.types";
18
20
  import type {
21
+ DragCancelEvent,
19
22
  DragEndEvent,
23
+ DragStartEvent,
20
24
  DropPosition
21
25
  } from "./types/dragDrop.types";
22
26
 
23
27
  export * from "./TreeView";
24
28
  export * from "./components/CheckboxView";
25
29
  export { moveTreeNode } from "./helpers/moveTreeNode.helper";
30
+ export { deleteTreeViewStore } from "./store/treeView.store";
26
31
 
27
32
  export type {
28
33
  TreeNode,
@@ -35,11 +40,15 @@ export type {
35
40
  CheckboxValueType,
36
41
  BuiltInCheckBoxViewStyleProps,
37
42
  SelectionPropagation,
43
+ DragAndDropOptions,
44
+ DragCancelEvent,
38
45
  DragEndEvent,
46
+ DragStartEvent,
39
47
  DropPosition,
40
48
  DragDropCustomizations,
41
49
  DragOverlayStyleProps,
42
50
  DragOverlayComponentProps,
43
51
  DropIndicatorStyleProps,
44
52
  DropIndicatorComponentProps,
53
+ DragHandleProps,
45
54
  };
package/src/jest.setup.ts CHANGED
@@ -1 +1,14 @@
1
- import "@testing-library/jest-native/extend-expect";
1
+ import "@testing-library/react-native/extend-expect";
2
+ import { configure } from "@testing-library/react-native";
3
+
4
+ // Skip host component auto-detection which fails in RN 0.78+ jest environment.
5
+ // The type definition doesn't include hostComponentNames yet, but it works at runtime.
6
+ (configure as any)({
7
+ hostComponentNames: {
8
+ text: "Text",
9
+ textInput: "TextInput",
10
+ switch: "RCTSwitch",
11
+ scrollView: "RCTScrollView",
12
+ modal: "Modal",
13
+ },
14
+ });
@@ -1,6 +1,7 @@
1
+ import { create, type StoreApi, type UseBoundStore } from "zustand";
2
+
1
3
  import type { SelectionPropagation, TreeNode } from "../types/treeView.types";
2
4
  import type { DropPosition } from "../types/dragDrop.types";
3
- import { create, type StoreApi, type UseBoundStore } from "zustand";
4
5
 
5
6
  export type TreeViewState<ID> = {
6
7
  // Store ids of checked tree nodes
@@ -153,6 +154,10 @@ export function getTreeViewStore<ID>(id: string): UseBoundStore<StoreApi<TreeVie
153
154
  return typedStore<ID>().get(id)!;
154
155
  }
155
156
 
157
+ export function deleteTreeViewStore(id: string) {
158
+ treeViewStores.delete(id);
159
+ }
160
+
156
161
  export function useTreeViewStore<ID = string>(id: string) {
157
162
  return getTreeViewStore<ID>(id);
158
163
  }
@@ -1,7 +1,21 @@
1
1
  import type { TreeNode } from "./treeView.types";
2
2
 
3
+ /** Where a node is dropped relative to the target: as a sibling above/below, or as a child inside */
3
4
  export type DropPosition = "above" | "below" | "inside";
4
5
 
6
+ /** Event payload passed to the onDragStart callback when a drag begins */
7
+ export interface DragStartEvent<ID = string> {
8
+ /** The id of the node being dragged */
9
+ draggedNodeId: ID;
10
+ }
11
+
12
+ /** Event payload passed to the onDragCancel callback when a drag is cancelled without a drop */
13
+ export interface DragCancelEvent<ID = string> {
14
+ /** The id of the node that was being dragged */
15
+ draggedNodeId: ID;
16
+ }
17
+
18
+ /** Event payload passed to the onDragEnd callback after a successful drop */
5
19
  export interface DragEndEvent<ID = string> {
6
20
  /** The id of the node that was dragged */
7
21
  draggedNodeId: ID;
@@ -13,11 +27,18 @@ export interface DragEndEvent<ID = string> {
13
27
  newTreeData: TreeNode<ID>[];
14
28
  }
15
29
 
30
+ /** Internal representation of the current drop target during a drag operation */
16
31
  export interface DropTarget<ID = string> {
32
+ /** The id of the node being hovered over */
17
33
  targetNodeId: ID;
34
+ /** Index of the target node in the flattened list */
18
35
  targetIndex: number;
36
+ /** Where the drop would occur relative to the target */
19
37
  position: DropPosition;
38
+ /** Whether this is a valid drop location (e.g. not dropping a node onto itself or its descendants) */
20
39
  isValid: boolean;
40
+ /** Nesting level of the target node */
21
41
  targetLevel: number;
42
+ /** Y-coordinate for positioning the drop indicator */
22
43
  indicatorTop: number;
23
44
  }
@@ -1,3 +1,4 @@
1
+ import { ComponentType, RefObject } from "react";
1
2
  import type {
2
3
  StyleProp,
3
4
  TextProps,
@@ -8,183 +9,294 @@ import type { FlashListProps } from "@shopify/flash-list";
8
9
  import type {
9
10
  ScrollToNodeHandlerRef,
10
11
  ScrollToNodeParams
11
- } from "../handlers/ScrollToNodeHandler";
12
+ } from "../hooks/useScrollToNode";
12
13
  import type {
13
14
  CheckboxProps as _CheckboxProps
14
15
  } from "@futurejj/react-native-checkbox";
15
- import type { DragEndEvent, DropPosition } from "./dragDrop.types";
16
+ import type { DragCancelEvent, DragEndEvent, DragStartEvent, DropPosition } from "./dragDrop.types";
16
17
 
18
+ /** The tri-state value of a checkbox: checked, unchecked, or indeterminate */
17
19
  export type CheckboxValueType = boolean | "indeterminate";
18
20
 
21
+ /** Props passed to a custom expand/collapse icon component */
19
22
  export interface ExpandIconProps {
23
+ /** Whether the node is currently expanded */
20
24
  isExpanded: boolean;
21
25
  }
22
26
 
27
+ /** A single node in the tree data structure */
23
28
  export interface TreeNode<ID = string> {
29
+ /** Unique identifier for this node */
24
30
  id: ID;
31
+ /** Display name for this node */
25
32
  name: string;
33
+ /** Child nodes (omit or empty array for leaf nodes) */
26
34
  children?: TreeNode<ID>[];
35
+ /** Additional custom data fields */
27
36
  [key: string]: any;
28
37
  }
29
38
 
39
+ /** Internal flattened representation of a tree node with its nesting level */
30
40
  export interface __FlattenedTreeNode__<ID = string> extends TreeNode<ID> {
41
+ /** Nesting depth of this node (0 = root level) */
31
42
  level?: number;
32
43
  }
33
44
 
34
- // Remove non-modifiable keys
45
+ /** FlashList props available for customization (excludes `data` and `renderItem`) */
35
46
  export type TreeFlatListProps<ItemT = any> = Omit<
36
47
  FlashListProps<ItemT>,
37
48
  "data"
38
49
  | "renderItem"
39
50
  >;
40
51
 
52
+ /** Props passed to a custom node row component */
41
53
  export interface NodeRowProps<ID = string> {
54
+ /** The tree node to render */
42
55
  node: TreeNode<ID>;
56
+ /** Nesting depth of this node (0 = root level) */
43
57
  level: number;
44
58
 
59
+ /** Current checkbox state of this node */
45
60
  checkedValue: CheckboxValueType;
61
+ /** Whether this node's children are currently visible */
46
62
  isExpanded: boolean;
47
63
 
64
+ /** Callback to toggle this node's checked state */
48
65
  onCheck: () => void;
66
+ /** Callback to toggle this node's expanded/collapsed state */
49
67
  onExpand: () => void;
50
68
 
51
- isDragTarget?: boolean;
69
+ /** Whether this node is an invalid drop target during a drag operation */
70
+ isInvalidDropTarget?: boolean;
71
+ /** Whether this node is the current valid drop target */
72
+ isDropTarget?: boolean;
73
+ /** The drop position if this node is the current drop target */
74
+ dropPosition?: DropPosition;
75
+ /** Whether a drag operation is currently in progress */
52
76
  isDragging?: boolean;
77
+ /** Whether this node is the one being dragged */
53
78
  isDraggedNode?: boolean;
79
+
80
+ /** Props to spread on a drag handle element. Attach to a specific View to
81
+ * make only that area initiate drag, or spread on the root for whole-row drag.
82
+ * Only present when drag-and-drop is enabled. */
83
+ dragHandleProps?: DragHandleProps;
84
+ }
85
+
86
+ /** Touch handlers to spread on a drag handle element within a custom node row */
87
+ export interface DragHandleProps {
88
+ onTouchStart: (e: any) => void;
89
+ onTouchEnd: () => void;
90
+ onTouchCancel: () => void;
54
91
  }
55
92
 
93
+ /** Customization options for tree item appearance and behavior */
56
94
  export interface TreeItemCustomizations<ID> {
95
+ /** Style props for the built-in checkbox view */
57
96
  checkBoxViewStyleProps?: BuiltInCheckBoxViewStyleProps;
58
97
 
98
+ /** Pixels of indentation per nesting level. Default: 15 */
59
99
  indentationMultiplier?: number;
60
100
 
61
- CheckboxComponent?: React.ComponentType<CheckBoxViewProps>;
62
- ExpandCollapseIconComponent?: React.ComponentType<ExpandIconProps>;
63
- ExpandCollapseTouchableComponent?: React.ComponentType<TouchableOpacityProps>;
101
+ /** Custom checkbox component replacing the built-in checkbox */
102
+ CheckboxComponent?: ComponentType<CheckBoxViewProps>;
103
+ /** Custom expand/collapse icon component */
104
+ ExpandCollapseIconComponent?: ComponentType<ExpandIconProps>;
105
+ /** Custom touchable component wrapping the expand/collapse icon */
106
+ ExpandCollapseTouchableComponent?: ComponentType<TouchableOpacityProps>;
64
107
 
65
- CustomNodeRowComponent?: React.ComponentType<NodeRowProps<ID>>;
108
+ /** Fully custom node row component replacing the entire built-in row */
109
+ CustomNodeRowComponent?: ComponentType<NodeRowProps<ID>>;
66
110
  }
67
111
 
112
+ /** Internal props for a single node in the list (extends TreeItemCustomizations) */
68
113
  export interface NodeProps<ID> extends TreeItemCustomizations<ID> {
114
+ /** The flattened tree node data */
69
115
  node: __FlattenedTreeNode__<ID>;
116
+ /** Nesting depth of this node */
70
117
  level: number;
118
+ /** Internal store identifier */
71
119
  storeId: string;
72
120
 
121
+ /** Index of this node in the flattened list */
73
122
  nodeIndex?: number;
123
+ /** Whether drag-and-drop is enabled */
74
124
  dragEnabled?: boolean;
125
+ /** Whether a drag operation is currently in progress */
75
126
  isDragging?: boolean;
127
+ /** Callback when a touch starts on this node (used for drag initiation) */
76
128
  onNodeTouchStart?: (
77
129
  nodeId: ID,
78
130
  pageY: number,
79
131
  locationY: number,
80
132
  nodeIndex: number
81
133
  ) => void;
134
+ /** Callback when a touch ends on this node */
82
135
  onNodeTouchEnd?: () => void;
83
- longPressDuration?: number;
136
+ /** Callback reporting this node's measured height */
84
137
  onItemLayout?: (height: number) => void;
138
+ /** Customizations for drag-and-drop visuals */
85
139
  dragDropCustomizations?: DragDropCustomizations<ID>;
86
140
  }
87
141
 
88
- export interface NodeListProps<ID> extends TreeItemCustomizations<ID> {
89
- treeFlashListProps?: TreeFlatListProps;
90
-
91
- scrollToNodeHandlerRef: React.RefObject<ScrollToNodeHandlerRef<ID>>;
92
- initialScrollNodeID?: ID;
93
-
94
- storeId: string;
95
-
96
- dragEnabled?: boolean;
142
+ /** Configuration options for drag-and-drop reordering */
143
+ export interface DragAndDropOptions<ID = string> {
144
+ /** Enable drag-and-drop reordering. Default: true (when dragAndDrop is provided) */
145
+ enabled?: boolean;
146
+ /** Callback fired when a drag operation begins */
147
+ onDragStart?: (event: DragStartEvent<ID>) => void;
148
+ /** Callback fired after a node is successfully dropped at a new position */
97
149
  onDragEnd?: (event: DragEndEvent<ID>) => void;
150
+ /** Callback fired when a drag is cancelled without a successful drop */
151
+ onDragCancel?: (event: DragCancelEvent<ID>) => void;
152
+ /** Long press duration in ms to start drag. Default: 400 */
98
153
  longPressDuration?: number;
154
+ /** Distance from edge (px) to trigger auto-scroll during drag. Default: 60 */
99
155
  autoScrollThreshold?: number;
156
+ /** Speed multiplier for auto-scroll during drag. Default: 1.0 */
100
157
  autoScrollSpeed?: number;
101
- /** Offset of the dragged overlay from the finger, in item-height units. Default: -1 (one item above finger) */
158
+ /** Offset of the dragged overlay from the finger, in item-height units. Default: -4 (four items above finger) */
102
159
  dragOverlayOffset?: number;
103
160
  /** Delay in ms before auto-expanding a collapsed node during drag hover. Default: 800 */
104
161
  autoExpandDelay?: number;
105
162
  /** Customizations for drag-and-drop visuals (overlay, indicator, opacity) */
106
- dragDropCustomizations?: DragDropCustomizations<ID>;
163
+ customizations?: DragDropCustomizations<ID>;
164
+
165
+ /** Callback to determine if a node can be dropped on a specific target.
166
+ * Return false to grey out the target and suppress the drop indicator. */
167
+ canDrop?: (draggedNode: TreeNode<ID>, targetNode: TreeNode<ID>, position: DropPosition) => boolean;
168
+ /** Maximum nesting depth allowed. Drops that would exceed this depth are suppressed. */
169
+ maxDepth?: number;
170
+ /** Callback to determine if a node can accept children.
171
+ * Return false to suppress the "inside" drop zone for that node. */
172
+ canNodeHaveChildren?: (node: TreeNode<ID>) => boolean;
173
+ /** Callback to determine if a node can be dragged.
174
+ * Return false to prevent dragging this node. Default: all nodes are draggable. */
175
+ canDrag?: (node: TreeNode<ID>) => boolean;
176
+ }
177
+
178
+ /** Props for the NodeList component that renders the flattened tree */
179
+ export interface NodeListProps<ID> extends TreeItemCustomizations<ID> {
180
+ /** Additional props passed to the underlying FlashList */
181
+ treeFlashListProps?: TreeFlatListProps;
182
+
183
+ /** Ref for programmatic scroll-to-node functionality */
184
+ scrollToNodeHandlerRef: RefObject<ScrollToNodeHandlerRef<ID>>;
185
+ /** Node ID to scroll to on initial render */
186
+ initialScrollNodeID?: ID;
187
+
188
+ /** Internal store identifier */
189
+ storeId: string;
190
+
191
+ /** Drag-and-drop configuration */
192
+ dragAndDrop?: DragAndDropOptions<ID>;
107
193
  }
108
194
 
195
+ /** Props for the TreeView component */
109
196
  export interface TreeViewProps<ID = string> extends Omit<
110
197
  NodeListProps<ID>, "storeId" | "scrollToNodeHandlerRef"
111
198
  > {
199
+ /** The tree data to render */
112
200
  data: TreeNode<ID>[];
113
201
 
202
+ /** Callback fired when checked nodes change. Receives checked and indeterminate node IDs. */
114
203
  onCheck?: (checkedIds: ID[], indeterminateIds: ID[]) => void;
204
+ /** Callback fired when expanded nodes change. Receives all currently expanded node IDs. */
115
205
  onExpand?: (expandedIds: ID[]) => void;
116
206
 
207
+ /** Node IDs that should be checked on initial render */
117
208
  preselectedIds?: ID[];
118
209
 
210
+ /** Node IDs that should be expanded on initial render */
119
211
  preExpandedIds?: ID[];
120
212
 
213
+ /** Controls whether checking a node propagates to its children and/or parents */
121
214
  selectionPropagation?: SelectionPropagation;
122
215
 
123
- /** Enable drag-and-drop reordering */
124
- dragEnabled?: boolean;
125
- /** Callback fired after a node is dropped at a new position */
126
- onDragEnd?: (event: DragEndEvent<ID>) => void;
127
- /** Long press duration in ms to start drag. Default: 400 */
128
- longPressDuration?: number;
129
- /** Distance from edge (px) to trigger auto-scroll. Default: 60 */
130
- autoScrollThreshold?: number;
131
- /** Speed multiplier for auto-scroll. Default: 1.0 */
132
- autoScrollSpeed?: number;
133
- /** Offset of the dragged overlay from the finger, in item-height units. Default: -1 (one item above finger) */
134
- dragOverlayOffset?: number;
135
- /** Delay in ms before auto-expanding a collapsed node during drag hover. Default: 800 */
136
- autoExpandDelay?: number;
216
+ /** Drag-and-drop configuration */
217
+ dragAndDrop?: DragAndDropOptions<ID>;
137
218
  }
138
219
 
139
220
  type CheckboxProps = Omit<_CheckboxProps, "onPress" | "status">;
140
221
 
222
+ /** Props for the checkbox view component */
141
223
  export interface CheckBoxViewProps {
224
+ /** Current checkbox state */
142
225
  value: CheckboxValueType;
226
+ /** Callback when the checkbox value changes */
143
227
  onValueChange: (value: boolean) => void;
228
+ /** Label text displayed next to the checkbox */
144
229
  text: string;
230
+ /** Test ID for testing frameworks */
145
231
  testID?: string;
146
232
  }
147
233
 
234
+ /** Style props for customizing the built-in checkbox view */
148
235
  export interface BuiltInCheckBoxViewStyleProps {
149
- // Optional style modifiers
236
+ /** Style for the outermost container wrapping the checkbox and text */
150
237
  outermostParentViewStyle?: StyleProp<ViewStyle>;
238
+ /** Style for the view wrapping the checkbox itself */
151
239
  checkboxParentViewStyle?: StyleProp<ViewStyle>;
240
+ /** Style for the touchable area wrapping the label text */
152
241
  textTouchableStyle?: StyleProp<ViewStyle>;
153
242
 
154
- // Optional checkbox and text component props
243
+ /** Additional props passed to the underlying Checkbox component */
155
244
  checkboxProps?: CheckboxProps;
245
+ /** Props passed to the label Text component */
156
246
  textProps?: TextProps;
157
247
  }
158
248
 
249
+ /** Combined props for the built-in checkbox view (CheckBoxViewProps + style props) */
159
250
  export type BuiltInCheckBoxViewProps =
160
251
  CheckBoxViewProps
161
252
  & BuiltInCheckBoxViewStyleProps;
162
253
 
254
+ /** Ref handle exposed by the TreeView component for imperative operations */
163
255
  export interface TreeViewRef<ID = string> {
256
+ /** Select (check) all nodes in the tree */
164
257
  selectAll: () => void;
258
+ /** Unselect (uncheck) all nodes in the tree */
165
259
  unselectAll: () => void;
166
260
 
261
+ /** Select all nodes that match the current search filter */
167
262
  selectAllFiltered: () => void;
263
+ /** Unselect all nodes that match the current search filter */
168
264
  unselectAllFiltered: () => void;
169
265
 
266
+ /** Expand all nodes in the tree */
170
267
  expandAll: () => void;
268
+ /** Collapse all nodes in the tree */
171
269
  collapseAll: () => void;
172
270
 
271
+ /** Expand specific nodes by their IDs */
173
272
  expandNodes: (ids: ID[]) => void;
273
+ /** Collapse specific nodes by their IDs */
174
274
  collapseNodes: (ids: ID[]) => void;
175
275
 
276
+ /** Select (check) specific nodes by their IDs */
176
277
  selectNodes: (ids: ID[]) => void;
278
+ /** Unselect (uncheck) specific nodes by their IDs */
177
279
  unselectNodes: (ids: ID[]) => void;
178
280
 
281
+ /** Set the search text and optionally specify which node fields to search */
179
282
  setSearchText: (searchText: string, searchKeys?: string[]) => void;
180
283
 
284
+ /** Programmatically scroll to a specific node by its ID */
181
285
  scrollToNodeID: (scrollToNodeParams: ScrollToNodeParams<ID>) => void;
182
286
 
287
+ /** Get a map of child node IDs to their parent node IDs */
183
288
  getChildToParentMap: () => Map<ID, ID>;
289
+
290
+ /** Programmatically move a node to a new position in the tree.
291
+ * Works like a drag-and-drop but without user interaction. */
292
+ moveNode: (nodeId: ID, targetNodeId: ID, position: DropPosition) => void;
184
293
  }
185
294
 
295
+ /** Controls how checkbox selection propagates through the tree hierarchy */
186
296
  export interface SelectionPropagation {
297
+ /** Whether checking a parent node automatically checks all its children. Default: true */
187
298
  toChildren?: boolean;
299
+ /** Whether checking all children automatically checks their parent. Default: true */
188
300
  toParents?: boolean;
189
301
  }
190
302
 
@@ -232,16 +344,18 @@ export interface DragOverlayStyleProps {
232
344
 
233
345
  /** Combined drag-and-drop customization props */
234
346
  export interface DragDropCustomizations<ID = string> {
235
- /** Opacity applied to the dragged node and its invalid drop targets. Default: 0.3 */
347
+ /** Opacity applied to the node being dragged. Default: 0.3 */
236
348
  draggedNodeOpacity?: number;
349
+ /** Opacity applied to invalid drop targets during drag. Default: 0.3 */
350
+ invalidTargetOpacity?: number;
237
351
  /** Style props for the built-in drop indicator */
238
352
  dropIndicatorStyleProps?: DropIndicatorStyleProps;
239
353
  /** Style props for the drag overlay (lifted node ghost) */
240
354
  dragOverlayStyleProps?: DragOverlayStyleProps;
241
- /** Fully custom drop indicator component replaces the built-in line/highlight */
242
- CustomDropIndicatorComponent?: React.ComponentType<DropIndicatorComponentProps>;
243
- /** Fully custom drag overlay component replaces the built-in ghost node */
244
- CustomDragOverlayComponent?: React.ComponentType<DragOverlayComponentProps<ID>>;
355
+ /** Fully custom drop indicator component - replaces the built-in line/highlight */
356
+ CustomDropIndicatorComponent?: ComponentType<DropIndicatorComponentProps>;
357
+ /** Fully custom drag overlay component - replaces the built-in ghost node */
358
+ CustomDragOverlayComponent?: ComponentType<DragOverlayComponentProps<ID>>;
245
359
  }
246
360
 
247
361
  /** Props passed to a custom drag overlay component */
@@ -250,4 +364,6 @@ export interface DragOverlayComponentProps<ID = string> {
250
364
  node: __FlattenedTreeNode__<ID>;
251
365
  /** The nesting level of the dragged node */
252
366
  level: number;
367
+ /** The current checkbox value of the dragged node */
368
+ checkedValue: CheckboxValueType;
253
369
  }
@@ -1,4 +1,4 @@
1
- import React from "react";
1
+ import { memo } from "react";
2
2
 
3
- /** wrapper for React.memo that works with generic components. */
4
- export const typedMemo: <T>(c: T) => T = React.memo;
3
+ /** wrapper for memo that works with generic components. */
4
+ export const typedMemo: <T>(c: T) => T = memo;
@@ -1,4 +1,10 @@
1
- import React from "react";
1
+ import {
2
+ useEffect,
3
+ useMemo,
4
+ useRef,
5
+ type DependencyList,
6
+ type EffectCallback,
7
+ } from "react";
2
8
  import { fastIsEqual } from "fast-is-equal";
3
9
 
4
10
  /**
@@ -9,17 +15,17 @@ import { fastIsEqual } from "fast-is-equal";
9
15
  * @param deps The dependencies array to compare deeply.
10
16
  */
11
17
  export default function useDeepCompareEffect(
12
- effect: React.EffectCallback,
13
- deps: React.DependencyList
18
+ effect: EffectCallback,
19
+ deps: DependencyList
14
20
  ) {
15
21
  // Ref to track if it's the first render
16
- const firstRenderRef = React.useRef<boolean>(true);
22
+ const firstRenderRef = useRef<boolean>(true);
17
23
 
18
24
  // Memoized dependencies to avoid redundant `isEqual` checks
19
- const memoizedDependencies = React.useMemo(() => deps, [deps]);
25
+ const memoizedDependencies = useMemo(() => deps, [deps]);
20
26
 
21
27
  // Ref to store the previous dependencies
22
- const dependenciesRef = React.useRef<React.DependencyList>(memoizedDependencies);
28
+ const dependenciesRef = useRef<DependencyList>(memoizedDependencies);
23
29
 
24
30
  // Check for dependency changes
25
31
  const dependenciesChanged = !fastIsEqual(
@@ -30,7 +36,7 @@ export default function useDeepCompareEffect(
30
36
  dependenciesRef.current = memoizedDependencies;
31
37
  }
32
38
 
33
- React.useEffect(() => {
39
+ useEffect(() => {
34
40
  if (firstRenderRef.current) {
35
41
  firstRenderRef.current = false;
36
42
  }
@@ -1 +0,0 @@
1
- {"version":3,"names":["React","expandNodes","useTreeViewStore","useShallow","typedMemo","fastIsEqual","ExpandQueueAction","_innerScrollToNodeHandler","props","ref","storeId","flashListRef","flattenedFilteredNodes","setInitialScrollIndex","initialScrollNodeID","expanded","childToParentMap","state","useImperativeHandle","scrollToNodeID","params","queuedScrollToNodeParams","current","setExpandAndScrollToNodeQueue","EXPANDED","nodeId","expandScrolledNode","useRef","expandAndScrollToNodeQueue","useState","latestFlattenedFilteredNodesRef","useEffect","prevQueue","includes","RENDERED","useLayoutEffect","parentId","has","get","animated","viewOffset","viewPosition","scrollToItem","index","findIndex","item","id","scrollToIndex","__DEV__","console","info","initialScrollDone","_ScrollToNodeHandler","forwardRef","ScrollToNodeHandler"],"sourceRoot":"../../../src","sources":["handlers/ScrollToNodeHandler.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,WAAW,QAAQ,qCAAkC;AAC9D,SAASC,gBAAgB,QAAQ,4BAAyB;AAC1D,SAASC,UAAU,QAAQ,uBAAuB;AAElD,SAASC,SAAS,QAAQ,uBAAoB;AAC9C,SAASC,WAAW,QAAQ,eAAe;AAmB3C;AAAA,IACKC,iBAAiB,0BAAjBA,iBAAiB;EAAjBA,iBAAiB,CAAjBA,iBAAiB;EAAjBA,iBAAiB,CAAjBA,iBAAiB;EAAA,OAAjBA,iBAAiB;AAAA,EAAjBA,iBAAiB;AAStB,SAASC,yBAAyBA,CAChCC,KAAgB,EAChBC,GAAmD,EACnD;EACA,MAAM;IACJC,OAAO;IACPC,YAAY;IACZC,sBAAsB;IACtBC,qBAAqB;IACrBC;EACF,CAAC,GAAGN,KAAK;EAET,MAAM;IAAEO,QAAQ;IAAEC;EAAiB,CAAC,GAAGd,gBAAgB,CAAKQ,OAAO,CAAC,CAACP,UAAU,CAC7Ec,KAAK,KAAK;IACRF,QAAQ,EAAEE,KAAK,CAACF,QAAQ;IACxBC,gBAAgB,EAAEC,KAAK,CAACD;EAC1B,CAAC,CACH,CAAC,CAAC;EAEFhB,KAAK,CAACkB,mBAAmB,CAACT,GAAG,EAAE,OAAO;IACpCU,cAAc,EAAGC,MAA8B,IAAK;MAClDC,wBAAwB,CAACC,OAAO,GAAGF,MAAM;MACzC;MACAG,6BAA6B,CAAC,CAACjB,iBAAiB,CAACkB,QAAQ,CAAC,CAAC;MAC3D;MACAvB,WAAW,CACTS,OAAO,EACP,CAACW,wBAAwB,CAACC,OAAO,CAACG,MAAM,CAAC,EACzC,CAACJ,wBAAwB,CAACC,OAAO,CAACI,kBACpC,CAAC;IACH;EACF,CAAC,CAAC,EAAE,CAAChB,OAAO,CAAC,CAAC;;EAEd;EACA,MAAMW,wBAAwB,GAAGrB,KAAK,CAAC2B,MAAM,CAAgC,IAAI,CAAC;;EAElF;EACA,MAAM,CAACC,0BAA0B,EAAEL,6BAA6B,CAAC,GAC7DvB,KAAK,CAAC6B,QAAQ,CAAsB,EAAE,CAAC;EAE3C,MAAMC,+BAA+B,GAAG9B,KAAK,CAAC2B,MAAM,CAACf,sBAAsB,CAAC;;EAE5E;AACF;EACEZ,KAAK,CAAC+B,SAAS,CAAC,MAAM;IACpBR,6BAA6B,CAACS,SAAS,IAAI;MACzC,IAAIA,SAAS,CAACC,QAAQ,CAAC3B,iBAAiB,CAACkB,QAAQ,CAAC,EAAE;QAClDM,+BAA+B,CAACR,OAAO,GAAGV,sBAAsB;QAChE,OAAO,CACLN,iBAAiB,CAACkB,QAAQ,EAC1BlB,iBAAiB,CAAC4B,QAAQ,CAC3B;MACH,CAAC,MAAM;QACL,OAAOF,SAAS;MAClB;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CAACpB,sBAAsB,CAAC,CAAC;;EAE5B;AACF;EACEZ,KAAK,CAACmC,eAAe,CAAC,MAAM;IAC1B,IAAId,wBAAwB,CAACC,OAAO,KAAK,IAAI,EAC3C;IAEF,IAAI,CAACjB,WAAW,CACduB,0BAA0B,EAC1B,CAACtB,iBAAiB,CAACkB,QAAQ,EAAElB,iBAAiB,CAAC4B,QAAQ,CACzD,CAAC,EAAE;MACD;IACF;;IAEA;IACA,IAAI,CAACb,wBAAwB,CAACC,OAAO,CAACI,kBAAkB,EAAE;MACxD,IAAIU,QAAwB;MAC5B;MACA,IAAIpB,gBAAgB,CAACqB,GAAG,CAAChB,wBAAwB,CAACC,OAAO,CAACG,MAAM,CAAC,EAAE;QACjEW,QAAQ,GAAGpB,gBAAgB,CAACsB,GAAG,CAACjB,wBAAwB,CAACC,OAAO,CAACG,MAAM,CAAO;MAChF;;MAEA;MACA,IAAIW,QAAQ,IAAI,CAACrB,QAAQ,CAACsB,GAAG,CAACD,QAAQ,CAAC,EACrC;IACJ;IACA;IAAA,KACK;MACH,IAAI,CAACrB,QAAQ,CAACsB,GAAG,CAAChB,wBAAwB,CAACC,OAAO,CAACG,MAAM,CAAC,EACxD;IACJ;IAEA,MAAM;MACJA,MAAM;MACNc,QAAQ;MACRC,UAAU;MACVC;IACF,CAAC,GAAGpB,wBAAwB,CAACC,OAAQ;IAErC,SAASoB,YAAYA,CAAA,EAAG;MACtB,MAAMC,KAAK,GAAGb,+BAA+B,CAACR,OAAO,CAACsB,SAAS,CAC7DC,IAAI,IAAIA,IAAI,CAACC,EAAE,KAAKrB,MACtB,CAAC;MAED,IAAIkB,KAAK,KAAK,CAAC,CAAC,IAAIhC,YAAY,CAACW,OAAO,EAAE;QACxC;QACAX,YAAY,CAACW,OAAO,CAACyB,aAAa,CAAC;UACjCJ,KAAK;UACLJ,QAAQ;UACRC,UAAU;UACVC;QACF,CAAC,CAAC;MACJ,CAAC,MAAM;QACL,IAAIO,OAAO,EAAE;UACXC,OAAO,CAACC,IAAI,CAAC,yFAAyF,CAAC;QACzG;MACF;;MAEA;MACA7B,wBAAwB,CAACC,OAAO,GAAG,IAAI;MACvCC,6BAA6B,CAAC,EAAE,CAAC;IACnC;IAEAmB,YAAY,CAAC,CAAC;EAChB,CAAC,EAAE,CAAC1B,gBAAgB,EAAED,QAAQ,EAAEJ,YAAY,EAAEiB,0BAA0B,CAAC,CAAC;;EAE1E;EACA;AACF;EACE,MAAMuB,iBAAiB,GAAGnD,KAAK,CAAC2B,MAAM,CAAC,KAAK,CAAC;EAC7C3B,KAAK,CAACmC,eAAe,CAAC,MAAM;IAC1B,IAAIgB,iBAAiB,CAAC7B,OAAO,EAAE;IAE/B,MAAMqB,KAAK,GAAG/B,sBAAsB,CAACgC,SAAS,CAC5CC,IAAI,IAAIA,IAAI,CAACC,EAAE,KAAKhC,mBACtB,CAAC;IAEDD,qBAAqB,CAAC8B,KAAK,CAAC;IAE5B,IAAIA,KAAK,KAAK,CAAC,CAAC,EAAE;MAChBQ,iBAAiB,CAAC7B,OAAO,GAAG,IAAI;IAClC;IACA;EACF,CAAC,EAAE,CAACV,sBAAsB,EAAEE,mBAAmB,CAAC,CAAC;EACjD;;EAEA,OAAO,IAAI;AACb;AAEA,MAAMsC,oBAAoB,gBAAGpD,KAAK,CAACqD,UAAU,CAAC9C,yBAAyB,CAEtB;AAEjD,OAAO,MAAM+C,mBAAmB,GAAGlD,SAAS,CAE1CgD,oBAAoB,CAAC","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"ScrollToNodeHandler.d.ts","sourceRoot":"","sources":["../../../../src/handlers/ScrollToNodeHandler.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,KAAK,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAIrE,UAAU,KAAK,CAAC,EAAE;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IAC1C,sBAAsB,EAAE,qBAAqB,CAAC,EAAE,CAAC,EAAE,CAAC;IACpD,qBAAqB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IACpE,mBAAmB,EAAE,EAAE,GAAG,SAAS,CAAC;CACrC;AAED,MAAM,WAAW,kBAAkB,CAAC,EAAE;IACpC,MAAM,EAAE,EAAE,CAAC;IACX,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAQD,MAAM,WAAW,sBAAsB,CAAC,EAAE;IACxC,cAAc,EAAE,CAAC,MAAM,EAAE,kBAAkB,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC;CAC1D;AAED,iBAAS,yBAAyB,CAAC,EAAE,EACnC,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,EAChB,GAAG,EAAE,KAAK,CAAC,YAAY,CAAC,sBAAsB,CAAC,EAAE,CAAC,CAAC,QA8IpD;AAMD,eAAO,MAAM,mBAAmB,GAJ6C,EAAE,SACtE,KAAK,CAAC,EAAE,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,sBAAsB,CAAC,EAAE,CAAC,CAAC,CAAC;CAAE,KACzE,UAAU,CAAC,OAAO,yBAAyB,CAIzB,CAAC"}