@arolariu/components/dist/components/ui/meter.d.ts

🎨 70+ beautiful, accessible React components built on Base UI. TypeScript-first, CSS Modules styling, tree-shakeable, SSR-ready. Perfect for modern web apps, design systems & rapid prototyping. Zero config, maximum flexibility! ⚡

import { Meter as BaseMeter } from "@base-ui/react/meter";
import * as React from "react";
/**
 * Displays a scalar measurement within a known range.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on Base UI Meter primitives
 * - Intended for values such as storage usage, health, or completion
 *
 * @example
 * ```tsx
 * <Meter value={72}>
 *   <MeterTrack>
 *     <MeterIndicator />
 *   </MeterTrack>
 * </Meter>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/meter | Base UI Meter Docs}
 */
declare const Meter: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
/**
 * Renders the background track for a meter.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on Base UI Meter track primitives
 *
 * @example
 * ```tsx
 * <MeterTrack />
 * ```
 *
 * @see {@link https://base-ui.com/react/components/meter | Base UI Meter Docs}
 */
declare const MeterTrack: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterTrackProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
/**
 * Renders the filled indicator that reflects the current meter value.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on Base UI Meter indicator primitives
 *
 * @example
 * ```tsx
 * <MeterIndicator />
 * ```
 *
 * @see {@link https://base-ui.com/react/components/meter | Base UI Meter Docs}
 */
declare const MeterIndicator: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterIndicatorProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
/**
 * Renders the accessible label associated with a meter.
 *
 * @remarks
 * - Renders a `<span>` element by default
 * - Built on Base UI Meter label primitives
 *
 * @example
 * ```tsx
 * <MeterLabel>Storage used</MeterLabel>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/meter | Base UI Meter Docs}
 */
declare const MeterLabel: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").MeterLabelProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
declare namespace Meter {
    type Props = React.ComponentPropsWithRef<typeof BaseMeter.Root>;
    type State = BaseMeter.Root.State;
}
declare namespace MeterTrack {
    type Props = React.ComponentPropsWithRef<typeof BaseMeter.Track>;
    type State = BaseMeter.Track.State;
}
declare namespace MeterIndicator {
    type Props = React.ComponentPropsWithRef<typeof BaseMeter.Indicator>;
    type State = BaseMeter.Indicator.State;
}
declare namespace MeterLabel {
    type Props = React.ComponentPropsWithRef<typeof BaseMeter.Label>;
    type State = BaseMeter.Label.State;
}
export { Meter, MeterIndicator, MeterLabel, MeterTrack };
//# sourceMappingURL=meter.d.ts.map