import { HTMLAttributes } from 'react';
export interface CounterCardProps extends HTMLAttributes<HTMLDivElement> {
    /** Text label shown above the value. */
    label: string;
    /** The numeric target value. */
    value: number;
    /** String prepended to the formatted number (e.g. `"$"`). */
    prefix?: string;
    /** String appended to the formatted number (e.g. `" files"`, `" GB"`). */
    suffix?: string;
    /**
     * Number of decimal places to show.
     * Intermediate animation frames are rounded to this precision.
     * Defaults to `0`.
     */
    decimals?: number;
    /**
     * Custom formatter applied to the raw (animated) number.
     * When provided, `decimals` is ignored for display purposes.
     */
    format?: (value: number) => string;
    /**
     * Animate the value counting up from `0` (or from the previous value when
     * `value` changes). Set to `false` to disable animation.
     * Defaults to `true`.
     */
    animated?: boolean;
    /**
     * Animation duration in milliseconds.
     * Defaults to `1000`.
     */
    duration?: number;
    /**
     * Render the value in the accent color.
     * Defaults to `false`.
     */
    accent?: boolean;
    /** Make the card interactive (clickable). Passed to `Card`. */
    interactive?: boolean;
}
/**
 * Metric card with an animated numeric counter.
 *
 * Wraps `Card` from `@gnome-ui/react` and adds a `useCountUp` animation that
 * counts from `0` (or from the previous value) to `value` using an ease-out
 * cubic curve. Respects `prefers-reduced-motion`.
 *
 * ```tsx
 * <CounterCard label="Documents" value={1248} suffix=" files" />
 * <CounterCard label="Revenue"   value={9420} prefix="$" accent duration={1500} />
 * ```
 */
export declare function CounterCard({ label, value, prefix, suffix, decimals, format, animated, duration, accent, interactive, className, style, ...props }: CounterCardProps): import("react/jsx-runtime").JSX.Element;
