@daimo/pay 1.1.4 → 1.2.0

package/build/src/components/Spinners/TokenLogoSpinner/styles.js

@@ -0,0 +1,40 @@
+import { motion } from 'framer-motion';
+import styled from 'styled-components';
+
+const ChainLogoContainer = styled(motion.div) `
+  z-index: 10;
+  position: absolute;
+  right: 2px;
+  bottom: 2px;
+  padding: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  border-radius: 16px;
+  overflow: hidden;
+
+  color: var(--ck-body-background);
+  transition: color 200ms ease;
+
+  &:before {
+    z-index: 5;
+    content: "";
+    position: absolute;
+    inset: 0;
+    opacity: 0;
+    transition: opacity 200ms ease;
+    background: var(--ck-body-color);
+  }
+
+  svg {
+    display: block;
+    position: relative;
+    width: 100%;
+    height: 100%;
+  }
+`;
+
+export { ChainLogoContainer };
+//# sourceMappingURL=styles.js.map

package/build/src/components/Spinners/TokenLogoSpinner/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/components/Spinners/styles.js

@@ -0,0 +1,32 @@
+import { motion } from 'framer-motion';
+import styled, { css } from 'styled-components';
+
+const LoadingContainer = styled(motion.div) `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 10px auto 16px;
+  height: 120px;
+`;
+const AnimationContainer = styled(motion.div) `
+  user-select: none;
+  position: relative;
+  --spinner-error-opacity: 0;
+  &:before {
+    content: "";
+    position: absolute;
+    inset: 1px;
+    opacity: 0;
+    background: var(--ck-body-color-danger);
+    ${(props) => props.$circle &&
+    css `
+        inset: -5px;
+        border-radius: 50%;
+        background: none;
+        box-shadow: inset 0 0 0 3.5px var(--ck-body-color-danger);
+      `}
+  }
+`;
+
+export { AnimationContainer, LoadingContainer };
+//# sourceMappingURL=styles.js.map

package/build/src/components/Spinners/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useDepositAddressOptions.js

@@ -1,14 +1,15 @@
 import { useState, useEffect } from 'react';
 
-function useDepositAddressOptions({ trpc, usdRequired, }) {
+function useDepositAddressOptions({ trpc, usdRequired, mode, }) {
     const [options, setOptions] = useState([]);
     const [loading, setLoading] = useState(false);
     useEffect(() => {
-        const refreshDepositAddressOptions = async () => {
+        const refreshDepositAddressOptions = async (usd, mode) => {
             setLoading(true);
             try {
                 const options = await trpc.getDepositAddressOptions.query({
-                    usdRequired,
+                    usdRequired: usd,
+                    mode,
                 });
                 setOptions(options);
             }
@@ -19,8 +20,10 @@ function useDepositAddressOptions({ trpc, usdRequired, }) {
                 setLoading(false);
             }
         };
-        refreshDepositAddressOptions();
-    }, [usdRequired]);
+        if (usdRequired != null && mode != null) {
+            refreshDepositAddressOptions(usdRequired, mode);
+        }
+    }, [usdRequired, mode]);
     return { options, loading };
 }
 

package/build/src/hooks/useDepositAddressOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDepositAddressOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"useDepositAddressOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useExternalPaymentOptions.js

@@ -7,18 +7,19 @@ const DEFAULT_EXTERNAL_PAYMENT_OPTIONS = [
     ExternalPaymentOptions.Daimo,
     ExternalPaymentOptions.RampNetwork,
 ];
-function useExternalPaymentOptions({ trpc, filterIds, usdRequired, platform, }) {
+function useExternalPaymentOptions({ trpc, filterIds, platform, usdRequired, mode, }) {
     const [options, setOptions] = useState([]);
     const [loading, setLoading] = useState(false);
     useEffect(() => {
-        const refreshExternalPaymentOptions = async (usd) => {
+        const refreshExternalPaymentOptions = async (usd, mode) => {
             if (!platform)
                 return;
             setLoading(true);
             try {
                 const newOptions = await trpc.getExternalPaymentOptions.query({
-                    usdRequired: usd,
                     platform,
+                    mode,
+                    usdRequired: usd,
                 });
                 // Filter out options not in options JSON
                 const enabledExtPaymentOptions = filterIds || DEFAULT_EXTERNAL_PAYMENT_OPTIONS;
@@ -32,10 +33,10 @@ function useExternalPaymentOptions({ trpc, filterIds, usdRequired, platform, })
                 setLoading(false);
             }
         };
-        if (usdRequired != null) {
-            refreshExternalPaymentOptions(usdRequired);
+        if (usdRequired != null && mode != null) {
+            refreshExternalPaymentOptions(usdRequired, mode);
         }
-    }, [usdRequired, filterIds, platform]);
+    }, [usdRequired, filterIds, platform, mode]);
     return {
         options,
         loading,

package/build/src/hooks/useExternalPaymentOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"useExternalPaymentOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"useExternalPaymentOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useOrderUsdLimits.js

@@ -0,0 +1,26 @@
+import { useState, useEffect } from 'react';
+
+function useOrderUsdLimits({ trpc }) {
+    const [limits, setLimits] = useState({});
+    const [loading, setLoading] = useState(false);
+    useEffect(() => {
+        const refreshOrderUsdLimits = async () => {
+            setLoading(true);
+            try {
+                const { limits: newLimits } = await trpc.getOrderUsdLimits.query();
+                setLimits(newLimits);
+            }
+            catch (e) {
+                console.error(e);
+            }
+            finally {
+                setLoading(false);
+            }
+        };
+        refreshOrderUsdLimits();
+    }, []);
+    return { limits, loading };
+}
+
+export { useOrderUsdLimits };
+//# sourceMappingURL=useOrderUsdLimits.js.map

package/build/src/hooks/useOrderUsdLimits.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOrderUsdLimits.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/usePaymentState.js

@@ -8,6 +8,7 @@ import { generatePayId } from '../utils/exports.js';
 import { detectPlatform } from '../utils/platform.js';
 import { useDepositAddressOptions } from './useDepositAddressOptions.js';
 import { useExternalPaymentOptions } from './useExternalPaymentOptions.js';
+import { useOrderUsdLimits } from './useOrderUsdLimits.js';
 import { usePayWithSolanaToken } from './usePayWithSolanaToken.js';
 import { usePayWithToken } from './usePayWithToken.js';
 import { useSolanaPaymentOptions } from './useSolanaPaymentOptions.js';
@@ -31,14 +32,16 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
     // Daimo Pay order state.
     const [payParams, setPayParamsState] = useState();
     const [paymentWaitingMessage, setPaymentWaitingMessage] = useState();
+    const [isDepositFlow, setIsDepositFlow] = useState(false);
     // Payment UI config.
     const [modalOptions, setModalOptions] = useState({});
     // UI state. Selection for external payment (Binance, etc) vs wallet payment.
     const externalPaymentOptions = useExternalPaymentOptions({
         trpc,
         filterIds: daimoPayOrder?.metadata.payer?.paymentOptions,
-        usdRequired: daimoPayOrder?.destFinalCallTokenAmount.usd,
         platform,
+        usdRequired: daimoPayOrder?.destFinalCallTokenAmount.usd,
+        mode: daimoPayOrder?.mode,
     });
     const walletPaymentOptions = useWalletPaymentOptions({
         trpc,
@@ -47,17 +50,21 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
         destChainId: daimoPayOrder?.destFinalCallTokenAmount.token.chainId,
         preferredChains: daimoPayOrder?.metadata.payer?.preferredChains,
         preferredTokens: daimoPayOrder?.metadata.payer?.preferredTokens,
+        isDepositFlow,
         log,
     });
     const solanaPaymentOptions = useSolanaPaymentOptions({
         trpc,
         address: solanaPubKey,
         usdRequired: daimoPayOrder?.destFinalCallTokenAmount.usd,
+        isDepositFlow,
     });
     const depositAddressOptions = useDepositAddressOptions({
         trpc,
-        usdRequired: daimoPayOrder?.destFinalCallTokenAmount.usd ?? 0,
+        usdRequired: daimoPayOrder?.destFinalCallTokenAmount.usd,
+        mode: daimoPayOrder?.mode,
     });
+    const chainOrderUsdLimits = useOrderUsdLimits({ trpc });
     /** Create a new order or hydrate an existing one. */
     const createOrHydrate = async ({ order, refundAddress, externalPaymentOption, }) => {
         assert(!!platform, "missing platform");
@@ -72,15 +79,16 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
             });
         }
         log(`[CHECKOUT] creating+hydrating new order ${order.id}`);
-        // Update units, if amountEditable the user may have changed the amount.
+        // Update units, if isDepositFlow then the user may have changed the amount.
         const toUnits = formatUnits(BigInt(order.destFinalCallTokenAmount.amount), order.destFinalCallTokenAmount.token.decimals);
         return await trpc.createOrder.mutate({
             appId: payParams.appId,
             paymentInput: {
                 ...payParams,
                 id: order.id.toString(),
-                toUnits: toUnits,
+                toUnits,
                 metadata: order.metadata,
+                isAmountEditable: isDepositFlow,
             },
             platform,
             refundAddress,
@@ -108,6 +116,16 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
     const [selectedTokenOption, setSelectedTokenOption] = useState();
     const [selectedSolanaTokenOption, setSelectedSolanaTokenOption] = useState();
     const [selectedDepositAddressOption, setSelectedDepositAddressOption] = useState();
+    const getOrderUsdLimit = () => {
+        const DEFAULT_USD_LIMIT = 20000;
+        if (daimoPayOrder == null || chainOrderUsdLimits.loading) {
+            return DEFAULT_USD_LIMIT;
+        }
+        const destChainId = daimoPayOrder.destFinalCallTokenAmount.token.chainId;
+        return destChainId in chainOrderUsdLimits.limits
+            ? chainOrderUsdLimits.limits[destChainId]
+            : DEFAULT_USD_LIMIT;
+    };
     const payWithExternal = async (option) => {
         assert(!!daimoPayOrder && !!platform);
         const { hydratedOrder, externalPaymentOptionData } = await createOrHydrate({
@@ -141,14 +159,17 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
         const { order } = await trpc.getOrder.query({
             id,
         });
-        setDaimoPayOrder(order);
+        // Don't overwrite the order if a new order was generated.
+        if (daimoPayOrder == null || order.id === daimoPayOrder.id) {
+            setDaimoPayOrder(order);
+        }
     }, [daimoPayOrder?.id]);
     /** User picked a different deposit amount. */
-    const setChosenUsd = (usdAmount) => {
-        log(`[CHECKOUT] Setting chosen USD amount to ${usdAmount}`);
+    const setChosenUsd = (usd) => {
+        log(`[CHECKOUT] Setting chosen USD amount to ${usd}`);
         assert(!!daimoPayOrder);
         const token = daimoPayOrder.destFinalCallTokenAmount.token;
-        const tokenAmount = parseUnits((usdAmount / token.usd).toString(), token.decimals);
+        const tokenAmount = parseUnits((usd / token.usd).toString(), token.decimals);
         // TODO: remove amount from destFinalCall, it is redundant with
         // destFinalCallTokenAmount. Here, we only modify one and not the other.
         setDaimoPayOrder({
@@ -156,7 +177,7 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
             destFinalCallTokenAmount: {
                 token,
                 amount: tokenAmount.toString(),
-                usd: usdAmount,
+                usd: usd,
             },
         });
     };
@@ -180,16 +201,23 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
     const setPayParams = async (payParams) => {
         assert(payParams != null);
         setPayParamsState(payParams);
+        setIsDepositFlow(payParams.toUnits == null);
+        generatePreviewOrder(payParams);
+    };
+    const generatePreviewOrder = async (payParams) => {
         const newPayId = generatePayId();
         const newId = readDaimoPayOrderID(newPayId).toString();
-        const payment = await trpc.previewOrder.query({
+        // toUnits is undefined if and only if we're in deposit flow.
+        // Set dummy value for deposit flow, since user can edit the amount.
+        const toUnits = payParams.toUnits == null ? "0" : payParams.toUnits;
+        const orderPreview = await trpc.previewOrder.query({
             id: newId,
             toChain: payParams.toChain,
             toToken: payParams.toToken,
-            toUnits: payParams.toUnits,
+            toUnits,
             toAddress: payParams.toAddress,
             toCallData: payParams.toCallData,
-            isAmountEditable: payParams.isAmountEditable,
+            isAmountEditable: payParams.toUnits == null,
             metadata: {
                 intent: payParams.intent ?? "Pay",
                 items: [],
@@ -200,7 +228,7 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
                 },
             },
         });
-        setDaimoPayOrder(payment);
+        setDaimoPayOrder(orderPreview);
     };
     const onSuccess = ({ txHash, txURL }) => {
         if (modalOptions?.closeOnSuccess) {
@@ -212,7 +240,9 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
         setPayId,
         payParams,
         setPayParams,
+        generatePreviewOrder,
         daimoPayOrder,
+        isDepositFlow,
         modalOptions,
         setModalOptions,
         paymentWaitingMessage,
@@ -224,10 +254,12 @@ function usePaymentState({ trpc, daimoPayOrder, setDaimoPayOrder, setOpen, log,
         solanaPaymentOptions,
         depositAddressOptions,
         selectedDepositAddressOption,
-        setSelectedDepositAddressOption,
+        getOrderUsdLimit,
+        setPaymentWaitingMessage,
         setSelectedExternalOption,
         setSelectedTokenOption,
         setSelectedSolanaTokenOption,
+        setSelectedDepositAddressOption,
         setChosenUsd,
         payWithToken,
         payWithExternal,

package/build/src/hooks/usePaymentState.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePaymentState.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"usePaymentState.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useSolanaPaymentOptions.js

@@ -1,18 +1,20 @@
 import { useState, useEffect } from 'react';
 
-function useSolanaPaymentOptions({ trpc, address, usdRequired, }) {
+/** Wallet payment options. User picks one. */
+function useSolanaPaymentOptions({ trpc, address, usdRequired, isDepositFlow, }) {
     const [options, setOptions] = useState(null);
     const [isLoading, setIsLoading] = useState(false);
     useEffect(() => {
         const refreshWalletPaymentOptions = async () => {
-            if (!address || !usdRequired)
+            if (address == null || usdRequired == null)
                 return;
             setOptions(null);
             setIsLoading(true);
             try {
                 const newOptions = await trpc.getSolanaPaymentOptions.query({
                     pubKey: address,
-                    usdRequired,
+                    // API expects undefined for deposit flow.
+                    usdRequired: isDepositFlow ? undefined : usdRequired,
                 });
                 setOptions(newOptions);
             }
@@ -23,10 +25,10 @@ function useSolanaPaymentOptions({ trpc, address, usdRequired, }) {
                 setIsLoading(false);
             }
         };
-        if (address && usdRequired != null) {
+        if (address != null && usdRequired != null) {
             refreshWalletPaymentOptions();
         }
-    }, [address, usdRequired]);
+    }, [address, usdRequired, isDepositFlow]);
     return {
         options,
         isLoading,

package/build/src/hooks/useSolanaPaymentOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSolanaPaymentOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"useSolanaPaymentOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/hooks/useWalletPaymentOptions.js

@@ -1,25 +1,26 @@
-import { getDAv2Chains } from '@daimo/contract';
 import { useState, useEffect } from 'react';
+import { supportedChainIds } from '../utils/exports.js';
 
-const supportedChainIds = new Set([...getDAv2Chains(false), ...getDAv2Chains(true)].map((c) => c.chainId));
-function useWalletPaymentOptions({ trpc, address, usdRequired, destChainId, preferredChains, preferredTokens, log, }) {
+/** Wallet payment options. User picks one. */
+function useWalletPaymentOptions({ trpc, address, usdRequired, destChainId, preferredChains, preferredTokens, isDepositFlow, log, }) {
     const [options, setOptions] = useState(null);
     const [isLoading, setIsLoading] = useState(false);
     useEffect(() => {
         const refreshWalletPaymentOptions = async () => {
-            if (!address || !usdRequired || !destChainId)
+            if (address == null || usdRequired == null || destChainId == null)
                 return;
             setOptions(null);
             setIsLoading(true);
             try {
                 const newOptions = await trpc.getWalletPaymentOptions.query({
                     payerAddress: address,
-                    usdRequired,
+                    // API expects undefined for deposit flow.
+                    usdRequired: isDepositFlow ? undefined : usdRequired,
                     destChainId,
                     preferredChains,
                     preferredTokens,
                 });
-                // Filter out options we don't support yet.
+                // Filter out chains we don't support yet.
                 const isSupported = (o) => supportedChainIds.has(o.balance.token.chainId);
                 const filteredOptions = newOptions.filter(isSupported);
                 if (filteredOptions.length < newOptions.length) {
@@ -34,10 +35,10 @@ function useWalletPaymentOptions({ trpc, address, usdRequired, destChainId, pref
                 setIsLoading(false);
             }
         };
-        if (address && usdRequired != null && destChainId) {
+        if (address != null && usdRequired != null && destChainId != null) {
             refreshWalletPaymentOptions();
         }
-    }, [address, usdRequired, destChainId]);
+    }, [address, usdRequired, destChainId, isDepositFlow]);
     return {
         options,
         isLoading,

package/build/src/hooks/useWalletPaymentOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"useWalletPaymentOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"useWalletPaymentOptions.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/index.js

@@ -7,5 +7,5 @@ export { useModal as useDaimoPayModal } from './hooks/useModal.js';
 export { default as Avatar } from './components/Common/Avatar/index.js';
 export { default as ChainIcon } from './components/Common/Chain/index.js';
 export { wallets } from './wallets/index.js';
-export { daimoPayVersion, generatePayId } from './utils/exports.js';
+export { daimoPayVersion, generatePayId, supportedChainIds } from './utils/exports.js';
 //# sourceMappingURL=index.js.map

package/build/src/utils/exports.js

@@ -1,4 +1,5 @@
 import { writeDaimoPayOrderID } from '@daimo/common';
+import { getDAv2Chains } from '@daimo/contract';
 import { bytesToBigInt } from 'viem';
 import packageJson from '../../package.json.js';
 
@@ -9,6 +10,8 @@ function generatePayId() {
     const id = bytesToBigInt(crypto.getRandomValues(new Uint8Array(32)));
     return writeDaimoPayOrderID(id);
 }
+/** Chain ids supported by Daimo Pay. */
+const supportedChainIds = new Set([...getDAv2Chains(false), ...getDAv2Chains(true)].map((c) => c.chainId));
 
-export { daimoPayVersion, generatePayId };
+export { daimoPayVersion, generatePayId, supportedChainIds };
 //# sourceMappingURL=exports.js.map

package/build/src/utils/exports.js.map

@@ -1 +1 @@
-{"version":3,"file":"exports.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}
+{"version":3,"file":"exports.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}

package/build/src/utils/format.js

@@ -0,0 +1,83 @@
+import { formatUnits } from 'viem';
+
+const USD_DECIMALS = 2;
+/**
+ * Round a number to a given number of decimal places
+ *
+ * @param round - The rounding strategy to use:
+ * - "up": Always rounds up to the next decimal place (ceiling)
+ * - "down": Always rounds down to the previous decimal place (floor)
+ * - "nearest": Rounds to the nearest decimal place (standard rounding)
+ */
+function roundDecimals(value, decimals, round) {
+    const factor = 10 ** decimals;
+    const multiplied = value * factor;
+    let rounded;
+    if (round === "up") {
+        rounded = Math.ceil(multiplied);
+    }
+    else if (round === "down") {
+        rounded = Math.floor(multiplied);
+    }
+    else {
+        rounded = Math.round(multiplied);
+    }
+    return (rounded / factor).toFixed(decimals);
+}
+/**
+ * Format a number as a USD amount
+ *
+ * @param usd - The USD amount to format
+ * @param round - The rounding strategy to use ("up", "down", or "nearest")
+ * @returns The formatted USD amount
+ */
+function formatUsd(usd, round = "down") {
+    return new Intl.NumberFormat("en-US", {
+        style: "currency",
+        currency: "USD",
+    }).format(Number(roundUsd(usd, round)));
+}
+/**
+ * Round a USD amount to `USD_DECIMALS` precision
+ */
+function roundUsd(usd, round = "down") {
+    return roundDecimals(usd, USD_DECIMALS, round);
+}
+/**
+ * Round a token amount to `displayDecimals` precision
+ */
+function roundTokenAmount(amount, token, round = "down") {
+    return roundDecimals(Number(formatUnits(BigInt(amount), token.decimals)), token.displayDecimals, round);
+}
+/**
+ * Round a token amount in units to `displayDecimals` precision
+ */
+function roundTokenAmountUnits(amountUnits, token, round = "down") {
+    return roundDecimals(amountUnits, token.displayDecimals, round);
+}
+/**
+ * Convert a USD amount to a token amount with `displayDecimals` precision
+ *
+ * @param usd - The USD amount to convert
+ * @param token - The token to convert to
+ * @param round - The rounding strategy to use ("up", "down", or "nearest")
+ * @returns The token amount
+ */
+function usdToRoundedTokenAmount(usd, token, round = "down") {
+    return roundTokenAmountUnits(usd / token.usd, token, round);
+}
+/**
+ * Convert a token amount to a USD amount with `USD_DECIMALS` precision
+ *
+ * @param amount - The token amount to convert
+ * @param token - The token to convert from
+ * @param round - The rounding strategy to use ("up", "down", or "nearest")
+ * @returns The formatted USD amount
+ */
+function tokenAmountToRoundedUsd(amount, token, round = "nearest") {
+    const amountUnits = formatUnits(BigInt(amount), token.decimals);
+    return roundUsd(Number(amountUnits) * token.usd, round);
+}
+
+export { USD_DECIMALS, formatUsd, roundDecimals, roundTokenAmount, roundTokenAmountUnits, roundUsd, tokenAmountToRoundedUsd, usdToRoundedTokenAmount };
+//# sourceMappingURL=format.js.map

package/build/src/utils/format.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"format.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/src/utils/validateInput.js

@@ -0,0 +1,36 @@
+/**
+ * Returns true if the value is a valid number.
+ * @param value The value to validate.
+ * @param maxDecimals The maximum number of decimal places.
+ * @returns True if the value is a valid number, false otherwise.
+ */
+function isValidNumber(value, maxDecimals) {
+    if (value.length === 0) {
+        return false;
+    }
+    // Test that the value is digits, followed by an optional decimal, followed
+    // by more digits
+    const match = /^\d*\.?(\d*)$/.exec(value);
+    if (match == null)
+        return false;
+    // Check that the number of digits after the decimal is less than or equal to
+    // maxDecimals
+    return maxDecimals == null || match[1].length <= maxDecimals;
+}
+/**
+ * Sanitize a number input.
+ * - Remove all non-numeric and non-decimal characters
+ * - If the value is empty, return "0"
+ * - Parse into a number
+ * @param value The value to sanitize.
+ * @returns The sanitized value.
+ */
+function sanitizeNumber(value) {
+    const cleaned = value.replace(/[^0-9.]/g, "");
+    if (!cleaned || cleaned === "." || !/^\d*\.?\d*$/.test(cleaned))
+        return "0";
+    return cleaned.startsWith(".") ? `0${cleaned}` : cleaned;
+}
+
+export { isValidNumber, sanitizeNumber };
+//# sourceMappingURL=validateInput.js.map

package/build/src/utils/validateInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validateInput.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@daimo/pay",
   "private": false,
-  "version": "1.1.4",
+  "version": "1.2.0",
   "author": "Daimo",
   "homepage": "https://pay.daimo.com",
   "license": "BSD-2-Clause license",
@@ -40,8 +40,8 @@
     "crypto"
   ],
   "dependencies": {
-    "@daimo/common": "0.3.18",
-    "@daimo/contract": "0.3.18",
+    "@daimo/common": "1.1.1",
+    "@daimo/contract": "1.1.1",
     "@solana/wallet-adapter-base": "^0.9.23",
     "@solana/wallet-adapter-react": "^0.15.35",
     "@solana/web3.js": "^1.95.4",
@@ -67,7 +67,6 @@
   },
   "devDependencies": {
     "@rollup/plugin-json": "^6.1.0",
-    "@rollup/plugin-node-resolve": "^13.1.3",
     "@types/node": "^20.14.12",
     "@types/qrcode": "^1.4.2",
     "@types/react": "^18.2.47",