import styles from "./styles.module.css";

interface IProgressBarLineProps {
  value: number;
  delay: number;
  containerClassName?: string;
  lineClassName?: string;
  lineColor?: string;
}

function ProgressBarLine({
  value,
  delay,
  containerClassName,
  lineClassName,
  lineColor,
}: IProgressBarLineProps): JSX.Element {
  return (
    <div className={`${styles.container} ${containerClassName || ""}`}>
      <div
        className={`${styles.line} ${lineClassName || ""}`}
        style={{
          width: `${value}%`,
          transitionDuration: `${delay}ms`,
          backgroundColor: lineColor,
        }}
      ></div>
    </div>
  );
}

export default ProgressBarLine;
