@razorpay/blade
Version:
The Design System that powers Razorpay
16 lines (13 loc) • 1.22 kB
JavaScript
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