UI
← Home

Steps

A steps / wizard indicator for a linear flow. The steps are an ordered list with the current one marked `aria-current="step"`; Back and Next move through the flow and are disabled at the ends, and the current step's panel is shown in a labelled region.

  • Axe
  • Focus

Preview

  1. Cart
  2. Shipping
  3. Payment
Review your cart.

Installation

npx shadcn@latest add https://ui.publictheta.com/r/steps.json

Conformance

Verified against the @publictheta/ui-spec steps specification on both the React and vanilla reference implementations, across Chromium, Firefox, and WebKit.

  • Axe No WCAG 2 A/AA axe-core violations
  • Focus A visible focus indicator appears on keyboard focus (WCAG 2.4.7)

See the full conformance matrix across all components.