import * as React from "react";

export interface WhatsAppIconProps extends React.SVGProps<SVGSVGElement> {
  className?: string;
  size?: number | string;
}

/**
 * Official WhatsApp Brand Logo (SVG)
 */
export function WhatsAppIcon({
  className = "w-4 h-4",
  size,
  ...props
}: WhatsAppIconProps) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 24 24"
      width={size}
      height={size}
      fill="currentColor"
      aria-hidden="true"
      className={className}
      {...props}
    >
      <path d="M12.031 0C5.404 0 .025 5.378.022 12.008a11.96 11.96 0 0 0 1.606 5.996L0 24l6.167-1.618a11.97 11.97 0 0 0 5.864 1.528h.005c6.626 0 12.006-5.379 12.009-12.01A12.02 12.02 0 0 0 12.031 0zm0 21.874h-.004a9.94 9.94 0 0 1-5.068-1.388l-.364-.216-3.764.987 1.005-3.67-.237-.377a9.92 9.92 0 0 1-1.522-5.195c.002-5.49 4.47-9.957 9.96-9.957a9.91 9.91 0 0 1 7.042 2.923 9.9 9.9 0 0 1 2.915 7.041c-.003 5.49-4.472 9.959-9.963 9.959zm5.457-7.458c-.299-.15-1.771-.874-2.045-.974-.275-.1-.475-.15-.675.15-.2.3-.775.974-.95 1.174-.175.2-.35.225-.65.075-.3-.15-1.267-.467-2.414-1.488-.893-.797-1.496-1.782-1.671-2.082-.175-.3-.018-.463.132-.612.135-.134.3-.35.45-.525.15-.175.2-.3.3-.5.1-.2.05-.375-.025-.525-.075-.15-.675-1.625-.925-2.225-.244-.584-.492-.505-.675-.514-.175-.009-.375-.01-.575-.01s-.525.075-.8.375c-.275.3-1.05 1.025-1.05 2.5s1.075 2.9 1.225 3.1c.15.2 2.115 3.23 5.124 4.53.716.31 1.275.494 1.71.632.72.23 1.373.197 1.89.12.576-.086 1.771-.724 2.021-1.424.25-.7.25-1.3.175-1.425-.075-.125-.275-.2-.575-.35z" />
    </svg>
  );
}