Signup Form

User registration form with validation

SaaSAuth

Overview

SignupForm provides a complete user registration experience. It includes fields for name, email, password with confirmation, plan selection via radio buttons, terms of service acceptance, optional SSO provider buttons, loading states, and server error display.

Usage

import { SignupForm } from "@leanicon/web-builder-library/saas";

const plans = [
  { id: "free", name: "Free", price: "$0/mo", features: ["5 projects"] },
  { id: "pro", name: "Pro", price: "$29/mo", features: ["Unlimited projects"], recommended: true },
];

<SignupForm
  plans={plans}
  tosUrl="/terms"
  privacyUrl="/privacy"
  onSubmit={(data) => handleSignup(data)}
  isLoading={isSubmitting}
  error={signupError}
/>;

Variants

Default

With SSO

Or continue with

With Error

Loading State

Props

NameTypeDefaultRequiredDescription
onSubmit(data: SignupFormData) => void—Yes
plansSignupPlan[]—No
ssoProvidersSsoProvider[]—No
onSsoLogin((provider: SsoProvider) => void)—No
ssoLoadingProviderenum—No
tosUrlstring—No
privacyUrlstring—No
labelsSignupFormLabels—No
classNamestring—No
isLoadingbooleanfalseNo
errorstring—No