react-loader-spinner/dist/circular-progress.d.ts

react-spinner-loader provides simple React.js spinner component which can be implemented for async wait operation before data load to the view.

import { FunctionComponent, CSSProperties } from 'react';

/**
 * Props for the CircularProgress loader component.
 *
 * The CircularProgress loader displays a circular progress indicator with customizable
 * stroke width and colors. Features a main circle with optional secondary background circle,
 * animated rotation, and configurable animation duration.
 *
 * @interface CircularProgressProps
 */
interface CircularProgressProps {
    /** Height of the SVG (number interpreted as px). Defaults to '100'. */
    height?: string | number;
    /** Width of the SVG (number interpreted as px). Defaults to '100'. */
    width?: string | number;
    /** Primary color applied to the progress circle. Defaults to DEFAULT_COLOR. */
    color?: string;
    /** Stroke width of the progress circle. Affects the thickness of the circular line. */
    strokeWidth?: string | number;
    /** Color of the background/secondary circle. Optional background indicator. */
    secondaryColor?: string;
    /** Duration of the rotation animation in seconds. Controls animation speed. */
    animationDuration?: string | number;
    /** Accessible label announced to screen readers. Defaults to 'circular-progress-loading'. */
    ariaLabel?: string;
    /** Inline style object applied to the wrapper element. */
    wrapperStyle?: CSSProperties;
    /** CSS class applied to the wrapper for custom styling. */
    wrapperClass?: string;
    /** When false, the loader is not rendered. Defaults to true. */
    visible?: boolean;
    /**
     * Provide multiple colors to render a gradient instead of a solid color.
     * When 2 or more colors are supplied a gradient will be applied to the progress circle.
     */
    colors?: string[];
    /** Type of gradient (linear or radial). Defaults to linear. */
    gradientType?: 'linear' | 'radial';
    /** Angle (in degrees) applied via rotate() transform for linear gradients. */
    gradientAngle?: number;
}
declare const CircularProgress: FunctionComponent<CircularProgressProps>;

export { CircularProgress };