RadioGroup

  • Used for selecting one value from several options.

Installs

import {RadioGroup} from '@xsolla/uikit'

Examples

Vertical
Horizontal

Usage

<RadioGroup name="radio"
  input={{value: 'basic', onChange: () => void 0}}
  options={[
    {label: 'Basic', radioValue: 1},
    {label: 'With tooltip', tooltip: 'Tooltip message', radioValue: 2},
    {label: 'Disabled', disabled: true, radioValue: 3}
  ]}/>

Option fields

{
  label: string,
  radioValue: any,
  description?: string,
  tooltip?: string,
  disabled?: bool
}

With redux-form

<Field
  component={RadioGroup}
  name="redux-radio"
  options={[
    {label: 'Basic', radioValue: 1},
    {label: 'With tooltip', tooltip: 'Tooltip message', radioValue: 2},
    {label: 'Disabled', disabled: true, radioValue: 3}
  ]}/>

API

PropertyDescriptionTypeDefault
inputconfig for redux-form or basic radioobject{}
directionalignment of radio group itemscolumn, rowcolumn
disabledwhether radio group is disabledboolfalse
optionsitems arrayarray