@fluentui/react-switch 9.0.0-nightly.b5b7401007.0 → 9.0.0-rc.3

package/lib-commonjs/components/Switch/useSwitchStyles.js

@@ -3,20 +3,22 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useSwitchStyles = void 0;
+exports.useSwitchStyles_unstable = exports.switchClassName = 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 rootClassName = 'ms-Switch-root';
-var trackClassName = 'ms-Switch-track';
-var thumbClassName = 'ms-Switch-thumb';
+const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
+
+exports.switchClassName = 'fui-Switch';
+const trackClassName = `${exports.switchClassName}-track`;
+const thumbClassName = `${exports.switchClassName}-thumb`;
 /**
  * Styles for the root slot
  */
 
-var useRootStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useRootStyles = /*#__PURE__*/react_1.__styles({
   "root": {
     "B64q66w": "frxo1y7",
     "yvbau0": "fe5s2ct",
@@ -32,15 +34,12 @@ var useRootStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "ha4doy": "f1qdqbpl"
   },
   "unchecked": {
-    "Blms9gb": "f5twets",
-    "B786czj": "f1dad01o",
-    "Bjuc0nl": ["f687y2r", "f1edjd92"],
-    "B5yqodl": "f1f3tlu1",
-    "kjlpdb": ["f1edjd92", "f687y2r"]
+    "d48c0s": "frinyyk",
+    "Bc6qnd8": "f1g8lwx2"
   },
   "checked": {
-    "B4o7b9o": "fnm6wgb",
-    "puz9ln": "fi8bwd9"
+    "Banj4pq": "fpfyfb6",
+    "Brktkwq": "f3vtzeg"
   },
   "enabled": {
     "H36rlo": "felqjlh",
@@ -52,37 +51,25 @@ var useRootStyles = /*#__PURE__*/react_make_styles_1.__styles({
   },
   "focusIndicator": {
     "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": "f1rh66yx",
     "Jxg1p8": "f19ibq92",
     "Bc94xmo": ["fc3tncn", "f1veb610"],
     "Bj23z95": ["f1veb610", "fc3tncn"]
   }
 }, {
-  "d": [".frxo1y7{--switch-width:40px;}", ".fe5s2ct{--switch-height:20px;}", ".f1n6k660{--switch-thumb-size:14px;}", ".f17m95gg{--switch-checked-opacity:0;}", ".fp7zjh8{--switch-unchecked-opacity:0;}", ".f10pi13n{position:relative;}", ".fnceurk{width:var(--switch-width);}", ".f15da5dy{height:var(--switch-height);}", ".f14t3ns0{display:inline-block;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f1sdsnyy{touch-action:none;}", ".f1qdqbpl{vertical-align:bottom;}", ".felqjlh{-webkit-tap-highlight-color:rgba(0,0,0,0);}", ".f1k6fduh{cursor:pointer;}", ".fdrzuqr{cursor:not-allowed;}", ".f1aehjj5{pointer-events:none;}", "[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] .f1rh66yx:focus-within:after{top:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .f19ibq92:focus-within:after{bottom:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .fc3tncn:focus-within:after{left:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .f1veb610:focus-within:after{right:calc(0px - 2px - 8px);}"],
-  "h": [".f5twets:hover .ms-Switch-thumb:before{background:var(--colorNeutralStrokeAccessibleHover);}", ".f1dad01o:hover .ms-Switch-track:before{border-top-color:var(--colorNeutralStrokeAccessibleHover);}", ".f687y2r:hover .ms-Switch-track:before{border-right-color:var(--colorNeutralStrokeAccessibleHover);}", ".f1edjd92:hover .ms-Switch-track:before{border-left-color:var(--colorNeutralStrokeAccessibleHover);}", ".f1f3tlu1:hover .ms-Switch-track:before{border-bottom-color:var(--colorNeutralStrokeAccessibleHover);}", ".fnm6wgb:hover .ms-Switch-track:after{background:var(--colorBrandBackgroundHover);}"],
-  "a": [".fi8bwd9:active .ms-Switch-track:after{background:var(--colorBrandBackgroundPressed);}"],
+  "d": [".frxo1y7{--switch-width:40px;}", ".fe5s2ct{--switch-height:20px;}", ".f1n6k660{--switch-thumb-size:14px;}", ".f17m95gg{--switch-checked-opacity:0;}", ".fp7zjh8{--switch-unchecked-opacity:0;}", ".f10pi13n{position:relative;}", ".fnceurk{width:var(--switch-width);}", ".f15da5dy{height:var(--switch-height);}", ".f14t3ns0{display:inline-block;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f1sdsnyy{touch-action:none;}", ".f1qdqbpl{vertical-align:bottom;}", ".felqjlh{-webkit-tap-highlight-color:rgba(0,0,0,0);}", ".f1k6fduh{cursor:pointer;}", ".fdrzuqr{cursor:not-allowed;}", ".f1aehjj5{pointer-events:none;}", "[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] .f1rh66yx:focus-within:after{top:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .f19ibq92:focus-within:after{bottom:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .fc3tncn:focus-within:after{left:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .f1veb610:focus-within:after{right:calc(0px - 2px - 8px);}"],
+  "h": [".frinyyk:hover .fui-Switch-thumb:before{background-color:var(--colorNeutralStrokeAccessibleHover);}", ".f1g8lwx2:hover .fui-Switch-track:before{border-color:var(--colorNeutralStrokeAccessibleHover);}", ".fpfyfb6:hover .fui-Switch-track:after{background-color:var(--colorBrandBackgroundHover);}"],
+  "a": [".f3vtzeg:active .fui-Switch-track:after{background-color:var(--colorBrandBackgroundPressed);}"],
   "i": [".f2hkw1w:focus-visible{outline-style:none;}"]
 });
 /**
@@ -90,12 +77,14 @@ var useRootStyles = /*#__PURE__*/react_make_styles_1.__styles({
  */
 
 
-var useTrackStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useTrackStyles = /*#__PURE__*/react_1.__styles({
   "track": {
     "qhf8xq": "f1euv43f",
     "a9b677": "fly5x3f",
     "Bqenvij": "f1l02sjl",
-    "Bi2q7bf": "f11zxivh",
+    "Bmy1vo4": "fmslzlq",
+    "B3o57yi": "f15vu5tu",
+    "Bkqvd7p": "f1e1a42z",
     "lpbzjs": "f1sdsnyy",
     "Bkecrkj": "f1aehjj5",
     "xx9plb": "fxf9f1y",
@@ -104,7 +93,10 @@ var useTrackStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "Bj2wrql": "f3zr33r",
     "qd6xl9": ["ff0gctb", "f8g0ba1"],
     "Bmqnesq": "f170vdtw",
-    "zf3lio": "f1jua1m0",
+    "px8gyy": ["f7lyffi", "fmk9c8u"],
+    "B5c9fhp": ["fmk9c8u", "f7lyffi"],
+    "Bhe99jt": ["f1nat4im", "fw5qzmy"],
+    "B2r1szc": ["fw5qzmy", "f1nat4im"],
     "rurcny": "f99sooz",
     "ngabwx": "f1uhpfti",
     "Hdbjpj": "f11ef69",
@@ -113,7 +105,10 @@ var useTrackStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "Bj55yzk": "f13gddrr",
     "cnmfks": ["f1oarbwq", "f1bp8q63"],
     "oqd9ik": "ffdc0f3",
-    "c4kunb": "fsn1tsw",
+    "frdscb": ["f1xuwyw0", "f12j4hro"],
+    "B9nohqn": ["f12j4hro", "f1xuwyw0"],
+    "B1dhsta": ["f1mf29j", "f1nzm45q"],
+    "Bjdmjzx": ["f1nzm45q", "f1mf29j"],
     "Bs6t6z0": "f77y9vx",
     "Bmyypfa": "frd86tk"
   },
@@ -130,10 +125,10 @@ var useTrackStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "I89eb": ["f149mt9j", "fs3bzhx"],
     "Bp1vogq": "f14z72z2",
     "Bohd3ja": ["fs3bzhx", "f149mt9j"],
-    "B4zgs9e": "f1ntlsrl"
+    "B1dvbpk": "f1k1dzc6"
   },
   "checked": {
-    "Bpudnjh": "f1lhwn2z",
+    "Bkbwdz4": "f8mks4l",
     "rskduk": "f1so6udy",
     "Dctjco": ["f1faxgr0", "f1wf3et7"],
     "J4s2b0": "f124kgxn",
@@ -166,17 +161,17 @@ var useTrackStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "B13j16c": ["f11zx3qq", "fqewq1t"],
     "Bk8j60v": "fmewjpk",
     "Bpbi4o9": ["fqewq1t", "f11zx3qq"],
-    "Bpudnjh": "fq2pbzm"
+    "Bkbwdz4": "f132yvl5"
   }
 }, {
-  "d": [".f1euv43f{position:absolute;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f11zxivh{-webkit-transition:background .1s cubic-bezier(0.33, 0.0, 0.67, 1);transition:background .1s cubic-bezier(0.33, 0.0, 0.67, 1);}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}", ".fxf9f1y:before{position:absolute;}", ".frdto5n:before{top:0px;}", ".f8g0ba1:before{left:0px;}", ".ff0gctb:before{right:0px;}", ".f3zr33r:before{bottom:0px;}", ".f170vdtw:before{box-sizing:border-box;}", ".f1jua1m0:before{border-radius:999px;}", ".f99sooz:before{content:'';}", ".f1uhpfti:before{opacity:var(--switch-unchecked-opacity);}", ".f11ef69:after{position:absolute;}", ".f1yuyem3:after{top:0px;}", ".f1bp8q63:after{left:0px;}", ".f1oarbwq:after{right:0px;}", ".f13gddrr:after{bottom:0px;}", ".ffdc0f3:after{box-sizing:border-box;}", ".fsn1tsw:after{border-radius:999px;}", ".f77y9vx:after{content:'';}", ".frd86tk:after{opacity:var(--switch-checked-opacity);}", ".f199l62q:before{border-top-width:1px;}", ".f1pa2qi2:before{border-right-width:1px;}", ".f1ooiv2t:before{border-left-width:1px;}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".f1gqzwee:before{border-top-color:var(--colorNeutralStrokeAccessible);}", ".f149mt9j:before{border-right-color:var(--colorNeutralStrokeAccessible);}", ".fs3bzhx:before{border-left-color:var(--colorNeutralStrokeAccessible);}", ".f14z72z2:before{border-bottom-color:var(--colorNeutralStrokeAccessible);}", ".f1ntlsrl:before{background:none;}", ".f1lhwn2z:after{background:var(--colorBrandBackground);}", ".f1so6udy:after{border-top-style:none;}", ".f1faxgr0:after{border-right-style:none;}", ".f1wf3et7:after{border-left-style:none;}", ".f124kgxn:after{border-bottom-style:none;}", ".fntj282:before{border-top-color:var(--colorNeutralStrokeDisabled);}", ".fzta9nb:before{border-right-color:var(--colorNeutralStrokeDisabled);}", ".f17m9iy5:before{border-left-color:var(--colorNeutralStrokeDisabled);}", ".f1k4exvn:before{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".f1l5cenb:after{border-top-width:1px;}", ".f1jvubu3:after{border-right-width:1px;}", ".f1q1uvzd:after{border-left-width:1px;}", ".f2fxry3:after{border-bottom-width:1px;}", ".f1iq3fds:after{border-top-style:solid;}", ".f1r2jemi:after{border-right-style:solid;}", ".f11olovk:after{border-left-style:solid;}", ".fd0py6g:after{border-bottom-style:solid;}", ".f2uxs13:after{border-top-color:var(--colorTransparentStrokeDisabled);}", ".f11zx3qq:after{border-right-color:var(--colorTransparentStrokeDisabled);}", ".fqewq1t:after{border-left-color:var(--colorTransparentStrokeDisabled);}", ".fmewjpk:after{border-bottom-color:var(--colorTransparentStrokeDisabled);}", ".fq2pbzm:after{background:var(--colorNeutralBackgroundDisabled);}"]
+  "d": [".f1euv43f{position:absolute;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".fmslzlq{transition-property:backgroundColor;}", ".f15vu5tu{transition-duration:0.1s;}", ".f1e1a42z{transition-timing-function:cubic-bezier(0.33, 0, 0.67, 1);}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}", ".fxf9f1y:before{position:absolute;}", ".frdto5n:before{top:0px;}", ".f8g0ba1:before{left:0px;}", ".ff0gctb:before{right:0px;}", ".f3zr33r:before{bottom:0px;}", ".f170vdtw:before{box-sizing:border-box;}", ".f7lyffi:before{border-bottom-right-radius:999px;}", ".fmk9c8u:before{border-bottom-left-radius:999px;}", ".f1nat4im:before{border-top-right-radius:999px;}", ".fw5qzmy:before{border-top-left-radius:999px;}", ".f99sooz:before{content:'';}", ".f1uhpfti:before{opacity:var(--switch-unchecked-opacity);}", ".f11ef69:after{position:absolute;}", ".f1yuyem3:after{top:0px;}", ".f1bp8q63:after{left:0px;}", ".f1oarbwq:after{right:0px;}", ".f13gddrr:after{bottom:0px;}", ".ffdc0f3:after{box-sizing:border-box;}", ".f1xuwyw0:after{border-bottom-right-radius:999px;}", ".f12j4hro:after{border-bottom-left-radius:999px;}", ".f1mf29j:after{border-top-right-radius:999px;}", ".f1nzm45q:after{border-top-left-radius:999px;}", ".f77y9vx:after{content:'';}", ".frd86tk:after{opacity:var(--switch-checked-opacity);}", ".f199l62q:before{border-top-width:1px;}", ".f1pa2qi2:before{border-right-width:1px;}", ".f1ooiv2t:before{border-left-width:1px;}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".f1gqzwee:before{border-top-color:var(--colorNeutralStrokeAccessible);}", ".f149mt9j:before{border-right-color:var(--colorNeutralStrokeAccessible);}", ".fs3bzhx:before{border-left-color:var(--colorNeutralStrokeAccessible);}", ".f14z72z2:before{border-bottom-color:var(--colorNeutralStrokeAccessible);}", ".f1k1dzc6:before{background-color:transparent;}", ".f8mks4l:after{background-color:var(--colorBrandBackground);}", ".f1so6udy:after{border-top-style:none;}", ".f1faxgr0:after{border-right-style:none;}", ".f1wf3et7:after{border-left-style:none;}", ".f124kgxn:after{border-bottom-style:none;}", ".fntj282:before{border-top-color:var(--colorNeutralStrokeDisabled);}", ".fzta9nb:before{border-right-color:var(--colorNeutralStrokeDisabled);}", ".f17m9iy5:before{border-left-color:var(--colorNeutralStrokeDisabled);}", ".f1k4exvn:before{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".f1l5cenb:after{border-top-width:1px;}", ".f1jvubu3:after{border-right-width:1px;}", ".f1q1uvzd:after{border-left-width:1px;}", ".f2fxry3:after{border-bottom-width:1px;}", ".f1iq3fds:after{border-top-style:solid;}", ".f1r2jemi:after{border-right-style:solid;}", ".f11olovk:after{border-left-style:solid;}", ".fd0py6g:after{border-bottom-style:solid;}", ".f2uxs13:after{border-top-color:var(--colorTransparentStrokeDisabled);}", ".f11zx3qq:after{border-right-color:var(--colorTransparentStrokeDisabled);}", ".fqewq1t:after{border-left-color:var(--colorTransparentStrokeDisabled);}", ".fmewjpk:after{border-bottom-color:var(--colorTransparentStrokeDisabled);}", ".f132yvl5:after{background-color:var(--colorNeutralBackgroundDisabled);}"]
 });
 /**
  * Styles for the thumb wrapper slot
  */
 
 
-var useThumbWrapperStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useThumbWrapperStyles = /*#__PURE__*/react_1.__styles({
   "thumbWrapper": {
     "qhf8xq": "f1euv43f",
     "Bhzewxz": "f15twtuk",
@@ -194,16 +189,21 @@ var useThumbWrapperStyles = /*#__PURE__*/react_make_styles_1.__styles({
  */
 
 
-var useThumbStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useThumbStyles = /*#__PURE__*/react_1.__styles({
   "thumb": {
     "qhf8xq": "f1euv43f",
     "a9b677": "fcjrtee",
     "Bqenvij": "fili5n9",
     "B7ck84d": "f1ewtqcl",
-    "Dimara": "f44lkw9",
+    "Bbmb7ep": ["f8fbkgy", "f1nfllo7"],
+    "Beyfa6y": ["f1nfllo7", "f8fbkgy"],
+    "B7oj6ja": ["f1djnp8u", "f1s8kh49"],
+    "Btl43ni": ["f1s8kh49", "f1djnp8u"],
     "Bhzewxz": "f1i1t8d1",
     "Bz10aip": ["foouk8k", "fd9rb4b"],
-    "Bi2q7bf": "f11zxivh",
+    "Bmy1vo4": "fmslzlq",
+    "B3o57yi": "f15vu5tu",
+    "Bkqvd7p": "f1e1a42z",
     "lpbzjs": "f1sdsnyy",
     "Bkecrkj": "f1aehjj5",
     "xx9plb": "fxf9f1y",
@@ -211,7 +211,10 @@ var useThumbStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "Byque4d": ["f8g0ba1", "ff0gctb"],
     "Bj2wrql": "f3zr33r",
     "qd6xl9": ["ff0gctb", "f8g0ba1"],
-    "zf3lio": "fmrqcwg",
+    "px8gyy": ["fu724ry", "f1ufhb3r"],
+    "B5c9fhp": ["f1ufhb3r", "fu724ry"],
+    "Bhe99jt": ["fiow2ne", "f13lz1i8"],
+    "B2r1szc": ["f13lz1i8", "fiow2ne"],
     "rurcny": "f99sooz",
     "ngabwx": "f1uhpfti",
     "Hdbjpj": "f11ef69",
@@ -219,15 +222,18 @@ var useThumbStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "jc51t6": ["f1bp8q63", "f1oarbwq"],
     "Bj55yzk": "f13gddrr",
     "cnmfks": ["f1oarbwq", "f1bp8q63"],
-    "c4kunb": "f1y5o2fm",
+    "frdscb": ["fc4gh2t", "flndy84"],
+    "B9nohqn": ["flndy84", "fc4gh2t"],
+    "B1dhsta": ["fxgx2h0", "fh20ihy"],
+    "Bjdmjzx": ["fh20ihy", "fxgx2h0"],
     "Bs6t6z0": "f77y9vx",
     "Bmyypfa": "frd86tk"
   },
   "unchecked": {
-    "B4zgs9e": "f1imqj0g"
+    "B1dvbpk": "f1n7m28n"
   },
   "checked": {
-    "Bpudnjh": "fe3g45j"
+    "Bkbwdz4": "f1261hx1"
   },
   "disabledUnchecked": {
     "dj0dih": "f199l62q",
@@ -242,20 +248,20 @@ var useThumbStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "I89eb": ["f1yueqd5", "f16ep8jm"],
     "Bp1vogq": "flh92r5",
     "Bohd3ja": ["f16ep8jm", "f1yueqd5"],
-    "B4zgs9e": "fer8lxq"
+    "B1dvbpk": "fj528n6"
   },
   "disabledChecked": {
-    "Bpudnjh": "fz051tx"
+    "Bkbwdz4": "f18jltdj"
   }
 }, {
-  "d": [".f1euv43f{position:absolute;}", ".fcjrtee{width:var(--switch-thumb-size);}", ".fili5n9{height:var(--switch-thumb-size);}", ".f1ewtqcl{box-sizing:border-box;}", ".f44lkw9{border-radius:var(--borderRadiusCircular);}", ".f1i1t8d1{top:50%;}", ".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%);}", ".f11zxivh{-webkit-transition:background .1s cubic-bezier(0.33, 0.0, 0.67, 1);transition:background .1s cubic-bezier(0.33, 0.0, 0.67, 1);}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}", ".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);}", ".f99sooz:before{content:'';}", ".f1uhpfti:before{opacity:var(--switch-unchecked-opacity);}", ".f11ef69:after{position:absolute;}", ".f1yuyem3:after{top:0px;}", ".f1bp8q63:after{left:0px;}", ".f1oarbwq:after{right:0px;}", ".f13gddrr:after{bottom:0px;}", ".f1y5o2fm:after{border-radius:var(--borderRadiusCircular);}", ".f77y9vx:after{content:'';}", ".frd86tk:after{opacity:var(--switch-checked-opacity);}", ".f1imqj0g:before{background:var(--colorNeutralStrokeAccessible);}", ".fe3g45j:after{background:var(--colorNeutralForegroundOnBrand);}", ".f199l62q:before{border-top-width:1px;}", ".f1pa2qi2:before{border-right-width:1px;}", ".f1ooiv2t:before{border-left-width:1px;}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".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);}", ".fer8lxq:before{background:var(--colorNeutralBackground1);}", ".fz051tx:after{background:var(--colorNeutralForegroundDisabled);}"]
+  "d": [".f1euv43f{position:absolute;}", ".fcjrtee{width:var(--switch-thumb-size);}", ".fili5n9{height:var(--switch-thumb-size);}", ".f1ewtqcl{box-sizing:border-box;}", ".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);}", ".f1i1t8d1{top:50%;}", ".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%);}", ".fmslzlq{transition-property:backgroundColor;}", ".f15vu5tu{transition-duration:0.1s;}", ".f1e1a42z{transition-timing-function:cubic-bezier(0.33, 0, 0.67, 1);}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}", ".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);}", ".f99sooz:before{content:'';}", ".f1uhpfti:before{opacity:var(--switch-unchecked-opacity);}", ".f11ef69:after{position:absolute;}", ".f1yuyem3:after{top:0px;}", ".f1bp8q63:after{left:0px;}", ".f1oarbwq:after{right:0px;}", ".f13gddrr:after{bottom:0px;}", ".fc4gh2t:after{border-bottom-right-radius:var(--borderRadiusCircular);}", ".flndy84:after{border-bottom-left-radius:var(--borderRadiusCircular);}", ".fxgx2h0:after{border-top-right-radius:var(--borderRadiusCircular);}", ".fh20ihy:after{border-top-left-radius:var(--borderRadiusCircular);}", ".f77y9vx:after{content:'';}", ".frd86tk:after{opacity:var(--switch-checked-opacity);}", ".f1n7m28n:before{background-color:var(--colorNeutralStrokeAccessible);}", ".f1261hx1:after{background-color:var(--colorNeutralForegroundOnBrand);}", ".f199l62q:before{border-top-width:1px;}", ".f1pa2qi2:before{border-right-width:1px;}", ".f1ooiv2t:before{border-left-width:1px;}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".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);}", ".fj528n6:before{background-color:var(--colorNeutralBackground1);}", ".f18jltdj:after{background-color:var(--colorNeutralForegroundDisabled);}"]
 });
 /**
  * Styles for the activeRail slot
  */
 
 
-var useActiveRailStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useActiveRailStyles = /*#__PURE__*/react_1.__styles({
   "activeRail": {
     "qhf8xq": "f1euv43f",
     "oyh7mz": ["fhpx7ww", "f1kctpth"],
@@ -269,7 +275,7 @@ var useActiveRailStyles = /*#__PURE__*/react_make_styles_1.__styles({
  */
 
 
-var useInputStyle = /*#__PURE__*/react_make_styles_1.__styles({
+const useInputStyle = /*#__PURE__*/react_1.__styles({
   "input": {
     "abs64n": "fk73vx1",
     "qhf8xq": "f1euv43f",
@@ -294,24 +300,25 @@ var useInputStyle = /*#__PURE__*/react_make_styles_1.__styles({
  */
 
 
-var useSwitchStyles = function (state) {
-  var _a = state.input,
-      checked = _a.checked,
-      disabled = _a.disabled;
-  var rootStyles = useRootStyles();
-  var trackStyles = useTrackStyles();
-  var thumbWrapperStyles = useThumbWrapperStyles();
-  var thumbStyles = useThumbStyles();
-  var activeRailStyles = useActiveRailStyles();
-  var inputStyles = useInputStyle();
-  state.root.className = react_make_styles_1.mergeClasses(rootClassName + (checked ? ' checked' : ''), rootStyles.root, rootStyles.focusIndicator, !disabled && rootStyles.checked, !disabled && rootStyles.unchecked, disabled ? rootStyles.disabled : rootStyles.enabled, state.root.className);
-  state.track.className = react_make_styles_1.mergeClasses(trackClassName, trackStyles.track, !disabled && trackStyles.checked, !disabled && trackStyles.unchecked, disabled && trackStyles.disabledChecked, disabled && trackStyles.disabledUnchecked, state.track.className);
-  state.thumbWrapper.className = react_make_styles_1.mergeClasses(thumbWrapperStyles.thumbWrapper, state.thumbWrapper.className);
-  state.thumb.className = react_make_styles_1.mergeClasses(thumbClassName, thumbStyles.thumb, !disabled && thumbStyles.checked, !disabled && thumbStyles.unchecked, disabled && thumbStyles.disabledChecked, disabled && thumbStyles.disabledUnchecked, state.thumb.className);
-  state.activeRail.className = react_make_styles_1.mergeClasses(activeRailStyles.activeRail, state.activeRail.className);
-  state.input.className = react_make_styles_1.mergeClasses(inputStyles.input, state.input.className);
+const useSwitchStyles_unstable = state => {
+  const {
+    checked,
+    disabled
+  } = state.input;
+  const rootStyles = useRootStyles();
+  const trackStyles = useTrackStyles();
+  const thumbWrapperStyles = useThumbWrapperStyles();
+  const thumbStyles = useThumbStyles();
+  const activeRailStyles = useActiveRailStyles();
+  const inputStyles = useInputStyle();
+  state.root.className = react_1.mergeClasses(exports.switchClassName + (checked ? ' checked' : ''), rootStyles.root, rootStyles.focusIndicator, !disabled && rootStyles.checked, !disabled && rootStyles.unchecked, disabled ? rootStyles.disabled : rootStyles.enabled, state.root.className);
+  state.track.className = react_1.mergeClasses(trackClassName, trackStyles.track, !disabled && trackStyles.checked, !disabled && trackStyles.unchecked, disabled && trackStyles.disabledChecked, disabled && trackStyles.disabledUnchecked, state.track.className);
+  state.thumbWrapper.className = react_1.mergeClasses(thumbWrapperStyles.thumbWrapper, state.thumbWrapper.className);
+  state.thumb.className = react_1.mergeClasses(thumbClassName, thumbStyles.thumb, !disabled && thumbStyles.checked, !disabled && thumbStyles.unchecked, disabled && thumbStyles.disabledChecked, disabled && thumbStyles.disabledUnchecked, state.thumb.className);
+  state.activeRail.className = react_1.mergeClasses(activeRailStyles.activeRail, state.activeRail.className);
+  state.input.className = react_1.mergeClasses(inputStyles.input, state.input.className);
   return state;
 };
 
-exports.useSwitchStyles = useSwitchStyles;
+exports.useSwitchStyles_unstable = useSwitchStyles_unstable;
 //# sourceMappingURL=useSwitchStyles.js.map

package/lib-commonjs/components/Switch/useSwitchStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Switch/useSwitchStyles.ts"],"names":[],"mappings":"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","sourceRoot":""}
+{"version":3,"sources":["components/Switch/useSwitchStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SwitchState } from './Switch.types';\n\nexport const switchClassName = 'fui-Switch';\nconst trackClassName = `${switchClassName}-track`;\nconst thumbClassName = `${switchClassName}-thumb`;\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  root: {\n    '--switch-width': '40px',\n    '--switch-height': '20px',\n    '--switch-thumb-size': '14px',\n    '--switch-checked-opacity': '0',\n    '--switch-unchecked-opacity': '0',\n\n    position: 'relative',\n    width: 'var(--switch-width)',\n    height: 'var(--switch-height)',\n    display: 'inline-block',\n    userSelect: 'none',\n    touchAction: 'none',\n    verticalAlign: 'bottom',\n  },\n\n  unchecked: {\n    [`:hover .${thumbClassName}`]: {\n      ':before': {\n        backgroundColor: tokens.colorNeutralStrokeAccessibleHover,\n      },\n    },\n\n    [`:hover .${trackClassName}`]: {\n      ':before': {\n        borderColor: tokens.colorNeutralStrokeAccessibleHover,\n      },\n    },\n  },\n\n  checked: {\n    [`:hover .${trackClassName}`]: {\n      ':after': {\n        backgroundColor: tokens.colorBrandBackgroundHover,\n      },\n    },\n\n    [`:active .${trackClassName}`]: {\n      ':after': {\n        backgroundColor: tokens.colorBrandBackgroundPressed,\n      },\n    },\n  },\n\n  enabled: {\n    '-webkit-tap-highlight-color': 'rgba(0,0,0,0)',\n    cursor: 'pointer',\n  },\n\n  disabled: {\n    cursor: 'not-allowed',\n    pointerEvents: 'none',\n  },\n\n  focusIndicator: createFocusOutlineStyle({ selector: 'focus-within', style: { outlineOffset: '8px' } }),\n});\n\n/**\n * Styles for the track slot\n */\nconst useTrackStyles = makeStyles({\n  track: {\n    position: 'absolute',\n    width: '100%',\n    height: '100%',\n    transitionProperty: 'backgroundColor',\n    transitionDuration: '0.1s',\n    transitionTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)',\n    touchAction: 'none',\n    pointerEvents: 'none',\n\n    ':before': {\n      position: 'absolute',\n      top: '0px',\n      left: '0px',\n      bottom: '0px',\n      right: '0px',\n      boxSizing: 'border-box',\n      ...shorthands.borderRadius('999px'),\n      content: \"''\",\n      opacity: 'var(--switch-unchecked-opacity)',\n    },\n\n    ':after': {\n      position: 'absolute',\n      top: '0px',\n      left: '0px',\n      bottom: '0px',\n      right: '0px',\n      boxSizing: 'border-box',\n      ...shorthands.borderRadius('999px'),\n      content: \"''\",\n      opacity: 'var(--switch-checked-opacity)',\n    },\n  },\n\n  unchecked: {\n    ':before': {\n      ...shorthands.border('1px', 'solid', tokens.colorNeutralStrokeAccessible),\n      backgroundColor: 'transparent',\n    },\n  },\n\n  checked: {\n    ':after': {\n      backgroundColor: tokens.colorBrandBackground,\n      ...shorthands.borderStyle('none'),\n    },\n  },\n\n  disabledUnchecked: {\n    ':before': {\n      ...shorthands.border('1px', 'solid', tokens.colorNeutralStrokeDisabled),\n    },\n  },\n\n  disabledChecked: {\n    ':after': {\n      ...shorthands.border('1px', 'solid', tokens.colorTransparentStrokeDisabled),\n      backgroundColor: tokens.colorNeutralBackgroundDisabled,\n    },\n  },\n});\n\n/**\n * Styles for the thumb wrapper slot\n */\nconst useThumbWrapperStyles = makeStyles({\n  thumbWrapper: {\n    position: 'absolute',\n    top: '0',\n    bottom: '0',\n    left: 'calc(var(--switch-thumb-size) * .7)',\n    right: 'calc(var(--switch-thumb-size) * .7)',\n    touchAction: 'none',\n    pointerEvents: 'none',\n  },\n});\n\n/**\n * Styles for the thumb slot\n */\nconst useThumbStyles = makeStyles({\n  thumb: {\n    position: 'absolute',\n    width: 'var(--switch-thumb-size)',\n    height: 'var(--switch-thumb-size)',\n    boxSizing: 'border-box',\n    ...shorthands.borderRadius(tokens.borderRadiusCircular),\n    top: '50%',\n    transform: 'translate(-50%, -50%)',\n    transitionProperty: 'backgroundColor',\n    transitionDuration: '0.1s',\n    transitionTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)',\n    touchAction: 'none',\n    pointerEvents: 'none',\n\n    ':before': {\n      position: 'absolute',\n      top: '0px',\n      left: '0px',\n      bottom: '0px',\n      right: '0px',\n      ...shorthands.borderRadius(tokens.borderRadiusCircular),\n      content: \"''\",\n      opacity: 'var(--switch-unchecked-opacity)',\n    },\n\n    ':after': {\n      position: 'absolute',\n      top: '0px',\n      left: '0px',\n      bottom: '0px',\n      right: '0px',\n      ...shorthands.borderRadius(tokens.borderRadiusCircular),\n      content: \"''\",\n      opacity: 'var(--switch-checked-opacity)',\n    },\n  },\n\n  unchecked: {\n    ':before': {\n      backgroundColor: tokens.colorNeutralStrokeAccessible,\n    },\n  },\n\n  checked: {\n    ':after': {\n      backgroundColor: tokens.colorNeutralForegroundOnBrand,\n    },\n  },\n\n  disabledUnchecked: {\n    ':before': {\n      ...shorthands.border('1px', 'solid', tokens.colorNeutralForegroundDisabled),\n      backgroundColor: tokens.colorNeutralBackground1,\n    },\n  },\n\n  disabledChecked: {\n    ':after': {\n      backgroundColor: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\n/**\n * Styles for the activeRail slot\n */\nconst useActiveRailStyles = makeStyles({\n  activeRail: {\n    position: 'absolute',\n    left: 'calc(var(--switch-thumb-size) * .7)',\n    right: 'calc(var(--switch-thumb-size) * .7)',\n  },\n});\n\n/**\n * Styles for the hidden input slot\n */\nconst useInputStyle = makeStyles({\n  input: {\n    opacity: 0,\n    position: 'absolute',\n    ...shorthands.padding(0),\n    ...shorthands.margin(0),\n    width: '100%',\n    height: '100%',\n    touchAction: 'none',\n    pointerEvents: 'none',\n  },\n});\n\n/**\n * Apply styling to the Switch slots based on the state\n */\nexport const useSwitchStyles_unstable = (state: SwitchState): SwitchState => {\n  const { checked, disabled } = state.input;\n\n  const rootStyles = useRootStyles();\n  const trackStyles = useTrackStyles();\n  const thumbWrapperStyles = useThumbWrapperStyles();\n  const thumbStyles = useThumbStyles();\n  const activeRailStyles = useActiveRailStyles();\n  const inputStyles = useInputStyle();\n\n  state.root.className = mergeClasses(\n    switchClassName + (checked ? ' checked' : ''),\n    rootStyles.root,\n    rootStyles.focusIndicator,\n    !disabled && rootStyles.checked,\n    !disabled && rootStyles.unchecked,\n    disabled ? rootStyles.disabled : rootStyles.enabled,\n    state.root.className,\n  );\n\n  state.track.className = mergeClasses(\n    trackClassName,\n    trackStyles.track,\n    !disabled && trackStyles.checked,\n    !disabled && trackStyles.unchecked,\n    disabled && trackStyles.disabledChecked,\n    disabled && trackStyles.disabledUnchecked,\n    state.track.className,\n  );\n\n  state.thumbWrapper.className = mergeClasses(thumbWrapperStyles.thumbWrapper, state.thumbWrapper.className);\n\n  state.thumb.className = mergeClasses(\n    thumbClassName,\n    thumbStyles.thumb,\n    !disabled && thumbStyles.checked,\n    !disabled && thumbStyles.unchecked,\n    disabled && thumbStyles.disabledChecked,\n    disabled && thumbStyles.disabledUnchecked,\n    state.thumb.className,\n  );\n\n  state.activeRail.className = mergeClasses(activeRailStyles.activeRail, state.activeRail.className);\n\n  state.input.className = mergeClasses(inputStyles.input, state.input.className);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/index.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
 tslib_1.__exportStar(require("./Switch"), exports);
 //# sourceMappingURL=index.js.map

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA","sourceRoot":""}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,UAAA,CAAA,EAAA,OAAA","sourcesContent":["export {};\nexport * from './Switch';\n"],"sourceRoot":"../src/"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-switch",
-  "version": "9.0.0-nightly.b5b7401007.0",
+  "version": "9.0.0-rc.3",
   "description": "Fluent UI React Switch component.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -19,20 +19,16 @@
     "just": "just-scripts",
     "lint": "just-scripts lint",
     "start": "yarn storybook",
-    "test": "jest",
+    "test": "jest --passWithNoTests",
     "docs": "api-extractor run --config=config/api-extractor.local.json --local",
-    "build:local": "tsc -p . --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output dist/react-switch/src && yarn docs",
-    "storybook": "start-storybook"
+    "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/react-switch/src && yarn docs",
+    "storybook": "node ../../scripts/storybook/runner",
+    "type-check": "tsc -b tsconfig.json"
   },
   "devDependencies": {
-    "@fluentui/babel-make-styles": "9.0.0-nightly.b5b7401007.0",
     "@fluentui/eslint-plugin": "*",
-    "@fluentui/jest-serializer-make-styles": "9.0.0-nightly.b5b7401007.0",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-make-styles": "9.0.0-nightly.b5b7401007.0",
-    "@fluentui/react-label": "9.0.0-nightly.b5b7401007.0",
-    "@fluentui/react-provider": "9.0.0-nightly.b5b7401007.0",
-    "@fluentui/react-theme": "9.0.0-nightly.b5b7401007.0",
+    "@fluentui/react-conformance-griffel": "9.0.0-beta.3",
     "@fluentui/scripts": "^1.0.0",
     "@types/enzyme": "3.10.3",
     "@types/enzyme-adapter-react-16": "1.0.3",
@@ -46,10 +42,10 @@
     "react-test-renderer": "^16.3.0"
   },
   "dependencies": {
-    "@fluentui/react-make-styles": "9.0.0-nightly.b5b7401007.0",
-    "@fluentui/react-shared-contexts": "9.0.0-nightly.b5b7401007.0",
-    "@fluentui/react-tabster": "9.0.0-nightly.b5b7401007.0",
-    "@fluentui/react-utilities": "9.0.0-nightly.b5b7401007.0",
+    "@fluentui/react-shared-contexts": "9.0.0-rc.3",
+    "@fluentui/react-tabster": "9.0.0-rc.3",
+    "@fluentui/react-utilities": "9.0.0-rc.3",
+    "@griffel/react": "1.0.0",
     "tslib": "^2.1.0"
   },
   "peerDependencies": {
@@ -59,7 +55,6 @@
     "react-dom": ">=16.8.0 <18.0.0"
   },
   "beachball": {
-    "tag": "beta",
     "disallowedChangeTypes": [
       "major",
       "minor",

package/lib/common/isConformant.d.ts

@@ -1,4 +0,0 @@
-import type { IsConformantOptions } from '@fluentui/react-conformance';
-export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
-    componentPath?: string;
-}): void;

package/lib/common/isConformant.js

@@ -1,12 +0,0 @@
-import { isConformant as baseIsConformant } from '@fluentui/react-conformance';
-import makeStylesTests from '@fluentui/react-conformance-make-styles';
-export function isConformant(testInfo) {
-  var defaultOptions = {
-    asPropHandlesRef: true,
-    componentPath: module.parent.filename.replace('.test', ''),
-    extraTests: makeStylesTests,
-    skipAsPropTests: true
-  };
-  baseIsConformant(defaultOptions, testInfo);
-}
-//# sourceMappingURL=isConformant.js.map

package/lib/common/isConformant.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":"AAAA,SAAS,YAAY,IAAI,gBAAzB,QAAiD,6BAAjD;AAEA,OAAO,eAAP,MAA4B,yCAA5B;AAEA,OAAM,SAAU,YAAV,CACJ,QADI,EACqF;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D,IAAA,UAAU,EAAE,eAH+C;AAI3D,IAAA,eAAe,EAAE;AAJ0C,GAA7D;AAOA,EAAA,gBAAgB,CAAC,cAAD,EAAiB,QAAjB,CAAhB;AACD","sourceRoot":""}

package/lib-commonjs/common/isConformant.d.ts

@@ -1,4 +0,0 @@
-import type { IsConformantOptions } from '@fluentui/react-conformance';
-export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
-    componentPath?: string;
-}): void;

package/lib-commonjs/common/isConformant.js

@@ -1,23 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.isConformant = void 0;
-
-var react_conformance_1 = /*#__PURE__*/require("@fluentui/react-conformance");
-
-var react_conformance_make_styles_1 = /*#__PURE__*/require("@fluentui/react-conformance-make-styles");
-
-function isConformant(testInfo) {
-  var defaultOptions = {
-    asPropHandlesRef: true,
-    componentPath: module.parent.filename.replace('.test', ''),
-    extraTests: react_conformance_make_styles_1.default,
-    skipAsPropTests: true
-  };
-  react_conformance_1.isConformant(defaultOptions, testInfo);
-}
-
-exports.isConformant = isConformant;
-//# sourceMappingURL=isConformant.js.map

package/lib-commonjs/common/isConformant.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AAEA,IAAA,+BAAA,gBAAA,OAAA,CAAA,yCAAA,CAAA;;AAEA,SAAgB,YAAhB,CACE,QADF,EAC2F;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D,IAAA,UAAU,EAAE,+BAAA,CAAA,OAH+C;AAI3D,IAAA,eAAe,EAAE;AAJ0C,GAA7D;AAOA,EAAA,mBAAA,CAAA,YAAA,CAAiB,cAAjB,EAAiC,QAAjC;AACD;;AAXD,OAAA,CAAA,YAAA,GAAA,YAAA","sourceRoot":""}