Skip to contentWolf-Rayet

Progress tracker

A progress tracker shows the steps of a task and how far people have got.

#Default

Show where people are when the task has a fixed number of steps.

  1. Rep details
  2. Queues
  3. Permissions
  4. Review
import { ProgressTracker } from '@wolf-rayet/react';

<ProgressTracker
  items={[
    { id: 'details', label: 'Rep details', status: 'visited' },
    { id: 'queues', label: 'Queues', status: 'current' },
    { id: 'permissions', label: 'Permissions', status: 'unvisited' },
    { id: 'review', label: 'Review', status: 'unvisited' },
  ]}
/>