nunntom/elm-ui-select
1
1
Fork 0
mirror of https://github.com/nunntom/elm-ui-select.git synced 2024-11-22 21:19:26 +03:00
Code Issues Packages Projects Releases Wiki Activity

Tidy up examples

Browse Source
This commit is contained in:
Tom Nunn 2022-07-21 21:57:27 +02:00 committed by Tom Nunn
parent 8c15d68e3e
commit da1e069f8c
3 changed files with 10 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
examples/src/EffectExample.elm
View File

@ -5,7 +5,6 @@ import Countries exposing (Country)
import Element import Element
import Element.Input as Input import Element.Input as Input
import Html exposing (Html) import Html exposing (Html)
import Html.Attributes
import Resources.ClearButton import Resources.ClearButton
import Select exposing (Select) import Select exposing (Select)
import Select.Effect import Select.Effect
@ -46,7 +45,7 @@ view model =
] ]
[ Select.view [] [ Select.view []
{ onChange = CountrySelectMsg { onChange = CountrySelectMsg
, label = Input.labelAbove [ Element.htmlAttribute <| Html.Attributes.for (Select.toInputElementId model.countrySelect) ] (Element.text "Choose a country") , label = Input.labelAbove [] (Element.text "Choose a country")
, placeholder = Just (Input.placeholder [] (Element.text "Type to search")) , placeholder = Just (Input.placeholder [] (Element.text "Type to search"))
, itemToString = \c -> c.flag ++ " " ++ c.name , itemToString = \c -> c.flag ++ " " ++ c.name
} }

25
examples/src/Example.elm
View File

@ -5,9 +5,8 @@ import Countries exposing (Country)
import Element import Element
import Element.Input as Input import Element.Input as Input
import Html exposing (Html) import Html exposing (Html)
import Html.Attributes import Resources.ClearButton
import Select exposing (Select) import Select exposing (Select)
import Element.Region
main : Program () Model Msg main : Program () Model Msg
main = main =
@ -44,21 +43,13 @@ view model =
, Element.padding 30 , Element.padding 30
] ]
[ Select.view [] [ Select.view []
{ onChange = CountrySelectMsg { onChange = CountrySelectMsg
, label = Input.labelAbove [ Element.htmlAttribute <| Html.Attributes.for (Select.toInputElementId model.countrySelect) ] (Element.text "Choose a country") , label = Input.labelAbove [] (Element.text "Choose a country")
, placeholder = Just (Input.placeholder [] (Element.text "Type to search")) , placeholder = Just (Input.placeholder [] (Element.text "Type to search"))
, itemToString = \c -> c.flag ++ " " ++ c.name , itemToString = \c -> c.flag ++ " " ++ c.name
} }
|> Select.withClearButton |> Select.withClearButton (Just Resources.ClearButton.clearButton)
(Just |> Select.toElement model.countrySelect
(Select.clearButton [
Element.alignRight
, Element.centerY
, Element.moveLeft 12 ]
(Element.el [ Element.Region.description "clear selection" ] (Element.text "❌"))
)
)
|> Select.toElement model.countrySelect
, Maybe.map (\{ name } -> Element.text ("You chose " ++ name)) (Select.toValue model.countrySelect) , Maybe.map (\{ name } -> Element.text ("You chose " ++ name)) (Select.toValue model.countrySelect)
|> Maybe.withDefault Element.none |> Maybe.withDefault Element.none
] ]

2
package.json
View File

@ -10,7 +10,7 @@
"examples": "cd examples/src && elm reactor" "examples": "cd examples/src && elm reactor"
}, },
"pre-commit": [ "pre-commit": [
"review" "ci"
], ],
"repository": { "repository": {
"type": "git", "type": "git",