[Feature Request] Add label to Radio Group

[SalahAdDin]

Is your feature request related to a problem? Please describe.

Right now CheckboxGroup have label and Input has helper text and status, but RadioGroup does not have.

All of those properties are ultra required when we have to validate the value of this RadioGroup.

Why are they missing?

Describe the solution you'd like

This input would include label and helperText, status(optional) and helperTextColor.

Describe alternatives you've considered

Passing a Text for both helper text and label.

You can check my solution here: https://codesandbox.io/s/thirsty-gwen-tlfiix

<Col>
  <Text
    color={error ? 'error' : 'default'}
    as="label"
    css={{ fontSize: 14 }}
  >
    {label}
  </Text>
  <Radio.Group
    // eslint-disable-next-line react/jsx-props-no-spreading
    {...fieldProps}
    textColor={error ? 'error' : 'default'}
    color={error ? 'error' : 'default'}
    // eslint-disable-next-line react/jsx-props-no-spreading
    {...field}
  >
    {options.map((option) => (
      <Radio
        key={name + option.value}
        size="xs"
        value={option.value}
        css={{ mt: 10 }}
      >
        {option.label}
      </Radio>
    ))}
  </Radio.Group>
  {error && (
    <Text
      as="p"
      color={error ? 'error' : 'default'}
      css={{
        ml: 10,
        fontSize: 12,
      }}
      role="alert"
    >
      {error.message}
    </Text>
  )}
</Col>

Screenshots or Videos

Color is required but it does not show any message to help the user to understand why the form is not being submitted.