swiper/modules/scrollbar.min.mjs

Most modern mobile touch slider and framework with hardware accelerated transitions

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