@payrails/web-sdk 5.27.0 → 5.28.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@payrails/web-sdk",
-  "version": "5.27.0",
+  "version": "5.28.1",
   "description": "SDK providing tokenization options on the client for merchants",
   "main": "index.js",
   "types": "payrails.d.ts",

package/payrails-styles.css

@@ -91,6 +91,7 @@
   overflow: hidden;
   border: 1px solid #888;
   border-radius: 4px;
+  position: relative;
 }
 
 #payrails-popup-background {
@@ -107,6 +108,41 @@
   align-content: center;
 }
 
+#payrails-popup-cancel-button {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  width: 32px;
+  height: 32px;
+  background: none;
+  border: none;
+  cursor: pointer;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  transition: background-color 0.2s ease;
+}
+
+#payrails-popup-cancel-button::before,
+#payrails-popup-cancel-button::after {
+  content: '';
+  position: absolute;
+  width: 14px;
+  height: 2px;
+  transition: background-color 0.2s ease;
+  background-color: #667da6;
+}
+
+#payrails-popup-cancel-button::before {
+  transform: rotate(45deg);
+}
+
+#payrails-popup-cancel-button::after {
+  transform: rotate(-45deg);
+}
+
 #payrails-frame {
   border: 0;
 }

package/payrails.d.ts

@@ -518,6 +518,7 @@ interface Mountable {
 }
 interface ElementOptions {
     id?: string;
+    dataTestId?: string;
     className?: string | string[];
     styles?: Partial<CSSStyleDeclaration>;
 }
@@ -525,8 +526,9 @@ declare class PayrailsElement implements Mountable {
     protected element: HTMLElement;
     protected subElements: Array<Mountable>;
     readonly id: string | undefined;
+    readonly dataTestId: string | undefined;
     protected eventBus: _payrails_iframe_event_bus.IframeEventBus;
-    constructor(elementType: string, { id, className }?: ElementOptions);
+    constructor(elementType: string, { id, className, dataTestId }?: ElementOptions);
     get parentElement(): HTMLElement | null;
     get selector(): string;
     mount(location: string): void;
@@ -677,6 +679,7 @@ declare const regexes: {
     hipercard: RegExp;
     unionpay: RegExp;
     maestro: RegExp;
+    elo: RegExp;
 };
 type CardNetwork = keyof typeof regexes;
 
@@ -833,7 +836,7 @@ declare class CardForm extends PayrailsElementWithStoreInstrumentCheckbox {
         errors: string;
     }>;
     get isValid(): boolean;
-    get cardNetwork(): "" | "visa" | "mastercard" | "amex" | "diners" | "discover" | "jcb" | "hipercard" | "unionpay" | "maestro";
+    get cardNetwork(): "" | "visa" | "mastercard" | "amex" | "diners" | "discover" | "jcb" | "hipercard" | "unionpay" | "maestro" | "elo";
     onChange(): void;
     private updateInstallments;
     private reset;
@@ -969,7 +972,8 @@ declare enum AuthorizationFailureReasons {
     VALIDATION_FAILED = "VALIDATION_FAILED",
     AUTHORIZATION_ERROR = "AUTHORIZATION_ERROR",
     AUTHENTICATION_ERROR = "AUTHENTICATION_ERROR",
-    UNKNOWN_ERROR = "UNKNOWN_ERROR"
+    UNKNOWN_ERROR = "UNKNOWN_ERROR",
+    USER_CANCELLED = "USER_CANCELLED"
 }
 
 interface AuthFailedMsgOptions {
@@ -1009,9 +1013,10 @@ interface GooglePayButtonOptions extends StoreInstrumentElementOptions {
 }
 declare class GooglePayButton extends PayrailsElementWithStoreInstrumentCheckbox {
     protected options: GooglePayButtonOptions;
-    private static instance;
     private readonly paymentExecutor;
     private static googleSDKClient;
+    private sdkLoadedCalled;
+    private buttonElement;
     private static getSDKClient;
     static isGooglePayAvailable(allowedPaymentMethods: google.payments.api.IsReadyToPayPaymentMethodSpecification[], environment?: PayrailsEnvironment, merchantInfo?: google.payments.api.MerchantInfo): Promise<boolean>;
     constructor(options: GooglePayButtonOptions);
@@ -1227,6 +1232,7 @@ interface DropinOptions {
         [key: string]: any;
         mercadoPago?: GenericRedirectDropinOptions['config'];
         preselectFirstPaymentOption?: boolean;
+        showPaymentMethodLogo?: boolean;
         cards?: {
             showCardHolderName?: boolean;
             showExistingCards?: boolean;