import { forwardRef } from "react";
import type { IconProps } from "../../types";

export const IconArrowChevronRightOutline = forwardRef<
  SVGSVGElement,
  IconProps
>(({ color = "currentColor", ...props }, forwardedRef) => {
  const { className } = props;
  props = {
    ...props,
    width: `${props.width || props.size || 20}`,
    height: `${props.height || props.size || 20}`,
    className: `${
      className ? className + " " : ""
    }customeow-icon customeow-icon-icon-arrow-chevron-right-outline`,
  };
  return (
    <svg
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
      ref={forwardedRef}
    >
      <path
        d="M7.70938 14.7698C7.42228 14.4713 7.43159 13.9965 7.73017 13.7094L11.6679 10L7.73017 6.29062C7.43159 6.00353 7.42228 5.52875 7.70938 5.23017C7.99647 4.93159 8.47125 4.92228 8.76983 5.20937L13.2698 9.45937C13.4169 9.60078 13.5 9.79599 13.5 10C13.5 10.204 13.4169 10.3992 13.2698 10.5406L8.76983 14.7906C8.47125 15.0777 7.99647 15.0684 7.70938 14.7698Z"
        fill={color}
        fillRule="evenodd"
        clipRule="evenodd"
      />
    </svg>
  );
});

IconArrowChevronRightOutline.displayName = "IconArrowChevronRightOutline";

export default IconArrowChevronRightOutline;