import { type ComponentType, type JSX, type ReactNode } from 'react';
import type { BluvoExchangeType } from '../consts/bluvo';
import type { PaymentMethod } from '../domains/paymentMethods';
import type { SourceChangeTopComponentProps } from '../modals/CheckoutModal/stepTransition';
export interface FunkitTextCustomizationsConfig {
    virtualFiat: string;
    brokerageOrExchange: string;
    debitOrCredit: string;
    accountBalance: string;
    selectAccount: string;
    sourceChangeTitle?: string;
    perpsTransferTitle: string;
    sourceMethodTitle: string;
    tokensListTitle: string;
    transferTokens: string;
    bitcoinLightning: string;
    receiveDropdownTitle: string;
    receiveDropdownLabel: string;
    txStatus?: {
        failed?: {
            description?: string;
            title?: string;
        };
        delayed?: {
            description?: string;
            title?: string;
        };
        depositPending?: {
            description?: string;
            title?: string;
        };
        depositSucceeded?: {
            description?: string;
            title?: string;
        };
        submitting?: {
            description?: string;
            title?: string;
        };
        waitingForExchange?: {
            description?: string;
            title?: string;
        };
        withdrawalPending?: {
            description?: string;
            title?: string;
        };
        withdrawalSucceeded?: {
            description?: string;
            title?: string;
        };
    };
    confirmationScreen: {
        payAmountLabel: string;
        receiveAmountLabel: string;
        sourceLabel?: string;
    };
    paymentMethodSubtitles: {
        accountBalance?: string;
        brokerageOrExchange?: string;
        debitOrCredit?: string;
        paypal?: string;
        transferTokens?: string;
        bitcoinLightning?: string;
        virtualFiat?: string;
    };
}
export interface FunkitUiDestinationConfig {
    /** What icon (15x15) to show in the `destination` row - defaults to user wallet icon  */
    icon?: ReactNode;
    /** What text to show in the `destination` row - defaults to formatted destination wallet address  */
    text?: string;
    /** Which url to redirect to. If not specified, defaults to the block explorer of the recipientAddr of the checkout*/
    url?: string;
}
export interface FunkitUiSelectedRouteConfig {
    /** Image URL for passthrough routes (required) */
    passthroughImage: string;
    /** Label for passthrough routes - defaults to "Native Bridge" */
    passthroughLabel?: string;
}
export type FunkitPaymentMethodIconsConfig = Partial<Record<PaymentMethod, {
    src: string;
    size?: {
        width: number;
        height: number;
    };
}>>;
export interface FunkitUiCustomizationsConfig {
    /** Title alignment - defaults to "center" */
    alignTitle?: 'left' | 'center';
    /** Always shows checkout modal top divider even if content cannot scroll - defaults to `false` */
    alwaysShowTopDivider?: boolean;
    /** Whether to show modal title in topbars - defaults to true */
    showModalTitle?: boolean;
    /** Whether to show CTA in uppercase - defaults to false */
    callToActionsUppercase?: boolean;
    /** Whether to enable compact list style for option boxes - defaults to false */
    enableCompactList?: boolean;
    checkoutHistory?: {
        /** Whether to show the bottom "Get help" text in a {@link FunAlert} - defaults to true */
        showGetHelpAsAlert?: boolean;
        /** Show a simplified UI with less rows and no "More details" section - defaults to false */
        simplifiedUi?: boolean;
    };
    confirmationScreen?: {
        /** Custom destination icon and text used in checkout summary */
        destinationConfig?: FunkitUiDestinationConfig;
        /** when source and destination are the same address, show destination as payment method instead of source - defaults to false */
        preferDestinationWhenSame?: boolean;
        /** Whether to show the bottom disclaimer in a {@link FunAlert} - defaults to true */
        showDisclaimerAsAlert?: boolean;
        /** Whether to show the total payment amount in USD below the token amount equivalent - defaults to false */
        showPaymentAmountUsd?: boolean;
        /** Whether to show the total receive amount in USD below the token amount equivalent - defaults to false */
        showReceiveAmountUsd?: boolean;
        /** Whether to show the amount summary above the payment method summary rather than below - defaults to false */
        showAmountSummaryAbovePaymentMethod?: boolean;
        /**
         * Whether and how to show transaction fee's digest.
         * - "none": show nothing (default)
         * - "chainDependent": show price impact and additionally show gas as well for eth-mainnet
         */
        showTransactionDigest?: 'none' | 'chainDependent';
        /** Whether to show the amount of tokens below the USD equivalent - defaults to true */
        showTokenAmount?: boolean;
        /** Instead of showing the dollar value centered, show it left-aligned with "Deposit" label - defaults to false */
        showLeftAlignedDollarValueWithLabel?: boolean;
        /** Whether to show "Instant" instead of "< 1 min" for time estimates under 1 minute - defaults to false */
        showInstantTimeEstimate?: boolean;
        /**
         * Whether to show the "Selected Route" row (Relay / Across / passthrough).
         * Defaults to false. Providing {@link selectedRouteConfig} also shows the
         * row, for passthrough-branding back-compat.
         */
        showSelectedRoute?: boolean;
        /**
         * Passthrough-route branding (image + label) for the "Selected Route" row.
         * Defining it also shows the row; to show the row without passthrough
         * branding, use {@link showSelectedRoute} instead.
         */
        selectedRouteConfig?: FunkitUiSelectedRouteConfig;
        /**
         * How to indicate the current step during transaction progress.
         * - "spinner": show the animated spinner (default)
         * - "textual": show a textual "1 of 2" step indicator instead
         */
        stepIndicatorType?: 'spinner' | 'textual';
    };
    inputAmountScreen?: {
        /** Whether to allow entering an amount of tokens, rather than only USD - defaults to true */
        allowTokenAmountInput?: boolean;
    };
    selectAssetScreen?: {
        /** Whether the secondary token symbol is visible - defaults to true */
        isSecondaryTokenSymbolVisible?: boolean;
        /** Whether to navigate directly on asset click, rather than having to select then click Continue - defaults to false */
        navigateOnAssetClick?: boolean;
        /** Function that returns a custom React component to render before other UIs in the select asset screen */
        customTopComponent?: () => ReactNode;
    };
    transferCryptoScreen?: {
        /** Whether to show the "You Send -> You Receive" block in the transfer crypto screen - defaults to false */
        showYouSendYouReceive?: boolean;
        /** Function that returns a custom React component to render before other UIs in the transfer crypto screen */
        customTopComponent?: () => ReactNode;
    };
    withdrawalScreen?: {
        /** Function that returns a custom React component to render before other UIs in the withdrawal amount screen */
        customTopComponent?: () => ReactNode;
    };
    selectBrokerageScreen?: {
        /** Function that returns a custom React component to render before other UIs in the select brokerage screen */
        customTopComponent?: () => ReactNode;
    };
    connectExchangeScreen?: {
        /** Function that returns a custom React component to render before other UIs in the connect exchange screen */
        customTopComponent?: () => ReactNode;
        /** Function that returns a custom React component to render instead of the normal page */
        CustomComponent?: ComponentType<{
            appName: string;
            exchangeIcon: JSX.Element | null;
            exchangeName: string;
            exchangeType: BluvoExchangeType | null;
        }>;
    };
    sourceChangeScreen?: {
        bottomBarCloseButton?: {
            /** Whether the bottom bar close button is visible - defaults to false */
            enabled?: boolean;
            /** Translation key for label - defaults to `'common.close'` */
            labelKey?: 'sourceChange.exploreMarketsFirst' | 'common.close';
        };
        /** Whether to show target asset selection menu if dynamicTargetAssetCandidates exist - defaults to false */
        showTargetAssetSelection?: boolean;
        /** Whether to show wallet option when balance is insufficient - defaults to false (hides wallet) */
        showWalletOnInsufficientBalance?: boolean;
        /** Whether to show the wallet connect payment option - defaults to true */
        showWalletConnect?: boolean;
        /**
         * Renders custom content before other UIs in the source change screen.
         * Receives modal navigation handles so it can jump to another step (e.g.
         * open a transfer step). Existing zero-arg components remain valid.
         */
        customTopComponent?: (props?: SourceChangeTopComponentProps) => ReactNode;
        /**
         * Render a full-width divider beneath {@link customTopComponent} (matching
         * the target-asset selector divider). Defaults to false.
         */
        showCustomTopComponentDivider?: boolean;
        paymentMethodIcons?: {
            primary?: FunkitPaymentMethodIconsConfig;
            /** Custom secondary icon or "value icon" in the context of FunPaymentMethodItem */
            secondary?: FunkitPaymentMethodIconsConfig;
        };
    };
    customIcons?: {
        paymentDestination?: ComponentType;
        paymentSource?: ComponentType;
        timeEstimate?: ComponentType;
        youReceive?: ComponentType;
        youSend?: ComponentType;
        fiatTabIcon?: ComponentType<{
            size?: number;
        }>;
        cryptoTabIcon?: ComponentType<{
            size?: number;
        }>;
    };
    /** Font family names to pass to embedded widgets */
    customFontFamily?: {
        primary?: string;
        secondary?: string;
        tertiary?: string;
    };
}
/**
 * Makes all properties of T required except for custom components which remains optional.
 * Used for internal screen configs where we want defaults for all settings but allow
 * custom slot components to be optionally provided.
 */
type RequiredExceptCustomComponents<T> = Required<Omit<T & {}, `${string}Component`>>;
export type FunkitUiCustomizationsConfigInternal = Required<FunkitUiCustomizationsConfig> & {
    confirmationScreen: FunkitUiCustomizationsConfig['confirmationScreen'] & Required<Omit<FunkitUiCustomizationsConfig['confirmationScreen'] & {}, 'destinationConfig' | 'selectedRouteConfig'>>;
    inputAmountScreen: Required<FunkitUiCustomizationsConfig['inputAmountScreen'] & {}>;
    selectAssetScreen: RequiredExceptCustomComponents<FunkitUiCustomizationsConfig['selectAssetScreen']>;
    transferCryptoScreen: RequiredExceptCustomComponents<FunkitUiCustomizationsConfig['transferCryptoScreen']>;
    withdrawalScreen: RequiredExceptCustomComponents<FunkitUiCustomizationsConfig['withdrawalScreen']>;
    selectBrokerageScreen: RequiredExceptCustomComponents<FunkitUiCustomizationsConfig['selectBrokerageScreen']>;
    connectExchangeScreen: RequiredExceptCustomComponents<FunkitUiCustomizationsConfig['connectExchangeScreen']>;
    sourceChangeScreen: RequiredExceptCustomComponents<FunkitUiCustomizationsConfig['sourceChangeScreen']> & {
        bottomBarCloseButton: Required<Required<FunkitUiCustomizationsConfig['sourceChangeScreen'] & {}>['bottomBarCloseButton']>;
    };
};
export type FunkitConfig = {
    /** Funkit api key **/
    apiKey: string;
    /** App name **/
    appName: string;
    /** Text customizations across all widgets **/
    textCustomizations?: Partial<FunkitTextCustomizationsConfig>;
    /** UI customizations across all widgets **/
    uiCustomizations?: FunkitUiCustomizationsConfig;
    /** used to link funkit users to your own user system */
    externalUserId?: string;
    /** Disable Datadog logging - defaults to false (logging enabled) */
    disableLogging?: boolean;
};
interface FinalFunkitConfigInternal extends FunkitConfig {
    textCustomizations: FunkitTextCustomizationsConfig;
    uiCustomizations: FunkitUiCustomizationsConfigInternal;
}
export declare const FunkitConfigContext: import("react").Context<FunkitConfig>;
export declare function useFunkitConfig(): FinalFunkitConfigInternal;
export {};
