import React from "react"; import type { CSSProperties } from "react"; export interface ProgressIndicatorProps { /** * Current progress. Expected to be in the range `0..max` inclusive. */ readonly value: number; /** * Maximum value. Pass `max={4}` with `value={2}` for "2 of 4 steps"; pass * `value={75}` for "75%". * * @default 100 */ readonly max?: number; /** * Visual variation: * - `continuous` renders a single fill bar driven by `value / max`. * - `stepped` renders `max` segments, the first `value` of which are filled. * * @default "continuous" */ readonly variation?: "continuous" | "stepped"; /** * Visual size. `smaller` renders at 4px tall, `small` at 8px, `base` at 16px. * * @default "base" */ readonly size?: "smaller" | "small" | "base"; /** * Accessible label exposed via `aria-label` on the root element. When * omitted, defaults to `"{value}%"` when `max === 100` (or `max` is * omitted), and `"{value} / {max}"` otherwise. * * Override to localize or to describe the specific activity (e.g. * `"Uploading file"`). */ readonly ariaLabel?: string; /** * Custom class name merged onto the root element alongside the component's * own classes. */ readonly className?: string; /** * Custom inline styles applied to the root element. */ readonly style?: CSSProperties; } /** * `ProgressIndicator` communicates **determinate** progress — a known fraction * of a task that has been completed. Use it when you can express progress as * `value / max`, such as a multi-step setup wizard or a file upload with a * known total size. * * For indeterminate activity (loading time or fraction unknown), use * `ActivityIndicator` instead. * * For now, the legacy `ProgressBar` component also remains available; new code * should prefer `ProgressIndicator`. */ export declare function ProgressIndicator({ value, max, variation, size, ariaLabel, className, style, }: ProgressIndicatorProps): React.JSX.Element;