import { ColorProps } from 'styled-system';
export declare type BadgeTypes = 'default' | 'success' | 'warning' | 'danger' | 'info' | 'important';
export declare type BadgeSizes = 'small' | 'medium';
export declare type BadgeProps = ColorProps & {
    /** One of 'default', 'success', 'warning', 'danger', 'info', 'important' */
    type?: BadgeTypes;
    /** One of 'small', 'medium' */
    size?: BadgeSizes;
};
export declare const Badge: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, import("react").HTMLAttributes<HTMLSpanElement> & ColorProps & {
    /** One of 'default', 'success', 'warning', 'danger', 'info', 'important' */
    type?: BadgeTypes;
    /** One of 'small', 'medium' */
    size?: BadgeSizes;
}, any>;
export declare const PillBadge: import("@emotion/styled-base").StyledComponent<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & ColorProps & {
    /** One of 'default', 'success', 'warning', 'danger', 'info', 'important' */
    type?: BadgeTypes;
    /** One of 'small', 'medium' */
    size?: BadgeSizes;
} & {
    theme?: any;
} & import("react").Attributes, import("react").HTMLAttributes<HTMLSpanElement> & ColorProps & {
    /** One of 'default', 'success', 'warning', 'danger', 'info', 'important' */
    type?: BadgeTypes;
    /** One of 'small', 'medium' */
    size?: BadgeSizes;
}, any>;