As you see in the video, when you navigate by keyboard, the navigation does not recognize which radio button is selected, and when you return to the cards, the radio input that is not selected is focused.
For that reason, for the radio buttons to work correctly I have added the name as required in radioProps (apart from value), this being the correct behavior:
Hi guys!,
I am sending this pull because while fixing this bug https://liferay.atlassian.net/browse/LPD-1261, I realized the following:
https://github.com/liferay/clay/assets/9701095/51e8abd8-830f-4812-b611-c29b2eecbefe
As you see in the video, when you navigate by keyboard, the navigation does not recognize which radio button is selected, and when you return to the cards, the radio input that is not selected is focused.
This happens because to group the radio buttons in a group it is necessary to add the same
name
to all the inputs https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/radiogroup_role.For that reason, for the radio buttons to work correctly I have added the
name
as required inradioProps
(apart fromvalue
), this being the correct behavior:https://github.com/liferay/clay/assets/9701095/4712d646-2b32-422f-8d45-624ffd5991b2
Let me know what you think, thanks in advance! :smiley: