shoelace/docs/components/tab.md

30 wiersze
665 B
Markdown

# Tab
[component-header:sl-tab]
Tabs are used inside [tab groups](/components/tab-group) to represent and activate [tab panels](/components/tab-panel).
```html preview
<sl-tab>Tab</sl-tab>
<sl-tab active>Active</sl-tab>
<sl-tab closable>Closable</sl-tab>
<sl-tab disabled>Disabled</sl-tab>
```
```jsx react
import { SlTab } from '@shoelace-style/shoelace/dist/react';
const App = () => (
<>
<SlTab>Tab</SlTab>
<SlTab active>Active</SlTab>
<SlTab closable>Closable</SlTab>
<SlTab disabled>Disabled</SlTab>
</>
);
```
?> Additional demonstrations can be found in the [tab group examples](/components/tab-group).
[component-metadata:sl-tab]