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