showProfileEditor

client.showProfileEditor({
  container: HTMLElement|id,
  accessToken: string,
  fields: Field[],
  // Optional arguments
  showLabels: boolean,
  countryCode: string,
  redirectUrl: string,
  onReady: function,
  onSuccess: function,
  onError: function,
  theme: object,
  i18n: object,
})

Description

Show the widget allowing the current profile to edit his data.

Examples

import { ErrorResponse } from '@reachfive/identity-ui'

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

// The SMS feature is disabled on the ReachFive account
client.showProfileEditor({
    container: 'profile-editor-container',
    accessToken,
    fields: [
        'given_name',
        'family_name',
        'phone_number',
        'gender',
        'birthdate',
        'consents.newsletter',
        'custom_fields.loyalty_card_number'
    ],
    showLabels: true,
    countryCode: 'US',
    onReady: instance => {
      // Destroy the widget
      // if (...) instance.destroy()
    },
    onSuccess: () => {
        console.log("Profile updated with success!")
    },
    onError: (error: ErrorResponse) => {
        console.error(error)
    },
    theme: {
        primaryColor: '#274890',
        borderRadius: '#374890'
    },
    i18n: {
        'save': 'Save your profile\'s data'
    }
})

Widget

showProfileEditor

Options

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.

fields Field[]

List of the fields to display in the form.

The following fields can not be changed with this widget:

  • password

  • password_confirmation

It is not possible to update the primary identifier submitted at registration (email or phone number). When the primary identifier is the email address (SMS feature disabled), users can only enter a phone number and update without limit.

showLabels boolean

Whether the signup form fields' labels are displayed on the login view.

Defaults to false.

countryCode string

The ISO country code useful to format phone numbers.

Defaults to the predefined country code in your account settings or FR.

redirectUrl string

In the email of the email address validation, the validation link will redirect to this URL.

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.

onSuccess function

Callback function called when the request was successful.

onError function

Callback function called when the request has failed.

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. Can be used to make circle social login button with inline used.

Default to 3.

socialButton object

Social button theming options.

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.