Auth

OAuth Buttons

"Continue with" buttons with built-in monochrome marks for Google, GitHub and Apple, a key for anything else, links or callbacks.
import { OAuthButtons } from "pleate/auth/oauth-buttons";

Stacked, in a row, custom provider

Props

providers

google, github and apple get a mark; others a key or your icon.

{ id, name, href?, icon? }[]

onSelect

Called on press (also before following an href).

(id) => void

loadingId

Spinner on that provider, others disabled.

string | null

layout

Rows, or side by side (icons only on phones with three or more).

"stack" | "row"default "stack"

size / disabled

Height and state.

"md" | "lg" / booleandefault "lg"

appearance

Gray capsules with Apple in black or white, or bordered capsules.

"filled" | "outline"default "filled"

labels.continueWith

Button text.

(name) => string

Accessibility

  • Icon-only buttons keep their full name ("Continue with Apple").
  • Marks are decorative and hidden from screen readers.