import { cn } from "@/lib/utils";

type ProgressProps = {
  value: number;
  className?: string;
  showValue?: boolean;
};

export function Progress({ value, className, showValue = false }: ProgressProps) {
  const normalizedValue = Math.max(0, Math.min(100, value));

  return (
    <div className={cn("space-y-1.5", className)}>
      <div className="h-2.5 w-full overflow-hidden rounded-full bg-[#e7edf7]">
        <div
          className="h-full rounded-full bg-[#2ca56f] transition-[width]"
          style={{ width: `${normalizedValue}%` }}
          aria-valuenow={normalizedValue}
          aria-valuemin={0}
          aria-valuemax={100}
          role="progressbar"
        />
      </div>
      {showValue ? <p className="text-right text-xs font-semibold text-[#5e6a82]">{normalizedValue}%</p> : null}
    </div>
  );
}
