@solvapay/react 2.2.2-preview-cf2672297243fbf98ba33872a7348aca170e7b01 → 2.2.2

package/dist/mcp/index.js

@@ -1,8 +1,9 @@
 import {
   ExternalLinkGlyph,
   LaunchCustomerPortalButton,
-  paymentMethodCache
-} from "../chunk-3OR5EEP4.js";
+  paymentMethodCache,
+  usePaymentMethod
+} from "../chunk-4UFQDYG5.js";
 import {
   AmountPicker,
   BalanceBadge,
@@ -16,9 +17,12 @@ import {
   SolvaPayProvider,
   TopupForm,
   UsageMeter,
+  buildSummaryLine,
+  configToForm,
   createDefaultAutoRechargeForm,
   createTransportCacheKey,
   estimateCredits,
+  formatAmountWithUnit,
   formatContinueLabel,
   formatCycleSuffix,
   formatPaygRate,
@@ -39,6 +43,7 @@ import {
   seedUsageSnapshot,
   useActivation,
   useAmountPicker,
+  useAutoRecharge,
   useBalance,
   useCheckoutFlow,
   useCopy,
@@ -57,7 +62,7 @@ import {
   useTransport,
   useUsage,
   validateAutoRechargeForm
-} from "../chunk-JVBZHE7B.js";
+} from "../chunk-GPP4MY3I.js";
 import "../chunk-UMXOAUW7.js";
 import "../chunk-MLKGABMK.js";
 
@@ -128,54 +133,19 @@ import { MCP_TOOL_NAMES as MCP_TOOL_NAMES3 } from "@solvapay/mcp-core";
 // src/mcp/useStripeProbe.ts
 import { useEffect, useState } from "react";
 import { loadStripe } from "@stripe/stripe-js";
-var STRIPE_LOAD_TIMEOUT_MS = 1e4;
-var ELEMENT_MOUNT_TIMEOUT_MS = 6e3;
-var CACHEABLE_BLOCKED_REASONS = /* @__PURE__ */ new Set([
-  "csp-frame-src",
-  "loaderror",
-  "load-rejected",
-  "load-null-instance",
-  "elements-create-threw"
-]);
-var stripeProbeCache = /* @__PURE__ */ new Map();
-function resetStripeProbeCacheForTests() {
-  stripeProbeCache.clear();
-}
-function readCachedProbe(publishableKey) {
-  if (!publishableKey) return "blocked";
-  return stripeProbeCache.get(publishableKey) ?? "loading";
-}
-function cacheProbeVerdict(publishableKey, next, reason) {
-  if (next === "ready") {
-    stripeProbeCache.set(publishableKey, "ready");
-    return;
-  }
-  if (next === "blocked" && reason && CACHEABLE_BLOCKED_REASONS.has(reason)) {
-    stripeProbeCache.set(publishableKey, "blocked");
-  }
-}
+var STRIPE_LOAD_TIMEOUT_MS = 3e3;
+var ELEMENT_MOUNT_TIMEOUT_MS = 2e3;
 function useStripeProbe(publishableKey) {
-  const [state, setState] = useState(() => readCachedProbe(publishableKey));
+  const [state, setState] = useState(
+    publishableKey ? "loading" : "blocked"
+  );
   useEffect(() => {
     if (typeof document === "undefined") return;
     if (!publishableKey) {
-      console.warn("[solvapay-mcp] stripe probe blocked", {
-        reason: "no-publishable-key",
-        elapsedMs: 0,
-        loadMs: null
-      });
       setState("blocked");
       return;
     }
-    const cached = stripeProbeCache.get(publishableKey);
-    if (cached) {
-      setState(cached);
-      return;
-    }
     setState("loading");
-    const startedAt = Date.now();
-    let loadResolvedAt = null;
-    let mountStartedAt = null;
     let cancelled = false;
     let resolved = false;
     let cspBlockedStripeFrame = false;
@@ -213,7 +183,7 @@ function useStripeProbe(publishableKey) {
           sourceFile: event.sourceFile
         }
       );
-      resolve("blocked", "csp-frame-src");
+      resolve("blocked");
     };
     document.addEventListener("securitypolicyviolation", onCspViolation);
     const teardown = () => {
@@ -231,46 +201,24 @@ function useStripeProbe(publishableKey) {
         host = null;
       }
     };
-    const logBlocked = (reason) => {
-      console.warn("[solvapay-mcp] stripe probe blocked", {
-        reason,
-        elapsedMs: Date.now() - startedAt,
-        loadMs: loadResolvedAt !== null ? loadResolvedAt - startedAt : null
-      });
-    };
-    const logReady = () => {
-      const now = Date.now();
-      console.warn("[solvapay-mcp] stripe probe ready", {
-        elapsedMs: now - startedAt,
-        loadMs: loadResolvedAt !== null ? loadResolvedAt - startedAt : null,
-        mountMs: mountStartedAt !== null ? now - mountStartedAt : null
-      });
-    };
-    const resolve = (next, reason) => {
+    const resolve = (next) => {
       if (cancelled || resolved) return;
       resolved = true;
-      if (next === "ready") {
-        logReady();
-      } else if (reason) {
-        logBlocked(reason);
-      }
-      cacheProbeVerdict(publishableKey, next, reason);
       teardown();
       setState(next);
     };
     loadTimeoutId = setTimeout(() => {
       loadTimeoutId = null;
-      resolve("blocked", "load-timeout");
+      resolve("blocked");
     }, STRIPE_LOAD_TIMEOUT_MS);
     loadStripe(publishableKey, { developerTools: { assistant: { enabled: false } } }).then((stripe) => {
-      loadResolvedAt = Date.now();
       if (cancelled || resolved) return;
       if (loadTimeoutId !== null) {
         clearTimeout(loadTimeoutId);
         loadTimeoutId = null;
       }
       if (!stripe) {
-        resolve("blocked", "load-null-instance");
+        resolve("blocked");
         return;
       }
       try {
@@ -285,24 +233,22 @@ function useStripeProbe(publishableKey) {
           if (cspBlockedStripeFrame) return;
           resolve("ready");
         });
-        element.on("loaderror", () => resolve("blocked", "loaderror"));
+        element.on("loaderror", () => resolve("blocked"));
         elementTimeoutId = setTimeout(() => {
           elementTimeoutId = null;
-          resolve("blocked", "mount-timeout");
+          resolve("blocked");
         }, ELEMENT_MOUNT_TIMEOUT_MS);
-        mountStartedAt = Date.now();
         element.mount(host);
       } catch {
-        resolve("blocked", "elements-create-threw");
+        resolve("blocked");
       }
     }).catch(() => {
-      loadResolvedAt = Date.now();
       if (cancelled || resolved) return;
       if (loadTimeoutId !== null) {
         clearTimeout(loadTimeoutId);
         loadTimeoutId = null;
       }
-      resolve("blocked", "load-rejected");
+      resolve("blocked");
     });
     return () => {
       cancelled = true;
@@ -570,8 +516,7 @@ function parseBootstrapFromToolResult(result, toolName, fallbackView) {
     merchant: structured?.merchant ?? {},
     product: structured?.product ?? { reference: ref },
     plans: Array.isArray(structured?.plans) ? structured.plans : [],
-    customer: structured?.customer ?? null,
-    ...typeof structured?.autoRechargeUrl === "string" ? { autoRechargeUrl: structured.autoRechargeUrl } : {}
+    customer: structured?.customer ?? null
   };
 }
 function waitForInitialToolResult(app, options = {}) {
@@ -703,11 +648,11 @@ function seedMcpCaches(initial, config) {
 }
 
 // src/mcp/McpApp.tsx
-import { useEffect as useEffect7, useMemo as useMemo5, useRef as useRef8, useState as useState12 } from "react";
+import { useEffect as useEffect7, useMemo as useMemo5, useRef as useRef6, useState as useState11 } from "react";
 import { VIEW_FOR_TOOL as VIEW_FOR_TOOL2 } from "@solvapay/mcp-core";
 
 // src/mcp/McpAppShell.tsx
-import { useCallback as useCallback5, useState as useState10 } from "react";
+import { useCallback as useCallback5, useState as useState9 } from "react";
 
 // src/mcp/account-state.ts
 import {
@@ -2024,8 +1969,7 @@ function CreditAccountPanel({
   locale,
   classNames,
   onTopup,
-  autoRecharge,
-  autoRechargeUrl,
+  onAutoRecharge,
   onChangePlan,
   showPortalCta
 }) {
@@ -2033,7 +1977,8 @@ function CreditAccountPanel({
   const copy = useCopy();
   const balance = useBalance();
   const { merchant } = useMerchant();
-  const handleExternalClick = useExternalLinkClick();
+  const { config: autoRecharge } = useAutoRecharge();
+  const { paymentMethod } = usePaymentMethod();
   const { displayMode } = useDisplayMode();
   const isFullscreen = displayMode === "fullscreen";
   const history = useHistory({
@@ -2051,13 +1996,10 @@ function CreditAccountPanel({
     paidPlanCount
   });
   const showChangePlan = Boolean(onChangePlan && (actions.changePlan || actions.upgrade));
-  const status = autoRecharge?.status;
-  const enabled = autoRecharge?.enabled === true;
-  const failed = status === "failed";
-  const pendingSetup = enabled && status === "pending_setup";
-  const title = failed ? copy.autoRecharge.statusFailed : pendingSetup ? copy.account.autoRechargePending : enabled ? copy.account.autoRechargeOn : copy.account.autoRechargeOff;
-  const caption = !enabled && !failed ? accountState === "D" ? copy.account.autoRechargeOffFixCaption : copy.account.autoRechargeOffCaption : null;
-  const actionLabel = failed ? copy.account.fixCard : enabled ? copy.account.manage : copy.account.turnOn;
+  const autoRechargeOn = Boolean(autoRecharge?.enabled);
+  const hasReusableCard = paymentMethod?.kind === "card" && paymentMethod.reusable;
+  const autoRechargeAction = onAutoRecharge && (autoRechargeOn || hasReusableCard) ? onAutoRecharge : void 0;
+  const autoRechargeActionLabel = autoRechargeOn ? copy.account.manage : copy.account.turnOn;
   return /* @__PURE__ */ jsxs5("div", { className: "solvapay-mcp-account", children: [
     /* @__PURE__ */ jsxs5("div", { className: cx2.card, children: [
       /* @__PURE__ */ jsx8(
@@ -2086,24 +2028,10 @@ function CreditAccountPanel({
       onTopup ? /* @__PURE__ */ jsx8("button", { type: "button", className: cx2.button, onClick: onTopup, children: copy.account.addFunds }) : null,
       /* @__PURE__ */ jsxs5(SplitRow, { children: [
         /* @__PURE__ */ jsxs5("div", { className: "solvapay-mcp-auto-recharge-copy", children: [
-          /* @__PURE__ */ jsx8("p", { children: title }),
-          caption ? /* @__PURE__ */ jsx8("p", { className: cx2.muted, children: caption }) : null
+          /* @__PURE__ */ jsx8("p", { children: autoRechargeOn ? copy.account.autoRechargeOn : copy.account.autoRechargeOff }),
+          !autoRechargeOn ? /* @__PURE__ */ jsx8("p", { className: cx2.muted, children: accountState === "D" ? copy.account.autoRechargeOffFixCaption : copy.account.autoRechargeOffCaption }) : null
         ] }),
-        autoRechargeUrl ? /* @__PURE__ */ jsxs5(
-          "a",
-          {
-            href: autoRechargeUrl,
-            target: "_blank",
-            rel: "noopener noreferrer",
-            className: cx2.linkButton,
-            "aria-label": `${actionLabel} (opens in a new tab)`,
-            onClick: handleExternalClick,
-            children: [
-              actionLabel,
-              /* @__PURE__ */ jsx8(ExternalLinkGlyph, {})
-            ]
-          }
-        ) : null
+        autoRechargeAction ? /* @__PURE__ */ jsx8("button", { type: "button", className: cx2.linkButton, onClick: autoRechargeAction, children: autoRechargeActionLabel }) : null
       ] }),
       showPortalCta && !isFullscreen ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
         /* @__PURE__ */ jsx8("p", { className: cx2.muted, "data-solvapay-mcp-portal-hint": "", children: copy.currentPlan.portalHint }),
@@ -2693,8 +2621,7 @@ function McpAccountView({
   productRef,
   classNames,
   onTopup,
-  autoRecharge,
-  autoRechargeUrl,
+  onAutoRecharge,
   onChangePlan,
   plans
 }) {
@@ -2738,8 +2665,7 @@ function McpAccountView({
         locale,
         classNames,
         onTopup,
-        autoRecharge,
-        autoRechargeUrl,
+        onAutoRecharge,
         onChangePlan,
         showPortalCta
       }
@@ -2798,11 +2724,8 @@ function McpAccountView({
   );
 }
 
-// src/mcp/views/checkout/EmbeddedCheckout.tsx
-import { useCallback as useCallback4, useEffect as useEffect6, useMemo as useMemo4, useRef as useRef5, useState as useState8 } from "react";
-
-// src/mcp/views/checkout/steps/PlanStep.tsx
-import { memo } from "react";
+// src/mcp/views/McpAutoRechargeView.tsx
+import { useState as useState5 } from "react";
 
 // src/mcp/views/BackLink.tsx
 import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
@@ -2822,8 +2745,256 @@ function BackLink({ label, glyph = "\u2190", className, onClick, ...rest }) {
   );
 }
 
+// src/mcp/views/autoRecharge/McpAutoRechargeFields.tsx
+import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+function currencySymbol(currency) {
+  try {
+    const parts = new Intl.NumberFormat("en", {
+      style: "currency",
+      currency,
+      currencyDisplay: "narrowSymbol"
+    }).formatToParts(0);
+    return parts.find((part) => part.type === "currency")?.value ?? currency.toUpperCase();
+  } catch {
+    return currency.toUpperCase();
+  }
+}
+function McpAutoRechargeFields({
+  form,
+  onChange,
+  currency,
+  validationError,
+  creditsPerMinorUnit,
+  displayExchangeRate
+}) {
+  const copy = useCopy();
+  const prefix = currencySymbol(currency);
+  const suffix = currency.toUpperCase();
+  const credits = estimateCredits(
+    Number(form.topupAmountMajor),
+    currency,
+    creditsPerMinorUnit,
+    displayExchangeRate
+  );
+  const explainer = credits != null ? interpolate(copy.autoRechargeView.explainer, {
+    credits: new Intl.NumberFormat().format(credits)
+  }) : copy.autoRechargeView.explainerNoEstimate;
+  return /* @__PURE__ */ jsxs9("div", { className: "solvapay-mcp-auto-recharge-fields", children: [
+    /* @__PURE__ */ jsx14(
+      Field,
+      {
+        id: "mcp-auto-recharge-threshold",
+        label: copy.autoRechargeView.thresholdLabel,
+        value: form.thresholdAmountMajor,
+        prefix,
+        suffix,
+        onChange: (thresholdAmountMajor) => onChange({ ...form, thresholdAmountMajor })
+      }
+    ),
+    /* @__PURE__ */ jsx14(
+      Field,
+      {
+        id: "mcp-auto-recharge-topup",
+        label: copy.autoRechargeView.topupLabel,
+        value: form.topupAmountMajor,
+        prefix,
+        suffix,
+        onChange: (topupAmountMajor) => onChange({ ...form, topupAmountMajor })
+      }
+    ),
+    /* @__PURE__ */ jsx14(
+      Field,
+      {
+        id: "mcp-auto-recharge-cap",
+        label: copy.autoRechargeView.maxMonthlySpendLabel,
+        value: form.maxMonthlySpendMajor,
+        prefix,
+        suffix,
+        placeholder: copy.autoRechargeView.maxMonthlySpendPlaceholder,
+        onChange: (maxMonthlySpendMajor) => onChange({ ...form, maxMonthlySpendMajor })
+      }
+    ),
+    /* @__PURE__ */ jsx14("p", { className: "solvapay-mcp-auto-recharge-fields-explainer", children: explainer }),
+    validationError ? /* @__PURE__ */ jsx14("p", { className: "solvapay-mcp-auto-recharge-fields-error", role: "alert", children: validationError }) : null
+  ] });
+}
+
+// src/mcp/views/McpAutoRechargeView.tsx
+import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+var FALLBACK_CURRENCY = "USD";
+function resolveCurrency(displayCurrency, merchantCurrency) {
+  if (displayCurrency) return displayCurrency.toUpperCase();
+  if (merchantCurrency) return merchantCurrency.toUpperCase();
+  return FALLBACK_CURRENCY;
+}
+function McpAutoRechargeView({ classNames, onBack }) {
+  const cx2 = resolveMcpClassNames(classNames);
+  const copy = useCopy();
+  const { merchant, loading: merchantLoading } = useMerchant();
+  const { displayCurrency, creditsPerMinorUnit, displayExchangeRate } = useBalance();
+  const { config, loading, saving, disabling, error, save, disable } = useAutoRecharge();
+  const currency = resolveCurrency(displayCurrency, merchant?.defaultCurrency);
+  const conversion = { creditsPerMinorUnit, displayExchangeRate };
+  const [form, setForm] = useState5(() => ({
+    ...createDefaultAutoRechargeForm(currency),
+    enabled: true
+  }));
+  const [hydrated, setHydrated] = useState5(false);
+  const [validationError, setValidationError] = useState5(null);
+  const [setupError, setSetupError] = useState5(null);
+  if (!loading && !hydrated) {
+    setHydrated(true);
+    if (config?.enabled) {
+      setForm({ ...configToForm(config, currency), enabled: true });
+    }
+  }
+  const editing = Boolean(config?.enabled);
+  const summary = buildSummaryLine(form, currency);
+  const thresholdDisplay = formatAmountWithUnit(
+    form.thresholdAmountMajor,
+    form.thresholdUnit,
+    currency
+  );
+  if (loading || merchantLoading) {
+    return /* @__PURE__ */ jsx15("section", { className: cx2.card, "aria-label": "Loading auto-recharge", children: /* @__PURE__ */ jsx15("p", { children: "Loading auto-recharge\u2026" }) });
+  }
+  const handleSave = async () => {
+    const result = validateAutoRechargeForm(
+      { ...form, enabled: true },
+      currency,
+      conversion,
+      copy.autoRecharge
+    );
+    if (!result.ok) {
+      setValidationError(result.error);
+      return;
+    }
+    setValidationError(null);
+    setSetupError(null);
+    try {
+      const response = await save(result.payload);
+      if (response.setupClientSecret) {
+        setSetupError(copy.autoRechargeView.setupUnexpected);
+        return;
+      }
+      onBack?.();
+    } catch {
+    }
+  };
+  const handleDisable = async () => {
+    setSetupError(null);
+    try {
+      await disable();
+      onBack?.();
+    } catch {
+    }
+  };
+  const loudError = setupError ?? (error ? error.message : null);
+  return /* @__PURE__ */ jsx15("section", { className: cx2.card, "aria-label": copy.autoRechargeView.heading, children: /* @__PURE__ */ jsxs10("div", { className: "solvapay-mcp-auto-recharge-view", children: [
+    onBack ? /* @__PURE__ */ jsx15(BackLink, { label: copy.autoRechargeView.back, onClick: onBack }) : null,
+    /* @__PURE__ */ jsxs10("div", { className: cx2.stack, children: [
+      /* @__PURE__ */ jsxs10("div", { className: "solvapay-mcp-auto-recharge-heading", children: [
+        /* @__PURE__ */ jsx15("h2", { className: cx2.heading, children: copy.autoRechargeView.heading }),
+        editing ? /* @__PURE__ */ jsx15(StatusDot, { label: copy.autoRechargeView.statusOn }) : null
+      ] }),
+      editing ? null : /* @__PURE__ */ jsx15("p", { className: cx2.muted, children: copy.autoRechargeView.description }),
+      summary ? /* @__PURE__ */ jsx15("p", { className: "solvapay-mcp-auto-recharge-summary", children: summary }) : null
+    ] }),
+    /* @__PURE__ */ jsx15(Section, { children: /* @__PURE__ */ jsx15(
+      McpAutoRechargeFields,
+      {
+        form,
+        onChange: (next) => {
+          setValidationError(null);
+          setForm(next);
+        },
+        currency,
+        validationError,
+        creditsPerMinorUnit,
+        displayExchangeRate
+      }
+    ) }),
+    loudError ? /* @__PURE__ */ jsx15("p", { className: cx2.error, role: "alert", children: loudError }) : null,
+    editing ? /* @__PURE__ */ jsxs10("div", { className: "solvapay-mcp-auto-recharge-actions-stack", children: [
+      /* @__PURE__ */ jsx15(
+        "button",
+        {
+          type: "button",
+          className: cx2.button,
+          disabled: saving || disabling,
+          onClick: () => {
+            void handleSave();
+          },
+          children: copy.autoRechargeView.save
+        }
+      ),
+      /* @__PURE__ */ jsx15(
+        "button",
+        {
+          type: "button",
+          className: cx2.button,
+          "data-variant": "secondary",
+          disabled: saving || disabling,
+          onClick: onBack,
+          children: copy.autoRechargeView.cancel
+        }
+      ),
+      /* @__PURE__ */ jsx15(
+        "button",
+        {
+          type: "button",
+          className: `${cx2.linkButton} solvapay-mcp-auto-recharge-turn-off`.trim(),
+          disabled: saving || disabling,
+          onClick: () => {
+            void handleDisable();
+          },
+          children: copy.autoRechargeView.turnOff
+        }
+      )
+    ] }) : /* @__PURE__ */ jsxs10("div", { className: "solvapay-mcp-auto-recharge-footer", children: [
+      /* @__PURE__ */ jsx15("p", { className: cx2.muted, children: interpolate(copy.autoRechargeView.footerCaption, {
+        threshold: thresholdDisplay
+      }) }),
+      /* @__PURE__ */ jsxs10("div", { className: "solvapay-mcp-auto-recharge-actions", children: [
+        /* @__PURE__ */ jsx15(
+          "button",
+          {
+            type: "button",
+            className: cx2.button,
+            "data-variant": "secondary",
+            disabled: saving,
+            onClick: onBack,
+            children: copy.autoRechargeView.cancel
+          }
+        ),
+        /* @__PURE__ */ jsx15(
+          "button",
+          {
+            type: "button",
+            className: cx2.button,
+            disabled: saving,
+            onClick: () => {
+              void handleSave();
+            },
+            children: copy.autoRechargeView.turnOn
+          }
+        )
+      ] })
+    ] })
+  ] }) });
+}
+
+// src/mcp/views/McpCheckoutView.tsx
+import React11, { useCallback as useCallback4, useEffect as useEffect6, useMemo as useMemo4, useRef as useRef4, useState as useState7 } from "react";
+
+// src/mcp/views/checkout/EmbeddedCheckout.tsx
+import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo3, useRef as useRef3 } from "react";
+
+// src/mcp/views/checkout/steps/PlanStep.tsx
+import { memo } from "react";
+
 // src/mcp/views/checkout/CheckoutPlanRow.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 function CheckoutPlanRow({
   plan,
   locale,
@@ -2840,7 +3011,7 @@ function CheckoutPlanRow({
   const state = resolvePlanRowState({ current, selected, free });
   const priceLabel = formatPlanPriceLabel(plan, locale, selectedOption);
   const description = descriptionOverride ?? planWhatItGives(plan, locale, balance);
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx16(
     PlanRow,
     {
       name: plan.name ?? plan.reference,
@@ -2880,7 +3051,7 @@ function planWhatItGives(plan, locale, balance) {
 }
 
 // src/mcp/views/checkout/steps/PlanStep.tsx
-import { Fragment as Fragment5, jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
 var PlanStep = memo(function PlanStep2({
   fromPaywall,
   paywallKind,
@@ -2900,14 +3071,14 @@ var PlanStep = memo(function PlanStep2({
   const pricingOption = selectedPlan ? getSelectedOption(selectedPlan) : void 0;
   const ctaLabel = formatContinueLabel(selectedPlanShape, locale, pricingOption);
   const showPreface = fromPaywall && !hideUpgradeBanner && paywallKind !== "payment_required";
-  return /* @__PURE__ */ jsxs9(Fragment5, { children: [
-    onBack ? /* @__PURE__ */ jsx15(BackLink, { label: copy.checkout.backToAccount, onClick: onBack }) : null,
-    showPreface ? /* @__PURE__ */ jsx15("p", { className: cx2.muted, role: "status", children: "This tool needs a paid plan. Pick one to get started." }) : null,
-    /* @__PURE__ */ jsxs9("div", { className: "solvapay-mcp-plan-step-header", children: [
-      /* @__PURE__ */ jsx15("h2", { className: cx2.heading, children: "Choose a plan" }),
-      /* @__PURE__ */ jsx15(PlanSelector.CurrencySwitcher, { className: "solvapay-plan-selector-currency-switcher" })
+  return /* @__PURE__ */ jsxs11(Fragment5, { children: [
+    onBack ? /* @__PURE__ */ jsx17(BackLink, { label: copy.checkout.backToAccount, onClick: onBack }) : null,
+    showPreface ? /* @__PURE__ */ jsx17("p", { className: cx2.muted, role: "status", children: "This tool needs a paid plan. Pick one to get started." }) : null,
+    /* @__PURE__ */ jsxs11("div", { className: "solvapay-mcp-plan-step-header", children: [
+      /* @__PURE__ */ jsx17("h2", { className: cx2.heading, children: "Choose a plan" }),
+      /* @__PURE__ */ jsx17(PlanSelector.CurrencySwitcher, { className: "solvapay-plan-selector-currency-switcher" })
     ] }),
-    /* @__PURE__ */ jsx15("div", { className: "solvapay-mcp-plan-list", children: plans.map((plan) => /* @__PURE__ */ jsx15(
+    /* @__PURE__ */ jsx17("div", { className: "solvapay-mcp-plan-list", children: plans.map((plan) => /* @__PURE__ */ jsx17(
       CheckoutPlanRow,
       {
         plan,
@@ -2921,10 +3092,10 @@ var PlanStep = memo(function PlanStep2({
       },
       plan.reference
     )) }),
-    /* @__PURE__ */ jsx15(PlanSelector.Loading, { className: "solvapay-plan-selector-loading" }),
-    /* @__PURE__ */ jsx15(PlanSelector.Error, { className: "solvapay-plan-selector-error" }),
-    activationError ? /* @__PURE__ */ jsx15("p", { className: cx2.error, role: "alert", children: activationError }) : null,
-    /* @__PURE__ */ jsx15(
+    /* @__PURE__ */ jsx17(PlanSelector.Loading, { className: "solvapay-plan-selector-loading" }),
+    /* @__PURE__ */ jsx17(PlanSelector.Error, { className: "solvapay-plan-selector-error" }),
+    activationError ? /* @__PURE__ */ jsx17("p", { className: cx2.error, role: "alert", children: activationError }) : null,
+    /* @__PURE__ */ jsx17(
       "button",
       {
         type: "button",
@@ -2935,7 +3106,7 @@ var PlanStep = memo(function PlanStep2({
         children: ctaLabel
       }
     ),
-    onStayOnFree ? /* @__PURE__ */ jsx15(
+    onStayOnFree ? /* @__PURE__ */ jsx17(
       "button",
       {
         type: "button",
@@ -2949,143 +3120,7 @@ var PlanStep = memo(function PlanStep2({
 });
 
 // src/mcp/views/checkout/steps/AmountStep.tsx
-import { memo as memo2, useRef as useRef3, useState as useState6 } from "react";
-
-// src/mcp/views/autoRecharge/McpInlineAutoRecharge.tsx
-import { forwardRef, useImperativeHandle, useState as useState5 } from "react";
-
-// src/mcp/views/autoRecharge/McpAutoRechargeFields.tsx
-import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
-function currencySymbol(currency) {
-  try {
-    const parts = new Intl.NumberFormat("en", {
-      style: "currency",
-      currency,
-      currencyDisplay: "narrowSymbol"
-    }).formatToParts(0);
-    return parts.find((part) => part.type === "currency")?.value ?? currency.toUpperCase();
-  } catch {
-    return currency.toUpperCase();
-  }
-}
-function McpAutoRechargeFields({
-  form,
-  onChange,
-  currency,
-  validationError,
-  creditsPerMinorUnit,
-  displayExchangeRate
-}) {
-  const copy = useCopy();
-  const prefix = currencySymbol(currency);
-  const suffix = currency.toUpperCase();
-  const credits = estimateCredits(
-    Number(form.topupAmountMajor),
-    currency,
-    creditsPerMinorUnit,
-    displayExchangeRate
-  );
-  const explainer = credits != null ? interpolate(copy.autoRechargeView.explainer, {
-    credits: new Intl.NumberFormat().format(credits)
-  }) : copy.autoRechargeView.explainerNoEstimate;
-  return /* @__PURE__ */ jsxs10("div", { className: "solvapay-mcp-auto-recharge-fields", children: [
-    /* @__PURE__ */ jsx16(
-      Field,
-      {
-        id: "mcp-auto-recharge-threshold",
-        label: copy.autoRechargeView.thresholdLabel,
-        value: form.thresholdAmountMajor,
-        prefix,
-        suffix,
-        onChange: (thresholdAmountMajor) => onChange({ ...form, thresholdAmountMajor })
-      }
-    ),
-    /* @__PURE__ */ jsx16(
-      Field,
-      {
-        id: "mcp-auto-recharge-topup",
-        label: copy.autoRechargeView.topupLabel,
-        value: form.topupAmountMajor,
-        prefix,
-        suffix,
-        onChange: (topupAmountMajor) => onChange({ ...form, topupAmountMajor })
-      }
-    ),
-    /* @__PURE__ */ jsx16(
-      Field,
-      {
-        id: "mcp-auto-recharge-cap",
-        label: copy.autoRechargeView.maxMonthlySpendLabel,
-        value: form.maxMonthlySpendMajor,
-        prefix,
-        suffix,
-        placeholder: copy.autoRechargeView.maxMonthlySpendPlaceholder,
-        onChange: (maxMonthlySpendMajor) => onChange({ ...form, maxMonthlySpendMajor })
-      }
-    ),
-    /* @__PURE__ */ jsx16("p", { className: "solvapay-mcp-auto-recharge-fields-explainer", children: explainer }),
-    validationError ? /* @__PURE__ */ jsx16("p", { className: "solvapay-mcp-auto-recharge-fields-error", role: "alert", children: validationError }) : null
-  ] });
-}
-
-// src/mcp/views/autoRecharge/McpInlineAutoRecharge.tsx
-import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
-var McpInlineAutoRecharge = forwardRef(function McpInlineAutoRecharge2({ currency, creditsPerMinorUnit, displayExchangeRate }, ref) {
-  const copy = useCopy();
-  const [form, setForm] = useState5(() => createDefaultAutoRechargeForm(currency));
-  const [error, setError] = useState5(null);
-  useImperativeHandle(ref, () => ({
-    validate: () => {
-      const result = validateAutoRechargeForm(
-        form,
-        currency,
-        { creditsPerMinorUnit, displayExchangeRate },
-        copy.autoRecharge
-      );
-      if (!result.ok) {
-        setError(result.error);
-        return { ok: false };
-      }
-      setError(null);
-      return {
-        ok: true,
-        payload: result.payload.enabled ? result.payload : void 0
-      };
-    }
-  }));
-  return /* @__PURE__ */ jsxs11("div", { className: "solvapay-mcp-auto-recharge-inline", children: [
-    /* @__PURE__ */ jsxs11(SplitRow, { children: [
-      /* @__PURE__ */ jsx17("p", { children: copy.autoRechargeView.heading }),
-      /* @__PURE__ */ jsx17(
-        Toggle,
-        {
-          checked: form.enabled,
-          label: copy.autoRechargeView.heading,
-          onChange: (enabled) => {
-            setError(null);
-            setForm((current) => ({ ...current, enabled }));
-          }
-        }
-      )
-    ] }),
-    form.enabled ? /* @__PURE__ */ jsx17(
-      McpAutoRechargeFields,
-      {
-        form,
-        onChange: (next) => {
-          setError(null);
-          setForm(next);
-        },
-        currency,
-        validationError: error,
-        creditsPerMinorUnit,
-        displayExchangeRate
-      }
-    ) : null
-  ] });
-});
-
-// src/mcp/views/checkout/steps/AmountStep.tsx
+import { memo as memo2, useState as useState6 } from "react";
 import { Fragment as Fragment6, jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
 var AmountStep = memo2(function AmountStep2({
   topupCurrency,
@@ -3097,8 +3132,6 @@ var AmountStep = memo2(function AmountStep2({
 }) {
   const currency = (topupCurrency ?? "USD").toUpperCase();
   const locale = useHostLocale();
-  const { creditsPerMinorUnit, displayExchangeRate } = useBalance();
-  const autoRechargeRef = useRef3(null);
   const [stagedAmountMinor, setStagedAmountMinor] = useState6(null);
   const currencies = topupCurrencies ?? [];
   const showCurrencySwitch = currencies.length > 1 && !!onCurrencyChange;
@@ -3129,27 +3162,11 @@ var AmountStep = memo2(function AmountStep2({
         children: [
           /* @__PURE__ */ jsx18(PresetAmountRow, { cx: cx2, currencyDisplay }),
           /* @__PURE__ */ jsx18(CustomAmountRow, { rowClassName: cx2.amountCustom, currencyDisplay }),
-          /* @__PURE__ */ jsx18(
-            McpInlineAutoRecharge,
-            {
-              ref: autoRechargeRef,
-              currency,
-              creditsPerMinorUnit,
-              displayExchangeRate
-            }
-          ),
           /* @__PURE__ */ jsx18(
             AmountPicker.Confirm,
             {
               className: cx2.button,
-              onConfirm: (amountMinor) => {
-                const result = autoRechargeRef.current?.validate();
-                if (result == null) {
-                  throw new Error("AmountStep: auto-recharge form is not mounted");
-                }
-                if (!result.ok) return;
-                onContinue(amountMinor, result.payload);
-              },
+              onConfirm: (amountMinor) => onContinue(amountMinor),
               children: stagedAmountMinor ? `Continue \u2014 ${formatPrice(stagedAmountMinor, currency, { locale, currencyDisplay })}` : "Continue"
             }
           )
@@ -3281,7 +3298,6 @@ var PaygPaymentStep = memo3(function PaygPaymentStep2({
   plan: _plan,
   amountMinor,
   topupCurrency,
-  autoRecharge,
   returnUrl,
   onBack,
   onSuccess,
@@ -3298,7 +3314,6 @@ var PaygPaymentStep = memo3(function PaygPaymentStep2({
     {
       amount: amountMinor,
       currency,
-      autoRecharge,
       returnUrl,
       onSuccess: (_intent, extras) => onSuccess(extras),
       children: /* @__PURE__ */ jsxs15(McpHostedLayout, { children: [
@@ -3504,14 +3519,271 @@ var SuccessStep = memo5(function SuccessStep2({ meta, cx: cx2 }) {
   ] });
 });
 
-// src/mcp/views/checkout/HostedCheckout.tsx
-import React10, { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo3, useRef as useRef4, useState as useState7 } from "react";
-import { Fragment as Fragment11, jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
+// src/mcp/views/checkout/EmbeddedCheckout.tsx
+import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
+function EmbeddedCheckout({
+  productRef,
+  returnUrl,
+  onPurchaseSuccess,
+  fromPaywall,
+  paywallKind,
+  hideUpgradeBanner,
+  plans,
+  onClose,
+  onBack,
+  initialPlanRef,
+  autoAdvance,
+  cx: cx2,
+  children
+}) {
+  const { loading, isRefetching, activePurchase } = usePurchase();
+  const currentPlanRef = activePurchase?.planSnapshot?.reference ?? null;
+  const paidPlans = useMemo3(() => {
+    const list = plans ?? [];
+    return list.filter((p) => p.requiresPayment !== false);
+  }, [plans]);
+  const paygPlanRef = useMemo3(() => {
+    const payg = paidPlans.find((p) => isPayg(p));
+    return payg?.reference ?? void 0;
+  }, [paidPlans]);
+  const planFilter = useMemo3(
+    () => (plan) => plan.requiresPayment !== false || plan.reference === currentPlanRef,
+    [currentPlanRef]
+  );
+  if (loading) {
+    return /* @__PURE__ */ jsx25("div", { className: cx2.card, children: /* @__PURE__ */ jsx25("p", { children: "Loading checkout\u2026" }) });
+  }
+  return /* @__PURE__ */ jsxs18("div", { className: cx2.card, "data-refreshing": isRefetching ? "true" : void 0, children: [
+    /* @__PURE__ */ jsx25(
+      PlanSelector.Root,
+      {
+        productRef,
+        filter: planFilter,
+        sortBy: planSortByPaygFirstThenAsc,
+        popularPlanRef: paygPlanRef,
+        currentPlanRef,
+        autoSelectFirstPaid: Boolean(paygPlanRef),
+        initialPlanRef,
+        className: "solvapay-plan-selector",
+        children: /* @__PURE__ */ jsx25(
+          McpCheckoutBody,
+          {
+            productRef,
+            returnUrl,
+            onPurchaseSuccess,
+            fromPaywall,
+            paywallKind,
+            hideUpgradeBanner,
+            onClose,
+            onBack,
+            initialPlanRef,
+            autoAdvance,
+            cx: cx2
+          }
+        )
+      }
+    ),
+    children
+  ] });
+}
+function McpCheckoutBody({
+  productRef,
+  returnUrl,
+  onPurchaseSuccess,
+  fromPaywall,
+  paywallKind,
+  hideUpgradeBanner,
+  onClose,
+  onBack,
+  initialPlanRef,
+  autoAdvance,
+  cx: cx2
+}) {
+  const bridge = useMcpBridge();
+  const locale = useHostLocale();
+  const flow = useCheckoutFlow({
+    productRef,
+    // `notifyModelContext` for plan commit fires from the explicit
+    // Continue handler below — not on `selectPlan` — so a stray
+    // selection doesn't burn a host emit before the user opts in.
+    onPurchaseSuccess: (meta) => {
+      if (meta.branch === "payg" && meta.amountMinor != null && meta.currency != null) {
+        void bridge.notifyModelContext({
+          text: `Activated ${meta.plan.name ?? "plan"} with ${formatPrice(
+            meta.amountMinor,
+            meta.currency,
+            { locale }
+          )} in credits.`
+        });
+        void bridge.notifySuccess({
+          kind: "topup",
+          amountMinor: meta.amountMinor,
+          currency: meta.currency
+        });
+      } else {
+        void bridge.notifyModelContext({
+          text: `Activated ${meta.plan.name ?? "plan"}.`
+        });
+        void bridge.notifySuccess({
+          kind: "plan-activated",
+          planName: meta.plan.name ?? null
+        });
+      }
+      onPurchaseSuccess?.();
+    }
+  });
+  const onStayOnFree = useCallback3(() => {
+    void bridge.sendMessage({ text: "Sticking with the free tier for now." });
+    onClose?.();
+  }, [bridge, onClose]);
+  const selectedPlanShape = flow.selectedPlan;
+  const onPlanContinue = useCallback3(() => {
+    if (selectedPlanShape) {
+      void bridge.notifyModelContext({
+        text: `User selected ${selectedPlanShape.name ?? "a plan"}.`
+      });
+    }
+    void flow.advance();
+  }, [bridge, flow, selectedPlanShape]);
+  const autoAdvancedRef = useRef3(false);
+  useEffect5(() => {
+    if (!autoAdvance || autoAdvancedRef.current) return;
+    if (flow.step !== "plan") return;
+    if (flow.selectedPlanRef !== initialPlanRef) return;
+    autoAdvancedRef.current = true;
+    onPlanContinue();
+  }, [autoAdvance, flow.selectedPlanRef, flow.step, initialPlanRef, onPlanContinue]);
+  if (flow.step === "plan") {
+    const waitingForSelection = Boolean(autoAdvance) && !flow.selectedPlanRef;
+    const matchingPending = Boolean(autoAdvance) && flow.selectedPlanRef === initialPlanRef && flow.status === "activating";
+    if (waitingForSelection || matchingPending) {
+      return /* @__PURE__ */ jsx25("p", { children: "Loading checkout\u2026" });
+    }
+    return /* @__PURE__ */ jsx25(
+      PlanStep,
+      {
+        fromPaywall,
+        paywallKind,
+        hideUpgradeBanner,
+        onContinue: onPlanContinue,
+        onStayOnFree: fromPaywall && onClose ? onStayOnFree : void 0,
+        onBack,
+        isActivating: flow.status === "activating",
+        activationError: flow.error,
+        cx: cx2
+      }
+    );
+  }
+  if (flow.step === "amount") {
+    if (!selectedPlanShape) {
+      return null;
+    }
+    return /* @__PURE__ */ jsx25(
+      AmountStep,
+      {
+        plan: selectedPlanShape,
+        topupCurrency: flow.topupCurrency,
+        topupCurrencies: flow.topupCurrencies,
+        onCurrencyChange: flow.setTopupCurrency,
+        onBack: () => flow.back(),
+        onContinue: (amountMinor) => {
+          flow.selectAmount(amountMinor);
+          void flow.advance();
+        },
+        cx: cx2
+      }
+    );
+  }
+  if (flow.step === "payment") {
+    if (flow.branch === "payg" && selectedPlanShape && flow.selectedAmountMinor != null) {
+      return /* @__PURE__ */ jsx25(
+        PaygPaymentStep,
+        {
+          plan: selectedPlanShape,
+          amountMinor: flow.selectedAmountMinor,
+          topupCurrency: flow.topupCurrency,
+          returnUrl,
+          onBack: () => flow.back(),
+          onSuccess: (extras) => flow.notifyPaymentSuccess(void 0, extras),
+          cx: cx2
+        }
+      );
+    }
+    if (flow.branch === "recurring" && selectedPlanShape && flow.selectedPlanRef) {
+      return /* @__PURE__ */ jsx25(
+        RecurringPaymentStep,
+        {
+          plan: selectedPlanShape,
+          planRef: flow.selectedPlanRef,
+          productRef,
+          returnUrl,
+          onBack: () => flow.back(),
+          onSuccess: (intent) => flow.notifyPaymentSuccess(intent),
+          cx: cx2
+        }
+      );
+    }
+    return null;
+  }
+  if (flow.step === "success" && flow.successMeta) {
+    return /* @__PURE__ */ jsx25(SuccessStep, { meta: flow.successMeta, cx: cx2 });
+  }
+  return null;
+}
+
+// src/mcp/views/McpCheckoutView.tsx
+import { Fragment as Fragment11, jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
 var POLL_INTERVAL_MS = 3e3;
 var AWAITING_TIMEOUT_MS = 10 * 60 * 1e3;
+function McpCheckoutView({
+  productRef,
+  publishableKey = null,
+  returnUrl,
+  onPurchaseSuccess,
+  onRequestTopup: _onRequestTopup,
+  fromPaywall = false,
+  paywallKind,
+  plans,
+  onClose,
+  onBack,
+  initialPlanRef,
+  autoAdvance,
+  classNames,
+  children
+}) {
+  const cx2 = resolveMcpClassNames(classNames);
+  const probe = useStripeProbe(publishableKey);
+  if (probe === "loading") {
+    return /* @__PURE__ */ jsxs19("div", { className: cx2.card, children: [
+      /* @__PURE__ */ jsx26("p", { children: "Loading checkout\u2026" }),
+      children
+    ] });
+  }
+  if (probe === "ready") {
+    return /* @__PURE__ */ jsx26(
+      EmbeddedCheckout,
+      {
+        productRef,
+        returnUrl,
+        onPurchaseSuccess,
+        fromPaywall,
+        paywallKind,
+        plans,
+        onClose,
+        onBack,
+        initialPlanRef,
+        autoAdvance,
+        cx: cx2,
+        classNames,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx26(HostedCheckout, { productRef, onPurchaseSuccess, cx: cx2, children });
+}
 function useHostedUrl(enabled, fetcher, label) {
   const [state, setState] = useState7({ status: "idle" });
-  useEffect5(() => {
+  useEffect6(() => {
     if (!enabled) {
       setState({ status: "idle" });
       return;
@@ -3532,7 +3804,7 @@ function useHostedUrl(enabled, fetcher, label) {
   }, [enabled, fetcher, label]);
   return state;
 }
-var HostedLinkButton = React10.memo(function HostedLinkButton2({
+var HostedLinkButton = React11.memo(function HostedLinkButton2({
   state,
   loadingLabel,
   readyLabel,
@@ -3541,7 +3813,7 @@ var HostedLinkButton = React10.memo(function HostedLinkButton2({
 }) {
   const handleExternalClick = useExternalLinkClick();
   if (state.status === "ready") {
-    return /* @__PURE__ */ jsx25(
+    return /* @__PURE__ */ jsx26(
       "a",
       {
         className: "solvapay-mcp-hosted-link",
@@ -3553,19 +3825,19 @@ var HostedLinkButton = React10.memo(function HostedLinkButton2({
           onLaunch?.(state.href);
           handleExternalClick(event);
         },
-        children: /* @__PURE__ */ jsxs18("button", { type: "button", className: cx2.button, children: [
+        children: /* @__PURE__ */ jsxs19("button", { type: "button", className: cx2.button, children: [
           readyLabel,
-          /* @__PURE__ */ jsx25(ExternalLinkGlyph, {})
+          /* @__PURE__ */ jsx26(ExternalLinkGlyph, {})
         ] })
       }
     );
   }
-  return /* @__PURE__ */ jsx25("button", { type: "button", className: cx2.button, disabled: true, children: state.status === "error" ? "Unavailable" : loadingLabel });
+  return /* @__PURE__ */ jsx26("button", { type: "button", className: cx2.button, disabled: true, children: state.status === "error" ? "Unavailable" : loadingLabel });
 });
 function Spinner() {
-  return /* @__PURE__ */ jsx25("span", { className: "solvapay-mcp-spinner", "aria-hidden": "true" });
+  return /* @__PURE__ */ jsx26("span", { className: "solvapay-mcp-spinner", "aria-hidden": "true" });
 }
-var AwaitingBody = React10.memo(function AwaitingBody2({
+var AwaitingBody = React11.memo(function AwaitingBody2({
   href,
   timedOut,
   onReopen,
@@ -3573,13 +3845,13 @@ var AwaitingBody = React10.memo(function AwaitingBody2({
   cx: cx2
 }) {
   const handleExternalClick = useExternalLinkClick();
-  return /* @__PURE__ */ jsxs18(Fragment11, { children: [
-    /* @__PURE__ */ jsxs18("div", { className: cx2.awaitingHeader, children: [
-      /* @__PURE__ */ jsx25(Spinner, {}),
-      /* @__PURE__ */ jsx25("h2", { className: cx2.heading, children: timedOut ? "Still waiting for payment" : "Waiting for payment\u2026" })
+  return /* @__PURE__ */ jsxs19(Fragment11, { children: [
+    /* @__PURE__ */ jsxs19("div", { className: cx2.awaitingHeader, children: [
+      /* @__PURE__ */ jsx26(Spinner, {}),
+      /* @__PURE__ */ jsx26("h2", { className: cx2.heading, children: timedOut ? "Still waiting for payment" : "Waiting for payment\u2026" })
     ] }),
-    /* @__PURE__ */ jsx25("p", { className: cx2.muted, children: timedOut ? "We haven't seen your purchase yet. If you completed payment, give it another moment \u2014 otherwise reopen checkout or cancel." : "Complete payment in the other tab. Your purchase will show up here automatically." }),
-    /* @__PURE__ */ jsx25(
+    /* @__PURE__ */ jsx26("p", { className: cx2.muted, children: timedOut ? "We haven't seen your purchase yet. If you completed payment, give it another moment \u2014 otherwise reopen checkout or cancel." : "Complete payment in the other tab. Your purchase will show up here automatically." }),
+    /* @__PURE__ */ jsx26(
       "a",
       {
         className: "solvapay-mcp-hosted-link",
@@ -3591,16 +3863,16 @@ var AwaitingBody = React10.memo(function AwaitingBody2({
           onReopen();
           handleExternalClick(event);
         },
-        children: /* @__PURE__ */ jsxs18("button", { type: "button", className: cx2.button, children: [
+        children: /* @__PURE__ */ jsxs19("button", { type: "button", className: cx2.button, children: [
           "Reopen checkout",
-          /* @__PURE__ */ jsx25(ExternalLinkGlyph, {})
+          /* @__PURE__ */ jsx26(ExternalLinkGlyph, {})
         ] })
       }
     ),
-    /* @__PURE__ */ jsx25("button", { type: "button", className: cx2.linkButton, onClick: onCancel, children: "Didn't complete? Cancel" })
+    /* @__PURE__ */ jsx26("button", { type: "button", className: cx2.linkButton, onClick: onCancel, children: "Didn't complete? Cancel" })
   ] });
 });
-var CancelledBody = React10.memo(function CancelledBody2({
+var CancelledBody = React11.memo(function CancelledBody2({
   productName,
   endDate,
   daysLeft,
@@ -3609,25 +3881,25 @@ var CancelledBody = React10.memo(function CancelledBody2({
   onLaunch,
   cx: cx2
 }) {
-  return /* @__PURE__ */ jsxs18(Fragment11, { children: [
-    /* @__PURE__ */ jsxs18("h2", { className: cx2.heading, children: [
+  return /* @__PURE__ */ jsxs19(Fragment11, { children: [
+    /* @__PURE__ */ jsxs19("h2", { className: cx2.heading, children: [
       "Your ",
       productName,
       " purchase is cancelled"
     ] }),
-    endDate && formattedEndDate ? /* @__PURE__ */ jsxs18("div", { className: cx2.notice, children: [
-      /* @__PURE__ */ jsx25("p", { children: /* @__PURE__ */ jsxs18("strong", { children: [
+    endDate && formattedEndDate ? /* @__PURE__ */ jsxs19("div", { className: cx2.notice, children: [
+      /* @__PURE__ */ jsx26("p", { children: /* @__PURE__ */ jsxs19("strong", { children: [
         "Access expires ",
         formattedEndDate
       ] }) }),
-      daysLeft !== null && daysLeft > 0 && /* @__PURE__ */ jsxs18("p", { className: cx2.muted, children: [
+      daysLeft !== null && daysLeft > 0 && /* @__PURE__ */ jsxs19("p", { className: cx2.muted, children: [
         daysLeft,
         " ",
         daysLeft === 1 ? "day" : "days",
         " remaining"
       ] })
-    ] }) : /* @__PURE__ */ jsx25("p", { className: cx2.muted, children: "Your purchase access has ended." }),
-    /* @__PURE__ */ jsx25(
+    ] }) : /* @__PURE__ */ jsx26("p", { className: cx2.muted, children: "Your purchase access has ended." }),
+    /* @__PURE__ */ jsx26(
       HostedLinkButton,
       {
         state: checkout,
@@ -3637,19 +3909,14 @@ var CancelledBody = React10.memo(function CancelledBody2({
         cx: cx2
       }
     ),
-    checkout.status === "error" && /* @__PURE__ */ jsx25("p", { className: cx2.error, role: "alert", children: checkout.message })
+    checkout.status === "error" && /* @__PURE__ */ jsx26("p", { className: cx2.error, role: "alert", children: checkout.message })
   ] });
 });
-var UpgradeBody = React10.memo(function UpgradeBody2({
-  planName,
-  checkout,
-  onLaunch,
-  cx: cx2
-}) {
-  return /* @__PURE__ */ jsxs18(Fragment11, { children: [
-    /* @__PURE__ */ jsx25("h2", { className: cx2.heading, children: planName ? `Complete your ${planName} purchase` : "Upgrade your plan" }),
-    /* @__PURE__ */ jsx25("p", { className: cx2.muted, children: "The SolvaPay checkout opens in a new tab. Return here after payment and your purchase will show up automatically." }),
-    /* @__PURE__ */ jsx25(
+var UpgradeBody = React11.memo(function UpgradeBody2({ checkout, onLaunch, cx: cx2 }) {
+  return /* @__PURE__ */ jsxs19(Fragment11, { children: [
+    /* @__PURE__ */ jsx26("h2", { className: cx2.heading, children: "Upgrade your plan" }),
+    /* @__PURE__ */ jsx26("p", { className: cx2.muted, children: "The SolvaPay checkout opens in a new tab. Return here after payment and your purchase will show up automatically." }),
+    /* @__PURE__ */ jsx26(
       HostedLinkButton,
       {
         state: checkout,
@@ -3659,13 +3926,11 @@ var UpgradeBody = React10.memo(function UpgradeBody2({
         cx: cx2
       }
     ),
-    checkout.status === "error" && /* @__PURE__ */ jsx25("p", { className: cx2.error, role: "alert", children: checkout.message })
+    checkout.status === "error" && /* @__PURE__ */ jsx26("p", { className: cx2.error, role: "alert", children: checkout.message })
   ] });
 });
 function HostedCheckout({
   productRef,
-  planRef,
-  planName,
   onPurchaseSuccess,
   cx: cx2,
   children
@@ -3677,26 +3942,23 @@ function HostedCheckout({
   const [awaitingTimedOut, setAwaitingTimedOut] = useState7(false);
   const [hasLoadedOnce, setHasLoadedOnce] = useState7(false);
   const onPurchaseSuccessRef = useRef4(onPurchaseSuccess);
-  useEffect5(() => {
+  useEffect6(() => {
     onPurchaseSuccessRef.current = onPurchaseSuccess;
   }, [onPurchaseSuccess]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!loading && !hasLoadedOnce) setHasLoadedOnce(true);
   }, [loading, hasLoadedOnce]);
-  const fetchCheckoutUrl = useCallback3(async () => {
-    const { checkoutUrl } = await transport.createCheckoutSession({
-      productRef,
-      ...planRef ? { planRef } : {}
-    });
+  const fetchCheckoutUrl = useCallback4(async () => {
+    const { checkoutUrl } = await transport.createCheckoutSession({ productRef });
     return { href: checkoutUrl };
-  }, [planRef, productRef, transport]);
+  }, [productRef, transport]);
   const checkout = useHostedUrl(hasLoadedOnce, fetchCheckoutUrl, "checkout session");
-  const safeRefetch = useCallback3(() => {
+  const safeRefetch = useCallback4(() => {
     refetch().catch((err) => {
       console.warn("[solvapay-mcp] refetch failed", err);
     });
   }, [refetch]);
-  useEffect5(() => {
+  useEffect6(() => {
     const onFocus = () => safeRefetch();
     const onVisibility = () => {
       if (document.visibilityState === "visible") safeRefetch();
@@ -3708,7 +3970,7 @@ function HostedCheckout({
       document.removeEventListener("visibilitychange", onVisibility);
     };
   }, [safeRefetch]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!awaiting) return;
     const interval = window.setInterval(() => {
       if (document.visibilityState === "hidden") return;
@@ -3722,7 +3984,7 @@ function HostedCheckout({
       window.clearTimeout(timeout);
     };
   }, [awaiting, safeRefetch]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!awaiting) return;
     if (!hasPaidPurchase) return;
     const newRef = activePurchase?.reference ?? null;
@@ -3733,7 +3995,7 @@ function HostedCheckout({
       onPurchaseSuccessRef.current?.();
     }
   }, [awaiting, hasPaidPurchase, activePurchase?.reference]);
-  const beginAwaiting = useCallback3(
+  const beginAwaiting = useCallback4(
     (href) => {
       setAwaiting({
         baselineActiveRef: activePurchase?.reference ?? null,
@@ -3745,27 +4007,27 @@ function HostedCheckout({
     },
     [activePurchase?.reference, hasPaidPurchase]
   );
-  const cancelAwaiting = useCallback3(() => {
+  const cancelAwaiting = useCallback4(() => {
     setAwaiting(null);
     setAwaitingTimedOut(false);
   }, []);
-  const dismissTimeout = useCallback3(() => {
+  const dismissTimeout = useCallback4(() => {
     setAwaitingTimedOut(false);
   }, []);
   const cancelledProductName = cancelledPurchase?.productName ?? null;
   const cancelledEndDate = cancelledPurchase?.endDate;
-  const cancelledDaysLeft = useMemo3(
+  const cancelledDaysLeft = useMemo4(
     () => cancelledEndDate ? getDaysUntilExpiration(cancelledEndDate) : null,
     [cancelledEndDate, getDaysUntilExpiration]
   );
-  const cancelledFormattedEndDate = useMemo3(
+  const cancelledFormattedEndDate = useMemo4(
     () => cancelledEndDate ? formatDate(cancelledEndDate) : null,
     [cancelledEndDate, formatDate]
   );
   const awaitingHref = awaiting?.href ?? null;
-  const inner = useMemo3(() => {
+  const inner = useMemo4(() => {
     if (awaiting && awaitingHref) {
-      return /* @__PURE__ */ jsx25(
+      return /* @__PURE__ */ jsx26(
         AwaitingBody,
         {
           href: awaitingHref,
@@ -3777,7 +4039,7 @@ function HostedCheckout({
       );
     }
     if (shouldShowCancelledNotice && cancelledProductName) {
-      return /* @__PURE__ */ jsx25(
+      return /* @__PURE__ */ jsx26(
         CancelledBody,
         {
           productName: cancelledProductName,
@@ -3790,7 +4052,7 @@ function HostedCheckout({
         }
       );
     }
-    return /* @__PURE__ */ jsx25(UpgradeBody, { planName, checkout, onLaunch: beginAwaiting, cx: cx2 });
+    return /* @__PURE__ */ jsx26(UpgradeBody, { checkout, onLaunch: beginAwaiting, cx: cx2 });
   }, [
     awaiting,
     awaitingHref,
@@ -3804,297 +4066,19 @@ function HostedCheckout({
     cancelledFormattedEndDate,
     checkout,
     beginAwaiting,
-    planName,
     cx2
   ]);
   if (loading) {
-    return /* @__PURE__ */ jsx25("div", { className: cx2.card, children: /* @__PURE__ */ jsx25("p", { children: "Loading purchase\u2026" }) });
-  }
-  return /* @__PURE__ */ jsxs18("div", { className: cx2.card, "data-refreshing": isRefetching ? "true" : void 0, children: [
-    inner,
-    children
-  ] });
-}
-
-// src/mcp/views/checkout/EmbeddedCheckout.tsx
-import { jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
-function EmbeddedCheckout({
-  productRef,
-  returnUrl,
-  onPurchaseSuccess,
-  fromPaywall,
-  paywallKind,
-  hideUpgradeBanner,
-  plans,
-  onClose,
-  onBack,
-  initialPlanRef,
-  autoAdvance,
-  stripeProbe,
-  cx: cx2,
-  children
-}) {
-  const { loading, isRefetching, activePurchase } = usePurchase();
-  const currentPlanRef = activePurchase?.planSnapshot?.reference ?? null;
-  const paidPlans = useMemo4(() => {
-    const list = plans ?? [];
-    return list.filter((p) => p.requiresPayment !== false);
-  }, [plans]);
-  const paygPlanRef = useMemo4(() => {
-    const payg = paidPlans.find((p) => isPayg(p));
-    return payg?.reference ?? void 0;
-  }, [paidPlans]);
-  const planFilter = useMemo4(
-    () => (plan) => plan.requiresPayment !== false || plan.reference === currentPlanRef,
-    [currentPlanRef]
-  );
-  if (loading) {
-    return /* @__PURE__ */ jsx26("div", { className: cx2.card, children: /* @__PURE__ */ jsx26("p", { children: "Loading checkout\u2026" }) });
+    return /* @__PURE__ */ jsx26("div", { className: cx2.card, children: /* @__PURE__ */ jsx26("p", { children: "Loading purchase\u2026" }) });
   }
   return /* @__PURE__ */ jsxs19("div", { className: cx2.card, "data-refreshing": isRefetching ? "true" : void 0, children: [
-    /* @__PURE__ */ jsx26(
-      PlanSelector.Root,
-      {
-        productRef,
-        filter: planFilter,
-        sortBy: planSortByPaygFirstThenAsc,
-        popularPlanRef: paygPlanRef,
-        currentPlanRef,
-        autoSelectFirstPaid: Boolean(paygPlanRef),
-        initialPlanRef,
-        className: "solvapay-plan-selector",
-        children: /* @__PURE__ */ jsx26(
-          McpCheckoutBody,
-          {
-            productRef,
-            returnUrl,
-            onPurchaseSuccess,
-            fromPaywall,
-            paywallKind,
-            hideUpgradeBanner,
-            onClose,
-            onBack,
-            initialPlanRef,
-            autoAdvance,
-            stripeProbe,
-            cx: cx2
-          }
-        )
-      }
-    ),
+    inner,
     children
   ] });
 }
-function McpCheckoutBody({
-  productRef,
-  returnUrl,
-  onPurchaseSuccess,
-  fromPaywall,
-  paywallKind,
-  hideUpgradeBanner,
-  onClose,
-  onBack,
-  initialPlanRef,
-  autoAdvance,
-  stripeProbe,
-  cx: cx2
-}) {
-  const bridge = useMcpBridge();
-  const locale = useHostLocale();
-  const flow = useCheckoutFlow({
-    productRef,
-    // `notifyModelContext` for plan commit fires from the explicit
-    // Continue handler below — not on `selectPlan` — so a stray
-    // selection doesn't burn a host emit before the user opts in.
-    onPurchaseSuccess: (meta) => {
-      if (meta.branch === "payg" && meta.amountMinor != null && meta.currency != null) {
-        void bridge.notifyModelContext({
-          text: `Activated ${meta.plan.name ?? "plan"} with ${formatPrice(
-            meta.amountMinor,
-            meta.currency,
-            { locale }
-          )} in credits.`
-        });
-        void bridge.notifySuccess({
-          kind: "topup",
-          amountMinor: meta.amountMinor,
-          currency: meta.currency
-        });
-      } else {
-        void bridge.notifyModelContext({
-          text: `Activated ${meta.plan.name ?? "plan"}.`
-        });
-        void bridge.notifySuccess({
-          kind: "plan-activated",
-          planName: meta.plan.name ?? null
-        });
-      }
-      onPurchaseSuccess?.();
-    }
-  });
-  const onStayOnFree = useCallback4(() => {
-    void bridge.sendMessage({ text: "Sticking with the free tier for now." });
-    onClose?.();
-  }, [bridge, onClose]);
-  const selectedPlanShape = flow.selectedPlan;
-  const [autoRecharge, setAutoRecharge] = useState8();
-  const onPlanContinue = useCallback4(() => {
-    if (selectedPlanShape) {
-      void bridge.notifyModelContext({
-        text: `User selected ${selectedPlanShape.name ?? "a plan"}.`
-      });
-    }
-    void flow.advance();
-  }, [bridge, flow, selectedPlanShape]);
-  const autoAdvancedRef = useRef5(false);
-  useEffect6(() => {
-    if (!autoAdvance || autoAdvancedRef.current) return;
-    if (flow.step !== "plan") return;
-    if (flow.selectedPlanRef !== initialPlanRef) return;
-    autoAdvancedRef.current = true;
-    onPlanContinue();
-  }, [autoAdvance, flow.selectedPlanRef, flow.step, initialPlanRef, onPlanContinue]);
-  if (flow.step === "plan") {
-    const waitingForSelection = Boolean(autoAdvance) && !flow.selectedPlanRef;
-    const matchingPending = Boolean(autoAdvance) && flow.selectedPlanRef === initialPlanRef && flow.status === "activating";
-    if (waitingForSelection || matchingPending) {
-      return /* @__PURE__ */ jsx26("p", { children: "Loading checkout\u2026" });
-    }
-    return /* @__PURE__ */ jsx26(
-      PlanStep,
-      {
-        fromPaywall,
-        paywallKind,
-        hideUpgradeBanner,
-        onContinue: onPlanContinue,
-        onStayOnFree: fromPaywall && onClose ? onStayOnFree : void 0,
-        onBack,
-        isActivating: flow.status === "activating",
-        activationError: flow.error,
-        cx: cx2
-      }
-    );
-  }
-  if (flow.step === "amount") {
-    if (!selectedPlanShape) {
-      return null;
-    }
-    return /* @__PURE__ */ jsx26(
-      AmountStep,
-      {
-        plan: selectedPlanShape,
-        topupCurrency: flow.topupCurrency,
-        topupCurrencies: flow.topupCurrencies,
-        onCurrencyChange: (code) => {
-          setAutoRecharge(void 0);
-          flow.setTopupCurrency(code);
-        },
-        onBack: () => flow.back(),
-        onContinue: (amountMinor, nextAutoRecharge) => {
-          setAutoRecharge(nextAutoRecharge);
-          flow.selectAmount(amountMinor);
-          void flow.advance();
-        },
-        cx: cx2
-      }
-    );
-  }
-  if (flow.step === "payment") {
-    if (stripeProbe === "loading") {
-      return /* @__PURE__ */ jsx26("p", { children: "Loading checkout\u2026" });
-    }
-    if (stripeProbe === "blocked") {
-      return /* @__PURE__ */ jsx26(
-        HostedCheckout,
-        {
-          productRef,
-          planRef: flow.selectedPlanRef ?? void 0,
-          planName: selectedPlanShape?.name ?? void 0,
-          onPurchaseSuccess,
-          cx: cx2
-        }
-      );
-    }
-    if (flow.branch === "payg" && selectedPlanShape && flow.selectedAmountMinor != null) {
-      return /* @__PURE__ */ jsx26(
-        PaygPaymentStep,
-        {
-          plan: selectedPlanShape,
-          amountMinor: flow.selectedAmountMinor,
-          topupCurrency: flow.topupCurrency,
-          autoRecharge,
-          returnUrl,
-          onBack: () => flow.back(),
-          onSuccess: (extras) => flow.notifyPaymentSuccess(void 0, extras),
-          cx: cx2
-        }
-      );
-    }
-    if (flow.branch === "recurring" && selectedPlanShape && flow.selectedPlanRef) {
-      return /* @__PURE__ */ jsx26(
-        RecurringPaymentStep,
-        {
-          plan: selectedPlanShape,
-          planRef: flow.selectedPlanRef,
-          productRef,
-          returnUrl,
-          onBack: () => flow.back(),
-          onSuccess: (intent) => flow.notifyPaymentSuccess(intent),
-          cx: cx2
-        }
-      );
-    }
-    return null;
-  }
-  if (flow.step === "success" && flow.successMeta) {
-    return /* @__PURE__ */ jsx26(SuccessStep, { meta: flow.successMeta, cx: cx2 });
-  }
-  return null;
-}
-
-// src/mcp/views/McpCheckoutView.tsx
-import { jsx as jsx27 } from "react/jsx-runtime";
-function McpCheckoutView({
-  productRef,
-  publishableKey = null,
-  returnUrl,
-  onPurchaseSuccess,
-  onRequestTopup: _onRequestTopup,
-  fromPaywall = false,
-  paywallKind,
-  plans,
-  onClose,
-  onBack,
-  initialPlanRef,
-  autoAdvance,
-  classNames,
-  children
-}) {
-  const cx2 = resolveMcpClassNames(classNames);
-  const probe = useStripeProbe(publishableKey);
-  return /* @__PURE__ */ jsx27(
-    EmbeddedCheckout,
-    {
-      productRef,
-      returnUrl,
-      onPurchaseSuccess,
-      fromPaywall,
-      paywallKind,
-      plans,
-      onClose,
-      onBack,
-      initialPlanRef,
-      autoAdvance,
-      stripeProbe: probe,
-      cx: cx2,
-      classNames,
-      children
-    }
-  );
-}
 
 // src/mcp/views/McpTopupView.tsx
-import { useRef as useRef6, useState as useState9 } from "react";
+import { useState as useState8 } from "react";
 
 // src/mcp/format-compact-credits.ts
 function formatCompactCredits(credits, locale = "en-US") {
@@ -4111,7 +4095,7 @@ function formatCompactCredits(credits, locale = "en-US") {
 }
 
 // src/mcp/views/McpTopupView.tsx
-import { Fragment as Fragment12, jsx as jsx28, jsxs as jsxs20 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
 var FALLBACK_TOPUP_CURRENCY = "USD";
 function resolveDefaultCurrency(merchant) {
   if (merchant?.defaultCurrency) {
@@ -4137,15 +4121,18 @@ function McpTopupView({
   const cx2 = resolveMcpClassNames(classNames);
   const probe = useStripeProbe(publishableKey);
   const { merchant, loading: merchantLoading } = useMerchant();
-  if (merchantLoading) {
-    return /* @__PURE__ */ jsx28("section", { className: cx2.card, "aria-label": "Loading top-up", children: /* @__PURE__ */ jsx28("p", { children: "Loading top-up\u2026" }) });
+  if (probe === "loading" || merchantLoading) {
+    return /* @__PURE__ */ jsx27("section", { className: cx2.card, "aria-label": "Loading top-up", children: /* @__PURE__ */ jsx27("p", { children: "Loading top-up\u2026" }) });
+  }
+  if (probe === "blocked") {
+    return /* @__PURE__ */ jsx27(HostedTopupFallback, { cx: cx2, onBack });
   }
   const defaultCurrency = resolveDefaultCurrency(merchant ?? void 0);
   const fromMerchant = (merchant?.supportedTopupCurrencies ?? []).map((code) => code.toUpperCase()).filter(Boolean);
   const topupCurrencies = Array.from(
     new Set(fromMerchant.length > 0 ? fromMerchant : [defaultCurrency])
   );
-  return /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx27(
     EmbeddedTopup,
     {
       returnUrl,
@@ -4153,7 +4140,6 @@ function McpTopupView({
       topupCurrencies,
       onTopupSuccess,
       onBack,
-      stripeProbe: probe,
       cx: cx2
     }
   );
@@ -4164,15 +4150,18 @@ function EmbeddedTopup({
   topupCurrencies,
   onTopupSuccess,
   onBack,
-  stripeProbe,
   cx: cx2
 }) {
-  const [screen, setScreen] = useState9({ step: "amount" });
-  const [selectedCurrency, setSelectedCurrency] = useState9(defaultCurrency);
+  const [screen, setScreen] = useState8({ step: "amount" });
+  const [selectedCurrency, setSelectedCurrency] = useState8(defaultCurrency);
   const currency = selectedCurrency;
   const showCurrencySwitch = topupCurrencies.length > 1;
   const { adjustBalance, credits, creditsPerMinorUnit, displayCurrency, displayExchangeRate } = useBalance();
-  const autoRechargeRef = useRef6(null);
+  const copy = useCopy();
+  const [autoRechargeForm, setAutoRechargeForm] = useState8(
+    () => createDefaultAutoRechargeForm(currency)
+  );
+  const [autoRechargeError, setAutoRechargeError] = useState8(null);
   const locale = useHostLocale();
   const { notifyModelContext, notifySuccess } = useMcpBridge();
   const topupSelector = useTopupAmountSelector({ currency });
@@ -4184,38 +4173,29 @@ function EmbeddedTopup({
     topupSelector.reset();
   };
   if (screen.step === "success") {
-    const estimate = estimateTopupCredits(
-      screen.amountMinor,
-      currency,
-      displayCurrency,
-      creditsPerMinorUnit,
-      displayExchangeRate
-    );
+    const displayAmount = formatPrice(screen.amountMinor, currency, { locale, free: "" });
     return /* @__PURE__ */ jsxs20("section", { className: cx2.card, "aria-label": "Top-up success", children: [
-      /* @__PURE__ */ jsx28("div", { className: "solvapay-mcp-checkout-success-check", "aria-hidden": "true", children: "\u2713" }),
-      /* @__PURE__ */ jsx28("h2", { className: cx2.heading, children: "Credits added" }),
-      /* @__PURE__ */ jsxs20("dl", { className: "solvapay-mcp-checkout-receipt", "data-variant": "payg", children: [
-        /* @__PURE__ */ jsxs20("div", { className: "solvapay-mcp-checkout-receipt-row", children: [
-          /* @__PURE__ */ jsx28("dt", { children: "Amount" }),
-          /* @__PURE__ */ jsx28("dd", { children: formatPrice(screen.amountMinor, currency, { locale, free: "" }) })
-        ] }),
-        estimate.kind === "available" ? /* @__PURE__ */ jsxs20("div", { className: "solvapay-mcp-checkout-receipt-row", children: [
-          /* @__PURE__ */ jsx28("dt", { children: "Credits" }),
-          /* @__PURE__ */ jsxs20("dd", { children: [
-            "+",
-            estimate.credits.toLocaleString(locale)
-          ] })
-        ] }) : null
-      ] })
+      onBack ? /* @__PURE__ */ jsx27(BackLink, { label: "Back to my account", onClick: onBack }) : null,
+      /* @__PURE__ */ jsxs20("header", { className: cx2.balanceRow, children: [
+        /* @__PURE__ */ jsx27("h2", { className: cx2.heading, children: "Credits added" }),
+        /* @__PURE__ */ jsx27(BalanceBadge, {})
+      ] }),
+      /* @__PURE__ */ jsxs20("p", { className: cx2.muted, children: [
+        displayAmount,
+        " landed in your balance."
+      ] }),
+      /* @__PURE__ */ jsx27("button", { type: "button", className: cx2.button, onClick: () => setScreen({ step: "amount" }), children: "Add more credits" }),
+      /* @__PURE__ */ jsx27(
+        LaunchCustomerPortalButton,
+        {
+          className: cx2.button,
+          loadingClassName: cx2.button,
+          errorClassName: cx2.button
+        }
+      )
     ] });
   }
   if (screen.step === "payment") {
-    if (stripeProbe === "loading") {
-      return /* @__PURE__ */ jsx28("section", { className: cx2.card, "aria-label": "Loading top-up", children: /* @__PURE__ */ jsx28("p", { children: "Loading top-up\u2026" }) });
-    }
-    if (stripeProbe === "blocked") {
-      return /* @__PURE__ */ jsx28(HostedTopupFallback, { cx: cx2, onChangeAmount: () => setScreen({ step: "amount" }) });
-    }
     const committedAmountMinor = screen.amountMinor;
     const creditEstimate = estimateTopupCredits(
       committedAmountMinor,
@@ -4229,7 +4209,7 @@ function EmbeddedTopup({
       creditEstimate.kind === "available" ? `Adds ${creditEstimate.credits.toLocaleString(locale)} credits` : void 0,
       formattedBalance ? `Balance ${formattedBalance} credits` : void 0
     ].filter((part) => part != null);
-    return /* @__PURE__ */ jsx28("section", { className: cx2.card, "aria-label": "Top-up payment", children: /* @__PURE__ */ jsx28(
+    return /* @__PURE__ */ jsx27("section", { className: cx2.card, "aria-label": "Top-up payment", children: /* @__PURE__ */ jsx27(
       TopupForm.Root,
       {
         amount: committedAmountMinor,
@@ -4255,14 +4235,14 @@ function EmbeddedTopup({
           onTopupSuccess?.(committedAmountMinor);
         },
         children: /* @__PURE__ */ jsxs20(McpHostedLayout, { children: [
-          /* @__PURE__ */ jsx28(McpSummaryRail, { children: /* @__PURE__ */ jsxs20("section", { className: cx2.stack, children: [
-            /* @__PURE__ */ jsx28("p", { className: cx2.muted, children: "Total due today" }),
-            /* @__PURE__ */ jsx28("p", { className: cx2.topupAmountHero, children: /* @__PURE__ */ jsx28(TopupChargeAmount, { amountMinor: committedAmountMinor, currency }) }),
-            contextParts.length > 0 ? /* @__PURE__ */ jsx28("p", { className: cx2.topupBalanceContext, children: contextParts.join(" \xB7 ") }) : null,
-            isFullscreen ? /* @__PURE__ */ jsx28(TopupForm.Summary.Rows, { className: cx2.taxSummary }) : /* @__PURE__ */ jsx28(TopupForm.Summary.TaxNote, { className: cx2.muted })
+          /* @__PURE__ */ jsx27(McpSummaryRail, { children: /* @__PURE__ */ jsxs20("section", { className: cx2.stack, children: [
+            /* @__PURE__ */ jsx27("p", { className: cx2.muted, children: "Total due today" }),
+            /* @__PURE__ */ jsx27("p", { className: cx2.topupAmountHero, children: /* @__PURE__ */ jsx27(TopupChargeAmount, { amountMinor: committedAmountMinor, currency }) }),
+            contextParts.length > 0 ? /* @__PURE__ */ jsx27("p", { className: cx2.topupBalanceContext, children: contextParts.join(" \xB7 ") }) : null,
+            isFullscreen ? /* @__PURE__ */ jsx27(TopupForm.Summary.Rows, { className: cx2.taxSummary }) : /* @__PURE__ */ jsx27(TopupForm.Summary.TaxNote, { className: cx2.muted })
           ] }) }),
           /* @__PURE__ */ jsxs20(McpHostedBody, { children: [
-            /* @__PURE__ */ jsx28(
+            /* @__PURE__ */ jsx27(
               McpPaymentHeader,
               {
                 backLabel: "Change amount",
@@ -4270,16 +4250,16 @@ function EmbeddedTopup({
               }
             ),
             /* @__PURE__ */ jsxs20("div", { className: cx2.topupForm, children: [
-              /* @__PURE__ */ jsx28(TopupForm.Loading, {}),
-              /* @__PURE__ */ jsx28(TopupForm.PaymentElement, {}),
-              /* @__PURE__ */ jsx28(TopupForm.BusinessDetails.Root, { className: cx2.businessDetails, children: /* @__PURE__ */ jsx28(TopupForm.BusinessDetails.Fields, {}) }),
-              /* @__PURE__ */ jsx28(TopupForm.Error, { className: cx2.error }),
+              /* @__PURE__ */ jsx27(TopupForm.Loading, {}),
+              /* @__PURE__ */ jsx27(TopupForm.PaymentElement, {}),
+              /* @__PURE__ */ jsx27(TopupForm.BusinessDetails.Root, { className: cx2.businessDetails, children: /* @__PURE__ */ jsx27(TopupForm.BusinessDetails.Fields, {}) }),
+              /* @__PURE__ */ jsx27(TopupForm.Error, { className: cx2.error }),
               /* @__PURE__ */ jsxs20(TopupForm.SubmitButton, { className: cx2.button, children: [
                 "Top up",
                 " ",
-                /* @__PURE__ */ jsx28(TopupChargeAmount, { amountMinor: committedAmountMinor, currency })
+                /* @__PURE__ */ jsx27(TopupChargeAmount, { amountMinor: committedAmountMinor, currency })
               ] }),
-              /* @__PURE__ */ jsx28(MandateText, { mode: "topup", amountMinor: committedAmountMinor, currency })
+              /* @__PURE__ */ jsx27(MandateText, { mode: "topup", amountMinor: committedAmountMinor, currency })
             ] })
           ] })
         ] })
@@ -4295,7 +4275,7 @@ function EmbeddedTopup({
       selector: topupSelector,
       className: cx2.amountPicker,
       children: [
-        isFullscreen ? null : /* @__PURE__ */ jsx28(
+        isFullscreen ? null : /* @__PURE__ */ jsx27(
           AmountStepHeader,
           {
             cx: cx2,
@@ -4305,38 +4285,65 @@ function EmbeddedTopup({
             onCurrencyChange: handleCurrencyChange
           }
         ),
-        /* @__PURE__ */ jsx28(PresetAmountGrid, { currencyDisplay, locale }),
-        /* @__PURE__ */ jsx28(
+        /* @__PURE__ */ jsx27(PresetAmountGrid, { currencyDisplay, locale }),
+        /* @__PURE__ */ jsx27(
           CustomAmountRow2,
           {
             rowClassName: cx2.amountCustom,
             currencyDisplay
           }
         ),
-        /* @__PURE__ */ jsx28(
-          McpInlineAutoRecharge,
-          {
-            ref: autoRechargeRef,
-            currency,
-            creditsPerMinorUnit,
-            displayExchangeRate
-          }
-        ),
-        /* @__PURE__ */ jsx28(AmountDueSummary, { locale, currency }),
-        /* @__PURE__ */ jsx28(
+        /* @__PURE__ */ jsxs20("div", { className: "solvapay-mcp-auto-recharge-inline", children: [
+          /* @__PURE__ */ jsxs20(SplitRow, { children: [
+            /* @__PURE__ */ jsx27("p", { children: copy.autoRechargeView.heading }),
+            /* @__PURE__ */ jsx27(
+              Toggle,
+              {
+                checked: autoRechargeForm.enabled,
+                label: copy.autoRechargeView.heading,
+                onChange: (enabled) => {
+                  setAutoRechargeError(null);
+                  setAutoRechargeForm((current) => ({ ...current, enabled }));
+                }
+              }
+            )
+          ] }),
+          autoRechargeForm.enabled ? /* @__PURE__ */ jsx27(
+            McpAutoRechargeFields,
+            {
+              form: autoRechargeForm,
+              onChange: (next) => {
+                setAutoRechargeError(null);
+                setAutoRechargeForm(next);
+              },
+              currency,
+              validationError: autoRechargeError,
+              creditsPerMinorUnit,
+              displayExchangeRate
+            }
+          ) : null
+        ] }),
+        /* @__PURE__ */ jsx27(AmountDueSummary, { locale, currency }),
+        /* @__PURE__ */ jsx27(
           AmountPicker.Confirm,
           {
             className: cx2.button,
             onConfirm: (amountMinor) => {
-              const result = autoRechargeRef.current?.validate();
-              if (result == null) {
-                throw new Error("McpTopupView: auto-recharge form is not mounted");
+              const result = validateAutoRechargeForm(
+                autoRechargeForm,
+                currency,
+                { creditsPerMinorUnit, displayExchangeRate },
+                copy.autoRecharge
+              );
+              if (!result.ok) {
+                setAutoRechargeError(result.error);
+                return;
               }
-              if (!result.ok) return;
+              setAutoRechargeError(null);
               setScreen({
                 step: "payment",
                 amountMinor,
-                autoRecharge: result.payload
+                autoRecharge: result.payload.enabled ? result.payload : void 0
               });
               void notifyModelContext({
                 text: `User confirmed topup of ${formatPrice(amountMinor, currency, {
@@ -4352,8 +4359,8 @@ function EmbeddedTopup({
     }
   );
   if (isFullscreen) {
-    return /* @__PURE__ */ jsx28("section", { className: cx2.card, "aria-label": "Add credits", children: /* @__PURE__ */ jsxs20(McpHostedLayout, { children: [
-      /* @__PURE__ */ jsx28(McpSummaryRail, { children: /* @__PURE__ */ jsx28(
+    return /* @__PURE__ */ jsx27("section", { className: cx2.card, "aria-label": "Add credits", children: /* @__PURE__ */ jsxs20(McpHostedLayout, { children: [
+      /* @__PURE__ */ jsx27(McpSummaryRail, { children: /* @__PURE__ */ jsx27(
         AmountStepHeader,
         {
           cx: cx2,
@@ -4365,13 +4372,13 @@ function EmbeddedTopup({
         }
       ) }),
       /* @__PURE__ */ jsxs20(McpHostedBody, { children: [
-        onBack ? /* @__PURE__ */ jsx28(BackLink, { label: "Back to my account", onClick: onBack }) : null,
+        onBack ? /* @__PURE__ */ jsx27(BackLink, { label: "Back to my account", onClick: onBack }) : null,
         amountForm
       ] })
     ] }) });
   }
   return /* @__PURE__ */ jsxs20("section", { className: cx2.card, "aria-label": "Add credits", children: [
-    onBack ? /* @__PURE__ */ jsx28(BackLink, { label: "Back to my account", onClick: onBack }) : null,
+    onBack ? /* @__PURE__ */ jsx27(BackLink, { label: "Back to my account", onClick: onBack }) : null,
     amountForm
   ] });
 }
@@ -4382,7 +4389,7 @@ function TopupChargeAmount({
   const locale = useHostLocale();
   const { taxBreakdown } = useTopupForm();
   const minor = chargeAmountMinor(taxBreakdown, amountMinor);
-  return /* @__PURE__ */ jsx28(Fragment12, { children: formatPrice(minor, taxBreakdown?.currency ?? currency, { locale, free: "" }) });
+  return /* @__PURE__ */ jsx27(Fragment12, { children: formatPrice(minor, taxBreakdown?.currency ?? currency, { locale, free: "" }) });
 }
 function AmountStepHeader({
   cx: cx2,
@@ -4397,26 +4404,26 @@ function AmountStepHeader({
   const formattedBalance = credits != null ? new Intl.NumberFormat(locale).format(credits) : void 0;
   return /* @__PURE__ */ jsxs20("header", { className: rail ? cx2.stack : void 0, children: [
     rail ? /* @__PURE__ */ jsxs20(Fragment12, { children: [
-      /* @__PURE__ */ jsx28(Eyebrow, { variant: "rail", children: "Add credits" }),
+      /* @__PURE__ */ jsx27(Eyebrow, { variant: "rail", children: "Add credits" }),
       formattedBalance ? /* @__PURE__ */ jsxs20("p", { className: cx2.muted, children: [
         "Balance ",
         formattedBalance,
         " credits"
       ] }) : null
     ] }) : /* @__PURE__ */ jsxs20("div", { className: cx2.balanceRow, children: [
-      /* @__PURE__ */ jsx28("h2", { className: cx2.heading, children: "Add credits" }),
-      /* @__PURE__ */ jsx28(BalanceBadge, {})
+      /* @__PURE__ */ jsx27("h2", { className: cx2.heading, children: "Add credits" }),
+      /* @__PURE__ */ jsx27(BalanceBadge, {})
     ] }),
     showCurrencySwitch ? /* @__PURE__ */ jsxs20("label", { className: "solvapay-mcp-step-header", children: [
-      /* @__PURE__ */ jsx28("span", { className: cx2.muted, children: "Pay in" }),
-      /* @__PURE__ */ jsx28(
+      /* @__PURE__ */ jsx27("span", { className: cx2.muted, children: "Pay in" }),
+      /* @__PURE__ */ jsx27(
         "select",
         {
           className: "solvapay-mcp-currency-switch",
           value: currency,
           onChange: (event) => onCurrencyChange(event.target.value),
           "aria-label": "Topup currency",
-          children: topupCurrencies.map((code) => /* @__PURE__ */ jsx28("option", { value: code, children: code }, code))
+          children: topupCurrencies.map((code) => /* @__PURE__ */ jsx27("option", { value: code, children: code }, code))
         }
       )
     ] }) : null
@@ -4428,7 +4435,7 @@ function PresetAmountGrid({
 }) {
   const { quickAmounts, currency, creditsPerMinorUnit, displayExchangeRate } = useAmountPicker();
   const { displayCurrency } = useBalance();
-  return /* @__PURE__ */ jsx28("div", { className: "solvapay-mcp-preset-grid", "aria-label": "Quick amounts", children: quickAmounts.map((amount) => {
+  return /* @__PURE__ */ jsx27("div", { className: "solvapay-mcp-preset-grid", "aria-label": "Quick amounts", children: quickAmounts.map((amount) => {
     const minor = amount * getMinorUnitsPerMajor(currency);
     const label = formatPrice(minor, currency, {
       locale,
@@ -4443,21 +4450,21 @@ function PresetAmountGrid({
       displayExchangeRate
     );
     return /* @__PURE__ */ jsxs20(AmountPicker.Option, { amount, className: "solvapay-mcp-preset-tile", children: [
-      /* @__PURE__ */ jsx28("span", { className: "solvapay-mcp-preset-tile-amount", children: label }),
-      /* @__PURE__ */ jsx28("span", { className: "solvapay-mcp-preset-tile-credits", children: estimate.kind === "available" ? formatCompactCredits(estimate.credits, locale) : "" })
+      /* @__PURE__ */ jsx27("span", { className: "solvapay-mcp-preset-tile-amount", children: label }),
+      /* @__PURE__ */ jsx27("span", { className: "solvapay-mcp-preset-tile-credits", children: estimate.kind === "available" ? formatCompactCredits(estimate.credits, locale) : "" })
     ] }, amount);
   }) });
 }
 function AmountDueSummary({ locale, currency }) {
   const { resolvedAmountMinor } = useAmountPicker();
   const displayAmount = resolvedAmountMinor != null ? formatPrice(resolvedAmountMinor, currency, { locale, free: "" }) : formatPrice(0, currency, { locale, free: "" });
-  return /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx27(
     AmountLadder,
     {
       rows: [
         {
           label: "Total due today",
-          value: /* @__PURE__ */ jsx28("span", { className: "solvapay-mcp-topup-total", children: displayAmount })
+          value: /* @__PURE__ */ jsx27("span", { className: "solvapay-mcp-topup-total", children: displayAmount })
         }
       ]
     }
@@ -4470,19 +4477,16 @@ function CustomAmountRow2({
   const { currencySymbol: currencySymbol2, currency } = useAmountPicker();
   const prefix = currencyDisplay === "code" ? currency.toUpperCase() : currencySymbol2;
   return /* @__PURE__ */ jsxs20("label", { className: rowClassName, children: [
-    /* @__PURE__ */ jsx28("span", { className: "solvapay-mcp-amount-currency-symbol", children: prefix }),
-    /* @__PURE__ */ jsx28(AmountPicker.Custom, { className: "solvapay-mcp-amount-custom-input", placeholder: "0.00" })
+    /* @__PURE__ */ jsx27("span", { className: "solvapay-mcp-amount-currency-symbol", children: prefix }),
+    /* @__PURE__ */ jsx27(AmountPicker.Custom, { className: "solvapay-mcp-amount-custom-input", placeholder: "0.00" })
   ] });
 }
-function HostedTopupFallback({
-  cx: cx2,
-  onChangeAmount
-}) {
+function HostedTopupFallback({ cx: cx2, onBack }) {
   return /* @__PURE__ */ jsxs20("section", { className: cx2.card, "aria-label": "Add credits", children: [
-    /* @__PURE__ */ jsx28(BackLink, { label: "Change amount", onClick: onChangeAmount }),
-    /* @__PURE__ */ jsx28("h2", { className: cx2.heading, children: "Add credits" }),
-    /* @__PURE__ */ jsx28("p", { className: cx2.muted, children: "This host doesn't allow embedded payments. Open the SolvaPay portal in a new tab to complete your top-up there." }),
-    /* @__PURE__ */ jsx28(
+    onBack ? /* @__PURE__ */ jsx27(BackLink, { label: "Back to my account", onClick: onBack }) : null,
+    /* @__PURE__ */ jsx27("h2", { className: cx2.heading, children: "Add credits" }),
+    /* @__PURE__ */ jsx27("p", { className: cx2.muted, children: "This host doesn't allow embedded payments. Open the SolvaPay portal in a new tab to complete your top-up there." }),
+    /* @__PURE__ */ jsx27(
       LaunchCustomerPortalButton,
       {
         className: cx2.button,
@@ -4495,7 +4499,7 @@ function HostedTopupFallback({
 }
 
 // src/mcp/McpAppShell.tsx
-import { jsx as jsx29, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs21 } from "react/jsx-runtime";
 function resolveSurface(bootstrapView) {
   switch (bootstrapView) {
     case "checkout":
@@ -4522,8 +4526,8 @@ function McpAppShell({
   onRefreshBootstrap,
   onClose
 }) {
-  const [overrideView, setOverrideView] = useState10(null);
-  const [overridePlanRef, setOverridePlanRef] = useState10();
+  const [overrideView, setOverrideView] = useState9(null);
+  const [overridePlanRef, setOverridePlanRef] = useState9();
   const handleSurfaceChange = useCallback5((next, intent) => {
     setOverrideView(next);
     setOverridePlanRef(intent?.planRef);
@@ -4533,7 +4537,7 @@ function McpAppShell({
   const showFooter = footer ?? true;
   const surface = effectiveView === "account" || effectiveView === "auto-recharge" ? "management" : "payment";
   return /* @__PURE__ */ jsxs21("div", { className: "solvapay-mcp-shell", children: [
-    /* @__PURE__ */ jsx29(McpHostedColumn, { surface, children: /* @__PURE__ */ jsx29(McpHostedLayout, { children: /* @__PURE__ */ jsx29("div", { className: "solvapay-mcp-shell-body", children: /* @__PURE__ */ jsx29(
+    /* @__PURE__ */ jsx28(McpHostedColumn, { surface, children: /* @__PURE__ */ jsx28(McpHostedLayout, { children: /* @__PURE__ */ jsx28("div", { className: "solvapay-mcp-shell-body", children: /* @__PURE__ */ jsx28(
       McpViewRouter,
       {
         view: effectiveView,
@@ -4546,12 +4550,12 @@ function McpAppShell({
         onClose
       }
     ) }) }) }),
-    showFooter ? /* @__PURE__ */ jsx29(ShellFooter, { classNames }) : null
+    showFooter ? /* @__PURE__ */ jsx28(ShellFooter, { classNames }) : null
   ] });
 }
 function ShellFooter({ classNames }) {
   const cx2 = resolveMcpClassNames(classNames);
-  return /* @__PURE__ */ jsx29("footer", { className: `solvapay-mcp-shell-footer ${cx2.muted}`.trim(), children: /* @__PURE__ */ jsx29(LegalFooter, { attribution: "provided" }) });
+  return /* @__PURE__ */ jsx28("footer", { className: `solvapay-mcp-shell-footer ${cx2.muted}`.trim(), children: /* @__PURE__ */ jsx28(LegalFooter, { attribution: "provided" }) });
 }
 function McpViewRouter({
   view,
@@ -4567,12 +4571,14 @@ function McpViewRouter({
   const CheckoutView = views?.checkout ?? McpCheckoutView;
   const AccountView = views?.account ?? McpAccountView;
   const TopupView = views?.topup ?? McpTopupView;
+  const AutoRechargeView = views?.autoRecharge ?? McpAutoRechargeView;
   const goCheckout = onSurfaceChange ? (planRef) => onSurfaceChange("checkout", typeof planRef === "string" ? { planRef } : void 0) : void 0;
   const goTopup = onSurfaceChange ? () => onSurfaceChange("topup") : void 0;
   const goAccount = onSurfaceChange ? () => onSurfaceChange("account") : void 0;
+  const goAutoRecharge = onSurfaceChange ? () => onSurfaceChange("auto-recharge") : void 0;
   switch (view) {
     case "checkout":
-      return /* @__PURE__ */ jsx29(
+      return /* @__PURE__ */ jsx28(
         CheckoutView,
         {
           productRef,
@@ -4588,23 +4594,23 @@ function McpViewRouter({
           autoAdvance: Boolean(overridePlanRef)
         }
       );
-    case "auto-recharge":
     case "account":
-      return /* @__PURE__ */ jsx29(
+      return /* @__PURE__ */ jsx28(
         AccountView,
         {
           classNames,
           product: bootstrap.product,
           productRef,
           onTopup: goTopup,
-          autoRecharge: bootstrap.customer?.autoRecharge ?? null,
-          autoRechargeUrl: bootstrap.autoRechargeUrl ?? null,
+          onAutoRecharge: goAutoRecharge,
           onChangePlan: goCheckout,
           plans: bootstrap.plans
         }
       );
+    case "auto-recharge":
+      return /* @__PURE__ */ jsx28(AutoRechargeView, { classNames, onBack: goAccount });
     case "topup":
-      return /* @__PURE__ */ jsx29(
+      return /* @__PURE__ */ jsx28(
         TopupView,
         {
           publishableKey: stripePublishableKey,
@@ -4619,21 +4625,21 @@ function McpViewRouter({
 }
 
 // src/mcp/views/AppHeader.tsx
-import { useContext as useContext4, useLayoutEffect, useRef as useRef7, useState as useState11 } from "react";
+import { useContext as useContext4, useLayoutEffect, useRef as useRef5, useState as useState10 } from "react";
 
 // src/mcp/hooks/useHostInfo.tsx
 import { createContext as createContext3, useContext as useContext3 } from "react";
-import { jsx as jsx30 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 var McpHostInfoContext = createContext3(null);
 function McpHostInfoProvider({ hostName, children }) {
-  return /* @__PURE__ */ jsx30(McpHostInfoContext.Provider, { value: hostName, children });
+  return /* @__PURE__ */ jsx29(McpHostInfoContext.Provider, { value: hostName, children });
 }
 function useHostName() {
   return useContext3(McpHostInfoContext);
 }
 
 // src/mcp/views/AppHeader.tsx
-import { jsx as jsx31, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs22 } from "react/jsx-runtime";
 var HOSTS_WITH_MERCHANT_CHROME = /chatgpt|openai|claude/i;
 function useMerchantSafe() {
   const ctx = useContext4(SolvaPayContext);
@@ -4670,9 +4676,9 @@ function AppHeader({
   const hostName = useHostName();
   const name = merchant?.displayName ?? "SolvaPay";
   const iconUrl = merchant?.iconUrl ?? merchant?.logoUrl ?? null;
-  const [imgFailed, setImgFailed] = useState11(false);
-  const [imgLoaded, setImgLoaded] = useState11(false);
-  const imgRef = useRef7(null);
+  const [imgFailed, setImgFailed] = useState10(false);
+  const [imgLoaded, setImgLoaded] = useState10(false);
+  const imgRef = useRef5(null);
   useLayoutEffect(() => {
     const el = imgRef.current;
     const cached = el ? el.complete && el.naturalHeight > 0 : false;
@@ -4687,7 +4693,7 @@ function AppHeader({
   const hasIconUrl = iconUrl !== null && !imgFailed;
   const showInitials = !hasIconUrl || !imgLoaded;
   return /* @__PURE__ */ jsxs22("header", { className: rootClass, children: [
-    hasIconUrl ? /* @__PURE__ */ jsx31(
+    hasIconUrl ? /* @__PURE__ */ jsx30(
       "img",
       {
         ref: imgRef,
@@ -4699,14 +4705,14 @@ function AppHeader({
         onError: () => setImgFailed(true)
       }
     ) : null,
-    showInitials ? /* @__PURE__ */ jsx31("span", { className: cx2.appHeaderInitials, "aria-hidden": "true", children: getInitials(name) }) : null,
-    /* @__PURE__ */ jsx31("span", { className: cx2.appHeaderName, children: name }),
-    children ? /* @__PURE__ */ jsx31("span", { className: "solvapay-mcp-app-header-slot", children }) : null
+    showInitials ? /* @__PURE__ */ jsx30("span", { className: cx2.appHeaderInitials, "aria-hidden": "true", children: getInitials(name) }) : null,
+    /* @__PURE__ */ jsx30("span", { className: cx2.appHeaderName, children: name }),
+    children ? /* @__PURE__ */ jsx30("span", { className: "solvapay-mcp-app-header-slot", children }) : null
   ] });
 }
 
 // src/mcp/McpApp.tsx
-import { jsx as jsx32, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs23 } from "react/jsx-runtime";
 function bootstrapToInitial(bs) {
   return {
     customerRef: bs.customer?.ref ?? null,
@@ -4732,15 +4738,15 @@ function McpApp({
   messageOnSuccess
 }) {
   const cx2 = resolveMcpClassNames(classNames);
-  const [bootstrap, setBootstrap] = useState12(null);
-  const [initError, setInitError] = useState12(null);
-  const [hostName, setHostName] = useState12(null);
-  const [displayModeState, setDisplayModeState] = useState12(
+  const [bootstrap, setBootstrap] = useState11(null);
+  const [initError, setInitError] = useState11(null);
+  const [hostName, setHostName] = useState11(null);
+  const [displayModeState, setDisplayModeState] = useState11(
     DEFAULT_DISPLAY_MODE_STATE
   );
-  const pendingBootstrapFetchRef = useRef8(0);
-  const applyContextRef = useRef8(applyContext);
-  const onInitErrorRef = useRef8(onInitError);
+  const pendingBootstrapFetchRef = useRef6(0);
+  const applyContextRef = useRef6(applyContext);
+  const onInitErrorRef = useRef6(onInitError);
   useEffect7(() => {
     applyContextRef.current = applyContext;
   }, [applyContext]);
@@ -4900,7 +4906,7 @@ function McpApp({
     };
     return resolved;
   }, [transport, initial, app]);
-  const seededInitialRef = useRef8(null);
+  const seededInitialRef = useRef6(null);
   if (initial && seededInitialRef.current !== initial) {
     seedMcpCaches(initial, providerConfig);
     seededInitialRef.current = initial;
@@ -4928,14 +4934,14 @@ function McpApp({
   );
   const effectiveOnClose = onClose ?? defaultOnClose;
   const effectiveBootstrap = bootstrap && productRefOverride ? { ...bootstrap, productRef: productRefOverride } : bootstrap;
-  return /* @__PURE__ */ jsx32(McpHostInfoProvider, { hostName, children: /* @__PURE__ */ jsx32(McpDisplayModeProvider, { value: displayModeState, children: /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsx31(McpHostInfoProvider, { hostName, children: /* @__PURE__ */ jsx31(McpDisplayModeProvider, { value: displayModeState, children: /* @__PURE__ */ jsxs23(
     "main",
     {
       className: "solvapay-mcp-main",
       "data-display-mode": displayModeState.displayMode,
       style: hostSafeAreaPadding(displayModeState.safeAreaInsets),
       children: [
-        /* @__PURE__ */ jsx32("div", { className: "solvapay-mcp-chrome-row", children: displayModeState.displayMode !== "fullscreen" ? /* @__PURE__ */ jsx32(
+        /* @__PURE__ */ jsx31("div", { className: "solvapay-mcp-chrome-row", children: displayModeState.displayMode !== "fullscreen" ? /* @__PURE__ */ jsx31(
           AppHeader,
           {
             classNames,
@@ -4943,16 +4949,16 @@ function McpApp({
           }
         ) : null }),
         initError ? /* @__PURE__ */ jsxs23("div", { className: `${cx2.card} ${cx2.error}`.trim(), children: [
-          /* @__PURE__ */ jsx32("h2", { className: cx2.heading, children: "Unable to load SolvaPay" }),
-          /* @__PURE__ */ jsx32("p", { children: initError })
+          /* @__PURE__ */ jsx31("h2", { className: cx2.heading, children: "Unable to load SolvaPay" }),
+          /* @__PURE__ */ jsx31("p", { children: initError })
         ] }) : !effectiveBootstrap ? (
           // Intent-tool / fallback entries show a loading card while the
           // in-flight `fetchMcpBootstrap` call resolves. Data-tool iframe
           // entries no longer exist (payable merchant tools don't advertise
           // `_meta.ui.resourceUri`) so this is always legitimate user
           // feedback for an in-flight tool call.
-          /* @__PURE__ */ jsx32("div", { className: cx2.card, children: /* @__PURE__ */ jsx32("p", { children: "Loading\u2026" }) })
-        ) : /* @__PURE__ */ jsx32(SolvaPayProvider, { config: providerConfig, children: /* @__PURE__ */ jsx32(McpBridgeProvider, { app, messageOnSuccess, children: /* @__PURE__ */ jsx32(
+          /* @__PURE__ */ jsx31("div", { className: cx2.card, children: /* @__PURE__ */ jsx31("p", { children: "Loading\u2026" }) })
+        ) : /* @__PURE__ */ jsx31(SolvaPayProvider, { config: providerConfig, children: /* @__PURE__ */ jsx31(McpBridgeProvider, { app, messageOnSuccess, children: /* @__PURE__ */ jsx31(
           McpAppShell,
           {
             bootstrap: effectiveBootstrap,
@@ -4989,6 +4995,7 @@ export {
   McpAccountView,
   McpApp,
   McpAppShell,
+  McpAutoRechargeView,
   McpBridgeProvider,
   McpCheckoutView,
   McpDisplayModeProvider,
@@ -5031,7 +5038,6 @@ export {
   planConsequence,
   readDisplayModeState,
   remainingCap,
-  resetStripeProbeCacheForTests,
   resolveAccountState,
   resolveActivationStrategy,
   resolveActivityStrip,