Checkbox: red asterisk is not displayed when required="true"

[summer2200]

Describe the bug

When set the required attribute to true, checkbox's label does not have a red asterisk in the end.

Isolated Example

No response

Reproduction steps

Expected Behaviour

No response

Screenshots or Videos

No response

UI5 Web Components for React Version

2.7.1

UI5 Web Components Version

2.7.2

Browser

Chrome

Operating System

Mac

Additional Context

No response

Relevant log output

Organization

No response

Declaration

• I’m not disclosing any internal or sensitive information.

[Lukas742]

Thanks for reporting! I'll forward this issue to our UI5 Web Components Colleagues as the affected component is developed in their repository.

[dobrinyonkov]

Hello @summer2200, thanks for reporting this issue!

While we resolve this incident, you can use the ui5-label in combination with ui5-checkbox and set the required state on the label. Check the following example.

Hello @SAP/ui5-webcomponents-topic-p, this issue could be seen in following example

Kind Regards,
Dobrin

[summer2200]

Hi @dobrinyonkov ,

Thanks for sharing the workaround, I tried it on my side but the alignment looks not correct, also tried putting checkbox and label into a flex box with different align-items settings but still looks weird.

And the focus behavior is different:
with label:

with checkbox's text:

So I'll just wait for the release of your fix. Thanks!

[dobrinyonkov]

Internal Reference: BGSOFUIPIRIN-6796