From ada13fdeb7692ff1fecceaab539a126f61b08eeb Mon Sep 17 00:00:00 2001
From: Tamas Kovacs <tamas.kovacs@instructure.com>
Date: Fri, 4 Oct 2024 14:47:34 +0200
Subject: [PATCH] fix(ui-options): subgroup titles in Options are not
 announnced by TalkBack and iOS VoiceOver

Closes: INSTUI-4235
---
 packages/ui-options/src/Options/index.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/ui-options/src/Options/index.tsx b/packages/ui-options/src/Options/index.tsx
index 8f0c5f7aba..a6d5dad85f 100644
--- a/packages/ui-options/src/Options/index.tsx
+++ b/packages/ui-options/src/Options/index.tsx
@@ -104,11 +104,12 @@ class Options extends Component<OptionsProps> {
 
   renderLabel() {
     const { renderLabel, styles } = this.props
+    const isAndroidOrIOS = /Android|iPhone|iPad/i.test(navigator.userAgent)
     return (
       <span
         id={this._labelId}
         role="presentation"
-        aria-hidden="true"
+        aria-hidden={isAndroidOrIOS ? 'false' : 'true'}
         css={styles?.label}
       >
         {callRenderProp(renderLabel)}
@@ -119,7 +120,7 @@ class Options extends Component<OptionsProps> {
   renderSubList(subOptions: OptionsChild) {
     const { styles } = this.props
     return (
-      <Item as={this.childAs} role="presentation" css={styles?.label}>
+      <Item as={this.childAs} role="presention" css={styles?.label}>
         {subOptions}
       </Item>
     )