Overview
The Steps component renders an ordered list with numbered circles and a vertical connecting line. Use it for how-to guides with 3 or more sequential actions.
Props
Steps (container)
| Prop | Type | Default | Description |
|---|---|---|---|
children | ReactNode | — | One or more <Step> components |
Step
| Prop | Type | Default | Description |
|---|---|---|---|
title | string | — | Step heading (optional) |
children | ReactNode | — | Content of the step |
Usage
1
Install the package
Run the install command in your project directory.
2
Configure your settings
Edit the configuration file with your API keys and preferences.
3
Verify the setup
Start the dev server and confirm everything works correctly.
MDX source
<Steps>
<Step title="First step">Body of step one.</Step>
<Step title="Second step">Body of step two.</Step>
<Step title="Third step">Body of step three.</Step>
</Steps>