An accessible tab group with full keyboard navigation. It demonstrates managing selection state internally while keeping it read-only for outside consumers.
Configure your application settings here.
Manage your user profile information.
Update your security preferences and passwords.
Loading...
module-tabgroup
| Name | Type | Default | Description |
|---|---|---|---|
selected | string (readonly) | '' | Id of the selected tab panel (aria-controls of active tab) |
| Selector | Type | Required | Description |
|---|---|---|---|
all('button[role="tab"]') | Memo<HTMLButtonElement[]> | required | Tab buttons with unique aria-controls references |
all('[role="tabpanel"]') | Memo<HTMLElement[]> | required | Tab panels with unique ids controlled by selected tab |