import * as React from "react";

import { IconWrapper } from "../icon-wrapper";
import type { ISvgIcons } from "../type";

export const InfoIcon = React.forwardRef<SVGSVGElement, ISvgIcons>(
  ({ color = "currentColor", ...rest }, ref) => {
    const clipPathId = React.useId();

    return (
      <IconWrapper ref={ref} color={color} clipPathId={clipPathId} {...rest}>
        <path
          d="M14.041 8C14.041 4.66339 11.3365 1.95818 8 1.95801C4.66328 1.95801 1.95801 4.66328 1.95801 8C1.95818 11.3365 4.66339 14.041 8 14.041C11.3364 14.0408 14.0408 11.3364 14.041 8ZM7.375 10.666V8C7.375 7.65482 7.65482 7.375 8 7.375C8.34503 7.37518 8.625 7.65493 8.625 8V10.666C8.625 11.0111 8.34503 11.2908 8 11.291C7.65482 11.291 7.375 11.0112 7.375 10.666ZM8.00586 4.70801C8.35104 4.70801 8.63086 4.98783 8.63086 5.33301C8.63086 5.67819 8.35104 5.95801 8.00586 5.95801H8C7.65482 5.95801 7.375 5.67819 7.375 5.33301C7.375 4.98783 7.65482 4.70801 8 4.70801H8.00586ZM15.291 8C15.2908 12.0268 12.0268 15.2908 8 15.291C3.97303 15.291 0.708184 12.0269 0.708008 8C0.708008 3.97292 3.97292 0.708008 8 0.708008C12.0269 0.708184 15.291 3.97303 15.291 8Z"
          fill={color}
        />
      </IconWrapper>
    );
  }
);

InfoIcon.displayName = "InfoIcon";