import { default as React } from 'react';
export interface StatDisplayProps {
    /** The main value/number to display */
    value: string | number;
    /** Label/description for the stat */
    label: string;
    /** Color variant */
    variant?: 'primary' | 'success' | 'warning' | 'danger' | 'neutral' | 'white';
    /** Size variant */
    size?: 'sm' | 'md' | 'lg' | 'xl';
    /** Text alignment */
    align?: 'left' | 'center' | 'right';
    /** Icon to display above/beside the value */
    icon?: React.ComponentType<{
        className?: string;
    }>;
    /** Icon position */
    iconPosition?: 'top' | 'left';
    /** Additional className for the container */
    className?: string;
    /** Value className override */
    valueClassName?: string;
    /** Label className override */
    labelClassName?: string;
}
/**
 * StatDisplay Component
 *
 * Displays a statistic or metric with a value and label.
 * Commonly used in dashboards, hero sections, and analytics displays.
 *
 * @example
 * ```tsx
 * <StatDisplay value="5K" label="Gas Overhead" variant="white" />
 * <StatDisplay value="42" label="Active Users" variant="primary" size="lg" />
 * ```
 *
 * @example
 * ```tsx
 * import { ChartBarIcon } from '@heroicons/react/24/outline';
 *
 * <StatDisplay
 *   value="1,234"
 *   label="Total Points"
 *   icon={ChartBarIcon}
 *   iconPosition="top"
 *   variant="success"
 * />
 * ```
 */
export declare const StatDisplay: React.FC<StatDisplayProps>;
//# sourceMappingURL=stat-display.d.ts.map