react-arborist 1.1.0 → 2.0.0-rc

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 (122) hide show
  1. package/dist/components/{drop-cursor.d.ts → cursor.d.ts} +0 -0
  2. package/dist/components/default-container.d.ts +2 -0
  3. package/dist/components/default-cursor.d.ts +3 -0
  4. package/dist/components/default-drag-preview.d.ts +3 -0
  5. package/dist/components/default-node.d.ts +4 -0
  6. package/dist/components/default-row.d.ts +4 -0
  7. package/dist/components/drag-preview-container.d.ts +2 -0
  8. package/dist/components/list-inner-element.d.ts +2 -0
  9. package/dist/components/list-outer-element.d.ts +2 -0
  10. package/dist/components/outer-drop.d.ts +4 -0
  11. package/dist/components/provider.d.ts +11 -0
  12. package/dist/components/row-container.d.ts +8 -0
  13. package/dist/components/tree-container.d.ts +2 -0
  14. package/dist/components/tree.d.ts +5 -4
  15. package/dist/context.d.ts +23 -18
  16. package/dist/data/create-index.d.ts +5 -0
  17. package/dist/data/create-list.d.ts +4 -0
  18. package/dist/data/create-root.d.ts +5 -0
  19. package/dist/data/flatten-tree.d.ts +4 -2
  20. package/dist/data/simple-tree.d.ts +43 -0
  21. package/dist/dnd/compute-drop.d.ts +4 -4
  22. package/dist/dnd/drag-hook.d.ts +3 -4
  23. package/dist/dnd/drop-hook.d.ts +2 -3
  24. package/dist/hooks/use-fresh-node.d.ts +2 -0
  25. package/dist/hooks/use-simple-tree.d.ts +13 -0
  26. package/dist/hooks/use-uncontrolled-tree.d.ts +24 -0
  27. package/dist/hooks/use-validated-props.d.ts +3 -0
  28. package/dist/index.d.ts +8 -4
  29. package/dist/index.js +2093 -1184
  30. package/dist/index.js.map +1 -1
  31. package/dist/interfaces/node-api.d.ts +67 -0
  32. package/dist/interfaces/tree-api.d.ts +112 -0
  33. package/dist/module.js +2082 -1192
  34. package/dist/module.js.map +1 -1
  35. package/dist/state/dnd-slice.d.ts +20 -0
  36. package/dist/state/drag-slice.d.ts +7 -0
  37. package/dist/state/edit-slice.d.ts +8 -0
  38. package/dist/state/focus-slice.d.ts +12 -0
  39. package/dist/state/initial.d.ts +3 -0
  40. package/dist/state/open-slice.d.ts +30 -0
  41. package/dist/state/root-reducer.d.ts +13 -0
  42. package/dist/state/selection-slice.d.ts +36 -0
  43. package/dist/types/dnd.d.ts +9 -0
  44. package/dist/types/handlers.d.ts +24 -0
  45. package/dist/types/renderers.d.ts +30 -0
  46. package/dist/types/state.d.ts +2 -0
  47. package/dist/types/tree-props.d.ts +43 -0
  48. package/dist/types/utils.d.ts +21 -0
  49. package/dist/utils/props.d.ts +3 -0
  50. package/dist/utils.d.ts +15 -6
  51. package/package.json +10 -7
  52. package/src/components/cursor.tsx +15 -0
  53. package/src/components/default-container.tsx +229 -0
  54. package/src/components/{drop-cursor.tsx → default-cursor.tsx} +15 -20
  55. package/src/components/default-drag-preview.tsx +92 -0
  56. package/src/components/default-node.tsx +15 -0
  57. package/src/components/default-row.tsx +21 -0
  58. package/src/components/drag-preview-container.tsx +26 -0
  59. package/src/components/list-inner-element.tsx +22 -0
  60. package/src/components/list-outer-element.tsx +45 -0
  61. package/src/components/outer-drop.ts +7 -0
  62. package/src/components/provider.tsx +97 -0
  63. package/src/components/row-container.tsx +82 -0
  64. package/src/components/tree-container.tsx +13 -0
  65. package/src/components/tree.tsx +17 -126
  66. package/src/context.ts +36 -0
  67. package/src/data/create-index.ts +9 -0
  68. package/src/data/create-list.ts +56 -0
  69. package/src/data/create-root.ts +53 -0
  70. package/src/data/simple-tree.ts +103 -0
  71. package/src/dnd/compute-drop.ts +16 -16
  72. package/src/dnd/drag-hook.ts +28 -23
  73. package/src/dnd/drop-hook.ts +35 -21
  74. package/src/dnd/outer-drop-hook.ts +6 -6
  75. package/src/hooks/use-fresh-node.ts +16 -0
  76. package/src/hooks/use-simple-tree.ts +55 -0
  77. package/src/hooks/use-validated-props.ts +35 -0
  78. package/src/index.ts +9 -5
  79. package/src/interfaces/node-api.ts +187 -0
  80. package/src/interfaces/tree-api.ts +552 -0
  81. package/src/state/dnd-slice.ts +36 -0
  82. package/src/state/drag-slice.ts +31 -0
  83. package/src/state/edit-slice.ts +19 -0
  84. package/src/state/focus-slice.ts +28 -0
  85. package/src/state/initial.ts +14 -0
  86. package/src/state/open-slice.ts +53 -0
  87. package/src/state/root-reducer.ts +21 -0
  88. package/src/state/selection-slice.ts +75 -0
  89. package/src/types/dnd.ts +10 -0
  90. package/src/types/handlers.ts +24 -0
  91. package/src/types/renderers.ts +34 -0
  92. package/src/types/state.ts +3 -0
  93. package/src/types/tree-props.ts +63 -0
  94. package/src/types/utils.ts +26 -0
  95. package/src/utils/props.ts +8 -0
  96. package/src/utils.ts +125 -11
  97. package/README.md +0 -220
  98. package/dist/components/preview.d.ts +0 -2
  99. package/dist/components/row.d.ts +0 -7
  100. package/dist/data/enrich-tree.d.ts +0 -2
  101. package/dist/provider.d.ts +0 -3
  102. package/dist/reducer.d.ts +0 -46
  103. package/dist/selection/range.d.ts +0 -13
  104. package/dist/selection/selection-hook.d.ts +0 -3
  105. package/dist/selection/selection.d.ts +0 -33
  106. package/dist/tree-api-hook.d.ts +0 -6
  107. package/dist/tree-api.d.ts +0 -34
  108. package/dist/types.d.ts +0 -131
  109. package/src/components/preview.tsx +0 -108
  110. package/src/components/row.tsx +0 -114
  111. package/src/context.tsx +0 -52
  112. package/src/data/enrich-tree.ts +0 -74
  113. package/src/data/flatten-tree.ts +0 -17
  114. package/src/provider.tsx +0 -61
  115. package/src/reducer.ts +0 -161
  116. package/src/selection/range.ts +0 -41
  117. package/src/selection/selection-hook.ts +0 -24
  118. package/src/selection/selection.test.ts +0 -111
  119. package/src/selection/selection.ts +0 -186
  120. package/src/tree-api-hook.ts +0 -34
  121. package/src/tree-api.ts +0 -156
  122. package/src/types.ts +0 -155
package/dist/module.js CHANGED
@@ -1,289 +1,72 @@
1
- import {jsxs as $g00cZ$jsxs, jsx as $g00cZ$jsx} from "react/jsx-runtime";
2
- import $g00cZ$react, {forwardRef as $g00cZ$forwardRef, useMemo as $g00cZ$useMemo, useRef as $g00cZ$useRef, createContext as $g00cZ$createContext, useContext as $g00cZ$useContext, useReducer as $g00cZ$useReducer, useImperativeHandle as $g00cZ$useImperativeHandle, useEffect as $g00cZ$useEffect, useLayoutEffect as $g00cZ$useLayoutEffect, memo as $g00cZ$memo, useCallback as $g00cZ$useCallback} from "react";
3
- import {DndProvider as $g00cZ$DndProvider, useDrop as $g00cZ$useDrop, useDragLayer as $g00cZ$useDragLayer, useDrag as $g00cZ$useDrag} from "react-dnd";
1
+ import {jsxs as $g00cZ$jsxs, jsx as $g00cZ$jsx, Fragment as $g00cZ$Fragment} from "react/jsx-runtime";
2
+ import $g00cZ$react, {forwardRef as $g00cZ$forwardRef, useRef as $g00cZ$useRef, useMemo as $g00cZ$useMemo, useImperativeHandle as $g00cZ$useImperativeHandle, useEffect as $g00cZ$useEffect, createContext as $g00cZ$createContext, useContext as $g00cZ$useContext, memo as $g00cZ$memo, useCallback as $g00cZ$useCallback, useState as $g00cZ$useState} from "react";
3
+ import {useSyncExternalStore as $g00cZ$useSyncExternalStore} from "use-sync-external-store/shim";
4
4
  import {HTML5Backend as $g00cZ$HTML5Backend, getEmptyImage as $g00cZ$getEmptyImage} from "react-dnd-html5-backend";
5
+ import {DndProvider as $g00cZ$DndProvider, useDrag as $g00cZ$useDrag, useDrop as $g00cZ$useDrop, useDragLayer as $g00cZ$useDragLayer} from "react-dnd";
6
+ import {createStore as $g00cZ$createStore, combineReducers as $g00cZ$combineReducers} from "redux";
5
7
  import {FixedSizeList as $g00cZ$FixedSizeList} from "react-window";
6
- import $g00cZ$memoizeone from "memoize-one";
7
- import $g00cZ$reactdom from "react-dom";
8
-
9
-
10
8
 
9
+ function $parcel$export(e, n, v, s) {
10
+ Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
11
+ }
11
12
 
12
13
 
13
14
 
14
15
 
15
- class $043ce40ea783107b$export$9a58ef0d7ad3278c {
16
- constructor(start, end){
17
- this.start = start;
18
- this.end = end;
19
- if (this.start > this.end) throw new Error("Invalid range: start larger than end");
20
- }
21
- serialize() {
22
- return [
23
- this.start,
24
- this.end
25
- ];
26
- }
27
- contains(n) {
28
- return n >= this.start && n <= this.end;
29
- }
30
- overlaps(r) {
31
- return this.contains(r.start - 1) || this.contains(r.end + 1);
32
- }
33
- combine(r) {
34
- this.start = Math.min(r.start, this.start);
35
- this.end = Math.max(r.end, this.end);
36
- }
37
- get size() {
38
- return this.end - this.start + 1;
39
- }
40
- clone() {
41
- return new $043ce40ea783107b$export$9a58ef0d7ad3278c(this.start, this.end);
42
- }
43
- map(fn) {
44
- let returns = [];
45
- for(let i = this.start; i <= this.end; i++)returns.push(fn(i));
46
- return returns;
47
- }
48
- isEqual(other) {
49
- return this.start === other.start && this.end === other.end;
50
- }
51
- }
52
-
53
-
54
- class $5ee99f971bd267fd$export$52baac22726c72bf {
55
- static parse(data, items) {
56
- if (data) return new $5ee99f971bd267fd$export$52baac22726c72bf(data.ranges, data.currentIndex, data.direction, items);
57
- else return new $5ee99f971bd267fd$export$52baac22726c72bf();
58
- }
59
- constructor(ranges = [], currentIndex = ranges.length ? ranges.length - 1 : null, direction = "none", items = []){
60
- this.ranges = [];
61
- this.direction = "none";
62
- ranges.forEach(([s, e])=>this.addRange(s, e)
63
- );
64
- this.currentIndex = currentIndex;
65
- this.direction = direction;
66
- this.items = items;
67
- }
68
- get current() {
69
- if (this.currentIndex === null) return null;
70
- const range = this.ranges[this.currentIndex];
71
- if (!range) return null;
72
- else return range;
73
- }
74
- select(n) {
75
- if (n < 0 || n >= this.items.length) return;
76
- this.clear();
77
- this.currentIndex = this.addRange(n, n);
78
- }
79
- multiSelect(n) {
80
- if (n < 0 || n >= this.items.length) return;
81
- if (this.contains(n)) return;
82
- this.currentIndex = this.addRange(n, n);
83
- this.compact(n);
84
- }
85
- deselect(n) {
86
- if (n < 0 || n >= this.items.length) return;
87
- const r1 = this.ranges.find((r)=>r.contains(n)
88
- );
89
- if (!r1) return;
90
- else if (r1.size === 1) this.removeRange(r1);
91
- else if (r1.start === n) r1.start++;
92
- else if (r1.end === n) r1.end--;
93
- else {
94
- this.removeRange(r1);
95
- this.addRange(r1.start, n - 1);
96
- this.currentIndex = this.addRange(n + 1, r1.end);
97
- }
98
- }
99
- getSelectedItems() {
100
- return this.ranges.flatMap((range)=>range.map((index)=>this.items[index]
101
- )
102
- );
103
- }
104
- extend(n) {
105
- if (n < 0 || n >= this.items.length) return;
106
- if (this.isEmpty()) this.select(n);
107
- else {
108
- const anchor = this.getAnchor();
109
- if (anchor !== null && this.current) {
110
- const [start, end] = [
111
- n,
112
- anchor
113
- ].sort((a, b)=>a - b
114
- );
115
- this.current.start = start;
116
- this.current.end = end;
117
- this.compact(n);
118
- }
119
- }
120
- }
121
- contains(n) {
122
- if (n === null) return false;
123
- return this.ranges.some((r)=>r.contains(n)
124
- );
125
- }
126
- getRanges() {
127
- return this.ranges.map((r)=>r.serialize()
128
- );
129
- }
130
- clear() {
131
- this.ranges = [];
132
- this.currentIndex = null;
133
- this.direction = "none";
134
- }
135
- serialize() {
136
- return {
137
- ranges: this.getRanges(),
138
- currentIndex: this.currentIndex,
139
- direction: this.direction
140
- };
141
- }
142
- isEqual(other) {
143
- if (other.ranges.length !== this.ranges.length) return false;
144
- for(let i = 0; i < this.ranges.length; ++i){
145
- if (!this.ranges[i].isEqual(other.ranges[i])) return false;
146
- }
147
- return true;
148
- }
149
- addRange(start, end) {
150
- const r2 = new $043ce40ea783107b$export$9a58ef0d7ad3278c(start, end);
151
- // Keep ranges sorted by start
152
- const index = this.ranges.findIndex((r)=>r.start >= start
153
- );
154
- if (index === -1) this.ranges.push(r2);
155
- else this.ranges.splice(index, 0, r2);
156
- return index === -1 ? this.ranges.length - 1 : index;
157
- }
158
- removeRange(r) {
159
- const index = this.ranges.indexOf(r);
160
- this.ranges.splice(index, 1);
161
- if (this.isEmpty()) this.currentIndex = null;
162
- else if (index === this.currentIndex) this.currentIndex = this.ranges.length - 1;
163
- }
164
- isEmpty() {
165
- return this.ranges.length === 0;
166
- }
167
- getAnchor() {
168
- if (!this.current) return null;
169
- return this.direction === "backward" ? this.current.end : this.current.start;
170
- }
171
- getFocus() {
172
- if (!this.current) return -1;
173
- return this.direction === "backward" ? this.current.start : this.current.end;
174
- }
175
- compact(focus) {
176
- const removals = [];
177
- const current = this.current;
178
- for (let r3 of this.ranges){
179
- if (!this.current || r3 === this.current) continue;
180
- if (this.current.overlaps(r3)) {
181
- this.current.combine(r3);
182
- removals.push(r3);
183
- }
184
- }
185
- removals.forEach((r)=>this.removeRange(r)
186
- );
187
- if (current) this.currentIndex = this.ranges.indexOf(current);
188
- if (!this.current) return;
189
- if (this.current.start < focus) this.direction = "forward";
190
- else if (this.current.end > focus) this.direction = "backward";
191
- else this.direction = "none";
192
- }
193
- }
194
16
 
195
17
 
196
- const $3273af3fe11a7001$export$7380e5d4146ff2ce = /*#__PURE__*/ $g00cZ$createContext(null);
197
- function $3273af3fe11a7001$export$8e294ac6de4c921f() {
198
- return $g00cZ$useContext($3273af3fe11a7001$export$7380e5d4146ff2ce);
199
- }
200
- const $3273af3fe11a7001$export$86fe4415b73783a1 = /*#__PURE__*/ $g00cZ$createContext(false);
201
- function $3273af3fe11a7001$export$f3ad962ff713505f() {
202
- return $g00cZ$useContext($3273af3fe11a7001$export$86fe4415b73783a1);
203
- }
204
- const $3273af3fe11a7001$export$76f51715425ee155 = /*#__PURE__*/ $g00cZ$createContext(null);
205
- function $3273af3fe11a7001$export$6c87584817ff2461() {
206
- return $g00cZ$useContext($3273af3fe11a7001$export$76f51715425ee155);
207
- }
208
- const $3273af3fe11a7001$export$c1b9a1d3af45b7b6 = /*#__PURE__*/ $g00cZ$createContext(null);
209
- function $3273af3fe11a7001$export$ea6c3ae2bd3a5510() {
210
- const value = $g00cZ$useContext($3273af3fe11a7001$export$c1b9a1d3af45b7b6);
211
- if (!value) throw new Error("Context must be in a provider");
18
+ const $89e93131aae74bd9$export$feef243b04ff4151 = (0, $g00cZ$createContext)(null);
19
+ function $89e93131aae74bd9$export$367b0f2231a90ba0() {
20
+ const value = (0, $g00cZ$useContext)($89e93131aae74bd9$export$feef243b04ff4151);
21
+ if (value === null) throw new Error("No Tree Api Provided");
212
22
  return value;
213
23
  }
214
- const $3273af3fe11a7001$export$f34e95fabff36a8f = /*#__PURE__*/ $g00cZ$createContext(null);
215
- function $3273af3fe11a7001$export$8ad76b76a4c905f8() {
216
- const dispatch = $g00cZ$useContext($3273af3fe11a7001$export$f34e95fabff36a8f);
217
- if (!dispatch) throw new Error("No dispatch provided");
218
- return dispatch;
219
- }
220
- const $3273af3fe11a7001$export$7c7a4fd7f1336e2c = /*#__PURE__*/ $g00cZ$createContext(null);
221
- function $3273af3fe11a7001$export$1c9b7756eccadc96() {
222
- const value = $g00cZ$useContext($3273af3fe11a7001$export$7c7a4fd7f1336e2c);
223
- if (!value) throw new Error("Must provide selection context");
224
- return value.ids;
225
- }
226
- function $3273af3fe11a7001$export$fb40a80c530e5f2b() {
227
- const value = $g00cZ$useContext($3273af3fe11a7001$export$7c7a4fd7f1336e2c);
228
- if (!value) throw new Error("Must provide selection context");
229
- const s = $g00cZ$useMemo(()=>$5ee99f971bd267fd$export$52baac22726c72bf.parse(value.data, [])
230
- , [
231
- value.data
232
- ]);
233
- return (i)=>s.contains(i)
234
- ;
235
- }
236
- const $3273af3fe11a7001$export$7f994e57c9e78355 = /*#__PURE__*/ $g00cZ$createContext(null);
237
- function $3273af3fe11a7001$export$9ab192f953c1b33b() {
238
- return $g00cZ$useContext($3273af3fe11a7001$export$7f994e57c9e78355);
239
- }
240
-
241
-
242
- function $1e5818ce7991d06d$var$createNode(model, level, parent, children, isOpen, isDraggable, isDroppable) {
243
- return {
244
- id: model.id,
245
- level: level,
246
- parent: parent,
247
- children: children,
248
- isOpen: isOpen,
249
- isDraggable: isDraggable,
250
- isDroppable: isDroppable,
251
- model: model,
252
- rowIndex: null
253
- };
24
+ const $89e93131aae74bd9$export$f6d467aa8b3786af = (0, $g00cZ$createContext)(null);
25
+ function $89e93131aae74bd9$export$fd23f19d5d8f3033() {
26
+ const value = (0, $g00cZ$useContext)($89e93131aae74bd9$export$f6d467aa8b3786af);
27
+ if (value === null) throw new Error("Provide a NodesContext");
28
+ return value;
254
29
  }
255
- function $1e5818ce7991d06d$var$access(obj, accessor) {
256
- if (typeof accessor === "boolean") return accessor;
257
- if (typeof accessor === "string") return obj[accessor];
258
- return accessor(obj);
30
+ const $89e93131aae74bd9$export$2d5c5ceac203fc1e = (0, $g00cZ$createContext)(null);
31
+ function $89e93131aae74bd9$export$4930f6bf413be70e() {
32
+ const value = (0, $g00cZ$useContext)($89e93131aae74bd9$export$2d5c5ceac203fc1e);
33
+ if (value === null) throw new Error("Provide a DnDContext");
34
+ return value;
259
35
  }
260
- function $1e5818ce7991d06d$export$9c537176392280a0(model1, hideRoot = false, getChildren = "children", isOpen = "isOpen", disableDrag = false, disableDrop = false, openByDefault = true) {
261
- function visitSelfAndChildren(model, level, parent) {
262
- const open = $1e5818ce7991d06d$var$access(model, isOpen);
263
- const draggable = !$1e5818ce7991d06d$var$access(model, disableDrag);
264
- const droppable = !$1e5818ce7991d06d$var$access(model, disableDrop);
265
- const node = $1e5818ce7991d06d$var$createNode(model, level, parent, null, open === undefined ? openByDefault : open, draggable, droppable);
266
- const children = $1e5818ce7991d06d$var$access(model, getChildren);
267
- if (children) node.children = children.map((child)=>visitSelfAndChildren(child, level + 1, node)
268
- );
269
- return node;
270
- }
271
- return visitSelfAndChildren(model1, hideRoot ? -1 : 0, null);
36
+ const $89e93131aae74bd9$export$d0c71bc5e3e2d897 = (0, $g00cZ$createContext)(0);
37
+ function $89e93131aae74bd9$export$83a4f9dc3b36edb8() {
38
+ (0, $g00cZ$useContext)($89e93131aae74bd9$export$d0c71bc5e3e2d897);
272
39
  }
273
40
 
274
41
 
275
-
276
-
42
+ var $bfece7c4aed4e9c4$exports = {};
43
+
44
+ $parcel$export($bfece7c4aed4e9c4$exports, "TreeApi", () => $bfece7c4aed4e9c4$export$e2da3477247342d1);
45
+ var $0e6083160f4b36ed$exports = {};
46
+
47
+ $parcel$export($0e6083160f4b36ed$exports, "bound", () => $0e6083160f4b36ed$export$adf7c0fe6059d774);
48
+ $parcel$export($0e6083160f4b36ed$exports, "isItem", () => $0e6083160f4b36ed$export$5318634f2ee07019);
49
+ $parcel$export($0e6083160f4b36ed$exports, "isClosed", () => $0e6083160f4b36ed$export$4210f5ea57fbae57);
50
+ $parcel$export($0e6083160f4b36ed$exports, "isDecendent", () => $0e6083160f4b36ed$export$1e38f72c6c546f70);
51
+ $parcel$export($0e6083160f4b36ed$exports, "indexOf", () => $0e6083160f4b36ed$export$305f7d4e9d4624f2);
52
+ $parcel$export($0e6083160f4b36ed$exports, "noop", () => $0e6083160f4b36ed$export$8793edee2d425525);
53
+ $parcel$export($0e6083160f4b36ed$exports, "dfs", () => $0e6083160f4b36ed$export$51b654aff22fc5a6);
54
+ $parcel$export($0e6083160f4b36ed$exports, "focusNextElement", () => $0e6083160f4b36ed$export$3b0237e8566c8d65);
55
+ $parcel$export($0e6083160f4b36ed$exports, "focusPrevElement", () => $0e6083160f4b36ed$export$33b47db07a82b2fb);
56
+ $parcel$export($0e6083160f4b36ed$exports, "access", () => $0e6083160f4b36ed$export$9bb0e144ba4929ca);
57
+ $parcel$export($0e6083160f4b36ed$exports, "identifyNull", () => $0e6083160f4b36ed$export$611823266272db76);
58
+ $parcel$export($0e6083160f4b36ed$exports, "identify", () => $0e6083160f4b36ed$export$65e5b62a4c490288);
59
+ $parcel$export($0e6083160f4b36ed$exports, "mergeRefs", () => $0e6083160f4b36ed$export$c9058316764c140e);
60
+ $parcel$export($0e6083160f4b36ed$exports, "safeRun", () => $0e6083160f4b36ed$export$c6d63370cef03886);
61
+ $parcel$export($0e6083160f4b36ed$exports, "waitFor", () => $0e6083160f4b36ed$export$9bbfceb27f687c1b);
277
62
  function $0e6083160f4b36ed$export$adf7c0fe6059d774(n, min, max) {
278
63
  return Math.max(Math.min(n, max), min);
279
64
  }
280
- const $0e6083160f4b36ed$export$769c5e872f5f8638 = (node)=>!!node.children
281
- ;
282
65
  function $0e6083160f4b36ed$export$5318634f2ee07019(node) {
283
- return node && !$0e6083160f4b36ed$export$769c5e872f5f8638(node);
66
+ return node && node.isLeaf;
284
67
  }
285
68
  function $0e6083160f4b36ed$export$4210f5ea57fbae57(node) {
286
- return node && $0e6083160f4b36ed$export$769c5e872f5f8638(node) && !node.isOpen;
69
+ return node && node.isInternal && !node.isOpen;
287
70
  }
288
71
  const $0e6083160f4b36ed$export$1e38f72c6c546f70 = (a, b)=>{
289
72
  let n = a;
@@ -294,773 +77,772 @@ const $0e6083160f4b36ed$export$1e38f72c6c546f70 = (a, b)=>{
294
77
  return false;
295
78
  };
296
79
  const $0e6083160f4b36ed$export$305f7d4e9d4624f2 = (node)=>{
297
- // This should probably not throw an error, but instead return null
298
80
  if (!node.parent) throw Error("Node does not have a parent");
299
- return node.parent.children.findIndex((c)=>c.id === node.id
300
- );
81
+ return node.parent.children.findIndex((c)=>c.id === node.id);
301
82
  };
302
- function $0e6083160f4b36ed$export$8793edee2d425525() {
303
- }
304
-
305
-
306
- function $2db980bfed6822da$var$measureHover(el, offset) {
307
- const rect = el.getBoundingClientRect();
308
- const x = offset.x - Math.round(rect.x);
309
- const y = offset.y - Math.round(rect.y);
310
- const height = rect.height;
311
- const inTopHalf = y < height / 2;
312
- const inBottomHalf = !inTopHalf;
313
- const pad = height / 4;
314
- const inMiddle = y > pad && y < height - pad;
315
- const atTop = !inMiddle && inTopHalf;
316
- const atBottom = !inMiddle && inBottomHalf;
317
- return {
318
- x: x,
319
- inTopHalf: inTopHalf,
320
- inBottomHalf: inBottomHalf,
321
- inMiddle: inMiddle,
322
- atTop: atTop,
323
- atBottom: atBottom
324
- };
325
- }
326
- function $2db980bfed6822da$var$getNodesAroundCursor(node, prev, next, hover) {
327
- if (!node) // We're hoving over the empty part of the list, not over an item,
328
- // Put the cursor below the last item which is "prev"
329
- return [
330
- prev,
331
- null
332
- ];
333
- if ($0e6083160f4b36ed$export$769c5e872f5f8638(node)) {
334
- if (hover.atTop) return [
335
- prev,
336
- node
337
- ];
338
- else if (hover.inMiddle) return [
339
- node,
340
- node
341
- ];
342
- else return [
343
- node,
344
- next
345
- ];
346
- } else {
347
- if (hover.inTopHalf) return [
348
- prev,
349
- node
350
- ];
351
- else return [
352
- node,
353
- next
354
- ];
83
+ function $0e6083160f4b36ed$export$8793edee2d425525() {}
84
+ function $0e6083160f4b36ed$export$51b654aff22fc5a6(node, id) {
85
+ if (!node) return null;
86
+ if (node.id === id) return node;
87
+ if (node.children) for (let child of node.children){
88
+ const result = $0e6083160f4b36ed$export$51b654aff22fc5a6(child, id);
89
+ if (result) return result;
355
90
  }
91
+ return null;
356
92
  }
357
- function $2db980bfed6822da$var$getDropLevel(hovering, aboveCursor, belowCursor, indent) {
358
- const hoverLevel = Math.round(Math.max(0, hovering.x - indent) / indent);
359
- let min, max;
360
- if (!aboveCursor) {
361
- max = 0;
362
- min = 0;
363
- } else if (!belowCursor) {
364
- max = aboveCursor.level;
365
- min = 0;
366
- } else {
367
- max = aboveCursor.level;
368
- min = belowCursor.level;
93
+ function $0e6083160f4b36ed$export$3b0237e8566c8d65(target) {
94
+ const elements = $0e6083160f4b36ed$var$getFocusable(target);
95
+ let next;
96
+ for(let i = 0; i < elements.length; ++i){
97
+ const item = elements[i];
98
+ if (item === target) {
99
+ next = $0e6083160f4b36ed$var$nextItem(elements, i);
100
+ break;
101
+ }
369
102
  }
370
- return $0e6083160f4b36ed$export$adf7c0fe6059d774(hoverLevel, min, max);
103
+ // @ts-ignore ??
104
+ next?.focus();
371
105
  }
372
- function $2db980bfed6822da$var$canDrop(above, below) {
373
- if (!above) return true;
374
- let n = above;
375
- if ($0e6083160f4b36ed$export$4210f5ea57fbae57(above) && above !== below) n = above.parent;
376
- while(n){
377
- if (!n.isDroppable) return false;
378
- n = n.parent;
106
+ function $0e6083160f4b36ed$export$33b47db07a82b2fb(target) {
107
+ const elements = $0e6083160f4b36ed$var$getFocusable(target);
108
+ let next;
109
+ for(let i = 0; i < elements.length; ++i){
110
+ const item = elements[i];
111
+ if (item === target) {
112
+ next = $0e6083160f4b36ed$var$prevItem(elements, i);
113
+ break;
114
+ }
379
115
  }
380
- return true;
116
+ // @ts-ignore
117
+ next?.focus();
381
118
  }
382
- function $2db980bfed6822da$var$dropAt(parentId, index) {
383
- return {
384
- parentId: parentId || null,
385
- index: index
119
+ function $0e6083160f4b36ed$var$nextItem(list, index) {
120
+ if (index + 1 < list.length) return list[index + 1];
121
+ else return list[0];
122
+ }
123
+ function $0e6083160f4b36ed$var$prevItem(list, index) {
124
+ if (index - 1 >= 0) return list[index - 1];
125
+ else return list[list.length - 1];
126
+ }
127
+ function $0e6083160f4b36ed$var$getFocusable(target) {
128
+ return Array.from(document.querySelectorAll('button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]):not([disabled]), details:not([disabled]), summary:not(:disabled)')).filter((e)=>e === target || !target.contains(e));
129
+ }
130
+ function $0e6083160f4b36ed$export$9bb0e144ba4929ca(obj, accessor) {
131
+ if (typeof accessor === "boolean") return accessor;
132
+ if (typeof accessor === "string") return obj[accessor];
133
+ return accessor(obj);
134
+ }
135
+ function $0e6083160f4b36ed$export$611823266272db76(obj) {
136
+ if (obj === null) return null;
137
+ else return $0e6083160f4b36ed$export$65e5b62a4c490288(obj);
138
+ }
139
+ function $0e6083160f4b36ed$export$65e5b62a4c490288(obj) {
140
+ return typeof obj === "string" ? obj : obj.id;
141
+ }
142
+ function $0e6083160f4b36ed$export$c9058316764c140e(...refs) {
143
+ return (instance)=>{
144
+ refs.forEach((ref)=>{
145
+ if (typeof ref === "function") ref(instance);
146
+ else if (ref != null) ref.current = instance;
147
+ });
386
148
  };
387
149
  }
388
- function $2db980bfed6822da$var$lineCursor(index, level) {
389
- return {
390
- type: "line",
391
- index: index,
392
- level: level
150
+ function $0e6083160f4b36ed$export$c6d63370cef03886(fn, ...args) {
151
+ if (fn) return fn(...args);
152
+ }
153
+ function $0e6083160f4b36ed$export$9bbfceb27f687c1b(fn) {
154
+ return new Promise((resolve, reject)=>{
155
+ let tries = 0;
156
+ function check() {
157
+ tries += 1;
158
+ if (tries === 100) reject();
159
+ if (fn()) resolve();
160
+ else setTimeout(check, 10);
161
+ }
162
+ check();
163
+ });
164
+ }
165
+
166
+
167
+
168
+
169
+ const $fb4c15d8425379bd$var$placeholderStyle = {
170
+ display: "flex",
171
+ alignItems: "center",
172
+ zIndex: 1
173
+ };
174
+ const $fb4c15d8425379bd$var$lineStyle = {
175
+ flex: 1,
176
+ height: "2px",
177
+ background: "#4B91E2",
178
+ borderRadius: "1px"
179
+ };
180
+ const $fb4c15d8425379bd$var$circleStyle = {
181
+ width: "4px",
182
+ height: "4px",
183
+ boxShadow: "0 0 0 3px #4B91E2",
184
+ borderRadius: "50%"
185
+ };
186
+ const $fb4c15d8425379bd$export$6cb3c16721363d11 = /*#__PURE__*/ (0, $g00cZ$react).memo(function DefaultCursor({ top: top , left: left , indent: indent }) {
187
+ const style = {
188
+ position: "absolute",
189
+ pointerEvents: "none",
190
+ top: top - 2 + "px",
191
+ left: left + "px",
192
+ right: indent + "px"
393
193
  };
194
+ return /*#__PURE__*/ (0, $g00cZ$jsxs)("div", {
195
+ style: {
196
+ ...$fb4c15d8425379bd$var$placeholderStyle,
197
+ ...style
198
+ },
199
+ children: [
200
+ /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
201
+ style: {
202
+ ...$fb4c15d8425379bd$var$circleStyle
203
+ }
204
+ }),
205
+ /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
206
+ style: {
207
+ ...$fb4c15d8425379bd$var$lineStyle
208
+ }
209
+ })
210
+ ]
211
+ });
212
+ });
213
+
214
+
215
+
216
+
217
+ function $164e874d21fcd87e$export$f9c541e71856c524({ node: node , attrs: attrs , innerRef: innerRef , children: children }) {
218
+ return /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
219
+ ...attrs,
220
+ ref: innerRef,
221
+ onFocus: (e)=>e.stopPropagation(),
222
+ onClick: node.handleClick,
223
+ children: children
224
+ });
394
225
  }
395
- function $2db980bfed6822da$var$noCursor() {
226
+
227
+
228
+
229
+
230
+ function $c4edd692d5290432$export$909e23cbfbbd3351({ style: style , node: node , dragHandle: dragHandle }) {
231
+ return /*#__PURE__*/ (0, $g00cZ$jsxs)("div", {
232
+ style: style,
233
+ ref: dragHandle,
234
+ children: [
235
+ "ID: ",
236
+ node.data.id
237
+ ]
238
+ });
239
+ }
240
+
241
+
242
+ function $21783d2b0251be67$export$e1a8e267487c59d1(id) {
396
243
  return {
397
- type: "none"
244
+ type: "EDIT",
245
+ id: id
398
246
  };
399
247
  }
400
- function $2db980bfed6822da$var$highlightCursor(id) {
248
+ function $21783d2b0251be67$export$1650419e431d3ba3(state = {
249
+ id: null
250
+ }, action) {
251
+ if (action.type === "EDIT") return {
252
+ ...state,
253
+ id: action.id
254
+ };
255
+ else return state;
256
+ }
257
+
258
+
259
+ function $c27b8e9863235052$export$d7ddd398f22d79ef(id) {
401
260
  return {
402
- type: "highlight",
261
+ type: "FOCUS",
403
262
  id: id
404
263
  };
405
264
  }
406
- function $2db980bfed6822da$var$walkUpFrom(node, level) {
407
- let drop = node;
408
- while(drop.parent && drop.level > level)drop = drop.parent;
409
- const parentId = drop.parent?.id || null;
410
- const index = $0e6083160f4b36ed$export$305f7d4e9d4624f2(drop) + 1;
265
+ function $c27b8e9863235052$export$6b6c976e46a06288() {
411
266
  return {
412
- parentId: parentId,
413
- index: index
267
+ type: "TREE_BLUR"
414
268
  };
415
269
  }
416
- function $2db980bfed6822da$export$f502ca02ebb85a1c(args) {
417
- const hover = $2db980bfed6822da$var$measureHover(args.element, args.offset);
418
- const { node: node , nextNode: nextNode , prevNode: prevNode } = args;
419
- const [above, below] = $2db980bfed6822da$var$getNodesAroundCursor(node, prevNode, nextNode, hover);
420
- if (!$2db980bfed6822da$var$canDrop(above, below)) return {
421
- drop: null,
422
- cursor: $2db980bfed6822da$var$noCursor()
423
- };
424
- /* Hovering over the middle of a folder */ if (node && $0e6083160f4b36ed$export$769c5e872f5f8638(node) && hover.inMiddle) return {
425
- drop: $2db980bfed6822da$var$dropAt(node.id, 0),
426
- cursor: $2db980bfed6822da$var$highlightCursor(node.id)
427
- };
428
- /* At the top of the list */ if (!above) return {
429
- drop: $2db980bfed6822da$var$dropAt(below?.parent?.id, 0),
430
- cursor: $2db980bfed6822da$var$lineCursor(0, 0)
270
+ function $c27b8e9863235052$export$1650419e431d3ba3(state = {
271
+ id: null,
272
+ treeFocused: false
273
+ }, action) {
274
+ if (action.type === "FOCUS") return {
275
+ ...state,
276
+ id: action.id,
277
+ treeFocused: true
431
278
  };
432
- /* The above node is an item or a closed folder */ if ($0e6083160f4b36ed$export$5318634f2ee07019(above) || $0e6083160f4b36ed$export$4210f5ea57fbae57(above)) {
433
- const level = $2db980bfed6822da$var$getDropLevel(hover, above, below, args.indent);
434
- return {
435
- drop: $2db980bfed6822da$var$walkUpFrom(above, level),
436
- cursor: $2db980bfed6822da$var$lineCursor(above.rowIndex + 1, level)
437
- };
438
- }
439
- /* The above node is an open folder */ return {
440
- drop: $2db980bfed6822da$var$dropAt(above?.id, 0),
441
- cursor: $2db980bfed6822da$var$lineCursor(above.rowIndex + 1, above.level + 1)
279
+ else if (action.type === "TREE_BLUR") return {
280
+ ...state,
281
+ treeFocused: false
442
282
  };
283
+ else return state;
443
284
  }
444
285
 
445
286
 
446
- function $e739455e59c6aed3$export$5a6c424b1725f44f() {
447
- const tree = $3273af3fe11a7001$export$ea6c3ae2bd3a5510();
448
- // In case we drop an item at the bottom of the list
449
- const [, drop1] = $g00cZ$useDrop(()=>({
450
- accept: "NODE",
451
- hover: (item, m)=>{
452
- if (!m.isOver({
453
- shallow: true
454
- })) return;
455
- const offset = m.getClientOffset();
456
- if (!tree.listEl.current || !offset) return;
457
- const { cursor: cursor } = $2db980bfed6822da$export$f502ca02ebb85a1c({
458
- element: tree.listEl.current,
459
- offset: offset,
460
- indent: tree.indent,
461
- node: null,
462
- prevNode: tree.api.visibleNodes[tree.api.visibleNodes.length - 1],
463
- nextNode: null
464
- });
465
- if (cursor) tree.api.showCursor(cursor);
466
- },
467
- canDrop: (item, m)=>{
468
- return m.isOver({
469
- shallow: true
470
- });
471
- },
472
- drop: (item, m)=>{
473
- if (m.didDrop()) return;
474
- const offset = m.getClientOffset();
475
- if (!tree.listEl.current || !offset) return;
476
- const { drop: drop } = $2db980bfed6822da$export$f502ca02ebb85a1c({
477
- element: tree.listEl.current,
478
- offset: offset,
479
- indent: tree.indent,
480
- node: null,
481
- prevNode: tree.api.visibleNodes[tree.api.visibleNodes.length - 1],
482
- nextNode: null
483
- });
484
- return drop;
485
- }
486
- })
487
- , [
488
- tree
489
- ]);
490
- drop1(tree.listEl);
287
+ var $096e74084443e9a3$exports = {};
288
+
289
+ $parcel$export($096e74084443e9a3$exports, "NodeApi", () => $096e74084443e9a3$export$d4b903da0f522dc8);
290
+
291
+ class $096e74084443e9a3$export$d4b903da0f522dc8 {
292
+ constructor(params){
293
+ this.tree = params.tree;
294
+ this.id = params.id;
295
+ this.data = params.data;
296
+ this.level = params.level;
297
+ this.children = params.children;
298
+ this.parent = params.parent;
299
+ this.isDraggable = params.isDraggable;
300
+ this.isDroppable = params.isDroppable;
301
+ this.rowIndex = params.rowIndex;
302
+ }
303
+ get next() {
304
+ if (this.rowIndex === null) return null;
305
+ return this.tree.at(this.rowIndex + 1);
306
+ }
307
+ get prev() {
308
+ if (this.rowIndex === null) return null;
309
+ return this.tree.at(this.rowIndex - 1);
310
+ }
311
+ get nextSibling() {
312
+ const i = this.childIndex;
313
+ return this.parent?.children[i + 1] ?? null;
314
+ }
315
+ get isRoot() {
316
+ return this.id === (0, $81080a351c006222$export$ec71a3379b43ae5c);
317
+ }
318
+ get isLeaf() {
319
+ return !Array.isArray(this.children);
320
+ }
321
+ get isInternal() {
322
+ return !this.isLeaf;
323
+ }
324
+ get isOpen() {
325
+ return this.isLeaf ? false : this.tree.isOpen(this.id);
326
+ }
327
+ get isEditing() {
328
+ return this.tree.editingId === this.id;
329
+ }
330
+ get isSelected() {
331
+ return this.tree.isSelected(this.id);
332
+ }
333
+ get isSelectedStart() {
334
+ return this.isSelected && !this.prev?.isSelected;
335
+ }
336
+ get isSelectedEnd() {
337
+ return this.isSelected && !this.next?.isSelected;
338
+ }
339
+ get isFocused() {
340
+ return this.tree.isFocused(this.id);
341
+ }
342
+ get childIndex() {
343
+ if (this.parent && this.parent.children) return this.parent.children.findIndex((child)=>child.id === this.id);
344
+ else return -1;
345
+ }
346
+ get isDragging() {
347
+ return this.tree.isDragging(this.id);
348
+ }
349
+ get willReceiveDrop() {
350
+ return this.tree.willReceiveDrop(this.id);
351
+ }
352
+ get state() {
353
+ return {
354
+ isEditing: this.isEditing,
355
+ isDragging: this.isDragging,
356
+ isSelected: this.isSelected,
357
+ isSelectedStart: this.isSelectedStart,
358
+ isSelectedEnd: this.isSelectedEnd,
359
+ isFocused: this.isFocused,
360
+ isOpen: this.isOpen,
361
+ willReceiveDrop: this.willReceiveDrop
362
+ };
363
+ }
364
+ select() {
365
+ this.tree.select(this);
366
+ }
367
+ deselect() {
368
+ this.tree.deselect(this);
369
+ }
370
+ selectMulti() {
371
+ this.tree.selectMulti(this);
372
+ }
373
+ selectContiguous() {
374
+ this.tree.selectContiguous(this);
375
+ }
376
+ activate() {
377
+ this.tree.activate(this);
378
+ }
379
+ focus() {
380
+ this.tree.focus(this);
381
+ }
382
+ toggle() {
383
+ this.tree.toggle(this);
384
+ }
385
+ open() {
386
+ this.tree.open(this);
387
+ }
388
+ openParents() {
389
+ this.tree.openParents(this);
390
+ }
391
+ close() {
392
+ this.tree.close(this);
393
+ }
394
+ submit(value) {
395
+ this.tree.submit(this, value);
396
+ }
397
+ reset() {
398
+ this.tree.reset();
399
+ }
400
+ clone() {
401
+ return new $096e74084443e9a3$export$d4b903da0f522dc8({
402
+ ...this
403
+ });
404
+ }
405
+ edit() {
406
+ return this.tree.edit(this);
407
+ }
408
+ handleClick = (e)=>{
409
+ if (e.metaKey) this.isSelected ? this.deselect() : this.selectMulti();
410
+ else if (e.shiftKey) this.selectContiguous();
411
+ else {
412
+ this.select();
413
+ this.activate();
414
+ }
415
+ };
491
416
  }
492
417
 
493
418
 
419
+ const $81080a351c006222$export$ec71a3379b43ae5c = "__REACT_ARBORIST_INTERNAL_ROOT__";
420
+ function $81080a351c006222$export$882461b6382ed46c(tree) {
421
+ function visitSelfAndChildren(data, level, parent) {
422
+ const node = new (0, $096e74084443e9a3$export$d4b903da0f522dc8)({
423
+ tree: tree,
424
+ data: data,
425
+ level: level,
426
+ parent: parent,
427
+ id: data.id,
428
+ children: null,
429
+ isDraggable: tree.isDraggable(data),
430
+ isDroppable: tree.isDroppable(data),
431
+ rowIndex: null
432
+ });
433
+ const children = tree.getChildren(data);
434
+ if (children) node.children = children.map((child)=>visitSelfAndChildren(child, level + 1, node));
435
+ return node;
436
+ }
437
+ const root = new (0, $096e74084443e9a3$export$d4b903da0f522dc8)({
438
+ tree: tree,
439
+ id: $81080a351c006222$export$ec71a3379b43ae5c,
440
+ // @ts-ignore
441
+ data: {
442
+ id: $81080a351c006222$export$ec71a3379b43ae5c
443
+ },
444
+ level: -1,
445
+ parent: null,
446
+ children: null,
447
+ isDraggable: true,
448
+ isDroppable: true,
449
+ rowIndex: null
450
+ });
451
+ const data = tree.props.data ?? [];
452
+ root.children = data.map((child)=>{
453
+ return visitSelfAndChildren(child, 0, root);
454
+ });
455
+ return root;
456
+ }
457
+
494
458
 
459
+ const $3c0bad2888bcd4bc$export$e324594224ef24da = {
460
+ open (id, filtered) {
461
+ return {
462
+ type: "VISIBILITY_OPEN",
463
+ id: id,
464
+ filtered: filtered
465
+ };
466
+ },
467
+ close (id, filtered) {
468
+ return {
469
+ type: "VISIBILITY_CLOSE",
470
+ id: id,
471
+ filtered: filtered
472
+ };
473
+ },
474
+ toggle (id, filtered) {
475
+ return {
476
+ type: "VISIBILITY_TOGGLE",
477
+ id: id,
478
+ filtered: filtered
479
+ };
480
+ },
481
+ clear (filtered) {
482
+ return {
483
+ type: "VISIBILITY_CLEAR",
484
+ filtered: filtered
485
+ };
486
+ }
487
+ };
488
+ /* Reducer */ function $3c0bad2888bcd4bc$var$openMapReducer(state = {}, action) {
489
+ if (action.type === "VISIBILITY_OPEN") return {
490
+ ...state,
491
+ [action.id]: true
492
+ };
493
+ else if (action.type === "VISIBILITY_CLOSE") return {
494
+ ...state,
495
+ [action.id]: false
496
+ };
497
+ else if (action.type === "VISIBILITY_TOGGLE") {
498
+ const prev = state[action.id];
499
+ return {
500
+ ...state,
501
+ [action.id]: !prev
502
+ };
503
+ } else if (action.type === "VISIBILITY_CLEAR") return {};
504
+ else return state;
505
+ }
506
+ function $3c0bad2888bcd4bc$export$1650419e431d3ba3(state = {
507
+ filtered: {},
508
+ unfiltered: {}
509
+ }, action) {
510
+ if (!action.type.startsWith("VISIBILITY")) return state;
511
+ if (action.filtered) return {
512
+ ...state,
513
+ filtered: $3c0bad2888bcd4bc$var$openMapReducer(state.filtered, action)
514
+ };
515
+ else return {
516
+ ...state,
517
+ unfiltered: $3c0bad2888bcd4bc$var$openMapReducer(state.unfiltered, action)
518
+ };
519
+ }
495
520
 
496
521
 
497
522
 
498
- const $b26f0eafd5701d7d$export$f6196a6c6bb539b4 = ()=>({
499
- visibleIds: [],
500
- cursor: {
501
- type: "none"
523
+ const $6ad32e02250c922e$export$d4c72bab9d6cc13a = (props)=>({
524
+ nodes: {
525
+ // Changes together
526
+ open: {
527
+ filtered: {},
528
+ unfiltered: props?.initialOpenState ?? {}
529
+ },
530
+ focus: {
531
+ id: null,
532
+ treeFocused: false
533
+ },
534
+ edit: {
535
+ id: null
536
+ },
537
+ drag: {
538
+ id: null,
539
+ idWillReceiveDrop: null
540
+ },
541
+ selection: {
542
+ ids: new Set(),
543
+ anchor: null,
544
+ mostRecent: null
545
+ }
502
546
  },
503
- editingId: null,
504
- selection: {
505
- data: null,
506
- ids: []
547
+ dnd: {
548
+ cursor: {
549
+ type: "none"
550
+ },
551
+ dragId: null
507
552
  }
508
- })
509
- ;
510
- const $b26f0eafd5701d7d$export$e324594224ef24da = {
511
- setCursorLocation: (cursor)=>({
512
- type: "SET_CURSOR_LOCATION",
513
- cursor: cursor
514
- })
515
- ,
516
- setVisibleIds: (ids, idMap // id to index
517
- )=>({
518
- type: "SET_VISIBLE_IDS",
519
- ids: ids,
520
- idMap: idMap
521
- })
522
- ,
523
- select: (index, meta, shift)=>({
524
- type: "SELECT",
525
- index: index,
526
- meta: meta,
527
- shift: shift
528
- })
529
- ,
530
- selectId: (id)=>({
531
- type: "SELECT_ID",
532
- id: id
533
- })
534
- ,
535
- edit: (id)=>({
536
- type: "EDIT",
537
- id: id
538
- })
539
- ,
540
- stepUp: (shift, ids)=>({
541
- type: "STEP_UP",
542
- shift: shift
543
- })
544
- ,
545
- stepDown: (shift, ids)=>({
546
- type: "STEP_DOWN",
547
- shift: shift
553
+ });
554
+
555
+
556
+ const $37bc167debff36d2$export$e324594224ef24da = {
557
+ clear: ()=>({
558
+ type: "SELECTION_CLEAR"
559
+ }),
560
+ only: (id)=>({
561
+ type: "SELECTION_ONLY",
562
+ id: (0, $0e6083160f4b36ed$export$65e5b62a4c490288)(id)
563
+ }),
564
+ add: (id)=>({
565
+ type: "SELECTION_ADD",
566
+ ids: (Array.isArray(id) ? id : [
567
+ id
568
+ ]).map((0, $0e6083160f4b36ed$export$65e5b62a4c490288))
569
+ }),
570
+ remove: (id)=>({
571
+ type: "SELECTION_REMOVE",
572
+ ids: (Array.isArray(id) ? id : [
573
+ id
574
+ ]).map((0, $0e6083160f4b36ed$export$65e5b62a4c490288))
575
+ }),
576
+ set: (ids)=>({
577
+ type: "SELECTION_SET",
578
+ ids: ids
579
+ }),
580
+ mostRecent: (id)=>({
581
+ type: "SELECTION_MOST_RECENT",
582
+ id: id === null ? null : (0, $0e6083160f4b36ed$export$65e5b62a4c490288)(id)
583
+ }),
584
+ anchor: (id)=>({
585
+ type: "SELECTION_ANCHOR",
586
+ id: id === null ? null : (0, $0e6083160f4b36ed$export$65e5b62a4c490288)(id)
548
587
  })
549
588
  };
550
- function $b26f0eafd5701d7d$export$1650419e431d3ba3(state, action) {
589
+ function $37bc167debff36d2$export$1650419e431d3ba3(state = (0, $6ad32e02250c922e$export$d4c72bab9d6cc13a)()["nodes"]["selection"], action) {
590
+ const ids = state.ids;
551
591
  switch(action.type){
552
- case "EDIT":
592
+ case "SELECTION_CLEAR":
553
593
  return {
554
594
  ...state,
555
- editingId: action.id
595
+ ids: new Set()
556
596
  };
557
- case "SET_CURSOR_LOCATION":
558
- if ($b26f0eafd5701d7d$var$equal(state.cursor, action.cursor)) return state;
559
- else return {
597
+ case "SELECTION_ONLY":
598
+ return {
560
599
  ...state,
561
- cursor: action.cursor
600
+ ids: new Set([
601
+ action.id
602
+ ])
562
603
  };
563
- case "SELECT":
564
- var s = $5ee99f971bd267fd$export$52baac22726c72bf.parse(state.selection.data, state.visibleIds);
565
- if (action.index === null) s.clear();
566
- else if (action.meta) {
567
- if (s.contains(action.index)) s.deselect(action.index);
568
- else s.multiSelect(action.index);
569
- } else if (action.shift) s.extend(action.index);
570
- else s.select(action.index);
604
+ case "SELECTION_ADD":
605
+ if (action.ids.length === 0) return state;
606
+ action.ids.forEach((id)=>ids.add(id));
571
607
  return {
572
608
  ...state,
573
- selection: {
574
- data: s.serialize(),
575
- ids: s.getSelectedItems()
576
- }
609
+ ids: new Set(ids)
577
610
  };
578
- case "SELECT_ID":
611
+ case "SELECTION_REMOVE":
612
+ if (action.ids.length === 0) return state;
613
+ action.ids.forEach((id)=>ids.delete(id));
579
614
  return {
580
615
  ...state,
581
- selection: {
582
- ...state.selection,
583
- ids: [
584
- action.id
585
- ]
586
- }
616
+ ids: new Set(ids)
587
617
  };
588
- case "STEP_UP":
589
- var s3 = $5ee99f971bd267fd$export$52baac22726c72bf.parse(state.selection.data, state.visibleIds);
590
- var f = s3.getFocus();
591
- if (action.shift) s3.extend(f - 1);
592
- else s3.select(f - 1);
618
+ case "SELECTION_SET":
593
619
  return {
594
620
  ...state,
595
- selection: {
596
- data: s3.serialize(),
597
- ids: s3.getSelectedItems()
598
- }
621
+ ids: new Set(action.ids)
599
622
  };
600
- case "STEP_DOWN":
601
- var s6 = $5ee99f971bd267fd$export$52baac22726c72bf.parse(state.selection.data, state.visibleIds);
602
- var f2 = s6.getFocus();
603
- if (action.shift) s6.extend(f2 + 1);
604
- else s6.select(f2 + 1);
623
+ case "SELECTION_MOST_RECENT":
605
624
  return {
606
625
  ...state,
607
- selection: {
608
- data: s6.serialize(),
609
- ids: s6.getSelectedItems()
610
- }
626
+ mostRecent: action.id
611
627
  };
612
- case "SET_VISIBLE_IDS":
613
- // The visible ids changed
614
- var ids = state.selection.ids;
615
- // Start with a blank selection
616
- var s2 = new $5ee99f971bd267fd$export$52baac22726c72bf([], null, "none", state.visibleIds);
617
- // Add each of the old selected ids to this new selection
618
- for (let id of ids)if (id in action.idMap) s2.multiSelect(action.idMap[id]);
628
+ case "SELECTION_ANCHOR":
619
629
  return {
620
630
  ...state,
621
- visibleIds: action.ids,
622
- selection: {
623
- ids: ids,
624
- data: s2.serialize()
625
- }
631
+ anchor: action.id
626
632
  };
627
633
  default:
628
634
  return state;
629
635
  }
630
636
  }
631
- function $b26f0eafd5701d7d$var$equal(a, b) {
632
- if (a === null || b === null) return false;
633
- return JSON.stringify(a) === JSON.stringify(b);
634
- }
635
637
 
636
638
 
637
639
 
638
- function $bafe08914d05476b$export$de605877a37dc399(ref, api) {
639
- $g00cZ$useEffect(()=>{
640
- const el = ref.current;
641
- const cb = (e)=>{
642
- if (e.code === "ArrowDown") {
643
- e.preventDefault();
644
- api.selectDownwards(e.shiftKey);
645
- } else if (e.code === "ArrowUp") {
646
- e.preventDefault();
647
- api.selectUpwards(e.shiftKey);
648
- }
640
+ const $59f144a8dd651e5e$export$e324594224ef24da = {
641
+ cursor (cursor) {
642
+ return {
643
+ type: "DND_CURSOR",
644
+ cursor: cursor
645
+ };
646
+ },
647
+ dragStart (id) {
648
+ return {
649
+ type: "DND_DRAG_START",
650
+ id: id
649
651
  };
650
- el?.addEventListener("keydown", cb);
651
- return ()=>{
652
- el?.removeEventListener("keydown", cb);
652
+ },
653
+ dragEnd () {
654
+ return {
655
+ type: "DND_DRAG_END"
653
656
  };
654
- }, [
655
- ref,
656
- api
657
- ]);
657
+ }
658
+ };
659
+ function $59f144a8dd651e5e$export$1650419e431d3ba3(state = (0, $6ad32e02250c922e$export$d4c72bab9d6cc13a)()["dnd"], action) {
660
+ switch(action.type){
661
+ case "DND_CURSOR":
662
+ return {
663
+ ...state,
664
+ cursor: action.cursor
665
+ };
666
+ case "DND_DRAG_START":
667
+ return {
668
+ ...state,
669
+ dragId: action.id
670
+ };
671
+ case "DND_DRAG_END":
672
+ return {
673
+ ...state,
674
+ dragId: null
675
+ };
676
+ default:
677
+ return state;
678
+ }
658
679
  }
659
680
 
660
681
 
661
682
 
662
683
 
663
684
 
664
- function $4dcb7be69f759cab$export$79f9fa345a841d8b(root) {
665
- const list = [];
666
- let index = 0;
667
- function collect(node) {
668
- if (node.level >= 0) {
669
- node.rowIndex = index++;
670
- list.push(node);
671
- }
672
- if (node.isOpen) node.children?.forEach(collect);
673
- }
674
- collect(root);
675
- return list;
685
+ const $77d34d95e44d2f58$var$layerStyles = {
686
+ position: "fixed",
687
+ pointerEvents: "none",
688
+ zIndex: 100,
689
+ left: 0,
690
+ top: 0,
691
+ width: "100%",
692
+ height: "100%"
693
+ };
694
+ const $77d34d95e44d2f58$var$getStyle = (offset)=>{
695
+ if (!offset) return {
696
+ display: "none"
697
+ };
698
+ const { x: x , y: y } = offset;
699
+ return {
700
+ transform: `translate(${x}px, ${y}px)`
701
+ };
702
+ };
703
+ const $77d34d95e44d2f58$var$getCountStyle = (offset)=>{
704
+ if (!offset) return {
705
+ display: "none"
706
+ };
707
+ const { x: x , y: y } = offset;
708
+ return {
709
+ transform: `translate(${x + 10}px, ${y + 10}px)`
710
+ };
711
+ };
712
+ function $77d34d95e44d2f58$export$84e211ad8431a387({ offset: offset , mouse: mouse , id: id , dragIds: dragIds , isDragging: isDragging }) {
713
+ return /*#__PURE__*/ (0, $g00cZ$jsxs)($77d34d95e44d2f58$var$Overlay, {
714
+ isDragging: isDragging,
715
+ children: [
716
+ /*#__PURE__*/ (0, $g00cZ$jsx)($77d34d95e44d2f58$var$Position, {
717
+ offset: offset,
718
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)($77d34d95e44d2f58$var$PreviewNode, {
719
+ id: id,
720
+ dragIds: dragIds
721
+ })
722
+ }),
723
+ /*#__PURE__*/ (0, $g00cZ$jsx)($77d34d95e44d2f58$var$Count, {
724
+ mouse: mouse,
725
+ count: dragIds.length
726
+ })
727
+ ]
728
+ });
729
+ }
730
+ const $77d34d95e44d2f58$var$Overlay = /*#__PURE__*/ (0, $g00cZ$memo)(function Overlay(props) {
731
+ if (!props.isDragging) return null;
732
+ return /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
733
+ style: $77d34d95e44d2f58$var$layerStyles,
734
+ children: props.children
735
+ });
736
+ });
737
+ function $77d34d95e44d2f58$var$Position(props) {
738
+ return /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
739
+ className: "row preview",
740
+ style: $77d34d95e44d2f58$var$getStyle(props.offset),
741
+ children: props.children
742
+ });
743
+ }
744
+ function $77d34d95e44d2f58$var$Count(props) {
745
+ const { count: count , mouse: mouse } = props;
746
+ if (count > 1) return /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
747
+ className: "selected-count",
748
+ style: $77d34d95e44d2f58$var$getCountStyle(mouse),
749
+ children: count
750
+ });
751
+ else return null;
676
752
  }
753
+ const $77d34d95e44d2f58$var$PreviewNode = /*#__PURE__*/ (0, $g00cZ$memo)(function PreviewNode(props) {
754
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
755
+ const node = tree.get(props.id);
756
+ if (!node) return null;
757
+ return /*#__PURE__*/ (0, $g00cZ$jsx)(tree.renderNode, {
758
+ preview: true,
759
+ node: node,
760
+ style: {
761
+ paddingLeft: node.level * tree.indent,
762
+ opacity: 0.2,
763
+ background: "transparent"
764
+ },
765
+ tree: tree
766
+ });
767
+ });
677
768
 
678
769
 
679
770
 
680
771
 
681
- class $40fcfa3e17312481$export$e2da3477247342d1 {
682
- constructor(dispatch, state, props, list){
683
- this.dispatch = dispatch;
684
- this.state = state;
685
- this.props = props;
686
- this.list = list;
687
- this.edits = new Map();
688
- }
689
- assign(dispatch, state, props, list) {
690
- this.dispatch = dispatch;
691
- this.state = state;
692
- this.props = props;
693
- this.list = list;
694
- }
695
- getNode(id) {
696
- if (id in this.idToIndex) return this.visibleNodes[this.idToIndex[id]] || null;
697
- else return null;
698
- }
699
- getSelectedIds() {
700
- return this.state.selection.ids;
701
- }
702
- edit(id) {
703
- const sid = id.toString();
704
- this.resolveEdit(sid, {
705
- cancelled: true
706
- });
707
- this.scrollToId(sid);
708
- this.dispatch($b26f0eafd5701d7d$export$e324594224ef24da.edit(sid));
709
- return new Promise((resolve)=>this.edits.set(sid, resolve)
710
- );
711
- }
712
- submit(id, value) {
713
- const sid = id.toString();
714
- this.props.onEdit(sid, value);
715
- this.dispatch($b26f0eafd5701d7d$export$e324594224ef24da.edit(null));
716
- this.resolveEdit(sid, {
717
- cancelled: false,
718
- value: value
719
- });
720
- }
721
- reset(id) {
722
- const sid = id.toString();
723
- this.dispatch($b26f0eafd5701d7d$export$e324594224ef24da.edit(null));
724
- this.resolveEdit(sid, {
725
- cancelled: true
726
- });
727
- }
728
- resolveEdit(id, value) {
729
- const resolve = this.edits.get(id.toString());
730
- if (resolve) resolve(value);
731
- this.edits.delete(id);
732
- }
733
- select(index, meta = false, shift = false) {
734
- this.dispatch($b26f0eafd5701d7d$export$e324594224ef24da.select(index, meta, shift));
735
- }
736
- selectById(id, meta = false, shift = false) {
737
- const index = this.idToIndex[id];
738
- this.select(index, meta, shift);
739
- }
740
- selectUpwards(shiftKey) {
741
- this.dispatch($b26f0eafd5701d7d$export$e324594224ef24da.stepUp(shiftKey, this.visibleIds));
742
- }
743
- selectDownwards(shiftKey) {
744
- this.dispatch($b26f0eafd5701d7d$export$e324594224ef24da.stepDown(shiftKey, this.visibleIds));
745
- }
746
- hideCursor() {
747
- this.dispatch($b26f0eafd5701d7d$export$e324594224ef24da.setCursorLocation({
748
- type: "none"
749
- }));
750
- }
751
- showCursor(cursor) {
752
- this.dispatch($b26f0eafd5701d7d$export$e324594224ef24da.setCursorLocation(cursor));
753
- }
754
- scrollToId(id) {
755
- if (!this.list) return;
756
- const index1 = this.idToIndex[id];
757
- if (index1) this.list.scrollToItem(index1);
758
- else {
759
- this.openParents(id);
760
- $g00cZ$reactdom.flushSync(()=>{
761
- const index = this.idToIndex[id];
762
- if (index) this.list?.scrollToItem(index);
763
- });
764
- }
765
- }
766
- open(id) {
767
- this.props.onToggle(id, true);
768
- }
769
- openParents(id) {
770
- const node = $40fcfa3e17312481$var$dfs(this.props.root, id);
771
- let parent = node?.parent;
772
- while(parent){
773
- this.open(parent.id);
774
- parent = parent.parent;
775
- }
776
- }
777
- get visibleIds() {
778
- return $40fcfa3e17312481$var$getIds(this.visibleNodes);
779
- }
780
- get idToIndex() {
781
- return $40fcfa3e17312481$var$createIndex(this.visibleNodes);
782
- }
783
- get visibleNodes() {
784
- return $40fcfa3e17312481$var$createList(this.props.root);
785
- }
786
- }
787
- const $40fcfa3e17312481$var$getIds = $g00cZ$memoizeone((nodes)=>nodes.map((n)=>n.id
788
- )
789
- );
790
- const $40fcfa3e17312481$var$createIndex = $g00cZ$memoizeone((nodes)=>{
791
- return nodes.reduce((map, node, index)=>{
792
- map[node.id] = index;
793
- return map;
794
- }, {
795
- });
796
- });
797
- const $40fcfa3e17312481$var$createList = $g00cZ$memoizeone($4dcb7be69f759cab$export$79f9fa345a841d8b);
798
- function $40fcfa3e17312481$var$dfs(node, id) {
799
- if (!node) return null;
800
- if (node.id === id) return node;
801
- if (node.children) for (let child of node.children){
802
- const result = $40fcfa3e17312481$var$dfs(child, id);
803
- if (result) return result;
804
- }
805
- return null;
806
- }
807
772
 
808
773
 
809
- function $496a9613a893751e$export$367b0f2231a90ba0(state, dispatch, props, list) {
810
- /**
811
- * We only ever want one instance of the api object
812
- * It will get updated as the props change, but the
813
- * reference will not.
814
- */ const api = $g00cZ$useMemo(()=>new $40fcfa3e17312481$export$e2da3477247342d1(dispatch, state, props, list)
815
- , // eslint-disable-next-line
816
- []);
817
- api.assign(dispatch, state, props, list);
818
- /**
819
- * This ensures that the selection remains correct even
820
- * after opening and closing a folders
821
- */ $g00cZ$useLayoutEffect(()=>{
822
- dispatch($b26f0eafd5701d7d$export$e324594224ef24da.setVisibleIds(api.visibleIds, api.idToIndex));
823
- }, [
824
- dispatch,
825
- api,
826
- props.root
827
- ]);
828
- return api;
829
- }
830
-
831
-
832
- function $3a48b0a92affa3e3$export$6a399b2f7f12632c(props) {
833
- const [state, dispatch] = $g00cZ$useReducer($b26f0eafd5701d7d$export$1650419e431d3ba3, $b26f0eafd5701d7d$export$f6196a6c6bb539b4());
834
- const list = $g00cZ$useRef();
835
- const api = $496a9613a893751e$export$367b0f2231a90ba0(state, dispatch, props, list.current);
836
- $g00cZ$useImperativeHandle(props.imperativeHandle, ()=>api
837
- );
838
- $bafe08914d05476b$export$de605877a37dc399(props.listEl, api);
839
- const staticValue = $g00cZ$useMemo(()=>({
840
- ...props,
841
- api: api,
842
- list: list
843
- })
844
- , [
845
- props,
846
- api,
847
- list
848
- ]);
849
- /**
850
- * This context pattern is ridiculous, next time use redux.
851
- */ return(// @ts-ignore
852
- /*#__PURE__*/ $g00cZ$jsx($3273af3fe11a7001$export$c1b9a1d3af45b7b6.Provider, {
853
- value: staticValue,
854
- children: /*#__PURE__*/ $g00cZ$jsx($3273af3fe11a7001$export$7f994e57c9e78355.Provider, {
855
- value: state.editingId,
856
- children: /*#__PURE__*/ $g00cZ$jsx($3273af3fe11a7001$export$7c7a4fd7f1336e2c.Provider, {
857
- value: state.selection,
858
- children: /*#__PURE__*/ $g00cZ$jsx($3273af3fe11a7001$export$7380e5d4146ff2ce.Provider, {
859
- value: $3a48b0a92affa3e3$var$getParentId(state.cursor),
860
- children: /*#__PURE__*/ $g00cZ$jsx($3273af3fe11a7001$export$86fe4415b73783a1.Provider, {
861
- value: $3a48b0a92affa3e3$var$isOverFolder(state),
862
- children: /*#__PURE__*/ $g00cZ$jsx($3273af3fe11a7001$export$76f51715425ee155.Provider, {
863
- value: state.cursor,
864
- children: props.children
865
- })
866
- })
867
- })
868
- })
869
- })
870
- }));
871
- }
872
- function $3a48b0a92affa3e3$var$getParentId(cursor) {
873
- switch(cursor.type){
874
- case "highlight":
875
- return cursor.id;
876
- default:
877
- return null;
878
- }
879
- }
880
- function $3a48b0a92affa3e3$var$isOverFolder(state) {
881
- return state.cursor.type === "highlight";
882
- }
883
774
 
884
775
 
885
776
 
886
777
 
887
778
 
888
-
889
- function $fe2fd2e13360ebf7$export$ef961593063b03e8() {
890
- const treeView = $3273af3fe11a7001$export$ea6c3ae2bd3a5510();
891
- const cursor = $3273af3fe11a7001$export$6c87584817ff2461();
779
+ function $f608be224a71d6f5$export$ef961593063b03e8() {
780
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
781
+ const state = (0, $89e93131aae74bd9$export$4930f6bf413be70e)();
782
+ const cursor = state.cursor;
892
783
  if (!cursor || cursor.type !== "line") return null;
893
- const top = treeView.rowHeight * cursor.index;
894
- const left = treeView.indent * cursor.level;
895
- const style = {
896
- position: "absolute",
897
- pointerEvents: "none",
898
- top: top - 2 + "px",
899
- left: treeView.indent + left + "px",
900
- right: treeView.indent + "px"
901
- };
902
- return(/*#__PURE__*/ $g00cZ$jsx($fe2fd2e13360ebf7$var$DefaultCursor, {
903
- style: style
904
- }));
784
+ const indent = tree.indent;
785
+ const top = tree.rowHeight * cursor.index + ((tree.props.padding ?? tree.props.paddingTop) ?? 0);
786
+ const left = indent * cursor.level;
787
+ const Cursor = tree.renderCursor;
788
+ return /*#__PURE__*/ (0, $g00cZ$jsx)(Cursor, {
789
+ top: top,
790
+ left: left,
791
+ indent: indent
792
+ });
905
793
  }
906
- const $fe2fd2e13360ebf7$var$placeholderStyle = {
907
- display: "flex",
908
- alignItems: "center"
909
- };
910
- const $fe2fd2e13360ebf7$var$lineStyle = {
911
- flex: 1,
912
- height: "2px",
913
- background: "#4B91E2",
914
- borderRadius: "1px"
915
- };
916
- const $fe2fd2e13360ebf7$var$circleStyle = {
917
- width: "4px",
918
- height: "4px",
919
- boxShadow: "0 0 0 3px #4B91E2",
920
- borderRadius: "50%"
921
- };
922
- function $fe2fd2e13360ebf7$var$DefaultCursor({ style: style }) {
923
- return(/*#__PURE__*/ $g00cZ$jsxs("div", {
924
- style: {
925
- ...$fe2fd2e13360ebf7$var$placeholderStyle,
926
- ...style
794
+
795
+
796
+ const $05f64c7ebcbad8b5$export$70c2b8898b86d3ad = /*#__PURE__*/ (0, $g00cZ$forwardRef)(function Outer(props, ref) {
797
+ const { children: children , ...rest } = props;
798
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
799
+ return /*#__PURE__*/ (0, $g00cZ$jsxs)("div", {
800
+ // @ts-ignore
801
+ ref: ref,
802
+ ...rest,
803
+ onClick: (e)=>{
804
+ if (e.currentTarget === e.target) tree.selectNone();
927
805
  },
928
806
  children: [
929
- /*#__PURE__*/ $g00cZ$jsx("div", {
930
- style: {
931
- ...$fe2fd2e13360ebf7$var$circleStyle
932
- }
933
- }),
934
- /*#__PURE__*/ $g00cZ$jsx("div", {
935
- style: {
936
- ...$fe2fd2e13360ebf7$var$lineStyle
937
- }
938
- })
807
+ /*#__PURE__*/ (0, $g00cZ$jsx)($05f64c7ebcbad8b5$var$DropContainer, {}),
808
+ children
939
809
  ]
940
- }));
941
- }
810
+ });
811
+ });
812
+ const $05f64c7ebcbad8b5$var$DropContainer = ()=>{
813
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
814
+ return /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
815
+ style: {
816
+ height: tree.visibleNodes.length * tree.rowHeight,
817
+ width: "100%",
818
+ position: "absolute",
819
+ left: "0",
820
+ right: "0"
821
+ },
822
+ onClick: (e)=>{
823
+ console.log(e.currentTarget, e.target);
824
+ },
825
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)((0, $f608be224a71d6f5$export$ef961593063b03e8), {})
826
+ });
827
+ };
942
828
 
943
829
 
944
830
 
945
831
 
946
832
 
947
833
 
948
- const $6d8109ab8cbcd5e7$var$layerStyles = {
949
- position: "fixed",
950
- pointerEvents: "none",
951
- zIndex: 100,
952
- left: 0,
953
- top: 0,
954
- width: "100%",
955
- height: "100%"
956
- };
957
- const $6d8109ab8cbcd5e7$var$getStyle = (offset)=>{
958
- if (!offset) return {
959
- display: "none"
960
- };
961
- const { x: x , y: y } = offset;
962
- return {
963
- transform: `translate(${x}px, ${y}px)`
964
- };
965
- };
966
- const $6d8109ab8cbcd5e7$var$getCountStyle = (offset)=>{
967
- if (!offset) return {
968
- display: "none"
969
- };
970
- const { x: x , y: y } = offset;
971
- return {
972
- transform: `translate(${x + 10}px, ${y + 10}px)`
973
- };
974
- };
975
- function $6d8109ab8cbcd5e7$export$133773870222880f() {
976
- const { offset: offset , mouse: mouse , item: item , isDragging: isDragging } = $g00cZ$useDragLayer((m)=>({
977
- offset: m.getSourceClientOffset(),
978
- mouse: m.getClientOffset(),
979
- item: m.getItem(),
980
- isDragging: m.isDragging()
981
- })
982
- );
983
- return(/*#__PURE__*/ $g00cZ$jsxs($6d8109ab8cbcd5e7$var$Overlay, {
984
- isDragging: isDragging,
985
- children: [
986
- /*#__PURE__*/ $g00cZ$jsx($6d8109ab8cbcd5e7$var$Position, {
987
- offset: offset,
988
- children: /*#__PURE__*/ $g00cZ$jsx($6d8109ab8cbcd5e7$var$PreviewNode, {
989
- item: item
990
- })
991
- }),
992
- /*#__PURE__*/ $g00cZ$jsx($6d8109ab8cbcd5e7$var$Count, {
993
- mouse: mouse,
994
- item: item
995
- })
996
- ]
997
- }));
998
- }
999
- const $6d8109ab8cbcd5e7$var$Overlay = /*#__PURE__*/ $g00cZ$memo(function Overlay(props) {
1000
- if (!props.isDragging) return null;
1001
- return(/*#__PURE__*/ $g00cZ$jsx("div", {
1002
- style: $6d8109ab8cbcd5e7$var$layerStyles,
1003
- children: props.children
1004
- }));
1005
- });
1006
- function $6d8109ab8cbcd5e7$var$Position(props) {
1007
- return(/*#__PURE__*/ $g00cZ$jsx("div", {
1008
- className: "row preview",
1009
- style: $6d8109ab8cbcd5e7$var$getStyle(props.offset),
1010
- children: props.children
1011
- }));
1012
- }
1013
- function $6d8109ab8cbcd5e7$var$Count(props) {
1014
- const { item: item , mouse: mouse } = props;
1015
- if (item?.dragIds?.length > 1) return(/*#__PURE__*/ $g00cZ$jsx("div", {
1016
- className: "selected-count",
1017
- style: $6d8109ab8cbcd5e7$var$getCountStyle(mouse),
1018
- children: item.dragIds.length
1019
- }));
1020
- else return null;
1021
- }
1022
- const $6d8109ab8cbcd5e7$var$PreviewNode = /*#__PURE__*/ $g00cZ$memo(function PreviewNode(props) {
1023
- const tree = $3273af3fe11a7001$export$ea6c3ae2bd3a5510();
1024
- if (!props.item) return null;
1025
- const node = tree.api.getNode(props.item.id);
1026
- if (!node) return null;
1027
- return(/*#__PURE__*/ $g00cZ$jsx(tree.renderer, {
1028
- preview: true,
1029
- innerRef: ()=>{
1030
- },
1031
- data: node.model,
1032
- styles: {
1033
- row: {
1034
- },
1035
- indent: {
1036
- paddingLeft: node.level * tree.indent
1037
- }
1038
- },
1039
- tree: tree.api,
1040
- state: {
1041
- isDragging: false,
1042
- isEditing: false,
1043
- isSelected: false,
1044
- isSelectedStart: false,
1045
- isSelectedEnd: false,
1046
- isHoveringOverChild: false,
1047
- isOpen: node.isOpen
834
+ const $da9a6b47b6fff922$export$a9af0da3ae60cd00 = /*#__PURE__*/ (0, $g00cZ$forwardRef)(function InnerElement({ style: style , ...rest }, ref) {
835
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
836
+ const paddingTop = (tree.props.padding ?? tree.props.paddingTop) ?? 0;
837
+ const paddingBottom = (tree.props.padding ?? tree.props.paddingBottom) ?? 0;
838
+ return /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
839
+ ref: ref,
840
+ style: {
841
+ ...style,
842
+ height: `${parseFloat(style.height) + paddingTop + paddingBottom}px`
1048
843
  },
1049
- handlers: {
1050
- edit: ()=>Promise.resolve({
1051
- cancelled: true
1052
- })
1053
- ,
1054
- select: ()=>{
1055
- },
1056
- toggle: ()=>{
1057
- },
1058
- submit: ()=>{
1059
- },
1060
- reset: ()=>{
1061
- }
1062
- }
1063
- }));
844
+ ...rest
845
+ });
1064
846
  });
1065
847
 
1066
848
 
@@ -1071,49 +853,49 @@ const $6d8109ab8cbcd5e7$var$PreviewNode = /*#__PURE__*/ $g00cZ$memo(function Pre
1071
853
 
1072
854
 
1073
855
 
856
+
857
+
858
+
1074
859
  function $907e707a330ef23a$export$715c0d031ede7907(node) {
1075
- const tree = $3273af3fe11a7001$export$ea6c3ae2bd3a5510();
1076
- const isSelected = $3273af3fe11a7001$export$fb40a80c530e5f2b();
1077
- const ids = $3273af3fe11a7001$export$1c9b7756eccadc96();
1078
- const [{ isDragging: isDragging }, ref, preview] = $g00cZ$useDrag(()=>({
1079
- canDrag: ()=>node.isDraggable
1080
- ,
860
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
861
+ const ids = tree.selectedIds;
862
+ const [_, ref, preview] = (0, $g00cZ$useDrag)(()=>({
863
+ canDrag: ()=>node.isDraggable,
1081
864
  type: "NODE",
1082
865
  item: ()=>({
1083
866
  id: node.id,
1084
- dragIds: isSelected(node.rowIndex) ? ids : [
867
+ dragIds: tree.isSelected(node.id) ? Array.from(ids) : [
1085
868
  node.id
1086
869
  ]
1087
- })
1088
- ,
1089
- collect: (m)=>({
1090
- isDragging: m.isDragging()
1091
- })
1092
- ,
870
+ }),
871
+ start: ()=>{
872
+ tree.dispatch((0, $59f144a8dd651e5e$export$e324594224ef24da).dragStart(node.id));
873
+ },
1093
874
  end: (item, monitor)=>{
1094
- tree.api.hideCursor();
875
+ tree.dispatch((0, $59f144a8dd651e5e$export$e324594224ef24da).dragEnd());
876
+ tree.hideCursor();
1095
877
  const drop = monitor.getDropResult();
878
+ // If they held down meta, we need to create a copy
879
+ // if (drop.dropEffect === "copy")
1096
880
  if (drop && drop.parentId) {
1097
- tree.onMove(item.dragIds, drop.parentId, drop.index);
1098
- tree.onToggle(drop.parentId, true);
881
+ (0, $0e6083160f4b36ed$export$c6d63370cef03886)(tree.props.onMove, {
882
+ dragIds: item.dragIds,
883
+ parentId: drop.parentId === (0, $81080a351c006222$export$ec71a3379b43ae5c) ? null : drop.parentId,
884
+ index: drop.index
885
+ });
886
+ tree.open(drop.parentId);
1099
887
  }
1100
888
  }
1101
- })
1102
- , [
889
+ }), [
1103
890
  ids,
1104
891
  node
1105
892
  ]);
1106
- $g00cZ$useEffect(()=>{
1107
- preview($g00cZ$getEmptyImage());
893
+ (0, $g00cZ$useEffect)(()=>{
894
+ preview((0, $g00cZ$getEmptyImage)());
1108
895
  }, [
1109
896
  preview
1110
897
  ]);
1111
- return [
1112
- {
1113
- isDragging: isDragging
1114
- },
1115
- ref
1116
- ];
898
+ return ref;
1117
899
  }
1118
900
 
1119
901
 
@@ -1121,256 +903,1364 @@ function $907e707a330ef23a$export$715c0d031ede7907(node) {
1121
903
 
1122
904
 
1123
905
 
1124
- function $d38aa53467160173$export$57afafec4637d997(el, node, prev, next) {
1125
- const tree = $3273af3fe11a7001$export$ea6c3ae2bd3a5510();
1126
- return $g00cZ$useDrop(()=>({
1127
- accept: "NODE",
1128
- canDrop: (item)=>{
1129
- for (let id of item.dragIds){
1130
- const drag = tree.api.getNode(id);
1131
- if (!drag) return false;
1132
- if ($0e6083160f4b36ed$export$769c5e872f5f8638(drag) && $0e6083160f4b36ed$export$1e38f72c6c546f70(node, drag)) return false;
1133
- }
1134
- return true;
1135
- },
1136
- hover: (item, m)=>{
1137
- if (m.canDrop()) {
1138
- const offset = m.getClientOffset();
1139
- if (!el.current || !offset) return;
1140
- const { cursor: cursor } = $2db980bfed6822da$export$f502ca02ebb85a1c({
1141
- element: el.current,
1142
- offset: offset,
1143
- indent: tree.indent,
1144
- node: node,
1145
- prevNode: prev,
1146
- nextNode: next
1147
- });
1148
- if (cursor) tree.api.showCursor(cursor);
1149
- } else tree.api.hideCursor();
1150
- },
1151
- drop: (item, m)=>{
1152
- const offset = m.getClientOffset();
1153
- if (!el.current || !offset) return;
1154
- const { drop: drop } = $2db980bfed6822da$export$f502ca02ebb85a1c({
1155
- element: el.current,
1156
- offset: offset,
1157
- indent: tree.indent,
1158
- node: node,
1159
- prevNode: prev,
1160
- nextNode: next
1161
- });
1162
- return drop;
1163
- }
1164
- })
1165
- , [
1166
- node,
906
+ function $2db980bfed6822da$var$measureHover(el, offset) {
907
+ const rect = el.getBoundingClientRect();
908
+ const x = offset.x - Math.round(rect.x);
909
+ const y = offset.y - Math.round(rect.y);
910
+ const height = rect.height;
911
+ const inTopHalf = y < height / 2;
912
+ const inBottomHalf = !inTopHalf;
913
+ const pad = height / 4;
914
+ const inMiddle = y > pad && y < height - pad;
915
+ const atTop = !inMiddle && inTopHalf;
916
+ const atBottom = !inMiddle && inBottomHalf;
917
+ return {
918
+ x: x,
919
+ inTopHalf: inTopHalf,
920
+ inBottomHalf: inBottomHalf,
921
+ inMiddle: inMiddle,
922
+ atTop: atTop,
923
+ atBottom: atBottom
924
+ };
925
+ }
926
+ function $2db980bfed6822da$var$getNodesAroundCursor(node, prev, next, hover) {
927
+ if (!node) // We're hoving over the empty part of the list, not over an item,
928
+ // Put the cursor below the last item which is "prev"
929
+ return [
1167
930
  prev,
1168
- el,
1169
- tree
1170
- ]);
931
+ null
932
+ ];
933
+ if (node.isInternal) {
934
+ if (hover.atTop) return [
935
+ prev,
936
+ node
937
+ ];
938
+ else if (hover.inMiddle) return [
939
+ node,
940
+ node
941
+ ];
942
+ else return [
943
+ node,
944
+ next
945
+ ];
946
+ } else {
947
+ if (hover.inTopHalf) return [
948
+ prev,
949
+ node
950
+ ];
951
+ else return [
952
+ node,
953
+ next
954
+ ];
955
+ }
1171
956
  }
1172
-
1173
-
1174
- const $2c0a5a237609003e$export$b59bdbef9ce70de2 = /*#__PURE__*/ $g00cZ$react.memo(function $2c0a5a237609003e$export$b59bdbef9ce70de2({ index: index , style: style }) {
1175
- const tree = $3273af3fe11a7001$export$ea6c3ae2bd3a5510();
1176
- const selected = $3273af3fe11a7001$export$fb40a80c530e5f2b();
1177
- const node = tree.api.visibleNodes[index];
1178
- const next = tree.api.visibleNodes[index + 1] || null;
1179
- const prev = tree.api.visibleNodes[index - 1] || null;
1180
- const cursorParentId = $3273af3fe11a7001$export$8e294ac6de4c921f();
1181
- const cursorOverFolder = $3273af3fe11a7001$export$f3ad962ff713505f();
1182
- const el = $g00cZ$useRef(null);
1183
- const [{ isDragging: isDragging }, dragRef] = $907e707a330ef23a$export$715c0d031ede7907(node);
1184
- const [, dropRef] = $d38aa53467160173$export$57afafec4637d997(el, node, prev, next);
1185
- const isEditing = node.id === $3273af3fe11a7001$export$9ab192f953c1b33b();
1186
- const isSelected = selected(index);
1187
- const nextSelected = next && selected(index + 1);
1188
- const prevSelected = prev && selected(index - 1);
1189
- const isHoveringOverChild = node.id === cursorParentId;
1190
- const isOverFolder = node.id === cursorParentId && cursorOverFolder;
1191
- const isOpen = node.isOpen;
1192
- const indent = tree.indent * node.level;
1193
- const state = $g00cZ$useMemo(()=>{
1194
- return {
1195
- isEditing: isEditing,
1196
- isDragging: isDragging,
1197
- isSelectedStart: isSelected && !prevSelected,
1198
- isSelectedEnd: isSelected && !nextSelected,
1199
- isSelected: isSelected,
1200
- isHoveringOverChild: isHoveringOverChild,
1201
- isOpen: isOpen,
1202
- isOverFolder: isOverFolder
1203
- };
1204
- }, [
1205
- isEditing,
1206
- isSelected,
1207
- prevSelected,
1208
- nextSelected,
1209
- isHoveringOverChild,
1210
- isOpen,
1211
- isDragging,
1212
- isOverFolder,
1213
- ]);
1214
- const ref = $g00cZ$useCallback((n)=>{
1215
- el.current = n;
1216
- dragRef(dropRef(n));
1217
- }, [
1218
- dragRef,
1219
- dropRef
1220
- ]);
1221
- const styles = $g00cZ$useMemo(()=>({
1222
- row: {
1223
- ...style
1224
- },
1225
- indent: {
1226
- paddingLeft: indent
1227
- }
1228
- })
1229
- , [
1230
- indent,
1231
- style
1232
- ]);
1233
- const handlers = $g00cZ$useMemo(()=>{
1234
- return {
1235
- select: (e, args = {
1236
- selectOnClick: true
1237
- })=>{
1238
- if (node.rowIndex === null) return;
1239
- if (args.selectOnClick || e.metaKey || e.shiftKey) tree.api.select(node.rowIndex, e.metaKey, e.shiftKey);
1240
- else tree.api.select(null, false, false);
1241
- },
1242
- toggle: (e)=>{
1243
- e.stopPropagation();
1244
- tree.onToggle(node.id, !node.isOpen);
1245
- },
1246
- edit: ()=>tree.api.edit(node.id)
1247
- ,
1248
- submit: (name)=>{
1249
- name.trim() ? tree.api.submit(node.id, name) : tree.api.reset(node.id);
1250
- },
1251
- reset: ()=>tree.api.reset(node.id)
1252
- };
1253
- }, [
1254
- tree,
1255
- node
1256
- ]);
1257
- const Renderer = $g00cZ$useMemo(()=>{
1258
- return(/*#__PURE__*/ $g00cZ$react.memo(tree.renderer));
1259
- }, [
1260
- tree.renderer
1261
- ]);
1262
- return(/*#__PURE__*/ $g00cZ$jsx(Renderer, {
1263
- innerRef: ref,
1264
- data: node.model,
1265
- styles: styles,
1266
- state: state,
1267
- handlers: handlers,
1268
- preview: false,
1269
- tree: tree.api
1270
- }));
1271
- });
1272
-
1273
-
1274
- const $2ba43033bb8eb39d$var$OuterElement = /*#__PURE__*/ $g00cZ$forwardRef(function Outer(props, ref) {
1275
- const { children: children , ...rest } = props;
1276
- const tree = $3273af3fe11a7001$export$ea6c3ae2bd3a5510();
1277
- return(/*#__PURE__*/ $g00cZ$jsxs("div", {
1278
- // @ts-ignore
1279
- ref: ref,
1280
- ...rest,
1281
- onClick: tree.onClick,
1282
- onContextMenu: tree.onContextMenu,
1283
- children: [
1284
- /*#__PURE__*/ $g00cZ$jsx("div", {
1285
- style: {
1286
- height: tree.api.visibleNodes.length * tree.rowHeight,
1287
- width: "100%",
1288
- overflow: "hidden",
1289
- position: "absolute",
1290
- left: "0",
1291
- right: "0"
1292
- },
1293
- children: /*#__PURE__*/ $g00cZ$jsx($fe2fd2e13360ebf7$export$ef961593063b03e8, {
1294
- })
1295
- }),
1296
- children
1297
- ]
1298
- }));
1299
- });
1300
- function $2ba43033bb8eb39d$var$List(props) {
1301
- const tree = $3273af3fe11a7001$export$ea6c3ae2bd3a5510();
1302
- return(/*#__PURE__*/ $g00cZ$jsx("div", {
1303
- style: {
1304
- height: tree.height,
1305
- width: tree.width,
1306
- overflow: "hidden"
1307
- },
1308
- children: /*#__PURE__*/ $g00cZ$jsx($g00cZ$FixedSizeList, {
1309
- className: props.className,
1310
- outerRef: tree.listEl,
1311
- itemCount: tree.api.visibleNodes.length,
957
+ function $2db980bfed6822da$var$getDropLevel(hovering, aboveCursor, belowCursor, indent) {
958
+ const hoverLevel = Math.round(Math.max(0, hovering.x - indent) / indent);
959
+ let min, max;
960
+ if (!aboveCursor) {
961
+ max = 0;
962
+ min = 0;
963
+ } else if (!belowCursor) {
964
+ max = aboveCursor.level;
965
+ min = 0;
966
+ } else {
967
+ max = aboveCursor.level;
968
+ min = belowCursor.level;
969
+ }
970
+ return (0, $0e6083160f4b36ed$export$adf7c0fe6059d774)(hoverLevel, min, max);
971
+ }
972
+ function $2db980bfed6822da$var$canDrop(above, below) {
973
+ if (!above) return true;
974
+ let n = above;
975
+ if ((0, $0e6083160f4b36ed$export$4210f5ea57fbae57)(above) && above !== below) n = above.parent;
976
+ while(n){
977
+ if (!n.isDroppable) return false;
978
+ n = n.parent;
979
+ }
980
+ return true;
981
+ }
982
+ function $2db980bfed6822da$var$dropAt(parentId, index) {
983
+ return {
984
+ parentId: parentId || null,
985
+ index: index
986
+ };
987
+ }
988
+ function $2db980bfed6822da$var$lineCursor(index, level) {
989
+ return {
990
+ type: "line",
991
+ index: index,
992
+ level: level
993
+ };
994
+ }
995
+ function $2db980bfed6822da$var$noCursor() {
996
+ return {
997
+ type: "none"
998
+ };
999
+ }
1000
+ function $2db980bfed6822da$var$highlightCursor(id) {
1001
+ return {
1002
+ type: "highlight",
1003
+ id: id
1004
+ };
1005
+ }
1006
+ function $2db980bfed6822da$var$walkUpFrom(node, level) {
1007
+ let drop = node;
1008
+ while(drop.parent && drop.level > level)drop = drop.parent;
1009
+ const parentId = drop.parent?.id || null;
1010
+ const index = (0, $0e6083160f4b36ed$export$305f7d4e9d4624f2)(drop) + 1;
1011
+ return {
1012
+ parentId: parentId,
1013
+ index: index
1014
+ };
1015
+ }
1016
+ function $2db980bfed6822da$export$f502ca02ebb85a1c(args) {
1017
+ const hover = $2db980bfed6822da$var$measureHover(args.element, args.offset);
1018
+ const { node: node , nextNode: nextNode , prevNode: prevNode } = args;
1019
+ const [above, below] = $2db980bfed6822da$var$getNodesAroundCursor(node, prevNode, nextNode, hover);
1020
+ if (!$2db980bfed6822da$var$canDrop(above, below)) return {
1021
+ drop: null,
1022
+ cursor: $2db980bfed6822da$var$noCursor()
1023
+ };
1024
+ /* Hovering over the middle of a folder */ if (node && node.isInternal && hover.inMiddle) return {
1025
+ drop: $2db980bfed6822da$var$dropAt(node.id, 0),
1026
+ cursor: $2db980bfed6822da$var$highlightCursor(node.id)
1027
+ };
1028
+ /* At the top of the list */ if (!above) return {
1029
+ drop: $2db980bfed6822da$var$dropAt(below?.parent?.id, 0),
1030
+ cursor: $2db980bfed6822da$var$lineCursor(0, 0)
1031
+ };
1032
+ /* The above node is an item or a closed folder */ if ((0, $0e6083160f4b36ed$export$5318634f2ee07019)(above) || (0, $0e6083160f4b36ed$export$4210f5ea57fbae57)(above)) {
1033
+ const level = $2db980bfed6822da$var$getDropLevel(hover, above, below, args.indent);
1034
+ return {
1035
+ drop: $2db980bfed6822da$var$walkUpFrom(above, level),
1036
+ cursor: $2db980bfed6822da$var$lineCursor(above.rowIndex + 1, level)
1037
+ };
1038
+ }
1039
+ /* The above node is an open folder */ return {
1040
+ drop: $2db980bfed6822da$var$dropAt(above?.id, 0),
1041
+ cursor: $2db980bfed6822da$var$lineCursor(above.rowIndex + 1, above.level + 1)
1042
+ };
1043
+ }
1044
+
1045
+
1046
+ function $d38aa53467160173$export$57afafec4637d997(el, node) {
1047
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
1048
+ const [_, dropRef] = (0, $g00cZ$useDrop)(()=>({
1049
+ accept: "NODE",
1050
+ canDrop: (item, m)=>{
1051
+ if (node.tree.isFiltered) return false;
1052
+ const offset = m.getClientOffset();
1053
+ if (!el.current || !offset) return false;
1054
+ const { drop: drop } = (0, $2db980bfed6822da$export$f502ca02ebb85a1c)({
1055
+ element: el.current,
1056
+ offset: offset,
1057
+ indent: tree.indent,
1058
+ node: node,
1059
+ prevNode: node.prev,
1060
+ nextNode: node.next
1061
+ });
1062
+ if (!drop) return false;
1063
+ const dropParent = tree.get(drop.parentId) ?? tree.root;
1064
+ for (let id of item.dragIds){
1065
+ const drag = tree.get(id);
1066
+ if (!drag) return false;
1067
+ if (!dropParent) return false;
1068
+ if (drag.isInternal && (0, $0e6083160f4b36ed$export$1e38f72c6c546f70)(dropParent, drag)) return false;
1069
+ }
1070
+ return true;
1071
+ },
1072
+ hover: (item, m)=>{
1073
+ if (m.canDrop()) {
1074
+ const offset = m.getClientOffset();
1075
+ if (!el.current || !offset) return;
1076
+ const { cursor: cursor } = (0, $2db980bfed6822da$export$f502ca02ebb85a1c)({
1077
+ element: el.current,
1078
+ offset: offset,
1079
+ indent: tree.indent,
1080
+ node: node,
1081
+ prevNode: node.prev,
1082
+ nextNode: node.next
1083
+ });
1084
+ if (cursor) tree.showCursor(cursor);
1085
+ } else tree.hideCursor();
1086
+ },
1087
+ drop: (item, m)=>{
1088
+ const offset = m.getClientOffset();
1089
+ if (!el.current || !offset) return;
1090
+ const { drop: drop } = (0, $2db980bfed6822da$export$f502ca02ebb85a1c)({
1091
+ element: el.current,
1092
+ offset: offset,
1093
+ indent: tree.indent,
1094
+ node: node,
1095
+ prevNode: node.prev,
1096
+ nextNode: node.next
1097
+ });
1098
+ return drop;
1099
+ }
1100
+ }), [
1101
+ node,
1102
+ el.current,
1103
+ tree.props
1104
+ ]);
1105
+ return dropRef;
1106
+ }
1107
+
1108
+
1109
+
1110
+
1111
+ function $48ab254e4b4b72da$export$d75ab90b05ebbfaa(index) {
1112
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
1113
+ const original = tree.at(index);
1114
+ if (!original) throw new Error(`Could not find node for index: ${index}`);
1115
+ return (0, $g00cZ$useMemo)(()=>{
1116
+ const fresh = original.clone();
1117
+ tree.visibleNodes[index] = fresh; // sneaky
1118
+ return fresh;
1119
+ // Return a fresh instance if the state values change
1120
+ }, [
1121
+ ...Object.values(original.state),
1122
+ original
1123
+ ]);
1124
+ }
1125
+
1126
+
1127
+ const $8c3aed0a01f84486$export$a9754b3c8daa5172 = /*#__PURE__*/ (0, $g00cZ$react).memo(function RowContainer({ index: index , style: style }) {
1128
+ /* When will the <Row> will re-render.
1129
+ *
1130
+ * The row component is memo'd so it will only render
1131
+ * when a new instance of the NodeApi class is passed
1132
+ * to it.
1133
+ *
1134
+ * The TreeApi instance is stable. It does not
1135
+ * change when the internal state changes.
1136
+ *
1137
+ * The TreeApi has all the references to the nodes.
1138
+ * We need to clone the nodes when their state
1139
+ * changes. The node class contains no state itself,
1140
+ * It always checks the tree for state. The tree's
1141
+ * state will always be up to date.
1142
+ */ (0, $89e93131aae74bd9$export$83a4f9dc3b36edb8)(); // Re-render when tree props or visability changes
1143
+ const _ = (0, $89e93131aae74bd9$export$fd23f19d5d8f3033)(); // So that we re-render appropriately
1144
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)(); // Tree already has the fresh state
1145
+ const node = (0, $48ab254e4b4b72da$export$d75ab90b05ebbfaa)(index);
1146
+ const el = (0, $g00cZ$useRef)(null);
1147
+ const dragRef = (0, $907e707a330ef23a$export$715c0d031ede7907)(node);
1148
+ const dropRef = (0, $d38aa53467160173$export$57afafec4637d997)(el, node);
1149
+ const innerRef = (0, $g00cZ$useCallback)((n)=>{
1150
+ el.current = n;
1151
+ dropRef(n);
1152
+ }, [
1153
+ dropRef
1154
+ ]);
1155
+ const indent = tree.indent * node.level;
1156
+ const nodeStyle = (0, $g00cZ$useMemo)(()=>({
1157
+ paddingLeft: indent
1158
+ }), [
1159
+ indent
1160
+ ]);
1161
+ const rowStyle = (0, $g00cZ$useMemo)(()=>({
1162
+ ...style,
1163
+ top: parseFloat(style.top) + ((tree.props.padding ?? tree.props.paddingTop) ?? 0)
1164
+ }), [
1165
+ style,
1166
+ tree.props.padding,
1167
+ tree.props.paddingTop
1168
+ ]);
1169
+ const rowAttrs = {
1170
+ role: "treeitem",
1171
+ "aria-level": node.level,
1172
+ "aria-selected": node.isSelected,
1173
+ style: rowStyle,
1174
+ tabIndex: -1
1175
+ };
1176
+ (0, $g00cZ$useEffect)(()=>{
1177
+ if (!node.isEditing && node.isFocused) el.current?.focus();
1178
+ }, [
1179
+ node.isEditing,
1180
+ node.isFocused,
1181
+ el.current
1182
+ ]);
1183
+ const Node = tree.renderNode;
1184
+ const Row = tree.renderRow;
1185
+ return /*#__PURE__*/ (0, $g00cZ$jsx)(Row, {
1186
+ node: node,
1187
+ innerRef: innerRef,
1188
+ attrs: rowAttrs,
1189
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)(Node, {
1190
+ node: node,
1191
+ tree: tree,
1192
+ style: nodeStyle,
1193
+ dragHandle: dragRef
1194
+ })
1195
+ });
1196
+ });
1197
+
1198
+
1199
+ let $065a164934293bf2$var$focusSearchTerm = "";
1200
+ let $065a164934293bf2$var$timeoutId = null;
1201
+ function $065a164934293bf2$export$ff4858a4110d9246() {
1202
+ (0, $89e93131aae74bd9$export$83a4f9dc3b36edb8)();
1203
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
1204
+ return /*#__PURE__*/ (0, $g00cZ$jsx)("div", {
1205
+ style: {
1206
+ height: tree.height,
1207
+ width: tree.width,
1208
+ minHeight: 0,
1209
+ minWidth: 0
1210
+ },
1211
+ onContextMenu: tree.props.onContextMenu,
1212
+ onClick: tree.props.onClick,
1213
+ tabIndex: 0,
1214
+ onFocus: (e)=>{
1215
+ if (!e.currentTarget.contains(e.relatedTarget)) tree.onFocus();
1216
+ },
1217
+ onBlur: (e)=>{
1218
+ if (!e.currentTarget.contains(e.relatedTarget)) tree.onBlur();
1219
+ },
1220
+ onKeyDown: (e)=>{
1221
+ if (tree.isEditing) return;
1222
+ if (e.key === "Backspace") {
1223
+ const ids = Array.from(tree.selectedIds);
1224
+ if (ids.length > 1) {
1225
+ let nextFocus = tree.mostRecentNode;
1226
+ while(nextFocus && nextFocus.isSelected)nextFocus = nextFocus.nextSibling;
1227
+ if (!nextFocus) nextFocus = tree.lastNode;
1228
+ tree.focus(nextFocus, {
1229
+ scroll: false
1230
+ });
1231
+ tree.delete(Array.from(ids));
1232
+ } else {
1233
+ const node = tree.focusedNode;
1234
+ if (node) {
1235
+ const sib = node.nextSibling;
1236
+ const parent = node.parent;
1237
+ tree.focus(sib || parent, {
1238
+ scroll: false
1239
+ });
1240
+ tree.delete(node);
1241
+ }
1242
+ }
1243
+ return;
1244
+ }
1245
+ if (e.key === "Tab" && !e.shiftKey) {
1246
+ e.preventDefault();
1247
+ (0, $0e6083160f4b36ed$export$3b0237e8566c8d65)(e.currentTarget);
1248
+ return;
1249
+ }
1250
+ if (e.key === "Tab" && e.shiftKey) {
1251
+ e.preventDefault();
1252
+ (0, $0e6083160f4b36ed$export$33b47db07a82b2fb)(e.currentTarget);
1253
+ return;
1254
+ }
1255
+ if (e.key === "ArrowDown" && !e.shiftKey && !e.metaKey) {
1256
+ e.preventDefault();
1257
+ const next = tree.nextNode;
1258
+ tree.focus(next);
1259
+ return;
1260
+ }
1261
+ if (e.key === "ArrowDown" && e.shiftKey) {
1262
+ e.preventDefault();
1263
+ const next1 = tree.nextNode;
1264
+ if (!next1) return;
1265
+ const current = tree.focusedNode;
1266
+ if (!current) tree.focus(tree.firstNode);
1267
+ else if (current.isSelected) tree.selectContiguous(next1);
1268
+ else tree.selectMulti(next1);
1269
+ return;
1270
+ }
1271
+ if (e.key === "ArrowUp" && !e.shiftKey) {
1272
+ e.preventDefault();
1273
+ tree.focus(tree.prevNode);
1274
+ return;
1275
+ }
1276
+ if (e.key === "ArrowUp" && e.shiftKey) {
1277
+ e.preventDefault();
1278
+ const prev = tree.prevNode;
1279
+ const current1 = tree.focusedNode;
1280
+ if (!prev) return;
1281
+ if (!current1) tree.focus(tree.lastNode); // ?
1282
+ else if (current1.isSelected) tree.selectContiguous(prev);
1283
+ else tree.selectMulti(prev);
1284
+ return;
1285
+ }
1286
+ if (e.key === "ArrowRight") {
1287
+ const node1 = tree.focusedNode;
1288
+ if (!node1) return;
1289
+ if (node1.isInternal && node1.isOpen) tree.focus(tree.nextNode);
1290
+ else if (node1.isInternal) tree.open(node1.id);
1291
+ return;
1292
+ }
1293
+ if (e.key === "ArrowLeft") {
1294
+ const node2 = tree.focusedNode;
1295
+ if (!node2 || node2.isRoot) return;
1296
+ if (node2.isInternal && node2.isOpen) tree.close(node2.id);
1297
+ else if (!node2.parent?.isRoot) tree.focus(node2.parent);
1298
+ return;
1299
+ }
1300
+ if (e.key === "a" && e.metaKey) {
1301
+ e.preventDefault();
1302
+ tree.selectAll();
1303
+ return;
1304
+ }
1305
+ if (e.key === "a" && !e.metaKey) {
1306
+ tree.createLeaf();
1307
+ return;
1308
+ }
1309
+ if (e.key === "A" && !e.metaKey) {
1310
+ tree.createInternal();
1311
+ return;
1312
+ }
1313
+ if (e.key === "Home") {
1314
+ // add shift keys
1315
+ e.preventDefault();
1316
+ tree.focus(tree.firstNode);
1317
+ return;
1318
+ }
1319
+ if (e.key === "End") {
1320
+ // add shift keys
1321
+ e.preventDefault();
1322
+ tree.focus(tree.lastNode);
1323
+ return;
1324
+ }
1325
+ if (e.key === "Enter") {
1326
+ setTimeout(()=>{
1327
+ if (tree.focusedNode) tree.edit(tree.focusedNode);
1328
+ });
1329
+ return;
1330
+ }
1331
+ if (e.key === " ") {
1332
+ e.preventDefault();
1333
+ const node3 = tree.focusedNode;
1334
+ if (!node3) return;
1335
+ if (node3.isLeaf) {
1336
+ node3.select();
1337
+ node3.activate();
1338
+ } else node3.toggle();
1339
+ return;
1340
+ }
1341
+ if (e.key === "*") {
1342
+ const node4 = tree.focusedNode;
1343
+ if (!node4) return;
1344
+ tree.openSiblings(node4);
1345
+ return;
1346
+ }
1347
+ if (e.key === "ArrowDown" && e.metaKey) {
1348
+ e.preventDefault();
1349
+ tree.select(tree.focusedNode);
1350
+ tree.activate(tree.focusedNode);
1351
+ return;
1352
+ }
1353
+ if (e.key === "PageUp") {
1354
+ e.preventDefault();
1355
+ tree.pageUp();
1356
+ return;
1357
+ }
1358
+ if (e.key === "PageDown") {
1359
+ e.preventDefault();
1360
+ tree.pageDown();
1361
+ }
1362
+ // If they type a sequence of characters
1363
+ // collect them. Reset them after a timeout.
1364
+ // Use it to search the tree for a node, then focus it.
1365
+ // Clean this up a bit later
1366
+ clearTimeout($065a164934293bf2$var$timeoutId);
1367
+ $065a164934293bf2$var$focusSearchTerm += e.key;
1368
+ $065a164934293bf2$var$timeoutId = setTimeout(()=>{
1369
+ $065a164934293bf2$var$focusSearchTerm = "";
1370
+ }, 600);
1371
+ const node5 = tree.visibleNodes.find((n)=>{
1372
+ // @ts-ignore
1373
+ const name = n.data.name;
1374
+ if (typeof name === "string") return name.toLowerCase().startsWith($065a164934293bf2$var$focusSearchTerm);
1375
+ else return false;
1376
+ });
1377
+ if (node5) tree.focus(node5.id);
1378
+ },
1379
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)((0, $g00cZ$FixedSizeList), {
1380
+ className: tree.props.className,
1381
+ outerRef: tree.listEl,
1382
+ itemCount: tree.visibleNodes.length,
1312
1383
  height: tree.height,
1313
1384
  width: tree.width,
1314
1385
  itemSize: tree.rowHeight,
1315
- itemKey: (index)=>tree.api.visibleNodes[index]?.id || index
1316
- ,
1317
- outerElementType: $2ba43033bb8eb39d$var$OuterElement,
1318
- // @ts-ignore
1386
+ itemKey: (index)=>tree.visibleNodes[index]?.id || index,
1387
+ outerElementType: (0, $05f64c7ebcbad8b5$export$70c2b8898b86d3ad),
1388
+ innerElementType: (0, $da9a6b47b6fff922$export$a9af0da3ae60cd00),
1389
+ onScroll: tree.props.onScroll,
1390
+ onItemsRendered: tree.onItemsRendered.bind(tree),
1319
1391
  ref: tree.list,
1320
- children: $2c0a5a237609003e$export$b59bdbef9ce70de2
1392
+ children: (0, $8c3aed0a01f84486$export$a9754b3c8daa5172)
1321
1393
  })
1322
- }));
1394
+ });
1323
1395
  }
1324
- function $2ba43033bb8eb39d$var$OuterDrop(props) {
1325
- $e739455e59c6aed3$export$5a6c424b1725f44f();
1326
- return props.children;
1396
+
1397
+
1398
+ function $749bc746798c29ad$export$5897d8d7c7a3d871(tree) {
1399
+ if (tree.isFiltered) return $749bc746798c29ad$var$flattenAndFilterTree(tree.root, tree.isMatch.bind(tree));
1400
+ else return $749bc746798c29ad$var$flattenTree(tree.root);
1401
+ }
1402
+ function $749bc746798c29ad$var$flattenTree(root) {
1403
+ const list = [];
1404
+ function collect(node) {
1405
+ if (node.level >= 0) list.push(node);
1406
+ if (node.isOpen) node.children?.forEach(collect);
1407
+ }
1408
+ collect(root);
1409
+ list.forEach($749bc746798c29ad$var$assignRowIndex);
1410
+ return list;
1411
+ }
1412
+ function $749bc746798c29ad$var$flattenAndFilterTree(root, isMatch) {
1413
+ function collect(node) {
1414
+ let result = [];
1415
+ const yes = !node.isRoot && isMatch(node);
1416
+ if (node.children) for (let child of node.children)result = result.concat(collect(child));
1417
+ if (result.length) {
1418
+ if (!node.isRoot) result.unshift(node);
1419
+ return result;
1420
+ }
1421
+ if (yes) return [
1422
+ node
1423
+ ];
1424
+ else return [];
1425
+ }
1426
+ const list = collect(root).filter((n)=>n.parent?.isOpen);
1427
+ list.forEach($749bc746798c29ad$var$assignRowIndex);
1428
+ return list;
1429
+ }
1430
+ function $749bc746798c29ad$var$assignRowIndex(node, index) {
1431
+ node.rowIndex = index;
1432
+ }
1433
+
1434
+
1435
+ const $659b2f68e1468ad0$export$c6d108d7c8095f19 = (nodes)=>{
1436
+ return nodes.reduce((map, node, index)=>{
1437
+ map[node.id] = index;
1438
+ return map;
1439
+ }, {});
1440
+ };
1441
+
1442
+
1443
+ const { safeRun: $bfece7c4aed4e9c4$var$safeRun , identify: $bfece7c4aed4e9c4$var$identify , identifyNull: $bfece7c4aed4e9c4$var$identifyNull } = $0e6083160f4b36ed$exports;
1444
+ class $bfece7c4aed4e9c4$export$e2da3477247342d1 {
1445
+ constructor(store, props, list, listEl){
1446
+ this.store = store;
1447
+ this.props = props;
1448
+ this.list = list;
1449
+ this.listEl = listEl;
1450
+ this.visibleStartIndex = 0;
1451
+ this.visibleStopIndex = 0;
1452
+ /* Changes here must also be made in update() */ this.root = (0, $81080a351c006222$export$882461b6382ed46c)(this);
1453
+ this.visibleNodes = (0, $749bc746798c29ad$export$5897d8d7c7a3d871)(this);
1454
+ this.idToIndex = (0, $659b2f68e1468ad0$export$c6d108d7c8095f19)(this.visibleNodes);
1455
+ }
1456
+ /* Changes here must also be made in constructor() */ update(props) {
1457
+ this.props = props;
1458
+ this.root = (0, $81080a351c006222$export$882461b6382ed46c)(this);
1459
+ this.visibleNodes = (0, $749bc746798c29ad$export$5897d8d7c7a3d871)(this);
1460
+ this.idToIndex = (0, $659b2f68e1468ad0$export$c6d108d7c8095f19)(this.visibleNodes);
1461
+ }
1462
+ /* Store helpers */ dispatch(action) {
1463
+ return this.store.dispatch(action);
1464
+ }
1465
+ get state() {
1466
+ return this.store.getState();
1467
+ }
1468
+ get openState() {
1469
+ return this.state.nodes.open.unfiltered;
1470
+ }
1471
+ /* Tree Props */ get width() {
1472
+ return this.props.width || 300;
1473
+ }
1474
+ get height() {
1475
+ return this.props.height || 500;
1476
+ }
1477
+ get indent() {
1478
+ return this.props.indent || 24;
1479
+ }
1480
+ get rowHeight() {
1481
+ return this.props.rowHeight || 24;
1482
+ }
1483
+ get searchTerm() {
1484
+ return (this.props.searchTerm || "").trim();
1485
+ }
1486
+ get matchFn() {
1487
+ const match = this.props.searchMatch ?? ((node, term)=>{
1488
+ const string = JSON.stringify(Object.values(node.data));
1489
+ return string.toLocaleLowerCase().includes(term.toLocaleLowerCase());
1490
+ });
1491
+ return (node)=>match(node, this.searchTerm);
1492
+ }
1493
+ getChildren(data) {
1494
+ const get = this.props.getChildren || "children";
1495
+ return $0e6083160f4b36ed$exports.access(data, get) ?? null;
1496
+ }
1497
+ /* Node Access */ get firstNode() {
1498
+ return this.visibleNodes[0] ?? null;
1499
+ }
1500
+ get lastNode() {
1501
+ return this.visibleNodes[this.visibleNodes.length - 1] ?? null;
1502
+ }
1503
+ get focusedNode() {
1504
+ return this.get(this.state.nodes.focus.id) ?? null;
1505
+ }
1506
+ get mostRecentNode() {
1507
+ return this.get(this.state.nodes.selection.mostRecent) ?? null;
1508
+ }
1509
+ get nextNode() {
1510
+ const index = this.indexOf(this.focusedNode);
1511
+ if (index === null) return null;
1512
+ else return this.at(index + 1);
1513
+ }
1514
+ get prevNode() {
1515
+ const index = this.indexOf(this.focusedNode);
1516
+ if (index === null) return null;
1517
+ else return this.at(index - 1);
1518
+ }
1519
+ get(id) {
1520
+ if (!id) return null;
1521
+ if (id in this.idToIndex) return this.visibleNodes[this.idToIndex[id]] || null;
1522
+ else return null;
1523
+ }
1524
+ at(index) {
1525
+ return this.visibleNodes[index] || null;
1526
+ }
1527
+ nodesBetween(startId, endId) {
1528
+ if (startId === null || endId === null) return [];
1529
+ const index1 = this.indexOf(startId) ?? 0;
1530
+ const index2 = this.indexOf(endId);
1531
+ if (index2 === null) return [];
1532
+ const start = Math.min(index1, index2);
1533
+ const end = Math.max(index1, index2);
1534
+ return this.visibleNodes.slice(start, end + 1);
1535
+ }
1536
+ indexOf(id) {
1537
+ const key = $0e6083160f4b36ed$exports.identifyNull(id);
1538
+ if (!key) return null;
1539
+ return this.idToIndex[key];
1540
+ }
1541
+ /* Data Operations */ get editingId() {
1542
+ return this.state.nodes.edit.id;
1543
+ }
1544
+ createInternal() {
1545
+ return this.create("internal");
1546
+ }
1547
+ createLeaf() {
1548
+ return this.create("leaf");
1549
+ }
1550
+ async create(type) {
1551
+ let index;
1552
+ let parentId;
1553
+ const focus = this.focusedNode;
1554
+ if (focus && focus.parent) {
1555
+ if (focus.isInternal && focus.isOpen) {
1556
+ parentId = focus.id;
1557
+ index = 0;
1558
+ } else {
1559
+ index = focus.childIndex + 1;
1560
+ parentId = focus.parent.isRoot ? null : focus.parent.id;
1561
+ }
1562
+ } else {
1563
+ index = this.root?.children?.length || -1;
1564
+ parentId = null;
1565
+ }
1566
+ const data = await $bfece7c4aed4e9c4$var$safeRun(this.props.onCreate, {
1567
+ parentId: parentId,
1568
+ index: index,
1569
+ type: type
1570
+ });
1571
+ if (data) {
1572
+ this.focus(data);
1573
+ setTimeout(()=>{
1574
+ this.edit(data).then(()=>{
1575
+ this.select(data);
1576
+ this.activate(data);
1577
+ });
1578
+ });
1579
+ }
1580
+ }
1581
+ async delete(node) {
1582
+ if (!node) return;
1583
+ const nodes = Array.isArray(node) ? node : [
1584
+ node
1585
+ ];
1586
+ const ids = nodes.map($bfece7c4aed4e9c4$var$identify);
1587
+ await $bfece7c4aed4e9c4$var$safeRun(this.props.onDelete, {
1588
+ ids: ids
1589
+ });
1590
+ }
1591
+ edit(node) {
1592
+ const id = $bfece7c4aed4e9c4$var$identify(node);
1593
+ this.resolveEdit({
1594
+ cancelled: true
1595
+ });
1596
+ this.scrollTo(id);
1597
+ this.dispatch((0, $21783d2b0251be67$export$e1a8e267487c59d1)(id));
1598
+ return new Promise((resolve)=>{
1599
+ $bfece7c4aed4e9c4$export$e2da3477247342d1.editPromise = resolve;
1600
+ });
1601
+ }
1602
+ async submit(node, value) {
1603
+ if (!node) return;
1604
+ const id = $bfece7c4aed4e9c4$var$identify(node);
1605
+ await $bfece7c4aed4e9c4$var$safeRun(this.props.onRename, {
1606
+ id: id,
1607
+ name: value
1608
+ });
1609
+ this.dispatch((0, $21783d2b0251be67$export$e1a8e267487c59d1)(null));
1610
+ this.resolveEdit({
1611
+ cancelled: false,
1612
+ value: value
1613
+ });
1614
+ setTimeout(()=>this.onFocus()); // Return focus to element;
1615
+ }
1616
+ reset() {
1617
+ this.dispatch((0, $21783d2b0251be67$export$e1a8e267487c59d1)(null));
1618
+ this.resolveEdit({
1619
+ cancelled: true
1620
+ });
1621
+ setTimeout(()=>this.onFocus()); // Return focus to element;
1622
+ }
1623
+ activate(id) {
1624
+ const node = this.get($bfece7c4aed4e9c4$var$identifyNull(id));
1625
+ if (!node) return;
1626
+ $bfece7c4aed4e9c4$var$safeRun(this.props.onActivate, node);
1627
+ }
1628
+ resolveEdit(value) {
1629
+ const resolve = $bfece7c4aed4e9c4$export$e2da3477247342d1.editPromise;
1630
+ if (resolve) resolve(value);
1631
+ $bfece7c4aed4e9c4$export$e2da3477247342d1.editPromise = null;
1632
+ }
1633
+ /* Focus and Selection */ get selectedIds() {
1634
+ return this.state.nodes.selection.ids;
1635
+ }
1636
+ get selectedNodes() {
1637
+ let nodes = [];
1638
+ for (let id of Array.from(this.selectedIds)){
1639
+ const node = this.get(id);
1640
+ if (node) nodes.push(node);
1641
+ }
1642
+ return nodes;
1643
+ }
1644
+ focus(node, opts = {}) {
1645
+ if (!node) return;
1646
+ /* Focus is responsible for scrolling, while selection is
1647
+ * responsible for focus. If selectionFollowsFocus, then
1648
+ * just select it. */ if (this.props.selectionFollowsFocus) this.select(node);
1649
+ else {
1650
+ this.dispatch((0, $c27b8e9863235052$export$d7ddd398f22d79ef)($bfece7c4aed4e9c4$var$identify(node)));
1651
+ if (opts.scroll !== false) this.scrollTo(node);
1652
+ }
1653
+ }
1654
+ pageUp() {
1655
+ const start = this.visibleStartIndex;
1656
+ const stop = this.visibleStopIndex;
1657
+ const page = stop - start;
1658
+ let index = this.focusedNode?.rowIndex ?? 0;
1659
+ if (index > start) index = start;
1660
+ else index = Math.max(start - page, 0);
1661
+ this.focus(this.at(index));
1662
+ }
1663
+ pageDown() {
1664
+ const start = this.visibleStartIndex;
1665
+ const stop = this.visibleStopIndex;
1666
+ const page = stop - start;
1667
+ let index = this.focusedNode?.rowIndex ?? 0;
1668
+ if (index < stop) index = stop;
1669
+ else index = Math.min(index + page, this.visibleNodes.length - 1);
1670
+ this.focus(this.at(index));
1671
+ }
1672
+ select(node, opts = {}) {
1673
+ if (!node) return;
1674
+ const id = $bfece7c4aed4e9c4$var$identify(node);
1675
+ this.dispatch((0, $c27b8e9863235052$export$d7ddd398f22d79ef)(id));
1676
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).only(id));
1677
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).anchor(id));
1678
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).mostRecent(id));
1679
+ this.scrollTo(id, opts.align);
1680
+ $bfece7c4aed4e9c4$var$safeRun(this.props.onSelect, this.selectedNodes);
1681
+ }
1682
+ deselect(node) {
1683
+ if (!node) return;
1684
+ const id = $bfece7c4aed4e9c4$var$identify(node);
1685
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).remove(id));
1686
+ }
1687
+ selectMulti(identity) {
1688
+ const node = this.get($bfece7c4aed4e9c4$var$identifyNull(identity));
1689
+ if (!node) return;
1690
+ this.dispatch((0, $c27b8e9863235052$export$d7ddd398f22d79ef)(node.id));
1691
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).add(node.id));
1692
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).anchor(node.id));
1693
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).mostRecent(node.id));
1694
+ this.scrollTo(node);
1695
+ $bfece7c4aed4e9c4$var$safeRun(this.props.onSelect, this.selectedNodes);
1696
+ }
1697
+ selectContiguous(identity) {
1698
+ if (!identity) return;
1699
+ const id = $bfece7c4aed4e9c4$var$identify(identity);
1700
+ const { anchor: anchor , mostRecent: mostRecent } = this.state.nodes.selection;
1701
+ this.dispatch((0, $c27b8e9863235052$export$d7ddd398f22d79ef)(id));
1702
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).remove(this.nodesBetween(anchor, mostRecent)));
1703
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).add(this.nodesBetween(anchor, $bfece7c4aed4e9c4$var$identifyNull(id))));
1704
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).mostRecent(id));
1705
+ this.scrollTo(id);
1706
+ $bfece7c4aed4e9c4$var$safeRun(this.props.onSelect, this.selectedNodes);
1707
+ }
1708
+ selectNone() {
1709
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).clear());
1710
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).anchor(null));
1711
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).mostRecent(null));
1712
+ $bfece7c4aed4e9c4$var$safeRun(this.props.onSelect, this.selectedNodes);
1713
+ }
1714
+ selectAll() {
1715
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).set(new Set(Object.keys(this.idToIndex))));
1716
+ this.dispatch((0, $c27b8e9863235052$export$d7ddd398f22d79ef)(this.lastNode?.id));
1717
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).anchor(this.firstNode));
1718
+ this.dispatch((0, $37bc167debff36d2$export$e324594224ef24da).mostRecent(this.lastNode));
1719
+ $bfece7c4aed4e9c4$var$safeRun(this.props.onSelect, this.selectedNodes);
1720
+ }
1721
+ /* Drag and Drop */ get cursorParentId() {
1722
+ const { cursor: cursor } = this.state.dnd;
1723
+ switch(cursor.type){
1724
+ case "highlight":
1725
+ return cursor.id;
1726
+ default:
1727
+ return null;
1728
+ }
1729
+ }
1730
+ get cursorOverFolder() {
1731
+ return this.state.dnd.cursor.type === "highlight";
1732
+ }
1733
+ hideCursor() {
1734
+ this.dispatch((0, $59f144a8dd651e5e$export$e324594224ef24da).cursor({
1735
+ type: "none"
1736
+ }));
1737
+ }
1738
+ showCursor(cursor) {
1739
+ this.dispatch((0, $59f144a8dd651e5e$export$e324594224ef24da).cursor(cursor));
1740
+ }
1741
+ /* Visibility */ open(identity) {
1742
+ const id = $bfece7c4aed4e9c4$var$identifyNull(identity);
1743
+ if (!id) return;
1744
+ this.dispatch((0, $3c0bad2888bcd4bc$export$e324594224ef24da).open(id, this.isFiltered));
1745
+ }
1746
+ close(identity) {
1747
+ const id = $bfece7c4aed4e9c4$var$identifyNull(identity);
1748
+ if (!id) return;
1749
+ this.dispatch((0, $3c0bad2888bcd4bc$export$e324594224ef24da).close(id, this.isFiltered));
1750
+ }
1751
+ toggle(identity) {
1752
+ const id = $bfece7c4aed4e9c4$var$identifyNull(identity);
1753
+ if (!id) return;
1754
+ return this.isOpen(id) ? this.close(id) : this.open(id);
1755
+ }
1756
+ openParents(identity) {
1757
+ const id = $bfece7c4aed4e9c4$var$identifyNull(identity);
1758
+ if (!id) return;
1759
+ const node = $0e6083160f4b36ed$exports.dfs(this.root, id);
1760
+ let parent = node?.parent;
1761
+ while(parent){
1762
+ this.open(parent.id);
1763
+ parent = parent.parent;
1764
+ }
1765
+ }
1766
+ openSiblings(node) {
1767
+ const parent = node.parent;
1768
+ if (!parent) this.toggle(node.id);
1769
+ else if (parent.children) {
1770
+ const isOpen = node.isOpen;
1771
+ for (let sibling of parent.children)if (sibling.isInternal) isOpen ? this.close(sibling.id) : this.open(sibling.id);
1772
+ this.scrollTo(this.focusedNode);
1773
+ }
1774
+ }
1775
+ /* Scrolling */ scrollTo(identity, align = "smart") {
1776
+ if (!identity) return;
1777
+ const id = $bfece7c4aed4e9c4$var$identify(identity);
1778
+ this.openParents(id);
1779
+ return $0e6083160f4b36ed$exports.waitFor(()=>id in this.idToIndex).then(()=>{
1780
+ const index = this.idToIndex[id];
1781
+ if (index === undefined) return;
1782
+ this.list.current?.scrollToItem(index, align);
1783
+ }).catch(()=>{
1784
+ console.log(`Id: ${id} never appeared in the list.`);
1785
+ });
1786
+ }
1787
+ /* State Checks */ get isEditing() {
1788
+ return this.state.nodes.edit.id !== null;
1789
+ }
1790
+ get isFiltered() {
1791
+ return !!this.props.searchTerm?.trim();
1792
+ }
1793
+ get hasFocus() {
1794
+ return this.state.nodes.focus.treeFocused;
1795
+ }
1796
+ isSelected(id) {
1797
+ if (!id) return false;
1798
+ return this.state.nodes.selection.ids.has(id);
1799
+ }
1800
+ isOpen(id) {
1801
+ if (!id) return false;
1802
+ if (id === (0, $81080a351c006222$export$ec71a3379b43ae5c)) return true;
1803
+ const def = this.props.openByDefault ?? true;
1804
+ if (this.isFiltered) return this.state.nodes.open.filtered[id] ?? true; // Filtered folders are always opened by default
1805
+ else return this.state.nodes.open.unfiltered[id] ?? def;
1806
+ }
1807
+ isDraggable(data) {
1808
+ const check = this.props.disableDrag || (()=>false);
1809
+ return !$0e6083160f4b36ed$exports.access(data, check) ?? true;
1810
+ }
1811
+ isDroppable(data) {
1812
+ const check = this.props.disableDrop || (()=>false);
1813
+ return !$0e6083160f4b36ed$exports.access(data, check) ?? true;
1814
+ }
1815
+ isDragging(node) {
1816
+ const id = $bfece7c4aed4e9c4$var$identifyNull(node);
1817
+ if (!id) return false;
1818
+ return this.state.nodes.drag.id === id;
1819
+ }
1820
+ isFocused(id) {
1821
+ return this.hasFocus && this.state.nodes.focus.id === id;
1822
+ }
1823
+ isMatch(node) {
1824
+ return this.matchFn(node);
1825
+ }
1826
+ willReceiveDrop(node) {
1827
+ const id = $bfece7c4aed4e9c4$var$identifyNull(node);
1828
+ if (!id) return false;
1829
+ return id === this.state.nodes.drag.idWillReceiveDrop;
1830
+ }
1831
+ /* Tree Event Handlers */ onFocus() {
1832
+ const node = this.focusedNode || this.firstNode;
1833
+ if (node) this.dispatch((0, $c27b8e9863235052$export$d7ddd398f22d79ef)(node.id));
1834
+ }
1835
+ onBlur() {
1836
+ this.dispatch((0, $c27b8e9863235052$export$6b6c976e46a06288)());
1837
+ }
1838
+ onItemsRendered(args) {
1839
+ this.visibleStartIndex = args.visibleStartIndex;
1840
+ this.visibleStopIndex = args.visibleStopIndex;
1841
+ }
1842
+ /* Get Renderers */ get renderContainer() {
1843
+ return this.props.renderContainer || (0, $065a164934293bf2$export$ff4858a4110d9246);
1844
+ }
1845
+ get renderRow() {
1846
+ return this.props.renderRow || (0, $164e874d21fcd87e$export$f9c541e71856c524);
1847
+ }
1848
+ get renderNode() {
1849
+ return this.props.children || (0, $c4edd692d5290432$export$909e23cbfbbd3351);
1850
+ }
1851
+ get renderDragPreview() {
1852
+ return this.props.renderDragPreview || (0, $77d34d95e44d2f58$export$84e211ad8431a387);
1853
+ }
1854
+ get renderCursor() {
1855
+ return this.props.renderCursor || (0, $fb4c15d8425379bd$export$6cb3c16721363d11);
1856
+ }
1327
1857
  }
1328
- const $2ba43033bb8eb39d$export$7fbedc92909ed28e = /*#__PURE__*/ $g00cZ$forwardRef(function $2ba43033bb8eb39d$export$7fbedc92909ed28e(props, ref) {
1329
- const root = $g00cZ$useMemo(()=>$1e5818ce7991d06d$export$9c537176392280a0(props.data, props.hideRoot, props.getChildren, props.isOpen, props.disableDrag, props.disableDrop, props.openByDefault)
1330
- , [
1331
- props.data,
1332
- props.hideRoot,
1333
- props.getChildren,
1334
- props.isOpen,
1335
- props.disableDrag,
1336
- props.disableDrop,
1337
- props.openByDefault,
1858
+
1859
+
1860
+
1861
+
1862
+
1863
+
1864
+
1865
+
1866
+
1867
+ function $5c35ee13c124a8cc$export$1650419e431d3ba3(state = {
1868
+ id: null,
1869
+ idWillReceiveDrop: null
1870
+ }, action) {
1871
+ switch(action.type){
1872
+ case "DND_DRAG_START":
1873
+ return {
1874
+ ...state,
1875
+ id: action.id
1876
+ };
1877
+ case "DND_DRAG_END":
1878
+ return {
1879
+ ...state,
1880
+ id: null
1881
+ };
1882
+ case "DND_CURSOR":
1883
+ const c = action.cursor;
1884
+ if (c.type === "highlight" && c.id !== state.idWillReceiveDrop) return {
1885
+ ...state,
1886
+ idWillReceiveDrop: c.id
1887
+ };
1888
+ else if (c.type !== "highlight" && state.idWillReceiveDrop !== null) return {
1889
+ ...state,
1890
+ idWillReceiveDrop: null
1891
+ };
1892
+ else return state;
1893
+ default:
1894
+ return state;
1895
+ }
1896
+ }
1897
+
1898
+
1899
+ const $a18760514dcf279e$export$a8a69c316169e623 = (0, $g00cZ$combineReducers)({
1900
+ nodes: (0, $g00cZ$combineReducers)({
1901
+ focus: $c27b8e9863235052$export$1650419e431d3ba3,
1902
+ edit: $21783d2b0251be67$export$1650419e431d3ba3,
1903
+ open: $3c0bad2888bcd4bc$export$1650419e431d3ba3,
1904
+ selection: $37bc167debff36d2$export$1650419e431d3ba3,
1905
+ drag: $5c35ee13c124a8cc$export$1650419e431d3ba3
1906
+ }),
1907
+ dnd: $59f144a8dd651e5e$export$1650419e431d3ba3
1908
+ });
1909
+
1910
+
1911
+
1912
+
1913
+
1914
+
1915
+ const $dac24389e46ba09d$var$SERVER_STATE = (0, $6ad32e02250c922e$export$d4c72bab9d6cc13a)();
1916
+ function $dac24389e46ba09d$export$c49dab5eb1b4ce0c({ treeProps: treeProps , imperativeHandle: imperativeHandle , children: children }) {
1917
+ const list = (0, $g00cZ$useRef)(null);
1918
+ const listEl = (0, $g00cZ$useRef)(null);
1919
+ const store = (0, $g00cZ$useRef)((0, $g00cZ$createStore)((0, $a18760514dcf279e$export$a8a69c316169e623), (0, $6ad32e02250c922e$export$d4c72bab9d6cc13a)(treeProps)));
1920
+ const state = (0, $g00cZ$useSyncExternalStore)(store.current.subscribe, store.current.getState, ()=>$dac24389e46ba09d$var$SERVER_STATE);
1921
+ /* The tree api object is stable. */ const api = (0, $g00cZ$useMemo)(()=>{
1922
+ return new (0, $bfece7c4aed4e9c4$export$e2da3477247342d1)(store.current, treeProps, list, listEl);
1923
+ }, []);
1924
+ /* Make sure the tree instance stays in sync */ const updateCount = (0, $g00cZ$useRef)(0);
1925
+ (0, $g00cZ$useMemo)(()=>{
1926
+ updateCount.current += 1;
1927
+ api.update(treeProps);
1928
+ }, [
1929
+ ...Object.values(treeProps),
1930
+ state.nodes.open
1338
1931
  ]);
1339
- return(/*#__PURE__*/ $g00cZ$jsx($3a48b0a92affa3e3$export$6a399b2f7f12632c, {
1340
- imperativeHandle: ref,
1341
- root: root,
1342
- listEl: $g00cZ$useRef(null),
1343
- renderer: props.children,
1344
- width: props.width === undefined ? 300 : props.width,
1345
- height: props.height === undefined ? 500 : props.height,
1346
- indent: props.indent === undefined ? 24 : props.indent,
1347
- rowHeight: props.rowHeight === undefined ? 24 : props.rowHeight,
1348
- onMove: props.onMove || $0e6083160f4b36ed$export$8793edee2d425525,
1349
- onToggle: props.onToggle || $0e6083160f4b36ed$export$8793edee2d425525,
1350
- onEdit: props.onEdit || $0e6083160f4b36ed$export$8793edee2d425525,
1351
- onClick: props.onClick,
1352
- onContextMenu: props.onContextMenu,
1353
- children: /*#__PURE__*/ $g00cZ$jsxs($g00cZ$DndProvider, {
1354
- backend: $g00cZ$HTML5Backend,
1355
- options: {
1356
- rootElement: props.dndRootElement || undefined
1357
- },
1358
- children: [
1359
- /*#__PURE__*/ $g00cZ$jsx($2ba43033bb8eb39d$var$OuterDrop, {
1360
- children: /*#__PURE__*/ $g00cZ$jsx($2ba43033bb8eb39d$var$List, {
1361
- className: props.className
1932
+ /* Expose the tree api */ (0, $g00cZ$useImperativeHandle)(imperativeHandle, ()=>api);
1933
+ /* Change selection based on props */ (0, $g00cZ$useEffect)(()=>{
1934
+ if (api.props.selection) api.select(api.props.selection);
1935
+ else api.selectNone();
1936
+ }, [
1937
+ api.props.selection
1938
+ ]);
1939
+ /* Clear visability for filtered nodes */ (0, $g00cZ$useEffect)(()=>{
1940
+ if (!api.props.searchTerm) store.current.dispatch((0, $3c0bad2888bcd4bc$export$e324594224ef24da).clear(true));
1941
+ }, [
1942
+ api.props.searchTerm
1943
+ ]);
1944
+ return /*#__PURE__*/ (0, $g00cZ$jsx)((0, $89e93131aae74bd9$export$feef243b04ff4151).Provider, {
1945
+ value: api,
1946
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)((0, $89e93131aae74bd9$export$d0c71bc5e3e2d897).Provider, {
1947
+ value: updateCount.current,
1948
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)((0, $89e93131aae74bd9$export$f6d467aa8b3786af).Provider, {
1949
+ value: state.nodes,
1950
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)((0, $89e93131aae74bd9$export$2d5c5ceac203fc1e).Provider, {
1951
+ value: state.dnd,
1952
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)((0, $g00cZ$DndProvider), {
1953
+ backend: (0, $g00cZ$HTML5Backend),
1954
+ options: {
1955
+ rootElement: api.props.dndRootElement || undefined
1956
+ },
1957
+ children: children
1362
1958
  })
1363
- }),
1364
- /*#__PURE__*/ $g00cZ$jsx($6d8109ab8cbcd5e7$export$133773870222880f, {
1365
1959
  })
1366
- ]
1960
+ })
1367
1961
  })
1368
- }));
1962
+ });
1963
+ }
1964
+
1965
+
1966
+
1967
+
1968
+
1969
+ function $e739455e59c6aed3$export$5a6c424b1725f44f() {
1970
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
1971
+ // In case we drop an item at the bottom of the list
1972
+ const [, drop] = (0, $g00cZ$useDrop)(()=>({
1973
+ accept: "NODE",
1974
+ hover: (item, m)=>{
1975
+ if (!m.isOver({
1976
+ shallow: true
1977
+ })) return;
1978
+ const offset = m.getClientOffset();
1979
+ if (!tree.listEl.current || !offset) return;
1980
+ const { cursor: cursor } = (0, $2db980bfed6822da$export$f502ca02ebb85a1c)({
1981
+ element: tree.listEl.current,
1982
+ offset: offset,
1983
+ indent: tree.indent,
1984
+ node: null,
1985
+ prevNode: tree.visibleNodes[tree.visibleNodes.length - 1],
1986
+ nextNode: null
1987
+ });
1988
+ if (cursor) tree.showCursor(cursor);
1989
+ },
1990
+ canDrop: (item, m)=>{
1991
+ return m.isOver({
1992
+ shallow: true
1993
+ });
1994
+ },
1995
+ drop: (item, m)=>{
1996
+ if (m.didDrop()) return;
1997
+ const offset = m.getClientOffset();
1998
+ if (!tree.listEl.current || !offset) return;
1999
+ const { drop: drop } = (0, $2db980bfed6822da$export$f502ca02ebb85a1c)({
2000
+ element: tree.listEl.current,
2001
+ offset: offset,
2002
+ indent: tree.indent,
2003
+ node: null,
2004
+ prevNode: tree.visibleNodes[tree.visibleNodes.length - 1],
2005
+ nextNode: null
2006
+ });
2007
+ return drop;
2008
+ }
2009
+ }), [
2010
+ tree
2011
+ ]);
2012
+ drop(tree.listEl);
2013
+ }
2014
+
2015
+
2016
+ function $5d6a5680e6f62734$export$a6ee728c3c6ef11d(props) {
2017
+ (0, $e739455e59c6aed3$export$5a6c424b1725f44f)();
2018
+ return props.children;
2019
+ }
2020
+
2021
+
2022
+
2023
+
2024
+
2025
+
2026
+ function $f13a06e5444f84b6$export$cdf2ef3f6364d85() {
2027
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
2028
+ const Container = tree.props.renderContainer || (0, $065a164934293bf2$export$ff4858a4110d9246);
2029
+ return /*#__PURE__*/ (0, $g00cZ$jsx)((0, $g00cZ$Fragment), {
2030
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)(Container, {})
2031
+ });
2032
+ }
2033
+
2034
+
2035
+
2036
+
2037
+
2038
+
2039
+ function $8f8be4c9bb5ab52a$export$3e21b60650ec7e55() {
2040
+ const tree = (0, $89e93131aae74bd9$export$367b0f2231a90ba0)();
2041
+ const { offset: offset , mouse: mouse , item: item , isDragging: isDragging } = (0, $g00cZ$useDragLayer)((m)=>{
2042
+ return {
2043
+ offset: m.getSourceClientOffset(),
2044
+ mouse: m.getClientOffset(),
2045
+ item: m.getItem(),
2046
+ isDragging: m.isDragging()
2047
+ };
2048
+ });
2049
+ const DragPreview = tree.props.renderDragPreview || (0, $77d34d95e44d2f58$export$84e211ad8431a387);
2050
+ return /*#__PURE__*/ (0, $g00cZ$jsx)(DragPreview, {
2051
+ offset: offset,
2052
+ mouse: mouse,
2053
+ id: item?.id || null,
2054
+ dragIds: item?.dragIds || [],
2055
+ isDragging: isDragging
2056
+ });
2057
+ }
2058
+
2059
+
2060
+ var $0a3913338341addb$exports = {};
2061
+
2062
+ $parcel$export($0a3913338341addb$exports, "useSimpleTree", () => $0a3913338341addb$export$dcd27aa2043b2724);
2063
+
2064
+ var $65f74606ca594063$exports = {};
2065
+
2066
+ $parcel$export($65f74606ca594063$exports, "SimpleTree", () => $65f74606ca594063$export$e32206264f456dce);
2067
+ class $65f74606ca594063$export$e32206264f456dce {
2068
+ constructor(data){
2069
+ this.root = $65f74606ca594063$var$createRoot(data);
2070
+ }
2071
+ get data() {
2072
+ return this.root.children?.map((node)=>node.data) ?? [];
2073
+ }
2074
+ create(args) {
2075
+ const parent = args.parentId ? this.find(args.parentId) : this.root;
2076
+ if (!parent) return null;
2077
+ parent.addChild(args.data, args.index);
2078
+ }
2079
+ move(args) {
2080
+ const src = this.find(args.id);
2081
+ const parent = args.parentId ? this.find(args.parentId) : this.root;
2082
+ if (!src || !parent) return;
2083
+ parent.addChild(src.data, args.index);
2084
+ src.drop();
2085
+ }
2086
+ update(args) {
2087
+ const node = this.find(args.id);
2088
+ if (node) node.update(args.changes);
2089
+ }
2090
+ drop(args) {
2091
+ const node = this.find(args.id);
2092
+ if (node) node.drop();
2093
+ }
2094
+ find(id, node = this.root) {
2095
+ if (!node) return null;
2096
+ if (node.id === id) return node;
2097
+ if (node.children) {
2098
+ for (let child of node.children){
2099
+ const found = this.find(id, child);
2100
+ if (found) return found;
2101
+ }
2102
+ return null;
2103
+ }
2104
+ return null;
2105
+ }
2106
+ }
2107
+ function $65f74606ca594063$var$createRoot(data) {
2108
+ const root = new $65f74606ca594063$var$SimpleNode({
2109
+ id: "ROOT"
2110
+ }, null);
2111
+ root.children = data.map((d)=>$65f74606ca594063$var$createNode(d, root));
2112
+ return root;
2113
+ }
2114
+ function $65f74606ca594063$var$createNode(data, parent) {
2115
+ const node = new $65f74606ca594063$var$SimpleNode(data, parent);
2116
+ if (data.children) node.children = data.children.map((d)=>$65f74606ca594063$var$createNode(d, node));
2117
+ return node;
2118
+ }
2119
+ class $65f74606ca594063$var$SimpleNode {
2120
+ constructor(data, parent){
2121
+ this.data = data;
2122
+ this.parent = parent;
2123
+ this.id = data.id;
2124
+ }
2125
+ hasParent() {
2126
+ return !!this.parent;
2127
+ }
2128
+ get childIndex() {
2129
+ return this.hasParent() ? this.parent.children.indexOf(this) : -1;
2130
+ }
2131
+ addChild(data, index) {
2132
+ const node = $65f74606ca594063$var$createNode(data, this);
2133
+ this.children = this.children ?? [];
2134
+ this.children.splice(index, 0, node);
2135
+ this.data.children = this.data.children ?? [];
2136
+ this.data.children.splice(index, 0, data);
2137
+ }
2138
+ removeChild(index) {
2139
+ this.children?.splice(index, 1);
2140
+ this.data.children?.splice(index, 1);
2141
+ }
2142
+ update(changes) {
2143
+ if (this.hasParent()) {
2144
+ const i = this.childIndex;
2145
+ this.parent.addChild({
2146
+ ...this.data,
2147
+ ...changes
2148
+ }, i);
2149
+ this.drop();
2150
+ }
2151
+ }
2152
+ drop() {
2153
+ if (this.hasParent()) this.parent.removeChild(this.childIndex);
2154
+ }
2155
+ }
2156
+
2157
+
2158
+ let $0a3913338341addb$var$nextId = 0;
2159
+ function $0a3913338341addb$export$dcd27aa2043b2724(initialData) {
2160
+ const [data, setData] = (0, $g00cZ$useState)(initialData);
2161
+ const tree = (0, $g00cZ$useMemo)(()=>new (0, $65f74606ca594063$export$e32206264f456dce)(data), [
2162
+ data
2163
+ ]);
2164
+ const onMove = (args)=>{
2165
+ for (const id of args.dragIds)tree.move({
2166
+ id: id,
2167
+ parentId: args.parentId,
2168
+ index: args.index
2169
+ });
2170
+ setData(tree.data);
2171
+ };
2172
+ const onRename = ({ name: name , id: id })=>{
2173
+ tree.update({
2174
+ id: id,
2175
+ changes: {
2176
+ name: name
2177
+ }
2178
+ });
2179
+ setData(tree.data);
2180
+ };
2181
+ const onCreate = ({ parentId: parentId , index: index , type: type })=>{
2182
+ const data = {
2183
+ id: `simple-tree-id-${$0a3913338341addb$var$nextId++}`,
2184
+ name: ""
2185
+ };
2186
+ if (type === "internal") data.children = [];
2187
+ tree.create({
2188
+ parentId: parentId,
2189
+ index: index,
2190
+ data: data
2191
+ });
2192
+ setData(tree.data);
2193
+ return data;
2194
+ };
2195
+ const onDelete = (args)=>{
2196
+ args.ids.forEach((id)=>tree.drop({
2197
+ id: id
2198
+ }));
2199
+ setData(tree.data);
2200
+ };
2201
+ const controller = {
2202
+ onMove: onMove,
2203
+ onRename: onRename,
2204
+ onCreate: onCreate,
2205
+ onDelete: onDelete
2206
+ };
2207
+ return [
2208
+ data,
2209
+ controller
2210
+ ];
2211
+ }
2212
+
2213
+
2214
+ function $c881d1adb735dfd0$export$d227906824a13416(props) {
2215
+ if (props.initialData && props.data) throw new Error(`React Arborist Tree => Provide either a data or initialData prop, but not both.`);
2216
+ if (props.initialData && (props.onCreate || props.onDelete || props.onMove || props.onRename)) throw new Error(`React Arborist Tree => You passed the initialData prop along with a data handler.
2217
+ Use the data prop if you want to provide your own handlers.`);
2218
+ if (props.initialData) {
2219
+ /**
2220
+ * Let's break the rules of hooks here. If the initialData prop
2221
+ * is provided, we will assume it will not change for the life of
2222
+ * the component.
2223
+ *
2224
+ * We will provide the real data and the handlers to update it.
2225
+ * */ const [data, controller] = (0, $0a3913338341addb$export$dcd27aa2043b2724)(props.initialData);
2226
+ return {
2227
+ ...props,
2228
+ ...controller,
2229
+ data: data
2230
+ };
2231
+ } else return props;
2232
+ }
2233
+
2234
+
2235
+ const $2ba43033bb8eb39d$export$7fbedc92909ed28e = /*#__PURE__*/ (0, $g00cZ$forwardRef)(function Tree(props, ref) {
2236
+ const treeProps = (0, $c881d1adb735dfd0$export$d227906824a13416)(props);
2237
+ return /*#__PURE__*/ (0, $g00cZ$jsxs)((0, $dac24389e46ba09d$export$c49dab5eb1b4ce0c), {
2238
+ treeProps: treeProps,
2239
+ imperativeHandle: ref,
2240
+ children: [
2241
+ /*#__PURE__*/ (0, $g00cZ$jsx)((0, $5d6a5680e6f62734$export$a6ee728c3c6ef11d), {
2242
+ children: /*#__PURE__*/ (0, $g00cZ$jsx)((0, $f13a06e5444f84b6$export$cdf2ef3f6364d85), {})
2243
+ }),
2244
+ /*#__PURE__*/ (0, $g00cZ$jsx)((0, $8f8be4c9bb5ab52a$export$3e21b60650ec7e55), {})
2245
+ ]
2246
+ });
1369
2247
  });
1370
2248
 
1371
2249
 
2250
+ var $8c5b0bb55f55c0d2$exports = {};
2251
+
2252
+
2253
+ var $309635e603b9cc16$exports = {};
2254
+
2255
+
2256
+ var $c9ea992a6d07f0b8$exports = {};
2257
+
2258
+
2259
+
2260
+
2261
+
1372
2262
 
1373
2263
 
1374
2264
 
1375
- export {$2ba43033bb8eb39d$export$7fbedc92909ed28e as Tree, $40fcfa3e17312481$export$e2da3477247342d1 as TreeApi};
2265
+ export {$2ba43033bb8eb39d$export$7fbedc92909ed28e as Tree, $096e74084443e9a3$export$d4b903da0f522dc8 as NodeApi, $bfece7c4aed4e9c4$export$e2da3477247342d1 as TreeApi, $65f74606ca594063$export$e32206264f456dce as SimpleTree, $0a3913338341addb$export$dcd27aa2043b2724 as useSimpleTree};
1376
2266
  //# sourceMappingURL=module.js.map