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

package/dist/constants.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CLIENT_HEADERS = exports.CARD_CONNECT_DEFAULT_STYLE = exports.DEFAULT_APP_NAME = exports.DEFAULT_CF_TURNSTILE_CDN_EXPLICIT_URL = exports.FALLBACK_CF_TURNSTILE_SITE_KEY = exports.FALLBACK_PC_SCRIPT_ID = exports.FALLBACK_PC_SCRIPT_URL = exports.SANDBOX_APPLE_PAY_URL = exports.APPLE_PAY_URL = exports.SPREEDLY_TOKENIZER_URL = exports.SANDBOX_CARD_CONNECT_BASE_URL = exports.PRODUCTION_CARD_CONNECT_BASE_URL = exports.SANDBOX_BASE_URL = exports.PRODUCTION_BASE_URL = exports.SDK_VERSION = void 0;
-exports.SDK_VERSION = '1.2.0-dev14';
+exports.SDK_VERSION = '1.2.0-dev16';
 exports.PRODUCTION_BASE_URL = 'https://secure-api.idonate.com';
 exports.SANDBOX_BASE_URL = 'https://api.qa-idonate.com';
 exports.PRODUCTION_CARD_CONNECT_BASE_URL = 'https://boltgw.cardconnect.com:8443';

package/dist/esm/constants.js

@@ -1,4 +1,4 @@
-export const SDK_VERSION = '1.2.0-dev14';
+export const SDK_VERSION = '1.2.0-dev16';
 export const PRODUCTION_BASE_URL = 'https://secure-api.idonate.com';
 export const SANDBOX_BASE_URL = 'https://api.qa-idonate.com';
 export const PRODUCTION_CARD_CONNECT_BASE_URL = 'https://boltgw.cardconnect.com:8443';

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

@@ -16,10 +16,13 @@ export declare class CardConnectTokenizer extends Tokenizer {
     private accountTypeEl?;
     private enableTestMode;
     private cachedTokenResult?;
+    private acceptAutoToken;
     private tokenizationPromise?;
     private tokenizationResolve?;
     private tokenizationReject?;
     private currentCardType?;
+    private tokenizationTimeout?;
+    private mergedStyles?;
     private constructor();
     static create(gateway: PaymentGateway, container: TokenizerContainer, config: {
         organizationId: string;
@@ -29,6 +32,8 @@ export declare class CardConnectTokenizer extends Tokenizer {
     private createInternalElements;
     private createCreditCardFields;
     private createBankAccountFields;
+    private addBankAccountValidationListeners;
+    private updateBankAccountValidation;
     private init;
     tokenize(paymentData: PaymentData): Promise<PaymentToken>;
     private tokenizeCardInternal;
@@ -47,5 +52,5 @@ export declare class CardConnectTokenizer extends Tokenizer {
     private static generateIframeUrl;
     private static createIframe;
     private static generateCardConnectCss;
-    static tokenizeBankAccount(routingNumber: string, accountNumber: string, config: ConfigHandler): Promise<TokenizeCardConnectBankAccountResult>;
+    static tokenizeBankAccount(routingNumber: string, accountNumber: string, configOrBaseUrl: ConfigHandler | string): Promise<TokenizeCardConnectBankAccountResult>;
 }

package/dist/esm/tokenize/CardConnectTokenizer.js

@@ -9,7 +9,6 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { Tokenizer } from './Tokenizer';
 import { TokenizationError, } from './types';
-import ConfigHandler from '../config-handler';
 import { DEFAULT_UNIFIED_STYLES, mergeStyles, getContainerStylesForLayout, } from './styles';
 import { INIT_TIMEOUT, TOKENIZE_TIMEOUT, BANK_FIELD_FLEX, RESPONSIVE_BREAKPOINT, } from './tokenizer-constants';
 import { createInputElement, validateRoutingNumber, validateAccountNumber, createAccountTypeSelect, } from './tokenizer-utils';
@@ -20,6 +19,7 @@ export class CardConnectTokenizer extends Tokenizer {
         this.containerId = containerId;
         this.layout = layout;
         this.enableTestMode = false;
+        this.acceptAutoToken = true;
         this.mode = mode;
         this.enableTestMode = enableTestMode;
         this.iframe = iframe;
@@ -34,7 +34,7 @@ export class CardConnectTokenizer extends Tokenizer {
     }
     static create(gateway, container, config) {
         return __awaiter(this, void 0, void 0, function* () {
-            var _a;
+            var _a, _b;
             if (container.mode === 'bank_account' && container.bankCountry === 'CA') {
                 throw new Error('CardConnect does not support Canadian bank accounts');
             }
@@ -42,7 +42,7 @@ export class CardConnectTokenizer extends Tokenizer {
             if (container.layout === 'responsive') {
                 const containerEl = document.getElementById(container.containerId);
                 const containerWidth = (containerEl === null || containerEl === void 0 ? void 0 : containerEl.offsetWidth) || 0;
-                const breakpoint = container.responsiveBreakpoint || RESPONSIVE_BREAKPOINT;
+                const breakpoint = (_a = container.responsiveBreakpoint) !== null && _a !== void 0 ? _a : RESPONSIVE_BREAKPOINT;
                 effectiveLayout =
                     containerWidth < breakpoint ? 'two-line' : 'single-line';
             }
@@ -50,8 +50,7 @@ export class CardConnectTokenizer extends Tokenizer {
                 effectiveLayout = 'two-line';
             }
             const resolvedContainer = Object.assign(Object.assign({}, container), { layout: effectiveLayout });
-            let baseUrl = ((_a = gateway.config) === null || _a === void 0 ? void 0 : _a.baseUrl) || config.clientConfig.cardConnectBaseUrl;
-            config.cardConnectBaseUrl = baseUrl;
+            const baseUrl = ((_b = gateway.config) === null || _b === void 0 ? void 0 : _b.baseUrl) || config.clientConfig.cardConnectBaseUrl;
             const mergedStyles = mergeStyles(DEFAULT_UNIFIED_STYLES, container.styling);
             const iframeUrl = CardConnectTokenizer.generateIframeUrl(baseUrl, resolvedContainer);
             const iframe = CardConnectTokenizer.createIframe(iframeUrl, mergedStyles);
@@ -139,6 +138,66 @@ export class CardConnectTokenizer extends Tokenizer {
             this.applyInputStyles(this.accountTypeEl, mergedStyles, 'right');
             containerEl.appendChild(this.accountTypeEl);
         }
+        this.mergedStyles = mergedStyles;
+        this.currentValidationState = {
+            isValid: false,
+            routingNumber: { isValid: false, isEmpty: true },
+            accountNumber: { isValid: false, isEmpty: true },
+        };
+        this.addBankAccountValidationListeners(mergedStyles);
+    }
+    addBankAccountValidationListeners(styles) {
+        if (this.routingNumberEl) {
+            this.routingNumberEl.addEventListener('blur', () => {
+                this.updateBankAccountValidation(styles);
+            });
+            this.routingNumberEl.addEventListener('input', () => {
+                this.updateBankAccountValidation(styles);
+            });
+        }
+        if (this.accountNumberEl) {
+            this.accountNumberEl.addEventListener('blur', () => {
+                this.updateBankAccountValidation(styles);
+            });
+            this.accountNumberEl.addEventListener('input', () => {
+                this.updateBankAccountValidation(styles);
+            });
+        }
+    }
+    updateBankAccountValidation(styles) {
+        var _a, _b;
+        const routingValue = ((_a = this.routingNumberEl) === null || _a === void 0 ? void 0 : _a.value) || '';
+        const accountValue = ((_b = this.accountNumberEl) === null || _b === void 0 ? void 0 : _b.value) || '';
+        const routingValid = routingValue.length > 0 && validateRoutingNumber(routingValue);
+        const accountValid = accountValue.length > 0 && validateAccountNumber(accountValue);
+        if (this.routingNumberEl) {
+            if (routingValue.length > 0 && !routingValid) {
+                this.routingNumberEl.style.borderColor = styles.error.borderColor;
+            }
+            else {
+                this.routingNumberEl.style.borderColor = '';
+            }
+        }
+        if (this.accountNumberEl) {
+            if (accountValue.length > 0 && !accountValid) {
+                this.accountNumberEl.style.borderColor = styles.error.borderColor;
+            }
+            else {
+                this.accountNumberEl.style.borderColor = '';
+            }
+        }
+        this.currentValidationState = {
+            isValid: routingValid && accountValid,
+            routingNumber: {
+                isValid: routingValid,
+                isEmpty: routingValue.length === 0,
+            },
+            accountNumber: {
+                isValid: accountValid,
+                isEmpty: accountValue.length === 0,
+            },
+        };
+        this.emit('validation', this.currentValidationState);
     }
     init() {
         return __awaiter(this, void 0, void 0, function* () {
@@ -208,31 +267,39 @@ export class CardConnectTokenizer extends Tokenizer {
     }
     tokenizeCardInternal(cardData) {
         return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c;
             if (this.cachedTokenResult && this.cachedTokenResult.errorCode === '0') {
+                const cardType = this.cachedTokenResult.cardType
+                    ? this.normalizeCardType(this.cachedTokenResult.cardType)
+                    : this.normalizeCardType('unknown');
                 return {
                     token: this.cachedTokenResult.token,
-                    lastFour: this.cachedTokenResult.token.slice(-4),
-                    cardType: this.normalizeCardType('unknown'),
+                    lastFour: this.cachedTokenResult.last4 ||
+                        this.cachedTokenResult.token.slice(-4),
+                    cardType,
+                    paymentMethodType: 'credit_card',
                     provider: 'cardconnect',
                 };
             }
             if (this.tokenizationPromise) {
                 return this.tokenizationPromise;
             }
+            if (!this.currentValidationState.isValid &&
+                (((_a = this.currentValidationState.cardNumber) === null || _a === void 0 ? void 0 : _a.isEmpty) ||
+                    ((_b = this.currentValidationState.cvv) === null || _b === void 0 ? void 0 : _b.isEmpty) ||
+                    ((_c = this.currentValidationState.expiry) === null || _c === void 0 ? void 0 : _c.isEmpty))) {
+                throw new TokenizationError('Card fields are incomplete', 'VALIDATION_ERROR');
+            }
             this.tokenizationPromise = new Promise((resolve, reject) => {
                 this.tokenizationResolve = resolve;
                 this.tokenizationReject = reject;
-                const timeout = setTimeout(() => {
+                this.tokenizationTimeout = setTimeout(() => {
+                    this.tokenizationTimeout = undefined;
                     this.tokenizationPromise = undefined;
                     this.tokenizationResolve = undefined;
                     this.tokenizationReject = undefined;
                     reject(new TokenizationError('Tokenization timeout - ensure all card fields are filled in iframe', 'TIMEOUT'));
                 }, TOKENIZE_TIMEOUT);
-                const tokenizationHandler = (data) => {
-                    clearTimeout(timeout);
-                    this.off('tokenization', tokenizationHandler);
-                };
-                this.on('tokenization', tokenizationHandler);
             });
             return this.tokenizationPromise;
         });
@@ -254,16 +321,16 @@ export class CardConnectTokenizer extends Tokenizer {
                 throw new TokenizationError('Invalid account number', 'VALIDATION_ERROR');
             }
             const baseUrl = new URL(this.iframeUrl).origin;
-            const config = new ConfigHandler({});
-            config.cardConnectBaseUrl = baseUrl;
-            const result = yield CardConnectTokenizer.tokenizeBankAccount(routingNumber, accountNumber, config);
-            return {
+            const result = yield CardConnectTokenizer.tokenizeBankAccount(routingNumber, accountNumber, baseUrl);
+            const paymentToken = {
                 token: result.token,
                 lastFour: accountNumber.slice(-4),
                 accountType: accountType,
                 paymentMethodType: 'bank_account',
                 provider: 'cardconnect',
             };
+            this.emit('tokenReady', paymentToken);
+            return paymentToken;
         });
     }
     validate() {
@@ -400,12 +467,39 @@ export class CardConnectTokenizer extends Tokenizer {
                 action: 'clear',
             }, this.expectedOrigin);
         }
-        this.currentValidationState = {
-            isValid: false,
-            cardNumber: { isValid: false, isEmpty: true },
-            cvv: { isValid: false, isEmpty: true },
-            expiry: { isValid: false, isEmpty: true },
-        };
+        this.cachedTokenResult = undefined;
+        this.acceptAutoToken = false;
+        if (this.tokenizationTimeout) {
+            clearTimeout(this.tokenizationTimeout);
+            this.tokenizationTimeout = undefined;
+        }
+        if (this.tokenizationReject) {
+            const reject = this.tokenizationReject;
+            this.tokenizationPromise = undefined;
+            this.tokenizationResolve = undefined;
+            this.tokenizationReject = undefined;
+            reject(new TokenizationError('Tokenizer cleared', 'CLEARED'));
+        }
+        else {
+            this.tokenizationPromise = undefined;
+            this.tokenizationResolve = undefined;
+            this.tokenizationReject = undefined;
+        }
+        if (this.mode === 'bank_account') {
+            this.currentValidationState = {
+                isValid: false,
+                routingNumber: { isValid: false, isEmpty: true },
+                accountNumber: { isValid: false, isEmpty: true },
+            };
+        }
+        else {
+            this.currentValidationState = {
+                isValid: false,
+                cardNumber: { isValid: false, isEmpty: true },
+                cvv: { isValid: false, isEmpty: true },
+                expiry: { isValid: false, isEmpty: true },
+            };
+        }
         this.emit('validation', this.currentValidationState);
     }
     focus(field) {
@@ -434,8 +528,22 @@ export class CardConnectTokenizer extends Tokenizer {
         }
     }
     destroy() {
+        this.markDestroyed();
+        if (this.tokenizationTimeout) {
+            clearTimeout(this.tokenizationTimeout);
+            this.tokenizationTimeout = undefined;
+        }
+        if (this.tokenizationReject) {
+            const reject = this.tokenizationReject;
+            this.tokenizationPromise = undefined;
+            this.tokenizationResolve = undefined;
+            this.tokenizationReject = undefined;
+            reject(new TokenizationError('Tokenizer destroyed', 'DESTROYED'));
+        }
+        this.cachedTokenResult = undefined;
         if (this.messageHandler) {
             window.removeEventListener('message', this.messageHandler);
+            this.messageHandler = undefined;
         }
         if (this.containerEl) {
             this.containerEl.innerHTML = '';
@@ -462,6 +570,7 @@ export class CardConnectTokenizer extends Tokenizer {
                 lastFour: this.cachedTokenResult.last4 ||
                     this.cachedTokenResult.token.slice(-4),
                 cardType,
+                paymentMethodType: 'credit_card',
                 provider: 'cardconnect',
             };
         }
@@ -474,8 +583,14 @@ export class CardConnectTokenizer extends Tokenizer {
         try {
             const data = typeof event.data === 'string' ? JSON.parse(event.data) : event.data;
             if (data.token && data.errorCode !== undefined) {
+                if (!this.acceptAutoToken && !this.tokenizationResolve) {
+                    return;
+                }
                 this.cachedTokenResult = data;
-                this.emit('tokenization', data);
+                if (this.tokenizationTimeout) {
+                    clearTimeout(this.tokenizationTimeout);
+                    this.tokenizationTimeout = undefined;
+                }
                 if (data.errorCode === '0') {
                     const cardType = data.cardType
                         ? this.normalizeCardType(data.cardType)
@@ -488,6 +603,7 @@ export class CardConnectTokenizer extends Tokenizer {
                         token: data.token,
                         lastFour: data.last4 || data.token.slice(-4),
                         cardType,
+                        paymentMethodType: 'credit_card',
                         provider: 'cardconnect',
                     };
                     if (this.tokenizationResolve) {
@@ -502,12 +618,14 @@ export class CardConnectTokenizer extends Tokenizer {
                         cvv: { isValid: true, isEmpty: false },
                         expiry: { isValid: true, isEmpty: false },
                     };
-                    this.emit('validation', { isValid: true });
+                    this.emit('validation', this.currentValidationState);
                     this.emit('tokenReady', token);
                 }
                 else {
+                    const error = new TokenizationError(data.errorMessage || 'Tokenization failed', data.errorCode || 'UNKNOWN');
+                    this.emit('error', error);
                     if (this.tokenizationReject) {
-                        this.tokenizationReject(new TokenizationError(data.errorMessage || 'Tokenization failed', data.errorCode || 'UNKNOWN'));
+                        this.tokenizationReject(error);
                         this.tokenizationPromise = undefined;
                         this.tokenizationResolve = undefined;
                         this.tokenizationReject = undefined;
@@ -515,19 +633,16 @@ export class CardConnectTokenizer extends Tokenizer {
                 }
             }
             if (data.event === 'validation' || data.validationError !== undefined) {
+                this.acceptAutoToken = true;
                 this.handleValidationMessage(data);
             }
-            if (data.event === 'focus' || data.event === 'blur') {
-                this.emit(data.event, { field: data.data });
-            }
-            if (data.event === 'input' || data.event === 'change') {
-                this.emit('change', { field: data.data });
-                if (data.cardType) {
-                    const cardType = this.normalizeCardType(data.cardType);
-                    if (cardType !== this.currentCardType) {
-                        this.currentCardType = cardType;
-                        this.emit('cardTypeChange', { cardType });
-                    }
+            if ((data.event === 'input' || data.event === 'change') &&
+                data.cardType) {
+                this.acceptAutoToken = true;
+                const cardType = this.normalizeCardType(data.cardType);
+                if (cardType !== this.currentCardType) {
+                    this.currentCardType = cardType;
+                    this.emit('cardTypeChange', { cardType });
                 }
             }
         }
@@ -535,7 +650,6 @@ export class CardConnectTokenizer extends Tokenizer {
         }
     }
     handleValidationMessage(data) {
-        var _a, _b, _c, _d, _e, _f;
         if (data.validationError) {
             const errorLower = data.validationError.toLowerCase();
             if (errorLower.includes('card') || errorLower.includes('number')) {
@@ -557,10 +671,14 @@ export class CardConnectTokenizer extends Tokenizer {
             this.emit('validation', this.currentValidationState);
         }
         else {
-            this.currentValidationState.isValid =
-                ((_b = (_a = this.currentValidationState.cardNumber) === null || _a === void 0 ? void 0 : _a.isValid) !== null && _b !== void 0 ? _b : false) &&
-                    ((_d = (_c = this.currentValidationState.cvv) === null || _c === void 0 ? void 0 : _c.isValid) !== null && _d !== void 0 ? _d : false) &&
-                    ((_f = (_e = this.currentValidationState.expiry) === null || _e === void 0 ? void 0 : _e.isValid) !== null && _f !== void 0 ? _f : false);
+            this.currentValidationState.cardNumber = {
+                isValid: true,
+                isEmpty: false,
+            };
+            this.currentValidationState.cvv = { isValid: true, isEmpty: false };
+            this.currentValidationState.expiry = { isValid: true, isEmpty: false };
+            this.currentValidationState.isValid = true;
+            this.emit('validation', this.currentValidationState);
         }
     }
     static generateIframeUrl(baseUrl, container) {
@@ -740,16 +858,29 @@ export class CardConnectTokenizer extends Tokenizer {
         }
         return encodeURIComponent(css.join(''));
     }
-    static tokenizeBankAccount(routingNumber, accountNumber, config) {
-        return fetch(`${config.cardConnectBaseUrl}/cardsecure/api/v1/ccn/tokenize`, {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
-            body: JSON.stringify({
-                account: `${routingNumber}/${accountNumber}`,
-                unique: true,
-            }),
-        }).then((response) => response.json());
+    static tokenizeBankAccount(routingNumber, accountNumber, configOrBaseUrl) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const baseUrl = typeof configOrBaseUrl === 'string'
+                ? configOrBaseUrl
+                : configOrBaseUrl.cardConnectBaseUrl;
+            const response = yield fetch(`${baseUrl}/cardsecure/api/v1/ccn/tokenize`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                    account: `${routingNumber}/${accountNumber}`,
+                    unique: true,
+                }),
+            });
+            if (!response.ok) {
+                throw new TokenizationError(`Bank account tokenization failed: HTTP ${response.status}`, 'API_ERROR');
+            }
+            const result = yield response.json();
+            if (!result.token) {
+                throw new TokenizationError(result.message || 'Bank account tokenization failed: no token returned', 'API_ERROR');
+            }
+            return result;
+        });
     }
 }

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

@@ -41,6 +41,7 @@ export declare class PayPalTokenizer extends Tokenizer {
     private configContext;
     private containerEl?;
     private paypalButtonContainer?;
+    private buttonsInstance?;
     private cachedToken?;
     private currency;
     private amount?;

package/dist/esm/tokenize/PayPalTokenizer.js

@@ -9,6 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { Tokenizer } from './Tokenizer';
 import { TokenizationError, } from './types';
+import { CLIENT_HEADERS } from '../constants';
 const PAYPAL_SDK_URL = 'https://www.paypal.com/sdk/js';
 const PAYPAL_SCRIPT_ID = 'paypal-sdk-script';
 const INIT_TIMEOUT = 10000;
@@ -19,7 +20,7 @@ export class PayPalTokenizer extends Tokenizer {
         this.gateway = gateway;
         this.containerId = containerId;
         this.configContext = configContext;
-        this.mode = 'credit_card';
+        this.mode = 'paypal';
         const gatewayConfig = gateway.config;
         if (!(gatewayConfig === null || gatewayConfig === void 0 ? void 0 : gatewayConfig.client_id)) {
             throw new Error('PayPal gateway configuration missing client_id');
@@ -66,7 +67,7 @@ export class PayPalTokenizer extends Tokenizer {
                 })
                     .then(() => {
                     this.emit('ready');
-                    this.emit('validation', { isValid: true });
+                    this.emit('validation', { isValid: true, hasToken: false });
                     resolve();
                 })
                     .catch((error) => {
@@ -79,11 +80,20 @@ export class PayPalTokenizer extends Tokenizer {
     }
     loadPayPalSDK() {
         return __awaiter(this, void 0, void 0, function* () {
-            if (window.paypal) {
-                return Promise.resolve();
-            }
-            if (document.getElementById(PAYPAL_SCRIPT_ID)) {
-                return this.waitForPayPalGlobal();
+            const configKey = `${this.clientId}|${this.currency}`;
+            const existingScript = document.getElementById(PAYPAL_SCRIPT_ID);
+            if (existingScript) {
+                const loadedConfig = existingScript.getAttribute('data-config-key');
+                if (loadedConfig && loadedConfig !== configKey) {
+                    existingScript.remove();
+                    delete window.paypal;
+                }
+                else if (window.paypal) {
+                    return Promise.resolve();
+                }
+                else {
+                    return this.waitForPayPalGlobal();
+                }
             }
             const params = new URLSearchParams({
                 'client-id': this.clientId,
@@ -102,6 +112,7 @@ export class PayPalTokenizer extends Tokenizer {
             script.id = PAYPAL_SCRIPT_ID;
             script.src = `${PAYPAL_SDK_URL}?${params.toString()}`;
             script.async = true;
+            script.setAttribute('data-config-key', configKey);
             return new Promise((resolve, reject) => {
                 script.onload = () => {
                     this.waitForPayPalGlobal().then(resolve).catch(reject);
@@ -145,7 +156,7 @@ export class PayPalTokenizer extends Tokenizer {
             if (!window.paypal || !this.paypalButtonContainer) {
                 return;
             }
-            const button = window.paypal.Buttons({
+            this.buttonsInstance = window.paypal.Buttons({
                 createOrder: () => this.createOrder(),
                 onApprove: (data) => this.handleApprove(data),
                 onCancel: (data) => this.handleCancel(data),
@@ -156,36 +167,48 @@ export class PayPalTokenizer extends Tokenizer {
                     height: 40,
                 },
             });
-            yield button.render(this.paypalButtonContainer);
+            yield this.buttonsInstance.render(this.paypalButtonContainer);
         });
     }
     createOrder() {
         const endpoint = `${this.clientConfig.embedApiBaseUrl}/payment/paypal/create-order`;
+        this.paymentTransactionId = undefined;
+        this.paymentMethodId = undefined;
         let orderAmount;
         let orderCurrency = this.currency;
         if (this.onCreateOrder) {
-            const orderData = this.onCreateOrder();
-            orderAmount = orderData.amount;
-            orderCurrency = orderData.currency || this.currency;
+            try {
+                const orderData = this.onCreateOrder();
+                orderAmount = orderData.amount;
+                orderCurrency = orderData.currency || this.currency;
+            }
+            catch (err) {
+                const error = err instanceof Error
+                    ? err
+                    : new Error('onCreateOrder callback failed');
+                this.handleError(error, 'Order creation failed');
+                return Promise.reject(error);
+            }
         }
         else {
             orderAmount = this.amount;
         }
-        if (orderAmount === undefined || orderAmount <= 0) {
+        if (orderAmount === undefined || isNaN(orderAmount) || orderAmount <= 0) {
             const error = new Error('Amount is required to create PayPal order');
             this.handleError(error, 'Order creation failed');
             return Promise.reject(error);
         }
         const requestBody = {
             payment_gateway_id: this.gateway.id,
+            organization_id: this.organizationId,
+            embed_id: this.embedId,
             currency: orderCurrency,
             amount: orderAmount,
         };
         return fetch(endpoint, {
             method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
+            headers: CLIENT_HEADERS,
+            credentials: 'include',
             body: JSON.stringify(requestBody),
         })
             .then((response) => {
@@ -212,6 +235,7 @@ export class PayPalTokenizer extends Tokenizer {
             const token = {
                 token: data.orderID,
                 lastFour: data.orderID.slice(-4),
+                paymentMethodType: 'paypal',
                 provider: 'paypal_checkout',
                 paymentMethodId: this.paymentMethodId,
                 paymentTransactionId: this.paymentTransactionId,
@@ -241,6 +265,9 @@ export class PayPalTokenizer extends Tokenizer {
     }
     validate() {
         return __awaiter(this, void 0, void 0, function* () {
+            if (!this.isReady) {
+                throw new Error('Tokenizer not initialized');
+            }
             return {
                 isValid: true,
                 errors: [],
@@ -254,6 +281,15 @@ export class PayPalTokenizer extends Tokenizer {
     focus(field) {
     }
     destroy() {
+        this.markDestroyed();
+        if (this.buttonsInstance) {
+            try {
+                this.buttonsInstance.close();
+            }
+            catch (_a) {
+            }
+            this.buttonsInstance = undefined;
+        }
         if (this.containerEl) {
             this.containerEl.innerHTML = '';
         }

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

@@ -29,6 +29,10 @@ export declare class SpreedlyTokenizer extends Tokenizer {
     private cardNumberDiv?;
     private cvvDiv?;
     private responsiveBreakpoint;
+    private tokenizationPromise?;
+    private tokenizationResolve?;
+    private tokenizationReject?;
+    private tokenizationTimeout?;
     private constructor();
     static create(gateway: PaymentGateway, container: TokenizerContainer, config: {
         organizationId: string;
@@ -38,6 +42,7 @@ export declare class SpreedlyTokenizer extends Tokenizer {
     private init;
     tokenize(paymentData: PaymentData): Promise<PaymentToken>;
     private tokenizeCardInternal;
+    private executeCardTokenization;
     private createCanadianBankAccountFields;
     private tokenizeBankAccountInternal;
     validate(): Promise<ValidationResult>;
@@ -50,6 +55,7 @@ export declare class SpreedlyTokenizer extends Tokenizer {
     private determineLayout;
     private setupResizeObserver;
     private applyLayoutStyles;
+    private clearTokenizationState;
     destroy(): void;
     hasToken(): boolean;
     getToken(): PaymentToken | null;