Created
February 6, 2025 01:02
-
-
Save marcogravbrot/09a3f37411a3497dedb9cf0ced06a762 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
diff --git a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheet/BottomSheet.tsx b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheet/BottomSheet.tsx | |
index c79181a..27fb021 100644 | |
--- a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheet/BottomSheet.tsx | |
+++ b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheet/BottomSheet.tsx | |
@@ -167,6 +167,7 @@ const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>( | |
_providedAccessibilityLabel = DEFAULT_ACCESSIBILITY_LABEL, | |
accessibilityRole: | |
_providedAccessibilityRole = DEFAULT_ACCESSIBILITY_ROLE, | |
+ importantForAccessibility, | |
} = props; | |
//#endregion | |
@@ -1891,6 +1892,7 @@ const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>( | |
bottomInset={bottomInset} | |
detached={detached} | |
style={_providedContainerStyle} | |
+ importantForAccessibility={importantForAccessibility} | |
> | |
<Animated.View style={containerStyle}> | |
<BottomSheetBackgroundContainer | |
@@ -1906,6 +1908,7 @@ const BottomSheetComponent = forwardRef<BottomSheet, BottomSheetProps>( | |
accessible={_providedAccessible ?? undefined} | |
accessibilityRole={_providedAccessibilityRole ?? undefined} | |
accessibilityLabel={_providedAccessibilityLabel ?? undefined} | |
+ importantForAccessibility={importantForAccessibility} | |
> | |
<DraggableView | |
key="BottomSheetRootDraggableView" | |
diff --git a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx | |
index 3b9bf87..cd0de76 100644 | |
--- a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx | |
+++ b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx | |
@@ -44,6 +44,7 @@ const BottomSheetBackdropComponent = ({ | |
accessibilityRole: _providedAccessibilityRole = DEFAULT_ACCESSIBILITY_ROLE, | |
accessibilityLabel: _providedAccessibilityLabel = DEFAULT_ACCESSIBILITY_LABEL, | |
accessibilityHint: _providedAccessibilityHint = DEFAULT_ACCESSIBILITY_HINT, | |
+ importantForAccessibility, | |
}: BottomSheetDefaultBackdropProps) => { | |
//#region hooks | |
const { snapToIndex, close } = useBottomSheet(); | |
@@ -150,6 +151,7 @@ const BottomSheetBackdropComponent = ({ | |
typeof pressBehavior === 'string' ? pressBehavior : 'move' | |
} the Bottom Sheet` | |
} | |
+ importantForAccessibility={importantForAccessibility} | |
> | |
{children} | |
</Animated.View> | |
diff --git a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackground/BottomSheetBackground.tsx b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackground/BottomSheetBackground.tsx | |
index 3f165dd..a14e76b 100644 | |
--- a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackground/BottomSheetBackground.tsx | |
+++ b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackground/BottomSheetBackground.tsx | |
@@ -6,12 +6,13 @@ import type { BottomSheetBackgroundProps } from './types'; | |
const BottomSheetBackgroundComponent = ({ | |
pointerEvents, | |
style, | |
+ accessible = false, | |
+ importantForAccessibility = "no" | |
}: BottomSheetBackgroundProps) => ( | |
<View | |
pointerEvents={pointerEvents} | |
- accessible={true} | |
- accessibilityRole="adjustable" | |
- accessibilityLabel="Bottom Sheet" | |
+ accessible={accessible} | |
+ importantForAccessibility={importantForAccessibility} | |
style={[styles.container, style]} | |
/> | |
); | |
diff --git a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackground/types.d.ts b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackground/types.d.ts | |
index 37d2e20..2748860 100644 | |
--- a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackground/types.d.ts | |
+++ b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackground/types.d.ts | |
@@ -3,4 +3,7 @@ import type { BottomSheetVariables } from '../../types'; | |
export interface BottomSheetBackgroundProps | |
extends Pick<ViewProps, 'pointerEvents' | 'style'>, | |
- BottomSheetVariables {} | |
+ BottomSheetVariables { | |
+ accessible?: boolean; | |
+ importantForAccessibility?: 'auto' | 'yes' | 'no' | 'no-hide-descendants'; | |
+ } | |
diff --git a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetContainer/BottomSheetContainer.tsx b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetContainer/BottomSheetContainer.tsx | |
index 0716ecd..2af849b 100644 | |
--- a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetContainer/BottomSheetContainer.tsx | |
+++ b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetContainer/BottomSheetContainer.tsx | |
@@ -20,6 +20,7 @@ function BottomSheetContainerComponent({ | |
detached, | |
style, | |
children, | |
+ importantForAccessibility, | |
}: BottomSheetContainerProps) { | |
const containerRef = useRef<View>(null); | |
//#region styles | |
@@ -84,6 +85,7 @@ function BottomSheetContainerComponent({ | |
pointerEvents="box-none" | |
onLayout={shouldCalculateHeight ? handleContainerLayout : undefined} | |
style={containerStyle} | |
+ importantForAccessibility={importantForAccessibility} | |
> | |
{children} | |
</View> | |
diff --git a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetContainer/types.d.ts b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetContainer/types.d.ts | |
index f3bbdf2..25f3e70 100644 | |
--- a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetContainer/types.d.ts | |
+++ b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetContainer/types.d.ts | |
@@ -12,4 +12,5 @@ export interface BottomSheetContainerProps | |
shouldCalculateHeight?: boolean; | |
style?: StyleProp<ViewStyle>; | |
children?: ReactNode; | |
+ importantForAccessibility?: 'auto' | 'yes' | 'no' | 'no-hide-descendants'; | |
} | |
diff --git a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetModal/BottomSheetModal.tsx b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetModal/BottomSheetModal.tsx | |
index 53ce110..ca95268 100644 | |
--- a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetModal/BottomSheetModal.tsx | |
+++ b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetModal/BottomSheetModal.tsx | |
@@ -53,6 +53,9 @@ function BottomSheetModalComponent<T = any>( | |
animateOnMount = true, | |
containerComponent: ContainerComponent = React.Fragment, | |
+ // accessibility | |
+ importantForAccessibility, | |
+ | |
// callbacks | |
onChange: _providedOnChange, | |
@@ -456,6 +459,7 @@ function BottomSheetModalComponent<T = any>( | |
onClose={handleBottomSheetOnClose} | |
onAnimate={handleBottomSheetOnAnimate} | |
$modal={true} | |
+ importantForAccessibility={importantForAccessibility} | |
> | |
{typeof Content === 'function' ? <Content data={data} /> : Content} | |
</BottomSheet> | |
diff --git a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetModalProvider/BottomSheetModalProvider.tsx b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetModalProvider/BottomSheetModalProvider.tsx | |
index 2327d8a..7d615d6 100644 | |
--- a/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetModalProvider/BottomSheetModalProvider.tsx | |
+++ b/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetModalProvider/BottomSheetModalProvider.tsx | |
@@ -1,5 +1,5 @@ | |
import { PortalProvider } from '@gorhom/portal'; | |
-import React, { useCallback, useMemo, useRef } from 'react'; | |
+import React, { useCallback, useMemo, useRef, useState } from 'react'; | |
import { useSharedValue } from 'react-native-reanimated'; | |
import { MODAL_STACK_BEHAVIOR } from '../../constants'; | |
import { | |
@@ -19,6 +19,7 @@ import type { | |
BottomSheetModalProviderProps, | |
BottomSheetModalRef, | |
} from './types'; | |
+import { View } from 'react-native'; | |
const BottomSheetModalProviderWrapper = ({ | |
children, | |
@@ -30,6 +31,7 @@ const BottomSheetModalProviderWrapper = ({ | |
//#region variables | |
const sheetsQueueRef = useRef<BottomSheetModalRef[]>([]); | |
+ const [sheetsCount, setSheetsCount] = useState(0); | |
//#endregion | |
//#region private methods | |
@@ -87,6 +89,7 @@ const BottomSheetModalProviderWrapper = ({ | |
willUnmount: false, | |
}); | |
sheetsQueueRef.current = _sheetsQueue; | |
+ setSheetsCount(_sheetsQueue.length); | |
}, | |
[] | |
); | |
@@ -101,6 +104,7 @@ const BottomSheetModalProviderWrapper = ({ | |
*/ | |
_sheetsQueue.splice(sheetIndex, 1); | |
sheetsQueueRef.current = _sheetsQueue; | |
+ setSheetsCount(_sheetsQueue.length); | |
/** | |
* Here we try to restore previous sheet position if unmounted | |
@@ -144,6 +148,7 @@ const BottomSheetModalProviderWrapper = ({ | |
} | |
sheetsQueueRef.current = _sheetsQueue; | |
+ setSheetsCount(_sheetsQueue.length); | |
}, []); | |
//#endregion | |
@@ -191,15 +196,22 @@ const BottomSheetModalProviderWrapper = ({ | |
); | |
//#endregion | |
+ const isModalVisible = sheetsQueueRef.current.length > 0; | |
+ | |
//#region renders | |
return ( | |
<BottomSheetModalProvider value={externalContextVariables}> | |
<BottomSheetModalInternalProvider value={internalContextVariables}> | |
<BottomSheetContainer | |
+ importantForAccessibility={isModalVisible ? "yes" : "no-hide-descendants"} | |
containerOffset={animatedContainerOffset} | |
containerHeight={animatedContainerHeight} | |
/> | |
- <PortalProvider>{children}</PortalProvider> | |
+ <PortalProvider> | |
+ <View style={{flex: 1}} importantForAccessibility={isModalVisible ? "no-hide-descendants" : "yes"}> | |
+ {children} | |
+ </View> | |
+ </PortalProvider> | |
</BottomSheetModalInternalProvider> | |
</BottomSheetModalProvider> | |
); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment