tab

v0.88.2

v0.86.0

v0.85.0

v0.84.0

STATUS

Passing

DOWNLOADS

3,134

LICENSE

MIT

VISIBILITY

Public

PUBLISHED

3 years ago

SIZE

78 KB

Called on tab change.

1 contributor

Install tab as a package?

Copied

npm i @bit/semantic-org.semantic-ui-react.tab

Set Bit as a scoped registryLearn more

npm config set '@bit:registry' https://node.bit.cloud

Component Example

React

Vue

Angular

React Native

Add dependency...

Just

import

any of the 1 million components

and packages in Bit or NPM to the example.

import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';

modifieddraft

Called on tab change.

Array of objects describing each Menu.Item and Tab.Pane: { menuItem: 'Home’, render: () => <Tab.Pane>Welcome!</Tab.Pane>, } or { menuItem: 'Home’, pane: 'Welcome’, }

Tab ()

A Tab is a hidden section of content activated by a Menu.

TabPane ()

A tab pane holds the content of a tab.

Properties

Name	Type	Default value	Description
as	`elementType`		An element type to render as (string or function).
defaultActiveIndex	`number \| string`		The initial activeIndex.
activeIndex	`number \| string`		Index of the currently active tab.
menu	`object`	`{ attached: true, tabular: true }`	Shorthand props for the Menu. tabular, if true, will derive final value from `menuPosition`, otherwise set ‘left’ or ‘right’ explicitly.
menuPosition	`'left' \| 'right'`		Align vertical menu
grid	`object`	`{ paneWidth: 12, tabWidth: 4 }`	Shorthand props for the Grid.
onTabChange	`function`		React’s original SyntheticEvent.
panes	`{"menuItem":"custom","pane":"custom","render":"function"}[]`		Array of objects describing each Menu.Item and Tab.Pane: { menuItem: 'Home’, render: () => <Tab.Pane /> } or { menuItem: 'Home’, pane: ‘Welcome’ }
renderActiveOnly	`bool`	`true`	A Tab can render only active pane.
as	`elementType`	`Segment`	An element type to render as (string or function).
active	`bool`	`true`	A tab pane can be active.
children	`node`		Primary content.
className	`string`		Additional classes.
content	`custom`		Shorthand for primary content.
loading	`bool`		A Tab.Pane can display a loading indicator.