From c485aa5dceddd7c2fa85132e0dee0c3aad0c6caf Mon Sep 17 00:00:00 2001
From: Petr Duda <peta.duda@gmail.com>
Date: Mon, 31 Oct 2022 14:44:54 +0100
Subject: [PATCH] V9 Slider is missing cursor pointer (#25184)

* cursor

* change

Co-authored-by: Petr Duda <petrduda@microsoft.com>
---
 ...-react-slider-6edcf23c-8a46-4642-b3e7-af380c6c87f0.json | 7 +++++++
 .../react-slider/src/components/Slider/useSliderStyles.ts  | 5 +++++
 2 files changed, 12 insertions(+)
 create mode 100644 change/@fluentui-react-slider-6edcf23c-8a46-4642-b3e7-af380c6c87f0.json

diff --git a/change/@fluentui-react-slider-6edcf23c-8a46-4642-b3e7-af380c6c87f0.json b/change/@fluentui-react-slider-6edcf23c-8a46-4642-b3e7-af380c6c87f0.json
new file mode 100644
index 00000000000000..0608abec415f4d
--- /dev/null
+++ b/change/@fluentui-react-slider-6edcf23c-8a46-4642-b3e7-af380c6c87f0.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Adding cursor pointer to the Slider component",
+  "packageName": "@fluentui/react-slider",
+  "email": "petrduda@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-slider/src/components/Slider/useSliderStyles.ts b/packages/react-components/react-slider/src/components/Slider/useSliderStyles.ts
index 851d278e0773a9..0084f28ffa0f53 100644
--- a/packages/react-components/react-slider/src/components/Slider/useSliderStyles.ts
+++ b/packages/react-components/react-slider/src/components/Slider/useSliderStyles.ts
@@ -227,6 +227,7 @@ const useThumbStyles = makeStyles({
  */
 const useInputStyles = makeStyles({
   input: {
+    cursor: 'pointer',
     opacity: 0,
     gridRowStart: '1',
     gridRowEnd: '-1',
@@ -235,6 +236,9 @@ const useInputStyles = makeStyles({
     ...shorthands.padding(0),
     ...shorthands.margin(0),
   },
+  disabled: {
+    cursor: 'default',
+  },
   horizontal: {
     height: `var(${thumbSizeVar})`,
     width: '100%',
@@ -285,6 +289,7 @@ export const useSliderStyles_unstable = (state: SliderState): SliderState => {
     sliderClassNames.input,
     inputStyles.input,
     isVertical ? inputStyles.vertical : inputStyles.horizontal,
+    state.disabled && inputStyles.disabled,
     state.input.className,
   );