@idonatedev/idonate-sdk 1.2.0-dev17 → 1.2.0-dev19

package/dist/esm/tokenize/SpreedlyTokenizer.js

@@ -14,15 +14,16 @@ import { extractSpreedlyToken, unpackSpreedlyResponse } from '../typeAdapters';
 import { fetchSpreedlySecurityArgs } from './spreedly-secure';
 import { DEFAULT_UNIFIED_STYLES, mergeStyles, getContainerStylesForLayout, } from './styles';
 import { INIT_TIMEOUT, TOKENIZE_TIMEOUT, FIELD_FLEX, BANK_FIELD_FLEX, CANADIAN_BANK_FIELD_FLEX, PLACEHOLDERS, FIELD_CONSTRAINTS, RESPONSIVE_BREAKPOINT, } from './tokenizer-constants';
-import { createFieldContainer, createInputElement, validateRoutingNumber, validateAccountNumber, createAccountTypeSelect, validateInstitutionNumber, validateTransitNumber, validateCanadianAccountNumber, formatCanadianRoutingNumber, } from './tokenizer-utils';
+import { createFieldContainer, createInputElement, validateRoutingNumber, validateAccountNumber, createAccountTypeSelect, validateInstitutionNumber, validateTransitNumber, validateCanadianAccountNumber, formatCanadianRoutingNumber, wrapFieldWithLabel, } from './tokenizer-utils';
 const SPREEDLY_SCRIPT_URL = 'https://core.spreedly.com/iframe/iframe-v1.min.js';
 const SPREEDLY_SCRIPT_ID = 'spreedly-iframe-script';
 export class SpreedlyTokenizer extends Tokenizer {
-    constructor(environmentKey, containerId, styles, mode = 'credit_card', bankCountry = 'US', enableTestMode = false, layout = 'single-line', responsiveBreakpoint = RESPONSIVE_BREAKPOINT) {
+    constructor(environmentKey, containerId, styles, mode = 'credit_card', bankCountry = 'US', enableTestMode = false, layout = 'single-line', responsiveBreakpoint = RESPONSIVE_BREAKPOINT, customPlaceholders) {
         super();
         this.environmentKey = environmentKey;
         this.containerId = containerId;
         this.layout = layout;
+        this.customPlaceholders = customPlaceholders;
         this.bankCountry = 'US';
         this.enableTestMode = false;
         this.effectiveLayout = 'single-line';
@@ -77,7 +78,7 @@ export class SpreedlyTokenizer extends Tokenizer {
             if (!environmentKey) {
                 throw new Error('Spreedly environment key is required. Provide it via gateway.config.environmentKey or client config.');
             }
-            const tokenizer = new SpreedlyTokenizer(environmentKey, container.containerId, container.styling, container.mode || 'credit_card', container.bankCountry || 'US', container.enableTestMode || false, container.layout || 'single-line', (_b = container.responsiveBreakpoint) !== null && _b !== void 0 ? _b : RESPONSIVE_BREAKPOINT);
+            const tokenizer = new SpreedlyTokenizer(environmentKey, container.containerId, container.styling, container.mode || 'credit_card', container.bankCountry || 'US', container.enableTestMode || false, container.layout || 'single-line', (_b = container.responsiveBreakpoint) !== null && _b !== void 0 ? _b : RESPONSIVE_BREAKPOINT, container.placeholders);
             tokenizer.organizationId = config.organizationId;
             tokenizer.embedId = config.embedId;
             tokenizer.clientConfig = config.clientConfig;
@@ -136,11 +137,12 @@ export class SpreedlyTokenizer extends Tokenizer {
                     reject(new Error('Spreedly initialization timeout'));
                 }, INIT_TIMEOUT);
                 this.spreedly.on('ready', () => {
+                    var _a, _b;
                     clearTimeout(timeout);
-                    this.spreedly.setPlaceholder('number', PLACEHOLDERS.cardNumber);
+                    this.spreedly.setPlaceholder('number', ((_a = this.customPlaceholders) === null || _a === void 0 ? void 0 : _a.cardNumber) || PLACEHOLDERS.cardNumber);
                     this.spreedly.setFieldType('number', 'text');
                     this.spreedly.setNumberFormat('prettyFormat');
-                    this.spreedly.setPlaceholder('cvv', PLACEHOLDERS.cvv);
+                    this.spreedly.setPlaceholder('cvv', ((_b = this.customPlaceholders) === null || _b === void 0 ? void 0 : _b.cvv) || PLACEHOLDERS.cvv);
                     this.spreedly.setFieldType('cvv', 'text');
                     this.applyUnifiedStyles();
                     if (this.enableTestMode &&
@@ -256,7 +258,7 @@ export class SpreedlyTokenizer extends Tokenizer {
                 minWidth: CANADIAN_BANK_FIELD_FLEX.accountType.minWidth,
             });
             this.applyInputStyles(this.accountTypeEl, this.mergedStyles, 'left');
-            container.appendChild(this.accountTypeEl);
+            this.appendField(container, this.accountTypeEl, 'Account Type');
             this.institutionNumberEl = createInputElement(`${this.containerId}-institution`, 'text', 'Inst *', 3);
             Object.assign(this.institutionNumberEl.style, {
                 flex: '1',
@@ -273,7 +275,7 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.institutionNumberEl);
+            this.appendField(container, this.institutionNumberEl, 'Institution');
             this.transitNumberEl = createInputElement(`${this.containerId}-transit`, 'text', 'Transit *', 5);
             Object.assign(this.transitNumberEl.style, {
                 flex: '2',
@@ -290,7 +292,7 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.transitNumberEl);
+            this.appendField(container, this.transitNumberEl, 'Transit');
             this.accountNumberEl = createInputElement(`${this.containerId}-account`, 'text', 'Account Number *');
             Object.assign(this.accountNumberEl.style, {
                 flex: '1',
@@ -308,7 +310,7 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.accountNumberEl);
+            this.appendField(container, this.accountNumberEl, 'Account Number');
         }
         else {
             this.institutionNumberEl = createInputElement(`${this.containerId}-institution`, 'text', 'Inst *', 3);
@@ -327,7 +329,7 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.institutionNumberEl);
+            this.appendField(container, this.institutionNumberEl, 'Institution');
             this.transitNumberEl = createInputElement(`${this.containerId}-transit`, 'text', 'Transit *', 5);
             Object.assign(this.transitNumberEl.style, {
                 flex: CANADIAN_BANK_FIELD_FLEX.transitNumber.flex,
@@ -344,7 +346,7 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.transitNumberEl);
+            this.appendField(container, this.transitNumberEl, 'Transit');
             this.accountNumberEl = createInputElement(`${this.containerId}-account`, 'text', 'Account Number *');
             Object.assign(this.accountNumberEl.style, {
                 flex: CANADIAN_BANK_FIELD_FLEX.accountNumber.flex,
@@ -361,14 +363,14 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.accountNumberEl);
+            this.appendField(container, this.accountNumberEl, 'Account Number');
             this.accountTypeEl = createAccountTypeSelect(`${this.containerId}-account-type`);
             Object.assign(this.accountTypeEl.style, {
                 flex: CANADIAN_BANK_FIELD_FLEX.accountType.flex,
                 minWidth: CANADIAN_BANK_FIELD_FLEX.accountType.minWidth,
             });
             this.applyInputStyles(this.accountTypeEl, this.mergedStyles, 'right');
-            container.appendChild(this.accountTypeEl);
+            this.appendField(container, this.accountTypeEl, 'Account Type');
         }
     }
     tokenizeBankAccountInternal(bankData) {
@@ -841,7 +843,11 @@ export class SpreedlyTokenizer extends Tokenizer {
             this.createCreditCardFields(container);
         }
     }
+    appendField(container, field, labelText) {
+        container.appendChild(wrapFieldWithLabel(field, labelText, this.mergedStyles));
+    }
     createCreditCardFields(container) {
+        var _a, _b;
         if (this.layout === 'responsive') {
             this.effectiveLayout = this.determineLayout(container.offsetWidth);
         }
@@ -854,8 +860,8 @@ export class SpreedlyTokenizer extends Tokenizer {
             cardNumberDiv.style.height = this.mergedStyles.input.height;
             cardNumberDiv.style.flexBasis = '100%';
             this.cardNumberDiv = cardNumberDiv;
-            container.appendChild(cardNumberDiv);
-            this.expiryEl = createInputElement(this.expiryId, 'text', PLACEHOLDERS.expiry, FIELD_CONSTRAINTS.expiry.maxLength);
+            this.appendField(container, cardNumberDiv, 'Card Number');
+            this.expiryEl = createInputElement(this.expiryId, 'text', ((_a = this.customPlaceholders) === null || _a === void 0 ? void 0 : _a.expiry) || PLACEHOLDERS.expiry, FIELD_CONSTRAINTS.expiry.maxLength);
             Object.assign(this.expiryEl.style, {
                 flex: '1',
                 minWidth: FIELD_FLEX.expiry.minWidth,
@@ -875,18 +881,18 @@ export class SpreedlyTokenizer extends Tokenizer {
                 this.validateExpiry();
                 this.updateOverallValidation();
             });
-            container.appendChild(this.expiryEl);
+            this.appendField(container, this.expiryEl, 'Expiration');
             const cvvDiv = createFieldContainer(this.cvvEl, '1', FIELD_FLEX.cvv.minWidth);
             cvvDiv.style.height = this.mergedStyles.input.height;
             this.cvvDiv = cvvDiv;
-            container.appendChild(cvvDiv);
+            this.appendField(container, cvvDiv, 'CVV');
         }
         else {
             const cardNumberDiv = createFieldContainer(this.numberEl, FIELD_FLEX.cardNumber.flex, FIELD_FLEX.cardNumber.minWidth);
             cardNumberDiv.style.height = this.mergedStyles.input.height;
             this.cardNumberDiv = cardNumberDiv;
-            container.appendChild(cardNumberDiv);
-            this.expiryEl = createInputElement(this.expiryId, 'text', PLACEHOLDERS.expiry, FIELD_CONSTRAINTS.expiry.maxLength);
+            this.appendField(container, cardNumberDiv, 'Card Number');
+            this.expiryEl = createInputElement(this.expiryId, 'text', ((_b = this.customPlaceholders) === null || _b === void 0 ? void 0 : _b.expiry) || PLACEHOLDERS.expiry, FIELD_CONSTRAINTS.expiry.maxLength);
             Object.assign(this.expiryEl.style, {
                 flex: FIELD_FLEX.expiry.flex,
                 minWidth: FIELD_FLEX.expiry.minWidth,
@@ -906,11 +912,11 @@ export class SpreedlyTokenizer extends Tokenizer {
                 this.validateExpiry();
                 this.updateOverallValidation();
             });
-            container.appendChild(this.expiryEl);
+            this.appendField(container, this.expiryEl, 'Expiration');
             const cvvDiv = createFieldContainer(this.cvvEl, FIELD_FLEX.cvv.flex, FIELD_FLEX.cvv.minWidth);
             cvvDiv.style.height = this.mergedStyles.input.height;
             this.cvvDiv = cvvDiv;
-            container.appendChild(cvvDiv);
+            this.appendField(container, cvvDiv, 'CVV');
             if (this.layout === 'responsive') {
                 this.applyLayoutStyles(this.effectiveLayout);
                 this.setupResizeObserver();
@@ -926,6 +932,7 @@ export class SpreedlyTokenizer extends Tokenizer {
         }
     }
     createUSBankAccountFields(container) {
+        var _a, _b, _c, _d;
         if (this.layout === 'two-line') {
             this.accountTypeEl = createAccountTypeSelect(`${this.containerId}-account-type`);
             Object.assign(this.accountTypeEl.style, {
@@ -933,8 +940,8 @@ export class SpreedlyTokenizer extends Tokenizer {
                 minWidth: BANK_FIELD_FLEX.accountType.minWidth,
             });
             this.applyInputStyles(this.accountTypeEl, this.mergedStyles, 'left');
-            container.appendChild(this.accountTypeEl);
-            this.routingNumberEl = createInputElement(`${this.containerId}-routing`, 'text', 'Routing *', 9);
+            this.appendField(container, this.accountTypeEl, 'Account Type');
+            this.routingNumberEl = createInputElement(`${this.containerId}-routing`, 'text', ((_a = this.customPlaceholders) === null || _a === void 0 ? void 0 : _a.routingNumber) || 'Routing *', 9);
             Object.assign(this.routingNumberEl.style, {
                 flex: '1',
                 minWidth: BANK_FIELD_FLEX.routingNumber.minWidth,
@@ -950,8 +957,8 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.routingNumberEl);
-            this.accountNumberEl = createInputElement(`${this.containerId}-account`, 'text', 'Account Number *', 17);
+            this.appendField(container, this.routingNumberEl, 'Routing Number');
+            this.accountNumberEl = createInputElement(`${this.containerId}-account`, 'text', ((_b = this.customPlaceholders) === null || _b === void 0 ? void 0 : _b.accountNumber) || 'Account Number *', 17);
             Object.assign(this.accountNumberEl.style, {
                 flex: '1',
                 flexBasis: '100%',
@@ -968,10 +975,10 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.accountNumberEl);
+            this.appendField(container, this.accountNumberEl, 'Account Number');
         }
         else {
-            this.routingNumberEl = createInputElement(`${this.containerId}-routing`, 'text', 'Routing *', 9);
+            this.routingNumberEl = createInputElement(`${this.containerId}-routing`, 'text', ((_c = this.customPlaceholders) === null || _c === void 0 ? void 0 : _c.routingNumber) || 'Routing *', 9);
             Object.assign(this.routingNumberEl.style, {
                 flex: BANK_FIELD_FLEX.routingNumber.flex,
                 minWidth: BANK_FIELD_FLEX.routingNumber.minWidth,
@@ -987,8 +994,8 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.routingNumberEl);
-            this.accountNumberEl = createInputElement(`${this.containerId}-account`, 'text', 'Account Number *', 17);
+            this.appendField(container, this.routingNumberEl, 'Routing Number');
+            this.accountNumberEl = createInputElement(`${this.containerId}-account`, 'text', ((_d = this.customPlaceholders) === null || _d === void 0 ? void 0 : _d.accountNumber) || 'Account Number *', 17);
             Object.assign(this.accountNumberEl.style, {
                 flex: BANK_FIELD_FLEX.accountNumber.flex,
                 minWidth: BANK_FIELD_FLEX.accountNumber.minWidth,
@@ -1004,14 +1011,14 @@ export class SpreedlyTokenizer extends Tokenizer {
                 }
                 this.updateBankAccountValidation();
             });
-            container.appendChild(this.accountNumberEl);
+            this.appendField(container, this.accountNumberEl, 'Account Number');
             this.accountTypeEl = createAccountTypeSelect(`${this.containerId}-account-type`);
             Object.assign(this.accountTypeEl.style, {
                 flex: BANK_FIELD_FLEX.accountType.flex,
                 minWidth: BANK_FIELD_FLEX.accountType.minWidth,
             });
             this.applyInputStyles(this.accountTypeEl, this.mergedStyles, 'right');
-            container.appendChild(this.accountTypeEl);
+            this.appendField(container, this.accountTypeEl, 'Account Type');
         }
     }
     updateBankAccountValidation() {

package/dist/esm/tokenize/styles.js

@@ -32,17 +32,30 @@ export const DEFAULT_UNIFIED_STYLES = {
         fontSize: '',
         textAlign: '',
     },
+    label: {
+        show: false,
+        fontSize: '0.875rem',
+        fontWeight: 'bold',
+        fontFamily: '',
+        color: '#333',
+        marginBottom: '0.25rem',
+    },
 };
 export function mergeStyles(defaults, userStyles) {
     if (!userStyles)
         return defaults;
-    return {
+    const merged = {
         input: Object.assign(Object.assign({}, defaults.input), userStyles.input),
         focus: Object.assign(Object.assign({}, defaults.focus), userStyles.focus),
         error: Object.assign(Object.assign({}, defaults.error), userStyles.error),
         container: Object.assign(Object.assign({}, defaults.container), userStyles.container),
         twoLine: Object.assign(Object.assign({}, defaults.twoLine), userStyles.twoLine),
+        label: Object.assign(Object.assign({}, defaults.label), userStyles.label),
     };
+    if (!merged.label.fontFamily) {
+        merged.label.fontFamily = merged.input.fontFamily;
+    }
+    return merged;
 }
 export function getContainerStylesForLayout(baseStyles, layout = 'single-line') {
     if (layout === 'two-line') {

package/dist/esm/tokenize/tokenizer-utils.d.ts

@@ -7,6 +7,8 @@ export declare function formatExpiryInput(value: string): string;
 export declare function withTimeout<T>(promise: Promise<T>, timeoutMs: number, errorMessage: string): Promise<T>;
 export declare function getConnectedBorderRadius(baseRadius: string, position: 'left' | 'middle' | 'right', isConnected: boolean): string;
 export declare function addFocusHandlers(element: HTMLElement, styles: TokenizerStylingComplete, position?: 'left' | 'middle' | 'right', onFocus?: () => void, onBlur?: () => void): void;
+export declare function createFieldLabel(text: string, forId: string, styles: TokenizerStylingComplete): HTMLLabelElement;
+export declare function wrapFieldWithLabel(field: HTMLElement, labelText: string, styles: TokenizerStylingComplete): HTMLElement;
 export declare function createFieldContainer(id: string, flex: string, minWidth?: string, maxWidth?: string): HTMLDivElement;
 export declare function createInputElement(id: string, type: string, placeholder: string, maxLength?: number): HTMLInputElement;
 export declare function validateRoutingNumber(routingNumber: string): boolean;
@@ -17,3 +19,4 @@ export declare function validateInstitutionNumber(institutionNumber: string): bo
 export declare function validateTransitNumber(transitNumber: string): boolean;
 export declare function validateCanadianAccountNumber(accountNumber: string): boolean;
 export declare function formatCanadianRoutingNumber(institutionNumber: string, transitNumber: string): string;
+export declare function cssLengthToPixels(value: string): number;

package/dist/esm/tokenize/tokenizer-utils.js

@@ -74,6 +74,43 @@ export function addFocusHandlers(element, styles, position, onFocus, onBlur) {
         onBlur === null || onBlur === void 0 ? void 0 : onBlur();
     });
 }
+export function createFieldLabel(text, forId, styles) {
+    const label = document.createElement('label');
+    label.htmlFor = forId;
+    label.textContent = text;
+    label.style.display = styles.label.show ? 'block' : 'none';
+    label.style.fontSize = styles.label.fontSize;
+    label.style.fontWeight = styles.label.fontWeight;
+    label.style.fontFamily = styles.label.fontFamily;
+    label.style.color = styles.label.color;
+    label.style.marginBottom = styles.label.marginBottom;
+    return label;
+}
+export function wrapFieldWithLabel(field, labelText, styles) {
+    if (!styles.label.show)
+        return field;
+    const wrapper = document.createElement('div');
+    wrapper.style.display = 'flex';
+    wrapper.style.flexDirection = 'column';
+    if (field.style.flex) {
+        wrapper.style.flex = field.style.flex;
+        field.style.flex = '';
+    }
+    if (field.style.minWidth) {
+        wrapper.style.minWidth = field.style.minWidth;
+    }
+    if (field.style.maxWidth) {
+        wrapper.style.maxWidth = field.style.maxWidth;
+    }
+    if (field.style.flexBasis) {
+        wrapper.style.flexBasis = field.style.flexBasis;
+        field.style.flexBasis = '';
+    }
+    const label = createFieldLabel(labelText, field.id, styles);
+    wrapper.appendChild(label);
+    wrapper.appendChild(field);
+    return wrapper;
+}
 export function createFieldContainer(id, flex, minWidth, maxWidth) {
     const div = document.createElement('div');
     div.id = id;
@@ -158,3 +195,19 @@ export function formatCanadianRoutingNumber(institutionNumber, transitNumber) {
     const transit = transitNumber.replace(/\D/g, '').padStart(5, '0');
     return '0' + institution + transit;
 }
+export function cssLengthToPixels(value) {
+    const num = parseFloat(value);
+    if (isNaN(num)) {
+        console.warn(`[cssLengthToPixels] Cannot parse "${value}", defaulting to 14px`);
+        return 14;
+    }
+    if (value.endsWith('rem'))
+        return num * 16;
+    if (value.endsWith('pt'))
+        return num * 1.333;
+    if (value.endsWith('px') || !value.match(/[a-z%]/i))
+        return num;
+    console.warn(`[cssLengthToPixels] Unsupported unit in "${value}". ` +
+        `Only px, rem, and pt are supported. Using ${num}px as approximation.`);
+    return num;
+}

package/dist/esm/tokenize/types.d.ts

@@ -21,6 +21,15 @@ export interface TokenizerContainer {
     enableTestMode?: boolean;
     layout?: 'single-line' | 'two-line' | 'responsive';
     responsiveBreakpoint?: number;
+    placeholders?: {
+        cardNumber?: string;
+        expiry?: string;
+        expiryMonth?: string;
+        expiryYear?: string;
+        cvv?: string;
+        routingNumber?: string;
+        accountNumber?: string;
+    };
 }
 export interface TokenizerStylingComplete {
     input: {
@@ -59,6 +68,14 @@ export interface TokenizerStylingComplete {
         fontSize: string;
         textAlign: string;
     };
+    label: {
+        show: boolean;
+        fontSize: string;
+        fontWeight: string;
+        fontFamily: string;
+        color: string;
+        marginBottom: string;
+    };
 }
 type DeepPartial<T> = T extends object ? {
     [P in keyof T]?: DeepPartial<T[P]>;

package/dist/idonate-client.js

@@ -149,10 +149,10 @@ class iDonateClient {
         if (!this.allowTransaction) {
             throw new Error('Wow, that was fast - try again');
         }
-        if (!donation.embedId) {
-            donation.embedId = this.embedId;
-        }
-        const payload = (0, typeAdapters_1.buildCashPaymentPayload)(this.organizationId, donation);
+        const donationWithEmbed = donation.embedId
+            ? donation
+            : Object.assign(Object.assign({}, donation), { embedId: this.embedId });
+        const payload = (0, typeAdapters_1.buildCashPaymentPayload)(this.organizationId, donationWithEmbed);
         const fetchCall = (clearanceToken) => fetch(`${this.config.embedApiBaseUrl}/donate/cash-payment`, {
             method: 'POST',
             headers: Object.assign(Object.assign(Object.assign({}, constants_1.CLIENT_HEADERS), (clearanceToken ? { 'cf-validation-token': clearanceToken } : {})), { 'User-Agent': constants_1.CLIENT_HEADERS['User-Agent'] + ' source:' + this.config.client }),
@@ -180,10 +180,10 @@ class iDonateClient {
         });
     }
     createPaymentMethod(paymentMethod) {
-        if (!paymentMethod.embedId) {
-            paymentMethod.embedId = this.embedId;
-        }
-        return shared.createPaymentMethod(paymentMethod, this.config);
+        const pmWithEmbed = paymentMethod.embedId
+            ? paymentMethod
+            : Object.assign(Object.assign({}, paymentMethod), { embedId: this.embedId });
+        return shared.createPaymentMethod(pmWithEmbed, this.config);
     }
     setOrganizationId(organizationId) {
         this.currentOrganizationId = organizationId;
@@ -195,7 +195,16 @@ class iDonateClient {
         return new Promise((resolve, reject) => {
             setTimeout(() => {
                 let pollHandle;
+                let attempts = 0;
+                const maxAttempts = 90;
                 pollHandle = setInterval(() => {
+                    attempts++;
+                    if (attempts > maxAttempts) {
+                        clearInterval(pollHandle);
+                        pollHandle = null;
+                        reject(new types_1.ClientError('Donation processing timed out. Please check your email for a receipt or contact support.'));
+                        return;
+                    }
                     fetch(`${this.config.embedApiBaseUrl}/donate/cash-payment/${donationId}/payment_status`, {
                         method: 'GET',
                         headers: {
@@ -212,6 +221,7 @@ class iDonateClient {
                             }
                             if (response.error) {
                                 reject(new types_1.ClientError(response.error));
+                                return;
                             }
                             resolve((0, typeAdapters_1.buildDonationResult)({
                                 _raw_response: Object.assign({ campaign: null, designation: {}, donor: {}, form_data: {}, id: null, schedule: {}, transaction: {} }, response),

package/dist/recaptcha.js

@@ -67,9 +67,16 @@ class RecaptchaElement {
             this.widgetId = lib.render(this.container, Object.assign(Object.assign({}, this.params), { callback: (token) => {
                     var _a;
                     this.resolvedToken = token;
-                    (_a = this.executeResolveQueue.pop()) === null || _a === void 0 ? void 0 : _a(token);
+                    (_a = this.executeResolveQueue.shift()) === null || _a === void 0 ? void 0 : _a.resolve(token);
                 }, 'expired-callback': () => {
                     this.resolvedToken = undefined;
+                }, 'error-callback': () => {
+                    var _a;
+                    this.resolvedToken = undefined;
+                    const error = new Error('reCAPTCHA encountered an error. Please try again.');
+                    while (this.executeResolveQueue.length > 0) {
+                        (_a = this.executeResolveQueue.shift()) === null || _a === void 0 ? void 0 : _a.reject(error);
+                    }
                 } }));
         });
     }
@@ -83,7 +90,7 @@ class RecaptchaElement {
                         ? resolve(response)
                         : reject(new Error('checkbox recaptcha is not checked'));
                 }
-                this.executeResolveQueue.push(resolve);
+                this.executeResolveQueue.push({ resolve, reject });
                 if (this.resolvedToken !== undefined) {
                     this.resolvedToken = undefined;
                     lib.reset(this.widgetId);

package/dist/tokenize/CardConnectTokenizer.d.ts

@@ -6,6 +6,7 @@ export declare class CardConnectTokenizer extends Tokenizer {
     private iframeUrl;
     private containerId;
     private layout;
+    private customPlaceholders?;
     private iframe;
     private messageHandler?;
     private expectedOrigin;
@@ -49,6 +50,7 @@ export declare class CardConnectTokenizer extends Tokenizer {
     get tokenizationMode(): 'auto' | 'manual';
     private handleMessage;
     private handleValidationMessage;
+    private static measureCvvLabelMarginLeft;
     private static generateIframeUrl;
     private static createIframe;
     private static generateCardConnectCss;