Keyboard interactions
When an action button does not feature a hold icon:
Key
Interaction
Space or Enter
Executes the action. The focus remains on the button except if the button opens or closes the current container. In this case, the focus moves to the target or back to the caller.
Tab
Moves focus into the action button component and places focus on the selected action item.
Shift + Tab
Returns focus to the previous action within the action button component.
When an action button features a hold icon:
Key
Interaction
Enter
Executes the action. The focus remains on the button except if the button opens or closes the current container. In this case, the focus moves to the target or back to the caller.
Space
Opens the popover menu.
Alt + Down Arrow
Opens the popover menu.
Tab
Moves focus into the action button component and places focus on the selected action item.
Shift + Tab
Returns focus to the previous action within the action button component.
Cursor guidelines
Cursor
Usage
Pointer
Use the pointer cursor for all interactive components in every state.
WCAG 2.2 compliance
Any criterion not mention in the below table are not applicable to this component or are resolved with underlying requirements, engineering, and styles of the entire system.
1 . Perceivable
Requirement
Criterion
Level
Compliance
Non-text content
A
Non‑text elements—such as icons used in action buttons—must provide a text alternative that communicates the control’s purpose. All controls, especially icon‑only controls, need an accessible name (for example, via a title, aria‑label, or associated text) so screen readers can announce their function.
Info and relationships, Identify purpose
A, AAA
Action buttons should be understandable by assistive technologies like screen readers. This means the proper semantic HTML or ARIA role should be utilized.
Text contrast
AA
Large text has a contrast ratio of at least 3:1, and small text has a contrast ratio of at least 4.5:1. Incidental text such as disabled, hidden, or decorative text has no contrast requirement.
Non-text contrast
AA
The visual presentation of icons and various states have a contrast ratio of at least 3:1.
Text spacing
AA
Line height of text is at least 1.5x the font size if text is wrapped inside an action button.
2 . Operable
Requirement
Criterion
Level
Compliance
Keyboard
A, AAA
All functionality of the component is operable through a keyboard without specific timing for keystrokes.
Seizures and physical reactions
A, AAA, AAA
There is no flashing content or unnecessary motion or animation in this component.
Focus order
A
Navigation sequences receive focus in an order that preserves meaning and operability.