import { iconVariants } from "./variants"

import type { IconProps } from "@/types/components/icon"

export default function ArrowRightIcon({
  className,
  color,
  height = "25",
  width = "24",
  ...props
}: IconProps) {
  const classNames = iconVariants({ className, color })
  return (
    <svg
      className={classNames}
      fill="none"
      height={height}
      viewBox="0 0 24 25"
      width={width}
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M16.15 13.5703H5.1875C4.92917 13.5703 4.70833 13.4786 4.525 13.2953C4.34167 13.112 4.25 12.8911 4.25 12.6328C4.25 12.3745 4.34167 12.1536 4.525 11.9703C4.70833 11.787 4.92917 11.6953 5.1875 11.6953H16.15L11.325 6.8703C11.1333 6.67863 11.0396 6.4578 11.0438 6.2078C11.0479 5.9578 11.1458 5.73697 11.3375 5.5453C11.5292 5.36197 11.75 5.26822 12 5.26405C12.25 5.25988 12.4708 5.35363 12.6625 5.5453L19.0875 11.9703C19.1792 12.062 19.2479 12.164 19.2937 12.2765C19.3396 12.389 19.3625 12.5078 19.3625 12.6328C19.3625 12.7578 19.3396 12.8765 19.2937 12.989C19.2479 13.1016 19.1792 13.2036 19.0875 13.2953L12.6625 19.7203C12.4792 19.9036 12.2604 19.9953 12.0062 19.9953C11.7521 19.9953 11.5292 19.9036 11.3375 19.7203C11.1458 19.5286 11.05 19.3057 11.05 19.0516C11.05 18.7974 11.1458 18.5745 11.3375 18.3828L16.15 13.5703Z"
        fill="#4D001B"
      />
    </svg>
  )
}