@superlogic/spree-pay 0.4.6 → 0.4.8

package/build/{CryptoComTab-5662XFNI.js → CryptoComTab-3SEGMLPB.js}

@@ -1,6 +1,6 @@
 import {
   Iframe3ds
-} from "./chunk-7I6EBCSI.js";
+} from "./chunk-EXKCBGNL.js";
 import {
   InfoBanner,
   Legal,
@@ -12,7 +12,7 @@ import {
   useSpreePayRegister,
   useSpreePaymentMethod,
   useStaticConfig
-} from "./chunk-AGTOSFMT.js";
+} from "./chunk-SKM7ZAUY.js";
 
 // src/components/CryptoComTab/CryptoComTab.tsx
 import { useCallback, useEffect } from "react";

package/build/{CryptoTab-7EG23TQW.js → CryptoTab-DQCQF6BG.js}

@@ -2,7 +2,7 @@ import {
   CheckoutButton,
   PointsSwitch,
   cn as cn2
-} from "./chunk-FKAVWVFL.js";
+} from "./chunk-W43VOUYP.js";
 import {
   Dialog,
   DialogContent,
@@ -16,7 +16,7 @@ import {
   useSpreePayConfig,
   useSpreePayRegister,
   useSpreePaymentMethod
-} from "./chunk-AGTOSFMT.js";
+} from "./chunk-SKM7ZAUY.js";
 
 // src/components/CryptoTab/Crypto/CryptoWrapper.tsx
 import { useMemo as useMemo2 } from "react";

package/build/{chunk-7I6EBCSI.js → chunk-EXKCBGNL.js}

@@ -2,7 +2,7 @@ import {
   Dialog,
   DialogContent,
   DialogTitle
-} from "./chunk-AGTOSFMT.js";
+} from "./chunk-SKM7ZAUY.js";
 
 // src/modals/Iframe3ds.tsx
 import { useEffect } from "react";

package/build/{chunk-AGTOSFMT.js → chunk-SKM7ZAUY.js}

@@ -10,7 +10,7 @@ var PaymentType = /* @__PURE__ */ ((PaymentType2) => {
 })(PaymentType || {});
 
 // package.json
-var version = "0.4.6";
+var version = "0.4.8";
 
 // src/utils/logger.ts
 var LogLevel = /* @__PURE__ */ ((LogLevel2) => {

package/build/{chunk-FKAVWVFL.js → chunk-W43VOUYP.js}

@@ -6,7 +6,7 @@ import {
   useSpreePayEnv,
   useSpreePaymentMethod,
   useStaticConfig
-} from "./chunk-AGTOSFMT.js";
+} from "./chunk-SKM7ZAUY.js";
 
 // src/components/common/PointsSwitch.tsx
 import { useId } from "react";

package/build/index.cjs

@@ -69,7 +69,7 @@ var init_payments = __esm({
 var version;
 var init_package = __esm({
   "package.json"() {
-    version = "0.4.6";
+    version = "0.4.8";
   }
 });
 
@@ -3137,6 +3137,7 @@ var useCards = () => {
 init_useSlapiBalance();
 init_useSpreePayConfig();
 init_errors();
+init_payments();
 init_split();
 init_CheckoutButton();
 
@@ -3463,9 +3464,8 @@ var StripeWrapper = ({ onCancel, saveNewCard, publicKey }) => {
   const stripePromise = (0, import_react9.useMemo)(() => (0, import_stripe_js.loadStripe)(publicKey), [publicKey]);
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_stripe_js2.Elements, { stripe: stripePromise, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CreditCardForm, { cancel: onCancel, saveCard: saveNewCard }) });
 };
-var CreditCard = () => {
+var CreditCard = ({ newCards, setNewCards }) => {
   const [showForm, setShowForm] = (0, import_react9.useState)(false);
-  const [newCards, setNewCards] = (0, import_react9.useState)([]);
   const { selectedPaymentMethod, setSelectedPaymentMethod } = useSpreePaymentMethod();
   const { spreePayConfig } = useSpreePayConfig();
   const setCard = (card) => {
@@ -3481,9 +3481,12 @@ var CreditCard = () => {
     setCard(newCard);
     setShowForm(false);
   };
-  const removeNewCard = (0, import_react9.useCallback)((card) => {
-    setNewCards((prev) => prev.filter((c) => c.id !== card.id));
-  }, []);
+  const removeNewCard = (0, import_react9.useCallback)(
+    (card) => {
+      setNewCards((prev) => prev.filter((c) => c.id !== card.id));
+    },
+    [setNewCards]
+  );
   const handleCancel = () => {
     setShowForm(false);
   };
@@ -4734,8 +4737,9 @@ var CreditCardTab = ({ isLoggedIn }) => {
   const { appProps } = useStaticConfig();
   const { spreePayConfig } = useSpreePayConfig();
   const { register } = useSpreePayRegister();
-  const { mutateCards } = useCards();
+  const { cards, mutateCards } = useCards();
   const { mutateBalance } = useSlapiBalance();
+  const [newCards, setNewCards] = (0, import_react15.useState)([]);
   const isWeb3Enabled = Boolean(useWeb3Points);
   const { cardPayment } = useCardPayment();
   const { splitPayment } = useSplitCardPayments(isWeb3Enabled ? "web3" : "web2");
@@ -4760,14 +4764,24 @@ var CreditCardTab = ({ isLoggedIn }) => {
       } catch (_) {
         return Promise.reject(new PaymentError("Payment failed", "FAILED" /* FAILED */));
       } finally {
-        if ("token" in (selectedPaymentMethod.method || {})) {
-          setSelectedPaymentMethod({ ...selectedPaymentMethod, type: "CREDIT_CARD" /* CREDIT_CARD */, method: null });
-        }
-        mutateCards();
         mutateBalance();
+        if (selectedPaymentMethod.type === "CREDIT_CARD" /* CREDIT_CARD */ && selectedPaymentMethod.method && isNewCard(selectedPaymentMethod.method)) {
+          const knownIds = new Set(cards.map((c) => c.id));
+          const updated = await mutateCards();
+          const newSavedCard = (updated?.data ?? []).find((c) => c.active && !knownIds.has(c.id));
+          setSelectedPaymentMethod({
+            ...selectedPaymentMethod,
+            type: "CREDIT_CARD" /* CREDIT_CARD */,
+            method: newSavedCard ?? null
+          });
+          setNewCards([]);
+        } else {
+          mutateCards();
+        }
       }
     },
     [
+      cards,
       mutateCards,
       selectedPaymentMethod,
       pointsPayment,
@@ -4783,7 +4797,7 @@ var CreditCardTab = ({ isLoggedIn }) => {
     register(handlePay);
   }, [register, handlePay]);
   return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "border-b border-b-(--border-component-specific-card) px-5 py-5 md:px-7 md:py-6", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CreditCard, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "border-b border-b-(--border-component-specific-card) px-5 py-5 md:px-7 md:py-6", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CreditCard, { newCards, setNewCards }) }),
     !spreePayConfig?.creditCard.hidePoints && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex flex-col gap-4 border-b border-b-(--border-component-specific-card) px-5 pt-5 pb-5 md:px-7 md:pt-6 md:pb-7", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Points, {}) }),
     /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CheckoutButton, { isLoggedIn })
   ] });

package/build/index.js

@@ -8,10 +8,10 @@ import {
   getSplitAmount,
   getTransactionFee,
   useSlapiBalance
-} from "./chunk-FKAVWVFL.js";
+} from "./chunk-W43VOUYP.js";
 import {
   Iframe3ds
-} from "./chunk-7I6EBCSI.js";
+} from "./chunk-EXKCBGNL.js";
 import {
   InfoBanner,
   LogLevel,
@@ -32,10 +32,10 @@ import {
   useSpreePayRegister,
   useSpreePaymentMethod,
   useStaticConfig
-} from "./chunk-AGTOSFMT.js";
+} from "./chunk-SKM7ZAUY.js";
 
 // src/SpreePay.tsx
-import { useCallback as useCallback8, useEffect as useEffect8, useMemo as useMemo9, useState as useState11 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect8, useMemo as useMemo9, useState as useState12 } from "react";
 import NiceModal4 from "@ebay/nice-modal-react";
 import { SWRConfig } from "swr";
 
@@ -43,7 +43,7 @@ import { SWRConfig } from "swr";
 import { Suspense, lazy } from "react";
 
 // src/components/CreditCardTab/CreditCardTab.tsx
-import { useCallback as useCallback6, useEffect as useEffect6 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect6, useState as useState10 } from "react";
 
 // src/hooks/payments/useCardPayment.ts
 import NiceModal from "@ebay/nice-modal-react";
@@ -868,9 +868,8 @@ var StripeWrapper = ({ onCancel, saveNewCard, publicKey }) => {
   const stripePromise = useMemo3(() => loadStripe(publicKey), [publicKey]);
   return /* @__PURE__ */ jsx5(Elements, { stripe: stripePromise, children: /* @__PURE__ */ jsx5(CreditCardForm, { cancel: onCancel, saveCard: saveNewCard }) });
 };
-var CreditCard = () => {
+var CreditCard = ({ newCards, setNewCards }) => {
   const [showForm, setShowForm] = useState3(false);
-  const [newCards, setNewCards] = useState3([]);
   const { selectedPaymentMethod, setSelectedPaymentMethod } = useSpreePaymentMethod();
   const { spreePayConfig } = useSpreePayConfig();
   const setCard = (card) => {
@@ -886,9 +885,12 @@ var CreditCard = () => {
     setCard(newCard);
     setShowForm(false);
   };
-  const removeNewCard = useCallback2((card) => {
-    setNewCards((prev) => prev.filter((c) => c.id !== card.id));
-  }, []);
+  const removeNewCard = useCallback2(
+    (card) => {
+      setNewCards((prev) => prev.filter((c) => c.id !== card.id));
+    },
+    [setNewCards]
+  );
   const handleCancel = () => {
     setShowForm(false);
   };
@@ -2119,8 +2121,9 @@ var CreditCardTab = ({ isLoggedIn }) => {
   const { appProps } = useStaticConfig();
   const { spreePayConfig } = useSpreePayConfig();
   const { register } = useSpreePayRegister();
-  const { mutateCards } = useCards();
+  const { cards, mutateCards } = useCards();
   const { mutateBalance } = useSlapiBalance();
+  const [newCards, setNewCards] = useState10([]);
   const isWeb3Enabled = Boolean(useWeb3Points);
   const { cardPayment } = useCardPayment();
   const { splitPayment } = useSplitCardPayments(isWeb3Enabled ? "web3" : "web2");
@@ -2145,14 +2148,24 @@ var CreditCardTab = ({ isLoggedIn }) => {
       } catch (_) {
         return Promise.reject(new PaymentError("Payment failed", "FAILED" /* FAILED */));
       } finally {
-        if ("token" in (selectedPaymentMethod.method || {})) {
-          setSelectedPaymentMethod({ ...selectedPaymentMethod, type: "CREDIT_CARD" /* CREDIT_CARD */, method: null });
-        }
-        mutateCards();
         mutateBalance();
+        if (selectedPaymentMethod.type === "CREDIT_CARD" /* CREDIT_CARD */ && selectedPaymentMethod.method && isNewCard(selectedPaymentMethod.method)) {
+          const knownIds = new Set(cards.map((c) => c.id));
+          const updated = await mutateCards();
+          const newSavedCard = (updated?.data ?? []).find((c) => c.active && !knownIds.has(c.id));
+          setSelectedPaymentMethod({
+            ...selectedPaymentMethod,
+            type: "CREDIT_CARD" /* CREDIT_CARD */,
+            method: newSavedCard ?? null
+          });
+          setNewCards([]);
+        } else {
+          mutateCards();
+        }
       }
     },
     [
+      cards,
       mutateCards,
       selectedPaymentMethod,
       pointsPayment,
@@ -2168,7 +2181,7 @@ var CreditCardTab = ({ isLoggedIn }) => {
     register(handlePay);
   }, [register, handlePay]);
   return /* @__PURE__ */ jsxs9("div", { children: [
-    /* @__PURE__ */ jsx16("div", { className: "border-b border-b-(--border-component-specific-card) px-5 py-5 md:px-7 md:py-6", children: /* @__PURE__ */ jsx16(CreditCard, {}) }),
+    /* @__PURE__ */ jsx16("div", { className: "border-b border-b-(--border-component-specific-card) px-5 py-5 md:px-7 md:py-6", children: /* @__PURE__ */ jsx16(CreditCard, { newCards, setNewCards }) }),
     !spreePayConfig?.creditCard.hidePoints && /* @__PURE__ */ jsx16("div", { className: "flex flex-col gap-4 border-b border-b-(--border-component-specific-card) px-5 pt-5 pb-5 md:px-7 md:pt-6 md:pb-7", children: /* @__PURE__ */ jsx16(Points, {}) }),
     /* @__PURE__ */ jsx16(CheckoutButton, { isLoggedIn })
   ] });
@@ -2246,9 +2259,9 @@ var TabButtons = (props) => {
 
 // src/SpreePayContent.tsx
 import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
-var CryptoTab = lazy(() => import("./CryptoTab-7EG23TQW.js").then((module) => ({ default: module.CryptoTab })));
+var CryptoTab = lazy(() => import("./CryptoTab-DQCQF6BG.js").then((module) => ({ default: module.CryptoTab })));
 var CryptoComTab = lazy(
-  () => import("./CryptoComTab-5662XFNI.js").then((module) => ({ default: module.CryptoComTab }))
+  () => import("./CryptoComTab-3SEGMLPB.js").then((module) => ({ default: module.CryptoComTab }))
 );
 var TabLoadingFallback = () => /* @__PURE__ */ jsx18("div", { className: "flex items-center justify-center px-5 py-8 md:px-7", children: /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center gap-3", children: [
   /* @__PURE__ */ jsx18("div", { className: "h-8 w-8 animate-spin rounded-full border-4 border-(--border-component-specific-card) border-t-(--brand-primary)" }),
@@ -2318,7 +2331,7 @@ var ErrorBoundary = class extends Component {
 };
 
 // src/hooks/useKeycloakSSO.ts
-import { useCallback as useCallback7, useEffect as useEffect7, useRef as useRef7, useState as useState10 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect7, useRef as useRef7, useState as useState11 } from "react";
 import Keycloak from "keycloak-js";
 var refreshAheadSeconds = 60;
 var keycloakLogger = logger.child("keycloak");
@@ -2329,9 +2342,9 @@ function useKeycloakSSO(config) {
   const refreshTimerRef = useRef7(null);
   const scheduleRefreshRef = useRef7(() => {
   });
-  const [error, setError] = useState10(null);
-  const [isChecking, setIsChecking] = useState10(enabled);
-  const [accessToken, setAccessToken] = useState10(null);
+  const [error, setError] = useState11(null);
+  const [isChecking, setIsChecking] = useState11(enabled);
+  const [accessToken, setAccessToken] = useState11(null);
   const scheduleRefresh = useCallback7(() => {
     const kc = kcRef.current;
     if (!kc || !kc.tokenParsed || !kc.tokenParsed.exp) {
@@ -2406,7 +2419,7 @@ var isTokenExpired = (token) => {
 // src/SpreePay.tsx
 import { jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
 var SpreePayInner = () => {
-  const [portalEl, setPortalEl] = useState11(null);
+  const [portalEl, setPortalEl] = useState12(null);
   const rootRef = useCallback8((node) => {
     if (!node) return;
     const el = node.querySelector(":scope > .sl-spreepay__portal");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@superlogic/spree-pay",
-  "version": "0.4.6",
+  "version": "0.4.8",
   "description": "Spree-pay React component and utilities",
   "private": false,
   "type": "module",
@@ -41,7 +41,7 @@
   },
   "dependencies": {
     "@ebay/nice-modal-react": "^1.2.13",
-    "@mocanetwork/airkit": "^1.7.0",
+    "@mocanetwork/airkit": "1.7.0",
     "@radix-ui/react-checkbox": "^1.1.3",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-label": "^2.1.8",