Installation

npm i @pcibooking/ewallet

Quick Start

Initialize the Engine

const engine = new eWallet.Engine(sessionToken, requiredAncillaryInfo, language, uiOptions);

| Parameter | Description | |-----------|-------------| | sessionToken | Required. Token obtained from the PCI Booking service | | requiredAncillaryInfo | Optional. Billing/shipping address requirements (applicable on most eWallets) | | language | Optional. Language code for UI localization. Supported languages: EN, ES, FR, DE, IT, PT, NL, PL, RU, JA, ZH, KO, AR, HE, TR, SV, NO, DA, FI, and more. | | uiOptions | Optional. Client-side UI options (see below) |

UI Options

The uiOptions object controls presentation of the library-rendered UI.

| Field | Type | Description | |-------|------|-------------| | hideLogo | boolean | When true, the merchant logo is not rendered at the top of the card-entry form. Defaults to false. | | displayMode | 'popup' \| 'iframe' | How the CardPay card-entry form is presented. 'popup' (default) opens it in a separate, centered browser window. 'iframe' embeds it in an in-page iframe. | | iframeContainerSelector | string | Only used when displayMode is 'iframe'. CSS selector of the element that should host the iframe (e.g. '#card-form-host'). When provided, the iframe is embedded inline into that element. When omitted, the iframe is shown as a centered modal overlay on the page. |

const uiOptions = {
    hideLogo: true,
};
const engine = new eWallet.Engine(sessionToken, requiredAncillaryInfo, language, uiOptions);

CardPay form display mode

By default the CardPay card-entry form opens in a separate popup window. Set displayMode: 'iframe' to render it inside an in-page iframe instead:

// Centered modal overlay (no container selector)
const uiOptions = { displayMode: 'iframe' };

// Inline — embedded into an element you control
const uiOptions = { displayMode: 'iframe', iframeContainerSelector: '#card-form-host' };

const engine = new eWallet.Engine(sessionToken, requiredAncillaryInfo, language, uiOptions);

Note: displayMode applies to the CardPay form only. Other providers continue to use their standard flow.

Detect Available eWallets

const available = engine.checkAvailability();

Returns the list of eWallets available on the specific device and browser.

Start a Payment Session

engine.payBy(eWalletList, callback, buttonProperties);

Starts the payment process using the specified list of eWallet providers.

| Parameter | Description | |-----------|-------------| | eWalletList | Required. List of requested eWallet providers and their respective button properties | | callback | Required. Callback handler called when the payment operation completes | | buttonProperties | Optional. Button styling properties |

Obtaining Results

Use the following methods to get data on the current session:

| Method | Description | |--------|-------------| | getSessionType() | Returns the session type (CHARGE, TOKENIZE, etc.) | | parseResultToken() | Parses and returns the result token from the payment operation | | getBillingInfo() | Returns the billing information collected during the payment | | getShippingInfo() | Returns the shipping information collected during the payment |

Documentation

In order to use this library to process payments, you need to have an account with Orchestra. If you do not have one yet, please go to our website to sign up. If you already have an account, check out our documentation pages to read our integration guides, view the full API reference and see instructions on generating a session token for the library.

Support

For assistance, visit our contact form or email [email protected].

Changelog

See CHANGELOG.md for version history.