1import React from 'react'; 2import {StyleProp, StyleSheet, ViewStyle} from 'react-native'; 3import rpx from '@/utils/rpx'; 4import ThemeText from './themeText'; 5import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; 6import {iconSizeConst} from '@/constants/uiConst'; 7import useColors from '@/hooks/useColors'; 8import {TouchableOpacity} from 'react-native-gesture-handler'; 9 10interface IProps { 11 icon: string; 12 onPress?: () => void; 13 containerStyle?: StyleProp<ViewStyle>; 14 children?: string; 15} 16export default function (props: IProps) { 17 const {icon, children, onPress, containerStyle} = props; 18 const colors = useColors(); 19 20 return ( 21 <TouchableOpacity 22 style={[style.container, containerStyle]} 23 onPress={onPress}> 24 <Icon name={icon} size={iconSizeConst.light} color={colors.text} /> 25 <ThemeText style={style.text} fontSize={'content'}> 26 {children} 27 </ThemeText> 28 </TouchableOpacity> 29 ); 30} 31 32const style = StyleSheet.create({ 33 container: { 34 flexDirection: 'row', 35 alignItems: 'center', 36 paddingHorizontal: rpx(16), 37 paddingVertical: rpx(8), 38 }, 39 text: { 40 marginLeft: rpx(8), 41 }, 42}); 43