@solvapay/react 1.2.1 → 1.3.0-preview-cb8ad16e16ce8f8f357bd7f2e7068d85159df587

package/dist/index.cjs

@@ -61,6 +61,7 @@ __export(index_exports, {
   confirmPayment: () => confirmPayment,
   createAnonymousAuthAdapter: () => createAnonymousAuthAdapter,
   createHttpTransport: () => createHttpTransport,
+  createSessionAuthAdapter: () => createSessionAuthAdapter,
   defaultAuthAdapter: () => defaultAuthAdapter,
   deriveVariant: () => deriveVariant,
   enCopy: () => enCopy,
@@ -263,6 +264,17 @@ async function buildRequestHeaders(config) {
   return { headers, userId };
 }
 
+// src/utils/readErrorMessage.ts
+async function readErrorMessage(res, fallbackPrefix) {
+  let serverMessage;
+  try {
+    const data = await res.clone().json();
+    serverMessage = data?.error;
+  } catch {
+  }
+  return serverMessage || `${fallbackPrefix}: ${res.statusText || res.status}`;
+}
+
 // src/transport/http.ts
 async function request(config, url, opts) {
   const { headers } = await buildRequestHeaders(config);
@@ -273,13 +285,8 @@ async function request(config, url, opts) {
   }
   const res = await fetchFn(url, init);
   if (!res.ok) {
-    let serverMessage;
-    try {
-      const data = await res.clone().json();
-      serverMessage = data?.error;
-    } catch {
-    }
-    const error = new Error(serverMessage || `${opts.errorPrefix}: ${res.statusText || res.status}`);
+    const message = await readErrorMessage(res, opts.errorPrefix);
+    const error = new Error(message);
     config?.onError?.(error, opts.onErrorContext);
     throw error;
   }
@@ -319,6 +326,7 @@ function createHttpTransport(config) {
       const body = {};
       if (params.planRef) body.planRef = params.planRef;
       if (params.productRef) body.productRef = params.productRef;
+      if (params.currency) body.currency = params.currency;
       if (params.customer && (params.customer.name || params.customer.email)) {
         body.customer = params.customer;
       }
@@ -551,6 +559,7 @@ var enCopy = {
     currentBadge: "Current",
     popularBadge: "Popular",
     freeBadge: "Free",
+    usageRateLabel: "Usage-based",
     perIntervalShort: "/{interval}",
     continueButton: "Continue",
     backButton: "\u2190 Back to plans",
@@ -1426,7 +1435,7 @@ var MissingProductRefError = class extends SolvaPayError {
 };
 
 // src/hooks/useCheckout.ts
-var import_react6 = require("react");
+var import_react7 = require("react");
 var import_stripe_js = require("@stripe/stripe-js");
 
 // src/hooks/useSolvaPay.ts
@@ -1441,6 +1450,18 @@ function useSolvaPay() {
   return context;
 }
 
+// src/components/PlanSelectionContext.tsx
+var import_react6 = require("react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var PlanSelectionContext = (0, import_react6.createContext)(null);
+var PlanSelectionProvider = ({
+  value,
+  children
+}) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PlanSelectionContext.Provider, { value, children });
+function usePlanSelection() {
+  return (0, import_react6.useContext)(PlanSelectionContext);
+}
+
 // src/hooks/useCheckout.ts
 var stripePromiseCache = /* @__PURE__ */ new Map();
 function getStripeCacheKey(publishableKey, accountId) {
@@ -1453,7 +1474,11 @@ async function resolvePlanRef(productRef, config) {
   const { headers } = await buildRequestHeaders(config);
   const res = await fetchFn(url, { method: "GET", headers });
   if (!res.ok) {
-    throw new Error(`Failed to fetch plans for product "${productRef}": ${res.statusText}`);
+    const message = await readErrorMessage(
+      res,
+      `Failed to fetch plans for product "${productRef}"`
+    );
+    throw new Error(message);
   }
   const data = await res.json();
   const allPlans = data.plans ?? [];
@@ -1475,15 +1500,16 @@ async function resolvePlanRef(productRef, config) {
   );
 }
 function useCheckout(options) {
-  const { planRef, productRef, customer } = options;
+  const { planRef, productRef, currency: currencyOverride, customer } = options;
+  const planSelection = usePlanSelection();
   const { createPayment, customerRef, updateCustomerRef, _config } = useSolvaPay();
-  const [loading, setLoading] = (0, import_react6.useState)(false);
-  const [error, setError] = (0, import_react6.useState)(null);
-  const [stripePromise, setStripePromise] = (0, import_react6.useState)(null);
-  const [clientSecret, setClientSecret] = (0, import_react6.useState)(null);
-  const [resolvedPlanRef, setResolvedPlanRef] = (0, import_react6.useState)(planRef || null);
-  const isStartingRef = (0, import_react6.useRef)(false);
-  const startCheckout = (0, import_react6.useCallback)(async () => {
+  const [loading, setLoading] = (0, import_react7.useState)(false);
+  const [error, setError] = (0, import_react7.useState)(null);
+  const [stripePromise, setStripePromise] = (0, import_react7.useState)(null);
+  const [clientSecret, setClientSecret] = (0, import_react7.useState)(null);
+  const [resolvedPlanRef, setResolvedPlanRef] = (0, import_react7.useState)(planRef || null);
+  const isStartingRef = (0, import_react7.useRef)(false);
+  const startCheckout = (0, import_react7.useCallback)(async () => {
     if (isStartingRef.current || loading) {
       return;
     }
@@ -1507,9 +1533,11 @@ function useCheckout(options) {
       if (!effectivePlanRef) {
         throw new Error("Could not determine plan reference for checkout");
       }
+      const selectedCurrency = currencyOverride ?? planSelection?.selectedCurrency ?? void 0;
       const result = await createPayment({
         planRef: effectivePlanRef,
         productRef,
+        ...selectedCurrency && { currency: selectedCurrency },
         customer
       });
       if (!result || typeof result !== "object") {
@@ -1543,8 +1571,18 @@ function useCheckout(options) {
       setLoading(false);
       isStartingRef.current = false;
     }
-  }, [planRef, productRef, customer, createPayment, updateCustomerRef, loading, _config]);
-  const reset = (0, import_react6.useCallback)(() => {
+  }, [
+    planRef,
+    productRef,
+    currencyOverride,
+    planSelection?.selectedCurrency,
+    customer,
+    createPayment,
+    updateCustomerRef,
+    loading,
+    _config
+  ]);
+  const reset = (0, import_react7.useCallback)(() => {
     isStartingRef.current = false;
     setLoading(false);
     setError(null);
@@ -1584,10 +1622,10 @@ function useCustomer() {
 }
 
 // src/hooks/usePlan.ts
-var import_react8 = require("react");
+var import_react9 = require("react");
 
 // src/hooks/usePlans.ts
-var import_react7 = require("react");
+var import_react8 = require("react");
 var plansCache = /* @__PURE__ */ new Map();
 var CACHE_DURATION2 = 5 * 60 * 1e3;
 function processPlans(raw, filter, sortBy) {
@@ -1617,21 +1655,21 @@ function usePlans(options) {
     initialPlanRef,
     selectionReady = true
   } = options;
-  const solvaContext = (0, import_react7.useContext)(SolvaPayContext);
+  const solvaContext = (0, import_react8.useContext)(SolvaPayContext);
   const config = solvaContext?._config;
-  const effectiveFetcher = (0, import_react7.useMemo)(
+  const effectiveFetcher = (0, import_react8.useMemo)(
     () => fetcher ?? ((ref) => defaultListPlans(ref, config)),
     [fetcher, config]
   );
-  const fetcherRef = (0, import_react7.useRef)(effectiveFetcher);
-  const filterRef = (0, import_react7.useRef)(filter);
-  const sortByRef = (0, import_react7.useRef)(sortBy);
-  const autoSelectFirstPaidRef = (0, import_react7.useRef)(autoSelectFirstPaid);
-  const initialPlanRefRef = (0, import_react7.useRef)(initialPlanRef);
-  const selectionReadyRef = (0, import_react7.useRef)(selectionReady);
-  const hasAppliedInitialRef = (0, import_react7.useRef)(false);
-  const userHasSelectedRef = (0, import_react7.useRef)(false);
-  const [selectedPlanIndex, setSelectedPlanIndexState] = (0, import_react7.useState)(() => {
+  const fetcherRef = (0, import_react8.useRef)(effectiveFetcher);
+  const filterRef = (0, import_react8.useRef)(filter);
+  const sortByRef = (0, import_react8.useRef)(sortBy);
+  const autoSelectFirstPaidRef = (0, import_react8.useRef)(autoSelectFirstPaid);
+  const initialPlanRefRef = (0, import_react8.useRef)(initialPlanRef);
+  const selectionReadyRef = (0, import_react8.useRef)(selectionReady);
+  const hasAppliedInitialRef = (0, import_react8.useRef)(false);
+  const userHasSelectedRef = (0, import_react8.useRef)(false);
+  const [selectedPlanIndex, setSelectedPlanIndexState] = (0, import_react8.useState)(() => {
     if (!selectionReady || !productRef) return 0;
     const cached = plansCache.get(productRef);
     if (!cached || Date.now() - cached.timestamp >= CACHE_DURATION2 || cached.plans.length === 0) {
@@ -1643,7 +1681,7 @@ function usePlans(options) {
     hasAppliedInitialRef.current = true;
     return idx;
   });
-  const [plans, setPlans] = (0, import_react7.useState)(() => {
+  const [plans, setPlans] = (0, import_react8.useState)(() => {
     if (!productRef) return [];
     const cached = plansCache.get(productRef);
     if (!cached || Date.now() - cached.timestamp >= CACHE_DURATION2 || cached.plans.length === 0) {
@@ -1651,31 +1689,31 @@ function usePlans(options) {
     }
     return processPlans(cached.plans, filter, sortBy);
   });
-  const [loading, setLoading] = (0, import_react7.useState)(() => plans.length === 0);
-  const [error, setError] = (0, import_react7.useState)(null);
-  (0, import_react7.useEffect)(() => {
+  const [loading, setLoading] = (0, import_react8.useState)(() => plans.length === 0);
+  const [error, setError] = (0, import_react8.useState)(null);
+  (0, import_react8.useEffect)(() => {
     fetcherRef.current = effectiveFetcher;
   }, [effectiveFetcher]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     filterRef.current = filter;
   }, [filter]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     sortByRef.current = sortBy;
   }, [sortBy]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     autoSelectFirstPaidRef.current = autoSelectFirstPaid;
   }, [autoSelectFirstPaid]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     initialPlanRefRef.current = initialPlanRef;
   }, [initialPlanRef]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     selectionReadyRef.current = selectionReady;
   }, [selectionReady]);
-  const setSelectedPlanIndex = (0, import_react7.useCallback)((index) => {
+  const setSelectedPlanIndex = (0, import_react8.useCallback)((index) => {
     userHasSelectedRef.current = true;
     setSelectedPlanIndexState(index);
   }, []);
-  const applyInitialSelection = (0, import_react7.useCallback)((processedPlans) => {
+  const applyInitialSelection = (0, import_react8.useCallback)((processedPlans) => {
     if (hasAppliedInitialRef.current || userHasSelectedRef.current) return;
     if (!selectionReadyRef.current || processedPlans.length === 0) return;
     hasAppliedInitialRef.current = true;
@@ -1686,7 +1724,7 @@ function usePlans(options) {
     );
     setSelectedPlanIndexState(idx);
   }, []);
-  const fetchPlans = (0, import_react7.useCallback)(
+  const fetchPlans = (0, import_react8.useCallback)(
     async (force = false) => {
       if (!productRef) {
         setError(new Error("Product reference not configured"));
@@ -1749,16 +1787,16 @@ function usePlans(options) {
     },
     [productRef, applyInitialSelection]
   );
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     fetchPlans();
   }, [fetchPlans]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (hasAppliedInitialRef.current || userHasSelectedRef.current) return;
     if (!selectionReady || plans.length === 0) return;
     applyInitialSelection(plans);
   }, [selectionReady, plans, applyInitialSelection]);
-  const selectedPlan = (0, import_react7.useMemo)(() => plans[selectedPlanIndex] || null, [plans, selectedPlanIndex]);
-  const selectPlan = (0, import_react7.useCallback)(
+  const selectedPlan = (0, import_react8.useMemo)(() => plans[selectedPlanIndex] || null, [plans, selectedPlanIndex]);
+  const selectPlan = (0, import_react8.useCallback)(
     (planRef) => {
       const index = plans.findIndex((p) => p.reference === planRef);
       if (index >= 0) {
@@ -1792,7 +1830,8 @@ async function defaultListPlans(productRef, config) {
   const { headers } = await buildRequestHeaders(config);
   const res = await fetchFn(url, { method: "GET", headers });
   if (!res.ok) {
-    const error = new Error(`Failed to fetch plans: ${res.statusText || res.status}`);
+    const message = await readErrorMessage(res, "Failed to fetch plans");
+    const error = new Error(message);
     config?.onError?.(error, "listPlans");
     throw error;
   }
@@ -1804,22 +1843,22 @@ async function defaultListPlans(productRef, config) {
 function usePlan(options) {
   const { planRef, productRef } = options;
   const { _config } = useSolvaPay();
-  const findPlan = (0, import_react8.useCallback)(
+  const findPlan = (0, import_react9.useCallback)(
     (plans) => {
       if (!planRef) return null;
       return plans.find((p) => p.reference === planRef) || null;
     },
     [planRef]
   );
-  const [plan, setPlan] = (0, import_react8.useState)(() => {
+  const [plan, setPlan] = (0, import_react9.useState)(() => {
     if (!planRef || !productRef) return null;
     const cached = plansCache.get(productRef);
     if (!cached || Date.now() - cached.timestamp >= CACHE_DURATION2) return null;
     return findPlan(cached.plans);
   });
-  const [loading, setLoading] = (0, import_react8.useState)(() => !!(planRef && !plan));
-  const [error, setError] = (0, import_react8.useState)(null);
-  const load = (0, import_react8.useCallback)(
+  const [loading, setLoading] = (0, import_react9.useState)(() => !!(planRef && !plan));
+  const [error, setError] = (0, import_react9.useState)(null);
+  const load = (0, import_react9.useCallback)(
     async (force = false) => {
       if (!planRef) {
         setPlan(null);
@@ -1886,7 +1925,7 @@ function usePlan(options) {
     },
     [planRef, productRef, _config, findPlan]
   );
-  (0, import_react8.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     load();
   }, [load]);
   return {
@@ -1898,7 +1937,7 @@ function usePlan(options) {
 }
 
 // src/hooks/useProduct.ts
-var import_react9 = require("react");
+var import_react10 = require("react");
 
 // src/transport/cache-key.ts
 var transportIds = /* @__PURE__ */ new WeakMap();
@@ -1934,16 +1973,16 @@ async function fetchProduct(productRef, config) {
 function useProduct(productRef) {
   const { _config } = useSolvaPay();
   const cacheKey2 = productRef ? cacheKeyFor(_config, productRef) : "";
-  const [product, setProduct] = (0, import_react9.useState)(
+  const [product, setProduct] = (0, import_react10.useState)(
     () => productRef ? productCache.get(cacheKey2)?.product ?? null : null
   );
-  const [loading, setLoading] = (0, import_react9.useState)(() => {
+  const [loading, setLoading] = (0, import_react10.useState)(() => {
     if (!productRef) return false;
     const cached = productCache.get(cacheKey2);
     return !cached || !cached.product && !cached.promise;
   });
-  const [error, setError] = (0, import_react9.useState)(null);
-  const load = (0, import_react9.useCallback)(
+  const [error, setError] = (0, import_react10.useState)(null);
+  const load = (0, import_react10.useCallback)(
     async (force = false) => {
       if (!productRef) {
         setProduct(null);
@@ -2004,7 +2043,7 @@ function useProduct(productRef) {
     },
     [productRef, _config]
   );
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     load();
   }, [load]);
   return {
@@ -2016,14 +2055,14 @@ function useProduct(productRef) {
 }
 
 // src/hooks/useActivation.ts
-var import_react10 = require("react");
+var import_react11 = require("react");
 function useActivation() {
   const { activatePlan } = useSolvaPay();
   const copy = useCopy();
-  const [state, setState] = (0, import_react10.useState)("idle");
-  const [error, setError] = (0, import_react10.useState)(null);
-  const [result, setResult] = (0, import_react10.useState)(null);
-  const activate = (0, import_react10.useCallback)(
+  const [state, setState] = (0, import_react11.useState)("idle");
+  const [error, setError] = (0, import_react11.useState)(null);
+  const [result, setResult] = (0, import_react11.useState)(null);
+  const activate = (0, import_react11.useCallback)(
     async (params) => {
       setState("activating");
       setError(null);
@@ -2058,7 +2097,7 @@ function useActivation() {
     },
     [activatePlan, copy]
   );
-  const reset = (0, import_react10.useCallback)(() => {
+  const reset = (0, import_react11.useCallback)(() => {
     setState("idle");
     setError(null);
     setResult(null);
@@ -2066,18 +2105,6 @@ function useActivation() {
   return { activate, state, error, result, reset };
 }
 
-// src/components/PlanSelectionContext.tsx
-var import_react11 = require("react");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var PlanSelectionContext = (0, import_react11.createContext)(null);
-var PlanSelectionProvider = ({
-  value,
-  children
-}) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PlanSelectionContext.Provider, { value, children });
-function usePlanSelection() {
-  return (0, import_react11.useContext)(PlanSelectionContext);
-}
-
 // src/components/PaymentFormContext.tsx
 var import_react12 = require("react");
 var import_jsx_runtime6 = require("react/jsx-runtime");
@@ -2126,7 +2153,7 @@ function toMajorUnits(amountMinor, currency) {
   return fractionDigits === 0 ? amountMinor : amountMinor / 100;
 }
 function formatPrice(amountMinor, currency, opts = {}) {
-  const { locale, interval, intervalCount = 1, free = "Free" } = opts;
+  const { locale, interval, intervalCount = 1, free = "Free", currencyDisplay } = opts;
   if (amountMinor === 0 && free !== "") {
     return free;
   }
@@ -2135,12 +2162,16 @@ function formatPrice(amountMinor, currency, opts = {}) {
   const isWhole = amountMinor % minorPerMajor === 0;
   const fractionDigits = isWhole ? 0 : naturalFractionDigits;
   const major = toMajorUnits(amountMinor, currency);
-  const formatter = new Intl.NumberFormat(locale, {
+  const formatterOptions = {
     style: "currency",
     currency: currency.toUpperCase(),
     minimumFractionDigits: fractionDigits,
     maximumFractionDigits: fractionDigits
-  });
+  };
+  if (currencyDisplay) {
+    formatterOptions.currencyDisplay = currencyDisplay;
+  }
+  const formatter = new Intl.NumberFormat(locale, formatterOptions);
   const formatted = formatter.format(major);
   if (!interval) return formatted;
   const suffix = intervalCount > 1 ? `${intervalCount} ${interval}s` : interval;
@@ -4376,6 +4407,28 @@ function isPaygPlan(plan) {
   return type === "usage-based" || type === "hybrid";
 }
 
+// src/utils/planPricing.ts
+function getPlanPricingOptions(plan) {
+  if (plan.pricingOptions && plan.pricingOptions.length > 0) {
+    return plan.pricingOptions;
+  }
+  return [
+    {
+      currency: plan.currency ?? "USD",
+      price: plan.price ?? 0,
+      default: true
+    }
+  ];
+}
+function resolvePlanPricingOption(plan, currency) {
+  const options = getPlanPricingOptions(plan);
+  if (currency) {
+    const match = options.find((option) => option.currency.toUpperCase() === currency.toUpperCase());
+    if (match) return match;
+  }
+  return options.find((option) => option.default) ?? options[0];
+}
+
 // src/primitives/PlanSelector.tsx
 var import_jsx_runtime20 = require("react/jsx-runtime");
 var PlanSelectorContext = (0, import_react26.createContext)(null);
@@ -4456,6 +4509,23 @@ var Root6 = (0, import_react26.forwardRef)(function PlanSelectorRoot(props, forw
     setSelectedPlanIndex(-1);
   }, [setSelectedPlanIndex]);
   const selectedPlanRef = selectedPlan?.reference ?? null;
+  const [preferredCurrency, setPreferredCurrencyState] = (0, import_react26.useState)(null);
+  const [selectedCurrencies, setSelectedCurrencies] = (0, import_react26.useState)({});
+  const getSelectedOption = (0, import_react26.useCallback)(
+    (plan) => resolvePlanPricingOption(
+      plan,
+      selectedCurrencies[plan.reference] ?? preferredCurrency ?? null
+    ),
+    [selectedCurrencies, preferredCurrency]
+  );
+  const setPreferredCurrency = (0, import_react26.useCallback)((currency) => {
+    setPreferredCurrencyState(currency.toUpperCase());
+    setSelectedCurrencies({});
+  }, []);
+  const setPlanCurrency = (0, import_react26.useCallback)((planRef, currency) => {
+    setSelectedCurrencies((current) => ({ ...current, [planRef]: currency }));
+  }, []);
+  const selectedCurrency = selectedPlan ? getSelectedOption(selectedPlan).currency : null;
   const autoCurrentAppliedKeyRef = (0, import_react26.useRef)(null);
   (0, import_react26.useEffect)(() => {
     if (autoCurrentAppliedKeyRef.current === productRef) return;
@@ -4485,7 +4555,12 @@ var Root6 = (0, import_react26.forwardRef)(function PlanSelectorRoot(props, forw
       isFree,
       isPopular,
       select,
-      clearSelection
+      clearSelection,
+      preferredCurrency,
+      setPreferredCurrency,
+      selectedCurrencies,
+      setPlanCurrency,
+      getSelectedOption
     }),
     [
       plans,
@@ -4499,7 +4574,12 @@ var Root6 = (0, import_react26.forwardRef)(function PlanSelectorRoot(props, forw
       isFree,
       isPopular,
       select,
-      clearSelection
+      clearSelection,
+      preferredCurrency,
+      setPreferredCurrency,
+      selectedCurrencies,
+      setPlanCurrency,
+      getSelectedOption
     ]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
@@ -4511,6 +4591,12 @@ var Root6 = (0, import_react26.forwardRef)(function PlanSelectorRoot(props, forw
         setSelectedPlanRef: (ref) => {
           if (ref) select(ref);
         },
+        selectedCurrency,
+        setSelectedCurrency: (currency) => {
+          if (currency) {
+            setPreferredCurrency(currency);
+          }
+        },
         plans,
         loading,
         error
@@ -4535,14 +4621,19 @@ var Grid = (0, import_react26.forwardRef)(function PlanSelectorGrid({ children,
     const isPaygCurrent = isCurrent && isPaygPlan(plan);
     const disabled = isFree || isCurrent && !isPaygCurrent;
     const state = isCurrent && !isPaygCurrent ? "current" : selected ? "selected" : isCurrent ? "current" : isFree ? "disabled" : "idle";
+    const pricingOptions = getPlanPricingOptions(plan);
+    const selectedOption = ctx.getSelectedOption(plan);
     const cardCtx = {
       plan,
+      selectedOption,
+      pricingOptions,
       state,
       isCurrent,
       isFree,
       isPopular,
       disabled,
-      select: () => ctx.select(plan.reference)
+      select: () => ctx.select(plan.reference),
+      setCurrency: (currency) => ctx.setPlanCurrency(plan.reference, currency)
     };
     return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CardContext.Provider, { value: cardCtx, children }, plan.reference);
   }) });
@@ -4594,26 +4685,20 @@ var CardPrice = (0, import_react26.forwardRef)(function PlanSelectorCardPrice({
   const formatted = (0, import_react26.useMemo)(() => {
     if (card.isFree) return copy.planSelector.freeBadge;
     if (card.plan.type === "usage-based") {
-      const creditsPerUnit = card.plan.creditsPerUnit ?? 1;
-      const perCallMinor = Math.max(1, Math.round(1 / creditsPerUnit));
-      const rate = formatPrice(perCallMinor, card.plan.currency ?? "usd", {
-        locale,
-        free: ""
-      });
-      return `${rate} / call`;
+      return copy.planSelector.usageRateLabel;
     }
-    return formatPrice(card.plan.price ?? 0, card.plan.currency ?? "usd", {
+    return formatPrice(card.selectedOption.price ?? 0, card.selectedOption.currency ?? "usd", {
       locale,
       free: copy.interval.free
     });
   }, [
     card.isFree,
     card.plan.type,
-    card.plan.price,
-    card.plan.currency,
-    card.plan.creditsPerUnit,
+    card.selectedOption.price,
+    card.selectedOption.currency,
     locale,
     copy.planSelector.freeBadge,
+    copy.planSelector.usageRateLabel,
     copy.interval.free
   ]);
   const Comp = asChild ? Slot : "span";
@@ -4638,6 +4723,57 @@ function normalizeBillingCycle(cycle) {
   if (lc === "daily" || lc === "day") return "day";
   return cycle;
 }
+var CurrencySwitcher = (0, import_react26.forwardRef)(function PlanSelectorCurrencySwitcher({ children, onChange, className, ...rest }, forwardedRef) {
+  const ctx = usePlanSelectorContext("CurrencySwitcher");
+  const availableCurrencies = (0, import_react26.useMemo)(() => {
+    const currencies = /* @__PURE__ */ new Set();
+    for (const plan of ctx.plans) {
+      const options = getPlanPricingOptions(plan);
+      if (options.length <= 1) continue;
+      for (const option of options) {
+        currencies.add(option.currency.toUpperCase());
+      }
+    }
+    return [...currencies].sort();
+  }, [ctx.plans]);
+  if (availableCurrencies.length < 2) return null;
+  const effectiveCurrency = ctx.preferredCurrency ?? (ctx.selectedPlan ? ctx.getSelectedOption(ctx.selectedPlan).currency.toUpperCase() : null) ?? availableCurrencies[0];
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    "select",
+    {
+      ref: forwardedRef,
+      "data-solvapay-plan-selector-currency-switcher": "",
+      className,
+      value: effectiveCurrency,
+      onChange: (event) => {
+        ctx.setPreferredCurrency(event.target.value);
+        onChange?.(event);
+      },
+      ...rest,
+      children: children ?? availableCurrencies.map((currency) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("option", { value: currency, children: currency }, currency))
+    }
+  );
+});
+var CardCurrency = (0, import_react26.forwardRef)(
+  function PlanSelectorCardCurrency({ children, onChange, ...rest }, forwardedRef) {
+    const card = useCardContext("CardCurrency");
+    if (card.pricingOptions.length <= 1) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      "select",
+      {
+        ref: forwardedRef,
+        "data-solvapay-plan-selector-card-currency": "",
+        value: card.selectedOption.currency,
+        onChange: (event) => {
+          card.setCurrency(event.target.value);
+          onChange?.(event);
+        },
+        ...rest,
+        children: children ?? card.pricingOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("option", { value: option.currency, children: option.currency }, option.currency))
+      }
+    );
+  }
+);
 var CardBadge = (0, import_react26.forwardRef)(function PlanSelectorCardBadge({ asChild, children, ...rest }, forwardedRef) {
   const card = useCardContext("CardBadge");
   const copy = useCopy();
@@ -4683,6 +4819,8 @@ var PlanSelector = {
   CardName,
   CardPrice,
   CardInterval,
+  CurrencySwitcher,
+  CardCurrency,
   CardBadge,
   Loading: Loading4,
   Error: ErrorSlot4
@@ -4695,6 +4833,7 @@ function usePlanSelector() {
 var import_jsx_runtime21 = require("react/jsx-runtime");
 var DefaultTree2 = () => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
   /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PlanSelector.Heading, { className: "solvapay-plan-selector-heading" }),
+  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PlanSelector.CurrencySwitcher, { className: "solvapay-plan-selector-currency-switcher" }),
   /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PlanSelector.Grid, { className: "solvapay-plan-selector-grid", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(PlanSelector.Card, { className: "solvapay-plan-selector-card", children: [
     /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PlanSelector.CardBadge, { className: "solvapay-plan-selector-card-badge" }),
     /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PlanSelector.CardName, { className: "solvapay-plan-selector-card-name" }),
@@ -6921,21 +7060,21 @@ function buildDefaultCheckoutPlanFilter(allPlans) {
     return true;
   };
 }
-function formatContinueLabel(plan, locale) {
+function formatContinueLabel(plan, locale, pricingOption) {
   if (!plan) return "Continue";
   if (isPayg(plan)) {
     return `Continue with ${plan.name ?? "Pay as you go"}`;
   }
-  const currency = (plan.currency ?? "USD").toUpperCase();
-  const priceLabel = formatPrice(plan.price ?? 0, currency, { locale });
+  const option = pricingOption ?? resolvePlanPricingOption(plan, null);
+  const currency = option.currency.toUpperCase();
+  const priceLabel = formatPrice(option.price ?? 0, currency, { locale });
   const cycle = plan.billingCycle ? `/${shortCycle(plan.billingCycle)}` : "";
   return `Continue with ${plan.name ?? "Plan"} \u2014 ${priceLabel}${cycle}`;
 }
 function formatPaygRate(plan, locale) {
-  const currency = (plan.currency ?? "USD").toUpperCase();
   const creditsPerUnit = plan.creditsPerUnit ?? 1;
-  const perCreditMinor = Math.max(1, Math.round(1 / creditsPerUnit));
-  return `${formatPrice(perCreditMinor, currency, { locale })} / call`;
+  const creditLabel = creditsPerUnit === 1 ? "credit" : "credits";
+  return `${creditsPerUnit.toLocaleString(locale)} ${creditLabel} / call`;
 }
 function inferIncludedCredits(plan) {
   const price = plan.price ?? 0;
@@ -6970,14 +7109,31 @@ function useCheckoutFlow(opts) {
   onPurchaseSuccessRef.current = opts.onPurchaseSuccess;
   onErrorRef.current = opts.onError;
   const planCtx = usePlanSelector();
+  const planSelection = usePlanSelection();
   const transport = useTransport();
   const locale = useLocale();
   const balance = useBalance();
   const { creditsPerMinorUnit, displayExchangeRate, adjustBalance } = balance;
   const { refetchPurchase } = useSolvaPay();
   const { merchant } = useMerchant();
-  const topupCurrency = opts.topupCurrency?.toUpperCase() ?? merchant?.defaultCurrency?.toUpperCase() ?? null;
+  const [topupCurrencyOverride, setTopupCurrencyOverride] = (0, import_react44.useState)(null);
+  const topupCurrencies = (0, import_react44.useMemo)(() => {
+    const fromMerchant = (merchant?.supportedTopupCurrencies ?? []).map((code) => code.toUpperCase()).filter(Boolean);
+    const fallback = opts.topupCurrency?.toUpperCase() ?? merchant?.defaultCurrency?.toUpperCase() ?? null;
+    const list = fromMerchant.length > 0 ? fromMerchant : fallback ? [fallback] : [];
+    return Array.from(new Set(list));
+  }, [merchant?.supportedTopupCurrencies, merchant?.defaultCurrency, opts.topupCurrency]);
+  const resolvedDefaultTopupCurrency = opts.topupCurrency?.toUpperCase() ?? merchant?.defaultCurrency?.toUpperCase() ?? null;
+  const planPickerCurrency = planCtx.preferredCurrency?.toUpperCase() ?? null;
+  const topupCurrency = (topupCurrencyOverride && topupCurrencies.includes(topupCurrencyOverride) ? topupCurrencyOverride : null) ?? (planPickerCurrency && topupCurrencies.includes(planPickerCurrency) ? planPickerCurrency : null) ?? resolvedDefaultTopupCurrency;
   const topupCurrencyReady = topupCurrency != null;
+  const setTopupCurrency = (0, import_react44.useCallback)(
+    (code) => {
+      const normalized = code.toUpperCase();
+      setTopupCurrencyOverride(normalized);
+    },
+    []
+  );
   const [step, setStep] = (0, import_react44.useState)(initialStep);
   const [status, setStatus] = (0, import_react44.useState)("idle");
   const [selectedAmountMinor, setSelectedAmountMinor] = (0, import_react44.useState)(initialAmountMinor);
@@ -7075,19 +7231,23 @@ function useCheckoutFlow(opts) {
   );
   const recordRecurringSuccess = (0, import_react44.useCallback)(() => {
     if (!selectedPlanShape) return;
-    const currency = (selectedPlanShape.currency ?? "USD").toUpperCase();
+    const pricingOption = selectedPlan ? resolvePlanPricingOption(selectedPlan, planSelection?.selectedCurrency) : {
+      currency: selectedPlanShape.currency ?? "USD",
+      price: selectedPlanShape.price ?? 0
+    };
+    const currency = pricingOption.currency.toUpperCase();
     const meta = {
       branch: "recurring",
       plan: selectedPlanShape,
       creditsIncluded: inferIncludedCredits(selectedPlanShape),
-      chargedTodayMinor: selectedPlanShape.price ?? 0,
+      chargedTodayMinor: pricingOption.price ?? 0,
       currency,
       nextRenewalLabel: null
     };
     setSuccessMeta(meta);
     setStep("success");
     onPurchaseSuccessRef.current?.(meta);
-  }, [selectedPlanShape]);
+  }, [selectedPlanShape, selectedPlan, planSelection?.selectedCurrency]);
   const advance = (0, import_react44.useCallback)(async () => {
     if (step === "plan") {
       await advanceFromPlan();
@@ -7133,6 +7293,7 @@ function useCheckoutFlow(opts) {
     setSuccessMeta(null);
     setError(null);
     setStatus("idle");
+    setTopupCurrencyOverride(null);
   }, []);
   const retry = (0, import_react44.useCallback)(async () => {
     if (status !== "error") return;
@@ -7162,6 +7323,8 @@ function useCheckoutFlow(opts) {
       branch,
       topupCurrency,
       topupCurrencyReady,
+      topupCurrencies,
+      setTopupCurrency,
       canGoBack,
       selectPlan,
       selectAmount,
@@ -7182,6 +7345,8 @@ function useCheckoutFlow(opts) {
       branch,
       topupCurrency,
       topupCurrencyReady,
+      topupCurrencies,
+      setTopupCurrency,
       canGoBack,
       selectPlan,
       selectAmount,
@@ -8029,6 +8194,28 @@ var CheckoutSteps = {
   Success
 };
 
+// src/adapters/session-auth.ts
+var DEFAULT_SENTINEL = "session-authenticated";
+async function resolveValue(value) {
+  return value;
+}
+function createSessionAuthAdapter(options) {
+  const sentinel = options.sentinelToken ?? DEFAULT_SENTINEL;
+  return {
+    async getToken() {
+      if (options.getToken) {
+        return resolveValue(options.getToken());
+      }
+      const userId = await resolveValue(options.getUserId());
+      return userId ? sentinel : null;
+    },
+    async getUserId() {
+      return resolveValue(options.getUserId());
+    },
+    subscribe: options.subscribe
+  };
+}
+
 // src/transport/types.ts
 var UnsupportedTransportMethodError = class extends Error {
   method;
@@ -8071,6 +8258,7 @@ var UnsupportedTransportMethodError = class extends Error {
   confirmPayment,
   createAnonymousAuthAdapter,
   createHttpTransport,
+  createSessionAuthAdapter,
   defaultAuthAdapter,
   deriveVariant,
   enCopy,