@vue-dnd-kit/core 1.5.1 → 1.6.0
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.
package/dist/index.d.ts
CHANGED
|
@@ -66,6 +66,7 @@ export declare interface IDragElement {
|
|
|
66
66
|
groups: string[];
|
|
67
67
|
layer: Component | null;
|
|
68
68
|
defaultLayer: Component | null;
|
|
69
|
+
disabled: boolean;
|
|
69
70
|
data: {
|
|
70
71
|
source?: any[];
|
|
71
72
|
index?: number;
|
|
@@ -88,6 +89,7 @@ export declare interface IDraggingElement extends IDragElement {
|
|
|
88
89
|
export declare interface IDropZone {
|
|
89
90
|
node: HTMLElement | Element | null;
|
|
90
91
|
groups: string[];
|
|
92
|
+
disabled: boolean;
|
|
91
93
|
data?: {
|
|
92
94
|
source?: any[];
|
|
93
95
|
[key: string]: any;
|
|
@@ -128,7 +130,8 @@ store: IDnDStore
|
|
|
128
130
|
|
|
129
131
|
export declare interface IUseDragOptions extends IUseSensorOptions {
|
|
130
132
|
id?: string | number;
|
|
131
|
-
groups?: string[]
|
|
133
|
+
groups?: string[] | Ref<string[]>;
|
|
134
|
+
disabled?: boolean | Ref<boolean>;
|
|
132
135
|
events?: {
|
|
133
136
|
onEnd?: (store: IDnDStore, payload: IDnDPayload) => void;
|
|
134
137
|
onStart?: (store: IDnDStore, payload: IDnDPayload) => void;
|
|
@@ -154,6 +157,7 @@ export declare interface IUseDragOptions extends IUseSensorOptions {
|
|
|
154
157
|
|
|
155
158
|
export declare interface IUseDropOptions {
|
|
156
159
|
groups?: string[];
|
|
160
|
+
disabled?: boolean | Ref<boolean>;
|
|
157
161
|
events?: {
|
|
158
162
|
onDrop?: (
|
|
159
163
|
store: IDnDStore,
|
|
@@ -432,6 +436,7 @@ export declare const useDnDStore: () => {
|
|
|
432
436
|
__file?: string | undefined;
|
|
433
437
|
__name?: string | undefined;
|
|
434
438
|
} | null;
|
|
439
|
+
disabled: boolean;
|
|
435
440
|
data: {
|
|
436
441
|
[x: string]: any;
|
|
437
442
|
source?: any[] | undefined;
|
|
@@ -698,6 +703,7 @@ export declare const useDnDStore: () => {
|
|
|
698
703
|
__file?: string | undefined;
|
|
699
704
|
__name?: string | undefined;
|
|
700
705
|
} | null;
|
|
706
|
+
disabled: boolean;
|
|
701
707
|
data: {
|
|
702
708
|
[x: string]: any;
|
|
703
709
|
source?: any[] | undefined;
|
|
@@ -1195,6 +1201,7 @@ export declare const useDnDStore: () => {
|
|
|
1195
1201
|
__file?: string | undefined;
|
|
1196
1202
|
__name?: string | undefined;
|
|
1197
1203
|
} | null;
|
|
1204
|
+
disabled: boolean;
|
|
1198
1205
|
data: {
|
|
1199
1206
|
[x: string]: any;
|
|
1200
1207
|
source?: any[] | undefined;
|
|
@@ -1449,6 +1456,7 @@ export declare const useDnDStore: () => {
|
|
|
1449
1456
|
__file?: string | undefined;
|
|
1450
1457
|
__name?: string | undefined;
|
|
1451
1458
|
} | null;
|
|
1459
|
+
disabled: boolean;
|
|
1452
1460
|
data: {
|
|
1453
1461
|
[x: string]: any;
|
|
1454
1462
|
source?: any[] | undefined;
|
|
@@ -1466,6 +1474,7 @@ export declare const useDnDStore: () => {
|
|
|
1466
1474
|
zonesMap: Ref<Map<HTMLElement | Element, {
|
|
1467
1475
|
node: HTMLElement | Element | null;
|
|
1468
1476
|
groups: string[];
|
|
1477
|
+
disabled: boolean;
|
|
1469
1478
|
data?: {
|
|
1470
1479
|
[x: string]: any;
|
|
1471
1480
|
source?: any[] | undefined;
|
|
@@ -1478,6 +1487,7 @@ export declare const useDnDStore: () => {
|
|
|
1478
1487
|
}> & Omit<Map<HTMLElement | Element, IDropZone>, keyof Map<any, any>>, Map<HTMLElement | Element, IDropZone> | (Map<HTMLElement | Element, {
|
|
1479
1488
|
node: HTMLElement | Element | null;
|
|
1480
1489
|
groups: string[];
|
|
1490
|
+
disabled: boolean;
|
|
1481
1491
|
data?: {
|
|
1482
1492
|
[x: string]: any;
|
|
1483
1493
|
source?: any[] | undefined;
|
|
@@ -1773,6 +1783,7 @@ export declare const useDragContainer: (options?: Omit<TransitionProps, 'appear'
|
|
|
1773
1783
|
__file?: string | undefined;
|
|
1774
1784
|
__name?: string | undefined;
|
|
1775
1785
|
} | null;
|
|
1786
|
+
disabled: boolean;
|
|
1776
1787
|
data: {
|
|
1777
1788
|
[x: string]: any;
|
|
1778
1789
|
source?: any[] | undefined;
|
|
@@ -2039,6 +2050,7 @@ export declare const useDragContainer: (options?: Omit<TransitionProps, 'appear'
|
|
|
2039
2050
|
__file?: string | undefined;
|
|
2040
2051
|
__name?: string | undefined;
|
|
2041
2052
|
} | null;
|
|
2053
|
+
disabled: boolean;
|
|
2042
2054
|
data: {
|
|
2043
2055
|
[x: string]: any;
|
|
2044
2056
|
source?: any[] | undefined;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var re=Object.defineProperty;var ae=(n,t,e)=>t in n?re(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e;var B=(n,t,e)=>ae(n,typeof t!="symbol"?t+"":t,e);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("vue"),F=require("@vueuse/core"),A=class A{};B(A,"remove",(t,e)=>{if(!t||e===void 0)return;const[l]=t.splice(e,1);return l}),B(A,"insert",(t,e,l)=>{!t||e===void 0||t.splice(e,0,l)}),B(A,"move",(t,e,l,o)=>{if(!t||!l||e===void 0||o===void 0)return;const s=A.remove(t,e);A.insert(l,o,s)}),B(A,"swap",(t,e,l,o)=>{if(!t||!l||e===void 0||o===void 0)return;const s=t[e],i=l[o];t[e]=i,l[o]=s}),B(A,"copy",(t,e,l,o)=>{if(!t||e===void 0||!l||o===void 0)return;const s=t[e];A.insert(l,o,s)}),B(A,"applyTransfer",t=>{var o,s,i,g,u,c,d;const e=t.hovered.element.value,l=t.hovered.zone.value;if(e){const m=(s=(o=t.elementsMap.value.get(e))==null?void 0:o.data)==null?void 0:s.source,a=(g=(i=t.elementsMap.value.get(e))==null?void 0:i.data)==null?void 0:g.index,f=t.draggingElements.value.values().next().value,v=(u=f==null?void 0:f.data)==null?void 0:u.index,h=v!==void 0&&a!==void 0&&v>a?1:-1;Array.from(t.draggingElements.value.values()).sort((E,P)=>{var C,M;return h*((((C=E.data)==null?void 0:C.index)||0)-(((M=P.data)==null?void 0:M.index)||0))}).forEach(E=>{var P,C;return A.move((P=E.data)==null?void 0:P.source,(C=E.data)==null?void 0:C.index,m,a)})}else if(l){const m=(d=(c=t.zonesMap.value.get(l))==null?void 0:c.data)==null?void 0:d.source,a=m==null?void 0:m.length;Array.from(t.draggingElements.value.values()).sort((v,h)=>{var p,E;return(((p=h.data)==null?void 0:p.index)||0)-(((E=v.data)==null?void 0:E.index)||0)}).forEach(v=>{var h,p;return A.move((h=v.data)==null?void 0:h.source,(p=v.data)==null?void 0:p.index,m,a)})}}),B(A,"applyCopy",t=>{var o,s,i,g,u,c;const e=t.hovered.element.value,l=t.hovered.zone.value;if(e){const d=(s=(o=t.elementsMap.value.get(e))==null?void 0:o.data)==null?void 0:s.source,m=(g=(i=t.elementsMap.value.get(e))==null?void 0:i.data)==null?void 0:g.index;Array.from(t.draggingElements.value.values()).sort((f,v)=>{var h,p;return(((h=v.data)==null?void 0:h.index)||0)-(((p=f.data)==null?void 0:p.index)||0)}).forEach(f=>{var v,h;return A.copy((v=f.data)==null?void 0:v.source,(h=f.data)==null?void 0:h.index,d,m)})}else if(l){const d=(c=(u=t.zonesMap.value.get(l))==null?void 0:u.data)==null?void 0:c.source,m=d==null?void 0:d.length;Array.from(t.draggingElements.value.values()).sort((f,v)=>{var h,p;return(((h=v.data)==null?void 0:h.index)||0)-(((p=f.data)==null?void 0:p.index)||0)}).forEach(f=>{var v,h;return A.copy((v=f.data)==null?void 0:v.source,(h=f.data)==null?void 0:h.index,d,m)})}}),B(A,"applySwap",t=>{var o,s,i,g,u,c,d,m;const e=t.hovered.element.value,l=t.hovered.zone.value;if(e&&t.draggingElements.value.size===1){const a=t.draggingElements.value.values().next().value;A.swap((o=a==null?void 0:a.data)==null?void 0:o.source,(s=a==null?void 0:a.data)==null?void 0:s.index,(g=(i=t.elementsMap.value.get(e))==null?void 0:i.data)==null?void 0:g.source,(c=(u=t.elementsMap.value.get(e))==null?void 0:u.data)==null?void 0:c.index)}else if(l){const a=(m=(d=t.zonesMap.value.get(l))==null?void 0:d.data)==null?void 0:m.source,f=a==null?void 0:a.length;Array.from(t.draggingElements.value.values()).sort((h,p)=>{var E,P;return(((E=p.data)==null?void 0:E.index)||0)-(((P=h.data)==null?void 0:P.index)||0)}).forEach(h=>{var p,E;return A.move((p=h.data)==null?void 0:p.source,(E=h.data)==null?void 0:E.index,a,f)})}}),B(A,"applyRemove",t=>{Array.from(t.draggingElements.value.values()).sort((l,o)=>{var s,i;return(((s=o.data)==null?void 0:s.index)||0)-(((i=l.data)==null?void 0:i.index)||0)}).forEach(l=>{var o,s;(o=l.data)!=null&&o.source&&((s=l.data)==null?void 0:s.index)!==void 0&&A.remove(l.data.source,l.data.index)})}),B(A,"applyInsert",(t,e)=>{var s,i,g,u,c,d;const l=t.hovered.element.value,o=t.hovered.zone.value;if(l&&e.length>0){const m=(i=(s=t.elementsMap.value.get(l))==null?void 0:s.data)==null?void 0:i.source,a=(u=(g=t.elementsMap.value.get(l))==null?void 0:g.data)==null?void 0:u.index;e.forEach(f=>{A.insert(m,a,f)})}else if(o){const m=(d=(c=t.zonesMap.value.get(o))==null?void 0:c.data)==null?void 0:d.source,a=m==null?void 0:m.length;e.forEach(f=>{A.insert(m,a,f)})}});let N=A;const R=F.createGlobalState(()=>{const n=r.shallowRef(!1),t=r.ref(new Map),e=r.computed(()=>t.value.size>0),l={component:r.ref(null),ref:r.shallowRef(null),options:r.shallowRef(null),animating:{enter:r.shallowRef(!1),leave:r.shallowRef(!1),appear:r.shallowRef(!1)}},o=r.ref(new Map),s=r.ref(new Set),i=r.ref(new Map),g=r.shallowRef(new Set),u=r.shallowRef(new Set),c=typeof window<"u"&&"IntersectionObserver"in window,d=c?new IntersectionObserver(x=>{x.forEach(y=>u.value[y.isIntersecting?"add":"delete"](y.target))}):null,m=c?new IntersectionObserver(x=>{x.forEach(y=>g.value[y.isIntersecting?"add":"delete"](y.target))}):null,a=(x,y)=>{d&&(x==="add"?d.observe(y):(d.unobserve(y),u.value.delete(y)))},f=(x,y)=>{m&&(x==="add"?m.observe(y):(m.unobserve(y),g.value.delete(y)))},v={start:r.shallowRef(null),current:r.shallowRef(null),offset:{percent:r.shallowRef(null),pixel:r.shallowRef(null)}},{w:h,s:p,a:E,d:P,ctrl:C,shift:M,alt:U,meta:V}=F.useMagicKeys(),w={zone:r.shallowRef(null),element:r.shallowRef(null)};return{draggingElements:t,isDragging:e,activeContainer:l,elementsMap:o,selectedElements:s,zonesMap:i,visibleZones:g,visibleElements:u,pointerPosition:v,keyboard:{w:h,s:p,a:E,d:P,ctrl:C,shift:M,alt:U,meta:V},hovered:w,isPending:n,handleDragElementIntersection:a,handleDropZoneIntersection:f}}),ne=n=>{const t=r.ref(null),{draggingElements:e,pointerPosition:l,isDragging:o,activeContainer:s}=R();return r.onMounted(()=>{s.ref=t,s.options.value=n??null}),r.onUnmounted(()=>{s.ref.value=null,s.options.value=null}),{elementRef:t,draggingElements:e,pointerPosition:l,isDragging:o,animating:s.animating}},le=["innerHTML"],oe=r.defineComponent({__name:"DefaultOverlay",props:{styles:{}},setup(n){const{elementRef:t,pointerPosition:e,isDragging:l,draggingElements:o}=ne(),s=r.computed(()=>{var i,g,u,c;return{transform:`translate3d(${(((i=e.current.value)==null?void 0:i.x)??0)-(((g=e.offset.pixel.value)==null?void 0:g.x)??0)}px, ${(((u=e.current.value)==null?void 0:u.y)??0)-(((c=e.offset.pixel.value)==null?void 0:c.y)??0)}px, 0)`,zIndex:1e3,position:"fixed",top:0,left:0,transition:"0.3s cubic-bezier(0.165, 0.84, 0.44, 1)",...n.styles}});return(i,g)=>r.unref(l)?(r.openBlock(),r.createElementBlock("div",{key:0,ref_key:"elementRef",ref:t,style:r.normalizeStyle(s.value)},[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(r.unref(o),([u,c])=>{var d,m;return r.openBlock(),r.createElementBlock(r.Fragment,{key:c.id},[c.layer?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(c.layer),{key:0,node:u,data:c.data,id:c.id,groups:c.groups},null,8,["node","data","id","groups"])):(r.openBlock(),r.createElementBlock("div",{key:1,innerHTML:c.initialHTML,style:r.normalizeStyle({width:`${(d=c.initialRect)==null?void 0:d.width}px`,height:`${(m=c.initialRect)==null?void 0:m.height}px`})},null,12,le))],64)}),128))],4)):r.createCommentVNode("",!0)}}),J=r.defineComponent({__name:"DragOverlay",props:{styles:{}},setup(n){const t=n,{activeContainer:e}=R(),l=r.computed(()=>({component:e.component.value??oe,props:t}));return(o,s)=>r.unref(e).options.value?(r.openBlock(),r.createBlock(r.Transition,{key:0,name:r.unref(e).options.value.name,duration:r.unref(e).options.value.duration,"enter-from-class":r.unref(e).options.value.enterFromClass,"enter-to-class":r.unref(e).options.value.enterToClass,"enter-active-class":r.unref(e).options.value.enterActiveClass,"leave-from-class":r.unref(e).options.value.leaveFromClass,"leave-to-class":r.unref(e).options.value.leaveToClass,"leave-active-class":r.unref(e).options.value.leaveActiveClass,"appear-active-class":r.unref(e).options.value.appearActiveClass,"appear-from-class":r.unref(e).options.value.appearFromClass,"appear-to-class":r.unref(e).options.value.appearToClass,mode:r.unref(e).options.value.mode,type:r.unref(e).options.value.type,css:r.unref(e).options.value.css,appear:!0,persisted:r.unref(e).options.value.persisted,onEnter:r.unref(e).options.value.onEnter,onLeave:r.unref(e).options.value.onLeave,onBeforeEnter:r.unref(e).options.value.onBeforeEnter,onBeforeLeave:r.unref(e).options.value.onBeforeLeave,onBeforeAppear:r.unref(e).options.value.onBeforeAppear,onAfterEnter:r.unref(e).options.value.onAfterEnter,onAfterLeave:r.unref(e).options.value.onAfterLeave,onAfterAppear:r.unref(e).options.value.onAfterAppear},{default:r.withCtx(()=>[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(l.value.component||l.value),r.normalizeProps(r.guardReactiveProps(l.value.props||{})),null,16))]),_:1},8,["name","duration","enter-from-class","enter-to-class","enter-active-class","leave-from-class","leave-to-class","leave-active-class","appear-active-class","appear-from-class","appear-to-class","mode","type","css","persisted","onEnter","onLeave","onBeforeEnter","onBeforeLeave","onBeforeAppear","onAfterEnter","onAfterLeave","onAfterAppear"])):(r.openBlock(),r.createBlock(r.resolveDynamicComponent(l.value.component||l.value),r.normalizeProps(r.mergeProps({key:1},l.value.props||{})),null,16))}}),se={install(n,t){n.component("DragOverlay",J);const e=n.mount;n.mount=function(o){var g;const s=e.call(this,o),i=typeof o=="string"?document.querySelector(o):o;if(i&&i instanceof Element&&!i.querySelector("#vue-dnd-kit-overlay")){const u=document.createElement("div");u.id="vue-dnd-kit-overlay",u.style.pointerEvents="none",i.appendChild(u);const c=r.createVNode(J,{styles:(g=t==null?void 0:t.defaultOverlay)==null?void 0:g.styles});r.render(c,u),n.__VUE_DND_KIT_OVERLAY__={container:u,vnode:c,options:(t==null?void 0:t.defaultOverlay)||{}};const d=R();n.__VUE_DND_KIT_STORE__=d}return s};const l=n.unmount;n.unmount=function(){return n.__VUE_DND_KIT_OVERLAY__&&(r.render(null,n.__VUE_DND_KIT_OVERLAY__.container),delete n.__VUE_DND_KIT_OVERLAY__),l.call(this)}}},Q=(n,t)=>n.x<t.x+t.width&&n.x+n.width>t.x&&n.y<t.y+t.height&&n.y+n.height>t.y,O=n=>{if(!n)return{x:0,y:0,width:0,height:0,bottom:0,left:0,right:0,top:0};const t=n.getBoundingClientRect();return{bottom:t.bottom,left:t.left,right:t.right,top:t.top,x:t.x,y:t.y,width:t.width,height:t.height}},X=n=>({x:n.x+n.width/2,y:n.y+n.height/2}),ue=(n,t)=>{const e=O(n);return{pixel:{x:t.x-e.x,y:t.y-e.y},percent:{x:(t.x-e.x)/e.width*100,y:(t.y-e.y)/e.height*100}}},W=(n,t)=>{const e=t.x-n.x,l=t.y-n.y;return Math.sqrt(e*e+l*l)},ee=(n,t)=>{const e=Math.max(0,Math.min(n.x+n.width,t.x+t.width)-Math.max(n.x,t.x)),l=Math.max(0,Math.min(n.y+n.height,t.y+t.height)-Math.max(n.y,t.y)),o=e*l,s=n.width*n.height,i=t.width*t.height;return(o/s*100+o/i*100)/2},te="data-vue-dnd-kit-draggable",I=n=>{n.preventDefault()},Z=n=>({items:Array.from(n.draggingElements.value.values())}),ie=n=>{const{elementsMap:t,draggingElements:e,hovered:l,selectedElements:o,isDragging:s,visibleElements:i,handleDragElementIntersection:g}=R(),u=r.ref(null),c=r.computed(()=>l.element.value===u.value),d=r.shallowRef((n==null?void 0:n.id)||r.useId()),m=r.computed(()=>!u.value||!t.value.has(u.value)?!1:e.value.has(u.value)),a=r.computed(()=>{if(!u.value||!s.value||!i.value.has(u.value))return!1;const p=t.value.get(u.value);return p!=null&&p.groups.length?!Array.from(e.value.entries()).some(([E,P])=>P.groups.length?!P.groups.some(C=>p.groups.includes(C)):!1):!0}),f=r.computed(()=>{if(!u.value||!s.value||!i.value.has(u.value)||l.element.value!==u.value)return!1;const p=t.value.get(u.value);return p!=null&&p.groups.length?!Array.from(e.value.entries()).some(([E,P])=>P.groups.length?!P.groups.some(C=>p.groups.includes(C)):!1):!0});return{elementRef:u,registerElement:()=>{if(!u.value)throw new Error("ElementRef is not set");t.value.set(u.value,{node:u.value,groups:(n==null?void 0:n.groups)??[],layer:(n==null?void 0:n.layer)??null,defaultLayer:(n==null?void 0:n.layer)??null,events:(n==null?void 0:n.events)??{},data:(n==null?void 0:n.data)??null,id:d.value}),g("add",u.value),u.value.addEventListener("dragstart",I),u.value.addEventListener("drag",I),u.value.setAttribute(te,"true"),u.value.setAttribute("draggable","false")},unregisterElement:()=>{u.value&&(t.value.delete(u.value),o.value.delete(u.value),u.value.removeEventListener("dragstart",I),u.value.removeEventListener("drag",I),u.value.removeAttribute(te),u.value.removeAttribute("draggable"))},isDragging:m,isOvered:c,isAllowed:a,isLazyAllowed:f,id:d}},T=(n,t)=>n?t.contains(n):!1,ce=n=>{var d,m;const t=O(n.activeContainer.ref.value),e=X(t),l=((d=n.pointerPosition.current.value)==null?void 0:d.x)??0,o=((m=n.pointerPosition.current.value)==null?void 0:m.y)??0,i=!(t&&l>=t.x&&l<=t.x+t.width&&o>=t.y&&o<=t.y+t.height),g=Array.from(n.draggingElements.value.keys()),u=Array.from(n.visibleElements.value.entries()).filter(([a,f])=>{if(!a)return!1;const v=O(a);return v&&t&&Q(v,t)}).map(([a,f])=>{const v=O(a),h=X(v),p=l>=v.x&&l<=v.x+v.width&&o>=v.y&&o<=v.y+v.height,E=ee(v,t),P=W(e,h);let C=0;for(const[M,U]of n.visibleElements.value.entries())M!==a&&M&&a&&T(a,M)&&C++;return{element:f,node:a,isPointerInElement:p,overlapPercent:E,depth:C,centerDistance:P}}).sort((a,f)=>{if(!i){if(a.isPointerInElement&&f.isPointerInElement)return f.depth-a.depth;if(a.isPointerInElement!==f.isPointerInElement)return a.isPointerInElement?-1:1}return Math.abs(a.overlapPercent-f.overlapPercent)<=1?a.centerDistance-f.centerDistance:f.overlapPercent-a.overlapPercent}),c=Array.from(n.visibleZones.value.entries()).filter(([a,f])=>{if(!a||g.some(h=>h&&T(a,h)))return!1;const v=O(a);return v&&t&&Q(v,t)}).map(([a,f])=>{const v=O(a),h=X(v),p=l>=v.x&&l<=v.x+v.width&&o>=v.y&&o<=v.y+v.height,E=ee(v,t),P=W(e,h);let C=0;for(const[M,U]of n.visibleZones.value.entries())M!==a&&M&&a&&T(a,M)&&C++;return{zone:f,node:a,isPointerInElement:p,overlapPercent:E,depth:C,centerDistance:P}}).sort((a,f)=>{if(!i){if(a.isPointerInElement&&f.isPointerInElement)return f.depth-a.depth;if(a.isPointerInElement!==f.isPointerInElement)return a.isPointerInElement?-1:1}return Math.abs(a.overlapPercent-f.overlapPercent)<=1?a.centerDistance-f.centerDistance:f.overlapPercent-a.overlapPercent});return[...u.map(a=>a.node),...c.map(a=>a.node)]},ve=(n,t)=>{const{pointerPosition:e,keyboard:l}=R(),o=(t==null?void 0:t.moveStep)||10;return{onKeyboardStart:u=>{var a;I(u);const c=O(n.value);(a=n.value)==null||a.blur();const d=c.x+c.width/2,m=c.y+c.height/2;e.start.value={x:d,y:m},e.current.value={x:d,y:m},e.offset.pixel.value={x:c.width/2,y:c.height/2},e.offset.percent.value={x:50,y:50}},onKeyboardMove:()=>{if(!e.current.value)return;const u=e.current.value.x,c=e.current.value.y;let d=u,m=c;l.w.value&&(m-=o),l.s.value&&(m+=o),l.a.value&&(d-=o),l.d.value&&(d+=o),e.current.value={x:d,y:m}},onKeyboardEnd:()=>{e.current.value=null,e.start.value=null,e.offset.pixel.value=null,e.offset.percent.value=null}}},de=n=>{const t=R();return{onPointerStart:s=>{t.pointerPosition.start.value={x:s.clientX,y:s.clientY},t.pointerPosition.current.value={x:s.clientX,y:s.clientY};const{pixel:i,percent:g}=ue(n.value,{x:s.clientX,y:s.clientY});t.pointerPosition.offset.pixel.value=i,t.pointerPosition.offset.percent.value=g},onPointerMove:s=>{t.isPending.value||(t.pointerPosition.current.value={x:s.clientX,y:s.clientY})},onPointerEnd:()=>{t.pointerPosition.current.value=null,t.pointerPosition.start.value=null,t.pointerPosition.offset.pixel.value=null,t.pointerPosition.offset.percent.value=null}}},fe=(n,t)=>{var U,V;const e=R(),{onPointerStart:l,onPointerMove:o,onPointerEnd:s}=de(n),{onKeyboardStart:i,onKeyboardMove:g,onKeyboardEnd:u}=ve(n,t==null?void 0:t.keyboard);let c=null;const d=w=>{var D,b;if(!w)return new Map;const x=e.selectedElements.value.has(w);if(e.selectedElements.value.size>0&&x){const S=new Map;return e.selectedElements.value.forEach(k=>{var _,K;const z=e.elementsMap.value.get(k);z&&S.set(k,{...z,initialHTML:((_=z.node)==null?void 0:_.outerHTML)??"",initialRect:(K=z.node)==null?void 0:K.getBoundingClientRect()})}),S}e.selectedElements.value.clear();const y=e.elementsMap.value.get(w);if(!y)return new Map;const L=new Map;return L.set(w,{...y,initialHTML:((D=y.node)==null?void 0:D.outerHTML)??"",initialRect:(b=y.node)==null?void 0:b.getBoundingClientRect()}),L},m=w=>{if(!w)return{element:null,zone:null};const x=Array.isArray(w)?w:[w],y=Array.from(e.draggingElements.value.keys()),L=x.find(S=>{if(!e.visibleZones.value.has(S))return!1;const k=e.zonesMap.value.get(S);return!(!k||y.some(z=>z&&(z===k.node||T(k.node,z)))||k.groups.length&&!!Array.from(e.draggingElements.value.values()).some(_=>_.groups.length?!_.groups.some(K=>k.groups.includes(K)):!1))});return L?{element:x.filter(S=>!e.visibleElements.value.has(S)||!e.elementsMap.value.has(S)?!1:!Array.from(e.draggingElements.value.values()).some(z=>z.groups.length?!z.groups.some(_=>{var K;return(K=e.elementsMap.value.get(S))==null?void 0:K.groups.includes(_)}):!1)).find(S=>y.some(z=>z&&(z===S||T(S,z)||T(z,S)))?!1:S===L||T(S,L))||null,zone:L}:{element:null,zone:null}},a=((U=t==null?void 0:t.sensor)==null?void 0:U.setup)||ce,f=w=>{var b,S,k,z,_,K,q,Y,$,G,H,j;const x=e.hovered.element.value,y=e.hovered.zone.value,L=w.element,D=w.zone;e.hovered.element.value=L,e.hovered.zone.value=D,x!==L&&(x&&((k=(S=(b=e.elementsMap.value.get(x))==null?void 0:b.events)==null?void 0:S.onLeave)==null||k.call(S,e,Z(e))),L&&((K=(_=(z=e.elementsMap.value.get(L))==null?void 0:z.events)==null?void 0:_.onHover)==null||K.call(_,e,Z(e)))),y!==D&&(y&&(($=(Y=(q=e.zonesMap.value.get(y))==null?void 0:q.events)==null?void 0:Y.onLeave)==null||$.call(Y,e,Z(e))),D&&((j=(H=(G=e.zonesMap.value.get(D))==null?void 0:G.events)==null?void 0:H.onHover)==null||j.call(H,e,Z(e))))},v=F.useThrottleFn(()=>{const w=a(e),x=m(w);f(x)},((V=t==null?void 0:t.sensor)==null?void 0:V.throttle)??0),h=()=>{v(),c=requestAnimationFrame(h)},p=()=>h(),E=()=>{c!==null&&(s(),u(),cancelAnimationFrame(c),c=null)};return{activate:w=>{e.draggingElements.value=d(n.value),e.draggingElements.value.forEach(x=>{var y,L;return(L=(y=x.events).onStart)==null?void 0:L.call(y,e,Z(e))}),w instanceof PointerEvent?l(w):i(w),p()},track:w=>{e.draggingElements.value.forEach(x=>{var y,L;return(L=(y=x.events).onMove)==null?void 0:L.call(y,e,Z(e))}),w instanceof KeyboardEvent?g():o(w)},deactivate:async(w=!0)=>{var x,y;if(e.hovered.zone.value){const L=e.zonesMap.value.get(e.hovered.zone.value),D=(y=L==null?void 0:(x=L.events).onDrop)==null?void 0:y.call(x,e,Z(e));if(D instanceof Promise)try{e.isPending.value=!0;const b=await D;return b&&(w&&e.selectedElements.value.clear(),e.draggingElements.value.clear(),e.hovered.zone.value=null,e.hovered.element.value=null,E()),b}catch{return!1}finally{e.isPending.value=!1}else w&&e.selectedElements.value.clear(),e.draggingElements.value.clear(),e.hovered.zone.value=null,e.hovered.element.value=null,E()}else e.draggingElements.value.forEach(L=>{var D,b;return(b=(D=L.events).onEnd)==null?void 0:b.call(D,e,Z(e))}),w&&e.selectedElements.value.clear(),e.draggingElements.value.clear(),e.hovered.zone.value=null,e.hovered.element.value=null,E()}}},ge=F.createGlobalState(()=>{let n="",t="",e="",l=null,o=null,s=null,i=null,g=null;const{activeContainer:u,isPending:c}=R(),d=()=>{const v=document.body;n=v.style.userSelect,v.style.userSelect="none",window.addEventListener("contextmenu",I),window.addEventListener("selectstart",I),window.addEventListener("touchstart",I),window.addEventListener("touchmove",I)},m=()=>{const v=document.body;v.style.userSelect=n,v.style.touchAction=t,v.style.overscrollBehavior=e,window.removeEventListener("contextmenu",I),window.removeEventListener("selectstart",I),window.removeEventListener("touchstart",I),window.removeEventListener("touchmove",I)},a=()=>{l&&(document.removeEventListener("pointermove",l),l=null),o&&(document.removeEventListener("pointerup",o),o=null),s&&(s=null),i&&(document.removeEventListener("wheel",i),i=null),g&&(document.removeEventListener("keydown",g),document.removeEventListener("keypress",g),document.removeEventListener("keyup",g),g=null)};return{handleDragStart:(v,h,p)=>{if(c.value)return;a(),v.target.blur(),p!=null&&p.container&&(u.component.value=p.container);const{activate:E,track:P,deactivate:C}=fe(h,p);o=()=>{C(!0).then(M=>{M!==!1&&(u.component.value=null,m(),C(!0),a())})},s=()=>{u.component.value=null,m(),C(!1),a()},l=M=>P(M),i=M=>P(M),g=M=>{M.type==="keyup"&&(M.code==="Escape"&&(s==null||s()),M.code==="Enter"&&(o==null||o())),P(M)},d(),E(v),document.addEventListener("pointermove",l),document.addEventListener("pointerup",o),document.addEventListener("wheel",i),document.addEventListener("keydown",g),document.addEventListener("keypress",g),document.addEventListener("keyup",g)}}}),me=n=>{const{id:t,elementRef:e,isDragging:l,isOvered:o,isAllowed:s,isLazyAllowed:i,registerElement:g,unregisterElement:u}=ie(n),{pointerPosition:c}=R(),{handleDragStart:d}=ge(),m=a=>d(a,e,n);return r.onMounted(g),r.onBeforeUnmount(u),{pointerPosition:c,elementRef:e,isDragging:l,isOvered:o,isAllowed:s,isLazyAllowed:i,handleDragStart:m,id:t}},pe=n=>{const{zonesMap:t,hovered:e,draggingElements:l,isDragging:o,handleDropZoneIntersection:s}=R(),i=r.ref(null),g=r.computed(()=>e.zone.value===i.value),u=r.computed(()=>{if(!i.value||!o.value)return!1;const a=t.value.get(i.value);return a!=null&&a.groups.length?!Array.from(l.value.values()).some(f=>f.groups.length?!f.groups.some(v=>a.groups.includes(v)):!1):!0}),c=r.computed(()=>{if(!i.value||!o.value||e.zone.value!==i.value)return!1;const a=t.value.get(i.value);return a!=null&&a.groups.length?!Array.from(l.value.values()).some(f=>!f.groups.some(v=>a.groups.includes(v))):!0});return{elementRef:i,registerZone:()=>{if(!i.value)throw new Error("elementRef is not set");s("add",i.value),t.value.set(i.value,{node:i.value,groups:(n==null?void 0:n.groups)??[],events:(n==null?void 0:n.events)??{},data:(n==null?void 0:n.data)??void 0}),i.value.setAttribute("data-dnd-droppable","true")},unregisterZone:()=>{i.value&&(s("remove",i.value),t.value.delete(i.value))},isOvered:g,isAllowed:u,isLazyAllowed:c}},he=n=>{const{elementRef:t,registerZone:e,unregisterZone:l,isOvered:o,isAllowed:s,isLazyAllowed:i}=pe(n);return r.onMounted(e),r.onBeforeUnmount(l),{elementRef:t,isOvered:o,isAllowed:s,isLazyAllowed:i}},ye=n=>{const{selectedElements:t,elementsMap:e}=R(),l=r.computed(()=>n.value?t.value.has(n.value):!1),o=r.computed(()=>{if(!n.value)return!1;for(const c of t.value)if(c&&T(c,n.value))return!0;return!1}),s=r.computed(()=>{if(!n.value)return!1;for(const c of t.value)if(c&&T(n.value,c))return!0;return!1}),i=()=>{n.value&&t.value.delete(n.value)},g=()=>{if(!(!n.value||!e.value.get(n.value))){if(o.value)for(const d of t.value)d&&T(d,n.value)&&t.value.delete(d);if(s.value)for(const d of t.value)d&&T(n.value,d)&&t.value.delete(d);t.value.add(n.value)}};return{handleUnselect:i,handleSelect:g,handleToggleSelect:()=>{n.value&&(t.value.has(n.value)?i():g())},isSelected:l,isParentOfSelected:o}};exports.DnDOperations=N;exports.default=se;exports.getBoundingBox=O;exports.useDnDStore=R;exports.useDragContainer=ne;exports.useDraggable=me;exports.useDroppable=he;exports.useSelection=ye;
|
|
1
|
+
"use strict";var re=Object.defineProperty;var ae=(n,t,e)=>t in n?re(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e;var Z=(n,t,e)=>ae(n,typeof t!="symbol"?t+"":t,e);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("vue"),q=require("@vueuse/core"),P=class P{};Z(P,"remove",(t,e)=>{if(!t||e===void 0)return;const[a]=t.splice(e,1);return a}),Z(P,"insert",(t,e,a)=>{!t||e===void 0||t.splice(e,0,a)}),Z(P,"move",(t,e,a,s)=>{if(!t||!a||e===void 0||s===void 0)return;const o=P.remove(t,e);P.insert(a,s,o)}),Z(P,"swap",(t,e,a,s)=>{if(!t||!a||e===void 0||s===void 0)return;const o=t[e],i=a[s];t[e]=i,a[s]=o}),Z(P,"copy",(t,e,a,s)=>{if(!t||e===void 0||!a||s===void 0)return;const o=t[e];P.insert(a,s,o)}),Z(P,"applyTransfer",t=>{var s,o,i,m,u,c,f;const e=t.hovered.element.value,a=t.hovered.zone.value;if(e){const g=(o=(s=t.elementsMap.value.get(e))==null?void 0:s.data)==null?void 0:o.source,l=(m=(i=t.elementsMap.value.get(e))==null?void 0:i.data)==null?void 0:m.index,v=t.draggingElements.value.values().next().value,d=(u=v==null?void 0:v.data)==null?void 0:u.index,p=d!==void 0&&l!==void 0&&d>l?1:-1;Array.from(t.draggingElements.value.values()).sort((h,S)=>{var L,D;return p*((((L=h.data)==null?void 0:L.index)||0)-(((D=S.data)==null?void 0:D.index)||0))}).forEach(h=>{var S,L;return P.move((S=h.data)==null?void 0:S.source,(L=h.data)==null?void 0:L.index,g,l)})}else if(a){const g=(f=(c=t.zonesMap.value.get(a))==null?void 0:c.data)==null?void 0:f.source,l=g==null?void 0:g.length;Array.from(t.draggingElements.value.values()).sort((d,p)=>{var w,h;return(((w=p.data)==null?void 0:w.index)||0)-(((h=d.data)==null?void 0:h.index)||0)}).forEach(d=>{var p,w;return P.move((p=d.data)==null?void 0:p.source,(w=d.data)==null?void 0:w.index,g,l)})}}),Z(P,"applyCopy",t=>{var s,o,i,m,u,c;const e=t.hovered.element.value,a=t.hovered.zone.value;if(e){const f=(o=(s=t.elementsMap.value.get(e))==null?void 0:s.data)==null?void 0:o.source,g=(m=(i=t.elementsMap.value.get(e))==null?void 0:i.data)==null?void 0:m.index;Array.from(t.draggingElements.value.values()).sort((v,d)=>{var p,w;return(((p=d.data)==null?void 0:p.index)||0)-(((w=v.data)==null?void 0:w.index)||0)}).forEach(v=>{var d,p;return P.copy((d=v.data)==null?void 0:d.source,(p=v.data)==null?void 0:p.index,f,g)})}else if(a){const f=(c=(u=t.zonesMap.value.get(a))==null?void 0:u.data)==null?void 0:c.source,g=f==null?void 0:f.length;Array.from(t.draggingElements.value.values()).sort((v,d)=>{var p,w;return(((p=d.data)==null?void 0:p.index)||0)-(((w=v.data)==null?void 0:w.index)||0)}).forEach(v=>{var d,p;return P.copy((d=v.data)==null?void 0:d.source,(p=v.data)==null?void 0:p.index,f,g)})}}),Z(P,"applySwap",t=>{var s,o,i,m,u,c,f,g;const e=t.hovered.element.value,a=t.hovered.zone.value;if(e&&t.draggingElements.value.size===1){const l=t.draggingElements.value.values().next().value;P.swap((s=l==null?void 0:l.data)==null?void 0:s.source,(o=l==null?void 0:l.data)==null?void 0:o.index,(m=(i=t.elementsMap.value.get(e))==null?void 0:i.data)==null?void 0:m.source,(c=(u=t.elementsMap.value.get(e))==null?void 0:u.data)==null?void 0:c.index)}else if(a){const l=(g=(f=t.zonesMap.value.get(a))==null?void 0:f.data)==null?void 0:g.source,v=l==null?void 0:l.length;Array.from(t.draggingElements.value.values()).sort((p,w)=>{var h,S;return(((h=w.data)==null?void 0:h.index)||0)-(((S=p.data)==null?void 0:S.index)||0)}).forEach(p=>{var w,h;return P.move((w=p.data)==null?void 0:w.source,(h=p.data)==null?void 0:h.index,l,v)})}}),Z(P,"applyRemove",t=>{Array.from(t.draggingElements.value.values()).sort((a,s)=>{var o,i;return(((o=s.data)==null?void 0:o.index)||0)-(((i=a.data)==null?void 0:i.index)||0)}).forEach(a=>{var s,o;(s=a.data)!=null&&s.source&&((o=a.data)==null?void 0:o.index)!==void 0&&P.remove(a.data.source,a.data.index)})}),Z(P,"applyInsert",(t,e)=>{var o,i,m,u,c,f;const a=t.hovered.element.value,s=t.hovered.zone.value;if(a&&e.length>0){const g=(i=(o=t.elementsMap.value.get(a))==null?void 0:o.data)==null?void 0:i.source,l=(u=(m=t.elementsMap.value.get(a))==null?void 0:m.data)==null?void 0:u.index;e.forEach(v=>{P.insert(g,l,v)})}else if(s){const g=(f=(c=t.zonesMap.value.get(s))==null?void 0:c.data)==null?void 0:f.source,l=g==null?void 0:g.length;e.forEach(v=>{P.insert(g,l,v)})}});let G=P;const T=q.createGlobalState(()=>{const n=r.shallowRef(!1),t=r.ref(new Map),e=r.computed(()=>t.value.size>0),a={component:r.ref(null),ref:r.shallowRef(null),options:r.shallowRef(null),animating:{enter:r.shallowRef(!1),leave:r.shallowRef(!1),appear:r.shallowRef(!1)}},s=r.ref(new Map),o=r.ref(new Set),i=r.ref(new Map),m=r.shallowRef(new Set),u=r.shallowRef(new Set),c=typeof window<"u"&&"IntersectionObserver"in window,f=c?new IntersectionObserver(x=>{x.forEach(y=>u.value[y.isIntersecting?"add":"delete"](y.target))}):null,g=c?new IntersectionObserver(x=>{x.forEach(y=>m.value[y.isIntersecting?"add":"delete"](y.target))}):null,l=(x,y)=>{f&&(x==="add"?f.observe(y):(f.unobserve(y),u.value.delete(y)))},v=(x,y)=>{g&&(x==="add"?g.observe(y):(g.unobserve(y),m.value.delete(y)))},d={start:r.shallowRef(null),current:r.shallowRef(null),offset:{percent:r.shallowRef(null),pixel:r.shallowRef(null)}},{KeyW:p,KeyS:w,KeyA:h,KeyD:S,ctrl:L,shift:D,alt:O,meta:C}=q.useMagicKeys(),M={zone:r.shallowRef(null),element:r.shallowRef(null)};return{draggingElements:t,isDragging:e,activeContainer:a,elementsMap:s,selectedElements:o,zonesMap:i,visibleZones:m,visibleElements:u,pointerPosition:d,keyboard:{w:p,s:w,a:h,d:S,ctrl:L,shift:D,alt:O,meta:C},hovered:M,isPending:n,handleDragElementIntersection:l,handleDropZoneIntersection:v}}),ne=n=>{const t=r.ref(null),{draggingElements:e,pointerPosition:a,isDragging:s,activeContainer:o}=T();return r.onMounted(()=>{o.ref=t,o.options.value=n??null}),r.onUnmounted(()=>{o.ref.value=null,o.options.value=null}),{elementRef:t,draggingElements:e,pointerPosition:a,isDragging:s,animating:o.animating}},le=["innerHTML"],se=r.defineComponent({__name:"DefaultOverlay",props:{styles:{}},setup(n){const{elementRef:t,pointerPosition:e,isDragging:a,draggingElements:s}=ne(),o=r.computed(()=>{var i,m,u,c;return{transform:`translate3d(${(((i=e.current.value)==null?void 0:i.x)??0)-(((m=e.offset.pixel.value)==null?void 0:m.x)??0)}px, ${(((u=e.current.value)==null?void 0:u.y)??0)-(((c=e.offset.pixel.value)==null?void 0:c.y)??0)}px, 0)`,zIndex:1e3,position:"fixed",top:0,left:0,transition:"0.3s cubic-bezier(0.165, 0.84, 0.44, 1)",...n.styles}});return(i,m)=>r.unref(a)?(r.openBlock(),r.createElementBlock("div",{key:0,ref_key:"elementRef",ref:t,style:r.normalizeStyle(o.value)},[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(r.unref(s),([u,c])=>{var f,g;return r.openBlock(),r.createElementBlock(r.Fragment,{key:c.id},[c.layer?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(c.layer),{key:0,node:u,data:c.data,id:c.id,groups:c.groups},null,8,["node","data","id","groups"])):(r.openBlock(),r.createElementBlock("div",{key:1,innerHTML:c.initialHTML,style:r.normalizeStyle({width:`${(f=c.initialRect)==null?void 0:f.width}px`,height:`${(g=c.initialRect)==null?void 0:g.height}px`})},null,12,le))],64)}),128))],4)):r.createCommentVNode("",!0)}}),W=r.defineComponent({__name:"DragOverlay",props:{styles:{}},setup(n){const t=n,{activeContainer:e}=T(),a=r.computed(()=>({component:e.component.value??se,props:t}));return(s,o)=>r.unref(e).options.value?(r.openBlock(),r.createBlock(r.Transition,{key:0,name:r.unref(e).options.value.name,duration:r.unref(e).options.value.duration,"enter-from-class":r.unref(e).options.value.enterFromClass,"enter-to-class":r.unref(e).options.value.enterToClass,"enter-active-class":r.unref(e).options.value.enterActiveClass,"leave-from-class":r.unref(e).options.value.leaveFromClass,"leave-to-class":r.unref(e).options.value.leaveToClass,"leave-active-class":r.unref(e).options.value.leaveActiveClass,"appear-active-class":r.unref(e).options.value.appearActiveClass,"appear-from-class":r.unref(e).options.value.appearFromClass,"appear-to-class":r.unref(e).options.value.appearToClass,mode:r.unref(e).options.value.mode,type:r.unref(e).options.value.type,css:r.unref(e).options.value.css,appear:!0,persisted:r.unref(e).options.value.persisted,onEnter:r.unref(e).options.value.onEnter,onLeave:r.unref(e).options.value.onLeave,onBeforeEnter:r.unref(e).options.value.onBeforeEnter,onBeforeLeave:r.unref(e).options.value.onBeforeLeave,onBeforeAppear:r.unref(e).options.value.onBeforeAppear,onAfterEnter:r.unref(e).options.value.onAfterEnter,onAfterLeave:r.unref(e).options.value.onAfterLeave,onAfterAppear:r.unref(e).options.value.onAfterAppear},{default:r.withCtx(()=>[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(a.value.component||a.value),r.normalizeProps(r.guardReactiveProps(a.value.props||{})),null,16))]),_:1},8,["name","duration","enter-from-class","enter-to-class","enter-active-class","leave-from-class","leave-to-class","leave-active-class","appear-active-class","appear-from-class","appear-to-class","mode","type","css","persisted","onEnter","onLeave","onBeforeEnter","onBeforeLeave","onBeforeAppear","onAfterEnter","onAfterLeave","onAfterAppear"])):(r.openBlock(),r.createBlock(r.resolveDynamicComponent(a.value.component||a.value),r.normalizeProps(r.mergeProps({key:1},a.value.props||{})),null,16))}}),oe={install(n,t){n.component("DragOverlay",W);const e=n.mount;n.mount=function(s){var m;const o=e.call(this,s),i=typeof s=="string"?document.querySelector(s):s;if(i&&i instanceof Element&&!i.querySelector("#vue-dnd-kit-overlay")){const u=document.createElement("div");u.id="vue-dnd-kit-overlay",u.style.pointerEvents="none",i.appendChild(u);const c=r.createVNode(W,{styles:(m=t==null?void 0:t.defaultOverlay)==null?void 0:m.styles});r.render(c,u),n.__VUE_DND_KIT_OVERLAY__={container:u,vnode:c,options:(t==null?void 0:t.defaultOverlay)||{}};const f=T();n.__VUE_DND_KIT_STORE__=f}return o};const a=n.unmount;n.unmount=function(){return n.__VUE_DND_KIT_OVERLAY__&&(r.render(null,n.__VUE_DND_KIT_OVERLAY__.container),delete n.__VUE_DND_KIT_OVERLAY__),a.call(this)}}},J=(n,t)=>n.x<t.x+t.width&&n.x+n.width>t.x&&n.y<t.y+t.height&&n.y+n.height>t.y,H=n=>{if(!n)return{x:0,y:0,width:0,height:0,bottom:0,left:0,right:0,top:0};const t=n.getBoundingClientRect();return{bottom:t.bottom,left:t.left,right:t.right,top:t.top,x:t.x,y:t.y,width:t.width,height:t.height}},$=n=>({x:n.x+n.width/2,y:n.y+n.height/2}),ue=(n,t)=>{const e=H(n);return{pixel:{x:t.x-e.x,y:t.y-e.y},percent:{x:(t.x-e.x)/e.width*100,y:(t.y-e.y)/e.height*100}}},Q=(n,t)=>{const e=t.x-n.x,a=t.y-n.y;return Math.sqrt(e*e+a*a)},ee=(n,t)=>{const e=Math.max(0,Math.min(n.x+n.width,t.x+t.width)-Math.max(n.x,t.x)),a=Math.max(0,Math.min(n.y+n.height,t.y+t.height)-Math.max(n.y,t.y)),s=e*a,o=n.width*n.height,i=t.width*t.height;return(s/o*100+s/i*100)/2},te="data-vue-dnd-kit-draggable",B=n=>{n.preventDefault()},Y=n=>({items:Array.from(n.draggingElements.value.values())}),ie=n=>{const{elementsMap:t,draggingElements:e,hovered:a,selectedElements:s,isDragging:o,visibleElements:i,handleDragElementIntersection:m}=T(),u=r.ref(null),c=r.computed(()=>a.element.value===u.value),f=r.shallowRef((n==null?void 0:n.id)||r.useId()),g=r.shallowRef((n==null?void 0:n.disabled)??!1),l=r.computed(()=>g.value||!u.value||!t.value.has(u.value)?!1:e.value.has(u.value)),v=r.computed(()=>{if(g.value||!u.value||!o.value||!i.value.has(u.value))return!1;const h=t.value.get(u.value);return h!=null&&h.groups.length?!Array.from(e.value.entries()).some(([S,L])=>L.groups.length?!L.groups.some(D=>h.groups.includes(D)):!1):!0}),d=r.computed(()=>{if(g.value||!u.value||!o.value||!i.value.has(u.value)||a.element.value!==u.value)return!1;const h=t.value.get(u.value);return h!=null&&h.groups.length?!Array.from(e.value.entries()).some(([S,L])=>L.groups.length?!L.groups.some(D=>h.groups.includes(D)):!1):!0});return{elementRef:u,registerElement:()=>{if(!u.value)throw new Error("ElementRef is not set");t.value.set(u.value,{node:u.value,groups:(n==null?void 0:n.groups)??[],layer:(n==null?void 0:n.layer)??null,defaultLayer:(n==null?void 0:n.layer)??null,events:(n==null?void 0:n.events)??{},data:(n==null?void 0:n.data)??null,id:f.value,disabled:g??!1}),m("add",u.value),u.value.addEventListener("dragstart",B),u.value.addEventListener("drag",B),u.value.setAttribute(te,"true"),u.value.setAttribute("draggable","false")},unregisterElement:()=>{u.value&&(t.value.delete(u.value),s.value.delete(u.value),u.value.removeEventListener("dragstart",B),u.value.removeEventListener("drag",B),u.value.removeAttribute(te),u.value.removeAttribute("draggable"))},isDragging:l,isOvered:c,isAllowed:v,isLazyAllowed:d,id:f}},k=(n,t)=>n?t.contains(n):!1,ce=n=>{var f,g;const t=H(n.activeContainer.ref.value),e=$(t),a=((f=n.pointerPosition.current.value)==null?void 0:f.x)??0,s=((g=n.pointerPosition.current.value)==null?void 0:g.y)??0,i=!(t&&a>=t.x&&a<=t.x+t.width&&s>=t.y&&s<=t.y+t.height),m=Array.from(n.draggingElements.value.keys()),u=Array.from(n.visibleElements.value.entries()).filter(([l,v])=>{if(!l)return!1;const d=H(l);return d&&t&&J(d,t)}).map(([l,v])=>{const d=H(l),p=$(d),w=a>=d.x&&a<=d.x+d.width&&s>=d.y&&s<=d.y+d.height,h=ee(d,t),S=Q(e,p);let L=0;for(const[D,O]of n.visibleElements.value.entries())D!==l&&D&&l&&k(l,D)&&L++;return{element:v,node:l,isPointerInElement:w,overlapPercent:h,depth:L,centerDistance:S}}).sort((l,v)=>{if(!i){if(l.isPointerInElement&&v.isPointerInElement)return v.depth-l.depth;if(l.isPointerInElement!==v.isPointerInElement)return l.isPointerInElement?-1:1}return Math.abs(l.overlapPercent-v.overlapPercent)<=1?l.centerDistance-v.centerDistance:v.overlapPercent-l.overlapPercent}),c=Array.from(n.visibleZones.value.entries()).filter(([l,v])=>{if(!l||m.some(p=>p&&k(l,p)))return!1;const d=H(l);return d&&t&&J(d,t)}).map(([l,v])=>{const d=H(l),p=$(d),w=a>=d.x&&a<=d.x+d.width&&s>=d.y&&s<=d.y+d.height,h=ee(d,t),S=Q(e,p);let L=0;for(const[D,O]of n.visibleZones.value.entries())D!==l&&D&&l&&k(l,D)&&L++;return{zone:v,node:l,isPointerInElement:w,overlapPercent:h,depth:L,centerDistance:S}}).sort((l,v)=>{if(!i){if(l.isPointerInElement&&v.isPointerInElement)return v.depth-l.depth;if(l.isPointerInElement!==v.isPointerInElement)return l.isPointerInElement?-1:1}return Math.abs(l.overlapPercent-v.overlapPercent)<=1?l.centerDistance-v.centerDistance:v.overlapPercent-l.overlapPercent});return[...u.map(l=>l.node),...c.map(l=>l.node)]},ve=(n,t)=>{const{pointerPosition:e,keyboard:a}=T(),s=(t==null?void 0:t.moveStep)||10;return{onKeyboardStart:u=>{var l;B(u);const c=H(n.value);(l=n.value)==null||l.blur();const f=c.x+c.width/2,g=c.y+c.height/2;e.start.value={x:f,y:g},e.current.value={x:f,y:g},e.offset.pixel.value={x:c.width/2,y:c.height/2},e.offset.percent.value={x:50,y:50}},onKeyboardMove:()=>{if(!e.current.value)return;const u=e.current.value.x,c=e.current.value.y;let f=u,g=c;a.w.value&&(g-=s),a.s.value&&(g+=s),a.a.value&&(f-=s),a.d.value&&(f+=s),e.current.value={x:f,y:g}},onKeyboardEnd:()=>{e.current.value=null,e.start.value=null,e.offset.pixel.value=null,e.offset.percent.value=null}}},de=n=>{const t=T();return{onPointerStart:o=>{t.pointerPosition.start.value={x:o.clientX,y:o.clientY},t.pointerPosition.current.value={x:o.clientX,y:o.clientY};const{pixel:i,percent:m}=ue(n.value,{x:o.clientX,y:o.clientY});t.pointerPosition.offset.pixel.value=i,t.pointerPosition.offset.percent.value=m},onPointerMove:o=>{t.isPending.value||(t.pointerPosition.current.value={x:o.clientX,y:o.clientY})},onPointerEnd:()=>{t.pointerPosition.current.value=null,t.pointerPosition.start.value=null,t.pointerPosition.offset.pixel.value=null,t.pointerPosition.offset.percent.value=null}}},fe=(n,t)=>{var O,C;const e=T(),{onPointerStart:a,onPointerMove:s,onPointerEnd:o}=de(n),{onKeyboardStart:i,onKeyboardMove:m,onKeyboardEnd:u}=ve(n,t==null?void 0:t.keyboard);let c=null;const f=M=>{var I,z;if(!M)return new Map;const x=e.selectedElements.value.has(M);if(e.selectedElements.value.size>0&&x){const U=new Map;return e.selectedElements.value.forEach(X=>{var A,_;const E=e.elementsMap.value.get(X);E&&U.set(X,{...E,initialHTML:((A=E.node)==null?void 0:A.outerHTML)??"",initialRect:(_=E.node)==null?void 0:_.getBoundingClientRect()})}),U}e.selectedElements.value.clear();const y=e.elementsMap.value.get(M);if(!y)return new Map;const b=new Map;return b.set(M,{...y,initialHTML:((I=y.node)==null?void 0:I.outerHTML)??"",initialRect:(z=y.node)==null?void 0:z.getBoundingClientRect()}),b},g=M=>{if(!M)return{element:null,zone:null};const x=Array.isArray(M)?M:[M],y=Array.from(e.draggingElements.value.keys()),b=Array.from(e.zonesMap.value.entries()).flatMap(([E,A])=>A.disabled?[E]:[]),I=Array.from(e.elementsMap.value.entries()).flatMap(([E,A])=>A.disabled?[E]:[]),z=x.find(E=>{if(!e.visibleZones.value.has(E))return!1;const A=e.zonesMap.value.get(E);return!(!A||A.disabled||b.some(K=>E===K||k(E,K))||y.some(K=>K&&(K===A.node||k(A.node,K)))||A.groups.length&&!!Array.from(e.draggingElements.value.values()).some(V=>V.groups.length?!V.groups.some(R=>A.groups.includes(R)):!1))});return z?{element:x.filter(E=>{if(!e.visibleElements.value.has(E)||!e.elementsMap.value.has(E))return!1;const A=e.elementsMap.value.get(E);if(A!=null&&A.disabled)return!1;const _=b.some(R=>E===R||k(E,R)),K=I.some(R=>E===R||k(E,R));return _||K?!1:!Array.from(e.draggingElements.value.values()).some(R=>R.groups.length?!R.groups.some(N=>{var F;return(F=e.elementsMap.value.get(E))==null?void 0:F.groups.includes(N)}):!1)}).find(E=>y.some(_=>_&&(_===E||k(E,_)||k(_,E)))?!1:E===z||k(E,z))||null,zone:z}:{element:null,zone:null}},l=((O=t==null?void 0:t.sensor)==null?void 0:O.setup)||ce,v=M=>{var z,U,X,E,A,_,K,V,R,N,F,j;const x=e.hovered.element.value,y=e.hovered.zone.value,b=M.element,I=M.zone;e.hovered.element.value=b,e.hovered.zone.value=I,x!==b&&(x&&((X=(U=(z=e.elementsMap.value.get(x))==null?void 0:z.events)==null?void 0:U.onLeave)==null||X.call(U,e,Y(e))),b&&((_=(A=(E=e.elementsMap.value.get(b))==null?void 0:E.events)==null?void 0:A.onHover)==null||_.call(A,e,Y(e)))),y!==I&&(y&&((R=(V=(K=e.zonesMap.value.get(y))==null?void 0:K.events)==null?void 0:V.onLeave)==null||R.call(V,e,Y(e))),I&&((j=(F=(N=e.zonesMap.value.get(I))==null?void 0:N.events)==null?void 0:F.onHover)==null||j.call(F,e,Y(e))))},d=q.useThrottleFn(()=>{const M=l(e),x=g(M);v(x)},((C=t==null?void 0:t.sensor)==null?void 0:C.throttle)??0),p=()=>{d(),c=requestAnimationFrame(p)},w=()=>p(),h=()=>{c!==null&&(o(),u(),cancelAnimationFrame(c),c=null)};return{activate:M=>{e.draggingElements.value=f(n.value),e.draggingElements.value.forEach(x=>{var y,b;return(b=(y=x.events).onStart)==null?void 0:b.call(y,e,Y(e))}),M instanceof PointerEvent?a(M):i(M),w()},track:M=>{e.draggingElements.value.forEach(x=>{var y,b;return(b=(y=x.events).onMove)==null?void 0:b.call(y,e,Y(e))}),M instanceof KeyboardEvent?m():s(M)},deactivate:async(M=!0)=>{var x,y;if(e.hovered.zone.value){const b=e.zonesMap.value.get(e.hovered.zone.value),I=(y=b==null?void 0:(x=b.events).onDrop)==null?void 0:y.call(x,e,Y(e));if(I instanceof Promise)try{e.isPending.value=!0;const z=await I;return z&&(M&&e.selectedElements.value.clear(),e.draggingElements.value.clear(),e.hovered.zone.value=null,e.hovered.element.value=null,h()),z}catch{return!1}finally{e.isPending.value=!1}else M&&e.selectedElements.value.clear(),e.draggingElements.value.clear(),e.hovered.zone.value=null,e.hovered.element.value=null,h()}else e.draggingElements.value.forEach(b=>{var I,z;return(z=(I=b.events).onEnd)==null?void 0:z.call(I,e,Y(e))}),M&&e.selectedElements.value.clear(),e.draggingElements.value.clear(),e.hovered.zone.value=null,e.hovered.element.value=null,h()}}},ge=q.createGlobalState(()=>{let n="",t="",e="",a=null,s=null,o=null,i=null,m=null;const{activeContainer:u,isPending:c,elementsMap:f}=T(),g=()=>{const p=document.body;n=p.style.userSelect,p.style.userSelect="none",window.addEventListener("contextmenu",B),window.addEventListener("selectstart",B),window.addEventListener("touchstart",B),window.addEventListener("touchmove",B)},l=()=>{const p=document.body;p.style.userSelect=n,p.style.touchAction=t,p.style.overscrollBehavior=e,window.removeEventListener("contextmenu",B),window.removeEventListener("selectstart",B),window.removeEventListener("touchstart",B),window.removeEventListener("touchmove",B)},v=()=>{a&&(document.removeEventListener("pointermove",a),a=null),s&&(document.removeEventListener("pointerup",s),s=null),o&&(o=null),i&&(document.removeEventListener("wheel",i),i=null),m&&(document.removeEventListener("keydown",m),document.removeEventListener("keypress",m),document.removeEventListener("keyup",m),m=null)};return{handleDragStart:(p,w,h)=>{if(!w.value||c.value)return;const S=f.value.get(w.value);if(S!=null&&S.disabled)return;v(),p.target.blur(),h!=null&&h.container&&(u.component.value=h.container);const{activate:L,track:D,deactivate:O}=fe(w,h);s=()=>{O(!0).then(C=>{C!==!1&&(u.component.value=null,l(),O(!0),v())})},o=()=>{u.component.value=null,l(),O(!1),v()},a=C=>D(C),i=C=>D(C),m=C=>{C.type==="keyup"&&(C.code==="Escape"&&(o==null||o()),C.code==="Enter"&&(s==null||s())),D(C)},g(),L(p),document.addEventListener("pointermove",a),document.addEventListener("pointerup",s),document.addEventListener("wheel",i),document.addEventListener("keydown",m),document.addEventListener("keypress",m),document.addEventListener("keyup",m)}}}),me=n=>{const{id:t,elementRef:e,isDragging:a,isOvered:s,isAllowed:o,isLazyAllowed:i,registerElement:m,unregisterElement:u}=ie(n),{pointerPosition:c}=T(),{handleDragStart:f}=ge(),g=l=>f(l,e,n);return r.onMounted(m),r.onBeforeUnmount(u),{pointerPosition:c,elementRef:e,isDragging:a,isOvered:s,isAllowed:o,isLazyAllowed:i,handleDragStart:g,id:t}},pe=n=>{const{zonesMap:t,hovered:e,draggingElements:a,isDragging:s,handleDropZoneIntersection:o}=T(),i=r.ref(null),m=r.computed(()=>e.zone.value===i.value),u=r.computed(()=>{if(!i.value||!s.value)return!1;const l=t.value.get(i.value);return l!=null&&l.groups.length?!Array.from(a.value.values()).some(v=>v.groups.length?!v.groups.some(d=>l.groups.includes(d)):!1):!0}),c=r.computed(()=>{if(!i.value||!s.value||e.zone.value!==i.value)return!1;const l=t.value.get(i.value);return l!=null&&l.groups.length?!Array.from(a.value.values()).some(v=>!v.groups.some(d=>l.groups.includes(d))):!0});return{elementRef:i,registerZone:()=>{if(!i.value)throw new Error("elementRef is not set");o("add",i.value),t.value.set(i.value,{node:i.value,groups:(n==null?void 0:n.groups)??[],events:(n==null?void 0:n.events)??{},data:(n==null?void 0:n.data)??void 0,disabled:(n==null?void 0:n.disabled)??!1}),i.value.setAttribute("data-dnd-droppable","true")},unregisterZone:()=>{i.value&&(o("remove",i.value),t.value.delete(i.value))},isOvered:m,isAllowed:u,isLazyAllowed:c}},he=n=>{const{elementRef:t,registerZone:e,unregisterZone:a,isOvered:s,isAllowed:o,isLazyAllowed:i}=pe(n);return r.onMounted(e),r.onBeforeUnmount(a),{elementRef:t,isOvered:s,isAllowed:o,isLazyAllowed:i}},ye=n=>{const{selectedElements:t,elementsMap:e}=T(),a=r.computed(()=>n.value?t.value.has(n.value):!1),s=r.computed(()=>{if(!n.value)return!1;for(const c of t.value)if(c&&k(c,n.value))return!0;return!1}),o=r.computed(()=>{if(!n.value)return!1;for(const c of t.value)if(c&&k(n.value,c))return!0;return!1}),i=()=>{n.value&&t.value.delete(n.value)},m=()=>{if(!(!n.value||!e.value.get(n.value))){if(s.value)for(const f of t.value)f&&k(f,n.value)&&t.value.delete(f);if(o.value)for(const f of t.value)f&&k(n.value,f)&&t.value.delete(f);t.value.add(n.value)}};return{handleUnselect:i,handleSelect:m,handleToggleSelect:()=>{n.value&&(t.value.has(n.value)?i():m())},isSelected:a,isParentOfSelected:s}};exports.DnDOperations=G;exports.default=oe;exports.getBoundingBox=H;exports.useDnDStore=T;exports.useDragContainer=ne;exports.useDraggable=me;exports.useDroppable=he;exports.useSelection=ye;
|
|
2
2
|
//# sourceMappingURL=vue-dnd-kit-core.cjs.js.map
|