@antadesign/anta
    Preparing search index...

    Interface ProgressPropsUnreviewed

    Common props for JSX component wrappers.

    interface ProgressProps {
        value?: number | false;
        max?: number;
        tone?:
            | "neutral"
            | "brand"
            | "info"
            | "success"
            | "warning"
            | "critical"
            | string & {};
        size?: "small"
        | "medium"
        | "large";
        round?: boolean | number | string;
        label?: string;
        hint?: string;
        className?: string;
        style?: CSSProperties;
        children?: ReactNode;
        id?: string;
        title?: string;
        slot?: string;
        tabIndex?: number;
        key?: string | number | null;
        [key: `data-${string}`]: unknown;
        [key: `aria-${string}`]: unknown;
    }

    Hierarchy (View Summary)

    Indexable

    • [key: `data-${string}`]: unknown

      Any data-* attribute is forwarded to the rendered element.

    • [key: `aria-${string}`]: unknown

      Any aria-* attribute is forwarded to the rendered element.

    Index
    value?: number | false

    Completed amount relative to max. Omit this prop or pass false to show a loading animation without a percentage. Values are clamped to the range; non-finite values show zero completion.

    max?: number

    Total amount to complete. Use a positive number to show a count, such as 3 of 7 files. When value is supplied, a non-positive or non-finite total shows an empty fill.

    100
    
    tone?:
        | "neutral"
        | "brand"
        | "info"
        | "success"
        | "warning"
        | "critical"
        | string & {}

    Color for the track, fill, and label row. Pass a named tone or a CSS color. Named tones follow the current theme.

    'neutral'
    
    size?: "small" | "medium" | "large"

    Size variant. Scales the track and the default label row together.

    medium
    
    round?: boolean | number | string

    Pill-shaped track. Pass a number in pixels or a CSS length for a custom corner radius.

    label?: string

    Task name shown after the percentage, or on its own during loading. Custom children replace the label row; this prop still supplies the progressbar's accessible name.

    hint?: string

    Details shown at the end of the row, such as "3 of 7" or a time estimate. Included in the accessible name even when custom children replace the row.

    className?: string

    Adds CSS classes to the root element and preserves its existing classes.

    style?: CSSProperties

    Inline CSS styles on the root element.

    children?: ReactNode

    Content to render in place of any default content.

    id?: string

    HTML id attribute.

    title?: string

    HTML title attribute, shown as a browser tooltip on hover.

    slot?: string

    Named slot in a parent web component, such as slot="header" in a <Dialog>.

    tabIndex?: number

    Tab order. Set to -1 to skip the element when tabbing.

    key?: string | number | null

    React/Preact reconciliation key when rendered inside a list. Consumed by the JSX runtime (not forwarded as a DOM attribute).