UNPKG

@razorpay/blade

Version:

The Design System that powers Razorpay

16 lines (13 loc) 1.22 kB
import 'react'; import Animated, { Keyframe } from 'react-native-reanimated'; import styled from 'styled-components/native'; import '@gorhom/portal'; import 'react-native-gesture-handler'; import useTheme from '../../BladeProvider/useTheme.js'; import 'react-native'; import '@babel/runtime/helpers/slicedToArray'; import '../../BottomSheet/BottomSheetStack.js'; import { jsx } from 'react/jsx-runtime'; var StyledFade=styled(Animated.View)(function(_ref){var styles=_ref.styles;return Object.assign({},styles);});var Fade=function Fade(_ref2){var children=_ref2.children,show=_ref2.show,styles=_ref2.styles;var _useTheme=useTheme(),theme=_useTheme.theme;var enterEasing=theme.motion.easing.entrance;var exitEasing=theme.motion.easing.exit;var scaleIn=new Keyframe({from:{transform:[{scale:0.3}],opacity:0,easing:enterEasing},to:{transform:[{scale:1}],opacity:1,easing:enterEasing}}).duration(theme.motion.duration.quick);var fadeOut=new Keyframe({from:{opacity:1,easing:exitEasing},to:{opacity:0,easing:exitEasing}}).duration(theme.motion.duration.quick);return show?jsx(StyledFade,{styles:styles,entering:scaleIn,exiting:fadeOut,children:children}):null;}; export { Fade }; //# sourceMappingURL=Fade.native.js.map