@solvapay/react 1.0.8-preview.5 → 1.0.8-preview.7

package/dist/index.cjs

@@ -856,11 +856,14 @@ var SolvaPayProvider = ({
       email: purchaseData.email,
       name: purchaseData.name,
       purchases: purchaseData.purchases,
-      hasPurchase: (criteria) => {
-        const productRef = criteria?.productRef;
-        const planRef = criteria?.planRef;
+      hasProduct: (productName) => {
         return purchaseData.purchases.some(
-          (p) => p.status === "active" && (!productRef || p.productRef === productRef) && (!planRef || p.planRef === planRef)
+          (p) => p.productName.toLowerCase() === productName.toLowerCase() && p.status === "active"
+        );
+      },
+      hasPlan: (productName) => {
+        return purchaseData.purchases.some(
+          (p) => p.productName.toLowerCase() === productName.toLowerCase() && p.status === "active"
         );
       },
       activePurchase,
@@ -3541,14 +3544,12 @@ function useGateCtx(part) {
   }
   return ctx;
 }
-var Root5 = (0, import_react22.forwardRef)(function PurchaseGateRoot({ productRef, planRef, asChild, children, ...rest }, forwardedRef) {
+var Root5 = (0, import_react22.forwardRef)(function PurchaseGateRoot({ requirePlan, requireProduct, asChild, children, ...rest }, forwardedRef) {
   const solva = (0, import_react22.useContext)(SolvaPayContext);
   if (!solva) throw new MissingProviderError("PurchaseGate");
-  const { loading, hasPurchase, error } = usePurchase();
-  const hasAccess = (0, import_react22.useMemo)(
-    () => hasPurchase({ productRef, planRef }),
-    [hasPurchase, productRef, planRef]
-  );
+  const { purchases, loading, hasProduct, error } = usePurchase();
+  const productToCheck = requireProduct || requirePlan;
+  const hasAccess = productToCheck ? hasProduct(productToCheck) : purchases.some((p) => p.status === "active");
   const state = loading ? "loading" : hasAccess ? "allowed" : "blocked";
   const ctx = (0, import_react22.useMemo)(
     () => ({ state, loading, hasAccess, error }),

package/dist/index.d.cts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { S as SolvaPayProviderProps, P as PaymentFormProps, a as PrefillCustomer, b as PaymentFormSummary, c as PaymentFormCustomerFields, d as PaymentFormPaymentElement, e as PaymentFormCardElement, f as PaymentFormMandateText, g as PaymentFormTermsCheckbox, h as PaymentFormSubmitButton, i as PaymentFormLoading, j as PaymentFormError, T as TopupFormProps, C as CheckoutResult, k as Plan, A as ActivationResult, l as PurchaseStatus, m as SolvaPayContextValue, U as UsePlansOptions, n as UsePlansReturn, o as UsePlanOptions, p as UsePlanReturn, q as UseProductReturn, r as UseMerchantReturn, s as SolvaPayCopy, t as PurchaseStatusReturn, u as CancelResult, R as ReactivateResult, v as UseTopupOptions, w as UseTopupReturn, B as BalanceStatus, x as UseTopupAmountSelectorOptions, y as UseTopupAmountSelectorReturn, z as PartialSolvaPayCopy, D as PurchaseInfo, E as CheckoutVariant, F as Product } from './CancelPlanButton-DQXUTHmF.cjs';
-export { G as ActivationFlowStep, H as BalanceBadge, I as CancelPlanButton, J as CheckoutSummary, K as CheckoutSummaryProps, L as CustomerPurchaseData, M as MandateContext, N as MandateTemplate, O as MandateText, Q as MandateTextProps, V as Merchant, W as PaymentError, X as PaymentIntentResult, Y as PaymentResult, Z as PlanBadge, _ as ProductBadge, $ as PurchaseGate, a0 as PurchaseStatusValue, a1 as SolvaPayConfig, a2 as TopupPaymentResult, a3 as deriveVariant } from './CancelPlanButton-DQXUTHmF.cjs';
+import { S as SolvaPayProviderProps, P as PaymentFormProps, a as PrefillCustomer, b as PaymentFormSummary, c as PaymentFormCustomerFields, d as PaymentFormPaymentElement, e as PaymentFormCardElement, f as PaymentFormMandateText, g as PaymentFormTermsCheckbox, h as PaymentFormSubmitButton, i as PaymentFormLoading, j as PaymentFormError, T as TopupFormProps, C as CheckoutResult, k as Plan, A as ActivationResult, l as PurchaseStatus, m as SolvaPayContextValue, U as UsePlansOptions, n as UsePlansReturn, o as UsePlanOptions, p as UsePlanReturn, q as UseProductReturn, r as UseMerchantReturn, s as SolvaPayCopy, t as PurchaseStatusReturn, u as CancelResult, R as ReactivateResult, v as UseTopupOptions, w as UseTopupReturn, B as BalanceStatus, x as UseTopupAmountSelectorOptions, y as UseTopupAmountSelectorReturn, z as PartialSolvaPayCopy, D as PurchaseInfo, E as CheckoutVariant, F as Product } from './CancelPlanButton-CieT9swn.cjs';
+export { G as ActivationFlowStep, H as BalanceBadge, I as CancelPlanButton, J as CheckoutSummary, K as CheckoutSummaryProps, L as CustomerPurchaseData, M as MandateContext, N as MandateTemplate, O as MandateText, Q as MandateTextProps, V as Merchant, W as PaymentError, X as PaymentIntentResult, Y as PaymentResult, Z as PlanBadge, _ as ProductBadge, $ as PurchaseGate, a0 as PurchaseStatusValue, a1 as SolvaPayConfig, a2 as TopupPaymentResult, a3 as deriveVariant } from './CancelPlanButton-CieT9swn.cjs';
 import { PaymentIntent, Stripe, StripeElements } from '@stripe/stripe-js';
 import { ActivatePlanResult } from '@solvapay/server';
 export { ActivatePlanResult } from '@solvapay/server';

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { S as SolvaPayProviderProps, P as PaymentFormProps, a as PrefillCustomer, b as PaymentFormSummary, c as PaymentFormCustomerFields, d as PaymentFormPaymentElement, e as PaymentFormCardElement, f as PaymentFormMandateText, g as PaymentFormTermsCheckbox, h as PaymentFormSubmitButton, i as PaymentFormLoading, j as PaymentFormError, T as TopupFormProps, C as CheckoutResult, k as Plan, A as ActivationResult, l as PurchaseStatus, m as SolvaPayContextValue, U as UsePlansOptions, n as UsePlansReturn, o as UsePlanOptions, p as UsePlanReturn, q as UseProductReturn, r as UseMerchantReturn, s as SolvaPayCopy, t as PurchaseStatusReturn, u as CancelResult, R as ReactivateResult, v as UseTopupOptions, w as UseTopupReturn, B as BalanceStatus, x as UseTopupAmountSelectorOptions, y as UseTopupAmountSelectorReturn, z as PartialSolvaPayCopy, D as PurchaseInfo, E as CheckoutVariant, F as Product } from './CancelPlanButton-BKH_yv1d.js';
-export { G as ActivationFlowStep, H as BalanceBadge, I as CancelPlanButton, J as CheckoutSummary, K as CheckoutSummaryProps, L as CustomerPurchaseData, M as MandateContext, N as MandateTemplate, O as MandateText, Q as MandateTextProps, V as Merchant, W as PaymentError, X as PaymentIntentResult, Y as PaymentResult, Z as PlanBadge, _ as ProductBadge, $ as PurchaseGate, a0 as PurchaseStatusValue, a1 as SolvaPayConfig, a2 as TopupPaymentResult, a3 as deriveVariant } from './CancelPlanButton-BKH_yv1d.js';
+import { S as SolvaPayProviderProps, P as PaymentFormProps, a as PrefillCustomer, b as PaymentFormSummary, c as PaymentFormCustomerFields, d as PaymentFormPaymentElement, e as PaymentFormCardElement, f as PaymentFormMandateText, g as PaymentFormTermsCheckbox, h as PaymentFormSubmitButton, i as PaymentFormLoading, j as PaymentFormError, T as TopupFormProps, C as CheckoutResult, k as Plan, A as ActivationResult, l as PurchaseStatus, m as SolvaPayContextValue, U as UsePlansOptions, n as UsePlansReturn, o as UsePlanOptions, p as UsePlanReturn, q as UseProductReturn, r as UseMerchantReturn, s as SolvaPayCopy, t as PurchaseStatusReturn, u as CancelResult, R as ReactivateResult, v as UseTopupOptions, w as UseTopupReturn, B as BalanceStatus, x as UseTopupAmountSelectorOptions, y as UseTopupAmountSelectorReturn, z as PartialSolvaPayCopy, D as PurchaseInfo, E as CheckoutVariant, F as Product } from './CancelPlanButton-f56UlQN-.js';
+export { G as ActivationFlowStep, H as BalanceBadge, I as CancelPlanButton, J as CheckoutSummary, K as CheckoutSummaryProps, L as CustomerPurchaseData, M as MandateContext, N as MandateTemplate, O as MandateText, Q as MandateTextProps, V as Merchant, W as PaymentError, X as PaymentIntentResult, Y as PaymentResult, Z as PlanBadge, _ as ProductBadge, $ as PurchaseGate, a0 as PurchaseStatusValue, a1 as SolvaPayConfig, a2 as TopupPaymentResult, a3 as deriveVariant } from './CancelPlanButton-f56UlQN-.js';
 import { PaymentIntent, Stripe, StripeElements } from '@stripe/stripe-js';
 import { ActivatePlanResult } from '@solvapay/server';
 export { ActivatePlanResult } from '@solvapay/server';

package/dist/index.js

@@ -64,7 +64,7 @@ import {
   useSolvaPay,
   useTopup,
   useTopupAmountSelector
-} from "./chunk-Q7GPX6X4.js";
+} from "./chunk-MOP3ZBGC.js";
 import {
   defaultAuthAdapter
 } from "./chunk-OUSEQRCT.js";

package/dist/primitives/index.cjs

@@ -4055,14 +4055,12 @@ function useGateCtx2(part) {
   }
   return ctx;
 }
-var Root9 = (0, import_react29.forwardRef)(function PurchaseGateRoot({ productRef, planRef, asChild, children, ...rest }, forwardedRef) {
+var Root9 = (0, import_react29.forwardRef)(function PurchaseGateRoot({ requirePlan, requireProduct, asChild, children, ...rest }, forwardedRef) {
   const solva = (0, import_react29.useContext)(SolvaPayContext);
   if (!solva) throw new MissingProviderError("PurchaseGate");
-  const { loading, hasPurchase, error } = usePurchase();
-  const hasAccess = (0, import_react29.useMemo)(
-    () => hasPurchase({ productRef, planRef }),
-    [hasPurchase, productRef, planRef]
-  );
+  const { purchases, loading, hasProduct, error } = usePurchase();
+  const productToCheck = requireProduct || requirePlan;
+  const hasAccess = productToCheck ? hasProduct(productToCheck) : purchases.some((p) => p.status === "active");
   const state = loading ? "loading" : hasAccess ? "allowed" : "blocked";
   const ctx = (0, import_react29.useMemo)(
     () => ({ state, loading, hasAccess, error }),

package/dist/primitives/index.d.cts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import React, { Ref } from 'react';
-import { k as Plan, F as Product, y as UseTopupAmountSelectorReturn, D as PurchaseInfo, T as TopupFormProps } from '../CancelPlanButton-DQXUTHmF.cjs';
-export { a4 as ActivationFlow, a5 as ActivationFlowActivateButton, a6 as ActivationFlowActivated, a7 as ActivationFlowAmountPicker, a8 as ActivationFlowContinueButton, a9 as ActivationFlowError, aa as ActivationFlowLoading, ab as ActivationFlowRetrying, ac as ActivationFlowRoot, G as ActivationFlowStep, ad as ActivationFlowSummary, H as BalanceBadge, I as CancelPlanButton, O as MandateText, Q as MandateTextProps, ae as PaymentForm, e as PaymentFormCardElement, c as PaymentFormCustomerFields, j as PaymentFormError, i as PaymentFormLoading, f as PaymentFormMandateText, d as PaymentFormPaymentElement, af as PaymentFormRoot, h as PaymentFormSubmitButton, b as PaymentFormSummary, g as PaymentFormTermsCheckbox, Z as PlanBadge, _ as ProductBadge, $ as PurchaseGate, ag as PurchaseGateAllowed, ah as PurchaseGateBlocked, ai as PurchaseGateError, aj as PurchaseGateLoading, ak as PurchaseGateRoot, al as useActivationFlow, am as usePurchaseGate } from '../CancelPlanButton-DQXUTHmF.cjs';
+import { k as Plan, F as Product, y as UseTopupAmountSelectorReturn, D as PurchaseInfo, T as TopupFormProps } from '../CancelPlanButton-CieT9swn.cjs';
+export { a4 as ActivationFlow, a5 as ActivationFlowActivateButton, a6 as ActivationFlowActivated, a7 as ActivationFlowAmountPicker, a8 as ActivationFlowContinueButton, a9 as ActivationFlowError, aa as ActivationFlowLoading, ab as ActivationFlowRetrying, ac as ActivationFlowRoot, G as ActivationFlowStep, ad as ActivationFlowSummary, H as BalanceBadge, I as CancelPlanButton, O as MandateText, Q as MandateTextProps, ae as PaymentForm, e as PaymentFormCardElement, c as PaymentFormCustomerFields, j as PaymentFormError, i as PaymentFormLoading, f as PaymentFormMandateText, d as PaymentFormPaymentElement, af as PaymentFormRoot, h as PaymentFormSubmitButton, b as PaymentFormSummary, g as PaymentFormTermsCheckbox, Z as PlanBadge, _ as ProductBadge, $ as PurchaseGate, ag as PurchaseGateAllowed, ah as PurchaseGateBlocked, ai as PurchaseGateError, aj as PurchaseGateLoading, ak as PurchaseGateRoot, al as useActivationFlow, am as usePurchaseGate } from '../CancelPlanButton-CieT9swn.cjs';
 import { PaymentElement } from '@stripe/react-stripe-js';
 import { Stripe, StripeElements } from '@stripe/stripe-js';
 import '@solvapay/server';

package/dist/primitives/index.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import React, { Ref } from 'react';
-import { k as Plan, F as Product, y as UseTopupAmountSelectorReturn, D as PurchaseInfo, T as TopupFormProps } from '../CancelPlanButton-BKH_yv1d.js';
-export { a4 as ActivationFlow, a5 as ActivationFlowActivateButton, a6 as ActivationFlowActivated, a7 as ActivationFlowAmountPicker, a8 as ActivationFlowContinueButton, a9 as ActivationFlowError, aa as ActivationFlowLoading, ab as ActivationFlowRetrying, ac as ActivationFlowRoot, G as ActivationFlowStep, ad as ActivationFlowSummary, H as BalanceBadge, I as CancelPlanButton, O as MandateText, Q as MandateTextProps, ae as PaymentForm, e as PaymentFormCardElement, c as PaymentFormCustomerFields, j as PaymentFormError, i as PaymentFormLoading, f as PaymentFormMandateText, d as PaymentFormPaymentElement, af as PaymentFormRoot, h as PaymentFormSubmitButton, b as PaymentFormSummary, g as PaymentFormTermsCheckbox, Z as PlanBadge, _ as ProductBadge, $ as PurchaseGate, ag as PurchaseGateAllowed, ah as PurchaseGateBlocked, ai as PurchaseGateError, aj as PurchaseGateLoading, ak as PurchaseGateRoot, al as useActivationFlow, am as usePurchaseGate } from '../CancelPlanButton-BKH_yv1d.js';
+import { k as Plan, F as Product, y as UseTopupAmountSelectorReturn, D as PurchaseInfo, T as TopupFormProps } from '../CancelPlanButton-f56UlQN-.js';
+export { a4 as ActivationFlow, a5 as ActivationFlowActivateButton, a6 as ActivationFlowActivated, a7 as ActivationFlowAmountPicker, a8 as ActivationFlowContinueButton, a9 as ActivationFlowError, aa as ActivationFlowLoading, ab as ActivationFlowRetrying, ac as ActivationFlowRoot, G as ActivationFlowStep, ad as ActivationFlowSummary, H as BalanceBadge, I as CancelPlanButton, O as MandateText, Q as MandateTextProps, ae as PaymentForm, e as PaymentFormCardElement, c as PaymentFormCustomerFields, j as PaymentFormError, i as PaymentFormLoading, f as PaymentFormMandateText, d as PaymentFormPaymentElement, af as PaymentFormRoot, h as PaymentFormSubmitButton, b as PaymentFormSummary, g as PaymentFormTermsCheckbox, Z as PlanBadge, _ as ProductBadge, $ as PurchaseGate, ag as PurchaseGateAllowed, ah as PurchaseGateBlocked, ai as PurchaseGateError, aj as PurchaseGateLoading, ak as PurchaseGateRoot, al as useActivationFlow, am as usePurchaseGate } from '../CancelPlanButton-f56UlQN-.js';
 import { PaymentElement } from '@stripe/react-stripe-js';
 import { Stripe, StripeElements } from '@stripe/stripe-js';
 import '@solvapay/server';

package/dist/primitives/index.js

@@ -90,7 +90,7 @@ import {
   usePlanSelector,
   usePurchaseGate,
   useTopupForm
-} from "../chunk-Q7GPX6X4.js";
+} from "../chunk-MOP3ZBGC.js";
 import "../chunk-OUSEQRCT.js";
 export {
   ActivationFlow,

package/dist/src/PaymentForm.d.ts

@@ -0,0 +1,56 @@
+import React from 'react';
+import type { PaymentFormProps } from './types';
+/**
+ * Payment form component for handling Stripe checkout.
+ *
+ * This component provides a complete payment form with Stripe integration,
+ * including card input, plan selection, and payment processing. It handles
+ * the entire checkout flow including payment intent creation and confirmation.
+ *
+ * Features:
+ * - Automatic Stripe Elements initialization
+ * - Payment intent creation on mount
+ * - Card input and validation
+ * - Payment processing with error handling
+ * - Automatic subscription refresh after payment
+ *
+ * @param props - Payment form configuration
+ * @param props.planRef - Plan reference to subscribe to (required)
+ * @param props.agentRef - Agent reference for usage tracking (required)
+ * @param props.onSuccess - Callback when payment succeeds
+ * @param props.onError - Callback when payment fails
+ * @param props.returnUrl - Optional return URL after payment (for redirects)
+ * @param props.submitButtonText - Custom text for submit button (default: 'Pay Now')
+ * @param props.className - Custom CSS class for the form container
+ * @param props.buttonClassName - Custom CSS class for the submit button
+ *
+ * @example
+ * ```tsx
+ * import { PaymentForm } from '@solvapay/react';
+ * import { useRouter } from 'next/navigation';
+ *
+ * function CheckoutPage() {
+ *   const router = useRouter();
+ *
+ *   return (
+ *     <PaymentForm
+ *       planRef="pln_premium"
+ *       agentRef="agt_myapi"
+ *       onSuccess={() => {
+ *         console.log('Payment successful!');
+ *         router.push('/dashboard');
+ *       }}
+ *       onError={(error) => {
+ *         console.error('Payment failed:', error);
+ *       }}
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * @see {@link useCheckout} for programmatic checkout handling
+ * @see {@link SolvaPayProvider} for required context provider
+ * @since 1.0.0
+ */
+export declare const PaymentForm: React.FC<PaymentFormProps>;
+//# sourceMappingURL=PaymentForm.d.ts.map

package/dist/src/PaymentForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentForm.d.ts","sourceRoot":"","sources":["../../src/PaymentForm.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAQhF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA6NlD,CAAA"}

package/dist/src/PaymentForm.js

@@ -0,0 +1,212 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useCallback, useRef, useMemo, useState } from 'react';
+import { Elements } from '@stripe/react-stripe-js';
+import { useCheckout } from './hooks/useCheckout';
+import { useSubscription } from './hooks/useSubscription';
+import { useSolvaPay } from './hooks/useSolvaPay';
+import { useCustomer } from './hooks/useCustomer';
+import { Spinner } from './components/Spinner';
+import { StripePaymentFormWrapper } from './components/StripePaymentFormWrapper';
+/**
+ * Payment form component for handling Stripe checkout.
+ *
+ * This component provides a complete payment form with Stripe integration,
+ * including card input, plan selection, and payment processing. It handles
+ * the entire checkout flow including payment intent creation and confirmation.
+ *
+ * Features:
+ * - Automatic Stripe Elements initialization
+ * - Payment intent creation on mount
+ * - Card input and validation
+ * - Payment processing with error handling
+ * - Automatic subscription refresh after payment
+ *
+ * @param props - Payment form configuration
+ * @param props.planRef - Plan reference to subscribe to (required)
+ * @param props.agentRef - Agent reference for usage tracking (required)
+ * @param props.onSuccess - Callback when payment succeeds
+ * @param props.onError - Callback when payment fails
+ * @param props.returnUrl - Optional return URL after payment (for redirects)
+ * @param props.submitButtonText - Custom text for submit button (default: 'Pay Now')
+ * @param props.className - Custom CSS class for the form container
+ * @param props.buttonClassName - Custom CSS class for the submit button
+ *
+ * @example
+ * ```tsx
+ * import { PaymentForm } from '@solvapay/react';
+ * import { useRouter } from 'next/navigation';
+ *
+ * function CheckoutPage() {
+ *   const router = useRouter();
+ *
+ *   return (
+ *     <PaymentForm
+ *       planRef="pln_premium"
+ *       agentRef="agt_myapi"
+ *       onSuccess={() => {
+ *         console.log('Payment successful!');
+ *         router.push('/dashboard');
+ *       }}
+ *       onError={(error) => {
+ *         console.error('Payment failed:', error);
+ *       }}
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * @see {@link useCheckout} for programmatic checkout handling
+ * @see {@link SolvaPayProvider} for required context provider
+ * @since 1.0.0
+ */
+export const PaymentForm = ({ planRef, agentRef, onSuccess, onError, returnUrl, submitButtonText = 'Pay Now', className, buttonClassName, }) => {
+    // CRITICAL: Always call hooks unconditionally FIRST, before any early returns
+    // Use a safe fallback for planRef to ensure hooks always receive valid input
+    const validPlanRef = planRef && typeof planRef === 'string' ? planRef : '';
+    const checkout = useCheckout(validPlanRef, agentRef);
+    const { refetch } = useSubscription();
+    const { processPayment, customerRef } = useSolvaPay();
+    const customer = useCustomer();
+    const hasInitializedRef = useRef(false);
+    // Auto-start checkout on mount - only once
+    useEffect(() => {
+        if (!hasInitializedRef.current &&
+            validPlanRef &&
+            !checkout.loading &&
+            !checkout.error &&
+            !checkout.clientSecret) {
+            hasInitializedRef.current = true;
+            checkout.startCheckout().catch(() => {
+                // Error handled by useCheckout hook
+                hasInitializedRef.current = false; // Allow retry on error
+            });
+        }
+        // Reset initialization flag if planRef changes
+        if (validPlanRef && checkout.clientSecret) {
+            hasInitializedRef.current = true;
+        }
+    }, [
+        validPlanRef,
+        checkout.loading,
+        checkout.error,
+        checkout.clientSecret,
+        checkout.startCheckout,
+    ]);
+    // Handle successful payment
+    const handleSuccess = useCallback(async (paymentIntent) => {
+        let processingTimeout = false;
+        let processingResult = null;
+        // Process payment if we have the necessary data (customerRef is handled internally)
+        if (processPayment && agentRef) {
+            try {
+                const result = await processPayment({
+                    paymentIntentId: paymentIntent.id,
+                    agentRef: agentRef,
+                    planRef: planRef,
+                });
+                processingResult = result;
+                // Check if the result indicates a timeout
+                // The API can return status: 'timeout' even though TypeScript types say 'completed'
+                const isTimeout = result?.status === 'timeout';
+                processingTimeout = isTimeout;
+                if (isTimeout) {
+                    // Poll for subscription up to 5 times with increasing delays
+                    for (let attempt = 1; attempt <= 5; attempt++) {
+                        const delay = attempt * 1000; // 1s, 2s, 3s, 4s, 5s
+                        await new Promise(resolve => setTimeout(resolve, delay));
+                        await refetch();
+                    }
+                    // Call onSuccess with timeout info first (so CheckoutPage can show failure page)
+                    if (onSuccess) {
+                        await onSuccess({
+                            ...paymentIntent,
+                            _processingTimeout: processingTimeout,
+                            _processingResult: processingResult,
+                        });
+                    }
+                    // Then throw error to signal timeout to StripePaymentFormWrapper
+                    // This will show error state in the form instead of success
+                    throw new Error('Payment processing timed out');
+                }
+                else {
+                    await refetch();
+                }
+            }
+            catch (error) {
+                console.error('[PaymentForm] Failed to process payment:', error);
+                // Call onSuccess with error info so CheckoutPage can show failure page
+                if (onSuccess) {
+                    try {
+                        await onSuccess({
+                            ...paymentIntent,
+                            _processingError: error,
+                        });
+                    }
+                    catch (callbackError) {
+                        // Ignore callback errors
+                    }
+                }
+                // Re-throw the error so StripePaymentFormWrapper can show error state
+                throw error;
+            }
+        }
+        else {
+            // No processPayment available, refetch anyway (webhook might have processed)
+            await refetch();
+        }
+        // Call onSuccess callback (only if we haven't already called it for timeout case)
+        if (onSuccess && !processingTimeout) {
+            await onSuccess({
+                ...paymentIntent,
+                _processingTimeout: processingTimeout,
+                _processingResult: processingResult,
+            });
+        }
+    }, [processPayment, agentRef, planRef, refetch, onSuccess]);
+    // Handle payment error
+    const handleError = useCallback((err) => {
+        if (onError) {
+            onError(err);
+        }
+    }, [onError]);
+    // Auto-detect return URL if not provided
+    const finalReturnUrl = returnUrl || (typeof window !== 'undefined' ? window.location.href : '/');
+    // Validate planRef AFTER all hooks are called
+    const isValidPlanRef = planRef && typeof planRef === 'string';
+    // Determine render state
+    const hasError = !!checkout.error;
+    const hasStripeData = !!(checkout.stripePromise && checkout.clientSecret);
+    // Memoize Elements options to maintain stable identity while clientSecret stays the same
+    const elementsOptions = useMemo(() => {
+        if (!checkout.clientSecret)
+            return undefined;
+        return { clientSecret: checkout.clientSecret };
+    }, [checkout.clientSecret]);
+    // Track if Elements has ever been mounted for this planRef to prevent unmounting
+    // Reset when planRef changes (component will remount due to key prop)
+    const [hasMountedElements, setHasMountedElements] = useState(false);
+    // Update state when Stripe data becomes available
+    useEffect(() => {
+        if (hasStripeData) {
+            setHasMountedElements(true);
+        }
+    }, [hasStripeData]);
+    // Only mount Elements once we have both stripePromise and clientSecret
+    // Once mounted, keep it mounted to maintain hook consistency
+    const shouldRenderElements = hasStripeData || (hasMountedElements && checkout.stripePromise && checkout.clientSecret);
+    // Always return the same JSX structure to maintain hook consistency
+    // Once Elements is rendered, it should never unmount to avoid hook count issues
+    return (_jsx("div", { className: className, children: !isValidPlanRef ? (_jsx("div", { children: "PaymentForm: planRef is required and must be a string" })) : hasError ? (_jsxs("div", { children: [_jsx("div", { children: "Payment initialization failed" }), _jsx("div", { children: checkout.error?.message || 'Unknown error' })] })) : shouldRenderElements && checkout.stripePromise && elementsOptions ? (
+        // Once we have Stripe data, always render Elements to maintain hook consistency
+        // This prevents hook count mismatches when transitioning between states
+        _jsx(Elements, { stripe: checkout.stripePromise, options: elementsOptions, children: _jsx(StripePaymentFormWrapper, { onSuccess: handleSuccess, onError: handleError, returnUrl: finalReturnUrl, submitButtonText: submitButtonText, buttonClassName: buttonClassName, clientSecret: checkout.clientSecret }) }, checkout.clientSecret)) : (
+        // Loading state before Stripe data is available
+        _jsxs("div", { children: [_jsx("div", { style: {
+                        minHeight: '40px',
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'center',
+                    }, children: _jsx(Spinner, { size: "md" }) }), _jsx("button", { type: "submit", disabled: true, className: buttonClassName, "aria-busy": "false", "aria-disabled": "true", children: submitButtonText })] })) }));
+};
+//# sourceMappingURL=PaymentForm.js.map

package/dist/src/PaymentForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentForm.js","sourceRoot":"","sources":["../../src/PaymentForm.tsx"],"names":[],"mappings":"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"}

package/dist/src/SolvaPayProvider.d.ts

@@ -0,0 +1,84 @@
+import React from 'react';
+import type { SolvaPayProviderProps, SolvaPayContextValue } from './types';
+export declare const SolvaPayContext: React.Context<SolvaPayContextValue | null>;
+/**
+ * SolvaPay Provider - Headless Context Provider for React.
+ *
+ * Provides subscription state, payment methods, and customer data to child components
+ * via React Context. This is the root component that must wrap your app to use
+ * SolvaPay React hooks and components.
+ *
+ * Features:
+ * - Automatic subscription status checking
+ * - Customer reference caching in localStorage
+ * - Payment intent creation and processing
+ * - Authentication adapter support (Supabase, custom, etc.)
+ * - Zero-config with sensible defaults, or full customization
+ *
+ * @param props - Provider configuration
+ * @param props.config - Configuration object for API routes and authentication
+ * @param props.config.api - API route configuration (optional, uses defaults if not provided)
+ * @param props.config.api.checkSubscription - Endpoint for checking subscription status (default: '/api/check-subscription')
+ * @param props.config.api.createPayment - Endpoint for creating payment intents (default: '/api/create-payment-intent')
+ * @param props.config.api.processPayment - Endpoint for processing payments (default: '/api/process-payment')
+ * @param props.config.auth - Authentication configuration (optional)
+ * @param props.config.auth.adapter - Auth adapter for extracting user ID and token
+ * @param props.children - React children components
+ *
+ * @example
+ * ```tsx
+ * import { SolvaPayProvider } from '@solvapay/react';
+ *
+ * // Zero config (uses defaults)
+ * function App() {
+ *   return (
+ *     <SolvaPayProvider>
+ *       <YourApp />
+ *     </SolvaPayProvider>
+ *   );
+ * }
+ *
+ * // Custom API routes
+ * function App() {
+ *   return (
+ *     <SolvaPayProvider
+ *       config={{
+ *         api: {
+ *           checkSubscription: '/custom/api/subscription',
+ *           createPayment: '/custom/api/payment'
+ *         }
+ *       }}
+ *     >
+ *       <YourApp />
+ *     </SolvaPayProvider>
+ *   );
+ * }
+ *
+ * // With Supabase auth adapter
+ * import { createSupabaseAuthAdapter } from '@solvapay/react-supabase';
+ *
+ * function App() {
+ *   const adapter = createSupabaseAuthAdapter({
+ *     supabaseUrl: process.env.NEXT_PUBLIC_SUPABASE_URL!,
+ *     supabaseAnonKey: process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+ *   });
+ *
+ *   return (
+ *     <SolvaPayProvider
+ *       config={{
+ *         auth: { adapter }
+ *       }}
+ *     >
+ *       <YourApp />
+ *     </SolvaPayProvider>
+ *   );
+ * }
+ * ```
+ *
+ * @see {@link useSubscription} for accessing subscription data
+ * @see {@link useCheckout} for payment checkout flow
+ * @see {@link useSolvaPay} for accessing provider methods
+ * @since 1.0.0
+ */
+export declare const SolvaPayProvider: React.FC<SolvaPayProviderProps>;
+//# sourceMappingURL=SolvaPayProvider.d.ts.map

package/dist/src/SolvaPayProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolvaPayProvider.d.ts","sourceRoot":"","sources":["../../src/SolvaPayProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAA2E,MAAM,OAAO,CAAA;AAC/F,OAAO,KAAK,EACV,qBAAqB,EACrB,oBAAoB,EAKrB,MAAM,SAAS,CAAA;AAShB,eAAO,MAAM,eAAe,4CAAmD,CAAA;AAmG/E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8EG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAoe5D,CAAA"}