import { View } from 'react-native';
import { Typography } from '../../../core/components/Typography/Typography';
import { useStyles } from './styles';
import Avatar from '../Avatar';
import { CloseButton } from '../../elements';
function CategoryChip({
  category,
  onPress
}) {
  var _category$avatar;
  const {
    styles,
    theme
  } = useStyles();
  return /*#__PURE__*/React.createElement(View, {
    style: styles.categoryChip
  }, /*#__PURE__*/React.createElement(Avatar.Category, {
    iconProps: {
      width: 28,
      height: 28
    },
    uri: (_category$avatar = category.avatar) === null || _category$avatar === void 0 ? void 0 : _category$avatar.fileUrl,
    imageStyle: styles.categoryAvatar
  }), /*#__PURE__*/React.createElement(Typography.BodyBold, {
    numberOfLines: 1,
    ellipsizeMode: "tail",
    style: styles.categoryName
  }, category.name), onPress && /*#__PURE__*/React.createElement(CloseButton, {
    onPress: () => onPress(category),
    iconProps: {
      color: theme.colors.baseShade1
    }
  }));
}
export default CategoryChip;
//# sourceMappingURL=CategoryChip.js.map