1import React from 'react'; 2import {StyleProp, StyleSheet, ViewProps} 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<ViewProps>; 14 children?: string; 15} 16export default function (props: IProps) { 17 const {icon, children, onPress} = props; 18 const colors = useColors(); 19 20 return ( 21 <TouchableOpacity style={style.container} onPress={onPress}> 22 <Icon name={icon} size={iconSizeConst.light} color={colors.text} /> 23 <ThemeText style={style.text} fontSize={'content'}> 24 {children} 25 </ThemeText> 26 </TouchableOpacity> 27 ); 28} 29 30const style = StyleSheet.create({ 31 container: { 32 flexDirection: 'row', 33 alignItems: 'center', 34 paddingHorizontal: rpx(16), 35 paddingVertical: rpx(8), 36 }, 37 text: { 38 marginLeft: rpx(8), 39 }, 40}); 41