UNPKG

@frsource/tiny-carousel-core

Version:

Core module for @frsource/tiny-carousel, based on CSS scroll snap feature 🚀

3 lines (2 loc) • 2.15 kB
import{on as t,addScrollEndListener as s,off as i,findXSnapIndex as h}from"@frsource/tiny-carousel-utils";const e={active:0,className:"frs-tc",classNameOverflow:"frs-tc--o",itemClassName:"frs-tc-item",hideScrollClassName:"frs-hide-scroll",overflow:!0,items:[]};class r{static get defaultConfig(){return Object.assign({},e)}static updateDefaultConfig(t){Object.assign(e,t)}constructor(t,s={}){this.carouselElement=void 0,this.config=void 0,this.t=void 0,this.i=void 0,this.h=void 0,this.carouselElement=t,this.config=Object.assign({},e,s),this.i=this.resetActive.bind(this),this.h=this.handleOverflow.bind(this)}handleOverflow(){this.config.overflow&&this.config.items.length&&(-1!==this.active&&this.active!==this.config.items.length||this.goTo(this.active))}use(t,...s){return t.install(this,...s),this}init(){return t(this.carouselElement,"scroll",this.i,{passive:!0}),this.h=s(this.carouselElement,this.h),this.config.items.length||(this.config.items=this.findPossibleItems()),this.carouselElement.classList.add(this.config.className),this.carouselElement.classList.add(this.config.hideScrollClassName),this.config.overflow&&this.carouselElement.classList.add(this.config.classNameOverflow),this.config.items.forEach(({classList:t,dataset:s})=>{t.contains(this.config.itemClassName)||(s.tcACls="",t.add(this.config.itemClassName))}),this.goTo(this.config.active),this}destroy(){return i(this.carouselElement,"scroll",this.i),i(this.carouselElement,"scroll",this.h),this}get active(){return void 0!==this.t||(this.t=h(this.carouselElement,this.config.items,this.config.overflow)),this.t}goTo(t){const s=this.config.items.length;if(s){if(this.config.overflow){for(;t<0;)t+=s;for(;t>=s;)t-=s}else t<0?t=0:t>=s&&(t=s-1);this.carouselElement.scrollLeft=this.config.items[t].offsetLeft}return this}next(){return this.goTo(this.active+1)}prev(){return this.goTo(this.active-1)}resetActive(){this.t=void 0}findPossibleItems(){const t=Array.from(this.carouselElement.children),{itemClassName:s}=this.config,i=t.filter(t=>!("tcACls"in t.dataset)&&t.classList.contains(s));return i.length?i:t}}export{r as TinyCarousel}; //# sourceMappingURL=index.modern.js.map