@openreceive/react 0.2.4 → 0.3.1

package/dist/index.js

@@ -30,16 +30,23 @@ function useCheckoutSession(options) {
       reference: () => optionsRef.current.reference(),
       requestCheckout: (reference) => optionsRef.current.requestCheckout?.(reference),
       onSnapshot: (snapshot) => optionsRef.current.onSnapshot?.(snapshot),
-      swapPrefix: () => optionsRef.current.swapPrefix?.(),
-      fetch: () => optionsRef.current.fetch?.(),
-      swapSelection: {
-        started: () => optionsRef.current.swapSelection?.started(),
-        setStarted: (invoice) => optionsRef.current.swapSelection?.setStarted(invoice),
-        dismissedInvoiceId: () => optionsRef.current.swapSelection?.dismissedInvoiceId() ?? null,
-        setDismissedInvoiceId: (invoiceId) => optionsRef.current.swapSelection?.setDismissedInvoiceId(invoiceId),
-        setSelectedAsset: (payInAsset) => optionsRef.current.swapSelection?.setSelectedAsset(payInAsset)
+      // The inner `swap` is always present because the session is built once,
+      // on the first render, and the host may only gain swap options later.
+      // Every accessor reads through `optionsRef`, so a host with no `swap`
+      // makes `prefix()` answer undefined and the session reports the missing
+      // wiring instead of silently doing nothing.
+      swap: {
+        selection: {
+          started: () => optionsRef.current.swap?.selection.started(),
+          setStarted: (invoice) => optionsRef.current.swap?.selection.setStarted(invoice),
+          dismissedInvoiceId: () => optionsRef.current.swap?.selection.dismissedInvoiceId() ?? null,
+          setDismissedInvoiceId: (invoiceId) => optionsRef.current.swap?.selection.setDismissedInvoiceId(invoiceId),
+          setSelectedAsset: (payInAsset) => optionsRef.current.swap?.selection.setSelectedAsset(payInAsset)
+        },
+        prefix: () => optionsRef.current.swap?.prefix(),
+        fetch: () => optionsRef.current.swap?.fetch(),
+        onStarted: (invoice) => optionsRef.current.swap?.onStarted?.(invoice)
       },
-      onSwapStarted: (invoice) => optionsRef.current.onSwapStarted?.(invoice),
       get logger() {
         return optionsRef.current.logger;
       },
@@ -56,8 +63,7 @@ import {
   OPENRECEIVE_CHECKOUT_DATA_ATTRIBUTES,
   copyInvoice as copyInvoiceHelper,
   createCheckoutStatusModel,
-  createPaymentDataEntries,
-  createQrSvg,
+  createQrSvgController,
   formatAmountCaption,
   checkoutLabels,
   openWallet as openWalletHelper,
@@ -186,14 +192,15 @@ function QRCode(props) {
   const onErrorRef = React3.useRef(onError);
   onErrorRef.current = onError;
   React3.useEffect(() => {
-    let cancelled = false;
-    createQrSvg(invoice, { encoder, width }).then((nextSvg) => {
-      if (!cancelled) setSvg(nextSvg);
-    }).catch((error) => {
-      if (!cancelled) onErrorRef.current?.(error);
+    const controller = createQrSvgController({
+      onValue: setSvg,
+      onError: (error) => onErrorRef.current?.(error),
+      ...encoder === void 0 ? {} : { encoder },
+      width
     });
+    controller.show(invoice);
     return () => {
-      cancelled = true;
+      controller.stop();
     };
   }, [invoice, encoder, width]);
   return React3.createElement("div", {
@@ -320,31 +327,6 @@ function SettledCheckIcon() {
     })
   );
 }
-function PaymentData(props) {
-  const entries = createPaymentDataEntries(props.source);
-  if (entries.length === 0) return null;
-  return React3.createElement(
-    "details",
-    { className: joinClassNames(orClasses.paymentData, props.className) },
-    React3.createElement(
-      "summary",
-      { className: orClasses.paymentDataTitle },
-      checkoutLabels.viewPaymentData
-    ),
-    React3.createElement(
-      "div",
-      { className: orClasses.paymentDataBody },
-      entries.map(
-        (entry) => React3.createElement(
-          "div",
-          { key: entry.label, className: orClasses.paymentDataRow },
-          React3.createElement("span", { className: orClasses.paymentDataKey }, entry.label),
-          React3.createElement("p", { className: orClasses.paymentDataValue }, entry.value)
-        )
-      )
-    )
-  );
-}
 function WaitingState(props) {
   const status = props.status ?? createCheckoutStatusModel({
     phase: props.phase,
@@ -872,6 +854,38 @@ function useCheckout(options) {
     const next = controllerRef.current?.cancel();
     if (next !== void 0) setState(next);
   }, []);
+  const swapRefundController = React6.useCallback(() => {
+    const controller = controllerRef.current;
+    if (controller === null) {
+      throw new Error("Swap refunds need a started checkout controller.");
+    }
+    return controller;
+  }, []);
+  const stageSwapRefund = React6.useCallback(
+    async (refund) => {
+      try {
+        return await swapRefundController().stageSwapRefund(refund);
+      } catch (error) {
+        onErrorRef.current?.(error);
+        throw error;
+      }
+    },
+    [swapRefundController]
+  );
+  const confirmSwapRefund = React6.useCallback(
+    async (refund) => {
+      try {
+        return await swapRefundController().confirmSwapRefund(refund);
+      } catch (error) {
+        onErrorRef.current?.(error);
+        throw error;
+      }
+    },
+    [swapRefundController]
+  );
+  const clearSwapRefundStaging = React6.useCallback(() => {
+    controllerRef.current?.clearSwapRefundStaging();
+  }, []);
   return {
     // The state IS the view model now: one derivation, one set of display
     // fields. `status` stays on top of it because the component's terminal
@@ -890,7 +904,10 @@ function useCheckout(options) {
     retry,
     cancel,
     copyInvoice,
-    openWallet
+    openWallet,
+    stageSwapRefund,
+    confirmSwapRefund,
+    clearSwapRefundStaging
   };
 }
 var CheckoutContext = React6.createContext(null);
@@ -914,12 +931,12 @@ import {
   buildMethodGridEntries,
   checkoutLabels as checkoutLabels5,
   copyInvoice as copyInvoiceHelper3,
+  createAssetBaseUrlResolver,
+  createMethodGridDisplay,
   createPaymentWizardController,
   createPaymentWizardModel,
   createWizardRouteAssetDisplays,
   createWizardRouteDisplays,
-  findSwapGridGroup,
-  formatChooseNetworkHeading,
   formatNetworkSummary,
   getNetworkIcon,
   getPaymentMethodIcon,
@@ -930,16 +947,12 @@ import {
   networkMobileRevealClasses,
   networkSummaryIconClasses,
   orClasses as orClasses6,
-  overlaySwapRefundStaging,
-  paymentAccentId,
   paymentMethods,
+  resolveWizardSelection,
   requestSwapRefund,
+  selectCurrentSwapInvoice,
   swapAssetMatchesRoute,
-  swapGroupLimitOption,
-  swapOptionLimitMessage as swapOptionLimitMessage2,
-  swapPickerKey,
-  updateSelectedSwapNetworks,
-  wizardNetworkGroupIds
+  swapOptionLimitMessage as swapOptionLimitMessage2
 } from "@openreceive/browser/headless";
 import * as React9 from "react";
 
@@ -1189,7 +1202,7 @@ import {
   createDetailExternalLink,
   createSwapDisplayModel,
   createTransactionDetails,
-  createQrPayloadSvg,
+  createQrSvgController as createQrSvgController2,
   getSwapRefundFormError,
   checkoutLabels as checkoutLabels4,
   createSwapUnavailableModel,
@@ -1296,12 +1309,11 @@ function renderSwapUnavailable(quote, checkout) {
   );
 }
 function renderSwapDepositPanel(options) {
-  const display = createSwapDisplayModel(
-    options.invoice,
-    options.now === void 0 ? {} : { now: options.now }
-  );
+  const display = createSwapDisplayModel(options.invoice, {
+    ...options.now === void 0 ? {} : { now: options.now },
+    ...options.resumable === void 0 ? {} : { resumable: options.resumable }
+  });
   if (display === void 0) return null;
-  const memo = display.depositMemo;
   const backButton = React8.createElement(
     "button",
     {
@@ -1450,7 +1462,7 @@ function renderSwapDepositPanel(options) {
         onError: options.onError
       }),
       renderSwapSupportDetails(display, options),
-      renderSwapRefundReturnWarning()
+      renderSwapRefundReturnWarning(display)
     );
   }
   if (display.state === "refund_pending" || display.state === "refunded") {
@@ -1478,7 +1490,7 @@ function renderSwapDepositPanel(options) {
         })
       ),
       renderSwapSupportDetails(display, options),
-      renderSwapRefundReturnWarning()
+      renderSwapRefundReturnWarning(display)
     );
   }
   if (display.state === "deposit") {
@@ -1517,16 +1529,14 @@ function renderSwapDepositPanel(options) {
             {
               className: orClasses5.swapDetails
             },
-            // Explorer stays hidden until payment completes (tx ids / settled details).
-            // No explorer link on the LIVE deposit row: the address has nothing on
-            // chain yet, and sending the payer to a third-party explorer mid-payment
-            // is not something this pane does. The settled/refund panes link theirs.
-            renderSwapCopyRow("Address", display.depositAddress, {
-              ...options,
-              selectable: true
-            }),
-            memo === void 0 ? null : renderSwapCopyRow("Memo", memo, options),
-            renderSwapCopyRow("Amount", display.depositAmount, { ...options, selectable: true })
+            ...display.copyRows.flatMap(
+              (row) => renderSwapCopyRow(
+                row.label,
+                row.copyValue ?? row.value,
+                { ...options, selectable: row.selectable },
+                row.value
+              )
+            )
           ),
           waitingCard(display.countdownLabel),
           renderSwapFeeBreakdown(display.feeBreakdown)
@@ -1740,13 +1750,13 @@ function renderSwapSupportDetails(display, options) {
     )
   );
 }
-function renderSwapRefundReturnWarning() {
+function renderSwapRefundReturnWarning(display) {
   return React8.createElement(
     "p",
     {
       className: orClasses5.swapWarning
     },
-    checkoutLabels4.refundReturnWarning
+    display.refundReturnLabel
   );
 }
 var REFUND_ADDRESS_DRAFT_LIMIT = 8;
@@ -1843,17 +1853,19 @@ function SwapPayloadQRCode(props) {
   const [svg, setSvg] = React8.useState("");
   const onErrorRef = React8.useRef(props.onError);
   onErrorRef.current = props.onError;
+  const { payload, encoder } = props;
   React8.useEffect(() => {
-    let cancelled = false;
-    createQrPayloadSvg(props.payload, { encoder: props.encoder, width: 220 }).then((nextSvg) => {
-      if (!cancelled) setSvg(nextSvg);
-    }).catch((error) => {
-      if (!cancelled) onErrorRef.current?.(error);
+    const controller = createQrSvgController2({
+      onValue: setSvg,
+      onError: (error) => onErrorRef.current?.(error),
+      ...encoder === void 0 ? {} : { encoder },
+      width: 220
     });
+    controller.showPayload(payload);
     return () => {
-      cancelled = true;
+      controller.stop();
     };
-  }, [props.payload, props.encoder]);
+  }, [payload, encoder]);
   const imageSource = svg.length === 0 ? void 0 : `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;
   return React8.createElement("img", {
     alt: "",
@@ -1871,9 +1883,7 @@ function PaymentWizard(props) {
   const [startedSwapInvoice, setStartedSwapInvoice] = React9.useState(null);
   const [dismissedSwapInvoiceId, setDismissedSwapInvoiceId] = React9.useState(null);
   const [selectedSwapAsset, setSelectedSwapAsset] = React9.useState(null);
-  const [selectedSwapNetworks, setSelectedSwapNetworks] = React9.useState(
-    {}
-  );
+  const [selectedSwapAssetByGroup, setSelectedSwapAssetByGroup] = React9.useState({});
   const [selectedPickerKey, setSelectedPickerKey] = React9.useState(null);
   const autoSwapAttemptedRef = React9.useRef(/* @__PURE__ */ new Set());
   const fetcher = props.fetch ?? globalThis.fetch;
@@ -1882,16 +1892,18 @@ function PaymentWizard(props) {
   const session = useCheckoutSession({
     snapshot: () => checkout,
     reference: () => reference,
-    swapPrefix: () => props.prefix,
-    fetch: () => fetcher,
-    swapSelection: {
-      started: () => startedSwapInvoice ?? void 0,
-      setStarted: setStartedSwapInvoice,
-      dismissedInvoiceId: () => dismissedSwapInvoiceId,
-      setDismissedInvoiceId: setDismissedSwapInvoiceId,
-      setSelectedAsset: setSelectedSwapAsset
+    swap: {
+      selection: {
+        started: () => startedSwapInvoice ?? void 0,
+        setStarted: setStartedSwapInvoice,
+        dismissedInvoiceId: () => dismissedSwapInvoiceId,
+        setDismissedInvoiceId: setDismissedSwapInvoiceId,
+        setSelectedAsset: setSelectedSwapAsset
+      },
+      prefix: () => props.prefix,
+      fetch: () => fetcher,
+      onStarted: (invoice) => props.onSwapStarted?.(invoice)
     },
-    onSwapStarted: (invoice) => props.onSwapStarted?.(invoice),
     ...props.logger === void 0 ? {} : { logger: props.logger },
     onError: (error) => props.onError?.(error)
   });
@@ -1899,9 +1911,10 @@ function PaymentWizard(props) {
   const clearSwapFocus = React9.useCallback(() => {
     setSelectedSwapAsset(null);
     setSelectedPickerKey(null);
-    setSelectedSwapNetworks({});
+    setSelectedSwapAssetByGroup({});
     session.clearSwapStartError();
-  }, [session]);
+    props.swapRefund?.clearSwapRefundStaging();
+  }, [session, props.swapRefund]);
   const onSwapFocusChange = props.onSwapFocusChange;
   React9.useEffect(() => {
     onSwapFocusChange?.(selectedSwapAsset !== null);
@@ -1912,7 +1925,10 @@ function PaymentWizard(props) {
     return { enabled: methods.length > 0, options: methods };
   }, [checkout]);
   const currentSwapInvoice = React9.useMemo(
-    () => selectCurrentSwapInvoice(checkout, startedSwapInvoice, dismissedSwapInvoiceId),
+    () => selectCurrentSwapInvoice(checkout, {
+      started: startedSwapInvoice,
+      dismissedInvoiceId: dismissedSwapInvoiceId
+    }),
     [checkout, startedSwapInvoice, dismissedSwapInvoiceId]
   );
   const now = useTickingUnixSeconds(currentSwapInvoice !== void 0);
@@ -1925,6 +1941,7 @@ function PaymentWizard(props) {
     },
     [props.prefix, session]
   );
+  const swapRefund = props.swapRefund;
   const refundSwap = React9.useCallback(
     async (attemptId, refundAddress, confirm) => {
       const prefix = props.prefix;
@@ -1932,12 +1949,17 @@ function PaymentWizard(props) {
         return;
       }
       try {
-        const invoice = await requestSwapRefund({
+        const invoice = swapRefund !== void 0 ? await (confirm ? swapRefund.confirmSwapRefund : swapRefund.stageSwapRefund).call(
+          swapRefund,
+          { attemptId, refundAddress }
+        ) : await requestSwapRefund({
           fetch: fetcher,
           prefix,
           reference,
-          invoices: [startedSwapInvoice, ...checkout?.invoices ?? []],
-          attemptId,
+          paymentHash: resolveAttemptPaymentHash(
+            [startedSwapInvoice, ...checkout?.invoices ?? []],
+            attemptId
+          ),
           refundAddress,
           confirm,
           ...props.logger === void 0 ? {} : { logger: props.logger }
@@ -1954,6 +1976,7 @@ function PaymentWizard(props) {
       fetcher,
       props.onError,
       props.logger,
+      swapRefund,
       startedSwapInvoice,
       checkout?.invoices
     ]
@@ -1966,12 +1989,13 @@ function PaymentWizard(props) {
   );
   const model = createPaymentWizardModel(selection);
   const { wizard } = model;
+  const resolveAssetUrl = props.resolveAssetUrl ?? (props.assetBaseUrl === void 0 || props.assetBaseUrl.trim() === "" ? void 0 : createAssetBaseUrlResolver(props.assetBaseUrl));
   const routeAssetDisplays = createWizardRouteAssetDisplays(model.routeAssets, {
     selectedRoute: model.selectedRoute,
-    ...props.resolveAssetUrl === void 0 ? {} : { resolveAssetUrl: props.resolveAssetUrl }
+    ...resolveAssetUrl === void 0 ? {} : { resolveAssetUrl }
   });
   const routeDisplays = createWizardRouteDisplays(wizard.routes, {
-    ...props.resolveAssetUrl === void 0 ? {} : { resolveAssetUrl: props.resolveAssetUrl }
+    ...resolveAssetUrl === void 0 ? {} : { resolveAssetUrl }
   });
   const showRoutePicker = routeAssetDisplays.length > 0 && (model.selectedRoute === null || routeDisplays.length === 0);
   const activeTutorialProvider = activeTutorial === null ? void 0 : routeDisplays.flatMap((route) => route.providers).find((provider) => provider.id === activeTutorial.providerId);
@@ -2024,6 +2048,7 @@ function PaymentWizard(props) {
             logger: props.logger,
             onError: props.onError,
             onRefund: refundSwap,
+            ...props.resumable === void 0 ? {} : { resumable: props.resumable },
             onBackToLightning: () => {
               setDismissedSwapInvoiceId(activeSwapForAsset.invoice_id);
               clearSwapFocus();
@@ -2047,21 +2072,37 @@ function PaymentWizard(props) {
       checkout: checkout ?? void 0,
       selectedPickerKey,
       startingAsset: swapStartingAsset,
-      selectedSwapNetworks,
+      selectedSwapAssetByGroup,
+      // One resolver decides what a tile click MEANS, so the "ask the
+      // network question only when it is a real question" rule is not
+      // re-derived here: a single-network group comes back as start_swap
+      // and the wizard starts it instead of opening a one-answer step.
       onSelectPicker: (key, previousKey) => {
+        const resolved = resolveWizardSelection({
+          pickerKey: key,
+          previousKey,
+          entries: buildMethodGridEntries(paymentMethods, swapAssetOptions),
+          selectedAssetByGroup: selectedSwapAssetByGroup
+        });
+        if (resolved.kind === "none") return;
+        if (resolved.kind === "select_method") {
+          setSelectedPickerKey(null);
+          updateWizardSelection(
+            (controller) => controller.selectMethod(resolved.methodId)
+          );
+          if (resolved.methodId === "bitcoin") void props.onRequestLightning?.();
+          return;
+        }
+        if (resolved.kind === "start_swap") {
+          setSelectedPickerKey(null);
+          selectSwapAsset(resolved.payInAsset);
+          return;
+        }
         setSelectedPickerKey(key);
-        const entries = buildMethodGridEntries(paymentMethods, swapAssetOptions);
-        setSelectedSwapNetworks(
-          (current) => updateSelectedSwapNetworks({
-            entries,
-            nextKey: key,
-            previousKey,
-            selectedNetworks: current
-          })
-        );
+        setSelectedSwapAssetByGroup(resolved.selectedAssetByGroup);
       },
       onSelectNetwork: (groupKey, payInAsset) => {
-        setSelectedSwapNetworks((current) => ({
+        setSelectedSwapAssetByGroup((current) => ({
           ...current,
           [groupKey]: payInAsset
         }));
@@ -2075,7 +2116,7 @@ function PaymentWizard(props) {
         }
       },
       onContinueSwap: selectSwapAsset,
-      ...props.resolveAssetUrl === void 0 ? {} : { resolveAssetUrl: props.resolveAssetUrl }
+      ...resolveAssetUrl === void 0 ? {} : { resolveAssetUrl }
     }) : null,
     selection.selectedMethod === null ? null : React9.createElement(
       "div",
@@ -2144,6 +2185,7 @@ function PaymentWizard(props) {
               logger: props.logger,
               onError: props.onError,
               onRefund: refundSwap,
+              ...props.resumable === void 0 ? {} : { resumable: props.resumable },
               onBackToLightning: () => {
                 setDismissedSwapInvoiceId(activeSwapForRoute.invoice_id);
                 clearSwapFocus();
@@ -2242,23 +2284,16 @@ function PaymentWizard(props) {
   );
 }
 function renderCompactPaymentMethodSelector(options) {
-  const entries = buildMethodGridEntries(paymentMethods, options.swapAssetOptions);
+  const display = createMethodGridDisplay({
+    entries: buildMethodGridEntries(paymentMethods, options.swapAssetOptions),
+    selectedPickerKey: options.selectedPickerKey,
+    selectedAssetByGroup: options.selectedSwapAssetByGroup,
+    startingAsset: options.startingAsset,
+    ...options.checkout === void 0 ? {} : { checkout: options.checkout }
+  });
   const currenciesLoading = options.currenciesLoading === true && options.swapAssetOptions.length === 0;
-  const selectedKey = options.selectedPickerKey;
-  const selectedGroup = findSwapGridGroup(entries, selectedKey);
-  const networkRequired = selectedGroup !== void 0 && selectedGroup.options.length > 1;
-  const selectedGroupKey = selectedGroup?.label.trim().toUpperCase();
-  const selectedNetworkAsset = selectedGroupKey === void 0 ? void 0 : options.selectedSwapNetworks[selectedGroupKey];
-  const selectedNetworkOption = selectedGroup === void 0 || selectedNetworkAsset === void 0 ? void 0 : selectedGroup.options.find((option) => option.pay_in_asset === selectedNetworkAsset);
-  const continueTarget = selectedNetworkOption !== void 0 ? {
-    payInAsset: selectedNetworkOption.pay_in_asset,
-    disabled: selectedNetworkOption.available === false,
-    limitMessage: swapOptionLimitMessage2(selectedNetworkOption, options.checkout)
-  } : null;
-  const startingAsset = options.startingAsset;
-  const gridBusy = startingAsset !== null;
-  const continueStarting = continueTarget !== null && continueTarget.payInAsset === startingAsset;
-  const canContinue = continueTarget !== null && !continueTarget.disabled && selectedNetworkOption !== void 0 && !gridBusy;
+  const { gridBusy, networkRequired, selectedGroup, continueTarget, canContinue } = display;
+  const continueStarting = continueTarget?.starting === true;
   const continueButton = (className) => React9.createElement(
     "button",
     {
@@ -2268,7 +2303,7 @@ function renderCompactPaymentMethodSelector(options) {
       "aria-disabled": canContinue ? void 0 : "true",
       "aria-busy": continueStarting ? "true" : void 0,
       onClick: !canContinue ? void 0 : () => {
-        if (continueTarget === null) return;
+        if (continueTarget === void 0) return;
         options.onContinueSwap(continueTarget.payInAsset);
       }
     },
@@ -2280,14 +2315,10 @@ function renderCompactPaymentMethodSelector(options) {
         "aria-hidden": "true"
       }),
       checkoutLabels5.preparingPayment
-    ) : continueTarget?.disabled && continueTarget.limitMessage !== void 0 ? continueTarget.limitMessage : checkoutLabels5.continue
+    ) : continueTarget?.label ?? checkoutLabels5.continue
   );
   const renderNetworkSelector = (group, mobile) => {
-    const accent = paymentAccentId(group.label);
-    const groupKey = group.label.trim().toUpperCase();
-    const selectedAsset = options.selectedSwapNetworks[groupKey];
-    const selectedOption = selectedAsset === void 0 ? void 0 : group.options.find((option) => option.pay_in_asset === selectedAsset);
-    const { panelId, headingId } = wizardNetworkGroupIds(groupKey);
+    const { accent, groupKey, panelId, headingId, selectedOption } = group;
     return React9.createElement(
       "div",
       {
@@ -2308,7 +2339,7 @@ function renderCompactPaymentMethodSelector(options) {
               id: headingId,
               className: orClasses6.methodNetworkHeading
             },
-            formatChooseNetworkHeading(group.label)
+            group.heading
           ),
           React9.createElement(
             "p",
@@ -2422,23 +2453,22 @@ function renderCompactPaymentMethodSelector(options) {
           "aria-label": checkoutLabels5.paymentMethod,
           className: orClasses6.methodGrid
         },
-        ...entries.map((entry) => {
+        ...display.entries.map((entry) => {
           if (entry.kind === "method") {
             const method = entry.method;
-            const accent2 = paymentAccentId(method.id);
             return React9.createElement(
               "button",
               {
                 key: method.id,
                 type: "button",
                 className: assetButtonClasses({
-                  accent: accent2,
+                  accent: entry.accent,
                   selected: false,
-                  disabled: gridBusy
+                  disabled: entry.disabled
                 }),
-                disabled: gridBusy,
-                "aria-disabled": gridBusy ? "true" : void 0,
-                onClick: gridBusy ? void 0 : () => options.onContinueMethod(method.id)
+                disabled: entry.disabled,
+                "aria-disabled": entry.disabled ? "true" : void 0,
+                onClick: entry.disabled ? void 0 : () => options.onContinueMethod(method.id)
               },
               React9.createElement(
                 "span",
@@ -2457,21 +2487,18 @@ function renderCompactPaymentMethodSelector(options) {
             );
           }
           const group = entry.group;
-          const groupKey = group.label.trim().toUpperCase();
-          const pickerKey = swapPickerKey(group.label);
-          const selected = selectedKey === pickerKey;
-          const multiNetwork = group.options.length > 1;
-          const displayOption = group.options.find((option) => option.available !== false) ?? group.options[0];
-          if (displayOption === void 0) return null;
-          const selectedAsset = options.selectedSwapNetworks[groupKey];
-          const selectedOption = selectedAsset === void 0 ? void 0 : group.options.find((option) => option.pay_in_asset === selectedAsset);
-          const activeOption = selectedOption ?? displayOption;
-          const starting = group.options.some((option) => option.pay_in_asset === startingAsset);
-          const disabled = group.options.every((option) => option.available === false);
-          const accent = paymentAccentId(group.label);
-          const limitOption = disabled ? swapGroupLimitOption(group.options) ?? activeOption : activeOption;
-          const limitMessage = swapOptionLimitMessage2(limitOption, options.checkout);
-          const { panelId } = wizardNetworkGroupIds(groupKey);
+          const {
+            pickerKey,
+            selected,
+            multiNetwork,
+            displayOption,
+            selectedOption,
+            starting,
+            disabled,
+            accent,
+            limitMessage,
+            panelId
+          } = group;
           return React9.createElement(
             "div",
             { key: pickerKey, className: orClasses6.methodTile },
@@ -2490,7 +2517,14 @@ function renderCompactPaymentMethodSelector(options) {
                   selected: starting || multiNetwork && selected,
                   disabled: disabled || gridBusy && !starting
                 }),
-                onClick: disabled || gridBusy ? void 0 : multiNetwork ? () => options.onSelectPicker(pickerKey, selectedKey) : () => options.onContinueSwap(displayOption.pay_in_asset)
+                onClick: disabled || gridBusy ? void 0 : (
+                  // `needsNetworkStep` / `startPayInAsset` are the
+                  // options.length > 1 rule as DATA, so neither renderer
+                  // re-derives which of the two a tile click means.
+                  group.needsNetworkStep ? () => options.onSelectPicker(pickerKey, options.selectedPickerKey) : () => options.onContinueSwap(
+                    group.startPayInAsset ?? displayOption.pay_in_asset
+                  )
+                )
               },
               React9.createElement(
                 "span",
@@ -2647,13 +2681,13 @@ function renderWizardBreadcrumbs(options) {
 function swapOptionsForRoute(routeKey, options) {
   return options.filter((option) => swapAssetMatchesRoute(routeKey, option.pay_in_asset));
 }
-function selectCurrentSwapInvoice(checkout, local, dismissedInvoiceId) {
-  const fromCheckout = checkout?.invoices.find(
-    (invoice) => invoice.rail === "swap" && invoice.swap !== void 0 && invoice.invoice_id !== dismissedInvoiceId
-  );
-  if (local === null || local.invoice_id === dismissedInvoiceId) return fromCheckout;
-  const matched = checkout?.invoices.find((invoice) => invoice.invoice_id === local.invoice_id) ?? local;
-  return overlaySwapRefundStaging(matched, local);
+function resolveAttemptPaymentHash(invoices, attemptId) {
+  for (const invoice of invoices) {
+    if (invoice == null) continue;
+    if ((invoice.swap?.attempt_id ?? invoice.invoice_id) !== attemptId) continue;
+    if (invoice.payment_hash !== void 0) return invoice.payment_hash;
+  }
+  throw new Error(`No swap attempt ${attemptId} in this checkout.`);
 }
 function renderRoutePicker(options) {
   return React9.createElement(
@@ -2868,9 +2902,13 @@ function CheckoutView(props) {
     prefix = OPENRECEIVE_DEFAULT_PREFIX,
     metadata: _metadata,
     createFetch: _createFetch,
-    syncUrl: _syncUrl,
+    // Not `_`-prefixed like its neighbours: the view reads it, to infer
+    // `resumable` for the refund screen. Still destructured out so it never
+    // reaches the rendered <section>.
+    syncUrl,
     resumePathPrefix: _resumePathPrefix,
-    routeReference: _routeReference,
+    routeReference,
+    resumable,
     onRequestLightning,
     onSwapStarted,
     mintingLightning = false,
@@ -2895,6 +2933,7 @@ function CheckoutView(props) {
     classNames,
     children,
     resolveAssetUrl,
+    assetBaseUrl,
     className,
     ...sectionProps
   } = props;
@@ -2965,6 +3004,21 @@ function CheckoutView(props) {
       ...ownsTheme ? theme.attributes : {}
     },
     customChildren === void 0 ? [
+      // Above the amount and OUTSIDE the Lightning pane, which drops out on
+      // the swap deposit panel, on expiry and on the receipt — the payer
+      // needs to know what they are buying on all four screens.
+      checkoutModel.checkout.description === void 0 || checkoutModel.checkout.description === "" ? null : React10.createElement(
+        "p",
+        {
+          key: "order-description",
+          className: joinClassNames(
+            orClasses7.orderDescription,
+            classNames?.orderDescription
+          ),
+          [OPENRECEIVE_CHECKOUT_DATA_ATTRIBUTES3.orderDescription]: ""
+        },
+        checkoutModel.checkout.description
+      ),
       ownsTheme ? React10.createElement(ThemeToggle, {
         key: "theme",
         className: classNames?.themeToggle,
@@ -3135,7 +3189,16 @@ function CheckoutView(props) {
         onCopy,
         onRequestLightning,
         onSwapStarted,
-        resolveAssetUrl
+        resolveAssetUrl,
+        assetBaseUrl,
+        // Whether a payer who closes the tab has a URL to come back
+        // to. Explicit wins — only the host knows about a per-order
+        // route of its own; otherwise infer it from the two props that
+        // put the reference in the URL.
+        resumable: resumable ?? (syncUrl === true || routeReference !== void 0),
+        // The engine's staged refund address rides the controller this
+        // model owns, so a poll cannot wipe a review in progress.
+        swapRefund: checkoutModel
       }) : null
     ] : customChildren
   );
@@ -3168,7 +3231,6 @@ export {
   CopyInvoiceButton,
   InvoiceSummary,
   OpenWalletButton,
-  PaymentData,
   PaymentState,
   PaymentWizard,
   QRCode,