cluedin-widget
Version:
This is the project for creating and managing widgets in CluedIn.
45 lines (38 loc) • 1.14 kB
JSX
import React, { Component } from 'react';
export default class CluedInProgress extends Component {
buildWithBigNumber() {
const { withBigNumber, percentage } = this.props;
if ( withBigNumber ) {
return (<div>
<span className="cluedin_progress_bigNumber">{percentage}</span>
<span className="cluedin_progress_percent">%</span>
</div>)
} else {
return (<span></span>);
}
}
progressBar() {
const { percentage } = this.props;
var barStyle = {
width: percentage + '%'
};
return (
<div className="cluedin_progress_bar">
<div style={barStyle} className="cluedin_progress_perentage">
</div>
</div>
)
}
render() {
return (
<div className="cluedin_progress">
{this.buildWithBigNumber()}
{this.progressBar()}
</div>
);
}
}
CluedInProgress.propTypes = {
percentage: React.PropTypes.number,
withBigNumber: React.PropTypes.bool
};