@flopay/react 0.4.8 → 0.4.10

package/dist/index.mjs

@@ -75,13 +75,22 @@ function FloPayProvider({
       clientSecret: options?.clientSecret,
       amount: options?.amount,
       currency: options?.currency,
-      paymentMethodCreation: options?.paymentMethodCreation
+      paymentMethodCreation: options?.paymentMethodCreation,
+      setupFutureUsage: options?.setupFutureUsage
     });
     setElements(els);
     return () => {
       els.destroy();
     };
-  }, [flopay, options?.appearance, options?.clientSecret, options?.amount, options?.currency]);
+  }, [
+    flopay,
+    options?.appearance,
+    options?.clientSecret,
+    options?.amount,
+    options?.currency,
+    options?.paymentMethodCreation,
+    options?.setupFutureUsage
+  ]);
   const resolvedBillingApiUrl = resolveBillingApiUrl(options?.billingApiUrl);
   const value = useMemo(
     () => ({ flopay, paypalFlopay, elements, billingApiUrl: resolvedBillingApiUrl }),
@@ -504,6 +513,15 @@ function buildDeclineEvent(method, input, overrides) {
     ...declineCode ? { declineCode } : {}
   };
 }
+function mapPayPalIntentStatusToPaymentResult(status) {
+  if (status === "succeeded") {
+    return "succeeded";
+  }
+  if (status === "processing" || status === "requires_capture") {
+    return "processing";
+  }
+  return "failed";
+}
 function resolveTokenizedPaymentMethodId(tokenizedBody) {
   const candidates = [
     tokenizedBody?.id,
@@ -731,7 +749,10 @@ function PayPalButtonInner({
       const createPM = stripe.createPaymentMethod;
       const { error: pmError, paymentMethod } = await createPM({ type: "paypal" });
       if (pmError) {
-        console.warn("[FloPay] Could not create PayPal PM upfront:", pmError.message);
+        const message = pmError.message ?? "PayPal payment failed.";
+        onErrorChange?.(message);
+        event.paymentFailed({ reason: "fail", message });
+        return;
       }
       const intentResponse = await fetch(`${baseUrl}/v1/checkouts/payments/intents`, {
         method: "POST",
@@ -740,7 +761,9 @@ function PayPalButtonInner({
           sessionId: effectiveSessionId,
           email: effectiveEmail,
           paymentMethodType: paymentMethod?.id ?? "paypal",
-          isPaypal: "true"
+          isPaypal: "true",
+          setupFutureUsage: "off_session",
+          setup_future_usage: "off_session"
         })
       });
       if (!intentResponse.ok) throw new Error("Failed to create payment intent");
@@ -776,6 +799,7 @@ function PayPalButtonInner({
         accountPatch: prepared?.accountPatch,
         sessionId: effectiveSessionId
       });
+      return;
     } catch (err) {
       onErrorChange?.(err instanceof Error ? err.message : "PayPal payment failed. Please try again.");
     } finally {
@@ -796,6 +820,9 @@ function PayPalButtonInner({
         },
         options: {
           buttonType: { paypal: "paypal" },
+          billingAddressRequired: false,
+          phoneNumberRequired: false,
+          shippingAddressRequired: false,
           paymentMethods: {
             applePay: "never",
             googlePay: "never",
@@ -1075,7 +1102,8 @@ function SplitCardFormInner({
     mode: "payment",
     amount: amountInCents,
     currency: currency.toLowerCase(),
-    captureMethod: "manual"
+    captureMethod: "manual",
+    setupFutureUsage: "off_session"
   }), [amountInCents, currency]);
   const updateError = useCallback(
     (err) => {
@@ -1160,6 +1188,8 @@ function SplitCardFormInner({
       updateError(null);
       const effectiveSessionId = overrides?.sessionId ?? sessionId;
       const effectiveAccount = mergeAccountPatch(resolvedAccount, overrides?.accountPatch);
+      const resolvedCompletionPaymentMethodId = overrides?.completionPaymentMethodId ?? resolveTokenizedPaymentMethodId(tokenizedBody);
+      const requestTokenizedBody = tokenizedBody.originalPaymentMethodId ? { ...tokenizedBody, originalPaymentMethodId: void 0 } : tokenizedBody;
       try {
         const response = await fetch(`${baseUrl}/v1/checkouts/sessions/process`, {
           method: "POST",
@@ -1169,7 +1199,7 @@ function SplitCardFormInner({
           },
           body: JSON.stringify({
             sessionId: effectiveSessionId,
-            tokenizedData: tokenizedBody,
+            tokenizedData: requestTokenizedBody,
             accountData: {
               userId: effectiveAccount.userId ?? "",
               email: effectiveAccount.email ?? "",
@@ -1186,7 +1216,8 @@ function SplitCardFormInner({
           onComplete?.({
             status: "succeeded",
             paymentIntentId: tokenizedBody.threeDSecureActionResultTokenId,
-            paymentMethodId: resolveTokenizedPaymentMethodId(tokenizedBody)
+            paymentMethodId: resolvedCompletionPaymentMethodId,
+            checkoutMethod: tokenizedBody.isPaypal ? "paypal" : "card"
           });
           return;
         }
@@ -1229,8 +1260,9 @@ function SplitCardFormInner({
               await processPaymentInternal({
                 id: result.paymentIntentId,
                 type: "card",
-                threeDSecureActionResultTokenId: result.paymentIntentId,
-                originalPaymentMethodId: resolveTokenizedPaymentMethodId(tokenizedBody)
+                threeDSecureActionResultTokenId: result.paymentIntentId
+              }, {
+                completionPaymentMethodId: resolvedCompletionPaymentMethodId
               });
             }
           } finally {
@@ -2055,7 +2087,8 @@ async function processSavedPaymentForMode({
       result: {
         status: "succeeded",
         paymentIntentId: tokenizedData?.threeDSecureActionResultTokenId,
-        paymentMethodId: resolveTokenizedPaymentMethodId(tokenizedData)
+        paymentMethodId: resolveTokenizedPaymentMethodId(tokenizedData),
+        checkoutMethod: tokenizedData ? tokenizedData.isPaypal ? "paypal" : "card" : void 0
       }
     };
   }
@@ -2158,7 +2191,7 @@ async function processSavedPaymentWithIntent({
   if (!confirmResult.paymentIntentId || confirmResult.status !== "succeeded" && confirmResult.status !== "processing" && confirmResult.status !== "requires_capture") {
     throw Object.assign(
       new FloPayError3(
-        `Payment intent in unexpected status: ${confirmResult.status}`,
+        `Unfortunately, your payment could not be processed. Please try again using a different payment method or contact your bank for assistance. If the issue persists, feel free to reach out to us for support.`,
         "api_error",
         {
           code: confirmResult.status === "requires_action" ? "authentication_required" : void 0
@@ -2174,8 +2207,7 @@ async function processSavedPaymentWithIntent({
     tokenizedData: {
       id: paymentMethodId,
       type: "card",
-      threeDSecureActionResultTokenId: confirmResult.paymentIntentId,
-      originalPaymentMethodId: paymentMethodId
+      threeDSecureActionResultTokenId: confirmResult.paymentIntentId
     },
     returnUrl
   });
@@ -2191,7 +2223,8 @@ async function processSavedPaymentWithIntent({
   return {
     ...finalResult,
     paymentIntentId: finalResult.paymentIntentId ?? confirmResult.paymentIntentId,
-    paymentMethodId: finalResult.paymentMethodId ?? paymentMethodId
+    paymentMethodId: finalResult.paymentMethodId ?? paymentMethodId,
+    checkoutMethod: finalResult.checkoutMethod ?? "card"
   };
 }
 async function handleSavedPaymentRedirectResult(redirectResult, {
@@ -2285,8 +2318,7 @@ async function handleSavedPaymentRedirectResult(redirectResult, {
         tokenizedData: {
           id: paymentIntent.id,
           type: "card",
-          threeDSecureActionResultTokenId: paymentIntent.id,
-          originalPaymentMethodId: savedPaymentMethodId
+          threeDSecureActionResultTokenId: paymentIntent.id
         },
         returnUrl
       });
@@ -2341,7 +2373,10 @@ async function handleSavedPaymentRedirectResult(redirectResult, {
         { checkoutMethod: "paypal" }
       );
     }
-    return { status: "succeeded" };
+    return {
+      status: "succeeded",
+      checkoutMethod: "paypal"
+    };
   }
   throw new FloPayError3("Unsupported payment redirect state.", "api_error");
 }
@@ -2354,19 +2389,16 @@ function normalizeSavedPaymentError(err) {
     "api_error"
   );
 }
-function resolveSavedPaymentPublishableKeys(unified, fallbackPublishableKey) {
+function resolveSavedPaymentPublishableKeys(unified) {
   let publishableKey;
   let paypalPublishableKey;
   if (unified.provider === "stripe") {
     publishableKey = unified.data.stripe?.publishableKey;
     paypalPublishableKey = unified.data.stripe?.paypalPublishableKey ?? void 0;
   }
-  if (!publishableKey) {
-    publishableKey = fallbackPublishableKey;
-  }
   if (!publishableKey) {
     throw new FloPayError3(
-      "No publishable key found. Provide fallbackPublishableKey or ensure the session includes gatewayData.publishableKey.",
+      "No publishable key found in the checkout session. Ensure the session includes gatewayData.publishableKey.",
       "validation_error"
     );
   }
@@ -2404,9 +2436,60 @@ async function loadSavedPaymentProviders({
 // src/flopay-checkout.tsx
 import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 var DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT2 = 44;
+var PAYPAL_RESUME_STORAGE_KEY = "flopay_checkout_saved_payment_resume";
 function sleep(ms) {
   return new Promise((resolve) => setTimeout(resolve, ms));
 }
+function canUseStorage() {
+  return typeof window !== "undefined" && typeof window.sessionStorage !== "undefined";
+}
+function readPayPalResumeState() {
+  if (!canUseStorage()) return null;
+  try {
+    const raw = window.sessionStorage.getItem(PAYPAL_RESUME_STORAGE_KEY);
+    if (!raw) return null;
+    return JSON.parse(raw);
+  } catch {
+    return null;
+  }
+}
+function persistPayPalResumeState(state) {
+  if (!canUseStorage()) return;
+  try {
+    window.sessionStorage.setItem(PAYPAL_RESUME_STORAGE_KEY, JSON.stringify(state));
+  } catch (error) {
+    console.warn("[FloPayCheckout] Failed to persist PayPal resume state.", error);
+  }
+}
+function clearPayPalResumeState() {
+  if (!canUseStorage()) return;
+  try {
+    window.sessionStorage.removeItem(PAYPAL_RESUME_STORAGE_KEY);
+  } catch (error) {
+    console.warn("[FloPayCheckout] Failed to clear PayPal resume state.", error);
+  }
+}
+function clearPayPalRedirectParams() {
+  if (typeof window === "undefined") return;
+  const url = new URL(window.location.href);
+  const keys = ["payment_intent", "payment_intent_client_secret", "redirect_status"];
+  let changed = false;
+  for (const key of keys) {
+    if (url.searchParams.has(key)) {
+      url.searchParams.delete(key);
+      changed = true;
+    }
+  }
+  if (changed) {
+    window.history.replaceState(window.history.state, "", url.toString());
+  }
+}
+function replaceCheckoutModeQueryParam(mode) {
+  if (typeof window === "undefined") return;
+  const url = new URL(window.location.href);
+  url.searchParams.set("mode", mode);
+  window.history.replaceState(window.history.state, "", url.toString());
+}
 function hasInlineSessionPatchData(patch) {
   if (!patch) return false;
   return Boolean(
@@ -2419,7 +2502,6 @@ function FloPayCheckout({
   billingApiUrl,
   appearance,
   locale,
-  fallbackPublishableKey,
   loading: loadingNode,
   error: errorNode,
   onComplete,
@@ -2474,6 +2556,8 @@ function FloPayCheckout({
   const [createSessionPatchBaseHash, setCreateSessionPatchBaseHash] = useState3("");
   const [cardBootstrapPending, setCardBootstrapPending] = useState3(false);
   const autoCheckoutAttempted = useRef3(false);
+  const paypalResumeAttempted = useRef3(false);
+  const savedPaymentKeysRef = useRef3(null);
   const onCompleteRef = useRef3(onComplete);
   onCompleteRef.current = onComplete;
   const onErrorRef = useRef3(onError);
@@ -2533,6 +2617,13 @@ function FloPayCheckout({
         const redirectResult = getRedirectResultFromCheckoutProcessError(options?.initialAutoProcessingError);
         let paymentResult;
         if (redirectResult) {
+          if (redirectResult.type === "paypal_redirect_required" && savedPaymentKeysRef.current) {
+            persistPayPalResumeState({
+              sessionId: activeSessionId2,
+              publishableKey: savedPaymentKeysRef.current.publishableKey,
+              paypalPublishableKey: savedPaymentKeysRef.current.paypalPublishableKey
+            });
+          }
           paymentResult = await handleSavedPaymentRedirectResult(redirectResult, {
             flopay: flopayRef.current,
             paypalFlopay: paypalFlopayRef.current,
@@ -2541,6 +2632,9 @@ function FloPayCheckout({
             sessionId: activeSessionId2,
             session: sess
           });
+          if (redirectResult.type === "paypal_redirect_required") {
+            clearPayPalResumeState();
+          }
         } else if (options?.initialAutoProcessingError) {
           throw checkoutProcessErrorToFloPayError(
             options.initialAutoProcessingError,
@@ -2552,6 +2646,7 @@ function FloPayCheckout({
         } else if (options?.fromCreateSession) {
           if (options?.fallbackToFull) {
             setCurrentMode("full");
+            replaceCheckoutModeQueryParam("full");
           }
           return false;
         } else {
@@ -2560,14 +2655,28 @@ function FloPayCheckout({
             sessionId: activeSessionId2,
             session: sess
           });
-          paymentResult = result.type === "success" ? result.result : await handleSavedPaymentRedirectResult(result, {
-            flopay: flopayRef.current,
-            paypalFlopay: paypalFlopayRef.current,
-            attempt3DS: options?.attempt3DS,
-            billingApiUrl: resolvedBillingUrl,
-            sessionId: activeSessionId2,
-            session: sess
-          });
+          if (result.type === "success") {
+            paymentResult = result.result;
+          } else {
+            if (result.type === "paypal_redirect_required" && savedPaymentKeysRef.current) {
+              persistPayPalResumeState({
+                sessionId: activeSessionId2,
+                publishableKey: savedPaymentKeysRef.current.publishableKey,
+                paypalPublishableKey: savedPaymentKeysRef.current.paypalPublishableKey
+              });
+            }
+            paymentResult = await handleSavedPaymentRedirectResult(result, {
+              flopay: flopayRef.current,
+              paypalFlopay: paypalFlopayRef.current,
+              attempt3DS: options?.attempt3DS,
+              billingApiUrl: resolvedBillingUrl,
+              sessionId: activeSessionId2,
+              session: sess
+            });
+            if (result.type === "paypal_redirect_required") {
+              clearPayPalResumeState();
+            }
+          }
         }
         setModeOverlayStatus("success");
         await sleep(PROCESSING_OVERLAY_SUCCESS_DELAY_MS);
@@ -2580,6 +2689,7 @@ function FloPayCheckout({
         setModeOverlayError(floPayErr.message);
         if (options?.fallbackToFull) {
           setCurrentMode("full");
+          replaceCheckoutModeQueryParam("full");
         }
         onErrorRef.current?.(floPayErr);
         emitDecline(method, floPayErr, {
@@ -2603,6 +2713,96 @@ function FloPayCheckout({
       resolvedBillingUrl
     ]
   );
+  useEffect4(() => {
+    if (typeof window === "undefined" || paypalResumeAttempted.current) {
+      return;
+    }
+    const params = new URLSearchParams(window.location.search);
+    const clientSecret = params.get("payment_intent_client_secret");
+    if (!clientSecret) {
+      return;
+    }
+    const resumeState = readPayPalResumeState();
+    if (!resumeState) {
+      return;
+    }
+    paypalResumeAttempted.current = true;
+    void (async () => {
+      setModeError(null);
+      setModeOverlayError(null);
+      setModeOverlayStatus("processing");
+      setConfirmProcessing(true);
+      try {
+        if (params.get("redirect_status") === "failed") {
+          throw Object.assign(
+            new FloPayError4("PayPal payment was declined. Please try again.", "api_error"),
+            { checkoutMethod: "paypal" }
+          );
+        }
+        const {
+          flopay: resumeFlopay,
+          paypalFlopay: resumePaypalFlopay
+        } = await loadSavedPaymentProviders({
+          publishableKey: resumeState.publishableKey,
+          paypalPublishableKey: resumeState.paypalPublishableKey,
+          billingApiUrl: resolvedBillingUrl,
+          locale
+        });
+        const paypalStripe = (resumePaypalFlopay ?? resumeFlopay).getRawProvider();
+        if (!paypalStripe) {
+          throw Object.assign(
+            new FloPayError4("PayPal is not available.", "api_error"),
+            { checkoutMethod: "paypal" }
+          );
+        }
+        const { paymentIntent, error } = await paypalStripe.retrievePaymentIntent(clientSecret);
+        if (error) {
+          throw Object.assign(
+            new FloPayError4(
+              error.message ?? "Failed to retrieve PayPal payment status.",
+              "api_error",
+              { code: error.code }
+            ),
+            { checkoutMethod: "paypal" }
+          );
+        }
+        const resultStatus = mapPayPalIntentStatusToPaymentResult(paymentIntent?.status);
+        if (!paymentIntent || resultStatus === "failed") {
+          throw Object.assign(
+            new FloPayError4("PayPal payment was not completed. Please try again.", "api_error"),
+            { checkoutMethod: "paypal" }
+          );
+        }
+        const paymentMethodId = typeof paymentIntent.payment_method === "string" ? paymentIntent.payment_method : paymentIntent.payment_method?.id;
+        setModeOverlayStatus("success");
+        await sleep(PROCESSING_OVERLAY_SUCCESS_DELAY_MS);
+        onCompleteRef.current?.({
+          status: resultStatus,
+          paymentIntentId: paymentIntent.id,
+          paymentMethodId,
+          checkoutMethod: "paypal"
+        });
+      } catch (err) {
+        const floPayErr = normalizeSavedPaymentError(err);
+        const method = floPayErr.checkoutMethod ?? "paypal";
+        setModeError(floPayErr.message);
+        setModeOverlayError(floPayErr.message);
+        onErrorRef.current?.(floPayErr);
+        emitDecline(method, floPayErr, {
+          code: floPayErr.code,
+          declineCode: floPayErr.declineCode
+        });
+        setModeOverlayStatus("error");
+        await sleep(PROCESSING_OVERLAY_ERROR_DELAY_MS);
+      } finally {
+        clearPayPalResumeState();
+        clearPayPalRedirectParams();
+        setModeOverlayStatus(null);
+        setModeOverlayError(null);
+        setConfirmProcessing(false);
+      }
+    })();
+  }, [emitDecline, locale, normalizeSavedPaymentError, resolvedBillingUrl]);
   const inflightRef = useRef3(/* @__PURE__ */ new Map());
   const initializedHashRef = useRef3(null);
   function hashCreateParams(params) {
@@ -2701,7 +2901,7 @@ function FloPayCheckout({
         const {
           publishableKey,
           paypalPublishableKey
-        } = resolveSavedPaymentPublishableKeys(realResult, fallbackPublishableKey);
+        } = resolveSavedPaymentPublishableKeys(realResult);
         const {
           flopay: instance,
           paypalFlopay: paypalInstance
@@ -2724,7 +2924,7 @@ function FloPayCheckout({
       }
       return resolved;
     },
-    [fallbackPublishableKey, locale, resolvedBillingUrl]
+    [locale, resolvedBillingUrl]
   );
   const handleInlineSessionPatch = useCallback2(async (patch) => {
     if (!hasInlineSessionPatchData(patch) || cardBootstrapPending) {
@@ -2772,6 +2972,7 @@ function FloPayCheckout({
         try {
           const resolved = await bootstrapInlineSession();
           const resolvedSession = resolved.result.data.session ?? null;
+          savedPaymentKeysRef.current = resolveSavedPaymentPublishableKeys(resolved.result);
           if (!cancelled && shouldAutoProcessInlineSession && resolvedSession) {
             autoCheckoutAttempted.current = true;
             await runSavedPaymentFlow(resolvedSession, {
@@ -2870,7 +3071,11 @@ function FloPayCheckout({
       const {
         publishableKey,
         paypalPublishableKey
-      } = resolveSavedPaymentPublishableKeys(result, fallbackPublishableKey);
+      } = resolveSavedPaymentPublishableKeys(result);
+      savedPaymentKeysRef.current = {
+        publishableKey,
+        paypalPublishableKey
+      };
       const {
         flopay: instance,
         paypalFlopay: paypalInstance
@@ -3423,9 +3628,11 @@ function CheckoutFormInner({
     [onDecline]
   );
   const processPaymentInternal = useCallback3(
-    async (tokenizedBody) => {
+    async (tokenizedBody, completionPaymentMethodId) => {
       setProcessing(true);
       updateError(null);
+      const resolvedCompletionPaymentMethodId = completionPaymentMethodId ?? resolveTokenizedPaymentMethodId(tokenizedBody);
+      const requestTokenizedBody = tokenizedBody.originalPaymentMethodId ? { ...tokenizedBody, originalPaymentMethodId: void 0 } : tokenizedBody;
       try {
         const response = await fetch(`${baseUrl}/v1/checkouts/sessions/process`, {
           method: "POST",
@@ -3435,7 +3642,7 @@ function CheckoutFormInner({
           },
           body: JSON.stringify({
             sessionId,
-            tokenizedData: tokenizedBody,
+            tokenizedData: requestTokenizedBody,
             accountData: {
               userId: userId ?? "",
               email: email ?? "",
@@ -3449,7 +3656,8 @@ function CheckoutFormInner({
           onComplete?.({
             status: "succeeded",
             paymentIntentId: tokenizedBody.threeDSecureActionResultTokenId,
-            paymentMethodId: resolveTokenizedPaymentMethodId(tokenizedBody)
+            paymentMethodId: resolvedCompletionPaymentMethodId,
+            checkoutMethod: tokenizedBody.isPaypal ? "paypal" : "card"
           });
           return;
         }
@@ -3481,9 +3689,8 @@ function CheckoutFormInner({
               await processPaymentInternal({
                 id: result.paymentIntentId,
                 type: "card",
-                threeDSecureActionResultTokenId: result.paymentIntentId,
-                originalPaymentMethodId: resolveTokenizedPaymentMethodId(tokenizedBody)
-              });
+                threeDSecureActionResultTokenId: result.paymentIntentId
+              }, resolvedCompletionPaymentMethodId);
             }
           } finally {
             setIs3DSActive(false);
@@ -3810,33 +4017,23 @@ function PayPalButton({
       if (!sessionId || !email) {
         throw new FloPayError6("Missing sessionId or email for PayPal payment", "validation_error");
       }
-      const intentResponse = await fetch(`${baseUrl}/v1/checkouts/payments/intents`, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          sessionId,
-          email,
-          paymentMethodType: "paypal",
-          isPaypal: "true"
-        })
-      });
-      if (!intentResponse.ok) throw new FloPayError6("Failed to create payment intent", "api_error");
-      const intentJson = await intentResponse.json();
-      const intentClientSecret = intentJson.data?.id;
-      if (!intentClientSecret) throw new FloPayError6("No client_secret in response", "api_error");
-      const result = await flopay.confirmPayment({
-        clientSecret: intentClientSecret,
+      const result = await flopay.confirmPayPalPayment({
+        billingApiUrl: baseUrl,
+        sessionId,
+        email,
         returnUrl: window.location.href
       });
-      if (result.status === "succeeded" || result.status === "processing") {
+      if (result.error) {
+        onErrorChange?.(result.error.message);
+        return;
+      }
+      if (result.paymentIntentId && (result.status === "succeeded" || result.status === "processing" || result.status === "requires_capture")) {
         dispatchTokenizedBody({
-          id: result.paymentIntentId,
+          id: result.paymentMethodId ?? result.paymentIntentId,
           type: "card",
           threeDSecureActionResultTokenId: result.paymentIntentId,
           isPaypal: true
         });
-      } else if (result.error) {
-        onErrorChange?.(result.error.message);
       }
     } catch (err) {
       onErrorChange?.(err instanceof Error ? err.message : "PayPal payment failed. Please try again.");
@@ -3896,7 +4093,7 @@ import { PaymentAPI as PaymentAPI3 } from "@flopay/js";
 import { FloPayError as FloPayError7, resolveBillingApiUrl as resolveBillingApiUrl4, resolveButtonsLayoutTheme as resolveButtonsLayoutTheme3 } from "@flopay/shared";
 import { Fragment as Fragment6, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
 var DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT3 = 44;
-var PAYPAL_RESUME_STORAGE_KEY = "flopay_automatic_payment_button_resume";
+var PAYPAL_RESUME_STORAGE_KEY2 = "flopay_automatic_payment_button_resume";
 function sleep2(ms) {
   return new Promise((resolve) => setTimeout(resolve, ms));
 }
@@ -3909,42 +4106,44 @@ function coerceError(err, fallbackMessage) {
     "api_error"
   );
 }
-function canUseStorage() {
+function canUseStorage2() {
   return typeof window !== "undefined" && typeof window.sessionStorage !== "undefined";
 }
 function shouldShowFallbackCheckout(error, sessionId) {
   if (!sessionId) return false;
   if (error.type === "validation_error") return false;
-  if (error.checkoutMethod && error.checkoutMethod !== "card") return false;
+  if (error.checkoutMethod && error.checkoutMethod !== "card" && error.checkoutMethod !== "paypal") {
+    return false;
+  }
   return true;
 }
-function readPayPalResumeState() {
-  if (!canUseStorage()) return null;
+function readPayPalResumeState2() {
+  if (!canUseStorage2()) return null;
   try {
-    const raw = window.sessionStorage.getItem(PAYPAL_RESUME_STORAGE_KEY);
+    const raw = window.sessionStorage.getItem(PAYPAL_RESUME_STORAGE_KEY2);
     if (!raw) return null;
     return JSON.parse(raw);
   } catch {
     return null;
   }
 }
-function persistPayPalResumeState(state) {
-  if (!canUseStorage()) return;
+function persistPayPalResumeState2(state) {
+  if (!canUseStorage2()) return;
   try {
-    window.sessionStorage.setItem(PAYPAL_RESUME_STORAGE_KEY, JSON.stringify(state));
+    window.sessionStorage.setItem(PAYPAL_RESUME_STORAGE_KEY2, JSON.stringify(state));
   } catch (error) {
     console.warn("[FloPayAutomaticPaymentButton] Failed to persist PayPal resume state.", error);
   }
 }
-function clearPayPalResumeState() {
-  if (!canUseStorage()) return;
+function clearPayPalResumeState2() {
+  if (!canUseStorage2()) return;
   try {
-    window.sessionStorage.removeItem(PAYPAL_RESUME_STORAGE_KEY);
+    window.sessionStorage.removeItem(PAYPAL_RESUME_STORAGE_KEY2);
   } catch (error) {
     console.warn("[FloPayAutomaticPaymentButton] Failed to clear PayPal resume state.", error);
   }
 }
-function clearPayPalRedirectParams() {
+function clearPayPalRedirectParams2() {
   if (typeof window === "undefined") return;
   const url = new URL(window.location.href);
   const keys = ["payment_intent", "payment_intent_client_secret", "redirect_status"];
@@ -3986,6 +4185,7 @@ function FloPayAutomaticPaymentButton({
   sessionId,
   createSession,
   paymentMethodId,
+  checkoutMethod,
   clientId,
   items,
   subscriptions,
@@ -3997,7 +4197,6 @@ function FloPayAutomaticPaymentButton({
   utmMetadata,
   billingApiUrl,
   locale,
-  fallbackPublishableKey,
   buttonsTheme,
   buttonsStyles: stylesOverride,
   onSuccess,
@@ -4046,9 +4245,10 @@ function FloPayAutomaticPaymentButton({
   const automaticPaymentToken = useMemo4(
     () => paymentMethodId ? {
       id: paymentMethodId,
-      type: "card"
+      type: "card",
+      ...checkoutMethod === "paypal" ? { isPaypal: true } : {}
     } : void 0,
-    [paymentMethodId]
+    [checkoutMethod, paymentMethodId]
   );
   const isMountedRef = useRef5(true);
   const resumeAttemptedRef = useRef5(false);
@@ -4130,13 +4330,14 @@ function FloPayAutomaticPaymentButton({
       let paymentResult = null;
       const redirectResult = getRedirectResultFromCheckoutProcessError(apiResult.autoProcessingError);
       const shouldTreatCreateSessionFlowAsServerAutoAttempt = options?.fromCreateSession && (apiResult.autoProcessingAttempted === true || !!apiResult.autoProcessingError || !!redirectResult);
+      const shouldRetryPayPalClientSide = checkoutMethod === "paypal" && automaticPaymentToken?.isPaypal === true && options?.fromCreateSession === true;
       if (redirectResult) {
         const {
           publishableKey,
           paypalPublishableKey
-        } = resolveSavedPaymentPublishableKeys(apiResult, fallbackPublishableKey);
+        } = resolveSavedPaymentPublishableKeys(apiResult);
         if (redirectResult.type === "paypal_redirect_required") {
-          persistPayPalResumeState({
+          persistPayPalResumeState2({
             sessionId: session.id || resolvedSessionId,
             publishableKey,
             paypalPublishableKey
@@ -4160,9 +4361,9 @@ function FloPayAutomaticPaymentButton({
           session
         });
         if (redirectResult.type === "paypal_redirect_required") {
-          clearPayPalResumeState();
+          clearPayPalResumeState2();
         }
-      } else if (apiResult.autoProcessingError) {
+      } else if (apiResult.autoProcessingError && !shouldRetryPayPalClientSide) {
         throw checkoutProcessErrorToFloPayError(
           apiResult.autoProcessingError,
           "Automatic payment failed. Please try again.",
@@ -4170,7 +4371,7 @@ function FloPayAutomaticPaymentButton({
             checkoutMethod: apiResult.autoProcessingError.checkoutMethod
           }
         );
-      } else if (shouldTreatCreateSessionFlowAsServerAutoAttempt) {
+      } else if (shouldTreatCreateSessionFlowAsServerAutoAttempt && !shouldRetryPayPalClientSide) {
         throw checkoutProcessErrorToFloPayError(
           {
             type: "unknown",
@@ -4190,9 +4391,9 @@ function FloPayAutomaticPaymentButton({
           const {
             publishableKey,
             paypalPublishableKey
-          } = resolveSavedPaymentPublishableKeys(apiResult, fallbackPublishableKey);
+          } = resolveSavedPaymentPublishableKeys(apiResult);
           if (result.type === "paypal_redirect_required") {
-            persistPayPalResumeState({
+            persistPayPalResumeState2({
               sessionId: session.id || resolvedSessionId,
               publishableKey,
               paypalPublishableKey
@@ -4216,17 +4417,19 @@ function FloPayAutomaticPaymentButton({
             session
           });
           if (result.type === "paypal_redirect_required") {
-            clearPayPalResumeState();
+            clearPayPalResumeState2();
           }
         }
       }
       await showSuccess({
         result: paymentResult ? {
           ...paymentResult,
-          paymentMethodId: paymentResult.paymentMethodId ?? paymentMethodId
+          paymentMethodId: paymentResult.paymentMethodId ?? paymentMethodId,
+          checkoutMethod: paymentResult.checkoutMethod ?? checkoutMethod
         } : {
           status: "succeeded",
-          paymentMethodId: paymentMethodId ?? void 0
+          paymentMethodId: paymentMethodId ?? void 0,
+          checkoutMethod
         },
         session,
         sessionId: session.id || resolvedSessionId,
@@ -4241,7 +4444,7 @@ function FloPayAutomaticPaymentButton({
           const {
             publishableKey,
             paypalPublishableKey
-          } = resolveSavedPaymentPublishableKeys(apiResult, fallbackPublishableKey);
+          } = resolveSavedPaymentPublishableKeys(apiResult);
           const {
             flopay
           } = await loadSavedPaymentProviders({
@@ -4260,7 +4463,8 @@ function FloPayAutomaticPaymentButton({
           await showSuccess({
             result: {
               ...paymentResult,
-              paymentMethodId: paymentResult.paymentMethodId ?? paymentMethodId
+              paymentMethodId: paymentResult.paymentMethodId ?? paymentMethodId,
+              checkoutMethod: paymentResult.checkoutMethod ?? checkoutMethod
             },
             session,
             sessionId: fallbackSessionId,
@@ -4283,7 +4487,7 @@ function FloPayAutomaticPaymentButton({
       }
     }
   }, [
-    fallbackPublishableKey,
+    checkoutMethod,
     locale,
     automaticPaymentToken,
     paymentMethodId,
@@ -4395,7 +4599,7 @@ function FloPayAutomaticPaymentButton({
     if (!clientSecret) {
       return;
     }
-    const resumeState = readPayPalResumeState();
+    const resumeState = readPayPalResumeState2();
     if (!resumeState) {
       return;
     }
@@ -4438,9 +4642,16 @@ function FloPayAutomaticPaymentButton({
             { checkoutMethod: "paypal" }
           );
         }
-        if (paymentIntent && (paymentIntent.status === "requires_capture" || paymentIntent.status === "succeeded" || paymentIntent.status === "processing")) {
+        const resultStatus = mapPayPalIntentStatusToPaymentResult(paymentIntent?.status);
+        if (paymentIntent && resultStatus !== "failed") {
+          const paymentMethodId2 = typeof paymentIntent.payment_method === "string" ? paymentIntent.payment_method : paymentIntent.payment_method?.id;
           await showSuccess({
-            result: { status: "succeeded", paymentIntentId: paymentIntent.id },
+            result: {
+              status: resultStatus,
+              paymentIntentId: paymentIntent.id,
+              paymentMethodId: paymentMethodId2,
+              checkoutMethod: "paypal"
+            },
             session: null,
             sessionId: resumeState.sessionId,
             autoCompleted: false
@@ -4458,8 +4669,8 @@ function FloPayAutomaticPaymentButton({
           method: floPayErr.checkoutMethod ?? "paypal"
         });
       } finally {
-        clearPayPalResumeState();
-        clearPayPalRedirectParams();
+        clearPayPalResumeState2();
+        clearPayPalRedirectParams2();
         if (isMountedRef.current) {
           setOverlayStatus(null);
           setOverlayError(null);
@@ -4573,7 +4784,6 @@ function FloPayAutomaticPaymentButton({
                 sessionId: fallbackSession.sessionId,
                 checkoutMode: "full",
                 billingApiUrl: resolvedBillingUrl,
-                fallbackPublishableKey,
                 initialErrorMessage: fallbackSession.errorMessage,
                 cardTitleContent: null,
                 showSecurityFooter: false,