vaadin / web-components

A set of high-quality standards based web components for enterprise web applications. Part of Vaadin 20+
https://vaadin.com/docs/latest/components
445 stars 83 forks source link

[radio-group] Support additional fields in Radio Buttons [1 day] #4778

Open rolfsmeds opened 1 year ago

rolfsmeds commented 1 year ago

Describe your motivation

Radio button groups with additional "parameter" fields in the options is a farily common UI pattern:

image

The Radio Button Group component doesn't currently support this, nor are there any good workarounds for doing it. (The closest thing might be custom renderers for the items, but this is hacky at best.)

Example of how this might be done with plain HTML: https://codepen.io/rsmeds/pen/QWrRYqE

Describe the solution you'd like

Not sure how this could be solved in a way that is accessible and makes it possible to databind the fields with Flow/Hilla databinding. (The example plain HTML implementation above probably has accessibility issue itself.)

Suggestions welcome.

Describe alternatives you've considered

No response

Additional context

No response

web-padawan commented 1 year ago

Implementing this would also require to solve #1112 by handling keydown and click events.