UNPKG

ll-package

Version:

2 lines (1 loc) 14.2 kB
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("../../../@babel/runtime/helpers/esm/extends.js"),S=require("vue"),$=require("../../../lodash-es/debounce.js"),P=require("../../../resize-observer-polyfill/dist/ResizeObserver.es.js"),C=require("../_util/classNames.js"),x=require("../_util/BaseMixin.js"),H=require("./default-props.js"),A=require("./initial-state.js"),n=require("./utils/innerSliderUtils.js"),O=require("./track.js"),R=require("./dots.js"),L=require("./arrows.js"),z=require("../_util/supportsPassive.js");var E=function(e,t){var a={};for(var s in e)Object.prototype.hasOwnProperty.call(e,s)&&t.indexOf(s)<0&&(a[s]=e[s]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var l=0,s=Object.getOwnPropertySymbols(e);l<s.length;l++)t.indexOf(s[l])<0&&Object.prototype.propertyIsEnumerable.call(e,s[l])&&(a[s[l]]=e[s[l]]);return a};function h(){}const _={name:"InnerSlider",mixins:[x.default],inheritAttrs:!1,props:i.default({},H.default),data(){this.preProps=i.default({},this.$props),this.list=null,this.track=null,this.callbackTimers=[],this.clickable=!0,this.debouncedResize=null;const e=this.ssrInit();return i.default(i.default(i.default({},A.default),{currentSlide:this.initialSlide,slideCount:this.children.length}),e)},watch:{autoplay(e,t){!t&&e?this.handleAutoPlay("playing"):e?this.handleAutoPlay("update"):this.pause("paused")},__propsSymbol__(){const e=this.$props,t=i.default(i.default({listRef:this.list,trackRef:this.track},e),this.$data);let a=!1;for(const s of Object.keys(this.preProps)){if(!e.hasOwnProperty(s)){a=!0;break}if(!(typeof e[s]=="object"||typeof e[s]=="function"||typeof e[s]=="symbol")&&e[s]!==this.preProps[s]){a=!0;break}}this.updateState(t,a,()=>{this.currentSlide>=e.children.length&&this.changeSlide({message:"index",index:e.children.length-e.slidesToShow,currentSlide:this.currentSlide}),!this.preProps.autoplay&&e.autoplay?this.handleAutoPlay("playing"):e.autoplay?this.handleAutoPlay("update"):this.pause("paused")}),this.preProps=i.default({},e)}},mounted(){if(this.__emit("init"),this.lazyLoad){const e=n.getOnDemandLazySlides(i.default(i.default({},this.$props),this.$data));e.length>0&&(this.setState(t=>({lazyLoadedList:t.lazyLoadedList.concat(e)})),this.__emit("lazyLoad",e))}this.$nextTick(()=>{const e=i.default({listRef:this.list,trackRef:this.track,children:this.children},this.$props);this.updateState(e,!0,()=>{this.adaptHeight(),this.autoplay&&this.handleAutoPlay("playing")}),this.lazyLoad==="progressive"&&(this.lazyLoadTimer=setInterval(this.progressiveLazyLoad,1e3)),this.ro=new P.default(()=>{this.animating?(this.onWindowResized(!1),this.callbackTimers.push(setTimeout(()=>this.onWindowResized(),this.speed))):this.onWindowResized()}),this.ro.observe(this.list),document.querySelectorAll&&Array.prototype.forEach.call(document.querySelectorAll(".slick-slide"),t=>{t.onfocus=this.$props.pauseOnFocus?this.onSlideFocus:null,t.onblur=this.$props.pauseOnFocus?this.onSlideBlur:null}),window.addEventListener?window.addEventListener("resize",this.onWindowResized):window.attachEvent("onresize",this.onWindowResized)})},beforeUnmount(){var e;this.animationEndCallback&&clearTimeout(this.animationEndCallback),this.lazyLoadTimer&&clearInterval(this.lazyLoadTimer),this.callbackTimers.length&&(this.callbackTimers.forEach(t=>clearTimeout(t)),this.callbackTimers=[]),window.addEventListener?window.removeEventListener("resize",this.onWindowResized):window.detachEvent("onresize",this.onWindowResized),this.autoplayTimer&&clearInterval(this.autoplayTimer),(e=this.ro)===null||e===void 0||e.disconnect()},updated(){if(this.checkImagesLoad(),this.__emit("reInit"),this.lazyLoad){const e=n.getOnDemandLazySlides(i.default(i.default({},this.$props),this.$data));e.length>0&&(this.setState(t=>({lazyLoadedList:t.lazyLoadedList.concat(e)})),this.__emit("lazyLoad"))}this.adaptHeight()},methods:{listRefHandler(e){this.list=e},trackRefHandler(e){this.track=e},adaptHeight(){if(this.adaptiveHeight&&this.list){const e=this.list.querySelector(`[data-index="${this.currentSlide}"]`);this.list.style.height=n.getHeight(e)+"px"}},onWindowResized(e){this.debouncedResize&&this.debouncedResize.cancel(),this.debouncedResize=$.default(()=>this.resizeWindow(e),50),this.debouncedResize()},resizeWindow(){let e=arguments.length>0&&arguments[0]!==void 0?arguments[0]:!0;if(!!!this.track)return;const a=i.default(i.default({listRef:this.list,trackRef:this.track,children:this.children},this.$props),this.$data);this.updateState(a,e,()=>{this.autoplay?this.handleAutoPlay("update"):this.pause("paused")}),this.setState({animating:!1}),clearTimeout(this.animationEndCallback),delete this.animationEndCallback},updateState(e,t,a){const s=n.initializedState(e);e=i.default(i.default(i.default({},e),s),{slideIndex:s.currentSlide});const l=n.getTrackLeft(e);e=i.default(i.default({},e),{left:l});const c=n.getTrackCSS(e);(t||this.children.length!==e.children.length)&&(s.trackStyle=c),this.setState(s,a)},ssrInit(){const e=this.children;if(this.variableWidth){let f=0,y=0;const r=[],m=n.getPreClones(i.default(i.default(i.default({},this.$props),this.$data),{slideCount:e.length})),w=n.getPostClones(i.default(i.default(i.default({},this.$props),this.$data),{slideCount:e.length}));e.forEach(o=>{var k,p;const v=((p=(k=o.props.style)===null||k===void 0?void 0:k.width)===null||p===void 0?void 0:p.split("px")[0])||0;r.push(v),f+=v});for(let o=0;o<m;o++)y+=r[r.length-1-o],f+=r[r.length-1-o];for(let o=0;o<w;o++)f+=r[o];for(let o=0;o<this.currentSlide;o++)y+=r[o];const u={width:f+"px",left:-y+"px"};if(this.centerMode){const o=`${r[this.currentSlide]}px`;u.left=`calc(${u.left} + (100% - ${o}) / 2 ) `}return{trackStyle:u}}const t=e.length,a=i.default(i.default(i.default({},this.$props),this.$data),{slideCount:t}),s=n.getPreClones(a)+n.getPostClones(a)+t,l=100/this.slidesToShow*s,c=100/s;let g=-c*(n.getPreClones(a)+this.currentSlide)*l/100;this.centerMode&&(g+=(100-c*l/100)/2);const d={width:l+"%",left:g+"%"};return{slideWidth:c+"%",trackStyle:d}},checkImagesLoad(){const e=this.list&&this.list.querySelectorAll&&this.list.querySelectorAll(".slick-slide img")||[],t=e.length;let a=0;Array.prototype.forEach.call(e,s=>{const l=()=>++a&&a>=t&&this.onWindowResized();if(!s.onclick)s.onclick=()=>s.parentNode.focus();else{const c=s.onclick;s.onclick=()=>{c(),s.parentNode.focus()}}s.onload||(this.$props.lazyLoad?s.onload=()=>{this.adaptHeight(),this.callbackTimers.push(setTimeout(this.onWindowResized,this.speed))}:(s.onload=l,s.onerror=()=>{l(),this.__emit("lazyLoadError")}))})},progressiveLazyLoad(){const e=[],t=i.default(i.default({},this.$props),this.$data);for(let a=this.currentSlide;a<this.slideCount+n.getPostClones(t);a++)if(this.lazyLoadedList.indexOf(a)<0){e.push(a);break}for(let a=this.currentSlide-1;a>=-n.getPreClones(t);a--)if(this.lazyLoadedList.indexOf(a)<0){e.push(a);break}e.length>0?(this.setState(a=>({lazyLoadedList:a.lazyLoadedList.concat(e)})),this.__emit("lazyLoad",e)):this.lazyLoadTimer&&(clearInterval(this.lazyLoadTimer),delete this.lazyLoadTimer)},slideHandler(e){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!1;const{asNavFor:a,currentSlide:s,beforeChange:l,speed:c,afterChange:g}=this.$props,{state:d,nextState:f}=n.slideHandler(i.default(i.default(i.default({index:e},this.$props),this.$data),{trackRef:this.track,useCSS:this.useCSS&&!t}));if(!d)return;l&&l(s,d.currentSlide);const y=d.lazyLoadedList.filter(r=>this.lazyLoadedList.indexOf(r)<0);this.$attrs.onLazyLoad&&y.length>0&&this.__emit("lazyLoad",y),!this.$props.waitForAnimate&&this.animationEndCallback&&(clearTimeout(this.animationEndCallback),g&&g(s),delete this.animationEndCallback),this.setState(d,()=>{a&&this.asNavForIndex!==e&&(this.asNavForIndex=e,a.innerSlider.slideHandler(e)),f&&(this.animationEndCallback=setTimeout(()=>{const{animating:r}=f,m=E(f,["animating"]);this.setState(m,()=>{this.callbackTimers.push(setTimeout(()=>this.setState({animating:r}),10)),g&&g(d.currentSlide),delete this.animationEndCallback})},c))})},changeSlide(e){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!1;const a=i.default(i.default({},this.$props),this.$data),s=n.changeSlide(a,e);if(!(s!==0&&!s)&&(t===!0?this.slideHandler(s,t):this.slideHandler(s),this.$props.autoplay&&this.handleAutoPlay("update"),this.$props.focusOnSelect)){const l=this.list.querySelectorAll(".slick-current");l[0]&&l[0].focus()}},clickHandler(e){this.clickable===!1&&(e.stopPropagation(),e.preventDefault()),this.clickable=!0},keyHandler(e){const t=n.keyHandler(e,this.accessibility,this.rtl);t!==""&&this.changeSlide({message:t})},selectHandler(e){this.changeSlide(e)},disableBodyScroll(){const e=t=>{t=t||window.event,t.preventDefault&&t.preventDefault(),t.returnValue=!1};window.ontouchmove=e},enableBodyScroll(){window.ontouchmove=null},swipeStart(e){this.verticalSwiping&&this.disableBodyScroll();const t=n.swipeStart(e,this.swipe,this.draggable);t!==""&&this.setState(t)},swipeMove(e){const t=n.swipeMove(e,i.default(i.default(i.default({},this.$props),this.$data),{trackRef:this.track,listRef:this.list,slideIndex:this.currentSlide}));t&&(t.swiping&&(this.clickable=!1),this.setState(t))},swipeEnd(e){const t=n.swipeEnd(e,i.default(i.default(i.default({},this.$props),this.$data),{trackRef:this.track,listRef:this.list,slideIndex:this.currentSlide}));if(!t)return;const a=t.triggerSlideHandler;delete t.triggerSlideHandler,this.setState(t),a!==void 0&&(this.slideHandler(a),this.$props.verticalSwiping&&this.enableBodyScroll())},touchEnd(e){this.swipeEnd(e),this.clickable=!0},slickPrev(){this.callbackTimers.push(setTimeout(()=>this.changeSlide({message:"previous"}),0))},slickNext(){this.callbackTimers.push(setTimeout(()=>this.changeSlide({message:"next"}),0))},slickGoTo(e){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!1;if(e=Number(e),isNaN(e))return"";this.callbackTimers.push(setTimeout(()=>this.changeSlide({message:"index",index:e,currentSlide:this.currentSlide},t),0))},play(){let e;if(this.rtl)e=this.currentSlide-this.slidesToScroll;else if(n.canGoNext(i.default(i.default({},this.$props),this.$data)))e=this.currentSlide+this.slidesToScroll;else return!1;this.slideHandler(e)},handleAutoPlay(e){this.autoplayTimer&&clearInterval(this.autoplayTimer);const t=this.autoplaying;if(e==="update"){if(t==="hovered"||t==="focused"||t==="paused")return}else if(e==="leave"){if(t==="paused"||t==="focused")return}else if(e==="blur"&&(t==="paused"||t==="hovered"))return;this.autoplayTimer=setInterval(this.play,this.autoplaySpeed+50),this.setState({autoplaying:"playing"})},pause(e){this.autoplayTimer&&(clearInterval(this.autoplayTimer),this.autoplayTimer=null);const t=this.autoplaying;e==="paused"?this.setState({autoplaying:"paused"}):e==="focused"?(t==="hovered"||t==="playing")&&this.setState({autoplaying:"focused"}):t==="playing"&&this.setState({autoplaying:"hovered"})},onDotsOver(){this.autoplay&&this.pause("hovered")},onDotsLeave(){this.autoplay&&this.autoplaying==="hovered"&&this.handleAutoPlay("leave")},onTrackOver(){this.autoplay&&this.pause("hovered")},onTrackLeave(){this.autoplay&&this.autoplaying==="hovered"&&this.handleAutoPlay("leave")},onSlideFocus(){this.autoplay&&this.pause("focused")},onSlideBlur(){this.autoplay&&this.autoplaying==="focused"&&this.handleAutoPlay("blur")},customPaging(e){let{i:t}=e;return S.createVNode("button",null,[t+1])},appendDots(e){let{dots:t}=e;return S.createVNode("ul",{style:{display:"block"}},[t])}},render(){const e=C.default("slick-slider",this.$attrs.class,{"slick-vertical":this.vertical,"slick-initialized":!0}),t=i.default(i.default({},this.$props),this.$data);let a=n.extractObject(t,["fade","cssEase","speed","infinite","centerMode","focusOnSelect","currentSlide","lazyLoad","lazyLoadedList","rtl","slideWidth","slideHeight","listHeight","vertical","slidesToShow","slidesToScroll","slideCount","trackStyle","variableWidth","unslick","centerPadding","targetSlide","useCSS"]);const{pauseOnHover:s}=this.$props;a=i.default(i.default({},a),{focusOnSelect:this.focusOnSelect&&this.clickable?this.selectHandler:null,ref:this.trackRefHandler,onMouseleave:s?this.onTrackLeave:h,onMouseover:s?this.onTrackOver:h});let l;if(this.dots===!0&&this.slideCount>=this.slidesToShow){let p=n.extractObject(t,["dotsClass","slideCount","slidesToShow","currentSlide","slidesToScroll","clickHandler","children","infinite","appendDots"]);p.customPaging=this.customPaging,p.appendDots=this.appendDots;const{customPaging:v,appendDots:b}=this.$slots;v&&(p.customPaging=v),b&&(p.appendDots=b);const{pauseOnDotsHover:T}=this.$props;p=i.default(i.default({},p),{clickHandler:this.changeSlide,onMouseover:T?this.onDotsOver:h,onMouseleave:T?this.onDotsLeave:h}),l=S.createVNode(R.default,p,null)}let c,g;const d=n.extractObject(t,["infinite","centerMode","currentSlide","slideCount","slidesToShow"]);d.clickHandler=this.changeSlide;const{prevArrow:f,nextArrow:y}=this.$slots;f&&(d.prevArrow=f),y&&(d.nextArrow=y),this.arrows&&(c=S.createVNode(L.PrevArrow,d,null),g=S.createVNode(L.NextArrow,d,null));let r=null;this.vertical&&(r={height:typeof this.listHeight=="number"?`${this.listHeight}px`:this.listHeight});let m=null;this.vertical===!1?this.centerMode===!0&&(m={padding:"0px "+this.centerPadding}):this.centerMode===!0&&(m={padding:this.centerPadding+" 0px"});const w=i.default(i.default({},r),m),u=this.touchMove;let o={ref:this.listRefHandler,class:"slick-list",style:w,onClick:this.clickHandler,onMousedown:u?this.swipeStart:h,onMousemove:this.dragging&&u?this.swipeMove:h,onMouseup:u?this.swipeEnd:h,onMouseleave:this.dragging&&u?this.swipeEnd:h,[z.default?"onTouchstartPassive":"onTouchstart"]:u?this.swipeStart:h,[z.default?"onTouchmovePassive":"onTouchmove"]:this.dragging&&u?this.swipeMove:h,onTouchend:u?this.touchEnd:h,onTouchcancel:this.dragging&&u?this.swipeEnd:h,onKeydown:this.accessibility?this.keyHandler:h},k={class:e,dir:"ltr",style:this.$attrs.style};return this.unslick&&(o={class:"slick-list",ref:this.listRefHandler},k={class:e}),S.createVNode("div",k,[this.unslick?"":c,S.createVNode("div",o,[S.createVNode(O.default,a,{default:()=>[this.children]})]),this.unslick?"":g,this.unslick?"":l])}};exports.default=_;