@razorpay/blade/build/lib/native/components/Switch/AnimatedThumbIcon.native.js

The Design System that powers Razorpay

import React__default from 'react';
import Animated, { useSharedValue, withTiming, useAnimatedStyle, interpolate } from 'react-native-reanimated';
import { switchMotion } from './switchTokens.js';
import getIn from '../../utils/lodashButBetter/get.js';
import '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';
import 'react-native-svg';
import '@babel/runtime/helpers/defineProperty';
import Svg from '../Icons/_Svg/Svg/Svg.native.js';

var AnimatedThumbIcon=function AnimatedThumbIcon(_ref){var children=_ref.children,isChecked=_ref.isChecked,width=_ref.width,height=_ref.height,viewBox=_ref.viewBox,fill=_ref.fill;var _useTheme=useTheme(),theme=_useTheme.theme;var opacity=useSharedValue(isChecked?1:0);var easing=getIn(theme,switchMotion.easing.thumbIcon);var duration=getIn(theme,switchMotion.duration.thumbIcon);React__default.useEffect(function(){opacity.value=withTiming(isChecked?1:0,{duration:duration,easing:easing});},[isChecked]);var opacityStyle=useAnimatedStyle(function(){return {opacity:interpolate(opacity.value,[0,0.2,1],[0,0,1])};},[]);return jsx(Animated.View,{style:opacityStyle,children:jsx(Svg,{width:width,height:height,viewBox:viewBox,fill:fill,children:children})});};

export { AnimatedThumbIcon };
//# sourceMappingURL=AnimatedThumbIcon.native.js.map