import { ReactNode, SyntheticEvent } from 'react';
import { SxProps } from '@mui/material/styles';
interface StatusPillProps {
    /** Pill label. */
    label: ReactNode;
    /** Optional leading icon (e.g. a check-circle). */
    icon?: ReactNode;
    /** Pill background color token. */
    bgcolor?: string;
    /** Pill border color token. */
    borderColor?: string;
    /** Label color token. */
    labelColor?: string;
    /** Label typography. Default `subtitle2`; the transaction-row pill uses `caption`. */
    labelVariant?: 'subtitle2' | 'caption';
    /**
     * Makes the pill tappable (the transaction-row pill posts the beat to the host). The pill then
     * exposes `role="button"`, is focusable, and also fires on Enter and Space, so the handler gets a
     * mouse or a keyboard event.
     */
    onClick?: (event: SyntheticEvent<HTMLDivElement>) => void;
    'data-testid'?: string;
    sx?: SxProps;
}
/**
 * A small rounded status pill: optional icon + label on a tinted, bordered
 * surface.
 *
 * Figma: the "Categorized" pill in Peer-to-Peer Categorization (`success.100`
 * bg, `success.main` border, radius 999, 24px tall, check icon + `success.darker`
 * `typography/subtitle2` label — regular weight, NOT bold). Reusable for any
 * inline status.
 */
declare const StatusPill: ({ bgcolor, borderColor, icon, label, labelColor, labelVariant, onClick, sx, "data-testid": testId, }: StatusPillProps) => import("react/jsx-runtime").JSX.Element;
export default StatusPill;