Installation
npx lovdacn@latest add radio-group(You can also use the shortened lvcn alias, e.g., npx lvcn@latest add radio-group)
This copies the component source into your project (typically components/ui/radio-group.tsx) and installs any required dependencies.
Registry dependencies: utils
Usage
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"
import { Label } from "@/components/ui/label"
import { Text } from "@/components/ui/text"
import { View } from "react-native"
export function Example() {
return (
<RadioGroup defaultValue="comfortable">
<View className="flex-row items-center gap-2">
<RadioGroupItem value="default" id="r1" />
<Label htmlFor="r1">
<Text>Default</Text>
</Label>
</View>
<View className="flex-row items-center gap-2">
<RadioGroupItem value="comfortable" id="r2" />
<Label htmlFor="r2">
<Text>Comfortable</Text>
</Label>
</View>
</RadioGroup>
)
}Styles
lvcn components are available across all style packs:
| Style | Notes |
|---|---|
default | Classic rounded system |
new-york | Compact, refined |
nova | Sharp corners (default in many setups) |
luma / lyra / maia / mira | Radius & font variants |
rhea / sera / vega | Pill, zero-radius, balanced |
Style is set at project init via lvcn.json (style + styleEngine).
Platform
These components target Expo / React Native with NativeWind or Uniwind. They use Platform.select where web and native need different behavior.