@spicenet-io/spiceflow-ui 4.9.1 → 4.9.3-anydeposit.0

package/README.md

@@ -108,6 +108,49 @@ it becomes a `protocol` everyone can name.
 
 ## Development
 
+### Rollup balance pricing
+
+Rollup USD values use the host-configured RPC provider's pricing capability when the balance API has no valid value. The built-in account panel and withdrawal modal enable this while open; custom `useSpiceAssets` consumers can opt in with `priceEnabled`. Quantities arrive independently. Lookups follow receipt mappings, prefer `nativeChainId`, and fall back to other supported chains with a configured Alchemy endpoint. Explicit account `tokenPrices` overrides still take precedence over provider quotes.
+
+Wallet discovery and rollup balances share a one-minute quote cache. Pricing polls only while the view is open and the page is visible. A failed refresh can retain a marked stale quote for up to five minutes; an unavailable quote displays `—`. No extra key, internal RPC, or symbol-based ERC-20 price fallback is used.
+
+### Direct withdrawal in a custom balance row
+
+`useSpiceDirectWithdraw()` uses the same embedded-wallet transfer and fee path as the account panel's direct Withdraw buttons. It selects the connected external wallet as recipient, exposes `canWithdraw` and `state`, and rejects duplicate submissions while pending. Pass the raw `bigint` balance to `withdraw({ tokenAddress, chainId, balance })` and refresh the host's balance after it resolves. Rejections are available as `state.message` for the host to render.
+
+Custom account rows accept React content in `displayValue`, so a host can render its own button with that controller. Set the row's `asset: { tokenAddress, chainId }` when it represents an on-chain balance; the account panel then omits that token from discovered idle balances. Existing string values continue to work.
+
+### Withdraw from an account balance
+
+`AccountDisplay.onWithdrawClick` receives the rollup receipt-token ID when a
+user clicks Withdraw on an idle rollup balance. The main Withdraw button calls
+it without an ID. Pass the ID to `SpiceWithdraw.initialSourceAssetId` to open
+the existing modal with that asset selected; the user chooses the destination
+network inside the modal. Existing callbacks that take no arguments continue
+to work.
+
+```tsx
+const [withdrawOpen, setWithdrawOpen] = useState(false);
+const [withdrawAssetId, setWithdrawAssetId] = useState<string>();
+
+<AccountDisplay
+  onWithdrawClick={(receiptTokenId) => {
+    setWithdrawAssetId(receiptTokenId);
+    setWithdrawOpen(true);
+  }}
+/>
+<SpiceWithdraw
+  isOpen={withdrawOpen}
+  onClose={() => setWithdrawOpen(false)}
+  initialSourceAssetId={withdrawAssetId}
+  buildSpicenetBatch={buildSpicenetWithdrawalBatch}
+/>
+```
+
+Keep the integration's existing withdrawal batch builder and callbacks.
+`initialSourceAssetId` selects a current balance by ID; it does not supply a
+cached balance or change the receipt's supported withdrawal routes.
+
 ### Fee-Charging Intent Flows
 
 - `SpiceSupply` and `SpicePay` are fee-charging intent-execution flows and must surface fee estimation before enabling submission.

package/dist/auth-privy.js

@@ -1,2 +1,2 @@
 "use client";
-import{P as g}from"./privy-C_1pWb8P.js";import"react/jsx-runtime";import"react";import"@spicenet-io/spiceflow-core";import"viem";import"viem/actions";import"@privy-io/react-auth";import"wagmi";import"@tanstack/react-query";export{g as PrivyLogin};
+import{P as g}from"./privy-BIH6VVaM.js";import"react/jsx-runtime";import"react";import"@spicenet-io/spiceflow-core";import"viem";import"viem/actions";import"@privy-io/react-auth";import"wagmi";import"@tanstack/react-query";export{g as PrivyLogin};

package/dist/components/AccountDisplay/parts/AccountIdleBalances.d.ts

@@ -1,11 +1,7 @@
 import React from "react";
 import { SpiceAsset } from "../types";
 import type { ResolvedDarkPalette } from "../../../utils/theme";
-export interface DirectWithdrawState {
-    key: string;
-    step: "pending" | "error";
-    message?: string;
-}
+import type { DirectWithdrawState } from "../../../hooks/useDirectWithdraw";
 interface AccountIdleBalancesProps {
     spiceAssets: SpiceAsset[];
     loading: boolean;
@@ -14,6 +10,7 @@ interface AccountIdleBalancesProps {
     canDirectWithdraw?: boolean;
     onDirectWithdraw?: (asset: SpiceAsset) => void;
     directWithdrawState?: DirectWithdrawState | null;
+    onWithdrawClick?: (receiptTokenId?: string) => void;
 }
 export declare const AccountIdleBalances: React.NamedExoticComponent<AccountIdleBalancesProps>;
 export {};

package/dist/components/AccountDisplay/parts/AccountPanel.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import { SpiceAsset, CustomSection, AccountNotice } from "../types";
 import { VerifiedPendingDeposit } from "../../../hooks/usePendingDeposit";
 import type { ResolvedDarkPalette } from "../../../utils/theme";
-import { type DirectWithdrawState } from "./AccountIdleBalances";
+import type { DirectWithdrawState } from "../../../hooks/useDirectWithdraw";
 interface AccountPanelProps {
     appName: string;
     status: "active" | "inactive";
@@ -17,7 +17,7 @@ interface AccountPanelProps {
     customSections: CustomSection[];
     notice?: AccountNotice | null;
     onDepositClick?: () => void;
-    onWithdrawClick?: () => void;
+    onWithdrawClick?: (receiptTokenId?: string) => void;
     depositDisabled?: boolean;
     onCompleteDeposit?: (deposit: VerifiedPendingDeposit) => void;
     primaryColor?: string;

package/dist/components/AccountDisplay/types.d.ts

@@ -5,7 +5,8 @@ export interface CustomSectionItem {
     tokenSymbol: string;
     tokenLogoURI?: string;
     label: string;
-    displayValue: string;
+    displayValue: React.ReactNode;
+    asset?: Pick<SpiceAsset, "tokenAddress" | "chainId">;
     valueColor?: "green" | "red" | "default";
 }
 export interface CustomSection {
@@ -24,7 +25,9 @@ export interface SpiceAsset {
     balance: string;
     balanceFormatted: number;
     usdValue: number;
+    priceStatus?: "fresh" | "stale" | "unavailable";
     logoURI?: string;
+    receiptTokenId?: string;
     directWithdraw?: boolean;
 }
 export interface BreakdownLabel {
@@ -48,7 +51,7 @@ export interface AccountDisplayProps {
     dark?: boolean;
     onDepositSuccess?: () => void;
     onDepositClick?: () => void;
-    onWithdrawClick?: () => void;
+    onWithdrawClick?: (receiptTokenId?: string) => void;
     onCompleteDeposit?: (deposit: VerifiedPendingDeposit) => void;
     showModeToggle?: boolean;
     defaultMode?: "7702" | "non7702";

package/dist/components/SpiceDeposit/lib/escrowCredit.d.ts

@@ -0,0 +1,2 @@
+import type { Asset } from "../../../types/assets";
+export declare function isEscrowCreditable(asset: Pick<Asset, "address" | "chainId" | "isNative">): boolean;

package/dist/components/SpiceSupply/lib/buildBatches.d.ts

@@ -7,6 +7,7 @@ import type { ResolvedExactOutputSwap } from "../../../utils/swapQuotes";
 import type { ExecutionOptions } from "../../../hooks/useSpiceExecution";
 import type { FeeEstimateSummary } from "@spicenet-io/spiceflow-core";
 type EstimateFn = (chainBatches: ChainBatch[], tokenAddress: string, tokenTransferAmount: bigint, options?: ExecutionOptions) => Promise<FeeEstimateSummary>;
+export declare function isExternalInPlacePaySource(selectedAsset: SelectedAsset | null, isNon7702: boolean, resolvedChainId: number): boolean;
 export declare function stripSpicenetFundingBatches(batches: ChainBatch[]): ChainBatch[];
 export declare function scaleTokenAmount(amount: bigint, fromDecimals: number, toDecimals: number): bigint;
 export interface BatchBuilderContext {
@@ -26,6 +27,7 @@ export interface BatchBuilderContext {
     selectedAsset: SelectedAsset | null;
     needsSwap: boolean;
     resolvedSwap: ResolvedSwap | null;
+    resolveInputSwap?: (amountIn: bigint) => Promise<ResolvedSwap>;
     exactOutputSwap: ResolvedExactOutputSwap | null;
     quoteAmountOut: bigint | null;
     resolvedTokenIn: Address | null;

package/dist/components/SpiceSupply/lib/executors.d.ts

@@ -18,6 +18,7 @@ export type ExecutorContext = {
     currentPaymentAmount: string;
     isInsufficientBalance: boolean;
     isPayMode: boolean;
+    isFeeInclusiveInput?: boolean;
     isNon7702: boolean;
     isSourceDestToken: boolean;
     needsSwap: boolean;

package/dist/components/SpiceSupply/lib/feePreview.d.ts

@@ -49,6 +49,7 @@ export interface FeePreviewContext {
     signal?: AbortSignal;
     selectedAsset: SelectedAsset | null;
     isPayMode: boolean;
+    isFeeInclusiveInput?: boolean;
     parsedAmount: number;
     needsSwap: boolean;
     exactOutputSwap: ResolvedExactOutputSwap | null;

package/dist/components/SpiceWithdraw/lib/helpers.d.ts

@@ -2,5 +2,5 @@ import type { ChainBatch } from "../../../types/authorization";
 export declare function normalizeTokenLabel(value?: string | null): string;
 export declare function formatTokenAmount(rawAmount: bigint, decimals: number): string;
 export declare function scaleAmountBetweenDecimals(amount: bigint, fromDecimals: number, toDecimals: number): bigint;
-export declare function estimateUsd(amount: number, symbol?: string): string;
+export declare function estimateUsd(amount: number, price?: number, stale?: boolean): string;
 export declare function buildWithdrawFeeEstimateKey(batches: ChainBatch[], tokenAddress?: string | null): string | null;

package/dist/components/SpiceWithdraw/parts/WithdrawBalanceCardHeader.d.ts

@@ -4,7 +4,6 @@ interface WithdrawBalanceCardHeaderProps {
     label: string;
     spiceAssetsLoading: boolean;
     totalSelectedBalance: number;
-    onOpenBalancePopover: (anchor: HTMLElement | null) => void;
     dark: boolean;
     dk: ResolvedDarkPalette;
 }

package/dist/hooks/index.d.ts

@@ -6,6 +6,8 @@ export type { UseWalletReturn, WalletState, WalletActions } from "./useWallet";
 export { useSpiceAssets } from "./useSpiceAssets";
 export type { UseSpiceAssetsConfig, UseSpiceAssetsReturn, } from "./useSpiceAssets";
 export { useSpiceExecution } from "./useSpiceExecution";
+export { useDirectWithdraw as useSpiceDirectWithdraw } from "./useDirectWithdraw";
+export type { DirectWithdrawParams, DirectWithdrawState, } from "./useDirectWithdraw";
 export type { ExecutionProgress, ExecutionStep, ExecutionOptions, OnProgress, } from "./useSpiceExecution";
 export { useLockDuration } from "./useLockDuration";
 export type { UseLockDurationReturn } from "./useLockDuration";

package/dist/hooks/useDirectWithdraw.d.ts

@@ -4,9 +4,15 @@ export interface DirectWithdrawParams {
     tokenAddress: Address | string;
     chainId: number;
     balance: bigint;
-    recipient: Address | string;
     onProgress?: (progress: ExecutionProgress) => void;
 }
+export interface DirectWithdrawState {
+    key: string;
+    step: "pending" | "error";
+    message?: string;
+}
 export declare function useDirectWithdraw(): {
-    withdraw: ({ tokenAddress, chainId, balance, recipient, onProgress, }: DirectWithdrawParams) => Promise<string>;
+    withdraw: ({ tokenAddress, chainId, balance, onProgress, }: DirectWithdrawParams) => Promise<string>;
+    canWithdraw: boolean;
+    state: DirectWithdrawState | null;
 };

package/dist/hooks/useIsUserWhitelisted.d.ts

@@ -43,8 +43,8 @@ export declare function useIsUserWhitelisted({ walletAddress, campaignId, campai
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
-    fetchStatus: import("@tanstack/query-core").FetchStatus;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
     promise: Promise<PartnerWhitelistCheckResponse>;
     isWhitelisted: boolean;
     whitelistCheck: PartnerWhitelistCheckResponse | undefined;
@@ -82,8 +82,8 @@ export declare function useIsUserWhitelisted({ walletAddress, campaignId, campai
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
-    fetchStatus: import("@tanstack/query-core").FetchStatus;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
     promise: Promise<PartnerWhitelistCheckResponse>;
     isWhitelisted: boolean;
     whitelistCheck: PartnerWhitelistCheckResponse | undefined;
@@ -121,8 +121,8 @@ export declare function useIsUserWhitelisted({ walletAddress, campaignId, campai
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
-    fetchStatus: import("@tanstack/query-core").FetchStatus;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
     promise: Promise<PartnerWhitelistCheckResponse>;
     isWhitelisted: boolean;
     whitelistCheck: PartnerWhitelistCheckResponse | undefined;
@@ -160,8 +160,8 @@ export declare function useIsUserWhitelisted({ walletAddress, campaignId, campai
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
-    fetchStatus: import("@tanstack/query-core").FetchStatus;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
     promise: Promise<PartnerWhitelistCheckResponse>;
     isWhitelisted: boolean;
     whitelistCheck: PartnerWhitelistCheckResponse | undefined;
@@ -199,8 +199,8 @@ export declare function useIsUserWhitelisted({ walletAddress, campaignId, campai
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
-    fetchStatus: import("@tanstack/query-core").FetchStatus;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
     promise: Promise<PartnerWhitelistCheckResponse>;
     isWhitelisted: boolean;
     whitelistCheck: PartnerWhitelistCheckResponse | undefined;
@@ -238,8 +238,8 @@ export declare function useIsUserWhitelisted({ walletAddress, campaignId, campai
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
-    fetchStatus: import("@tanstack/query-core").FetchStatus;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<PartnerWhitelistCheckResponse, Error>>;
+    fetchStatus: import("@tanstack/react-query").FetchStatus;
     promise: Promise<PartnerWhitelistCheckResponse>;
     isWhitelisted: boolean;
     whitelistCheck: PartnerWhitelistCheckResponse | undefined;

package/dist/hooks/useSpiceAssets.d.ts

@@ -5,6 +5,7 @@ export interface UseSpiceAssetsConfig {
     supportedChains?: number[];
     enabled?: boolean;
     refetchInterval?: number;
+    priceEnabled?: boolean;
 }
 export interface UseSpiceAssetsReturn {
     assets: Asset[];
@@ -14,4 +15,4 @@ export interface UseSpiceAssetsReturn {
     refetch: () => Promise<void>;
     getAssetsByChain: (chainId: number) => Asset[];
 }
-export declare const useSpiceAssets: ({ address, supportedChains, enabled, refetchInterval, }: UseSpiceAssetsConfig) => UseSpiceAssetsReturn;
+export declare const useSpiceAssets: ({ address, supportedChains, enabled, refetchInterval, priceEnabled, }: UseSpiceAssetsConfig) => UseSpiceAssetsReturn;

package/dist/hooks/useSpiceRollupPrices.d.ts

@@ -0,0 +1,2 @@
+import type { Asset } from "../types/assets";
+export declare function useSpiceRollupPrices(assets: Asset[], enabled: boolean, supportedChains?: number[]): Asset[];

package/dist/hooks/useSupplyAssets.d.ts

@@ -1,9 +1,17 @@
 import { type Address } from "viem";
 import type { Asset } from "../types/assets";
+export declare function compareSupplyAssets(a: Asset & {
+    _source?: string;
+}, b: Asset & {
+    _source?: string;
+}, destToken: string, destChain: number): number;
 export declare function isSupportedSupplyAsset(asset: Pick<Asset, "address" | "chainTokens">, supportedSourceAssets?: string[]): boolean;
 export declare function isSpendableSupplyAsset(asset: Pick<Asset, "address" | "chainTokens" | "chainId"> & {
     _source?: string;
 }, destinationChainId: number, supportedSourceAssets?: string[]): boolean;
+export declare function isSpendableExternalAsset(asset: Pick<Asset, "address" | "chainTokens" | "chainId"> & {
+    _source?: string;
+}, destinationToken: Pick<DestinationToken, "address" | "chainId">, supportedSourceAssets?: string[]): boolean;
 type DestinationToken = {
     address: Address;
     decimals: number;

package/dist/hooks/useWalletBalances.d.ts

@@ -8,6 +8,7 @@ export interface UseAssetsConfig {
     fetchBalances: (address: Address, supportedChains?: number[]) => Promise<MultiChainBalances>;
     enabled?: boolean;
     refreshInterval?: number;
+    priceEnabled?: boolean;
 }
 export interface UseAssetsReturn {
     assets: Asset[];
@@ -17,4 +18,4 @@ export interface UseAssetsReturn {
     getAssetsByChain: (chainId: number) => Asset[];
     getNativeAssets: () => Asset[];
 }
-export declare const useWalletBalances: ({ address, supportedChains, fetchBalances, enabled, refreshInterval, }: UseAssetsConfig) => UseAssetsReturn;
+export declare const useWalletBalances: ({ address, supportedChains, fetchBalances, enabled, refreshInterval, priceEnabled, }: UseAssetsConfig) => UseAssetsReturn;