react-scroll-snap-anime-slider/dist/index.js

A simple slider/carousel using css style scroll-snap and Popmotion.

"use strict";var t=require("react"),e=require("popmotion"),i=function(t,e){return i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])},i(t,e)};function r(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Class extends value "+String(e)+" is not a constructor or null");function r(){this.constructor=t}i(t,e),t.prototype=null===e?Object.create(e):(r.prototype=e.prototype,new r)}var n=function(){return n=Object.assign||function(t){for(var e,i=1,r=arguments.length;i<r;i++)for(var n in e=arguments[i])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},n.apply(this,arguments)};function s(t,e){var i={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&e.indexOf(r)<0&&(i[r]=t[r]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(r=Object.getOwnPropertySymbols(t);n<r.length;n++)e.indexOf(r[n])<0&&Object.prototype.propertyIsEnumerable.call(t,r[n])&&(i[r[n]]=t[r[n]])}return i}var o={slideHeight:0,slideWidth:0,visibleSlides:1,step:1,currentSlide:0,freeScroll:!1,inertiaPower:.4,inertiaStopSpeed:800},l=n(n({},o),{totalSlides:0,updateContext:function(){},subscribers:[],slideTo:function(){}}),a=t.createContext(l);function c(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];for(var i=[],r=0;r<t.length;++r){var n=t[r];null!=n&&"boolean"!=typeof n&&(Array.isArray(n)?i.push(c.apply(void 0,n)):i.push(n))}return i.join(" ").replace(/\s+/g," ").trim()}function d(t){return Math.round(1e3*t)/1e3}var p={slider:"slider__T8bxB","slider-tray":"slider-tray__29SRr","css-only":"css-only__i5pKg",slide:"slide__JLMug","slide-inner-padding":"slide-inner-padding__xA7ms","slide-inner-wrapper":"slide-inner-wrapper__2gLNh","fixed-size":"fixed-size__jvUC5","align-center":"align-center__CzoWZ","snap-stop":"snap-stop__Sd4PZ","scroll-snap":"scroll-snap__UJMQj","slider-bar-track":"slider-bar-track__cpvry","slider-bar-thumb":"slider-bar-thumb__aEFEz","slider-bar-dot-group":"slider-bar-dot-group__O5G-9","slider-dot-wrapper":"slider-dot-wrapper__hqKwO","slider-dot":"slider-dot__BE48t",dynamic:"dynamic__FKSSN",active:"active__TNQVn"};!function(t,e){void 0===e&&(e={});var i=e.insertAt;if(t&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===i&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=t:n.appendChild(document.createTextNode(t))}}(".slider__T8bxB{overflow:hidden;position:relative}.slider-tray__29SRr::-webkit-scrollbar{display:none}.slider-tray__29SRr.css-only__i5pKg{-webkit-overflow-scrolling:touch;display:flex;overflow-x:auto}.slide__JLMug{flex-shrink:0;scroll-snap-align:start;scroll-snap-stop:normal}.slide-inner-padding__xA7ms{position:relative}.slide-inner-wrapper__2gLNh.fixed-size__jvUC5{height:100%;left:0;position:absolute;top:0;width:100%}.slide__JLMug.align-center__CzoWZ{scroll-snap-align:center}.slide__JLMug.snap-stop__Sd4PZ{scroll-snap-stop:always}.slider-tray__29SRr.css-only__i5pKg.scroll-snap__UJMQj{scroll-behavior:smooth;scroll-snap-type:x mandatory}.slider-bar-track__cpvry{background-color:#eee;height:10px;position:relative}.slider-bar-thumb__aEFEz{background-color:#555;height:100%;left:0;position:absolute;top:0}.slider-bar-dot-group__O5G-9{display:flex;justify-content:center;position:relative}.slider-dot-wrapper__hqKwO{cursor:pointer;padding:5px}.slider-dot__BE48t{background-color:#555;border-radius:10rem;height:8px;width:8px}.slider-dot-wrapper__hqKwO:not(.dynamic__FKSSN) .slider-dot__BE48t{background-color:#ddd}.slider-dot-wrapper__hqKwO:not(.dynamic__FKSSN).active__TNQVn .slider-dot__BE48t{background-color:#666}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlLm1vZHVsZS5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGVBRUUsZUFBZ0IsQ0FEaEIsaUJBQ2tCLENBRXBCLHVDQUNFLFlBQWUsQ0FFakIsb0NBR0UsZ0NBQWlDLENBRmpDLFlBQWEsQ0FDYixlQUNtQyxDQUVyQyxjQUNFLGFBQWMsQ0FDZCx1QkFBd0IsQ0FDeEIsdUJBQTBCLENBRTVCLDRCQUNFLGlCQUFvQixDQUV0Qiw4Q0FHRSxXQUFZLENBQ1osTUFBTyxDQUhQLGlCQUFrQixDQUlsQixLQUFNLENBSE4sVUFHUSxDQUVWLGtDQUNFLHdCQUEyQixDQUU3QiwrQkFDRSx1QkFBMEIsQ0FFNUIsdURBQ0Usc0JBQXVCLENBQ3ZCLDRCQUErQixDQUVqQyx5QkFDRSxxQkFBc0IsQ0FFdEIsV0FBWSxDQURaLGlCQUNjLENBRWhCLHlCQUtFLHFCQUFzQixDQUR0QixXQUFZLENBRlosTUFBTyxDQURQLGlCQUFrQixDQUVsQixLQUV3QixDQUUxQiw2QkFDRSxZQUFhLENBQ2Isc0JBQXVCLENBQ3ZCLGlCQUFvQixDQUV0QiwyQkFFRSxjQUFlLENBRGYsV0FDaUIsQ0FFbkIsbUJBSUUscUJBQXNCLENBRHRCLG1CQUFvQixDQUZwQixVQUFXLENBQ1gsU0FFd0IsQ0FFMUIsbUVBQ0UscUJBQXdCLENBRTFCLGlGQUNFLHFCQUF3QiIsImZpbGUiOiJzdHlsZS5tb2R1bGUuc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi5zbGlkZXIge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIG92ZXJmbG93OiBoaWRkZW47IH1cblxuLnNsaWRlci10cmF5Ojotd2Via2l0LXNjcm9sbGJhciB7XG4gIGRpc3BsYXk6IG5vbmU7IH1cblxuLnNsaWRlci10cmF5LmNzcy1vbmx5IHtcbiAgZGlzcGxheTogZmxleDtcbiAgb3ZlcmZsb3cteDogYXV0bztcbiAgLXdlYmtpdC1vdmVyZmxvdy1zY3JvbGxpbmc6IHRvdWNoOyB9XG5cbi5zbGlkZSB7XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBzY3JvbGwtc25hcC1hbGlnbjogc3RhcnQ7XG4gIHNjcm9sbC1zbmFwLXN0b3A6IG5vcm1hbDsgfVxuXG4uc2xpZGUtaW5uZXItcGFkZGluZyB7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTsgfVxuXG4uc2xpZGUtaW5uZXItd3JhcHBlci5maXhlZC1zaXplIHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICBsZWZ0OiAwO1xuICB0b3A6IDA7IH1cblxuLnNsaWRlLmFsaWduLWNlbnRlciB7XG4gIHNjcm9sbC1zbmFwLWFsaWduOiBjZW50ZXI7IH1cblxuLnNsaWRlLnNuYXAtc3RvcCB7XG4gIHNjcm9sbC1zbmFwLXN0b3A6IGFsd2F5czsgfVxuXG4uc2xpZGVyLXRyYXkuY3NzLW9ubHkuc2Nyb2xsLXNuYXAge1xuICBzY3JvbGwtYmVoYXZpb3I6IHNtb290aDtcbiAgc2Nyb2xsLXNuYXAtdHlwZTogeCBtYW5kYXRvcnk7IH1cblxuLnNsaWRlci1iYXItdHJhY2sge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZWVlO1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGhlaWdodDogMTBweDsgfVxuXG4uc2xpZGVyLWJhci10aHVtYiB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgbGVmdDogMDtcbiAgdG9wOiAwO1xuICBoZWlnaHQ6IDEwMCU7XG4gIGJhY2tncm91bmQtY29sb3I6ICM1NTU7IH1cblxuLnNsaWRlci1iYXItZG90LWdyb3VwIHtcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTsgfVxuXG4uc2xpZGVyLWRvdC13cmFwcGVyIHtcbiAgcGFkZGluZzogNXB4O1xuICBjdXJzb3I6IHBvaW50ZXI7IH1cblxuLnNsaWRlci1kb3Qge1xuICBoZWlnaHQ6IDhweDtcbiAgd2lkdGg6IDhweDtcbiAgYm9yZGVyLXJhZGl1czogMTByZW07XG4gIGJhY2tncm91bmQtY29sb3I6ICM1NTU7IH1cblxuLnNsaWRlci1kb3Qtd3JhcHBlcjpub3QoLmR5bmFtaWMpIC5zbGlkZXItZG90IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2RkZDsgfVxuXG4uc2xpZGVyLWRvdC13cmFwcGVyOm5vdCguZHluYW1pYykuYWN0aXZlIC5zbGlkZXItZG90IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzY2NjsgfVxuIl19 */");var u="rssas";function h(t){return[u+"-"+t,p[t]]}var f=function(e){function i(t){var i=e.call(this,t)||this;return i.updateContext=function(t){i.setState({context:n(n({},i.state.context),t)})},i.state={context:i.extractContextProps(i.props)},i}return r(i,e),i.prototype.extractContextProps=function(t){var e,i=Object.assign({},l);for(e in i)null!=t[e]&&(i[e]=this.props[e]);return i.step=this.validateStep(t),i.updateContext=this.updateContext,i.subscribers=[],i.onSlide=t.onSlide,i.slideMargin=t.slideMargin,i.snapAnimation=t.snapAnimation,i.trayPadding=t.trayPadding,i},i.prototype.compareContextProps=function(t,e){for(var i=0,r=["totalSlides","visibleSlides","step","slideHeight","slideWidth","slideMargin","trayPadding","freeScroll","onSlide","snapAnimation","inertiaPower","inertiaStopSpeed"];i<r.length;i++){var n=r[i];if(t[n]!==e[n])return!1}return!0},i.prototype.validateStep=function(t){return t.step>0?t.step<t.visibleSlides?t.step:t.visibleSlides:1},i.prototype.componentDidUpdate=function(t,e,i){this.compareContextProps(t,this.props)||this.setState({context:this.extractContextProps(this.props)})},i.prototype.render=function(){var e=this.props,i=e.className,r=e.children;e.currentSlide,e.freeScroll,e.slideHeight,e.slideWidth,e.step,e.totalSlides,e.visibleSlides,e.slideMargin,e.onSlide,e.trayPadding,e.inertiaPower,e.snapAnimation,e.inertiaStopSpeed;var o=s(e,["className","children","currentSlide","freeScroll","slideHeight","slideWidth","step","totalSlides","visibleSlides","slideMargin","onSlide","trayPadding","inertiaPower","snapAnimation","inertiaStopSpeed"]);return t.createElement("div",n({},o,{className:c(h("wrapper"),i)}),t.createElement(a.Provider,{value:n({},this.state.context)},r))},i.defaultProps=n({},o),i}(t.Component),y=function(i){function o(r){var n=i.call(this,r)||this;return n.sliderTrayRef=t.createRef(),n.tempCurrentSlide=0,n.sliderDidSlided=!1,n.onScroll=function(t){var e=n.getTrayState();if(e){for(var i=e.trayWidth,r=e.innerTrayWidth,s=e.slideWidth,o=e.scrollLeft,l=n.context.currentSlide,a=0;a<n.context.subscribers.length;++a)n.context.subscribers[a](r,s,o);n.updateSlideIndex(e),n.context.onSlide&&n.context.onSlide({scrollLeft:o,currentSlide:l,slideWidth:s,trayWidth:i})}},n.onWheel=function(t){var e;if(n.stopAnimeActions(),n.sliderTrayRef.current){var i=n.sliderTrayRef.current;!n.context.freeScroll&&(e=i.classList).add.apply(e,h("scroll-snap"))}},n.onTouchstart=function(t){n.stopTrackingActions()},n.startTracking=function(t){t.preventDefault();var i=n.getScrollMax();if(n.stopTrackingActions(),n.stopAnimeActions(),n.sliderTrayRef.current&&i>0){var r=n.sliderTrayRef.current,s=r.scrollLeft,o=s;n.sliderDidSlided=!1,n.scrollValue=e.value(s,(function(t){n.sliderDidSlided&&r.scrollTo(t,0)})),n.pointerAction=e.pointer({x:0,y:0}).pipe((function(t){var e,s=o-t.x;return 0==t.x||n.sliderDidSlided||(n.sliderDidSlided=!0,!n.context.freeScroll&&(e=r.classList).remove.apply(e,h("scroll-snap"))),s<0?(o=t.x,{x:0,y:t.y}):s>i?(o=i+t.x,{x:i,y:t.y}):{x:s,y:t.y}})).start({update:function(t){n.scrollValue.update(t.x)}}),n.mouseUpAction=e.listen(window.document,"mouseup").start(n.stopTracking),window.addEventListener("touchstart",n.onTouchstart,!1)}},n.stopTracking=function(t){if(n.pointerAction&&n.sliderTrayRef.current){var i=n.sliderTrayRef.current,r=n.getScrollMax(),s=n.scrollValue.get(),o=n.scrollValue.getVelocity(),l=!1,a=n.context.inertiaStopSpeed,c=function(){var t;n.snapAction=void 0,!n.context.freeScroll&&(t=i.classList).add.apply(t,h("scroll-snap"))},d=function(t,i){return e.tween({from:t,to:i,duration:300,ease:n.getEase()}).start({update:function(t){return n.scrollValue.update(t)},complete:c})};if(n.stopTrackingActions(),0===o){if(!n.context.freeScroll){var p=n.getSnapScrollValue(s,o);Math.abs(s-p)>.5?n.snapAction=d(s,p):c()}return}var u=!1,f=e.inertia({from:s,velocity:o,power:n.context.inertiaPower,restDelta:.4,timeConstant:500}).while((function(t){return!l})).pipe((function(t){return t<0?(l=!0,0):t>r?(l=!0,r):t})).start({update:function(t){if(u){var e=n.scrollValue.getVelocity();if(n.scrollValue.update(t),Math.abs(e)<a&&!n.context.freeScroll){f.stop(),n.inertiaAction=void 0;var i=n.getSnapScrollValue(t,e);n.snapAction=d(t,i)}}else u=!0},complete:c});n.inertiaAction=f}},n}return r(o,i),o.prototype.getTrayState=function(){if(this.sliderTrayRef.current){var t=this.sliderTrayRef.current,e=t.scrollLeft,i=t.offsetWidth,r=Number(window.getComputedStyle(t).paddingLeft.replace("px","")),n=null==this.context.trayPadding?i:i-2*r,s=n/this.context.visibleSlides;return{trayElement:t,scrollLeft:e,trayWidth:i,innerTrayWidth:n,trayPaddingX:r,slideWidth:s,slideCount:t.childElementCount,currentSlide:Math.round(e/s)}}},o.prototype.updateSlideIndex=function(t){if(void 0===t&&(t=this.getTrayState()),t){var e=t.currentSlide;this.tempCurrentSlide!==e&&(this.tempCurrentSlide=e,this.context.updateContext({currentSlide:this.tempCurrentSlide}))}},o.prototype.slideTo=function(t,i){var r,n=this;void 0===i&&(i=!0);var s=this.getTrayState();if(s){this.stopAnimeActions();var o=s.trayElement,l=s.scrollLeft,a=t*s.slideWidth;!this.context.freeScroll&&(r=o.classList).remove.apply(r,h("scroll-snap")),this.snapAction=e.tween({from:l,to:a,duration:i?300:0,ease:this.getEase()}).start({update:function(t){o.scrollTo(t,0)},complete:function(){var t;n.snapAction=void 0,!n.context.freeScroll&&(t=o.classList).add.apply(t,h("scroll-snap"))}})}},o.prototype.stopTrackingActions=function(){var t,e;null===(t=this.pointerAction)||void 0===t||t.stop(),this.pointerAction=void 0,null===(e=this.mouseUpAction)||void 0===e||e.stop(),this.mouseUpAction=void 0,window.removeEventListener("touchstart",this.onTouchstart,!1)},o.prototype.stopAnimeActions=function(){this.inertiaAction&&(this.inertiaAction.stop(),this.inertiaAction=void 0),this.snapAction&&(this.snapAction.stop(),this.snapAction=void 0)},o.prototype.applyOverdrag=function(t,i){var r=t;return t<0&&(r=e.calc.getValueFromProgress(0,t,.1)),t>i&&(r=e.calc.getValueFromProgress(i,t,.1)),r},o.prototype.getScrollMax=function(){var t=this.getTrayState();return t?t.slideWidth*(t.slideCount-this.context.visibleSlides):0},o.prototype.getSnapScrollValue=function(t,e){var i=t,r=this.getTrayState();if(r){var n=r.slideWidth,s=r.slideCount,o=0;(o=e>0?Math.ceil(t/n):e<0?Math.floor(t/n):Math.round(t/n))<=s&&(i=o*n)}return i},o.prototype.getEase=function(){if(this.context.snapAnimation){if("string"!=typeof this.context.snapAnimation)return e.easing.cubicBezier.apply(e.easing,this.context.snapAnimation);if("easeInOut"===this.context.snapAnimation)return e.easing.easeInOut;if("easeIn"===this.context.snapAnimation)return e.easing.easeIn}return e.easing.easeOut},o.prototype.handleOnClickCapture=function(t){this.sliderDidSlided&&(t.preventDefault(),t.stopPropagation())},o.prototype.componentDidUpdate=function(t,e,i){var r=this;this.context.slideTo=function(t){return r.slideTo(t,!0)}},o.prototype.componentDidMount=function(){var t=this;if(this.sliderTrayRef.current){var i=this.sliderTrayRef.current;this.mouseDownAction=e.listen(i,"mousedown").start(this.startTracking),i.addEventListener("scroll",this.onScroll,!1),i.addEventListener("mousewheel",this.onWheel,!1),i.addEventListener("DOMMouseScroll",this.onWheel,!1)}this.tempCurrentSlide!==this.context.currentSlide&&this.slideTo(this.context.currentSlide,!1),this.context.slideTo=function(e){return t.slideTo(e,!0)}},o.prototype.componentWillUnmount=function(){var t;if(this.sliderTrayRef.current){var e=this.sliderTrayRef.current;this.stopTrackingActions(),this.stopAnimeActions(),null===(t=this.mouseDownAction)||void 0===t||t.stop(),e.removeEventListener("scroll",this.onScroll,!1),e.removeEventListener("mousewheel",this.onWheel,!1),e.removeEventListener("DOMMouseScroll",this.onWheel,!1)}},o.prototype.render=function(){var e=this.props,i=e.children,r=e.className,o=e.trayProps,l=s(e,["children","className","trayProps"]),a={};return this.context.slideMargin&&(a.marginLeft="-"+this.context.slideMargin,a.marginRight="-"+this.context.slideMargin),null!=this.context.trayPadding&&(a.paddingLeft=this.context.trayPadding,a.paddingRight=this.context.trayPadding),t.createElement("div",n({},l,{className:c(h("slider"),r)}),t.createElement("div",n({},o,{className:c(h("slider-tray"),h("css-only"),this.context.freeScroll?"":h("scroll-snap"),null==o?void 0:o.className),style:n(n({},null==o?void 0:o.style),a),ref:this.sliderTrayRef,onClickCapture:this.handleOnClickCapture.bind(this)}),i))},o}(t.Component);y.contextType=a;var x=function(e){function i(t){var i=e.call(this,t)||this;return i.state={},i}return r(i,e),i.prototype.render=function(){var e=this.props,i=e.children,r=e.style,o=e.className,l=e.innerMarginDivProps,a=e.innerPaddingDivProps,d=e.innerWrapperDivProps,p=s(e,["children","style","className","innerMarginDivProps","innerPaddingDivProps","innerWrapperDivProps"]),u=this.context,f=u.slideHeight,y=u.slideWidth,x=u.visibleSlides,v=f>0&&y>0?f/y*100:0,m=n({width:(x>0?100/x:100)+"%",scrollMargin:null!=this.context.trayPadding&&this.context.visibleSlides%2==0?"0 ".concat(this.context.trayPadding):""},r),b=n({paddingBottom:v>0?v+"%":""},null==a?void 0:a.style),g=n({},null==l?void 0:l.style);null!=this.context.slideMargin&&(g.marginLeft=this.context.slideMargin,g.marginRight=this.context.slideMargin);var S=v>0?h("fixed-size"):"";return t.createElement("div",n({},p,{className:c(h("slide"),null!=this.context.trayPadding&&this.context.visibleSlides%2==1&&h("align-center"),o),style:m}),t.createElement("div",n({},l,{className:c(h("slide-inner-margin")),style:g}),t.createElement("div",n({},a,{className:c(h("slide-inner-padding")),style:b}),t.createElement("div",n({},d,{className:c(h("slide-inner-wrapper"),S,null==d?void 0:d.className)}),i))))},i}(t.Component);x.contextType=a;var v=function(e){function i(){var t=null!==e&&e.apply(this,arguments)||this;return t.className="slider-button",t.ariaLabel="",t.isBack=!0,t.onClick=function(){},t}return r(i,e),i.prototype.handleOnClick=function(t){var e=this.context.currentSlide,i=this.context.step,r=this.context.totalSlides-this.context.visibleSlides,n=e+(t?i:-1*i);n>r?n=r:n<0&&(n=0),e!==n&&this.context.slideTo(n)},i.prototype.render=function(){var e=this,i=this.context,r=i.visibleSlides,o=i.totalSlides,l=i.currentSlide,a=this.props,d=a.className,p=a.disabled,u=a.onClick,h=s(a,["className","disabled","onClick"]),f=c(this.className,d),y=o-r;return null==p&&(this.isBack&&l<=0||!this.isBack&&l>=y)&&(p=!0),t.createElement("button",n({"aria-label":this.ariaLabel,type:"button",disabled:p},h,{className:f,onClick:function(t){u&&"function"==typeof u&&u(t),e.onClick()}}),this.props.children)},i}(t.PureComponent);v.contextType=a;var m=function(t){function e(e){var i=t.call(this,e)||this;return i.className=c(h("slider-button-back"),h(i.className)),i.ariaLabel="previous",i.onClick=function(){return i.handleOnClick(!1)},i}return r(e,t),e}(v),b=function(t){function e(e){var i=t.call(this,e)||this;return i.isBack=!1,i.className=c(h("slider-button-next"),h(i.className)),i.ariaLabel="next",i.onClick=function(){return i.handleOnClick(!0)},i}return r(e,t),e}(v),g=function(t){function e(e){var i=t.call(this,e)||this;return i.slideTo=function(t){var e=i.context.currentSlide,r=i.context.totalSlides-i.context.visibleSlides;t>r?t=r:t<0&&(t=0),e!==t&&i.context.slideTo(t)},i.onScroll=function(t,e,r){var n=r/(i.context.totalSlides*e)*100;i.setState({left:n})},i.state={left:0},i}return r(e,t),e.prototype.componentDidUpdate=function(t,e,i){this.prevContext.subscribers!==this.context.subscribers&&(this.context.subscribers.push(this.onScroll),this.prevContext=this.context)},e.prototype.componentDidMount=function(){var t=this.context,e=t.currentSlide;t.visibleSlides;var i=t.totalSlides;if(this.context.subscribers.push(this.onScroll),this.prevContext=this.context,0!==e){var r=e/i*100;this.setState({left:r})}},e.prototype.componentWillUnmount=function(){var t=this.context.subscribers.indexOf(this.onScroll);t>=0&&this.context.subscribers.splice(t,1)},e}(t.Component);g.contextType=a;var S=function(e){function i(){return null!==e&&e.apply(this,arguments)||this}return r(i,e),i.prototype.render=function(){var e=this.context,i=e.visibleSlides,r=e.totalSlides,o=this.props,l=o.className,a=o.style,d=o.thumbProps,p=o.trackProps,u=s(o,["className","style","thumbProps","trackProps"]),f=i/r*100,y=this.state.left;y<0&&(f+=y,y=0),y+f>100&&(f=100-y);var x={width:f+"%",left:y+"%"},v=c(h("slider-bar"),l);return d&&(x=n(n({},d.style),x)),t.createElement("div",n({},u,{className:v,style:a}),t.createElement("div",n({},p,{className:c(h("slider-bar-track"),null==p?void 0:p.className)}),t.createElement("div",n({},d,{className:c(h("slider-bar-thumb"),null==d?void 0:d.className),style:x}))))},i}(g),N=function(e){function i(){return null!==e&&e.apply(this,arguments)||this}return r(i,e),i.prototype.theDot=function(e,i,r){return t.createElement("div",{className:c(h("slider-dot-wrapper"),i?h("active"):""),onClick:r},t.createElement("div",{key:e,className:c(h("slider-dot"))}))},i.prototype.renderDots=function(t){for(var e=t.visibleSlides,i=t.totalSlides,r=t.currentSlide,n=t.slideTo,s=[],o=r,l=r+e,a=function(t){var e=o<=t&&t<l;s.push(c.theDot(t,e,(function(){return n(t)})))},c=this,d=0;d<i;++d)a(d);return s},i.prototype.render=function(){var e=this.context,i=e.visibleSlides,r=e.totalSlides,o=e.step,l=e.currentSlide,a=this.props;a.children;var d=a.className,p=a.dotGroupProps,u=a.renderDots,f=s(a,["children","className","dotGroupProps","renderDots"]),y={visibleSlides:i,totalSlides:r,step:o,currentSlide:l,left:this.state.left,slideTo:this.slideTo},x=c(h("slider-bar"),d);return t.createElement("div",n({},f,{className:x}),t.createElement("div",n({},p,{className:c(h("slider-bar-dot-group"),null==p?void 0:p.className)}),u?u(y):this.renderDots(y)))},i}(g);function C(e,i){var r=e.visibleSlides,n=e.totalSlides;e.step;for(var s=e.left,o=e.currentSlide,l=e.slideTo,a=[],c=d(r/n),p=d(s/100),u=p+c,h=d(1/n),f=o,y=o+r,x=function(e){var r=d(e/n),s=d(r+h),o=1,c=f<=e&&e<y;if(r<u&&s>p)if(r<=p&&p<=s)o+=(s-p)/h;else if(p<=r&&s<=u)o=2;else if(r<=u&&u<=s){o+=(u-r)/h}a.push(t.createElement(i,{key:e,scale:o,active:c,onClick:function(){l(e)}}))},v=0;v<n;++v)x(v);return a}function Q(e){return t.createElement("div",{className:c(h("slider-dot-wrapper"),h("dynamic"),e.active?h("active"):""),onClick:e.onClick},t.createElement("div",{className:c(h("slider-dot"),h("circle")),style:{transform:"scale(".concat(e.scale,")")}}))}function I(e){return t.createElement("div",{className:c(h("slider-dot-wrapper"),h("dynamic"),e.active?h("active"):""),onClick:e.onClick},t.createElement("div",{className:c(h("slider-dot"),h("circle")),style:{width:"".concat(8*e.scale,"px"),height:"".concat(8,"px")}}))}exports.ButtonBack=m,exports.ButtonNext=b,exports.Carousel=f,exports.CircleDot=Q,exports.PillDot=I,exports.Slide=x,exports.Slider=y,exports.SliderBarDotGroup=N,exports.SliderBarLine=S,exports.add=function(t,e){return t+e},exports.cn=c,exports.deepCompare=function(){for(var t,e,i,r,n=[],s=0;s<arguments.length;s++)n[s]=arguments[s];function o(t,e){var n;if(isNaN(t)&&isNaN(e)&&"number"==typeof t&&"number"==typeof e)return!0;if(t===e)return!0;if("function"==typeof t&&"function"==typeof e||t instanceof Date&&e instanceof Date||t instanceof RegExp&&e instanceof RegExp||t instanceof String&&e instanceof String||t instanceof Number&&e instanceof Number)return t.toString()===e.toString();if(!(t instanceof Object&&e instanceof Object))return!1;if(t.isPrototypeOf(e)||e.isPrototypeOf(t))return!1;if(t.constructor!==e.constructor)return!1;if(t.prototype!==e.prototype)return!1;if(i.indexOf(t)>-1||r.indexOf(e)>-1)return!1;for(n in e){if(e.hasOwnProperty(n)!==t.hasOwnProperty(n))return!1;if(typeof e[n]!=typeof t[n])return!1}for(n in t){if(e.hasOwnProperty(n)!==t.hasOwnProperty(n))return!1;if(typeof e[n]!=typeof t[n])return!1;switch(typeof t[n]){case"object":case"function":if(i.push(t),r.push(e),!o(t[n],e[n]))return!1;i.pop(),r.pop();break;default:if(t[n]!==e[n])return!1}}return!0}if(n.length<1)return!0;for(t=1,e=n.length;t<e;t++)if(i=[],r=[],!o(n[0],n[t]))return!1;return!0},exports.renderDotsDynamicByScale=C,exports.renderDotsDynamicCircle=function(t){return C(t,Q)},exports.renderDotsDynamicPill=function(t){return C(t,I)},exports.round3=d;