Skip to content

feat: improve keyboard handling and events #513

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Jan 29, 2021

Conversation

arthurdenner
Copy link
Owner

Acessibility and events fixes and features.
What kind of change does this PR introduce?

What is the current behavior?

  1. When navigating with the keyboard, if a button is selected, its action is performed but focus is lost;
  2. We can't navigate with arrow keys between the dates;
  3. onBlur is fired in weird situations;
  4. onFocus is not supported;
  5. Clear button is not accessible by keyboard.

What is the new behavior?

  1. After the rerender caused by a button's action, if the button is still available on the screen, it's gets focused again;
  2. It's possible to navigate with arrow keys between the dates;
  3. onBlur is only fired when the user actually leaves the input;
  4. onFocus is fired every time the input is focused;
  5. Clear button is accessible and responds to keyboard events.

Checklist:

  • Documentation
  • Tests
  • Ready to be merged

@vercel
Copy link

vercel bot commented Jan 29, 2021

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/arthurdenner/react-semantic-ui-datepickers/ia37culrr
✅ Preview: https://react-semantic-ui-datepickers-git-fix-handle-keyboard-events.arthurdenner.now.sh

@codecov
Copy link

codecov bot commented Jan 29, 2021

Codecov Report

❗ No coverage uploaded for pull request base (beta@6cd97ef). Click here to learn what that means.
The diff coverage is n/a.

Impacted file tree graph

@@           Coverage Diff           @@
##             beta     #513   +/-   ##
=======================================
  Coverage        ?   95.02%           
=======================================
  Files           ?       16           
  Lines           ?      523           
  Branches        ?      100           
=======================================
  Hits            ?      497           
  Misses          ?       26           
  Partials        ?        0           

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 6cd97ef...6a413e6. Read the comment docs.

@arthurdenner arthurdenner merged commit 58d0c80 into beta Jan 29, 2021
@arthurdenner arthurdenner deleted the fix/handle-keyboard-events branch January 29, 2021 10:25
@github-actions
Copy link

🎉 This PR is included in version 2.13.0-beta.1 🎉

The release is available on:

Your semantic-release bot 📦🚀

arthurdenner added a commit that referenced this pull request Feb 10, 2021
* fix(a11y): persist selected button through rerender

* fix(datepicker): properly fire onBlur events

* feat(datepicker): support onFocus event

* refactor(datepicker): update data-testid for clear icon

* fix(a11y): turn clear button keyboard-accessible

* feat(datepicker): support autoFocus prop

* feat(a11y): navigate between dates/buttons with keyboard
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant