HoverableTouchable.jsx

class HoverableTouchable extends PureComponent {
    hoverOpacity = new Animated.Value(1);
    onMouseEnter = () => {
        Animated.timing(this.hoverOpacity, {
            toValue: 0.3,
            duration: 100,
            useNativeDriver: true // not available on web, make a check here, something like Platform.OS === 'web' ? ...
        }).start()
    }
    onMouseLeave = () => {
        Animated.timing(this.hoverOpacity, {
            toValue: 1,
            duration: 100,
            useNativeDriver: true // not available on web, make a check here, something like Platform.OS === 'web' ? ...
        }).start()
    }
    render() {
        return (
            <AnimatedHoverable
            style={{
                opacity: this.hoverOpacity
            }}
                onMouseEnter={this.onMouseEnter}
                onMouseLeave={this.onMouseLeave}
            >
                <TouchableOpacity
                    onPress={this.props.onPress}
                >

                </TouchableOpacity>
            </AnimatedHoverable>
        )
    }
}

const AnimatedHoverable = Animated.createAnimatedComponent(styled.View`
    flex: 0;
    ${/* more styles here */}
`);