import React from 'react';
import { convertIcon } from '../component/Icon';

interface OverrideIconSize {
  size?: '20' | '24';
}

const SvgComponent = ({
  size = '20',
  color = '#616161',
  ...rest
}: React.SVGProps<SVGSVGElement> & OverrideIconSize) => {
  if (size === '24') {
    return (
      <svg
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          fillRule="evenodd"
          clipRule="evenodd"
          d="M9.90291 11.5774C8.86976 10.8123 8.2 9.58435 8.2 8.2C8.2 5.8804 10.0804 4 12.4 4C14.7196 4 16.6 5.8804 16.6 8.2C16.6 9.58435 15.9302 10.8123 14.8971 11.5774C18.3169 12.6407 20.8 15.8304 20.8 19.6C20.8 19.9314 20.5314 20.2 20.2 20.2C19.8686 20.2 19.6 19.9314 19.6 19.6C19.6 15.6235 16.3764 12.4 12.4 12.4C8.42355 12.4 5.2 15.6235 5.2 19.6C5.2 19.9314 4.93137 20.2 4.6 20.2C4.26863 20.2 4 19.9314 4 19.6C4 15.8304 6.48311 12.6407 9.90291 11.5774ZM12.4 11.2C14.0569 11.2 15.4 9.85685 15.4 8.2C15.4 6.54315 14.0569 5.2 12.4 5.2C10.7431 5.2 9.4 6.54315 9.4 8.2C9.4 9.85685 10.7431 11.2 12.4 11.2Z"
          fill={color}
        />
      </svg>
    );
  }

  if (size === '20') {
    return (
      <svg
        width="20"
        height="20"
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          fillRule="evenodd"
          clipRule="evenodd"
          d="M7.91909 9.3145C7.05813 8.67689 6.5 7.65362 6.5 6.5C6.5 4.567 8.067 3 10 3C11.933 3 13.5 4.567 13.5 6.5C13.5 7.65362 12.9419 8.67689 12.0809 9.3145C14.9307 10.2006 17 12.8586 17 16C17 16.2761 16.7761 16.5 16.5 16.5C16.2239 16.5 16 16.2761 16 16C16 12.6863 13.3137 10 10 10C6.68629 10 4 12.6863 4 16C4 16.2761 3.77614 16.5 3.5 16.5C3.22386 16.5 3 16.2761 3 16C3 12.8586 5.06926 10.2006 7.91909 9.3145ZM10 9C11.3807 9 12.5 7.88071 12.5 6.5C12.5 5.11929 11.3807 4 10 4C8.61929 4 7.5 5.11929 7.5 6.5C7.5 7.88071 8.61929 9 10 9Z"
          fill={color}
        />
      </svg>
    );
  }
  return <div></div>;
};
/**
 * 컬러 주입 가능여부: 가능,
 * 기본컬러:#616161
 * 사용가능한 사이즈는 20, 24 입니다.
 *
 */
const IconComponent = convertIcon(SvgComponent, 'user');
export default IconComponent;