lenards / elm-ui-patternfly / PF4.Radio

A component for presenting mutually exclusive choices

Definition


type Radio option msg

Opaque Radio element that can produce msg messages from a mutually exclusive choices of option

Constructor function

radio : { onChange : option -> msg, selected : Maybe option, label : String, options : List { value : option, text : String } } -> Radio option msg

Constructs a Radio from the arguments

Default configuration is to:

Argument Info:

For example, if a user is choosing between some type of "resources", like the Volumes attached to a virtual machine, the label would be rendered above chooses related to Volumes.

Configuration functions


type alias OptionStatePalette =
{ idle : Element.Color
, focused : Element.Color
, selected : Element.Color 
}

A palette rendering the color of the radio button given the possible OptionState defined in elm-ui.

withOptionStatePalette : { idle : Element.Color, focused : Element.Color, selected : Element.Color } -> Radio option msg -> Radio option msg

Render with a custom palette

asRow : Radio option msg -> Radio option msg

Configure to render options in a row, left-to-right

asColumn : Radio option msg -> Radio option msg

Configure to render options in a column, stacked

Extra Attributes functions

withOptionExtraAttributes : List (Element.Attribute msg) -> Radio option msg -> Radio option msg

Provide a list of attributes to include on option label elements.

This will not impact the label rendered above the Radio button options.

Use withLabelAttributes to impact that element.

withLabelAttributes : List (Element.Attribute msg) -> Radio option msg -> Radio option msg

Provide a list of attributes to include on the label over the entire element.

If you're looking to add attributes to the Radio buttons options, use withOptionExtraAttributes.

Rendering element

toMarkup : Radio option msg -> Element msg

Given the custom type representation, renders as an Element msg.