summaryrefslogtreecommitdiff
path: root/src/components/ui
diff options
context:
space:
mode:
authorpolwex <polwex@sortug.com>2025-05-21 14:00:28 +0700
committerpolwex <polwex@sortug.com>2025-05-21 14:00:28 +0700
commite839a5f61f0faa21ca8b4bd5767f7575d5e576ee (patch)
tree53e5bcc3977b6ebef687521a7ac387a89aeb21c8 /src/components/ui
parent4f2bd597beaa778476b84c10b571db1b13524301 (diff)
the card flip animation is legit
Diffstat (limited to 'src/components/ui')
-rw-r--r--src/components/ui/progress.tsx29
1 files changed, 29 insertions, 0 deletions
diff --git a/src/components/ui/progress.tsx b/src/components/ui/progress.tsx
new file mode 100644
index 0000000..10af7e6
--- /dev/null
+++ b/src/components/ui/progress.tsx
@@ -0,0 +1,29 @@
+import * as React from "react"
+import * as ProgressPrimitive from "@radix-ui/react-progress"
+
+import { cn } from "@/lib/utils"
+
+function Progress({
+ className,
+ value,
+ ...props
+}: React.ComponentProps<typeof ProgressPrimitive.Root>) {
+ return (
+ <ProgressPrimitive.Root
+ data-slot="progress"
+ className={cn(
+ "bg-primary/20 relative h-2 w-full overflow-hidden rounded-full",
+ className
+ )}
+ {...props}
+ >
+ <ProgressPrimitive.Indicator
+ data-slot="progress-indicator"
+ className="bg-primary h-full w-full flex-1 transition-all"
+ style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
+ />
+ </ProgressPrimitive.Root>
+ )
+}
+
+export { Progress }