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.

​
env
enum
required

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

​
fields
object
required

The state of the hosted fields.

​
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.

​
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.

​
initError
object

Set when there is an initialization error.