import * as React from "react";
import { StatusType } from "../../types/common/StatusTypes";
export interface StatusBadgeProps {
    /**
     * The status type (determines color when variant is not provided)
     */
    status: StatusType;
    /**
     * The content to display inside the badge
     */
    children: React.ReactNode;
    /**
     * Additional CSS classes
     */
    className?: string;
    /**
     * Test ID for automated testing
     */
    testId?: string;
    /**
     * Optional size variant
     */
    size?: "sm" | "md" | "lg";
    /**
     * Badge color scheme override. When provided and matches a known type,
     * overrides the color derived from `status`. This allows callers to
     * decouple the semantic status from the visual presentation.
     *
     * @example
     * ```tsx
     * // Color driven by status (default behavior)
     * <StatusBadge status="success">OK</StatusBadge>
     *
     * // Color overridden by variant
     * <StatusBadge status="info" variant="warning">Needs attention</StatusBadge>
     * ```
     */
    variant?: "error" | "warning" | "info" | "success" | "neutral" | string;
}
/**
 * Displays a status badge with appropriate colors
 *
 * ## UX Perspective
 *
 * Provides consistent visual indicators of status throughout the
 * application, using color psychology to communicate severity and
 * importance at a glance. 🎨
 */
declare const StatusBadge: React.FC<StatusBadgeProps>;
export default StatusBadge;
export type { StatusType };
//# sourceMappingURL=StatusBadge.d.ts.map