Social Auth Button

npx shadcn@latest add https://ui.saasflare.io/r/social-auth-button.json

pnpm add @saasflare/ui

"use client"import { SocialAuthButton, SOCIAL_AUTH_PROVIDERS } from "@saasflare/ui"/** * Every supported identity provider — mapped from `SOCIAL_AUTH_PROVIDERS`. * Sixteen branded buttons, no per-provider wiring beyond the `provider` prop. */export function Demo() {    return (        <div className="grid w-full grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3">            {SOCIAL_AUTH_PROVIDERS.map((provider) => (                <SocialAuthButton key={provider} provider={provider} fullWidth />            ))}        </div>    )}

"use client"import {    GoogleAuthButton,    GitHubAuthButton,    SocialAuthButton,} from "@saasflare/ui"/** * Provider-branded auth buttons: the default "Continue with {Provider}" label, * a pending button via `loading`, and the brand-locked `colorful` icon weight. */export function Demo() {    return (        <div className="flex w-full max-w-xs flex-col gap-3">            <GoogleAuthButton fullWidth />            <GitHubAuthButton fullWidth />            <SocialAuthButton                provider="github"                iconWeight="colorful"                loading                loadingText="Connecting…"                fullWidth            />        </div>    )}