Steps

<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>