Selection and input

RadioGroup

One choice out of a few, all visible at once.

iOSSwiftUI rows with a checkmarkAndroidCompose RadioButton rowsRenders in a Screen or an Island

iOSSwiftUI rows with a checkmark

AndroidCompose RadioButton rows

Import

import {RadioGroup} from '@hzblj/kara-ui'

Props

A single choice from a list: rows with a checkmark on the selected one on iOS, Material radio buttons on Android. A native atom — it renders inside <Screen> or <Island>.

Prop	Type	Description
options*	RadioOption[]	The choices, top to bottom.
value*	string	The selected option's `value`. Update it from `onValueChange`.
onValueChange	(value: string) => void	The user pressed an option; it passes that option's `value`.

options*

RadioOption[]

The choices, top to bottom.

value*

string

The selected option's value. Update it from onValueChange.

onValueChange

(value: string) => void

The user pressed an option; it passes that option's value.

RadioOption

One choice of a RadioGroup.

Prop	Type	Description
label*	string	The option's text.
value*	string	Identifies the option to `value` and `onValueChange`, and keys its row — keep it unique.

label*

string

The option's text.

value*

string

Identifies the option to value and onValueChange, and keys its row — keep it unique.

Platform notes

Exactly one option is selected at all times. For an independent on/off, use Switch or Checkbox.