@openreceive/react 0.4.24 → 0.4.26

package/dist/index.d.ts

@@ -48,6 +48,12 @@ interface UseCheckoutOptions extends CheckoutData, Omit<CheckoutEventHandlers, "
     readonly prefix?: string;
     /** Header name the page's `<meta name="csrf-token">` is sent under; default `X-CSRF-Token`. */
     readonly csrfHeader?: string;
+    /**
+     * The fetch the status poll and the swap refund calls go through. Default
+     * `globalThis.fetch`. Pass one that adds an `Authorization` header when the
+     * app's session is a bearer token rather than a cookie.
+     */
+    readonly fetch?: typeof globalThis.fetch;
     readonly polling?: boolean;
     readonly pollIntervalMs?: number;
 }
@@ -142,10 +148,19 @@ interface CheckoutComponents {
 type CheckoutChildren = React.ReactNode | ((model: UseCheckoutResult) => React.ReactNode);
 interface CheckoutProps extends CheckoutComponentProps, CheckoutEventHandlers, Omit<React.HTMLAttributes<HTMLElement>, "children" | "prefix" | "onCopy" | "onError"> {
     /**
-     * Create mode (`reference`, no `checkout`): the component creates the checkout against
-     * `${prefix}/checkouts`, then polls `${prefix}/payments/check`. Later requests carry
-     * `reference` and the displayed `payment_hash`; the host remains responsible for
-     * authorization, order display, and routing. This fetch makes those create calls.
+     * The fetch every checkout request goes through, in both modes: prepare and
+     * create, the `${prefix}/payments/check` poll, and the swap quote, start,
+     * status and refund calls. Default `globalThis.fetch`, which sends the page's
+     * cookies. An app whose session is a bearer token (supabase-js keeps it in
+     * localStorage) passes a fetch that adds the `Authorization` header, so its
+     * `authorize` sees the same session on every call. The host remains
+     * responsible for authorization, order display, and routing.
+     */
+    readonly fetch?: typeof globalThis.fetch;
+    /**
+     * @deprecated The old name of `fetch`, from when it covered only the create
+     * calls. It now covers every request, as `fetch` does; `fetch` wins when both
+     * are set. It will be removed in a later release.
      */
     readonly createFetch?: typeof globalThis.fetch;
     /** `false` turns status polling off entirely. */

package/dist/index.js

@@ -763,6 +763,9 @@ function useCheckout(options) {
   const refreshStatusRef = React6.useRef(refreshStatus);
   refreshStatusRef.current = refreshStatus;
   const polls = refreshStatus !== void 0;
+  const fetchRef = React6.useRef(options.fetch);
+  fetchRef.current = options.fetch;
+  const hostFetch = options.fetch !== void 0;
   const prefix = options.polling === false ? void 0 : options.prefix;
   const snapshotRef = React6.useRef(snapshot);
   snapshotRef.current = snapshot;
@@ -775,6 +778,9 @@ function useCheckout(options) {
       } : {},
       ...prefix === void 0 ? {} : { prefix },
       ...options.csrfHeader === void 0 ? {} : { csrfHeader: options.csrfHeader },
+      ...hostFetch ? {
+        fetch: (input, init) => (fetchRef.current ?? globalThis.fetch)(input, init)
+      } : {},
       pollIntervalMs: options.pollIntervalMs,
       // Omit logger when unset so @openreceive/browser attaches its default console sink.
       // Pass `false` through to disable; wrap custom sinks so inline host callbacks stay stable.
@@ -802,7 +808,7 @@ function useCheckout(options) {
       controller.stop();
       if (controllerRef.current === controller) controllerRef.current = null;
     };
-  }, [checkoutIdentity, polls, prefix, options.csrfHeader, options.pollIntervalMs]);
+  }, [checkoutIdentity, polls, prefix, options.csrfHeader, options.pollIntervalMs, hostFetch]);
   const publicStatus = deriveStatus(state);
   const richStatus = createCheckoutStatusModel2(state);
   React6.useEffect(() => {
@@ -2992,6 +2998,7 @@ function CheckoutCreate(props) {
   const {
     onError,
     metadata,
+    fetch: fetchProp,
     createFetch,
     className,
     classNames,
@@ -3012,8 +3019,8 @@ function CheckoutCreate(props) {
   onErrorRef.current = onError;
   const metadataRef = React10.useRef(metadata);
   metadataRef.current = metadata;
-  const createFetchRef = React10.useRef(createFetch);
-  createFetchRef.current = createFetch;
+  const fetchRef = React10.useRef(fetchProp ?? createFetch);
+  fetchRef.current = fetchProp ?? createFetch;
   const createdCheckoutRef = React10.useRef(created.checkout);
   createdCheckoutRef.current = created.checkout;
   const session = useCheckoutSession({
@@ -3026,7 +3033,7 @@ function CheckoutCreate(props) {
       reference: id,
       ...csrfHeader === void 0 ? {} : { csrfHeader },
       ...metadataRef.current === void 0 ? {} : { metadata: metadataRef.current },
-      ...createFetchRef.current === void 0 ? {} : { fetch: createFetchRef.current }
+      ...fetchRef.current === void 0 ? {} : { fetch: fetchRef.current }
     }),
     // One stable CheckoutView across the mint: swapping the rendered shell
     // remounted PaymentWizard and wiped the payer's method selection.
@@ -3050,11 +3057,11 @@ function CheckoutCreate(props) {
       signal: action.signal,
       reference,
       ...csrfHeader === void 0 ? {} : { csrfHeader },
-      ...createFetchRef.current === void 0 ? {} : { fetch: createFetchRef.current }
+      ...fetchRef.current === void 0 ? {} : { fetch: fetchRef.current }
     }).then(
       (checkout) => cancelled || !action.isCurrent() || resumePaymentHash === void 0 ? checkout : resumeCheckoutAttempt({
         signal: action.signal,
-        fetch: createFetchRef.current ?? globalThis.fetch,
+        fetch: fetchRef.current ?? globalThis.fetch,
         prefix: resolvedPrefix,
         ...csrfHeader === void 0 ? {} : { csrfHeader },
         reference,
@@ -3167,7 +3174,9 @@ function CheckoutView(props) {
     prefix = OPENRECEIVE_DEFAULT_PREFIX,
     csrfHeader,
     metadata: _metadata,
-    createFetch: _createFetch,
+    // Read by the view too: the poll and the swap calls go through it.
+    fetch: fetchProp,
+    createFetch,
     // 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>.
@@ -3206,6 +3215,7 @@ function CheckoutView(props) {
     className,
     ...sectionProps
   } = props;
+  const hostFetch = fetchProp ?? createFetch;
   const checkoutModel = useCheckout({
     checkout,
     logger,
@@ -3218,7 +3228,8 @@ function CheckoutView(props) {
     onState,
     onSettled,
     polling,
-    ...pollIntervalMs === void 0 ? {} : { pollIntervalMs }
+    ...pollIntervalMs === void 0 ? {} : { pollIntervalMs },
+    ...hostFetch === void 0 ? {} : { fetch: hostFetch }
   });
   const theme = useTheme({
     defaultTheme,
@@ -3465,6 +3476,7 @@ function CheckoutView(props) {
           onSwapFocusChange: setSwapFocused,
           onLightningFocusChange: setLightningFocused,
           prefix,
+          ...hostFetch === void 0 ? {} : { fetch: hostFetch },
           csrfHeader,
           qrEncoder,
           decodeLinkUrl,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openreceive/react",
-  "version": "0.4.24",
+  "version": "0.4.26",
   "description": "React components and hooks for Bitcoin Lightning checkout and optional USDT, USDC, SOL and ETH swaps.",
   "keywords": [
     "bitcoin",
@@ -19,8 +19,8 @@
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "dependencies": {
-    "@openreceive/browser": "0.4.24",
-    "@openreceive/core": "0.4.24"
+    "@openreceive/browser": "0.4.26",
+    "@openreceive/core": "0.4.26"
   },
   "peerDependencies": {
     "react": ">=18.0.0"