Component

Radio

Selects one option from a related set of choices.

Install

Run the CLI to copy the source into your project.

pnpm dlx @stalk-ui/cli add @stalk-ui/radio

Examples

Live previews render through the docs app's PandaCSS codegen.

Theme
<Radio.Root defaultValue="basic" name="plan">
  <Radio.Item value="basic" aria-label="Basic" />
  <Radio.Item value="pro" aria-label="Pro" />
  <Radio.Item value="team" aria-label="Team" />
</Radio.Root>
Theme
<Radio.Root name="plan-invalid">
  <Radio.Item invalid value="required" aria-label="Required choice" />
</Radio.Root>

Props

Public component props extracted from the source TypeScript types.

PropTypeRequiredDefaultDescription
`invalid``boolean`No-Marks the radio as invalid; sets \`aria-invalid\` and applies invalid styling.
`size``RadioSize`No--

Variants

Variant axes exposed by the underlying PandaCSS recipe or slot recipe.

VariantValues
`size``sm`, `md`, `lg`

Registry

Files this component contributes to your registry install.

  • Manifest: `/r/radio.json`
  • Recipe: `radio`
  • Files: `src/components/ui/radio.tsx`