import type { HTMLAttributes } from "react";
/**
 * PercentileChart — p50/p95/p99 over time as shaded BANDS (not three flat
 * lines), pure-SVG (M3 anti-chart-lib ADR upheld, M11 ADR D1). The p50–p95 and
 * p95–p99 spans render as filled areas + a p50 reference line, so the spread is
 * read at a glance (phoenix `TraceLatencyPercentilesTimeSeries` pattern, M11
 * ADR D2 — the upgrade over the lens' current three-line overlay). Reuses
 * `linScale`/`niceMax`/`seriesPath` from TrendChart — zero new chart dep.
 *
 *   <PercentileChart title="Latency" buckets={latencyBuckets}
 *                    valueFormatter={(v) => `${v}ms`} />
 */
export interface PercentileBucket {
    /** p50 value for this time bucket. */
    p50: number;
    /** p95 value for this time bucket. */
    p95: number;
    /** p99 value for this time bucket. */
    p99: number;
    /** Optional bucket label (read in the a11y table). */
    label?: string;
}
export type PercentileChartProps = HTMLAttributes<HTMLElement> & {
    title: string;
    buckets: PercentileBucket[];
    height?: number;
    /** Formats the y-axis label and the a11y table cells. */
    valueFormatter?: (v: number) => string;
};
declare const PercentileChart: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
    title: string;
    buckets: PercentileBucket[];
    height?: number;
    /** Formats the y-axis label and the a11y table cells. */
    valueFormatter?: (v: number) => string;
} & import("react").RefAttributes<HTMLElement>>;
export { PercentileChart };