react-native-page-flipper/lib/commonjs/BookPage/index.js

Page Flipper

var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.BookPage=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNativeGestureHandler=require("react-native-gesture-handler");var _reactNativeReanimated=_interopRequireWildcard(require("react-native-reanimated"));var _BackShadow=_interopRequireDefault(require("./BackShadow"));var _FrontShadow=_interopRequireDefault(require("./FrontShadow"));var _PageShadow=_interopRequireDefault(require("./PageShadow"));var _BookSpine=require("./BookSpine");var _BookSpine2=require("./BookSpine2");var _utils=require("../utils/utils");var _this=this,_jsxFileName="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx";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;}var timingConfig={duration:800,easing:_reactNativeReanimated.Easing.inOut(_reactNativeReanimated.Easing.cubic)};var BookPage=_react.default.forwardRef(function(_ref,ref){var right=_ref.right,front=_ref.front,back=_ref.back,onPageFlip=_ref.onPageFlip,containerSize=_ref.containerSize,isAnimatingRef=_ref.isAnimatingRef,setIsAnimating=_ref.setIsAnimating,isAnimating=_ref.isAnimating,enabled=_ref.enabled,isPressable=_ref.isPressable,getPageStyle=_ref.getPageStyle,single=_ref.single,onFlipStart=_ref.onFlipStart,onPageDrag=_ref.onPageDrag,onPageDragEnd=_ref.onPageDragEnd,onPageDragStart=_ref.onPageDragStart,renderPage=_ref.renderPage;var x=(0,_reactNativeReanimated.useSharedValue)(0);var isMounted=(0,_react.useRef)(false);var rotateYAsDeg=(0,_reactNativeReanimated.useSharedValue)(0);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),isDragging=_useState2[0],setIsDragging=_useState2[1];var isDraggingRef=(0,_react.useRef)(false);var containerWidth=containerSize.width;var containerHeight=containerSize.height;var leftPSnapPoints=[0,containerWidth];var rightPSnapPoints=[-containerWidth,0];var pSnapPoints=right?rightPSnapPoints:leftPSnapPoints;var gesturesEnabled=enabled&&!isAnimating;var showSpine=true;(0,_react.useEffect)(function(){isMounted.current=true;return function(){isMounted.current=false;};},[]);var turnPage=(0,_react.useCallback)(function(){setIsDragging(true);setIsAnimating(true);var id=right?1:-1;if(onFlipStart&&typeof onFlipStart==='function'){onFlipStart(id);}rotateYAsDeg.value=(0,_reactNativeReanimated.withTiming)(right?180:-180,timingConfig,function(){var _f=function _f(){(0,_reactNativeReanimated.runOnJS)(onPageFlip)(id,false);};_f._closure={runOnJS:_reactNativeReanimated.runOnJS,onPageFlip:onPageFlip,id:id};_f.asString="function _f(){const{runOnJS,onPageFlip,id}=jsThis._closure;{runOnJS(onPageFlip)(id,false);}}";_f.__workletHash=7773568368045;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (115:16)";return _f;}());},[onFlipStart,setIsDragging,right,onPageFlip,rotateYAsDeg,setIsAnimating]);_react.default.useImperativeHandle(ref,function(){return{turnPage:turnPage};},[turnPage]);var onDrag=(0,_react.useCallback)(function(val){if(!isMounted.current){return;}if(isDraggingRef.current===val){return;}setIsDragging(val);isDraggingRef.current=val;},[]);var backStyle=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){var degrees=rotateYAsDeg.value;var x=right?(0,_reactNativeReanimated.interpolate)(degrees,[0,180],[containerWidth/2,-containerWidth/2]):(0,_reactNativeReanimated.interpolate)(degrees,[-180,0],[containerWidth/2,0]);var w=right?(0,_reactNativeReanimated.interpolate)(degrees,[0,180],[0,containerWidth/2]):(0,_reactNativeReanimated.interpolate)(degrees,[-180,0],[containerWidth/2,0]);return{width:Math.ceil(w),zIndex:2,transform:[{translateX:x}]};};_f._closure={rotateYAsDeg:rotateYAsDeg,right:right,interpolate:_reactNativeReanimated.interpolate,containerWidth:containerWidth};_f.asString="function _f(){const{rotateYAsDeg,right,interpolate,containerWidth}=jsThis._closure;{const degrees=rotateYAsDeg.value;const x=right?interpolate(degrees,[0,180],[containerWidth/2,-containerWidth/2]):interpolate(degrees,[-180,0],[containerWidth/2,0]);const w=right?interpolate(degrees,[0,180],[0,containerWidth/2]):interpolate(degrees,[-180,0],[containerWidth/2,0]);return{width:Math.ceil(w),zIndex:2,transform:[{translateX:x}]};}}";_f.__workletHash=16019654822372;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (150:43)";_f.__optimalization=2;return _f;}());var frontStyle=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){var degrees=rotateYAsDeg.value;var w=right?(0,_reactNativeReanimated.interpolate)(degrees,[0,90],[containerWidth/2,0],_reactNativeReanimated.Extrapolate.CLAMP):(0,_reactNativeReanimated.interpolate)(degrees,[-90,0],[0,containerWidth/2],_reactNativeReanimated.Extrapolate.CLAMP);var style={zIndex:1,width:Math.floor(w)};if(right){style['left']=0;}else{style['right']=0;}return style;};_f._closure={rotateYAsDeg:rotateYAsDeg,right:right,interpolate:_reactNativeReanimated.interpolate,containerWidth:containerWidth,Extrapolate:{CLAMP:_reactNativeReanimated.Extrapolate.CLAMP}};_f.asString="function _f(){const{rotateYAsDeg,right,interpolate,containerWidth,Extrapolate}=jsThis._closure;{const degrees=rotateYAsDeg.value;const w=right?interpolate(degrees,[0,90],[containerWidth/2,0],Extrapolate.CLAMP):interpolate(degrees,[-90,0],[0,containerWidth/2],Extrapolate.CLAMP);const style={zIndex:1,width:Math.floor(w)};if(right){style['left']=0;}else{style['right']=0;}return style;}}";_f.__workletHash=17451094349236;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (170:44)";return _f;}());var containerStyle=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){return{flex:1,zIndex:isDragging?100:0};};_f._closure={isDragging:isDragging};_f.asString="function _f(){const{isDragging}=jsThis._closure;{return{flex:1,zIndex:isDragging?100:0};}}";_f.__workletHash=4331077092538;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (201:48)";_f.__optimalization=3;return _f;}());var animatedBackPageStyle=(0,_reactNativeReanimated.useAnimatedStyle)(function(){var _f=function _f(){var l=right?0:(0,_reactNativeReanimated.interpolate)(rotateYAsDeg.value,[-180,0],single?[0,-containerWidth/2]:[-containerWidth/2,-containerWidth]);return{left:l};};_f._closure={right:right,interpolate:_reactNativeReanimated.interpolate,rotateYAsDeg:rotateYAsDeg,single:single,containerWidth:containerWidth};_f.asString="function _f(){const{right,interpolate,rotateYAsDeg,single,containerWidth}=jsThis._closure;{const l=right?0:interpolate(rotateYAsDeg.value,[-180,0],single?[0,-containerWidth/2]:[-containerWidth/2,-containerWidth]);return{left:l};}}";_f.__workletHash=12953072159477;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (209:55)";_f.__optimalization=3;return _f;}());var onPanGestureHandler=(0,_reactNativeReanimated.useAnimatedGestureHandler)({onStart:function(){var _f=function _f(event,ctx){if(onPageDragStart&&typeof onPageDragStart==='function'){(0,_reactNativeReanimated.runOnJS)(onPageDragStart)();}ctx.x=x.value;};_f._closure={onPageDragStart:onPageDragStart,runOnJS:_reactNativeReanimated.runOnJS,x:x};_f.asString="function _f(event,ctx){const{onPageDragStart,runOnJS,x}=jsThis._closure;{if(onPageDragStart&&typeof onPageDragStart==='function'){runOnJS(onPageDragStart)();}ctx.x=x.value;}}";_f.__workletHash=3785249278479;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (230:21)";return _f;}(),onActive:function(){var _f=function _f(event,ctx){(0,_reactNativeReanimated.runOnJS)(onDrag)(true);x.value=ctx.x+event.translationX;rotateYAsDeg.value=(0,_reactNativeReanimated.interpolate)(x.value,[-containerWidth,0,containerWidth],[180,0,-180],_reactNativeReanimated.Extrapolate.CLAMP);if(onPageDrag&&typeof onPageDrag==='function'){(0,_reactNativeReanimated.runOnJS)(onPageDrag)();}};_f._closure={runOnJS:_reactNativeReanimated.runOnJS,onDrag:onDrag,x:x,rotateYAsDeg:rotateYAsDeg,interpolate:_reactNativeReanimated.interpolate,containerWidth:containerWidth,Extrapolate:{CLAMP:_reactNativeReanimated.Extrapolate.CLAMP},onPageDrag:onPageDrag};_f.asString="function _f(event,ctx){const{runOnJS,onDrag,x,rotateYAsDeg,interpolate,containerWidth,Extrapolate,onPageDrag}=jsThis._closure;{runOnJS(onDrag)(true);x.value=ctx.x+event.translationX;rotateYAsDeg.value=interpolate(x.value,[-containerWidth,0,containerWidth],[180,0,-180],Extrapolate.CLAMP);if(onPageDrag&&typeof onPageDrag==='function'){runOnJS(onPageDrag)();}}}";_f.__workletHash=13109310946762;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (236:22)";return _f;}(),onEnd:function(){var _f=function _f(event){if(onPageDragEnd&&typeof onPageDragEnd==='function'){(0,_reactNativeReanimated.runOnJS)(onPageDragEnd)();}var snapTo=(0,_utils.snapPoint)(x.value,event.velocityX,pSnapPoints);var id=snapTo>0?-1:snapTo<0?1:0;var degrees=snapTo>0?-180:snapTo<0?180:0;x.value=snapTo;if(rotateYAsDeg.value===degrees){(0,_reactNativeReanimated.runOnJS)(onPageFlip)(id,false);}else{(0,_reactNativeReanimated.runOnJS)(setIsAnimating)(true);var progress=Math.abs(rotateYAsDeg.value-degrees)/100;var duration=(0,_utils.clamp)(800*progress-Math.abs(0.1*event.velocityX),350,1000);rotateYAsDeg.value=(0,_reactNativeReanimated.withTiming)(degrees,(0,_extends2.default)({},timingConfig,{duration:duration}),function(){var _f=function _f(){if(snapTo===0){(0,_reactNativeReanimated.runOnJS)(onDrag)(false);}(0,_reactNativeReanimated.runOnJS)(onPageFlip)(id,false);};_f._closure={snapTo:snapTo,runOnJS:_reactNativeReanimated.runOnJS,onDrag:onDrag,onPageFlip:onPageFlip,id:id};_f.asString="function _f(){const{snapTo,runOnJS,onDrag,onPageFlip,id}=jsThis._closure;{if(snapTo===0){runOnJS(onDrag)(false);}runOnJS(onPageFlip)(id,false);}}";_f.__workletHash=5605958930527;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (279:24)";return _f;}());}};_f._closure={onPageDragEnd:onPageDragEnd,runOnJS:_reactNativeReanimated.runOnJS,snapPoint:_utils.snapPoint,x:x,pSnapPoints:pSnapPoints,rotateYAsDeg:rotateYAsDeg,onPageFlip:onPageFlip,setIsAnimating:setIsAnimating,clamp:_utils.clamp,withTiming:_reactNativeReanimated.withTiming,timingConfig:timingConfig,onDrag:onDrag};_f.asString="function _f(event){const{onPageDragEnd,runOnJS,snapPoint,x,pSnapPoints,rotateYAsDeg,onPageFlip,setIsAnimating,clamp,withTiming,timingConfig,onDrag}=jsThis._closure;{if(onPageDragEnd&&typeof onPageDragEnd==='function'){runOnJS(onPageDragEnd)();}const snapTo=snapPoint(x.value,event.velocityX,pSnapPoints);const id=snapTo>0?-1:snapTo<0?1:0;const degrees=snapTo>0?-180:snapTo<0?180:0;x.value=snapTo;if(rotateYAsDeg.value===degrees){runOnJS(onPageFlip)(id,false);}else{runOnJS(setIsAnimating)(true);const progress=Math.abs(rotateYAsDeg.value-degrees)/100;const duration=clamp(800*progress-Math.abs(0.1*event.velocityX),350,1000);rotateYAsDeg.value=withTiming(degrees,{...timingConfig,duration:duration},function(){if(snapTo===0){runOnJS(onDrag)(false);}runOnJS(onPageFlip)(id,false);});}}}";_f.__workletHash=7544655005351;_f.__location="/Users/chris/Desktop/dev/react-native-page-flipper/src/BookPage/index.tsx (250:19)";return _f;}()});if(!front||!back){return null;}var frontPageStyle=getPageStyle(right,true);var backPageStyle=getPageStyle(right,false);var frontUrl=right?front.right:front.left;var backUrl=right?back.left:back.right;return _react.default.createElement(_reactNativeGestureHandler.PanGestureHandler,{onGestureEvent:onPanGestureHandler,enabled:gesturesEnabled,__self:_this,__source:{fileName:_jsxFileName,lineNumber:300,columnNumber:13}},_react.default.createElement(_reactNativeReanimated.default.View,{style:containerStyle,__self:_this,__source:{fileName:_jsxFileName,lineNumber:304,columnNumber:17}},isPressable&&_react.default.createElement(_reactNative.Pressable,{disabled:isAnimating,onPress:function onPress(){if(!isAnimatingRef.current)turnPage();},style:[{position:'absolute',height:'100%',width:'25%',zIndex:10000},right?{right:0}:{left:0}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:306,columnNumber:25}}),_react.default.createElement(_reactNativeReanimated.default.View,{style:[styles.pageContainer,backStyle,{overflow:'visible'}],__self:_this,__source:{fileName:_jsxFileName,lineNumber:324,columnNumber:21}},_react.default.createElement(_reactNative.View,{style:styles.pageContainer,__self:_this,__source:{fileName:_jsxFileName,lineNumber:331,columnNumber:25}},backUrl?renderPage&&_react.default.createElement(_reactNativeReanimated.default.View,{style:[backPageStyle,animatedBackPageStyle],__self:_this,__source:{fileName:_jsxFileName,lineNumber:334,columnNumber:37}},renderPage(backUrl)):_react.default.createElement(BlankPage,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:344,columnNumber:33}})),_react.default.createElement(_BackShadow.default,{degrees:rotateYAsDeg,right:right,__self:_this,__source:{fileName:_jsxFileName,lineNumber:348,columnNumber:25}}),_react.default.createElement(_FrontShadow.default,{right:right,degrees:rotateYAsDeg,width:containerWidth,viewHeight:containerHeight,__self:_this,__source:{fileName:_jsxFileName,lineNumber:349,columnNumber:25}}),_react.default.createElement(_PageShadow.default,{right:right,degrees:rotateYAsDeg,width:containerWidth,viewHeight:containerHeight,containerSize:containerSize,__self:_this,__source:{fileName:_jsxFileName,lineNumber:358,columnNumber:25}}),showSpine&&_react.default.createElement(_BookSpine2.BookSpine2,{right:right,degrees:rotateYAsDeg,containerSize:containerSize,__self:_this,__source:{fileName:_jsxFileName,lineNumber:369,columnNumber:29}})),_react.default.createElement(_reactNativeReanimated.default.View,{style:[styles.pageContainer,frontStyle],__self:_this,__source:{fileName:_jsxFileName,lineNumber:377,columnNumber:21}},frontUrl?renderPage&&_react.default.createElement(_reactNativeReanimated.default.View,{style:[frontPageStyle],__self:_this,__source:{fileName:_jsxFileName,lineNumber:380,columnNumber:33}},renderPage(frontUrl)):_react.default.createElement(BlankPage,{__self:_this,__source:{fileName:_jsxFileName,lineNumber:385,columnNumber:29}}),showSpine&&_react.default.createElement(_BookSpine.BookSpine,{right:right,containerSize:containerSize,__self:_this,__source:{fileName:_jsxFileName,lineNumber:388,columnNumber:29}}))));});exports.BookPage=BookPage;var BlankPage=function BlankPage(){return _react.default.createElement(_reactNative.View,{style:(0,_extends2.default)({},_reactNative.StyleSheet.absoluteFillObject,{backgroundColor:'#fff'}),__self:_this,__source:{fileName:_jsxFileName,lineNumber:403,columnNumber:5}});};var styles=_reactNative.StyleSheet.create({container:{flex:1},pageContainer:{height:'100%',width:'100%',position:'absolute',backfaceVisibility:'hidden',overflow:'hidden'}});
//# sourceMappingURL=index.js.map