/* Copyright 2026 Marimo. All rights reserved. */

import { Progress as ProgressPrimitive } from "radix-ui";
import * as React from "react";

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

interface ProgressProps extends React.ComponentPropsWithoutRef<
  typeof ProgressPrimitive.Root
> {
  /**
   * When true, shows an indeterminate animated progress bar.
   */
  indeterminate?: boolean;
}

const Progress = React.forwardRef<
  React.ComponentRef<typeof ProgressPrimitive.Root>,
  ProgressProps
>(({ className, value, indeterminate, ...props }, ref) => (
  <ProgressPrimitive.Root
    ref={ref}
    className={cn(
      "relative h-2 w-full overflow-hidden rounded-full bg-primary/20",
      className,
    )}
    {...props}
  >
    <ProgressPrimitive.Indicator
      className={cn(
        "h-full flex-1 bg-primary",
        indeterminate
          ? "w-1/3 animate-progress-indeterminate"
          : "w-full transition-transform duration-300 ease-out",
      )}
      style={
        indeterminate
          ? undefined
          : { transform: `translateX(-${100 - (value || 0)}%)` }
      }
    />
  </ProgressPrimitive.Root>
));
Progress.displayName = ProgressPrimitive.Root.displayName;

export { Progress };