import { ComponentPropsWithoutRef } from 'react';
import { LayoutUtilProps } from '../../types';
/**
 * Props for the Badge component
 * @extends ComponentPropsWithoutRef<"sup">
 * @extends Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">
 */
export type BadgeProps = ComponentPropsWithoutRef<"sup"> & Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink"> & {
    /**
     * Optional offset configuration for badge positioning
     */
    offset?: {
        /**
         * Horizontal offset from the default position
         * @default "0px"
         */
        x?: string;
        /**
         * Vertical offset from the default position
         * @default "0px"
         */
        y?: string;
    };
};
/**
 * Badge component: a small count or status indicator — a numeric bubble, dot, or pill shown on an icon or element to convey unread counts, notifications, or status.
 *
 * Features:
 * - Positioned as a superscript element
 * - Customizable offset positioning
 * - Screen reader support with aria-label
 * - Empty state styling when no content
 * - Supports layout utilities for positioning
 * - Accessible with proper ARIA roles
 *
 * @example
 * <Button>
 *   Notifications
 *   <Badge aria-label="3 new messages">3</Badge>
 * </Button>
 */
export declare const Badge: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & Omit<LayoutUtilProps, "flex" | "flexGrow" | "flexShrink" | "flexBasis"> & {
    /**
     * Optional offset configuration for badge positioning
     */
    offset?: {
        /**
         * Horizontal offset from the default position
         * @default "0px"
         */
        x?: string;
        /**
         * Vertical offset from the default position
         * @default "0px"
         */
        y?: string;
    };
} & import('react').RefAttributes<HTMLScriptElement>>;
