openui / openui/open-ui

[split-button] pre-spec research

Open
#408 8 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

needs-research needs-triage
Dominant language
MDX
Stars
4.5k
Forks
226
Avg merge
2d 22h
Merged PRs (30d)
4

Description

split-Button - spec

A split button is a dual-function menu button that offers a default action as well as the possibility of choosing a different action by selecting from a set of alternatives.

Nielsen Norman Group

Moreover, split button can be specified as 2 different behaviors:

  1. as defined by NNG 👆 set of alternatives set the main action
  2. set of alternatives are eagerly invoked actions as presented here
Implementation details:

the button UI is composed of 2 buttons:

  1. main action
  2. popup trigger chevron like suffixed button

opensource adobe com_spectrum-web-components_components_split-button

  • should they both be included in the tabbing navigation order or align to roving pattern?

  • Would focus alone on chevron suffixed button open the popup menu?

  • Keep state of where the focus was if the menu closes and opens back?

Some of the points raised and details will really require 1 finite defined behavior mentioned above

argyleink/gui-challenges#63 already touches the topic

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the split-button definition and the linked Nielsen Norman Group, web.dev, and argyleink/gui-challenges#63 references. Resolve which of the two behaviors is intended, then define tab order, chevron focus behavior, and focus restoration; done means a finite interaction specification answers these questions.

Written by the indexing model from the issue text.

Assessment

Domain
accessibility, design, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.