Carregando…
Carregando…
Carregando…Radio button with RadioGroup helper for single-select option sets.
$ npx kikitocn add radio@/lib/utilsimport { Radio } from "@/components/ui/cn/radio/Radio";
export function RadioExample() {
return (
<div className="flex flex-col gap-2">
<Radio name="plano" value="free" label="Grátis" defaultChecked />
<Radio name="plano" value="pro" label="Pro — R$ 29/mês" />
<Radio name="plano" value="team" label="Team — R$ 99/mês" />
</div>
);
}| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
value | string | '' | Valor desta opção de radio |
checked | boolean | undefined | Estado marcado (controlled) |
onChange | (value: string) => void | undefined | Callback quando selecionado |
label | string | undefined | Texto ao lado do radio |
helperText | string | undefined | Texto de apoio abaixo do label |
size | 'sm' | 'md' | 'lg' | 'md' | Tamanho do radio |
disabled | boolean | false | Desabilita o radio |
name | string | undefined | Nome do grupo (atributo HTML) |
Vertical (default)
Horizontal
sm · md · lg