Better Auth UI

The AdditionalFields interface allows you to define custom fields for your authentication flow such as signup or user settings.

Usage

You can configure additionalFields like this:

<AuthUIProvider
  authClient={authClient}
  additionalFields={{
    age: {
      label: "Age",
      placeholder: "Your age",
      description: "Enter your age",
      required: true,
      type: "number"
    },
    newsletter: {
      label: "Newsletter Opt-In",
      description: "Subscribe to the newsletter",
      required: false,
      type: "boolean",
    }
  }}
>
  {children}
</AuthUIProvider>

AdditionalField

Prop	Type	Default
`description?`	`any`	-
`instructions?`	`any`	-
`label`	`ReactNode`	-
`placeholder?`	`string`	-
`required?`	`boolean`	-
`type`	`FieldType`	-
`validate?`	`(value: string) => Promise<boolean>`	-

AdditionalFields

Usage

AdditionalField

On this page