Skip to content

Commit

Permalink
docs(material/chips): require communicating to AT how to edit a chip (#…
Browse files Browse the repository at this point in the history
…27336)

Update the accessibility section of chips component to adress editable
chips. Require developer to communicate to AT how to edit a chip using a
keyboard.

Relates to issue #27106.
  • Loading branch information
zarend authored Jul 6, 2023
1 parent daa6ca3 commit a320042
Showing 1 changed file with 4 additions and 2 deletions.
6 changes: 4 additions & 2 deletions src/material/chips/chips.md
Original file line number Diff line number Diff line change
Expand Up @@ -186,8 +186,10 @@ For both MatChipGrid and MatChipListbox, always apply an accessible label to the

Always apply MatChipRemove to a `<button>` element, never a `<mat-icon>` element.

When using `MatChipRemove`, you should always communicate removals for assistive technology. One way to accomplish this is by sending a message with `LiveAnnouncer`. Otherwise, removing a chip may only be communicated visually.

When using MatChipListbox, never nest other interactive controls inside of the `<mat-chip-option>` element. Nesting controls degrades the experience for assistive technology users.

By default, `MatChipListbox` displays a checkmark to identify selected items. While you can hide the checkmark indicator for single-selection via `hideSingleSelectionIndicator`, this makes the component less accessible by making it harder or impossible for users to visually identify selected items.

When using `MatChipRemove`, you should always communicate removals for assistive technology. One way to accomplish this is by sending a message with `LiveAnnouncer`. Otherwise, removing a chip may only be communicated visually.

When a chip is editable, provide instructions to assistive technology how to edit the chip using a keyboard. One way to accomplish this is adding an `aria-description` attribute with instructions to press enter to edit the chip.

0 comments on commit a320042

Please sign in to comment.