@globalpayments/js 2.1.2 → 2.1.3

package/README.md

@@ -24,7 +24,7 @@ This plugin allows you to use online payments (eCommerce) features of a variety
 ## Usage
 
 ```html
-<script src="https://js.globalpay.com/v1/globalpayments.js"></script>
+<script src="https://js.globalpay.com/2.1.3/globalpayments.js"></script>
 ```
 
 > Note: Installing via NPM will only provide TypeScript types for type-checking.
@@ -174,6 +174,37 @@ Enables a mandatory restriction for card holdername field
 
 enables the use of the fingerprint mode with "ALWAYS" value 
 
+##### `fieldValidation` - `object` (Optional)
+
+> Note: Applies to GP API only.
+
+enables the use of the HF Built-in Validations. The object structure is:
+```javascript
+  fieldValidation?: {
+    enabled?: boolean, // (Optional)
+    characterValidation?: string // Supported values: [`englishOnly`, `none`] (Optional)
+  }
+```
+The optional `characterValidation` string config can be set as `englishOnly` or `none` and this will indicate if the Card Holder name contains or not English characters.
+
+##### `qrCodePayments` - `object` (Optional - under `apms` configs)
+
+> Note: Applies to GP API only.
+
+enables the use of the QR Code Payments. The object structure is:
+```javascript
+  apms.qrCodePayments?: {
+    enabled?: boolean, // (Optional)
+    allowedPaymentMethods?: [ // Array of allowed Payment Methods (Optional)
+      {
+        provider: string,
+        image: string,
+      },
+    ]
+  }
+```
+The optional `allowedPaymentMethods` object config can be set to manually add the preferred Payment methods.
+
 #### Examples
 
 ##### Heartland eCommerce

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@globalpayments/js",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "author": "Heartland Developer Portal <developers@heartland.us>",
   "license": "GPL-2.0",
   "repository": {

package/types/apm/qr-code-payments/components/common.d.ts

@@ -1 +1,2 @@
 export declare const getSelectAnotherPaymentMethodButton: (id: string, onClickCallback: any) => HTMLDivElement;
+export declare function getCountdownCounter(secondsToExpire: string, onFinishCallback: any): HTMLDivElement;

package/types/apm/qr-code-payments/components/generate-qr-code.d.ts

@@ -0,0 +1,3 @@
+export declare function removeScriptById(scriptId: string): void;
+export declare function loadQRCodeLibraryAndGenerate(text: string): Promise<string>;
+export declare function generateQRCode(text: string): Promise<string>;

package/types/apm/qr-code-payments/components/present-qr-code-action-handler.d.ts

@@ -0,0 +1 @@
+export default function handlePresentQRCodeAction(content: HTMLDivElement, props: any): void;

package/types/apm/qr-code-payments/components/qr-code-expired-handler.d.ts

@@ -0,0 +1 @@
+export default function handleQRCodeExpiredScreen(content: HTMLDivElement, props: any): void;

package/types/apm/qr-code-payments/enums.d.ts

@@ -5,5 +5,6 @@ export declare const enum QRCodePaymentsInternalEvents {
 }
 export declare const enum QRCodePaymentsActions {
     RedirectAction = "REDIRECT",
-    RedirectInFrameAction = "REDIRECT_IN_FRAME"
+    RedirectInFrameAction = "REDIRECT_IN_FRAME",
+    PresentQRCodeAction = "PRESENT_QR_CODE"
 }

package/types/apm/qr-code-payments/helpers.d.ts

@@ -1,2 +1,3 @@
 import { IPaymentMethodConfiguration, IPaymentMethodConfigurationNormalized } from "./contracts";
 export declare const normalizePaymentMethodConfigurations: (paymentMethodConfigurations: IPaymentMethodConfiguration) => IPaymentMethodConfigurationNormalized;
+export declare const validateProviderBrand: (providerBrand: string) => string;

package/types/internal/lib/enums.d.ts

@@ -25,5 +25,11 @@ export declare enum QRCodePaymentsMerchantInteractionEvents {
 }
 export declare enum QRCodePaymentsProviderBrands {
     AlipayHK = "AlipayHK",
-    Alipay = "Alipay"
+    Alipay = "Alipay",
+    WeChat = "WeChat"
+}
+export declare enum QRCodePaymentsWeChatProviderBrands {
+    WeChatBrand = "WeChat",
+    WeChatMethodResponse = "WECHAT",
+    WeChatAccountResponse = "WeChat Pay"
 }

package/types/internal/lib/styles/default.d.ts

@@ -201,6 +201,14 @@ export declare const parentStyles: (assetBaseUrl: string) => {
         "background-color": string;
         border: string;
     };
+    ".secure-payment-form .qr-code-payment-method-wechat"?: {
+        "background-color": string;
+        border: string;
+    };
+    ".secure-payment-form .qr-code-payment-method-wechat:hover"?: {
+        "background-color": string;
+        border: string;
+    };
     ".secure-payment-form .qr-code-payment-iframe-wrapper"?: {
         display: string;
         "flex-direction": string;

package/types/internal/lib/styles/gp-default.d.ts

@@ -163,6 +163,14 @@ export declare const parentStyles: (assetBaseUrl: string) => {
         "background-color": string;
         border: string;
     };
+    ".secure-payment-form .qr-code-payment-method-wechat"?: {
+        "background-color": string;
+        border: string;
+    };
+    ".secure-payment-form .qr-code-payment-method-wechat:hover"?: {
+        "background-color": string;
+        border: string;
+    };
     ".secure-payment-form .qr-code-payment-iframe-wrapper"?: {
         display: string;
         "flex-direction": string;

package/types/internal/lib/styles/qr-code-payments/common.d.ts

@@ -41,6 +41,14 @@ export declare const styles: (assetBaseUrl: string) => {
         "background-color": string;
         border: string;
     };
+    ".secure-payment-form .qr-code-payment-method-wechat": {
+        "background-color": string;
+        border: string;
+    };
+    ".secure-payment-form .qr-code-payment-method-wechat:hover": {
+        "background-color": string;
+        border: string;
+    };
     ".secure-payment-form .qr-code-payment-iframe-wrapper": {
         display: string;
         "flex-direction": string;

package/types/internal/lib/styles/simple.d.ts

@@ -184,6 +184,14 @@ export declare const parentStyles: (assetBaseUrl: string) => {
         "background-color": string;
         border: string;
     };
+    ".secure-payment-form .qr-code-payment-method-wechat"?: {
+        "background-color": string;
+        border: string;
+    };
+    ".secure-payment-form .qr-code-payment-method-wechat:hover"?: {
+        "background-color": string;
+        border: string;
+    };
     ".secure-payment-form .qr-code-payment-iframe-wrapper"?: {
         display: string;
         "flex-direction": string;

package/types/internal/lib/translations/en.d.ts

@@ -47,6 +47,26 @@ declare const en: {
     };
     "other-cards-label": string;
     QR: {
+        scanRqCode: string;
+        payInApp: string;
+        amount: {
+            "aria-label": string;
+        };
+        qrImage: {
+            alt: string;
+            "aria-label": string;
+        };
+        timer: {
+            text: string;
+            minutes: string;
+            seconds: string;
+            "icon-alt": string;
+        };
+        expiredScreen: {
+            title: string;
+            alt: string;
+            text: string;
+        };
         button: {
             text: string;
             "aria-label": string;

package/types/internal/lib/translations/zh.d.ts

@@ -54,6 +54,26 @@ declare const zh: {
         redirectScreen: {
             redirectingToPaymentPageMessage: string;
         };
+        scanRqCode: string;
+        payInApp: string;
+        amount: {
+            "aria-label": string;
+        };
+        qrImage: {
+            alt: string;
+            "aria-label": string;
+        };
+        timer: {
+            text: string;
+            minutes: string;
+            seconds: string;
+            "icon-alt": string;
+        };
+        expiredScreen: {
+            title: string;
+            alt: string;
+            text: string;
+        };
     };
 };
 export default zh;

package/types/lib/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "2.1.2";
+declare const _default: "2.1.3";
 export default _default;

package/types/ui/form/index.d.ts

@@ -491,6 +491,14 @@ export declare const parentStyles: () => {
             "background-color": string;
             border: string;
         };
+        ".secure-payment-form .qr-code-payment-method-wechat"?: {
+            "background-color": string;
+            border: string;
+        };
+        ".secure-payment-form .qr-code-payment-method-wechat:hover"?: {
+            "background-color": string;
+            border: string;
+        };
         ".secure-payment-form .qr-code-payment-iframe-wrapper"?: {
             display: string;
             "flex-direction": string;
@@ -553,7 +561,11 @@ export declare const parentStyles: () => {
             "font-size": string;
         };
         ".secure-payment-form .qr-code-expired-alert"?: {
-            display: string;
+            display: string; /**
+             * Appends additional CSS rules to the group of hosted fields
+             *
+             * @param json New CSS rules
+             */
             border: string;
             height: string;
             "margin-top": string;
@@ -1047,6 +1059,14 @@ export declare const parentStyles: () => {
             "background-color": string;
             border: string;
         };
+        ".secure-payment-form .qr-code-payment-method-wechat"?: {
+            "background-color": string;
+            border: string;
+        };
+        ".secure-payment-form .qr-code-payment-method-wechat:hover"?: {
+            "background-color": string;
+            border: string;
+        };
         ".secure-payment-form .qr-code-payment-iframe-wrapper"?: {
             display: string;
             "flex-direction": string;
@@ -1109,7 +1129,11 @@ export declare const parentStyles: () => {
             "font-size": string;
         };
         ".secure-payment-form .qr-code-expired-alert"?: {
-            display: string;
+            display: string; /**
+             * Appends additional CSS rules to the group of hosted fields
+             *
+             * @param json New CSS rules
+             */
             border: string;
             height: string;
             "margin-top": string;
@@ -2017,6 +2041,14 @@ export declare const parentStyles: () => {
             "background-color": string;
             border: string;
         };
+        ".secure-payment-form .qr-code-payment-method-wechat"?: {
+            "background-color": string;
+            border: string;
+        };
+        ".secure-payment-form .qr-code-payment-method-wechat:hover"?: {
+            "background-color": string;
+            border: string;
+        };
         ".secure-payment-form .qr-code-payment-iframe-wrapper"?: {
             display: string;
             "flex-direction": string;
@@ -2079,7 +2111,11 @@ export declare const parentStyles: () => {
             "font-size": string;
         };
         ".secure-payment-form .qr-code-expired-alert"?: {
-            display: string;
+            display: string; /**
+             * Appends additional CSS rules to the group of hosted fields
+             *
+             * @param json New CSS rules
+             */
             border: string;
             height: string;
             "margin-top": string;

package/types/ui/iframe-field/action-add-qr-code-payment-methods.d.ts

@@ -1,3 +1,3 @@
 import { IframeField } from ".";
 import { IPaymentMethodConfigurationNormalized } from "../../apm/qr-code-payments/contracts";
-export default function addQRCodePaymentMethods(iframeField: IframeField | undefined, paymentMethodConfigurations: IPaymentMethodConfigurationNormalized[]): void;
+export default function addQRCodePaymentMethods(iframeField: IframeField | undefined, paymentMethodConfigurations: IPaymentMethodConfigurationNormalized[], amount: string | number): void;

package/types/internal/lib/eums.d.ts

@@ -1,11 +0,0 @@
-export declare enum Apm {
-    ClickToPay = "click-to-pay",
-    GooglePay = "google-pay",
-    ApplePay = "apple-pay"
-}
-export declare enum CardNetwork {
-    Visa = "VISA",
-    Mastercard = "MASTERCARD",
-    Amex = "AMEX",
-    Discover = "DISCOVER"
-}