import { RadiantElement } from '@ecopages/radiant';
export type RuiMeterProps = {
    value?: number;
    min?: number;
    max?: number;
    label?: string;
};
type RuiMeterBindings = {
    value: number;
    min: number;
    max: number;
    label: string;
    percent: number;
};
/**
 * `<rui-meter>` — a graphical display of a numeric value within a range.
 *
 * Uses the native `<meter>` element, which maps to the APG Meter pattern.
 *
 * @see https://www.w3.org/WAI/ARIA/apg/patterns/meter/
 *
 * @element rui-meter
 *
 * @attr {number} value - Current value. Default: `0`.
 * @attr {number} min - Range minimum. Default: `0`.
 * @attr {number} max - Range maximum. Default: `100`.
 * @attr {string} label - Text describing what is measured (also the accessible
 *   name). Default: `''`.
 *
 * @remarks
 * The bar itself is the native `<meter>` (`role="meter"` with
 * `aria-valuenow/min/max`); the CE composes label, bar, and a numeric readout
 * (`aria-hidden`) in a row. Styling classes are authored here.
 *
 * **Why a custom element?** The view wraps the native element to compose label
 * + value chrome; percent derivation from `value`/`min`/`max` is reactive prop
 * math, which a JSX view would need manual subscription for.
 *
 * @cssclass rui-meter - Root row (label, bar, value).
 * @cssclass rui-meter__label - Text describing the measurement.
 * @cssclass rui-meter__bar - The native `<meter>`.
 * @cssclass rui-meter__value - Numeric readout (`aria-hidden`).
 */
export declare class RuiMeter extends RadiantElement<RuiMeterBindings> {
    value: number;
    min: number;
    max: number;
    label: string;
    percent: number;
    private readonly resolvedAriaLabel;
    onRangeUpdated(): void;
    render(): import("@ecopages/jsx").JsxRenderable;
}
export {};