import React from 'react';

import type { SVGProps } from '../SVGTypes';

export const IconSocialInstagramSvg = ({
  title,
  titleId,
  ...props
}: SVGProps) => (
  <svg
    xmlns="http://www.w3.org/2000/svg"
    width={16}
    height={16}
    viewBox="0 0 24 24"
    focusable="false"
    fill="currentColor"
    aria-labelledby={titleId}
    {...props}
  >
    {title ? <title id={titleId}>{title}</title> : null}
    <path d="M12 5.441c2.136 0 2.39.009 3.233.047a4.426 4.426 0 0 1 1.485.276 2.65 2.65 0 0 1 1.518 1.518 4.427 4.427 0 0 1 .276 1.485c.038.844.047 1.097.047 3.233s-.009 2.39-.047 3.233a4.427 4.427 0 0 1-.276 1.485 2.65 2.65 0 0 1-1.518 1.518 4.427 4.427 0 0 1-1.485.276c-.844.038-1.097.047-3.233.047s-2.39-.009-3.233-.047a4.427 4.427 0 0 1-1.485-.276 2.65 2.65 0 0 1-1.518-1.518 4.426 4.426 0 0 1-.276-1.485c-.038-.844-.047-1.097-.047-3.233s.009-2.39.047-3.233a4.426 4.426 0 0 1 .276-1.485 2.65 2.65 0 0 1 1.518-1.518 4.426 4.426 0 0 1 1.485-.276c.844-.038 1.097-.047 3.233-.047M12 4c-2.173 0-2.445.01-3.298.048a5.872 5.872 0 0 0-1.942.372 4.09 4.09 0 0 0-2.34 2.34 5.872 5.872 0 0 0-.372 1.942C4.01 9.555 4 9.827 4 12s.01 2.445.048 3.298a5.872 5.872 0 0 0 .372 1.942 4.09 4.09 0 0 0 2.34 2.34 5.872 5.872 0 0 0 1.942.372C9.555 19.99 9.827 20 12 20s2.445-.01 3.298-.048a5.872 5.872 0 0 0 1.942-.372 4.09 4.09 0 0 0 2.34-2.34 5.872 5.872 0 0 0 .372-1.942C19.99 14.445 20 14.173 20 12s-.01-2.445-.048-3.298a5.872 5.872 0 0 0-.372-1.942 4.09 4.09 0 0 0-2.34-2.34 5.872 5.872 0 0 0-1.942-.372C14.445 4.01 14.173 4 12 4z" />
    <path d="M12 7.892A4.108 4.108 0 1 0 16.108 12 4.108 4.108 0 0 0 12 7.892zm0 6.775A2.667 2.667 0 1 1 14.667 12 2.667 2.667 0 0 1 12 14.667z" />
    <circle cx={16.27} cy={7.73} r={0.96} />
  </svg>
);