Ravox KitBásicos
Badge
Badge neutro com o pontinho na cor do mosaico, ou cheio (sólido) para o estado que precisa saltar.
publicado
Ajustes
Ligar e desligar
Exemplos
Status de pedido
Aguardando pagamentoPagoEnviadoEstornado
Cheia: o estado que salta
ao vivovence hojenovobeta
Neutra
rascunhoem revisãov2.4.1
Instalação
O shadcn cria components/ui/etiqueta.tsx no seu projeto e instala o tema junto. O arquivo é seu: edite à vontade.
npx shadcn@latest add https://ui.ravoxlabs.com/r/badge.jsonOpções
| Opção | Tipo | Padrão | O que faz |
|---|---|---|---|
| cor | "rosa" | "amarelo" | "lima" | "azul" | — | A cor do pontinho (ou do fundo, com cheia). A etiqueta continua neutra. |
| ponto | boolean | true com cor | Mostra o pontinho antes do texto. |
| cheia | boolean | false | Fundo sólido na cor, sem pontinho. O texto fica escuro ou branco conforme a cor e o tema (4,5:1 ou mais). |
| ...props | ComponentProps<"span"> | — | Tudo o que um <span> aceita. |