TabGroup
TabGroup displays a tab-based navigation that allows users to switch between and view different parts of the application's content without having to navigate to another page. It consists of individual tabs Tab and Panels, which when clicked display the contents of the tab.
The TabGroup element supports multiple appearance variants using the variant attribute.
Basic usage
The Card element has been used only for the purpose of this demonstration.
Variants of tab placement
By adding the variant property it is possible to change the location of the tabs. Supported values are start, end and bottom.
Start
End
Bottom
Attributes and Properties
variant
| Description | Umiestnenie záložiek: top, bottom, start alebo end. |
| Attribute | variant |
| Type | "top" ｜ "bottom" ｜ "start" ｜ "end" |
| Default | 'top' |
Events
No events available for this component.
Methods
No public methods available for this component.
CSS Shadow Parts
| Name | Description |
|---|---|
native | Odkazuje na hlavný obaľovací div element. |
panels | Odkazuje na kontajner obsahujúci všetky tab-panely v skupine. |
tabs | Odkazuje na kontajner obsahujúci všetky taby v skupine. |
CSS Custom Properties
| Name | Description |
|---|---|
--wje-tab-top | Vzdialenosť tabov od horného okraja. |
--wje-tab-start | Vzdialenosť tabov od ľavého okraja. |
--wje-tab-end | Vzdialenosť tabov od pravého okraja. |
--wje-tab-bottom | Vzdialenosť tabov od dolného okraja. |
Slots
| Name | Description |
|---|---|
| `` | Predvolený slot pre obsah skupiny tabov. |
nav | Slot pre navigačnú lištu záložiek. |