Radio Button

São usados em listas com poucas opções e mutuamente exclusivas, permitindo que o usuário selecione apenas uma opção.

Boas práticas

As opções apresentadas devem estar sempre agrupadas e acompanhadas de uma label.
Sempre deve vir selecionada uma opção por padrão. Exceto quando uma opção padrão pode causar danos ao usuário ou implica em uma ação crítica/importante do sistema. Nesses casos pode-se apresentar a lista sem nenhuma opção padrão e adicionar uma opção de limpar a seleção.
Ordene a lista em ordem lógica, por exemplo: opção mais provável de ser selecionada primeiro/menos provável por último; opção mais simples para a mais complexa, etc.
Para listas com mais de 4 opções considere utilizar o componente Select.

Exemplos

WhiskeyCoconut waterWhatever

import { HFlow, Radio } from '@lemonade/ui'
import React from 'react'

function RadioExample() {
  return (
    <HFlow>
      <Radio name='default' label='Whiskey' value='whiskey' />
      <Radio name='default' label='Coconut water' value='coconut water' />
      <Radio name='disabled' label='Whatever' value='whatever' disabled />
    </HFlow>
  )
}

export default RadioExample