@fluentui/react-switch 9.1.87 → 9.1.88

package/CHANGELOG.md

@@ -1,12 +1,27 @@
 # Change Log - @fluentui/react-switch
 
-This log was last generated on Mon, 01 Jul 2024 20:25:45 GMT and should not be manually modified.
+This log was last generated on Mon, 15 Jul 2024 17:19:58 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.1.88](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.1.88)
+
+Mon, 15 Jul 2024 17:19:58 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.1.87..@fluentui/react-switch_v9.1.88)
+
+### Patches
+
+- fix: revert incorectly set npm versions in all packages ([PR #31937](https://github.com/microsoft/fluentui/pull/31937) by martinhochel@microsoft.com)
+- Bump @fluentui/react-field to v9.1.70 ([PR #31998](https://github.com/microsoft/fluentui/pull/31998) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.41 ([PR #31998](https://github.com/microsoft/fluentui/pull/31998) by beachball)
+- Bump @fluentui/react-label to v9.1.73 ([PR #31998](https://github.com/microsoft/fluentui/pull/31998) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.19.1 ([PR #31998](https://github.com/microsoft/fluentui/pull/31998) by beachball)
+- Bump @fluentui/react-tabster to v9.22.2 ([PR #31998](https://github.com/microsoft/fluentui/pull/31998) by beachball)
+- Bump @fluentui/react-utilities to v9.18.12 ([PR #31998](https://github.com/microsoft/fluentui/pull/31998) by beachball)
+
 ## [9.1.87](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.1.87)
 
-Mon, 01 Jul 2024 20:25:45 GMT 
+Mon, 01 Jul 2024 20:30:32 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.1.86..@fluentui/react-switch_v9.1.87)
 
 ### Patches

package/lib/Switch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Switch.ts"],"sourcesContent":["export * from './components/Switch/index';\n"],"names":[],"mappings":"AAAA,cAAc,4BAA4B"}
+{"version":3,"sources":["Switch.ts"],"sourcesContent":["export * from './components/Switch/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,4BAA4B"}

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;IAC/E,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"],"rangeMappings":";;;;;;;;;;;;;","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/Switch.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Switch.types.ts"],"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  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\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"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["Switch.types.ts"],"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  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\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"],"names":["React"],"rangeMappings":"","mappings":"AAAA,YAAYA,WAAW,QAAQ"}

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,WAAW;AACzB,cAAc,iBAAiB;AAC/B,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,2BAA2B"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,WAAW;AACzB,cAAc,iBAAiB;AAC/B,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,2BAA2B"}

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

@@ -1 +1 @@
-{"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"}
+{"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"],"rangeMappings":";;;;;;;;;;;;;;;","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.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;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,KAAMhB,qBAAAA,+BAAAA,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"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","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,KAAMhB,qBAAAA,+BAAAA,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"}

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"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"],"names":["Switch","renderSwitch_unstable","switchClassName","switchClassNames","useSwitchStyles_unstable","useSwitch_unstable"],"mappings":"AAAA,SACEA,MAAM,EACNC,qBAAqB,EACrB,mDAAmD;AACnDC,eAAe,EACfC,gBAAgB,EAChBC,wBAAwB,EACxBC,kBAAkB,QACb,WAAW"}
+{"version":3,"sources":["index.ts"],"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"],"names":["Switch","renderSwitch_unstable","switchClassName","switchClassNames","useSwitchStyles_unstable","useSwitch_unstable"],"rangeMappings":";","mappings":"AAAA,SACEA,MAAM,EACNC,qBAAqB,EACrB,mDAAmD;AACnDC,eAAe,EACfC,gBAAgB,EAChBC,wBAAwB,EACxBC,kBAAkB,QACb,WAAW"}

package/lib-commonjs/Switch.js.map

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

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;;;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"}
+{"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":["Switch","React","forwardRef","props","ref","state","useSwitch_unstable","useSwitchStyles_unstable","useCustomStyleHook_unstable","renderSwitch_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;2BACY;8BACG;uCACG;qCAGG;AAKrC,MAAMA,SAAAA,WAAAA,GAA2CC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC/E,MAAMC,QAAQC,IAAAA,6BAAAA,EAAmBH,OAAOC;IAExCG,IAAAA,+CAAAA,EAAyBF;IAEzBG,IAAAA,gDAAAA,EAA4B,4BAA4BH;IAExD,OAAOI,IAAAA,mCAAAA,EAAsBJ;AAC/B;AAEAL,OAAOU,WAAW,GAAG"}

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":";;;;;iEAAuB"}
+{"version":3,"sources":["Switch.types.ts"],"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  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\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"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}

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":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Switch';\nexport * from './Switch.types';\nexport * from './renderSwitch';\nexport * from './useSwitch';\nexport * from './useSwitchStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}

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

@@ -1 +1 @@
-{"version":3,"sources":["renderSwitch.js"],"sourcesContent":["  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":";;;;+BAIiBA;;;eAAAA;;;4BAJ4B;gCACjB;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"}
+{"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":["renderSwitch_unstable","state","assertSlots","labelPosition","_jsxs","root","_jsx","input","label","indicator"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;4BARb;gCAE4B;AAMrB,MAAMA,wBAAwB,CAACC;IACpCC,IAAAA,2BAAAA,EAAyBD;IACzB,MAAM,EAAEE,aAAa,EAAE,GAAGF;IAE1B,OAAA,WAAA,GACEG,IAAAA,gBAAA,EAACH,MAAMI,IAAI,EAAA;;0BACTC,IAAAA,eAAA,EAACL,MAAMM,KAAK,EAAA,CAAA;YACXJ,kBAAkB,WAAWF,MAAMO,KAAK,IAAA,WAAA,GAAIF,IAAAA,eAAA,EAACL,MAAMO,KAAK,EAAA,CAAA;0BACzDF,IAAAA,eAAA,EAACL,MAAMQ,SAAS,EAAA,CAAA;YACfN,kBAAkB,WAAWF,MAAMO,KAAK,IAAA,WAAA,GAAIF,IAAAA,eAAA,EAACL,MAAMO,KAAK,EAAA,CAAA;;;AAG/D"}

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)=>onChange === null || onChange === void 0 ? void 0 : onChange(ev, {\n            checked: ev.currentTarget.checked\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;;;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,KAAKxB,aAAa,QAAQA,aAAa,KAAK,IAAI,KAAK,IAAIA,SAASwB,IAAI;YAC/G5B,SAAS4B,GAAGC,aAAa,CAAC7B,OAAO;QACrC;IACJ,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.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":["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"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAiBaA;;;eAAAA;;;;iEAjBU;4BACuB;4BACjB;4BACP;8BACS;gCACwC;AAYhE,MAAMA,qBAAqB,CAACC,OAAoBC;IACrD,+CAA+C;IAC/CD,QAAQE,IAAAA,yCAAAA,EAA8BF,OAAO;QAAEG,kBAAkB;QAAMC,kBAAkB;IAAK;IAE9F,MAAM,EAAEC,OAAO,EAAEC,cAAc,EAAEC,QAAQ,EAAEC,gBAAgB,OAAO,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGV;IAE3F,MAAMW,cAAcC,IAAAA,yCAAAA,EAA0B;QAC5CZ;QACAa,oBAAoB;QACpBC,mBAAmB;YAAC;YAAW;YAAkB;SAAW;IAC9D;IAEA,MAAMC,KAAKC,IAAAA,qBAAAA,EAAM,WAAWL,YAAYM,OAAO,CAACF,EAAE;IAElD,MAAMG,OAAOC,oBAAAA,CAAKC,MAAM,CAACpB,MAAMkB,IAAI,EAAE;QACnCG,cAAc;YAAEpB,KAAKqB,IAAAA,4BAAAA;YAAkC,GAAGX,YAAYO,IAAI;QAAC;QAC3EK,aAAa;IACf;IACA,MAAMC,YAAYL,oBAAAA,CAAKC,MAAM,CAACpB,MAAMwB,SAAS,EAAE;QAC7CH,cAAc;YAAE,eAAe;YAAMI,UAAAA,WAAAA,GAAUC,OAAAC,aAAA,CAACC,wBAAAA,EAAAA;QAAgB;QAChEL,aAAa;IACf;IACA,MAAMM,QAAQV,oBAAAA,CAAKC,MAAM,CAACpB,MAAM6B,KAAK,EAAE;QACrCR,cAAc;YAAEhB;YAASC;YAAgBS;YAAId;YAAK6B,MAAM;YAAUC,MAAM;YAAY,GAAGpB,YAAYM,OAAO;QAAC;QAC3GM,aAAa;IACf;IACAM,MAAMpB,QAAQ,GAAGuB,IAAAA,8BAAAA,EAAeH,MAAMpB,QAAQ,EAAEwB,CAAAA,KAAMxB,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWwB,IAAI;YAAE5B,SAAS4B,GAAGC,aAAa,CAAC7B,OAAO;QAAC;IACzG,MAAM8B,QAAQhB,oBAAAA,CAAKiB,QAAQ,CAACpC,MAAMmC,KAAK,EAAE;QACvCd,cAAc;YAAEd;YAAU8B,SAAStB;YAAIL;YAAU4B,MAAM;QAAS;QAChEf,aAAagB,iBAAAA;IACf;IACA,OAAO;QACL/B;QACAgC,YAAY;YAAEtB,MAAM;YAAOM,WAAW;YAAOK,OAAO;YAASM,OAAOI,iBAAAA;QAAM;QAE1ErB;QACAM;QACAK;QACAM;IACF;AACF"}

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

@@ -9,12 +9,12 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    switchClassNames: function() {
-        return switchClassNames;
-    },
     switchClassName: function() {
         return switchClassName;
     },
+    switchClassNames: function() {
+        return switchClassNames;
+    },
     useSwitchStyles_unstable: function() {
         return useSwitchStyles_unstable;
     }

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 } 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(\"r2i81i2\", \"rofhmb8\", {\n  r: [\".r2i81i2{align-items:flex-start;box-sizing:border-box;display:inline-flex;position:relative;}\", \".r2i81i2:focus{outline-style:none;}\", \".r2i81i2:focus-visible{outline-style:none;}\", \".r2i81i2[data-fui-focus-within]:focus-within{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".r2i81i2[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".rofhmb8{align-items:flex-start;box-sizing:border-box;display:inline-flex;position:relative;}\", \".rofhmb8:focus{outline-style:none;}\", \".rofhmb8:focus-visible{outline-style:none;}\", \".rofhmb8[data-fui-focus-within]:focus-within{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".rofhmb8[data-fui-focus-within]:focus-within::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n  s: [\"@media (forced-colors: active){.r2i81i2[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media (forced-colors: active){.rofhmb8[data-fui-focus-within]:focus-within::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\"]\n});\nconst useRootStyles = /*#__PURE__*/__styles({\n  vertical: {\n    Beiy3e4: \"f1vx9l62\"\n  }\n}, {\n  d: [\".f1vx9l62{flex-direction:column;}\"]\n});\nconst useIndicatorBaseClassName = /*#__PURE__*/__resetStyles(\"r1c3hft5\", null, {\n  r: [\".r1c3hft5{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;}\", \".r1c3hft5>*{transition-duration:var(--durationNormal);transition-timing-function:var(--curveEasyEase);transition-property:transform;}\"],\n  s: [\"@media screen and (prefers-reduced-motion: reduce){.r1c3hft5{transition-duration:0.01ms;}}\", \"@media (forced-colors: active){.r1c3hft5{color:CanvasText;}.r1c3hft5>i{forced-color-adjust:none;}}\", \"@media screen and (prefers-reduced-motion: reduce){.r1c3hft5>*{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(\"rsji9ng\", \"r15xih98\", {\n  r: [\".rsji9ng{box-sizing:border-box;cursor:pointer;height:100%;margin:0;opacity:0;position:absolute;width:calc(40px + 2 * var(--spacingHorizontalS));}\", \".rsji9ng:checked~.fui-Switch__indicator>*{transform:translateX(20px);}\", \".rsji9ng:disabled{cursor:default;}\", \".rsji9ng:disabled~.fui-Switch__indicator{color:var(--colorNeutralForegroundDisabled);}\", \".rsji9ng:disabled~.fui-Switch__label{cursor:default;color:var(--colorNeutralForegroundDisabled);}\", \".rsji9ng:enabled:not(:checked)~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessible);border-color:var(--colorNeutralStrokeAccessible);}\", \".rsji9ng:enabled:not(:checked)~.fui-Switch__label{color:var(--colorNeutralForeground1);}\", \".rsji9ng:enabled:not(:checked):hover~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessibleHover);border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".rsji9ng:enabled:not(:checked):hover:active~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessiblePressed);border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".rsji9ng:enabled:checked~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackground);color:var(--colorNeutralForegroundInverted);border-color:var(--colorTransparentStroke);}\", \".rsji9ng:enabled:checked:hover~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundHover);border-color:var(--colorTransparentStrokeInteractive);}\", \".rsji9ng:enabled:checked:hover:active~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundPressed);border-color:var(--colorTransparentStrokeInteractive);}\", \".rsji9ng:disabled:not(:checked)~.fui-Switch__indicator{border-color:var(--colorNeutralStrokeDisabled);}\", \".rsji9ng:disabled:checked~.fui-Switch__indicator{background-color:var(--colorNeutralBackgroundDisabled);border-color:var(--colorTransparentStrokeDisabled);}\", \".r15xih98{box-sizing:border-box;cursor:pointer;height:100%;margin:0;opacity:0;position:absolute;width:calc(40px + 2 * var(--spacingHorizontalS));}\", \".r15xih98:checked~.fui-Switch__indicator>*{transform:translateX(-20px);}\", \".r15xih98:disabled{cursor:default;}\", \".r15xih98:disabled~.fui-Switch__indicator{color:var(--colorNeutralForegroundDisabled);}\", \".r15xih98:disabled~.fui-Switch__label{cursor:default;color:var(--colorNeutralForegroundDisabled);}\", \".r15xih98:enabled:not(:checked)~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessible);border-color:var(--colorNeutralStrokeAccessible);}\", \".r15xih98:enabled:not(:checked)~.fui-Switch__label{color:var(--colorNeutralForeground1);}\", \".r15xih98:enabled:not(:checked):hover~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessibleHover);border-color:var(--colorNeutralStrokeAccessibleHover);}\", \".r15xih98:enabled:not(:checked):hover:active~.fui-Switch__indicator{color:var(--colorNeutralStrokeAccessiblePressed);border-color:var(--colorNeutralStrokeAccessiblePressed);}\", \".r15xih98:enabled:checked~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackground);color:var(--colorNeutralForegroundInverted);border-color:var(--colorTransparentStroke);}\", \".r15xih98:enabled:checked:hover~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundHover);border-color:var(--colorTransparentStrokeInteractive);}\", \".r15xih98:enabled:checked:hover:active~.fui-Switch__indicator{background-color:var(--colorCompoundBrandBackgroundPressed);border-color:var(--colorTransparentStrokeInteractive);}\", \".r15xih98:disabled:not(:checked)~.fui-Switch__indicator{border-color:var(--colorNeutralStrokeDisabled);}\", \".r15xih98:disabled:checked~.fui-Switch__indicator{background-color:var(--colorNeutralBackgroundDisabled);border-color:var(--colorTransparentStrokeDisabled);}\"],\n  s: [\"@media (forced-colors: active){.rsji9ng:disabled~.fui-Switch__indicator{color:GrayText;border-color:GrayText;}.rsji9ng:disabled~.fui-Switch__label{color:GrayText;}.rsji9ng:hover{color:CanvasText;}.rsji9ng:hover:active{color:CanvasText;}.rsji9ng:enabled:checked:hover~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.rsji9ng:enabled:checked:hover:active~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.rsji9ng:enabled:checked~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}}\", \"@media (forced-colors: active){.r15xih98:disabled~.fui-Switch__indicator{color:GrayText;border-color:GrayText;}.r15xih98:disabled~.fui-Switch__label{color:GrayText;}.r15xih98:hover{color:CanvasText;}.r15xih98:hover:active{color:CanvasText;}.r15xih98:enabled:checked:hover~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.r15xih98:enabled:checked:hover:active~.fui-Switch__indicator{background-color:Highlight;color:Canvas;}.r15xih98: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    Byoj8tv: 0,\n    uwmqm3: 0,\n    z189sj: 0,\n    z8tnut: 0,\n    B0ocmuz: \"f1f5q0n8\"\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);}\", [\".f1f5q0n8{padding:var(--spacingVerticalS) var(--spacingHorizontalS);}\", {\n    p: -1\n  }], \".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  'use no memo';\n\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","r","s","useRootStyles","__styles","vertical","Beiy3e4","d","useIndicatorBaseClassName","useIndicatorStyles","labelAbove","B6of3ja","useInputBaseClassName","useInputStyles","before","j35jbq","Bhzewxz","after","oyh7mz","above","B5kzvoi","Bqenvij","a9b677","useLabelStyles","base","Bceei9c","jrapky","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","p","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 { makeResetStyles, makeStyles, mergeClasses } 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    '@media (forced-colors: active)': {\n        color: 'CanvasText',\n        '> i': {\n            forcedColorAdjust: 'none'\n        }\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        ':hover': {\n            color: 'CanvasText'\n        },\n        ':hover:active': {\n            color: 'CanvasText'\n        },\n        ':enabled:checked': {\n            ':hover': {\n                [`& ~ .${switchClassNames.indicator}`]: {\n                    backgroundColor: 'Highlight',\n                    color: 'Canvas'\n                }\n            },\n            ':hover:active': {\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        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    'use no memo';\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"],"names":["switchClassName","switchClassNames","useSwitchStyles_unstable","root","indicator","input","label","spaceBetweenThumbAndTrack","trackHeight","trackWidth","thumbSize","useRootBaseClassName","__resetStyles","r","s","useRootStyles","__styles","vertical","Beiy3e4","d","useIndicatorBaseClassName","useIndicatorStyles","labelAbove","B6of3ja","useInputBaseClassName","useInputStyles","before","j35jbq","Bhzewxz","after","oyh7mz","above","B5kzvoi","Bqenvij","a9b677","useLabelStyles","base","Bceei9c","jrapky","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","p","state","rootBaseClassName","rootStyles","indicatorBaseClassName","indicatorStyles","inputBaseClassName","inputStyles","labelStyles","labelPosition","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

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;eAANA,cAAM;;IAAEC,qBAAqB;eAArBA,6BAAqB;;IACtCC,eAAe;eAAfA,uBAAe;;IAAEC,gBAAgB;eAAhBA,wBAAgB;;IAAEC,wBAAwB;eAAxBA,gCAAwB;;IAAEC,kBAAkB;eAAlBA,0BAAkB;;;wBAAQ"}
+{"version":3,"sources":["index.ts"],"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"],"names":["Switch","renderSwitch_unstable","switchClassName","switchClassNames","useSwitchStyles_unstable","useSwitch_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IACEA,MAAM;eAANA,cAAM;;IACNC,qBAAqB;eAArBA,6BAAqB;;IAErBC,eAAe;eAAfA,uBAAe;;IACfC,gBAAgB;eAAhBA,wBAAgB;;IAChBC,wBAAwB;eAAxBA,gCAAwB;;IACxBC,kBAAkB;eAAlBA,0BAAkB;;;wBACb"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-switch",
-  "version": "9.1.87",
+  "version": "9.1.88",
   "description": "Fluent UI React Switch component.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -32,14 +32,14 @@
     "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
-    "@fluentui/react-field": "^9.1.69",
+    "@fluentui/react-field": "^9.1.70",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-jsx-runtime": "^9.0.40",
-    "@fluentui/react-label": "^9.1.72",
-    "@fluentui/react-shared-contexts": "^9.19.0",
-    "@fluentui/react-tabster": "^9.22.1",
+    "@fluentui/react-jsx-runtime": "^9.0.41",
+    "@fluentui/react-label": "^9.1.73",
+    "@fluentui/react-shared-contexts": "^9.19.1",
+    "@fluentui/react-tabster": "^9.22.2",
     "@fluentui/react-theme": "^9.1.19",
-    "@fluentui/react-utilities": "^9.18.11",
+    "@fluentui/react-utilities": "^9.18.12",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1"
   },