Radio Group

Import/Installation

import { Label, RadioGroup, RadioGroupItem } from "@lottiefiles/creator-plugins-ui";

Preview

Usage

<RadioGroup value={value} onValueChange={setValue}>
  <div className="flex items-center gap-2">
    <RadioGroupItem id="quality-low" value="low" />
    <Label htmlFor="quality-low" variant="inline">
      Low
    </Label>
  </div>
  <div className="flex items-center gap-2">
    <RadioGroupItem id="quality-medium" value="medium" />
    <Label htmlFor="quality-medium" variant="inline">
      Medium
    </Label>
  </div>
  <div className="flex items-center gap-2">
    <RadioGroupItem id="quality-high" value="high" />
    <Label htmlFor="quality-high" variant="inline">
      High
    </Label>
  </div>
</RadioGroup>

Props

RadioGroup

Prop	Type	Default	Required	Description
orientation	"vertical" \| "horizontal"	"vertical"	No	Orientation of the radio group.
onValueChange	(value: string) => void	—	No	Callback fired when the value changes.

RadioGroupItem

Prop	Type	Default	Required	Description
size	"xs" \| "sm" \| "default"	"default"	No	Size of the radio button.

Built on Base UI Radio. See their docs for primitive-level details.