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