@tagadapay/plugin-sdk 3.1.0 → 3.1.2

package/dist/external-tracker.js

@@ -1,5 +1,5 @@
 /**
- * TagadaPay External Tracker v3.1.0
+ * TagadaPay External Tracker v3.1.2
  * CDN Bundle - Standalone tracking for external pages (Debug Build)
  * @license MIT
  */

package/dist/external-tracker.min.js

@@ -1,5 +1,5 @@
 /**
- * TagadaPay External Tracker v3.1.0
+ * TagadaPay External Tracker v3.1.2
  * CDN Bundle - Standalone tracking for external pages
  * @license MIT
  */

package/dist/v2/react/components/ApplePayButton.js

@@ -9,6 +9,7 @@ import { OrdersResource } from '../../core/resources/orders';
 import { useExpressPaymentMethods } from '../hooks/useExpressPaymentMethods';
 import { getGlobalApiClient } from '../hooks/useApiQuery';
 import { getBasisTheoryApiKey } from '../../../react/config/payment';
+import { minorUnitsToMajorUnits, getCurrencyInfo } from '../../../react/utils/money';
 export const ApplePayButton = ({ className = '', disabled = false, onSuccess, onError, onCancel, storeName, currencyCode = 'USD', variant = 'default', size = 'lg', checkout, }) => {
     const { applePayPaymentMethod, shippingMethods, lineItems, handleAddExpressId, updateCheckoutSessionValues, updateCustomerEmail, reComputeOrderSummary, setError: setContextError, } = useExpressPaymentMethods();
     const [processingPayment, setProcessingPayment] = useState(false);
@@ -66,6 +67,20 @@ export const ApplePayButton = ({ className = '', disabled = false, onSuccess, on
         };
         checkApplePayAvailability();
     }, [applePayPaymentMethod, handleAddExpressId]);
+    // Helper to convert minor units to currency string for Apple Pay
+    // Uses SDK's minorUnitsToMajorUnits which properly handles different currency decimal places
+    const minorUnitsToCurrencyString = useCallback((amountMinor, currency) => {
+        if (!amountMinor || !currency)
+            return '0.00';
+        const currencyInfo = getCurrencyInfo(currency);
+        if (!currencyInfo) {
+            // Fallback to simple division if currency info not found
+            console.warn(`Currency info not found for ${currency}, using fallback`);
+            return (amountMinor / 100).toFixed(2);
+        }
+        const majorUnits = minorUnitsToMajorUnits(amountMinor, currency);
+        return majorUnits.toFixed(currencyInfo.ISOdigits);
+    }, []);
     // Convert Apple Pay contact to internal Address format
     const applePayContactToAddress = useCallback((contact) => {
         return {
@@ -218,13 +233,13 @@ export const ApplePayButton = ({ className = '', disabled = false, onSuccess, on
             return;
         }
         const paymentRequest = {
-            countryCode: 'US', // TODO: Get from checkout session
-            currencyCode: currencyCode,
+            countryCode: applePayPaymentMethod?.metadata?.country || 'US',
+            currencyCode: checkout.summary.currency,
             supportedNetworks: ['visa', 'masterCard', 'amex', 'discover'],
             merchantCapabilities: ['supports3DS'],
             total: {
                 label: storeName || checkout.checkoutSession.store?.name || 'Total',
-                amount: (checkout.summary.totalAdjustedAmount / 100).toFixed(2),
+                amount: minorUnitsToCurrencyString(checkout.summary.totalAdjustedAmount, checkout.summary.currency),
                 type: 'final',
             },
             lineItems: lineItems.map((item) => ({
@@ -359,7 +374,6 @@ export const ApplePayButton = ({ className = '', disabled = false, onSuccess, on
         isApplePayAvailable,
         processingPayment,
         checkout,
-        currencyCode,
         storeName,
         lineItems,
         shippingMethods,
@@ -371,6 +385,8 @@ export const ApplePayButton = ({ className = '', disabled = false, onSuccess, on
         onCancel,
         onError,
         setContextError,
+        minorUnitsToCurrencyString,
+        applePayPaymentMethod,
     ]);
     // Button size classes
     const sizeClasses = {

package/dist/v2/react/hooks/useApplePay.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Apple Pay Hook for v2 Architecture
+ * Handles Apple Pay payment flow with Basis Theory integration
+ */
+export interface UseApplePayOptions {
+    onSuccess?: (result: any) => void;
+    onError?: (error: string) => void;
+    onCancel?: () => void;
+}
+export interface UseApplePayResult {
+    handleApplePayClick: () => void;
+    processingPayment: boolean;
+    applePayError: string | null;
+    isAvailable: boolean;
+}
+export declare function useApplePay(options?: UseApplePayOptions): UseApplePayResult;

package/dist/v2/react/hooks/useApplePay.js

@@ -0,0 +1,247 @@
+/**
+ * Apple Pay Hook for v2 Architecture
+ * Handles Apple Pay payment flow with Basis Theory integration
+ */
+import { useState, useCallback, useEffect } from 'react';
+import { getBasisTheoryApiKey } from '../../../react/config/payment';
+import { minorUnitsToMajorUnits, getCurrencyInfo } from '../../../react/utils/money';
+import { useCheckoutQuery } from './useCheckoutQuery';
+import { usePaymentQuery } from './usePaymentQuery';
+import { PaymentsResource } from '../../core/resources/payments';
+import { OrdersResource } from '../../core/resources/orders';
+import { getGlobalApiClient } from './useApiQuery';
+export function useApplePay(options = {}) {
+    const [processingPayment, setProcessingPayment] = useState(false);
+    const [error, setError] = useState(null);
+    const [isAvailable, setIsAvailable] = useState(false);
+    const { checkout } = useCheckoutQuery();
+    const { createApplePayPaymentInstrument } = usePaymentQuery();
+    const checkoutSessionId = checkout?.checkoutSession?.id;
+    const store = checkout?.checkoutSession?.store;
+    const summary = checkout?.summary;
+    const basistheoryPublicKey = getBasisTheoryApiKey();
+    // Create SDK resource clients
+    const paymentsResource = new PaymentsResource(getGlobalApiClient());
+    const ordersResource = new OrdersResource(getGlobalApiClient());
+    // Helper to convert minor units to currency string for Apple Pay
+    const minorUnitsToCurrencyString = useCallback((amountMinor, currency) => {
+        if (!amountMinor || !currency)
+            return '0.00';
+        const currencyInfo = getCurrencyInfo(currency);
+        if (!currencyInfo) {
+            console.warn(`Currency info not found for ${currency}, using fallback`);
+            return (amountMinor / 100).toFixed(2);
+        }
+        const majorUnits = minorUnitsToMajorUnits(amountMinor, currency);
+        return majorUnits.toFixed(currencyInfo.ISOdigits);
+    }, []);
+    // Check Apple Pay availability on mount
+    useEffect(() => {
+        const checkApplePayAvailability = () => {
+            if (typeof window === 'undefined' || !window.ApplePaySession) {
+                setIsAvailable(false);
+                return;
+            }
+            try {
+                const canMakePayments = window.ApplePaySession.canMakePayments();
+                setIsAvailable(canMakePayments);
+            }
+            catch (error) {
+                console.error('Error checking Apple Pay availability:', error);
+                setIsAvailable(false);
+            }
+        };
+        checkApplePayAvailability();
+    }, []);
+    // Validate merchant with Basis Theory
+    const validateMerchant = useCallback(async () => {
+        try {
+            const response = await fetch('https://api.basistheory.com/apple-pay/session', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'BT-API-KEY': basistheoryPublicKey,
+                },
+                body: JSON.stringify({
+                    display_name: store?.name || 'Store',
+                    domain: window.location.host,
+                }),
+            });
+            if (!response.ok) {
+                throw new Error(`HTTP error! Status: ${response.status}`);
+            }
+            return response.json();
+        }
+        catch (err) {
+            console.error('Merchant validation failed:', err);
+            throw err;
+        }
+    }, [basistheoryPublicKey, store?.name]);
+    // Tokenize Apple Pay payment with Basis Theory
+    const tokenizeApplePay = useCallback(async (event) => {
+        try {
+            const response = await fetch('https://api.basistheory.com/apple-pay', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'BT-API-KEY': basistheoryPublicKey,
+                },
+                body: JSON.stringify({
+                    apple_payment_data: event.payment.token,
+                }),
+            });
+            if (!response.ok) {
+                setError('Payment Failed');
+                throw new Error(`HTTP error! Status: ${response.status}`);
+            }
+            const result = await response.json();
+            return result.apple_pay; // Basis Theory returns the Apple Pay token in the apple_pay field
+        }
+        catch (error) {
+            console.error('Tokenization failed:', error);
+            throw error;
+        }
+    }, [basistheoryPublicKey]);
+    // Charge payment using SDK methods
+    const chargePayment = useCallback(async (applePayToken) => {
+        if (!checkoutSessionId) {
+            throw new Error('Checkout session ID not available');
+        }
+        setProcessingPayment(true);
+        try {
+            // 1. Tokenize with Basis Theory (already done - we have applePayToken)
+            // 2. Create payment instrument from the tokenized Apple Pay payment
+            const paymentInstrumentData = {
+                type: 'apple_pay',
+                token: applePayToken.id,
+                dpanType: applePayToken.type,
+                card: {
+                    bin: applePayToken.card.bin,
+                    last4: applePayToken.card.last4,
+                    expirationMonth: applePayToken.card.expiration_month,
+                    expirationYear: applePayToken.card.expiration_year,
+                    brand: applePayToken.card.brand,
+                },
+            };
+            const paymentInstrument = await paymentsResource.createPaymentInstrument(paymentInstrumentData);
+            if (!paymentInstrument?.id) {
+                throw new Error('Failed to create payment instrument');
+            }
+            // 3. Create order from checkout session
+            const orderResponse = await ordersResource.createOrder(checkoutSessionId);
+            if (!orderResponse?.success || !orderResponse?.order?.id) {
+                throw new Error('Failed to create order');
+            }
+            // 4. Process payment
+            const paymentResult = await paymentsResource.processPaymentDirect(checkoutSessionId, paymentInstrument.id, undefined, {
+                initiatedBy: 'customer',
+                source: 'checkout',
+            });
+            if (options.onSuccess) {
+                options.onSuccess(paymentResult);
+            }
+            return paymentResult;
+        }
+        catch (error) {
+            console.error('Payment failed:', error);
+            const errorMessage = error instanceof Error ? error.message : 'Payment Failed';
+            setError(errorMessage);
+            if (options.onError) {
+                options.onError(errorMessage);
+            }
+            throw error;
+        }
+        finally {
+            setProcessingPayment(false);
+        }
+    }, [checkoutSessionId, paymentsResource, ordersResource, options]);
+    // Handle Apple Pay button click - opens Apple Pay sheet
+    const handleApplePayClick = useCallback(() => {
+        if (!summary || !store) {
+            console.error('Order summary or store not available');
+            return;
+        }
+        const total = {
+            label: store.name || 'Store',
+            amount: minorUnitsToCurrencyString(summary.totalAdjustedAmount, summary.currency),
+            type: 'final',
+        };
+        const lineItems = [
+            {
+                label: 'Subtotal',
+                amount: minorUnitsToCurrencyString(summary.subtotalAdjustedAmount, summary.currency),
+                type: 'final',
+            },
+            {
+                label: 'Shipping',
+                amount: minorUnitsToCurrencyString(summary.shippingCost ?? 0, summary.currency),
+                type: 'final',
+            },
+            {
+                label: 'Tax',
+                amount: minorUnitsToCurrencyString(summary.totalTaxAmount, summary.currency),
+                type: 'final',
+            },
+        ];
+        const request = {
+            countryCode: 'US', // TODO: Get from checkout session metadata
+            currencyCode: summary.currency,
+            supportedNetworks: ['visa', 'masterCard', 'amex', 'discover'],
+            merchantCapabilities: ['supports3DS'],
+            total,
+            lineItems,
+        };
+        try {
+            const session = new ApplePaySession(3, request);
+            session.onvalidatemerchant = (event) => {
+                void (async () => {
+                    try {
+                        console.log('Merchant validation requested for:', event.validationURL);
+                        const merchantSession = await validateMerchant();
+                        session.completeMerchantValidation(merchantSession);
+                    }
+                    catch (error) {
+                        console.error('Merchant validation failed:', error);
+                        session.abort();
+                    }
+                })();
+            };
+            session.onpaymentauthorized = (event) => {
+                void (async () => {
+                    try {
+                        const applePayToken = await tokenizeApplePay(event);
+                        session.completePayment(ApplePaySession.STATUS_SUCCESS);
+                        await chargePayment(applePayToken);
+                    }
+                    catch (error) {
+                        console.error('Payment processing failed:', error);
+                        session.completePayment(ApplePaySession.STATUS_FAILURE);
+                    }
+                })();
+            };
+            session.onerror = (event) => {
+                console.error('Apple Pay Session Error:', event);
+            };
+            session.oncancel = () => {
+                console.log('Payment cancelled by user');
+                if (options.onCancel) {
+                    options.onCancel();
+                }
+            };
+            session.begin();
+        }
+        catch (error) {
+            console.error('Failed to start Apple Pay session:', error);
+            setError('Failed to start Apple Pay session');
+            if (options.onError) {
+                options.onError('Failed to start Apple Pay session');
+            }
+        }
+    }, [summary, store, minorUnitsToCurrencyString, validateMerchant, tokenizeApplePay, chargePayment, options]);
+    return {
+        handleApplePayClick,
+        processingPayment,
+        applePayError: error,
+        isAvailable,
+    };
+}

package/dist/v2/react/hooks/usePaymentQuery.js

@@ -127,30 +127,33 @@ export function usePaymentQuery() {
                     }
                 }
                 break;
-            case 'processor_auth':
+            case 'processor_auth': {
+                // Always auto-redirect for processor auth (e.g., 3DS, external payment flows)
+                if (actionData.metadata?.redirect?.redirectUrl) {
+                    window.location.href = actionData.metadata.redirect.redirectUrl;
+                }
+                break;
+            }
             case 'redirect': {
+                // For redirect type, let funnel orchestrator handle navigation via callbacks
                 // Only auto-redirect if explicitly enabled (disableAutoRedirect: false)
-                // Default behavior: disable redirects and let funnel orchestrator handle navigation
-                const shouldRedirect = options.disableAutoRedirect === false;
-                if (shouldRedirect && actionData.metadata?.redirect?.redirectUrl) {
+                const shouldAutoRedirect = options.disableAutoRedirect === false;
+                if (shouldAutoRedirect && actionData.metadata?.redirect?.redirectUrl) {
                     window.location.href = actionData.metadata.redirect.redirectUrl;
                 }
-                else {
-                    // If auto-redirect is disabled AND payment succeeded, call success callbacks
-                    // This allows funnel orchestrator to handle navigation
-                    if (payment.status === 'succeeded') {
-                        setIsLoading(false);
-                        const response = {
-                            paymentId: payment.id,
-                            payment,
-                            // Extract order from payment if available (for funnel path resolution)
-                            order: payment.order,
-                        };
-                        // Legacy callback (backwards compatibility)
-                        options.onSuccess?.(response);
-                        // Funnel-aligned callback (recommended)
-                        options.onPaymentSuccess?.(response);
-                    }
+                else if (payment.status === 'succeeded') {
+                    // Payment succeeded - call success callbacks for funnel navigation
+                    setIsLoading(false);
+                    const response = {
+                        paymentId: payment.id,
+                        payment,
+                        // Extract order from payment if available (for funnel path resolution)
+                        order: payment.order,
+                    };
+                    // Legacy callback (backwards compatibility)
+                    options.onSuccess?.(response);
+                    // Funnel-aligned callback (recommended)
+                    options.onPaymentSuccess?.(response);
                 }
                 break;
             }

package/dist/v2/react/index.d.ts

@@ -7,6 +7,7 @@ export { TagadaProvider, useTagadaContext } from './providers/TagadaProvider';
 export type { DebugScript } from './providers/TagadaProvider';
 export { ApplePayButton } from './components/ApplePayButton';
 export { GooglePayButton } from './components/GooglePayButton';
+export { useApplePay } from './hooks/useApplePay';
 export { useAuth } from './hooks/useAuth';
 export { useCheckoutToken } from './hooks/useCheckoutToken';
 export { useClubOffers } from './hooks/useClubOffers';
@@ -42,6 +43,7 @@ export { useTranslation } from './hooks/useTranslation';
 export { useVipOffersQuery as useVipOffers } from './hooks/useVipOffersQuery';
 export { useFunnel } from './hooks/useFunnel';
 export { useFunnel as useFunnelLegacy, useSimpleFunnel } from './hooks/useFunnelLegacy';
+export type { UseApplePayOptions, UseApplePayResult } from './hooks/useApplePay';
 export type { UseCheckoutTokenOptions, UseCheckoutTokenResult } from './hooks/useCheckoutToken';
 export type { ClubOffer, ClubOfferItem, ClubOfferLineItem, ClubOfferSummary, UseClubOffersOptions, UseClubOffersResult } from './hooks/useClubOffers';
 export type { UseCreditsOptions, UseCreditsResult } from './hooks/useCredits';

package/dist/v2/react/index.js

@@ -9,6 +9,7 @@ export { TagadaProvider, useTagadaContext } from './providers/TagadaProvider';
 export { ApplePayButton } from './components/ApplePayButton';
 export { GooglePayButton } from './components/GooglePayButton';
 // Hooks
+export { useApplePay } from './hooks/useApplePay';
 export { useAuth } from './hooks/useAuth';
 export { useCheckoutToken } from './hooks/useCheckoutToken';
 export { useClubOffers } from './hooks/useClubOffers';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tagadapay/plugin-sdk",
-  "version": "3.1.0",
+  "version": "3.1.2",
   "description": "Modern React SDK for building Tagada Pay plugins",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",