@funkit/connect 3.3.0 → 3.4.1

package/dist/domains/checkoutFees.d.ts

@@ -7,11 +7,14 @@ interface BaseCheckoutFees {
     marketMakerFeeUsd: number;
     liquidityProviderFeePercentage: number;
     totalFeesUsd: number;
-    totalFeesToken: number;
+    /** does not include the gas fee since it can be in a
+     * different token than the source token */
+    totalFeesTokenWithoutGas: number;
 }
 interface WalletCheckoutFees extends BaseCheckoutFees {
     paymentMethod: PaymentMethod.ACCOUNT_BALANCE;
     eoaWalletFeeToken: number;
+    nativeCurrencySymbol: string;
     eoaWalletFeeUsd: number;
 }
 interface CardCheckoutFees extends BaseCheckoutFees {
@@ -25,7 +28,6 @@ interface BrokerageCheckoutFees extends BaseCheckoutFees {
     meshCostUsd: number;
 }
 export type CheckoutFees = WalletCheckoutFees | CardCheckoutFees | BrokerageCheckoutFees;
-export declare const GAS_ESTIMATE_MULTIPLER = 1.2;
 interface EvaluateFeeBreakdownItem {
     baseQuote: CheckoutQuoteResponse;
     selectedSourceAssetInfo: FunkitActiveCheckoutItem['selectedSourceAssetInfo'];

package/dist/domains/clientMetadata.d.ts

@@ -0,0 +1,37 @@
+/**
+ * clientMetadata is a type for FE to store historical state of a checkoutItem
+ * It should be mostly derived by backend data but currently we don't have capacity to do it.
+ *
+ * Make sure it is SERIALIZABLE and BACKWARD COMPATIBLE!!
+ */
+import { FunkitActiveCheckoutItem, FunkitCheckoutConfig } from '~/providers/FunkitCheckoutContext';
+/** Historical Checkout Configuration stored in the server
+ * This is similar to FunkitCheckoutConfig but with some fields changed to serializable types
+ * */
+export type ServerCheckoutConfig = Omit<FunkitCheckoutConfig, 'generateActionsParams'> & {
+    generateActionsParams?: string;
+};
+/**
+ * HistoricalCheckoutItem stored in the server
+ *
+ * Make sure it is SERIALIZABLE and BACKWARD COMPATIBLE!!
+ **/
+export interface HistoricalCheckoutItem {
+    id: FunkitActiveCheckoutItem['id'];
+    startTimestampMs: FunkitActiveCheckoutItem['startTimestampMs'];
+    draftDollarValue: FunkitActiveCheckoutItem['draftDollarValue'];
+    finalDollarValue: FunkitActiveCheckoutItem['finalDollarValue'];
+    latestQuote: FunkitActiveCheckoutItem['latestQuote'];
+    depositAddress: FunkitActiveCheckoutItem['depositAddress'];
+    initSettings: {
+        config: ServerCheckoutConfig;
+    };
+    selectedSourceAssetInfo: FunkitActiveCheckoutItem['selectedSourceAssetInfo'];
+    selectedPaymentMethodInfo: FunkitActiveCheckoutItem['selectedPaymentMethodInfo'];
+}
+/**
+ * Sanitizes checkoutItem to generate a clientMetadata object to be saved in backend.
+ * Ensures that no react components get sent to backend and the object isn't too big as well.
+ */
+export declare function generateClientMetadataForBackend(checkoutItem: FunkitActiveCheckoutItem): HistoricalCheckoutItem;
+export declare function generateClientMetadataForTokenTransfer(): HistoricalCheckoutItem;

package/dist/domains/paymentMethods.d.ts

@@ -1,6 +1,6 @@
 import { PreviewTransferResult } from '@funkit/api-base';
 import { LinkPayload } from '@meshconnect/web-link-sdk';
-import { ReactNode } from 'react';
+import { MeshExchanges } from '~/consts/mesh';
 /** Supported payment methods in FunkitConnect. **/
 export declare enum PaymentMethod {
     /** Moonpay - Credit / Debit Card **/
@@ -17,33 +17,44 @@ type PaymentMethodInfoMeta = LinkPayload & {
     previewTransferResult?: PreviewTransferResult;
 };
 /** Full payment method information used in frontend during payment flows. **/
-export interface PaymentMethodInfo {
+interface PaymentMethodInfoBase {
     paymentMethod: PaymentMethod;
     title: string;
-    titleIcon: (size: number) => ReactNode;
     description: string;
-    descriptionIcon?: ReactNode;
     meta: PaymentMethodInfoMeta;
 }
-export interface PaymentMethodCardInfo extends PaymentMethodInfo {
+export interface PaymentMethodCardInfo extends PaymentMethodInfoBase {
     paymentMethod: PaymentMethod.CARD;
 }
-export interface PaymentMethodBrokerageInfo extends PaymentMethodInfo {
+export interface PaymentMethodBrokerageInfo extends PaymentMethodInfoBase {
     paymentMethod: PaymentMethod.BROKERAGE;
 }
-export interface PaymentMethodAccountInfo extends PaymentMethodInfo {
+export interface PaymentMethodAccountInfo extends PaymentMethodInfoBase {
     paymentMethod: PaymentMethod.ACCOUNT_BALANCE;
 }
-export interface PaymentMethodTransferTokenInfo extends PaymentMethodInfo {
+export interface PaymentMethodTokenTransferInfo extends PaymentMethodInfoBase {
     paymentMethod: PaymentMethod.TOKEN_TRANSFER;
 }
-/** Shouldn't be used generally. Will most likely be removed once checkoutItem usage is reduced */
-export declare const getPartialPaymentMethodInfo: <T extends PaymentMethodInfo>(paymentMethod: T["paymentMethod"]) => {
-    paymentMethod: T["paymentMethod"];
-    title: string;
-    titleIcon: () => null;
-    description: string;
-    descriptionIcon: null;
-    meta: {};
-};
+export type PaymentMethodInfo = PaymentMethodCardInfo | PaymentMethodBrokerageInfo | PaymentMethodAccountInfo | PaymentMethodTokenTransferInfo;
+interface CardPaymentMethodParams {
+    paymentMethod: PaymentMethod.CARD;
+    /** We also store client's customization in our database :( */
+    titleCustomization: string;
+}
+interface AccountPaymentMethodParams {
+    paymentMethod: PaymentMethod.ACCOUNT_BALANCE;
+    walletAddress: string;
+}
+interface BrokeragePaymentMethodParams {
+    paymentMethod: PaymentMethod.BROKERAGE;
+    meshMeta: LinkPayload;
+    brokerage: MeshExchanges;
+}
+interface TokenTransferPaymentMethodParams {
+    paymentMethod: PaymentMethod.TOKEN_TRANSFER;
+}
+export declare function createPaymentMethodInfo(params: CardPaymentMethodParams): PaymentMethodCardInfo;
+export declare function createPaymentMethodInfo(params: AccountPaymentMethodParams): PaymentMethodAccountInfo;
+export declare function createPaymentMethodInfo(params: BrokeragePaymentMethodParams): PaymentMethodBrokerageInfo;
+export declare function createPaymentMethodInfo(params: TokenTransferPaymentMethodParams): PaymentMethodTokenTransferInfo;
 export {};

package/dist/domains/quote.d.ts

@@ -0,0 +1,31 @@
+import { CheckoutQuoteResponse } from '@funkit/api-base';
+import { Address } from 'viem';
+import { Config } from 'wagmi';
+import { FunkitActiveCheckoutItem } from '~/providers/FunkitCheckoutContext';
+import { CheckoutFees } from './checkoutFees';
+import { PaymentMethodInfo } from './paymentMethods';
+export type FunkitCheckoutQuoteResult = {
+    baseQuote: CheckoutQuoteResponse;
+    finalTimeEstimationMs: number;
+    finalPaymentTokenAmount: string;
+    finalTotalUsd: string;
+    finalFeesBreakdown: CheckoutFees;
+};
+export declare function getCheckoutBaseQuote(checkoutItem: FunkitActiveCheckoutItem, userId: string, walletAddress: Address, apiKey: string, sponsorInitialTransferGasLimit: number, wagmiConfig: Config): Promise<CheckoutQuoteResponse>;
+export declare function getQuoteFinalEstimation(baseQuote: CheckoutQuoteResponse, checkoutItem: FunkitActiveCheckoutItem, newPaymentMethodInfo: PaymentMethodInfo, wagmiConfig: Config, apiKey: string, isWeb3Login: boolean): Promise<FunkitCheckoutQuoteResult>;
+export declare function getAvailableAssetAmount(checkoutItem: FunkitActiveCheckoutItem, newPaymentMethodInfo: PaymentMethodInfo, finalEstimation: FunkitCheckoutQuoteResult, wagmiConfig: Config, walletAddress: Address): Promise<number | undefined>;
+export interface CheckoutQuoteParams {
+    checkoutItem: FunkitActiveCheckoutItem;
+    userId: string;
+    walletAddress: Address;
+    apiKey: string;
+    sponsorInitialTransferGasLimit: number;
+    newPaymentMethodInfo: PaymentMethodInfo;
+    wagmiConfig: Config;
+    isWeb3Login: boolean;
+}
+export declare function getQuoteAndEstimation({ checkoutItem, userId, walletAddress, apiKey, sponsorInitialTransferGasLimit, newPaymentMethodInfo, wagmiConfig, isWeb3Login, }: CheckoutQuoteParams): Promise<{
+    baseQuote: CheckoutQuoteResponse;
+    finalEstimation: FunkitCheckoutQuoteResult;
+    avialableAssetAmount: number | undefined;
+}>;

package/dist/hooks/useCheckoutAccountBalanceTransfer.d.ts

@@ -1,4 +1,4 @@
-export declare function useCheckoutAccountBalanceTransfer(checkoutId: string): {
+export declare function useCheckoutAccountBalanceTransfer(): {
     generateCheckoutTransferOpItems: (toAddress: string, tokenAmount: number | string) => Promise<{
         rFunWallet: import("@funkit/core").FunWallet;
         rFunWalletAuth: import("@funkit/core").Auth;

package/dist/hooks/useCheckoutQuoteNotification.d.ts

@@ -1,4 +1,4 @@
-export declare function useCheckoutQuoteNotification(checkoutId: string): {
+export declare function useCheckoutQuoteNotification(): {
     readonly quoteNotification: {
         readonly messageType: "error";
         readonly quoteMessage: string;

package/dist/hooks/useCheckoutTransferDepositAddress.d.ts

@@ -1,2 +1,3 @@
 import { FunAddress } from '@funkit/api-base';
-export declare const useCheckoutTransferDepositAddress: (userId: string | undefined, recipientAddress: FunAddress) => `0x${string}` | undefined;
+import { FunkitActiveCheckoutItem } from '~/providers/FunkitCheckoutContext';
+export declare const useCheckoutTransferDepositAddress: (checkoutItem: FunkitActiveCheckoutItem | null, userId: string | undefined, recipientAddr: FunAddress) => `0x${string}` | undefined;

package/dist/hooks/useEnabledTokenTransferChainTokens.d.ts

@@ -0,0 +1,2 @@
+import { TokenTransferSourceChainsAndAssets } from '~/modals/CheckoutModal/TransferToken';
+export declare function useEnabledTokenTransferChainTokens(): TokenTransferSourceChainsAndAssets;

package/dist/hooks/useIsCheckoutRisky.d.ts

@@ -0,0 +1,2 @@
+import { FunkitActiveCheckoutItem } from '~/providers/FunkitCheckoutContext';
+export declare const useIsCheckoutRisky: (checkoutItem: FunkitActiveCheckoutItem | null) => import("@tanstack/react-query").UseQueryResult<boolean, Error>;

package/dist/hooks/useMesh.d.ts

@@ -1,41 +1,24 @@
 import { LinkPayload } from '@meshconnect/web-link-sdk';
 import React, { ReactNode } from 'react';
 import { FunSelectOption } from '../components/FunSelect/FunSelect';
-import { PaymentMethodBrokerageInfo } from '../domains/paymentMethods';
 import { MeshExchanges } from '../utils/mesh';
 export declare const MESH_EXCHANGE_ICON_MAP: Partial<Record<MeshExchanges, (size: number) => ReactNode>>;
 export declare function getExchangeIcon(exchange: MeshExchanges, size: number): React.ReactNode;
 export declare const useSupportedExchanges: () => MeshExchanges[];
 export declare function getExchangeName(exchange: MeshExchanges): string;
-export declare const preparePaymentInfo: (meshMeta: LinkPayload, brokerage: MeshExchanges) => PaymentMethodBrokerageInfo;
 export declare const useMeshExchanges: ({ fullInfo, iconSize, }: {
     fullInfo?: boolean;
     iconSize?: number;
 }) => {
     options: FunSelectOption[];
 };
-/**
- * Fetches mesh-related network information across all chains, given an exchange
- * @param exchange The mesh exchange user is currently connected with
- */
-export declare const useMeshNetworkInfo: (exchange: MeshExchanges) => {
-    fetchInfo: () => Promise<import("@funkit/api-base").IntegrationNetworkInfo[]>;
-};
 /**
  * Fetches mesh-related network information based on the active chain user is logged in on, given an exchange
  * @param exchange The mesh exchange user is currently connected with
  */
-export declare const useMeshActiveNetworkInfo: (exchange?: MeshExchanges) => {
-    meshNetworkInfo: {
-        meshSupportedTokens: string[];
-        meshNetworkId: string | null;
-    };
-    fetchInfo: (chainId?: string) => Promise<{
-        meshSupportedTokens: string[];
-        meshNetworkId: string | undefined;
-    } | {
-        meshSupportedTokens: string[];
-        meshNetworkId: string | null;
-    }>;
-};
+export declare const useMeshActiveNetworkInfo: (chainId: string | undefined, exchange: MeshExchanges | undefined) => {
+    meshSupportedTokens: string[];
+    meshNetworkId: string | undefined;
+} | null;
+export declare function useMeshIntegrations(): import("@funkit/api-base").TransferIntegration[] | undefined;
 export declare function useMeshAccountHoldings(targetChain: string, connection: LinkPayload | null): import("@tanstack/react-query").UseQueryResult<import("../utils/assets").AssetHoldingsMap, Error>;

package/dist/hooks/usePaymentMethodIcon.d.ts

@@ -0,0 +1,22 @@
+import React, { ReactNode } from 'react';
+import { PaymentMethod, PaymentMethodInfo } from '../domains/paymentMethods';
+export declare const PAYMENT_METHOD_ICONS: {
+    brokerage: (size: number) => React.JSX.Element;
+    card: (size: number) => React.JSX.Element;
+    token_transfer: (size: number) => React.JSX.Element;
+};
+/**
+  Reference ENG-716
+  * web2 users -> social icon
+  * EOA wallet users
+    * detect connectors and show builtin icon in SDK
+    * if no SDK icons available, show icon from wagmi
+  * otherwise show fallback icon EVM
+*/
+export declare function usePaymentMethodIcon(paymentMethod: PaymentMethod, iconSize?: number): string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element | null | undefined;
+interface PaymentMethodInfoLabel {
+    text: string;
+    icon: ReactNode;
+}
+export declare const usePaymentMethodInfoLabel: (methodInfo: PaymentMethodInfo, iconSize?: number) => PaymentMethodInfoLabel;
+export {};

package/dist/hooks/useUsableWalletAssetsForCheckout.d.ts

@@ -1,4 +1,5 @@
 import { KnownAssetBalanceInfo } from '../providers/GeneralWalletProvider';
-export declare function useUsableWalletAssetsForCheckout(checkoutId: string): {
+export interface WalletAssets {
     [assetKey: string]: KnownAssetBalanceInfo;
-} | undefined;
+}
+export declare function useUsableWalletAssetsForCheckout(): WalletAssets | undefined;