@funkit/connect 3.5.0 → 4.0.0

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # @funkit/connect
 
+## 4.0.0
+
+### Major Changes
+
+- 8193700: feat: refactor funkit themeing - lightMode & darkMode to lightTheme & darkTheme
+
+### Minor Changes
+
+- 8193700: feat: rename setActive -> setActiveTheme & make it more straightforward
+- 8193700: feat: allow explicit color scheme theme setting in FunkitThemeProvider
+- 840ec64: refactor: use brokerType instead of brokerName
+
+### Patch Changes
+
+- 4d0c8e0: fix: use effectEvent to remove deps
+- 8193700: refactor: improve useFunkitCheckout config typing
+- 840ec64: feat: new flag supported_exchanges_v2
+- 1e6ba59: feat: copy changes
+- db0ef30: feat: add text customization for Your source
+- a9cdf0e: fix: bypass userOp gas estimation; update fun worker address
+- ce119a4: fix: improve bottom bar visuals in mesh verification
+- 0680c49: feat(api-base, connect, fits): move clientMetadata typing to api-base and refactor related types
+- 40c07e9: fix: remove preload
+- 8193700: feat: expose system fallback fonts
+- 1661e49: feat: extend sufficient asset checks to checkout loading
+- 456a82a: feat: gas cost text change
+- Updated dependencies [1e6ba59]
+- Updated dependencies [a9cdf0e]
+- Updated dependencies [0680c49]
+- Updated dependencies [6dc8105]
+  - @funkit/utils@1.0.0
+  - @funkit/core@2.2.6
+  - @funkit/api-base@1.3.4
+  - @funkit/wagmi-tools@3.0.17
+
 ## 3.5.0
 
 ### Minor Changes

package/dist/{chunk-77C753LI.js → chunk-3F3EYDDR.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   baseTheme
-} from "./chunk-BY224HGT.js";
+} from "./chunk-OMAXDH7G.js";
 
 // src/themes/lightTheme.ts
 var accentColors = {
@@ -103,6 +103,7 @@ var lightTheme = ({
     selectedOption: "0px 2px 6px rgba(0, 0, 0, 0.24)",
     selectedWallet: "0px 2px 6px rgba(0, 0, 0, 0.12)",
     button: "0px 1px 2px 0px rgba(0, 0, 0, 0.20)",
+    tooltip: "0px 4px 4px rgba(0, 0, 0, 0.05)",
     // Override shadows
     ...customShadows || {}
   },

package/dist/{chunk-XWW5QOD4.js → chunk-LTOE4GIY.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   baseTheme
-} from "./chunk-BY224HGT.js";
+} from "./chunk-OMAXDH7G.js";
 
 // src/themes/darkTheme.ts
 var accentColors = {
@@ -103,6 +103,7 @@ var darkTheme = ({
     selectedOption: "0px 2px 6px rgba(0, 0, 0, 0.24)",
     selectedWallet: "0px 2px 6px rgba(0, 0, 0, 0.24)",
     button: "0px 1px 2px 0px rgba(0, 0, 0, 0.20)",
+    tooltip: "0px 4px 4px rgba(0, 0, 0, 0.05)",
     // Override shadows
     ...customShadows || {}
   },

package/dist/{chunk-BY224HGT.js → chunk-OMAXDH7G.js}

@@ -86,7 +86,7 @@ var baseTheme = ({
   borderRadius = "large",
   fontStack = "fun",
   fontSizing = "regular",
-  customFontFamily = "",
+  customFontFamily,
   customFontWeights = DEFAULT_FONT_WEIGHTS,
   overlayBlur = "small"
 }) => ({
@@ -111,5 +111,6 @@ var baseTheme = ({
 });
 
 export {
+  systemFontStack,
   baseTheme
 };

package/dist/components/AsyncImage/AsyncImage.d.ts

@@ -1,6 +1,6 @@
-import React, { ReactElement } from 'react';
-import { BoxProps } from '../Box/Box';
-import { AsyncImageSrc } from './useAsyncImage';
+import React, { type ReactElement } from 'react';
+import { type BoxProps } from '../Box/Box';
+import { type AsyncImageSrc } from './useAsyncImage';
 type CustomBorderColor = {
     custom: string;
 };

package/dist/components/AsyncImage/useAsyncImage.d.ts

@@ -1,3 +1,3 @@
 export type AsyncImageSrc = () => Promise<string>;
-export declare function loadImages(...urls: (string | AsyncImageSrc)[]): Promise<(string | void)[]>;
+export declare function loadImages(...urls: (string | AsyncImageSrc)[]): Promise<(string | undefined)[]>;
 export declare function useAsyncImage(url?: string | AsyncImageSrc): string | undefined;

package/dist/components/Avatar/EmojiAvatar.d.ts

@@ -1,2 +1,2 @@
-import { AvatarComponent } from '../../providers/AvatarContext';
+import type { AvatarComponent } from '../../providers/AvatarContext';
 export declare const EmojiAvatar: AvatarComponent;

package/dist/components/Box/Box.d.ts

@@ -1,4 +1,4 @@
-import { ClassValue } from 'clsx';
+import { type ClassValue } from 'clsx';
 import * as React from 'react';
 export type BoxBorderType = Pick<BoxProps, 'borderColor' | 'borderStyle' | 'borderWidth'>;
 type HTMLProperties<T = HTMLElement> = Omit<React.AllHTMLAttributes<T>, 'as' | 'className' | 'color' | 'height' | 'width'>;
@@ -19,13 +19,13 @@ export declare const Box: React.ForwardRefExoticComponent<{
         focused?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "error" | "errorBackground" | "errorBorder" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "selectedOptionBorder" | "paymentOptionBorderDisabled" | "standby" | "success" | "loadingBase" | "loadingAccent" | "chainIconBorder" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "offBackground" | "hoverState" | "offBackgroundInverse" | "lightStroke" | "mediumStroke" | "strokeColor" | "dydxSwitchActiveBackground" | "primaryText" | "secondaryText" | "tertiaryText" | "textSelection" | "inputBackground" | "inputBorderBase" | "inputBorderHover" | "actionColor" | "actionColorHover" | "actionColorDisabled" | "buttonPrimary" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextDisabled" | "buttonBackgroundTertiary" | "buttonBackgroundHoverTertiary" | "buttonTextTertiary" | "buttonTextDisabledTertiary" | "buttonStrokeTertiary" | "buttonBackground" | "buttonBackgroundHover" | "buttonBackgroundDisabled" | "buttonStroke" | "buttonTextSecondaryDisabled" | "buttonTextSecondary" | "buttonIconBackgroundHover" | "buttonIconBackgroundPressed" | "buttonIconStroke" | undefined;
         focusedVisible?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "error" | "errorBackground" | "errorBorder" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "selectedOptionBorder" | "paymentOptionBorderDisabled" | "standby" | "success" | "loadingBase" | "loadingAccent" | "chainIconBorder" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "offBackground" | "hoverState" | "offBackgroundInverse" | "lightStroke" | "mediumStroke" | "strokeColor" | "dydxSwitchActiveBackground" | "primaryText" | "secondaryText" | "tertiaryText" | "textSelection" | "inputBackground" | "inputBorderBase" | "inputBorderHover" | "actionColor" | "actionColorHover" | "actionColorDisabled" | "buttonPrimary" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextDisabled" | "buttonBackgroundTertiary" | "buttonBackgroundHoverTertiary" | "buttonTextTertiary" | "buttonTextDisabledTertiary" | "buttonStrokeTertiary" | "buttonBackground" | "buttonBackgroundHover" | "buttonBackgroundDisabled" | "buttonStroke" | "buttonTextSecondaryDisabled" | "buttonTextSecondary" | "buttonIconBackgroundHover" | "buttonIconBackgroundPressed" | "buttonIconStroke" | undefined;
     } | undefined;
-    boxShadow?: "button" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | {
-        base?: "button" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
-        hover?: "button" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
-        active?: "button" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
-        selection?: "button" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
-        focused?: "button" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
-        focusedVisible?: "button" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
+    boxShadow?: "button" | "tooltip" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | {
+        base?: "button" | "tooltip" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
+        hover?: "button" | "tooltip" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
+        active?: "button" | "tooltip" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
+        selection?: "button" | "tooltip" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
+        focused?: "button" | "tooltip" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
+        focusedVisible?: "button" | "tooltip" | "connectButton" | "dialog" | "selectedOption" | "selectedWallet" | undefined;
     } | undefined;
     color?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "error" | "errorBackground" | "errorBorder" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "selectedOptionBorder" | "paymentOptionBorderDisabled" | "standby" | "success" | "loadingBase" | "loadingAccent" | "chainIconBorder" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "offBackground" | "hoverState" | "offBackgroundInverse" | "lightStroke" | "mediumStroke" | "strokeColor" | "dydxSwitchActiveBackground" | "primaryText" | "secondaryText" | "tertiaryText" | "textSelection" | "inputBackground" | "inputBorderBase" | "inputBorderHover" | "actionColor" | "actionColorHover" | "actionColorDisabled" | "buttonPrimary" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextDisabled" | "buttonBackgroundTertiary" | "buttonBackgroundHoverTertiary" | "buttonTextTertiary" | "buttonTextDisabledTertiary" | "buttonStrokeTertiary" | "buttonBackground" | "buttonBackgroundHover" | "buttonBackgroundDisabled" | "buttonStroke" | "buttonTextSecondaryDisabled" | "buttonTextSecondary" | "buttonIconBackgroundHover" | "buttonIconBackgroundPressed" | "buttonIconStroke" | {
         base?: "accentColor" | "transparent" | "accentColorForeground" | "actionButtonBorder" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "error" | "errorBackground" | "errorBorder" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "selectedOptionBorder" | "paymentOptionBorderDisabled" | "standby" | "success" | "loadingBase" | "loadingAccent" | "chainIconBorder" | "modalBackdrop" | "modalBackground" | "modalBorder" | "notificationPrimary" | "offBackground" | "hoverState" | "offBackgroundInverse" | "lightStroke" | "mediumStroke" | "strokeColor" | "dydxSwitchActiveBackground" | "primaryText" | "secondaryText" | "tertiaryText" | "textSelection" | "inputBackground" | "inputBorderBase" | "inputBorderHover" | "actionColor" | "actionColorHover" | "actionColorDisabled" | "buttonPrimary" | "buttonDisabled" | "buttonWarning" | "buttonSuccess" | "buttonTextWarning" | "buttonTextSuccess" | "buttonTextPrimary" | "buttonTextDisabled" | "buttonBackgroundTertiary" | "buttonBackgroundHoverTertiary" | "buttonTextTertiary" | "buttonTextDisabledTertiary" | "buttonStrokeTertiary" | "buttonBackground" | "buttonBackgroundHover" | "buttonBackgroundDisabled" | "buttonStroke" | "buttonTextSecondaryDisabled" | "buttonTextSecondary" | "buttonIconBackgroundHover" | "buttonIconBackgroundPressed" | "buttonIconStroke" | undefined;

package/dist/components/CloseButton/CloseButton.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FunIconButtonProps } from '../FunButton/FunIconButton';
+import { type FunIconButtonProps } from '../FunButton/FunIconButton';
 interface FunCloseButtonProps extends Omit<FunIconButtonProps, 'onClick' | 'icon' | 'ariaLabel' | 'size'> {
     onClose?: () => void;
 }

package/dist/components/ConnectButton/ConnectButton.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ResponsiveValue } from '../../css/sprinkles.css';
+import { type ResponsiveValue } from '../../css/sprinkles.css';
 import { ConnectButtonRenderer } from './ConnectButtonRenderer';
 type AccountStatus = 'full' | 'avatar' | 'address';
 type ChainStatus = 'full' | 'icon' | 'name' | 'none';

package/dist/components/ConnectButton/ConnectButtonRenderer.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactNode } from 'react';
-import { AuthenticationStatus } from '../../providers/AuthenticationContext';
+import React, { type ReactNode } from 'react';
+import { type AuthenticationStatus } from '../../providers/AuthenticationContext';
 export interface ConnectButtonRendererProps {
     children: (renderProps: {
         account?: {

package/dist/components/ConnectButton/formatENS.d.ts

@@ -1,2 +1,2 @@
-import { GetEnsNameReturnType } from 'viem';
+import type { GetEnsNameReturnType } from 'viem';
 export declare function formatENS(name: GetEnsNameReturnType): string;

package/dist/components/CopyAddress/CopyAddress.d.ts

@@ -9,4 +9,4 @@ export declare function CopyAddress({ address, type, showAddress, }: {
      */
     type: 'rounded_button' | 'large_button' | 'display_address';
     showAddress?: boolean;
-}): React.JSX.Element | null;
+}): React.JSX.Element;

package/dist/components/Dialog/Dialog.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactNode } from 'react';
-import { BoxProps } from '../Box/Box';
+import React, { type ReactNode } from 'react';
+import { type BoxProps } from '../Box/Box';
 export { CHECKOUT_MODAL_BOTTOM_BAR_ID, CHECKOUT_MODAL_TITLE_COUNTDOWN_ID, useBottomSectionRef, useTitleCountdownRef, } from './hooks';
 interface DialogProps {
     open: boolean;
@@ -35,10 +35,10 @@ export interface DialogTitleProps {
     titleMeta?: string;
     hasCloseButton?: boolean;
     isCloseDisabled?: boolean;
-    onClose?: (p?: any) => void;
+    onClose?: () => void;
     hasBackButton?: boolean;
     isBackDisabled?: boolean;
-    onBack?: (p?: any) => void;
+    onBack?: () => void;
     skipBackDelay?: boolean;
     /** @deprecated TODO: investigate unifying with modal navigation animation */
     backAnimation?: boolean;

package/dist/components/Dropdown/BaseDropdown.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BaseActiveDropdownItemProps } from './BaseActiveDropdownItem';
+import { type BaseActiveDropdownItemProps } from './BaseActiveDropdownItem';
 interface BaseDropdownOption {
     label: string;
     value: string;

package/dist/components/Dropdown/ChainDropdown.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { TokenTransferSourceChainsAndAssets } from '~/modals/CheckoutModal/TransferToken';
+import type { TokenTransferSourceChainsAndAssets } from '~/modals/CheckoutModal/TransferToken';
 interface ChainDropdownProps {
     assets: TokenTransferSourceChainsAndAssets;
     onChainSelected: (chainId: number) => void;

package/dist/components/Dropdown/TokenDropdown.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { TokenTransferSourceChainsAndAssets } from '~/modals/CheckoutModal/TransferToken';
+import type { TokenTransferSourceChainsAndAssets } from '~/modals/CheckoutModal/TransferToken';
 interface TokenDropdownProps {
     selectedChainId: number;
     assets: TokenTransferSourceChainsAndAssets;

package/dist/components/DydxSwitchModalTab/DydxSwitchModalTab.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FunkitActiveCheckoutItem } from '../../providers/FunkitCheckoutContext';
+import type { FunkitActiveCheckoutItem } from '../../providers/FunkitCheckoutContext';
 interface DydxSwitchTabProps {
     checkoutItem: FunkitActiveCheckoutItem;
     showSwitch: boolean;

package/dist/components/ErrorBoundary/ErrorBoundary.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Component, ErrorInfo, ReactNode } from 'react';
+import { Component, type ErrorInfo, type ReactNode } from 'react';
 interface ErrorBoundaryProps {
     children: ReactNode;
     fallback?: ReactNode;

package/dist/components/FunAlert/FunAlert.d.ts

@@ -1,7 +1,7 @@
-import React, { ReactNode } from 'react';
+import React, { type ReactNode } from 'react';
 interface FunAlertProps {
     icon?: ReactNode;
-    description: string | ReactNode;
+    description: ReactNode;
     type?: 'info' | 'error';
 }
 export declare function FunAlert({ icon, description, type }: FunAlertProps): React.JSX.Element;

package/dist/components/FunAsset/FunAssetBadge.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 interface FunAssetBadgeProps {
     children: React.ReactNode;
     background?: BoxProps['background'];

package/dist/components/FunAsset/FunAssetItem.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { AssetHoldingsItem } from '../../utils/assets';
+import type { AssetHoldingsItem } from '~/utils/assets';
 interface FunAssetItemProps {
     asset: AssetHoldingsItem;
     isActive?: boolean;

package/dist/components/FunAssetAvatar/FunAssetAvatar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 interface FunAssetAvatarProps {
     assetSrc?: string;
     assetTicker?: string;

package/dist/components/FunBadge/FunBadge.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 interface FunBadgeProps {
     children: React.ReactNode;
     paddingX?: BoxProps['paddingX'];

package/dist/components/FunBottomBar/FunBottomBar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FunButtonProps } from '../FunButton/FunButton';
+import { type FunButtonProps } from '../FunButton/FunButton';
 export interface FunBottomBarProps {
     topSection?: React.ReactNode;
     actionButtonProps: FunButtonProps;

package/dist/components/FunButton/FunBackButton.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FunIconButtonProps } from './FunIconButton';
+import { type FunIconButtonProps } from './FunIconButton';
 interface FunBackButtonProps extends Omit<FunIconButtonProps, 'onClick' | 'icon' | 'ariaLabel' | 'size'> {
     onBack?: () => void;
 }

package/dist/components/FunButton/FunButton.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 export type FunButtonTypes = 'primary' | 'secondary' | 'tertiary';
 export interface FunButtonProps {
     id?: string;

package/dist/components/FunButton/FunIconButton.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 export interface FunIconButtonProps extends Pick<BoxProps, 'as' | 'borderRadius' | 'color' | 'fontSize' | 'fontWeight' | 'onBlur' | 'onMouseEnter' | 'onMouseLeave' | 'style'> {
     onClick?: () => void;
     /** Icon element to be rendered */

package/dist/components/FunButton/FunLinkButton.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { TextProps } from '../Text/Text';
+import { type TextProps } from '../Text/Text';
 export declare function FunLinkButton({ onClick, text, textProps, hasPadding, color, }: {
     onClick: () => void;
     text: string;

package/dist/components/FunButton/FunRedirectButton.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FunIconButtonProps } from './FunIconButton';
+import { type FunIconButtonProps } from './FunIconButton';
 interface FunRedirectButtonProps extends Omit<FunIconButtonProps, 'icon'> {
     icon?: React.ReactNode;
     to: string;

package/dist/components/FunButton/FunSignInButton.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React, { type ReactNode } from 'react';
 interface FunSignInButtonProps {
     title: string;
     titlePrefix: ReactNode;

package/dist/components/FunConnectOptions/ConnectDetails.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WalletConnector } from '../../wallets/useWalletConnectors';
+import type { WalletConnector } from '../../wallets/useWalletConnectors';
 interface Props {
     qrCodeUri?: string;
     wallet: WalletConnector;

package/dist/components/FunConnectOptions/FunConnectResultStep.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WalletConnector } from '../../wallets/useWalletConnectors';
+import type { WalletConnector } from '../../wallets/useWalletConnectors';
 type ResultType = 'success' | 'error';
 interface FunErrorContentProps {
     onClose: () => void;

package/dist/components/FunConnectOptions/FunSignInStep.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { SocialLoginOption } from '../../consts/funkit';
-import { WalletConnector } from '../../wallets/useWalletConnectors';
+import { type SocialLoginOption } from '../../consts/funkit';
+import { type WalletConnector } from '../../wallets/useWalletConnectors';
 import { ConnectStep } from './FunConnectOptions';
 export declare function useEnabledSocialLogins(): SocialLoginOption[];
 /**

package/dist/components/FunConnectOptions/FunWeb3ConnectingStep.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { WalletConnector } from '../../wallets/useWalletConnectors';
+import type { WalletConnector } from '../../wallets/useWalletConnectors';
 interface Props {
     selectedWallet: WalletConnector | undefined;
     qrCodeUri: string;

package/dist/components/FunCountdown/FunCountdown.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React, { type ReactNode } from 'react';
 export interface FunCountdownProps {
     countdownSeconds: number;
     initialRemainingSeconds?: number;

package/dist/components/FunDivider/FunDivider.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 interface FunDividerProps {
     marginTop?: BoxProps['marginTop'];
     marginBottom?: BoxProps['marginBottom'];

package/dist/components/FunGuarantees/FunGuarantees.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { MeshExchanges } from '../../utils/mesh';
+import { MeshExchangeType } from '~/consts/mesh';
 interface FunGuaranteesProps {
-    exchange: MeshExchanges;
+    brokerType: MeshExchangeType;
 }
-export declare const FunGuarantees: ({ exchange }: FunGuaranteesProps) => React.JSX.Element;
+export declare const FunGuarantees: ({ brokerType }: FunGuaranteesProps) => React.JSX.Element;
 export {};

package/dist/components/FunInput/FunInput.d.ts

@@ -1,6 +1,6 @@
 import './FunInputBase.css';
-import React, { HTMLInputTypeAttribute, ReactNode } from 'react';
-import { BoxProps } from '../Box/Box';
+import React, { type HTMLInputTypeAttribute, type ReactNode } from 'react';
+import { type BoxProps } from '../Box/Box';
 export interface FunInputProps<T = HTMLInputElement> {
     prefix?: ReactNode;
     suffix?: ReactNode;

package/dist/components/FunInput/FunTextAreaInput.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { FunInputProps } from './FunInput';
+import type { FunInputProps } from './FunInput';
 export declare function FunTextAreaInput({ placeholder, value, label, onChange, onKeyDown, onKeySubmit, textColor, inputStyle, inputProps, error, overrideBorderWidth, overrideBackground, }: FunInputProps<HTMLTextAreaElement>): React.JSX.Element;

package/dist/components/FunKeyValue/FunKeyValue.d.ts

@@ -1,6 +1,6 @@
-import React, { ReactNode } from 'react';
-import { BoxProps } from '../Box/Box';
-import { TextProps } from '../Text/Text';
+import React, { type ReactNode } from 'react';
+import { type BoxProps } from '../Box/Box';
+import { type TextProps } from '../Text/Text';
 export interface FunKeyValueProps {
     keyIcon?: ReactNode;
     keyText: string;

package/dist/components/FunMessage/FunMessage.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 interface Props extends BoxProps {
     icon?: React.ReactNode;
     title: string;

package/dist/components/FunNoResults/FunNoResults.d.ts

@@ -1,2 +1,2 @@
-import React, { PropsWithChildren } from 'react';
+import React, { type PropsWithChildren } from 'react';
 export declare const FunNoResults: ({ children }: PropsWithChildren) => React.JSX.Element;

package/dist/components/FunNotification/FunCheckoutNotification.d.ts

@@ -1,4 +1,4 @@
-import { CheckoutHistoryItem } from '@funkit/api-base';
+import type { CheckoutHistoryItem } from '@funkit/api-base';
 import React from 'react';
 import { HistoryContentPages } from '../../utils/checkoutHistory';
 export declare function FunCheckoutNotification({ checkoutHistoryItem, onSelect, }: {

package/dist/components/FunNotification/FunNotification.d.ts

@@ -1,7 +1,7 @@
 import './FunNotification.css';
-import React, { ReactNode } from 'react';
+import React, { type ReactNode } from 'react';
 import { Box } from '../Box/Box';
-import { TextProps } from '../Text/Text';
+import { type TextProps } from '../Text/Text';
 interface FunNotificationProps {
     type?: FunNotificationType;
     description: string | ReactNode;

package/dist/components/FunOptionBox/FunOptionBox.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactNode } from 'react';
-import { BoxProps } from '../Box/Box';
+import React, { type ReactNode } from 'react';
+import { type BoxProps } from '../Box/Box';
 interface FunOptionBoxProps extends Omit<BoxProps, 'className' | 'cursor' | 'tabIndex' | 'style'> {
     isActive?: boolean;
     paddingX?: BoxProps['paddingX'];

package/dist/components/FunPaymentMethodItem/FunPaymentMethodItem.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React, { type ReactNode } from 'react';
 export interface FunPaymentMethodItemProps {
     keyIcon?: ReactNode;
     keyText: string;

package/dist/components/FunPayments/FunPaymentMethods.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactNode } from 'react';
-import { PaymentMethod, PaymentMethodBrokerageInfo } from '../../domains/paymentMethods';
+import React, { type ReactNode } from 'react';
+import { PaymentMethod, type PaymentMethodBrokerageInfo } from '../../domains/paymentMethods';
 interface ConnectedMeshPaymentMethodItemProps {
     paymentMethodInfo: PaymentMethodBrokerageInfo;
     isSelected: boolean;

package/dist/components/FunPayments/FunPaymentMoonpayType.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Address } from 'viem';
+import type { Address } from 'viem';
 export interface FunPaymentMoonpayProps {
     paymentAddress: Address;
     depositToken: string;

package/dist/components/FunSelect/FunClickOutside.d.ts

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren } from 'react';
+import React, { type PropsWithChildren } from 'react';
 /**
  * This component fires a callback (onClick) if a mouseclick has been detected outside its child component
  */

package/dist/components/FunSelect/FunSelect.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React, { type ReactNode } from 'react';
 export interface FunSelectOption<T = string> {
     value: T;
     label: ReactNode;

package/dist/components/FunSelectBrokerage/FunBrokerageItem.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
 interface BrokerateItemProps {
-    exchange: string;
+    exchangeName: string;
     exchangeIcon: React.ReactNode;
     fullInfo: boolean;
     hasActiveConnection: boolean;
 }
-export declare const FunBrokerageItem: ({ exchange, exchangeIcon, fullInfo, hasActiveConnection, }: BrokerateItemProps) => React.JSX.Element;
+export declare const FunBrokerageItem: ({ exchangeName, exchangeIcon, fullInfo, hasActiveConnection, }: BrokerateItemProps) => React.JSX.Element;
 export {};

package/dist/components/FunSelectBrokerage/FunSelectBrokerage.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import { MeshExchanges } from '~/consts/mesh';
-import { FunSelectOption } from '../FunSelect/FunSelect';
+import { MeshExchangeType } from '~/consts/mesh';
+import type { FunSelectOption } from '../FunSelect/FunSelect';
 interface FunSelectBrokerageProps {
-    onSelect: (value: MeshExchanges) => void;
-    options: FunSelectOption<MeshExchanges>[];
+    onSelect: (value: MeshExchangeType) => void;
+    options: FunSelectOption<MeshExchangeType>[];
     selectedValue: FunSelectOption['value'];
 }
 export declare function FunSelectBrokerage({ onSelect, options, selectedValue, }: FunSelectBrokerageProps): React.JSX.Element;

package/dist/components/FunSkeletonLoader/FunSkeletonBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 type FunSkeletonBlockProps = {
     borderRadius?: BoxProps['borderRadius'];
     marginBottom?: BoxProps['marginBottom'];

package/dist/components/FunSkeletonLoader/FunSkeletonCircle.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BoxProps } from '../Box/Box';
+import { type BoxProps } from '../Box/Box';
 export type FunSkeletonCircleProps = Pick<BoxProps, 'margin' | 'marginBottom' | 'marginLeft' | 'marginRight' | 'marginTop'> & {
     /** Defaults to 20px */
     size?: BoxProps['height'] & BoxProps['width'];

package/dist/components/FunSocials/FunSocials.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { SocialLoginOption } from '../../consts/funkit';
-import { BoxProps } from '../Box/Box';
+import type { SocialLoginOption } from '../../consts/funkit';
+import { type BoxProps } from '../Box/Box';
 interface Props {
     options: SocialLoginOption[];
     onSelect: (provider: SocialLoginOption['provider']) => void;

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

@@ -0,0 +1,3 @@
+export declare const tooltipContainer: string;
+export declare const tooltipStyle: string;
+export declare const tooltipFadeIn: string;

package/dist/components/FunTooltip/FunTooltip.d.ts

@@ -0,0 +1,7 @@
+import React, { ReactNode } from 'react';
+interface FunTooltipProps {
+    content: string;
+    children: ReactNode;
+}
+export declare const FunTooltip: ({ content, children }: FunTooltipProps) => React.JSX.Element;
+export {};

package/dist/components/FunTransactionSummary/FunTxSummaryComponents.d.ts

@@ -1,6 +1,6 @@
 import './FunTxSummaryComponents.css';
-import React, { ReactNode } from 'react';
-import { BoxProps } from '../Box/Box';
+import React, { type ReactNode } from 'react';
+import { type BoxProps } from '../Box/Box';
 export declare function FunTxSummaryBox({ children, ...otherProps }: BoxProps): React.JSX.Element;
 export declare function FunTxSummaryLineItem({ children, ...otherProps }: BoxProps): React.JSX.Element;
 export declare function FunTxSummaryLineItemCollapsibleTrigger({ children, isDisabled, onClick, }: {