react-ui-org/react-ui

create inputgroup component

mbohal opened this issue · 0 comments

We need a new layout component InputGroup.

It will accept as props:

  • children: an array of elements
    • one of (defined in docs only, we can not validate their type):
      • Button
      • SelectField
      • TextField
    • their label must be hidden, but present for accessibility reasons
    • some of thier props will be overloaded
      • size according to the size prop of the InputGroup element
      • for Button the prop priority will either be set to filled as there is no one to pay for the other options or it must work out of the box with no extra work
      • for SelectField and TextField the prop variant will either be set to outline as there is no one to pay for the other options or it must work out of the box with no extra work
  • validationTexts: An array of validation messages. These are not semantically tied to the children elements, the connection should be expressed in textual form in the actual message. The individual children elements must not show any validationText, they only show their respective validationState.
  • size: Defines the size of the children elements. If the element specifies a size it will be overloaded by the InputGroup prop value.
  • layout: Indicates if it is horizontal or vertical

Design:

Inputgroup.pdf