import { type ReactNode } from 'react';
import { type NeoAccent } from './neopop';
/**
 * One row of any ranked breakdown. Panels only have to map their aggregate
 * into this shape, so adding a new dimension (agents, tools, sessions…) is a
 * mapping function rather than a new list component.
 */
export interface BreakdownItem {
    key: string;
    label: string;
    sublabel?: ReactNode;
    icon?: ReactNode;
    /** Badge/tag rendered under the value, e.g. the credential type. */
    metaLabel?: ReactNode;
    value: number;
    valueLabel: string;
    title?: string;
}
export interface NeoRowBarProps {
    pct: number;
    accent: NeoAccent;
    /** When false the fill renders at zero width so it can transition open. */
    grown?: boolean;
    delayMs?: number;
    className?: string;
}
/**
 * Hard-edged proportional bar. The track owns the 2px edge and the fill sits
 * inside it, so a full-width bar can never paint past the row.
 */
export declare function NeoRowBar({ pct, accent, grown, delayMs, className, }: NeoRowBarProps): import("react/jsx-runtime").JSX.Element;
export interface BreakdownListProps {
    items: BreakdownItem[];
    emptyLabel: string;
    /** Rows shown before the "show all" affordance. */
    limit?: number;
    /** Fill colour for every bar in the list. */
    accent?: NeoAccent;
    /** Replays the grow-in when the sort or filter behind the list changes. */
    resetKey?: string;
    selectedKey?: string | null;
    onSelect?: (key: string) => void;
}
export declare function BreakdownList({ items, emptyLabel, limit, accent, resetKey, selectedKey, onSelect, }: BreakdownListProps): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=UsageBreakdown.d.ts.map