Multi-Factor Authentication screen classes

MFA Begin Enroll Options screen class

The MFA Begin Enroll Options screen class handles the selection and enrollment of MFA factors.

Import and instantiate the MFA Begin Enroll Options screen class:

import MfaBeginEnrollOptions from "@auth0/auth0-acul-js/mfa-begin-enroll-options";
const mfaBeginEnrollOptionsManager = new MfaBeginEnrollOptions();

// SDK Properties return a string, number or boolean
// ex. "login-id"
mfaBeginEnrollOptionsManager.screen.name;

// SDK Methods return an object or array
// ex. { signup: "/signup_url", reset_password: "/reset_password_url"} 
mfaBeginEnrollOptionsManager.enroll();

Properties

The MFA Begin Enroll Options screen class properties are:

branding

interface branding {
  settings: null | BrandingSettings;
  themes: null | BrandingThemes;
}

interface BrandingSettings {
  colors?: {
    pageBackground?: string | {
      angleDeg: number;
      end: string;
      start: string;
      type: string;
    };
    primary?: string;
  };
  faviconUrl?: string;
  font?: {url: string;};
  logoUrl?: string;
}

interface BrandingThemes {
  default: {
    borders: Record<string, string | number | boolean>;
    colors: Record<string, string>;
    displayName: string;
    fonts: Record<string, string | boolean | object>;
    pageBackground: Record<string, string>;
    widget: Record<string, string | number>;
  };
}

Methods

The MFA Begin Enroll Options screen class method is:

enroll( options ?)

This method continues the enrollment process with the selected MFA option.

const mfaBeginEnrollOptions = new MfaBeginEnrollOptions();
await mfaBeginEnrollOptions.enroll({
  action: 'push-notification'
});

Parameter	Type	Required	Description
action	FactorType: | push-notification | otp | sms | phone | voice | webauth-roaming	Yes	The selected multi-factor authentication option.
[key: string]	string | number | boolean | undefined	No	Additional data collected from the user.

MFA Detect Browser Capabilities screen class

The MFA Detect Browser Capabilities screen class detects browser capabilities for MFA authentication methods.

Import and instantiate the MFA Detect Browser Capabilities screen class:

import MfaDetectBrowserCapabilities from "@auth0/auth0-acul-js/mfa-detect-browser-capabilities";

const mfaDetectBrowserCapabilitiesManager = new MfaDetectBrowserCapabilities();

// SDK Properties return a string, number or boolean
// ex. "login-id"
mfaDetectBrowserCapabilitiesManager.screen.name;

// SDK Methods return an object or array
// ex. { signup: "/signup_url", reset_password: "/reset_password_url"} 
mfaDetectBrowserCapabilitiesManager.detectCapabilities();

Properties

The MFA Detect Browser Capabilities screen class properties are:

branding

interface branding {
  settings: null | BrandingSettings;
  themes: null | BrandingThemes;
}

interface BrandingSettings {
  colors?: {
    pageBackground?: string | {
      angleDeg: number;
      end: string;
      start: string;
      type: string;
    };
    primary?: string;
  };
  faviconUrl?: string;
  font?: {url: string;};
  logoUrl?: string;
}

interface BrandingThemes {
  default: {
    borders: Record<string, string | number | boolean>;
    colors: Record<string, string>;
    displayName: string;
    fonts: Record<string, string | boolean | object>;
    pageBackground: Record<string, string>;
    widget: Record<string, string | number>;
  };
}

Methods

The MFA Detect Browser Capabilities screen class method is:

detectCapabilities( options ?)

This method allows you to select an authenticator based on browser capabilities.

const mfaDetectBrowserCapabilities = new MfaDetectBrowserCapabilities();
await mfaDetectBrowserCapabilities.detectCapabilities();

Parameter	Type	Required	Description
[key: string]	string | number | boolean | undefined	No	Optional data collected from user.

MFA Enroll Result screen class

The MFA Enroll Result screen class allows users to select an enrolled email address for MFA.

Import and instantiate the MFA Enroll Result screen class:

import MfaEnrollResult from '@auth0/auth0-acul-js/mfa-enroll-result';
const mfaEnrollResult = new MfaEnrollResult();

// SDK Properties return a string, number or boolean
mfaEnrollResult.screen.name;

Properties

The MFA Enroll Result screen class properties are:

branding

interface branding {
  settings: null | BrandingSettings;
  themes: null | BrandingThemes;
}

interface BrandingSettings {
  colors?: {
    pageBackground?: string | {
      angleDeg: number;
      end: string;
      start: string;
      type: string;
    };
    primary?: string;
  };
  faviconUrl?: string;
  font?: {url: string;};
  logoUrl?: string;
}

interface BrandingThemes {
  default: {
    borders: Record<string, string | number | boolean>;
    colors: Record<string, string>;
    displayName: string;
    fonts: Record<string, string | boolean | object>;
    pageBackground: Record<string, string>;
    widget: Record<string, string | number>;
  };
}

MFA Login Options screen class

The MFA Login Options screen class allows users to select which MFA factor to use for login.

Import and instantiate the MFA Login Options screen class:

import MfaLoginOptions from '@auth0/auth0-acul-js/mfa-login-options';
const mfaLoginOptions = new MfaLoginOptions();

// SDK Properties return a string, number or boolean
mfaLoginOptions.screen.name;

// SDK Methods return an object or array
await mfaLoginOptions.enroll({
  action: 'push-notification'
});

Properties

The MFA Login Options screen class properties are:

branding

interface branding {
  settings: null | BrandingSettings;
  themes: null | BrandingThemes;
}

interface BrandingSettings {
  colors?: {
    pageBackground?: string | {
      angleDeg: number;
      end: string;
      start: string;
      type: string;
    };
    primary?: string;
  };
  faviconUrl?: string;
  font?: {url: string;};
  logoUrl?: string;
}

interface BrandingThemes {
  default: {
    borders: Record<string, string | number | boolean>;
    colors: Record<string, string>;
    displayName: string;
    fonts: Record<string, string | boolean | object>;
    pageBackground: Record<string, string>;
    widget: Record<string, string | number>;
  };
}

Methods

The MFA Login Options screen class method is:

enroll( options ?)

This method continues the login process with the selected MFA option.

const mfaLoginOptions = new MfaLoginOptions();
await mfaLoginOptions.enroll({
  action: 'push-notification'
});

Parameter	Type	Required	Description
action	LoginFactorType: | push-notification | otp | sms | phone | voice | email | recovery-code | webauthn-platform | webauth-roaming | duo	Yes	The selected multi-factor authentication option to login.
[key: string]	string | number | boolean | undefined	No	Additional data collected from the user.