fix(17525): fixes a11y violation in toggle (#18216)

Co-authored-by: Taylor Jones <[email protected]>
carbon-design-system · Dec 11, 2024 · e6ee8dd · e6ee8dd
1 parent 5b3df41
commit e6ee8dd
Showing 1 changed file with 3 additions and 2 deletions.
diff --git a/packages/react/src/components/Toggle/Toggle.stories.js b/packages/react/src/components/Toggle/Toggle.stories.js
@@ -100,16 +100,17 @@ export const WithAccessibleLabels = () => (
       <div id="toggle-6-label" style={{ marginBlockEnd: '0.5rem' }}>
         Internal aria-label toggle
       </div>
-      <Toggle aria-label="Internal aria-label toggle" id="toggle-6" hideLabel />
+      <Toggle aria-labelledby="toggle-6-label" id="toggle-6" />
     </div>
 
     <div>
       <label
+        id="toggle-7-label"
         htmlFor="toggle-7"
         style={{ display: 'block', marginBlockEnd: '0.5rem' }}>
         External toggle label
       </label>
-      <Toggle id="toggle-7" hideLabel />
+      <Toggle aria-labelledby="toggle-7-label" id="toggle-7" />
     </div>
   </VStack>
 );