Structural slot for the add-tab button glyph
CngxTabAddIcon
Directivev0.1.0WCAG AA
projects/common/tabs/slots/tab-add-icon.directive.ts
Import#
import { CngxTabAddIcon } from '@cngx/common/tabs'
Description#
Structural slot for the add-tab button glyph. 3-stage cascade:
per-instance directive > CNGX_TABS_CONFIG.templates.addIcon >
CNGX_TABS_GLYPHS.addIcon. The button owns its aria-label; the
template paints only the glyph, so its context is void.
<cngx-tab-group addable (tabAdd)="add()">
<ng-template cngxTabAddIcon><cngx-icon name="plus" /></ng-template>
...
</cngx-tab-group>Metadata#
CngxTabAddIcon
The slot paints only the glyph inside the add-tab button. The button shell owns the accessible name, so the template stays decorative.
- Accessible name is library-owned. The add button carries
aria-labelfromi18n.addTab, so a glyph-only template is still announced. The slot context isvoid- it has no label to set. - Do not encode meaning in the glyph alone. The accessible name carries "add tab"; the glyph is a visual cue on top, and decorative icons should be
aria-hidden. - Keep the template decorative. The shell is already a
<button>; do not nest interactive elements or add SR-only text. Icon only.