@paydock/client-sdk
Version:
Paydock client sdk
327 lines • 12.9 kB
TypeScript
import { ApiInternal } from '../api/api-internal';
import { Container } from '../components/container';
import { type IWalletMeta } from '../components/param';
import { EventEmitter } from '../helper/event-emitter';
import { EventEnum } from './enums';
import type { IWalletOnClick, IWalletPaymentSuccessful, IWalletUnavailable, IWalletUpdate } from './interfaces';
import { type IWalletService } from './wallet-services/wallet-service';
/**
* List of available event's name in the wallet button lifecycle
* @const EVENT
*
* @type {object}
* @param {string} UNAVAILABLE=unavailable
* @param {string} UPDATE=update
* @param {string} PAYMENT_SUCCESSFUL=paymentSuccessful
* @param {string} PAYMENT_ERROR=paymentError
* @param {string} ON_CLICK=onClick
* @param {string} LOADED=onWalletLoaded
*/
export declare const EVENT: {
UNAVAILABLE: EventEnum;
UPDATE: EventEnum;
PAYMENT_SUCCESSFUL: EventEnum;
PAYMENT_ERROR: EventEnum;
PAYMENT_IN_REVIEW: EventEnum;
AUTH_TOKENS_CHANGED: EventEnum;
ON_CLICK: EventEnum;
ON_CHECKOUT_OPEN: EventEnum;
ON_CHECKOUT_CLOSE: EventEnum;
ON_WALLET_LOADED: EventEnum;
};
export interface IEventData<T = any> {
event: string;
data: T;
}
export interface IWalletPaymentSuccessfulEvent extends IEventData<IWalletPaymentSuccessful> {
event: EventEnum.PAYMENT_SUCCESSFUL;
}
export interface IWalletUpdateEvent extends IEventData<IWalletUpdate> {
event: EventEnum.UPDATE;
}
export interface IWalletUnavailableEvent extends IEventData<IWalletUnavailable> {
event: EventEnum.UNAVAILABLE;
}
export interface IWalletLoadedEvent extends IEventData<string> {
event: EventEnum.ON_WALLET_LOADED;
}
export interface IWalletOnClickEvent extends IEventData<IWalletOnClick> {
event: EventEnum.ON_CLICK;
}
export interface IWalletUpdateData {
success: boolean;
}
/**
* Class WalletButtons to work with different E-Wallets within html (currently supports Apple Pay, Google Pay, Google Pay™ and Apple Pay via Stripe, Flypay V2, Paypal, Afterpay)
* @constructor
*
* @example
* var button = new WalletButtons('#wallet-buttons', 'charge-token', { amount_label: 'Total', country: 'us' });
*
* @param {string} selector - Selector of html element. Container for the WalletButtons.
* @param {string} chargeToken - token for the wallet transaction, created with a secure call to `POST charges/wallet`.
* @param {IWalletMeta} meta - data that configures the E-Wallet, which can be shown on checkout page and configures required customer information.
*/
declare class WalletButtons {
protected container: Container;
protected api: ApiInternal;
protected service: IWalletService;
protected eventEmitter: EventEmitter;
protected hasUpdateHandler: boolean;
/** @constructs */ constructor(selector: string, chargeToken: string, meta: IWalletMeta);
/**
* Initializes the availability checks and inserts the button if possible.
* Otherwise function onUnavailable(handler: VoidFunction) will be called.
*
* @example
* var button = new WalletButtons(
* '#buttons',
* token,
* {
* amount_label: 'Total',
* country: 'DE',
* }
* );
* button.load();
*/
load(): void;
/**
* Triggers the update process of the wallet, if available.
* Currently supported by Paypal and ApplePay/GooglePay via MPGS Wallets.
*
* @example
* var button = new WalletButtons(
* '#buttons',
* token,
* {
* amount_label: 'Total',
* country: 'DE',
* }
* );
* button.on('update', (data) => {
* updateChargeAmountInBackend(data);
* button.update({ success: true });
* });
*
* @example
* // ApplePay via MPGS example:
* var button = new WalletButtons(
* '#buttons',
* token,
* {
* amount_label: 'Total',
* country: 'AU',
* ...
* }
* );
* button.on('update', (data) => {
* updateChargeAmountInBackend(data);
* button.update({
* success: true,
* body: {
* amount: 15,
* shipping_options: [
* {
* id: "NEW-FreeShip",
* label: "NEW - Free Shipping",
* detail: "Arrives in 3 to 5 days",
* amount: "0.00"
* },
* {
* id: "NEW - FastShip",
* label: "NEW - Fast Shipping",
* detail: "Arrives in less than 1 day",
* amount: "10.00"
* }
* ]
* }
* });
* });
*/
update(data: IWalletUpdateData): void;
/**
* Current method can change environment. By default environment = sandbox.
* Also we can change domain alias for this environment. By default domain_alias = paydock.com
* Bear in mind that you must set an environment before calling `button.load()`.
*
* @example
* button.setEnv('production', 'paydock.com');
* @param {string} env - sandbox, production
* @param {string} [alias] - Own domain alias
*/
setEnv(env: string, alias?: string): void;
/**
* Current method can enable the payment button. This method is only supported for Flypay V2.
*
* @example
* button.enable();
*/
enable(): void;
/**
* Current method can disable the payment button. This method is only supported for Flypay V2.
*
* @example
* button.disable('production', 'paydock.com');
*/
disable(): void;
/**
* Closes the checkout forcibly. Currently supported in Flypay wallet.
*
* @example
* button.close();
*/
close(): void;
on(eventName: string): Promise<IEventData>;
on(eventName: string, cb: (data: IEventData) => void): any;
/**
* User to subscribe to the no button available event. This method is used after loading when the button is not available.
* For MPGS, since can have more than one wallet button configured (ApplePay/GooglePay) you will receive a body (({ wallet: WALLET_TYPE.GOOGLE }) or ({ wallet: WALLET_TYPE.APPLE })) indicating which button is unavailable
* Important: Do not perform thread blocking operations in callback such as window.alert() calls.
*
* @example
* button.onUnavailable(() => {
* console.log('No wallet buttons available');
* });
*
* @example
* button.onUnavailable().then(() => console.log('No wallet buttons available'));
*
* @example
* button.onUnavailable(function (data) {console.log('data.wallet :: ', data.wallet)});
*
* @param {listener} [handler] - Function to be called when no button is available.
*/
onUnavailable(handler?: (data: IWalletUnavailableEvent) => void): Promise<void> | (() => void);
/**
* If the wallet performs some update in the checkout process, the function passed as parameter will be called.
*
* NOTE: make sure to call the `button.update(result)` method on handler completion.
*
* @example
* button.onUpdate((data) => {
* button.update({ success: true });
* });
*
* @example
* button.onUpdate().then((data) => throw new Error());
*
* @param {listener} [handler] - Function to be called when the payment was successful.
*/
onUpdate(handler?: (data: IWalletUpdateEvent) => void): Promise<unknown> | (() => void);
/**
* If the payment was successful, the function passed as parameter will be called.
* Important: Do not perform thread blocking operations in callback such as window.alert() calls.
*
* @example
* button.onPaymentSuccessful((data) => {
* console.log('Payment successful!');
* });
*
* @example
* button.onPaymentSuccessful().then((data) => console.log('Payment successful!'));
*
* @param {listener} [handler] - Function to be called when the payment was successful.
*/
onPaymentSuccessful(handler?: (data: IWalletPaymentSuccessfulEvent) => void): Promise<unknown> | (() => void);
/**
* If the payment was left in fraud review, the function passed as parameter will be called.
* Important: Do not perform thread blocking operations in callback such as window.alert() calls.
*
* @example
* button.onPaymentInReview((data) => {
* console.log('Payment in fraud review');
* });
*
* @example
* button.onPaymentInReview().then((data) => console.log('Payment in fraud review'));
*
* @param {listener} [handler] - Function to be called when the payment was left in fraud review status.
*/
onPaymentInReview(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
/**
* If the payment was not successful, the function passed as parameter will be called.
* Important: Do not perform thread blocking operations in callback such as window.alert() calls.
*
* @example
* button.onPaymentError((err) => {
* console.log('Payment not successful');
* });
*
* @example
* button.onPaymentError().then((err) => console.log('Payment not successful'));
*
* @param {listener} [handler] - Function to be called when the payment was not successful.
*/
onPaymentError(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
/**
* Registers a callback function to be invoked when authentication tokens are changed.
* This function allows you to respond to changes in authentication tokens, such as when a user logs in.
*
* @example
* button.onAuthTokensChanged((eventData) => {
* console.log('Authentication tokens changed:', eventData);
* });
*
* @example
* button.onAuthTokensChanged().then((eventData) => {
* console.log('Authentication tokens changed:', eventData);
* });
*
* @param {listener} [handler] - Function to be called when authentication tokens are changed.
*/
onAuthTokensChanged(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
/**
* Registers a callback function to be invoked when the wallet button gets clicked.
* There are two operational modes supported, Synchronous and Asynchronous.
* When asynchronous operations need to occur on the callback handler, attaching the Promise via `attachResult` is required to have the wallet wait for a result.
* When synchronous operations occur on the callback handler, attaching a boolean result via `attachResult` is optional to control the execution flow.
* Note this is supported for Paypal, GooglePay, ApplePay, Afterpay and FlypayV2 wallet buttons at the moment.
*
* @example
* button.onClick((data) => {
* performValidationLogic();
* });
*
* @param {listener} handler - Function to be called when the wallet button is clicked.
*/
onClick(handler: (data: IWalletOnClickEvent) => void): () => void;
/**
* Registers a callback function to be invoked when the wallet checkout opens.
* Note this is supported for FlypayV2 wallet button at the moment.
*
* @example
* button.onCheckoutOpen((data) => {
* console.log('Checkout opens');
* });
*
* @param {listener} handler - Function to be called when the wallet checkout opens.
*/
onCheckoutOpen(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
/**
* Registers a callback function to be invoked when the wallet checkout closes.
* Note this is supported for FlypayV2 wallet button at the moment.
*
* @example
* button.onCheckoutClose(() => {
* console.log('Wallet checkout closes');
* });
*
* @param {listener} handler - Function to be called when the wallet checkout closes.
*/
onCheckoutClose(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
private setupServiceCallbacks;
private setupOnWalletLoadedCallback;
private setupUnavailableCallback;
private setupUpdateCallback;
private setupOnClickCallback;
private setupOnCheckoutOpenCallback;
private setupOnCheckoutCloseCallback;
private setupWalletCallback;
private setupPaymentCallback;
private setupPaymentSuccessCallback;
private setupPaymentInReviewCallback;
private setupPaymentErrorCallback;
private setupAuthTokensChangedCallback;
}
export { WalletButtons };
//# sourceMappingURL=wallet-buttons.d.ts.map