This is an alternative site for discovering Elm packages. You may be looking for the official Elm package site instead.
Accessible tab widget using tesk9/elm-html-a11y.
version 3.0.1
license BSD3
native-modules False
elm-version 0.18.0 <= v < 0.19.0
Tag 3.0.1
Committed At 2017-09-25 00:49:47 UTC
wernerdegroot/listzipper 3.0.0 <= v < 4.0.0 3.1.1
tesk9/accessible-html 2.0.0 <= v < 3.0.0 2.0.0
rtfeldman/elm-css-helpers 2.1.0 <= v < 3.0.0 2.1.0
rtfeldman/elm-css 11.2.0 <= v < 12.0.0 11.2.0
elm-lang/html 2.0.0 <= v < 3.0.0 2.0.0
elm-lang/core 5.1.1 <= v < 6.0.0 5.1.1

README

elm-tabs

Accessible tab widget using accessible-html.

Example:

import Html exposing (beginnerProgram)
import Accessibility as Html exposing (..)
import List.Zipper exposing (Zipper)
import Tabs.Model exposing (Model)
import Tabs.Update exposing (update)
import Tabs.View exposing (view)


main : Program Never Model Tabs.Update.Msg
main =
    beginnerProgram
        { model = model
        , update = update
        , view = view
        }


model : Model
model =
    { groupId = "test-view-container"
    , tabPanels = initZipper
    }


initZipper : Zipper ( Int, Html Never, Html Never )
initZipper =
    List.Zipper.Zipper
        []
        ( 0, header "Tab1", panel "Panel1" )
        [ ( 1, header "Tab2", panel "Panel2" )
        , ( 2, header "Tab3", panel "Panel3" )
        , ( 3, header "Tab4", panel "Panel4" )
        , ( 4, header "Tab5", panel "Panel5" )
        ]


header : String -> Html msg
header tabContent =
    h2 [] [ text tabContent ]


panel : String -> Html msg
panel panelContent =
    div []
        [ h3 [] [ text panelContent ]
        , text panelContent
        ]