amotify/dist/fn/SwipeView.js

UI Component for React,NextJS,esbuild

import{b as w,c as m,d as D}from"../chunk-C5N2D3ZX.js";import{jsx as g}from"react/jsx-runtime";import p,{UUID as N}from"jmini";import{useState as V,useEffect as k,useRef as X}from"react";import{$$fromRoot as y}from"../@utils";import{Box as L,Flex as j}from"../atoms";import{LayoutClasses as l}from"../@styles/componentClasses";const _=t=>{let M=t,{options:{onSlideCallback:e,visibilitySurroundSlide:c=!0,autoSwipems:o=0,loop:s=!1,disableMousedrag:n=!1,disableTouch:a=!1}={},wrapper:i=r=>r,slides:S=[],slideIndex:B}=M,E=D(M,["options","wrapper","slides","slideIndex"]),[h]=V(N()),[d,b]=V({eventType:"init",index:t.slideIndex});const T=X(!1);k(()=>{b({eventType:"usr",index:t.slideIndex}),T.current||(T.current=!0)},[t.slideIndex]),k(()=>{let r=d.index+(s?1:0),v=p.isOneOf(d.index,-1,S.length);v||e&&setTimeout(()=>{e(d.index)},300);let C=y("#Swiper-"+h);if(d.eventType=="adjustLoop")C.await(250).css({transition:"0s",transform:x(r)}).children().removeClass(l("Display")).parent().children(r).addClass(l("Display"),l("LoopAdjusting")).await(100).removeClass(l("LoopAdjusting"));else if(d.eventType=="sys")C.await(250).css({transform:x(r)}).children().removeClass(l("Display")).parent().children(r).addClass(l("Display"));else if(C.children().removeClass(l("Display")).parent().children(r).addClass(l("Display")).parent().css({transition:"0.3s",transform:x(r)}).await(250).css({transition:"0s"}),v){let f=d.index==-1?S.length-1:0;b({eventType:"adjustLoop",index:f})}o&&!v&&p.interval.once(()=>{let f=d.index+1;!s&&f>S.length-1&&(f=0),b({eventType:"usr",index:f})},o-(d.eventType=="sys"?310:0),"SwipeTimer-"+h)},[d]);let u=S.map((r,v)=>g(L,{flexSizing:"none",width:1,height:0,className:l("Child"),children:i(r)},v));s&&(u.push(m(w({},u[0]),{key:u[0].key+"-Shallow0"})),u.unshift(m(w({},u[u.length-2]),{key:u[u.length-2].key+"-Shallow0"})));let P={x:0,y:0,process:!1,effectStartAt:0,id:h,loop:s,index:d.index,minIndex:s?-1:0,maxIndex:S.length+(s?1:-1),width:0,set_event:b},A=d.index+ +!!s;return g(L,m(w({overflow:"hidden",ssZIndex:1},E),{className:[E.className,l("SwipeView")].join(" "),"data-swipe-id":h,onPointerDown:r=>{if(r.pointerType=="touch"){if(a)return}else if(r.pointerType=="mouse"&&(n||r.buttons!=1))return;I.Start(r,P)},children:g(j,{flexWrap:!1,gap:1,transition:"long",className:[l("Rail"),l("ShowOther_"+c)].join(" "),id:"Swiper-"+h,xcss:w({},T.current?{}:{transform:x(A)}),children:u})}))},x=t=>`translateX( calc( ${-100*t}%  - ${12*t}px ) )`,I={Start:(t,e)=>{let{x:c,y:o}=p.getCursor(t),s=t.currentTarget,n=t.target;if(p.isOneOf(n.tagName,"SELECT","BUTTON","LABEL","INPUT"))return;e=m(w({},e),{x:c-e.x+window.scrollX,y:o-e.y+window.scrollY,effectStartAt:new Date().getTime(),width:y("#Swiper-"+e.id).position().width});let{swipeId:a}=s.dataset;a==e.id&&p(document).onEvent("pointermove",i=>{I.Check(i,e)},{eventID:"SwipeView.PointerMove",passive:!1}).onEvent("pointerup",i=>{I.End(i,e)},{eventID:"SwipeView.PointerUp",passive:!1})},Check:(t,e)=>{if(e.process)return;let{x:c,y:o}=p.getCursor(t),s=Math.abs(c-e.x+window.scrollX),n=Math.abs(o-e.y+window.scrollY);if(!(t.touches&&t.touches.length>1)&&!(n+s<15))if(n>s/2)p(document).removeEvent(["SwipeView.PointerMove"]);else{e.process=!0;let a=e.index+(e.loop?1:0);y("#Swiper-"+e.id).children(a-1).addClass(l("Display")),p(document).onEvent("mousemove",i=>{I.Move(i,e)},{eventID:"SwipeView.Check.MouseMove",passive:!1}).onEvent("touchmove",i=>{I.Move(i,e)},{eventID:"SwipeView.Check.TouchMove",passive:!1}),t.preventDefault();return}},Move:(t,e)=>{if(t.touches&&t.touches.length>1)return;let{x:c}=p.getCursor(t),o=c-e.x+window.scrollX,n=e.index+(e.loop?1:0)-o/e.width;if(n<0)n/=2;else if(n>e.maxIndex){let a=n-e.maxIndex;n=e.maxIndex+a/2}y("#Swiper-"+e.id).css({transition:"0s",transform:x(n)}),t.preventDefault()},End:(t,e)=>{if(e.process){let o=p.getCursor(t).x-e.x+window.scrollX,s=new Date().getTime(),n=s-e.effectStartAt,a=e.index+(e.loop?1:0),i=0;n<400?i=a-(+(o>0)*2-1):i=Math.round(a-o/e.width),i=Math.max(Math.min(i,e.maxIndex),e.minIndex),e.process=!1,a===i?(e.effectStartAt=s,y("#Swiper-"+e.id).css({transition:".2s",transform:x(i)}).await(310).css({transition:"0s"}).children().removeClass(l("Display")).parent().children(a).addClass(l("Display"))):e.set_event({eventType:"usr",index:i+e.minIndex})}p(document).removeEvent(["SwipeView.PointerMove","SwipeView.Check.MouseMove","SwipeView.Check.TouchMove","SwipeView.PointerUp"])}},R=t=>g(_,m(w({},t),{slideIndex:Math.max(Math.min(t.slideIndex,t.slides.length-1),0)}));export{R as SwipeView,R as default};