container: HTMLElement|id,
  accessToken: string,
  // Optional arguments
  providers: string[],
  auth: string[],
  onReady: function,
  theme: object,
  i18n: object,


Show the widget allowing the current profile to manage the social logins linked to his account.


const accessToken = // Here paste the authorization token of the profile retrieved after login

  container: 'social-accounts-container',
  providers: ['facebook', 'google'],
  auth: {
      redirectUri: ''
  theme: {
      primaryColor: '#274890',
      borderRadius: '25',
      socialButton: {
        inline: true
  i18n: {
      'socialAccounts.linkNewAccount': 'Link a new account'


showSocialAccounts noProviders
showSocialAccounts configuredProviders


container HTMLElement id

The DOM element or the id of a DOM element in which the widget should be embedded.

accessToken function

The profile’s access token.

providers string[]

List of the available social providers.

Defaults to all configured providers in your account settings.

auth object

List of authentication options

responseType string

The desired OAuth2 grant type. Use code to request an authorization code (recommended) or token for a token set (implicit grant, discouraged).

Defaults to code when redirectUri is provided, and to token otherwise. For messenger account linking, responseType should be set to messenger_code.

redirectUri string

The URL where the user will be redirected back to after authentication.

This value is required with code response type and defaults to the current page with token response type. For messenger account linking, redirectUri should be set with the redirect_uri query param provided by Facebook on URL.

state string

Persist data between user being directed to the authorization server and back again.

Use case: help mitigate CSRF attacks or indicating which app’s pages to redirect to after authorization. Could be Base64 encoded JSON object, JWT or nonce.

prompt string

Specify whether the social provider should explicitly prompt the user for reauthentication or consent.

The defined values are:

  • none: Require that no user interaction take place. This is typically used to silenty check for existing authentication and/or consent.

  • login: The social provider should prompt the user for reauthentication before consent, otherwise an error must be returned to the client (login_required).

  • consent: The social provider should prompt for consent, otherwise an error must be returned to the client (consent_required).

  • select_account: The social provider should prompt for user account selection, and if account selection is impossible, return an error (account_selection_required).

nonce string

String value used to associate a local session with an ID Token, and to mitigate replay attacks. The value is passed through unmodified to the ID Token.

popupMode boolean

Whether to use popup mode.

Defaults to false.

This mode is not recommended due to known bugs in Android or Firefox in iOS.

origin string

Free text parameter describing the source of the login (only for reporting purposes).

scope string[]

List of space-delimited, case-sensitive strings representing the requested scope.

Optional if the fetchBasicProfile option is set to true and the profile, email, phone and openid scope values are allowed in client configuration.

fetchBasicProfile boolean

Fetch user’s basic profile information when they sign in. Adds profile, email, phone and openid to the requested scopes.

Defaults to true.

accessToken string

Enables social login linking to an existing account with a fresh token (less than 5 minutes old).

providerScope string

List of space-delimited, case-sensitive strings representing the requested scope at the social provider.

Defaults to the scope configured for the given provider in your ReachFive console.

Only for login with social provider.

requireRefreshToken boolean

If set to true, an OAuth 2.0 Refresh Token will be present in the token response.

Defaults to false.

Fetch user basic profile information when they sign in. Adds profile, email, phone and openid to the requested scope.

Refresh Tokens are only available in confidential Clients (with a configured authentication method) or for public Clients that enforce PKCE in the authorization code grant. The Refresh Token option must also be selected.

onReady function

Callback function called after the widget has been successfully loaded and rendered inside the container. The callback is called with the widget instance.

theme object

The options to set up to customize the appearance of the widget.

primaryColor string

The button and link default color.

Default to #229955.

borderRadius string

The radius of the social login button and other input (in px).

This can be used to make inline and/or circle social login buttons.

Default to 3.

socialButton object

Social button theming options.

  • inline- Boolean that specifies if the buttons are inline (horizonally-aligned).

  • textVisible - Boolean that specifies if the text is visible.

  • fontWeight - Specifies the font-weight (such as normal, bold, or 900).

  • fontSize - Specifies the font-size.

  • lineHeight - Specifies the line-height.

  • paddingX - Specifies the padding for the x axis. (left and right)

  • paddingY - Specifies the padding for the y axis. (top and bottom)

  • borderRadius - Specifies the border-radius.

  • borderWidth - Specifies the border-width.

  • focusBoxShadow - Boolean that specifies if there is a box shadow on the button or not.

i18n object

Widget labels and error messages to override. Falls back to the default wordings in en, fr, es, it and nl.

For example, you might re-word the socialAccounts.linkNewAccount or change the way other wordings display to the user while leaving the remaining text on the widget intact.