DocSpace-client/packages/shared/components/progress-bar/ProgressBar.tsx

33 lines
759 B
TypeScript

import React from "react";
import { Text } from "../text";
import StyledProgressBar from "./ProgressBar.styled";
import { ProgressBarProps } from "./ProgressBar.types";
const ProgressBar = ({ percent, label, ...rest }: ProgressBarProps) => {
const progressPercent = percent > 100 ? 100 : percent;
// console.log("ProgressBar render");
return (
<StyledProgressBar
{...rest}
percent={progressPercent}
data-testid="progress-bar"
>
<div className="progress-bar_percent" />
<Text
className="progress-bar_full-text"
fontSize="12px"
fontWeight="400"
lineHeight="16px"
title={label}
>
{label}
</Text>
</StyledProgressBar>
);
};
export { ProgressBar };