SocialAuthButton

A button that starts an OAuth sign-in: a click calls login on the auth provider with provider and a redirect, which the Supabase provider turns into signInWithOAuth. redirect defaults to the current URL, children replaces the label, and a failed sign-in shows an error notification. Each provider has a ready-made button (GithubButton, ...) with its icon and a translated label.

Installation

pnpm dlx shadcn@latest add @chelone/social-auth-button
Loading preview…

A button that starts an OAuth sign-in: a click calls login on the auth provider with provider and a redirect, which the Supabase provider turns into signInWithOAuth. redirect defaults to the current URL, children replaces the label, and a failed sign-in shows an error notification. Each provider has a ready-made button (GithubButton, ...) with its icon and a translated label.

Import

import { SocialAuthButton } from "@chelone/react/supabase";

See the Supabase pages guide for mounting the pages, the recovery flow, the provider buttons and the Vue slots.

Props

PropTypeDefaultDescription
asChildboolean—
childrenReactNode—
providerSupabaseOAuthProvider—
redirectstring—Where the provider sends the user back. Defaults to the current URL.
size"default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null—