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’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add option to not focus after flip #2

Open
burtyish opened this issue Oct 14, 2015 · 6 comments
Open

Add option to not focus after flip #2

burtyish opened this issue Oct 14, 2015 · 6 comments

Comments

@burtyish
Copy link

Hi, I was glad to find this component, it's pretty sweet - thanks!
I'd like to add the option to avoid focusing after flipping.
I will gladly work on a PR for this if this is something you may be interested in merging.

P.S.
Here's my use case:
I'm using the flip card show a placeholder image until all my data is ready. When the data is ready, I flip the card to reveal the final image. So focusing on the image is not a desired effect here.

@burtyish burtyish changed the title Add option to not focus Add option to not focus after flip Oct 14, 2015
@burtyish
Copy link
Author

@mzabriskie how about it? Would you consider a PR for this issue?

@mzabriskie
Copy link
Owner

The focus is done for the sake of accessibility. I am reluctant to break the use case for screen readers. I understand your PR would be done as an optional prop, but I wonder in your use case where the focus should be, and how it affects a11y.

@burtyish
Copy link
Author

I see your point about a11y now. If I understand correctly, one example could be:
A vision-impaired user requires the flip-back to be focused to hear (via screen reader) the content of the flipped card once it's been flipped, right?
This makes sense when the user has triggered the flip.
In the use case I described though, the flip card is controlled (disabled={true}) and triggered by an async action (receiving data and fetching a photo) which happens while the user is reading other content on the page. Focusing on the flipped photo would grab focus from whatever is being read to the flip card - in effect maybe even hurting a11y, no?
I'm new to a11y, so I may be wrong here.

@mzabriskie
Copy link
Owner

I guess I don't fully understand your use case. It sounds like you are showing a loading image while your data loads, to indicate that something is happening. Why wouldn't this same message need to be conveyed to someone with an impairment? Also if the data is still loading, what are they reading?

@burtyish
Copy link
Author

First, I'll mention that this is not deal breaker for me. I see the value in your points and wouldn't want to hurt a11y. And now to answer your questions...
It's a dashboard of sort and the image is akin to a profile photo. Before the image is loaded, we show a branded placeholder image.
While the image is loading, the person could be reading other data on the page, which is acquired from various sources. AFAIK the vision-impaired version of the image would be the alt text, something like "Joe's profile photo".

rcarvalho pushed a commit to rcarvalho/react-flipcard that referenced this issue Dec 7, 2016
fix: Protect against unmounting
@ValBerthe
Copy link

Are you still interested in having an option to disable focus on flip? I can open a PR for that. I know it has been a while, but it would still be cool to have it !

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants