import { iconVariants } from '../variants'

import type { LogoAndIllustrationProps } from '../icon'

export default function HaymarketIcon({
  className,
  color,
  ...props
}: LogoAndIllustrationProps) {
  const classNames = iconVariants({ className, color })
  return (
    <svg
      className={classNames}
      width="100"
      height="26"
      viewBox="0 0 100 26"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M12.8731 24.9845C19.6178 24.9845 25.1297 19.509 25.1297 12.8004C25.1297 6.09193 19.6178 0.580078 12.8731 0.580078C6.12831 0.580078 0.616455 6.05567 0.616455 12.7642C0.616455 19.4727 6.12831 24.9845 12.8731 24.9845ZM8.66666 9.24675H17.1158L12.8731 16.5354L8.66666 9.24675ZM8.66666 8.77534L10.6973 5.22164H15.0488L17.0795 8.77534H8.66666ZM17.2608 23.6791C15.9191 24.223 14.5411 24.4769 13.0907 24.5131V17.0794L17.2608 9.8632V23.6791ZM17.7322 2.10309C21.9386 3.98873 24.6583 8.19514 24.6583 12.7642C24.6583 17.3332 21.9386 21.5396 17.7322 23.4615V2.10309ZM17.2608 1.88552V8.12262L13.1994 1.05149C14.5774 1.08775 15.9554 1.37785 17.2608 1.88552ZM14.795 4.75023H10.9512L12.8731 1.45037L14.795 4.75023ZM8.48535 1.88552C9.79079 1.37785 11.1688 1.08775 12.583 1.05149L8.48535 8.12262V1.88552ZM8.48535 9.8632L12.6555 17.0794V24.5131C11.205 24.4769 9.82705 24.1868 8.48535 23.6791V9.8632ZM8.01394 2.10309V23.4615C3.80753 21.5759 1.08786 17.3695 1.08786 12.7642C1.08786 8.15888 3.80753 3.98873 8.01394 2.10309Z"
        fill="black"
      />
      <path
        d="M34.8479 12.1114H31.6931V9.75439H30.4602V16.0278H31.6931V13.1993H34.8479V16.0278H36.0446V9.75439H34.8479V12.1114Z"
        fill="black"
      />
      <path
        d="M41.3389 9.75439L38.6555 16.064H39.9247L40.5049 14.6861H43.0432L43.6234 16.064H44.8926L42.2092 9.75439H41.3389ZM40.9763 13.5619L41.7741 11.7126L42.5718 13.5619H40.9763Z"
        fill="black"
      />
      <path
        d="M50.2232 9.75439L48.8453 11.9664L47.4673 9.75439H46.0894L48.2288 13.1993V16.0278H49.4617V13.1993L51.6012 9.75439H50.2232Z"
        fill="black"
      />
      <path
        d="M57.3667 13.5257L55.0822 9.75439H54.2119V16.0278H55.4448V12.5466L56.9678 15.0124H57.8019L59.3249 12.5466V16.0278H60.5215V9.75439H59.6512L57.3667 13.5257Z"
        fill="black"
      />
      <path
        d="M69.3697 16.0279L66.6863 9.71826H65.816L63.1326 16.0279H64.4017L64.9819 14.6499H67.5203L68.1005 16.0279H69.3697ZM65.4533 13.5621L66.2511 11.7127L67.0489 13.5621H65.4533Z"
        fill="black"
      />
      <path
        d="M75.0265 13.1632C75.2803 13.0906 75.4979 12.9456 75.643 12.8005C75.9693 12.4742 76.1869 12.0028 76.1869 11.5314C76.1869 11.0237 75.9693 10.5523 75.643 10.2622C75.3166 9.97208 74.9177 9.79077 74.265 9.79077H71.9805V16.1004H73.2134V13.3082H73.6485L75.8968 16.1004H77.3835L75.0265 13.1632ZM74.8089 11.9665C74.7001 12.0753 74.5551 12.1478 74.1925 12.1478H73.1771V10.8061H74.1925C74.5551 10.8061 74.7001 10.8786 74.8089 10.9874C74.9177 11.0962 74.9902 11.2775 74.9902 11.4588C74.9902 11.6764 74.9177 11.8577 74.8089 11.9665Z"
        fill="black"
      />
      <path
        d="M85.1074 9.75439H83.5118L81.1185 12.2565V9.75439H79.9219V16.0278H81.1185V12.9455L83.9107 16.0278H85.47L82.3514 12.6191L85.1074 9.75439Z"
        fill="black"
      />
      <path
        d="M89.2776 13.1993H91.1995V12.1114H89.2776V10.806H91.8159V9.75439H88.0447V16.0278H91.9247V14.9762H89.2776V13.1993Z"
        fill="black"
      />
      <path
        d="M94.3906 9.75439V10.806H96.0587V16.0278H97.2553V10.806H98.9234V9.75439H94.3906Z"
        fill="black"
      />
    </svg>
  )
}
