@payrails/web-sdk 5.29.1-rc.1 → 5.29.2

package/package.json

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

package/payrails-styles.css

@@ -683,6 +683,83 @@
   }
 }
 
+button.payrails-generic-button {
+  border: none;
+  outline: none;
+  box-shadow: none;
+  margin: 0;
+}
+
+.payrails-generic-button * {
+  box-sizing: border-box;
+}
+
+.payrails-generic-button .dot-flashing-container {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+}
+
+.payrails-generic-button .dot-flashing-text {
+  visibility: hidden;
+}
+
+.payrails-generic-button .dot-flashing {
+  position: absolute;
+  left: auto;
+  right: auto;
+  width: 10px;
+  height: 10px;
+  border-radius: 5px;
+  background-color: currentColor;
+  color: currentColor;
+  animation: dot-flashing 1s infinite linear alternate;
+  animation-delay: 0.5s;
+}
+.payrails-generic-button .dot-flashing::before,
+.payrails-generic-button .dot-flashing::after {
+  content: '';
+  display: inline-block;
+  position: absolute;
+  top: 0;
+}
+.payrails-generic-button .dot-flashing::before {
+  left: -15px;
+  width: 10px;
+  height: 10px;
+  border-radius: 5px;
+  background-color: currentColor;
+  color: currentColor;
+  animation: dot-flashing 1s infinite alternate;
+  animation-delay: 0s;
+}
+.payrails-generic-button .dot-flashing::after {
+  left: 15px;
+  width: 10px;
+  height: 10px;
+  border-radius: 5px;
+  background-color: currentColor;
+  color: currentColor;
+  animation: dot-flashing 1s infinite alternate;
+  animation-delay: 1s;
+}
+
+@keyframes dot-flashing {
+  0% {
+    opacity: 1;
+  }
+  50%,
+  100% {
+    opacity: 0.2;
+  }
+}
+
+#payrails-paypal-button-wrapper {
+  min-height: 44px;
+}
+
 .payrails-dynamic-element-form {
   display: flex;
   flex-direction: column;
@@ -803,83 +880,6 @@
   color: unset;
 }
 
-button.payrails-generic-button {
-  border: none;
-  outline: none;
-  box-shadow: none;
-  margin: 0;
-}
-
-.payrails-generic-button * {
-  box-sizing: border-box;
-}
-
-.payrails-generic-button .dot-flashing-container {
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  position: relative;
-}
-
-.payrails-generic-button .dot-flashing-text {
-  visibility: hidden;
-}
-
-.payrails-generic-button .dot-flashing {
-  position: absolute;
-  left: auto;
-  right: auto;
-  width: 10px;
-  height: 10px;
-  border-radius: 5px;
-  background-color: currentColor;
-  color: currentColor;
-  animation: dot-flashing 1s infinite linear alternate;
-  animation-delay: 0.5s;
-}
-.payrails-generic-button .dot-flashing::before,
-.payrails-generic-button .dot-flashing::after {
-  content: '';
-  display: inline-block;
-  position: absolute;
-  top: 0;
-}
-.payrails-generic-button .dot-flashing::before {
-  left: -15px;
-  width: 10px;
-  height: 10px;
-  border-radius: 5px;
-  background-color: currentColor;
-  color: currentColor;
-  animation: dot-flashing 1s infinite alternate;
-  animation-delay: 0s;
-}
-.payrails-generic-button .dot-flashing::after {
-  left: 15px;
-  width: 10px;
-  height: 10px;
-  border-radius: 5px;
-  background-color: currentColor;
-  color: currentColor;
-  animation: dot-flashing 1s infinite alternate;
-  animation-delay: 1s;
-}
-
-@keyframes dot-flashing {
-  0% {
-    opacity: 1;
-  }
-  50%,
-  100% {
-    opacity: 0.2;
-  }
-}
-
-#payrails-paypal-button-wrapper {
-  min-height: 44px;
-}
-
 .payrails-container-wrapper {
   width: 100%;
   min-height: 90px;

package/payrails.d.ts

@@ -2,6 +2,8 @@ import * as _payrails_iframe_event_bus from '@payrails/iframe-event-bus';
 import { LogLevel as LogLevel$1 } from '@payrails/logger';
 import { FraudProvider } from '@payrails/fraud-sdk';
 
+declare const UI_POSITION_FIELD = "ui:position";
+
 type JSONSchemaType = JSONSchemaProperty & {
     required?: string[];
     dependentSchemas?: Record<string, JSONSchemaDependentSchema>;
@@ -23,6 +25,7 @@ interface JSONSchemaProperty {
     maxLength?: number;
     errorMessage?: Record<string, string>;
     $ref?: string;
+    [UI_POSITION_FIELD]?: number;
     properties?: Record<string, JSONSchemaType>;
 }
 interface JSONSchemaOneOfOption {
@@ -33,6 +36,10 @@ interface JSONSchemaOneOfOption {
     const: string | number;
     title: string;
 }
+interface DynamicElementEvents {
+    onReady: () => void;
+    onValidationChange: (isValid: boolean) => void;
+}
 interface DynamicElementFieldTranslation {
     label?: string;
     placeholder?: string;
@@ -46,9 +53,6 @@ interface DynamicElementErrorTranslation {
     oneOf: string;
 }
 type DynamicElementTranslations = {
-    labels?: {
-        submitButton?: string;
-    };
     fields?: Record<string, DynamicElementFieldTranslation>;
     errors?: Partial<DynamicElementErrorTranslation>;
 };
@@ -103,14 +107,20 @@ declare class WorkflowExecution {
     private static _response;
     static get response(): WorkflowExecutionResponse;
     static setResponse(response: WorkflowExecutionResponse): typeof WorkflowExecution;
+    static get workflowCode(): string;
     static get lookup(): {
         httpCode: number;
         body: {
             data: {
-                paymentCompositionOptions: Array<StorablePaymentCompositionOption>;
+                paymentCompositionOptions?: Array<StorablePaymentCompositionOption>;
+                payoutCompositionOptions?: Array<StorablePaymentCompositionOption>;
             };
             links: {
-                authorize: {
+                authorize?: {
+                    href: string;
+                    method: "POST";
+                };
+                payout?: {
                     href: string;
                     method: "POST";
                 };
@@ -133,6 +143,7 @@ declare class WorkflowExecution {
         countryCode: string;
         merchantCapabilities: ApplePayJS.ApplePayMerchantCapability[];
         requiredBillingContactFields?: ApplePayJS.ApplePayContactField[];
+        requiredShippingContactFields?: ApplePayJS.ApplePayContactField[];
     };
     static get url(): string;
     static get meta(): {
@@ -151,6 +162,7 @@ declare class WorkflowExecution {
     };
     static get availablePaymentMethods(): StorablePaymentCompositionOption<CardMetadata | PayPalMetadata, ApplePayConfig | PayPalConfig | GooglePayConfig | undefined>[];
     static get authorizeLink(): string | undefined;
+    static get payoutLink(): string | undefined;
     static get createSessionLink(): string | undefined;
     static get storedPaymentInstruments(): StoredPaymentInstrument<PayPalMetadata & CardMetadata>[];
     static get storedDropinInstruments(): StoredPaymentInstrument<PayPalMetadata & CardMetadata>[];
@@ -172,8 +184,11 @@ declare class WorkflowExecution {
             supportsBillingInfo?: boolean;
             schema?: JSONSchemaType;
             additionalConfig?: any;
+            instrumentDataSchema?: JSONSchemaType;
         };
+        payoutInstruments?: StoredPaymentInstrument<CardMetadata | PayPalMetadata>[] | undefined;
         paymentMethodCode: PAYMENT_METHOD_CODES;
+        payoutMethodCode?: PAYMENT_METHOD_CODES;
     } | undefined;
     static getPaymentMethodConfig(paymentMethod: StorablePaymentCompositionOption): {
         id: string;
@@ -188,14 +203,18 @@ declare class WorkflowExecution {
             supportsBillingInfo?: boolean;
             schema?: JSONSchemaType;
             additionalConfig?: any;
+            instrumentDataSchema?: JSONSchemaType;
         };
+        payoutInstruments?: StoredPaymentInstrument<CardMetadata | PayPalMetadata>[] | undefined;
         paymentMethodCode: PAYMENT_METHOD_CODES;
+        payoutMethodCode?: PAYMENT_METHOD_CODES;
     };
 }
 interface WorkflowExecutionResponse {
     id: string;
     merchantReference: string;
     holderReference: string;
+    holderId?: string;
     actionRequired?: string;
     meta: {
         customer?: {
@@ -219,10 +238,15 @@ interface WorkflowExecutionResponse {
         httpCode: number;
         body: {
             data: {
-                paymentCompositionOptions: Array<StorablePaymentCompositionOption>;
+                paymentCompositionOptions?: Array<StorablePaymentCompositionOption>;
+                payoutCompositionOptions?: Array<StorablePaymentCompositionOption>;
             };
             links: {
-                authorize: {
+                authorize?: {
+                    href: string;
+                    method: 'POST';
+                };
+                payout?: {
                     href: string;
                     method: 'POST';
                 };
@@ -256,6 +280,7 @@ interface WorkflowExecutionResponse {
 }
 interface BasePaymentMethodConfig {
     paymentMethodCode: PAYMENT_METHOD_CODES;
+    payoutMethodCode?: PAYMENT_METHOD_CODES;
 }
 interface BaseInstallmentOption {
     count: number;
@@ -277,8 +302,10 @@ interface StorablePaymentCompositionOption<I = CardMetadata | PayPalMetadata, C
         supportsBillingInfo?: boolean;
         schema?: JSONSchemaType;
         additionalConfig?: any;
+        instrumentDataSchema?: JSONSchemaType;
     };
     paymentInstruments?: Array<StoredPaymentInstrument<I>>;
+    payoutInstruments?: Array<StoredPaymentInstrument<I>>;
 }
 interface GooglePayConfig {
     parameters: {
@@ -313,10 +340,11 @@ interface ApplePayConfig {
         countryCode: string;
         merchantCapabilities: ApplePayJS.ApplePayMerchantCapability[];
         requiredBillingContactFields?: ApplePayJS.ApplePayContactField[];
+        requiredShippingContactFields?: ApplePayJS.ApplePayContactField[];
     };
     type: string;
 }
-interface StoredPaymentInstrument<T = CardMetadata | PayPalMetadata> {
+interface StoredPaymentInstrument<T = CardMetadata | PayPalMetadata | BankAccountMetadata> {
     id: string;
     status: PAYMENT_INSTRUMENT_STATUS;
     paymentMethod: PAYMENT_METHOD_CODES;
@@ -326,18 +354,61 @@ interface StoredPaymentInstrument<T = CardMetadata | PayPalMetadata> {
 interface PayPalMetadata {
     email?: string;
 }
+interface Country {
+    code: string;
+    name: string;
+    iso3: string;
+}
 interface CardMetadata {
     bin?: string;
     suffix?: string;
     network?: string;
     binLookup?: {
-        issuerCountry: {
-            code: string;
-            name: string;
-            iso3: string;
-        };
+        issuerCountry: Country;
     };
 }
+interface BankAccountMetadata {
+    bankAccount: {
+        holder: HolderData;
+        bank: BankData;
+        account: AccountData;
+    };
+}
+interface HolderData {
+    firstName?: string;
+    lastName?: string;
+    companyName?: string;
+    address?: Address;
+    email?: string;
+    dob?: string;
+    country?: Country;
+    city?: string;
+    type: HolderType;
+}
+type HolderType = 'individual' | 'corporate';
+interface BankData {
+    name?: string;
+    branchCode?: string;
+    code?: string;
+    address?: Address;
+    swiftCode?: string;
+}
+interface AccountData {
+    number?: string;
+    iban?: string;
+    currency?: string;
+    type?: AccountType;
+    country?: Country;
+}
+type AccountType = 'savings' | 'current';
+interface Address {
+    country?: {
+        code?: string;
+        fullName?: string;
+        iso3?: string;
+    };
+    postalCode?: string;
+}
 declare enum PAYMENT_CLIENT_FLOW {
     'REDIRECT' = "redirect",
     'DIRECT' = "direct",
@@ -737,7 +808,7 @@ interface TokenizeOptions {
     storeInstrument?: boolean;
 }
 declare abstract class Tokenizable extends PayrailsElement {
-    abstract collect(): Promise<any>;
+    protected abstract collect(): Promise<any>;
     protected abstract constructSaveInstrumentBody(tokens: any, opts?: TokenizeOptions): Promise<any>;
     tokenize(_opts?: TokenizeOptions): Promise<any>;
 }
@@ -1026,12 +1097,14 @@ declare class CardForm extends PayrailsElementWithStoreInstrumentCheckbox {
     private lastBinLookup;
     private defaultStyles;
     private defaultTranslations;
+    private eventsRef?;
     constructor(collectContainer: PayrailsCollectContainer, options?: CardFormOptions | undefined);
     private initializeFormFields;
     getErrorTextStyles(errorTextStyles: any): any;
     private updateStyles;
     private updateTranslations;
-    update(options: Partial<Pick<CardFormOptions, 'styles' | 'translations'>>): void;
+    private updateEvents;
+    update(options: Partial<Pick<CardFormOptions, 'styles' | 'translations' | 'events'>>): void;
     private createFormField;
     private initializeCustomLayout;
     private hasFieldBeenUsed;
@@ -1094,13 +1167,6 @@ declare class CardList extends PayrailsElement {
     reset(): void;
 }
 
-declare enum RequestMethod {
-    GET = "GET",
-    POST = "POST",
-    DELETE = "DELETE",
-    PATCH = "PATCH"
-}
-
 interface SdkConfiguration {
     token: string;
     amount: PayrailsAmount;
@@ -1122,7 +1188,6 @@ interface SdkConfiguration {
         links: {
             saveInstrument: {
                 href: string;
-                method: RequestMethod;
             };
         };
     };
@@ -1152,6 +1217,25 @@ declare global {
         };
     }
 }
+interface PayoutResponse {
+    name: 'payout';
+    executedAt: string;
+    workspaceId: string;
+    actionId: string;
+    links: {
+        execution: string;
+    };
+}
+type PayoutComposition = Array<{
+    integrationType: string;
+    amount: PayrailsAmount;
+    paymentMethodCode: PAYMENT_METHOD_CODES;
+    paymentInstrumentId?: string;
+}>;
+interface PayoutReqBody {
+    amount: PayrailsAmount;
+    payoutComposition: PayoutComposition;
+}
 type ERROR_RESULT = 'Unknown' | 'UnexpectedProviderResponse' | 'ProviderUnknownError' | 'ProviderConnectionError' | 'Timeout' | 'ProviderTimeout' | 'GenericRejection' | 'DuplicateOperation' | 'OperationNotAllowed' | 'NetworkTransactionReferenceRejected' | 'PayerCanceled' | 'LimitExceeded' | 'InstrumentNotAllowed' | 'InvalidInstrument' | 'InsufficientBalance' | 'BlockedInstrument' | 'ExpiredInstrument' | 'ValidationError' | 'ParamsError' | 'ProviderConfigError' | 'InvalidSignature' | 'InternalServerError' | 'AuthenticationError' | 'PaymentMethodNotSupported' | 'PayerAuthenticationRequired' | 'PayerAuthenticationFailed' | 'FraudRisk';
 
 interface CardPaymentButtonOptions {
@@ -1195,7 +1279,8 @@ declare class CardPaymentButton extends PayrailsElement {
     private constructEncryptedPayment;
     private updateStyles;
     private updateTranslations;
-    update(options: Partial<Pick<CardPaymentButtonOptions, 'styles' | 'translations'>>): void;
+    private updateEvents;
+    update(options: Partial<Pick<CardPaymentButtonOptions, 'styles' | 'translations' | 'events'>>): void;
     private handleAuthorizationResult;
 }
 declare enum AuthorizationFailureReasons {
@@ -1332,9 +1417,11 @@ declare class GenericRedirectButton extends PayrailsElement {
     private redirectToPaymentLink;
     private updateStyles;
     private updateTranslations;
+    private updateEvents;
     update(options: {
         styles?: ButtonOptions['styles'];
         translations?: ButtonOptions['translations'];
+        events?: ButtonOptions['events'];
     }): void;
 }
 
@@ -1443,7 +1530,6 @@ declare class Dropin extends PayrailsElement {
     private loadingScreen;
     constructor(collectContainer: PayrailsCollectContainer, clientConfig: PayrailsClientOptions, dropinConfig: DropinOptions);
     private isHppIntegration;
-    private isEmbeddedElement;
     private createStoredInstrumentElement;
     private createInstallmentsDropdown;
     private getInstallmentOptionsForInstrument;
@@ -1455,7 +1541,6 @@ declare class Dropin extends PayrailsElement {
     private createCardForm;
     private createApplePayButton;
     private createCardPaymentButton;
-    private createEmbeddedElement;
     private onAuthorizeSuccess;
     private getElementEvents;
     private onAuthorizePending;
@@ -1538,8 +1623,8 @@ interface ContainerStyles {
 interface DynamicElementOptions {
     styles?: DynamicElementStyles;
     translations?: DynamicElementTranslations;
-    events?: PaymentEvents;
     paymentMethod: BasePaymentMethodConfig;
+    events?: DynamicElementEvents;
 }
 interface FormConfig {
     schema: JSONSchemaType;
@@ -1551,10 +1636,13 @@ declare class DynamicElementForm extends Tokenizable {
     private formFields;
     private formData;
     private __schema;
+    private _previousFormValidState;
     constructor(options: DynamicElementOptions, formConfig: FormConfig, returnInfo?: ReturnInfo | undefined);
-    collect(): Promise<Record<string, any>>;
+    protected collect(): Promise<Record<string, any>>;
     protected constructSaveInstrumentBody(tokens: any, opts?: TokenizeOptions): Promise<any>;
     private isFormValid;
+    private isFormValidSilent;
+    private checkAndTriggerValidationChange;
     mount(location: string): Promise<void>;
     private makeForm;
     private createField;
@@ -1567,9 +1655,17 @@ declare class DynamicElementForm extends Tokenizable {
     private evaluateDependencies;
 }
 
+declare enum RequestMethod {
+    GET = "GET",
+    POST = "POST",
+    DELETE = "DELETE",
+    PATCH = "PATCH"
+}
+
 type Operations = {
     deleteInstrument: OperationConfig<void, DeleteInstrumentResponse>;
     updateInstrument: OperationConfig<UpdateInstrumentBody, UpdateInstrumentResponse>;
+    payout: OperationConfig<PayoutReqBody, PayoutResponse>;
 };
 interface UpdateInstrumentBody {
     status?: 'enabled' | 'disabled';
@@ -1615,10 +1711,13 @@ type RequestCreator<TReq, TOperation extends keyof Operations> = (config: ApiCon
     url: string;
     body?: TReq;
 };
+type LinkKey = keyof NonNullable<SdkConfiguration['links']> | 'payout';
 interface OperationConfig<TReq, TRes> {
-    linkKey: keyof NonNullable<SdkConfiguration['links']>;
+    linkKey: LinkKey;
     method: RequestMethod;
     createRequest: RequestCreator<TReq, keyof Operations>;
+    onSuccess?: (response: TRes) => Promise<any>;
+    onError?: (error: Error) => Promise<any>;
     requestType: TReq;
     responseType: TRes;
 }
@@ -1671,6 +1770,10 @@ interface InitOptions {
     data: string;
 }
 
+interface PublicSharedState {
+    instrument: StoredPaymentInstrument | null;
+}
+
 interface PayrailsClientOptions {
     environment?: PayrailsEnvironment;
     events?: ClientEvents;
@@ -1692,6 +1795,7 @@ declare class Payrails {
     private __genericRedirectButton;
     private __dynamicElementForm;
     private __dropin;
+    private __sharedState;
     static preloadCardForm: typeof SdkLoader.preloadCardForm;
     static init(initResponse: InitOptions, options?: PayrailsClientOptions): Payrails;
     update(amount: PayrailsAmount): void;
@@ -1700,6 +1804,7 @@ declare class Payrails {
     isGooglePayAvailable(merchantInfo: google.payments.api.MerchantInfo): Promise<boolean>;
     applePayButton(options: ApplePayButtonOptions): ApplePayButton;
     isApplePayAvailable(): Promise<boolean>;
+    setState({ instrument }: PublicSharedState): void;
     cardList(options?: CardListOptions): CardList;
     cardForm(options?: CardFormOptions): CardForm;
     dropin(options: DropinOptions): Dropin;
@@ -1711,6 +1816,7 @@ declare class Payrails {
         operation: TOperation;
     }): Promise<Operations[TOperation]['responseType']>;
     getStoredInstruments(): StoredPaymentInstrument<PayPalMetadata & CardMetadata>[];
+    getStoredInstrumentsByPaymentMethod(paymentMethod: PAYMENT_METHOD_CODES): StoredPaymentInstrument<PayPalMetadata & CardMetadata>[];
     getAvailablePaymentMethods(): PAYMENT_METHOD_CODES[];
     paymentButton(options: CardPaymentButtonOptions): CardPaymentButton;
     paypalButton(options?: PaypalButtonOptions): PaypalButton;