beta-parity-react/ui/Progress/index.d.ts

Beta Parity React Components

import React from 'react';
import './variables.css';
import './index.css';
/**
 * Props for the Progress component.
 *
 * Extends properties from the `div` element.
 */
export interface ProgressProps extends React.HTMLAttributes<HTMLDivElement> {
    /**
     * The type of progress indicator.
     *
     * @default 'bar'
     * @memberof ProgressProps
     */
    kind?: 'bar' | 'circle';
    /**
     * The current progress value.
     *
     * @default 0
     * @memberof ProgressProps
     */
    value?: number;
    /**
     * The title displayed above the progress indicator.
     *
     * @memberof ProgressProps
     */
    title?: string;
    /**
     * Additional helper text displayed below the progress indicator.
     *
     * @memberof ProgressProps
     */
    helperText?: string;
    /**
     * The color theme of the progress indicator with active state.
     *
     * @default 'neutral'
     * @memberof ProgressProps
     */
    color?: 'neutral' | 'accent';
    /**
     * The current state of the progress.
     *
     * @default 'active'
     * @memberof ProgressProps
     */
    state?: 'active' | 'success' | 'error';
    /**
     * The size of the progress indicator with circle kind.
     *
     * @default 'sm'
     * @memberof ProgressProps
     */
    size?: 'sm' | 'md';
    /**
     * Whether to display the progress value as a numeral.
     *
     * @default false
     * @memberof ProgressProps
     */
    numeral?: boolean;
}
/**
 * **Parity Progress**.
 *
 *  @see {@link https://beta-parity-react.vercel.app/progress Parity Progress}
 */
export declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;
/**
 * Props for the ProgressIcon component.
 *
 * Extends properties from the `span` element.
 */
export interface ProgressIconProps extends React.HTMLAttributes<HTMLSpanElement> {
    /**
     * The kind of progress icon to display.
     * - `affirmative`: Represents a positive or successful state.
     * - `adverse`: Represents a negative or error state.
     *
     * @default "affirmative"
     */
    kind?: 'affirmative' | 'adverse';
}
//# sourceMappingURL=index.d.ts.map