vue-fluid-dnd/dist/vue-fluid-dnd.umd.cjs

A Vue 3 drag and drop library to sort all kind of lists

(function($,F){typeof exports=="object"&&typeof module<"u"?F(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],F):($=typeof globalThis<"u"?globalThis:$||self,F($.VueFluidDnd={},$.Vue))})(this,function($,F){"use strict";var Pn=Object.defineProperty;var Nn=($,F,P)=>F in $?Pn($,F,{enumerable:!0,configurable:!0,writable:!0,value:P}):$[F]=P;var X=($,F,P)=>Nn($,typeof F!="symbol"?F+"":F,P);const P="draggable",Gt="droppable",wt="handler-class",Vt="dragging",It="dragging-handler-class",Wt="dropping",Qt="grabbing",Xt="grab",Ut="disable-transition",st=(e,t)=>e.classList.contains(t),ft=(e,t,n=!1)=>{e.classList.toggle(t,n)},Q=(e,t)=>{e.classList.add(t)},Dt=(e,t)=>{e.classList.remove(t)},Se=(e,t)=>bt(t).every(n=>st(e,n)),dt=e=>e?`.${bt(e).join(".")}`:"",ve=(e,t)=>{if(!t)return;const n=bt(t);e.classList.add(...n)},bt=e=>e?e.split(" ").filter(t=>t):[];class De{constructor(){X(this,"handlers");this.handlers=[]}addSubscriber(t){this.handlers.includes(t)||(this.handlers.push(t),Q(t,Xt))}toggleGrabClass(t){for(const n of this.handlers)ft(n,Xt,t)}}const be=(e,t)=>{const n=e.value;if(n.length<=0)return;const[s]=n.splice(t,1);return s},Te=(e,t,n)=>{e.value.splice(t,0,n)},Ee=e=>e.value.length,ye=(e,t)=>e.value[t],Y="horizontal",U="vertical",Ce=()=>{const{scrollX:e,scrollY:t}=window;return{scrollX:e,scrollY:t}},Yt=e=>!e||e.trim().length==0||e=="normal"?0:parseFloat(e),Ae=e=>e?parseInt(e):-1,xe=e=>{const t=getComputedStyle(e),n=new DOMMatrixReadOnly(t.transform);return{x:n.m41,y:n.m42}},te=(e,t)=>e.x1>t.x1?te(t,e):e.x2<t.x1?0:e.x2>=t.x2?e.x2-e.x1:e.x2-t.x1,gt=(e,t)=>!we(e,t),we=(e,t)=>{const n=Bt(e),s=Bt(t),o=ee(n,s,U),r=ee(n,s,Y);return o>=Math.min(n.height,s.height)/2&&r>=Math.min(n.width,s.width)/2},ee=(e,t,n)=>{const{before:s,distance:o}=w(n);return te({x1:e[s],x2:e[s]+e[o]},{x1:t[s],x2:t[s]+t[o]})},B=(e,t)=>e?Yt(getComputedStyle(e)[t]):0,ne=e=>{const{scrollLeft:t,scrollTop:n}=e;return{scrollLeft:t,scrollTop:n}},Bt=e=>e.getBoundingClientRect(),w=e=>{const t=e==Y;return{beforeMargin:t?"marginLeft":"marginTop",afterMargin:t?"marginRight":"marginBottom",borderBeforeWidth:t?"borderLeftWidth":"borderTopWidth",before:t?"left":"top",after:t?"right":"down",gap:t?"columnGap":"rowGap",distance:t?"width":"height",axis:t?"x":"y",offset:t?"offsetX":"offsetY",scroll:t?"scrollX":"scrollY",scrollElement:t?"scrollLeft":"scrollTop",page:t?"pageX":"pageY",inner:t?"innerWidth":"innerHeight",offsetElement:t?"offsetLeft":"offsetTop",scrollDistance:t?"scrollWidth":"scrollHeight",clientDistance:t?"clientWidth":"clientHeight",paddingBefore:t?"paddingLeft":"paddingTop",getRect:Bt}},Lt=(e,t)=>Be(e,t),se=e=>[...e.children].filter(n=>st(n,P)),Be=(e,t)=>{const n=[...t.children].filter(o=>st(o,P)&&!o.isEqualNode(e)).toReversed(),s=[...t.children].findLastIndex(o=>o.isEqualNode(e));return[n,s,t]},Le=e=>{let t=e.parentElement;for(;t;){if(window.getComputedStyle(t).position==="fixed")return t;t=t.parentElement}return null},oe=(e,t)=>{const{before:n,borderBeforeWidth:s}=w(t),o=Le(e);return o?Bt(o)[n]+B(o,s):0},Ht=e=>window.TouchEvent&&e instanceof TouchEvent,lt=e=>e instanceof HTMLElement,re=e=>e instanceof MouseEvent,Re=["onmouseup","onmousedown","onmousemove"],Oe=(e,t,n)=>{e&&(e.style.height=`${t}px`,e.style.width=`${n}px`)},Tt=(e,t,n)=>{!e||!lt(e)||(n==0&&t==0?e.style.transform="":e.style.transform=`translate(${n}px,${t}px)`)},Me=(e,t,n)=>{e[t]=s=>{if(s.defaultPrevented)return;const o=qt(s);n(o)}},_t=(e,t,n)=>{n&&(Pe(t)?e[t]=n:Me(e,t,n))},Pe=e=>Re.includes(e),Ne=e=>{const{target:t}=e;return{clientX:0,clientY:0,pageX:0,pageY:0,screenX:0,screenY:0,target:t,offsetX:0,offsetY:0}},Fe=(e,t)=>{const n=(s,o)=>Ge(t,window,o,s);if(re(e)){const{offsetX:s,offsetY:o}=e;return[s,o]}else{const s=e.target;return[n(s,Y),n(s,U)]}},qt=e=>{const t=$e(e);if(!t)return Ne(e);const[n,s]=Fe(e,t),{clientX:o,clientY:r,pageX:a,pageY:l,screenX:u,screenY:p,target:h}=t;return{clientX:o,clientY:r,pageX:a,pageY:l,screenX:u,screenY:p,target:h,offsetX:n,offsetY:s}},$e=e=>{if(Ht(e))return e.touches[0]??e.changedTouches[0];if(re(e))return e},Ge=(e,t,n,s)=>{const{page:o,scroll:r,before:a,borderBeforeWidth:l,getRect:u}=w(n),p=u(s);return e[o]-t[r]-p[a]-B(s,l)},Rt=(e,t,n="ease-out",s="transform")=>{lt(e)&&(e.style.transitionDuration=`${t}ms`,e.style.transitionTimingFunction=`${n}`,e.style.transitionProperty=`${s}`)},ie=(e,t,n)=>{!e||!lt(e)||(e[t]=()=>{n()})},Ve=e=>{var t=e.querySelector("style");if(!t){var n=document.createElement("style");return e.appendChild(n),n}return t},Ie=(e,t)=>{const n=/\.-?[_a-zA-Z0-9-*\s<>():]+/g,[s]=t.match(n)||[];for(const o of e.cssRules){const[r]=o.cssText.match(n)||[];if(s===r)return!0}return!1},We=(e,t)=>{t.forEach(n=>{Xe(e,n)})},Xe=(e,t)=>{var s;var n=Ve(e);n.sheet&&(Ie(n.sheet,t)||(s=n.sheet)==null||s.insertRule(t,n.sheet.cssRules.length))},ce=(e,t={})=>{for(const n of Object.keys(t)){const s=t[n];s!=null&&Ye(e,`--${n}`,s)}},Ye=(e,t,n)=>e&&e.style.setProperty(t,n),ae="startDrag",Ot="drag",zt="startDrop",He="drop",pt="temp-child",le="cubic-bezier(0.2, 0, 0, 1)",_e=e=>e===He||e===zt,jt=e=>!e||e.length==0?0:Yt(e.replace("px","")),qe=(e,t)=>{const n=getComputedStyle(e)[t];if(n.match("%")){const o=Yt(n.replace("%","")),{width:r}=e.getBoundingClientRect();return r*(o/100)}return jt(n)},kt=(e,t)=>{if(!(e instanceof Element))return[0,!1];const n=qe(e,t),s=getComputedStyle(e).display,o=n>0||s==="flex";return[n,o]},ze=e=>{const{top:t,left:n}=getComputedStyle(e);return[jt(t),jt(n)]},je=(e,t)=>{const{gap:n}=w(t),[s,o]=kt(e,n);return o?s:0};function Et(e,t,n,s,o=e.previousElementSibling,r=e.nextElementSibling){let{height:a,width:l}=ke(n,e,o,r);return gt(e,s)&&t==Ot&&(a=0,l=0),{height:a,width:l}}const ke=(e,t,n,s)=>{const{afterMargin:o,beforeMargin:r,distance:a,gap:l,getRect:u}=w(e),p=B(t,o),h=B(t,r),D=B(s,r),[R,m]=kt(t.parentElement,l),L=u(t)[a];if(m)return ue(L,h,p,R,0,e);const[y,v,O]=Ze(n,D,p,h,o);return ue(L,v,y,0,O,e)},Ze=(e,t,n,s,o)=>{const r=Math.max(t,n);let a=s,l=t;if(e){const u=B(e,o);a=Math.max(u,s),l=Math.max(l,u)}return[r,a,l]},ue=(e,t,n,s,o,r)=>Je(r,e+t+n+s-o),Je=(e,t)=>e==Y?{width:t,height:0}:{width:0,height:t},fe=(e,t)=>{const{borderBeforeWidth:n,paddingBefore:s,axis:o,getRect:r}=w(e),a=B(t,n),l=B(t,s),u=r(t)[o];return a+l+u},Ke=(e,t)=>{const[n,s]=ze(t),o=fe(U,e);return[fe(Y,e)-s,o-n]};function Qe(e,t,n,s,o,r,a,l,u){let p=0,h=0;const D=!!(n<0&&u);if(n===s&&!D)return de({height:p,width:h},e,o,a,D);const[R,m,L,y]=en(t,n,s,u);if(D){const[ot,ct]=Ke(l,u);p+=ct,h+=ot}const{scrollElement:v,beforeMargin:O,afterMargin:G,distance:H,gap:_}=w(e),[q,V]=kt(l,_),[it,k,N]=sn(O,G,R,m==null?void 0:m.previousElementSibling,y,V,D),[et,Z,J]=nn(O,G,H,L,q,V),z=tn(Z,et,J,k,it,q),K=D?l[v]:Ue(v,l,r),I=(y?z-N:N-z)-K;return e===U?p+=I:e===Y&&(h+=I),de({height:p,width:h},e,o,a,D)}const Ue=(e,t,n)=>{const s=t[e],o=n[e];return s-o},tn=(e,t,n,s,o,r)=>{const a=Math.max(t,o);return Math.max(n,s)+e+a+r},en=(e,t,n,s)=>{const o=t<n,[r,a]=[t,n].toSorted((h,D)=>h-D),l=e[t]??s,u=e[n];let p=o?e.slice(r+1,a+1):e.slice(r,a);return r<0&&s&&(p=e.slice(r+1,a)),[l,u,p,o]},nn=(e,t,n,s,o,r)=>{if(s.length==0)return[0,0,0];const a=B(s[0],e);let l=0,u=-a;for(const[p,h]of s.entries()){const D=h.getBoundingClientRect()[n],R=B(h,e);r&&(l+=R),r&&p>0?l+=o:l=Math.max(l,R),u+=l+D,l=B(h,t)}return[a,u,l]},de=(e,t,n,s,o)=>{const{scroll:r,distance:a}=w(t),l=window[r],u=n[r],p=o?0:u-2*l+s[r];return e[a]+=p,e},sn=(e,t,n,s,o,r,a)=>{const l=o?n.previousElementSibling:s;return on(e,t,l,n,r,a)},on=(e,t,n,s,o,r)=>{if(o)return[0,0,0];const a=B(r?null:n,t),l=B(s,e);let u=Math.max(a,l);return[a,l,u]},Zt=(e,t,n)=>{const s=new MutationObserver(o=>{o.forEach(r=>{e(s,r)})});return s.observe(t,n),s},rn=(e,t,n)=>{n!=0&&(t==="vertical"?e.scrollBy(0,n):e.scrollBy(n,0))},cn=(e,t,n)=>{const{scrollDistance:s,clientDistance:o,scrollElement:r}=w(e);return n[r]/(t[s]-t[o])},an="startDrag",ge="cubic-bezier(0.2, 0, 0, 1)",ln=(e,t,n)=>{let s=Et(t,an,n,e);const o=je(e,n),{distance:r}=w(n);s[r]-=o;const[a,l]=un(n,t);return s[l]=a,s},un=(e,t)=>{const n=e==Y?U:Y,{distance:s,getRect:o}=w(n);return[o(t)[s],s]},ht=(e,t,n)=>{Oe(e,t,n),e.style.minWidth=`${n}px`},fn=(e,t,n)=>s=>{t.contains(e)&&(ht(e,n.height,n.width),s.disconnect())},dn=(e,t)=>{if(!t)return;const{droppable:n,config:s,scroll:o}=e,{direction:r}=s,a=cn(s.direction,n,o)>.99,{scrollDistance:l,clientDistance:u,scrollElement:p}=w(r);a&&(n[p]=n[l]-n[u])},pe=(e,t,n,s)=>{if(!n)return;const{droppable:o,config:r}=n,{direction:a,animationDuration:l}=r;if(dn(n,t),o.querySelector(`.${pt}`)||!e)return;var u=e.tagName=="LI"?"DIV":e.tagName,p=document.createElement(u);Q(p,pt),ht(p,0,0);const h=ln(o,e,a);return Rt(p,l,ge,"width, min-width, height"),[p,h,o]},Jt=(e,t,n,s,o)=>{const r=pe(e,n,s);if(!r)return;const[a,l,u]=r;t.isSameNode(u)&&ht(a,l.height,l.width),Zt(fn(a,u,l),u,{childList:!0,subtree:!0}),u.appendChild(a)},gn=(e,t,n)=>{const s=pe(e,t,n);if(!s)return;const[o,r,a]=s;a.appendChild(o),pn(o,r)},pn=(e,t)=>requestAnimationFrame(()=>{ht(e,t.height,t.width),requestAnimationFrame(()=>{Rt(e,0,ge,"width, min-width, height")})}),hn=(e,t,n,s,o=!0)=>{if(n){var r=document.querySelectorAll(`${dt(n)} > .${pt}`);r.forEach(a=>{const l=a.parentElement;if(l!=null&&l.isSameNode(t)||!o&&(l!=null&&l.isSameNode(e)))return;ht(a,0,0),setTimeout(()=>{var p;(p=a.parentNode)==null||p.removeChild(a)},s)})}},yt=(e,t,n=!1)=>{var s=e.querySelectorAll(`.${pt}`);s.forEach(o=>{n?(ht(o,0,0),setTimeout(()=>{e.contains(o)&&e.removeChild(o)},t)):e.removeChild(o)})},mn=50;function Sn(e,t,n,s,o,r){let a=t;const{direction:l,handlerSelector:u,onRemoveAtEvent:p,animationDuration:h,delayBeforeInsert:D,draggingClass:R}=e,m=(i,f,d,S,C)=>{if(!S)return;const{droppable:b,config:T}=S,A=Et(i,f,T.direction,b);_e(f)?V(i,f,A,d,S,C):O(i,f,A,S)},L=(i,f,d,S,C)=>{const b=Et(f,"insert",e.direction,d),{onInsertEvent:T}=e,A=se(d);for(const[M,x]of A.entries())st(x,P)&&M>=i&&q(x,b);C(),setTimeout(()=>{T(i,S),yt(n,0,!0),he(i,d,e),ot(f),j(f,n)},D)},y=(i,f,d,S)=>{if(!d||!d.droppable||!d.config)return;const{droppable:C,config:b}=d;let[T]=Lt(f,C);T=[f,...T].toReversed();const A=Et(f,"remove",b.direction,C);for(const[M,x]of T.entries())M>=i&&(_(x,A),setTimeout(()=>{S(x)},h))},v=i=>{yt(n,h,!0),setTimeout(()=>{ot(i),j(i,n)},h)},O=(i,f,d,S)=>{const{config:C,droppable:b}=S,[T]=Lt(i,b),A=gt(i,b);T.length==0&&H(d,1,C.direction,T);for(const[M,x]of T.entries()){if(!st(x,P))continue;const W=G(C.direction,i,x,d);if(!A&&W)d=W;else if(!A)continue;const nt=T.length-M;H(d,nt,C.direction,T),f===ae?_(x,d):f===Ot&&q(x,d)}},G=(i,f,d,S)=>{const{before:C,distance:b,axis:T,getRect:A}=w(i),M=A(f),x=A(d),W=M[C],nt=x[C],St=x[b],Ct=nt+St/2,At=xe(d)[T],ut=Ct-At;return W>ut?{height:0,width:0}:S},H=(i,f,d,S)=>{const C=S.filter(T=>st(T,P)).length,{distance:b}=w(d);i[b]==0?a=Math.max(a,f):a=Math.min(a,f-1),a=Math.min(a,C)},_=(i,f)=>{const{width:d,height:S}=f;Tt(i,S,d)},q=(i,f)=>{const{width:d,height:S}=f;Tt(i,S,d),Rt(i,h,le)},V=(i,f,d,S,C,b)=>{const{droppable:T,scroll:A,config:M}=C,[x,W]=Lt(i,T),nt=x.toReversed(),St=W===-1?nt.length:W;nt.splice(St,0,i);const[Ct,At,ut]=it(i,W,nt,T);d=Et(i,f,M.direction,n,Ct,At);const Kt=Ce(),Pt=Qe(M.direction,nt,W,ut,Kt,A,S,T,i);x.length==0&&k(void 0,d,i,Pt);for(const[Nt,Ft]of x.toReversed().entries()){let $t=d;ut-1>=Nt&&($t={height:0,width:0}),f===zt&&!st(Ft,pt)&&k(Ft,$t,i,Pt)}N(ut,i,M,T,b)},it=(i,f,d,S)=>{const b=gt(i,S)?f:a,T=()=>f<b?[b,b+1]:f>b?[b-1,b]:[b-1,b+1],[A,M]=T(),x=d[A]??null,W=d[M]??null;return[x,W,b]},k=(i,f,d,S)=>{Tt(i,f.height,f.width),Tt(d,S.height,S.width)},N=(i,f,d,S,C)=>{const{onInsertEvent:b,onDragEnd:T}=d;Q(f,Wt),J(f,n,S,()=>{if(Dt(f,Wt),C!=null){const A=p(C);A!=null&&(b(i,A),T({value:A,index:i})),Z(f),et()}})},et=()=>{if(s){var i=document.querySelectorAll(`${dt(s)} > .${P}`);for(const f of i)I(f)}},Z=i=>{setTimeout(()=>{Dt(i,R)},mn)},J=(i,f,d,S)=>{setTimeout(()=>{S&&S(),z(f,d),K(d),ot(i),j(i,f),j(i,d)},h)},z=(i,f)=>{i.isSameNode(f)?yt(i,h):(yt(i,h,!0),yt(f,h))},K=i=>{if(n.isSameNode(i))return;var[f]=n.querySelectorAll(`.${pt}`);if(!f)return;const{distance:d}=w(l);lt(f)&&(f.style[d]="0px")},j=(i,f)=>{const[d]=Lt(i,f);for(const S of[...d,i])I(S)},I=i=>{lt(i)&&(i.style.transition="",i.style.transform="")},ot=i=>{r(),mt(i,!1),i.style.transform="",i.style.transition="",i.style.top="",i.style.left="",ce(i,{fixedHeight:"",fixedWidth:""})},ct=(i,f)=>{const d=f.querySelector(u);ft(document.body,Qt,i),ft(d||f,It,i)},mt=(i,f)=>{ft(i,Vt,f),ct(f,i),o.toggleGrabClass(!f)};return[m,y,L,v,mt]}const he=(e,t,n)=>{const{insertingFromClass:s,animationDuration:o}=n,r=Zt(()=>{const l=se(t)[e];Q(l,s),Q(l,Ut),setTimeout(()=>{Dt(l,Ut),Dt(l,s),r.disconnect()},o)},t,{childList:!0})},vn=(e,t,n,s)=>{if(!t)return;const{onInsertEvent:o,delayBeforeInsert:r}=e;setTimeout(()=>{o(n,s),he(n,t,e)},r)};class Dn{constructor(t,n){X(this,"items");X(this,"parent");this.items=t,this.parent=n}removeAtEvent(t){return be(this.items,t)}insertEvent(t,n){return Te(this.items,t,n)}getLength(){return Ee(this.items)}getValue(t){return ye(this.items,t)}insertToListEmpty(t,n,s){vn(t,this.parent.value,n,s)}}const bn=(e,t)=>{const n=a=>e.removeAtEvent(a),s=(a,l)=>e.insertEvent(a,l),o=()=>e.getLength(),r=a=>e.getValue(a);return{direction:(t==null?void 0:t.direction)??U,handlerSelector:(t==null?void 0:t.handlerSelector)??P,draggingClass:(t==null?void 0:t.draggingClass)??"dragging",droppableClass:(t==null?void 0:t.droppableClass)??"droppable-hover",isDraggable:(t==null?void 0:t.isDraggable)??(()=>!0),onDragStart:(t==null?void 0:t.onDragStart)??(()=>{}),onDragEnd:(t==null?void 0:t.onDragEnd)??(()=>{}),droppableGroup:t==null?void 0:t.droppableGroup,onRemoveAtEvent:n,onInsertEvent:s,onGetLegth:o,onGetValue:r,animationDuration:(t==null?void 0:t.animationDuration)??150,removingClass:(t==null?void 0:t.removingClass)??"removing",insertingFromClass:(t==null?void 0:t.insertingFromClass)??"from-inserting",delayBeforeRemove:(t==null?void 0:t.delayBeforeRemove)??200,delayBeforeInsert:(t==null?void 0:t.delayBeforeInsert)??200}},Tn=e=>{let t={offsetX:0,offsetY:0},n={top:0,left:0},s={x:0,y:0};const o=u=>{e.style.transform=`translate( ${u.x}px, ${u.y}px)`},r=u=>{e.style.top=`${u.top}px`,e.style.left=`${u.left}px`};return[(u,p,h,D)=>{const R=y=>{const{beforeMargin:v,borderBeforeWidth:O,before:G,offset:H,scroll:_,page:q,inner:V,distance:it,axis:k,getRect:N}=w(y),et=h[q],Z=window[_],J=window[V],z=N(u)[it],K=B(u,O),j=B(u,v),I=et-t[H],ot=oe(u,y);if(I>=Z-z/2&&I<=Z+J){const mt=I-n[G]-K-j-Z-ot;return m(y),mt}return s[k]},m=y=>{if(u&&st(u,Vt)&&y===D){const{before:v,distance:O,axis:G,getRect:H}=w(D),_=H(u)[O],q=H(p),V=n[v]-q[v]+s[G],k=q[O]-_,N=V/k,et=_/k,Z=.1,J=.2,z=.8;let K=0;const j=gt(u,p);!j&&N<J&&N>-et?K=N/J-1:!j&&N>z&&N<1+et&&(K=1/(1-z)*(N-z));const I=Z*_*K;rn(p,D,I)}},L=y=>{const{axis:v}=w(y);s[v]=R(y),o(s)};L(Y),L(U)},(u,p)=>{const[h,D,R,m]=Cn(u,p,e);n={top:h,left:D},r(n),t={offsetX:R,offsetY:m}}]},Mt=(e,t,n)=>{const{borderBeforeWidth:s,before:o,getRect:r}=w(e);return r(t)[o]-r(n)[o]-B(n,s)},En=(e,t)=>{let{offsetX:n,offsetY:s,target:o}=e,r=yn(o,t);const a=o;return a&&r&&!a.isSameNode(r)&&(n+=Mt(Y,a,r),s+=Mt(U,a,r)),r&&t!=o&&(n+=Mt(Y,r,t),s+=Mt(U,r,t)),[n,s]},yn=(e,t)=>{const n=e==null?void 0:e.closest(`.${wt}`);return n&&n.isSameNode(t)?e:n},me=(e,t,n,s)=>{const{offset:o,beforeMargin:r,page:a,borderBeforeWidth:l,scroll:u}=w(e),p=oe(n,e);return t[a]-s[o]-B(n,r)-B(n,l)-window[u]-p},Cn=(e,t,n)=>{const[s,o]=En(e,n);return[me(U,e,t,{offsetX:s,offsetY:o}),me(Y,e,t,{offsetX:s,offsetY:o}),s,o]},tt=class tt{static addConfig(t,n){const s=tt.configs.filter(r=>!r.droppable.isSameNode(t)),o=ne(t);s.push({droppable:t,config:n,scroll:o}),tt.configs=s}static updateScrolls(t,n){for(const s of tt.configs){const{droppable:o}=s;(n&&Se(o,n)||o.isSameNode(t))&&(s.scroll=ne(o))}}static getConfig(t){return tt.configs.find(({droppable:s})=>s.isSameNode(t))}};X(tt,"configs",[]),X(tt,"removeObsoleteConfigs",()=>{const t=tt.configs.filter(({droppable:n})=>document.contains(n));tt.configs=t});let rt=tt;class An{constructor(t,n,s,o,r){X(this,"initial");X(this,"current");X(this,"parent");X(this,"draggableElement");X(this,"groupClass");X(this,"dragEvent");X(this,"changeDroppable");this.parent=s,this.draggableElement=t,this.groupClass=n,this.dragEvent=o,this.initial=s?rt.getConfig(s):void 0,this.changeDroppable=r}getDraggableAncestor(t,n,s){return document.elementsFromPoint(t,n).filter(o=>!o.isSameNode(s))}getElementBelow(t,n,s=!0){const o=a=>{const[l]=a.getDraggableAncestor(n.clientX,n.clientY,t);return l};let r=null;return s?(t.hidden=!0,r=o(this),t.hidden=!1):r=o(this),r}getCurrent(t,n,s=!0){const o=this.getElementBelow(t,n,s);return!this.groupClass||!o?void 0:o.closest(dt(this.groupClass))}isOutsideOfAllDroppables(t){return(this.groupClass?Array.from(document.querySelectorAll(dt(this.groupClass))):[this.parent]).every(s=>gt(t,s))}isNotInsideAnotherDroppable(t,n){return!gt(t,n)||this.isOutsideOfAllDroppables(t)}onScrollEvent(){this.dragEvent()}setOnScroll(t){ie(t,"onscroll",()=>{this.onScrollEvent()})}getCurrentConfig(t){var o;const n=this.draggableElement;if(this.current&&this.isNotInsideAnotherDroppable(n,(o=this.current)==null?void 0:o.droppable))return this.current;const s=this.getCurrent(n,t);return s?(lt(s)&&!s.onscroll&&this.setOnScroll(s),rt.getConfig(s)):rt.getConfig(this.parent)}updateConfig(t){const n=this.current;this.current=this.getCurrentConfig(t),this.changeDroppable(this.current,n)}isOutside(t,n=!0){const s=this.draggableElement;return!this.getCurrent(s,t,n)}}function xn(e,t,n,s,o){const{handlerSelector:r,isDraggable:a,droppableGroup:l,animationDuration:u,delayBeforeRemove:p,draggingClass:h,removingClass:D,onRemoveAtEvent:R,droppableClass:m,onDragStart:L}=n,y=bt(l).map(c=>`droppable-group-${c}`).join(" ");let v=0,O={scrollX:0,scrollY:0},G={pageX:0,pageY:0},H;const[_,q]=Tn(e),[V,it,k,N,et]=Sn(n,t,s,y,o,()=>v=0),Z=()=>{Q(e,P)},J=c=>{Q(c,wt),o.addSubscriber(c)},z=()=>{if(a(e)){const c=e.querySelector(r);J(c||e)}},K=()=>{We(document.body,[`.${P}{touch-action:manipulation;user-select:none;box-sizing:border-box!important;-webkit-user-select:none;}`,`.${wt}{pointer-events:auto!important;}`,`.${Xt}{cursor:grab;}`,".temp-child{touch-action:none;pointer-events:none;box-sizing:border-box!important;}",".droppable{box-sizing:border-box!important;}",`.${Vt}{position:fixed;z-index:5000;width:var(--fixedWidth)!important;height:var(--fixedHeight)!important;}`,`.${It}{pointer-events:none!important;}`,`.${Wt}{pointer-events:none!important;}`,`.${Qt}{cursor:grabbing;}`,".disable-transition{transition:none!important;}"]),z(),Z()},j=c=>{const g=c==null?void 0:c.querySelector(`.${wt}`),E=g==null?void 0:g.parentElement;return g&&E&&st(E,Gt)&&!E.isSameNode(s)?null:g},I=c=>{const g=j(c)??c;g&&a(c)&&(_t(g,"onmousedown",M("mousemove","mouseup")),_t(g,"ontouchstart",M("touchmove","touchend")),ot(g)),c!=null&&c.isSameNode(g)||_t(c,"onmousedown",x),Q(s,Gt)},ot=c=>{const g=c.querySelectorAll("img");Array.from(g).forEach(E=>{E.onmousedown=()=>!1})},ct=()=>{if(G.pageX==0&&G.pageY==0||!i.current)return;const{droppable:c,config:g}=i.current;_(e,c,G,g.direction),V(e,Ot,O,i.current)},mt=(c,g)=>{g&&v==2&&!(c!=null&&c.droppable.isSameNode(g.droppable))&&V(e,Ot,O,g)},i=new An(e,y,s,ct,mt),f=c=>{if(!i.current)return;const g=y?Array.from(document.querySelectorAll(dt(y))):[s];for(const E of g)E.classList.toggle(m,!c&&E.isSameNode(i.current.droppable))},d=c=>{i.updateConfig(c);const g=i.isOutside(c);f(g),v===1?St(c):v===2&&(S(g),At(c))},S=(c=!0)=>{if(!i.current)return;const{droppable:g}=i.current;hn(g,s,y,u,c),!c&&Jt(e,s,v==1,i.current)},C=c=>{if(Ht(c)&&c.cancelable)c.preventDefault();else if(Ht(c))return;const g=qt(c);d(g)},b=(c,g)=>{c=="touchmove"?H=setTimeout(()=>{g()},200):g()},T=(c,g)=>{const{clientX:E,clientY:vt}=c,at=document.elementFromPoint(E,vt),xt=at==null?void 0:at.closest(`.${P}`);return at&&g&&xt&&!g.isSameNode(xt)},A=c=>{const g=n.onGetValue(t);return{index:t,element:c,value:g}},M=(c,g)=>E=>{if(T(E,e))return;rt.updateScrolls(s,y);const{scrollX:vt,scrollY:at}=window;if(O={scrollX:vt,scrollY:at},v===0){v=1;const xt=A(e);xt&&L(xt),b(c,()=>{c=="touchmove"&&(i.updateConfig(E),f(i.isOutside(E)),St(E)),document.addEventListener(c,C,{passive:!1})}),ut(s),document.addEventListener(g,W(c),{once:!0})}},x=c=>i.updateConfig(c),W=c=>g=>{f(!0);const E=qt(g);clearTimeout(H),Pt(i.isOutside(E,!1)),document.removeEventListener(c,C),i.updateConfig(E);const vt=i.getCurrentConfig(E);if(vt){const{droppable:at}=vt;nt(at)}s.onscroll=null},nt=c=>{if(c.onscroll=null,!y)return;const g=Array.from(document.querySelectorAll(dt(y)));for(const E of g)lt(E)&&(E.onscroll=null)},St=c=>{Jt(e,s,v==1,i.current),Ct(),V(e,ae,O,i.current),Ft(e),q(c,e)},Ct=()=>{v=2},At=c=>{const{pageX:g,pageY:E}=c;G={pageX:g,pageY:E},ct()},ut=c=>ie(c,"onscroll",Kt),Kt=()=>ct(),Pt=c=>{if(v!==2){v=0;return}v=3,Nt(e),V(e,zt,O,c?i.initial:i.current,t)},Nt=c=>{Rt(c,u,le),Tt(c,0,0)},Ft=c=>{const{height:g,width:E}=c.getBoundingClientRect();ce(c,{fixedHeight:`${g}px`,fixedWidth:`${E}px`}),et(c,!0),ft(c,h,!0),c.style.transition=""},$t=c=>{if(!i.current)return;const g=i.current;c==t&&(Q(e,D),setTimeout(()=>{R(t),Dt(e,D),Jt(e,s,v==1,i.current),it(c,e,g,E=>{Nt(E),N(e)})},p))},Mn=(c,g)=>{(c===t||c===n.onGetLegth()&&t===c-1)&&k(c,e,s,g,()=>{gn(e,v==1,i.initial)})};return K(),I(e),[$t,Mn]}const wn=(e,t)=>{e&&ve(t,e)};function Bn(e,t,n){const s="index";let o=[],r=[];const{droppableGroup:a}=e;if(!n)return[o,r];const l=bt(a).map(u=>`droppable-group-${u}`).join(" ");wn(l,n);for(const u of n.children){const p=u.getAttribute(s),h=Ae(p),D=u;if(D&&h>=0){const[R,m]=xn(D,h,e,n,t);o.push(R),r.push(m)}}return[o,r]}function Ln(e,t,n){let s=[],o=[];const r=bn(e,n),a=m=>{for(const L of s)L(m)},l=(m,L)=>{if(r.onGetLegth()===0)e.insertToListEmpty(r,m,L);else for(const v of o)v(m,L)},u=m=>{const[L,y]=Bn(r,t,m);s=L,o=y},p=m=>{Zt(()=>{u(m)},m,{childList:!0})},h=m=>{Q(m,Gt)},D=m=>{rt.addConfig(m,r)};return[a,l,m=>{m&&(h(m),D(m),p(m),u(m),rt.removeObsoleteConfigs())}]}const Rn=new De;function On(e,t){const n=F.ref();var s=new Dn(e,n);const[o,r,a]=Ln(s,Rn,t);return F.watch(n,()=>{a(n.value)}),{parent:n,removeAt:o,insertAt:r}}$.useDragAndDrop=On,Object.defineProperty($,Symbol.toStringTag,{value:"Module"})});