import React from 'react';
import { useTranslation } from 'react-i18next';
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
import { useTheme } from '../../contexts/theme';
import { testIdWithKey } from '../../utils/testable';
const RecordRemove = ({
  onRemove = () => null
}) => {
  const {
    t
  } = useTranslation();
  const {
    TextTheme,
    ColorPallet,
    Assets
  } = useTheme();
  const styles = StyleSheet.create({
    headerText: {
      ...TextTheme.normal
    },
    footerText: {
      ...TextTheme.normal,
      color: ColorPallet.brand.link
    },
    linkContainer: {
      minHeight: TextTheme.normal.fontSize,
      paddingVertical: 2
    },
    credentialRemoveContainer: {
      flexDirection: 'row',
      alignItems: 'center',
      gap: 8
    }
  });
  return /*#__PURE__*/React.createElement(View, {
    style: {
      backgroundColor: ColorPallet.brand.secondaryBackground,
      marginTop: 16,
      paddingHorizontal: 25,
      paddingVertical: 16
    }
  }, /*#__PURE__*/React.createElement(TouchableOpacity, {
    style: styles.credentialRemoveContainer,
    accessible: true,
    accessibilityLabel: t('CredentialDetails.RemoveFromWallet'),
    accessibilityRole: 'button',
    testID: testIdWithKey('RemoveFromWallet'),
    activeOpacity: 1,
    onPress: onRemove
  }, /*#__PURE__*/React.createElement(Assets.svg.iconDelete, {
    width: 20,
    height: 20,
    color: ColorPallet.semantic.error
  }), /*#__PURE__*/React.createElement(Text, {
    style: [styles.footerText, {
      color: ColorPallet.semantic.error
    }]
  }, t('CredentialDetails.RemoveFromWallet'))));
};
export default RecordRemove;
//# sourceMappingURL=RecordRemove.js.map