@fluentui/react-slider 9.5.3 → 9.5.5

package/CHANGELOG.md

@@ -1,12 +1,41 @@
 # Change Log - @fluentui/react-slider
 
-This log was last generated on Thu, 07 Aug 2025 09:59:13 GMT and should not be manually modified.
+This log was last generated on Mon, 08 Sep 2025 12:41:14 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.5.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-slider_v9.5.5)
+
+Mon, 08 Sep 2025 12:41:14 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-slider_v9.5.4..@fluentui/react-slider_v9.5.5)
+
+### Patches
+
+- chore: enforce explicit module boundary types ([PR #35080](https://github.com/microsoft/fluentui/pull/35080) by dmytrokirpa@microsoft.com)
+- chore: extend peer dependencies versions to support React 19 ([PR #35145](https://github.com/microsoft/fluentui/pull/35145) by dmytrokirpa@microsoft.com)
+- fix: react 19 type issues ([PR #34864](https://github.com/microsoft/fluentui/pull/34864) by dmytrokirpa@microsoft.com)
+- Bump @fluentui/react-field to v9.4.5 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.2.0 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.25.1 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-tabster to v9.26.5 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-utilities to v9.24.1 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+
+## [9.5.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-slider_v9.5.4)
+
+Thu, 21 Aug 2025 12:25:19 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-slider_v9.5.3..@fluentui/react-slider_v9.5.4)
+
+### Patches
+
+- Bump @fluentui/react-field to v9.4.4 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.1.6 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.25.0 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-tabster to v9.26.4 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-utilities to v9.24.0 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+
 ## [9.5.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-slider_v9.5.3)
 
-Thu, 07 Aug 2025 09:59:13 GMT 
+Thu, 07 Aug 2025 10:03:33 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-slider_v9.5.2..@fluentui/react-slider_v9.5.3)
 
 ### Patches

package/dist/index.d.ts

@@ -1,8 +1,7 @@
-/// <reference types="react" />
-
 import type { ComponentProps } from '@fluentui/react-utilities';
 import type { ComponentState } from '@fluentui/react-utilities';
 import type { ForwardRefComponent } from '@fluentui/react-utilities';
+import type { JSXElement } from '@fluentui/react-utilities';
 import * as React_2 from 'react';
 import type { Slot } from '@fluentui/react-utilities';
 import type { SlotClassNames } from '@fluentui/react-utilities';
@@ -10,7 +9,7 @@ import type { SlotClassNames } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of Slider
  */
-export declare const renderSlider_unstable: (state: SliderState) => JSX.Element;
+export declare const renderSlider_unstable: (state: SliderState) => JSXElement;
 
 /**
  * The Slider component allows users to quickly select a value by dragging a thumb across a rail.

package/lib/components/Slider/renderSlider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Slider/renderSlider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SliderState, SliderSlots } from './Slider.types';\n\n/**\n * Render the final JSX of Slider\n */\nexport const renderSlider_unstable = (state: SliderState) => {\n  assertSlots<SliderSlots>(state);\n\n  return (\n    <state.root>\n      <state.input />\n      <state.rail />\n      <state.thumb />\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderSlider_unstable","state","root","input","rail","thumb"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,wBAAwB,CAACC;IACpCF,YAAyBE;IAEzB,qBACE,MAACA,MAAMC,IAAI;;0BACT,KAACD,MAAME,KAAK;0BACZ,KAACF,MAAMG,IAAI;0BACX,KAACH,MAAMI,KAAK;;;AAGlB,EAAE"}
+{"version":3,"sources":["../src/components/Slider/renderSlider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { SliderState, SliderSlots } from './Slider.types';\n\n/**\n * Render the final JSX of Slider\n */\nexport const renderSlider_unstable = (state: SliderState): JSXElement => {\n  assertSlots<SliderSlots>(state);\n\n  return (\n    <state.root>\n      <state.input />\n      <state.rail />\n      <state.thumb />\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderSlider_unstable","state","root","input","rail","thumb"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,wBAAwB,CAACC;IACpCF,YAAyBE;IAEzB,qBACE,MAACA,MAAMC,IAAI;;0BACT,KAACD,MAAME,KAAK;0BACZ,KAACF,MAAMG,IAAI;0BACX,KAACH,MAAMI,KAAK;;;AAGlB,EAAE"}

package/lib/components/Slider/useSliderState.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Slider/useSliderState.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { sliderCSSVars } from './useSliderStyles.styles';\nimport type { SliderState, SliderProps } from './Slider.types';\n\nconst { sliderStepsPercentVar, sliderProgressVar, sliderDirectionVar } = sliderCSSVars;\n\nconst getPercent = (value: number, min: number, max: number) => {\n  return max === min ? 0 : ((value - min) / (max - min)) * 100;\n};\n\nexport const useSliderState_unstable = (state: SliderState, props: SliderProps) => {\n  'use no memo';\n\n  const { min = 0, max = 100, step } = props;\n  const { dir } = useFluent();\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: props.value,\n    defaultState: props.defaultValue,\n    initialState: 0,\n  });\n  const clampedValue = clamp(currentValue, min, max);\n  const valuePercent = getPercent(clampedValue, min, max);\n\n  const inputOnChange = state.input.onChange;\n  const propsOnChange = props.onChange;\n\n  const onChange: React.ChangeEventHandler<HTMLInputElement> = useEventCallback(ev => {\n    const newValue = Number(ev.target.value);\n    setCurrentValue(clamp(newValue, min, max));\n\n    if (inputOnChange && inputOnChange !== propsOnChange) {\n      inputOnChange(ev);\n    } else if (propsOnChange) {\n      propsOnChange(ev, { value: newValue });\n    }\n  });\n\n  const stepPercent = step && step > 0 ? `${(step * 100) / (max - min)}%` : undefined;\n  const rootVariables = {\n    [sliderDirectionVar]: state.vertical ? '0deg' : dir === 'ltr' ? '90deg' : '270deg',\n    [sliderProgressVar]: `${valuePercent}%`,\n    // Set the sliderStepsPercentVar only if defined - fixes SSR errors in React 18\n    ...(stepPercent !== undefined && {\n      [sliderStepsPercentVar]: stepPercent,\n    }),\n  };\n\n  // Root props\n  state.root.style = {\n    ...rootVariables,\n    ...state.root.style,\n  };\n\n  // Input Props\n  state.input.value = clampedValue;\n  state.input.onChange = onChange;\n\n  return state;\n};\n"],"names":["React","clamp","useControllableState","useEventCallback","useFluent_unstable","useFluent","sliderCSSVars","sliderStepsPercentVar","sliderProgressVar","sliderDirectionVar","getPercent","value","min","max","useSliderState_unstable","state","props","step","dir","currentValue","setCurrentValue","defaultState","defaultValue","initialState","clampedValue","valuePercent","inputOnChange","input","onChange","propsOnChange","ev","newValue","Number","target","stepPercent","undefined","rootVariables","vertical","root","style"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,EAAEC,oBAAoB,EAAEC,gBAAgB,QAAQ,4BAA4B;AAC1F,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,aAAa,QAAQ,2BAA2B;AAGzD,MAAM,EAAEC,qBAAqB,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAE,GAAGH;AAEzE,MAAMI,aAAa,CAACC,OAAeC,KAAaC;IAC9C,OAAOA,QAAQD,MAAM,IAAI,AAAED,CAAAA,QAAQC,GAAE,IAAMC,CAAAA,MAAMD,GAAE,IAAM;AAC3D;AAEA,OAAO,MAAME,0BAA0B,CAACC,OAAoBC;IAC1D;IAEA,MAAM,EAAEJ,MAAM,CAAC,EAAEC,MAAM,GAAG,EAAEI,IAAI,EAAE,GAAGD;IACrC,MAAM,EAAEE,GAAG,EAAE,GAAGb;IAChB,MAAM,CAACc,cAAcC,gBAAgB,GAAGlB,qBAAqB;QAC3Da,OAAOC,MAAML,KAAK;QAClBU,cAAcL,MAAMM,YAAY;QAChCC,cAAc;IAChB;IACA,MAAMC,eAAevB,MAAMkB,cAAcP,KAAKC;IAC9C,MAAMY,eAAef,WAAWc,cAAcZ,KAAKC;IAEnD,MAAMa,gBAAgBX,MAAMY,KAAK,CAACC,QAAQ;IAC1C,MAAMC,gBAAgBb,MAAMY,QAAQ;IAEpC,MAAMA,WAAuDzB,iBAAiB2B,CAAAA;QAC5E,MAAMC,WAAWC,OAAOF,GAAGG,MAAM,CAACtB,KAAK;QACvCS,gBAAgBnB,MAAM8B,UAAUnB,KAAKC;QAErC,IAAIa,iBAAiBA,kBAAkBG,eAAe;YACpDH,cAAcI;QAChB,OAAO,IAAID,eAAe;YACxBA,cAAcC,IAAI;gBAAEnB,OAAOoB;YAAS;QACtC;IACF;IAEA,MAAMG,cAAcjB,QAAQA,OAAO,IAAI,GAAG,AAACA,OAAO,MAAQJ,CAAAA,MAAMD,GAAE,EAAG,CAAC,CAAC,GAAGuB;IAC1E,MAAMC,gBAAgB;QACpB,CAAC3B,mBAAmB,EAAEM,MAAMsB,QAAQ,GAAG,SAASnB,QAAQ,QAAQ,UAAU;QAC1E,CAACV,kBAAkB,EAAE,GAAGiB,aAAa,CAAC,CAAC;QACvC,+EAA+E;QAC/E,GAAIS,gBAAgBC,aAAa;YAC/B,CAAC5B,sBAAsB,EAAE2B;QAC3B,CAAC;IACH;IAEA,aAAa;IACbnB,MAAMuB,IAAI,CAACC,KAAK,GAAG;QACjB,GAAGH,aAAa;QAChB,GAAGrB,MAAMuB,IAAI,CAACC,KAAK;IACrB;IAEA,cAAc;IACdxB,MAAMY,KAAK,CAAChB,KAAK,GAAGa;IACpBT,MAAMY,KAAK,CAACC,QAAQ,GAAGA;IAEvB,OAAOb;AACT,EAAE"}
+{"version":3,"sources":["../src/components/Slider/useSliderState.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { sliderCSSVars } from './useSliderStyles.styles';\nimport type { SliderState, SliderProps } from './Slider.types';\n\nconst { sliderStepsPercentVar, sliderProgressVar, sliderDirectionVar } = sliderCSSVars;\n\nconst getPercent = (value: number, min: number, max: number) => {\n  return max === min ? 0 : ((value - min) / (max - min)) * 100;\n};\n\nexport const useSliderState_unstable = (state: SliderState, props: SliderProps): SliderState => {\n  'use no memo';\n\n  const { min = 0, max = 100, step } = props;\n  const { dir } = useFluent();\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: props.value,\n    defaultState: props.defaultValue,\n    initialState: 0,\n  });\n  const clampedValue = clamp(currentValue, min, max);\n  const valuePercent = getPercent(clampedValue, min, max);\n\n  const inputOnChange = state.input.onChange;\n  const propsOnChange = props.onChange;\n\n  const onChange: React.ChangeEventHandler<HTMLInputElement> = useEventCallback(ev => {\n    const newValue = Number(ev.target.value);\n    setCurrentValue(clamp(newValue, min, max));\n\n    if (inputOnChange && inputOnChange !== propsOnChange) {\n      inputOnChange(ev);\n    } else if (propsOnChange) {\n      propsOnChange(ev, { value: newValue });\n    }\n  });\n\n  const stepPercent = step && step > 0 ? `${(step * 100) / (max - min)}%` : undefined;\n  const rootVariables = {\n    [sliderDirectionVar]: state.vertical ? '0deg' : dir === 'ltr' ? '90deg' : '270deg',\n    [sliderProgressVar]: `${valuePercent}%`,\n    // Set the sliderStepsPercentVar only if defined - fixes SSR errors in React 18\n    ...(stepPercent !== undefined && {\n      [sliderStepsPercentVar]: stepPercent,\n    }),\n  };\n\n  // Root props\n  state.root.style = {\n    ...rootVariables,\n    ...state.root.style,\n  };\n\n  // Input Props\n  state.input.value = clampedValue;\n  state.input.onChange = onChange;\n\n  return state;\n};\n"],"names":["React","clamp","useControllableState","useEventCallback","useFluent_unstable","useFluent","sliderCSSVars","sliderStepsPercentVar","sliderProgressVar","sliderDirectionVar","getPercent","value","min","max","useSliderState_unstable","state","props","step","dir","currentValue","setCurrentValue","defaultState","defaultValue","initialState","clampedValue","valuePercent","inputOnChange","input","onChange","propsOnChange","ev","newValue","Number","target","stepPercent","undefined","rootVariables","vertical","root","style"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,EAAEC,oBAAoB,EAAEC,gBAAgB,QAAQ,4BAA4B;AAC1F,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,aAAa,QAAQ,2BAA2B;AAGzD,MAAM,EAAEC,qBAAqB,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAE,GAAGH;AAEzE,MAAMI,aAAa,CAACC,OAAeC,KAAaC;IAC9C,OAAOA,QAAQD,MAAM,IAAI,AAAED,CAAAA,QAAQC,GAAE,IAAMC,CAAAA,MAAMD,GAAE,IAAM;AAC3D;AAEA,OAAO,MAAME,0BAA0B,CAACC,OAAoBC;IAC1D;IAEA,MAAM,EAAEJ,MAAM,CAAC,EAAEC,MAAM,GAAG,EAAEI,IAAI,EAAE,GAAGD;IACrC,MAAM,EAAEE,GAAG,EAAE,GAAGb;IAChB,MAAM,CAACc,cAAcC,gBAAgB,GAAGlB,qBAAqB;QAC3Da,OAAOC,MAAML,KAAK;QAClBU,cAAcL,MAAMM,YAAY;QAChCC,cAAc;IAChB;IACA,MAAMC,eAAevB,MAAMkB,cAAcP,KAAKC;IAC9C,MAAMY,eAAef,WAAWc,cAAcZ,KAAKC;IAEnD,MAAMa,gBAAgBX,MAAMY,KAAK,CAACC,QAAQ;IAC1C,MAAMC,gBAAgBb,MAAMY,QAAQ;IAEpC,MAAMA,WAAuDzB,iBAAiB2B,CAAAA;QAC5E,MAAMC,WAAWC,OAAOF,GAAGG,MAAM,CAACtB,KAAK;QACvCS,gBAAgBnB,MAAM8B,UAAUnB,KAAKC;QAErC,IAAIa,iBAAiBA,kBAAkBG,eAAe;YACpDH,cAAcI;QAChB,OAAO,IAAID,eAAe;YACxBA,cAAcC,IAAI;gBAAEnB,OAAOoB;YAAS;QACtC;IACF;IAEA,MAAMG,cAAcjB,QAAQA,OAAO,IAAI,GAAG,AAACA,OAAO,MAAQJ,CAAAA,MAAMD,GAAE,EAAG,CAAC,CAAC,GAAGuB;IAC1E,MAAMC,gBAAgB;QACpB,CAAC3B,mBAAmB,EAAEM,MAAMsB,QAAQ,GAAG,SAASnB,QAAQ,QAAQ,UAAU;QAC1E,CAACV,kBAAkB,EAAE,GAAGiB,aAAa,CAAC,CAAC;QACvC,+EAA+E;QAC/E,GAAIS,gBAAgBC,aAAa;YAC/B,CAAC5B,sBAAsB,EAAE2B;QAC3B,CAAC;IACH;IAEA,aAAa;IACbnB,MAAMuB,IAAI,CAACC,KAAK,GAAG;QACjB,GAAGH,aAAa;QAChB,GAAGrB,MAAMuB,IAAI,CAACC,KAAK;IACrB;IAEA,cAAc;IACdxB,MAAMY,KAAK,CAAChB,KAAK,GAAGa;IACpBT,MAAMY,KAAK,CAACC,QAAQ,GAAGA;IAEvB,OAAOb;AACT,EAAE"}

package/lib-commonjs/components/Slider/renderSlider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Slider/renderSlider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SliderState, SliderSlots } from './Slider.types';\n\n/**\n * Render the final JSX of Slider\n */\nexport const renderSlider_unstable = (state: SliderState) => {\n  assertSlots<SliderSlots>(state);\n\n  return (\n    <state.root>\n      <state.input />\n      <state.rail />\n      <state.thumb />\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderSlider_unstable","state","root","input","rail","thumb"],"mappings":";;;;+BASaC;;;;;;4BARb,iCAAiD;gCAErB,4BAA4B;AAMjD,8BAA8B,CAACC;QACpCF,2BAAAA,EAAyBE;IAEzB,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;8BACT,eAAA,EAACD,MAAME,KAAK,EAAA,CAAA;8BACZ,eAAA,EAACF,MAAMG,IAAI,EAAA,CAAA;8BACX,eAAA,EAACH,MAAMI,KAAK,EAAA,CAAA;;;AAGlB,EAAE"}
+{"version":3,"sources":["../src/components/Slider/renderSlider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { SliderState, SliderSlots } from './Slider.types';\n\n/**\n * Render the final JSX of Slider\n */\nexport const renderSlider_unstable = (state: SliderState): JSXElement => {\n  assertSlots<SliderSlots>(state);\n\n  return (\n    <state.root>\n      <state.input />\n      <state.rail />\n      <state.thumb />\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderSlider_unstable","state","root","input","rail","thumb"],"mappings":";;;;+BAUaC;;;;;;4BATb,iCAAiD;gCAErB,4BAA4B;AAOjD,8BAA8B,CAACC;QACpCF,2BAAAA,EAAyBE;IAEzB,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;8BACT,eAAA,EAACD,MAAME,KAAK,EAAA,CAAA;8BACZ,eAAA,EAACF,MAAMG,IAAI,EAAA,CAAA;8BACX,eAAA,EAACH,MAAMI,KAAK,EAAA,CAAA;;;AAGlB,EAAE"}

package/lib-commonjs/components/Slider/useSliderState.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Slider/useSliderState.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { sliderCSSVars } from './useSliderStyles.styles';\nimport type { SliderState, SliderProps } from './Slider.types';\n\nconst { sliderStepsPercentVar, sliderProgressVar, sliderDirectionVar } = sliderCSSVars;\n\nconst getPercent = (value: number, min: number, max: number) => {\n  return max === min ? 0 : ((value - min) / (max - min)) * 100;\n};\n\nexport const useSliderState_unstable = (state: SliderState, props: SliderProps) => {\n  'use no memo';\n\n  const { min = 0, max = 100, step } = props;\n  const { dir } = useFluent();\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: props.value,\n    defaultState: props.defaultValue,\n    initialState: 0,\n  });\n  const clampedValue = clamp(currentValue, min, max);\n  const valuePercent = getPercent(clampedValue, min, max);\n\n  const inputOnChange = state.input.onChange;\n  const propsOnChange = props.onChange;\n\n  const onChange: React.ChangeEventHandler<HTMLInputElement> = useEventCallback(ev => {\n    const newValue = Number(ev.target.value);\n    setCurrentValue(clamp(newValue, min, max));\n\n    if (inputOnChange && inputOnChange !== propsOnChange) {\n      inputOnChange(ev);\n    } else if (propsOnChange) {\n      propsOnChange(ev, { value: newValue });\n    }\n  });\n\n  const stepPercent = step && step > 0 ? `${(step * 100) / (max - min)}%` : undefined;\n  const rootVariables = {\n    [sliderDirectionVar]: state.vertical ? '0deg' : dir === 'ltr' ? '90deg' : '270deg',\n    [sliderProgressVar]: `${valuePercent}%`,\n    // Set the sliderStepsPercentVar only if defined - fixes SSR errors in React 18\n    ...(stepPercent !== undefined && {\n      [sliderStepsPercentVar]: stepPercent,\n    }),\n  };\n\n  // Root props\n  state.root.style = {\n    ...rootVariables,\n    ...state.root.style,\n  };\n\n  // Input Props\n  state.input.value = clampedValue;\n  state.input.onChange = onChange;\n\n  return state;\n};\n"],"names":["React","clamp","useControllableState","useEventCallback","useFluent_unstable","useFluent","sliderCSSVars","sliderStepsPercentVar","sliderProgressVar","sliderDirectionVar","getPercent","value","min","max","useSliderState_unstable","state","props","step","dir","currentValue","setCurrentValue","defaultState","defaultValue","initialState","clampedValue","valuePercent","inputOnChange","input","onChange","propsOnChange","ev","newValue","Number","target","stepPercent","undefined","rootVariables","vertical","root","style"],"mappings":";;;;+BAYac;;;;;;;iEAZU,QAAQ;gCAC+B,4BAA4B;qCAC1C,kCAAkC;uCACpD,2BAA2B;AAGzD,MAAM,EAAEP,qBAAqB,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAE,GAAGH,oCAAAA;AAEzE,MAAMI,aAAa,CAACC,OAAeC,KAAaC;IAC9C,OAAOA,QAAQD,MAAM,IAAMD,CAAAA,QAAQC,GAAAA,CAAE,IAAMC,MAAMD,GAAAA,CAAE,GAAM;AAC3D;AAEO,gCAAgC,CAACG,OAAoBC;IAC1D;IAEA,MAAM,EAAEJ,MAAM,CAAC,EAAEC,MAAM,GAAG,EAAEI,IAAI,EAAE,GAAGD;IACrC,MAAM,EAAEE,GAAG,EAAE,OAAGb,uCAAAA;IAChB,MAAM,CAACc,cAAcC,gBAAgB,OAAGlB,oCAAAA,EAAqB;QAC3Da,OAAOC,MAAML,KAAK;QAClBU,cAAcL,MAAMM,YAAY;QAChCC,cAAc;IAChB;IACA,MAAMC,mBAAevB,qBAAAA,EAAMkB,cAAcP,KAAKC;IAC9C,MAAMY,eAAef,WAAWc,cAAcZ,KAAKC;IAEnD,MAAMa,gBAAgBX,MAAMY,KAAK,CAACC,QAAQ;IAC1C,MAAMC,gBAAgBb,MAAMY,QAAQ;IAEpC,MAAMA,eAAuDzB,gCAAAA,EAAiB2B,CAAAA;QAC5E,MAAMC,WAAWC,OAAOF,GAAGG,MAAM,CAACtB,KAAK;QACvCS,oBAAgBnB,qBAAAA,EAAM8B,UAAUnB,KAAKC;QAErC,IAAIa,iBAAiBA,kBAAkBG,eAAe;YACpDH,cAAcI;QAChB,OAAO,IAAID,eAAe;YACxBA,cAAcC,IAAI;gBAAEnB,OAAOoB;YAAS;QACtC;IACF;IAEA,MAAMG,cAAcjB,QAAQA,OAAO,IAAI,GAAIA,OAAO,MAAQJ,OAAMD,GAAAA,CAAE,CAAG,CAAC,CAAC,GAAGuB;IAC1E,MAAMC,gBAAgB;QACpB,CAAC3B,mBAAmB,EAAEM,MAAMsB,QAAQ,GAAG,SAASnB,QAAQ,QAAQ,UAAU;QAC1E,CAACV,kBAAkB,EAAE,GAAGiB,aAAa,CAAC,CAAC;QACvC,+EAA+E;QAC/E,GAAIS,gBAAgBC,aAAa;YAC/B,CAAC5B,sBAAsB,EAAE2B;QAC3B,CAAC;IACH;IAEA,aAAa;IACbnB,MAAMuB,IAAI,CAACC,KAAK,GAAG;QACjB,GAAGH,aAAa;QAChB,GAAGrB,MAAMuB,IAAI,CAACC,KAAK;IACrB;IAEA,cAAc;IACdxB,MAAMY,KAAK,CAAChB,KAAK,GAAGa;IACpBT,MAAMY,KAAK,CAACC,QAAQ,GAAGA;IAEvB,OAAOb;AACT,EAAE"}
+{"version":3,"sources":["../src/components/Slider/useSliderState.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clamp, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { sliderCSSVars } from './useSliderStyles.styles';\nimport type { SliderState, SliderProps } from './Slider.types';\n\nconst { sliderStepsPercentVar, sliderProgressVar, sliderDirectionVar } = sliderCSSVars;\n\nconst getPercent = (value: number, min: number, max: number) => {\n  return max === min ? 0 : ((value - min) / (max - min)) * 100;\n};\n\nexport const useSliderState_unstable = (state: SliderState, props: SliderProps): SliderState => {\n  'use no memo';\n\n  const { min = 0, max = 100, step } = props;\n  const { dir } = useFluent();\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: props.value,\n    defaultState: props.defaultValue,\n    initialState: 0,\n  });\n  const clampedValue = clamp(currentValue, min, max);\n  const valuePercent = getPercent(clampedValue, min, max);\n\n  const inputOnChange = state.input.onChange;\n  const propsOnChange = props.onChange;\n\n  const onChange: React.ChangeEventHandler<HTMLInputElement> = useEventCallback(ev => {\n    const newValue = Number(ev.target.value);\n    setCurrentValue(clamp(newValue, min, max));\n\n    if (inputOnChange && inputOnChange !== propsOnChange) {\n      inputOnChange(ev);\n    } else if (propsOnChange) {\n      propsOnChange(ev, { value: newValue });\n    }\n  });\n\n  const stepPercent = step && step > 0 ? `${(step * 100) / (max - min)}%` : undefined;\n  const rootVariables = {\n    [sliderDirectionVar]: state.vertical ? '0deg' : dir === 'ltr' ? '90deg' : '270deg',\n    [sliderProgressVar]: `${valuePercent}%`,\n    // Set the sliderStepsPercentVar only if defined - fixes SSR errors in React 18\n    ...(stepPercent !== undefined && {\n      [sliderStepsPercentVar]: stepPercent,\n    }),\n  };\n\n  // Root props\n  state.root.style = {\n    ...rootVariables,\n    ...state.root.style,\n  };\n\n  // Input Props\n  state.input.value = clampedValue;\n  state.input.onChange = onChange;\n\n  return state;\n};\n"],"names":["React","clamp","useControllableState","useEventCallback","useFluent_unstable","useFluent","sliderCSSVars","sliderStepsPercentVar","sliderProgressVar","sliderDirectionVar","getPercent","value","min","max","useSliderState_unstable","state","props","step","dir","currentValue","setCurrentValue","defaultState","defaultValue","initialState","clampedValue","valuePercent","inputOnChange","input","onChange","propsOnChange","ev","newValue","Number","target","stepPercent","undefined","rootVariables","vertical","root","style"],"mappings":";;;;+BAYac;;;;;;;iEAZU,QAAQ;gCAC+B,4BAA4B;qCAC1C,kCAAkC;uCACpD,2BAA2B;AAGzD,MAAM,EAAEP,qBAAqB,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAE,GAAGH,oCAAAA;AAEzE,MAAMI,aAAa,CAACC,OAAeC,KAAaC;IAC9C,OAAOA,QAAQD,MAAM,IAAMD,CAAAA,QAAQC,GAAAA,CAAE,IAAMC,MAAMD,GAAAA,CAAE,GAAM;AAC3D;AAEO,gCAAgC,CAACG,OAAoBC;IAC1D;IAEA,MAAM,EAAEJ,MAAM,CAAC,EAAEC,MAAM,GAAG,EAAEI,IAAI,EAAE,GAAGD;IACrC,MAAM,EAAEE,GAAG,EAAE,OAAGb,uCAAAA;IAChB,MAAM,CAACc,cAAcC,gBAAgB,OAAGlB,oCAAAA,EAAqB;QAC3Da,OAAOC,MAAML,KAAK;QAClBU,cAAcL,MAAMM,YAAY;QAChCC,cAAc;IAChB;IACA,MAAMC,mBAAevB,qBAAAA,EAAMkB,cAAcP,KAAKC;IAC9C,MAAMY,eAAef,WAAWc,cAAcZ,KAAKC;IAEnD,MAAMa,gBAAgBX,MAAMY,KAAK,CAACC,QAAQ;IAC1C,MAAMC,gBAAgBb,MAAMY,QAAQ;IAEpC,MAAMA,eAAuDzB,gCAAAA,EAAiB2B,CAAAA;QAC5E,MAAMC,WAAWC,OAAOF,GAAGG,MAAM,CAACtB,KAAK;QACvCS,oBAAgBnB,qBAAAA,EAAM8B,UAAUnB,KAAKC;QAErC,IAAIa,iBAAiBA,kBAAkBG,eAAe;YACpDH,cAAcI;QAChB,OAAO,IAAID,eAAe;YACxBA,cAAcC,IAAI;gBAAEnB,OAAOoB;YAAS;QACtC;IACF;IAEA,MAAMG,cAAcjB,QAAQA,OAAO,IAAI,GAAIA,OAAO,MAAQJ,OAAMD,GAAAA,CAAE,CAAG,CAAC,CAAC,GAAGuB;IAC1E,MAAMC,gBAAgB;QACpB,CAAC3B,mBAAmB,EAAEM,MAAMsB,QAAQ,GAAG,SAASnB,QAAQ,QAAQ,UAAU;QAC1E,CAACV,kBAAkB,EAAE,GAAGiB,aAAa,CAAC,CAAC;QACvC,+EAA+E;QAC/E,GAAIS,gBAAgBC,aAAa;YAC/B,CAAC5B,sBAAsB,EAAE2B;QAC3B,CAAC;IACH;IAEA,aAAa;IACbnB,MAAMuB,IAAI,CAACC,KAAK,GAAG;QACjB,GAAGH,aAAa;QAChB,GAAGrB,MAAMuB,IAAI,CAACC,KAAK;IACrB;IAEA,cAAc;IACdxB,MAAMY,KAAK,CAAChB,KAAK,GAAGa;IACpBT,MAAMY,KAAK,CAACC,QAAQ,GAAGA;IAEvB,OAAOb;AACT,EAAE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-slider",
-  "version": "9.5.3",
+  "version": "9.5.5",
   "description": "Fluent UI React Slider component.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -19,20 +19,20 @@
     "@fluentui/scripts-api-extractor": "*"
   },
   "dependencies": {
-    "@fluentui/react-field": "^9.4.3",
-    "@fluentui/react-jsx-runtime": "^9.1.5",
-    "@fluentui/react-shared-contexts": "^9.24.1",
-    "@fluentui/react-tabster": "^9.26.3",
+    "@fluentui/react-field": "^9.4.5",
+    "@fluentui/react-jsx-runtime": "^9.2.0",
+    "@fluentui/react-shared-contexts": "^9.25.1",
+    "@fluentui/react-tabster": "^9.26.5",
     "@fluentui/react-theme": "^9.2.0",
-    "@fluentui/react-utilities": "^9.23.2",
+    "@fluentui/react-utilities": "^9.24.1",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1"
   },
   "peerDependencies": {
-    "@types/react": ">=16.14.0 <19.0.0",
-    "@types/react-dom": ">=16.9.0 <19.0.0",
-    "react": ">=16.14.0 <19.0.0",
-    "react-dom": ">=16.14.0 <19.0.0"
+    "@types/react": ">=16.14.0 <20.0.0",
+    "@types/react-dom": ">=16.9.0 <20.0.0",
+    "react": ">=16.14.0 <20.0.0",
+    "react-dom": ">=16.14.0 <20.0.0"
   },
   "beachball": {
     "disallowedChangeTypes": [