mirror of
https://github.com/NoRedInk/noredink-ui.git
synced 2024-12-22 05:01:40 +03:00
57 lines
1.4 KiB
Elm
57 lines
1.4 KiB
Elm
module Examples.Tabs exposing
|
|
( example
|
|
, Tab(..)
|
|
)
|
|
|
|
{-|
|
|
|
|
@docs example
|
|
|
|
-}
|
|
|
|
import Html.Styled as Html
|
|
import List.Zipper
|
|
import ModuleExample as ModuleExample exposing (Category(..), ModuleExample)
|
|
import Nri.Ui.Tabs.V3 as Tabs
|
|
|
|
|
|
type Tab
|
|
= First
|
|
| Second
|
|
|
|
|
|
example : (Tab -> msg) -> Tab -> ModuleExample msg
|
|
example changeTab tab =
|
|
{ filename = "Nri.Ui.Tabs.V3"
|
|
, category = Behaviors
|
|
, content =
|
|
[ Tabs.view
|
|
{ title = Nothing
|
|
, onSelect = changeTab
|
|
, tabs =
|
|
case tab of
|
|
First ->
|
|
List.Zipper.Zipper [] (Tabs.Tab "First tab" First) [ Tabs.Tab "Second tab" Second ]
|
|
|
|
Second ->
|
|
List.Zipper.Zipper [ Tabs.Tab "First tab" First ] (Tabs.Tab "Second tab" Second) []
|
|
, content =
|
|
\id ->
|
|
case id of
|
|
First ->
|
|
Html.text "First"
|
|
|
|
Second ->
|
|
Html.text "Second"
|
|
, alignment = Tabs.Center
|
|
}
|
|
, Tabs.links
|
|
{ title = Nothing
|
|
, content = Html.text "Links"
|
|
, alignment = Tabs.Left
|
|
, tabs =
|
|
List.Zipper.Zipper [] (Tabs.TabLink "Nowhere" Nothing) [ Tabs.TabLink "Elm" (Just "http://elm-lang.org") ]
|
|
}
|
|
]
|
|
}
|