@solvapay/react 2.1.1 → 2.2.0-preview-e3e546693c002c32f128d83bf6c5fe76ac182a79

package/dist/{chunk-HQH6KSXJ.js → chunk-X65JBC2A.js}

@@ -1,6 +1,5 @@
 import {
   AmountPicker,
-  CACHE_DURATION,
   MandateText,
   MissingProductRefError,
   MissingProviderError,
@@ -10,37 +9,44 @@ import {
   SolvaPayContext,
   Spinner,
   TopupForm,
-  autoRechargeCache,
-  autoRechargeCacheKeyFor,
   buildDefaultCheckoutPlanFilter,
+  buildSummaryLine,
   composeEventHandlers,
-  createHttpTransport,
+  configToForm,
+  createDefaultAutoRechargeForm,
+  effectiveMonthlySpend,
+  estimateCredits,
+  estimateCurrencyMajorFromCredits,
+  flipUnitValue,
   formatContinueLabel,
+  formatCycleSuffix,
   formatPrice,
   getMinorUnitsPerMajor,
   interpolate,
+  isMonthlySpendCapReached,
   isPaygPlan,
+  planBillingCycle,
   planBillingInterval,
   planSortByPaygFirstThenAsc,
-  shortCycle,
-  subscribeAutoRecharge,
   useActivation,
   useAmountPicker,
   useAmountPickerCopy,
+  useAutoRecharge,
   useBalance,
   useCheckoutFlow,
   useCopy,
+  useExternalLinkClick,
   useLocale,
   usePlan,
   usePlanSelection,
   usePlans,
   useProduct,
   usePurchase,
-  useSolvaPay,
+  usePurchaseActions,
   useTopupAmountSelector,
-  withPaymentElementDefaults,
-  writeAutoRechargeCache
-} from "./chunk-LL6AYSTC.js";
+  validateAutoRechargeForm,
+  withPaymentElementDefaults
+} from "./chunk-VTGYZIE2.js";
 
 // src/TopupForm.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -470,23 +476,99 @@ function useActivationFlow() {
   return useFlowCtx("useActivationFlow");
 }
 
+// src/primitives/CancelPlanButton.tsx
+import { countsUsage } from "@solvapay/core";
+import { forwardRef as forwardRef4, useCallback as useCallback2, useContext as useContext4, useMemo as useMemo3 } from "react";
+import { Fragment as Fragment3, jsx as jsx5 } from "react/jsx-runtime";
+function resolveConfirmText(confirm, purchase, defaults) {
+  if (confirm === false) return null;
+  if (typeof confirm === "string") return confirm;
+  const isUsageBased = (countsUsage(purchase?.planSnapshot) || purchase?.planSnapshot?.isMetered === true) && purchase?.isRecurring !== true;
+  if (isUsageBased) return defaults.usageBased;
+  return defaults.recurring;
+}
+var CancelPlanButton = forwardRef4(
+  function CancelPlanButton2({
+    asChild,
+    purchaseRef,
+    reason,
+    confirm = true,
+    onCancelled,
+    onError,
+    onClick,
+    children,
+    ...rest
+  }, forwardedRef) {
+    const solva = useContext4(SolvaPayContext);
+    if (!solva) throw new MissingProviderError("CancelPlanButton");
+    const copy = useCopy();
+    const { activePurchase } = usePurchase();
+    const { cancelRenewal, isCancelling } = usePurchaseActions();
+    const effectivePurchase = useMemo3(
+      () => purchaseRef ? activePurchase && activePurchase.reference === purchaseRef ? activePurchase : { reference: purchaseRef } : activePurchase,
+      [purchaseRef, activePurchase]
+    );
+    const effectiveRef = purchaseRef ?? effectivePurchase?.reference;
+    const cancel = useCallback2(async () => {
+      if (!effectiveRef) return;
+      const confirmText = resolveConfirmText(confirm, effectivePurchase, {
+        recurring: copy.cancelPlan.confirmRecurring,
+        usageBased: copy.cancelPlan.confirmUsageBased
+      });
+      if (confirmText && typeof window !== "undefined" && !window.confirm(confirmText)) {
+        return;
+      }
+      try {
+        await cancelRenewal({ purchaseRef: effectiveRef, reason });
+        onCancelled?.();
+      } catch (err) {
+        onError?.(err instanceof Error ? err : new Error(String(err)));
+      }
+    }, [effectiveRef, effectivePurchase, confirm, copy, cancelRenewal, reason, onCancelled, onError]);
+    if (effectivePurchase?.status === "active" && effectivePurchase.cancelledAt) {
+      return null;
+    }
+    const disabled = isCancelling || !effectiveRef;
+    const state = isCancelling ? "cancelling" : "idle";
+    const commonProps = {
+      "data-solvapay-cancel-plan": "",
+      "data-state": state,
+      "aria-busy": isCancelling,
+      "aria-disabled": disabled || void 0,
+      disabled,
+      onClick: composeEventHandlers(onClick, () => {
+        void cancel();
+      }),
+      ...rest
+    };
+    const label = isCancelling ? copy.cancelPlan.buttonLoading : copy.cancelPlan.button;
+    if (asChild) {
+      return (
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        /* @__PURE__ */ jsx5(Slot, { ref: forwardedRef, ...commonProps, children: children ?? /* @__PURE__ */ jsx5(Fragment3, { children: label }) })
+      );
+    }
+    return /* @__PURE__ */ jsx5("button", { ref: forwardedRef, type: "button", ...commonProps, children: children ?? label });
+  }
+);
+
 // src/primitives/CreditGate.tsx
 import {
   createContext as createContext3,
-  forwardRef as forwardRef4,
-  useContext as useContext4,
-  useMemo as useMemo3
+  forwardRef as forwardRef5,
+  useContext as useContext5,
+  useMemo as useMemo4
 } from "react";
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx6 } from "react/jsx-runtime";
 var CreditGateContext = createContext3(null);
 function useGateCtx2(part) {
-  const ctx = useContext4(CreditGateContext);
+  const ctx = useContext5(CreditGateContext);
   if (!ctx) {
     throw new Error(`CreditGate.${part} must be rendered inside <CreditGate.Root>.`);
   }
   return ctx;
 }
-var Root3 = forwardRef4(function CreditGateRoot({
+var Root3 = forwardRef5(function CreditGateRoot({
   minCredits = 1,
   productRef,
   topupAmount = 1e3,
@@ -495,13 +577,13 @@ var Root3 = forwardRef4(function CreditGateRoot({
   children,
   ...rest
 }, forwardedRef) {
-  const solva = useContext4(SolvaPayContext);
+  const solva = useContext5(SolvaPayContext);
   if (!solva) throw new MissingProviderError("CreditGate");
   const { credits, loading } = useBalance();
   const { product } = useProduct(productRef);
   const hasCredits = credits != null && credits >= minCredits;
   const state = loading && credits == null ? "loading" : hasCredits ? "allowed" : "blocked";
-  const ctx = useMemo3(
+  const ctx = useMemo4(
     () => ({
       state,
       loading,
@@ -514,7 +596,7 @@ var Root3 = forwardRef4(function CreditGateRoot({
     [state, loading, hasCredits, credits, product?.name, topupAmount, topupCurrency]
   );
   const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ jsx5(CreditGateContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(CreditGateContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx6(
     Comp,
     {
       ref: forwardedRef,
@@ -525,14 +607,14 @@ var Root3 = forwardRef4(function CreditGateRoot({
     }
   ) });
 });
-var Heading = forwardRef4(function CreditGateHeading({ asChild, children, ...rest }, forwardedRef) {
+var Heading = forwardRef5(function CreditGateHeading({ asChild, children, ...rest }, forwardedRef) {
   const ctx = useGateCtx2("Heading");
   const copy = useCopy();
   if (ctx.state !== "blocked") return null;
   const Comp = asChild ? Slot : "h3";
-  return /* @__PURE__ */ jsx5(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-heading": "", ...rest, children: children ?? copy.creditGate.lowBalanceHeading });
+  return /* @__PURE__ */ jsx6(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-heading": "", ...rest, children: children ?? copy.creditGate.lowBalanceHeading });
 });
-var Subheading = forwardRef4(function CreditGateSubheading({ asChild, children, ...rest }, forwardedRef) {
+var Subheading = forwardRef5(function CreditGateSubheading({ asChild, children, ...rest }, forwardedRef) {
   const ctx = useGateCtx2("Subheading");
   const copy = useCopy();
   if (ctx.state !== "blocked") return null;
@@ -540,12 +622,12 @@ var Subheading = forwardRef4(function CreditGateSubheading({ asChild, children,
     product: ctx.productName ?? "this product"
   });
   const Comp = asChild ? Slot : "p";
-  return /* @__PURE__ */ jsx5(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-subheading": "", ...rest, children: children ?? text });
+  return /* @__PURE__ */ jsx6(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-subheading": "", ...rest, children: children ?? text });
 });
 var Topup = ({ amount, currency }) => {
   const ctx = useGateCtx2("Topup");
   if (ctx.state !== "blocked") return null;
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     TopupForm2,
     {
       amount: amount ?? ctx.topupAmount,
@@ -553,21 +635,21 @@ var Topup = ({ amount, currency }) => {
     }
   );
 };
-var Loading3 = forwardRef4(function CreditGateLoading({ asChild, children, ...rest }, forwardedRef) {
+var Loading3 = forwardRef5(function CreditGateLoading({ asChild, children, ...rest }, forwardedRef) {
   const ctx = useGateCtx2("Loading");
   if (ctx.state !== "loading") return null;
   const Comp = asChild ? Slot : "div";
   return (
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    /* @__PURE__ */ jsx5(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-loading": "", ...rest, children })
+    /* @__PURE__ */ jsx6(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-loading": "", ...rest, children })
   );
 });
-var ErrorSlot3 = forwardRef4(function CreditGateError({ asChild, children, ...rest }, forwardedRef) {
+var ErrorSlot3 = forwardRef5(function CreditGateError({ asChild, children, ...rest }, forwardedRef) {
   if (!children) return null;
   const Comp = asChild ? Slot : "div";
   return (
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    /* @__PURE__ */ jsx5(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-error": "", role: "alert", ...rest, children })
+    /* @__PURE__ */ jsx6(Comp, { ref: forwardedRef, "data-solvapay-credit-gate-error": "", role: "alert", ...rest, children })
   );
 });
 var CreditGateRoot2 = Root3;
@@ -588,510 +670,17 @@ function useCreditGate() {
   return useGateCtx2("useCreditGate");
 }
 
-// src/hooks/useAutoRecharge.ts
-import { useCallback as useCallback2, useEffect as useEffect3, useRef as useRef2, useState as useState3 } from "react";
-function mergeAutoRechargeConfig(config, display) {
-  return display ? { ...config, display } : config;
-}
-async function fetchAutoRecharge(config) {
-  const transport = config?.transport ?? createHttpTransport(config);
-  if (!transport.getAutoRecharge) return null;
-  const response = await transport.getAutoRecharge();
-  if (!response.config) return null;
-  return mergeAutoRechargeConfig(response.config, response.display);
-}
-function useAutoRecharge() {
-  const { _config } = useSolvaPay();
-  const key = autoRechargeCacheKeyFor(_config);
-  const [config, setConfig] = useState3(
-    () => autoRechargeCache.get(key)?.config ?? null
-  );
-  const [loading, setLoading] = useState3(() => {
-    const cached = autoRechargeCache.get(key);
-    return !cached || !cached.config && !cached.promise;
-  });
-  const [saving, setSaving] = useState3(false);
-  const [disabling, setDisabling] = useState3(false);
-  const [error, setError] = useState3(null);
-  const requestSeq = useRef2(0);
-  const load = useCallback2(
-    async (force = false) => {
-      const seq = requestSeq.current;
-      const cached = autoRechargeCache.get(key);
-      const now = Date.now();
-      if (!force && cached?.config && now - cached.timestamp < CACHE_DURATION) {
-        if (seq !== requestSeq.current) return;
-        setConfig(cached.config);
-        setLoading(false);
-        setError(null);
-        return;
-      }
-      if (!force && cached?.promise) {
-        setLoading(true);
-        try {
-          const value = await cached.promise;
-          if (seq !== requestSeq.current) return;
-          setConfig(value);
-          setError(null);
-        } catch (caught) {
-          if (seq !== requestSeq.current) return;
-          setError(caught instanceof Error ? caught : new Error(String(caught)));
-        } finally {
-          if (seq === requestSeq.current) {
-            setLoading(false);
-          }
-        }
-        return;
-      }
-      setLoading(true);
-      setError(null);
-      const promise = fetchAutoRecharge(_config);
-      writeAutoRechargeCache(key, {
-        config: cached?.config ?? null,
-        promise,
-        timestamp: now
-      });
-      try {
-        const value = await promise;
-        if (seq !== requestSeq.current) return;
-        writeAutoRechargeCache(key, { config: value, promise: null, timestamp: Date.now() });
-        setConfig(value);
-      } catch (caught) {
-        if (seq !== requestSeq.current) return;
-        const err = caught instanceof Error ? caught : new Error(String(caught));
-        writeAutoRechargeCache(key, {
-          config: cached?.config ?? null,
-          promise: null,
-          timestamp: Date.now()
-        });
-        setError(err);
-      } finally {
-        if (seq === requestSeq.current) {
-          setLoading(false);
-        }
-      }
-    },
-    [_config, key]
-  );
-  useEffect3(() => {
-    void load();
-  }, [load]);
-  useEffect3(() => {
-    return subscribeAutoRecharge(key, () => {
-      const cached = autoRechargeCache.get(key);
-      if (cached) {
-        setConfig(cached.config);
-        return;
-      }
-      void load(true);
-    });
-  }, [key, load]);
-  const refresh = useCallback2(
-    async (force = true) => {
-      await load(force);
-    },
-    [load]
-  );
-  const save = useCallback2(
-    async (input) => {
-      const transport = _config?.transport ?? createHttpTransport(_config);
-      if (!transport.saveAutoRecharge) {
-        throw new Error("saveAutoRecharge is not available on this transport");
-      }
-      setSaving(true);
-      setError(null);
-      const seq = ++requestSeq.current;
-      try {
-        const result = await transport.saveAutoRecharge(input);
-        if (seq !== requestSeq.current) return result;
-        const nextConfig = mergeAutoRechargeConfig(result.config, result.display);
-        writeAutoRechargeCache(key, {
-          config: nextConfig,
-          promise: null,
-          timestamp: Date.now()
-        });
-        setConfig(nextConfig);
-        return result;
-      } catch (caught) {
-        const err = caught instanceof Error ? caught : new Error(String(caught));
-        setError(err);
-        throw err;
-      } finally {
-        setSaving(false);
-      }
-    },
-    [_config, key]
-  );
-  const disable = useCallback2(async () => {
-    const transport = _config?.transport ?? createHttpTransport(_config);
-    if (!transport.disableAutoRecharge) {
-      throw new Error("disableAutoRecharge is not available on this transport");
-    }
-    setDisabling(true);
-    setError(null);
-    const seq = ++requestSeq.current;
-    try {
-      const result = await transport.disableAutoRecharge();
-      if (seq === requestSeq.current) {
-        setConfig((current) => {
-          const disabledConfig = current ? { ...current, enabled: false } : null;
-          writeAutoRechargeCache(key, {
-            config: disabledConfig,
-            promise: null,
-            timestamp: Date.now()
-          });
-          return disabledConfig;
-        });
-        await refresh(true);
-        setConfig((current) => {
-          const disabledConfig = current ? { ...current, enabled: false } : null;
-          writeAutoRechargeCache(key, {
-            config: disabledConfig,
-            promise: null,
-            timestamp: Date.now()
-          });
-          return disabledConfig;
-        });
-      }
-      return result;
-    } catch (caught) {
-      const err = caught instanceof Error ? caught : new Error(String(caught));
-      setError(err);
-      throw err;
-    } finally {
-      setDisabling(false);
-    }
-  }, [_config, key, refresh]);
-  return { config, loading, saving, disabling, error, refresh, save, disable };
-}
-
-// src/utils/credit-estimation.ts
-import { creditsToDisplayMinorUnits } from "@solvapay/core";
-function estimateCredits(resolvedAmountMajor, currency, creditsPerMinorUnit, displayExchangeRate) {
-  if (resolvedAmountMajor == null || resolvedAmountMajor <= 0) return null;
-  if (creditsPerMinorUnit == null || creditsPerMinorUnit <= 0) return null;
-  const rate = displayExchangeRate ?? 1;
-  const resolvedAmountMinor = Math.round(resolvedAmountMajor * getMinorUnitsPerMajor(currency));
-  return Math.round(resolvedAmountMinor / rate * creditsPerMinorUnit);
-}
-function estimateCurrencyMajorFromCredits(credits, currency, creditsPerMinorUnit, displayExchangeRate) {
-  if (credits == null || credits <= 0) return null;
-  if (creditsPerMinorUnit == null || creditsPerMinorUnit <= 0) return null;
-  const rate = displayExchangeRate ?? 1;
-  const displayMinor = creditsToDisplayMinorUnits({
-    credits,
-    creditsPerMinorUnit,
-    displayExchangeRate: rate,
-    displayCurrency: currency
-  });
-  if (displayMinor === null) return null;
-  return displayMinor / getMinorUnitsPerMajor(currency);
-}
-
-// src/helpers/stripe-minimums.ts
-var STRIPE_MINIMUM_MINOR = {
-  USD: 50,
-  EUR: 50,
-  GBP: 30,
-  SEK: 300,
-  NOK: 300,
-  DKK: 250,
-  CHF: 50,
-  CAD: 50,
-  AUD: 50,
-  JPY: 50,
-  KRW: 500
-};
-var DEFAULT_MINIMUM_MINOR = 50;
-function getStripeMinimumMinor(currency) {
-  return STRIPE_MINIMUM_MINOR[currency.toUpperCase()] ?? DEFAULT_MINIMUM_MINOR;
-}
-
-// src/helpers/auto-recharge-form.ts
-var DEFAULT_VALIDATION_MESSAGES = {
-  invalidThreshold: "Enter a valid balance threshold.",
-  thresholdTooLow: "Balance threshold must be greater than zero.",
-  minTopupAmount: "Top-up amount must be at least {amount}.",
-  topupBelowThreshold: "Top-up amount must be at least your balance threshold ({amount}).",
-  invalidMaxMonthlySpend: "Maximum monthly spend must be a positive amount.",
-  maxMonthlySpendBelowTopup: "Maximum monthly spend must be at least your top-up amount ({amount})."
-};
-function amountAnchors(thresholdValue, topupValue, unit = "currency") {
-  return {
-    thresholdBaseValue: thresholdValue,
-    thresholdBaseUnit: unit,
-    topupBaseValue: topupValue,
-    topupBaseUnit: unit
-  };
-}
-function createDefaultAutoRechargeForm(currency, defaultTopupMajor, defaultThresholdMajor) {
-  const topup = defaultTopupMajor != null && defaultTopupMajor > 0 ? String(defaultTopupMajor) : "10";
-  const threshold = defaultThresholdMajor != null && defaultThresholdMajor >= 0 ? String(defaultThresholdMajor) : "5";
-  return {
-    enabled: false,
-    thresholdAmountMajor: threshold,
-    thresholdUnit: "currency",
-    topupAmountMajor: topup,
-    topupUnit: "currency",
-    maxMonthlySpendMajor: "",
-    ...amountAnchors(threshold, topup, "currency")
-  };
-}
-function currentSpendPeriod(now = /* @__PURE__ */ new Date()) {
-  const year = now.getUTCFullYear();
-  const month = now.getUTCMonth() + 1;
-  return `${year}-${String(month).padStart(2, "0")}`;
-}
-function effectiveMonthlySpend(config, now = /* @__PURE__ */ new Date()) {
-  if (config.monthlySpendPeriod !== currentSpendPeriod(now)) {
-    return 0;
-  }
-  return config.monthlySpendMinor ?? 0;
-}
-function isMonthlySpendCapReached(config, now = /* @__PURE__ */ new Date()) {
-  if (config.maxMonthlySpendMinor == null) return false;
-  const effectiveSpend = effectiveMonthlySpend(config, now);
-  return effectiveSpend + config.topup.amountMinor > config.maxMonthlySpendMinor;
-}
-function maxMonthlySpendMajorFromConfig(config, currency) {
-  if (config.maxMonthlySpendMinor == null) return "";
-  const minorPerMajor = getMinorUnitsPerMajor(currency);
-  return String(config.maxMonthlySpendMinor / minorPerMajor);
-}
-function parsePositiveNumber(value) {
-  const trimmed = value.trim();
-  if (trimmed.length === 0) return null;
-  const parsed = Number(trimmed);
-  if (!Number.isFinite(parsed) || parsed <= 0) return null;
-  return parsed;
-}
-function parseNonNegativeNumber(value) {
-  const trimmed = value.trim();
-  if (trimmed.length === 0) return null;
-  const parsed = Number(trimmed);
-  if (!Number.isFinite(parsed) || parsed < 0) return null;
-  return parsed;
-}
-function validateAutoRechargeForm(form, currency, conversion, messages = DEFAULT_VALIDATION_MESSAGES) {
-  if (!form.enabled) {
-    return {
-      ok: true,
-      payload: {
-        enabled: false,
-        triggerType: "balance",
-        currency: currency.toUpperCase()
-      }
-    };
-  }
-  const payload = {
-    enabled: true,
-    triggerType: "balance",
-    currency: currency.toUpperCase()
-  };
-  const minorPerMajor = getMinorUnitsPerMajor(currency);
-  const minMinor = getStripeMinimumMinor(currency);
-  const thresholdRaw = parseNonNegativeNumber(form.thresholdAmountMajor);
-  if (thresholdRaw == null) {
-    return { ok: false, error: messages.invalidThreshold };
-  }
-  if (form.thresholdUnit === "credits") {
-    const major = estimateCurrencyMajorFromCredits(
-      thresholdRaw,
-      currency,
-      conversion?.creditsPerMinorUnit,
-      conversion?.displayExchangeRate
-    );
-    if (major == null) {
-      return { ok: false, error: messages.invalidThreshold };
-    }
-    payload.thresholdAmountMajor = major;
-  } else {
-    payload.thresholdAmountMajor = thresholdRaw;
-  }
-  if (payload.thresholdAmountMajor == null || payload.thresholdAmountMajor <= 0) {
-    return { ok: false, error: messages.thresholdTooLow };
-  }
-  const amountRaw = parsePositiveNumber(form.topupAmountMajor);
-  if (amountRaw == null) {
-    return {
-      ok: false,
-      error: interpolate(messages.minTopupAmount, {
-        amount: formatPrice(minMinor, currency, { free: "" })
-      })
-    };
-  }
-  const amountMajor = form.topupUnit === "credits" ? estimateCurrencyMajorFromCredits(
-    amountRaw,
-    currency,
-    conversion?.creditsPerMinorUnit,
-    conversion?.displayExchangeRate
-  ) : amountRaw;
-  if (amountMajor == null || Math.round(amountMajor * minorPerMajor) < minMinor) {
-    return {
-      ok: false,
-      error: interpolate(messages.minTopupAmount, {
-        amount: formatPrice(minMinor, currency, { free: "" })
-      })
-    };
-  }
-  payload.topupAmountMajor = amountMajor;
-  if (amountMajor < payload.thresholdAmountMajor) {
-    return {
-      ok: false,
-      error: interpolate(messages.topupBelowThreshold, {
-        amount: formatPrice(
-          Math.round(payload.thresholdAmountMajor * minorPerMajor),
-          currency,
-          { free: "" }
-        )
-      })
-    };
-  }
-  if (form.maxMonthlySpendMajor.trim().length > 0) {
-    const max = parsePositiveNumber(form.maxMonthlySpendMajor);
-    if (max == null) {
-      return { ok: false, error: messages.invalidMaxMonthlySpend };
-    }
-    if (max < amountMajor) {
-      return {
-        ok: false,
-        error: interpolate(messages.maxMonthlySpendBelowTopup, {
-          amount: formatPrice(Math.round(amountMajor * minorPerMajor), currency, { free: "" })
-        })
-      };
-    }
-    payload.maxMonthlySpendMajor = max;
-  }
-  return { ok: true, payload };
-}
-function triggerAmountMajorFromConfig(config) {
-  const topupCurrency = config.topup.currency.toUpperCase();
-  const minorPerMajor = getMinorUnitsPerMajor(topupCurrency);
-  const { thresholdAmountMinor } = config.trigger;
-  if (!Number.isFinite(thresholdAmountMinor) || thresholdAmountMinor < 0) {
-    return null;
-  }
-  return thresholdAmountMinor / minorPerMajor;
-}
-function configToAutoRechargeInput(config, options) {
-  if (!config.enabled) return null;
-  const display = options?.display ?? config.display;
-  const currency = (display?.currency ?? config.topup.currency ?? options?.currency ?? "USD").toUpperCase();
-  if (display?.thresholdAmountMajor != null && display.topupAmountMajor != null) {
-    return {
-      enabled: true,
-      triggerType: "balance",
-      thresholdAmountMajor: display.thresholdAmountMajor,
-      topupAmountMajor: display.topupAmountMajor,
-      currency,
-      ...config.maxMonthlySpendMinor != null ? {
-        maxMonthlySpendMajor: config.maxMonthlySpendMinor / getMinorUnitsPerMajor(currency)
-      } : {}
-    };
-  }
-  const thresholdMajor = triggerAmountMajorFromConfig(config);
-  const topupAmountMajor = config.topup.amountMinor / getMinorUnitsPerMajor(currency);
-  if (thresholdMajor == null || !Number.isFinite(topupAmountMajor) || topupAmountMajor <= 0) {
-    return null;
-  }
-  return {
-    enabled: true,
-    triggerType: "balance",
-    thresholdAmountMajor: Math.max(0, thresholdMajor),
-    topupAmountMajor,
-    currency,
-    ...config.maxMonthlySpendMinor != null ? {
-      maxMonthlySpendMajor: config.maxMonthlySpendMinor / getMinorUnitsPerMajor(currency)
-    } : {}
-  };
-}
-function configToForm(config, currency) {
-  const base = createDefaultAutoRechargeForm(currency);
-  const display = config.display;
-  if (display?.thresholdAmountMajor != null && display.topupAmountMajor != null) {
-    const thresholdStr2 = String(Math.max(0, display.thresholdAmountMajor));
-    const topupStr2 = String(display.topupAmountMajor);
-    return {
-      ...base,
-      enabled: config.enabled,
-      thresholdAmountMajor: thresholdStr2,
-      topupAmountMajor: topupStr2,
-      maxMonthlySpendMajor: maxMonthlySpendMajorFromConfig(config, currency),
-      ...amountAnchors(thresholdStr2, topupStr2, "currency")
-    };
-  }
-  const thresholdMajor = triggerAmountMajorFromConfig(config);
-  const thresholdStr = thresholdMajor != null ? String(Math.max(0, thresholdMajor)) : "0";
-  const topupStr = String(config.topup.amountMinor / getMinorUnitsPerMajor(currency));
-  return {
-    ...base,
-    enabled: config.enabled,
-    thresholdAmountMajor: thresholdStr,
-    topupAmountMajor: topupStr,
-    maxMonthlySpendMajor: maxMonthlySpendMajorFromConfig(config, currency),
-    ...amountAnchors(thresholdStr, topupStr, "currency")
-  };
-}
-function formatAmountWithUnit(value, unit, currency) {
-  const num = Number(value);
-  if (!value || !Number.isFinite(num)) return "\u2014";
-  if (unit === "credits") {
-    return `${new Intl.NumberFormat().format(num)} credits`;
-  }
-  return formatPrice(Math.round(num * getMinorUnitsPerMajor(currency)), currency, { free: "" });
-}
-function buildSummaryLine(form, currency) {
-  if (!form.enabled) return null;
-  const thresholdDisplay = formatAmountWithUnit(
-    form.thresholdAmountMajor,
-    form.thresholdUnit,
-    currency
-  );
-  const fixedDisplay = formatAmountWithUnit(form.topupAmountMajor, form.topupUnit, currency);
-  return `When my balance falls below ${thresholdDisplay}, add ${fixedDisplay}.`;
-}
-function convertAmountForUnitFlip(value, fromUnit, toUnit, currency, creditsPerMinorUnit, displayExchangeRate) {
-  if (fromUnit === toUnit) return value;
-  const parsed = Number(value);
-  if (!Number.isFinite(parsed) || parsed <= 0) return value;
-  if (fromUnit === "currency" && toUnit === "credits") {
-    const credits = estimateCredits(parsed, currency, creditsPerMinorUnit, displayExchangeRate);
-    return credits != null ? String(credits) : value;
-  }
-  const major = estimateCurrencyMajorFromCredits(
-    parsed,
-    currency,
-    creditsPerMinorUnit,
-    displayExchangeRate
-  );
-  return major != null ? String(major) : value;
-}
-function flipUnitValue(anchor, targetUnit, currency, creditsPerMinorUnit, displayExchangeRate) {
-  if (targetUnit === anchor.unit) {
-    return { value: anchor.value, unit: anchor.unit };
-  }
-  const converted = convertAmountForUnitFlip(
-    anchor.value,
-    anchor.unit,
-    targetUnit,
-    currency,
-    creditsPerMinorUnit,
-    displayExchangeRate
-  );
-  return { value: converted, unit: targetUnit };
-}
-
 // src/primitives/AutoRecharge.tsx
 import {
   createContext as createContext4,
-  forwardRef as forwardRef5,
+  forwardRef as forwardRef6,
   useCallback as useCallback3,
-  useContext as useContext5,
-  useEffect as useEffect4,
+  useContext as useContext6,
+  useEffect as useEffect3,
   useId,
-  useMemo as useMemo4,
-  useRef as useRef3,
-  useState as useState4
+  useMemo as useMemo5,
+  useRef as useRef2,
+  useState as useState3
 } from "react";
 import { createPortal } from "react-dom";
 import {
@@ -1140,10 +729,10 @@ function stripSetupIntentParams() {
 }
 
 // src/primitives/AutoRecharge.tsx
-import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
 var AutoRechargeContext = createContext4(null);
 function useAutoRechargeCtx(part) {
-  const ctx = useContext5(AutoRechargeContext);
+  const ctx = useContext6(AutoRechargeContext);
   if (!ctx) {
     throw new Error(`AutoRecharge.${part} must be rendered inside <AutoRecharge.Root>.`);
   }
@@ -1151,7 +740,11 @@ function useAutoRechargeCtx(part) {
 }
 function getCurrencySymbol(currency) {
   try {
-    const parts = new Intl.NumberFormat("en", { style: "currency", currency }).formatToParts(0);
+    const parts = new Intl.NumberFormat("en", {
+      style: "currency",
+      currency,
+      currencyDisplay: "narrowSymbol"
+    }).formatToParts(0);
     const sym = parts.find((p) => p.type === "currency");
     return sym?.value ?? currency.toUpperCase();
   } catch {
@@ -1162,7 +755,7 @@ var stripePromiseCache = /* @__PURE__ */ new Map();
 function getStripeCacheKey(publishableKey, accountId) {
   return accountId ? `${publishableKey}:${accountId}` : publishableKey;
 }
-var Root4 = forwardRef5(function AutoRechargeRoot({
+var Root4 = forwardRef6(function AutoRechargeRoot({
   currency = "USD",
   defaultThresholdAmountMajor,
   defaultTopupAmountMajor,
@@ -1179,15 +772,15 @@ var Root4 = forwardRef5(function AutoRechargeRoot({
   className,
   ...rest
 }, forwardedRef) {
-  const solva = useContext5(SolvaPayContext);
+  const solva = useContext6(SolvaPayContext);
   if (!solva) throw new MissingProviderError("AutoRecharge");
   const autoRecharge = useAutoRecharge();
   const { creditsPerMinorUnit, displayExchangeRate } = useBalance();
   const copy = useCopy();
   const titleId = useId();
-  const triggerRef = useRef3(null);
+  const triggerRef = useRef2(null);
   const defaultTopup = defaultTopupAmountMajor ?? defaultThresholdAmountMajor ?? void 0;
-  const [uncontrolledOpen, setUncontrolledOpen] = useState4(defaultOpen);
+  const [uncontrolledOpen, setUncontrolledOpen] = useState3(defaultOpen);
   const isControlled = openProp !== void 0;
   const open = isControlled ? openProp : uncontrolledOpen;
   const setOpen = useCallback3(
@@ -1205,17 +798,17 @@ var Root4 = forwardRef5(function AutoRechargeRoot({
   const focusTrigger = useCallback3(() => {
     triggerRef.current?.focus();
   }, []);
-  const [form, setForm] = useState4(
+  const [form, setForm] = useState3(
     () => autoRecharge.config ? configToForm(autoRecharge.config, currency) : createDefaultAutoRechargeForm(currency, defaultTopup)
   );
-  const [validationError, setValidationError] = useState4(null);
-  const [statusMessage, setStatusMessage] = useState4(null);
-  const [setup, setSetup] = useState4(null);
-  const latestConfigRef = useRef3(autoRecharge.config);
-  useEffect4(() => {
+  const [validationError, setValidationError] = useState3(null);
+  const [statusMessage, setStatusMessage] = useState3(null);
+  const [setup, setSetup] = useState3(null);
+  const latestConfigRef = useRef2(autoRecharge.config);
+  useEffect3(() => {
     latestConfigRef.current = autoRecharge.config;
   }, [autoRecharge.config]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (autoRecharge.config) {
       setForm(configToForm(autoRecharge.config, currency));
     }
@@ -1281,7 +874,7 @@ var Root4 = forwardRef5(function AutoRechargeRoot({
     },
     [currency, creditsPerMinorUnit, displayExchangeRate, emitValidation]
   );
-  const fixedTopupHint = useMemo4(() => {
+  const fixedTopupHint = useMemo5(() => {
     const parsed = Number(form.topupAmountMajor);
     if (!Number.isFinite(parsed) || parsed <= 0) return null;
     if (form.topupUnit === "currency") {
@@ -1305,8 +898,8 @@ var Root4 = forwardRef5(function AutoRechargeRoot({
     displayExchangeRate,
     isApproximate
   ]);
-  const summaryLine = useMemo4(() => buildSummaryLine(form, currency), [form, currency]);
-  const savedSummaryLine = useMemo4(() => {
+  const summaryLine = useMemo5(() => buildSummaryLine(form, currency), [form, currency]);
+  const savedSummaryLine = useMemo5(() => {
     if (!autoRecharge.config?.enabled) return null;
     return buildSummaryLine(
       configToForm(autoRecharge.config, currency),
@@ -1365,7 +958,7 @@ var Root4 = forwardRef5(function AutoRechargeRoot({
     }
   }, [autoRecharge, copy.autoRecharge, form.enabled, setOpen]);
   const dataState = setup ? "setup" : autoRecharge.error ? "error" : autoRecharge.loading ? "loading" : autoRecharge.saving ? "saving" : autoRecharge.disabling ? "disabling" : "idle";
-  const ctx = useMemo4(
+  const ctx = useMemo5(
     () => ({
       form,
       updateForm,
@@ -1436,7 +1029,7 @@ var Root4 = forwardRef5(function AutoRechargeRoot({
     ]
   );
   const Comp = asChild ? Slot : "section";
-  return /* @__PURE__ */ jsx6(AutoRechargeContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(AutoRechargeContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx7(
     Comp,
     {
       ref: forwardedRef,
@@ -1449,18 +1042,18 @@ var Root4 = forwardRef5(function AutoRechargeRoot({
     }
   ) });
 });
-var Loading4 = forwardRef5(
+var Loading4 = forwardRef6(
   function AutoRechargeLoading({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Loading");
     if (!ctx.loading) return null;
-    return /* @__PURE__ */ jsx6("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-loading": "", ...rest, children: children ?? /* @__PURE__ */ jsxs2(Fragment3, { children: [
-      /* @__PURE__ */ jsx6(Spinner, { size: "sm" }),
+    return /* @__PURE__ */ jsx7("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-loading": "", ...rest, children: children ?? /* @__PURE__ */ jsxs2(Fragment4, { children: [
+      /* @__PURE__ */ jsx7(Spinner, { size: "sm" }),
       " Loading auto-recharge settings\u2026"
     ] }) });
   }
 );
-var Card = forwardRef5(function AutoRechargeCard({ className, children, ...rest }, forwardedRef) {
-  return /* @__PURE__ */ jsx6(
+var Card = forwardRef6(function AutoRechargeCard({ className, children, ...rest }, forwardedRef) {
+  return /* @__PURE__ */ jsx7(
     "section",
     {
       ref: forwardedRef,
@@ -1471,10 +1064,10 @@ var Card = forwardRef5(function AutoRechargeCard({ className, children, ...rest
     }
   );
 });
-var CardHeading = forwardRef5(
+var CardHeading = forwardRef6(
   function AutoRechargeCardHeading({ className, children, ...rest }, forwardedRef) {
     const copy = useCopy();
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "h3",
       {
         ref: forwardedRef,
@@ -1486,12 +1079,12 @@ var CardHeading = forwardRef5(
     );
   }
 );
-var CardSummary = forwardRef5(
+var CardSummary = forwardRef6(
   function AutoRechargeCardSummary({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("CardSummary");
     const copy = useCopy();
     const text = ctx.savedSummaryLine ?? copy.autoRecharge.notConfiguredHint;
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "p",
       {
         ref: forwardedRef,
@@ -1503,7 +1096,7 @@ var CardSummary = forwardRef5(
     );
   }
 );
-var Trigger = forwardRef5(function AutoRechargeTrigger({ asChild, onClick, children, className, ...rest }, forwardedRef) {
+var Trigger = forwardRef6(function AutoRechargeTrigger({ asChild, onClick, children, className, ...rest }, forwardedRef) {
   const ctx = useAutoRechargeCtx("Trigger");
   const copy = useCopy();
   const hasExistingConfig = Boolean(ctx.config?.enabled);
@@ -1531,14 +1124,14 @@ var Trigger = forwardRef5(function AutoRechargeTrigger({ asChild, onClick, child
     ...rest
   };
   if (asChild) {
-    return /* @__PURE__ */ jsx6(Slot, { ref: setRefs, ...commonProps, children: children ?? label });
+    return /* @__PURE__ */ jsx7(Slot, { ref: setRefs, ...commonProps, children: children ?? label });
   }
-  return /* @__PURE__ */ jsx6("button", { ref: setRefs, ...commonProps, children: children ?? label });
+  return /* @__PURE__ */ jsx7("button", { ref: setRefs, ...commonProps, children: children ?? label });
 });
-var Overlay = forwardRef5(
+var Overlay = forwardRef6(
   function AutoRechargeOverlay({ onClick, className, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Overlay");
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "div",
       {
         ref: forwardedRef,
@@ -1555,10 +1148,10 @@ var Overlay = forwardRef5(
     );
   }
 );
-var Content = forwardRef5(function AutoRechargeContent({ className, children, ...rest }, forwardedRef) {
+var Content = forwardRef6(function AutoRechargeContent({ className, children, ...rest }, forwardedRef) {
   const ctx = useAutoRechargeCtx("Content");
-  const panelRef = useRef3(null);
-  useEffect4(() => {
+  const panelRef = useRef2(null);
+  useEffect3(() => {
     if (!ctx.open) return;
     const handleKeyDown = (event) => {
       if (event.key === "Escape") {
@@ -1575,12 +1168,12 @@ var Content = forwardRef5(function AutoRechargeContent({ className, children, ..
     return () => {
       document.removeEventListener("keydown", handleKeyDown);
     };
-  }, [ctx.open, ctx.resetForm, ctx.setOpen, ctx.focusTrigger]);
+  }, [ctx]);
   if (!ctx.open || typeof document === "undefined") return null;
   return createPortal(
     /* @__PURE__ */ jsxs2("div", { "data-solvapay-auto-recharge-portal": "", children: [
-      /* @__PURE__ */ jsx6(Overlay, {}),
-      /* @__PURE__ */ jsx6(
+      /* @__PURE__ */ jsx7(Overlay, {}),
+      /* @__PURE__ */ jsx7(
         "div",
         {
           ref: (node) => {
@@ -1604,11 +1197,11 @@ var Content = forwardRef5(function AutoRechargeContent({ className, children, ..
     document.body
   );
 });
-var Title = forwardRef5(
+var Title = forwardRef6(
   function AutoRechargeTitle({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Title");
     const copy = useCopy();
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "h2",
       {
         ref: forwardedRef,
@@ -1621,16 +1214,16 @@ var Title = forwardRef5(
     );
   }
 );
-var EnableQuestion = forwardRef5(
+var EnableQuestion = forwardRef6(
   function AutoRechargeEnableQuestion({ className, children, ...rest }, forwardedRef) {
     const copy = useCopy();
-    return /* @__PURE__ */ jsx6("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-question": "", ...rest, children: children ?? copy.autoRecharge.enableQuestion });
+    return /* @__PURE__ */ jsx7("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-question": "", ...rest, children: children ?? copy.autoRecharge.enableQuestion });
   }
 );
-var EnableSentence = forwardRef5(
+var EnableSentence = forwardRef6(
   function AutoRechargeEnableSentence({ className, children, ...rest }, forwardedRef) {
     const copy = useCopy();
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "label",
       {
         ref: forwardedRef,
@@ -1642,25 +1235,25 @@ var EnableSentence = forwardRef5(
     );
   }
 );
-var EnableRow = forwardRef5(
+var EnableRow = forwardRef6(
   function AutoRechargeEnableRow({ className, children, ...rest }, forwardedRef) {
     const enableId = useId();
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "div",
       {
         ref: forwardedRef,
         className,
         "data-solvapay-auto-recharge-enable-row": "",
         ...rest,
-        children: children ?? /* @__PURE__ */ jsxs2(Fragment3, { children: [
-          /* @__PURE__ */ jsx6(EnableSwitch, { appearance: "checkbox", id: enableId }),
-          /* @__PURE__ */ jsx6(EnableSentence, { htmlFor: enableId })
+        children: children ?? /* @__PURE__ */ jsxs2(Fragment4, { children: [
+          /* @__PURE__ */ jsx7(EnableSwitch, { appearance: "checkbox", id: enableId }),
+          /* @__PURE__ */ jsx7(EnableSentence, { htmlFor: enableId })
         ] })
       }
     );
   }
 );
-var CancelButton = forwardRef5(
+var CancelButton = forwardRef6(
   function AutoRechargeCancelButton({ asChild, onClick, children, className, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("CancelButton");
     const copy = useCopy();
@@ -1677,7 +1270,7 @@ var CancelButton = forwardRef5(
       ...rest
     };
     if (asChild) {
-      return /* @__PURE__ */ jsx6(
+      return /* @__PURE__ */ jsx7(
         Slot,
         {
           ref: forwardedRef,
@@ -1686,10 +1279,10 @@ var CancelButton = forwardRef5(
         }
       );
     }
-    return /* @__PURE__ */ jsx6("button", { ref: forwardedRef, ...commonProps, children: children ?? copy.autoRecharge.cancelButton });
+    return /* @__PURE__ */ jsx7("button", { ref: forwardedRef, ...commonProps, children: children ?? copy.autoRecharge.cancelButton });
   }
 );
-var Header = forwardRef5(
+var Header = forwardRef6(
   function AutoRechargeHeader({ className, ...rest }, forwardedRef) {
     const copy = useCopy();
     const headingId = useId();
@@ -1702,19 +1295,19 @@ var Header = forwardRef5(
         ...rest,
         children: [
           /* @__PURE__ */ jsxs2("section", { "data-solvapay-auto-recharge-heading-group": "", children: [
-            /* @__PURE__ */ jsx6("h3", { id: headingId, "data-solvapay-auto-recharge-heading": "", children: copy.autoRecharge.heading }),
-            /* @__PURE__ */ jsx6(Description, {})
+            /* @__PURE__ */ jsx7("h3", { id: headingId, "data-solvapay-auto-recharge-heading": "", children: copy.autoRecharge.heading }),
+            /* @__PURE__ */ jsx7(Description, {})
           ] }),
-          /* @__PURE__ */ jsx6(EnableSwitch, { "aria-labelledby": headingId })
+          /* @__PURE__ */ jsx7(EnableSwitch, { "aria-labelledby": headingId })
         ]
       }
     );
   }
 );
-var Description = forwardRef5(
+var Description = forwardRef6(
   function AutoRechargeDescription({ className, children, ...rest }, forwardedRef) {
     const copy = useCopy();
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "p",
       {
         ref: forwardedRef,
@@ -1726,7 +1319,7 @@ var Description = forwardRef5(
     );
   }
 );
-var EnableSwitch = forwardRef5(
+var EnableSwitch = forwardRef6(
   function AutoRechargeEnableSwitch({ asChild, appearance = "switch", onChange, className, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("EnableSwitch");
     const copy = useCopy();
@@ -1745,7 +1338,7 @@ var EnableSwitch = forwardRef5(
       ...rest
     };
     if (asChild) {
-      return /* @__PURE__ */ jsx6(
+      return /* @__PURE__ */ jsx7(
         Slot,
         {
           ref: forwardedRef,
@@ -1753,10 +1346,10 @@ var EnableSwitch = forwardRef5(
         }
       );
     }
-    return /* @__PURE__ */ jsx6("input", { ref: forwardedRef, ...commonProps });
+    return /* @__PURE__ */ jsx7("input", { ref: forwardedRef, ...commonProps });
   }
 );
-var Fields = forwardRef5(
+var Fields = forwardRef6(
   function AutoRechargeFields({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Fields");
     const copy = useCopy();
@@ -1772,64 +1365,66 @@ var Fields = forwardRef5(
         "data-state": "open",
         ...rest,
         children: [
-          /* @__PURE__ */ jsx6("legend", { className: "sr-only", children: copy.autoRecharge.heading }),
-          children ?? /* @__PURE__ */ jsxs2(Fragment3, { children: [
-            /* @__PURE__ */ jsx6(Summary2, {}),
-            /* @__PURE__ */ jsx6(ThresholdField, {}),
-            /* @__PURE__ */ jsx6(TopupField, {}),
-            /* @__PURE__ */ jsx6(MaxMonthlySpendField, {}),
-            /* @__PURE__ */ jsx6(ValidationError, {})
+          /* @__PURE__ */ jsx7("legend", { className: "sr-only", children: copy.autoRecharge.heading }),
+          children ?? /* @__PURE__ */ jsxs2(Fragment4, { children: [
+            /* @__PURE__ */ jsx7(Summary2, {}),
+            /* @__PURE__ */ jsx7(ThresholdField, {}),
+            /* @__PURE__ */ jsx7(TopupField, {}),
+            /* @__PURE__ */ jsx7(MaxMonthlySpendField, {}),
+            /* @__PURE__ */ jsx7(DeepDrawdownExplainer, {}),
+            /* @__PURE__ */ jsx7(ValidationError, {})
           ] })
         ]
       }
     );
   }
 );
-var Setup = forwardRef5(
+var Setup = forwardRef6(
   function AutoRechargeSetup({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Setup");
     if (!ctx.setup?.setupClientSecret) return null;
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "div",
       {
         ref: forwardedRef,
         className,
         "data-solvapay-auto-recharge-setup-panel": "",
         ...rest,
-        children: children ?? /* @__PURE__ */ jsx6(CardSetup, { setup: ctx.setup, onComplete: ctx.completeSetup })
+        children: children ?? /* @__PURE__ */ jsx7(CardSetup, { setup: ctx.setup, onComplete: ctx.completeSetup })
       }
     );
   }
 );
-var Body = forwardRef5(
+var Body = forwardRef6(
   function AutoRechargeBody({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Body");
     if (ctx.setup?.setupClientSecret) {
-      return /* @__PURE__ */ jsx6(Setup, { className });
+      return /* @__PURE__ */ jsx7(Setup, { className });
     }
     if (!ctx.form.enabled) return null;
-    return /* @__PURE__ */ jsx6(Fields, { ref: forwardedRef, className, ...rest, children: children ?? /* @__PURE__ */ jsxs2(Fragment3, { children: [
-      /* @__PURE__ */ jsx6(Summary2, {}),
-      /* @__PURE__ */ jsx6(ThresholdField, {}),
-      /* @__PURE__ */ jsx6(TopupField, {}),
-      /* @__PURE__ */ jsx6(MaxMonthlySpendField, {}),
-      /* @__PURE__ */ jsx6(ValidationError, {}),
-      /* @__PURE__ */ jsx6(Actions, {})
+    return /* @__PURE__ */ jsx7(Fields, { ref: forwardedRef, className, ...rest, children: children ?? /* @__PURE__ */ jsxs2(Fragment4, { children: [
+      /* @__PURE__ */ jsx7(Summary2, {}),
+      /* @__PURE__ */ jsx7(ThresholdField, {}),
+      /* @__PURE__ */ jsx7(TopupField, {}),
+      /* @__PURE__ */ jsx7(MaxMonthlySpendField, {}),
+      /* @__PURE__ */ jsx7(DeepDrawdownExplainer, {}),
+      /* @__PURE__ */ jsx7(ValidationError, {}),
+      /* @__PURE__ */ jsx7(Actions, {})
     ] }) });
   }
 );
-var Summary2 = forwardRef5(
+var Summary2 = forwardRef6(
   function AutoRechargeSummary({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Summary");
     const copy = useCopy();
     if (!ctx.summaryLine) return null;
     return /* @__PURE__ */ jsxs2("div", { "data-solvapay-auto-recharge-summary": "", children: [
-      /* @__PURE__ */ jsx6("p", { ref: forwardedRef, className, ...rest, children: children ?? ctx.summaryLine }),
-      /* @__PURE__ */ jsx6("p", { className: "text-xs text-muted-foreground", children: copy.autoRecharge.taxDisclosure })
+      /* @__PURE__ */ jsx7("p", { ref: forwardedRef, className, ...rest, children: children ?? ctx.summaryLine }),
+      /* @__PURE__ */ jsx7("p", { className: "text-xs text-muted-foreground", children: copy.autoRecharge.taxDisclosure })
     ] });
   }
 );
-var AmountField = forwardRef5(function AutoRechargeAmountField({ field, showLabel = true, asChild, onChange, className, ...rest }, forwardedRef) {
+var AmountField = forwardRef6(function AutoRechargeAmountField({ field, showLabel = true, asChild, onChange, className, ...rest }, forwardedRef) {
   const ctx = useAutoRechargeCtx("AmountField");
   const copy = useCopy();
   const fieldConfig = {
@@ -1890,11 +1485,11 @@ var AmountField = forwardRef5(function AutoRechargeAmountField({ field, showLabe
   };
   const slotRef = forwardedRef;
   return /* @__PURE__ */ jsxs2("p", { "data-solvapay-auto-recharge-field": "", "data-field": field, children: [
-    showLabel ? /* @__PURE__ */ jsx6("label", { htmlFor: inputId, children: fieldConfig.label }) : null,
+    showLabel ? /* @__PURE__ */ jsx7("label", { htmlFor: inputId, children: fieldConfig.label }) : null,
     /* @__PURE__ */ jsxs2("span", { "data-solvapay-auto-recharge-amount-row": "", children: [
-      prefix ? /* @__PURE__ */ jsx6("span", { "data-solvapay-auto-recharge-currency-prefix": "", "aria-hidden": "true", children: prefix }) : null,
-      asChild ? /* @__PURE__ */ jsx6(Slot, { ref: slotRef, ...inputProps }) : /* @__PURE__ */ jsx6("input", { ref: forwardedRef, ...inputProps }),
-      ctx.canToggleUnits ? /* @__PURE__ */ jsx6(
+      prefix ? /* @__PURE__ */ jsx7("span", { "data-solvapay-auto-recharge-currency-prefix": "", "aria-hidden": "true", children: prefix }) : null,
+      asChild ? /* @__PURE__ */ jsx7(Slot, { ref: slotRef, ...inputProps }) : /* @__PURE__ */ jsx7("input", { ref: forwardedRef, ...inputProps }),
+      ctx.canToggleUnits ? /* @__PURE__ */ jsx7(
         UnitToggle,
         {
           unit: fieldConfig.unit,
@@ -1911,12 +1506,12 @@ var AmountField = forwardRef5(function AutoRechargeAmountField({ field, showLabe
     ] })
   ] });
 });
-var ThresholdField = forwardRef5(
+var ThresholdField = forwardRef6(
   function AutoRechargeThresholdField({ className, ...rest }, ref) {
-    return /* @__PURE__ */ jsx6("section", { ref, className, ...rest, children: /* @__PURE__ */ jsx6(AmountField, { field: "threshold" }) });
+    return /* @__PURE__ */ jsx7("section", { ref, className, ...rest, children: /* @__PURE__ */ jsx7(AmountField, { field: "threshold" }) });
   }
 );
-var TopupField = forwardRef5(
+var TopupField = forwardRef6(
   function AutoRechargeTopupField({ className, ...rest }, ref) {
     return /* @__PURE__ */ jsxs2(
       "section",
@@ -1926,14 +1521,14 @@ var TopupField = forwardRef5(
         "data-solvapay-auto-recharge-topup-field": "",
         ...rest,
         children: [
-          /* @__PURE__ */ jsx6(AmountField, { field: "fixed" }),
-          /* @__PURE__ */ jsx6(Hint, {})
+          /* @__PURE__ */ jsx7(AmountField, { field: "fixed" }),
+          /* @__PURE__ */ jsx7(Hint, {})
         ]
       }
     );
   }
 );
-var MaxMonthlySpendField = forwardRef5(function AutoRechargeMaxMonthlySpendField({ onChange, className, ...rest }, forwardedRef) {
+var MaxMonthlySpendField = forwardRef6(function AutoRechargeMaxMonthlySpendField({ onChange, className, ...rest }, forwardedRef) {
   const ctx = useAutoRechargeCtx("MaxMonthlySpendField");
   const copy = useCopy();
   const inputId = useId();
@@ -1943,10 +1538,10 @@ var MaxMonthlySpendField = forwardRef5(function AutoRechargeMaxMonthlySpendField
     ctx.updateForm({ maxMonthlySpendMajor: raw });
   };
   return /* @__PURE__ */ jsxs2("section", { "data-solvapay-auto-recharge-field": "", "data-field": "max-monthly-spend", children: [
-    /* @__PURE__ */ jsx6("label", { htmlFor: inputId, children: copy.autoRecharge.maxMonthlySpendLabel }),
+    /* @__PURE__ */ jsx7("label", { htmlFor: inputId, children: copy.autoRecharge.maxMonthlySpendLabel }),
     /* @__PURE__ */ jsxs2("span", { "data-solvapay-auto-recharge-amount-row": "", children: [
-      /* @__PURE__ */ jsx6("span", { "data-solvapay-auto-recharge-currency-prefix": "", "aria-hidden": "true", children: prefix }),
-      /* @__PURE__ */ jsx6(
+      /* @__PURE__ */ jsx7("span", { "data-solvapay-auto-recharge-currency-prefix": "", "aria-hidden": "true", children: prefix }),
+      /* @__PURE__ */ jsx7(
         "input",
         {
           ref: forwardedRef,
@@ -1964,16 +1559,29 @@ var MaxMonthlySpendField = forwardRef5(function AutoRechargeMaxMonthlySpendField
         }
       )
     ] }),
-    /* @__PURE__ */ jsx6("p", { "data-solvapay-auto-recharge-max-spend-helper": "", children: copy.autoRecharge.maxMonthlySpendHelper })
+    /* @__PURE__ */ jsx7("p", { "data-solvapay-auto-recharge-max-spend-helper": "", children: copy.autoRecharge.maxMonthlySpendHelper })
   ] });
 });
-var MonthlySpend = forwardRef5(
+var DeepDrawdownExplainer = forwardRef6(function AutoRechargeDeepDrawdownExplainer({ className, ...rest }, forwardedRef) {
+  const copy = useCopy();
+  return /* @__PURE__ */ jsx7(
+    "p",
+    {
+      ref: forwardedRef,
+      className,
+      "data-solvapay-auto-recharge-deep-drawdown": "",
+      ...rest,
+      children: copy.autoRecharge.deepDrawdownExplainer
+    }
+  );
+});
+var MonthlySpend = forwardRef6(
   function AutoRechargeMonthlySpend({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("MonthlySpend");
     const copy = useCopy();
     if (!ctx.config?.maxMonthlySpendMinor) return null;
     const spent = effectiveMonthlySpend(ctx.config);
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "p",
       {
         ref: forwardedRef,
@@ -1988,10 +1596,10 @@ var MonthlySpend = forwardRef5(
     );
   }
 );
-var UnitToggle = forwardRef5(function AutoRechargeUnitToggle({ unit, fieldLabel, onToggle, className, ...rest }, forwardedRef) {
+var UnitToggle = forwardRef6(function AutoRechargeUnitToggle({ unit, fieldLabel, onToggle, className, ...rest }, forwardedRef) {
   const ctx = useAutoRechargeCtx("UnitToggle");
   const targetUnitLabel = unit === "currency" ? "credits" : "currency";
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "button",
     {
       ref: forwardedRef,
@@ -2005,7 +1613,7 @@ var UnitToggle = forwardRef5(function AutoRechargeUnitToggle({ unit, fieldLabel,
     }
   );
 });
-var Hint = forwardRef5(
+var Hint = forwardRef6(
   function AutoRechargeHint({ className, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Hint");
     const copy = useCopy();
@@ -2019,13 +1627,13 @@ var Hint = forwardRef5(
       ctx.isApproximate ? copy.autoRecharge.currencyPerRechargeApprox : copy.autoRecharge.currencyPerRecharge,
       { amount: hint }
     );
-    return /* @__PURE__ */ jsx6("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-hint": "", ...rest, children: text });
+    return /* @__PURE__ */ jsx7("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-hint": "", ...rest, children: text });
   }
 );
-var ValidationError = forwardRef5(function AutoRechargeValidationError({ className, ...rest }, forwardedRef) {
+var ValidationError = forwardRef6(function AutoRechargeValidationError({ className, ...rest }, forwardedRef) {
   const ctx = useAutoRechargeCtx("ValidationError");
   if (!ctx.validationError) return null;
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "p",
     {
       ref: forwardedRef,
@@ -2038,24 +1646,24 @@ var ValidationError = forwardRef5(function AutoRechargeValidationError({ classNa
     }
   );
 });
-var Actions = forwardRef5(
+var Actions = forwardRef6(
   function AutoRechargeActions({ className, children, ...rest }, forwardedRef) {
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "menu",
       {
         ref: forwardedRef,
         className,
         "data-solvapay-auto-recharge-actions": "",
         ...rest,
-        children: children ?? /* @__PURE__ */ jsxs2(Fragment3, { children: [
-          /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsx6(CancelButton, {}) }),
-          /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsx6(SaveButton, {}) })
+        children: children ?? /* @__PURE__ */ jsxs2(Fragment4, { children: [
+          /* @__PURE__ */ jsx7("li", { children: /* @__PURE__ */ jsx7(CancelButton, {}) }),
+          /* @__PURE__ */ jsx7("li", { children: /* @__PURE__ */ jsx7(SaveButton, {}) })
         ] })
       }
     );
   }
 );
-var SaveButton = forwardRef5(function AutoRechargeSaveButton({ asChild, onClick, children, className, ...rest }, forwardedRef) {
+var SaveButton = forwardRef6(function AutoRechargeSaveButton({ asChild, onClick, children, className, ...rest }, forwardedRef) {
   const ctx = useAutoRechargeCtx("SaveButton");
   const copy = useCopy();
   const dataState = ctx.saving ? "processing" : ctx.validationError ? "disabled" : "idle";
@@ -2072,13 +1680,13 @@ var SaveButton = forwardRef5(function AutoRechargeSaveButton({ asChild, onClick,
     className,
     ...rest
   };
-  const content = ctx.saving ? /* @__PURE__ */ jsxs2(Fragment3, { children: [
-    /* @__PURE__ */ jsx6(Spinner, { size: "sm" }),
+  const content = ctx.saving ? /* @__PURE__ */ jsxs2(Fragment4, { children: [
+    /* @__PURE__ */ jsx7(Spinner, { size: "sm" }),
     " ",
     copy.cta.processing
   ] }) : children ?? copy.autoRecharge.saveButton;
   if (asChild) {
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       Slot,
       {
         ref: forwardedRef,
@@ -2087,9 +1695,9 @@ var SaveButton = forwardRef5(function AutoRechargeSaveButton({ asChild, onClick,
       }
     );
   }
-  return /* @__PURE__ */ jsx6("button", { ref: forwardedRef, ...commonProps, children: content });
+  return /* @__PURE__ */ jsx7("button", { ref: forwardedRef, ...commonProps, children: content });
 });
-var DisableButton = forwardRef5(
+var DisableButton = forwardRef6(
   function AutoRechargeDisableButton({ asChild, onClick, children, className, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("DisableButton");
     const copy = useCopy();
@@ -2107,7 +1715,7 @@ var DisableButton = forwardRef5(
       ...rest
     };
     if (asChild) {
-      return /* @__PURE__ */ jsx6(
+      return /* @__PURE__ */ jsx7(
         Slot,
         {
           ref: forwardedRef,
@@ -2116,14 +1724,14 @@ var DisableButton = forwardRef5(
         }
       );
     }
-    return /* @__PURE__ */ jsx6("button", { ref: forwardedRef, ...commonProps, children: children ?? copy.autoRecharge.disableButton });
+    return /* @__PURE__ */ jsx7("button", { ref: forwardedRef, ...commonProps, children: children ?? copy.autoRecharge.disableButton });
   }
 );
-var ErrorSlot4 = forwardRef5(
+var ErrorSlot4 = forwardRef6(
   function AutoRechargeError({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Error");
     if (!ctx.error) return null;
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "p",
       {
         ref: forwardedRef,
@@ -2137,11 +1745,11 @@ var ErrorSlot4 = forwardRef5(
     );
   }
 );
-var StatusMessage = forwardRef5(
+var StatusMessage = forwardRef6(
   function AutoRechargeStatusMessage({ className, children, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("StatusMessage");
     if (!ctx.statusMessage) return null;
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "p",
       {
         ref: forwardedRef,
@@ -2154,7 +1762,7 @@ var StatusMessage = forwardRef5(
     );
   }
 );
-var Status = forwardRef5(
+var Status = forwardRef6(
   function AutoRechargeStatus({ className, ...rest }, forwardedRef) {
     const ctx = useAutoRechargeCtx("Status");
     const copy = useCopy();
@@ -2171,8 +1779,8 @@ var Status = forwardRef5(
         "data-solvapay-auto-recharge-status-group": "",
         ...rest,
         children: [
-          failedLabel ? /* @__PURE__ */ jsx6("span", { "data-solvapay-auto-recharge-status": "", "data-status": "failed", children: failedLabel }) : null,
-          capLabel ? /* @__PURE__ */ jsx6("span", { "data-solvapay-auto-recharge-status": "", "data-status": "monthly-cap-reached", children: capLabel }) : null
+          failedLabel ? /* @__PURE__ */ jsx7("span", { "data-solvapay-auto-recharge-status": "", "data-status": "failed", children: failedLabel }) : null,
+          capLabel ? /* @__PURE__ */ jsx7("span", { "data-solvapay-auto-recharge-status": "", "data-status": "monthly-cap-reached", children: capLabel }) : null
         ]
       }
     );
@@ -2182,9 +1790,9 @@ function CardSetupInner({ onComplete }) {
   const copy = useCopy();
   const stripe = useStripe();
   const elements = useElements();
-  const [processing, setProcessing] = useState4(false);
-  const [error, setError] = useState4(null);
-  useEffect4(() => {
+  const [processing, setProcessing] = useState3(false);
+  const [error, setError] = useState3(null);
+  useEffect3(() => {
     if (!stripe) return;
     const clientSecret = readSetupIntentClientSecret(window.location.search);
     if (!clientSecret) return;
@@ -2240,11 +1848,11 @@ function CardSetupInner({ onComplete }) {
     setProcessing(false);
   };
   return /* @__PURE__ */ jsxs2("form", { onSubmit: handleSubmit, "data-solvapay-auto-recharge-setup": "", children: [
-    /* @__PURE__ */ jsx6("h4", { children: copy.autoRecharge.setupHeading }),
-    /* @__PURE__ */ jsx6("p", { children: copy.autoRecharge.setupDescription }),
-    /* @__PURE__ */ jsx6(StripePaymentElement, { options: withPaymentElementDefaults() }),
-    error ? /* @__PURE__ */ jsx6("p", { role: "alert", "aria-live": "polite", "data-solvapay-auto-recharge-setup-error": "", children: error }) : null,
-    /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsx7("h4", { children: copy.autoRecharge.setupHeading }),
+    /* @__PURE__ */ jsx7("p", { children: copy.autoRecharge.setupDescription }),
+    /* @__PURE__ */ jsx7(StripePaymentElement, { options: withPaymentElementDefaults() }),
+    error ? /* @__PURE__ */ jsx7("p", { role: "alert", "aria-live": "polite", "data-solvapay-auto-recharge-setup-error": "", children: error }) : null,
+    /* @__PURE__ */ jsx7(
       "button",
       {
         type: "submit",
@@ -2256,7 +1864,7 @@ function CardSetupInner({ onComplete }) {
   ] });
 }
 function CardSetup({ setup, onComplete }) {
-  const stripePromise = useMemo4(() => {
+  const stripePromise = useMemo5(() => {
     if (!setup.publishableKey || !setup.setupClientSecret) return null;
     const options = {
       ...setup.stripeAccountId ? { stripeAccount: setup.stripeAccountId } : {},
@@ -2271,16 +1879,16 @@ function CardSetup({ setup, onComplete }) {
   }, [setup.publishableKey, setup.setupClientSecret, setup.stripeAccountId]);
   if (!stripePromise || !setup.setupClientSecret) {
     return /* @__PURE__ */ jsxs2("p", { "data-solvapay-auto-recharge-setup-loading": "", children: [
-      /* @__PURE__ */ jsx6(Spinner, { size: "sm" }),
+      /* @__PURE__ */ jsx7(Spinner, { size: "sm" }),
       " Loading card form\u2026"
     ] });
   }
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     Elements,
     {
       stripe: stripePromise,
       options: { clientSecret: setup.setupClientSecret },
-      children: /* @__PURE__ */ jsx6(CardSetupInner, { onComplete })
+      children: /* @__PURE__ */ jsx7(CardSetupInner, { onComplete })
     },
     setup.setupClientSecret
   );
@@ -2362,7 +1970,7 @@ function useAutoRechargeForm() {
 }
 
 // src/hooks/usePaywallResolver.ts
-import { useCallback as useCallback4, useMemo as useMemo5 } from "react";
+import { useCallback as useCallback4, useMemo as useMemo6 } from "react";
 function balanceCoversNextUnit(balance, credits) {
   if (!balance) return false;
   if (typeof balance.remainingUnits === "number" && balance.remainingUnits > 0) {
@@ -2376,7 +1984,7 @@ function balanceCoversNextUnit(balance, credits) {
 function usePaywallResolver(content) {
   const { activePurchase, hasPaidPurchase, refetch: refetchPurchase } = usePurchase();
   const { credits, refetch: refetchBalance } = useBalance();
-  const resolved = useMemo5(() => {
+  const resolved = useMemo6(() => {
     if (!content) return false;
     const productMatches = !content.product || activePurchase?.productRef === content.product || activePurchase?.productName === content.product;
     if (content.kind === "payment_required") {
@@ -2398,20 +2006,20 @@ function usePaywallResolver(content) {
 // src/primitives/PaywallNotice.tsx
 import {
   createContext as createContext6,
-  forwardRef as forwardRef7,
+  forwardRef as forwardRef8,
   useCallback as useCallback5,
-  useContext as useContext7,
-  useEffect as useEffect5,
-  useMemo as useMemo7,
-  useRef as useRef4
+  useContext as useContext8,
+  useEffect as useEffect4,
+  useMemo as useMemo8,
+  useRef as useRef3
 } from "react";
 
 // src/primitives/checkout/index.tsx
-import { createContext as createContext5, forwardRef as forwardRef6, useContext as useContext6, useMemo as useMemo6 } from "react";
-import { Fragment as Fragment4, jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+import { createContext as createContext5, forwardRef as forwardRef7, useContext as useContext7, useMemo as useMemo7 } from "react";
+import { Fragment as Fragment5, jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
 var CheckoutContext = createContext5(null);
 function useCheckoutContext(part) {
-  const ctx = useContext6(CheckoutContext);
+  const ctx = useContext7(CheckoutContext);
   if (!ctx) {
     throw new Error(`CheckoutSteps.${part} must be rendered inside <CheckoutSteps.Root>.`);
   }
@@ -2420,7 +2028,7 @@ function useCheckoutContext(part) {
 function useCheckoutSteps() {
   return useCheckoutContext("useCheckoutSteps");
 }
-var Root5 = forwardRef6(function CheckoutStepsRoot(props, forwardedRef) {
+var Root5 = forwardRef7(function CheckoutStepsRoot(props, forwardedRef) {
   const {
     productRef,
     returnUrl: _returnUrl,
@@ -2442,9 +2050,9 @@ var Root5 = forwardRef6(function CheckoutStepsRoot(props, forwardedRef) {
     children
   } = props;
   if (externalFlow) {
-    return /* @__PURE__ */ jsx7("div", { ref: forwardedRef, "data-solvapay-checkout": "", className, children: /* @__PURE__ */ jsx7(CheckoutContext.Provider, { value: externalFlow, children }) });
+    return /* @__PURE__ */ jsx8("div", { ref: forwardedRef, "data-solvapay-checkout": "", className, children: /* @__PURE__ */ jsx8(CheckoutContext.Provider, { value: externalFlow, children }) });
   }
-  return /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx8(
     RootWithPlanSelector,
     {
       productRef,
@@ -2487,11 +2095,11 @@ function RootWithPlanSelector({
   children
 }) {
   const { plans } = usePlans({ productRef });
-  const resolvedFilter = useMemo6(
+  const resolvedFilter = useMemo7(
     () => filter ?? buildDefaultCheckoutPlanFilter(plans),
     [filter, plans]
   );
-  return /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx8(
     PlanSelector.Root,
     {
       productRef,
@@ -2501,7 +2109,7 @@ function RootWithPlanSelector({
       currentPlanRef,
       autoSelectFirstPaid,
       initialPlanRef,
-      children: /* @__PURE__ */ jsx7(
+      children: /* @__PURE__ */ jsx8(
         FlowProvider,
         {
           productRef,
@@ -2543,22 +2151,22 @@ function FlowProvider({
     onPurchaseSuccess,
     onError
   });
-  return /* @__PURE__ */ jsx7("div", { ref: forwardedRef, "data-solvapay-checkout": "", "data-step": flow.step, className, children: /* @__PURE__ */ jsx7(CheckoutContext.Provider, { value: flow, children }) });
+  return /* @__PURE__ */ jsx8("div", { ref: forwardedRef, "data-solvapay-checkout": "", "data-step": flow.step, className, children: /* @__PURE__ */ jsx8(CheckoutContext.Provider, { value: flow, children }) });
 }
 function IfStep({ step, children }) {
   const flow = useCheckoutContext("IfStep");
   const matches = Array.isArray(step) ? step.includes(flow.step) : flow.step === step;
   if (!matches) return null;
-  return /* @__PURE__ */ jsx7(Fragment4, { children });
+  return /* @__PURE__ */ jsx8(Fragment5, { children });
 }
-var StepHeading = forwardRef6(function CheckoutStepsStepHeading({ asChild, children, className, ...rest }, forwardedRef) {
+var StepHeading = forwardRef7(function CheckoutStepsStepHeading({ asChild, children, className, ...rest }, forwardedRef) {
   const flow = useCheckoutContext("StepHeading");
   const copy = useCopy();
   const paywallCtx = usePaywallNoticeOptional();
   if (flow.step === "success") return null;
   const defaultText = resolveStepHeading(flow.step, copy, paywallCtx?.content ?? null);
   const Comp = asChild ? Slot : "h3";
-  return /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx8(
     Comp,
     {
       ref: forwardedRef,
@@ -2570,7 +2178,7 @@ var StepHeading = forwardRef6(function CheckoutStepsStepHeading({ asChild, child
     }
   );
 });
-var StepMessage = forwardRef6(
+var StepMessage = forwardRef7(
   function CheckoutStepsStepMessage({ asChild, children, className, ...rest }, forwardedRef) {
     const flow = useCheckoutContext("StepMessage");
     const copy = useCopy();
@@ -2579,7 +2187,7 @@ var StepMessage = forwardRef6(
     const defaultText = resolveStepMessage(flow, copy, paywallCtx?.content ?? null);
     if (!defaultText && children == null) return null;
     const Comp = asChild ? Slot : "p";
-    return /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx8(
       Comp,
       {
         ref: forwardedRef,
@@ -2627,21 +2235,21 @@ function resolveStepMessage(flow, copy, content) {
   return "";
 }
 function PlanGrid({ className, children }) {
-  return /* @__PURE__ */ jsx7(PlanSelector.Grid, { className: className ?? "solvapay-checkout-plan-grid", children: children ?? /* @__PURE__ */ jsxs3(PlanSelector.Card, { className: "solvapay-checkout-plan-card", children: [
-    /* @__PURE__ */ jsx7(PlanSelector.CardBadge, { className: "solvapay-checkout-plan-card-badge" }),
-    /* @__PURE__ */ jsx7(PlanSelector.CardName, { className: "solvapay-checkout-plan-card-name" }),
-    /* @__PURE__ */ jsx7(PlanSelector.CardPrice, { className: "solvapay-checkout-plan-card-price" }),
-    /* @__PURE__ */ jsx7(PlanSelector.CardInterval, { className: "solvapay-checkout-plan-card-interval" })
+  return /* @__PURE__ */ jsx8(PlanSelector.Grid, { className: className ?? "solvapay-checkout-plan-grid", children: children ?? /* @__PURE__ */ jsxs3(PlanSelector.Card, { className: "solvapay-checkout-plan-card", children: [
+    /* @__PURE__ */ jsx8(PlanSelector.CardBadge, { className: "solvapay-checkout-plan-card-badge" }),
+    /* @__PURE__ */ jsx8(PlanSelector.CardName, { className: "solvapay-checkout-plan-card-name" }),
+    /* @__PURE__ */ jsx8(PlanSelector.CardPrice, { className: "solvapay-checkout-plan-card-price" }),
+    /* @__PURE__ */ jsx8(PlanSelector.CardInterval, { className: "solvapay-checkout-plan-card-interval" })
   ] }) });
 }
-var PlanContinueButton = forwardRef6(
+var PlanContinueButton = forwardRef7(
   function PlanContinueButton2({ className, children, onClick, disabled, ...rest }, ref) {
     const flow = useCheckoutContext("PlanContinueButton");
     const locale = useLocale();
     const selectedPlanShape = flow.selectedPlan;
     const isDisabled = disabled || !flow.selectedPlanRef || flow.status === "activating";
     const label = children ?? formatContinueLabel(selectedPlanShape, locale);
-    return /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx8(
       "button",
       {
         ref,
@@ -2664,7 +2272,7 @@ var PlanContinueButton = forwardRef6(
 function AmountPicker2({ className, children }) {
   const flow = useCheckoutContext("AmountPicker");
   if (!flow.topupCurrencyReady || flow.topupCurrency == null) {
-    return /* @__PURE__ */ jsx7("div", { className: className ?? "solvapay-amount-picker", "data-state": "loading", "aria-busy": "true", children: /* @__PURE__ */ jsx7("div", { className: "solvapay-amount-picker-pills", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx8("div", { className: className ?? "solvapay-amount-picker", "data-state": "loading", "aria-busy": "true", children: /* @__PURE__ */ jsx8("div", { className: "solvapay-amount-picker-pills", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx8(
       "span",
       {
         className: "solvapay-amount-picker-pill",
@@ -2674,7 +2282,7 @@ function AmountPicker2({ className, children }) {
       i
     )) }) });
   }
-  return /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx8(
     AmountPicker.Root,
     {
       currency: flow.topupCurrency,
@@ -2685,16 +2293,16 @@ function AmountPicker2({ className, children }) {
           flow.selectAmount(value);
         }
       },
-      children: children ?? /* @__PURE__ */ jsx7(DefaultAmountTree, {})
+      children: children ?? /* @__PURE__ */ jsx8(DefaultAmountTree, {})
     }
   );
 }
 function DefaultAmountTree() {
   const ctx = useAmountPicker();
   const { selectAmountLabel, customAmountLabel, creditEstimate } = useAmountPickerCopy();
-  return /* @__PURE__ */ jsxs3(Fragment4, { children: [
-    /* @__PURE__ */ jsx7("p", { className: "solvapay-amount-picker-label", children: selectAmountLabel }),
-    /* @__PURE__ */ jsx7("div", { className: "solvapay-amount-picker-pills", children: ctx.quickAmounts.map((amount) => /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs3(Fragment5, { children: [
+    /* @__PURE__ */ jsx8("p", { className: "solvapay-amount-picker-label", children: selectAmountLabel }),
+    /* @__PURE__ */ jsx8("div", { className: "solvapay-amount-picker-pills", children: ctx.quickAmounts.map((amount) => /* @__PURE__ */ jsx8(
       AmountPicker.Option,
       {
         amount,
@@ -2703,10 +2311,10 @@ function DefaultAmountTree() {
       amount
     )) }),
     /* @__PURE__ */ jsxs3("div", { className: "solvapay-amount-picker-custom-wrapper", children: [
-      /* @__PURE__ */ jsx7("p", { className: "solvapay-amount-picker-custom-label", children: customAmountLabel }),
+      /* @__PURE__ */ jsx8("p", { className: "solvapay-amount-picker-custom-label", children: customAmountLabel }),
       /* @__PURE__ */ jsxs3("div", { className: "solvapay-amount-picker-custom-row", children: [
-        /* @__PURE__ */ jsx7("span", { className: "solvapay-amount-picker-currency-symbol", children: ctx.currencySymbol }),
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx8("span", { className: "solvapay-amount-picker-currency-symbol", children: ctx.currencySymbol }),
+        /* @__PURE__ */ jsx8(
           AmountPicker.Custom,
           {
             className: "solvapay-amount-picker-custom-input",
@@ -2715,7 +2323,7 @@ function DefaultAmountTree() {
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsx7(
+    /* @__PURE__ */ jsx8(
       "p",
       {
         className: "solvapay-amount-picker-credit-estimate",
@@ -2725,7 +2333,7 @@ function DefaultAmountTree() {
     )
   ] });
 }
-var AmountContinueButton = forwardRef6(
+var AmountContinueButton = forwardRef7(
   function AmountContinueButton2({ className, children, onClick, disabled, ...rest }, ref) {
     const flow = useCheckoutContext("AmountContinueButton");
     const locale = useLocale();
@@ -2734,7 +2342,7 @@ var AmountContinueButton = forwardRef6(
     const ready = flow.topupCurrencyReady && currency != null;
     const isDisabled = disabled || !ready || amountMinor == null;
     const label = children ?? (ready && currency != null && amountMinor != null ? `Continue \u2014 ${formatPrice(amountMinor, currency, { locale })}` : "Continue");
-    return /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx8(
       "button",
       {
         ref,
@@ -2757,10 +2365,10 @@ var AmountContinueButton = forwardRef6(
 function Payment({ className }) {
   const flow = useCheckoutContext("Payment");
   if (flow.branch === "payg") {
-    return /* @__PURE__ */ jsx7(PaygPayment, { className });
+    return /* @__PURE__ */ jsx8(PaygPayment, { className });
   }
   if (flow.branch === "recurring") {
-    return /* @__PURE__ */ jsx7(RecurringPayment, { className });
+    return /* @__PURE__ */ jsx8(RecurringPayment, { className });
   }
   return null;
 }
@@ -2775,9 +2383,9 @@ function PaygPayment({ className }) {
   if (!selectedPlanShape || amountMinor == null || currency == null) return null;
   const creditsAdded = creditsPerMinorUnit != null && creditsPerMinorUnit > 0 ? Math.floor(amountMinor / (displayExchangeRate ?? 1) * creditsPerMinorUnit) : null;
   return /* @__PURE__ */ jsxs3("div", { className: className ?? "solvapay-checkout-payment", "data-branch": "payg", children: [
-    /* @__PURE__ */ jsx7("div", { className: "solvapay-checkout-order-summary", "data-variant": "payg", children: /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-order-summary-row", children: [
-      /* @__PURE__ */ jsx7("span", { children: creditsAdded != null ? `${creditsAdded.toLocaleString(locale)} credits` : formatPrice(amountMinor, currency, { locale }) }),
-      creditsAdded != null ? /* @__PURE__ */ jsx7("span", { children: formatPrice(amountMinor, currency, { locale }) }) : null
+    /* @__PURE__ */ jsx8("div", { className: "solvapay-checkout-order-summary", "data-variant": "payg", children: /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-order-summary-row", children: [
+      /* @__PURE__ */ jsx8("span", { children: creditsAdded != null ? `${creditsAdded.toLocaleString(locale)} credits` : formatPrice(amountMinor, currency, { locale }) }),
+      creditsAdded != null ? /* @__PURE__ */ jsx8("span", { children: formatPrice(amountMinor, currency, { locale }) }) : null
     ] }) }),
     /* @__PURE__ */ jsxs3(
       TopupForm.Root,
@@ -2788,17 +2396,17 @@ function PaygPayment({ className }) {
         className: "solvapay-checkout-topup-form",
         onSuccess: (intent, extras) => flow.notifyPaymentSuccess(intent, extras),
         children: [
-          /* @__PURE__ */ jsx7(TopupForm.Loading, {}),
-          /* @__PURE__ */ jsx7(TopupForm.BusinessDetails.Root, { className: "solvapay-checkout-business-details", children: /* @__PURE__ */ jsx7(TopupForm.BusinessDetails.Fields, {}) }),
-          /* @__PURE__ */ jsx7(TopupForm.Summary.Root, { className: "solvapay-checkout-tax-summary", children: /* @__PURE__ */ jsx7(TopupForm.Summary.Rows, {}) }),
-          /* @__PURE__ */ jsx7(TopupForm.PaymentElement, {}),
-          /* @__PURE__ */ jsx7(TopupForm.Error, { className: "solvapay-checkout-error" }),
-          /* @__PURE__ */ jsx7(MandateText, { mode: "topup", amountMinor, currency }),
-          /* @__PURE__ */ jsx7("span", { className: "solvapay-secure-note", children: "Secure payment processed by Stripe" }),
+          /* @__PURE__ */ jsx8(TopupForm.Loading, {}),
+          /* @__PURE__ */ jsx8(TopupForm.BusinessDetails.Root, { className: "solvapay-checkout-business-details", children: /* @__PURE__ */ jsx8(TopupForm.BusinessDetails.Fields, {}) }),
+          /* @__PURE__ */ jsx8(TopupForm.Summary.Root, { className: "solvapay-checkout-tax-summary", children: /* @__PURE__ */ jsx8(TopupForm.Summary.Rows, {}) }),
+          /* @__PURE__ */ jsx8(TopupForm.PaymentElement, {}),
+          /* @__PURE__ */ jsx8(TopupForm.Error, { className: "solvapay-checkout-error" }),
+          /* @__PURE__ */ jsx8("span", { className: "solvapay-secure-note", children: "Secure payment processed by Stripe" }),
           /* @__PURE__ */ jsxs3(TopupForm.SubmitButton, { className: "solvapay-checkout-pay-button", children: [
             "Pay ",
             formatPrice(amountMinor, currency, { locale })
-          ] })
+          ] }),
+          /* @__PURE__ */ jsx8(MandateText, { mode: "topup", amountMinor, currency })
         ]
       }
     )
@@ -2813,15 +2421,15 @@ function RecurringPayment({ className }) {
   if (!selectedPlanShape || !flow.selectedPlanRef) return null;
   const currency = (selectedPlanShape.currency ?? "USD").toUpperCase();
   const amountMinor = selectedPlanShape.price ?? 0;
-  const cycle = planBillingInterval(selectedPlanShape);
+  const cycle = planBillingCycle(selectedPlanShape);
   const planName = selectedPlanShape.name ?? "Plan";
-  const isRecurring = !!cycle;
+  const isRecurring = cycle != null;
   const formattedAmount = formatPrice(amountMinor, currency, { locale });
-  const priceLine = isRecurring ? `${formattedAmount}/${shortCycle(cycle)}` : formattedAmount;
+  const priceLine = isRecurring ? `${formattedAmount}${formatCycleSuffix(cycle)}` : `${formattedAmount} once`;
   return /* @__PURE__ */ jsxs3("div", { className: className ?? "solvapay-checkout-payment", "data-branch": "recurring", children: [
-    /* @__PURE__ */ jsx7("div", { className: "solvapay-checkout-order-summary", "data-variant": "recurring", children: /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-order-summary-row", children: [
-      /* @__PURE__ */ jsx7("span", { children: planName }),
-      /* @__PURE__ */ jsx7("span", { children: priceLine })
+    /* @__PURE__ */ jsx8("div", { className: "solvapay-checkout-order-summary", "data-variant": "recurring", children: /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-order-summary-row", children: [
+      /* @__PURE__ */ jsx8("span", { children: planName }),
+      /* @__PURE__ */ jsx8("span", { children: priceLine })
     ] }) }),
     /* @__PURE__ */ jsxs3(
       PaymentForm.Root,
@@ -2832,14 +2440,14 @@ function RecurringPayment({ className }) {
         requireTermsAcceptance: false,
         onSuccess: (intent) => flow.notifyPaymentSuccess(intent),
         children: [
-          /* @__PURE__ */ jsx7(PaymentForm.Loading, {}),
-          /* @__PURE__ */ jsx7(PaymentForm.BusinessDetails.Root, { className: "solvapay-checkout-business-details", children: /* @__PURE__ */ jsx7(PaymentForm.BusinessDetails.Fields, {}) }),
-          /* @__PURE__ */ jsx7(PaymentForm.TaxSummary.Root, { className: "solvapay-checkout-tax-summary", children: /* @__PURE__ */ jsx7(PaymentForm.TaxSummary.Rows, {}) }),
-          /* @__PURE__ */ jsx7(PaymentForm.PaymentElement, {}),
-          /* @__PURE__ */ jsx7(PaymentForm.Error, { className: "solvapay-checkout-error" }),
-          /* @__PURE__ */ jsx7(PaymentForm.MandateText, {}),
-          /* @__PURE__ */ jsx7("span", { className: "solvapay-secure-note", children: "Secure payment processed by Stripe" }),
-          /* @__PURE__ */ jsx7(PaymentForm.SubmitButton, { className: "solvapay-checkout-pay-button", children: isRecurring ? `Subscribe \u2014 ${priceLine}` : `Pay ${formattedAmount}` })
+          /* @__PURE__ */ jsx8(PaymentForm.Loading, {}),
+          /* @__PURE__ */ jsx8(PaymentForm.BusinessDetails.Root, { className: "solvapay-checkout-business-details", children: /* @__PURE__ */ jsx8(PaymentForm.BusinessDetails.Fields, {}) }),
+          /* @__PURE__ */ jsx8(PaymentForm.TaxSummary.Root, { className: "solvapay-checkout-tax-summary", children: /* @__PURE__ */ jsx8(PaymentForm.TaxSummary.Rows, {}) }),
+          /* @__PURE__ */ jsx8(PaymentForm.PaymentElement, {}),
+          /* @__PURE__ */ jsx8(PaymentForm.Error, { className: "solvapay-checkout-error" }),
+          /* @__PURE__ */ jsx8("span", { className: "solvapay-secure-note", children: "Secure payment processed by Stripe" }),
+          /* @__PURE__ */ jsx8(PaymentForm.SubmitButton, { className: "solvapay-checkout-pay-button", children: isRecurring ? `Subscribe \u2014 ${priceLine}` : `Pay ${formattedAmount}` }),
+          /* @__PURE__ */ jsx8(PaymentForm.MandateText, {})
         ]
       }
     )
@@ -2847,12 +2455,12 @@ function RecurringPayment({ className }) {
 }
 var CheckoutEnvContext = createContext5(null);
 function useReturnUrl() {
-  return useContext6(CheckoutEnvContext)?.returnUrl ?? "";
+  return useContext7(CheckoutEnvContext)?.returnUrl ?? "";
 }
 function useProductRef() {
-  return useContext6(CheckoutEnvContext)?.productRef ?? "";
+  return useContext7(CheckoutEnvContext)?.productRef ?? "";
 }
-var BackLink = forwardRef6(function CheckoutStepsBackLink({ label, glyph = "\u2190", className, onClick, ...rest }, ref) {
+var BackLink = forwardRef7(function CheckoutStepsBackLink({ label, glyph = "\u2190", className, onClick, ...rest }, ref) {
   const flow = useCheckoutContext("BackLink");
   if (!flow.canGoBack) return null;
   const resolvedLabel = label ?? (flow.step === "payment" && flow.branch === "payg" ? "Change amount" : flow.step === "payment" && flow.branch === "recurring" ? "Change plan" : "Back");
@@ -2870,8 +2478,8 @@ var BackLink = forwardRef6(function CheckoutStepsBackLink({ label, glyph = "\u21
       },
       ...rest,
       children: [
-        /* @__PURE__ */ jsx7("span", { className: "solvapay-checkout-back-link-glyph", "aria-hidden": "true", children: glyph }),
-        /* @__PURE__ */ jsx7("span", { className: "solvapay-checkout-back-link-label", children: resolvedLabel })
+        /* @__PURE__ */ jsx8("span", { className: "solvapay-checkout-back-link-glyph", "aria-hidden": "true", children: glyph }),
+        /* @__PURE__ */ jsx8("span", { className: "solvapay-checkout-back-link-label", children: resolvedLabel })
       ]
     }
   );
@@ -2881,7 +2489,7 @@ function Success({ className, children }) {
   const locale = useLocale();
   if (flow.step !== "success" || !flow.successMeta) return null;
   if (children) {
-    return /* @__PURE__ */ jsx7("div", { className: className ?? "solvapay-checkout-success", children });
+    return /* @__PURE__ */ jsx8("div", { className: className ?? "solvapay-checkout-success", children });
   }
   const meta = flow.successMeta;
   if (meta.branch === "payg") {
@@ -2889,17 +2497,17 @@ function Success({ className, children }) {
     const chargedCurrency = meta.currency;
     const charged = chargedAmount != null && chargedCurrency != null;
     return /* @__PURE__ */ jsxs3("div", { className: className ?? "solvapay-checkout-success", "data-branch": "payg", children: [
-      /* @__PURE__ */ jsx7("div", { className: "solvapay-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
-      /* @__PURE__ */ jsx7("h2", { className: "solvapay-checkout-success-heading", children: charged ? "Credits added" : "Plan activated" }),
-      /* @__PURE__ */ jsx7("p", { className: "solvapay-checkout-success-subheading", children: "Pay as you go plan is active." }),
+      /* @__PURE__ */ jsx8("div", { className: "solvapay-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
+      /* @__PURE__ */ jsx8("h2", { className: "solvapay-checkout-success-heading", children: charged ? "Credits added" : "Plan activated" }),
+      /* @__PURE__ */ jsx8("p", { className: "solvapay-checkout-success-subheading", children: "Pay as you go plan is active." }),
       /* @__PURE__ */ jsxs3("dl", { className: "solvapay-checkout-receipt", "data-variant": "payg", children: [
-        charged ? /* @__PURE__ */ jsxs3(Fragment4, { children: [
+        charged ? /* @__PURE__ */ jsxs3(Fragment5, { children: [
           /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-receipt-row", children: [
-            /* @__PURE__ */ jsx7("dt", { children: "Amount" }),
-            /* @__PURE__ */ jsx7("dd", { children: formatPrice(chargedAmount, chargedCurrency, { locale }) })
+            /* @__PURE__ */ jsx8("dt", { children: "Amount" }),
+            /* @__PURE__ */ jsx8("dd", { children: formatPrice(chargedAmount, chargedCurrency, { locale }) })
           ] }),
           /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-receipt-row", children: [
-            /* @__PURE__ */ jsx7("dt", { children: "Credits" }),
+            /* @__PURE__ */ jsx8("dt", { children: "Credits" }),
             /* @__PURE__ */ jsxs3("dd", { children: [
               "+",
               (meta.creditsAdded ?? 0).toLocaleString(locale)
@@ -2907,30 +2515,30 @@ function Success({ className, children }) {
           ] })
         ] }) : null,
         /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-receipt-row", children: [
-          /* @__PURE__ */ jsx7("dt", { children: "Plan" }),
-          /* @__PURE__ */ jsx7("dd", { children: meta.plan.name ?? "Pay as you go" })
+          /* @__PURE__ */ jsx8("dt", { children: "Plan" }),
+          /* @__PURE__ */ jsx8("dd", { children: meta.plan.name ?? "Pay as you go" })
         ] }),
         meta.rateLabel ? /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-receipt-row", children: [
-          /* @__PURE__ */ jsx7("dt", { children: "Rate" }),
-          /* @__PURE__ */ jsx7("dd", { children: meta.rateLabel })
+          /* @__PURE__ */ jsx8("dt", { children: "Rate" }),
+          /* @__PURE__ */ jsx8("dd", { children: meta.rateLabel })
         ] }) : null
       ] })
     ] });
   }
   return /* @__PURE__ */ jsxs3("div", { className: className ?? "solvapay-checkout-success", "data-branch": "recurring", children: [
-    /* @__PURE__ */ jsx7("div", { className: "solvapay-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
+    /* @__PURE__ */ jsx8("div", { className: "solvapay-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
     /* @__PURE__ */ jsxs3("h2", { className: "solvapay-checkout-success-heading", children: [
       meta.plan.name ?? "Plan",
       " active"
     ] }),
-    /* @__PURE__ */ jsx7("p", { className: "solvapay-checkout-success-subheading", children: "Subscription is live and credits are ready." }),
+    /* @__PURE__ */ jsx8("p", { className: "solvapay-checkout-success-subheading", children: "Subscription is live and credits are ready." }),
     /* @__PURE__ */ jsxs3("dl", { className: "solvapay-checkout-receipt", "data-variant": "recurring", children: [
       /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-receipt-row", children: [
-        /* @__PURE__ */ jsx7("dt", { children: "Plan" }),
-        /* @__PURE__ */ jsx7("dd", { children: meta.plan.name ?? "Plan" })
+        /* @__PURE__ */ jsx8("dt", { children: "Plan" }),
+        /* @__PURE__ */ jsx8("dd", { children: meta.plan.name ?? "Plan" })
       ] }),
       meta.includedUnits != null ? /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-receipt-row", children: [
-        /* @__PURE__ */ jsx7("dt", { children: "Included" }),
+        /* @__PURE__ */ jsx8("dt", { children: "Included" }),
         /* @__PURE__ */ jsxs3("dd", { children: [
           meta.includedUnits.toLocaleString(locale),
           " ",
@@ -2938,23 +2546,23 @@ function Success({ className, children }) {
         ] })
       ] }) : null,
       /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-receipt-row", children: [
-        /* @__PURE__ */ jsx7("dt", { children: "Charged today" }),
-        /* @__PURE__ */ jsx7("dd", { children: formatPrice(meta.chargedTodayMinor, meta.currency, { locale }) })
+        /* @__PURE__ */ jsx8("dt", { children: "Charged today" }),
+        /* @__PURE__ */ jsx8("dd", { children: formatPrice(meta.chargedTodayMinor, meta.currency, { locale }) })
       ] }),
       meta.nextRenewalLabel ? /* @__PURE__ */ jsxs3("div", { className: "solvapay-checkout-receipt-row", children: [
-        /* @__PURE__ */ jsx7("dt", { children: "Next renewal" }),
-        /* @__PURE__ */ jsx7("dd", { children: meta.nextRenewalLabel })
+        /* @__PURE__ */ jsx8("dt", { children: "Next renewal" }),
+        /* @__PURE__ */ jsx8("dd", { children: meta.nextRenewalLabel })
       ] }) : null
     ] })
   ] });
 }
-var RootWithEnv = forwardRef6(
+var RootWithEnv = forwardRef7(
   function CheckoutStepsRootWithEnv(props, forwardedRef) {
-    const env = useMemo6(
+    const env = useMemo7(
       () => ({ returnUrl: props.returnUrl, productRef: props.productRef }),
       [props.returnUrl, props.productRef]
     );
-    return /* @__PURE__ */ jsx7(CheckoutEnvContext.Provider, { value: env, children: /* @__PURE__ */ jsx7(Root5, { ...props, ref: forwardedRef }) });
+    return /* @__PURE__ */ jsx8(CheckoutEnvContext.Provider, { value: env, children: /* @__PURE__ */ jsx8(Root5, { ...props, ref: forwardedRef }) });
   }
 );
 var CheckoutSteps = {
@@ -2983,32 +2591,32 @@ var CheckoutStepsBackLink2 = BackLink;
 var CheckoutStepsSuccess = Success;
 
 // src/primitives/PaywallNotice.tsx
-import { Fragment as Fragment5, jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
 var PaywallNoticeContext = createContext6(null);
 function usePaywallNoticeCtx(part) {
-  const ctx = useContext7(PaywallNoticeContext);
+  const ctx = useContext8(PaywallNoticeContext);
   if (!ctx) {
     throw new Error(`PaywallNotice.${part} must be rendered inside <PaywallNotice.Root>.`);
   }
   return ctx;
 }
-var Root6 = forwardRef7(function PaywallNoticeRoot({ content, onResolved, classNames, asChild, children, ...rest }, forwardedRef) {
+var Root6 = forwardRef8(function PaywallNoticeRoot({ content, onResolved, classNames, asChild, children, ...rest }, forwardedRef) {
   const { resolved, refetch } = usePaywallResolver(content);
-  const classNamesResolved = useMemo7(() => classNames ?? {}, [classNames]);
-  const onResolvedRef = useRef4(onResolved);
-  useEffect5(() => {
+  const classNamesResolved = useMemo8(() => classNames ?? {}, [classNames]);
+  const onResolvedRef = useRef3(onResolved);
+  useEffect4(() => {
     onResolvedRef.current = onResolved;
   }, [onResolved]);
-  const hasResolvedRef = useRef4(false);
+  const hasResolvedRef = useRef3(false);
   const signalResolved = useCallback5(() => {
     if (hasResolvedRef.current) return;
     hasResolvedRef.current = true;
     onResolvedRef.current?.();
   }, []);
-  useEffect5(() => {
+  useEffect4(() => {
     if (resolved) signalResolved();
   }, [resolved, signalResolved]);
-  const ctx = useMemo7(
+  const ctx = useMemo8(
     () => ({
       content,
       resolved,
@@ -3019,7 +2627,7 @@ var Root6 = forwardRef7(function PaywallNoticeRoot({ content, onResolved, classN
     [content, resolved, refetch, signalResolved, classNamesResolved]
   );
   const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ jsx8(PaywallNoticeContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(PaywallNoticeContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx9(
     Comp,
     {
       ref: forwardedRef,
@@ -3032,12 +2640,12 @@ var Root6 = forwardRef7(function PaywallNoticeRoot({ content, onResolved, classN
     }
   ) });
 });
-var Heading2 = forwardRef7(function PaywallNoticeHeading({ asChild, children, className, ...rest }, forwardedRef) {
+var Heading2 = forwardRef8(function PaywallNoticeHeading({ asChild, children, className, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("Heading");
   const copy = useCopy();
   const defaultText = ctx.resolved ? copy.paywall.resolvedHeading : ctx.content.kind === "payment_required" ? copy.paywall.paymentRequiredHeading : isTopupGate(ctx.content) ? copy.paywall.topupRequiredHeading : copy.paywall.activationRequiredHeading;
   const Comp = asChild ? Slot : "h2";
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     Comp,
     {
       ref: forwardedRef,
@@ -3048,12 +2656,12 @@ var Heading2 = forwardRef7(function PaywallNoticeHeading({ asChild, children, cl
     }
   );
 });
-var Message = forwardRef7(function PaywallNoticeMessage({ asChild, children, className, ...rest }, forwardedRef) {
+var Message = forwardRef8(function PaywallNoticeMessage({ asChild, children, className, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("Message");
   const copy = useCopy();
   const Comp = asChild ? Slot : "p";
   const defaultText = resolvePaywallMessage(ctx.content, copy.paywall);
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     Comp,
     {
       ref: forwardedRef,
@@ -3102,14 +2710,14 @@ function resolvePaywallMessage(content, paywallCopy) {
   }
   return content.message ?? "";
 }
-var ProductContext = forwardRef7(function PaywallNoticeProductContext({ asChild, children, className, ...rest }, forwardedRef) {
+var ProductContext = forwardRef8(function PaywallNoticeProductContext({ asChild, children, className, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("ProductContext");
   const copy = useCopy();
   const product = ctx.content.kind === "activation_required" ? ctx.content.productDetails : void 0;
   if (!product?.name) return null;
   const label = interpolate(copy.paywall.productContext, { product: product.name });
   const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     Comp,
     {
       ref: forwardedRef,
@@ -3120,7 +2728,7 @@ var ProductContext = forwardRef7(function PaywallNoticeProductContext({ asChild,
     }
   );
 });
-var Balance = forwardRef7(function PaywallNoticeBalance({ asChild, children, className, ...rest }, forwardedRef) {
+var Balance = forwardRef8(function PaywallNoticeBalance({ asChild, children, className, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("Balance");
   const copy = useCopy();
   const balance = ctx.content.balance;
@@ -3130,7 +2738,7 @@ var Balance = forwardRef7(function PaywallNoticeBalance({ asChild, children, cla
     required: String(balance.creditsPerUnit ?? 1)
   });
   const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     Comp,
     {
       ref: forwardedRef,
@@ -3146,27 +2754,28 @@ function Plans({ className, children }) {
   if (ctx.content.kind !== "activation_required") return null;
   if (!ctx.content.product) return null;
   const defaultClass = className ?? ctx.classNames.plans ?? "solvapay-paywall-plans";
-  return /* @__PURE__ */ jsx8("div", { "data-solvapay-paywall-plans": "", className: defaultClass, children: /* @__PURE__ */ jsx8(PlanSelector.Root, { productRef: ctx.content.product, filter: hidesFreePlan, children: children ?? /* @__PURE__ */ jsxs4(Fragment5, { children: [
-    /* @__PURE__ */ jsx8(PlanSelector.Grid, { children: /* @__PURE__ */ jsxs4(PlanSelector.Card, { children: [
-      /* @__PURE__ */ jsx8(PlanSelector.CardBadge, {}),
-      /* @__PURE__ */ jsx8(PlanSelector.CardName, {}),
-      /* @__PURE__ */ jsx8(PlanSelector.CardPrice, {}),
-      /* @__PURE__ */ jsx8(PlanSelector.CardInterval, {})
+  return /* @__PURE__ */ jsx9("div", { "data-solvapay-paywall-plans": "", className: defaultClass, children: /* @__PURE__ */ jsx9(PlanSelector.Root, { productRef: ctx.content.product, filter: hidesFreePlan, children: children ?? /* @__PURE__ */ jsxs4(Fragment6, { children: [
+    /* @__PURE__ */ jsx9(PlanSelector.Grid, { children: /* @__PURE__ */ jsxs4(PlanSelector.Card, { children: [
+      /* @__PURE__ */ jsx9(PlanSelector.CardBadge, {}),
+      /* @__PURE__ */ jsx9(PlanSelector.CardName, {}),
+      /* @__PURE__ */ jsx9(PlanSelector.CardPrice, {}),
+      /* @__PURE__ */ jsx9(PlanSelector.CardInterval, {})
     ] }) }),
-    /* @__PURE__ */ jsx8(PlanSelector.Loading, {}),
-    /* @__PURE__ */ jsx8(PlanSelector.Error, {})
+    /* @__PURE__ */ jsx9(PlanSelector.Loading, {}),
+    /* @__PURE__ */ jsx9(PlanSelector.Error, {})
   ] }) }) });
 }
 function hidesFreePlan(plan) {
   return plan.requiresPayment !== false;
 }
-var HostedCheckoutLink = forwardRef7(function PaywallNoticeHostedCheckoutLink({ asChild, children, className, ...rest }, forwardedRef) {
+var HostedCheckoutLink = forwardRef8(function PaywallNoticeHostedCheckoutLink({ asChild, children, className, onClick, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("HostedCheckoutLink");
   const copy = useCopy();
+  const handleExternalClick = useExternalLinkClick();
   const href = ctx.content.checkoutUrl;
   if (!href) return null;
   const Comp = asChild ? Slot : "a";
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     Comp,
     {
       ref: forwardedRef,
@@ -3175,6 +2784,7 @@ var HostedCheckoutLink = forwardRef7(function PaywallNoticeHostedCheckoutLink({
       rel: "noopener noreferrer",
       "data-solvapay-paywall-hosted-link": "",
       className: className ?? ctx.classNames.hostedLink,
+      onClick: composeEventHandlers(onClick, handleExternalClick),
       ...rest,
       children: children ?? copy.paywall.hostedCheckoutButton
     }
@@ -3184,7 +2794,7 @@ function EmbeddedCheckout({ returnUrl, topupCurrency, className }) {
   const ctx = usePaywallNoticeCtx("EmbeddedCheckout");
   const productRef = ctx.content.product;
   const { plans } = usePlans({ productRef: productRef ?? void 0 });
-  const filter = useMemo7(() => buildDefaultCheckoutPlanFilter(plans), [plans]);
+  const filter = useMemo8(() => buildDefaultCheckoutPlanFilter(plans), [plans]);
   if (!productRef) return null;
   const resolvedClassName = className ?? ctx.classNames.embeddedCheckout ?? "solvapay-paywall-embedded-checkout";
   const headingClassName = ctx.classNames.heading ?? "solvapay-paywall-step-heading";
@@ -3202,33 +2812,33 @@ function EmbeddedCheckout({ returnUrl, topupCurrency, className }) {
       },
       className: resolvedClassName,
       children: [
-        /* @__PURE__ */ jsx8(CheckoutSteps.StepHeading, { className: headingClassName }),
-        /* @__PURE__ */ jsx8(CheckoutSteps.StepMessage, { className: messageClassName }),
+        /* @__PURE__ */ jsx9(CheckoutSteps.StepHeading, { className: headingClassName }),
+        /* @__PURE__ */ jsx9(CheckoutSteps.StepMessage, { className: messageClassName }),
         /* @__PURE__ */ jsxs4(CheckoutSteps.IfStep, { step: "plan", children: [
-          /* @__PURE__ */ jsx8(CheckoutSteps.PlanGrid, {}),
-          /* @__PURE__ */ jsx8(PlanSelector.Loading, {}),
-          /* @__PURE__ */ jsx8(PlanSelector.Error, {}),
-          /* @__PURE__ */ jsx8(CheckoutSteps.PlanContinueButton, {})
+          /* @__PURE__ */ jsx9(CheckoutSteps.PlanGrid, {}),
+          /* @__PURE__ */ jsx9(PlanSelector.Loading, {}),
+          /* @__PURE__ */ jsx9(PlanSelector.Error, {}),
+          /* @__PURE__ */ jsx9(CheckoutSteps.PlanContinueButton, {})
         ] }),
         /* @__PURE__ */ jsxs4(CheckoutSteps.IfStep, { step: "amount", children: [
-          /* @__PURE__ */ jsx8(CheckoutSteps.BackLink, {}),
-          /* @__PURE__ */ jsx8(CheckoutSteps.AmountPicker, {}),
-          /* @__PURE__ */ jsx8(CheckoutSteps.AmountContinueButton, {})
+          /* @__PURE__ */ jsx9(CheckoutSteps.BackLink, {}),
+          /* @__PURE__ */ jsx9(CheckoutSteps.AmountPicker, {}),
+          /* @__PURE__ */ jsx9(CheckoutSteps.AmountContinueButton, {})
         ] }),
         /* @__PURE__ */ jsxs4(CheckoutSteps.IfStep, { step: "payment", children: [
-          /* @__PURE__ */ jsx8(CheckoutSteps.BackLink, {}),
-          /* @__PURE__ */ jsx8(CheckoutSteps.Payment, {})
+          /* @__PURE__ */ jsx9(CheckoutSteps.BackLink, {}),
+          /* @__PURE__ */ jsx9(CheckoutSteps.Payment, {})
         ] }),
-        /* @__PURE__ */ jsx8(CheckoutSteps.IfStep, { step: "success", children: /* @__PURE__ */ jsx8(CheckoutSteps.Success, {}) })
+        /* @__PURE__ */ jsx9(CheckoutSteps.IfStep, { step: "success", children: /* @__PURE__ */ jsx9(CheckoutSteps.Success, {}) })
       ]
     }
   );
 }
-var Retry = forwardRef7(function PaywallNoticeRetry({ asChild, children, className, onClick, ...rest }, forwardedRef) {
+var Retry = forwardRef8(function PaywallNoticeRetry({ asChild, children, className, onClick, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("Retry");
   const copy = useCopy();
   const Comp = asChild ? Slot : "button";
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     Comp,
     {
       ref: forwardedRef,
@@ -3261,7 +2871,7 @@ function usePaywallNotice() {
   return usePaywallNoticeCtx("usePaywallNotice");
 }
 function usePaywallNoticeOptional() {
-  return useContext7(PaywallNoticeContext);
+  return useContext8(PaywallNoticeContext);
 }
 
 export {
@@ -3286,6 +2896,7 @@ export {
   ActivationFlowError2 as ActivationFlowError,
   ActivationFlow,
   useActivationFlow,
+  CancelPlanButton,
   CreditGateRoot2 as CreditGateRoot,
   CreditGateHeading2 as CreditGateHeading,
   CreditGateSubheading2 as CreditGateSubheading,
@@ -3294,8 +2905,6 @@ export {
   CreditGateError2 as CreditGateError,
   CreditGate,
   useCreditGate,
-  useAutoRecharge,
-  configToAutoRechargeInput,
   AutoRechargeRoot2 as AutoRechargeRoot,
   AutoRechargeLoading2 as AutoRechargeLoading,
   AutoRechargeCard2 as AutoRechargeCard,