Forms

Input fields, sign-in forms, and form components

Sign In Form

Complete sign-in form with email and password inputs, forgot password link, and sign-up option. Includes validation, loading states, and error handling.

Sign In

Access your Mighty membership and exclusive offers.

Forgot password
Don't have an account? Sign up
<SignInForm
  onSignIn={async (email, password) => {
    await authService.signIn(email, password)
  }}
  onForgotPassword={() => router.push('/forgot-password')}
  onSignUp={() => router.push('/sign-up')}
  isLoading={isLoading}
  error={error}
/>

Sign In Props

type SignInFormProps = {
  onSignIn?: (email: string, password: string) => void | Promise<void>
  onForgotPassword?: () => void
  onSignUp?: () => void
  isLoading?: boolean
  error?: string
  className?: string
}

Sign Up Form

Complete sign-up form with first name, last name, email, and password inputs. Includes validation (minimum 8 characters for password), loading states, and error handling.

Create Your Account

Access exclusive Mighty membership benefits.

Already have an account? Sign in
<SignUpForm
  onSignUp={async (firstName, lastName, email, password) => {
    await authService.signUp(firstName, lastName, email, password)
  }}
  onSignIn={() => router.push('/sign-in')}
  isLoading={isLoading}
  error={error}
/>

Sign Up Props

type SignUpFormProps = {
  onSignUp?: (firstName: string, lastName: string, email: string, password: string) => void | Promise<void>
  onSignIn?: () => void
  isLoading?: boolean
  error?: string
  className?: string
}