Initial commit for project Spoon!

packages/ui/src/progress.tsx

@@ -0,0 +1,29 @@
+'use client';
+
+import type * as React from 'react';
+import { Progress as ProgressPrimitive } from 'radix-ui';
+
+import { cn } from '@spoon/ui';
+
+const Progress = ({
+  className,
+  value,
+  ...props
+}: React.ComponentProps<typeof ProgressPrimitive.Root>) => (
+  <ProgressPrimitive.Root
+    data-slot='progress'
+    className={cn(
+      'bg-muted relative flex h-1 w-full items-center overflow-x-hidden rounded-full',
+      className,
+    )}
+    {...props}
+  >
+    <ProgressPrimitive.Indicator
+      data-slot='progress-indicator'
+      className='bg-primary size-full flex-1 transition-all'
+      style={{ transform: `translateX(-${100 - (value ?? 0)}%)` }}
+    />
+  </ProgressPrimitive.Root>
+);
+
+export { Progress };