@metamask/design-system-react-native/dist/components/temp-components/ButtonAnimated/ButtonAnimated.mjs

Design System React Native

function $importDefault(module) {
    if (module?.__esModule) {
        return module.default;
    }
    return module;
}
import $React from "react";
const React = $importDefault($React);
import { Pressable } from "react-native/index.js";
import Animated, { useSharedValue, useAnimatedStyle, withTiming, Easing } from "react-native-reanimated";
export const ButtonAnimated = ({ onPressIn, onPressOut, disabled, ...props }) => {
    const animation = useSharedValue(1);
    const scaleStyle = useAnimatedStyle(() => {
        return {
            transform: [{ scale: animation.value }],
        };
    });
    const onPressInHandler = (event) => {
        animation.value = withTiming(0.97, {
            duration: 100,
            easing: Easing.bezier(0.3, 0.8, 0.3, 1),
        });
        onPressIn?.(event);
    };
    const onPressOutHandler = (event) => {
        animation.value = withTiming(1, {
            duration: 100,
            easing: Easing.bezier(0.3, 0.8, 0.3, 1),
        });
        onPressOut?.(event);
    };
    return (<Animated.View style={[scaleStyle, { alignItems: 'center', justifyContent: 'center' }]}>
      <Pressable onPressIn={onPressInHandler} onPressOut={onPressOutHandler} disabled={disabled} {...props}/>
    </Animated.View>);
};
//# sourceMappingURL=ButtonAnimated.mjs.map