The library is still in early development. Breaking changes and bugs may occur without prior notice. Thanks for your interest in using the library!

v0.2.49Beta

Search

Radio Group

Source

A group of radio buttons for selecting a single option.

Usage

Import the RadioGroup and RadioGroupItem components from @bun-ui/react and use them in your project:

import { RadioGroup, RadioGroupItem } from "@bun-ui/react"
<RadioGroup>
  <RadioGroupItem value="option1" label="Option 1" />
  <RadioGroupItem value="option2" label="Option 2" />
  <RadioGroupItem value="option3" label="Option 3" />
</RadioGroup>

Examples

Controlled

Use the value and onValueChange props to control the selected value programmatically.

Disabled

Customization

The RadioGroup and RadioGroupItem components can be customized using the className prop or by extending their styles with your design system.

Props

RadioGroupItem

PropTypeDefaultDescription
color
"primary" | "secondary" | "neutral""primary"

Color for the RadioGroupItem.

disabled
booleanfalse

If true, the component is disabled.

label
ReactNode-

Label for the RadioGroupItem.

labelClassName
string-

Additional CSS classes to apply to the label element. Use this to customize the styling of the label independently from the RadioGroupItem.