vue-devui/dragdrop/index.umd.js

DevUI components based on Vite and Vue3

(function(u,p){typeof exports=="object"&&typeof module!="undefined"?p(exports):typeof define=="function"&&define.amd?define(["exports"],p):(u=typeof globalThis!="undefined"?globalThis:u||self,p(u.index={}))})(this,function(u){"use strict";var p={},S={};function i(e,t){const a=Element.prototype;return(a.matchesSelector||a.mozMatchesSelector||a.msMatchesSelector||a.oMatchesSelector||a.webkitMatchesSelector||function(l){const v=this,h=(v.document||v.ownerDocument).querySelectorAll(l);let D=h.length;for(;--D>=0&&h.item(D)!==v;);return D>-1}).call(e,t)}var n={mounted(e,t){let a,c,l,v,h;const D=()=>{var r,s;if((r=t==null?void 0:t.value)==null?void 0:r.handle){const o=(s=t==null?void 0:t.value)==null?void 0:s.handle;let f=v;for(;f!==e;){if(i(f,o))return!0;f=f.parentNode}return!1}return!0},x=r=>{let s=-1,o=r.target;for(;o!==e;)o.parentNode===e&&(s=Array.from(e.children).indexOf(o)),o=o.parentNode;return s},E=()=>{var r;return((r=t==null?void 0:t.value)==null?void 0:r.dragClass)||"devui-drag-item"},m=(r,s)=>{(t==null?void 0:t.value[r])&&(t==null||t.value[r](s))};e.addEventListener("mouseover",r=>{v=r.target}),Array.from(e.children).forEach(r=>{r.setAttribute("draggable","true"),r.addEventListener("dragstart",s=>{D()?(h=!1,a=r,c=Array.from(e.children).indexOf(a),setTimeout(()=>{a.classList.add(E())})):(s.preventDefault(),s.stopPropagation()),m("dragStart",s)})}),e.addEventListener("dragenter",function(r){m("dragEnter",r)}),e.addEventListener("dragover",function(r){var f,d;const s=Array.from(e.children).indexOf(a),o=x(r);s!==-1&&o!==-1&&(s>o?(e.removeChild(a),e.insertBefore(a,e.children[o]),l=o):s<o&&(e.removeChild(a),e.children[o]?(e.insertBefore(a,e.children[o]),l=o):(e.appendChild(a),l=e.children.length-1)),((f=t==null?void 0:t.value)==null?void 0:f.dragover)&&((d=t==null?void 0:t.value)==null||d.dragover(r))),r.preventDefault(),m("dragOver",r)}),e.addEventListener("dragleave",function(r){m("dragLeave",r)}),e.addEventListener("drop",function(r){var s,o,f;if(h=!0,(s=t==null?void 0:t.value)==null?void 0:s.list){const d=(o=t==null?void 0:t.value)==null?void 0:o.list,L=d[c];d.splice(c,1),d.splice(l,0,L),((f=t==null?void 0:t.value)==null?void 0:f.drop)&&m("drop",{event:r,list:d,fromIndex:c,targetIndex:l})}}),e.addEventListener("dragend",function(r){h||c!==-1&&l!==-1&&(l>c?(e.removeChild(a),e.insertBefore(a,e.children[c])):c>l&&(e.removeChild(a),e.children[c]?e.insertBefore(a,e.children[c]):e.appendChild(a))),c=-1,l=-1,setTimeout(()=>{a.classList.remove(E())}),m("dragEnd",r)})}},y={title:"Dragdrop \u62D6\u62FD",category:"\u6F14\u8FDB\u4E2D",status:"100%",install(e){e.directive("DSortable",n)}};u.DraggableDirective=p,u.DroppableDirective=S,u.SortableDirective=n,u.default=y,Object.defineProperty(u,"__esModule",{value:!0}),u[Symbol.toStringTag]="Module"});