react-view-pager - npm Package Compare versions

Comparing version 0.5.0-prerelease to 0.5.0-prerelease.1

CHANGELOG.md

 ## CHANGELOG
-### 0.5.0
+### 0.5.0-prerelease.1
+General cleanup
+
+Fixes Avoid call to window in window-less environment [#28](https://github.com/souporserious/react-view-pager/pull/28)
+
+Fixes `beforeViewChange` being called twice
+
+Fixes `onScroll` callback to allow use of `setState`
+
+Moved main props to the `Track` component
+
+Added `ViewPager` wrapper component. It was a hard decision to add another component, but this will allow some cool animations and other features.
+
+Added `AnimatedView` component to allow animations that are relative to the pager.
+
+Updated `animation-bus` to `0.2.0`
+
+### 0.5.0-prerelease
 Major Update again, sorry for the big changes. This has been a rough road, but I feel it has finally smoothed out and I'm very happy with where everything is at.
@@ -9,18 +26,33 @@
 **Breaking Changes**
+
 *Props changed*
+
 `currentIndex` && `currentKey` -> `currentView`
+
 `slidesToShow` -> `viewsToShow`
+
 `slidesToMove` -> `viewsToMove`
+
 `vertical` -> `axis`
+
 `autoHeight` -> `autoSize`
 
 *Props added*
+
 `contain`
+
 `animations`
+
 `accessibility`
+
 `onSwipeStart`
+
 `onSwipeMove`
+
 `onSwipeEnd`
+
 `onScroll`
+
 `beforeViewChange`
+
 `afterViewChange`
@@ -27,0 +59,0 @@

dist/react-view-pager.min.js

 /*!
- * React View Pager 0.5.0-prerelease
+ * React View Pager 0.5.0-prerelease.1
  * https://github.com/souporserious/react-view-pager
  * Copyright (c) 2016 React View Pager Authors
  */
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("react-dom"),require("react-motion"),require("get-prefix")):"function"==typeof define&&define.amd?define(["react","react-dom","react-motion","get-prefix"],t):"object"==typeof exports?exports.ReactViewPager=t(require("react"),require("react-dom"),require("react-motion"),require("get-prefix")):e.ReactViewPager=t(e.React,e.ReactDOM,e.ReactMotion,e.getPrefix)}(this,function(e,t,n,i){return function(e){function t(i){if(n[i])return n[i].exports;var r=n[i]={exports:{},id:i,loaded:!1};return e[i].call(r.exports,r,r.exports,t),r.loaded=!0,r.exports}var n={};return t.m=e,t.c=n,t.p="dist/",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0}),t.utils=t.ImageView=t.Track=t.Frame=void 0;var r=n(1),o=i(r),a=n(13),s=i(a),u=n(18),c=i(u),f=n(10),l=i(f);t.Frame=o.default,t.Track=s.default,t.ImageView=c.default,t.utils=l.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},u="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},c=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),f=n(2),l=i(f),p=n(3),h=(i(p),n(4)),v=n(5),d=i(v),w=n(11),y=i(w),g=n(12),m=i(g),b=n(13),_=(i(b),n(14)),P=(i(_),n(17)),S=i(P),x=function(){return null},O={tag:f.PropTypes.string,currentView:f.PropTypes.any,viewsToShow:f.PropTypes.any,viewsToMove:f.PropTypes.number,align:f.PropTypes.number,contain:f.PropTypes.bool,axis:f.PropTypes.oneOf(["x","y"]),autoSize:f.PropTypes.bool,animations:f.PropTypes.array,infinite:f.PropTypes.bool,instant:f.PropTypes.bool,swipe:f.PropTypes.oneOf([!0,!1,"mouse","touch"]),swipeThreshold:f.PropTypes.number,flickTimeout:f.PropTypes.number,accessibility:f.PropTypes.bool,springConfig:l.default.PropTypes.objectOf(l.default.PropTypes.number),onSwipeStart:f.PropTypes.func,onSwipeMove:f.PropTypes.func,onSwipeEnd:f.PropTypes.func,onScroll:f.PropTypes.func,beforeViewChange:f.PropTypes.func,afterViewChange:f.PropTypes.func},k=function(e){function t(e){r(this,t);var n=o(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n._setFrameSize=function(){var e=n._viewPager.getFrameSize(!0,!0);e.width&&e.height&&n.setState(e,function(){n.state.instant&&n.setState({instant:!1})})},n._viewPager=new d.default(e),n._swipe=new y.default(n._viewPager),n._keyboard=new m.default(n._viewPager),n.state={width:0,height:0,instant:!0},n}return a(t,e),c(t,[{key:"getChildContext",value:function(){return{viewPager:this._viewPager}}},{key:"componentDidMount",value:function(){var e=this;this._viewPager.addFrame((0,p.findDOMNode)(this)),this._setFrameSize(),this._viewPager.on("viewAdded",this._setFrameSize),this._viewPager.on("hydrated",function(){e.forceUpdate()}),this._viewPager.on("viewChange",function(t){e.props.beforeViewChange(t),e._setFrameSize()}),this._viewPager.on("swipeStart",this.props.onSwipeStart),this._viewPager.on("swipeMove",this.props.onSwipeMove),this._viewPager.on("swipeEnd",this.props.onSwipeEnd),this._viewPager.on("scroll",this.props.onScroll),this._viewPager.on("rest",this.props.afterViewChange)}},{key:"componentWillReceiveProps",value:function(e){var t=e.currentView;e.children;void 0!==("undefined"==typeof t?"undefined":u(t))&&this.props.currentView!==t&&this.scrollTo(t)}},{key:"componentWillUnmount",value:function(){this._viewPager.destroy()}},{key:"getInstance",value:function(){return this._viewPager}},{key:"prev",value:function(){this._viewPager.prev()}},{key:"next",value:function(){this._viewPager.next()}},{key:"scrollTo",value:function(e){this._viewPager.emit("updateView",e)}},{key:"_getFrameStyle",value:function(){var e=this.state,t=e.width,n=e.height,i=e.instant;return{maxWidth:i?t:(0,h.spring)(t),height:i?n:(0,h.spring)(n)}}},{key:"_renderFrame",value:function(e){var t=this.props,n=t.tag,i=(t.axis,t.autoSize,t.accessibility),r=(0,S.default)(s({},this._swipe.getEvents(),this._keyboard.getEvents(),{tabIndex:i?0:null}),this.props,O);return(0,f.createElement)(n,s({},r,{style:s({},e,r.style)}))}},{key:"render",value:function(){var e=this,t=(this.state.height,{position:"relative",overflow:"hidden"});return this.props.autoSize?l.default.createElement(h.Motion,{style:this._getFrameStyle()},function(n){return n.maxWidth&&(t.maxWidth=n.maxWidth),n.height&&(t.height=n.height),e._renderFrame(t)}):this._renderFrame(t)}}]),t}(f.Component);k.propTypes=O,k.defaultProps={tag:"div",currentView:0,viewsToShow:1,viewsToMove:1,align:0,contain:!1,axis:"x",autoSize:!1,infinite:!1,instant:!1,swipe:!0,swipeThreshold:.5,flickTimeout:300,accessibility:!0,springConfig:h.presets.noWobble,onSwipeStart:x,onSwipeMove:x,onSwipeEnd:x,onScroll:x,beforeViewChange:x,afterViewChange:x},k.childContextTypes={viewPager:f.PropTypes.instanceOf(d.default)},t.default=k,e.exports=t.default},function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function r(e,t){var n={};for(var i in e)t.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(e,i)&&(n[i]=e[i]);return n}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function s(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},c=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),f=n(6),l=i(f),p=n(7),h=i(p),v=n(9),d=i(v),w=n(10),y=function(e){function t(e){var n=e.index,i=r(e,["index"]);o(this,t);var s=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,i));return s.index=n,s.isCurrent=!1,s.setTarget(),s.setOrigin(),s}return s(t,e),c(t,[{key:"setTarget",value:function(){var e=this.pager.getStartCoords(this.index);this.pager.options.align&&(e+=this.pager.getAlignOffset(this)),this.target=e}},{key:"setOrigin",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.pager.trackPosition;this.origin=this.target-e}}]),t}(d.default),g=function(e){function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};o(this,t);var n=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this));return n.resize=function(){n.hydrate(),n.emit("resize")},n.hydrate=function(){n.frame&&n.frame.setSize(),n.track&&n.track.setSize(),n.views.forEach(function(e){e.setSize(),e.setTarget()}),n.setPositionValue(),n.setViewStyles(),n.emit("hydrated")},n.options=u({viewsToShow:"auto",viewsToMove:1,align:0,contain:!1,axis:"x",autoSize:!1,animations:[],infinite:!1,instant:!1,swipe:!0,swipeThreshold:.5,flickTimeout:300,accessibility:!0},e),n.views=[],n.currentIndex=0,n.currentView=null,n.currentTween=0,n.trackPosition=0,n.isSwiping=!1,n.animationBus=new h.default(n.options.animations,function(e){return e.origin}),window.addEventListener("resize",n.resize),n}return s(t,e),c(t,[{key:"destroy",value:function(){window.removeEventListener("resize",this.resize)}},{key:"addFrame",value:function(e){this.frame=new d.default({node:e,pager:this}),this.hydrate()}},{key:"addTrack",value:function(e){this.track=new d.default({node:e,pager:this}),this.hydrate()}},{key:"addView",value:function(e){var t=this.views.length,n=new y({node:e,index:t,pager:this});return this.views.push(n),this.currentView||this.setCurrentView(0,t,!0),this.emit("viewAdded"),this.hydrate(),n}},{key:"removeView",value:function(e){this.views=this.views.filter(function(t){return e!==t}),this.emit("viewRemoved"),this.hydrate()}},{key:"prev",value:function(){this.setCurrentView(-1)}},{key:"next",value:function(){this.setCurrentView(1)}},{key:"setCurrentView",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this.currentIndex,n=arguments[2],i=this.options,r=i.viewsToMove,o=i.infinite,a=t+e*r,s=this.currentIndex,u=o?a:(0,w.clamp)(a,0,this.views.length-1),c=this.getView(s),f=this.getView(u);if(this.currentIndex=u,this.currentView=f,c.isCurrent=!1,f.isCurrent=!0,this.setPositionValue(),!n){var l=this.getNumericViewsToShow(),p=this.views.length;this.emit("viewChange",{from:(0,w.range)(s,s+l,p),to:(0,w.range)(u,u+l,p)})}}},{key:"setPositionValue",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.currentView?this.currentView.target:0;if(!this.isSwiping){var t=this.options,n=t.viewsToShow,i=t.autoSize,r=t.infinite,o=t.contain,a=this.getTrackSize();if(r&&(e-=(Math.floor(this.currentIndex/this.views.length)||0)*a),o){var s="auto"===n&&i||n<=1?0:this.getFrameSize(!1);e=(0,w.clamp)(e,s-a,0)}}this.trackPosition=e}},{key:"setViewStyles",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=this.options,n=t.infinite,i=t.align,r=this.getFrameSize(),o=this.getTrackSize(),a=(0,w.modulo)(e,-o);this.views.reduce(function(t,s,u){var c=s.getSize(),f=t+c,l=t;return n&&(f+c*i<Math.abs(a)?l+=o:t>r-a&&(l-=o)),s.setPosition(l),s.setOrigin(e),f},0)}},{key:"getNumericViewsToShow",value:function(){return isNaN(this.options.viewsToShow)?1:this.options.viewsToShow}},{key:"getMaxDimensions",value:function(e){var t=this.options.axis,n=e.map(function(e){return e.getSize("width")}),i=e.map(function(e){return e.getSize("height")});return{width:"x"===t?(0,w.sum)(n):(0,w.max)(n),height:"y"===t?(0,w.sum)(i):(0,w.max)(i)}}},{key:"getFrameSize",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.options.autoSize,t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=this.options,i=n.infinite,r=n.contain,o=n.axis,a={width:0,height:0};if(this.views.length)if(e){var s=[],u=isNaN(this.options.viewsToShow)?1:this.options.viewsToShow,c=this.currentIndex,f=this.currentIndex+(u-1);if(r){c=(0,w.clamp)(c,0,this.views.length-u),f=(0,w.clamp)(f,0,this.views.length-1);for(var l=c;l<=f;l++)s.push(this.getView(l))}else for(var p=c;p<=f;p++){var h=i?(0,w.modulo)(p,this.views.length):(0,w.clamp)(p,0,this.views.length-1);s.push(this.getView(h))}a=this.getMaxDimensions(s)}else this.frame&&(a={width:this.frame.getSize("width"),height:this.frame.getSize("height")});return t?a:a["x"===o?"width":"height"]}},{key:"getTrackSize",value:function(){var e=0;return this.views.forEach(function(t){e+=t.getSize()}),e}},{key:"getView",value:function(e){return this.views[(0,w.modulo)(e,this.views.length)]}},{key:"getStartCoords",value:function(e){var t=0;return this.views.slice(0,e).forEach(function(e){t-=e.getSize()}),t}},{key:"getAlignOffset",value:function(e){var t=this.getFrameSize(!1),n=e.getSize();return(t-n)*this.options.align}},{key:"getPositionValue",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.trackPosition,t=this.options,n=t.infinite,i=(t.contain,{x:0,y:0});if(this.currentTween=e,n){var r=this.getTrackSize();e=(0,w.modulo)(e,-r)||0}return this.emit("scroll",e),i[this.options.axis]=e,i}},{key:"resetViews",value:function(){this.setCurrentView(0,(0,w.modulo)(this.currentIndex,this.views.length),!0)}}]),t}(l.default);t.default=g,e.exports=t.default},function(e,t){"use strict";e.exports=function(e){var t={},n=[];e=e||this,e.on=function(e,n,i){(t[e]=t[e]||[]).push([n,i])},e.off=function(e,i){e||(t={});for(var r=t[e]||n,o=r.length=i?r.length:0;o--;)i==r[o][0]&&r.splice(o,1)},e.emit=function(e){for(var i,r=t[e]||n,o=r.length>0?r.slice(0,r.length):r,a=0;i=o[a++];)i[0].apply(i[1],n.slice.call(arguments,1))}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),a=n(8),s=i(a),u={perspective:"px",rotate:"deg",rotateX:"deg",rotateY:"deg",rotateZ:"deg",scale:"",scaleX:"",scaleY:"",scaleZ:"",skew:"deg",skewX:"deg",skewY:"deg",translateX:"px",translateY:"px",translateZ:"px"},c=Object.keys(u),f=function(){function e(t,n){r(this,e),this.animations=t,this.origin=n,this.createScaleFunctions()}return o(e,[{key:"createScaleFunctions",value:function(){this.animations.forEach(function(e){var t=[],n=[];e.stops.forEach(function(e){t.push(e[0]),n.push(e[1])}),e.scale=function(e){return(0,s.default)(t,n,!0)(e)}})}},{key:"getStyles",value:function(e){var t=this.origin(e),n=[],i={};return this.animations.forEach(function(e){var r=e.name,o=e.unit||u[r]||"",a=e.scale(t);c.indexOf(r)>-1?n.push(r+"("+a+o+")"):i[r]=""+a+o}),n.length&&(i.transform=n.join(" ")),i}},{key:"applyStyles",value:function(e){var t=this.getStyles(e);Object.keys(t).forEach(function(n){return e.style[n]=t[n]})}}]),e}();t.default=f,e.exports=t.default},function(e,t){"use strict";function n(e,t,n){if(e=e||[0,1],t=t||[0,1],n=n||!1,e.length!==t.length)throw new Error("polylinearScale requires domain and range to have an equivalent number of values");return i.domain=e,i.range=t,i.clamp=n,r}var i={},r=function(e){for(var t,n,r,o,a,s,u=i.domain,c=i.range,f=0;f<u.length-1;){if(e>=u[f]&&e<=u[f+1]){r=[u[f],u[f+1]],o=[c[f],c[f+1]];break}f++}return void 0===r&&(e<u[0]?(r=[u[0],u[1]],o=[c[0],c[1]]):(r=[u[u.length-2],u[u.length-1]],o=[c[c.length-2],c[c.length-1]])),a=(o[1]-o[0])/(r[1]-r[0]),s=o[0]+a*(e-r[0]),i.clamp&&(t=Math.min(o[0],o[1]),n=Math.max(o[0],o[1]),s=Math.min(n,Math.max(t,s))),s};e.exports=n},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),r=function(){function e(t){var i=t.node,r=t.pager,o=t.width,a=t.height;n(this,e),this.node=i,this.pager=r,this.x=this.y=0,this.setSize(o,a)}return i(e,[{key:"setSize",value:function(e,t){this.width=e||this.node.offsetWidth,this.height=t||this.node.offsetHeight}},{key:"setPosition",value:function(e){this[this.pager.options.axis]=e}},{key:"getSize",value:function(e){if("width"===e||"height"===e)return this[e];var t=this.pager.options.axis;return this["x"===t?"width":"height"]}},{key:"getPosition",value:function(){return this[this.pager.options.axis]}}]),e}();t.default=r,e.exports=t.default},function(e,t){"use strict";function n(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}function i(e,t){return(e%t+t)%t}function r(e,t,n){return Math.min(Math.max(t,e),n)}function o(e){return e.reduce(function(e,t){return e+t},0)}function a(e){return Math.max.apply(null,e)}function s(e,t,r){return[].concat(n(Array(t-e))).map(function(t,n){return i(e+n,r)})}Object.defineProperty(t,"__esModule",{value:!0}),t.modulo=i,t.clamp=r,t.sum=o,t.max=a,t.range=s},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e){return e.touches&&e.touches[0]||e}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),o=function(){function e(t){var r=this;n(this,e),this._onSwipeStart=function(e){var t=i(e),n=t.pageX,o=t.pageY;r.pager.isSwiping=!0,r._swipeStart={x:n,y:o},r._swipeDiff={x:0,y:0},r._isFlick=!0,setTimeout(function(){r._isFlick=!1},r.pager.options.flickTimeout),r.pager.emit("swipeStart")},this._onSwipeMove=function(e){if(r.pager.isSwiping){var t=r.pager.options,n=t.swipeThreshold,o=t.axis,a=i(e),s=a.pageX,u=a.pageY;if(r._trackStart||(r._trackStart=r.pager.currentTween),r._swipeDiff={x:r._swipeStart.x-s,y:r._swipeStart.y-u},r._isSwipe(n)){e.preventDefault(),e.stopPropagation();var c=r._swipeDiff[o],f=r._trackStart-c;r.pager.setPositionValue(f),r.pager.emit("swipeMove")}}},this._onSwipeEnd=function(){var e=r.pager,t=(e.frame,e.currentView),n=(e.trackPosition,r.pager.options),i=n.swipeThreshold,o=n.viewsToMove,a=n.axis,s=(n.infinite,r._isFlick?i:t.getSize()*o*i);r.pager.isSwiping=!1,r._trackStart=!1,(r._swipeDiff.x||r._swipeDiff.y)&&(r._isSwipe(s)?r._swipeDiff[a]<0?r.pager.prev():r.pager.next():r.pager.setPositionValue()),r.pager.emit("swipeEnd")},this._onSwipePast=function(){r.pager.isSwiping&&r._onSwipeEnd()},this.pager=t,this._trackStart=!1,this._swipeStart=this._swipeDiff={x:0,y:0}}return r(e,[{key:"_isSwipe",value:function(e){var t=this._swipeDiff,n=t.x,i=t.y;return"x"===this.pager.options.axis?Math.abs(n)>Math.max(e,Math.abs(i)):Math.abs(n)<Math.max(e,Math.abs(i))}},{key:"getEvents",value:function(){var e=this.pager.options.swipe,t={};return e!==!0&&"mouse"!==e||(t.onMouseDown=this._onSwipeStart,t.onMouseMove=this._onSwipeMove,t.onMouseUp=this._onSwipeEnd,t.onMouseLeave=this._onSwipePast),e!==!0&&"touch"!==e||(t.onTouchStart=this._onSwipeStart,t.onTouchMove=this._onSwipeMove,t.onTouchEnd=this._onSwipeEnd),t}}]),e}();t.default=o,e.exports=t.default},function(e,t,n){"use strict";function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),o=n(10),a=function(){function e(t){var n=this;i(this,e),this._handleKeyDown=function(e){switch(e.key){case"ArrowUp":case"ArrowLeft":return void n.pager.prev();case"ArrowDown":case"ArrowRight":case" ":return void n.pager.next();case"Home":return void n.pager.setCurrentView(0,0);case"End":return void n.pager.setCurrentView(0,n.pager.views.length-1)}for(var t=(0,o.clamp)(n.pager.views.length,0,9),i=1;i<=t;i++)+e.key===i&&n.pager.setCurrentView(0,i-1)},this.pager=t}return r(e,[{key:"getEvents",value:function(){var e={};return this.pager.options.accessibility&&(e.onKeyDown=this._handleKeyDown),e}}]),e}();t.default=a,e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function r(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function o(e,t){var n={};for(var i in e)t.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(e,i)&&(n[i]=e[i]);return n}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},f=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),l=n(2),p=i(l),h=n(3),v=(i(h),n(4)),d=n(5),w=i(d),y=n(14),g=i(y),m=n(15),b=i(m),_=n(16)("transform"),P=function(e){function t(){var e,n,i,r;a(this,t);for(var o=arguments.length,u=Array(o),c=0;c<o;c++)u[c]=arguments[c];return n=i=s(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(u))),i.state={instant:!1},i._currentTween=0,i._handleOnRest=function(){var e=i.context.viewPager;e.options.infinite&&!i.state.instant&&(e.resetViews(),i._setValueInstantly(!0,!0)),e.emit("rest")},r=n,s(i,r)}return u(t,e),f(t,[{key:"componentDidMount",value:function(){var e=this,t=this.context.viewPager;t.addTrack((0,h.findDOMNode)(this)),this._setValueInstantly(!0,!0),t.on("hydrated",function(){return e._setValueInstantly(!0,!0)}),t.on("swipeMove",function(){return e._setValueInstantly(!0)}),t.on("swipeEnd",function(){return e._setValueInstantly(!1)}),this.setCurrentView(t.options.currentView),t.on("updateView",function(t){e.setCurrentView(t)})}},{key:"setCurrentView",value:function(e){this.context.viewPager.setCurrentView(0,(0,b.default)(e,this.props.children))}},{key:"componentWillReceiveProps",value:function(e){var t=e.instant;this.props.instant!==t&&this.setState({instant:t})}},{key:"_setValueInstantly",value:function(e,t){var n=this;this.setState({instant:e},function(){t&&n.setState({instant:!1})})}},{key:"_getTrackStyle",value:function(){var e=this.context.viewPager.trackPosition;return this.state.instant||(e=(0,v.spring)(e,this.props.springConfig)),{trackPosition:e}}},{key:"_renderViews",value:function(){return l.Children.map(this.props.children,function(e){return p.default.createElement(g.default,{children:e})})}},{key:"render",value:function(){var e=this,t=this.context.viewPager,n=this.props,i=n.tag,a=(n.springConfig,o(n,["tag","springConfig"]));return p.default.createElement(v.Motion,{style:this._getTrackStyle(),onRest:this._handleOnRest},function(n){var o=n.trackPosition,s=t.getPositionValue(o),u=s.x,f=s.y,p=c({},a.style,r({},_,"translate3d("+u+"px, "+f+"px, 0)"));return t.setViewStyles(o),(0,l.createElement)(i,c({},a,{style:p}),e._renderViews())})}}]),t}(l.Component);P.propTypes={springConfig:l.PropTypes.objectOf(l.PropTypes.number)},P.defaultProps={tag:"div",springConfig:v.presets.noWobble},P.contextTypes={viewPager:l.PropTypes.instanceOf(w.default)},t.default=P,e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function r(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function o(e,t){var n={};for(var i in e)t.indexOf(i)>=0||Object.prototype.hasOwnProperty.call(e,i)&&(n[i]=e[i]);return n}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},f=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),l=n(2),p=(i(l),n(3)),h=(i(p),n(5)),v=i(h),d=function(e){function t(){return a(this,t),s(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return u(t,e),f(t,[{key:"componentDidMount",value:function(){this._viewInstance=this.context.viewPager.addView((0,p.findDOMNode)(this)),this.forceUpdate()}},{key:"componentWillUnmount",value:function(){this.context.viewPager.removeView(this._viewInstance)}},{key:"render",value:function(){var e=this.context.viewPager,t=e.options,n=t.viewsToShow,i=t.axis,a=this.props,s=a.children,u=o(a,["children"]),f=l.Children.only(s),p=c({},f.props.style,{position:"relative",top:0,left:0});if("auto"!==n&&(p["x"===i?"width":"height"]=100/n+"%"),this._viewInstance){this._viewInstance.isCurrent||(p.position="absolute");var h="y"===i?"top":"left";p=c({},p,r({},h,this._viewInstance.getPosition()),e.animationBus.getStyles(this._viewInstance))}return(0,l.cloneElement)(f,c({},u,{style:p}))}}]),t}(l.Component);d.contextTypes={viewPager:l.PropTypes.instanceOf(v.default)},t.default=d,e.exports=t.default},function(e,t,n){"use strict";function i(e,t){var n=null;return r.Children.forEach(t,function(t,i){if(t.key===e||i===e)return void(n=i)}),n}Object.defineProperty(t,"__esModule",{value:!0}),t.default=i;var r=n(2);e.exports=t.default},function(e,t){e.exports=i},function(e,t){"use strict";function n(e,t,n){for(var i in t)t.hasOwnProperty(i)&&!n[i]&&(e[i]=t[i]);return e}Object.defineProperty(t,"__esModule",{value:!0}),t.default=n,e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},u=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),c=n(2),f=(i(c),n(5)),l=i(f),p=function(e){function t(){var e,n,i,a;r(this,t);for(var s=arguments.length,u=Array(s),c=0;c<s;c++)u[c]=arguments[c];return n=i=o(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(u))),i._handleLoaded=function(e){i.context.viewPager.hydrate(),"function"==typeof i.props.onLoad&&i.props.onLoad(e)},a=n,o(i,a)}return a(t,e),u(t,[{key:"render",value:function(){return(0,c.createElement)("img",s({},this.props,{onLoad:this._handleLoaded}))}}]),t}(c.Component);p.contextTypes={viewPager:c.PropTypes.instanceOf(l.default)},t.default=p,e.exports=t.default}])});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("react-dom"),require("react-motion"),require("get-prefix")):"function"==typeof define&&define.amd?define(["react","react-dom","react-motion","get-prefix"],t):"object"==typeof exports?exports.ReactViewPager=t(require("react"),require("react-dom"),require("react-motion"),require("get-prefix")):e.ReactViewPager=t(e.React,e.ReactDOM,e.ReactMotion,e.getPrefix)}(this,function(e,t,n,r){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist/",t(0)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0}),t.utils=t.AnimatedView=t.ImageView=t.Track=t.Frame=t.ViewPager=void 0;var i=n(1),o=r(i),a=n(10),s=r(a),u=n(16),c=r(u),f=n(20),p=r(f),l=n(21),h=r(l),y=n(9),d=r(y);t.ViewPager=o.default,t.Frame=s.default,t.Track=c.default,t.ImageView=p.default,t.AnimatedView=h.default,t.utils=d.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function s(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var u=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),c=n(2),f=(r(c),n(3)),p=r(f),l=function(e){function t(e){o(this,t);var n=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e)),r=new p.default,i=function(){return n.forceUpdate()};return r.on("viewChange",i),r.on("hydrated",i),n._pager=r,n}return s(t,e),u(t,[{key:"getChildContext",value:function(){return{pager:this._pager}}},{key:"componentWillUnmount",value:function(){this._pager.destroy()}},{key:"getInstance",value:function(){return this._pager}},{key:"render",value:function(){var e=this.props,t=e.tag,n=i(e,["tag"]);return(0,c.createElement)(t,n)}}]),t}(c.Component);l.childContextTypes={pager:c.PropTypes.instanceOf(p.default)},l.propTypes={tag:c.PropTypes.string},l.defaultProps={tag:"div"},t.default=l,e.exports=t.default},function(t,n){t.exports=e},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function s(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},c=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),f=n(4),p=r(f),l=n(5),h=r(l),y=n(8),d=r(y),v=n(9),g=function(e){function t(e){var n=e.index,r=i(e,["index"]);o(this,t);var s=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,r));return s.index=n,s.isCurrent=!1,s.setTarget(),s.setOrigin(),s}return s(t,e),c(t,[{key:"setTarget",value:function(){var e=this.pager.getStartCoords(this.index);this.pager.options.align&&(e+=this.pager.getAlignOffset(this)),this.target=e}},{key:"setOrigin",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.pager.trackPosition;this.origin=this.target-e}}]),t}(d.default),w=function(e){function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};o(this,t);var n=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this));return n.resize=function(){n.hydrate(),n.emit("resize")},n.hydrate=function(){n.frame&&n.frame.setSize(),n.track&&n.track.setSize(),n.views.forEach(function(e){e.setSize(),e.setTarget()}),n.setPositionValue(),n.setViewStyles(),n.emit("hydrated")},n.options=u({viewsToShow:"auto",viewsToMove:1,align:0,contain:!1,axis:"x",autoSize:!1,animations:[],infinite:!1,instant:!1,swipe:!0,swipeThreshold:.5,flickTimeout:300,accessibility:!0},e),n.views=[],n.currentIndex=0,n.currentView=null,n.currentTween=0,n.trackPosition=0,n.isSwiping=!1,n.animationBus=new h.default({animations:n.options.animations,origin:function(e){return e.origin}}),"undefined"==typeof window?a(n):(window.addEventListener("resize",n.resize),n)}return s(t,e),c(t,[{key:"setOptions",value:function(e){this.options=u({},this.options,e),this.animationBus.animations=this.options.animations}},{key:"destroy",value:function(){window.removeEventListener("resize",this.resize)}},{key:"addFrame",value:function(e){this.frame=new d.default({node:e,pager:this}),this.hydrate()}},{key:"addTrack",value:function(e){this.track=new d.default({node:e,pager:this}),this.hydrate()}},{key:"addView",value:function(e){var t=this.views.length,n=new g({node:e,index:t,pager:this});return this.views.push(n),this.currentView||this.setCurrentView(0,t,!0),this.emit("viewAdded"),this.hydrate(),n}},{key:"removeView",value:function(e){this.views=this.views.filter(function(t){return e!==t}),this.emit("viewRemoved"),this.hydrate()}},{key:"prev",value:function(){this.setCurrentView(-1)}},{key:"next",value:function(){this.setCurrentView(1)}},{key:"setCurrentView",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this.currentIndex,n=arguments[2],r=this.options,i=r.viewsToMove,o=r.infinite,a=t+e*i,s=this.currentIndex,u=o?a:(0,v.clamp)(a,0,this.views.length-1),c=this.getView(s),f=this.getView(u);if(this.currentIndex=u,this.currentView=f,c.isCurrent=!1,f.isCurrent=!0,this.setPositionValue(),!n){var p=this.getNumericViewsToShow(),l=this.views.length;this.emit("viewChange",{from:(0,v.range)(s,s+p,l),to:(0,v.range)(u,u+p,l)})}}},{key:"setPositionValue",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.currentView?this.currentView.target:0;if(!this.isSwiping){var t=this.options,n=t.viewsToShow,r=t.autoSize,i=t.infinite,o=t.contain,a=this.getTrackSize();if(i&&(e-=(Math.floor(this.currentIndex/this.views.length)||0)*a),o){var s="auto"===n&&r||n<=1?0:this.getFrameSize(!1);e=(0,v.clamp)(e,s-a,0)}}this.trackPosition=e}},{key:"setViewStyles",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,t=this.options,n=t.infinite,r=t.align,i=this.getFrameSize(),o=this.getTrackSize(),a=(0,v.modulo)(e,-o);this.views.reduce(function(t,s,u){var c=s.getSize(),f=t+c,p=t;return n&&(f+c*r<Math.abs(a)?p+=o:t>i-a&&(p-=o)),s.setPosition(p),s.setOrigin(e),f},0)}},{key:"getNumericViewsToShow",value:function(){return isNaN(this.options.viewsToShow)?1:this.options.viewsToShow}},{key:"getMaxDimensions",value:function(e){var t=this.options.axis,n=e.map(function(e){return e.getSize("width")}),r=e.map(function(e){return e.getSize("height")});return{width:"x"===t?(0,v.sum)(n):(0,v.max)(n),height:"y"===t?(0,v.sum)(r):(0,v.max)(r)}}},{key:"getFrameSize",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.options.autoSize,t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=this.options,r=n.infinite,i=n.contain,o=n.axis,a={width:0,height:0};if(this.views.length)if(e){var s=[],u=isNaN(this.options.viewsToShow)?1:this.options.viewsToShow,c=this.currentIndex,f=this.currentIndex+(u-1);if(i){c=(0,v.clamp)(c,0,this.views.length-u),f=(0,v.clamp)(f,0,this.views.length-1);for(var p=c;p<=f;p++)s.push(this.getView(p))}else for(var l=c;l<=f;l++){var h=r?(0,v.modulo)(l,this.views.length):(0,v.clamp)(l,0,this.views.length-1);s.push(this.getView(h))}a=this.getMaxDimensions(s)}else this.frame&&(a={width:this.frame.getSize("width"),height:this.frame.getSize("height")});return t?a:a["x"===o?"width":"height"]}},{key:"getTrackSize",value:function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=e?this.views.length:this.views.length-1,n=0;return this.views.slice(0,t).forEach(function(e){n+=e.getSize()}),n}},{key:"getView",value:function(e){return this.views[(0,v.modulo)(e,this.views.length)]}},{key:"getStartCoords",value:function(e){var t=0;return this.views.slice(0,e).forEach(function(e){t-=e.getSize()}),t}},{key:"getAlignOffset",value:function(e){var t=this.getFrameSize(!1),n=e.getSize();return(t-n)*this.options.align}},{key:"getPositionValue",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.trackPosition,t=this.options,n=t.infinite,r=(t.contain,{x:0,y:0});if(this.currentTween=e,n){var i=this.getTrackSize();e=(0,v.modulo)(e,-i)||0}return this.emit("scroll",{progress:e/this.getTrackSize(!1),position:e}),r[this.options.axis]=e,r}},{key:"resetViews",value:function(){this.setCurrentView(0,(0,v.modulo)(this.currentIndex,this.views.length),!0)}}]),t}(p.default);t.default=w,e.exports=t.default},function(e,t){"use strict";e.exports=function(e){var t={},n=[];e=e||this,e.on=function(e,n,r){(t[e]=t[e]||[]).push([n,r])},e.off=function(e,r){e||(t={});for(var i=t[e]||n,o=i.length=r?i.length:0;o--;)r==i[o][0]&&i.splice(o,1)},e.emit=function(e){for(var r,i=t[e]||n,o=i.length>0?i.slice(0,i.length):i,a=0;r=o[a++];)r[0].apply(r[1],n.slice.call(arguments,1))}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=n(6),s=r(a),u={perspective:"px",rotate:"deg",rotateX:"deg",rotateY:"deg",rotateZ:"deg",scale:"",scaleX:"",scaleY:"",scaleZ:"",skew:"deg",skewX:"deg",skewY:"deg",translateX:"px",translateY:"px",translateZ:"px"},c=Object.keys(u),f=function(){function e(t){var n=t.animations,r=t.element,o=t.origin;i(this,e),this.animations=n,this.element=r,this.origin=o}return o(e,[{key:"getStyles",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.element,t=this.origin(e),n=[],r={};return this.animations.forEach(function(e){var i=e.prop,o=e.unit||u[i]||"",a=(0,s.default)(e.stops)(t);c.indexOf(i)>-1?n.push(i+"("+a+o+")"):r[i]=""+a+o}),n.length&&(r.transform=n.join(" ")),r}},{key:"applyStyles",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.element,t=this.getStyles(e);Object.keys(t).forEach(function(n){return e.style[n]=t[n]})}}]),e}();t.default=f,e.exports=t.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e){var t=[],n=[],r=[],i=[];e.forEach(function(e){var o=s(e,2),a=o[0],u=o[1];t.push(a),isNaN(u)?(n.push(parseInt(u.substr(1,2),16)),r.push(parseInt(u.substr(3,2),16)),i.push(parseInt(u.substr(5,2),16))):n.push(u)});var o=(0,c.default)(t,n);if(!r.length||!i.length)return function(e){return o(e)};var u=function(){var e=(0,c.default)(t,r),n=(0,c.default)(t,i);return{v:function(t){return"rgb("+Math.round(o(t))+", "+Math.round(e(t))+", "+Math.round(n(t))+")"}}}();return"object"===("undefined"==typeof u?"undefined":a(u))?u.v:void 0}var o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};Object.defineProperty(t,"__esModule",{value:!0});var a="function"==typeof Symbol&&"symbol"===o(Symbol.iterator)?function(e){return"undefined"==typeof e?"undefined":o(e)}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":"undefined"==typeof e?"undefined":o(e)},s=function(){function e(e,t){var n=[],r=!0,i=!1,o=void 0;try{for(var a,s=e[Symbol.iterator]();!(r=(a=s.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(e){i=!0,o=e}finally{try{!r&&s.return&&s.return()}finally{if(i)throw o}}return n}return function(t,n){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,n);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}();t.default=i;var u=n(7),c=r(u);e.exports=t.default},function(e,t){"use strict";function n(e,t){return function(n){if(n<=e[0])return t[0];if(n>=e[e.length-1])return t[e.length-1];for(var r=0,i=e.length-1;i-r>1;){var o=r+i>>1;n<e[o]?i=o:r=o}return t[r]+(t[i]-t[r])/(e[i]-e[r])*(n-e[r])}}Object.defineProperty(t,"__esModule",{value:!0}),t.default=n,e.exports=t.default},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),i=function(){function e(t){var r=t.node,i=t.pager,o=t.width,a=t.height;n(this,e),this.node=r,this.pager=i,this.x=this.y=0,this.setSize(o,a)}return r(e,[{key:"setSize",value:function(e,t){this.width=e||this.node.offsetWidth,this.height=t||this.node.offsetHeight}},{key:"setPosition",value:function(e){this[this.pager.options.axis]=e}},{key:"getSize",value:function(e){if("width"===e||"height"===e)return this[e];var t=this.pager.options.axis;return this["x"===t?"width":"height"]}},{key:"getPosition",value:function(){return this[this.pager.options.axis]}}]),e}();t.default=i,e.exports=t.default},function(e,t){"use strict";function n(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}function r(e,t){return(e%t+t)%t}function i(e,t,n){return Math.min(Math.max(t,e),n)}function o(e){return e.reduce(function(e,t){return e+t},0)}function a(e){return Math.max.apply(null,e)}function s(e,t,i){return[].concat(n(Array(t-e))).map(function(t,n){return r(e+n,i)})}Object.defineProperty(t,"__esModule",{value:!0}),t.modulo=r,t.clamp=i,t.sum=o,t.max=a,t.range=s},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},u=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),c=n(2),f=r(c),p=n(11),l=(r(p),n(12)),h=n(3),y=r(h),d=n(13),v=r(d),g=n(14),w=r(g),b=n(15),m=r(b),_={tag:c.PropTypes.any,autoSize:c.PropTypes.bool,accessibility:c.PropTypes.bool,springConfig:c.PropTypes.objectOf(c.PropTypes.number)},O=function(e){function t(e){i(this,t);var n=o(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n._setFrameSize=function(){var e=n.context.pager.getFrameSize(!0,!0);e.width&&e.height&&n.setState(e,function(){n.state.instant&&n.setState({instant:!1})})},n.state={width:0,height:0,instant:!0},n}return a(t,e),u(t,[{key:"componentWillMount",value:function(){var e=this.context.pager;e.setOptions(this.props),this._swipe=new v.default(e),this._keyboard=new w.default(e)}},{key:"componentDidMount",value:function(){var e=this.context.pager;e.addFrame((0,p.findDOMNode)(this)),this._setFrameSize(),e.on("viewAdded",this._setFrameSize),e.on("viewChange",this._setFrameSize)}},{key:"_getFrameStyle",value:function(){var e=this.state,t=e.width,n=e.height,r=e.instant;return{maxWidth:r?t:(0,l.spring)(t),height:r?n:(0,l.spring)(n)}}},{key:"_renderFrame",value:function(e){var t=this.props,n=t.tag,r=t.accessibility,i=(0,m.default)(s({},this._swipe.getEvents(),this._keyboard.getEvents(),{tabIndex:r?0:null}),this.props,_);return(0,c.createElement)(n,s({},i,{style:s({},e,i.style)}))}},{key:"render",value:function(){var e=this,t=(this.state.height,{position:"relative",overflow:"hidden"});return this.props.autoSize?f.default.createElement(l.Motion,{style:this._getFrameStyle()},function(n){return n.maxWidth&&(t.maxWidth=n.maxWidth),n.height&&(t.height=n.height),e._renderFrame(t)}):this._renderFrame(t)}}]),t}(c.Component);O.contextTypes={pager:c.PropTypes.instanceOf(y.default)},O.propTypes=_,O.defaultProps={tag:"div",autoSize:!1,accessibility:!0,springConfig:l.presets.noWobble},t.default=O,e.exports=t.default},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e){return e.touches&&e.touches[0]||e}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),o=function(){function e(t){var i=this;n(this,e),this._onSwipeStart=function(e){var t=r(e),n=t.pageX,o=t.pageY;i.pager.isSwiping=!0,i._swipeStart={x:n,y:o},i._swipeDiff={x:0,y:0},i._isFlick=!0,setTimeout(function(){i._isFlick=!1},i.pager.options.flickTimeout),i.pager.emit("swipeStart")},this._onSwipeMove=function(e){if(i.pager.isSwiping){var t=i.pager.options,n=t.swipeThreshold,o=t.axis,a=r(e),s=a.pageX,u=a.pageY;if(i._trackStart||(i._trackStart=i.pager.currentTween),i._swipeDiff={x:i._swipeStart.x-s,y:i._swipeStart.y-u},i._isSwipe(n)){e.preventDefault(),e.stopPropagation();var c=i._swipeDiff[o],f=i._trackStart-c;i.pager.setPositionValue(f),i.pager.emit("swipeMove")}}},this._onSwipeEnd=function(){var e=i.pager,t=(e.frame,e.currentView),n=(e.trackPosition,i.pager.options),r=n.swipeThreshold,o=n.viewsToMove,a=n.axis,s=(n.infinite,i._isFlick?r:t.getSize()*o*r);i.pager.isSwiping=!1,i._trackStart=!1,(i._swipeDiff.x||i._swipeDiff.y)&&(i._isSwipe(s)?i._swipeDiff[a]<0?i.pager.prev():i.pager.next():i.pager.setPositionValue()),i.pager.emit("swipeEnd")},this._onSwipePast=function(){i.pager.isSwiping&&i._onSwipeEnd()},this.pager=t,this._trackStart=!1,this._swipeStart=this._swipeDiff={x:0,y:0}}return i(e,[{key:"_isSwipe",value:function(e){var t=this._swipeDiff,n=t.x,r=t.y;return"x"===this.pager.options.axis?Math.abs(n)>Math.max(e,Math.abs(r)):Math.abs(n)<Math.max(e,Math.abs(r))}},{key:"getEvents",value:function(){var e=this.pager.options.swipe,t={};return e!==!0&&"mouse"!==e||(t.onMouseDown=this._onSwipeStart,t.onMouseMove=this._onSwipeMove,t.onMouseUp=this._onSwipeEnd,t.onMouseLeave=this._onSwipePast),e!==!0&&"touch"!==e||(t.onTouchStart=this._onSwipeStart,t.onTouchMove=this._onSwipeMove,t.onTouchEnd=this._onSwipeEnd),t}}]),e}();t.default=o,e.exports=t.default},function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),o=n(9),a=function(){function e(t){var n=this;r(this,e),this._handleKeyDown=function(e){switch(e.key){case"ArrowUp":case"ArrowLeft":return void n.pager.prev();case"ArrowDown":case"ArrowRight":case" ":return void n.pager.next();case"Home":return void n.pager.setCurrentView(0,0);case"End":return void n.pager.setCurrentView(0,n.pager.views.length-1)}for(var t=(0,o.clamp)(n.pager.views.length,0,9),r=1;r<=t;r++)+e.key===r&&n.pager.setCurrentView(0,r-1)},this.pager=t}return i(e,[{key:"getEvents",value:function(){var e={};return this.pager.options.accessibility&&(e.onKeyDown=this._handleKeyDown),e}}]),e}();t.default=a,e.exports=t.default},function(e,t){"use strict";function n(e,t,n){for(var r in t)t.hasOwnProperty(r)&&!n[r]&&(e[r]=t[r]);return e}Object.defineProperty(t,"__esModule",{value:!0}),t.default=n,e.exports=t.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function o(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},f=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},p=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),l=n(2),h=r(l),y=n(11),d=(r(y),n(12)),v=n(3),g=r(v),w=n(17),b=r(w),m=n(18),_=r(m),O=n(15),x=r(O),P=n(19)("transform"),S=function(e){function t(){var e,n,r,i;a(this,t);for(var o=arguments.length,u=Array(o),c=0;c<o;c++)u[c]=arguments[c];return n=r=s(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(u))),r.state={x:0,y:0},i=n,s(r,i)}return u(t,e),p(t,[{key:"componentWillReceiveProps",value:function(e){var t=this,n=e.trackPosition,r=this.context.pager;r.setViewStyles(n),this.setState(r.getPositionValue(n)),this.props.trackPosition!==n&&requestAnimationFrame(function(){return t.props.onScroll(n/r.getTrackSize(!1)*-1,n)})}},{key:"_renderViews",value:function(){return l.Children.map(this.props.children,function(e){return h.default.createElement(b.default,{children:e})})}},{key:"render",value:function(){var e=this.props,t=e.tag,n=(e.trackPosition,o(e,["tag","trackPosition"])),r=this.state,a=r.x,s=r.y,u=f({},n.style,i({},P,"translate3d("+a+"px, "+s+"px, 0)"));return(0,l.createElement)(t,f({},n,{style:u}),this._renderViews())}}]),t}(l.Component);S.propTypes=k,S.contextTypes={pager:l.PropTypes.instanceOf(g.default)};var T=function(){return null},k={tag:l.PropTypes.any,currentView:l.PropTypes.any,viewsToShow:l.PropTypes.oneOfType([l.PropTypes.number,l.PropTypes.oneOf(["auto"])]),viewsToMove:l.PropTypes.number,align:l.PropTypes.number,contain:l.PropTypes.bool,axis:l.PropTypes.oneOf(["x","y"]),animations:l.PropTypes.array,infinite:l.PropTypes.bool,instant:l.PropTypes.bool,swipe:l.PropTypes.oneOf([!0,!1,"mouse","touch"]),swipeThreshold:l.PropTypes.number,flickTimeout:l.PropTypes.number,springConfig:l.PropTypes.objectOf(l.PropTypes.number),onSwipeStart:l.PropTypes.func,onSwipeMove:l.PropTypes.func,onSwipeEnd:l.PropTypes.func,onScroll:l.PropTypes.func,beforeViewChange:l.PropTypes.func,afterViewChange:l.PropTypes.func},j=function(e){function t(){var e,n,r,i;a(this,t);for(var o=arguments.length,u=Array(o),c=0;c<o;c++)u[c]=arguments[c];return n=r=s(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(u))),r.state={instant:!1},r._currentTween=0,r._handleOnRest=function(){r.props.infinite&&!r.state.instant&&(r.context.pager.resetViews(),r._setValueInstantly(!0,!0)),r.props.afterViewChange()},i=n,s(r,i)}return u(t,e),p(t,[{key:"componentWillMount",value:function(){this.context.pager.setOptions(this.props)}},{key:"componentDidMount",value:function(){var e=this,t=this.context.pager;t.addTrack((0,y.findDOMNode)(this)),t.on("hydrated",function(){return e._setValueInstantly(!0,!0)}),t.on("swipeMove",function(){return e._setValueInstantly(!0)}),t.on("swipeEnd",function(){return e._setValueInstantly(!1)}),t.on("swipeStart",this.props.onSwipeStart),t.on("swipeMove",this.props.onSwipeMove),t.on("swipeEnd",this.props.onSwipeEnd),t.on("viewChange",this.props.beforeViewChange)}},{key:"componentWillReceiveProps",value:function(e){var t=e.currentView,n=e.instant,r=e.children;this.props.instant!==n&&this._setValueInstantly(n),void 0!==("undefined"==typeof t?"undefined":c(t))&&this.props.currentView!==t&&this.scrollTo((0,_.default)(t,r))}},{key:"prev",value:function(){this.context.pager.prev()}},{key:"next",value:function(){this.context.pager.next()}},{key:"scrollTo",value:function(e){this.context.pager.setCurrentView(0,e)}},{key:"_setValueInstantly",value:function(e,t){var n=this;this.setState({instant:e},function(){t&&n.setState({instant:!1})})}},{key:"_getTrackStyle",value:function(){var e=this.context.pager.trackPosition;return this.state.instant||(e=(0,d.spring)(e,this.props.springConfig)),{trackPosition:e}}},{key:"render",value:function(){var e=this.props,t=e.tag,n=e.onScroll,r=o(e,["tag","onScroll"]);return h.default.createElement(d.Motion,{style:this._getTrackStyle(),onRest:this._handleOnRest},function(e){var i=e.trackPosition;return(0,l.createElement)(S,(0,x.default)({trackPosition:i,tag:t,onScroll:n},r,k))})}}]),t}(l.Component);j.propTypes=k,j.defaultProps={tag:"div",currentView:0,viewsToShow:1,viewsToMove:1,align:0,contain:!1,axis:"x",infinite:!1,instant:!1,swipe:!0,swipeThreshold:.5,flickTimeout:300,springConfig:d.presets.noWobble,onSwipeStart:T,onSwipeMove:T,onSwipeEnd:T,onScroll:T,beforeViewChange:T,afterViewChange:T},j.contextTypes={pager:l.PropTypes.instanceOf(g.default)},t.default=j,e.exports=t.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function o(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},f=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),p=n(2),l=(r(p),n(11)),h=(r(l),n(3)),y=r(h),d=function(e){function t(){var e,n,r,i;a(this,t);for(var o=arguments.length,u=Array(o),c=0;c<o;c++)u[c]=arguments[c];return n=r=s(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(u))),r._viewInstance=null,i=n,s(r,i)}return u(t,e),f(t,[{key:"getChildContext",value:function(){return{view:this._viewInstance}}},{key:"componentDidMount",value:function(){this._viewInstance=this.context.pager.addView((0,l.findDOMNode)(this)),this.forceUpdate()}},{key:"componentWillUnmount",value:function(){this.context.pager.removeView(this._viewInstance)}},{key:"render",value:function(){var e=this.context.pager,t=e.options,n=t.viewsToShow,r=t.axis,a=this.props,s=a.children,u=o(a,["children"]),f=p.Children.only(s),l=c({},f.props.style,{position:"relative",top:0,left:0});if("auto"!==n&&(l["x"===r?"width":"height"]=100/n+"%"),this._viewInstance){this._viewInstance.isCurrent||(l.position="absolute");var h="y"===r?"top":"left";l=c({},l,i({},h,this._viewInstance.getPosition()),e.animationBus.getStyles(this._viewInstance))}return(0,p.cloneElement)(f,c({},u,{style:l}))}}]),t}(p.Component);d.contextTypes={pager:p.PropTypes.instanceOf(y.default)},d.childContextTypes={view:p.PropTypes.any},t.default=d,e.exports=t.default},function(e,t,n){"use strict";function r(e,t){var n=null;return i.Children.forEach(t,function(t,r){if(t.key===e||r===e)return void(n=r)}),n}Object.defineProperty(t,"__esModule",{value:!0}),t.default=r;var i=n(2);e.exports=t.default},function(e,t){e.exports=r},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},u=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),c=n(2),f=(r(c),n(3)),p=r(f),l=function(e){function t(){var e,n,r,a;i(this,t);for(var s=arguments.length,u=Array(s),c=0;c<s;c++)u[c]=arguments[c];return n=r=o(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(u))),r._handleLoaded=function(e){r.context.pager.hydrate(),
+"function"==typeof r.props.onLoad&&r.props.onLoad(e)},a=n,o(r,a)}return a(t,e),u(t,[{key:"render",value:function(){return(0,c.createElement)("img",s({},this.props,{onLoad:this._handleLoaded}))}}]),t}(c.Component);l.contextTypes={pager:c.PropTypes.instanceOf(p.default)},t.default=l,e.exports=t.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function s(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},c=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),f=n(2),p=(r(f),n(5)),l=r(p),h=n(3),y=r(h),d=n(15),v=r(d),g={tag:f.PropTypes.string,index:f.PropTypes.number,animations:f.PropTypes.array},w=function(e){function t(){return o(this,t),a(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return s(t,e),c(t,[{key:"componentWillMount",value:function(){var e=this.props.animations;e.length&&(this._animationBus=new l.default({animations:e,origin:function(e){return e.origin}}))}},{key:"render",value:function(){var e=this.props,t=e.tag,n=e.index,r=i(e,["tag","index"]),o=u({},r.style);if(this._animationBus){var a=this.context.view||this.context.pager.getView(n);a&&(o=u({},r.style,this._animationBus.getStyles(a)))}return(0,f.createElement)(t,(0,v.default)({style:o},this.props,g))}}]),t}(f.Component);w.contextTypes={pager:f.PropTypes.instanceOf(y.default),view:f.PropTypes.any},w.propTypes=g,w.defaultProps={tag:"div",animations:[]},t.default=w,e.exports=t.default}])});

lib/Frame.js

@@ -9,4 +9,2 @@ 'use strict';
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@@ -36,10 +34,2 @@
 
-var _Track = require('./Track');
-
-var _Track2 = _interopRequireDefault(_Track);
-
-var _View = require('./View');
-
-var _View2 = _interopRequireDefault(_View);
-
 var _specialAssign = require('./special-assign');
@@ -57,46 +47,23 @@
 
-var noop = function noop() {
-  return null;
-};
 var checkedProps = {
-  tag: _react.PropTypes.string,
-  currentView: _react.PropTypes.any,
-  viewsToShow: _react.PropTypes.any,
-  viewsToMove: _react.PropTypes.number,
-  align: _react.PropTypes.number,
-  contain: _react.PropTypes.bool,
-  axis: _react.PropTypes.oneOf(['x', 'y']),
+  tag: _react.PropTypes.any,
   autoSize: _react.PropTypes.bool,
-  animations: _react.PropTypes.array,
-  infinite: _react.PropTypes.bool,
-  instant: _react.PropTypes.bool,
-  swipe: _react.PropTypes.oneOf([true, false, 'mouse', 'touch']),
-  swipeThreshold: _react.PropTypes.number,
-  flickTimeout: _react.PropTypes.number,
   accessibility: _react.PropTypes.bool,
-  springConfig: _react2.default.PropTypes.objectOf(_react2.default.PropTypes.number),
-  // rightToLeft: PropTypes.bool,
-  // lazyLoad: PropTypes.bool,
-  onSwipeStart: _react.PropTypes.func,
-  onSwipeMove: _react.PropTypes.func,
-  onSwipeEnd: _react.PropTypes.func,
-  onScroll: _react.PropTypes.func,
-  beforeViewChange: _react.PropTypes.func,
-  afterViewChange: _react.PropTypes.func
+  springConfig: _react.PropTypes.objectOf(_react.PropTypes.number)
 };
 
-var ViewPager = function (_Component) {
-  _inherits(ViewPager, _Component);
+var Frame = function (_Component) {
+  _inherits(Frame, _Component);
 
-  function ViewPager(props) {
-    _classCallCheck(this, ViewPager);
+  function Frame(props) {
+    _classCallCheck(this, Frame);
 
-    var _this = _possibleConstructorReturn(this, (ViewPager.__proto__ || Object.getPrototypeOf(ViewPager)).call(this, props));
+    var _this = _possibleConstructorReturn(this, (Frame.__proto__ || Object.getPrototypeOf(Frame)).call(this, props));
 
     _this._setFrameSize = function () {
-      var frameSize = _this._viewPager.getFrameSize(true, true);
+      var frameSize = _this.context.pager.getFrameSize(true, true);
 
       if (frameSize.width && frameSize.height) {
         _this.setState(frameSize, function () {
-          // we need to unset instant flag now that React Motion has dimensions to animate to
+          // we need to unset the instant flag now that React Motion has dimensions to animate to
           if (_this.state.instant) {
@@ -109,6 +76,2 @@ _this.setState({ instant: false });
 
-    _this._viewPager = new _Pager2.default(props);
-    _this._swipe = new _Swipe2.default(_this._viewPager);
-    _this._keyboard = new _Keyboard2.default(_this._viewPager);
-
     _this.state = {
@@ -122,8 +85,12 @@ width: 0,
 
-  _createClass(ViewPager, [{
-    key: 'getChildContext',
-    value: function getChildContext() {
-      return {
-        viewPager: this._viewPager
-      };
+  _createClass(Frame, [{
+    key: 'componentWillMount',
+    value: function componentWillMount() {
+      var pager = this.context.pager;
+
+
+      pager.setOptions(this.props);
+
+      this._swipe = new _Swipe2.default(pager);
+      this._keyboard = new _Keyboard2.default(pager);
     }
@@ -133,68 +100,13 @@ }, {
     value: function componentDidMount() {
-      var _this2 = this;
+      var pager = this.context.pager;
 
-      this._viewPager.addFrame((0, _reactDom.findDOMNode)(this));
 
+      pager.addFrame((0, _reactDom.findDOMNode)(this));
+
       // set frame size initially and then based on certain view events
       this._setFrameSize();
-      this._viewPager.on('viewAdded', this._setFrameSize);
-
-      // update the whole tree on hydration so children update with any new values
-      this._viewPager.on('hydrated', function () {
-        _this2.forceUpdate();
-      });
-
-      // fire before view callback and set frame size on view change
-      this._viewPager.on('viewChange', function (indicies) {
-        _this2.props.beforeViewChange(indicies);
-        _this2._setFrameSize();
-      });
-
-      // prop callbacks
-      this._viewPager.on('swipeStart', this.props.onSwipeStart);
-      this._viewPager.on('swipeMove', this.props.onSwipeMove);
-      this._viewPager.on('swipeEnd', this.props.onSwipeEnd);
-      this._viewPager.on('scroll', this.props.onScroll);
-      this._viewPager.on('rest', this.props.afterViewChange);
+      pager.on('viewAdded', this._setFrameSize);
+      pager.on('viewChange', this._setFrameSize);
     }
   }, {
-    key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(_ref) {
-      var currentView = _ref.currentView,
-          children = _ref.children;
-
-      // update state with new index if necessary
-      if ((typeof currentView === 'undefined' ? 'undefined' : _typeof(currentView)) !== undefined && this.props.currentView !== currentView) {
-        this.scrollTo(currentView);
-      }
-    }
-  }, {
-    key: 'componentWillUnmount',
-    value: function componentWillUnmount() {
-      this._viewPager.destroy();
-    }
-  }, {
-    key: 'getInstance',
-    value: function getInstance() {
-      return this._viewPager;
-    }
-  }, {
-    key: 'prev',
-    value: function prev() {
-      this._viewPager.prev();
-    }
-  }, {
-    key: 'next',
-    value: function next() {
-      this._viewPager.next();
-    }
-  }, {
-    key: 'scrollTo',
-    value: function scrollTo(view) {
-      // this is pretty anti-react, but since we might not know the children we need
-      // to listen for this event in Track and update it there to allow people the ability
-      // to move to a view by it's key
-      this._viewPager.emit('updateView', view);
-    }
-  }, {
     key: '_getFrameStyle',
@@ -217,4 +129,2 @@ value: function _getFrameStyle() {
           tag = _props.tag,
-          axis = _props.axis,
-          autoSize = _props.autoSize,
           accessibility = _props.accessibility;
@@ -233,3 +143,3 @@
     value: function render() {
-      var _this3 = this;
+      var _this2 = this;
 
@@ -254,3 +164,3 @@ var height = this.state.height;
             }
-            return _this3._renderFrame(style);
+            return _this2._renderFrame(style);
           }
@@ -264,35 +174,16 @@ );
 
-  return ViewPager;
+  return Frame;
 }(_react.Component);
 
-ViewPager.propTypes = checkedProps;
-ViewPager.defaultProps = {
+Frame.contextTypes = {
+  pager: _react.PropTypes.instanceOf(_Pager2.default)
+};
+Frame.propTypes = checkedProps;
+Frame.defaultProps = {
   tag: 'div',
-  currentView: 0,
-  viewsToShow: 1,
-  viewsToMove: 1,
-  align: 0,
-  contain: false,
-  axis: 'x',
   autoSize: false,
-  infinite: false,
-  instant: false,
-  swipe: true,
-  swipeThreshold: 0.5,
-  flickTimeout: 300,
   accessibility: true,
-  springConfig: _reactMotion.presets.noWobble,
-  // rightToLeft: false,
-  // lazyLoad: false,
-  onSwipeStart: noop,
-  onSwipeMove: noop,
-  onSwipeEnd: noop,
-  onScroll: noop,
-  beforeViewChange: noop,
-  afterViewChange: noop
+  springConfig: _reactMotion.presets.noWobble
 };
-ViewPager.childContextTypes = {
-  viewPager: _react.PropTypes.instanceOf(_Pager2.default)
-};
-exports.default = ViewPager;
+exports.default = Frame;
 module.exports = exports['default'];

lib/ImageView.js

@@ -43,3 +43,3 @@ 'use strict';
       // hydrate the pager now that the image has loaded
-      _this.context.viewPager.hydrate();
+      _this.context.pager.hydrate();
 
@@ -65,5 +65,5 @@ if (typeof _this.props.onLoad === 'function') {
 ImageView.contextTypes = {
-  viewPager: _react.PropTypes.instanceOf(_Pager2.default)
+  pager: _react.PropTypes.instanceOf(_Pager2.default)
 };
 exports.default = ImageView;
 module.exports = exports['default'];

lib/Pager.js

@@ -125,7 +125,14 @@ 'use strict';
     _this2.isSwiping = false;
-    _this2.animationBus = new _animationBus2.default(_this2.options.animations, function (view) {
-      return view.origin;
+    _this2.animationBus = new _animationBus2.default({
+      animations: _this2.options.animations,
+      origin: function origin(view) {
+        return view.origin;
+      }
     });
 
-    window.addEventListener('resize', _this2.resize);
+    if (typeof window === 'undefined') {
+      return _possibleConstructorReturn(_this2);
+    } else {
+      window.addEventListener('resize', _this2.resize);
+    }
     return _this2;
@@ -135,2 +142,11 @@ }
   _createClass(Pager, [{
+    key: 'setOptions',
+    value: function setOptions(options) {
+      // spread new options over the old ones
+      this.options = _extends({}, this.options, options);
+
+      // merge animations into animation bus
+      this.animationBus.animations = this.options.animations;
+    }
+  }, {
     key: 'destroy',
@@ -377,4 +393,7 @@ value: function destroy() {
     value: function getTrackSize() {
+      var includeLastSlide = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+
+      var lastIndex = includeLastSlide ? this.views.length : this.views.length - 1;
       var size = 0;
-      this.views.forEach(function (view) {
+      this.views.slice(0, lastIndex).forEach(function (view) {
         size += view.getSize();
@@ -431,3 +450,6 @@ });
       // emit a "scroll" event so we can do things based on the progress of the track
-      this.emit('scroll', trackPosition);
+      this.emit('scroll', {
+        progress: trackPosition / this.getTrackSize(false),
+        position: trackPosition
+      });
 
@@ -434,0 +456,0 @@ // set the proper transform axis based on our options

lib/react-view-pager.js

@@ -6,4 +6,8 @@ 'use strict';
 });
-exports.utils = exports.ImageView = exports.Track = exports.Frame = undefined;
+exports.utils = exports.AnimatedView = exports.ImageView = exports.Track = exports.Frame = exports.ViewPager = undefined;
 
+var _ViewPager2 = require('./ViewPager');
+
+var _ViewPager3 = _interopRequireDefault(_ViewPager2);
+
 var _Frame2 = require('./Frame');
@@ -21,2 +25,6 @@
 
+var _AnimatedView2 = require('./AnimatedView');
+
+var _AnimatedView3 = _interopRequireDefault(_AnimatedView2);
+
 var _utils2 = require('./utils');
@@ -28,5 +36,7 @@
 
+exports.ViewPager = _ViewPager3.default;
 exports.Frame = _Frame3.default;
 exports.Track = _Track3.default;
 exports.ImageView = _ImageView3.default;
+exports.AnimatedView = _AnimatedView3.default;
 exports.utils = _utils3.default;

lib/Track.js

@@ -7,2 +7,4 @@ 'use strict';
 
+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+
 var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
@@ -34,2 +36,6 @@
 
+var _specialAssign = require('./special-assign');
+
+var _specialAssign2 = _interopRequireDefault(_specialAssign);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -49,6 +55,9 @@
 
-var Track = function (_Component) {
-  _inherits(Track, _Component);
+// Track scroller is an intermediate component that allows us to provide the
+// React Motion value to onScroll and lets any user of onScroll use setState
 
-  function Track() {
+var TrackScroller = function (_Component) {
+  _inherits(TrackScroller, _Component);
+
+  function TrackScroller() {
     var _ref;
@@ -58,3 +67,3 @@
 
-    _classCallCheck(this, Track);
+    _classCallCheck(this, TrackScroller);
 
@@ -65,77 +74,207 @@ for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
 
-    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = Track.__proto__ || Object.getPrototypeOf(Track)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
+    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = TrackScroller.__proto__ || Object.getPrototypeOf(TrackScroller)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
+      x: 0,
+      y: 0
+    }, _temp), _possibleConstructorReturn(_this, _ret);
+  }
+
+  _createClass(TrackScroller, [{
+    key: 'componentWillReceiveProps',
+    value: function componentWillReceiveProps(_ref2) {
+      var _this2 = this;
+
+      var trackPosition = _ref2.trackPosition;
+      var pager = this.context.pager;
+
+      // update view styles with current position tween
+      // this method can get called hundreds of times, let's make sure to optimize as much as we can
+
+      pager.setViewStyles(trackPosition);
+
+      // get the x & y values to position the track
+      this.setState(pager.getPositionValue(trackPosition));
+
+      // update onScroll callback, we use requestAnimationFrame to avoid bouncing
+      // back from updates from onScroll while React Motion is trying to update it's own tree
+      // https://github.com/chenglou/react-motion/issues/357#issuecomment-262393424
+      if (this.props.trackPosition !== trackPosition) {
+        requestAnimationFrame(function () {
+          return _this2.props.onScroll(trackPosition / pager.getTrackSize(false) * -1, trackPosition);
+        });
+      }
+    }
+  }, {
+    key: '_renderViews',
+    value: function _renderViews() {
+      return _react.Children.map(this.props.children, function (child) {
+        return _react2.default.createElement(_View2.default, { children: child });
+      });
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      var _props = this.props,
+          tag = _props.tag,
+          trackPosition = _props.trackPosition,
+          restProps = _objectWithoutProperties(_props, ['tag', 'trackPosition']);
+
+      var _state = this.state,
+          x = _state.x,
+          y = _state.y;
+
+      var style = _extends({}, restProps.style, _defineProperty({}, TRANSFORM, 'translate3d(' + x + 'px, ' + y + 'px, 0)'));
+
+      return (0, _react.createElement)(tag, _extends({}, restProps, {
+        style: style
+      }), this._renderViews());
+    }
+  }]);
+
+  return TrackScroller;
+}(_react.Component);
+
+TrackScroller.propTypes = checkedProps;
+TrackScroller.contextTypes = {
+  pager: _react.PropTypes.instanceOf(_Pager2.default)
+};
+
+
+var noop = function noop() {
+  return null;
+};
+var checkedProps = {
+  tag: _react.PropTypes.any,
+  currentView: _react.PropTypes.any,
+  viewsToShow: _react.PropTypes.oneOfType([_react.PropTypes.number, _react.PropTypes.oneOf(['auto'])]),
+  viewsToMove: _react.PropTypes.number,
+  align: _react.PropTypes.number,
+  contain: _react.PropTypes.bool,
+  axis: _react.PropTypes.oneOf(['x', 'y']),
+  animations: _react.PropTypes.array,
+  infinite: _react.PropTypes.bool,
+  instant: _react.PropTypes.bool,
+  swipe: _react.PropTypes.oneOf([true, false, 'mouse', 'touch']),
+  swipeThreshold: _react.PropTypes.number,
+  flickTimeout: _react.PropTypes.number,
+  springConfig: _react.PropTypes.objectOf(_react.PropTypes.number),
+  onSwipeStart: _react.PropTypes.func,
+  onSwipeMove: _react.PropTypes.func,
+  onSwipeEnd: _react.PropTypes.func,
+  onScroll: _react.PropTypes.func,
+  // rightToLeft: PropTypes.bool,
+  // lazyLoad: PropTypes.bool,
+  beforeViewChange: _react.PropTypes.func,
+  afterViewChange: _react.PropTypes.func
+  // beforeAnimation: PropTypes.func,
+  // afterAnimation: PropTypes.func
+};
+
+var Track = function (_Component2) {
+  _inherits(Track, _Component2);
+
+  function Track() {
+    var _ref3;
+
+    var _temp2, _this3, _ret2;
+
+    _classCallCheck(this, Track);
+
+    for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      args[_key2] = arguments[_key2];
+    }
+
+    return _ret2 = (_temp2 = (_this3 = _possibleConstructorReturn(this, (_ref3 = Track.__proto__ || Object.getPrototypeOf(Track)).call.apply(_ref3, [this].concat(args))), _this3), _this3.state = {
       instant: false
-    }, _this._currentTween = 0, _this._handleOnRest = function () {
-      var viewPager = _this.context.viewPager;
-
-      if (viewPager.options.infinite && !_this.state.instant) {
+    }, _this3._currentTween = 0, _this3._handleOnRest = function () {
+      if (_this3.props.infinite && !_this3.state.instant) {
         // reset back to a normal index
-        viewPager.resetViews();
+        _this3.context.pager.resetViews();
 
         // set instant flag so we can prime track for next move
-        _this._setValueInstantly(true, true);
+        _this3._setValueInstantly(true, true);
       }
 
-      // fire event for prop callback on Frame component
-      viewPager.emit('rest');
-    }, _temp), _possibleConstructorReturn(_this, _ret);
+      _this3.props.afterViewChange();
+    }, _temp2), _possibleConstructorReturn(_this3, _ret2);
   }
 
   _createClass(Track, [{
+    key: 'componentWillMount',
+    value: function componentWillMount() {
+      this.context.pager.setOptions(this.props);
+    }
+  }, {
     key: 'componentDidMount',
     value: function componentDidMount() {
-      var _this2 = this;
+      var _this4 = this;
 
-      var viewPager = this.context.viewPager;
+      var pager = this.context.pager;
 
       // add track to pager
 
-      viewPager.addTrack((0, _reactDom.findDOMNode)(this));
+      pager.addTrack((0, _reactDom.findDOMNode)(this));
 
       // refresh instantly to set first track position
-      this._setValueInstantly(true, true);
+      // this._setValueInstantly(true, true)
 
+      // set initial view index and listen for any incoming view index changes
+      // this.setCurrentView(this.props.currentView)
+
       // set values instantly on respective events
-      viewPager.on('hydrated', function () {
-        return _this2._setValueInstantly(true, true);
+      pager.on('hydrated', function () {
+        return _this4._setValueInstantly(true, true);
       });
-      viewPager.on('swipeMove', function () {
-        return _this2._setValueInstantly(true);
+      pager.on('swipeMove', function () {
+        return _this4._setValueInstantly(true);
       });
-      viewPager.on('swipeEnd', function () {
-        return _this2._setValueInstantly(false);
+      pager.on('swipeEnd', function () {
+        return _this4._setValueInstantly(false);
       });
 
-      // set initial view index and listen for any incoming view index changes
-      this.setCurrentView(viewPager.options.currentView);
-
-      // updateView event comes from Frame component props
-      // this is a little weird, probably should handle this through context
-      viewPager.on('updateView', function (index) {
-        _this2.setCurrentView(index);
-      });
+      // prop callbacks
+      pager.on('swipeStart', this.props.onSwipeStart);
+      pager.on('swipeMove', this.props.onSwipeMove);
+      pager.on('swipeEnd', this.props.onSwipeEnd);
+      pager.on('viewChange', this.props.beforeViewChange);
     }
   }, {
-    key: 'setCurrentView',
-    value: function setCurrentView(index) {
-      this.context.viewPager.setCurrentView(0, (0, _getIndex2.default)(index, this.props.children));
-    }
-  }, {
     key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(_ref2) {
-      var instant = _ref2.instant;
+    value: function componentWillReceiveProps(_ref4) {
+      var currentView = _ref4.currentView,
+          instant = _ref4.instant,
+          children = _ref4.children;
 
       // update instant state from props
       if (this.props.instant !== instant) {
-        this.setState({ instant: instant });
+        this._setValueInstantly(instant);
       }
+
+      // update state with new index if necessary
+      if ((typeof currentView === 'undefined' ? 'undefined' : _typeof(currentView)) !== undefined && this.props.currentView !== currentView) {
+        this.scrollTo((0, _getIndex2.default)(currentView, children));
+      }
     }
   }, {
+    key: 'prev',
+    value: function prev() {
+      this.context.pager.prev();
+    }
+  }, {
+    key: 'next',
+    value: function next() {
+      this.context.pager.next();
+    }
+  }, {
+    key: 'scrollTo',
+    value: function scrollTo(index) {
+      this.context.pager.setCurrentView(0, index);
+    }
+  }, {
     key: '_setValueInstantly',
     value: function _setValueInstantly(instant, reset) {
-      var _this3 = this;
+      var _this5 = this;
 
       this.setState({ instant: instant }, function () {
         if (reset) {
-          _this3.setState({ instant: false });
+          _this5.setState({ instant: false });
         }
@@ -147,3 +286,3 @@ });
     value: function _getTrackStyle() {
-      var trackPosition = this.context.viewPager.trackPosition;
+      var trackPosition = this.context.pager.trackPosition;
 
@@ -156,20 +295,9 @@ if (!this.state.instant) {
   }, {
-    key: '_renderViews',
-    value: function _renderViews() {
-      return _react.Children.map(this.props.children, function (child) {
-        return _react2.default.createElement(_View2.default, { children: child });
-      });
-    }
-  }, {
     key: 'render',
     value: function render() {
-      var _this4 = this;
+      var _props2 = this.props,
+          tag = _props2.tag,
+          onScroll = _props2.onScroll,
+          restProps = _objectWithoutProperties(_props2, ['tag', 'onScroll']);
 
-      var viewPager = this.context.viewPager;
-
-      var _props = this.props,
-          tag = _props.tag,
-          springConfig = _props.springConfig,
-          restProps = _objectWithoutProperties(_props, ['tag', 'springConfig']);
-
       return _react2.default.createElement(
@@ -181,18 +309,5 @@ _reactMotion.Motion,
         },
-        function (_ref3) {
-          var trackPosition = _ref3.trackPosition;
-
-          var _viewPager$getPositio = viewPager.getPositionValue(trackPosition),
-              x = _viewPager$getPositio.x,
-              y = _viewPager$getPositio.y;
-
-          var style = _extends({}, restProps.style, _defineProperty({}, TRANSFORM, 'translate3d(' + x + 'px, ' + y + 'px, 0)'));
-
-          // update view styles with current position tween
-          // this method can get called hundreds of times, let's make sure to optimize as much as we can
-          viewPager.setViewStyles(trackPosition);
-
-          return (0, _react.createElement)(tag, _extends({}, restProps, {
-            style: style
-          }), _this4._renderViews());
+        function (_ref5) {
+          var trackPosition = _ref5.trackPosition;
+          return (0, _react.createElement)(TrackScroller, (0, _specialAssign2.default)({ trackPosition: trackPosition, tag: tag, onScroll: onScroll }, restProps, checkedProps));
         }
@@ -206,13 +321,28 @@ );
 
-Track.propTypes = {
-  springConfig: _react.PropTypes.objectOf(_react.PropTypes.number)
-};
+Track.propTypes = checkedProps;
 Track.defaultProps = {
   tag: 'div',
-  springConfig: _reactMotion.presets.noWobble
+  currentView: 0,
+  viewsToShow: 1,
+  viewsToMove: 1,
+  align: 0,
+  contain: false,
+  axis: 'x',
+  infinite: false,
+  instant: false,
+  swipe: true,
+  swipeThreshold: 0.5,
+  flickTimeout: 300,
+  springConfig: _reactMotion.presets.noWobble,
+  onSwipeStart: noop,
+  onSwipeMove: noop,
+  onSwipeEnd: noop,
+  onScroll: noop,
+  beforeViewChange: noop,
+  afterViewChange: noop
 };
 Track.contextTypes = {
-  viewPager: _react.PropTypes.instanceOf(_Pager2.default)
+  pager: _react.PropTypes.instanceOf(_Pager2.default)
 };
 exports.default = Track;
 module.exports = exports['default'];

lib/View.js

@@ -39,11 +39,26 @@ 'use strict';
   function View() {
+    var _ref;
+
+    var _temp, _this, _ret;
+
     _classCallCheck(this, View);
 
-    return _possibleConstructorReturn(this, (View.__proto__ || Object.getPrototypeOf(View)).apply(this, arguments));
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = View.__proto__ || Object.getPrototypeOf(View)).call.apply(_ref, [this].concat(args))), _this), _this._viewInstance = null, _temp), _possibleConstructorReturn(_this, _ret);
   }
 
   _createClass(View, [{
+    key: 'getChildContext',
+    value: function getChildContext() {
+      return {
+        view: this._viewInstance
+      };
+    }
+  }, {
     key: 'componentDidMount',
     value: function componentDidMount() {
-      this._viewInstance = this.context.viewPager.addView((0, _reactDom.findDOMNode)(this));
+      this._viewInstance = this.context.pager.addView((0, _reactDom.findDOMNode)(this));
       this.forceUpdate();
@@ -54,3 +69,3 @@ }
     value: function componentWillUnmount() {
-      this.context.viewPager.removeView(this._viewInstance);
+      this.context.pager.removeView(this._viewInstance);
     }
@@ -60,6 +75,6 @@ }, {
     value: function render() {
-      var viewPager = this.context.viewPager;
-      var _viewPager$options = viewPager.options,
-          viewsToShow = _viewPager$options.viewsToShow,
-          axis = _viewPager$options.axis;
+      var pager = this.context.pager;
+      var _pager$options = pager.options,
+          viewsToShow = _pager$options.viewsToShow,
+          axis = _pager$options.axis;
 
@@ -90,3 +105,4 @@ var _props = this.props,
         var edge = axis === 'y' ? 'top' : 'left';
-        style = _extends({}, style, _defineProperty({}, edge, this._viewInstance.getPosition()), viewPager.animationBus.getStyles(this._viewInstance));
+
+        style = _extends({}, style, _defineProperty({}, edge, this._viewInstance.getPosition()), pager.animationBus.getStyles(this._viewInstance));
       }
@@ -102,5 +118,8 @@
 View.contextTypes = {
-  viewPager: _react.PropTypes.instanceOf(_Pager2.default)
+  pager: _react.PropTypes.instanceOf(_Pager2.default)
 };
+View.childContextTypes = {
+  view: _react.PropTypes.any
+};
 exports.default = View;
 module.exports = exports['default'];

lib/ViewPager.js

@@ -7,4 +7,2 @@ 'use strict';
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@@ -16,8 +14,2 @@
 
-var _reactDom = require('react-dom');
-
-var _reactDom2 = _interopRequireDefault(_reactDom);
-
-var _reactMotion = require('react-motion');
-
 var _Pager = require('./Pager');
@@ -27,20 +19,6 @@
 
-var _Frame = require('./Frame');
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _Frame2 = _interopRequireDefault(_Frame);
+function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
 
-var _Track = require('./Track');
-
-var _Track2 = _interopRequireDefault(_Track);
-
-var _View = require('./View');
-
-var _View2 = _interopRequireDefault(_View);
-
-var _getIndex = require('./get-index');
-
-var _getIndex2 = _interopRequireDefault(_getIndex);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -60,21 +38,12 @@
 
-    _this._handleOnRest = function () {
-      if (_this.props.infinite && !_this.state.instant) {
-        // reset back to a normal index
-        _this._viewPager.resetViews();
-
-        // set instant flag so we can prime track for next move
-        _this.setState({ instant: true }, function () {
-          _this.setState({ instant: false });
-        });
-      }
+    var pager = new _Pager2.default();
+    var forceUpdate = function forceUpdate() {
+      return _this.forceUpdate();
     };
 
-    _this._viewPager = new _Pager2.default(props);
+    // re-render the whole tree to update components on certain events
+    pager.on('viewChange', forceUpdate);
+    pager.on('hydrated', forceUpdate);
 
-    _this.state = {
-      currentView: (0, _getIndex2.default)(props.currentView, props.children),
-      instant: false,
-      isMounted: false
-    };
+    _this._pager = pager;
     return _this;
@@ -87,119 +56,23 @@ }
       return {
-        viewPager: this._viewPager
+        pager: this._pager
       };
     }
   }, {
-    key: 'componentDidMount',
-    value: function componentDidMount() {
-      var _this2 = this;
-
-      // we need to mount the frame and track before we can gather the proper info
-      // for views, we use this flag to determine when we can mount the views
-      this.setState({ isMounted: true }, function () {
-        _this2._viewPager.setPositionValue();
-
-        // now that we have slides, run an instant render to finish setting everything up
-        _this2.setState({ instant: true }, function () {
-          _this2.setState({ instant: false });
-        });
-      });
-
-      this._viewPager.on('viewChange', function (index) {
-        _this2.setState({
-          currentView: index
-        });
-      });
-
-      this._viewPager.on('swipeMove', function () {
-        _this2.setState({
-          instant: true
-        });
-      });
-
-      this._viewPager.on('swipeEnd', function () {
-        _this2.setState({
-          instant: false
-        });
-      });
-
-      this._viewPager.on('resize', function () {
-        _this2.forceUpdate();
-      });
+    key: 'componentWillUnmount',
+    value: function componentWillUnmount() {
+      this._pager.destroy();
     }
   }, {
-    key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(_ref) {
-      var currentView = _ref.currentView,
-          children = _ref.children,
-          instant = _ref.instant;
-
-      // update state with new index if necessary
-      if ((typeof currentView === 'undefined' ? 'undefined' : _typeof(currentView)) !== undefined && this.props.currentView !== currentView) {
-        var newIndex = (0, _getIndex2.default)(currentView, children);
-
-        // set the new view index
-        this._viewPager.setCurrentView(0, newIndex);
-      }
-
-      // update instant state from props
-      if (this.props.instant !== instant) {
-        this.setState({
-          instant: instant
-        });
-      }
+    key: 'getInstance',
+    value: function getInstance() {
+      return this._pager;
     }
   }, {
-    key: 'prev',
-    value: function prev() {
-      this._viewPager.prev();
-    }
-  }, {
-    key: 'next',
-    value: function next() {
-      this._viewPager.next();
-    }
-  }, {
-    key: '_getTrackStyle',
-    value: function _getTrackStyle() {
-      var trackPosition = this._viewPager.trackPosition;
-
-      if (!this.state.instant) {
-        trackPosition = (0, _reactMotion.spring)(trackPosition, this.props.springConfig);
-      }
-      return { trackPosition: trackPosition };
-    }
-  }, {
-    key: '_renderViews',
-    value: function _renderViews() {
-      return this.state.isMounted && _react.Children.map(this.props.children, function (child, index) {
-        return _react2.default.createElement(_View2.default, { children: child });
-      });
-    }
-  }, {
     key: 'render',
     value: function render() {
-      var _this3 = this;
+      var _props = this.props,
+          tag = _props.tag,
+          restProps = _objectWithoutProperties(_props, ['tag']);
 
-      return _react2.default.createElement(
-        _Frame2.default,
-        { className: 'frame' },
-        _react2.default.createElement(
-          _reactMotion.Motion,
-          {
-            style: this._getTrackStyle(),
-            onRest: this._handleOnRest
-          },
-          function (_ref2) {
-            var trackPosition = _ref2.trackPosition;
-            return _react2.default.createElement(
-              _Track2.default,
-              {
-                position: trackPosition,
-                className: 'track'
-              },
-              _this3._renderViews()
-            );
-          }
-        )
-      );
+      return (0, _react.createElement)(tag, restProps);
     }
@@ -211,49 +84,12 @@ }]);
 
+ViewPager.childContextTypes = {
+  pager: _react.PropTypes.instanceOf(_Pager2.default)
+};
 ViewPager.propTypes = {
-  currentView: _react.PropTypes.any,
-  viewsToShow: _react.PropTypes.any,
-  viewsToMove: _react.PropTypes.number,
-  align: _react.PropTypes.number,
-  contain: _react.PropTypes.bool,
-  axis: _react.PropTypes.oneOf(['x', 'y']),
-  autoSize: _react.PropTypes.bool,
-  infinite: _react.PropTypes.bool,
-  instant: _react.PropTypes.bool,
-  swipe: _react.PropTypes.oneOf([true, false, 'mouse', 'touch']),
-  swipeThreshold: _react.PropTypes.number,
-  flickTimeout: _react.PropTypes.number,
-  // rightToLeft: PropTypes.bool,
-  // lazyLoad: PropTypes.bool,
-  springConfig: _react2.default.PropTypes.objectOf(_react2.default.PropTypes.number)
+  tag: _react.PropTypes.string
 };
 ViewPager.defaultProps = {
-  currentView: 0,
-  viewsToShow: 'auto',
-  viewsToMove: 1,
-  align: 0,
-  contain: false,
-  axis: 'x',
-  autoSize: false,
-  infinite: false,
-  instant: false,
-  swipe: true,
-  swipeThreshold: 0.5,
-  flickTimeout: 300,
-  rightToLeft: false,
-  lazyLoad: false,
-  springConfig: _reactMotion.presets.noWobble,
-  onViewChange: function onViewChange() {
-    return null;
-  },
-  beforeAnimation: function beforeAnimation() {
-    return null;
-  },
-  afterAnimation: function afterAnimation() {
-    return null;
-  }
+  tag: 'div'
 };
-ViewPager.childContextTypes = {
-  viewPager: _react.PropTypes.instanceOf(_Pager2.default)
-};
 exports.default = ViewPager;
 module.exports = exports['default'];

package.json

 {
   "name": "react-view-pager",
-  "version": "0.5.0-prerelease",
+  "version": "0.5.0-prerelease.1",
   "description": "View-Pager/Slider/Carousel powered by React Motion.",
@@ -41,3 +41,3 @@ "main": "lib/react-view-pager.js",
   "dependencies": {
-    "animation-bus": "^0.1.0",
+    "animation-bus": "^0.2.0",
     "get-prefix": "^1.0.0",
@@ -44,0 +44,0 @@ "minivents": "^2.0.2",

README.md

@@ -1,2 +0,2 @@
-## React View Pager
+## React View Pager (Prerelease)
 
@@ -15,2 +15,7 @@ [![Dependency Status](https://david-dm.org/souporserious/react-view-pager.svg)](https://david-dm.org/souporserious/react-view-pager)
 
+```html
+<script src="https://unpkg.com/react-view-pager/dist/react-view-pager.js"></script>
+(UMD library exposed as `Reactpager`)
+```
+
 ## Example Usage
@@ -51,2 +56,6 @@ ```js
 
+## `ViewPager` Props
+
+Mandatory wrapper component that connects child components together.
+
 ## `Frame` Props
@@ -57,2 +66,19 @@
 
+### `autoSize`: PropTypes.bool
+
+Animates the wrapper's width and height to fit the current view. Defaults to `false`.
+
+### `accessibility`: PropTypes.bool
+
+Enable tabbing and keyboard navigation.
+
+### `springConfig`: React.PropTypes.objectOf(React.PropTypes.number)
+
+Accepts a [React Motion spring config](https://github.com/chenglou/react-motion#--spring-val-number-config-springhelperconfig--opaqueconfig).
+
+## `Track` Props
+
+### `tag`: PropTypes.string
+The HTML tag for this element. Defaults to `div`.
+
 ### `currentView`: PropTypes.any
@@ -62,5 +88,5 @@
 
-### `viewsToShow`: PropTypes.number
+### `viewsToShow`: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf(['auto'])])
 
-The number of views visible in the frame at one time. Defaults to `auto` which will respect the views's natural or defined dimensions.
+The number of views visible in the frame at one time. Defaults to `1`. Use `auto` to respect the views's natural or defined dimensions.
 
@@ -71,5 +97,5 @@ ### `viewsToMove`: PropTypes.number
 
-### `align`: PropTypes.oneOf(['left', 'center', 'right'])
+### `align`: PropTypes.number
 
-Offsets the slide to align either `left` (default), `center`, or `right`.
+Pass any number to offset the view from the start of the track. For example, `0` aligns to the start of the track, `0.5` to the center, and `1` aligns to the end.
 
@@ -92,9 +118,5 @@ ### `contain`: PropTypes.bool
 
-### `autoSize`: PropTypes.bool
-
-Animates the wrapper's width and height to fit the current view. Defaults to `false`.
-
 ### `animations`: PropTypes.array
 
-Define a limitless array of animation stops. Each object in the array requires a `name` and `stops` property along with an optional `unit` property.
+Define a limitless array of animation stops. Each object in the array requires a `prop` and `stops` property along with an optional `unit` property.
 
@@ -104,3 +126,3 @@ ```js
 const animations = [{
-  name: 'scale',
+  prop: 'scale',
   stops: [
@@ -112,3 +134,3 @@ [-200, 0.85],
 }, {
-  name: 'opacity',
+  prop: 'opacity',
   stops: [
@@ -134,5 +156,5 @@ [-200, 0.15],
 
-### `accessibility`: PropTypes.bool
+### `rightToLeft`: PropTypes.bool (Coming Soon)
 
-Enable tabbing and keyboard navigation.
+### `lazyLoad`: PropTypes.bool (Coming Soon)
 
@@ -143,6 +165,2 @@ ### `springConfig`: React.PropTypes.objectOf(React.PropTypes.number)
 
-### `rightToLeft`: PropTypes.bool (Coming Soon)
-
-### `lazyLoad`: PropTypes.bool (Coming Soon)
-
 ### `onSwipeStart`: PropTypes.func
@@ -185,11 +203,2 @@
 
-## `Track` Props
-
-### `tag`: PropTypes.string
-The HTML tag for this element. Defaults to `div`.
-
-### `springConfig`: React.PropTypes.objectOf(React.PropTypes.number)
-
-Accepts a [React Motion spring config](https://github.com/chenglou/react-motion#--spring-val-number-config-springhelperconfig--opaqueconfig).
-
 ## Running Locally
@@ -196,0 +205,0 @@

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

247922

increased by9.02%

Number of package files

34

increased by3.03%

Lines of code

5011

increased by7.28%

Number of lines in readme file

212

increased by4.43%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• + Addedanimation-bus@0.2.0(transitive)

• - Removedanimation-bus@0.1.0(transitive)

• - Removedpolylinear-scale@1.1.6(transitive)

• Updatedanimation-bus@^0.2.0