@fluentui/react-switch 9.0.10 → 9.0.12

package/CHANGELOG.json

@@ -2,7 +2,117 @@
   "name": "@fluentui/react-switch",
   "entries": [
     {
-      "date": "Wed, 02 Nov 2022 11:55:03 GMT",
+      "date": "Thu, 17 Nov 2022 23:02:44 GMT",
+      "tag": "@fluentui/react-switch_v9.0.12",
+      "version": "9.0.12",
+      "comments": {
+        "none": [
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-switch",
+            "commit": "ea768501802d65d63ddc63fff3816fb6b5008ae4",
+            "comment": "chore: update package scaffold"
+          }
+        ],
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-field to v9.0.0-alpha.9",
+            "commit": "94e156be5d3b5790d82dccf08c32672733fb9335"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-label to v9.0.11",
+            "commit": "94e156be5d3b5790d82dccf08c32672733fb9335"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-tabster to v9.3.1",
+            "commit": "94e156be5d3b5790d82dccf08c32672733fb9335"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-utilities to v9.2.2",
+            "commit": "94e156be5d3b5790d82dccf08c32672733fb9335"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Fri, 11 Nov 2022 14:57:40 GMT",
+      "tag": "@fluentui/react-switch_v9.0.11",
+      "version": "9.0.11",
+      "comments": {
+        "patch": [
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-switch",
+            "commit": "b3907043bd8d7b650c55e8e7c3119b14f2606c38",
+            "comment": "fix: create valid export maps"
+          },
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-switch",
+            "commit": "ef2a48de9977e1dc5a370a3c27360eabe5afc71a",
+            "comment": "bugfix: adds line-height=0 to switch indicator slot"
+          },
+          {
+            "author": "behowell@microsoft.com",
+            "package": "@fluentui/react-switch",
+            "commit": "39ba7b6d4648781b979fcf694579f97b851348af",
+            "comment": "chore: Move SwitchField into the @fluentui/react-switch package and export as _unstable"
+          },
+          {
+            "author": "humberto_makoto@hotmail.com",
+            "package": "@fluentui/react-switch",
+            "commit": "81a3171e14fcaead04c6cf3fbf8eda962178b442",
+            "comment": "chore: Replacing use of hard-coded constants with curve and duration tokens from theme."
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-field to v9.0.0-alpha.8",
+            "commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-label to v9.0.10",
+            "commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-tabster to v9.3.0",
+            "commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-theme to v9.1.2",
+            "commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-utilities to v9.2.1",
+            "commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-switch",
+            "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.18",
+            "commit": "b4c9a0ae8d7444bf746f1307ab01e2dc16310720"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 02 Nov 2022 11:58:02 GMT",
       "tag": "@fluentui/react-switch_v9.0.10",
       "version": "9.0.10",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,42 @@
 # Change Log - @fluentui/react-switch
 
-This log was last generated on Wed, 02 Nov 2022 11:55:03 GMT and should not be manually modified.
+This log was last generated on Thu, 17 Nov 2022 23:02:44 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.0.12](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.0.12)
+
+Thu, 17 Nov 2022 23:02:44 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.0.11..@fluentui/react-switch_v9.0.12)
+
+### Patches
+
+- Bump @fluentui/react-field to v9.0.0-alpha.9 ([PR #25683](https://github.com/microsoft/fluentui/pull/25683) by beachball)
+- Bump @fluentui/react-label to v9.0.11 ([PR #25683](https://github.com/microsoft/fluentui/pull/25683) by beachball)
+- Bump @fluentui/react-tabster to v9.3.1 ([PR #25683](https://github.com/microsoft/fluentui/pull/25683) by beachball)
+- Bump @fluentui/react-utilities to v9.2.2 ([PR #25683](https://github.com/microsoft/fluentui/pull/25683) by beachball)
+
+## [9.0.11](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.0.11)
+
+Fri, 11 Nov 2022 14:57:40 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.0.10..@fluentui/react-switch_v9.0.11)
+
+### Patches
+
+- fix: create valid export maps ([PR #25558](https://github.com/microsoft/fluentui/pull/25558) by martinhochel@microsoft.com)
+- bugfix: adds line-height=0 to switch indicator slot ([PR #25507](https://github.com/microsoft/fluentui/pull/25507) by bernardo.sunderhus@gmail.com)
+- chore: Move SwitchField into the @fluentui/react-switch package and export as _unstable ([PR #25593](https://github.com/microsoft/fluentui/pull/25593) by behowell@microsoft.com)
+- chore: Replacing use of hard-coded constants with curve and duration tokens from theme. ([PR #25522](https://github.com/microsoft/fluentui/pull/25522) by humberto_makoto@hotmail.com)
+- Bump @fluentui/react-field to v9.0.0-alpha.8 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
+- Bump @fluentui/react-label to v9.0.10 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
+- Bump @fluentui/react-tabster to v9.3.0 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
+- Bump @fluentui/react-theme to v9.1.2 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
+- Bump @fluentui/react-utilities to v9.2.1 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
+- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.18 ([PR #25615](https://github.com/microsoft/fluentui/pull/25615) by beachball)
+
 ## [9.0.10](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.0.10)
 
-Wed, 02 Nov 2022 11:55:03 GMT 
+Wed, 02 Nov 2022 11:58:02 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.0.9..@fluentui/react-switch_v9.0.10)
 
 ### Patches

package/dist/index.d.ts

@@ -2,11 +2,14 @@
 
 import type { ComponentProps } from '@fluentui/react-utilities';
 import type { ComponentState } from '@fluentui/react-utilities';
+import { FieldControl } from '@fluentui/react-field';
+import type { FieldProps } from '@fluentui/react-field';
+import { FieldSlots } from '@fluentui/react-field';
 import type { ForwardRefComponent } from '@fluentui/react-utilities';
 import { Label } from '@fluentui/react-label';
 import * as React_2 from 'react';
 import type { Slot } from '@fluentui/react-utilities';
-import type { SlotClassNames } from '@fluentui/react-utilities';
+import { SlotClassNames } from '@fluentui/react-utilities';
 
 /**
  * Render a Switch component by passing the state defined props to the appropriate slots.
@@ -25,6 +28,12 @@ export declare const switchClassName: string;
 
 export declare const switchClassNames: SlotClassNames<SwitchSlots>;
 
+export declare const SwitchField_unstable: ForwardRefComponent<SwitchFieldProps_unstable>;
+
+export declare const switchFieldClassNames: SlotClassNames<FieldSlots<FieldControl>>;
+
+export declare type SwitchFieldProps_unstable = Omit<FieldProps<typeof Switch>, 'labelPosition'>;
+
 export declare type SwitchOnChangeData = {
     checked: boolean;
 };

package/lib/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sourceRoot":"../src/","sources":["Switch.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC","sourcesContent":["export * from './components/Switch/index';\n"]}
+{"version":3,"file":"Switch.js","sourceRoot":"../src/","sources":["packages/react-components/react-switch/src/Switch.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC","sourcesContent":["export * from './components/Switch/index';\n"]}

package/lib/SwitchField.js

@@ -0,0 +1,2 @@
+export * from './components/SwitchField/index';
+//# sourceMappingURL=SwitchField.js.map

package/lib/SwitchField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchField.js","sourceRoot":"../src/","sources":["packages/react-components/react-switch/src/SwitchField.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC","sourcesContent":["export * from './components/SwitchField/index';\n"]}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,kBAAT,QAAmC,aAAnC;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,wBAAT,QAAyC,mBAAzC;AAIA;;AAEG;;AACH,OAAO,MAAM,MAAM,gBAAqC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACtF,MAAM,KAAK,GAAG,kBAAkB,CAAC,KAAD,EAAQ,GAAR,CAAhC;EAEA,wBAAwB,CAAC,KAAD,CAAxB;EAEA,OAAO,qBAAqB,CAAC,KAAD,CAA5B;AACD,CANuD,CAAjD;AAQP,MAAM,CAAC,WAAP,GAAqB,QAArB","sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles';\nimport type { SwitchProps } from './Switch.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderSwitch_unstable(state);\n});\n\nSwitch.displayName = 'Switch';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-switch/src/components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,kBAAT,QAAmC,aAAnC;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,wBAAT,QAAyC,mBAAzC;AAIA;;AAEG;;AACH,OAAO,MAAM,MAAM,gBAAqC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACtF,MAAM,KAAK,GAAG,kBAAkB,CAAC,KAAD,EAAQ,GAAR,CAAhC;EAEA,wBAAwB,CAAC,KAAD,CAAxB;EAEA,OAAO,qBAAqB,CAAC,KAAD,CAA5B;AACD,CANuD,CAAjD;AAQP,MAAM,CAAC,WAAP,GAAqB,QAArB","sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles';\nimport type { SwitchProps } from './Switch.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderSwitch_unstable(state);\n});\n\nSwitch.displayName = 'Switch';\n"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"file":"Switch.types.js","sourceRoot":"../src/","sources":["components/Switch/Switch.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SwitchSlots = {\n  /**\n   * The root element of the Switch.\n   *\n   * The root slot receives the `className` and `style` specified directly on the `<Switch>` tag.\n   * All other native props will be applied to the primary slot: `input`.\n   */\n  root: NonNullable<Slot<'div'>>;\n\n  /**\n   * The track and the thumb sliding over it indicating the on and off status of the Switch.\n   */\n  indicator: NonNullable<Slot<'div'>>;\n\n  /**\n   * Hidden input that handles the Switch's functionality.\n   *\n   * This is the PRIMARY slot: all native properties specified directly on the `<Switch>` tag will be applied to this\n   * slot, except `className` and `style`, which remain on the root slot.\n   */\n  input: NonNullable<Slot<'input'>>;\n\n  /**\n   * The Switch's label.\n   */\n  label?: Slot<typeof Label>;\n};\n\nexport type SwitchOnChangeData = {\n  checked: boolean;\n};\n\n/**\n * Switch Props\n */\nexport type SwitchProps = Omit<\n  ComponentProps<Partial<SwitchSlots>, 'input'>,\n  'checked' | 'defaultChecked' | 'onChange'\n> & {\n  /**\n   * Defines the controlled checked state of the Switch.\n   * If passed, Switch ignores the `defaultChecked` property.\n   * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n   * correct value based on handling `onChange` events and re-rendering.\n   *\n   * @default false\n   */\n  checked?: boolean;\n\n  /**\n   * Defines whether the Switch is initially in a checked state or not when rendered.\n   *\n   * @default false\n   */\n  defaultChecked?: boolean;\n\n  /**\n   * The position of the label relative to the Switch.\n   *\n   * @default after\n   */\n  labelPosition?: 'above' | 'after' | 'before';\n\n  /**\n   * Callback to be called when the checked state value changes.\n   */\n  onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: SwitchOnChangeData) => void;\n};\n\n/**\n * State used in rendering Switch\n */\nexport type SwitchState = ComponentState<SwitchSlots> & Required<Pick<SwitchProps, 'labelPosition'>>;\n"]}
+{"version":3,"file":"Switch.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-switch/src/components/Switch/Switch.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SwitchSlots = {\n  /**\n   * The root element of the Switch.\n   *\n   * The root slot receives the `className` and `style` specified directly on the `<Switch>` tag.\n   * All other native props will be applied to the primary slot: `input`.\n   */\n  root: NonNullable<Slot<'div'>>;\n\n  /**\n   * The track and the thumb sliding over it indicating the on and off status of the Switch.\n   */\n  indicator: NonNullable<Slot<'div'>>;\n\n  /**\n   * Hidden input that handles the Switch's functionality.\n   *\n   * This is the PRIMARY slot: all native properties specified directly on the `<Switch>` tag will be applied to this\n   * slot, except `className` and `style`, which remain on the root slot.\n   */\n  input: NonNullable<Slot<'input'>>;\n\n  /**\n   * The Switch's label.\n   */\n  label?: Slot<typeof Label>;\n};\n\nexport type SwitchOnChangeData = {\n  checked: boolean;\n};\n\n/**\n * Switch Props\n */\nexport type SwitchProps = Omit<\n  ComponentProps<Partial<SwitchSlots>, 'input'>,\n  'checked' | 'defaultChecked' | 'onChange'\n> & {\n  /**\n   * Defines the controlled checked state of the Switch.\n   * If passed, Switch ignores the `defaultChecked` property.\n   * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n   * correct value based on handling `onChange` events and re-rendering.\n   *\n   * @default false\n   */\n  checked?: boolean;\n\n  /**\n   * Defines whether the Switch is initially in a checked state or not when rendered.\n   *\n   * @default false\n   */\n  defaultChecked?: boolean;\n\n  /**\n   * The position of the label relative to the Switch.\n   *\n   * @default after\n   */\n  labelPosition?: 'above' | 'after' | 'before';\n\n  /**\n   * Callback to be called when the checked state value changes.\n   */\n  onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: SwitchOnChangeData) => void;\n};\n\n/**\n * State used in rendering Switch\n */\nexport type SwitchState = ComponentState<SwitchSlots> & Required<Pick<SwitchProps, 'labelPosition'>>;\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Switch/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC","sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-switch/src/components/Switch/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC","sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles';\n"]}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Switch/renderSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,qBAAqB,GAAI,KAAD,IAAuB;EAC1D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAc,KAAd,CAArC;EACA,MAAM;IAAE;EAAF,IAAoB,KAA1B;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADF,EAEG,aAAa,KAAK,OAAlB,IAA6B,KAAK,CAAC,KAAnC,iBAA4C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAF/C,eAGE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,SAAP,EAAgB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAhB,CAHF,EAIG,aAAa,KAAK,OAAlB,IAA6B,KAAK,CAAC,KAAnC,iBAA4C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAJ/C,CADF;AAQD,CAZM","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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  const { slots, slotProps } = getSlots<SwitchSlots>(state);\n  const { labelPosition } = state;\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.input {...slotProps.input} />\n      {labelPosition !== 'after' && slots.label && <slots.label {...slotProps.label} />}\n      <slots.indicator {...slotProps.indicator} />\n      {labelPosition === 'after' && slots.label && <slots.label {...slotProps.label} />}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-switch/src/components/Switch/renderSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,qBAAqB,GAAI,KAAD,IAAuB;EAC1D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAc,KAAd,CAArC;EACA,MAAM;IAAE;EAAF,IAAoB,KAA1B;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADF,EAEG,aAAa,KAAK,OAAlB,IAA6B,KAAK,CAAC,KAAnC,iBAA4C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAF/C,eAGE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,SAAP,EAAgB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAhB,CAHF,EAIG,aAAa,KAAK,OAAlB,IAA6B,KAAK,CAAC,KAAnC,iBAA4C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAJ/C,CADF;AAQD,CAZM","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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  const { slots, slotProps } = getSlots<SwitchSlots>(state);\n  const { labelPosition } = state;\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.input {...slotProps.input} />\n      {labelPosition !== 'after' && slots.label && <slots.label {...slotProps.label} />}\n      <slots.indicator {...slotProps.indicator} />\n      {labelPosition === 'after' && slots.label && <slots.label {...slotProps.label} />}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Switch/useSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,YAAT,QAA6B,uBAA7B;AACA,SAAS,KAAT,QAAsB,uBAAtB;AACA,SAAS,cAAT,QAA+B,yBAA/B;AACA,SAAS,yBAAT,EAAoC,cAApC,EAAoD,gBAApD,EAAsE,KAAtE,QAAmF,2BAAnF;AAGA;;;;;;;;AAQG;;AACH,OAAO,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAsE;EACtG,MAAM;IAAE,OAAF;IAAW,cAAX;IAA2B,QAA3B;IAAqC,aAAa,GAAG,OAArD;IAA8D,QAA9D;IAAwE;EAAxE,IAAqF,KAA3F;EAEA,MAAM,WAAW,GAAG,yBAAyB,CAAC;IAC5C,KAD4C;IAE5C,kBAAkB,EAAE,OAFwB;IAG5C,iBAAiB,EAAE,CAAC,SAAD,EAAY,gBAAZ,EAA8B,UAA9B;EAHyB,CAAD,CAA7C;EAMA,MAAM,EAAE,GAAG,KAAK,CAAC,SAAD,EAAY,WAAW,CAAC,OAAZ,CAAoB,EAAhC,CAAhB;EAEA,MAAM,IAAI,GAAG,gBAAgB,CAAC,KAAK,CAAC,IAAP,EAAa;IACxC,YAAY,EAAE;MAAE,GAAG,EAAE,cAAc,EAArB;MAAyC,GAAG,WAAW,CAAC;IAAxD,CAD0B;IAExC,QAAQ,EAAE;EAF8B,CAAb,CAA7B;EAKA,MAAM,SAAS,GAAG,gBAAgB,CAAC,KAAK,CAAC,SAAP,EAAkB;IAClD,YAAY,EAAE;MACZ,eAAe,IADH;MAEZ,QAAQ,eAAE,KAAA,CAAA,aAAA,CAAC,YAAD,EAAa,IAAb;IAFE,CADoC;IAKlD,QAAQ,EAAE;EALwC,CAAlB,CAAlC;EAQA,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAK,CAAC,KAAP,EAAc;IAC1C,YAAY,EAAE;MACZ,OADY;MAEZ,cAFY;MAGZ,EAHY;MAIZ,GAJY;MAKZ,IAAI,EAAE,QALM;MAMZ,IAAI,EAAE,UANM;MAOZ,GAAG,WAAW,CAAC;IAPH,CAD4B;IAU1C,QAAQ,EAAE;EAVgC,CAAd,CAA9B;EAYA,KAAK,CAAC,QAAN,GAAiB,cAAc,CAAC,KAAK,CAAC,QAAP,EAAiB,EAAE,IAAI,QAAQ,KAAA,IAAR,IAAA,QAAQ,KAAA,KAAA,CAAR,GAAQ,KAAA,CAAR,GAAA,QAAQ,CAAG,EAAH,EAAO;IAAE,OAAO,EAAE,EAAE,CAAC,aAAH,CAAiB;EAA5B,CAAP,CAA/B,CAA/B;EAEA,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAK,CAAC,KAAP,EAAc;IAC1C,YAAY,EAAE;MACZ,QADY;MAEZ,OAAO,EAAE,EAFG;MAGZ,QAHY;MAIZ,IAAI,EAAE;IAJM;EAD4B,CAAd,CAA9B;EASA,OAAO;IACL,aADK;IAGL;IACA,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,SAAS,EAAE,KAFD;MAGV,KAAK,EAAE,OAHG;MAIV,KAAK,EAAE;IAJG,CAJP;IAWL,IAXK;IAYL,SAZK;IAaL,KAbK;IAcL;EAdK,CAAP;AAgBD,CA/DM","sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useId } 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  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 = resolveShorthand(props.root, {\n    defaultProps: { ref: useFocusWithin<HTMLDivElement>(), ...nativeProps.root },\n    required: true,\n  });\n\n  const indicator = resolveShorthand(props.indicator, {\n    defaultProps: {\n      'aria-hidden': true,\n      children: <CircleFilled />,\n    },\n    required: true,\n  });\n\n  const input = resolveShorthand(props.input, {\n    defaultProps: {\n      checked,\n      defaultChecked,\n      id,\n      ref,\n      role: 'switch',\n      type: 'checkbox',\n      ...nativeProps.primary,\n    },\n    required: true,\n  });\n  input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n\n  const label = resolveShorthand(props.label, {\n    defaultProps: {\n      disabled,\n      htmlFor: id,\n      required,\n      size: 'medium',\n    },\n  });\n\n  return {\n    labelPosition,\n\n    //Slots definition\n    components: {\n      root: 'div',\n      indicator: 'div',\n      input: 'input',\n      label: Label,\n    },\n\n    root,\n    indicator,\n    input,\n    label,\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-switch/src/components/Switch/useSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,YAAT,QAA6B,uBAA7B;AACA,SAAS,KAAT,QAAsB,uBAAtB;AACA,SAAS,cAAT,QAA+B,yBAA/B;AACA,SAAS,yBAAT,EAAoC,cAApC,EAAoD,gBAApD,EAAsE,KAAtE,QAAmF,2BAAnF;AAGA;;;;;;;;AAQG;;AACH,OAAO,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAsE;EACtG,MAAM;IAAE,OAAF;IAAW,cAAX;IAA2B,QAA3B;IAAqC,aAAa,GAAG,OAArD;IAA8D,QAA9D;IAAwE;EAAxE,IAAqF,KAA3F;EAEA,MAAM,WAAW,GAAG,yBAAyB,CAAC;IAC5C,KAD4C;IAE5C,kBAAkB,EAAE,OAFwB;IAG5C,iBAAiB,EAAE,CAAC,SAAD,EAAY,gBAAZ,EAA8B,UAA9B;EAHyB,CAAD,CAA7C;EAMA,MAAM,EAAE,GAAG,KAAK,CAAC,SAAD,EAAY,WAAW,CAAC,OAAZ,CAAoB,EAAhC,CAAhB;EAEA,MAAM,IAAI,GAAG,gBAAgB,CAAC,KAAK,CAAC,IAAP,EAAa;IACxC,YAAY,EAAE;MAAE,GAAG,EAAE,cAAc,EAArB;MAAyC,GAAG,WAAW,CAAC;IAAxD,CAD0B;IAExC,QAAQ,EAAE;EAF8B,CAAb,CAA7B;EAKA,MAAM,SAAS,GAAG,gBAAgB,CAAC,KAAK,CAAC,SAAP,EAAkB;IAClD,YAAY,EAAE;MACZ,eAAe,IADH;MAEZ,QAAQ,eAAE,KAAA,CAAA,aAAA,CAAC,YAAD,EAAa,IAAb;IAFE,CADoC;IAKlD,QAAQ,EAAE;EALwC,CAAlB,CAAlC;EAQA,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAK,CAAC,KAAP,EAAc;IAC1C,YAAY,EAAE;MACZ,OADY;MAEZ,cAFY;MAGZ,EAHY;MAIZ,GAJY;MAKZ,IAAI,EAAE,QALM;MAMZ,IAAI,EAAE,UANM;MAOZ,GAAG,WAAW,CAAC;IAPH,CAD4B;IAU1C,QAAQ,EAAE;EAVgC,CAAd,CAA9B;EAYA,KAAK,CAAC,QAAN,GAAiB,cAAc,CAAC,KAAK,CAAC,QAAP,EAAiB,EAAE,IAAI,QAAQ,KAAA,IAAR,IAAA,QAAQ,KAAA,KAAA,CAAR,GAAQ,KAAA,CAAR,GAAA,QAAQ,CAAG,EAAH,EAAO;IAAE,OAAO,EAAE,EAAE,CAAC,aAAH,CAAiB;EAA5B,CAAP,CAA/B,CAA/B;EAEA,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAK,CAAC,KAAP,EAAc;IAC1C,YAAY,EAAE;MACZ,QADY;MAEZ,OAAO,EAAE,EAFG;MAGZ,QAHY;MAIZ,IAAI,EAAE;IAJM;EAD4B,CAAd,CAA9B;EASA,OAAO;IACL,aADK;IAGL;IACA,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,SAAS,EAAE,KAFD;MAGV,KAAK,EAAE,OAHG;MAIV,KAAK,EAAE;IAJG,CAJP;IAWL,IAXK;IAYL,SAZK;IAaL,KAbK;IAcL;EAdK,CAAP;AAgBD,CA/DM","sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useId } 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  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 = resolveShorthand(props.root, {\n    defaultProps: { ref: useFocusWithin<HTMLDivElement>(), ...nativeProps.root },\n    required: true,\n  });\n\n  const indicator = resolveShorthand(props.indicator, {\n    defaultProps: {\n      'aria-hidden': true,\n      children: <CircleFilled />,\n    },\n    required: true,\n  });\n\n  const input = resolveShorthand(props.input, {\n    defaultProps: {\n      checked,\n      defaultChecked,\n      id,\n      ref,\n      role: 'switch',\n      type: 'checkbox',\n      ...nativeProps.primary,\n    },\n    required: true,\n  });\n  input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n\n  const label = resolveShorthand(props.label, {\n    defaultProps: {\n      disabled,\n      htmlFor: id,\n      required,\n      size: 'medium',\n    },\n  });\n\n  return {\n    labelPosition,\n\n    //Slots definition\n    components: {\n      root: 'div',\n      indicator: 'div',\n      input: 'input',\n      label: Label,\n    },\n\n    root,\n    indicator,\n    input,\n    label,\n  };\n};\n"],"sourceRoot":"../src/"}

package/lib/components/Switch/useSwitchStyles.js

@@ -78,6 +78,7 @@ const useIndicatorStyles = /*#__PURE__*/__styles({
     "Bekrc4i": ["f1hqa2wf", "finvdd3"],
     "Bn0qgzm": "f1f09k3d",
     "ibv6hh": ["finvdd3", "f1hqa2wf"],
+    "Bg96gwp": "fez10in",
     "B7ck84d": "f1ewtqcl",
     "Bkfmm31": "f1w9h62z",
     "Bnnss6s": "fi64zpg",
@@ -88,13 +89,13 @@ const useIndicatorStyles = /*#__PURE__*/__styles({
     "jrapky": "fqcjy3b",
     "Frg6f3": ["foyynoy", "f1vcna3q"],
     "Bkecrkj": "f1aehjj5",
-    "B3o57yi": "f1bnoopa",
-    "Bkqvd7p": "f1e1a42z",
+    "B3o57yi": "f1vze9yt",
+    "Bkqvd7p": "f17wnm97",
     "Bmy1vo4": "fo99fu7",
     "a9b677": "feqmc2u",
     "Hwfdqs": "f1onx1g3",
-    "Hkqiji": "f1wkgtgk",
-    "Bgrs90m": "f17f8g0y",
+    "Hkqiji": "f1h74hm9",
+    "Bgrs90m": "f1592id",
     "B0zx559": "f1uwej41",
     "c0im90": "fpz7fqq"
   },
@@ -102,7 +103,7 @@ const useIndicatorStyles = /*#__PURE__*/__styles({
     "B6of3ja": "f1hu3pq6"
   }
 }, {
-  "d": [".f8fbkgy{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1nfllo7{border-bottom-left-radius:var(--borderRadiusCircular);}", ".f1djnp8u{border-top-right-radius:var(--borderRadiusCircular);}", ".f1s8kh49{border-top-left-radius:var(--borderRadiusCircular);}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".f1ewtqcl{box-sizing:border-box;}", ".f1w9h62z{fill:currentColor;}", ".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}", ".fg38ndl{font-size:18px;}", ".fjamq6b{height:20px;}", ".frnwi6n{margin-top:var(--spacingVerticalS);}", ".f1vcna3q{margin-right:var(--spacingHorizontalS);}", ".foyynoy{margin-left:var(--spacingHorizontalS);}", ".fqcjy3b{margin-bottom:var(--spacingVerticalS);}", ".f1aehjj5{pointer-events:none;}", ".f1bnoopa{transition-duration:200ms;}", ".f1e1a42z{transition-timing-function:cubic-bezier(0.33, 0, 0.67, 1);}", ".fo99fu7{transition-property:background,border,color;}", ".feqmc2u{width:40px;}", ".f1wkgtgk>*{transition-duration:200ms;}", ".f17f8g0y>*{transition-timing-function:cubic-bezier(0.33, 0, 0.67, 1);}", ".f1uwej41>*{transition-property:transform;}", ".f1hu3pq6{margin-top:0;}"],
+  "d": [".f8fbkgy{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1nfllo7{border-bottom-left-radius:var(--borderRadiusCircular);}", ".f1djnp8u{border-top-right-radius:var(--borderRadiusCircular);}", ".f1s8kh49{border-top-left-radius:var(--borderRadiusCircular);}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fez10in{line-height:0;}", ".f1ewtqcl{box-sizing:border-box;}", ".f1w9h62z{fill:currentColor;}", ".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}", ".fg38ndl{font-size:18px;}", ".fjamq6b{height:20px;}", ".frnwi6n{margin-top:var(--spacingVerticalS);}", ".f1vcna3q{margin-right:var(--spacingHorizontalS);}", ".foyynoy{margin-left:var(--spacingHorizontalS);}", ".fqcjy3b{margin-bottom:var(--spacingVerticalS);}", ".f1aehjj5{pointer-events:none;}", ".f1vze9yt{transition-duration:var(--durationNormal);}", ".f17wnm97{transition-timing-function:var(--curveEasyEase);}", ".fo99fu7{transition-property:background,border,color;}", ".feqmc2u{width:40px;}", ".f1h74hm9>*{transition-duration:var(--durationNormal);}", ".f1592id>*{transition-timing-function:var(--curveEasyEase);}", ".f1uwej41>*{transition-property:transform;}", ".f1hu3pq6{margin-top:0;}"],
   "m": [["@media screen and (prefers-reduced-motion: reduce){.f1onx1g3{transition-duration:0.01ms;}}", {
     "m": "screen and (prefers-reduced-motion: reduce)"
   }], ["@media screen and (prefers-reduced-motion: reduce){.fpz7fqq>*{transition-duration:0.01ms;}}", {

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Switch/useSwitchStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SwitchSlots, SwitchState } from './Switch.types';\n\nexport const switchClassNames: SlotClassNames<SwitchSlots> = {\n  root: 'fui-Switch',\n  indicator: 'fui-Switch__indicator',\n  input: 'fui-Switch__input',\n  label: 'fui-Switch__label',\n};\n\n/**\n * @deprecated Use `switchClassNames.root` instead.\n */\nexport const switchClassName = switchClassNames.root;\n\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\n\nconst useRootStyles = makeStyles({\n  base: {\n    alignItems: 'flex-start',\n    boxSizing: 'border-box',\n    display: 'inline-flex',\n    position: 'relative',\n\n    ...createFocusOutlineStyle({ style: {}, selector: 'focus-within' }),\n  },\n\n  vertical: {\n    flexDirection: 'column',\n  },\n});\n\nconst useIndicatorStyles = makeStyles({\n  base: {\n    ...shorthands.borderRadius(tokens.borderRadiusCircular),\n    ...shorthands.borderStyle('solid'),\n    ...shorthands.borderWidth('1px'),\n    boxSizing: 'border-box',\n    fill: 'currentColor',\n    flexShrink: 0,\n    fontSize: `${thumbSize}px`,\n    height: `${trackHeight}px`,\n    ...shorthands.margin(tokens.spacingVerticalS, tokens.spacingHorizontalS),\n    pointerEvents: 'none',\n    transitionDuration: '200ms',\n    transitionTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)',\n    transitionProperty: 'background, border, color',\n    width: `${trackWidth}px`,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n    },\n\n    '> *': {\n      transitionDuration: '200ms',\n      transitionTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)',\n      transitionProperty: 'transform',\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms',\n      },\n    },\n  },\n\n  labelAbove: {\n    marginTop: 0,\n  },\n});\n\nconst useInputStyles = makeStyles({\n  base: {\n    boxSizing: 'border-box',\n    cursor: 'pointer',\n    height: '100%',\n    ...shorthands.margin(0),\n    opacity: 0,\n    position: 'absolute',\n\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\n    // Checked (both enabled and disabled)\n    ':checked': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        '> *': {\n          transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`,\n        },\n      },\n    },\n\n    // Disabled (both checked and unchecked)\n    ':disabled': {\n      cursor: 'default',\n\n      [`& ~ .${switchClassNames.indicator}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n      },\n\n      [`& ~ .${switchClassNames.label}`]: {\n        cursor: 'default',\n        color: tokens.colorNeutralForegroundDisabled,\n      },\n    },\n\n    // Enabled and unchecked\n    ':enabled:not(:checked)': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        color: tokens.colorNeutralStrokeAccessible,\n        ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible),\n      },\n\n      [`& ~ .${switchClassNames.label}`]: {\n        color: tokens.colorNeutralForeground1,\n      },\n\n      ':hover': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          color: tokens.colorNeutralStrokeAccessibleHover,\n          ...shorthands.borderColor(tokens.colorNeutralStrokeAccessibleHover),\n        },\n      },\n\n      ':hover:active': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          color: tokens.colorNeutralStrokeAccessiblePressed,\n          ...shorthands.borderColor(tokens.colorNeutralStrokeAccessiblePressed),\n        },\n      },\n    },\n\n    // Enabled and checked\n    ':enabled:checked': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        backgroundColor: tokens.colorCompoundBrandBackground,\n        color: tokens.colorNeutralForegroundInverted,\n        ...shorthands.borderColor(tokens.colorTransparentStroke),\n      },\n\n      ':hover': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n          ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n        },\n      },\n\n      ':hover:active': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n          ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n        },\n      },\n    },\n\n    // Disabled and unchecked\n    ':disabled:not(:checked)': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n      },\n    },\n\n    // Disabled and checked\n    ':disabled:checked': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        backgroundColor: tokens.colorNeutralBackgroundDisabled,\n        ...shorthands.borderColor(tokens.colorTransparentStrokeDisabled),\n      },\n    },\n  },\n\n  highContrast: {\n    '@media (forced-colors: active)': {\n      ':disabled': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          color: 'GrayText',\n          ...shorthands.borderColor('GrayText'),\n        },\n\n        [`& ~ .${switchClassNames.label}`]: {\n          color: 'GrayText',\n        },\n      },\n    },\n  },\n\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\nconst useLabelStyles = makeStyles({\n  base: {\n    cursor: 'pointer',\n\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\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/**\n * Apply styling to the Switch slots based on the state\n */\nexport const useSwitchStyles_unstable = (state: SwitchState): SwitchState => {\n  const rootStyles = useRootStyles();\n  const indicatorStyles = useIndicatorStyles();\n  const inputStyles = useInputStyles();\n  const labelStyles = useLabelStyles();\n\n  const { label, labelPosition } = state;\n\n  state.root.className = mergeClasses(\n    switchClassNames.root,\n    rootStyles.base,\n    labelPosition === 'above' && rootStyles.vertical,\n    state.root.className,\n  );\n\n  state.indicator.className = mergeClasses(\n    switchClassNames.indicator,\n    indicatorStyles.base,\n    label && labelPosition === 'above' && indicatorStyles.labelAbove,\n    state.indicator.className,\n  );\n\n  state.input.className = mergeClasses(\n    switchClassNames.input,\n    inputStyles.base,\n    inputStyles.highContrast,\n    label && inputStyles[labelPosition],\n    state.input.className,\n  );\n\n  if (state.label) {\n    state.label.className = mergeClasses(\n      switchClassNames.label,\n      labelStyles.base,\n      labelStyles[labelPosition],\n      state.label.className,\n    );\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-switch/src/components/Switch/useSwitchStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SwitchSlots, SwitchState } from './Switch.types';\n\nexport const switchClassNames: SlotClassNames<SwitchSlots> = {\n  root: 'fui-Switch',\n  indicator: 'fui-Switch__indicator',\n  input: 'fui-Switch__input',\n  label: 'fui-Switch__label',\n};\n\n/**\n * @deprecated Use `switchClassNames.root` instead.\n */\nexport const switchClassName = switchClassNames.root;\n\n// Thumb and track sizes used by the component.\nconst spaceBetweenThumbAndTrack = 2;\nconst trackHeight = 20;\nconst trackWidth = 40;\nconst thumbSize = trackHeight - spaceBetweenThumbAndTrack;\n\nconst useRootStyles = makeStyles({\n  base: {\n    alignItems: 'flex-start',\n    boxSizing: 'border-box',\n    display: 'inline-flex',\n    position: 'relative',\n\n    ...createFocusOutlineStyle({ style: {}, selector: 'focus-within' }),\n  },\n\n  vertical: {\n    flexDirection: 'column',\n  },\n});\n\nconst useIndicatorStyles = makeStyles({\n  base: {\n    ...shorthands.borderRadius(tokens.borderRadiusCircular),\n    ...shorthands.borderStyle('solid'),\n    ...shorthands.borderWidth('1px'),\n    lineHeight: 0,\n    boxSizing: 'border-box',\n    fill: 'currentColor',\n    flexShrink: 0,\n    fontSize: `${thumbSize}px`,\n    height: `${trackHeight}px`,\n    ...shorthands.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\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n    },\n\n    '> *': {\n      transitionDuration: tokens.durationNormal,\n      transitionTimingFunction: tokens.curveEasyEase,\n      transitionProperty: 'transform',\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms',\n      },\n    },\n  },\n\n  labelAbove: {\n    marginTop: 0,\n  },\n});\n\nconst useInputStyles = makeStyles({\n  base: {\n    boxSizing: 'border-box',\n    cursor: 'pointer',\n    height: '100%',\n    ...shorthands.margin(0),\n    opacity: 0,\n    position: 'absolute',\n\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\n    // Checked (both enabled and disabled)\n    ':checked': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        '> *': {\n          transform: `translateX(${trackWidth - thumbSize - spaceBetweenThumbAndTrack}px)`,\n        },\n      },\n    },\n\n    // Disabled (both checked and unchecked)\n    ':disabled': {\n      cursor: 'default',\n\n      [`& ~ .${switchClassNames.indicator}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n      },\n\n      [`& ~ .${switchClassNames.label}`]: {\n        cursor: 'default',\n        color: tokens.colorNeutralForegroundDisabled,\n      },\n    },\n\n    // Enabled and unchecked\n    ':enabled:not(:checked)': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        color: tokens.colorNeutralStrokeAccessible,\n        ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible),\n      },\n\n      [`& ~ .${switchClassNames.label}`]: {\n        color: tokens.colorNeutralForeground1,\n      },\n\n      ':hover': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          color: tokens.colorNeutralStrokeAccessibleHover,\n          ...shorthands.borderColor(tokens.colorNeutralStrokeAccessibleHover),\n        },\n      },\n\n      ':hover:active': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          color: tokens.colorNeutralStrokeAccessiblePressed,\n          ...shorthands.borderColor(tokens.colorNeutralStrokeAccessiblePressed),\n        },\n      },\n    },\n\n    // Enabled and checked\n    ':enabled:checked': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        backgroundColor: tokens.colorCompoundBrandBackground,\n        color: tokens.colorNeutralForegroundInverted,\n        ...shorthands.borderColor(tokens.colorTransparentStroke),\n      },\n\n      ':hover': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          backgroundColor: tokens.colorCompoundBrandBackgroundHover,\n          ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n        },\n      },\n\n      ':hover:active': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          backgroundColor: tokens.colorCompoundBrandBackgroundPressed,\n          ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n        },\n      },\n    },\n\n    // Disabled and unchecked\n    ':disabled:not(:checked)': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n      },\n    },\n\n    // Disabled and checked\n    ':disabled:checked': {\n      [`& ~ .${switchClassNames.indicator}`]: {\n        backgroundColor: tokens.colorNeutralBackgroundDisabled,\n        ...shorthands.borderColor(tokens.colorTransparentStrokeDisabled),\n      },\n    },\n  },\n\n  highContrast: {\n    '@media (forced-colors: active)': {\n      ':disabled': {\n        [`& ~ .${switchClassNames.indicator}`]: {\n          color: 'GrayText',\n          ...shorthands.borderColor('GrayText'),\n        },\n\n        [`& ~ .${switchClassNames.label}`]: {\n          color: 'GrayText',\n        },\n      },\n    },\n  },\n\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\nconst useLabelStyles = makeStyles({\n  base: {\n    cursor: 'pointer',\n\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\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/**\n * Apply styling to the Switch slots based on the state\n */\nexport const useSwitchStyles_unstable = (state: SwitchState): SwitchState => {\n  const rootStyles = useRootStyles();\n  const indicatorStyles = useIndicatorStyles();\n  const inputStyles = useInputStyles();\n  const labelStyles = useLabelStyles();\n\n  const { label, labelPosition } = state;\n\n  state.root.className = mergeClasses(\n    switchClassNames.root,\n    rootStyles.base,\n    labelPosition === 'above' && rootStyles.vertical,\n    state.root.className,\n  );\n\n  state.indicator.className = mergeClasses(\n    switchClassNames.indicator,\n    indicatorStyles.base,\n    label && labelPosition === 'above' && indicatorStyles.labelAbove,\n    state.indicator.className,\n  );\n\n  state.input.className = mergeClasses(\n    switchClassNames.input,\n    inputStyles.base,\n    inputStyles.highContrast,\n    label && inputStyles[labelPosition],\n    state.input.className,\n  );\n\n  if (state.label) {\n    state.label.className = mergeClasses(\n      switchClassNames.label,\n      labelStyles.base,\n      labelStyles[labelPosition],\n      state.label.className,\n    );\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib/components/SwitchField/SwitchField.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { getFieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from '@fluentui/react-field';
+import { Switch } from '../../Switch';
+export const switchFieldClassNames = /*#__PURE__*/getFieldClassNames('SwitchField');
+export const SwitchField = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useField_unstable(props, ref, {
+    component: Switch,
+    classNames: switchFieldClassNames
+  });
+  useFieldStyles_unstable(state);
+  return renderField_unstable(state);
+});
+SwitchField.displayName = 'SwitchField';
+//# sourceMappingURL=SwitchField.js.map

package/lib/components/SwitchField/SwitchField.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["packages/react-components/react-switch/src/components/SwitchField/SwitchField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,SACE,kBADF,EAEE,oBAFF,EAGE,uBAHF,EAIE,iBAJF,QAKO,uBALP;AAOA,SAAS,MAAT,QAAuB,cAAvB;AAMA,OAAO,MAAM,qBAAqB,gBAAG,kBAAkB,CAAC,aAAD,CAAhD;AAEP,OAAO,MAAM,WAAW,gBAA0C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAChG,MAAM,KAAK,GAAG,iBAAiB,CAAC,KAAD,EAAQ,GAAR,EAAa;IAAE,SAAS,EAAE,MAAb;IAAqB,UAAU,EAAE;EAAjC,CAAb,CAA/B;EACA,uBAAuB,CAAC,KAAD,CAAvB;EACA,OAAO,oBAAoB,CAAC,KAAD,CAA3B;AACD,CAJiE,CAA3D;AAMP,WAAW,CAAC,WAAZ,GAA0B,aAA1B","sourcesContent":["import * as React from 'react';\nimport type { FieldProps } from '@fluentui/react-field';\nimport {\n  getFieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n} from '@fluentui/react-field';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { Switch } from '../../Switch';\n\n// The Field's `label` prop overrides the Switch's built-in `label`.\n// Therefore, the Switch's `labelPosition` has no effect and is omitted to avoid confusion.\nexport type SwitchFieldProps = Omit<FieldProps<typeof Switch>, 'labelPosition'>;\n\nexport const switchFieldClassNames = getFieldClassNames('SwitchField');\n\nexport const SwitchField: ForwardRefComponent<SwitchFieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref, { component: Switch, classNames: switchFieldClassNames });\n  useFieldStyles_unstable(state);\n  return renderField_unstable(state);\n});\n\nSwitchField.displayName = 'SwitchField';\n"],"sourceRoot":"../src/"}

package/lib/components/SwitchField/index.js

@@ -0,0 +1,2 @@
+export * from './SwitchField';
+//# sourceMappingURL=index.js.map

package/lib/components/SwitchField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-switch/src/components/SwitchField/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC","sourcesContent":["export * from './SwitchField';\n"]}

package/lib/index.js

@@ -1,3 +1,4 @@
 export { Switch, renderSwitch_unstable, // eslint-disable-next-line deprecation/deprecation
 switchClassName, switchClassNames, useSwitchStyles_unstable, useSwitch_unstable } from './Switch';
+export { SwitchField as SwitchField_unstable, switchFieldClassNames } from './SwitchField';
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,SACE,MADF,EAEE,qBAFF,EAGE;AACA,eAJF,EAKE,gBALF,EAME,wBANF,EAOE,kBAPF,QAQO,UARP","sourcesContent":["export {\n  Switch,\n  renderSwitch_unstable,\n  // eslint-disable-next-line deprecation/deprecation\n  switchClassName,\n  switchClassNames,\n  useSwitchStyles_unstable,\n  useSwitch_unstable,\n} from './Switch';\nexport type { SwitchOnChangeData, SwitchProps, SwitchSlots, SwitchState } from './Switch';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-switch/src/index.ts"],"names":[],"mappings":"AAAA,SACE,MADF,EAEE,qBAFF,EAGE;AACA,eAJF,EAKE,gBALF,EAME,wBANF,EAOE,kBAPF,QAQO,UARP;AAWA,SAAS,WAAW,IAAI,oBAAxB,EAA8C,qBAA9C,QAA2E,eAA3E","sourcesContent":["export {\n  Switch,\n  renderSwitch_unstable,\n  // eslint-disable-next-line deprecation/deprecation\n  switchClassName,\n  switchClassNames,\n  useSwitchStyles_unstable,\n  useSwitch_unstable,\n} from './Switch';\nexport type { SwitchOnChangeData, SwitchProps, SwitchSlots, SwitchState } from './Switch';\n\nexport { SwitchField as SwitchField_unstable, switchFieldClassNames } from './SwitchField';\nexport type { SwitchFieldProps as SwitchFieldProps_unstable } from './SwitchField';\n"],"sourceRoot":"../src/"}

package/lib-amd/Switch.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/Switch/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=Switch.js.map

package/lib-amd/Switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-switch/src/Switch.ts"],"names":[],"mappings":";;;IAAA,uCAA0C","sourcesContent":["export * from './components/Switch/index';\n"]}

package/lib-amd/SwitchField.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/SwitchField/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=SwitchField.js.map

package/lib-amd/SwitchField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchField.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-switch/src/SwitchField.ts"],"names":[],"mappings":";;;IAAA,uCAA+C","sourcesContent":["export * from './components/SwitchField/index';\n"]}

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

@@ -0,0 +1,15 @@
+define(["require", "exports", "react", "./useSwitch", "./renderSwitch", "./useSwitchStyles"], function (require, exports, React, useSwitch_1, renderSwitch_1, useSwitchStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.Switch = void 0;
+    /**
+     * Switches enable users to trigger an option on or off through pressing the component.
+     */
+    exports.Switch = React.forwardRef(function (props, ref) {
+        var state = useSwitch_1.useSwitch_unstable(props, ref);
+        useSwitchStyles_1.useSwitchStyles_unstable(state);
+        return renderSwitch_1.renderSwitch_unstable(state);
+    });
+    exports.Switch.displayName = 'Switch';
+});
+//# sourceMappingURL=Switch.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-switch/src/components/Switch/Switch.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,MAAM,GAAqC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAClF,IAAM,KAAK,GAAG,8BAAkB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAE7C,0CAAwB,CAAC,KAAK,CAAC,CAAC;QAEhC,OAAO,oCAAqB,CAAC,KAAK,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,cAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import * as React from 'react';\nimport { useSwitch_unstable } from './useSwitch';\nimport { renderSwitch_unstable } from './renderSwitch';\nimport { useSwitchStyles_unstable } from './useSwitchStyles';\nimport type { SwitchProps } from './Switch.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderSwitch_unstable(state);\n});\n\nSwitch.displayName = 'Switch';\n"]}

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

@@ -0,0 +1,5 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});
+//# sourceMappingURL=Switch.types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-switch/src/components/Switch/Switch.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SwitchSlots = {\n  /**\n   * The root element of the Switch.\n   *\n   * The root slot receives the `className` and `style` specified directly on the `<Switch>` tag.\n   * All other native props will be applied to the primary slot: `input`.\n   */\n  root: NonNullable<Slot<'div'>>;\n\n  /**\n   * The track and the thumb sliding over it indicating the on and off status of the Switch.\n   */\n  indicator: NonNullable<Slot<'div'>>;\n\n  /**\n   * Hidden input that handles the Switch's functionality.\n   *\n   * This is the PRIMARY slot: all native properties specified directly on the `<Switch>` tag will be applied to this\n   * slot, except `className` and `style`, which remain on the root slot.\n   */\n  input: NonNullable<Slot<'input'>>;\n\n  /**\n   * The Switch's label.\n   */\n  label?: Slot<typeof Label>;\n};\n\nexport type SwitchOnChangeData = {\n  checked: boolean;\n};\n\n/**\n * Switch Props\n */\nexport type SwitchProps = Omit<\n  ComponentProps<Partial<SwitchSlots>, 'input'>,\n  'checked' | 'defaultChecked' | 'onChange'\n> & {\n  /**\n   * Defines the controlled checked state of the Switch.\n   * If passed, Switch ignores the `defaultChecked` property.\n   * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n   * correct value based on handling `onChange` events and re-rendering.\n   *\n   * @default false\n   */\n  checked?: boolean;\n\n  /**\n   * Defines whether the Switch is initially in a checked state or not when rendered.\n   *\n   * @default false\n   */\n  defaultChecked?: boolean;\n\n  /**\n   * The position of the label relative to the Switch.\n   *\n   * @default after\n   */\n  labelPosition?: 'above' | 'after' | 'before';\n\n  /**\n   * Callback to be called when the checked state value changes.\n   */\n  onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: SwitchOnChangeData) => void;\n};\n\n/**\n * State used in rendering Switch\n */\nexport type SwitchState = ComponentState<SwitchSlots> & Required<Pick<SwitchProps, 'labelPosition'>>;\n"]}

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

@@ -0,0 +1,10 @@
+define(["require", "exports", "tslib", "./Switch", "./Switch.types", "./renderSwitch", "./useSwitch", "./useSwitchStyles"], function (require, exports, tslib_1, Switch_1, Switch_types_1, renderSwitch_1, useSwitch_1, useSwitchStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(Switch_1, exports);
+    tslib_1.__exportStar(Switch_types_1, exports);
+    tslib_1.__exportStar(renderSwitch_1, exports);
+    tslib_1.__exportStar(useSwitch_1, exports);
+    tslib_1.__exportStar(useSwitchStyles_1, exports);
+});
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-switch/src/components/Switch/index.ts"],"names":[],"mappings":";;;IAAA,wCAAyB;IACzB,8CAA+B;IAC/B,8CAA+B;IAC/B,2CAA4B;IAC5B,iDAAkC","sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles';\n"]}

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

@@ -0,0 +1,19 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities"], function (require, exports, tslib_1, React, react_utilities_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.renderSwitch_unstable = void 0;
+    /**
+     * Render a Switch component by passing the state defined props to the appropriate slots.
+     */
+    var renderSwitch_unstable = function (state) {
+        var _a = react_utilities_1.getSlots(state), slots = _a.slots, slotProps = _a.slotProps;
+        var labelPosition = state.labelPosition;
+        return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root),
+            React.createElement(slots.input, tslib_1.__assign({}, slotProps.input)),
+            labelPosition !== 'after' && slots.label && React.createElement(slots.label, tslib_1.__assign({}, slotProps.label)),
+            React.createElement(slots.indicator, tslib_1.__assign({}, slotProps.indicator)),
+            labelPosition === 'after' && slots.label && React.createElement(slots.label, tslib_1.__assign({}, slotProps.label))));
+    };
+    exports.renderSwitch_unstable = renderSwitch_unstable;
+});
+//# sourceMappingURL=renderSwitch.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"renderSwitch.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-switch/src/components/Switch/renderSwitch.tsx"],"names":[],"mappings":";;;;IAIA;;OAEG;IACI,IAAM,qBAAqB,GAAG,UAAC,KAAkB;QAChD,IAAA,KAAuB,0BAAQ,CAAc,KAAK,CAAC,EAAjD,KAAK,WAAA,EAAE,SAAS,eAAiC,CAAC;QAClD,IAAA,aAAa,GAAK,KAAK,cAAV,CAAW;QAEhC,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI;YAC5B,oBAAC,KAAK,CAAC,KAAK,uBAAK,SAAS,CAAC,KAAK,EAAI;YACnC,aAAa,KAAK,OAAO,IAAI,KAAK,CAAC,KAAK,IAAI,oBAAC,KAAK,CAAC,KAAK,uBAAK,SAAS,CAAC,KAAK,EAAI;YACjF,oBAAC,KAAK,CAAC,SAAS,uBAAK,SAAS,CAAC,SAAS,EAAI;YAC3C,aAAa,KAAK,OAAO,IAAI,KAAK,CAAC,KAAK,IAAI,oBAAC,KAAK,CAAC,KAAK,uBAAK,SAAS,CAAC,KAAK,EAAI,CACtE,CACd,CAAC;IACJ,CAAC,CAAC;IAZW,QAAA,qBAAqB,yBAYhC","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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  const { slots, slotProps } = getSlots<SwitchSlots>(state);\n  const { labelPosition } = state;\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.input {...slotProps.input} />\n      {labelPosition !== 'after' && slots.label && <slots.label {...slotProps.label} />}\n      <slots.indicator {...slotProps.indicator} />\n      {labelPosition === 'after' && slots.label && <slots.label {...slotProps.label} />}\n    </slots.root>\n  );\n};\n"]}

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

@@ -0,0 +1,63 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-icons", "@fluentui/react-label", "@fluentui/react-tabster", "@fluentui/react-utilities"], function (require, exports, tslib_1, React, react_icons_1, react_label_1, react_tabster_1, react_utilities_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useSwitch_unstable = void 0;
+    /**
+     * Create the state required to render Switch.
+     *
+     * The returned state can be modified with hooks such as useSwitchStyles_unstable,
+     * before being passed to renderSwitch_unstable.
+     *
+     * @param props - props from this instance of Switch
+     * @param ref - reference to `<input>` element of Switch
+     */
+    var useSwitch_unstable = function (props, ref) {
+        var checked = props.checked, defaultChecked = props.defaultChecked, disabled = props.disabled, _a = props.labelPosition, labelPosition = _a === void 0 ? 'after' : _a, onChange = props.onChange, required = props.required;
+        var nativeProps = react_utilities_1.getPartitionedNativeProps({
+            props: props,
+            primarySlotTagName: 'input',
+            excludedPropNames: ['checked', 'defaultChecked', 'onChange'],
+        });
+        var id = react_utilities_1.useId('switch-', nativeProps.primary.id);
+        var root = react_utilities_1.resolveShorthand(props.root, {
+            defaultProps: tslib_1.__assign({ ref: react_tabster_1.useFocusWithin() }, nativeProps.root),
+            required: true,
+        });
+        var indicator = react_utilities_1.resolveShorthand(props.indicator, {
+            defaultProps: {
+                'aria-hidden': true,
+                children: React.createElement(react_icons_1.CircleFilled, null),
+            },
+            required: true,
+        });
+        var input = react_utilities_1.resolveShorthand(props.input, {
+            defaultProps: tslib_1.__assign({ checked: checked, defaultChecked: defaultChecked, id: id, ref: ref, role: 'switch', type: 'checkbox' }, nativeProps.primary),
+            required: true,
+        });
+        input.onChange = react_utilities_1.mergeCallbacks(input.onChange, function (ev) { return onChange === null || onChange === void 0 ? void 0 : onChange(ev, { checked: ev.currentTarget.checked }); });
+        var label = react_utilities_1.resolveShorthand(props.label, {
+            defaultProps: {
+                disabled: disabled,
+                htmlFor: id,
+                required: required,
+                size: 'medium',
+            },
+        });
+        return {
+            labelPosition: labelPosition,
+            //Slots definition
+            components: {
+                root: 'div',
+                indicator: 'div',
+                input: 'input',
+                label: react_label_1.Label,
+            },
+            root: root,
+            indicator: indicator,
+            input: input,
+            label: label,
+        };
+    };
+    exports.useSwitch_unstable = useSwitch_unstable;
+});
+//# sourceMappingURL=useSwitch.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useSwitch.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-switch/src/components/Switch/useSwitch.tsx"],"names":[],"mappings":";;;;IAOA;;;;;;;;OAQG;IACI,IAAM,kBAAkB,GAAG,UAAC,KAAkB,EAAE,GAAgC;QAC7E,IAAA,OAAO,GAA4E,KAAK,QAAjF,EAAE,cAAc,GAA4D,KAAK,eAAjE,EAAE,QAAQ,GAAkD,KAAK,SAAvD,EAAE,KAAgD,KAAK,cAA9B,EAAvB,aAAa,mBAAG,OAAO,KAAA,EAAE,QAAQ,GAAe,KAAK,SAApB,EAAE,QAAQ,GAAK,KAAK,SAAV,CAAW;QAEjG,IAAM,WAAW,GAAG,2CAAyB,CAAC;YAC5C,KAAK,OAAA;YACL,kBAAkB,EAAE,OAAO;YAC3B,iBAAiB,EAAE,CAAC,SAAS,EAAE,gBAAgB,EAAE,UAAU,CAAC;SAC7D,CAAC,CAAC;QAEH,IAAM,EAAE,GAAG,uBAAK,CAAC,SAAS,EAAE,WAAW,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAEpD,IAAM,IAAI,GAAG,kCAAgB,CAAC,KAAK,CAAC,IAAI,EAAE;YACxC,YAAY,qBAAI,GAAG,EAAE,8BAAc,EAAkB,IAAK,WAAW,CAAC,IAAI,CAAE;YAC5E,QAAQ,EAAE,IAAI;SACf,CAAC,CAAC;QAEH,IAAM,SAAS,GAAG,kCAAgB,CAAC,KAAK,CAAC,SAAS,EAAE;YAClD,YAAY,EAAE;gBACZ,aAAa,EAAE,IAAI;gBACnB,QAAQ,EAAE,oBAAC,0BAAY,OAAG;aAC3B;YACD,QAAQ,EAAE,IAAI;SACf,CAAC,CAAC;QAEH,IAAM,KAAK,GAAG,kCAAgB,CAAC,KAAK,CAAC,KAAK,EAAE;YAC1C,YAAY,qBACV,OAAO,SAAA,EACP,cAAc,gBAAA,EACd,EAAE,IAAA,EACF,GAAG,KAAA,EACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,UAAU,IACb,WAAW,CAAC,OAAO,CACvB;YACD,QAAQ,EAAE,IAAI;SACf,CAAC,CAAC;QACH,KAAK,CAAC,QAAQ,GAAG,gCAAc,CAAC,KAAK,CAAC,QAAQ,EAAE,UAAA,EAAE,IAAI,OAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,CAAC,aAAa,CAAC,OAAO,EAAE,CAAC,EAArD,CAAqD,CAAC,CAAC;QAE7G,IAAM,KAAK,GAAG,kCAAgB,CAAC,KAAK,CAAC,KAAK,EAAE;YAC1C,YAAY,EAAE;gBACZ,QAAQ,UAAA;gBACR,OAAO,EAAE,EAAE;gBACX,QAAQ,UAAA;gBACR,IAAI,EAAE,QAAQ;aACf;SACF,CAAC,CAAC;QAEH,OAAO;YACL,aAAa,eAAA;YAEb,kBAAkB;YAClB,UAAU,EAAE;gBACV,IAAI,EAAE,KAAK;gBACX,SAAS,EAAE,KAAK;gBAChB,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,mBAAK;aACb;YAED,IAAI,MAAA;YACJ,SAAS,WAAA;YACT,KAAK,OAAA;YACL,KAAK,OAAA;SACN,CAAC;IACJ,CAAC,CAAC;IA/DW,QAAA,kBAAkB,sBA+D7B","sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useId } 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  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 = resolveShorthand(props.root, {\n    defaultProps: { ref: useFocusWithin<HTMLDivElement>(), ...nativeProps.root },\n    required: true,\n  });\n\n  const indicator = resolveShorthand(props.indicator, {\n    defaultProps: {\n      'aria-hidden': true,\n      children: <CircleFilled />,\n    },\n    required: true,\n  });\n\n  const input = resolveShorthand(props.input, {\n    defaultProps: {\n      checked,\n      defaultChecked,\n      id,\n      ref,\n      role: 'switch',\n      type: 'checkbox',\n      ...nativeProps.primary,\n    },\n    required: true,\n  });\n  input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n\n  const label = resolveShorthand(props.label, {\n    defaultProps: {\n      disabled,\n      htmlFor: id,\n      required,\n      size: 'medium',\n    },\n  });\n\n  return {\n    labelPosition,\n\n    //Slots definition\n    components: {\n      root: 'div',\n      indicator: 'div',\n      input: 'input',\n      label: Label,\n    },\n\n    root,\n    indicator,\n    input,\n    label,\n  };\n};\n"]}