This method allows you get a new instance of a component implementation.
1async provide(props: ComponentWithRedirectManagerProps): Promise<BanksComponent | any>Parameters
Properties
A unique string identifier for the payment method. Supported payment methods for current client session are returned in onAvailablePaymentMethodLoad callback.
Called whenever the component emits a new step. This usually happens when calling start or submit or whenever the component collects data.
Parameters
Properties
Called to indicate that a PrimerError occurred during the component's operation.
Parameters
The specific PrimerError that occurred during the component's operation.
Parameters
Interface that indicates that the data has been considered invalid after validation.
Properties
Properties
Properties
A list of PrimerValidationError explaining why the data is considered invalid.
Properties
Parameters
Interface that indicates that the data has been successfully validated.
Properties
Properties
Properties
Parameters
Interface that indicates that data is currently in the process of being validated.
Properties
Properties
Properties
Parameters
Interface that represents an error that occurred during the validation process.
Properties
Properties
Properties
The PrimerError that ocurred during the validation attempt.
Properties
Supported payment method types
| Type | paymentMethodType |
|---|---|
| BanksComponent | ADYEN_IDEAL |
Returns
An instance of a component, depending on the paymentMethodType:
Common API and available components
Common API
Initialize the component by calling the start function. This method should be called only once.
Call submit function in order to process collected data and move component to next state.
Supported types
API
Update component with the selected bank id.
To validate the collected data, you can refer to the appropriate ComponentWithRedirectManagerProps callback functions.
Update component with the given bank filter. Doing so will cause a call to onStep with the filtered bank list.
To validate the collected data, you can refer to the appropriate ComponentWithRedirectManagerProps callback functions.
Example
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
// 👇 Add thisconst componentWithRedirectManagerProps: ComponentWithRedirectManagerProps = { paymentMethodType: "ADYEN_IDEAL", onStep: (data: BanksStep) => { switch(data.stepName) { case "banksLoading": // Show loading indicator break; case "banksRetrieved": // Render banks break; } }, onError: (error: PrimerError) => { // An error that occurred during the component's operation. }, onInvalid: (data: PrimerInvalidComponentData<BanksValidatableData>) => { // Data was considered invalid during validation. switch(data.data.validatableDataName) { case 'bankListFilter': // ... break; case 'bankId': // ... break; } }, onValid: (data: PrimerValidComponentData<BanksValidatableData>) => { // Data was successfully validated. switch(data.data.validatableDataName) { case 'bankListFilter': // ... break; case 'bankId': // ... break; } }, onValidating: (data: PrimerValidatingComponentData<BanksValidatableData>) => { // Data is in the process of being validated. switch(data.data.validatableDataName) { case 'bankListFilter': // ... break; case 'bankId': // ... break; } }, onValidationError: (data: PrimerComponentDataValidationError<BanksValidatableData>) => { // Error occurred during data validation. switch(data.data.validatableDataName) { case 'bankListFilter': // ... break; case 'bankId': // ... break; } },};const componentWithRedirectManager = new ComponentWithRedirectManager();const banksComponent: BanksComponent = await componentWithRedirectManager.provide(componentWithRedirectManagerProps);