@flopay/react 1.2.5 → 1.2.7

package/dist/index.d.cts

@@ -806,6 +806,15 @@ interface FloPayAutomaticPaymentSuccessEvent {
 }
 interface FloPayAutomaticPaymentButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onError'> {
     sessionId?: string;
+    /**
+     * Session-bound checkout token for a consumer-supplied {@link sessionId}
+     * (the `nonce` returned when that session was created). Post-#640 backends
+     * require it as `x-checkout-session-token` to read the session and to
+     * `/process` it; without it the existing-session path 401s with
+     * "Missing checkout session token.". Ignored on the create-session path,
+     * where the SDK mints and threads the nonce itself.
+     */
+    nonce?: string;
     createSession?: InlineSessionDraft;
     /**
      * @deprecated Ignored. The backend now picks the customer's most recent
@@ -858,6 +867,6 @@ interface FloPayAutomaticPaymentButtonProps extends Omit<React.ButtonHTMLAttribu
     onDecline?: (decline: DeclineEvent) => void;
     children?: React.ReactNode;
 }
-declare function FloPayAutomaticPaymentButton({ sessionId, createSession, paymentMethodId: _deprecatedPaymentMethodId, checkoutMethod: _deprecatedCheckoutMethod, clientId, products, items, subscriptions, account, successUrl, cancelUrl, couponCodes, tagsData, utmMetadata, billingApiUrl, locale, theme, buttonsTheme, buttonsStyles: stylesOverride, onSuccess, onError, onDecline, children, disabled, type, style, ...buttonProps }: FloPayAutomaticPaymentButtonProps): react_jsx_runtime.JSX.Element;
+declare function FloPayAutomaticPaymentButton({ sessionId, nonce, createSession, paymentMethodId: _deprecatedPaymentMethodId, checkoutMethod: _deprecatedCheckoutMethod, clientId, products, items, subscriptions, account, successUrl, cancelUrl, couponCodes, tagsData, utmMetadata, billingApiUrl, locale, theme, buttonsTheme, buttonsStyles: stylesOverride, onSuccess, onError, onDecline, children, disabled, type, style, ...buttonProps }: FloPayAutomaticPaymentButtonProps): react_jsx_runtime.JSX.Element;
 
 export { AddressElement, CardCvcElement, CardElement, CardExpiryElement, CardNumberElement, CheckoutForm, type CheckoutFormProps, type CheckoutFormRef, type CheckoutState, DirectPayPalButton, type DirectPayPalButtonProps, type ElementComponentProps, FloPayAutomaticPaymentButton, type FloPayAutomaticPaymentButtonProps, type FloPayAutomaticPaymentSuccessEvent, FloPayCheckout, type FloPayCheckoutProps, FloPayProvider, type FloPayProviderProps, PayPalButton, type PayPalButtonProps, PaymentElement, SplitCardForm, type SplitCardFormProps, type SplitCardFormRef, useCheckout, useElements, useFloPay, usePayPalFloPay };

package/dist/index.d.ts

@@ -806,6 +806,15 @@ interface FloPayAutomaticPaymentSuccessEvent {
 }
 interface FloPayAutomaticPaymentButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onError'> {
     sessionId?: string;
+    /**
+     * Session-bound checkout token for a consumer-supplied {@link sessionId}
+     * (the `nonce` returned when that session was created). Post-#640 backends
+     * require it as `x-checkout-session-token` to read the session and to
+     * `/process` it; without it the existing-session path 401s with
+     * "Missing checkout session token.". Ignored on the create-session path,
+     * where the SDK mints and threads the nonce itself.
+     */
+    nonce?: string;
     createSession?: InlineSessionDraft;
     /**
      * @deprecated Ignored. The backend now picks the customer's most recent
@@ -858,6 +867,6 @@ interface FloPayAutomaticPaymentButtonProps extends Omit<React.ButtonHTMLAttribu
     onDecline?: (decline: DeclineEvent) => void;
     children?: React.ReactNode;
 }
-declare function FloPayAutomaticPaymentButton({ sessionId, createSession, paymentMethodId: _deprecatedPaymentMethodId, checkoutMethod: _deprecatedCheckoutMethod, clientId, products, items, subscriptions, account, successUrl, cancelUrl, couponCodes, tagsData, utmMetadata, billingApiUrl, locale, theme, buttonsTheme, buttonsStyles: stylesOverride, onSuccess, onError, onDecline, children, disabled, type, style, ...buttonProps }: FloPayAutomaticPaymentButtonProps): react_jsx_runtime.JSX.Element;
+declare function FloPayAutomaticPaymentButton({ sessionId, nonce, createSession, paymentMethodId: _deprecatedPaymentMethodId, checkoutMethod: _deprecatedCheckoutMethod, clientId, products, items, subscriptions, account, successUrl, cancelUrl, couponCodes, tagsData, utmMetadata, billingApiUrl, locale, theme, buttonsTheme, buttonsStyles: stylesOverride, onSuccess, onError, onDecline, children, disabled, type, style, ...buttonProps }: FloPayAutomaticPaymentButtonProps): react_jsx_runtime.JSX.Element;
 
 export { AddressElement, CardCvcElement, CardElement, CardExpiryElement, CardNumberElement, CheckoutForm, type CheckoutFormProps, type CheckoutFormRef, type CheckoutState, DirectPayPalButton, type DirectPayPalButtonProps, type ElementComponentProps, FloPayAutomaticPaymentButton, type FloPayAutomaticPaymentButtonProps, type FloPayAutomaticPaymentSuccessEvent, FloPayCheckout, type FloPayCheckoutProps, FloPayProvider, type FloPayProviderProps, PayPalButton, type PayPalButtonProps, PaymentElement, SplitCardForm, type SplitCardFormProps, type SplitCardFormRef, useCheckout, useElements, useFloPay, usePayPalFloPay };

package/dist/index.mjs

@@ -516,9 +516,9 @@ function buildSyntheticSession(params, checkoutModeOverride) {
     cancelUrl: params.cancelUrl,
     checkoutMode: checkoutModeOverride ?? params.checkoutMode ?? "full",
     products: inputProducts.map((p, idx) => ({
-      uuid: `synthetic-${p.type}-${idx}`,
+      uuid: `synthetic-${p.type ?? "item"}-${idx}`,
       checkoutSessionId: "",
-      type: p.type,
+      type: p.type ?? "item",
       code: p.code,
       name: p.name ?? null,
       quantity: p.quantity ?? 1,
@@ -4418,11 +4418,13 @@ async function processSavedPaymentForMode({
   billingApiUrl,
   sessionId,
   session,
+  nonce,
   tokenizedData,
   returnUrl
 }) {
   const baseUrl = billingApiUrl.replace(/\/+$/, "");
   const resolvedSessionId = sessionId ?? session.id;
+  const resolvedNonce = nonce ?? session.clientSecret;
   const customerId = session.customer?.id ?? session.accountData?.userId ?? "";
   const customerEmail = session.customer?.email ?? session.accountData?.email ?? "";
   const firstName = session.customer?.firstName ?? session.accountData?.firstName ?? "";
@@ -4432,7 +4434,7 @@ async function processSavedPaymentForMode({
   const api = new PaymentAPI3(baseUrl);
   const response = await retryOnceOnFetchFailure(() => api.processPayment(customerId, {
     sessionId: resolvedSessionId,
-    nonce: session.clientSecret,
+    nonce: resolvedNonce,
     tokenizedData,
     accountData: {
       userId: customerId,
@@ -4475,7 +4477,7 @@ async function processSavedPaymentForMode({
     const recoveredRedirect = await recover3DSRedirectResult({
       billingApiUrl: baseUrl,
       sessionId: resolvedSessionId,
-      nonce: session.clientSecret,
+      nonce: resolvedNonce,
       responseJson: json
     });
     if (recoveredRedirect) {
@@ -6653,6 +6655,7 @@ function resolveCreateSessionDraft(props) {
 }
 function FloPayAutomaticPaymentButton({
   sessionId,
+  nonce,
   createSession,
   // Deprecated — accepted for back-compat and silently ignored. Backend
   // resolves the customer's latest payment method server-side.
@@ -6784,6 +6787,7 @@ function FloPayAutomaticPaymentButton({
     if (!session) {
       throw new FloPayError8("No session data returned", "api_error");
     }
+    const effectiveNonce = session.clientSecret || nonce;
     if (session.status === "complete") {
       await showSuccess({
         result: { status: "succeeded" },
@@ -6839,7 +6843,8 @@ function FloPayAutomaticPaymentButton({
       const result = await processSavedPaymentForMode({
         billingApiUrl: resolvedBillingUrl,
         sessionId: resolvedSessionId ?? session.id,
-        session
+        session,
+        nonce: effectiveNonce
       });
       if (result.type !== "success") {
         throw checkoutProcessErrorToFloPayError(
@@ -6866,11 +6871,13 @@ function FloPayAutomaticPaymentButton({
       if (shouldShowFallbackCheckout(floPayErr, fallbackSessionId) && fallbackSessionId && isMountedRef.current) {
         setFallbackSession({
           sessionId: fallbackSessionId,
-          errorMessage: floPayErr.message
+          errorMessage: floPayErr.message,
+          nonce: effectiveNonce || void 0
         });
       }
     }
   }, [
+    nonce,
     resolvedBillingUrl,
     showError,
     showSuccess
@@ -6911,7 +6918,7 @@ function FloPayAutomaticPaymentButton({
     try {
       const api = new PaymentAPI7(resolvedBillingUrl);
       if (sessionId) {
-        const result = await api.getUnifiedCheckoutSession(sessionId);
+        const result = await api.getUnifiedCheckoutSession(sessionId, nonce);
         await processResolvedSession(result, sessionId);
         return;
       }
@@ -6950,6 +6957,7 @@ function FloPayAutomaticPaymentButton({
     createSessionDraft,
     disabled,
     isProcessing,
+    nonce,
     processResolvedSession,
     resolvedBillingUrl,
     sessionId,
@@ -7084,6 +7092,7 @@ function FloPayAutomaticPaymentButton({
               FloPayCheckout,
               {
                 sessionId: fallbackSession.sessionId,
+                nonce: fallbackSession.nonce,
                 checkoutMode: "full",
                 billingApiUrl: resolvedBillingUrl,
                 locale,