First - Contact Info
Second - Date & Time
Third - Select Rooms
Steps Complete - Thank you for filling out the form!
<StepsRoot count={3}>
<StepsList>
<StepsItem index={0} title="First" />
<StepsItem index={1} title="Second" />
<StepsItem index={2} title="Third" />
</StepsList>
<StepsContent index={0}>First - Contact Info</StepsContent>
<StepsContent index={1}>Second - Date & Time</StepsContent>
<StepsContent index={2}>Third - Select Rooms</StepsContent>
<StepsCompletedContent>
Steps Complete - Thank you for filling out the form!
</StepsCompletedContent>
<div className="flex gap-2">
<StepsPrevTrigger asChild>
<Button variant="outline" size="sm">
Back
</Button>
</StepsPrevTrigger>
<StepsNextTrigger asChild>
<Button variant="outline" size="sm">
Next
</Button>
</StepsNextTrigger>
</div>
</StepsRoot>