iOS: Fix icon before "notebooks" header is focusable

personalizedrefrigerator · Dec 23, 2024 · 3b2daf3 · 3b2daf3
1 parent 603f905
commit 3b2daf3
Showing 1 changed file with 4 additions and 2 deletions.
diff --git a/packages/app-mobile/components/Icon.tsx b/packages/app-mobile/components/Icon.tsx
@@ -34,8 +34,9 @@ const Icon: React.FC<Props> = props => {
 	const importantForAccessibility = accessibilityHidden ? 'no-hide-descendants' : 'yes';
 
 	const sharedProps = {
-		importantForAccessibility,
-		'aria-hidden': accessibilityHidden,
+		importantForAccessibility, // Android
+		accessibilityElementsHidden: accessibilityHidden, // iOS
+		'aria-hidden': accessibilityHidden, // Web
 		accessibilityLabel: props.accessibilityLabel,
 		style: props.style,
 		allowFontScaling: props.allowFontScaling,
@@ -62,6 +63,7 @@ const Icon: React.FC<Props> = props => {
 				style={props.style}
 				aria-hidden={accessibilityHidden}
 				importantForAccessibility={importantForAccessibility}
+				accessibilityElementsHidden={accessibilityHidden}
 			>
 				{nameSuffix}
 			</Text>