Progress

1import * as React from 'react';
2 
3import {
4  Progress as ProgressPrimitive,
5  ProgressTrack as ProgressTrackPrimitive,
6  ProgressIndicator as ProgressIndicatorPrimitive,
7  ProgressLabel as ProgressLabelPrimitive,
8  ProgressValue as ProgressValuePrimitive,
9  type ProgressProps as ProgressPrimitiveProps,
10  type ProgressTrackProps as ProgressTrackPrimitiveProps,
11  type ProgressLabelProps as ProgressLabelPrimitiveProps,
12  type ProgressValueProps as ProgressValuePrimitiveProps,
13} from '@/components/animate-ui/primitives/base/progress';
14import { cn } from '@/lib/utils';
15 
16type ProgressProps = ProgressPrimitiveProps;
17 
18function Progress(props: ProgressProps) {
19  return <ProgressPrimitive {...props} />;
20}
21 
22type ProgressTrackProps = ProgressTrackPrimitiveProps;
23 
24function ProgressTrack({ className, ...props }: ProgressTrackProps) {
25  return (
26    <ProgressTrackPrimitive
27      className={cn(
28        'bg-primary/20 relative h-2 w-full overflow-hidden rounded-full',
29        className,
30      )}
31      {...props}
32    >
33      <ProgressIndicatorPrimitive className="bg-primary rounded-full h-full w-full flex-1" />
34    </ProgressTrackPrimitive>
35  );
36}
37 
38type ProgressLabelProps = ProgressLabelPrimitiveProps;
39 
40function ProgressLabel(props: ProgressLabelProps) {
41  return <ProgressLabelPrimitive className="text-sm font-medium" {...props} />;
42}
43 
44type ProgressValueProps = ProgressValuePrimitiveProps;
45 
46function ProgressValue(props: ProgressValueProps) {
47  return <ProgressValuePrimitive className="text-sm" {...props} />;
48}
49 
50export {
51  Progress,
52  ProgressTrack,
53  ProgressLabel,
54  ProgressValue,
55  type ProgressProps,
56  type ProgressTrackProps,
57  type ProgressLabelProps,
58  type ProgressValueProps,
59};