@tagadapay/plugin-sdk 3.1.8 → 3.1.10

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

@@ -19,8 +19,8 @@
  * const paymentFlowId = stepConfig.paymentFlowId;
  * ```
  */
+import { FunnelState, GTMTrackingConfig, MetaConversionTrackingConfig, PixelTrackingConfig, RuntimeStepConfig, SnapchatTrackingConfig, TrackingProvider } from '../../core/funnelClient';
 import { FunnelAction, FunnelNavigationResult, SimpleFunnelContext } from '../../core/resources/funnel';
-import { FunnelState, RuntimeStepConfig } from '../../core/funnelClient';
 /**
  * Step configuration from HTML injection (for current step/variant)
  */
@@ -48,7 +48,13 @@ export interface StepConfigValue {
     /**
      * Pixel tracking configuration
      */
-    pixels: Record<string, string> | undefined;
+    pixels?: {
+        [TrackingProvider.FACEBOOK]?: PixelTrackingConfig[];
+        [TrackingProvider.TIKTOK]?: PixelTrackingConfig[];
+        [TrackingProvider.SNAPCHAT]?: SnapchatTrackingConfig[];
+        [TrackingProvider.META_CONVERSION]?: MetaConversionTrackingConfig[];
+        [TrackingProvider.GTM]?: GTMTrackingConfig[];
+    };
 }
 export interface FunnelContextValue extends FunnelState {
     currentStep: {

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

@@ -20,8 +20,8 @@
  * ```
  */
 import { useMemo } from 'react';
+import { TrackingProvider, getAssignedPaymentFlowId, getAssignedPixels, getAssignedScripts, getAssignedStaticResources, getAssignedStepConfig } from '../../core/funnelClient';
 import { useTagadaContext } from '../providers/TagadaProvider';
-import { getAssignedStepConfig, getAssignedPaymentFlowId, getAssignedStaticResources, getAssignedScripts, } from '../../core/funnelClient';
 /**
  * Hook to access funnel state and methods
  *
@@ -39,8 +39,8 @@ export function useFunnel() {
             raw,
             paymentFlowId: getAssignedPaymentFlowId(),
             staticResources: getAssignedStaticResources(),
+            pixels: getAssignedPixels(),
             getScripts: (position) => getAssignedScripts(position),
-            pixels: raw?.pixels,
         };
     }, []);
     return {

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

@@ -43,6 +43,7 @@ export interface GooglePlaceDetails {
     };
 }
 export interface ExtractedAddress {
+    subpremise: string;
     streetNumber: string;
     route: string;
     locality: string;
@@ -52,6 +53,14 @@ export interface ExtractedAddress {
     administrativeAreaLevel2Long: string;
     country: string;
     postalCode: string;
+    fullStreetAddress: string;
+}
+export interface FormattedAddress {
+    address1: string;
+    city: string;
+    country: string;
+    state: string;
+    postal: string;
 }
 export interface UseGoogleAutocompleteOptions {
     apiKey: string;
@@ -67,6 +76,7 @@ export interface UseGoogleAutocompleteResult {
     searchPlaces: (input: string, countryRestriction?: string) => void;
     getPlaceDetails: (placeId: string) => Promise<GooglePlaceDetails | null>;
     extractAddressComponents: (place: GooglePlaceDetails) => ExtractedAddress;
+    extractFormattedAddress: (place: GooglePlaceDetails) => FormattedAddress;
     clearPredictions: () => void;
 }
 /**

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

@@ -153,6 +153,7 @@ export function useGoogleAutocomplete(options) {
     // Extract structured address components from Google place
     const extractAddressComponents = useCallback((place) => {
         const extracted = {
+            subpremise: '',
             streetNumber: '',
             route: '',
             locality: '',
@@ -162,9 +163,14 @@ export function useGoogleAutocomplete(options) {
             administrativeAreaLevel2Long: '',
             country: '',
             postalCode: '',
+            fullStreetAddress: '',
         };
         place.address_components?.forEach((component) => {
             const types = component.types;
+            if (types.includes('subpremise')) {
+                // Unit/Apartment number (e.g., "Unit 711", "711", "Apt 5B")
+                extracted.subpremise = component.long_name;
+            }
             if (types.includes('street_number')) {
                 extracted.streetNumber = component.long_name;
             }
@@ -202,8 +208,49 @@ export function useGoogleAutocomplete(options) {
             extracted.administrativeAreaLevel1 = extracted.administrativeAreaLevel2Long || extracted.administrativeAreaLevel2;
             extracted.administrativeAreaLevel1Long = extracted.administrativeAreaLevel2Long;
         }
+        // Construct full street address
+        // Handle different formats:
+        // - "711/3 Network Place" (Australian unit format)
+        // - "3 Network Place" (house number only)
+        // - "Unit 711, 3 Network Place" (alternative format)
+        const streetParts = [];
+        if (extracted.subpremise) {
+            // Check if subpremise already contains formatting (e.g., "Unit 711")
+            const normalizedSubpremise = extracted.subpremise.trim();
+            streetParts.push(normalizedSubpremise);
+        }
+        if (extracted.streetNumber) {
+            streetParts.push(extracted.streetNumber);
+        }
+        if (extracted.route) {
+            streetParts.push(extracted.route);
+        }
+        // For Australian format, if we have both subpremise and streetNumber,
+        // format as "subpremise/streetNumber route" (e.g., "711/3 Network Place")
+        if (extracted.subpremise && extracted.streetNumber && extracted.route) {
+            // Remove "Unit", "Apt", etc. prefixes for cleaner format
+            const cleanSubpremise = extracted.subpremise
+                .replace(/^(Unit|Apt|Apartment|Suite|#)\s*/i, '')
+                .trim();
+            extracted.fullStreetAddress = `${cleanSubpremise}/${extracted.streetNumber} ${extracted.route}`;
+        }
+        else {
+            // Standard format: join all parts with spaces
+            extracted.fullStreetAddress = streetParts.join(' ');
+        }
         return extracted;
     }, []);
+    // Extract address in the format expected by shipping/billing address forms
+    const extractFormattedAddress = useCallback((place) => {
+        const extracted = extractAddressComponents(place);
+        return {
+            address1: extracted.fullStreetAddress || '',
+            city: extracted.locality || '',
+            country: extracted.country || '',
+            state: extracted.administrativeAreaLevel1 || '',
+            postal: extracted.postalCode || '',
+        };
+    }, [extractAddressComponents]);
     // Clear predictions
     const clearPredictions = useCallback(() => {
         setPredictions([]);
@@ -215,6 +262,7 @@ export function useGoogleAutocomplete(options) {
         searchPlaces,
         getPlaceDetails,
         extractAddressComponents,
+        extractFormattedAddress,
         clearPredictions,
     };
 }

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

@@ -0,0 +1,21 @@
+import { CheckoutData } from '../../core/resources/checkout';
+export interface UseGooglePayCheckoutOptions {
+    checkout: CheckoutData | undefined;
+    onSuccess?: (result: {
+        payment: any;
+        order?: any;
+    }) => void;
+    onError?: (error: string) => void;
+    onCancel?: () => void;
+    googlePayConfig?: {
+        merchantId?: string;
+        merchantName?: string;
+        sandboxed?: boolean;
+    };
+}
+export declare function useGooglePayCheckout({ checkout, onSuccess, onError, onCancel, googlePayConfig, }: UseGooglePayCheckoutOptions): {
+    handleGooglePayClick: () => void;
+    processingPayment: boolean;
+    error: string | null;
+    clearError: () => void;
+};

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

@@ -0,0 +1,198 @@
+import { useState, useCallback, useMemo, useEffect } from 'react';
+import { usePaymentQuery } from './usePaymentQuery';
+import { getBasisTheoryKeys } from '../../../config/basisTheory';
+import { useTagadaContext } from '../providers/TagadaProvider';
+export function useGooglePayCheckout({ checkout, onSuccess, onError, onCancel, googlePayConfig, }) {
+    const [processingPayment, setProcessingPayment] = useState(false);
+    const [error, setError] = useState(null);
+    const [paymentMethodConfig, setPaymentMethodConfig] = useState(null);
+    const { processGooglePayPayment } = usePaymentQuery();
+    const { apiService } = useTagadaContext();
+    // Determine Basis Theory keys based on sandboxed flag from payment method config
+    // When sandboxed is true (even on production hostname), use test keys
+    const { basistheoryPublicKey, basistheoryTenantId } = useMemo(() => {
+        const config = googlePayConfig || paymentMethodConfig;
+        // Use test keys if sandboxed is true, production keys only when explicitly sandboxed: false
+        const useProductionKeys = config?.sandboxed === false;
+        const keys = getBasisTheoryKeys(useProductionKeys);
+        console.log('[useGooglePayCheckout] Using Basis Theory keys:', {
+            sandboxed: config?.sandboxed,
+            useProductionKeys,
+            tenantId: keys.tenantId,
+        });
+        return {
+            basistheoryPublicKey: keys.apiKey,
+            basistheoryTenantId: keys.tenantId,
+        };
+    }, [googlePayConfig, paymentMethodConfig]);
+    // Fetch Google Pay payment method configuration
+    useEffect(() => {
+        if (!checkout?.checkoutSession?.id || googlePayConfig)
+            return;
+        const fetchPaymentMethods = async () => {
+            try {
+                const data = await apiService.fetch('/api/v1/payment-methods', {
+                    method: 'GET',
+                    params: { checkoutSessionId: checkout.checkoutSession.id },
+                });
+                const googlePayMethod = data?.find((method) => method.type === 'google_pay');
+                if (googlePayMethod) {
+                    setPaymentMethodConfig(googlePayMethod.metadata);
+                }
+                console.log('googlePayMethod', googlePayMethod);
+            }
+            catch (err) {
+                console.error('Failed to fetch payment methods:', err);
+            }
+        };
+        void fetchPaymentMethods();
+    }, [checkout?.checkoutSession?.id, googlePayConfig, apiService]);
+    // Tokenize Google Pay payment using Basis Theory
+    const tokenizeGooglePay = useCallback(async (paymentData) => {
+        try {
+            // Extract the Google Pay token from the payment data
+            const googlePayTokenString = paymentData.paymentMethodData.tokenizationData.token;
+            const googlePayToken = JSON.parse(googlePayTokenString);
+            const response = await fetch('https://api.basistheory.com/google-pay', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'BT-API-KEY': basistheoryPublicKey,
+                },
+                body: JSON.stringify({
+                    google_payment_data: googlePayToken,
+                }),
+            });
+            if (!response.ok) {
+                throw new Error(`HTTP error! Status: ${response.status}`);
+            }
+            const result = await response.json();
+            return result?.token_intent || result?.google_pay;
+        }
+        catch (err) {
+            console.error('Tokenization failed:', err);
+            throw err;
+        }
+    }, [basistheoryPublicKey]);
+    // Handle Google Pay payment click
+    const handleGooglePayClick = useCallback(() => {
+        // Don't proceed if checkout is not available
+        if (!checkout) {
+            console.error('Checkout data not available');
+            if (onError) {
+                onError('Checkout not ready');
+            }
+            return;
+        }
+        setProcessingPayment(true);
+        // Create Google Pay payment request (simpler than express - no shipping)
+        const paymentRequest = {
+            apiVersion: 2,
+            apiVersionMinor: 0,
+            allowedPaymentMethods: [
+                {
+                    type: 'CARD',
+                    parameters: {
+                        allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
+                        allowedCardNetworks: ['AMEX', 'DISCOVER', 'INTERAC', 'JCB', 'MASTERCARD', 'VISA'],
+                        billingAddressRequired: false,
+                    },
+                    tokenizationSpecification: {
+                        type: 'PAYMENT_GATEWAY',
+                        parameters: {
+                            gateway: 'basistheory',
+                            gatewayMerchantId: basistheoryTenantId,
+                        },
+                    },
+                },
+            ],
+            transactionInfo: {
+                totalPriceStatus: 'FINAL',
+                totalPrice: (checkout.summary.totalAdjustedAmount / 100).toFixed(2),
+                currencyCode: checkout.summary.currency,
+            },
+            merchantInfo: {
+                merchantName: googlePayConfig?.merchantName || paymentMethodConfig?.merchantName || checkout.checkoutSession?.store?.name || 'Store',
+                merchantId: (() => {
+                    const config = googlePayConfig || paymentMethodConfig;
+                    if (!config)
+                        return '12345678901234567890'; // Fallback to test
+                    return config.sandboxed ? '12345678901234567890' : config.merchantId;
+                })(),
+            },
+        };
+        // Determine environment from configuration
+        const config = googlePayConfig || paymentMethodConfig;
+        const environment = config?.sandboxed !== false ? 'TEST' : 'PRODUCTION';
+        // Create Google Pay client
+        const paymentsClient = new google.payments.api.PaymentsClient({ environment });
+        // Load payment data
+        paymentsClient
+            .loadPaymentData(paymentRequest)
+            .then(async (paymentData) => {
+            try {
+                // Tokenize payment
+                const googlePayToken = await tokenizeGooglePay(paymentData);
+                // Process payment via SDK hook
+                const result = await processGooglePayPayment(checkout.checkoutSession.id, googlePayToken, {
+                    onPaymentSuccess: (response) => {
+                        // Keep processing state true during navigation
+                    },
+                    onPaymentFailed: (err) => {
+                        setProcessingPayment(false);
+                        setError(err.message);
+                        if (onError) {
+                            onError(err.message);
+                        }
+                    },
+                });
+                // Call success callback
+                if (onSuccess) {
+                    onSuccess(result);
+                }
+            }
+            catch (error) {
+                console.error('Payment failed:', error);
+                setProcessingPayment(false);
+                const errorMsg = error instanceof Error ? error.message : 'Payment failed';
+                setError(errorMsg);
+                if (onError) {
+                    onError(errorMsg);
+                }
+            }
+        })
+            .catch((error) => {
+            console.error('Google Pay error:', error);
+            setProcessingPayment(false);
+            // Check if user canceled
+            if (error.statusCode === 'CANCELED') {
+                if (onCancel) {
+                    onCancel();
+                }
+                return;
+            }
+            const errorMsg = error.statusMessage || 'Google Pay failed';
+            setError(errorMsg);
+            if (onError) {
+                onError(errorMsg);
+            }
+        });
+    }, [
+        checkout,
+        basistheoryTenantId,
+        tokenizeGooglePay,
+        processGooglePayPayment,
+        onSuccess,
+        onError,
+        onCancel,
+    ]);
+    const clearError = useCallback(() => {
+        setError(null);
+    }, []);
+    return {
+        handleGooglePayClick,
+        processingPayment,
+        error,
+        clearError,
+    };
+}

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

@@ -4,7 +4,7 @@ export interface Payment {
     subStatus: string;
     requireAction: 'none' | 'redirect' | 'error' | 'radar';
     requireActionData?: {
-        type: 'redirect' | 'threeds_auth' | 'processor_auth' | 'error' | 'stripe_radar' | 'finix_radar';
+        type: 'redirect' | 'threeds_auth' | 'processor_auth' | 'error' | 'stripe_radar' | 'finix_radar' | 'radar';
         url?: string;
         processed: boolean;
         processorId?: string;
@@ -26,12 +26,18 @@ export interface Payment {
                 orderId?: string;
                 publishableKey?: string;
             };
+            provider?: string;
+            isTest?: boolean;
         };
         redirectUrl?: string;
         resumeToken?: string;
         message?: string;
         errorCode?: string;
     };
+    order?: {
+        id: string;
+        checkoutSessionId: string;
+    };
 }
 export interface PollingOptions {
     onRequireAction?: (payment: Payment, stop: () => void) => void;

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

@@ -37,9 +37,11 @@ export interface UsePaymentOptions {
 export interface PaymentHook {
     processCardPayment: (checkoutSessionId: string, cardData: CardPaymentMethod, options?: PaymentOptions) => Promise<PaymentResponse>;
     processApplePayPayment: (checkoutSessionId: string, applePayToken: ApplePayToken, options?: PaymentOptions) => Promise<PaymentResponse>;
+    processGooglePayPayment: (checkoutSessionId: string, googlePayToken: any, options?: PaymentOptions) => Promise<PaymentResponse>;
     processPaymentWithInstrument: (checkoutSessionId: string, paymentInstrumentId: string, options?: PaymentOptions) => Promise<PaymentResponse>;
     createCardPaymentInstrument: (cardData: CardPaymentMethod) => Promise<PaymentInstrumentResponse>;
     createApplePayPaymentInstrument: (applePayToken: ApplePayToken) => Promise<PaymentInstrumentResponse>;
+    createGooglePayPaymentInstrument: (googlePayToken: any) => Promise<PaymentInstrumentResponse>;
     getCardPaymentInstruments: () => Promise<PaymentInstrumentCustomerResponse>;
     isLoading: boolean;
     error: string | null;