Radios can be associated with a 'conditionally revealed' content block – for example, a radio for 'Phone' could reveal an additional form field for the user to enter their phone number.
These associations are made using a data-aria-controls attribute, which
is promoted to an aria-controls attribute during initialisation.
We also need to restore the state of any conditional reveals on the page (for example if the user has navigated back), and set up event handlers to keep the reveal in sync with the radio state.
HTML element to use for radios
Protected_$rootPrivate$inputsStaticelementStaticmoduleName for the component used when initialising using data-module attributes.
Protected$rootProtectedReturns the root element of the component
ProtectedconfigProtectedReturns the root element of the component
PrivatehandlePrivateClick event handler
Handle a click within the component root – if the click occurred on a radio, sync the state of the conditional reveal for all radio buttons in the same form with the same name (because checking one radio could have un-checked a radio under the root of another Radio component)
Click event
PrivatesyncPrivatesyncStaticcheckStaticconfig
Radios component