import React from 'react';

/**
 * Renders the Site icon
 * @param {React.SVGProps<SVGSVGElement>} props - The props for the Site component
 * @returns {JSX.Element} - The Site component
 * @example
 * <Site />
 * @example
 * <Site height={24} width={24} />
 * @example
 * <Site className="custom-class" />
 */
export default function Site({ isDecorative, ...props }: { isDecorative: boolean } & React.SVGProps<SVGSVGElement>) {
  return (
    <svg fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" {...props}>
      <circle cx="12" cy="12" fill="#cce2f5" r="10.5" stroke="#7db4e3" />
      <path
        d="m19.5 12c0 2.9434-.8684 5.5878-2.2475 7.4841-1.3795 1.8968-3.2427 3.0159-5.2525 3.0159-2.00976 0-3.87299-1.1191-5.25249-3.0159-1.37913-1.8963-2.24751-4.5407-2.24751-7.4841 0-2.94337.86838-5.58777 2.24751-7.48409 1.3795-1.8968 3.24273-3.01591 5.25249-3.01591 2.0098 0 3.873 1.11911 5.2525 3.01591 1.3791 1.89632 2.2475 4.54072 2.2475 7.48409z"
        fill="#cce2f5"
        stroke="#7db4e3"
      />
      <path
        d="m14.5 12c0 3.0063-.3329 5.7099-.8611 7.6466-.265.9719-.5718 1.7223-.8914 2.218-.334.5181-.5981.6354-.7475.6354s-.4135-.1173-.7475-.6354c-.3196-.4957-.6264-1.2461-.8914-2.218-.52822-1.9367-.8611-4.6403-.8611-7.6466 0-3.00626.33288-5.70993.8611-7.64662.265-.97192.5718-1.72231.8914-2.21799.334-.51806.5981-.63539.7475-.63539s.4135.11733.7475.63539c.3196.49568.6264 1.24607.8914 2.21799.5282 1.93669.8611 4.64036.8611 7.64662z"
        fill="#cce2f5"
        stroke="#7db4e3"
      />
      <g fill="#7db4e3">
        <path d="m2 14h20v1h-20z" />
        <path d="m2 9h20v1h-20z" />
        <path d="m5 4 2.5-1-.5 1h10l-.5-1 2.5 1 .5 1h-15z" />
        <path d="m4 19h16l-.5 1-3 1 .5-1h-10l.5 1-3-1z" />
      </g>
      {!isDecorative && <title>site icon</title>}
    </svg>
  );
}