Fluentui: Request: Add Stepper component or add stepper to Pivot's linkFormat options

[kngrace]

I'm attempting to create a multi-step form (similar to a wizard with next/back buttons) in a panel and I'd like to represent the user's progress with a bar at the top. Pivot is the closest component because of its functionality and appearance but it's still far from perfect.

I'd like something more similar in appearance to this image of another React Stepper but I want it to be part of the Office design family (and respects themes in SharePoint).

Some expected functionality (ordered from most important to least):

• Can disable all navigation functionality from user interacting with component directly
• Each Stepper Item can individually change between common states (selected, disabled, and default)
• Can appear in header
• Has at least 2 size options
• Able to set component to fill width of container
• Can customize colors
• Can customize other aspects (icons, line thickness, open or filled circle, etc)

[micahgodbolt]

Could this be something to do with progressIndicator? Adding milestones in the progressIndicator.

[kngrace]

I had initially considered progressIndicator but it felt heavily focused on being a non-interactive visual representation of a frequent updating status controlled by a background process (not the user).

By contrast, the Pivot component allows clear and distinct chunks that support user interaction to navigate and content easily controlled to each distinct chunk. It's cleaner code for me to use Pivot than to replicate its functionality of a single panel with ordered pages tied to a 0..n key value.

So while it _might_ make sense to add a stepper variant to progressIndicator (since a stepper at its heart is a way to indicate progress within a wizard), that variant would need to duplicate much of the functionality that Pivot already has such as: ordered items, current state, state navigation, labels.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions to Fabric React!
Why am I receiving this notification?

[stale[bot]]

This issue has been automatically closed because it has not had recent activity after being marked as stale. If you belive this issue is still a problem or should be reopened, please reopen it! Thank you for your contributions to Fabric React!
Why am I receiving this notification?

[evantrimboli]

I would be interested in something like this as well. Here's an example of one included with Material UI:

https://material-ui.com/demos/steppers/

[gioce90]

This would be an interesting feature. You have some news?