@vue-dnd-kit/core 0.0.34-beta → 0.0.36-beta

package/dist/composables/useDnDStore.d.ts

@@ -478,6 +478,7 @@ export declare const useDnDStore: () => {
             __file?: string | undefined;
             __name?: string | undefined;
         } | null;
+        isVisible?: any;
         data: any;
         events: {
             onHover?: ((store: import('../types').IDnDStore) => void) | undefined;
@@ -725,6 +726,7 @@ export declare const useDnDStore: () => {
             __file?: string | undefined;
             __name?: string | undefined;
         } | null;
+        isVisible?: any;
         data: any;
         events: {
             onHover?: ((store: import('../types').IDnDStore) => void) | undefined;
@@ -985,6 +987,7 @@ export declare const useDnDStore: () => {
             __file?: string | undefined;
             __name?: string | undefined;
         } | null;
+        isVisible?: any;
         data: any;
         events: {
             onHover?: ((store: import('../types').IDnDStore) => void) | undefined;
@@ -1244,6 +1247,7 @@ export declare const useDnDStore: () => {
             __file?: string | undefined;
             __name?: string | undefined;
         } | null;
+        isVisible?: any;
         data: any;
         events: {
             onHover?: ((store: import('../types').IDnDStore) => void) | undefined;
@@ -1492,6 +1496,7 @@ export declare const useDnDStore: () => {
             __file?: string | undefined;
             __name?: string | undefined;
         } | null;
+        isVisible?: any;
         data: any;
         events: {
             onHover?: ((store: import('../types').IDnDStore) => void) | undefined;
@@ -1739,6 +1744,7 @@ export declare const useDnDStore: () => {
             __file?: string | undefined;
             __name?: string | undefined;
         } | null;
+        isVisible?: any;
         data: any;
         events: {
             onHover?: ((store: import('../types').IDnDStore) => void) | undefined;
@@ -2026,6 +2032,7 @@ export declare const useDnDStore: () => {
                 __file?: string | undefined;
                 __name?: string | undefined;
             } | null;
+            isVisible?: any;
             data: any;
             events: {
                 onHover?: ((store: import('../types').IDnDStore) => void) | undefined;
@@ -2273,6 +2280,7 @@ export declare const useDnDStore: () => {
                 __file?: string | undefined;
                 __name?: string | undefined;
             } | null;
+            isVisible?: any;
             data: any;
             events: {
                 onHover?: ((store: import('../types').IDnDStore) => void) | undefined;

package/dist/composables/useDragContainer.d.ts

@@ -320,6 +320,7 @@ export declare const useDragContainer: () => {
             __file?: string | undefined;
             __name?: string | undefined;
         } | null;
+        isVisible?: any;
         data: any;
         events: {
             onHover?: ((store: import('..').IDnDStore) => void) | undefined;
@@ -579,6 +580,7 @@ export declare const useDragContainer: () => {
             __file?: string | undefined;
             __name?: string | undefined;
         } | null;
+        isVisible?: any;
         data: any;
         events: {
             onHover?: ((store: import('..').IDnDStore) => void) | undefined;

package/dist/composables/useDraggable.d.ts

@@ -1,45 +1,4 @@
 import { IUseDragOptions } from "../types";
-/**
- * Main hook for making elements draggable.
- * Provides all necessary functionality for drag and drop operations.
- *
- * @param options - Configuration options for draggable element
- * @param options.groups - Groups that element belongs to (for drop zone filtering)
- * @param options.events - Event handlers for drag lifecycle
- * @param options.data - Custom data to be passed to event handlers
- * @param options.layer - Custom component to render while dragging
- * @param options.container - Parent container component reference
- *
- * @returns Object containing:
- * - elementRef: Reference to be bound to draggable element
- * - isDragging: Whether element is currently being dragged
- * - isOvered: Whether element is being hovered by dragged element
- * - isAllowed: Whether element can interact with current drop zone based on group matching
- * - pointerPosition: Current pointer coordinates
- * - handleDragStart: Function to initiate drag operation
- *
- * @example
- * ```vue
- * <template>
- *   <div
- *     ref="elementRef"
- *     :class="{ 'dragging': isDragging }"
- *     @pointerdown="handleDragStart"
- *   >
- *     Drag me!
- *   </div>
- * </template>
- *
- * <script setup lang="ts">
- * const { elementRef, isDragging, handleDragStart } = useDraggable({
- *   groups: ['items'],
- *   events: {
- *     onEnd: (store) => console.log('Drag ended!'),
- *   }
- * });
- * </script>
- * ```
- */
 export declare const useDraggable: (options?: IUseDragOptions) => {
     pointerPosition: {
         current: import('vue').Ref<{
@@ -78,4 +37,5 @@ export declare const useDraggable: (options?: IUseDragOptions) => {
     isOvered: import('vue').ComputedRef<boolean>;
     isAllowed: import('vue').ComputedRef<boolean>;
     handleDragStart: (event: PointerEvent) => void;
+    isVisible: import('vue').ShallowRef<boolean, boolean>;
 };

package/dist/managers/useElementManager.d.ts

@@ -14,4 +14,5 @@ export declare const useElementManager: (options?: IUseDragOptions) => {
     isDragging: import('vue').ComputedRef<boolean>;
     isOvered: import('vue').ComputedRef<boolean>;
     isAllowed: import('vue').ComputedRef<boolean>;
+    isVisible: import('vue').ShallowRef<boolean, boolean>;
 };

package/dist/types/index.d.ts

@@ -57,6 +57,8 @@ export interface IDragElement {
   layer: Component | null;
   /** Default layer component */
   defaultLayer: Component | null;
+  /** Visibility state of the element */
+  isVisible?: any;
   /** Custom data associated with element */
   data: any;
   /** Event handlers */

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue");function J(t){let e=!1,i;const c=n.effectScope(!0);return(...d)=>(e||(i=c.run(()=>t(...d)),e=!0),i)}typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const L=J(()=>{const t=n.ref([]),e=n.computed(()=>t.value.length>0),i={component:n.ref(null),ref:n.ref(null)},c=n.ref([]),d=n.ref([]),r=n.ref([]),s={zone:n.ref(null),element:n.ref(null)},g={current:n.ref(null),start:n.ref(null),offset:{percent:n.ref(null),pixel:n.ref(null)}};return{isDragging:e,activeContainer:i,elements:c,draggingElements:t,selectedElements:d,zones:r,hovered:s,pointerPosition:g}}),K=()=>{const t=n.ref(null),{draggingElements:e,pointerPosition:i,isDragging:c,activeContainer:d}=L();return n.onMounted(()=>{d.ref=t}),n.onBeforeUnmount(()=>{d.ref.value=null}),{elementRef:t,draggingElements:e,pointerPosition:i,isDragging:c}},Q=["innerHTML"],b=n.defineComponent({__name:"DefaultOverlay",setup(t){const{elementRef:e,pointerPosition:i,isDragging:c,draggingElements:d}=K(),r=n.computed(()=>{var s,g,h,y;return{transform:`translate3d(${(((s=i.current.value)==null?void 0:s.x)??0)-(((g=i.offset.pixel.value)==null?void 0:g.x)??0)}px, ${(((h=i.current.value)==null?void 0:h.y)??0)-(((y=i.offset.pixel.value)==null?void 0:y.y)??0)}px, 0)`,zIndex:1e3,position:"fixed",top:0,left:0,transition:"0.3s cubic-bezier(0.165, 0.84, 0.44, 1)"}});return(s,g)=>n.unref(c)?(n.openBlock(),n.createElementBlock("div",{key:0,ref_key:"elementRef",ref:e,style:n.normalizeStyle(r.value)},[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(n.unref(d),(h,y)=>{var a,E;return n.openBlock(),n.createElementBlock("div",{key:y,innerHTML:h.initialHTML,style:n.normalizeStyle({width:`${(a=h.initialRect)==null?void 0:a.width}px`,height:`${(E=h.initialRect)==null?void 0:E.height}px`})},null,12,Q)}),128))],4)):n.createCommentVNode("",!0)}}),ee=n.defineComponent({__name:"DragOverlay",setup(t){const{activeContainer:e}=L(),i=n.computed(()=>e.component.value??b);return(c,d)=>(n.openBlock(),n.createBlock(n.resolveDynamicComponent(i.value)))}}),te="data-dnd-draggable",ne=t=>{const{elements:e,draggingElements:i,hovered:c,selectedElements:d,isDragging:r}=L(),s=n.ref(null),g=n.computed(()=>{var p;return((p=c.element.value)==null?void 0:p.node)===s.value}),h=n.computed(()=>i.value.some(p=>p.node===s.value)),y=n.computed(()=>{if(!s.value||!r.value)return!1;const p=e.value.find(D=>D.node===s.value);return p!=null&&p.groups.length?!i.value.some(D=>D.groups.length?!D.groups.some(o=>p.groups.includes(o)):!1):!0});return{elementRef:s,registerElement:()=>{if(!s.value)throw new Error("ElementRef is not set");e.value.push({node:s.value,groups:(t==null?void 0:t.groups)??[],layer:(t==null?void 0:t.layer)??null,defaultLayer:(t==null?void 0:t.layer)??null,events:(t==null?void 0:t.events)??{},data:(t==null?void 0:t.data)??void 0}),s.value.setAttribute(te,"true")},unregisterElement:()=>{const p=e.value.findIndex(o=>o.node===s.value);p!==-1&&e.value.splice(p,1);const D=d.value.findIndex(o=>o.node===s.value);D!==-1&&d.value.splice(D,1)},isDragging:h,isOvered:g,isAllowed:y}},re=()=>{let t="",e="",i="";const c=()=>{const s=document.body;t=s.style.userSelect,e=s.style.touchAction,i=s.style.overscrollBehavior,s.style.userSelect="none",s.style.touchAction="none",s.style.overscrollBehavior="none",window.addEventListener("contextmenu",r),window.addEventListener("selectstart",r),window.addEventListener("touchstart",r),window.addEventListener("touchmove",r)},d=()=>{const s=document.body;s.style.userSelect=t,s.style.touchAction=e,s.style.overscrollBehavior=i,window.removeEventListener("contextmenu",r),window.removeEventListener("selectstart",r),window.removeEventListener("touchstart",r),window.removeEventListener("touchmove",r)},r=s=>s.preventDefault();return{disableInteractions:c,enableInteractions:d}},W=(t,e)=>t.x<e.x+e.width&&t.x+t.width>e.x&&t.y<e.y+e.height&&t.y+t.height>e.y,k=t=>{if(!t)return{x:0,y:0,width:0,height:0,bottom:0,left:0,right:0,top:0};const e=t.getBoundingClientRect();return{bottom:e.bottom,left:e.left,right:e.right,top:e.top,x:e.x,y:e.y,width:e.width,height:e.height}},R=t=>({x:t.x+t.width/2,y:t.y+t.height/2}),oe=(t,e)=>{const i=k(t);return{pixel:{x:e.x-i.x,y:e.y-i.y},percent:{x:(e.x-i.x)/i.width*100,y:(e.y-i.y)/i.height*100}}},j=(t,e)=>{const i=e.x-t.x,c=e.y-t.y;return Math.sqrt(i*i+c*c)},M=(t,e)=>t?e.contains(t):!1,le=t=>{const e=L();return{onPointerStart:r=>{e.pointerPosition.start.value={x:r.clientX,y:r.clientY},e.pointerPosition.current.value={x:r.clientX,y:r.clientY};const{pixel:s,percent:g}=oe(t.value,{x:r.clientX,y:r.clientY});e.pointerPosition.offset.pixel.value=s,e.pointerPosition.offset.percent.value=g},onPointerMove:r=>{e.pointerPosition.current.value={x:r.clientX,y:r.clientY}},onPointerEnd:()=>{e.pointerPosition.current.value=null,e.pointerPosition.start.value=null,e.pointerPosition.offset.pixel.value=null,e.pointerPosition.offset.percent.value=null}}},ie=t=>{const e=L(),{onPointerStart:i,onPointerMove:c,onPointerEnd:d}=le(t);let r=null;const s=o=>{var v,x;const f=e.selectedElements.value.some(P=>P.node===o);if(e.selectedElements.value.length&&f)return e.selectedElements.value.map(P=>{var C,T;return{...P,initialHTML:((C=P.node)==null?void 0:C.outerHTML)??"",initialRect:(T=P.node)==null?void 0:T.getBoundingClientRect()}});e.selectedElements.value=[];const m=e.elements.value.find(P=>P.node===o);return m?[{...m,initialHTML:((v=m.node)==null?void 0:v.outerHTML)??"",initialRect:(x=m.node)==null?void 0:x.getBoundingClientRect()}]:[]},g=(o,f)=>{const m=Math.max(0,Math.min(o.x+o.width,f.x+f.width)-Math.max(o.x,f.x)),v=Math.max(0,Math.min(o.y+o.height,f.y+f.height)-Math.max(o.y,f.y)),x=m*v,P=o.width*o.height,C=f.width*f.height;return(x/P*100+x/C*100)/2},h=()=>{var U,Z,A,X,Y,$,F,q,G,N;const o=k(e.activeContainer.ref.value),f=R(o),m=((U=e.pointerPosition.current.value)==null?void 0:U.x)??0,v=((Z=e.pointerPosition.current.value)==null?void 0:Z.y)??0,P=!(o&&m>=o.x&&m<=o.x+o.width&&v>=o.y&&v<=o.y+o.height),C=e.draggingElements.value.map(l=>l.node),T=e.elements.value.filter(l=>{if(!l.node||C.some(w=>w&&M(l.node,w))||l.groups.length&&!!e.draggingElements.value.some(S=>S.groups.length?!S.groups.some(I=>l.groups.includes(I)):!1))return!1;const u=k(l.node);return u&&o&&W(u,o)}).map(l=>{const u=k(l.node),w=R(u),S=m>=u.x&&m<=u.x+u.width&&v>=u.y&&v<=u.y+u.height,I=g(u,o),H=j(f,w),B=e.elements.value.filter(_=>_!==l&&_.node&&l.node&&M(l.node,_.node)).length;return{element:l,isPointerInElement:S,overlapPercent:I,depth:B,centerDistance:H}}).sort((l,u)=>{if(!P){if(l.isPointerInElement&&u.isPointerInElement)return u.depth-l.depth;if(l.isPointerInElement!==u.isPointerInElement)return l.isPointerInElement?-1:1}return Math.abs(l.overlapPercent-u.overlapPercent)<=1?l.centerDistance-u.centerDistance:u.overlapPercent-l.overlapPercent}),V=e.zones.value.filter(l=>{if(!l.node||C.some(w=>w&&M(l.node,w))||l.groups.length&&!!e.draggingElements.value.some(S=>S.groups.length?!S.groups.some(I=>l.groups.includes(I)):!1))return!1;const u=k(l.node);return u&&o&&W(u,o)}).map(l=>{const u=k(l.node),w=R(u),S=m>=u.x&&m<=u.x+u.width&&v>=u.y&&v<=u.y+u.height,I=g(u,o),H=j(f,w),B=e.zones.value.filter(_=>_!==l&&_.node&&l.node&&M(l.node,_.node)).length;return{zone:l,isPointerInElement:S,overlapPercent:I,depth:B,centerDistance:H}}).sort((l,u)=>{if(!P){if(l.isPointerInElement&&u.isPointerInElement)return u.depth-l.depth;if(l.isPointerInElement!==u.isPointerInElement)return l.isPointerInElement?-1:1}return Math.abs(l.overlapPercent-u.overlapPercent)<=1?l.centerDistance-u.centerDistance:u.overlapPercent-l.overlapPercent}),O=e.hovered.element.value,z=e.hovered.zone.value;e.hovered.element.value=((A=T[0])==null?void 0:A.element)??null,e.hovered.zone.value=((X=V[0])==null?void 0:X.zone)??null,e.hovered.element.value!==O&&((Y=O==null?void 0:O.events)!=null&&Y.onLeave&&O.events.onLeave(e),(F=($=e.hovered.element.value)==null?void 0:$.events)!=null&&F.onHover&&e.hovered.element.value.events.onHover(e)),e.hovered.zone.value!==z&&((q=z==null?void 0:z.events)!=null&&q.onLeave&&z.events.onLeave(e),(N=(G=e.hovered.zone.value)==null?void 0:G.events)!=null&&N.onHover&&e.hovered.zone.value.events.onHover(e)),r=requestAnimationFrame(h)},y=()=>{h()},a=()=>{r!==null&&(cancelAnimationFrame(r),r=null)};return{activate:o=>{e.draggingElements.value=s(t.value),i(o),y()},track:o=>{c(o)},deactivate:()=>{var o,f;d(),e.hovered.zone.value?(f=(o=e.hovered.zone.value.events).onDrop)==null||f.call(o,e):e.draggingElements.value.forEach(m=>{var v,x;return(x=(v=m.events).onEnd)==null?void 0:x.call(v,e)}),e.draggingElements.value=[],e.selectedElements.value=[],e.hovered.zone.value=null,e.hovered.element.value=null,a()}}},se=t=>{const{elementRef:e,registerElement:i,unregisterElement:c,isDragging:d,isOvered:r,isAllowed:s}=ne(t),{disableInteractions:g,enableInteractions:h}=re(),y=L(),{activate:a,track:E,deactivate:p}=ie(e),D=v=>{t!=null&&t.container&&(y.activeContainer.component.value=n.markRaw(t.container)),g(),a(v),document.addEventListener("pointermove",o),document.addEventListener("pointerup",m),document.addEventListener("wheel",f)},o=v=>{E(v)},f=v=>{E(v)},m=()=>{y.activeContainer.component.value=null,h(),p(),document.removeEventListener("pointermove",o),document.removeEventListener("pointerup",m),document.removeEventListener("wheel",f)};return n.onMounted(i),n.onBeforeUnmount(c),{pointerPosition:y.pointerPosition,elementRef:e,isDragging:d,isOvered:r,isAllowed:s,handleDragStart:D}},ae=t=>{const{zones:e,hovered:i,draggingElements:c,isDragging:d}=L(),r=n.ref(null),s=n.computed(()=>{var a;return((a=i.zone.value)==null?void 0:a.node)===r.value}),g=n.computed(()=>{if(!r.value||!d.value)return!1;const a=e.value.find(E=>E.node===r.value);return a!=null&&a.groups.length?!c.value.some(E=>E.groups.length?!E.groups.some(p=>a.groups.includes(p)):!1):!0});return{elementRef:r,registerZone:()=>{if(!r.value)throw new Error("elementRef is not set");e.value.push({node:r.value,groups:(t==null?void 0:t.groups)??[],events:(t==null?void 0:t.events)??{},data:(t==null?void 0:t.data)??void 0}),r.value.setAttribute("data-dnd-droppable","true")},unregisterZone:()=>{if(!r.value)throw new Error("elementRef is not set");const a=e.value.findIndex(E=>E.node===r.value);a!==-1&&e.value.splice(a,1)},isOvered:s,isAllowed:g}},ue=t=>{const{elementRef:e,registerZone:i,unregisterZone:c,isOvered:d,isAllowed:r}=ae(t);return n.onMounted(i),n.onBeforeUnmount(c),{elementRef:e,isOvered:d,isAllowed:r}},ce=t=>{const{selectedElements:e,elements:i}=L(),c=n.computed(()=>i.value.find(a=>a.node===t.value)),d=n.computed(()=>e.value.some(a=>a.node===t.value)),r=n.computed(()=>t.value?e.value.some(a=>a.node&&M(a.node,t.value)):!1),s=n.computed(()=>t.value?e.value.some(a=>a.node&&M(t.value,a.node)):!1),g=()=>{c.value&&(e.value=e.value.filter(a=>a.node!==t.value))},h=()=>{c.value&&(r.value&&(e.value=e.value.filter(a=>a.node&&!M(a.node,t.value))),s.value&&(e.value=e.value.filter(a=>a.node&&!M(t.value,a.node))),e.value.push(c.value))};return{handleUnselect:g,handleSelect:h,handleToggleSelect:()=>{c.value&&(e.value.some(a=>a.node===t.value)?g():h())},isSelected:d,isParentOfSelected:r}};exports.DragOverlay=ee;exports.getBoundingBox=k;exports.useDnDStore=L;exports.useDraggable=se;exports.useDroppable=ue;exports.useSelection=ce;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue");function ee(t){return n.getCurrentScope()?(n.onScopeDispose(t),!0):!1}function te(t){let e=!1,r;const a=n.effectScope(!0);return(...c)=>(e||(r=a.run(()=>t(...c)),e=!0),r)}const ne=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const re=t=>t!=null,z=()=>{};function oe(t,e){function r(...a){return new Promise((c,o)=>{Promise.resolve(t(()=>e.apply(this,a),{fn:e,thisArg:this,args:a})).then(c).catch(o)})}return r}function le(...t){let e=0,r,a=!0,c=z,o,s,v,f,y;!n.isRef(t[0])&&typeof t[0]=="object"?{delay:s,trailing:v=!0,leading:f=!0,rejectOnCancel:y=!1}=t[0]:[s,v=!0,f=!0,y=!1]=t;const l=()=>{r&&(clearTimeout(r),r=void 0,c(),c=z)};return D=>{const h=n.toValue(s),w=Date.now()-e,i=()=>o=D();return l(),h<=0?(e=Date.now(),i()):(w>h&&(f||!a)?(e=Date.now(),i()):v&&(o=new Promise((m,p)=>{c=y?p:m,r=setTimeout(()=>{e=Date.now(),a=!0,m(i()),l()},Math.max(0,h-w))})),!f&&!r&&(r=setTimeout(()=>a=!0,h)),a=!1,o)}}function se(t){return Array.isArray(t)?t:[t]}function ie(t,e=200,r=!1,a=!0,c=!1){return oe(le(e,r,a,c),t)}function ae(t,e,r){const a=n.watch(t,(...c)=>(n.nextTick(()=>a()),e(...c)),r);return a}const K=ne?window:void 0;function H(t){var e;const r=n.toValue(t);return(e=r==null?void 0:r.$el)!=null?e:r}function ue(){const t=n.shallowRef(!1),e=n.getCurrentInstance();return e&&n.onMounted(()=>{t.value=!0},e),t}function ce(t){const e=ue();return n.computed(()=>(e.value,!!t()))}function de(t,e,r={}){const{root:a,rootMargin:c="0px",threshold:o=0,window:s=K,immediate:v=!0}=r,f=ce(()=>s&&"IntersectionObserver"in s),y=n.computed(()=>{const w=n.toValue(t);return se(w).map(H).filter(re)});let l=z;const g=n.shallowRef(v),D=f.value?n.watch(()=>[y.value,H(a),g.value],([w,i])=>{if(l(),!g.value||!w.length)return;const m=new IntersectionObserver(e,{root:H(i),rootMargin:c,threshold:o});w.forEach(p=>p&&m.observe(p)),l=()=>{m.disconnect(),l=z}},{immediate:v,flush:"post"}):z,h=()=>{l(),D(),g.value=!1};return ee(h),{isSupported:f,isActive:g,pause(){l(),g.value=!1},resume(){g.value=!0},stop:h}}function ve(t,e={}){const{window:r=K,scrollTarget:a,threshold:c=0,rootMargin:o,once:s=!1}=e,v=n.shallowRef(!1),{stop:f}=de(t,y=>{let l=v.value,g=0;for(const D of y)D.time>=g&&(g=D.time,l=D.isIntersecting);v.value=l,s&&ae(v,()=>{f()})},{root:a,window:r,threshold:c,rootMargin:n.toValue(o)});return v}const I=te(()=>{const t=n.ref([]),e=n.computed(()=>t.value.length>0),r={component:n.ref(null),ref:n.ref(null)},a=n.ref([]),c=n.ref([]),o=n.ref([]),s={zone:n.ref(null),element:n.ref(null)},v={current:n.ref(null),start:n.ref(null),offset:{percent:n.ref(null),pixel:n.ref(null)}};return{isDragging:e,activeContainer:r,elements:a,draggingElements:t,selectedElements:c,zones:o,hovered:s,pointerPosition:v}}),fe=()=>{const t=n.ref(null),{draggingElements:e,pointerPosition:r,isDragging:a,activeContainer:c}=I();return n.onMounted(()=>{c.ref=t}),n.onBeforeUnmount(()=>{c.ref.value=null}),{elementRef:t,draggingElements:e,pointerPosition:r,isDragging:a}},ge=["innerHTML"],me=n.defineComponent({__name:"DefaultOverlay",setup(t){const{elementRef:e,pointerPosition:r,isDragging:a,draggingElements:c}=fe(),o=n.computed(()=>{var s,v,f,y;return{transform:`translate3d(${(((s=r.current.value)==null?void 0:s.x)??0)-(((v=r.offset.pixel.value)==null?void 0:v.x)??0)}px, ${(((f=r.current.value)==null?void 0:f.y)??0)-(((y=r.offset.pixel.value)==null?void 0:y.y)??0)}px, 0)`,zIndex:1e3,position:"fixed",top:0,left:0,transition:"0.3s cubic-bezier(0.165, 0.84, 0.44, 1)"}});return(s,v)=>n.unref(a)?(n.openBlock(),n.createElementBlock("div",{key:0,ref_key:"elementRef",ref:e,style:n.normalizeStyle(o.value)},[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(n.unref(c),(f,y)=>{var l,g;return n.openBlock(),n.createElementBlock("div",{key:y,innerHTML:f.initialHTML,style:n.normalizeStyle({width:`${(l=f.initialRect)==null?void 0:l.width}px`,height:`${(g=f.initialRect)==null?void 0:g.height}px`})},null,12,ge)}),128))],4)):n.createCommentVNode("",!0)}}),he=n.defineComponent({__name:"DragOverlay",setup(t){const{activeContainer:e}=I(),r=n.computed(()=>e.component.value??me);return(a,c)=>(n.openBlock(),n.createBlock(n.resolveDynamicComponent(r.value)))}}),pe="data-dnd-draggable",ye=t=>{const{elements:e,draggingElements:r,hovered:a,selectedElements:c,isDragging:o}=I(),s=n.ref(null),v=n.computed(()=>{var h;return((h=a.element.value)==null?void 0:h.node)===s.value}),f=ve(s),y=n.computed(()=>r.value.some(h=>h.node===s.value)),l=n.computed(()=>{if(!s.value||!o.value)return!1;const h=e.value.find(w=>w.node===s.value);return h!=null&&h.groups.length?!r.value.some(w=>w.groups.length?!w.groups.some(i=>h.groups.includes(i)):!1):!0});return{elementRef:s,registerElement:()=>{if(!s.value)throw new Error("ElementRef is not set");e.value.push({node:s.value,groups:(t==null?void 0:t.groups)??[],layer:(t==null?void 0:t.layer)??null,defaultLayer:(t==null?void 0:t.layer)??null,events:(t==null?void 0:t.events)??{},data:(t==null?void 0:t.data)??void 0,isVisible:f}),s.value.setAttribute(pe,"true")},unregisterElement:()=>{const h=e.value.findIndex(i=>i.node===s.value);h!==-1&&e.value.splice(h,1);const w=c.value.findIndex(i=>i.node===s.value);w!==-1&&c.value.splice(w,1)},isDragging:y,isOvered:v,isAllowed:l,isVisible:f}},we=()=>{let t="",e="",r="";const a=()=>{const s=document.body;t=s.style.userSelect,e=s.style.touchAction,r=s.style.overscrollBehavior,s.style.userSelect="none",s.style.touchAction="none",s.style.overscrollBehavior="none",window.addEventListener("contextmenu",o),window.addEventListener("selectstart",o),window.addEventListener("touchstart",o),window.addEventListener("touchmove",o)},c=()=>{const s=document.body;s.style.userSelect=t,s.style.touchAction=e,s.style.overscrollBehavior=r,window.removeEventListener("contextmenu",o),window.removeEventListener("selectstart",o),window.removeEventListener("touchstart",o),window.removeEventListener("touchmove",o)},o=s=>s.preventDefault();return{disableInteractions:a,enableInteractions:c}},N=(t,e)=>t.x<e.x+e.width&&t.x+t.width>e.x&&t.y<e.y+e.height&&t.y+t.height>e.y,O=t=>{if(!t)return{x:0,y:0,width:0,height:0,bottom:0,left:0,right:0,top:0};const e=t.getBoundingClientRect();return{bottom:e.bottom,left:e.left,right:e.right,top:e.top,x:e.x,y:e.y,width:e.width,height:e.height}},A=t=>({x:t.x+t.width/2,y:t.y+t.height/2}),Ee=(t,e)=>{const r=O(t);return{pixel:{x:e.x-r.x,y:e.y-r.y},percent:{x:(e.x-r.x)/r.width*100,y:(e.y-r.y)/r.height*100}}},J=(t,e)=>{const r=e.x-t.x,a=e.y-t.y;return Math.sqrt(r*r+a*a)},C=(t,e)=>t?e.contains(t):!1,Pe=t=>{const e=I();return{onPointerStart:o=>{e.pointerPosition.start.value={x:o.clientX,y:o.clientY},e.pointerPosition.current.value={x:o.clientX,y:o.clientY};const{pixel:s,percent:v}=Ee(t.value,{x:o.clientX,y:o.clientY});e.pointerPosition.offset.pixel.value=s,e.pointerPosition.offset.percent.value=v},onPointerMove:o=>{e.pointerPosition.current.value={x:o.clientX,y:o.clientY}},onPointerEnd:()=>{e.pointerPosition.current.value=null,e.pointerPosition.start.value=null,e.pointerPosition.offset.pixel.value=null,e.pointerPosition.offset.percent.value=null}}},De=t=>{const e=I(),{onPointerStart:r,onPointerMove:a,onPointerEnd:c}=Pe(t);let o=null;const s=i=>{var E,P;const m=e.selectedElements.value.some(x=>x.node===i);if(e.selectedElements.value.length&&m)return e.selectedElements.value.map(x=>{var L,V;return{...x,initialHTML:((L=x.node)==null?void 0:L.outerHTML)??"",initialRect:(V=x.node)==null?void 0:V.getBoundingClientRect()}});e.selectedElements.value=[];const p=e.elements.value.find(x=>x.node===i);return p?[{...p,initialHTML:((E=p.node)==null?void 0:E.outerHTML)??"",initialRect:(P=p.node)==null?void 0:P.getBoundingClientRect()}]:[]},v=(i,m)=>{const p=Math.max(0,Math.min(i.x+i.width,m.x+m.width)-Math.max(i.x,m.x)),E=Math.max(0,Math.min(i.y+i.height,m.y+m.height)-Math.max(i.y,m.y)),P=p*E,x=i.width*i.height,L=m.width*m.height;return(P/x*100+P/L*100)/2},f=ie(()=>{var F,U,Z,$,W,X,Y,j,q,G;const i=O(e.activeContainer.ref.value),m=A(i),p=((F=e.pointerPosition.current.value)==null?void 0:F.x)??0,E=((U=e.pointerPosition.current.value)==null?void 0:U.y)??0,x=!(i&&p>=i.x&&p<=i.x+i.width&&E>=i.y&&E<=i.y+i.height),L=e.draggingElements.value.map(u=>u.node),V=e.elements.value.filter(u=>{if(!u.isVisible||!u.isVisible.value||!u.node||L.some(S=>S&&C(u.node,S))||u.groups.length&&!!e.draggingElements.value.some(M=>M.groups.length?!M.groups.some(_=>u.groups.includes(_)):!1))return!1;const d=O(u.node);return d&&i&&N(d,i)}).map(u=>{const d=O(u.node),S=A(d),M=p>=d.x&&p<=d.x+d.width&&E>=d.y&&E<=d.y+d.height,_=v(d,i),b=J(m,S),B=e.elements.value.filter(k=>k!==u&&k.node&&u.node&&C(u.node,k.node)).length;return{element:u,isPointerInElement:M,overlapPercent:_,depth:B,centerDistance:b}}).sort((u,d)=>{if(!x){if(u.isPointerInElement&&d.isPointerInElement)return d.depth-u.depth;if(u.isPointerInElement!==d.isPointerInElement)return u.isPointerInElement?-1:1}return Math.abs(u.overlapPercent-d.overlapPercent)<=1?u.centerDistance-d.centerDistance:d.overlapPercent-u.overlapPercent}),Q=e.zones.value.filter(u=>{if(!u.node||L.some(S=>S&&C(u.node,S))||u.groups.length&&!!e.draggingElements.value.some(M=>M.groups.length?!M.groups.some(_=>u.groups.includes(_)):!1))return!1;const d=O(u.node);return d&&i&&N(d,i)}).map(u=>{const d=O(u.node),S=A(d),M=p>=d.x&&p<=d.x+d.width&&E>=d.y&&E<=d.y+d.height,_=v(d,i),b=J(m,S),B=e.zones.value.filter(k=>k!==u&&k.node&&u.node&&C(u.node,k.node)).length;return{zone:u,isPointerInElement:M,overlapPercent:_,depth:B,centerDistance:b}}).sort((u,d)=>{if(!x){if(u.isPointerInElement&&d.isPointerInElement)return d.depth-u.depth;if(u.isPointerInElement!==d.isPointerInElement)return u.isPointerInElement?-1:1}return Math.abs(u.overlapPercent-d.overlapPercent)<=1?u.centerDistance-d.centerDistance:d.overlapPercent-u.overlapPercent}),T=e.hovered.element.value,R=e.hovered.zone.value;e.hovered.element.value=((Z=V[0])==null?void 0:Z.element)??null,e.hovered.zone.value=(($=Q[0])==null?void 0:$.zone)??null,e.hovered.element.value!==T&&((W=T==null?void 0:T.events)!=null&&W.onLeave&&T.events.onLeave(e),(Y=(X=e.hovered.element.value)==null?void 0:X.events)!=null&&Y.onHover&&e.hovered.element.value.events.onHover(e)),e.hovered.zone.value!==R&&((j=R==null?void 0:R.events)!=null&&j.onLeave&&R.events.onLeave(e),(G=(q=e.hovered.zone.value)==null?void 0:q.events)!=null&&G.onHover&&e.hovered.zone.value.events.onHover(e)),console.log("processing collisions")},1e3),y=()=>{f(),o=requestAnimationFrame(y)},l=()=>{y()},g=()=>{o!==null&&(cancelAnimationFrame(o),o=null)};return{activate:i=>{e.draggingElements.value=s(t.value),r(i),l()},track:i=>{a(i)},deactivate:()=>{var i,m;c(),e.hovered.zone.value?(m=(i=e.hovered.zone.value.events).onDrop)==null||m.call(i,e):e.draggingElements.value.forEach(p=>{var E,P;return(P=(E=p.events).onEnd)==null?void 0:P.call(E,e)}),e.draggingElements.value=[],e.selectedElements.value=[],e.hovered.zone.value=null,e.hovered.element.value=null,g()}}},xe=t=>{const{elementRef:e,registerElement:r,unregisterElement:a,isDragging:c,isOvered:o,isAllowed:s,isVisible:v}=ye(t),{disableInteractions:f,enableInteractions:y}=we(),{activeContainer:l,pointerPosition:g}=I(),{activate:D,track:h,deactivate:w}=De(e),i=P=>{t!=null&&t.container&&(l.component.value=n.markRaw(t.container)),f(),D(P),document.addEventListener("pointermove",m),document.addEventListener("pointerup",E),document.addEventListener("wheel",p)},m=P=>h(P),p=P=>h(P),E=()=>{l.component.value=null,y(),w(),document.removeEventListener("pointermove",m),document.removeEventListener("pointerup",E),document.removeEventListener("wheel",p)};return n.onMounted(r),n.onBeforeUnmount(a),{pointerPosition:g,elementRef:e,isDragging:c,isOvered:o,isAllowed:s,handleDragStart:i,isVisible:v}},Se=t=>{const{zones:e,hovered:r,draggingElements:a,isDragging:c}=I(),o=n.ref(null),s=n.computed(()=>{var l;return((l=r.zone.value)==null?void 0:l.node)===o.value}),v=n.computed(()=>{if(!o.value||!c.value)return!1;const l=e.value.find(g=>g.node===o.value);return l!=null&&l.groups.length?!a.value.some(g=>g.groups.length?!g.groups.some(D=>l.groups.includes(D)):!1):!0});return{elementRef:o,registerZone:()=>{if(!o.value)throw new Error("elementRef is not set");e.value.push({node:o.value,groups:(t==null?void 0:t.groups)??[],events:(t==null?void 0:t.events)??{},data:(t==null?void 0:t.data)??void 0}),o.value.setAttribute("data-dnd-droppable","true")},unregisterZone:()=>{if(!o.value)throw new Error("elementRef is not set");const l=e.value.findIndex(g=>g.node===o.value);l!==-1&&e.value.splice(l,1)},isOvered:s,isAllowed:v}},Me=t=>{const{elementRef:e,registerZone:r,unregisterZone:a,isOvered:c,isAllowed:o}=Se(t);return n.onMounted(r),n.onBeforeUnmount(a),{elementRef:e,isOvered:c,isAllowed:o}},Ie=t=>{const{selectedElements:e,elements:r}=I(),a=n.computed(()=>r.value.find(l=>l.node===t.value)),c=n.computed(()=>e.value.some(l=>l.node===t.value)),o=n.computed(()=>t.value?e.value.some(l=>l.node&&C(l.node,t.value)):!1),s=n.computed(()=>t.value?e.value.some(l=>l.node&&C(t.value,l.node)):!1),v=()=>{a.value&&(e.value=e.value.filter(l=>l.node!==t.value))},f=()=>{a.value&&(o.value&&(e.value=e.value.filter(l=>l.node&&!C(l.node,t.value))),s.value&&(e.value=e.value.filter(l=>l.node&&!C(t.value,l.node))),e.value.push(a.value))};return{handleUnselect:v,handleSelect:f,handleToggleSelect:()=>{a.value&&(e.value.some(l=>l.node===t.value)?v():f())},isSelected:c,isParentOfSelected:o}};exports.DragOverlay=he;exports.getBoundingBox=O;exports.useDnDStore=I;exports.useDraggable=xe;exports.useDroppable=Me;exports.useSelection=Ie;

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

@@ -1,54 +1,183 @@
-import { effectScope as oe, ref as p, computed as w, onMounted as $, onBeforeUnmount as F, defineComponent as ne, createElementBlock as X, createCommentVNode as le, unref as Q, openBlock as R, normalizeStyle as b, Fragment as ie, renderList as se, createBlock as ae, resolveDynamicComponent as ue, markRaw as ce } from "vue";
-function ve(t) {
-  let e = !1, l;
-  const u = oe(!0);
-  return (...c) => (e || (l = u.run(() => t(...c)), e = !0), l);
+import { effectScope as ve, watch as ie, nextTick as de, isRef as fe, getCurrentScope as ge, onScopeDispose as he, toValue as b, shallowRef as U, computed as x, getCurrentInstance as me, onMounted as F, ref as P, onBeforeUnmount as j, defineComponent as ae, createElementBlock as W, createCommentVNode as pe, unref as re, openBlock as V, normalizeStyle as oe, Fragment as ye, renderList as we, createBlock as Ee, resolveDynamicComponent as Pe, markRaw as xe } from "vue";
+function De(t) {
+  return ge() ? (he(t), !0) : !1;
 }
+function Ie(t) {
+  let e = !1, n;
+  const i = ve(!0);
+  return (...u) => (e || (n = i.run(() => t(...u)), e = !0), n);
+}
+const Me = typeof window < "u" && typeof document < "u";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
-const C = ve(() => {
-  const t = p([]), e = w(() => t.value.length > 0), l = {
-    component: p(null),
-    ref: p(null)
-  }, u = p([]), c = p([]), n = p([]), i = {
-    zone: p(null),
-    element: p(null)
-  }, d = {
-    current: p(null),
-    start: p(null),
+const Se = (t) => t != null, H = () => {
+};
+function Le(t, e) {
+  function n(...i) {
+    return new Promise((u, r) => {
+      Promise.resolve(t(() => e.apply(this, i), { fn: e, thisArg: this, args: i })).then(u).catch(r);
+    });
+  }
+  return n;
+}
+function Ce(...t) {
+  let e = 0, n, i = !0, u = H, r, l, v, d, p;
+  !fe(t[0]) && typeof t[0] == "object" ? { delay: l, trailing: v = !0, leading: d = !0, rejectOnCancel: p = !1 } = t[0] : [l, v = !0, d = !0, p = !1] = t;
+  const o = () => {
+    n && (clearTimeout(n), n = void 0, u(), u = H);
+  };
+  return (D) => {
+    const h = b(l), y = Date.now() - e, s = () => r = D();
+    return o(), h <= 0 ? (e = Date.now(), s()) : (y > h && (d || !i) ? (e = Date.now(), s()) : v && (r = new Promise((g, m) => {
+      u = p ? m : g, n = setTimeout(() => {
+        e = Date.now(), i = !0, g(s()), o();
+      }, Math.max(0, h - y));
+    })), !d && !n && (n = setTimeout(() => i = !0, h)), i = !1, r);
+  };
+}
+function _e(t) {
+  return Array.isArray(t) ? t : [t];
+}
+function Oe(t, e = 200, n = !1, i = !0, u = !1) {
+  return Le(
+    Ce(e, n, i, u),
+    t
+  );
+}
+function Te(t, e, n) {
+  const i = ie(t, (...u) => (de(() => i()), e(...u)), n);
+  return i;
+}
+const ue = Me ? window : void 0;
+function X(t) {
+  var e;
+  const n = b(t);
+  return (e = n == null ? void 0 : n.$el) != null ? e : n;
+}
+function ke() {
+  const t = U(!1), e = me();
+  return e && F(() => {
+    t.value = !0;
+  }, e), t;
+}
+function ze(t) {
+  const e = ke();
+  return x(() => (e.value, !!t()));
+}
+function Re(t, e, n = {}) {
+  const {
+    root: i,
+    rootMargin: u = "0px",
+    threshold: r = 0,
+    window: l = ue,
+    immediate: v = !0
+  } = n, d = ze(() => l && "IntersectionObserver" in l), p = x(() => {
+    const y = b(t);
+    return _e(y).map(X).filter(Se);
+  });
+  let o = H;
+  const f = U(v), D = d.value ? ie(
+    () => [p.value, X(i), f.value],
+    ([y, s]) => {
+      if (o(), !f.value || !y.length)
+        return;
+      const g = new IntersectionObserver(
+        e,
+        {
+          root: X(s),
+          rootMargin: u,
+          threshold: r
+        }
+      );
+      y.forEach((m) => m && g.observe(m)), o = () => {
+        g.disconnect(), o = H;
+      };
+    },
+    { immediate: v, flush: "post" }
+  ) : H, h = () => {
+    o(), D(), f.value = !1;
+  };
+  return De(h), {
+    isSupported: d,
+    isActive: f,
+    pause() {
+      o(), f.value = !1;
+    },
+    resume() {
+      f.value = !0;
+    },
+    stop: h
+  };
+}
+function He(t, e = {}) {
+  const {
+    window: n = ue,
+    scrollTarget: i,
+    threshold: u = 0,
+    rootMargin: r,
+    once: l = !1
+  } = e, v = U(!1), { stop: d } = Re(
+    t,
+    (p) => {
+      let o = v.value, f = 0;
+      for (const D of p)
+        D.time >= f && (f = D.time, o = D.isIntersecting);
+      v.value = o, l && Te(v, () => {
+        d();
+      });
+    },
+    {
+      root: i,
+      window: n,
+      threshold: u,
+      rootMargin: b(r)
+    }
+  );
+  return v;
+}
+const C = Ie(() => {
+  const t = P([]), e = x(() => t.value.length > 0), n = {
+    component: P(null),
+    ref: P(null)
+  }, i = P([]), u = P([]), r = P([]), l = {
+    zone: P(null),
+    element: P(null)
+  }, v = {
+    current: P(null),
+    start: P(null),
     offset: {
-      percent: p(null),
-      pixel: p(null)
+      percent: P(null),
+      pixel: P(null)
     }
   };
   return {
     isDragging: e,
-    activeContainer: l,
-    elements: u,
+    activeContainer: n,
+    elements: i,
     draggingElements: t,
-    selectedElements: c,
-    zones: n,
-    hovered: i,
-    pointerPosition: d
+    selectedElements: u,
+    zones: r,
+    hovered: l,
+    pointerPosition: v
   };
-}), de = () => {
-  const t = p(null), { draggingElements: e, pointerPosition: l, isDragging: u, activeContainer: c } = C();
-  return $(() => {
-    c.ref = t;
-  }), F(() => {
-    c.ref.value = null;
+}), Ae = () => {
+  const t = P(null), { draggingElements: e, pointerPosition: n, isDragging: i, activeContainer: u } = C();
+  return F(() => {
+    u.ref = t;
+  }), j(() => {
+    u.ref.value = null;
   }), {
     elementRef: t,
     draggingElements: e,
-    pointerPosition: l,
-    isDragging: u
+    pointerPosition: n,
+    isDragging: i
   };
-}, ge = ["innerHTML"], he = /* @__PURE__ */ ne({
+}, Ve = ["innerHTML"], be = /* @__PURE__ */ ae({
   __name: "DefaultOverlay",
   setup(t) {
-    const { elementRef: e, pointerPosition: l, isDragging: u, draggingElements: c } = de(), n = w(() => {
-      var i, d, f, y;
+    const { elementRef: e, pointerPosition: n, isDragging: i, draggingElements: u } = Ae(), r = x(() => {
+      var l, v, d, p;
       return {
-        transform: `translate3d(${(((i = l.current.value) == null ? void 0 : i.x) ?? 0) - (((d = l.offset.pixel.value) == null ? void 0 : d.x) ?? 0)}px, ${(((f = l.current.value) == null ? void 0 : f.y) ?? 0) - (((y = l.offset.pixel.value) == null ? void 0 : y.y) ?? 0)}px, 0)`,
+        transform: `translate3d(${(((l = n.current.value) == null ? void 0 : l.x) ?? 0) - (((v = n.offset.pixel.value) == null ? void 0 : v.x) ?? 0)}px, ${(((d = n.current.value) == null ? void 0 : d.y) ?? 0) - (((p = n.offset.pixel.value) == null ? void 0 : p.y) ?? 0)}px, 0)`,
         zIndex: 1e3,
         position: "fixed",
         top: 0,
@@ -56,97 +185,99 @@ const C = ve(() => {
         transition: "0.3s cubic-bezier(0.165, 0.84, 0.44, 1)"
       };
     });
-    return (i, d) => Q(u) ? (R(), X("div", {
+    return (l, v) => re(i) ? (V(), W("div", {
       key: 0,
       ref_key: "elementRef",
       ref: e,
-      style: b(n.value)
+      style: oe(r.value)
     }, [
-      (R(!0), X(ie, null, se(Q(c), (f, y) => {
-        var s, E;
-        return R(), X("div", {
-          key: y,
-          innerHTML: f.initialHTML,
-          style: b({
-            width: `${(s = f.initialRect) == null ? void 0 : s.width}px`,
-            height: `${(E = f.initialRect) == null ? void 0 : E.height}px`
+      (V(!0), W(ye, null, we(re(u), (d, p) => {
+        var o, f;
+        return V(), W("div", {
+          key: p,
+          innerHTML: d.initialHTML,
+          style: oe({
+            width: `${(o = d.initialRect) == null ? void 0 : o.width}px`,
+            height: `${(f = d.initialRect) == null ? void 0 : f.height}px`
           })
-        }, null, 12, ge);
+        }, null, 12, Ve);
       }), 128))
-    ], 4)) : le("", !0);
+    ], 4)) : pe("", !0);
   }
-}), De = /* @__PURE__ */ ne({
+}), Ge = /* @__PURE__ */ ae({
   __name: "DragOverlay",
   setup(t) {
-    const { activeContainer: e } = C(), l = w(
-      () => e.component.value ?? he
+    const { activeContainer: e } = C(), n = x(
+      () => e.component.value ?? be
     );
-    return (u, c) => (R(), ae(ue(l.value)));
+    return (i, u) => (V(), Ee(Pe(n.value)));
   }
-}), fe = "data-dnd-draggable", me = (t) => {
+}), Fe = "data-dnd-draggable", Ze = (t) => {
   const {
     elements: e,
-    draggingElements: l,
-    hovered: u,
-    selectedElements: c,
-    isDragging: n
-  } = C(), i = p(null), d = w(
+    draggingElements: n,
+    hovered: i,
+    selectedElements: u,
+    isDragging: r
+  } = C(), l = P(null), v = x(
     () => {
-      var m;
-      return ((m = u.element.value) == null ? void 0 : m.node) === i.value;
+      var h;
+      return ((h = i.element.value) == null ? void 0 : h.node) === l.value;
     }
-  ), f = w(
-    () => l.value.some((m) => m.node === i.value)
-  ), y = w(() => {
-    if (!i.value || !n.value) return !1;
-    const m = e.value.find(
-      (D) => D.node === i.value
+  ), d = He(l), p = x(
+    () => n.value.some((h) => h.node === l.value)
+  ), o = x(() => {
+    if (!l.value || !r.value) return !1;
+    const h = e.value.find(
+      (y) => y.node === l.value
     );
-    return m != null && m.groups.length ? !l.value.some((D) => D.groups.length ? !D.groups.some(
-      (r) => m.groups.includes(r)
+    return h != null && h.groups.length ? !n.value.some((y) => y.groups.length ? !y.groups.some(
+      (s) => h.groups.includes(s)
     ) : !1) : !0;
   });
   return {
-    elementRef: i,
+    elementRef: l,
     registerElement: () => {
-      if (!i.value) throw new Error("ElementRef is not set");
+      if (!l.value) throw new Error("ElementRef is not set");
       e.value.push({
-        node: i.value,
+        node: l.value,
         groups: (t == null ? void 0 : t.groups) ?? [],
         layer: (t == null ? void 0 : t.layer) ?? null,
         defaultLayer: (t == null ? void 0 : t.layer) ?? null,
         events: (t == null ? void 0 : t.events) ?? {},
-        data: (t == null ? void 0 : t.data) ?? void 0
-      }), i.value.setAttribute(fe, "true");
+        data: (t == null ? void 0 : t.data) ?? void 0,
+        isVisible: d
+      }), l.value.setAttribute(Fe, "true");
     },
     unregisterElement: () => {
-      const m = e.value.findIndex(
-        (r) => r.node === i.value
+      const h = e.value.findIndex(
+        (s) => s.node === l.value
       );
-      m !== -1 && e.value.splice(m, 1);
-      const D = c.value.findIndex(
-        (r) => r.node === i.value
+      h !== -1 && e.value.splice(h, 1);
+      const y = u.value.findIndex(
+        (s) => s.node === l.value
       );
-      D !== -1 && c.value.splice(D, 1);
+      y !== -1 && u.value.splice(y, 1);
     },
-    isDragging: f,
-    isOvered: d,
-    isAllowed: y
+    isDragging: p,
+    isOvered: v,
+    isAllowed: o,
+    isVisible: d
   };
-}, pe = () => {
-  let t = "", e = "", l = "";
-  const u = () => {
-    const i = document.body;
-    t = i.style.userSelect, e = i.style.touchAction, l = i.style.overscrollBehavior, i.style.userSelect = "none", i.style.touchAction = "none", i.style.overscrollBehavior = "none", window.addEventListener("contextmenu", n), window.addEventListener("selectstart", n), window.addEventListener("touchstart", n), window.addEventListener("touchmove", n);
-  }, c = () => {
-    const i = document.body;
-    i.style.userSelect = t, i.style.touchAction = e, i.style.overscrollBehavior = l, window.removeEventListener("contextmenu", n), window.removeEventListener("selectstart", n), window.removeEventListener("touchstart", n), window.removeEventListener("touchmove", n);
-  }, n = (i) => i.preventDefault();
+}, $e = () => {
+  let t = "", e = "", n = "";
+  const i = () => {
+    const l = document.body;
+    t = l.style.userSelect, e = l.style.touchAction, n = l.style.overscrollBehavior, l.style.userSelect = "none", l.style.touchAction = "none", l.style.overscrollBehavior = "none", window.addEventListener("contextmenu", r), window.addEventListener("selectstart", r), window.addEventListener("touchstart", r), window.addEventListener("touchmove", r);
+  }, u = () => {
+    const l = document.body;
+    l.style.userSelect = t, l.style.touchAction = e, l.style.overscrollBehavior = n, window.removeEventListener("contextmenu", r), window.removeEventListener("selectstart", r), window.removeEventListener("touchstart", r), window.removeEventListener("touchmove", r);
+  }, r = (l) => l.preventDefault();
   return {
-    disableInteractions: u,
-    enableInteractions: c
+    disableInteractions: i,
+    enableInteractions: u
   };
-}, ee = (t, e) => t.x < e.x + e.width && t.x + t.width > e.x && t.y < e.y + e.height && t.y + t.height > e.y, O = (t) => {
+}, le = (t, e) => t.x < e.x + e.width && t.x + t.width > e.x && t.y < e.y + e.height && t.y + t.height > e.y, k = (t) => {
   if (!t)
     return {
       x: 0,
@@ -172,270 +303,270 @@ const C = ve(() => {
 }, Y = (t) => ({
   x: t.x + t.width / 2,
   y: t.y + t.height / 2
-}), ye = (t, e) => {
-  const l = O(t);
+}), We = (t, e) => {
+  const n = k(t);
   return {
     pixel: {
-      x: e.x - l.x,
-      y: e.y - l.y
+      x: e.x - n.x,
+      y: e.y - n.y
     },
     percent: {
-      x: (e.x - l.x) / l.width * 100,
-      y: (e.y - l.y) / l.height * 100
+      x: (e.x - n.x) / n.width * 100,
+      y: (e.y - n.y) / n.height * 100
     }
   };
-}, te = (t, e) => {
-  const l = e.x - t.x, u = e.y - t.y;
-  return Math.sqrt(l * l + u * u);
-}, S = (t, e) => t ? e.contains(t) : !1, Ee = (t) => {
+}, se = (t, e) => {
+  const n = e.x - t.x, i = e.y - t.y;
+  return Math.sqrt(n * n + i * i);
+}, L = (t, e) => t ? e.contains(t) : !1, Xe = (t) => {
   const e = C();
   return {
-    onPointerStart: (n) => {
-      e.pointerPosition.start.value = { x: n.clientX, y: n.clientY }, e.pointerPosition.current.value = {
-        x: n.clientX,
-        y: n.clientY
+    onPointerStart: (r) => {
+      e.pointerPosition.start.value = { x: r.clientX, y: r.clientY }, e.pointerPosition.current.value = {
+        x: r.clientX,
+        y: r.clientY
       };
-      const { pixel: i, percent: d } = ye(t.value, {
-        x: n.clientX,
-        y: n.clientY
+      const { pixel: l, percent: v } = We(t.value, {
+        x: r.clientX,
+        y: r.clientY
       });
-      e.pointerPosition.offset.pixel.value = i, e.pointerPosition.offset.percent.value = d;
+      e.pointerPosition.offset.pixel.value = l, e.pointerPosition.offset.percent.value = v;
     },
-    onPointerMove: (n) => {
+    onPointerMove: (r) => {
       e.pointerPosition.current.value = {
-        x: n.clientX,
-        y: n.clientY
+        x: r.clientX,
+        y: r.clientY
       };
     },
     onPointerEnd: () => {
       e.pointerPosition.current.value = null, e.pointerPosition.start.value = null, e.pointerPosition.offset.pixel.value = null, e.pointerPosition.offset.percent.value = null;
     }
   };
-}, Pe = (t) => {
-  const e = C(), { onPointerStart: l, onPointerMove: u, onPointerEnd: c } = Ee(t);
-  let n = null;
-  const i = (r) => {
-    var v, L;
+}, Ye = (t) => {
+  const e = C(), { onPointerStart: n, onPointerMove: i, onPointerEnd: u } = Xe(t);
+  let r = null;
+  const l = (s) => {
+    var w, E;
     const g = e.selectedElements.value.some(
-      (P) => P.node === r
+      (I) => I.node === s
     );
     if (e.selectedElements.value.length && g)
-      return e.selectedElements.value.map((P) => {
-        var M, T;
+      return e.selectedElements.value.map((I) => {
+        var _, A;
         return {
-          ...P,
-          initialHTML: ((M = P.node) == null ? void 0 : M.outerHTML) ?? "",
-          initialRect: (T = P.node) == null ? void 0 : T.getBoundingClientRect()
+          ...I,
+          initialHTML: ((_ = I.node) == null ? void 0 : _.outerHTML) ?? "",
+          initialRect: (A = I.node) == null ? void 0 : A.getBoundingClientRect()
         };
       });
     e.selectedElements.value = [];
-    const h = e.elements.value.find(
-      (P) => P.node === r
+    const m = e.elements.value.find(
+      (I) => I.node === s
     );
-    return h ? [
+    return m ? [
       {
-        ...h,
-        initialHTML: ((v = h.node) == null ? void 0 : v.outerHTML) ?? "",
-        initialRect: (L = h.node) == null ? void 0 : L.getBoundingClientRect()
+        ...m,
+        initialHTML: ((w = m.node) == null ? void 0 : w.outerHTML) ?? "",
+        initialRect: (E = m.node) == null ? void 0 : E.getBoundingClientRect()
       }
     ] : [];
-  }, d = (r, g) => {
-    const h = Math.max(
+  }, v = (s, g) => {
+    const m = Math.max(
       0,
-      Math.min(r.x + r.width, g.x + g.width) - Math.max(r.x, g.x)
-    ), v = Math.max(
+      Math.min(s.x + s.width, g.x + g.width) - Math.max(s.x, g.x)
+    ), w = Math.max(
       0,
-      Math.min(r.y + r.height, g.y + g.height) - Math.max(r.y, g.y)
-    ), L = h * v, P = r.width * r.height, M = g.width * g.height;
-    return (L / P * 100 + L / M * 100) / 2;
-  }, f = () => {
-    var U, G, q, N, W, B, V, j, J, K;
-    const r = O(e.activeContainer.ref.value), g = Y(r), h = ((U = e.pointerPosition.current.value) == null ? void 0 : U.x) ?? 0, v = ((G = e.pointerPosition.current.value) == null ? void 0 : G.y) ?? 0, P = !(r && h >= r.x && h <= r.x + r.width && v >= r.y && v <= r.y + r.height), M = e.draggingElements.value.map((o) => o.node), T = e.elements.value.filter((o) => {
-      if (!o.node || M.some(
-        (x) => x && S(o.node, x)
-      ) || o.groups.length && !!e.draggingElements.value.some(
-        (I) => I.groups.length ? !I.groups.some(
-          (_) => o.groups.includes(_)
+      Math.min(s.y + s.height, g.y + g.height) - Math.max(s.y, g.y)
+    ), E = m * w, I = s.width * s.height, _ = g.width * g.height;
+    return (E / I * 100 + E / _ * 100) / 2;
+  }, d = Oe(() => {
+    var G, N, q, B, J, K, Q, ee, te, ne;
+    const s = k(e.activeContainer.ref.value), g = Y(s), m = ((G = e.pointerPosition.current.value) == null ? void 0 : G.x) ?? 0, w = ((N = e.pointerPosition.current.value) == null ? void 0 : N.y) ?? 0, I = !(s && m >= s.x && m <= s.x + s.width && w >= s.y && w <= s.y + s.height), _ = e.draggingElements.value.map((a) => a.node), A = e.elements.value.filter((a) => {
+      if (!a.isVisible || !a.isVisible.value || !a.node || _.some(
+        (M) => M && L(a.node, M)
+      ) || a.groups.length && !!e.draggingElements.value.some(
+        (S) => S.groups.length ? !S.groups.some(
+          (O) => a.groups.includes(O)
         ) : !1
       ))
         return !1;
-      const a = O(o.node);
-      return a && r && ee(a, r);
-    }).map((o) => {
-      const a = O(o.node), x = Y(a), I = h >= a.x && h <= a.x + a.width && v >= a.y && v <= a.y + a.height, _ = d(a, r), Z = te(g, x), A = e.elements.value.filter(
-        (k) => k !== o && k.node && o.node && S(
-          o.node,
-          k.node
+      const c = k(a.node);
+      return c && s && le(c, s);
+    }).map((a) => {
+      const c = k(a.node), M = Y(c), S = m >= c.x && m <= c.x + c.width && w >= c.y && w <= c.y + c.height, O = v(c, s), Z = se(g, M), $ = e.elements.value.filter(
+        (T) => T !== a && T.node && a.node && L(
+          a.node,
+          T.node
         )
       ).length;
       return {
-        element: o,
-        isPointerInElement: I,
-        overlapPercent: _,
-        depth: A,
+        element: a,
+        isPointerInElement: S,
+        overlapPercent: O,
+        depth: $,
         centerDistance: Z
       };
-    }).sort((o, a) => {
-      if (!P) {
-        if (o.isPointerInElement && a.isPointerInElement)
-          return a.depth - o.depth;
-        if (o.isPointerInElement !== a.isPointerInElement)
-          return o.isPointerInElement ? -1 : 1;
+    }).sort((a, c) => {
+      if (!I) {
+        if (a.isPointerInElement && c.isPointerInElement)
+          return c.depth - a.depth;
+        if (a.isPointerInElement !== c.isPointerInElement)
+          return a.isPointerInElement ? -1 : 1;
       }
-      return Math.abs(o.overlapPercent - a.overlapPercent) <= 1 ? o.centerDistance - a.centerDistance : a.overlapPercent - o.overlapPercent;
-    }), re = e.zones.value.filter((o) => {
-      if (!o.node || M.some(
-        (x) => x && S(o.node, x)
-      ) || o.groups.length && !!e.draggingElements.value.some((I) => I.groups.length ? !I.groups.some((_) => o.groups.includes(_)) : !1))
+      return Math.abs(a.overlapPercent - c.overlapPercent) <= 1 ? a.centerDistance - c.centerDistance : c.overlapPercent - a.overlapPercent;
+    }), ce = e.zones.value.filter((a) => {
+      if (!a.node || _.some(
+        (M) => M && L(a.node, M)
+      ) || a.groups.length && !!e.draggingElements.value.some((S) => S.groups.length ? !S.groups.some((O) => a.groups.includes(O)) : !1))
         return !1;
-      const a = O(o.node);
-      return a && r && ee(a, r);
-    }).map((o) => {
-      const a = O(o.node), x = Y(a), I = h >= a.x && h <= a.x + a.width && v >= a.y && v <= a.y + a.height, _ = d(a, r), Z = te(g, x), A = e.zones.value.filter(
-        (k) => k !== o && k.node && o.node && S(o.node, k.node)
+      const c = k(a.node);
+      return c && s && le(c, s);
+    }).map((a) => {
+      const c = k(a.node), M = Y(c), S = m >= c.x && m <= c.x + c.width && w >= c.y && w <= c.y + c.height, O = v(c, s), Z = se(g, M), $ = e.zones.value.filter(
+        (T) => T !== a && T.node && a.node && L(a.node, T.node)
       ).length;
       return {
-        zone: o,
-        isPointerInElement: I,
-        overlapPercent: _,
-        depth: A,
+        zone: a,
+        isPointerInElement: S,
+        overlapPercent: O,
+        depth: $,
         centerDistance: Z
       };
-    }).sort((o, a) => {
-      if (!P) {
-        if (o.isPointerInElement && a.isPointerInElement)
-          return a.depth - o.depth;
-        if (o.isPointerInElement !== a.isPointerInElement)
-          return o.isPointerInElement ? -1 : 1;
+    }).sort((a, c) => {
+      if (!I) {
+        if (a.isPointerInElement && c.isPointerInElement)
+          return c.depth - a.depth;
+        if (a.isPointerInElement !== c.isPointerInElement)
+          return a.isPointerInElement ? -1 : 1;
       }
-      return Math.abs(o.overlapPercent - a.overlapPercent) <= 1 ? o.centerDistance - a.centerDistance : a.overlapPercent - o.overlapPercent;
-    }), z = e.hovered.element.value, H = e.hovered.zone.value;
-    e.hovered.element.value = ((q = T[0]) == null ? void 0 : q.element) ?? null, e.hovered.zone.value = ((N = re[0]) == null ? void 0 : N.zone) ?? null, e.hovered.element.value !== z && ((W = z == null ? void 0 : z.events) != null && W.onLeave && z.events.onLeave(e), (V = (B = e.hovered.element.value) == null ? void 0 : B.events) != null && V.onHover && e.hovered.element.value.events.onHover(e)), e.hovered.zone.value !== H && ((j = H == null ? void 0 : H.events) != null && j.onLeave && H.events.onLeave(e), (K = (J = e.hovered.zone.value) == null ? void 0 : J.events) != null && K.onHover && e.hovered.zone.value.events.onHover(e)), n = requestAnimationFrame(f);
-  }, y = () => {
-    f();
-  }, s = () => {
-    n !== null && (cancelAnimationFrame(n), n = null);
+      return Math.abs(a.overlapPercent - c.overlapPercent) <= 1 ? a.centerDistance - c.centerDistance : c.overlapPercent - a.overlapPercent;
+    }), z = e.hovered.element.value, R = e.hovered.zone.value;
+    e.hovered.element.value = ((q = A[0]) == null ? void 0 : q.element) ?? null, e.hovered.zone.value = ((B = ce[0]) == null ? void 0 : B.zone) ?? null, e.hovered.element.value !== z && ((J = z == null ? void 0 : z.events) != null && J.onLeave && z.events.onLeave(e), (Q = (K = e.hovered.element.value) == null ? void 0 : K.events) != null && Q.onHover && e.hovered.element.value.events.onHover(e)), e.hovered.zone.value !== R && ((ee = R == null ? void 0 : R.events) != null && ee.onLeave && R.events.onLeave(e), (ne = (te = e.hovered.zone.value) == null ? void 0 : te.events) != null && ne.onHover && e.hovered.zone.value.events.onHover(e)), console.log("processing collisions");
+  }, 1e3), p = () => {
+    d(), r = requestAnimationFrame(p);
+  }, o = () => {
+    p();
+  }, f = () => {
+    r !== null && (cancelAnimationFrame(r), r = null);
   };
   return {
-    activate: (r) => {
-      e.draggingElements.value = i(t.value), l(r), y();
+    activate: (s) => {
+      e.draggingElements.value = l(t.value), n(s), o();
     },
-    track: (r) => {
-      u(r);
+    track: (s) => {
+      i(s);
     },
     deactivate: () => {
-      var r, g;
-      c(), e.hovered.zone.value ? (g = (r = e.hovered.zone.value.events).onDrop) == null || g.call(r, e) : e.draggingElements.value.forEach(
-        (h) => {
-          var v, L;
-          return (L = (v = h.events).onEnd) == null ? void 0 : L.call(v, e);
+      var s, g;
+      u(), e.hovered.zone.value ? (g = (s = e.hovered.zone.value.events).onDrop) == null || g.call(s, e) : e.draggingElements.value.forEach(
+        (m) => {
+          var w, E;
+          return (E = (w = m.events).onEnd) == null ? void 0 : E.call(w, e);
         }
-      ), e.draggingElements.value = [], e.selectedElements.value = [], e.hovered.zone.value = null, e.hovered.element.value = null, s();
+      ), e.draggingElements.value = [], e.selectedElements.value = [], e.hovered.zone.value = null, e.hovered.element.value = null, f();
     }
   };
-}, Le = (t) => {
+}, Ne = (t) => {
   const {
     elementRef: e,
-    registerElement: l,
-    unregisterElement: u,
-    isDragging: c,
-    isOvered: n,
-    isAllowed: i
-  } = me(t), { disableInteractions: d, enableInteractions: f } = pe(), y = C(), { activate: s, track: E, deactivate: m } = Pe(e), D = (v) => {
-    t != null && t.container && (y.activeContainer.component.value = ce(t.container)), d(), s(v), document.addEventListener("pointermove", r), document.addEventListener("pointerup", h), document.addEventListener("wheel", g);
-  }, r = (v) => {
-    E(v);
-  }, g = (v) => {
-    E(v);
-  }, h = () => {
-    y.activeContainer.component.value = null, f(), m(), document.removeEventListener("pointermove", r), document.removeEventListener("pointerup", h), document.removeEventListener("wheel", g);
+    registerElement: n,
+    unregisterElement: i,
+    isDragging: u,
+    isOvered: r,
+    isAllowed: l,
+    isVisible: v
+  } = Ze(t), { disableInteractions: d, enableInteractions: p } = $e(), { activeContainer: o, pointerPosition: f } = C(), { activate: D, track: h, deactivate: y } = Ye(e), s = (E) => {
+    t != null && t.container && (o.component.value = xe(t.container)), d(), D(E), document.addEventListener("pointermove", g), document.addEventListener("pointerup", w), document.addEventListener("wheel", m);
+  }, g = (E) => h(E), m = (E) => h(E), w = () => {
+    o.component.value = null, p(), y(), document.removeEventListener("pointermove", g), document.removeEventListener("pointerup", w), document.removeEventListener("wheel", m);
   };
-  return $(l), F(u), {
-    pointerPosition: y.pointerPosition,
+  return F(n), j(i), {
+    pointerPosition: f,
     elementRef: e,
-    isDragging: c,
-    isOvered: n,
-    isAllowed: i,
-    handleDragStart: D
+    isDragging: u,
+    isOvered: r,
+    isAllowed: l,
+    handleDragStart: s,
+    isVisible: v
   };
-}, we = (t) => {
-  const { zones: e, hovered: l, draggingElements: u, isDragging: c } = C(), n = p(null), i = w(() => {
-    var s;
-    return ((s = l.zone.value) == null ? void 0 : s.node) === n.value;
-  }), d = w(() => {
-    if (!n.value || !c.value) return !1;
-    const s = e.value.find(
-      (E) => E.node === n.value
+}, Ue = (t) => {
+  const { zones: e, hovered: n, draggingElements: i, isDragging: u } = C(), r = P(null), l = x(() => {
+    var o;
+    return ((o = n.zone.value) == null ? void 0 : o.node) === r.value;
+  }), v = x(() => {
+    if (!r.value || !u.value) return !1;
+    const o = e.value.find(
+      (f) => f.node === r.value
     );
-    return s != null && s.groups.length ? !u.value.some((E) => E.groups.length ? !E.groups.some(
-      (m) => s.groups.includes(m)
+    return o != null && o.groups.length ? !i.value.some((f) => f.groups.length ? !f.groups.some(
+      (D) => o.groups.includes(D)
     ) : !1) : !0;
   });
-  return { elementRef: n, registerZone: () => {
-    if (!n.value) throw new Error("elementRef is not set");
+  return { elementRef: r, registerZone: () => {
+    if (!r.value) throw new Error("elementRef is not set");
     e.value.push({
-      node: n.value,
+      node: r.value,
       groups: (t == null ? void 0 : t.groups) ?? [],
       events: (t == null ? void 0 : t.events) ?? {},
       data: (t == null ? void 0 : t.data) ?? void 0
-    }), n.value.setAttribute("data-dnd-droppable", "true");
+    }), r.value.setAttribute("data-dnd-droppable", "true");
   }, unregisterZone: () => {
-    if (!n.value) throw new Error("elementRef is not set");
-    const s = e.value.findIndex(
-      (E) => E.node === n.value
+    if (!r.value) throw new Error("elementRef is not set");
+    const o = e.value.findIndex(
+      (f) => f.node === r.value
     );
-    s !== -1 && e.value.splice(s, 1);
-  }, isOvered: i, isAllowed: d };
-}, Ie = (t) => {
-  const { elementRef: e, registerZone: l, unregisterZone: u, isOvered: c, isAllowed: n } = we(t);
-  return $(l), F(u), { elementRef: e, isOvered: c, isAllowed: n };
-}, Se = (t) => {
-  const { selectedElements: e, elements: l } = C(), u = w(
-    () => l.value.find((s) => s.node === t.value)
-  ), c = w(
-    () => e.value.some((s) => s.node === t.value)
-  ), n = w(() => t.value ? e.value.some(
-    (s) => s.node && S(
-      s.node,
+    o !== -1 && e.value.splice(o, 1);
+  }, isOvered: l, isAllowed: v };
+}, qe = (t) => {
+  const { elementRef: e, registerZone: n, unregisterZone: i, isOvered: u, isAllowed: r } = Ue(t);
+  return F(n), j(i), { elementRef: e, isOvered: u, isAllowed: r };
+}, Be = (t) => {
+  const { selectedElements: e, elements: n } = C(), i = x(
+    () => n.value.find((o) => o.node === t.value)
+  ), u = x(
+    () => e.value.some((o) => o.node === t.value)
+  ), r = x(() => t.value ? e.value.some(
+    (o) => o.node && L(
+      o.node,
       t.value
     )
-  ) : !1), i = w(() => t.value ? e.value.some(
-    (s) => s.node && S(
+  ) : !1), l = x(() => t.value ? e.value.some(
+    (o) => o.node && L(
       t.value,
-      s.node
+      o.node
     )
-  ) : !1), d = () => {
-    u.value && (e.value = e.value.filter(
-      (s) => s.node !== t.value
+  ) : !1), v = () => {
+    i.value && (e.value = e.value.filter(
+      (o) => o.node !== t.value
     ));
-  }, f = () => {
-    u.value && (n.value && (e.value = e.value.filter(
-      (s) => s.node && !S(
-        s.node,
+  }, d = () => {
+    i.value && (r.value && (e.value = e.value.filter(
+      (o) => o.node && !L(
+        o.node,
         t.value
       )
-    )), i.value && (e.value = e.value.filter(
-      (s) => s.node && !S(
+    )), l.value && (e.value = e.value.filter(
+      (o) => o.node && !L(
         t.value,
-        s.node
+        o.node
       )
-    )), e.value.push(u.value));
+    )), e.value.push(i.value));
   };
   return {
-    handleUnselect: d,
-    handleSelect: f,
+    handleUnselect: v,
+    handleSelect: d,
     handleToggleSelect: () => {
-      u.value && (e.value.some((s) => s.node === t.value) ? d() : f());
+      i.value && (e.value.some((o) => o.node === t.value) ? v() : d());
     },
-    isSelected: c,
-    isParentOfSelected: n
+    isSelected: u,
+    isParentOfSelected: r
   };
 };
 export {
-  De as DragOverlay,
-  O as getBoundingBox,
+  Ge as DragOverlay,
+  k as getBoundingBox,
   C as useDnDStore,
-  Le as useDraggable,
-  Ie as useDroppable,
-  Se as useSelection
+  Ne as useDraggable,
+  qe as useDroppable,
+  Be as useSelection
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-dnd-kit/core",
-  "version": "0.0.34-beta",
+  "version": "0.0.36-beta",
   "description": "Core functionality for Vue DnD Kit - a lightweight Vue 3 library for building performant and accessible drag and drop interfaces",
   "author": "ZiZIGY",
   "license": "MIT",