You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I open this as a bug, as I consider this as a conceptional bug:
The "radio group" component is currently conceptional completely different than other form control components in Shoelace, which really should not be, IMHO.
If the attribute label is set (or the corresponding slot is used) this should be handled as for (almost) all other SL form control components, means: the label shall be shown directly above the input elements.
This is the way it is for example done in Microsoft Fluent UI's ChoiceGroup component:
... or in Vaadin's vaadin-radio-group component:
If you currently want to show the label in SL's radio group than you have to set attribute fieldset, but this will show an ugly fieldset frame around it, and you have to use CSS to fix that appearance if you don't like or need it.
Horizontal label layout is not really easy to implement. It may be possible (I have not tried it) but it will be in any cases different and not as easy as described here.
Stuff like this is not easy to implement because of the mentioned issues:
Proposal:
If attribute fieldet is set then render as already done (Is there really demand for this feature? Anyway...).
If attribute fieldset is not set then render the radio group without <fieldset> element. Instead render everything similar to other SL form controls, using the usual CSS parts form-control, form-control-label, form-control-input.
For use cases where no visual label shall be used, provide an additional attribute to set the "hidden label" (or something similar) for accessibility reasons.
The text was updated successfully, but these errors were encountered:
This is a valid point. Give me some time to circle back and address this, as I have some other form control-related improvements I'd like to make as well.
I've reworked radio group to act more like inputs and textareas, where they have a label, the control, and optional help text. The styling was also improved to remove the border by default, as Shoelace shouldn't have an opinion here. Users can add it back by targeting the form-control and form-control__label parts.
These changes will be available in the next release.
I open this as a bug, as I consider this as a conceptional bug:
The "radio group" component is currently conceptional completely different than other form control components in Shoelace, which really should not be, IMHO.
If the attribute
label
is set (or the corresponding slot is used) this should be handled as for (almost) all other SL form control components, means: the label shall be shown directly above the input elements.This is the way it is for example done in Microsoft Fluent UI's
ChoiceGroup
component:... or in Vaadin's
vaadin-radio-group
component:If you currently want to show the label in SL's radio group than you have to set attribute
fieldset
, but this will show an ugly fieldset frame around it, and you have to use CSS to fix that appearance if you don't like or need it.Horizontal label layout is not really easy to implement. It may be possible (I have not tried it) but it will be in any cases different and not as easy as described here.
Stuff like this is not easy to implement because of the mentioned issues:
Proposal:
fieldet
is set then render as already done (Is there really demand for this feature? Anyway...).fieldset
is not set then render the radio group without<fieldset>
element. Instead render everything similar to other SL form controls, using the usual CSS partsform-control
,form-control-label
,form-control-input
.The text was updated successfully, but these errors were encountered: