@daimo/pay 1.9.5 → 1.10.1

package/build/index.d.ts

@@ -1,4 +1,5 @@
-import React$1, { ReactNode, ReactElement } from 'react';
+import * as React$1 from 'react';
+import React__default, { ReactNode, ReactElement } from 'react';
 export { version } from '../package.json';
 import { CreateConfigParameters } from '@wagmi/core';
 import { CreateConnectorFn } from 'wagmi';
@@ -19,7 +20,7 @@ type CustomAvatarProps = {
     radius: number;
 };
 /** Icon for an Ethereum address. Supports ENS names and avatars. */
-declare const Avatar: React$1.FC<{
+declare const Avatar: React__default.FC<{
     address?: Hash | undefined;
     name?: string | undefined;
     size?: number;
@@ -109,7 +110,7 @@ type useConnectCallbackProps = {
 };
 
 type DaimoPayProviderProps = {
-    children?: React$1.ReactNode;
+    children?: React__default.ReactNode;
     theme?: Theme;
     mode?: Mode;
     customTheme?: CustomTheme;
@@ -191,7 +192,7 @@ type PayButtonPaymentProps = {
      * */
     metadata?: DaimoPayUserMetadata;
     /**
-     * The address to refund to if the payment bounces or a refund is requested.
+     * The address to refund to if the payment bounces.
      */
     refundAddress?: Address;
 } | {
@@ -349,6 +350,8 @@ type DaimoPayFunctions = {
     hydrateOrder: (refundAddress?: Address) => Promise<Extract<PaymentState$1, {
         type: "payment_unpaid";
     }>>;
+    /** Trigger search for payment on the current order. */
+    paySource: () => void;
     /**
      * Register an Ethereum payment source for the current order.
      * Call this after the user has submitted an Ethereum payment transaction.
@@ -426,7 +429,7 @@ type UseDaimoPayUI = {
 declare function useDaimoPayUI(): UseDaimoPayUI;
 
 /** Icon for an EVM chain, given chain ID. No ID shows a loading spinner. */
-declare const Chain: React$1.FC<{
+declare const Chain: React__default.FC<{
     id?: number;
     unsupported?: boolean;
     radius?: number | string;
@@ -590,28 +593,28 @@ interface PaymentState {
 type SolanaWalletName = WalletName<string>;
 
 /** Meant for internal use. This will be non-exported in a future SDK version. */
-declare const PayContext: React$1.Context<PayContextValue | null>;
+declare const PayContext: React__default.Context<PayContextValue | null>;
 type PayLogFn = (message: string, ...props: any[]) => void;
 /** Daimo Pay internal context. */
 type PayContextValue = {
     theme: Theme;
-    setTheme: React$1.Dispatch<React$1.SetStateAction<Theme>>;
+    setTheme: React__default.Dispatch<React__default.SetStateAction<Theme>>;
     mode: Mode;
-    setMode: React$1.Dispatch<React$1.SetStateAction<Mode>>;
+    setMode: React__default.Dispatch<React__default.SetStateAction<Mode>>;
     customTheme: CustomTheme | undefined;
-    setCustomTheme: React$1.Dispatch<React$1.SetStateAction<CustomTheme | undefined>>;
+    setCustomTheme: React__default.Dispatch<React__default.SetStateAction<CustomTheme | undefined>>;
     lang: Languages;
-    setLang: React$1.Dispatch<React$1.SetStateAction<Languages>>;
+    setLang: React__default.Dispatch<React__default.SetStateAction<Languages>>;
     setOnOpen: (fn?: () => void) => void;
     setOnClose: (fn?: () => void) => void;
     open: boolean;
     setOpen: (open: boolean, meta?: Record<string, any>) => void;
     route: string;
     setRoute: (route: ROUTES, data?: Record<string, any>) => void;
-    errorMessage: string | React$1.ReactNode | null;
+    errorMessage: string | React__default.ReactNode | null;
     debugMode?: boolean;
     log: PayLogFn;
-    displayError: (message: string | React$1.ReactNode | null, code?: any) => void;
+    displayError: (message: string | React__default.ReactNode | null, code?: any) => void;
     resize: number;
     triggerResize: () => void;
     /** Session ID. */
@@ -623,7 +626,7 @@ type PayContextValue = {
     setPendingConnectorId: (id: string) => void;
     /** Chosen Solana wallet, eg Phantom.*/
     solanaConnector: SolanaWalletName | undefined;
-    setSolanaConnector: React$1.Dispatch<React$1.SetStateAction<SolanaWalletName | undefined>>;
+    setSolanaConnector: React__default.Dispatch<React__default.SetStateAction<SolanaWalletName | undefined>>;
     /** Global options, across all pay buttons and payments. */
     options?: DaimoPayContextOptions;
     /** Loads a payment, then shows the modal to complete payment. */
@@ -636,14 +639,84 @@ type PayContextValue = {
     onSuccess: () => void;
     /** Custom message to display on confirmation page. */
     confirmationMessage?: string;
-    setConfirmationMessage: React$1.Dispatch<React$1.SetStateAction<string | undefined>>;
+    setConfirmationMessage: React__default.Dispatch<React__default.SetStateAction<string | undefined>>;
     /** Redirect URL to return to the app. E.g. after Coinbase, Binance, RampNetwork. */
     redirectReturnUrl?: string;
-    setRedirectReturnUrl: React$1.Dispatch<React$1.SetStateAction<string | undefined>>;
+    setRedirectReturnUrl: React__default.Dispatch<React__default.SetStateAction<string | undefined>>;
 } & useConnectCallbackProps;
 
 /** Daimo Pay internal context. */
 declare const usePayContext: () => PayContextValue;
 
-export { Avatar, Chain as ChainIcon, DaimoPayButton, PayContext as DaimoPayContext, DaimoPayProvider, types as Types, daimoPayVersion, defaultConfig as getDefaultConfig, useDaimoPay, useDaimoPayStatus, useDaimoPayUI, usePayContext, wallets };
-export type { All, CustomAvatarProps, CustomTheme, DaimoPayButtonCustomProps, DaimoPayButtonProps, DaimoPayContextOptions, DaimoPayModalOptions, DaimoPayment, Languages, Mode, Theme };
+type WorldPayButtonPaymentProps = {
+    /**
+     * Your public app ID. Specify either (payId) or (appId + parameters).
+     */
+    appId: string;
+    /**
+     * Your World Mini App app ID.
+     */
+    worldAppId: string;
+    /**
+     * Destination chain ID.
+     */
+    toChain: number;
+    /**
+     * The destination token to send, completing payment. Must be an ERC-20
+     * token or the zero address, indicating the native token / ETH.
+     */
+    toToken: Address;
+    /**
+     * The amount of destination token to send (transfer or approve).
+     */
+    toUnits: string;
+    /**
+     * The destination address to transfer to, or contract to call.
+     */
+    toAddress: Address;
+    /**
+     * Optional calldata to call an arbitrary function on `toAddress`.
+     */
+    toCallData?: Hex;
+    /**
+     * The intent verb, such as "Pay", "Deposit", or "Purchase".
+     */
+    intent?: string;
+    /**
+     * External ID. E.g. a correlation ID.
+     */
+    externalId?: string;
+    /**
+     * Developer metadata. E.g. correlation ID.
+     * */
+    metadata?: DaimoPayUserMetadata;
+    /**
+     * The address to refund to if the payment bounces.
+     */
+    refundAddress?: Address;
+};
+type WorldPayButtonProps = WorldPayButtonPaymentProps & {
+    /** Light mode, dark mode, or auto. */
+    mode?: Mode;
+    /** Named theme. See docs for options. */
+    theme?: Theme;
+    /** Custom theme. See docs for options. */
+    customTheme?: CustomTheme;
+    /** Disable interaction. */
+    disabled?: boolean;
+};
+type WorldPayButtonCustomProps = WorldPayButtonProps & {
+    children: (renderProps: {
+        show: () => void;
+        isMiniKitReady: boolean;
+    }) => ReactElement;
+};
+declare function WorldPayButton(props: WorldPayButtonProps): react_jsx_runtime.JSX.Element;
+declare namespace WorldPayButton {
+    var displayName: string;
+    var Custom: typeof WorldPayButtonCustom;
+}
+declare function WorldPayButtonCustom(props: WorldPayButtonCustomProps): ReactElement<any, string | React$1.JSXElementConstructor<any>>;
+
+export { Avatar, Chain as ChainIcon, DaimoPayButton, PayContext as DaimoPayContext, DaimoPayProvider, types as Types, WorldPayButton, daimoPayVersion, defaultConfig as getDefaultConfig, useDaimoPay, useDaimoPayStatus, useDaimoPayUI, usePayContext, wallets };
+export type { All, CustomAvatarProps, CustomTheme, DaimoPayButtonCustomProps, DaimoPayButtonProps, DaimoPayContextOptions, DaimoPayModalOptions, DaimoPayment, Languages, Mode, Theme, WorldPayButtonCustomProps, WorldPayButtonProps };

package/build/index.js

@@ -2,7 +2,7 @@ import { http, useConnectors as useConnectors$1, useAccount, useSwitchChain, use
 import { mainnet, base as base$1, polygon, optimism, arbitrum, linea, bsc, sepolia, baseSepolia, worldchain, mantle } from 'wagmi/chains';
 import { safe, injected, coinbaseWallet, walletConnect } from '@wagmi/connectors';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { DaimoPayIntentStatus, assert, DaimoPayOrderMode, isHydrated, readDaimoPayOrderID, getOrderDestChainId, assertNotNull, getChainName, arbitrum as arbitrum$1, base as base$2, bsc as bsc$1, ethereum, linea as linea$1, mantle as mantle$1, optimism as optimism$1, polygon as polygon$1, worldchain as worldchain$1, solana, getAddressContraction, supportedChains, getChainExplorerTxUrl, ExternalPaymentOptions, DepositAddressPaymentOptions, ethereumUSDC, polygonUSDC, baseUSDC, arbitrumUSDC, optimismUSDC, isCCTPV1Chain, debugJson, writeDaimoPayOrderID, DaimoPayOrderStatusSource, getOrderSourceChainId, DaimoPayEventType, getDaimoPayOrderView } from '@daimo/pay-common';
+import { DaimoPayIntentStatus, assert, DaimoPayOrderMode, isHydrated, readDaimoPayOrderID, getOrderDestChainId, assertNotNull, getChainName, arbitrum as arbitrum$1, base as base$2, bsc as bsc$1, ethereum, linea as linea$1, mantle as mantle$1, optimism as optimism$1, polygon as polygon$1, worldchain as worldchain$1, solana, getAddressContraction, supportedChains, getChainExplorerTxUrl, ExternalPaymentOptions, DepositAddressPaymentOptions, ethereumUSDC, polygonUSDC, baseUSDC, arbitrumUSDC, optimismUSDC, isCCTPV1Chain, debugJson, writeDaimoPayOrderID, DaimoPayOrderStatusSource, getOrderSourceChainId, DaimoPayEventType, getDaimoPayOrderView, worldchainWLD, worldchainUSDCe } from '@daimo/pay-common';
 import { Buffer } from 'buffer';
 import React, { createContext, useRef, useState, useEffect, useLayoutEffect, useMemo, useContext, useSyncExternalStore, useCallback, createElement } from 'react';
 import styled$1, { css, keyframes, ThemeProvider } from 'styled-components';
@@ -22,7 +22,7 @@ import { VersionedTransaction } from '@solana/web3.js';
 import { normalize } from 'viem/ens';
 
 var name = "@daimo/pay";
-var version = "1.9.5";
+var version = "1.10.1";
 var author = "Daimo";
 var homepage = "https://pay.daimo.com";
 var license = "BSD-2-Clause license";
@@ -61,7 +61,7 @@ var keywords = [
 	"crypto"
 ];
 var dependencies = {
-	"@daimo/pay-common": "1.9.5",
+	"@daimo/pay-common": "1.10.1",
 	"@rollup/plugin-typescript": "^12.1.2",
 	"@solana/wallet-adapter-base": "^0.9.23",
 	"@solana/wallet-adapter-react": "^0.15.35",
@@ -84,7 +84,13 @@ var peerDependencies = {
 	react: "18.x || 19.x",
 	"react-dom": "18.x || 19.x",
 	viem: ">=2.22.0",
-	wagmi: "2.x"
+	wagmi: "2.x",
+	"@worldcoin/minikit-js": ">=1.9.5"
+};
+var peerDependenciesMeta = {
+	"@worldcoin/minikit-js": {
+		optional: true
+	}
 };
 var devDependencies = {
 	"@rollup/plugin-json": "^6.1.0",
@@ -119,6 +125,7 @@ var packageJson = {
 	keywords: keywords,
 	dependencies: dependencies,
 	peerDependencies: peerDependencies,
+	peerDependenciesMeta: peerDependenciesMeta,
 	devDependencies: devDependencies
 };
 
@@ -2565,6 +2572,15 @@ function attachPaymentEffectHandlers(store, trpc, log) {
                 }
                 break;
             }
+            case "pay_source": {
+                if (prev.type === "payment_unpaid") {
+                    runPaySourceEffects(store, trpc, prev);
+                }
+                else {
+                    log(`[EFFECT] Invalid event ${event.type} on state ${prev.type}`);
+                }
+                break;
+            }
             case "pay_ethereum_source": {
                 if (prev.type === "payment_unpaid") {
                     runPayEthereumSourceEffects(store, trpc, prev, event);
@@ -2731,6 +2747,18 @@ async function runHydratePayIdEffects(store, trpc, prev, event) {
         store.dispatch({ type: "error", order: prev.order, message: e.message });
     }
 }
+async function runPaySourceEffects(store, trpc, prev) {
+    const orderId = prev.order.id;
+    try {
+        const order = await trpc.findOrderPayments.query({
+            orderId: orderId.toString(),
+        });
+        store.dispatch({ type: "order_refreshed", order });
+    }
+    catch (e) {
+        store.dispatch({ type: "error", order: prev.order, message: e.message });
+    }
+}
 async function runPayEthereumSourceEffects(store, trpc, prev, event) {
     const orderId = prev.order.id;
     try {
@@ -2858,6 +2886,7 @@ function useDaimoPay() {
         const hydratedOrderState = await waitForPaymentState(store, (s) => s.type === "payment_unpaid");
         return hydratedOrderState;
     }, [dispatch, store]);
+    const paySource = useCallback(() => dispatch({ type: "pay_source" }), [dispatch]);
     const payEthSource = useCallback((args) => dispatch({ type: "pay_ethereum_source", ...args }), [dispatch]);
     const paySolanaSource = useCallback((args) => dispatch({ type: "pay_solana_source", ...args }), [dispatch]);
     const reset = useCallback(() => dispatch({ type: "reset" }), [dispatch]);
@@ -2868,6 +2897,7 @@ function useDaimoPay() {
         createPreviewOrder,
         hydrateOrder,
         setPayId,
+        paySource,
         payEthSource,
         paySolanaSource,
         reset,
@@ -13096,7 +13126,7 @@ const ThemedButton = ({ children, variant = "primary", autoSize = true, duration
 function DaimoPayButton(props) {
     const { theme, mode, customTheme } = props;
     const context = usePayContext();
-    return (jsx(DaimoPayButtonCustom, { ...props, children: ({ show }) => (jsx(ResetContainer, { "$useTheme": theme ?? context.theme, "$useMode": mode ?? context.mode, "$customTheme": customTheme ?? context.customTheme, children: jsx(ThemeContainer, { onClick: !props.disabled && show, children: jsx(ThemedButton, { theme: theme ?? context.theme, mode: mode ?? context.mode, customTheme: customTheme ?? context.customTheme, children: jsx(DaimoPayButtonInner, { disabled: props.disabled }) }) }) })) }));
+    return (jsx(DaimoPayButtonCustom, { ...props, children: ({ show }) => (jsx(ResetContainer, { "$useTheme": theme ?? context.theme, "$useMode": mode ?? context.mode, "$customTheme": customTheme ?? context.customTheme, children: jsx(ThemeContainer, { onClick: !props.disabled && show, children: jsx(ThemedButton, { theme: theme ?? context.theme, mode: mode ?? context.mode, customTheme: customTheme ?? context.customTheme, children: jsx(DaimoPayButtonInner, {}) }) }) })) }));
 }
 /** Like DaimoPayButton, but with custom styling. */
 function DaimoPayButtonCustom(props) {
@@ -13269,7 +13299,7 @@ const contentVariants = {
         },
     },
 };
-function DaimoPayButtonInner({ disabled }) {
+function DaimoPayButtonInner() {
     const { order } = useDaimoPay();
     const label = order?.metadata?.intent ?? "Pay";
     return (jsx(AnimatePresence, { initial: false, children: jsx(TextContainer, { initial: "initial", animate: "animate", exit: "exit", variants: contentVariants, style: {
@@ -13560,5 +13590,120 @@ const wallets = Object.keys(walletConfigs).reduce((acc, key) => {
     return acc;
 }, {});
 
-export { Avatar, Chain as ChainIcon, DaimoPayButton, PayContext as DaimoPayContext, DaimoPayProvider, daimoPayVersion, defaultConfig as getDefaultConfig, useDaimoPay, useDaimoPayStatus, useDaimoPayUI, usePayContext, version, wallets };
+/**
+ * Open Worldcoin's payment drawer and prompt the user to pay a Daimo Pay order.
+ */
+async function promptWorldcoinPayment(order, trpc) {
+    try {
+        // Dynamically import @worldcoin/minikit-js to avoid bundling it for
+        // developers who don't use World Mini App features, as it's an optional
+        // peer dependency.
+        const { MiniKit, Tokens } = await import(
+        /* webpackIgnore: true */ '@worldcoin/minikit-js');
+        if (!MiniKit.isInstalled()) {
+            console.error("[WORLD] MiniKit is not installed. Please install @worldcoin/minikit-js to use this feature.");
+            return null;
+        }
+        const paymentOptions = (await trpc.getTokenPaymentOptions.query({
+            orderId: order.id,
+            tokens: [
+                {
+                    chainId: worldchainWLD.chainId,
+                    token: worldchainWLD.token,
+                },
+                {
+                    chainId: worldchainUSDCe.chainId,
+                    token: worldchainUSDCe.token,
+                },
+            ],
+        }));
+        const wld = paymentOptions.find((opt) => getAddress(opt.token.token) === getAddress(worldchainWLD.token));
+        const usdc = paymentOptions.find((opt) => getAddress(opt.token.token) === getAddress(worldchainUSDCe.token));
+        assert(wld != null, "WLD DP token not found");
+        assert(usdc != null, "USDCe DP token not found");
+        const paymentId = crypto.randomUUID().replace(/-/g, "");
+        const payload = {
+            reference: paymentId,
+            to: order.intentAddr,
+            tokens: [
+                {
+                    symbol: Tokens.WLD,
+                    token_amount: wld.amount,
+                },
+                {
+                    symbol: Tokens.USDCE,
+                    token_amount: usdc.amount,
+                },
+            ],
+            description: order.metadata.intent,
+        };
+        const { finalPayload } = await MiniKit.commandsAsync.pay(payload);
+        return { paymentId, finalPayload };
+    }
+    catch (error) {
+        console.error("[WORLD] Error sending payment", error);
+        return null;
+    }
+}
+
+function WorldPayButton(props) {
+    const { theme, mode, customTheme } = props;
+    const context = usePayContext();
+    return (jsx(WorldPayButtonCustom, { ...props, children: ({ show, isMiniKitReady }) => (jsx(ResetContainer, { "$useTheme": theme ?? context.theme, "$useMode": mode ?? context.mode, "$customTheme": customTheme ?? context.customTheme, children: jsx(ThemeContainer, { onClick: !props.disabled && isMiniKitReady && show, children: jsx(ThemedButton, { children: jsx(DaimoPayButtonInner, {}) }) }) })) }));
+}
+function WorldPayButtonCustom(props) {
+    const pay = useDaimoPay();
+    const context = usePayContext();
+    const [isMiniKitReady, setIsMiniKitReady] = useState(false);
+    useEffect(() => {
+        // Dynamically import @worldcoin/minikit-js to avoid bundling it for
+        // developers who don't use World Mini App features, as it's an optional
+        // peer dependency.
+        import(/* webpackIgnore: true */ '@worldcoin/minikit-js')
+            .then(({ MiniKit }) => {
+            if (MiniKit.isInstalled()) {
+                setIsMiniKitReady(true);
+            }
+            else {
+                setIsMiniKitReady(false);
+            }
+        })
+            .catch(() => {
+            setIsMiniKitReady(false);
+        });
+    }, []);
+    useEffect(() => {
+        pay.createPreviewOrder(props);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [pay, JSON.stringify(props)]);
+    const showSpinner = useCallback(() => {
+        context.showPayment({});
+        context.setRoute(ROUTES.CONFIRMATION);
+    }, [context]);
+    const show = useCallback(async () => {
+        if (!isMiniKitReady) {
+            console.error("[WORLD] MiniKit is not installed. Please install @worldcoin/minikit-js to use this feature.");
+            return;
+        }
+        if (["payment_started", "payment_completed", "payment_bounced"].includes(pay.paymentState)) {
+            showSpinner();
+            return;
+        }
+        const { order } = await pay.hydrateOrder();
+        const payRes = await promptWorldcoinPayment(order, context.trpc);
+        if (payRes == null || payRes.finalPayload.status == "error") {
+            console.error("[WORLD] Failed to prompt Worldcoin payment: ", payRes);
+            return;
+        }
+        pay.paySource();
+        // Optimistically assume the source payment is correct and show the
+        // confirmation spinner
+        showSpinner();
+    }, [pay, showSpinner, context.trpc, isMiniKitReady]);
+    return props.children({ show, isMiniKitReady });
+}
+WorldPayButton.displayName = "WorldPayButton";
+WorldPayButton.Custom = WorldPayButtonCustom;
+
+export { Avatar, Chain as ChainIcon, DaimoPayButton, PayContext as DaimoPayContext, DaimoPayProvider, WorldPayButton, daimoPayVersion, defaultConfig as getDefaultConfig, useDaimoPay, useDaimoPayStatus, useDaimoPayUI, usePayContext, version, wallets };
 //# sourceMappingURL=index.js.map