@flopay/react 0.5.18 → 0.5.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -100,7 +100,7 @@ function FloPayProvider({
100
100
  }
101
101
 
102
102
  // src/flopay-checkout.tsx
103
- import React7, { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo3, useRef as useRef3, useState as useState4 } from "react";
103
+ import React6, { useCallback as useCallback2, useEffect as useEffect4, useMemo as useMemo3, useRef as useRef3, useState as useState3 } from "react";
104
104
  import { PaymentAPI as PaymentAPI3 } from "@flopay/js";
105
105
  import { SDK_VERSION, FloPayError as FloPayError4, resolveBillingApiUrl as resolveBillingApiUrl3, buildCheckoutDisplayData, resolveButtonsLayoutTheme as resolveButtonsLayoutTheme2 } from "@flopay/shared";
106
106
 
@@ -249,7 +249,7 @@ import {
249
249
  getStateFromPostalCode
250
250
  } from "@flopay/shared";
251
251
  import { PaymentAPI } from "@flopay/js";
252
- import { forwardRef, useCallback as useCallback2, useContext as useContext3, useEffect as useEffect4, useImperativeHandle, useMemo as useMemo2, useRef as useRef2, useState as useState3 } from "react";
252
+ import { forwardRef, useCallback, useContext as useContext3, useEffect as useEffect3, useImperativeHandle, useMemo as useMemo2, useRef as useRef2, useState as useState2 } from "react";
253
253
 
254
254
  // src/hooks.ts
255
255
  import { useContext as useContext2 } from "react";
@@ -622,9 +622,6 @@ function wasSessionRecentlyCompleted(sessionId) {
622
622
  }
623
623
  }
624
624
 
625
- // src/in-app-browser-notice.tsx
626
- import { useCallback, useEffect as useEffect3, useState as useState2 } from "react";
627
-
628
625
  // src/in-app-browser.ts
629
626
  function isInAppBrowser(userAgent) {
630
627
  const ua = userAgent ?? (typeof navigator !== "undefined" ? navigator.userAgent : "");
@@ -640,101 +637,9 @@ function isInAppBrowser(userAgent) {
640
637
  return false;
641
638
  }
642
639
 
643
- // src/in-app-browser-notice.tsx
644
- import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
645
- var DEFAULT_MESSAGE = "PayPal and some digital wallets aren't supported in this browser. Open this page in your device's browser to use them.";
646
- function InAppBrowserNotice({
647
- message,
648
- openButtonLabel,
649
- copiedButtonLabel,
650
- containerStyle,
651
- buttonStyle,
652
- onOpenInBrowser
653
- }) {
654
- const [copied, setCopied] = useState2(false);
655
- const [inAppBrowser, setInAppBrowser] = useState2(false);
656
- useEffect3(() => {
657
- setInAppBrowser(isInAppBrowser());
658
- }, []);
659
- const defaultOpenLabel = inAppBrowser ? "Copy link" : "Open in browser";
660
- const defaultCopiedLabel = inAppBrowser ? "Link copied \u2014 open Safari/Chrome and paste" : "Link copied \u2014 paste in your browser";
661
- const effectiveOpenLabel = openButtonLabel ?? defaultOpenLabel;
662
- const effectiveCopiedLabel = copiedButtonLabel ?? defaultCopiedLabel;
663
- const handleClick = useCallback(async () => {
664
- if (typeof window === "undefined") return;
665
- const url = window.location.href;
666
- let opened = false;
667
- if (!inAppBrowser) {
668
- try {
669
- const win = window.open(url, "_blank");
670
- opened = !!win;
671
- } catch {
672
- opened = false;
673
- }
674
- }
675
- let didCopy = false;
676
- if (!opened) {
677
- if (typeof navigator !== "undefined" && typeof navigator.clipboard?.writeText === "function") {
678
- try {
679
- await navigator.clipboard.writeText(url);
680
- didCopy = true;
681
- setCopied(true);
682
- } catch {
683
- didCopy = false;
684
- }
685
- }
686
- }
687
- onOpenInBrowser?.({ opened, copied: didCopy });
688
- }, [inAppBrowser, onOpenInBrowser]);
689
- return /* @__PURE__ */ jsxs3(
690
- "div",
691
- {
692
- role: "status",
693
- "data-testid": "flopay-in-app-browser-notice",
694
- style: {
695
- marginTop: "0.75rem",
696
- padding: "0.75rem 0.875rem",
697
- background: "#FFFBEB",
698
- border: "1px solid #FDE68A",
699
- borderRadius: 8,
700
- color: "#92400E",
701
- fontSize: "0.85rem",
702
- lineHeight: 1.4,
703
- display: "flex",
704
- flexDirection: "column",
705
- gap: "0.5rem",
706
- ...containerStyle
707
- },
708
- children: [
709
- /* @__PURE__ */ jsx5("span", { children: message ?? DEFAULT_MESSAGE }),
710
- /* @__PURE__ */ jsx5(
711
- "button",
712
- {
713
- type: "button",
714
- onClick: handleClick,
715
- style: {
716
- alignSelf: "flex-start",
717
- padding: "0.4rem 0.75rem",
718
- background: "transparent",
719
- border: "1px solid #92400E",
720
- borderRadius: 6,
721
- color: "#92400E",
722
- fontSize: "0.85rem",
723
- fontWeight: 600,
724
- cursor: "pointer",
725
- ...buttonStyle
726
- },
727
- children: copied ? effectiveCopiedLabel : effectiveOpenLabel
728
- }
729
- )
730
- ]
731
- }
732
- );
733
- }
734
-
735
640
  // src/split-card-form.tsx
736
641
  import { FloPayError as FloPayError2 } from "@flopay/shared";
737
- import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
642
+ import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
738
643
  var WALLET_RESUME_KEY = "flopay_wallet_resume";
739
644
  var FLOPAY_KEYFRAMES = `
740
645
  @keyframes flopay-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
@@ -776,7 +681,7 @@ function normalizeBeforeButtonClickError(method, err) {
776
681
  );
777
682
  }
778
683
  function FloPayKeyframes() {
779
- return /* @__PURE__ */ jsx6("style", { children: FLOPAY_KEYFRAMES });
684
+ return /* @__PURE__ */ jsx5("style", { children: FLOPAY_KEYFRAMES });
780
685
  }
781
686
  function toCssSize(value) {
782
687
  if (typeof value === "number") return `${value}px`;
@@ -797,8 +702,8 @@ function ExpressCheckoutReadySwap({
797
702
  children
798
703
  }) {
799
704
  if (state === "unavailable" || state === "load_error") return null;
800
- return /* @__PURE__ */ jsxs4("div", { style: { position: "relative", minHeight: 44 }, children: [
801
- /* @__PURE__ */ jsx6(
705
+ return /* @__PURE__ */ jsxs3("div", { style: { position: "relative", minHeight: 44 }, children: [
706
+ /* @__PURE__ */ jsx5(
802
707
  "div",
803
708
  {
804
709
  "data-testid": placeholderTestId,
@@ -817,7 +722,7 @@ function ExpressCheckoutReadySwap({
817
722
  }
818
723
  }
819
724
  ),
820
- /* @__PURE__ */ jsx6(
725
+ /* @__PURE__ */ jsx5(
821
726
  "div",
822
727
  {
823
728
  style: {
@@ -832,9 +737,12 @@ function ExpressCheckoutReadySwap({
832
737
  )
833
738
  ] });
834
739
  }
740
+ function isExpressCheckoutRowVisible(state) {
741
+ return state !== "unavailable" && state !== "load_error";
742
+ }
835
743
  var SplitCardForm = forwardRef(
836
744
  function SplitCardForm2(props, ref) {
837
- return /* @__PURE__ */ jsx6(SplitCardFormInner, { ...props, innerRef: ref });
745
+ return /* @__PURE__ */ jsx5(SplitCardFormInner, { ...props, innerRef: ref });
838
746
  }
839
747
  );
840
748
  function PayPalButtonInner({
@@ -851,19 +759,15 @@ function PayPalButtonInner({
851
759
  }) {
852
760
  const stripe = useStripeRaw();
853
761
  const elements = useStripeElements();
854
- const [loadState, setLoadState] = useState3("loading");
855
- const onLoadStateChangeRef = useRef2(onLoadStateChange);
856
- useEffect4(() => {
857
- onLoadStateChangeRef.current = onLoadStateChange;
858
- }, [onLoadStateChange]);
859
- useEffect4(() => {
860
- onLoadStateChangeRef.current?.(loadState);
861
- }, [loadState]);
862
- const [submitting, setSubmitting] = useState3(false);
762
+ const [loadState, setLoadState] = useState2("loading");
763
+ useEffect3(() => {
764
+ onLoadStateChange?.(loadState);
765
+ }, [loadState, onLoadStateChange]);
766
+ const [submitting, setSubmitting] = useState2(false);
863
767
  const paypalResumeAttempted = useRef2(false);
864
768
  const beforeClickRef = useRef2(null);
865
769
  const baseUrl = billingApiUrl.replace(/\/+$/, "");
866
- useEffect4(() => {
770
+ useEffect3(() => {
867
771
  if (!stripe || paypalResumeAttempted.current) return;
868
772
  const params = new URLSearchParams(window.location.search);
869
773
  const paymentIntentId = params.get("payment_intent");
@@ -910,7 +814,7 @@ function PayPalButtonInner({
910
814
  }
911
815
  })();
912
816
  }, [stripe, onTokenizedBody, onErrorChange, onDecline]);
913
- const handlePayPalClick = useCallback2(async (event) => {
817
+ const handlePayPalClick = useCallback(async (event) => {
914
818
  if (isProcessing || submitting) {
915
819
  event.reject();
916
820
  return;
@@ -928,7 +832,7 @@ function PayPalButtonInner({
928
832
  onButtonClick?.("paypal");
929
833
  event.resolve();
930
834
  }, [isProcessing, onButtonClick, runBeforeButtonClick, submitting]);
931
- const handlePayPalConfirm = useCallback2(async (event) => {
835
+ const handlePayPalConfirm = useCallback(async (event) => {
932
836
  if (!stripe || !elements) return;
933
837
  let prepared = beforeClickRef.current;
934
838
  beforeClickRef.current = null;
@@ -1020,8 +924,8 @@ function PayPalButtonInner({
1020
924
  setSubmitting(false);
1021
925
  }
1022
926
  }, [stripe, elements, sessionId, email, baseUrl, onTokenizedBody, onErrorChange, onDecline, runBeforeButtonClick]);
1023
- return /* @__PURE__ */ jsxs4(Fragment2, { children: [
1024
- /* @__PURE__ */ jsx6(ExpressCheckoutReadySwap, { state: loadState, placeholderTestId: "flopay-paypal-placeholder", children: /* @__PURE__ */ jsx6(
927
+ return /* @__PURE__ */ jsxs3(Fragment2, { children: [
928
+ /* @__PURE__ */ jsx5(ExpressCheckoutReadySwap, { state: loadState, placeholderTestId: "flopay-paypal-placeholder", children: /* @__PURE__ */ jsx5(
1025
929
  ExpressCheckoutElement,
1026
930
  {
1027
931
  onReady: (event) => setLoadState(resolveExpressCheckoutLoadState(event, ["paypal"])),
@@ -1046,7 +950,7 @@ function PayPalButtonInner({
1046
950
  }
1047
951
  }
1048
952
  ) }),
1049
- submitting && /* @__PURE__ */ jsx6(ProcessingOverlay, { status: "processing" })
953
+ submitting && /* @__PURE__ */ jsx5(ProcessingOverlay, { status: "processing" })
1050
954
  ] });
1051
955
  }
1052
956
  function WalletButtonInner({
@@ -1064,19 +968,15 @@ function WalletButtonInner({
1064
968
  }) {
1065
969
  const stripe = useStripeRaw();
1066
970
  const elements = useStripeElements();
1067
- const [loadState, setLoadState] = useState3("loading");
1068
- const onLoadStateChangeRef = useRef2(onLoadStateChange);
1069
- useEffect4(() => {
1070
- onLoadStateChangeRef.current = onLoadStateChange;
1071
- }, [onLoadStateChange]);
1072
- useEffect4(() => {
1073
- onLoadStateChangeRef.current?.(loadState);
1074
- }, [loadState]);
1075
- const [submitting, setSubmitting] = useState3(false);
971
+ const [loadState, setLoadState] = useState2("loading");
972
+ useEffect3(() => {
973
+ onLoadStateChange?.(loadState);
974
+ }, [loadState, onLoadStateChange]);
975
+ const [submitting, setSubmitting] = useState2(false);
1076
976
  const baseUrl = billingApiUrl.replace(/\/+$/, "");
1077
977
  const lastWalletMethodRef = useRef2("card");
1078
978
  const beforeClickRef = useRef2(null);
1079
- const handleWalletConfirm = useCallback2(
979
+ const handleWalletConfirm = useCallback(
1080
980
  async (event) => {
1081
981
  if (!stripe || !elements) return;
1082
982
  const walletType = event.expressPaymentType;
@@ -1165,8 +1065,8 @@ function WalletButtonInner({
1165
1065
  },
1166
1066
  [stripe, elements, sessionId, email, baseUrl, onTokenizedBody, onErrorChange, onDecline, runBeforeButtonClick]
1167
1067
  );
1168
- return /* @__PURE__ */ jsxs4(Fragment2, { children: [
1169
- /* @__PURE__ */ jsx6(ExpressCheckoutReadySwap, { state: loadState, placeholderTestId: "flopay-wallet-placeholder", children: /* @__PURE__ */ jsx6(
1068
+ return /* @__PURE__ */ jsxs3(Fragment2, { children: [
1069
+ /* @__PURE__ */ jsx5(ExpressCheckoutReadySwap, { state: loadState, placeholderTestId: "flopay-wallet-placeholder", children: /* @__PURE__ */ jsx5(
1170
1070
  ExpressCheckoutElement,
1171
1071
  {
1172
1072
  onReady: (event) => setLoadState(resolveExpressCheckoutLoadState(event, ["applePay", "googlePay"])),
@@ -1205,7 +1105,7 @@ function WalletButtonInner({
1205
1105
  }
1206
1106
  }
1207
1107
  ) }),
1208
- submitting && /* @__PURE__ */ jsx6(ProcessingOverlay, { status: "processing" })
1108
+ submitting && /* @__PURE__ */ jsx5(ProcessingOverlay, { status: "processing" })
1209
1109
  ] });
1210
1110
  }
1211
1111
  function SplitCardFormInner({
@@ -1264,16 +1164,16 @@ function SplitCardFormInner({
1264
1164
  const elements = useElements();
1265
1165
  const checkout = useContext3(CheckoutContext);
1266
1166
  const contextBillingUrl = useBillingApiUrl();
1267
- const [processing, setProcessing] = useState3(false);
1268
- const [error, setError] = useState3(null);
1269
- const [is3DSActive, setIs3DSActive] = useState3(false);
1270
- const [selectedCountry, setSelectedCountry] = useState3(countryProp ?? "US");
1271
- const [zipCode, setZipCode] = useState3(zipProp ?? "");
1272
- const [addressLine1, setAddressLine1] = useState3(addressLine1Prop ?? "");
1273
- const [addressLine2, setAddressLine2] = useState3(addressLine2Prop ?? "");
1274
- const [city, setCity] = useState3(cityProp ?? "");
1275
- const [stateValue, setStateValue] = useState3(stateProp ?? "");
1276
- const [accountPatch, setAccountPatch] = useState3({});
1167
+ const [processing, setProcessing] = useState2(false);
1168
+ const [error, setError] = useState2(null);
1169
+ const [is3DSActive, setIs3DSActive] = useState2(false);
1170
+ const [selectedCountry, setSelectedCountry] = useState2(countryProp ?? "US");
1171
+ const [zipCode, setZipCode] = useState2(zipProp ?? "");
1172
+ const [addressLine1, setAddressLine1] = useState2(addressLine1Prop ?? "");
1173
+ const [addressLine2, setAddressLine2] = useState2(addressLine2Prop ?? "");
1174
+ const [city, setCity] = useState2(cityProp ?? "");
1175
+ const [stateValue, setStateValue] = useState2(stateProp ?? "");
1176
+ const [accountPatch, setAccountPatch] = useState2({});
1277
1177
  const zipCodeRef = useRef2(zipProp ?? "");
1278
1178
  const selectedCountryRef = useRef2(countryProp ?? "US");
1279
1179
  const addressLine1Ref = useRef2(addressLine1Prop ?? "");
@@ -1282,25 +1182,25 @@ function SplitCardFormInner({
1282
1182
  const stateRef = useRef2(stateProp ?? "");
1283
1183
  const avsConfig = useMemo2(() => resolveAVSConfig(enableAVSProp), [enableAVSProp]);
1284
1184
  const enableAVS = avsConfig !== null;
1285
- const [viewState, setViewState] = useState3(initialCardOpen ? "card" : "buttons");
1185
+ const [viewState, setViewState] = useState2(initialCardOpen ? "card" : "buttons");
1286
1186
  const showCardForm = viewState === "expanding" || viewState === "card";
1287
1187
  const TRANSITION_MS = 280;
1288
- const expandToCard = useCallback2(() => {
1188
+ const expandToCard = useCallback(() => {
1289
1189
  setViewState("expanding");
1290
1190
  setTimeout(() => setViewState("card"), TRANSITION_MS);
1291
1191
  }, []);
1292
- const collapseToButtons = useCallback2(() => {
1192
+ const collapseToButtons = useCallback(() => {
1293
1193
  setViewState("collapsing");
1294
1194
  setTimeout(() => setViewState("buttons"), TRANSITION_MS);
1295
1195
  }, []);
1296
- useEffect4(() => {
1196
+ useEffect3(() => {
1297
1197
  if (layout === "buttons" && initialCardOpen) {
1298
1198
  setViewState("card");
1299
1199
  }
1300
1200
  }, [layout, initialCardOpen]);
1301
- const [fullName, setFullName] = useState3("");
1302
- const [formReady, setFormReady] = useState3(false);
1303
- const [overlayStatus, setOverlayStatus] = useState3(null);
1201
+ const [fullName, setFullName] = useState2("");
1202
+ const [formReady, setFormReady] = useState2(false);
1203
+ const [overlayStatus, setOverlayStatus] = useState2(null);
1304
1204
  const processingRef = useRef2(false);
1305
1205
  const resolvedBillingApiUrl = billingApiUrl || contextBillingUrl;
1306
1206
  const displayError = externalError ?? error;
@@ -1353,39 +1253,40 @@ function SplitCardFormInner({
1353
1253
  captureMethod: "manual",
1354
1254
  setupFutureUsage: "off_session"
1355
1255
  }), [amountInCents, currency]);
1356
- const updateError = useCallback2(
1256
+ const updateError = useCallback(
1357
1257
  (err) => {
1358
1258
  setError(err);
1359
1259
  onErrorChange?.(err);
1360
1260
  },
1361
1261
  [onErrorChange]
1362
1262
  );
1363
- const emitDecline = useCallback2(
1263
+ const emitDecline = useCallback(
1364
1264
  (method, input, overrides) => {
1365
1265
  onDecline?.(buildDeclineEvent(method, input, overrides));
1366
1266
  },
1367
1267
  [onDecline]
1368
1268
  );
1369
1269
  const showWallets = showApplePay || showGooglePay;
1370
- const [paypalLoadState, setPaypalLoadState] = useState3("loading");
1371
- const [walletLoadState, setWalletLoadState] = useState3("loading");
1372
- const [inAppBrowserDetected, setInAppBrowserDetected] = useState3(false);
1373
- useEffect4(() => {
1270
+ const [paypalLoadState, setPaypalLoadState] = useState2("loading");
1271
+ const [walletLoadState, setWalletLoadState] = useState2("loading");
1272
+ const [inAppBrowserDetected, setInAppBrowserDetected] = useState2();
1273
+ useEffect3(() => {
1374
1274
  setInAppBrowserDetected(isInAppBrowser());
1375
1275
  }, []);
1376
- const expectedPayPal = showPayPal && !!paypalStripeInstance;
1377
- const expectedWallets = showWallets && !!stripeInstance;
1378
- const paypalLoadFailed = expectedPayPal && (paypalLoadState === "load_error" || paypalLoadState === "unavailable");
1379
- const walletsLoadFailed = expectedWallets && walletLoadState === "load_error";
1380
- const showInAppBrowserNotice = (expectedPayPal || expectedWallets) && (inAppBrowserDetected || paypalLoadFailed || walletsLoadFailed);
1381
- const handleNameChange = useCallback2((value) => {
1276
+ const shouldShowPayPal = showPayPal && inAppBrowserDetected === false;
1277
+ const shouldShowWallets = showWallets && inAppBrowserDetected === false;
1278
+ const shouldRenderPayPal = shouldShowPayPal && !!paypalStripeInstance;
1279
+ const shouldRenderWallets = shouldShowWallets && !!stripeInstance;
1280
+ const shouldDisplayPayPalRow = shouldRenderPayPal && isExpressCheckoutRowVisible(paypalLoadState);
1281
+ const shouldDisplayWalletRow = shouldRenderWallets && isExpressCheckoutRowVisible(walletLoadState);
1282
+ const handleNameChange = useCallback((value) => {
1382
1283
  setFullName(value);
1383
1284
  onFullNameChange?.(value);
1384
1285
  const parts = value.trim().split(/\s+/);
1385
1286
  onFirstNameChange?.(parts[0] ?? "");
1386
1287
  onLastNameChange?.(parts.length > 1 ? parts.slice(1).join(" ") : "");
1387
1288
  }, [onFullNameChange, onFirstNameChange, onLastNameChange]);
1388
- const applyInlineSessionPatch = useCallback2(
1289
+ const applyInlineSessionPatch = useCallback(
1389
1290
  (patch, method) => {
1390
1291
  if (!checkout.applyInlineSessionPatch) {
1391
1292
  return Promise.resolve({ error: null, sessionId });
@@ -1402,7 +1303,7 @@ function SplitCardFormInner({
1402
1303
  },
1403
1304
  [checkout.applyInlineSessionPatch, onError, sessionId, updateError]
1404
1305
  );
1405
- const runBeforeButtonClick = useCallback2(async (method) => {
1306
+ const runBeforeButtonClick = useCallback(async (method) => {
1406
1307
  if (!onBeforeButtonClick) return { proceed: true };
1407
1308
  try {
1408
1309
  const result = await onBeforeButtonClick({
@@ -1438,7 +1339,7 @@ function SplitCardFormInner({
1438
1339
  return { proceed: false };
1439
1340
  }
1440
1341
  }, [applyInlineSessionPatch, checkout.inlineSessionDraft, onBeforeButtonClick, onError, sessionId, updateError]);
1441
- const processPaymentInternal = useCallback2(
1342
+ const processPaymentInternal = useCallback(
1442
1343
  async (tokenizedBody, overrides) => {
1443
1344
  if (processingRef.current) return;
1444
1345
  processingRef.current = true;
@@ -1622,7 +1523,7 @@ function SplitCardFormInner({
1622
1523
  },
1623
1524
  [baseUrl, sessionId, resolvedAccount, fullName, chv, flopay, paypalFlopay, onComplete, onError, updateError, emitDecline]
1624
1525
  );
1625
- const dispatchTokenizedBody = useCallback2(
1526
+ const dispatchTokenizedBody = useCallback(
1626
1527
  (tokenizedBody, overrides) => {
1627
1528
  if (onTokenizedBody) {
1628
1529
  onTokenizedBody(tokenizedBody);
@@ -1659,7 +1560,7 @@ function SplitCardFormInner({
1659
1560
  }
1660
1561
  }
1661
1562
  }), [flopay, dispatchTokenizedBody, onError, updateError, emitDecline]);
1662
- useEffect4(() => {
1563
+ useEffect3(() => {
1663
1564
  if (typeof window === "undefined") return;
1664
1565
  const stored = localStorage.getItem(WALLET_RESUME_KEY);
1665
1566
  if (!stored) return;
@@ -1677,7 +1578,7 @@ function SplitCardFormInner({
1677
1578
  localStorage.removeItem(WALLET_RESUME_KEY);
1678
1579
  }
1679
1580
  }, [sessionId, dispatchTokenizedBody]);
1680
- const handleSubmit = useCallback2(
1581
+ const handleSubmit = useCallback(
1681
1582
  async (e) => {
1682
1583
  e.preventDefault();
1683
1584
  if (!flopay || !elements || isSubmitting || processingRef.current) return;
@@ -1819,7 +1720,7 @@ function SplitCardFormInner({
1819
1720
  );
1820
1721
  const isReady = flopay !== null && elements !== null;
1821
1722
  if (!isReady) {
1822
- return /* @__PURE__ */ jsx6("div", { "data-testid": "flopay-loading", "aria-busy": "true", children: "Loading payment form..." });
1723
+ return /* @__PURE__ */ jsx5("div", { "data-testid": "flopay-loading", "aria-busy": "true", children: "Loading payment form..." });
1823
1724
  }
1824
1725
  const isButtons = layout === "buttons";
1825
1726
  const resolvedBorder = isButtons ? bStyles.cardInputBorder ?? "#e5e7eb" : "#A4A4FF";
@@ -1862,7 +1763,7 @@ function SplitCardFormInner({
1862
1763
  invalid: { color: "#ef4444" }
1863
1764
  }
1864
1765
  };
1865
- const cardFormBlock = /* @__PURE__ */ jsxs4("div", { style: {
1766
+ const cardFormBlock = /* @__PURE__ */ jsxs3("div", { style: {
1866
1767
  backgroundColor: cardBg,
1867
1768
  borderRadius: "8px",
1868
1769
  padding: isButtons ? "0" : "1rem",
@@ -1870,7 +1771,7 @@ function SplitCardFormInner({
1870
1771
  ...isButtons ? { padding: bStyles.cardFormContainer?.padding ?? "0" } : {},
1871
1772
  ...sharedInputPlaceholderVars
1872
1773
  }, children: [
1873
- /* @__PURE__ */ jsx6("style", { children: `
1774
+ /* @__PURE__ */ jsx5("style", { children: `
1874
1775
  .flopay-shared-input::placeholder {
1875
1776
  color: var(--flopay-input-placeholder-color);
1876
1777
  opacity: 1;
@@ -1879,12 +1780,12 @@ function SplitCardFormInner({
1879
1780
  font-weight: var(--flopay-input-font-weight);
1880
1781
  }
1881
1782
  ` }),
1882
- isButtons && showCardForm && /* @__PURE__ */ jsxs4("div", { style: {
1783
+ isButtons && showCardForm && /* @__PURE__ */ jsxs3("div", { style: {
1883
1784
  display: "flex",
1884
1785
  alignItems: "center",
1885
1786
  padding: "0.75rem 0 0.625rem"
1886
1787
  }, children: [
1887
- /* @__PURE__ */ jsxs4(
1788
+ /* @__PURE__ */ jsxs3(
1888
1789
  "button",
1889
1790
  {
1890
1791
  type: "button",
@@ -1906,7 +1807,7 @@ function SplitCardFormInner({
1906
1807
  },
1907
1808
  "aria-label": "Back to payment methods",
1908
1809
  children: [
1909
- /* @__PURE__ */ jsx6("span", { style: {
1810
+ /* @__PURE__ */ jsx5("span", { style: {
1910
1811
  display: "inline-flex",
1911
1812
  alignItems: "center",
1912
1813
  justifyContent: "center",
@@ -1916,12 +1817,12 @@ function SplitCardFormInner({
1916
1817
  backgroundColor: "#f3f4f6",
1917
1818
  transition: "background-color 0.15s",
1918
1819
  ...bStyles.backButtonIcon
1919
- }, children: /* @__PURE__ */ jsx6("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx6("path", { d: "M15 18l-6-6 6-6" }) }) }),
1920
- /* @__PURE__ */ jsx6(BackButtonContentSlot, { content: cardBackButtonContent })
1820
+ }, children: /* @__PURE__ */ jsx5("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx5("path", { d: "M15 18l-6-6 6-6" }) }) }),
1821
+ /* @__PURE__ */ jsx5(BackButtonContentSlot, { content: cardBackButtonContent })
1921
1822
  ]
1922
1823
  }
1923
1824
  ),
1924
- hideTitle ? /* @__PURE__ */ jsx6("div", { style: { flex: 1 } }) : /* @__PURE__ */ jsx6("div", { style: {
1825
+ hideTitle ? /* @__PURE__ */ jsx5("div", { style: { flex: 1 } }) : /* @__PURE__ */ jsx5("div", { style: {
1925
1826
  flex: 1,
1926
1827
  textAlign: "center",
1927
1828
  fontWeight: 600,
@@ -1929,18 +1830,18 @@ function SplitCardFormInner({
1929
1830
  color: "#262833",
1930
1831
  paddingRight: 80,
1931
1832
  ...bStyles.title
1932
- }, children: /* @__PURE__ */ jsx6(TitleContentSlot, { content: cardTitleContent }) })
1833
+ }, children: /* @__PURE__ */ jsx5(TitleContentSlot, { content: cardTitleContent }) })
1933
1834
  ] }),
1934
- !isButtons && !hideTitle && /* @__PURE__ */ jsx6("div", { style: { textAlign: "center", fontWeight: 600, fontSize: "1.1rem", padding: "0.5rem 0", color: "#262833" }, children: /* @__PURE__ */ jsx6(TitleContentSlot, { content: cardTitleContent }) }),
1935
- /* @__PURE__ */ jsx6("div", { style: {
1835
+ !isButtons && !hideTitle && /* @__PURE__ */ jsx5("div", { style: { textAlign: "center", fontWeight: 600, fontSize: "1.1rem", padding: "0.5rem 0", color: "#262833" }, children: /* @__PURE__ */ jsx5(TitleContentSlot, { content: cardTitleContent }) }),
1836
+ /* @__PURE__ */ jsx5("div", { style: {
1936
1837
  backgroundColor: cardInputBg,
1937
1838
  border: `1px solid ${resolvedBorder}`,
1938
1839
  borderTopLeftRadius: "8px",
1939
1840
  borderTopRightRadius: "8px",
1940
1841
  padding: "10px"
1941
- }, children: /* @__PURE__ */ jsx6(CardNumberElement, { onReady: () => setFormReady(true), options: stripeElementStyle }) }),
1942
- /* @__PURE__ */ jsxs4("div", { style: { display: "flex" }, children: [
1943
- /* @__PURE__ */ jsx6("div", { style: {
1842
+ }, children: /* @__PURE__ */ jsx5(CardNumberElement, { onReady: () => setFormReady(true), options: stripeElementStyle }) }),
1843
+ /* @__PURE__ */ jsxs3("div", { style: { display: "flex" }, children: [
1844
+ /* @__PURE__ */ jsx5("div", { style: {
1944
1845
  flex: 1,
1945
1846
  backgroundColor: cardInputBg,
1946
1847
  border: `1px solid ${resolvedBorder}`,
@@ -1948,23 +1849,23 @@ function SplitCardFormInner({
1948
1849
  borderRight: "none",
1949
1850
  borderBottomLeftRadius: "8px",
1950
1851
  padding: "10px"
1951
- }, children: /* @__PURE__ */ jsx6(CardExpiryElement, { options: stripeElementStyle }) }),
1952
- /* @__PURE__ */ jsx6("div", { style: {
1852
+ }, children: /* @__PURE__ */ jsx5(CardExpiryElement, { options: stripeElementStyle }) }),
1853
+ /* @__PURE__ */ jsx5("div", { style: {
1953
1854
  flex: 1,
1954
1855
  backgroundColor: cardInputBg,
1955
1856
  border: `1px solid ${resolvedBorder}`,
1956
1857
  borderTop: "none",
1957
1858
  borderBottomRightRadius: "8px",
1958
1859
  padding: "10px"
1959
- }, children: /* @__PURE__ */ jsx6(CardCvcElement, { options: stripeElementStyle }) })
1860
+ }, children: /* @__PURE__ */ jsx5(CardCvcElement, { options: stripeElementStyle }) })
1960
1861
  ] }),
1961
- /* @__PURE__ */ jsx6("div", { style: {
1862
+ /* @__PURE__ */ jsx5("div", { style: {
1962
1863
  backgroundColor: cardInputBg,
1963
1864
  border: `1px solid ${resolvedBorder}`,
1964
1865
  borderRadius: "8px",
1965
1866
  marginTop: "0.5rem",
1966
1867
  padding: "10px"
1967
- }, children: /* @__PURE__ */ jsx6(
1868
+ }, children: /* @__PURE__ */ jsx5(
1968
1869
  "input",
1969
1870
  {
1970
1871
  className: "flopay-shared-input",
@@ -2003,8 +1904,8 @@ function SplitCardFormInner({
2003
1904
  ...isButtons && bStyles.nameInput ? bStyles.nameInput : {}
2004
1905
  });
2005
1906
  const stateOpts = getStateOptions(cc);
2006
- return /* @__PURE__ */ jsxs4(Fragment2, { children: [
2007
- isAVSFieldVisible(avsConfig.address_line_1, cc) && /* @__PURE__ */ jsx6("div", { style: inputWrapStyle(bStyles.addressLine1Input), children: /* @__PURE__ */ jsx6(
1907
+ return /* @__PURE__ */ jsxs3(Fragment2, { children: [
1908
+ isAVSFieldVisible(avsConfig.address_line_1, cc) && /* @__PURE__ */ jsx5("div", { style: inputWrapStyle(bStyles.addressLine1Input), children: /* @__PURE__ */ jsx5(
2008
1909
  "input",
2009
1910
  {
2010
1911
  className: "flopay-shared-input",
@@ -2021,7 +1922,7 @@ function SplitCardFormInner({
2021
1922
  style: inputFieldStyle()
2022
1923
  }
2023
1924
  ) }),
2024
- isAVSFieldVisible(avsConfig.address_line_2, cc) && /* @__PURE__ */ jsx6("div", { style: inputWrapStyle(bStyles.addressLine2Input), children: /* @__PURE__ */ jsx6(
1925
+ isAVSFieldVisible(avsConfig.address_line_2, cc) && /* @__PURE__ */ jsx5("div", { style: inputWrapStyle(bStyles.addressLine2Input), children: /* @__PURE__ */ jsx5(
2025
1926
  "input",
2026
1927
  {
2027
1928
  className: "flopay-shared-input",
@@ -2037,12 +1938,12 @@ function SplitCardFormInner({
2037
1938
  style: inputFieldStyle()
2038
1939
  }
2039
1940
  ) }),
2040
- (isAVSFieldVisible(avsConfig.city, cc) || isAVSFieldVisible(avsConfig.state, cc)) && /* @__PURE__ */ jsxs4("div", { style: {
1941
+ (isAVSFieldVisible(avsConfig.city, cc) || isAVSFieldVisible(avsConfig.state, cc)) && /* @__PURE__ */ jsxs3("div", { style: {
2041
1942
  display: "flex",
2042
1943
  gap: "0",
2043
1944
  marginTop: "0.5rem"
2044
1945
  }, children: [
2045
- isAVSFieldVisible(avsConfig.city, cc) && /* @__PURE__ */ jsx6("div", { style: {
1946
+ isAVSFieldVisible(avsConfig.city, cc) && /* @__PURE__ */ jsx5("div", { style: {
2046
1947
  flex: 1,
2047
1948
  backgroundColor: cardInputBg,
2048
1949
  border: `1px solid ${resolvedBorder}`,
@@ -2051,7 +1952,7 @@ function SplitCardFormInner({
2051
1952
  borderBottomLeftRadius: "8px",
2052
1953
  ...isAVSFieldVisible(avsConfig.state, cc) ? { borderRight: "none", borderTopRightRadius: 0, borderBottomRightRadius: 0 } : { borderRadius: "8px" },
2053
1954
  ...isButtons && bStyles.cityInput ? bStyles.cityInput : {}
2054
- }, children: /* @__PURE__ */ jsx6(
1955
+ }, children: /* @__PURE__ */ jsx5(
2055
1956
  "input",
2056
1957
  {
2057
1958
  className: "flopay-shared-input",
@@ -2068,7 +1969,7 @@ function SplitCardFormInner({
2068
1969
  style: inputFieldStyle()
2069
1970
  }
2070
1971
  ) }),
2071
- isAVSFieldVisible(avsConfig.state, cc) && /* @__PURE__ */ jsx6("div", { style: {
1972
+ isAVSFieldVisible(avsConfig.state, cc) && /* @__PURE__ */ jsx5("div", { style: {
2072
1973
  flex: 1,
2073
1974
  backgroundColor: cardInputBg,
2074
1975
  border: `1px solid ${resolvedBorder}`,
@@ -2077,7 +1978,7 @@ function SplitCardFormInner({
2077
1978
  borderBottomRightRadius: "8px",
2078
1979
  ...isAVSFieldVisible(avsConfig.city, cc) ? { borderTopLeftRadius: 0, borderBottomLeftRadius: 0 } : { borderRadius: "8px" },
2079
1980
  ...isButtons && bStyles.stateInput ? bStyles.stateInput : {}
2080
- }, children: stateOpts ? /* @__PURE__ */ jsxs4(
1981
+ }, children: stateOpts ? /* @__PURE__ */ jsxs3(
2081
1982
  "select",
2082
1983
  {
2083
1984
  value: stateValue,
@@ -2091,11 +1992,11 @@ function SplitCardFormInner({
2091
1992
  "data-testid": "flopay-state",
2092
1993
  style: { ...inputFieldStyle(), cursor: "pointer" },
2093
1994
  children: [
2094
- /* @__PURE__ */ jsx6("option", { value: "", children: getStateLabel(cc) }),
2095
- stateOpts.map((s) => /* @__PURE__ */ jsx6("option", { value: s.code, children: s.name }, s.code))
1995
+ /* @__PURE__ */ jsx5("option", { value: "", children: getStateLabel(cc) }),
1996
+ stateOpts.map((s) => /* @__PURE__ */ jsx5("option", { value: s.code, children: s.name }, s.code))
2096
1997
  ]
2097
1998
  }
2098
- ) : /* @__PURE__ */ jsx6(
1999
+ ) : /* @__PURE__ */ jsx5(
2099
2000
  "input",
2100
2001
  {
2101
2002
  className: "flopay-shared-input",
@@ -2113,20 +2014,20 @@ function SplitCardFormInner({
2113
2014
  }
2114
2015
  ) })
2115
2016
  ] }),
2116
- (isAVSFieldVisible(avsConfig.country, cc) || isAVSFieldVisible(avsConfig.postal_code, cc)) && /* @__PURE__ */ jsxs4("div", { style: {
2017
+ (isAVSFieldVisible(avsConfig.country, cc) || isAVSFieldVisible(avsConfig.postal_code, cc)) && /* @__PURE__ */ jsxs3("div", { style: {
2117
2018
  display: "flex",
2118
2019
  flexDirection: avsLayoutProp === "column" ? "column" : "row",
2119
2020
  gap: avsLayoutProp === "column" ? "0.5rem" : "0",
2120
2021
  marginTop: "0.5rem"
2121
2022
  }, children: [
2122
- isAVSFieldVisible(avsConfig.country, cc) && /* @__PURE__ */ jsx6("div", { style: {
2023
+ isAVSFieldVisible(avsConfig.country, cc) && /* @__PURE__ */ jsx5("div", { style: {
2123
2024
  flex: avsLayoutProp === "row" ? 1 : void 0,
2124
2025
  backgroundColor: cardInputBg,
2125
2026
  border: `1px solid ${resolvedBorder}`,
2126
2027
  padding: "10px",
2127
2028
  ...avsLayoutProp === "row" && isAVSFieldVisible(avsConfig.postal_code, cc) ? { borderRadius: "0", borderTopLeftRadius: "8px", borderBottomLeftRadius: "8px", borderRight: "none" } : { borderRadius: "8px" },
2128
2029
  ...isButtons && bStyles.countrySelect ? bStyles.countrySelect : {}
2129
- }, children: /* @__PURE__ */ jsx6(
2030
+ }, children: /* @__PURE__ */ jsx5(
2130
2031
  "select",
2131
2032
  {
2132
2033
  value: selectedCountry,
@@ -2141,21 +2042,21 @@ function SplitCardFormInner({
2141
2042
  autoComplete: "country",
2142
2043
  "data-testid": "flopay-country",
2143
2044
  style: { ...inputFieldStyle(), cursor: "pointer" },
2144
- children: COUNTRY_OPTIONS.map((c) => /* @__PURE__ */ jsxs4("option", { value: c.code, children: [
2045
+ children: COUNTRY_OPTIONS.map((c) => /* @__PURE__ */ jsxs3("option", { value: c.code, children: [
2145
2046
  c.flag,
2146
2047
  " ",
2147
2048
  c.name
2148
2049
  ] }, c.code))
2149
2050
  }
2150
2051
  ) }),
2151
- isAVSFieldVisible(avsConfig.postal_code, cc) && /* @__PURE__ */ jsx6("div", { style: {
2052
+ isAVSFieldVisible(avsConfig.postal_code, cc) && /* @__PURE__ */ jsx5("div", { style: {
2152
2053
  flex: avsLayoutProp === "row" ? 1 : void 0,
2153
2054
  backgroundColor: cardInputBg,
2154
2055
  border: `1px solid ${resolvedBorder}`,
2155
2056
  padding: "10px",
2156
2057
  ...avsLayoutProp === "row" && isAVSFieldVisible(avsConfig.country, cc) ? { borderRadius: "0", borderTopRightRadius: "8px", borderBottomRightRadius: "8px" } : { borderRadius: "8px" },
2157
2058
  ...isButtons && bStyles.zipInput ? bStyles.zipInput : {}
2158
- }, children: /* @__PURE__ */ jsx6(
2059
+ }, children: /* @__PURE__ */ jsx5(
2159
2060
  "input",
2160
2061
  {
2161
2062
  className: "flopay-shared-input",
@@ -2176,7 +2077,7 @@ function SplitCardFormInner({
2176
2077
  ] })
2177
2078
  ] });
2178
2079
  })(),
2179
- displayError && /* @__PURE__ */ jsxs4("div", { role: "alert", "data-testid": "flopay-error", style: {
2080
+ displayError && /* @__PURE__ */ jsxs3("div", { role: "alert", "data-testid": "flopay-error", style: {
2180
2081
  margin: "0.75rem 0",
2181
2082
  padding: "0.625rem 0.875rem",
2182
2083
  background: "#FEF2F2",
@@ -2190,10 +2091,10 @@ function SplitCardFormInner({
2190
2091
  gap: "0.5rem",
2191
2092
  ...isButtons && bStyles.errorBanner ? bStyles.errorBanner : {}
2192
2093
  }, children: [
2193
- /* @__PURE__ */ jsx6("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx6("path", { d: "M12 9v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z", stroke: "#DC2626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
2094
+ /* @__PURE__ */ jsx5("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx5("path", { d: "M12 9v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z", stroke: "#DC2626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
2194
2095
  displayError
2195
2096
  ] }),
2196
- children ?? /* @__PURE__ */ jsx6(
2097
+ children ?? /* @__PURE__ */ jsx5(
2197
2098
  "button",
2198
2099
  {
2199
2100
  type: "submit",
@@ -2216,7 +2117,7 @@ function SplitCardFormInner({
2216
2117
  children: isSubmitting ? "PROCESSING..." : submitLabel
2217
2118
  }
2218
2119
  ),
2219
- !isButtons && showSecurityFooter && /* @__PURE__ */ jsx6("div", { style: {
2120
+ !isButtons && showSecurityFooter && /* @__PURE__ */ jsx5("div", { style: {
2220
2121
  backgroundColor: "#EFF9F0",
2221
2122
  borderRadius: "8px",
2222
2123
  padding: "0.75rem",
@@ -2233,11 +2134,11 @@ function SplitCardFormInner({
2233
2134
  const cardButtonSizing = cardButtonContent === void 0 ? { boxSizing: "border-box", height: DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT, padding: "0 1rem" } : { padding: "0.9rem 1rem" };
2234
2135
  const buttonsAnim = viewState === "expanding" ? `flopay-buttons-exit ${TRANSITION_MS}ms cubic-bezier(0.4, 0, 0.2, 1) both` : viewState === "collapsing" ? `flopay-buttons-enter ${TRANSITION_MS}ms cubic-bezier(0, 0, 0.2, 1) both` : void 0;
2235
2136
  const cardAnim = viewState === "expanding" ? `flopay-card-enter ${TRANSITION_MS}ms cubic-bezier(0, 0, 0.2, 1) both` : viewState === "collapsing" ? `flopay-card-exit ${TRANSITION_MS}ms cubic-bezier(0.4, 0, 0.2, 1) both` : void 0;
2236
- return /* @__PURE__ */ jsxs4("form", { onSubmit: handleSubmit, className, style: { position: "relative" }, children: [
2237
- /* @__PURE__ */ jsx6(FloPayKeyframes, {}),
2238
- overlayStatus && /* @__PURE__ */ jsx6(ProcessingOverlay, { status: overlayStatus, errorMessage: displayError }),
2239
- /* @__PURE__ */ jsxs4("div", { style: { display: "grid" }, children: [
2240
- /* @__PURE__ */ jsxs4("div", { style: {
2137
+ return /* @__PURE__ */ jsxs3("form", { onSubmit: handleSubmit, className, style: { position: "relative" }, children: [
2138
+ /* @__PURE__ */ jsx5(FloPayKeyframes, {}),
2139
+ overlayStatus && /* @__PURE__ */ jsx5(ProcessingOverlay, { status: overlayStatus, errorMessage: displayError }),
2140
+ /* @__PURE__ */ jsxs3("div", { style: { display: "grid" }, children: [
2141
+ /* @__PURE__ */ jsxs3("div", { style: {
2241
2142
  gridArea: "1 / 1",
2242
2143
  display: "flex",
2243
2144
  flexDirection: "column",
@@ -2246,7 +2147,7 @@ function SplitCardFormInner({
2246
2147
  ...!isButtonsView && !buttonsAnim ? { visibility: "hidden", position: "absolute", pointerEvents: "none", width: "100%" } : {},
2247
2148
  ...buttonsAnim ? { animation: buttonsAnim, pointerEvents: "none" } : {}
2248
2149
  }, children: [
2249
- showPayPal && paypalStripeInstance && /* @__PURE__ */ jsx6(StripeElements, { stripe: paypalStripeInstance, options: paypalOptions, children: /* @__PURE__ */ jsx6(
2150
+ shouldRenderPayPal && /* @__PURE__ */ jsx5(StripeElements, { stripe: paypalStripeInstance, options: paypalOptions, children: /* @__PURE__ */ jsx5(
2250
2151
  PayPalButtonInner,
2251
2152
  {
2252
2153
  sessionId,
@@ -2261,7 +2162,7 @@ function SplitCardFormInner({
2261
2162
  onLoadStateChange: setPaypalLoadState
2262
2163
  }
2263
2164
  ) }),
2264
- showWallets && stripeInstance ? /* @__PURE__ */ jsx6(StripeElements, { stripe: stripeInstance, options: walletOptions, children: /* @__PURE__ */ jsx6(
2165
+ shouldRenderWallets ? /* @__PURE__ */ jsx5(StripeElements, { stripe: stripeInstance, options: walletOptions, children: /* @__PURE__ */ jsx5(
2265
2166
  WalletButtonInner,
2266
2167
  {
2267
2168
  sessionId,
@@ -2276,9 +2177,8 @@ function SplitCardFormInner({
2276
2177
  runBeforeButtonClick,
2277
2178
  onLoadStateChange: setWalletLoadState
2278
2179
  }
2279
- ) }) : showWallets ? /* @__PURE__ */ jsx6("div", { style: { height: DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT, borderRadius: 8, background: "#e5e7eb", animation: "flopay-pulse 1.5s ease-in-out infinite" } }) : null,
2280
- showInAppBrowserNotice && /* @__PURE__ */ jsx6(InAppBrowserNotice, {}),
2281
- /* @__PURE__ */ jsx6(
2180
+ ) }) : shouldShowWallets ? /* @__PURE__ */ jsx5("div", { style: { height: DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT, borderRadius: 8, background: "#e5e7eb", animation: "flopay-pulse 1.5s ease-in-out infinite" } }) : null,
2181
+ /* @__PURE__ */ jsx5(
2282
2182
  "button",
2283
2183
  {
2284
2184
  type: "button",
@@ -2316,10 +2216,10 @@ function SplitCardFormInner({
2316
2216
  onMouseUp: (e) => {
2317
2217
  e.currentTarget.style.transform = "scale(1)";
2318
2218
  },
2319
- children: /* @__PURE__ */ jsx6(CardButtonContentSlot, { content: cardButtonContent })
2219
+ children: /* @__PURE__ */ jsx5(CardButtonContentSlot, { content: cardButtonContent })
2320
2220
  }
2321
2221
  ),
2322
- displayError && viewState === "buttons" && /* @__PURE__ */ jsxs4("div", { role: "alert", "data-testid": "flopay-error", style: {
2222
+ displayError && viewState === "buttons" && /* @__PURE__ */ jsxs3("div", { role: "alert", "data-testid": "flopay-error", style: {
2323
2223
  margin: "0.25rem 0",
2324
2224
  padding: "0.625rem 0.875rem",
2325
2225
  background: "#FEF2F2",
@@ -2333,11 +2233,11 @@ function SplitCardFormInner({
2333
2233
  gap: "0.5rem",
2334
2234
  ...bStyles.errorBanner ? bStyles.errorBanner : {}
2335
2235
  }, children: [
2336
- /* @__PURE__ */ jsx6("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx6("path", { d: "M12 9v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z", stroke: "#DC2626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
2236
+ /* @__PURE__ */ jsx5("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx5("path", { d: "M12 9v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z", stroke: "#DC2626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
2337
2237
  displayError
2338
2238
  ] })
2339
2239
  ] }),
2340
- isCardView && /* @__PURE__ */ jsx6("div", { style: {
2240
+ isCardView && /* @__PURE__ */ jsx5("div", { style: {
2341
2241
  gridArea: "1 / 1",
2342
2242
  ...cardAnim ? { animation: cardAnim } : {},
2343
2243
  ...viewState === "collapsing" ? { pointerEvents: "none" } : {}
@@ -2345,10 +2245,10 @@ function SplitCardFormInner({
2345
2245
  ] })
2346
2246
  ] });
2347
2247
  }
2348
- return /* @__PURE__ */ jsxs4("form", { onSubmit: handleSubmit, className, style: { position: "relative" }, children: [
2349
- /* @__PURE__ */ jsx6(FloPayKeyframes, {}),
2350
- overlayStatus && /* @__PURE__ */ jsx6(ProcessingOverlay, { status: overlayStatus, errorMessage: displayError }),
2351
- showWallets && stripeInstance && /* @__PURE__ */ jsx6(StripeElements, { stripe: stripeInstance, options: walletOptions, children: /* @__PURE__ */ jsx6(
2248
+ return /* @__PURE__ */ jsxs3("form", { onSubmit: handleSubmit, className, style: { position: "relative" }, children: [
2249
+ /* @__PURE__ */ jsx5(FloPayKeyframes, {}),
2250
+ overlayStatus && /* @__PURE__ */ jsx5(ProcessingOverlay, { status: overlayStatus, errorMessage: displayError }),
2251
+ shouldRenderWallets && /* @__PURE__ */ jsx5(StripeElements, { stripe: stripeInstance, options: walletOptions, children: /* @__PURE__ */ jsx5(
2352
2252
  WalletButtonInner,
2353
2253
  {
2354
2254
  sessionId,
@@ -2362,7 +2262,7 @@ function SplitCardFormInner({
2362
2262
  onLoadStateChange: setWalletLoadState
2363
2263
  }
2364
2264
  ) }),
2365
- showPayPal && paypalStripeInstance && /* @__PURE__ */ jsx6(StripeElements, { stripe: paypalStripeInstance, options: paypalOptions, children: /* @__PURE__ */ jsx6(
2265
+ shouldRenderPayPal && /* @__PURE__ */ jsx5(StripeElements, { stripe: paypalStripeInstance, options: paypalOptions, children: /* @__PURE__ */ jsx5(
2366
2266
  PayPalButtonInner,
2367
2267
  {
2368
2268
  sessionId,
@@ -2375,8 +2275,7 @@ function SplitCardFormInner({
2375
2275
  onLoadStateChange: setPaypalLoadState
2376
2276
  }
2377
2277
  ) }),
2378
- showInAppBrowserNotice && /* @__PURE__ */ jsx6(InAppBrowserNotice, {}),
2379
- (showWallets && stripeInstance || showPayPal && paypalStripeInstance) && /* @__PURE__ */ jsxs4("div", { style: {
2278
+ (shouldDisplayWalletRow || shouldDisplayPayPalRow) && /* @__PURE__ */ jsxs3("div", { style: {
2380
2279
  display: "flex",
2381
2280
  alignItems: "center",
2382
2281
  gap: "0.75rem",
@@ -2384,9 +2283,9 @@ function SplitCardFormInner({
2384
2283
  color: "#999",
2385
2284
  fontSize: "0.85rem"
2386
2285
  }, children: [
2387
- /* @__PURE__ */ jsx6("div", { style: { flex: 1, height: 1, backgroundColor: "#ddd" } }),
2388
- /* @__PURE__ */ jsx6("span", { children: "or pay with card" }),
2389
- /* @__PURE__ */ jsx6("div", { style: { flex: 1, height: 1, backgroundColor: "#ddd" } })
2286
+ /* @__PURE__ */ jsx5("div", { style: { flex: 1, height: 1, backgroundColor: "#ddd" } }),
2287
+ /* @__PURE__ */ jsx5("span", { children: "or pay with card" }),
2288
+ /* @__PURE__ */ jsx5("div", { style: { flex: 1, height: 1, backgroundColor: "#ddd" } })
2390
2289
  ] }),
2391
2290
  cardFormBlock
2392
2291
  ] });
@@ -2919,7 +2818,7 @@ async function loadSavedPaymentProviders({
2919
2818
  }
2920
2819
 
2921
2820
  // src/flopay-checkout.tsx
2922
- import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
2821
+ import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
2923
2822
  var DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT2 = 44;
2924
2823
  var PAYPAL_RESUME_STORAGE_KEY = "flopay_checkout_saved_payment_resume";
2925
2824
  var sessionInflightMap = /* @__PURE__ */ new Map();
@@ -3022,25 +2921,25 @@ function FloPayCheckout({
3022
2921
  const resolvedBillingUrl = resolveBillingApiUrl3(billingApiUrl);
3023
2922
  const checkoutType = createSessionParams ? "embedded_checkout" : "standard_checkout";
3024
2923
  const checkoutLayout = children ? "custom_layout" : layout === "buttons" ? "buttons_layout" : "default_layout";
3025
- const [unified, setUnified] = useState4(null);
3026
- const [flopay, setFloPay] = useState4(null);
2924
+ const [unified, setUnified] = useState3(null);
2925
+ const [flopay, setFloPay] = useState3(null);
3027
2926
  const flopayRef = useRef3(null);
3028
- const [paypalFlopay, setPaypalFloPay] = useState4(null);
2927
+ const [paypalFlopay, setPaypalFloPay] = useState3(null);
3029
2928
  const paypalFlopayRef = useRef3(null);
3030
- const [session, setSession] = useState4(null);
3031
- const [resolvedSessionId, setResolvedSessionId] = useState4(sessionIdProp ?? "");
2929
+ const [session, setSession] = useState3(null);
2930
+ const [resolvedSessionId, setResolvedSessionId] = useState3(sessionIdProp ?? "");
3032
2931
  const activeSessionId = sessionIdProp ?? resolvedSessionId;
3033
2932
  const initSessionDependency = createSessionParams ? "" : activeSessionId;
3034
- const [isLoading, setIsLoading] = useState4(true);
3035
- const [loadError, setLoadError] = useState4(null);
3036
- const [currentMode, setCurrentMode] = useState4("full");
3037
- const [confirmProcessing, setConfirmProcessing] = useState4(false);
3038
- const [modeError, setModeError] = useState4(initialErrorMessage);
3039
- const [modeOverlayStatus, setModeOverlayStatus] = useState4(null);
3040
- const [modeOverlayError, setModeOverlayError] = useState4(null);
3041
- const [createSessionPatch, setCreateSessionPatch] = useState4(void 0);
3042
- const [createSessionPatchBaseHash, setCreateSessionPatchBaseHash] = useState4("");
3043
- const [cardBootstrapPending, setCardBootstrapPending] = useState4(false);
2933
+ const [isLoading, setIsLoading] = useState3(true);
2934
+ const [loadError, setLoadError] = useState3(null);
2935
+ const [currentMode, setCurrentMode] = useState3("full");
2936
+ const [confirmProcessing, setConfirmProcessing] = useState3(false);
2937
+ const [modeError, setModeError] = useState3(initialErrorMessage);
2938
+ const [modeOverlayStatus, setModeOverlayStatus] = useState3(null);
2939
+ const [modeOverlayError, setModeOverlayError] = useState3(null);
2940
+ const [createSessionPatch, setCreateSessionPatch] = useState3(void 0);
2941
+ const [createSessionPatchBaseHash, setCreateSessionPatchBaseHash] = useState3("");
2942
+ const [cardBootstrapPending, setCardBootstrapPending] = useState3(false);
3044
2943
  const autoCheckoutAttempted = useRef3(false);
3045
2944
  const paypalResumeAttempted = useRef3(false);
3046
2945
  const savedPaymentKeysRef = useRef3(null);
@@ -3052,7 +2951,7 @@ function FloPayCheckout({
3052
2951
  onDeclineRef.current = onDecline;
3053
2952
  const onSessionCompletedRef = useRef3(onSessionCompleted);
3054
2953
  onSessionCompletedRef.current = onSessionCompleted;
3055
- useEffect5(() => {
2954
+ useEffect4(() => {
3056
2955
  console.info("[FloPay] Checkout initialized", {
3057
2956
  sdk_version: SDK_VERSION,
3058
2957
  checkout_type: checkoutType,
@@ -3080,20 +2979,20 @@ function FloPayCheckout({
3080
2979
  } : void 0,
3081
2980
  [effectiveCreateSessionBase, effectiveCreateSessionMode]
3082
2981
  );
3083
- useEffect5(() => {
2982
+ useEffect4(() => {
3084
2983
  setCreateSessionPatch(void 0);
3085
2984
  setCreateSessionPatchBaseHash(baseCreateSessionHash);
3086
2985
  }, [baseCreateSessionHash]);
3087
- useEffect5(() => {
2986
+ useEffect4(() => {
3088
2987
  setModeError(initialErrorMessage);
3089
2988
  }, [initialErrorMessage]);
3090
- const emitDecline = useCallback3(
2989
+ const emitDecline = useCallback2(
3091
2990
  (method, input, overrides) => {
3092
2991
  onDeclineRef.current?.(buildDeclineEvent(method, input, overrides));
3093
2992
  },
3094
2993
  []
3095
2994
  );
3096
- const runSavedPaymentFlow = useCallback3(
2995
+ const runSavedPaymentFlow = useCallback2(
3097
2996
  async (sess, options) => {
3098
2997
  setModeError(null);
3099
2998
  setModeOverlayError(null);
@@ -3211,7 +3110,7 @@ function FloPayCheckout({
3211
3110
  resolvedBillingUrl
3212
3111
  ]
3213
3112
  );
3214
- useEffect5(() => {
3113
+ useEffect4(() => {
3215
3114
  if (typeof window === "undefined" || paypalResumeAttempted.current) {
3216
3115
  return;
3217
3116
  }
@@ -3358,10 +3257,10 @@ function FloPayCheckout({
3358
3257
  );
3359
3258
  const createSessionParamsRef = useRef3(effectiveCreateSession);
3360
3259
  createSessionParamsRef.current = effectiveCreateSession;
3361
- useEffect5(() => {
3260
+ useEffect4(() => {
3362
3261
  setResolvedSessionId(sessionIdProp ?? "");
3363
3262
  }, [sessionIdProp]);
3364
- useEffect5(() => {
3263
+ useEffect4(() => {
3365
3264
  autoCheckoutAttempted.current = false;
3366
3265
  setModeError(initialErrorMessage);
3367
3266
  setModeOverlayError(null);
@@ -3404,7 +3303,7 @@ function FloPayCheckout({
3404
3303
  }
3405
3304
  return { sid: sid ?? "", result: realResult };
3406
3305
  }
3407
- const bootstrapInlineSession = useCallback3(
3306
+ const bootstrapInlineSession = useCallback2(
3408
3307
  async (patch) => {
3409
3308
  const baseParams = createSessionParamsRef.current;
3410
3309
  if (!baseParams) {
@@ -3465,7 +3364,7 @@ function FloPayCheckout({
3465
3364
  },
3466
3365
  [locale, resolvedBillingUrl]
3467
3366
  );
3468
- const handleInlineSessionPatch = useCallback3(async (patch) => {
3367
+ const handleInlineSessionPatch = useCallback2(async (patch) => {
3469
3368
  if (!hasInlineSessionPatchData(patch) || cardBootstrapPending) {
3470
3369
  return {
3471
3370
  sessionId: resolvedSessionId,
@@ -3488,7 +3387,7 @@ function FloPayCheckout({
3488
3387
  resolvedSessionId,
3489
3388
  session
3490
3389
  ]);
3491
- useEffect5(() => {
3390
+ useEffect4(() => {
3492
3391
  let cancelled = false;
3493
3392
  setLoadError(null);
3494
3393
  if (createSessionHash) {
@@ -3648,7 +3547,7 @@ function FloPayCheckout({
3648
3547
  initSessionDependency,
3649
3548
  runSavedPaymentFlow
3650
3549
  ]);
3651
- const handleConfirmCheckout = useCallback3(async () => {
3550
+ const handleConfirmCheckout = useCallback2(async () => {
3652
3551
  if (confirmProcessing || !session) return;
3653
3552
  setConfirmProcessing(true);
3654
3553
  setModeError(null);
@@ -3702,7 +3601,7 @@ function FloPayCheckout({
3702
3601
  ]
3703
3602
  );
3704
3603
  const shouldShowInterimButtons = Boolean(createSessionParams) && layout === "buttons" && (!flopay || !providerOptions);
3705
- const modeOverlay = modeOverlayStatus ? /* @__PURE__ */ jsx7(
3604
+ const modeOverlay = modeOverlayStatus ? /* @__PURE__ */ jsx6(
3706
3605
  ProcessingOverlay,
3707
3606
  {
3708
3607
  status: modeOverlayStatus,
@@ -3711,31 +3610,31 @@ function FloPayCheckout({
3711
3610
  ) : null;
3712
3611
  if (isLoading) {
3713
3612
  if (loadingNode) {
3714
- return /* @__PURE__ */ jsxs5(Fragment3, { children: [
3613
+ return /* @__PURE__ */ jsxs4(Fragment3, { children: [
3715
3614
  loadingNode,
3716
3615
  modeOverlay
3717
3616
  ] });
3718
3617
  }
3719
3618
  if (layout === "buttons") {
3720
- const skeletonBar = (h) => /* @__PURE__ */ jsx7("div", { style: {
3619
+ const skeletonBar = (h) => /* @__PURE__ */ jsx6("div", { style: {
3721
3620
  height: h,
3722
3621
  borderRadius: 8,
3723
3622
  background: "#e5e7eb",
3724
3623
  animation: "flopay-loading-pulse 1.5s ease-in-out infinite"
3725
3624
  } });
3726
- return /* @__PURE__ */ jsxs5(Fragment3, { children: [
3727
- /* @__PURE__ */ jsxs5("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
3625
+ return /* @__PURE__ */ jsxs4(Fragment3, { children: [
3626
+ /* @__PURE__ */ jsxs4("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
3728
3627
  showPayPal && skeletonBar(DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT2),
3729
3628
  (showApplePay || showGooglePay) && skeletonBar(DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT2),
3730
3629
  skeletonBar(DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT2),
3731
- /* @__PURE__ */ jsx7("style", { children: `@keyframes flopay-loading-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }` })
3630
+ /* @__PURE__ */ jsx6("style", { children: `@keyframes flopay-loading-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }` })
3732
3631
  ] }),
3733
3632
  modeOverlay
3734
3633
  ] });
3735
3634
  }
3736
- return /* @__PURE__ */ jsxs5(Fragment3, { children: [
3737
- /* @__PURE__ */ jsxs5("div", { style: { display: "flex", justifyContent: "center", padding: 32 }, children: [
3738
- /* @__PURE__ */ jsx7("div", { style: {
3635
+ return /* @__PURE__ */ jsxs4(Fragment3, { children: [
3636
+ /* @__PURE__ */ jsxs4("div", { style: { display: "flex", justifyContent: "center", padding: 32 }, children: [
3637
+ /* @__PURE__ */ jsx6("div", { style: {
3739
3638
  width: 24,
3740
3639
  height: 24,
3741
3640
  border: "2px solid #e5e7eb",
@@ -3743,16 +3642,16 @@ function FloPayCheckout({
3743
3642
  borderRadius: "50%",
3744
3643
  animation: "spin 0.6s linear infinite"
3745
3644
  } }),
3746
- /* @__PURE__ */ jsx7("style", { children: `@keyframes spin { to { transform: rotate(360deg); } }` })
3645
+ /* @__PURE__ */ jsx6("style", { children: `@keyframes spin { to { transform: rotate(360deg); } }` })
3747
3646
  ] }),
3748
3647
  modeOverlay
3749
3648
  ] });
3750
3649
  }
3751
3650
  if (loadError) {
3752
3651
  if (errorNode) {
3753
- return /* @__PURE__ */ jsx7(CheckoutContext.Provider, { value: checkoutValue, children: errorNode(loadError) });
3652
+ return /* @__PURE__ */ jsx6(CheckoutContext.Provider, { value: checkoutValue, children: errorNode(loadError) });
3754
3653
  }
3755
- return /* @__PURE__ */ jsx7(CheckoutContext.Provider, { value: checkoutValue, children: /* @__PURE__ */ jsx7(
3654
+ return /* @__PURE__ */ jsx6(CheckoutContext.Provider, { value: checkoutValue, children: /* @__PURE__ */ jsx6(
3756
3655
  "div",
3757
3656
  {
3758
3657
  style: {
@@ -3766,8 +3665,8 @@ function FloPayCheckout({
3766
3665
  ) });
3767
3666
  }
3768
3667
  if (shouldShowInterimButtons) {
3769
- return /* @__PURE__ */ jsxs5(Fragment3, { children: [
3770
- /* @__PURE__ */ jsx7(CheckoutContext.Provider, { value: checkoutValue, children: /* @__PURE__ */ jsx7(
3668
+ return /* @__PURE__ */ jsxs4(Fragment3, { children: [
3669
+ /* @__PURE__ */ jsx6(CheckoutContext.Provider, { value: checkoutValue, children: /* @__PURE__ */ jsx6(
3771
3670
  InterimButtonsView,
3772
3671
  {
3773
3672
  onButtonClick,
@@ -3785,12 +3684,12 @@ function FloPayCheckout({
3785
3684
  ] });
3786
3685
  }
3787
3686
  if (!flopay || !providerOptions) {
3788
- return /* @__PURE__ */ jsx7(Fragment3, { children: modeOverlay });
3687
+ return /* @__PURE__ */ jsx6(Fragment3, { children: modeOverlay });
3789
3688
  }
3790
3689
  if (currentMode === "confirm") {
3791
- return /* @__PURE__ */ jsxs5(Fragment3, { children: [
3792
- /* @__PURE__ */ jsx7(CheckoutContext.Provider, { value: checkoutValue, children: /* @__PURE__ */ jsx7(FloPayProvider, { flopay, paypalFlopay, options: providerOptions, children: /* @__PURE__ */ jsxs5("div", { className, children: [
3793
- modeError && /* @__PURE__ */ jsx7(
3690
+ return /* @__PURE__ */ jsxs4(Fragment3, { children: [
3691
+ /* @__PURE__ */ jsx6(CheckoutContext.Provider, { value: checkoutValue, children: /* @__PURE__ */ jsx6(FloPayProvider, { flopay, paypalFlopay, options: providerOptions, children: /* @__PURE__ */ jsxs4("div", { className, children: [
3692
+ modeError && /* @__PURE__ */ jsx6(
3794
3693
  "div",
3795
3694
  {
3796
3695
  style: {
@@ -3805,7 +3704,7 @@ function FloPayCheckout({
3805
3704
  renderConfirmButton ? renderConfirmButton({
3806
3705
  onConfirm: handleConfirmCheckout,
3807
3706
  isProcessing: confirmProcessing
3808
- }) : /* @__PURE__ */ jsx7(
3707
+ }) : /* @__PURE__ */ jsx6(
3809
3708
  "button",
3810
3709
  {
3811
3710
  type: "button",
@@ -3830,9 +3729,9 @@ function FloPayCheckout({
3830
3729
  modeOverlay
3831
3730
  ] });
3832
3731
  }
3833
- return /* @__PURE__ */ jsxs5(Fragment3, { children: [
3834
- /* @__PURE__ */ jsx7(CheckoutContext.Provider, { value: checkoutValue, children: /* @__PURE__ */ jsx7(FloPayProvider, { flopay, paypalFlopay, options: providerOptions, children: children ? /* @__PURE__ */ jsxs5(Fragment3, { children: [
3835
- modeError && /* @__PURE__ */ jsx7(
3732
+ return /* @__PURE__ */ jsxs4(Fragment3, { children: [
3733
+ /* @__PURE__ */ jsx6(CheckoutContext.Provider, { value: checkoutValue, children: /* @__PURE__ */ jsx6(FloPayProvider, { flopay, paypalFlopay, options: providerOptions, children: children ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
3734
+ modeError && /* @__PURE__ */ jsx6(
3836
3735
  "div",
3837
3736
  {
3838
3737
  style: {
@@ -3847,7 +3746,7 @@ function FloPayCheckout({
3847
3746
  children: modeError
3848
3747
  }
3849
3748
  ),
3850
- /* @__PURE__ */ jsx7(
3749
+ /* @__PURE__ */ jsx6(
3851
3750
  SessionInjector,
3852
3751
  {
3853
3752
  sessionId: activeSessionId,
@@ -3856,7 +3755,7 @@ function FloPayCheckout({
3856
3755
  children
3857
3756
  }
3858
3757
  )
3859
- ] }) : /* @__PURE__ */ jsx7(
3758
+ ] }) : /* @__PURE__ */ jsx6(
3860
3759
  SplitCardForm,
3861
3760
  {
3862
3761
  sessionId: activeSessionId,
@@ -3907,8 +3806,8 @@ function SessionInjector({
3907
3806
  session,
3908
3807
  children
3909
3808
  }) {
3910
- return /* @__PURE__ */ jsx7(Fragment3, { children: React7.Children.map(children, (child) => {
3911
- if (!React7.isValidElement(child)) return child;
3809
+ return /* @__PURE__ */ jsx6(Fragment3, { children: React6.Children.map(children, (child) => {
3810
+ if (!React6.isValidElement(child)) return child;
3912
3811
  const existing = child.props;
3913
3812
  const injected = {};
3914
3813
  if (!existing.sessionId) injected.sessionId = sessionId;
@@ -3922,7 +3821,7 @@ function SessionInjector({
3922
3821
  injected.lastName = session.customer.lastName;
3923
3822
  }
3924
3823
  if (Object.keys(injected).length === 0) return child;
3925
- return React7.cloneElement(child, injected);
3824
+ return React6.cloneElement(child, injected);
3926
3825
  }) });
3927
3826
  }
3928
3827
  function InterimButtonsView({
@@ -3940,9 +3839,9 @@ function InterimButtonsView({
3940
3839
  cardBackButtonContent,
3941
3840
  cardTitleContent
3942
3841
  }) {
3943
- const [showCardForm, setShowCardForm] = useState4(false);
3842
+ const [showCardForm, setShowCardForm] = useState3(false);
3944
3843
  const isCardOpenControlled = typeof cardOpen === "boolean";
3945
- useEffect5(() => {
3844
+ useEffect4(() => {
3946
3845
  if (isCardOpenControlled) {
3947
3846
  setShowCardForm(cardOpen);
3948
3847
  }
@@ -3961,7 +3860,7 @@ function InterimButtonsView({
3961
3860
  title: { ...base.title, ...stylesOverride.title }
3962
3861
  };
3963
3862
  }, [buttonsTheme, stylesOverride]);
3964
- const skeleton = (h) => /* @__PURE__ */ jsx7("div", { style: {
3863
+ const skeleton = (h) => /* @__PURE__ */ jsx6("div", { style: {
3965
3864
  height: h,
3966
3865
  borderRadius: 8,
3967
3866
  background: "#e5e7eb",
@@ -3973,15 +3872,15 @@ function InterimButtonsView({
3973
3872
  const inputBg = bStyles.cardInputBackground ?? "white";
3974
3873
  const hideBackButtonLabel = isEmptySlotContent(cardBackButtonContent);
3975
3874
  const hideTitle = isEmptySlotContent(cardTitleContent);
3976
- return /* @__PURE__ */ jsxs5("div", { style: {
3875
+ return /* @__PURE__ */ jsxs4("div", { style: {
3977
3876
  backgroundColor: bStyles.cardFormContainer?.backgroundColor ?? "white",
3978
3877
  borderRadius: "8px",
3979
3878
  animation: "flopay-interim-expand 0.35s cubic-bezier(0.4, 0, 0.2, 1) both",
3980
3879
  overflow: "hidden",
3981
3880
  ...bStyles.cardFormContainer
3982
3881
  }, children: [
3983
- /* @__PURE__ */ jsxs5("div", { style: { display: "flex", alignItems: "center", padding: "0.75rem 0 0.625rem" }, children: [
3984
- /* @__PURE__ */ jsxs5(
3882
+ /* @__PURE__ */ jsxs4("div", { style: { display: "flex", alignItems: "center", padding: "0.75rem 0 0.625rem" }, children: [
3883
+ /* @__PURE__ */ jsxs4(
3985
3884
  "button",
3986
3885
  {
3987
3886
  type: "button",
@@ -4008,7 +3907,7 @@ function InterimButtonsView({
4008
3907
  ...bStyles.backButton
4009
3908
  },
4010
3909
  children: [
4011
- /* @__PURE__ */ jsx7("span", { style: {
3910
+ /* @__PURE__ */ jsx6("span", { style: {
4012
3911
  display: "inline-flex",
4013
3912
  alignItems: "center",
4014
3913
  justifyContent: "center",
@@ -4017,12 +3916,12 @@ function InterimButtonsView({
4017
3916
  borderRadius: "50%",
4018
3917
  backgroundColor: "#f3f4f6",
4019
3918
  ...bStyles.backButtonIcon
4020
- }, children: /* @__PURE__ */ jsx7("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx7("path", { d: "M15 18l-6-6 6-6" }) }) }),
4021
- /* @__PURE__ */ jsx7(BackButtonContentSlot, { content: cardBackButtonContent })
3919
+ }, children: /* @__PURE__ */ jsx6("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx6("path", { d: "M15 18l-6-6 6-6" }) }) }),
3920
+ /* @__PURE__ */ jsx6(BackButtonContentSlot, { content: cardBackButtonContent })
4022
3921
  ]
4023
3922
  }
4024
3923
  ),
4025
- hideTitle ? /* @__PURE__ */ jsx7("div", { style: { flex: 1 } }) : /* @__PURE__ */ jsx7("div", { style: {
3924
+ hideTitle ? /* @__PURE__ */ jsx6("div", { style: { flex: 1 } }) : /* @__PURE__ */ jsx6("div", { style: {
4026
3925
  flex: 1,
4027
3926
  textAlign: "center",
4028
3927
  fontWeight: 600,
@@ -4030,15 +3929,15 @@ function InterimButtonsView({
4030
3929
  color: "#262833",
4031
3930
  paddingRight: 80,
4032
3931
  ...bStyles.title
4033
- }, children: /* @__PURE__ */ jsx7(TitleContentSlot, { content: cardTitleContent }) })
3932
+ }, children: /* @__PURE__ */ jsx6(TitleContentSlot, { content: cardTitleContent }) })
4034
3933
  ] }),
4035
- /* @__PURE__ */ jsx7("div", { style: { backgroundColor: inputBg, border: `1px solid ${inputBorder}`, borderTopLeftRadius: 8, borderTopRightRadius: 8, padding: 12, height: 45 }, children: /* @__PURE__ */ jsx7("div", { style: { width: "60%", height: 14, borderRadius: 4, background: "#e5e7eb", animation: "flopay-interim-pulse 1.5s ease-in-out infinite" } }) }),
4036
- /* @__PURE__ */ jsxs5("div", { style: { display: "flex" }, children: [
4037
- /* @__PURE__ */ jsx7("div", { style: { flex: 1, backgroundColor: inputBg, border: `1px solid ${inputBorder}`, borderTop: "none", borderRight: "none", borderBottomLeftRadius: 8, padding: 12, height: 45 }, children: /* @__PURE__ */ jsx7("div", { style: { width: "50%", height: 14, borderRadius: 4, background: "#e5e7eb", animation: "flopay-interim-pulse 1.5s ease-in-out infinite" } }) }),
4038
- /* @__PURE__ */ jsx7("div", { style: { flex: 1, backgroundColor: inputBg, border: `1px solid ${inputBorder}`, borderTop: "none", borderBottomRightRadius: 8, padding: 12, height: 45 }, children: /* @__PURE__ */ jsx7("div", { style: { width: "40%", height: 14, borderRadius: 4, background: "#e5e7eb", animation: "flopay-interim-pulse 1.5s ease-in-out infinite" } }) })
3934
+ /* @__PURE__ */ jsx6("div", { style: { backgroundColor: inputBg, border: `1px solid ${inputBorder}`, borderTopLeftRadius: 8, borderTopRightRadius: 8, padding: 12, height: 45 }, children: /* @__PURE__ */ jsx6("div", { style: { width: "60%", height: 14, borderRadius: 4, background: "#e5e7eb", animation: "flopay-interim-pulse 1.5s ease-in-out infinite" } }) }),
3935
+ /* @__PURE__ */ jsxs4("div", { style: { display: "flex" }, children: [
3936
+ /* @__PURE__ */ jsx6("div", { style: { flex: 1, backgroundColor: inputBg, border: `1px solid ${inputBorder}`, borderTop: "none", borderRight: "none", borderBottomLeftRadius: 8, padding: 12, height: 45 }, children: /* @__PURE__ */ jsx6("div", { style: { width: "50%", height: 14, borderRadius: 4, background: "#e5e7eb", animation: "flopay-interim-pulse 1.5s ease-in-out infinite" } }) }),
3937
+ /* @__PURE__ */ jsx6("div", { style: { flex: 1, backgroundColor: inputBg, border: `1px solid ${inputBorder}`, borderTop: "none", borderBottomRightRadius: 8, padding: 12, height: 45 }, children: /* @__PURE__ */ jsx6("div", { style: { width: "40%", height: 14, borderRadius: 4, background: "#e5e7eb", animation: "flopay-interim-pulse 1.5s ease-in-out infinite" } }) })
4039
3938
  ] }),
4040
- /* @__PURE__ */ jsx7("div", { style: { backgroundColor: inputBg, border: `1px solid ${inputBorder}`, borderRadius: 8, marginTop: 8, padding: 12, height: 45 }, children: /* @__PURE__ */ jsx7("div", { style: { width: "45%", height: 14, borderRadius: 4, background: "#e5e7eb", animation: "flopay-interim-pulse 1.5s ease-in-out infinite" } }) }),
4041
- /* @__PURE__ */ jsx7("div", { style: {
3939
+ /* @__PURE__ */ jsx6("div", { style: { backgroundColor: inputBg, border: `1px solid ${inputBorder}`, borderRadius: 8, marginTop: 8, padding: 12, height: 45 }, children: /* @__PURE__ */ jsx6("div", { style: { width: "45%", height: 14, borderRadius: 4, background: "#e5e7eb", animation: "flopay-interim-pulse 1.5s ease-in-out infinite" } }) }),
3940
+ /* @__PURE__ */ jsx6("div", { style: {
4042
3941
  height: 50,
4043
3942
  borderRadius: 8,
4044
3943
  marginTop: 16,
@@ -4047,7 +3946,7 @@ function InterimButtonsView({
4047
3946
  ...bStyles.submitButton,
4048
3947
  opacity: 0.5
4049
3948
  } }),
4050
- /* @__PURE__ */ jsx7("style", { children: `
3949
+ /* @__PURE__ */ jsx6("style", { children: `
4051
3950
  @keyframes flopay-interim-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
4052
3951
  @keyframes flopay-interim-expand {
4053
3952
  0% { opacity: 0; max-height: 0; transform: translateY(-12px); }
@@ -4057,10 +3956,10 @@ function InterimButtonsView({
4057
3956
  ` })
4058
3957
  ] });
4059
3958
  }
4060
- return /* @__PURE__ */ jsxs5("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
3959
+ return /* @__PURE__ */ jsxs4("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
4061
3960
  showPayPal && skeleton(DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT2),
4062
3961
  (showApplePay || showGooglePay) && skeleton(DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT2),
4063
- /* @__PURE__ */ jsx7(
3962
+ /* @__PURE__ */ jsx6(
4064
3963
  "button",
4065
3964
  {
4066
3965
  type: "button",
@@ -4100,10 +3999,10 @@ function InterimButtonsView({
4100
3999
  onMouseUp: (e) => {
4101
4000
  e.currentTarget.style.transform = "scale(1)";
4102
4001
  },
4103
- children: /* @__PURE__ */ jsx7(CardButtonContentSlot, { content: cardButtonContent })
4002
+ children: /* @__PURE__ */ jsx6(CardButtonContentSlot, { content: cardButtonContent })
4104
4003
  }
4105
4004
  ),
4106
- errorMessage && /* @__PURE__ */ jsxs5("div", { style: {
4005
+ errorMessage && /* @__PURE__ */ jsxs4("div", { style: {
4107
4006
  margin: "0.25rem 0",
4108
4007
  padding: "0.625rem 0.875rem",
4109
4008
  background: "#FEF2F2",
@@ -4117,22 +4016,22 @@ function InterimButtonsView({
4117
4016
  gap: "0.5rem",
4118
4017
  ...bStyles.errorBanner
4119
4018
  }, children: [
4120
- /* @__PURE__ */ jsx7("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx7("path", { d: "M12 9v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z", stroke: "#DC2626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
4019
+ /* @__PURE__ */ jsx6("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { flexShrink: 0 }, children: /* @__PURE__ */ jsx6("path", { d: "M12 9v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z", stroke: "#DC2626", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
4121
4020
  errorMessage
4122
4021
  ] }),
4123
- /* @__PURE__ */ jsx7("style", { children: `@keyframes flopay-interim-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }` })
4022
+ /* @__PURE__ */ jsx6("style", { children: `@keyframes flopay-interim-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }` })
4124
4023
  ] });
4125
4024
  }
4126
4025
 
4127
4026
  // src/checkout-form.tsx
4128
4027
  import { PaymentAPI as PaymentAPI4 } from "@flopay/js";
4129
4028
  import { FloPayError as FloPayError5 } from "@flopay/shared";
4130
- import { forwardRef as forwardRef2, useCallback as useCallback4, useEffect as useEffect6, useImperativeHandle as useImperativeHandle2, useState as useState5 } from "react";
4131
- import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
4029
+ import { forwardRef as forwardRef2, useCallback as useCallback3, useEffect as useEffect5, useImperativeHandle as useImperativeHandle2, useState as useState4 } from "react";
4030
+ import { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
4132
4031
  var WALLET_RESUME_KEY2 = "flopay_wallet_resume";
4133
4032
  var CheckoutForm = forwardRef2(
4134
4033
  function CheckoutForm2(props, ref) {
4135
- return /* @__PURE__ */ jsx8(CheckoutFormInner, { ...props, innerRef: ref });
4034
+ return /* @__PURE__ */ jsx7(CheckoutFormInner, { ...props, innerRef: ref });
4136
4035
  }
4137
4036
  );
4138
4037
  function CheckoutFormInner({
@@ -4161,27 +4060,27 @@ function CheckoutFormInner({
4161
4060
  const paypalFlopay = usePayPalFloPay();
4162
4061
  const elements = useElements();
4163
4062
  const contextBillingUrl = useBillingApiUrl();
4164
- const [processing, setProcessing] = useState5(false);
4165
- const [error, setError] = useState5(null);
4166
- const [is3DSActive, setIs3DSActive] = useState5(false);
4063
+ const [processing, setProcessing] = useState4(false);
4064
+ const [error, setError] = useState4(null);
4065
+ const [is3DSActive, setIs3DSActive] = useState4(false);
4167
4066
  const displayError = externalError ?? error;
4168
4067
  const isSubmitting = externalProcessing ?? processing;
4169
4068
  const isSelfContained = !onTokenizedBody;
4170
4069
  const baseUrl = (billingApiUrl || contextBillingUrl).replace(/\/+$/, "");
4171
- const updateError = useCallback4(
4070
+ const updateError = useCallback3(
4172
4071
  (err) => {
4173
4072
  setError(err);
4174
4073
  onErrorChange?.(err);
4175
4074
  },
4176
4075
  [onErrorChange]
4177
4076
  );
4178
- const emitDecline = useCallback4(
4077
+ const emitDecline = useCallback3(
4179
4078
  (input, overrides) => {
4180
4079
  onDecline?.(buildDeclineEvent("card", input, overrides));
4181
4080
  },
4182
4081
  [onDecline]
4183
4082
  );
4184
- const processPaymentInternal = useCallback4(
4083
+ const processPaymentInternal = useCallback3(
4185
4084
  async (tokenizedBody, completionPaymentMethodId) => {
4186
4085
  setProcessing(true);
4187
4086
  updateError(null);
@@ -4292,7 +4191,7 @@ function CheckoutFormInner({
4292
4191
  },
4293
4192
  [baseUrl, sessionId, userId, email, firstName, lastName, chv, flopay, paypalFlopay, onComplete, onError, onDecline, updateError, emitDecline]
4294
4193
  );
4295
- const dispatchTokenizedBody = useCallback4(
4194
+ const dispatchTokenizedBody = useCallback3(
4296
4195
  (tokenizedBody) => {
4297
4196
  if (onTokenizedBody) {
4298
4197
  onTokenizedBody(tokenizedBody);
@@ -4329,7 +4228,7 @@ function CheckoutFormInner({
4329
4228
  }
4330
4229
  }
4331
4230
  }), [flopay, dispatchTokenizedBody, onError, updateError, emitDecline]);
4332
- useEffect6(() => {
4231
+ useEffect5(() => {
4333
4232
  if (typeof window === "undefined") return;
4334
4233
  const stored = localStorage.getItem(WALLET_RESUME_KEY2);
4335
4234
  if (!stored) return;
@@ -4347,7 +4246,7 @@ function CheckoutFormInner({
4347
4246
  localStorage.removeItem(WALLET_RESUME_KEY2);
4348
4247
  }
4349
4248
  }, [sessionId, dispatchTokenizedBody]);
4350
- const handleSubmit = useCallback4(
4249
+ const handleSubmit = useCallback3(
4351
4250
  async (e) => {
4352
4251
  e.preventDefault();
4353
4252
  if (!flopay || !elements || isSubmitting) return;
@@ -4437,8 +4336,8 @@ function CheckoutFormInner({
4437
4336
  [flopay, elements, isSubmitting, sessionId, email, baseUrl, isSelfContained, dispatchTokenizedBody, onError, updateError, emitDecline]
4438
4337
  );
4439
4338
  const isReady = flopay !== null && elements !== null;
4440
- return /* @__PURE__ */ jsxs6("form", { onSubmit: handleSubmit, className, style: { position: "relative" }, children: [
4441
- (is3DSActive || isSubmitting) && /* @__PURE__ */ jsx8("div", { "data-testid": "flopay-overlay", style: {
4339
+ return /* @__PURE__ */ jsxs5("form", { onSubmit: handleSubmit, className, style: { position: "relative" }, children: [
4340
+ (is3DSActive || isSubmitting) && /* @__PURE__ */ jsx7("div", { "data-testid": "flopay-overlay", style: {
4442
4341
  position: "absolute",
4443
4342
  inset: 0,
4444
4343
  background: "rgba(255,255,255,0.7)",
@@ -4447,12 +4346,12 @@ function CheckoutFormInner({
4447
4346
  justifyContent: "center",
4448
4347
  zIndex: 10
4449
4348
  }, children: is3DSActive ? "Verifying payment..." : "Processing..." }),
4450
- !isReady && /* @__PURE__ */ jsx8("div", { "data-testid": "flopay-loading", "aria-busy": "true", children: "Loading payment form..." }),
4451
- isReady && /* @__PURE__ */ jsxs6(Fragment4, { children: [
4452
- /* @__PURE__ */ jsx8(PaymentElement, { options: { layout } }),
4453
- showAddress && /* @__PURE__ */ jsx8(AddressElement, { options: { mode: showAddress === true ? "billing" : showAddress } }),
4454
- displayError && /* @__PURE__ */ jsx8("div", { role: "alert", "data-testid": "flopay-error", style: { color: "red", margin: "0.75rem 0" }, children: displayError }),
4455
- children ?? /* @__PURE__ */ jsx8(
4349
+ !isReady && /* @__PURE__ */ jsx7("div", { "data-testid": "flopay-loading", "aria-busy": "true", children: "Loading payment form..." }),
4350
+ isReady && /* @__PURE__ */ jsxs5(Fragment4, { children: [
4351
+ /* @__PURE__ */ jsx7(PaymentElement, { options: { layout } }),
4352
+ showAddress && /* @__PURE__ */ jsx7(AddressElement, { options: { mode: showAddress === true ? "billing" : showAddress } }),
4353
+ displayError && /* @__PURE__ */ jsx7("div", { role: "alert", "data-testid": "flopay-error", style: { color: "red", margin: "0.75rem 0" }, children: displayError }),
4354
+ children ?? /* @__PURE__ */ jsx7(
4456
4355
  "button",
4457
4356
  {
4458
4357
  type: "submit",
@@ -4468,8 +4367,8 @@ function CheckoutFormInner({
4468
4367
  // src/paypal-button.tsx
4469
4368
  import { PaymentAPI as PaymentAPI5 } from "@flopay/js";
4470
4369
  import { FloPayError as FloPayError6 } from "@flopay/shared";
4471
- import { useCallback as useCallback5, useEffect as useEffect7, useRef as useRef4, useState as useState6 } from "react";
4472
- import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
4370
+ import { useCallback as useCallback4, useEffect as useEffect6, useRef as useRef4, useState as useState5 } from "react";
4371
+ import { Fragment as Fragment5, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
4473
4372
  function PayPalButton({
4474
4373
  sessionId,
4475
4374
  billingApiUrl,
@@ -4486,11 +4385,11 @@ function PayPalButton({
4486
4385
  const flopay = useFloPay();
4487
4386
  const elements = useElements();
4488
4387
  const contextBillingUrl = useBillingApiUrl();
4489
- const [ready, setReady] = useState6(false);
4490
- const [submitting, setSubmitting] = useState6(false);
4388
+ const [ready, setReady] = useState5(false);
4389
+ const [submitting, setSubmitting] = useState5(false);
4491
4390
  const paypalResumeAttempted = useRef4(false);
4492
4391
  const baseUrl = (billingApiUrl || contextBillingUrl).replace(/\/+$/, "");
4493
- const processPaymentInternal = useCallback5(
4392
+ const processPaymentInternal = useCallback4(
4494
4393
  async (tokenizedBody) => {
4495
4394
  try {
4496
4395
  const api = new PaymentAPI5(baseUrl);
@@ -4517,7 +4416,7 @@ function PayPalButton({
4517
4416
  },
4518
4417
  [baseUrl, sessionId, userId, email, firstName, lastName, chv, onComplete, onErrorChange]
4519
4418
  );
4520
- const dispatchTokenizedBody = useCallback5(
4419
+ const dispatchTokenizedBody = useCallback4(
4521
4420
  (body) => {
4522
4421
  if (onTokenizedBody) {
4523
4422
  onTokenizedBody(body);
@@ -4527,7 +4426,7 @@ function PayPalButton({
4527
4426
  },
4528
4427
  [onTokenizedBody, processPaymentInternal]
4529
4428
  );
4530
- useEffect7(() => {
4429
+ useEffect6(() => {
4531
4430
  if (!flopay || paypalResumeAttempted.current) return;
4532
4431
  const params = new URLSearchParams(window.location.search);
4533
4432
  const paymentIntentId = params.get("payment_intent");
@@ -4575,7 +4474,7 @@ function PayPalButton({
4575
4474
  }
4576
4475
  })();
4577
4476
  }, [flopay, dispatchTokenizedBody, onErrorChange]);
4578
- const handlePayPalConfirm = useCallback5(async () => {
4477
+ const handlePayPalConfirm = useCallback4(async () => {
4579
4478
  if (!flopay || !elements) return;
4580
4479
  try {
4581
4480
  setSubmitting(true);
@@ -4608,11 +4507,11 @@ function PayPalButton({
4608
4507
  }
4609
4508
  }, [flopay, elements, sessionId, email, baseUrl, dispatchTokenizedBody, onErrorChange]);
4610
4509
  if (!flopay || !elements) {
4611
- return /* @__PURE__ */ jsx9("div", { style: { height: 45, background: "#f0f0f0", borderRadius: 6, animation: "pulse 1.5s infinite" } });
4510
+ return /* @__PURE__ */ jsx8("div", { style: { height: 45, background: "#f0f0f0", borderRadius: 6, animation: "pulse 1.5s infinite" } });
4612
4511
  }
4613
- return /* @__PURE__ */ jsxs7(Fragment5, { children: [
4614
- !ready && /* @__PURE__ */ jsx9("div", { style: { height: 45, background: "#f0f0f0", borderRadius: 6 } }),
4615
- /* @__PURE__ */ jsx9("div", { style: ready ? {} : { display: "none" }, children: /* @__PURE__ */ jsx9(
4512
+ return /* @__PURE__ */ jsxs6(Fragment5, { children: [
4513
+ !ready && /* @__PURE__ */ jsx8("div", { style: { height: 45, background: "#f0f0f0", borderRadius: 6 } }),
4514
+ /* @__PURE__ */ jsx8("div", { style: ready ? {} : { display: "none" }, children: /* @__PURE__ */ jsx8(
4616
4515
  "button",
4617
4516
  {
4618
4517
  type: "button",
@@ -4634,7 +4533,7 @@ function PayPalButton({
4634
4533
  children: submitting ? "Processing..." : "PayPal"
4635
4534
  }
4636
4535
  ) }),
4637
- (submitting || isProcessing) && /* @__PURE__ */ jsx9("div", { style: {
4536
+ (submitting || isProcessing) && /* @__PURE__ */ jsx8("div", { style: {
4638
4537
  position: "fixed",
4639
4538
  inset: 0,
4640
4539
  background: "rgba(0,0,0,0.4)",
@@ -4642,7 +4541,7 @@ function PayPalButton({
4642
4541
  alignItems: "center",
4643
4542
  justifyContent: "center",
4644
4543
  zIndex: 1e3
4645
- }, children: /* @__PURE__ */ jsx9("div", { style: {
4544
+ }, children: /* @__PURE__ */ jsx8("div", { style: {
4646
4545
  background: "white",
4647
4546
  borderRadius: 8,
4648
4547
  padding: "1.5rem",
@@ -4654,10 +4553,10 @@ function PayPalButton({
4654
4553
  }
4655
4554
 
4656
4555
  // src/automatic-payment-button.tsx
4657
- import { useCallback as useCallback6, useEffect as useEffect8, useMemo as useMemo4, useRef as useRef5, useState as useState7 } from "react";
4556
+ import { useCallback as useCallback5, useEffect as useEffect7, useMemo as useMemo4, useRef as useRef5, useState as useState6 } from "react";
4658
4557
  import { PaymentAPI as PaymentAPI6 } from "@flopay/js";
4659
4558
  import { FloPayError as FloPayError7, resolveBillingApiUrl as resolveBillingApiUrl4, resolveButtonsLayoutTheme as resolveButtonsLayoutTheme3 } from "@flopay/shared";
4660
- import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
4559
+ import { Fragment as Fragment6, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
4661
4560
  var DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT3 = 44;
4662
4561
  var PAYPAL_RESUME_STORAGE_KEY2 = "flopay_automatic_payment_button_resume";
4663
4562
  function sleep2(ms) {
@@ -4804,10 +4703,10 @@ function FloPayAutomaticPaymentButton({
4804
4703
  utmMetadata
4805
4704
  ]
4806
4705
  );
4807
- const [isProcessing, setIsProcessing] = useState7(false);
4808
- const [overlayStatus, setOverlayStatus] = useState7(null);
4809
- const [overlayError, setOverlayError] = useState7(null);
4810
- const [fallbackSession, setFallbackSession] = useState7(null);
4706
+ const [isProcessing, setIsProcessing] = useState6(false);
4707
+ const [overlayStatus, setOverlayStatus] = useState6(null);
4708
+ const [overlayError, setOverlayError] = useState6(null);
4709
+ const [fallbackSession, setFallbackSession] = useState6(null);
4811
4710
  const automaticPaymentToken = useMemo4(
4812
4711
  () => paymentMethodId ? {
4813
4712
  id: paymentMethodId,
@@ -4822,25 +4721,25 @@ function FloPayAutomaticPaymentButton({
4822
4721
  const onSuccessRef = useRef5(onSuccess);
4823
4722
  const onErrorRef = useRef5(onError);
4824
4723
  const onDeclineRef = useRef5(onDecline);
4825
- useEffect8(() => {
4724
+ useEffect7(() => {
4826
4725
  fallbackSessionRef.current = fallbackSession;
4827
4726
  }, [fallbackSession]);
4828
- useEffect8(() => {
4727
+ useEffect7(() => {
4829
4728
  onSuccessRef.current = onSuccess;
4830
4729
  }, [onSuccess]);
4831
- useEffect8(() => {
4730
+ useEffect7(() => {
4832
4731
  onErrorRef.current = onError;
4833
4732
  }, [onError]);
4834
- useEffect8(() => {
4733
+ useEffect7(() => {
4835
4734
  onDeclineRef.current = onDecline;
4836
4735
  }, [onDecline]);
4837
- useEffect8(() => {
4736
+ useEffect7(() => {
4838
4737
  isMountedRef.current = true;
4839
4738
  return () => {
4840
4739
  isMountedRef.current = false;
4841
4740
  };
4842
4741
  }, []);
4843
- useEffect8(() => {
4742
+ useEffect7(() => {
4844
4743
  if (!fallbackSession || typeof window === "undefined") {
4845
4744
  return;
4846
4745
  }
@@ -4854,13 +4753,13 @@ function FloPayAutomaticPaymentButton({
4854
4753
  window.removeEventListener("keydown", handleKeyDown);
4855
4754
  };
4856
4755
  }, [fallbackSession]);
4857
- const emitDecline = useCallback6((error, method = DEFAULT_SAVED_PAYMENT_DECLINE_METHOD) => {
4756
+ const emitDecline = useCallback5((error, method = DEFAULT_SAVED_PAYMENT_DECLINE_METHOD) => {
4858
4757
  onDeclineRef.current?.(buildDeclineEvent(method, error, {
4859
4758
  code: error.code,
4860
4759
  declineCode: error.declineCode
4861
4760
  }));
4862
4761
  }, []);
4863
- const showSuccess = useCallback6(async (event) => {
4762
+ const showSuccess = useCallback5(async (event) => {
4864
4763
  if (!isMountedRef.current) return;
4865
4764
  setOverlayError(null);
4866
4765
  setOverlayStatus("success");
@@ -4868,7 +4767,7 @@ function FloPayAutomaticPaymentButton({
4868
4767
  if (!isMountedRef.current) return;
4869
4768
  onSuccessRef.current?.(event);
4870
4769
  }, []);
4871
- const showError = useCallback6(async (error, options) => {
4770
+ const showError = useCallback5(async (error, options) => {
4872
4771
  if (!isMountedRef.current) return;
4873
4772
  onErrorRef.current?.(error);
4874
4773
  if (options?.emitDecline) {
@@ -4878,7 +4777,7 @@ function FloPayAutomaticPaymentButton({
4878
4777
  setOverlayStatus("error");
4879
4778
  await sleep2(PROCESSING_OVERLAY_ERROR_DELAY_MS);
4880
4779
  }, [emitDecline]);
4881
- const processResolvedSession = useCallback6(async (apiResult, resolvedSessionId, options) => {
4780
+ const processResolvedSession = useCallback5(async (apiResult, resolvedSessionId, options) => {
4882
4781
  const session = apiResult.data.session ?? null;
4883
4782
  if (!session) {
4884
4783
  throw new FloPayError7("No session data returned", "api_error");
@@ -5101,7 +5000,7 @@ function FloPayAutomaticPaymentButton({
5101
5000
  showError,
5102
5001
  showSuccess
5103
5002
  ]);
5104
- const handleButtonClick = useCallback6(async (event) => {
5003
+ const handleButtonClick = useCallback5(async (event) => {
5105
5004
  buttonProps.onClick?.(event);
5106
5005
  if (event.defaultPrevented || disabled || isProcessing) {
5107
5006
  return;
@@ -5183,7 +5082,7 @@ function FloPayAutomaticPaymentButton({
5183
5082
  showError,
5184
5083
  showSuccess
5185
5084
  ]);
5186
- const handleFallbackComplete = useCallback6((result) => {
5085
+ const handleFallbackComplete = useCallback5((result) => {
5187
5086
  const activeFallback = fallbackSessionRef.current;
5188
5087
  setFallbackSession(null);
5189
5088
  onSuccessRef.current?.({
@@ -5193,13 +5092,13 @@ function FloPayAutomaticPaymentButton({
5193
5092
  autoCompleted: false
5194
5093
  });
5195
5094
  }, []);
5196
- const handleFallbackError = useCallback6((error) => {
5095
+ const handleFallbackError = useCallback5((error) => {
5197
5096
  onErrorRef.current?.(error);
5198
5097
  }, []);
5199
- const handleFallbackDecline = useCallback6((decline) => {
5098
+ const handleFallbackDecline = useCallback5((decline) => {
5200
5099
  onDeclineRef.current?.(decline);
5201
5100
  }, []);
5202
- useEffect8(() => {
5101
+ useEffect7(() => {
5203
5102
  if (typeof window === "undefined" || resumeAttemptedRef.current) {
5204
5103
  return;
5205
5104
  }
@@ -5340,8 +5239,8 @@ function FloPayAutomaticPaymentButton({
5340
5239
  };
5341
5240
  }, [buttonsTheme, stylesOverride]);
5342
5241
  const cardButtonSizing = children === void 0 ? { boxSizing: "border-box", height: DEFAULT_BUTTONS_LAYOUT_BUTTON_HEIGHT3, padding: "0 1rem" } : { padding: "0.9rem 1rem" };
5343
- return /* @__PURE__ */ jsxs8(Fragment6, { children: [
5344
- /* @__PURE__ */ jsx10(
5242
+ return /* @__PURE__ */ jsxs7(Fragment6, { children: [
5243
+ /* @__PURE__ */ jsx9(
5345
5244
  "button",
5346
5245
  {
5347
5246
  ...buttonProps,
@@ -5382,17 +5281,17 @@ function FloPayAutomaticPaymentButton({
5382
5281
  e.currentTarget.style.transform = "scale(1)";
5383
5282
  }
5384
5283
  },
5385
- children: /* @__PURE__ */ jsx10(CardButtonContentSlot, { content: children })
5284
+ children: /* @__PURE__ */ jsx9(CardButtonContentSlot, { content: children })
5386
5285
  }
5387
5286
  ),
5388
- overlayStatus && /* @__PURE__ */ jsx10(
5287
+ overlayStatus && /* @__PURE__ */ jsx9(
5389
5288
  ProcessingOverlay,
5390
5289
  {
5391
5290
  status: overlayStatus,
5392
5291
  errorMessage: overlayError
5393
5292
  }
5394
5293
  ),
5395
- fallbackSession && /* @__PURE__ */ jsx10(
5294
+ fallbackSession && /* @__PURE__ */ jsx9(
5396
5295
  "div",
5397
5296
  {
5398
5297
  "data-testid": "flopay-automatic-payment-fallback",
@@ -5413,7 +5312,7 @@ function FloPayAutomaticPaymentButton({
5413
5312
  padding: "1.5rem",
5414
5313
  zIndex: 1100
5415
5314
  },
5416
- children: /* @__PURE__ */ jsx10(
5315
+ children: /* @__PURE__ */ jsx9(
5417
5316
  "div",
5418
5317
  {
5419
5318
  style: {
@@ -5429,7 +5328,7 @@ function FloPayAutomaticPaymentButton({
5429
5328
  flexDirection: "column",
5430
5329
  gap: "1rem"
5431
5330
  },
5432
- children: /* @__PURE__ */ jsx10(
5331
+ children: /* @__PURE__ */ jsx9(
5433
5332
  FloPayCheckout,
5434
5333
  {
5435
5334
  sessionId: fallbackSession.sessionId,
@@ -5459,11 +5358,9 @@ export {
5459
5358
  FloPayAutomaticPaymentButton,
5460
5359
  FloPayCheckout,
5461
5360
  FloPayProvider,
5462
- InAppBrowserNotice,
5463
5361
  PayPalButton,
5464
5362
  PaymentElement,
5465
5363
  SplitCardForm,
5466
- isInAppBrowser,
5467
5364
  useCheckout,
5468
5365
  useElements,
5469
5366
  useFloPay,