import { type VariantProps } from 'class-variance-authority';
import * as React from 'react';
declare const metricMiniChartVariants: (props?: ({
    variant?: "area" | "layers" | "line" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
export interface MetricMiniChartProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof metricMiniChartVariants> {
    /** Data points for the sparkline */
    data: number[];
    /** Color of the chart line/area */
    color?: string;
    /** Width of the chart */
    width?: number;
    /** Height of the chart */
    height?: number;
    /** Show marker dot at the end */
    showMarker?: boolean;
    /** Trend direction for styling */
    trend?: 'positive' | 'negative';
}
declare function MetricMiniChart({ data, color, width, height, variant, showMarker, trend, className, ...props }: MetricMiniChartProps): React.JSX.Element;
declare namespace MetricMiniChart {
    var displayName: string;
}
declare const metricChangeVariants: (props?: ({
    variant?: "badge" | "default" | null | undefined;
    trend?: "negative" | "positive" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
export interface MetricChangeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof metricChangeVariants> {
    /** Change value (e.g., "100%", "+25%") */
    value: string;
    /** Icon type ('none' to hide icon) */
    icon?: 'arrow' | 'trend' | 'arrow-right' | 'none';
}
declare function MetricChange({ value, variant, trend, icon, className, ...props }: MetricChangeProps): React.JSX.Element;
declare namespace MetricChange {
    var displayName: string;
}
declare const metricItemVariants: (props?: ({
    type?: "chart-01" | "chart-02" | "chart-03" | "chart-04" | "icon-01" | "icon-02" | "icon-03" | "icon-04" | "simple" | null | undefined;
    breakpoint?: "desktop" | "mobile" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
export interface MetricItemProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof metricItemVariants> {
    /** Title/label of the metric */
    title: string;
    /** Main value to display */
    value: string | number;
    /** Change indicator value */
    changeValue?: string;
    /** Change trend direction */
    changeTrend?: 'positive' | 'negative';
    /** Change icon type ('none' to hide icon) */
    changeIcon?: 'arrow' | 'trend' | 'arrow-right' | 'none';
    /** Comparison text (e.g., "vs last month") */
    comparisonText?: string;
    /** Subtitle/description text shown next to value (alternative to change indicator) */
    subtitle?: string;
    /** Show dropdown menu button */
    showDropdown?: boolean;
    /** Show action buttons */
    showActions?: boolean;
    /** Action button click handler */
    onViewReport?: () => void;
    /** Dropdown click handler */
    onDropdownClick?: () => void;
    /** Icon for icon variants */
    icon?: React.ReactNode;
    /** Icon background color */
    iconBgColor?: string;
    /** Icon color */
    iconColor?: string;
    /** Chart data for chart variants */
    chartData?: number[];
    /** Featured icon variant style */
    featuredIconVariant?: 'circle' | 'square' | 'modern';
    /** Custom content to render instead of chart (for chart-04 type) */
    children?: React.ReactNode;
}
declare const MetricItem: React.MemoExoticComponent<({ title, value, changeValue, changeTrend, changeIcon, comparisonText, subtitle, showDropdown, showActions, onViewReport, onDropdownClick, icon, iconBgColor, iconColor, chartData, featuredIconVariant, type, breakpoint, className, children, ...props }: MetricItemProps) => React.JSX.Element>;
export { MetricChange, MetricItem, MetricMiniChart, metricChangeVariants, metricItemVariants, metricMiniChartVariants, };