Skip to main content

TerminologyOverlay

Use the TerminologyOverlay component to define or explain unusual or technical terms in the UI.

OverviewPropertiesUsageAccessibility

New

Note

See Accessibility in Design Foundations for explanations of key concepts and best practices.

Keyboard accessibility and focus​

TerminologyOverlay handles focus management out of the box. When the overlay opens, focus moves into the revealed content; when it closes, focus returns to the trigger.

  • Do ensure the revealed content has a meaningful accessible name: the dialog or panel title, for example.
  • Don't override the component's built-in focus handling. Focus must move into the revealed content when the overlay opens, and return to the trigger on close, so screen readers can announce the state change correctly.

Accessible names and roles​

  • Do verify the trigger term matches its accessible name.

State announcements​

TerminologyOverlay handles state announcements out of the box: aria-expanded="true" when open; aria-expanded="false" when closed.

  • Do ensure that the revealed content follows in a logical tab order so users can navigate into it after the state is announced.
Still have questions?
Find answers in the Dynatrace Community