PF6.Tabs

PF6 Tabs component

Tabs allow users to navigate between views within the same context.

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

Definition

type Tabs msg

Opaque Tabs type

type Tab msg

A single tab definition

type Variant

Tab display variant

Constructor

tabs :

{ activeKey : String

, onSelect : String -> msg

, tabs : List (Tab msg)

}

-> Tabs msg

Construct a Tabs component

tabs
    { activeKey = model.activeTab
    , onSelect = TabSelected
    , tabs = [ tab "overview" "Overview", tab "details" "Details" ]
    }

Tab item constructors

tab : String -> String -> Tab msg

Construct a tab with a key and label

withTabIcon : Element msg -> Tab msg -> Tab msg

Add an icon to a tab

withTabDisabled : Tab msg -> Tab msg

Disable a tab

Variant modifiers

withBox : Tabs msg -> Tabs msg

Box variant — tabs have a box/card appearance

withVertical : Tabs msg -> Tabs msg

Vertical layout

withFilled : Tabs msg -> Tabs msg

Filled variant — tabs stretch to fill the width

Secondary tabs

withSecondary : Tabs msg -> Tabs msg

Secondary tabs (smaller, for sub-navigation)

Rendering

toMarkup : Tabs msg -> Element msg

Render the Tabs as an Element msg

lenards/elm-ui-patternfly/2.0.0