@vue-dnd-kit/core 2.4.6 → 3.0.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/LICENSE +21 -0
  2. package/dist/devtools.cjs +2 -0
  3. package/dist/devtools.cjs.map +1 -0
  4. package/dist/devtools.d.cts +610 -0
  5. package/dist/devtools.d.ts +610 -0
  6. package/dist/devtools.js +569 -0
  7. package/dist/devtools.js.map +1 -0
  8. package/dist/index.cjs +12 -0
  9. package/dist/index.cjs.map +1 -0
  10. package/dist/index.d.cts +2425 -0
  11. package/dist/index.d.ts +2425 -2
  12. package/dist/index.js +5865 -0
  13. package/dist/index.js.map +1 -0
  14. package/package.json +59 -29
  15. package/dist/external/components/DnDProvider.vue.d.ts +0 -25
  16. package/dist/external/components/DragPreview.vue.d.ts +0 -89
  17. package/dist/external/composables/makeAutoScroll.d.ts +0 -14
  18. package/dist/external/composables/makeConstraintArea.d.ts +0 -7
  19. package/dist/external/composables/makeDraggable.d.ts +0 -24
  20. package/dist/external/composables/makeDroppable.d.ts +0 -21
  21. package/dist/external/composables/makeSelectionArea.d.ts +0 -15
  22. package/dist/external/composables/useDnDProvider.d.ts +0 -2
  23. package/dist/external/env.d.ts +0 -7
  24. package/dist/external/index.d.ts +0 -11
  25. package/dist/external/types/entities.d.ts +0 -208
  26. package/dist/external/types/index.d.ts +0 -5
  27. package/dist/external/types/operations.d.ts +0 -187
  28. package/dist/external/types/placement.d.ts +0 -34
  29. package/dist/external/types/pointer.d.ts +0 -10
  30. package/dist/external/types/provider.d.ts +0 -89
  31. package/dist/internal/composables/useDnDProviderEvents.d.ts +0 -2
  32. package/dist/internal/composables/useDnDProviderInternal.d.ts +0 -2
  33. package/dist/internal/composables/useDnDProviderState.d.ts +0 -4
  34. package/dist/internal/composables/useViewportAutoScroll.d.ts +0 -9
  35. package/dist/internal/logic/hover.d.ts +0 -6
  36. package/dist/internal/logic/keyboard.d.ts +0 -6
  37. package/dist/internal/logic/operations.d.ts +0 -35
  38. package/dist/internal/logic/payload.d.ts +0 -5
  39. package/dist/internal/logic/pointer.d.ts +0 -11
  40. package/dist/internal/logic/scroll.d.ts +0 -2
  41. package/dist/internal/sensors/default-collision.d.ts +0 -18
  42. package/dist/internal/sensors/index.d.ts +0 -2
  43. package/dist/internal/sensors/sensor.d.ts +0 -68
  44. package/dist/internal/sensors/steps.d.ts +0 -46
  45. package/dist/internal/types/auto-scroll.d.ts +0 -20
  46. package/dist/internal/types/observer.d.ts +0 -11
  47. package/dist/internal/types/provider.d.ts +0 -31
  48. package/dist/internal/utils/auto-scroll.d.ts +0 -13
  49. package/dist/internal/utils/constraints.d.ts +0 -43
  50. package/dist/internal/utils/disabled.d.ts +0 -9
  51. package/dist/internal/utils/dom.d.ts +0 -44
  52. package/dist/internal/utils/drag-activation.d.ts +0 -29
  53. package/dist/internal/utils/events.d.ts +0 -22
  54. package/dist/internal/utils/geometry.d.ts +0 -23
  55. package/dist/internal/utils/groups.d.ts +0 -23
  56. package/dist/internal/utils/hover.d.ts +0 -15
  57. package/dist/internal/utils/keyboard.d.ts +0 -5
  58. package/dist/internal/utils/namespaces.d.ts +0 -18
  59. package/dist/internal/utils/observer.d.ts +0 -15
  60. package/dist/internal/utils/placement.d.ts +0 -22
  61. package/dist/internal/utils/pointer.d.ts +0 -33
  62. package/dist/internal/utils/provider.d.ts +0 -12
  63. package/dist/internal/utils/selection.d.ts +0 -36
  64. package/dist/internal/utils/session.d.ts +0 -5
  65. package/dist/vite.svg +0 -1
  66. package/dist/vue-dnd-kit-core.cjs.js +0 -2
  67. package/dist/vue-dnd-kit-core.es.js +0 -1524
@@ -1,1524 +0,0 @@
1
- (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".dnd-kit-preview{transform-origin:0 0;will-change:transform}.dnd-kit-preview-container{position:fixed;top:0;left:0;pointer-events:none;cursor:grabbing;z-index:9999}")),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}})();
2
- import { shallowRef as V, ref as q, reactive as $, computed as b, watch as ne, onScopeDispose as Je, onMounted as Y, onBeforeUnmount as Z, inject as Be, defineComponent as Oe, useTemplateRef as Fe, unref as j, openBlock as L, createElementBlock as W, normalizeStyle as Ce, renderSlot as me, Fragment as he, renderList as Qe, createBlock as Q, resolveDynamicComponent as be, createCommentVNode as et, provide as tt, Teleport as nt, createElementVNode as st, mergeProps as it } from "vue";
3
- const I = {
4
- SELECT_AREA: "data-dnd-kit-select-area",
5
- DRAGGABLE: "data-dnd-kit-draggable",
6
- DROPPABLE: "data-dnd-kit-droppable",
7
- CONSTRAINT_AREA: "data-dnd-kit-constraint-area"
8
- }, G = {
9
- SELECT_AREA: `[${I.SELECT_AREA}]`,
10
- DRAGGABLE: `[${I.DRAGGABLE}]`,
11
- CONSTRAINT_AREA: `[${I.CONSTRAINT_AREA}]`
12
- }, xe = "VueDnDKitProvider", Ie = (e, t, n, s) => {
13
- const i = /* @__PURE__ */ new Set();
14
- return t.forEach((r) => {
15
- const a = e.get(r), o = s ? s(r) : a?.disabled;
16
- if (!a || o) return;
17
- const l = a.modifier?.keys, c = a.modifier?.method;
18
- if (!l || !c || l.length === 0) {
19
- i.add(r);
20
- return;
21
- }
22
- l[c]((g) => n.value.has(g)) && i.add(r);
23
- }), i;
24
- };
25
- let ze = "", at = "", ot = "";
26
- const S = (e) => e.value ? e.value instanceof HTMLElement ? e.value : e.value.$el : null, H = (e, t) => e !== t && e.contains(t), rt = (e, t) => !(e.right < t.left || e.left > t.right || e.bottom < t.top || e.top > t.bottom), pe = () => {
27
- const e = document.body;
28
- ze = e.style.userSelect, e.style.userSelect = "none", window.addEventListener("contextmenu", M), window.addEventListener("selectstart", M), window.addEventListener("touchstart", M), window.addEventListener("touchmove", M);
29
- }, ye = () => {
30
- const e = document.body;
31
- e.style.userSelect = ze, e.style.touchAction = at, e.style.overscrollBehavior = ot, window.removeEventListener("contextmenu", M), window.removeEventListener("selectstart", M), window.removeEventListener("touchstart", M), window.removeEventListener("touchmove", M);
32
- }, M = (e) => e.preventDefault(), Ee = (e, t) => {
33
- if (t.entities.draggableMap.get(e)?.disabled) return !0;
34
- for (const s of t.entities.visibleDraggableSet)
35
- if (t.entities.draggableMap.get(s)?.disabled && H(s, e)) return !0;
36
- return !1;
37
- }, K = (e, t) => {
38
- if (t.entities.droppableMap.get(e)?.disabled) return !0;
39
- for (const s of t.entities.visibleDroppableSet)
40
- if (t.entities.droppableMap.get(s)?.disabled && H(s, e)) return !0;
41
- return !1;
42
- }, se = (e, t) => {
43
- if (!e.length || !t.length) return !0;
44
- const n = new Set(t);
45
- return e.some((s) => n.has(s));
46
- };
47
- function lt(e, t, n, s) {
48
- const i = [];
49
- for (const a of t.keys()) {
50
- const o = n.get(a);
51
- i.push({ groups: o?.groups ?? [] });
52
- }
53
- const r = /* @__PURE__ */ new Set();
54
- for (const a of e) {
55
- const o = s.get(a), l = o?.groups ?? [], c = o?.groupMatch ?? "every";
56
- (!i.length || i[c]((g) => se(g.groups, l))) && r.add(a);
57
- }
58
- return r;
59
- }
60
- function ct(e, t, n) {
61
- const s = /* @__PURE__ */ new Set();
62
- for (const a of t.keys()) {
63
- const o = n.get(a);
64
- for (const l of o?.groups ?? []) s.add(l);
65
- }
66
- const i = [...s], r = /* @__PURE__ */ new Set();
67
- for (const a of e) {
68
- const l = n.get(a)?.groups ?? [];
69
- se(i, l) && r.add(a);
70
- }
71
- return r;
72
- }
73
- const re = (e) => {
74
- if (typeof IntersectionObserver > "u")
75
- return { observe: () => {
76
- }, unobserve: () => {
77
- }, disconnect: () => {
78
- } };
79
- const t = new IntersectionObserver((n) => {
80
- n.forEach((s) => {
81
- const i = s.target;
82
- e[s.isIntersecting ? "add" : "delete"](i);
83
- });
84
- });
85
- return {
86
- observe: (n) => t.observe(n),
87
- unobserve: (n) => t.unobserve(n),
88
- disconnect: () => t.disconnect()
89
- };
90
- };
91
- function De(e, t = 0, n = 0) {
92
- return {
93
- start: { x: e.clientX, y: e.clientY },
94
- current: { x: e.clientX, y: e.clientY },
95
- offset: { x: t, y: n }
96
- };
97
- }
98
- function _e(e, t) {
99
- const n = t.getBoundingClientRect(), s = n.width > 0 ? (e.clientX - n.left) / n.width : 0.5, i = n.height > 0 ? (e.clientY - n.top) / n.height : 0.5;
100
- return { x: s, y: i };
101
- }
102
- function Ge(e, t) {
103
- return {
104
- ...t,
105
- initialHTML: e.innerHTML,
106
- initialRect: e.getBoundingClientRect(),
107
- initialOuterHTML: e.outerHTML
108
- };
109
- }
110
- function gt(e, t, n) {
111
- e.forEach((s) => {
112
- const i = t.get(s);
113
- n.set(s, Ge(s, i));
114
- }), e.clear();
115
- }
116
- function ut(e, t, n) {
117
- n.clear();
118
- const s = t.get(e);
119
- n.set(e, Ge(e, s));
120
- }
121
- function ee(e) {
122
- e.entities.initiatingDraggable && (e.state.value = "dragging", ft(
123
- e.entities.initiatingDraggable,
124
- e.entities.selectedSet,
125
- e.entities.draggableMap,
126
- e.entities.draggingMap
127
- ));
128
- }
129
- function ft(e, t, n, s) {
130
- t.has(e) ? gt(t, n, s) : (t.clear(), ut(e, n, s));
131
- }
132
- function He(e, t, n, s) {
133
- if (s || !n) return !0;
134
- const i = e.closest(n);
135
- return i ? t.contains(i) : !1;
136
- }
137
- function dt(e, t) {
138
- if (!e || !t) return 1;
139
- const n = Math.abs(e.current.x - e.start.x), s = Math.abs(e.current.y - e.start.y);
140
- if (typeof t == "number") {
141
- const c = Math.sqrt(n * n + s * s);
142
- return Math.min(c / t, 1);
143
- }
144
- const {
145
- x: i = 0,
146
- y: r = 0,
147
- condition: a = "any"
148
- } = t;
149
- if (i === 0 && r === 0) return 1;
150
- const o = i > 0 ? Math.min(n / i, 1) : 1, l = r > 0 ? Math.min(s / r, 1) : 1;
151
- return a === "both" ? Math.min(o, l) : Math.max(o, l);
152
- }
153
- function Ke(e, t, n) {
154
- if (!n) return !0;
155
- const s = n.distance != null, i = n.delay != null;
156
- return !s && !i ? !0 : s && !i ? e >= 1 : !s && i ? t >= 1 : (n.condition ?? "both") === "both" ? e >= 1 && t >= 1 : e >= 1 || t >= 1;
157
- }
158
- function mt(e) {
159
- if (e.state.value !== "activating" || !e.entities.initiatingDraggable)
160
- return !1;
161
- const t = e.entities.draggableMap.get(
162
- e.entities.initiatingDraggable
163
- );
164
- return Ke(
165
- e.distanceProgress.value,
166
- e.delay.progress,
167
- t?.activation
168
- ) ? (ee(e), !0) : !1;
169
- }
170
- function ht(e, t) {
171
- let n = null;
172
- const s = () => {
173
- if (e.state.value !== "activating" || !e.entities.initiatingDraggable) {
174
- n = null;
175
- return;
176
- }
177
- const i = e.entities.draggableMap.get(
178
- e.entities.initiatingDraggable
179
- ), r = i?.activation?.delay;
180
- if (!r) {
181
- n = null;
182
- return;
183
- }
184
- e.delay.progress = Math.min(
185
- (Date.now() - e.delay.startTime) / (r * 1e3),
186
- 1
187
- ), Ke(
188
- e.distanceProgress.value,
189
- e.delay.progress,
190
- i?.activation
191
- ) ? (t(), n = null) : n = requestAnimationFrame(s);
192
- };
193
- return n = requestAnimationFrame(s), {
194
- cancel: () => {
195
- n !== null && (cancelAnimationFrame(n), n = null);
196
- }
197
- };
198
- }
199
- function bt(e, t) {
200
- const n = e.closest(
201
- G.CONSTRAINT_AREA
202
- );
203
- return !n || !t.has(n) ? null : {
204
- element: n,
205
- entity: t.get(n)
206
- };
207
- }
208
- function pt(e, t, n, s) {
209
- return n === "x" ? { x: e, y: s.top } : n === "y" ? { x: s.left, y: t } : { x: e, y: t };
210
- }
211
- function yt(e, t, n, s, i) {
212
- let r = e, a = t;
213
- return n !== "y" && (r = Math.max(
214
- s.left,
215
- Math.min(s.right - i.width, e)
216
- )), n !== "x" && (a = Math.max(
217
- s.top,
218
- Math.min(s.bottom - i.height, t)
219
- )), { x: r, y: a };
220
- }
221
- function Dt(e, t, n, s) {
222
- if (!e)
223
- return { x: 0, y: 0 };
224
- const i = t?.width ?? 0, r = t?.height ?? 0;
225
- let a = e.current.x - i * e.offset.x, o = e.current.y - r * e.offset.y;
226
- if (!n)
227
- return { x: a, y: o };
228
- const l = bt(n, s);
229
- if (!l)
230
- return { x: a, y: o };
231
- const { element: c, entity: u } = l, g = c.getBoundingClientRect(), f = n.getBoundingClientRect(), d = pt(
232
- a,
233
- o,
234
- u.axis || "both",
235
- f
236
- );
237
- return u.restrictToArea ? yt(
238
- d.x,
239
- d.y,
240
- u.axis || "both",
241
- g,
242
- t ?? { width: 0, height: 0 }
243
- ) : d;
244
- }
245
- const X = {
246
- forDrag: ["Enter", "Space"],
247
- forCancel: ["Escape"],
248
- forDrop: ["Enter", "Space"],
249
- forMove: [
250
- "ArrowUp",
251
- "ArrowDown",
252
- "ArrowLeft",
253
- "ArrowRight",
254
- "KeyW",
255
- "KeyA",
256
- "KeyS",
257
- "KeyD"
258
- ],
259
- forMoveFaster: ["ShiftLeft", "ShiftRight"]
260
- };
261
- function wt(e, t) {
262
- const n = V(), s = q(), r = {
263
- keys: {
264
- pressedKeys: q(/* @__PURE__ */ new Set()),
265
- forDrag: [...X.forDrag],
266
- forCancel: [...X.forCancel],
267
- forDrop: [...X.forDrop],
268
- forMove: [...X.forMove],
269
- forMoveFaster: [...X.forMoveFaster]
270
- },
271
- step: 8,
272
- moveFaster: 4
273
- }, a = $({
274
- draggableMap: /* @__PURE__ */ new Map(),
275
- droppableMap: /* @__PURE__ */ new Map(),
276
- selectableAreaMap: /* @__PURE__ */ new Map(),
277
- constraintsAreaMap: /* @__PURE__ */ new Map(),
278
- initiatingDraggable: void 0,
279
- selectingArea: void 0,
280
- draggingMap: /* @__PURE__ */ new Map(),
281
- selectedSet: /* @__PURE__ */ new Set(),
282
- selectionBase: /* @__PURE__ */ new Set(),
283
- allowedDroppableSet: b(() => n.value ? lt(
284
- a.visibleDroppableSet,
285
- a.draggingMap,
286
- a.draggableMap,
287
- a.droppableMap
288
- ) : /* @__PURE__ */ new Set()),
289
- allowedDraggableSet: b(() => n.value ? ct(
290
- a.visibleDraggableSet,
291
- a.draggingMap,
292
- a.draggableMap
293
- ) : /* @__PURE__ */ new Set()),
294
- modifiersSelectableAreaSet: b(() => Ie(
295
- a.selectableAreaMap,
296
- a.visibleSelectableAreaSet,
297
- r.keys.pressedKeys
298
- )),
299
- modifiersDraggableSet: b(() => Ie(
300
- a.draggableMap,
301
- a.visibleDraggableSet,
302
- r.keys.pressedKeys,
303
- (w) => Ee(w, { entities: a })
304
- )),
305
- visibleDraggableSet: /* @__PURE__ */ new Set(),
306
- visibleDroppableSet: /* @__PURE__ */ new Set(),
307
- visibleSelectableAreaSet: /* @__PURE__ */ new Set()
308
- }), o = $({
309
- draggable: /* @__PURE__ */ new Map(),
310
- droppable: /* @__PURE__ */ new Map()
311
- }), l = {
312
- throttle: V(0)
313
- }, c = $({
314
- x: typeof window < "u" ? window.scrollX : 0,
315
- y: typeof window < "u" ? window.scrollY : 0
316
- }), u = $({
317
- progress: 0,
318
- startTime: 0
319
- }), g = b(() => {
320
- if (!s.value || !a.initiatingDraggable) return 0;
321
- const w = a.draggableMap.get(a.initiatingDraggable)?.activation?.distance;
322
- return w ? dt(s.value, w) : 1;
323
- }), f = re(
324
- a.visibleDraggableSet
325
- ), d = re(
326
- a.visibleDroppableSet
327
- ), h = re(
328
- a.visibleSelectableAreaSet
329
- ), m = q(), y = V(typeof DOMRect < "u" ? new DOMRect() : {}), p = b(() => {
330
- c.x, c.y;
331
- const D = y.value, w = a.initiatingDraggable, T = w ? a.draggingMap.get(w) : null, P = D.width && D.height ? D : T?.initialRect ?? null;
332
- return Dt(
333
- s.value,
334
- P,
335
- w || null,
336
- a.constraintsAreaMap
337
- );
338
- }), x = b({
339
- get: () => t?.previewTo,
340
- set: (D) => x.value = D
341
- }), k = b(() => t?.autoScrollViewport);
342
- return {
343
- state: n,
344
- pointer: s,
345
- entities: a,
346
- keyboard: r,
347
- scrollPosition: c,
348
- delay: u,
349
- distanceProgress: g,
350
- hovered: o,
351
- collision: l,
352
- preview: {
353
- size: y,
354
- position: p,
355
- render: m,
356
- ref: e,
357
- to: x
358
- },
359
- lib: {
360
- draggableObserver: f,
361
- droppableObserver: d,
362
- selectableAreaObserver: h,
363
- rectCache: /* @__PURE__ */ new Map()
364
- },
365
- autoScrollViewport: k
366
- };
367
- }
368
- const te = (e) => {
369
- const t = e.hovered.draggable.keys().next().value;
370
- if (t) {
371
- const s = e.entities.draggableMap.get(t);
372
- s && (s.hoveredPlacement = void 0);
373
- }
374
- const n = e.hovered.droppable.keys().next().value;
375
- if (n) {
376
- const s = e.entities.droppableMap.get(n);
377
- s && (s.hoveredPlacement = void 0);
378
- }
379
- e.lib.rectCache.clear(), e.pointer.value = void 0, e.state.value = void 0, e.entities.selectingArea = void 0, e.entities.selectionBase.clear(), 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();
380
- };
381
- function St(e) {
382
- return e.parentElement?.closest(
383
- G.SELECT_AREA
384
- ) ?? null;
385
- }
386
- const Mt = (e, t, n) => {
387
- if (!n) return {};
388
- const s = n.getBoundingClientRect(), i = Math.max(s.left, Math.min(e.x, t.x)), r = Math.max(s.top, Math.min(e.y, t.y)), a = Math.min(s.right, Math.max(e.x, t.x)), o = Math.min(s.bottom, Math.max(e.y, t.y)), l = Math.max(0, a - i), c = Math.max(0, o - r), u = i - s.left + n.scrollLeft, g = r - s.top + n.scrollTop;
389
- return {
390
- position: "absolute",
391
- left: `${u}px`,
392
- top: `${g}px`,
393
- width: `${l}px`,
394
- height: `${c}px`,
395
- pointerEvents: "none",
396
- border: "1px solid #3b82f6",
397
- backgroundColor: "#3b82f61a"
398
- };
399
- }, Ne = (e) => {
400
- if (!e.pointer.value || !e.entities.selectingArea) return;
401
- const { selectingArea: t } = e.entities, n = vt(
402
- e.pointer.value.start,
403
- e.pointer.value.current
404
- ), s = e.entities.selectableAreaMap.get(t)?.groups ?? [], i = e.lib.rectCache;
405
- e.entities.visibleDraggableSet.forEach((r) => {
406
- if (r === t || !t.contains(r)) return;
407
- const a = St(r);
408
- if (a && a !== t) {
409
- e.entities.selectedSet.delete(r);
410
- return;
411
- }
412
- if (Ee(r, e)) {
413
- e.entities.selectedSet.delete(r);
414
- return;
415
- }
416
- const l = e.entities.draggableMap.get(r)?.groups ?? [];
417
- if (!se(s, l)) {
418
- e.entities.selectedSet.delete(r);
419
- return;
420
- }
421
- let c = i.get(r);
422
- c || (c = r.getBoundingClientRect(), i.set(r, c));
423
- const u = e.entities.selectionBase.has(r), g = rt(n, c);
424
- switch (e.entities.selectableAreaMap.get(t)?.strategy) {
425
- case "toggle":
426
- e.entities.selectedSet[g !== u ? "add" : "delete"](
427
- r
428
- );
429
- break;
430
- case "select":
431
- e.entities.selectedSet[g ? "add" : "delete"](r);
432
- break;
433
- }
434
- });
435
- }, vt = (e, t) => {
436
- const n = Math.min(e.x, t.x), s = Math.min(e.y, t.y), i = Math.max(e.x, t.x), r = Math.max(e.y, t.y), a = i - n, o = r - s;
437
- return new DOMRect(n, s, a, o);
438
- };
439
- function C(e, t, n) {
440
- const s = Math.max(0, Math.min(t, e.length));
441
- return [...e.slice(0, s), ...n, ...e.slice(s)];
442
- }
443
- function Le(e, t, n = 1) {
444
- const s = Math.max(0, Math.min(t, e.length - 1)), i = Math.max(0, Math.min(n, e.length - s));
445
- return [...e.slice(0, s), ...e.slice(s + i)];
446
- }
447
- function N(e, t) {
448
- const n = [...new Set(t)].filter((i) => i >= 0 && i < e.length).sort((i, r) => r - i);
449
- let s = e;
450
- for (const i of n) s = Le(s, i, 1);
451
- return s;
452
- }
453
- function Ye(e, t, n) {
454
- if (t === n || t < 0 || n < 0 || t >= e.length || n >= e.length)
455
- return e;
456
- const s = [...e];
457
- return [s[t], s[n]] = [s[n], s[t]], s;
458
- }
459
- const R = {
460
- getInsertSide(e, t) {
461
- return e ? t === "vertical" ? e.top && !e.bottom ? "before" : e.bottom && !e.top ? "after" : e.top ? "before" : null : e.left && !e.right ? "before" : e.right && !e.left ? "after" : e.left ? "before" : null : null;
462
- },
463
- isAtZoneStart(e, t) {
464
- return R.getInsertSide(e, t) === "before" && !e?.center;
465
- },
466
- isAtZoneEnd(e, t) {
467
- return R.getInsertSide(e, t) === "after" && !e?.center;
468
- }
469
- };
470
- function Xe(e, t) {
471
- const { draggedItems: n, dropZone: s, hoveredDraggable: i } = e;
472
- if (!n.length) return null;
473
- const r = i?.placement.center === !0 && s != null && s.items !== i.items, a = r ? s.items : i?.items ?? s?.items;
474
- if (!a) return null;
475
- const o = n[0].items, l = n.map((f) => f.index), c = a.length;
476
- let u, g;
477
- if (i && !r) {
478
- const f = i.items === o && l.includes(i.index);
479
- if (f && n.length === 1) {
480
- const d = R.isAtZoneStart(s?.placement, t);
481
- u = d ? 0 : c, g = d ? "prepend" : "append";
482
- } else {
483
- if (f)
484
- return null;
485
- {
486
- const d = R.getInsertSide(i.placement, t), h = i.index;
487
- d === "before" ? (u = Math.max(0, h), g = "insert") : d === "after" ? (u = Math.min(c, h + 1), g = "insert") : (u = c, g = "append");
488
- }
489
- }
490
- } else {
491
- if (!s) return null;
492
- const f = R.isAtZoneStart(s.placement, t);
493
- u = f ? 0 : c, g = f ? "prepend" : "append";
494
- }
495
- return { targetIndex: u, mode: g, targetArr: a };
496
- }
497
- function At(e, t = "vertical") {
498
- const { draggedItems: n } = e;
499
- if (!n.length) return null;
500
- const s = Xe(e, t);
501
- if (!s) return null;
502
- const { targetArr: i, mode: r } = s;
503
- let { targetIndex: a } = s;
504
- const o = n.map((g) => g.index), l = n.map((g) => g.item), c = n[0].items;
505
- if (c === i) {
506
- const g = o.filter((d) => d < a).length;
507
- a = Math.max(0, a - g);
508
- const f = C(N(c, o), a, l);
509
- return { sourceItems: f, targetItems: f, draggedItems: l, sourceIndexes: o, targetIndex: a, mode: r, sameList: !0 };
510
- } else {
511
- const g = N(c, o), f = C(i, a, l);
512
- return { sourceItems: g, targetItems: f, draggedItems: l, sourceIndexes: o, targetIndex: a, mode: r, sameList: !1 };
513
- }
514
- }
515
- function xt(e) {
516
- const { draggedItems: t, hoveredDraggable: n } = e;
517
- if (!t.length || !n) return null;
518
- const s = t.map((u) => u.index), i = n.index, r = t.map((u) => u.item), a = n.item, o = t[0].items, l = n.items, c = o === l;
519
- if (c && s.includes(i)) return null;
520
- if (t.length === 1) {
521
- const u = s[0];
522
- if (c) {
523
- const g = Ye(o, u, i);
524
- return { sourceItems: g, targetItems: g, sourceIndexes: s, targetIndex: i, sameList: !0 };
525
- } else {
526
- const g = [...o], f = [...l];
527
- return g[u] = l[i], f[i] = o[u], { sourceItems: g, targetItems: f, sourceIndexes: s, targetIndex: i, sameList: !1 };
528
- }
529
- } else {
530
- const u = Math.min(...s);
531
- if (c) {
532
- const g = s.filter((p) => p < i).length, f = Math.max(0, i - g), d = s.filter((p) => p < u).length, h = Math.max(0, u - d);
533
- let m = N(o, s);
534
- m = C(m, f, r);
535
- const y = h >= f ? h + r.length : h;
536
- return m = C(m, y, [a]), { sourceItems: m, targetItems: m, sourceIndexes: s, targetIndex: f, sameList: !0 };
537
- } else {
538
- const g = s.filter((m) => m < u).length, f = Math.max(0, u - g);
539
- let d = N(o, s);
540
- d = C(d, f, [a]);
541
- let h = Le(l, i);
542
- return h = C(h, i, r), { sourceItems: d, targetItems: h, sourceIndexes: s, targetIndex: i, sameList: !1 };
543
- }
544
- }
545
- }
546
- function Et(e, t = "vertical") {
547
- const { draggedItems: n } = e;
548
- if (!n.length) return null;
549
- const s = Xe(e, t);
550
- if (!s) return null;
551
- const { targetArr: i, targetIndex: r, mode: a } = s, o = n.map((c) => c.item);
552
- return { targetItems: C(i, r, o), copiedItems: o, targetIndex: r, mode: a };
553
- }
554
- function Lt(e) {
555
- const { draggedItems: t } = e;
556
- if (!t.length) return null;
557
- const n = t.map((a) => a.index), s = t.map((a) => a.item), i = t[0].items;
558
- return { sourceItems: N(i, n), removedItems: s, sourceIndexes: n };
559
- }
560
- function Ve(e) {
561
- return {
562
- // Low-level array ops
563
- insertAt: C,
564
- removeAt: Le,
565
- removeIndexes: N,
566
- swapAt: Ye,
567
- // Placement helpers
568
- getInsertSide: (t, n) => R.getInsertSide(t, n),
569
- isAtZoneStart: (t, n) => R.isAtZoneStart(t, n),
570
- isAtZoneEnd: (t, n) => R.isAtZoneEnd(t, n),
571
- // High-level (event-bound)
572
- suggestSort: (t) => At(e, t),
573
- suggestSwap: () => xt(e),
574
- suggestCopy: (t) => Et(e, t),
575
- suggestRemove: () => Lt(e)
576
- };
577
- }
578
- const O = (e) => e.keys().next().value, Ct = (e) => e.target.closest(
579
- G.DRAGGABLE
580
- );
581
- function Ze(e, t) {
582
- const n = t.entities.draggingMap.get(e);
583
- if (n) return n;
584
- const s = e.getAttribute(I.DRAGGABLE);
585
- if (s) {
586
- for (const [, i] of t.entities.draggingMap)
587
- if (i.id === s) return i;
588
- }
589
- }
590
- function It(e) {
591
- const t = e.entities.initiatingDraggable;
592
- if (!t) return [];
593
- const n = Ze(t, e) ?? e.entities.draggableMap.get(t), s = n?.payload;
594
- if (!s)
595
- return n?.data ? [{ index: -1, item: void 0, items: [], data: n.data() }] : [];
596
- const i = s();
597
- if (!Array.isArray(i) || i.length < 2) return [];
598
- const [r, a] = i, o = Number(r), l = a, c = /* @__PURE__ */ new Map();
599
- return c.set(o, {
600
- index: o,
601
- item: l[o],
602
- items: l,
603
- data: n?.data?.()
604
- }), e.entities.draggingMap.forEach((u, g) => {
605
- const f = e.entities.draggableMap.get(g), d = f?.payload;
606
- if (!d) return;
607
- const h = d();
608
- if (!Array.isArray(h) || h.length < 2) return;
609
- const [m, y] = h;
610
- if (y !== l) return;
611
- const p = Number(m);
612
- c.has(p) || c.set(p, {
613
- index: p,
614
- item: y[p],
615
- items: l,
616
- data: f?.data?.()
617
- });
618
- }), [...c.values()].sort((u, g) => u.index - g.index);
619
- }
620
- const A = (e, t) => {
621
- const n = It(e);
622
- let s, i;
623
- if (t) {
624
- const r = e.entities.droppableMap.get(t);
625
- if (r) {
626
- const l = r.payload;
627
- s = {
628
- items: l ? l() : [],
629
- placement: e.hovered.droppable.get(t),
630
- data: r.data?.()
631
- };
632
- }
633
- const a = O(e.hovered.draggable);
634
- if (a && (a === t || t.contains(a)) && a) {
635
- const l = e.entities.draggableMap.get(a), c = l?.payload, u = e.hovered.draggable.get(a), g = { top: !1, right: !1, bottom: !1, left: !1, center: !1 };
636
- if (c) {
637
- const f = c();
638
- if (Array.isArray(f) && f.length >= 2) {
639
- const [d, h] = f, m = Number(d);
640
- i = {
641
- element: a,
642
- placement: u ?? g,
643
- index: m,
644
- item: h[m],
645
- items: h,
646
- data: l?.data?.()
647
- };
648
- }
649
- } else l?.data && (i = {
650
- element: a,
651
- placement: u ?? g,
652
- index: -1,
653
- item: void 0,
654
- items: [],
655
- data: l.data()
656
- });
657
- }
658
- }
659
- return {
660
- draggedItems: n,
661
- dropZone: s,
662
- hoveredDraggable: i,
663
- provider: e,
664
- helpers: Ve({ draggedItems: n, dropZone: s, hoveredDraggable: i })
665
- };
666
- }, F = (e, t, n) => {
667
- if (!t) return;
668
- const s = Ze(t, e) ?? e.entities.draggableMap.get(t);
669
- !s || s.disabled || s.events?.[n]?.(A(e));
670
- }, v = (e, t) => {
671
- const n = A(e);
672
- e.entities.draggingMap.forEach((s) => {
673
- s.disabled || s.events?.[t]?.(n);
674
- });
675
- }, Rt = (e, t, n) => {
676
- if (t !== n) {
677
- if (t && !K(t, e)) {
678
- const s = A(e, t);
679
- e.entities.droppableMap.get(t)?.events?.onLeave?.(s);
680
- }
681
- if (n && !K(n, e)) {
682
- const s = A(e, n);
683
- e.entities.droppableMap.get(n)?.events?.onEnter?.(s);
684
- }
685
- }
686
- }, kt = (e, t, n) => {
687
- if (t !== n) {
688
- const s = A(e);
689
- if (t) {
690
- const i = e.entities.draggableMap.get(t);
691
- i && !i.disabled && i.events?.onLeave?.(s);
692
- }
693
- if (n) {
694
- const i = e.entities.draggableMap.get(n);
695
- i && !i.disabled && i.events?.onHover?.(s);
696
- }
697
- }
698
- }, le = (e, t, n) => {
699
- const s = Ct(t);
700
- !s || !e.entities.draggingMap.has(s) || e.entities.draggingMap.get(s)?.events?.[n]?.(A(e));
701
- }, Tt = (e, t) => {
702
- const n = O(t.droppable);
703
- n && !K(n, e) && e.entities.droppableMap.get(n)?.events?.onLeave?.(A(e, n));
704
- }, we = (e, t) => {
705
- const n = O(t.droppable);
706
- n && !K(n, e) && e.entities.droppableMap.get(n)?.events?.onLeave?.(A(e, n));
707
- }, Pt = (e, t, n = 5) => {
708
- const s = n / 2;
709
- return {
710
- left: e - s,
711
- top: t - s,
712
- width: n,
713
- height: n
714
- };
715
- }, Bt = (e) => {
716
- const t = e.pointer.value?.current, n = t?.x ?? 0, s = t?.y ?? 0;
717
- return Pt(n, s, 5);
718
- }, B = (e, t, n) => {
719
- const s = e.left + e.width / 2, i = e.top + e.height / 2;
720
- if (n) {
721
- const o = n.top ?? 0, l = n.right ?? 0, c = n.bottom ?? 0, u = n.left ?? 0, g = t.left + u, f = t.right - l, d = t.top + o, h = t.bottom - c;
722
- if (g < f && d < h && s >= g && s <= f && i >= d && i <= h)
723
- return {
724
- top: !1,
725
- right: !1,
726
- bottom: !1,
727
- left: !1,
728
- center: !0
729
- };
730
- }
731
- const r = t.left + t.width / 2, a = t.top + t.height / 2;
732
- return {
733
- top: i <= a,
734
- bottom: i > a,
735
- left: s <= r,
736
- right: s > r,
737
- center: !1
738
- };
739
- }, Ot = (e) => ({
740
- x: e.left + e.width / 2,
741
- y: e.top + e.height / 2
742
- }), Re = (e, t) => {
743
- const n = Ot(t);
744
- return Math.hypot(e.x - n.x, e.y - n.y);
745
- };
746
- function Ft(e, t) {
747
- return e === t ? !0 : !e || !t ? !1 : e.top === t.top && e.right === t.right && e.bottom === t.bottom && e.left === t.left && e.center === t.center;
748
- }
749
- function U(e, t) {
750
- Ft(e.hoveredPlacement, t) || (e.hoveredPlacement = t);
751
- }
752
- const zt = (e, t) => e.find((n) => n !== t && H(t, n)), Se = (e, t, n) => {
753
- const s = O(t.droppable), i = O(t.draggable);
754
- i && t.draggable.delete(i), s && t.droppable.delete(s);
755
- const r = Bt(e), a = n.zones[0], o = n.elements[0];
756
- if (a && o && a === o && e.entities.droppableMap.has(a) && a) {
757
- const g = a.getBoundingClientRect(), f = e.entities.draggableMap.get(a)?.placementMargins, d = B(r, g, f);
758
- if (d.center) {
759
- t.droppable.set(a, d);
760
- const h = zt(n.elements, a);
761
- if (h) {
762
- const m = h.getBoundingClientRect();
763
- t.draggable.set(
764
- h,
765
- B(r, m, void 0)
766
- );
767
- }
768
- } else {
769
- t.draggable.set(o, d);
770
- const h = n.zones.find((m) => m !== a);
771
- if (h) {
772
- const m = h.getBoundingClientRect();
773
- t.droppable.set(
774
- h,
775
- B(r, m)
776
- );
777
- }
778
- }
779
- } else {
780
- if (a) {
781
- const g = a.getBoundingClientRect();
782
- t.droppable.set(a, B(r, g));
783
- }
784
- if (o)
785
- if (a)
786
- if (H(a, o)) {
787
- const g = o.getBoundingClientRect(), f = e.entities.draggableMap.get(o)?.placementMargins;
788
- t.draggable.set(
789
- o,
790
- B(r, g, f)
791
- );
792
- } else {
793
- const g = e.pointer.value?.current ?? { x: 0, y: 0 }, f = a.getBoundingClientRect(), d = o.getBoundingClientRect(), h = Re(g, f);
794
- if (Re(g, d) < h) {
795
- t.droppable.clear();
796
- const y = e.entities.draggableMap.get(o)?.placementMargins;
797
- t.draggable.set(
798
- o,
799
- B(r, d, y)
800
- );
801
- }
802
- }
803
- else {
804
- const g = o.getBoundingClientRect(), f = e.entities.draggableMap.get(o)?.placementMargins;
805
- t.draggable.set(
806
- o,
807
- B(r, g, f)
808
- );
809
- }
810
- }
811
- const c = O(t.droppable), u = O(t.draggable);
812
- if (i && i !== u) {
813
- const g = e.entities.draggableMap.get(i);
814
- g && U(g, void 0);
815
- }
816
- if (s && s !== c) {
817
- const g = e.entities.droppableMap.get(s);
818
- g && U(g, void 0);
819
- }
820
- if (u) {
821
- const g = e.entities.draggableMap.get(u);
822
- g && U(g, t.draggable.get(u));
823
- }
824
- if (c) {
825
- const g = e.entities.droppableMap.get(c);
826
- g && U(g, t.droppable.get(c));
827
- }
828
- Rt(e, s, c), kt(e, i, u);
829
- }, ce = (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, ge = (e) => {
830
- if (!e)
831
- return { x: 0, y: 0, width: 0, height: 0, top: 0, left: 0, right: 0, bottom: 0 };
832
- const t = e.getBoundingClientRect();
833
- return {
834
- x: t.x,
835
- y: t.y,
836
- width: t.width,
837
- height: t.height,
838
- top: t.top,
839
- left: t.left,
840
- right: t.right,
841
- bottom: t.bottom
842
- };
843
- }, ue = (e, t) => {
844
- const n = Math.max(
845
- 0,
846
- Math.min(e.x + e.width, t.x + t.width) - Math.max(e.x, t.x)
847
- ), s = Math.max(
848
- 0,
849
- Math.min(e.y + e.height, t.y + t.height) - Math.max(e.y, t.y)
850
- ), i = n * s, r = e.width * e.height, a = t.width * t.height;
851
- return r === 0 || a === 0 ? 0 : (i / r * 100 + i / a * 100) / 2;
852
- }, _t = (e) => e.preview.ref?.value ?? null, ke = (e) => {
853
- const t = e.preview.position?.value ?? { x: 0, y: 0 }, { x: n, y: s } = t, i = e.preview.size?.value;
854
- let r, a;
855
- if (i)
856
- r = i.width, a = i.height;
857
- else {
858
- const o = e.preview.ref?.value?.getBoundingClientRect();
859
- r = o?.width ?? 0, a = o?.height ?? 0;
860
- }
861
- return {
862
- x: n,
863
- y: s,
864
- width: r,
865
- height: a,
866
- top: s,
867
- left: n,
868
- right: n + r,
869
- bottom: s + a
870
- };
871
- }, Me = (e) => e.entities.allowedDraggableSet, $e = (e) => e.entities.allowedDroppableSet, Gt = (e, t) => !t.entities.draggingMap.has(e), Ht = (e, t) => ![...t.entities.draggingMap.keys()].some((n) => {
872
- if (H(n, e)) return !0;
873
- const s = n.parentElement;
874
- return !!(s && e !== n && !t.entities.draggableMap.has(s) && !t.entities.droppableMap.has(s) && H(s, e) && [
875
- ...t.entities.draggableMap.keys()
876
- ].filter((r) => r.parentElement === s).length === 1);
877
- }), Kt = (e, t) => t.entities.draggableMap.has(e) ? !Ee(e, t) : t.entities.droppableMap.has(e) ? !K(e, t) : !0, J = (e, t) => Gt(e, t) && Ht(e, t) && Kt(e, t), fe = 10;
878
- function _(e, t) {
879
- return Math.hypot(
880
- t.x - (e.x + e.width / 2),
881
- t.y - (e.y + e.height / 2)
882
- );
883
- }
884
- function Te(e, t) {
885
- const n = Math.max(e.x, Math.min(t.x, e.x + e.width)), s = Math.max(e.y, Math.min(t.y, e.y + e.height));
886
- return Math.hypot(t.x - n, t.y - s);
887
- }
888
- function Nt(e) {
889
- const t = e.pointer.value?.current ?? { x: 0, y: 0 }, n = document.elementFromPoint(t.x, t.y);
890
- if (!n) return null;
891
- const s = Me(e), i = $e(e), r = [], a = [];
892
- let o = n;
893
- for (; o; )
894
- (s.has(o) || i.has(o)) && J(o, e) && (s.has(o) && r.push(o), i.has(o) && a.push(o)), o = o.parentElement;
895
- return r.length === 0 && a.length === 0 ? null : { elements: r, zones: a };
896
- }
897
- const ve = (e) => {
898
- if (!_t(e)) return { elements: [], zones: [] };
899
- const n = e.pointer.value?.current ?? { x: 0, y: 0 }, s = Nt(e);
900
- if (s) {
901
- if (s.elements.length > 0) return s;
902
- const c = s.zones[0];
903
- if (!c) return s;
904
- const u = ke(e), f = [...Me(e)].filter(
905
- (m) => c.contains(m) && J(m, e)
906
- ).map((m) => ({ el: m, box: ge(m) })), d = f.filter(
907
- ({ box: m }) => ce(m, u) && ue(m, u) >= fe
908
- ).sort((m, y) => _(m.box, n) - _(y.box, n)).map(({ el: m }) => m);
909
- return d.length > 0 ? { elements: d, zones: s.zones } : { elements: f.sort((m, y) => Te(m.box, n) - Te(y.box, n)).map(({ el: m }) => m), zones: s.zones };
910
- }
911
- const i = ke(e), r = [...Me(e)].filter(
912
- (c) => J(c, e)
913
- ), a = [...$e(e)].filter(
914
- (c) => J(c, e)
915
- ), o = r.map((c) => ({ n: c, box: ge(c) })).filter(
916
- ({ box: c }) => ce(c, i) && ue(c, i) >= fe
917
- ).sort((c, u) => _(c.box, n) - _(u.box, n)).map(({ n: c }) => c), l = a.map((c) => ({ n: c, box: ge(c) })).filter(
918
- ({ box: c }) => ce(c, i) && ue(c, i) >= fe
919
- ).sort((c, u) => _(c.box, n) - _(u.box, n)).map(({ n: c }) => c);
920
- return { elements: o, zones: l };
921
- };
922
- function Ae(e) {
923
- const t = ve(e);
924
- Se(e, e.hovered, t);
925
- }
926
- function Yt(e, t) {
927
- const n = e.collision?.throttle?.value ?? 0;
928
- if (n <= 0) {
929
- Ae(e);
930
- return;
931
- }
932
- const s = Date.now();
933
- s - t.value >= n && (t.value = s, Ae(e));
934
- }
935
- async function Ue(e) {
936
- const t = e.hovered.droppable.keys().next().value;
937
- if (!t || K(t, e)) return "accept";
938
- const n = e.entities.droppableMap.get(t), s = A(e, t);
939
- let i = s;
940
- if (n?.groupMatch === "some" && (n.groups?.length ?? 0) > 0) {
941
- const o = n.groups, l = s.draggedItems.filter((u) => {
942
- for (const [, g] of e.entities.draggingMap) {
943
- const f = g.payload?.();
944
- if (!(!Array.isArray(f) || f.length < 2) && Number(f[0]) === u.index && f[1] === u.items)
945
- return se(g.groups ?? [], o);
946
- }
947
- return !0;
948
- }), c = s.draggedItems.filter(
949
- (u) => !l.includes(u)
950
- );
951
- if (c.length > 0) {
952
- const u = (g) => ({
953
- ...s,
954
- draggedItems: g,
955
- helpers: Ve({ ...s, draggedItems: g })
956
- });
957
- if (n.events?.onValidate) {
958
- const g = n.events.onValidate({
959
- validItems: l,
960
- invalidItems: c,
961
- dropZone: s.dropZone,
962
- hoveredDraggable: s.hoveredDraggable
963
- }), f = g != null && typeof g.then == "function";
964
- let d;
965
- if (f) {
966
- e.state.value = "pending";
967
- try {
968
- d = await g;
969
- } catch {
970
- const m = e.entities.initiatingDraggable;
971
- return F(e, m, "onSelfDragCancel"), v(e, "onDragCancel"), we(e, e.hovered), "cancel";
972
- }
973
- } else
974
- d = g;
975
- if (d === !1)
976
- return e.state.value = "dragging", "decline";
977
- const h = Array.isArray(d) ? d : l;
978
- if (h.length === 0) return "accept";
979
- i = u(h);
980
- } else {
981
- if (l.length === 0) return "accept";
982
- i = u(l);
983
- }
984
- }
985
- }
986
- const r = n?.events?.onDrop?.(i);
987
- if (r != null && typeof r.then == "function") {
988
- e.state.value = "pending";
989
- let o;
990
- try {
991
- o = await r;
992
- } catch {
993
- const l = e.entities.initiatingDraggable;
994
- return F(e, l, "onSelfDragCancel"), v(e, "onDragCancel"), we(e, e.hovered), "cancel";
995
- }
996
- return o === !1 ? (e.state.value = "dragging", "decline") : "accept";
997
- }
998
- return r === !1 ? "decline" : "accept";
999
- }
1000
- function qe(e) {
1001
- const t = e.entities.initiatingDraggable;
1002
- F(e, t, "onSelfDragEnd"), v(e, "onDragEnd"), Tt(e, e.hovered);
1003
- }
1004
- function Xt(e) {
1005
- const t = e.entities.selectingArea;
1006
- if (!t) return;
1007
- const n = e.entities.selectableAreaMap.get(t), s = [...e.entities.selectedSet];
1008
- n?.events?.onSelected?.(s);
1009
- }
1010
- const Vt = (e) => {
1011
- const t = {
1012
- current: null
1013
- }, n = { value: 0 }, s = async () => {
1014
- ye(), t.current?.cancel(), t.current = null;
1015
- const o = e.state.value;
1016
- if (o === "dragging") {
1017
- const l = await Ue(e);
1018
- if (l === "accept" && qe(e), l === "accept" || l === "cancel") {
1019
- te(e), document.removeEventListener("pointerup", s), document.removeEventListener("pointermove", i);
1020
- return;
1021
- }
1022
- return;
1023
- } else o === "selecting" && Xt(e);
1024
- te(e), document.removeEventListener("pointerup", s), document.removeEventListener("pointermove", i);
1025
- }, i = (o) => {
1026
- if (e.pointer.value && e.state.value !== "pending") {
1027
- if (e.pointer.value.current = { x: o.clientX, y: o.clientY }, mt(e)) {
1028
- le(e, o, "onSelfDragStart"), v(e, "onDragStart");
1029
- return;
1030
- }
1031
- if (e.state.value === "dragging") {
1032
- Yt(e, n);
1033
- const l = e.entities.initiatingDraggable;
1034
- F(e, l, "onSelfDragMove"), v(e, "onDragMove");
1035
- }
1036
- e.state.value === "selecting" && Ne(e);
1037
- }
1038
- };
1039
- return { pointerDown: (o) => {
1040
- document.addEventListener("pointerup", s), document.addEventListener("pointermove", i);
1041
- const l = o.composedPath?.()[0] ?? o.target, c = l.closest(
1042
- G.SELECT_AREA
1043
- ), u = l.closest(
1044
- G.DRAGGABLE
1045
- );
1046
- if (e.entities.modifiersSelectableAreaSet.size > 0 && e.entities.modifiersSelectableAreaSet.has(c)) {
1047
- pe(), e.pointer.value = De(o), e.state.value = "selecting", e.entities.selectingArea = c, e.entities.selectionBase = new Set(e.entities.selectedSet);
1048
- return;
1049
- }
1050
- if (e.entities.modifiersDraggableSet.size > 0 && e.entities.modifiersDraggableSet.has(u)) {
1051
- const g = e.entities.draggableMap.get(u);
1052
- if (!He(l, u, g?.dragHandle))
1053
- return;
1054
- pe(), e.entities.initiatingDraggable = u;
1055
- const f = _e(o, u);
1056
- e.pointer.value = De(o, f.x, f.y), g?.activation?.distance || g?.activation?.delay ? (e.state.value = "activating", g?.activation?.delay && (e.delay.startTime = Date.now(), t.current = ht(e, () => {
1057
- ee(e), le(e, o, "onSelfDragStart"), v(e, "onDragStart");
1058
- }))) : (ee(e), le(e, o, "onSelfDragStart"), v(e, "onDragStart"));
1059
- }
1060
- }, pointerUp: s, pointerMove: i, cleanup: () => {
1061
- t.current?.cancel(), document.removeEventListener("pointerup", s), document.removeEventListener("pointermove", i), e.lib.draggableObserver.disconnect(), e.lib.droppableObserver.disconnect(), e.lib.selectableAreaObserver.disconnect();
1062
- } };
1063
- }, Zt = {
1064
- ArrowUp: { dx: 0, dy: -1 },
1065
- ArrowDown: { dx: 0, dy: 1 },
1066
- ArrowLeft: { dx: -1, dy: 0 },
1067
- ArrowRight: { dx: 1, dy: 0 },
1068
- KeyW: { dx: 0, dy: -1 },
1069
- KeyA: { dx: -1, dy: 0 },
1070
- KeyS: { dx: 0, dy: 1 },
1071
- KeyD: { dx: 1, dy: 0 }
1072
- }, $t = (e) => (t) => {
1073
- const { keys: n } = e.keyboard;
1074
- if (n.pressedKeys.value.add(t.code), e.state.value === "dragging") {
1075
- if (n.forCancel.includes(t.code)) {
1076
- t.preventDefault(), ye(), F(
1077
- e,
1078
- e.entities.initiatingDraggable,
1079
- "onSelfDragCancel"
1080
- ), v(e, "onDragCancel"), we(e, e.hovered), te(e);
1081
- return;
1082
- }
1083
- if (n.forDrop.includes(t.code)) {
1084
- t.preventDefault(), (async () => (await Ue(e) && qe(e), ye(), te(e)))();
1085
- return;
1086
- }
1087
- const i = Zt[t.code];
1088
- if (i && n.forMove.includes(t.code) && e.pointer.value) {
1089
- t.preventDefault();
1090
- const r = n.forMoveFaster.some(
1091
- (l) => n.pressedKeys.value.has(l)
1092
- ), a = e.keyboard.step * (r ? e.keyboard.moveFaster : 1);
1093
- e.pointer.value.current = {
1094
- x: e.pointer.value.current.x + i.dx * a,
1095
- y: e.pointer.value.current.y + i.dy * a
1096
- };
1097
- const o = ve(e);
1098
- Se(e, e.hovered, o), F(
1099
- e,
1100
- e.entities.initiatingDraggable,
1101
- "onSelfDragMove"
1102
- ), v(e, "onDragMove");
1103
- return;
1104
- }
1105
- return;
1106
- }
1107
- if (n.forDrag.includes(t.code)) {
1108
- const i = document.activeElement;
1109
- if (!i) return;
1110
- const r = i.closest(
1111
- G.DRAGGABLE
1112
- );
1113
- if (!r || e.entities.modifiersDraggableSet.size === 0 || !e.entities.modifiersDraggableSet.has(r))
1114
- return;
1115
- const a = e.entities.draggableMap.get(r);
1116
- if (!He(i, r, a?.dragHandle, !0))
1117
- return;
1118
- t.preventDefault(), pe();
1119
- const o = r.getBoundingClientRect(), l = o.left + o.width / 2, c = o.top + o.height / 2, u = {
1120
- clientX: l,
1121
- clientY: c
1122
- };
1123
- e.entities.initiatingDraggable = r;
1124
- const g = _e(u, r);
1125
- e.pointer.value = De(
1126
- u,
1127
- g.x,
1128
- g.y
1129
- ), ee(e);
1130
- const f = ve(e);
1131
- Se(e, e.hovered, f), F(e, r, "onSelfDragStart"), v(e, "onDragStart");
1132
- }
1133
- }, Ut = (e) => (t) => {
1134
- e.keyboard.keys.pressedKeys.value.delete(t.code);
1135
- }, qt = (e) => () => {
1136
- e.keyboard.keys.pressedKeys.value.clear();
1137
- }, de = {
1138
- keyDown: $t,
1139
- keyUp: Ut,
1140
- clear: qt
1141
- }, jt = (e) => () => {
1142
- if (!e.state.value) return;
1143
- const t = e.scrollPosition.x, n = e.scrollPosition.y;
1144
- if (e.scrollPosition.x = window.scrollX, e.scrollPosition.y = window.scrollY, e.lib.rectCache.clear(), e.state.value === "dragging") {
1145
- Ae(e);
1146
- return;
1147
- }
1148
- if (e.state.value === "selecting" && e.pointer.value) {
1149
- const s = window.scrollX - t, i = window.scrollY - n;
1150
- e.pointer.value.start.x -= s, e.pointer.value.start.y -= i, Ne(e);
1151
- }
1152
- }, E = 50, Wt = 144, Pe = 1e3 / Wt;
1153
- function Jt(e) {
1154
- return e == null ? {
1155
- top: E,
1156
- right: E,
1157
- bottom: E,
1158
- left: E
1159
- } : typeof e == "number" ? {
1160
- top: e,
1161
- right: e,
1162
- bottom: e,
1163
- left: e
1164
- } : {
1165
- top: e.top ?? E,
1166
- right: e.right ?? E,
1167
- bottom: e.bottom ?? E,
1168
- left: e.left ?? E
1169
- };
1170
- }
1171
- const Qt = {
1172
- getScrollState(e) {
1173
- return {
1174
- scrollTop: e.scrollTop,
1175
- scrollLeft: e.scrollLeft
1176
- };
1177
- },
1178
- setScroll(e, t, n) {
1179
- e.scrollTop = t, e.scrollLeft = n;
1180
- }
1181
- };
1182
- function je(e, t, n, s = Qt, i) {
1183
- const { speed: r = 10, disabled: a = !1 } = t, o = Jt(t.threshold);
1184
- let l = null, c = null, u = null, g = 0, f = 0;
1185
- const d = (p) => {
1186
- i && (i.value = p);
1187
- }, h = (p) => {
1188
- const x = e.value, k = n();
1189
- if (!x || !k || a) {
1190
- d(!1);
1191
- return;
1192
- }
1193
- c || (c = p);
1194
- const D = p - c;
1195
- if (D < Pe) {
1196
- l = requestAnimationFrame(h);
1197
- return;
1198
- }
1199
- const w = r * (D / Pe);
1200
- c = p;
1201
- const { scrollTop: T, scrollLeft: P } = s.getScrollState(x);
1202
- (!u || g !== T || f !== P) && (u = s.getRect ? s.getRect(x) : x.getBoundingClientRect(), g = T, f = P);
1203
- let z = !1, ae = T, oe = P;
1204
- o.top > 0 && k.y - u.top < o.top ? (ae = T - w, z = !0) : o.bottom > 0 && u.bottom - k.y < o.bottom && (ae = T + w, z = !0), o.left > 0 && k.x - u.left < o.left ? (oe = P - w, z = !0) : o.right > 0 && u.right - k.x < o.right && (oe = P + w, z = !0), z && s.setScroll(x, ae, oe), d(z), l = requestAnimationFrame(h);
1205
- };
1206
- return { run: () => {
1207
- c = null, l = requestAnimationFrame(h);
1208
- }, stop: () => {
1209
- l && (cancelAnimationFrame(l), l = null), u = null, g = 0, f = 0, c = null, d(!1);
1210
- } };
1211
- }
1212
- const en = {
1213
- getScrollState() {
1214
- return {
1215
- scrollTop: window.scrollY ?? document.documentElement.scrollTop,
1216
- scrollLeft: window.scrollX ?? document.documentElement.scrollLeft
1217
- };
1218
- },
1219
- setScroll(e, t, n) {
1220
- window.scrollTo(n, t);
1221
- },
1222
- getRect() {
1223
- return new DOMRect(0, 0, window.innerWidth, window.innerHeight);
1224
- }
1225
- }, tn = {
1226
- get value() {
1227
- return typeof document < "u" ? document.documentElement : null;
1228
- }
1229
- };
1230
- function nn(e, t) {
1231
- const n = V(!1), i = je(
1232
- tn,
1233
- t ?? {},
1234
- () => {
1235
- if (e.state.value !== "dragging") return null;
1236
- const o = e.preview.position.value, l = e.preview.size.value;
1237
- return o ? l?.width && l?.height ? {
1238
- x: o.x + l.width / 2,
1239
- y: o.y + l.height / 2
1240
- } : o : null;
1241
- },
1242
- en,
1243
- n
1244
- ), r = ne(
1245
- () => e.state.value,
1246
- (o) => {
1247
- o === "dragging" ? i.run() : i.stop();
1248
- }
1249
- ), a = () => {
1250
- r(), i.stop();
1251
- };
1252
- return Je(a), { isScrolling: n, stop: a };
1253
- }
1254
- const sn = (e) => {
1255
- const t = Vt(e), n = de.keyDown(e), s = de.keyUp(e), i = de.clear(e), r = jt(e);
1256
- let a = null;
1257
- ne(
1258
- e.autoScrollViewport,
1259
- (o) => {
1260
- a?.(), a = null, (o === !0 || o && typeof o == "object") && (a = nn(
1261
- e,
1262
- o === !0 ? {} : o
1263
- ).stop);
1264
- },
1265
- { immediate: !0 }
1266
- ), Y(() => {
1267
- document.addEventListener("pointerdown", t.pointerDown), document.addEventListener("keydown", n), document.addEventListener("keyup", s), document.addEventListener("blur", i), document.addEventListener("scroll", r, !0);
1268
- }), Z(() => {
1269
- document.removeEventListener("pointerdown", t.pointerDown), document.removeEventListener("pointerup", t.pointerUp), document.removeEventListener("pointermove", t.pointerMove), document.removeEventListener("keydown", n), document.removeEventListener("keyup", s), document.removeEventListener("blur", i), document.removeEventListener("scroll", r, !0), a?.(), t.cleanup();
1270
- });
1271
- }, ie = () => {
1272
- const e = Be(xe);
1273
- if (!e) throw Error("DnD provider not found");
1274
- return e;
1275
- }, We = () => {
1276
- const e = ie();
1277
- return {
1278
- preview: e.preview,
1279
- delay: e.delay,
1280
- distanceProgress: e.distanceProgress,
1281
- entities: e.entities,
1282
- pointer: e.pointer,
1283
- state: e.state,
1284
- scrollPosition: e.scrollPosition,
1285
- keyboard: e.keyboard,
1286
- hovered: e.hovered,
1287
- collision: e.collision,
1288
- autoScrollViewport: e.autoScrollViewport
1289
- };
1290
- }, an = /* @__PURE__ */ Oe({
1291
- __name: "DragPreview",
1292
- props: {
1293
- grid: {}
1294
- },
1295
- setup(e) {
1296
- const { state: t, entities: n, preview: s } = We(), i = Fe("contentRef");
1297
- ne(
1298
- () => i.value,
1299
- () => {
1300
- const o = i.value?.getBoundingClientRect();
1301
- o && (s.size.value = o);
1302
- }
1303
- );
1304
- const r = (o, l) => !l || l <= 0 ? o : Math.round(o / l) * l, a = b(() => {
1305
- const { x: o, y: l } = s.position.value, c = typeof e.grid == "object" ? e.grid.x : e.grid, u = typeof e.grid == "object" ? e.grid.y : e.grid;
1306
- return { x: r(o, c), y: r(l, u) };
1307
- });
1308
- return (o, l) => j(t) === "dragging" ? (L(), W("div", {
1309
- key: 0,
1310
- class: "dnd-kit-preview",
1311
- ref_key: "contentRef",
1312
- ref: i,
1313
- style: Ce({
1314
- transform: `translate3d(${a.value.x}px, ${a.value.y}px, 0)`
1315
- })
1316
- }, [
1317
- me(o.$slots, "default", {
1318
- draggingMap: j(n).draggingMap
1319
- }, () => [
1320
- (L(!0), W(he, null, Qe(j(n).draggingMap, ([c, u]) => (L(), W(he, { key: c }, [
1321
- u.render ? (L(), Q(be(u.render), { key: 0 })) : (L(), Q(be(c.tagName), {
1322
- key: 1,
1323
- innerHTML: u.initialOuterHTML,
1324
- style: Ce({
1325
- width: u.initialRect.width + "px",
1326
- height: u.initialRect.height + "px"
1327
- })
1328
- }, null, 8, ["innerHTML", "style"]))
1329
- ], 64))), 128))
1330
- ])
1331
- ], 4)) : et("", !0);
1332
- }
1333
- }), rn = /* @__PURE__ */ Oe({
1334
- __name: "DnDProvider",
1335
- props: {
1336
- autoScrollViewport: { type: [Object, Boolean, null] },
1337
- previewTo: { type: [String, Boolean, null] },
1338
- style: {},
1339
- class: {}
1340
- },
1341
- setup(e) {
1342
- const t = e, n = Fe("previewRef"), s = wt(n, t);
1343
- sn(s);
1344
- const i = q(!1);
1345
- Y(() => i.value = !0);
1346
- const r = b(() => s.preview.render.value ?? an);
1347
- return tt(xe, s), (a, o) => (L(), W(he, null, [
1348
- me(a.$slots, "default"),
1349
- (L(), Q(nt, {
1350
- disabled: !i.value,
1351
- to: j(s).preview.to.value || "body"
1352
- }, [
1353
- st("div", it({
1354
- ref_key: "previewRef",
1355
- ref: n,
1356
- class: "dnd-kit-preview-container"
1357
- }, t), [
1358
- me(a.$slots, "preview", { preview: r.value }, () => [
1359
- (L(), Q(be(r.value)))
1360
- ])
1361
- ], 16)
1362
- ], 8, ["disabled", "to"]))
1363
- ], 64));
1364
- }
1365
- });
1366
- function ln(e, t, n) {
1367
- const s = ie();
1368
- let i, r, a;
1369
- typeof t == "function" ? (i = {}, r = t) : (i = t ?? {}, r = n);
1370
- const o = i.id ?? Math.random().toString(36).slice(2), l = b({
1371
- get() {
1372
- const f = S(e);
1373
- return f ? s.entities.selectedSet.has(f) : !1;
1374
- },
1375
- set(f) {
1376
- const d = S(e);
1377
- d && s.entities.selectedSet[f ? "add" : "delete"](d);
1378
- }
1379
- }), c = b(() => {
1380
- const f = S(e);
1381
- return f ? s.entities.draggingMap.has(f) : !1;
1382
- }), u = b(() => {
1383
- const f = S(e);
1384
- return f ? s.entities.allowedDraggableSet.has(f) : !1;
1385
- }), g = b(() => {
1386
- const f = S(e);
1387
- if (f)
1388
- return s.entities.draggableMap.get(f)?.hoveredPlacement;
1389
- });
1390
- return Y(() => {
1391
- if (a = S(e), !!a && (a.addEventListener("dragstart", M), a.addEventListener("drag", M), a.addEventListener("dragend", M), a.setAttribute(I.DRAGGABLE, o), s.lib.draggableObserver.observe(a), s.entities.draggableMap.set(a, {
1392
- id: o,
1393
- render: i.render,
1394
- disabled: i.disabled ?? !1,
1395
- groups: i.groups ?? [],
1396
- modifier: i.modifier,
1397
- events: i.events,
1398
- payload: r,
1399
- data: i.data,
1400
- dragHandle: i.dragHandle,
1401
- activation: i.activation,
1402
- placementMargins: i.placementMargins,
1403
- hoveredPlacement: void 0
1404
- }), o)) {
1405
- for (const [f, d] of s.entities.draggingMap)
1406
- if (d.id === o && f !== a) {
1407
- s.entities.draggingMap.delete(f), s.entities.draggingMap.set(a, d);
1408
- break;
1409
- }
1410
- }
1411
- }), Z(() => {
1412
- a && (s.lib.draggableObserver.unobserve(a), s.entities.visibleDraggableSet.delete(a), s.entities.draggableMap.delete(a), s.entities.modifiersDraggableSet.delete(a));
1413
- }), {
1414
- selected: l,
1415
- isDragging: c,
1416
- isAllowed: u,
1417
- isDragOver: g
1418
- };
1419
- }
1420
- const cn = (e, t) => {
1421
- const n = ie(), s = b(() => e.value === n.entities.selectingArea);
1422
- let i = null;
1423
- Y(() => {
1424
- i = S(e), i && (i.setAttribute(I.SELECT_AREA, ""), n.lib.selectableAreaObserver.observe(i), n.entities.selectableAreaMap.set(i, {
1425
- modifier: t?.modifier ?? {
1426
- keys: ["ControlLeft"],
1427
- method: "every"
1428
- },
1429
- events: t?.events,
1430
- disabled: t?.disabled ?? !1,
1431
- groups: t?.groups ?? [],
1432
- strategy: t?.strategy ?? "toggle"
1433
- }));
1434
- }), Z(() => {
1435
- i && (n.lib.selectableAreaObserver.unobserve(i), n.entities.visibleSelectableAreaSet.delete(i), n.entities.modifiersSelectableAreaSet.delete(i), n.entities.selectableAreaMap.delete(i));
1436
- });
1437
- const r = b(() => {
1438
- n.scrollPosition.x, n.scrollPosition.y;
1439
- const a = n.pointer.value;
1440
- return !a || n.state.value !== "selecting" || !i || !s.value ? {} : Mt(a.start, a.current, i);
1441
- });
1442
- return {
1443
- isSelecting: s,
1444
- style: r
1445
- };
1446
- };
1447
- function gn(e, t) {
1448
- const n = Be(xe);
1449
- if (!n) throw Error("DnD provider not found");
1450
- let s = null;
1451
- return Y(() => {
1452
- s = S(e), s && (s.setAttribute(I.CONSTRAINT_AREA, ""), n.entities.constraintsAreaMap.set(s, {
1453
- axis: t?.axis || "both",
1454
- restrictToArea: t?.restrictToArea || !1
1455
- }));
1456
- }), Z(() => {
1457
- s && n.entities.constraintsAreaMap.delete(s);
1458
- }), {};
1459
- }
1460
- function un(e, t, n) {
1461
- const s = ie();
1462
- let i = null, r, a;
1463
- typeof t == "function" ? (r = {}, a = t) : (r = t ?? {}, a = n);
1464
- const o = b(() => {
1465
- const c = S(e);
1466
- return c ? s.entities.allowedDroppableSet.has(c) : !1;
1467
- }), l = b(() => {
1468
- const c = S(e);
1469
- if (c)
1470
- return s.entities.droppableMap.get(c)?.hoveredPlacement;
1471
- });
1472
- return Y(() => {
1473
- i = S(e), i && (i.setAttribute(I.DROPPABLE, ""), s.lib.droppableObserver.observe(i), s.entities.droppableMap.set(i, {
1474
- disabled: r.disabled ?? !1,
1475
- groups: r.groups ?? [],
1476
- groupMatch: r.groupMatch ?? "every",
1477
- events: r.events,
1478
- payload: a,
1479
- data: r.data,
1480
- hoveredPlacement: void 0
1481
- }));
1482
- }), Z(() => {
1483
- i && (s.lib.droppableObserver.unobserve(i), s.entities.visibleDroppableSet.delete(i), s.entities.droppableMap.delete(i));
1484
- }), {
1485
- isAllowed: o,
1486
- isDragOver: l
1487
- };
1488
- }
1489
- const fn = (e, t) => {
1490
- const n = We(), s = V(!1), r = je(
1491
- e,
1492
- t ?? {},
1493
- () => {
1494
- if (n.state.value !== "dragging") return null;
1495
- const o = n.preview.position.value, l = n.preview.size.value;
1496
- return o ? l?.width && l?.height ? {
1497
- x: o.x + l.width / 2,
1498
- y: o.y + l.height / 2
1499
- } : o : null;
1500
- },
1501
- void 0,
1502
- s
1503
- ), a = b(() => {
1504
- const o = e.value;
1505
- return o != null && n.hovered.droppable.has(o);
1506
- });
1507
- return ne(
1508
- [() => n.state.value, a],
1509
- ([o, l]) => {
1510
- o === "dragging" && l ? r.run() : r.stop();
1511
- }
1512
- ), { isScrolling: s };
1513
- };
1514
- export {
1515
- rn as DnDProvider,
1516
- an as DragPreview,
1517
- xe as injectionKey,
1518
- fn as makeAutoScroll,
1519
- gn as makeConstraintArea,
1520
- ln as makeDraggable,
1521
- un as makeDroppable,
1522
- cn as makeSelectionArea,
1523
- We as useDnDProvider
1524
- };