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

export const IconExclamationTriangleOutline = 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-exclamation-triangle-outline`,
  };
  return (
    <svg
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
      ref={forwardedRef}
    >
      <path
        d="M11.0825 3.12754C10.6015 2.29375 9.3981 2.29375 8.91706 3.12754L2.78846 13.7505C2.30769 14.5838 2.90912 15.6251 3.87119 15.6251H16.1284C17.0905 15.6251 17.6919 14.5838 17.2111 13.7505L11.0825 3.12754ZM7.83433 2.50289C8.7964 0.8353 11.2032 0.835299 12.1653 2.50289L18.2939 13.1258C19.2554 14.7925 18.0525 16.8751 16.1284 16.8751H3.87119C1.94704 16.8751 0.744187 14.7925 1.70573 13.1258L7.83433 2.50289ZM9.9998 6.87511C10.345 6.87511 10.6248 7.15494 10.6248 7.50011V10.6251C10.6248 10.9703 10.345 11.2501 9.9998 11.2501C9.65462 11.2501 9.3748 10.9703 9.3748 10.6251V7.50011C9.3748 7.15494 9.65462 6.87511 9.9998 6.87511ZM9.3748 13.1251C9.3748 12.7799 9.65462 12.5001 9.9998 12.5001H10.006C10.3512 12.5001 10.631 12.7799 10.631 13.1251V13.1314C10.631 13.4765 10.3512 13.7564 10.006 13.7564H9.9998C9.65462 13.7564 9.3748 13.4765 9.3748 13.1314V13.1251Z"
        fill={color}
        fillRule="evenodd"
        clipRule="evenodd"
      />
    </svg>
  );
});

IconExclamationTriangleOutline.displayName = "IconExclamationTriangleOutline";

export default IconExclamationTriangleOutline;