PaackEng/paack-ui/5.0.0

NOTE: the latest version is 7.23.0

UI.Tabs

Tab allows visually selecting a page in a horizontal list.

Example of usage:

TabList.tabList Msg.SportSelect
    Sports.toString
    [ Sports.Soccer
    , Sports.Basket
    , Sports.Bowling
    ]
    model.sportSelected
    |> TabList.renderElement renderConfig

Building

type TabList msg a

The TabList msg a type is used for describing the component for later rendering.

tabList : (a -> msg) -> (a -> String) -> List a -> a -> TabList msg a

Describes everything required to create a TabList msg a.

Tabs.tabList Msg.TabSelect
    tabToString
    [ TabOne, TabTwo ]
    model.tabSelected

Rendering

renderElement : RenderConfig -> TabList msg a -> Element msg

End of the builder's life. The result of this function is a ready-to-insert Elm UI's Element.