import { FC } from 'react'

import { SvgIcon, SvgIconProps } from '@mui/material'

const MentionIcon: FC<SvgIconProps> = ({ sx, ...props }) => (
  <SvgIcon sx={{ fontSize: 18, color: 'action.active', ...sx }} {...props}>
    <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none">
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M1.6875 9C1.6875 4.96109 4.96109 1.6875 9 1.6875C13.0389 1.6875 16.3125 4.96109 16.3125 9V10.125C16.3125 11.4714 15.2214 12.5625 13.875 12.5625C12.9493 12.5625 12.1443 12.0468 11.7316 11.2869C11.0781 12.0667 10.0969 12.5625 9 12.5625C7.03259 12.5625 5.4375 10.9674 5.4375 9C5.4375 7.03259 7.03259 5.4375 9 5.4375C10.9674 5.4375 12.5625 7.03259 12.5625 9V10.125C12.5625 10.8501 13.1499 11.4375 13.875 11.4375C14.6001 11.4375 15.1875 10.8501 15.1875 10.125V9C15.1875 5.58241 12.4176 2.8125 9 2.8125C5.58241 2.8125 2.8125 5.58241 2.8125 9C2.8125 12.4176 5.58241 15.1875 9 15.1875C9.79022 15.1875 10.5928 15.0377 11.3677 14.7166C11.7831 14.5444 12.1693 14.3276 12.5286 14.0777C12.7836 13.9003 13.1341 13.9633 13.3115 14.2183C13.4889 14.4733 13.426 14.8239 13.1709 15.0013C12.7517 15.2929 12.2949 15.5501 11.7984 15.7559L11.7983 15.7559C10.8827 16.1353 9.93328 16.3125 9 16.3125C4.96109 16.3125 1.6875 13.0389 1.6875 9ZM11.4375 9C11.4375 7.65391 10.3461 6.5625 9 6.5625C7.65391 6.5625 6.5625 7.65391 6.5625 9C6.5625 10.3461 7.65391 11.4375 9 11.4375C10.3461 11.4375 11.4375 10.3461 11.4375 9Z"
        fill="currentColor"
      />
    </svg>
  </SvgIcon>
)

export default MentionIcon
