wix-style-react
Version:
wix-style-react
22 lines • 1.06 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import { classes } from './ProgressBar.st.css';
import Heading from '../../Heading';
class ProgressBar extends React.PureComponent {
render() {
const { dataHook, progress } = this.props;
return (React.createElement("div", { "data-hook": dataHook, className: classes.root },
React.createElement(Heading, { size: "extraTiny" }, `${progress}%`),
React.createElement("span", { className: classes.bar },
React.createElement("span", { className: classes.value, style: { width: progress + '%' } }),
React.createElement("span", { className: classes.leftover, style: { width: 100 - progress + '%' } }))));
}
}
ProgressBar.propTypes = {
/** Applied as data-hook HTML attribute that can be used in the tests */
dataHook: PropTypes.string,
/** Percentage of the progress, value should be between 0 to 100 */
progress: PropTypes.number.isRequired,
};
export default ProgressBar;
//# sourceMappingURL=ProgressBar.js.map