import type { Color, SeverityColors } from '@digdir/designsystemet-types';
import { type HTMLAttributes } from 'react';
import type { DefaultProps } from '../../types';
import type { MergeRight } from '../../utilities';
export type BadgeProps = MergeRight<DefaultProps & HTMLAttributes<HTMLSpanElement>, {
    /**
     * The number to display in the badge
     */
    count?: number;
    /**
     * The maximum number to display in the badge, when the count exceeds this number, the badge will display `{max}+`
     */
    maxCount?: number;
    /**
     * Change the background color of the badge.
     *
     * @default 'base'
     */
    variant?: 'base' | 'tinted';
    /**
     * Change the color scheme of the badge
     */
    'data-color'?: Color | SeverityColors;
    children?: never;
}>;
/**
 * `Badge` is a non-interactive component for displaying status with or without numbers.
 *
 * @example without children
 * <Badge count={5} maxCount={10} />
 *
 * @example with children
 * <Badge count={5} maxCount={10}>
 *   <Icon />
 * </Badge>
 */
export declare const Badge: import("react").ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLSpanElement>, "data-color" | "children" | "variant" | "count" | "maxCount"> & {
    /**
     * The number to display in the badge
     */
    count?: number;
    /**
     * The maximum number to display in the badge, when the count exceeds this number, the badge will display `{max}+`
     */
    maxCount?: number;
    /**
     * Change the background color of the badge.
     *
     * @default 'base'
     */
    variant?: "base" | "tinted";
    /**
     * Change the color scheme of the badge
     */
    'data-color'?: Color | SeverityColors;
    children?: never;
} & import("react").RefAttributes<HTMLSpanElement>>;
//# sourceMappingURL=badge.d.ts.map