RadioGroup

Radio selection component in stacked pills style.

Startup

160 GB SSD disk

Business

512 GB SSD disk

Enterprise

1024 GB SSD disk


1import React from 'react'
2import RadioGroup from '@tempoplatform/tpds/components/radiogroup'
3
4const items = [
5  {
6    title: 'Startup',
7    description: '160 GB SSD disk',
8  },
9  {
10    title: 'Business',
11    description: '512 GB SSD disk',
12  },
13  {
14    title: 'Enterprise',
15    description: '1024 GB SSD disk',
16  },
17]
18
19const [selectedIndex, setSelectedIndex] = React.useState(0)
20
21<RadioGroup
22  options={items}
23  selectedIndex={selectedIndex}
24  handleIndexSelection={index => setSelectedIndex(index)}
25/>


Prop Name

Type

Default

Required

Description

options

Array

null

yes

An array of items to select from

selectedIndex

Int

null

yes

The index to show as selected

handleIndexSelection

Function

null

yes

The handler function used to select the clicked index

lightOnly

Boolean

false

no

Wether to force the component to render in light mode