@fluentui/react-switch 9.1.35 → 9.1.37

package/CHANGELOG.json

@@ -2,7 +2,109 @@
   "name": "@fluentui/react-switch",
   "entries": [
     {
-      "date": "Tue, 29 Aug 2023 12:53:36 GMT",
+      "date": "Tue, 05 Sep 2023 15:35:07 GMT",
+      "tag": "@fluentui/react-switch_v9.1.37",
+      "version": "9.1.37",
+      "comments": {
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-field to v9.1.24",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-jsx-runtime to v9.0.5",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-label to v9.1.32",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-tabster to v9.12.7",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-utilities to v9.13.2",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 05 Sep 2023 13:29:05 GMT",
+      "tag": "@fluentui/react-switch_v9.1.36",
+      "version": "9.1.36",
+      "comments": {
+        "patch": [
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-switch",
+            "commit": "eea6d93a62249ba4fba3347fb291c67ee1a3fb24",
+            "comment": "chore: migrate package to use JSX importSource"
+          },
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-switch",
+            "commit": "b93c2ac22355b6cb6f33dd509c6cd9c21f4fffc8",
+            "comment": "bumps @swc/helpers version to 0.5.1"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-field to v9.1.23",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-jsx-runtime to v9.0.4",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-label to v9.1.31",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-shared-contexts to v9.7.3",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-tabster to v9.12.6",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-theme to v9.1.12",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-utilities to v9.13.1",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 29 Aug 2023 12:57:36 GMT",
       "tag": "@fluentui/react-switch_v9.1.35",
       "version": "9.1.35",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,42 @@
 # Change Log - @fluentui/react-switch
 
-This log was last generated on Tue, 29 Aug 2023 12:53:36 GMT and should not be manually modified.
+This log was last generated on Tue, 05 Sep 2023 15:35:07 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.1.37](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.1.37)
+
+Tue, 05 Sep 2023 15:35:07 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.1.36..@fluentui/react-switch_v9.1.37)
+
+### Patches
+
+- Bump @fluentui/react-field to v9.1.24 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.5 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-label to v9.1.32 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-tabster to v9.12.7 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-utilities to v9.13.2 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+
+## [9.1.36](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.1.36)
+
+Tue, 05 Sep 2023 13:29:05 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.1.35..@fluentui/react-switch_v9.1.36)
+
+### Patches
+
+- chore: migrate package to use JSX importSource ([PR #28959](https://github.com/microsoft/fluentui/pull/28959) by bernardo.sunderhus@gmail.com)
+- bumps @swc/helpers version to 0.5.1 ([PR #28989](https://github.com/microsoft/fluentui/pull/28989) by bernardo.sunderhus@gmail.com)
+- Bump @fluentui/react-field to v9.1.23 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.4 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-label to v9.1.31 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.7.3 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-tabster to v9.12.6 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-theme to v9.1.12 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-utilities to v9.13.1 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+
 ## [9.1.35](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.1.35)
 
-Tue, 29 Aug 2023 12:53:36 GMT 
+Tue, 29 Aug 2023 12:57:36 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.1.34..@fluentui/react-switch_v9.1.35)
 
 ### Patches

package/lib/components/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles.styles';\nimport type { SwitchProps } from './Switch.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Switches enable users to trigger an option on or off through pressing the component.\n */\nexport const Switch: ForwardRefComponent<SwitchProps> = React.forwardRef((props, ref) => {\n  const state = useSwitch_unstable(props, ref);\n\n  useSwitchStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useSwitchStyles_unstable')(state);\n\n  return renderSwitch_unstable(state);\n});\n\nSwitch.displayName = 'Switch';\n"],"names":["React","useSwitch_unstable","renderSwitch_unstable","useSwitchStyles_unstable","useCustomStyleHook_unstable","Switch","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,cAAc;AACjD,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,2BAA2B;AAGpE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,uBAA2CL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACvF,MAAMC,QAAQR,mBAAmBM,OAAOC;IAExCL,yBAAyBM;IAEzBL,4BAA4B,4BAA4BK;IAExD,OAAOP,sBAAsBO;AAC/B,GAAG;AAEHJ,OAAOK,WAAW,GAAG"}
+{"version":3,"sources":["Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles.styles';\nimport type { SwitchProps } from './Switch.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Switches enable users to trigger an option on or off through pressing the component.\n */\nexport const Switch: ForwardRefComponent<SwitchProps> = React.forwardRef((props, ref) => {\n  const state = useSwitch_unstable(props, ref);\n\n  useSwitchStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useSwitchStyles_unstable')(state);\n\n  return renderSwitch_unstable(state);\n});\n\nSwitch.displayName = 'Switch';\n"],"names":["React","useSwitch_unstable","renderSwitch_unstable","useSwitchStyles_unstable","useCustomStyleHook_unstable","Switch","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,cAAc;AACjD,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,2BAA2B;AAGpE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,uBAA2CL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC/E,MAAMC,QAAQR,mBAAmBM,OAAOC;IAExCL,yBAAyBM;IAEzBL,4BAA4B,4BAA4BK;IAExD,OAAOP,sBAAsBO;AAC/B,GAAG;AAEHJ,OAAOK,WAAW,GAAG"}

package/lib/components/Switch/renderSwitch.js

@@ -1,9 +1,16 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render a Switch component by passing the state defined props to the appropriate slots.
  */ export const renderSwitch_unstable = (state)=>{
     assertSlots(state);
-    const { labelPosition  } = state;
-    return /*#__PURE__*/ createElement(state.root, null, /*#__PURE__*/ createElement(state.input, null), labelPosition !== 'after' && state.label && /*#__PURE__*/ createElement(state.label, null), /*#__PURE__*/ createElement(state.indicator, null), labelPosition === 'after' && state.label && /*#__PURE__*/ createElement(state.label, null));
+    const { labelPosition } = state;
+    return /*#__PURE__*/ _jsxs(state.root, {
+        children: [
+            /*#__PURE__*/ _jsx(state.input, {}),
+            labelPosition !== 'after' && state.label && /*#__PURE__*/ _jsx(state.label, {}),
+            /*#__PURE__*/ _jsx(state.indicator, {}),
+            labelPosition === 'after' && state.label && /*#__PURE__*/ _jsx(state.label, {})
+        ]
+    });
 };

package/lib/components/Switch/renderSwitch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderSwitch.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SwitchState, SwitchSlots } from './Switch.types';\n\n/**\n * Render a Switch component by passing the state defined props to the appropriate slots.\n */\nexport const renderSwitch_unstable = (state: SwitchState) => {\n  assertSlots<SwitchSlots>(state);\n  const { labelPosition } = state;\n\n  return (\n    <state.root>\n      <state.input />\n      {labelPosition !== 'after' && state.label && <state.label />}\n      <state.indicator />\n      {labelPosition === 'after' && state.label && <state.label />}\n    </state.root>\n  );\n};\n"],"names":["createElement","assertSlots","renderSwitch_unstable","state","labelPosition","root","input","label","indicator"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,wBAAwB,CAACC,QAAuB;IAC3DF,YAAyBE;IACzB,MAAM,EAAEC,cAAa,EAAE,GAAGD;IAE1B,qBACE,AAfJ,cAeKA,MAAME,IAAI,sBACT,AAhBN,cAgBOF,MAAMG,KAAK,SACXF,kBAAkB,WAAWD,MAAMI,KAAK,kBAAI,AAjBnD,cAiBoDJ,MAAMI,KAAK,uBACzD,AAlBN,cAkBOJ,MAAMK,SAAS,SACfJ,kBAAkB,WAAWD,MAAMI,KAAK,kBAAI,AAnBnD,cAmBoDJ,MAAMI,KAAK;AAG/D,EAAE"}
+{"version":3,"sources":["renderSwitch.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SwitchState, SwitchSlots } from './Switch.types';\n\n/**\n * Render a Switch component by passing the state defined props to the appropriate slots.\n */\nexport const renderSwitch_unstable = (state: SwitchState) => {\n  assertSlots<SwitchSlots>(state);\n  const { labelPosition } = state;\n\n  return (\n    <state.root>\n      <state.input />\n      {labelPosition !== 'after' && state.label && <state.label />}\n      <state.indicator />\n      {labelPosition === 'after' && state.label && <state.label />}\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderSwitch_unstable","state","labelPosition","root","input","label","indicator"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,wBAAwB,CAACC;IACpCF,YAAyBE;IACzB,MAAM,EAAEC,aAAa,EAAE,GAAGD;IAE1B,qBACE,MAACA,MAAME,IAAI;;0BACT,KAACF,MAAMG,KAAK;YACXF,kBAAkB,WAAWD,MAAMI,KAAK,kBAAI,KAACJ,MAAMI,KAAK;0BACzD,KAACJ,MAAMK,SAAS;YACfJ,kBAAkB,WAAWD,MAAMI,KAAK,kBAAI,KAACJ,MAAMI,KAAK;;;AAG/D,EAAE"}

package/lib/components/Switch/useSwitch.js

@@ -18,7 +18,7 @@ import { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentu
         supportsLabelFor: true,
         supportsRequired: true
     });
-    const { checked , defaultChecked , disabled , labelPosition ='after' , onChange , required  } = props;
+    const { checked, defaultChecked, disabled, labelPosition = 'after', onChange, required } = props;
     const nativeProps = getPartitionedNativeProps({
         props,
         primarySlotTagName: 'input',
@@ -56,7 +56,8 @@ import { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentu
         elementType: 'input'
     });
     input.onChange = mergeCallbacks(input.onChange, (ev)=>{
-        return onChange === null || onChange === void 0 ? void 0 : onChange(ev, {
+        var _onChange;
+        return (_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange(ev, {
             checked: ev.currentTarget.checked
         });
     });

package/lib/components/Switch/useSwitch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useSwitch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentui/react-utilities';\nimport type { SwitchProps, SwitchState } from './Switch.types';\n\n/**\n * Create the state required to render Switch.\n *\n * The returned state can be modified with hooks such as useSwitchStyles_unstable,\n * before being passed to renderSwitch_unstable.\n *\n * @param props - props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLInputElement>): SwitchState => {\n  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n\n  const { checked, defaultChecked, disabled, labelPosition = 'after', onChange, required } = props;\n\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'input',\n    excludedPropNames: ['checked', 'defaultChecked', 'onChange'],\n  });\n\n  const id = useId('switch-', nativeProps.primary.id);\n\n  const root = slot.always(props.root, {\n    defaultProps: { ref: useFocusWithin<HTMLDivElement>(), ...nativeProps.root },\n    elementType: 'div',\n  });\n  const indicator = slot.always(props.indicator, {\n    defaultProps: { 'aria-hidden': true, children: <CircleFilled /> },\n    elementType: 'div',\n  });\n  const input = slot.always(props.input, {\n    defaultProps: { checked, defaultChecked, id, ref, role: 'switch', type: 'checkbox', ...nativeProps.primary },\n    elementType: 'input',\n  });\n  input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n  const label = slot.optional(props.label, {\n    defaultProps: { disabled, htmlFor: id, required, size: 'medium' },\n    elementType: Label,\n  });\n  return {\n    labelPosition, //Slots definition\n    components: { root: 'div', indicator: 'div', input: 'input', label: Label },\n\n    root,\n    indicator,\n    input,\n    label,\n  };\n};\n"],"names":["React","useFieldControlProps_unstable","CircleFilled","Label","useFocusWithin","getPartitionedNativeProps","mergeCallbacks","useId","slot","useSwitch_unstable","props","ref","supportsLabelFor","supportsRequired","checked","defaultChecked","disabled","labelPosition","onChange","required","nativeProps","primarySlotTagName","excludedPropNames","id","primary","root","always","defaultProps","elementType","indicator","children","input","role","type","ev","currentTarget","label","optional","htmlFor","size","components"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,YAAY,QAAQ,wBAAwB;AACrD,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,cAAc,QAAQ,0BAA0B;AACzD,SAASC,yBAAyB,EAAEC,cAAc,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAGnG;;;;;;;;CAQC,GACD,OAAO,MAAMC,qBAAqB,CAACC,OAAoBC,MAAkD;IACvG,+CAA+C;IAC/CD,QAAQT,8BAA8BS,OAAO;QAAEE,kBAAkB,IAAI;QAAEC,kBAAkB,IAAI;IAAC;IAE9F,MAAM,EAAEC,QAAO,EAAEC,eAAc,EAAEC,SAAQ,EAAEC,eAAgB,QAAO,EAAEC,SAAQ,EAAEC,SAAQ,EAAE,GAAGT;IAE3F,MAAMU,cAAcf,0BAA0B;QAC5CK;QACAW,oBAAoB;QACpBC,mBAAmB;YAAC;YAAW;YAAkB;SAAW;IAC9D;IAEA,MAAMC,KAAKhB,MAAM,WAAWa,YAAYI,OAAO,CAACD,EAAE;IAElD,MAAME,OAAOjB,KAAKkB,MAAM,CAAChB,MAAMe,IAAI,EAAE;QACnCE,cAAc;YAAEhB,KAAKP;YAAkC,GAAGgB,YAAYK,IAAI;QAAC;QAC3EG,aAAa;IACf;IACA,MAAMC,YAAYrB,KAAKkB,MAAM,CAAChB,MAAMmB,SAAS,EAAE;QAC7CF,cAAc;YAAE,eAAe,IAAI;YAAEG,wBAAU,oBAAC5B;QAAgB;QAChE0B,aAAa;IACf;IACA,MAAMG,QAAQvB,KAAKkB,MAAM,CAAChB,MAAMqB,KAAK,EAAE;QACrCJ,cAAc;YAAEb;YAASC;YAAgBQ;YAAIZ;YAAKqB,MAAM;YAAUC,MAAM;YAAY,GAAGb,YAAYI,OAAO;QAAC;QAC3GI,aAAa;IACf;IACAG,MAAMb,QAAQ,GAAGZ,eAAeyB,MAAMb,QAAQ,EAAEgB,CAAAA;QAAMhB,OAAAA,qBAAAA,sBAAAA,KAAAA,IAAAA,SAAWgB,IAAI;YAAEpB,SAASoB,GAAGC,aAAa,CAACrB,OAAO;QAAC;;IACzG,MAAMsB,QAAQ5B,KAAK6B,QAAQ,CAAC3B,MAAM0B,KAAK,EAAE;QACvCT,cAAc;YAAEX;YAAUsB,SAASf;YAAIJ;YAAUoB,MAAM;QAAS;QAChEX,aAAazB;IACf;IACA,OAAO;QACLc;QACAuB,YAAY;YAAEf,MAAM;YAAOI,WAAW;YAAOE,OAAO;YAASK,OAAOjC;QAAM;QAE1EsB;QACAI;QACAE;QACAK;IACF;AACF,EAAE"}
+{"version":3,"sources":["useSwitch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentui/react-utilities';\nimport type { SwitchProps, SwitchState } from './Switch.types';\n\n/**\n * Create the state required to render Switch.\n *\n * The returned state can be modified with hooks such as useSwitchStyles_unstable,\n * before being passed to renderSwitch_unstable.\n *\n * @param props - props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLInputElement>): SwitchState => {\n  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n\n  const { checked, defaultChecked, disabled, labelPosition = 'after', onChange, required } = props;\n\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'input',\n    excludedPropNames: ['checked', 'defaultChecked', 'onChange'],\n  });\n\n  const id = useId('switch-', nativeProps.primary.id);\n\n  const root = slot.always(props.root, {\n    defaultProps: { ref: useFocusWithin<HTMLDivElement>(), ...nativeProps.root },\n    elementType: 'div',\n  });\n  const indicator = slot.always(props.indicator, {\n    defaultProps: { 'aria-hidden': true, children: <CircleFilled /> },\n    elementType: 'div',\n  });\n  const input = slot.always(props.input, {\n    defaultProps: { checked, defaultChecked, id, ref, role: 'switch', type: 'checkbox', ...nativeProps.primary },\n    elementType: 'input',\n  });\n  input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n  const label = slot.optional(props.label, {\n    defaultProps: { disabled, htmlFor: id, required, size: 'medium' },\n    elementType: Label,\n  });\n  return {\n    labelPosition, //Slots definition\n    components: { root: 'div', indicator: 'div', input: 'input', label: Label },\n\n    root,\n    indicator,\n    input,\n    label,\n  };\n};\n"],"names":["React","useFieldControlProps_unstable","CircleFilled","Label","useFocusWithin","getPartitionedNativeProps","mergeCallbacks","useId","slot","useSwitch_unstable","props","ref","supportsLabelFor","supportsRequired","checked","defaultChecked","disabled","labelPosition","onChange","required","nativeProps","primarySlotTagName","excludedPropNames","id","primary","root","always","defaultProps","elementType","indicator","children","input","role","type","ev","currentTarget","label","optional","htmlFor","size","components"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,YAAY,QAAQ,wBAAwB;AACrD,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,cAAc,QAAQ,0BAA0B;AACzD,SAASC,yBAAyB,EAAEC,cAAc,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAGnG;;;;;;;;CAQC,GACD,OAAO,MAAMC,qBAAqB,CAACC,OAAoBC;IACrD,+CAA+C;IAC/CD,QAAQT,8BAA8BS,OAAO;QAAEE,kBAAkB;QAAMC,kBAAkB;IAAK;IAE9F,MAAM,EAAEC,OAAO,EAAEC,cAAc,EAAEC,QAAQ,EAAEC,gBAAgB,OAAO,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGT;IAE3F,MAAMU,cAAcf,0BAA0B;QAC5CK;QACAW,oBAAoB;QACpBC,mBAAmB;YAAC;YAAW;YAAkB;SAAW;IAC9D;IAEA,MAAMC,KAAKhB,MAAM,WAAWa,YAAYI,OAAO,CAACD,EAAE;IAElD,MAAME,OAAOjB,KAAKkB,MAAM,CAAChB,MAAMe,IAAI,EAAE;QACnCE,cAAc;YAAEhB,KAAKP;YAAkC,GAAGgB,YAAYK,IAAI;QAAC;QAC3EG,aAAa;IACf;IACA,MAAMC,YAAYrB,KAAKkB,MAAM,CAAChB,MAAMmB,SAAS,EAAE;QAC7CF,cAAc;YAAE,eAAe;YAAMG,wBAAU,oBAAC5B;QAAgB;QAChE0B,aAAa;IACf;IACA,MAAMG,QAAQvB,KAAKkB,MAAM,CAAChB,MAAMqB,KAAK,EAAE;QACrCJ,cAAc;YAAEb;YAASC;YAAgBQ;YAAIZ;YAAKqB,MAAM;YAAUC,MAAM;YAAY,GAAGb,YAAYI,OAAO;QAAC;QAC3GI,aAAa;IACf;IACAG,MAAMb,QAAQ,GAAGZ,eAAeyB,MAAMb,QAAQ,EAAEgB,CAAAA;YAAMhB;gBAAAA,YAAAA,sBAAAA,gCAAAA,UAAWgB,IAAI;YAAEpB,SAASoB,GAAGC,aAAa,CAACrB,OAAO;QAAC;;IACzG,MAAMsB,QAAQ5B,KAAK6B,QAAQ,CAAC3B,MAAM0B,KAAK,EAAE;QACvCT,cAAc;YAAEX;YAAUsB,SAASf;YAAIJ;YAAUoB,MAAM;QAAS;QAChEX,aAAazB;IACf;IACA,OAAO;QACLc;QACAuB,YAAY;YAAEf,MAAM;YAAOI,WAAW;YAAOE,OAAO;YAASK,OAAOjC;QAAM;QAE1EsB;QACAI;QACAE;QACAK;IACF;AACF,EAAE"}

package/lib/components/Switch/useSwitchStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["createFocusOutlineStyle","tokens","__resetStyles","__styles","mergeClasses","shorthands","switchClassNames","root","indicator","input","label","switchClassName","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useRootBaseClassName","useRootStyles","vertical","Beiy3e4","d","useIndicatorBaseClassName","r","s","useIndicatorStyles","labelAbove","B6of3ja","useInputBaseClassName","useInputStyles","before","j35jbq","Bhzewxz","after","oyh7mz","above","B5kzvoi","Bqenvij","a9b677","useLabelStyles","base","Bceei9c","jrapky","z8tnut","z189sj","Byoj8tv","uwmqm3","useSwitchStyles_unstable","state","rootBaseClassName","rootStyles","indicatorBaseClassName","indicatorStyles","inputBaseClassName","inputStyles","labelStyles","labelPosition","className"],"sources":["useSwitchStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nexport const switchClassNames = {\n    root: 'fui-Switch',\n    indicator: 'fui-Switch__indicator',\n    input: 'fui-Switch__input',\n    label: 'fui-Switch__label'\n};\n/**\n * @deprecated Use `switchClassNames.root` instead.\n */ export const switchClassName = switchClassNames.root;\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\nconst useRootBaseClassName = makeResetStyles({\n    alignItems: 'flex-start',\n    boxSizing: 'border-box',\n    display: 'inline-flex',\n    position: 'relative',\n    ...createFocusOutlineStyle({\n        style: {},\n        selector: 'focus-within'\n    })\n});\nconst useRootStyles = makeStyles({\n    vertical: {\n        flexDirection: 'column'\n    }\n});\nconst useIndicatorBaseClassName = makeResetStyles({\n    borderRadius: tokens.borderRadiusCircular,\n    border: '1px solid',\n    lineHeight: 0,\n    boxSizing: 'border-box',\n    fill: 'currentColor',\n    flexShrink: 0,\n    fontSize: `${thumbSize}px`,\n    height: `${trackHeight}px`,\n    margin: tokens.spacingVerticalS + ' ' + tokens.spacingHorizontalS,\n    pointerEvents: 'none',\n    transitionDuration: tokens.durationNormal,\n    transitionTimingFunction: tokens.curveEasyEase,\n    transitionProperty: 'background, border, color',\n    width: `${trackWidth}px`,\n    '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms'\n    },\n    '> *': {\n        transitionDuration: tokens.durationNormal,\n        transitionTimingFunction: tokens.curveEasyEase,\n        transitionProperty: 'transform',\n        '@media screen and (prefers-reduced-motion: reduce)': {\n            transitionDuration: '0.01ms'\n        }\n    }\n});\nconst useIndicatorStyles = makeStyles({\n    labelAbove: {\n        marginTop: 0\n    }\n});\nconst useInputBaseClassName = makeResetStyles({\n    boxSizing: 'border-box',\n    cursor: 'pointer',\n    height: '100%',\n    margin: 0,\n    opacity: 0,\n    position: 'absolute',\n    // Calculate the width of the hidden input by taking into account the size of the indicator + the padding around it.\n    // This is done so that clicking on that \"empty space\" still toggles the switch.\n    width: `calc(${trackWidth}px + 2 * ${tokens.spacingHorizontalS})`,\n    // Checked (both enabled and disabled)\n    ':checked': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            '> *': {\n                transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`\n            }\n        }\n    },\n    // Disabled (both checked and unchecked)\n    ':disabled': {\n        cursor: 'default',\n        [`& ~ .${switchClassNames.indicator}`]: {\n            color: tokens.colorNeutralForegroundDisabled\n        },\n        [`& ~ .${switchClassNames.label}`]: {\n            cursor: 'default',\n            color: tokens.colorNeutralForegroundDisabled\n        }\n    },\n    // Enabled and unchecked\n    ':enabled:not(:checked)': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            color: tokens.colorNeutralStrokeAccessible,\n            borderColor: tokens.colorNeutralStrokeAccessible\n        },\n        [`& ~ .${switchClassNames.label}`]: {\n            color: tokens.colorNeutralForeground1\n        },\n        ':hover': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                color: tokens.colorNeutralStrokeAccessibleHover,\n                borderColor: tokens.colorNeutralStrokeAccessibleHover\n            }\n        },\n        ':hover:active': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                color: tokens.colorNeutralStrokeAccessiblePressed,\n                borderColor: tokens.colorNeutralStrokeAccessiblePressed\n            }\n        }\n    },\n    // Enabled and checked\n    ':enabled:checked': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            backgroundColor: tokens.colorCompoundBrandBackground,\n            color: tokens.colorNeutralForegroundInverted,\n            borderColor: tokens.colorTransparentStroke\n        },\n        ':hover': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n                borderColor: tokens.colorTransparentStrokeInteractive\n            }\n        },\n        ':hover:active': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n                borderColor: tokens.colorTransparentStrokeInteractive\n            }\n        }\n    },\n    // Disabled and unchecked\n    ':disabled:not(:checked)': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            borderColor: tokens.colorNeutralStrokeDisabled\n        }\n    },\n    // Disabled and checked\n    ':disabled:checked': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            backgroundColor: tokens.colorNeutralBackgroundDisabled,\n            borderColor: tokens.colorTransparentStrokeDisabled\n        }\n    },\n    '@media (forced-colors: active)': {\n        ':disabled': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                color: 'GrayText',\n                borderColor: 'GrayText'\n            },\n            [`& ~ .${switchClassNames.label}`]: {\n                color: 'GrayText'\n            }\n        },\n        ':enabled:checked': {\n            ':hover': {\n                [`& ~ .${switchClassNames.indicator}`]: {\n                    backgroundColor: 'Highlight',\n                    color: 'Canvas'\n                }\n            },\n            [`& ~ .${switchClassNames.indicator}`]: {\n                backgroundColor: 'Highlight',\n                color: 'Canvas'\n            }\n        }\n    }\n});\nconst useInputStyles = makeStyles({\n    before: {\n        right: 0,\n        top: 0\n    },\n    after: {\n        left: 0,\n        top: 0\n    },\n    above: {\n        bottom: 0,\n        height: `calc(${trackHeight}px + ${tokens.spacingVerticalS})`,\n        width: '100%'\n    }\n});\n// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.\nconst useLabelStyles = makeStyles({\n    base: {\n        cursor: 'pointer',\n        // Use a (negative) margin to account for the difference between the track's height and the label's line height.\n        // This prevents the label from expanding the height of the switch, but preserves line height if the label wraps.\n        marginBottom: `calc((${trackHeight}px - ${tokens.lineHeightBase300}) / 2)`,\n        marginTop: `calc((${trackHeight}px - ${tokens.lineHeightBase300}) / 2)`,\n        ...shorthands.padding(tokens.spacingVerticalS, tokens.spacingHorizontalS)\n    },\n    above: {\n        paddingTop: tokens.spacingVerticalXS,\n        paddingBottom: tokens.spacingVerticalXS,\n        width: '100%'\n    },\n    after: {\n        paddingLeft: tokens.spacingHorizontalXS\n    },\n    before: {\n        paddingRight: tokens.spacingHorizontalXS\n    }\n});\n/**\n * Apply styling to the Switch slots based on the state\n */ export const useSwitchStyles_unstable = (state)=>{\n    const rootBaseClassName = useRootBaseClassName();\n    const rootStyles = useRootStyles();\n    const indicatorBaseClassName = useIndicatorBaseClassName();\n    const indicatorStyles = useIndicatorStyles();\n    const inputBaseClassName = useInputBaseClassName();\n    const inputStyles = useInputStyles();\n    const labelStyles = useLabelStyles();\n    const { label , labelPosition  } = state;\n    state.root.className = mergeClasses(switchClassNames.root, rootBaseClassName, labelPosition === 'above' && rootStyles.vertical, state.root.className);\n    state.indicator.className = mergeClasses(switchClassNames.indicator, indicatorBaseClassName, label && labelPosition === 'above' && indicatorStyles.labelAbove, state.indicator.className);\n    state.input.className = mergeClasses(switchClassNames.input, inputBaseClassName, label && inputStyles[labelPosition], state.input.className);\n    if (state.label) {\n        state.label.className = mergeClasses(switchClassNames.label, labelStyles.base, labelStyles[labelPosition], state.label.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,yBAAyB;AACjE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAAAC,aAAA,EAAAC,QAAA,EAAsCC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACtF,OAAO,MAAMC,gBAAgB,GAAG;EAC5BC,IAAI,EAAE,YAAY;EAClBC,SAAS,EAAE,uBAAuB;EAClCC,KAAK,EAAE,mBAAmB;EAC1BC,KAAK,EAAE;AACX,CAAC;AACD;AACA;AACA;AAAI,OAAO,MAAMC,eAAe,GAAGL,gBAAgB,CAACC,IAAI;AACxD;AACA,MAAMK,yBAAyB,GAAG,CAAC;AACnC,MAAMC,WAAW,GAAG,EAAE;AACtB,MAAMC,UAAU,GAAG,EAAE;AACrB,MAAMC,SAAS,GAAGF,WAAW,GAAGD,yBAAyB;AACzD,MAAMI,oBAAoB,gBAAGd,aAAA,ytEAS5B,CAAC;AACF,MAAMe,aAAa,gBAAGd,QAAA;EAAAe,QAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAIrB,CAAC;AACF,MAAMC,yBAAyB,gBAAGnB,aAAA;EAAAoB,CAAA;EAAAC,CAAA;AAAA,CA0BjC,CAAC;AACF,MAAMC,kBAAkB,gBAAGrB,QAAA;EAAAsB,UAAA;IAAAC,OAAA;EAAA;AAAA;EAAAN,CAAA;AAAA,CAI1B,CAAC;AACF,MAAMO,qBAAqB,gBAAGzB,aAAA;EAAAoB,CAAA;EAAAC,CAAA;AAAA,CA2G7B,CAAC;AACF,MAAMK,cAAc,gBAAGzB,QAAA;EAAA0B,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,KAAA;IAAAC,MAAA;IAAAF,OAAA;EAAA;EAAAG,KAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAjB,CAAA;AAAA,CActB,CAAC;AACF;AACA,MAAMkB,cAAc,gBAAGnC,QAAA;EAAAoC,IAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAf,OAAA;IAAAgB,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAX,KAAA;IAAAQ,MAAA;IAAAE,OAAA;IAAAP,MAAA;EAAA;EAAAL,KAAA;IAAAa,MAAA;EAAA;EAAAhB,MAAA;IAAAc,MAAA;EAAA;AAAA;EAAAvB,CAAA;AAAA,CAoBtB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAM0B,wBAAwB,GAAIC,KAAK,IAAG;EACjD,MAAMC,iBAAiB,GAAGhC,oBAAoB,CAAC,CAAC;EAChD,MAAMiC,UAAU,GAAGhC,aAAa,CAAC,CAAC;EAClC,MAAMiC,sBAAsB,GAAG7B,yBAAyB,CAAC,CAAC;EAC1D,MAAM8B,eAAe,GAAG3B,kBAAkB,CAAC,CAAC;EAC5C,MAAM4B,kBAAkB,GAAGzB,qBAAqB,CAAC,CAAC;EAClD,MAAM0B,WAAW,GAAGzB,cAAc,CAAC,CAAC;EACpC,MAAM0B,WAAW,GAAGhB,cAAc,CAAC,CAAC;EACpC,MAAM;IAAE5B,KAAK;IAAG6C;EAAe,CAAC,GAAGR,KAAK;EACxCA,KAAK,CAACxC,IAAI,CAACiD,SAAS,GAAGpD,YAAY,CAACE,gBAAgB,CAACC,IAAI,EAAEyC,iBAAiB,EAAEO,aAAa,KAAK,OAAO,IAAIN,UAAU,CAAC/B,QAAQ,EAAE6B,KAAK,CAACxC,IAAI,CAACiD,SAAS,CAAC;EACrJT,KAAK,CAACvC,SAAS,CAACgD,SAAS,GAAGpD,YAAY,CAACE,gBAAgB,CAACE,SAAS,EAAE0C,sBAAsB,EAAExC,KAAK,IAAI6C,aAAa,KAAK,OAAO,IAAIJ,eAAe,CAAC1B,UAAU,EAAEsB,KAAK,CAACvC,SAAS,CAACgD,SAAS,CAAC;EACzLT,KAAK,CAACtC,KAAK,CAAC+C,SAAS,GAAGpD,YAAY,CAACE,gBAAgB,CAACG,KAAK,EAAE2C,kBAAkB,EAAE1C,KAAK,IAAI2C,WAAW,CAACE,aAAa,CAAC,EAAER,KAAK,CAACtC,KAAK,CAAC+C,SAAS,CAAC;EAC5I,IAAIT,KAAK,CAACrC,KAAK,EAAE;IACbqC,KAAK,CAACrC,KAAK,CAAC8C,SAAS,GAAGpD,YAAY,CAACE,gBAAgB,CAACI,KAAK,EAAE4C,WAAW,CAACf,IAAI,EAAEe,WAAW,CAACC,aAAa,CAAC,EAAER,KAAK,CAACrC,KAAK,CAAC8C,SAAS,CAAC;EACrI;EACA,OAAOT,KAAK;AAChB,CAAC"}
+{"version":3,"names":["createFocusOutlineStyle","tokens","__resetStyles","__styles","mergeClasses","shorthands","switchClassNames","root","indicator","input","label","switchClassName","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useRootBaseClassName","useRootStyles","vertical","Beiy3e4","d","useIndicatorBaseClassName","r","s","useIndicatorStyles","labelAbove","B6of3ja","useInputBaseClassName","useInputStyles","before","j35jbq","Bhzewxz","after","oyh7mz","above","B5kzvoi","Bqenvij","a9b677","useLabelStyles","base","Bceei9c","jrapky","z8tnut","z189sj","Byoj8tv","uwmqm3","useSwitchStyles_unstable","state","rootBaseClassName","rootStyles","indicatorBaseClassName","indicatorStyles","inputBaseClassName","inputStyles","labelStyles","labelPosition","className"],"sources":["useSwitchStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nexport const switchClassNames = {\n    root: 'fui-Switch',\n    indicator: 'fui-Switch__indicator',\n    input: 'fui-Switch__input',\n    label: 'fui-Switch__label'\n};\n/**\n * @deprecated Use `switchClassNames.root` instead.\n */ export const switchClassName = switchClassNames.root;\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\nconst useRootBaseClassName = makeResetStyles({\n    alignItems: 'flex-start',\n    boxSizing: 'border-box',\n    display: 'inline-flex',\n    position: 'relative',\n    ...createFocusOutlineStyle({\n        style: {},\n        selector: 'focus-within'\n    })\n});\nconst useRootStyles = makeStyles({\n    vertical: {\n        flexDirection: 'column'\n    }\n});\nconst useIndicatorBaseClassName = makeResetStyles({\n    borderRadius: tokens.borderRadiusCircular,\n    border: '1px solid',\n    lineHeight: 0,\n    boxSizing: 'border-box',\n    fill: 'currentColor',\n    flexShrink: 0,\n    fontSize: `${thumbSize}px`,\n    height: `${trackHeight}px`,\n    margin: tokens.spacingVerticalS + ' ' + tokens.spacingHorizontalS,\n    pointerEvents: 'none',\n    transitionDuration: tokens.durationNormal,\n    transitionTimingFunction: tokens.curveEasyEase,\n    transitionProperty: 'background, border, color',\n    width: `${trackWidth}px`,\n    '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms'\n    },\n    '> *': {\n        transitionDuration: tokens.durationNormal,\n        transitionTimingFunction: tokens.curveEasyEase,\n        transitionProperty: 'transform',\n        '@media screen and (prefers-reduced-motion: reduce)': {\n            transitionDuration: '0.01ms'\n        }\n    }\n});\nconst useIndicatorStyles = makeStyles({\n    labelAbove: {\n        marginTop: 0\n    }\n});\nconst useInputBaseClassName = makeResetStyles({\n    boxSizing: 'border-box',\n    cursor: 'pointer',\n    height: '100%',\n    margin: 0,\n    opacity: 0,\n    position: 'absolute',\n    // Calculate the width of the hidden input by taking into account the size of the indicator + the padding around it.\n    // This is done so that clicking on that \"empty space\" still toggles the switch.\n    width: `calc(${trackWidth}px + 2 * ${tokens.spacingHorizontalS})`,\n    // Checked (both enabled and disabled)\n    ':checked': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            '> *': {\n                transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`\n            }\n        }\n    },\n    // Disabled (both checked and unchecked)\n    ':disabled': {\n        cursor: 'default',\n        [`& ~ .${switchClassNames.indicator}`]: {\n            color: tokens.colorNeutralForegroundDisabled\n        },\n        [`& ~ .${switchClassNames.label}`]: {\n            cursor: 'default',\n            color: tokens.colorNeutralForegroundDisabled\n        }\n    },\n    // Enabled and unchecked\n    ':enabled:not(:checked)': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            color: tokens.colorNeutralStrokeAccessible,\n            borderColor: tokens.colorNeutralStrokeAccessible\n        },\n        [`& ~ .${switchClassNames.label}`]: {\n            color: tokens.colorNeutralForeground1\n        },\n        ':hover': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                color: tokens.colorNeutralStrokeAccessibleHover,\n                borderColor: tokens.colorNeutralStrokeAccessibleHover\n            }\n        },\n        ':hover:active': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                color: tokens.colorNeutralStrokeAccessiblePressed,\n                borderColor: tokens.colorNeutralStrokeAccessiblePressed\n            }\n        }\n    },\n    // Enabled and checked\n    ':enabled:checked': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            backgroundColor: tokens.colorCompoundBrandBackground,\n            color: tokens.colorNeutralForegroundInverted,\n            borderColor: tokens.colorTransparentStroke\n        },\n        ':hover': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n                borderColor: tokens.colorTransparentStrokeInteractive\n            }\n        },\n        ':hover:active': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n                borderColor: tokens.colorTransparentStrokeInteractive\n            }\n        }\n    },\n    // Disabled and unchecked\n    ':disabled:not(:checked)': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            borderColor: tokens.colorNeutralStrokeDisabled\n        }\n    },\n    // Disabled and checked\n    ':disabled:checked': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n            backgroundColor: tokens.colorNeutralBackgroundDisabled,\n            borderColor: tokens.colorTransparentStrokeDisabled\n        }\n    },\n    '@media (forced-colors: active)': {\n        ':disabled': {\n            [`& ~ .${switchClassNames.indicator}`]: {\n                color: 'GrayText',\n                borderColor: 'GrayText'\n            },\n            [`& ~ .${switchClassNames.label}`]: {\n                color: 'GrayText'\n            }\n        },\n        ':enabled:checked': {\n            ':hover': {\n                [`& ~ .${switchClassNames.indicator}`]: {\n                    backgroundColor: 'Highlight',\n                    color: 'Canvas'\n                }\n            },\n            [`& ~ .${switchClassNames.indicator}`]: {\n                backgroundColor: 'Highlight',\n                color: 'Canvas'\n            }\n        }\n    }\n});\nconst useInputStyles = makeStyles({\n    before: {\n        right: 0,\n        top: 0\n    },\n    after: {\n        left: 0,\n        top: 0\n    },\n    above: {\n        bottom: 0,\n        height: `calc(${trackHeight}px + ${tokens.spacingVerticalS})`,\n        width: '100%'\n    }\n});\n// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.\nconst useLabelStyles = makeStyles({\n    base: {\n        cursor: 'pointer',\n        // Use a (negative) margin to account for the difference between the track's height and the label's line height.\n        // This prevents the label from expanding the height of the switch, but preserves line height if the label wraps.\n        marginBottom: `calc((${trackHeight}px - ${tokens.lineHeightBase300}) / 2)`,\n        marginTop: `calc((${trackHeight}px - ${tokens.lineHeightBase300}) / 2)`,\n        ...shorthands.padding(tokens.spacingVerticalS, tokens.spacingHorizontalS)\n    },\n    above: {\n        paddingTop: tokens.spacingVerticalXS,\n        paddingBottom: tokens.spacingVerticalXS,\n        width: '100%'\n    },\n    after: {\n        paddingLeft: tokens.spacingHorizontalXS\n    },\n    before: {\n        paddingRight: tokens.spacingHorizontalXS\n    }\n});\n/**\n * Apply styling to the Switch slots based on the state\n */ export const useSwitchStyles_unstable = (state)=>{\n    const rootBaseClassName = useRootBaseClassName();\n    const rootStyles = useRootStyles();\n    const indicatorBaseClassName = useIndicatorBaseClassName();\n    const indicatorStyles = useIndicatorStyles();\n    const inputBaseClassName = useInputBaseClassName();\n    const inputStyles = useInputStyles();\n    const labelStyles = useLabelStyles();\n    const { label, labelPosition } = state;\n    state.root.className = mergeClasses(switchClassNames.root, rootBaseClassName, labelPosition === 'above' && rootStyles.vertical, state.root.className);\n    state.indicator.className = mergeClasses(switchClassNames.indicator, indicatorBaseClassName, label && labelPosition === 'above' && indicatorStyles.labelAbove, state.indicator.className);\n    state.input.className = mergeClasses(switchClassNames.input, inputBaseClassName, label && inputStyles[labelPosition], state.input.className);\n    if (state.label) {\n        state.label.className = mergeClasses(switchClassNames.label, labelStyles.base, labelStyles[labelPosition], state.label.className);\n    }\n    return state;\n};\n"],"mappings":"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"}

package/lib-commonjs/Switch.js

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
-_exportStar(require("./components/Switch/index"), exports);
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/Switch/index"), exports);

package/lib-commonjs/Switch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Switch.js"],"sourcesContent":["export * from './components/Switch/index';\n"],"names":[],"mappings":";;;;;oBAAc"}
+{"version":3,"sources":["Switch.js"],"sourcesContent":["export * from './components/Switch/index';\n"],"names":[],"mappings":";;;;;uBAAc"}

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

@@ -4,18 +4,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Switch", {
     enumerable: true,
-    get: ()=>Switch
+    get: function() {
+        return Switch;
+    }
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _useSwitch = require("./useSwitch");
 const _renderSwitch = require("./renderSwitch");
-const _useSwitchStylesStyles = require("./useSwitchStyles.styles");
-const _reactSharedContexts = require("@fluentui/react-shared-contexts");
+const _useSwitchStylesstyles = require("./useSwitchStyles.styles");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const Switch = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useSwitch.useSwitch_unstable)(props, ref);
-    (0, _useSwitchStylesStyles.useSwitchStyles_unstable)(state);
-    (0, _reactSharedContexts.useCustomStyleHook_unstable)('useSwitchStyles_unstable')(state);
+    (0, _useSwitchStylesstyles.useSwitchStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useSwitchStyles_unstable')(state);
     return (0, _renderSwitch.renderSwitch_unstable)(state);
 });
 Switch.displayName = 'Switch';

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

@@ -1 +1 @@
-{"version":3,"sources":["Switch.js"],"sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * Switches enable users to trigger an option on or off through pressing the component.\n */ export const Switch = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useSwitch_unstable(props, ref);\n    useSwitchStyles_unstable(state);\n    useCustomStyleHook_unstable('useSwitchStyles_unstable')(state);\n    return renderSwitch_unstable(state);\n});\nSwitch.displayName = 'Switch';\n"],"names":["Switch","React","forwardRef","props","ref","state","useSwitch_unstable","useSwitchStyles_unstable","useCustomStyleHook_unstable","renderSwitch_unstable","displayName"],"mappings":";;;;+BAOiBA;;aAAAA;;;6DAPM;2BACY;8BACG;uCACG;qCACG;AAGjC,MAAMA,SAAS,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACnE,MAAMC,QAAQC,IAAAA,6BAAkB,EAACH,OAAOC;IACxCG,IAAAA,+CAAwB,EAACF;IACzBG,IAAAA,gDAA2B,EAAC,4BAA4BH;IACxD,OAAOI,IAAAA,mCAAqB,EAACJ;AACjC;AACAL,OAAOU,WAAW,GAAG"}
+{"version":3,"sources":["Switch.js"],"sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * Switches enable users to trigger an option on or off through pressing the component.\n */ export const Switch = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useSwitch_unstable(props, ref);\n    useSwitchStyles_unstable(state);\n    useCustomStyleHook_unstable('useSwitchStyles_unstable')(state);\n    return renderSwitch_unstable(state);\n});\nSwitch.displayName = 'Switch';\n"],"names":["Switch","React","forwardRef","props","ref","state","useSwitch_unstable","useSwitchStyles_unstable","useCustomStyleHook_unstable","renderSwitch_unstable","displayName"],"mappings":";;;;+BAOiBA;;;eAAAA;;;;iEAPM;2BACY;8BACG;uCACG;qCACG;AAGjC,MAAMA,SAAS,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC7D,MAAMC,QAAQC,IAAAA,6BAAkB,EAACH,OAAOC;IACxCG,IAAAA,+CAAwB,EAACF;IACzBG,IAAAA,gDAA2B,EAAC,4BAA4BH;IACxD,OAAOI,IAAAA,mCAAqB,EAACJ;AACjC;AACAL,OAAOU,WAAW,GAAG"}

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

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

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

@@ -1 +1 @@
-{"version":3,"sources":["Switch.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;6DAAuB"}
+{"version":3,"sources":["Switch.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;iEAAuB"}

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

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
-_exportStar(require("./Switch"), exports);
-_exportStar(require("./Switch.types"), exports);
-_exportStar(require("./renderSwitch"), exports);
-_exportStar(require("./useSwitch"), exports);
-_exportStar(require("./useSwitchStyles.styles"), exports);
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./Switch"), exports);
+_export_star._(require("./Switch.types"), exports);
+_export_star._(require("./renderSwitch"), exports);
+_export_star._(require("./useSwitch"), exports);
+_export_star._(require("./useSwitchStyles.styles"), exports);

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

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles.styles';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA"}
+{"version":3,"sources":["index.js"],"sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles.styles';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}

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

@@ -1,15 +1,24 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
 Object.defineProperty(exports, "renderSwitch_unstable", {
     enumerable: true,
-    get: ()=>renderSwitch_unstable
+    get: function() {
+        return renderSwitch_unstable;
+    }
 });
-const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
-const _reactUtilities = require("@fluentui/react-utilities");
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactutilities = require("@fluentui/react-utilities");
 const renderSwitch_unstable = (state)=>{
-    (0, _reactUtilities.assertSlots)(state);
-    const { labelPosition  } = state;
-    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.input, null), labelPosition !== 'after' && state.label && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.label, null), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.indicator, null), labelPosition === 'after' && state.label && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.label, null));
+    (0, _reactutilities.assertSlots)(state);
+    const { labelPosition } = state;
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(state.input, {}),
+            labelPosition !== 'after' && state.label && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.label, {}),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(state.indicator, {}),
+            labelPosition === 'after' && state.label && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.label, {})
+        ]
+    });
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["renderSwitch.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render a Switch component by passing the state defined props to the appropriate slots.\n */ export const renderSwitch_unstable = (state)=>{\n    assertSlots(state);\n    const { labelPosition  } = state;\n    return /*#__PURE__*/ createElement(state.root, null, /*#__PURE__*/ createElement(state.input, null), labelPosition !== 'after' && state.label && /*#__PURE__*/ createElement(state.label, null), /*#__PURE__*/ createElement(state.indicator, null), labelPosition === 'after' && state.label && /*#__PURE__*/ createElement(state.label, null));\n};\n"],"names":["renderSwitch_unstable","state","assertSlots","labelPosition","createElement","root","input","label","indicator"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACvD;AAGjB,MAAMA,wBAAwB,CAACC,QAAQ;IAC9CC,IAAAA,2BAAW,EAACD;IACZ,MAAM,EAAEE,cAAa,EAAG,GAAGF;IAC3B,OAAO,WAAW,GAAGG,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAE,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACH,MAAMK,KAAK,EAAE,IAAI,GAAGH,kBAAkB,WAAWF,MAAMM,KAAK,IAAI,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMM,KAAK,EAAE,IAAI,GAAG,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMO,SAAS,EAAE,IAAI,GAAGL,kBAAkB,WAAWF,MAAMM,KAAK,IAAI,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMM,KAAK,EAAE,IAAI;AAClV"}
+{"version":3,"sources":["renderSwitch.js"],"sourcesContent":["/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx, jsxs as _jsxs } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render a Switch component by passing the state defined props to the appropriate slots.\n */ export const renderSwitch_unstable = (state)=>{\n    assertSlots(state);\n    const { labelPosition } = state;\n    return /*#__PURE__*/ _jsxs(state.root, {\n        children: [\n            /*#__PURE__*/ _jsx(state.input, {}),\n            labelPosition !== 'after' && state.label && /*#__PURE__*/ _jsx(state.label, {}),\n            /*#__PURE__*/ _jsx(state.indicator, {}),\n            labelPosition === 'after' && state.label && /*#__PURE__*/ _jsx(state.label, {})\n        ]\n    });\n};\n"],"names":["renderSwitch_unstable","state","assertSlots","labelPosition","_jsxs","root","children","_jsx","input","label","indicator"],"mappings":"AAAA,0BAA0B,GAAG,iDAAiD;;;;+BAI7DA;;;eAAAA;;;4BAJ2G;gCAChG;AAGjB,MAAMA,wBAAwB,CAACC;IACtCC,IAAAA,2BAAW,EAACD;IACZ,MAAM,EAAEE,aAAa,EAAE,GAAGF;IAC1B,OAAO,WAAW,GAAGG,IAAAA,gBAAK,EAACH,MAAMI,IAAI,EAAE;QACnCC,UAAU;YACN,WAAW,GAAGC,IAAAA,eAAI,EAACN,MAAMO,KAAK,EAAE,CAAC;YACjCL,kBAAkB,WAAWF,MAAMQ,KAAK,IAAI,WAAW,GAAGF,IAAAA,eAAI,EAACN,MAAMQ,KAAK,EAAE,CAAC;YAC7E,WAAW,GAAGF,IAAAA,eAAI,EAACN,MAAMS,SAAS,EAAE,CAAC;YACrCP,kBAAkB,WAAWF,MAAMQ,KAAK,IAAI,WAAW,GAAGF,IAAAA,eAAI,EAACN,MAAMQ,KAAK,EAAE,CAAC;SAChF;IACL;AACJ"}

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

@@ -4,23 +4,25 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "useSwitch_unstable", {
     enumerable: true,
-    get: ()=>useSwitch_unstable
+    get: function() {
+        return useSwitch_unstable;
+    }
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _reactField = require("@fluentui/react-field");
-const _reactIcons = require("@fluentui/react-icons");
-const _reactLabel = require("@fluentui/react-label");
-const _reactTabster = require("@fluentui/react-tabster");
-const _reactUtilities = require("@fluentui/react-utilities");
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactfield = require("@fluentui/react-field");
+const _reacticons = require("@fluentui/react-icons");
+const _reactlabel = require("@fluentui/react-label");
+const _reacttabster = require("@fluentui/react-tabster");
+const _reactutilities = require("@fluentui/react-utilities");
 const useSwitch_unstable = (props, ref)=>{
     // Merge props from surrounding <Field>, if any
-    props = (0, _reactField.useFieldControlProps_unstable)(props, {
+    props = (0, _reactfield.useFieldControlProps_unstable)(props, {
         supportsLabelFor: true,
         supportsRequired: true
     });
-    const { checked , defaultChecked , disabled , labelPosition ='after' , onChange , required  } = props;
-    const nativeProps = (0, _reactUtilities.getPartitionedNativeProps)({
+    const { checked, defaultChecked, disabled, labelPosition = 'after', onChange, required } = props;
+    const nativeProps = (0, _reactutilities.getPartitionedNativeProps)({
         props,
         primarySlotTagName: 'input',
         excludedPropNames: [
@@ -29,22 +31,22 @@ const useSwitch_unstable = (props, ref)=>{
             'onChange'
         ]
     });
-    const id = (0, _reactUtilities.useId)('switch-', nativeProps.primary.id);
-    const root = _reactUtilities.slot.always(props.root, {
+    const id = (0, _reactutilities.useId)('switch-', nativeProps.primary.id);
+    const root = _reactutilities.slot.always(props.root, {
         defaultProps: {
-            ref: (0, _reactTabster.useFocusWithin)(),
+            ref: (0, _reacttabster.useFocusWithin)(),
             ...nativeProps.root
         },
         elementType: 'div'
     });
-    const indicator = _reactUtilities.slot.always(props.indicator, {
+    const indicator = _reactutilities.slot.always(props.indicator, {
         defaultProps: {
             'aria-hidden': true,
-            children: /*#__PURE__*/ _react.createElement(_reactIcons.CircleFilled, null)
+            children: /*#__PURE__*/ _react.createElement(_reacticons.CircleFilled, null)
         },
         elementType: 'div'
     });
-    const input = _reactUtilities.slot.always(props.input, {
+    const input = _reactutilities.slot.always(props.input, {
         defaultProps: {
             checked,
             defaultChecked,
@@ -56,19 +58,20 @@ const useSwitch_unstable = (props, ref)=>{
         },
         elementType: 'input'
     });
-    input.onChange = (0, _reactUtilities.mergeCallbacks)(input.onChange, (ev)=>{
-        return onChange === null || onChange === void 0 ? void 0 : onChange(ev, {
+    input.onChange = (0, _reactutilities.mergeCallbacks)(input.onChange, (ev)=>{
+        var _onChange;
+        return (_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange(ev, {
             checked: ev.currentTarget.checked
         });
     });
-    const label = _reactUtilities.slot.optional(props.label, {
+    const label = _reactutilities.slot.optional(props.label, {
         defaultProps: {
             disabled,
             htmlFor: id,
             required,
             size: 'medium'
         },
-        elementType: _reactLabel.Label
+        elementType: _reactlabel.Label
     });
     return {
         labelPosition,
@@ -76,7 +79,7 @@ const useSwitch_unstable = (props, ref)=>{
             root: 'div',
             indicator: 'div',
             input: 'input',
-            label: _reactLabel.Label
+            label: _reactlabel.Label
         },
         root,
         indicator,

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

@@ -1 +1 @@
-{"version":3,"sources":["useSwitch.js"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render Switch.\n *\n * The returned state can be modified with hooks such as useSwitchStyles_unstable,\n * before being passed to renderSwitch_unstable.\n *\n * @param props - props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */ export const useSwitch_unstable = (props, ref)=>{\n    // Merge props from surrounding <Field>, if any\n    props = useFieldControlProps_unstable(props, {\n        supportsLabelFor: true,\n        supportsRequired: true\n    });\n    const { checked , defaultChecked , disabled , labelPosition ='after' , onChange , required  } = props;\n    const nativeProps = getPartitionedNativeProps({\n        props,\n        primarySlotTagName: 'input',\n        excludedPropNames: [\n            'checked',\n            'defaultChecked',\n            'onChange'\n        ]\n    });\n    const id = useId('switch-', nativeProps.primary.id);\n    const root = slot.always(props.root, {\n        defaultProps: {\n            ref: useFocusWithin(),\n            ...nativeProps.root\n        },\n        elementType: 'div'\n    });\n    const indicator = slot.always(props.indicator, {\n        defaultProps: {\n            'aria-hidden': true,\n            children: /*#__PURE__*/ React.createElement(CircleFilled, null)\n        },\n        elementType: 'div'\n    });\n    const input = slot.always(props.input, {\n        defaultProps: {\n            checked,\n            defaultChecked,\n            id,\n            ref,\n            role: 'switch',\n            type: 'checkbox',\n            ...nativeProps.primary\n        },\n        elementType: 'input'\n    });\n    input.onChange = mergeCallbacks(input.onChange, (ev)=>{\n        return onChange === null || onChange === void 0 ? void 0 : onChange(ev, {\n            checked: ev.currentTarget.checked\n        });\n    });\n    const label = slot.optional(props.label, {\n        defaultProps: {\n            disabled,\n            htmlFor: id,\n            required,\n            size: 'medium'\n        },\n        elementType: Label\n    });\n    return {\n        labelPosition,\n        components: {\n            root: 'div',\n            indicator: 'div',\n            input: 'input',\n            label: Label\n        },\n        root,\n        indicator,\n        input,\n        label\n    };\n};\n"],"names":["useSwitch_unstable","props","ref","useFieldControlProps_unstable","supportsLabelFor","supportsRequired","checked","defaultChecked","disabled","labelPosition","onChange","required","nativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","id","useId","primary","root","slot","always","defaultProps","useFocusWithin","elementType","indicator","children","React","createElement","CircleFilled","input","role","type","mergeCallbacks","ev","currentTarget","label","optional","htmlFor","size","Label","components"],"mappings":";;;;+BAciBA;;aAAAA;;;6DAdM;4BACuB;4BACjB;4BACP;8BACS;gCACwC;AAS5D,MAAMA,qBAAqB,CAACC,OAAOC,MAAM;IAChD,+CAA+C;IAC/CD,QAAQE,IAAAA,yCAA6B,EAACF,OAAO;QACzCG,kBAAkB,IAAI;QACtBC,kBAAkB,IAAI;IAC1B;IACA,MAAM,EAAEC,QAAO,EAAGC,eAAc,EAAGC,SAAQ,EAAGC,eAAe,QAAO,EAAGC,SAAQ,EAAGC,SAAQ,EAAG,GAAGV;IAChG,MAAMW,cAAcC,IAAAA,yCAAyB,EAAC;QAC1CZ;QACAa,oBAAoB;QACpBC,mBAAmB;YACf;YACA;YACA;SACH;IACL;IACA,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,WAAWL,YAAYM,OAAO,CAACF,EAAE;IAClD,MAAMG,OAAOC,oBAAI,CAACC,MAAM,CAACpB,MAAMkB,IAAI,EAAE;QACjCG,cAAc;YACVpB,KAAKqB,IAAAA,4BAAc;YACnB,GAAGX,YAAYO,IAAI;QACvB;QACAK,aAAa;IACjB;IACA,MAAMC,YAAYL,oBAAI,CAACC,MAAM,CAACpB,MAAMwB,SAAS,EAAE;QAC3CH,cAAc;YACV,eAAe,IAAI;YACnBI,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,wBAAY,EAAE,IAAI;QAClE;QACAL,aAAa;IACjB;IACA,MAAMM,QAAQV,oBAAI,CAACC,MAAM,CAACpB,MAAM6B,KAAK,EAAE;QACnCR,cAAc;YACVhB;YACAC;YACAS;YACAd;YACA6B,MAAM;YACNC,MAAM;YACN,GAAGpB,YAAYM,OAAO;QAC1B;QACAM,aAAa;IACjB;IACAM,MAAMpB,QAAQ,GAAGuB,IAAAA,8BAAc,EAACH,MAAMpB,QAAQ,EAAE,CAACwB,KAAK;QAClD,OAAOxB,aAAa,IAAI,IAAIA,aAAa,KAAK,IAAI,KAAK,IAAIA,SAASwB,IAAI;YACpE5B,SAAS4B,GAAGC,aAAa,CAAC7B,OAAO;QACrC,EAAE;IACN;IACA,MAAM8B,QAAQhB,oBAAI,CAACiB,QAAQ,CAACpC,MAAMmC,KAAK,EAAE;QACrCd,cAAc;YACVd;YACA8B,SAAStB;YACTL;YACA4B,MAAM;QACV;QACAf,aAAagB,iBAAK;IACtB;IACA,OAAO;QACH/B;QACAgC,YAAY;YACRtB,MAAM;YACNM,WAAW;YACXK,OAAO;YACPM,OAAOI,iBAAK;QAChB;QACArB;QACAM;QACAK;QACAM;IACJ;AACJ"}
+{"version":3,"sources":["useSwitch.js"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render Switch.\n *\n * The returned state can be modified with hooks such as useSwitchStyles_unstable,\n * before being passed to renderSwitch_unstable.\n *\n * @param props - props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */ export const useSwitch_unstable = (props, ref)=>{\n    // Merge props from surrounding <Field>, if any\n    props = useFieldControlProps_unstable(props, {\n        supportsLabelFor: true,\n        supportsRequired: true\n    });\n    const { checked, defaultChecked, disabled, labelPosition = 'after', onChange, required } = props;\n    const nativeProps = getPartitionedNativeProps({\n        props,\n        primarySlotTagName: 'input',\n        excludedPropNames: [\n            'checked',\n            'defaultChecked',\n            'onChange'\n        ]\n    });\n    const id = useId('switch-', nativeProps.primary.id);\n    const root = slot.always(props.root, {\n        defaultProps: {\n            ref: useFocusWithin(),\n            ...nativeProps.root\n        },\n        elementType: 'div'\n    });\n    const indicator = slot.always(props.indicator, {\n        defaultProps: {\n            'aria-hidden': true,\n            children: /*#__PURE__*/ React.createElement(CircleFilled, null)\n        },\n        elementType: 'div'\n    });\n    const input = slot.always(props.input, {\n        defaultProps: {\n            checked,\n            defaultChecked,\n            id,\n            ref,\n            role: 'switch',\n            type: 'checkbox',\n            ...nativeProps.primary\n        },\n        elementType: 'input'\n    });\n    input.onChange = mergeCallbacks(input.onChange, (ev)=>{\n        var _onChange;\n        return (_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange(ev, {\n            checked: ev.currentTarget.checked\n        });\n    });\n    const label = slot.optional(props.label, {\n        defaultProps: {\n            disabled,\n            htmlFor: id,\n            required,\n            size: 'medium'\n        },\n        elementType: Label\n    });\n    return {\n        labelPosition,\n        components: {\n            root: 'div',\n            indicator: 'div',\n            input: 'input',\n            label: Label\n        },\n        root,\n        indicator,\n        input,\n        label\n    };\n};\n"],"names":["useSwitch_unstable","props","ref","useFieldControlProps_unstable","supportsLabelFor","supportsRequired","checked","defaultChecked","disabled","labelPosition","onChange","required","nativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","id","useId","primary","root","slot","always","defaultProps","useFocusWithin","elementType","indicator","children","React","createElement","CircleFilled","input","role","type","mergeCallbacks","ev","_onChange","currentTarget","label","optional","htmlFor","size","Label","components"],"mappings":";;;;+BAciBA;;;eAAAA;;;;iEAdM;4BACuB;4BACjB;4BACP;8BACS;gCACwC;AAS5D,MAAMA,qBAAqB,CAACC,OAAOC;IAC1C,+CAA+C;IAC/CD,QAAQE,IAAAA,yCAA6B,EAACF,OAAO;QACzCG,kBAAkB;QAClBC,kBAAkB;IACtB;IACA,MAAM,EAAEC,OAAO,EAAEC,cAAc,EAAEC,QAAQ,EAAEC,gBAAgB,OAAO,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGV;IAC3F,MAAMW,cAAcC,IAAAA,yCAAyB,EAAC;QAC1CZ;QACAa,oBAAoB;QACpBC,mBAAmB;YACf;YACA;YACA;SACH;IACL;IACA,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,WAAWL,YAAYM,OAAO,CAACF,EAAE;IAClD,MAAMG,OAAOC,oBAAI,CAACC,MAAM,CAACpB,MAAMkB,IAAI,EAAE;QACjCG,cAAc;YACVpB,KAAKqB,IAAAA,4BAAc;YACnB,GAAGX,YAAYO,IAAI;QACvB;QACAK,aAAa;IACjB;IACA,MAAMC,YAAYL,oBAAI,CAACC,MAAM,CAACpB,MAAMwB,SAAS,EAAE;QAC3CH,cAAc;YACV,eAAe;YACfI,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,wBAAY,EAAE;QAC9D;QACAL,aAAa;IACjB;IACA,MAAMM,QAAQV,oBAAI,CAACC,MAAM,CAACpB,MAAM6B,KAAK,EAAE;QACnCR,cAAc;YACVhB;YACAC;YACAS;YACAd;YACA6B,MAAM;YACNC,MAAM;YACN,GAAGpB,YAAYM,OAAO;QAC1B;QACAM,aAAa;IACjB;IACAM,MAAMpB,QAAQ,GAAGuB,IAAAA,8BAAc,EAACH,MAAMpB,QAAQ,EAAE,CAACwB;QAC7C,IAAIC;QACJ,OAAO,AAACA,CAAAA,YAAYzB,QAAO,MAAO,QAAQyB,cAAc,KAAK,IAAI,KAAK,IAAIA,UAAUD,IAAI;YACpF5B,SAAS4B,GAAGE,aAAa,CAAC9B,OAAO;QACrC;IACJ;IACA,MAAM+B,QAAQjB,oBAAI,CAACkB,QAAQ,CAACrC,MAAMoC,KAAK,EAAE;QACrCf,cAAc;YACVd;YACA+B,SAASvB;YACTL;YACA6B,MAAM;QACV;QACAhB,aAAaiB,iBAAK;IACtB;IACA,OAAO;QACHhC;QACAiC,YAAY;YACRvB,MAAM;YACNM,WAAW;YACXK,OAAO;YACPO,OAAOI,iBAAK;QAChB;QACAtB;QACAM;QACAK;QACAO;IACJ;AACJ"}

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

@@ -9,9 +9,15 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    switchClassNames: ()=>switchClassNames,
-    switchClassName: ()=>switchClassName,
-    useSwitchStyles_unstable: ()=>useSwitchStyles_unstable
+    switchClassNames: function() {
+        return switchClassNames;
+    },
+    switchClassName: function() {
+        return switchClassName;
+    },
+    useSwitchStyles_unstable: function() {
+        return useSwitchStyles_unstable;
+    }
 });
 const _react = require("@griffel/react");
 const switchClassNames = {
@@ -26,7 +32,7 @@ const spaceBetweenThumbAndTrack = 2;
 const trackHeight = 20;
 const trackWidth = 40;
 const thumbSize = trackHeight - spaceBetweenThumbAndTrack;
-const useRootBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("rugt7u1", "rqv95o1", [
+const useRootBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("rugt7u1", "rqv95o1", [
     ".rugt7u1{align-items:flex-start;box-sizing:border-box;display:inline-flex;position:relative;}",
     ".rugt7u1:focus{outline-style:none;}",
     ".rugt7u1:focus-visible{outline-style:none;}",
@@ -38,7 +44,7 @@ const useRootBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("rugt7u1
     ".rqv95o1[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
     ".rqv95o1[data-fui-focus-within]:focus-within::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
 ]);
-const useRootStyles = /*#__PURE__*/ (0, _react["__styles"])({
+const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
     vertical: {
         Beiy3e4: "f1vx9l62"
     }
@@ -47,7 +53,7 @@ const useRootStyles = /*#__PURE__*/ (0, _react["__styles"])({
         ".f1vx9l62{flex-direction:column;}"
     ]
 });
-const useIndicatorBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("r13wlxb8", null, {
+const useIndicatorBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r13wlxb8", null, {
     r: [
         ".r13wlxb8{border-radius:var(--borderRadiusCircular);border:1px solid;line-height:0;box-sizing:border-box;fill:currentColor;flex-shrink:0;font-size:18px;height:20px;margin:var(--spacingVerticalS) var(--spacingHorizontalS);pointer-events:none;transition-duration:var(--durationNormal);transition-timing-function:var(--curveEasyEase);transition-property:background,border,color;width:40px;}",
         ".r13wlxb8>*{transition-duration:var(--durationNormal);transition-timing-function:var(--curveEasyEase);transition-property:transform;}"
@@ -57,7 +63,7 @@ const useIndicatorBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("r1
         "@media screen and (prefers-reduced-motion: reduce){.r13wlxb8>*{transition-duration:0.01ms;}}"
     ]
 });
-const useIndicatorStyles = /*#__PURE__*/ (0, _react["__styles"])({
+const useIndicatorStyles = /*#__PURE__*/ (0, _react.__styles)({
     labelAbove: {
         B6of3ja: "f1hu3pq6"
     }
@@ -66,7 +72,7 @@ const useIndicatorStyles = /*#__PURE__*/ (0, _react["__styles"])({
         ".f1hu3pq6{margin-top:0;}"
     ]
 });
-const useInputBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("rw4brat", "r1f4bxyr", {
+const useInputBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("rw4brat", "r1f4bxyr", {
     r: [
         ".rw4brat{box-sizing:border-box;cursor:pointer;height:100%;margin:0;opacity:0;position:absolute;width:calc(40px + 2 * var(--spacingHorizontalS));}",
         ".rw4brat:checked~.fui-Switch__indicator>*{transform:translateX(20px);}",
@@ -102,7 +108,7 @@ const useInputBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("rw4bra
         "@media (forced-colors: active){.r1f4bxyr:disabled~.fui-Switch__indicator{color:GrayText;border-color:GrayText;}.r1f4bxyr:disabled~.fui-Switch__label{color:GrayText;}.r1f4bxyr:enabled:checked:hover~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.r1f4bxyr:enabled:checked~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}}"
     ]
 });
-const useInputStyles = /*#__PURE__*/ (0, _react["__styles"])({
+const useInputStyles = /*#__PURE__*/ (0, _react.__styles)({
     before: {
         j35jbq: [
             "f1e31b4d",
@@ -133,7 +139,7 @@ const useInputStyles = /*#__PURE__*/ (0, _react["__styles"])({
     ]
 });
 // Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.
-const useLabelStyles = /*#__PURE__*/ (0, _react["__styles"])({
+const useLabelStyles = /*#__PURE__*/ (0, _react.__styles)({
     base: {
         Bceei9c: "f1k6fduh",
         jrapky: "f49ad5g",
@@ -190,7 +196,7 @@ const useSwitchStyles_unstable = (state)=>{
     const inputBaseClassName = useInputBaseClassName();
     const inputStyles = useInputStyles();
     const labelStyles = useLabelStyles();
-    const { label , labelPosition  } = state;
+    const { label, labelPosition } = state;
     state.root.className = (0, _react.mergeClasses)(switchClassNames.root, rootBaseClassName, labelPosition === 'above' && rootStyles.vertical, state.root.className);
     state.indicator.className = (0, _react.mergeClasses)(switchClassNames.indicator, indicatorBaseClassName, label && labelPosition === 'above' && indicatorStyles.labelAbove, state.indicator.className);
     state.input.className = (0, _react.mergeClasses)(switchClassNames.input, inputBaseClassName, label && inputStyles[labelPosition], state.input.className);

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

@@ -1 +1 @@
-{"version":3,"sources":["useSwitchStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nexport const switchClassNames = {\n  root: 'fui-Switch',\n  indicator: 'fui-Switch__indicator',\n  input: 'fui-Switch__input',\n  label: 'fui-Switch__label'\n};\n/**\n * @deprecated Use `switchClassNames.root` instead.\n */\nexport const switchClassName = switchClassNames.root;\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\nconst useRootBaseClassName = /*#__PURE__*/__resetStyles(\"rugt7u1\", \"rqv95o1\", [\".rugt7u1{align-items:flex-start;box-sizing:border-box;display:inline-flex;position:relative;}\", \".rugt7u1:focus{outline-style:none;}\", \".rugt7u1:focus-visible{outline-style:none;}\", \".rugt7u1[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".rugt7u1[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".rqv95o1{align-items:flex-start;box-sizing:border-box;display:inline-flex;position:relative;}\", \".rqv95o1:focus{outline-style:none;}\", \".rqv95o1:focus-visible{outline-style:none;}\", \".rqv95o1[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".rqv95o1[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"]);\nconst useRootStyles = /*#__PURE__*/__styles({\n  vertical: {\n    Beiy3e4: \"f1vx9l62\"\n  }\n}, {\n  d: [\".f1vx9l62{flex-direction:column;}\"]\n});\nconst useIndicatorBaseClassName = /*#__PURE__*/__resetStyles(\"r13wlxb8\", null, {\n  r: [\".r13wlxb8{border-radius:var(--borderRadiusCircular);border:1px solid;line-height:0;box-sizing:border-box;fill:currentColor;flex-shrink:0;font-size:18px;height:20px;margin:var(--spacingVerticalS) var(--spacingHorizontalS);pointer-events:none;transition-duration:var(--durationNormal);transition-timing-function:var(--curveEasyEase);transition-property:background,border,color;width:40px;}\", \".r13wlxb8>*{transition-duration:var(--durationNormal);transition-timing-function:var(--curveEasyEase);transition-property:transform;}\"],\n  s: [\"@media screen and (prefers-reduced-motion: reduce){.r13wlxb8{transition-duration:0.01ms;}}\", \"@media screen and (prefers-reduced-motion: reduce){.r13wlxb8>*{transition-duration:0.01ms;}}\"]\n});\nconst useIndicatorStyles = /*#__PURE__*/__styles({\n  labelAbove: {\n    B6of3ja: \"f1hu3pq6\"\n  }\n}, {\n  d: [\".f1hu3pq6{margin-top:0;}\"]\n});\nconst useInputBaseClassName = /*#__PURE__*/__resetStyles(\"rw4brat\", \"r1f4bxyr\", {\n  r: [\".rw4brat{box-sizing:border-box;cursor:pointer;height:100%;margin:0;opacity:0;position:absolute;width:calc(40px + 2 * var(--spacingHorizontalS));}\", \".rw4brat:checked~.fui-Switch__indicator>*{transform:translateX(20px);}\", \".rw4brat:disabled{cursor:default;}\", \".rw4brat:disabled~.fui-Switch__indicator{color:var(--colorNeutralForegroundDisabled);}\", \".rw4brat:disabled~.fui-Switch__label{cursor:default;color:var(--colorNeutralForegroundDisabled);}\", \".rw4brat:enabled:not(:checked)~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessible);border-color:var(--colorNeutralStrokeAccessible);}\", \".rw4brat:enabled:not(:checked)~.fui-Switch__label{color:var(--colorNeutralForeground1);}\", \".rw4brat:enabled:not(:checked):hover~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessibleHover);border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".rw4brat:enabled:not(:checked):hover:active~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessiblePressed);border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".rw4brat:enabled:checked~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackground);color:var(--colorNeutralForegroundInverted);border-color:var(--colorTransparentStroke);}\", \".rw4brat:enabled:checked:hover~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundHover);border-color:var(--colorTransparentStrokeInteractive);}\", \".rw4brat:enabled:checked:hover:active~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundPressed);border-color:var(--colorTransparentStrokeInteractive);}\", \".rw4brat:disabled:not(:checked)~.fui-Switch__indicator{border-color:var(--colorNeutralStrokeDisabled);}\", \".rw4brat:disabled:checked~.fui-Switch__indicator{background-color:var(--colorNeutralBackgroundDisabled);border-color:var(--colorTransparentStrokeDisabled);}\", \".r1f4bxyr{box-sizing:border-box;cursor:pointer;height:100%;margin:0;opacity:0;position:absolute;width:calc(40px + 2 * var(--spacingHorizontalS));}\", \".r1f4bxyr:checked~.fui-Switch__indicator>*{transform:translateX(-20px);}\", \".r1f4bxyr:disabled{cursor:default;}\", \".r1f4bxyr:disabled~.fui-Switch__indicator{color:var(--colorNeutralForegroundDisabled);}\", \".r1f4bxyr:disabled~.fui-Switch__label{cursor:default;color:var(--colorNeutralForegroundDisabled);}\", \".r1f4bxyr:enabled:not(:checked)~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessible);border-color:var(--colorNeutralStrokeAccessible);}\", \".r1f4bxyr:enabled:not(:checked)~.fui-Switch__label{color:var(--colorNeutralForeground1);}\", \".r1f4bxyr:enabled:not(:checked):hover~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessibleHover);border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".r1f4bxyr:enabled:not(:checked):hover:active~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessiblePressed);border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".r1f4bxyr:enabled:checked~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackground);color:var(--colorNeutralForegroundInverted);border-color:var(--colorTransparentStroke);}\", \".r1f4bxyr:enabled:checked:hover~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundHover);border-color:var(--colorTransparentStrokeInteractive);}\", \".r1f4bxyr:enabled:checked:hover:active~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundPressed);border-color:var(--colorTransparentStrokeInteractive);}\", \".r1f4bxyr:disabled:not(:checked)~.fui-Switch__indicator{border-color:var(--colorNeutralStrokeDisabled);}\", \".r1f4bxyr:disabled:checked~.fui-Switch__indicator{background-color:var(--colorNeutralBackgroundDisabled);border-color:var(--colorTransparentStrokeDisabled);}\"],\n  s: [\"@media (forced-colors: active){.rw4brat:disabled~.fui-Switch__indicator{color:GrayText;border-color:GrayText;}.rw4brat:disabled~.fui-Switch__label{color:GrayText;}.rw4brat:enabled:checked:hover~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.rw4brat:enabled:checked~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}}\", \"@media (forced-colors: active){.r1f4bxyr:disabled~.fui-Switch__indicator{color:GrayText;border-color:GrayText;}.r1f4bxyr:disabled~.fui-Switch__label{color:GrayText;}.r1f4bxyr:enabled:checked:hover~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.r1f4bxyr:enabled:checked~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}}\"]\n});\nconst useInputStyles = /*#__PURE__*/__styles({\n  before: {\n    j35jbq: [\"f1e31b4d\", \"f1vgc2s3\"],\n    Bhzewxz: \"f15twtuk\"\n  },\n  after: {\n    oyh7mz: [\"f1vgc2s3\", \"f1e31b4d\"],\n    Bhzewxz: \"f15twtuk\"\n  },\n  above: {\n    B5kzvoi: \"f1yab3r1\",\n    Bqenvij: \"f1aar7gd\",\n    a9b677: \"fly5x3f\"\n  }\n}, {\n  d: [\".f1e31b4d{right:0;}\", \".f1vgc2s3{left:0;}\", \".f15twtuk{top:0;}\", \".f1yab3r1{bottom:0;}\", \".f1aar7gd{height:calc(20px + var(--spacingVerticalS));}\", \".fly5x3f{width:100%;}\"]\n});\n// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.\nconst useLabelStyles = /*#__PURE__*/__styles({\n  base: {\n    Bceei9c: \"f1k6fduh\",\n    jrapky: \"f49ad5g\",\n    B6of3ja: \"f1xlvstr\",\n    z8tnut: \"f1kwiid1\",\n    z189sj: [\"f1vdfbxk\", \"f1f5gg8d\"],\n    Byoj8tv: \"f5b47ha\",\n    uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"]\n  },\n  above: {\n    z8tnut: \"f1ywm7hm\",\n    Byoj8tv: \"f14wxoun\",\n    a9b677: \"fly5x3f\"\n  },\n  after: {\n    uwmqm3: [\"fruq291\", \"f7x41pl\"]\n  },\n  before: {\n    z189sj: [\"f7x41pl\", \"fruq291\"]\n  }\n}, {\n  d: [\".f1k6fduh{cursor:pointer;}\", \".f49ad5g{margin-bottom:calc((20px - var(--lineHeightBase300)) / 2);}\", \".f1xlvstr{margin-top:calc((20px - var(--lineHeightBase300)) / 2);}\", \".f1kwiid1{padding-top:var(--spacingVerticalS);}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f5b47ha{padding-bottom:var(--spacingVerticalS);}\", \".f1ywm7hm{padding-top:var(--spacingVerticalXS);}\", \".f14wxoun{padding-bottom:var(--spacingVerticalXS);}\", \".fly5x3f{width:100%;}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\"]\n});\n/**\n * Apply styling to the Switch slots based on the state\n */\nexport const useSwitchStyles_unstable = state => {\n  const rootBaseClassName = useRootBaseClassName();\n  const rootStyles = useRootStyles();\n  const indicatorBaseClassName = useIndicatorBaseClassName();\n  const indicatorStyles = useIndicatorStyles();\n  const inputBaseClassName = useInputBaseClassName();\n  const inputStyles = useInputStyles();\n  const labelStyles = useLabelStyles();\n  const {\n    label,\n    labelPosition\n  } = state;\n  state.root.className = mergeClasses(switchClassNames.root, rootBaseClassName, labelPosition === 'above' && rootStyles.vertical, state.root.className);\n  state.indicator.className = mergeClasses(switchClassNames.indicator, indicatorBaseClassName, label && labelPosition === 'above' && indicatorStyles.labelAbove, state.indicator.className);\n  state.input.className = mergeClasses(switchClassNames.input, inputBaseClassName, label && inputStyles[labelPosition], state.input.className);\n  if (state.label) {\n    state.label.className = mergeClasses(switchClassNames.label, labelStyles.base, labelStyles[labelPosition], state.label.className);\n  }\n  return state;\n};\n//# sourceMappingURL=useSwitchStyles.styles.js.map"],"names":["switchClassNames","switchClassName","useSwitchStyles_unstable","root","indicator","input","label","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useRootBaseClassName","__resetStyles","useRootStyles","__styles","vertical","Beiy3e4","d","useIndicatorBaseClassName","r","s","useIndicatorStyles","labelAbove","B6of3ja","useInputBaseClassName","useInputStyles","before","j35jbq","Bhzewxz","after","oyh7mz","above","B5kzvoi","Bqenvij","a9b677","useLabelStyles","base","Bceei9c","jrapky","z8tnut","z189sj","Byoj8tv","uwmqm3","state","rootBaseClassName","rootStyles","indicatorBaseClassName","indicatorStyles","inputBaseClassName","inputStyles","labelStyles","labelPosition","className","mergeClasses"],"mappings":"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"}
+{"version":3,"sources":["useSwitchStyles.styles.js"],"sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nexport const switchClassNames = {\n  root: 'fui-Switch',\n  indicator: 'fui-Switch__indicator',\n  input: 'fui-Switch__input',\n  label: 'fui-Switch__label'\n};\n/**\n * @deprecated Use `switchClassNames.root` instead.\n */\nexport const switchClassName = switchClassNames.root;\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\nconst useRootBaseClassName = /*#__PURE__*/__resetStyles(\"rugt7u1\", \"rqv95o1\", [\".rugt7u1{align-items:flex-start;box-sizing:border-box;display:inline-flex;position:relative;}\", \".rugt7u1:focus{outline-style:none;}\", \".rugt7u1:focus-visible{outline-style:none;}\", \".rugt7u1[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".rugt7u1[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".rqv95o1{align-items:flex-start;box-sizing:border-box;display:inline-flex;position:relative;}\", \".rqv95o1:focus{outline-style:none;}\", \".rqv95o1:focus-visible{outline-style:none;}\", \".rqv95o1[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".rqv95o1[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"]);\nconst useRootStyles = /*#__PURE__*/__styles({\n  vertical: {\n    Beiy3e4: \"f1vx9l62\"\n  }\n}, {\n  d: [\".f1vx9l62{flex-direction:column;}\"]\n});\nconst useIndicatorBaseClassName = /*#__PURE__*/__resetStyles(\"r13wlxb8\", null, {\n  r: [\".r13wlxb8{border-radius:var(--borderRadiusCircular);border:1px solid;line-height:0;box-sizing:border-box;fill:currentColor;flex-shrink:0;font-size:18px;height:20px;margin:var(--spacingVerticalS) var(--spacingHorizontalS);pointer-events:none;transition-duration:var(--durationNormal);transition-timing-function:var(--curveEasyEase);transition-property:background,border,color;width:40px;}\", \".r13wlxb8>*{transition-duration:var(--durationNormal);transition-timing-function:var(--curveEasyEase);transition-property:transform;}\"],\n  s: [\"@media screen and (prefers-reduced-motion: reduce){.r13wlxb8{transition-duration:0.01ms;}}\", \"@media screen and (prefers-reduced-motion: reduce){.r13wlxb8>*{transition-duration:0.01ms;}}\"]\n});\nconst useIndicatorStyles = /*#__PURE__*/__styles({\n  labelAbove: {\n    B6of3ja: \"f1hu3pq6\"\n  }\n}, {\n  d: [\".f1hu3pq6{margin-top:0;}\"]\n});\nconst useInputBaseClassName = /*#__PURE__*/__resetStyles(\"rw4brat\", \"r1f4bxyr\", {\n  r: [\".rw4brat{box-sizing:border-box;cursor:pointer;height:100%;margin:0;opacity:0;position:absolute;width:calc(40px + 2 * var(--spacingHorizontalS));}\", \".rw4brat:checked~.fui-Switch__indicator>*{transform:translateX(20px);}\", \".rw4brat:disabled{cursor:default;}\", \".rw4brat:disabled~.fui-Switch__indicator{color:var(--colorNeutralForegroundDisabled);}\", \".rw4brat:disabled~.fui-Switch__label{cursor:default;color:var(--colorNeutralForegroundDisabled);}\", \".rw4brat:enabled:not(:checked)~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessible);border-color:var(--colorNeutralStrokeAccessible);}\", \".rw4brat:enabled:not(:checked)~.fui-Switch__label{color:var(--colorNeutralForeground1);}\", \".rw4brat:enabled:not(:checked):hover~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessibleHover);border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".rw4brat:enabled:not(:checked):hover:active~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessiblePressed);border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".rw4brat:enabled:checked~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackground);color:var(--colorNeutralForegroundInverted);border-color:var(--colorTransparentStroke);}\", \".rw4brat:enabled:checked:hover~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundHover);border-color:var(--colorTransparentStrokeInteractive);}\", \".rw4brat:enabled:checked:hover:active~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundPressed);border-color:var(--colorTransparentStrokeInteractive);}\", \".rw4brat:disabled:not(:checked)~.fui-Switch__indicator{border-color:var(--colorNeutralStrokeDisabled);}\", \".rw4brat:disabled:checked~.fui-Switch__indicator{background-color:var(--colorNeutralBackgroundDisabled);border-color:var(--colorTransparentStrokeDisabled);}\", \".r1f4bxyr{box-sizing:border-box;cursor:pointer;height:100%;margin:0;opacity:0;position:absolute;width:calc(40px + 2 * var(--spacingHorizontalS));}\", \".r1f4bxyr:checked~.fui-Switch__indicator>*{transform:translateX(-20px);}\", \".r1f4bxyr:disabled{cursor:default;}\", \".r1f4bxyr:disabled~.fui-Switch__indicator{color:var(--colorNeutralForegroundDisabled);}\", \".r1f4bxyr:disabled~.fui-Switch__label{cursor:default;color:var(--colorNeutralForegroundDisabled);}\", \".r1f4bxyr:enabled:not(:checked)~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessible);border-color:var(--colorNeutralStrokeAccessible);}\", \".r1f4bxyr:enabled:not(:checked)~.fui-Switch__label{color:var(--colorNeutralForeground1);}\", \".r1f4bxyr:enabled:not(:checked):hover~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessibleHover);border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".r1f4bxyr:enabled:not(:checked):hover:active~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessiblePressed);border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".r1f4bxyr:enabled:checked~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackground);color:var(--colorNeutralForegroundInverted);border-color:var(--colorTransparentStroke);}\", \".r1f4bxyr:enabled:checked:hover~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundHover);border-color:var(--colorTransparentStrokeInteractive);}\", \".r1f4bxyr:enabled:checked:hover:active~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundPressed);border-color:var(--colorTransparentStrokeInteractive);}\", \".r1f4bxyr:disabled:not(:checked)~.fui-Switch__indicator{border-color:var(--colorNeutralStrokeDisabled);}\", \".r1f4bxyr:disabled:checked~.fui-Switch__indicator{background-color:var(--colorNeutralBackgroundDisabled);border-color:var(--colorTransparentStrokeDisabled);}\"],\n  s: [\"@media (forced-colors: active){.rw4brat:disabled~.fui-Switch__indicator{color:GrayText;border-color:GrayText;}.rw4brat:disabled~.fui-Switch__label{color:GrayText;}.rw4brat:enabled:checked:hover~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.rw4brat:enabled:checked~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}}\", \"@media (forced-colors: active){.r1f4bxyr:disabled~.fui-Switch__indicator{color:GrayText;border-color:GrayText;}.r1f4bxyr:disabled~.fui-Switch__label{color:GrayText;}.r1f4bxyr:enabled:checked:hover~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.r1f4bxyr:enabled:checked~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}}\"]\n});\nconst useInputStyles = /*#__PURE__*/__styles({\n  before: {\n    j35jbq: [\"f1e31b4d\", \"f1vgc2s3\"],\n    Bhzewxz: \"f15twtuk\"\n  },\n  after: {\n    oyh7mz: [\"f1vgc2s3\", \"f1e31b4d\"],\n    Bhzewxz: \"f15twtuk\"\n  },\n  above: {\n    B5kzvoi: \"f1yab3r1\",\n    Bqenvij: \"f1aar7gd\",\n    a9b677: \"fly5x3f\"\n  }\n}, {\n  d: [\".f1e31b4d{right:0;}\", \".f1vgc2s3{left:0;}\", \".f15twtuk{top:0;}\", \".f1yab3r1{bottom:0;}\", \".f1aar7gd{height:calc(20px + var(--spacingVerticalS));}\", \".fly5x3f{width:100%;}\"]\n});\n// Can't use makeResetStyles here because Label is a component that may itself use makeResetStyles.\nconst useLabelStyles = /*#__PURE__*/__styles({\n  base: {\n    Bceei9c: \"f1k6fduh\",\n    jrapky: \"f49ad5g\",\n    B6of3ja: \"f1xlvstr\",\n    z8tnut: \"f1kwiid1\",\n    z189sj: [\"f1vdfbxk\", \"f1f5gg8d\"],\n    Byoj8tv: \"f5b47ha\",\n    uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"]\n  },\n  above: {\n    z8tnut: \"f1ywm7hm\",\n    Byoj8tv: \"f14wxoun\",\n    a9b677: \"fly5x3f\"\n  },\n  after: {\n    uwmqm3: [\"fruq291\", \"f7x41pl\"]\n  },\n  before: {\n    z189sj: [\"f7x41pl\", \"fruq291\"]\n  }\n}, {\n  d: [\".f1k6fduh{cursor:pointer;}\", \".f49ad5g{margin-bottom:calc((20px - var(--lineHeightBase300)) / 2);}\", \".f1xlvstr{margin-top:calc((20px - var(--lineHeightBase300)) / 2);}\", \".f1kwiid1{padding-top:var(--spacingVerticalS);}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f5b47ha{padding-bottom:var(--spacingVerticalS);}\", \".f1ywm7hm{padding-top:var(--spacingVerticalXS);}\", \".f14wxoun{padding-bottom:var(--spacingVerticalXS);}\", \".fly5x3f{width:100%;}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\"]\n});\n/**\n * Apply styling to the Switch slots based on the state\n */\nexport const useSwitchStyles_unstable = state => {\n  const rootBaseClassName = useRootBaseClassName();\n  const rootStyles = useRootStyles();\n  const indicatorBaseClassName = useIndicatorBaseClassName();\n  const indicatorStyles = useIndicatorStyles();\n  const inputBaseClassName = useInputBaseClassName();\n  const inputStyles = useInputStyles();\n  const labelStyles = useLabelStyles();\n  const {\n    label,\n    labelPosition\n  } = state;\n  state.root.className = mergeClasses(switchClassNames.root, rootBaseClassName, labelPosition === 'above' && rootStyles.vertical, state.root.className);\n  state.indicator.className = mergeClasses(switchClassNames.indicator, indicatorBaseClassName, label && labelPosition === 'above' && indicatorStyles.labelAbove, state.indicator.className);\n  state.input.className = mergeClasses(switchClassNames.input, inputBaseClassName, label && inputStyles[labelPosition], state.input.className);\n  if (state.label) {\n    state.label.className = mergeClasses(switchClassNames.label, labelStyles.base, labelStyles[labelPosition], state.label.className);\n  }\n  return state;\n};\n//# sourceMappingURL=useSwitchStyles.styles.js.map"],"names":["switchClassNames","switchClassName","useSwitchStyles_unstable","root","indicator","input","label","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useRootBaseClassName","__resetStyles","useRootStyles","__styles","vertical","Beiy3e4","d","useIndicatorBaseClassName","r","s","useIndicatorStyles","labelAbove","B6of3ja","useInputBaseClassName","useInputStyles","before","j35jbq","Bhzewxz","after","oyh7mz","above","B5kzvoi","Bqenvij","a9b677","useLabelStyles","base","Bceei9c","jrapky","z8tnut","z189sj","Byoj8tv","uwmqm3","state","rootBaseClassName","rootStyles","indicatorBaseClassName","indicatorStyles","inputBaseClassName","inputStyles","labelStyles","labelPosition","className","mergeClasses"],"mappings":"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"}

package/lib-commonjs/index.js

@@ -9,11 +9,23 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    Switch: ()=>_switch.Switch,
-    renderSwitch_unstable: ()=>_switch.renderSwitch_unstable,
-    switchClassName: ()=>_switch.switchClassName,
-    switchClassNames: ()=>_switch.switchClassNames,
-    useSwitchStyles_unstable: ()=>_switch.useSwitchStyles_unstable,
-    useSwitch_unstable: ()=>_switch.useSwitch_unstable
+    Switch: function() {
+        return _Switch.Switch;
+    },
+    renderSwitch_unstable: function() {
+        return _Switch.renderSwitch_unstable;
+    },
+    switchClassName: function() {
+        return _Switch.switchClassName;
+    },
+    switchClassNames: function() {
+        return _Switch.switchClassNames;
+    },
+    useSwitchStyles_unstable: function() {
+        return _Switch.useSwitchStyles_unstable;
+    },
+    useSwitch_unstable: function() {
+        return _Switch.useSwitch_unstable;
+    }
 });
-const _switch = require("./Switch");
+const _Switch = require("./Switch");

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export { Switch, renderSwitch_unstable, // eslint-disable-next-line deprecation/deprecation\nswitchClassName, switchClassNames, useSwitchStyles_unstable, useSwitch_unstable } from './Switch';\n"],"names":["Switch","renderSwitch_unstable","switchClassName","switchClassNames","useSwitchStyles_unstable","useSwitch_unstable"],"mappings":";;;;;;;;;;;IAASA,MAAM,MAANA,cAAM;IAAEC,qBAAqB,MAArBA,6BAAqB;IACtCC,eAAe,MAAfA,uBAAe;IAAEC,gBAAgB,MAAhBA,wBAAgB;IAAEC,wBAAwB,MAAxBA,gCAAwB;IAAEC,kBAAkB,MAAlBA,0BAAkB;;wBAAQ"}
+{"version":3,"sources":["index.js"],"sourcesContent":["export { Switch, renderSwitch_unstable, // eslint-disable-next-line deprecation/deprecation\nswitchClassName, switchClassNames, useSwitchStyles_unstable, useSwitch_unstable } from './Switch';\n"],"names":["Switch","renderSwitch_unstable","switchClassName","switchClassNames","useSwitchStyles_unstable","useSwitch_unstable"],"mappings":";;;;;;;;;;;IAASA,MAAM;eAANA,cAAM;;IAAEC,qBAAqB;eAArBA,6BAAqB;;IACtCC,eAAe;eAAfA,uBAAe;;IAAEC,gBAAgB;eAAhBA,wBAAgB;;IAAEC,wBAAwB;eAAxBA,gCAAwB;;IAAEC,kBAAkB;eAAlBA,0BAAkB;;;wBAAQ"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-switch",
-  "version": "9.1.35",
+  "version": "9.1.37",
   "description": "Fluent UI React Switch component.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -33,22 +33,22 @@
     "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
-    "@fluentui/react-field": "^9.1.22",
+    "@fluentui/react-field": "^9.1.24",
     "@fluentui/react-icons": "^2.0.207",
-    "@fluentui/react-jsx-runtime": "^9.0.3",
-    "@fluentui/react-label": "^9.1.30",
-    "@fluentui/react-shared-contexts": "^9.7.2",
-    "@fluentui/react-tabster": "^9.12.5",
-    "@fluentui/react-theme": "^9.1.11",
-    "@fluentui/react-utilities": "^9.13.0",
+    "@fluentui/react-jsx-runtime": "^9.0.5",
+    "@fluentui/react-label": "^9.1.32",
+    "@fluentui/react-shared-contexts": "^9.7.3",
+    "@fluentui/react-tabster": "^9.12.7",
+    "@fluentui/react-theme": "^9.1.12",
+    "@fluentui/react-utilities": "^9.13.2",
     "@griffel/react": "^1.5.14",
-    "@swc/helpers": "^0.4.14"
+    "@swc/helpers": "^0.5.1"
   },
   "peerDependencies": {
-    "@types/react": ">=16.8.0 <19.0.0",
-    "@types/react-dom": ">=16.8.0 <19.0.0",
-    "react": ">=16.8.0 <19.0.0",
-    "react-dom": ">=16.8.0 <19.0.0"
+    "@types/react": ">=16.14.0 <19.0.0",
+    "@types/react-dom": ">=16.14.0 <19.0.0",
+    "react": ">=16.14.0 <19.0.0",
+    "react-dom": ">=16.14.0 <19.0.0"
   },
   "beachball": {
     "disallowedChangeTypes": [