Components

A group of radio buttons for single-option selection.

Installation

npm install @mijn-ui/react-radio-group

Usage

import { Label } from "@mijn-ui/react-label"
import { RadioGroup, RadioGroupItem } from "@mijn-ui/react-radio-group"
<RadioGroup defaultValue="option-one">
  <div className="flex items-center space-x-2">
    <RadioGroupItem value="option-one" id="option-one" />
    <Label htmlFor="option-one">Option One</Label>
  </div>
  <div className="flex items-center space-x-2">
    <RadioGroupItem value="option-two" id="option-two" />
    <Label htmlFor="option-two">Option Two</Label>
  </div>
</RadioGroup>

API Reference

Built on Radix UI — all underlying primitive props are forwarded in addition to the props below.

PropTypeDefaultDescription
unstyledbooleanfalseOpt out of the default styles to fully customize the component.
classNamesobjectOverride classes per slot (see Style Slots below).
classNamestringAdditional classes for the root element.

RadioGroup Style Slots

Slot NameTargeted ComponentPurpose
baseRadioGroupStyles the root radio group component.
itemRadioGroupItemStyles individual radio items.
indicatorRadioGroupItemStyles the indicator for selected radio items.
iconRadioGroupItemStyles the icon within the radio item.