@flopay/react 0.4.4 → 0.4.5

package/dist/index.cjs

@@ -2445,6 +2445,7 @@ function FloPayCheckout({
   avsLayout,
   submitLabel,
   className,
+  initialErrorMessage = null,
   children,
   checkoutMode: checkoutModeProp,
   confirmLabel,
@@ -2467,7 +2468,7 @@ function FloPayCheckout({
   const [loadError, setLoadError] = (0, import_react8.useState)(null);
   const [currentMode, setCurrentMode] = (0, import_react8.useState)("full");
   const [confirmProcessing, setConfirmProcessing] = (0, import_react8.useState)(false);
-  const [modeError, setModeError] = (0, import_react8.useState)(null);
+  const [modeError, setModeError] = (0, import_react8.useState)(initialErrorMessage);
   const [modeOverlayStatus, setModeOverlayStatus] = (0, import_react8.useState)(null);
   const [modeOverlayError, setModeOverlayError] = (0, import_react8.useState)(null);
   const [createSessionPatch, setCreateSessionPatch] = (0, import_react8.useState)(void 0);
@@ -2514,6 +2515,9 @@ function FloPayCheckout({
     setCreateSessionPatch(void 0);
     setCreateSessionPatchBaseHash(baseCreateSessionHash);
   }, [baseCreateSessionHash]);
+  (0, import_react8.useEffect)(() => {
+    setModeError(initialErrorMessage);
+  }, [initialErrorMessage]);
   const emitDecline = (0, import_react8.useCallback)(
     (method, input, overrides) => {
       onDeclineRef.current?.(buildDeclineEvent(method, input, overrides));
@@ -2606,10 +2610,10 @@ function FloPayCheckout({
   }, [sessionIdProp]);
   (0, import_react8.useEffect)(() => {
     autoCheckoutAttempted.current = false;
-    setModeError(null);
+    setModeError(initialErrorMessage);
     setModeOverlayError(null);
     setModeOverlayStatus(null);
-  }, [sessionIdProp, createSessionHash]);
+  }, [createSessionHash, initialErrorMessage, sessionIdProp]);
   async function resolveInlineSession(params, cacheKey) {
     const api = new import_js2.PaymentAPI(resolvedBillingUrl);
     let sid = typeof window !== "undefined" ? window.sessionStorage.getItem(cacheKey) : null;
@@ -4454,7 +4458,7 @@ function FloPayAutomaticPaymentButton({
           padding: "1.5rem",
           zIndex: 1100
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "div",
           {
             style: {
@@ -4470,48 +4474,21 @@ function FloPayAutomaticPaymentButton({
               flexDirection: "column",
               gap: "1rem"
             },
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    gap: "1rem",
-                    alignItems: "flex-start"
-                  },
-                  children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                    "div",
-                    {
-                      style: {
-                        flex: 1,
-                        background: "#fef2f2",
-                        color: "#b91c1c",
-                        border: "1px solid #fecaca",
-                        borderRadius: "12px",
-                        padding: "0.75rem 1rem",
-                        fontSize: "0.9rem",
-                        lineHeight: 1.5
-                      },
-                      children: fallbackSession.errorMessage
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                FloPayCheckout,
-                {
-                  sessionId: fallbackSession.sessionId,
-                  checkoutMode: "full",
-                  billingApiUrl: resolvedBillingUrl,
-                  fallbackPublishableKey,
-                  cardTitleContent: null,
-                  showSecurityFooter: false,
-                  onComplete: handleFallbackComplete,
-                  onError: handleFallbackError,
-                  onDecline: handleFallbackDecline
-                }
-              )
-            ]
+            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+              FloPayCheckout,
+              {
+                sessionId: fallbackSession.sessionId,
+                checkoutMode: "full",
+                billingApiUrl: resolvedBillingUrl,
+                fallbackPublishableKey,
+                initialErrorMessage: fallbackSession.errorMessage,
+                cardTitleContent: null,
+                showSecurityFooter: false,
+                onComplete: handleFallbackComplete,
+                onError: handleFallbackError,
+                onDecline: handleFallbackDecline
+              }
+            )
           }
         )
       }