import type { ComponentPropsWithRef } from "react"

/**
 * Renders the Dropbox logo as an SVG element.
 *
 * @param props - Props to apply to the root `<svg>` element; all props are forwarded to the SVG.
 * @returns An SVG element containing the Dropbox logo
 */
export function Dropbox(props: ComponentPropsWithRef<"svg">) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 256 218"
      role="img"
      aria-label="Dropbox"
      {...props}
    >
      <path
        fill="#0061ff"
        d="M63.995 0L0 40.771l63.995 40.772L128 40.771zM192 0l-64 40.775l64 40.775l64.001-40.775zM0 122.321l63.995 40.772L128 122.321L63.995 81.55zM192 81.55l-64 40.775l64 40.774l64-40.774zM64 176.771l64.005 40.772L192 176.771L128.005 136z"
      />
    </svg>
  )
}
