From 7798b0c4c577ee327d27419b3041057283831207 Mon Sep 17 00:00:00 2001
From: Josh Black <josh@josh.black>
Date: Thu, 10 Dec 2020 09:36:56 -0600
Subject: [PATCH] fix(slider): add label to slider

---
 packages/react/src/components/Slider/Slider.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/react/src/components/Slider/Slider.js b/packages/react/src/components/Slider/Slider.js
index b52c3a2ccbb0..a47bfa454414 100644
--- a/packages/react/src/components/Slider/Slider.js
+++ b/packages/react/src/components/Slider/Slider.js
@@ -505,6 +505,7 @@ export default class Slider extends PureComponent {
 
     const { value, left } = this.state;
 
+    const labelId = `${id}-label`;
     const labelClasses = classNames(`${prefix}--label`, {
       [`${prefix}--label--disabled`]: disabled,
     });
@@ -536,7 +537,7 @@ export default class Slider extends PureComponent {
 
     return (
       <div className={`${prefix}--form-item`}>
-        <label htmlFor={id} className={labelClasses}>
+        <label htmlFor={id} className={labelClasses} id={labelId}>
           {labelText}
         </label>
         <div className={`${prefix}--slider-container`}>
@@ -560,6 +561,7 @@ export default class Slider extends PureComponent {
               role="slider"
               id={id}
               tabIndex={0}
+              aria-labelledby={labelId}
               aria-valuemax={max}
               aria-valuemin={min}
               aria-valuenow={value}