import { StepNavigation } from "@wfp/react"; () => { return <StepNavigation selectedStep={1} />; };
React.ReactNode
Provide the contents of your StepNavigation
string
Provide a className that is applied to the root nav component for the StepNavigationProps
boolean
Specify whether the StepNavigation will be displayed vertically
By default, this value is "navigation". You can also provide an alternate role if it makes sense from the accessibility-side
number
Optionally provide an index for the currently selected step
import { StepNavigationItem } from "@wfp/react"; () => { return <StepNavigationItem />; };
Provide a className that is applied to the StepNavigation component
ReactNode
Provide text that is used alongside the control label for additional help
Provide the index of the each item
Provide the text that will be read by a screen reader when visiting this control
By default, this value is "presentation". You can also provide an alternate role if it makes sense from the accessibility-side
The page number of the step.
StatusType
Provide status one of "warning" | "error" | "in-progress" status prop type to your step to give more meaning.
(p: object) => {}
An optional parameter to allow overriding the anchor rendering. Useful for using Tab along with react-router or other client side router libraries.
(e: object) => {}
On click handler to change the currently active item.
(e?: any,index?: number,label?: string) => {}