@paydock/client-sdk 0.1.0 → 0.1.2-beta

package/docs/api-widget.md

@@ -0,0 +1,2542 @@
+## Classes
+
+<dl>
+<dt><a href="#user-content-w_HtmlWidget">HtmlWidget</a> ⇐ <code><a href="#user-content-w_HtmlMultiWidget">HtmlMultiWidget</a></code></dt>
+<dd><p>Class Widget include method for working on html and include extended by HtmlMultiWidget methods</p>
+</dd>
+<dt><a href="#user-content-w_HtmlMultiWidget">HtmlMultiWidget</a> ⇐ <code><a href="#user-content-w_MultiWidget">MultiWidget</a></code></dt>
+<dd><p>Class HtmlMultiWidget include method for working with html</p>
+</dd>
+<dt><a href="#user-content-w_Configuration">Configuration</a></dt>
+<dd><p>Class Configuration include methods for creating configuration token</p>
+</dd>
+<dt><a href="#user-content-w_MultiWidget">MultiWidget</a></dt>
+<dd><p>Class MultiWidget include method for for creating iframe url</p>
+</dd>
+</dl>
+
+## Members
+
+<dl>
+<dt><a href="#user-content-w_PURPOSE">PURPOSE</a> : <code>object</code></dt>
+<dd><p>Purposes</p>
+</dd>
+</dl>
+
+## Constants
+
+<dl>
+<dt><a href="#user-content-w_EVENT">EVENT</a> : <code>object</code></dt>
+<dd><p>List of available event&#39;s name</p>
+</dd>
+<dt><a href="#user-content-w_VAULT_DISPLAY_EVENT">VAULT_DISPLAY_EVENT</a> : <code>object</code></dt>
+<dd><p>List of available event&#39;s name</p>
+</dd>
+<dt><a href="#user-content-w_PAYMENT_TYPE">PAYMENT_TYPE</a> : <code>object</code></dt>
+<dd><p>List of available payment source types</p>
+</dd>
+<dt><a href="#user-content-w_FORM_FIELD">FORM_FIELD</a> : <code>object</code></dt>
+<dd><p>Current constant include available type of fields which can be included to widget</p>
+</dd>
+<dt><a href="#user-content-w_STYLE">STYLE</a> : <code>object</code></dt>
+<dd><p>List of available style params for widget</p>
+</dd>
+<dt><a href="#user-content-w_TEXT">TEXT</a> : <code>object</code></dt>
+<dd><p>List of available text item params for widget</p>
+</dd>
+<dt><a href="#user-content-w_ELEMENT">ELEMENT</a> : <code>object</code></dt>
+<dd><p>List of available params for hide elements</p>
+</dd>
+<dt><a href="#user-content-w_SUPPORTED_CARD_TYPES">SUPPORTED_CARD_TYPES</a> : <code>object</code></dt>
+<dd><p>The list of available parameters for showing card icons</p>
+</dd>
+<dt><a href="#user-content-w_STYLABLE_ELEMENT">STYLABLE_ELEMENT</a> : <code>object</code></dt>
+<dd><p>Current constant include available type of element for styling</p>
+</dd>
+<dt><a href="#user-content-w_STYLABLE_ELEMENT_STATE">STYLABLE_ELEMENT_STATE</a> : <code>object</code></dt>
+<dd><p>Current constant include available states of element for styling</p>
+</dd>
+<dt><a href="#user-content-w_CARD_VALIDATORS">CARD_VALIDATORS</a> : <code>Record.&lt;string, string&gt;</code></dt>
+<dd><p>List of available form field validators dedicated to cards and their definition</p>
+</dd>
+<dt><a href="#user-content-w_GENERIC_VALIDATORS">GENERIC_VALIDATORS</a> : <code>Record.&lt;string, string&gt;</code></dt>
+<dd><p>List of available generic form field validators and their definition</p>
+</dd>
+<dt><a href="#user-content-w_TRIGGER">TRIGGER</a> : <code>object</code></dt>
+<dd><p>List of available triggers</p>
+</dd>
+</dl>
+
+## Interfaces
+
+<dl>
+<dt><a href="#user-content-w_IFormValidation">IFormValidation</a></dt>
+<dd><p>Interface of data from validation event.</p>
+</dd>
+<dt><a href="#user-content-w_IEventMetaData">IEventMetaData</a></dt>
+<dd><p>Contains basic information associated with the event and additional meta data
+specific to the event. E.g., card info, gateway info, etc.</p>
+</dd>
+<dt><a href="#user-content-w_IEventAfterLoadData">IEventAfterLoadData</a></dt>
+<dd><p>Interface of data from event.</p>
+</dd>
+<dt><a href="#user-content-w_IEventFinishData">IEventFinishData</a></dt>
+<dd><p>Interface of data from event.</p>
+</dd>
+<dt><a href="#user-content-w_IPayPalMeta">IPayPalMeta</a></dt>
+<dd><p>Interface for PayPal checkout meta information</p>
+</dd>
+<dt><a href="#user-content-w_IStyles">IStyles</a></dt>
+<dd><p>Interface for classes that represent widget&#39;s styles.</p>
+</dd>
+<dt><a href="#user-content-w_ITexts">ITexts</a></dt>
+<dd><p>Interface for classes that represent widget&#39;s text.</p>
+</dd>
+<dt><a href="#user-content-w_IBamboraMeta">IBamboraMeta</a></dt>
+<dd><p>Interface for Bamboora meta information</p>
+</dd>
+<dt><a href="#user-content-w_IElementStyleInput">IElementStyleInput</a></dt>
+<dd><p>Interface for styling input element.</p>
+</dd>
+<dt><a href="#user-content-w_IElementStyleSubmitButton">IElementStyleSubmitButton</a></dt>
+<dd><p>Interface for styling submit_button element.</p>
+</dd>
+<dt><a href="#user-content-w_IElementStyleLabel">IElementStyleLabel</a></dt>
+<dd><p>Interface for styling label element.</p>
+</dd>
+<dt><a href="#user-content-w_IElementStyleTitle">IElementStyleTitle</a></dt>
+<dd><p>Interface for styling title element.</p>
+</dd>
+<dt><a href="#user-content-w_IElementStyleTitleDescription">IElementStyleTitleDescription</a></dt>
+<dd><p>Interface for styling title_description element.</p>
+</dd>
+<dt><a href="#user-content-w_ITriggerData">ITriggerData</a></dt>
+<dd><p>Interface for classes that represent a trigger data.</p>
+</dd>
+</dl>
+
+<a name="w_IFormValidation" id="w_IFormValidation" href="#user-content-w_IFormValidation">&nbsp;</a>
+
+## IFormValidation
+Interface of data from validation event.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| event | <code>string</code> | The name of the event. |
+| message_source | <code>string</code> | A system variable that identifies the event source. |
+| purpose | <code>string</code> | A system variable that states the purpose of the event. |
+| [ref_id] | <code>string</code> | Custom unique value that identifies result of processed operation. |
+| [form_valid] | <code>boolean</code> | Indicates wether or not the form is valid. |
+| [invalid_fields] | <code>Array.&lt;string&gt;</code> | Names of form fields with invalid data. |
+| [invalid_showed_fields] | <code>Array.&lt;string&gt;</code> | Names of invalid form fields which are already displaying the error. |
+| [validators] | <code>Partial.&lt;Record.&lt;(CardValidatorValue\|GenericValidatorValue), Array.&lt;string&gt;&gt;&gt;</code> | 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](#user-content-w_GENERIC_VALIDATORS) and [Card Validators](#user-content-w_CARD_VALIDATORS), |
+
+<a name="w_IEventMetaData" id="w_IEventMetaData" href="#user-content-w_IEventMetaData">&nbsp;</a>
+
+## IEventMetaData
+Contains basic information associated with the event and additional meta data
+specific to the event. E.g., card info, gateway info, etc.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| event | <code>string</code> | The name of the event. |
+| purpose | <code>string</code> | A system variable that states the purpose of the event. |
+| message_source | <code>string</code> | A system variable that identifies the event source. |
+| [ref_id] | <code>string</code> | Custom unique value that identifies result of processed operation. |
+| configuration_token | <code>string</code> | Token received from our API with widget data |
+| type | <code>string</code> | Payment type 'card', 'bank_account' |
+| gateway_type | <code>string</code> | Gateway type |
+| [card_number_last4] | <code>string</code> | Last 4 digit of your card |
+| [card_scheme] | <code>string</code> | Card scheme, e.g., (Visa, Mastercard and American Express (AmEx)) |
+| [card_number_length] | <code>number</code> | Card number length |
+| [account_name] | <code>string</code> | Bank account account name |
+| [account_number] | <code>string</code> | Bank account account number |
+
+<a name="w_IEventAfterLoadData" id="w_IEventAfterLoadData" href="#user-content-w_IEventAfterLoadData">&nbsp;</a>
+
+## IEventAfterLoadData
+Interface of data from event.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| event | <code>string</code> | The name of the event. |
+| purpose | <code>string</code> | A system variable that states the purpose of the event. |
+| message_source | <code>string</code> | A system variable that identifies the event source. |
+| [ref_id] | <code>string</code> | Custom unique value that identifies result of processed operation. |
+
+<a name="w_IEventFinishData" id="w_IEventFinishData" href="#user-content-w_IEventFinishData">&nbsp;</a>
+
+## IEventFinishData
+Interface of data from event.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| event | <code>string</code> | The name of the event. |
+| purpose | <code>string</code> | A system variable that states the purpose of the event. |
+| message_source | <code>string</code> | A system variable that identifies the event source. |
+| [ref_id] | <code>string</code> | Custom unique value that identifies result of processed operation. |
+| payment_source | <code>string</code> | One time token. Result from this endpoint [API docs](https://docs.paydock.com/#tokens) |
+
+<a name="w_IPayPalMeta" id="w_IPayPalMeta" href="#user-content-w_IPayPalMeta">&nbsp;</a>
+
+## IPayPalMeta
+Interface for PayPal checkout meta information
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [brand_name] | <code>string</code> | A label that overrides the business name in the PayPal account on the PayPal hosted checkout pages |
+| [cart_border_color] | <code>string</code> | The HTML hex code for your principal identifying color |
+| [reference] | <code>string</code> | Merchant Customer Service number displayed on the PayPal pages |
+| [email] | <code>string</code> | The consumer’s email |
+| [hdr_img] | <code>string</code> | URL for the image you want to appear at the top left of the payment page |
+| [logo_img] | <code>string</code> | A URL to your logo image |
+| [pay_flow_color] | <code>string</code> | Sets the background color for the payment page. By default, the color is white. |
+| [first_name] | <code>string</code> | The consumer’s given names |
+| [last_name] | <code>string</code> | The consumer’s surname |
+| [address_line] | <code>string</code> | Street address |
+| [address_line2] | <code>string</code> | Second line of the address |
+| [address_city] | <code>string</code> | City |
+| [address_state] | <code>string</code> | State |
+| [address_postcode] | <code>string</code> | Postcode |
+| [address_country] | <code>string</code> | Country |
+| [phone] | <code>string</code> | The consumer’s phone number in E.164 international notation (Example: +12345678901) |
+| [hide_shipping_address] | <code>boolean</code> | Determines whether PayPal displays shipping address fields on the PayPal pages |
+
+<a name="w_IStyles" id="w_IStyles" href="#user-content-w_IStyles">&nbsp;</a>
+
+## IStyles
+Interface for classes that represent widget's styles.
+
+**Kind**: global interface  
+
+| Param | Type |
+| --- | --- |
+| [background_color] | <code>string</code> | 
+| [text_color] | <code>string</code> | 
+| [border_color] | <code>string</code> | 
+| [button_color] | <code>string</code> | 
+| [error_color] | <code>string</code> | 
+| [success_color] | <code>string</code> | 
+| [font_size] | <code>string</code> | 
+| [font_family] | <code>string</code> | 
+
+<a name="w_ITexts" id="w_ITexts" href="#user-content-w_ITexts">&nbsp;</a>
+
+## ITexts
+Interface for classes that represent widget's text.
+
+**Kind**: global interface  
+
+| Param | Type |
+| --- | --- |
+| [title] | <code>string</code> | 
+| [title_h1] | <code>string</code> | 
+| [title_h2] | <code>string</code> | 
+| [title_h3] | <code>string</code> | 
+| [title_h4] | <code>string</code> | 
+| [title_h5] | <code>string</code> | 
+| [title_h6] | <code>string</code> | 
+| [finish_text] | <code>string</code> | 
+| [title_description] | <code>string</code> | 
+| [submit_button] | <code>string</code> | 
+| [submit_button_processing] | <code>string</code> | 
+
+<a name="w_IBamboraMeta" id="w_IBamboraMeta" href="#user-content-w_IBamboraMeta">&nbsp;</a>
+
+## IBamboraMeta
+Interface for Bamboora meta information
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [customer_storage_number] | <code>string</code> | Customer storage number |
+| [tokenise_algorithm] | <code>number</code> | Tokenise algorithm |
+
+<a name="w_IElementStyleInput" id="w_IElementStyleInput" href="#user-content-w_IElementStyleInput">&nbsp;</a>
+
+## IElementStyleInput
+Interface for styling input element.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [color] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/color) |
+| [border] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/border) |
+| [border_radius] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) |
+| [background_color] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color) |
+| [height] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/height) |
+| [text_decoration] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration) |
+| [font_size] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size) |
+| [font_family] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) |
+| [transition] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/transition) |
+| [line_height] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) |
+| [font_weight] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight) |
+| [padding] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) |
+| [margin] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/margin) |
+
+<a name="w_IElementStyleSubmitButton" id="w_IElementStyleSubmitButton" href="#user-content-w_IElementStyleSubmitButton">&nbsp;</a>
+
+## IElementStyleSubmitButton
+Interface for styling submit_button element.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [color] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/color) |
+| [border] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/border) |
+| [border_radius] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) |
+| [background_color] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color) |
+| [text_decoration] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration) |
+| [font_size] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size) |
+| [font_family] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) |
+| [padding] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) |
+| [margin] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/margin) |
+| [transition] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/transition) |
+| [line_height] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) |
+| [font_weight] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight) |
+| [opacity] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity) |
+
+<a name="w_IElementStyleLabel" id="w_IElementStyleLabel" href="#user-content-w_IElementStyleLabel">&nbsp;</a>
+
+## IElementStyleLabel
+Interface for styling label element.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [color] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/color) |
+| [text_decoration] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration) |
+| [font_size] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size) |
+| [font_family] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) |
+| [line_height] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) |
+| [font_weight] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight) |
+| [padding] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) |
+| [margin] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/margin) |
+
+<a name="w_IElementStyleTitle" id="w_IElementStyleTitle" href="#user-content-w_IElementStyleTitle">&nbsp;</a>
+
+## IElementStyleTitle
+Interface for styling title element.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [color] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/color) |
+| [text_decoration] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration) |
+| [font_size] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size) |
+| [font_family] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) |
+| [line_height] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) |
+| [font_weight] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight) |
+| [padding] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) |
+| [margin] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/margin) |
+| ['text-align',] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align) |
+
+<a name="w_IElementStyleTitleDescription" id="w_IElementStyleTitleDescription" href="#user-content-w_IElementStyleTitleDescription">&nbsp;</a>
+
+## IElementStyleTitleDescription
+Interface for styling title_description element.
+
+**Kind**: global interface  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [color] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/color) |
+| [text_decoration] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration) |
+| [font_size] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size) |
+| [font_family] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family) |
+| [line_height] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) |
+| [font_weight] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight) |
+| [padding] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/padding) |
+| [margin] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/margin) |
+| ['text-align',] | <code>string</code> | Look more [mozilla.org/color](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align) |
+
+<a name="w_ITriggerData" id="w_ITriggerData" href="#user-content-w_ITriggerData">&nbsp;</a>
+
+## ITriggerData
+Interface for classes that represent a trigger data.
+
+**Kind**: global interface  
+
+| Param | Type |
+| --- | --- |
+| [configuration_token] | <code>string</code> | 
+| [tab_number] | <code>string</code> | 
+| [elements] | <code>string</code> | 
+| [form_values] | <code>string</code> | 
+
+<a name="w_HtmlWidget" id="w_HtmlWidget" href="#user-content-w_HtmlWidget">&nbsp;</a>
+
+## HtmlWidget ⇐ [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)
+Class Widget include method for working on html and include extended by HtmlMultiWidget methods
+
+**Kind**: global class  
+**Extends**: [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget), [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+* [HtmlWidget](#user-content-w_HtmlWidget) ⇐ [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)
+    * [new HtmlWidget(selector, publicKey, [gatewayID], [paymentType], [purpose])](#user-content-w_new_HtmlWidget_new)
+    * [.setWebHookDestination(url)](#user-content-w_HtmlWidget+setWebHookDestination)
+    * [.setSuccessRedirectUrl(url)](#user-content-w_HtmlWidget+setSuccessRedirectUrl)
+    * [.setErrorRedirectUrl(url)](#user-content-w_HtmlWidget+setErrorRedirectUrl)
+    * [.setFormFields(fields)](#user-content-w_HtmlWidget+setFormFields)
+    * [.setFormElements(elements)](#user-content-w_HtmlWidget+setFormElements)
+    * [.setMeta(object)](#user-content-w_HtmlWidget+setMeta)
+    * [.load()](#user-content-w_HtmlMultiWidget+load)
+    * [.afterLoad()](#user-content-w_HtmlMultiWidget+afterLoad)
+    * [.trigger(triggers, data)](#user-content-w_HtmlMultiWidget+trigger)
+    * [.getValidationState()](#user-content-w_HtmlMultiWidget+getValidationState) ⇒ [<code>IFormValidation</code>](#user-content-w_IFormValidation)
+    * [.isValidForm()](#user-content-w_HtmlMultiWidget+isValidForm) ⇒ <code>boolean</code>
+    * [.isInvalidField(field)](#user-content-w_HtmlMultiWidget+isInvalidField) ⇒ <code>boolean</code>
+    * [.isFieldErrorShowed(field)](#user-content-w_HtmlMultiWidget+isFieldErrorShowed) ⇒ <code>boolean</code>
+    * [.isInvalidFieldByValidator(field, validator)](#user-content-w_HtmlMultiWidget+isInvalidFieldByValidator) ⇒ <code>boolean</code>
+    * [.hide([saveSize])](#user-content-w_HtmlMultiWidget+hide)
+    * [.show()](#user-content-w_HtmlMultiWidget+show)
+    * [.reload()](#user-content-w_HtmlMultiWidget+reload)
+    * [.hideElements(elements)](#user-content-w_HtmlMultiWidget+hideElements)
+    * [.showElements(elements)](#user-content-w_HtmlMultiWidget+showElements)
+    * [.updateFormValues(fieldValues)](#user-content-w_HtmlMultiWidget+updateFormValues)
+    * [.updateFormValue(key, value)](#user-content-w_HtmlMultiWidget+updateFormValue)
+    * [.onFinishInsert(selector, dataType)](#user-content-w_HtmlMultiWidget+onFinishInsert)
+    * [.interceptSubmitForm(selector)](#user-content-w_HtmlMultiWidget+interceptSubmitForm)
+    * [.useCheckoutAutoSubmit()](#user-content-w_HtmlMultiWidget+useCheckoutAutoSubmit)
+    * [.useAutoResize()](#user-content-w_HtmlMultiWidget+useAutoResize)
+    * [.setStyles(fields)](#user-content-w_MultiWidget+setStyles)
+    * [.usePhoneCountryMask([options])](#user-content-w_MultiWidget+usePhoneCountryMask)
+    * [.setTexts(fields)](#user-content-w_MultiWidget+setTexts)
+    * [.setElementStyle(element, [state], styles)](#user-content-w_MultiWidget+setElementStyle)
+    * [.setFormValues(fieldValues)](#user-content-w_MultiWidget+setFormValues)
+    * [.setFormLabels(fieldLabels)](#user-content-w_MultiWidget+setFormLabels)
+    * [.setFormPlaceholders(fieldPlaceholders)](#user-content-w_MultiWidget+setFormPlaceholders)
+    * ~~[.setIcons()](#user-content-w_MultiWidget+setIcons)~~
+    * [.setHiddenElements(elements)](#user-content-w_MultiWidget+setHiddenElements)
+    * [.setRefId(refId)](#user-content-w_MultiWidget+setRefId)
+    * [.useGatewayFieldValidation()](#user-content-w_MultiWidget+useGatewayFieldValidation)
+    * [.setSupportedCardIcons(elements, validateCardNumberInput)](#user-content-w_MultiWidget+setSupportedCardIcons)
+    * [.hideUiErrors()](#user-content-w_MultiWidget+hideUiErrors)
+    * [.setEnv(env, [alias])](#user-content-w_MultiWidget+setEnv)
+    * [.loadIFrameUrl()](#user-content-w_MultiWidget+loadIFrameUrl)
+    * [.setLanguage(code)](#user-content-w_MultiWidget+setLanguage)
+
+<a name="w_new_HtmlWidget_new" id="w_new_HtmlWidget_new" href="#user-content-w_new_HtmlWidget_new">&nbsp;</a>
+
+### new HtmlWidget(selector, publicKey, [gatewayID], [paymentType], [purpose])
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| selector | <code>string</code> |  | Selector of html element. Container for widget |
+| publicKey | <code>string</code> |  | PayDock users public key |
+| [gatewayID] | <code>string</code> | <code>&quot;default&quot;</code> | 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. |
+| [paymentType] | <code>string</code> | <code>&quot;card&quot;</code> | Type of payment source which shows in widget form. Available parameters : “card”, “bank_account”. |
+| [purpose] | <code>string</code> | <code>&quot;payment_source&quot;</code> | Purpose of widget form. Available parameters: ‘payment_source’, ‘card_payment_source_with_cvv’, ‘card_payment_source_without_cvv’ |
+
+**Example**  
+
+```javascript
+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
+```
+<a name="w_HtmlWidget+setWebHookDestination" id="w_HtmlWidget+setWebHookDestination" href="#user-content-w_HtmlWidget+setWebHookDestination">&nbsp;</a>
+
+### htmlWidget.setWebHookDestination(url)
+Destination, where customer will receive all successful responses.
+Response will contain “data” object with “payment_source” or other parameters, in depending on 'purpose'
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| url | <code>string</code> | Your endpoint for post request. |
+
+**Example**  
+
+```javascript
+widget.setWebHookDestination('http://google.com');
+```
+<a name="w_HtmlWidget+setSuccessRedirectUrl" id="w_HtmlWidget+setSuccessRedirectUrl" href="#user-content-w_HtmlWidget+setSuccessRedirectUrl">&nbsp;</a>
+
+### htmlWidget.setSuccessRedirectUrl(url)
+URL to which the Customer will be redirected to after the success finish
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+
+| Param | Type |
+| --- | --- |
+| url | <code>string</code> | 
+
+**Example**  
+
+```javascript
+widget.setSuccessRedirectUrl('google.com/search?q=success');
+```
+<a name="w_HtmlWidget+setErrorRedirectUrl" id="w_HtmlWidget+setErrorRedirectUrl" href="#user-content-w_HtmlWidget+setErrorRedirectUrl">&nbsp;</a>
+
+### htmlWidget.setErrorRedirectUrl(url)
+URL to which the Customer will be redirected to if an error is triggered in the process of operation
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+
+| Param | Type |
+| --- | --- |
+| url | <code>string</code> | 
+
+**Example**  
+
+```javascript
+widget.setErrorRedirectUrl('google.com/search?q=error');
+```
+<a name="w_HtmlWidget+setFormFields" id="w_HtmlWidget+setFormFields" href="#user-content-w_HtmlWidget+setFormFields">&nbsp;</a>
+
+### htmlWidget.setFormFields(fields)
+Set list with widget form field, which will be shown in form. Also you can set the required validation for these fields
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fields | <code>Array.&lt;string&gt;</code> | 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](#user-content-w_FORM_FIELD) |
+
+**Example**  
+
+```javascript
+widget.setFormFields(['phone', 'email', 'first_name*']);
+```
+<a name="w_HtmlWidget+setFormElements" id="w_HtmlWidget+setFormElements" href="#user-content-w_HtmlWidget+setFormElements">&nbsp;</a>
+
+### htmlWidget.setFormElements(elements)
+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
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setFormElements</code>](#user-content-w_MultiWidget+setFormElements)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;Object&gt;</code> | List of elements |
+| elements[].field | <code>string</code> | 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](#user-content-w_FORM_FIELD) |
+| elements[].placeholder | <code>string</code> | Set custom placeholders in form fields |
+| elements[].label | <code>string</code> | Set a custom labels near the form field |
+| elements[].value | <code>string</code> | Set predefined values for the form field |
+
+**Example**  
+
+```javascript
+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',
+      },
+  ])
+```
+<a name="w_HtmlWidget+setMeta" id="w_HtmlWidget+setMeta" href="#user-content-w_HtmlWidget+setMeta">&nbsp;</a>
+
+### htmlWidget.setMeta(object)
+The method to set meta information for the checkout page
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| object | [<code>IPayPalMeta</code>](#user-content-w_IPayPalMeta) \| [<code>IBamboraMeta</code>](#user-content-w_IBamboraMeta) | data which can be shown on checkout page [IPayPalMeta](#user-content-w_IPayPalMeta) [IBamboraMeta](#user-content-w_IBamboraMeta) |
+
+**Example**  
+
+```javascript
+config.setMeta({
+              brand_name: 'paydock',
+              reference: '15',
+              email: 'wault@paydock.com'
+          });
+```
+<a name="w_HtmlMultiWidget+load" id="w_HtmlMultiWidget+load" href="#user-content-w_HtmlMultiWidget+load">&nbsp;</a>
+
+### htmlWidget.load()
+Loads the widget.
+
+Calling this method results in an iframe element being inserted and rendered in the DOM.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>load</code>](#user-content-w_HtmlMultiWidget+load)  
+<a name="w_HtmlMultiWidget+afterLoad" id="w_HtmlMultiWidget+afterLoad" href="#user-content-w_HtmlMultiWidget+afterLoad">&nbsp;</a>
+
+### htmlWidget.afterLoad()
+Registers a form validation callback for validation events.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>afterLoad</code>](#user-content-w_HtmlMultiWidget+afterLoad)  
+<a name="w_HtmlMultiWidget+trigger" id="w_HtmlMultiWidget+trigger" href="#user-content-w_HtmlMultiWidget+trigger">&nbsp;</a>
+
+### htmlWidget.trigger(triggers, data)
+Registers callback that will be invoked for every trigger.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>trigger</code>](#user-content-w_HtmlMultiWidget+trigger)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| triggers | <code>&#x27;submit\_form&#x27;</code> \| <code>&#x27;tab&#x27;</code> | The Widget element identifier that caused the trigger. |
+| data | [<code>ITriggerData</code>](#user-content-w_ITriggerData) | Data that will be sent to the widget when the trigger occurs. |
+
+<a name="w_HtmlMultiWidget+getValidationState" id="w_HtmlMultiWidget+getValidationState" href="#user-content-w_HtmlMultiWidget+getValidationState">&nbsp;</a>
+
+### htmlWidget.getValidationState() ⇒ [<code>IFormValidation</code>](#user-content-w_IFormValidation)
+Gets a reference to the form current validation state.
+
+!Warning: do not directly modify the values of the returned object.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>getValidationState</code>](#user-content-w_HtmlMultiWidget+getValidationState)  
+**Returns**: [<code>IFormValidation</code>](#user-content-w_IFormValidation) - Form validation object  
+<a name="w_HtmlMultiWidget+isValidForm" id="w_HtmlMultiWidget+isValidForm" href="#user-content-w_HtmlMultiWidget+isValidForm">&nbsp;</a>
+
+### htmlWidget.isValidForm() ⇒ <code>boolean</code>
+Checks if a given form is valid.
+
+A form is valid if all form fields are valid.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>isValidForm</code>](#user-content-w_HtmlMultiWidget+isValidForm)  
+**Returns**: <code>boolean</code> - Indicates wether or not form is valid.  
+<a name="w_HtmlMultiWidget+isInvalidField" id="w_HtmlMultiWidget+isInvalidField" href="#user-content-w_HtmlMultiWidget+isInvalidField">&nbsp;</a>
+
+### htmlWidget.isInvalidField(field) ⇒ <code>boolean</code>
+Using this method you can check if a specific form field is invalid
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>isInvalidField</code>](#user-content-w_HtmlMultiWidget+isInvalidField)  
+**Returns**: <code>boolean</code> - Field is invalid  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| field | <code>string</code> | Field name |
+
+<a name="w_HtmlMultiWidget+isFieldErrorShowed" id="w_HtmlMultiWidget+isFieldErrorShowed" href="#user-content-w_HtmlMultiWidget+isFieldErrorShowed">&nbsp;</a>
+
+### htmlWidget.isFieldErrorShowed(field) ⇒ <code>boolean</code>
+Checks if a given form field is displaying an error.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>isFieldErrorShowed</code>](#user-content-w_HtmlMultiWidget+isFieldErrorShowed)  
+**Returns**: <code>boolean</code> - Indicates wether or not the Error message is being displayed on the associated field.  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| field | <code>string</code> | The form field name |
+
+<a name="w_HtmlMultiWidget+isInvalidFieldByValidator" id="w_HtmlMultiWidget+isInvalidFieldByValidator" href="#user-content-w_HtmlMultiWidget+isInvalidFieldByValidator">&nbsp;</a>
+
+### htmlWidget.isInvalidFieldByValidator(field, validator) ⇒ <code>boolean</code>
+Checks if a given form field is valid or invalid by name.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>isInvalidFieldByValidator</code>](#user-content-w_HtmlMultiWidget+isInvalidFieldByValidator)  
+**Returns**: <code>boolean</code> - Indicates wether or not the field is invalid based on validator intepretation.  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| field | <code>string</code> | The form field name |
+| validator |  | The name of the validator. |
+
+<a name="w_HtmlMultiWidget+hide" id="w_HtmlMultiWidget+hide" href="#user-content-w_HtmlMultiWidget+hide">&nbsp;</a>
+
+### htmlWidget.hide([saveSize])
+Hides the widget.
+
+E.g., use this method to hide the widget after it loads.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>hide</code>](#user-content-w_HtmlMultiWidget+hide)  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| [saveSize] | <code>boolean</code> | <code>false</code> | Wether the original iframe element size should be saved before being hidden. |
+
+<a name="w_HtmlMultiWidget+show" id="w_HtmlMultiWidget+show" href="#user-content-w_HtmlMultiWidget+show">&nbsp;</a>
+
+### htmlWidget.show()
+Shows the widget.
+
+E.g., use this method to show the widget after it was explicitly hidden.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>show</code>](#user-content-w_HtmlMultiWidget+show)  
+<a name="w_HtmlMultiWidget+reload" id="w_HtmlMultiWidget+reload" href="#user-content-w_HtmlMultiWidget+reload">&nbsp;</a>
+
+### htmlWidget.reload()
+Reloads the widget.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>reload</code>](#user-content-w_HtmlMultiWidget+reload)  
+<a name="w_HtmlMultiWidget+hideElements" id="w_HtmlMultiWidget+hideElements" href="#user-content-w_HtmlMultiWidget+hideElements">&nbsp;</a>
+
+### htmlWidget.hideElements(elements)
+Hides the specified Widget elements by their identifier.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>hideElements</code>](#user-content-w_HtmlMultiWidget+hideElements)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | List of element which can be hidden [ELEMENT](#user-content-w_ELEMENT) || [FORM_FIELD](#user-content-w_FORM_FIELD) |
+
+**Example**  
+```javascript
+widget.hideElements(['submit_button', 'email']);
+```
+<a name="w_HtmlMultiWidget+showElements" id="w_HtmlMultiWidget+showElements" href="#user-content-w_HtmlMultiWidget+showElements">&nbsp;</a>
+
+### htmlWidget.showElements(elements)
+Shows the specified Widget elements by their identifier.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>showElements</code>](#user-content-w_HtmlMultiWidget+showElements)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | List of elements which can be showed [ELEMENT](#user-content-w_ELEMENT) || [FORM_FIELD](#user-content-w_FORM_FIELD) |
+
+**Example**  
+```javascript
+widget.showElements(['submit_button', 'email']);
+```
+<a name="w_HtmlMultiWidget+updateFormValues" id="w_HtmlMultiWidget+updateFormValues" href="#user-content-w_HtmlMultiWidget+updateFormValues">&nbsp;</a>
+
+### htmlWidget.updateFormValues(fieldValues)
+Updates the form field values inside the widget.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>updateFormValues</code>](#user-content-w_HtmlMultiWidget+updateFormValues)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldValues | <code>IFormValues</code> | Fields with values |
+
+**Example**  
+```javascript
+widget.updateFormValues({
+  email: 'predefined@email.com',
+  card_name: 'Houston'
+});
+```
+<a name="w_HtmlMultiWidget+updateFormValue" id="w_HtmlMultiWidget+updateFormValue" href="#user-content-w_HtmlMultiWidget+updateFormValue">&nbsp;</a>
+
+### htmlWidget.updateFormValue(key, value)
+Updates a single form field values inside the widget by the form field name.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>updateFormValue</code>](#user-content-w_HtmlMultiWidget+updateFormValue)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| key | <code>string</code> | The form field name |
+| value | <code>string</code> | The form field value |
+
+**Example**  
+```javascript
+widget.updateFormValue("card_name", "John Doe");
+```
+<a name="w_HtmlMultiWidget+onFinishInsert" id="w_HtmlMultiWidget+onFinishInsert" href="#user-content-w_HtmlMultiWidget+onFinishInsert">&nbsp;</a>
+
+### htmlWidget.onFinishInsert(selector, dataType)
+Inserts the event data (after finish event) onto the input field associated with the provided CSS selector.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>onFinishInsert</code>](#user-content-w_HtmlMultiWidget+onFinishInsert)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| selector | <code>string</code> | A CSS selector. E.g., ".my-class", "#my-id", or others |
+| dataType | <code>string</code> | The data type of IEventData object. |
+
+<a name="w_HtmlMultiWidget+interceptSubmitForm" id="w_HtmlMultiWidget+interceptSubmitForm" href="#user-content-w_HtmlMultiWidget+interceptSubmitForm">&nbsp;</a>
+
+### htmlWidget.interceptSubmitForm(selector)
+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
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>interceptSubmitForm</code>](#user-content-w_HtmlMultiWidget+interceptSubmitForm)  
+**Note**: The widget's submit button will be hidden.  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| selector | <code>string</code> | 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>
+```
+<a name="w_HtmlMultiWidget+useCheckoutAutoSubmit" id="w_HtmlMultiWidget+useCheckoutAutoSubmit" href="#user-content-w_HtmlMultiWidget+useCheckoutAutoSubmit">&nbsp;</a>
+
+### htmlWidget.useCheckoutAutoSubmit()
+This method hides a submit button and automatically execute form submit
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>useCheckoutAutoSubmit</code>](#user-content-w_HtmlMultiWidget+useCheckoutAutoSubmit)  
+<a name="w_HtmlMultiWidget+useAutoResize" id="w_HtmlMultiWidget+useAutoResize" href="#user-content-w_HtmlMultiWidget+useAutoResize">&nbsp;</a>
+
+### htmlWidget.useAutoResize()
+Use this method for resize iFrame according content height
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>useAutoResize</code>](#user-content-w_HtmlMultiWidget+useAutoResize)  
+**Example**  
+```javascript
+widget.useAutoResize();
+```
+<a name="w_MultiWidget+setStyles" id="w_MultiWidget+setStyles" href="#user-content-w_MultiWidget+setStyles">&nbsp;</a>
+
+### htmlWidget.setStyles(fields)
+Object contain styles for widget
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setStyles</code>](#user-content-w_MultiWidget+setStyles)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fields | [<code>IStyles</code>](#user-content-w_IStyles) | name of styles which can be shown in widget [STYLE](#user-content-w_STYLE) |
+
+**Example**  
+
+```javascript
+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'
+  });
+```
+<a name="w_MultiWidget+usePhoneCountryMask" id="w_MultiWidget+usePhoneCountryMask" href="#user-content-w_MultiWidget+usePhoneCountryMask">&nbsp;</a>
+
+### htmlWidget.usePhoneCountryMask([options])
+Method to set a country code mask for the phone input.
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>usePhoneCountryMask</code>](#user-content-w_MultiWidget+usePhoneCountryMask)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [options] | <code>object</code> | Options for configure the phone mask. |
+| [options.default_country] | <code>string</code> | Set a default country for the mask. |
+| [options.preferred_countries] | <code>Array.&lt;string&gt;</code> | Set list of preferred countries for the top of the select box . |
+| [options.only_countries] | <code>Array.&lt;string&gt;</code> | Set list of countries to show in the select box. |
+
+**Example**  
+
+```javascript
+widget.usePhoneCountryMask();
+```
+**Example**  
+
+```javascript
+widget.usePhoneCountryMask({
+      default_country: 'au',
+      preferred_countries: ['au', 'gb'],
+      only_countries: ['au', 'gb', 'us', 'ua']
+  });
+```
+<a name="w_MultiWidget+setTexts" id="w_MultiWidget+setTexts" href="#user-content-w_MultiWidget+setTexts">&nbsp;</a>
+
+### htmlWidget.setTexts(fields)
+Method for set different texts inside the widget
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setTexts</code>](#user-content-w_MultiWidget+setTexts)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fields | [<code>ITexts</code>](#user-content-w_ITexts) | name of text items which can be shown in widget [TEXT](#user-content-w_TEXT) |
+
+**Example**  
+
+```javascript
+widget.setTexts({
+      title: 'Your card',
+      finish_text: 'Payment resource was successfully accepted',
+      title_description: '* indicates required field',
+      submit_button: 'Save',
+      submit_button_processing: 'Load...',
+  });
+```
+<a name="w_MultiWidget+setElementStyle" id="w_MultiWidget+setElementStyle" href="#user-content-w_MultiWidget+setElementStyle">&nbsp;</a>
+
+### htmlWidget.setElementStyle(element, [state], styles)
+Method for set styles for different elements and states
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setElementStyle</code>](#user-content-w_MultiWidget+setElementStyle)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| element | <code>string</code> | type of element for styling. These elements are available [STYLABLE_ELEMENT](#user-content-w_STYLABLE_ELEMENT) |
+| [state] | <code>string</code> | state of element for styling. These states are available [STYLABLE_ELEMENT_STATE](#user-content-w_STYLABLE_ELEMENT_STATE) |
+| styles | [<code>IElementStyleInput</code>](#user-content-w_IElementStyleInput) \| [<code>IElementStyleSubmitButton</code>](#user-content-w_IElementStyleSubmitButton) \| [<code>IElementStyleLabel</code>](#user-content-w_IElementStyleLabel) \| [<code>IElementStyleTitle</code>](#user-content-w_IElementStyleTitle) \| [<code>IElementStyleTitleDescription</code>](#user-content-w_IElementStyleTitleDescription) | styles list |
+
+**Example**  
+
+```javascript
+widget.setElementStyle('input', {
+  border: 'green solid 1px'
+});
+
+widget.setElementStyle('input', 'focus', {
+  border: 'blue solid 1px'
+});
+
+widget.setElementStyle('input', 'error', {
+ border: 'red solid 1px'
+});
+```
+<a name="w_MultiWidget+setFormValues" id="w_MultiWidget+setFormValues" href="#user-content-w_MultiWidget+setFormValues">&nbsp;</a>
+
+### htmlWidget.setFormValues(fieldValues)
+The method to set the predefined values for the form fields inside the widget
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setFormValues</code>](#user-content-w_MultiWidget+setFormValues)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldValues | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), The object value is what we are expecting |
+
+**Example**  
+
+```javascript
+widget.setFormValues({
+      email: 'predefined@email.com',
+      card_name: 'Houston'
+  });
+```
+<a name="w_MultiWidget+setFormLabels" id="w_MultiWidget+setFormLabels" href="#user-content-w_MultiWidget+setFormLabels">&nbsp;</a>
+
+### htmlWidget.setFormLabels(fieldLabels)
+The method to set custom form field labels
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setFormLabels</code>](#user-content-w_MultiWidget+setFormLabels)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldLabels | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), The object value is what we are expecting |
+
+**Example**  
+
+```javascript
+widget.setFormPlaceholders({
+      card_name: 'Card Holder Name',
+      email: 'Email For Receipt'
+  })
+```
+<a name="w_MultiWidget+setFormPlaceholders" id="w_MultiWidget+setFormPlaceholders" href="#user-content-w_MultiWidget+setFormPlaceholders">&nbsp;</a>
+
+### htmlWidget.setFormPlaceholders(fieldPlaceholders)
+The method to set custom form fields placeholders
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setFormPlaceholders</code>](#user-content-w_MultiWidget+setFormPlaceholders)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldPlaceholders | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), Value of object is expected placeholder |
+
+**Example**  
+
+```javascript
+widget.setFormPlaceholders({
+      card_name: 'Input your card holder name...',
+      email: 'Input your email, like test@example.com'
+  })
+```
+<a name="w_MultiWidget+setIcons" id="w_MultiWidget+setIcons" href="#user-content-w_MultiWidget+setIcons">&nbsp;</a>
+
+### ~~htmlWidget.setIcons()~~
+***Deprecated***
+
+The method to change the widget icons
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setIcons</code>](#user-content-w_MultiWidget+setIcons)  
+<a name="w_MultiWidget+setHiddenElements" id="w_MultiWidget+setHiddenElements" href="#user-content-w_MultiWidget+setHiddenElements">&nbsp;</a>
+
+### htmlWidget.setHiddenElements(elements)
+Using this method you can set hidden elements inside widget
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setHiddenElements</code>](#user-content-w_MultiWidget+setHiddenElements)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | list of element which can be hidden [ELEMENT](#user-content-w_ELEMENT) || [FORM_FIELD](#user-content-w_FORM_FIELD) |
+
+**Example**  
+
+```javascript
+widget.setHiddenElements(['submit_button', 'email']);
+```
+<a name="w_MultiWidget+setRefId" id="w_MultiWidget+setRefId" href="#user-content-w_MultiWidget+setRefId">&nbsp;</a>
+
+### htmlWidget.setRefId(refId)
+Current method can set custom ID to identify the data in the future
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setRefId</code>](#user-content-w_MultiWidget+setRefId)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| refId | <code>string</code> | custom id |
+
+**Example**  
+
+```javascript
+widget.setRefId('id');
+```
+<a name="w_MultiWidget+useGatewayFieldValidation" id="w_MultiWidget+useGatewayFieldValidation" href="#user-content-w_MultiWidget+useGatewayFieldValidation">&nbsp;</a>
+
+### htmlWidget.useGatewayFieldValidation()
+Current method can add visual validation from gateway to widget's form fields
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>useGatewayFieldValidation</code>](#user-content-w_MultiWidget+useGatewayFieldValidation)  
+**Example**  
+
+```javascript
+widget.useGatewayFieldValidation();
+```
+<a name="w_MultiWidget+setSupportedCardIcons" id="w_MultiWidget+setSupportedCardIcons" href="#user-content-w_MultiWidget+setSupportedCardIcons">&nbsp;</a>
+
+### htmlWidget.setSupportedCardIcons(elements, validateCardNumberInput)
+Current method can set icons of supported card types
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setSupportedCardIcons</code>](#user-content-w_MultiWidget+setSupportedCardIcons)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | [SUPPORTED_CARD_TYPES](#user-content-w_SUPPORTED_CARD_TYPES) |
+| validateCardNumberInput | <code>boolean</code> | [validateCardNumberInput=false] - using this param you allow validation for card number input on supported card types |
+
+**Example**  
+
+```javascript
+widget.setSupportedCardIcons(['mastercard', 'visa'], validateCardNumberInput);
+```
+<a name="w_MultiWidget+hideUiErrors" id="w_MultiWidget+hideUiErrors" href="#user-content-w_MultiWidget+hideUiErrors">&nbsp;</a>
+
+### htmlWidget.hideUiErrors()
+Current method can hide prevent the widget from showing the error messages
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>hideUiErrors</code>](#user-content-w_MultiWidget+hideUiErrors)  
+**Example**  
+
+```javascript
+widget.hideUiErrors('id');
+```
+<a name="w_MultiWidget+setEnv" id="w_MultiWidget+setEnv" href="#user-content-w_MultiWidget+setEnv">&nbsp;</a>
+
+### htmlWidget.setEnv(env, [alias])
+Current method can change environment. By default environment = sandbox.
+Also we can change domain alias for this environment. By default domain_alias = paydock.com
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setEnv</code>](#user-content-w_MultiWidget+setEnv)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| env | <code>string</code> | sandbox, production |
+| [alias] | <code>string</code> | Own domain alias |
+
+**Example**  
+
+```javascript
+widget.setEnv('production', 'paydock.com');
+```
+<a name="w_MultiWidget+loadIFrameUrl" id="w_MultiWidget+loadIFrameUrl" href="#user-content-w_MultiWidget+loadIFrameUrl">&nbsp;</a>
+
+### htmlWidget.loadIFrameUrl()
+Method for creating iframe url
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>loadIFrameUrl</code>](#user-content-w_MultiWidget+loadIFrameUrl)  
+**Example**  
+
+```javascript
+widget.loadIFrameUrl(function (url) {
+     console.log(url);
+}, function (errors) {
+     console.log(errors);
+});
+```
+<a name="w_MultiWidget+setLanguage" id="w_MultiWidget+setLanguage" href="#user-content-w_MultiWidget+setLanguage">&nbsp;</a>
+
+### htmlWidget.setLanguage(code)
+Method for setting a custom language code
+
+**Kind**: instance method of [<code>HtmlWidget</code>](#user-content-w_HtmlWidget)  
+**Overrides**: [<code>setLanguage</code>](#user-content-w_MultiWidget+setLanguage)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| code | <code>string</code> | ISO 639-1 |
+
+**Example**  
+
+```javascript
+config.setLanguage('en');
+```
+<a name="w_HtmlMultiWidget" id="w_HtmlMultiWidget" href="#user-content-w_HtmlMultiWidget">&nbsp;</a>
+
+## HtmlMultiWidget ⇐ [<code>MultiWidget</code>](#user-content-w_MultiWidget)
+Class HtmlMultiWidget include method for working with html
+
+**Kind**: global class  
+**Extends**: [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+* [HtmlMultiWidget](#user-content-w_HtmlMultiWidget) ⇐ [<code>MultiWidget</code>](#user-content-w_MultiWidget)
+    * [new HtmlMultiWidget(selector, publicKey, conf)](#user-content-w_new_HtmlMultiWidget_new)
+    * [.load()](#user-content-w_HtmlMultiWidget+load)
+    * [.afterLoad()](#user-content-w_HtmlMultiWidget+afterLoad)
+    * [.trigger(triggers, data)](#user-content-w_HtmlMultiWidget+trigger)
+    * [.getValidationState()](#user-content-w_HtmlMultiWidget+getValidationState) ⇒ [<code>IFormValidation</code>](#user-content-w_IFormValidation)
+    * [.isValidForm()](#user-content-w_HtmlMultiWidget+isValidForm) ⇒ <code>boolean</code>
+    * [.isInvalidField(field)](#user-content-w_HtmlMultiWidget+isInvalidField) ⇒ <code>boolean</code>
+    * [.isFieldErrorShowed(field)](#user-content-w_HtmlMultiWidget+isFieldErrorShowed) ⇒ <code>boolean</code>
+    * [.isInvalidFieldByValidator(field, validator)](#user-content-w_HtmlMultiWidget+isInvalidFieldByValidator) ⇒ <code>boolean</code>
+    * [.hide([saveSize])](#user-content-w_HtmlMultiWidget+hide)
+    * [.show()](#user-content-w_HtmlMultiWidget+show)
+    * [.reload()](#user-content-w_HtmlMultiWidget+reload)
+    * [.hideElements(elements)](#user-content-w_HtmlMultiWidget+hideElements)
+    * [.showElements(elements)](#user-content-w_HtmlMultiWidget+showElements)
+    * [.updateFormValues(fieldValues)](#user-content-w_HtmlMultiWidget+updateFormValues)
+    * [.updateFormValue(key, value)](#user-content-w_HtmlMultiWidget+updateFormValue)
+    * [.onFinishInsert(selector, dataType)](#user-content-w_HtmlMultiWidget+onFinishInsert)
+    * [.interceptSubmitForm(selector)](#user-content-w_HtmlMultiWidget+interceptSubmitForm)
+    * [.useCheckoutAutoSubmit()](#user-content-w_HtmlMultiWidget+useCheckoutAutoSubmit)
+    * [.useAutoResize()](#user-content-w_HtmlMultiWidget+useAutoResize)
+    * [.setStyles(fields)](#user-content-w_MultiWidget+setStyles)
+    * [.usePhoneCountryMask([options])](#user-content-w_MultiWidget+usePhoneCountryMask)
+    * [.setTexts(fields)](#user-content-w_MultiWidget+setTexts)
+    * [.setElementStyle(element, [state], styles)](#user-content-w_MultiWidget+setElementStyle)
+    * [.setFormValues(fieldValues)](#user-content-w_MultiWidget+setFormValues)
+    * [.setFormLabels(fieldLabels)](#user-content-w_MultiWidget+setFormLabels)
+    * [.setFormPlaceholders(fieldPlaceholders)](#user-content-w_MultiWidget+setFormPlaceholders)
+    * [.setFormElements(elements)](#user-content-w_MultiWidget+setFormElements)
+    * ~~[.setIcons()](#user-content-w_MultiWidget+setIcons)~~
+    * [.setHiddenElements(elements)](#user-content-w_MultiWidget+setHiddenElements)
+    * [.setRefId(refId)](#user-content-w_MultiWidget+setRefId)
+    * [.useGatewayFieldValidation()](#user-content-w_MultiWidget+useGatewayFieldValidation)
+    * [.setSupportedCardIcons(elements, validateCardNumberInput)](#user-content-w_MultiWidget+setSupportedCardIcons)
+    * [.hideUiErrors()](#user-content-w_MultiWidget+hideUiErrors)
+    * [.setEnv(env, [alias])](#user-content-w_MultiWidget+setEnv)
+    * [.loadIFrameUrl()](#user-content-w_MultiWidget+loadIFrameUrl)
+    * [.setLanguage(code)](#user-content-w_MultiWidget+setLanguage)
+
+<a name="w_new_HtmlMultiWidget_new" id="w_new_HtmlMultiWidget_new" href="#user-content-w_new_HtmlMultiWidget_new">&nbsp;</a>
+
+### new HtmlMultiWidget(selector, publicKey, conf)
+
+| Param | Type | Description |
+| --- | --- | --- |
+| selector | <code>string</code> | Selector of html element. Container for widget |
+| publicKey | <code>string</code> | PayDock users public key |
+| conf | [<code>Configuration</code>](#user-content-w_Configuration) \| <code>string</code> \| [<code>Array.&lt;Configuration&gt;</code>](#user-content-w_Configuration) \| <code>Array.&lt;string&gt;</code> | exemplar[s] Configuration class OR configuration token |
+
+**Example**  
+
+```javascript
+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')
+]);
+```
+<a name="w_HtmlMultiWidget+load" id="w_HtmlMultiWidget+load" href="#user-content-w_HtmlMultiWidget+load">&nbsp;</a>
+
+### htmlMultiWidget.load()
+Loads the widget.
+
+Calling this method results in an iframe element being inserted and rendered in the DOM.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+<a name="w_HtmlMultiWidget+afterLoad" id="w_HtmlMultiWidget+afterLoad" href="#user-content-w_HtmlMultiWidget+afterLoad">&nbsp;</a>
+
+### htmlMultiWidget.afterLoad()
+Registers a form validation callback for validation events.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+<a name="w_HtmlMultiWidget+trigger" id="w_HtmlMultiWidget+trigger" href="#user-content-w_HtmlMultiWidget+trigger">&nbsp;</a>
+
+### htmlMultiWidget.trigger(triggers, data)
+Registers callback that will be invoked for every trigger.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| triggers | <code>&#x27;submit\_form&#x27;</code> \| <code>&#x27;tab&#x27;</code> | The Widget element identifier that caused the trigger. |
+| data | [<code>ITriggerData</code>](#user-content-w_ITriggerData) | Data that will be sent to the widget when the trigger occurs. |
+
+<a name="w_HtmlMultiWidget+getValidationState" id="w_HtmlMultiWidget+getValidationState" href="#user-content-w_HtmlMultiWidget+getValidationState">&nbsp;</a>
+
+### htmlMultiWidget.getValidationState() ⇒ [<code>IFormValidation</code>](#user-content-w_IFormValidation)
+Gets a reference to the form current validation state.
+
+!Warning: do not directly modify the values of the returned object.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Returns**: [<code>IFormValidation</code>](#user-content-w_IFormValidation) - Form validation object  
+<a name="w_HtmlMultiWidget+isValidForm" id="w_HtmlMultiWidget+isValidForm" href="#user-content-w_HtmlMultiWidget+isValidForm">&nbsp;</a>
+
+### htmlMultiWidget.isValidForm() ⇒ <code>boolean</code>
+Checks if a given form is valid.
+
+A form is valid if all form fields are valid.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Returns**: <code>boolean</code> - Indicates wether or not form is valid.  
+<a name="w_HtmlMultiWidget+isInvalidField" id="w_HtmlMultiWidget+isInvalidField" href="#user-content-w_HtmlMultiWidget+isInvalidField">&nbsp;</a>
+
+### htmlMultiWidget.isInvalidField(field) ⇒ <code>boolean</code>
+Using this method you can check if a specific form field is invalid
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Returns**: <code>boolean</code> - Field is invalid  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| field | <code>string</code> | Field name |
+
+<a name="w_HtmlMultiWidget+isFieldErrorShowed" id="w_HtmlMultiWidget+isFieldErrorShowed" href="#user-content-w_HtmlMultiWidget+isFieldErrorShowed">&nbsp;</a>
+
+### htmlMultiWidget.isFieldErrorShowed(field) ⇒ <code>boolean</code>
+Checks if a given form field is displaying an error.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Returns**: <code>boolean</code> - Indicates wether or not the Error message is being displayed on the associated field.  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| field | <code>string</code> | The form field name |
+
+<a name="w_HtmlMultiWidget+isInvalidFieldByValidator" id="w_HtmlMultiWidget+isInvalidFieldByValidator" href="#user-content-w_HtmlMultiWidget+isInvalidFieldByValidator">&nbsp;</a>
+
+### htmlMultiWidget.isInvalidFieldByValidator(field, validator) ⇒ <code>boolean</code>
+Checks if a given form field is valid or invalid by name.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Returns**: <code>boolean</code> - Indicates wether or not the field is invalid based on validator intepretation.  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| field | <code>string</code> | The form field name |
+| validator |  | The name of the validator. |
+
+<a name="w_HtmlMultiWidget+hide" id="w_HtmlMultiWidget+hide" href="#user-content-w_HtmlMultiWidget+hide">&nbsp;</a>
+
+### htmlMultiWidget.hide([saveSize])
+Hides the widget.
+
+E.g., use this method to hide the widget after it loads.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| [saveSize] | <code>boolean</code> | <code>false</code> | Wether the original iframe element size should be saved before being hidden. |
+
+<a name="w_HtmlMultiWidget+show" id="w_HtmlMultiWidget+show" href="#user-content-w_HtmlMultiWidget+show">&nbsp;</a>
+
+### htmlMultiWidget.show()
+Shows the widget.
+
+E.g., use this method to show the widget after it was explicitly hidden.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+<a name="w_HtmlMultiWidget+reload" id="w_HtmlMultiWidget+reload" href="#user-content-w_HtmlMultiWidget+reload">&nbsp;</a>
+
+### htmlMultiWidget.reload()
+Reloads the widget.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+<a name="w_HtmlMultiWidget+hideElements" id="w_HtmlMultiWidget+hideElements" href="#user-content-w_HtmlMultiWidget+hideElements">&nbsp;</a>
+
+### htmlMultiWidget.hideElements(elements)
+Hides the specified Widget elements by their identifier.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | List of element which can be hidden [ELEMENT](#user-content-w_ELEMENT) || [FORM_FIELD](#user-content-w_FORM_FIELD) |
+
+**Example**  
+```javascript
+widget.hideElements(['submit_button', 'email']);
+```
+<a name="w_HtmlMultiWidget+showElements" id="w_HtmlMultiWidget+showElements" href="#user-content-w_HtmlMultiWidget+showElements">&nbsp;</a>
+
+### htmlMultiWidget.showElements(elements)
+Shows the specified Widget elements by their identifier.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | List of elements which can be showed [ELEMENT](#user-content-w_ELEMENT) || [FORM_FIELD](#user-content-w_FORM_FIELD) |
+
+**Example**  
+```javascript
+widget.showElements(['submit_button', 'email']);
+```
+<a name="w_HtmlMultiWidget+updateFormValues" id="w_HtmlMultiWidget+updateFormValues" href="#user-content-w_HtmlMultiWidget+updateFormValues">&nbsp;</a>
+
+### htmlMultiWidget.updateFormValues(fieldValues)
+Updates the form field values inside the widget.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldValues | <code>IFormValues</code> | Fields with values |
+
+**Example**  
+```javascript
+widget.updateFormValues({
+  email: 'predefined@email.com',
+  card_name: 'Houston'
+});
+```
+<a name="w_HtmlMultiWidget+updateFormValue" id="w_HtmlMultiWidget+updateFormValue" href="#user-content-w_HtmlMultiWidget+updateFormValue">&nbsp;</a>
+
+### htmlMultiWidget.updateFormValue(key, value)
+Updates a single form field values inside the widget by the form field name.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| key | <code>string</code> | The form field name |
+| value | <code>string</code> | The form field value |
+
+**Example**  
+```javascript
+widget.updateFormValue("card_name", "John Doe");
+```
+<a name="w_HtmlMultiWidget+onFinishInsert" id="w_HtmlMultiWidget+onFinishInsert" href="#user-content-w_HtmlMultiWidget+onFinishInsert">&nbsp;</a>
+
+### htmlMultiWidget.onFinishInsert(selector, dataType)
+Inserts the event data (after finish event) onto the input field associated with the provided CSS selector.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| selector | <code>string</code> | A CSS selector. E.g., ".my-class", "#my-id", or others |
+| dataType | <code>string</code> | The data type of IEventData object. |
+
+<a name="w_HtmlMultiWidget+interceptSubmitForm" id="w_HtmlMultiWidget+interceptSubmitForm" href="#user-content-w_HtmlMultiWidget+interceptSubmitForm">&nbsp;</a>
+
+### htmlMultiWidget.interceptSubmitForm(selector)
+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
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Note**: The widget's submit button will be hidden.  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| selector | <code>string</code> | 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>
+```
+<a name="w_HtmlMultiWidget+useCheckoutAutoSubmit" id="w_HtmlMultiWidget+useCheckoutAutoSubmit" href="#user-content-w_HtmlMultiWidget+useCheckoutAutoSubmit">&nbsp;</a>
+
+### htmlMultiWidget.useCheckoutAutoSubmit()
+This method hides a submit button and automatically execute form submit
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+<a name="w_HtmlMultiWidget+useAutoResize" id="w_HtmlMultiWidget+useAutoResize" href="#user-content-w_HtmlMultiWidget+useAutoResize">&nbsp;</a>
+
+### htmlMultiWidget.useAutoResize()
+Use this method for resize iFrame according content height
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Example**  
+```javascript
+widget.useAutoResize();
+```
+<a name="w_MultiWidget+setStyles" id="w_MultiWidget+setStyles" href="#user-content-w_MultiWidget+setStyles">&nbsp;</a>
+
+### htmlMultiWidget.setStyles(fields)
+Object contain styles for widget
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setStyles</code>](#user-content-w_MultiWidget+setStyles)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fields | [<code>IStyles</code>](#user-content-w_IStyles) | name of styles which can be shown in widget [STYLE](#user-content-w_STYLE) |
+
+**Example**  
+
+```javascript
+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'
+  });
+```
+<a name="w_MultiWidget+usePhoneCountryMask" id="w_MultiWidget+usePhoneCountryMask" href="#user-content-w_MultiWidget+usePhoneCountryMask">&nbsp;</a>
+
+### htmlMultiWidget.usePhoneCountryMask([options])
+Method to set a country code mask for the phone input.
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>usePhoneCountryMask</code>](#user-content-w_MultiWidget+usePhoneCountryMask)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [options] | <code>object</code> | Options for configure the phone mask. |
+| [options.default_country] | <code>string</code> | Set a default country for the mask. |
+| [options.preferred_countries] | <code>Array.&lt;string&gt;</code> | Set list of preferred countries for the top of the select box . |
+| [options.only_countries] | <code>Array.&lt;string&gt;</code> | Set list of countries to show in the select box. |
+
+**Example**  
+
+```javascript
+widget.usePhoneCountryMask();
+```
+**Example**  
+
+```javascript
+widget.usePhoneCountryMask({
+      default_country: 'au',
+      preferred_countries: ['au', 'gb'],
+      only_countries: ['au', 'gb', 'us', 'ua']
+  });
+```
+<a name="w_MultiWidget+setTexts" id="w_MultiWidget+setTexts" href="#user-content-w_MultiWidget+setTexts">&nbsp;</a>
+
+### htmlMultiWidget.setTexts(fields)
+Method for set different texts inside the widget
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setTexts</code>](#user-content-w_MultiWidget+setTexts)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fields | [<code>ITexts</code>](#user-content-w_ITexts) | name of text items which can be shown in widget [TEXT](#user-content-w_TEXT) |
+
+**Example**  
+
+```javascript
+widget.setTexts({
+      title: 'Your card',
+      finish_text: 'Payment resource was successfully accepted',
+      title_description: '* indicates required field',
+      submit_button: 'Save',
+      submit_button_processing: 'Load...',
+  });
+```
+<a name="w_MultiWidget+setElementStyle" id="w_MultiWidget+setElementStyle" href="#user-content-w_MultiWidget+setElementStyle">&nbsp;</a>
+
+### htmlMultiWidget.setElementStyle(element, [state], styles)
+Method for set styles for different elements and states
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setElementStyle</code>](#user-content-w_MultiWidget+setElementStyle)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| element | <code>string</code> | type of element for styling. These elements are available [STYLABLE_ELEMENT](#user-content-w_STYLABLE_ELEMENT) |
+| [state] | <code>string</code> | state of element for styling. These states are available [STYLABLE_ELEMENT_STATE](#user-content-w_STYLABLE_ELEMENT_STATE) |
+| styles | [<code>IElementStyleInput</code>](#user-content-w_IElementStyleInput) \| [<code>IElementStyleSubmitButton</code>](#user-content-w_IElementStyleSubmitButton) \| [<code>IElementStyleLabel</code>](#user-content-w_IElementStyleLabel) \| [<code>IElementStyleTitle</code>](#user-content-w_IElementStyleTitle) \| [<code>IElementStyleTitleDescription</code>](#user-content-w_IElementStyleTitleDescription) | styles list |
+
+**Example**  
+
+```javascript
+widget.setElementStyle('input', {
+  border: 'green solid 1px'
+});
+
+widget.setElementStyle('input', 'focus', {
+  border: 'blue solid 1px'
+});
+
+widget.setElementStyle('input', 'error', {
+ border: 'red solid 1px'
+});
+```
+<a name="w_MultiWidget+setFormValues" id="w_MultiWidget+setFormValues" href="#user-content-w_MultiWidget+setFormValues">&nbsp;</a>
+
+### htmlMultiWidget.setFormValues(fieldValues)
+The method to set the predefined values for the form fields inside the widget
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setFormValues</code>](#user-content-w_MultiWidget+setFormValues)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldValues | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), The object value is what we are expecting |
+
+**Example**  
+
+```javascript
+widget.setFormValues({
+      email: 'predefined@email.com',
+      card_name: 'Houston'
+  });
+```
+<a name="w_MultiWidget+setFormLabels" id="w_MultiWidget+setFormLabels" href="#user-content-w_MultiWidget+setFormLabels">&nbsp;</a>
+
+### htmlMultiWidget.setFormLabels(fieldLabels)
+The method to set custom form field labels
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setFormLabels</code>](#user-content-w_MultiWidget+setFormLabels)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldLabels | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), The object value is what we are expecting |
+
+**Example**  
+
+```javascript
+widget.setFormPlaceholders({
+      card_name: 'Card Holder Name',
+      email: 'Email For Receipt'
+  })
+```
+<a name="w_MultiWidget+setFormPlaceholders" id="w_MultiWidget+setFormPlaceholders" href="#user-content-w_MultiWidget+setFormPlaceholders">&nbsp;</a>
+
+### htmlMultiWidget.setFormPlaceholders(fieldPlaceholders)
+The method to set custom form fields placeholders
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setFormPlaceholders</code>](#user-content-w_MultiWidget+setFormPlaceholders)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldPlaceholders | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), Value of object is expected placeholder |
+
+**Example**  
+
+```javascript
+widget.setFormPlaceholders({
+      card_name: 'Input your card holder name...',
+      email: 'Input your email, like test@example.com'
+  })
+```
+<a name="w_MultiWidget+setFormElements" id="w_MultiWidget+setFormElements" href="#user-content-w_MultiWidget+setFormElements">&nbsp;</a>
+
+### htmlMultiWidget.setFormElements(elements)
+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
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setFormElements</code>](#user-content-w_MultiWidget+setFormElements)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>string</code> | The list of elements |
+| elements[].field | <code>string</code> | Field name of the element [FORM_FIELD](#user-content-w_FORM_FIELD) |
+| elements[].placeholder | <code>string</code> | Set custom form field placeholder |
+| elements[].label | <code>string</code> | Set custom labels near form field |
+| elements[].value | <code>string</code> | Set predefined values for the form field |
+
+**Example**  
+
+```javascript
+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',
+      },
+  ])
+```
+<a name="w_MultiWidget+setIcons" id="w_MultiWidget+setIcons" href="#user-content-w_MultiWidget+setIcons">&nbsp;</a>
+
+### ~~htmlMultiWidget.setIcons()~~
+***Deprecated***
+
+The method to change the widget icons
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setIcons</code>](#user-content-w_MultiWidget+setIcons)  
+<a name="w_MultiWidget+setHiddenElements" id="w_MultiWidget+setHiddenElements" href="#user-content-w_MultiWidget+setHiddenElements">&nbsp;</a>
+
+### htmlMultiWidget.setHiddenElements(elements)
+Using this method you can set hidden elements inside widget
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setHiddenElements</code>](#user-content-w_MultiWidget+setHiddenElements)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | list of element which can be hidden [ELEMENT](#user-content-w_ELEMENT) || [FORM_FIELD](#user-content-w_FORM_FIELD) |
+
+**Example**  
+
+```javascript
+widget.setHiddenElements(['submit_button', 'email']);
+```
+<a name="w_MultiWidget+setRefId" id="w_MultiWidget+setRefId" href="#user-content-w_MultiWidget+setRefId">&nbsp;</a>
+
+### htmlMultiWidget.setRefId(refId)
+Current method can set custom ID to identify the data in the future
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setRefId</code>](#user-content-w_MultiWidget+setRefId)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| refId | <code>string</code> | custom id |
+
+**Example**  
+
+```javascript
+widget.setRefId('id');
+```
+<a name="w_MultiWidget+useGatewayFieldValidation" id="w_MultiWidget+useGatewayFieldValidation" href="#user-content-w_MultiWidget+useGatewayFieldValidation">&nbsp;</a>
+
+### htmlMultiWidget.useGatewayFieldValidation()
+Current method can add visual validation from gateway to widget's form fields
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>useGatewayFieldValidation</code>](#user-content-w_MultiWidget+useGatewayFieldValidation)  
+**Example**  
+
+```javascript
+widget.useGatewayFieldValidation();
+```
+<a name="w_MultiWidget+setSupportedCardIcons" id="w_MultiWidget+setSupportedCardIcons" href="#user-content-w_MultiWidget+setSupportedCardIcons">&nbsp;</a>
+
+### htmlMultiWidget.setSupportedCardIcons(elements, validateCardNumberInput)
+Current method can set icons of supported card types
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setSupportedCardIcons</code>](#user-content-w_MultiWidget+setSupportedCardIcons)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | [SUPPORTED_CARD_TYPES](#user-content-w_SUPPORTED_CARD_TYPES) |
+| validateCardNumberInput | <code>boolean</code> | [validateCardNumberInput=false] - using this param you allow validation for card number input on supported card types |
+
+**Example**  
+
+```javascript
+widget.setSupportedCardIcons(['mastercard', 'visa'], validateCardNumberInput);
+```
+<a name="w_MultiWidget+hideUiErrors" id="w_MultiWidget+hideUiErrors" href="#user-content-w_MultiWidget+hideUiErrors">&nbsp;</a>
+
+### htmlMultiWidget.hideUiErrors()
+Current method can hide prevent the widget from showing the error messages
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>hideUiErrors</code>](#user-content-w_MultiWidget+hideUiErrors)  
+**Example**  
+
+```javascript
+widget.hideUiErrors('id');
+```
+<a name="w_MultiWidget+setEnv" id="w_MultiWidget+setEnv" href="#user-content-w_MultiWidget+setEnv">&nbsp;</a>
+
+### htmlMultiWidget.setEnv(env, [alias])
+Current method can change environment. By default environment = sandbox.
+Also we can change domain alias for this environment. By default domain_alias = paydock.com
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setEnv</code>](#user-content-w_MultiWidget+setEnv)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| env | <code>string</code> | sandbox, production |
+| [alias] | <code>string</code> | Own domain alias |
+
+**Example**  
+
+```javascript
+widget.setEnv('production', 'paydock.com');
+```
+<a name="w_MultiWidget+loadIFrameUrl" id="w_MultiWidget+loadIFrameUrl" href="#user-content-w_MultiWidget+loadIFrameUrl">&nbsp;</a>
+
+### htmlMultiWidget.loadIFrameUrl()
+Method for creating iframe url
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>loadIFrameUrl</code>](#user-content-w_MultiWidget+loadIFrameUrl)  
+**Example**  
+
+```javascript
+widget.loadIFrameUrl(function (url) {
+     console.log(url);
+}, function (errors) {
+     console.log(errors);
+});
+```
+<a name="w_MultiWidget+setLanguage" id="w_MultiWidget+setLanguage" href="#user-content-w_MultiWidget+setLanguage">&nbsp;</a>
+
+### htmlMultiWidget.setLanguage(code)
+Method for setting a custom language code
+
+**Kind**: instance method of [<code>HtmlMultiWidget</code>](#user-content-w_HtmlMultiWidget)  
+**Overrides**: [<code>setLanguage</code>](#user-content-w_MultiWidget+setLanguage)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| code | <code>string</code> | ISO 639-1 |
+
+**Example**  
+
+```javascript
+config.setLanguage('en');
+```
+<a name="w_Configuration" id="w_Configuration" href="#user-content-w_Configuration">&nbsp;</a>
+
+## Configuration
+Class Configuration include methods for creating configuration token
+
+**Kind**: global class  
+
+* [Configuration](#user-content-w_Configuration)
+    * [new Configuration([gatewayID], paymentType, purpose)](#user-content-w_new_Configuration_new)
+    * [.setWebHookDestination(url)](#user-content-w_Configuration+setWebHookDestination)
+    * [.setSuccessRedirectUrl(url)](#user-content-w_Configuration+setSuccessRedirectUrl)
+    * [.setErrorRedirectUrl(url)](#user-content-w_Configuration+setErrorRedirectUrl)
+    * [.setFormFields(fields)](#user-content-w_Configuration+setFormFields)
+    * [.setMeta(object)](#user-content-w_Configuration+setMeta)
+    * [.setEnv(env, [alias])](#user-content-w_Configuration+setEnv)
+    * [.setLabel(label)](#user-content-w_Configuration+setLabel)
+    * [.createToken(accessToken, cb, errorCb)](#user-content-w_Configuration+createToken)
+
+<a name="w_new_Configuration_new" id="w_new_Configuration_new" href="#user-content-w_new_Configuration_new">&nbsp;</a>
+
+### new Configuration([gatewayID], paymentType, purpose)
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| [gatewayID] | <code>string</code> | <code>&quot;default&quot;</code> | gateway ID. 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. |
+| paymentType | <code>string</code> |  | Type of payment source which shows in widget form. Available parameters [PAYMENT_TYPE](#user-content-w_PAYMENT_TYPE) |
+| purpose | <code>string</code> |  | Param which describes payment purpose. By default uses Available parameters [PURPOSE](#user-content-w_PURPOSE) |
+
+**Example**  
+
+```javascript
+var config = new Configuration('gatewayId'); // short
+
+var config = new Configuration('gatewayId', 'bank_account', 'paymentSource'); // extend
+
+var config = new Configuration('not_configured'); // without gateway
+```
+<a name="w_Configuration+setWebHookDestination" id="w_Configuration+setWebHookDestination" href="#user-content-w_Configuration+setWebHookDestination">&nbsp;</a>
+
+### configuration.setWebHookDestination(url)
+Destination, where customer will receive all successful responses.
+Response will contain “data” object with “payment_source” or other parameters, in depending on 'purpose'
+
+**Kind**: instance method of [<code>Configuration</code>](#user-content-w_Configuration)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| url | <code>string</code> | Your endpoint for post request. |
+
+**Example**  
+
+```javascript
+config.setWebHookDestination('http://google.com');
+```
+<a name="w_Configuration+setSuccessRedirectUrl" id="w_Configuration+setSuccessRedirectUrl" href="#user-content-w_Configuration+setSuccessRedirectUrl">&nbsp;</a>
+
+### configuration.setSuccessRedirectUrl(url)
+URL to which the Customer will be redirected to after the success finish
+
+**Kind**: instance method of [<code>Configuration</code>](#user-content-w_Configuration)  
+
+| Param | Type |
+| --- | --- |
+| url | <code>string</code> | 
+
+**Example**  
+
+```javascript
+config.setSuccessRedirectUrl('google.com/search?q=success');
+```
+<a name="w_Configuration+setErrorRedirectUrl" id="w_Configuration+setErrorRedirectUrl" href="#user-content-w_Configuration+setErrorRedirectUrl">&nbsp;</a>
+
+### configuration.setErrorRedirectUrl(url)
+URL to which the Customer will be redirected to if an error is triggered in the process of operation
+
+**Kind**: instance method of [<code>Configuration</code>](#user-content-w_Configuration)  
+
+| Param | Type |
+| --- | --- |
+| url | <code>string</code> | 
+
+**Example**  
+
+```javascript
+config.setErrorRedirectUrl('google.com/search?q=error');
+```
+<a name="w_Configuration+setFormFields" id="w_Configuration+setFormFields" href="#user-content-w_Configuration+setFormFields">&nbsp;</a>
+
+### configuration.setFormFields(fields)
+Set list with widget form field, which will be shown in form. Also you can set the required validation for these fields
+
+**Kind**: instance method of [<code>Configuration</code>](#user-content-w_Configuration)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fields | <code>Array.&lt;string&gt;</code> | 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](#user-content-w_FORM_FIELD) |
+
+**Example**  
+
+```javascript
+config.setFormFields(['phone', 'email', 'first_name*']);
+```
+<a name="w_Configuration+setMeta" id="w_Configuration+setMeta" href="#user-content-w_Configuration+setMeta">&nbsp;</a>
+
+### configuration.setMeta(object)
+Method for setting meta information for checkout page
+
+**Kind**: instance method of [<code>Configuration</code>](#user-content-w_Configuration)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| object | [<code>IPayPalMeta</code>](#user-content-w_IPayPalMeta) \| <code>IZipmoneyMeta</code> \| <code>IAfterpayMeta</code> \| [<code>IBamboraMeta</code>](#user-content-w_IBamboraMeta) | data which can be shown on checkout page [IPayPalMeta](#user-content-w_IPayPalMeta) [IZipmoneyMeta](IZipmoneyMeta) [IAfterpayMeta](IAfterpayMeta) [IBamboraMeta](#user-content-w_IBamboraMeta) |
+
+**Example**  
+
+```javascript
+config.setMeta({
+            brand_name: 'paydock',
+            reference: '15',
+            email: 'wault@paydock.com'
+        });
+```
+<a name="w_Configuration+setEnv" id="w_Configuration+setEnv" href="#user-content-w_Configuration+setEnv">&nbsp;</a>
+
+### configuration.setEnv(env, [alias])
+Current method can change environment. By default environment = sandbox.
+Also we can change domain alias for this environment. By default domain_alias = paydock.com
+
+**Kind**: instance method of [<code>Configuration</code>](#user-content-w_Configuration)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| env | <code>string</code> | sandbox, production |
+| [alias] | <code>string</code> | Own domain alias |
+
+**Example**  
+
+```javascript
+config.setEnv('production');
+```
+<a name="w_Configuration+setLabel" id="w_Configuration+setLabel" href="#user-content-w_Configuration+setLabel">&nbsp;</a>
+
+### configuration.setLabel(label)
+Title for tab which can be set instead of default
+
+**Kind**: instance method of [<code>Configuration</code>](#user-content-w_Configuration)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| label | <code>string</code> | Text label for tab |
+
+**Example**  
+
+```javascript
+config.setLabel('custom label');
+```
+<a name="w_Configuration+createToken" id="w_Configuration+createToken" href="#user-content-w_Configuration+createToken">&nbsp;</a>
+
+### configuration.createToken(accessToken, cb, errorCb)
+createToken - method which exactly create payment one time token
+
+**Kind**: instance method of [<code>Configuration</code>](#user-content-w_Configuration)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| accessToken | <code>string</code> | Customer access token or public key which provided for each client |
+| cb | <code>createToken~requestCallback</code> | The callback that handles the success response. |
+| errorCb | <code>createToken~requestCallback</code> | The callback that handles the failed response. |
+
+**Example**  
+
+```javascript
+config.createToken('582035346f65cdd57ee81192d6e5w65w4e5',
+ function (data) {
+     console.log(data);
+ }, function (error) {
+     console.log(error);
+});
+```
+<a name="w_MultiWidget" id="w_MultiWidget" href="#user-content-w_MultiWidget">&nbsp;</a>
+
+## MultiWidget
+Class MultiWidget include method for for creating iframe url
+
+**Kind**: global class  
+
+* [MultiWidget](#user-content-w_MultiWidget)
+    * [new MultiWidget(accessToken, conf)](#user-content-w_new_MultiWidget_new)
+    * [.setStyles(fields)](#user-content-w_MultiWidget+setStyles)
+    * [.usePhoneCountryMask([options])](#user-content-w_MultiWidget+usePhoneCountryMask)
+    * [.setTexts(fields)](#user-content-w_MultiWidget+setTexts)
+    * [.setElementStyle(element, [state], styles)](#user-content-w_MultiWidget+setElementStyle)
+    * [.setFormValues(fieldValues)](#user-content-w_MultiWidget+setFormValues)
+    * [.setFormLabels(fieldLabels)](#user-content-w_MultiWidget+setFormLabels)
+    * [.setFormPlaceholders(fieldPlaceholders)](#user-content-w_MultiWidget+setFormPlaceholders)
+    * [.setFormElements(elements)](#user-content-w_MultiWidget+setFormElements)
+    * ~~[.setIcons()](#user-content-w_MultiWidget+setIcons)~~
+    * [.setHiddenElements(elements)](#user-content-w_MultiWidget+setHiddenElements)
+    * [.setRefId(refId)](#user-content-w_MultiWidget+setRefId)
+    * [.useGatewayFieldValidation()](#user-content-w_MultiWidget+useGatewayFieldValidation)
+    * [.setSupportedCardIcons(elements, validateCardNumberInput)](#user-content-w_MultiWidget+setSupportedCardIcons)
+    * [.hideUiErrors()](#user-content-w_MultiWidget+hideUiErrors)
+    * [.setEnv(env, [alias])](#user-content-w_MultiWidget+setEnv)
+    * [.loadIFrameUrl()](#user-content-w_MultiWidget+loadIFrameUrl)
+    * [.setLanguage(code)](#user-content-w_MultiWidget+setLanguage)
+
+<a name="w_new_MultiWidget_new" id="w_new_MultiWidget_new" href="#user-content-w_new_MultiWidget_new">&nbsp;</a>
+
+### new MultiWidget(accessToken, conf)
+
+| Param | Type | Description |
+| --- | --- | --- |
+| accessToken | <code>string</code> | PayDock users access token or public key |
+| conf | [<code>Configuration</code>](#user-content-w_Configuration) \| <code>string</code> \| [<code>Array.&lt;Configuration&gt;</code>](#user-content-w_Configuration) \| <code>Array.&lt;string&gt;</code> | exemplar[s] Configuration class OR configuration token |
+
+**Example**  
+
+```javascript
+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')
+]);
+```
+<a name="w_MultiWidget+setStyles" id="w_MultiWidget+setStyles" href="#user-content-w_MultiWidget+setStyles">&nbsp;</a>
+
+### multiWidget.setStyles(fields)
+Object contain styles for widget
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fields | [<code>IStyles</code>](#user-content-w_IStyles) | name of styles which can be shown in widget [STYLE](#user-content-w_STYLE) |
+
+**Example**  
+
+```javascript
+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'
+  });
+```
+<a name="w_MultiWidget+usePhoneCountryMask" id="w_MultiWidget+usePhoneCountryMask" href="#user-content-w_MultiWidget+usePhoneCountryMask">&nbsp;</a>
+
+### multiWidget.usePhoneCountryMask([options])
+Method to set a country code mask for the phone input.
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| [options] | <code>object</code> | Options for configure the phone mask. |
+| [options.default_country] | <code>string</code> | Set a default country for the mask. |
+| [options.preferred_countries] | <code>Array.&lt;string&gt;</code> | Set list of preferred countries for the top of the select box . |
+| [options.only_countries] | <code>Array.&lt;string&gt;</code> | Set list of countries to show in the select box. |
+
+**Example**  
+
+```javascript
+widget.usePhoneCountryMask();
+```
+**Example**  
+
+```javascript
+widget.usePhoneCountryMask({
+      default_country: 'au',
+      preferred_countries: ['au', 'gb'],
+      only_countries: ['au', 'gb', 'us', 'ua']
+  });
+```
+<a name="w_MultiWidget+setTexts" id="w_MultiWidget+setTexts" href="#user-content-w_MultiWidget+setTexts">&nbsp;</a>
+
+### multiWidget.setTexts(fields)
+Method for set different texts inside the widget
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fields | [<code>ITexts</code>](#user-content-w_ITexts) | name of text items which can be shown in widget [TEXT](#user-content-w_TEXT) |
+
+**Example**  
+
+```javascript
+widget.setTexts({
+      title: 'Your card',
+      finish_text: 'Payment resource was successfully accepted',
+      title_description: '* indicates required field',
+      submit_button: 'Save',
+      submit_button_processing: 'Load...',
+  });
+```
+<a name="w_MultiWidget+setElementStyle" id="w_MultiWidget+setElementStyle" href="#user-content-w_MultiWidget+setElementStyle">&nbsp;</a>
+
+### multiWidget.setElementStyle(element, [state], styles)
+Method for set styles for different elements and states
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| element | <code>string</code> | type of element for styling. These elements are available [STYLABLE_ELEMENT](#user-content-w_STYLABLE_ELEMENT) |
+| [state] | <code>string</code> | state of element for styling. These states are available [STYLABLE_ELEMENT_STATE](#user-content-w_STYLABLE_ELEMENT_STATE) |
+| styles | [<code>IElementStyleInput</code>](#user-content-w_IElementStyleInput) \| [<code>IElementStyleSubmitButton</code>](#user-content-w_IElementStyleSubmitButton) \| [<code>IElementStyleLabel</code>](#user-content-w_IElementStyleLabel) \| [<code>IElementStyleTitle</code>](#user-content-w_IElementStyleTitle) \| [<code>IElementStyleTitleDescription</code>](#user-content-w_IElementStyleTitleDescription) | styles list |
+
+**Example**  
+
+```javascript
+widget.setElementStyle('input', {
+  border: 'green solid 1px'
+});
+
+widget.setElementStyle('input', 'focus', {
+  border: 'blue solid 1px'
+});
+
+widget.setElementStyle('input', 'error', {
+ border: 'red solid 1px'
+});
+```
+<a name="w_MultiWidget+setFormValues" id="w_MultiWidget+setFormValues" href="#user-content-w_MultiWidget+setFormValues">&nbsp;</a>
+
+### multiWidget.setFormValues(fieldValues)
+The method to set the predefined values for the form fields inside the widget
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldValues | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), The object value is what we are expecting |
+
+**Example**  
+
+```javascript
+widget.setFormValues({
+      email: 'predefined@email.com',
+      card_name: 'Houston'
+  });
+```
+<a name="w_MultiWidget+setFormLabels" id="w_MultiWidget+setFormLabels" href="#user-content-w_MultiWidget+setFormLabels">&nbsp;</a>
+
+### multiWidget.setFormLabels(fieldLabels)
+The method to set custom form field labels
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldLabels | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), The object value is what we are expecting |
+
+**Example**  
+
+```javascript
+widget.setFormPlaceholders({
+      card_name: 'Card Holder Name',
+      email: 'Email For Receipt'
+  })
+```
+<a name="w_MultiWidget+setFormPlaceholders" id="w_MultiWidget+setFormPlaceholders" href="#user-content-w_MultiWidget+setFormPlaceholders">&nbsp;</a>
+
+### multiWidget.setFormPlaceholders(fieldPlaceholders)
+The method to set custom form fields placeholders
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| fieldPlaceholders | <code>Object</code> | Key of object is one of [FORM_FIELD](#user-content-w_FORM_FIELD), Value of object is expected placeholder |
+
+**Example**  
+
+```javascript
+widget.setFormPlaceholders({
+      card_name: 'Input your card holder name...',
+      email: 'Input your email, like test@example.com'
+  })
+```
+<a name="w_MultiWidget+setFormElements" id="w_MultiWidget+setFormElements" href="#user-content-w_MultiWidget+setFormElements">&nbsp;</a>
+
+### multiWidget.setFormElements(elements)
+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
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>string</code> | The list of elements |
+| elements[].field | <code>string</code> | Field name of the element [FORM_FIELD](#user-content-w_FORM_FIELD) |
+| elements[].placeholder | <code>string</code> | Set custom form field placeholder |
+| elements[].label | <code>string</code> | Set custom labels near form field |
+| elements[].value | <code>string</code> | Set predefined values for the form field |
+
+**Example**  
+
+```javascript
+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',
+      },
+  ])
+```
+<a name="w_MultiWidget+setIcons" id="w_MultiWidget+setIcons" href="#user-content-w_MultiWidget+setIcons">&nbsp;</a>
+
+### ~~multiWidget.setIcons()~~
+***Deprecated***
+
+The method to change the widget icons
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+<a name="w_MultiWidget+setHiddenElements" id="w_MultiWidget+setHiddenElements" href="#user-content-w_MultiWidget+setHiddenElements">&nbsp;</a>
+
+### multiWidget.setHiddenElements(elements)
+Using this method you can set hidden elements inside widget
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | list of element which can be hidden [ELEMENT](#user-content-w_ELEMENT) || [FORM_FIELD](#user-content-w_FORM_FIELD) |
+
+**Example**  
+
+```javascript
+widget.setHiddenElements(['submit_button', 'email']);
+```
+<a name="w_MultiWidget+setRefId" id="w_MultiWidget+setRefId" href="#user-content-w_MultiWidget+setRefId">&nbsp;</a>
+
+### multiWidget.setRefId(refId)
+Current method can set custom ID to identify the data in the future
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| refId | <code>string</code> | custom id |
+
+**Example**  
+
+```javascript
+widget.setRefId('id');
+```
+<a name="w_MultiWidget+useGatewayFieldValidation" id="w_MultiWidget+useGatewayFieldValidation" href="#user-content-w_MultiWidget+useGatewayFieldValidation">&nbsp;</a>
+
+### multiWidget.useGatewayFieldValidation()
+Current method can add visual validation from gateway to widget's form fields
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+**Example**  
+
+```javascript
+widget.useGatewayFieldValidation();
+```
+<a name="w_MultiWidget+setSupportedCardIcons" id="w_MultiWidget+setSupportedCardIcons" href="#user-content-w_MultiWidget+setSupportedCardIcons">&nbsp;</a>
+
+### multiWidget.setSupportedCardIcons(elements, validateCardNumberInput)
+Current method can set icons of supported card types
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| elements | <code>Array.&lt;string&gt;</code> | [SUPPORTED_CARD_TYPES](#user-content-w_SUPPORTED_CARD_TYPES) |
+| validateCardNumberInput | <code>boolean</code> | [validateCardNumberInput=false] - using this param you allow validation for card number input on supported card types |
+
+**Example**  
+
+```javascript
+widget.setSupportedCardIcons(['mastercard', 'visa'], validateCardNumberInput);
+```
+<a name="w_MultiWidget+hideUiErrors" id="w_MultiWidget+hideUiErrors" href="#user-content-w_MultiWidget+hideUiErrors">&nbsp;</a>
+
+### multiWidget.hideUiErrors()
+Current method can hide prevent the widget from showing the error messages
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+**Example**  
+
+```javascript
+widget.hideUiErrors('id');
+```
+<a name="w_MultiWidget+setEnv" id="w_MultiWidget+setEnv" href="#user-content-w_MultiWidget+setEnv">&nbsp;</a>
+
+### multiWidget.setEnv(env, [alias])
+Current method can change environment. By default environment = sandbox.
+Also we can change domain alias for this environment. By default domain_alias = paydock.com
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| env | <code>string</code> | sandbox, production |
+| [alias] | <code>string</code> | Own domain alias |
+
+**Example**  
+
+```javascript
+widget.setEnv('production', 'paydock.com');
+```
+<a name="w_MultiWidget+loadIFrameUrl" id="w_MultiWidget+loadIFrameUrl" href="#user-content-w_MultiWidget+loadIFrameUrl">&nbsp;</a>
+
+### multiWidget.loadIFrameUrl()
+Method for creating iframe url
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+**Example**  
+
+```javascript
+widget.loadIFrameUrl(function (url) {
+     console.log(url);
+}, function (errors) {
+     console.log(errors);
+});
+```
+<a name="w_MultiWidget+setLanguage" id="w_MultiWidget+setLanguage" href="#user-content-w_MultiWidget+setLanguage">&nbsp;</a>
+
+### multiWidget.setLanguage(code)
+Method for setting a custom language code
+
+**Kind**: instance method of [<code>MultiWidget</code>](#user-content-w_MultiWidget)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| code | <code>string</code> | ISO 639-1 |
+
+**Example**  
+
+```javascript
+config.setLanguage('en');
+```
+<a name="w_PURPOSE" id="w_PURPOSE" href="#user-content-w_PURPOSE">&nbsp;</a>
+
+## PURPOSE : <code>object</code>
+Purposes
+
+**Kind**: global variable  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| PAYMENT_SOURCE | <code>string</code> | <code>&quot;payment_source&quot;</code> | 
+| CARD_PAYMENT_SOURCE_WITH_CVV | <code>string</code> | <code>&quot;card_payment_source_with_cvv&quot;</code> | 
+| CARD_PAYMENT_SOURCE_WITHOUT_CVV | <code>string</code> | <code>&quot;card_payment_source_without_cvv&quot;</code> | 
+
+<a name="w_EVENT" id="w_EVENT" href="#user-content-w_EVENT">&nbsp;</a>
+
+## EVENT : <code>object</code>
+List of available event's name
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| AFTER_LOAD | <code>string</code> | <code>&quot;afterLoad&quot;</code> | 
+| SUBMIT | <code>string</code> | <code>&quot;submit&quot;</code> | 
+| FINISH | <code>string</code> | <code>&quot;finish&quot;</code> | 
+| VALIDATION | <code>string</code> | <code>&quot;validation&quot;</code> | 
+| VALIDATION_ERROR | <code>string</code> | <code>&quot;validationError&quot;</code> | 
+| SYSTEM_ERROR | <code>string</code> | <code>&quot;systemError&quot;</code> | 
+| META_CHANGE | <code>string</code> | <code>&quot;metaChange&quot;</code> | 
+| RESIZE | <code>string</code> | <code>&quot;resize&quot;</code> | 
+
+<a name="w_VAULT_DISPLAY_EVENT" id="w_VAULT_DISPLAY_EVENT" href="#user-content-w_VAULT_DISPLAY_EVENT">&nbsp;</a>
+
+## VAULT\_DISPLAY\_EVENT : <code>object</code>
+List of available event's name
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| AFTER_LOAD | <code>string</code> | <code>&quot;afterLoad&quot;</code> | 
+| SYSTEM_ERROR | <code>string</code> | <code>&quot;system_error&quot;</code> | 
+| CVV_SECURE_CODE_REQUESTED | <code>string</code> | <code>&quot;cvv_secure_code_requested&quot;</code> | 
+| CARD_NUMBER_SECURE_CODE_REQUESTED | <code>string</code> | <code>&quot;card_number_secure_code_requested&quot;</code> | 
+| ACCESS_FORBIDDEN | <code>string</code> | <code>&quot;access_forbidden&quot;</code> | 
+| SESSION_EXPIRED | <code>string</code> | <code>&quot;systemError&quot;</code> | 
+| SYSTEM_ERROR | <code>string</code> | <code>&quot;session_expired&quot;</code> | 
+| OPERATION_FORBIDDEN | <code>string</code> | <code>&quot;operation_forbidden&quot;</code> | 
+
+<a name="w_PAYMENT_TYPE" id="w_PAYMENT_TYPE" href="#user-content-w_PAYMENT_TYPE">&nbsp;</a>
+
+## PAYMENT\_TYPE : <code>object</code>
+List of available payment source types
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| CARD | <code>string</code> | <code>&quot;card&quot;</code> | 
+| BANK_ACCOUNT | <code>string</code> | <code>&quot;bank_account&quot;</code> | 
+| CHECKOUT | <code>string</code> | <code>&quot;checkout&quot;</code> | 
+
+<a name="w_FORM_FIELD" id="w_FORM_FIELD" href="#user-content-w_FORM_FIELD">&nbsp;</a>
+
+## FORM\_FIELD : <code>object</code>
+Current constant include available type of fields which can be included to widget
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| CARD_NAME | <code>string</code> | <code>&quot;card_name&quot;</code> | 
+| CARD_NUMBER | <code>string</code> | <code>&quot;card_number&quot;</code> | 
+| EXPIRE_MONTH | <code>string</code> | <code>&quot;expire_month&quot;</code> | 
+| EXPIRE_YEAR | <code>string</code> | <code>&quot;expire_year&quot;</code> | 
+| CARD_CCV | <code>string</code> | <code>&quot;card_ccv&quot;</code> | 
+| CARD_PIN | <code>string</code> | <code>&quot;card_pin&quot;</code> | 
+| ACCOUNT_NAME | <code>string</code> | <code>&quot;account_name&quot;</code> | 
+| ACCOUNT_BSB | <code>string</code> | <code>&quot;account_bsb&quot;</code> | 
+| ACCOUNT_NUMBER | <code>string</code> | <code>&quot;account_number&quot;</code> | 
+| ACCOUNT_ROUTING | <code>string</code> | <code>&quot;account_routing&quot;</code> | 
+| ACCOUNT_HOLDER_TYPE | <code>string</code> | <code>&quot;account_holder_type&quot;</code> | 
+| ACCOUNT_BANK_NAME | <code>string</code> | <code>&quot;account_bank_name&quot;</code> | 
+| ACCOUNT_TYPE | <code>string</code> | <code>&quot;account_type&quot;</code> | 
+| FIRST_NAME | <code>string</code> | <code>&quot;first_name&quot;</code> | 
+| LAST_NAME | <code>string</code> | <code>&quot;last_name&quot;</code> | 
+| EMAIL | <code>string</code> | <code>&quot;email&quot;</code> | 
+| PHONE | <code>string</code> | <code>&quot;phone&quot;</code> | 
+| PHONE2 | <code>string</code> | <code>&quot;phone2&quot;</code> | 
+| ADDRESS_LINE1 | <code>string</code> | <code>&quot;address_line1&quot;</code> | 
+| ADDRESS_LINE2 | <code>string</code> | <code>&quot;address_line2&quot;</code> | 
+| ADDRESS_STATE | <code>string</code> | <code>&quot;address_state&quot;</code> | 
+| ADDRESS_COUNTRY | <code>string</code> | <code>&quot;address_country&quot;</code> | 
+| ADDRESS_CITY | <code>string</code> | <code>&quot;address_city&quot;</code> | 
+| ADDRESS_POSTCODE | <code>string</code> | <code>&quot;address_postcode&quot;</code> | 
+| ADDRESS_COMPANY | <code>string</code> | <code>&quot;address_company&quot;</code> | 
+
+<a name="w_STYLE" id="w_STYLE" href="#user-content-w_STYLE">&nbsp;</a>
+
+## STYLE : <code>object</code>
+List of available style params for widget
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| BACKGROUND_COLOR | <code>string</code> | <code>&quot;background_color&quot;</code> | 
+| TEXT_COLOR | <code>string</code> | <code>&quot;text_color&quot;</code> | 
+| BORDER_COLOR | <code>string</code> | <code>&quot;border_color&quot;</code> | 
+| BUTTON_COLOR | <code>string</code> | <code>&quot;button_color&quot;</code> | 
+| ERROR_COLOR | <code>string</code> | <code>&quot;error_color&quot;</code> | 
+| SUCCESS_COLOR | <code>string</code> | <code>&quot;success_color&quot;</code> | 
+| FONT_SIZE | <code>string</code> | <code>&quot;font_size&quot;</code> | 
+| FONT_FAMILY | <code>string</code> | <code>&quot;font_family&quot;</code> | 
+
+<a name="w_TEXT" id="w_TEXT" href="#user-content-w_TEXT">&nbsp;</a>
+
+## TEXT : <code>object</code>
+List of available text item params for widget
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| TITLE | <code>string</code> | <code>&quot;title&quot;</code> | 
+| FINISH | <code>string</code> | <code>&quot;finish_text&quot;</code> | 
+
+<a name="w_ELEMENT" id="w_ELEMENT" href="#user-content-w_ELEMENT">&nbsp;</a>
+
+## ELEMENT : <code>object</code>
+List of available params for hide elements
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| SUBMIT_BUTTON | <code>string</code> | <code>&quot;submit_button&quot;</code> | 
+| TABS | <code>string</code> | <code>&quot;tabs&quot;</code> | 
+
+<a name="w_SUPPORTED_CARD_TYPES" id="w_SUPPORTED_CARD_TYPES" href="#user-content-w_SUPPORTED_CARD_TYPES">&nbsp;</a>
+
+## SUPPORTED\_CARD\_TYPES : <code>object</code>
+The list of available parameters for showing card icons
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| AMEX | <code>string</code> | <code>&quot;amex&quot;</code> | 
+| AUSBC | <code>string</code> | <code>&quot;ausbc&quot;</code> | 
+| DINERS | <code>string</code> | <code>&quot;diners&quot;</code> | 
+| DISCOVER | <code>string</code> | <code>&quot;discover&quot;</code> | 
+| JAPCB | <code>string</code> | <code>&quot;japcb&quot;</code> | 
+| LASER | <code>string</code> | <code>&quot;laser&quot;</code> | 
+| MASTERCARD | <code>string</code> | <code>&quot;mastercard&quot;</code> | 
+| SOLO | <code>string</code> | <code>&quot;solo&quot;</code> | 
+| VISA | <code>string</code> | <code>&quot;visa&quot;</code> | 
+| VISA_WHITE | <code>string</code> | <code>&quot;visa_white&quot;</code> | 
+
+<a name="w_STYLABLE_ELEMENT" id="w_STYLABLE_ELEMENT" href="#user-content-w_STYLABLE_ELEMENT">&nbsp;</a>
+
+## STYLABLE\_ELEMENT : <code>object</code>
+Current constant include available type of element for styling
+
+**Kind**: global constant  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| INPUT | <code>string</code> | <code>&quot;input.&quot;</code> | These states are available: [STYLABLE_ELEMENT_STATE.ERROR](#user-content-w_STYLABLE_ELEMENT_STATE), [STYLABLE_ELEMENT_STATE.FOCUS](#user-content-w_STYLABLE_ELEMENT_STATE).   These styles are available [IElementStyleInput](#user-content-w_IElementStyleInput) |
+| SUBMIT_BUTTON | <code>string</code> | <code>&quot;submit_button&quot;</code> | These states are available: [STYLABLE_ELEMENT_STATE.HOVER](#user-content-w_STYLABLE_ELEMENT_STATE).   These styles are available [IElementStyleSubmitButton](#user-content-w_IElementStyleSubmitButton) |
+| LABEL | <code>string</code> | <code>&quot;label.&quot;</code> | These styles are available [IElementStyleLabel](#user-content-w_IElementStyleLabel) |
+| TITLE | <code>string</code> | <code>&quot;title.&quot;</code> | These styles are available [IElementStyleTitle](#user-content-w_IElementStyleTitle) |
+| TITLE_DESCRIPTION | <code>string</code> | <code>&quot;title_description.&quot;</code> | These styles are available [IElementStyleTitleDescription](#user-content-w_IElementStyleTitleDescription) |
+
+<a name="w_STYLABLE_ELEMENT_STATE" id="w_STYLABLE_ELEMENT_STATE" href="#user-content-w_STYLABLE_ELEMENT_STATE">&nbsp;</a>
+
+## STYLABLE\_ELEMENT\_STATE : <code>object</code>
+Current constant include available states of element for styling
+
+**Kind**: global constant  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| ERROR | <code>string</code> | <code>&quot;error&quot;</code> | client|server validation. This state applies to: input |
+| FOCUS | <code>string</code> | <code>&quot;focus&quot;</code> | focus. This state applies to: input |
+| HOVER | <code>string</code> | <code>&quot;hover&quot;</code> | focus. This state applies to: submit_button |
+
+<a name="w_CARD_VALIDATORS" id="w_CARD_VALIDATORS" href="#user-content-w_CARD_VALIDATORS">&nbsp;</a>
+
+## CARD\_VALIDATORS : <code>Record.&lt;string, string&gt;</code>
+List of available form field validators dedicated to cards and their definition
+
+**Kind**: global constant  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| CVV | <code>string</code> | <code>&quot;cardCvvValidation&quot;</code> | Asserts that CVV contains zero or more digits and is a number |
+| EXPIRY_DATE | <code>string</code> | <code>&quot;expireDateValidation&quot;</code> | Asserts value is a date in the future with format MM/YY |
+| HOLDER_NAME | <code>string</code> | <code>&quot;cardHoldernameValidation&quot;</code> | Asserts value is a name that respects the ITU-T T.50 standard (@see https://www.itu.int/rec/T-REC-T.50/en) |
+| NUMBER | <code>string</code> | <code>&quot;cardNumberValidation&quot;</code> | Asserts the value matches a known card scheme and as a the correct length.     E.g., matches a 13, 16 or 19 digit bank card, **or**, a 13 to 25 digit Vii Gift card |
+| PIN | <code>string</code> | <code>&quot;cardPinValidation&quot;</code> | Asserts the value is a number with exactly 4 digits |
+
+<a name="w_GENERIC_VALIDATORS" id="w_GENERIC_VALIDATORS" href="#user-content-w_GENERIC_VALIDATORS">&nbsp;</a>
+
+## GENERIC\_VALIDATORS : <code>Record.&lt;string, string&gt;</code>
+List of available generic form field validators and their definition
+
+**Kind**: global constant  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| REQUIRED | <code>string</code> | <code>&quot;required&quot;</code> | Asserts the input or form field has a value defined truthy value |
+
+<a name="w_TRIGGER" id="w_TRIGGER" href="#user-content-w_TRIGGER">&nbsp;</a>
+
+## TRIGGER : <code>object</code>
+List of available triggers
+
+**Kind**: global constant  
+
+| Param | Type | Default |
+| --- | --- | --- |
+| SUBMIT_FORM | <code>string</code> | <code>&quot;submit_form&quot;</code> | 
+| CHANGE_TAB | <code>string</code> | <code>&quot;tab&quot;</code> | 
+| HIDE_ELEMENTS | <code>string</code> | <code>&quot;hide_elements&quot;</code> | 
+| SHOW_ELEMENTS | <code>string</code> | <code>&quot;show_elements&quot;</code> | 
+| REFRESH_CHECKOUT | <code>string</code> | <code>&quot;refresh_checkout&quot;</code> | 
+| UPDATE_FORM_VALUES | <code>string</code> | <code>&quot;update_form_values&quot;</code> | 
+| INIT_CHECKOUT | <code>string</code> | <code>&quot;init_checkout&quot;</code> | 
+