@paydock/client-sdk 1.119.0-beta → 1.119.2

package/bundles/index.cjs.d.ts

@@ -678,73 +678,6 @@ declare class IFrame {
     private setStyles;
 }
 
-/**
- * Contains basic information associated with the event.
- *
- * Including event (name), source of the message, purpose and a unique identifier
- * for the event.
- *
- * @interface IEventData
- *
- * @param {string} event The name of the event.
- * @param {string} message_source A system variable that identifies the event source.
- * @param {string} purpose A system variable that states the purpose of the event.
- * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
- */
-interface IEventData$1 {
-    event: string;
-    message_source: string;
-    purpose: string;
-    widget_id: string;
-    data?: any;
-    ref_id?: string;
-}
-declare const EVENT$1: {
-    AFTER_LOAD: string;
-    SUBMIT: string;
-    FINISH: string;
-    VALIDATION_ERROR: string;
-    SYSTEM_ERROR: string;
-    /** @deprecated */
-    CHECKOUT_SUCCESS: string;
-    CHECKOUT_READY: string;
-    CHECKOUT_ERROR: string;
-    CHECKOUT_COMPLETED: string;
-    CHECKOUT_POPUP_OPEN: string;
-    CHECKOUT_POPUP_CLOSE: string;
-    RECOGNITION_TOKEN_REQUESTED: string;
-    RECOGNITION_TOKEN_DROPPED: string;
-    VALIDATION: string;
-    SELECT: string;
-    UNSELECT: string;
-    NEXT: string;
-    PREV: string;
-    META_CHANGE: string;
-    RESIZE: string;
-    CHARGE_AUTH_SUCCESS: string;
-    CHARGE_AUTH_REJECT: string;
-    CHARGE_AUTH_CANCELLED: string;
-    ADDITIONAL_DATA_SUCCESS: string;
-    ADDITIONAL_DATA_REJECT: string;
-    CHARGE_AUTH: string;
-    DISPATCH_SUCCESS: string;
-    DISPATCH_ERROR: string;
-};
-interface Listener {
-    event: string;
-    listener: (event: any) => void;
-    widget_id: string;
-}
-declare type Listeners = Listener[];
-declare class IFrameEvent {
-    protected listeners: Listeners;
-    constructor(subject: Window | null);
-    emit(data: IEventData$1): void;
-    on<T>(eventName: string, widgetId: string, cb: (data: T) => void): void;
-    clear(): void;
-    private subscribe;
-}
-
 /**
  * List of available payment source types
  *
@@ -767,13 +700,13 @@ declare const PAYMENT_TYPE: {
  * @param {string} CARD_PAYMENT_SOURCE_WITH_CVV=card_payment_source_with_cvv
  * @param {string} CARD_PAYMENT_SOURCE_WITHOUT_CVV=card_payment_source_without_cvv
  * */
-declare const PURPOSE: {
-    PAYMENT_SOURCE: string;
-    CARD_PAYMENT_SOURCE_WITH_CVV: string;
-    CARD_PAYMENT_SOURCE_WITHOUT_CVV: string;
-};
+declare enum PURPOSE {
+    PAYMENT_SOURCE = "payment_source",
+    CARD_PAYMENT_SOURCE_WITH_CVV = "card_payment_source_with_cvv",
+    CARD_PAYMENT_SOURCE_WITHOUT_CVV = "card_payment_source_without_cvv"
+}
 interface IGeneral {
-    purpose: string;
+    purpose: PURPOSE;
     predefined_fields: IPredefinedFields;
     defined_form_fields?: string[];
     webhook_destination?: string;
@@ -809,7 +742,7 @@ declare class Configuration {
     private env;
     static createEachToken(accessToken: string, configs: Configuration[]): Promise<string[]>;
     private static addTokenInBase64;
-    /** @constructs */ constructor(gatewayID?: string, paymentType?: string, purpose?: string);
+    /** @constructs */ constructor(gatewayID?: string, paymentType?: string, purpose?: PURPOSE);
     /**
      * Destination, where customer will receive all successful responses.
      * Response will contain “data” object with “payment_source” or other parameters, in depending on 'purpose'
@@ -907,777 +840,983 @@ declare class Configuration {
     setGiftCardSchemeData(giftCardScheme: any, processingNetwork: any): void;
 }
 
-declare class EventEmitter {
-    private events;
-    emit<T>(eventName: string, data?: T): void;
-    emitWithResult<T, R>(eventName: string, data?: T): Promise<R[]>;
-    subscribe<T>(eventName: string, handler: (data: T) => void): () => void;
-}
-
-declare class Standalone3dsService {
-    protected container: Container;
-    protected eventEmitter: EventEmitter;
-    protected env: string;
-    protected alias: string;
-    constructor(container: Container, eventEmitter: any);
-    load(token: string, options: {
-        title: string;
-    }): void;
-    setEnv(env: string, alias?: string): void;
-}
-
 /**
- * List of available token's content formats
- * @enum TOKEN_FORMAT
- *
+ * Current constant include available type of element for styling
+ * @const STYLABLE_ELEMENT
  * @type {object}
- * @param {string} HTML=html
- */
-declare enum TOKEN_FORMAT {
-    HTML = "html",
-    URL = "url",
-    STANDALONE_3DS = "standalone_3ds"
-}
+ * @param {string} INPUT=input.
+ *   These states are available: [STYLABLE_ELEMENT_STATE.ERROR]{@link STYLABLE_ELEMENT_STATE}, [STYLABLE_ELEMENT_STATE.FOCUS]{@link STYLABLE_ELEMENT_STATE}.
+ *   These styles are available [IElementStyleInput]{@link IElementStyleInput}
+ * @param {string} SUBMIT_BUTTON=submit_button
+ *   These states are available: [STYLABLE_ELEMENT_STATE.HOVER]{@link STYLABLE_ELEMENT_STATE}.
+ *   These styles are available [IElementStyleSubmitButton]{@link IElementStyleSubmitButton}
+ * @param {string} LABEL=label.
+ *   These styles are available [IElementStyleLabel]{@link IElementStyleLabel}
+ * @param {string} TITLE=title.
+ *   These styles are available [IElementStyleTitle]{@link IElementStyleTitle}
+ * @param {string} TITLE_DESCRIPTION=title_description.
+ *   These styles are available [IElementStyleTitleDescription]{@link IElementStyleTitleDescription}
+ * */
+declare const STYLABLE_ELEMENT: {
+    INPUT: string;
+    SUBMIT_BUTTON: string;
+    LABEL: string;
+    TITLE: string;
+    TITLE_DESCRIPTION: string;
+};
 /**
- * List of available event's name
- * @const EVENT
- *
+ * Current constant include available states of element for styling
+ * @const STYLABLE_ELEMENT_STATE
  * @type {object}
- * @param {string} CHARGE_AUTH_SUCCESS=chargeAuthSuccess
- * @param {string} CHARGE_AUTH_REJECT=chargeAuthReject
- * @param {string} ADDITIONAL_DATA_SUCCESS=additionalDataCollectSuccess
- * @param {string} ADDITIONAL_DATA_REJECT=additionalDataCollectReject
- * @param {string} CHARGE_AUTH=chargeAuth
- */
+ * @param {string} ERROR=error client|server validation. This state applies to: input
+ * @param {string} FOCUS=focus focus. This state applies to: input
+ * @param {string} HOVER=hover focus. This state applies to: submit_button
+ * */
+declare const STYLABLE_ELEMENT_STATE: {
+    ERROR: string;
+    FOCUS: string;
+    HOVER: string;
+};
+interface IElementStyleInput {
+    color?: string;
+    border?: string;
+    border_radius?: string;
+    background_color?: string;
+    height?: string;
+    text_decoration?: string;
+    font_size?: string;
+    font_family?: string;
+    padding?: string;
+    margin?: string;
+    transition?: string;
+    line_height?: string;
+    font_weight?: string;
+}
+interface IElementStyleSubmitButton {
+    color?: string;
+    border?: string;
+    border_radius?: string;
+    background_color?: string;
+    text_decoration?: string;
+    font_size?: string;
+    font_family?: string;
+    padding?: string;
+    margin?: string;
+    transition?: string;
+    line_height?: string;
+    font_weight?: string;
+    opacity?: string;
+}
+interface IElementStyleLabel {
+    color?: string;
+    text_decoration?: string;
+    font_size?: string;
+    font_family?: string;
+    line_height?: string;
+    font_weight?: string;
+    padding?: string;
+    margin?: string;
+}
+interface IElementStyleTitle {
+    color?: string;
+    text_decoration?: string;
+    font_size?: string;
+    font_family?: string;
+    line_height?: string;
+    font_weight?: string;
+    padding?: string;
+    margin?: string;
+}
+interface IElementStyleTitleDescription {
+    color?: string;
+    text_decoration?: string;
+    font_size?: string;
+    font_family?: string;
+    line_height?: string;
+    font_weight?: string;
+    padding?: string;
+    margin?: string;
+}
+
 /**
- * List of available event's name for Standalone 3ds flow
- * @const STANDALONE_3DS_EVENT
  *
- * @type {object}
- * @param {string} CHARGE_AUTH_SUCCESS=chargeAuthSuccess
- * @param {string} CHARGE_AUTH_REJECT=chargeAuthReject
- * @param {string} CHARGE_AUTH_DECOUPLED=chargeAuthDecoupled
- * @param {string} CHARGE_AUTH_CHALLENGE=chargeAuthChallenge
- * @param {string} CHARGE_AUTH_INFO=chargeAuthInfo
- * @param {string} ERROR=error
-*/
-/**
- * Class Canvas3ds include method for working on html
+ * Class MultiWidget include method for for creating iframe url
  * @constructor
  *
- * @param {string} selector - Selector of html element. Container for widget
- * @param {string} token - Pre authorized token
+ * @param {string} accessToken - PayDock users access token or public key
+ * @param {(Configuration | string | Configuration[] | string[])} conf - exemplar[s] Configuration class OR configuration token
+ *
  * @example
- * var widget = new Canvas3ds('#widget', 'token');
+ * var widget = new MultiWidget('accessToken','configurationToken'); // With a pre-created configuration token
+ *
+ * var widget = new MultiWidget('accessToken',['configurationToken', 'configurationToken2']); // With pre-created configuration tokens
  *
+ * var widget = new MultiWidget('accessToken', new Configuration('gatewayId')); With Configuration
  *
+ * var widget = new MultiWidget('accessToken',[ With Configurations
+ *      Configuration('gatewayId'),
+ *      Configuration('gatewayId', 'bank_account')
+ * ]);
  */
-declare class Canvas3ds {
+declare class MultiWidget {
     protected link: Link;
     protected configs: Configuration[];
-    protected publicKey: string;
-    protected token: {
-        content: string;
-        format: TOKEN_FORMAT;
-        charge_3ds_id: string;
-    };
-    protected standalone3dsService: Standalone3dsService;
-    protected container: Container;
-    protected iFrame: IFrame;
+    protected configTokens: string[];
+    protected accessToken: string;
     protected event: IFrameEvent;
-    protected eventEmitter: EventEmitter;
-    /** @constructs */ constructor(selector: string, token: string);
-    protected static extractToken(token: string): {
-        content: string;
-        format: TOKEN_FORMAT;
-        charge_3ds_id: string;
-    };
-    /**
-     * The final method to beginning, the load process of widget to html
-     *
-     */
-    load(): void;
+    constructor(accessToken: string, confTokens: string[]);
+    constructor(accessToken: string, confToken: string);
+    constructor(accessToken: string, configs: Configuration[]);
+    constructor(accessToken: string, conf: Configuration);
     /**
-     * Current method can change environment. By default environment = sandbox.
-     * Also we can change domain alias for this environment. By default domain_alias = paydock.com
+     * Object contain styles for widget
      *
      * @example
-     * widget.setEnv('production');
-     * @param {string} env - sandbox, production
-     * @param {string} [alias] - Own domain alias
-     */
-    setEnv(env: string, alias?: string): void;
-    getEnv(): string;
-    on(eventName: string): Promise<IEventData$1>;
-    on(eventName: string, cb: (data: IEventData$1) => void): any;
-    /**
-     * Using this method you can hide widget after load
-     * @param {boolean} [saveSize=false] - using this param you can save iframe's size
+     * widget.setStyles({
+     *       background_color: 'rgb(0, 0, 0)',
+     *       border_color: 'yellow',
+     *       text_color: '#FFFFAA',
+     *       button_color: 'rgba(255, 255, 255, 0.9)',
+     *       font_size: '20px'
+     *       fort_family: 'fantasy'
+     *   });
+     * @param {IStyles} fields - name of styles which can be shown in widget [STYLE]{@link STYLE}
      */
-    hide(saveSize: boolean): void;
+    setStyles(styles: IStyles$1): void;
     /**
-     * Using this method you can show widget after using hide method
+     * Method to set a country code mask for the phone input.
      *
+     * @example
+     * widget.usePhoneCountryMask();
+     *
+     * @example
+     * widget.usePhoneCountryMask({
+     *       default_country: 'au',
+     *       preferred_countries: ['au', 'gb'],
+     *       only_countries: ['au', 'gb', 'us', 'ua']
+     *   });
+     *
+     * @param {object} [options] - Options for configure the phone mask.
+     * @param {string} [options.default_country] - Set a default country for the mask.
+     * @param {Array.<string>} [options.preferred_countries] - Set list of preferred countries for the top of the select box .
+     * @param {Array.<string>} [options.only_countries] - Set list of countries to show in the select box.
      */
-    show(): void;
+    usePhoneCountryMask(options?: ICountryPhoneMask): void;
+    setStyle(param: string, value: string): void;
     /**
-     * Using this method you can reload widget
+     * Method for set different texts inside the widget
+     *
+     * @example
+     * widget.setTexts({
+     *       title: 'Your card',
+     *       finish_text: 'Payment resource was successfully accepted',
+     *       title_description: '* indicates required field',
+     *       submit_button: 'Save',
+     *       submit_button_processing: 'Load...',
+     *   });
      *
+     * @param {ITexts} fields - name of text items which can be shown in widget [TEXT]{@link TEXT}
      */
-    reload(): void;
+    setTexts(texts: ITexts): void;
+    setText(param: string, value: string): void;
+    setElementStyle(element: string, state: string, styles: IElementStyleInput | IElementStyleSubmitButton | IElementStyleLabel): any;
+    setElementStyle(element: string, styles: IElementStyleInput | IElementStyleSubmitButton | IElementStyleLabel | IElementStyleTitle | IElementStyleTitleDescription): any;
+    /**
+   * The method to set the predefined values for the form fields inside the widget
+   *
+   * @example
+   *   widget.setFormValues({
+   *       email: 'predefined@email.com',
+   *       card_name: 'Houston'
+   *   });
+   *
+   * @param { Object } fieldValues - Key of object is one of [FORM_FIELD]{@link FORM_FIELD}, The object value is what we are expecting
+   */
+    setFormValues(fieldValues: IFormValues): void;
+    setFormValue(key: string, value: string): void;
+    /**
+     * The method to set custom form field labels
+     *
+     * @example
+     *   widget.setFormPlaceholders({
+     *       card_name: 'Card Holder Name',
+     *       email: 'Email For Receipt'
+     *   })
+     *
+     * @param { Object } fieldLabels - Key of object is one of [FORM_FIELD]{@link FORM_FIELD}, The object value is what we are expecting
+     */
+    setFormLabels(fieldLabels: IFormLabels): void;
+    setFormLabel(key: string, label: string): void;
+    /**
+     * The method to set custom form fields placeholders
+     *
+     * @example
+     *   widget.setFormPlaceholders({
+     *       card_name: 'Input your card holder name...',
+     *       email: 'Input your email, like test@example.com'
+     *   })
+     *
+     * @param { Object } fieldPlaceholders - Key of object is one of [FORM_FIELD]{@link FORM_FIELD}, Value of object is expected placeholder
+     */
+    setFormPlaceholders(fieldPlaceholders: IFormPlaceholders): void;
+    setFormPlaceholder(key: string, placeholder: string): void;
+    /**
+     * The method to set the full configuration for the all specific form elements (label, placeholder, value)
+     * You can also use the other method for the partial configuration like: setFormValues, setFormPlaceholder, setFormLabel
+     *
+     * @example
+     *   widget.setFormElements([
+     *       {
+     *           field:  'card_name',
+     *           placeholder: 'Input your card holder name...',
+     *           label: 'Card Holder Name',
+     *           value: 'Houston',
+     *       },
+     *       {
+     *           field:  'email',
+     *           placeholder: 'Input your email, like test@example.com',
+     *           label: 'Email For Receipt',
+     *           value: 'predefined@email.com',
+     *       },
+     *   ])
+     *
+     * @param { string } elements - The list of elements
+     * @param { string } elements[].field - Field name of the element [FORM_FIELD]{@link FORM_FIELD}
+     * @param { string } elements[].placeholder - Set custom form field placeholder
+     * @param { string } elements[].label - Set custom labels near form field
+     * @param { string } elements[].value - Set predefined values for the form field
+     */
+    setFormElements(elements: IFormElement[]): void;
+    setFormElement(element: IFormElement): void;
+    /**
+     * The method to change the widget icons
+     *
+     * @deprecated
+     */
+    setIcons(icons: IIcons): void;
+    setIcon(key: string, value: string): void;
+    /**
+     * Using this method you can set hidden elements inside widget
+     *
+     * @example
+     * widget.setHiddenElements(['submit_button', 'email']);
+     *
+     * @param {string[]} elements -  list of element which can be hidden [ELEMENT]{@link ELEMENT} || [FORM_FIELD]{@link FORM_FIELD}
+     */
+    setHiddenElements(elements: string[]): void;
+    /**
+     * Current method can set custom ID to identify the data in the future
+     *
+     * @example
+     * widget.setRefId('id');
+     *
+     * @param {string} refId - custom id
+     */
+    setRefId(refId: string): void;
+    /**
+     * Current method can add visual validation from gateway to widget's form fields
+     *
+     * @example
+     * widget.useGatewayFieldValidation();
+     */
+    useGatewayFieldValidation(): void;
+    /**
+     * Current method can set icons of supported card types
+     *
+     * @example
+     *
+     * widget.setSupportedCardIcons(['mastercard', 'visa'], validateCardNumberInput);
+     *
+     * @param {string[]} elements - [SUPPORTED_CARD_TYPES]{@link SUPPORTED_CARD_TYPES}
+     * @param {boolean} validateCardNumberInput - [validateCardNumberInput=false] - using this param you allow validation for card number input on supported card types
+     */
+    setSupportedCardIcons(elements: string[], validateCardNumberInput?: boolean): 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
+     *
+     * @example
+     * widget.setEnv('production', 'paydock.com');
+     * @param {string} env - sandbox, production
+     * @param {string} [alias] - Own domain alias
+     */
+    setEnv(env: string, alias?: string): void;
+    getEnv(): void;
+    /**
+     * Method for creating iframe url
+     *
+     * @example
+     * widget.loadIFrameUrl(function (url) {
+     *      console.log(url);
+     * }, function (errors) {
+     *      console.log(errors);
+     * });
+     */
+    loadIFrameUrl(cb: (url: string) => void, errorCb?: (error: any) => void): void;
+    /**
+     * Method for setting a custom language code
+     *
+     * @example
+     * config.setLanguage('en');
+     * @param {string} code - ISO 639-1
+     */
+    setLanguage(code: any): void;
+    getLink(): Link;
+    protected handleErrorEvent(err: IErrorEvent): void;
 }
 
-/**
- * @type {object}
- * @param {string} CLICK=click
- * @param {string} POPUP_REDIRECT=popup_redirect
- * @param {string} ERROR=error
- * @param {string} ACCEPTED=accepted
- * @param {string} FINISH=finish
- * @param {string} CLOSE=close
- */
-declare const CHECKOUT_BUTTON_EVENT: {
-    CLICK: string;
-    POPUP_REDIRECT: string;
-    REDIRECT: string;
-    ERROR: string;
-    REFERRED: string;
-    DECLINED: string;
-    CANCELLED: string;
-    ACCEPTED: string;
-    FINISH: string;
-    CLOSE: string;
-};
-/**
- * @type {object}
- * @param {string} CONTEXTUAL=contextual
- * @param {string} REDIRECT=redirect
- */
-declare enum CHECKOUT_MODE {
-    CONTEXTUAL = "contextual",
-    REDIRECT = "redirect"
+interface ITriggerData {
+    configuration_token?: string;
+    tab_number?: number;
+    elements?: string;
+    form_values?: string;
 }
 /**
+ * Interface for classes that represent a trigger data.
+ * @interface ITriggerData
+ *
+ * @param {string} [configuration_token]
+ * @param {string} [tab_number]
+ * @param {string} [elements]
+ * @param {string} [form_values]
+ * */
+/**
+ * List of available triggers
+ *
  * @type {object}
- * @param {string} ZIPMONEY=Zipmoney
- * @param {string} PAYPAL=PaypalClassic
- * @param {string} AFTERPAY=Afterpay
+ * @param {string} SUBMIT_FORM=submit_form
+ * @param {string} CHANGE_TAB=tab
+ * @param {string} HIDE_ELEMENTS=hide_elements
+ * @param {string} SHOW_ELEMENTS=show_elements
+ * @param {string} REFRESH_CHECKOUT=refresh_checkout
+ * @param {string} UPDATE_FORM_VALUES=update_form_values
+ * @param {string} INIT_CHECKOUT=init_checkout
  */
-declare enum GATEWAY_TYPE {
-    ZIPMONEY = "Zipmoney",
-    PAYPAL = "PaypalClassic",
-    AFTERPAY = "Afterpay"
-}
-interface IEventCheckoutFinishData {
-    payment_source_token: string;
-    checkout_email: string;
-    checkout_holder: string;
-    gateway_type: string;
+declare const TRIGGER: {
+    SUBMIT_FORM: string;
+    CHANGE_TAB: string;
+    HIDE_ELEMENTS: string;
+    SHOW_ELEMENTS: string;
+    REFRESH_CHECKOUT: string;
+    UPDATE_FORM_VALUES: string;
+    INIT_CHECKOUT: string;
+};
+declare class Trigger {
+    protected iFrame: IFrame;
+    constructor(iFrame: IFrame);
+    push(triggerName: string, data?: ITriggerData): void;
 }
 
-/**
- * Class Background create overlay for checkout
- *
- * @example
- * var overlay = new Background();
- */
-declare class Background {
-    protected description: string;
-    protected title: string;
-    protected overlay: HTMLElement;
-    protected style: HTMLStyleElement;
-    protected eventEmitter: EventEmitter;
-    protected showControl: boolean;
-    protected showLoader: boolean;
-    constructor();
-    initControl(): void;
-    initLoader(): void;
-    private eventHandler;
-    clear(): void;
-    private createLoader;
-    protected createTemplate(): void;
-    private createStyles;
-    setBackdropDescription(text: string): void;
-    setBackdropTitle(text: string): void;
-    onTrigger(triggerName: string, cb: () => void): void;
-    isInit(): boolean;
-    hideContinueControl(): void;
-    turnOffControl(): void;
-    turnOffLoader(): void;
-}
-
-declare type SuccessCb = (data: any, status: number) => void;
-declare type ErrorCb = (err: any, status: number) => void;
-declare abstract class HttpCore {
-    private env;
-    constructor();
-    setEnv(env: string, alias?: string): void;
-    getEnv(): string;
-    protected getUrl(): string;
-    protected create(accessToken: string, data: any, cb: SuccessCb, errorCb: ErrorCb): void;
-    protected get(accessToken: string, cb: SuccessCb, errorCb: ErrorCb): void;
-    protected parser(text: any, status: number, cb: SuccessCb, errorCb: ErrorCb): void;
-    protected abstract getLink(): string;
-}
-
-interface IBody$1 {
-    gateway_id: string;
-    success_redirect_url: string;
-    error_redirect_url: string;
-    redirect_url: string;
-    meta: IPayPalMeta;
-    description?: string;
-}
-interface ICheckout {
-    gateway_id: string;
-    checkout_type: string;
-    gateway_type: string;
-    link: string;
-    reference_id: string;
-    token: string;
-    mode?: string;
-}
-declare class Builder$1 extends HttpCore {
-    private body;
-    constructor(gatewayID: string, successRedirectUrl: string, errorRedirectUrl: string);
-    protected getLink(): string;
-    setDescriptions(text: string): void;
-    setMeta(meta: IPayPalMeta): void;
-    getConfigs(): IBody$1;
-    send(publicKey: string, cb: (checkout: ICheckout) => void, errorCb?: (error: any, code: string) => void): void;
-}
-
-interface IDetails {
-    checkout_email: string;
-    checkout_holder: string;
-    status: string;
-    gateway_type: string;
-}
-declare class Checker extends HttpCore {
-    token: string;
-    constructor(token: string);
-    protected getLink(): string;
-    send(accessToken: string, cb: (details: IDetails) => void, errorCb?: (error: any) => void): void;
-}
-
-type AdditionalParams = Record<string, string | number | boolean>;
-interface IRunner {
-    next(checkoutData: ICheckout, params?: AdditionalParams): void;
-    error(error: string, code: string, cb: (close: boolean) => void): void;
-    getSuccessRedirectUri(): string;
-    getErrorRedirectUri(): string;
-    setEnv(env: string, alias?: string): void;
-}
-
-interface IDispatcherData {
-    message_source: string;
-    event: string;
-}
-
-interface IContextualRunner extends IRunner {
-    run(): void;
-    isRunning(): boolean;
-    continue(): void;
-    stop(): void;
-    onStop(cb: () => void): void;
-    onCheckout<T extends IDispatcherData>(event: string, cb: (checkout: ICheckout, data?: T) => void): void;
-    setBackgroundTitle(text: string): void;
-    setBackgroundDescription(text: string): void;
-    turnOffBackdrop(): void;
-    setSuspendedRedirectUri(uri: string): void;
-}
-
-interface IRedirectRunner extends IRunner {
-    setRedirectUrl(url: string): void;
-    getRedirectUrl(): string;
-    getProxyRedirectUrl(): string;
-}
-
-interface CheckoutContextualHandlerParams {
-    accessToken: string;
-    gatewayId: string;
+interface IEventMetaData extends IEventData$1 {
+    configuration_token: string;
+    type: string;
+    account_name?: string;
+    account_number?: string;
+    card_number_last4?: string;
+    card_number_length?: number;
+    card_scheme?: string;
+    gateway_type?: string;
 }
-declare class CheckoutContextualHandler {
-    protected background: Background;
-    protected runner: IContextualRunner;
-    protected eventEmitter: EventEmitter;
-    protected params: CheckoutContextualHandlerParams;
-    protected env: string;
-    protected details: IDetails;
-    constructor(background: Background, runner: IContextualRunner, eventEmitter: EventEmitter, params: CheckoutContextualHandlerParams);
-    init(env: string): void;
-    setEnv(env: string): void;
-    protected checkToken(token: string, cb: () => void): void;
-    protected createOneTimeToken(token: string): void;
+interface IEventFinishData extends IEventData$1 {
+    payment_source: string;
+    payment_source_token?: string;
 }
-
 /**
- * Class CheckoutButton transform usual button into checkout
+ * Interface of data from validation event.
+ *
+ * @interface IFormValidation
+ *
+ * @param {string} event The name of the event.
+ * @param {string} message_source A system variable that identifies the event source.
+ * @param {string} purpose A system variable that states the purpose of the event.
+ * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
+ * @param {boolean} [form_valid] Indicates wether or not the form is valid.
+ * @param {Array<string>} [invalid_fields] Names of form fields with invalid data.
+ * @param {Array<string>} [invalid_showed_fields] Names of invalid form fields which are already displaying the error.
+ * @param {Partial<Record<CardValidatorValue | GenericValidatorValue, Array<string>>>} [validators] Object containing validator identifiers as keys and the fields subject to that validator as an array of form field names.
+ *  See list of available [Generic Vallidators]{@link GENERIC_VALIDATORS} and [Card Validators]{@link CARD_VALIDATORS},
+ */
+/**
+ * Contains basic information associated with the event and additional meta data
+ * specific to the event. E.g., card info, gateway info, etc.
+ *
+ * @interface IEventMetaData
+ *
+ * @param {string} event The name of the event.
+ * @param {string} purpose A system variable that states the purpose of the event.
+ * @param {string} message_source A system variable that identifies the event source.
+ * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
+ * @param {string} configuration_token Token received from our API with widget data
+ * @param {string} type Payment type 'card', 'bank_account'
+ * @param {string} gateway_type Gateway type
+ * @param {string} [card_number_last4] Last 4 digit of your card
+ * @param {string} [card_scheme] Card scheme, e.g., (Visa, Mastercard and American Express (AmEx))
+ * @param {number} [card_number_length] Card number length
+ * @param {string} [account_name] Bank account account name
+ * @param {string} [account_number] Bank account account number
+ * */
+/**
+ * Interface of data from event.
+ * @interface IEventAfterLoadData
+ *
+ * @param {string} event The name of the event.
+ * @param {string} purpose A system variable that states the purpose of the event.
+ * @param {string} message_source A system variable that identifies the event source.
+ * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
+ * */
+/**
+ * Interface of data from event.
+ * @interface IEventFinishData
+ *
+ * @param {string} event The name of the event.
+ * @param {string} purpose A system variable that states the purpose of the event.
+ * @param {string} message_source A system variable that identifies the event source.
+ * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
+ * @param {string} payment_source One time token. Result from this endpoint [API docs](https://docs.paydock.com/#tokens)
+ * */
+/**
+ * List of available event's name
+ * @const EVENT
+ *
+ * @type {object}
+ * @param {string} AFTER_LOAD=afterLoad
+ * @param {string} SUBMIT=submit
+ * @param {string} FINISH=finish
+ * @param {string} VALIDATION=validation
+ * @param {string} VALIDATION_ERROR=validationError
+ * @param {string} SYSTEM_ERROR=systemError
+ * @param {string} META_CHANGE=metaChange
+ * @param {string} RESIZE=resize
+ */
+/**
+ * List of available event's name
+ * @const VAULT_DISPLAY_EVENT
  *
+ * @type {object}
+ * @param {string} AFTER_LOAD=afterLoad
+ * @param {string} SYSTEM_ERROR=system_error
+ * @param {string} CVV_SECURE_CODE_REQUESTED=cvv_secure_code_requested
+ * @param {string} CARD_NUMBER_SECURE_CODE_REQUESTED=card_number_secure_code_requested
+ * @param {string} ACCESS_FORBIDDEN=access_forbidden
+ * @param {string} SESSION_EXPIRED=systemError
+ * @param {string} SYSTEM_ERROR=session_expired
+ * @param {string} OPERATION_FORBIDDEN=operation_forbidden
+ */
+/**
+ * Class HtmlMultiWidget include method for working with html
  * @constructor
+ * @extends MultiWidget
  *
- * @param {string} selector - Selector of html element.
- * @param {string} aceessToken - PayDock access token or users public key
- * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
- * @param {string} [type=PaypalClassic] - Type of gateway (PaypalClassic, Zipmoney)
+ * @param {string} selector - Selector of html element. Container for widget
+ * @param {string} publicKey - PayDock users public key
+ * @param {(Configuration | string | Configuration[] | string[])} conf - exemplar[s] Configuration class OR configuration token
  * @example
- * var widget = new CheckoutButton('#button', 'accessToken','gatewayId');
+ * var widget = new MultiWidget('#widget', 'publicKey','configurationToken'); // With a pre-created configuration token
+ *
+ * var widget = new MultiWidget('#widget', 'publicKey',['configurationToken', 'configurationToken2']); // With pre-created configuration tokens
+ *
+ * var widget = new MultiWidget('#widget', 'publicKey', new Configuration('gatewayId')); With Configuration
+ *
+ * var widget = new MultiWidget('#widget', 'publicKey',[ With Configurations
+ *      Configuration(), // default gateway_id,
+ *      Configuration('not_configured'), // without gateway,
+ *      Configuration('gatewayId'),
+ *      Configuration('gatewayId', 'bank_account')
+ * ]);
  */
-declare class CheckoutButton {
-    protected accessToken: string;
-    protected gatewayId: string;
-    protected gatewayType: GATEWAY_TYPE;
-    protected mode: CHECKOUT_MODE;
-    protected window: Window;
-    protected eventEmitter: EventEmitter;
+declare class HtmlMultiWidget extends MultiWidget {
     protected container: Container;
-    protected meta: IPayPalMeta;
-    protected runner: IContextualRunner | IRedirectRunner;
-    protected background?: Background;
-    protected checkoutHandler?: CheckoutContextualHandler;
-    protected env: string;
-    protected alias?: string;
-    /** @constructs */ constructor(selector: string, accessToken: string, gatewayId?: string, gatewayType?: GATEWAY_TYPE, mode?: CHECKOUT_MODE);
-    protected chooseRunner(gatewayType: GATEWAY_TYPE, mode: CHECKOUT_MODE): void;
-    protected buildAdditionalParams(): AdditionalParams;
-    protected initCheckout(container: Container): void;
+    protected iFrame: IFrame;
+    protected triggerElement: Trigger;
+    protected validationData: IFormValidation;
+    /** @constructs */ constructor(selector: string, publicKey: string, conf: any);
     /**
-     * This callback will be called for each event in payment source widget
+     * Loads the widget.
      *
-     * @callback listener
+     * Calling this method results in an iframe element being inserted and rendered in the DOM.
+     */
+    load(): void;
+    /**
+     * Registers a form validation callback for validation events.
      */
+    protected afterLoad(): void;
     /**
      * Listen to events of widget
      *
      * @example
      *
-     * widget.on('click', function () {
+     * ```javascript
+     * widget.on('form_submit', function (data) {
+     *      console.log(data);
+     * });
+     * ```
+     *
+     * @example
      *
+     * ```javascript
+     * widget.on('form_submit').then(function (data) {
+     *      console.log(data);
      * });
-     * @param {string} eventName - Available event names [CHECKOUT_BUTTON_EVENT]{@link CHECKOUT_BUTTON_EVENT}
-     * @param {listener} cb
+     * ```
+     *
+     * @typedef {(data: IEventData | IEventMetaData | IEventFinishData | IFormValidation) => void} EventListenerCallback
+     *
+     * @param {string} eventName - The name of the event that should be listened. Available event names [EVENT]{@link EVENT}.
+     * @param {EventListenerCallback} [cb] - A function to be invoked whenever the event occurs.
+     *
+     * @return {Promise<IEventData | IEventMetaData | IEventFinishData | IFormValidation> | void}
      */
-    on<T = object>(name: string, handler: (data: T) => void): void;
+    on(eventName: string): Promise<IEventData$1 | IEventMetaData | IEventFinishData | IFormValidation>;
+    on(eventName: string, cb: (data: IEventData$1 | IEventMetaData | IEventFinishData | IFormValidation) => void): any;
     /**
-     * Close popup window forcibly.
-     * Only for 'contextual' mode.
+     * Registers callback that will be invoked for every trigger.
      *
+     * @param {'submit_form' | 'tab'} triggers - The Widget element identifier that caused the trigger.
+     * @param {ITriggerData} data - Data that will be sent to the widget when the trigger occurs.
      */
-    close(): void;
+    trigger(triggerName: string, data?: ITriggerData): void;
     /**
-     * After finish event of checkout button, data (dataType) will be insert to input (selector)
+     * Gets a reference to the form current validation state.
      *
-     * @param {string} selector - css selector . [] #
-     * @param {string} dataType - data type of IEventCheckoutFinishData [IEventCheckoutFinishData]{@link #IEventCheckoutFinishData}.
+     * !Warning: do not directly modify the values of the returned object.
+     *
+     * @return {IFormValidation} Form validation object
      */
-    onFinishInsert(selector: string, dataType: string): void;
+    getValidationState(): IFormValidation;
     /**
-     * Method for setting meta information for checkout page
+     * Checks if a given form is valid.
      *
-     * @example
-     * button.setMeta({
-            brand_name: 'paydock',
-            reference: '15',
-            email: 'wault@paydock.com'
-        });
+     * A form is valid if all form fields are valid.
      *
-     * @param {(IPayPalMeta|IAfterpayMeta|IZipmoneyMeta)} meta - Data which can be shown on checkout page [IPayPalMeta]{@link IPayPalMeta} [IZipmoneyMeta]{@link IZipmoneyMeta} [IAfterpayMeta]{@link IAfterpayMeta}
+     * @return {boolean} Indicates wether or not form is valid.
      */
-    setMeta(meta: IPayPalMeta | IAfterpayMeta | IZipmoneyMeta): void;
+    isValidForm(): boolean;
     /**
-     * Method for setting backdrop description.
-     * Only for 'contextual' mode.
+     * Using this method you can check if a specific form field is invalid
      *
-     * @example
-     * button.setBackdropDescription('Custom description');
+     * @param {string} field - Field name
+     * @return {boolean} Field is invalid
+     */
+    isInvalidField(field?: string): boolean;
+    /**
+     * Checks if a given form field is displaying an error.
      *
-     * @param {string} text - description which can be shown in overlay of back side checkout page
+     * @param {string} field - The form field name
+     *
+     * @return {boolean} Indicates wether or not the Error message is being displayed on the associated field.
      */
-    setBackdropDescription(text: string): void;
+    isFieldErrorShowed(field?: string): boolean;
     /**
-     * Method for setting backdrop title.
-     * Only for 'contextual' mode.
+     * Checks if a given form field is valid or invalid by name.
      *
-     * @example
-     * button.setBackdropTitle('Custom title');
+     * @param {string} field - The form field name
+     * @param validator - The name of the validator.
      *
-     * @param {text} string - title which can be shown in overlay of back side checkout page
+     * @return {boolean} Indicates wether or not the field is invalid based on validator intepretation.
      */
-    setBackdropTitle(text: string): void;
+    isInvalidFieldByValidator(field: string, validator: ValidatorFieldsMapKey): boolean;
     /**
-     * Method for setting suspended redirect uri. Redirect after referred checkout.
-     * Only for 'contextual' mode.
+     * Hides the widget.
      *
-     * @param {uri} string - uri for redirect (by default)
+     * E.g., use this method to hide the widget after it loads.
+     *
+     * @param {boolean} [saveSize=false] Wether the original iframe element size should be saved before being hidden.
      */
-    setSuspendedRedirectUri(uri: string): void;
+    hide(saveSize: boolean): void;
     /**
-     * Method for setting the merchant redirect URL.
-     * Merchant's customers redirect after successfull checkout.
-     * Only for 'redirect' mode.
+     * Shows the widget.
      *
-     * @param {url} string - redirect url
+     * E.g., use this method to show the widget after it was explicitly hidden.
      */
-    setRedirectUrl(url: string): void;
-    getSuccessRedirectUri(): string;
+    show(): void;
     /**
-     * Method for disable backdrop on the page.
-     * Only for 'contextual' mode.
+     * Reloads the widget.
+     */
+    reload(): void;
+    /**
+     * Hides the specified Widget elements by their identifier.
      *
      * @example
-     * button.turnOffBackdrop();
      *
+     * ```javascript
+     * widget.hideElements(['submit_button', 'email']);
+     * ```
+     *
+     * @param {string[]} elements - List of element which can be hidden [ELEMENT]{@link ELEMENT} || [FORM_FIELD]{@link FORM_FIELD}
      */
-    turnOffBackdrop(): void;
-    protected turnOffControlBackdrop(): void;
-    protected turnOffLoaderBackdrop(): void;
-    setEnv(env: string, alias?: string): void;
-    getEnv(): string;
-    private getRunnerByMode;
-    private assertMethodSupport;
-}
-
-interface ZipmoneyRunnerParams extends AdditionalParams {
-    gateway_id: string;
-    public_key: string;
-}
-
-/**
- * Class ZipmoneyCheckoutButton is wrapper of CheckoutButton transform usual button into checkout
- *
- * @extends CheckoutButton
- *
- * @constructor
- *
- * @param {string} selector - Selector of html element.
- * @param {string} publicKey - PayDock users public key
- * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
- * @param {string} [gatewayId=default] - Checkout mode, it could be set to 'contextual' or 'redirect'. By default it 'contextual'
- * @example
- * var widget = new ZipmoneyCheckoutButton('#button', 'publicKey','gatewayId');
- */
-declare class ZipmoneyCheckoutButton extends CheckoutButton {
-    protected publicKey: string;
-    protected gatewayId: string;
-    protected mode: CHECKOUT_MODE;
-    /** @constructs */ constructor(selector: string, publicKey: string, gatewayId?: string, mode?: CHECKOUT_MODE);
+    hideElements(elements: string[]): void;
     /**
-     * Method for setting suspended redirect uri. Redirect after referred checkout
+     * Shows the specified Widget elements by their identifier.
      *
-     * The URI is used for a redirect after the checkout is complete.
-     * This can be provided, even if using in-context checkout (sdk). By default, the standard styled page will be used.
-     * If using in-context (sdk) we will not automatically redirect to this URI.
+     * @example
      *
-
-     * @param {uri} string - uri for suspended redirect (by default)
+     * ```javascript
+     * widget.showElements(['submit_button', 'email']);
+     * ```
+     *
+     * @param {string[]} elements - List of elements which can be showed [ELEMENT]{@link ELEMENT} || [FORM_FIELD]{@link FORM_FIELD}
      */
-    setSuspendedRedirectUri(uri: string): void;
+    showElements(elements: string[]): void;
     /**
-     * Method for setting the merchant redirect URL.
-     * The merchant's customers would be redirected to the specified URL
-     * at the end of ZipMoney checkout flow.
+     * Updates the form field values inside the widget.
      *
-     * Once the redirect URL would be set, the checkout flow would be immediately switched
-     * from 'contextual' mode to the 'redirect' mode.
-     * The merchant's customer would be automatically redirected to this URL after the checkout is complete.
+     * @example
      *
-     * @param {url} string - URL for redirect
+     * ```javascript
+     * widget.updateFormValues({
+     *   email: 'predefined@email.com',
+     *   card_name: 'Houston'
+     * });
+     *```
+     *
+     * @param {IFormValues} fieldValues - Fields with values
      */
-    setRedirectUrl(url: string): void;
-    protected buildAdditionalParams(): ZipmoneyRunnerParams;
-}
-
-/**
- * Class AfterpayCheckoutButton is wrapper of CheckoutButton transform usual button into checkout
- *
- * @extends CheckoutButton
- *
- * @constructor
- *
- * @param {string} selector - Selector of html element.
- * @param {string} accessToken - PayDock access-token or users public key
- * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
- * @example
- * var widget = new AfterpayCheckoutButton('#button', 'access-token','gatewayId');
- */
-declare class AfterpayCheckoutButton extends CheckoutButton {
-    protected accessToken: string;
-    protected gatewayId: string;
-    protected showETP: boolean;
-    /** @constructs */ constructor(selector: string, accessToken: string, gatewayId?: string);
+    updateFormValues(fieldValues: IFormValues): void;
     /**
-     * Method which toggles the "Enhanced Tracking Protection" warning popup to 'on' mode.
+     * Updates a single form field values inside the widget by the form field name.
      *
-     * This popup with a warning about "Enhanced Tracking Protection" limitations
-     * would be shown in the Mozilla Firefox browser version 100+
+     * @example
      *
-     * By default, the popup would not be shown, until
-     * the flag would be set to `true`
-
-     * @param {doShow} boolean - flag which toggle the popup visibility
+     * ```javascript
+     * widget.updateFormValue("card_name", "John Doe");
+     *```
+     *
+     * @param {string} key - The form field name
+     * @param {string} value - The form field value
      */
-    showEnhancedTrackingProtectionPopup(doShow: boolean): void;
-    protected buildAdditionalParams(): AdditionalParams;
-}
-
-/**
- * Class PaypalCheckoutButton is wrapper of CheckoutButton transform usual button into checkout
- *
- * @extends CheckoutButton
- *
- * @constructor
- *
- * @param {string} selector - Selector of html element.
- * @param {string} publicKey - PayDock users public key
- * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
- * @example
- * var widget = new PaypalCheckoutButton('#button', 'publicKey','gatewayId');
- */
-declare class PaypalCheckoutButton extends CheckoutButton {
-    protected publicKey: string;
-    protected gatewayId: string;
-    /** @constructs */ constructor(selector: string, publicKey: string, gatewayId?: string);
+    updateFormValue(key: string, value: string): void;
+    /**
+     * Inserts the event data (after finish event) onto the input field associated with the provided CSS selector.
+     *
+     * @param {string} selector - A CSS selector. E.g., ".my-class", "#my-id", or others
+     * @param {string} dataType - The data type of IEventData object.
+     */
+    onFinishInsert(selector: string, dataType: string): void;
+    /**
+     * Intercepts a form submission and delegates processing to the widget.
+     *
+     * An simplified example of the process:
+     * - User clicks submit button in your form
+     * - This implicitly triggers a submission to the widget
+     * - The widget submits your form
+     *
+     * @note The widget's submit button will be hidden.
+     *
+     * @param {string} selector - css selector of your form
+     *
+     * @example
+     *
+     * ```html
+     * <body>
+     *  <form id="myForm">
+     *      <input name="amount">
+     *      <button type="submit">Submit</button>
+     *  </form>
+     *  <script>
+     *     widget.interceptSubmitForm('#myForm');
+     *  </script>
+     * </body>
+     * ```
+     */
+    interceptSubmitForm(selector: string): void;
+    /**
+     * This method hides a submit button and automatically execute form submit
+     */
+    useCheckoutAutoSubmit(): void;
+    /**
+     * Use this method for resize iFrame according content height
+     *
+     * @example
+     *
+     * ```javascript
+     * widget.useAutoResize();
+     *```
+     */
+    useAutoResize(): void;
 }
 
 /**
- *
- * Class PaymentSourceWidget include method for for creating iframe url
+ * Class Widget include method for working on html and include extended by HtmlMultiWidget methods
  * @constructor
- *
- * @param {string} publicKey - PayDock users public key
- * @param {string} customer - PayDock's customer_id or customer_reference (In order to use the customer_reference, you must explicitly specify useReference as true)
- * @param {boolean} [useReference=false]
+ * @extends HtmlMultiWidget
+ * @extends MultiWidget
  *
  * @example
- * var widget = new PaymentSourceWidget('publicKey','customerId');
- * // or
- * var widget = new PaymentSourceWidget('publicKey', customerReference, true);
+ * var widget = new HtmlWidget('#widget', 'publicKey', 'gatewayID'); // short
+ *
+ * var widget = new HtmlWidget('#widget', 'publicKey', 'gatewayID', 'bank_account', 'payment_source'); // extend
+ *
+ * var widget = new HtmlWidget('#widget', 'publicKey', 'not_configured'); // without gateway
+ *
+ * @param {string} selector - Selector of html element. Container for widget
+ * @param {string} publicKey - PayDock users public key
+ * @param {string} [gatewayID=default] - ID of a gateway connected to PayDock. By default or if put 'default', it will use the selected default gateway. If put 'not_configured', it won’t use gateway to create downstream token.
+ * @param {string} [paymentType=card] - Type of payment source which shows in widget form. Available parameters : “card”, “bank_account”.
+ * @param {string} [purpose=payment_source] - Purpose of widget form. Available parameters: ‘payment_source’, ‘card_payment_source_with_cvv’, ‘card_payment_source_without_cvv’
  */
-declare class PaymentSourceWidget {
-    protected link: Link;
-    protected configs: Configuration[];
-    protected configTokens: string[];
-    protected publicKey: string;
-    /** @constructs */ constructor(accessToken: string, queryToken: string);
+declare class HtmlWidget extends HtmlMultiWidget {
+    /** @constructs */ constructor(selector: string, publicKey: string, gatewayID?: string, paymentType?: string, purpose?: PURPOSE);
     /**
-     * Object contain styles for widget
+     * Destination, where customer will receive all successful responses.
+     * Response will contain “data” object with “payment_source” or other parameters, in depending on 'purpose'
      *
      * @example
-     * widget.setStyles({
-     *       background_color: 'rgb(0, 0, 0)',
-     *       border_color: 'yellow',
-     *       text_color: '#FFFFAA',
-     *       icon_size: 'small',
-     *       font_size: '20px'
-     *   });
-     * @param {IStyles} fields - name of styles which can be shown in widget [STYLE]{@link STYLE}
+     * widget.setWebHookDestination('http://google.com');
+     *
+     * @param {string} url - Your endpoint for post request.
      */
-    setStyles(styles: IStyles$1): void;
-    setStyle(param: string, value: string): void;
+    setWebHookDestination(url: string): void;
     /**
-     * Current method can set custom ID to identify the data in the future
+     * URL to which the Customer will be redirected to after the success finish
      *
      * @example
-     * widget.setRefId('id');
-     *
-     * @param {string} refId - custom id
-     */
-    setRefId(refId: string): void;
-    /**
-     * Current method can set limit for payment sources count. In case when limit sets less then general count will be shown pagination buttons prev and next.
+     * widget.setSuccessRedirectUrl('google.com/search?q=success');
      *
-     * @param {string} count - payment source count
+     * @param {string}  url
      */
-    setLimit(count: number): void;
+    setSuccessRedirectUrl(url: string): 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
+     * URL to which the Customer will be redirected to if an error is triggered in the process of operation
      *
      * @example
-     * widget.setEnv('production');
-     * @param {string} env - sandbox, production
-     * @param {string} [alias] - Own domain alias
-     */
-    setEnv(env: string, alias?: string): void;
-    getEnv(): void;
-    /**
-     * Method for getting iframe's url
+     * widget.setErrorRedirectUrl('google.com/search?q=error');
+     *
+     * @param {string} url
      */
-    getIFrameUrl(): string;
+    setErrorRedirectUrl(url: string): void;
     /**
-     * Show payment source inside widget only with requested gateway ids
+     *  Set list with widget form field, which will be shown in form. Also you can set the required validation for these fields
      *
+     * @example
+     * widget.setFormFields(['phone', 'email', 'first_name*']);
      *
-     * @param {string[]} ids - List of gateway_id
+     * @param {string[]} fields - name of fields which can be shown in a widget.
+     * If after a name of a field, you put “*”, this field will be required on client-side. (For validation, you can specify any fields, even those that are shown by default: card_number, expiration, etc... ) [FORM_FIELD]{@link FORM_FIELD}
      */
-    filterByGatewayIds(ids: string[]): void;
+    setFormFields(fields: string[]): void;
     /**
+     * The method to set the full configuration for the all specific form elements (visibility, required, label, placeholder, value)
+     * You can also use the other method for the partial configuration like: setFormFields, setFormValues, setFormPlaceholder, setFormLabel
      *
-     * Show payment source inside widget only with requested payment source types
+     * @example
+     *   widget.setFormElements([
+     *       {
+     *           field:  'card_name*',
+     *           placeholder: 'Input your card holder name...',
+     *           label: 'Card Holder Name',
+     *           value: 'Houston',
+     *       },
+     *       {
+     *           field:  'email',
+     *           placeholder: 'Input your email, like test@example.com',
+     *           label: 'Email for the receipt',
+     *           value: 'predefined@email.com',
+     *       },
+     *   ])
      *
-     * @param types - List of payment source types. Available parameters [PAYMENT_TYPE]{@link PAYMENT_TYPE}
+     * @param { Object[] } elements - List of elements
+     * @param { string } elements[].field - Field name of element. If after a name of a field, you put “*”, this field will be required on client-side. (For validation, you can specify any fields, even those that are shown by default: card_number, expiration, etc... ) [FORM_FIELD]{@link FORM_FIELD}
+     * @param { string } elements[].placeholder - Set custom placeholders in form fields
+     * @param { string } elements[].label - Set a custom labels near the form field
+     * @param { string } elements[].value - Set predefined values for the form field
      */
-    filterByTypes(types: string[]): void;
+    setFormElements(elements: IFormElement[]): void;
+    setFormElement(element: IFormElement): void;
     /**
-     * Method for setting a custom language code
+     * The method to set meta information for the checkout page
      *
      * @example
-     * config.setLanguage('en');
-     * @param {string} code - ISO 639-1
+     * config.setMeta({
+            brand_name: 'paydock',
+            reference: '15',
+            email: 'wault@paydock.com'
+        });
+     *
+     * @param {IPayPalMeta | IBamboraMeta} object - data which can be shown on checkout page [IPayPalMeta]{@link IPayPalMeta} [IBamboraMeta]{@link IBamboraMeta}
      */
-    setLanguage(code: any): void;
+    setMeta(meta: IPayPalMeta | IBamboraMeta): void;
+    setGiftCardScheme(giftCardScheme: any, processingNetwork: any): void;
 }
 
-interface IEventSelectData extends IEventData$1 {
-    customer_id: string;
-    payment_source_id: string;
-    gateway_id: string;
-    primary: boolean;
-    card_number_last4?: string;
-    card_scheme?: string;
-    checkout_email?: string;
-    gateway_type?: string;
-    payment_source_type: string;
-    account_name?: string;
-    account_number?: string;
-}
-interface IEventPaginationData extends IEventData$1 {
-    total_item: number;
-    skip: number;
-    limit: number;
-}
-interface IEventAfterLoadData extends IEventData$1 {
-    total_item: number;
-    skip: number;
-    limit: number;
-}
-interface IEventSizeData extends IEventData$1 {
-    height: number;
-    width: number;
-}
-/**
- * Interface of data from event.
- *
- * @interface IEventSelectData
- *
- * @param {string} event
- * @param {string} purpose
- * @param {string} message_source
- * @param {string} [ref_id]
- * @param {string} customer_id
- * @param {string} payment_source_id
- * @param {string} gateway_id
- * @param {boolean} primary
- * @param {string} [widget_id]
- * @param {string} [card_number_last4]
- * @param {string} [card_scheme]
- * @param {string} gateway_type
- * @param {string} [checkout_email]
- * @param {string} payment_source_type
- * @param {string} [account_name]
- * @param {string} [account_number]
- * */
 /**
- * Interface of data from event.
- *
- * @interface IEventPaginationData
+ * Contains basic information associated with the event.
  *
- * @param {string} event
- * @param {string} purpose
- * @param {string} message_source
- * @param {string} [ref_id]
- * @param {number} total_item
- * @param {number} skip
- * @param {number} limit
- * */
-/**
- * Interface of data from event.
+ * Including event (name), source of the message, purpose and a unique identifier
+ * for the event.
  *
- * @interface IEventAfterLoadData
+ * @interface IEventData
  *
  * @param {string} event The name of the event.
- * @param {string} purpose A system variable that states the purpose of the event.
  * @param {string} message_source A system variable that identifies the event source.
- * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
- * @param {number} total_item Pagination param. Total item count
- * @param {number} skip Pagination param. Skip items from first item
- * @param {number} limit Pagination param. Query limit
- * */
-/**
- * Interface of data from event.
- * @interface IEventFinishData
- *
- * @param {string} event The name of the event.
  * @param {string} purpose A system variable that states the purpose of the event.
- * @param {string} message_source A system variable that identifies the event source.
  * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
- * */
+ */
+interface IEventData$1 {
+    event: string;
+    message_source: string;
+    purpose: PURPOSE;
+    widget_id: string;
+    data?: any;
+    ref_id?: string;
+}
+declare const EVENT$1: {
+    readonly AFTER_LOAD: "afterLoad";
+    readonly SUBMIT: "submit";
+    readonly FINISH: "finish";
+    readonly VALIDATION_ERROR: "validationError";
+    readonly SYSTEM_ERROR: "systemError";
+    readonly ERROR: "error";
+    /** @deprecated */
+    readonly CHECKOUT_SUCCESS: "checkoutSuccess";
+    readonly CHECKOUT_READY: "checkoutReady";
+    readonly CHECKOUT_ERROR: "checkoutError";
+    readonly CHECKOUT_COMPLETED: "checkoutCompleted";
+    readonly CHECKOUT_POPUP_OPEN: "checkoutPopupOpen";
+    readonly CHECKOUT_POPUP_CLOSE: "checkoutPopupClose";
+    readonly RECOGNITION_TOKEN_REQUESTED: "recognitionTokenRequested";
+    readonly RECOGNITION_TOKEN_DROPPED: "recognitionTokenDropped";
+    readonly VALIDATION: "validation";
+    readonly SELECT: "select";
+    readonly UNSELECT: "unselect";
+    readonly NEXT: "next";
+    readonly PREV: "prev";
+    readonly META_CHANGE: "metaChange";
+    readonly RESIZE: "resize";
+    readonly CHARGE_AUTH_SUCCESS: "chargeAuthSuccess";
+    readonly CHARGE_AUTH_REJECT: "chargeAuthReject";
+    readonly CHARGE_AUTH_CANCELLED: "chargeAuthCancelled";
+    readonly ADDITIONAL_DATA_SUCCESS: "additionalDataCollectSuccess";
+    readonly ADDITIONAL_DATA_REJECT: "additionalDataCollectReject";
+    readonly CHARGE_AUTH: "chargeAuth";
+    readonly DISPATCH_SUCCESS: "dispatchSuccess";
+    readonly DISPATCH_ERROR: "dispatchError";
+};
+type EventTypes = typeof EVENT$1[keyof typeof EVENT$1];
+interface IErrorEvent {
+    event: EventTypes;
+    status?: number;
+    data: {
+        _message: string;
+    } & Record<string, any>;
+}
+interface Listener {
+    event: string;
+    listener: (event: any) => void;
+    widget_id: string;
+}
+declare type Listeners = Listener[];
+declare class IFrameEvent {
+    protected listeners: Listeners;
+    constructor(subject: Window | null);
+    emit(data: IEventData$1): void;
+    on<T>(eventName: string, widgetId: string, cb: (data: T) => void): void;
+    clear(): void;
+    private subscribe;
+}
+
+declare class EventEmitter {
+    private events;
+    emit<T>(eventName: string, data?: T): void;
+    emitWithResult<T, R>(eventName: string, data?: T): Promise<R[]>;
+    subscribe<T>(eventName: string, handler: (data: T) => void): () => void;
+}
+
+declare class Standalone3dsService {
+    protected container: Container;
+    protected eventEmitter: EventEmitter;
+    protected env: string;
+    protected alias: string;
+    constructor(container: Container, eventEmitter: any);
+    load(token: string, options: {
+        title: string;
+    }): void;
+    setEnv(env: string, alias?: string): void;
+}
+
 /**
-* Interface of data from event.
-* @interface IEventSizeData
-*
-* @param {number} event The name of the event.
-* @param {number} purpose A system variable that states the purpose of the event.
-* @param {string} message_source A system variable that identifies the event source.
-* @param {string} [ref_id] Custom unique value that identifies result of processed operation.
-* @param {number} height Height of iFrame
-* @param {number} width Width of iFrame
-* */
+ * List of available token's content formats
+ * @enum TOKEN_FORMAT
+ *
+ * @type {object}
+ * @param {string} HTML=html
+ */
+declare enum TOKEN_FORMAT {
+    HTML = "html",
+    URL = "url",
+    STANDALONE_3DS = "standalone_3ds"
+}
 /**
  * List of available event's name
- *
  * @const EVENT
  *
  * @type {object}
- * @param {string} AFTER_LOAD=afterLoad
- * @param {string} SYSTEM_ERROR=systemError
- * @param {string} SELECT=select
- * @param {string} UNSELECT=unselect
- * @param {string} NEXT=next
- * @param {string} PREV=prev
- * @param {string} META_CHANGE=metaChange
- * @param {string} RESIZE=resize
+ * @param {string} CHARGE_AUTH_SUCCESS=chargeAuthSuccess
+ * @param {string} CHARGE_AUTH_REJECT=chargeAuthReject
+ * @param {string} ADDITIONAL_DATA_SUCCESS=additionalDataCollectSuccess
+ * @param {string} ADDITIONAL_DATA_REJECT=additionalDataCollectReject
+ * @param {string} CHARGE_AUTH=chargeAuth
  */
 /**
- * Class HtmlPaymentSourceWidget include method for working on html
+ * List of available event's name for Standalone 3ds flow
+ * @const STANDALONE_3DS_EVENT
+ *
+ * @type {object}
+ * @param {string} CHARGE_AUTH_SUCCESS=chargeAuthSuccess
+ * @param {string} CHARGE_AUTH_REJECT=chargeAuthReject
+ * @param {string} CHARGE_AUTH_DECOUPLED=chargeAuthDecoupled
+ * @param {string} CHARGE_AUTH_CHALLENGE=chargeAuthChallenge
+ * @param {string} CHARGE_AUTH_INFO=chargeAuthInfo
+ * @param {string} ERROR=error
+*/
+/**
+ * Class Canvas3ds include method for working on html
  * @constructor
- * @extends PaymentSourceWidget
  *
  * @param {string} selector - Selector of html element. Container for widget
- * @param {string} publicKey - PayDock users public key
- * @param {string} queryToken - PayDock's query token that represents params to search customer by id or reference
+ * @param {string} token - Pre authorized token
  * @example
- *  * var widget = new HtmlPaymentSourceWidget('#widget', 'publicKey','queryToken');
-
+ * var widget = new Canvas3ds('#widget', 'token');
+ *
+ *
  */
-declare class HtmlPaymentSourceWidget extends PaymentSourceWidget {
+declare class Canvas3ds {
+    protected link: Link;
+    protected configs: Configuration[];
+    protected publicKey: string;
+    protected token: {
+        content: string;
+        format: TOKEN_FORMAT;
+        charge_3ds_id: string;
+    };
+    protected standalone3dsService: Standalone3dsService;
     protected container: Container;
     protected iFrame: IFrame;
     protected event: IFrameEvent;
-    /** @constructs */ constructor(selector: string, publicKey: string, queryToken: string);
+    protected eventEmitter: EventEmitter;
+    /** @constructs */ constructor(selector: string, token: string);
+    protected static extractToken(token: string): {
+        content: string;
+        format: TOKEN_FORMAT;
+        charge_3ds_id: string;
+    };
     /**
      * The final method to beginning, the load process of widget to html
      *
      */
     load(): void;
     /**
-     * This callback will be called for each event in payment source widget
-     *
-     * @callback listener--PaymentSourceWidget
-     * @param {IEventData | IEventSelectData | IEventPaginationData | IEventAfterLoadData} response
-     */
-    /**
-     * Listen to events of widget
+     * Current method can change environment. By default environment = sandbox.
+     * Also we can change domain alias for this environment. By default domain_alias = paydock.com
      *
      * @example
-     *
-     * widget.on('select', function (data) {
-     *      console.log(data);
-     * });
-     * @param {string} eventName - Available event names [EVENT]{@link EVENT}
-     * @param {listener--PaymentSourceWidget} cb
+     * widget.setEnv('production');
+     * @param {string} env - sandbox, production
+     * @param {string} [alias] - Own domain alias
      */
-    on(eventName: string, cb: (data: IEventData$1 | IEventSelectData | IEventPaginationData | IEventAfterLoadData | IEventSizeData) => void): void;
+    setEnv(env: string, alias?: string): void;
+    getEnv(): string;
+    on(eventName: string): Promise<IEventData$1>;
+    on(eventName: string, cb: (data: IEventData$1) => void): any;
     /**
      * Using this method you can hide widget after load
      * @param {boolean} [saveSize=false] - using this param you can save iframe's size
@@ -1693,1183 +1832,1061 @@ declare class HtmlPaymentSourceWidget extends PaymentSourceWidget {
      *
      */
     reload(): void;
-    /**
-     * After select event of widget, data (dataType) will be insert to input (selector)
-     *
-     * @param {string} selector - css selector . [] #
-     * @param {string} dataType - data type of [IEventSelectData]{@link IEventSelectData}.
-     */
-    onSelectInsert(selector: string, dataType: string): void;
 }
 
-declare const TYPE: {
-    EXTERNAL_CHECKOUT_TOKEN: string;
-    CHECKOUT_TOKEN: string;
-    BANK_ACCOUNT: string;
-    CARD: string;
+/**
+ * @type {object}
+ * @param {string} CLICK=click
+ * @param {string} POPUP_REDIRECT=popup_redirect
+ * @param {string} ERROR=error
+ * @param {string} ACCEPTED=accepted
+ * @param {string} FINISH=finish
+ * @param {string} CLOSE=close
+ */
+declare const CHECKOUT_BUTTON_EVENT: {
+    CLICK: string;
+    POPUP_REDIRECT: string;
+    REDIRECT: string;
+    ERROR: string;
+    REFERRED: string;
+    DECLINED: string;
+    CANCELLED: string;
+    ACCEPTED: string;
+    FINISH: string;
+    CLOSE: string;
 };
-interface IBody {
-    gateway_id: string;
-    type: string;
-    checkout_token?: string;
-}
-declare class Builder extends HttpCore {
-    private body;
-    constructor(gatewayID: string, checkoutToken: string, type: string);
-    constructor(gatewayID: string, externalCheckoutToken: string, type: string);
-    constructor(gatewayID: string, card: any, type: string);
-    constructor(gatewayID: string, bankAccount: any, type: string);
-    protected getLink(): string;
-    send(accessToken: string, cb: (token: string) => void, errorCb?: (error: any) => void): void;
-    getConfigs(): IBody;
-}
-
-interface IBaseSRCMeta {
-    customizations?: IStyles;
-    dpa_data?: {
-        dpa_presentation_name?: string;
-        dpa_uri?: string;
-    };
-    dpa_transaction_options?: {
-        dpa_locale?: string;
-        dpa_accepted_billing_countries?: string[];
-        consumer_name_requested?: boolean;
-        consumer_email_address_requested?: boolean;
-        consumer_phone_number_requested?: boolean;
-        transaction_amount?: {
-            transaction_amount?: number;
-            transaction_currency_code?: string;
-        };
-        merchant_order_id?: string;
-        merchant_category_code?: string;
-        merchant_country_code?: string;
-    };
+/**
+ * @type {object}
+ * @param {string} CONTEXTUAL=contextual
+ * @param {string} REDIRECT=redirect
+ */
+declare enum CHECKOUT_MODE {
+    CONTEXTUAL = "contextual",
+    REDIRECT = "redirect"
 }
-interface PhoneNumber {
-    country_code: string;
-    phone_number: string;
+/**
+ * @type {object}
+ * @param {string} ZIPMONEY=Zipmoney
+ * @param {string} PAYPAL=PaypalClassic
+ * @param {string} AFTERPAY=Afterpay
+ */
+declare enum GATEWAY_TYPE {
+    ZIPMONEY = "Zipmoney",
+    PAYPAL = "PaypalClassic",
+    AFTERPAY = "Afterpay"
 }
-interface Customer {
-    email?: string;
-    phone?: {
-        country_code?: string;
-        phone?: string;
-    };
-    first_name?: string;
-    last_name?: string;
-}
-interface IClickToPayMeta extends IBaseSRCMeta {
-    dpa_data?: IBaseSRCMeta['dpa_data'] & {
-        dpa_address?: string;
-        dpa_email_address?: string;
-        dpa_phone_number?: PhoneNumber;
-        dpa_logo_uri?: string;
-        dpa_supported_email_address?: string;
-        dpa_supported_phone_number?: PhoneNumber;
-        dpa_uri?: string;
-        dpa_support_uri?: string;
-        application_type?: 'WEB_BROWSER' | 'MOBILE_APP';
-    };
-    disable_summary_screen?: boolean;
-    co_brand_names?: string[];
-    checkout_experience?: 'WITHIN_CHECKOUT' | 'PAYMENT_SETTINGS';
-    services?: 'INLINE_CHECKOUT' | 'INLINE_INSTALLMENTS';
-    dpa_transaction_options?: IBaseSRCMeta['dpa_transaction_options'] & {
-        dpa_billing_preference?: MASTERCARD_DPA_SHIPPING_BILLING_PREFERENCE;
-        payment_options?: Array<{
-            dynamic_data_type?: string;
-        }>;
-        order_type?: MASTERCARD_ORDER_TYPE;
-        three_ds_preference?: string;
-        confirm_payment?: boolean;
-    };
-    customer?: Customer;
-    unaccepted_card_type?: 'CREDIT' | 'DEBIT';
-    recognition_token?: string;
-}
-type MASTERCARD_DPA_SHIPPING_BILLING_PREFERENCE = 'FULL' | 'POSTAL_COUNTRY' | 'NONE';
-type MASTERCARD_ORDER_TYPE = 'SPLIT_SHIPMENT' | 'PREFERRED_CARD';
-interface IStyles {
-    primary_button_color?: string;
-    secondary_button_color?: string;
-    primary_button_text_color?: string;
-    secondary_button_text_color?: string;
-    font_family?: string;
-    enable_src_popup?: boolean;
+interface IEventCheckoutFinishData {
+    payment_source_token: string;
+    checkout_email: string;
+    checkout_holder: string;
+    gateway_type: string;
 }
 
-declare class ApiChargeInternal {
-    protected api: ApiInternal;
-    constructor(api: ApiInternal);
-    walletCapture(payload: WalletCaptureBody): Promise<WalletCaptureResponse>;
-    walletCallback(payload: WalletCallbackBody): Promise<WalletCallbackResponse>;
-    standalone3dsProcess(payload: Standalone3dsProcessBody): Promise<ProcessAuthenticationResponse>;
-    standalone3dsHandle(): Promise<HandleResponseInterface>;
-}
-interface WalletCaptureResponse {
-    id: string;
-    amount: number;
-    currency: string;
-    status: string;
+/**
+ * Class Background create overlay for checkout
+ *
+ * @example
+ * var overlay = new Background();
+ */
+declare class Background {
+    protected description: string;
+    protected title: string;
+    protected overlay: HTMLElement;
+    protected style: HTMLStyleElement;
+    protected eventEmitter: EventEmitter;
+    protected showControl: boolean;
+    protected showLoader: boolean;
+    constructor();
+    initControl(): void;
+    initLoader(): void;
+    private eventHandler;
+    clear(): void;
+    private createLoader;
+    protected createTemplate(): void;
+    private createStyles;
+    setBackdropDescription(text: string): void;
+    setBackdropTitle(text: string): void;
+    onTrigger(triggerName: string, cb: () => void): void;
+    isInit(): boolean;
+    hideContinueControl(): void;
+    turnOffControl(): void;
+    turnOffLoader(): void;
 }
-interface WalletCaptureBody {
-    payment_method_id?: string;
-    customer?: {
-        payment_source?: {
-            type?: string;
-            card_name?: string;
-            card_scheme?: string;
-            card_number_last4?: string;
-            expire_month?: number;
-            expire_year?: number;
-            address_line1?: string;
-            address_line2?: string;
-            address_city?: string;
-            address_postcode?: string;
-            address_state?: string;
-            address_country?: string;
-            external_payer_id?: string;
-            ref_token?: string;
-            wallet_express?: boolean;
-        };
-    };
+
+declare type SuccessCb = (data: any, status: number) => void;
+declare type ErrorCb = (err: any, status: number) => void;
+declare abstract class HttpCore {
+    private env;
+    constructor();
+    setEnv(env: string, alias?: string): void;
+    getEnv(): string;
+    protected getUrl(): string;
+    protected create(accessToken: string, data: any, cb: SuccessCb, errorCb: ErrorCb): void;
+    protected get(accessToken: string, cb: SuccessCb, errorCb: ErrorCb): void;
+    protected parser(text: any, status: number, cb: SuccessCb, errorCb: ErrorCb): void;
+    protected abstract getLink(): string;
 }
-interface WalletCallbackBody {
-    request_type: string;
+
+interface IBody$1 {
+    gateway_id: string;
+    success_redirect_url: string;
+    error_redirect_url: string;
+    redirect_url: string;
+    meta: IPayPalMeta;
+    description?: string;
 }
-interface WalletCallbackResponse {
-    id: string;
-    status: string;
-    callback_method: string;
-    callback_rel: string;
-    callback_url: string;
+interface ICheckout {
+    gateway_id: string;
+    checkout_type: string;
+    gateway_type: string;
+    link: string;
+    reference_id: string;
+    token: string;
+    mode?: string;
 }
-interface Standalone3dsProcessBody {
-    charge_3ds_id: string;
+declare class Builder$1 extends HttpCore {
+    private body;
+    constructor(gatewayID: string, successRedirectUrl: string, errorRedirectUrl: string);
+    protected getLink(): string;
+    setDescriptions(text: string): void;
+    setMeta(meta: IPayPalMeta): void;
+    getConfigs(): IBody$1;
+    send(publicKey: string, cb: (checkout: ICheckout) => void, errorCb?: (error: any, code: string) => void): void;
 }
-interface HandleResponseInterface {
+
+interface IDetails {
+    checkout_email: string;
+    checkout_holder: string;
     status: string;
-    error: string;
-    result: {
-        reference: string;
-        reference_2: string;
-        identifier: string;
-        identifier_2: string;
-        identifier_3: string;
-        identifier_4: string;
-        identifier_5: string;
-        type: string;
-        status: string;
-        status_2: string;
-        status_code: string;
-        ref_token: string;
-        cancellation: string;
-        count: string;
-        version: string;
-        whitelist: {
-            status: string;
-            source: string;
-        };
-        result: string;
-    };
+    gateway_type: string;
 }
-interface ProcessAuthenticationResponse {
-    status: string;
-    error?: string;
-    result?: {
-        challenge: string;
-        challenge_url: string;
-        decoupled_challenge: boolean;
-        frictionless: boolean;
-        identifier: string;
-        identifier_3: string;
-        identifier_4: string;
-        reference: string;
-        reference_2: string;
-        secondary_url: string;
-        skipped: boolean;
-        status: string;
-        type: string;
-        version: string;
-        description?: string;
-    };
+declare class Checker extends HttpCore {
+    token: string;
+    constructor(token: string);
+    protected getLink(): string;
+    send(accessToken: string, cb: (details: IDetails) => void, errorCb?: (error: any) => void): void;
 }
 
-declare class ApiGatewayInternal {
-    protected api: ApiInternal;
-    constructor(api: ApiInternal);
-    getWalletConfig(gateway_id: string): Promise<GetWalletConfigResponse>;
-}
-interface GetWalletConfigResponse {
-    type: string;
-    mode: string;
-    credentials?: object;
+type AdditionalParams = Record<string, string | number | boolean>;
+interface IRunner {
+    next(checkoutData: ICheckout, params?: AdditionalParams): void;
+    error(error: string, code: string, cb: (close: boolean) => void): void;
+    getSuccessRedirectUri(): string;
+    getErrorRedirectUri(): string;
+    setEnv(env: string, alias?: string): void;
 }
 
-declare class ApiServiceInternal {
-    protected api: ApiInternal;
-    constructor(api: ApiInternal);
-    getConfig(service_id: string): Promise<GetConfigResponse>;
-}
-interface GetConfigResponse {
-    type: string;
-    merchant: string;
-    username: string;
-    password: string;
-    certificate: string;
-    certificate_passphrase: string;
+interface IDispatcherData {
+    message_source: string;
+    event: string;
 }
 
-declare class ApiCheckoutInternal {
-    protected api: ApiInternal;
-    constructor(api: ApiInternal);
-    instructions(session_id: string): Observable<object>;
-    private getInstructionLink;
-    callback(payload: Object): Promise<Object>;
-    status(id: string): Promise<Object>;
+interface IContextualRunner extends IRunner {
+    run(): void;
+    isRunning(): boolean;
+    continue(): void;
+    stop(): void;
+    onStop(cb: () => void): void;
+    onCheckout<T extends IDispatcherData>(event: string, cb: (checkout: ICheckout, data?: T) => void): void;
+    setBackgroundTitle(text: string): void;
+    setBackgroundDescription(text: string): void;
+    turnOffBackdrop(): void;
+    setSuspendedRedirectUri(uri: string): void;
 }
 
-declare class ApiInternal extends ApiBase {
-    charge(): ApiChargeInternal;
-    service(): ApiServiceInternal;
-    checkout(): ApiCheckoutInternal;
-    gateway(): ApiGatewayInternal;
+interface IRedirectRunner extends IRunner {
+    setRedirectUrl(url: string): void;
+    getRedirectUrl(): string;
+    getProxyRedirectUrl(): string;
 }
 
-interface SRCProvider {
-    load(): void;
-    getEnv(): string;
-    hideButton?(saveSize: boolean): void;
-    showButton?(): void;
-    hideCheckout?(saveSize: boolean): void;
-    showCheckout?(): void;
-    reload(): void;
-    useAutoResize?(): void;
+interface CheckoutContextualHandlerParams {
+    accessToken: string;
+    gatewayId: string;
+}
+declare class CheckoutContextualHandler {
+    protected background: Background;
+    protected runner: IContextualRunner;
+    protected eventEmitter: EventEmitter;
+    protected params: CheckoutContextualHandlerParams;
+    protected env: string;
+    protected details: IDetails;
+    constructor(background: Background, runner: IContextualRunner, eventEmitter: EventEmitter, params: CheckoutContextualHandlerParams);
+    init(env: string): void;
+    setEnv(env: string): void;
+    protected checkToken(token: string, cb: () => void): void;
+    protected createOneTimeToken(token: string): void;
 }
 
-declare abstract class SRC {
-    protected iframe_selector: string;
-    protected service_id: string;
-    protected public_key_or_access_token: string;
-    protected meta: IClickToPayMeta;
+/**
+ * Class CheckoutButton transform usual button into checkout
+ *
+ * @constructor
+ *
+ * @param {string} selector - Selector of html element.
+ * @param {string} aceessToken - PayDock access token or users public key
+ * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
+ * @param {string} [type=PaypalClassic] - Type of gateway (PaypalClassic, Zipmoney)
+ * @example
+ * var widget = new CheckoutButton('#button', 'accessToken','gatewayId');
+ */
+declare class CheckoutButton {
+    protected accessToken: string;
+    protected gatewayId: string;
+    protected gatewayType: GATEWAY_TYPE;
+    protected mode: CHECKOUT_MODE;
+    protected window: Window;
     protected eventEmitter: EventEmitter;
+    protected container: Container;
+    protected meta: IPayPalMeta;
+    protected runner: IContextualRunner | IRedirectRunner;
+    protected background?: Background;
+    protected checkoutHandler?: CheckoutContextualHandler;
     protected env: string;
     protected alias?: string;
-    protected api: ApiInternal;
-    protected provider: SRCProvider;
-    protected autoResize: boolean;
-    protected style: IStyles;
-    constructor(iframe_selector: string, service_id: string, public_key_or_access_token: string, meta: IClickToPayMeta);
+    /** @constructs */ constructor(selector: string, accessToken: string, gatewayId?: string, gatewayType?: GATEWAY_TYPE, mode?: CHECKOUT_MODE);
+    protected chooseRunner(gatewayType: GATEWAY_TYPE, mode: CHECKOUT_MODE): void;
+    protected buildAdditionalParams(): AdditionalParams;
+    protected initCheckout(container: Container): void;
     /**
-    * Object contain styles for widget - call before `.load()`.
-    *
-    * @example
-    * widget.setStyles({
-    *     enable_src_popup: true
-    *     primary_button_color: 'red',
-    *     secondary_button_color: 'blue',
-    *     primary_button_text_color: 'white',
-    *     secondary_button_text_color: 'white',
-    *     font_family: 'Arial',
-    * });
-    * @param {IStyles} fields - name of styles which can be shown in widget [STYLE]{@link STYLE}
-    */
-    setStyles(styles: IStyles): void;
-    private setStyle;
-    load(): void;
+     * This callback will be called for each event in payment source widget
+     *
+     * @callback listener
+     */
     /**
-     * Current method can change environment. By default environment = sandbox.
-     * Also we can change domain alias for this environment. By default domain_alias = paydock.com
+     * Listen to events of widget
      *
      * @example
-     * SRC.setEnv('production');
-     * @param {string} env - sandbox, production
-     * @param {string} [alias] - Own domain alias
+     *
+     * widget.on('click', function () {
+     *
+     * });
+     * @param {string} eventName - Available event names [CHECKOUT_BUTTON_EVENT]{@link CHECKOUT_BUTTON_EVENT}
+     * @param {listener} cb
      */
-    setEnv(env: string, alias?: string): void;
+    on<T = object>(name: string, handler: (data: T) => void): void;
     /**
-     * Method to read the current environment
+     * Close popup window forcibly.
+     * Only for 'contextual' mode.
      *
-     * @example
-     * SRC.getEnv();
      */
-    getEnv(): string;
-    on(eventName: string): Promise<any>;
-    on(eventName: string, cb: (data: any) => void): any;
+    close(): void;
     /**
-     * Using this method you can hide checkout after load and button click
-     * @param {boolean} [saveSize=false] - using this param you can save iframe's size (if applicable)
+     * After finish event of checkout button, data (dataType) will be insert to input (selector)
+     *
+     * @param {string} selector - css selector . [] #
+     * @param {string} dataType - data type of IEventCheckoutFinishData [IEventCheckoutFinishData]{@link #IEventCheckoutFinishData}.
+     */
+    onFinishInsert(selector: string, dataType: string): void;
+    /**
+     * Method for setting meta information for checkout page
      *
      * @example
-     * SRC.hideCheckout();
+     * button.setMeta({
+            brand_name: 'paydock',
+            reference: '15',
+            email: 'wault@paydock.com'
+        });
+     *
+     * @param {(IPayPalMeta|IAfterpayMeta|IZipmoneyMeta)} meta - Data which can be shown on checkout page [IPayPalMeta]{@link IPayPalMeta} [IZipmoneyMeta]{@link IZipmoneyMeta} [IAfterpayMeta]{@link IAfterpayMeta}
      */
-    hideCheckout(saveSize: boolean): void;
+    setMeta(meta: IPayPalMeta | IAfterpayMeta | IZipmoneyMeta): void;
     /**
-     * Using this method you can show checkout after using hideCheckout method
+     * Method for setting backdrop description.
+     * Only for 'contextual' mode.
      *
      * @example
-     * SRC.showCheckout()
+     * button.setBackdropDescription('Custom description');
+     *
+     * @param {string} text - description which can be shown in overlay of back side checkout page
      */
-    showCheckout(): void;
+    setBackdropDescription(text: string): void;
     /**
-     * Using this method you can reload the whole checkout
+     * Method for setting backdrop title.
+     * Only for 'contextual' mode.
      *
      * @example
-     * SRC.reload()
+     * button.setBackdropTitle('Custom title');
+     *
+     * @param {text} string - title which can be shown in overlay of back side checkout page
      */
-    reload(): void;
+    setBackdropTitle(text: string): void;
     /**
-     * Use this method for resize checkout iFrame according to content height, if applicable
+     * Method for setting suspended redirect uri. Redirect after referred checkout.
+     * Only for 'contextual' mode.
+     *
+     * @param {uri} string - uri for redirect (by default)
+     */
+    setSuspendedRedirectUri(uri: string): void;
+    /**
+     * Method for setting the merchant redirect URL.
+     * Merchant's customers redirect after successfull checkout.
+     * Only for 'redirect' mode.
+     *
+     * @param {url} string - redirect url
+     */
+    setRedirectUrl(url: string): void;
+    getSuccessRedirectUri(): string;
+    /**
+     * Method for disable backdrop on the page.
+     * Only for 'contextual' mode.
      *
      * @example
-     * SRC.useAutoResize();
+     * button.turnOffBackdrop();
      *
      */
-    useAutoResize(): void;
+    turnOffBackdrop(): void;
+    protected turnOffControlBackdrop(): void;
+    protected turnOffLoaderBackdrop(): void;
+    setEnv(env: string, alias?: string): void;
+    getEnv(): string;
+    private getRunnerByMode;
+    private assertMethodSupport;
+}
+
+interface ZipmoneyRunnerParams extends AdditionalParams {
+    gateway_id: string;
+    public_key: string;
 }
 
 /**
- * Class ClickToPay include methods for interacting with the ClickToPay checkout and Manual Card option
+ * Class ZipmoneyCheckoutButton is wrapper of CheckoutButton transform usual button into checkout
  *
- * @extends SRC
+ * @extends CheckoutButton
  *
  * @constructor
  *
- * @param {string} iframe_selector - Selector of html element. Container for Click To Pay checkout iFrame.
- * @param {string} service_id - Card Scheme Service ID
- * @param {string} public_key_or_access_token - Paydock public key or Access Token
- * @param {IClickToPayMeta} meta - Data that configures the Click To Pay checkout
+ * @param {string} selector - Selector of html element.
+ * @param {string} publicKey - PayDock users public key
+ * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
+ * @param {string} [gatewayId=default] - Checkout mode, it could be set to 'contextual' or 'redirect'. By default it 'contextual'
  * @example
- * var mastercardSRC = new ClickToPay('#checkoutIframe', 'service_id', 'public_key', {});
- *
+ * var widget = new ZipmoneyCheckoutButton('#button', 'publicKey','gatewayId');
  */
-declare class ClickToPay extends SRC {
-    protected iframe_selector: string;
-    protected service_id: string;
-    protected public_key_or_access_token: string;
-    protected meta: IClickToPayMeta;
-    /** @constructs */ constructor(iframe_selector: string, service_id: string, public_key_or_access_token: string, meta: IClickToPayMeta);
+declare class ZipmoneyCheckoutButton extends CheckoutButton {
+    protected publicKey: string;
+    protected gatewayId: string;
+    protected mode: CHECKOUT_MODE;
+    /** @constructs */ constructor(selector: string, publicKey: string, gatewayId?: string, mode?: CHECKOUT_MODE);
     /**
-     * The final method after configuring the SRC to start the load process of Click To Pay checkout
+     * Method for setting suspended redirect uri. Redirect after referred checkout
+     *
+     * The URI is used for a redirect after the checkout is complete.
+     * This can be provided, even if using in-context checkout (sdk). By default, the standard styled page will be used.
+     * If using in-context (sdk) we will not automatically redirect to this URI.
      *
+
+     * @param {uri} string - uri for suspended redirect (by default)
      */
-    load(): void;
+    setSuspendedRedirectUri(uri: string): void;
+    /**
+     * Method for setting the merchant redirect URL.
+     * The merchant's customers would be redirected to the specified URL
+     * at the end of ZipMoney checkout flow.
+     *
+     * Once the redirect URL would be set, the checkout flow would be immediately switched
+     * from 'contextual' mode to the 'redirect' mode.
+     * The merchant's customer would be automatically redirected to this URL after the checkout is complete.
+     *
+     * @param {url} string - URL for redirect
+     */
+    setRedirectUrl(url: string): void;
+    protected buildAdditionalParams(): ZipmoneyRunnerParams;
 }
 
-interface ITriggerData {
-    configuration_token?: string;
-    tab_number?: number;
-    elements?: string;
-    form_values?: string;
-}
 /**
- * Interface for classes that represent a trigger data.
- * @interface ITriggerData
+ * Class AfterpayCheckoutButton is wrapper of CheckoutButton transform usual button into checkout
  *
- * @param {string} [configuration_token]
- * @param {string} [tab_number]
- * @param {string} [elements]
- * @param {string} [form_values]
- * */
-/**
- * List of available triggers
+ * @extends CheckoutButton
  *
- * @type {object}
- * @param {string} SUBMIT_FORM=submit_form
- * @param {string} CHANGE_TAB=tab
- * @param {string} HIDE_ELEMENTS=hide_elements
- * @param {string} SHOW_ELEMENTS=show_elements
- * @param {string} REFRESH_CHECKOUT=refresh_checkout
- * @param {string} UPDATE_FORM_VALUES=update_form_values
- * @param {string} INIT_CHECKOUT=init_checkout
- */
-declare const TRIGGER: {
-    SUBMIT_FORM: string;
-    CHANGE_TAB: string;
-    HIDE_ELEMENTS: string;
-    SHOW_ELEMENTS: string;
-    REFRESH_CHECKOUT: string;
-    UPDATE_FORM_VALUES: string;
-    INIT_CHECKOUT: string;
-};
-declare class Trigger {
-    protected iFrame: IFrame;
-    constructor(iFrame: IFrame);
-    push(triggerName: string, data?: ITriggerData): void;
-}
+ * @constructor
+ *
+ * @param {string} selector - Selector of html element.
+ * @param {string} accessToken - PayDock access-token or users public key
+ * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
+ * @example
+ * var widget = new AfterpayCheckoutButton('#button', 'access-token','gatewayId');
+ */
+declare class AfterpayCheckoutButton extends CheckoutButton {
+    protected accessToken: string;
+    protected gatewayId: string;
+    protected showETP: boolean;
+    /** @constructs */ constructor(selector: string, accessToken: string, gatewayId?: string);
+    /**
+     * Method which toggles the "Enhanced Tracking Protection" warning popup to 'on' mode.
+     *
+     * This popup with a warning about "Enhanced Tracking Protection" limitations
+     * would be shown in the Mozilla Firefox browser version 100+
+     *
+     * By default, the popup would not be shown, until
+     * the flag would be set to `true`
 
-declare class VaultDisplayIframeEvent extends IFrameEvent {
-    on<T>(eventName: string, widgetId: string, cb: (data: T) => void): void;
+     * @param {doShow} boolean - flag which toggle the popup visibility
+     */
+    showEnhancedTrackingProtectionPopup(doShow: boolean): void;
+    protected buildAdditionalParams(): AdditionalParams;
 }
 
 /**
- * Class VaultDisplayWidget include method for working on html
+ * Class PaypalCheckoutButton is wrapper of CheckoutButton transform usual button into checkout
+ *
+ * @extends CheckoutButton
+ *
  * @constructor
  *
+ * @param {string} selector - Selector of html element.
+ * @param {string} publicKey - PayDock users public key
+ * @param {string} [gatewayId=default] - PayDock's gatewayId. By default or if put 'default', it will use the selected default gateway
  * @example
- * var widget = new VaultDisplayWidget('#widget', 'token');
+ * var widget = new PaypalCheckoutButton('#button', 'publicKey','gatewayId');
+ */
+declare class PaypalCheckoutButton extends CheckoutButton {
+    protected publicKey: string;
+    protected gatewayId: string;
+    /** @constructs */ constructor(selector: string, publicKey: string, gatewayId?: string);
+}
+
+/**
  *
- * @param {string} selector - Selector of html element. Container for widget
- * @param {string} token - One time token
+ * Class PaymentSourceWidget include method for for creating iframe url
+ * @constructor
+ *
+ * @param {string} publicKey - PayDock users public key
+ * @param {string} customer - PayDock's customer_id or customer_reference (In order to use the customer_reference, you must explicitly specify useReference as true)
+ * @param {boolean} [useReference=false]
+ *
+ * @example
+ * var widget = new PaymentSourceWidget('publicKey','customerId');
+ * // or
+ * var widget = new PaymentSourceWidget('publicKey', customerReference, true);
  */
-declare class VaultDisplayWidget {
-    protected container: Container;
-    protected iFrame: IFrame;
-    protected triggerElement: Trigger;
-    protected event: VaultDisplayIframeEvent;
-    protected validationData: IFormValidation;
-    protected vaultDisplayToken: string;
+declare class PaymentSourceWidget {
     protected link: Link;
-    protected configs: any[];
-    /** @constructs */ constructor(selector: string, token: string);
+    protected configs: Configuration[];
+    protected configTokens: string[];
+    protected publicKey: string;
+    /** @constructs */ constructor(accessToken: string, queryToken: string);
     /**
-     * Current method can change environment. By default environment = sandbox.
+     * Object contain styles for widget
+     *
+     * @example
+     * widget.setStyles({
+     *       background_color: 'rgb(0, 0, 0)',
+     *       border_color: 'yellow',
+     *       text_color: '#FFFFAA',
+     *       icon_size: 'small',
+     *       font_size: '20px'
+     *   });
+     * @param {IStyles} fields - name of styles which can be shown in widget [STYLE]{@link STYLE}
+     */
+    setStyles(styles: IStyles$1): void;
+    setStyle(param: string, value: string): void;
+    /**
+     * Current method can set custom ID to identify the data in the future
+     *
+     * @example
+     * widget.setRefId('id');
+     *
+     * @param {string} refId - custom id
+     */
+    setRefId(refId: string): void;
+    /**
+     * Current method can set limit for payment sources count. In case when limit sets less then general count will be shown pagination buttons prev and next.
+     *
+     * @param {string} count - payment source count
+     */
+    setLimit(count: number): 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
      *
      * @example
-     * widget.setEnv('production', 'paydock.com');
+     * widget.setEnv('production');
      * @param {string} env - sandbox, production
      * @param {string} [alias] - Own domain alias
      */
     setEnv(env: string, alias?: string): void;
+    getEnv(): void;
     /**
-     * This callback will be called for each event in widget
+     * Method for getting iframe's url
+     */
+    getIFrameUrl(): string;
+    /**
+     * Show payment source inside widget only with requested gateway ids
      *
-     * @callback listener
-     * @param {IEventData} response
+     *
+     * @param {string[]} ids - List of gateway_id
      */
-    on(eventName: string): Promise<IEventData$1>;
-    on(eventName: string, cb: (data: IEventData$1) => void): any;
+    filterByGatewayIds(ids: string[]): void;
     /**
-     * Object contain styles for widget
      *
-     * @example
-     * widget.setStyles({
-     *       background_color: '#fff',
-     *       border_color: 'yellow',
-     *       text_color: '#FFFFAA',
-     *       button_color: 'rgba(255, 255, 255, 0.9)',
-     *       font_size: '20px',
-     *       fort_family: 'fantasy'
-     *   });
-     * @param {VaultDisplayStyle} fields - name of styles which can be shown in widget [VAULT_DISPLAY_STYLE]{@link VAULT_DISPLAY_STYLE}
+     * Show payment source inside widget only with requested payment source types
+     *
+     * @param types - List of payment source types. Available parameters [PAYMENT_TYPE]{@link PAYMENT_TYPE}
      */
-    setStyles(styles: IStyles$1): void;
-    setStyle(param: string, value: string): void;
+    filterByTypes(types: string[]): void;
     /**
-     * The final method to beginning, the load process of widget to html
+     * Method for setting a custom language code
      *
+     * @example
+     * config.setLanguage('en');
+     * @param {string} code - ISO 639-1
      */
-    load(): void;
+    setLanguage(code: any): void;
 }
 
-interface IWalletServiceUpdateData {
-    amount: number;
-    shipping_options?: IShippingOption[];
-}
-interface IWalletServiceUpdate {
-    success: boolean;
-    body?: IWalletServiceUpdateData;
-}
-interface IPaymentMethod {
-    payment_method_id?: string;
-    device?: string;
-    customer: {
-        payer_name: string;
-        payer_email: string;
-        payer_phone: string;
-        payment_source: {
-            wallet_type: WALLET_TYPE;
-            card_name: string;
-            type: string;
-            card_scheme: string;
-            card_number_last4: string;
-            expire_month: number;
-            expire_year: number;
-            address_line1: string;
-            address_line2: string;
-            address_city: string;
-            address_postcode: string;
-            address_state: string;
-            address_country: string;
-            ref_token?: string;
-        };
-    };
-    shipping?: {
-        method?: string;
-        options?: IShippingOption[];
-        address_line1?: string;
-        address_line2?: string;
-        address_city?: string;
-        address_postcode?: string;
-        address_state?: string;
-        address_country?: string;
-        address_company?: string;
-        address_origin_postcode?: string;
-        contact?: {
-            first_name?: string;
-            last_name?: string;
-            email?: string;
-            phone?: string;
-            phone2?: string;
-        };
-    };
-}
-interface IUnavailableWalletEventBody {
-}
-interface IPaymentMethodSelectedWalletEventBody {
-    data: IPaymentMethod;
-    onSuccess: () => void;
-    onError: (message?: string) => void;
-}
-interface IWalletService {
-    load(container: Container): Promise<void>;
-    close?(): void;
-    update(data: IWalletServiceUpdate): void;
-    enable(): void;
-    disable(): void;
-    setEnv(env: string): any;
-    on(eventName: string, cb?: (data: IUnavailableWalletEventBody | IPaymentMethodSelectedWalletEventBody | any) => void): any;
+interface IEventSelectData extends IEventData$1 {
+    customer_id: string;
+    payment_source_id: string;
+    gateway_id: string;
+    primary: boolean;
+    card_number_last4?: string;
+    card_scheme?: string;
+    checkout_email?: string;
+    gateway_type?: string;
+    payment_source_type: string;
+    account_name?: string;
+    account_number?: string;
 }
-
-interface IWalletPaymentSuccessful {
-    id: string;
-    amount: number;
-    currency: string;
-    status: string;
-    payer_name?: string;
-    payer_email?: string;
-    payer_phone?: string;
+interface IEventPaginationData extends IEventData$1 {
+    total_item: number;
+    skip: number;
+    limit: number;
 }
-interface IWalletUnavailable {
-    wallet?: WALLET_TYPE;
+interface IEventAfterLoadData extends IEventData$1 {
+    total_item: number;
+    skip: number;
+    limit: number;
 }
-interface IWalletOnClick {
-    attachResult: (result: Promise<void> | boolean) => void;
-}
-interface IWalletUpdate {
-    wallet_response_code?: string;
-    wallet_order_id?: string;
-    wallet_session_id?: string;
-    payment_source?: {
-        wallet_payment_method_id?: string;
-        card_number_last4?: string;
-        card_scheme?: string;
-    };
-    wallet_loyalty_account?: {
-        id?: string;
-        barcode?: string;
-    };
-    shipping?: {
-        address_line1?: string;
-        address_line2?: string;
-        address_postcode?: string;
-        address_city?: string;
-        address_state?: string;
-        address_country?: string;
-        address_company?: string;
-        post_office_box_number?: string;
-        wallet_address_id?: string;
-        wallet_address_name?: string;
-        wallet_address_created_timestamp?: string;
-        wallet_address_updated_timestamp?: string;
-    };
-    selected_shipping_option?: IShippingOption;
-}
-
-declare enum EventEnum {
-    UNAVAILABLE = "unavailable",
-    UPDATE = "update",
-    PAYMENT_SUCCESSFUL = "paymentSuccessful",
-    PAYMENT_ERROR = "paymentError",
-    PAYMENT_IN_REVIEW = "paymentInReview",
-    AUTH_TOKENS_CHANGED = "authTokensChanged",
-    ON_CLICK = "onClick",
-    ON_CHECKOUT_OPEN = "onCheckoutOpen",
-    ON_CHECKOUT_CLOSE = "onCheckoutClose"
-}
-
-interface IEventData<T = any> {
-    event: string;
-    data: T;
-}
-interface IWalletPaymentSuccessfulEvent extends IEventData<IWalletPaymentSuccessful> {
-    event: EventEnum.PAYMENT_SUCCESSFUL;
-}
-interface IWalletUpdateEvent extends IEventData<IWalletUpdate> {
-    event: EventEnum.UPDATE;
-}
-interface IWalletUnavailableEvent extends IEventData<IWalletUnavailable> {
-    event: EventEnum.UNAVAILABLE;
-}
-interface IWalletOnClickEvent extends IEventData<IWalletOnClick> {
-    event: EventEnum.ON_CLICK;
-}
-interface IWalletUpdateData {
-    success: boolean;
+interface IEventSizeData extends IEventData$1 {
+    height: number;
+    width: number;
 }
 /**
- * Class WalletButtons to work with different E-Wallets within html (currently supports Apple Pay, Google Pay, Google Pay™ and Apple Pay via Stripe, Flypay, Flypay V2, Paypal, Afterpay)
+ * Interface of data from event.
+ *
+ * @interface IEventSelectData
+ *
+ * @param {string} event
+ * @param {string} purpose
+ * @param {string} message_source
+ * @param {string} [ref_id]
+ * @param {string} customer_id
+ * @param {string} payment_source_id
+ * @param {string} gateway_id
+ * @param {boolean} primary
+ * @param {string} [widget_id]
+ * @param {string} [card_number_last4]
+ * @param {string} [card_scheme]
+ * @param {string} gateway_type
+ * @param {string} [checkout_email]
+ * @param {string} payment_source_type
+ * @param {string} [account_name]
+ * @param {string} [account_number]
+ * */
+/**
+ * Interface of data from event.
+ *
+ * @interface IEventPaginationData
+ *
+ * @param {string} event
+ * @param {string} purpose
+ * @param {string} message_source
+ * @param {string} [ref_id]
+ * @param {number} total_item
+ * @param {number} skip
+ * @param {number} limit
+ * */
+/**
+ * Interface of data from event.
+ *
+ * @interface IEventAfterLoadData
+ *
+ * @param {string} event The name of the event.
+ * @param {string} purpose A system variable that states the purpose of the event.
+ * @param {string} message_source A system variable that identifies the event source.
+ * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
+ * @param {number} total_item Pagination param. Total item count
+ * @param {number} skip Pagination param. Skip items from first item
+ * @param {number} limit Pagination param. Query limit
+ * */
+/**
+ * Interface of data from event.
+ * @interface IEventFinishData
+ *
+ * @param {string} event The name of the event.
+ * @param {string} purpose A system variable that states the purpose of the event.
+ * @param {string} message_source A system variable that identifies the event source.
+ * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
+ * */
+/**
+* Interface of data from event.
+* @interface IEventSizeData
+*
+* @param {number} event The name of the event.
+* @param {number} purpose A system variable that states the purpose of the event.
+* @param {string} message_source A system variable that identifies the event source.
+* @param {string} [ref_id] Custom unique value that identifies result of processed operation.
+* @param {number} height Height of iFrame
+* @param {number} width Width of iFrame
+* */
+/**
+ * List of available event's name
+ *
+ * @const EVENT
+ *
+ * @type {object}
+ * @param {string} AFTER_LOAD=afterLoad
+ * @param {string} SYSTEM_ERROR=systemError
+ * @param {string} SELECT=select
+ * @param {string} UNSELECT=unselect
+ * @param {string} NEXT=next
+ * @param {string} PREV=prev
+ * @param {string} META_CHANGE=metaChange
+ * @param {string} RESIZE=resize
+ */
+/**
+ * Class HtmlPaymentSourceWidget include method for working on html
  * @constructor
+ * @extends PaymentSourceWidget
  *
+ * @param {string} selector - Selector of html element. Container for widget
+ * @param {string} publicKey - PayDock users public key
+ * @param {string} queryToken - PayDock's query token that represents params to search customer by id or reference
  * @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.
+ *  * var widget = new HtmlPaymentSourceWidget('#widget', 'publicKey','queryToken');
+
  */
-declare class WalletButtons {
+declare class HtmlPaymentSourceWidget extends PaymentSourceWidget {
     protected container: Container;
-    protected api: ApiInternal;
-    protected service: IWalletService;
-    protected eventEmitter: EventEmitter;
-    protected hasUpdateHandler: boolean;
-    /** @constructs */ constructor(selector: string, chargeToken: string, meta: IWalletMeta);
+    protected iFrame: IFrame;
+    protected event: IFrameEvent;
+    /** @constructs */ constructor(selector: string, publicKey: string, queryToken: string);
     /**
-     * Initializes the availability checks and inserts the button if possible.
-     * Otherwise function onUnavailable(handler: VoidFunction) will be called.
+     * The final method to beginning, the load process of widget to html
      *
-     * @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 Flypay, 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 });
-     *  });
+     * This callback will be called for each event in payment source widget
      *
-     * @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"
-     *                   }
-     *               ]
-     *          }
-     *       });
-     *  });
+     * @callback listener--PaymentSourceWidget
+     * @param {IEventData | IEventSelectData | IEventPaginationData | IEventAfterLoadData} response
      */
-    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()`.
+     * Listen to events of widget
      *
      * @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();
+     * widget.on('select', function (data) {
+     *      console.log(data);
+     * });
+     * @param {string} eventName - Available event names [EVENT]{@link EVENT}
+     * @param {listener--PaymentSourceWidget} cb
      */
-    enable(): void;
+    on(eventName: string, cb: (data: IEventData$1 | IEventSelectData | IEventPaginationData | IEventAfterLoadData | IEventSizeData) => void): 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.
+     * Using this method you can hide widget after load
+     * @param {boolean} [saveSize=false] - using this param you can save iframe's size
      */
-    onAuthTokensChanged(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
+    hide(saveSize: boolean): 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 and ApplePay wallet buttons at the moment.
-     *
-     * @example
-     * button.onClick((data) => {
-     *      performValidationLogic();
-     * });
+     * Using this method you can show widget after using hide method
      *
-     * @param {listener} handler - Function to be called when the wallet button is clicked.
      */
-    onClick(handler: (data: IWalletOnClickEvent) => void): () => void;
+    show(): 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');
-     * });
+     * Using this method you can reload widget
      *
-     * @param {listener} handler - Function to be called when the wallet checkout opens.
      */
-    onCheckoutOpen(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
+    reload(): 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');
-     * });
+     * After select event of widget, data (dataType) will be insert to input (selector)
      *
-     * @param {listener} handler - Function to be called when the wallet checkout closes.
+     * @param {string} selector - css selector . [] #
+     * @param {string} dataType - data type of [IEventSelectData]{@link IEventSelectData}.
      */
-    onCheckoutClose(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
-    private setupServiceCallbacks;
-    private setupUnavailableCallback;
-    private setupUpdateCallback;
-    private setupOnClickCallback;
-    private setupOnCheckoutOpenCallback;
-    private setupOnCheckoutCloseCallback;
-    private setupWalletCallback;
-    private setupPaymentCallback;
-    private setupPaymentSuccessCallback;
-    private setupPaymentInReviewCallback;
-    private setupPaymentErrorCallback;
-    private setupAuthTokensChangedCallback;
+    onSelectInsert(selector: string, dataType: string): void;
 }
 
-/**
- * Current constant include available type of element for styling
- * @const STYLABLE_ELEMENT
- * @type {object}
- * @param {string} INPUT=input.
- *   These states are available: [STYLABLE_ELEMENT_STATE.ERROR]{@link STYLABLE_ELEMENT_STATE}, [STYLABLE_ELEMENT_STATE.FOCUS]{@link STYLABLE_ELEMENT_STATE}.
- *   These styles are available [IElementStyleInput]{@link IElementStyleInput}
- * @param {string} SUBMIT_BUTTON=submit_button
- *   These states are available: [STYLABLE_ELEMENT_STATE.HOVER]{@link STYLABLE_ELEMENT_STATE}.
- *   These styles are available [IElementStyleSubmitButton]{@link IElementStyleSubmitButton}
- * @param {string} LABEL=label.
- *   These styles are available [IElementStyleLabel]{@link IElementStyleLabel}
- * @param {string} TITLE=title.
- *   These styles are available [IElementStyleTitle]{@link IElementStyleTitle}
- * @param {string} TITLE_DESCRIPTION=title_description.
- *   These styles are available [IElementStyleTitleDescription]{@link IElementStyleTitleDescription}
- * */
-declare const STYLABLE_ELEMENT: {
-    INPUT: string;
-    SUBMIT_BUTTON: string;
-    LABEL: string;
-    TITLE: string;
-    TITLE_DESCRIPTION: string;
-};
-/**
- * Current constant include available states of element for styling
- * @const STYLABLE_ELEMENT_STATE
- * @type {object}
- * @param {string} ERROR=error client|server validation. This state applies to: input
- * @param {string} FOCUS=focus focus. This state applies to: input
- * @param {string} HOVER=hover focus. This state applies to: submit_button
- * */
-declare const STYLABLE_ELEMENT_STATE: {
-    ERROR: string;
-    FOCUS: string;
-    HOVER: string;
+declare const TYPE: {
+    EXTERNAL_CHECKOUT_TOKEN: string;
+    CHECKOUT_TOKEN: string;
+    BANK_ACCOUNT: string;
+    CARD: string;
 };
-interface IElementStyleInput {
-    color?: string;
-    border?: string;
-    border_radius?: string;
-    background_color?: string;
-    height?: string;
-    text_decoration?: string;
-    font_size?: string;
-    font_family?: string;
-    padding?: string;
-    margin?: string;
-    transition?: string;
-    line_height?: string;
-    font_weight?: string;
+interface IBody {
+    gateway_id: string;
+    type: string;
+    checkout_token?: string;
 }
-interface IElementStyleSubmitButton {
-    color?: string;
-    border?: string;
-    border_radius?: string;
-    background_color?: string;
-    text_decoration?: string;
-    font_size?: string;
-    font_family?: string;
-    padding?: string;
-    margin?: string;
-    transition?: string;
-    line_height?: string;
-    font_weight?: string;
-    opacity?: string;
+declare class Builder extends HttpCore {
+    private body;
+    constructor(gatewayID: string, checkoutToken: string, type: string);
+    constructor(gatewayID: string, externalCheckoutToken: string, type: string);
+    constructor(gatewayID: string, card: any, type: string);
+    constructor(gatewayID: string, bankAccount: any, type: string);
+    protected getLink(): string;
+    send(accessToken: string, cb: (token: string) => void, errorCb?: (error: any) => void): void;
+    getConfigs(): IBody;
 }
-interface IElementStyleLabel {
-    color?: string;
-    text_decoration?: string;
-    font_size?: string;
+
+interface IBaseSRCMeta {
+    customizations?: IStyles;
+    dpa_data?: {
+        dpa_presentation_name?: string;
+        dpa_uri?: string;
+    };
+    dpa_transaction_options?: {
+        dpa_locale?: string;
+        dpa_accepted_billing_countries?: string[];
+        consumer_name_requested?: boolean;
+        consumer_email_address_requested?: boolean;
+        consumer_phone_number_requested?: boolean;
+        transaction_amount?: {
+            transaction_amount?: number;
+            transaction_currency_code?: string;
+        };
+        merchant_order_id?: string;
+        merchant_category_code?: string;
+        merchant_country_code?: string;
+    };
+}
+interface PhoneNumber {
+    country_code: string;
+    phone_number: string;
+}
+interface Customer {
+    email?: string;
+    phone?: {
+        country_code?: string;
+        phone?: string;
+    };
+    first_name?: string;
+    last_name?: string;
+}
+interface IClickToPayMeta extends IBaseSRCMeta {
+    dpa_data?: IBaseSRCMeta['dpa_data'] & {
+        dpa_address?: string;
+        dpa_email_address?: string;
+        dpa_phone_number?: PhoneNumber;
+        dpa_logo_uri?: string;
+        dpa_supported_email_address?: string;
+        dpa_supported_phone_number?: PhoneNumber;
+        dpa_uri?: string;
+        dpa_support_uri?: string;
+        application_type?: 'WEB_BROWSER' | 'MOBILE_APP';
+    };
+    disable_summary_screen?: boolean;
+    co_brand_names?: string[];
+    checkout_experience?: 'WITHIN_CHECKOUT' | 'PAYMENT_SETTINGS';
+    services?: 'INLINE_CHECKOUT' | 'INLINE_INSTALLMENTS';
+    dpa_transaction_options?: IBaseSRCMeta['dpa_transaction_options'] & {
+        dpa_billing_preference?: MASTERCARD_DPA_SHIPPING_BILLING_PREFERENCE;
+        payment_options?: Array<{
+            dynamic_data_type?: string;
+        }>;
+        order_type?: MASTERCARD_ORDER_TYPE;
+        three_ds_preference?: string;
+        confirm_payment?: boolean;
+    };
+    customer?: Customer;
+    unaccepted_card_type?: 'CREDIT' | 'DEBIT';
+    recognition_token?: string;
+}
+type MASTERCARD_DPA_SHIPPING_BILLING_PREFERENCE = 'FULL' | 'POSTAL_COUNTRY' | 'NONE';
+type MASTERCARD_ORDER_TYPE = 'SPLIT_SHIPMENT' | 'PREFERRED_CARD';
+interface IStyles {
+    primary_button_color?: string;
+    secondary_button_color?: string;
+    primary_button_text_color?: string;
+    secondary_button_text_color?: string;
     font_family?: string;
-    line_height?: string;
-    font_weight?: string;
-    padding?: string;
-    margin?: string;
+    enable_src_popup?: boolean;
+}
+
+declare class ApiChargeInternal {
+    protected api: ApiInternal;
+    constructor(api: ApiInternal);
+    walletCapture(payload: WalletCaptureBody): Promise<WalletCaptureResponse>;
+    walletCallback(payload: WalletCallbackBody): Promise<WalletCallbackResponse>;
+    standalone3dsProcess(payload: Standalone3dsProcessBody): Promise<ProcessAuthenticationResponse>;
+    standalone3dsHandle(): Promise<HandleResponseInterface>;
+}
+interface WalletCaptureResponse {
+    id: string;
+    amount: number;
+    currency: string;
+    status: string;
+}
+interface WalletCaptureBody {
+    payment_method_id?: string;
+    customer?: {
+        payment_source?: {
+            type?: string;
+            card_name?: string;
+            card_scheme?: string;
+            card_number_last4?: string;
+            expire_month?: number;
+            expire_year?: number;
+            address_line1?: string;
+            address_line2?: string;
+            address_city?: string;
+            address_postcode?: string;
+            address_state?: string;
+            address_country?: string;
+            external_payer_id?: string;
+            ref_token?: string;
+            wallet_express?: boolean;
+        };
+    };
+}
+interface WalletCallbackBody {
+    request_type: string;
+}
+interface WalletCallbackResponse {
+    id: string;
+    status: string;
+    callback_method: string;
+    callback_rel: string;
+    callback_url: string;
+}
+interface Standalone3dsProcessBody {
+    charge_3ds_id: string;
+}
+interface HandleResponseInterface {
+    status: string;
+    error: string;
+    result: {
+        reference: string;
+        reference_2: string;
+        identifier: string;
+        identifier_2: string;
+        identifier_3: string;
+        identifier_4: string;
+        identifier_5: string;
+        type: string;
+        status: string;
+        status_2: string;
+        status_code: string;
+        ref_token: string;
+        cancellation: string;
+        count: string;
+        version: string;
+        whitelist: {
+            status: string;
+            source: string;
+        };
+        result: string;
+    };
+}
+interface ProcessAuthenticationResponse {
+    status: string;
+    error?: string;
+    result?: {
+        challenge: string;
+        challenge_url: string;
+        decoupled_challenge: boolean;
+        frictionless: boolean;
+        identifier: string;
+        identifier_3: string;
+        identifier_4: string;
+        reference: string;
+        reference_2: string;
+        secondary_url: string;
+        skipped: boolean;
+        status: string;
+        type: string;
+        version: string;
+        description?: string;
+    };
+}
+
+declare class ApiGatewayInternal {
+    protected api: ApiInternal;
+    constructor(api: ApiInternal);
+    getWalletConfig(gateway_id: string): Promise<GetWalletConfigResponse>;
+}
+interface GetWalletConfigResponse {
+    type: string;
+    mode: string;
+    credentials?: object;
+}
+
+declare class ApiServiceInternal {
+    protected api: ApiInternal;
+    constructor(api: ApiInternal);
+    getConfig(service_id: string): Promise<GetConfigResponse>;
+}
+interface GetConfigResponse {
+    type: string;
+    merchant: string;
+    username: string;
+    password: string;
+    certificate: string;
+    certificate_passphrase: string;
 }
-interface IElementStyleTitle {
-    color?: string;
-    text_decoration?: string;
-    font_size?: string;
-    font_family?: string;
-    line_height?: string;
-    font_weight?: string;
-    padding?: string;
-    margin?: string;
+
+declare class ApiCheckoutInternal {
+    protected api: ApiInternal;
+    constructor(api: ApiInternal);
+    instructions(session_id: string): Observable<object>;
+    private getInstructionLink;
+    callback(payload: Object): Promise<Object>;
+    status(id: string): Promise<Object>;
 }
-interface IElementStyleTitleDescription {
-    color?: string;
-    text_decoration?: string;
-    font_size?: string;
-    font_family?: string;
-    line_height?: string;
-    font_weight?: string;
-    padding?: string;
-    margin?: string;
+
+declare class ApiInternal extends ApiBase {
+    charge(): ApiChargeInternal;
+    service(): ApiServiceInternal;
+    checkout(): ApiCheckoutInternal;
+    gateway(): ApiGatewayInternal;
 }
 
-/**
- *
- * Class MultiWidget include method for for creating iframe url
- * @constructor
- *
- * @param {string} accessToken - PayDock users access token or public key
- * @param {(Configuration | string | Configuration[] | string[])} conf - exemplar[s] Configuration class OR configuration token
- *
- * @example
- * var widget = new MultiWidget('accessToken','configurationToken'); // With a pre-created configuration token
- *
- * var widget = new MultiWidget('accessToken',['configurationToken', 'configurationToken2']); // With pre-created configuration tokens
- *
- * var widget = new MultiWidget('accessToken', new Configuration('gatewayId')); With Configuration
- *
- * var widget = new MultiWidget('accessToken',[ With Configurations
- *      Configuration('gatewayId'),
- *      Configuration('gatewayId', 'bank_account')
- * ]);
- */
-declare class MultiWidget {
-    protected link: Link;
-    protected configs: Configuration[];
-    protected configTokens: string[];
-    protected accessToken: string;
-    constructor(accessToken: string, confTokens: string[]);
-    constructor(accessToken: string, confToken: string);
-    constructor(accessToken: string, configs: Configuration[]);
-    constructor(accessToken: string, conf: Configuration);
-    /**
-     * Object contain styles for widget
-     *
-     * @example
-     * widget.setStyles({
-     *       background_color: 'rgb(0, 0, 0)',
-     *       border_color: 'yellow',
-     *       text_color: '#FFFFAA',
-     *       button_color: 'rgba(255, 255, 255, 0.9)',
-     *       font_size: '20px'
-     *       fort_family: 'fantasy'
-     *   });
-     * @param {IStyles} fields - name of styles which can be shown in widget [STYLE]{@link STYLE}
-     */
-    setStyles(styles: IStyles$1): void;
+interface SRCProvider {
+    load(): void;
+    getEnv(): string;
+    hideButton?(saveSize: boolean): void;
+    showButton?(): void;
+    hideCheckout?(saveSize: boolean): void;
+    showCheckout?(): void;
+    reload(): void;
+    useAutoResize?(): void;
+}
+
+declare abstract class SRC {
+    protected iframe_selector: string;
+    protected service_id: string;
+    protected public_key_or_access_token: string;
+    protected meta: IClickToPayMeta;
+    protected eventEmitter: EventEmitter;
+    protected env: string;
+    protected alias?: string;
+    protected api: ApiInternal;
+    protected provider: SRCProvider;
+    protected autoResize: boolean;
+    protected style: IStyles;
+    constructor(iframe_selector: string, service_id: string, public_key_or_access_token: string, meta: IClickToPayMeta);
     /**
-     * Method to set a country code mask for the phone input.
-     *
-     * @example
-     * widget.usePhoneCountryMask();
-     *
-     * @example
-     * widget.usePhoneCountryMask({
-     *       default_country: 'au',
-     *       preferred_countries: ['au', 'gb'],
-     *       only_countries: ['au', 'gb', 'us', 'ua']
-     *   });
-     *
-     * @param {object} [options] - Options for configure the phone mask.
-     * @param {string} [options.default_country] - Set a default country for the mask.
-     * @param {Array.<string>} [options.preferred_countries] - Set list of preferred countries for the top of the select box .
-     * @param {Array.<string>} [options.only_countries] - Set list of countries to show in the select box.
-     */
-    usePhoneCountryMask(options?: ICountryPhoneMask): void;
-    setStyle(param: string, value: string): void;
+    * Object contain styles for widget - call before `.load()`.
+    *
+    * @example
+    * widget.setStyles({
+    *     enable_src_popup: true
+    *     primary_button_color: 'red',
+    *     secondary_button_color: 'blue',
+    *     primary_button_text_color: 'white',
+    *     secondary_button_text_color: 'white',
+    *     font_family: 'Arial',
+    * });
+    * @param {IStyles} fields - name of styles which can be shown in widget [STYLE]{@link STYLE}
+    */
+    setStyles(styles: IStyles): void;
+    private setStyle;
+    load(): void;
     /**
-     * Method for set different texts inside the widget
+     * Current method can change environment. By default environment = sandbox.
+     * Also we can change domain alias for this environment. By default domain_alias = paydock.com
      *
      * @example
-     * widget.setTexts({
-     *       title: 'Your card',
-     *       finish_text: 'Payment resource was successfully accepted',
-     *       title_description: '* indicates required field',
-     *       submit_button: 'Save',
-     *       submit_button_processing: 'Load...',
-     *   });
-     *
-     * @param {ITexts} fields - name of text items which can be shown in widget [TEXT]{@link TEXT}
+     * SRC.setEnv('production');
+     * @param {string} env - sandbox, production
+     * @param {string} [alias] - Own domain alias
      */
-    setTexts(texts: ITexts): void;
-    setText(param: string, value: string): void;
-    setElementStyle(element: string, state: string, styles: IElementStyleInput | IElementStyleSubmitButton | IElementStyleLabel): any;
-    setElementStyle(element: string, styles: IElementStyleInput | IElementStyleSubmitButton | IElementStyleLabel | IElementStyleTitle | IElementStyleTitleDescription): any;
-    /**
-   * The method to set the predefined values for the form fields inside the widget
-   *
-   * @example
-   *   widget.setFormValues({
-   *       email: 'predefined@email.com',
-   *       card_name: 'Houston'
-   *   });
-   *
-   * @param { Object } fieldValues - Key of object is one of [FORM_FIELD]{@link FORM_FIELD}, The object value is what we are expecting
-   */
-    setFormValues(fieldValues: IFormValues): void;
-    setFormValue(key: string, value: string): void;
+    setEnv(env: string, alias?: string): void;
     /**
-     * The method to set custom form field labels
+     * Method to read the current environment
      *
      * @example
-     *   widget.setFormPlaceholders({
-     *       card_name: 'Card Holder Name',
-     *       email: 'Email For Receipt'
-     *   })
-     *
-     * @param { Object } fieldLabels - Key of object is one of [FORM_FIELD]{@link FORM_FIELD}, The object value is what we are expecting
+     * SRC.getEnv();
      */
-    setFormLabels(fieldLabels: IFormLabels): void;
-    setFormLabel(key: string, label: string): void;
+    getEnv(): string;
+    on(eventName: string): Promise<any>;
+    on(eventName: string, cb: (data: any) => void): any;
     /**
-     * The method to set custom form fields placeholders
+     * Using this method you can hide checkout after load and button click
+     * @param {boolean} [saveSize=false] - using this param you can save iframe's size (if applicable)
      *
      * @example
-     *   widget.setFormPlaceholders({
-     *       card_name: 'Input your card holder name...',
-     *       email: 'Input your email, like test@example.com'
-     *   })
-     *
-     * @param { Object } fieldPlaceholders - Key of object is one of [FORM_FIELD]{@link FORM_FIELD}, Value of object is expected placeholder
+     * SRC.hideCheckout();
      */
-    setFormPlaceholders(fieldPlaceholders: IFormPlaceholders): void;
-    setFormPlaceholder(key: string, placeholder: string): void;
+    hideCheckout(saveSize: boolean): void;
     /**
-     * The method to set the full configuration for the all specific form elements (label, placeholder, value)
-     * You can also use the other method for the partial configuration like: setFormValues, setFormPlaceholder, setFormLabel
+     * Using this method you can show checkout after using hideCheckout method
      *
      * @example
-     *   widget.setFormElements([
-     *       {
-     *           field:  'card_name',
-     *           placeholder: 'Input your card holder name...',
-     *           label: 'Card Holder Name',
-     *           value: 'Houston',
-     *       },
-     *       {
-     *           field:  'email',
-     *           placeholder: 'Input your email, like test@example.com',
-     *           label: 'Email For Receipt',
-     *           value: 'predefined@email.com',
-     *       },
-     *   ])
-     *
-     * @param { string } elements - The list of elements
-     * @param { string } elements[].field - Field name of the element [FORM_FIELD]{@link FORM_FIELD}
-     * @param { string } elements[].placeholder - Set custom form field placeholder
-     * @param { string } elements[].label - Set custom labels near form field
-     * @param { string } elements[].value - Set predefined values for the form field
-     */
-    setFormElements(elements: IFormElement[]): void;
-    setFormElement(element: IFormElement): void;
-    /**
-     * The method to change the widget icons
-     *
-     * @deprecated
+     * SRC.showCheckout()
      */
-    setIcons(icons: IIcons): void;
-    setIcon(key: string, value: string): void;
+    showCheckout(): void;
     /**
-     * Using this method you can set hidden elements inside widget
+     * Using this method you can reload the whole checkout
      *
      * @example
-     * widget.setHiddenElements(['submit_button', 'email']);
-     *
-     * @param {string[]} elements -  list of element which can be hidden [ELEMENT]{@link ELEMENT} || [FORM_FIELD]{@link FORM_FIELD}
+     * SRC.reload()
      */
-    setHiddenElements(elements: string[]): void;
+    reload(): void;
     /**
-     * Current method can set custom ID to identify the data in the future
+     * Use this method for resize checkout iFrame according to content height, if applicable
      *
      * @example
-     * widget.setRefId('id');
-     *
-     * @param {string} refId - custom id
-     */
-    setRefId(refId: string): void;
-    /**
-     * Current method can add visual validation from gateway to widget's form fields
+     * SRC.useAutoResize();
      *
-     * @example
-     * widget.useGatewayFieldValidation();
      */
-    useGatewayFieldValidation(): void;
+    useAutoResize(): void;
+}
+
+/**
+ * Class ClickToPay include methods for interacting with the ClickToPay checkout and Manual Card option
+ *
+ * @extends SRC
+ *
+ * @constructor
+ *
+ * @param {string} iframe_selector - Selector of html element. Container for Click To Pay checkout iFrame.
+ * @param {string} service_id - Card Scheme Service ID
+ * @param {string} public_key_or_access_token - Paydock public key or Access Token
+ * @param {IClickToPayMeta} meta - Data that configures the Click To Pay checkout
+ * @example
+ * var mastercardSRC = new ClickToPay('#checkoutIframe', 'service_id', 'public_key', {});
+ *
+ */
+declare class ClickToPay extends SRC {
+    protected iframe_selector: string;
+    protected service_id: string;
+    protected public_key_or_access_token: string;
+    protected meta: IClickToPayMeta;
+    /** @constructs */ constructor(iframe_selector: string, service_id: string, public_key_or_access_token: string, meta: IClickToPayMeta);
     /**
-     * Current method can set icons of supported card types
-     *
-     * @example
-     *
-     * widget.setSupportedCardIcons(['mastercard', 'visa'], validateCardNumberInput);
+     * The final method after configuring the SRC to start the load process of Click To Pay checkout
      *
-     * @param {string[]} elements - [SUPPORTED_CARD_TYPES]{@link SUPPORTED_CARD_TYPES}
-     * @param {boolean} validateCardNumberInput - [validateCardNumberInput=false] - using this param you allow validation for card number input on supported card types
      */
-    setSupportedCardIcons(elements: string[], validateCardNumberInput?: boolean): void;
+    load(): void;
+}
+
+declare class VaultDisplayIframeEvent extends IFrameEvent {
+    on<T>(eventName: string, widgetId: string, cb: (data: T) => void): void;
+}
+
+/**
+ * Class VaultDisplayWidget include method for working on html
+ * @constructor
+ *
+ * @example
+ * var widget = new VaultDisplayWidget('#widget', 'token');
+ *
+ * @param {string} selector - Selector of html element. Container for widget
+ * @param {string} token - One time token
+ */
+declare class VaultDisplayWidget {
+    protected container: Container;
+    protected iFrame: IFrame;
+    protected triggerElement: Trigger;
+    protected event: VaultDisplayIframeEvent;
+    protected validationData: IFormValidation;
+    protected vaultDisplayToken: string;
+    protected link: Link;
+    protected configs: any[];
+    /** @constructs */ constructor(selector: string, token: string);
     /**
      * Current method can change environment. By default environment = sandbox.
      * Also we can change domain alias for this environment. By default domain_alias = paydock.com
@@ -2880,459 +2897,452 @@ declare class MultiWidget {
      * @param {string} [alias] - Own domain alias
      */
     setEnv(env: string, alias?: string): void;
-    getEnv(): void;
     /**
-     * Method for creating iframe url
+     * This callback will be called for each event in widget
      *
-     * @example
-     * widget.loadIFrameUrl(function (url) {
-     *      console.log(url);
-     * }, function (errors) {
-     *      console.log(errors);
-     * });
+     * @callback listener
+     * @param {IEventData} response
      */
-    loadIFrameUrl(cb: (url: string) => void, errorCb?: (errors: string[]) => void): void;
+    on(eventName: string): Promise<IEventData$1>;
+    on(eventName: string, cb: (data: IEventData$1) => void): any;
     /**
-     * Method for setting a custom language code
+     * Object contain styles for widget
      *
      * @example
-     * config.setLanguage('en');
-     * @param {string} code - ISO 639-1
+     * widget.setStyles({
+     *       background_color: '#fff',
+     *       border_color: 'yellow',
+     *       text_color: '#FFFFAA',
+     *       button_color: 'rgba(255, 255, 255, 0.9)',
+     *       font_size: '20px',
+     *       fort_family: 'fantasy'
+     *   });
+     * @param {VaultDisplayStyle} fields - name of styles which can be shown in widget [VAULT_DISPLAY_STYLE]{@link VAULT_DISPLAY_STYLE}
      */
-    setLanguage(code: any): void;
-    getLink(): Link;
+    setStyles(styles: IStyles$1): void;
+    setStyle(param: string, value: string): void;
+    /**
+     * The final method to beginning, the load process of widget to html
+     *
+     */
+    load(): void;
 }
 
-interface IEventMetaData extends IEventData$1 {
-    configuration_token: string;
-    type: string;
-    account_name?: string;
-    account_number?: string;
-    card_number_last4?: string;
-    card_number_length?: number;
-    card_scheme?: string;
-    gateway_type?: string;
+interface IWalletServiceUpdateData {
+    amount: number;
+    shipping_options?: IShippingOption[];
 }
-interface IEventFinishData extends IEventData$1 {
-    payment_source: string;
-    payment_source_token?: string;
+interface IWalletServiceUpdate {
+    success: boolean;
+    body?: IWalletServiceUpdateData;
+}
+interface IPaymentMethod {
+    payment_method_id?: string;
+    device?: string;
+    customer: {
+        payer_name: string;
+        payer_email: string;
+        payer_phone: string;
+        payment_source: {
+            wallet_type: WALLET_TYPE;
+            card_name: string;
+            type: string;
+            card_scheme: string;
+            card_number_last4: string;
+            expire_month: number;
+            expire_year: number;
+            address_line1: string;
+            address_line2: string;
+            address_city: string;
+            address_postcode: string;
+            address_state: string;
+            address_country: string;
+            ref_token?: string;
+        };
+    };
+    shipping?: {
+        method?: string;
+        options?: IShippingOption[];
+        address_line1?: string;
+        address_line2?: string;
+        address_city?: string;
+        address_postcode?: string;
+        address_state?: string;
+        address_country?: string;
+        address_company?: string;
+        address_origin_postcode?: string;
+        contact?: {
+            first_name?: string;
+            last_name?: string;
+            email?: string;
+            phone?: string;
+            phone2?: string;
+        };
+    };
+}
+interface IUnavailableWalletEventBody {
+}
+interface IPaymentMethodSelectedWalletEventBody {
+    data: IPaymentMethod;
+    onSuccess: () => void;
+    onError: (message?: string) => void;
+}
+interface IWalletService {
+    load(container: Container): Promise<void>;
+    close?(): void;
+    update(data: IWalletServiceUpdate): void;
+    enable(): void;
+    disable(): void;
+    setEnv(env: string): any;
+    on(eventName: string, cb?: (data: IUnavailableWalletEventBody | IPaymentMethodSelectedWalletEventBody | any) => void): any;
+}
+
+interface IWalletPaymentSuccessful {
+    id: string;
+    amount: number;
+    currency: string;
+    status: string;
+    payer_name?: string;
+    payer_email?: string;
+    payer_phone?: string;
+}
+interface IWalletUnavailable {
+    wallet?: WALLET_TYPE;
+}
+interface IWalletOnClick {
+    attachResult: (result: Promise<void> | boolean) => void;
+}
+interface IWalletUpdate {
+    wallet_response_code?: string;
+    wallet_order_id?: string;
+    wallet_session_id?: string;
+    payment_source?: {
+        wallet_payment_method_id?: string;
+        card_number_last4?: string;
+        card_scheme?: string;
+    };
+    wallet_loyalty_account?: {
+        id?: string;
+        barcode?: string;
+    };
+    shipping?: {
+        address_line1?: string;
+        address_line2?: string;
+        address_postcode?: string;
+        address_city?: string;
+        address_state?: string;
+        address_country?: string;
+        address_company?: string;
+        post_office_box_number?: string;
+        wallet_address_id?: string;
+        wallet_address_name?: string;
+        wallet_address_created_timestamp?: string;
+        wallet_address_updated_timestamp?: string;
+    };
+    selected_shipping_option?: IShippingOption;
+}
+
+declare enum EventEnum {
+    UNAVAILABLE = "unavailable",
+    UPDATE = "update",
+    PAYMENT_SUCCESSFUL = "paymentSuccessful",
+    PAYMENT_ERROR = "paymentError",
+    PAYMENT_IN_REVIEW = "paymentInReview",
+    AUTH_TOKENS_CHANGED = "authTokensChanged",
+    ON_CLICK = "onClick",
+    ON_CHECKOUT_OPEN = "onCheckoutOpen",
+    ON_CHECKOUT_CLOSE = "onCheckoutClose"
+}
+
+interface IEventData<T = any> {
+    event: string;
+    data: T;
+}
+interface IWalletPaymentSuccessfulEvent extends IEventData<IWalletPaymentSuccessful> {
+    event: EventEnum.PAYMENT_SUCCESSFUL;
+}
+interface IWalletUpdateEvent extends IEventData<IWalletUpdate> {
+    event: EventEnum.UPDATE;
+}
+interface IWalletUnavailableEvent extends IEventData<IWalletUnavailable> {
+    event: EventEnum.UNAVAILABLE;
+}
+interface IWalletOnClickEvent extends IEventData<IWalletOnClick> {
+    event: EventEnum.ON_CLICK;
+}
+interface IWalletUpdateData {
+    success: boolean;
 }
 /**
- * Interface of data from validation event.
- *
- * @interface IFormValidation
- *
- * @param {string} event The name of the event.
- * @param {string} message_source A system variable that identifies the event source.
- * @param {string} purpose A system variable that states the purpose of the event.
- * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
- * @param {boolean} [form_valid] Indicates wether or not the form is valid.
- * @param {Array<string>} [invalid_fields] Names of form fields with invalid data.
- * @param {Array<string>} [invalid_showed_fields] Names of invalid form fields which are already displaying the error.
- * @param {Partial<Record<CardValidatorValue | GenericValidatorValue, Array<string>>>} [validators] Object containing validator identifiers as keys and the fields subject to that validator as an array of form field names.
- *  See list of available [Generic Vallidators]{@link GENERIC_VALIDATORS} and [Card Validators]{@link CARD_VALIDATORS},
- */
-/**
- * Contains basic information associated with the event and additional meta data
- * specific to the event. E.g., card info, gateway info, etc.
- *
- * @interface IEventMetaData
- *
- * @param {string} event The name of the event.
- * @param {string} purpose A system variable that states the purpose of the event.
- * @param {string} message_source A system variable that identifies the event source.
- * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
- * @param {string} configuration_token Token received from our API with widget data
- * @param {string} type Payment type 'card', 'bank_account'
- * @param {string} gateway_type Gateway type
- * @param {string} [card_number_last4] Last 4 digit of your card
- * @param {string} [card_scheme] Card scheme, e.g., (Visa, Mastercard and American Express (AmEx))
- * @param {number} [card_number_length] Card number length
- * @param {string} [account_name] Bank account account name
- * @param {string} [account_number] Bank account account number
- * */
-/**
- * Interface of data from event.
- * @interface IEventAfterLoadData
- *
- * @param {string} event The name of the event.
- * @param {string} purpose A system variable that states the purpose of the event.
- * @param {string} message_source A system variable that identifies the event source.
- * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
- * */
-/**
- * Interface of data from event.
- * @interface IEventFinishData
- *
- * @param {string} event The name of the event.
- * @param {string} purpose A system variable that states the purpose of the event.
- * @param {string} message_source A system variable that identifies the event source.
- * @param {string} [ref_id] Custom unique value that identifies result of processed operation.
- * @param {string} payment_source One time token. Result from this endpoint [API docs](https://docs.paydock.com/#tokens)
- * */
-/**
- * List of available event's name
- * @const EVENT
- *
- * @type {object}
- * @param {string} AFTER_LOAD=afterLoad
- * @param {string} SUBMIT=submit
- * @param {string} FINISH=finish
- * @param {string} VALIDATION=validation
- * @param {string} VALIDATION_ERROR=validationError
- * @param {string} SYSTEM_ERROR=systemError
- * @param {string} META_CHANGE=metaChange
- * @param {string} RESIZE=resize
- */
-/**
- * List of available event's name
- * @const VAULT_DISPLAY_EVENT
- *
- * @type {object}
- * @param {string} AFTER_LOAD=afterLoad
- * @param {string} SYSTEM_ERROR=system_error
- * @param {string} CVV_SECURE_CODE_REQUESTED=cvv_secure_code_requested
- * @param {string} CARD_NUMBER_SECURE_CODE_REQUESTED=card_number_secure_code_requested
- * @param {string} ACCESS_FORBIDDEN=access_forbidden
- * @param {string} SESSION_EXPIRED=systemError
- * @param {string} SYSTEM_ERROR=session_expired
- * @param {string} OPERATION_FORBIDDEN=operation_forbidden
- */
-/**
- * Class HtmlMultiWidget include method for working with html
+ * Class WalletButtons to work with different E-Wallets within html (currently supports Apple Pay, Google Pay, Google Pay™ and Apple Pay via Stripe, Flypay, Flypay V2, Paypal, Afterpay)
  * @constructor
- * @extends MultiWidget
  *
- * @param {string} selector - Selector of html element. Container for widget
- * @param {string} publicKey - PayDock users public key
- * @param {(Configuration | string | Configuration[] | string[])} conf - exemplar[s] Configuration class OR configuration token
  * @example
- * var widget = new MultiWidget('#widget', 'publicKey','configurationToken'); // With a pre-created configuration token
- *
- * var widget = new MultiWidget('#widget', 'publicKey',['configurationToken', 'configurationToken2']); // With pre-created configuration tokens
- *
- * var widget = new MultiWidget('#widget', 'publicKey', new Configuration('gatewayId')); With Configuration
+ * var button = new WalletButtons('#wallet-buttons', 'charge-token', { amount_label: 'Total', country: 'us' });
  *
- * var widget = new MultiWidget('#widget', 'publicKey',[ With Configurations
- *      Configuration(), // default gateway_id,
- *      Configuration('not_configured'), // without gateway,
- *      Configuration('gatewayId'),
- *      Configuration('gatewayId', 'bank_account')
- * ]);
+ * @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 HtmlMultiWidget extends MultiWidget {
+declare class WalletButtons {
     protected container: Container;
-    protected iFrame: IFrame;
-    protected triggerElement: Trigger;
-    protected event: IFrameEvent;
-    protected validationData: IFormValidation;
-    /** @constructs */ constructor(selector: string, publicKey: string, conf: any);
+    protected api: ApiInternal;
+    protected service: IWalletService;
+    protected eventEmitter: EventEmitter;
+    protected hasUpdateHandler: boolean;
+    /** @constructs */ constructor(selector: string, chargeToken: string, meta: IWalletMeta);
     /**
-     * Loads the widget.
+     * Initializes the availability checks and inserts the button if possible.
+     * Otherwise function onUnavailable(handler: VoidFunction) will be called.
      *
-     * Calling this method results in an iframe element being inserted and rendered in the DOM.
+     * @example
+     * var button = new WalletButtons(
+     *      '#buttons',
+     *      token,
+     *      {
+     *          amount_label: 'Total',
+     *          country: 'DE',
+     *      }
+     *  );
+     *  button.load();
      */
     load(): void;
     /**
-     * Registers a form validation callback for validation events.
-     */
-    protected afterLoad(): void;
-    /**
-     * Listen to events of widget
+     * Triggers the update process of the wallet, if available.
+     * Currently supported by Flypay, Paypal and ApplePay/GooglePay via MPGS Wallets.
      *
      * @example
-     *
-     * ```javascript
-     * widget.on('form_submit', function (data) {
-     *      console.log(data);
-     * });
-     * ```
+     * var button = new WalletButtons(
+     *      '#buttons',
+     *      token,
+     *      {
+     *          amount_label: 'Total',
+     *          country: 'DE',
+     *      }
+     *  );
+     *  button.on('update', (data) => {
+     *      updateChargeAmountInBackend(data);
+     *      button.update({ success: true });
+     *  });
      *
      * @example
-     *
-     * ```javascript
-     * widget.on('form_submit').then(function (data) {
-     *      console.log(data);
-     * });
-     * ```
-     *
-     * @typedef {(data: IEventData | IEventMetaData | IEventFinishData | IFormValidation) => void} EventListenerCallback
-     *
-     * @param {string} eventName - The name of the event that should be listened. Available event names [EVENT]{@link EVENT}.
-     * @param {EventListenerCallback} [cb] - A function to be invoked whenever the event occurs.
-     *
-     * @return {Promise<IEventData | IEventMetaData | IEventFinishData | IFormValidation> | void}
-     */
-    on(eventName: string): Promise<IEventData$1 | IEventMetaData | IEventFinishData | IFormValidation>;
-    on(eventName: string, cb: (data: IEventData$1 | IEventMetaData | IEventFinishData | IFormValidation) => void): any;
-    /**
-     * Registers callback that will be invoked for every trigger.
-     *
-     * @param {'submit_form' | 'tab'} triggers - The Widget element identifier that caused the trigger.
-     * @param {ITriggerData} data - Data that will be sent to the widget when the trigger occurs.
-     */
-    trigger(triggerName: string, data?: ITriggerData): void;
-    /**
-     * Gets a reference to the form current validation state.
-     *
-     * !Warning: do not directly modify the values of the returned object.
-     *
-     * @return {IFormValidation} Form validation object
-     */
-    getValidationState(): IFormValidation;
-    /**
-     * Checks if a given form is valid.
-     *
-     * A form is valid if all form fields are valid.
-     *
-     * @return {boolean} Indicates wether or not form is valid.
-     */
-    isValidForm(): boolean;
-    /**
-     * Using this method you can check if a specific form field is invalid
-     *
-     * @param {string} field - Field name
-     * @return {boolean} Field is invalid
-     */
-    isInvalidField(field?: string): boolean;
-    /**
-     * Checks if a given form field is displaying an error.
-     *
-     * @param {string} field - The form field name
-     *
-     * @return {boolean} Indicates wether or not the Error message is being displayed on the associated field.
-     */
-    isFieldErrorShowed(field?: string): boolean;
-    /**
-     * Checks if a given form field is valid or invalid by name.
-     *
-     * @param {string} field - The form field name
-     * @param validator - The name of the validator.
-     *
-     * @return {boolean} Indicates wether or not the field is invalid based on validator intepretation.
-     */
-    isInvalidFieldByValidator(field: string, validator: ValidatorFieldsMapKey): boolean;
-    /**
-     * Hides the widget.
-     *
-     * E.g., use this method to hide the widget after it loads.
-     *
-     * @param {boolean} [saveSize=false] Wether the original iframe element size should be saved before being hidden.
+     * // 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"
+     *                   }
+     *               ]
+     *          }
+     *       });
+     *  });
      */
-    hide(saveSize: boolean): void;
+    update(data: IWalletUpdateData): void;
     /**
-     * Shows the widget.
+     * 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()`.
      *
-     * E.g., use this method to show the widget after it was explicitly hidden.
-     */
-    show(): void;
-    /**
-     * Reloads the widget.
+     * @example
+     * button.setEnv('production', 'paydock.com');
+     * @param {string} env - sandbox, production
+     * @param {string} [alias] - Own domain alias
      */
-    reload(): void;
+    setEnv(env: string, alias?: string): void;
     /**
-     * Hides the specified Widget elements by their identifier.
+     * Current method can enable the payment button. This method is only supported for Flypay V2.
      *
      * @example
-     *
-     * ```javascript
-     * widget.hideElements(['submit_button', 'email']);
-     * ```
-     *
-     * @param {string[]} elements - List of element which can be hidden [ELEMENT]{@link ELEMENT} || [FORM_FIELD]{@link FORM_FIELD}
+     * button.enable();
      */
-    hideElements(elements: string[]): void;
+    enable(): void;
     /**
-     * Shows the specified Widget elements by their identifier.
+     * Current method can disable the payment button. This method is only supported for Flypay V2.
      *
      * @example
-     *
-     * ```javascript
-     * widget.showElements(['submit_button', 'email']);
-     * ```
-     *
-     * @param {string[]} elements - List of elements which can be showed [ELEMENT]{@link ELEMENT} || [FORM_FIELD]{@link FORM_FIELD}
+     * button.disable('production', 'paydock.com');
      */
-    showElements(elements: string[]): void;
+    disable(): void;
     /**
-     * Updates the form field values inside the widget.
+     * Closes the checkout forcibly. Currently supported in Flypay wallet.
      *
      * @example
-     *
-     * ```javascript
-     * widget.updateFormValues({
-     *   email: 'predefined@email.com',
-     *   card_name: 'Houston'
-     * });
-     *```
-     *
-     * @param {IFormValues} fieldValues - Fields with values
+     * button.close();
      */
-    updateFormValues(fieldValues: IFormValues): void;
+    close(): void;
+    on(eventName: string): Promise<IEventData>;
+    on(eventName: string, cb: (data: IEventData) => void): any;
     /**
-     * Updates a single form field values inside the widget by the form field name.
+     * 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');
+     * });
      *
-     * ```javascript
-     * widget.updateFormValue("card_name", "John Doe");
-     *```
+     * @example
+     * button.onUnavailable().then(() => console.log('No wallet buttons available'));
      *
-     * @param {string} key - The form field name
-     * @param {string} value - The form field value
-     */
-    updateFormValue(key: string, value: string): void;
-    /**
-     * Inserts the event data (after finish event) onto the input field associated with the provided CSS selector.
+     * @example
+     * button.onUnavailable(function (data) {console.log('data.wallet :: ', data.wallet)});
      *
-     * @param {string} selector - A CSS selector. E.g., ".my-class", "#my-id", or others
-     * @param {string} dataType - The data type of IEventData object.
+     * @param {listener} [handler] - Function to be called when no button is available.
      */
-    onFinishInsert(selector: string, dataType: string): void;
+    onUnavailable(handler?: (data: IWalletUnavailableEvent) => void): Promise<void> | (() => void);
     /**
-     * Intercepts a form submission and delegates processing to the widget.
-     *
-     * An simplified example of the process:
-     * - User clicks submit button in your form
-     * - This implicitly triggers a submission to the widget
-     * - The widget submits your form
+     * If the wallet performs some update in the checkout process, the function passed as parameter will be called.
      *
-     * @note The widget's submit button will be hidden.
+     * NOTE: make sure to call the `button.update(result)` method on handler completion.
      *
-     * @param {string} selector - css selector of your form
+     * @example
+     * button.onUpdate((data) => {
+     *      button.update({ success: true });
+     * });
      *
      * @example
+     * button.onUpdate().then((data) => throw new Error());
      *
-     * ```html
-     * <body>
-     *  <form id="myForm">
-     *      <input name="amount">
-     *      <button type="submit">Submit</button>
-     *  </form>
-     *  <script>
-     *     widget.interceptSubmitForm('#myForm');
-     *  </script>
-     * </body>
-     * ```
-     */
-    interceptSubmitForm(selector: string): void;
-    /**
-     * This method hides a submit button and automatically execute form submit
+     * @param {listener} [handler] - Function to be called when the payment was successful.
      */
-    useCheckoutAutoSubmit(): void;
+    onUpdate(handler?: (data: IWalletUpdateEvent) => void): Promise<unknown> | (() => void);
     /**
-     * Use this method for resize iFrame according content height
+     * 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!');
+     * });
      *
-     * ```javascript
-     * widget.useAutoResize();
-     *```
+     * @example
+     * button.onPaymentSuccessful().then((data) => console.log('Payment successful!'));
+     *
+     * @param {listener} [handler] - Function to be called when the payment was successful.
      */
-    useAutoResize(): void;
-}
-
-/**
- * Class Widget include method for working on html and include extended by HtmlMultiWidget methods
- * @constructor
- * @extends HtmlMultiWidget
- * @extends MultiWidget
- *
- * @example
- * var widget = new HtmlWidget('#widget', 'publicKey', 'gatewayID'); // short
- *
- * var widget = new HtmlWidget('#widget', 'publicKey', 'gatewayID', 'bank_account', 'payment_source'); // extend
- *
- * var widget = new HtmlWidget('#widget', 'publicKey', 'not_configured'); // without gateway
- *
- * @param {string} selector - Selector of html element. Container for widget
- * @param {string} publicKey - PayDock users public key
- * @param {string} [gatewayID=default] - ID of a gateway connected to PayDock. By default or if put 'default', it will use the selected default gateway. If put 'not_configured', it won’t use gateway to create downstream token.
- * @param {string} [paymentType=card] - Type of payment source which shows in widget form. Available parameters : “card”, “bank_account”.
- * @param {string} [purpose=payment_source] - Purpose of widget form. Available parameters: ‘payment_source’, ‘card_payment_source_with_cvv’, ‘card_payment_source_without_cvv’
- */
-declare class HtmlWidget extends HtmlMultiWidget {
-    /** @constructs */ constructor(selector: string, publicKey: string, gatewayID?: string, paymentType?: string, purpose?: string);
+    onPaymentSuccessful(handler?: (data: IWalletPaymentSuccessfulEvent) => void): Promise<unknown> | (() => void);
     /**
-     * Destination, where customer will receive all successful responses.
-     * Response will contain “data” object with “payment_source” or other parameters, in depending on 'purpose'
+     * 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
-     * widget.setWebHookDestination('http://google.com');
+     * button.onPaymentInReview((data) => {
+     *      console.log('Payment in fraud review');
+     * });
      *
-     * @param {string} url - Your endpoint for post request.
+     * @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.
      */
-    setWebHookDestination(url: string): void;
+    onPaymentInReview(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
     /**
-     * URL to which the Customer will be redirected to after the success finish
+     * 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
-     * widget.setSuccessRedirectUrl('google.com/search?q=success');
+     * button.onPaymentError((err) => {
+     *      console.log('Payment not successful');
+     * });
      *
-     * @param {string}  url
+     * @example
+     * button.onPaymentError().then((err) => console.log('Payment not successful'));
+     *
+     * @param {listener} [handler] - Function to be called when the payment was not successful.
      */
-    setSuccessRedirectUrl(url: string): void;
+    onPaymentError(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
     /**
-     * URL to which the Customer will be redirected to if an error is triggered in the process of operation
+     * 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
-     * widget.setErrorRedirectUrl('google.com/search?q=error');
+     * button.onAuthTokensChanged((eventData) => {
+     *     console.log('Authentication tokens changed:', eventData);
+     * });
      *
-     * @param {string} url
+     * @example
+     * button.onAuthTokensChanged().then((eventData) => {
+     *     console.log('Authentication tokens changed:', eventData);
+     * });
+     *
+     * @param {listener} [handler] - Function to be called when authentication tokens are changed.
      */
-    setErrorRedirectUrl(url: string): void;
+    onAuthTokensChanged(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
     /**
-     *  Set list with widget form field, which will be shown in form. Also you can set the required validation for these fields
+     * 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 and ApplePay wallet buttons at the moment.
      *
      * @example
-     * widget.setFormFields(['phone', 'email', 'first_name*']);
+     * button.onClick((data) => {
+     *      performValidationLogic();
+     * });
      *
-     * @param {string[]} fields - name of fields which can be shown in a widget.
-     * If after a name of a field, you put “*”, this field will be required on client-side. (For validation, you can specify any fields, even those that are shown by default: card_number, expiration, etc... ) [FORM_FIELD]{@link FORM_FIELD}
+     * @param {listener} handler - Function to be called when the wallet button is clicked.
      */
-    setFormFields(fields: string[]): void;
+    onClick(handler: (data: IWalletOnClickEvent) => void): () => void;
     /**
-     * The method to set the full configuration for the all specific form elements (visibility, required, label, placeholder, value)
-     * You can also use the other method for the partial configuration like: setFormFields, setFormValues, setFormPlaceholder, setFormLabel
+     * Registers a callback function to be invoked when the wallet checkout opens.
+     * Note this is supported for FlypayV2 wallet button at the moment.
      *
      * @example
-     *   widget.setFormElements([
-     *       {
-     *           field:  'card_name*',
-     *           placeholder: 'Input your card holder name...',
-     *           label: 'Card Holder Name',
-     *           value: 'Houston',
-     *       },
-     *       {
-     *           field:  'email',
-     *           placeholder: 'Input your email, like test@example.com',
-     *           label: 'Email for the receipt',
-     *           value: 'predefined@email.com',
-     *       },
-     *   ])
+     * button.onCheckoutOpen((data) => {
+     *      console.log('Checkout opens');
+     * });
      *
-     * @param { Object[] } elements - List of elements
-     * @param { string } elements[].field - Field name of element. If after a name of a field, you put “*”, this field will be required on client-side. (For validation, you can specify any fields, even those that are shown by default: card_number, expiration, etc... ) [FORM_FIELD]{@link FORM_FIELD}
-     * @param { string } elements[].placeholder - Set custom placeholders in form fields
-     * @param { string } elements[].label - Set a custom labels near the form field
-     * @param { string } elements[].value - Set predefined values for the form field
+     * @param {listener} handler - Function to be called when the wallet checkout opens.
      */
-    setFormElements(elements: IFormElement[]): void;
-    setFormElement(element: IFormElement): void;
+    onCheckoutOpen(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
     /**
-     * The method to set meta information for the checkout page
+     * Registers a callback function to be invoked when the wallet checkout closes.
+     * Note this is supported for FlypayV2 wallet button at the moment.
      *
      * @example
-     * config.setMeta({
-            brand_name: 'paydock',
-            reference: '15',
-            email: 'wault@paydock.com'
-        });
+     * button.onCheckoutClose(() => {
+     *      console.log('Wallet checkout closes');
+     * });
      *
-     * @param {IPayPalMeta | IBamboraMeta} object - data which can be shown on checkout page [IPayPalMeta]{@link IPayPalMeta} [IBamboraMeta]{@link IBamboraMeta}
+     * @param {listener} handler - Function to be called when the wallet checkout closes.
      */
-    setMeta(meta: IPayPalMeta | IBamboraMeta): void;
-    setGiftCardScheme(giftCardScheme: any, processingNetwork: any): void;
+    onCheckoutClose(handler?: (err: IEventData) => void): Promise<unknown> | (() => void);
+    private setupServiceCallbacks;
+    private setupUnavailableCallback;
+    private setupUpdateCallback;
+    private setupOnClickCallback;
+    private setupOnCheckoutOpenCallback;
+    private setupOnCheckoutCloseCallback;
+    private setupWalletCallback;
+    private setupPaymentCallback;
+    private setupPaymentSuccessCallback;
+    private setupPaymentInReviewCallback;
+    private setupPaymentErrorCallback;
+    private setupAuthTokensChangedCallback;
 }
 
 type Instruction = new (selector: string, formSelector: string, api: ApiInternal) => InstructionHandler & InstructionDestroyable & InstructionDecorated;