import Svg, { Path } from 'react-native-svg'

import { colors } from '../Colors'
import { SvgIconProps } from '../components/SvgIcon'

export function Chat(props: SvgIconProps): React.ReactElement {
  const { stroke = colors.white, fill = colors.white, size = 30, style } = props

  return (
    <Svg
      style={style}
      width={size}
      height={size}
      viewBox="0 0 30 30"
      fill="none"
    >
      <Path
        d="M5.32031 20.7422C3.92447 18.3872 3.43623 15.6037 3.94723 12.9142C4.45823 10.2247 5.93335 7.81429 8.09564 6.13535C10.2579 4.45642 12.9587 3.62447 15.6909 3.7957C18.4231 3.96693 20.9989 5.12955 22.9347 7.06531C24.8704 9.00107 26.033 11.5768 26.2043 14.3091C26.3755 17.0413 25.5435 19.742 23.8646 21.9043C22.1857 24.0666 19.7752 25.5417 17.0858 26.0527C14.3963 26.5637 11.6128 26.0755 9.25781 24.6797L5.36718 25.7812C5.20778 25.8278 5.03877 25.8307 4.87788 25.7896C4.71698 25.7484 4.57011 25.6647 4.45268 25.5473C4.33524 25.4299 4.25156 25.283 4.2104 25.1221C4.16924 24.9612 4.17213 24.7922 4.21875 24.6328L5.32031 20.7422Z"
        stroke={stroke}
        strokeWidth="1.875"
        strokeLinecap="round"
        strokeLinejoin="round"
      />
      <Path
        d="M15 16.4062C15.7767 16.4062 16.4062 15.7767 16.4062 15C16.4062 14.2233 15.7767 13.5938 15 13.5938C14.2233 13.5938 13.5938 14.2233 13.5938 15C13.5938 15.7767 14.2233 16.4062 15 16.4062Z"
        fill={fill}
      />
      <Path
        d="M9.375 16.4062C10.1517 16.4062 10.7812 15.7767 10.7812 15C10.7812 14.2233 10.1517 13.5938 9.375 13.5938C8.59835 13.5938 7.96875 14.2233 7.96875 15C7.96875 15.7767 8.59835 16.4062 9.375 16.4062Z"
        fill={fill}
      />
      <Path
        d="M20.625 16.4062C21.4017 16.4062 22.0312 15.7767 22.0312 15C22.0312 14.2233 21.4017 13.5938 20.625 13.5938C19.8483 13.5938 19.2188 14.2233 19.2188 15C19.2188 15.7767 19.8483 16.4062 20.625 16.4062Z"
        fill={fill}
      />
    </Svg>
  )
}