import type { ComponentPropsWithRef } from "react"

/**
 * Renders a LinkedIn brand icon as an SVG and forwards given SVG props to the root element.
 *
 * @param props - SVG attributes, event handlers, and refs applied to the root <svg>
 * @returns The LinkedIn SVG element
 */
export function LinkedIn(props: ComponentPropsWithRef<"svg">) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 256 256"
      role="img"
      aria-label="LinkedIn"
      {...props}
    >
      <g fill="none">
        <rect width={256} height={256} fill="#fff" rx={60}></rect>
        <rect width={256} height={256} fill="#0a66c2" rx={60}></rect>
        <path
          fill="#fff"
          d="M184.715 217.685h29.27a4 4 0 0 0 4-3.999l.015-61.842c0-32.323-6.965-57.168-44.738-57.168c-14.359-.534-27.9 6.868-35.207 19.228a.32.32 0 0 1-.595-.161V101.66a4 4 0 0 0-4-4h-27.777a4 4 0 0 0-4 4v112.02a4 4 0 0 0 4 4h29.268a4 4 0 0 0 4-4v-55.373c0-15.657 2.97-30.82 22.381-30.82c19.135 0 19.383 17.916 19.383 31.834v54.364a4 4 0 0 0 4 4M38 59.628c0 11.864 9.767 21.626 21.632 21.626c11.862-.001 21.623-9.769 21.623-21.631C81.253 47.761 71.491 38 59.628 38C47.762 38 38 47.763 38 59.627m6.959 158.058h29.307a4 4 0 0 0 4-4V101.66a4 4 0 0 0-4-4H44.959a4 4 0 0 0-4 4v112.025a4 4 0 0 0 4 4"
        ></path>
      </g>
    </svg>
  )
}