Skip to content

Radio Group

A group of options where users can select exactly one choice.

---
import { Label } from '@bejamas/ui/components/label';
import { RadioGroup, RadioGroupItem } from '@bejamas/ui/components/radio-group';
---
<RadioGroup>
<div class="flex items-center gap-2">
<RadioGroupItem name="plan" value="free" checked id="free" />
<Label for="free">Free</Label>
</div>
<div class="flex items-center gap-2">
<RadioGroupItem name="plan" value="pro" id="pro" />
<Label for="pro">Pro</Label>
</div>
</RadioGroup>
Terminal window
bunx bejamas add radio-group
---
import { RadioGroup, RadioGroupItem } from '@bejamas/ui/components/radio-group';
import { Label } from '@bejamas/ui/components/label';
---
<RadioGroup>
<div class="flex items-center gap-2">
<RadioGroupItem name="plan" value="free" id="free" checked />
<Label for="free">Free</Label>
</div>
</RadioGroup>
PropTypeDefault
classstring""
”aria-label”string
”aria-labelledby”string