import type { SVGProps } from "react";

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

/**
 * Congo - Brazzaville — COG icon from flag category
 *
 * @example
 * <COG size={16} />
 * <COG size={32} className="text-primary" />
 */
export const COG = ({ size = 16, ...props }: COGProps) => (
  <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_2283)">
<path d="M6.50486 22.6708L15.3204 15.3204L22.6708 6.50491C21.5279 4.29016 19.7159 2.47709 17.502 1.33282L8.67948 8.67958L1.33282 17.502C2.47699 19.7159 4.29007 21.528 6.50486 22.6708Z" fill="#FFDA44"/>
<path d="M20.4856 20.4856C24.2715 16.6997 24.9983 11.0139 22.6675 6.49768L6.49768 22.6675C11.0139 24.9983 16.6997 24.2715 20.4856 20.4856Z" fill="#D80027"/>
<path d="M3.51418 3.51424C-0.27172 7.30014 -0.998468 12.986 1.33229 17.5022L17.5021 1.3324C12.9859 -0.998457 7.30008 -0.271615 3.51418 3.51424Z" fill="#6DA544"/>
</g>
<defs>
<clipPath id="clip0_43_2283">
<rect fill="white" height="24" width="24"/>
</clipPath>
</defs>
  </svg>
);
