import { forwardRef } from "react";
import type { IconProps } from "../../types";

export const IconUserGroupOutline = forwardRef<SVGSVGElement, IconProps>(
  ({ color = "currentColor", ...props }, forwardedRef) => {
    const { className } = props;
    props = {
      ...props,
      width: `${props.width || props.size || 20}`,
      height: `${props.height || props.size || 20}`,
      className: `${
        className ? className + " " : ""
      }customeow-icon customeow-icon-icon-user-group-outline`,
    };
    return (
      <svg
        viewBox="0 0 20 20"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
        {...props}
        ref={forwardedRef}
      >
        <path
          d="M9.99963 9.875C11.7893 9.875 13.3873 10.6935 14.441 11.9736C14.8085 11.8297 15.2082 11.75 15.6256 11.75C17.4205 11.7501 18.8756 13.2051 18.8756 15C18.8756 15.0876 18.8717 15.1747 18.8649 15.2607C18.8413 15.5561 18.6462 15.8097 18.3668 15.9082C17.5281 16.2036 16.6278 16.3656 15.692 16.373C15.6408 16.5644 15.5169 16.7299 15.3424 16.8301C13.7679 17.7334 11.9428 18.25 9.99963 18.25C8.05647 18.2499 6.23131 17.7335 4.65686 16.8301C4.48244 16.7299 4.3584 16.5644 4.30725 16.373C3.37215 16.3654 2.47261 16.2034 1.6344 15.9082C1.35492 15.8097 1.15995 15.5561 1.13635 15.2607C1.1295 15.1747 1.12561 15.0876 1.12561 15C1.12561 13.2051 2.58069 11.75 4.37561 11.75C4.79265 11.75 5.19206 11.829 5.5592 11.9727C6.6129 10.693 8.21047 9.87511 9.99963 9.875ZM9.99963 11.375C8.49523 11.3751 7.17286 12.1564 6.41663 13.3389C5.99836 13.9929 5.75382 14.7689 5.74963 15.6035C5.7496 15.6107 5.74963 15.6178 5.74963 15.625C5.74963 15.656 5.75093 15.6869 5.75159 15.7178C7.02313 16.3766 8.4667 16.7499 9.99963 16.75C11.5322 16.75 12.9754 16.3762 14.2467 15.7178C14.2474 15.6869 14.2496 15.656 14.2496 15.625C14.2496 15.617 14.2497 15.6101 14.2496 15.6035C14.2454 14.7691 14.0017 13.9928 13.5836 13.3389C12.8273 12.1563 11.5043 11.375 9.99963 11.375ZM4.37561 13.25C3.52739 13.25 2.81922 13.8533 2.65881 14.6543C3.18356 14.7919 3.7336 14.8669 4.30139 14.873C4.37419 14.3166 4.52546 13.7851 4.74573 13.29C4.62653 13.2644 4.50288 13.25 4.37561 13.25ZM15.6256 13.25C15.4974 13.25 15.3726 13.264 15.2526 13.29C15.473 13.7852 15.625 14.3164 15.6979 14.873C16.2657 14.8671 16.8157 14.7917 17.3405 14.6543C17.1799 13.8535 16.4736 13.2501 15.6256 13.25ZM5.49963 8.125C5.49963 7.50368 4.99595 7 4.37463 7C3.75348 7.0002 3.24963 7.5038 3.24963 8.125C3.24963 8.7462 3.75348 9.2498 4.37463 9.25C4.99595 9.25 5.49963 8.74632 5.49963 8.125ZM16.7496 8.125C16.7496 7.50368 16.246 7 15.6246 7C15.0035 7.0002 14.4996 7.5038 14.4996 8.125C14.4996 8.7462 15.0035 9.2498 15.6246 9.25C16.246 9.25 16.7496 8.74632 16.7496 8.125ZM11.7496 5.625C11.7496 4.6585 10.9661 3.875 9.99963 3.875C9.0333 3.8752 8.24963 4.65862 8.24963 5.625C8.24963 6.59138 9.0333 7.3748 9.99963 7.375C10.9661 7.375 11.7496 6.5915 11.7496 5.625ZM6.99963 8.125C6.99963 9.57475 5.82438 10.75 4.37463 10.75C2.92505 10.7498 1.74963 9.57463 1.74963 8.125C1.74963 6.67537 2.92505 5.5002 4.37463 5.5C5.82438 5.5 6.99963 6.67525 6.99963 8.125ZM18.2496 8.125C18.2496 9.57475 17.0744 10.75 15.6246 10.75C14.1751 10.7498 12.9996 9.57463 12.9996 8.125C12.9996 6.67537 14.1751 5.5002 15.6246 5.5C17.0744 5.5 18.2496 6.67525 18.2496 8.125ZM13.2496 5.625C13.2496 7.41993 11.7946 8.875 9.99963 8.875C8.20488 8.8748 6.74963 7.4198 6.74963 5.625C6.74963 3.8302 8.20488 2.3752 9.99963 2.375C11.7946 2.375 13.2496 3.83007 13.2496 5.625Z"
          fill={color}
        />
      </svg>
    );
  }
);

IconUserGroupOutline.displayName = "IconUserGroupOutline";

export default IconUserGroupOutline;