npm - @paydock/client-sdk - Versions diffs - 1.127.0 → 1.128.2 - Mend

@paydock/client-sdk 1.127.0 → 1.128.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (78) hide show

package/docs/checkout-examples.md CHANGED Viewed

@@ -1,7 +1,6 @@
 ## Checkout button
 You can find description of all methods and parameters [here](https://www.npmjs.com/package/@paydock/client-sdk#cb_CheckoutButton)
-PayPal meta parameters description [here](https://www.npmjs.com/package/@paydock/client-sdk#ipaypalmeta)
 Zipmoney meta parameters description [here](https://www.npmjs.com/package/@paydock/client-sdk#izipmoneymeta)
 This widget allows you to turn your button into a full Checkout Button.
@@ -24,96 +23,18 @@ You must create a button to turn it into checkout-button
 ### Initialization
 ```javascript
-var button = new paydock.PaypalCheckoutButton('#button', 'publicKey', 'gatewayId');
+var button = new paydock.ZipmoneyCheckoutButton('#button', 'publicKey', 'gatewayId');
 ```
 ```javascript
 // ES2015 | TypeScript
-var button = new PaypalCheckoutButton('#button', 'publicKey');
+var button = new ZipmoneyCheckoutButton('#button', 'publicKey');
 ```
 Then write only need 1 line of code in js to initialize widget
-### Full example
-```html
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Title</title>
-</head>
-<body>
-    <button type="button" id="button">checkout</button>
-    <script src="https://widget.paydock.com/sdk/latest/widget.umd.js" ></script>
-    <script>
-        var button = new paydock.PaypalCheckoutButton('#button', 'publicKey');
-    </script>
-</body>
-</html>
-```
-## Checkout button advanced example
-### Optional methods
-```javascript
-button.onFinishInsert('input[name="pst"]', 'payment_source_token'); // insert one-time-token to your input after finish checkout
-button.setMeta({
-       brand_name: 'Paydock',
-       reference: '15',
-       first_name: 'receiver-name',
-       last_name: 'receiver-last-name',
-       phone: '9379992'}); // settings for checkout pages
-button.on('finish', function (data) { // Add handler of event
-       console.log('on:finish', data);
-});
-```
-This example shows how you can use a lot of other methods to settings your button
-### Full Paypal example
-```html
-<!DOCTYPE html>
-<html lang="en">
-<head>
-	<meta charset="UTF-8">
-	<title>Title</title>
-</head>
-<body>
-<form id="paymentForm">
-    <button type="button" id="button">
-        <img src="https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif" align="left" style="margin-right:7px;">
-    </button>
-</form>
-<input type="text" name="pst" />
-<script src="https://widget.paydock.com/sdk/latest/widget.umd.js" ></script>
-<script>
-	var button = new paydock.PaypalCheckoutButton('#button', 'publicKey', 'gatewayId');
-	button.onFinishInsert('input[name="pst"]', 'payment_source_token');
-    button.setMeta({
-           brand_name: 'Paydock',
-           reference: '15',
-           first_name: 'Joshua',
-           last_name: 'Wood',
-           phone: '0231049872'});
-    button.on('finish', function (data) {
-           console.log('on:finish', data);
-    });
-</script>
-</body>
-</html>
-```
 ### Full ZipMoney example
 ```html
@@ -200,49 +121,3 @@ This example shows how you can use a lot of other methods to settings your butto
 </body>
 </html>
 ```
-### Full Aftepay example
-```html
-<!DOCTYPE html>
-<html lang="en">
-<head>
-	<meta charset="UTF-8">
-	<title>Title</title>
-</head>
-<body>
-<button type="button" id="button">
-    <img src="https://daepxvbfwwgd0.cloudfront.net/assets/logo_scroll-0c43312c5845a0dcd7a3373325da6402bc1d635d3415af28ed40d6c1b48e3d5c.png" align="left" style="margin-right:7px;">
-</button>
-<input type="text" name="pst" />
-<script src="https://widget.paydock.com/sdk/latest/widget.umd.js" ></script>
-<script>
-	var button = new paydock.AfterpayCheckoutButton('#button', 'publicKey', 'gatewayId');
-	button.onFinishInsert('input[name="pst"]', 'payment_source_token');
-    button.showEnhancedTrackingProtectionPopup(true);
-    button.setMeta({
-        amount: "100",
-        currency: "AUD",
-        reference: 'Vitae commodi provident assumenda',
-        email: 'wanda.mertz@example.com',
-        first_name: 'Wanda',
-        last_name: 'Mertz',
-        address_line: '61426 Osvaldo Plains',
-        address_line2: 'Apt. 276',
-        address_city: 'Lake Robyn',
-        address_state: 'WY',
-        address_postcode: '07396',
-        address_country: 'Australia',
-        phone: '0412345678',
-    });
-    button.on('finish', function (data) {
-           console.log('on:finish', data);
-    });
-</script>
-</body>
-</html>
-```

package/docs/click-to-pay-examples.md CHANGED Viewed

@@ -229,3 +229,112 @@ src.setStyles({
     font_family: 'Arial',
 });
 ```
+## Configurations for background loading and improved User Load times
+### hold_for_customer_data
+When set to `true`, this flag allows you to load the Click to Pay iframe in the background while collecting customer information. This improves the perceived performance by starting the iframe load process early.
+```javascript
+const clickToPay = new cba.ClickToPay("#checkoutIframe", SERVICE_ID, PUBLIC_KEY, {
+  hold_for_customer_data: true,
+  dpa_config: {
+    dpa_id: DPA_ID,
+    // ... other config
+  }
+});
+```
+### injectCustomerData(customer)
+Once you have collected the customer information, use this method to provide it to the Click to Pay iframe. This will trigger the checkout to continue.
+```javascript
+clickToPay.injectCustomerData({
+  email: "customer@example.com",
+  first_name: "John",
+  last_name: "Doe",
+  phone: "+61400123456"  // Include country code
+});
+```
+### Background Loading Example
+Here's a complete example showing how to implement background loading while collecting customer information:
+```javascript
+// 1. Initialize with hold_for_customer_data
+const clickToPay = new cba.ClickToPay("#checkoutIframe", SERVICE_ID, PUBLIC_KEY, {
+  hold_for_customer_data: true,
+  dpa_config: {
+    dpa_id: DPA_ID,
+    // ... other config
+  }
+});
+// Hide checkout and show form initially
+document.getElementById("checkoutIframe").style.display = 'none';
+document.getElementById("customerForm").style.display = 'block';
+document.getElementById("loader").style.display = 'none';
+// 2. Setup event handlers
+clickToPay.on('iframeLoaded', () => {
+  // Iframe is now loaded
+});
+clickToPay.on('checkoutReady', () => {
+  // Hide loader, show checkout
+  document.getElementById("loader").style.display = 'none';
+  document.getElementById("checkoutIframe").style.display = 'block';
+  clickToPay.showCheckout();
+});
+// 3. Start loading in background
+clickToPay.load();
+// 4. Handle form submission
+document.getElementById("submitButton").addEventListener("click", (e) => {
+  e.preventDefault();
+  const customer = {
+    email: document.getElementById("email").value.trim(),
+    first_name: document.getElementById("firstName").value.trim(),
+    last_name: document.getElementById("lastName").value.trim(),
+    phone: document.getElementById("phone").value.trim()
+  };
+  // Hide form, show loader
+  document.getElementById("customerForm").style.display = "none";
+  document.getElementById("loader").style.display = "flex";
+  try {
+    // Inject customer data to continue checkout
+    clickToPay.injectCustomerData(customer);
+  } catch (error) {
+    // Show form again on error
+    document.getElementById("customerForm").style.display = "block";
+    document.getElementById("loader").style.display = "none";
+    alert("An error occurred. Please try again.");
+  }
+});
+```
+#### HTML Structure
+Here's the required HTML structure for the background loading example:
+```html
+<!-- Click to Pay iframe container -->
+<div id="checkoutIframe"></div>
+<!-- Customer information form -->
+<form id="customerForm">
+  <input type="email" id="email" placeholder="Email" required>
+  <input type="text" id="firstName" placeholder="First Name" required>
+  <input type="text" id="lastName" placeholder="Last Name" required>
+  <input type="tel" id="phone" placeholder="Phone (with country code)" required>
+  <button type="submit" id="submitButton">Continue to Checkout</button>
+</form>
+<!-- Loading indicator -->
+<div id="loader" style="display: none;">
+  Loading...
+</div>
+```

package/docs/click-to-pay.md CHANGED Viewed

@@ -53,7 +53,7 @@ Interface of data used for the Mastercard Checkout. For further information refe
 | [checkout_experience] | <code>string</code> | Checkout experience type, either 'WITHIN_CHECKOUT' or 'PAYMENT_SETTINGS'. |
 | [services] | <code>string</code> | Services offered, such as 'INLINE_CHECKOUT' or 'INLINE_INSTALLMENTS'. |
 | [dpa_transaction_options] | <code>object</code> | Object that stores options for creating a transaction with DPA. |
-| [dpa_transaction_options.dpa_locale] | <code>string</code> | DPA’s preferred locale, example en_US. |
+| [dpa_transaction_options.dpa_locale] | <code>string</code> | DPA's preferred locale, example en_US. |
 | [dpa_transaction_options.dpa_accepted_billing_countries] | <code>Array.&lt;string&gt;</code> | List of accepted billing countries for DPA in ISO 3166-1 alpha-2 format. |
 | [dpa_transaction_options.dpa_billing_preference] | <code>string</code> | Billing preferences for DPA, options are 'FULL', 'POSTAL_COUNTRY', 'NONE'. |
 | [dpa_transaction_options.payment_options] | <code>Array.&lt;object&gt;</code> | Payment options included in the transaction. |
@@ -78,6 +78,12 @@ Interface of data used for the Mastercard Checkout. For further information refe
 | [customer.phone.country_code] | <code>string</code> | Customer phone country code (example "1" for US). |
 | [customer.phone.phone] | <code>string</code> | Customer phone number. |
 | [unaccepted_card_type] | <code>string</code> | Used to block a specific card type. Options are 'CREDIT', 'DEBIT'. |
+| [dpa_config] | <code>object</code> | Raw DPA configuration object for performance optimization. Skips API call when provided. |
+| [dpa_config.dpa_id] | <code>string</code> | DPA identifier. |
+| [dpa_config.dpa_name] | <code>string</code> | DPA name. |
+| [dpa_config.dpa_supported_card_schemes] | <code>Array.&lt;string&gt;</code> | List of supported card schemes: 'MASTERCARD', 'VISA', 'AMEX', 'DISCOVER'. |
+| [dpa_config.mode] | <code>string</code> | DPA mode, either 'sandbox' or 'live'. |
+| [hold_for_customer_data] | <code>boolean</code> | Flag to hold initialization for customer data injection. Enables background initialization. |
 <a name="EventData" id="EventData" href="#EventData">&nbsp;</a>
@@ -152,6 +158,7 @@ Class ClickToPay include methods for interacting with the ClickToPay checkout an
 * [ClickToPay](#ClickToPay) ⇐ <code>SRC</code>
     * [new ClickToPay(iframe_selector, service_id, public_key_or_access_token, meta)](#new_ClickToPay_new)
     * [.load()](#ClickToPay+load)
+    * [.injectCustomerData(customerData)](#ClickToPay+injectCustomerData)
     * [.setStyles(fields)](#SRC+setStyles)
     * [.setEnv(env, [alias])](#SRC+setEnv)
     * [.getEnv()](#SRC+getEnv)
@@ -182,6 +189,29 @@ var mastercardSRC = new ClickToPay('#checkoutIframe', 'service_id', 'public_key'
 The final method after configuring the SRC to start the load process of Click To Pay checkout
 **Kind**: instance method of [<code>ClickToPay</code>](#ClickToPay)
+<a name="ClickToPay+injectCustomerData" id="ClickToPay+injectCustomerData" href="#ClickToPay+injectCustomerData">&nbsp;</a>
+### clickToPay.injectCustomerData(customerData)
+Inject customer data after widget initialization via postMessage
+**Kind**: instance method of [<code>ClickToPay</code>](#ClickToPay)
+**Throws**:
+- <code>Error</code> When customer data is invalid or widget is not ready
+| Param | Type | Description |
+| --- | --- | --- |
+| customerData | <code>Customer</code> | Customer data to inject |
+**Example**
+```js
+widget.injectCustomerData({
+    email: 'user@example.com',
+    first_name: 'John',
+    last_name: 'Doe'
+});
+```
 <a name="SRC+setStyles" id="SRC+setStyles" href="#SRC+setStyles">&nbsp;</a>
 ### clickToPay.setStyles(fields)

package/docs/license.md CHANGED Viewed

@@ -1,2 +1,2 @@
 ## License
-Copyright (c) 2024 paydock
+Copyright (c) 2025 paydock

package/docs/wallet-buttons-examples.md CHANGED Viewed

@@ -2,7 +2,7 @@
 You can find description of all methods and parameters [here](https://www.npmjs.com/package/@paydock/client-sdk#wallet-buttons-simple-example)
 Wallet Buttons allow you to easily integrate different E-Wallets into your checkout.
-Currently supports ApplePay, Google Pay, Google Pay and Apple Pay via Stripe, Flypay and Flypay V2 checkout, Paypal Smart Buttons Checkout and Afterpay.
+Currently supports ApplePay, Google Pay, Google Pay and Apple Pay via Stripe and Flypay V2 checkout, Paypal Smart Buttons Checkout and Afterpay.
 If available in your client environment, you will display a simple button that upon clicking it the user will follow the standard flow for the appropriate Wallet. If not available an event will be raised and no button will be displayed.
@@ -19,55 +19,6 @@ You must create a container for the Wallet Buttons. Inside this tag, the button
 Before initializing the button, you must perform a POST request to `charges/wallet` from a secure environment like your server. This call will return a token that is required to load the button and securely complete the payment. You can find the documentation to this call in the PayDock API documentation.
 ### Initialization
-The following is the minimum required initialization parameters for Apple Pay and Google Pay via Stripe:
-```javascript
-let button = new paydock.WalletButtons(
-    "#widget",
-    token,
-    {
-        amount_label: "Total",
-        country: "DE",
-    }
-);
-button.load();
-```
-```javascript
-// ES2015 | TypeScript
-import { WalletButtons } from '@paydock/client-sdk';
-var button = new WalletButtons(
-    '#widget',
-    token,
-    {
-        amount_label: 'Total',
-        country: 'DE',
-    }
-);
-button.load();
-```
-Flypay and Paypal wallets do not require any meta sent to the wallet, so the following is enough for initialization:
-```javascript
-let button = new paydock.WalletButtons(
-    "#widget",
-    token,
-    {}
-);
-button.load();
-```
-```javascript
-// ES2015 | TypeScript
-import { WalletButtons } from '@paydock/client-sdk';
-var button = new WalletButtons(
-    '#widget',
-    token,
-    {}
-);
-button.load();
-```
 For Afterpay wallet, the country code is required:
 ```javascript
@@ -168,14 +119,6 @@ If the customer's browser is not supported, or the customer does not have any ca
 button.onUnavailable(() => console.log("No wallet buttons available"));
 ```
-### Forcibly closing the checkout
-In some situations you may want to forcibly close the checkout so that your user is back in your checkout screen, fow which you can use this method. Currently supported by Flypay wallet only.
-```javascript
-button.close();
-```
 ### Performing actions when the wallet button is clicked
 In some situations you may want to perform some validations or actions when the user clicks on the wallet button, for which you can use this method. Currently supported by Paypal, ApplePay and GooglePay wallets.
@@ -186,7 +129,7 @@ button.onClick(() => console.log("Perform actions on button click"));
 ### Performing actions when shipping info is updated
-In Flypay, Paypal, ApplePay via MPGS and GooglePay via MPGS integrations after each shipping info update the `onUpdate(data)` will be called with the selected shipping address information, plus selected shipping method when applicable for Paypal, ApplePay and GooglePay. Merchants should handle this callback, recalculate shipping costs in their server by analyzing the new data, and submit a backend to backend request to `POST charges/:id` with the new total amount and shipping amount (you can find the documentation of this call in the PayDock API documentation).
+In Paypal, ApplePay via MPGS and GooglePay via MPGS integrations after each shipping info update the `onUpdate(data)` will be called with the selected shipping address information, plus selected shipping method when applicable for Paypal, ApplePay and GooglePay. Merchants should handle this callback, recalculate shipping costs in their server by analyzing the new data, and submit a backend to backend request to `POST charges/:id` with the new total amount and shipping amount (you can find the documentation of this call in the PayDock API documentation).
 For Paypal integration specifically, if shipping is enabled for the wallet button and different shipping methods were provided in the create wallet charge call, Merchants must ensure that the posted `shipping.amount` to `POST charges/:id` matches the selected shipping option amount (value sent in when initializing the wallet charge). In other words, when providing shipping methods the shipping amount is bound to being one of the provided shipping method amount necessarily. Bear in mind that the total charge amount must include the `shipping.amount`, since it represents the full amount to be charged to the customer.
@@ -253,47 +196,11 @@ of the corresponding event names.
 ```javascript
 button.on(EVENT.UNAVAILABLE, () => console.log("No wallet buttons available"));
-button.on(EVENT.UPDATE, (data) => console.log("Updating amount via a backend to backend call to POST charges/:id");
+button.on(EVENT.UPDATE, (data) => console.log("Updating amount via a backend to backend call to POST charges/:id"));
 button.on(EVENT.PAYMENT_SUCCESSFUL, (data) => console.log("The payment was successful"));
 button.on(EVENT.PAYMENT_ERROR, (data) => console.log("The payment was not successful"));
 ```
-This example shows how to use these functions for **Apple and Google Pay via Stripe**:
-_(Required `meta` fields: `amount_label`, `country`. Optional `meta` fields: `wallets`)_
-### Apple and Google Pay via Stripe Full example
-```html
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Title</title>
-</head>
-<body>
-    <h2>Payment using PayDock Wallet Button!</h2>
-    <div id="widget"></div>
-</body>
-<script src="https://widget.paydock.com/sdk/latest/widget.umd.min.js" ></script>
-<script>
-    let button = new paydock.WalletButtons(
-        "#widget",
-        charge_token,
-        {
-            amount_label: "Total",
-            country: "DE",
-            wallets: ["google", "apple"],
-        }
-    );
-    button.setEnv('sandbox');
-    button.onUnavailable(() => console.log("No wallet buttons available"));
-    button.onPaymentSuccessful((data) => console.log("The payment was successful"));
-    button.onPaymentError((data) => console.log("The payment was not successful"));
-    button.onPaymentInReview((data) => console.log("The payment is on fraud review"));
-    button.load();
-</script>
-</html>
-```
 This example shows how to use these functions for **Paypal Smart Checkout Buttons**:
 _(Required `meta` fields: - . Optional `meta` fields: `request_shipping`, `pay_later`, `standalone`, `style`)_
 ### Paypal Smart Checkout Buttons Full example
@@ -361,44 +268,6 @@ _(Required `meta` fields: - . Optional `meta` fields: `request_shipping`, `pay_l
 </html>
 ```
-This example shows how to use these functions for **Flypay v1 Wallet**.
-_(Required `meta` fields: - . Optional `meta` fields: `request_shipping`, `pay_later`, `style`)_
-### Flypay Full example
-```html
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>Title</title>
-</head>
-<body>
-    <h2>Payment using PayDock Wallet Button!</h2>
-    <div id="widget"></div>
-</body>
-<script src="https://widget.paydock.com/sdk/latest/widget.umd.min.js" ></script>
-<script>
-    let button = new paydock.WalletButtons(
-          "#widget",
-          charge_token,
-          {
-               request_shipping: true
-          }
-     );
-    button.setEnv('sandbox');
-    button.onUnavailable(() => console.log("No wallet buttons available"));
-    button.onUpdate((data) => {
-          console.log("Updating amount via a backend to backend call to POST charges/:id");
-          // call `POST charges/:id` to modify charge
-          button.update({ success: true });
-     });
-    button.onPaymentSuccessful((data) => console.log("The payment was successful"));
-    button.onPaymentError((data) => console.log("The payment was not successful"));
-    button.onPaymentInReview((data) => console.log("The payment is on fraud review"));
-    button.load();
-</script>
-</html>
-```
 This example shows how to use these functions for **Flypay v2 Wallet**.
 _(Required `meta` fields: - . Optional `meta` fields: -)_
 ### Flypay V2 Full example

package/docs/wallet-buttons.md CHANGED Viewed

@@ -2,7 +2,7 @@
 <dl>
 <dt><a href="#WalletButtons">WalletButtons</a></dt>
-<dd><p>Class WalletButtons to work with different E-Wallets within html (currently supports Apple Pay, Google Pay, Google Pay™ and Apple Pay via Stripe, Flypay, Flypay V2, Paypal, Afterpay)</p>
+<dd><p>Class WalletButtons to work with different E-Wallets within html (currently supports Apple Pay, Google Pay, Google Pay™ and Apple Pay via Stripe, Flypay V2, Paypal, Afterpay)</p>
 </dd>
 </dl>
@@ -154,8 +154,8 @@ Interface of data used by the wallet checkout and payment proccess.
 | Param | Type | Description |
 | --- | --- | --- |
-| [amount_label] | <code>string</code> | Label shown next to the total amount to be paid. Required for [Stripe, ApplePay, GooglePay]. N/A for [FlyPay, Flypay V2, PayPal, Afterpay]. |
-| [country] | <code>string</code> | Country of the user. 2 letter ISO code format. Required for [Stripe, ApplePay, GooglePay, Afterpay]. N/A for [FlyPay, Flypay V2, PayPal]. |
+| [amount_label] | <code>string</code> | Label shown next to the total amount to be paid. Required for [Stripe, ApplePay, GooglePay]. N/A for [Flypay V2, PayPal, Afterpay]. |
+| [country] | <code>string</code> | Country of the user. 2 letter ISO code format. Required for [Stripe, ApplePay, GooglePay, Afterpay]. N/A for [Flypay V2, PayPal]. |
 | [pay_later] | <code>boolean</code> | Used to enable Pay Later feature in PayPal Smart Checkout WalletButton integration when available. Optional for [PayPal]. N/A for other wallets. |
 | [hide_message] | <code>boolean</code> | Used to hide Pay Later message in PayPal Smart Checkout WalletButton integration. Optional for [PayPal]. N/A for other wallets. |
 | [standalone] | <code>boolean</code> | Used to enable Standalone Buttons feature in PayPal Smart Checkout WalletButton integration. Used together with `pay_later`. Optional for [PayPal]. N/A for other wallets. |
@@ -165,17 +165,17 @@ Interface of data used by the wallet checkout and payment proccess.
 | [request_payer_phone] | <code>boolean</code> | Used mainly for fraud purposes - recommended set to true. Optional for [Stripe]. N/A for other wallets. |
 | [access_token] | <code>string</code> | Used for Flypay V2 express flow. Optional for [Flypay V2]. N/A for other wallets. |
 | [refresh_token] | <code>string</code> | Used for Flypay V2 express flow. Optional for [Flypay V2]. N/A for other wallets. |
-| [request_shipping] | <code>boolean</code> | Used to request or not shipping address in the Wallet checkout, being able to handle amount changes via the `update` event. Optional for [FlyPay, PayPal, ApplePay, GooglePay]. N/A for [Flypay V2, Stripe, Afterpay]. |
+| [request_shipping] | <code>boolean</code> | Used to request or not shipping address in the Wallet checkout, being able to handle amount changes via the `update` event. Optional for [PayPal, ApplePay, GooglePay]. N/A for [Flypay V2, Stripe, Afterpay]. |
 | [shipping_options] | [<code>Array.&lt;IApplePayShippingOption&gt;</code>](#IApplePayShippingOption) \| [<code>Array.&lt;IPayPalShippingOption&gt;</code>](#IPayPalShippingOption) | Used to provide available shipping options.(To use shipping_options the request_shipping flag should be true). Optional for [ApplePay]. N/A for the other wallets. |
 | [merchant_name] | <code>string</code> | Merchant Name used for GooglePay integration via MPGS. Required for [GooglePay]. N/A for other wallets. |
 | [raw_data_initialization] | <code>object</code> | Used to provide values to initialize wallet with raw data. Optional for [ApplePay]. N/A for the other wallets. |
-| [style] | <code>object</code> | For **Paypal**: used to style the buttons, check possible values in the [style guide](https://developer.paypal.com/docs/business/checkout/reference/style-guide). When `standalone` and `pay_later`, extra options can be provided in `style.messages` with the [messages style options](https://developer.paypal.com/docs/checkout/pay-later/us/integrate/reference/#stylelayout). Also used at **ApplePay**, **GooglePay** and **Afterpay** to select button type. Optional for [PayPal, ApplePay, GooglePay, Afterpay]. N/A for [Stripe, FlyPay, Flypay V2]. |
+| [style] | <code>object</code> | For **Paypal**: used to style the buttons, check possible values in the [style guide](https://developer.paypal.com/docs/business/checkout/reference/style-guide). When `standalone` and `pay_later`, extra options can be provided in `style.messages` with the [messages style options](https://developer.paypal.com/docs/checkout/pay-later/us/integrate/reference/#stylelayout). Also used at **ApplePay**, **GooglePay** and **Afterpay** to select button type. Optional for [PayPal, ApplePay, GooglePay, Afterpay]. N/A for [Stripe, Flypay V2]. |
 | [style.button_type] | <code>object</code> | Used to select ApplePay button type (e.g: 'buy','donate', etc), check possible values [here](https://developer.apple.com/documentation/apple_pay_on_the_web/displaying_apple_pay_buttons_using_css). Also select button type for GooglePay (check GooglePayStyles) and Afterpay (check AfterpayStyles). Optional for [ApplePay, GooglePay, Afterpay]. N/A for other wallets. |
 | [style.button_style] | <code>object</code> | Used to select ApplePay button style (e.g: 'black', 'white', etc), check possible values [here](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaybuttonstyle). Optional for [ApplePay]. N/A for other wallets. |
 | [style.height] | <code>object</code> | Used to select Afterpay button height. Optional for [Afterpay]. N/A for other wallets. |
 | [wallets] | <code>array</code> | By default if this is not sent or empty, we will try to show either Apple Pay or Google Pay buttons. This can be limited sending the following array in this field: ['apple','google]. Optional for [Stripe, ApplePay, GooglePay]. N/A for other wallets. |
-| [client_id] | <code>string</code> | Client ID to be used in the provider system. Required for [Flypay V2]. N/A for [FlyPay, GooglePay, ApplePay, PayPal, Afterpay]. |
-| [apple_pay_capabilities] | <code>Array.&lt;(&#x27;credentials\_available&#x27;\|&#x27;credentials\_status\_unknown&#x27;\|&#x27;credentials\_unavailable&#x27;)&gt;</code> | Device capabilities needed for wallet button to be available. For further information about refer to [the documentation](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaysession/4440085-applepaycapabilities). If the recognized value is credentials_status_unknown, the payment most possibly cannot be finished on the web, and the buyer must complete it on a compatible device, like Iphone, via QR scan. Optional parameter for [ApplePay]. N/A for [FlyPay, GooglePay, Flypay V2, PayPal, Afterpay]. |
+| [client_id] | <code>string</code> | Client ID to be used in the provider system. Required for [Flypay V2]. N/A for [GooglePay, ApplePay, PayPal, Afterpay]. |
+| [apple_pay_capabilities] | <code>Array.&lt;(&#x27;credentials\_available&#x27;\|&#x27;credentials\_status\_unknown&#x27;\|&#x27;credentials\_unavailable&#x27;)&gt;</code> | Device capabilities needed for wallet button to be available. For further information about refer to [the documentation](https://developer.apple.com/documentation/apple_pay_on_the_web/applepaysession/4440085-applepaycapabilities). If the recognized value is credentials_status_unknown, the payment most possibly cannot be finished on the web, and the buyer must complete it on a compatible device, like Iphone, via QR scan. Optional parameter for [ApplePay]. N/A for [GooglePay, Flypay V2, PayPal, Afterpay]. |
 <a name="IApplePayShippingOption" id="IApplePayShippingOption" href="#IApplePayShippingOption">&nbsp;</a>
@@ -224,7 +224,7 @@ Interface of Shipping Options for PayPal
 <a name="WalletButtons" id="WalletButtons" href="#WalletButtons">&nbsp;</a>
 ## WalletButtons
-Class WalletButtons to work with different E-Wallets within html (currently supports Apple Pay, Google Pay, Google Pay™ and Apple Pay via Stripe, Flypay, Flypay V2, Paypal, Afterpay)
+Class WalletButtons to work with different E-Wallets within html (currently supports Apple Pay, Google Pay, Google Pay™ and Apple Pay via Stripe, Flypay V2, Paypal, Afterpay)
 **Kind**: global class
@@ -284,7 +284,7 @@ var button = new WalletButtons(
 ### walletButtons.update()
 Triggers the update process of the wallet, if available.
-Currently supported by Flypay, Paypal and ApplePay/GooglePay via MPGS Wallets.
+Currently supported by Paypal and ApplePay/GooglePay via MPGS Wallets.
 **Kind**: instance method of [<code>WalletButtons</code>](#WalletButtons)
 **Example**
@@ -408,7 +408,7 @@ button.on('paymentSuccessful', function (data) {
 });
 // or
 button.on('unavailable').then(function () {
-     console.log('No button is available);
+     console.log('No button is available');
 });
 ```
 <a name="WalletButtons+onUnavailable" id="WalletButtons+onUnavailable" href="#WalletButtons+onUnavailable">&nbsp;</a>

package/docs/wallet-cba-buttons-examples.md CHANGED Viewed

@@ -184,7 +184,7 @@ of the corresponding event names.
 ```javascript
 button.on(EVENT.UNAVAILABLE, () => console.log("No wallet buttons available"));
-button.on(EVENT.UPDATE, (data) => console.log("Updating amount via a backend to backend call to POST charges/:id");
+button.on(EVENT.UPDATE, (data) => console.log("Updating amount via a backend to backend call to POST charges/:id"));
 button.on(EVENT.PAYMENT_SUCCESSFUL, (data) => console.log("The payment was successful"));
 button.on(EVENT.PAYMENT_ERROR, (data) => console.log("The payment was not successful"));
 ```

package/package.json CHANGED Viewed

@@ -104,7 +104,7 @@
     }
   },
   "name": "@paydock/client-sdk",
-  "version": "1.127.0",
+  "version": "1.128.2",
   "scripts": {
     "build:doc": "node docs/html/marked.js",
     "build:js": "rollup --config rollup.config.ts --configPlugin @rollup/plugin-typescript",