nathanjohnson320 / elm-ui-components / ElmUIC.Selector

A styled selector


type alias Selector =
{ kind : ElmUIC.Theme.ColorSetting
, size : ElmUIC.Theme.Size
, placeholder : String
, open : Basics.Bool
, options : List Option
, selected : Option 
}

Base model for a selector


type alias Option =
{ key : String
, value : String 
}

Individual items that display in the selector

defaultSelector : Selector

Instantiates the default properties of a selector

{ defaultNavbar | kind = Danger }

selector : ElmUIC.Theme.Theme -> Selector -> (Option -> msg) -> List (Html.Styled.Attribute msg) -> List (Html.Styled.Html msg) -> Html.Styled.Html msg

A styled nav using items and separators

selector defaultTheme
    { defaultSelector
        | placeholder = "Select a choice"
        , open = model.selectedOpen
        , options = model.options
        , selected = model.selected
        , kind = Theme.Danger
    }
    Select
    [ css
        [ width (px 200) ]
    ]
    []