​
Device Code Activation screen class

The Device Code Activation screen class provides methods associated with the device-code-activation screen. This screen is displayed when a user needs to enter a code on their device to activate it.
Import and instantiate the Device Code Activation screen class: 
import DeviceCodeActivation from '@auth0/auth0-acul-js/device-code-activation';
const deviceCodeActivationManager = new DeviceCodeActivation();

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

// SDK Methods return an array
deviceCodeActivationManager.continue({
  code: 'HXNL-XWMT',
});

​
Properties

The Device Code Activation screen class properties are: 
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 Device Code Activation screen class method is:

​
continue( options ?)

This method continues with the device code activation flow. 
import DeviceCodeActivation from '@auth0/auth0-acul-js/device-code-activation';
const deviceCodeActivationManager = new DeviceCodeActivation();

await deviceCodeActivationManager.continue({
  code: '123456',
});
Parameter                 TypeRequiredDescription
codestringYesThe code entered by the user.

​
Device Code Activation Allowed screen class

The Device Code Activation screen class provides methods associated with the device-code-activation-allowed screen. This screen is displayed when the device code activation is allowed.
Import and instantiate the Device Code Activation Allowed screen class: 
import DeviceCodeActivationAllowed from '@auth0/auth0-acul-js/device-code-activation-allowed';
const deviceCodeActivationAllowedManager = new DeviceCodeActivationAllowed();

​
Properties

The Device Code Activation Allowed screen class properties are: 
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>;
  };
}

​
Device Code Activation Denied screen class

The Device Code Activation screen class provides methods associated with the device-code-activation-denied screen. This screen is displayed when the device code activation is denied.
Import and instantiate the Device Code Activation Denied screen class: 
import DeviceCodeActivationDenied from '@auth0/auth0-acul-js/device-code-activation-denied';
const deviceCodeActivationDeniedManager = new DeviceCodeActivationDenied();

​
Properties

The Device Code Activation Denied screen class properties are: 
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>;
  };
}

​
Device Code Confirmation screen class

The Device Code Confirmation screen class provides methods associated with the device-code-confirmation screen. This screen is displayed when a user needs to confirm the device code.
Import and instantiate the Device Code Confirmation screen class: 
import DeviceCodeConfirmation from '@auth0/auth0-acul-js/device-code-confirmation';
const deviceCodeConfirmationManager = new DeviceCodeConfirmation();

​
Properties

The Device Code Confirmation screen class properties are: 
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 Device Code Confirmation screen class methods are:

​
cancel( options ?)

This method cancels the confirmation process. 
import DeviceCodeConfirmation from '@auth0/auth0-acul-js/device-code-confirmation';
const deviceCodeConfirmationManager = new DeviceCodeConfirmation();

const handleCancel = async () => {
  await deviceCodeConfirmationManager.cancel();
};

​
confirm( options ?)

This method confirms the code was successfully entered. 
import DeviceCodeConfirmation from '@auth0/auth0-acul-js/device-code-confirmation';
const deviceCodeConfirmationManager = new DeviceCodeConfirmation();

const handleConfirm = async () => {
  await deviceCodeConfirmationManager.confirm();
};