Files
better-auth/demo/nextjs/components/ui/progress.tsx
2025-03-04 20:29:25 +03:00

33 lines
858 B
TypeScript

"use client";
import * as React from "react";
import * as ProgressPrimitive from "@radix-ui/react-progress";
import { cn } from "@/lib/utils";
const Progress = (
{
ref,
className,
value,
...props
}: React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root> & {
ref: React.RefObject<React.ElementRef<typeof ProgressPrimitive.Root>>;
}
) => (<ProgressPrimitive.Root
ref={ref}
className={cn(
"relative h-2 w-full overflow-hidden rounded-full bg-primary/20",
className,
)}
{...props}
>
<ProgressPrimitive.Indicator
className="h-full w-full flex-1 bg-primary transition-all"
style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
/>
</ProgressPrimitive.Root>);
Progress.displayName = ProgressPrimitive.Root.displayName;
export { Progress };