@funkit/connect 2.0.7 → 3.0.0-next.1

package/dist/components/FunkitProvider/FunkitCheckoutContext.d.ts

@@ -24,8 +24,8 @@ export interface FunkitCheckoutConfig {
     targetAsset: Address;
     /** The amount of wanted asset for the checkout operation. **/
     targetAssetAmount: number;
-    /** The asset unit information for the wanted asset for the checkout operation **/
-    targetAssetTicker?: string;
+    /** The ticker information of the wanted asset for the checkout operation. e.g. USDC. **/
+    targetAssetTicker: string;
     /** Timestamp (in milliseconds) after which the checkout should not be performed, and the funds will become rescuable. Min: 300000 (5 mins), Max: 3600000 (1 hour). **/
     expirationTimestampMs: number;
     /** Custom recipient address of the checkout. If specified, a different checkout flow will be executed. It is not recommended to set this unless the Fun.xyz team advises it. **/
@@ -39,8 +39,6 @@ export interface FunkitCheckoutConfig {
     iconSrc?: null | string;
     /** Title of the item being checked out. e.g. Staked Ether, XYZ Option, Solar Bond ABC **/
     checkoutItemTitle: string;
-    /** Description of the item being checked out. If not specified, it will default to blank. **/
-    checkoutItemDescription?: string;
     /** The quantity of the item being checked out. If not specified (0, null, undefined), it will default to blank. **/
     checkoutItemAmount?: number;
     /** Whether editing is skipped and disabled for checkouts with empty actionsParams. **/

package/dist/components/FunkitProvider/FunkitConfigContext.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-import { FunkitSocialLoginMethod } from '../../consts/funkit';
+import { FunkitPrioritizedLoginType, FunkitSocialLoginMethod } from '../../consts/funkit';
 import { PaymentMethod } from '../../consts/payment';
 import { BoxProps } from '../Box/Box';
 export interface FunkitTextCustomizationsConfig {
@@ -14,11 +14,10 @@ export interface FunkitTextCustomizationsConfig {
     otc: string;
 }
 export declare const DEFAULT_TEXT_CUSTOMIZATIONS: FunkitTextCustomizationsConfig;
-export declare const DEFAULT_PRIVY_APP_ID = "clnatprpv00sfmi0fv3qc185b";
 interface FunkitLoginOptionsConfig {
     web2: boolean;
     web3: boolean;
-    prioritizeWeb2Logins?: boolean;
+    prioritizedLogin: FunkitPrioritizedLoginType;
     /** Enables social logins. Each type requires configuration in your app's privy dashboard. Please ensure to do so before enabling any. **/
     web2SocialLogins: {
         [FunkitSocialLoginMethod.GOOGLE]?: boolean;
@@ -27,12 +26,6 @@ interface FunkitLoginOptionsConfig {
         [FunkitSocialLoginMethod.FARCASTER]?: boolean;
     };
 }
-interface FunkitAccountOptionsConfig {
-    /** Whether end users can deposit usdc/eth from the account modal **/
-    allowDepositing?: boolean;
-    /** Whether unknown tokens are shown in users' account balance. Default: false. **/
-    showUnknownTokens?: boolean;
-}
 interface FunkitPaymentsConfig {
     /** If available, the specified payment method will be selected by default during checkout or deposits **/
     defaultPaymentMethod?: PaymentMethod | undefined;
@@ -46,7 +39,7 @@ interface FunkitPaymentsConfig {
         optionsSecondaryGap: BoxProps['gap'];
         /** Padding of each payment method option **/
         optionsPadding: BoxProps['paddingY'];
-        /** Vertical padding of all primary buttons **/
+        /** Vertical padding of all primary & secondary buttons **/
         buttonPaddingY: BoxProps['paddingY'];
     };
     methodsConfig: {
@@ -82,26 +75,18 @@ export type FunkitConfig = {
     allowBackgroundScroll?: boolean;
     /** Text customizations across all widgets **/
     textCustomizations?: Partial<FunkitTextCustomizationsConfig>;
-    /** Privy appId for social account management. It is not recommended to replace this. **/
-    privyAppId?: string;
     /** Login modal configuration **/
-    loginModalConfig: Partial<FunkitLoginOptionsConfig>;
-    /** Account modal configuration **/
-    accountModalConfig?: Partial<FunkitAccountOptionsConfig>;
+    loginConfig: Partial<FunkitLoginOptionsConfig>;
     /** Payments configuration **/
     paymentsConfig?: Partial<FunkitPaymentsConfig>;
-    /** T&Cs font size **/
-    termsFontSize?: number;
 };
 interface FinalFunkitConfigInternal extends FunkitConfig {
     appLogoSrc: string;
     appLogoBackgroundColor: string;
     allowBackgroundScroll: boolean;
     textCustomizations: FunkitTextCustomizationsConfig;
-    loginModalConfig: FunkitLoginOptionsConfig;
-    accountModalConfig: FunkitAccountOptionsConfig;
+    loginConfig: FunkitLoginOptionsConfig;
     paymentsConfig: FunkitPaymentsConfig;
-    privyAppId: string;
 }
 export declare const FunkitConfigContext: React.Context<FunkitConfig>;
 export declare function useFunkitConfig(): FinalFunkitConfigInternal;

package/dist/components/FunkitProvider/FunkitThemeProvider.d.ts

@@ -5,10 +5,8 @@ export declare const defaultTheme: {
         accentColor: string;
         accentColorForeground: string;
         actionButtonBorder: string;
-        actionButtonSecondaryBackground: string;
         connectButtonBackground: string;
         connectButtonBackgroundError: string;
-        connectButtonInnerBackground: string;
         connectButtonText: string;
         connectButtonTextError: string;
         connectionIndicator: string;
@@ -16,56 +14,66 @@ export declare const defaultTheme: {
         generalBorder: string;
         generalBorderDim: string;
         menuItemBackground: string;
-        modalText: string;
-        modalTextDim: string;
-        modalTextSecondary: string;
-        profileAction: string;
-        profileActionHover: string;
-        profileForeground: string;
         selectedOptionBorder: string;
-        paymentOptionBorderBase: string;
-        paymentOptionBorderHover: string;
-        paymentOptionBorderActive: string;
-        paymentOptionBorderActiveHover: string;
+        paymentOptionBorderDisabled: string;
         standby: string;
+        success: string;
         loadingBase: string;
         loadingAccent: string;
+        chainIconBorder: string;
         modalBackdrop: string;
         modalBackground: string;
         modalBorder: string;
         notificationPrimary: string;
-        textPrimary: string;
-        textSecondary: string;
-        textTertiary: string;
-        textDisabled: string;
+        offBackground: string;
+        hoverState: string;
+        offBackgroundInverse: string;
+        primaryText: string;
+        secondaryText: string;
+        tertiaryText: string;
         textSelection: string;
-        inputFieldPrimary: string;
-        inputFieldPlaceholder: string;
-        inputFieldDisabled: string;
-        optionBackground: string;
-        optionBackgroundSecondary: string;
+        inputBackground: string;
+        inputBorderBase: string;
+        inputBorderHover: string;
+        actionColor: string;
+        actionColorHover: string;
+        actionColorDisabled: string;
         buttonPrimary: string;
-        buttonProcessing: string;
         buttonDisabled: string;
         buttonWarning: string;
         buttonSuccess: string;
         buttonTextWarning: string;
         buttonTextSuccess: string;
         buttonTextPrimary: string;
-        buttonTextSecondary: string;
         buttonTextDisabled: string;
         transparent: string;
+        buttonBackgroundTertiary: string;
+        buttonBackgroundHoverTertiary: string;
+        buttonTextTertiary: string;
+        buttonTextDisabledTertiary: string;
+        buttonStrokeTertiary: string;
+        buttonBackground: string;
+        buttonBackgroundHover: string;
+        buttonBackgroundDisabled: string;
+        buttonText: string;
+        buttonStroke: string;
+        buttonTextSecondaryDisabled: string;
+        buttonTextSecondary: string;
     };
     shadows: {
         connectButton: string;
         dialog: string;
-        profileDetailsAction: string;
         selectedOption: string;
         selectedWallet: string;
-        walletLogo: string;
+        button: string;
+        callToAction: string;
     };
     moonpayTheme: string;
     fontSize: {
+        '8': {
+            fontSize: string;
+            lineHeight: string;
+        };
         '10': {
             fontSize: string;
             lineHeight: string;
@@ -98,6 +106,10 @@ export declare const defaultTheme: {
             fontSize: string;
             lineHeight: string;
         };
+        '40': {
+            fontSize: string;
+            lineHeight: string;
+        };
         '57': {
             fontSize: string;
             lineHeight: string;
@@ -142,10 +154,8 @@ export declare const useActiveTheme: () => {
             accentColor: string;
             accentColorForeground: string;
             actionButtonBorder: string;
-            actionButtonSecondaryBackground: string;
             connectButtonBackground: string;
             connectButtonBackgroundError: string;
-            connectButtonInnerBackground: string;
             connectButtonText: string;
             connectButtonTextError: string;
             connectionIndicator: string;
@@ -153,45 +163,51 @@ export declare const useActiveTheme: () => {
             generalBorder: string;
             generalBorderDim: string;
             menuItemBackground: string;
-            modalText: string;
-            modalTextDim: string;
-            modalTextSecondary: string;
-            profileAction: string;
-            profileActionHover: string;
-            profileForeground: string;
             selectedOptionBorder: string;
-            paymentOptionBorderBase: string;
-            paymentOptionBorderHover: string;
-            paymentOptionBorderActive: string;
-            paymentOptionBorderActiveHover: string;
+            paymentOptionBorderDisabled: string;
             standby: string;
+            success: string;
             loadingBase: string;
             loadingAccent: string;
+            chainIconBorder: string;
             modalBackdrop: string;
             modalBackground: string;
             modalBorder: string;
             notificationPrimary: string;
-            textPrimary: string;
-            textSecondary: string;
-            textTertiary: string;
-            textDisabled: string;
+            offBackground: string;
+            hoverState: string;
+            offBackgroundInverse: string;
+            primaryText: string;
+            secondaryText: string;
+            tertiaryText: string;
             textSelection: string;
-            inputFieldPrimary: string;
-            inputFieldPlaceholder: string;
-            inputFieldDisabled: string;
-            optionBackground: string;
-            optionBackgroundSecondary: string;
+            inputBackground: string;
+            inputBorderBase: string;
+            inputBorderHover: string;
+            actionColor: string;
+            actionColorHover: string;
+            actionColorDisabled: string;
             buttonPrimary: string;
-            buttonProcessing: string;
             buttonDisabled: string;
             buttonWarning: string;
             buttonSuccess: string;
             buttonTextWarning: string;
             buttonTextSuccess: string;
             buttonTextPrimary: string;
-            buttonTextSecondary: string;
             buttonTextDisabled: string;
             transparent: string;
+            buttonBackgroundTertiary: string;
+            buttonBackgroundHoverTertiary: string;
+            buttonTextTertiary: string;
+            buttonTextDisabledTertiary: string;
+            buttonStrokeTertiary: string;
+            buttonBackground: string;
+            buttonBackgroundHover: string;
+            buttonBackgroundDisabled: string;
+            buttonText: string;
+            buttonStroke: string;
+            buttonTextSecondaryDisabled: string;
+            buttonTextSecondary: string;
         };
         fonts: {
             body: string;
@@ -204,6 +220,10 @@ export declare const useActiveTheme: () => {
             heavy: string;
         };
         fontSize: {
+            '8': {
+                fontSize: string;
+                lineHeight: string;
+            };
             '10': {
                 fontSize: string;
                 lineHeight: string;
@@ -236,6 +256,10 @@ export declare const useActiveTheme: () => {
                 fontSize: string;
                 lineHeight: string;
             };
+            '40': {
+                fontSize: string;
+                lineHeight: string;
+            };
             '57': {
                 fontSize: string;
                 lineHeight: string;
@@ -251,10 +275,10 @@ export declare const useActiveTheme: () => {
         shadows: {
             connectButton: string;
             dialog: string;
-            profileDetailsAction: string;
             selectedOption: string;
             selectedWallet: string;
-            walletLogo: string;
+            button: string;
+            callToAction: string;
         };
         blurs: {
             modalOverlay: string;
@@ -267,10 +291,8 @@ export declare const useActiveTheme: () => {
             accentColor: string;
             accentColorForeground: string;
             actionButtonBorder: string;
-            actionButtonSecondaryBackground: string;
             connectButtonBackground: string;
             connectButtonBackgroundError: string;
-            connectButtonInnerBackground: string;
             connectButtonText: string;
             connectButtonTextError: string;
             connectionIndicator: string;
@@ -278,45 +300,51 @@ export declare const useActiveTheme: () => {
             generalBorder: string;
             generalBorderDim: string;
             menuItemBackground: string;
-            modalText: string;
-            modalTextDim: string;
-            modalTextSecondary: string;
-            profileAction: string;
-            profileActionHover: string;
-            profileForeground: string;
             selectedOptionBorder: string;
-            paymentOptionBorderBase: string;
-            paymentOptionBorderHover: string;
-            paymentOptionBorderActive: string;
-            paymentOptionBorderActiveHover: string;
+            paymentOptionBorderDisabled: string;
             standby: string;
+            success: string;
             loadingBase: string;
             loadingAccent: string;
+            chainIconBorder: string;
             modalBackdrop: string;
             modalBackground: string;
             modalBorder: string;
             notificationPrimary: string;
-            textPrimary: string;
-            textSecondary: string;
-            textTertiary: string;
-            textDisabled: string;
+            offBackground: string;
+            hoverState: string;
+            offBackgroundInverse: string;
+            primaryText: string;
+            secondaryText: string;
+            tertiaryText: string;
             textSelection: string;
-            inputFieldPrimary: string;
-            inputFieldPlaceholder: string;
-            inputFieldDisabled: string;
-            optionBackground: string;
-            optionBackgroundSecondary: string;
+            inputBackground: string;
+            inputBorderBase: string;
+            inputBorderHover: string;
+            actionColor: string;
+            actionColorHover: string;
+            actionColorDisabled: string;
             buttonPrimary: string;
-            buttonProcessing: string;
             buttonDisabled: string;
             buttonWarning: string;
             buttonSuccess: string;
             buttonTextWarning: string;
             buttonTextSuccess: string;
             buttonTextPrimary: string;
-            buttonTextSecondary: string;
             buttonTextDisabled: string;
             transparent: string;
+            buttonBackgroundTertiary: string;
+            buttonBackgroundHoverTertiary: string;
+            buttonTextTertiary: string;
+            buttonTextDisabledTertiary: string;
+            buttonStrokeTertiary: string;
+            buttonBackground: string;
+            buttonBackgroundHover: string;
+            buttonBackgroundDisabled: string;
+            buttonText: string;
+            buttonStroke: string;
+            buttonTextSecondaryDisabled: string;
+            buttonTextSecondary: string;
         };
         fonts: {
             body: string;
@@ -329,6 +357,10 @@ export declare const useActiveTheme: () => {
             heavy: string;
         };
         fontSize: {
+            '8': {
+                fontSize: string;
+                lineHeight: string;
+            };
             '10': {
                 fontSize: string;
                 lineHeight: string;
@@ -361,6 +393,10 @@ export declare const useActiveTheme: () => {
                 fontSize: string;
                 lineHeight: string;
             };
+            '40': {
+                fontSize: string;
+                lineHeight: string;
+            };
             '57': {
                 fontSize: string;
                 lineHeight: string;
@@ -376,10 +412,10 @@ export declare const useActiveTheme: () => {
         shadows: {
             connectButton: string;
             dialog: string;
-            profileDetailsAction: string;
             selectedOption: string;
             selectedWallet: string;
-            walletLogo: string;
+            button: string;
+            callToAction: string;
         };
         blurs: {
             modalOverlay: string;
@@ -391,10 +427,8 @@ export declare const useActiveTheme: () => {
             accentColor: string;
             accentColorForeground: string;
             actionButtonBorder: string;
-            actionButtonSecondaryBackground: string;
             connectButtonBackground: string;
             connectButtonBackgroundError: string;
-            connectButtonInnerBackground: string;
             connectButtonText: string;
             connectButtonTextError: string;
             connectionIndicator: string;
@@ -402,45 +436,51 @@ export declare const useActiveTheme: () => {
             generalBorder: string;
             generalBorderDim: string;
             menuItemBackground: string;
-            modalText: string;
-            modalTextDim: string;
-            modalTextSecondary: string;
-            profileAction: string;
-            profileActionHover: string;
-            profileForeground: string;
             selectedOptionBorder: string;
-            paymentOptionBorderBase: string;
-            paymentOptionBorderHover: string;
-            paymentOptionBorderActive: string;
-            paymentOptionBorderActiveHover: string;
+            paymentOptionBorderDisabled: string;
             standby: string;
+            success: string;
             loadingBase: string;
             loadingAccent: string;
+            chainIconBorder: string;
             modalBackdrop: string;
             modalBackground: string;
             modalBorder: string;
             notificationPrimary: string;
-            textPrimary: string;
-            textSecondary: string;
-            textTertiary: string;
-            textDisabled: string;
+            offBackground: string;
+            hoverState: string;
+            offBackgroundInverse: string;
+            primaryText: string;
+            secondaryText: string;
+            tertiaryText: string;
             textSelection: string;
-            inputFieldPrimary: string;
-            inputFieldPlaceholder: string;
-            inputFieldDisabled: string;
-            optionBackground: string;
-            optionBackgroundSecondary: string;
+            inputBackground: string;
+            inputBorderBase: string;
+            inputBorderHover: string;
+            actionColor: string;
+            actionColorHover: string;
+            actionColorDisabled: string;
             buttonPrimary: string;
-            buttonProcessing: string;
             buttonDisabled: string;
             buttonWarning: string;
             buttonSuccess: string;
             buttonTextWarning: string;
             buttonTextSuccess: string;
             buttonTextPrimary: string;
-            buttonTextSecondary: string;
             buttonTextDisabled: string;
             transparent: string;
+            buttonBackgroundTertiary: string;
+            buttonBackgroundHoverTertiary: string;
+            buttonTextTertiary: string;
+            buttonTextDisabledTertiary: string;
+            buttonStrokeTertiary: string;
+            buttonBackground: string;
+            buttonBackgroundHover: string;
+            buttonBackgroundDisabled: string;
+            buttonText: string;
+            buttonStroke: string;
+            buttonTextSecondaryDisabled: string;
+            buttonTextSecondary: string;
         };
         fonts: {
             body: string;
@@ -453,6 +493,10 @@ export declare const useActiveTheme: () => {
             heavy: string;
         };
         fontSize: {
+            '8': {
+                fontSize: string;
+                lineHeight: string;
+            };
             '10': {
                 fontSize: string;
                 lineHeight: string;
@@ -485,6 +529,10 @@ export declare const useActiveTheme: () => {
                 fontSize: string;
                 lineHeight: string;
             };
+            '40': {
+                fontSize: string;
+                lineHeight: string;
+            };
             '57': {
                 fontSize: string;
                 lineHeight: string;
@@ -500,10 +548,10 @@ export declare const useActiveTheme: () => {
         shadows: {
             connectButton: string;
             dialog: string;
-            profileDetailsAction: string;
             selectedOption: string;
             selectedWallet: string;
-            walletLogo: string;
+            button: string;
+            callToAction: string;
         };
         blurs: {
             modalOverlay: string;

package/dist/components/FunkitProvider/FunkitWeb2Provider.d.ts

@@ -46,6 +46,7 @@ interface FunkitWeb2ContextType {
     }>;
     web2UserInfo: FunkitUserInfoBase;
 }
+export declare const AUTH_PROVIDER = "privy.io";
 interface FunkitWeb2ProviderProps {
     children: ReactNode;
 }

package/dist/components/FunkitProvider/GeneralWalletProvider.d.ts

@@ -14,6 +14,8 @@ interface GeneralWalletContextProps {
     userInfo: FunkitUserInfo;
     isFetchingAssets: boolean;
     walletAssets: GeneralWalletAssets;
+    totalWalletAssetsUsd: number;
+    maxUsdWalletAssetKey: string;
     startAssetsListener: () => void;
     stopAssetsListener: () => void;
     funWallet: FunWallet | null;

package/dist/components/GradientLoader/GradientLoader.css.d.ts

@@ -0,0 +1 @@
+export declare const loader: string;

package/dist/components/GradientLoader/GradientLoader.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const GradientLoader: React.FC;

package/dist/components/Icons/AlpacaIcon.d.ts

@@ -1,2 +1,4 @@
 import React from 'react';
-export declare const AlpacaIcon: () => React.JSX.Element;
+export declare const AlpacaIcon: ({ size }: {
+    size?: number;
+}) => React.JSX.Element;

package/dist/components/Icons/ArrowIcon.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+type Direction = 'left' | 'right' | 'up' | 'down';
+interface Props {
+    direction: Direction;
+    size?: number;
+}
+export declare const ArrowIcon: ({ direction, size }: Props) => React.JSX.Element;
+export declare const BackIcon: () => React.JSX.Element;
+export {};

package/dist/components/Icons/BinanceIcon.d.ts

@@ -1,2 +1,4 @@
 import React from 'react';
-export declare const BinanceIcon: () => React.JSX.Element;
+export declare const BinanceIcon: ({ size }: {
+    size?: number;
+}) => React.JSX.Element;

package/dist/components/Icons/CaretDownIcon.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const CaretDownIcon: () => React.JSX.Element;

package/dist/components/Icons/CexloIcon.d.ts

@@ -1,2 +1,4 @@
 import React from 'react';
-export declare const CexloIcon: () => React.JSX.Element;
+export declare const CexloIcon: ({ size }: {
+    size?: number;
+}) => React.JSX.Element;

package/dist/components/Icons/{Copied.d.ts → Checked.d.ts}

@@ -1,4 +1,4 @@
 import React from 'react';
-export declare const CopiedIcon: ({ size }: {
+export declare const CheckIcon: ({ size }: {
     size?: string;
 }) => React.JSX.Element;

package/dist/components/Icons/{NoAssetsFoundIcon.d.ts → CloseIcon.d.ts}

@@ -1,4 +1,4 @@
 import React from 'react';
-export declare const NotFoundIcon: ({ size }: {
+export declare const CloseIcon: ({ size }: {
     size?: number;
 }) => React.JSX.Element;

package/dist/components/Icons/CopyDoubleIcon.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const CopyDoubleIcon: () => React.JSX.Element;

package/dist/components/Icons/CryptoIcon.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const CryptoIcon: () => React.JSX.Element;

package/dist/components/Icons/EtoroIcon.d.ts

@@ -1,2 +1,4 @@
 import React from 'react';
-export declare const EtoroIcon: () => React.JSX.Element;
+export declare const EtoroIcon: ({ size }: {
+    size?: number;
+}) => React.JSX.Element;

package/dist/components/Icons/FunLogoIcon.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const FunLogoIcon: () => React.JSX.Element;

package/dist/components/Icons/GeminiIcon.d.ts

@@ -1,2 +1,4 @@
 import React from 'react';
-export declare const GeminiIcon: () => React.JSX.Element;
+export declare const GeminiIcon: ({ size }: {
+    size?: number;
+}) => React.JSX.Element;

package/dist/components/Icons/GreenRoundCheckmark.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const GreenRoundCheckmark: ({ size }: {
+    size?: number;
+}) => React.JSX.Element;

package/dist/components/Icons/HandIcon.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const HandIcon: () => React.JSX.Element;

package/dist/components/Icons/Icons.css.d.ts

@@ -1,3 +1,2 @@
-export declare const CloseIconClassName: string;
 export declare const SpinnerIconClassName: string;
 export declare const SpinnerIconPathClassName: string;