mirror of https://github.com/tooot-app/app
56 lines
1.2 KiB
TypeScript
56 lines
1.2 KiB
TypeScript
import FeatherNames from '@expo/vector-icons/build/vendor/react-native-vector-icons/glyphmaps/Feather.json'
|
|
import Feather from '@expo/vector-icons/Feather'
|
|
import React from 'react'
|
|
import { AccessibilityProps, StyleProp, View, ViewStyle } from 'react-native'
|
|
|
|
export type IconName = keyof typeof FeatherNames
|
|
|
|
export interface Props {
|
|
accessibilityLabel?: AccessibilityProps['accessibilityLabel']
|
|
|
|
name: IconName
|
|
size: number
|
|
color: string
|
|
style?: StyleProp<ViewStyle>
|
|
crossOut?: boolean
|
|
}
|
|
|
|
const Icon: React.FC<Props> = ({
|
|
accessibilityLabel,
|
|
name,
|
|
size,
|
|
color,
|
|
style,
|
|
crossOut = false
|
|
}) => {
|
|
return (
|
|
<View
|
|
accessibilityLabel={accessibilityLabel}
|
|
style={[
|
|
style,
|
|
{
|
|
width: size,
|
|
height: size,
|
|
justifyContent: 'center',
|
|
alignItems: 'center'
|
|
}
|
|
]}
|
|
>
|
|
<Feather name={name} size={size} color={color} />
|
|
{crossOut ? (
|
|
<View
|
|
style={{
|
|
position: 'absolute',
|
|
transform: [{ rotate: '45deg' }],
|
|
width: size * 1.35,
|
|
borderBottomColor: color,
|
|
borderBottomWidth: 2
|
|
}}
|
|
/>
|
|
) : null}
|
|
</View>
|
|
)
|
|
}
|
|
|
|
export default Icon
|