swiper/modules/scrollbar.min.mjs

Most modern mobile touch slider and framework with hardware accelerated transitions

import{c as classesToSelector}from"../shared/classes-to-selector.min.mjs";import{s as makeElementsArray,c as classesToTokens,a as createElement,t as nextTick,h as elementOffset}from"../shared/utils.min.mjs";import{c as createElementIfNotDefined}from"../shared/create-element-if-not-defined.min.mjs";const Scrollbar=({swiper:e,extendParams:s,on:l,emit:a})=>{let r=!1,t=null,o=null,n=0,i=0,c=0,d=0;function p(){return e.params.scrollbar}function m(){const s=p();if(!s.el||!e.scrollbar.el)return;const{scrollbar:l,rtlTranslate:a}=e,{dragEl:r,el:o}=l,n=e.params.loop?e.progressLoop??0:e.progress;let d=i,m=(c-i)*n;a?(m=-m,m>0?(d=i-m,m=0):-m+i>c&&(d=c+m)):m<0?(d=i+m,m=0):m+i>c&&(d=c-m),e.isHorizontal()?(r.style.transform=`translate3d(${m}px, 0, 0)`,r.style.width=`${d}px`):(r.style.transform=`translate3d(0px, ${m}px, 0)`,r.style.height=`${d}px`),s.hide&&(t&&clearTimeout(t),o.style.opacity="1",t=setTimeout(()=>{o.style.opacity="0",o.style.transitionDuration="400ms"},1e3))}function u(){const s=p();if(!s.el||!e.scrollbar.el)return;const{scrollbar:l}=e,{dragEl:a,el:r}=l;a.style.width="",a.style.height="",c=e.isHorizontal()?r.offsetWidth:r.offsetHeight,d=e.size/(e.virtualSize+(e.params.slidesOffsetBefore??0)-(e.params.centeredSlides?e.snapGrid[0]:0)),i="auto"===s.dragSize?c*d:parseInt(String(s.dragSize),10),e.isHorizontal()?a.style.width=`${i}px`:a.style.height=`${i}px`,r.style.display=d>=1?"none":"",s.hide&&(r.style.opacity="0"),e.params.watchOverflow&&e.enabled&&l.el.classList[e.isLocked?"add":"remove"](s.lockClass)}function b(s){return e.isHorizontal()?s.clientX??s.touches?.[0]?.clientX??0:s.clientY??s.touches?.[0]?.clientY??0}function f(s){const{scrollbar:l,rtlTranslate:a}=e,{el:r}=l;let t;t=(b(s)-elementOffset(r)[e.isHorizontal()?"left":"top"]-(null!==n?n:i/2))/(c-i),t=Math.max(Math.min(t,1),0),a&&(t=1-t);const o=e.minTranslate()+(e.maxTranslate()-e.minTranslate())*t;e.updateProgress(o),e.setTranslate(o),e.updateActiveIndex(),e.updateSlidesClasses()}function g(s){const l=p(),{scrollbar:t,wrapperEl:i}=e,{el:c,dragEl:d}=t;r=!0,n=s.target===d?b(s)-s.target.getBoundingClientRect()[e.isHorizontal()?"left":"top"]:null,s.preventDefault(),s.stopPropagation(),i.style.transitionDuration="100ms",d.style.transitionDuration="100ms",f(s),o&&clearTimeout(o),c.style.transitionDuration="0ms",l.hide&&(c.style.opacity="1"),e.params.cssMode&&(e.wrapperEl.style.scrollSnapType="none"),a("scrollbarDragStart",s)}function y(s){const{scrollbar:l,wrapperEl:t}=e,{el:o,dragEl:n}=l;r&&(s.cancelable&&s.preventDefault(),f(s),t.style.transitionDuration="0ms",o.style.transitionDuration="0ms",n.style.transitionDuration="0ms",a("scrollbarDragMove",s))}function h(s){const l=p(),{scrollbar:t,wrapperEl:n}=e,{el:i}=t;r&&(r=!1,e.params.cssMode&&(e.wrapperEl.style.scrollSnapType="",n.style.transitionDuration=""),l.hide&&(o&&clearTimeout(o),o=nextTick(()=>{i.style.opacity="0",i.style.transitionDuration="400ms"},1e3)),a("scrollbarDragEnd",s),l.snapOnRelease&&e.slideToClosest())}function T(s){const{scrollbar:l,params:a}=e,r=l.el;if(!r)return;const t=!!a.passiveListeners&&{passive:!1,capture:!1},o=!!a.passiveListeners&&{passive:!0,capture:!1},n="on"===s?"addEventListener":"removeEventListener";r[n]("pointerdown",g,t),document[n]("pointermove",y,t),document[n]("pointerup",h,o)}function v(){const{scrollbar:s,el:l}=e;e.params.scrollbar=createElementIfNotDefined(e,e.originalParams.scrollbar,e.params.scrollbar,{el:"swiper-scrollbar"});const a=p();if(!a.el)return;let r;if(r="string"==typeof a.el&&e.isElement?e.el.querySelector(a.el):a.el,r||"string"!=typeof a.el)r||(r=a.el);else if(r=document.querySelectorAll(a.el),!r.length)return;e.params.uniqueNavElements&&"string"==typeof a.el&&r.length>1&&1===l.querySelectorAll(a.el).length&&(r=l.querySelector(a.el)),r.length>0&&(r=r[0]);const t=r;t.classList.add(e.isHorizontal()?a.horizontalClass:a.verticalClass);let o=null;t&&(o=t.querySelector(classesToSelector(a.dragClass)),o||(o=createElement("div",a.dragClass),t.append(o))),Object.assign(s,{el:t,dragEl:o}),a.draggable&&p().el&&e.scrollbar.el&&T("on"),t&&t.classList[e.enabled?"remove":"add"](...classesToTokens(a.lockClass))}function C(){const s=p(),l=e.scrollbar.el;l&&l.classList.remove(...classesToTokens(e.isHorizontal()?s.horizontalClass:s.verticalClass)),p().el&&e.scrollbar.el&&T("off")}s({scrollbar:{el:null,dragSize:"auto",hide:!1,draggable:!1,snapOnRelease:!0,lockClass:"swiper-scrollbar-lock",dragClass:"swiper-scrollbar-drag",scrollbarDisabledClass:"swiper-scrollbar-disabled",horizontalClass:"swiper-scrollbar-horizontal",verticalClass:"swiper-scrollbar-vertical"}}),e.scrollbar={el:null,dragEl:null},l("changeDirection",()=>{if(!e.scrollbar||!e.scrollbar.el)return;const s=p();makeElementsArray(e.scrollbar.el).forEach(l=>{l.classList.remove(s.horizontalClass,s.verticalClass),l.classList.add(e.isHorizontal()?s.horizontalClass:s.verticalClass)})}),l("init",()=>{!1===p().enabled?D():(v(),u(),m())}),l("update resize observerUpdate lock unlock changeDirection",()=>{u()}),l("setTranslate",()=>{m()}),l("setTransition",(s,l)=>{!function(s){p().el&&e.scrollbar.el&&(e.scrollbar.dragEl.style.transitionDuration=`${s}ms`)}(l)}),l("enable disable",()=>{const{el:s}=e.scrollbar;s&&s.classList[e.enabled?"remove":"add"](...classesToTokens(p().lockClass))}),l("destroy",()=>{C()});const D=()=>{const s=p();e.el.classList.add(...classesToTokens(s.scrollbarDisabledClass)),e.scrollbar.el&&e.scrollbar.el.classList.add(...classesToTokens(s.scrollbarDisabledClass)),C()};Object.assign(e.scrollbar,{enable:()=>{const s=p();e.el.classList.remove(...classesToTokens(s.scrollbarDisabledClass)),e.scrollbar.el&&e.scrollbar.el.classList.remove(...classesToTokens(s.scrollbarDisabledClass)),v(),u(),m()},disable:D,updateSize:u,setTranslate:m,init:v,destroy:C})};export{Scrollbar as default};
//# sourceMappingURL=scrollbar.min.mjs.map