Skip to content
This repository was archived by the owner on Mar 4, 2020. It is now read-only.

feat(Dropdown): Single selection - #584

Merged
Silviu Alexandru Avram (silviuaavram) merged 65 commits into
masterfrom
feat/selection-dropdown
Jan 8, 2019
Merged

Silviu Alexandru Avram (silviuaavram) merged 65 commits into
masterfrom
feat/selection-dropdown

Conversation

@silviuaavram

@silviuaavram Silviu Alexandru Avram (silviuaavram) commented Dec 10, 2018 •

Copy link
Copy Markdown
Collaborator

Single Selection Dropdown. Created with a Button instead if an Input.
Behaviours:

  1. Button:
  • on click, enter, space, should open the list and move focus to it. If item is already selected, that should be the one highlighted after opening (last part not working atm, added as improvement request).
  • on up/down, should open the list and move focus to it. If no item is already selected, should focus on first or last item. If item is already selected, focus should be on the selected item position +/- 1. (last part not working atm, added as improvement request).
  1. List:
  • up/down should move focus through the options.
  • home/end should move focus to first/last option (not working atm, improvement request).
  • enter should select option and move the focus to the button.
  • tab and shift tab should select option and move focus to next/previous element (button).
  • click should select option and move focus to the button.
  • selecting an option should trigger aria-live with ' has been selected.'
  • letter key should focus on items starting with that key (not working atm, improvement request).

Navigation with Screen Readers should work as well, with and without virtual cursor.
Button should be made shorthand, in a future task.

Added some improvement comments in #560 while working on this.

Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/Dropdown.tsx Outdated

@mnajdova Marija Najdova (mnajdova) left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some minor comments/opinion. The changes are going in the right direction :)

Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/DropdownSearchInput.tsx Outdated
@miroslavstastny Miroslav Stastny (miroslavstastny) changed the title Single selection Dropdown feat(Dropdown): Single selection Dec 13, 2018
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/themes/teams/components/Dropdown/dropdownStyles.ts Outdated
Comment thread src/themes/teams/components/Dropdown/dropdownStyles.ts Outdated
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
@hughreeling Hugh Eland (hughreeling) added the vsts Paired with ticket in vsts label Jan 2, 2019
Comment thread src/components/Dropdown/Dropdown.tsx Outdated
Comment thread src/components/Dropdown/Dropdown.tsx
Comment thread CHANGELOG.md Outdated

@mnajdova Marija Najdova (mnajdova) left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 all issues are tracked, so we are save to merge this one!

Comment thread docs/src/examples/components/Dropdown/Types/index.tsx Outdated
@layershifter
Oleksandr Fediashov (layershifter) deleted the feat/selection-dropdown branch January 8, 2019 15:26
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

🚀 ready for review vsts Paired with ticket in vsts

Projects

None yet

Development

Successfully merging this pull request may close these issues.

8 participants