The State Object - Confido Legal Docs

Example

{
  activeForm: 'card',
  cardData: {
      bin: '424242',
      cardType: 'credit',
      brand: 'visa',
  },
  env: 'sandbox',
  fields: {
      cardNumber: {
          containerId: 'card-number',
          loading: false,
          error: null,
      },
      cardExpirationDate: {
          containerId: 'card-expiration-date',
          loading: false,
          error: null,
      },
      cardSecurityCode: {
          containerId: 'card-security-code',
          loading: false,
          error: null,
      },
      accountNumber: {
          containerId: 'account-number',
          loading: false,
          error: null,
      },
      routingNumber: {
          containerId: 'routing-number',
          loading: false,
          error: null,
      },
      accountHolderName: {
          containerId: 'account-holder-name',
          loading: false,
          error: null,
      },
  },
  initializing: false,
  isSubmitting: false,
  paymentLink?: PaymentLink;
  paymentMethod?: PaymentMethod;
  sessionType: SessionType;
  surcharging: {
      active: true,
      willBeApplied: true,
  }

The state object represents the internal state of the fields. The current state is included on every change event.

You can also always call the getState() method to retrieve the current state of the fields.

const currentState = window.confidoHostedFields.getState();

Props

activeForm

string

required

The current active form. This can be either card or ach. The active form determines which fields are loaded.

cardData

object

Information about the card number that was entered. This is only populated when the activeForm is card and the card number field has been filled.

Show child attributes

bin

string

The first six digits of the card number that was entered.

cardType

enum

The type of card that was entered. This can be either credit or debit.

brand

enum

The card brand that was entered, such as visa, mastercard, etc.

env

enum

required

The processing environment. This can be either sandbox or production.

fields

object

required

The state of the hosted fields.

Show child attributes

cardNumber

FieldState

The state of the card number field.

Show child attributes

containerId

string

required

The ID of the container element where the card number field is rendered.

boolean

`true` if the field is still loading.

error

Error

This will be set when the field has a validation error.

cardExpirationDate

FieldState

The state of the card expiration date field.

Show child attributes

containerId

string

required

The ID of the container element where the card number field is rendered.

boolean

`true` if the field is still loading.

error

Error

This will be set when the field has a validation error.

cardSecurityCode

FieldState

The state of the card security code field.

Show child attributes

containerId

string

required

The ID of the container element where the card number field is rendered.

boolean

`true` if the field is still loading.

error

Error

This will be set when the field has a validation error.

accountNumber

FieldState

The state of the account number field.

Show child attributes

containerId

string

required

The ID of the container element where the card number field is rendered.

boolean

`true` if the field is still loading.

error

Error

This will be set when the field has a validation error.

routingNumber

FieldState

The state of the routing number field.

Show child attributes

containerId

string

required

The ID of the container element where the card number field is rendered.

boolean

`true` if the field is still loading.

error

Error

This will be set when the field has a validation error.

accountHolderName

FieldState

The state of the account holder name field.

Show child attributes

containerId

string

required

The ID of the container element where the card number field is rendered.

boolean

`true` if the field is still loading.

error

Error

This will be set when the field has a validation error.

initializing

boolean

required

true when the sdk is still initializing.

isSubmitting

boolean

required

true after sdk.submitFields() is called and before the fields are done submitting their data.

paymentLink

object

The payment link object, if applicable.

Show child attributes

string

required

The unique identifier for the payment link.

amounts

object[]

required

The amounts associated with the payment link.

Show child attributes

amount

number

required

The amount in cents.

bankAccountCat

string

required

The category of the bank account, e.g., trust, operating.

maxAchPayment

number

required

The maximum ACH payment amount in cents. You should use this to show a warning if your amount is over this limit.

paymentMethod

string

This indicates the payment method for the transaction. When activeForm is ach, this will be ACH. When activeForm is card, this will be either CREDIT or DEBIT depending on the card type. Possible values are: ACH | CREDIT | DEBIT

sessionType

string

required

The type of session. Possible values are: payment | save_payment_method

surcharging

object

required

Surcharging information. This is only applicable when the activeForm is card. It provides details about whether surcharging is active, the rate, and whether it will be applied.

Show child attributes

active

boolean

required

Whether surcharging is active.

willBeApplied

boolean

required

Whether the surcharge rate will be applied or not. If surcharging is enabled by the firm, this will show as true when the cardNumber field has been filled out and the bin_loaded event has been produced by the form.

rate

number

The surcharge rate that will be multiplied by the amount and added to the payment.

initError

object

Set when there is an initialization error.

Show child attributes

message

string

required

The error message describing the initialization error.

Submitting the Fields

Example

{
  activeForm: 'card',
  cardData: {
      bin: '424242',
      cardType: 'credit',
      brand: 'visa',
  },
  env: 'sandbox',
  fields: {
      cardNumber: {
          containerId: 'card-number',
          loading: false,
          error: null,
      },
      cardExpirationDate: {
          containerId: 'card-expiration-date',
          loading: false,
          error: null,
      },
      cardSecurityCode: {
          containerId: 'card-security-code',
          loading: false,
          error: null,
      },
      accountNumber: {
          containerId: 'account-number',
          loading: false,
          error: null,
      },
      routingNumber: {
          containerId: 'routing-number',
          loading: false,
          error: null,
      },
      accountHolderName: {
          containerId: 'account-holder-name',
          loading: false,
          error: null,
      },
  },
  initializing: false,
  isSubmitting: false,
  paymentLink?: PaymentLink;
  paymentMethod?: PaymentMethod;
  sessionType: SessionType;
  surcharging: {
      active: true,
      willBeApplied: true,
  }

Hosted Fields

​Props

Props