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

export const IconVideoPlayCircleOutline = 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-video-play-circle-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M7.70807 7.66039C7.70807 6.92968 8.49305 6.4678 9.1318 6.82266L13.343 9.16224C14.0003 9.52737 14.0003 10.4726 13.343 10.8377L9.1318 13.1773C8.49305 13.5321 7.70807 13.0703 7.70807 12.3396V7.66039Z"
          fill={color}
        />
        <path
          d="M1.75 10C1.75 5.44365 5.44365 1.75 10 1.75C14.5563 1.75 18.25 5.44365 18.25 10C18.25 14.5563 14.5563 18.25 10 18.25C5.44365 18.25 1.75 14.5563 1.75 10ZM10 3.25C6.27208 3.25 3.25 6.27208 3.25 10C3.25 13.7279 6.27208 16.75 10 16.75C13.7279 16.75 16.75 13.7279 16.75 10C16.75 6.27208 13.7279 3.25 10 3.25Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconVideoPlayCircleOutline.displayName = "IconVideoPlayCircleOutline";

export default IconVideoPlayCircleOutline;