/**
 * Copyright (c) 2018 Dell Inc., or its subsidiaries. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 */ import * as React from "react" ; import { classNames } from "../utils" ; param { value } value param { max } maximum param { labeled } if param { style } css param { className } css param { status } status param { type } type param { position } progress param { dataqa } quality export type ProgressBarProps = { value ? : number ; max ? : number ; labeled ? : boolean ; style ? : any ; className ? : string ; status ? : ProgressBarStatus ; type ? : ProgressBarType ; position ? : ProgressBarPosition ; dataqa ? : string ; } ; export enum ProgressBarType { STATIC = "progress-static" , NORMAL = "progress" } export enum ProgressBarStatus { SUCCESS = "success" , WARNING = "warning" , DANGER = "danger" } export enum ProgressBarPosition { TOP = "top" } export const ProgressBarAnimation = { LOOP : "loop" , FADE_OUT : "progress-fade" , FLASH : "flash" , FLASH_DANGER : "flash-danger" , } ; export class ProgressBar extends React . PureComponent < ProgressBarProps > { static defaultProps = { type : ProgressBarType . NORMAL , } ; render ( ) { const { value , max , status , type , labeled , position , style , className , dataqa } = this . props ; const labelStyle = { display : "block" } ; return ( < div className = { classNames ( [ type , status , labeled && "labeled" , position , className , ] ) } style = { style } data - qa = { dataqa } > { } { type == ProgressBarType . NORMAL && ( < progress max = { max } value = { value } > { " " } < /progress>)} { } { type == ProgressBarType . STATIC && < div className = "progress-meter" data - value = { value } />} { } { labeled && < span style = { labelStyle } > { value } % < /span>} < /div>); } }