react-native-page-flipper/lib/module/BookPage/BackShadow.js

Page Flipper

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React from 'react';
import { StyleSheet } from 'react-native';
import Animated, { interpolate, useAnimatedStyle } from 'react-native-reanimated';
import { Gradient } from '../Components/Gradient';
const colors = ['rgba(0,0,0,0.0)', 'rgba(0,0,0,0.2)', 'rgba(0,0,0,0.7)'];
const rightPosition = {
  start: {
    x: 0.5,
    y: 0
  },
  end: {
    x: 1,
    y: 0
  }
};
const leftPosition = {
  start: {
    x: 0.5,
    y: 0
  },
  end: {
    x: 0,
    y: 0
  }
};

const BackShadow = _ref => {
  let {
    degrees,
    right
  } = _ref;
  const position = right ? rightPosition : leftPosition;
  const animatedStyle = useAnimatedStyle(() => {
    const opacity = interpolate(Math.abs(degrees.value), [0, 130, 180], [1, 0.5, 0]);
    return {
      opacity
    };
  });
  return /*#__PURE__*/React.createElement(Animated.View, {
    style: [{ ...StyleSheet.absoluteFillObject,
      zIndex: 4
    }, animatedStyle]
  }, /*#__PURE__*/React.createElement(Gradient, _extends({}, position, {
    colors: colors,
    style: { ...StyleSheet.absoluteFillObject
    }
  })));
};

export default BackShadow;
//# sourceMappingURL=BackShadow.js.map