Document alternative patterns for "hover" inline dialog

Description

The responds-to="hover" inline dialog variant is deprecated, as the interaction on its own is impossible to make accessible. Alternative interactions or markup are required to make an accessible UI.

We need to document the known use-cases and alternatives to the hover pattern in AUI's "patterns" docs section. We also need to link to this page from the inline dialog docs, and mention it in AUI's deprecation notice that appears in developer tools.

The known cases so far are:

I want to...

Rough idea...

Examples?

Reveal more information when the user asks for it.

Use the standard "on click" inline dialog. Provide an explicit button element to click.

https://community.developer.atlassian.com/t/opening-by-hovering-over-the-trigger-for-inline-dialog-seems-to-be-deprecated-any-idea-why-and-what-to-use-instead/41445/3

Provide additional, non-interactive details about what a button will do when the user interacts with it.

Use the tooltip pattern.

 

Provide interactive details about another interactive element.

This is an anti-pattern. It is ambiguous what should happen if the user interacts with the control; should they get access to the interactive details, or should the basic interaction occur?

Paginated Bamboo build result widget in plan header

Discuss use-cases before picking up this story. Estimate based on effort required to:

  • Demonstrate each pattern.

  • Explain how each pattern is accessible to non-mouse and non-sighted users.

Environment

None

Activity

Show:
Chris "Daz" Darroch
September 14, 2020, 9:00 AM

Additional use-cases have been listed here:

Assignee

Michal Samujlo

Reporter

Chris "Daz" Darroch

Labels

None

Changelog entry text

None

Needs Doc

None

Components

Affects versions

Priority

Minor
Configure