Skip to contentSkip to content

SignUpPage API

API reference docs for the React SignUpPage component. Learn about the props, CSS, and other APIs of this exported module.

Demos

Import

import { SignUpPage } from '@toolpad/core/SignUpPage';
// or
import { SignUpPage } from '@toolpad/core';

Learn about the difference by reading this guide on minimizing bundle size.

Props

NameTypeDefaultDescription
localeTextobject-

The labels for the account component.

providersArray<{ id: string, name: string }>[]

The list of authentication providers to display.

signUpfuncundefined

Callback fired when a user signs up.

Signature:function(provider: AuthProvider, formData: FormData, callbackUrl: string) => void | Promise
  • provider The authentication provider.
  • formData The form data if the provider id is 'credentials'.\
  • callbackUrl The URL to redirect to after signing up.
slotProps{ confirmPasswordField?: object, emailField?: object, form?: object, oAuthButton?: object, passwordField?: object, privacyLink?: object, submitButton?: object, termsLink?: object }{}

The props used for each slot inside.

slots{ confirmPasswordField?: elementType, emailField?: elementType, passwordField?: elementType, privacyLink?: string, submitButton?: elementType, subtitle?: elementType, termsLink?: string, title?: elementType }{}

The components used for each slot inside.

See Slots API below for more details.

sxArray<func
| object
| bool>
| func
| object
-

The prop used to customize the styles on the SignUpPage container

See the `sx` page for more details.

The component cannot hold a ref.

Slots

Slot nameClass nameDefault componentDescription
emailFieldTextFieldThe custom email field component used in the credentials form.
passwordFieldTextFieldThe custom password field component used in the credentials form.
confirmPasswordFieldTextFieldThe custom confirm password field component used in the credentials form.
submitButtonButtonThe custom submit button component used in the credentials form.
titleTypographyA component to override the default title section
subtitleTypographyA component to override the default subtitle section

Source code

If you did not find the information in this page, consider having a look at the implementation of the component for more detail.