Components
<SignUpForm />
Feature-rich Sign Up form with support for various registration methods and built-in validation.
The <SignUpForm /> component provides a seamless registration flow for your users, supporting fields for names, email, and password.
Installation
pnpm dlx shadcn@latest add https://stackproviders.github.io/better-auth-ui/r/auth.jsonnpx shadcn@latest add https://stackproviders.github.io/better-auth-ui/r/auth.jsonyarn dlx shadcn@latest add https://stackproviders.github.io/better-auth-ui/r/auth.jsonbun x shadcn@latest add https://stackproviders.github.io/better-auth-ui/r/auth.jsonUsage
import { SignUpForm } from "@/components/auth/forms/sign-up-form";
export default function SignUpPage() {
return (
<div className="flex justify-center items-center min-vh-100">
<SignUpForm />
</div>
);
}Reference
| Prop | Type | Default |
|---|---|---|
passwordValidation? | PasswordValidation | - |
setIsSubmitting? | ((value: boolean) => void) | - |
redirectTo? | string | - |
localization | Partial<Partial<{ INVALID_USERNAME_OR_PASSWORD: string; EMAIL_NOT_VERIFIED: string; UNEXPECTED_ERROR: string; USERNAME_IS_ALREADY_TAKEN: string; USERNAME_TOO_SHORT: string; USERNAME_TOO_LONG: string; ... 358 more ...; UNKNOWN: string; }>> | - |
isSubmitting? | boolean | - |
callbackURL? | string | - |
classNames? | AuthFormClassNames | - |
className? | string | - |
Examples
Hidden Name Fields
<SignUpForm disableName />Custom Navigation
<SignUpForm redirectTo="/welcome" loginUrl="/auth/login" />