From fa32f9199846bf53a9ec6c2437cf420563fabff3 Mon Sep 17 00:00:00 2001 From: John Evans Date: Tue, 8 Nov 2016 22:05:00 -0700 Subject: [PATCH] Add from' for customization of labels and values. --- src/Select.elm | 41 ++++++++++++++++++++++++++++++++++++++--- 1 file changed, 38 insertions(+), 3 deletions(-) diff --git a/src/Select.elm b/src/Select.elm index c110458..b4ef641 100644 --- a/src/Select.elm +++ b/src/Select.elm @@ -1,16 +1,51 @@ -module Select exposing (from) +module Select exposing (from, from') + +{-| This module provides the `Select.from` helper make working with `select` +elements from Elm easier. + +# Helpers +@docs from, from' + +-} import Html exposing (Html, option, select, text) import Html.Attributes exposing (value) import Html.Events exposing (onInput) +{-| Convert a list of values and stringifying function for values of that type +into a `select` element which contains as it's values the list of values. + + from [North, South, East, West] Direction + +would produce a select element with box option values and labels being the +string versions of four cardinal directions which would send messages +like (Direction North) or (Direction East) when the user selects new directions +from the drop down. + +-} from : List a -> (a -> msg) -> Html msg from xs msg = + from' xs msg toString toString + + +{-| Convert a list of values and stringifying function for values of that type +into a `select` element which contains as it's values the list of values. + + from' [North, South, East, West] Direction toId toLabel + +would produce a select element with box option values and labels being decided +by the `toId` and `toLabel` functions, which would send messages +like (Direction North) or (Direction East) when the user selects new directions +from the drop down. + +-} +from' : List a -> (a -> msg) -> (a -> String) -> (a -> String) -> Html msg +from' xs msg toId toLabel = let optionize x = - option [ (value << toString) x ] - [ (text << toString) x ] + option [ (value << toId) x ] + [ (text << toLabel) x ] in select [ onInput (msg << makeFromString' xs) ] (List.map optionize xs)