Radio buttons provide a UI element for selecting one out of several visible choices. One may label them with text to explain the semantics of the selected choice to users.
Radio buttons can be used in HTML forms as well as React controlled components.
For grouping multiple related radio buttons in a style-guide-conformant fashion see <axa-fieldset>.
The Boolean attribute button, when true, changes the radio button UI to a button-like appearance (default: false).
The Boolean attribute checked controls whether the radio button is selected (true) or not (false).
If checked is defined when first set under React, controlled-component mode is activated.
The Boolean attribute disabled controls whether the radio button can be user-modified (false) or not (true).
A disabled radio button will not be submitted in a form.
The string-valued refId sets the id attribute of the component's hidden <input>.
The string-valued value sets the value attribute of underlying <input type="radio">.
It is especially useful in combination with form submission of the component.
The string-valued name sets the name attribute of underlying <input type="radio">.
It serves as the group identifier of all N same-named radio buttons that collectively exhibit one-out-N-choice behaviour.
It is a necessary attribute for form submission of the component.
The string-valued label sets the visible text of this radio button (default: '').
The Boolean nogap attribute, when true, suppresses the horizontal gap between this radio button and its left neighbour in conjunction with an enclosing <axa-fieldset horizontal>.
It is intended for two-radio-button choices.
The Boolean noAutoWidth attribute, when true, suppresses the auto-width calculation for button-type radio buttons.
The string-valued icon attribute receives a valid SVG icon with working dimensions 48×48 pixels.
The function-valued onChange can be used as a callback prop for React and other frameworks.
Its only parameter is the native change event object from the underlying <input type="radio">.
The callback is invoked whenever the change event from the underlying <input type="radio"> fires.
It is especially important in controlled-component mode.
The function-valued onFocus, onBlur can be used as a callback prop for React and other frameworks.
Its only parameter in each case is the native focus, blur event object from the underlying <input type="radio">.
The respective callbacks are invoked whenever the underlying <input type="radio"> receives or loses focus.