Radio selection component in row layout.
160 GB SSD disk
512 GB SSD disk
1024 GB SSD disk
1import React from 'react'
2import RadioTabs from '@tempoplatform/tpds/components/radiotabs'
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<RadioTabs
22 items={items}
23 outlineStyle={true}
24 selectedIndex={selectedIndex}
25 handleIndexSelection={setSelectedIndex}
26/>
Prop Name
Type
Default
Required
Description
items
JSX
null
yes
The items to be displayed
selectedIndex
Int
null
yes
The index to show as selected
callBack
Function
null
yes
The callout function used to select the clicked index
stackAtBreakpoint
String
""
no
Option breakpoint at whit to stack the items. Valid values are "sm", "md", "lg", "xl", "2xl"