What component has

Keyboard support

Keyboard support

Key	Function
Tab	Moves focus to the next focusable element. When the last element is reached, moves focus to the next focusable element outside of the popover.
	Moves focus to the previous focusable element. When the first element is reached, moves focus to the previous focusable element outside of the popover.
Esc	Closes the popover.

Attributes

The following table describes attributes that component already has.

Attributes

Component	Attribute	Usage
FeaturePopover.Popper	role="dialog"	Identifies the element as a dialog, indicating that its content is grouped and separated from the rest of the page content.
	tabindex="0", autoFocus	Automatically focuses the entire popover when it opens, helping the user to locate it on the page, especially when several popovers open in sequence.

Considerations for developers

Attributes

The following table will help you to keep in mind the necessary attributes to make our components fully accessible in your interfaces.

Attributes

Component	Attribute	Usage
FeaturePopover	disablePortal	Disables rendering in a React portal. Add this property so that the popover follows the highlighted interface element in the focus and reading order. Refer to our example.
FeaturePopover.Popper	aria-label or aria-labelledby	Defines an accessible name for the popover. Refer to our example.

Other recommendations

For more accessibility recommendations, refer to the common Accessibility guide.