import * as react_jsx_runtime from 'react/jsx-runtime';

/**
 * A single stat entry with value, change, and trend
 */
interface TimelineStat {
    /**
     * The label for the stat
     */
    label: string;
    /**
     * The stat value (e.g., "1,284", "32,891", "5.2%")
     */
    value: string;
    /**
     * The percentage change
     */
    change: number;
    /**
     * Whether the trend is up or down
     */
    trend: "up" | "down";
    /**
     * Label for the comparison period
     */
    previousLabel: string;
    /**
     * If true, a downward trend is considered positive (e.g., for support tickets)
     */
    inversePositive?: boolean;
}
/**
 * A time period with its associated stats
 */
interface TimePeriod {
    /**
     * Unique identifier for the period
     */
    id: string;
    /**
     * Display label for the period
     */
    label: string;
    /**
     * Stats for this time period
     */
    stats: TimelineStat[];
}
/**
 * Props for the StatsTimelineTabs component
 */
interface StatsTimelineTabsProps {
    /**
     * Additional CSS classes for the section
     */
    className?: string;
    /**
     * Badge text above the heading
     */
    badge?: string;
    /**
     * Main heading text
     */
    heading?: string;
    /**
     * Description text below the heading
     */
    description?: string;
    /**
     * Array of time periods with their stats
     */
    periods?: TimePeriod[];
    /**
     * Default selected period ID
     */
    defaultPeriod?: string;
}
/**
 * StatsTimelineTabs - A tabbed stats display showing metrics across different time periods
 * (weekly, monthly, quarterly, yearly). Features a badge header, centered tab navigation,
 * and a responsive grid of stat cards with color-coded trend indicators. Each stat shows
 * the value, percentage change, and comparison period. Ideal for analytics dashboards,
 * performance reports, or any time-series data visualization.
 *
 * @example
 * ```tsx
 * <StatsTimelineTabs
 *   badge="Performance Timeline"
 *   heading="Growth Progression"
 *   description="Track our key metrics over different time periods"
 *   defaultPeriod="monthly"
 * />
 * ```
 */
declare function StatsTimelineTabs({ className, badge, heading, description, periods, defaultPeriod, }: StatsTimelineTabsProps): react_jsx_runtime.JSX.Element;

export { StatsTimelineTabs, type StatsTimelineTabsProps, type TimePeriod, type TimelineStat };
