Pular para o conteúdo principal

Content Switcher

O Content Switch manipula o conteúdo apresentado na tela alternando entre as opções apresentadas através de botões, e por default sempre tem uma opção selecionada. Utilize o content switch em telas onde as opções são mutuamente exclusivas, permitindo que o usuário selecione apenas uma opção.

Boas práticas

  • Considere utilizar as boas práticas de Botões para as labels.
  • Sempre há uma opção selecionada por padrão.
import { Button, ButtonGroup } from '@lemonade/ui'
import React from 'react'

function ContentSwitchDemo() {
  return (
    <ButtonGroup>
      <Button size='small' kind='primary'>
        First content
      </Button>
      <Button size='small'>Second content</Button>
      <Button size='small' disabled>
        Third content disabled
      </Button>
    </ButtonGroup>
  )
}

export default ContentSwitchDemo