Belvo Payments Atoms

Belvo Payments Atoms is a library that provides a set of native web components that aims to facilitate integrating with Belvo’s Payments Widget.

Storybook View it on GitHub

---

Examples

React

• Code
• Live

Next.js

• Code
• Live

Getting started

Installation

npm install @belvo/payments-atoms

Initialization

Add a default import from @belvo/payments-atoms and call its init function with a callback so you’re able to retrieve the selected payer institution. For example:

import BelvoPaymentsAtoms from '@belvo/payments-atoms'

BelvoPaymentsAtoms.init({
  bankShortcuts: {
    // This callback is executed when the user selects a bank.
    // It returns the payer institution, containing its id, display_name and icon_logo.
    callback: (payerInstitution) => setPayerInstitutionId(payerInstitution.id),
  },
})

Usage Example

Once initialized, simply add the desired web component wherever you wish in your web application.

<belvo-payments-grid />

License

Belvo Payments Atoms is distributed by an MIT license.

Contributing

If you wish to contribute to this repository, you can read more about how to do so in our GitHub repository.

Code of Conduct

Check out our Code of Conduct in our GitHub repository.