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

export const IconStatusCircleOutline = 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-status-circle-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M14.5303 9.29293C14.8232 9.00003 14.8232 8.52516 14.5303 8.23227C14.2374 7.93937 13.7626 7.93937 13.4697 8.23227L11.375 10.3269L9.51784 8.46979C9.22495 8.1769 8.75007 8.1769 8.45718 8.46979L5.83217 11.0948C5.53928 11.3877 5.53928 11.8626 5.83217 12.1555C6.12507 12.4484 6.59994 12.4484 6.89283 12.1555L8.98751 10.0608L10.8447 11.9179C11.1376 12.2108 11.6124 12.2108 11.9053 11.9179L14.5303 9.29293Z"
          fill={color}
        />
        <path
          d="M10 2C5.50901 2 2 5.63253 2 10C2 14.3675 5.52701 18 10 18C14.473 18 18 14.3904 18 10C18 5.60956 14.491 2 10 2ZM3.5 10C3.5 6.27649 6.53936 3.5 10 3.5C13.4606 3.5 16.5 6.30225 16.5 10C16.5 13.6977 13.4606 16.5 10 16.5C6.53936 16.5 3.5 13.7235 3.5 10Z"
          fill={color}
          fillRule="evenodd"
          clipRule="evenodd"
        />
      </svg>
    );
  }
);

IconStatusCircleOutline.displayName = "IconStatusCircleOutline";

export default IconStatusCircleOutline;