Import it from @grafloria/element.
TAB CONTAINERS — a container whose children are PAGES, one visible at a time, with a strip of tabs across its top. DevExpress ships this as its Tab Container; VS Code's editor area is a split of them.
This module owns the strip: its height, its geometry and its DOM. Who is active, where the pages sit and what a press means are the container's business (dashboard.ts), exactly as the caption band's press routing is the binder's.
tsinterface TabsOptions
Properties
| Name | Type | Default | Description |
|---|---|---|---|
inset? | number | Pixels between the frame and the pages — left, right, bottom, and below the strip (0.4.43). The cards of a page sit INSIDE the container's tinted frame, so two cards under one tab read as one panel; a border on the cell alone ran exactly where the cards' own borders were. Default 8; 0 puts the pages edge to edge, the look before 0.4.43. | |
position? | 'top' | Where the strip sits. Only 'top' today; 'bottom' | 'start' | 'end' follow. | |
align? | 'start' | 'center' | 'end' | Along the strip (default 'start', mirrored on RTL). | |
stretch? | boolean | Tabs share the strip's width equally. | |
height? | number | Strip height, px (default 30). | |
className? | string | Your class on the strip, for per-container theming. | |
hidden? | boolean | No strip at all (0.4.83) — DevExpress's tab container with ShowCaption="false". Nothing is reserved for it (the pages fill the frame, less inset) and nothing is on screen: no element, so no paint, no tab stop and nothing to press. Pages are switched from code — handle.activateTab(), getActiveTab() and onTabChange work as with a visible strip. |
Was this page helpful?