TabComponent

Tab layout component

Installation

import { TabComponent } from 'uxp/components';

Signature

const TabComponent: React.FunctionComponent<TabComponentProps>

Examples

<TabComponent
  tabs={[
     {id: 'general' , label:'General', content: <div> General Tab </div>},
     {id: 'advanced' , label:'Advanced', content: <div> Advanced Tab </div>},
  ]}
  selected={selectedTab}
  onChangeTab={setSelectedTab}
/>

Properties

Name	Type	Mandatory	Default Value	Example Value
tabs	Tab[]	Yes	-	-
selected	string	Yes	-	-
onChangeTab	(tab: string) => void	Yes	-	-
direction	'vertical' | 'horizontal'	No	-	-
position	'top' | 'bottom' | 'left' | 'right'	No	-	-
styles	TabComponentStyles	No	-	-
className	string	No	-	-

Related Types

• TabComponentProps

• Tab

• TabComponentStyles