@paydock/client-sdk
Version:
Paydock client sdk
241 lines • 9.6 kB
TypeScript
import { Link } from '../components/link';
import { Configuration, type PURPOSE } from './configuration';
import { IStyles, ITexts, IFormValues, IIcons, ICountryPhoneMask, IFormLabels, IFormPlaceholders, IFormElement } from '../components/param';
import { IElementStyleInput, IElementStyleLabel, IElementStyleSubmitButton, IElementStyleTitle, IElementStyleTitleDescription } from "./style";
import { type EventTypes, IFrameEvent } from '../components/iframe-event';
import type { IEventError } from '../helper/event-error';
/**
*
* 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;
protected event: IFrameEvent;
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): void;
/**
* 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;
/**
* 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}
*/
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 hide prevent the widget from showing the error messages
*
* @example
* widget.hideUiErrors('id');
*/
hideUiErrors(): 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(event: EventTypes, error: IEventError, purpose: PURPOSE): void;
}
export { MultiWidget };
//# sourceMappingURL=multi-widget.d.ts.map