Advanced Mode Usage

Overview

Advanced mode provides granular control over mounting, styling, and validation via the AdvancedReverePay class. Use it when you need to:

• Mount inputs into your own UI using specific element IDs.
• Listen to per-field validation events and adjust UX.
• Programmatically update styles, placeholders, and values.
• Control focus and submission flows.

Initialization

To create an instance of AdvancedReverePay, pass your merchant credentials and a config object. Choose your paymentMethod as 'card' or 'ach'.

TypeScript

import { AdvancedReverePay } from '@revere_payments/tokenizer';
import type { SuccessResponse, ErrorResponse } from '@revere_payments/tokenizer/types';

const reverePay = new AdvancedReverePay({
	merchantId: 'yourMerchantId',
	publicAPIKey: 'yourPublicAPIKey',
	config: {
		paymentMethod: 'card',
		sandbox: true,
		fields: {
			// Provide your container IDs; defaults shown below
			form: { id: 'ccForm' },
			cardHolderName: { id: 'ccHolderName' },
			postalCode: { id: 'ccPostalCode' },
			cardNumber: { id: 'ccNumber' },
			cardExpiration: { id: 'ccExpiration' },
			cardCVV: { id: 'ccCvv' }
		}
	}
});

reverePay.onLoaded = () => console.log('Tokenizer loaded');
reverePay.onSuccess = (data: SuccessResponse) => console.log('SUCCESS', data);
reverePay.onError = (status: number, validation, err?: ErrorResponse) => {
	console.log('ERROR', status, validation, err);
};
reverePay.onCheckValidity = (validation) => console.log('VALIDITY', validation);

JavaScript

import { AdvancedReverePay } from 'https://esm.run/@revere_payments/tokenizer';

const reverePay = new AdvancedReverePay({
	merchantId: 'yourMerchantId',
	publicAPIKey: 'yourPublicAPIKey',
	config: {
		paymentMethod: 'card',
		sandbox: true,
		fields: {
			form: { id: 'ccForm' },
			cardHolderName: { id: 'ccHolderName' },
			postalCode: { id: 'ccPostalCode' },
			cardNumber: { id: 'ccNumber' },
			cardExpiration: { id: 'ccExpiration' },
			cardCVV: { id: 'ccCvv' }
		}
	}
});

Constructor Parameters

Parameter	Type	Required	Description
merchantId	string	Yes	Your unique merchant identifier.
publicAPIKey	string	Yes	Your public API key.
config	Config	Yes	Configuration settings for Advanced mode.

Configuration Options

Common options across methods; for full per-method options, see Card and ACH pages.

Property	Type	Required	Default	Description
paymentMethod	'card' | 'ach'	Yes	card	Selects the flow to initialize.
sandbox	boolean	No	false	Enables sandbox testing.
fields	CardFieldsConfig | ACHFieldsConfig	Conditionally	Defaults vary per method	Field container IDs, events and styling.
redirectURL	URL | string	Yes, when paymentMethod is ach	-	Required Plaid redirect URL for ACH.

Instance Properties

Property	Type	Required	Description
onSuccess	Function	Yes	Fired after a successful submission. Provides response (SuccessResponse).
onError	Function	Yes	Fired after a failed attempt. Provides (status, validation, error?: ErrorResponse). See ErrorResponse.
onCheckValidity	Function	No	Fired after a validity check runs on the form. Provides validation (Validation) object.
onLoaded	Function	No	Fired after the initialization process.

For complete type definitions, see Response Types.