DEVELOPMENT PREVIEWIn development

Stepper

Multi-step progress indicator. Completed steps render a check, the current step is announced with aria-current="step", and completed/upcoming states carry screen-reader text.

Horizontal

  1. Account (completed)Sign-in details
  2. ProfileAbout you
  3. Review (upcoming)Confirm everything
Snippet
import { Stepper } from '@creo-team/buzz-ui/server'

<Stepper
	steps={[
		{ key: 'account', label: 'Account' },
		{ key: 'profile', label: 'Profile' },
		{ key: 'review', label: 'Review' },
	]}
	current="profile"
/>

Vertical with descriptions

  1. Account (completed)Sign-in details
  2. ProfileAbout you
  3. Review (upcoming)Confirm everything
Snippet
<Stepper steps={steps} current="profile" orientation="vertical" />