import React from 'react';

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

export const HelpIcon = forwardRef<typeof Icon>(function HelpIcon(props, ref) {
  return (
    <Icon ref={ref} {...props}>
      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
        <path
          fill="currentColor"
          d="M13.95 7.88c0 .38-.06.7-.17 1-.11.3-.28.56-.5.81-.2.25-.54.54-1.01.88-.57.4-.94.7-1.12.9a1.84 1.84 0 0 0-.6 1.37H9.22a2.78 2.78 0 0 1 .66-1.75c.2-.24.55-.54 1.04-.9.55-.4.9-.7 1.07-.89.18-.19.32-.39.42-.6.1-.22.15-.47.15-.76 0-.55-.2-.98-.61-1.28a2.7 2.7 0 0 0-1.65-.45c-.7 0-1.26.19-1.7.56-.42.37-.67.88-.74 1.53l-1.41-.1a3.4 3.4 0 0 1 1.22-2.32 4.06 4.06 0 0 1 2.61-.82c1.14 0 2.04.25 2.7.74.65.5.98 1.19.98 2.08Zm-4.8 7.7v-1.55h1.5v1.54h-1.5Z"
        />
        <circle
          cx={10}
          cy={10}
          r={9.29}
          stroke="currentColor"
          strokeWidth={1.43}
        />
      </svg>
    </Icon>
  );
});
