import React from 'react';
import {IconX} from '@tabler/icons-react-native';
import {useTheme} from '@shared/theme';

import {IconButton, IconButtonProps} from '../IconButton';

type Props = Omit<IconButtonProps, 'Icon'>;

export function CloseButton({iconColor, variant, ...props}: Props) {
  const {theme, spacing} = useTheme();
  return (
    <IconButton
      {...props}
      iconColor={iconColor || theme.text.neutral.default}
      Icon={IconX}
      variant={variant || 'tertiary'}
      hitSlop={spacing.x2}
    />
  );
}
