Skip to content
← Inventory

RadioGroup

Container for a group of radio buttons. Manages single selection state.

Usage

import { RadioGroup, RadioGroupItem, RadioGroupItemProps } from "@desk/ui/components/radio-group";

Best practices

  • Use RadioGroup for one choice among a small closed set; for many searchable options use Select/Combobox, and for on/off use Switch/Checkbox.

  • Drive selection with value + onValueChange (controlled) or defaultValue (uncontrolled) — don't set both on the same group.

  • Prefer RadioGroupItem (radio + wired Label) over hand-pairing Radio and Label; it auto-generates the id/htmlFor link.

Props

PropTypeDefaultDescription
children(required)React.ReactNode

Label text for the radio option

sizeResponsiveSize"sm"

Radio size — a single token or a per-breakpoint object like { base: "sm", md: "lg" }.

Also exports

  • componentRadioGroup
  • typeRadioGroupItemProps

Composition

Builds on

Label, Radio