import { forwardRef } from 'react';
import type { IconProps } from './types';

export const EyeOff = forwardRef<SVGSVGElement, IconProps>(function EyeOff({ color = 'black', ...props }, ref) {
    return (
        <svg
            width="24"
            height="24"
            viewBox="0 0 24 24"
            fill="none"
            xmlns="http://www.w3.org/2000/svg"
            {...props}
            ref={ref}
        >
            <path
                fillRule="evenodd"
                clipRule="evenodd"
                d="M2.29283 2.29289C2.68336 1.90237 3.31652 1.90237 3.70705 2.29289C9.71605 8.3019 15.7036 14.2894 21.707 20.2929C22.0976 20.6834 22.0976 21.3166 21.707 21.7071C21.3165 22.0976 20.6834 22.0976 20.2928 21.7071L17.1391 18.5534C15.6943 19.3988 13.9716 20 11.9999 20C9.13826 20 6.80527 18.7353 5.07667 17.2926C3.35042 15.8518 2.16689 14.1857 1.57415 13.2472L1.55006 13.2092C1.43242 13.024 1.27969 12.7836 1.20249 12.4468C1.14017 12.1748 1.14019 11.825 1.20255 11.553C1.27979 11.2161 1.43296 10.9751 1.5509 10.7895L1.57518 10.7512C2.17755 9.79768 3.40084 8.07527 5.19529 6.60956L2.29283 3.70711C1.90231 3.31658 1.90231 2.68342 2.29283 2.29289ZM8.55386 9.96814C8.2021 10.5638 7.99994 11.2591 7.99994 11.9999C7.99994 14.2091 9.7908 15.9999 11.9999 15.9999C12.7409 15.9999 13.4361 15.7977 14.0317 15.446L12.5181 13.9324C12.353 13.9765 12.1794 13.9999 11.9999 13.9999C10.8954 13.9999 9.99994 13.1045 9.99994 11.9999C9.99994 11.8204 10.0234 11.6468 10.0675 11.4818L8.55386 9.96814Z"
                fill={color}
            />
            <path
                d="M15.9922 11.7496C15.8681 9.73992 14.26 8.13182 12.2503 8.00771L8.79156 4.54897C9.77116 4.20697 10.8423 4 11.9999 4C14.8616 4 17.1946 5.26472 18.9232 6.70743C20.6494 8.14818 21.833 9.81429 22.4257 10.7528L22.4498 10.7908C22.5674 10.976 22.7201 11.2163 22.7973 11.5532C22.8597 11.8251 22.8597 12.1749 22.7973 12.4468C22.7201 12.7837 22.5674 13.024 22.4498 13.2092L22.4257 13.2472C22.0022 13.9177 21.2772 14.9597 20.2681 16.0255L15.9922 11.7496Z"
                fill={color}
            />
        </svg>
    );
});