collect-africa-js
TypeScript icon, indicating that this package has built-in type declarations

1.1.2 • Public • Published

Collect Widget - JavaScript SDK

JS library for implementing the Collect widget - CollectWidgetJS is a safe and secure web drop-in module and this library provides a front-end web with ability to make payment for each bank that Collect [supports].

Try the demo

Checkout the widget flow to view how the Collect Widget works. Click "See How it Works"

Before getting started

  • Retrieve your Client Public API Keys.
  • Create a sandbox customer, so you can get connecting immediately.

Installing

Using npm:

$ npm install collect-africa-js

Using yarn:

$ yarn add collect-africa-js

Using CDN:

<script src="https://cdn.collect.africa/collect-africa.js"></script>

Usage

For JS frameworks import it and use

import CollectCheckoutService from 'collect-africa-js';

For others, just use

const checkout = new CollectCheckoutService({
  email: 'peterparker@gmail.com',
  firstName: 'Peter',
  lastName: 'Parker',
  reference: 'XXXXX-XXXXX',
  amount: 1000000, // in Kobo
  currency: 'NGN', // NGN
  itemImage: '', // URL for item image
  paymentLinkCode: '', // Payment link code
  invoiceCode: '', // Invoice code
  planCode: '', // Plan code
  publicKey: 'pk_sandbox_XXXXXXXXXX', // Your public key
  onSuccess(e) {
    console.log('payment successful.', e);
  },
  onClose(e) {
    console.log('closed the widget.', e);
  },
});

checkout.setup();
checkout.open();

CollectWidget Options

Name Type Required Default Value Description
email String true Email address.
firstName String true First name.
lastName String false Last name.
reference String true Unique transaction reference
amount Number true Amount to charge.
currency String false NGN Processing currency
itemImage String(URL) false URL for item image
publicKey String true The Collect public api key.
paymentLinkCode String false The payment link code.
invoiceCode String false The invoice code.
planCode String false The plan code.
logo String(URL) false Collect's Logo
callbackUrl String(URL) false
onSuccess Function false Action to perform after widget is successful
onClose Function false Action to perform if widget is closed
onError Function false Action to perform on widget Error
beforeClose Function false Action to perform before widget close

Other information

For enquires and questions, contact

Package Sidebar

Install

npm i collect-africa-js

Weekly Downloads

34

Version

1.1.2

License

MIT

Unpacked Size

72.6 kB

Total Files

22

Last publish

Collaborators

  • temitopeadesoji23