import React from 'react';
import { Image, TouchableOpacity, StyleSheet } from 'react-native';
import Icons from '../Icons';
import { ThemeContext } from '../Contexts';
const Arrow = ({ direction, isDisabled, onPress }) => {
    const theme = React.useContext(ThemeContext);
    return (<TouchableOpacity hitSlop={{ top: 20, bottom: 20, left: 20, right: 20 }} accessibilityLabel={`${direction} arrow`} accessibilityHint={'Press to move to previous month or year'} accessibilityState={{ disabled: isDisabled }} disabled={isDisabled} onPress={onPress} style={[theme.normalArrowContainer, isDisabled && theme.disabledArrowContainer]}>
      <Image testID={'arrow-image'} accessibilityIgnoresInvertColors source={Icons.arrow.left['16px']} style={[
            theme.normalArrowImage,
            isDisabled && theme.disabledArrowImage,
            direction === 'right' && styles.right,
        ]}/>
    </TouchableOpacity>);
};
export default React.memo(Arrow);
const styles = StyleSheet.create({
    right: {
        transform: [{ rotate: '180deg' }],
    },
});
//# sourceMappingURL=Arrow.js.map