@razorpay/blade
Version:
The Design System that powers Razorpay
24 lines (21 loc) • 5.29 kB
JavaScript
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
import { Pressable, Linking } from 'react-native';
import Animated, { useSharedValue, useAnimatedStyle, withTiming } from 'react-native-reanimated';
import styled from 'styled-components/native';
import React__default from 'react';
import getBaseButtonStyles from './getStyledBaseButtonStyles.js';
import getIn from '../../../utils/lodashButBetter/get.js';
import { useStyledProps } from '../../Box/styledProps/useStyledProps.js';
import '@gorhom/portal';
import 'react-native-gesture-handler';
import useTheme from '../../BladeProvider/useTheme.js';
import '@babel/runtime/helpers/slicedToArray';
import { logger } from '../../../utils/logger/logger.js';
import { castNativeType } from '../../../utils/platform/castUtils.js';
import '../../BottomSheet/BottomSheetStack.js';
import { jsx } from 'react/jsx-runtime';
import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
var _excluded=["onClick","href","onBlur","onKeyDown","children","variant","minHeight","buttonPaddingTop","buttonPaddingBottom","buttonPaddingLeft","buttonPaddingRight","isFullWidth","disabled","defaultBackgroundColor","defaultBorderColor","hoverBackgroundColor","focusBackgroundColor","focusRingColor","hoverBorderColor","focusBorderColor","borderWidth","borderRadius","motionDuration","motionEasing","isLoading","accessibilityProps","testID","onTouchStart","onTouchEnd","onPointerEnter","onPointerDown","onFocus"];var StyledPressable=styled(Animated.createAnimatedComponent(Pressable))(function(props){var styledPropsCSSObject=useStyledProps(props);return Object.assign({},getBaseButtonStyles(props),{alignSelf:'center',display:'flex',flexDirection:'row'},styledPropsCSSObject);});var openURL=function(){var _ref=_asyncToGenerator(function*(href){try{var canOpen=yield Linking.canOpenURL(href);if(canOpen){yield Linking.openURL(href);}}catch(_unused){if(__DEV__){logger({type:'warn',message:`Could not open the link "href=${href}"`,moduleName:'BaseButton'});}}});return function openURL(_x){return _ref.apply(this,arguments);};}();var _StyledBaseButton=function _StyledBaseButton(_ref2,ref){var onClick=_ref2.onClick,href=_ref2.href;_ref2.onBlur;_ref2.onKeyDown;var _children=_ref2.children,variant=_ref2.variant,minHeight=_ref2.minHeight,buttonPaddingTop=_ref2.buttonPaddingTop,buttonPaddingBottom=_ref2.buttonPaddingBottom,buttonPaddingLeft=_ref2.buttonPaddingLeft,buttonPaddingRight=_ref2.buttonPaddingRight,isFullWidth=_ref2.isFullWidth,disabled=_ref2.disabled,defaultBackgroundColor=_ref2.defaultBackgroundColor,defaultBorderColor=_ref2.defaultBorderColor,hoverBackgroundColor=_ref2.hoverBackgroundColor,focusBackgroundColor=_ref2.focusBackgroundColor,focusRingColor=_ref2.focusRingColor,hoverBorderColor=_ref2.hoverBorderColor,focusBorderColor=_ref2.focusBorderColor,borderWidth=_ref2.borderWidth,borderRadius=_ref2.borderRadius,motionDuration=_ref2.motionDuration,motionEasing=_ref2.motionEasing,isLoading=_ref2.isLoading,accessibilityProps=_ref2.accessibilityProps,testID=_ref2.testID,onTouchStart=_ref2.onTouchStart,onTouchEnd=_ref2.onTouchEnd,onPointerEnter=_ref2.onPointerEnter,onPointerDown=_ref2.onPointerDown,onFocus=_ref2.onFocus,styledProps=_objectWithoutProperties(_ref2,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var isPressed=useSharedValue(false);var duration=getIn(theme.motion,motionDuration);var easing=getIn(theme.motion,motionEasing);var animatedStyles=useAnimatedStyle(function(){return Object.assign({backgroundColor:withTiming(isPressed.value?focusBackgroundColor:defaultBackgroundColor,{duration:duration,easing:easing})},variant!=='tertiary'&&{borderColor:withTiming(isPressed.value?focusBorderColor:defaultBorderColor,{duration:duration,easing:easing})});});var handleOnPress=function handleOnPress(event){if(href){void openURL(href);}if(onClick){onClick(event);}};return jsx(StyledPressable,Object.assign({},styledProps,accessibilityProps,{ref:ref,role:"button",onTouchStart:castNativeType(onTouchStart),onTouchEnd:castNativeType(onTouchEnd),onPointerEnter:castNativeType(onPointerEnter),onPointerDown:castNativeType(onPointerDown),onFocus:castNativeType(onFocus),isLoading:isLoading,onPress:handleOnPress,style:animatedStyles,minHeight:minHeight,buttonPaddingTop:buttonPaddingTop,buttonPaddingBottom:buttonPaddingBottom,buttonPaddingLeft:buttonPaddingLeft,buttonPaddingRight:buttonPaddingRight,isFullWidth:isFullWidth,disabled:disabled,defaultBackgroundColor:defaultBackgroundColor,defaultBorderColor:defaultBorderColor,hoverBackgroundColor:hoverBackgroundColor,focusBackgroundColor:focusBackgroundColor,focusRingColor:focusRingColor,hoverBorderColor:hoverBorderColor,focusBorderColor:focusBorderColor,borderWidth:borderWidth,borderRadius:borderRadius,motionDuration:motionDuration,motionEasing:motionEasing,testID:testID,children:function children(_ref3){var pressed=_ref3.pressed;isPressed.value=pressed;return _children;}}));};var StyledBaseButton=assignWithoutSideEffects(React__default.forwardRef(_StyledBaseButton),{displayName:'StyledBaseButton'});
export { StyledBaseButton as default };
//# sourceMappingURL=StyledBaseButton.native.js.map