@primer-io/react-native 2.21.0 → 2.22.0

package/src/HeadlessUniversalCheckout/Managers/PaymentMethodManagers/ComponentWithRedirectManager.ts

@@ -0,0 +1,161 @@
+import {
+  NativeEventEmitter,
+  NativeModules,
+  EmitterSubscription,
+} from 'react-native';
+import { BanksValidatableData } from 'src/models/banks/BanksCollectableData';
+import { NamedComponentStep } from 'src/models/NamedComponentStep';
+import { IssuingBank } from 'src/models/IssuingBank';
+import { PrimerComponentDataValidationError, PrimerInvalidComponentData, PrimerValidComponentData, PrimerValidatingComponentData } from 'src/models/PrimerComponentDataValidation';
+import { PrimerError } from 'src/models/PrimerError';
+import { BanksStep } from 'src/models/banks/BanksSteps';
+import { EventType, eventTypes } from './Utils/EventType';
+
+const { RNTPrimerHeadlessUniversalCheckoutBanksComponent } =
+  NativeModules;
+
+const eventEmitter = new NativeEventEmitter(
+  RNTPrimerHeadlessUniversalCheckoutBanksComponent
+);
+
+export interface ComponentWithRedirectManagerProps {
+  paymentMethodType: string;
+  onStep?: (data: BanksStep) => void;
+  onError?: (error: PrimerError) => void;
+  onInvalid?: (data: PrimerInvalidComponentData<BanksValidatableData>) => void;
+  onValid?: (data: PrimerValidComponentData<BanksValidatableData>) => void;
+  onValidating?: (data: PrimerValidatingComponentData<BanksValidatableData>) => void;
+  onValidationError?: (data: PrimerComponentDataValidationError<BanksValidatableData>) => void;
+}
+
+export interface BanksComponent {
+  /**
+   * Starts the component, causing step emissions. 
+   * First, with a {@link NamedComponentStep} instance  where 
+   * {@link NamedComponentStep.name} has a value of 'loading', followed 
+   * by another emission that contains the list of banks in the form of an 
+   * {@link IssuingBank} array.
+   */
+  start(): Promise<void>;
+
+  /**
+   * Selects the bank with the given {@link bankId}, triggering the
+   * validation flow.
+   * @param bankId The id of the selected bank.
+   */
+  onBankSelected(bankId: string): Promise<void>;
+
+  /**
+   * Filters down the bank list with the given {@link filter}, triggering
+   * the validation flow and a new step emission that contains the filtered
+   * list of banks in the form of an {@link IssuingBank} array.
+   * @param filter The text to filter the bank list by.
+   */
+  onBankFilterChange(filter: string): Promise<void>;
+
+  /**
+   * Submits the component, triggering tokenization and a redirect to the 
+   * bank's page for finalizing the payment. This function should only be 
+   * called after selecting a bank via {@link onBankSelected}.
+   */
+  submit(): Promise<void>;
+}
+
+export class PrimerHeadlessUniversalCheckoutComponentWithRedirectManager {
+  ///////////////////////////////////////////
+  // Init
+  ///////////////////////////////////////////
+  constructor() { }
+
+  ///////////////////////////////////////////
+  // API
+  ///////////////////////////////////////////
+
+  async provide(props: ComponentWithRedirectManagerProps): Promise<BanksComponent | any> {
+    await this.configureListeners(props);
+
+    if (props.paymentMethodType == "ADYEN_IDEAL") {
+      const banksComponent: BanksComponent = {
+        start: async () => {
+          RNTPrimerHeadlessUniversalCheckoutBanksComponent.start();
+        },
+        submit: async () => {
+          RNTPrimerHeadlessUniversalCheckoutBanksComponent.submit();
+        },
+        onBankFilterChange: async (filter: String) => {
+          RNTPrimerHeadlessUniversalCheckoutBanksComponent.onBankFilterChange(filter);
+        },
+        onBankSelected: async (bankId: String) => {
+          RNTPrimerHeadlessUniversalCheckoutBanksComponent.onBankSelected(bankId);
+        },
+      }
+      await RNTPrimerHeadlessUniversalCheckoutBanksComponent.configure(props.paymentMethodType);
+      return banksComponent;
+    } else {
+      return null;
+    }
+  }
+
+  private async configureListeners(props: ComponentWithRedirectManagerProps): Promise<void> {
+    if (props?.onStep) {
+      this.addListener('onStep', (data) => {
+        props.onStep?.(data);
+      });
+    }
+
+    if (props?.onInvalid) {
+      this.addListener('onInvalid', (data) => {
+        props.onInvalid?.(data);
+      });
+    }
+
+    if (props?.onError) {
+      this.addListener('onError', (data) => {
+        props.onError?.(data);
+      });
+    }
+
+    if (props?.onValid) {
+      this.addListener('onValid', (data) => {
+        props.onValid?.(data);
+      });
+    }
+
+    if (props?.onValidating) {
+      this.addListener('onValidating', (data) => {
+        props.onValidating?.(data);
+      });
+    }
+
+    if (props?.onValidationError) {
+      this.addListener('onValidationError', (data) => {
+        props.onValidationError?.(data);
+      });
+    }
+  }
+
+  ///////////////////////////////////////////
+  // HELPERS
+  ///////////////////////////////////////////
+
+  async addListener(
+    eventType: EventType,
+    listener: (...args: any[]) => any
+  ): Promise<EmitterSubscription> {
+    return eventEmitter.addListener(eventType, listener);
+  }
+
+  removeListener(subscription: EmitterSubscription): void {
+    return subscription.remove();
+  }
+
+  removeAllListenersForEvent(eventType: EventType) {
+    eventEmitter.removeAllListeners(eventType);
+  }
+
+  removeAllListeners() {
+    eventTypes.forEach((eventType) =>
+      this.removeAllListenersForEvent(eventType)
+    );
+  }
+}

package/src/HeadlessUniversalCheckout/Managers/PaymentMethodManagers/KlarnaManager.ts

@@ -0,0 +1,147 @@
+import {
+    NativeEventEmitter,
+    NativeModules,
+    EmitterSubscription,
+} from 'react-native';
+import { PrimerComponentDataValidationError, PrimerInvalidComponentData, PrimerValidComponentData, PrimerValidatingComponentData } from 'src/models/PrimerComponentDataValidation';
+import { PrimerError } from 'src/models/PrimerError';
+import { KlarnaPaymentOptions, KlarnaPaymentValidatableData } from 'src/models/klarna/KlarnaPaymentCollectableData';
+import { KlarnaPaymentStep, PaymentSessionCreated } from 'src/models/klarna/KlarnaPaymentSteps';
+import { EventType, eventTypes } from './Utils/EventType';
+import { PrimerSessionIntent } from 'src/models/PrimerSessionIntent';
+
+const { RNTPrimerHeadlessUniversalCheckoutKlarnaComponent } = NativeModules;
+
+const eventEmitter = new NativeEventEmitter(RNTPrimerHeadlessUniversalCheckoutKlarnaComponent);
+export interface KlarnaManagerProps {
+    primerSessionIntent: PrimerSessionIntent;
+    onStep?: (data: KlarnaPaymentStep) => void;
+    onError?: (error: PrimerError) => void;
+    onInvalid?: (data: PrimerInvalidComponentData<KlarnaPaymentValidatableData>) => void;
+    onValid?: (data: PrimerValidComponentData<KlarnaPaymentValidatableData>) => void;
+    onValidating?: (data: PrimerValidatingComponentData<KlarnaPaymentValidatableData>) => void;
+    onValidationError?: (data: PrimerComponentDataValidationError<KlarnaPaymentValidatableData>) => void;
+}
+
+export interface KlarnaComponent {
+    /**
+     * Starts the component, causing the {@link PaymentSessionCreated} step
+     * to be emitted.
+     */
+    start(): Promise<void>;
+
+    /**
+     * Sets the options to use when initializing the Klarna payment view, 
+     * triggering the validation flow.
+     * @param paymentOptions The options to use when initializing the Klarna 
+     * payment view.
+     */
+    onSetPaymentOptions(paymentOptions: KlarnaPaymentOptions): Promise<void>;
+
+    /**
+     * Finalizes the payment.
+     */
+    onFinalizePayment(): Promise<void>;
+
+    /**
+     * Submits the component, initiating the payment authorization process. 
+     * This function should only be called after setting the payment options 
+     * {@link onSetPaymentOptions}.
+     */
+    submit(): Promise<void>;
+}
+
+export class PrimerHeadlessUniversalCheckoutKlarnaManager {
+    ///////////////////////////////////////////
+    // Init
+    ///////////////////////////////////////////
+    constructor() { }
+
+    ///////////////////////////////////////////
+    // API
+    ///////////////////////////////////////////
+
+    async provide(props: KlarnaManagerProps): Promise<KlarnaComponent> {
+        await this.configureListeners(props);
+
+        const klarnaComponent: KlarnaComponent = {
+            start: async () => {
+                RNTPrimerHeadlessUniversalCheckoutKlarnaComponent.start();
+            },
+            submit: async () => {
+                RNTPrimerHeadlessUniversalCheckoutKlarnaComponent.submit();
+            },
+            onSetPaymentOptions: async (paymentOptions: KlarnaPaymentOptions) => {
+                RNTPrimerHeadlessUniversalCheckoutKlarnaComponent.onSetPaymentOptions(paymentOptions);
+            },
+            onFinalizePayment: async () => {
+                RNTPrimerHeadlessUniversalCheckoutKlarnaComponent.onFinalizePayment();
+            },
+        }
+        await RNTPrimerHeadlessUniversalCheckoutKlarnaComponent.configure(props.primerSessionIntent);
+        return klarnaComponent;
+    }
+
+    private async configureListeners(props: KlarnaManagerProps): Promise<void> {
+        if (props?.onStep) {
+            this.addListener('onStep', (data) => {
+                props.onStep?.(data);
+            });
+        }
+
+        if (props?.onInvalid) {
+            this.addListener('onInvalid', (data) => {
+                props.onInvalid?.(data);
+            });
+        }
+
+        if (props?.onError) {
+            this.addListener('onError', (data) => {
+                props.onError?.(data);
+            });
+        }
+
+        if (props?.onValid) {
+            this.addListener('onValid', (data) => {
+                props.onValid?.(data);
+            });
+        }
+
+        if (props?.onValidating) {
+            this.addListener('onValidating', (data) => {
+                props.onValidating?.(data);
+            });
+        }
+
+        if (props?.onValidationError) {
+            this.addListener('onValidationError', (data) => {
+                props.onValidationError?.(data);
+            });
+        }
+    }
+
+    ///////////////////////////////////////////
+    // HELPERS
+    ///////////////////////////////////////////
+
+    async addListener(
+        eventType: EventType,
+        listener: (...args: any[]) => any
+    ): Promise<EmitterSubscription> {
+        return eventEmitter.addListener(eventType, listener);
+    }
+
+    removeListener(subscription: EmitterSubscription): void {
+        return subscription.remove();
+    }
+
+    removeAllListenersForEvent(eventType: EventType) {
+        eventEmitter.removeAllListeners(eventType);
+    }
+
+    removeAllListeners() {
+        eventTypes.forEach((eventType) =>
+            this.removeAllListenersForEvent(eventType)
+        );
+    }
+}

package/src/HeadlessUniversalCheckout/Managers/PaymentMethodManagers/RawDataManager.ts

@@ -86,7 +86,7 @@ class PrimerHeadlessUniversalCheckoutRawDataManager {
                     reject(err);
                 }
             } else {
-                const err = new PrimerError("manager-not-configured", "HeadlessUniversalCheckoutRawDataManager has not been configured", "Call HeadlessUniversalCheckoutRawDataManager.configure before calling this function.", undefined);
+                const err = new PrimerError("manager-not-configured", undefined, "HeadlessUniversalCheckoutRawDataManager has not been configured", "Call HeadlessUniversalCheckoutRawDataManager.configure before calling this function.", undefined);
                 reject(err);
             }
         });
@@ -102,7 +102,7 @@ class PrimerHeadlessUniversalCheckoutRawDataManager {
                     reject(err);
                 }
             } else {
-                const err = new PrimerError("manager-not-configured", "HeadlessUniversalCheckoutRawDataManager has not been configured", "Call HeadlessUniversalCheckoutRawDataManager.configure before calling this function.", undefined);
+                const err = new PrimerError("manager-not-configured", undefined, "HeadlessUniversalCheckoutRawDataManager has not been configured", "Call HeadlessUniversalCheckoutRawDataManager.configure before calling this function.", undefined);
                 reject(err);
             }
         });
@@ -118,7 +118,7 @@ class PrimerHeadlessUniversalCheckoutRawDataManager {
                     reject(err);
                 }
             } else {
-                const err = new PrimerError("manager-not-configured", "HeadlessUniversalCheckoutRawDataManager has not been configured", "Call HeadlessUniversalCheckoutRawDataManager.configure before calling this function.", undefined);
+                const err = new PrimerError("manager-not-configured", undefined, "HeadlessUniversalCheckoutRawDataManager has not been configured", "Call HeadlessUniversalCheckoutRawDataManager.configure before calling this function.", undefined);
                 reject(err);
             }
         });
@@ -134,7 +134,7 @@ class PrimerHeadlessUniversalCheckoutRawDataManager {
                     reject(err);
                 }
             } else {
-                const err = new PrimerError("manager-not-configured", "HeadlessUniversalCheckoutRawDataManager has not been configured", "Call HeadlessUniversalCheckoutRawDataManager.configure before calling this function.", undefined);
+                const err = new PrimerError("manager-not-configured", undefined, "HeadlessUniversalCheckoutRawDataManager has not been configured", "Call HeadlessUniversalCheckoutRawDataManager.configure before calling this function.", undefined);
                 reject(err);
             }
         });

package/src/HeadlessUniversalCheckout/Managers/PaymentMethodManagers/Utils/EventType.ts

@@ -0,0 +1,10 @@
+export type EventType = 'onStep' | 'onError' | 'onInvalid' | 'onValid' | 'onValidating' | 'onValidationError';
+
+export const eventTypes: EventType[] = [
+    'onStep',
+    'onError',
+    'onInvalid',
+    'onValid',
+    'onValidating',
+    'onValidationError'
+];

package/src/HeadlessUniversalCheckout/PrimerHeadlessUniversalCheckout.ts

@@ -266,10 +266,11 @@ async function configureListeners(): Promise<void> {
             if (primerSettings?.headlessUniversalCheckoutCallbacks?.onError) {
               if (data && data.error && data.error.errorId && primerSettings) {
                 const errorId: string = data.error.errorId;
+                const errorCode: string | undefined = data.error.errorCode;
                 const description: string | undefined = data.error.description;
                 const recoverySuggestion: string | undefined = data.error.recoverySuggestion;
                 const diagnosticsId: string | undefined = data.error.diagnosticsId;
-                const primerError = new PrimerError(errorId, description || 'Unknown error', recoverySuggestion, diagnosticsId);
+                const primerError = new PrimerError(errorId, errorCode, description || 'Unknown error', recoverySuggestion, diagnosticsId);
 
                 const checkoutData: PrimerCheckoutData = data.checkoutData;
                 primerSettings.headlessUniversalCheckoutCallbacks.onError(primerError, checkoutData);
@@ -316,7 +317,7 @@ class PrimerHeadlessUniversalCheckoutClass {
           const availablePaymentMethods: IPrimerHeadlessUniversalCheckoutPaymentMethod[] = res["availablePaymentMethods"];
           resolve(availablePaymentMethods);
         } else {
-          const err = new PrimerError("primer-rn-sdk", "Failed to find availablePaymentMethods", "Create another client session", undefined);
+          const err = new PrimerError("primer-rn-sdk", undefined, "Failed to find availablePaymentMethods", "Create another client session", undefined);
           reject(err);
         }
       } catch (err) {

package/src/Primer.ts

@@ -224,10 +224,11 @@ async function configureListeners(): Promise<void> {
         RNPrimer.addListener('onError', data => {
           if (data && data.error && data.error.errorId && primerSettings && primerSettings.onError) {
             const errorId: string = data.error.errorId;
+            const errorCode: string | undefined = data.error.errorCode;
             const description: string | undefined = data.error.description;
             const recoverySuggestion: string | undefined = data.error.recoverySuggestion;
             const diagnosticsId: string | undefined = data.error.diagnosticsId;
-            const primerError = new PrimerError(errorId, description || 'Unknown error', recoverySuggestion, diagnosticsId);
+            const primerError = new PrimerError(errorId, errorCode, description || 'Unknown error', recoverySuggestion, diagnosticsId);
             primerSettings.onError(primerError, data.checkoutData || null, errorHandler);
           }
         });

package/src/index.tsx

@@ -1,89 +1,89 @@
-export {
-    Primer
-} from './Primer';
-export {
-    PrimerSettings
-} from './models/PrimerSettings';
-export {
-    PrimerInputElementType as InputElementType
-} from './models/PrimerInputElementType';
-export {
-    PrimerSessionIntent as SessionIntent
-} from './models/PrimerSessionIntent';
-export {
-    PrimerPaymentCreationHandler as PaymentCreationHandler,
-    PrimerTokenizationHandler as TokenizationHandler,
-    PrimerResumeHandler as ResumeHandler,
-    PrimerErrorHandler as ErrorHandler,
+export { Primer } from './Primer';
+export { PrimerSettings } from './models/PrimerSettings';
+export { PrimerInputElementType as InputElementType } from './models/PrimerInputElementType';
+export { PrimerSessionIntent as SessionIntent } from './models/PrimerSessionIntent';
+export {
+  PrimerPaymentCreationHandler as PaymentCreationHandler,
+  PrimerTokenizationHandler as TokenizationHandler,
+  PrimerResumeHandler as ResumeHandler,
+  PrimerErrorHandler as ErrorHandler,
 } from './models/PrimerHandlers';
 export { PrimerPaymentMethodTokenData } from './models/PrimerPaymentMethodTokenData';
 export {
-    PrimerClientSession as ClientSession,
-    PrimerOrder as Order,
-    PrimerLineItem as LineItem,
-    PrimerCustomer as Customer,
-    PrimerAddress as Address,
+  PrimerClientSession as ClientSession,
+  PrimerOrder as Order,
+  PrimerLineItem as LineItem,
+  PrimerCustomer as Customer,
+  PrimerAddress as Address,
 } from './models/PrimerClientSession';
 export {
-    PrimerRawData as RawData,
-    PrimerCardData as CardData,
-    PrimerBancontactCardData as BancontactCardData,
-    PrimerPhoneNumberData as PhoneNumberData,
-    PrimerRetailerData as RetailerData
+  PrimerRawData as RawData,
+  PrimerCardData as CardData,
+  PrimerBancontactCardData as BancontactCardData,
+  PrimerPhoneNumberData as PhoneNumberData,
+  PrimerRetailerData as RetailerData,
 } from './models/PrimerRawData';
 export {
-    PrimerCheckoutAdditionalInfo as CheckoutAdditionalInfo,
-    MultibancoCheckoutAdditionalInfo
+  PrimerCheckoutAdditionalInfo as CheckoutAdditionalInfo,
+  MultibancoCheckoutAdditionalInfo,
 } from './models/PrimerCheckoutAdditionalInfo';
+export { RetailOutletsRetail } from './models/RetailOutletsRetail';
 export {
-    RetailOutletsRetail
-} from './models/RetailOutletsRetail';
-export {
-    PrimerCheckoutData as CheckoutData,
-    PrimerCheckoutDataPayment as CheckoutDataPayment,
+  PrimerCheckoutData as CheckoutData,
+  PrimerCheckoutDataPayment as CheckoutDataPayment,
 } from './models/PrimerCheckoutData';
-export {
-    PrimerCheckoutPaymentMethodData as CheckoutPaymentMethodData
-} from './models/PrimerCheckoutPaymentMethodData';
-export {
-    PrimerError
-} from './models/PrimerError';
-export type {
-    IPrimerAsset as Asset
-} from './models/PrimerAsset';
-export {
-    PrimerHeadlessUniversalCheckout as HeadlessUniversalCheckout
-} from './HeadlessUniversalCheckout/PrimerHeadlessUniversalCheckout';
-export type {
-    IPrimerHeadlessUniversalCheckoutPaymentMethod as PaymentMethod
-} from './models/PrimerHeadlessUniversalCheckoutPaymentMethod';
+export { PrimerCheckoutPaymentMethodData as CheckoutPaymentMethodData } from './models/PrimerCheckoutPaymentMethodData';
+export { PrimerError } from './models/PrimerError';
+export type { IPrimerAsset as Asset } from './models/PrimerAsset';
+export { PrimerHeadlessUniversalCheckout as HeadlessUniversalCheckout } from './HeadlessUniversalCheckout/PrimerHeadlessUniversalCheckout';
+export type { IPrimerHeadlessUniversalCheckoutPaymentMethod as PaymentMethod } from './models/PrimerHeadlessUniversalCheckoutPaymentMethod';
 
 import PrimerHeadlessUniversalCheckoutAssetsManager from './HeadlessUniversalCheckout/Managers/AssetsManager';
-export {
-    PrimerHeadlessUniversalCheckoutAssetsManager as AssetsManager
-}
+export { PrimerHeadlessUniversalCheckoutAssetsManager as AssetsManager };
 import PrimerHeadlessUniversalCheckoutPaymentMethodNativeUIManager from './HeadlessUniversalCheckout/Managers/PaymentMethodManagers/NativeUIManager';
-export {
-    PrimerHeadlessUniversalCheckoutPaymentMethodNativeUIManager as NativeUIManager
-}
+export { PrimerHeadlessUniversalCheckoutPaymentMethodNativeUIManager as NativeUIManager };
 import PrimerHeadlessUniversalCheckoutRawDataManager from './HeadlessUniversalCheckout/Managers/PaymentMethodManagers/RawDataManager';
 export {
-    PrimerHeadlessUniversalCheckoutRawDataManager as RawDataManager
+  PrimerHeadlessUniversalCheckoutRawDataManager as RawDataManager
 }
-
 export {
-    IPrimerVaultedPaymentMethod as VaultedPaymentMethod
+  IPrimerVaultedPaymentMethod as VaultedPaymentMethod
 } from './models/PrimerVaultedPaymentMethod'
 
 export {
-    IPrimerVaultedPaymentMethodAdditonalData as VaultedPaymentMethodAdditionalData
+  IPrimerVaultedPaymentMethodAdditonalData as VaultedPaymentMethodAdditionalData
 } from './models/PrimerVaultedPaymentMethodAdditionalData'
 
 export {
-    IPrimerValidationError as ValidationError
+  IPrimerValidationError as ValidationError
 } from './models/PrimerValidationError'
 
 import PrimerHeadlessUniversalCheckoutVaultManager from './HeadlessUniversalCheckout/Managers/VaultManager'
 export {
-    PrimerHeadlessUniversalCheckoutVaultManager as VaultManager
-}
+  PrimerHeadlessUniversalCheckoutVaultManager as VaultManager
+}
+import { PrimerHeadlessUniversalCheckoutKlarnaManager, KlarnaComponent, KlarnaManagerProps } from './HeadlessUniversalCheckout/Managers/PaymentMethodManagers/KlarnaManager';
+export { PrimerHeadlessUniversalCheckoutKlarnaManager as KlarnaManager, KlarnaComponent, KlarnaManagerProps };
+import { NamedComponentStep } from './models/NamedComponentStep';
+export { NamedComponentStep };
+import { KlarnaPaymentCategory } from './models/klarna/KlarnaPaymentCategory';
+export { KlarnaPaymentCategory };
+import { PrimerValidComponentData, PrimerValidatingComponentData, PrimerInvalidComponentData, PrimerComponentDataValidationError } from './models/PrimerComponentDataValidation';
+export { PrimerValidComponentData, PrimerValidatingComponentData, PrimerInvalidComponentData, PrimerComponentDataValidationError };
+import { KlarnaPaymentOptions, KlarnaPaymentFinalization, KlarnaPaymentValidatableData } from './models/klarna/KlarnaPaymentCollectableData';
+export { KlarnaPaymentOptions, KlarnaPaymentFinalization, KlarnaPaymentValidatableData };
+import { PaymentSessionCreated, PaymentSessionAuthorized, PaymentSessionFinalized, PaymentViewLoaded, KlarnaPaymentStep } from './models/klarna/KlarnaPaymentSteps';
+export { PaymentSessionCreated, PaymentSessionAuthorized, PaymentSessionFinalized, PaymentViewLoaded, KlarnaPaymentStep };
+import { PrimerKlarnaPaymentView } from './HeadlessUniversalCheckout/Components/PrimerKlarnaPaymentView'
+export { PrimerKlarnaPaymentView }
+
+import { PrimerHeadlessUniversalCheckoutComponentWithRedirectManager, BanksComponent, ComponentWithRedirectManagerProps } from './HeadlessUniversalCheckout/Managers/PaymentMethodManagers/ComponentWithRedirectManager';
+export { PrimerHeadlessUniversalCheckoutComponentWithRedirectManager as ComponentWithRedirectManager, BanksComponent, ComponentWithRedirectManagerProps };
+import { IssuingBank } from './models/IssuingBank';
+export { IssuingBank };
+import { BankId, BankListFilter, BanksValidatableData } from './models/banks/BanksCollectableData';
+export { BankId, BankListFilter, BanksValidatableData };
+import { BanksLoading, BanksRetrieved, BanksStep } from './models/banks/BanksSteps';
+export { BanksLoading, BanksRetrieved, BanksStep };
+import { NamedComponentValidatableData } from './models/NamedComponentValidatableData';
+export { NamedComponentValidatableData };

package/src/models/IssuingBank.ts

@@ -0,0 +1,8 @@
+export type IssuingBank = IIssuingBank;
+
+interface IIssuingBank {
+    id: string;
+    name: string;
+    iconUrl: string;
+    disabled: boolean
+}

package/src/models/NamedComponentStep.ts

@@ -0,0 +1,11 @@
+export type NamedComponentStep = INamedComponentStep;
+
+/**
+ * A component step that can be identified via its name.
+ */
+interface INamedComponentStep {
+    /**
+     * The name of this component step.
+     */
+    stepName: string
+}

package/src/models/NamedComponentValidatableData.ts

@@ -0,0 +1,11 @@
+export type NamedComponentValidatableData = INamedComponentValidatableData;
+
+/**
+ * A component-validatable data that can be identified via its name.
+ */
+interface INamedComponentValidatableData {
+    /**
+     * The name of this component-validatable data.
+     */
+    validatableDataName: string
+}

package/src/models/PrimerCheckoutPaymentMethodData.ts

@@ -1,5 +1,10 @@
 export type PrimerCheckoutPaymentMethodData = IPrimerCheckoutPaymentMethodData;
 
 interface IPrimerCheckoutPaymentMethodData {
+    /*
+    * @deprecated use paymentMethod field instead
+    */
     paymentMethodType: string;
-}
+    
+    paymentMethod: string;
+}

package/src/models/PrimerComponentDataValidation.ts

@@ -0,0 +1,60 @@
+import { NamedComponentValidatableData } from "./NamedComponentValidatableData";
+import { PrimerError } from "./PrimerError";
+import { PrimerValidationError } from "./PrimerValidationError";
+
+export type PrimerValidatingComponentData<T extends NamedComponentValidatableData> = IPrimerValidatingComponentData<T>;
+export type PrimerValidComponentData<T extends NamedComponentValidatableData> = IPrimerValidComponentData<T>;
+export type PrimerInvalidComponentData<T extends NamedComponentValidatableData> = IPrimerInvalidComponentData<T>;
+export type PrimerComponentDataValidationError<T extends NamedComponentValidatableData> = IPrimerComponentDataValidationError<T>;
+
+/**
+ * Interface that indicates that data is currently in the process of being validated.
+ */
+interface IPrimerValidatingComponentData<T extends NamedComponentValidatableData> {
+    /**
+     * The data being validated.
+     */
+    data: T;
+}
+
+/**
+ * Interface that indicates that the data has been successfully validated.
+ */
+interface IPrimerValidComponentData<T extends NamedComponentValidatableData> {
+    /**
+     * The successfully validated data.
+     */
+    data: T;
+}
+
+/**
+ * Interface that indicates that the data has been considered invalid after validation.
+ */
+interface IPrimerInvalidComponentData<T extends NamedComponentValidatableData> {
+    /**
+    * The data that failed validation.
+    */
+    data: T;
+
+    /**
+     *  A list of PrimerValidationError explaining why the data is
+     *  considered invalid.
+     */
+    errors: PrimerValidationError[];
+}
+
+/**
+ * Interface that represents an error that occurred during the validation process.
+ */
+interface IPrimerComponentDataValidationError<T extends NamedComponentValidatableData> {
+    /**
+     * The data for which an error ocurred during validation.
+     */
+    data: T;
+
+
+    /**
+     * The PrimerError that ocurred during the validation attempt.
+     */
+    error: PrimerError;
+}