import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import classNames from "classnames";
import { ProgressRoot, ProgressBar, ProgressInfoRoot, ProgressInfo, TargetInfo, } from "./progress.styled";
export const Progress = ({ percent, label, maxValueLabel, ...rest }) => {
    return (_jsxs(ProgressRoot, { className: classNames("ui-linear-progress__root", rest.className), children: [_jsx(ProgressBar, { className: "ui-linear-progress__bar", width: `${percent}%` }), (label || maxValueLabel) && (_jsxs(ProgressInfoRoot, { className: "ui-linear-progress__info", children: [_jsx(ProgressInfo, { className: "ui-linear-progress__value", children: label }), _jsx(TargetInfo, { className: "ui-linear-progress__max-value", children: maxValueLabel })] }))] }));
};
//# sourceMappingURL=progress.js.map