import React from 'react';

import { forwardRef } from '../../utils/react';
import { Icon } from '../../icon';

export const WarningIcon = forwardRef<typeof Icon>(
  function WarningIcon(props, ref) {
    return (
      <Icon ref={ref} {...props}>
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
          <path
            fill="currentColor"
            d="M10 13.65c-.56 0-1.03.46-1.03 1.01s.47 1.01 1.03 1.01c.54 0 1.03-.46 1-.99a1 1 0 0 0-1-1.03Z"
          />
          <path
            fill="currentColor"
            d="M19.51 17.24a3.4 3.4 0 0 0 .01-3.5L13.08 2.76A3.5 3.5 0 0 0 10 1c-1.29 0-2.44.66-3.08 1.76L.48 13.75a3.44 3.44 0 0 0 .01 3.51A3.53 3.53 0 0 0 3.56 19h12.86c1.29 0 2.44-.66 3.1-1.76Zm-1.4-.8c-.35.6-.99.97-1.7.97H3.57a1.92 1.92 0 0 1-1.68-2.88L8.32 3.55c.35-.6.98-.96 1.68-.96s1.34.36 1.69.96l6.44 10.99c.34.59.34 1.3-.01 1.9Z"
          />
          <path
            fill="currentColor"
            d="M9.74 6.55c-.48.13-.79.57-.79 1.1l.07.96.21 3.64c.03.4.35.7.77.7.42 0 .75-.31.77-.73 0-.25 0-.48.02-.74l.14-2.34.1-1.52c0-.18-.03-.34-.1-.5-.2-.46-.7-.69-1.19-.57Z"
          />
        </svg>
      </Icon>
    );
  },
);
