Tab
<cs-tab>
Tabs label and activate an individual panel inside a tab group.
This component must be used as a child of <cs-tab-group>. Please see the Tab Group docs to see examples of this component in action.
API
Importing
If you're using the autoloader or a hosted project, components load on demand — no manual import needed. To cherry-pick this component, use one of the following snippets.
import '@cruglobal/cornerstone-components/components/tab/tab.js';
import './cornerstone/components/tab/tab.js';
import CsTab from '@cruglobal/cornerstone-components/react/tab/index.js';
Slots
Learn more about using slots.
| Name | Description |
|---|---|
| (default) | The tab's label. |
Attributes & Properties
Learn more about attributes and properties.
| Property | Attribute | Description | Type | Default | Reflects |
|---|---|---|---|---|---|
disabled | disabled | Disables the tab and prevents selection. | boolean | false | Yes |
panel | panel | The name of the tab panel this tab is associated with. The panel must be located in the same tab group. | string | '' | Yes |
CSS Parts
Learn more about CSS parts.
| Name | Description | CSS selector |
|---|---|---|
tab | The component's outer wrapper. | ::part(tab) |