Lens Login Button

import { Button } from "@/registry/new-york/ui/button";
import { ComponentProps } from "react";

type ButtonProps = ComponentProps<typeof Button>;

type LoginButtonProps = {
  /**
   * The text to display on the button.
   * If not provided, "Log in with Lens" will be used.
   */
  text?: string;
};

export const LensLoginButton = ({ text = "Log in with Lens", ...props }: LoginButtonProps & ButtonProps) => (
  <Button {...props}>
    <svg fill="none" viewBox="0 0 64 64">
      <path
        fillRule="evenodd"
        d="M42.311 23.793c1.788-1.654 4.133-2.68 6.745-2.68 5.807.002 10.51 4.71 10.51 10.521 0 5.027-4.973 9.326-6.217 10.316-5.815 4.63-13.39 7.339-21.566 7.339-8.176 0-15.749-2.707-21.565-7.34C8.98 40.96 4 36.653 4 31.634c0-5.811 4.705-10.521 10.507-10.521 2.615 0 4.96 1.026 6.748 2.68l.185-.092c.408-5.422 4.817-9.7 10.343-9.7 5.527 0 9.935 4.278 10.344 9.7l.184.091v.002"
        clipRule="evenodd"
        fill="currentColor"
      />
    </svg>
    <span>{text}</span>
  </Button>
);