@vue-dnd-kit/core 0.0.48-beta → 0.0.49-beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -238,7 +238,7 @@ export declare const useDnDStore: () => {
238
238
  ref: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
239
239
  };
240
240
  elements: import('vue').Ref<{
241
- node: Element | HTMLElement | null;
241
+ node: HTMLElement | Element | null;
242
242
  groups: string[];
243
243
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
244
244
  new (...args: any[]): any;
@@ -486,7 +486,7 @@ export declare const useDnDStore: () => {
486
486
  onEnd?: ((store: import('../types').IDnDStore) => void) | undefined;
487
487
  };
488
488
  }[], IDragElement[] | {
489
- node: Element | HTMLElement | null;
489
+ node: HTMLElement | Element | null;
490
490
  groups: string[];
491
491
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
492
492
  new (...args: any[]): any;
@@ -747,7 +747,7 @@ export declare const useDnDStore: () => {
747
747
  readonly top: number;
748
748
  toJSON: () => any;
749
749
  } | undefined;
750
- node: Element | HTMLElement | null;
750
+ node: HTMLElement | Element | null;
751
751
  groups: string[];
752
752
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
753
753
  new (...args: any[]): any;
@@ -1007,7 +1007,7 @@ export declare const useDnDStore: () => {
1007
1007
  readonly top: number;
1008
1008
  toJSON: () => any;
1009
1009
  } | undefined;
1010
- node: Element | HTMLElement | null;
1010
+ node: HTMLElement | Element | null;
1011
1011
  groups: string[];
1012
1012
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
1013
1013
  new (...args: any[]): any;
@@ -1256,7 +1256,7 @@ export declare const useDnDStore: () => {
1256
1256
  };
1257
1257
  }[]>;
1258
1258
  selectedElements: import('vue').Ref<{
1259
- node: Element | HTMLElement | null;
1259
+ node: HTMLElement | Element | null;
1260
1260
  groups: string[];
1261
1261
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
1262
1262
  new (...args: any[]): any;
@@ -1504,7 +1504,7 @@ export declare const useDnDStore: () => {
1504
1504
  onEnd?: ((store: import('../types').IDnDStore) => void) | undefined;
1505
1505
  };
1506
1506
  }[], IDragElement[] | {
1507
- node: Element | HTMLElement | null;
1507
+ node: HTMLElement | Element | null;
1508
1508
  groups: string[];
1509
1509
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
1510
1510
  new (...args: any[]): any;
@@ -1753,7 +1753,7 @@ export declare const useDnDStore: () => {
1753
1753
  };
1754
1754
  }[]>;
1755
1755
  zones: import('vue').Ref<{
1756
- node: Element | HTMLElement | null;
1756
+ node: HTMLElement | Element | null;
1757
1757
  groups: string[];
1758
1758
  data: any;
1759
1759
  events: {
@@ -1762,7 +1762,7 @@ export declare const useDnDStore: () => {
1762
1762
  onDrop?: ((store: import('../types').IDnDStore) => void) | undefined;
1763
1763
  };
1764
1764
  }[], IDropZone[] | {
1765
- node: Element | HTMLElement | null;
1765
+ node: HTMLElement | Element | null;
1766
1766
  groups: string[];
1767
1767
  data: any;
1768
1768
  events: {
@@ -1774,7 +1774,7 @@ export declare const useDnDStore: () => {
1774
1774
  visibleElements: import('vue').ComputedRef<number[]>;
1775
1775
  hovered: {
1776
1776
  zone: import('vue').Ref<{
1777
- node: Element | HTMLElement | null;
1777
+ node: HTMLElement | Element | null;
1778
1778
  groups: string[];
1779
1779
  data: any;
1780
1780
  events: {
@@ -1783,7 +1783,7 @@ export declare const useDnDStore: () => {
1783
1783
  onDrop?: ((store: import('../types').IDnDStore) => void) | undefined;
1784
1784
  };
1785
1785
  } | null, IDropZone | {
1786
- node: Element | HTMLElement | null;
1786
+ node: HTMLElement | Element | null;
1787
1787
  groups: string[];
1788
1788
  data: any;
1789
1789
  events: {
@@ -1793,7 +1793,7 @@ export declare const useDnDStore: () => {
1793
1793
  };
1794
1794
  } | null>;
1795
1795
  element: import('vue').Ref<{
1796
- node: Element | HTMLElement | null;
1796
+ node: HTMLElement | Element | null;
1797
1797
  groups: string[];
1798
1798
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
1799
1799
  new (...args: any[]): any;
@@ -2041,7 +2041,7 @@ export declare const useDnDStore: () => {
2041
2041
  onEnd?: ((store: import('../types').IDnDStore) => void) | undefined;
2042
2042
  };
2043
2043
  } | null, IDragElement | {
2044
- node: Element | HTMLElement | null;
2044
+ node: HTMLElement | Element | null;
2045
2045
  groups: string[];
2046
2046
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
2047
2047
  new (...args: any[]): any;
@@ -80,7 +80,7 @@ export declare const useDragContainer: () => {
80
80
  readonly top: number;
81
81
  toJSON: () => any;
82
82
  } | undefined;
83
- node: Element | HTMLElement | null;
83
+ node: HTMLElement | Element | null;
84
84
  groups: string[];
85
85
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
86
86
  new (...args: any[]): any;
@@ -340,7 +340,7 @@ export declare const useDragContainer: () => {
340
340
  readonly top: number;
341
341
  toJSON: () => any;
342
342
  } | undefined;
343
- node: Element | HTMLElement | null;
343
+ node: HTMLElement | Element | null;
344
344
  groups: string[];
345
345
  layer: import('vue').FunctionalComponent<any, {}, any, {}> | {
346
346
  new (...args: any[]): any;
package/dist/plugin.d.ts CHANGED
@@ -5,7 +5,7 @@ export declare const VueDndKitPlugin: {
5
5
  declare module '@vue/runtime-core' {
6
6
  interface App {
7
7
  __VUE_DND_KIT_OVERLAY__?: {
8
- rootElement: Element;
8
+ container: HTMLElement;
9
9
  vnode: any;
10
10
  };
11
11
  }
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue");function te(t){return n.getCurrentScope()?(n.onScopeDispose(t),!0):!1}function ne(t){let e=!1,r;const s=n.effectScope(!0);return(...c)=>(e||(r=s.run(()=>t(...c)),e=!0),r)}const re=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const oe=t=>t!=null,R=()=>{};function le(t,e){function r(...s){return new Promise((c,o)=>{Promise.resolve(t(()=>e.apply(this,s),{fn:e,thisArg:this,args:s})).then(c).catch(o)})}return r}function se(...t){let e=0,r,s=!0,c=R,o,i,v,f,m;!n.isRef(t[0])&&typeof t[0]=="object"?{delay:i,trailing:v=!0,leading:f=!0,rejectOnCancel:m=!1}=t[0]:[i,v=!0,f=!0,m=!1]=t;const l=()=>{r&&(clearTimeout(r),r=void 0,c(),c=R)};return D=>{const p=n.toValue(i),E=Date.now()-e,u=()=>o=D();return l(),p<=0?(e=Date.now(),u()):(E>p&&(f||!s)?(e=Date.now(),u()):v&&(o=new Promise((h,y)=>{c=m?y:h,r=setTimeout(()=>{e=Date.now(),s=!0,h(u()),l()},Math.max(0,p-E))})),!f&&!r&&(r=setTimeout(()=>s=!0,p)),s=!1,o)}}function ie(t){return Array.isArray(t)?t:[t]}function ue(t,e=200,r=!1,s=!0,c=!1){return le(se(e,r,s,c),t)}function ae(t,e,r){const s=n.watch(t,(...c)=>(n.nextTick(()=>s()),e(...c)),r);return s}const Q=re?window:void 0;function B(t){var e;const r=n.toValue(t);return(e=r==null?void 0:r.$el)!=null?e:r}function ce(){const t=n.shallowRef(!1),e=n.getCurrentInstance();return e&&n.onMounted(()=>{t.value=!0},e),t}function de(t){const e=ce();return n.computed(()=>(e.value,!!t()))}function ve(t,e,r={}){const{root:s,rootMargin:c="0px",threshold:o=0,window:i=Q,immediate:v=!0}=r,f=de(()=>i&&"IntersectionObserver"in i),m=n.computed(()=>{const E=n.toValue(t);return ie(E).map(B).filter(oe)});let l=R;const g=n.shallowRef(v),D=f.value?n.watch(()=>[m.value,B(s),g.value],([E,u])=>{if(l(),!g.value||!E.length)return;const h=new IntersectionObserver(e,{root:B(u),rootMargin:c,threshold:o});E.forEach(y=>y&&h.observe(y)),l=()=>{h.disconnect(),l=R}},{immediate:v,flush:"post"}):R,p=()=>{l(),D(),g.value=!1};return te(p),{isSupported:f,isActive:g,pause(){l(),g.value=!1},resume(){g.value=!0},stop:p}}function fe(t,e={}){const{window:r=Q,scrollTarget:s,threshold:c=0,rootMargin:o,once:i=!1}=e,v=n.shallowRef(!1),{stop:f}=ve(t,m=>{let l=v.value,g=0;for(const D of m)D.time>=g&&(g=D.time,l=D.isIntersecting);v.value=l,i&&ae(v,()=>{f()})},{root:s,window:r,threshold:c,rootMargin:n.toValue(o)});return v}const M=ne(()=>{const t=n.ref([]),e=n.computed(()=>t.value.length>0),r={component:n.ref(null),ref:n.ref(null)},s=n.ref([]),c=n.computed(()=>s.value.map((m,l)=>{var g;if((g=m.isVisible)!=null&&g.value||m.isVisible&&l)return l}).filter(m=>m!==void 0)),o=n.ref([]),i=n.ref([]),v={zone:n.ref(null),element:n.ref(null)},f={current:n.ref(null),start:n.ref(null),offset:{percent:n.ref(null),pixel:n.ref(null)}};return{isDragging:e,activeContainer:r,elements:s,draggingElements:t,selectedElements:o,zones:i,visibleElements:c,hovered:v,pointerPosition:f}}),ge=()=>{const t=n.ref(null),{draggingElements:e,pointerPosition:r,isDragging:s,activeContainer:c}=M();return n.onMounted(()=>{c.ref=t}),n.onBeforeUnmount(()=>{c.ref.value=null}),{elementRef:t,draggingElements:e,pointerPosition:r,isDragging:s}},me=["innerHTML"],he=n.defineComponent({__name:"DefaultOverlay",setup(t){const{elementRef:e,pointerPosition:r,isDragging:s,draggingElements:c}=ge(),o=n.computed(()=>{var i,v,f,m;return{transform:`translate3d(${(((i=r.current.value)==null?void 0:i.x)??0)-(((v=r.offset.pixel.value)==null?void 0:v.x)??0)}px, ${(((f=r.current.value)==null?void 0:f.y)??0)-(((m=r.offset.pixel.value)==null?void 0:m.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(i,v)=>n.unref(s)?(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,m)=>{var l,g;return n.openBlock(),n.createElementBlock("div",{key:m,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,me)}),128))],4)):n.createCommentVNode("",!0)}}),U=n.defineComponent({__name:"DragOverlay",setup(t){const{activeContainer:e}=M(),r=n.computed(()=>e.component.value??he);return(s,c)=>(n.openBlock(),n.createBlock(n.resolveDynamicComponent(r.value)))}}),pe={install(t){t.component("DragOverlay",U);const e=t.mount;t.mount=function(s){const c=e.call(this,s),o=typeof s=="string"?document.querySelector(s):s;if(o&&o instanceof Element){const i=n.createVNode(U);t.__VUE_DND_KIT_OVERLAY__={rootElement:o,vnode:i},n.render(i,o)}return c};const r=t.unmount;t.unmount=function(){return t.__VUE_DND_KIT_OVERLAY__&&(n.render(null,t.__VUE_DND_KIT_OVERLAY__.rootElement),delete t.__VUE_DND_KIT_OVERLAY__),r.call(this)}}},ye="data-dnd-draggable",Ee=t=>{const{elements:e,draggingElements:r,hovered:s,selectedElements:c,isDragging:o}=M(),i=n.ref(null),v=n.computed(()=>{var p;return((p=s.element.value)==null?void 0:p.node)===i.value}),f=fe(i),m=n.computed(()=>r.value.some(p=>p.node===i.value)),l=n.computed(()=>{if(!i.value||!o.value)return!1;const p=e.value.find(E=>E.node===i.value);return p!=null&&p.groups.length?!r.value.some(E=>E.groups.length?!E.groups.some(u=>p.groups.includes(u)):!1):!0});return{elementRef:i,registerElement:()=>{if(!i.value)throw new Error("ElementRef is not set");e.value.push({node:i.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}),i.value.setAttribute(ye,"true")},unregisterElement:()=>{const p=e.value.findIndex(u=>u.node===i.value);p!==-1&&e.value.splice(p,1);const E=c.value.findIndex(u=>u.node===i.value);E!==-1&&c.value.splice(E,1)},isDragging:m,isOvered:v,isAllowed:l,isVisible:f}},we=()=>{let t="",e="",r="";const s=()=>{const i=document.body;t=i.style.userSelect,e=i.style.touchAction,r=i.style.overscrollBehavior,i.style.userSelect="none",i.style.touchAction="none",i.style.overscrollBehavior="none",window.addEventListener("contextmenu",o),window.addEventListener("selectstart",o),window.addEventListener("touchstart",o),window.addEventListener("touchmove",o)},c=()=>{const i=document.body;i.style.userSelect=t,i.style.touchAction=e,i.style.overscrollBehavior=r,window.removeEventListener("contextmenu",o),window.removeEventListener("selectstart",o),window.removeEventListener("touchstart",o),window.removeEventListener("touchmove",o)},o=i=>i.preventDefault();return{disableInteractions:s,enableInteractions:c}},G=(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,T=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}},H=t=>({x:t.x+t.width/2,y:t.y+t.height/2}),Pe=(t,e)=>{const r=T(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,s=e.y-t.y;return Math.sqrt(r*r+s*s)},S=(t,e)=>t?e.contains(t):!1,De=t=>{const e=M();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:i,percent:v}=Pe(t.value,{x:o.clientX,y:o.clientY});e.pointerPosition.offset.pixel.value=i,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}}},_e=t=>{const e=M(),{onPointerStart:r,onPointerMove:s,onPointerEnd:c}=De(t);let o=null;const i=u=>{var w,P;const h=e.selectedElements.value.some(_=>_.node===u);if(e.selectedElements.value.length&&h)return e.selectedElements.value.map(_=>{var L,A;return{..._,initialHTML:((L=_.node)==null?void 0:L.outerHTML)??"",initialRect:(A=_.node)==null?void 0:A.getBoundingClientRect()}});e.selectedElements.value=[];const y=e.elements.value.find(_=>_.node===u);return y?[{...y,initialHTML:((w=y.node)==null?void 0:w.outerHTML)??"",initialRect:(P=y.node)==null?void 0:P.getBoundingClientRect()}]:[]},v=(u,h)=>{const y=Math.max(0,Math.min(u.x+u.width,h.x+h.width)-Math.max(u.x,h.x)),w=Math.max(0,Math.min(u.y+u.height,h.y+h.height)-Math.max(u.y,h.y)),P=y*w,_=u.width*u.height,L=h.width*h.height;return(P/_*100+P/L*100)/2},f=ue(()=>{var Y,N,F,Z,$,K,W,X,j,q;const u=T(e.activeContainer.ref.value),h=H(u),y=((Y=e.pointerPosition.current.value)==null?void 0:Y.x)??0,w=((N=e.pointerPosition.current.value)==null?void 0:N.y)??0,_=!(u&&y>=u.x&&y<=u.x+u.width&&w>=u.y&&w<=u.y+u.height),L=e.draggingElements.value.map(a=>a.node),A=e.visibleElements.value.map(a=>e.elements.value[a]).filter(a=>{if(!a.node||L.some(x=>x&&S(a.node,x))||a.groups.length&&!!e.draggingElements.value.some(I=>I.groups.length?!I.groups.some(C=>a.groups.includes(C)):!1))return!1;const d=T(a.node);return d&&u&&G(d,u)}).map(a=>{const d=T(a.node),x=H(d),I=y>=d.x&&y<=d.x+d.width&&w>=d.y&&w<=d.y+d.height,C=v(d,u),b=J(h,x),z=e.elements.value.filter(O=>O!==a&&O.node&&a.node&&S(a.node,O.node)).length;return{element:a,isPointerInElement:I,overlapPercent:C,depth:z,centerDistance:b}}).sort((a,d)=>{if(!_){if(a.isPointerInElement&&d.isPointerInElement)return d.depth-a.depth;if(a.isPointerInElement!==d.isPointerInElement)return a.isPointerInElement?-1:1}return Math.abs(a.overlapPercent-d.overlapPercent)<=1?a.centerDistance-d.centerDistance:d.overlapPercent-a.overlapPercent}),ee=e.zones.value.filter(a=>{if(!a.node||L.some(x=>x&&S(a.node,x))||a.groups.length&&!!e.draggingElements.value.some(I=>I.groups.length?!I.groups.some(C=>a.groups.includes(C)):!1))return!1;const d=T(a.node);return d&&u&&G(d,u)}).map(a=>{const d=T(a.node),x=H(d),I=y>=d.x&&y<=d.x+d.width&&w>=d.y&&w<=d.y+d.height,C=v(d,u),b=J(h,x),z=e.zones.value.filter(O=>O!==a&&O.node&&a.node&&S(a.node,O.node)).length;return{zone:a,isPointerInElement:I,overlapPercent:C,depth:z,centerDistance:b}}).sort((a,d)=>{if(!_){if(a.isPointerInElement&&d.isPointerInElement)return d.depth-a.depth;if(a.isPointerInElement!==d.isPointerInElement)return a.isPointerInElement?-1:1}return Math.abs(a.overlapPercent-d.overlapPercent)<=1?a.centerDistance-d.centerDistance:d.overlapPercent-a.overlapPercent}),V=e.hovered.element.value,k=e.hovered.zone.value;e.hovered.element.value=((F=A[0])==null?void 0:F.element)??null,e.hovered.zone.value=((Z=ee[0])==null?void 0:Z.zone)??null,e.hovered.element.value!==V&&(($=V==null?void 0:V.events)!=null&&$.onLeave&&V.events.onLeave(e),(W=(K=e.hovered.element.value)==null?void 0:K.events)!=null&&W.onHover&&e.hovered.element.value.events.onHover(e)),e.hovered.zone.value!==k&&((X=k==null?void 0:k.events)!=null&&X.onLeave&&k.events.onLeave(e),(q=(j=e.hovered.zone.value)==null?void 0:j.events)!=null&&q.onHover&&e.hovered.zone.value.events.onHover(e))},1e3),m=()=>{f(),o=requestAnimationFrame(m)},l=()=>{m()},g=()=>{o!==null&&(cancelAnimationFrame(o),o=null)};return{activate:u=>{e.draggingElements.value=i(t.value),r(u),l()},track:u=>{s(u)},deactivate:()=>{var u,h;c(),e.hovered.zone.value?(h=(u=e.hovered.zone.value.events).onDrop)==null||h.call(u,e):e.draggingElements.value.forEach(y=>{var w,P;return(P=(w=y.events).onEnd)==null?void 0:P.call(w,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:s,isDragging:c,isOvered:o,isAllowed:i,isVisible:v}=Ee(t),{disableInteractions:f,enableInteractions:m}=we(),{activeContainer:l,pointerPosition:g}=M(),{activate:D,track:p,deactivate:E}=_e(e),u=P=>{t!=null&&t.container&&(l.component.value=n.markRaw(t.container)),f(),D(P),document.addEventListener("pointermove",h),document.addEventListener("pointerup",w),document.addEventListener("wheel",y)},h=P=>p(P),y=P=>p(P),w=()=>{l.component.value=null,m(),E(),document.removeEventListener("pointermove",h),document.removeEventListener("pointerup",w),document.removeEventListener("wheel",y)};return n.onMounted(r),n.onBeforeUnmount(s),{pointerPosition:g,elementRef:e,isDragging:c,isOvered:o,isAllowed:i,handleDragStart:u,isVisible:v}},Ie=t=>{const{zones:e,hovered:r,draggingElements:s,isDragging:c}=M(),o=n.ref(null),i=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?!s.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:i,isAllowed:v}},Me=t=>{const{elementRef:e,registerZone:r,unregisterZone:s,isOvered:c,isAllowed:o}=Ie(t);return n.onMounted(r),n.onBeforeUnmount(s),{elementRef:e,isOvered:c,isAllowed:o}},Se=t=>{const{selectedElements:e,elements:r}=M(),s=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&&S(l.node,t.value)):!1),i=n.computed(()=>t.value?e.value.some(l=>l.node&&S(t.value,l.node)):!1),v=()=>{s.value&&(e.value=e.value.filter(l=>l.node!==t.value))},f=()=>{s.value&&(o.value&&(e.value=e.value.filter(l=>l.node&&!S(l.node,t.value))),i.value&&(e.value=e.value.filter(l=>l.node&&!S(t.value,l.node))),e.value.push(s.value))};return{handleUnselect:v,handleSelect:f,handleToggleSelect:()=>{s.value&&(e.value.some(l=>l.node===t.value)?v():f())},isSelected:c,isParentOfSelected:o}};exports.DragOverlay=U;exports.default=pe;exports.getBoundingBox=T;exports.useDnDStore=M;exports.useDraggable=xe;exports.useDroppable=Me;exports.useSelection=Se;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue");function te(t){return n.getCurrentScope()?(n.onScopeDispose(t),!0):!1}function ne(t){let e=!1,r;const s=n.effectScope(!0);return(...c)=>(e||(r=s.run(()=>t(...c)),e=!0),r)}const re=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const oe=t=>t!=null,R=()=>{};function le(t,e){function r(...s){return new Promise((c,o)=>{Promise.resolve(t(()=>e.apply(this,s),{fn:e,thisArg:this,args:s})).then(c).catch(o)})}return r}function ie(...t){let e=0,r,s=!0,c=R,o,i,v,f,m;!n.isRef(t[0])&&typeof t[0]=="object"?{delay:i,trailing:v=!0,leading:f=!0,rejectOnCancel:m=!1}=t[0]:[i,v=!0,f=!0,m=!1]=t;const l=()=>{r&&(clearTimeout(r),r=void 0,c(),c=R)};return D=>{const p=n.toValue(i),E=Date.now()-e,u=()=>o=D();return l(),p<=0?(e=Date.now(),u()):(E>p&&(f||!s)?(e=Date.now(),u()):v&&(o=new Promise((h,y)=>{c=m?y:h,r=setTimeout(()=>{e=Date.now(),s=!0,h(u()),l()},Math.max(0,p-E))})),!f&&!r&&(r=setTimeout(()=>s=!0,p)),s=!1,o)}}function se(t){return Array.isArray(t)?t:[t]}function ue(t,e=200,r=!1,s=!0,c=!1){return le(ie(e,r,s,c),t)}function ae(t,e,r){const s=n.watch(t,(...c)=>(n.nextTick(()=>s()),e(...c)),r);return s}const Q=re?window:void 0;function B(t){var e;const r=n.toValue(t);return(e=r==null?void 0:r.$el)!=null?e:r}function ce(){const t=n.shallowRef(!1),e=n.getCurrentInstance();return e&&n.onMounted(()=>{t.value=!0},e),t}function de(t){const e=ce();return n.computed(()=>(e.value,!!t()))}function ve(t,e,r={}){const{root:s,rootMargin:c="0px",threshold:o=0,window:i=Q,immediate:v=!0}=r,f=de(()=>i&&"IntersectionObserver"in i),m=n.computed(()=>{const E=n.toValue(t);return se(E).map(B).filter(oe)});let l=R;const g=n.shallowRef(v),D=f.value?n.watch(()=>[m.value,B(s),g.value],([E,u])=>{if(l(),!g.value||!E.length)return;const h=new IntersectionObserver(e,{root:B(u),rootMargin:c,threshold:o});E.forEach(y=>y&&h.observe(y)),l=()=>{h.disconnect(),l=R}},{immediate:v,flush:"post"}):R,p=()=>{l(),D(),g.value=!1};return te(p),{isSupported:f,isActive:g,pause(){l(),g.value=!1},resume(){g.value=!0},stop:p}}function fe(t,e={}){const{window:r=Q,scrollTarget:s,threshold:c=0,rootMargin:o,once:i=!1}=e,v=n.shallowRef(!1),{stop:f}=ve(t,m=>{let l=v.value,g=0;for(const D of m)D.time>=g&&(g=D.time,l=D.isIntersecting);v.value=l,i&&ae(v,()=>{f()})},{root:s,window:r,threshold:c,rootMargin:n.toValue(o)});return v}const I=ne(()=>{const t=n.ref([]),e=n.computed(()=>t.value.length>0),r={component:n.ref(null),ref:n.ref(null)},s=n.ref([]),c=n.computed(()=>s.value.map((m,l)=>{var g;if((g=m.isVisible)!=null&&g.value||m.isVisible&&l)return l}).filter(m=>m!==void 0)),o=n.ref([]),i=n.ref([]),v={zone:n.ref(null),element:n.ref(null)},f={current:n.ref(null),start:n.ref(null),offset:{percent:n.ref(null),pixel:n.ref(null)}};return{isDragging:e,activeContainer:r,elements:s,draggingElements:t,selectedElements:o,zones:i,visibleElements:c,hovered:v,pointerPosition:f}}),ge=()=>{const t=n.ref(null),{draggingElements:e,pointerPosition:r,isDragging:s,activeContainer:c}=I();return n.onMounted(()=>{c.ref=t}),n.onBeforeUnmount(()=>{c.ref.value=null}),{elementRef:t,draggingElements:e,pointerPosition:r,isDragging:s}},me=["innerHTML"],he=n.defineComponent({__name:"DefaultOverlay",setup(t){const{elementRef:e,pointerPosition:r,isDragging:s,draggingElements:c}=ge(),o=n.computed(()=>{var i,v,f,m;return{transform:`translate3d(${(((i=r.current.value)==null?void 0:i.x)??0)-(((v=r.offset.pixel.value)==null?void 0:v.x)??0)}px, ${(((f=r.current.value)==null?void 0:f.y)??0)-(((m=r.offset.pixel.value)==null?void 0:m.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(i,v)=>n.unref(s)?(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,m)=>{var l,g;return n.openBlock(),n.createElementBlock("div",{key:m,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,me)}),128))],4)):n.createCommentVNode("",!0)}}),U=n.defineComponent({__name:"DragOverlay",setup(t){const{activeContainer:e}=I(),r=n.computed(()=>e.component.value??he);return(s,c)=>(n.openBlock(),n.createBlock(n.resolveDynamicComponent(r.value)))}}),pe={install(t){t.component("DragOverlay",U);const e=t.mount;t.mount=function(s){const c=e.call(this,s),o=typeof s=="string"?document.querySelector(s):s;if(o&&o instanceof Element&&!o.querySelector("#vue-dnd-kit-overlay")){const i=document.createElement("div");i.id="vue-dnd-kit-overlay",o.appendChild(i);const v=n.createVNode(U);n.render(v,i),t.__VUE_DND_KIT_OVERLAY__={container:i,vnode:v}}return c};const r=t.unmount;t.unmount=function(){return t.__VUE_DND_KIT_OVERLAY__&&(n.render(null,t.__VUE_DND_KIT_OVERLAY__.container),delete t.__VUE_DND_KIT_OVERLAY__),r.call(this)}}},ye="data-dnd-draggable",Ee=t=>{const{elements:e,draggingElements:r,hovered:s,selectedElements:c,isDragging:o}=I(),i=n.ref(null),v=n.computed(()=>{var p;return((p=s.element.value)==null?void 0:p.node)===i.value}),f=fe(i),m=n.computed(()=>r.value.some(p=>p.node===i.value)),l=n.computed(()=>{if(!i.value||!o.value)return!1;const p=e.value.find(E=>E.node===i.value);return p!=null&&p.groups.length?!r.value.some(E=>E.groups.length?!E.groups.some(u=>p.groups.includes(u)):!1):!0});return{elementRef:i,registerElement:()=>{if(!i.value)throw new Error("ElementRef is not set");e.value.push({node:i.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}),i.value.setAttribute(ye,"true")},unregisterElement:()=>{const p=e.value.findIndex(u=>u.node===i.value);p!==-1&&e.value.splice(p,1);const E=c.value.findIndex(u=>u.node===i.value);E!==-1&&c.value.splice(E,1)},isDragging:m,isOvered:v,isAllowed:l,isVisible:f}},we=()=>{let t="",e="",r="";const s=()=>{const i=document.body;t=i.style.userSelect,e=i.style.touchAction,r=i.style.overscrollBehavior,i.style.userSelect="none",i.style.touchAction="none",i.style.overscrollBehavior="none",window.addEventListener("contextmenu",o),window.addEventListener("selectstart",o),window.addEventListener("touchstart",o),window.addEventListener("touchmove",o)},c=()=>{const i=document.body;i.style.userSelect=t,i.style.touchAction=e,i.style.overscrollBehavior=r,window.removeEventListener("contextmenu",o),window.removeEventListener("selectstart",o),window.removeEventListener("touchstart",o),window.removeEventListener("touchmove",o)},o=i=>i.preventDefault();return{disableInteractions:s,enableInteractions:c}},G=(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,T=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}},H=t=>({x:t.x+t.width/2,y:t.y+t.height/2}),Pe=(t,e)=>{const r=T(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,s=e.y-t.y;return Math.sqrt(r*r+s*s)},M=(t,e)=>t?e.contains(t):!1,De=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:i,percent:v}=Pe(t.value,{x:o.clientX,y:o.clientY});e.pointerPosition.offset.pixel.value=i,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}}},_e=t=>{const e=I(),{onPointerStart:r,onPointerMove:s,onPointerEnd:c}=De(t);let o=null;const i=u=>{var w,P;const h=e.selectedElements.value.some(_=>_.node===u);if(e.selectedElements.value.length&&h)return e.selectedElements.value.map(_=>{var L,A;return{..._,initialHTML:((L=_.node)==null?void 0:L.outerHTML)??"",initialRect:(A=_.node)==null?void 0:A.getBoundingClientRect()}});e.selectedElements.value=[];const y=e.elements.value.find(_=>_.node===u);return y?[{...y,initialHTML:((w=y.node)==null?void 0:w.outerHTML)??"",initialRect:(P=y.node)==null?void 0:P.getBoundingClientRect()}]:[]},v=(u,h)=>{const y=Math.max(0,Math.min(u.x+u.width,h.x+h.width)-Math.max(u.x,h.x)),w=Math.max(0,Math.min(u.y+u.height,h.y+h.height)-Math.max(u.y,h.y)),P=y*w,_=u.width*u.height,L=h.width*h.height;return(P/_*100+P/L*100)/2},f=ue(()=>{var Y,N,F,Z,$,q,K,W,X,j;const u=T(e.activeContainer.ref.value),h=H(u),y=((Y=e.pointerPosition.current.value)==null?void 0:Y.x)??0,w=((N=e.pointerPosition.current.value)==null?void 0:N.y)??0,_=!(u&&y>=u.x&&y<=u.x+u.width&&w>=u.y&&w<=u.y+u.height),L=e.draggingElements.value.map(a=>a.node),A=e.visibleElements.value.map(a=>e.elements.value[a]).filter(a=>{if(!a.node||L.some(x=>x&&M(a.node,x))||a.groups.length&&!!e.draggingElements.value.some(S=>S.groups.length?!S.groups.some(C=>a.groups.includes(C)):!1))return!1;const d=T(a.node);return d&&u&&G(d,u)}).map(a=>{const d=T(a.node),x=H(d),S=y>=d.x&&y<=d.x+d.width&&w>=d.y&&w<=d.y+d.height,C=v(d,u),b=J(h,x),z=e.elements.value.filter(O=>O!==a&&O.node&&a.node&&M(a.node,O.node)).length;return{element:a,isPointerInElement:S,overlapPercent:C,depth:z,centerDistance:b}}).sort((a,d)=>{if(!_){if(a.isPointerInElement&&d.isPointerInElement)return d.depth-a.depth;if(a.isPointerInElement!==d.isPointerInElement)return a.isPointerInElement?-1:1}return Math.abs(a.overlapPercent-d.overlapPercent)<=1?a.centerDistance-d.centerDistance:d.overlapPercent-a.overlapPercent}),ee=e.zones.value.filter(a=>{if(!a.node||L.some(x=>x&&M(a.node,x))||a.groups.length&&!!e.draggingElements.value.some(S=>S.groups.length?!S.groups.some(C=>a.groups.includes(C)):!1))return!1;const d=T(a.node);return d&&u&&G(d,u)}).map(a=>{const d=T(a.node),x=H(d),S=y>=d.x&&y<=d.x+d.width&&w>=d.y&&w<=d.y+d.height,C=v(d,u),b=J(h,x),z=e.zones.value.filter(O=>O!==a&&O.node&&a.node&&M(a.node,O.node)).length;return{zone:a,isPointerInElement:S,overlapPercent:C,depth:z,centerDistance:b}}).sort((a,d)=>{if(!_){if(a.isPointerInElement&&d.isPointerInElement)return d.depth-a.depth;if(a.isPointerInElement!==d.isPointerInElement)return a.isPointerInElement?-1:1}return Math.abs(a.overlapPercent-d.overlapPercent)<=1?a.centerDistance-d.centerDistance:d.overlapPercent-a.overlapPercent}),k=e.hovered.element.value,V=e.hovered.zone.value;e.hovered.element.value=((F=A[0])==null?void 0:F.element)??null,e.hovered.zone.value=((Z=ee[0])==null?void 0:Z.zone)??null,e.hovered.element.value!==k&&(($=k==null?void 0:k.events)!=null&&$.onLeave&&k.events.onLeave(e),(K=(q=e.hovered.element.value)==null?void 0:q.events)!=null&&K.onHover&&e.hovered.element.value.events.onHover(e)),e.hovered.zone.value!==V&&((W=V==null?void 0:V.events)!=null&&W.onLeave&&V.events.onLeave(e),(j=(X=e.hovered.zone.value)==null?void 0:X.events)!=null&&j.onHover&&e.hovered.zone.value.events.onHover(e))},1e3),m=()=>{f(),o=requestAnimationFrame(m)},l=()=>{m()},g=()=>{o!==null&&(cancelAnimationFrame(o),o=null)};return{activate:u=>{e.draggingElements.value=i(t.value),r(u),l()},track:u=>{s(u)},deactivate:()=>{var u,h;c(),e.hovered.zone.value?(h=(u=e.hovered.zone.value.events).onDrop)==null||h.call(u,e):e.draggingElements.value.forEach(y=>{var w,P;return(P=(w=y.events).onEnd)==null?void 0:P.call(w,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:s,isDragging:c,isOvered:o,isAllowed:i,isVisible:v}=Ee(t),{disableInteractions:f,enableInteractions:m}=we(),{activeContainer:l,pointerPosition:g}=I(),{activate:D,track:p,deactivate:E}=_e(e),u=P=>{t!=null&&t.container&&(l.component.value=n.markRaw(t.container)),f(),D(P),document.addEventListener("pointermove",h),document.addEventListener("pointerup",w),document.addEventListener("wheel",y)},h=P=>p(P),y=P=>p(P),w=()=>{l.component.value=null,m(),E(),document.removeEventListener("pointermove",h),document.removeEventListener("pointerup",w),document.removeEventListener("wheel",y)};return n.onMounted(r),n.onBeforeUnmount(s),{pointerPosition:g,elementRef:e,isDragging:c,isOvered:o,isAllowed:i,handleDragStart:u,isVisible:v}},Se=t=>{const{zones:e,hovered:r,draggingElements:s,isDragging:c}=I(),o=n.ref(null),i=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?!s.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:i,isAllowed:v}},Ie=t=>{const{elementRef:e,registerZone:r,unregisterZone:s,isOvered:c,isAllowed:o}=Se(t);return n.onMounted(r),n.onBeforeUnmount(s),{elementRef:e,isOvered:c,isAllowed:o}},Me=t=>{const{selectedElements:e,elements:r}=I(),s=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&&M(l.node,t.value)):!1),i=n.computed(()=>t.value?e.value.some(l=>l.node&&M(t.value,l.node)):!1),v=()=>{s.value&&(e.value=e.value.filter(l=>l.node!==t.value))},f=()=>{s.value&&(o.value&&(e.value=e.value.filter(l=>l.node&&!M(l.node,t.value))),i.value&&(e.value=e.value.filter(l=>l.node&&!M(t.value,l.node))),e.value.push(s.value))};return{handleUnselect:v,handleSelect:f,handleToggleSelect:()=>{s.value&&(e.value.some(l=>l.node===t.value)?v():f())},isSelected:c,isParentOfSelected:o}};exports.DragOverlay=U;exports.default=pe;exports.getBoundingBox=T;exports.useDnDStore=I;exports.useDraggable=xe;exports.useDroppable=Ie;exports.useSelection=Me;
@@ -2,52 +2,52 @@ import { effectScope as fe, watch as ue, nextTick as ge, isRef as me, getCurrent
2
2
  function Le(t) {
3
3
  return he() ? (pe(t), !0) : !1;
4
4
  }
5
- function Me(t) {
5
+ function Se(t) {
6
6
  let e = !1, n;
7
- const l = fe(!0);
8
- return (...u) => (e || (n = l.run(() => t(...u)), e = !0), n);
7
+ const i = fe(!0);
8
+ return (...u) => (e || (n = i.run(() => t(...u)), e = !0), n);
9
9
  }
10
- const Se = typeof window < "u" && typeof document < "u";
10
+ const Me = typeof window < "u" && typeof document < "u";
11
11
  typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
12
12
  const Ce = (t) => t != null, A = () => {
13
13
  };
14
14
  function Oe(t, e) {
15
- function n(...l) {
15
+ function n(...i) {
16
16
  return new Promise((u, r) => {
17
- Promise.resolve(t(() => e.apply(this, l), { fn: e, thisArg: this, args: l })).then(u).catch(r);
17
+ Promise.resolve(t(() => e.apply(this, i), { fn: e, thisArg: this, args: i })).then(u).catch(r);
18
18
  });
19
19
  }
20
20
  return n;
21
21
  }
22
22
  function Te(...t) {
23
- let e = 0, n, l = !0, u = A, r, s, v, d, g;
24
- !me(t[0]) && typeof t[0] == "object" ? { delay: s, trailing: v = !0, leading: d = !0, rejectOnCancel: g = !1 } = t[0] : [s, v = !0, d = !0, g = !1] = t;
23
+ let e = 0, n, i = !0, u = A, r, l, d, v, g;
24
+ !me(t[0]) && typeof t[0] == "object" ? { delay: l, trailing: d = !0, leading: v = !0, rejectOnCancel: g = !1 } = t[0] : [l, d = !0, v = !0, g = !1] = t;
25
25
  const o = () => {
26
26
  n && (clearTimeout(n), n = void 0, u(), u = A);
27
27
  };
28
28
  return (_) => {
29
- const h = b(s), y = Date.now() - e, i = () => r = _();
30
- return o(), h <= 0 ? (e = Date.now(), i()) : (y > h && (d || !l) ? (e = Date.now(), i()) : v && (r = new Promise((m, p) => {
29
+ const h = b(l), y = Date.now() - e, s = () => r = _();
30
+ return o(), h <= 0 ? (e = Date.now(), s()) : (y > h && (v || !i) ? (e = Date.now(), s()) : d && (r = new Promise((m, p) => {
31
31
  u = g ? p : m, n = setTimeout(() => {
32
- e = Date.now(), l = !0, m(i()), o();
32
+ e = Date.now(), i = !0, m(s()), o();
33
33
  }, Math.max(0, h - y));
34
- })), !d && !n && (n = setTimeout(() => l = !0, h)), l = !1, r);
34
+ })), !v && !n && (n = setTimeout(() => i = !0, h)), i = !1, r);
35
35
  };
36
36
  }
37
37
  function Ve(t) {
38
38
  return Array.isArray(t) ? t : [t];
39
39
  }
40
- function Re(t, e = 200, n = !1, l = !0, u = !1) {
40
+ function ke(t, e = 200, n = !1, i = !0, u = !1) {
41
41
  return Oe(
42
- Te(e, n, l, u),
42
+ Te(e, n, i, u),
43
43
  t
44
44
  );
45
45
  }
46
- function ke(t, e, n) {
47
- const l = ue(t, (...u) => (ge(() => l()), e(...u)), n);
48
- return l;
46
+ function Re(t, e, n) {
47
+ const i = ue(t, (...u) => (ge(() => i()), e(...u)), n);
48
+ return i;
49
49
  }
50
- const ve = Se ? window : void 0;
50
+ const de = Me ? window : void 0;
51
51
  function Z(t) {
52
52
  var e;
53
53
  const n = b(t);
@@ -65,25 +65,25 @@ function ze(t) {
65
65
  }
66
66
  function He(t, e, n = {}) {
67
67
  const {
68
- root: l,
68
+ root: i,
69
69
  rootMargin: u = "0px",
70
70
  threshold: r = 0,
71
- window: s = ve,
72
- immediate: v = !0
73
- } = n, d = ze(() => s && "IntersectionObserver" in s), g = D(() => {
71
+ window: l = de,
72
+ immediate: d = !0
73
+ } = n, v = ze(() => l && "IntersectionObserver" in l), g = D(() => {
74
74
  const y = b(t);
75
75
  return Ve(y).map(Z).filter(Ce);
76
76
  });
77
77
  let o = A;
78
- const f = K(v), _ = d.value ? ue(
79
- () => [g.value, Z(l), f.value],
80
- ([y, i]) => {
78
+ const f = K(d), _ = v.value ? ue(
79
+ () => [g.value, Z(i), f.value],
80
+ ([y, s]) => {
81
81
  if (o(), !f.value || !y.length)
82
82
  return;
83
83
  const m = new IntersectionObserver(
84
84
  e,
85
85
  {
86
- root: Z(i),
86
+ root: Z(s),
87
87
  rootMargin: u,
88
88
  threshold: r
89
89
  }
@@ -92,12 +92,12 @@ function He(t, e, n = {}) {
92
92
  m.disconnect(), o = A;
93
93
  };
94
94
  },
95
- { immediate: v, flush: "post" }
95
+ { immediate: d, flush: "post" }
96
96
  ) : A, h = () => {
97
97
  o(), _(), f.value = !1;
98
98
  };
99
99
  return Le(h), {
100
- isSupported: d,
100
+ isSupported: v,
101
101
  isActive: f,
102
102
  pause() {
103
103
  o(), f.value = !1;
@@ -110,44 +110,44 @@ function He(t, e, n = {}) {
110
110
  }
111
111
  function be(t, e = {}) {
112
112
  const {
113
- window: n = ve,
114
- scrollTarget: l,
113
+ window: n = de,
114
+ scrollTarget: i,
115
115
  threshold: u = 0,
116
116
  rootMargin: r,
117
- once: s = !1
118
- } = e, v = K(!1), { stop: d } = He(
117
+ once: l = !1
118
+ } = e, d = K(!1), { stop: v } = He(
119
119
  t,
120
120
  (g) => {
121
- let o = v.value, f = 0;
121
+ let o = d.value, f = 0;
122
122
  for (const _ of g)
123
123
  _.time >= f && (f = _.time, o = _.isIntersecting);
124
- v.value = o, s && ke(v, () => {
125
- d();
124
+ d.value = o, l && Re(d, () => {
125
+ v();
126
126
  });
127
127
  },
128
128
  {
129
- root: l,
129
+ root: i,
130
130
  window: n,
131
131
  threshold: u,
132
132
  rootMargin: b(r)
133
133
  }
134
134
  );
135
- return v;
135
+ return d;
136
136
  }
137
- const S = Me(() => {
137
+ const M = Se(() => {
138
138
  const t = P([]), e = D(() => t.value.length > 0), n = {
139
139
  component: P(null),
140
140
  ref: P(null)
141
- }, l = P([]), u = D(
142
- () => l.value.map((g, o) => {
141
+ }, i = P([]), u = D(
142
+ () => i.value.map((g, o) => {
143
143
  var f;
144
144
  if ((f = g.isVisible) != null && f.value || g.isVisible && o)
145
145
  return o;
146
146
  }).filter((g) => g !== void 0)
147
- ), r = P([]), s = P([]), v = {
147
+ ), r = P([]), l = P([]), d = {
148
148
  zone: P(null),
149
149
  element: P(null)
150
- }, d = {
150
+ }, v = {
151
151
  current: P(null),
152
152
  start: P(null),
153
153
  offset: {
@@ -158,16 +158,16 @@ const S = Me(() => {
158
158
  return {
159
159
  isDragging: e,
160
160
  activeContainer: n,
161
- elements: l,
161
+ elements: i,
162
162
  draggingElements: t,
163
163
  selectedElements: r,
164
- zones: s,
164
+ zones: l,
165
165
  visibleElements: u,
166
- hovered: v,
167
- pointerPosition: d
166
+ hovered: d,
167
+ pointerPosition: v
168
168
  };
169
169
  }), Ue = () => {
170
- const t = P(null), { draggingElements: e, pointerPosition: n, isDragging: l, activeContainer: u } = S();
170
+ const t = P(null), { draggingElements: e, pointerPosition: n, isDragging: i, activeContainer: u } = M();
171
171
  return U(() => {
172
172
  u.ref = t;
173
173
  }), W(() => {
@@ -176,15 +176,15 @@ const S = Me(() => {
176
176
  elementRef: t,
177
177
  draggingElements: e,
178
178
  pointerPosition: n,
179
- isDragging: l
179
+ isDragging: i
180
180
  };
181
181
  }, Ye = ["innerHTML"], Ne = /* @__PURE__ */ ce({
182
182
  __name: "DefaultOverlay",
183
183
  setup(t) {
184
- const { elementRef: e, pointerPosition: n, isDragging: l, draggingElements: u } = Ue(), r = D(() => {
185
- var s, v, d, g;
184
+ const { elementRef: e, pointerPosition: n, isDragging: i, draggingElements: u } = Ue(), r = D(() => {
185
+ var l, d, v, g;
186
186
  return {
187
- transform: `translate3d(${(((s = n.current.value) == null ? void 0 : s.x) ?? 0) - (((v = n.offset.pixel.value) == null ? void 0 : v.x) ?? 0)}px, ${(((d = n.current.value) == null ? void 0 : d.y) ?? 0) - (((g = n.offset.pixel.value) == null ? void 0 : g.y) ?? 0)}px, 0)`,
187
+ transform: `translate3d(${(((l = n.current.value) == null ? void 0 : l.x) ?? 0) - (((d = n.offset.pixel.value) == null ? void 0 : d.x) ?? 0)}px, ${(((v = n.current.value) == null ? void 0 : v.y) ?? 0) - (((g = n.offset.pixel.value) == null ? void 0 : g.y) ?? 0)}px, 0)`,
188
188
  zIndex: 1e3,
189
189
  position: "fixed",
190
190
  top: 0,
@@ -192,119 +192,121 @@ const S = Me(() => {
192
192
  transition: "0.3s cubic-bezier(0.165, 0.84, 0.44, 1)"
193
193
  };
194
194
  });
195
- return (s, v) => re(l) ? (H(), F("div", {
195
+ return (l, d) => re(i) ? (H(), F("div", {
196
196
  key: 0,
197
197
  ref_key: "elementRef",
198
198
  ref: e,
199
199
  style: oe(r.value)
200
200
  }, [
201
- (H(!0), F(we, null, Pe(re(u), (d, g) => {
201
+ (H(!0), F(we, null, Pe(re(u), (v, g) => {
202
202
  var o, f;
203
203
  return H(), F("div", {
204
204
  key: g,
205
- innerHTML: d.initialHTML,
205
+ innerHTML: v.initialHTML,
206
206
  style: oe({
207
- width: `${(o = d.initialRect) == null ? void 0 : o.width}px`,
208
- height: `${(f = d.initialRect) == null ? void 0 : f.height}px`
207
+ width: `${(o = v.initialRect) == null ? void 0 : o.width}px`,
208
+ height: `${(f = v.initialRect) == null ? void 0 : f.height}px`
209
209
  })
210
210
  }, null, 12, Ye);
211
211
  }), 128))
212
212
  ], 4)) : Ee("", !0);
213
213
  }
214
- }), se = /* @__PURE__ */ ce({
214
+ }), ie = /* @__PURE__ */ ce({
215
215
  __name: "DragOverlay",
216
216
  setup(t) {
217
- const { activeContainer: e } = S(), n = D(
217
+ const { activeContainer: e } = M(), n = D(
218
218
  () => e.component.value ?? Ne
219
219
  );
220
- return (l, u) => (H(), De(_e(n.value)));
220
+ return (i, u) => (H(), De(_e(n.value)));
221
221
  }
222
222
  }), Ge = {
223
223
  install(t) {
224
- t.component("DragOverlay", se);
224
+ t.component("DragOverlay", ie);
225
225
  const e = t.mount;
226
- t.mount = function(l) {
227
- const u = e.call(this, l), r = typeof l == "string" ? document.querySelector(l) : l;
228
- if (r && r instanceof Element) {
229
- const s = xe(se);
230
- t.__VUE_DND_KIT_OVERLAY__ = {
231
- rootElement: r,
232
- vnode: s
233
- }, le(s, r);
226
+ t.mount = function(i) {
227
+ const u = e.call(this, i), r = typeof i == "string" ? document.querySelector(i) : i;
228
+ if (r && r instanceof Element && !r.querySelector("#vue-dnd-kit-overlay")) {
229
+ const l = document.createElement("div");
230
+ l.id = "vue-dnd-kit-overlay", r.appendChild(l);
231
+ const d = xe(ie);
232
+ le(d, l), t.__VUE_DND_KIT_OVERLAY__ = {
233
+ container: l,
234
+ vnode: d
235
+ };
234
236
  }
235
237
  return u;
236
238
  };
237
239
  const n = t.unmount;
238
240
  t.unmount = function() {
239
- return t.__VUE_DND_KIT_OVERLAY__ && (le(null, t.__VUE_DND_KIT_OVERLAY__.rootElement), delete t.__VUE_DND_KIT_OVERLAY__), n.call(this);
241
+ return t.__VUE_DND_KIT_OVERLAY__ && (le(null, t.__VUE_DND_KIT_OVERLAY__.container), delete t.__VUE_DND_KIT_OVERLAY__), n.call(this);
240
242
  };
241
243
  }
242
244
  }, Fe = "data-dnd-draggable", Ze = (t) => {
243
245
  const {
244
246
  elements: e,
245
247
  draggingElements: n,
246
- hovered: l,
248
+ hovered: i,
247
249
  selectedElements: u,
248
250
  isDragging: r
249
- } = S(), s = P(null), v = D(
251
+ } = M(), l = P(null), d = D(
250
252
  () => {
251
253
  var h;
252
- return ((h = l.element.value) == null ? void 0 : h.node) === s.value;
254
+ return ((h = i.element.value) == null ? void 0 : h.node) === l.value;
253
255
  }
254
- ), d = be(s), g = D(
255
- () => n.value.some((h) => h.node === s.value)
256
+ ), v = be(l), g = D(
257
+ () => n.value.some((h) => h.node === l.value)
256
258
  ), o = D(() => {
257
- if (!s.value || !r.value) return !1;
259
+ if (!l.value || !r.value) return !1;
258
260
  const h = e.value.find(
259
- (y) => y.node === s.value
261
+ (y) => y.node === l.value
260
262
  );
261
263
  return h != null && h.groups.length ? !n.value.some((y) => y.groups.length ? !y.groups.some(
262
- (i) => h.groups.includes(i)
264
+ (s) => h.groups.includes(s)
263
265
  ) : !1) : !0;
264
266
  });
265
267
  return {
266
- elementRef: s,
268
+ elementRef: l,
267
269
  registerElement: () => {
268
- if (!s.value) throw new Error("ElementRef is not set");
270
+ if (!l.value) throw new Error("ElementRef is not set");
269
271
  e.value.push({
270
- node: s.value,
272
+ node: l.value,
271
273
  groups: (t == null ? void 0 : t.groups) ?? [],
272
274
  layer: (t == null ? void 0 : t.layer) ?? null,
273
275
  defaultLayer: (t == null ? void 0 : t.layer) ?? null,
274
276
  events: (t == null ? void 0 : t.events) ?? {},
275
277
  data: (t == null ? void 0 : t.data) ?? void 0,
276
- isVisible: d
277
- }), s.value.setAttribute(Fe, "true");
278
+ isVisible: v
279
+ }), l.value.setAttribute(Fe, "true");
278
280
  },
279
281
  unregisterElement: () => {
280
282
  const h = e.value.findIndex(
281
- (i) => i.node === s.value
283
+ (s) => s.node === l.value
282
284
  );
283
285
  h !== -1 && e.value.splice(h, 1);
284
286
  const y = u.value.findIndex(
285
- (i) => i.node === s.value
287
+ (s) => s.node === l.value
286
288
  );
287
289
  y !== -1 && u.value.splice(y, 1);
288
290
  },
289
291
  isDragging: g,
290
- isOvered: v,
292
+ isOvered: d,
291
293
  isAllowed: o,
292
- isVisible: d
294
+ isVisible: v
293
295
  };
294
296
  }, $e = () => {
295
297
  let t = "", e = "", n = "";
296
- const l = () => {
297
- const s = document.body;
298
- t = s.style.userSelect, e = s.style.touchAction, n = 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);
298
+ const i = () => {
299
+ const l = document.body;
300
+ 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);
299
301
  }, u = () => {
300
- const s = document.body;
301
- s.style.userSelect = t, s.style.touchAction = e, s.style.overscrollBehavior = n, window.removeEventListener("contextmenu", r), window.removeEventListener("selectstart", r), window.removeEventListener("touchstart", r), window.removeEventListener("touchmove", r);
302
- }, r = (s) => s.preventDefault();
302
+ const l = document.body;
303
+ 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);
304
+ }, r = (l) => l.preventDefault();
303
305
  return {
304
- disableInteractions: l,
306
+ disableInteractions: i,
305
307
  enableInteractions: u
306
308
  };
307
- }, ie = (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, V = (t) => {
309
+ }, se = (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, V = (t) => {
308
310
  if (!t)
309
311
  return {
310
312
  x: 0,
@@ -343,21 +345,21 @@ const S = Me(() => {
343
345
  }
344
346
  };
345
347
  }, ae = (t, e) => {
346
- const n = e.x - t.x, l = e.y - t.y;
347
- return Math.sqrt(n * n + l * l);
348
- }, M = (t, e) => t ? e.contains(t) : !1, We = (t) => {
349
- const e = S();
348
+ const n = e.x - t.x, i = e.y - t.y;
349
+ return Math.sqrt(n * n + i * i);
350
+ }, S = (t, e) => t ? e.contains(t) : !1, We = (t) => {
351
+ const e = M();
350
352
  return {
351
353
  onPointerStart: (r) => {
352
354
  e.pointerPosition.start.value = { x: r.clientX, y: r.clientY }, e.pointerPosition.current.value = {
353
355
  x: r.clientX,
354
356
  y: r.clientY
355
357
  };
356
- const { pixel: s, percent: v } = Ke(t.value, {
358
+ const { pixel: l, percent: d } = Ke(t.value, {
357
359
  x: r.clientX,
358
360
  y: r.clientY
359
361
  });
360
- e.pointerPosition.offset.pixel.value = s, e.pointerPosition.offset.percent.value = v;
362
+ e.pointerPosition.offset.pixel.value = l, e.pointerPosition.offset.percent.value = d;
361
363
  },
362
364
  onPointerMove: (r) => {
363
365
  e.pointerPosition.current.value = {
@@ -370,12 +372,12 @@ const S = Me(() => {
370
372
  }
371
373
  };
372
374
  }, Xe = (t) => {
373
- const e = S(), { onPointerStart: n, onPointerMove: l, onPointerEnd: u } = We(t);
375
+ const e = M(), { onPointerStart: n, onPointerMove: i, onPointerEnd: u } = We(t);
374
376
  let r = null;
375
- const s = (i) => {
377
+ const l = (s) => {
376
378
  var E, w;
377
379
  const m = e.selectedElements.value.some(
378
- (x) => x.node === i
380
+ (x) => x.node === s
379
381
  );
380
382
  if (e.selectedElements.value.length && m)
381
383
  return e.selectedElements.value.map((x) => {
@@ -388,7 +390,7 @@ const S = Me(() => {
388
390
  });
389
391
  e.selectedElements.value = [];
390
392
  const p = e.elements.value.find(
391
- (x) => x.node === i
393
+ (x) => x.node === s
392
394
  );
393
395
  return p ? [
394
396
  {
@@ -397,20 +399,20 @@ const S = Me(() => {
397
399
  initialRect: (w = p.node) == null ? void 0 : w.getBoundingClientRect()
398
400
  }
399
401
  ] : [];
400
- }, v = (i, m) => {
402
+ }, d = (s, m) => {
401
403
  const p = Math.max(
402
404
  0,
403
- Math.min(i.x + i.width, m.x + m.width) - Math.max(i.x, m.x)
405
+ Math.min(s.x + s.width, m.x + m.width) - Math.max(s.x, m.x)
404
406
  ), E = Math.max(
405
407
  0,
406
- Math.min(i.y + i.height, m.y + m.height) - Math.max(i.y, m.y)
407
- ), w = p * E, x = i.width * i.height, C = m.width * m.height;
408
+ Math.min(s.y + s.height, m.y + m.height) - Math.max(s.y, m.y)
409
+ ), w = p * E, x = s.width * s.height, C = m.width * m.height;
408
410
  return (w / x * 100 + w / C * 100) / 2;
409
- }, d = Re(() => {
410
- var X, j, q, G, B, J, Q, ee, te, ne;
411
- const i = V(e.activeContainer.ref.value), m = $(i), p = ((X = e.pointerPosition.current.value) == null ? void 0 : X.x) ?? 0, E = ((j = e.pointerPosition.current.value) == null ? void 0 : j.y) ?? 0, x = !(i && p >= i.x && p <= i.x + i.width && E >= i.y && E <= i.y + i.height), C = e.draggingElements.value.map((a) => a.node), z = e.visibleElements.value.map((a) => e.elements.value[a]).filter((a) => {
411
+ }, v = ke(() => {
412
+ var X, q, j, G, B, J, Q, ee, te, ne;
413
+ const s = V(e.activeContainer.ref.value), m = $(s), p = ((X = e.pointerPosition.current.value) == null ? void 0 : X.x) ?? 0, E = ((q = e.pointerPosition.current.value) == null ? void 0 : q.y) ?? 0, x = !(s && p >= s.x && p <= s.x + s.width && E >= s.y && E <= s.y + s.height), C = e.draggingElements.value.map((a) => a.node), z = e.visibleElements.value.map((a) => e.elements.value[a]).filter((a) => {
412
414
  if (!a.node || C.some(
413
- (I) => I && M(a.node, I)
415
+ (I) => I && S(a.node, I)
414
416
  ) || a.groups.length && !!e.draggingElements.value.some(
415
417
  (L) => L.groups.length ? !L.groups.some(
416
418
  (O) => a.groups.includes(O)
@@ -418,10 +420,10 @@ const S = Me(() => {
418
420
  ))
419
421
  return !1;
420
422
  const c = V(a.node);
421
- return c && i && ie(c, i);
423
+ return c && s && se(c, s);
422
424
  }).map((a) => {
423
- const c = V(a.node), I = $(c), L = p >= c.x && p <= c.x + c.width && E >= c.y && E <= c.y + c.height, O = v(c, i), Y = ae(m, I), N = e.elements.value.filter(
424
- (T) => T !== a && T.node && a.node && M(
425
+ const c = V(a.node), I = $(c), L = p >= c.x && p <= c.x + c.width && E >= c.y && E <= c.y + c.height, O = d(c, s), Y = ae(m, I), N = e.elements.value.filter(
426
+ (T) => T !== a && T.node && a.node && S(
425
427
  a.node,
426
428
  T.node
427
429
  )
@@ -439,16 +441,16 @@ const S = Me(() => {
439
441
  if (a.isPointerInElement !== c.isPointerInElement) return a.isPointerInElement ? -1 : 1;
440
442
  }
441
443
  return Math.abs(a.overlapPercent - c.overlapPercent) <= 1 ? a.centerDistance - c.centerDistance : c.overlapPercent - a.overlapPercent;
442
- }), de = e.zones.value.filter((a) => {
444
+ }), ve = e.zones.value.filter((a) => {
443
445
  if (!a.node || C.some(
444
- (I) => I && M(a.node, I)
446
+ (I) => I && S(a.node, I)
445
447
  ) || a.groups.length && !!e.draggingElements.value.some((L) => L.groups.length ? !L.groups.some((O) => a.groups.includes(O)) : !1))
446
448
  return !1;
447
449
  const c = V(a.node);
448
- return c && i && ie(c, i);
450
+ return c && s && se(c, s);
449
451
  }).map((a) => {
450
- const c = V(a.node), I = $(c), L = p >= c.x && p <= c.x + c.width && E >= c.y && E <= c.y + c.height, O = v(c, i), Y = ae(m, I), N = e.zones.value.filter(
451
- (T) => T !== a && T.node && a.node && M(a.node, T.node)
452
+ const c = V(a.node), I = $(c), L = p >= c.x && p <= c.x + c.width && E >= c.y && E <= c.y + c.height, O = d(c, s), Y = ae(m, I), N = e.zones.value.filter(
453
+ (T) => T !== a && T.node && a.node && S(a.node, T.node)
452
454
  ).length;
453
455
  return {
454
456
  zone: a,
@@ -463,25 +465,25 @@ const S = Me(() => {
463
465
  if (a.isPointerInElement !== c.isPointerInElement) return a.isPointerInElement ? -1 : 1;
464
466
  }
465
467
  return Math.abs(a.overlapPercent - c.overlapPercent) <= 1 ? a.centerDistance - c.centerDistance : c.overlapPercent - a.overlapPercent;
466
- }), R = e.hovered.element.value, k = e.hovered.zone.value;
467
- e.hovered.element.value = ((q = z[0]) == null ? void 0 : q.element) ?? null, e.hovered.zone.value = ((G = de[0]) == null ? void 0 : G.zone) ?? null, e.hovered.element.value !== R && ((B = R == null ? void 0 : R.events) != null && B.onLeave && R.events.onLeave(e), (Q = (J = e.hovered.element.value) == null ? void 0 : J.events) != null && Q.onHover && e.hovered.element.value.events.onHover(e)), e.hovered.zone.value !== k && ((ee = k == null ? void 0 : k.events) != null && ee.onLeave && k.events.onLeave(e), (ne = (te = e.hovered.zone.value) == null ? void 0 : te.events) != null && ne.onHover && e.hovered.zone.value.events.onHover(e));
468
+ }), k = e.hovered.element.value, R = e.hovered.zone.value;
469
+ e.hovered.element.value = ((j = z[0]) == null ? void 0 : j.element) ?? null, e.hovered.zone.value = ((G = ve[0]) == null ? void 0 : G.zone) ?? null, e.hovered.element.value !== k && ((B = k == null ? void 0 : k.events) != null && B.onLeave && k.events.onLeave(e), (Q = (J = e.hovered.element.value) == null ? void 0 : J.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));
468
470
  }, 1e3), g = () => {
469
- d(), r = requestAnimationFrame(g);
471
+ v(), r = requestAnimationFrame(g);
470
472
  }, o = () => {
471
473
  g();
472
474
  }, f = () => {
473
475
  r !== null && (cancelAnimationFrame(r), r = null);
474
476
  };
475
477
  return {
476
- activate: (i) => {
477
- e.draggingElements.value = s(t.value), n(i), o();
478
+ activate: (s) => {
479
+ e.draggingElements.value = l(t.value), n(s), o();
478
480
  },
479
- track: (i) => {
480
- l(i);
481
+ track: (s) => {
482
+ i(s);
481
483
  },
482
484
  deactivate: () => {
483
- var i, m;
484
- u(), e.hovered.zone.value ? (m = (i = e.hovered.zone.value.events).onDrop) == null || m.call(i, e) : e.draggingElements.value.forEach(
485
+ var s, m;
486
+ u(), e.hovered.zone.value ? (m = (s = e.hovered.zone.value.events).onDrop) == null || m.call(s, e) : e.draggingElements.value.forEach(
485
487
  (p) => {
486
488
  var E, w;
487
489
  return (w = (E = p.events).onEnd) == null ? void 0 : w.call(E, e);
@@ -493,35 +495,35 @@ const S = Me(() => {
493
495
  const {
494
496
  elementRef: e,
495
497
  registerElement: n,
496
- unregisterElement: l,
498
+ unregisterElement: i,
497
499
  isDragging: u,
498
500
  isOvered: r,
499
- isAllowed: s,
500
- isVisible: v
501
- } = Ze(t), { disableInteractions: d, enableInteractions: g } = $e(), { activeContainer: o, pointerPosition: f } = S(), { activate: _, track: h, deactivate: y } = Xe(e), i = (w) => {
502
- t != null && t.container && (o.component.value = Ie(t.container)), d(), _(w), document.addEventListener("pointermove", m), document.addEventListener("pointerup", E), document.addEventListener("wheel", p);
501
+ isAllowed: l,
502
+ isVisible: d
503
+ } = Ze(t), { disableInteractions: v, enableInteractions: g } = $e(), { activeContainer: o, pointerPosition: f } = M(), { activate: _, track: h, deactivate: y } = Xe(e), s = (w) => {
504
+ t != null && t.container && (o.component.value = Ie(t.container)), v(), _(w), document.addEventListener("pointermove", m), document.addEventListener("pointerup", E), document.addEventListener("wheel", p);
503
505
  }, m = (w) => h(w), p = (w) => h(w), E = () => {
504
506
  o.component.value = null, g(), y(), document.removeEventListener("pointermove", m), document.removeEventListener("pointerup", E), document.removeEventListener("wheel", p);
505
507
  };
506
- return U(n), W(l), {
508
+ return U(n), W(i), {
507
509
  pointerPosition: f,
508
510
  elementRef: e,
509
511
  isDragging: u,
510
512
  isOvered: r,
511
- isAllowed: s,
512
- handleDragStart: i,
513
- isVisible: v
513
+ isAllowed: l,
514
+ handleDragStart: s,
515
+ isVisible: d
514
516
  };
515
- }, je = (t) => {
516
- const { zones: e, hovered: n, draggingElements: l, isDragging: u } = S(), r = P(null), s = D(() => {
517
+ }, qe = (t) => {
518
+ const { zones: e, hovered: n, draggingElements: i, isDragging: u } = M(), r = P(null), l = D(() => {
517
519
  var o;
518
520
  return ((o = n.zone.value) == null ? void 0 : o.node) === r.value;
519
- }), v = D(() => {
521
+ }), d = D(() => {
520
522
  if (!r.value || !u.value) return !1;
521
523
  const o = e.value.find(
522
524
  (f) => f.node === r.value
523
525
  );
524
- return o != null && o.groups.length ? !l.value.some((f) => f.groups.length ? !f.groups.some(
526
+ return o != null && o.groups.length ? !i.value.some((f) => f.groups.length ? !f.groups.some(
525
527
  (_) => o.groups.includes(_)
526
528
  ) : !1) : !0;
527
529
  });
@@ -539,57 +541,57 @@ const S = Me(() => {
539
541
  (f) => f.node === r.value
540
542
  );
541
543
  o !== -1 && e.value.splice(o, 1);
542
- }, isOvered: s, isAllowed: v };
544
+ }, isOvered: l, isAllowed: d };
543
545
  }, Je = (t) => {
544
- const { elementRef: e, registerZone: n, unregisterZone: l, isOvered: u, isAllowed: r } = je(t);
545
- return U(n), W(l), { elementRef: e, isOvered: u, isAllowed: r };
546
+ const { elementRef: e, registerZone: n, unregisterZone: i, isOvered: u, isAllowed: r } = qe(t);
547
+ return U(n), W(i), { elementRef: e, isOvered: u, isAllowed: r };
546
548
  }, Qe = (t) => {
547
- const { selectedElements: e, elements: n } = S(), l = D(
549
+ const { selectedElements: e, elements: n } = M(), i = D(
548
550
  () => n.value.find((o) => o.node === t.value)
549
551
  ), u = D(
550
552
  () => e.value.some((o) => o.node === t.value)
551
553
  ), r = D(() => t.value ? e.value.some(
552
- (o) => o.node && M(
554
+ (o) => o.node && S(
553
555
  o.node,
554
556
  t.value
555
557
  )
556
- ) : !1), s = D(() => t.value ? e.value.some(
557
- (o) => o.node && M(
558
+ ) : !1), l = D(() => t.value ? e.value.some(
559
+ (o) => o.node && S(
558
560
  t.value,
559
561
  o.node
560
562
  )
561
- ) : !1), v = () => {
562
- l.value && (e.value = e.value.filter(
563
+ ) : !1), d = () => {
564
+ i.value && (e.value = e.value.filter(
563
565
  (o) => o.node !== t.value
564
566
  ));
565
- }, d = () => {
566
- l.value && (r.value && (e.value = e.value.filter(
567
- (o) => o.node && !M(
567
+ }, v = () => {
568
+ i.value && (r.value && (e.value = e.value.filter(
569
+ (o) => o.node && !S(
568
570
  o.node,
569
571
  t.value
570
572
  )
571
- )), s.value && (e.value = e.value.filter(
572
- (o) => o.node && !M(
573
+ )), l.value && (e.value = e.value.filter(
574
+ (o) => o.node && !S(
573
575
  t.value,
574
576
  o.node
575
577
  )
576
- )), e.value.push(l.value));
578
+ )), e.value.push(i.value));
577
579
  };
578
580
  return {
579
- handleUnselect: v,
580
- handleSelect: d,
581
+ handleUnselect: d,
582
+ handleSelect: v,
581
583
  handleToggleSelect: () => {
582
- l.value && (e.value.some((o) => o.node === t.value) ? v() : d());
584
+ i.value && (e.value.some((o) => o.node === t.value) ? d() : v());
583
585
  },
584
586
  isSelected: u,
585
587
  isParentOfSelected: r
586
588
  };
587
589
  };
588
590
  export {
589
- se as DragOverlay,
591
+ ie as DragOverlay,
590
592
  Ge as default,
591
593
  V as getBoundingBox,
592
- S as useDnDStore,
594
+ M as useDnDStore,
593
595
  Be as useDraggable,
594
596
  Je as useDroppable,
595
597
  Qe as useSelection
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vue-dnd-kit/core",
3
- "version": "0.0.48-beta",
3
+ "version": "0.0.49-beta",
4
4
  "description": "Core functionality for Vue DnD Kit - a lightweight Vue 3 library for building performant and accessible drag and drop interfaces",
5
5
  "author": "ZiZIGY",
6
6
  "license": "MIT",