-
Notifications
You must be signed in to change notification settings - Fork 11
Description
Currently DBSelect
, DBInput
etc add a small asterisk in the ::after
Pseudo Element of their label when the control is marked as required. This should be optional or skippable.
Let's say we have a simple form with a few <input>
and <select>
fields and we have a form-wide description that all fields are required or we simply saying everything is required unless a field is labelled as "optional".
So in my case I assume that I don't need to visually tell users, for every field that it is required since the every information is required and probably I've also written it before. In such case I think the asterisk "*" coming from input[required=true]
or select[required=true]
is may visually distracting. Nonetheless, I want to semantically mark the fields as required
sind when going through the form with a screenreader I don't have this visual overview an probably I jump directly into the form without reading the hint before that every field is required. In this cases, I want to clearly know that the input is required.
Long story short: It would be nice to have an option to disable / hide the Asterisk ("*") within the label even if a control has been marked as required.
For example:
<DBInput label="firstname" required ={true} requiredAnnotation={false} />
In such case the rendered HTML should contain required="true"
but the CSS applied to the label should not have the "*" in the ::after()
element.
Metadata
Metadata
Assignees
Labels
Type
Projects
Status
Activity
d-koppenhagen commentedon May 13, 2025
Current workaround:
and...
nmerget commentedon May 13, 2025
@leape this is also part of the design
feat: add property `requiredAnnotation` to disable visual indicator (…
showRequiredAsterisk
to disable visual indicator (*
) for semantically marked required form elements #4366feat: add property `requiredAnnotation` to disable visual indicator (…