23 lines
609 B
TypeScript
23 lines
609 B
TypeScript
import { Box } from '@/ui/Box';
|
|
import { motion } from 'framer-motion';
|
|
|
|
interface StepProgressRailProps {
|
|
currentStep: number;
|
|
totalSteps: number;
|
|
}
|
|
|
|
export function StepProgressRail({ currentStep, totalSteps }: StepProgressRailProps) {
|
|
const progress = (currentStep / totalSteps) * 100;
|
|
|
|
return (
|
|
<Box w="full" h="1" bg="bg-iron-gray" rounded="full" overflow="hidden" mb={8}>
|
|
<motion.div
|
|
className="h-full bg-primary-blue"
|
|
initial={{ width: 0 }}
|
|
animate={{ width: `${progress}%` }}
|
|
transition={{ duration: 0.5, ease: 'easeOut' }}
|
|
/>
|
|
</Box>
|
|
);
|
|
}
|