/// <reference types="react" />
import * as React from 'react';
import React__default, { ReactNode, HTMLAttributeAnchorTarget, FunctionComponent, ButtonHTMLAttributes, FC, CSSProperties } from 'react';
import * as _emotion_styled from '@emotion/styled';
import * as _emotion_react from '@emotion/react';
import { Theme } from '@emotion/react';
import { LineProps, LineSvgProps } from '@nivo/line';
import { Options } from 'react-markdown';
import { ToastContainerProps } from 'react-toastify';
import { PopoverProps as PopoverProps$1 } from 'react-tiny-popover';
import { RenderTooltipParams, RenderTooltipGlyphProps } from '@visx/xychart/lib/components/Tooltip';
import { GlyphProps } from '@visx/xychart/lib/types';
import facepaint from 'facepaint';

declare const addAlpha: (color: string, opacity: number) => string;

type BaseColorTokens = 'black' | 'white' | 'primary' | 'warning' | 'error' | 'secondary';
type ColorTokens = 'black950' | 'black900' | 'black850' | 'black800' | 'black750' | 'black700' | 'black600' | 'black500' | 'black400' | 'black300' | 'black200' | 'black100' | 'white950' | 'white900' | 'white800' | 'white700' | 'white600' | 'white500' | 'white400' | 'white300' | 'white200' | 'white100' | 'primary950' | 'primary900' | 'primary800' | 'primary700' | 'primary600' | 'primary500' | 'primary400' | 'primary300' | 'primary200' | 'primary100' | 'warning950' | 'warning900' | 'warning800' | 'warning700' | 'warning600' | 'warning500' | 'warning400' | 'warning300' | 'warning200' | 'warning100' | 'error950' | 'error900' | 'error800' | 'error700' | 'error600' | 'error500' | 'error400' | 'error300' | 'error200' | 'error100' | 'secondary950' | 'secondary900' | 'secondary800' | 'secondary700' | 'secondary600' | 'secondary500' | 'secondary400' | 'secondary300' | 'secondary200' | 'secondary100';
type ColorsTheme = Record<ColorTokens, string>;

type GetColorFromTokenParams = {
    colorToken?: ColorTokens;
    theme: Theme;
};
declare const getColorFromToken: ({ theme, colorToken }: GetColorFromTokenParams) => string;

declare const isBrightColor: (color: string) => boolean;

type SupportedMedias = 'mobileDeviceAndUp' | 'tabletDeviceAndUp' | 'smallDesktopDeviceAndUp' | 'largeDesktopDeviceAndUp' | 'desktopDeviceAndUp' | 'mobileDeviceAndDown' | 'tabletDeviceAndDown' | 'smallDesktopDeviceAndDown' | 'largeDesktopDeviceAndDown' | 'desktopDeviceAndDown' | 'mobileDeviceOnly' | 'tabletDeviceOnly' | 'smallDesktopDeviceOnly' | 'largeDesktopDeviceOnly' | 'desktopDeviceOnly';
type SupportedMediasWidths = 'mobileDevice' | 'tabletDevice' | 'smallDesktopDevice' | 'desktopDevice' | 'largeDesktopDevice';

declare const mediaBreakPoints: Record<SupportedMediasWidths, number>;

declare const useIsMobileDevice: () => boolean;
declare const useIsTabletDevice: () => boolean;
declare const useIsTabletDeviceAndDown: () => boolean;
declare const useIsSmallDesktopDeviceAndUp: () => boolean;
declare const useIsSmallDesktopDevice: () => boolean;
declare const useIsLargeDesktopDevice: () => boolean;
declare const useIsDesktopDevice: () => boolean;

type UseResponsiveQueryReturn = {
    isDesktopDeviceAndDown: boolean;
    isDesktopDeviceAndUp: boolean;
    isDesktopDeviceOnly: boolean;
    isLargeDesktopDeviceAndDown: boolean;
    isLargeDesktopDeviceAndUp: boolean;
    isLargeDesktopDeviceOnly: boolean;
    isMobileDeviceAndDown: boolean;
    isMobileDeviceAndUp: boolean;
    isMobileDeviceOnly: boolean;
    isSmallDesktopDeviceAndDown: boolean;
    isSmallDesktopDeviceAndUp: boolean;
    isSmallDesktopDeviceOnly: boolean;
    isTabletDeviceAndDown: boolean;
    isTabletDeviceAndUp: boolean;
    isTabletDeviceOnly: boolean;
};
declare const mediaQuery: Record<SupportedMedias, string>;
declare const useResponsiveQuery: () => UseResponsiveQueryReturn;

type TypographyTokens = 'h1XLBold' | 'h1XLBoldSpaced' | 'h1SmallBold' | 'h1XLRegular' | 'h1XLRegularSpaced' | 'h2Bold' | 'h2Regular' | 'h3Bold' | 'h3Regular' | 'subheaderRegular' | 'bodyXSmallMedium' | 'bodyXSmallBold' | 'bodySmallMedium' | 'bodySmallBold' | 'bodyMediumMedium' | 'bodyMediumBold' | 'bodyLargeRegular' | 'bodyLargeBold' | 'bodyExtraLargeRegular' | 'bodyExtraLargeBold' | 'bodyMegaLargeBold' | 'bodyXXLLarge' | 'bodyXXLRegular' | 'ctaBlack' | 'ctaRegular' | 'ctaLarge' | 'numberBig';
type TypographyConfig = {
    fontFamily: string;
    fontSize: string;
    fontStyle: string;
    fontWeight: string;
    letterSpacing?: string;
    lineHeight: string;
    textShadow?: string;
};
type TypographyResponsiveConfig = Record<SupportedMediasWidths, TypographyConfig>;
type TypographyTheme = Record<TypographyTokens, TypographyResponsiveConfig>;

type GetTypographyFromTokenParams$1 = {
    theme: Theme;
    token?: TypographyTokens;
};
declare const getResponsiveTypographyStyleFromToken: ({ theme, token, }: GetTypographyFromTokenParams$1) => facepaint.DynamicStyle[];

type GetTypographyFromTokenParams = {
    theme: Theme;
    token?: TypographyTokens;
};
declare const getTypographyFromToken: ({ theme, token, }: GetTypographyFromTokenParams) => TypographyResponsiveConfig;

type AppLinkProps = {
    Component?: React__default.FunctionComponent<{
        children: string | ReactNode;
        className?: string;
        'data-testid'?: string;
        disabled?: boolean;
        href?: string;
        target?: HTMLAttributeAnchorTarget | undefined;
        to: any;
    }>;
    children: string;
    className?: string;
    colorToken: ColorTokens;
    'data-testid'?: string;
    disabled?: boolean;
    disabledColorToken?: ColorTokens;
    hoverColorToken?: ColorTokens;
    target?: HTMLAttributeAnchorTarget | undefined;
    to: string;
    typographyToken: TypographyTokens;
};
declare const AppLink: React__default.FunctionComponent<AppLinkProps>;

type AttentionIndicatorProps = {
    className?: string;
    colorToken: ColorTokens;
    'data-testid'?: string;
};
declare const AttentionIndicator: React__default.FunctionComponent<AttentionIndicatorProps>;

/**
 * It takes a string, slices off the first 6 characters, slices off the last 4 characters, and returns the result
 * @param {string} address - The address to elide.
 * @returns A function that takes an address and returns a string that is the first 6 characters of the address, followed
 * by 3 dots, followed by the last 4 characters of the address.
 */
declare const formatEthereumAddress: (address?: string | null) => string;

declare const AvatarAddress: FunctionComponent<{
    address?: string | null;
    avatarSize: 'small' | 'medium';
    isEnsAddress?: boolean;
    typographyToken: TypographyTokens;
}>;

declare const AvatarAddressImage: React__default.FunctionComponent<{
    address: string;
    size: number;
    url?: string | null;
}>;

type BouncedLoadingProps = {
    colorToken?: ColorTokens;
    highlightColorToken?: ColorTokens;
};
declare const BouncedLoading: FunctionComponent<BouncedLoadingProps>;

type TypographyUIProps = {
    backgroundColorToken?: ColorTokens;
    colorToken: ColorTokens;
    typographyToken: TypographyTokens;
    whiteSpace: React__default.CSSProperties['whiteSpace'];
};

type TypographyProps = React__default.PropsWithChildren<{
    as?: React__default.ElementType;
    backgroundColorToken?: ColorTokens;
    className?: string;
    colorToken: ColorTokens | 'rainbow';
    'data-testid'?: string;
    id?: string;
    title?: string;
    typographyToken: TypographyTokens;
    whiteSpace?: TypographyUIProps['whiteSpace'];
}>;
declare const Typography: React__default.FunctionComponent<TypographyProps>;

type ButtonProps = React__default.PropsWithChildren<{
    /**
     * The background color of the button.
     */
    backgroundColorToken?: ColorTokens;
    /**
     * The border color of the button.
     */
    borderColorToken?: ColorTokens;
    /**
     * The text to display on the bottom left side of the button.
     */
    bottomLeftText?: string;
    /**
     * The color of the text on the bottom left side of the button.
     */
    bottomLeftTextColorToken?: ColorTokens;
    /**
     * The typography token of the text on the bottom left side of the button.
     */
    bottomLeftTextTypographyToken?: TypographyTokens;
    /**
     * The class name of the button.
     */
    className?: string;
    /**
     * The data-testid of the button.
     */
    'data-testid'?: string;
    /**
     * Whether the button is disabled.
     */
    disabled?: boolean;
    /**
     * The background color of the button when disabled.
     */
    disabledBackgroundColorToken?: ColorTokens;
    /**
     * The color of the text when disabled.
     */
    disabledTextColorToken?: ColorTokens;
    /**
     * The background color of the button when hovered.
     */
    hoverBackgroundColorToken?: ColorTokens;
    /**
     * The border color of the button when hovered.
     */
    hoverBorderColorToken?: ColorTokens;
    /**
     * The color of the icon when hovered.
     */
    hoverIconColorToken?: ColorTokens;
    /**
     * The color of the text when hovered.
     */
    hoverTypographyColorToken?: ColorTokens;
    /**
     * The color of the icon.
     */
    iconColorToken?: ColorTokens;
    /**
     * `iconLeft` allows you to insert a React Component (preferably an SVG) on the left side of the button content.
     * When an SVG is provided as `iconLeft`, it will inherit hover effects from the button, such as color changes.
     */
    iconLeft?: React__default.ReactNode;
    /**
     * `iconRight` allows you to insert a React Component (preferably an SVG) on the right side of the button content.
     * When an SVG is provided as `iconRight`, it will inherit hover effects from the button, such as color changes.
     */
    iconRight?: React__default.ReactNode;
    /**
     * Whether the button is loading.
     */
    loading?: boolean;
    /**
     * The function to call when the button is clicked.
     */
    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
    /**
     * The function to call when the button is mousedown.
     */
    onMouseDown?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
    /**
     * Whether the button should be rounded.
     */
    rounded?: boolean;
    /**
     * The type of the button.
     */
    type?: ButtonHTMLAttributes<HTMLButtonElement>['type'];
    /**
     * The color of the text.
     */
    typographyColorToken?: ColorTokens;
    /**
     * The typography token of the text.
     */
    typographyToken?: TypographyTokens;
    /**
     * The white space of the button.
     */
    whiteSpace?: TypographyProps['whiteSpace'];
}>;

declare const Button: React__default.FunctionComponent<ButtonProps>;

type ExclaimTooltipProps = {
    children: string | React__default.ReactNode;
    className?: string;
    iconColorToken?: ColorTokens;
    tooltipColorToken?: ColorTokens;
    tooltipTypographyToken?: TypographyTokens;
    trigger?: React__default.ReactNode;
};
declare const ExclaimTooltip: React__default.FunctionComponent<ExclaimTooltipProps>;

type ChainOption = number;
type ChainSelectorProps = {
    approving?: boolean;
    backgroundColorToken?: ColorTokens;
    borderColorToken?: ColorTokens;
    chainOptions: ChainOption[];
    disabled?: boolean;
    disabledOptions?: Record<ChainOption, boolean>;
    hoverBackgroundColorToken?: ColorTokens;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    onChainChange: (optionId: ChainOption) => void;
    selectedChainId?: ChainOption | null;
    selectedChainTypographyToken?: TypographyTokens;
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
};
declare const ChainSelector: React__default.FunctionComponent<ChainSelectorProps>;

type CloseButtonProps = {
    buttonBackgroundColorToken?: ColorTokens;
    buttonHoverBackgroundColorToken?: ColorTokens;
    className?: string;
    'data-testid'?: string;
    iconColorToken?: ColorTokens;
    iconHoverColorToken?: ColorTokens;
    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
    size?: number;
};
declare const CloseButton: FC<CloseButtonProps>;

declare const Confetti: React__default.FunctionComponent<React__default.PropsWithChildren>;

declare const DialogBox: _emotion_styled.StyledComponent<{
    theme?: _emotion_react.Theme | undefined;
    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

type DialogProps = React__default.PropsWithChildren<{
    contentContainerStyles?: CSSProperties;
    onClose?: () => void;
    open: boolean;
    unboxed?: boolean;
}>;
declare const Dialog: React__default.FunctionComponent<DialogProps>;

type DonutProps = {
    colorToken: ColorTokens;
    holeColorToken?: ColorTokens;
    percentage: number;
};
declare const Donut: FunctionComponent<DonutProps>;

declare const Ellipsis: React__default.FunctionComponent<{
    colorToken?: ColorTokens;
}>;

type ExperiencePillsProps = {
    colorToken: BaseColorTokens;
    experiencePercentage: number;
};
declare const ExperiencePills: React__default.FunctionComponent<ExperiencePillsProps>;

type ExternalLinkProps = {
    activeColorToken?: ColorTokens;
    children: string;
    className?: string;
    colorToken: ColorTokens;
    disabled?: boolean;
    disabledColorToken?: ColorTokens;
    hideArrowIcon?: boolean;
    hoverColorToken?: ColorTokens;
    href: string;
    id?: string;
    onClick?: () => void;
    typographyToken: TypographyTokens;
};
declare const ExternalLink: React__default.FunctionComponent<ExternalLinkProps>;

type CheckboxFieldProps = {
    checked: boolean;
    disabled?: boolean;
    error?: boolean;
    id?: string;
    onChange?: (checked: boolean) => void;
    size?: number;
    text: React__default.ReactNode;
};
declare const CheckboxField: React__default.FunctionComponent<CheckboxFieldProps>;

type FieldStyleProps = {
    backgroundColorToken?: ColorTokens;
    borderColorToken?: ColorTokens;
    colorToken?: ColorTokens;
    disabledBackgroundColorToken?: ColorTokens;
    disabledBorderColorToken?: ColorTokens;
    disabledColorToken?: ColorTokens;
    error?: boolean;
    errorBorderColorToken?: ColorTokens;
    errorColorToken?: ColorTokens;
    hoverBackgroundColorToken?: ColorTokens;
    hoverBorderColorToken?: ColorTokens;
    hoverColorToken?: ColorTokens;
    hoverErrorBorderColorToken?: ColorTokens;
    hoverErrorColorToken?: ColorTokens;
    placeholderColorToken?: ColorTokens;
    typographyToken?: TypographyTokens;
};

type MaxConfig = {
    onClick: () => void;
    showButton: boolean;
    value: number;
};

type CurrencyFieldProps = {
    allowNegativeValue?: boolean;
    'data-testid'?: string;
    decimalsLimit?: number;
    defaultValue?: number | string;
    disabled?: boolean;
    error?: boolean;
    id?: string;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    locale?: string;
    max?: MaxConfig;
    maxLength?: number | undefined;
    min?: number | string | undefined;
    onBlur?: () => void;
    onChange?: (value: string | undefined) => void;
    onFocus?: () => void;
    placeholder?: string;
    step?: number;
    suffix?: string;
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
    value?: string;
} & FieldStyleProps;
declare const CurrencyField: React__default.FunctionComponent<CurrencyFieldProps>;

type MarkProps = {
    colorToken: ColorTokens;
    height: number;
    highlightColorToken: ColorTokens;
    highlightEveryNthMark: number;
    step: number;
    trackHeight: number;
};

type ThumbProps = {
    colorToken: ColorTokens;
    disabled: boolean;
    hideValue: boolean;
    size: number;
    trackHeight: number;
    valueFormatter: (value: number) => string;
};

type RangeFieldProps = {
    disabled?: boolean;
    hideValue?: boolean;
    highlightEveryNthMark?: MarkProps['highlightEveryNthMark'];
    markColorToken?: MarkProps['colorToken'];
    markHeight?: MarkProps['height'];
    markHighlightColorToken?: MarkProps['highlightColorToken'];
    onChange?: (value: number) => void;
    step?: MarkProps['step'];
    thumbColorToken?: ThumbProps['colorToken'];
    thumbSize?: ThumbProps['size'];
    trackColorToken?: 'transparent' | ColorTokens;
    trackHeight?: number;
    value?: number;
    valueFormatter?: ThumbProps['valueFormatter'];
};
declare const RangeField: ({ highlightEveryNthMark, thumbColorToken, trackColorToken, markHighlightColorToken, markColorToken, trackHeight, thumbSize, markHeight, onChange, value, step, valueFormatter, disabled, hideValue, }: RangeFieldProps) => React__default.JSX.Element;

type BaseItem = {
    id: string;
    label: string;
};
type SearchItemRendererProps = {
    item: BaseItem;
    searchedValue?: string;
};
type SearchListProps = {
    itemFilter?: (item: BaseItem, value: string) => boolean;
    itemRenderer?: React__default.FunctionComponent<SearchItemRendererProps>;
    items: BaseItem[];
    onItemClick: (item: BaseItem, e: React__default.MouseEvent<HTMLDivElement, MouseEvent>) => void;
    parentWidth: number;
    searchedValue?: string;
    selectedItemUntouched: boolean;
};

type SearchItem = SearchListProps['items'][0];
type SearchFieldProps = {
    className?: string;
    disabled?: boolean;
    error?: boolean;
    id?: string;
    itemFilter?: SearchListProps['itemFilter'];
    itemRenderer?: SearchListProps['itemRenderer'];
    items: SearchListProps['items'];
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    onChange?: (value: string) => void;
    onFocus?: () => void;
    onItemSelected?: (id: SearchItem['id'], e: React__default.MouseEvent<HTMLDivElement, MouseEvent>) => void;
    placeHolder?: string;
    selectedItemId?: SearchItem['id'];
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
} & FieldStyleProps;
declare const SearchField: FC<SearchFieldProps>;

type TextFieldProps = {
    autoFocus?: boolean;
    bottomLeftText?: string;
    bottomLeftTextColorToken?: ColorTokens;
    bottomLeftTextTypographyToken?: TypographyTokens;
    disabled?: boolean;
    error?: boolean;
    id?: string;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    name?: string;
    onChange?: (value: string | undefined) => void;
    onFocus?: () => void;
    placeHolder?: string;
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
    type?: HTMLInputElement['type'];
    value?: string;
} & FieldStyleProps;
declare const TextField: React__default.FunctionComponent<TextFieldProps>;

type ToggleFieldProps = {
    checked: boolean;
    disabled?: boolean;
    id?: string;
    onChange?: (checked: boolean) => void;
};
declare const ToggleField: React__default.FunctionComponent<ToggleFieldProps>;

type SupportedChainIcons = keyof typeof CHAIN_ICON_MAP;
declare const CHAIN_ICON_MAP: {
    1: React.FC<React.SVGProps<SVGSVGElement>>;
    10: React.FC<React.SVGProps<SVGSVGElement>>;
    1101: React.FC<React.SVGProps<SVGSVGElement>>;
    11155111: React.FC<React.SVGProps<SVGSVGElement>>;
    11155420: React.FC<React.SVGProps<SVGSVGElement>>;
    137: React.FC<React.SVGProps<SVGSVGElement>>;
    1442: React.FC<React.SVGProps<SVGSVGElement>>;
    1729: React.FC<React.SVGProps<SVGSVGElement>>;
    420: React.FC<React.SVGProps<SVGSVGElement>>;
    42161: React.FC<React.SVGProps<SVGSVGElement>>;
    421613: React.FC<React.SVGProps<SVGSVGElement>>;
    421614: React.FC<React.SVGProps<SVGSVGElement>>;
    42170: React.FC<React.SVGProps<SVGSVGElement>>;
    5: React.FC<React.SVGProps<SVGSVGElement>>;
    80001: React.FC<React.SVGProps<SVGSVGElement>>;
    8453: React.FC<React.SVGProps<SVGSVGElement>>;
    89346161: React.FC<React.SVGProps<SVGSVGElement>>;
};

type IconProps$2 = {
    chainId: SupportedChainIcons;
    className?: string;
    'data-testid'?: string;
};

type ChainIconProps = Omit<IconProps$2, 'chainId'> & {
    chainId: number;
    'data-testid'?: string;
    size?: number;
};
declare const ChainIcon: React__default.FunctionComponent<ChainIconProps>;

type IconProps$1 = {
    className?: string;
    'data-testid'?: string;
    height?: number;
    market: SupportedMarkets | string;
    width?: number;
};
type SupportedMarkets = 'arb' | 'avax' | 'op' | 'aave' | 'compound' | 'crv' | 'glp' | 'sofr' | 'lido' | 'link' | 'mkr' | 'rocket' | 'sol' | 'uni' | 'usde' | 'sui' | 'tia' | 'xrp' | 'sei' | 'zro';

type MarketIconProps = IconProps$1 & {
    size?: number;
};
declare const MarketIcon: React__default.FunctionComponent<MarketIconProps>;

type IconProps = {
    className?: string;
    'data-testid'?: string;
    height?: number;
    token: SupportedTokenIcons | string;
    width?: number;
};
type SupportedTokenIcons = 'mega' | 'aster' | 'linea' | 'wlfi' | 'xpl' | 'yzy' | 'paxg' | 'wsteth' | 'aero' | 'syrup' | 'zora' | 'morpho' | 'kaito' | 'pump' | 'bera' | 'layer' | 'tao' | 'ip' | 'me' | 'ape' | 'ondo' | 'move' | 'inj' | 'griffain' | 'atom' | 'wld' | 'ton' | 'trx' | 'ai16z' | 'aixbt' | 'fartcoin' | 'hype' | 's' | 'virtual' | 'trump' | 'jup' | 'dot' | 'ltc' | 'pyth' | 'pengu' | 'goat' | 'grass' | 'kneiro' | 'eigen' | 'ena' | 'ftm' | 'near' | 'pendle' | 'ada' | 'ldo' | 'pol' | 'apt' | 'bnb' | 'jto' | 'popcat' | 'kbonk' | 'aave' | 'arb' | 'op' | 'avax' | 'btc' | 'dai' | 'deusd' | 'crv' | 'eth' | 'link' | 'matic' | 'mkr' | 'reth' | 'rusd' | 'sdeusd' | 'seth' | 'sol' | 'susde' | 'usdc' | 'usdc.e' | 'usde' | 'usdt' | 'wbtc' | 'weth' | 'uni' | 'sui' | 'tia' | 'prove' | 'xrp' | 'sei' | 'zro' | 'srusd' | 'wif' | 'kpepe' | 'doge' | 'kshib';

type TokenIconProps = IconProps & {
    size?: number;
};
declare const TokenIcon: React__default.FunctionComponent<TokenIconProps>;

type TokenFieldProps = {
    allowNegativeValue?: boolean;
    bottomLeftText?: string;
    bottomLeftTextColorToken?: ColorTokens;
    bottomLeftTextTypographyToken?: TypographyTokens;
    bottomRightTextColorToken?: ColorTokens;
    bottomRightTextDifferenceColorToken?: ColorTokens;
    bottomRightTextDifferenceValue?: number;
    bottomRightTextToken?: string;
    bottomRightTextTokenColorToken?: ColorTokens;
    bottomRightTextTypographyToken?: TypographyTokens;
    bottomRightTextValue?: string | number;
    className?: string;
    decimalsLimit?: number;
    defaultValue?: number | string;
    disabled?: boolean;
    error?: boolean;
    hideTokenIcon?: boolean;
    id?: string;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    locale?: string;
    max?: MaxConfig;
    maxLength?: number | undefined;
    min?: number;
    onBlur?: () => void;
    onChange?: (value: string | undefined) => void;
    onFocus?: () => void;
    onTokenOptionSelected?: (selectedToken: string) => void;
    placeholder?: string;
    prefixToken?: string;
    step?: number;
    token?: TokenIconProps['token'];
    tokenColorToken?: ColorTokens;
    tokenFormatter?: (token: string | undefined) => string;
    tokenOptions?: string[];
    tokenTypographyToken?: TypographyTokens;
    tooltip?: ExclaimTooltipProps['children'];
    topRightText?: string;
    topRightTextColorToken?: ColorTokens;
    topRightTextTypographyToken?: TypographyTokens;
    value?: string;
} & FieldStyleProps;
declare const TokenField: FC<TokenFieldProps>;

type TokenLabelFieldProps = {
    allowNegativeValue?: boolean;
    autoFocus?: boolean;
    bottomLeftText?: string;
    bottomLeftTextColorToken?: ColorTokens;
    bottomLeftTextTypographyToken?: TypographyTokens;
    bottomRightTextColorToken?: ColorTokens;
    bottomRightTextDifferenceColorToken?: ColorTokens;
    bottomRightTextDifferenceValue?: number;
    bottomRightTextToken?: string;
    bottomRightTextTokenColorToken?: ColorTokens;
    bottomRightTextTypographyToken?: TypographyTokens;
    bottomRightTextValue?: string | number;
    className?: string;
    decimalsLimit?: number;
    defaultValue?: number | string;
    disabled?: boolean;
    error?: boolean;
    hideTokenIcon?: boolean;
    id?: string;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    locale?: string;
    max?: MaxConfig;
    maxLength?: number;
    min?: number;
    onBlur?: () => void;
    onChange?: (value: string | undefined) => void;
    onFocus?: () => void;
    onTokenOptionSelected?: (selectedToken: string) => void;
    placeholder?: string;
    prefixToken?: string;
    step?: number;
    token?: TokenIconProps['token'] | ReactNode;
    tokenColorToken?: ColorTokens;
    tokenFormatter?: (token: string | undefined) => string;
    tokenOptions?: string[];
    tokenTypographyToken?: TypographyTokens;
    tooltip?: ExclaimTooltipProps['children'];
    topRightText?: string;
    topRightTextColorToken?: ColorTokens;
    topRightTextTypographyToken?: TypographyTokens;
    value?: string;
} & FieldStyleProps;
declare const TokenLabelField: React__default.FunctionComponent<TokenLabelFieldProps>;

type FromToTokenTypographyProps = {
    fromColorToken: ColorTokens;
    fromPrefixColorToken?: ColorTokens;
    fromPrefixToken?: string;
    fromToken?: string;
    fromTokenColorToken?: ColorTokens;
    fromValue: string | number;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    toColorToken: ColorTokens;
    toPrefixColorToken?: ColorTokens;
    toPrefixToken?: string;
    toToken?: string;
    toTokenColorToken?: ColorTokens;
    toValue: string | number;
    token?: string;
    tokenColorToken?: ColorTokens;
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
    typographyToken: TypographyTokens;
};
declare const FromToTokenTypography: React__default.FunctionComponent<FromToTokenTypographyProps>;

declare const GlobalScrollbarStyle: React__default.FunctionComponent;

type HighlightProps = {
    children: string;
    highlight: string | undefined;
};
declare const Highlight: React__default.FunctionComponent<HighlightProps>;

declare const HorizontalLine: _emotion_styled.StyledComponent<{
    theme?: _emotion_react.Theme | undefined;
    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

type LabelTokenTypographyProps = {
    attentionIndicatorColorToken?: ColorTokens;
    colorToken: ColorTokens;
    colorToken2?: ColorTokens;
    differenceColorToken?: ColorTokens;
    differenceToken?: string;
    differenceValue?: number;
    label: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken: ColorTokens;
    labelTypographyToken: TypographyTokens;
    prefixColorToken?: ColorTokens;
    prefixToken?: string;
    slashColorToken?: ColorTokens;
    token: string;
    tokenColorToken?: ColorTokens;
    tokenColorToken2?: ColorTokens;
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
    typographyToken: TypographyTokens;
    value: string | number;
    value2?: string | number;
    whiteSpace?: TypographyProps['whiteSpace'];
};
declare const LabelTokenTypography: React__default.FunctionComponent<LabelTokenTypographyProps>;

type YMarkerConfig = {
    colorToken: ColorTokens;
    text: string;
    typographyToken: TypographyTokens;
    value: number;
};
type TooltipConfig = {
    token: string;
    tokenColorToken: ColorTokens;
};
type LineChartTooltipFC = LineProps['tooltip'];
type LineChartTooltip = LineChartTooltipFC | TooltipConfig;
type XDataType = number | Date;
type YDataType = number;
type LineChartProps = {
    axisBottomFormat?: 'minutes' | 'days' | 'hours';
    axisDomainLineColorToken?: ColorTokens | 'transparent';
    axisTickPadding?: number;
    axisTicksTextColorToken?: ColorTokens;
    axisTypographyToken: TypographyTokens;
    crosshairColorToken: ColorTokens;
    curveType?: LineProps['curve'];
    data: {
        colorToken: ColorTokens;
        data: {
            x: XDataType;
            y: YDataType;
        }[];
        id: string;
        tooltip?: LineChartTooltip;
    }[];
    enablePoints?: LineSvgProps['enablePoints'];
    enableTooltip?: boolean;
    visibleAxis?: ('top' | 'bottom' | 'right' | 'left')[];
    withoutAxis?: boolean;
    withoutMargins?: boolean;
    xFormatter?: (x: XDataType) => string;
    xScaleMax?: XDataType;
    xScaleMin?: XDataType;
    xScaleType?: 'time' | 'linear';
    yAxisTopOffsetPercentage?: number;
    yFormatter?: (y: YDataType) => string;
    yMarker?: YMarkerConfig;
    yScaleMax?: YDataType;
    yScaleMin?: YDataType;
    yScaleStacked?: boolean;
};

declare const LineChart: React__default.FunctionComponent<LineChartProps>;

type Props = {
    color?: ColorTokens;
    count?: number;
    gap?: number;
    size?: number;
};
declare const LoadingBoxes: FC<Props>;

declare const MarkdownPreview: React__default.FunctionComponent<{
    children: Options['children'];
    className?: string;
    colorToken: ColorTokens;
    components?: Options['components'];
}>;

type TabProps$1 = {
    Component?: React__default.FunctionComponent | null;
    disabled?: boolean;
    id: string;
    label: string;
};
type MobileTabsProps = {
    activeTabColorToken: ColorTokens;
    activeTabId?: TabProps$1['id'] | null;
    backgroundColorToken: ColorTokens;
    borderColorToken: ColorTokens;
    colorToken: ColorTokens;
    hoverTabColorToken?: ColorTokens;
    onTabChange: (id: TabProps$1['id']) => void;
    tabs: TabProps$1[];
    typographyToken: TypographyTokens;
};
declare const MobileTabs: React__default.FunctionComponent<MobileTabsProps>;

type SubLinkProps = {
    Component?: React__default.FunctionComponent<{
        children: string | ReactNode;
        className?: string;
        'data-testid'?: string;
        disabled?: boolean;
        href?: string;
        target?: HTMLAttributeAnchorTarget | undefined;
        to: any;
    }>;
    isActive: boolean;
    isNew: boolean;
    link: string;
    onClick: () => void;
    target?: HTMLAttributeAnchorTarget | undefined;
    text: string;
};

type SubLinksProps = {
    Component?: SubLinkProps['Component'];
    onClick: () => void;
    onSubLinkClick?: (href?: string) => void;
    subLinks: {
        isNew?: boolean;
        link: string;
        target?: HTMLAttributeAnchorTarget | undefined;
        text: string;
    }[];
};

type NavLinkProps = React__default.PropsWithChildren<{
    Component?: SubLinksProps['Component'];
    className?: string;
    colorToken?: BaseColorTokens | 'rainbow';
    isNew?: boolean;
    itemContainerStyles?: CSSProperties;
    link?: string;
    onItemClicked?: (href?: string) => void;
    subLinks?: {
        isHidden?: boolean;
        isNew?: boolean;
        link: string;
        target?: HTMLAttributeAnchorTarget | undefined;
        text: string;
    }[];
    target?: HTMLAttributeAnchorTarget | undefined;
    typographyToken?: TypographyTokens;
}>;
declare const NavLink: React__default.FunctionComponent<NavLinkProps>;

type NavProps = {
    Component?: NavLinkProps['Component'];
    className?: string;
    id?: string;
    itemContainerStyles?: CSSProperties;
    links: (NavLinkProps & {
        isHidden?: boolean;
        text: string;
    })[];
    onItemClick?: (href?: string) => void;
    responsive?: boolean;
    typographyToken?: TypographyTokens;
};
declare const Nav: React__default.FunctionComponent<NavProps>;

type ShowNotificationParams = {
    Component?: React__default.FunctionComponent;
    autoClose?: number | false;
    colorToken: BaseColorTokens;
    content: string;
    contentTypographyToken?: TypographyTokens;
    onCloseNotification?: () => void;
    title: string;
    titleTypographyToken?: TypographyTokens;
};
type ShowCustomNotificationParams = {
    Component: React__default.FunctionComponent;
    autoClose?: number | false;
};
declare const showNotification: ({ titleTypographyToken, contentTypographyToken, content, title, colorToken, autoClose, onCloseNotification, }: ShowNotificationParams) => void;
declare const showCustomNotification: ({ autoClose, Component, }: ShowCustomNotificationParams) => void;
declare const Notifications: React__default.FC<ToastContainerProps>;

type OptionsProps = {
    activeOptionId: string;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    onOptionClick: (optionId: string) => void;
    options: {
        activeBackgroundColorToken?: ColorTokens;
        activeBorderColorToken?: ColorTokens;
        activeHoverBorderColorToken?: ColorTokens;
        activeTypographyColorToken?: ColorTokens;
        backgroundColorToken: ColorTokens;
        borderColorToken: ColorTokens;
        hoverBorderColorToken: ColorTokens;
        id: string;
        label: string;
        typographyColorToken: ColorTokens;
    }[];
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
    typographyToken: TypographyTokens;
};
declare const OptionButtons: React__default.FunctionComponent<OptionsProps>;

declare const Page: React__default.FunctionComponent<React__default.PropsWithChildren>;

type PaginationProps = {
    disabled?: boolean;
    maxPages: number;
    onNextPageClick: () => void;
    onPreviousPageClick: () => void;
    page: number;
};
declare const Pagination: React__default.FunctionComponent<PaginationProps>;

type PillVariant = 'regular' | 'compact';

type PillProps = {
    backgroundColorToken: ColorTokens;
    children: string;
    className?: string;
    colorToken: ColorTokens | 'rainbow';
    'data-testid'?: string;
    onClick?: (event: React__default.MouseEvent<HTMLDivElement>) => void;
    typographyToken: TypographyTokens;
    variant: PillVariant;
};
declare const Pill: ({ "data-testid": dataTestId, typographyToken, children, className, variant, onClick, colorToken, backgroundColorToken, }: PillProps) => React__default.JSX.Element;

type PillSelectorVariant = 'compact' | 'regular';

type PillSelectorId = string;
type PillSelectorProps = {
    activePillId: PillSelectorId;
    attentionPrefixColorToken?: BaseColorTokens;
    disabled?: boolean;
    error?: boolean;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    onPillClick: (id: PillSelectorId) => void;
    pillOptions: {
        attentionPrefixText?: string;
        id: PillSelectorId;
        label: string;
    }[];
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
    variant: PillSelectorVariant;
};
declare const PillSelector: ({ error, pillOptions, activePillId, onPillClick, disabled, attentionPrefixColorToken, variant, label, labelTypographyToken, labelColorToken, tooltip, tooltipColorToken, labelAttentionIndicatorColorToken, }: PillSelectorProps) => React__default.JSX.Element;

type PopoverProps = {
    align?: PopoverProps$1['align'];
    children: PopoverProps$1['children'];
    containerClassName?: PopoverProps$1['containerClassName'];
    containerStyle?: PopoverProps$1['containerStyle'];
    content: PopoverProps$1['content'];
    'data-testid'?: string;
    isOpen: PopoverProps$1['isOpen'];
    onClickOutside: PopoverProps$1['onClickOutside'];
};
declare const Popover: React__default.FunctionComponent<PopoverProps>;

type ProgressBarProps = {
    backgroundColorToken?: 'transparent' | ColorTokens;
    barColorToken?: ColorTokens;
    className?: string;
    height?: number;
    percentageComplete: number;
    rounded?: boolean;
};
declare const ProgressBar: ({ barColorToken, backgroundColorToken, percentageComplete, height, className, rounded, }: ProgressBarProps) => React__default.JSX.Element;

type RainbowLoaderProps = {
    className?: string;
    'data-testid'?: string;
    height: number;
    text?: string;
};
declare const RainbowLoader: React__default.FunctionComponent<RainbowLoaderProps>;

type SelectOption<IdType extends string | number> = {
    icon?: React__default.ReactNode;
    id: IdType;
    isDisabled?: boolean;
    name: string;
};
type SelectProps<Option extends SelectOption<string | number>> = {
    approving?: boolean;
    disabled?: boolean;
    label?: string;
    labelAttentionIndicatorColorToken?: ColorTokens;
    labelColorToken?: ColorTokens;
    labelTypographyToken?: TypographyTokens;
    onOptionChange: (optionId: Option['id']) => void;
    optionItemStyles?: CSSProperties;
    options: Option[];
    optionsContainerStyles?: CSSProperties;
    optionsTypographyToken?: TypographyTokens;
    placeholder?: string;
    popoverContainerStyle?: Partial<CSSStyleDeclaration>;
    renderItem?: ({ option, onClick, disabled, }: {
        disabled?: boolean;
        onClick: (optionId: Option['id']) => void;
        option: Option;
    }) => React__default.ReactNode;
    selectBoxStyles?: CSSProperties;
    selectedOptionId?: Option['id'] | null;
    tooltip?: ExclaimTooltipProps['children'];
    tooltipColorToken?: ColorTokens;
};
declare function Select<Option extends SelectOption<string | number>>({ options, selectedOptionId, onOptionChange, approving, disabled, label, labelColorToken, labelTypographyToken, labelAttentionIndicatorColorToken, tooltip, tooltipColorToken, placeholder, optionsTypographyToken, selectBoxStyles, optionItemStyles, optionsContainerStyles, renderItem, popoverContainerStyle, }: SelectProps<Option>): React__default.JSX.Element | null;

declare const Skeleton: React__default.FunctionComponent<{
    className?: string;
    colorToken: ColorTokens;
    'data-testid'?: string;
    typographyToken?: TypographyTokens;
    variant: 'rectangular' | 'circular';
}>;

type TabProps = {
    Component?: React__default.FunctionComponent | null;
    disabled?: boolean;
    id: string;
    label: string;
};
type TabsResponsivenessStateConfig = {
    allowExpansion: boolean;
    allowHiding: boolean;
    isInitiallyExpanded: boolean;
    isInitiallyHidden: boolean;
};
type TabsProps = {
    activeTabColorToken: ColorTokens;
    activeTabId?: TabProps['id'] | null;
    backgroundColorToken: ColorTokens;
    borderColorToken: ColorTokens;
    colorToken: ColorTokens;
    hoverTabColorToken?: ColorTokens;
    onTabChange?: (id: TabProps['id']) => void;
    onTabsExpand?: (isExpanded: boolean) => void;
    onTabsHide?: (isHidden: boolean) => void;
    tabs: TabProps[];
    tabsResponsivenessStateConfig?: Partial<TabsResponsivenessStateConfig>;
    typographyToken: TypographyTokens;
};
declare const Tabs: FC<TabsProps>;

type ToggleCaretProps = {
    arrowColor?: ColorTokens;
    className?: string;
    disabled?: boolean;
    isOpen: boolean;
    onClick?: (e: React__default.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
};
declare const ToggleCaret: FC<ToggleCaretProps>;

type TokenTypographyProps = {
    as?: TypographyProps['as'];
    attentionIndicatorColorToken?: ColorTokens;
    className?: string;
    colorToken: ColorTokens;
    colorToken2?: ColorTokens;
    'data-testid'?: string;
    differenceColorToken?: ColorTokens;
    differenceToken?: string;
    differenceValue?: number;
    prefixColorToken?: ColorTokens;
    prefixToken?: string;
    slashColorToken?: ColorTokens;
    token: string;
    token2?: string;
    tokenColorToken?: ColorTokens;
    tokenColorToken2?: ColorTokens;
    typographyToken: TypographyTokens;
    value: string | number;
    value2?: string | number;
    whiteSpace?: TypographyProps['whiteSpace'];
};
declare const TokenTypography: React__default.FunctionComponent<TokenTypographyProps>;

type TooltipProps = {
    children: string | React__default.ReactNode;
    className?: string;
    colorToken?: ColorTokens;
    trigger: string | React__default.ReactNode;
    typographyToken?: TypographyTokens;
};
declare const Tooltip: React__default.FunctionComponent<TooltipProps>;

type TypographyWithTooltipProps = React__default.PropsWithChildren<{
    colorToken: TypographyProps['colorToken'];
    'data-testid'?: string;
    textDecorationColorToken?: ColorTokens;
    tooltip: ExclaimTooltipProps['children'];
    tooltipColorToken?: ExclaimTooltipProps['tooltipColorToken'];
    tooltipIconColorToken?: ExclaimTooltipProps['iconColorToken'];
    tooltipTypographyToken?: ExclaimTooltipProps['tooltipTypographyToken'];
    trigger?: 'text' | 'icon';
    typographyToken: TypographyProps['typographyToken'];
    whiteSpace?: TypographyProps['whiteSpace'];
}>;
declare const TypographyWithTooltip: React__default.FunctionComponent<TypographyWithTooltipProps>;

declare const UnstyledButton: _emotion_styled.StyledComponent<{
    theme?: _emotion_react.Theme | undefined;
    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
} & {
    display?: string | undefined;
}, React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;

type VisxTimelineChartDatum = {
    metadata?: Record<string, unknown>;
    x: number;
    y: number;
};
type VisxTimelineChartProps = {
    axisDomainLineColorToken?: ColorTokens | 'transparent';
    axisNumTicks?: number;
    axisTicksTextColorToken?: ColorTokens;
    axisTypographyToken: TypographyTokens;
    chartType: 'glyph' | 'line' | 'area' | 'areastack' | 'none';
    crosshairColorToken?: ColorTokens;
    curveType?: 'linear' | 'cardinal' | 'step';
    marginLeft?: 'auto' | number;
    marginRight?: 'auto' | number;
    minZoomDomain?: number;
    renderGlyph?: React__default.FC<GlyphProps<VisxTimelineChartDatum>>;
    renderTooltip?: (_: RenderTooltipParams<VisxTimelineChartDatum>) => React__default.ReactNode;
    renderTooltipGlyph?: React__default.FC<RenderTooltipGlyphProps<VisxTimelineChartDatum>>;
    series: {
        colorToken: ColorTokens;
        data: VisxTimelineChartDatum[];
        id: string;
    }[];
    sharedTooltip?: boolean;
    showGridColumns?: boolean;
    showGridRows?: boolean;
    stackOffset?: 'wiggle' | 'expand' | 'diverging' | 'silhouette';
    tickLength?: number;
    tooltipShowHorizontalCrosshair?: boolean;
    tooltipShowVerticalCrosshair?: boolean;
    tooltipSnapTooltipToDatumX?: boolean;
    tooltipSnapTooltipToDatumY?: boolean;
    xAxisOrientation?: 'top' | 'bottom';
    xAxisTickFormatter?: AxisFormatterFn;
    yAxisOrientation?: 'left' | 'right';
    yAxisTickFormatter?: AxisFormatterFn;
    yRangePercentageOffset?: number;
};
type AxisFormatterFn = (axisValue: number, _?: {
    numTicks: number;
    zoom: number;
    zoomDomain: number;
}) => string;

declare const defaultTimelineXAxisTickTimeFormatter: NonNullable<VisxTimelineChartProps['xAxisTickFormatter']>;
declare const defaultTimelineYAxisTickFormatter: NonNullable<VisxTimelineChartProps['yAxisTickFormatter']>;
declare const VisxTimelineChart: React__default.FunctionComponent<VisxTimelineChartProps>;

type GradientTokens = 'background' | 'rainbow' | 'invertedRainbow';
type GradientsTheme = Record<GradientTokens, string>;

type LayerIndexToken = 'background' | 'dialog' | 'pageContent' | 'popover' | 'tooltip';
type LayerIndexesTheme = Record<LayerIndexToken, number>;

type BrokoliTheme = {
    colors: ColorsTheme;
    gradients: GradientsTheme;
    layerIndexes: LayerIndexesTheme;
    typography: TypographyTheme;
};

type ThemeProviderProps = React__default.PropsWithChildren<{
    theme: 'voltz' | 'reya';
}>;
declare const ThemeProvider: React__default.FunctionComponent<ThemeProviderProps>;

declare function browserI18n(locale?: string): {
    calendar: string;
    decimals: string;
    group: boolean;
    locale: string;
    sign: "auto" | "always" | "never" | "exceptZero" | undefined;
    thousands: string;
    timeZone: string;
};

/**
 * Creates a CSS transition property value string.
 *
 * @param {object} options - An object containing the transition options.
 * @param {string|string[]} [options.properties='all'] - Specifies the CSS properties to which the transition effect should apply.
 * @param {number} [options.duration=200] - Defines the duration of the transition effect in milliseconds.
 * @param {('ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear')} [options.timingFunction='ease-in'] - Specifies the timing function of the transition effect.
 * @return {string} A concatenated string representing the CSS transition property value.
 */
type TimingFunctionType = 'linear' | 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'step-start' | 'step-end' | string;
type TransitionArgs = {
    duration?: number;
    properties?: string | string[];
    timingFunction?: TimingFunctionType;
};
declare const createTransition: ({ properties, duration, timingFunction, }?: TransitionArgs) => string;

declare const useScrollDetector: () => {
    hasScrolled: boolean;
};

type UseTabVisibilityParams = {
    onHidden?: () => void;
    onVisible?: () => void;
};
/**
 * Custom hook that triggers actions based on the visibility of the browser tab.
 * @param actions - An optional object containing the actions to be performed when the tab becomes visible or hidden.
 */
declare const useTabVisibility: ({ onVisible, onHidden }?: UseTabVisibilityParams) => void;

declare const shouldNotForwardProps: (excludedProps?: string[]) => {
    shouldForwardProp: (prop: string) => boolean;
};

export { AppLink, AppLinkProps, AttentionIndicator, AttentionIndicatorProps, AvatarAddress, AvatarAddressImage, BaseColorTokens, BouncedLoading, BouncedLoadingProps, BrokoliTheme, Button, ButtonProps, ChainIcon, ChainIconProps, ChainOption, ChainSelector, ChainSelectorProps, CheckboxField, CheckboxFieldProps, CloseButton, CloseButtonProps, ColorTokens, ColorsTheme, Confetti, CurrencyField, Dialog, DialogBox, Donut, DonutProps, Ellipsis, ExclaimTooltip, ExclaimTooltipProps, ExperiencePills, ExperiencePillsProps, ExternalLink, FromToTokenTypography, FromToTokenTypographyProps, GlobalScrollbarStyle, GradientTokens, GradientsTheme, Highlight, HorizontalLine, LabelTokenTypography, LabelTokenTypographyProps, LayerIndexToken, LayerIndexesTheme, LineChart, LineChartProps, LineChartTooltip, LineChartTooltipFC, LoadingBoxes, MarkdownPreview, MarketIcon, MarketIconProps, MobileTabs, MobileTabsProps, Nav, NavLink, NavLinkProps, NavProps, Notifications, OptionButtons, OptionsProps, Page, Pagination, PaginationProps, Pill, PillProps, PillSelector, PillSelectorProps, Popover, ProgressBar, ProgressBarProps, RainbowLoader, RainbowLoaderProps, RangeField, RangeFieldProps, SearchField, SearchFieldProps, Select, SelectOption, SelectProps, ShowCustomNotificationParams, ShowNotificationParams, Skeleton, SupportedMedias, SupportedMediasWidths, Tabs, TabsProps, TextField, TextFieldProps, ThemeProvider, ThemeProviderProps, ToggleCaret, ToggleCaretProps, ToggleField, ToggleFieldProps, TokenField, TokenFieldProps, TokenIcon, TokenIconProps, TokenLabelField, TokenLabelFieldProps, TokenTypography, TokenTypographyProps, Tooltip, TooltipProps, Typography, TypographyConfig, TypographyProps, TypographyResponsiveConfig, TypographyTheme, TypographyTokens, TypographyWithTooltip, TypographyWithTooltipProps, UnstyledButton, VisxTimelineChart, VisxTimelineChartDatum, VisxTimelineChartProps, XDataType, YDataType, YMarkerConfig, addAlpha, browserI18n, createTransition, defaultTimelineXAxisTickTimeFormatter, defaultTimelineYAxisTickFormatter, formatEthereumAddress, getColorFromToken, getResponsiveTypographyStyleFromToken, getTypographyFromToken, isBrightColor, mediaBreakPoints, mediaQuery, shouldNotForwardProps, showCustomNotification, showNotification, useIsDesktopDevice, useIsLargeDesktopDevice, useIsMobileDevice, useIsSmallDesktopDevice, useIsSmallDesktopDeviceAndUp, useIsTabletDevice, useIsTabletDeviceAndDown, useResponsiveQuery, useScrollDetector, useTabVisibility };