import "./metric.css";
import type * as React from "react";
import { useRender } from "@base-ui/react/use-render";
import { type UnitScale } from "./format_money";
import { type StyleProps } from "./style_props";
export type MetricFormat = "currency" | "number" | "percentage" | "none";
/** `default` inherits the text colour. */
export type MetricTone = "default" | "warning" | "danger";
/** `md` matches body display size; `hero` is a section's one most important number. */
export type MetricSize = "sm" | "md" | "lg" | "hero";
/** A figure's notation: money in its code, a plain figure in its unit. */
interface MetricNotation {
    format?: MetricFormat;
    currency?: string;
    unit?: Pick<UnitScale, "label" | "ladder">;
}
/** The same measure held in another unit or currency, stacked under the first — never added into it. */
export interface MetricFigure extends MetricNotation {
    value: number;
}
export interface MetricProps extends StyleProps {
    value: number | string | null | undefined;
    /** The overline naming the number: with one it is a `MetricStrip` tile, without one a bare figure for a
     *  legend or totals line. */
    label?: string;
    /** A tile's figure, whose exact value is in the record or the table: money with no fraction, and past six
     *  digits abbreviated (≥1 tỷ → "1,3 tỷ", ≥1 triệu → "2,7 tr"; other locales M and B), as a chart reads it — one form in
     *  every currency. Never the table. */
    compact?: boolean;
    format?: MetricFormat;
    currency?: string;
    /** What a plain figure counts or measures, after it (`12.500 kg`); `compact`, in the largest rung of its ladder
     *  the figure reaches (`12,5 tấn`). Only beside format `number`. */
    unit?: Pick<UnitScale, "label" | "ladder">;
    /** The same measure in other units or currencies — rows each read in their own — each on its own line under
     *  `value`, in the order given: a sum never mixes them. A change, a goal and a history are of one unit, so a
     *  figure stacked this way states none. */
    also?: readonly MetricFigure[];
    locale?: string;
    emptyLabel?: string;
    tone?: MetricTone;
    size?: MetricSize;
    /** A signed percent delta, drawn as its trend chip; pass `null` where the base is 0. */
    trend?: number | null;
    /** Which way the delta is good (`Trend`); `"none"` for a sum with no known good side. */
    goodDirection?: "up" | "down" | "none";
    /** The figure over its recent periods, oldest first: a sparkline at the figure's right, so the number
     *  reads with its shape. Under three periods, or periods that each held nothing, there is no shape to read, so
     *  none is drawn. */
    series?: readonly number[];
    /** The goal the figure works toward: the bound stated after the figure (`/ 24`, a unit that follows the figure
     *  said once, after it — `overBound`), and a ring of its share
     *  with the share beside it — complete at or past the goal, never red, since beating a goal is no fault
     *  (a cap is a meter's limit). `null` or 0 has no share, so no ring. */
    max?: number | null;
    /** Comparator detail, a unit hint or a caveat. */
    caption?: string;
    info?: string;
    /** A tile of a `MetricStrip`: its label, number, change and goal, caption and history each take the strip's
     *  own row, so every tile's history starts on one line whatever its neighbours wrap. */
    strip?: boolean;
    testID?: string;
    ref?: React.Ref<HTMLElement>;
    render?: useRender.RenderProp;
}
/** A headline figure — the atom of stat bands, tiles and summaries; with a label a tile (overline, ⓘ,
 *  delta, caption), without one a bare number. A band is a `MetricStrip`. Derive the comparator from the
 *  selected range as `trend`, never a second control; a history is `series`, a bound `max`. */
export declare function Metric(props: MetricProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
export {};