Tab strip
canonControlled tablist that scrolls and fades when the tabs do not fit; no overflow menu, no disabled tab.
Used in 10 files · 7 areas · 10× — components/record, components/setkani, pages/ClenTymuPage, pages/MeetingDetailPage, pages/ProjectDetailPage, pages/TrashPage …
@acrm/ui <TabStrip>.acrm-tabs .acrm-tab .acrm-tabswrap .acrm-tabsedge +1SourceStoryLegacy card tabs.htmlImport
import { TabStrip } from '@acrm/ui'Props
TabStrip packages/ui/src/components/TabStrip.tsx
| Name | Type | Default | Description |
|---|---|---|---|
tabs * | TabDef[] | — | — |
value * | string | — | — |
onChange * | (key: string) => void | — | — |
panelId | string | — | id prvku, ve kterém se kreslí obsah aktivního tabu (volitelné). Jen s ním dostane aktivní tab aria-controls a každý tab id <panelId>-tab-<key> — panel si pak nastaví role="tabpanel" a aria-labelledby na id aktivního tabu. Předává ho JEN konzument, který panel drží ve stejné komponentě. aria-controls nese výhradně AKTIVNÍ tab: appka kreslí jen panel aktivního tabu, takže odkaz z neaktivního by mířil na id, které v DOM není. |
CSS classes
.acrm-tabs.acrm-tab.acrm-tabswrap.acrm-tabsedge.acrm-tabsbtn