Creates an Accordion component by using predefined Html syntax.
Represents the state of the component. Values passed in are susceptible to change.
Returns the configuration for a Base accordion skin.
...
type alias Slug =
String
type Msg =
Toggled Slug Bool
...
myAccordionConfig : Accordion.Config
myAccordionConfig =
let
slug =
"my_accordion_slug"
tagger =
Toggled
in
Accordion.baseConfig slug tagger
...The same as baseConfig but with a Light skin.
The same as baseConfig but with a Dark skin.
Returns the basic state of the component.
...
myAccordionState : Accordion.State
myAccordionState =
let
isOpen =
False
title =
"My title"
content =
(List.singleton << text) "Lorem ipsum dolor sit amet."
in
Accordion.state isOpen title content
...Opens the Accordion to reveal it's content.
updatedAccordionState =
Accordion.open myAccordionStateCloses the Accordion to hide it's content.
updatedAccordionState =
Accordion.close myAccordionStateRenders the Accordion component by receiving is State and Config.
Accordion.render myAccordionState myAccordionConfigurationRenders a group of Accordion(s) inside an AccordionGroup.
Accordion.renderGroup
[ ( myAccordionState1, myAccordionConfiguration1 )
, ( myAccordionState2, myAccordionConfiguration2 )
, ( myAccordionState3, myAccordionConfiguration3 )
]
Represents the static configuration of the component. Values passed in are no more modified by the setter.