tab

v4.9.10

v4.5.2

v3.9.2

STATUS

Passing

DOWNLOADS

30,335

LICENSE

MIT

VISIBILITY

Public

PUBLISHED

4 years ago

SIZE

32 KB

Tabs make it easy to explore and switch between different views. Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.

2 contributors

Install tab as a package?

Copied

npm i @bit/mui-org.material-ui.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';

tab ()

Demos:

Tabs

API:

Tab API
inherits ButtonBase API

Properties

Name	Type	Description
children	`custom`	This prop isn’t supported. Use the `component` prop if you need to change the children structure.
classes (required)	`object`	Override or extend the styles applied to the component. See CSS API below for more details.
className	`string`
disabled	`bool`	If `true`, the tab will be disabled.
disableFocusRipple	`bool`	If `true`, the keyboard focus ripple will be disabled. `disableRipple` must also be true.
disableRipple	`bool`	If `true`, the ripple effect will be disabled.
fullWidth	`bool`
icon	`node`	The icon element.
indicator	`node`	For server-side rendering consideration, we let the selected tab render the indicator.
label	`node`	The label element.
onChange	`function`
onClick	`function`
selected	`bool`
textColor	`'secondary' \| 'primary' \| 'inherit'`
value	`any`	You can provide your own value. Otherwise, we fallback to the child position index.
wrapped	`bool`	Tab labels appear in a single row. They can use a second line if needed.