@fluentui/react-slider 9.0.0-beta.1 → 9.0.0-beta.12

package/lib/components/Slider/useSliderStyles.js

@@ -1,53 +1,88 @@
-import { __styles, mergeClasses } from '@fluentui/react-make-styles';
+import { shorthands, __styles, mergeClasses } from '@griffel/react';
 import { createFocusOutlineStyle } from '@fluentui/react-tabster';
-import { markClassName, markLabelClassName } from '../../utils/renderMarks';
-export var thumbClassName = 'ms-Slider-thumb';
-export var trackClassName = 'ms-Slider-track';
+import { tokens } from '@fluentui/react-theme';
+export const sliderClassNames = {
+  root: 'fui-Slider',
+  rail: 'fui-Slider__rail',
+  thumb: 'fui-Slider__thumb',
+  input: 'fui-Slider__input'
+}; // Internal CSS variables
+
+const thumbSizeVar = `--fui-Slider__thumb--size`;
+const railSizeVar = `--fui-Slider__rail--size`;
+const railColorVar = `--fui-Slider__rail--color`;
+const progressColorVar = `--fui-Slider__progress--color`;
+const thumbColorVar = `--fui-Slider__thumb--color`;
+export const sliderCSSVars = {
+  railDirectionVar: `--fui-Slider__rail--direction`,
+  railOffsetVar: `--fui-Slider__rail--offset`,
+  railProgressVar: `--fui-Slider__rail--progress`,
+  railStepsPercentVar: `--fui-Slider__rail--steps-percent`,
+  thumbPositionVar: `--fui-Slider__thumb--position`
+};
+const {
+  railDirectionVar,
+  railOffsetVar,
+  railStepsPercentVar,
+  railProgressVar,
+  thumbPositionVar
+} = sliderCSSVars;
 /**
  * Styles for the root slot
  */
 
-export var useRootStyles = /*#__PURE__*/__styles({
+const useRootStyles = /*#__PURE__*/__styles({
   "root": {
     "qhf8xq": "f10pi13n",
-    "mc9l5x": "ftuwxu6",
+    "mc9l5x": "fwk3njj",
+    "zoa1oz": "femm8af",
     "famaaq": "f1xqy1su",
     "lpbzjs": "f1sdsnyy",
-    "ha4doy": "f1qdqbpl"
+    "Bt984gj": "f122n59",
+    "B7hvi0a": "f1oiokrs"
   },
   "small": {
-    "B3548sg": "fezliaq",
-    "Bykjv5i": "ffdaq26",
-    "Cjqits": "f1eyrxsh"
+    "Bi64ftq": "f1agqo6f",
+    "Ba19x4e": "f1i7ztpd",
+    "sshi5w": "f1pha7fy"
   },
   "medium": {
-    "B3548sg": "f14visze",
-    "Bykjv5i": "f1mjpybc",
-    "Cjqits": "fnkgibb"
+    "Bi64ftq": "f1a78h9h",
+    "Ba19x4e": "fuok0yf",
+    "sshi5w": "f1nxs5xn"
   },
   "horizontal": {
     "Bf4jedk": "fyvtabn",
-    "sshi5w": "f1olaeij",
-    "Beiy3e4": "f1vx9l62"
+    "Bqenvij": "f1yfdkfd"
   },
   "vertical": {
-    "Bz10aip": "f10s8fuu",
-    "Bf4jedk": "f122cn8p",
+    "a9b677": "f174ca62",
     "sshi5w": "f1pzv1zu",
-    "Beiy3e4": "f1063pyq"
+    "Budl1dq": "f13qjosx"
   },
   "enabled": {
-    "Bceei9c": "fyjss3s",
-    "B1xli0": "fz78172",
-    "dhleuf": "f26gjsb",
-    "Bwh3duv": "foxkwyv",
-    "Bnwl0dt": "f1wwicuc",
-    "Cwr19t": "f1lmnu8a"
+    "B7wi8oa": "f4l8x3l",
+    "B250r6j": "f671q34",
+    "Bpmy4es": "fvfzmw5",
+    "Buw9y6v": "f1y2jc1c",
+    "Bq939m0": "f1rqi9z6",
+    "gjzr1t": "fzgxkov",
+    "tg7hqu": "fd6snbx",
+    "ypdvl1": "f1volkfw",
+    "Bw5jdd4": "f1xddb6",
+    "Bdjie01": "fcdikl",
+    "Bvh9j6m": "fhpzgm6",
+    "Bvsvvpo": "f1q6pm3h"
   },
   "disabled": {
-    "Bceei9c": "fdrzuqr"
+    "Bpmy4es": "foojseg",
+    "B7wi8oa": "f1lgdqhv",
+    "B250r6j": "f1veetlj",
+    "ypdvl1": "fu12m3e",
+    "Bw5jdd4": "fi9guym",
+    "Bdjie01": "fcdjl4u"
   },
-  "focusIndicator": {
+  "focusIndicatorHorizontal": {
     "B486eqv": "f2hkw1w",
     "vchsgm": "fbiesyy",
     "ozrjjd": ["fq2kn9", "f1jxwnad"],
@@ -56,7 +91,6 @@ export var useRootStyles = /*#__PURE__*/__styles({
     "B8vm7ur": "f12sql3b",
     "f4hv8x": "f1i4q40k",
     "Gpan81": "fcrbge9",
-    "z7afg": "ft464mn",
     "rsjj6t": "fskqmiq",
     "E86f5s": "f1kbdjx9",
     "f5nhos": ["fw1d893", "fpuz8dn"],
@@ -66,252 +100,135 @@ export var useRootStyles = /*#__PURE__*/__styles({
     "B8gmrwi": ["f16hf5f2", "f1qhqcal"],
     "Byq6oy9": "fyyqeim",
     "Bdy2j38": ["f1qhqcal", "f16hf5f2"],
-    "Bugh3ej": "f18xdlq9",
+    "Bi8bqab": ["f1aneyfs", "f15nmyc0"],
+    "kq6z4e": ["f15nmyc0", "f1aneyfs"],
+    "l5tc3q": ["f3cpy5b", "f13v6kgv"],
+    "d1z3ck": ["f13v6kgv", "f3cpy5b"],
     "epcuuz": "filx0we",
     "Ba33l6n": ["f1horip2", "fgnx9ah"],
     "va7z1g": "fkii2tb",
     "Bmi6mq9": ["fgnx9ah", "f1horip2"],
     "Bjkpy09": "f1n40nz3",
     "Jxg1p8": "f1iimkc5",
+    "Bc94xmo": ["felaku1", "fsrbqhn"],
+    "Bj23z95": ["fsrbqhn", "felaku1"]
+  },
+  "focusIndicatorVertical": {
+    "B486eqv": "f2hkw1w",
+    "vchsgm": "fbiesyy",
+    "ozrjjd": ["fq2kn9", "f1jxwnad"],
+    "B7lelfh": "f1il7mou",
+    "Bp3tz3o": ["f1jxwnad", "fq2kn9"],
+    "B8vm7ur": "f12sql3b",
+    "f4hv8x": "f1i4q40k",
+    "Gpan81": "fcrbge9",
+    "rsjj6t": "fskqmiq",
+    "E86f5s": "f1kbdjx9",
+    "f5nhos": ["fw1d893", "fpuz8dn"],
+    "Bhtq6h7": "f14hlsw1",
+    "Bubk9yy": ["fpuz8dn", "fw1d893"],
+    "dzajus": "f1bkt4b4",
+    "B8gmrwi": ["f16hf5f2", "f1qhqcal"],
+    "Byq6oy9": "fyyqeim",
+    "Bdy2j38": ["f1qhqcal", "f16hf5f2"],
+    "Bi8bqab": ["f1aneyfs", "f15nmyc0"],
+    "kq6z4e": ["f15nmyc0", "f1aneyfs"],
+    "l5tc3q": ["f3cpy5b", "f13v6kgv"],
+    "d1z3ck": ["f13v6kgv", "f3cpy5b"],
+    "epcuuz": "filx0we",
+    "Ba33l6n": ["f1horip2", "fgnx9ah"],
+    "va7z1g": "fkii2tb",
+    "Bmi6mq9": ["fgnx9ah", "f1horip2"],
+    "Bjkpy09": "f1e36cb5",
+    "Jxg1p8": "f1m0noy9",
     "Bc94xmo": ["ftbpds4", "f1ubgg62"],
     "Bj23z95": ["f1ubgg62", "ftbpds4"]
   }
 }, {
-  "d": [".f10pi13n{position:relative;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f1sdsnyy{touch-action:none;}", ".f1qdqbpl{vertical-align:bottom;}", ".fezliaq{--slider-thumb-size:10px;}", ".ffdaq26{--slider-rail-size:2px;}", ".f1eyrxsh{--slider-mark-size:2px;}", ".f14visze{--slider-thumb-size:20px;}", ".f1mjpybc{--slider-rail-size:4px;}", ".fnkgibb{--slider-mark-size:4px;}", ".fyvtabn{min-width:120px;}", ".f1olaeij{min-height:var(--slider-thumb-size);}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f10s8fuu{-webkit-transform:scaleY(-1);-moz-transform:scaleY(-1);-ms-transform:scaleY(-1);transform:scaleY(-1);}", ".f122cn8p{min-width:var(--slider-thumb-size);}", ".f1pzv1zu{min-height:120px;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fyjss3s{cursor:-webkit-grab;cursor:grab;}", ".fdrzuqr{cursor:not-allowed;}", "[data-keyboard-nav] .fbiesyy:focus-within{border-top-color:transparent;}", "[data-keyboard-nav] .fq2kn9:focus-within{border-right-color:transparent;}", "[data-keyboard-nav] .f1jxwnad:focus-within{border-left-color:transparent;}", "[data-keyboard-nav] .f1il7mou:focus-within{border-bottom-color:transparent;}", "[data-keyboard-nav] .f12sql3b:focus-within:after{content:\"\";}", "[data-keyboard-nav] .f1i4q40k:focus-within:after{position:absolute;}", "[data-keyboard-nav] .fcrbge9:focus-within:after{pointer-events:none;}", "[data-keyboard-nav] .ft464mn:focus-within:after{box-sizing:outline-box;}", "[data-keyboard-nav] .fskqmiq:focus-within:after{z-index:1;}", "[data-keyboard-nav] .f1kbdjx9:focus-within:after{border-top-style:solid;}", "[data-keyboard-nav] .fw1d893:focus-within:after{border-right-style:solid;}", "[data-keyboard-nav] .fpuz8dn:focus-within:after{border-left-style:solid;}", "[data-keyboard-nav] .f14hlsw1:focus-within:after{border-bottom-style:solid;}", "[data-keyboard-nav] .f1bkt4b4:focus-within:after{border-top-width:2px;}", "[data-keyboard-nav] .f16hf5f2:focus-within:after{border-right-width:2px;}", "[data-keyboard-nav] .f1qhqcal:focus-within:after{border-left-width:2px;}", "[data-keyboard-nav] .fyyqeim:focus-within:after{border-bottom-width:2px;}", "[data-keyboard-nav] .f18xdlq9:focus-within:after{border-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .filx0we:focus-within:after{border-top-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1horip2:focus-within:after{border-right-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .fgnx9ah:focus-within:after{border-left-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .fkii2tb:focus-within:after{border-bottom-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1n40nz3:focus-within:after{top:calc(0px - 2px - 6px);}", "[data-keyboard-nav] .f1iimkc5:focus-within:after{bottom:calc(0px - 2px - 6px);}", "[data-keyboard-nav] .ftbpds4:focus-within:after{left:calc(0px - 2px - 6px);}", "[data-keyboard-nav] .f1ubgg62:focus-within:after{right:calc(0px - 2px - 6px);}"],
-  "h": [".fz78172:hover .ms-Slider-thumb{background:var(--colorBrandBackgroundHover);}", ".f26gjsb:hover .ms-Slider-track{background:var(--colorBrandBackgroundHover);}"],
-  "a": [".foxkwyv:active{cursor:-webkit-grabbing;cursor:grabbing;}", ".f1wwicuc:active .ms-Slider-thumb{background:var(--colorBrandBackgroundPressed);}", ".f1lmnu8a:active .ms-Slider-track{background:var(--colorBrandBackgroundPressed);}"],
+  "d": [".f10pi13n{position:relative;}", ".fwk3njj{display:inline-grid;}", ".femm8af{grid-template-areas:\"slider\";}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f1sdsnyy{touch-action:none;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1oiokrs{justify-items:center;}", ".f1agqo6f{--fui-Slider__thumb--size:16px;}", ".f1i7ztpd{--fui-Slider__rail--size:2px;}", ".f1pha7fy{min-height:24px;}", ".f1a78h9h{--fui-Slider__thumb--size:20px;}", ".fuok0yf{--fui-Slider__rail--size:4px;}", ".f1nxs5xn{min-height:32px;}", ".fyvtabn{min-width:120px;}", ".f1yfdkfd{height:var(--fui-Slider__thumb--size);}", ".f174ca62{width:var(--fui-Slider__thumb--size);}", ".f1pzv1zu{min-height:120px;}", ".f13qjosx{grid-template-columns:var(--fui-Slider__thumb--size);}", ".f4l8x3l{--fui-Slider__rail--color:var(--colorNeutralStrokeAccessible);}", ".f671q34{--fui-Slider__progress--color:var(--colorCompoundBrandBackground);}", ".fvfzmw5{--fui-Slider__thumb--color:var(--colorCompoundBrandBackground);}", ".foojseg{--fui-Slider__thumb--color:var(--colorNeutralForegroundDisabled);}", ".f1lgdqhv{--fui-Slider__rail--color:var(--colorNeutralBackgroundDisabled);}", ".f1veetlj{--fui-Slider__progress--color:var(--colorNeutralForegroundDisabled);}", "[data-keyboard-nav] .fbiesyy:focus-within{border-top-color:transparent;}", "[data-keyboard-nav] .fq2kn9:focus-within{border-right-color:transparent;}", "[data-keyboard-nav] .f1jxwnad:focus-within{border-left-color:transparent;}", "[data-keyboard-nav] .f1il7mou:focus-within{border-bottom-color:transparent;}", "[data-keyboard-nav] .f12sql3b:focus-within:after{content:\"\";}", "[data-keyboard-nav] .f1i4q40k:focus-within:after{position:absolute;}", "[data-keyboard-nav] .fcrbge9:focus-within:after{pointer-events:none;}", "[data-keyboard-nav] .fskqmiq:focus-within:after{z-index:1;}", "[data-keyboard-nav] .f1kbdjx9:focus-within:after{border-top-style:solid;}", "[data-keyboard-nav] .fw1d893:focus-within:after{border-right-style:solid;}", "[data-keyboard-nav] .fpuz8dn:focus-within:after{border-left-style:solid;}", "[data-keyboard-nav] .f14hlsw1:focus-within:after{border-bottom-style:solid;}", "[data-keyboard-nav] .f1bkt4b4:focus-within:after{border-top-width:2px;}", "[data-keyboard-nav] .f16hf5f2:focus-within:after{border-right-width:2px;}", "[data-keyboard-nav] .f1qhqcal:focus-within:after{border-left-width:2px;}", "[data-keyboard-nav] .fyyqeim:focus-within:after{border-bottom-width:2px;}", "[data-keyboard-nav] .f1aneyfs:focus-within:after{border-bottom-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f15nmyc0:focus-within:after{border-bottom-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f3cpy5b:focus-within:after{border-top-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f13v6kgv:focus-within:after{border-top-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .filx0we:focus-within:after{border-top-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1horip2:focus-within:after{border-right-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .fgnx9ah:focus-within:after{border-left-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .fkii2tb:focus-within:after{border-bottom-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1n40nz3:focus-within:after{top:calc(0px - 2px - 6px);}", "[data-keyboard-nav] .f1iimkc5:focus-within:after{bottom:calc(0px - 2px - 6px);}", "[data-keyboard-nav] .felaku1:focus-within:after{left:calc(0px - 2px - 10px);}", "[data-keyboard-nav] .fsrbqhn:focus-within:after{right:calc(0px - 2px - 10px);}", "[data-keyboard-nav] .f1e36cb5:focus-within:after{top:calc(0px - 2px - 10px);}", "[data-keyboard-nav] .f1m0noy9:focus-within:after{bottom:calc(0px - 2px - 10px);}", "[data-keyboard-nav] .ftbpds4:focus-within:after{left:calc(0px - 2px - 6px);}", "[data-keyboard-nav] .f1ubgg62:focus-within:after{right:calc(0px - 2px - 6px);}"],
+  "h": [".f1y2jc1c:hover{--fui-Slider__thumb--color:var(--colorBrandBackgroundHover);}", ".f1rqi9z6:hover{--fui-Slider__progress--color:var(--colorBrandBackgroundHover);}"],
+  "a": [".fzgxkov:active{--fui-Slider__thumb--color:var(--colorBrandBackgroundPressed);}", ".fd6snbx:active{--fui-Slider__progress--color:var(--colorBrandBackgroundPressed);}"],
+  "t": ["@media (forced-colors: active){.f1volkfw{--fui-Slider__rail--color:CanvasText;}}", "@media (forced-colors: active){.f1xddb6{--fui-Slider__thumb--color:Highlight;}}", "@media (forced-colors: active){.fcdikl{--fui-Slider__progress--color:Highlight;}}", "@media (forced-colors: active){.fhpzgm6:hover{--fui-Slider__thumb--color:Highlight;}}", "@media (forced-colors: active){.f1q6pm3h:hover{--fui-Slider__progress--color:Highlight;}}", "@media (forced-colors: active){.fu12m3e{--fui-Slider__rail--color:GrayText;}}", "@media (forced-colors: active){.fi9guym{--fui-Slider__thumb--color:GrayText;}}", "@media (forced-colors: active){.fcdjl4u{--fui-Slider__progress--color:GrayText;}}"],
   "i": [".f2hkw1w:focus-visible{outline-style:none;}"]
 });
-/**
- * Styles for the slider wrapper slot
- */
-
-export var useSliderWrapper = /*#__PURE__*/__styles({
-  "sliderWrapper": {
-    "qhf8xq": "f1euv43f",
-    "Bpg54ce": "f1a3p1vp"
-  },
-  "horizontal": {
-    "oyh7mz": ["f1xynx9j", "f10k790i"],
-    "j35jbq": ["f10k790i", "f1xynx9j"],
-    "Bhzewxz": "f113wtx2",
-    "sshi5w": "f1olaeij"
-  },
-  "vertical": {
-    "Bhzewxz": "f113wtx2",
-    "B5kzvoi": "f5gq2j6",
-    "oyh7mz": ["f1xynx9j", "f10k790i"],
-    "Bf4jedk": "f122cn8p"
-  }
-}, {
-  "d": [".f1euv43f{position:absolute;}", ".f1a3p1vp{overflow:hidden;}", ".f1xynx9j{left:0px;}", ".f10k790i{right:0px;}", ".f113wtx2{top:0px;}", ".f1olaeij{min-height:var(--slider-thumb-size);}", ".f5gq2j6{bottom:0px;}", ".f122cn8p{min-width:var(--slider-thumb-size);}"]
-});
 /**
  * Styles for the rail slot
  */
 
-export var useRailStyles = /*#__PURE__*/__styles({
-  "rail": {
-    "qhf8xq": "f1euv43f",
-    "Dimara": "f1kijzfu",
-    "B7ck84d": "f1ewtqcl",
-    "Bkecrkj": "f1aehjj5"
-  },
-  "enabled": {
-    "ayd6f0": "f13w6gvh"
-  },
-  "disabled": {
-    "ayd6f0": "fqst6tg",
-    "B4j52fo": "f5ogflp",
-    "Bekrc4i": ["f1hqa2wf", "finvdd3"],
-    "Bn0qgzm": "f1f09k3d",
-    "ibv6hh": ["finvdd3", "f1hqa2wf"],
-    "icvyot": "fzkkow9",
-    "vrafjx": ["fcdblym", "fjik90z"],
-    "oivjwe": "fg706s2",
-    "wvpqe5": ["fjik90z", "fcdblym"],
-    "g2u3we": "fgig46g",
-    "h3c5rm": ["f1mxt3zg", "fziff3p"],
-    "B9xav0g": "f250w3l",
-    "zhjwy3": ["fziff3p", "f1mxt3zg"]
-  },
-  "horizontal": {
-    "Bqenvij": "f13x1cbn",
-    "Bhzewxz": "f1i1t8d1",
-    "oyh7mz": ["f17ri56s", "f5adsh4"],
-    "j35jbq": ["f5adsh4", "f17ri56s"],
-    "Bz10aip": "f188r07x"
-  },
-  "vertical": {
-    "a9b677": "ff6wpp7",
-    "oyh7mz": ["f1ktbn1t", "ffenbu1"],
-    "Bhzewxz": "f1qlmq25",
-    "B5kzvoi": "fn8l3ew",
-    "Bz10aip": ["f13gfj74", "f1nfknbn"]
-  }
-}, {
-  "d": [".f1euv43f{position:absolute;}", ".f1kijzfu{border-radius:var(--borderRadiusXLarge);}", ".f1ewtqcl{box-sizing:border-box;}", ".f1aehjj5{pointer-events:none;}", ".f13w6gvh{background:var(--colorNeutralStrokeAccessible);}", ".fqst6tg{background:var(--colorNeutralBackgroundDisabled);}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".fgig46g{border-top-color:var(--colorTransparentStrokeDisabled);}", ".f1mxt3zg{border-right-color:var(--colorTransparentStrokeDisabled);}", ".fziff3p{border-left-color:var(--colorTransparentStrokeDisabled);}", ".f250w3l{border-bottom-color:var(--colorTransparentStrokeDisabled);}", ".f13x1cbn{height:var(--slider-rail-size);}", ".f1i1t8d1{top:50%;}", ".f17ri56s{left:calc(var(--slider-thumb-size) * .5);}", ".f5adsh4{right:calc(var(--slider-thumb-size) * .5);}", ".f188r07x{-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}", ".ff6wpp7{width:var(--slider-rail-size);}", ".f1ktbn1t{left:50%;}", ".ffenbu1{right:50%;}", ".f1qlmq25{top:calc(var(--slider-thumb-size) * .5);}", ".fn8l3ew{bottom:calc(var(--slider-thumb-size) * .5);}", ".f13gfj74{-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);}", ".f1nfknbn{-webkit-transform:translateX(50%);-moz-transform:translateX(50%);-ms-transform:translateX(50%);transform:translateX(50%);}"]
-});
-/**
- * Styles for the trackWrapper slot
- */
-
-export var useTrackWrapperStyles = /*#__PURE__*/__styles({
-  "trackWrapper": {
-    "qhf8xq": "f1euv43f"
-  },
-  "horizontal": {
-    "Bhzewxz": "f1i1t8d1",
-    "oyh7mz": ["f17ri56s", "f5adsh4"],
-    "j35jbq": ["f5adsh4", "f17ri56s"]
-  },
-  "vertical": {
-    "oyh7mz": ["f1ktbn1t", "ffenbu1"],
-    "Bhzewxz": "f1qlmq25",
-    "B5kzvoi": "fn8l3ew"
-  }
-}, {
-  "d": [".f1euv43f{position:absolute;}", ".f1i1t8d1{top:50%;}", ".f17ri56s{left:calc(var(--slider-thumb-size) * .5);}", ".f5adsh4{right:calc(var(--slider-thumb-size) * .5);}", ".f1ktbn1t{left:50%;}", ".ffenbu1{right:50%;}", ".f1qlmq25{top:calc(var(--slider-thumb-size) * .5);}", ".fn8l3ew{bottom:calc(var(--slider-thumb-size) * .5);}"]
-});
-/**
- * Styles for the track slot
- */
-
-export var useTrackStyles = /*#__PURE__*/__styles({
-  "track": {
-    "qhf8xq": "f1euv43f",
-    "Dimara": "f1kijzfu"
-  },
-  "horizontal": {
-    "Bqenvij": "f13x1cbn",
-    "Bhzewxz": "f1i1t8d1",
-    "Bz10aip": "f188r07x",
-    "Bf4jedk": "f1c3g9yl"
-  },
-  "vertical": {
-    "a9b677": "ff6wpp7",
-    "oyh7mz": ["f1ktbn1t", "ffenbu1"],
-    "Bz10aip": ["f13gfj74", "f1nfknbn"],
-    "sshi5w": "f1fo7fp3"
-  },
-  "enabled": {
-    "ayd6f0": "f1nw8quw"
-  },
-  "disabled": {
-    "ayd6f0": "f1b7gbxm"
-  }
-}, {
-  "d": [".f1euv43f{position:absolute;}", ".f1kijzfu{border-radius:var(--borderRadiusXLarge);}", ".f13x1cbn{height:var(--slider-rail-size);}", ".f1i1t8d1{top:50%;}", ".f188r07x{-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}", ".f1c3g9yl{min-width:calc(var(--slider-thumb-size) / 4);}", ".ff6wpp7{width:var(--slider-rail-size);}", ".f1ktbn1t{left:50%;}", ".ffenbu1{right:50%;}", ".f13gfj74{-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);}", ".f1nfknbn{-webkit-transform:translateX(50%);-moz-transform:translateX(50%);-ms-transform:translateX(50%);transform:translateX(50%);}", ".f1fo7fp3{min-height:calc(var(--slider-thumb-size) / 4);}", ".f1nw8quw{background:var(--colorCompoundBrandBackground);}", ".f1b7gbxm{background:var(--colorNeutralForegroundDisabled);}"]
-});
-/**
- * Styles for the mark slot
- */
 
-export var useMarksWrapperStyles = /*#__PURE__*/__styles({
-  "marksWrapper": {
+const useRailStyles = /*#__PURE__*/__styles({
+  "rail": {
+    "Bbmb7ep": ["fnivh3a", "fc7yr5o"],
+    "Beyfa6y": ["fc7yr5o", "fnivh3a"],
+    "B7oj6ja": ["f1el4m67", "f8yange"],
+    "Btl43ni": ["f8yange", "f1el4m67"],
+    "Bkecrkj": "f1aehjj5",
+    "Ijaq50": "fy0oii6",
+    "nk6f5a": "f11g2wli",
+    "Br312pm": "f1xewaeb",
+    "Bw0ie65": "f1xmzt6x",
     "qhf8xq": "f10pi13n",
-    "mc9l5x": "f13qh94s",
-    "oeaueh": "f1s6fcnf",
-    "Bj3rh1h": "f19g0ac",
-    "Huce71": "fz5stix",
-    "qjn08v": "fe51qsx",
-    "Dzkm3e": "fk8u71e",
-    "Bvn1irg": ["f1wthhr4", "f1d202ui"],
-    "Bxn464x": "f1snms3",
-    "D4mh7z": ["f1d202ui", "f1wthhr4"],
-    "B06ths6": "fh78mse",
-    "gq0jlx": "fs0yg8e"
+    "Bvjb7m6": "fdgv6k0",
+    "Bcmaq0h": "f1gvmols",
+    "Bpd4iqm": "fpvhumw",
+    "oeaueh": "f1yog68k",
+    "Bw0xxkn": "f13sgyd8",
+    "rurcny": "f99sooz",
+    "xx9plb": "fxf9f1y",
+    "Baov28r": "f1ijinm9"
   },
   "horizontal": {
-    "B6of3ja": "f1getc55",
-    "Frg6f3": ["f4by7tm", "fnwkpdo"],
-    "t21cq0": ["fnwkpdo", "f4by7tm"],
-    "B7hvi0a": "f1tll2w5",
-    "Bkwhype": "f1qlrpgw",
-    "B97nqz7": "f11ktvba",
-    "Bsg3t3j": ["f1m1v5z7", "f1lr6p2y"],
-    "B50pfp": "fjsj4y9",
-    "Boh7i5f": "f1xlzaod",
-    "Bp45g2b": "f16nv3ql",
-    "Dzkm3e": "fpa39xa",
-    "udwtkr": "f1m0auqq",
-    "B3y1242": "fud94rg"
+    "a9b677": "fly5x3f",
+    "Bqenvij": "f1cy86ho",
+    "Byque4d": ["f1oqflmk", "fimcj7z"],
+    "qd6xl9": ["fimcj7z", "f1oqflmk"],
+    "Bbc2r3f": "fq8vbpg"
   },
   "vertical": {
-    "B6of3ja": "f1bhkots",
-    "jrapky": "f1vpp3yt",
-    "Frg6f3": ["f1ntvhyj", "f1ndstmz"],
-    "B7hvi0a": "f1m2n5bn",
-    "Bkwhype": "f1qlrpgw",
-    "B97nqz7": "fuunrxi",
-    "Bsg3t3j": "fbs4s9x",
-    "B50pfp": "fjsj4y9",
-    "Bkaruud": "fvdh4kd",
-    "Buoqfts": "f1gn9ffd",
-    "D4mh7z": ["fdriob5", "f1ueeewd"],
-    "Hvt40t": "f1fyyy5g",
-    "udwtkr": "f1lf95u4",
-    "B3y1242": "f1f7wb78"
-  },
-  "disabled": {
-    "Bp45g2b": "fgxxtfo"
+    "a9b677": "fqxfnkd",
+    "Bqenvij": "f1l02sjl",
+    "Bdn98qo": "f61axi9",
+    "Bf8kmfk": "f1p8196g",
+    "Bj2wrql": "f1t2u064"
   }
 }, {
-  "d": [".f10pi13n{position:relative;}", ".f13qh94s{display:grid;}", ".f1s6fcnf{outline-style:none;}", ".f19g0ac{z-index:1;}", ".fz5stix{white-space:nowrap;}", ".fe51qsx .ms-Slider-mark{background:var(--colorNeutralBackground1);}", ".fk8u71e .ms-Slider-label{padding-top:2px;}", ".f1wthhr4 .ms-Slider-label{padding-right:2px;}", ".f1d202ui .ms-Slider-label{padding-left:2px;}", ".f1snms3 .ms-Slider-label{padding-bottom:2px;}", ".fh78mse .ms-Slider-label{font-size:12px;}", ".fs0yg8e .ms-Slider-firstMark,.ms-Slider-lastMark{opacity:0;}", ".f1getc55{margin-top:calc(var(--slider-rail-size) + var(--slider-mark-size));}", ".f4by7tm{margin-left:calc(var(--slider-thumb-size) / 2);}", ".fnwkpdo{margin-right:calc(var(--slider-thumb-size) / 2);}", ".f1tll2w5{justify-items:end;}", ".f1qlrpgw .ms-Slider-markItemContainer{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f11ktvba .ms-Slider-markItemContainer{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f1m1v5z7 .ms-Slider-markItemContainer{-webkit-transform:translateX(50%);-moz-transform:translateX(50%);-ms-transform:translateX(50%);transform:translateX(50%);}", ".f1lr6p2y .ms-Slider-markItemContainer{-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);}", ".fjsj4y9 .ms-Slider-markItemContainer{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1xlzaod .ms-Slider-label{font-family:var(--fontFamilyBase);}", ".f16nv3ql .ms-Slider-label{color:var(--colorNeutralForeground1);}", ".fpa39xa .ms-Slider-label{padding-top:calc(var(--slider-thumb-size) /2 );}", ".f1m0auqq .ms-Slider-mark{height:4px;}", ".fud94rg .ms-Slider-mark{width:1px;}", ".f1bhkots{margin-top:calc(var(--slider-thumb-size) / 2);}", ".f1vpp3yt{margin-bottom:calc(var(--slider-thumb-size) / 2);}", ".f1ntvhyj{margin-left:calc(var(--slider-rail-size) + var(--slider-mark-size));}", ".f1ndstmz{margin-right:calc(var(--slider-rail-size) + var(--slider-mark-size));}", ".f1m2n5bn{justify-items:start;}", ".fuunrxi .ms-Slider-markItemContainer{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fbs4s9x .ms-Slider-markItemContainer{-webkit-transform:translateY(50%);-moz-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%);}", ".fvdh4kd .ms-Slider-markItemContainer{max-width:100%;}", ".f1gn9ffd .ms-Slider-markItemContainer{max-height:100%;}", ".fdriob5 .ms-Slider-label{padding-left:calc(var(--slider-thumb-size) /2 );}", ".f1ueeewd .ms-Slider-label{padding-right:calc(var(--slider-thumb-size) /2 );}", ".f1fyyy5g .ms-Slider-label{-webkit-transform:scaleY(-1);-moz-transform:scaleY(-1);-ms-transform:scaleY(-1);transform:scaleY(-1);}", ".f1lf95u4 .ms-Slider-mark{height:1px;}", ".f1f7wb78 .ms-Slider-mark{width:var(--slider-mark-size);}", ".fgxxtfo .ms-Slider-label{color:var(--colorNeutralForegroundDisabled);}"]
+  "d": [".fnivh3a{border-bottom-right-radius:var(--borderRadiusXLarge);}", ".fc7yr5o{border-bottom-left-radius:var(--borderRadiusXLarge);}", ".f1el4m67{border-top-right-radius:var(--borderRadiusXLarge);}", ".f8yange{border-top-left-radius:var(--borderRadiusXLarge);}", ".f1aehjj5{pointer-events:none;}", ".fy0oii6{grid-row-start:slider;}", ".f11g2wli{grid-row-end:slider;}", ".f1xewaeb{grid-column-start:slider;}", ".f1xmzt6x{grid-column-end:slider;}", ".f10pi13n{position:relative;}", ".fdgv6k0{forced-color-adjust:none;}", ".f1gvmols{background-image:linear-gradient(\n      var(--fui-Slider__rail--direction),\n      var(--fui-Slider__rail--color) 0%,\n      var(--fui-Slider__rail--color) var(--fui-Slider__rail--offset),\n      var(--fui-Slider__progress--color) var(--fui-Slider__rail--offset),\n      var(--fui-Slider__progress--color) calc(var(--fui-Slider__rail--offset) + var(--fui-Slider__rail--progress)),\n      var(--fui-Slider__rail--color) calc(var(--fui-Slider__rail--offset) + var(--fui-Slider__rail--progress))\n    );}", ".fpvhumw{outline-width:1px;}", ".f1yog68k{outline-style:solid;}", ".f13sgyd8{outline-color:var(--colorTransparentStroke);}", ".f99sooz:before{content:'';}", ".fxf9f1y:before{position:absolute;}", ".f1ijinm9:before{background-image:repeating-linear-gradient(\n        var(--fui-Slider__rail--direction),\n        #0000 0%,\n        #0000 calc(var(--fui-Slider__rail--steps-percent) - 1px),\n        var(--colorNeutralBackground1) calc(var(--fui-Slider__rail--steps-percent) - 1px),\n        var(--colorNeutralBackground1) var(--fui-Slider__rail--steps-percent)\n      );}", ".fly5x3f{width:100%;}", ".f1cy86ho{height:var(--fui-Slider__rail--size);}", ".f1oqflmk:before{left:-1px;}", ".fimcj7z:before{right:-1px;}", ".fq8vbpg:before{height:var(--fui-Slider__rail--size);}", ".fqxfnkd{width:var(--fui-Slider__rail--size);}", ".f1l02sjl{height:100%;}", ".f61axi9:before{width:var(--fui-Slider__rail--size);}", ".f1p8196g:before{top:-1px;}", ".f1t2u064:before{bottom:1px;}"]
 });
 /**
  * Styles for the thumb slot
  */
 
-export var useThumbWrapperStyles = /*#__PURE__*/__styles({
-  "thumbWrapper": {
-    "qhf8xq": "f1euv43f",
-    "oeaueh": "f1s6fcnf",
-    "Bj3rh1h": "fj25m7a"
-  },
-  "horizontal": {
-    "oyh7mz": ["fyfbjwq", "f12c551u"],
-    "j35jbq": ["f12c551u", "fyfbjwq"],
-    "Bhzewxz": "f1i1t8d1"
-  },
-  "vertical": {
-    "Bhzewxz": "fnclzxa",
-    "B5kzvoi": "f19bk6m6",
-    "oyh7mz": ["f1ktbn1t", "ffenbu1"]
-  }
-}, {
-  "d": [".f1euv43f{position:absolute;}", ".f1s6fcnf{outline-style:none;}", ".fj25m7a{z-index:2;}", ".fyfbjwq{left:calc(var(--slider-thumb-size) / 2);}", ".f12c551u{right:calc(var(--slider-thumb-size) / 2);}", ".f1i1t8d1{top:50%;}", ".fnclzxa{top:calc(var(--slider-thumb-size) / 2);}", ".f19bk6m6{bottom:calc(var(--slider-thumb-size) / 2);}", ".f1ktbn1t{left:50%;}", ".ffenbu1{right:50%;}"]
-});
-/**
- * Styles for the thumb slot
- */
 
-export var useThumbStyles = /*#__PURE__*/__styles({
+const useThumbStyles = /*#__PURE__*/__styles({
   "thumb": {
     "qhf8xq": "f1euv43f",
-    "a9b677": "fixoap3",
-    "Bqenvij": "f1dp2j6p",
-    "Bhzewxz": "f113wtx2",
-    "oyh7mz": ["f1xynx9j", "f10k790i"],
-    "B5kzvoi": "f5gq2j6",
-    "j35jbq": ["f10k790i", "f1xynx9j"],
+    "a9b677": "f174ca62",
+    "Bqenvij": "f1yfdkfd",
+    "Bkecrkj": "f1aehjj5",
     "oeaueh": "f1s6fcnf",
-    "Dimara": "f44lkw9",
-    "B7ck84d": "f1ewtqcl",
-    "E5pizo": "fbqv283",
-    "Bz10aip": ["foouk8k", "fd9rb4b"],
+    "Bvjb7m6": "fdgv6k0",
+    "Bbmb7ep": ["f8fbkgy", "f1nfllo7"],
+    "Beyfa6y": ["f1nfllo7", "f8fbkgy"],
+    "B7oj6ja": ["f1djnp8u", "f1s8kh49"],
+    "Btl43ni": ["f1s8kh49", "f1djnp8u"],
+    "E5pizo": "fof7hq0",
+    "De3pzq": "foksa45",
+    "Bz10aip": ["f13gfj74", "f1nfknbn"],
     "xx9plb": "fxf9f1y",
     "Bf8kmfk": "frdto5n",
     "Byque4d": ["f8g0ba1", "ff0gctb"],
     "Bj2wrql": "f3zr33r",
     "qd6xl9": ["ff0gctb", "f8g0ba1"],
-    "zf3lio": "fmrqcwg",
+    "px8gyy": ["fu724ry", "f1ufhb3r"],
+    "B5c9fhp": ["f1ufhb3r", "fu724ry"],
+    "Bhe99jt": ["fiow2ne", "f13lz1i8"],
+    "B2r1szc": ["f13lz1i8", "fiow2ne"],
     "Bmqnesq": "f170vdtw",
     "rurcny": "f99sooz",
-    "dj0dih": "fqxb0lw",
-    "D4ky5z": ["f169ywak", "f3otfn0"],
-    "k1i1uq": "f1975idk",
-    "Bcasopp": ["f3otfn0", "f169ywak"],
+    "dj0dih": "f1i9s981",
+    "D4ky5z": ["fqfd43n", "fgpokn8"],
+    "k1i1uq": "f19s890",
+    "Bcasopp": ["fgpokn8", "fqfd43n"],
     "Bdixowu": "f1bwkb58",
     "cqycoz": ["fiio4mc", "fc8z0qo"],
     "Epwjcz": "f1m5ya7j",
@@ -321,15 +238,11 @@ export var useThumbStyles = /*#__PURE__*/__styles({
     "Bp1vogq": "f1k9rjtw",
     "Bohd3ja": ["f2jll41", "f1yx8xct"]
   },
-  "enabled": {
-    "ayd6f0": "f1nw8quw"
-  },
   "disabled": {
-    "ayd6f0": "f1b7gbxm",
-    "dj0dih": "fqxb0lw",
-    "D4ky5z": ["f169ywak", "f3otfn0"],
-    "k1i1uq": "f1975idk",
-    "Bcasopp": ["f3otfn0", "f169ywak"],
+    "dj0dih": "f1i9s981",
+    "D4ky5z": ["fqfd43n", "fgpokn8"],
+    "k1i1uq": "f19s890",
+    "Bcasopp": ["fgpokn8", "fqfd43n"],
     "Bdixowu": "f1bwkb58",
     "cqycoz": ["fiio4mc", "fc8z0qo"],
     "Epwjcz": "f1m5ya7j",
@@ -340,38 +253,27 @@ export var useThumbStyles = /*#__PURE__*/__styles({
     "Bohd3ja": ["f16ep8jm", "f1yueqd5"]
   },
   "horizontal": {
-    "Bhzewxz": "f1i1t8d1"
-  }
-}, {
-  "d": [".f1euv43f{position:absolute;}", ".fixoap3{width:var(--slider-thumb-size);}", ".f1dp2j6p{height:var(--slider-thumb-size);}", ".f113wtx2{top:0px;}", ".f1xynx9j{left:0px;}", ".f10k790i{right:0px;}", ".f5gq2j6{bottom:0px;}", ".f1s6fcnf{outline-style:none;}", ".f44lkw9{border-radius:var(--borderRadiusCircular);}", ".f1ewtqcl{box-sizing:border-box;}", ".fbqv283{box-shadow:0 0 0 calc(var(--slider-thumb-size) * .2) var(--colorNeutralBackground1) inset;}", ".foouk8k{-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}", ".fd9rb4b{-webkit-transform:translate(50%, -50%);-moz-transform:translate(50%, -50%);-ms-transform:translate(50%, -50%);transform:translate(50%, -50%);}", ".fxf9f1y:before{position:absolute;}", ".frdto5n:before{top:0px;}", ".f8g0ba1:before{left:0px;}", ".ff0gctb:before{right:0px;}", ".f3zr33r:before{bottom:0px;}", ".fmrqcwg:before{border-radius:var(--borderRadiusCircular);}", ".f170vdtw:before{box-sizing:border-box;}", ".f99sooz:before{content:'';}", ".fqxb0lw:before{border-top-width:calc(var(--slider-thumb-size) * .05);}", ".f169ywak:before{border-right-width:calc(var(--slider-thumb-size) * .05);}", ".f3otfn0:before{border-left-width:calc(var(--slider-thumb-size) * .05);}", ".f1975idk:before{border-bottom-width:calc(var(--slider-thumb-size) * .05);}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".fkxqtrn:before{border-top-color:var(--colorNeutralStroke1);}", ".f1yx8xct:before{border-right-color:var(--colorNeutralStroke1);}", ".f2jll41:before{border-left-color:var(--colorNeutralStroke1);}", ".f1k9rjtw:before{border-bottom-color:var(--colorNeutralStroke1);}", ".f1nw8quw{background:var(--colorCompoundBrandBackground);}", ".f1b7gbxm{background:var(--colorNeutralForegroundDisabled);}", ".f1k21dld:before{border-top-color:var(--colorNeutralForegroundDisabled);}", ".f1yueqd5:before{border-right-color:var(--colorNeutralForegroundDisabled);}", ".f16ep8jm:before{border-left-color:var(--colorNeutralForegroundDisabled);}", ".flh92r5:before{border-bottom-color:var(--colorNeutralForegroundDisabled);}", ".f1i1t8d1{top:50%;}"]
-});
-/**
- * Styles for the activeRail slot
- */
-
-export var useActiveRailStyles = /*#__PURE__*/__styles({
-  "activeRail": {
-    "qhf8xq": "f1euv43f"
-  },
-  "horizontal": {
-    "oyh7mz": ["fyfbjwq", "f12c551u"],
-    "j35jbq": ["f12c551u", "fyfbjwq"]
+    "oyh7mz": ["foa2ioz", "fjmilum"]
   },
   "vertical": {
-    "Bhzewxz": "fnclzxa",
-    "B5kzvoi": "f19bk6m6"
+    "Bz10aip": "f5cv5a3",
+    "B5kzvoi": "f1k2fpdo"
   }
 }, {
-  "d": [".f1euv43f{position:absolute;}", ".fyfbjwq{left:calc(var(--slider-thumb-size) / 2);}", ".f12c551u{right:calc(var(--slider-thumb-size) / 2);}", ".fnclzxa{top:calc(var(--slider-thumb-size) / 2);}", ".f19bk6m6{bottom:calc(var(--slider-thumb-size) / 2);}"]
+  "d": [".f1euv43f{position:absolute;}", ".f174ca62{width:var(--fui-Slider__thumb--size);}", ".f1yfdkfd{height:var(--fui-Slider__thumb--size);}", ".f1aehjj5{pointer-events:none;}", ".f1s6fcnf{outline-style:none;}", ".fdgv6k0{forced-color-adjust:none;}", ".f8fbkgy{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1nfllo7{border-bottom-left-radius:var(--borderRadiusCircular);}", ".f1djnp8u{border-top-right-radius:var(--borderRadiusCircular);}", ".f1s8kh49{border-top-left-radius:var(--borderRadiusCircular);}", ".fof7hq0{box-shadow:0 0 0 calc(var(--fui-Slider__thumb--size) * .2) var(--colorNeutralBackground1) inset;}", ".foksa45{background-color:var(--fui-Slider__thumb--color);}", ".f13gfj74{-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);}", ".f1nfknbn{-webkit-transform:translateX(50%);-moz-transform:translateX(50%);-ms-transform:translateX(50%);transform:translateX(50%);}", ".fxf9f1y:before{position:absolute;}", ".frdto5n:before{top:0px;}", ".f8g0ba1:before{left:0px;}", ".ff0gctb:before{right:0px;}", ".f3zr33r:before{bottom:0px;}", ".fu724ry:before{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1ufhb3r:before{border-bottom-left-radius:var(--borderRadiusCircular);}", ".fiow2ne:before{border-top-right-radius:var(--borderRadiusCircular);}", ".f13lz1i8:before{border-top-left-radius:var(--borderRadiusCircular);}", ".f170vdtw:before{box-sizing:border-box;}", ".f99sooz:before{content:'';}", ".f1i9s981:before{border-top-width:calc(var(--fui-Slider__thumb--size) * .05);}", ".fqfd43n:before{border-right-width:calc(var(--fui-Slider__thumb--size) * .05);}", ".fgpokn8:before{border-left-width:calc(var(--fui-Slider__thumb--size) * .05);}", ".f19s890:before{border-bottom-width:calc(var(--fui-Slider__thumb--size) * .05);}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".fkxqtrn:before{border-top-color:var(--colorNeutralStroke1);}", ".f1yx8xct:before{border-right-color:var(--colorNeutralStroke1);}", ".f2jll41:before{border-left-color:var(--colorNeutralStroke1);}", ".f1k9rjtw:before{border-bottom-color:var(--colorNeutralStroke1);}", ".f1k21dld:before{border-top-color:var(--colorNeutralForegroundDisabled);}", ".f1yueqd5:before{border-right-color:var(--colorNeutralForegroundDisabled);}", ".f16ep8jm:before{border-left-color:var(--colorNeutralForegroundDisabled);}", ".flh92r5:before{border-bottom-color:var(--colorNeutralForegroundDisabled);}", ".foa2ioz{left:var(--fui-Slider__thumb--position);}", ".fjmilum{right:var(--fui-Slider__thumb--position);}", ".f5cv5a3{-webkit-transform:translateY(50%);-moz-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%);}", ".f1k2fpdo{bottom:var(--fui-Slider__thumb--position);}"]
 });
 /**
  * Styles for the Input slot
  */
 
-var useInputStyles = /*#__PURE__*/__styles({
+
+const useInputStyles = /*#__PURE__*/__styles({
   "input": {
     "abs64n": "fk73vx1",
-    "qhf8xq": "f1euv43f",
+    "Ijaq50": "fy0oii6",
+    "nk6f5a": "f11g2wli",
+    "Br312pm": "f1xewaeb",
+    "Bw0ie65": "f1xmzt6x",
     "z8tnut": "f1g0x7ka",
     "z189sj": ["fhxju0i", "f1cnd47f"],
     "Byoj8tv": "f1qch9an",
@@ -379,42 +281,35 @@ var useInputStyles = /*#__PURE__*/__styles({
     "B6of3ja": "f1hu3pq6",
     "t21cq0": ["f11qmguv", "f1tyq0we"],
     "jrapky": "f19f4twv",
-    "Frg6f3": ["f1tyq0we", "f11qmguv"],
-    "a9b677": "fly5x3f",
-    "Bqenvij": "f1l02sjl",
-    "lpbzjs": "f1sdsnyy",
-    "Bkecrkj": "f1aehjj5"
+    "Frg6f3": ["f1tyq0we", "f11qmguv"]
+  },
+  "horizontal": {
+    "Bqenvij": "f1yfdkfd",
+    "a9b677": "f1kl1iyt"
+  },
+  "vertical": {
+    "Bqenvij": "fxc22c6",
+    "a9b677": "f174ca62",
+    "Brp00wb": "f1r9mf01"
   }
 }, {
-  "d": [".fk73vx1{opacity:0;}", ".f1euv43f{position:absolute;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}"]
+  "d": [".fk73vx1{opacity:0;}", ".fy0oii6{grid-row-start:slider;}", ".f11g2wli{grid-row-end:slider;}", ".f1xewaeb{grid-column-start:slider;}", ".f1xmzt6x{grid-column-end:slider;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f1yfdkfd{height:var(--fui-Slider__thumb--size);}", ".f1kl1iyt{width:calc(100% + var(--fui-Slider__thumb--size));}", ".fxc22c6{height:calc(100% + var(--fui-Slider__thumb--size));}", ".f174ca62{width:var(--fui-Slider__thumb--size);}", ".f1r9mf01{-webkit-appearance:slider-vertical;}"]
 });
 /**
  * Apply styling to the Slider slots based on the state
  */
 
 
-export var useSliderStyles = function (state) {
-  var rootStyles = useRootStyles();
-  var sliderWrapperStyles = useSliderWrapper();
-  var railStyles = useRailStyles();
-  var trackWrapperStyles = useTrackWrapperStyles();
-  var trackStyles = useTrackStyles();
-  var marksWrapperStyles = useMarksWrapperStyles();
-  var thumbWrapperStyles = useThumbWrapperStyles();
-  var thumbStyles = useThumbStyles();
-  var activeRailStyles = useActiveRailStyles();
-  var inputStyles = useInputStyles();
-  state.root.className = mergeClasses(rootStyles.root, rootStyles.focusIndicator, rootStyles[state.size], state.vertical ? rootStyles.vertical : rootStyles.horizontal, state.disabled ? rootStyles.disabled : rootStyles.enabled, rootStyles.focusIndicator, state.root.className);
-  state.sliderWrapper.className = mergeClasses(sliderWrapperStyles.sliderWrapper, state.vertical ? sliderWrapperStyles.vertical : sliderWrapperStyles.horizontal, state.sliderWrapper.className);
-  state.rail.className = mergeClasses(railStyles.rail, state.vertical ? railStyles.vertical : railStyles.horizontal, state.disabled ? railStyles.disabled : railStyles.enabled, state.rail.className);
-  state.sliderWrapper.className = mergeClasses(sliderWrapperStyles.sliderWrapper, state.vertical ? sliderWrapperStyles.vertical : sliderWrapperStyles.horizontal, state.sliderWrapper.className);
-  state.trackWrapper.className = mergeClasses(trackWrapperStyles.trackWrapper, state.vertical ? trackWrapperStyles.vertical : trackWrapperStyles.horizontal, state.trackWrapper.className);
-  state.track.className = mergeClasses(trackClassName, trackStyles.track, state.vertical ? trackStyles.vertical : trackStyles.horizontal, state.disabled ? trackStyles.disabled : trackStyles.enabled, state.track.className);
-  state.marksWrapper.className = mergeClasses(marksWrapperStyles.marksWrapper, state.vertical ? marksWrapperStyles.vertical : marksWrapperStyles.horizontal, state.disabled && marksWrapperStyles.disabled, state.marksWrapper.className);
-  state.thumbWrapper.className = mergeClasses(thumbWrapperStyles.thumbWrapper, state.vertical ? thumbWrapperStyles.vertical : thumbWrapperStyles.horizontal, state.thumbWrapper.className);
-  state.thumb.className = mergeClasses(thumbClassName, thumbStyles.thumb, !state.vertical && thumbStyles.horizontal, state.disabled ? thumbStyles.disabled : thumbStyles.enabled, state.thumb.className);
-  state.activeRail.className = mergeClasses(activeRailStyles.activeRail, state.vertical ? activeRailStyles.vertical : activeRailStyles.horizontal, state.activeRail.className);
-  state.input.className = mergeClasses(inputStyles.input, state.input.className);
+export const useSliderStyles_unstable = state => {
+  const rootStyles = useRootStyles();
+  const railStyles = useRailStyles();
+  const thumbStyles = useThumbStyles();
+  const inputStyles = useInputStyles();
+  const isVertical = state.vertical;
+  state.root.className = mergeClasses(sliderClassNames.root, rootStyles.root, isVertical ? rootStyles.focusIndicatorVertical : rootStyles.focusIndicatorHorizontal, rootStyles[state.size], isVertical ? rootStyles.vertical : rootStyles.horizontal, state.disabled ? rootStyles.disabled : rootStyles.enabled, state.root.className);
+  state.rail.className = mergeClasses(sliderClassNames.rail, railStyles.rail, isVertical ? railStyles.vertical : railStyles.horizontal, state.rail.className);
+  state.thumb.className = mergeClasses(sliderClassNames.thumb, thumbStyles.thumb, isVertical ? thumbStyles.vertical : thumbStyles.horizontal, state.disabled && thumbStyles.disabled, state.thumb.className);
+  state.input.className = mergeClasses(sliderClassNames.input, inputStyles.input, isVertical ? inputStyles.vertical : inputStyles.horizontal, state.input.className);
   return state;
 };
 //# sourceMappingURL=useSliderStyles.js.map