@solvapay/react 1.3.0 → 1.4.0-preview-ecd61384a4e849717e13d47ab2daa086cdcd91c5

package/dist/primitives/index.cjs

@@ -45,6 +45,40 @@ __export(primitives_exports, {
   AmountPickerCustom: () => AmountPickerCustom2,
   AmountPickerOption: () => AmountPickerOption2,
   AmountPickerRoot: () => AmountPickerRoot2,
+  AutoRecharge: () => AutoRecharge,
+  AutoRechargeActions: () => AutoRechargeActions2,
+  AutoRechargeAmountField: () => AutoRechargeAmountField2,
+  AutoRechargeBody: () => AutoRechargeBody2,
+  AutoRechargeCancelButton: () => AutoRechargeCancelButton2,
+  AutoRechargeCard: () => AutoRechargeCard2,
+  AutoRechargeCardHeading: () => AutoRechargeCardHeading2,
+  AutoRechargeCardSetup: () => AutoRechargeCardSetup,
+  AutoRechargeCardSummary: () => AutoRechargeCardSummary2,
+  AutoRechargeContent: () => AutoRechargeContent2,
+  AutoRechargeDescription: () => AutoRechargeDescription2,
+  AutoRechargeDisableButton: () => AutoRechargeDisableButton2,
+  AutoRechargeEnableQuestion: () => AutoRechargeEnableQuestion2,
+  AutoRechargeEnableRow: () => AutoRechargeEnableRow2,
+  AutoRechargeEnableSentence: () => AutoRechargeEnableSentence2,
+  AutoRechargeEnableSwitch: () => AutoRechargeEnableSwitch2,
+  AutoRechargeError: () => AutoRechargeError2,
+  AutoRechargeFields: () => AutoRechargeFields2,
+  AutoRechargeHeader: () => AutoRechargeHeader2,
+  AutoRechargeHint: () => AutoRechargeHint2,
+  AutoRechargeLoading: () => AutoRechargeLoading2,
+  AutoRechargeOverlay: () => AutoRechargeOverlay2,
+  AutoRechargeRoot: () => AutoRechargeRoot2,
+  AutoRechargeSaveButton: () => AutoRechargeSaveButton2,
+  AutoRechargeSetup: () => AutoRechargeSetup2,
+  AutoRechargeStatus: () => AutoRechargeStatus2,
+  AutoRechargeStatusMessage: () => AutoRechargeStatusMessage2,
+  AutoRechargeSummary: () => AutoRechargeSummary2,
+  AutoRechargeThresholdField: () => AutoRechargeThresholdField2,
+  AutoRechargeTitle: () => AutoRechargeTitle2,
+  AutoRechargeTopupField: () => AutoRechargeTopupField2,
+  AutoRechargeTrigger: () => AutoRechargeTrigger2,
+  AutoRechargeUnitToggle: () => AutoRechargeUnitToggle2,
+  AutoRechargeValidationError: () => AutoRechargeValidationError2,
   BalanceBadge: () => BalanceBadge,
   CancelPlanButton: () => CancelPlanButton,
   CancelledPlanNotice: () => CancelledPlanNotice,
@@ -105,7 +139,7 @@ __export(primitives_exports, {
   PaywallNoticePlans: () => Plans,
   PaywallNoticeProductContext: () => ProductContext,
   PaywallNoticeRetry: () => Retry,
-  PaywallNoticeRoot: () => Root11,
+  PaywallNoticeRoot: () => Root12,
   PlanBadge: () => PlanBadge,
   PlanSelector: () => PlanSelector,
   PlanSelectorCard: () => PlanSelectorCard2,
@@ -140,16 +174,17 @@ __export(primitives_exports, {
   UsageMeterBar: () => Bar,
   UsageMeterEmpty: () => Empty,
   UsageMeterLabel: () => Label,
-  UsageMeterLoading: () => Loading7,
+  UsageMeterLoading: () => Loading8,
   UsageMeterPercentage: () => Percentage,
   UsageMeterResetsIn: () => ResetsIn,
-  UsageMeterRoot: () => Root12,
+  UsageMeterRoot: () => Root13,
   composeEventHandlers: () => composeEventHandlers,
   composeRefs: () => composeRefs,
   setRef: () => setRef,
   useActivationFlow: () => useActivationFlow,
   useAmountPicker: () => useAmountPicker,
   useAmountPickerCopy: () => useAmountPickerCopy,
+  useAutoRechargeForm: () => useAutoRechargeForm,
   useCancelledPlanNotice: () => useCancelledPlanNotice,
   useCheckoutStepsContext: () => useCheckoutSteps,
   useCheckoutSummary: () => useCheckoutSummary,
@@ -417,6 +452,7 @@ var DEFAULT_ROUTES = {
   getProduct: "/api/get-product",
   listPlans: "/api/list-plans",
   getPaymentMethod: "/api/payment-method",
+  autoRecharge: "/api/auto-recharge",
   getUsage: "/api/usage",
   getLimits: "/api/limits"
 };
@@ -454,7 +490,11 @@ function createHttpTransport(config) {
     }),
     createTopupPayment: (params) => request(config, routeFor(config, "createTopupPayment"), {
       method: "POST",
-      body: { amount: params.amount, currency: params.currency },
+      body: {
+        amount: params.amount,
+        currency: params.currency,
+        ...params.autoRecharge ? { autoRecharge: params.autoRecharge } : {}
+      },
       onErrorContext: "createTopupPayment",
       errorPrefix: "Failed to create topup payment"
     }),
@@ -503,16 +543,12 @@ function createHttpTransport(config) {
         }
       );
     },
-    createCustomerSession: () => request(
-      config,
-      routeFor(config, "createCustomerSession"),
-      {
-        method: "POST",
-        body: {},
-        onErrorContext: "createCustomerSession",
-        errorPrefix: "Failed to create customer session"
-      }
-    ),
+    createCustomerSession: () => request(config, routeFor(config, "createCustomerSession"), {
+      method: "POST",
+      body: {},
+      onErrorContext: "createCustomerSession",
+      errorPrefix: "Failed to create customer session"
+    }),
     getMerchant: () => request(config, routeFor(config, "getMerchant"), {
       method: "GET",
       onErrorContext: "getMerchant",
@@ -542,6 +578,22 @@ function createHttpTransport(config) {
       onErrorContext: "getPaymentMethod",
       errorPrefix: "Failed to load payment method"
     }),
+    getAutoRecharge: () => request(config, routeFor(config, "autoRecharge"), {
+      method: "GET",
+      onErrorContext: "getAutoRecharge",
+      errorPrefix: "Failed to load auto-recharge"
+    }),
+    saveAutoRecharge: (input) => request(config, routeFor(config, "autoRecharge"), {
+      method: "PUT",
+      body: input,
+      onErrorContext: "saveAutoRecharge",
+      errorPrefix: "Failed to save auto-recharge"
+    }),
+    disableAutoRecharge: () => request(config, routeFor(config, "autoRecharge"), {
+      method: "DELETE",
+      onErrorContext: "disableAutoRecharge",
+      errorPrefix: "Failed to disable auto-recharge"
+    }),
     getUsage: () => request(config, routeFor(config, "getUsage"), {
       method: "GET",
       onErrorContext: "getUsage",
@@ -680,6 +732,42 @@ var enCopy = {
     creditEstimateExact: "= {credits} credits",
     creditEstimateApprox: "~ {credits} credits"
   },
+  autoRecharge: {
+    heading: "Auto recharge",
+    description: "Automatically top up so you never run out \u2014 recommended for production. You can turn this off anytime.",
+    settingsHeading: "Auto recharge settings",
+    setupTriggerLabel: "Set up auto-recharge",
+    modifyTriggerLabel: "Modify",
+    notConfiguredHint: "Automatic top-ups are off. Set up auto-recharge if you want credits added when your balance runs low.",
+    enableLabel: "Enable auto-recharge",
+    enableQuestion: "Would you like to set up automatic recharge?",
+    enableSentence: "Yes, automatically recharge my card when my credit balance falls below a threshold",
+    thresholdLabel: "When balance falls below",
+    thresholdAriaLabel: "Balance threshold",
+    fixedAmountLabel: "Add this amount",
+    fixedAmountAriaLabel: "Fixed top-up amount",
+    saveButton: "Save settings",
+    cancelButton: "Cancel",
+    disableButton: "Disable automatic top-up",
+    savedMessage: "Automatic top-up settings saved.",
+    disabledMessage: "Automatic top-ups disabled.",
+    setupRequiredMessage: "Confirm your card to activate automatic top-ups.",
+    setupHeading: "Authorize card",
+    setupDescription: "Authorize a card for automatic top-ups. You will not be charged now.",
+    setupSubmit: "Save card for auto-recharge",
+    setupProcessing: "Authorizing...",
+    setupAwaitingConfirmation: "Card authorized. Finishing activation \u2014 this can take a moment.",
+    setupAuthFailed: "Card authentication failed. Please try a different card.",
+    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}).",
+    creditsPerRecharge: "\u2248 {credits} credits per recharge",
+    creditsPerRechargeApprox: "~ {credits} credits per recharge",
+    currencyPerRecharge: "\u2248 {amount} per recharge",
+    currencyPerRechargeApprox: "~ {amount} per recharge",
+    statusFailed: "Payment failed \u2014 update your card to resume"
+  },
   activationFlow: {
     heading: "Confirm your plan",
     activateButton: "Activate",
@@ -4306,7 +4394,7 @@ function getStripeCacheKey2(publishableKey, accountId) {
   return accountId ? `${publishableKey}:${accountId}` : publishableKey;
 }
 function useTopup(options) {
-  const { amount, currency } = options;
+  const { amount, currency, autoRecharge } = options;
   const { createTopupPayment, customerRef, updateCustomerRef } = useSolvaPay();
   const [loading, setLoading] = (0, import_react27.useState)(false);
   const [error, setError] = (0, import_react27.useState)(null);
@@ -4325,7 +4413,7 @@ function useTopup(options) {
     setLoading(true);
     setError(null);
     try {
-      const result = await createTopupPayment({ amount, currency });
+      const result = await createTopupPayment({ amount, currency, autoRecharge });
       if (!result || typeof result !== "object") {
         throw new Error("Invalid topup payment intent response from server");
       }
@@ -4357,7 +4445,7 @@ function useTopup(options) {
       setLoading(false);
       isStartingRef.current = false;
     }
-  }, [amount, currency, createTopupPayment, customerRef, updateCustomerRef, loading]);
+  }, [amount, currency, autoRecharge, createTopupPayment, customerRef, updateCustomerRef, loading]);
   const reset = (0, import_react27.useCallback)(() => {
     isStartingRef.current = false;
     setLoading(false);
@@ -4389,6 +4477,7 @@ var Root7 = (0, import_react28.forwardRef)(function TopupFormRoot(props, forward
   const {
     amount,
     currency,
+    autoRecharge,
     onSuccess,
     onError,
     returnUrl,
@@ -4412,7 +4501,8 @@ var Root7 = (0, import_react28.forwardRef)(function TopupFormRoot(props, forward
     stripePromise
   } = useTopup({
     amount,
-    currency
+    currency,
+    autoRecharge
   });
   const hasInitializedRef = (0, import_react28.useRef)(false);
   const hasAmount = amount > 0;
@@ -4901,170 +4991,1784 @@ function usePurchaseGate() {
   return useGateCtx2("usePurchaseGate");
 }
 
-// src/primitives/ProductBadge.tsx
+// src/primitives/AutoRecharge.tsx
+var import_react32 = require("react");
+var import_react_dom = require("react-dom");
+var import_react_stripe_js3 = require("@stripe/react-stripe-js");
+var import_stripe_js3 = require("@stripe/stripe-js");
+
+// src/hooks/useAutoRecharge.ts
 var import_react31 = require("react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var ProductBadgeImpl = (0, import_react31.forwardRef)(function ProductBadge({ asChild, children, ...rest }, forwardedRef) {
-  const solva = (0, import_react31.useContext)(SolvaPayContext);
-  if (!solva) throw new MissingProviderError("ProductBadge");
-  const { purchases, loading, hasPaidPurchase, activePurchase } = usePurchase();
-  const copy = useCopy();
-  const [hasLoadedOnce, setHasLoadedOnce] = (0, import_react31.useState)(false);
+
+// src/hooks/autoRechargeCache.ts
+var autoRechargeCache = /* @__PURE__ */ new Map();
+var CACHE_DURATION5 = 5 * 60 * 1e3;
+function autoRechargeCacheKeyFor(config) {
+  return createTransportCacheKey(config, config?.api?.autoRecharge || "/api/auto-recharge");
+}
+
+// src/hooks/useAutoRecharge.ts
+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] = (0, import_react31.useState)(
+    () => autoRechargeCache.get(key)?.config ?? null
+  );
+  const [loading, setLoading] = (0, import_react31.useState)(() => {
+    const cached = autoRechargeCache.get(key);
+    return !cached || !cached.config && !cached.promise;
+  });
+  const [saving, setSaving] = (0, import_react31.useState)(false);
+  const [disabling, setDisabling] = (0, import_react31.useState)(false);
+  const [error, setError] = (0, import_react31.useState)(null);
+  const requestSeq = (0, import_react31.useRef)(0);
+  const load = (0, import_react31.useCallback)(
+    async (force = false) => {
+      const seq = requestSeq.current;
+      const cached = autoRechargeCache.get(key);
+      const now = Date.now();
+      if (!force && cached?.config && now - cached.timestamp < CACHE_DURATION5) {
+        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);
+      autoRechargeCache.set(key, {
+        config: cached?.config ?? null,
+        promise,
+        timestamp: now
+      });
+      try {
+        const value = await promise;
+        if (seq !== requestSeq.current) return;
+        autoRechargeCache.set(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));
+        autoRechargeCache.set(key, { config: null, promise: null, timestamp: Date.now() });
+        setError(err);
+      } finally {
+        if (seq === requestSeq.current) {
+          setLoading(false);
+        }
+      }
+    },
+    [_config, key]
+  );
   (0, import_react31.useEffect)(() => {
-    if (!loading) setHasLoadedOnce(true);
-  }, [loading]);
-  const planToDisplay = activePurchase?.productName ?? null;
-  const shouldShow = planToDisplay !== null && (!loading || hasLoadedOnce);
-  if (!shouldShow) return null;
-  const commonProps = {
-    "data-solvapay-product-badge": "",
-    "data-loading": loading ? "" : void 0,
-    "data-has-purchase": activePurchase ? "" : void 0,
-    "data-has-paid-purchase": hasPaidPurchase ? "" : void 0,
-    role: "status",
-    "aria-live": "polite",
-    "aria-busy": loading,
-    "aria-label": interpolate(copy.product.currentProductLabel, { name: planToDisplay }),
-    ...rest
-  };
-  if (asChild) {
-    return (
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Slot, { ref: forwardedRef, ...commonProps, children: children ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_jsx_runtime22.Fragment, { children: planToDisplay }) })
-    );
-  }
-  void purchases;
-  return (
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { ref: forwardedRef, ...commonProps, children: children ?? planToDisplay })
+    void load();
+  }, [load]);
+  const refresh = (0, import_react31.useCallback)(
+    async (force = true) => {
+      await load(force);
+    },
+    [load]
   );
-});
-var ProductBadge2 = ProductBadgeImpl;
-var PlanBadge = ProductBadgeImpl;
+  const save = (0, import_react31.useCallback)(
+    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);
+        autoRechargeCache.set(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 = (0, import_react31.useCallback)(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;
+          autoRechargeCache.set(key, {
+            config: disabledConfig,
+            promise: null,
+            timestamp: Date.now()
+          });
+          return disabledConfig;
+        });
+        await refresh(true);
+        setConfig((current) => {
+          const disabledConfig = current ? { ...current, enabled: false } : null;
+          autoRechargeCache.set(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/primitives/PaywallNotice.tsx
-var import_react36 = require("react");
+// src/primitives/autoRechargeActivation.ts
+var defaultSleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+async function waitForAutoRechargeActivation({
+  refresh,
+  getStatus,
+  attempts = 5,
+  delayMs = 800,
+  sleep = defaultSleep
+}) {
+  for (let attempt = 0; attempt < attempts; attempt++) {
+    await refresh(true);
+    if (getStatus() === "active") return true;
+    if (attempt < attempts - 1) await sleep(delayMs);
+  }
+  return getStatus() === "active";
+}
 
-// src/primitives/checkout/index.tsx
-var import_react34 = require("react");
+// src/primitives/setupIntentReturn.ts
+var SETUP_INTENT_PARAMS = ["setup_intent", "setup_intent_client_secret", "redirect_status"];
+function readSetupIntentClientSecret(search) {
+  return new URLSearchParams(search).get("setup_intent_client_secret");
+}
+function stripSetupIntentParams() {
+  if (typeof window === "undefined") return;
+  const url = new URL(window.location.href);
+  let changed = false;
+  for (const param of SETUP_INTENT_PARAMS) {
+    if (url.searchParams.has(param)) {
+      url.searchParams.delete(param);
+      changed = true;
+    }
+  }
+  if (!changed) return;
+  const query = url.searchParams.toString();
+  window.history.replaceState({}, "", `${url.pathname}${query ? `?${query}` : ""}${url.hash}`);
+}
 
-// src/hooks/useCheckoutFlow.ts
-var import_react33 = require("react");
+// src/utils/credit-estimation.ts
+var import_core2 = require("@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 = (0, import_core2.creditsToDisplayMinorUnits)({
+    credits,
+    creditsPerMinorUnit,
+    displayExchangeRate: rate,
+    displayCurrency: currency
+  });
+  if (displayMinor === null) return null;
+  return displayMinor / getMinorUnitsPerMajor(currency);
+}
 
-// src/hooks/useTransport.ts
-var import_react32 = require("react");
-function useTransport() {
-  const { _config } = useSolvaPay();
-  return (0, import_react32.useMemo)(() => _config?.transport ?? createHttpTransport(_config), [_config]);
+// 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/primitives/checkout/shared.ts
-function isPayg(plan) {
-  return isPaygPlan(plan ?? null);
+// 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})."
+};
+function amountAnchors(thresholdValue, topupValue, unit = "currency") {
+  return {
+    thresholdBaseValue: thresholdValue,
+    thresholdBaseUnit: unit,
+    topupBaseValue: topupValue,
+    topupBaseUnit: unit
+  };
 }
-function planSortByPaygFirstThenAsc(a, b) {
-  const aPayg = isPayg(a);
-  const bPayg = isPayg(b);
-  if (aPayg && !bPayg) return -1;
-  if (!aPayg && bPayg) return 1;
-  return (a.price ?? 0) - (b.price ?? 0);
+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",
+    ...amountAnchors(threshold, topup, "currency")
+  };
 }
-function buildDefaultCheckoutPlanFilter(allPlans) {
-  const hasNonPaygPaid = allPlans.some(
-    (p) => p.requiresPayment !== false && !isPayg(p)
-  );
-  return (plan) => {
-    if (plan.requiresPayment === false) return false;
-    if (hasNonPaygPaid && isPayg(plan)) return false;
-    return true;
+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: "" }
+        )
+      })
+    };
+  }
+  return { ok: true, payload };
 }
-function formatContinueLabel(plan, locale, pricingOption) {
-  if (!plan) return "Continue";
-  if (isPayg(plan)) {
-    return `Continue with ${plan.name ?? "Pay as you go"}`;
+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;
   }
-  const option = pricingOption ?? resolvePlanPricingOption(plan, null);
-  const currency = option.currency.toUpperCase();
-  const priceLabel = formatPrice(option.price ?? 0, currency, { locale });
-  const cycle = plan.billingCycle ? `/${shortCycle(plan.billingCycle)}` : "";
-  return `Continue with ${plan.name ?? "Plan"} \u2014 ${priceLabel}${cycle}`;
+  return thresholdAmountMinor / minorPerMajor;
+}
+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,
+      ...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,
+    ...amountAnchors(thresholdStr, topupStr, "currency")
+  };
 }
-function formatPaygRate(plan, locale) {
-  const creditsPerUnit = plan.creditsPerUnit ?? 1;
-  const creditLabel = creditsPerUnit === 1 ? "credit" : "credits";
-  return `${creditsPerUnit.toLocaleString(locale)} ${creditLabel} / call`;
+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 inferIncludedCredits(plan) {
-  const price = plan.price ?? 0;
-  const creditsPerUnit = plan.creditsPerUnit ?? 0;
-  if (price > 0 && creditsPerUnit > 0) {
-    return Math.round(price * creditsPerUnit);
+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;
   }
-  return 0;
+  const major = estimateCurrencyMajorFromCredits(
+    parsed,
+    currency,
+    creditsPerMinorUnit,
+    displayExchangeRate
+  );
+  return major != null ? String(major) : value;
 }
-function shortCycle(cycle) {
-  if (!cycle) return "mo";
-  const lc = cycle.toLowerCase();
-  if (lc.startsWith("year") || lc === "annually" || lc === "annual") return "yr";
-  if (lc.startsWith("week")) return "wk";
-  if (lc.startsWith("day")) return "d";
-  return "mo";
+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/hooks/useCheckoutFlow.ts
-function useCheckoutFlow(opts) {
-  const {
-    productRef,
-    initialStep = "plan",
-    initialAmountMinor = null
-  } = opts;
-  const onPlanSelectRef = (0, import_react33.useRef)(opts.onPlanSelect);
-  const onAmountSelectRef = (0, import_react33.useRef)(opts.onAmountSelect);
-  const onPurchaseSuccessRef = (0, import_react33.useRef)(opts.onPurchaseSuccess);
-  const onErrorRef = (0, import_react33.useRef)(opts.onError);
-  onPlanSelectRef.current = opts.onPlanSelect;
-  onAmountSelectRef.current = opts.onAmountSelect;
-  onPurchaseSuccessRef.current = opts.onPurchaseSuccess;
-  onErrorRef.current = opts.onError;
-  const planCtx = usePlanSelector();
-  const planSelection = usePlanSelection();
-  const transport = useTransport();
-  const locale = useLocale();
-  const balance = useBalance();
-  const { creditsPerMinorUnit, displayExchangeRate, adjustBalance } = balance;
-  const { refetchPurchase } = useSolvaPay();
-  const { merchant } = useMerchant();
-  const [topupCurrencyOverride, setTopupCurrencyOverride] = (0, import_react33.useState)(null);
-  const topupCurrencies = (0, import_react33.useMemo)(() => {
-    const fromMerchant = (merchant?.supportedTopupCurrencies ?? []).map((code) => code.toUpperCase()).filter(Boolean);
-    const fallback = opts.topupCurrency?.toUpperCase() ?? merchant?.defaultCurrency?.toUpperCase() ?? null;
-    const list = fromMerchant.length > 0 ? fromMerchant : fallback ? [fallback] : [];
-    return Array.from(new Set(list));
-  }, [merchant?.supportedTopupCurrencies, merchant?.defaultCurrency, opts.topupCurrency]);
-  const resolvedDefaultTopupCurrency = opts.topupCurrency?.toUpperCase() ?? merchant?.defaultCurrency?.toUpperCase() ?? null;
-  const planPickerCurrency = planCtx.preferredCurrency?.toUpperCase() ?? null;
-  const topupCurrency = (topupCurrencyOverride && topupCurrencies.includes(topupCurrencyOverride) ? topupCurrencyOverride : null) ?? (planPickerCurrency && topupCurrencies.includes(planPickerCurrency) ? planPickerCurrency : null) ?? resolvedDefaultTopupCurrency;
-  const topupCurrencyReady = topupCurrency != null;
-  const setTopupCurrency = (0, import_react33.useCallback)(
-    (code) => {
-      const normalized = code.toUpperCase();
-      setTopupCurrencyOverride(normalized);
-    },
-    []
-  );
-  const [step, setStep] = (0, import_react33.useState)(initialStep);
-  const [status, setStatus] = (0, import_react33.useState)("idle");
-  const [selectedAmountMinor, setSelectedAmountMinor] = (0, import_react33.useState)(initialAmountMinor);
-  const [successMeta, setSuccessMeta] = (0, import_react33.useState)(null);
-  const [error, setError] = (0, import_react33.useState)(null);
-  const selectedAmountMinorRef = (0, import_react33.useRef)(initialAmountMinor);
-  const selectedPlan = planCtx.selectedPlan;
-  const selectedPlanRef = planCtx.selectedPlanRef;
-  const selectedPlanShape = selectedPlan;
-  const branch = selectedPlanShape ? isPayg(selectedPlanShape) ? "payg" : "recurring" : null;
-  const canGoBack = step === "amount" || step === "payment";
-  const selectPlan = (0, import_react33.useCallback)(
+// src/primitives/AutoRecharge.tsx
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var AutoRechargeContext = (0, import_react32.createContext)(null);
+function useAutoRechargeCtx(part) {
+  const ctx = (0, import_react32.useContext)(AutoRechargeContext);
+  if (!ctx) {
+    throw new Error(`AutoRecharge.${part} must be rendered inside <AutoRecharge.Root>.`);
+  }
+  return ctx;
+}
+function getCurrencySymbol2(currency) {
+  try {
+    const parts = new Intl.NumberFormat("en", { style: "currency", currency }).formatToParts(0);
+    const sym = parts.find((p) => p.type === "currency");
+    return sym?.value ?? currency.toUpperCase();
+  } catch {
+    return currency.toUpperCase();
+  }
+}
+var stripePromiseCache3 = /* @__PURE__ */ new Map();
+function getStripeCacheKey3(publishableKey, accountId) {
+  return accountId ? `${publishableKey}:${accountId}` : publishableKey;
+}
+var Root10 = (0, import_react32.forwardRef)(function AutoRechargeRoot({
+  currency = "USD",
+  defaultThresholdAmountMajor,
+  defaultTopupAmountMajor,
+  open: openProp,
+  defaultOpen = false,
+  onOpenChange,
+  onSetupRequired,
+  onSaved,
+  onDisabled,
+  deferCardSetup = false,
+  onPendingConfig,
+  asChild,
+  children,
+  className,
+  ...rest
+}, forwardedRef) {
+  const solva = (0, import_react32.useContext)(SolvaPayContext);
+  if (!solva) throw new MissingProviderError("AutoRecharge");
+  const autoRecharge = useAutoRecharge();
+  const { creditsPerMinorUnit, displayExchangeRate } = useBalance();
+  const copy = useCopy();
+  const titleId = (0, import_react32.useId)();
+  const triggerRef = (0, import_react32.useRef)(null);
+  const defaultTopup = defaultTopupAmountMajor ?? defaultThresholdAmountMajor ?? void 0;
+  const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react32.useState)(defaultOpen);
+  const isControlled = openProp !== void 0;
+  const open = isControlled ? openProp : uncontrolledOpen;
+  const setOpen = (0, import_react32.useCallback)(
+    (next) => {
+      if (!isControlled) {
+        setUncontrolledOpen(next);
+      }
+      onOpenChange?.(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  const registerTriggerRef = (0, import_react32.useCallback)((node) => {
+    triggerRef.current = node;
+  }, []);
+  const focusTrigger = (0, import_react32.useCallback)(() => {
+    triggerRef.current?.focus();
+  }, []);
+  const [form, setForm] = (0, import_react32.useState)(
+    () => autoRecharge.config ? configToForm(autoRecharge.config, currency) : createDefaultAutoRechargeForm(currency, defaultTopup)
+  );
+  const [validationError, setValidationError] = (0, import_react32.useState)(null);
+  const [statusMessage, setStatusMessage] = (0, import_react32.useState)(null);
+  const [setup, setSetup] = (0, import_react32.useState)(null);
+  const latestConfigRef = (0, import_react32.useRef)(autoRecharge.config);
+  (0, import_react32.useEffect)(() => {
+    latestConfigRef.current = autoRecharge.config;
+  }, [autoRecharge.config]);
+  (0, import_react32.useEffect)(() => {
+    if (autoRecharge.config) {
+      setForm(configToForm(autoRecharge.config, currency));
+    }
+  }, [autoRecharge.config, currency]);
+  const canToggleUnits = creditsPerMinorUnit != null && creditsPerMinorUnit > 0;
+  const rate = displayExchangeRate ?? 1;
+  const isApproximate = rate !== 1;
+  const emitValidation = (0, import_react32.useCallback)(
+    (next) => {
+      const result = validateAutoRechargeForm(
+        next,
+        currency,
+        { creditsPerMinorUnit, displayExchangeRate },
+        copy.autoRecharge
+      );
+      if (!result.ok) {
+        setValidationError(result.error);
+        return null;
+      }
+      setValidationError(null);
+      return result.payload;
+    },
+    [currency, creditsPerMinorUnit, displayExchangeRate, copy.autoRecharge]
+  );
+  const updateForm = (0, import_react32.useCallback)(
+    (patch) => {
+      setForm((prev) => {
+        const next = { ...prev, ...patch };
+        emitValidation(next);
+        return next;
+      });
+    },
+    [emitValidation]
+  );
+  const resetForm = (0, import_react32.useCallback)(() => {
+    if (autoRecharge.config) {
+      setForm(configToForm(autoRecharge.config, currency));
+    } else {
+      setForm(createDefaultAutoRechargeForm(currency, defaultTopup));
+    }
+    setValidationError(null);
+  }, [autoRecharge.config, currency, defaultTopup]);
+  const flipUnit = (0, import_react32.useCallback)(
+    (valueKey, unitKey, baseValueKey, baseUnitKey, currentUnit) => {
+      const nextUnit = currentUnit === "currency" ? "credits" : "currency";
+      setForm((prev) => {
+        const anchor = { value: prev[baseValueKey], unit: prev[baseUnitKey] };
+        const flipped = flipUnitValue(
+          anchor,
+          nextUnit,
+          currency,
+          creditsPerMinorUnit,
+          displayExchangeRate
+        );
+        const next = {
+          ...prev,
+          [unitKey]: flipped.unit,
+          [valueKey]: flipped.value
+        };
+        emitValidation(next);
+        return next;
+      });
+    },
+    [currency, creditsPerMinorUnit, displayExchangeRate, emitValidation]
+  );
+  const fixedTopupHint = (0, import_react32.useMemo)(() => {
+    const parsed = Number(form.topupAmountMajor);
+    if (!Number.isFinite(parsed) || parsed <= 0) return null;
+    if (form.topupUnit === "currency") {
+      const credits = estimateCredits(parsed, currency, creditsPerMinorUnit, displayExchangeRate);
+      if (credits == null) return null;
+      return { credits, approximate: isApproximate };
+    }
+    const major = estimateCurrencyMajorFromCredits(
+      parsed,
+      currency,
+      creditsPerMinorUnit,
+      displayExchangeRate
+    );
+    if (major == null) return null;
+    return { major, approximate: isApproximate };
+  }, [
+    form.topupAmountMajor,
+    form.topupUnit,
+    currency,
+    creditsPerMinorUnit,
+    displayExchangeRate,
+    isApproximate
+  ]);
+  const summaryLine = (0, import_react32.useMemo)(() => buildSummaryLine(form, currency), [form, currency]);
+  const savedSummaryLine = (0, import_react32.useMemo)(() => {
+    if (!autoRecharge.config?.enabled) return null;
+    return buildSummaryLine(
+      configToForm(autoRecharge.config, currency),
+      currency
+    );
+  }, [autoRecharge.config, currency]);
+  const save = (0, import_react32.useCallback)(async () => {
+    const payload = emitValidation(form);
+    if (!payload) return;
+    const saveInput = deferCardSetup ? { ...payload, deferSetupIntent: true } : payload;
+    const result = await autoRecharge.save(saveInput);
+    if (result.setupClientSecret) {
+      setSetup(result);
+      setStatusMessage(copy.autoRecharge.setupRequiredMessage);
+      await onSetupRequired?.(result);
+      return;
+    }
+    setSetup(null);
+    if (deferCardSetup) {
+      await onPendingConfig?.(payload);
+    }
+    setStatusMessage(
+      payload.enabled ? copy.autoRecharge.savedMessage : copy.autoRecharge.disabledMessage
+    );
+    setOpen(false);
+    await onSaved?.(result);
+  }, [
+    autoRecharge,
+    copy.autoRecharge,
+    deferCardSetup,
+    emitValidation,
+    form,
+    onPendingConfig,
+    onSaved,
+    onSetupRequired,
+    setOpen
+  ]);
+  const disable = (0, import_react32.useCallback)(async () => {
+    await autoRecharge.disable();
+    setStatusMessage(copy.autoRecharge.disabledMessage);
+    setSetup(null);
+    await onDisabled?.();
+  }, [autoRecharge, copy.autoRecharge, onDisabled]);
+  const completeSetup = (0, import_react32.useCallback)(async () => {
+    const activated = await waitForAutoRechargeActivation({
+      refresh: autoRecharge.refresh,
+      getStatus: () => latestConfigRef.current?.status
+    });
+    setSetup(null);
+    if (!form.enabled) return;
+    if (activated) {
+      setStatusMessage(copy.autoRecharge.savedMessage);
+      setOpen(false);
+    } else {
+      setStatusMessage(copy.autoRecharge.setupAwaitingConfirmation);
+    }
+  }, [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 = (0, import_react32.useMemo)(
+    () => ({
+      form,
+      updateForm,
+      resetForm,
+      validationError,
+      currency,
+      config: autoRecharge.config,
+      loading: autoRecharge.loading,
+      saving: autoRecharge.saving,
+      disabling: autoRecharge.disabling,
+      error: autoRecharge.error,
+      statusMessage,
+      setup,
+      dataState,
+      creditsPerMinorUnit,
+      displayExchangeRate,
+      canToggleUnits,
+      isApproximate,
+      summaryLine,
+      savedSummaryLine,
+      deferCardSetup,
+      fixedTopupHint: fixedTopupHint && "credits" in fixedTopupHint ? String(fixedTopupHint.credits) : fixedTopupHint && "major" in fixedTopupHint ? formatPrice(
+        Math.round(fixedTopupHint.major * getMinorUnitsPerMajor(currency)),
+        currency,
+        { free: "" }
+      ) : null,
+      open,
+      setOpen,
+      titleId,
+      registerTriggerRef,
+      focusTrigger,
+      save,
+      disable,
+      completeSetup,
+      flipUnit
+    }),
+    [
+      form,
+      updateForm,
+      resetForm,
+      validationError,
+      currency,
+      autoRecharge.config,
+      autoRecharge.loading,
+      autoRecharge.saving,
+      autoRecharge.disabling,
+      autoRecharge.error,
+      statusMessage,
+      setup,
+      dataState,
+      creditsPerMinorUnit,
+      displayExchangeRate,
+      canToggleUnits,
+      isApproximate,
+      summaryLine,
+      savedSummaryLine,
+      deferCardSetup,
+      fixedTopupHint,
+      open,
+      setOpen,
+      titleId,
+      registerTriggerRef,
+      focusTrigger,
+      save,
+      disable,
+      completeSetup,
+      flipUnit
+    ]
+  );
+  const Comp = asChild ? Slot : "section";
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(AutoRechargeContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    Comp,
+    {
+      ref: forwardedRef,
+      className,
+      "aria-label": "Automatic credit top-up",
+      "data-solvapay-auto-recharge": "",
+      "data-state": dataState,
+      ...rest,
+      children
+    }
+  ) });
+});
+var Loading7 = (0, import_react32.forwardRef)(
+  function AutoRechargeLoading({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Loading");
+    if (!ctx.loading) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-loading": "", ...rest, children: children ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Spinner, { size: "sm" }),
+      " Loading auto-recharge settings\u2026"
+    ] }) });
+  }
+);
+var Card2 = (0, import_react32.forwardRef)(function AutoRechargeCard({ className, children, ...rest }, forwardedRef) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    "section",
+    {
+      ref: forwardedRef,
+      className,
+      "data-solvapay-auto-recharge-card": "",
+      ...rest,
+      children
+    }
+  );
+});
+var CardHeading = (0, import_react32.forwardRef)(
+  function AutoRechargeCardHeading({ className, children, ...rest }, forwardedRef) {
+    const copy = useCopy();
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "h3",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-card-heading": "",
+        ...rest,
+        children: children ?? copy.autoRecharge.heading
+      }
+    );
+  }
+);
+var CardSummary = (0, import_react32.forwardRef)(
+  function AutoRechargeCardSummary({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("CardSummary");
+    const copy = useCopy();
+    const text = ctx.savedSummaryLine ?? copy.autoRecharge.notConfiguredHint;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "p",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-card-summary": "",
+        ...rest,
+        children: children ?? text
+      }
+    );
+  }
+);
+var Trigger = (0, import_react32.forwardRef)(function AutoRechargeTrigger({ asChild, onClick, children, className, ...rest }, forwardedRef) {
+  const ctx = useAutoRechargeCtx("Trigger");
+  const copy = useCopy();
+  const hasExistingConfig = Boolean(ctx.config?.enabled);
+  const label = hasExistingConfig ? copy.autoRecharge.modifyTriggerLabel : copy.autoRecharge.setupTriggerLabel;
+  const setRefs = (node) => {
+    ctx.registerTriggerRef(node);
+    if (typeof forwardedRef === "function") {
+      forwardedRef(node);
+    } else if (forwardedRef) {
+      forwardedRef.current = node;
+    }
+  };
+  const commonProps = {
+    "data-solvapay-auto-recharge-trigger": "",
+    type: "button",
+    "aria-haspopup": "dialog",
+    "aria-expanded": ctx.open,
+    disabled: ctx.loading,
+    onClick: composeEventHandlers(onClick, (event) => {
+      event.preventDefault();
+      ctx.resetForm();
+      ctx.setOpen(true);
+    }),
+    className,
+    ...rest
+  };
+  if (asChild) {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Slot, { ref: setRefs, ...commonProps, children: children ?? label });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { ref: setRefs, ...commonProps, children: children ?? label });
+});
+var Overlay = (0, import_react32.forwardRef)(
+  function AutoRechargeOverlay({ onClick, className, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Overlay");
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "div",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-overlay": "",
+        "aria-hidden": "true",
+        onClick: composeEventHandlers(onClick, () => {
+          ctx.resetForm();
+          ctx.setOpen(false);
+          ctx.focusTrigger();
+        }),
+        ...rest
+      }
+    );
+  }
+);
+var Content = (0, import_react32.forwardRef)(function AutoRechargeContent({ className, children, ...rest }, forwardedRef) {
+  const ctx = useAutoRechargeCtx("Content");
+  const panelRef = (0, import_react32.useRef)(null);
+  (0, import_react32.useEffect)(() => {
+    if (!ctx.open) return;
+    const handleKeyDown = (event) => {
+      if (event.key === "Escape") {
+        ctx.resetForm();
+        ctx.setOpen(false);
+        ctx.focusTrigger();
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    const focusTarget = panelRef.current?.querySelector(
+      'button:not([disabled]), input:not([disabled]), [href], [tabindex]:not([tabindex="-1"])'
+    );
+    focusTarget?.focus();
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [ctx.open, ctx.resetForm, ctx.setOpen, ctx.focusTrigger]);
+  if (!ctx.open || typeof document === "undefined") return null;
+  return (0, import_react_dom.createPortal)(
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { "data-solvapay-auto-recharge-portal": "", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Overlay, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        "div",
+        {
+          ref: (node) => {
+            panelRef.current = node;
+            if (typeof forwardedRef === "function") {
+              forwardedRef(node);
+            } else if (forwardedRef) {
+              forwardedRef.current = node;
+            }
+          },
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-labelledby": ctx.titleId,
+          className,
+          "data-solvapay-auto-recharge-content": "",
+          ...rest,
+          children
+        }
+      )
+    ] }),
+    document.body
+  );
+});
+var Title = (0, import_react32.forwardRef)(
+  function AutoRechargeTitle({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Title");
+    const copy = useCopy();
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "h2",
+      {
+        ref: forwardedRef,
+        id: ctx.titleId,
+        className,
+        "data-solvapay-auto-recharge-title": "",
+        ...rest,
+        children: children ?? copy.autoRecharge.settingsHeading
+      }
+    );
+  }
+);
+var EnableQuestion = (0, import_react32.forwardRef)(
+  function AutoRechargeEnableQuestion({ className, children, ...rest }, forwardedRef) {
+    const copy = useCopy();
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-question": "", ...rest, children: children ?? copy.autoRecharge.enableQuestion });
+  }
+);
+var EnableSentence = (0, import_react32.forwardRef)(
+  function AutoRechargeEnableSentence({ className, children, ...rest }, forwardedRef) {
+    const copy = useCopy();
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "label",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-enable-sentence": "",
+        ...rest,
+        children: children ?? copy.autoRecharge.enableSentence
+      }
+    );
+  }
+);
+var EnableRow = (0, import_react32.forwardRef)(
+  function AutoRechargeEnableRow({ className, children, ...rest }, forwardedRef) {
+    const enableId = (0, import_react32.useId)();
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "div",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-enable-row": "",
+        ...rest,
+        children: children ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(EnableSwitch, { appearance: "checkbox", id: enableId }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(EnableSentence, { htmlFor: enableId })
+        ] })
+      }
+    );
+  }
+);
+var CancelButton = (0, import_react32.forwardRef)(
+  function AutoRechargeCancelButton({ asChild, onClick, children, className, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("CancelButton");
+    const copy = useCopy();
+    const commonProps = {
+      "data-solvapay-auto-recharge-cancel": "",
+      type: "button",
+      onClick: composeEventHandlers(onClick, (event) => {
+        event.preventDefault();
+        ctx.resetForm();
+        ctx.setOpen(false);
+        ctx.focusTrigger();
+      }),
+      className,
+      ...rest
+    };
+    if (asChild) {
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        Slot,
+        {
+          ref: forwardedRef,
+          ...commonProps,
+          children: children ?? copy.autoRecharge.cancelButton
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { ref: forwardedRef, ...commonProps, children: children ?? copy.autoRecharge.cancelButton });
+  }
+);
+var Header = (0, import_react32.forwardRef)(
+  function AutoRechargeHeader({ className, ...rest }, forwardedRef) {
+    const copy = useCopy();
+    const headingId = (0, import_react32.useId)();
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+      "header",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-header": "",
+        ...rest,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("section", { "data-solvapay-auto-recharge-heading-group": "", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("h3", { id: headingId, "data-solvapay-auto-recharge-heading": "", children: copy.autoRecharge.heading }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Description, {})
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(EnableSwitch, { "aria-labelledby": headingId })
+        ]
+      }
+    );
+  }
+);
+var Description = (0, import_react32.forwardRef)(
+  function AutoRechargeDescription({ className, children, ...rest }, forwardedRef) {
+    const copy = useCopy();
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "p",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-description": "",
+        ...rest,
+        children: children ?? copy.autoRecharge.description
+      }
+    );
+  }
+);
+var EnableSwitch = (0, import_react32.forwardRef)(
+  function AutoRechargeEnableSwitch({ asChild, appearance = "switch", onChange, className, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("EnableSwitch");
+    const copy = useCopy();
+    const commonProps = {
+      "data-solvapay-auto-recharge-enable": "",
+      "data-appearance": appearance,
+      type: "checkbox",
+      ...appearance === "switch" ? { role: "switch", "aria-checked": ctx.form.enabled } : {},
+      checked: ctx.form.enabled,
+      "aria-label": copy.autoRecharge.enableLabel,
+      disabled: ctx.loading || ctx.saving || ctx.disabling || !!ctx.setup,
+      onChange: composeEventHandlers(onChange, (event) => {
+        ctx.updateForm({ enabled: event.currentTarget.checked });
+      }),
+      className,
+      ...rest
+    };
+    if (asChild) {
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        Slot,
+        {
+          ref: forwardedRef,
+          ...commonProps
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("input", { ref: forwardedRef, ...commonProps });
+  }
+);
+var Fields = (0, import_react32.forwardRef)(
+  function AutoRechargeFields({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Fields");
+    const copy = useCopy();
+    if (!ctx.form.enabled) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+      "fieldset",
+      {
+        ref: forwardedRef,
+        className,
+        disabled: ctx.saving || ctx.disabling,
+        "data-solvapay-auto-recharge-fields": "",
+        "data-solvapay-auto-recharge-body": "",
+        "data-state": "open",
+        ...rest,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("legend", { className: "sr-only", children: copy.autoRecharge.heading }),
+          children ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Summary3, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ThresholdField, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(TopupField, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ValidationError, {})
+          ] })
+        ]
+      }
+    );
+  }
+);
+var Setup = (0, import_react32.forwardRef)(
+  function AutoRechargeSetup({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Setup");
+    if (!ctx.setup?.setupClientSecret) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "div",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-setup-panel": "",
+        ...rest,
+        children: children ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CardSetup, { setup: ctx.setup, onComplete: ctx.completeSetup })
+      }
+    );
+  }
+);
+var Body = (0, import_react32.forwardRef)(
+  function AutoRechargeBody({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Body");
+    if (ctx.setup?.setupClientSecret) {
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Setup, { className });
+    }
+    if (!ctx.form.enabled) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Fields, { ref: forwardedRef, className, ...rest, children: children ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Summary3, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ThresholdField, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(TopupField, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ValidationError, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Actions, {})
+    ] }) });
+  }
+);
+var Summary3 = (0, import_react32.forwardRef)(
+  function AutoRechargeSummary({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Summary");
+    if (!ctx.summaryLine) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-summary": "", ...rest, children: children ?? ctx.summaryLine });
+  }
+);
+var AmountField = (0, import_react32.forwardRef)(function AutoRechargeAmountField({ field, showLabel = true, asChild, onChange, className, ...rest }, forwardedRef) {
+  const ctx = useAutoRechargeCtx("AmountField");
+  const copy = useCopy();
+  const fieldConfig = {
+    threshold: {
+      label: copy.autoRecharge.thresholdLabel,
+      ariaLabel: copy.autoRecharge.thresholdAriaLabel,
+      unitToggleLabel: "balance threshold",
+      value: ctx.form.thresholdAmountMajor,
+      unit: ctx.form.thresholdUnit,
+      unitKey: "thresholdUnit",
+      valueKey: "thresholdAmountMajor",
+      baseValueKey: "thresholdBaseValue",
+      baseUnitKey: "thresholdBaseUnit",
+      mode: ctx.form.thresholdUnit === "currency" ? "currency" : "number",
+      onValue: (value) => ctx.updateForm({
+        thresholdAmountMajor: value,
+        thresholdBaseValue: value,
+        thresholdBaseUnit: ctx.form.thresholdUnit
+      })
+    },
+    fixed: {
+      label: copy.autoRecharge.fixedAmountLabel,
+      ariaLabel: copy.autoRecharge.fixedAmountAriaLabel,
+      unitToggleLabel: "fixed top-up amount",
+      value: ctx.form.topupAmountMajor,
+      unit: ctx.form.topupUnit,
+      unitKey: "topupUnit",
+      valueKey: "topupAmountMajor",
+      baseValueKey: "topupBaseValue",
+      baseUnitKey: "topupBaseUnit",
+      mode: ctx.form.topupUnit === "currency" ? "currency" : "number",
+      onValue: (value) => ctx.updateForm({
+        topupAmountMajor: value,
+        topupBaseValue: value,
+        topupBaseUnit: ctx.form.topupUnit
+      })
+    }
+  }[field];
+  const inputId = (0, import_react32.useId)();
+  const prefix = fieldConfig.mode === "currency" ? getCurrencySymbol2(ctx.currency) : void 0;
+  const handleChange = (event) => {
+    const raw = event.target.value;
+    const next = fieldConfig.mode === "currency" ? raw.replace(/[^0-9.]/g, "") : raw.replace(/[^0-9]/g, "");
+    fieldConfig.onValue(next);
+  };
+  const inputProps = {
+    id: inputId,
+    "data-solvapay-auto-recharge-amount": "",
+    "data-field": field,
+    type: "text",
+    inputMode: fieldConfig.mode === "currency" ? "decimal" : "numeric",
+    placeholder: fieldConfig.mode === "currency" ? "0.00" : "0",
+    value: fieldConfig.value,
+    "aria-label": fieldConfig.ariaLabel,
+    onChange: composeEventHandlers(onChange, handleChange),
+    className,
+    ...rest
+  };
+  const slotRef = forwardedRef;
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("p", { "data-solvapay-auto-recharge-field": "", "data-field": field, children: [
+    showLabel ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("label", { htmlFor: inputId, children: fieldConfig.label }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { "data-solvapay-auto-recharge-amount-row": "", children: [
+      prefix ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { "data-solvapay-auto-recharge-currency-prefix": "", "aria-hidden": "true", children: prefix }) : null,
+      asChild ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Slot, { ref: slotRef, ...inputProps }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("input", { ref: forwardedRef, ...inputProps }),
+      ctx.canToggleUnits ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        UnitToggle,
+        {
+          unit: fieldConfig.unit,
+          fieldLabel: fieldConfig.unitToggleLabel,
+          onToggle: () => ctx.flipUnit(
+            fieldConfig.valueKey,
+            fieldConfig.unitKey,
+            fieldConfig.baseValueKey,
+            fieldConfig.baseUnitKey,
+            fieldConfig.unit
+          )
+        }
+      ) : null
+    ] })
+  ] });
+});
+var ThresholdField = (0, import_react32.forwardRef)(
+  function AutoRechargeThresholdField({ className, ...rest }, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("section", { ref, className, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(AmountField, { field: "threshold" }) });
+  }
+);
+var TopupField = (0, import_react32.forwardRef)(
+  function AutoRechargeTopupField({ className, ...rest }, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+      "section",
+      {
+        ref,
+        className,
+        "data-solvapay-auto-recharge-topup-field": "",
+        ...rest,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(AmountField, { field: "fixed" }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Hint, {})
+        ]
+      }
+    );
+  }
+);
+var UnitToggle = (0, import_react32.forwardRef)(function AutoRechargeUnitToggle({ unit, fieldLabel, onToggle, className, ...rest }, forwardedRef) {
+  const ctx = useAutoRechargeCtx("UnitToggle");
+  const targetUnitLabel = unit === "currency" ? "credits" : "currency";
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    "button",
+    {
+      ref: forwardedRef,
+      type: "button",
+      className,
+      "data-solvapay-auto-recharge-unit-toggle": "",
+      "aria-label": `Switch ${fieldLabel} to ${targetUnitLabel}`,
+      onClick: onToggle,
+      ...rest,
+      children: unit === "currency" ? ctx.currency.toUpperCase() : "credits"
+    }
+  );
+});
+var Hint = (0, import_react32.forwardRef)(
+  function AutoRechargeHint({ className, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Hint");
+    const copy = useCopy();
+    const hint = ctx.fixedTopupHint;
+    if (!hint) return null;
+    const isCreditsHint = ctx.form.topupUnit === "currency";
+    const text = isCreditsHint ? interpolate(
+      ctx.isApproximate ? copy.autoRecharge.creditsPerRechargeApprox : copy.autoRecharge.creditsPerRecharge,
+      { credits: new Intl.NumberFormat().format(Number(hint)) }
+    ) : interpolate(
+      ctx.isApproximate ? copy.autoRecharge.currencyPerRechargeApprox : copy.autoRecharge.currencyPerRecharge,
+      { amount: hint }
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { ref: forwardedRef, className, "data-solvapay-auto-recharge-hint": "", ...rest, children: text });
+  }
+);
+var ValidationError = (0, import_react32.forwardRef)(function AutoRechargeValidationError({ className, ...rest }, forwardedRef) {
+  const ctx = useAutoRechargeCtx("ValidationError");
+  if (!ctx.validationError) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    "p",
+    {
+      ref: forwardedRef,
+      role: "alert",
+      "aria-live": "polite",
+      className,
+      "data-solvapay-auto-recharge-validation-error": "",
+      ...rest,
+      children: ctx.validationError
+    }
+  );
+});
+var Actions = (0, import_react32.forwardRef)(
+  function AutoRechargeActions({ className, children, ...rest }, forwardedRef) {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "menu",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-actions": "",
+        ...rest,
+        children: children ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CancelButton, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SaveButton, {}) })
+        ] })
+      }
+    );
+  }
+);
+var SaveButton = (0, import_react32.forwardRef)(function AutoRechargeSaveButton({ asChild, onClick, children, className, ...rest }, forwardedRef) {
+  const ctx = useAutoRechargeCtx("SaveButton");
+  const copy = useCopy();
+  const dataState = ctx.saving ? "processing" : ctx.validationError ? "disabled" : "idle";
+  const commonProps = {
+    "data-solvapay-auto-recharge-save": "",
+    "data-state": dataState,
+    type: "button",
+    disabled: ctx.saving || ctx.disabling || !!ctx.validationError,
+    "aria-busy": ctx.saving,
+    onClick: composeEventHandlers(onClick, (event) => {
+      event.preventDefault();
+      void ctx.save();
+    }),
+    className,
+    ...rest
+  };
+  const content = ctx.saving ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Spinner, { size: "sm" }),
+    " ",
+    copy.cta.processing
+  ] }) : children ?? copy.autoRecharge.saveButton;
+  if (asChild) {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      Slot,
+      {
+        ref: forwardedRef,
+        ...commonProps,
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { ref: forwardedRef, ...commonProps, children: content });
+});
+var DisableButton = (0, import_react32.forwardRef)(
+  function AutoRechargeDisableButton({ asChild, onClick, children, className, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("DisableButton");
+    const copy = useCopy();
+    if (!ctx.config) return null;
+    const commonProps = {
+      "data-solvapay-auto-recharge-disable": "",
+      type: "button",
+      disabled: ctx.saving || ctx.disabling,
+      "aria-busy": ctx.disabling,
+      onClick: composeEventHandlers(onClick, (event) => {
+        event.preventDefault();
+        void ctx.disable();
+      }),
+      className,
+      ...rest
+    };
+    if (asChild) {
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        Slot,
+        {
+          ref: forwardedRef,
+          ...commonProps,
+          children: children ?? copy.autoRecharge.disableButton
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { ref: forwardedRef, ...commonProps, children: children ?? copy.autoRecharge.disableButton });
+  }
+);
+var ErrorSlot7 = (0, import_react32.forwardRef)(
+  function AutoRechargeError({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Error");
+    if (!ctx.error) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "p",
+      {
+        ref: forwardedRef,
+        role: "alert",
+        "aria-live": "polite",
+        className,
+        "data-solvapay-auto-recharge-error": "",
+        ...rest,
+        children: children ?? ctx.error.message
+      }
+    );
+  }
+);
+var StatusMessage = (0, import_react32.forwardRef)(
+  function AutoRechargeStatusMessage({ className, children, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("StatusMessage");
+    if (!ctx.statusMessage) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "p",
+      {
+        ref: forwardedRef,
+        "aria-live": "polite",
+        className,
+        "data-solvapay-auto-recharge-status-message": "",
+        ...rest,
+        children: children ?? ctx.statusMessage
+      }
+    );
+  }
+);
+var Status = (0, import_react32.forwardRef)(
+  function AutoRechargeStatus({ className, ...rest }, forwardedRef) {
+    const ctx = useAutoRechargeCtx("Status");
+    const copy = useCopy();
+    const status = ctx.config?.status;
+    if (!status || status === "active" || status === "disabled" || status === "pending_setup") {
+      return null;
+    }
+    const label = status === "failed" ? copy.autoRecharge.statusFailed : null;
+    if (!label) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "span",
+      {
+        ref: forwardedRef,
+        className,
+        "data-solvapay-auto-recharge-status": "",
+        "data-status": status,
+        ...rest,
+        children: label
+      }
+    );
+  }
+);
+function CardSetupInner({ onComplete }) {
+  const copy = useCopy();
+  const stripe = (0, import_react_stripe_js3.useStripe)();
+  const elements = (0, import_react_stripe_js3.useElements)();
+  const [processing, setProcessing] = (0, import_react32.useState)(false);
+  const [error, setError] = (0, import_react32.useState)(null);
+  (0, import_react32.useEffect)(() => {
+    if (!stripe) return;
+    const clientSecret = readSetupIntentClientSecret(window.location.search);
+    if (!clientSecret) return;
+    let cancelled = false;
+    void (async () => {
+      setProcessing(true);
+      const { setupIntent, error: retrieveError } = await stripe.retrieveSetupIntent(clientSecret);
+      if (cancelled) return;
+      stripSetupIntentParams();
+      if (retrieveError || !setupIntent) {
+        setError(copy.autoRecharge.setupAuthFailed);
+        setProcessing(false);
+        return;
+      }
+      if (setupIntent.status === "succeeded" || setupIntent.status === "processing") {
+        await onComplete();
+      } else {
+        setError(copy.autoRecharge.setupAuthFailed);
+      }
+      if (!cancelled) setProcessing(false);
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [stripe, onComplete, copy.autoRecharge]);
+  const handleSubmit = async (event) => {
+    event.preventDefault();
+    if (!stripe || !elements) {
+      setError("Stripe is still loading. Please wait.");
+      return;
+    }
+    setProcessing(true);
+    setError(null);
+    const { error: submitError } = await elements.submit();
+    if (submitError) {
+      setError(submitError.message ?? "Card authorization failed");
+      setProcessing(false);
+      return;
+    }
+    const { error: confirmError } = await stripe.confirmSetup({
+      elements,
+      confirmParams: {
+        return_url: typeof window !== "undefined" ? window.location.href : "/"
+      },
+      redirect: "if_required"
+    });
+    if (confirmError) {
+      setError(confirmError.message ?? "Card authorization failed");
+      setProcessing(false);
+      return;
+    }
+    await onComplete();
+    setProcessing(false);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("form", { onSubmit: handleSubmit, "data-solvapay-auto-recharge-setup": "", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("h4", { children: copy.autoRecharge.setupHeading }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { children: copy.autoRecharge.setupDescription }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_stripe_js3.PaymentElement, { options: withPaymentElementDefaults() }),
+    error ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { role: "alert", "aria-live": "polite", "data-solvapay-auto-recharge-setup-error": "", children: error }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      "button",
+      {
+        type: "submit",
+        disabled: processing || !stripe,
+        "data-solvapay-auto-recharge-setup-submit": "",
+        children: processing ? copy.autoRecharge.setupProcessing : copy.autoRecharge.setupSubmit
+      }
+    )
+  ] });
+}
+function CardSetup({ setup, onComplete }) {
+  const stripePromise = (0, import_react32.useMemo)(() => {
+    if (!setup.publishableKey || !setup.setupClientSecret) return null;
+    const options = {
+      ...setup.stripeAccountId ? { stripeAccount: setup.stripeAccountId } : {},
+      developerTools: { assistant: { enabled: false } }
+    };
+    const cacheKey = getStripeCacheKey3(setup.publishableKey, setup.stripeAccountId);
+    const cached = stripePromiseCache3.get(cacheKey);
+    if (cached) return cached;
+    const promise = (0, import_stripe_js3.loadStripe)(setup.publishableKey, options);
+    stripePromiseCache3.set(cacheKey, promise);
+    return promise;
+  }, [setup.publishableKey, setup.setupClientSecret, setup.stripeAccountId]);
+  if (!stripePromise || !setup.setupClientSecret) {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("p", { "data-solvapay-auto-recharge-setup-loading": "", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Spinner, { size: "sm" }),
+      " Loading card form\u2026"
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    import_react_stripe_js3.Elements,
+    {
+      stripe: stripePromise,
+      options: { clientSecret: setup.setupClientSecret },
+      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CardSetupInner, { onComplete })
+    },
+    setup.setupClientSecret
+  );
+}
+var AutoRechargeRoot2 = Root10;
+var AutoRechargeLoading2 = Loading7;
+var AutoRechargeCard2 = Card2;
+var AutoRechargeCardHeading2 = CardHeading;
+var AutoRechargeCardSummary2 = CardSummary;
+var AutoRechargeTrigger2 = Trigger;
+var AutoRechargeOverlay2 = Overlay;
+var AutoRechargeContent2 = Content;
+var AutoRechargeTitle2 = Title;
+var AutoRechargeEnableQuestion2 = EnableQuestion;
+var AutoRechargeEnableSentence2 = EnableSentence;
+var AutoRechargeEnableRow2 = EnableRow;
+var AutoRechargeCancelButton2 = CancelButton;
+var AutoRechargeHeader2 = Header;
+var AutoRechargeDescription2 = Description;
+var AutoRechargeEnableSwitch2 = EnableSwitch;
+var AutoRechargeFields2 = Fields;
+var AutoRechargeSetup2 = Setup;
+var AutoRechargeBody2 = Body;
+var AutoRechargeSummary2 = Summary3;
+var AutoRechargeThresholdField2 = ThresholdField;
+var AutoRechargeTopupField2 = TopupField;
+var AutoRechargeAmountField2 = AmountField;
+var AutoRechargeUnitToggle2 = UnitToggle;
+var AutoRechargeHint2 = Hint;
+var AutoRechargeValidationError2 = ValidationError;
+var AutoRechargeActions2 = Actions;
+var AutoRechargeSaveButton2 = SaveButton;
+var AutoRechargeDisableButton2 = DisableButton;
+var AutoRechargeError2 = ErrorSlot7;
+var AutoRechargeStatusMessage2 = StatusMessage;
+var AutoRechargeStatus2 = Status;
+var AutoRechargeCardSetup = CardSetup;
+var AutoRecharge = {
+  Root: Root10,
+  Loading: Loading7,
+  Card: Card2,
+  CardHeading,
+  CardSummary,
+  Trigger,
+  Overlay,
+  Content,
+  Title,
+  EnableQuestion,
+  EnableSentence,
+  EnableRow,
+  CancelButton,
+  Header,
+  Description,
+  EnableSwitch,
+  Fields,
+  Setup,
+  Body,
+  Summary: Summary3,
+  ThresholdField,
+  TopupField,
+  AmountField,
+  UnitToggle,
+  Hint,
+  ValidationError,
+  Actions,
+  SaveButton,
+  DisableButton,
+  Error: ErrorSlot7,
+  StatusMessage,
+  Status,
+  CardSetup
+};
+function useAutoRechargeForm() {
+  return useAutoRechargeCtx("useAutoRechargeForm");
+}
+
+// src/primitives/ProductBadge.tsx
+var import_react33 = require("react");
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var ProductBadgeImpl = (0, import_react33.forwardRef)(function ProductBadge({ asChild, children, ...rest }, forwardedRef) {
+  const solva = (0, import_react33.useContext)(SolvaPayContext);
+  if (!solva) throw new MissingProviderError("ProductBadge");
+  const { purchases, loading, hasPaidPurchase, activePurchase } = usePurchase();
+  const copy = useCopy();
+  const [hasLoadedOnce, setHasLoadedOnce] = (0, import_react33.useState)(false);
+  (0, import_react33.useEffect)(() => {
+    if (!loading) setHasLoadedOnce(true);
+  }, [loading]);
+  const planToDisplay = activePurchase?.productName ?? null;
+  const shouldShow = planToDisplay !== null && (!loading || hasLoadedOnce);
+  if (!shouldShow) return null;
+  const commonProps = {
+    "data-solvapay-product-badge": "",
+    "data-loading": loading ? "" : void 0,
+    "data-has-purchase": activePurchase ? "" : void 0,
+    "data-has-paid-purchase": hasPaidPurchase ? "" : void 0,
+    role: "status",
+    "aria-live": "polite",
+    "aria-busy": loading,
+    "aria-label": interpolate(copy.product.currentProductLabel, { name: planToDisplay }),
+    ...rest
+  };
+  if (asChild) {
+    return (
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Slot, { ref: forwardedRef, ...commonProps, children: children ?? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_jsx_runtime23.Fragment, { children: planToDisplay }) })
+    );
+  }
+  void purchases;
+  return (
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { ref: forwardedRef, ...commonProps, children: children ?? planToDisplay })
+  );
+});
+var ProductBadge2 = ProductBadgeImpl;
+var PlanBadge = ProductBadgeImpl;
+
+// src/primitives/PaywallNotice.tsx
+var import_react38 = require("react");
+
+// src/primitives/checkout/index.tsx
+var import_react36 = require("react");
+
+// src/hooks/useCheckoutFlow.ts
+var import_react35 = require("react");
+
+// src/hooks/useTransport.ts
+var import_react34 = require("react");
+function useTransport() {
+  const { _config } = useSolvaPay();
+  return (0, import_react34.useMemo)(() => _config?.transport ?? createHttpTransport(_config), [_config]);
+}
+
+// src/primitives/checkout/shared.ts
+function isPayg(plan) {
+  return isPaygPlan(plan ?? null);
+}
+function planSortByPaygFirstThenAsc(a, b) {
+  const aPayg = isPayg(a);
+  const bPayg = isPayg(b);
+  if (aPayg && !bPayg) return -1;
+  if (!aPayg && bPayg) return 1;
+  return (a.price ?? 0) - (b.price ?? 0);
+}
+function buildDefaultCheckoutPlanFilter(allPlans) {
+  const hasNonPaygPaid = allPlans.some(
+    (p) => p.requiresPayment !== false && !isPayg(p)
+  );
+  return (plan) => {
+    if (plan.requiresPayment === false) return false;
+    if (hasNonPaygPaid && isPayg(plan)) return false;
+    return true;
+  };
+}
+function formatContinueLabel(plan, locale, pricingOption) {
+  if (!plan) return "Continue";
+  if (isPayg(plan)) {
+    return `Continue with ${plan.name ?? "Pay as you go"}`;
+  }
+  const option = pricingOption ?? resolvePlanPricingOption(plan, null);
+  const currency = option.currency.toUpperCase();
+  const priceLabel = formatPrice(option.price ?? 0, currency, { locale });
+  const cycle = plan.billingCycle ? `/${shortCycle(plan.billingCycle)}` : "";
+  return `Continue with ${plan.name ?? "Plan"} \u2014 ${priceLabel}${cycle}`;
+}
+function formatPaygRate(plan, locale) {
+  const creditsPerUnit = plan.creditsPerUnit ?? 1;
+  const creditLabel = creditsPerUnit === 1 ? "credit" : "credits";
+  return `${creditsPerUnit.toLocaleString(locale)} ${creditLabel} / call`;
+}
+function inferIncludedCredits(plan) {
+  const price = plan.price ?? 0;
+  const creditsPerUnit = plan.creditsPerUnit ?? 0;
+  if (price > 0 && creditsPerUnit > 0) {
+    return Math.round(price * creditsPerUnit);
+  }
+  return 0;
+}
+function shortCycle(cycle) {
+  if (!cycle) return "mo";
+  const lc = cycle.toLowerCase();
+  if (lc.startsWith("year") || lc === "annually" || lc === "annual") return "yr";
+  if (lc.startsWith("week")) return "wk";
+  if (lc.startsWith("day")) return "d";
+  return "mo";
+}
+
+// src/hooks/useCheckoutFlow.ts
+function useCheckoutFlow(opts) {
+  const {
+    productRef,
+    initialStep = "plan",
+    initialAmountMinor = null
+  } = opts;
+  const onPlanSelectRef = (0, import_react35.useRef)(opts.onPlanSelect);
+  const onAmountSelectRef = (0, import_react35.useRef)(opts.onAmountSelect);
+  const onPurchaseSuccessRef = (0, import_react35.useRef)(opts.onPurchaseSuccess);
+  const onErrorRef = (0, import_react35.useRef)(opts.onError);
+  onPlanSelectRef.current = opts.onPlanSelect;
+  onAmountSelectRef.current = opts.onAmountSelect;
+  onPurchaseSuccessRef.current = opts.onPurchaseSuccess;
+  onErrorRef.current = opts.onError;
+  const planCtx = usePlanSelector();
+  const planSelection = usePlanSelection();
+  const transport = useTransport();
+  const locale = useLocale();
+  const balance = useBalance();
+  const { creditsPerMinorUnit, displayExchangeRate, adjustBalance } = balance;
+  const { refetchPurchase } = useSolvaPay();
+  const { merchant } = useMerchant();
+  const [topupCurrencyOverride, setTopupCurrencyOverride] = (0, import_react35.useState)(null);
+  const topupCurrencies = (0, import_react35.useMemo)(() => {
+    const fromMerchant = (merchant?.supportedTopupCurrencies ?? []).map((code) => code.toUpperCase()).filter(Boolean);
+    const fallback = opts.topupCurrency?.toUpperCase() ?? merchant?.defaultCurrency?.toUpperCase() ?? null;
+    const list = fromMerchant.length > 0 ? fromMerchant : fallback ? [fallback] : [];
+    return Array.from(new Set(list));
+  }, [merchant?.supportedTopupCurrencies, merchant?.defaultCurrency, opts.topupCurrency]);
+  const resolvedDefaultTopupCurrency = opts.topupCurrency?.toUpperCase() ?? merchant?.defaultCurrency?.toUpperCase() ?? null;
+  const planPickerCurrency = planCtx.preferredCurrency?.toUpperCase() ?? null;
+  const topupCurrency = (topupCurrencyOverride && topupCurrencies.includes(topupCurrencyOverride) ? topupCurrencyOverride : null) ?? (planPickerCurrency && topupCurrencies.includes(planPickerCurrency) ? planPickerCurrency : null) ?? resolvedDefaultTopupCurrency;
+  const topupCurrencyReady = topupCurrency != null;
+  const setTopupCurrency = (0, import_react35.useCallback)(
+    (code) => {
+      const normalized = code.toUpperCase();
+      setTopupCurrencyOverride(normalized);
+    },
+    []
+  );
+  const [step, setStep] = (0, import_react35.useState)(initialStep);
+  const [status, setStatus] = (0, import_react35.useState)("idle");
+  const [selectedAmountMinor, setSelectedAmountMinor] = (0, import_react35.useState)(initialAmountMinor);
+  const [successMeta, setSuccessMeta] = (0, import_react35.useState)(null);
+  const [error, setError] = (0, import_react35.useState)(null);
+  const selectedAmountMinorRef = (0, import_react35.useRef)(initialAmountMinor);
+  const selectedPlan = planCtx.selectedPlan;
+  const selectedPlanRef = planCtx.selectedPlanRef;
+  const selectedPlanShape = selectedPlan;
+  const branch = selectedPlanShape ? isPayg(selectedPlanShape) ? "payg" : "recurring" : null;
+  const canGoBack = step === "amount" || step === "payment";
+  const selectPlan = (0, import_react35.useCallback)(
     (ref) => {
       planCtx.select(ref);
       const plan = planCtx.plans.find((p) => p.reference === ref) ?? null;
@@ -5074,7 +6778,7 @@ function useCheckoutFlow(opts) {
     },
     [planCtx]
   );
-  const selectAmount = (0, import_react33.useCallback)(
+  const selectAmount = (0, import_react35.useCallback)(
     (amountMinor) => {
       selectedAmountMinorRef.current = amountMinor;
       setSelectedAmountMinor(amountMinor);
@@ -5083,7 +6787,7 @@ function useCheckoutFlow(opts) {
     },
     [topupCurrency]
   );
-  const runActivate = (0, import_react33.useCallback)(async () => {
+  const runActivate = (0, import_react35.useCallback)(async () => {
     if (!selectedPlanShape || !selectedPlanRef) return false;
     setError(null);
     setStatus("activating");
@@ -5100,7 +6804,7 @@ function useCheckoutFlow(opts) {
       return false;
     }
   }, [productRef, selectedPlanRef, selectedPlanShape, transport]);
-  const advanceFromPlan = (0, import_react33.useCallback)(async () => {
+  const advanceFromPlan = (0, import_react35.useCallback)(async () => {
     if (!selectedPlanShape || !selectedPlanRef) return;
     if (branch === "payg") {
       if (planCtx.currentPlanRef === selectedPlanRef) {
@@ -5114,7 +6818,7 @@ function useCheckoutFlow(opts) {
     setError(null);
     setStep("payment");
   }, [branch, planCtx.currentPlanRef, runActivate, selectedPlanRef, selectedPlanShape]);
-  const recordPaygSuccess = (0, import_react33.useCallback)(
+  const recordPaygSuccess = (0, import_react35.useCallback)(
     (creditsAddedFromBackend) => {
       if (!selectedPlanShape || selectedAmountMinor == null) return;
       const currency = topupCurrency ?? "USD";
@@ -5148,7 +6852,7 @@ function useCheckoutFlow(opts) {
       topupCurrency
     ]
   );
-  const recordRecurringSuccess = (0, import_react33.useCallback)(() => {
+  const recordRecurringSuccess = (0, import_react35.useCallback)(() => {
     if (!selectedPlanShape) return;
     const pricingOption = selectedPlan ? resolvePlanPricingOption(selectedPlan, planSelection?.selectedCurrency) : {
       currency: selectedPlanShape.currency ?? "USD",
@@ -5167,7 +6871,7 @@ function useCheckoutFlow(opts) {
     setStep("success");
     onPurchaseSuccessRef.current?.(meta);
   }, [selectedPlanShape, selectedPlan, planSelection?.selectedCurrency]);
-  const advance = (0, import_react33.useCallback)(async () => {
+  const advance = (0, import_react35.useCallback)(async () => {
     if (step === "plan") {
       await advanceFromPlan();
       return;
@@ -5194,7 +6898,7 @@ function useCheckoutFlow(opts) {
     selectedAmountMinor,
     step
   ]);
-  const back = (0, import_react33.useCallback)(() => {
+  const back = (0, import_react35.useCallback)(() => {
     setError(null);
     if (step === "amount") {
       setStep("plan");
@@ -5205,7 +6909,7 @@ function useCheckoutFlow(opts) {
       return;
     }
   }, [branch, step]);
-  const reset = (0, import_react33.useCallback)(() => {
+  const reset = (0, import_react35.useCallback)(() => {
     setStep("plan");
     selectedAmountMinorRef.current = null;
     setSelectedAmountMinor(null);
@@ -5214,13 +6918,13 @@ function useCheckoutFlow(opts) {
     setStatus("idle");
     setTopupCurrencyOverride(null);
   }, []);
-  const retry = (0, import_react33.useCallback)(async () => {
+  const retry = (0, import_react35.useCallback)(async () => {
     if (status !== "error") return;
     if (step === "plan" && branch === "payg") {
       await runActivate();
     }
   }, [branch, runActivate, status, step]);
-  const notifyPaymentSuccess = (0, import_react33.useCallback)(
+  const notifyPaymentSuccess = (0, import_react35.useCallback)(
     (_intent, extras) => {
       if (branch === "payg") {
         recordPaygSuccess(extras?.creditsAdded);
@@ -5230,7 +6934,7 @@ function useCheckoutFlow(opts) {
     },
     [branch, recordPaygSuccess, recordRecurringSuccess]
   );
-  return (0, import_react33.useMemo)(
+  return (0, import_react35.useMemo)(
     () => ({
       step,
       status,
@@ -5279,10 +6983,10 @@ function useCheckoutFlow(opts) {
 }
 
 // src/primitives/checkout/index.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
-var CheckoutContext = (0, import_react34.createContext)(null);
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var CheckoutContext = (0, import_react36.createContext)(null);
 function useCheckoutContext(part) {
-  const ctx = (0, import_react34.useContext)(CheckoutContext);
+  const ctx = (0, import_react36.useContext)(CheckoutContext);
   if (!ctx) {
     throw new Error(`CheckoutSteps.${part} must be rendered inside <CheckoutSteps.Root>.`);
   }
@@ -5291,7 +6995,7 @@ function useCheckoutContext(part) {
 function useCheckoutSteps() {
   return useCheckoutContext("useCheckoutSteps");
 }
-var Root10 = (0, import_react34.forwardRef)(function CheckoutStepsRoot(props, forwardedRef) {
+var Root11 = (0, import_react36.forwardRef)(function CheckoutStepsRoot(props, forwardedRef) {
   const {
     productRef,
     returnUrl: _returnUrl,
@@ -5313,9 +7017,9 @@ var Root10 = (0, import_react34.forwardRef)(function CheckoutStepsRoot(props, fo
     children
   } = props;
   if (externalFlow) {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { ref: forwardedRef, "data-solvapay-checkout": "", className, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CheckoutContext.Provider, { value: externalFlow, children }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { ref: forwardedRef, "data-solvapay-checkout": "", className, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutContext.Provider, { value: externalFlow, children }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     RootWithPlanSelector,
     {
       productRef,
@@ -5358,11 +7062,11 @@ function RootWithPlanSelector({
   children
 }) {
   const { plans } = usePlans({ productRef });
-  const resolvedFilter = (0, import_react34.useMemo)(
+  const resolvedFilter = (0, import_react36.useMemo)(
     () => filter ?? buildDefaultCheckoutPlanFilter(plans),
     [filter, plans]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     PlanSelector.Root,
     {
       productRef,
@@ -5372,7 +7076,7 @@ function RootWithPlanSelector({
       currentPlanRef,
       autoSelectFirstPaid,
       initialPlanRef,
-      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
         FlowProvider,
         {
           productRef,
@@ -5414,22 +7118,22 @@ function FlowProvider({
     onPurchaseSuccess,
     onError
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { ref: forwardedRef, "data-solvapay-checkout": "", "data-step": flow.step, className, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CheckoutContext.Provider, { value: flow, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { ref: forwardedRef, "data-solvapay-checkout": "", "data-step": flow.step, className, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(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__ */ (0, import_jsx_runtime23.jsx)(import_jsx_runtime23.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, { children });
 }
-var StepHeading = (0, import_react34.forwardRef)(function CheckoutStepsStepHeading({ asChild, children, className, ...rest }, forwardedRef) {
+var StepHeading = (0, import_react36.forwardRef)(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__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -5441,7 +7145,7 @@ var StepHeading = (0, import_react34.forwardRef)(function CheckoutStepsStepHeadi
     }
   );
 });
-var StepMessage = (0, import_react34.forwardRef)(function CheckoutStepsStepMessage({ asChild, children, className, ...rest }, forwardedRef) {
+var StepMessage = (0, import_react36.forwardRef)(function CheckoutStepsStepMessage({ asChild, children, className, ...rest }, forwardedRef) {
   const flow = useCheckoutContext("StepMessage");
   const copy = useCopy();
   const paywallCtx = usePaywallNoticeOptional();
@@ -5449,7 +7153,7 @@ var StepMessage = (0, import_react34.forwardRef)(function CheckoutStepsStepMessa
   const defaultText = resolveStepMessage(flow, copy, paywallCtx?.content ?? null);
   if (!defaultText && children == null) return null;
   const Comp = asChild ? Slot : "p";
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -5496,21 +7200,21 @@ function resolveStepMessage(flow, copy, content) {
   return "";
 }
 function PlanGrid({ className, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PlanSelector.Grid, { className: className ?? "solvapay-checkout-plan-grid", children: children ?? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(PlanSelector.Card, { className: "solvapay-checkout-plan-card", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PlanSelector.CardBadge, { className: "solvapay-checkout-plan-card-badge" }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PlanSelector.CardName, { className: "solvapay-checkout-plan-card-name" }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PlanSelector.CardPrice, { className: "solvapay-checkout-plan-card-price" }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PlanSelector.CardInterval, { className: "solvapay-checkout-plan-card-interval" })
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.Grid, { className: className ?? "solvapay-checkout-plan-grid", children: children ?? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(PlanSelector.Card, { className: "solvapay-checkout-plan-card", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.CardBadge, { className: "solvapay-checkout-plan-card-badge" }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.CardName, { className: "solvapay-checkout-plan-card-name" }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.CardPrice, { className: "solvapay-checkout-plan-card-price" }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.CardInterval, { className: "solvapay-checkout-plan-card-interval" })
   ] }) });
 }
-var PlanContinueButton = (0, import_react34.forwardRef)(
+var PlanContinueButton = (0, import_react36.forwardRef)(
   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__ */ (0, import_jsx_runtime23.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "button",
       {
         ref,
@@ -5533,13 +7237,13 @@ var PlanContinueButton = (0, import_react34.forwardRef)(
 function AmountPicker2({ className, children }) {
   const flow = useCheckoutContext("AmountPicker");
   if (!flow.topupCurrencyReady || flow.topupCurrency == null) {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "div",
       {
         className: className ?? "solvapay-amount-picker",
         "data-state": "loading",
         "aria-busy": "true",
-        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "solvapay-amount-picker-pills", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "solvapay-amount-picker-pills", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "span",
           {
             className: "solvapay-amount-picker-pill",
@@ -5551,7 +7255,7 @@ function AmountPicker2({ className, children }) {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     AmountPicker.Root,
     {
       currency: flow.topupCurrency,
@@ -5562,16 +7266,16 @@ function AmountPicker2({ className, children }) {
           flow.selectAmount(value);
         }
       },
-      children: children ?? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DefaultAmountTree, {})
+      children: children ?? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DefaultAmountTree, {})
     }
   );
 }
 function DefaultAmountTree() {
   const ctx = useAmountPicker();
   const { selectAmountLabel, customAmountLabel, creditEstimate } = useAmountPickerCopy();
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "solvapay-amount-picker-label", children: selectAmountLabel }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "solvapay-amount-picker-pills", children: ctx.quickAmounts.map((amount) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "solvapay-amount-picker-label", children: selectAmountLabel }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "solvapay-amount-picker-pills", children: ctx.quickAmounts.map((amount) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       AmountPicker.Option,
       {
         amount,
@@ -5579,11 +7283,11 @@ function DefaultAmountTree() {
       },
       amount
     )) }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-amount-picker-custom-wrapper", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "solvapay-amount-picker-custom-label", children: customAmountLabel }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-amount-picker-custom-row", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "solvapay-amount-picker-currency-symbol", children: ctx.currencySymbol }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-amount-picker-custom-wrapper", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "solvapay-amount-picker-custom-label", children: customAmountLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-amount-picker-custom-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "solvapay-amount-picker-currency-symbol", children: ctx.currencySymbol }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           AmountPicker.Custom,
           {
             className: "solvapay-amount-picker-custom-input",
@@ -5592,7 +7296,7 @@ function DefaultAmountTree() {
         )
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "p",
       {
         className: "solvapay-amount-picker-credit-estimate",
@@ -5602,7 +7306,7 @@ function DefaultAmountTree() {
     )
   ] });
 }
-var AmountContinueButton = (0, import_react34.forwardRef)(
+var AmountContinueButton = (0, import_react36.forwardRef)(
   function AmountContinueButton2({ className, children, onClick, disabled, ...rest }, ref) {
     const flow = useCheckoutContext("AmountContinueButton");
     const locale = useLocale();
@@ -5611,7 +7315,7 @@ var AmountContinueButton = (0, import_react34.forwardRef)(
     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__ */ (0, import_jsx_runtime23.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "button",
       {
         ref,
@@ -5634,10 +7338,10 @@ var AmountContinueButton = (0, import_react34.forwardRef)(
 function Payment({ className }) {
   const flow = useCheckoutContext("Payment");
   if (flow.branch === "payg") {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PaygPayment, { className });
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PaygPayment, { className });
   }
   if (flow.branch === "recurring") {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(RecurringPayment, { className });
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RecurringPayment, { className });
   }
   return null;
 }
@@ -5651,12 +7355,12 @@ function PaygPayment({ className }) {
   const currency = flow.topupCurrency;
   if (!selectedPlanShape || amountMinor == null || currency == null) return null;
   const creditsAdded = creditsPerMinorUnit != null && creditsPerMinorUnit > 0 ? Math.floor(amountMinor / (displayExchangeRate ?? 1) * creditsPerMinorUnit) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: className ?? "solvapay-checkout-payment", "data-branch": "payg", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "solvapay-checkout-order-summary", "data-variant": "payg", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-order-summary-row", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: creditsAdded != null ? `${creditsAdded.toLocaleString(locale)} credits` : formatPrice(amountMinor, currency, { locale }) }),
-      creditsAdded != null ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: formatPrice(amountMinor, currency, { locale }) }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: className ?? "solvapay-checkout-payment", "data-branch": "payg", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "solvapay-checkout-order-summary", "data-variant": "payg", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-order-summary-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: creditsAdded != null ? `${creditsAdded.toLocaleString(locale)} credits` : formatPrice(amountMinor, currency, { locale }) }),
+      creditsAdded != null ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: formatPrice(amountMinor, currency, { locale }) }) : null
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
       TopupForm.Root,
       {
         amount: amountMinor,
@@ -5665,11 +7369,11 @@ function PaygPayment({ className }) {
         className: "solvapay-checkout-topup-form",
         onSuccess: (intent, extras) => flow.notifyPaymentSuccess(intent, extras),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TopupForm.Loading, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TopupForm.PaymentElement, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TopupForm.Error, { className: "solvapay-checkout-error" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(MandateText, { mode: "topup", amountMinor, currency }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(TopupForm.SubmitButton, { className: "solvapay-checkout-pay-button", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TopupForm.Loading, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TopupForm.PaymentElement, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TopupForm.Error, { className: "solvapay-checkout-error" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MandateText, { mode: "topup", amountMinor, currency }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(TopupForm.SubmitButton, { className: "solvapay-checkout-pay-button", children: [
             "Pay ",
             formatPrice(amountMinor, currency, { locale })
           ] })
@@ -5692,12 +7396,12 @@ function RecurringPayment({ className }) {
   const isRecurring = !!cycle;
   const formattedAmount = formatPrice(amountMinor, currency, { locale });
   const priceLine = isRecurring ? `${formattedAmount}/${shortCycle(cycle)}` : formattedAmount;
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: className ?? "solvapay-checkout-payment", "data-branch": "recurring", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "solvapay-checkout-order-summary", "data-variant": "recurring", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-order-summary-row", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: planName }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: priceLine })
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: className ?? "solvapay-checkout-payment", "data-branch": "recurring", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "solvapay-checkout-order-summary", "data-variant": "recurring", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-order-summary-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: planName }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: priceLine })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
       PaymentForm.Root,
       {
         planRef: flow.selectedPlanRef,
@@ -5706,28 +7410,28 @@ function RecurringPayment({ className }) {
         requireTermsAcceptance: false,
         onSuccess: (intent) => flow.notifyPaymentSuccess(intent),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PaymentForm.Loading, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PaymentForm.PaymentElement, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PaymentForm.Error, { className: "solvapay-checkout-error" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PaymentForm.MandateText, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PaymentForm.SubmitButton, { className: "solvapay-checkout-pay-button", children: isRecurring ? `Subscribe \u2014 ${priceLine}` : `Pay ${formattedAmount}` })
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PaymentForm.Loading, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PaymentForm.PaymentElement, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PaymentForm.Error, { className: "solvapay-checkout-error" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PaymentForm.MandateText, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PaymentForm.SubmitButton, { className: "solvapay-checkout-pay-button", children: isRecurring ? `Subscribe \u2014 ${priceLine}` : `Pay ${formattedAmount}` })
         ]
       }
     )
   ] });
 }
-var CheckoutEnvContext = (0, import_react34.createContext)(null);
+var CheckoutEnvContext = (0, import_react36.createContext)(null);
 function useReturnUrl() {
-  return (0, import_react34.useContext)(CheckoutEnvContext)?.returnUrl ?? "";
+  return (0, import_react36.useContext)(CheckoutEnvContext)?.returnUrl ?? "";
 }
 function useProductRef() {
-  return (0, import_react34.useContext)(CheckoutEnvContext)?.productRef ?? "";
+  return (0, import_react36.useContext)(CheckoutEnvContext)?.productRef ?? "";
 }
-var BackLink = (0, import_react34.forwardRef)(function CheckoutStepsBackLink({ label, glyph = "\u2190", className, onClick, ...rest }, ref) {
+var BackLink = (0, import_react36.forwardRef)(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");
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     "button",
     {
       ref,
@@ -5741,8 +7445,8 @@ var BackLink = (0, import_react34.forwardRef)(function CheckoutStepsBackLink({ l
       },
       ...rest,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "solvapay-checkout-back-link-glyph", "aria-hidden": "true", children: glyph }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "solvapay-checkout-back-link-label", children: resolvedLabel })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "solvapay-checkout-back-link-glyph", "aria-hidden": "true", children: glyph }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "solvapay-checkout-back-link-label", children: resolvedLabel })
       ]
     }
   );
@@ -5752,74 +7456,74 @@ function Success({ className, children }) {
   const locale = useLocale();
   if (flow.step !== "success" || !flow.successMeta) return null;
   if (children) {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: className ?? "solvapay-checkout-success", children });
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: className ?? "solvapay-checkout-success", children });
   }
   const meta = flow.successMeta;
   if (meta.branch === "payg") {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: className ?? "solvapay-checkout-success", "data-branch": "payg", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "solvapay-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("h2", { className: "solvapay-checkout-success-heading", children: "Credits added" }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "solvapay-checkout-success-subheading", children: "Pay as you go plan is active." }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("dl", { className: "solvapay-checkout-receipt", "data-variant": "payg", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { children: "Amount" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { children: formatPrice(meta.amountMinor, meta.currency, { locale }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: className ?? "solvapay-checkout-success", "data-branch": "payg", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "solvapay-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("h2", { className: "solvapay-checkout-success-heading", children: "Credits added" }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "solvapay-checkout-success-subheading", children: "Pay as you go plan is active." }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("dl", { className: "solvapay-checkout-receipt", "data-variant": "payg", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dt", { children: "Amount" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dd", { children: formatPrice(meta.amountMinor, meta.currency, { locale }) })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { children: "Credits" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("dd", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dt", { children: "Credits" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("dd", { children: [
             "+",
             meta.creditsAdded.toLocaleString(locale)
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { children: "Plan" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { children: meta.plan.name ?? "Pay as you go" })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dt", { children: "Plan" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dd", { children: meta.plan.name ?? "Pay as you go" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { children: "Rate" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { children: meta.rateLabel })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dt", { children: "Rate" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dd", { children: meta.rateLabel })
         ] })
       ] })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: className ?? "solvapay-checkout-success", "data-branch": "recurring", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "solvapay-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("h2", { className: "solvapay-checkout-success-heading", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: className ?? "solvapay-checkout-success", "data-branch": "recurring", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "solvapay-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("h2", { className: "solvapay-checkout-success-heading", children: [
       meta.plan.name ?? "Plan",
       " active"
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "solvapay-checkout-success-subheading", children: "Subscription is live and credits are ready." }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("dl", { className: "solvapay-checkout-receipt", "data-variant": "recurring", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { children: "Plan" }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { children: meta.plan.name ?? "Plan" })
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "solvapay-checkout-success-subheading", children: "Subscription is live and credits are ready." }),
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("dl", { className: "solvapay-checkout-receipt", "data-variant": "recurring", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dt", { children: "Plan" }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dd", { children: meta.plan.name ?? "Plan" })
       ] }),
-      meta.creditsIncluded > 0 ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { children: "Credits" }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("dd", { children: [
+      meta.creditsIncluded > 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dt", { children: "Credits" }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("dd", { children: [
           "+",
           meta.creditsIncluded.toLocaleString(locale)
         ] })
       ] }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { children: "Charged today" }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { children: formatPrice(meta.chargedTodayMinor, meta.currency, { locale }) })
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dt", { children: "Charged today" }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dd", { children: formatPrice(meta.chargedTodayMinor, meta.currency, { locale }) })
       ] }),
-      meta.nextRenewalLabel ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dt", { children: "Next renewal" }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("dd", { children: meta.nextRenewalLabel })
+      meta.nextRenewalLabel ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "solvapay-checkout-receipt-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dt", { children: "Next renewal" }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("dd", { children: meta.nextRenewalLabel })
       ] }) : null
     ] })
   ] });
 }
-var RootWithEnv = (0, import_react34.forwardRef)(
+var RootWithEnv = (0, import_react36.forwardRef)(
   function CheckoutStepsRootWithEnv(props, forwardedRef) {
-    const env = (0, import_react34.useMemo)(
+    const env = (0, import_react36.useMemo)(
       () => ({ returnUrl: props.returnUrl, productRef: props.productRef }),
       [props.returnUrl, props.productRef]
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CheckoutEnvContext.Provider, { value: env, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Root10, { ...props, ref: forwardedRef }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutEnvContext.Provider, { value: env, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Root11, { ...props, ref: forwardedRef }) });
   }
 );
 var CheckoutSteps = {
@@ -5848,7 +7552,7 @@ var CheckoutStepsBackLink2 = BackLink;
 var CheckoutStepsSuccess = Success;
 
 // src/hooks/usePaywallResolver.ts
-var import_react35 = require("react");
+var import_react37 = require("react");
 function balanceCoversNextUnit(balance, credits) {
   if (!balance) return false;
   if (typeof balance.remainingUnits === "number" && balance.remainingUnits > 0) {
@@ -5862,7 +7566,7 @@ function balanceCoversNextUnit(balance, credits) {
 function usePaywallResolver(content) {
   const { activePurchase, hasPaidPurchase, refetch: refetchPurchase } = usePurchase();
   const { credits, refetch: refetchBalance } = useBalance();
-  const resolved = (0, import_react35.useMemo)(() => {
+  const resolved = (0, import_react37.useMemo)(() => {
     if (!content) return false;
     const productMatches = !content.product || activePurchase?.productRef === content.product || activePurchase?.productName === content.product;
     if (content.kind === "payment_required") {
@@ -5872,7 +7576,7 @@ function usePaywallResolver(content) {
     if (balanceCoversNextUnit(content.balance, credits)) return true;
     return Boolean(productMatches && activePurchase?.status === "active");
   }, [content, hasPaidPurchase, activePurchase, credits]);
-  const refetch = (0, import_react35.useCallback)(async () => {
+  const refetch = (0, import_react37.useCallback)(async () => {
     await Promise.all([
       refetchPurchase().catch(() => void 0),
       refetchBalance().catch(() => void 0)
@@ -5882,32 +7586,32 @@ function usePaywallResolver(content) {
 }
 
 // src/primitives/PaywallNotice.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
-var PaywallNoticeContext = (0, import_react36.createContext)(null);
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var PaywallNoticeContext = (0, import_react38.createContext)(null);
 function usePaywallNoticeCtx(part) {
-  const ctx = (0, import_react36.useContext)(PaywallNoticeContext);
+  const ctx = (0, import_react38.useContext)(PaywallNoticeContext);
   if (!ctx) {
     throw new Error(`PaywallNotice.${part} must be rendered inside <PaywallNotice.Root>.`);
   }
   return ctx;
 }
-var Root11 = (0, import_react36.forwardRef)(function PaywallNoticeRoot({ content, onResolved, classNames, asChild, children, ...rest }, forwardedRef) {
+var Root12 = (0, import_react38.forwardRef)(function PaywallNoticeRoot({ content, onResolved, classNames, asChild, children, ...rest }, forwardedRef) {
   const { resolved, refetch } = usePaywallResolver(content);
-  const classNamesResolved = (0, import_react36.useMemo)(() => classNames ?? {}, [classNames]);
-  const onResolvedRef = (0, import_react36.useRef)(onResolved);
-  (0, import_react36.useEffect)(() => {
+  const classNamesResolved = (0, import_react38.useMemo)(() => classNames ?? {}, [classNames]);
+  const onResolvedRef = (0, import_react38.useRef)(onResolved);
+  (0, import_react38.useEffect)(() => {
     onResolvedRef.current = onResolved;
   }, [onResolved]);
-  const hasResolvedRef = (0, import_react36.useRef)(false);
-  const signalResolved = (0, import_react36.useCallback)(() => {
+  const hasResolvedRef = (0, import_react38.useRef)(false);
+  const signalResolved = (0, import_react38.useCallback)(() => {
     if (hasResolvedRef.current) return;
     hasResolvedRef.current = true;
     onResolvedRef.current?.();
   }, []);
-  (0, import_react36.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (resolved) signalResolved();
   }, [resolved, signalResolved]);
-  const ctx = (0, import_react36.useMemo)(
+  const ctx = (0, import_react38.useMemo)(
     () => ({
       content,
       resolved,
@@ -5918,7 +7622,7 @@ var Root11 = (0, import_react36.forwardRef)(function PaywallNoticeRoot({ content
     [content, resolved, refetch, signalResolved, classNamesResolved]
   );
   const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PaywallNoticeContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PaywallNoticeContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -5931,12 +7635,12 @@ var Root11 = (0, import_react36.forwardRef)(function PaywallNoticeRoot({ content
     }
   ) });
 });
-var Heading4 = (0, import_react36.forwardRef)(function PaywallNoticeHeading({ asChild, children, className, ...rest }, forwardedRef) {
+var Heading4 = (0, import_react38.forwardRef)(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__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -5947,12 +7651,12 @@ var Heading4 = (0, import_react36.forwardRef)(function PaywallNoticeHeading({ as
     }
   );
 });
-var Message = (0, import_react36.forwardRef)(function PaywallNoticeMessage({ asChild, children, className, ...rest }, forwardedRef) {
+var Message = (0, import_react38.forwardRef)(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__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -5995,14 +7699,14 @@ function resolvePaywallMessage(content, paywallCopy) {
   }
   return content.message ?? "";
 }
-var ProductContext = (0, import_react36.forwardRef)(function PaywallNoticeProductContext({ asChild, children, className, ...rest }, forwardedRef) {
+var ProductContext = (0, import_react38.forwardRef)(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__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -6013,7 +7717,7 @@ var ProductContext = (0, import_react36.forwardRef)(function PaywallNoticeProduc
     }
   );
 });
-var Balance = (0, import_react36.forwardRef)(function PaywallNoticeBalance({ asChild, children, className, ...rest }, forwardedRef) {
+var Balance = (0, import_react38.forwardRef)(function PaywallNoticeBalance({ asChild, children, className, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("Balance");
   const copy = useCopy();
   const balance = ctx.content.balance;
@@ -6023,7 +7727,7 @@ var Balance = (0, import_react36.forwardRef)(function PaywallNoticeBalance({ asC
     required: String(balance.creditsPerUnit ?? 1)
   });
   const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -6039,27 +7743,27 @@ 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__ */ (0, import_jsx_runtime24.jsx)("div", { "data-solvapay-paywall-plans": "", className: defaultClass, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.Root, { productRef: ctx.content.product, filter: hidesFreePlan, children: children ?? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(PlanSelector.Card, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.CardBadge, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.CardName, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.CardPrice, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.CardInterval, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { "data-solvapay-paywall-plans": "", className: defaultClass, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.Root, { productRef: ctx.content.product, filter: hidesFreePlan, children: children ?? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(PlanSelector.Card, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.CardBadge, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.CardName, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.CardPrice, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.CardInterval, {})
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.Loading, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.Error, {})
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.Loading, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.Error, {})
   ] }) }) });
 }
 function hidesFreePlan(plan) {
   return plan.requiresPayment !== false;
 }
-var HostedCheckoutLink = (0, import_react36.forwardRef)(function PaywallNoticeHostedCheckoutLink({ asChild, children, className, ...rest }, forwardedRef) {
+var HostedCheckoutLink = (0, import_react38.forwardRef)(function PaywallNoticeHostedCheckoutLink({ asChild, children, className, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("HostedCheckoutLink");
   const copy = useCopy();
   const href = ctx.content.checkoutUrl;
   if (!href) return null;
   const Comp = asChild ? Slot : "a";
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -6077,12 +7781,12 @@ function EmbeddedCheckout({ returnUrl, topupCurrency, className }) {
   const ctx = usePaywallNoticeCtx("EmbeddedCheckout");
   const productRef = ctx.content.product;
   const { plans } = usePlans({ productRef: productRef ?? void 0 });
-  const filter = (0, import_react36.useMemo)(() => buildDefaultCheckoutPlanFilter(plans), [plans]);
+  const filter = (0, import_react38.useMemo)(() => 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";
   const messageClassName = ctx.classNames.message ?? "solvapay-paywall-step-message";
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
     CheckoutSteps.Root,
     {
       productRef,
@@ -6095,33 +7799,33 @@ function EmbeddedCheckout({ returnUrl, topupCurrency, className }) {
       },
       className: resolvedClassName,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.StepHeading, { className: headingClassName }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.StepMessage, { className: messageClassName }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(CheckoutSteps.IfStep, { step: "plan", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.PlanGrid, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.Loading, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlanSelector.Error, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.PlanContinueButton, {})
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.StepHeading, { className: headingClassName }),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.StepMessage, { className: messageClassName }),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(CheckoutSteps.IfStep, { step: "plan", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.PlanGrid, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.Loading, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PlanSelector.Error, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.PlanContinueButton, {})
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(CheckoutSteps.IfStep, { step: "amount", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.BackLink, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.AmountPicker, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.AmountContinueButton, {})
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(CheckoutSteps.IfStep, { step: "amount", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.BackLink, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.AmountPicker, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.AmountContinueButton, {})
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(CheckoutSteps.IfStep, { step: "payment", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.BackLink, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.Payment, {})
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(CheckoutSteps.IfStep, { step: "payment", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.BackLink, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.Payment, {})
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.IfStep, { step: "success", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckoutSteps.Success, {}) })
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.IfStep, { step: "success", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CheckoutSteps.Success, {}) })
       ]
     }
   );
 }
-var Retry = (0, import_react36.forwardRef)(function PaywallNoticeRetry({ asChild, children, className, onClick, ...rest }, forwardedRef) {
+var Retry = (0, import_react38.forwardRef)(function PaywallNoticeRetry({ asChild, children, className, onClick, ...rest }, forwardedRef) {
   const ctx = usePaywallNoticeCtx("Retry");
   const copy = useCopy();
   const Comp = asChild ? Slot : "button";
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -6139,8 +7843,8 @@ var Retry = (0, import_react36.forwardRef)(function PaywallNoticeRetry({ asChild
     }
   );
 });
-var PaywallNotice = Object.assign(Root11, {
-  Root: Root11,
+var PaywallNotice = Object.assign(Root12, {
+  Root: Root12,
   Heading: Heading4,
   Message,
   ProductContext,
@@ -6154,14 +7858,14 @@ function usePaywallNotice() {
   return usePaywallNoticeCtx("usePaywallNotice");
 }
 function usePaywallNoticeOptional() {
-  return (0, import_react36.useContext)(PaywallNoticeContext);
+  return (0, import_react38.useContext)(PaywallNoticeContext);
 }
 
 // src/primitives/UsageMeter.tsx
-var import_react38 = require("react");
+var import_react40 = require("react");
 
 // src/hooks/useUsage.ts
-var import_react37 = require("react");
+var import_react39 = require("react");
 function deriveUsage(purchase) {
   if (!purchase) return null;
   const snap = purchase.planSnapshot;
@@ -6186,16 +7890,16 @@ function deriveUsage(purchase) {
 function useUsage() {
   const { activePurchase, refetch: refetchPurchase, loading: purchaseLoading } = usePurchase();
   const transport = useTransport();
-  const [override, setOverride] = (0, import_react37.useState)(null);
-  const [error, setError] = (0, import_react37.useState)(null);
-  const [transportLoading, setTransportLoading] = (0, import_react37.useState)(false);
-  const derived = (0, import_react37.useMemo)(() => deriveUsage(activePurchase ?? null), [activePurchase]);
+  const [override, setOverride] = (0, import_react39.useState)(null);
+  const [error, setError] = (0, import_react39.useState)(null);
+  const [transportLoading, setTransportLoading] = (0, import_react39.useState)(false);
+  const derived = (0, import_react39.useMemo)(() => deriveUsage(activePurchase ?? null), [activePurchase]);
   const activePurchaseRef = activePurchase?.reference ?? null;
-  (0, import_react37.useEffect)(() => {
+  (0, import_react39.useEffect)(() => {
     setOverride(null);
   }, [activePurchaseRef]);
   const usage = override ?? derived;
-  const refetch = (0, import_react37.useCallback)(async () => {
+  const refetch = (0, import_react39.useCallback)(async () => {
     setError(null);
     if (typeof transport.getUsage === "function") {
       setTransportLoading(true);
@@ -6233,16 +7937,16 @@ function useUsage() {
 }
 
 // src/primitives/UsageMeter.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var UsageMeterContext = (0, import_react38.createContext)(null);
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var UsageMeterContext = (0, import_react40.createContext)(null);
 function useUsageMeterCtx(part) {
-  const ctx = (0, import_react38.useContext)(UsageMeterContext);
+  const ctx = (0, import_react40.useContext)(UsageMeterContext);
   if (!ctx) {
     throw new Error(`UsageMeter.${part} must be rendered inside <UsageMeter.Root>.`);
   }
   return ctx;
 }
-var Root12 = (0, import_react38.forwardRef)(function UsageMeterRoot({
+var Root13 = (0, import_react40.forwardRef)(function UsageMeterRoot({
   warningAt = 75,
   criticalAt = 90,
   classNames,
@@ -6257,7 +7961,7 @@ var Root12 = (0, import_react38.forwardRef)(function UsageMeterRoot({
   const loading = hookResult.loading && !usage;
   const percentUsed = usage?.percentUsed ?? null;
   const state = loading ? "loading" : percentUsed === null ? "safe" : percentUsed >= criticalAt ? "critical" : percentUsed >= warningAt ? "warning" : "safe";
-  const ctx = (0, import_react38.useMemo)(
+  const ctx = (0, import_react40.useMemo)(
     () => ({
       usage,
       loading,
@@ -6285,7 +7989,7 @@ var Root12 = (0, import_react38.forwardRef)(function UsageMeterRoot({
   );
   const rootClass = [classNames?.root ?? "solvapay-usage-meter", className].filter(Boolean).join(" ");
   const Comp = asChild ? Slot : "div";
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(UsageMeterContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(UsageMeterContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     Comp,
     {
       ref: forwardedRef,
@@ -6297,10 +8001,10 @@ var Root12 = (0, import_react38.forwardRef)(function UsageMeterRoot({
     }
   ) });
 });
-var Bar = (0, import_react38.forwardRef)(function UsageMeterBar({ className, style, ...rest }, forwardedRef) {
+var Bar = (0, import_react40.forwardRef)(function UsageMeterBar({ className, style, ...rest }, forwardedRef) {
   const ctx = useUsageMeterCtx("Bar");
   const width = ctx.percentUsed === null ? 0 : Math.max(0, Math.min(100, ctx.percentUsed));
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "div",
     {
       ref: forwardedRef,
@@ -6321,12 +8025,12 @@ var Bar = (0, import_react38.forwardRef)(function UsageMeterBar({ className, sty
     }
   );
 });
-var Label = (0, import_react38.forwardRef)(function UsageMeterLabel({ className, children, ...rest }, forwardedRef) {
+var Label = (0, import_react40.forwardRef)(function UsageMeterLabel({ className, children, ...rest }, forwardedRef) {
   const ctx = useUsageMeterCtx("Label");
   const copy = useCopy();
   if (!ctx.usage) return null;
   if (ctx.isUnlimited) {
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
       "span",
       {
         ref: forwardedRef,
@@ -6346,7 +8050,7 @@ var Label = (0, import_react38.forwardRef)(function UsageMeterLabel({ className,
     remaining: String(ctx.usage.remaining ?? 0),
     unit
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "span",
     {
       ref: forwardedRef,
@@ -6357,11 +8061,11 @@ var Label = (0, import_react38.forwardRef)(function UsageMeterLabel({ className,
     }
   );
 });
-var Percentage = (0, import_react38.forwardRef)(function UsageMeterPercentage({ className, children, ...rest }, forwardedRef) {
+var Percentage = (0, import_react40.forwardRef)(function UsageMeterPercentage({ className, children, ...rest }, forwardedRef) {
   const ctx = useUsageMeterCtx("Percentage");
   const copy = useCopy();
   if (ctx.percentUsed === null) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "span",
     {
       ref: forwardedRef,
@@ -6378,14 +8082,14 @@ function formatResetsIn(copy, periodEnd, nowMs = typeof performance !== "undefin
   const daysLeft = Math.max(0, Math.ceil((end - nowMs) / (24 * 60 * 60 * 1e3)));
   return daysLeft > 0 ? interpolate(copy.usage.resetsInLabel, { days: String(daysLeft) }) : interpolate(copy.usage.resetsOnLabel, { date: new Date(periodEnd).toLocaleDateString() });
 }
-var ResetsIn = (0, import_react38.forwardRef)(function UsageMeterResetsIn({ className, children, ...rest }, forwardedRef) {
+var ResetsIn = (0, import_react40.forwardRef)(function UsageMeterResetsIn({ className, children, ...rest }, forwardedRef) {
   const ctx = useUsageMeterCtx("ResetsIn");
   const copy = useCopy();
   const periodEnd = ctx.usage?.periodEnd;
   if (!periodEnd) return null;
   const label = formatResetsIn(copy, periodEnd);
   if (!label) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "span",
     {
       ref: forwardedRef,
@@ -6396,11 +8100,11 @@ var ResetsIn = (0, import_react38.forwardRef)(function UsageMeterResetsIn({ clas
     }
   );
 });
-var Loading7 = (0, import_react38.forwardRef)(function UsageMeterLoading({ className, children, ...rest }, forwardedRef) {
+var Loading8 = (0, import_react40.forwardRef)(function UsageMeterLoading({ className, children, ...rest }, forwardedRef) {
   const ctx = useUsageMeterCtx("Loading");
   const copy = useCopy();
   if (ctx.state !== "loading") return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "div",
     {
       ref: forwardedRef,
@@ -6411,11 +8115,11 @@ var Loading7 = (0, import_react38.forwardRef)(function UsageMeterLoading({ class
     }
   );
 });
-var Empty = (0, import_react38.forwardRef)(function UsageMeterEmpty({ className, children, ...rest }, forwardedRef) {
+var Empty = (0, import_react40.forwardRef)(function UsageMeterEmpty({ className, children, ...rest }, forwardedRef) {
   const ctx = useUsageMeterCtx("Empty");
   const copy = useCopy();
   if (ctx.loading || ctx.usage !== null) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "div",
     {
       ref: forwardedRef,
@@ -6426,13 +8130,13 @@ var Empty = (0, import_react38.forwardRef)(function UsageMeterEmpty({ className,
     }
   );
 });
-var UsageMeter = Object.assign(Root12, {
-  Root: Root12,
+var UsageMeter = Object.assign(Root13, {
+  Root: Root13,
   Bar,
   Label,
   Percentage,
   ResetsIn,
-  Loading: Loading7,
+  Loading: Loading8,
   Empty
 });
 function useUsageMeter() {
@@ -6455,6 +8159,40 @@ function useUsageMeter() {
   AmountPickerCustom,
   AmountPickerOption,
   AmountPickerRoot,
+  AutoRecharge,
+  AutoRechargeActions,
+  AutoRechargeAmountField,
+  AutoRechargeBody,
+  AutoRechargeCancelButton,
+  AutoRechargeCard,
+  AutoRechargeCardHeading,
+  AutoRechargeCardSetup,
+  AutoRechargeCardSummary,
+  AutoRechargeContent,
+  AutoRechargeDescription,
+  AutoRechargeDisableButton,
+  AutoRechargeEnableQuestion,
+  AutoRechargeEnableRow,
+  AutoRechargeEnableSentence,
+  AutoRechargeEnableSwitch,
+  AutoRechargeError,
+  AutoRechargeFields,
+  AutoRechargeHeader,
+  AutoRechargeHint,
+  AutoRechargeLoading,
+  AutoRechargeOverlay,
+  AutoRechargeRoot,
+  AutoRechargeSaveButton,
+  AutoRechargeSetup,
+  AutoRechargeStatus,
+  AutoRechargeStatusMessage,
+  AutoRechargeSummary,
+  AutoRechargeThresholdField,
+  AutoRechargeTitle,
+  AutoRechargeTopupField,
+  AutoRechargeTrigger,
+  AutoRechargeUnitToggle,
+  AutoRechargeValidationError,
   BalanceBadge,
   CancelPlanButton,
   CancelledPlanNotice,
@@ -6560,6 +8298,7 @@ function useUsageMeter() {
   useActivationFlow,
   useAmountPicker,
   useAmountPickerCopy,
+  useAutoRechargeForm,
   useCancelledPlanNotice,
   useCheckoutStepsContext,
   useCheckoutSummary,