import React from 'react';
import { Path, Svg } from 'react-native-svg';
import { useTheme } from '../../../branding';

interface CheckProps {
    color?: string;
    size?: number;
}

export const Check = ({ color, size = 16 }: CheckProps) => {
    const { colors } = useTheme();
    const fill = color ?? colors.gray0;

    return (
        <Svg
            width={size}
            height={size}
            viewBox="0 0 16 16"
            fill="none"
            testID="checkIcon"
        >
            <Path
                fillRule="evenodd"
                clipRule="evenodd"
                d="M15.2071 3.29289C15.5976 3.68342 15.5976 4.31658 15.2071 4.70711L7.20711 12.7071C6.81658 13.0976 6.18342 13.0976 5.79289 12.7071L1.29289 8.20711C0.902369 7.81658 0.902369 7.18342 1.29289 6.79289C1.68342 6.40237 2.31658 6.40237 2.70711 6.79289L6.5 10.5858L13.7929 3.29289C14.1834 2.90237 14.8166 2.90237 15.2071 3.29289Z"
                fill={fill}
            />
        </Svg>
    );
};

export default Check;