Skip to content
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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Full keyboard navigation & screen reader support via accessibility mode #1534

Open
wants to merge 23 commits into
base: master
from

Conversation

@chandlerprall
Copy link

commented Nov 8, 2018

Adds accessibleMode and accessibleModeButton top-level props. No functionality is changed unless accessibleMode is set to true.

  • adds full keyboard navigation & interaction
    • acts like a combo box, tabbing into box doesn't pop the selector, up/down arrows or tabbing onto the accessibleModeButton button and hitting [Space] triggers the popover, with a focus trap to prevent tabbing out of the control
    • date/time selection with a preselection using :hover styles
    • ui chrome is tabbable (month navigation, month / year / monthyear dropdown, etc)
  • adds screen reader support

Demo:

      accessibleMode: true,
      accessibleModeButton: <span>馃搮</span>

date/time selection by keyboard

@chandlerprall

This comment has been minimized.

Copy link
Author

commented Nov 8, 2018

CI testrun failed because the test runner is using FF 56 which is 7 major versions behind and doesn't support how I implemented the scroll-into-view.

@Cicko

This comment has been minimized.

Copy link

commented Dec 4, 2018

Please resolve this.

@bjankord

This comment has been minimized.

Copy link

commented Dec 7, 2018

I'm very interested in this, we've been using Hacker0x01/react-datepicker and have been happy with it, (especially with the removal of MomentJS), but are interested in seeing improved accessibility of the component. @chandlerprall this will need to be updated with master which removes Moment.

Would love to see this added to the project @martijnrusschen!

@ranand

This comment has been minimized.

Copy link

commented Jun 4, 2019

this package with accessibility in built (including tabbing, focus on calendar widget instead of the textbox) will go a long way in terms of supporting 508 compliance. This PR is a great step in that direction. Please do let us know if this will get merged sometime soon. Thanks!

@chandlerprall

This comment has been minimized.

Copy link
Author

commented Jun 4, 2019

I would be happy to update this PR to be mergeable with master, but having not heard anything from the package author(s), and seeing a lot of other accessibility PRs that went without any response or feedback I am not going to invest more time until that changes.

@martijnrusschen

This comment has been minimized.

Copy link
Member

commented Jun 5, 2019

I've been mostly ignoring because the build is still failing. I've spent too much time on PRs that didn't get fixed in the past that I'm a bit hesitant to spend time on PRs that aren't ready yet. However, I do think this is an improvement and if you can get this in a state we can merge this, I'm happy to look into it.

@chandlerprall

This comment has been minimized.

Copy link
Author

commented Jun 5, 2019

Sounds good! I'll find some time to update this against the master branch.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
6 participants
You can鈥檛 perform that action at this time.