@fluentui/react-slider 9.0.0-beta.3 → 9.0.0-beta.8

package/lib-commonjs/components/Slider/useSliderStyles.js

@@ -3,325 +3,195 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useSliderStyles = exports.useActiveRailStyles = exports.useThumbStyles = exports.useThumbWrapperStyles = exports.useMarksWrapperStyles = exports.useTrackStyles = exports.useTrackWrapperStyles = exports.useRailStyles = exports.useSliderWrapper = exports.useRootStyles = exports.trackClassName = exports.thumbClassName = void 0;
+exports.useSliderStyles_unstable = exports.useThumbStyles = exports.useRailStyles = exports.useRootStyles = exports.thumbPositionVar = exports.railStepsPercentVar = exports.railProgressVar = exports.railOffsetVar = exports.railDirectionVar = exports.sliderClassName = void 0;
 
-var react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
+const react_1 = /*#__PURE__*/require("@griffel/react");
 
-var react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
+const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
 
-var renderMarks_1 = /*#__PURE__*/require("../../utils/renderMarks");
+const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
 
-exports.thumbClassName = 'ms-Slider-thumb';
-exports.trackClassName = 'ms-Slider-track';
+exports.sliderClassName = 'fui-Slider';
+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`;
+exports.railDirectionVar = `--fui-slider-rail-direction`;
+exports.railOffsetVar = `--fui-slider-rail-offset`;
+exports.railProgressVar = `--fui-slider-rail-progress`;
+exports.railStepsPercentVar = `--fui-slider-rail-steps-percent`;
+exports.thumbPositionVar = `--fui-slider-thumb-position`;
 /**
  * Styles for the root slot
  */
 
-exports.useRootStyles = /*#__PURE__*/react_make_styles_1.__styles({
+exports.useRootStyles = /*#__PURE__*/react_1.__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"
+    "Biculhw": "f1c9or7v",
+    "wqx05c": "flte3hh"
   },
   "medium": {
-    "B3548sg": "f14visze",
-    "Bykjv5i": "f1mjpybc",
-    "Cjqits": "fnkgibb"
+    "Biculhw": "f1pye7a0",
+    "wqx05c": "fkfeez5"
   },
   "horizontal": {
     "Bf4jedk": "fyvtabn",
-    "sshi5w": "f1olaeij",
-    "Beiy3e4": "f1vx9l62"
+    "Bqenvij": "f1lzqqms"
   },
   "vertical": {
-    "Bz10aip": "f10s8fuu",
-    "Bf4jedk": "f122cn8p",
+    "a9b677": "fg8321j",
     "sshi5w": "f1pzv1zu",
-    "Beiy3e4": "f1063pyq"
+    "Budl1dq": "f1px5gne"
   },
   "enabled": {
-    "Bceei9c": "fyjss3s",
-    "B1xli0": "fz78172",
-    "dhleuf": "f26gjsb",
-    "Bwh3duv": "foxkwyv",
-    "Bnwl0dt": "f1wwicuc",
-    "Cwr19t": "f1lmnu8a"
+    "E57xle": "fv45gaj",
+    "Bbaa9vx": "fdbupyo",
+    "Buh0e40": "f101zkkn",
+    "m1hzeo": "flfk056",
+    "bipmid": "f1g3da1l",
+    "om7wyn": "f1i0j5bm",
+    "nb4gel": "fcubes2",
+    "Be8bzyp": "f4xbgjg",
+    "y5wbjr": "f195922",
+    "pk18bm": "ftryjgv",
+    "Bx5xzon": "f9x48s8",
+    "By0o28j": "fj3o9kf"
   },
   "disabled": {
-    "Bceei9c": "fdrzuqr"
+    "Buh0e40": "f18mka2b",
+    "E57xle": "f7gtiye",
+    "Bbaa9vx": "fdmjs6",
+    "Be8bzyp": "fp7twcv",
+    "y5wbjr": "fo1xztc",
+    "pk18bm": "fxmtfj"
   },
-  "focusIndicator": {
+  "focusIndicatorHorizontal": {
     "B486eqv": "f2hkw1w",
-    "vchsgm": "fbiesyy",
-    "ozrjjd": ["fq2kn9", "f1jxwnad"],
-    "B7lelfh": "f1il7mou",
-    "Bp3tz3o": ["f1jxwnad", "fq2kn9"],
+    "c2y4jd": "fsofd9k",
     "B8vm7ur": "f12sql3b",
     "f4hv8x": "f1i4q40k",
     "Gpan81": "fcrbge9",
     "z7afg": "ft464mn",
     "rsjj6t": "fskqmiq",
-    "E86f5s": "f1kbdjx9",
-    "f5nhos": ["fw1d893", "fpuz8dn"],
-    "Bhtq6h7": "f14hlsw1",
-    "Bubk9yy": ["fpuz8dn", "fw1d893"],
-    "dzajus": "f1bkt4b4",
-    "B8gmrwi": ["f16hf5f2", "f1qhqcal"],
-    "Byq6oy9": "fyyqeim",
-    "Bdy2j38": ["f1qhqcal", "f16hf5f2"],
+    "Bqsd8kq": "f2gy8jn",
+    "sfhsbh": "f1pke3uf",
     "Bugh3ej": "f18xdlq9",
-    "epcuuz": "filx0we",
-    "Ba33l6n": ["f1horip2", "fgnx9ah"],
-    "va7z1g": "fkii2tb",
-    "Bmi6mq9": ["fgnx9ah", "f1horip2"],
+    "hpanx6": "f1114nks",
     "Bjkpy09": "f1n40nz3",
     "Jxg1p8": "f1iimkc5",
+    "Bc94xmo": ["felaku1", "fsrbqhn"],
+    "Bj23z95": ["fsrbqhn", "felaku1"]
+  },
+  "focusIndicatorVertical": {
+    "B486eqv": "f2hkw1w",
+    "c2y4jd": "fsofd9k",
+    "B8vm7ur": "f12sql3b",
+    "f4hv8x": "f1i4q40k",
+    "Gpan81": "fcrbge9",
+    "z7afg": "ft464mn",
+    "rsjj6t": "fskqmiq",
+    "Bqsd8kq": "f2gy8jn",
+    "sfhsbh": "f1pke3uf",
+    "Bugh3ej": "f18xdlq9",
+    "hpanx6": "f1114nks",
+    "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;}", ".f1c9or7v{--fui-slider-thumb-size:16px;}", ".flte3hh{--fui-slider-rail-size:2px;}", ".f1pye7a0{--fui-slider-thumb-size:20px;}", ".fkfeez5{--fui-slider-rail-size:4px;}", ".fyvtabn{min-width:120px;}", ".f1lzqqms{height:var(--fui-slider-thumb-size);}", ".fg8321j{width:var(--fui-slider-thumb-size);}", ".f1pzv1zu{min-height:120px;}", ".f1px5gne{grid-template-columns:var(--fui-slider-thumb-size);}", ".fv45gaj{--fui-slider-rail-color:var(--colorNeutralStrokeAccessible);}", ".fdbupyo{--fui-slider-progress-color:var(--colorCompoundBrandBackground);}", ".f101zkkn{--fui-slider-thumb-color:var(--colorCompoundBrandBackground);}", ".f18mka2b{--fui-slider-thumb-color:var(--colorNeutralForegroundDisabled);}", ".f7gtiye{--fui-slider-rail-color:var(--colorNeutralBackgroundDisabled);}", ".fdmjs6{--fui-slider-progress-color:var(--colorNeutralForegroundDisabled);}", "[data-keyboard-nav] .fsofd9k:focus-within{border-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] .f2gy8jn:focus-within:after{border-style:solid;}", "[data-keyboard-nav] .f1pke3uf:focus-within:after{border-width:2px;}", "[data-keyboard-nav] .f18xdlq9:focus-within:after{border-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f1114nks:focus-within:after{border-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": [".flfk056:hover{--fui-slider-thumb-color:var(--colorBrandBackgroundHover);}", ".f1g3da1l:hover{--fui-slider-progress-color:var(--colorBrandBackgroundHover);}"],
+  "a": [".f1i0j5bm:active{--fui-slider-thumb-color:var(--colorBrandBackgroundPressed);}", ".fcubes2:active{--fui-slider-progress-color:var(--colorBrandBackgroundPressed);}"],
+  "t": ["@media (forced-colors: active){.f4xbgjg{--fui-slider-rail-color:CanvasText;}}", "@media (forced-colors: active){.f195922{--fui-slider-thumb-color:Highlight;}}", "@media (forced-colors: active){.ftryjgv{--fui-slider-progress-color:Highlight;}}", "@media (forced-colors: active){.f9x48s8:hover{--fui-slider-thumb-color:Highlight;}}", "@media (forced-colors: active){.fj3o9kf:hover{--fui-slider-progress-color:Highlight;}}", "@media (forced-colors: active){.fp7twcv{--fui-slider-rail-color:GrayText;}}", "@media (forced-colors: active){.fo1xztc{--fui-slider-thumb-color:GrayText;}}", "@media (forced-colors: active){.fxmtfj{--fui-slider-progress-color:GrayText;}}"],
   "i": [".f2hkw1w:focus-visible{outline-style:none;}"]
 });
-/**
- * Styles for the slider wrapper slot
- */
-
-exports.useSliderWrapper = /*#__PURE__*/react_make_styles_1.__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
  */
 
-exports.useRailStyles = /*#__PURE__*/react_make_styles_1.__styles({
+exports.useRailStyles = /*#__PURE__*/react_1.__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
- */
-
-exports.useTrackWrapperStyles = /*#__PURE__*/react_make_styles_1.__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
- */
-
-exports.useTrackStyles = /*#__PURE__*/react_make_styles_1.__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
- */
-
-exports.useMarksWrapperStyles = /*#__PURE__*/react_make_styles_1.__styles({
-  "marksWrapper": {
+    "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"
-  },
-  "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"
-  },
-  "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"
-  }
-}, {
-  "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,.fs0yg8e .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);}"]
-});
-/**
- * Styles for the thumb slot
- */
-
-exports.useThumbWrapperStyles = /*#__PURE__*/react_make_styles_1.__styles({
-  "thumbWrapper": {
-    "qhf8xq": "f1euv43f",
-    "oeaueh": "f1s6fcnf",
-    "Bj3rh1h": "fj25m7a"
+    "Bvjb7m6": "fdgv6k0",
+    "Bcmaq0h": "f1m1tlam",
+    "Bpd4iqm": "fpvhumw",
+    "oeaueh": "f1yog68k",
+    "Bw0xxkn": "f13sgyd8",
+    "rurcny": "f99sooz",
+    "xx9plb": "fxf9f1y",
+    "Baov28r": "f1yc1t50"
   },
   "horizontal": {
-    "oyh7mz": ["fyfbjwq", "f12c551u"],
-    "j35jbq": ["f12c551u", "fyfbjwq"],
-    "Bhzewxz": "f1i1t8d1"
+    "a9b677": "fly5x3f",
+    "Bqenvij": "f1kwo5zd",
+    "Byque4d": ["f1oqflmk", "fimcj7z"],
+    "qd6xl9": ["fimcj7z", "f1oqflmk"],
+    "Bbc2r3f": "few7gnq"
   },
   "vertical": {
-    "Bhzewxz": "fnclzxa",
-    "B5kzvoi": "f19bk6m6",
-    "oyh7mz": ["f1ktbn1t", "ffenbu1"]
+    "a9b677": "f1r3duln",
+    "Bqenvij": "f1l02sjl",
+    "Bdn98qo": "f81jpj",
+    "Bf8kmfk": "f1p8196g",
+    "Bj2wrql": "f1t2u064"
   }
 }, {
-  "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%;}"]
+  "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;}", ".f1m1tlam{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;}", ".f1yc1t50: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%;}", ".f1kwo5zd{height:var(--fui-slider-rail-size);}", ".f1oqflmk:before{left:-1px;}", ".fimcj7z:before{right:-1px;}", ".few7gnq:before{height:var(--fui-slider-rail-size);}", ".f1r3duln{width:var(--fui-slider-rail-size);}", ".f1l02sjl{height:100%;}", ".f81jpj:before{width:var(--fui-slider-rail-size);}", ".f1p8196g:before{top:-1px;}", ".f1t2u064:before{bottom:1px;}"]
 });
 /**
  * Styles for the thumb slot
  */
 
-exports.useThumbStyles = /*#__PURE__*/react_make_styles_1.__styles({
+exports.useThumbStyles = /*#__PURE__*/react_1.__styles({
   "thumb": {
     "qhf8xq": "f1euv43f",
-    "a9b677": "fixoap3",
-    "Bqenvij": "f1dp2j6p",
-    "Bhzewxz": "f113wtx2",
-    "oyh7mz": ["f1xynx9j", "f10k790i"],
-    "B5kzvoi": "f5gq2j6",
-    "j35jbq": ["f10k790i", "f1xynx9j"],
+    "a9b677": "fg8321j",
+    "Bqenvij": "f1lzqqms",
+    "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": "f1u7hpx4",
+    "De3pzq": "f1hi3q3y",
+    "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": "f1gz1mfd",
+    "D4ky5z": ["f51lb3k", "fd7wuyc"],
+    "k1i1uq": "f1mlyj7a",
+    "Bcasopp": ["fd7wuyc", "f51lb3k"],
     "Bdixowu": "f1bwkb58",
     "cqycoz": ["fiio4mc", "fc8z0qo"],
     "Epwjcz": "f1m5ya7j",
@@ -331,15 +201,11 @@ exports.useThumbStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "Bp1vogq": "f1k9rjtw",
     "Bohd3ja": ["f2jll41", "f1yx8xct"]
   },
-  "enabled": {
-    "ayd6f0": "f1nw8quw"
-  },
   "disabled": {
-    "ayd6f0": "f1b7gbxm",
-    "dj0dih": "fqxb0lw",
-    "D4ky5z": ["f169ywak", "f3otfn0"],
-    "k1i1uq": "f1975idk",
-    "Bcasopp": ["f3otfn0", "f169ywak"],
+    "dj0dih": "f1gz1mfd",
+    "D4ky5z": ["f51lb3k", "fd7wuyc"],
+    "k1i1uq": "f1mlyj7a",
+    "Bcasopp": ["fd7wuyc", "f51lb3k"],
     "Bdixowu": "f1bwkb58",
     "cqycoz": ["fiio4mc", "fc8z0qo"],
     "Epwjcz": "f1m5ya7j",
@@ -350,38 +216,26 @@ exports.useThumbStyles = /*#__PURE__*/react_make_styles_1.__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
- */
-
-exports.useActiveRailStyles = /*#__PURE__*/react_make_styles_1.__styles({
-  "activeRail": {
-    "qhf8xq": "f1euv43f"
-  },
-  "horizontal": {
-    "oyh7mz": ["fyfbjwq", "f12c551u"],
-    "j35jbq": ["f12c551u", "fyfbjwq"]
+    "oyh7mz": ["f3ten88", "f81l3fp"]
   },
   "vertical": {
-    "Bhzewxz": "fnclzxa",
-    "B5kzvoi": "f19bk6m6"
+    "Bz10aip": "f5cv5a3",
+    "B5kzvoi": "ftu6jbq"
   }
 }, {
-  "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;}", ".fg8321j{width:var(--fui-slider-thumb-size);}", ".f1lzqqms{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);}", ".f1u7hpx4{box-shadow:0 0 0 calc(var(--fui-slider-thumb-size) * .2) var(--colorNeutralBackground1) inset;}", ".f1hi3q3y{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:'';}", ".f1gz1mfd:before{border-top-width:calc(var(--fui-slider-thumb-size) * .05);}", ".f51lb3k:before{border-right-width:calc(var(--fui-slider-thumb-size) * .05);}", ".fd7wuyc:before{border-left-width:calc(var(--fui-slider-thumb-size) * .05);}", ".f1mlyj7a: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);}", ".f3ten88{left:var(--fui-slider-thumb-position);}", ".f81l3fp{right:var(--fui-slider-thumb-position);}", ".f5cv5a3{-webkit-transform:translateY(50%);-moz-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%);}", ".ftu6jbq{bottom:var(--fui-slider-thumb-position);}"]
 });
 /**
  * Styles for the Input slot
  */
 
-var useInputStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useInputStyles = /*#__PURE__*/react_1.__styles({
   "input": {
     "abs64n": "fk73vx1",
-    "qhf8xq": "f1euv43f",
+    "Ijaq50": "fy0oii6",
+    "nk6f5a": "f11g2wli",
+    "Br312pm": "f1xewaeb",
+    "Bw0ie65": "f1xmzt6x",
     "z8tnut": "f1g0x7ka",
     "z189sj": ["fhxju0i", "f1cnd47f"],
     "Byoj8tv": "f1qch9an",
@@ -389,44 +243,36 @@ var useInputStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "B6of3ja": "f1hu3pq6",
     "t21cq0": ["f11qmguv", "f1tyq0we"],
     "jrapky": "f19f4twv",
-    "Frg6f3": ["f1tyq0we", "f11qmguv"],
-    "a9b677": "fly5x3f",
-    "Bqenvij": "f1l02sjl",
-    "lpbzjs": "f1sdsnyy",
-    "Bkecrkj": "f1aehjj5"
+    "Frg6f3": ["f1tyq0we", "f11qmguv"]
+  },
+  "horizontal": {
+    "Bqenvij": "f1lzqqms",
+    "a9b677": "f1sf2j80"
+  },
+  "vertical": {
+    "Bqenvij": "fb80yd4",
+    "a9b677": "fg8321j",
+    "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;}", ".f1lzqqms{height:var(--fui-slider-thumb-size);}", ".f1sf2j80{width:calc(100% + var(--fui-slider-thumb-size));}", ".fb80yd4{height:calc(100% + var(--fui-slider-thumb-size));}", ".fg8321j{width:var(--fui-slider-thumb-size);}", ".f1r9mf01{-webkit-appearance:slider-vertical;}"]
 });
 /**
  * Apply styling to the Slider slots based on the state
  */
 
 
-var useSliderStyles = function (state) {
-  var rootStyles = exports.useRootStyles();
-  var sliderWrapperStyles = exports.useSliderWrapper();
-  var railStyles = exports.useRailStyles();
-  var trackWrapperStyles = exports.useTrackWrapperStyles();
-  var trackStyles = exports.useTrackStyles();
-  var marksWrapperStyles = exports.useMarksWrapperStyles();
-  var thumbWrapperStyles = exports.useThumbWrapperStyles();
-  var thumbStyles = exports.useThumbStyles();
-  var activeRailStyles = exports.useActiveRailStyles();
-  var inputStyles = useInputStyles();
-  state.root.className = react_make_styles_1.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 = react_make_styles_1.mergeClasses(sliderWrapperStyles.sliderWrapper, state.vertical ? sliderWrapperStyles.vertical : sliderWrapperStyles.horizontal, state.sliderWrapper.className);
-  state.rail.className = react_make_styles_1.mergeClasses(railStyles.rail, state.vertical ? railStyles.vertical : railStyles.horizontal, state.disabled ? railStyles.disabled : railStyles.enabled, state.rail.className);
-  state.sliderWrapper.className = react_make_styles_1.mergeClasses(sliderWrapperStyles.sliderWrapper, state.vertical ? sliderWrapperStyles.vertical : sliderWrapperStyles.horizontal, state.sliderWrapper.className);
-  state.trackWrapper.className = react_make_styles_1.mergeClasses(trackWrapperStyles.trackWrapper, state.vertical ? trackWrapperStyles.vertical : trackWrapperStyles.horizontal, state.trackWrapper.className);
-  state.track.className = react_make_styles_1.mergeClasses(exports.trackClassName, trackStyles.track, state.vertical ? trackStyles.vertical : trackStyles.horizontal, state.disabled ? trackStyles.disabled : trackStyles.enabled, state.track.className);
-  state.marksWrapper.className = react_make_styles_1.mergeClasses(marksWrapperStyles.marksWrapper, state.vertical ? marksWrapperStyles.vertical : marksWrapperStyles.horizontal, state.disabled && marksWrapperStyles.disabled, state.marksWrapper.className);
-  state.thumbWrapper.className = react_make_styles_1.mergeClasses(thumbWrapperStyles.thumbWrapper, state.vertical ? thumbWrapperStyles.vertical : thumbWrapperStyles.horizontal, state.thumbWrapper.className);
-  state.thumb.className = react_make_styles_1.mergeClasses(exports.thumbClassName, thumbStyles.thumb, !state.vertical && thumbStyles.horizontal, state.disabled ? thumbStyles.disabled : thumbStyles.enabled, state.thumb.className);
-  state.activeRail.className = react_make_styles_1.mergeClasses(activeRailStyles.activeRail, state.vertical ? activeRailStyles.vertical : activeRailStyles.horizontal, state.activeRail.className);
-  state.input.className = react_make_styles_1.mergeClasses(inputStyles.input, state.input.className);
+const useSliderStyles_unstable = state => {
+  const rootStyles = exports.useRootStyles();
+  const railStyles = exports.useRailStyles();
+  const thumbStyles = exports.useThumbStyles();
+  const inputStyles = useInputStyles();
+  state.root.className = react_1.mergeClasses(exports.sliderClassName, rootStyles.root, state.vertical ? rootStyles.focusIndicatorVertical : rootStyles.focusIndicatorHorizontal, rootStyles[state.size], state.vertical ? rootStyles.vertical : rootStyles.horizontal, state.disabled ? rootStyles.disabled : rootStyles.enabled, state.root.className);
+  state.rail.className = react_1.mergeClasses(railStyles.rail, state.vertical ? railStyles.vertical : railStyles.horizontal, state.rail.className);
+  state.thumb.className = react_1.mergeClasses(thumbStyles.thumb, state.vertical ? thumbStyles.vertical : thumbStyles.horizontal, state.disabled && thumbStyles.disabled, state.thumb.className);
+  state.input.className = react_1.mergeClasses(inputStyles.input, state.vertical ? inputStyles.vertical : inputStyles.horizontal, state.input.className);
   return state;
 };
 
-exports.useSliderStyles = useSliderStyles;
+exports.useSliderStyles_unstable = useSliderStyles_unstable;
 //# sourceMappingURL=useSliderStyles.js.map