@momo-kits/carousel 0.0.3-beta → 0.0.7

package/Carousel.js

@@ -1 +1,1390 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _animation=require("./utils/animation");var _jsxFileName="/Users/trinh.ho2/momo-folk/kits/src/libs/carousel/dist/Carousel.js";function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});}keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};if(i%2){ownKeys(Object(source),true).forEach(function(key){(0,_defineProperty2.default)(target,key,source[key]);});}else if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source));}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}}return target;}function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=(0,_getPrototypeOf2.default)(Derived),result;if(hasNativeReflectConstruct){var NewTarget=(0,_getPrototypeOf2.default)(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return(0,_possibleConstructorReturn2.default)(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var IS_IOS=_reactNative.Platform.OS==='ios';var AnimatedFlatList=_reactNative.FlatList?_reactNative.Animated.createAnimatedComponent(_reactNative.FlatList):null;var AnimatedScrollView=_reactNative.Animated.createAnimatedComponent(_reactNative.ScrollView);var IS_RTL=_reactNative.I18nManager.isRTL;var Carousel=function(_PureComponent){(0,_inherits2.default)(Carousel,_PureComponent);var _super=_createSuper(Carousel);function Carousel(props){var _this;(0,_classCallCheck2.default)(this,Carousel);_this=_super.call(this,props);_this.state={hideCarousel:true,interpolators:[]};var initialActiveItem=_this._getFirstItem(props.firstItem);_this._activeItem=initialActiveItem;_this._previousActiveItem=initialActiveItem;_this._previousFirstItem=initialActiveItem;_this._previousItemsLength=initialActiveItem;_this._mounted=false;_this._positions=[];_this._currentContentOffset=0;_this._canFireBeforeCallback=false;_this._canFireCallback=false;_this._scrollOffsetRef=null;_this._onScrollTriggered=true;_this._lastScrollDate=0;_this._scrollEnabled=props.scrollEnabled!==false;_this._initPositionsAndInterpolators=_this._initPositionsAndInterpolators.bind((0,_assertThisInitialized2.default)(_this));_this._renderItem=_this._renderItem.bind((0,_assertThisInitialized2.default)(_this));_this._onSnap=_this._onSnap.bind((0,_assertThisInitialized2.default)(_this));_this._onLayout=_this._onLayout.bind((0,_assertThisInitialized2.default)(_this));_this._onScroll=_this._onScroll.bind((0,_assertThisInitialized2.default)(_this));_this._onScrollBeginDrag=props.enableSnap?_this._onScrollBeginDrag.bind((0,_assertThisInitialized2.default)(_this)):undefined;_this._onScrollEnd=props.enableSnap||props.autoplay?_this._onScrollEnd.bind((0,_assertThisInitialized2.default)(_this)):undefined;_this._onScrollEndDrag=!props.enableMomentum?_this._onScrollEndDrag.bind((0,_assertThisInitialized2.default)(_this)):undefined;_this._onMomentumScrollEnd=props.enableMomentum?_this._onMomentumScrollEnd.bind((0,_assertThisInitialized2.default)(_this)):undefined;_this._onTouchStart=_this._onTouchStart.bind((0,_assertThisInitialized2.default)(_this));_this._onTouchEnd=_this._onTouchEnd.bind((0,_assertThisInitialized2.default)(_this));_this._onTouchRelease=_this._onTouchRelease.bind((0,_assertThisInitialized2.default)(_this));_this._getKeyExtractor=_this._getKeyExtractor.bind((0,_assertThisInitialized2.default)(_this));_this._setScrollHandler(props);_this._ignoreNextMomentum=false;if(!_reactNative.ViewPropTypes){console.warn("react-native-snap-carousel: \n            It is recommended to use at least version 0.44 of React Native with the plugin");}if(!props.vertical&&(!props.sliderWidth||!props.itemWidth)){console.warn("react-native-snap-carousel: You need to specify both sliderWidth and itemWidth \n            for horizontal carousels");}if(props.vertical&&(!props.sliderHeight||!props.itemHeight)){console.warn("react-native-snap-carousel: You need to specify both sliderHeight and itemHeight \n            for vertical carousels");}if(props.apparitionDelay&&!IS_IOS&&!props.useScrollView){console.warn("react-native-snap-carousel: Using apparitionDelay on Android \n            is not recommended since it can lead to rendering issues");}if(props.customAnimationType||props.customAnimationOptions){console.warn("react-native-snap-carousel: Props customAnimationType and \n            customAnimationOptions have been renamed to activeAnimationType and  activeAnimationOptions");}if(props.onScrollViewScroll){console.warn("react-native-snap-carousel: Prop onScrollViewScroll has been removed. \n            Use onScroll instead");}return _this;}(0,_createClass2.default)(Carousel,[{key:"componentDidMount",value:function componentDidMount(){var _this2=this;var _this$props=this.props,apparitionDelay=_this$props.apparitionDelay,autoplay=_this$props.autoplay,firstItem=_this$props.firstItem;var _firstItem=this._getFirstItem(firstItem);var apparitionCallback=function apparitionCallback(){_this2.setState({hideCarousel:false});if(autoplay){_this2.startAutoplay();}};this._mounted=true;this._initPositionsAndInterpolators();requestAnimationFrame(function(){if(!_this2._mounted){return;}_this2._snapToItem(_firstItem,false,false,true,false);_this2._hackActiveSlideAnimation(_firstItem,'start',true);if(apparitionDelay){_this2._apparitionTimeout=setTimeout(function(){apparitionCallback();},apparitionDelay);}else{apparitionCallback();}});}},{key:"UNSAFE_componentWillReceiveProps",value:function UNSAFE_componentWillReceiveProps(nextProps){var interpolators=this.state.interpolators;var _this$props2=this.props,itemHeight=_this$props2.itemHeight,itemWidth=_this$props2.itemWidth,scrollEnabled=_this$props2.scrollEnabled,sliderHeight=_this$props2.sliderHeight,sliderWidth=_this$props2.sliderWidth,onScroll=_this$props2.onScroll;var itemsLength=this._getCustomDataLength(nextProps);if(!itemsLength){return;}var nextFirstItem=this._getFirstItem(nextProps.firstItem,nextProps);var nextActiveItem=this._activeItem||this._activeItem===0?this._activeItem:nextFirstItem;var hasNewSliderWidth=nextProps.sliderWidth&&nextProps.sliderWidth!==sliderWidth;var hasNewSliderHeight=nextProps.sliderHeight&&nextProps.sliderHeight!==sliderHeight;var hasNewItemWidth=nextProps.itemWidth&&nextProps.itemWidth!==itemWidth;var hasNewItemHeight=nextProps.itemHeight&&nextProps.itemHeight!==itemHeight;var hasNewScrollEnabled=nextProps.scrollEnabled!==scrollEnabled;if(nextActiveItem>itemsLength-1){nextActiveItem=itemsLength-1;}if(hasNewScrollEnabled){this._setScrollEnabled(nextProps.scrollEnabled);}if(interpolators.length!==itemsLength||hasNewSliderWidth||hasNewSliderHeight||hasNewItemWidth||hasNewItemHeight){this._activeItem=nextActiveItem;this._previousItemsLength=itemsLength;this._initPositionsAndInterpolators(nextProps);if(this._previousItemsLength>itemsLength){this._hackActiveSlideAnimation(nextActiveItem,null,true);}if(hasNewSliderWidth||hasNewSliderHeight||hasNewItemWidth||hasNewItemHeight){this._snapToItem(nextActiveItem,false,false,false,false);}}else if(nextFirstItem!==this._previousFirstItem&&nextFirstItem!==this._activeItem){this._activeItem=nextFirstItem;this._previousFirstItem=nextFirstItem;this._snapToItem(nextFirstItem,false,true,false,false);}if(nextProps.onScroll!==onScroll){this._setScrollHandler(nextProps);}}},{key:"componentWillUnmount",value:function componentWillUnmount(){this._mounted=false;this.stopAutoplay();clearTimeout(this._apparitionTimeout);clearTimeout(this._hackSlideAnimationTimeout);clearTimeout(this._enableAutoplayTimeout);clearTimeout(this._autoplayTimeout);clearTimeout(this._snapNoMomentumTimeout);clearTimeout(this._edgeItemTimeout);clearTimeout(this._lockScrollTimeout);}},{key:"realIndex",get:function get(){return this._activeItem;}},{key:"currentIndex",get:function get(){return this._getDataIndex(this._activeItem);}},{key:"currentScrollPosition",get:function get(){return this._currentContentOffset;}},{key:"_setScrollHandler",value:function _setScrollHandler(props){var scrollEventConfig={listener:this._onScroll,useNativeDriver:true};this._scrollPos=new _reactNative.Animated.Value(0);var argMapping=props.vertical?[{nativeEvent:{contentOffset:{y:this._scrollPos}}}]:[{nativeEvent:{contentOffset:{x:this._scrollPos}}}];if(props.onScroll&&Array.isArray(props.onScroll._argMapping)){argMapping.pop();var _props$onScroll$_argM=(0,_slicedToArray2.default)(props.onScroll._argMapping,1),argMap=_props$onScroll$_argM[0];if(argMap&&argMap.nativeEvent&&argMap.nativeEvent.contentOffset){this._scrollPos=argMap.nativeEvent.contentOffset.x||argMap.nativeEvent.contentOffset.y||this._scrollPos;}argMapping.push.apply(argMapping,(0,_toConsumableArray2.default)(props.onScroll._argMapping));}this._onScrollHandler=_reactNative.Animated.event(argMapping,scrollEventConfig);}},{key:"_needsScrollView",value:function _needsScrollView(){var useScrollView=this.props.useScrollView;return useScrollView||!AnimatedFlatList||this._shouldUseStackLayout()||this._shouldUseTinderLayout();}},{key:"_needsRTLAdaptations",value:function _needsRTLAdaptations(){var vertical=this.props.vertical;return IS_RTL&&!IS_IOS&&!vertical;}},{key:"_canLockScroll",value:function _canLockScroll(){var _this$props3=this.props,scrollEnabled=_this$props3.scrollEnabled,enableMomentum=_this$props3.enableMomentum,lockScrollWhileSnapping=_this$props3.lockScrollWhileSnapping;return scrollEnabled&&!enableMomentum&&lockScrollWhileSnapping;}},{key:"_enableLoop",value:function _enableLoop(){var _this$props4=this.props,data=_this$props4.data,enableSnap=_this$props4.enableSnap,loop=_this$props4.loop;return enableSnap&&loop&&data&&data.length&&data.length>1;}},{key:"_shouldAnimateSlides",value:function _shouldAnimateSlides(){var props=arguments.length>0&&arguments[0]!==undefined?arguments[0]:this.props;var inactiveSlideOpacity=props.inactiveSlideOpacity,inactiveSlideScale=props.inactiveSlideScale,scrollInterpolator=props.scrollInterpolator,slideInterpolatedStyle=props.slideInterpolatedStyle;return inactiveSlideOpacity<1||inactiveSlideScale<1||!!scrollInterpolator||!!slideInterpolatedStyle||this._shouldUseShiftLayout()||this._shouldUseStackLayout()||this._shouldUseTinderLayout();}},{key:"_shouldUseCustomAnimation",value:function _shouldUseCustomAnimation(){var activeAnimationOptions=this.props.activeAnimationOptions;return!!activeAnimationOptions&&!this._shouldUseStackLayout()&&!this._shouldUseTinderLayout();}},{key:"_shouldUseShiftLayout",value:function _shouldUseShiftLayout(){var _this$props5=this.props,inactiveSlideShift=_this$props5.inactiveSlideShift,layout=_this$props5.layout;return layout==='default'&&inactiveSlideShift!==0;}},{key:"_shouldUseStackLayout",value:function _shouldUseStackLayout(){var layout=this.props.layout;return layout==='stack';}},{key:"_shouldUseTinderLayout",value:function _shouldUseTinderLayout(){var layout=this.props.layout;return layout==='tinder';}},{key:"_getCustomData",value:function _getCustomData(){var props=arguments.length>0&&arguments[0]!==undefined?arguments[0]:this.props;var data=props.data,loopClonesPerSide=props.loopClonesPerSide;var dataLength=data&&data.length;if(!dataLength){return[];}if(!this._enableLoop()){return data;}var previousItems=[];var nextItems=[];if(loopClonesPerSide>dataLength){var _previousItems2,_nextItems2;var dataMultiplier=Math.floor(loopClonesPerSide/dataLength);var remainder=loopClonesPerSide%dataLength;for(var i=0;i<dataMultiplier;i+=1){var _previousItems,_nextItems;(_previousItems=previousItems).push.apply(_previousItems,(0,_toConsumableArray2.default)(data));(_nextItems=nextItems).push.apply(_nextItems,(0,_toConsumableArray2.default)(data));}(_previousItems2=previousItems).unshift.apply(_previousItems2,(0,_toConsumableArray2.default)(data.slice(-remainder)));(_nextItems2=nextItems).push.apply(_nextItems2,(0,_toConsumableArray2.default)(data.slice(0,remainder)));}else{previousItems=data.slice(-loopClonesPerSide);nextItems=data.slice(0,loopClonesPerSide);}return previousItems.concat(data,nextItems);}},{key:"_getCustomDataLength",value:function _getCustomDataLength(){var props=arguments.length>0&&arguments[0]!==undefined?arguments[0]:this.props;var data=props.data,loopClonesPerSide=props.loopClonesPerSide;var dataLength=data&&data.length;if(!dataLength){return 0;}return this._enableLoop()?dataLength+2*loopClonesPerSide:dataLength;}},{key:"_getCustomIndex",value:function _getCustomIndex(index){var props=arguments.length>1&&arguments[1]!==undefined?arguments[1]:this.props;var itemsLength=this._getCustomDataLength(props);if(!itemsLength||!index&&index!==0){return 0;}return this._needsRTLAdaptations()?itemsLength-index-1:index;}},{key:"_getDataIndex",value:function _getDataIndex(index){var _this$props6=this.props,data=_this$props6.data,loopClonesPerSide=_this$props6.loopClonesPerSide;var dataLength=data&&data.length;if(!this._enableLoop()||!dataLength){return index;}if(index>=dataLength+loopClonesPerSide){return loopClonesPerSide>dataLength?(index-loopClonesPerSide)%dataLength:index-dataLength-loopClonesPerSide;}if(index<loopClonesPerSide){if(loopClonesPerSide>dataLength){var baseDataIndexes=[];var dataIndexes=[];var dataMultiplier=Math.floor(loopClonesPerSide/dataLength);var remainder=loopClonesPerSide%dataLength;for(var i=0;i<dataLength;i+=1){baseDataIndexes.push(i);}for(var j=0;j<dataMultiplier;j+=1){dataIndexes.push.apply(dataIndexes,baseDataIndexes);}dataIndexes.unshift.apply(dataIndexes,(0,_toConsumableArray2.default)(baseDataIndexes.slice(-remainder)));return dataIndexes[index];}return index+dataLength-loopClonesPerSide;}return index-loopClonesPerSide;}},{key:"_getPositionIndex",value:function _getPositionIndex(index){var _this$props7=this.props,loop=_this$props7.loop,loopClonesPerSide=_this$props7.loopClonesPerSide;return loop?index+loopClonesPerSide:index;}},{key:"_getFirstItem",value:function _getFirstItem(index){var props=arguments.length>1&&arguments[1]!==undefined?arguments[1]:this.props;var loopClonesPerSide=props.loopClonesPerSide;var itemsLength=this._getCustomDataLength(props);if(!itemsLength||index>itemsLength-1||index<0){return 0;}return this._enableLoop()?index+loopClonesPerSide:index;}},{key:"_getWrappedRef",value:function _getWrappedRef(){return this._carouselRef&&this._carouselRef.getNode&&this._carouselRef.getNode();}},{key:"_getScrollEnabled",value:function _getScrollEnabled(){return this._scrollEnabled;}},{key:"_setScrollEnabled",value:function _setScrollEnabled(){var scrollEnabled=arguments.length>0&&arguments[0]!==undefined?arguments[0]:true;var wrappedRef=this._getWrappedRef();if(!wrappedRef||!wrappedRef.setNativeProps){return;}wrappedRef.setNativeProps({scrollEnabled:scrollEnabled});this._scrollEnabled=scrollEnabled;}},{key:"_getKeyExtractor",value:function _getKeyExtractor(item,index){return this._needsScrollView()?"scrollview-item-"+index:"flatlist-item-"+index;}},{key:"_getScrollOffset",value:function _getScrollOffset(event){var vertical=this.props.vertical;return event&&event.nativeEvent&&event.nativeEvent.contentOffset&&event.nativeEvent.contentOffset[vertical?'y':'x']||0;}},{key:"_getContainerInnerMargin",value:function _getContainerInnerMargin(){var opposite=arguments.length>0&&arguments[0]!==undefined?arguments[0]:false;var _this$props8=this.props,sliderWidth=_this$props8.sliderWidth,sliderHeight=_this$props8.sliderHeight,itemWidth=_this$props8.itemWidth,itemHeight=_this$props8.itemHeight,vertical=_this$props8.vertical,activeSlideAlignment=_this$props8.activeSlideAlignment;if(activeSlideAlignment==='start'&&!opposite||activeSlideAlignment==='end'&&opposite){return 0;}if(activeSlideAlignment==='end'&&!opposite||activeSlideAlignment==='start'&&opposite){return vertical?sliderHeight-itemHeight:sliderWidth-itemWidth;}return vertical?(sliderHeight-itemHeight)/2:(sliderWidth-itemWidth)/2;}},{key:"_getViewportOffset",value:function _getViewportOffset(){var _this$props9=this.props,sliderWidth=_this$props9.sliderWidth,sliderHeight=_this$props9.sliderHeight,itemWidth=_this$props9.itemWidth,itemHeight=_this$props9.itemHeight,vertical=_this$props9.vertical,activeSlideAlignment=_this$props9.activeSlideAlignment;if(activeSlideAlignment==='start'){return vertical?itemHeight/2:itemWidth/2;}if(activeSlideAlignment==='end'){return vertical?sliderHeight-itemHeight/2:sliderWidth-itemWidth/2;}return vertical?sliderHeight/2:sliderWidth/2;}},{key:"_getCenter",value:function _getCenter(offset){return offset+this._getViewportOffset()-this._getContainerInnerMargin();}},{key:"_getActiveItem",value:function _getActiveItem(offset){var _this$props10=this.props,activeSlideOffset=_this$props10.activeSlideOffset,swipeThreshold=_this$props10.swipeThreshold;var center=this._getCenter(offset);var centerOffset=activeSlideOffset||swipeThreshold;for(var i=0;i<this._positions.length;i+=1){var _this$_positions$i=this._positions[i],start=_this$_positions$i.start,end=_this$_positions$i.end;if(center+centerOffset>=start&&center-centerOffset<=end){return i;}}var lastIndex=this._positions.length-1;if(this._positions[lastIndex]&&center-centerOffset>this._positions[lastIndex].end){return lastIndex;}return 0;}},{key:"_initPositionsAndInterpolators",value:function _initPositionsAndInterpolators(){var _this3=this;var props=arguments.length>0&&arguments[0]!==undefined?arguments[0]:this.props;var data=props.data,itemWidth=props.itemWidth,itemHeight=props.itemHeight,scrollInterpolator=props.scrollInterpolator,vertical=props.vertical;var sizeRef=vertical?itemHeight:itemWidth;if(!data||!data.length){return;}var interpolators=[];this._positions=[];this._getCustomData(props).forEach(function(itemData,index){var _index=_this3._getCustomIndex(index,props);var animatedValue;_this3._positions[index]={start:index*sizeRef,end:index*sizeRef+sizeRef};if(!_this3._shouldAnimateSlides(props)){animatedValue=new _reactNative.Animated.Value(1);}else if(_this3._shouldUseCustomAnimation()){animatedValue=new _reactNative.Animated.Value(_index===_this3._activeItem?1:0);}else{var interpolator;if(scrollInterpolator){interpolator=scrollInterpolator(_index,props);}else if(_this3._shouldUseStackLayout()){interpolator=(0,_animation.stackScrollInterpolator)(_index,props);}else if(_this3._shouldUseTinderLayout()){interpolator=(0,_animation.tinderScrollInterpolator)(_index,props);}if(!interpolator||!interpolator.inputRange||!interpolator.outputRange){interpolator=(0,_animation.defaultScrollInterpolator)(_index,props);}animatedValue=_this3._scrollPos.interpolate(_objectSpread(_objectSpread({},interpolator),{},{extrapolate:'clamp'}));}interpolators.push(animatedValue);});this.setState({interpolators:interpolators});}},{key:"_getSlideAnimation",value:function _getSlideAnimation(index,toValue){var interpolators=this.state.interpolators;var _this$props11=this.props,activeAnimationType=_this$props11.activeAnimationType,activeAnimationOptions=_this$props11.activeAnimationOptions;var animatedValue=interpolators&&interpolators[index];if(!animatedValue&&animatedValue!==0){return null;}var animationCommonOptions=_objectSpread(_objectSpread({isInteraction:false,useNativeDriver:true},activeAnimationOptions),{},{toValue:toValue});return _reactNative.Animated.parallel([_reactNative.Animated.timing(animatedValue,_objectSpread(_objectSpread({},animationCommonOptions),{},{easing:_reactNative.Easing.linear})),_reactNative.Animated[activeAnimationType](animatedValue,_objectSpread({},animationCommonOptions))]);}},{key:"_playCustomSlideAnimation",value:function _playCustomSlideAnimation(current,next){var interpolators=this.state.interpolators;var itemsLength=this._getCustomDataLength();var _currentIndex=this._getCustomIndex(current);var _currentDataIndex=this._getDataIndex(_currentIndex);var _nextIndex=this._getCustomIndex(next);var _nextDataIndex=this._getDataIndex(_nextIndex);var animations=[];if(this._enableLoop()){for(var i=0;i<itemsLength;i+=1){if(this._getDataIndex(i)===_currentDataIndex&&interpolators[i]){animations.push(this._getSlideAnimation(i,0));}else if(this._getDataIndex(i)===_nextDataIndex&&interpolators[i]){animations.push(this._getSlideAnimation(i,1));}}}else{if(interpolators[current]){animations.push(this._getSlideAnimation(current,0));}if(interpolators[next]){animations.push(this._getSlideAnimation(next,1));}}_reactNative.Animated.parallel(animations,{stopTogether:false}).start();}},{key:"_hackActiveSlideAnimation",value:function _hackActiveSlideAnimation(index,goTo){var _this4=this;var force=arguments.length>2&&arguments[2]!==undefined?arguments[2]:false;var data=this.props.data;if(!this._mounted||!this._carouselRef||!this._positions[index]||!force&&this._enableLoop()){return;}var offset=this._positions[index]&&this._positions[index].start;if(!offset&&offset!==0){return;}var itemsLength=data&&data.length;var direction=goTo||itemsLength===1?'start':'end';this._scrollTo(offset+(direction==='start'?-1:1),false);clearTimeout(this._hackSlideAnimationTimeout);this._hackSlideAnimationTimeout=setTimeout(function(){_this4._scrollTo(offset,false);},50);}},{key:"_lockScroll",value:function _lockScroll(){var _this5=this;var lockScrollTimeoutDuration=this.props.lockScrollTimeoutDuration;clearTimeout(this._lockScrollTimeout);this._lockScrollTimeout=setTimeout(function(){_this5._releaseScroll();},lockScrollTimeoutDuration);this._setScrollEnabled(false);}},{key:"_releaseScroll",value:function _releaseScroll(){clearTimeout(this._lockScrollTimeout);this._setScrollEnabled(true);}},{key:"_repositionScroll",value:function _repositionScroll(index){var _this$props12=this.props,data=_this$props12.data,loopClonesPerSide=_this$props12.loopClonesPerSide;var dataLength=data&&data.length;if(!this._enableLoop()||!dataLength||index>=loopClonesPerSide&&index<dataLength+loopClonesPerSide){return;}var repositionTo=index;if(index>=dataLength+loopClonesPerSide){repositionTo=index-dataLength;}else if(index<loopClonesPerSide){repositionTo=index+dataLength;}this._snapToItem(repositionTo,false,false,false,false);}},{key:"_scrollTo",value:function _scrollTo(offset){var animated=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;var vertical=this.props.vertical;var wrappedRef=this._getWrappedRef();if(!this._mounted||!wrappedRef){return;}var specificOptions=this._needsScrollView()?{x:vertical?0:offset,y:vertical?offset:0}:{offset:offset};var options=_objectSpread(_objectSpread({},specificOptions),{},{animated:animated});if(this._needsScrollView()){wrappedRef.scrollTo(options);}else{wrappedRef.scrollToOffset(options);}}},{key:"_onScroll",value:function _onScroll(event){var _this$props13=this.props,callbackOffsetMargin=_this$props13.callbackOffsetMargin,enableMomentum=_this$props13.enableMomentum,onScroll=_this$props13.onScroll;var scrollOffset=event?this._getScrollOffset(event):this._currentContentOffset;var nextActiveItem=this._getActiveItem(scrollOffset);var itemReached=nextActiveItem===this._itemToSnapTo;var scrollConditions=scrollOffset>=this._scrollOffsetRef-callbackOffsetMargin&&scrollOffset<=this._scrollOffsetRef+callbackOffsetMargin;this._currentContentOffset=scrollOffset;this._onScrollTriggered=true;this._lastScrollDate=Date.now();if(this._activeItem!==nextActiveItem&&this._shouldUseCustomAnimation()){this._playCustomSlideAnimation(this._activeItem,nextActiveItem);}if(enableMomentum){clearTimeout(this._snapNoMomentumTimeout);if(this._activeItem!==nextActiveItem){this._activeItem=nextActiveItem;}if(itemReached){if(this._canFireBeforeCallback){this._onBeforeSnap(this._getDataIndex(nextActiveItem));}if(scrollConditions&&this._canFireCallback){this._onSnap(this._getDataIndex(nextActiveItem));}}}else if(this._activeItem!==nextActiveItem&&itemReached){if(this._canFireBeforeCallback){this._onBeforeSnap(this._getDataIndex(nextActiveItem));}if(scrollConditions){this._activeItem=nextActiveItem;if(this._canLockScroll()){this._releaseScroll();}if(this._canFireCallback){this._onSnap(this._getDataIndex(nextActiveItem));}}}if(nextActiveItem===this._itemToSnapTo&&scrollOffset===this._scrollOffsetRef){this._repositionScroll(nextActiveItem);}if(typeof onScroll==='function'&&event){onScroll(event);}}},{key:"_onStartShouldSetResponderCapture",value:function _onStartShouldSetResponderCapture(event){var onStartShouldSetResponderCapture=this.props.onStartShouldSetResponderCapture;if(onStartShouldSetResponderCapture){onStartShouldSetResponderCapture(event);}return this._getScrollEnabled();}},{key:"_onTouchStart",value:function _onTouchStart(){var onTouchStart=this.props.onTouchStart;if(this._getScrollEnabled()!==false&&this._autoplaying){this.stopAutoplay();}if(onTouchStart){onTouchStart();}}},{key:"_onTouchEnd",value:function _onTouchEnd(){var _this$props14=this.props,onTouchEnd=_this$props14.onTouchEnd,autoplay=_this$props14.autoplay;if(this._getScrollEnabled()!==false&&autoplay&&!this._autoplaying){this.startAutoplay();}if(onTouchEnd){onTouchEnd();}}},{key:"_onScrollBeginDrag",value:function _onScrollBeginDrag(event){var onScrollBeginDrag=this.props.onScrollBeginDrag;if(!this._getScrollEnabled()){return;}this._scrollStartOffset=this._getScrollOffset(event);this._scrollStartActive=this._getActiveItem(this._scrollStartOffset);this._ignoreNextMomentum=false;if(onScrollBeginDrag){onScrollBeginDrag(event);}}},{key:"_onScrollEndDrag",value:function _onScrollEndDrag(event){var onScrollEndDrag=this.props.onScrollEndDrag;if(this._carouselRef){if(this._onScrollEnd)this._onScrollEnd();}if(onScrollEndDrag){onScrollEndDrag(event);}}},{key:"_onMomentumScrollEnd",value:function _onMomentumScrollEnd(event){var onMomentumScrollEnd=this.props.onMomentumScrollEnd;if(this._carouselRef){if(this._onScrollEnd)this._onScrollEnd();}if(onMomentumScrollEnd){onMomentumScrollEnd(event);}}},{key:"_onScrollEnd",value:function _onScrollEnd(){var _this6=this;var _this$props15=this.props,autoplay=_this$props15.autoplay,autoplayDelay=_this$props15.autoplayDelay,enableSnap=_this$props15.enableSnap;if(this._ignoreNextMomentum){this._ignoreNextMomentum=false;return;}this._scrollEndOffset=this._currentContentOffset;this._scrollEndActive=this._getActiveItem(this._scrollEndOffset);if(enableSnap){this._snapScroll(this._scrollEndOffset-this._scrollStartOffset);}if(autoplay&&!this._autoplaying){clearTimeout(this._enableAutoplayTimeout);this._enableAutoplayTimeout=setTimeout(function(){_this6.startAutoplay();},autoplayDelay+50);}}},{key:"_onTouchRelease",value:function _onTouchRelease(){var _this7=this;var enableMomentum=this.props.enableMomentum;if(enableMomentum&&IS_IOS){clearTimeout(this._snapNoMomentumTimeout);this._snapNoMomentumTimeout=setTimeout(function(){_this7._snapToItem(_this7._activeItem);},100);}}},{key:"_onLayout",value:function _onLayout(event){var onLayout=this.props.onLayout;if(this._onLayoutInitDone){this._initPositionsAndInterpolators();this._snapToItem(this._activeItem,false,false,false,false);}else{this._onLayoutInitDone=true;}if(onLayout){onLayout(event);}}},{key:"_snapScroll",value:function _snapScroll(delta){var swipeThreshold=this.props.swipeThreshold;if(!this._scrollEndActive&&this._scrollEndActive!==0&&IS_IOS){this._scrollEndActive=this._scrollStartActive;}if(this._scrollStartActive!==this._scrollEndActive){this._snapToItem(this._scrollEndActive);}else{if(delta>0){if(delta>swipeThreshold){this._snapToItem(this._scrollStartActive+1);}else{this._snapToItem(this._scrollEndActive);}}else if(delta<0){if(delta<-swipeThreshold){this._snapToItem(this._scrollStartActive-1);}else{this._snapToItem(this._scrollEndActive);}}else{this._snapToItem(this._scrollEndActive);}}}},{key:"_snapToItem",value:function _snapToItem(index){var _this8=this;var animated=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;var fireCallback=arguments.length>2&&arguments[2]!==undefined?arguments[2]:true;var initial=arguments.length>3&&arguments[3]!==undefined?arguments[3]:false;var lockScroll=arguments.length>4&&arguments[4]!==undefined?arguments[4]:true;var _this$props16=this.props,enableMomentum=_this$props16.enableMomentum,onSnapToItem=_this$props16.onSnapToItem,onBeforeSnapToItem=_this$props16.onBeforeSnapToItem;var itemsLength=this._getCustomDataLength();var wrappedRef=this._getWrappedRef();if(!itemsLength||!wrappedRef){return;}if(!index||index<0){index=0;}else if(itemsLength>0&&index>=itemsLength){index=itemsLength-1;}if(index!==this._previousActiveItem){this._previousActiveItem=index;if(lockScroll&&this._canLockScroll()){this._lockScroll();}if(fireCallback){if(onBeforeSnapToItem){this._canFireBeforeCallback=true;}if(onSnapToItem){this._canFireCallback=true;}}}this._itemToSnapTo=index;this._scrollOffsetRef=this._positions[index]&&this._positions[index].start;this._onScrollTriggered=false;if(!this._scrollOffsetRef&&this._scrollOffsetRef!==0){return;}this._scrollTo(this._scrollOffsetRef,animated);if(enableMomentum){if(IS_IOS&&!initial){this._ignoreNextMomentum=true;}if(index===0||index===itemsLength-1){clearTimeout(this._edgeItemTimeout);this._edgeItemTimeout=setTimeout(function(){if(!initial&&index===_this8._activeItem&&!_this8._onScrollTriggered){_this8._onScroll();}},250);}}}},{key:"_onBeforeSnap",value:function _onBeforeSnap(index){var onBeforeSnapToItem=this.props.onBeforeSnapToItem;if(!this._carouselRef){return;}this._canFireBeforeCallback=false;if(onBeforeSnapToItem)onBeforeSnapToItem(index);}},{key:"_onSnap",value:function _onSnap(index){var onSnapToItem=this.props.onSnapToItem;if(!this._carouselRef){return;}this._canFireCallback=false;if(onSnapToItem)onSnapToItem(index);}},{key:"startAutoplay",value:function startAutoplay(){var _this9=this;var _this$props17=this.props,autoplayInterval=_this$props17.autoplayInterval,autoplayDelay=_this$props17.autoplayDelay;if(this._autoplaying){return;}clearTimeout(this._autoplayTimeout);this._autoplayTimeout=setTimeout(function(){_this9._autoplaying=true;_this9._autoplayInterval=setInterval(function(){if(_this9._autoplaying){_this9.snapToNext();}},autoplayInterval);},autoplayDelay);}},{key:"stopAutoplay",value:function stopAutoplay(){this._autoplaying=false;clearInterval(this._autoplayInterval);}},{key:"snapToItem",value:function snapToItem(index){var animated=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;var fireCallback=arguments.length>2&&arguments[2]!==undefined?arguments[2]:true;if(!index||index<0){index=0;}var positionIndex=this._getPositionIndex(index);if(positionIndex===this._activeItem){return;}this._snapToItem(positionIndex,animated,fireCallback);}},{key:"snapToNext",value:function snapToNext(){var animated=arguments.length>0&&arguments[0]!==undefined?arguments[0]:true;var fireCallback=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;var itemsLength=this._getCustomDataLength();var newIndex=this._activeItem+1;if(newIndex>itemsLength-1){if(!this._enableLoop()){return;}newIndex=0;}this._snapToItem(newIndex,animated,fireCallback);}},{key:"snapToPrev",value:function snapToPrev(){var animated=arguments.length>0&&arguments[0]!==undefined?arguments[0]:true;var fireCallback=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;var itemsLength=this._getCustomDataLength();var newIndex=this._activeItem-1;if(newIndex<0){if(!this._enableLoop()){return;}newIndex=itemsLength-1;}this._snapToItem(newIndex,animated,fireCallback);}},{key:"triggerRenderingHack",value:function triggerRenderingHack(offset){if(Date.now()-this._lastScrollDate<500){return;}var scrollPosition=this._currentContentOffset;if(!scrollPosition&&scrollPosition!==0){return;}var scrollOffset=offset||(scrollPosition===0?1:-1);this._scrollTo(scrollPosition+scrollOffset,false);}},{key:"_getSlideInterpolatedStyle",value:function _getSlideInterpolatedStyle(index,animatedValue){var _this$props18=this.props,layoutCardOffset=_this$props18.layoutCardOffset,slideInterpolatedStyle=_this$props18.slideInterpolatedStyle;if(slideInterpolatedStyle){return slideInterpolatedStyle(index,animatedValue,this.props);}if(this._shouldUseTinderLayout()){return(0,_animation.tinderAnimatedStyles)(index,animatedValue,this.props,layoutCardOffset);}if(this._shouldUseStackLayout()){return(0,_animation.stackAnimatedStyles)(index,animatedValue,this.props,layoutCardOffset);}if(this._shouldUseShiftLayout()){return(0,_animation.shiftAnimatedStyles)(index,animatedValue,this.props);}return(0,_animation.defaultAnimatedStyles)(index,animatedValue,this.props);}},{key:"_renderItem",value:function _renderItem(_ref){var item=_ref.item,index=_ref.index;var interpolators=this.state.interpolators;var _this$props19=this.props,hasParallaxImages=_this$props19.hasParallaxImages,itemWidth=_this$props19.itemWidth,itemHeight=_this$props19.itemHeight,keyExtractor=_this$props19.keyExtractor,renderItem=_this$props19.renderItem,sliderHeight=_this$props19.sliderHeight,sliderWidth=_this$props19.sliderWidth,slideStyle=_this$props19.slideStyle,vertical=_this$props19.vertical,isCustomScrollWidth=_this$props19.isCustomScrollWidth;var animatedValue=interpolators&&interpolators[index];if(!animatedValue&&animatedValue!==0){return null;}var animate=this._shouldAnimateSlides();var ComponentView=animate?_reactNative.Animated.View:_reactNative.View;var animatedStyle=animate?this._getSlideInterpolatedStyle(index,animatedValue):{};var parallaxProps=hasParallaxImages?{scrollPosition:this._scrollPos,carouselRef:this._carouselRef,vertical:vertical,sliderWidth:sliderWidth,sliderHeight:sliderHeight,itemWidth:itemWidth,itemHeight:itemHeight}:undefined;var specificProps=this._needsScrollView()?{key:keyExtractor?keyExtractor(item,index):this._getKeyExtractor(item,index)}:{};var mainDimension=isCustomScrollWidth?{}:{width:itemWidth};return _react.default.createElement(ComponentView,(0,_extends2.default)({style:[mainDimension,slideStyle,animatedStyle],pointerEvents:"box-none"},specificProps,{__source:{fileName:_jsxFileName,lineNumber:1159,columnNumber:13}}),renderItem({item:item,index:index,realIndex:this._getDataIndex(index),activeIndex:this._getDataIndex(this._activeItem)},parallaxProps));}},{key:"_getComponentOverridableProps",value:function _getComponentOverridableProps(){var _this$props20=this.props,enableMomentum=_this$props20.enableMomentum,itemWidth=_this$props20.itemWidth,itemHeight=_this$props20.itemHeight,loopClonesPerSide=_this$props20.loopClonesPerSide,sliderWidth=_this$props20.sliderWidth,sliderHeight=_this$props20.sliderHeight,vertical=_this$props20.vertical;var visibleItems=Math.ceil(vertical?sliderHeight/itemHeight:sliderWidth/itemWidth)+1;var initialNumPerSide=this._enableLoop()?loopClonesPerSide:2;var initialNumToRender=visibleItems+initialNumPerSide*2;var maxToRenderPerBatch=1+initialNumToRender*2;var windowSize=maxToRenderPerBatch;var specificProps=!this._needsScrollView()?{initialNumToRender:initialNumToRender,maxToRenderPerBatch:maxToRenderPerBatch,windowSize:windowSize}:{};return _objectSpread({decelerationRate:enableMomentum?0.9:'fast',showsHorizontalScrollIndicator:false,showsVerticalScrollIndicator:false,overScrollMode:'never',automaticallyAdjustContentInsets:false,directionalLockEnabled:true,pinchGestureEnabled:false,scrollsToTop:false,removeClippedSubviews:!this._needsScrollView(),inverted:this._needsRTLAdaptations()},specificProps);}},{key:"_getComponentStaticProps",value:function _getComponentStaticProps(){var _this10=this;var hideCarousel=this.state.hideCarousel;var _this$props21=this.props,containerCustomStyle=_this$props21.containerCustomStyle,contentContainerCustomStyle=_this$props21.contentContainerCustomStyle,keyExtractor=_this$props21.keyExtractor,sliderWidth=_this$props21.sliderWidth,sliderHeight=_this$props21.sliderHeight,style=_this$props21.style,vertical=_this$props21.vertical;var containerStyle=[containerCustomStyle||style||{},hideCarousel?{opacity:0}:{},vertical?{height:sliderHeight,flexDirection:'column'}:{width:sliderWidth,flexDirection:this._needsRTLAdaptations()?'row-reverse':'row'}];var contentContainerStyle=[vertical?{paddingTop:this._getContainerInnerMargin(),paddingBottom:this._getContainerInnerMargin(true)}:{paddingLeft:this._getContainerInnerMargin(),paddingRight:this._getContainerInnerMargin(true)},contentContainerCustomStyle||{}];var specificProps=!this._needsScrollView()?{renderItem:this._renderItem,numColumns:1,getItemLayout:undefined,initialScrollIndex:undefined,keyExtractor:keyExtractor||this._getKeyExtractor}:{};return _objectSpread({ref:function ref(c){return _this10._carouselRef=c;},data:this._getCustomData(),style:containerStyle,contentContainerStyle:contentContainerStyle,horizontal:!vertical,scrollEventThrottle:1,onScroll:this._onScrollHandler,onScrollBeginDrag:this._onScrollBeginDrag,onScrollEndDrag:this._onScrollEndDrag,onMomentumScrollEnd:this._onMomentumScrollEnd,onResponderRelease:this._onTouchRelease,onStartShouldSetResponderCapture:this._onStartShouldSetResponderCapture,onTouchStart:this._onTouchStart,onTouchEnd:this._onScrollEnd,onLayout:this._onLayout},specificProps);}},{key:"render",value:function render(){var _this11=this;var _this$props22=this.props,data=_this$props22.data,renderItem=_this$props22.renderItem,useScrollView=_this$props22.useScrollView;if(!data||!renderItem){return null;}var props=_objectSpread(_objectSpread(_objectSpread({},this._getComponentOverridableProps()),this.props),this._getComponentStaticProps());var ScrollViewComponent=typeof useScrollView==='function'?useScrollView:AnimatedScrollView;return this._needsScrollView()?_react.default.createElement(ScrollViewComponent,(0,_extends2.default)({},props,{__source:{fileName:_jsxFileName,lineNumber:1289,columnNumber:13}}),this._getCustomData().map(function(item,index){return _this11._renderItem({item:item,index:index,realIndex:_this11._getDataIndex(index),activeIndex:_this11._getDataIndex(_this11._activeItem)});})):_react.default.createElement(AnimatedFlatList,(0,_extends2.default)({},props,{__source:{fileName:_jsxFileName,lineNumber:1297,columnNumber:13}}));}}]);return Carousel;}(_react.PureComponent);exports.default=Carousel;Carousel.propTypes={data:_propTypes.default.array.isRequired,renderItem:_propTypes.default.func.isRequired,itemWidth:_propTypes.default.number,itemHeight:_propTypes.default.number,sliderWidth:_propTypes.default.number,sliderHeight:_propTypes.default.number,activeAnimationType:_propTypes.default.string,activeAnimationOptions:_propTypes.default.object,activeSlideAlignment:_propTypes.default.oneOf(['center','end','start']),activeSlideOffset:_propTypes.default.number,apparitionDelay:_propTypes.default.number,autoplay:_propTypes.default.bool,autoplayDelay:_propTypes.default.number,autoplayInterval:_propTypes.default.number,callbackOffsetMargin:_propTypes.default.number,containerCustomStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),contentContainerCustomStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),enableMomentum:_propTypes.default.bool,enableSnap:_propTypes.default.bool,firstItem:_propTypes.default.number,hasParallaxImages:_propTypes.default.bool,inactiveSlideOpacity:_propTypes.default.number,inactiveSlideScale:_propTypes.default.number,inactiveSlideShift:_propTypes.default.number,layout:_propTypes.default.oneOf(['default','stack','tinder']),layoutCardOffset:_propTypes.default.number,lockScrollTimeoutDuration:_propTypes.default.number,lockScrollWhileSnapping:_propTypes.default.bool,loop:_propTypes.default.bool,loopClonesPerSide:_propTypes.default.number,scrollEnabled:_propTypes.default.bool,scrollInterpolator:_propTypes.default.func,slideInterpolatedStyle:_propTypes.default.func,slideStyle:_propTypes.default.object,shouldOptimizeUpdates:_propTypes.default.bool,swipeThreshold:_propTypes.default.number,useScrollView:_propTypes.default.oneOfType([_propTypes.default.bool,_propTypes.default.func]),vertical:_propTypes.default.bool,showsPagination:_propTypes.default.bool,isCustomScrollWidth:_propTypes.default.bool,onBeforeSnapToItem:_propTypes.default.func,onSnapToItem:_propTypes.default.func};Carousel.defaultProps={activeAnimationType:'timing',activeAnimationOptions:null,activeSlideAlignment:'center',activeSlideOffset:20,apparitionDelay:0,autoplay:false,autoplayDelay:1000,autoplayInterval:3000,callbackOffsetMargin:5,containerCustomStyle:{},contentContainerCustomStyle:{},enableMomentum:false,enableSnap:true,firstItem:0,hasParallaxImages:false,inactiveSlideOpacity:0.7,inactiveSlideScale:0.9,inactiveSlideShift:0,layout:'default',lockScrollTimeoutDuration:1000,lockScrollWhileSnapping:false,loop:false,loopClonesPerSide:3,scrollEnabled:true,slideStyle:{},shouldOptimizeUpdates:true,swipeThreshold:20,useScrollView:!AnimatedFlatList,vertical:false,showsPagination:true,isCustomScrollWidth:false};
+/* eslint-disable no-undef */
+/* eslint-disable no-lonely-if */
+/* eslint-disable no-param-reassign */
+/* eslint-disable react/jsx-props-no-spreading */
+import React, { PureComponent } from 'react';
+import {
+    Animated, Easing, FlatList, I18nManager, Platform, ScrollView, View, ViewPropTypes
+} from 'react-native';
+import PropTypes from 'prop-types';
+import {
+    defaultScrollInterpolator,
+    stackScrollInterpolator,
+    tinderScrollInterpolator,
+    defaultAnimatedStyles,
+    shiftAnimatedStyles,
+    stackAnimatedStyles,
+    tinderAnimatedStyles
+} from './utils/animation';
+
+const IS_IOS = Platform.OS === 'ios';
+
+// Native driver for scroll events
+// See: https://facebook.github.io/react-native/blog/2017/02/14/using-native-driver-for-animated.html
+const AnimatedFlatList = FlatList ? Animated.createAnimatedComponent(FlatList) : null;
+const AnimatedScrollView = Animated.createAnimatedComponent(ScrollView);
+
+// React Native automatically handles RTL layouts; unfortunately, it's buggy with horizontal ScrollView
+// See https://github.com/facebook/react-native/issues/11960
+// NOTE: the following variable is not declared in the constructor
+// otherwise it is undefined at init, which messes with custom indexes
+const IS_RTL = I18nManager.isRTL;
+
+export default class Carousel extends PureComponent {
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            hideCarousel: true,
+            interpolators: []
+        };
+
+        // The following values are not stored in the state because 'setState()' is asynchronous
+        // and this results in an absolutely crappy behavior on Android while swiping (see #156)
+        const initialActiveItem = this._getFirstItem(props.firstItem);
+        this._activeItem = initialActiveItem;
+        this._previousActiveItem = initialActiveItem;
+        this._previousFirstItem = initialActiveItem;
+        this._previousItemsLength = initialActiveItem;
+
+        this._mounted = false;
+        this._positions = [];
+        this._currentContentOffset = 0; // store ScrollView's scroll position
+        this._canFireBeforeCallback = false;
+        this._canFireCallback = false;
+        this._scrollOffsetRef = null;
+        this._onScrollTriggered = true; // used when momentum is enabled to prevent an issue with edges items
+        this._lastScrollDate = 0; // used to work around a FlatList bug
+        this._scrollEnabled = props.scrollEnabled !== false;
+
+        this._initPositionsAndInterpolators = this._initPositionsAndInterpolators.bind(this);
+        this._renderItem = this._renderItem.bind(this);
+        this._onSnap = this._onSnap.bind(this);
+
+        this._onLayout = this._onLayout.bind(this);
+        this._onScroll = this._onScroll.bind(this);
+        this._onScrollBeginDrag = props.enableSnap ? this._onScrollBeginDrag.bind(this) : undefined;
+        this._onScrollEnd = props.enableSnap || props.autoplay ? this._onScrollEnd.bind(this) : undefined;
+        this._onScrollEndDrag = !props.enableMomentum ? this._onScrollEndDrag.bind(this) : undefined;
+        this._onMomentumScrollEnd = props.enableMomentum ? this._onMomentumScrollEnd.bind(this) : undefined;
+        this._onTouchStart = this._onTouchStart.bind(this);
+        this._onTouchEnd = this._onTouchEnd.bind(this);
+        this._onTouchRelease = this._onTouchRelease.bind(this);
+
+        this._getKeyExtractor = this._getKeyExtractor.bind(this);
+
+        this._setScrollHandler(props);
+
+        // This bool aims at fixing an iOS bug due to scrollTo that triggers onMomentumScrollEnd.
+        // onMomentumScrollEnd fires this._snapScroll, thus creating an infinite loop.
+        this._ignoreNextMomentum = false;
+        this._animated = false;
+
+        // Warnings
+        if (!ViewPropTypes) {
+            console.warn(`react-native-snap-carousel: 
+            It is recommended to use at least version 0.44 of React Native with the plugin`);
+        }
+        if (!props.vertical && (!props.sliderWidth || !props.itemWidth)) {
+            console.warn(`react-native-snap-carousel: You need to specify both sliderWidth and itemWidth 
+            for horizontal carousels`);
+        }
+        if (props.vertical && (!props.sliderHeight || !props.itemHeight)) {
+            console.warn(`react-native-snap-carousel: You need to specify both sliderHeight and itemHeight 
+            for vertical carousels`);
+        }
+        if (props.apparitionDelay && !IS_IOS && !props.useScrollView) {
+            console.warn(`react-native-snap-carousel: Using apparitionDelay on Android 
+            is not recommended since it can lead to rendering issues`);
+        }
+        if (props.customAnimationType || props.customAnimationOptions) {
+            console.warn(`react-native-snap-carousel: Props customAnimationType and 
+            customAnimationOptions have been renamed to activeAnimationType and  activeAnimationOptions`);
+        }
+        if (props.onScrollViewScroll) {
+            console.warn(`react-native-snap-carousel: Prop onScrollViewScroll has been removed. 
+            Use onScroll instead`);
+        }
+    }
+
+    componentDidMount() {
+        const { apparitionDelay, autoplay, firstItem } = this.props;
+        const _firstItem = this._getFirstItem(firstItem);
+        const apparitionCallback = () => {
+            this.setState({ hideCarousel: false });
+            if (autoplay) {
+                this.startAutoplay();
+            }
+        };
+
+        this._mounted = true;
+        this._initPositionsAndInterpolators();
+
+        // Without 'requestAnimationFrame' or a `0` timeout, images will randomly not be rendered on Android...
+        requestAnimationFrame(() => {
+            if (!this._mounted) {
+                return;
+            }
+
+            this._snapToItem(_firstItem, false, false, true, false);
+            this._hackActiveSlideAnimation(_firstItem, 'start', true);
+
+            if (apparitionDelay) {
+                this._apparitionTimeout = setTimeout(() => {
+                    apparitionCallback();
+                }, apparitionDelay);
+            } else {
+                apparitionCallback();
+            }
+        });
+    }
+
+    // shouldComponentUpdate(nextProps, nextState) {
+    //     const { shouldOptimizeUpdates } = this.props;
+    //     if (shouldOptimizeUpdates === false) {
+    //         return true;
+    //     }
+    //     if (shallowCompare(this.props, nextProps)) {
+    //         return true;
+    //     }
+    //     if (shallowCompare(this.state, nextState)) {
+    //         return true;
+    //     }
+    //     return false;
+    // }
+
+    UNSAFE_componentWillReceiveProps(nextProps) {
+        const { interpolators } = this.state;
+        const {
+            itemHeight, itemWidth, scrollEnabled, sliderHeight, sliderWidth, onScroll
+        } = this.props;
+        const itemsLength = this._getCustomDataLength(nextProps);
+
+        if (!itemsLength) {
+            return;
+        }
+
+        const nextFirstItem = this._getFirstItem(nextProps.firstItem, nextProps);
+        let nextActiveItem = this._activeItem || this._activeItem === 0 ? this._activeItem : nextFirstItem;
+
+        const hasNewSliderWidth = nextProps.sliderWidth && nextProps.sliderWidth !== sliderWidth;
+        const hasNewSliderHeight = nextProps.sliderHeight && nextProps.sliderHeight !== sliderHeight;
+        const hasNewItemWidth = nextProps.itemWidth && nextProps.itemWidth !== itemWidth;
+        const hasNewItemHeight = nextProps.itemHeight && nextProps.itemHeight !== itemHeight;
+        const hasNewScrollEnabled = nextProps.scrollEnabled !== scrollEnabled;
+
+        // Prevent issues with dynamically removed items
+        if (nextActiveItem > itemsLength - 1) {
+            nextActiveItem = itemsLength - 1;
+        }
+
+        // Handle changing scrollEnabled independent of user -> carousel interaction
+        if (hasNewScrollEnabled) {
+            this._setScrollEnabled(nextProps.scrollEnabled);
+        }
+
+        if (interpolators.length !== itemsLength || hasNewSliderWidth
+            || hasNewSliderHeight || hasNewItemWidth || hasNewItemHeight) {
+            this._activeItem = nextActiveItem;
+            this._previousItemsLength = itemsLength;
+
+            this._initPositionsAndInterpolators(nextProps);
+
+            // Handle scroll issue when dynamically removing items (see #133)
+            // This also fixes first item's active state on Android
+            // Because 'initialScrollIndex' apparently doesn't trigger scroll
+            if (this._previousItemsLength > itemsLength) {
+                this._hackActiveSlideAnimation(nextActiveItem, null, true);
+            }
+
+            if (hasNewSliderWidth || hasNewSliderHeight || hasNewItemWidth || hasNewItemHeight) {
+                this._snapToItem(nextActiveItem, false, false, false, false);
+            }
+        } else if (nextFirstItem !== this._previousFirstItem && nextFirstItem !== this._activeItem) {
+            this._activeItem = nextFirstItem;
+            this._previousFirstItem = nextFirstItem;
+            this._snapToItem(nextFirstItem, false, true, false, false);
+        }
+
+        if (nextProps.onScroll !== onScroll) {
+            this._setScrollHandler(nextProps);
+        }
+    }
+
+    componentWillUnmount() {
+        this._mounted = false;
+        this.stopAutoplay();
+        clearTimeout(this._apparitionTimeout);
+        clearTimeout(this._hackSlideAnimationTimeout);
+        clearTimeout(this._enableAutoplayTimeout);
+        clearTimeout(this._autoplayTimeout);
+        clearTimeout(this._snapNoMomentumTimeout);
+        clearTimeout(this._edgeItemTimeout);
+        clearTimeout(this._lockScrollTimeout);
+    }
+
+    get realIndex() {
+        return this._activeItem;
+    }
+
+    get currentIndex() {
+        return this._getDataIndex(this._activeItem);
+    }
+
+    get currentScrollPosition() {
+        return this._currentContentOffset;
+    }
+
+    _setScrollHandler(props) {
+        // Native driver for scroll events
+        const scrollEventConfig = {
+            listener: this._onScroll,
+            useNativeDriver: true,
+        };
+        this._scrollPos = new Animated.Value(0);
+        const argMapping = props.vertical
+            ? [{ nativeEvent: { contentOffset: { y: this._scrollPos } } }]
+            : [{ nativeEvent: { contentOffset: { x: this._scrollPos } } }];
+
+        if (props.onScroll && Array.isArray(props.onScroll._argMapping)) {
+            // Because of a react-native issue https://github.com/facebook/react-native/issues/13294
+            argMapping.pop();
+            const [argMap] = props.onScroll._argMapping;
+            if (argMap && argMap.nativeEvent && argMap.nativeEvent.contentOffset) {
+                // Shares the same animated value passed in props
+                this._scrollPos = argMap.nativeEvent.contentOffset.x
+                    || argMap.nativeEvent.contentOffset.y
+                    || this._scrollPos;
+            }
+            argMapping.push(...props.onScroll._argMapping);
+        }
+        this._onScrollHandler = Animated.event(
+            argMapping,
+            scrollEventConfig
+        );
+    }
+
+    _needsScrollView() {
+        const { useScrollView } = this.props;
+        return useScrollView || !AnimatedFlatList || this._shouldUseStackLayout() || this._shouldUseTinderLayout();
+    }
+
+    _needsRTLAdaptations() {
+        const { vertical } = this.props;
+        return IS_RTL && !IS_IOS && !vertical;
+    }
+
+    _canLockScroll() {
+        const { scrollEnabled, enableMomentum, lockScrollWhileSnapping } = this.props;
+        return scrollEnabled && !enableMomentum && lockScrollWhileSnapping;
+    }
+
+    _enableLoop() {
+        const { data, enableSnap, loop } = this.props;
+        return enableSnap && loop && data && data.length && data.length > 1;
+    }
+
+    _shouldAnimateSlides(props = this.props) {
+        const {
+            inactiveSlideOpacity, inactiveSlideScale, scrollInterpolator, slideInterpolatedStyle
+        } = props;
+        return inactiveSlideOpacity < 1
+            || inactiveSlideScale < 1
+            || !!scrollInterpolator
+            || !!slideInterpolatedStyle
+            || this._shouldUseShiftLayout()
+            || this._shouldUseStackLayout()
+            || this._shouldUseTinderLayout();
+    }
+
+    _shouldUseCustomAnimation() {
+        const { activeAnimationOptions } = this.props;
+        return !!activeAnimationOptions && !this._shouldUseStackLayout() && !this._shouldUseTinderLayout();
+    }
+
+    _shouldUseShiftLayout() {
+        const { inactiveSlideShift, layout } = this.props;
+        return layout === 'default' && inactiveSlideShift !== 0;
+    }
+
+    _shouldUseStackLayout() {
+        const { layout } = this.props;
+        return layout === 'stack';
+    }
+
+    _shouldUseTinderLayout() {
+        const { layout } = this.props;
+        return layout === 'tinder';
+    }
+
+    _getCustomData(props = this.props) {
+        const { data, loopClonesPerSide } = props;
+        const dataLength = data && data.length;
+
+        if (!dataLength) {
+            return [];
+        }
+
+        if (!this._enableLoop()) {
+            return data;
+        }
+
+        let previousItems = [];
+        let nextItems = [];
+
+        if (loopClonesPerSide > dataLength) {
+            const dataMultiplier = Math.floor(loopClonesPerSide / dataLength);
+            const remainder = loopClonesPerSide % dataLength;
+
+            for (let i = 0; i < dataMultiplier; i += 1) {
+                previousItems.push(...data);
+                nextItems.push(...data);
+            }
+
+            previousItems.unshift(...data.slice(-remainder));
+            nextItems.push(...data.slice(0, remainder));
+        } else {
+            previousItems = data.slice(-loopClonesPerSide);
+            nextItems = data.slice(0, loopClonesPerSide);
+        }
+        return previousItems.concat(data, nextItems);
+    }
+
+    _getCustomDataLength(props = this.props) {
+        const { data, loopClonesPerSide } = props;
+        const dataLength = data && data.length;
+
+        if (!dataLength) {
+            return 0;
+        }
+
+        return this._enableLoop() ? dataLength + (2 * loopClonesPerSide) : dataLength;
+    }
+
+    _getCustomIndex(index, props = this.props) {
+        const itemsLength = this._getCustomDataLength(props);
+
+        if (!itemsLength || (!index && index !== 0)) {
+            return 0;
+        }
+
+        return this._needsRTLAdaptations() ? itemsLength - index - 1 : index;
+    }
+
+    _getDataIndex(index) {
+        const { data, loopClonesPerSide } = this.props;
+        const dataLength = data && data.length;
+
+        if (!this._enableLoop() || !dataLength) {
+            return index;
+        }
+
+        if (index >= dataLength + loopClonesPerSide) {
+            return loopClonesPerSide > dataLength
+                ? (index - loopClonesPerSide) % dataLength
+                : index - dataLength - loopClonesPerSide;
+        } if (index < loopClonesPerSide) {
+            // TODO: is there a simpler way of determining the interpolated index?
+            if (loopClonesPerSide > dataLength) {
+                const baseDataIndexes = [];
+                const dataIndexes = [];
+                const dataMultiplier = Math.floor(loopClonesPerSide / dataLength);
+                const remainder = loopClonesPerSide % dataLength;
+
+                for (let i = 0; i < dataLength; i += 1) {
+                    baseDataIndexes.push(i);
+                }
+
+                for (let j = 0; j < dataMultiplier; j += 1) {
+                    dataIndexes.push(...baseDataIndexes);
+                }
+
+                dataIndexes.unshift(...baseDataIndexes.slice(-remainder));
+                return dataIndexes[index];
+            }
+            return index + dataLength - loopClonesPerSide;
+        }
+        return index - loopClonesPerSide;
+    }
+
+    // Used with `snapToItem()` and 'PaginationDot'
+    _getPositionIndex(index) {
+        const { loop, loopClonesPerSide } = this.props;
+        return loop ? index + loopClonesPerSide : index;
+    }
+
+    _getFirstItem(index, props = this.props) {
+        const { loopClonesPerSide } = props;
+        const itemsLength = this._getCustomDataLength(props);
+
+        if (!itemsLength || index > itemsLength - 1 || index < 0) {
+            return 0;
+        }
+
+        return this._enableLoop() ? index + loopClonesPerSide : index;
+    }
+
+    _getWrappedRef() {
+        if (this._carouselRef && (
+            (this._needsScrollView() && this._carouselRef.scrollTo)
+            || (!this._needsScrollView() && this._carouselRef.scrollToOffset)
+        )) {
+            return this._carouselRef;
+        }
+        // https://github.com/facebook/react-native/issues/10635
+        // https://stackoverflow.com/a/48786374/8412141
+        return this._carouselRef && this._carouselRef.getNode && this._carouselRef.getNode();
+    }
+
+    _getScrollEnabled() {
+        return this._scrollEnabled;
+    }
+
+    _setScrollEnabled(scrollEnabled = true) {
+        const wrappedRef = this._getWrappedRef();
+
+        if (!wrappedRef || !wrappedRef.setNativeProps) {
+            return;
+        }
+
+        // 'setNativeProps()' is used instead of 'setState()' because the latter
+        // really takes a toll on Android behavior when momentum is disabled
+        wrappedRef.setNativeProps({ scrollEnabled });
+        this._scrollEnabled = scrollEnabled;
+    }
+
+    _getKeyExtractor(item, index) {
+        return this._needsScrollView() ? `scrollview-item-${index}` : `flatlist-item-${index}`;
+    }
+
+    _getScrollOffset(event) {
+        const { vertical } = this.props;
+        return (event && event.nativeEvent && event.nativeEvent.contentOffset
+            && event.nativeEvent.contentOffset[vertical ? 'y' : 'x']) || 0;
+    }
+
+    _getContainerInnerMargin(opposite = false) {
+        const {
+            sliderWidth, sliderHeight, itemWidth, itemHeight, vertical, activeSlideAlignment
+        } = this.props;
+
+        if ((activeSlideAlignment === 'start' && !opposite)
+            || (activeSlideAlignment === 'end' && opposite)) {
+            return 0;
+        } if ((activeSlideAlignment === 'end' && !opposite)
+            || (activeSlideAlignment === 'start' && opposite)) {
+            return vertical ? sliderHeight - itemHeight : sliderWidth - itemWidth;
+        }
+        return vertical ? (sliderHeight - itemHeight) / 2 : (sliderWidth - itemWidth) / 2;
+    }
+
+    _getViewportOffset() {
+        const {
+            sliderWidth, sliderHeight, itemWidth, itemHeight, vertical, activeSlideAlignment
+        } = this.props;
+
+        if (activeSlideAlignment === 'start') {
+            return vertical ? itemHeight / 2 : itemWidth / 2;
+        } if (activeSlideAlignment === 'end') {
+            return vertical
+                ? sliderHeight - (itemHeight / 2)
+                : sliderWidth - (itemWidth / 2);
+        }
+        return vertical ? sliderHeight / 2 : sliderWidth / 2;
+    }
+
+    _getCenter(offset) {
+        return offset + this._getViewportOffset() - this._getContainerInnerMargin();
+    }
+
+    _getActiveItem(offset) {
+        const { activeSlideOffset, swipeThreshold } = this.props;
+        const center = this._getCenter(offset);
+        const centerOffset = activeSlideOffset || swipeThreshold;
+
+        for (let i = 0; i < this._positions.length; i += 1) {
+            const { start, end } = this._positions[i];
+            if (center + centerOffset >= start && center - centerOffset <= end) {
+                return i;
+            }
+        }
+
+        const lastIndex = this._positions.length - 1;
+        if (this._positions[lastIndex] && center - centerOffset > this._positions[lastIndex].end) {
+            return lastIndex;
+        }
+
+        return 0;
+    }
+
+    _initPositionsAndInterpolators(props = this.props) {
+        const {
+            data, itemWidth, itemHeight, scrollInterpolator, vertical
+        } = props;
+        const sizeRef = vertical ? itemHeight : itemWidth;
+
+        if (!data || !data.length) {
+            return;
+        }
+
+        const interpolators = [];
+        this._positions = [];
+
+        this._getCustomData(props).forEach((itemData, index) => {
+            const _index = this._getCustomIndex(index, props);
+            let animatedValue;
+
+            this._positions[index] = {
+                start: index * sizeRef,
+                end: index * sizeRef + sizeRef
+            };
+
+            if (!this._shouldAnimateSlides(props)) {
+                animatedValue = new Animated.Value(1);
+            } else if (this._shouldUseCustomAnimation()) {
+                animatedValue = new Animated.Value(_index === this._activeItem ? 1 : 0);
+            } else {
+                let interpolator;
+
+                if (scrollInterpolator) {
+                    interpolator = scrollInterpolator(_index, props);
+                } else if (this._shouldUseStackLayout()) {
+                    interpolator = stackScrollInterpolator(_index, props);
+                } else if (this._shouldUseTinderLayout()) {
+                    interpolator = tinderScrollInterpolator(_index, props);
+                }
+
+                if (!interpolator || !interpolator?.inputRange || !interpolator?.outputRange) {
+                    interpolator = defaultScrollInterpolator(_index, props);
+                }
+
+                animatedValue = this._scrollPos.interpolate({
+                    ...interpolator,
+                    extrapolate: 'clamp'
+                });
+            }
+
+            interpolators.push(animatedValue);
+        });
+        this.setState({ interpolators });
+    }
+
+    _getSlideAnimation(index, toValue) {
+        const { interpolators } = this.state;
+        const { activeAnimationType, activeAnimationOptions } = this.props;
+
+        const animatedValue = interpolators && interpolators[index];
+
+        if (!animatedValue && animatedValue !== 0) {
+            return null;
+        }
+
+        const animationCommonOptions = {
+            isInteraction: false,
+            useNativeDriver: true,
+            ...activeAnimationOptions,
+            toValue
+        };
+
+        return Animated.parallel([
+            Animated.timing(
+                animatedValue,
+                { ...animationCommonOptions, easing: Easing.linear }
+            ),
+            Animated[activeAnimationType](
+                animatedValue,
+                { ...animationCommonOptions }
+            )
+        ]);
+    }
+
+    _playCustomSlideAnimation(current, next) {
+        const { interpolators } = this.state;
+        const itemsLength = this._getCustomDataLength();
+        const _currentIndex = this._getCustomIndex(current);
+        const _currentDataIndex = this._getDataIndex(_currentIndex);
+        const _nextIndex = this._getCustomIndex(next);
+        const _nextDataIndex = this._getDataIndex(_nextIndex);
+        const animations = [];
+
+        // Keep animations in sync when looping
+        if (this._enableLoop()) {
+            for (let i = 0; i < itemsLength; i += 1) {
+                if (this._getDataIndex(i) === _currentDataIndex && interpolators[i]) {
+                    animations.push(this._getSlideAnimation(i, 0));
+                } else if (this._getDataIndex(i) === _nextDataIndex && interpolators[i]) {
+                    animations.push(this._getSlideAnimation(i, 1));
+                }
+            }
+        } else {
+            if (interpolators[current]) {
+                animations.push(this._getSlideAnimation(current, 0));
+            }
+            if (interpolators[next]) {
+                animations.push(this._getSlideAnimation(next, 1));
+            }
+        }
+
+        Animated.parallel(animations, { stopTogether: false }).start();
+    }
+
+    _hackActiveSlideAnimation(index, goTo, force = false) {
+        const { data } = this.props;
+
+        if (!this._mounted || !this._carouselRef || !this._positions[index] || (!force && this._enableLoop())) {
+            return;
+        }
+
+        const offset = this._positions[index] && this._positions[index].start;
+
+        if (!offset && offset !== 0) {
+            return;
+        }
+
+        const itemsLength = data && data.length;
+        const direction = goTo || itemsLength === 1 ? 'start' : 'end';
+
+        this._scrollTo(offset + (direction === 'start' ? -1 : 1), false);
+
+        clearTimeout(this._hackSlideAnimationTimeout);
+        this._hackSlideAnimationTimeout = setTimeout(() => {
+            this._scrollTo(offset, false);
+        }, 50); // works randomly when set to '0'
+    }
+
+    _lockScroll() {
+        const { lockScrollTimeoutDuration } = this.props;
+        clearTimeout(this._lockScrollTimeout);
+        this._lockScrollTimeout = setTimeout(() => {
+            this._releaseScroll();
+        }, lockScrollTimeoutDuration);
+        this._setScrollEnabled(false);
+    }
+
+    _releaseScroll() {
+        clearTimeout(this._lockScrollTimeout);
+        this._setScrollEnabled(true);
+    }
+
+    _repositionScroll(index) {
+        const { data, loopClonesPerSide } = this.props;
+        const dataLength = data && data.length;
+
+        if (!this._enableLoop() || !dataLength
+            || (index >= loopClonesPerSide && index < dataLength + loopClonesPerSide)) {
+            return;
+        }
+
+        let repositionTo = index;
+
+        if (index >= dataLength + loopClonesPerSide) {
+            repositionTo = index - dataLength;
+        } else if (index < loopClonesPerSide) {
+            repositionTo = index + dataLength;
+        }
+        this._snapToItem(repositionTo, false, false, false, false);
+    }
+
+    _scrollTo(offset, animated = true) {
+        const { vertical } = this.props;
+        const wrappedRef = this._getWrappedRef();
+
+        if (!this._mounted || !wrappedRef) {
+            return;
+        }
+
+        const specificOptions = this._needsScrollView() ? {
+            x: vertical ? 0 : offset,
+            y: vertical ? offset : 0
+        } : {
+            offset
+        };
+        const options = {
+            ...specificOptions,
+            animated
+        };
+
+        setTimeout(() => {
+            if (this._needsScrollView()) {
+                wrappedRef.scrollTo(options);
+            } else {
+                wrappedRef.scrollToOffset(options);
+            }
+        }, (!animated && this._animated) ? 200 : 0);
+
+        this._animated = animated;
+    }
+
+    _onScroll(event) {
+        const { callbackOffsetMargin, enableMomentum, onScroll } = this.props;
+
+        const scrollOffset = event ? this._getScrollOffset(event) : this._currentContentOffset;
+        const nextActiveItem = this._getActiveItem(scrollOffset);
+        const itemReached = nextActiveItem === this._itemToSnapTo;
+        const scrollConditions = scrollOffset >= this._scrollOffsetRef - callbackOffsetMargin
+            && scrollOffset <= this._scrollOffsetRef + callbackOffsetMargin;
+
+        this._currentContentOffset = scrollOffset;
+        this._onScrollTriggered = true;
+        this._lastScrollDate = Date.now();
+
+        if (this._activeItem !== nextActiveItem && this._shouldUseCustomAnimation()) {
+            this._playCustomSlideAnimation(this._activeItem, nextActiveItem);
+        }
+
+        if (enableMomentum) {
+            clearTimeout(this._snapNoMomentumTimeout);
+
+            if (this._activeItem !== nextActiveItem) {
+                this._activeItem = nextActiveItem;
+            }
+
+            if (itemReached) {
+                if (this._canFireBeforeCallback) {
+                    this._onBeforeSnap(this._getDataIndex(nextActiveItem));
+                }
+
+                if (scrollConditions && this._canFireCallback) {
+                    this._onSnap(this._getDataIndex(nextActiveItem));
+                }
+            }
+        } else if (this._activeItem !== nextActiveItem && itemReached) {
+            if (this._canFireBeforeCallback) {
+                this._onBeforeSnap(this._getDataIndex(nextActiveItem));
+            }
+
+            if (scrollConditions) {
+                this._activeItem = nextActiveItem;
+
+                if (this._canLockScroll()) {
+                    this._releaseScroll();
+                }
+
+                if (this._canFireCallback) {
+                    this._onSnap(this._getDataIndex(nextActiveItem));
+                }
+            }
+        }
+        if (nextActiveItem === this._itemToSnapTo
+            && scrollOffset === this._scrollOffsetRef) {
+            this._repositionScroll(nextActiveItem);
+        }
+
+        if (typeof onScroll === 'function' && event) {
+            onScroll(event);
+        }
+    }
+
+    _onStartShouldSetResponderCapture(event) {
+        const { onStartShouldSetResponderCapture } = this.props;
+
+        if (onStartShouldSetResponderCapture) {
+            onStartShouldSetResponderCapture(event);
+        }
+
+        return this._getScrollEnabled();
+    }
+
+    _onTouchStart() {
+        const { onTouchStart } = this.props;
+
+        // `onTouchStart` is fired even when `scrollEnabled` is set to `false`
+        if (this._getScrollEnabled() !== false && this._autoplaying) {
+            this.stopAutoplay();
+        }
+
+        if (onTouchStart) {
+            onTouchStart();
+        }
+    }
+
+    _onTouchEnd() {
+        const { onTouchEnd, autoplay } = this.props;
+
+        if (this._getScrollEnabled() !== false && autoplay && !this._autoplaying) {
+            // This event is buggy on Android, so a fallback is provided in _onScrollEnd()
+            this.startAutoplay();
+        }
+
+        if (onTouchEnd) {
+            onTouchEnd();
+        }
+    }
+
+    // Used when `enableSnap` is ENABLED
+    _onScrollBeginDrag(event) {
+        const { onScrollBeginDrag } = this.props;
+
+        if (!this._getScrollEnabled()) {
+            return;
+        }
+
+        this._scrollStartOffset = this._getScrollOffset(event);
+        this._scrollStartActive = this._getActiveItem(this._scrollStartOffset);
+        this._ignoreNextMomentum = false;
+        // this._canFireCallback = false;
+
+        if (onScrollBeginDrag) {
+            onScrollBeginDrag(event);
+        }
+    }
+
+    // Used when `enableMomentum` is DISABLED
+    _onScrollEndDrag(event) {
+        const { onScrollEndDrag } = this.props;
+
+        if (this._carouselRef) {
+            if (this._onScrollEnd) this._onScrollEnd();
+        }
+
+        if (onScrollEndDrag) {
+            onScrollEndDrag(event);
+        }
+    }
+
+    // Used when `enableMomentum` is ENABLED
+    _onMomentumScrollEnd(event) {
+        const { onMomentumScrollEnd } = this.props;
+
+        if (this._carouselRef) {
+            if (this._onScrollEnd) this._onScrollEnd();
+        }
+
+        if (onMomentumScrollEnd) {
+            onMomentumScrollEnd(event);
+        }
+    }
+
+    _onScrollEnd() {
+        const { autoplay, autoplayDelay, enableSnap } = this.props;
+
+        if (this._ignoreNextMomentum) {
+            // iOS fix
+            this._ignoreNextMomentum = false;
+            return;
+        }
+
+        this._scrollEndOffset = this._currentContentOffset;
+        this._scrollEndActive = this._getActiveItem(this._scrollEndOffset);
+
+        if (enableSnap) {
+            this._snapScroll(this._scrollEndOffset - this._scrollStartOffset);
+        }
+
+        // The touchEnd event is buggy on Android, so this will serve as a fallback whenever needed
+        // https://github.com/facebook/react-native/issues/9439
+        if (autoplay && !this._autoplaying) {
+            clearTimeout(this._enableAutoplayTimeout);
+            this._enableAutoplayTimeout = setTimeout(() => {
+                this.startAutoplay();
+            }, autoplayDelay + 50);
+        }
+    }
+
+    // Due to a bug, this event is only fired on iOS
+    // https://github.com/facebook/react-native/issues/6791
+    // it's fine since we're only fixing an iOS bug in it, so ...
+    _onTouchRelease() {
+        const { enableMomentum } = this.props;
+
+        if (enableMomentum && IS_IOS) {
+            clearTimeout(this._snapNoMomentumTimeout);
+            this._snapNoMomentumTimeout = setTimeout(() => {
+                this._snapToItem(this._activeItem);
+            }, 100);
+        }
+    }
+
+    _onLayout(event) {
+        const { onLayout } = this.props;
+
+        // Prevent unneeded actions during the first 'onLayout' (triggered on init)
+        if (this._onLayoutInitDone) {
+            this._initPositionsAndInterpolators();
+            this._snapToItem(this._activeItem, false, false, false, false);
+        } else {
+            this._onLayoutInitDone = true;
+        }
+
+        if (onLayout) {
+            onLayout(event);
+        }
+    }
+
+    _snapScroll(delta) {
+        const { swipeThreshold } = this.props;
+
+        // When using momentum and releasing the touch with
+        // no velocity, scrollEndActive will be undefined (iOS)
+        if (!this._scrollEndActive && this._scrollEndActive !== 0 && IS_IOS) {
+            this._scrollEndActive = this._scrollStartActive;
+        }
+
+        if (this._scrollStartActive !== this._scrollEndActive) {
+            // Snap to the new active item
+            this._snapToItem(this._scrollEndActive);
+        } else {
+            // Snap depending on delta
+            if (delta > 0) {
+                if (delta > swipeThreshold) {
+                    this._snapToItem(this._scrollStartActive + 1);
+                } else {
+                    this._snapToItem(this._scrollEndActive);
+                }
+            } else if (delta < 0) {
+                if (delta < -swipeThreshold) {
+                    this._snapToItem(this._scrollStartActive - 1);
+                } else {
+                    this._snapToItem(this._scrollEndActive);
+                }
+            } else {
+                // Snap to current
+                this._snapToItem(this._scrollEndActive);
+            }
+        }
+    }
+
+    _snapToItem(index, animated = true, fireCallback = true, initial = false, lockScroll = true) {
+        const { enableMomentum, onSnapToItem, onBeforeSnapToItem } = this.props;
+        const itemsLength = this._getCustomDataLength();
+        const wrappedRef = this._getWrappedRef();
+
+        if (!itemsLength || !wrappedRef) {
+            return;
+        }
+
+        if (!index || index < 0) {
+            index = 0;
+        } else if (itemsLength > 0 && index >= itemsLength) {
+            index = itemsLength - 1;
+        }
+
+        if (index !== this._previousActiveItem) {
+            this._previousActiveItem = index;
+
+            // Placed here to allow overscrolling for edges items
+            if (lockScroll && this._canLockScroll()) {
+                this._lockScroll();
+            }
+
+            if (fireCallback) {
+                if (onBeforeSnapToItem) {
+                    this._canFireBeforeCallback = true;
+                }
+
+                if (onSnapToItem) {
+                    this._canFireCallback = true;
+                }
+            }
+        }
+
+        this._itemToSnapTo = index;
+        this._scrollOffsetRef = this._positions[index] && this._positions[index].start;
+        this._onScrollTriggered = false;
+
+        if (!this._scrollOffsetRef && this._scrollOffsetRef !== 0) {
+            return;
+        }
+
+        this._scrollTo(this._scrollOffsetRef, animated);
+
+        if (enableMomentum) {
+            // iOS fix, check the note in the constructor
+            if (IS_IOS && !initial) {
+                this._ignoreNextMomentum = true;
+            }
+
+            // When momentum is enabled and the user is overscrolling or swiping very quickly,
+            // 'onScroll' is not going to be triggered for edge items. Then callback won't be
+            // fired and loop won't work since the scrollview is not going to be repositioned.
+            // As a workaround, '_onScroll()' will be called manually for these items if a given
+            // condition hasn't been met after a small delay.
+            // WARNING: this is ok only when relying on 'momentumScrollEnd', not with 'scrollEndDrag'
+            if (index === 0 || index === itemsLength - 1) {
+                clearTimeout(this._edgeItemTimeout);
+                this._edgeItemTimeout = setTimeout(() => {
+                    if (!initial && index === this._activeItem && !this._onScrollTriggered) {
+                        this._onScroll();
+                    }
+                }, 250);
+            }
+        }
+    }
+
+    _onBeforeSnap(index) {
+        const { onBeforeSnapToItem } = this.props;
+
+        if (!this._carouselRef) {
+            return;
+        }
+
+        this._canFireBeforeCallback = false;
+        if (onBeforeSnapToItem) onBeforeSnapToItem(index);
+    }
+
+    _onSnap(index) {
+        const { onSnapToItem } = this.props;
+
+        if (!this._carouselRef) {
+            return;
+        }
+
+        this._canFireCallback = false;
+        if (onSnapToItem) onSnapToItem(index);
+    }
+
+    startAutoplay() {
+        const { autoplayInterval, autoplayDelay } = this.props;
+
+        if (this._autoplaying) {
+            return;
+        }
+
+        clearTimeout(this._autoplayTimeout);
+        this._autoplayTimeout = setTimeout(() => {
+            this._autoplaying = true;
+            this._autoplayInterval = setInterval(() => {
+                if (this._autoplaying) {
+                    this.snapToNext();
+                }
+            }, autoplayInterval);
+        }, autoplayDelay);
+    }
+
+    stopAutoplay() {
+        this._autoplaying = false;
+        clearInterval(this._autoplayInterval);
+    }
+
+    snapToItem(index, animated = true, fireCallback = true) {
+        if (!index || index < 0) {
+            index = 0;
+        }
+
+        const positionIndex = this._getPositionIndex(index);
+
+        if (positionIndex === this._activeItem) {
+            return;
+        }
+
+        this._snapToItem(positionIndex, animated, fireCallback);
+    }
+
+    snapToNext(animated = true, fireCallback = true) {
+        const itemsLength = this._getCustomDataLength();
+
+        let newIndex = this._activeItem + 1;
+        if (newIndex > itemsLength - 1) {
+            if (!this._enableLoop()) {
+                return;
+            }
+            newIndex = 0;
+        }
+        this._snapToItem(newIndex, animated, fireCallback);
+    }
+
+    snapToPrev(animated = true, fireCallback = true) {
+        const itemsLength = this._getCustomDataLength();
+
+        let newIndex = this._activeItem - 1;
+        if (newIndex < 0) {
+            if (!this._enableLoop()) {
+                return;
+            }
+            newIndex = itemsLength - 1;
+        }
+        this._snapToItem(newIndex, animated, fireCallback);
+    }
+
+    // https://github.com/facebook/react-native/issues/1831#issuecomment-231069668
+    triggerRenderingHack(offset) {
+        // Avoid messing with user scroll
+        if (Date.now() - this._lastScrollDate < 500) {
+            return;
+        }
+
+        const scrollPosition = this._currentContentOffset;
+        if (!scrollPosition && scrollPosition !== 0) {
+            return;
+        }
+
+        const scrollOffset = offset || (scrollPosition === 0 ? 1 : -1);
+        this._scrollTo(scrollPosition + scrollOffset, false);
+    }
+
+    _getSlideInterpolatedStyle(index, animatedValue) {
+        const { layoutCardOffset, slideInterpolatedStyle } = this.props;
+
+        if (slideInterpolatedStyle) {
+            return slideInterpolatedStyle(index, animatedValue, this.props);
+        } if (this._shouldUseTinderLayout()) {
+            return tinderAnimatedStyles(index, animatedValue, this.props, layoutCardOffset);
+        } if (this._shouldUseStackLayout()) {
+            return stackAnimatedStyles(index, animatedValue, this.props, layoutCardOffset);
+        } if (this._shouldUseShiftLayout()) {
+            return shiftAnimatedStyles(index, animatedValue, this.props);
+        }
+        return defaultAnimatedStyles(index, animatedValue, this.props);
+    }
+
+    _renderItem({ item, index }) {
+        const { interpolators } = this.state;
+        const {
+            hasParallaxImages,
+            itemWidth,
+            itemHeight,
+            keyExtractor,
+            renderItem,
+            sliderHeight,
+            sliderWidth,
+            slideStyle,
+            vertical,
+            isCustomScrollWidth
+        } = this.props;
+
+        const animatedValue = interpolators && interpolators[index];
+
+        if (!animatedValue && animatedValue !== 0) {
+            return null;
+        }
+
+        const animate = this._shouldAnimateSlides();
+        const ComponentView = animate ? Animated.View : View;
+        const animatedStyle = animate ? this._getSlideInterpolatedStyle(index, animatedValue) : {};
+
+        const parallaxProps = hasParallaxImages ? {
+            scrollPosition: this._scrollPos,
+            carouselRef: this._carouselRef,
+            vertical,
+            sliderWidth,
+            sliderHeight,
+            itemWidth,
+            itemHeight
+        } : undefined;
+
+        const specificProps = this._needsScrollView() ? {
+            key: keyExtractor ? keyExtractor(item, index) : this._getKeyExtractor(item, index)
+        } : {};
+        const mainDimension = isCustomScrollWidth ? {} : { width: itemWidth };
+        return (
+            <ComponentView
+                style={[mainDimension, slideStyle, animatedStyle]}
+                pointerEvents="box-none"
+                {...specificProps}
+            >
+                {renderItem({
+                    item, index, realIndex: this._getDataIndex(index), activeIndex: this._getDataIndex(this._activeItem)
+                }, parallaxProps)}
+            </ComponentView>
+        );
+    }
+
+    _getComponentOverridableProps() {
+        const {
+            enableMomentum,
+            itemWidth,
+            itemHeight,
+            loopClonesPerSide,
+            sliderWidth,
+            sliderHeight,
+            vertical
+        } = this.props;
+
+        const visibleItems = Math.ceil(vertical
+            ? sliderHeight / itemHeight
+            : sliderWidth / itemWidth) + 1;
+        const initialNumPerSide = this._enableLoop() ? loopClonesPerSide : 2;
+        const initialNumToRender = visibleItems + (initialNumPerSide * 2);
+        const maxToRenderPerBatch = 1 + (initialNumToRender * 2);
+        const windowSize = maxToRenderPerBatch;
+
+        const specificProps = !this._needsScrollView() ? {
+            initialNumToRender,
+            maxToRenderPerBatch,
+            windowSize
+            // updateCellsBatchingPeriod
+        } : {};
+
+        return {
+            decelerationRate: enableMomentum ? 0.9 : 'fast',
+            showsHorizontalScrollIndicator: false,
+            showsVerticalScrollIndicator: false,
+            overScrollMode: 'never',
+            automaticallyAdjustContentInsets: false,
+            directionalLockEnabled: true,
+            pinchGestureEnabled: false,
+            scrollsToTop: false,
+            removeClippedSubviews: !this._needsScrollView(),
+            inverted: this._needsRTLAdaptations(),
+            // renderToHardwareTextureAndroid: true,
+            ...specificProps
+        };
+    }
+
+    _getComponentStaticProps() {
+        const { hideCarousel } = this.state;
+        const {
+            containerCustomStyle,
+            contentContainerCustomStyle,
+            keyExtractor,
+            sliderWidth,
+            sliderHeight,
+            style,
+            vertical
+        } = this.props;
+
+        const containerStyle = [
+            containerCustomStyle || style || {},
+            hideCarousel ? { opacity: 0 } : {},
+            vertical
+                ? { height: sliderHeight, flexDirection: 'column' }
+                // LTR hack; see https://github.com/facebook/react-native/issues/11960
+                // and https://github.com/facebook/react-native/issues/13100#issuecomment-328986423
+                : { width: sliderWidth, flexDirection: this._needsRTLAdaptations() ? 'row-reverse' : 'row' }
+        ];
+        const contentContainerStyle = [
+            vertical ? {
+                paddingTop: this._getContainerInnerMargin(),
+                paddingBottom: this._getContainerInnerMargin(true)
+            } : {
+                paddingLeft: this._getContainerInnerMargin(),
+                paddingRight: this._getContainerInnerMargin(true)
+            },
+            contentContainerCustomStyle || {}
+        ];
+
+        const specificProps = !this._needsScrollView() ? {
+            // extraData: this.state,
+            renderItem: this._renderItem,
+            numColumns: 1,
+            getItemLayout: undefined, // see #193
+            initialScrollIndex: undefined, // see #193
+            keyExtractor: keyExtractor || this._getKeyExtractor
+        } : {};
+        return {
+            ref: (c) => this._carouselRef = c,
+            data: this._getCustomData(),
+            style: containerStyle,
+            contentContainerStyle,
+            horizontal: !vertical,
+            scrollEventThrottle: 1,
+            onScroll: this._onScrollHandler,
+            onScrollBeginDrag: this._onScrollBeginDrag,
+            onScrollEndDrag: this._onScrollEndDrag,
+            onMomentumScrollEnd: this._onMomentumScrollEnd,
+            onResponderRelease: this._onTouchRelease,
+            onStartShouldSetResponderCapture: this._onStartShouldSetResponderCapture,
+            onTouchStart: this._onTouchStart,
+            onTouchEnd: this._onScrollEnd,
+            onLayout: this._onLayout,
+            ...specificProps
+        };
+    }
+
+    render() {
+        const { data, renderItem, useScrollView } = this.props;
+
+        if (!data || !renderItem) {
+            return null;
+        }
+
+        const props = {
+            ...this._getComponentOverridableProps(),
+            ...this.props,
+            ...this._getComponentStaticProps()
+        };
+
+        const ScrollViewComponent = typeof useScrollView === 'function' ? useScrollView : AnimatedScrollView;
+
+        return this._needsScrollView() ? (
+            <ScrollViewComponent {...props}>
+                {
+                    this._getCustomData().map((item, index) => this._renderItem({
+                        item, index, realIndex: this._getDataIndex(index), activeIndex: this._getDataIndex(this._activeItem)
+                    }))
+                }
+            </ScrollViewComponent>
+        ) : (
+            <AnimatedFlatList {...props} />
+        );
+    }
+}
+
+Carousel.propTypes = {
+    data: PropTypes.array.isRequired,
+    renderItem: PropTypes.func.isRequired,
+    itemWidth: PropTypes.number, // required for horizontal carousel
+    itemHeight: PropTypes.number, // required for vertical carousel
+    sliderWidth: PropTypes.number, // required for horizontal carousel
+    sliderHeight: PropTypes.number, // required for vertical carousel
+    activeAnimationType: PropTypes.string,
+    activeAnimationOptions: PropTypes.object,
+    activeSlideAlignment: PropTypes.oneOf(['center', 'end', 'start']),
+    activeSlideOffset: PropTypes.number,
+    apparitionDelay: PropTypes.number,
+    autoplay: PropTypes.bool,
+    autoplayDelay: PropTypes.number,
+    autoplayInterval: PropTypes.number,
+    callbackOffsetMargin: PropTypes.number,
+    containerCustomStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
+    contentContainerCustomStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
+    enableMomentum: PropTypes.bool,
+    enableSnap: PropTypes.bool,
+    firstItem: PropTypes.number,
+    hasParallaxImages: PropTypes.bool,
+    inactiveSlideOpacity: PropTypes.number,
+    inactiveSlideScale: PropTypes.number,
+    inactiveSlideShift: PropTypes.number,
+    layout: PropTypes.oneOf(['default', 'stack', 'tinder']),
+    layoutCardOffset: PropTypes.number,
+    lockScrollTimeoutDuration: PropTypes.number,
+    lockScrollWhileSnapping: PropTypes.bool,
+    loop: PropTypes.bool,
+    loopClonesPerSide: PropTypes.number,
+    scrollEnabled: PropTypes.bool,
+    scrollInterpolator: PropTypes.func,
+    slideInterpolatedStyle: PropTypes.func,
+    slideStyle: PropTypes.object,
+    shouldOptimizeUpdates: PropTypes.bool,
+    swipeThreshold: PropTypes.number,
+    useScrollView: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),
+    vertical: PropTypes.bool,
+    showsPagination: PropTypes.bool,
+    isCustomScrollWidth: PropTypes.bool,
+    onBeforeSnapToItem: PropTypes.func,
+    onSnapToItem: PropTypes.func,
+};
+
+Carousel.defaultProps = {
+    activeAnimationType: 'timing',
+    activeAnimationOptions: null,
+    activeSlideAlignment: 'center',
+    activeSlideOffset: 20,
+    apparitionDelay: 0,
+    autoplay: false,
+    autoplayDelay: 1000,
+    autoplayInterval: 3000,
+    callbackOffsetMargin: 5,
+    containerCustomStyle: {},
+    contentContainerCustomStyle: {},
+    enableMomentum: false,
+    enableSnap: true,
+    firstItem: 0,
+    hasParallaxImages: false,
+    inactiveSlideOpacity: 0.7,
+    inactiveSlideScale: 0.9,
+    inactiveSlideShift: 0,
+    layout: 'default',
+    lockScrollTimeoutDuration: 1000,
+    lockScrollWhileSnapping: false,
+    loop: false,
+    loopClonesPerSide: 3,
+    scrollEnabled: true,
+    slideStyle: {},
+    shouldOptimizeUpdates: true,
+    swipeThreshold: 20,
+    useScrollView: !AnimatedFlatList,
+    vertical: false,
+    showsPagination: true,
+    isCustomScrollWidth: false,
+};