@vue-dnd-kit/core 2.0.0-alpha7 → 2.0.0-alpha9
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/external/composables/makeDraggable.d.ts +2 -1
- package/dist/external/composables/makeDroppable.d.ts +2 -1
- package/dist/external/env.d.ts +7 -0
- package/dist/external/index.d.ts +3 -5
- package/dist/external/types/placement.d.ts +1 -1
- package/dist/internal/sensors/default-collision.d.ts +1 -1
- package/dist/internal/sensors/index.d.ts +1 -0
- package/dist/internal/sensors/sensor.d.ts +7 -0
- package/dist/internal/sensors/steps.d.ts +4 -0
- package/dist/internal/utils/hover.d.ts +29 -0
- package/dist/internal/utils/placement.d.ts +5 -11
- package/dist/vue-dnd-kit-core.cjs.js +1 -1
- package/dist/vue-dnd-kit-core.es.js +517 -420
- package/package.json +1 -1
|
@@ -1,59 +1,59 @@
|
|
|
1
1
|
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".dnd-kit-default-overlay{transform:translate3d(var(--position-x),var(--position-y),0)}.dnd-kit-overlay-container{position:fixed;top:0;left:0;pointer-events:none;cursor:grabbing}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
|
-
import { ref as U, watch as
|
|
3
|
-
const
|
|
2
|
+
import { ref as U, watch as J, shallowRef as V, reactive as Z, computed as m, onScopeDispose as Ke, onMounted as N, onBeforeUnmount as Y, inject as Ce, defineComponent as Le, unref as x, openBlock as C, createElementBlock as $, normalizeStyle as ye, Fragment as ie, renderList as He, createBlock as q, resolveDynamicComponent as re, createCommentVNode as Ne, useTemplateRef as Ye, provide as Xe, renderSlot as me, createElementVNode as be, toDisplayString as Ze, Teleport as Ue } from "vue";
|
|
3
|
+
const L = {
|
|
4
4
|
SELECT_AREA: "data-dnd-kit-select-area",
|
|
5
5
|
DRAGGABLE: "data-dnd-kit-draggable",
|
|
6
6
|
DROPPABLE: "data-dnd-kit-droppable",
|
|
7
7
|
CONSTRAINT_AREA: "data-dnd-kit-constraint-area"
|
|
8
|
-
},
|
|
9
|
-
SELECT_AREA: `[${
|
|
10
|
-
DRAGGABLE: `[${
|
|
11
|
-
CONSTRAINT_AREA: `[${
|
|
12
|
-
},
|
|
8
|
+
}, H = {
|
|
9
|
+
SELECT_AREA: `[${L.SELECT_AREA}]`,
|
|
10
|
+
DRAGGABLE: `[${L.DRAGGABLE}]`,
|
|
11
|
+
CONSTRAINT_AREA: `[${L.CONSTRAINT_AREA}]`
|
|
12
|
+
}, fe = "VueDnDKitProvider", he = (e, t, n, o) => {
|
|
13
13
|
const s = /* @__PURE__ */ new Set();
|
|
14
14
|
return t.forEach((r) => {
|
|
15
15
|
const i = e.get(r), a = o ? o(r) : i?.disabled;
|
|
16
16
|
if (!i || a) return;
|
|
17
|
-
const l = i.modifier?.keys,
|
|
18
|
-
if (!l || !
|
|
17
|
+
const l = i.modifier?.keys, u = i.modifier?.method;
|
|
18
|
+
if (!l || !u || l.length === 0) {
|
|
19
19
|
s.add(r);
|
|
20
20
|
return;
|
|
21
21
|
}
|
|
22
|
-
l[
|
|
22
|
+
l[u]((c) => n.value.has(c)) && s.add(r);
|
|
23
23
|
}), s;
|
|
24
24
|
};
|
|
25
|
-
let
|
|
26
|
-
const
|
|
25
|
+
let ke = "", $e = "", Ve = "";
|
|
26
|
+
const p = (e) => e.value ? e.value instanceof HTMLElement ? e.value : e.value.$el : null, F = (e, t) => e !== t && e.contains(t), qe = (e, t) => !(e.right < t.left || e.left > t.right || e.bottom < t.top || e.top > t.bottom), ae = () => {
|
|
27
27
|
const e = document.body;
|
|
28
|
-
|
|
29
|
-
},
|
|
28
|
+
ke = e.style.userSelect, e.style.userSelect = "none", window.addEventListener("contextmenu", D), window.addEventListener("selectstart", D), window.addEventListener("touchstart", D), window.addEventListener("touchmove", D);
|
|
29
|
+
}, le = () => {
|
|
30
30
|
const e = document.body;
|
|
31
|
-
e.style.userSelect =
|
|
32
|
-
},
|
|
31
|
+
e.style.userSelect = ke, e.style.touchAction = $e, e.style.overscrollBehavior = Ve, window.removeEventListener("contextmenu", D), window.removeEventListener("selectstart", D), window.removeEventListener("touchstart", D), window.removeEventListener("touchmove", D);
|
|
32
|
+
}, D = (e) => e.preventDefault(), k = (e, t) => {
|
|
33
33
|
if (t.entities.draggableMap.get(e)?.disabled) return !0;
|
|
34
34
|
for (const [o, s] of t.entities.draggableMap)
|
|
35
|
-
if (s.disabled &&
|
|
35
|
+
if (s.disabled && F(o, e)) return !0;
|
|
36
36
|
return !1;
|
|
37
|
-
},
|
|
37
|
+
}, z = (e, t) => {
|
|
38
38
|
if (t.entities.droppableMap.get(e)?.disabled) return !0;
|
|
39
39
|
for (const [o, s] of t.entities.droppableMap)
|
|
40
|
-
if (s.disabled &&
|
|
40
|
+
if (s.disabled && F(o, e)) return !0;
|
|
41
41
|
return !1;
|
|
42
|
-
},
|
|
43
|
-
function
|
|
42
|
+
}, de = (e, t) => !e.length || !t.length ? !0 : e.some((n) => t.includes(n));
|
|
43
|
+
function We(e, t, n, o) {
|
|
44
44
|
const s = /* @__PURE__ */ new Set();
|
|
45
45
|
for (const a of t.keys()) {
|
|
46
46
|
const l = n.get(a);
|
|
47
|
-
for (const
|
|
47
|
+
for (const u of l?.groups ?? []) s.add(u);
|
|
48
48
|
}
|
|
49
49
|
const r = [...s], i = /* @__PURE__ */ new Set();
|
|
50
50
|
for (const a of e) {
|
|
51
|
-
const
|
|
52
|
-
|
|
51
|
+
const u = o.get(a)?.groups ?? [];
|
|
52
|
+
de(r, u) && i.add(a);
|
|
53
53
|
}
|
|
54
54
|
return i;
|
|
55
55
|
}
|
|
56
|
-
function
|
|
56
|
+
function je(e, t, n) {
|
|
57
57
|
const o = /* @__PURE__ */ new Set();
|
|
58
58
|
for (const i of t.keys()) {
|
|
59
59
|
const a = n.get(i);
|
|
@@ -62,11 +62,11 @@ function qe(e, t, n) {
|
|
|
62
62
|
const s = [...o], r = /* @__PURE__ */ new Set();
|
|
63
63
|
for (const i of e) {
|
|
64
64
|
const l = n.get(i)?.groups ?? [];
|
|
65
|
-
|
|
65
|
+
de(s, l) && r.add(i);
|
|
66
66
|
}
|
|
67
67
|
return r;
|
|
68
68
|
}
|
|
69
|
-
const
|
|
69
|
+
const ne = (e) => {
|
|
70
70
|
const t = new IntersectionObserver((n) => {
|
|
71
71
|
n.forEach((o) => {
|
|
72
72
|
const s = o.target;
|
|
@@ -78,7 +78,7 @@ const te = (e) => {
|
|
|
78
78
|
unobserve: (n) => t.unobserve(n),
|
|
79
79
|
disconnect: () => t.disconnect()
|
|
80
80
|
};
|
|
81
|
-
},
|
|
81
|
+
}, Je = (e) => {
|
|
82
82
|
const t = new ResizeObserver((n) => {
|
|
83
83
|
const o = n[0];
|
|
84
84
|
if (!o) return;
|
|
@@ -90,8 +90,8 @@ const te = (e) => {
|
|
|
90
90
|
unobserve: (n) => t.unobserve(n),
|
|
91
91
|
disconnect: () => t.disconnect()
|
|
92
92
|
};
|
|
93
|
-
},
|
|
94
|
-
const t = U(null), n =
|
|
93
|
+
}, Qe = (e) => {
|
|
94
|
+
const t = U(null), n = Je(t), o = J(
|
|
95
95
|
e,
|
|
96
96
|
(r) => {
|
|
97
97
|
n.disconnect(), r && n.observe(r);
|
|
@@ -104,18 +104,18 @@ const te = (e) => {
|
|
|
104
104
|
}
|
|
105
105
|
} };
|
|
106
106
|
};
|
|
107
|
-
function
|
|
107
|
+
function ce(e, t = 0, n = 0) {
|
|
108
108
|
return {
|
|
109
109
|
start: { x: e.clientX, y: e.clientY },
|
|
110
110
|
current: { x: e.clientX, y: e.clientY },
|
|
111
111
|
offset: { x: t, y: n }
|
|
112
112
|
};
|
|
113
113
|
}
|
|
114
|
-
function
|
|
114
|
+
function Re(e, t) {
|
|
115
115
|
const n = t.getBoundingClientRect(), o = n.width > 0 ? (e.clientX - n.left) / n.width : 0.5, s = n.height > 0 ? (e.clientY - n.top) / n.height : 0.5;
|
|
116
116
|
return { x: o, y: s };
|
|
117
117
|
}
|
|
118
|
-
function
|
|
118
|
+
function Pe(e, t) {
|
|
119
119
|
return {
|
|
120
120
|
...t,
|
|
121
121
|
initialHTML: e.innerHTML,
|
|
@@ -123,39 +123,39 @@ function ke(e, t) {
|
|
|
123
123
|
initialOuterHTML: e.outerHTML
|
|
124
124
|
};
|
|
125
125
|
}
|
|
126
|
-
function
|
|
126
|
+
function et(e, t, n) {
|
|
127
127
|
e.forEach((o) => {
|
|
128
128
|
const s = t.get(o);
|
|
129
|
-
n.set(o,
|
|
129
|
+
n.set(o, Pe(o, s));
|
|
130
130
|
}), e.clear();
|
|
131
131
|
}
|
|
132
|
-
function
|
|
132
|
+
function tt(e, t, n) {
|
|
133
133
|
n.clear();
|
|
134
134
|
const o = t.get(e);
|
|
135
|
-
n.set(e,
|
|
135
|
+
n.set(e, Pe(e, o));
|
|
136
136
|
}
|
|
137
|
-
function
|
|
138
|
-
e.entities.initiatingDraggable && (e.state.value = "dragging",
|
|
137
|
+
function W(e) {
|
|
138
|
+
e.entities.initiatingDraggable && (e.state.value = "dragging", nt(
|
|
139
139
|
e.entities.initiatingDraggable,
|
|
140
140
|
e.entities.selectedSet,
|
|
141
141
|
e.entities.draggableMap,
|
|
142
142
|
e.entities.draggingMap
|
|
143
143
|
));
|
|
144
144
|
}
|
|
145
|
-
function
|
|
146
|
-
t.has(e) ?
|
|
145
|
+
function nt(e, t, n, o) {
|
|
146
|
+
t.has(e) ? et(t, n, o) : (t.clear(), tt(e, n, o));
|
|
147
147
|
}
|
|
148
148
|
function Te(e, t, n, o) {
|
|
149
149
|
if (o || !n) return !0;
|
|
150
150
|
const s = e.closest(n);
|
|
151
151
|
return s ? t.contains(s) : !1;
|
|
152
152
|
}
|
|
153
|
-
function
|
|
153
|
+
function ot(e, t) {
|
|
154
154
|
if (!e || !t) return 1;
|
|
155
155
|
const n = Math.abs(e.current.x - e.start.x), o = Math.abs(e.current.y - e.start.y);
|
|
156
156
|
if (typeof t == "number") {
|
|
157
|
-
const
|
|
158
|
-
return Math.min(
|
|
157
|
+
const u = Math.sqrt(n * n + o * o);
|
|
158
|
+
return Math.min(u / t, 1);
|
|
159
159
|
}
|
|
160
160
|
const {
|
|
161
161
|
x: s = 0,
|
|
@@ -166,24 +166,24 @@ function tt(e, t) {
|
|
|
166
166
|
const a = s > 0 ? Math.min(n / s, 1) : 1, l = r > 0 ? Math.min(o / r, 1) : 1;
|
|
167
167
|
return i === "both" ? Math.min(a, l) : Math.max(a, l);
|
|
168
168
|
}
|
|
169
|
-
function
|
|
169
|
+
function Be(e, t, n) {
|
|
170
170
|
if (!n) return !0;
|
|
171
171
|
const o = n.distance != null, s = n.delay != null;
|
|
172
172
|
return !o && !s ? !0 : o && !s ? e >= 1 : !o && s ? t >= 1 : (n.condition ?? "both") === "both" ? e >= 1 && t >= 1 : e >= 1 || t >= 1;
|
|
173
173
|
}
|
|
174
|
-
function
|
|
174
|
+
function st(e) {
|
|
175
175
|
if (e.state.value !== "activating" || !e.entities.initiatingDraggable)
|
|
176
176
|
return !1;
|
|
177
177
|
const t = e.entities.draggableMap.get(
|
|
178
178
|
e.entities.initiatingDraggable
|
|
179
179
|
);
|
|
180
|
-
return
|
|
180
|
+
return Be(
|
|
181
181
|
e.distanceProgress.value,
|
|
182
182
|
e.delay.progress,
|
|
183
183
|
t?.activation
|
|
184
|
-
) ? (
|
|
184
|
+
) ? (W(e), !0) : !1;
|
|
185
185
|
}
|
|
186
|
-
function
|
|
186
|
+
function it(e, t) {
|
|
187
187
|
let n = null;
|
|
188
188
|
const o = () => {
|
|
189
189
|
if (e.state.value !== "activating" || !e.entities.initiatingDraggable) {
|
|
@@ -200,7 +200,7 @@ function ot(e, t) {
|
|
|
200
200
|
e.delay.progress = Math.min(
|
|
201
201
|
(Date.now() - e.delay.startTime) / (r * 1e3),
|
|
202
202
|
1
|
|
203
|
-
),
|
|
203
|
+
), Be(
|
|
204
204
|
e.distanceProgress.value,
|
|
205
205
|
e.delay.progress,
|
|
206
206
|
s?.activation
|
|
@@ -212,19 +212,19 @@ function ot(e, t) {
|
|
|
212
212
|
}
|
|
213
213
|
};
|
|
214
214
|
}
|
|
215
|
-
function
|
|
215
|
+
function rt(e, t) {
|
|
216
216
|
const n = e.closest(
|
|
217
|
-
|
|
217
|
+
H.CONSTRAINT_AREA
|
|
218
218
|
);
|
|
219
219
|
return !n || !t.has(n) ? null : {
|
|
220
220
|
element: n,
|
|
221
221
|
entity: t.get(n)
|
|
222
222
|
};
|
|
223
223
|
}
|
|
224
|
-
function
|
|
224
|
+
function at(e, t, n, o) {
|
|
225
225
|
return n === "x" ? { x: e, y: o.top } : n === "y" ? { x: o.left, y: t } : { x: e, y: t };
|
|
226
226
|
}
|
|
227
|
-
function
|
|
227
|
+
function lt(e, t, n, o, s) {
|
|
228
228
|
let r = e, i = t;
|
|
229
229
|
return n !== "y" && (r = Math.max(
|
|
230
230
|
o.left,
|
|
@@ -234,31 +234,31 @@ function rt(e, t, n, o, s) {
|
|
|
234
234
|
Math.min(o.bottom - s.height, t)
|
|
235
235
|
)), { x: r, y: i };
|
|
236
236
|
}
|
|
237
|
-
function
|
|
237
|
+
function ct(e, t, n, o, s) {
|
|
238
238
|
if (!e || !t)
|
|
239
239
|
return { x: 0, y: 0 };
|
|
240
240
|
const r = t.getBoundingClientRect(), i = r.width || s?.width || 0, a = r.height || s?.height || 0;
|
|
241
|
-
let l = e.current.x - i * e.offset.x,
|
|
241
|
+
let l = e.current.x - i * e.offset.x, u = e.current.y - a * e.offset.y;
|
|
242
242
|
if (!n)
|
|
243
|
-
return { x: l, y:
|
|
244
|
-
const
|
|
245
|
-
if (!
|
|
246
|
-
return { x: l, y:
|
|
247
|
-
const { element:
|
|
243
|
+
return { x: l, y: u };
|
|
244
|
+
const d = rt(n, o);
|
|
245
|
+
if (!d)
|
|
246
|
+
return { x: l, y: u };
|
|
247
|
+
const { element: c, entity: g } = d, f = c.getBoundingClientRect(), y = n.getBoundingClientRect(), b = at(
|
|
248
248
|
l,
|
|
249
|
-
|
|
250
|
-
|
|
249
|
+
u,
|
|
250
|
+
g.axis || "both",
|
|
251
251
|
y
|
|
252
252
|
);
|
|
253
|
-
return
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
253
|
+
return g.restrictToArea ? lt(
|
|
254
|
+
b.x,
|
|
255
|
+
b.y,
|
|
256
|
+
g.axis || "both",
|
|
257
257
|
f,
|
|
258
258
|
r
|
|
259
|
-
) :
|
|
259
|
+
) : b;
|
|
260
260
|
}
|
|
261
|
-
const
|
|
261
|
+
const I = {
|
|
262
262
|
forDrag: ["Enter", "Space"],
|
|
263
263
|
forCancel: ["Escape"],
|
|
264
264
|
forDrop: ["Enter", "Space"],
|
|
@@ -274,19 +274,19 @@ const _ = {
|
|
|
274
274
|
],
|
|
275
275
|
forMoveFaster: ["ShiftLeft", "ShiftRight"]
|
|
276
276
|
};
|
|
277
|
-
function
|
|
278
|
-
const n =
|
|
277
|
+
function ut(e, t) {
|
|
278
|
+
const n = V(), o = U(), r = {
|
|
279
279
|
keys: {
|
|
280
280
|
pressedKeys: U(/* @__PURE__ */ new Set()),
|
|
281
|
-
forDrag: [...
|
|
282
|
-
forCancel: [...
|
|
283
|
-
forDrop: [...
|
|
284
|
-
forMove: [...
|
|
285
|
-
forMoveFaster: [...
|
|
281
|
+
forDrag: [...I.forDrag],
|
|
282
|
+
forCancel: [...I.forCancel],
|
|
283
|
+
forDrop: [...I.forDrop],
|
|
284
|
+
forMove: [...I.forMove],
|
|
285
|
+
forMoveFaster: [...I.forMoveFaster]
|
|
286
286
|
},
|
|
287
287
|
step: 8,
|
|
288
288
|
moveFaster: 4
|
|
289
|
-
}, i =
|
|
289
|
+
}, i = Z({
|
|
290
290
|
draggableMap: /* @__PURE__ */ new Map(),
|
|
291
291
|
droppableMap: /* @__PURE__ */ new Map(),
|
|
292
292
|
selectableAreaMap: /* @__PURE__ */ new Map(),
|
|
@@ -295,94 +295,94 @@ function lt(e, t) {
|
|
|
295
295
|
selectingArea: void 0,
|
|
296
296
|
draggingMap: /* @__PURE__ */ new Map(),
|
|
297
297
|
selectedSet: /* @__PURE__ */ new Set(),
|
|
298
|
-
allowedDroppableSet:
|
|
298
|
+
allowedDroppableSet: m(() => n.value ? We(
|
|
299
299
|
i.visibleDroppableSet,
|
|
300
300
|
i.draggingMap,
|
|
301
301
|
i.draggableMap,
|
|
302
302
|
i.droppableMap
|
|
303
303
|
) : /* @__PURE__ */ new Set()),
|
|
304
|
-
allowedDraggableSet:
|
|
304
|
+
allowedDraggableSet: m(() => n.value ? je(
|
|
305
305
|
i.visibleDraggableSet,
|
|
306
306
|
i.draggingMap,
|
|
307
307
|
i.draggableMap
|
|
308
308
|
) : /* @__PURE__ */ new Set()),
|
|
309
|
-
modifiersSelectableAreaSet:
|
|
309
|
+
modifiersSelectableAreaSet: m(() => he(
|
|
310
310
|
i.selectableAreaMap,
|
|
311
311
|
i.visibleSelectableAreaSet,
|
|
312
312
|
r.keys.pressedKeys
|
|
313
313
|
)),
|
|
314
|
-
modifiersDraggableSet:
|
|
314
|
+
modifiersDraggableSet: m(() => he(
|
|
315
315
|
i.draggableMap,
|
|
316
316
|
i.visibleDraggableSet,
|
|
317
317
|
r.keys.pressedKeys,
|
|
318
|
-
(
|
|
318
|
+
(v) => k(v, { entities: i })
|
|
319
319
|
)),
|
|
320
320
|
visibleDraggableSet: /* @__PURE__ */ new Set(),
|
|
321
321
|
visibleDroppableSet: /* @__PURE__ */ new Set(),
|
|
322
322
|
visibleSelectableAreaSet: /* @__PURE__ */ new Set()
|
|
323
|
-
}), a =
|
|
323
|
+
}), a = Z({
|
|
324
324
|
draggable: /* @__PURE__ */ new Map(),
|
|
325
325
|
droppable: /* @__PURE__ */ new Map()
|
|
326
326
|
}), l = {
|
|
327
|
-
throttle:
|
|
328
|
-
},
|
|
327
|
+
throttle: V(0)
|
|
328
|
+
}, u = Z({
|
|
329
329
|
x: window.scrollX,
|
|
330
330
|
y: window.scrollY
|
|
331
|
-
}),
|
|
331
|
+
}), d = Z({
|
|
332
332
|
progress: 0,
|
|
333
333
|
startTime: 0
|
|
334
|
-
}),
|
|
334
|
+
}), c = m(() => {
|
|
335
335
|
if (!o.value || !i.initiatingDraggable) return 0;
|
|
336
|
-
const
|
|
337
|
-
return
|
|
338
|
-
}),
|
|
336
|
+
const v = i.draggableMap.get(i.initiatingDraggable)?.activation?.distance;
|
|
337
|
+
return v ? ot(o.value, v) : 1;
|
|
338
|
+
}), g = ne(
|
|
339
339
|
i.visibleDraggableSet
|
|
340
|
-
), f =
|
|
340
|
+
), f = ne(
|
|
341
341
|
i.visibleDroppableSet
|
|
342
|
-
), y =
|
|
342
|
+
), y = ne(
|
|
343
343
|
i.visibleSelectableAreaSet
|
|
344
|
-
), { overlaySize:
|
|
344
|
+
), { overlaySize: b, overlaySizeObserver: R } = Qe(e), S = U(), _ = m(() => {
|
|
345
345
|
const h = i.initiatingDraggable;
|
|
346
|
-
return
|
|
346
|
+
return ct(
|
|
347
347
|
o.value,
|
|
348
348
|
e.value,
|
|
349
349
|
h || null,
|
|
350
350
|
i.constraintsAreaMap,
|
|
351
|
-
|
|
351
|
+
b.value
|
|
352
352
|
);
|
|
353
|
-
}),
|
|
353
|
+
}), E = m({
|
|
354
354
|
get: () => t?.overlayTo,
|
|
355
|
-
set: (h) =>
|
|
356
|
-
}),
|
|
355
|
+
set: (h) => E.value = h
|
|
356
|
+
}), X = m(() => t?.autoScrollViewport);
|
|
357
357
|
return {
|
|
358
358
|
state: n,
|
|
359
359
|
pointer: o,
|
|
360
360
|
entities: i,
|
|
361
361
|
keyboard: r,
|
|
362
|
-
scrollPosition:
|
|
363
|
-
delay:
|
|
364
|
-
distanceProgress:
|
|
362
|
+
scrollPosition: u,
|
|
363
|
+
delay: d,
|
|
364
|
+
distanceProgress: c,
|
|
365
365
|
hovered: a,
|
|
366
366
|
collision: l,
|
|
367
367
|
overlay: {
|
|
368
|
-
size:
|
|
369
|
-
position:
|
|
370
|
-
render:
|
|
368
|
+
size: b,
|
|
369
|
+
position: _,
|
|
370
|
+
render: S,
|
|
371
371
|
ref: e,
|
|
372
|
-
to:
|
|
372
|
+
to: E
|
|
373
373
|
},
|
|
374
374
|
lib: {
|
|
375
|
-
draggableObserver:
|
|
375
|
+
draggableObserver: g,
|
|
376
376
|
droppableObserver: f,
|
|
377
377
|
selectableAreaObserver: y,
|
|
378
|
-
overlaySizeObserver:
|
|
378
|
+
overlaySizeObserver: R
|
|
379
379
|
},
|
|
380
|
-
autoScrollViewport:
|
|
380
|
+
autoScrollViewport: X
|
|
381
381
|
};
|
|
382
382
|
}
|
|
383
|
-
const
|
|
383
|
+
const j = (e) => {
|
|
384
384
|
e.pointer.value = void 0, e.state.value = void 0, e.entities.selectingArea = void 0, e.entities.initiatingDraggable = void 0, e.delay.progress = 0, e.delay.startTime = 0, e.entities.draggingMap.clear(), e.hovered.draggable.clear(), e.hovered.droppable.clear();
|
|
385
|
-
},
|
|
385
|
+
}, gt = (e) => {
|
|
386
386
|
const t = e.entities.initiatingDraggable;
|
|
387
387
|
if (!t) return;
|
|
388
388
|
const o = e.entities.draggableMap.get(t)?.payload;
|
|
@@ -395,7 +395,7 @@ const W = (e) => {
|
|
|
395
395
|
items: Array.isArray(i) ? i : [],
|
|
396
396
|
dropData: a
|
|
397
397
|
};
|
|
398
|
-
},
|
|
398
|
+
}, ft = (e, t) => {
|
|
399
399
|
const o = e.entities.droppableMap.get(t)?.payload;
|
|
400
400
|
if (!o) return;
|
|
401
401
|
const s = o();
|
|
@@ -405,90 +405,90 @@ const W = (e) => {
|
|
|
405
405
|
items: Array.isArray(r) ? r : [],
|
|
406
406
|
userData: i
|
|
407
407
|
};
|
|
408
|
-
},
|
|
408
|
+
}, B = (e) => e.keys().next().value, dt = (e) => e.target.closest(H.DRAGGABLE), M = (e, t) => {
|
|
409
409
|
const n = {
|
|
410
|
-
payload:
|
|
410
|
+
payload: gt(e),
|
|
411
411
|
provider: e
|
|
412
412
|
};
|
|
413
|
-
return t && (n.dropZonePayload =
|
|
414
|
-
},
|
|
415
|
-
const o =
|
|
413
|
+
return t && (n.dropZonePayload = ft(e, t)), n;
|
|
414
|
+
}, oe = (e, t, n) => {
|
|
415
|
+
const o = dt(t);
|
|
416
416
|
if (!o || !e.entities.draggingMap.has(o)) return;
|
|
417
|
-
const s =
|
|
417
|
+
const s = M(e);
|
|
418
418
|
e.entities.draggingMap.get(o)?.events?.[n]?.(s);
|
|
419
|
-
},
|
|
420
|
-
if (!t ||
|
|
421
|
-
const o =
|
|
419
|
+
}, O = (e, t, n) => {
|
|
420
|
+
if (!t || k(t, e)) return;
|
|
421
|
+
const o = M(e);
|
|
422
422
|
e.entities.draggableMap.get(t)?.events?.[n]?.(o);
|
|
423
423
|
}, w = (e, t) => {
|
|
424
|
-
const n =
|
|
424
|
+
const n = M(e);
|
|
425
425
|
e.entities.draggableMap.forEach((o, s) => {
|
|
426
|
-
|
|
426
|
+
k(s, e) || o.events?.[t]?.(n);
|
|
427
427
|
});
|
|
428
|
-
},
|
|
428
|
+
}, yt = (e, t, n) => {
|
|
429
429
|
if (t !== n) {
|
|
430
|
-
if (t && !
|
|
431
|
-
const o =
|
|
430
|
+
if (t && !z(t, e)) {
|
|
431
|
+
const o = M(e, t);
|
|
432
432
|
e.entities.droppableMap.get(t)?.events?.onLeave?.(o);
|
|
433
433
|
}
|
|
434
|
-
if (n && !
|
|
435
|
-
const o =
|
|
434
|
+
if (n && !z(n, e)) {
|
|
435
|
+
const o = M(e, n);
|
|
436
436
|
e.entities.droppableMap.get(n)?.events?.onEnter?.(o);
|
|
437
437
|
}
|
|
438
438
|
}
|
|
439
|
-
},
|
|
439
|
+
}, mt = (e, t, n) => {
|
|
440
440
|
if (t !== n) {
|
|
441
|
-
const o =
|
|
442
|
-
t && !
|
|
441
|
+
const o = M(e);
|
|
442
|
+
t && !k(t, e) && e.entities.draggableMap.get(t)?.events?.onLeave?.(o), n && !k(n, e) && e.entities.draggableMap.get(n)?.events?.onHover?.(o);
|
|
443
443
|
}
|
|
444
|
-
},
|
|
445
|
-
const n =
|
|
446
|
-
if (n && !
|
|
447
|
-
const o =
|
|
444
|
+
}, bt = (e, t) => {
|
|
445
|
+
const n = B(t.droppable);
|
|
446
|
+
if (n && !z(n, e)) {
|
|
447
|
+
const o = M(e, n);
|
|
448
448
|
e.entities.droppableMap.get(n)?.events?.onLeave?.(o);
|
|
449
449
|
}
|
|
450
|
-
},
|
|
451
|
-
const n =
|
|
452
|
-
if (n && !
|
|
453
|
-
const o =
|
|
450
|
+
}, Oe = (e, t) => {
|
|
451
|
+
const n = B(t.droppable);
|
|
452
|
+
if (n && !z(n, e)) {
|
|
453
|
+
const o = M(e, n);
|
|
454
454
|
e.entities.droppableMap.get(n)?.events?.onLeave?.(o);
|
|
455
455
|
}
|
|
456
|
-
},
|
|
456
|
+
}, ht = (e, t, n) => {
|
|
457
457
|
if (!n) return {};
|
|
458
|
-
const o = n.getBoundingClientRect(), s = Math.max(o.left, Math.min(e.x, t.x)), r = Math.max(o.top, Math.min(e.y, t.y)), i = Math.min(o.right, Math.max(e.x, t.x)), a = Math.min(o.bottom, Math.max(e.y, t.y)), l = Math.max(0, i - s),
|
|
458
|
+
const o = n.getBoundingClientRect(), s = Math.max(o.left, Math.min(e.x, t.x)), r = Math.max(o.top, Math.min(e.y, t.y)), i = Math.min(o.right, Math.max(e.x, t.x)), a = Math.min(o.bottom, Math.max(e.y, t.y)), l = Math.max(0, i - s), u = Math.max(0, a - r);
|
|
459
459
|
return {
|
|
460
460
|
left: `${s}px`,
|
|
461
461
|
top: `${r}px`,
|
|
462
462
|
width: `${l}px`,
|
|
463
|
-
height: `${
|
|
463
|
+
height: `${u}px`,
|
|
464
464
|
position: "fixed",
|
|
465
465
|
pointerEvents: "none",
|
|
466
466
|
border: "1px solid #3b82f6",
|
|
467
467
|
backgroundColor: "#3b82f61a"
|
|
468
468
|
};
|
|
469
|
-
},
|
|
469
|
+
}, pt = (e) => {
|
|
470
470
|
if (!e.pointer.value || !e.entities.selectingArea) return;
|
|
471
|
-
const { selectingArea: t } = e.entities, n =
|
|
471
|
+
const { selectingArea: t } = e.entities, n = Dt(
|
|
472
472
|
e.pointer.value.start,
|
|
473
473
|
e.pointer.value.current
|
|
474
474
|
), o = e.entities.selectableAreaMap.get(t)?.groups ?? [];
|
|
475
475
|
e.entities.visibleDraggableSet.forEach((s) => {
|
|
476
476
|
if (!t.contains(s)) return;
|
|
477
|
-
if (
|
|
477
|
+
if (k(s, e)) {
|
|
478
478
|
e.entities.selectedSet.delete(s);
|
|
479
479
|
return;
|
|
480
480
|
}
|
|
481
481
|
const i = e.entities.draggableMap.get(s)?.groups ?? [];
|
|
482
|
-
if (!
|
|
482
|
+
if (!de(o, i)) {
|
|
483
483
|
e.entities.selectedSet.delete(s);
|
|
484
484
|
return;
|
|
485
485
|
}
|
|
486
|
-
|
|
486
|
+
qe(n, s.getBoundingClientRect()) ? e.entities.selectedSet.add(s) : e.entities.selectedSet.delete(s);
|
|
487
487
|
});
|
|
488
|
-
},
|
|
488
|
+
}, Dt = (e, t) => {
|
|
489
489
|
const n = Math.min(e.x, t.x), o = Math.min(e.y, t.y), s = Math.max(e.x, t.x), r = Math.max(e.y, t.y), i = s - n, a = r - o;
|
|
490
490
|
return new DOMRect(n, o, i, a);
|
|
491
|
-
},
|
|
491
|
+
}, St = (e, t, n = 5) => {
|
|
492
492
|
const o = n / 2;
|
|
493
493
|
return {
|
|
494
494
|
left: e - o,
|
|
@@ -496,57 +496,89 @@ const W = (e) => {
|
|
|
496
496
|
width: n,
|
|
497
497
|
height: n
|
|
498
498
|
};
|
|
499
|
-
},
|
|
499
|
+
}, vt = (e) => {
|
|
500
500
|
const t = e.pointer.value?.current, n = t?.x ?? 0, o = t?.y ?? 0;
|
|
501
|
-
return
|
|
502
|
-
},
|
|
501
|
+
return St(n, o, 5);
|
|
502
|
+
}, T = (e, t, n) => {
|
|
503
503
|
const o = e.left + e.width / 2, s = e.top + e.height / 2;
|
|
504
504
|
if (n) {
|
|
505
|
-
const
|
|
506
|
-
if (
|
|
507
|
-
return {
|
|
505
|
+
const a = n.top ?? 0, l = n.right ?? 0, u = n.bottom ?? 0, d = n.left ?? 0, c = t.left + d, g = t.right - l, f = t.top + a, y = t.bottom - u;
|
|
506
|
+
if (c < g && f < y && o >= c && o <= g && s >= f && s <= y)
|
|
507
|
+
return {
|
|
508
|
+
top: !1,
|
|
509
|
+
right: !1,
|
|
510
|
+
bottom: !1,
|
|
511
|
+
left: !1,
|
|
512
|
+
center: !0
|
|
513
|
+
};
|
|
508
514
|
}
|
|
509
|
-
const r =
|
|
515
|
+
const r = t.left + t.width / 2, i = t.top + t.height / 2;
|
|
510
516
|
return {
|
|
511
|
-
top:
|
|
512
|
-
bottom:
|
|
513
|
-
left:
|
|
514
|
-
right:
|
|
517
|
+
top: s < i,
|
|
518
|
+
bottom: s > i,
|
|
519
|
+
left: o < r,
|
|
520
|
+
right: o > r,
|
|
521
|
+
center: !1
|
|
515
522
|
};
|
|
516
|
-
},
|
|
517
|
-
|
|
523
|
+
}, wt = (e) => ({
|
|
524
|
+
x: e.left + e.width / 2,
|
|
525
|
+
y: e.top + e.height / 2
|
|
526
|
+
}), K = (e, t) => {
|
|
527
|
+
const n = wt(t);
|
|
528
|
+
return Math.hypot(e.x - n.x, e.y - n.y);
|
|
529
|
+
}, Mt = (e, t) => e.find((n) => n !== t && F(t, n)), ue = (e, t, n) => {
|
|
530
|
+
const o = B(t.droppable), s = B(t.draggable);
|
|
518
531
|
t.draggable.clear(), t.droppable.clear();
|
|
519
|
-
const r =
|
|
532
|
+
const r = vt(e), i = n.zones[0], a = n.elements[0];
|
|
520
533
|
if (i && a && i === a && e.entities.droppableMap.has(i) && i) {
|
|
521
|
-
const
|
|
534
|
+
const c = i.getBoundingClientRect(), g = e.entities.draggableMap.get(i)?.placementMargins, f = T(r, c, g);
|
|
522
535
|
if (f.center) {
|
|
523
536
|
t.droppable.set(i, f);
|
|
524
|
-
const y =
|
|
537
|
+
const y = Mt(n.elements, i);
|
|
525
538
|
if (y) {
|
|
526
|
-
const
|
|
539
|
+
const b = y.getBoundingClientRect();
|
|
527
540
|
t.draggable.set(
|
|
528
541
|
y,
|
|
529
|
-
|
|
542
|
+
T(r, b, void 0)
|
|
530
543
|
);
|
|
531
544
|
}
|
|
532
545
|
} else
|
|
533
|
-
t.draggable.set(a, f)
|
|
546
|
+
t.draggable.set(a, f);
|
|
534
547
|
} else {
|
|
535
548
|
if (i) {
|
|
536
|
-
const
|
|
537
|
-
t.droppable.set(i,
|
|
538
|
-
}
|
|
539
|
-
if (a) {
|
|
540
|
-
const g = a.getBoundingClientRect(), d = e.entities.draggableMap.get(a)?.placementMargins;
|
|
541
|
-
t.draggable.set(
|
|
542
|
-
a,
|
|
543
|
-
X(r, g, d)
|
|
544
|
-
);
|
|
549
|
+
const c = i.getBoundingClientRect();
|
|
550
|
+
t.droppable.set(i, T(r, c));
|
|
545
551
|
}
|
|
552
|
+
if (a)
|
|
553
|
+
if (i)
|
|
554
|
+
if (F(i, a)) {
|
|
555
|
+
const c = a.getBoundingClientRect(), g = e.entities.draggableMap.get(a)?.placementMargins;
|
|
556
|
+
t.draggable.set(
|
|
557
|
+
a,
|
|
558
|
+
T(r, c, g)
|
|
559
|
+
);
|
|
560
|
+
} else {
|
|
561
|
+
const c = e.pointer.value?.current ?? { x: 0, y: 0 }, g = i.getBoundingClientRect(), f = a.getBoundingClientRect(), y = K(c, g);
|
|
562
|
+
if (K(c, f) < y) {
|
|
563
|
+
t.droppable.clear();
|
|
564
|
+
const R = e.entities.draggableMap.get(a)?.placementMargins;
|
|
565
|
+
t.draggable.set(
|
|
566
|
+
a,
|
|
567
|
+
T(r, f, R)
|
|
568
|
+
);
|
|
569
|
+
}
|
|
570
|
+
}
|
|
571
|
+
else {
|
|
572
|
+
const c = a.getBoundingClientRect(), g = e.entities.draggableMap.get(a)?.placementMargins;
|
|
573
|
+
t.draggable.set(
|
|
574
|
+
a,
|
|
575
|
+
T(r, c, g)
|
|
576
|
+
);
|
|
577
|
+
}
|
|
546
578
|
}
|
|
547
|
-
const
|
|
548
|
-
|
|
549
|
-
},
|
|
579
|
+
const u = B(t.droppable), d = B(t.draggable);
|
|
580
|
+
yt(e, o, u), mt(e, s, d);
|
|
581
|
+
}, Et = (e, t) => e.x < t.x + t.width && e.x + e.width > t.x && e.y < t.y + t.height && e.y + e.height > t.y, pe = (e) => {
|
|
550
582
|
if (!e)
|
|
551
583
|
return { x: 0, y: 0, width: 0, height: 0, top: 0, left: 0, right: 0, bottom: 0 };
|
|
552
584
|
const t = e.getBoundingClientRect();
|
|
@@ -560,10 +592,10 @@ const W = (e) => {
|
|
|
560
592
|
right: t.right,
|
|
561
593
|
bottom: t.bottom
|
|
562
594
|
};
|
|
563
|
-
},
|
|
595
|
+
}, De = (e) => ({
|
|
564
596
|
x: e.x + e.width / 2,
|
|
565
597
|
y: e.y + e.height / 2
|
|
566
|
-
}),
|
|
598
|
+
}), At = (e, t) => Math.hypot(t.x - e.x, t.y - e.y), xt = (e, t) => {
|
|
567
599
|
const n = Math.max(
|
|
568
600
|
0,
|
|
569
601
|
Math.min(e.x + e.width, t.x + t.width) - Math.max(e.x, t.x)
|
|
@@ -572,31 +604,41 @@ const W = (e) => {
|
|
|
572
604
|
Math.min(e.y + e.height, t.y + t.height) - Math.max(e.y, t.y)
|
|
573
605
|
), s = n * o, r = e.width * e.height, i = t.width * t.height;
|
|
574
606
|
return r === 0 || i === 0 ? 0 : (s / r * 100 + s / i * 100) / 2;
|
|
575
|
-
},
|
|
607
|
+
}, Ct = (e, t, n) => t >= e.x && t <= e.x + e.width && n >= e.y && n <= e.y + e.height, Se = () => !0, ve = () => 0, Lt = "separate", kt = () => {
|
|
576
608
|
const e = {
|
|
577
|
-
filterElements:
|
|
578
|
-
filterZones:
|
|
579
|
-
sortElements:
|
|
580
|
-
sortZones:
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
609
|
+
filterElements: Se,
|
|
610
|
+
filterZones: Se,
|
|
611
|
+
sortElements: ve,
|
|
612
|
+
sortZones: ve,
|
|
613
|
+
mergeStrategy: Lt,
|
|
614
|
+
pickClosestBetweenFirst: !1
|
|
615
|
+
}, t = (o, s, r, i, a, l, u) => {
|
|
616
|
+
const d = new Set(i), c = { containerBox: s, pointer: r }, g = [...i].filter((f) => a(f, o)).map((f) => {
|
|
617
|
+
const y = pe(f);
|
|
618
|
+
if (!u(y, c)) return null;
|
|
619
|
+
let b = 0;
|
|
620
|
+
for (const S of d)
|
|
621
|
+
S !== f && F(S, f) && b++;
|
|
622
|
+
const R = xt(y, s);
|
|
588
623
|
return {
|
|
589
624
|
node: f,
|
|
590
625
|
box: y,
|
|
591
626
|
meta: {
|
|
592
|
-
isPointerInElement:
|
|
593
|
-
overlapPercent:
|
|
594
|
-
depth:
|
|
595
|
-
centerDistance:
|
|
627
|
+
isPointerInElement: Ct(y, r.x, r.y),
|
|
628
|
+
overlapPercent: R,
|
|
629
|
+
depth: b,
|
|
630
|
+
centerDistance: At(
|
|
631
|
+
De(s),
|
|
632
|
+
De(y)
|
|
633
|
+
)
|
|
596
634
|
}
|
|
597
635
|
};
|
|
598
636
|
}).filter((f) => f !== null);
|
|
599
|
-
|
|
637
|
+
if (e.minOverlapPercent !== void 0) {
|
|
638
|
+
const f = e.minOverlapPercent, y = g.filter((b) => b.meta.overlapPercent >= f);
|
|
639
|
+
g.length = 0, g.push(...y);
|
|
640
|
+
}
|
|
641
|
+
return g.sort((f, y) => l(f, y, c)), g.map((f) => f.node);
|
|
600
642
|
}, n = {
|
|
601
643
|
container(o) {
|
|
602
644
|
return e.container = o, n;
|
|
@@ -625,39 +667,72 @@ const W = (e) => {
|
|
|
625
667
|
sortZones(o) {
|
|
626
668
|
return e.sortZones = o, n;
|
|
627
669
|
},
|
|
670
|
+
mergeStrategy(o) {
|
|
671
|
+
return e.mergeStrategy = o, n;
|
|
672
|
+
},
|
|
673
|
+
pickClosestBetweenFirst(o) {
|
|
674
|
+
return e.pickClosestBetweenFirst = o, n;
|
|
675
|
+
},
|
|
676
|
+
minOverlapPercent(o) {
|
|
677
|
+
return e.minOverlapPercent = o, n;
|
|
678
|
+
},
|
|
628
679
|
build() {
|
|
629
680
|
const o = e;
|
|
630
681
|
if (!o.container || !o.elements || !o.zones || !o.collision)
|
|
631
|
-
throw new Error(
|
|
682
|
+
throw new Error(
|
|
683
|
+
"sensor: container, elements, zones, collision are required"
|
|
684
|
+
);
|
|
632
685
|
return (s) => {
|
|
633
686
|
const r = o.container(s);
|
|
634
687
|
if (!r) return { elements: [], zones: [] };
|
|
635
|
-
const i = o.containerBox ? o.containerBox(s) :
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
688
|
+
const i = o.containerBox ? o.containerBox(s) : pe(r), a = s.pointer.value?.current ?? { x: 0, y: 0 }, l = t(
|
|
689
|
+
s,
|
|
690
|
+
i,
|
|
691
|
+
a,
|
|
692
|
+
o.elements(s),
|
|
693
|
+
o.filterElements,
|
|
694
|
+
o.sortElements,
|
|
695
|
+
o.collision
|
|
696
|
+
), u = t(
|
|
697
|
+
s,
|
|
698
|
+
i,
|
|
699
|
+
a,
|
|
700
|
+
o.zones(s),
|
|
701
|
+
o.filterZones,
|
|
702
|
+
o.sortZones,
|
|
703
|
+
o.collision
|
|
704
|
+
);
|
|
705
|
+
if (o.mergeStrategy === "unified-closest") {
|
|
706
|
+
const d = [
|
|
707
|
+
...l.map((g) => ({ node: g, isZone: !1, distance: 0 })),
|
|
708
|
+
...u.map((g) => ({ node: g, isZone: !0, distance: 0 }))
|
|
709
|
+
];
|
|
710
|
+
if (d.length === 0) return { elements: [], zones: [] };
|
|
711
|
+
for (const g of d) {
|
|
712
|
+
const f = g.node.getBoundingClientRect();
|
|
713
|
+
g.distance = K(a, f);
|
|
714
|
+
}
|
|
715
|
+
const c = d.reduce(
|
|
716
|
+
(g, f) => f.distance < g.distance ? f : g
|
|
717
|
+
);
|
|
718
|
+
return c.isZone ? { elements: [], zones: [c.node] } : { elements: [c.node], zones: [] };
|
|
719
|
+
}
|
|
720
|
+
if (o.pickClosestBetweenFirst && l[0] && u[0]) {
|
|
721
|
+
const d = K(
|
|
640
722
|
a,
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
o.collision
|
|
645
|
-
),
|
|
646
|
-
zones: t(
|
|
647
|
-
s,
|
|
648
|
-
i,
|
|
723
|
+
u[0].getBoundingClientRect()
|
|
724
|
+
);
|
|
725
|
+
return K(
|
|
649
726
|
a,
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
)
|
|
655
|
-
};
|
|
727
|
+
l[0].getBoundingClientRect()
|
|
728
|
+
) < d ? { elements: l, zones: [] } : { elements: [], zones: u };
|
|
729
|
+
}
|
|
730
|
+
return { elements: l, zones: u };
|
|
656
731
|
};
|
|
657
732
|
}
|
|
658
733
|
};
|
|
659
734
|
return n;
|
|
660
|
-
},
|
|
735
|
+
}, Rt = () => kt(), Pt = (e) => e.overlay.ref?.value ?? null, Tt = (e) => {
|
|
661
736
|
const t = e.overlay.position?.value ?? { x: 0, y: 0 }, n = e.overlay.size?.value ?? null, { x: o, y: s } = t, r = n?.width ?? 0, i = n?.height ?? 0;
|
|
662
737
|
return {
|
|
663
738
|
x: o,
|
|
@@ -669,9 +744,9 @@ const W = (e) => {
|
|
|
669
744
|
right: o + r,
|
|
670
745
|
bottom: s + i
|
|
671
746
|
};
|
|
672
|
-
},
|
|
673
|
-
(n) =>
|
|
674
|
-
),
|
|
747
|
+
}, Bt = (e) => e.entities.allowedDraggableSet, Ot = (e) => e.entities.allowedDroppableSet, zt = (e, t) => !t.entities.draggingMap.has(e), Ft = (e, t) => ![...t.entities.draggingMap.keys()].some(
|
|
748
|
+
(n) => F(n, e)
|
|
749
|
+
), _t = (e, t) => t.entities.draggableMap.has(e) ? !k(e, t) : t.entities.droppableMap.has(e) ? !z(e, t) : !0, we = (e, t) => zt(e, t) && Ft(e, t) && _t(e, t), Gt = (e, t) => Et(e, t.containerBox), Me = (e, t, n) => {
|
|
675
750
|
if (n.pointer.x >= n.containerBox.x && n.pointer.x <= n.containerBox.x + n.containerBox.width && n.pointer.y >= n.containerBox.y && n.pointer.y <= n.containerBox.y + n.containerBox.height) {
|
|
676
751
|
if (e.meta.isPointerInElement && t.meta.isPointerInElement)
|
|
677
752
|
return t.meta.depth - e.meta.depth;
|
|
@@ -679,96 +754,96 @@ const W = (e) => {
|
|
|
679
754
|
return e.meta.isPointerInElement ? -1 : 1;
|
|
680
755
|
}
|
|
681
756
|
return Math.abs(e.meta.overlapPercent - t.meta.overlapPercent) <= 1 ? e.meta.centerDistance - t.meta.centerDistance : t.meta.overlapPercent - e.meta.overlapPercent;
|
|
682
|
-
},
|
|
683
|
-
function
|
|
684
|
-
const n = (e.collision?.run ??
|
|
685
|
-
|
|
757
|
+
}, ge = Rt().container(Pt).containerBox(Tt).elements(Bt).zones(Ot).filterElements(we).filterZones(we).collision(Gt).minOverlapPercent(10).sortElements(Me).sortZones(Me).build();
|
|
758
|
+
function Ee(e) {
|
|
759
|
+
const n = (e.collision?.run ?? ge)(e);
|
|
760
|
+
ue(e, e.hovered, n);
|
|
686
761
|
}
|
|
687
|
-
function
|
|
762
|
+
function It(e, t) {
|
|
688
763
|
const n = e.collision?.throttle?.value ?? 0;
|
|
689
764
|
if (n <= 0) {
|
|
690
|
-
|
|
765
|
+
Ee(e);
|
|
691
766
|
return;
|
|
692
767
|
}
|
|
693
768
|
const o = Date.now();
|
|
694
|
-
o - t.value >= n && (t.value = o,
|
|
769
|
+
o - t.value >= n && (t.value = o, Ee(e));
|
|
695
770
|
}
|
|
696
|
-
async function
|
|
771
|
+
async function ze(e) {
|
|
697
772
|
const t = e.hovered.droppable.keys().next().value;
|
|
698
|
-
if (!t ||
|
|
699
|
-
const n = e.entities.droppableMap.get(t), o =
|
|
773
|
+
if (!t || z(t, e)) return !0;
|
|
774
|
+
const n = e.entities.droppableMap.get(t), o = M(e, t), s = n?.events?.onDrop?.(o);
|
|
700
775
|
if (s != null && typeof s.then == "function")
|
|
701
776
|
try {
|
|
702
777
|
return await s, !0;
|
|
703
778
|
} catch {
|
|
704
779
|
const i = e.entities.initiatingDraggable;
|
|
705
|
-
return
|
|
780
|
+
return O(e, i, "onSelfDragCancel"), w(e, "onDragCancel"), Oe(e, e.hovered), !1;
|
|
706
781
|
}
|
|
707
782
|
return !0;
|
|
708
783
|
}
|
|
709
|
-
function
|
|
784
|
+
function Fe(e) {
|
|
710
785
|
const t = e.entities.initiatingDraggable;
|
|
711
|
-
|
|
786
|
+
O(e, t, "onSelfDragEnd"), w(e, "onDragEnd"), bt(e, e.hovered);
|
|
712
787
|
}
|
|
713
|
-
function
|
|
788
|
+
function Kt(e) {
|
|
714
789
|
const t = e.entities.selectingArea;
|
|
715
790
|
if (!t) return;
|
|
716
791
|
const n = e.entities.selectableAreaMap.get(t), o = [...e.entities.selectedSet];
|
|
717
792
|
n?.events?.onSelected?.(o);
|
|
718
793
|
}
|
|
719
|
-
const
|
|
794
|
+
const Ht = (e) => {
|
|
720
795
|
const t = {
|
|
721
796
|
current: null
|
|
722
797
|
}, n = { value: 0 }, o = async () => {
|
|
723
|
-
|
|
798
|
+
le(), t.current?.cancel(), t.current = null;
|
|
724
799
|
const a = e.state.value;
|
|
725
800
|
if (a === "dragging") {
|
|
726
|
-
if (!await
|
|
727
|
-
|
|
801
|
+
if (!await ze(e)) {
|
|
802
|
+
j(e), document.removeEventListener("pointerup", o), document.removeEventListener("pointermove", s);
|
|
728
803
|
return;
|
|
729
804
|
}
|
|
730
|
-
|
|
731
|
-
} else a === "selecting" &&
|
|
732
|
-
|
|
805
|
+
Fe(e);
|
|
806
|
+
} else a === "selecting" && Kt(e);
|
|
807
|
+
j(e), document.removeEventListener("pointerup", o), document.removeEventListener("pointermove", s);
|
|
733
808
|
}, s = (a) => {
|
|
734
809
|
if (e.pointer.value) {
|
|
735
|
-
if (e.pointer.value.current = { x: a.clientX, y: a.clientY },
|
|
736
|
-
|
|
810
|
+
if (e.pointer.value.current = { x: a.clientX, y: a.clientY }, st(e)) {
|
|
811
|
+
oe(e, a, "onSelfDragStart"), w(e, "onDragStart");
|
|
737
812
|
return;
|
|
738
813
|
}
|
|
739
814
|
if (e.state.value === "dragging") {
|
|
740
|
-
|
|
815
|
+
It(e, n);
|
|
741
816
|
const l = e.entities.initiatingDraggable;
|
|
742
|
-
|
|
817
|
+
O(e, l, "onSelfDragMove"), w(e, "onDragMove");
|
|
743
818
|
}
|
|
744
|
-
e.state.value === "selecting" &&
|
|
819
|
+
e.state.value === "selecting" && pt(e);
|
|
745
820
|
}
|
|
746
821
|
};
|
|
747
822
|
return { pointerDown: (a) => {
|
|
748
823
|
document.addEventListener("pointerup", o), document.addEventListener("pointermove", s);
|
|
749
|
-
const l = a.target,
|
|
750
|
-
|
|
751
|
-
),
|
|
752
|
-
|
|
824
|
+
const l = a.target, u = l.closest(
|
|
825
|
+
H.SELECT_AREA
|
|
826
|
+
), d = l.closest(
|
|
827
|
+
H.DRAGGABLE
|
|
753
828
|
);
|
|
754
|
-
if (e.entities.modifiersSelectableAreaSet.size > 0 && e.entities.modifiersSelectableAreaSet.has(
|
|
755
|
-
|
|
829
|
+
if (e.entities.modifiersSelectableAreaSet.size > 0 && e.entities.modifiersSelectableAreaSet.has(u)) {
|
|
830
|
+
ae(), e.pointer.value = ce(a), e.state.value = "selecting", e.entities.selectingArea = u;
|
|
756
831
|
return;
|
|
757
832
|
}
|
|
758
|
-
if (e.entities.modifiersDraggableSet.size > 0 && e.entities.modifiersDraggableSet.has(
|
|
759
|
-
const
|
|
760
|
-
if (!Te(l,
|
|
833
|
+
if (e.entities.modifiersDraggableSet.size > 0 && e.entities.modifiersDraggableSet.has(d)) {
|
|
834
|
+
const c = e.entities.draggableMap.get(d);
|
|
835
|
+
if (!Te(l, d, c?.dragHandle))
|
|
761
836
|
return;
|
|
762
|
-
|
|
763
|
-
const
|
|
764
|
-
e.pointer.value =
|
|
765
|
-
|
|
766
|
-
}))) : (
|
|
837
|
+
ae(), e.entities.initiatingDraggable = d;
|
|
838
|
+
const g = Re(a, d);
|
|
839
|
+
e.pointer.value = ce(a, g.x, g.y), c?.activation?.distance || c?.activation?.delay ? (e.state.value = "activating", c?.activation?.delay && (e.delay.startTime = Date.now(), t.current = it(e, () => {
|
|
840
|
+
W(e), oe(e, a, "onSelfDragStart"), w(e, "onDragStart");
|
|
841
|
+
}))) : (W(e), oe(e, a, "onSelfDragStart"), w(e, "onDragStart"));
|
|
767
842
|
}
|
|
768
843
|
}, pointerUp: o, pointerMove: s, cleanup: () => {
|
|
769
844
|
t.current?.cancel(), document.removeEventListener("pointerup", o), document.removeEventListener("pointermove", s), e.lib.draggableObserver.disconnect(), e.lib.droppableObserver.disconnect(), e.lib.selectableAreaObserver.disconnect(), e.lib.overlaySizeObserver.disconnect();
|
|
770
845
|
} };
|
|
771
|
-
},
|
|
846
|
+
}, Nt = {
|
|
772
847
|
ArrowUp: { dx: 0, dy: -1 },
|
|
773
848
|
ArrowDown: { dx: 0, dy: 1 },
|
|
774
849
|
ArrowLeft: { dx: -1, dy: 0 },
|
|
@@ -777,33 +852,33 @@ const _t = (e) => {
|
|
|
777
852
|
KeyA: { dx: -1, dy: 0 },
|
|
778
853
|
KeyS: { dx: 0, dy: 1 },
|
|
779
854
|
KeyD: { dx: 1, dy: 0 }
|
|
780
|
-
},
|
|
855
|
+
}, Yt = (e) => (t) => {
|
|
781
856
|
const { keys: n } = e.keyboard;
|
|
782
857
|
if (n.pressedKeys.value.add(t.code), e.state.value === "dragging") {
|
|
783
858
|
if (n.forCancel.includes(t.code)) {
|
|
784
|
-
t.preventDefault(),
|
|
859
|
+
t.preventDefault(), le(), O(
|
|
785
860
|
e,
|
|
786
861
|
e.entities.initiatingDraggable,
|
|
787
862
|
"onSelfDragCancel"
|
|
788
|
-
), w(e, "onDragCancel"),
|
|
863
|
+
), w(e, "onDragCancel"), Oe(e, e.hovered), j(e);
|
|
789
864
|
return;
|
|
790
865
|
}
|
|
791
866
|
if (n.forDrop.includes(t.code)) {
|
|
792
|
-
t.preventDefault(), (async () => (await
|
|
867
|
+
t.preventDefault(), (async () => (await ze(e) && Fe(e), le(), j(e)))();
|
|
793
868
|
return;
|
|
794
869
|
}
|
|
795
|
-
const s =
|
|
870
|
+
const s = Nt[t.code];
|
|
796
871
|
if (s && n.forMove.includes(t.code) && e.pointer.value) {
|
|
797
872
|
t.preventDefault();
|
|
798
873
|
const r = n.forMoveFaster.some(
|
|
799
|
-
(
|
|
874
|
+
(u) => n.pressedKeys.value.has(u)
|
|
800
875
|
), i = e.keyboard.step * (r ? e.keyboard.moveFaster : 1);
|
|
801
876
|
e.pointer.value.current = {
|
|
802
877
|
x: e.pointer.value.current.x + s.dx * i,
|
|
803
878
|
y: e.pointer.value.current.y + s.dy * i
|
|
804
879
|
};
|
|
805
|
-
const l = (e.collision?.run ??
|
|
806
|
-
|
|
880
|
+
const l = (e.collision?.run ?? ge)(e);
|
|
881
|
+
ue(e, e.hovered, l), O(
|
|
807
882
|
e,
|
|
808
883
|
e.entities.initiatingDraggable,
|
|
809
884
|
"onSelfDragMove"
|
|
@@ -816,58 +891,58 @@ const _t = (e) => {
|
|
|
816
891
|
const s = document.activeElement;
|
|
817
892
|
if (!s) return;
|
|
818
893
|
const r = s.closest(
|
|
819
|
-
|
|
894
|
+
H.DRAGGABLE
|
|
820
895
|
);
|
|
821
896
|
if (!r || e.entities.modifiersDraggableSet.size === 0 || !e.entities.modifiersDraggableSet.has(r))
|
|
822
897
|
return;
|
|
823
898
|
const i = e.entities.draggableMap.get(r);
|
|
824
899
|
if (!Te(s, r, i?.dragHandle, !0))
|
|
825
900
|
return;
|
|
826
|
-
t.preventDefault(),
|
|
827
|
-
const a = r.getBoundingClientRect(), l = a.left + a.width / 2,
|
|
901
|
+
t.preventDefault(), ae();
|
|
902
|
+
const a = r.getBoundingClientRect(), l = a.left + a.width / 2, u = a.top + a.height / 2, d = {
|
|
828
903
|
clientX: l,
|
|
829
|
-
clientY:
|
|
904
|
+
clientY: u
|
|
830
905
|
};
|
|
831
906
|
e.entities.initiatingDraggable = r;
|
|
832
|
-
const
|
|
833
|
-
e.pointer.value =
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
),
|
|
838
|
-
const f = (e.collision?.run ??
|
|
839
|
-
|
|
907
|
+
const c = Re(d, r);
|
|
908
|
+
e.pointer.value = ce(
|
|
909
|
+
d,
|
|
910
|
+
c.x,
|
|
911
|
+
c.y
|
|
912
|
+
), W(e);
|
|
913
|
+
const f = (e.collision?.run ?? ge)(e);
|
|
914
|
+
ue(e, e.hovered, f), O(e, r, "onSelfDragStart"), w(e, "onDragStart");
|
|
840
915
|
}
|
|
841
|
-
},
|
|
916
|
+
}, Xt = (e) => (t) => {
|
|
842
917
|
e.keyboard.keys.pressedKeys.value.delete(t.code);
|
|
843
|
-
},
|
|
918
|
+
}, Zt = (e) => () => {
|
|
844
919
|
e.keyboard.keys.pressedKeys.value.clear();
|
|
845
|
-
},
|
|
846
|
-
keyDown:
|
|
847
|
-
keyUp:
|
|
848
|
-
clear:
|
|
849
|
-
},
|
|
920
|
+
}, se = {
|
|
921
|
+
keyDown: Yt,
|
|
922
|
+
keyUp: Xt,
|
|
923
|
+
clear: Zt
|
|
924
|
+
}, Ut = (e) => () => {
|
|
850
925
|
e.state.value && (e.scrollPosition.x = window.scrollX, e.scrollPosition.y = window.scrollY);
|
|
851
|
-
},
|
|
852
|
-
function
|
|
926
|
+
}, A = 50, $t = 144, Ae = 1e3 / $t;
|
|
927
|
+
function Vt(e) {
|
|
853
928
|
return e == null ? {
|
|
854
|
-
top:
|
|
855
|
-
right:
|
|
856
|
-
bottom:
|
|
857
|
-
left:
|
|
929
|
+
top: A,
|
|
930
|
+
right: A,
|
|
931
|
+
bottom: A,
|
|
932
|
+
left: A
|
|
858
933
|
} : typeof e == "number" ? {
|
|
859
934
|
top: e,
|
|
860
935
|
right: e,
|
|
861
936
|
bottom: e,
|
|
862
937
|
left: e
|
|
863
938
|
} : {
|
|
864
|
-
top: e.top ??
|
|
865
|
-
right: e.right ??
|
|
866
|
-
bottom: e.bottom ??
|
|
867
|
-
left: e.left ??
|
|
939
|
+
top: e.top ?? A,
|
|
940
|
+
right: e.right ?? A,
|
|
941
|
+
bottom: e.bottom ?? A,
|
|
942
|
+
left: e.left ?? A
|
|
868
943
|
};
|
|
869
944
|
}
|
|
870
|
-
const
|
|
945
|
+
const qt = {
|
|
871
946
|
getScrollState(e) {
|
|
872
947
|
return {
|
|
873
948
|
scrollTop: e.scrollTop,
|
|
@@ -879,41 +954,41 @@ const Ut = {
|
|
|
879
954
|
e.scrollTop = t, e.scrollLeft = n;
|
|
880
955
|
}
|
|
881
956
|
};
|
|
882
|
-
function
|
|
883
|
-
const { speed: r = 10, disabled: i = !1 } = t, a =
|
|
884
|
-
let l = null,
|
|
885
|
-
const f = (
|
|
886
|
-
s && (s.value =
|
|
887
|
-
}, y = (
|
|
888
|
-
const
|
|
889
|
-
if (!
|
|
957
|
+
function _e(e, t, n, o = qt, s) {
|
|
958
|
+
const { speed: r = 10, disabled: i = !1 } = t, a = Vt(t.threshold);
|
|
959
|
+
let l = null, u = null, d = null, c = 0, g = 0;
|
|
960
|
+
const f = (S) => {
|
|
961
|
+
s && (s.value = S);
|
|
962
|
+
}, y = (S) => {
|
|
963
|
+
const _ = e.value, E = n();
|
|
964
|
+
if (!_ || !E || i) {
|
|
890
965
|
f(!1);
|
|
891
966
|
return;
|
|
892
967
|
}
|
|
893
|
-
|
|
894
|
-
const
|
|
895
|
-
if (
|
|
968
|
+
u || (u = S);
|
|
969
|
+
const X = S - u;
|
|
970
|
+
if (X < Ae) {
|
|
896
971
|
l = requestAnimationFrame(y);
|
|
897
972
|
return;
|
|
898
973
|
}
|
|
899
|
-
const h = r * (
|
|
900
|
-
|
|
974
|
+
const h = r * (X / Ae);
|
|
975
|
+
u = S;
|
|
901
976
|
const {
|
|
902
|
-
scrollTop:
|
|
903
|
-
scrollLeft:
|
|
904
|
-
rect:
|
|
905
|
-
} = o.getScrollState(
|
|
906
|
-
(!
|
|
907
|
-
let P = !1,
|
|
908
|
-
a.top > 0 &&
|
|
977
|
+
scrollTop: v,
|
|
978
|
+
scrollLeft: G,
|
|
979
|
+
rect: Ie
|
|
980
|
+
} = o.getScrollState(_);
|
|
981
|
+
(!d || c !== v || g !== G) && (d = Ie, c = v, g = G);
|
|
982
|
+
let P = !1, ee = v, te = G;
|
|
983
|
+
a.top > 0 && E.y - d.top < a.top ? (ee = v - h, P = !0) : a.bottom > 0 && d.bottom - E.y < a.bottom && (ee = v + h, P = !0), a.left > 0 && E.x - d.left < a.left ? (te = G - h, P = !0) : a.right > 0 && d.right - E.x < a.right && (te = G + h, P = !0), P && o.setScroll(_, ee, te), f(P), l = requestAnimationFrame(y);
|
|
909
984
|
};
|
|
910
985
|
return { run: () => {
|
|
911
|
-
|
|
986
|
+
u = null, l = requestAnimationFrame(y);
|
|
912
987
|
}, stop: () => {
|
|
913
|
-
l && (cancelAnimationFrame(l), l = null),
|
|
988
|
+
l && (cancelAnimationFrame(l), l = null), d = null, c = 0, g = 0, u = null, f(!1);
|
|
914
989
|
} };
|
|
915
990
|
}
|
|
916
|
-
const
|
|
991
|
+
const Wt = {
|
|
917
992
|
getScrollState() {
|
|
918
993
|
return {
|
|
919
994
|
scrollTop: window.scrollY ?? document.documentElement.scrollTop,
|
|
@@ -924,14 +999,14 @@ const $t = {
|
|
|
924
999
|
setScroll(e, t, n) {
|
|
925
1000
|
window.scrollTo(n, t);
|
|
926
1001
|
}
|
|
927
|
-
},
|
|
1002
|
+
}, jt = {
|
|
928
1003
|
get value() {
|
|
929
1004
|
return typeof document < "u" ? document.documentElement : null;
|
|
930
1005
|
}
|
|
931
1006
|
};
|
|
932
|
-
function
|
|
933
|
-
const n =
|
|
934
|
-
|
|
1007
|
+
function Jt(e, t) {
|
|
1008
|
+
const n = V(!1), s = _e(
|
|
1009
|
+
jt,
|
|
935
1010
|
t ?? {},
|
|
936
1011
|
() => {
|
|
937
1012
|
if (e.state.value !== "dragging") return null;
|
|
@@ -941,9 +1016,9 @@ function Vt(e, t) {
|
|
|
941
1016
|
y: a.y + l.height / 2
|
|
942
1017
|
} : a : null;
|
|
943
1018
|
},
|
|
944
|
-
|
|
1019
|
+
Wt,
|
|
945
1020
|
n
|
|
946
|
-
), r =
|
|
1021
|
+
), r = J(
|
|
947
1022
|
() => e.state.value,
|
|
948
1023
|
(a) => {
|
|
949
1024
|
a === "dragging" ? s.run() : s.stop();
|
|
@@ -951,31 +1026,31 @@ function Vt(e, t) {
|
|
|
951
1026
|
), i = () => {
|
|
952
1027
|
r(), s.stop();
|
|
953
1028
|
};
|
|
954
|
-
return
|
|
1029
|
+
return Ke(i), { isScrolling: n, stop: i };
|
|
955
1030
|
}
|
|
956
|
-
const
|
|
957
|
-
const t =
|
|
1031
|
+
const Qt = (e) => {
|
|
1032
|
+
const t = Ht(e), n = se.keyDown(e), o = se.keyUp(e), s = se.clear(e), r = Ut(e);
|
|
958
1033
|
let i = null;
|
|
959
|
-
|
|
1034
|
+
J(
|
|
960
1035
|
e.autoScrollViewport,
|
|
961
1036
|
(a) => {
|
|
962
|
-
i?.(), i = null, (a === !0 || a && typeof a == "object") && (i =
|
|
1037
|
+
i?.(), i = null, (a === !0 || a && typeof a == "object") && (i = Jt(
|
|
963
1038
|
e,
|
|
964
1039
|
a === !0 ? {} : a
|
|
965
1040
|
).stop);
|
|
966
1041
|
},
|
|
967
1042
|
{ immediate: !0 }
|
|
968
|
-
),
|
|
1043
|
+
), N(() => {
|
|
969
1044
|
document.addEventListener("pointerdown", t.pointerDown), document.addEventListener("keydown", n), document.addEventListener("keyup", o), document.addEventListener("blur", s), document.addEventListener("scroll", r, !0);
|
|
970
|
-
}),
|
|
1045
|
+
}), Y(() => {
|
|
971
1046
|
document.removeEventListener("pointerdown", t.pointerDown), document.removeEventListener("pointerup", t.pointerUp), document.removeEventListener("pointermove", t.pointerMove), document.removeEventListener("keydown", n), document.removeEventListener("keyup", o), document.removeEventListener("blur", s), document.removeEventListener("scroll", r, !0), i?.(), t.cleanup();
|
|
972
1047
|
});
|
|
973
|
-
},
|
|
974
|
-
const e =
|
|
1048
|
+
}, Q = () => {
|
|
1049
|
+
const e = Ce(fe);
|
|
975
1050
|
if (!e) throw Error("DnD provider not found");
|
|
976
1051
|
return e;
|
|
977
|
-
},
|
|
978
|
-
const e =
|
|
1052
|
+
}, Ge = () => {
|
|
1053
|
+
const e = Q();
|
|
979
1054
|
return {
|
|
980
1055
|
overlay: e.overlay,
|
|
981
1056
|
delay: e.delay,
|
|
@@ -987,85 +1062,94 @@ const qt = (e) => {
|
|
|
987
1062
|
keyboard: e.keyboard,
|
|
988
1063
|
hovered: e.hovered,
|
|
989
1064
|
collision: e.collision,
|
|
990
|
-
autoScrollViewport: e.autoScrollViewport
|
|
991
|
-
teleportTo: e.teleportTo
|
|
1065
|
+
autoScrollViewport: e.autoScrollViewport
|
|
992
1066
|
};
|
|
993
|
-
},
|
|
1067
|
+
}, en = /* @__PURE__ */ Le({
|
|
994
1068
|
__name: "DefaultOverlay",
|
|
995
1069
|
setup(e) {
|
|
996
|
-
const { entities: t, state: n, overlay: o } =
|
|
997
|
-
return (s, r) =>
|
|
1070
|
+
const { entities: t, state: n, overlay: o } = Ge();
|
|
1071
|
+
return (s, r) => x(n) === "dragging" ? (C(), $("div", {
|
|
998
1072
|
key: 0,
|
|
999
1073
|
class: "dnd-kit-default-overlay",
|
|
1000
|
-
style:
|
|
1001
|
-
"--position-x":
|
|
1002
|
-
"--position-y":
|
|
1074
|
+
style: ye({
|
|
1075
|
+
"--position-x": x(o).position.value.x + "px",
|
|
1076
|
+
"--position-y": x(o).position.value.y + "px"
|
|
1003
1077
|
})
|
|
1004
1078
|
}, [
|
|
1005
|
-
(
|
|
1006
|
-
|
|
1079
|
+
(C(!0), $(ie, null, He(x(t).draggingMap, ([i, a]) => (C(), $(ie, null, [
|
|
1080
|
+
x(t).draggableMap.get(i)?.render ? (C(), q(re(x(t).draggableMap.get(i)?.render), { key: 0 })) : (C(), q(re(i.tagName), {
|
|
1007
1081
|
key: 1,
|
|
1008
1082
|
innerHTML: a.initialOuterHTML,
|
|
1009
|
-
style:
|
|
1083
|
+
style: ye({
|
|
1010
1084
|
width: a.initialRect.width + "px",
|
|
1011
1085
|
height: a.initialRect.height + "px"
|
|
1012
1086
|
})
|
|
1013
1087
|
}, null, 8, ["innerHTML", "style"]))
|
|
1014
1088
|
], 64))), 256))
|
|
1015
|
-
], 4)) :
|
|
1089
|
+
], 4)) : Ne("", !0);
|
|
1016
1090
|
}
|
|
1017
|
-
}),
|
|
1091
|
+
}), nn = /* @__PURE__ */ Le({
|
|
1018
1092
|
__name: "DnDProvider",
|
|
1019
1093
|
props: {
|
|
1020
1094
|
autoScrollViewport: { type: [Object, Boolean, null] },
|
|
1021
1095
|
overlayTo: { type: [String, Boolean, null] }
|
|
1022
1096
|
},
|
|
1023
1097
|
setup(e) {
|
|
1024
|
-
const t = e, n =
|
|
1025
|
-
|
|
1026
|
-
const s =
|
|
1027
|
-
() => o.overlay.render.value ??
|
|
1098
|
+
const t = e, n = Ye("overlayRef"), o = ut(n, t);
|
|
1099
|
+
Qt(o);
|
|
1100
|
+
const s = m(
|
|
1101
|
+
() => o.overlay.render.value ?? en
|
|
1028
1102
|
);
|
|
1029
|
-
return
|
|
1030
|
-
|
|
1031
|
-
(
|
|
1032
|
-
|
|
1103
|
+
return Xe(fe, o), (r, i) => (C(), $(ie, null, [
|
|
1104
|
+
me(r.$slots, "default"),
|
|
1105
|
+
be("pre", null, Ze(x(o).hovered), 1),
|
|
1106
|
+
(C(), q(Ue, {
|
|
1107
|
+
to: x(o).overlay.to.value || "body"
|
|
1033
1108
|
}, [
|
|
1034
|
-
|
|
1109
|
+
be("div", {
|
|
1035
1110
|
ref_key: "overlayRef",
|
|
1036
1111
|
ref: n,
|
|
1037
1112
|
class: "dnd-kit-overlay-container"
|
|
1038
1113
|
}, [
|
|
1039
|
-
|
|
1040
|
-
(
|
|
1114
|
+
me(r.$slots, "overlay", { overlay: s.value }, () => [
|
|
1115
|
+
(C(), q(re(s.value)))
|
|
1041
1116
|
])
|
|
1042
1117
|
], 512)
|
|
1043
1118
|
], 8, ["to"]))
|
|
1044
1119
|
], 64));
|
|
1045
1120
|
}
|
|
1046
1121
|
});
|
|
1047
|
-
function
|
|
1048
|
-
const o =
|
|
1122
|
+
function on(e, t, n) {
|
|
1123
|
+
const o = Q();
|
|
1049
1124
|
let s, r, i;
|
|
1050
1125
|
typeof t == "function" ? (s = {}, r = t) : (s = t ?? {}, r = n);
|
|
1051
|
-
const a =
|
|
1126
|
+
const a = m({
|
|
1052
1127
|
get() {
|
|
1053
|
-
const
|
|
1054
|
-
return
|
|
1128
|
+
const c = p(e);
|
|
1129
|
+
return c ? o.entities.selectedSet.has(c) : !1;
|
|
1055
1130
|
},
|
|
1056
|
-
set(
|
|
1057
|
-
const g =
|
|
1058
|
-
g && o.entities.selectedSet[
|
|
1131
|
+
set(c) {
|
|
1132
|
+
const g = p(e);
|
|
1133
|
+
g && o.entities.selectedSet[c ? "add" : "delete"](g);
|
|
1059
1134
|
}
|
|
1060
|
-
}), l =
|
|
1061
|
-
const
|
|
1062
|
-
return
|
|
1063
|
-
}),
|
|
1064
|
-
const
|
|
1065
|
-
return
|
|
1135
|
+
}), l = m(() => {
|
|
1136
|
+
const c = p(e);
|
|
1137
|
+
return c ? o.entities.draggingMap.has(c) : !1;
|
|
1138
|
+
}), u = m(() => {
|
|
1139
|
+
const c = p(e);
|
|
1140
|
+
return c ? o.entities.allowedDraggableSet.has(c) : !1;
|
|
1141
|
+
}), d = m(() => {
|
|
1142
|
+
const c = p(e);
|
|
1143
|
+
return c ? o.hovered.draggable.get(c) : {
|
|
1144
|
+
bottom: !1,
|
|
1145
|
+
left: !1,
|
|
1146
|
+
right: !1,
|
|
1147
|
+
top: !1,
|
|
1148
|
+
center: !1
|
|
1149
|
+
};
|
|
1066
1150
|
});
|
|
1067
|
-
return
|
|
1068
|
-
i =
|
|
1151
|
+
return N(() => {
|
|
1152
|
+
i = p(e), i && (i.addEventListener("dragstart", D), i.addEventListener("drag", D), i.addEventListener("dragend", D), i.setAttribute(L.DRAGGABLE, ""), o.lib.draggableObserver.observe(i), o.entities.draggableMap.set(i, {
|
|
1069
1153
|
render: s.render,
|
|
1070
1154
|
disabled: s.disabled ?? !1,
|
|
1071
1155
|
groups: s.groups ?? [],
|
|
@@ -1076,19 +1160,20 @@ function Qt(e, t, n) {
|
|
|
1076
1160
|
activation: s.activation,
|
|
1077
1161
|
placementMargins: s.placementMargins
|
|
1078
1162
|
}));
|
|
1079
|
-
}),
|
|
1163
|
+
}), Y(() => {
|
|
1080
1164
|
i && (o.lib.draggableObserver.unobserve(i), o.entities.visibleDraggableSet.delete(i), o.entities.draggableMap.delete(i), o.entities.modifiersDraggableSet.delete(i));
|
|
1081
1165
|
}), {
|
|
1082
1166
|
selected: a,
|
|
1083
1167
|
isDragging: l,
|
|
1084
|
-
isAllowed:
|
|
1168
|
+
isAllowed: u,
|
|
1169
|
+
isDragOver: d
|
|
1085
1170
|
};
|
|
1086
1171
|
}
|
|
1087
|
-
const
|
|
1088
|
-
const n =
|
|
1172
|
+
const sn = (e, t) => {
|
|
1173
|
+
const n = Q(), o = m(() => e.value === n.entities.selectingArea);
|
|
1089
1174
|
let s = null;
|
|
1090
|
-
|
|
1091
|
-
s =
|
|
1175
|
+
N(() => {
|
|
1176
|
+
s = p(e), s && (s.setAttribute(L.SELECT_AREA, ""), n.lib.selectableAreaObserver.observe(s), n.entities.selectableAreaMap.set(s, {
|
|
1092
1177
|
modifier: t?.modifier ?? {
|
|
1093
1178
|
keys: ["ControlLeft"],
|
|
1094
1179
|
method: "every"
|
|
@@ -1097,55 +1182,65 @@ const en = (e, t) => {
|
|
|
1097
1182
|
disabled: t?.disabled ?? !1,
|
|
1098
1183
|
groups: t?.groups ?? []
|
|
1099
1184
|
}));
|
|
1100
|
-
}),
|
|
1185
|
+
}), Y(() => {
|
|
1101
1186
|
s && (n.lib.selectableAreaObserver.unobserve(s), n.entities.visibleSelectableAreaSet.delete(s), n.entities.modifiersSelectableAreaSet.delete(s), n.entities.selectableAreaMap.delete(s));
|
|
1102
1187
|
});
|
|
1103
|
-
const r =
|
|
1188
|
+
const r = m(() => {
|
|
1104
1189
|
n.scrollPosition.x, n.scrollPosition.y;
|
|
1105
1190
|
const i = n.pointer.value;
|
|
1106
|
-
return !i || n.state.value !== "selecting" || !s ? {} :
|
|
1191
|
+
return !i || n.state.value !== "selecting" || !s ? {} : ht(i.start, i.current, s);
|
|
1107
1192
|
});
|
|
1108
1193
|
return {
|
|
1109
1194
|
isSelecting: o,
|
|
1110
1195
|
style: r
|
|
1111
1196
|
};
|
|
1112
1197
|
};
|
|
1113
|
-
function
|
|
1114
|
-
const n =
|
|
1198
|
+
function rn(e, t) {
|
|
1199
|
+
const n = Ce(fe);
|
|
1115
1200
|
if (!n) throw Error("DnD provider not found");
|
|
1116
1201
|
let o = null;
|
|
1117
|
-
return
|
|
1118
|
-
o =
|
|
1202
|
+
return N(() => {
|
|
1203
|
+
o = p(e), o && (o.setAttribute(L.CONSTRAINT_AREA, ""), n.entities.constraintsAreaMap.set(o, {
|
|
1119
1204
|
axis: t?.axis || "both",
|
|
1120
1205
|
restrictToArea: t?.restrictToArea || !1
|
|
1121
1206
|
}));
|
|
1122
|
-
}),
|
|
1207
|
+
}), Y(() => {
|
|
1123
1208
|
o && n.entities.constraintsAreaMap.delete(o);
|
|
1124
1209
|
}), {};
|
|
1125
1210
|
}
|
|
1126
|
-
function
|
|
1127
|
-
const o =
|
|
1211
|
+
function an(e, t, n) {
|
|
1212
|
+
const o = Q();
|
|
1128
1213
|
let s = null, r, i;
|
|
1129
1214
|
typeof t == "function" ? (r = {}, i = t) : (r = t ?? {}, i = n);
|
|
1130
|
-
const a =
|
|
1131
|
-
const
|
|
1132
|
-
return
|
|
1215
|
+
const a = m(() => {
|
|
1216
|
+
const u = p(e);
|
|
1217
|
+
return u ? o.entities.allowedDroppableSet.has(u) : !1;
|
|
1218
|
+
}), l = m(() => {
|
|
1219
|
+
const u = p(e);
|
|
1220
|
+
return u ? o.hovered.droppable.get(u) : {
|
|
1221
|
+
bottom: !1,
|
|
1222
|
+
left: !1,
|
|
1223
|
+
right: !1,
|
|
1224
|
+
top: !1,
|
|
1225
|
+
center: !1
|
|
1226
|
+
};
|
|
1133
1227
|
});
|
|
1134
|
-
return
|
|
1135
|
-
s =
|
|
1228
|
+
return N(() => {
|
|
1229
|
+
s = p(e), s && (s.setAttribute(L.DROPPABLE, ""), o.lib.droppableObserver.observe(s), o.entities.droppableMap.set(s, {
|
|
1136
1230
|
disabled: r.disabled ?? !1,
|
|
1137
1231
|
groups: r.groups ?? [],
|
|
1138
1232
|
events: r.events,
|
|
1139
1233
|
payload: i
|
|
1140
1234
|
}));
|
|
1141
|
-
}),
|
|
1235
|
+
}), Y(() => {
|
|
1142
1236
|
s && (o.lib.droppableObserver.unobserve(s), o.entities.visibleDroppableSet.delete(s), o.entities.droppableMap.delete(s));
|
|
1143
1237
|
}), {
|
|
1144
|
-
isAllowed: a
|
|
1238
|
+
isAllowed: a,
|
|
1239
|
+
isDragOver: l
|
|
1145
1240
|
};
|
|
1146
1241
|
}
|
|
1147
|
-
const
|
|
1148
|
-
const n =
|
|
1242
|
+
const ln = (e, t) => {
|
|
1243
|
+
const n = Ge(), o = V(!1), r = _e(
|
|
1149
1244
|
e,
|
|
1150
1245
|
t ?? {},
|
|
1151
1246
|
() => {
|
|
@@ -1159,33 +1254,35 @@ const on = (e, t) => {
|
|
|
1159
1254
|
void 0,
|
|
1160
1255
|
o
|
|
1161
1256
|
);
|
|
1162
|
-
return
|
|
1257
|
+
return J(
|
|
1163
1258
|
() => n.state.value,
|
|
1164
1259
|
(i) => {
|
|
1165
1260
|
i === "dragging" ? r.run() : r.stop();
|
|
1166
1261
|
}
|
|
1167
1262
|
), { isScrolling: o };
|
|
1168
1263
|
};
|
|
1169
|
-
function
|
|
1264
|
+
function xe(e, t) {
|
|
1170
1265
|
return t <= 0 ? e : Math.round(e / t) * t;
|
|
1171
1266
|
}
|
|
1172
|
-
function
|
|
1267
|
+
function cn(e, t) {
|
|
1173
1268
|
const n = t && "grid" in t && t.grid != null, o = t ? n ? t.grid : t.gridX : 1, s = t ? n ? t.grid : t.gridY : 1;
|
|
1174
|
-
return
|
|
1269
|
+
return m(() => {
|
|
1175
1270
|
const { x: r, y: i } = e.value;
|
|
1176
1271
|
return {
|
|
1177
|
-
x:
|
|
1178
|
-
y:
|
|
1272
|
+
x: xe(r, o),
|
|
1273
|
+
y: xe(i, s)
|
|
1179
1274
|
};
|
|
1180
1275
|
});
|
|
1181
1276
|
}
|
|
1182
1277
|
export {
|
|
1183
|
-
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1278
|
+
nn as DnDProvider,
|
|
1279
|
+
Rt as createSensor,
|
|
1280
|
+
ge as defaultCollisionDetection,
|
|
1281
|
+
ln as makeAutoScroll,
|
|
1282
|
+
rn as makeConstraintArea,
|
|
1283
|
+
on as makeDraggable,
|
|
1284
|
+
an as makeDroppable,
|
|
1285
|
+
sn as makeSelectionArea,
|
|
1286
|
+
cn as makeSnappedOverlayPosition,
|
|
1287
|
+
Ge as useDnDProvider
|
|
1191
1288
|
};
|