Checkbox: support for helper text and required state

[rolfsmeds]

Description

Support for helper-text in Checkbox (including individual checkboxes in a Checkbox Group), and support for required state (incl. indicator) and error message in individual Checkboxes.

Acceptance criteria

• Helper feature ([checkbox] Add helper support web-components#3749)
  • helper slot in Checkbox
  • Automatically set aria-describedby in <input> pointing to contents of helper slot
  • WC / React API for setting helper text: helper-text/ helperText in vaadin-checkbox / Checkbox
  • Flow API from HasHelper interface
  • Flow API for providing helpers for individual items in a CheckboxGroup (API TBD)
• Required state ([checkbox] Add required property web-components#938)
  • Flow / WC / React setRequired / required API for setting required state
  • Required indicator with required-indicator part name
  • error-message slot in Checkbox
  • Automatically set aria-describedby in <input> pointing to contents of error-message slot
  • error-message / errorMessage / setErrorMessage WC / React / Flow APIs
  • HasValidation support in Flow

UI design

Note: Helper and error slots could be placed in additional css grid rows below the label, with

• padding-left: var(--lumo-space-xs) on both to align horizontally with label
• padding-bottom: 0.4em; on both to provide appropriate spacing between them and below the last one (needed to have enough space between the helper/error of the preceding item and the label of the next item in a group)

General criteria

• APIs reviewed

• Design

• Performance

• UX/DX tests in Alpha

• Documentation: https://vaadin.com/docs/next/components/checkbox#required, https://vaadin.com/docs/next/components/checkbox#basic-features

• How to test?

• Limitations:

Security

• Security implications have been taken into account (elaborate or link to product security requirement specification if there are implications)