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