SignupId

Describes all the properties and methods available to customize the Universal Login SignupId screen.

The SignupId class implements the signup-id screen functionality. This screen collects the user’s identifier.

Constructors

Create an instance of SignupId screen manager:

Example

import SignupId from '@auth0/auth0-acul-js/signup-id';
const signupIdManager = new SignupId();
signupIdManager.signup({
  email: '[e-mail]',
});

Properties

branding · BrandingMembers

Provides branding-related configurations, such as branding theme and settings.

client · ClientMembers

Provides client-related configurations, such as id, name, and logoUrl, for the signup-id screen.

organization · OrganizationMembers

Provides information about the user’s Organization, such as id and name.

prompt · PromptMembers

Contains data about the current prompt in the authentication flow.

screen · ScreenMembersOnSignupId

Contains details specific to the signup-id screen, including its configuration and context.

tenant · TenantMembers

Contains data related to the tenant, such as id and associated metadata.

transaction · TransactionMembersOnSignupId

Provides transaction-specific data, such as active identifiers and flow states.

untrustedData · UntrustedDataMembers

Handles untrusted data passed to the SDK, such as user input during login.

user · UserMembers

Details of the active user, including username, email, and roles.

Methods

changeLanguage · Promise<void>

This method changes the display language of the Universal Login page.

Example

import SignupId from '@auth0/auth0-acul-js/signup-id';
const signupIdManager = new SignupId();
signupIdManager.changeLanguage({
  language: 'fr',
});

Method Parameters

Show Parameters

options · LanguageChangeOptions

language · string · required

The locale code for the desired language (for example, 'en', 'fr', 'es').

persist? · "session"

When set to 'session', the selected language persists for the duration of the session.

[`key`: `string`] · "string" | "number" | "boolean" | "undefined"

Additional custom fields prefixed with ulp- (for example, 'ulp-custom-field').

---

federatedSignup · Promise<void>

This method handles allows signup via different social identifiers. For example: Google, Facebook, etc.

Example

import SignupId from '@auth0/auth0-acul-js/signup-id';
const signupIdManager = new SignupId();
signupIdManager.federatedSignup({
  connection: 'google-oauth2',
});

Method Parameters

Show Parameters

options · FederatedSignupOptions

connection · string · required

The social connection name to use.

[`key`: `string`] · "string" | "number" | "boolean" | "undefined"

Additional data collected from the user.

---

getErrors · Error []

This method retrieves the array of transaction errors from the context, or an empty array if none exist. An array of error objects from the transaction context.

getSignupIdentifiers · Identifier [] | null

This method returns the list of enabled identifiers for the signup-id form, marking each as required or optional based on transaction config. An array of identifier objects (for example: email, phone, username).

Example

import SignupId from '@auth0/auth0-acul-js/signup-id';
const signupIdManager = new SignupId();
const identifiers = signupIdManager.getSignupIdentifiers();
// [{ type: 'email', required: true }, { type: 'username', required: false }]

pickCountryCode · Promise<void>

This method redirects the user to the country code selection list, where they can update the country code prefix for their phone number.

Example

import SignupId from '@auth0/auth0-acul-js/signup-id';
const signupIdManager = new SignupId();
signupIdManager.pickCountryCode();

signup · Promise<void>

This method handles signup-id related configuration. It allows signing up new users via different identifiers.

Example

import SignupId from '@auth0/auth0-acul-js/signup-id';
const signupIdManager = new SignupId();
signupIdManager.signup({
  email: '[e-mail]',
});

Method Parameters

Show Parameters

options · SignupOptions

email? · string

The user’s email.

username? · string

The user’s identifier.

phone? · string

The user’s phone number.

captcha? · string

The captcha code or response from the captcha provider. This property is required if your Auth0 tenant has Bot Detection enabled.

[`key`: `string`] · "string" | "number" | "boolean" | "undefined"

Additional data collected from the user.

---

validateUsername · UsernameValidationResult

This method validates a given username against the current username policy defined in the transaction context. It returns an object indicating whether the username is valid and why.

Example

import SignupId from '@auth0/auth0-acul-js/signup-id';
const signupIdManager = new SignupId();
const result = signupIdManager.validateUsername('myusername');
// result => { valid: true, errors: [] }

Method Parameters

Show Parameters

username · string · required

The username string to validate.