@idonatedev/idonate-sdk 1.2.0-dev14 → 1.2.0-dev16

package/dist/tokenize/SpreedlyTokenizer.js

@@ -69,7 +69,7 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
     }
     static create(gateway, container, config) {
         return __awaiter(this, void 0, void 0, function* () {
-            var _a;
+            var _a, _b;
             if (container.mode !== 'bank_account') {
                 yield SpreedlyTokenizer.ensureSpreedlyLoaded();
             }
@@ -78,9 +78,9 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
                 environmentKey = config.clientConfig.spreedlyEnvironmentKey;
             }
             if (!environmentKey) {
-                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', container.responsiveBreakpoint || tokenizer_constants_1.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 : tokenizer_constants_1.RESPONSIVE_BREAKPOINT);
             tokenizer.organizationId = config.organizationId;
             tokenizer.embedId = config.embedId;
             tokenizer.clientConfig = config.clientConfig;
@@ -161,8 +161,29 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
                     this.emit('ready');
                     resolve();
                 });
+                this.spreedly.on('paymentMethod', (token, pmData) => {
+                    const paymentToken = {
+                        token,
+                        lastFour: pmData.last_four_digits,
+                        cardType: this.normalizeCardType(pmData.card_type),
+                        paymentMethodType: 'credit_card',
+                        provider: 'spreedly',
+                    };
+                    if (this.tokenizationResolve) {
+                        const resolveTokenization = this.tokenizationResolve;
+                        this.clearTokenizationState();
+                        this.emit('tokenReady', paymentToken);
+                        resolveTokenization(paymentToken);
+                    }
+                });
                 this.spreedly.on('errors', (errors) => {
-                    this.emit('error', new types_1.TokenizationError(errors));
+                    const error = new types_1.TokenizationError(errors);
+                    this.emit('error', error);
+                    if (this.tokenizationReject) {
+                        const rejectTokenization = this.tokenizationReject;
+                        this.clearTokenizationState();
+                        rejectTokenization(error);
+                    }
                 });
                 this.spreedly.on('fieldEvent', (fieldName, eventType, activeEl, inputProperties) => {
                     this.handleFieldEvent(fieldName, eventType, inputProperties);
@@ -188,6 +209,19 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
         });
     }
     tokenizeCardInternal(cardData) {
+        if (this.tokenizationPromise) {
+            return this.tokenizationPromise;
+        }
+        const expiry = this.parseExpiry(this.expiryEl);
+        if (!expiry) {
+            return Promise.reject(new types_1.TokenizationError('Expiration date is required', 'VALIDATION_ERROR'));
+        }
+        this.tokenizationPromise = this.executeCardTokenization(cardData, expiry).finally(() => {
+            this.tokenizationPromise = undefined;
+        });
+        return this.tokenizationPromise;
+    }
+    executeCardTokenization(cardData, expiry) {
         return __awaiter(this, void 0, void 0, function* () {
             var _a;
             let securityFields = {};
@@ -207,42 +241,13 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
             }
             return new Promise((resolve, reject) => {
                 var _a, _b, _c, _d, _e, _f;
-                const timeout = setTimeout(() => {
-                    if (this.spreedly && this.spreedly.removeHandlers) {
-                        this.spreedly.removeHandlers();
-                    }
+                this.tokenizationResolve = resolve;
+                this.tokenizationReject = reject;
+                this.tokenizationTimeout = setTimeout(() => {
+                    this.clearTokenizationState();
                     reject(new types_1.TokenizationError('Tokenization timeout', 'TIMEOUT'));
                 }, tokenizer_constants_1.TOKENIZE_TIMEOUT);
-                const cleanup = () => {
-                    clearTimeout(timeout);
-                    if (this.spreedly && this.spreedly.removeHandlers) {
-                        this.spreedly.removeHandlers();
-                    }
-                };
-                this.spreedly.on('paymentMethod', (token, pmData) => {
-                    cleanup();
-                    const paymentToken = {
-                        token,
-                        lastFour: pmData.last_four_digits,
-                        cardType: this.normalizeCardType(pmData.card_type),
-                        provider: 'spreedly',
-                    };
-                    this.emit('tokenReady', paymentToken);
-                    resolve(paymentToken);
-                });
-                this.spreedly.on('errors', (errors) => {
-                    cleanup();
-                    reject(new types_1.TokenizationError(errors));
-                });
-                const expiry = this.parseExpiry(this.expiryEl);
-                if (!expiry) {
-                    cleanup();
-                    reject(new types_1.TokenizationError('Expiration date is required', 'VALIDATION_ERROR'));
-                    return;
-                }
-                const expiryMonth = expiry.month;
-                const expiryYear = expiry.year;
-                this.spreedly.tokenizeCreditCard(Object.assign({ first_name: cardData.firstName, last_name: cardData.lastName, month: expiryMonth, year: expiryYear, email: cardData.email, phone_number: cardData.phone, address1: (_a = cardData.address) === null || _a === void 0 ? void 0 : _a.address1, address2: (_b = cardData.address) === null || _b === void 0 ? void 0 : _b.address2, city: (_c = cardData.address) === null || _c === void 0 ? void 0 : _c.city, state: (_d = cardData.address) === null || _d === void 0 ? void 0 : _d.state, zip: (_e = cardData.address) === null || _e === void 0 ? void 0 : _e.zip, country: (_f = cardData.address) === null || _f === void 0 ? void 0 : _f.country }, securityFields));
+                this.spreedly.tokenizeCreditCard(Object.assign({ first_name: cardData.firstName, last_name: cardData.lastName, month: expiry.month, year: expiry.year, email: cardData.email, phone_number: cardData.phone, address1: (_a = cardData.address) === null || _a === void 0 ? void 0 : _a.address1, address2: (_b = cardData.address) === null || _b === void 0 ? void 0 : _b.address2, city: (_c = cardData.address) === null || _c === void 0 ? void 0 : _c.city, state: (_d = cardData.address) === null || _d === void 0 ? void 0 : _d.state, zip: (_e = cardData.address) === null || _e === void 0 ? void 0 : _e.zip, country: (_f = cardData.address) === null || _f === void 0 ? void 0 : _f.country }, securityFields));
             });
         });
     }
@@ -435,17 +440,22 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
                     accountHolderType: accountHolderType,
                 },
             }, this.clientConfig, this.environmentKey);
-            return {
+            const paymentToken = {
                 token: result,
                 lastFour: accountNumber.slice(-4),
                 accountType: accountType,
                 paymentMethodType: 'bank_account',
                 provider: 'spreedly',
             };
+            this.emit('tokenReady', paymentToken);
+            return paymentToken;
         });
     }
     validate() {
         return __awaiter(this, void 0, void 0, function* () {
+            if (!this.isReady) {
+                throw new Error('Tokenizer not initialized');
+            }
             if (this.mode === 'bank_account') {
                 return this.validateBankAccountInternal();
             }
@@ -633,13 +643,31 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
                 this.accountNumberEl.value = '';
             if (this.accountTypeEl)
                 this.accountTypeEl.selectedIndex = 0;
+            this.currentValidationState = {
+                isValid: false,
+                routingNumber: { isValid: false, isEmpty: true },
+                accountNumber: { isValid: false, isEmpty: true },
+            };
         }
         else {
             this.spreedly.reload();
             if (this.expiryEl) {
                 this.expiryEl.value = '';
             }
+            this.currentValidationState = {
+                isValid: false,
+                cardNumber: { isValid: false, isEmpty: true },
+                cvv: { isValid: false, isEmpty: true },
+                expiry: { isValid: false, isEmpty: true },
+            };
+        }
+        if (this.tokenizationReject) {
+            const reject = this.tokenizationReject;
+            this.clearTokenizationState();
+            reject(new types_1.TokenizationError('Tokenizer cleared', 'CLEARED'));
         }
+        this.clearTokenizationState();
+        this.emit('validation', this.currentValidationState);
     }
     focus(field) {
         if (this.mode === 'bank_account') {
@@ -730,14 +758,29 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
             }
         }
     }
+    clearTokenizationState() {
+        if (this.tokenizationTimeout) {
+            clearTimeout(this.tokenizationTimeout);
+            this.tokenizationTimeout = undefined;
+        }
+        this.tokenizationResolve = undefined;
+        this.tokenizationReject = undefined;
+    }
     destroy() {
         var _a;
+        this.markDestroyed();
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        if (this.tokenizationReject) {
+            const reject = this.tokenizationReject;
+            this.clearTokenizationState();
+            reject(new types_1.TokenizationError('Tokenizer destroyed', 'DESTROYED'));
+        }
         if (this.spreedly && this.spreedly.removeHandlers) {
             this.spreedly.removeHandlers();
         }
         this.eventHandlers.clear();
-        if (this.expiryEl) {
+        if (this.containerEl) {
+            this.containerEl.innerHTML = '';
         }
     }
     hasToken() {
@@ -784,15 +827,6 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
             }
             this.updateOverallValidation();
         }
-        if (eventType === 'focus') {
-            this.emit('focus', { field: fieldName });
-        }
-        else if (eventType === 'blur') {
-            this.emit('blur', { field: fieldName });
-        }
-        else if (eventType === 'input') {
-            this.emit('change', { field: fieldName });
-        }
     }
     createInternalElements() {
         const container = document.getElementById(this.containerId);
@@ -838,6 +872,10 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
                 };
                 this.updateOverallValidation();
             });
+            this.expiryEl.addEventListener('blur', () => {
+                this.validateExpiry();
+                this.updateOverallValidation();
+            });
             container.appendChild(this.expiryEl);
             const cvvDiv = (0, tokenizer_utils_1.createFieldContainer)(this.cvvEl, '1', tokenizer_constants_1.FIELD_FLEX.cvv.minWidth);
             cvvDiv.style.height = this.mergedStyles.input.height;
@@ -865,6 +903,10 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
                 };
                 this.updateOverallValidation();
             });
+            this.expiryEl.addEventListener('blur', () => {
+                this.validateExpiry();
+                this.updateOverallValidation();
+            });
             container.appendChild(this.expiryEl);
             const cvvDiv = (0, tokenizer_utils_1.createFieldContainer)(this.cvvEl, tokenizer_constants_1.FIELD_FLEX.cvv.flex, tokenizer_constants_1.FIELD_FLEX.cvv.minWidth);
             cvvDiv.style.height = this.mergedStyles.input.height;
@@ -1027,23 +1069,31 @@ class SpreedlyTokenizer extends Tokenizer_1.Tokenizer {
         if (!this.expiryEl)
             return;
         const expiry = this.parseExpiry(this.expiryEl);
+        const isEmpty = !this.expiryEl.value;
+        let isValid = false;
         if (!expiry) {
-            this.applyErrorStyles(this.expiryEl);
-            return;
-        }
-        const month = parseInt(expiry.month, 10);
-        const year = parseInt(expiry.year, 10);
-        if (month < 1 || month > 12) {
-            this.applyErrorStyles(this.expiryEl);
-            return;
+            if (!isEmpty)
+                this.applyErrorStyles(this.expiryEl);
         }
-        const now = new Date();
-        const expiryDate = new Date(year, month - 1);
-        if (expiryDate < now) {
-            this.applyErrorStyles(this.expiryEl);
-            return;
+        else {
+            const month = parseInt(expiry.month, 10);
+            const year = parseInt(expiry.year, 10);
+            if (month < 1 || month > 12) {
+                this.applyErrorStyles(this.expiryEl);
+            }
+            else {
+                const now = new Date();
+                const expiryEndDate = new Date(year, month);
+                if (expiryEndDate <= now) {
+                    this.applyErrorStyles(this.expiryEl);
+                }
+                else {
+                    isValid = true;
+                    this.applyInputStyles(this.expiryEl, this.mergedStyles, 'middle');
+                }
+            }
         }
-        this.applyInputStyles(this.expiryEl, this.mergedStyles, 'middle');
+        this.currentValidationState.expiry = { isValid, isEmpty };
     }
     applyErrorStyles(element) {
         if (this.mergedStyles.error) {

package/dist/tokenize/Tokenizer.d.ts

@@ -2,9 +2,13 @@ import { CardData, BankAccountData, PaymentData, PaymentToken, ValidationResult,
 import ConfigHandler from '../config-handler';
 export declare abstract class Tokenizer {
     protected mode: PaymentMethodMode;
-    protected eventHandlers: Map<TokenizerEvent, Set<(data?: any) => void>>;
+    protected eventHandlers: Map<string, Set<(data?: any) => void>>;
+    private focusHandlerElements;
     private _isReady;
+    private _isDestroyed;
     get isReady(): boolean;
+    get isDestroyed(): boolean;
+    protected markDestroyed(): void;
     abstract tokenize(paymentData: PaymentData): Promise<PaymentToken>;
     abstract validate(): Promise<ValidationResult>;
     abstract clear(): void;
@@ -16,7 +20,7 @@ export declare abstract class Tokenizer {
     getMode(): PaymentMethodMode;
     on(event: TokenizerEvent, handler: (data?: any) => void): void;
     off(event: TokenizerEvent, handler: (data?: any) => void): void;
-    protected emit(event: TokenizerEvent, data?: any): void;
+    protected emit(event: string, data?: any): void;
     protected isCardData(data: PaymentData): data is CardData;
     protected isBankAccountData(data: PaymentData): data is BankAccountData;
     protected normalizeCardType(providerCardType: string): CardType;

package/dist/tokenize/Tokenizer.js

@@ -49,10 +49,18 @@ class Tokenizer {
     constructor() {
         this.mode = 'credit_card';
         this.eventHandlers = new Map();
+        this.focusHandlerElements = new WeakSet();
         this._isReady = false;
+        this._isDestroyed = false;
     }
     get isReady() {
-        return this._isReady;
+        return this._isReady && !this._isDestroyed;
+    }
+    get isDestroyed() {
+        return this._isDestroyed;
+    }
+    markDestroyed() {
+        this._isDestroyed = true;
     }
     getMode() {
         return this.mode;
@@ -118,7 +126,6 @@ class Tokenizer {
         expiryEl.addEventListener('input', (e) => {
             const target = e.target;
             target.value = (0, tokenizer_utils_1.formatExpiryInput)(target.value);
-            this.emit('change', { field: 'expiry' });
         });
         expiryEl.addEventListener('keypress', (e) => {
             const char = String.fromCharCode(e.which);
@@ -169,7 +176,10 @@ class Tokenizer {
             element.style.border = inputStyles.border;
             element.style.borderRadius = inputStyles.borderRadius;
         }
-        (0, tokenizer_utils_1.addFocusHandlers)(element, styles);
+        if (!this.focusHandlerElements.has(element)) {
+            (0, tokenizer_utils_1.addFocusHandlers)(element, styles, position);
+            this.focusHandlerElements.add(element);
+        }
     }
     generateFieldIds(containerId) {
         return {

package/dist/tokenize/gateway-utils.js

@@ -13,8 +13,9 @@ var __rest = (this && this.__rest) || function (s, e) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeGateway = normalizeGateway;
 function normalizeGateway(input) {
-    if (!input)
-        return input;
+    if (!input) {
+        throw new Error('Gateway is required but received ' + String(input));
+    }
     if (input.backendName !== undefined)
         return input;
     const _a = input.config || {}, { environment_key, base_url, merchant_id } = _a, extraConfigKeys = __rest(_a, ["environment_key", "base_url", "merchant_id"]);

package/dist/tokenize/index.d.ts

@@ -3,6 +3,6 @@ export { Tokenizer } from './Tokenizer';
 export { SpreedlyTokenizer } from './SpreedlyTokenizer';
 export { CardConnectTokenizer } from './CardConnectTokenizer';
 export { PayPalTokenizer, PayPalCreateOrderData } from './PayPalTokenizer';
-export { PaymentMethodType, PaymentGateway, TokenizerContainer, TokenizerStyling, CardData, PaymentData, PaymentToken, CardType, TokenizerEvent, ValidationState, ValidationResult, ValidationError, TokenizationError, } from './types';
+export { PaymentMethodType, PaymentMethodMode, PaymentGateway, TokenizerContainer, TokenizerStyling, CardData, BankAccountData, PaymentData, PaymentToken, CardType, TokenizerEvent, ValidationState, ValidationResult, ValidationError, TokenizationError, } from './types';
 export { normalizeGateway } from './gateway-utils';
 export { iats };

package/dist/tokenize/spreedly-secure.js

@@ -16,6 +16,7 @@ function fetchSpreedlySecurityArgs(config, organizationId, embedId) {
             throw new Error('Secure tokenization is not enabled');
         }
         const makeRequest = () => __awaiter(this, void 0, void 0, function* () {
+            var _a;
             const response = yield fetch(`${config.embedApiBaseUrl}/spreedly/security-args`, {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
@@ -27,13 +28,16 @@ function fetchSpreedlySecurityArgs(config, organizationId, embedId) {
             if (!response.ok) {
                 throw new Error(`Security args request failed: ${response.status}`);
             }
-            return response.json();
+            const data = yield response.json();
+            return (_a = data.result) !== null && _a !== void 0 ? _a : data;
         });
         try {
             return yield makeRequest();
         }
         catch (error) {
-            if (error instanceof TypeError && error.message.includes('fetch')) {
+            const isNetworkError = error instanceof TypeError && error.message.includes('fetch');
+            const isServerError = error instanceof Error && error.message.includes('failed: 5');
+            if (isNetworkError || isServerError) {
                 yield new Promise((resolve) => setTimeout(resolve, 1000));
                 return makeRequest();
             }

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

@@ -6,7 +6,7 @@ export declare function parseExpiryDate(value: string): {
 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, onFocus?: () => void, onBlur?: () => void): void;
+export declare function addFocusHandlers(element: HTMLElement, styles: TokenizerStylingComplete, position?: 'left' | 'middle' | 'right', onFocus?: () => void, onBlur?: () => void): void;
 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;

package/dist/tokenize/tokenizer-utils.js

@@ -56,7 +56,7 @@ function getConnectedBorderRadius(baseRadius, position, isConnected) {
             return baseRadius;
     }
 }
-function addFocusHandlers(element, styles, onFocus, onBlur) {
+function addFocusHandlers(element, styles, position, onFocus, onBlur) {
     element.addEventListener('focus', () => {
         if (styles.focus) {
             Object.assign(element.style, styles.focus);
@@ -64,9 +64,30 @@ function addFocusHandlers(element, styles, onFocus, onBlur) {
         onFocus === null || onFocus === void 0 ? void 0 : onFocus();
     });
     element.addEventListener('blur', () => {
-        element.style.border = styles.input.border;
-        element.style.outline = 'none';
-        element.style.boxShadow = 'none';
+        const isConnected = styles.container.gap === '0';
+        if (isConnected && position) {
+            element.style.borderTop = styles.input.border;
+            element.style.borderBottom = styles.input.border;
+            switch (position) {
+                case 'left':
+                    element.style.borderLeft = styles.input.border;
+                    element.style.borderRight = 'none';
+                    break;
+                case 'middle':
+                    element.style.borderLeft = styles.input.border;
+                    element.style.borderRight = 'none';
+                    break;
+                case 'right':
+                    element.style.borderLeft = styles.input.border;
+                    element.style.borderRight = styles.input.border;
+                    break;
+            }
+        }
+        else {
+            element.style.border = styles.input.border;
+        }
+        element.style.outline = '';
+        element.style.boxShadow = '';
         onBlur === null || onBlur === void 0 ? void 0 : onBlur();
     });
 }

package/dist/tokenize/types.d.ts

@@ -1,5 +1,5 @@
 export type PaymentMethodType = 'credit_card' | 'bank_account' | 'paypal' | 'apple_pay' | 'google_pay';
-export type PaymentMethodMode = 'credit_card' | 'bank_account';
+export type PaymentMethodMode = 'credit_card' | 'bank_account' | 'paypal';
 export interface PaymentGateway {
     id: string;
     backendName: string;
@@ -106,9 +106,10 @@ export interface PaymentToken {
     paymentTransactionId?: string;
 }
 export type CardType = 'visa' | 'mastercard' | 'amex' | 'discover' | 'diners' | 'jcb' | 'unknown';
-export type TokenizerEvent = 'ready' | 'focus' | 'blur' | 'change' | 'validation' | 'cardTypeChange' | 'error' | 'tokenization' | 'tokenReady';
+export type TokenizerEvent = 'ready' | 'validation' | 'cardTypeChange' | 'error' | 'tokenReady';
 export interface ValidationState {
     isValid: boolean;
+    hasToken?: boolean;
     cardNumber?: {
         isValid: boolean;
         isEmpty: boolean;

package/dist/typeAdapters.js

@@ -111,16 +111,18 @@ function buildCashPaymentPayload(organizationId, input) {
             utmFields.utm_term = input.utm.term;
         }
     }
+    let remainingMeta = input.customerMeta
+        ? Object.assign({}, input.customerMeta) : {};
     if (input.customerMeta) {
         [1, 2, 3, 4, 5].forEach((customNoteIndex) => {
             const key = `custom_note_${customNoteIndex}`;
-            if (input.customerMeta[key]) {
-                donationOptions[key] = input.customerMeta[key];
-                delete input.customerMeta[key];
+            if (remainingMeta[key]) {
+                donationOptions[key] = remainingMeta[key];
+                delete remainingMeta[key];
             }
         });
     }
-    return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, donationOptions), billingAddress), billingContact), payment), utmFields), { customer_meta: input.customerMeta || {}, recaptcha_token: input.recaptchaToken, recaptcha_type: input.recaptchaType });
+    return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, donationOptions), billingAddress), billingContact), payment), utmFields), { customer_meta: remainingMeta, recaptcha_token: input.recaptchaToken, recaptcha_type: input.recaptchaType });
 }
 function buildDonationResult(response) {
     let campaign;

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@idonatedev/idonate-sdk",
 	"author": "iDonate",
-	"version": "1.2.0-dev14",
+	"version": "1.2.0-dev16",
 	"sideEffects": false,
 	"description": "iDonate Web SDK",
 	"engines": {