Skip to content
← Inventory

Radio

Individual radio button. Must be used within a RadioGroup.

Usage

import { Radio, RadioProps, radioVariants } from "@desk/ui/components/radio";

Best practices

  • A Radio only works inside a RadioGroup (it renders a Radix RadioGroup.Item) — the group owns selection; a standalone Radio won't toggle.

  • Give every Radio a unique value and pair it with a Label — or use RadioGroupItem, which bundles the radio and its wired label.

  • For selectable-card options rather than plain dots, use RadioCardGroup.

Props

PropTypeDefaultDescription
sizeResponsiveSize"sm"

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

Also exports

  • typeRadioProps
  • constradioVariants

Composition