vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
2 lines (1 loc) • 4 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("vue"),I=require("../utils.cjs"),Q=(n,g,a,Y)=>{const x=i.ref(0),s=i.ref(0),l=i.ref(n.modelValue??n.initialIndex),f=i.ref(!1),d=i.ref(0);let w=0,L=0,E=0,b=null;const o=i.ref(!1),O=i.ref(null);let y=null;const q=i.computed(()=>!n.loop&&l.value===0),H=i.computed(()=>!n.loop&&l.value===s.value-1),$=i.computed(()=>({width:I.normalizeSize(n.width),height:n.autoSize?"auto":I.normalizeSize(n.height),position:"relative",overflow:"hidden",touchAction:"pan-y"})),C=i.computed(()=>-(l.value*(x.value+n.gap))+d.value),F=i.computed(()=>({display:"flex",gap:`${n.gap}px`,transform:`translate3d(${C.value}px, 0, 0)`,transition:f.value?"none":`transform ${n.transitionDuration}ms ease`,willChange:"transform"})),U=()=>n.threshold<1?x.value*n.threshold:n.threshold,W=e=>{if(n.loop){const t=s.value;return(e%t+t)%t}return Math.max(0,Math.min(e,s.value-1))},r=()=>{n.autoSize&&i.nextTick(()=>{const e=a.value;if(!e)return;const t=e.children.item(l.value);t&&(O.value=t.offsetHeight)})},S=()=>{!g.value||!a.value||(x.value=g.value.clientWidth,s.value=a.value.children.length,r())},M=e=>{e&&clearTimeout(e)},j=()=>{if(o.value=!0,d.value=0,!a.value){o.value=!1;return}const e=()=>{o.value=!1,a.value?.removeEventListener("transitionend",e),r()};a.value?.addEventListener("transitionend",e,{once:!0});const t=window.setTimeout(()=>{if(o.value){o.value=!1;try{a.value?.removeEventListener("transitionend",e)}catch{}r()}M(t)},n.transitionDuration+80)},c=e=>{const t=W(e);if(t===l.value){j();return}if(o.value=!0,l.value=t,d.value=0,!a.value){o.value=!1,r();return}const u=()=>{o.value=!1,a.value?.removeEventListener("transitionend",u),r()};a.value?.addEventListener("transitionend",u,{once:!0});const v=window.setTimeout(()=>{if(o.value){o.value=!1;try{a.value?.removeEventListener("transitionend",u)}catch{}r()}M(v)},n.transitionDuration+80)},X=()=>{o.value||(n.loop||l.value<s.value-1)&&c(l.value+1)},B=()=>{o.value||(n.loop||l.value>0)&&c(l.value-1)},m=e=>{if(!f.value)return;let t=0,u=0;if("touches"in e){if(e.touches.length===0)return;t=e.touches[0].clientX,u=e.touches[0].clientY}else t=e.clientX,u=e.clientY;const v=t-w,A=u-L;if(b||(b=Math.abs(v)>Math.abs(A)?"h":"v"),b==="v")return;e.cancelable&&e.preventDefault(),w=t,L=u,E+=v;const V=l.value===0,G=l.value===s.value-1,J=v>0,K=v<0;!n.loop&&(V&&J||G&&K)?d.value+=v*.35:d.value+=v},T=()=>{y&&(clearInterval(y),y=null)},P=()=>{!n.autoplay||s.value<=1||(T(),y=window.setInterval(()=>{X()},n.interval))},h=()=>{if(!f.value)return;f.value=!1;const e=U();let t=l.value;E>e?t=l.value-1:E<-e&&(t=l.value+1),c(t),P(),window.removeEventListener("mousemove",m),window.removeEventListener("mouseup",h),window.removeEventListener("touchmove",m),window.removeEventListener("touchend",h)},N=e=>{if(T(),!o.value){if(f.value=!0,b=null,d.value=0,E=0,"touches"in e){const t=e.touches[0];w=t.clientX,L=t.clientY}else w=e.clientX,L=e.clientY;window.addEventListener("mousemove",m,{passive:!1}),window.addEventListener("mouseup",h),window.addEventListener("touchmove",m,{passive:!1}),window.addEventListener("touchend",h)}};let D=null,z=null;return i.watch(()=>n.modelValue,e=>{typeof e=="number"&&e!==l.value&&c(e)}),i.watch(l,e=>Y("update:modelValue",e)),i.onMounted(()=>{S(),P(),g.value&&(D=new ResizeObserver(()=>S()),D.observe(g.value)),a.value&&(z=new MutationObserver(()=>S()),z.observe(a.value,{childList:!0,subtree:!1})),n.images&&n.images.length&&i.nextTick(()=>{const e=a.value?.querySelectorAll("img")||[];for(let t=0;t<e.length;t++)e[t].addEventListener("load",()=>{r()},{once:!0})}),r()}),i.onBeforeUnmount(()=>{T(),D?.disconnect(),z?.disconnect(),window.removeEventListener("mousemove",m),window.removeEventListener("mouseup",h),window.removeEventListener("touchmove",m),window.removeEventListener("touchend",h)}),{slidesCount:s,currentIndex:l,isDisabledPrev:q,isDisabledNext:H,containerStyles:$,trackStyles:F,goTo:c,next:X,prev:B,onPointerDown:N}};exports.useSwiper=Q;