gribouille / elm-select-tailwind / Select

Select component.

State


type alias ID =
Config.ID

ID of a element.


type alias State a =
State a

Opaque type for the component's state.

init : State a

Initialize a default and empty state.

get : State a -> List a

Get the data from the State.

selected : State a -> Maybe a

Get the selected item or Nothing.

set : State a -> List a -> State a

Set the data in the State.

select : Maybe a -> State a -> State a

Select or unselect (Nothing) an item.

selectByID : Maybe ID -> Config a msg -> State a -> State a

Select or unselect (Nothing) an item by ID.

Configuration


type alias Config a msg =
Config a msg

Opaque type for the component's configuration.

config : (a -> ID) -> (a -> String) -> (State a -> msg) -> Config a msg

Initialize the component's configuration.

config : Select.Config User Msg
config =
    Select.config
        (String.fromInt << .id)
        (\x -> x.firstname ++ " " ++ x.lastname)
        OnSelectState
        |> Select.withPlaceholder "Select simple"
        |> Select.withCheck True

withClass : String -> Config a msg -> Config a msg

Add custom class to the component.

withCheck : Basics.Bool -> Config a msg -> Config a msg

Highlight if the value is not valid.

withPlaceholder : String -> Config a msg -> Config a msg

Customize the search input placeholder.

Component

view : Config a msg -> State a -> Html msg

Component's view.

subscriptions : Config a msg -> State a -> Platform.Sub.Sub msg

Component's subscriptions.