Elm Bootstrap Accordion Show in init

Question

I'm currently approaching Elm, and I need to create a page with some collapsible data. Since I'm currently using Bootstrap, the Accordion component seems to be the best to use.

Here is my corresponding dummy code:

view : Model -> Html Msg view model = div [] [ basicAccordion model.accordionState "Dummy1" (div [] [ text "Dummy Title" , Button.button [ Button.secondary ] [ text "Hello World" ] ] ) Nothing , structuredAccordion model.accordionState "Dummy2" ([ Card.titleH4 [] [ text "Another trial" ] , Card.text [] [ text "Bye" ] ] ) (Just ("id_dummy2")) ] basicAccordion : Accordion.State -> String -> Html Msg -> Maybe String -> Maybe Bool -> Html Msg basicAccordion state title content id collapsed = let singleCard = Card.custom <| content in structuredAccordion state title [ singleCard ] id collapsed structuredAccordion : Accordion.State -> String -> List (Card.BlockItem Msg) -> Maybe String -> Maybe Bool -> Html Msg structuredAccordion state title content id collapsed = Accordion.config Msgs.AccordionMsg |> Accordion.withAnimation |> Accordion.cards [ Accordion.card { id = (Maybe.withDefault title id) , options = [] , header = Accordion.header [] <| Accordion.toggle [] [ text title ] , blocks = [ Accordion.block [] content ] } ] |> Accordion.view state 

Here's the problem:

• I would like to show the contents of the Accordion as the initial state of the page
• I found out that there is a default setting for a bootstrap accordion, but there is nothing to do with its visibility, which is set by Bootstrap.Accordion

For me, this is a fairly basic function, and I was surprised that this is not part of the map configuration ... I hope I do not notice anything. Any idea?

PS: The first message, be merciful :)

Answer 1

A small update that is almost a solution.

Good guy rundis made a new version. , which allows you to give one card an initially expanded state. This is likely to be part of the 4.0 package release.

The interface is pretty simple since you just need to add to init:

 model.AccordionState = Accordion.initialStateCardOpen myAccordionId 

where id is the one that is set in the view when creating the Accordion.

This does not make me completely happy, because I would like to choose one of several cards to be opened, but partially solves the problem.