Start sharing components as a team!Share components as a team!Join Bit to build your applications faster.Get Started Free

stepper

v4.9.10arrow_drop_down
v4.9.10
v4.5.2
v3.9.2
STATUS
Passing
DOWNLOADS
1,400
LICENSE
MIT
VISIBILITY
Public
PUBLISHED
3 months ago
SIZE
25 KB
Set the active step (zero based index). Set to -1 to disable all the steps.
2 contributors
Install stepper as a package?
Copied
npm i @bit/mui-org.material-ui.stepper
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.dev
Component Example
React
React
Vue
Angular
React Native
Add dependency... help_outline
Just
import
any of the 1 million components
and packages in Bit or NPM to the example.
import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';
toggle layout
modifieddraft
modifieddraft
modifieddraft
modifieddraft
modifieddraft
modifieddraft
modifieddraft
modifieddraft
modifieddraft
modifieddraft
modifieddraft
chevron_left
chevron_right

Set the active step (zero based index). Set to -1 to disable all the steps.

If set to ‘true’ and orientation is horizontal, then the step label will be positioned under the icon.

Two or more <Step /> components.

An element to be placed between each step.

If set the Stepper will not assist in controlling steps for linear flow.

The stepper orientation (layout flow direction).

Demos:

API:

Properties
NameTypeDescription
activeStep
number

Set the active step (zero based index). Set to -1 to disable all the steps.

alternativeLabel
bool

If set to ‘true’ and orientation is horizontal, then the step label will be positioned under the icon.

children
node

Two or more <Step /> components.

classes
object

Override or extend the styles applied to the component. See CSS API below for more details.

className
string
connector
element

An element to be placed between each step.

nonLinear
bool

If set the Stepper will not assist in controlling steps for linear flow.

orientation
'horizontal' | 'vertical'

The stepper orientation (layout flow direction).