PF6.Wizard

PF6 Wizard component

A multi-step form wizard with sidebar navigation and step content.

See: https://www.patternfly.org/components/wizard

Definition

type Wizard msg

Opaque Wizard type

type WizardStep msg

Opaque WizardStep type

Constructors

wizard :

{ steps : List (WizardStep msg)

, activeStep : Int

}

-> Wizard msg

Construct a Wizard

wizard
    { steps =
        [ wizardStep { title = "Setup", content = setupView }
        , wizardStep { title = "Configure", content = configView }
        , wizardStep { title = "Review", content = reviewView }
        ]
    , activeStep = model.wizardStep
    }

wizardStep :

{ title : String

, content : Element msg

}

-> WizardStep msg

Construct a wizard step

wizardStep { title = "Setup", content = myContent }

Step modifiers

withStepDisabled : WizardStep msg -> WizardStep msg

Disable a wizard step (not clickable in sidebar)

withStepIcon : Element msg -> WizardStep msg -> WizardStep msg

Add a custom icon to a wizard step

Wizard modifiers

withOnStepChange : (Int -> msg) -> Wizard msg -> Wizard msg

Set a callback when a step is clicked in the sidebar

withOnNext : msg -> Wizard msg -> Wizard msg

Set the Next button message

withOnBack : msg -> Wizard msg -> Wizard msg

Set the Back button message

withOnCancel : msg -> Wizard msg -> Wizard msg

Set the Cancel button message

withOnFinish : msg -> Wizard msg -> Wizard msg

Set the Finish button message (shown on the last step instead of Next)

Rendering

toMarkup : Wizard msg -> Element msg

Render the Wizard as an Element msg

lenards/elm-ui-patternfly/2.1.0