import type { SVGProps } from "react";

export interface JEYProps extends SVGProps<SVGSVGElement> {
  /**
   * Icon size (width and height)
   * @default 16
   */
  size?: number | string;
}

/**
 * Jersey — JEY icon from flag category
 *
 * @example
 * <JEY size={16} />
 * <JEY size={32} className="text-primary" />
 */
export const JEY = ({ size = 16, ...props }: JEYProps) => (
  <svg
    fill="none"
    height={size}
    viewBox="0 0 24 24"
    width={size}
    xmlns="http://www.w3.org/2000/svg"
    {...props}
  >
    <g clipPath="url(#clip0_43_1744)">
<path d="M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z" fill="#F0F0F0"/>
<path d="M21.5202 19.3066L14.2136 12H14.2135L21.5202 4.6933C21.2051 4.2838 20.8604 3.88981 20.4853 3.51467C20.1102 3.13958 19.7162 2.79481 19.3067 2.47977L12.0001 9.78641L12 9.78645L4.69338 2.47977C4.28392 2.79486 3.88989 3.13953 3.51475 3.51467C3.13961 3.88981 2.79489 4.2838 2.47984 4.6933L9.78648 11.9999L9.78653 11.9999L2.4798 19.3067C2.79494 19.7162 3.13966 20.1102 3.5147 20.4853C3.88984 20.8604 4.28378 21.2052 4.69333 21.5202L12 14.2136L12.0001 14.2135L19.3067 21.5202C19.7162 21.2051 20.1102 20.8603 20.4853 20.4853C20.8605 20.1101 21.2051 19.7161 21.5202 19.3066Z" fill="#D80027"/>
<path d="M9.91302 3.65217L12 4.17389L14.087 3.65217V1.87828L13.2522 2.29566L12 1.04349L10.7478 2.29566L9.91302 1.87828V3.65217Z" fill="#FFDA44"/>
<path d="M9.91302 3.65216V4.9566C9.91302 6.5541 12 7.04357 12 7.04357C12 7.04357 14.087 6.55405 14.087 4.9566V3.65216H9.91302Z" fill="#D80027"/>
</g>
<defs>
<clipPath id="clip0_43_1744">
<rect fill="white" height="24" width="24"/>
</clipPath>
</defs>
  </svg>
);