89 lines
1.9 KiB
TypeScript
89 lines
1.9 KiB
TypeScript
|
import * as React from "react";
|
||
|
import ReactToolbox from "../index";
|
||
|
|
||
|
export interface ProgressBarTheme {
|
||
|
/**
|
||
|
* Used to style the buffer element in the linear progress.
|
||
|
*/
|
||
|
buffer?: string;
|
||
|
/**
|
||
|
* Used for the circle element in the circular progress.
|
||
|
*/
|
||
|
circle?: string;
|
||
|
/**
|
||
|
* Used for the root element when the type is circular.
|
||
|
*/
|
||
|
circular?: string;
|
||
|
/**
|
||
|
* Added to the root element if mode is indeterminate.
|
||
|
*/
|
||
|
indeterminate?: string;
|
||
|
/**
|
||
|
* Used for the root element when the type is linear.
|
||
|
*/
|
||
|
linear?: string;
|
||
|
/**
|
||
|
* Added to the root if the component is multicolor (circular).
|
||
|
*/
|
||
|
multicolor?: string;
|
||
|
/**
|
||
|
* Used for the inner path in the circular progress.
|
||
|
*/
|
||
|
path?: string;
|
||
|
/**
|
||
|
* Used to style the value element in the linear progress.
|
||
|
*/
|
||
|
value?: string;
|
||
|
}
|
||
|
|
||
|
export interface ProgressBarProps extends ReactToolbox.Props {
|
||
|
/**
|
||
|
* Value of a secondary progress bar useful for buffering.
|
||
|
* @default 0
|
||
|
*/
|
||
|
buffer?: number;
|
||
|
/**
|
||
|
* If true, component will be disabled.
|
||
|
* @default false
|
||
|
*/
|
||
|
disabled?: boolean;
|
||
|
/**
|
||
|
* Maximum value permitted.
|
||
|
* @default 100
|
||
|
*/
|
||
|
max?: number;
|
||
|
/**
|
||
|
* Minimum value permitted.
|
||
|
* @default 0
|
||
|
*/
|
||
|
min?: number;
|
||
|
/**
|
||
|
* Mode of the progress bar, it can be determinate or indeterminate.
|
||
|
* @default indeterminate
|
||
|
*/
|
||
|
mode?: "determinate" | "indeterminate";
|
||
|
/**
|
||
|
* If true, the circular progress bar will be changing its color.
|
||
|
* @default false
|
||
|
*/
|
||
|
multicolor?: boolean;
|
||
|
/**
|
||
|
* Classnames object defining the component style.
|
||
|
*/
|
||
|
theme?: ProgressBarTheme;
|
||
|
/**
|
||
|
* Type of the progress bar, it can be circular or linear.
|
||
|
* @default linear
|
||
|
*/
|
||
|
type?: "linear" | "circular";
|
||
|
/**
|
||
|
* Value of the current progress.
|
||
|
* @default 0
|
||
|
*/
|
||
|
value?: number;
|
||
|
}
|
||
|
|
||
|
export class ProgressBar extends React.Component<ProgressBarProps, {}> { }
|
||
|
|
||
|
export default ProgressBar;
|