Require name field

src/Nri/Ui/RadioButton/V3.elm

@@ -3,7 +3,6 @@ module Nri.Ui.RadioButton.V3 exposing
     , disabled, enabled
     , value, selectedValue, valueToString
     , onSelect
-    , name
     , premium, showPennant
     , disclosure
     , hiddenLabel, visibleLabel
@@ -19,7 +18,6 @@ module Nri.Ui.RadioButton.V3 exposing
 @docs disabled, enabled
 @docs value, selectedValue, valueToString
 @docs onSelect
-@docs name
 @docs premium, showPennant
 @docs disclosure
 @docs hiddenLabel, visibleLabel
@@ -68,14 +66,6 @@ enabled =
         \config -> { config | isDisabled = False }
 
 
-{-| Every radio button in the same group should have the same name
--}
-name : String -> Attribute value msg
-name name_ =
-    Attribute emptyEventsAndValues <|
-        \config -> { config | name = Just name_ }
-
-
 {-| Sets the value of one radio button
 -}
 value : value -> Attribute value msg
@@ -255,8 +245,8 @@ maybeAttr attr maybeValue =
 
 {-| View a single radio button.
 -}
-view : String -> List (Attribute value msg) -> Html msg
-view label attributes =
+view : { label : String, name : String } -> List (Attribute value msg) -> Html msg
+view { label, name } attributes =
     let
         config =
             applyConfig attributes emptyConfig
@@ -264,23 +254,12 @@ view label attributes =
         eventsAndValues =
             applyEvents attributes
 
-        name_ =
-            -- TODO: name should probably be a required property,
-            -- since radio button group keyboard behavior won't
-            -- work without it
-            case config.name of
-                Just n ->
-                    n
-
-                Nothing ->
-                    "default-radio-button-group"
-
         stringValue =
             Maybe.map2 (\f v -> f v) eventsAndValues.valueToString eventsAndValues.value
                 |> Maybe.withDefault "default-radio-value"
 
         id_ =
-            name_ ++ "-" ++ dasherize (toLower stringValue)
+            name ++ "-" ++ dasherize (toLower stringValue)
 
         isChecked =
             eventsAndValues.selectedValue == eventsAndValues.value
@@ -322,7 +301,7 @@ view label attributes =
             , Css.batch config.containerCss
             ]
         ]
-        [ radio name_
+        [ radio name
             stringValue
             isChecked
             [ id id_

styleguide-app/Examples/RadioButton.elm

@@ -96,7 +96,9 @@ viewRadioButtons : SelectionSettings -> Maybe Selection -> Html Msg
 viewRadioButtons selectionSettings selectedValue =
     div []
         [ RadioButton.view
-            (selectionToString Dogs)
+            { label = "Dogs"
+            , name = "pets"
+            }
             ([ RadioButton.value Dogs
              , RadioButton.selectedValue selectedValue
              , RadioButton.onSelect Select
@@ -105,7 +107,9 @@ viewRadioButtons selectionSettings selectedValue =
                 ++ List.map Tuple.second selectionSettings.dogs
             )
         , RadioButton.view
-            (selectionToString Cats)
+            { label = "Cats"
+            , name = "pets"
+            }
             ([ RadioButton.value Cats
              , RadioButton.selectedValue selectedValue
              , RadioButton.onSelect Select
@@ -114,7 +118,9 @@ viewRadioButtons selectionSettings selectedValue =
                 ++ List.map Tuple.second selectionSettings.cats
             )
         , RadioButton.view
-            (selectionToString Rats)
+            { label = "Rats"
+            , name = "pets"
+            }
             ([ RadioButton.value Rats
              , RadioButton.selectedValue selectedValue
              , RadioButton.onSelect Select
@@ -179,16 +185,6 @@ initSelectionSettings =
 controlAttributes : Control (List ( String, RadioButton.Attribute Selection Msg ))
 controlAttributes =
     ControlExtra.list
-        |> ControlExtra.listItem "name"
-            (Control.choice
-                [ ( "pets"
-                  , Control.value
-                        ( "RadioButton.name \"pets\""
-                        , RadioButton.name "pets"
-                        )
-                  )
-                ]
-            )
         |> ControlExtra.listItem "hiddenLabel" labelVisibility
         |> ControlExtra.listItem "disabled" disabledOrEnabled
         |> ControlExtra.optionalListItem "showPennant" showPennant