@vue-dnd-kit/core 1.2.2 → 1.3.0

package/dist/vue-dnd-kit-core.es.js

@@ -14,35 +14,35 @@ k(x, "remove", (e, t) => {
 }), k(x, "move", (e, t, r, l) => {
   if (!e || !r || t === void 0 || l === void 0)
     return;
-  const o = x.remove(e, t);
-  x.insert(r, l, o);
+  const s = x.remove(e, t);
+  x.insert(r, l, s);
 }), k(x, "swap", (e, t, r, l) => {
   if (!e || !r || t === void 0 || l === void 0)
     return;
-  const o = e[t], s = r[l];
-  e[t] = s, r[l] = o;
+  const s = e[t], o = r[l];
+  e[t] = o, r[l] = s;
 }), k(x, "copy", (e, t, r, l) => {
   if (!e || t === void 0 || !r || l === void 0)
     return;
-  const o = e[t];
-  x.insert(r, l, o);
+  const s = e[t];
+  x.insert(r, l, s);
 }), k(x, "applyTransfer", (e) => {
-  var l, o, s, g, i, c, d;
+  var l, s, o, g, i, c, d;
   const t = e.hovered.element.value, r = e.hovered.zone.value;
   if (t) {
-    const v = (o = (l = e.elementsMap.value.get(t)) == null ? void 0 : l.data) == null ? void 0 : o.source, a = (g = (s = e.elementsMap.value.get(t)) == null ? void 0 : s.data) == null ? void 0 : g.index, u = e.draggingElements.value.values().next().value, f = (i = u == null ? void 0 : u.data) == null ? void 0 : i.index, m = f !== void 0 && a !== void 0 && f > a ? 1 : -1;
+    const v = (s = (l = e.elementsMap.value.get(t)) == null ? void 0 : l.data) == null ? void 0 : s.source, a = (g = (o = e.elementsMap.value.get(t)) == null ? void 0 : o.data) == null ? void 0 : g.index, u = e.draggingElements.value.values().next().value, f = (i = u == null ? void 0 : u.data) == null ? void 0 : i.index, m = f !== void 0 && a !== void 0 && f > a ? 1 : -1;
     Array.from(
       e.draggingElements.value.values()
     ).sort(
-      (E, L) => {
+      (E, A) => {
         var w, I;
-        return m * ((((w = E.data) == null ? void 0 : w.index) || 0) - (((I = L.data) == null ? void 0 : I.index) || 0));
+        return m * ((((w = E.data) == null ? void 0 : w.index) || 0) - (((I = A.data) == null ? void 0 : I.index) || 0));
       }
     ).forEach(
       (E) => {
-        var L, w;
+        var A, w;
         return x.move(
-          (L = E.data) == null ? void 0 : L.source,
+          (A = E.data) == null ? void 0 : A.source,
           (w = E.data) == null ? void 0 : w.index,
           v,
           a
@@ -69,10 +69,10 @@ k(x, "remove", (e, t) => {
     );
   }
 }), k(x, "applyCopy", (e) => {
-  var l, o, s, g, i, c;
+  var l, s, o, g, i, c;
   const t = e.hovered.element.value, r = e.hovered.zone.value;
   if (t) {
-    const d = (o = (l = e.elementsMap.value.get(t)) == null ? void 0 : l.data) == null ? void 0 : o.source, v = (g = (s = e.elementsMap.value.get(t)) == null ? void 0 : s.data) == null ? void 0 : g.index;
+    const d = (s = (l = e.elementsMap.value.get(t)) == null ? void 0 : l.data) == null ? void 0 : s.source, v = (g = (o = e.elementsMap.value.get(t)) == null ? void 0 : o.data) == null ? void 0 : g.index;
     Array.from(
       e.draggingElements.value.values()
     ).sort((u, f) => {
@@ -109,14 +109,14 @@ k(x, "remove", (e, t) => {
     );
   }
 }), k(x, "applySwap", (e) => {
-  var l, o, s, g, i, c, d, v;
+  var l, s, o, g, i, c, d, v;
   const t = e.hovered.element.value, r = e.hovered.zone.value;
   if (t && e.draggingElements.value.size === 1) {
     const a = e.draggingElements.value.values().next().value;
     x.swap(
       (l = a == null ? void 0 : a.data) == null ? void 0 : l.source,
-      (o = a == null ? void 0 : a.data) == null ? void 0 : o.index,
-      (g = (s = e.elementsMap.value.get(t)) == null ? void 0 : s.data) == null ? void 0 : g.source,
+      (s = a == null ? void 0 : a.data) == null ? void 0 : s.index,
+      (g = (o = e.elementsMap.value.get(t)) == null ? void 0 : o.data) == null ? void 0 : g.source,
       (c = (i = e.elementsMap.value.get(t)) == null ? void 0 : i.data) == null ? void 0 : c.index
     );
   } else if (r) {
@@ -124,8 +124,8 @@ k(x, "remove", (e, t) => {
     Array.from(
       e.draggingElements.value.values()
     ).sort((m, p) => {
-      var E, L;
-      return (((E = p.data) == null ? void 0 : E.index) || 0) - (((L = m.data) == null ? void 0 : L.index) || 0);
+      var E, A;
+      return (((E = p.data) == null ? void 0 : E.index) || 0) - (((A = m.data) == null ? void 0 : A.index) || 0);
     }).forEach(
       (m) => {
         var p, E;
@@ -142,17 +142,17 @@ k(x, "remove", (e, t) => {
   Array.from(
     e.draggingElements.value.values()
   ).sort((r, l) => {
-    var o, s;
-    return (((o = l.data) == null ? void 0 : o.index) || 0) - (((s = r.data) == null ? void 0 : s.index) || 0);
+    var s, o;
+    return (((s = l.data) == null ? void 0 : s.index) || 0) - (((o = r.data) == null ? void 0 : o.index) || 0);
   }).forEach((r) => {
-    var l, o;
-    (l = r.data) != null && l.source && ((o = r.data) == null ? void 0 : o.index) !== void 0 && x.remove(r.data.source, r.data.index);
+    var l, s;
+    (l = r.data) != null && l.source && ((s = r.data) == null ? void 0 : s.index) !== void 0 && x.remove(r.data.source, r.data.index);
   });
 }), k(x, "applyInsert", (e, t) => {
-  var o, s, g, i, c, d;
+  var s, o, g, i, c, d;
   const r = e.hovered.element.value, l = e.hovered.zone.value;
   if (r && t.length > 0) {
-    const v = (s = (o = e.elementsMap.value.get(r)) == null ? void 0 : o.data) == null ? void 0 : s.source, a = (i = (g = e.elementsMap.value.get(r)) == null ? void 0 : g.data) == null ? void 0 : i.index;
+    const v = (o = (s = e.elementsMap.value.get(r)) == null ? void 0 : s.data) == null ? void 0 : o.source, a = (i = (g = e.elementsMap.value.get(r)) == null ? void 0 : g.data) == null ? void 0 : i.index;
     t.forEach((u) => {
       x.insert(v, a, u);
     });
@@ -171,7 +171,7 @@ const K = ce(() => {
     component: V(null),
     ref: Y(null),
     options: Y(null)
-  }, r = V(/* @__PURE__ */ new Map()), l = V(/* @__PURE__ */ new Set()), o = V(/* @__PURE__ */ new Map()), s = V(/* @__PURE__ */ new Set()), g = V(/* @__PURE__ */ new Set()), i = new IntersectionObserver((Z) => {
+  }, r = V(/* @__PURE__ */ new Map()), l = V(/* @__PURE__ */ new Set()), s = V(/* @__PURE__ */ new Map()), o = V(/* @__PURE__ */ new Set()), g = V(/* @__PURE__ */ new Set()), i = new IntersectionObserver((Z) => {
     Z.forEach(
       (h) => g.value[h.isIntersecting ? "add" : "delete"](
         h.target
@@ -179,12 +179,12 @@ const K = ce(() => {
     );
   }), c = new IntersectionObserver((Z) => {
     Z.forEach(
-      (h) => s.value[h.isIntersecting ? "add" : "delete"](h.target)
+      (h) => o.value[h.isIntersecting ? "add" : "delete"](h.target)
     );
   }), d = (Z, h) => {
     Z === "add" ? i.observe(h) : (i.unobserve(h), g.value.delete(h));
   }, v = (Z, h) => {
-    Z === "add" ? c.observe(h) : (c.unobserve(h), s.value.delete(h));
+    Z === "add" ? c.observe(h) : (c.unobserve(h), o.value.delete(h));
   }, a = {
     start: Y(null),
     current: Y(null),
@@ -192,7 +192,7 @@ const K = ce(() => {
       percent: Y(null),
       pixel: Y(null)
     }
-  }, { w: u, s: f, a: m, d: p, ctrl: E, shift: L, alt: w, meta: I } = Me(), B = {
+  }, { w: u, s: f, a: m, d: p, ctrl: E, shift: A, alt: w, meta: I } = Me(), B = {
     zone: Y(null),
     element: Y(null)
   };
@@ -202,8 +202,8 @@ const K = ce(() => {
     activeContainer: t,
     elementsMap: r,
     selectedElements: l,
-    zonesMap: o,
-    visibleZones: s,
+    zonesMap: s,
+    visibleZones: o,
     visibleElements: g,
     pointerPosition: a,
     keyboard: {
@@ -212,7 +212,7 @@ const K = ce(() => {
       a: m,
       d: p,
       ctrl: E,
-      shift: L,
+      shift: A,
       alt: w,
       meta: I
     },
@@ -220,25 +220,25 @@ const K = ce(() => {
     handleDragElementIntersection: d,
     handleDropZoneIntersection: v
   };
-}), Le = (n) => {
-  const e = V(null), { draggingElements: t, pointerPosition: r, isDragging: l, activeContainer: o } = K();
+}), Ae = (n) => {
+  const e = V(null), { draggingElements: t, pointerPosition: r, isDragging: l, activeContainer: s } = K();
   return G(() => {
-    o.ref = e, o.options.value = n ?? null;
+    s.ref = e, s.options.value = n ?? null;
   }), fe(() => {
-    o.ref.value = null, o.options.value = null;
+    s.ref.value = null, s.options.value = null;
   }), {
     elementRef: e,
     draggingElements: t,
     pointerPosition: r,
     isDragging: l
   };
-}, Ae = ["innerHTML"], _e = /* @__PURE__ */ ie({
+}, Le = ["innerHTML"], _e = /* @__PURE__ */ ie({
   __name: "DefaultOverlay",
   setup(n) {
-    const { elementRef: e, pointerPosition: t, isDragging: r, draggingElements: l } = Le(), o = T(() => {
-      var s, g, i, c;
+    const { elementRef: e, pointerPosition: t, isDragging: r, draggingElements: l } = Ae(), s = T(() => {
+      var o, g, i, c;
       return {
-        transform: `translate3d(${(((s = t.current.value) == null ? void 0 : s.x) ?? 0) - (((g = t.offset.pixel.value) == null ? void 0 : g.x) ?? 0)}px, ${(((i = t.current.value) == null ? void 0 : i.y) ?? 0) - (((c = t.offset.pixel.value) == null ? void 0 : c.y) ?? 0)}px, 0)`,
+        transform: `translate3d(${(((o = t.current.value) == null ? void 0 : o.x) ?? 0) - (((g = t.offset.pixel.value) == null ? void 0 : g.x) ?? 0)}px, ${(((i = t.current.value) == null ? void 0 : i.y) ?? 0) - (((c = t.offset.pixel.value) == null ? void 0 : c.y) ?? 0)}px, 0)`,
         zIndex: 1e3,
         position: "fixed",
         top: 0,
@@ -246,11 +246,11 @@ const K = ce(() => {
         transition: "0.3s cubic-bezier(0.165, 0.84, 0.44, 1)"
       };
     });
-    return (s, g) => y(r) ? (F(), N("div", {
+    return (o, g) => y(r) ? (F(), N("div", {
       key: 0,
       ref_key: "elementRef",
       ref: e,
-      style: W(o.value)
+      style: W(s.value)
     }, [
       (F(!0), N(me, null, he(y(l), ([i, c]) => {
         var d, v;
@@ -261,7 +261,7 @@ const K = ce(() => {
             width: `${(d = c.initialRect) == null ? void 0 : d.width}px`,
             height: `${(v = c.initialRect) == null ? void 0 : v.height}px`
           })
-        }, null, 12, Ae);
+        }, null, 12, Le);
       }), 128))
     ], 4)) : ge("", !0);
   }
@@ -309,13 +309,13 @@ const K = ce(() => {
     n.component("DragOverlay", re);
     const e = n.mount;
     n.mount = function(r) {
-      const l = e.call(this, r), o = typeof r == "string" ? document.querySelector(r) : r;
-      if (o && o instanceof Element && !o.querySelector("#vue-dnd-kit-overlay")) {
-        const s = document.createElement("div");
-        s.id = "vue-dnd-kit-overlay", s.style.pointerEvents = "none", o.appendChild(s);
+      const l = e.call(this, r), s = typeof r == "string" ? document.querySelector(r) : r;
+      if (s && s instanceof Element && !s.querySelector("#vue-dnd-kit-overlay")) {
+        const o = document.createElement("div");
+        o.id = "vue-dnd-kit-overlay", o.style.pointerEvents = "none", s.appendChild(o);
         const g = ye(re);
-        te(g, s), n.__VUE_DND_KIT_OVERLAY__ = {
-          container: s,
+        te(g, o), n.__VUE_DND_KIT_OVERLAY__ = {
+          container: o,
           vnode: g
         };
         const i = K();
@@ -369,16 +369,16 @@ const K = ce(() => {
 }, le = (n, e) => {
   const t = e.x - n.x, r = e.y - n.y;
   return Math.sqrt(t * t + r * r);
-}, oe = (n, e) => {
+}, se = (n, e) => {
   const t = Math.max(
     0,
     Math.min(n.x + n.width, e.x + e.width) - Math.max(n.x, e.x)
   ), r = Math.max(
     0,
     Math.min(n.y + n.height, e.y + e.height) - Math.max(n.y, e.y)
-  ), l = t * r, o = n.width * n.height, s = e.width * e.height;
-  return (l / o * 100 + l / s * 100) / 2;
-}, se = "data-vue-dnd-kit-draggable", z = (n) => {
+  ), l = t * r, s = n.width * n.height, o = e.width * e.height;
+  return (l / s * 100 + l / o * 100) / 2;
+}, oe = "data-vue-dnd-kit-draggable", z = (n) => {
   n.preventDefault();
 }, Ie = (n) => {
   const {
@@ -386,17 +386,17 @@ const K = ce(() => {
     draggingElements: t,
     hovered: r,
     selectedElements: l,
-    isDragging: o,
-    visibleElements: s,
+    isDragging: s,
+    visibleElements: o,
     handleDragElementIntersection: g
   } = K(), i = V(null), c = T(
-    () => s.value.has(i.value) && r.element.value === i.value
-  ), d = Y((n == null ? void 0 : n.id) || xe()), v = T(() => !i.value || !s.value.has(i.value) ? !1 : t.value.has(i.value)), a = T(() => {
-    if (!i.value || !o.value || !s.value.has(i.value)) return !1;
+    () => o.value.has(i.value) && r.element.value === i.value
+  ), d = Y((n == null ? void 0 : n.id) || xe()), v = T(() => !i.value || !o.value.has(i.value) ? !1 : t.value.has(i.value)), a = T(() => {
+    if (!i.value || !s.value || !o.value.has(i.value)) return !1;
     const m = e.value.get(i.value);
     return m != null && m.groups.length ? !Array.from(t.value.entries()).some(
       ([p, E]) => E.groups.length ? !E.groups.some(
-        (L) => m.groups.includes(L)
+        (A) => m.groups.includes(A)
       ) : !1
     ) : !0;
   });
@@ -412,10 +412,10 @@ const K = ce(() => {
         events: (n == null ? void 0 : n.events) ?? {},
         data: (n == null ? void 0 : n.data) ?? null,
         id: d.value
-      }), g("add", i.value), i.value.addEventListener("dragstart", z), i.value.addEventListener("drag", z), i.value.setAttribute(se, "true"), i.value.setAttribute("draggable", "false");
+      }), g("add", i.value), i.value.addEventListener("dragstart", z), i.value.addEventListener("drag", z), i.value.setAttribute(oe, "true"), i.value.setAttribute("draggable", "false");
     },
     unregisterElement: () => {
-      i.value && (e.value.delete(i.value), l.value.delete(i.value), i.value.removeEventListener("dragstart", z), i.value.removeEventListener("drag", z), i.value.removeAttribute(se), i.value.removeAttribute("draggable"));
+      i.value && (e.value.delete(i.value), l.value.delete(i.value), i.value.removeEventListener("dragstart", z), i.value.removeEventListener("drag", z), i.value.removeAttribute(oe), i.value.removeAttribute("draggable"));
     },
     isDragging: v,
     isOvered: c,
@@ -424,12 +424,12 @@ const K = ce(() => {
   };
 }, b = (n, e) => n ? e.contains(n) : !1, ze = (n) => {
   var d, v;
-  const e = H(n.activeContainer.ref.value), t = q(e), r = ((d = n.pointerPosition.current.value) == null ? void 0 : d.x) ?? 0, l = ((v = n.pointerPosition.current.value) == null ? void 0 : v.y) ?? 0, s = !(e && r >= e.x && r <= e.x + e.width && l >= e.y && l <= e.y + e.height), g = Array.from(n.draggingElements.value.keys()), i = Array.from(n.visibleElements.value.entries()).filter(([a, u]) => {
+  const e = H(n.activeContainer.ref.value), t = q(e), r = ((d = n.pointerPosition.current.value) == null ? void 0 : d.x) ?? 0, l = ((v = n.pointerPosition.current.value) == null ? void 0 : v.y) ?? 0, o = !(e && r >= e.x && r <= e.x + e.width && l >= e.y && l <= e.y + e.height), g = Array.from(n.draggingElements.value.keys()), i = Array.from(n.visibleElements.value.entries()).filter(([a, u]) => {
     if (!a) return !1;
     const f = H(a);
     return f && e && ae(f, e);
   }).map(([a, u]) => {
-    const f = H(a), m = q(f), p = r >= f.x && r <= f.x + f.width && l >= f.y && l <= f.y + f.height, E = oe(f, e), L = le(t, m);
+    const f = H(a), m = q(f), p = r >= f.x && r <= f.x + f.width && l >= f.y && l <= f.y + f.height, E = se(f, e), A = le(t, m);
     let w = 0;
     for (const [I, B] of n.visibleElements.value.entries())
       I !== a && I && a && b(a, I) && w++;
@@ -439,10 +439,10 @@ const K = ce(() => {
       isPointerInElement: p,
       overlapPercent: E,
       depth: w,
-      centerDistance: L
+      centerDistance: A
     };
   }).sort((a, u) => {
-    if (!s) {
+    if (!o) {
       if (a.isPointerInElement && u.isPointerInElement)
         return u.depth - a.depth;
       if (a.isPointerInElement !== u.isPointerInElement)
@@ -457,7 +457,7 @@ const K = ce(() => {
     const f = H(a);
     return f && e && ae(f, e);
   }).map(([a, u]) => {
-    const f = H(a), m = q(f), p = r >= f.x && r <= f.x + f.width && l >= f.y && l <= f.y + f.height, E = oe(f, e), L = le(t, m);
+    const f = H(a), m = q(f), p = r >= f.x && r <= f.x + f.width && l >= f.y && l <= f.y + f.height, E = se(f, e), A = le(t, m);
     let w = 0;
     for (const [I, B] of n.visibleZones.value.entries())
       I !== a && I && a && b(a, I) && w++;
@@ -467,10 +467,10 @@ const K = ce(() => {
       isPointerInElement: p,
       overlapPercent: E,
       depth: w,
-      centerDistance: L
+      centerDistance: A
     };
   }).sort((a, u) => {
-    if (!s) {
+    if (!o) {
       if (a.isPointerInElement && u.isPointerInElement)
         return u.depth - a.depth;
       if (a.isPointerInElement !== u.isPointerInElement)
@@ -521,21 +521,21 @@ const K = ce(() => {
 }, De = (n) => {
   const e = K();
   return {
-    onPointerStart: (o) => {
-      e.pointerPosition.start.value = { x: o.clientX, y: o.clientY }, e.pointerPosition.current.value = {
-        x: o.clientX,
-        y: o.clientY
+    onPointerStart: (s) => {
+      e.pointerPosition.start.value = { x: s.clientX, y: s.clientY }, e.pointerPosition.current.value = {
+        x: s.clientX,
+        y: s.clientY
       };
-      const { pixel: s, percent: g } = Se(n.value, {
-        x: o.clientX,
-        y: o.clientY
+      const { pixel: o, percent: g } = Se(n.value, {
+        x: s.clientX,
+        y: s.clientY
       });
-      e.pointerPosition.offset.pixel.value = s, e.pointerPosition.offset.percent.value = g;
+      e.pointerPosition.offset.pixel.value = o, e.pointerPosition.offset.percent.value = g;
     },
-    onPointerMove: (o) => {
+    onPointerMove: (s) => {
       e.pointerPosition.current.value = {
-        x: o.clientX,
-        y: o.clientY
+        x: s.clientX,
+        y: s.clientY
       };
     },
     onPointerEnd: () => {
@@ -544,13 +544,13 @@ const K = ce(() => {
   };
 }, ke = (n, e) => {
   var B, Z;
-  const t = K(), { onPointerStart: r, onPointerMove: l, onPointerEnd: o } = De(n), { onKeyboardStart: s, onKeyboardMove: g, onKeyboardEnd: i } = Ce(
+  const t = K(), { onPointerStart: r, onPointerMove: l, onPointerEnd: s } = De(n), { onKeyboardStart: o, onKeyboardMove: g, onKeyboardEnd: i } = Ce(
     n,
     e == null ? void 0 : e.keyboard
   );
   let c = null;
   const d = (h) => {
-    var D, A;
+    var D, L;
     if (!h) return /* @__PURE__ */ new Map();
     const _ = t.selectedElements.value.has(h);
     if (t.selectedElements.value.size > 0 && _) {
@@ -572,14 +572,14 @@ const K = ce(() => {
     return M.set(h, {
       ...P,
       initialHTML: ((D = P.node) == null ? void 0 : D.outerHTML) ?? "",
-      initialRect: (A = P.node) == null ? void 0 : A.getBoundingClientRect()
+      initialRect: (L = P.node) == null ? void 0 : L.getBoundingClientRect()
     }), M;
   }, v = (h) => {
     if (!h)
       return { element: null, zone: null };
-    const _ = Array.isArray(h) ? h : [h], P = Array.from(t.draggingElements.value.keys()), M = _.find((A) => {
-      if (!t.visibleZones.value.has(A)) return !1;
-      const S = t.zonesMap.value.get(A);
+    const _ = Array.isArray(h) ? h : [h], P = Array.from(t.draggingElements.value.keys()), M = _.find((L) => {
+      if (!t.visibleZones.value.has(L)) return !1;
+      const S = t.zonesMap.value.get(L);
       return !(!S || P.some(
         (C) => C && (C === S.node || b(S.node, C))
       ) || S.groups.length && !!Array.from(
@@ -588,22 +588,38 @@ const K = ce(() => {
     });
     return M ? {
       element: _.find(
-        (A) => t.visibleElements.value.has(A) && t.elementsMap.value.has(A) && !P.some(
-          (S) => S && (S === A || b(
-            A,
+        (L) => t.visibleElements.value.has(L) && t.elementsMap.value.has(L) && !P.some(
+          (S) => S && (S === L || b(
+            L,
             S
-          ) || b(S, A))
-        ) && (A === M || b(
-          A,
+          ) || b(S, L))
+        ) && (L === M || b(
+          L,
           M
         ))
       ) || null,
       zone: M
     } : { element: null, zone: null };
   }, a = ((B = e == null ? void 0 : e.sensor) == null ? void 0 : B.setup) || ze, u = (h) => {
-    var M, D, A, S, C, U, O, R, j, J, X, Q;
+    var M, D, L, S, C, U, O, R, j, J, X, Q;
     const _ = t.hovered.element.value, P = t.hovered.zone.value;
-    t.hovered.element.value = h.element, t.hovered.zone.value = h.zone, _ && t.hovered.element.value !== _ && ((A = (D = (M = t.elementsMap.value.get(_)) == null ? void 0 : M.events) == null ? void 0 : D.onLeave) == null || A.call(D, t), t.hovered.element.value && ((U = (C = (S = t.elementsMap.value.get(t.hovered.element.value)) == null ? void 0 : S.events) == null ? void 0 : C.onHover) == null || U.call(C, t))), P && t.hovered.zone.value !== P && ((j = (R = (O = t.zonesMap.value.get(P)) == null ? void 0 : O.events) == null ? void 0 : R.onLeave) == null || j.call(R, t), t.hovered.zone.value && ((Q = (X = (J = t.zonesMap.value.get(t.hovered.zone.value)) == null ? void 0 : J.events) == null ? void 0 : X.onHover) == null || Q.call(X, t)));
+    t.hovered.element.value = h.element, t.hovered.zone.value = h.zone, _ && t.hovered.element.value !== _ && ((L = (D = (M = t.elementsMap.value.get(_)) == null ? void 0 : M.events) == null ? void 0 : D.onLeave) == null || L.call(
+      D,
+      t,
+      Array.from(t.draggingElements.value.values())
+    ), t.hovered.element.value && ((U = (C = (S = t.elementsMap.value.get(t.hovered.element.value)) == null ? void 0 : S.events) == null ? void 0 : C.onHover) == null || U.call(
+      C,
+      t,
+      Array.from(t.draggingElements.value.values())
+    ))), P && t.hovered.zone.value !== P && ((j = (R = (O = t.zonesMap.value.get(P)) == null ? void 0 : O.events) == null ? void 0 : R.onLeave) == null || j.call(
+      R,
+      t,
+      Array.from(t.draggingElements.value.values())
+    ), t.hovered.zone.value && ((Q = (X = (J = t.zonesMap.value.get(t.hovered.zone.value)) == null ? void 0 : J.events) == null ? void 0 : X.onHover) == null || Q.call(
+      X,
+      t,
+      Array.from(t.draggingElements.value.values())
+    )));
   }, f = Pe(() => {
     const h = a(t), _ = v(h);
     u(_);
@@ -617,29 +633,45 @@ const K = ce(() => {
       t.draggingElements.value = d(n.value), t.draggingElements.value.forEach(
         (_) => {
           var P, M;
-          return (M = (P = _.events).onStart) == null ? void 0 : M.call(P, t);
+          return (M = (P = _.events).onStart) == null ? void 0 : M.call(
+            P,
+            t,
+            Array.from(t.draggingElements.value.values())
+          );
         }
-      ), h instanceof PointerEvent ? r(h) : s(h), p();
+      ), h instanceof PointerEvent ? r(h) : o(h), p();
     },
     track: (h) => {
       t.draggingElements.value.forEach(
         (_) => {
           var P, M;
-          return (M = (P = _.events).onMove) == null ? void 0 : M.call(P, t);
+          return (M = (P = _.events).onMove) == null ? void 0 : M.call(
+            P,
+            t,
+            Array.from(t.draggingElements.value.values())
+          );
         }
       ), h instanceof KeyboardEvent ? g() : l(h);
     },
     deactivate: (h = !0) => {
       var _, P;
-      if (o(), i(), h) {
+      if (s(), i(), h) {
         if (t.hovered.zone.value) {
           const M = t.zonesMap.value.get(t.hovered.zone.value);
-          (P = M == null ? void 0 : (_ = M.events).onDrop) == null || P.call(_, t);
+          (P = M == null ? void 0 : (_ = M.events).onDrop) == null || P.call(
+            _,
+            t,
+            Array.from(t.draggingElements.value.values())
+          );
         } else
           t.draggingElements.value.forEach(
             (M) => {
-              var D, A;
-              return (A = (D = M.events).onEnd) == null ? void 0 : A.call(D, t);
+              var D, L;
+              return (L = (D = M.events).onEnd) == null ? void 0 : L.call(
+                D,
+                t,
+                Array.from(t.draggingElements.value.values())
+              );
             }
           );
         t.selectedElements.value.clear();
@@ -648,7 +680,7 @@ const K = ce(() => {
     }
   };
 }, be = ce(() => {
-  let n = "", e = "", t = "", r = null, l = null, o = null, s = null, g = null;
+  let n = "", e = "", t = "", r = null, l = null, s = null, o = null, g = null;
   const { activeContainer: i } = K(), c = () => {
     const u = document.body;
     n = u.style.userSelect, u.style.userSelect = "none", window.addEventListener("contextmenu", z), window.addEventListener("selectstart", z), window.addEventListener("touchstart", z), window.addEventListener("touchmove", z);
@@ -656,19 +688,19 @@ const K = ce(() => {
     const u = document.body;
     u.style.userSelect = n, u.style.touchAction = e, u.style.overscrollBehavior = t, window.removeEventListener("contextmenu", z), window.removeEventListener("selectstart", z), window.removeEventListener("touchstart", z), window.removeEventListener("touchmove", z);
   }, v = () => {
-    r && (document.removeEventListener("pointermove", r), r = null), l && (document.removeEventListener("pointerup", l), l = null), o && (o = null), s && (document.removeEventListener("wheel", s), s = null), g && (document.removeEventListener("keydown", g), document.removeEventListener("keypress", g), document.removeEventListener("keyup", g), g = null);
+    r && (document.removeEventListener("pointermove", r), r = null), l && (document.removeEventListener("pointerup", l), l = null), s && (s = null), o && (document.removeEventListener("wheel", o), o = null), g && (document.removeEventListener("keydown", g), document.removeEventListener("keypress", g), document.removeEventListener("keyup", g), g = null);
   };
   return {
     handleDragStart: (u, f, m) => {
       v(), u.target.blur(), m != null && m.container && (i.component.value = we(m.container));
-      const { activate: p, track: E, deactivate: L } = ke(f, m);
+      const { activate: p, track: E, deactivate: A } = ke(f, m);
       l = () => {
-        i.component.value = null, d(), L(!0), v();
-      }, o = () => {
-        i.component.value = null, d(), L(!1), v();
-      }, r = (w) => E(w), s = (w) => E(w), g = (w) => {
-        w.type === "keyup" && (w.code === "Escape" && (o == null || o()), w.code === "Enter" && (l == null || l())), E(w);
-      }, c(), p(u), document.addEventListener("pointermove", r), document.addEventListener("pointerup", l), document.addEventListener("wheel", s), document.addEventListener("keydown", g), document.addEventListener("keypress", g), document.addEventListener("keyup", g);
+        i.component.value = null, d(), A(!0), v();
+      }, s = () => {
+        i.component.value = null, d(), A(!1), v();
+      }, r = (w) => E(w), o = (w) => E(w), g = (w) => {
+        w.type === "keyup" && (w.code === "Escape" && (s == null || s()), w.code === "Enter" && (l == null || l())), E(w);
+      }, c(), p(u), document.addEventListener("pointermove", r), document.addEventListener("pointerup", l), document.addEventListener("wheel", o), document.addEventListener("keydown", g), document.addEventListener("keypress", g), document.addEventListener("keyup", g);
     }
   };
 }), Ye = (n) => {
@@ -677,16 +709,16 @@ const K = ce(() => {
     elementRef: t,
     isDragging: r,
     isOvered: l,
-    isAllowed: o,
-    registerElement: s,
+    isAllowed: s,
+    registerElement: o,
     unregisterElement: g
   } = Ie(n), { pointerPosition: i } = K(), { handleDragStart: c } = be(), d = (v) => c(v, t, n);
-  return G(s), ue(g), {
+  return G(o), ue(g), {
     pointerPosition: i,
     elementRef: t,
     isDragging: r,
     isOvered: l,
-    isAllowed: o,
+    isAllowed: s,
     handleDragStart: d,
     id: e
   };
@@ -696,28 +728,28 @@ const K = ce(() => {
     hovered: t,
     draggingElements: r,
     isDragging: l,
-    handleDropZoneIntersection: o
-  } = K(), s = V(null), g = T(() => t.zone.value === s.value), i = T(() => {
-    if (!s.value || !l.value) return !1;
-    const v = e.value.get(s.value);
+    handleDropZoneIntersection: s
+  } = K(), o = V(null), g = T(() => t.zone.value === o.value), i = T(() => {
+    if (!o.value || !l.value) return !1;
+    const v = e.value.get(o.value);
     return v != null && v.groups.length ? !Array.from(r.value.values()).some((a) => a.groups.length ? !a.groups.some(
       (u) => v.groups.includes(u)
     ) : !1) : !0;
   });
-  return { elementRef: s, registerZone: () => {
-    if (!s.value) throw new Error("elementRef is not set");
-    o("add", s.value), e.value.set(s.value, {
-      node: s.value,
+  return { elementRef: o, registerZone: () => {
+    if (!o.value) throw new Error("elementRef is not set");
+    s("add", o.value), e.value.set(o.value, {
+      node: o.value,
       groups: (n == null ? void 0 : n.groups) ?? [],
       events: (n == null ? void 0 : n.events) ?? {},
       data: (n == null ? void 0 : n.data) ?? void 0
-    }), s.value.setAttribute("data-dnd-droppable", "true");
+    }), o.value.setAttribute("data-dnd-droppable", "true");
   }, unregisterZone: () => {
-    s.value && (o("remove", s.value), e.value.delete(s.value));
+    o.value && (s("remove", o.value), e.value.delete(o.value));
   }, isOvered: g, isAllowed: i };
 }, Oe = (n) => {
-  const { elementRef: e, registerZone: t, unregisterZone: r, isOvered: l, isAllowed: o } = Te(n);
-  return G(t), ue(r), { elementRef: e, isOvered: l, isAllowed: o };
+  const { elementRef: e, registerZone: t, unregisterZone: r, isOvered: l, isAllowed: s } = Te(n);
+  return G(t), ue(r), { elementRef: e, isOvered: l, isAllowed: s };
 }, Re = (n) => {
   const { selectedElements: e, elementsMap: t } = K(), r = T(
     () => n.value ? e.value.has(n.value) : !1
@@ -727,30 +759,30 @@ const K = ce(() => {
       if (c && b(c, n.value))
         return !0;
     return !1;
-  }), o = T(() => {
+  }), s = T(() => {
     if (!n.value) return !1;
     for (const c of e.value)
       if (c && b(n.value, c))
         return !0;
     return !1;
-  }), s = () => {
+  }), o = () => {
     n.value && e.value.delete(n.value);
   }, g = () => {
     if (!(!n.value || !t.value.get(n.value))) {
       if (l.value)
         for (const d of e.value)
           d && b(d, n.value) && e.value.delete(d);
-      if (o.value)
+      if (s.value)
         for (const d of e.value)
           d && b(n.value, d) && e.value.delete(d);
       e.value.add(n.value);
     }
   };
   return {
-    handleUnselect: s,
+    handleUnselect: o,
     handleSelect: g,
     handleToggleSelect: () => {
-      n.value && (e.value.has(n.value) ? s() : g());
+      n.value && (e.value.has(n.value) ? o() : g());
     },
     isSelected: r,
     isParentOfSelected: l
@@ -761,7 +793,7 @@ export {
   Ve as default,
   H as getBoundingBox,
   K as useDnDStore,
-  Le as useDragContainer,
+  Ae as useDragContainer,
   Ye as useDraggable,
   Oe as useDroppable,
   Re as useSelection