amotify
Version:
UI Component for React,NextJS,esbuild
2 lines (1 loc) • 3.94 kB
JavaScript
import{b as m,c as h,d as S}from"../chunk-C5N2D3ZX.js";import{jsx as A}from"react/jsx-runtime";import t from"jmini";import{Box as I}from"../atoms";import{Config as b}from".";import{DragEffectClasses as e}from"../@styles/componentClasses";const L={Start:(l,a,r)=>{a=m({horizontal:!0,vertical:!0,autoScroll:!0},a);let o=a.dragElement.cloneNode(!0),n=t(o),i=t.getCursor(a.startEvent),s=t.getScreenSize();n.addClass(e("Clone")).css({top:i.y-s.scrollY+8,left:i.x-s.scrollX+8}),t("html").addClass(e("preventScroll")),t(["."+e("DropArea"),`[data-drag-type="${l}"]`].join("")).addClass(e("isDroppable")),t(["."+e("DropArea"),`[data-drag-type="${l}"]`,`[data-drag-id="${a.originId}"]`].join("")).addClass(e("Origin")),t(["."+e("onDragging"),`[data-drag-type="${l}"]`].join("")).addClass(e("isActive")),t(b.get().appRoot).append(o).addClass(e("isDragging")).await(10).callback(()=>{n.addClass(e("isHovering"))});let d;const c=g=>{g.preventDefault(),g.stopPropagation();let p=t.getCursor(g),u=t.getScreenSize(),x=p.x-u.scrollX,C=p.y-u.scrollY,D=document.elementFromPoint(x,C),v=p.y-u.scrollY+8,y=p.x-u.scrollX+8;n.css(m(m({},a.horizontal&&{left:y}),a.vertical&&{top:v})),L.AutoScroll(g);let f=t(D).parent(["."+e("DropArea"),`[data-drag-type=${l}]`].join(""));if(t("."+e("onLanding")).removeClass(e("isLanding"),e("isActive")),!f[0]||(t("."+e("onLastLanding")).removeClass(e("isLanding"),e("isActive")),!f[0]))return;let{dragId:E,dragIdx:N,dragGroup:j}=f[0].dataset;if(f.addClass(e("isLanding")),t(["."+e("DropSign"),`[data-drag-type="${l}"]`,`[data-drag-id="${E}"]`].join("")).addClass(e("isActive")),d!=E)return d=E,t.interval.once(()=>{r({idx:Number(N||0),id:E,groupId:String(j||""),end:!1,onDropArea:!!f[0]})},30,"dragEffect.delay"),!1},R=g=>{t("html").removeClass(e("preventScroll")),t("."+e("DropArea")).removeClass(e("isDroppable"));let p=t.getCursor(g),u=t.getScreenSize(),x=p.x-u.scrollX,C=p.y-u.scrollY,D=document.elementFromPoint(x,C);t(b.get().appRoot).removeClass(e("isDragging")),n.removeClass(e("isHovering")).await(300).remove(),t("."+e("DropArea")).removeClass(e("isLanding"),e("Origin")),t("."+e("DropSign")).removeClass(e("isActive")),t.interval.abort("AutoScroll"),t(window).removeEvent(["dragEffect.touchmove","dragEffect.pointermove","dragEffect.pointerup"]);let v=t(D).parent(`[data-drag-type=${l}]`)[0],{dragId:y,dragIdx:f,dragGroup:E}=(v==null?void 0:v.dataset)||{};t.interval.once(()=>{r({idx:Number(f||0),id:y!=null?y:d,groupId:String(E||""),end:!0,onDropArea:!!v})},50,"dragEffect.delay")};t(window).onEvent("touchmove",g=>(g.preventDefault(),g.stopPropagation(),!1),{eventID:"dragEffect.touchmove",passive:!1}).onEvent("pointermove",c,{eventID:"dragEffect.pointermove",passive:!1}).onEvent("pointerup",R,{eventID:"dragEffect.pointerup"})},AutoScroll:l=>{t.interval.abort("AutoScroll");let a=t("html")[0],r=t.getScreenSize(),o=t.getCursor(l),n=(o.y-r.scrollY)/r.height,i=(o.x-r.scrollX)/r.width,s=r.height/100/2,d=null,c=null;t.scope(()=>{n<=.1&&(d=s*-1),n>=.9&&(d=s)}),t.scope(()=>{i<=.1&&(c=s*-1),i>=.9&&(c=s)}),!(t.isNullish(d)&&t.isNullish(c))&&t.interval.start(()=>{c&&(a.scrollLeft+=c),d&&(a.scrollTop+=d)},10,"AutoScroll")},styles:e,DropArea:function(l){let n=l,{jsxElement:a=I,dragInfo:r}=n,o=S(n,["jsxElement","dragInfo"]);return r.disabled?A(a,m({},o)):A(a,h(m({transition:"short",position:"relative"},o),{"data-drag-type":r.type,"data-drag-group":r.group||null,"data-drag-id":r.id||null,"data-drag-idx":r.idx||0,className:[e("DropArea"),e("on"+(r.activeOn||"landing").toCapital()),e("Marker_"+(r.marker||"bottom")),(o==null?void 0:o.className)||""].join(" ")}))},DropSign:function(l){let s=l,{jsxElement:a=I,dragInfo:{type:r,id:o,activeOn:n="landing"}}=s,i=S(s,["jsxElement","dragInfo"]);return A(a,h(m({transition:"short"},i),{"data-drag-type":r,"data-drag-id":o||null,className:[e("DropSign"),n=="always"&&e("isActive"),e("on"+n.toCapital()),(i==null?void 0:i.className)||""].join(" ")}))}};export{L as dragEffect};