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

[v4] | [v2] Keyboard accessibility not working if adding bottom sheet inside a <Tab.Screen> (@react-navigation/material-top-tabs library) #1853

Closed
gpurbia opened this issue Jun 3, 2024 · 3 comments
Labels
bug Something isn't working no-issue-activity

Comments

@gpurbia
Copy link

gpurbia commented Jun 3, 2024

Bug

I am using a bottom sheet library in one the screen inside the <Tab.Navigator>. I am trying to access the bottom sheet library content via keyboard for achieve accessibility related stuffs. But i am not able to focus any content inside the bottom sheet and not able to navigate contents by keyboard.

Bottom sheet is getting focused if i tap first time, and if try to tap again to access content its going out of the content and next element is getting selected.

IMG_0.MOV

Environment info

Library Version
@gorhom/bottom-sheet ^4.4.6
react-native 0.74.1
react-native-reanimated ~3.10.1
react-native-gesture-handler ~2.16.1

Steps To Reproduce

  1. In device settings, go to keyboards, Full Keyboard Access, turn it on.
  2. Visit the screen, where the bottom sheet is implemented.
  3. Connect your device to external keyboard or if you are using simulator than device keyboard should work.
  4. Open bottom sheet, and try to focus or access any content via keyboard tap key or arrow key.

Describe what you expected to happen:

  1. Focus should be goes inside the bottom sheet.
  2. Each item can be focused via the keyboard through tap or arrow keys.

Reproducible sample code

here is the reproducible example snack (https://snack.expo.dev/@giteshpurbia/gorhom-bottom-sheet)

@gpurbia gpurbia added the bug Something isn't working label Jun 3, 2024
@SkMamtajuddin
Copy link

Bug

I am using a bottom sheet library in one the screen inside the <Tab.Navigator>. I am trying to access the bottom sheet library content via keyboard for achieve accessibility related stuffs. But i am not able to focus any content inside the bottom sheet and not able to navigate contents by keyboard.

Bottom sheet is getting focused if i tap first time, and if try to tap again to access content its going out of the content and next element is getting selected.

Uploading IMG_0.MOV…

Environment info

Library Version
@gorhom/bottom-sheet ^4.4.6
react-native 0.74.1
react-native-reanimated ~3.10.1
react-native-gesture-handler ~2.16.1

Steps To Reproduce

  1. In device settings, go to keyboards, Full Keyboard Access, turn it on.
  2. Visit the screen, where the bottom sheet is implemented.
  3. Connect your device to external keyboard or if you are using simulator than device keyboard should work.
  4. Open bottom sheet, and try to focus or access any content via keyboard tap key or arrow key.

Describe what you expected to happen:

  1. Focus should be goes inside the bottom sheet.
  2. Each item can be focused via the keyboard through tap or arrow keys.

Reproducible sample code

here is the reproducible example snack (https://snack.expo.dev/@giteshpurbia/gorhom-bottom-sheet)

Thanks @gpurbia for raised this issue i am also facing same issue on bottomSheet when we use it under Tab.Navigator

@gpurbia gpurbia changed the title [v4] | [v2] Keyboard accessibility not working if adding bottom inside a <Tab.Screen> (@react-navigation/material-top-tabs library) [v4] | [v2] Keyboard accessibility not working if adding bottom sheet inside a <Tab.Screen> (@react-navigation/material-top-tabs library) Jun 3, 2024
Copy link

github-actions bot commented Jul 4, 2024

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

Copy link

github-actions bot commented Jul 9, 2024

This issue was closed because it has been stalled for 5 days with no activity.

@github-actions github-actions bot closed this as completed Jul 9, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working no-issue-activity
Projects
None yet
Development

No branches or pull requests

2 participants