shoelace/docs/pages/components/tab.md

620 B

meta layout
title description
Tab Tabs are used inside tab groups to represent and activate tab panels.
component
<sl-tab>Tab</sl-tab>
<sl-tab active>Active</sl-tab>
<sl-tab closable>Closable</sl-tab>
<sl-tab disabled>Disabled</sl-tab>
import SlTab from '@shoelace-style/shoelace/dist/react/tab';

const App = () => (
  <>
    <SlTab>Tab</SlTab>
    <SlTab active>Active</SlTab>
    <SlTab closable>Closable</SlTab>
    <SlTab disabled>Disabled</SlTab>
  </>
);

:::tip Additional demonstrations can be found in the tab group examples. :::