import * as React from 'react';

import AccessibleSVG from '../accessible-svg';

import { Icon } from '../iconTypes';

const IconInviteCollaborators = ({ className = '', color = '#444444', height = 16, title, width = 16 }: Icon) => (
    <AccessibleSVG
        className={`icon-invite-collaborators ${className}`}
        height={height}
        title={title}
        viewBox="0 0 16 16"
        width={width}
    >
        <g fill="none" fillRule="evenodd" transform="translate(1 -1)">
            <circle className="stroke-color" cx="7" cy="9" r="7" stroke={color} />
            <circle className="stroke-color" cx="7" cy="7" r="2" stroke={color} />
            <path
                className="stroke-color"
                d="M3 13s1.4985-2 4-2 4 2 4 2"
                stroke={color}
                strokeLinecap="round"
                strokeLinejoin="round"
            />
            <circle cx="11" cy="3" fill="#FFFFFF" r="3" />
            <path
                className="fill-color"
                d="M11.4634 3.521H12.5c.276 0 .5-.2238.5-.5 0-.276-.224-.5-.5-.5h-1.0366V1.5c0-.276-.2238-.5-.5-.5-.276 0-.5.224-.5.5v1.021H9.5c-.276 0-.5.224-.5.5 0 .2762.224.5.5.5h.9634V4.5c0 .276.224.5.5.5.2762 0 .5-.224.5-.5v-.979z"
                fill={color}
            />
        </g>
    </AccessibleSVG>
);

export default IconInviteCollaborators;