🎨 add value helper replacing current value config

This commit is contained in:
Tessa Kelly 2021-11-04 10:44:47 -07:00
parent 8f70b6d6f0
commit fff5a4c621
2 changed files with 31 additions and 18 deletions

View File

@ -1,5 +1,6 @@
module Nri.Ui.Select.V8 exposing module Nri.Ui.Select.V8 exposing
( view, generateId ( view, generateId
, value
, Attribute , Attribute
, id , id
, errorIf, errorMessage , errorIf, errorMessage
@ -22,6 +23,8 @@ module Nri.Ui.Select.V8 exposing
### Input content ### Input content
@docs value
### Input handlers ### Input handlers
@ -58,17 +61,23 @@ we'll automatically generate one from the label you pass in, but this can
cause problems if you have more than one text input with the same label on cause problems if you have more than one text input with the same label on
the page. Use this to be more specific and avoid issues with duplicate IDs! the page. Use this to be more specific and avoid issues with duplicate IDs!
-} -}
id : String -> Attribute id : String -> Attribute value
id id_ = id id_ =
Attribute (\config -> { config | id = Just id_ }) Attribute (\config -> { config | id = Just id_ })
{-| -}
value : Maybe value -> Attribute value
value value_ =
Attribute (\config -> { config | value = value_ })
{-| Sets whether or not the field will be highlighted as having a validation error. {-| Sets whether or not the field will be highlighted as having a validation error.
If you have an error message to display, use `errorMessage` instead. If you have an error message to display, use `errorMessage` instead.
-} -}
errorIf : Bool -> Attribute errorIf : Bool -> Attribute value
errorIf = errorIf =
Attribute << InputErrorInternal.setErrorIf Attribute << InputErrorInternal.setErrorIf
@ -76,33 +85,35 @@ errorIf =
{-| If `Just`, the field will be highlighted as having a validation error, {-| If `Just`, the field will be highlighted as having a validation error,
and the given error message will be shown. and the given error message will be shown.
-} -}
errorMessage : Maybe String -> Attribute errorMessage : Maybe String -> Attribute value
errorMessage = errorMessage =
Attribute << InputErrorInternal.setErrorMessage Attribute << InputErrorInternal.setErrorMessage
{-| Customizations for the Select. {-| Customizations for the Select.
-} -}
type Attribute type Attribute value
= Attribute (Config -> Config) = Attribute (Config value -> Config value)
applyConfig : List Attribute -> Config applyConfig : List (Attribute value) -> Config value
applyConfig attributes = applyConfig attributes =
List.foldl (\(Attribute update) config -> update config) List.foldl (\(Attribute update) config -> update config)
defaultConfig defaultConfig
attributes attributes
type alias Config = type alias Config value =
{ id : Maybe String { id : Maybe String
, value : Maybe value
, error : ErrorState , error : ErrorState
} }
defaultConfig : Config defaultConfig : Config value
defaultConfig = defaultConfig =
{ id = Nothing { id = Nothing
, value = Nothing
, error = InputErrorInternal.init , error = InputErrorInternal.init
} }
@ -119,11 +130,10 @@ view :
String String
-> ->
{ choices : List (Choice a) { choices : List (Choice a)
, current : Maybe a
, valueToString : a -> String , valueToString : a -> String
, defaultDisplayText : Maybe String , defaultDisplayText : Maybe String
} }
-> List Attribute -> List (Attribute a)
-> Html a -> Html a
view label config attributes = view label config attributes =
let let
@ -152,7 +162,7 @@ view label config attributes =
[ Html.text label ] [ Html.text label ]
, viewSelect , viewSelect
{ choices = config.choices { choices = config.choices
, current = config.current , current = config_.value
, id = id_ , id = id_
, valueToString = config.valueToString , valueToString = config.valueToString
, defaultDisplayText = config.defaultDisplayText , defaultDisplayText = config.defaultDisplayText

View File

@ -31,14 +31,14 @@ example =
, view = , view =
\state -> \state ->
let let
attributes : Settings
attributes = attributes =
Control.currentValue state.attributes Control.currentValue state.attributes
in in
[ Control.view UpdateAttributes state.attributes [ Control.view UpdateAttributes state.attributes
|> Html.Styled.fromUnstyled |> Html.Styled.fromUnstyled
, Select.view "Tortilla Selector" , Select.view "Tortilla Selector"
{ current = Nothing { choices =
, choices =
[ { label = "Tacos", value = "Tacos" } [ { label = "Tacos", value = "Tacos" }
, { label = "Burritos", value = "Burritos" } , { label = "Burritos", value = "Burritos" }
, { label = "Enchiladas", value = "Enchiladas" } , { label = "Enchiladas", value = "Enchiladas" }
@ -51,8 +51,7 @@ example =
, Html.Styled.div , Html.Styled.div
[ Html.Styled.Attributes.css [ Css.maxWidth (Css.px 400) ] ] [ Html.Styled.Attributes.css [ Css.maxWidth (Css.px 400) ] ]
[ Select.view "Selector with Overflowed Text" [ Select.view "Selector with Overflowed Text"
{ current = Nothing { choices = []
, choices = []
, valueToString = identity , valueToString = identity
, defaultDisplayText = Just "Look at me, I design coastlines, I got an award for Norway. Where's the sense in that?" , defaultDisplayText = Just "Look at me, I design coastlines, I got an award for Norway. Where's the sense in that?"
} }
@ -65,7 +64,7 @@ example =
{-| -} {-| -}
type alias State = type alias State =
{ attributes : Control (List Select.Attribute) { attributes : Control Settings
} }
@ -76,7 +75,11 @@ init =
} }
initControls : Control (List Select.Attribute) type alias Settings =
List (Select.Attribute String)
initControls : Control Settings
initControls = initControls =
ControlExtra.list ControlExtra.list
|> ControlExtra.optionalListItem "errorIf" |> ControlExtra.optionalListItem "errorIf"
@ -88,7 +91,7 @@ initControls =
{-| -} {-| -}
type Msg type Msg
= ConsoleLog String = ConsoleLog String
| UpdateAttributes (Control (List Select.Attribute)) | UpdateAttributes (Control Settings)
{-| -} {-| -}