@vue-dnd-kit/core 2.0.4 → 2.0.6

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

@@ -1,5 +1,5 @@
-(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)}pre{position:fixed;top:0;left:0;height:100svh}.dnd-kit-overlay-container{position:fixed;top:0;left:0;pointer-events:none;cursor:grabbing;z-index:9999}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
-import { ref as W, watch as oe, shallowRef as J, reactive as V, computed as b, onScopeDispose as We, onMounted as Y, onBeforeUnmount as X, inject as ze, defineComponent as Oe, unref as k, openBlock as C, createElementBlock as j, normalizeStyle as xe, Fragment as ue, renderList as je, createBlock as Q, resolveDynamicComponent as fe, createCommentVNode as Je, useTemplateRef as Qe, provide as et, renderSlot as Ae, Teleport as tt, createElementVNode as nt, mergeProps as st } from "vue";
+(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;z-index:9999}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
+import { ref as W, watch as oe, shallowRef as J, reactive as V, computed as y, onScopeDispose as We, onMounted as Y, onBeforeUnmount as X, inject as Oe, defineComponent as ze, unref as k, openBlock as C, createElementBlock as j, normalizeStyle as xe, Fragment as ue, renderList as je, createBlock as Q, resolveDynamicComponent as fe, createCommentVNode as Je, useTemplateRef as Qe, provide as et, renderSlot as Ae, Teleport as tt, createElementVNode as nt, mergeProps as st } from "vue";
 const T = {
   SELECT_AREA: "data-dnd-kit-select-area",
   DRAGGABLE: "data-dnd-kit-draggable",
@@ -11,25 +11,25 @@ const T = {
   CONSTRAINT_AREA: `[${T.CONSTRAINT_AREA}]`
 }, De = "VueDnDKitProvider", Ee = (e, t, s, n) => {
   const o = /* @__PURE__ */ new Set();
-  return t.forEach((a) => {
-    const r = e.get(a), i = n ? n(a) : r?.disabled;
-    if (!r || i) return;
-    const g = r.modifier?.keys, l = r.modifier?.method;
+  return t.forEach((r) => {
+    const a = e.get(r), i = n ? n(r) : a?.disabled;
+    if (!a || i) return;
+    const g = a.modifier?.keys, l = a.modifier?.method;
     if (!g || !l || g.length === 0) {
-      o.add(a);
+      o.add(r);
       return;
     }
-    g[l]((c) => s.value.has(c)) && o.add(a);
+    g[l]((c) => s.value.has(c)) && o.add(r);
   }), o;
 };
-let Be = "", ot = "", rt = "";
-const v = (e) => e.value ? e.value instanceof HTMLElement ? e.value : e.value.$el : null, H = (e, t) => e !== t && e.contains(t), it = (e, t) => !(e.right < t.left || e.left > t.right || e.bottom < t.top || e.top > t.bottom), de = () => {
+let Be = "", ot = "", at = "";
+const D = (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), de = () => {
   const e = document.body;
-  Be = e.style.userSelect, e.style.userSelect = "none", window.addEventListener("contextmenu", w), window.addEventListener("selectstart", w), window.addEventListener("touchstart", w), window.addEventListener("touchmove", w);
+  Be = e.style.userSelect, e.style.userSelect = "none", window.addEventListener("contextmenu", M), window.addEventListener("selectstart", M), window.addEventListener("touchstart", M), window.addEventListener("touchmove", M);
 }, me = () => {
   const e = document.body;
-  e.style.userSelect = Be, e.style.touchAction = ot, e.style.overscrollBehavior = rt, window.removeEventListener("contextmenu", w), window.removeEventListener("selectstart", w), window.removeEventListener("touchstart", w), window.removeEventListener("touchmove", w);
-}, w = (e) => e.preventDefault(), Me = (e, t) => {
+  e.style.userSelect = Be, e.style.touchAction = ot, e.style.overscrollBehavior = at, window.removeEventListener("contextmenu", M), window.removeEventListener("selectstart", M), window.removeEventListener("touchstart", M), window.removeEventListener("touchmove", M);
+}, M = (e) => e.preventDefault(), Me = (e, t) => {
   if (t.entities.draggableMap.get(e)?.disabled) return !0;
   for (const n of t.entities.visibleDraggableSet)
     if (t.entities.draggableMap.get(n)?.disabled && H(n, e)) return !0;
@@ -44,31 +44,31 @@ const v = (e) => e.value ? e.value instanceof HTMLElement ? e.value : e.value.$e
   const s = new Set(t);
   return e.some((n) => s.has(n));
 };
-function at(e, t, s, n) {
+function it(e, t, s, n) {
   const o = /* @__PURE__ */ new Set();
   for (const i of t.keys()) {
     const g = s.get(i);
     for (const l of g?.groups ?? []) o.add(l);
   }
-  const a = [...o], r = /* @__PURE__ */ new Set();
+  const r = [...o], a = /* @__PURE__ */ new Set();
   for (const i of e) {
     const l = n.get(i)?.groups ?? [];
-    ve(a, l) && r.add(i);
+    ve(r, l) && a.add(i);
   }
-  return r;
+  return a;
 }
 function lt(e, t, s) {
   const n = /* @__PURE__ */ new Set();
-  for (const r of t.keys()) {
-    const i = s.get(r);
+  for (const a of t.keys()) {
+    const i = s.get(a);
     for (const g of i?.groups ?? []) n.add(g);
   }
-  const o = [...n], a = /* @__PURE__ */ new Set();
-  for (const r of e) {
-    const g = s.get(r)?.groups ?? [];
-    ve(o, g) && a.add(r);
+  const o = [...n], r = /* @__PURE__ */ new Set();
+  for (const a of e) {
+    const g = s.get(a)?.groups ?? [];
+    ve(o, g) && r.add(a);
   }
-  return a;
+  return r;
 }
 const le = (e) => {
   const t = new IntersectionObserver((s) => {
@@ -86,8 +86,8 @@ const le = (e) => {
   const t = new ResizeObserver((s) => {
     const n = s[0];
     if (!n) return;
-    const { width: o, height: a } = n.contentRect;
-    e.value = { width: o, height: a };
+    const { width: o, height: r } = n.contentRect;
+    e.value = { width: o, height: r };
   });
   return {
     observe: (s) => t.observe(s),
@@ -97,8 +97,8 @@ const le = (e) => {
 }, gt = (e) => {
   const t = W(null), s = ct(t), n = oe(
     e,
-    (a) => {
-      s.disconnect(), a && s.observe(a);
+    (r) => {
+      s.disconnect(), r && s.observe(r);
     },
     { immediate: !0 }
   );
@@ -163,12 +163,12 @@ function mt(e, t) {
   }
   const {
     x: o = 0,
-    y: a = 0,
-    condition: r = "any"
+    y: r = 0,
+    condition: a = "any"
   } = t;
-  if (o === 0 && a === 0) return 1;
-  const i = o > 0 ? Math.min(s / o, 1) : 1, g = a > 0 ? Math.min(n / a, 1) : 1;
-  return r === "both" ? Math.min(i, g) : Math.max(i, g);
+  if (o === 0 && r === 0) return 1;
+  const i = o > 0 ? Math.min(s / o, 1) : 1, g = r > 0 ? Math.min(n / r, 1) : 1;
+  return a === "both" ? Math.min(i, g) : Math.max(i, g);
 }
 function He(e, t, s) {
   if (!s) return !0;
@@ -196,13 +196,13 @@ function bt(e, t) {
     }
     const o = e.entities.draggableMap.get(
       e.entities.initiatingDraggable
-    ), a = o?.activation?.delay;
-    if (!a) {
+    ), r = o?.activation?.delay;
+    if (!r) {
       s = null;
       return;
     }
     e.delay.progress = Math.min(
-      (Date.now() - e.delay.startTime) / (a * 1e3),
+      (Date.now() - e.delay.startTime) / (r * 1e3),
       1
     ), He(
       e.distanceProgress.value,
@@ -229,20 +229,20 @@ function pt(e, t, s, n) {
   return s === "x" ? { x: e, y: n.top } : s === "y" ? { x: n.left, y: t } : { x: e, y: t };
 }
 function St(e, t, s, n, o) {
-  let a = e, r = t;
-  return s !== "y" && (a = Math.max(
+  let r = e, a = t;
+  return s !== "y" && (r = Math.max(
     n.left,
     Math.min(n.right - o.width, e)
-  )), s !== "x" && (r = Math.max(
+  )), s !== "x" && (a = Math.max(
     n.top,
     Math.min(n.bottom - o.height, t)
-  )), { x: a, y: r };
+  )), { x: r, y: a };
 }
 function Dt(e, t, s, n, o) {
   if (!e || !t)
     return { x: 0, y: 0 };
-  const a = t.getBoundingClientRect(), r = a.width || o?.width || 0, i = a.height || o?.height || 0;
-  let g = e.current.x - r * e.offset.x, l = e.current.y - i * e.offset.y;
+  const r = t.getBoundingClientRect(), a = r.width || o?.width || 0, i = r.height || o?.height || 0;
+  let g = e.current.x - a * e.offset.x, l = e.current.y - i * e.offset.y;
   if (!s)
     return { x: g, y: l };
   const u = yt(s, n);
@@ -259,7 +259,7 @@ function Dt(e, t, s, n, o) {
     h.y,
     f.axis || "both",
     d,
-    a
+    r
   ) : h;
 }
 const N = {
@@ -279,7 +279,7 @@ const N = {
   forMoveFaster: ["ShiftLeft", "ShiftRight"]
 };
 function Mt(e, t) {
-  const s = J(), n = W(), a = {
+  const s = J(), n = W(), r = {
     keys: {
       pressedKeys: W(/* @__PURE__ */ new Set()),
       forDrag: [...N.forDrag],
@@ -290,7 +290,7 @@ function Mt(e, t) {
     },
     step: 8,
     moveFaster: 4
-  }, r = V({
+  }, a = V({
     draggableMap: /* @__PURE__ */ new Map(),
     droppableMap: /* @__PURE__ */ new Map(),
     selectableAreaMap: /* @__PURE__ */ new Map(),
@@ -299,27 +299,27 @@ function Mt(e, t) {
     selectingArea: void 0,
     draggingMap: /* @__PURE__ */ new Map(),
     selectedSet: /* @__PURE__ */ new Set(),
-    allowedDroppableSet: b(() => s.value ? at(
-      r.visibleDroppableSet,
-      r.draggingMap,
-      r.draggableMap,
-      r.droppableMap
+    allowedDroppableSet: y(() => s.value ? it(
+      a.visibleDroppableSet,
+      a.draggingMap,
+      a.draggableMap,
+      a.droppableMap
     ) : /* @__PURE__ */ new Set()),
-    allowedDraggableSet: b(() => s.value ? lt(
-      r.visibleDraggableSet,
-      r.draggingMap,
-      r.draggableMap
+    allowedDraggableSet: y(() => s.value ? lt(
+      a.visibleDraggableSet,
+      a.draggingMap,
+      a.draggableMap
     ) : /* @__PURE__ */ new Set()),
-    modifiersSelectableAreaSet: b(() => Ee(
-      r.selectableAreaMap,
-      r.visibleSelectableAreaSet,
-      a.keys.pressedKeys
+    modifiersSelectableAreaSet: y(() => Ee(
+      a.selectableAreaMap,
+      a.visibleSelectableAreaSet,
+      r.keys.pressedKeys
     )),
-    modifiersDraggableSet: b(() => Ee(
-      r.draggableMap,
-      r.visibleDraggableSet,
-      a.keys.pressedKeys,
-      (x) => Me(x, { entities: r })
+    modifiersDraggableSet: y(() => Ee(
+      a.draggableMap,
+      a.visibleDraggableSet,
+      r.keys.pressedKeys,
+      (w) => Me(w, { entities: a })
     )),
     visibleDraggableSet: /* @__PURE__ */ new Set(),
     visibleDroppableSet: /* @__PURE__ */ new Set(),
@@ -335,34 +335,34 @@ function Mt(e, t) {
   }), u = V({
     progress: 0,
     startTime: 0
-  }), c = b(() => {
-    if (!n.value || !r.initiatingDraggable) return 0;
-    const x = r.draggableMap.get(r.initiatingDraggable)?.activation?.distance;
-    return x ? mt(n.value, x) : 1;
+  }), c = y(() => {
+    if (!n.value || !a.initiatingDraggable) return 0;
+    const w = a.draggableMap.get(a.initiatingDraggable)?.activation?.distance;
+    return w ? mt(n.value, w) : 1;
   }), f = le(
-    r.visibleDraggableSet
+    a.visibleDraggableSet
   ), d = le(
-    r.visibleDroppableSet
+    a.visibleDroppableSet
   ), m = le(
-    r.visibleSelectableAreaSet
-  ), { overlaySize: h, overlaySizeObserver: p } = gt(e), y = W(), M = b(() => {
-    const D = r.initiatingDraggable;
+    a.visibleSelectableAreaSet
+  ), { overlaySize: h, overlaySizeObserver: S } = gt(e), b = W(), v = y(() => {
+    const p = a.initiatingDraggable;
     return Dt(
       n.value,
       e.value,
-      D || null,
-      r.constraintsAreaMap,
+      p || null,
+      a.constraintsAreaMap,
       h.value
     );
-  }), S = b({
+  }), E = y({
     get: () => t?.overlayTo,
-    set: (D) => S.value = D
-  }), U = b(() => t?.autoScrollViewport);
+    set: (p) => E.value = p
+  }), U = y(() => t?.autoScrollViewport);
   return {
     state: s,
     pointer: n,
-    entities: r,
-    keyboard: a,
+    entities: a,
+    keyboard: r,
     scrollPosition: l,
     delay: u,
     distanceProgress: c,
@@ -370,16 +370,16 @@ function Mt(e, t) {
     collision: g,
     overlay: {
       size: h,
-      position: M,
-      render: y,
+      position: v,
+      render: b,
       ref: e,
-      to: S
+      to: E
     },
     lib: {
       draggableObserver: f,
       droppableObserver: d,
       selectableAreaObserver: m,
-      overlaySizeObserver: p,
+      overlaySizeObserver: S,
       rectCache: /* @__PURE__ */ new Map()
     },
     autoScrollViewport: U
@@ -407,7 +407,7 @@ function we(e, t, s = 1) {
   return [...e.slice(0, n), ...e.slice(n + o)];
 }
 function G(e, t) {
-  const s = [...new Set(t)].filter((o) => o >= 0 && o < e.length).sort((o, a) => a - o);
+  const s = [...new Set(t)].filter((o) => o >= 0 && o < e.length).sort((o, r) => r - o);
   let n = e;
   for (const o of s) n = we(n, o, 1);
   return n;
@@ -432,11 +432,11 @@ const R = {
 function Ne(e, t) {
   const { draggedItems: s, dropZone: n, hoveredDraggable: o } = e;
   if (!s.length) return null;
-  const a = o?.placement.center === !0 && n != null && n.items !== o.items, r = a ? n.items : o?.items ?? n?.items;
-  if (!r) return null;
-  const i = s[0].items, g = s.map((f) => f.index), l = r.length;
+  const r = o?.placement.center === !0 && n != null && n.items !== o.items, a = r ? n.items : o?.items ?? n?.items;
+  if (!a) return null;
+  const i = s[0].items, g = s.map((f) => f.index), l = a.length;
   let u, c;
-  if (o && !a) {
+  if (o && !r) {
     const f = o.items === i && g.includes(o.index);
     if (f && s.length === 1) {
       const d = R.isAtZoneStart(n?.placement, t);
@@ -454,30 +454,30 @@ function Ne(e, t) {
     const f = R.isAtZoneStart(n.placement, t);
     u = f ? 0 : l, c = f ? "prepend" : "append";
   }
-  return { targetIndex: u, mode: c, targetArr: r };
+  return { targetIndex: u, mode: c, targetArr: a };
 }
 function vt(e, t = "vertical") {
   const { draggedItems: s } = e;
   if (!s.length) return null;
   const n = Ne(e, t);
   if (!n) return null;
-  const { targetArr: o, mode: a } = n;
-  let { targetIndex: r } = n;
+  const { targetArr: o, mode: r } = n;
+  let { targetIndex: a } = n;
   const i = s.map((c) => c.index), g = s.map((c) => c.item), l = s[0].items;
   if (l === o) {
-    const c = i.filter((d) => d < r).length;
-    r = Math.max(0, r - c);
-    const f = I(G(l, i), r, g);
-    return { sourceItems: f, targetItems: f, draggedItems: g, sourceIndexes: i, targetIndex: r, mode: a, sameList: !0 };
+    const c = i.filter((d) => d < a).length;
+    a = Math.max(0, a - c);
+    const f = I(G(l, i), a, g);
+    return { sourceItems: f, targetItems: f, draggedItems: g, sourceIndexes: i, targetIndex: a, mode: r, sameList: !0 };
   } else {
-    const c = G(l, i), f = I(o, r, g);
-    return { sourceItems: c, targetItems: f, draggedItems: g, sourceIndexes: i, targetIndex: r, mode: a, sameList: !1 };
+    const c = G(l, i), f = I(o, a, g);
+    return { sourceItems: c, targetItems: f, draggedItems: g, sourceIndexes: i, targetIndex: a, mode: r, sameList: !1 };
   }
 }
 function wt(e) {
   const { draggedItems: t, hoveredDraggable: s } = e;
   if (!t.length || !s) return null;
-  const n = t.map((u) => u.index), o = s.index, a = t.map((u) => u.item), r = s.item, i = t[0].items, g = s.items, l = i === g;
+  const n = t.map((u) => u.index), o = s.index, r = t.map((u) => u.item), a = s.item, i = t[0].items, g = s.items, l = i === g;
   if (l && n.includes(o)) return null;
   if (t.length === 1) {
     const u = n[0];
@@ -491,17 +491,17 @@ function wt(e) {
   } else {
     const u = Math.min(...n);
     if (l) {
-      const c = n.filter((y) => y < o).length, f = Math.max(0, o - c), d = n.filter((y) => y < u).length, m = Math.max(0, u - d);
+      const c = n.filter((b) => b < o).length, f = Math.max(0, o - c), d = n.filter((b) => b < u).length, m = Math.max(0, u - d);
       let h = G(i, n);
-      h = I(h, f, a);
-      const p = m >= f ? m + a.length : m;
-      return h = I(h, p, [r]), { sourceItems: h, targetItems: h, sourceIndexes: n, targetIndex: f, sameList: !0 };
+      h = I(h, f, r);
+      const S = m >= f ? m + r.length : m;
+      return h = I(h, S, [a]), { sourceItems: h, targetItems: h, sourceIndexes: n, targetIndex: f, sameList: !0 };
     } else {
       const c = n.filter((h) => h < u).length, f = Math.max(0, u - c);
       let d = G(i, n);
-      d = I(d, f, [r]);
+      d = I(d, f, [a]);
       let m = we(g, o);
-      return m = I(m, o, a), { sourceItems: d, targetItems: m, sourceIndexes: n, targetIndex: o, sameList: !1 };
+      return m = I(m, o, r), { sourceItems: d, targetItems: m, sourceIndexes: n, targetIndex: o, sameList: !1 };
     }
   }
 }
@@ -510,13 +510,13 @@ function xt(e, t = "vertical") {
   if (!s.length) return null;
   const n = Ne(e, t);
   if (!n) return null;
-  const { targetArr: o, targetIndex: a, mode: r } = n, i = s.map((l) => l.item);
-  return { targetItems: I(o, a, i), copiedItems: i, targetIndex: a, mode: r };
+  const { targetArr: o, targetIndex: r, mode: a } = n, i = s.map((l) => l.item);
+  return { targetItems: I(o, r, i), copiedItems: i, targetIndex: r, mode: a };
 }
 function At(e) {
   const { draggedItems: t } = e;
   if (!t.length) return null;
-  const s = t.map((r) => r.index), n = t.map((r) => r.item), o = t[0].items;
+  const s = t.map((a) => a.index), n = t.map((a) => a.item), o = t[0].items;
   return { sourceItems: G(o, s), removedItems: n, sourceIndexes: s };
 }
 function Et(e) {
@@ -543,68 +543,70 @@ const P = (e) => e.keys().next().value, Lt = (e) => e.target.closest(
 function Ct(e) {
   const t = e.entities.initiatingDraggable;
   if (!t) return [];
-  const n = (e.entities.draggingMap.get(t) ?? e.entities.draggableMap.get(t))?.payload;
-  if (!n) return [];
+  const s = e.entities.draggingMap.get(t) ?? e.entities.draggableMap.get(t), n = s?.payload;
+  if (!n)
+    return s?.data ? [{ index: -1, item: void 0, items: [], data: s.data() }] : [];
   const o = n();
   if (!Array.isArray(o) || o.length < 2) return [];
-  const [a, r, i] = o, g = Number(a), l = r, u = /* @__PURE__ */ new Map();
-  return u.set(g, {
-    index: g,
-    item: l[g],
-    items: l,
-    dropData: i
-  }), e.entities.draggingMap.forEach((c, f) => {
-    const m = e.entities.draggableMap.get(f)?.payload;
-    if (!m) return;
-    const h = m();
-    if (!Array.isArray(h) || h.length < 2) return;
-    const [p, y, M] = h;
-    if (y !== l) return;
-    const S = Number(p);
-    u.has(S) || u.set(S, {
-      index: S,
-      item: y[S],
-      items: l,
-      dropData: M
+  const [r, a] = o, i = Number(r), g = a, l = /* @__PURE__ */ new Map();
+  return l.set(i, {
+    index: i,
+    item: g[i],
+    items: g,
+    data: s?.data?.()
+  }), e.entities.draggingMap.forEach((u, c) => {
+    const f = e.entities.draggableMap.get(c), d = f?.payload;
+    if (!d) return;
+    const m = d();
+    if (!Array.isArray(m) || m.length < 2) return;
+    const [h, S] = m;
+    if (S !== g) return;
+    const b = Number(h);
+    l.has(b) || l.set(b, {
+      index: b,
+      item: S[b],
+      items: g,
+      data: f?.data?.()
     });
-  }), [...u.values()].sort((c, f) => c.index - f.index);
+  }), [...l.values()].sort((u, c) => u.index - c.index);
 }
-const E = (e, t) => {
+const A = (e, t) => {
   const s = Ct(e);
   let n, o;
   if (t) {
-    const r = e.entities.droppableMap.get(t)?.payload;
+    const r = e.entities.droppableMap.get(t);
     if (r) {
-      const l = r();
-      Array.isArray(l) && l.length >= 1 && (n = {
-        items: Array.isArray(l[0]) ? l[0] : [],
-        userData: l[1],
-        placement: e.hovered.droppable.get(t)
-      });
+      const g = r.payload;
+      n = {
+        items: g ? g() : [],
+        placement: e.hovered.droppable.get(t),
+        data: r.data?.()
+      };
     }
-    const i = P(e.hovered.draggable);
-    if (i && (i === t || t.contains(i)) && i) {
-      const u = e.entities.draggableMap.get(i)?.payload, c = e.hovered.draggable.get(i);
-      if (u) {
-        const f = u();
+    const a = P(e.hovered.draggable);
+    if (a && (a === t || t.contains(a)) && a) {
+      const g = e.entities.draggableMap.get(a), l = g?.payload, u = e.hovered.draggable.get(a), c = { top: !1, right: !1, bottom: !1, left: !1, center: !1 };
+      if (l) {
+        const f = l();
         if (Array.isArray(f) && f.length >= 2) {
-          const [d, m, h] = f, p = Number(d);
+          const [d, m] = f, h = Number(d);
           o = {
-            element: i,
-            placement: c ?? {
-              top: !1,
-              right: !1,
-              bottom: !1,
-              left: !1,
-              center: !1
-            },
-            index: p,
-            item: m[p],
+            element: a,
+            placement: u ?? c,
+            index: h,
+            item: m[h],
             items: m,
-            dropData: h
+            data: g?.data?.()
           };
         }
-      }
+      } else g?.data && (o = {
+        element: a,
+        placement: u ?? c,
+        index: -1,
+        item: void 0,
+        items: [],
+        data: g.data()
+      });
     }
   }
   return {
@@ -617,26 +619,26 @@ const E = (e, t) => {
 }, B = (e, t, s) => {
   if (!t) return;
   const n = e.entities.draggingMap.get(t) ?? e.entities.draggableMap.get(t);
-  !n || n.disabled || n.events?.[s]?.(E(e));
-}, A = (e, t) => {
-  const s = E(e);
+  !n || n.disabled || n.events?.[s]?.(A(e));
+}, x = (e, t) => {
+  const s = A(e);
   e.entities.draggingMap.forEach((n) => {
     n.disabled || n.events?.[t]?.(s);
   });
 }, It = (e, t, s) => {
   if (t !== s) {
     if (t && !_(t, e)) {
-      const n = E(e, t);
+      const n = A(e, t);
       e.entities.droppableMap.get(t)?.events?.onLeave?.(n);
     }
     if (s && !_(s, e)) {
-      const n = E(e, s);
+      const n = A(e, s);
       e.entities.droppableMap.get(s)?.events?.onEnter?.(n);
     }
   }
 }, Rt = (e, t, s) => {
   if (t !== s) {
-    const n = E(e);
+    const n = A(e);
     if (t) {
       const o = e.entities.draggableMap.get(t);
       o && !o.disabled && o.events?.onLeave?.(n);
@@ -648,23 +650,23 @@ const E = (e, t) => {
   }
 }, ce = (e, t, s) => {
   const n = Lt(t);
-  !n || !e.entities.draggingMap.has(n) || e.entities.draggingMap.get(n)?.events?.[s]?.(E(e));
+  !n || !e.entities.draggingMap.has(n) || e.entities.draggingMap.get(n)?.events?.[s]?.(A(e));
 }, kt = (e, t) => {
   const s = P(t.droppable);
-  s && !_(s, e) && e.entities.droppableMap.get(s)?.events?.onLeave?.(E(e, s));
+  s && !_(s, e) && e.entities.droppableMap.get(s)?.events?.onLeave?.(A(e, s));
 }, Ze = (e, t) => {
   const s = P(t.droppable);
-  s && !_(s, e) && e.entities.droppableMap.get(s)?.events?.onLeave?.(E(e, s));
+  s && !_(s, e) && e.entities.droppableMap.get(s)?.events?.onLeave?.(A(e, s));
 };
 function Pt(e) {
   return e.parentElement?.closest(F.SELECT_AREA) ?? null;
 }
 const Tt = (e, t, s) => {
   if (!s) return {};
-  const n = s.getBoundingClientRect(), o = Math.max(n.left, Math.min(e.x, t.x)), a = Math.max(n.top, Math.min(e.y, t.y)), r = Math.min(n.right, Math.max(e.x, t.x)), i = Math.min(n.bottom, Math.max(e.y, t.y)), g = Math.max(0, r - o), l = Math.max(0, i - a);
+  const n = s.getBoundingClientRect(), o = Math.max(n.left, Math.min(e.x, t.x)), r = Math.max(n.top, Math.min(e.y, t.y)), a = Math.min(n.right, Math.max(e.x, t.x)), i = Math.min(n.bottom, Math.max(e.y, t.y)), g = Math.max(0, a - o), l = Math.max(0, i - r);
   return {
     left: `${o}px`,
-    top: `${a}px`,
+    top: `${r}px`,
     width: `${g}px`,
     height: `${l}px`,
     position: "fixed",
@@ -672,34 +674,34 @@ const Tt = (e, t, s) => {
     border: "1px solid #3b82f6",
     backgroundColor: "#3b82f61a"
   };
-}, zt = (e) => {
+}, Ot = (e) => {
   if (!e.pointer.value || !e.entities.selectingArea) return;
-  const { selectingArea: t } = e.entities, s = Ot(
+  const { selectingArea: t } = e.entities, s = zt(
     e.pointer.value.start,
     e.pointer.value.current
   ), n = e.entities.selectableAreaMap.get(t)?.groups ?? [], o = e.lib.rectCache;
-  e.entities.visibleDraggableSet.forEach((a) => {
-    if (a === t || !t.contains(a)) return;
-    const r = Pt(a);
-    if (r && r !== t) {
-      e.entities.selectedSet.delete(a);
+  e.entities.visibleDraggableSet.forEach((r) => {
+    if (r === t || !t.contains(r)) return;
+    const a = Pt(r);
+    if (a && a !== t) {
+      e.entities.selectedSet.delete(r);
       return;
     }
-    if (Me(a, e)) {
-      e.entities.selectedSet.delete(a);
+    if (Me(r, e)) {
+      e.entities.selectedSet.delete(r);
       return;
     }
-    const g = e.entities.draggableMap.get(a)?.groups ?? [];
+    const g = e.entities.draggableMap.get(r)?.groups ?? [];
     if (!ve(n, g)) {
-      e.entities.selectedSet.delete(a);
+      e.entities.selectedSet.delete(r);
       return;
     }
-    let l = o.get(a);
-    l || (l = a.getBoundingClientRect(), o.set(a, l)), it(s, l) ? e.entities.selectedSet.add(a) : e.entities.selectedSet.delete(a);
+    let l = o.get(r);
+    l || (l = r.getBoundingClientRect(), o.set(r, l)), rt(s, l) ? e.entities.selectedSet.add(r) : e.entities.selectedSet.delete(r);
   });
-}, Ot = (e, t) => {
-  const s = Math.min(e.x, t.x), n = Math.min(e.y, t.y), o = Math.max(e.x, t.x), a = Math.max(e.y, t.y), r = o - s, i = a - n;
-  return new DOMRect(s, n, r, i);
+}, zt = (e, t) => {
+  const s = Math.min(e.x, t.x), n = Math.min(e.y, t.y), o = Math.max(e.x, t.x), r = Math.max(e.y, t.y), a = o - s, i = r - n;
+  return new DOMRect(s, n, a, i);
 }, Bt = (e, t, s = 5) => {
   const n = s / 2;
   return {
@@ -711,7 +713,7 @@ const Tt = (e, t, s) => {
 }, Ft = (e) => {
   const t = e.pointer.value?.current, s = t?.x ?? 0, n = t?.y ?? 0;
   return Bt(s, n, 5);
-}, O = (e, t, s) => {
+}, z = (e, t, s) => {
   const n = e.left + e.width / 2, o = e.top + e.height / 2;
   if (s) {
     const i = s.top ?? 0, g = s.right ?? 0, l = s.bottom ?? 0, u = s.left ?? 0, c = t.left + u, f = t.right - g, d = t.top + i, m = t.bottom - l;
@@ -724,12 +726,12 @@ const Tt = (e, t, s) => {
         center: !0
       };
   }
-  const a = t.left + t.width / 2, r = t.top + t.height / 2;
+  const r = t.left + t.width / 2, a = t.top + t.height / 2;
   return {
-    top: o <= r,
-    bottom: o > r,
-    left: n <= a,
-    right: n > a,
+    top: o <= a,
+    bottom: o > a,
+    left: n <= r,
+    right: n > r,
     center: !1
   };
 }, _t = (e) => ({
@@ -748,42 +750,42 @@ function $(e, t) {
 const Ht = (e, t) => e.find((s) => s !== t && H(t, s)), ne = (e, t, s) => {
   const n = P(t.droppable), o = P(t.draggable);
   o && t.draggable.delete(o), n && t.droppable.delete(n);
-  const a = Ft(e), r = s.zones[0], i = s.elements[0];
-  if (r && i && r === i && e.entities.droppableMap.has(r) && r) {
-    const c = r.getBoundingClientRect(), f = e.entities.draggableMap.get(r)?.placementMargins, d = O(a, c, f);
+  const r = Ft(e), a = s.zones[0], i = s.elements[0];
+  if (a && i && a === i && e.entities.droppableMap.has(a) && a) {
+    const c = a.getBoundingClientRect(), f = e.entities.draggableMap.get(a)?.placementMargins, d = z(r, c, f);
     if (d.center) {
-      t.droppable.set(r, d);
-      const m = Ht(s.elements, r);
+      t.droppable.set(a, d);
+      const m = Ht(s.elements, a);
       if (m) {
         const h = m.getBoundingClientRect();
         t.draggable.set(
           m,
-          O(a, h, void 0)
+          z(r, h, void 0)
         );
       }
     } else
       t.draggable.set(i, d);
   } else {
-    if (r) {
-      const c = r.getBoundingClientRect();
-      t.droppable.set(r, O(a, c));
+    if (a) {
+      const c = a.getBoundingClientRect();
+      t.droppable.set(a, z(r, c));
     }
     if (i)
-      if (r)
-        if (H(r, i)) {
+      if (a)
+        if (H(a, i)) {
           const c = i.getBoundingClientRect(), f = e.entities.draggableMap.get(i)?.placementMargins;
           t.draggable.set(
             i,
-            O(a, c, f)
+            z(r, c, f)
           );
         } else {
-          const c = e.pointer.value?.current ?? { x: 0, y: 0 }, f = r.getBoundingClientRect(), d = i.getBoundingClientRect(), m = Le(c, f);
+          const c = e.pointer.value?.current ?? { x: 0, y: 0 }, f = a.getBoundingClientRect(), d = i.getBoundingClientRect(), m = Le(c, f);
           if (Le(c, d) < m) {
             t.droppable.clear();
-            const p = e.entities.draggableMap.get(i)?.placementMargins;
+            const S = e.entities.draggableMap.get(i)?.placementMargins;
             t.draggable.set(
               i,
-              O(a, d, p)
+              z(r, d, S)
             );
           }
         }
@@ -791,7 +793,7 @@ const Ht = (e, t) => e.find((s) => s !== t && H(t, s)), ne = (e, t, s) => {
         const c = i.getBoundingClientRect(), f = e.entities.draggableMap.get(i)?.placementMargins;
         t.draggable.set(
           i,
-          O(a, c, f)
+          z(r, c, f)
         );
       }
   }
@@ -837,26 +839,26 @@ const Ht = (e, t) => e.find((s) => s !== t && H(t, s)), ne = (e, t, s) => {
   ), n = Math.max(
     0,
     Math.min(e.y + e.height, t.y + t.height) - Math.max(e.y, t.y)
-  ), o = s * n, a = e.width * e.height, r = t.width * t.height;
-  return a === 0 || r === 0 ? 0 : (o / a * 100 + o / r * 100) / 2;
+  ), o = s * n, r = e.width * e.height, a = t.width * t.height;
+  return r === 0 || a === 0 ? 0 : (o / r * 100 + o / a * 100) / 2;
 }, Nt = (e, t, s) => t >= e.x && t <= e.x + e.width && s >= e.y && s <= e.y + e.height, Zt = (e) => e.overlay.ref?.value ?? null, Yt = (e) => {
   const t = e.overlay.position?.value ?? { x: 0, y: 0 }, { x: s, y: n } = t, o = e.overlay.size?.value;
-  let a, r;
+  let r, a;
   if (o)
-    a = o.width, r = o.height;
+    r = o.width, a = o.height;
   else {
     const i = e.overlay.ref?.value?.getBoundingClientRect();
-    a = i?.width ?? 0, r = i?.height ?? 0;
+    r = i?.width ?? 0, a = i?.height ?? 0;
   }
   return {
     x: s,
     y: n,
-    width: a,
-    height: r,
+    width: r,
+    height: a,
     top: n,
     left: s,
-    right: s + a,
-    bottom: n + r
+    right: s + r,
+    bottom: n + a
   };
 }, Ye = (e) => e.entities.allowedDraggableSet, Xe = (e) => e.entities.allowedDroppableSet, Xt = (e, t) => !t.entities.draggingMap.has(e), Ut = (e, t) => ![...t.entities.draggingMap.keys()].some(
   (s) => H(s, e)
@@ -868,24 +870,24 @@ function q(e, t) {
   );
 }
 function $t(e) {
-  const t = e.pointer.value?.current ?? { x: 0, y: 0 }, s = document.elementsFromPoint(t.x, t.y), n = Ye(e), o = Xe(e), a = [], r = [];
+  const t = e.pointer.value?.current ?? { x: 0, y: 0 }, s = document.elementsFromPoint(t.x, t.y), n = Ye(e), o = Xe(e), r = [], a = [];
   for (const i of s) {
     const g = n.has(i), l = o.has(i);
-    !g && !l || ye(i, e) && (g && a.push(i), l && r.push(i));
+    !g && !l || ye(i, e) && (g && r.push(i), l && a.push(i));
   }
-  return a.length === 0 && r.length === 0 ? null : { elements: a, zones: r };
+  return r.length === 0 && a.length === 0 ? null : { elements: r, zones: a };
 }
 const pe = (e) => {
   if (!Zt(e)) return { elements: [], zones: [] };
   const s = $t(e);
   if (s) return s;
-  const n = Yt(e), o = e.pointer.value?.current ?? { x: 0, y: 0 }, a = [...Ye(e)].filter(
+  const n = Yt(e), o = e.pointer.value?.current ?? { x: 0, y: 0 }, r = [...Ye(e)].filter(
     (l) => ye(l, e)
-  ), r = [...Xe(e)].filter(
+  ), a = [...Xe(e)].filter(
     (l) => ye(l, e)
-  ), i = a.map((l) => ({ n: l, box: se(l) })).filter(
+  ), i = r.map((l) => ({ n: l, box: se(l) })).filter(
     ({ box: l }) => Ce(l, n) && be(l, n) >= Ie
-  ).sort((l, u) => q(l.box, o) - q(u.box, o)).map(({ n: l }) => l), g = r.map((l) => ({ n: l, box: se(l) })).filter(
+  ).sort((l, u) => q(l.box, o) - q(u.box, o)).map(({ n: l }) => l), g = a.map((l) => ({ n: l, box: se(l) })).filter(
     ({ box: l }) => Ce(l, n) && be(l, n) >= Ie
   ).sort((l, u) => q(l.box, o) - q(u.box, o)).map(({ n: l }) => l);
   return { elements: i, zones: g };
@@ -911,23 +913,23 @@ function qt(e, t) {
 async function Ue(e) {
   const t = e.hovered.droppable.keys().next().value;
   if (!t || _(t, e)) return "accept";
-  const s = e.entities.droppableMap.get(t), n = E(e, t), o = s?.events?.onDrop?.(n);
+  const s = e.entities.droppableMap.get(t), n = A(e, t), o = s?.events?.onDrop?.(n);
   if (o != null && typeof o.then == "function") {
     e.state.value = "pending";
-    let r;
+    let a;
     try {
-      r = await o;
+      a = await o;
     } catch {
       const i = e.entities.initiatingDraggable;
-      return B(e, i, "onSelfDragCancel"), A(e, "onDragCancel"), Ze(e, e.hovered), "cancel";
+      return B(e, i, "onSelfDragCancel"), x(e, "onDragCancel"), Ze(e, e.hovered), "cancel";
     }
-    return r === !1 ? (e.state.value = "dragging", "decline") : "accept";
+    return a === !1 ? (e.state.value = "dragging", "decline") : "accept";
   }
   return o === !1 ? "decline" : "accept";
 }
 function Ve(e) {
   const t = e.entities.initiatingDraggable;
-  B(e, t, "onSelfDragEnd"), A(e, "onDragEnd"), kt(e, e.hovered);
+  B(e, t, "onSelfDragEnd"), x(e, "onDragEnd"), kt(e, e.hovered);
 }
 function Wt(e) {
   const t = e.entities.selectingArea;
@@ -953,15 +955,15 @@ const jt = (e) => {
   }, o = (i) => {
     if (e.pointer.value) {
       if (e.pointer.value.current = { x: i.clientX, y: i.clientY }, ht(e)) {
-        ce(e, i, "onSelfDragStart"), A(e, "onDragStart");
+        ce(e, i, "onSelfDragStart"), x(e, "onDragStart");
         return;
       }
       if (e.state.value === "dragging") {
         qt(e, s);
         const g = e.entities.initiatingDraggable;
-        B(e, g, "onSelfDragMove"), A(e, "onDragMove");
+        B(e, g, "onSelfDragMove"), x(e, "onDragMove");
       }
-      e.state.value === "selecting" && zt(e);
+      e.state.value === "selecting" && Ot(e);
     }
   };
   return { pointerDown: (i) => {
@@ -982,8 +984,8 @@ const jt = (e) => {
       de(), e.entities.initiatingDraggable = u;
       const f = Fe(i, u);
       e.pointer.value = he(i, f.x, f.y), c?.activation?.distance || c?.activation?.delay ? (e.state.value = "activating", c?.activation?.delay && (e.delay.startTime = Date.now(), t.current = bt(e, () => {
-        ee(e), ce(e, i, "onSelfDragStart"), A(e, "onDragStart");
-      }))) : (ee(e), ce(e, i, "onSelfDragStart"), A(e, "onDragStart"));
+        ee(e), ce(e, i, "onSelfDragStart"), x(e, "onDragStart");
+      }))) : (ee(e), ce(e, i, "onSelfDragStart"), x(e, "onDragStart"));
     }
   }, pointerUp: n, pointerMove: o, cleanup: () => {
     t.current?.cancel(), document.removeEventListener("pointerup", n), document.removeEventListener("pointermove", o), e.lib.draggableObserver.disconnect(), e.lib.droppableObserver.disconnect(), e.lib.selectableAreaObserver.disconnect(), e.lib.overlaySizeObserver.disconnect();
@@ -1005,7 +1007,7 @@ const jt = (e) => {
         e,
         e.entities.initiatingDraggable,
         "onSelfDragCancel"
-      ), A(e, "onDragCancel"), Ze(e, e.hovered), te(e);
+      ), x(e, "onDragCancel"), Ze(e, e.hovered), te(e);
       return;
     }
     if (s.forDrop.includes(t.code)) {
@@ -1015,19 +1017,19 @@ const jt = (e) => {
     const o = Jt[t.code];
     if (o && s.forMove.includes(t.code) && e.pointer.value) {
       t.preventDefault();
-      const a = s.forMoveFaster.some(
+      const r = s.forMoveFaster.some(
         (l) => s.pressedKeys.value.has(l)
-      ), r = e.keyboard.step * (a ? e.keyboard.moveFaster : 1);
+      ), a = e.keyboard.step * (r ? e.keyboard.moveFaster : 1);
       e.pointer.value.current = {
-        x: e.pointer.value.current.x + o.dx * r,
-        y: e.pointer.value.current.y + o.dy * r
+        x: e.pointer.value.current.x + o.dx * a,
+        y: e.pointer.value.current.y + o.dy * a
       };
       const g = (e.collision?.run ?? pe)(e);
       ne(e, e.hovered, g), B(
         e,
         e.entities.initiatingDraggable,
         "onSelfDragMove"
-      ), A(e, "onDragMove");
+      ), x(e, "onDragMove");
       return;
     }
     return;
@@ -1035,28 +1037,28 @@ const jt = (e) => {
   if (s.forDrag.includes(t.code)) {
     const o = document.activeElement;
     if (!o) return;
-    const a = o.closest(
+    const r = o.closest(
       F.DRAGGABLE
     );
-    if (!a || e.entities.modifiersDraggableSet.size === 0 || !e.entities.modifiersDraggableSet.has(a))
+    if (!r || e.entities.modifiersDraggableSet.size === 0 || !e.entities.modifiersDraggableSet.has(r))
       return;
-    const r = e.entities.draggableMap.get(a);
-    if (!Ge(o, a, r?.dragHandle, !0))
+    const a = e.entities.draggableMap.get(r);
+    if (!Ge(o, r, a?.dragHandle, !0))
       return;
     t.preventDefault(), de();
-    const i = a.getBoundingClientRect(), g = i.left + i.width / 2, l = i.top + i.height / 2, u = {
+    const i = r.getBoundingClientRect(), g = i.left + i.width / 2, l = i.top + i.height / 2, u = {
       clientX: g,
       clientY: l
     };
-    e.entities.initiatingDraggable = a;
-    const c = Fe(u, a);
+    e.entities.initiatingDraggable = r;
+    const c = Fe(u, r);
     e.pointer.value = he(
       u,
       c.x,
       c.y
     ), ee(e);
     const d = (e.collision?.run ?? pe)(e);
-    ne(e, e.hovered, d), B(e, a, "onSelfDragStart"), A(e, "onDragStart");
+    ne(e, e.hovered, d), B(e, r, "onSelfDragStart"), x(e, "onDragStart");
   }
 }, en = (e) => (t) => {
   e.keyboard.keys.pressedKeys.value.delete(t.code);
@@ -1087,7 +1089,7 @@ function on(e) {
     left: e.left ?? L
   };
 }
-const rn = {
+const an = {
   getScrollState(e) {
     return {
       scrollTop: e.scrollTop,
@@ -1098,29 +1100,29 @@ const rn = {
     e.scrollTop = t, e.scrollLeft = s;
   }
 };
-function $e(e, t, s, n = rn, o) {
-  const { speed: a = 10, disabled: r = !1 } = t, i = on(t.threshold);
+function $e(e, t, s, n = an, o) {
+  const { speed: r = 10, disabled: a = !1 } = t, i = on(t.threshold);
   let g = null, l = null, u = null, c = 0, f = 0;
-  const d = (y) => {
-    o && (o.value = y);
-  }, m = (y) => {
-    const M = e.value, S = s();
-    if (!M || !S || r) {
+  const d = (b) => {
+    o && (o.value = b);
+  }, m = (b) => {
+    const v = e.value, E = s();
+    if (!v || !E || a) {
       d(!1);
       return;
     }
-    l || (l = y);
-    const U = y - l;
+    l || (l = b);
+    const U = b - l;
     if (U < Re) {
       g = requestAnimationFrame(m);
       return;
     }
-    const D = a * (U / Re);
-    l = y;
-    const { scrollTop: x, scrollLeft: K } = n.getScrollState(M);
-    (!u || c !== x || f !== K) && (u = n.getRect ? n.getRect(M) : M.getBoundingClientRect(), c = x, f = K);
-    let z = !1, ie = x, ae = K;
-    i.top > 0 && S.y - u.top < i.top ? (ie = x - D, z = !0) : i.bottom > 0 && u.bottom - S.y < i.bottom && (ie = x + D, z = !0), i.left > 0 && S.x - u.left < i.left ? (ae = K - D, z = !0) : i.right > 0 && u.right - S.x < i.right && (ae = K + D, z = !0), z && n.setScroll(M, ie, ae), d(z), g = requestAnimationFrame(m);
+    const p = r * (U / Re);
+    l = b;
+    const { scrollTop: w, scrollLeft: K } = n.getScrollState(v);
+    (!u || c !== w || f !== K) && (u = n.getRect ? n.getRect(v) : v.getBoundingClientRect(), c = w, f = K);
+    let O = !1, re = w, ie = K;
+    i.top > 0 && E.y - u.top < i.top ? (re = w - p, O = !0) : i.bottom > 0 && u.bottom - E.y < i.bottom && (re = w + p, O = !0), i.left > 0 && E.x - u.left < i.left ? (ie = K - p, O = !0) : i.right > 0 && u.right - E.x < i.right && (ie = K + p, O = !0), O && n.setScroll(v, re, ie), d(O), g = requestAnimationFrame(m);
   };
   return { run: () => {
     l = null, g = requestAnimationFrame(m);
@@ -1128,7 +1130,7 @@ function $e(e, t, s, n = rn, o) {
     g && (cancelAnimationFrame(g), g = null), u = null, c = 0, f = 0, l = null, d(!1);
   } };
 }
-const an = {
+const rn = {
   getScrollState() {
     return {
       scrollTop: window.scrollY ?? document.documentElement.scrollTop,
@@ -1158,41 +1160,41 @@ function cn(e, t) {
         y: i.y + g.height / 2
       } : i : null;
     },
-    an,
+    rn,
     s
-  ), a = oe(
+  ), r = oe(
     () => e.state.value,
     (i) => {
       i === "dragging" ? o.run() : o.stop();
     }
-  ), r = () => {
-    a(), o.stop();
+  ), a = () => {
+    r(), o.stop();
   };
-  return We(r), { isScrolling: s, stop: r };
+  return We(a), { isScrolling: s, stop: a };
 }
 const gn = (e) => {
-  const t = jt(e), s = ge.keyDown(e), n = ge.keyUp(e), o = ge.clear(e), a = nn(e);
-  let r = null;
+  const t = jt(e), s = ge.keyDown(e), n = ge.keyUp(e), o = ge.clear(e), r = nn(e);
+  let a = null;
   oe(
     e.autoScrollViewport,
     (i) => {
-      r?.(), r = null, (i === !0 || i && typeof i == "object") && (r = cn(
+      a?.(), a = null, (i === !0 || i && typeof i == "object") && (a = cn(
         e,
         i === !0 ? {} : i
       ).stop);
     },
     { immediate: !0 }
   ), Y(() => {
-    document.addEventListener("pointerdown", t.pointerDown), document.addEventListener("keydown", s), document.addEventListener("keyup", n), document.addEventListener("blur", o), document.addEventListener("scroll", a, !0);
+    document.addEventListener("pointerdown", t.pointerDown), document.addEventListener("keydown", s), document.addEventListener("keyup", n), document.addEventListener("blur", o), document.addEventListener("scroll", r, !0);
   }), X(() => {
-    document.removeEventListener("pointerdown", t.pointerDown), document.removeEventListener("pointerup", t.pointerUp), document.removeEventListener("pointermove", t.pointerMove), document.removeEventListener("keydown", s), document.removeEventListener("keyup", n), document.removeEventListener("blur", o), document.removeEventListener("scroll", a, !0), r?.(), t.cleanup();
+    document.removeEventListener("pointerdown", t.pointerDown), document.removeEventListener("pointerup", t.pointerUp), document.removeEventListener("pointermove", t.pointerMove), document.removeEventListener("keydown", s), document.removeEventListener("keyup", n), document.removeEventListener("blur", o), document.removeEventListener("scroll", r, !0), a?.(), t.cleanup();
   });
-}, re = () => {
-  const e = ze(De);
+}, ae = () => {
+  const e = Oe(De);
   if (!e) throw Error("DnD provider not found");
   return e;
 }, qe = () => {
-  const e = re();
+  const e = ae();
   return {
     overlay: e.overlay,
     delay: e.delay,
@@ -1206,11 +1208,11 @@ const gn = (e) => {
     collision: e.collision,
     autoScrollViewport: e.autoScrollViewport
   };
-}, un = /* @__PURE__ */ Oe({
+}, un = /* @__PURE__ */ ze({
   __name: "DefaultOverlay",
   setup(e) {
     const { entities: t, state: s, overlay: n } = qe();
-    return (o, a) => k(s) === "dragging" ? (C(), j("div", {
+    return (o, r) => k(s) === "dragging" ? (C(), j("div", {
       key: 0,
       class: "dnd-kit-default-overlay",
       style: xe({
@@ -1218,8 +1220,8 @@ const gn = (e) => {
         "--position-y": k(n).position.value.y + "px"
       })
     }, [
-      (C(!0), j(ue, null, je(k(t).draggingMap, ([r, i]) => (C(), j(ue, null, [
-        k(t).draggableMap.get(r)?.render ? (C(), Q(fe(k(t).draggableMap.get(r)?.render), { key: 0 })) : (C(), Q(fe(r.tagName), {
+      (C(!0), j(ue, null, je(k(t).draggingMap, ([a, i]) => (C(), j(ue, null, [
+        k(t).draggableMap.get(a)?.render ? (C(), Q(fe(k(t).draggableMap.get(a)?.render), { key: 0 })) : (C(), Q(fe(a.tagName), {
           key: 1,
           innerHTML: i.initialOuterHTML,
           style: xe({
@@ -1230,7 +1232,7 @@ const gn = (e) => {
       ], 64))), 256))
     ], 4)) : Je("", !0);
   }
-}), hn = /* @__PURE__ */ Oe({
+}), hn = /* @__PURE__ */ ze({
   __name: "DnDProvider",
   props: {
     autoScrollViewport: { type: [Object, Boolean, null] },
@@ -1241,11 +1243,11 @@ const gn = (e) => {
   setup(e) {
     const t = e, s = Qe("overlayRef"), n = Mt(s, t);
     gn(n);
-    const o = b(
+    const o = y(
       () => n.overlay.render.value ?? un
     );
-    return et(De, n), (a, r) => (C(), j(ue, null, [
-      Ae(a.$slots, "default"),
+    return et(De, n), (r, a) => (C(), j(ue, null, [
+      Ae(r.$slots, "default"),
       (C(), Q(tt, {
         to: k(n).overlay.to.value || "body"
       }, [
@@ -1254,7 +1256,7 @@ const gn = (e) => {
           ref: s,
           class: "dnd-kit-overlay-container"
         }, t), [
-          Ae(a.$slots, "overlay", { overlay: o.value }, () => [
+          Ae(r.$slots, "overlay", { overlay: o.value }, () => [
             (C(), Q(fe(o.value)))
           ])
         ], 16)
@@ -1263,44 +1265,45 @@ const gn = (e) => {
   }
 });
 function bn(e, t, s) {
-  const n = re();
-  let o, a, r;
-  typeof t == "function" ? (o = {}, a = t) : (o = t ?? {}, a = s);
-  const i = b({
+  const n = ae();
+  let o, r, a;
+  typeof t == "function" ? (o = {}, r = t) : (o = t ?? {}, r = s);
+  const i = y({
     get() {
-      const c = v(e);
+      const c = D(e);
       return c ? n.entities.selectedSet.has(c) : !1;
     },
     set(c) {
-      const f = v(e);
+      const f = D(e);
       f && n.entities.selectedSet[c ? "add" : "delete"](f);
     }
-  }), g = b(() => {
-    const c = v(e);
+  }), g = y(() => {
+    const c = D(e);
     return c ? n.entities.draggingMap.has(c) : !1;
-  }), l = b(() => {
-    const c = v(e);
+  }), l = y(() => {
+    const c = D(e);
     return c ? n.entities.allowedDraggableSet.has(c) : !1;
-  }), u = b(() => {
-    const c = v(e);
+  }), u = y(() => {
+    const c = D(e);
     if (c)
       return n.entities.draggableMap.get(c)?.hoveredPlacement;
   });
   return Y(() => {
-    r = v(e), r && (r.addEventListener("dragstart", w), r.addEventListener("drag", w), r.addEventListener("dragend", w), r.setAttribute(T.DRAGGABLE, ""), n.lib.draggableObserver.observe(r), n.entities.draggableMap.set(r, {
+    a = D(e), a && (a.addEventListener("dragstart", M), a.addEventListener("drag", M), a.addEventListener("dragend", M), a.setAttribute(T.DRAGGABLE, ""), n.lib.draggableObserver.observe(a), n.entities.draggableMap.set(a, {
       render: o.render,
       disabled: o.disabled ?? !1,
       groups: o.groups ?? [],
       modifier: o.modifier,
       events: o.events,
-      payload: a,
+      payload: r,
+      data: o.data,
       dragHandle: o.dragHandle,
       activation: o.activation,
       placementMargins: o.placementMargins,
       hoveredPlacement: void 0
     }));
   }), X(() => {
-    r && (n.lib.draggableObserver.unobserve(r), n.entities.visibleDraggableSet.delete(r), n.entities.draggableMap.delete(r), n.entities.modifiersDraggableSet.delete(r));
+    a && (n.lib.draggableObserver.unobserve(a), n.entities.visibleDraggableSet.delete(a), n.entities.draggableMap.delete(a), n.entities.modifiersDraggableSet.delete(a));
   }), {
     selected: i,
     isDragging: g,
@@ -1309,10 +1312,10 @@ function bn(e, t, s) {
   };
 }
 const yn = (e, t) => {
-  const s = re(), n = b(() => e.value === s.entities.selectingArea);
+  const s = ae(), n = y(() => e.value === s.entities.selectingArea);
   let o = null;
   Y(() => {
-    o = v(e), o && (o.setAttribute(T.SELECT_AREA, ""), s.lib.selectableAreaObserver.observe(o), s.entities.selectableAreaMap.set(o, {
+    o = D(e), o && (o.setAttribute(T.SELECT_AREA, ""), s.lib.selectableAreaObserver.observe(o), s.entities.selectableAreaMap.set(o, {
       modifier: t?.modifier ?? {
         keys: ["ControlLeft"],
         method: "every"
@@ -1324,22 +1327,22 @@ const yn = (e, t) => {
   }), X(() => {
     o && (s.lib.selectableAreaObserver.unobserve(o), s.entities.visibleSelectableAreaSet.delete(o), s.entities.modifiersSelectableAreaSet.delete(o), s.entities.selectableAreaMap.delete(o));
   });
-  const a = b(() => {
+  const r = y(() => {
     s.scrollPosition.x, s.scrollPosition.y;
-    const r = s.pointer.value;
-    return !r || s.state.value !== "selecting" || !o || !n.value ? {} : Tt(r.start, r.current, o);
+    const a = s.pointer.value;
+    return !a || s.state.value !== "selecting" || !o || !n.value ? {} : Tt(a.start, a.current, o);
   });
   return {
     isSelecting: n,
-    style: a
+    style: r
   };
 };
 function pn(e, t) {
-  const s = ze(De);
+  const s = Oe(De);
   if (!s) throw Error("DnD provider not found");
   let n = null;
   return Y(() => {
-    n = v(e), n && (n.setAttribute(T.CONSTRAINT_AREA, ""), s.entities.constraintsAreaMap.set(n, {
+    n = D(e), n && (n.setAttribute(T.CONSTRAINT_AREA, ""), s.entities.constraintsAreaMap.set(n, {
       axis: t?.axis || "both",
       restrictToArea: t?.restrictToArea || !1
     }));
@@ -1348,23 +1351,24 @@ function pn(e, t) {
   }), {};
 }
 function Sn(e, t, s) {
-  const n = re();
-  let o = null, a, r;
-  typeof t == "function" ? (a = {}, r = t) : (a = t ?? {}, r = s);
-  const i = b(() => {
-    const l = v(e);
+  const n = ae();
+  let o = null, r, a;
+  typeof t == "function" ? (r = {}, a = t) : (r = t ?? {}, a = s);
+  const i = y(() => {
+    const l = D(e);
     return l ? n.entities.allowedDroppableSet.has(l) : !1;
-  }), g = b(() => {
-    const l = v(e);
+  }), g = y(() => {
+    const l = D(e);
     if (l)
       return n.entities.droppableMap.get(l)?.hoveredPlacement;
   });
   return Y(() => {
-    o = v(e), o && (o.setAttribute(T.DROPPABLE, ""), n.lib.droppableObserver.observe(o), n.entities.droppableMap.set(o, {
-      disabled: a.disabled ?? !1,
-      groups: a.groups ?? [],
-      events: a.events,
-      payload: r,
+    o = D(e), o && (o.setAttribute(T.DROPPABLE, ""), n.lib.droppableObserver.observe(o), n.entities.droppableMap.set(o, {
+      disabled: r.disabled ?? !1,
+      groups: r.groups ?? [],
+      events: r.events,
+      payload: a,
+      data: r.data,
       hoveredPlacement: void 0
     }));
   }), X(() => {
@@ -1375,24 +1379,24 @@ function Sn(e, t, s) {
   };
 }
 const Dn = (e, t) => {
-  const s = qe(), n = J(!1), a = $e(
+  const s = qe(), n = J(!1), r = $e(
     e,
     t ?? {},
     () => {
       if (s.state.value !== "dragging") return null;
-      const r = s.overlay.position.value, i = s.overlay.size.value;
-      return r ? i?.width && i?.height ? {
-        x: r.x + i.width / 2,
-        y: r.y + i.height / 2
-      } : r : null;
+      const a = s.overlay.position.value, i = s.overlay.size.value;
+      return a ? i?.width && i?.height ? {
+        x: a.x + i.width / 2,
+        y: a.y + i.height / 2
+      } : a : null;
     },
     void 0,
     n
   );
   return oe(
     () => s.state.value,
-    (r) => {
-      r === "dragging" ? a.run() : a.stop();
+    (a) => {
+      a === "dragging" ? r.run() : r.stop();
     }
   ), { isScrolling: n };
 };
@@ -1401,11 +1405,11 @@ function ke(e, t) {
 }
 function Mn(e, t) {
   const s = t && "grid" in t && t.grid != null, n = t ? s ? t.grid : t.gridX : 1, o = t ? s ? t.grid : t.gridY : 1;
-  return b(() => {
-    const { x: a, y: r } = e.value;
+  return y(() => {
+    const { x: r, y: a } = e.value;
     return {
-      x: ke(a, n),
-      y: ke(r, o)
+      x: ke(r, n),
+      y: ke(a, o)
     };
   });
 }
@@ -1417,24 +1421,24 @@ const Pe = () => !0, Te = () => 0, fn = "separate", dn = () => {
     sortZones: Te,
     mergeStrategy: fn,
     pickClosestBetweenFirst: !1
-  }, t = (n, o, a, r, i, g, l) => {
-    const u = r instanceof Set ? r : new Set(r), c = { containerBox: o, pointer: a }, f = e.minOverlapPercent, d = [];
+  }, t = (n, o, r, a, i, g, l) => {
+    const u = a instanceof Set ? a : new Set(a), c = { containerBox: o, pointer: r }, f = e.minOverlapPercent, d = [];
     for (const m of u) {
       if (!i(m, n)) continue;
       const h = se(m);
       if (!l(h, c)) continue;
-      const p = be(h, o);
-      if (f !== void 0 && p < f) continue;
-      let y = 0;
-      for (const M of u)
-        M !== m && H(M, m) && y++;
+      const S = be(h, o);
+      if (f !== void 0 && S < f) continue;
+      let b = 0;
+      for (const v of u)
+        v !== m && H(v, m) && b++;
       d.push({
         node: m,
         box: h,
         meta: {
-          isPointerInElement: Nt(h, a.x, a.y),
-          overlapPercent: p,
-          depth: y,
+          isPointerInElement: Nt(h, r.x, r.y),
+          overlapPercent: S,
+          depth: b,
           centerDistance: Kt(
             Z(o),
             Z(h)
@@ -1487,11 +1491,11 @@ const Pe = () => !0, Te = () => 0, fn = "separate", dn = () => {
           "sensor: container, elements, zones, collision are required"
         );
       return (o) => {
-        const a = n.container(o);
-        if (!a) return { elements: [], zones: [] };
-        const r = n.containerBox ? n.containerBox(o) : se(a), i = o.pointer.value?.current ?? { x: 0, y: 0 }, g = t(
+        const r = n.container(o);
+        if (!r) return { elements: [], zones: [] };
+        const a = n.containerBox ? n.containerBox(o) : se(r), i = o.pointer.value?.current ?? { x: 0, y: 0 }, g = t(
           o,
-          r,
+          a,
           i,
           n.elements(o),
           n.filterElements,
@@ -1499,7 +1503,7 @@ const Pe = () => !0, Te = () => 0, fn = "separate", dn = () => {
           n.collision
         ), l = t(
           o,
-          r,
+          a,
           i,
           n.zones(o),
           n.filterZones,