Radio Group

Semantic radio option selection

import { RadioGroup } from "@plexui/ui/components/RadioGroup";

Examples

Overview

Notification frequency

Direction

direction

Orientation

orientation

Group disabled

Item disabled

With description

With Field

Choose how you want to receive notifications.

With Field error

Select a plan to continue.

Choice card

orientation

Card selection



Grouped sections

Control who can see project resources.
How often you receive summary emails.

Reference

RadioGroup (root)

PropTypeDefaultDescription
valuestringControlled selected value
defaultValuestringInitial selected value (uncontrolled)
onChange(value: string) => voidCalled when selected option changes
direction"col" | "row""col"Item flow direction
disabledbooleanfalseDisable the whole group
aria-labelstringAccessible group label

RadioGroup.Item

PropTypeDefaultDescription
valuestringItem value
disabledbooleanfalseDisable this item only
blockbooleanfalseStretch item to fill available width
orientation"left" | "right""left"Position of the radio indicator relative to the label