Radio Group — Componentes

🚀 saastro/ui (Astro)

Default

Comfortable

Compact

⚛️ shadcn/ui (React)

Installation

npx saastro add radio-group

Usage

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

<RadioGroup name="example" defaultValue="option-one">
  <div class="flex items-center space-x-2">
    <RadioGroupItem value="option-one" id="option-one" />
    <label for="option-one">Option One</label>
  </div>
  <div class="flex items-center space-x-2">
    <RadioGroupItem value="option-two" id="option-two" />
    <label for="option-two">Option Two</label>
  </div>
</RadioGroup>

Props

RadioGroup

Prop	Type	Default	Description
name	`string`	-	Name attribute for the radio inputs
defaultValue	`string`	-	Initially selected value
orientation	`"vertical" \| "horizontal"`	`"vertical"`	Layout direction

RadioGroupItem

Prop	Type	Default	Description
value	`string`	Required	Value for this option
id	`string`	-	ID for label association
disabled	`boolean`	`false`	Disable the option