@fluentui/react-switch 0.0.0-nightly627ad67f1120211109.1 → 0.0.0-nightly6faffd280a20220221.1

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

@@ -1 +1 @@
-{"version":3,"file":"Switch.types.js","sourceRoot":"","sources":["../../../src/components/Switch/Switch.types.ts"],"names":[],"mappings":""}
+{"version":3,"file":"Switch.types.js","sourceRoot":"../src/","sources":["components/Switch/Switch.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SwitchSlots = {\n  /**\n   * The root of the Switch.\n   */\n  root: Slot<'div'>;\n\n  /**\n   * The bar indicating the status of the Switch.\n   */\n  track: NonNullable<Slot<'div'>>;\n\n  /**\n   * The wrapper around the thumb. It is used as the active area for the thumb to position itself.\n   */\n  thumbWrapper: NonNullable<Slot<'div'>>;\n\n  /**\n   * The circular icon indicating the status of the Switch.\n   */\n  thumb: NonNullable<Slot<'div'>>;\n\n  /**\n   * The hidden input that handles the Switch's internal functionality.\n   */\n  input: NonNullable<Slot<'input'>>;\n\n  /**\n   * The area in which the Switch's rail allows for the thumb to be dragged.\n   */\n  activeRail: NonNullable<Slot<'div'>>;\n};\n\ninterface SwitchCommons {\n  /**\n   * The starting value for a uncontrolled Switch. If `true` then the Switch will be enabled.\n   * Mutually exclusive with `checked` prop.\n   *\n   * @default false\n   */\n  defaultChecked?: boolean;\n\n  /**\n   * The current value for a controlled Switch. If `true` then the Switch will be enabled.\n   * Mutually exclusive with `defaultChecked` prop.\n   */\n  checked?: boolean;\n\n  /**\n   * Whether the Switch should be disabled.\n   *\n   * @default false\n   */\n  disabled?: boolean;\n\n  /**\n   * Callback to be called when the `checked` value changes.\n   */\n  onChange?: (\n    ev: React.PointerEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>,\n    data: {\n      checked: boolean;\n    },\n  ) => void;\n}\n\nexport interface SwitchProps extends Omit<ComponentProps<Partial<SwitchSlots>>, 'onChange'>, SwitchCommons {}\n\nexport interface SwitchState extends ComponentState<SwitchSlots>, SwitchCommons {}\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../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"}
+{"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"]}

package/lib/components/Switch/renderSwitch.d.ts

@@ -2,4 +2,4 @@ import type { SwitchState } from './Switch.types';
 /**
  * Render the final JSX of Switch
  */
-export declare const renderSwitch: (state: SwitchState) => JSX.Element;
+export declare const renderSwitch_unstable: (state: SwitchState) => JSX.Element;

package/lib/components/Switch/renderSwitch.js

@@ -1,15 +1,20 @@
 import * as React from 'react';
 import { getSlots } from '@fluentui/react-utilities';
-import { switchShorthandProps } from './useSwitch';
 /**
  * Render the final JSX of Switch
  */
 
-export const renderSwitch = state => {
+export const renderSwitch_unstable = state => {
   const {
     slots,
     slotProps
-  } = getSlots(state, switchShorthandProps);
-  return /*#__PURE__*/React.createElement(slots.root, Object.assign({}, slotProps.root), /*#__PURE__*/React.createElement(slots.track, Object.assign({}, slotProps.track)), /*#__PURE__*/React.createElement(slots.thumbWrapper, Object.assign({}, slotProps.thumbWrapper), /*#__PURE__*/React.createElement(slots.thumb, Object.assign({}, slotProps.thumb))), /*#__PURE__*/React.createElement(slots.input, Object.assign({}, slotProps.input)), /*#__PURE__*/React.createElement(slots.activeRail, Object.assign({}, slotProps.activeRail)));
+  } = getSlots(state);
+  return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
+  }, /*#__PURE__*/React.createElement(slots.track, { ...slotProps.track
+  }), /*#__PURE__*/React.createElement(slots.thumbWrapper, { ...slotProps.thumbWrapper
+  }, /*#__PURE__*/React.createElement(slots.thumb, { ...slotProps.thumb
+  })), /*#__PURE__*/React.createElement(slots.input, { ...slotProps.input
+  }), /*#__PURE__*/React.createElement(slots.activeRail, { ...slotProps.activeRail
+  }));
 };
 //# sourceMappingURL=renderSwitch.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Switch/renderSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AACA,SAAS,oBAAT,QAAqC,aAArC;AAGA;;AAEG;;AACH,OAAO,MAAM,YAAY,GAAI,KAAD,IAAuB;AACjD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAc,KAAd,EAAqB,oBAArB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,KAAf,CAAZ,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,YAAP,EAAmB,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,YAAf,CAAnB,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,KAAf,CAAZ,CADF,CAFF,eAKE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,KAAf,CAAZ,CALF,eAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,UAAf,CAAjB,CANF,CADF;AAUD,CAbM","sourceRoot":""}
+{"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;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAc,KAAd,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,YAAP,EAAmB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAnB,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,CAFF,eAKE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CALF,eAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CANF,CADF;AAUD,CAbM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SwitchState, SwitchSlots } from './Switch.types';\n\n/**\n * Render the final JSX of Switch\n */\nexport const renderSwitch_unstable = (state: SwitchState) => {\n  const { slots, slotProps } = getSlots<SwitchSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.track {...slotProps.track} />\n      <slots.thumbWrapper {...slotProps.thumbWrapper}>\n        <slots.thumb {...slotProps.thumb} />\n      </slots.thumbWrapper>\n      <slots.input {...slotProps.input} />\n      <slots.activeRail {...slotProps.activeRail} />\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}

package/lib/components/Switch/useSwitch.d.ts

@@ -1,10 +1,6 @@
 import * as React from 'react';
-import type { SwitchProps, SwitchSlots, SwitchState } from './Switch.types';
-/**
- * Array of all shorthand properties listed in SwitchSlots
- */
-export declare const switchShorthandProps: (keyof SwitchSlots)[];
+import type { SwitchProps, SwitchState } from './Switch.types';
 /**
  * Given user props, returns state and render function for a Switch.
  */
-export declare const useSwitch: (props: SwitchProps, ref: React.Ref<HTMLElement>) => SwitchState;
+export declare const useSwitch_unstable: (props: SwitchProps, ref: React.Ref<HTMLElement>) => SwitchState;

package/lib/components/Switch/useSwitch.js

@@ -1,15 +1,10 @@
 import { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';
 import { useSwitchState } from './useSwitchState';
-/**
- * Array of all shorthand properties listed in SwitchSlots
- */
-
-export const switchShorthandProps = ['root', 'track', 'thumbWrapper', 'thumb', 'activeRail', 'input'];
 /**
  * Given user props, returns state and render function for a Switch.
  */
 
-export const useSwitch = (props, ref) => {
+export const useSwitch_unstable = (props, ref) => {
   const {
     track,
     thumbWrapper,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Switch/useSwitch.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AACA,SAAS,cAAT,QAA+B,kBAA/B;AAGA;;AAEG;;AACH,OAAO,MAAM,oBAAoB,GAA0B,CACzD,MADyD,EAEzD,OAFyD,EAGzD,cAHyD,EAIzD,OAJyD,EAKzD,YALyD,EAMzD,OANyD,CAApD;AASP;;AAEG;;AACH,OAAO,MAAM,SAAS,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAiE;AACxF,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA,YAAT;AAAuB,IAAA,KAAvB;AAA8B,IAAA,UAA9B;AAA0C,IAAA,KAA1C;AAAiD,IAAA,cAAjD;AAAiE,IAAA,OAAjE;AAA0E,IAAA,QAA1E;AAAoF,IAAA;AAApF,MAAiG,KAAvG;AACA,QAAM,KAAK,GAAgB;AACzB,IAAA,cADyB;AAEzB,IAAA,OAFyB;AAGzB,IAAA,QAHyB;AAIzB,IAAA,QAJyB;AAKzB,IAAA,IAAI,EAAE,qBAAqB,CAAC,MAAD,EAAS;AAClC,MAAA,GADkC;AAElC,SAAG,KAF+B;AAGlC,MAAA,EAAE,EAAE,KAAK,CAAC,SAAD,EAAY,KAAK,CAAC,EAAlB;AAHyB,KAAT,CALF;AAUzB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,KAAK,EAAE,KAFG;AAGV,MAAA,YAAY,EAAE,KAHJ;AAIV,MAAA,KAAK,EAAE,KAJG;AAKV,MAAA,UAAU,EAAE,KALF;AAMV,MAAA,KAAK,EAAE;AANG,KAVa;AAkBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAR,CAlBE;AAmBzB,IAAA,YAAY,EAAE,gBAAgB,CAAC,YAAD,EAAe;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAf,CAnBL;AAoBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAR,CApBE;AAqBzB,IAAA,UAAU,EAAE,gBAAgB,CAAC,UAAD,EAAa;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAb,CArBH;AAsBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAC7B,MAAA,QAAQ,EAAE,IADmB;AAE7B,MAAA,YAAY,EAAE;AACZ,QAAA,IAAI,EAAE;AADM;AAFe,KAAR;AAtBE,GAA3B;AA8BA,EAAA,cAAc,CAAC,KAAD,CAAd;AAEA,SAAO,KAAP;AACD,CAnCM","sourceRoot":""}
+{"version":3,"sources":["components/Switch/useSwitch.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AACA,SAAS,cAAT,QAA+B,kBAA/B;AAGA;;AAEG;;AACH,OAAO,MAAM,kBAAkB,GAAG,CAAC,KAAD,EAAqB,GAArB,KAAiE;AACjG,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA,YAAT;AAAuB,IAAA,KAAvB;AAA8B,IAAA,UAA9B;AAA0C,IAAA,KAA1C;AAAiD,IAAA,cAAjD;AAAiE,IAAA,OAAjE;AAA0E,IAAA,QAA1E;AAAoF,IAAA;AAApF,MAAiG,KAAvG;AACA,QAAM,KAAK,GAAgB;AACzB,IAAA,cADyB;AAEzB,IAAA,OAFyB;AAGzB,IAAA,QAHyB;AAIzB,IAAA,QAJyB;AAKzB,IAAA,IAAI,EAAE,qBAAqB,CAAC,MAAD,EAAS;AAClC,MAAA,GADkC;AAElC,SAAG,KAF+B;AAGlC,MAAA,EAAE,EAAE,KAAK,CAAC,SAAD,EAAY,KAAK,CAAC,EAAlB;AAHyB,KAAT,CALF;AAUzB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,KAAK,EAAE,KAFG;AAGV,MAAA,YAAY,EAAE,KAHJ;AAIV,MAAA,KAAK,EAAE,KAJG;AAKV,MAAA,UAAU,EAAE,KALF;AAMV,MAAA,KAAK,EAAE;AANG,KAVa;AAkBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAR,CAlBE;AAmBzB,IAAA,YAAY,EAAE,gBAAgB,CAAC,YAAD,EAAe;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAf,CAnBL;AAoBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAR,CApBE;AAqBzB,IAAA,UAAU,EAAE,gBAAgB,CAAC,UAAD,EAAa;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAb,CArBH;AAsBzB,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAC7B,MAAA,QAAQ,EAAE,IADmB;AAE7B,MAAA,YAAY,EAAE;AACZ,QAAA,IAAI,EAAE;AADM;AAFe,KAAR;AAtBE,GAA3B;AA8BA,EAAA,cAAc,CAAC,KAAD,CAAd;AAEA,SAAO,KAAP;AACD,CAnCM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useSwitchState } from './useSwitchState';\nimport type { SwitchProps, SwitchState } from './Switch.types';\n\n/**\n * Given user props, returns state and render function for a Switch.\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLElement>): SwitchState => {\n  const { track, thumbWrapper, thumb, activeRail, input, defaultChecked, checked, disabled, onChange } = props;\n  const state: SwitchState = {\n    defaultChecked,\n    checked,\n    disabled,\n    onChange,\n    root: getNativeElementProps('span', {\n      ref,\n      ...props,\n      id: useId('switch-', props.id),\n    }),\n    components: {\n      root: 'div',\n      track: 'div',\n      thumbWrapper: 'div',\n      thumb: 'div',\n      activeRail: 'div',\n      input: 'input',\n    },\n    track: resolveShorthand(track, { required: true }),\n    thumbWrapper: resolveShorthand(thumbWrapper, { required: true }),\n    thumb: resolveShorthand(thumb, { required: true }),\n    activeRail: resolveShorthand(activeRail, { required: true }),\n    input: resolveShorthand(input, {\n      required: true,\n      defaultProps: {\n        type: 'checkbox',\n      },\n    }),\n  };\n\n  useSwitchState(state);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib/components/Switch/useSwitchState.js

@@ -38,7 +38,7 @@ export const useSwitchState = state => {
     setTrue: showThumbAnimation,
     setFalse: hideThumbAnimation
   }] = useBoolean(true);
-  const [renderedPosition, setRenderedPosition] = React.useState(currentValue === true ? 100 : 0);
+  const [renderedPosition, setRenderedPosition] = React.useState(undefined);
   const setChecked = useEventCallback((ev, incomingValue) => {
     ev.stopPropagation();
     ev.preventDefault();

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Switch/useSwitchState.ts"],"names":[],"mappings":"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","sourceRoot":""}
+{"version":3,"sources":["components/Switch/useSwitchState.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { clamp, useBoolean, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { useFluent } from '@fluentui/react-shared-contexts';\nimport type { SwitchState } from './Switch.types';\n\ntype SwitchInternalState = {\n  /**\n   * The internal rendered value of the Switch.\n   */\n  internalValue: boolean;\n\n  /**\n   * Whether the thumb is currently being dragged.\n   */\n  thumbIsDragging: boolean;\n\n  /**\n   * Disposable events for the Switch.\n   */\n  disposables: (() => void)[];\n};\n\n// TODO: This should be replaced with a useEvent hook\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst on = (element: Element, eventName: string, callback: (ev: any) => void) => {\n  element.addEventListener(eventName, callback);\n  return () => element.removeEventListener(eventName, callback);\n};\n\nexport const useSwitchState = (state: SwitchState) => {\n  const { defaultChecked = false, checked, disabled = false, onChange } = state;\n  const { onPointerDown: onPointerDownCallback, onKeyUp: onKeyUpCallback } = state.root;\n\n  const { dir } = useFluent();\n  const inputRef = useMergedRefs(state.input.ref);\n  const railRef = React.useRef<HTMLDivElement>(null);\n  const internalState = React.useRef<SwitchInternalState>({\n    internalValue: checked ? checked : defaultChecked,\n    thumbIsDragging: false,\n    disposables: [],\n  });\n\n  const [currentValue, setCurrentValue] = useControllableState({\n    defaultState: defaultChecked,\n    state: checked,\n    initialState: false,\n  });\n  const [thumbAnimation, { setTrue: showThumbAnimation, setFalse: hideThumbAnimation }] = useBoolean(true);\n  const [renderedPosition, setRenderedPosition] = React.useState<number | undefined>(undefined);\n\n  const setChecked = useEventCallback(\n    (ev: React.PointerEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, incomingValue: boolean) => {\n      ev.stopPropagation();\n      ev.preventDefault();\n      internalState.current.internalValue = incomingValue;\n      onChange?.(ev, { checked: incomingValue });\n      setCurrentValue(incomingValue);\n      setRenderedPosition(undefined);\n    },\n  );\n\n  const calculatePosition = React.useCallback(\n    (ev: React.PointerEvent<HTMLDivElement>): number => {\n      const currentBounds = railRef?.current?.getBoundingClientRect();\n      const railWidth = currentBounds!.width;\n      const railPosition = dir === 'rtl' ? currentBounds!.right : currentBounds!.left;\n      const distance = dir === 'rtl' ? railPosition - ev.clientX : ev.clientX - railPosition;\n      return clamp((distance / railWidth) * 100, 0, 100);\n    },\n    [dir],\n  );\n\n  const onPointerMove = React.useCallback(\n    (ev: React.PointerEvent<HTMLDivElement>): void => {\n      const incomingPosition = calculatePosition(ev);\n\n      internalState.current.thumbIsDragging = true;\n      hideThumbAnimation();\n      setRenderedPosition(incomingPosition);\n\n      // If the Switch reaches a new position of 0% or 100%, update the state and fire change.\n      if (incomingPosition === 100 && internalState.current.internalValue !== true) {\n        setChecked(ev, true);\n      } else if (incomingPosition === 0 && internalState.current.internalValue !== false) {\n        setChecked(ev, false);\n      }\n    },\n    [calculatePosition, hideThumbAnimation, setChecked],\n  );\n\n  const onPointerUp = React.useCallback(\n    (ev: React.PointerEvent<HTMLDivElement>): void => {\n      internalState.current.disposables.forEach(dispose => dispose());\n      internalState.current.disposables = [];\n      inputRef.current!.focus();\n\n      if (internalState.current.thumbIsDragging) {\n        const roundedPosition = Math.round(calculatePosition(ev)! / 100) * 100;\n\n        showThumbAnimation();\n        if (roundedPosition === 100) {\n          setChecked(ev, true);\n        } else if (roundedPosition === 0) {\n          setChecked(ev, false);\n        }\n      } else {\n        setChecked(ev, !internalState.current.internalValue);\n      }\n    },\n    [calculatePosition, inputRef, setChecked, showThumbAnimation],\n  );\n\n  const onPointerDown = React.useCallback(\n    (ev: React.PointerEvent<HTMLDivElement>): void => {\n      const { pointerId } = ev;\n      const target = ev.target as HTMLElement;\n\n      onPointerDownCallback?.(ev);\n      showThumbAnimation();\n      target.setPointerCapture?.(pointerId);\n      internalState.current.thumbIsDragging = false;\n\n      internalState.current.disposables.push(\n        on(target, 'pointermove', onPointerMove),\n        on(target, 'pointerup', onPointerUp),\n        () => {\n          target.releasePointerCapture?.(pointerId);\n        },\n      );\n    },\n    [onPointerDownCallback, onPointerMove, onPointerUp, showThumbAnimation],\n  );\n\n  const onKeyUp = React.useCallback(\n    (ev: React.KeyboardEvent<HTMLDivElement>): void => {\n      onKeyUpCallback?.(ev);\n      if (ev.key === ' ') {\n        setChecked(ev, !internalState.current.internalValue);\n      }\n    },\n    [onKeyUpCallback, setChecked],\n  );\n\n  const currentPosition = renderedPosition !== undefined ? renderedPosition : currentValue ? 100 : 0;\n\n  const rootStyles = {\n    '--switch-checked-opacity': currentPosition / 100,\n    '--switch-unchecked-opacity': (100 - currentPosition) / 100,\n  } as React.CSSProperties;\n\n  const thumbWrapperStyles = {\n    transform: `translate(${dir === 'rtl' ? -currentPosition : currentPosition}%)`,\n    transition: thumbAnimation\n      ? 'transform .1s cubic-bezier(0.33, 0.0, 0.67, 1), opacity .1s cubic-bezier(0.33, 0.0, 0.67, 1)'\n      : 'none',\n  };\n\n  // Root Props\n  state.root.style = rootStyles;\n  if (!disabled) {\n    state.root.onPointerDown = onPointerDown;\n    state.root.onKeyUp = onKeyUp;\n  }\n\n  // Input Props\n  state.input.checked = currentValue;\n  state.input.disabled = disabled;\n  state.input.ref = inputRef;\n  state.input.readOnly = true;\n  state.input.role = 'switch';\n\n  // Thumb Container Props\n  state.thumbWrapper.style = thumbWrapperStyles;\n\n  // Active Rail Props\n  state.activeRail.ref = railRef;\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib/components/Switch/useSwitchStyles.d.ts

@@ -3,4 +3,4 @@ export declare const switchClassName = "fui-Switch";
 /**
  * Apply styling to the Switch slots based on the state
  */
-export declare const useSwitchStyles: (state: SwitchState) => SwitchState;
+export declare const useSwitchStyles_unstable: (state: SwitchState) => SwitchState;

package/lib/components/Switch/useSwitchStyles.js

@@ -1,5 +1,6 @@
-import { __styles, mergeClasses } from '@fluentui/react-make-styles';
+import { shorthands, __styles, mergeClasses } from '@griffel/react';
 import { createFocusOutlineStyle } from '@fluentui/react-tabster';
+import { tokens } from '@fluentui/react-theme';
 export const switchClassName = 'fui-Switch';
 const trackClassName = `${switchClassName}-track`;
 const thumbClassName = `${switchClassName}-thumb`;
@@ -23,15 +24,12 @@ const useRootStyles = /*#__PURE__*/__styles({
     "ha4doy": "f1qdqbpl"
   },
   "unchecked": {
-    "C1ct7f": "f1576je",
-    "B638aae": "fhwgkv7",
-    "Hdeks4": ["f1cjufhn", "f1395m7v"],
-    "sn1se1": "fyo9fdn",
-    "Bspkfwm": ["f1395m7v", "f1cjufhn"]
+    "d48c0s": "frinyyk",
+    "Bc6qnd8": "f1g8lwx2"
   },
   "checked": {
-    "B0mj7kb": "fj7b6zc",
-    "B64bwki": "fykva8d"
+    "Banj4pq": "fpfyfb6",
+    "Brktkwq": "f3vtzeg"
   },
   "enabled": {
     "H36rlo": "felqjlh",
@@ -43,37 +41,25 @@ const useRootStyles = /*#__PURE__*/__styles({
   },
   "focusIndicator": {
     "B486eqv": "f2hkw1w",
-    "vchsgm": "fbiesyy",
-    "ozrjjd": ["fq2kn9", "f1jxwnad"],
-    "B7lelfh": "f1il7mou",
-    "Bp3tz3o": ["f1jxwnad", "fq2kn9"],
+    "c2y4jd": "fsofd9k",
     "B8vm7ur": "f12sql3b",
     "f4hv8x": "f1i4q40k",
     "Gpan81": "fcrbge9",
     "z7afg": "ft464mn",
     "rsjj6t": "fskqmiq",
-    "E86f5s": "f1kbdjx9",
-    "f5nhos": ["fw1d893", "fpuz8dn"],
-    "Bhtq6h7": "f14hlsw1",
-    "Bubk9yy": ["fpuz8dn", "fw1d893"],
-    "dzajus": "f1bkt4b4",
-    "B8gmrwi": ["f16hf5f2", "f1qhqcal"],
-    "Byq6oy9": "fyyqeim",
-    "Bdy2j38": ["f1qhqcal", "f16hf5f2"],
+    "Bqsd8kq": "f2gy8jn",
+    "sfhsbh": "f1pke3uf",
     "Bugh3ej": "f18xdlq9",
-    "epcuuz": "filx0we",
-    "Ba33l6n": ["f1horip2", "fgnx9ah"],
-    "va7z1g": "fkii2tb",
-    "Bmi6mq9": ["fgnx9ah", "f1horip2"],
+    "hpanx6": "f1114nks",
     "Bjkpy09": "f1rh66yx",
     "Jxg1p8": "f19ibq92",
     "Bc94xmo": ["fc3tncn", "f1veb610"],
     "Bj23z95": ["f1veb610", "fc3tncn"]
   }
 }, {
-  "d": [".frxo1y7{--switch-width:40px;}", ".fe5s2ct{--switch-height:20px;}", ".f1n6k660{--switch-thumb-size:14px;}", ".f17m95gg{--switch-checked-opacity:0;}", ".fp7zjh8{--switch-unchecked-opacity:0;}", ".f10pi13n{position:relative;}", ".fnceurk{width:var(--switch-width);}", ".f15da5dy{height:var(--switch-height);}", ".f14t3ns0{display:inline-block;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f1sdsnyy{touch-action:none;}", ".f1qdqbpl{vertical-align:bottom;}", ".felqjlh{-webkit-tap-highlight-color:rgba(0,0,0,0);}", ".f1k6fduh{cursor:pointer;}", ".fdrzuqr{cursor:not-allowed;}", ".f1aehjj5{pointer-events:none;}", "[data-keyboard-nav] .fbiesyy:focus-within{border-top-color:transparent;}", "[data-keyboard-nav] .fq2kn9:focus-within{border-right-color:transparent;}", "[data-keyboard-nav] .f1jxwnad:focus-within{border-left-color:transparent;}", "[data-keyboard-nav] .f1il7mou:focus-within{border-bottom-color:transparent;}", "[data-keyboard-nav] .f12sql3b:focus-within:after{content:\"\";}", "[data-keyboard-nav] .f1i4q40k:focus-within:after{position:absolute;}", "[data-keyboard-nav] .fcrbge9:focus-within:after{pointer-events:none;}", "[data-keyboard-nav] .ft464mn:focus-within:after{box-sizing:outline-box;}", "[data-keyboard-nav] .fskqmiq:focus-within:after{z-index:1;}", "[data-keyboard-nav] .f1kbdjx9:focus-within:after{border-top-style:solid;}", "[data-keyboard-nav] .fw1d893:focus-within:after{border-right-style:solid;}", "[data-keyboard-nav] .fpuz8dn:focus-within:after{border-left-style:solid;}", "[data-keyboard-nav] .f14hlsw1:focus-within:after{border-bottom-style:solid;}", "[data-keyboard-nav] .f1bkt4b4:focus-within:after{border-top-width:2px;}", "[data-keyboard-nav] .f16hf5f2:focus-within:after{border-right-width:2px;}", "[data-keyboard-nav] .f1qhqcal:focus-within:after{border-left-width:2px;}", "[data-keyboard-nav] .fyyqeim:focus-within:after{border-bottom-width:2px;}", "[data-keyboard-nav] .f18xdlq9:focus-within:after{border-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .filx0we:focus-within:after{border-top-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1horip2:focus-within:after{border-right-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .fgnx9ah:focus-within:after{border-left-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .fkii2tb:focus-within:after{border-bottom-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1rh66yx:focus-within:after{top:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .f19ibq92:focus-within:after{bottom:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .fc3tncn:focus-within:after{left:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .f1veb610:focus-within:after{right:calc(0px - 2px - 8px);}"],
-  "h": [".f1576je:hover .fui-Switch-thumb:before{background:var(--colorNeutralStrokeAccessibleHover);}", ".fhwgkv7:hover .fui-Switch-track:before{border-top-color:var(--colorNeutralStrokeAccessibleHover);}", ".f1cjufhn:hover .fui-Switch-track:before{border-right-color:var(--colorNeutralStrokeAccessibleHover);}", ".f1395m7v:hover .fui-Switch-track:before{border-left-color:var(--colorNeutralStrokeAccessibleHover);}", ".fyo9fdn:hover .fui-Switch-track:before{border-bottom-color:var(--colorNeutralStrokeAccessibleHover);}", ".fj7b6zc:hover .fui-Switch-track:after{background:var(--colorBrandBackgroundHover);}"],
-  "a": [".fykva8d:active .fui-Switch-track:after{background:var(--colorBrandBackgroundPressed);}"],
+  "d": [".frxo1y7{--switch-width:40px;}", ".fe5s2ct{--switch-height:20px;}", ".f1n6k660{--switch-thumb-size:14px;}", ".f17m95gg{--switch-checked-opacity:0;}", ".fp7zjh8{--switch-unchecked-opacity:0;}", ".f10pi13n{position:relative;}", ".fnceurk{width:var(--switch-width);}", ".f15da5dy{height:var(--switch-height);}", ".f14t3ns0{display:inline-block;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".f1sdsnyy{touch-action:none;}", ".f1qdqbpl{vertical-align:bottom;}", ".felqjlh{-webkit-tap-highlight-color:rgba(0,0,0,0);}", ".f1k6fduh{cursor:pointer;}", ".fdrzuqr{cursor:not-allowed;}", ".f1aehjj5{pointer-events:none;}", "[data-keyboard-nav] .fsofd9k:focus-within{border-color:transparent;}", "[data-keyboard-nav] .f12sql3b:focus-within:after{content:\"\";}", "[data-keyboard-nav] .f1i4q40k:focus-within:after{position:absolute;}", "[data-keyboard-nav] .fcrbge9:focus-within:after{pointer-events:none;}", "[data-keyboard-nav] .ft464mn:focus-within:after{box-sizing:outline-box;}", "[data-keyboard-nav] .fskqmiq:focus-within:after{z-index:1;}", "[data-keyboard-nav] .f2gy8jn:focus-within:after{border-style:solid;}", "[data-keyboard-nav] .f1pke3uf:focus-within:after{border-width:2px;}", "[data-keyboard-nav] .f18xdlq9:focus-within:after{border-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f1114nks:focus-within:after{border-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1rh66yx:focus-within:after{top:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .f19ibq92:focus-within:after{bottom:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .fc3tncn:focus-within:after{left:calc(0px - 2px - 8px);}", "[data-keyboard-nav] .f1veb610:focus-within:after{right:calc(0px - 2px - 8px);}"],
+  "h": [".frinyyk:hover .fui-Switch-thumb:before{background-color:var(--colorNeutralStrokeAccessibleHover);}", ".f1g8lwx2:hover .fui-Switch-track:before{border-color:var(--colorNeutralStrokeAccessibleHover);}", ".fpfyfb6:hover .fui-Switch-track:after{background-color:var(--colorBrandBackgroundHover);}"],
+  "a": [".f3vtzeg:active .fui-Switch-track:after{background-color:var(--colorBrandBackgroundPressed);}"],
   "i": [".f2hkw1w:focus-visible{outline-style:none;}"]
 });
 /**
@@ -86,7 +72,9 @@ const useTrackStyles = /*#__PURE__*/__styles({
     "qhf8xq": "f1euv43f",
     "a9b677": "fly5x3f",
     "Bqenvij": "f1l02sjl",
-    "Bi2q7bf": "f11zxivh",
+    "Bmy1vo4": "fmslzlq",
+    "B3o57yi": "f15vu5tu",
+    "Bkqvd7p": "f1e1a42z",
     "lpbzjs": "f1sdsnyy",
     "Bkecrkj": "f1aehjj5",
     "xx9plb": "fxf9f1y",
@@ -95,7 +83,10 @@ const useTrackStyles = /*#__PURE__*/__styles({
     "Bj2wrql": "f3zr33r",
     "qd6xl9": ["ff0gctb", "f8g0ba1"],
     "Bmqnesq": "f170vdtw",
-    "zf3lio": "f1jua1m0",
+    "px8gyy": ["f7lyffi", "fmk9c8u"],
+    "B5c9fhp": ["fmk9c8u", "f7lyffi"],
+    "Bhe99jt": ["f1nat4im", "fw5qzmy"],
+    "B2r1szc": ["fw5qzmy", "f1nat4im"],
     "rurcny": "f99sooz",
     "ngabwx": "f1uhpfti",
     "Hdbjpj": "f11ef69",
@@ -104,7 +95,10 @@ const useTrackStyles = /*#__PURE__*/__styles({
     "Bj55yzk": "f13gddrr",
     "cnmfks": ["f1oarbwq", "f1bp8q63"],
     "oqd9ik": "ffdc0f3",
-    "c4kunb": "fsn1tsw",
+    "frdscb": ["f1xuwyw0", "f12j4hro"],
+    "B9nohqn": ["f12j4hro", "f1xuwyw0"],
+    "B1dhsta": ["f1mf29j", "f1nzm45q"],
+    "Bjdmjzx": ["f1nzm45q", "f1mf29j"],
     "Bs6t6z0": "f77y9vx",
     "Bmyypfa": "frd86tk"
   },
@@ -121,10 +115,10 @@ const useTrackStyles = /*#__PURE__*/__styles({
     "I89eb": ["f149mt9j", "fs3bzhx"],
     "Bp1vogq": "f14z72z2",
     "Bohd3ja": ["fs3bzhx", "f149mt9j"],
-    "B4zgs9e": "f1ntlsrl"
+    "B1dvbpk": "f1k1dzc6"
   },
   "checked": {
-    "Bpudnjh": "f1lhwn2z",
+    "Bkbwdz4": "f8mks4l",
     "rskduk": "f1so6udy",
     "Dctjco": ["f1faxgr0", "f1wf3et7"],
     "J4s2b0": "f124kgxn",
@@ -157,10 +151,10 @@ const useTrackStyles = /*#__PURE__*/__styles({
     "B13j16c": ["f11zx3qq", "fqewq1t"],
     "Bk8j60v": "fmewjpk",
     "Bpbi4o9": ["fqewq1t", "f11zx3qq"],
-    "Bpudnjh": "fq2pbzm"
+    "Bkbwdz4": "f132yvl5"
   }
 }, {
-  "d": [".f1euv43f{position:absolute;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f11zxivh{-webkit-transition:background .1s cubic-bezier(0.33, 0.0, 0.67, 1);transition:background .1s cubic-bezier(0.33, 0.0, 0.67, 1);}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}", ".fxf9f1y:before{position:absolute;}", ".frdto5n:before{top:0px;}", ".f8g0ba1:before{left:0px;}", ".ff0gctb:before{right:0px;}", ".f3zr33r:before{bottom:0px;}", ".f170vdtw:before{box-sizing:border-box;}", ".f1jua1m0:before{border-radius:999px;}", ".f99sooz:before{content:'';}", ".f1uhpfti:before{opacity:var(--switch-unchecked-opacity);}", ".f11ef69:after{position:absolute;}", ".f1yuyem3:after{top:0px;}", ".f1bp8q63:after{left:0px;}", ".f1oarbwq:after{right:0px;}", ".f13gddrr:after{bottom:0px;}", ".ffdc0f3:after{box-sizing:border-box;}", ".fsn1tsw:after{border-radius:999px;}", ".f77y9vx:after{content:'';}", ".frd86tk:after{opacity:var(--switch-checked-opacity);}", ".f199l62q:before{border-top-width:1px;}", ".f1pa2qi2:before{border-right-width:1px;}", ".f1ooiv2t:before{border-left-width:1px;}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".f1gqzwee:before{border-top-color:var(--colorNeutralStrokeAccessible);}", ".f149mt9j:before{border-right-color:var(--colorNeutralStrokeAccessible);}", ".fs3bzhx:before{border-left-color:var(--colorNeutralStrokeAccessible);}", ".f14z72z2:before{border-bottom-color:var(--colorNeutralStrokeAccessible);}", ".f1ntlsrl:before{background:none;}", ".f1lhwn2z:after{background:var(--colorBrandBackground);}", ".f1so6udy:after{border-top-style:none;}", ".f1faxgr0:after{border-right-style:none;}", ".f1wf3et7:after{border-left-style:none;}", ".f124kgxn:after{border-bottom-style:none;}", ".fntj282:before{border-top-color:var(--colorNeutralStrokeDisabled);}", ".fzta9nb:before{border-right-color:var(--colorNeutralStrokeDisabled);}", ".f17m9iy5:before{border-left-color:var(--colorNeutralStrokeDisabled);}", ".f1k4exvn:before{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".f1l5cenb:after{border-top-width:1px;}", ".f1jvubu3:after{border-right-width:1px;}", ".f1q1uvzd:after{border-left-width:1px;}", ".f2fxry3:after{border-bottom-width:1px;}", ".f1iq3fds:after{border-top-style:solid;}", ".f1r2jemi:after{border-right-style:solid;}", ".f11olovk:after{border-left-style:solid;}", ".fd0py6g:after{border-bottom-style:solid;}", ".f2uxs13:after{border-top-color:var(--colorTransparentStrokeDisabled);}", ".f11zx3qq:after{border-right-color:var(--colorTransparentStrokeDisabled);}", ".fqewq1t:after{border-left-color:var(--colorTransparentStrokeDisabled);}", ".fmewjpk:after{border-bottom-color:var(--colorTransparentStrokeDisabled);}", ".fq2pbzm:after{background:var(--colorNeutralBackgroundDisabled);}"]
+  "d": [".f1euv43f{position:absolute;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".fmslzlq{transition-property:backgroundColor;}", ".f15vu5tu{transition-duration:0.1s;}", ".f1e1a42z{transition-timing-function:cubic-bezier(0.33, 0, 0.67, 1);}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}", ".fxf9f1y:before{position:absolute;}", ".frdto5n:before{top:0px;}", ".f8g0ba1:before{left:0px;}", ".ff0gctb:before{right:0px;}", ".f3zr33r:before{bottom:0px;}", ".f170vdtw:before{box-sizing:border-box;}", ".f7lyffi:before{border-bottom-right-radius:999px;}", ".fmk9c8u:before{border-bottom-left-radius:999px;}", ".f1nat4im:before{border-top-right-radius:999px;}", ".fw5qzmy:before{border-top-left-radius:999px;}", ".f99sooz:before{content:'';}", ".f1uhpfti:before{opacity:var(--switch-unchecked-opacity);}", ".f11ef69:after{position:absolute;}", ".f1yuyem3:after{top:0px;}", ".f1bp8q63:after{left:0px;}", ".f1oarbwq:after{right:0px;}", ".f13gddrr:after{bottom:0px;}", ".ffdc0f3:after{box-sizing:border-box;}", ".f1xuwyw0:after{border-bottom-right-radius:999px;}", ".f12j4hro:after{border-bottom-left-radius:999px;}", ".f1mf29j:after{border-top-right-radius:999px;}", ".f1nzm45q:after{border-top-left-radius:999px;}", ".f77y9vx:after{content:'';}", ".frd86tk:after{opacity:var(--switch-checked-opacity);}", ".f199l62q:before{border-top-width:1px;}", ".f1pa2qi2:before{border-right-width:1px;}", ".f1ooiv2t:before{border-left-width:1px;}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".f1gqzwee:before{border-top-color:var(--colorNeutralStrokeAccessible);}", ".f149mt9j:before{border-right-color:var(--colorNeutralStrokeAccessible);}", ".fs3bzhx:before{border-left-color:var(--colorNeutralStrokeAccessible);}", ".f14z72z2:before{border-bottom-color:var(--colorNeutralStrokeAccessible);}", ".f1k1dzc6:before{background-color:transparent;}", ".f8mks4l:after{background-color:var(--colorBrandBackground);}", ".f1so6udy:after{border-top-style:none;}", ".f1faxgr0:after{border-right-style:none;}", ".f1wf3et7:after{border-left-style:none;}", ".f124kgxn:after{border-bottom-style:none;}", ".fntj282:before{border-top-color:var(--colorNeutralStrokeDisabled);}", ".fzta9nb:before{border-right-color:var(--colorNeutralStrokeDisabled);}", ".f17m9iy5:before{border-left-color:var(--colorNeutralStrokeDisabled);}", ".f1k4exvn:before{border-bottom-color:var(--colorNeutralStrokeDisabled);}", ".f1l5cenb:after{border-top-width:1px;}", ".f1jvubu3:after{border-right-width:1px;}", ".f1q1uvzd:after{border-left-width:1px;}", ".f2fxry3:after{border-bottom-width:1px;}", ".f1iq3fds:after{border-top-style:solid;}", ".f1r2jemi:after{border-right-style:solid;}", ".f11olovk:after{border-left-style:solid;}", ".fd0py6g:after{border-bottom-style:solid;}", ".f2uxs13:after{border-top-color:var(--colorTransparentStrokeDisabled);}", ".f11zx3qq:after{border-right-color:var(--colorTransparentStrokeDisabled);}", ".fqewq1t:after{border-left-color:var(--colorTransparentStrokeDisabled);}", ".fmewjpk:after{border-bottom-color:var(--colorTransparentStrokeDisabled);}", ".f132yvl5:after{background-color:var(--colorNeutralBackgroundDisabled);}"]
 });
 /**
  * Styles for the thumb wrapper slot
@@ -191,10 +185,15 @@ const useThumbStyles = /*#__PURE__*/__styles({
     "a9b677": "fcjrtee",
     "Bqenvij": "fili5n9",
     "B7ck84d": "f1ewtqcl",
-    "Dimara": "f44lkw9",
+    "Bbmb7ep": ["f8fbkgy", "f1nfllo7"],
+    "Beyfa6y": ["f1nfllo7", "f8fbkgy"],
+    "B7oj6ja": ["f1djnp8u", "f1s8kh49"],
+    "Btl43ni": ["f1s8kh49", "f1djnp8u"],
     "Bhzewxz": "f1i1t8d1",
     "Bz10aip": ["foouk8k", "fd9rb4b"],
-    "Bi2q7bf": "f11zxivh",
+    "Bmy1vo4": "fmslzlq",
+    "B3o57yi": "f15vu5tu",
+    "Bkqvd7p": "f1e1a42z",
     "lpbzjs": "f1sdsnyy",
     "Bkecrkj": "f1aehjj5",
     "xx9plb": "fxf9f1y",
@@ -202,7 +201,10 @@ const useThumbStyles = /*#__PURE__*/__styles({
     "Byque4d": ["f8g0ba1", "ff0gctb"],
     "Bj2wrql": "f3zr33r",
     "qd6xl9": ["ff0gctb", "f8g0ba1"],
-    "zf3lio": "fmrqcwg",
+    "px8gyy": ["fu724ry", "f1ufhb3r"],
+    "B5c9fhp": ["f1ufhb3r", "fu724ry"],
+    "Bhe99jt": ["fiow2ne", "f13lz1i8"],
+    "B2r1szc": ["f13lz1i8", "fiow2ne"],
     "rurcny": "f99sooz",
     "ngabwx": "f1uhpfti",
     "Hdbjpj": "f11ef69",
@@ -210,15 +212,18 @@ const useThumbStyles = /*#__PURE__*/__styles({
     "jc51t6": ["f1bp8q63", "f1oarbwq"],
     "Bj55yzk": "f13gddrr",
     "cnmfks": ["f1oarbwq", "f1bp8q63"],
-    "c4kunb": "f1y5o2fm",
+    "frdscb": ["fc4gh2t", "flndy84"],
+    "B9nohqn": ["flndy84", "fc4gh2t"],
+    "B1dhsta": ["fxgx2h0", "fh20ihy"],
+    "Bjdmjzx": ["fh20ihy", "fxgx2h0"],
     "Bs6t6z0": "f77y9vx",
     "Bmyypfa": "frd86tk"
   },
   "unchecked": {
-    "B4zgs9e": "f1imqj0g"
+    "B1dvbpk": "f1n7m28n"
   },
   "checked": {
-    "Bpudnjh": "fe3g45j"
+    "Bkbwdz4": "f1261hx1"
   },
   "disabledUnchecked": {
     "dj0dih": "f199l62q",
@@ -233,13 +238,13 @@ const useThumbStyles = /*#__PURE__*/__styles({
     "I89eb": ["f1yueqd5", "f16ep8jm"],
     "Bp1vogq": "flh92r5",
     "Bohd3ja": ["f16ep8jm", "f1yueqd5"],
-    "B4zgs9e": "fer8lxq"
+    "B1dvbpk": "fj528n6"
   },
   "disabledChecked": {
-    "Bpudnjh": "fz051tx"
+    "Bkbwdz4": "f18jltdj"
   }
 }, {
-  "d": [".f1euv43f{position:absolute;}", ".fcjrtee{width:var(--switch-thumb-size);}", ".fili5n9{height:var(--switch-thumb-size);}", ".f1ewtqcl{box-sizing:border-box;}", ".f44lkw9{border-radius:var(--borderRadiusCircular);}", ".f1i1t8d1{top:50%;}", ".foouk8k{-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}", ".fd9rb4b{-webkit-transform:translate(50%, -50%);-moz-transform:translate(50%, -50%);-ms-transform:translate(50%, -50%);transform:translate(50%, -50%);}", ".f11zxivh{-webkit-transition:background .1s cubic-bezier(0.33, 0.0, 0.67, 1);transition:background .1s cubic-bezier(0.33, 0.0, 0.67, 1);}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}", ".fxf9f1y:before{position:absolute;}", ".frdto5n:before{top:0px;}", ".f8g0ba1:before{left:0px;}", ".ff0gctb:before{right:0px;}", ".f3zr33r:before{bottom:0px;}", ".fmrqcwg:before{border-radius:var(--borderRadiusCircular);}", ".f99sooz:before{content:'';}", ".f1uhpfti:before{opacity:var(--switch-unchecked-opacity);}", ".f11ef69:after{position:absolute;}", ".f1yuyem3:after{top:0px;}", ".f1bp8q63:after{left:0px;}", ".f1oarbwq:after{right:0px;}", ".f13gddrr:after{bottom:0px;}", ".f1y5o2fm:after{border-radius:var(--borderRadiusCircular);}", ".f77y9vx:after{content:'';}", ".frd86tk:after{opacity:var(--switch-checked-opacity);}", ".f1imqj0g:before{background:var(--colorNeutralStrokeAccessible);}", ".fe3g45j:after{background:var(--colorNeutralForegroundOnBrand);}", ".f199l62q:before{border-top-width:1px;}", ".f1pa2qi2:before{border-right-width:1px;}", ".f1ooiv2t:before{border-left-width:1px;}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".f1k21dld:before{border-top-color:var(--colorNeutralForegroundDisabled);}", ".f1yueqd5:before{border-right-color:var(--colorNeutralForegroundDisabled);}", ".f16ep8jm:before{border-left-color:var(--colorNeutralForegroundDisabled);}", ".flh92r5:before{border-bottom-color:var(--colorNeutralForegroundDisabled);}", ".fer8lxq:before{background:var(--colorNeutralBackground1);}", ".fz051tx:after{background:var(--colorNeutralForegroundDisabled);}"]
+  "d": [".f1euv43f{position:absolute;}", ".fcjrtee{width:var(--switch-thumb-size);}", ".fili5n9{height:var(--switch-thumb-size);}", ".f1ewtqcl{box-sizing:border-box;}", ".f8fbkgy{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1nfllo7{border-bottom-left-radius:var(--borderRadiusCircular);}", ".f1djnp8u{border-top-right-radius:var(--borderRadiusCircular);}", ".f1s8kh49{border-top-left-radius:var(--borderRadiusCircular);}", ".f1i1t8d1{top:50%;}", ".foouk8k{-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}", ".fd9rb4b{-webkit-transform:translate(50%, -50%);-moz-transform:translate(50%, -50%);-ms-transform:translate(50%, -50%);transform:translate(50%, -50%);}", ".fmslzlq{transition-property:backgroundColor;}", ".f15vu5tu{transition-duration:0.1s;}", ".f1e1a42z{transition-timing-function:cubic-bezier(0.33, 0, 0.67, 1);}", ".f1sdsnyy{touch-action:none;}", ".f1aehjj5{pointer-events:none;}", ".fxf9f1y:before{position:absolute;}", ".frdto5n:before{top:0px;}", ".f8g0ba1:before{left:0px;}", ".ff0gctb:before{right:0px;}", ".f3zr33r:before{bottom:0px;}", ".fu724ry:before{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1ufhb3r:before{border-bottom-left-radius:var(--borderRadiusCircular);}", ".fiow2ne:before{border-top-right-radius:var(--borderRadiusCircular);}", ".f13lz1i8:before{border-top-left-radius:var(--borderRadiusCircular);}", ".f99sooz:before{content:'';}", ".f1uhpfti:before{opacity:var(--switch-unchecked-opacity);}", ".f11ef69:after{position:absolute;}", ".f1yuyem3:after{top:0px;}", ".f1bp8q63:after{left:0px;}", ".f1oarbwq:after{right:0px;}", ".f13gddrr:after{bottom:0px;}", ".fc4gh2t:after{border-bottom-right-radius:var(--borderRadiusCircular);}", ".flndy84:after{border-bottom-left-radius:var(--borderRadiusCircular);}", ".fxgx2h0:after{border-top-right-radius:var(--borderRadiusCircular);}", ".fh20ihy:after{border-top-left-radius:var(--borderRadiusCircular);}", ".f77y9vx:after{content:'';}", ".frd86tk:after{opacity:var(--switch-checked-opacity);}", ".f1n7m28n:before{background-color:var(--colorNeutralStrokeAccessible);}", ".f1261hx1:after{background-color:var(--colorNeutralForegroundOnBrand);}", ".f199l62q:before{border-top-width:1px;}", ".f1pa2qi2:before{border-right-width:1px;}", ".f1ooiv2t:before{border-left-width:1px;}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1bwkb58:before{border-top-style:solid;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".f1k21dld:before{border-top-color:var(--colorNeutralForegroundDisabled);}", ".f1yueqd5:before{border-right-color:var(--colorNeutralForegroundDisabled);}", ".f16ep8jm:before{border-left-color:var(--colorNeutralForegroundDisabled);}", ".flh92r5:before{border-bottom-color:var(--colorNeutralForegroundDisabled);}", ".fj528n6:before{background-color:var(--colorNeutralBackground1);}", ".f18jltdj:after{background-color:var(--colorNeutralForegroundDisabled);}"]
 });
 /**
  * Styles for the activeRail slot
@@ -285,7 +290,7 @@ const useInputStyle = /*#__PURE__*/__styles({
  */
 
 
-export const useSwitchStyles = state => {
+export const useSwitchStyles_unstable = state => {
   const {
     checked,
     disabled

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

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

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":"AACA,cAAc,UAAU,CAAC","sourcesContent":["export {};\nexport * from './Switch';\n"]}

package/lib-commonjs/Switch.js.map

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

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

@@ -18,9 +18,9 @@ const useSwitchStyles_1 = /*#__PURE__*/require("./useSwitchStyles");
 
 
 exports.Switch = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useSwitch_1.useSwitch(props, ref);
-  useSwitchStyles_1.useSwitchStyles(state);
-  return renderSwitch_1.renderSwitch(state);
+  const 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-commonjs/components/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,MAAA,gBAA2C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,WAAA,CAAA,SAAA,CAAU,KAAV,EAAiB,GAAjB,CAAd;AAEA,EAAA,iBAAA,CAAA,eAAA,CAAgB,KAAhB;AAEA,SAAO,cAAA,CAAA,YAAA,CAAa,KAAb,CAAP;AACD,CANuD,CAA3C;AAQb,OAAA,CAAA,MAAA,CAAO,WAAP,GAAqB,QAArB","sourceRoot":""}
+{"version":3,"sources":["components/Switch/Switch.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,MAAA,gBAA2C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,WAAA,CAAA,kBAAA,CAAmB,KAAnB,EAA0B,GAA1B,CAAd;AAEA,EAAA,iBAAA,CAAA,wBAAA,CAAyB,KAAzB;AAEA,SAAO,cAAA,CAAA,qBAAA,CAAsB,KAAtB,CAAP;AACD,CANuD,CAA3C;AAQb,OAAA,CAAA,MAAA,CAAO,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 * The Switch control enables users to trigger an option on or off through pressing on 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-commonjs/components/Switch/Switch.types.d.ts

@@ -1,32 +1,32 @@
 import * as React from 'react';
-import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
+import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
 export declare type SwitchSlots = {
     /**
      * The root of the Switch.
      */
-    root: IntrinsicShorthandProps<'div'>;
+    root: Slot<'div'>;
     /**
      * The bar indicating the status of the Switch.
      */
-    track: IntrinsicShorthandProps<'div'>;
+    track: NonNullable<Slot<'div'>>;
     /**
      * The wrapper around the thumb. It is used as the active area for the thumb to position itself.
      */
-    thumbWrapper: IntrinsicShorthandProps<'div'>;
+    thumbWrapper: NonNullable<Slot<'div'>>;
     /**
      * The circular icon indicating the status of the Switch.
      */
-    thumb: IntrinsicShorthandProps<'div'>;
+    thumb: NonNullable<Slot<'div'>>;
     /**
      * The hidden input that handles the Switch's internal functionality.
      */
-    input: IntrinsicShorthandProps<'input'>;
+    input: NonNullable<Slot<'input'>>;
     /**
      * The area in which the Switch's rail allows for the thumb to be dragged.
      */
-    activeRail: IntrinsicShorthandProps<'div'>;
+    activeRail: NonNullable<Slot<'div'>>;
 };
-export interface SwitchCommons {
+interface SwitchCommons {
     /**
      * The starting value for a uncontrolled Switch. If `true` then the Switch will be enabled.
      * Mutually exclusive with `checked` prop.
@@ -52,7 +52,8 @@ export interface SwitchCommons {
         checked: boolean;
     }) => void;
 }
-export interface SwitchProps extends Omit<ComponentProps<SwitchSlots>, 'onChange'>, SwitchCommons {
+export interface SwitchProps extends Omit<ComponentProps<Partial<SwitchSlots>>, 'onChange'>, SwitchCommons {
 }
 export interface SwitchState extends ComponentState<SwitchSlots>, SwitchCommons {
 }
+export {};

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
+{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}

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

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

package/lib-commonjs/components/Switch/renderSwitch.d.ts

@@ -2,4 +2,4 @@ import type { SwitchState } from './Switch.types';
 /**
  * Render the final JSX of Switch
  */
-export declare const renderSwitch: (state: SwitchState) => JSX.Element;
+export declare const renderSwitch_unstable: (state: SwitchState) => JSX.Element;

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

@@ -3,25 +3,29 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.renderSwitch = void 0;
+exports.renderSwitch_unstable = void 0;
 
 const React = /*#__PURE__*/require("react");
 
 const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
-
-const useSwitch_1 = /*#__PURE__*/require("./useSwitch");
 /**
  * Render the final JSX of Switch
  */
 
 
-const renderSwitch = state => {
+const renderSwitch_unstable = state => {
   const {
     slots,
     slotProps
-  } = react_utilities_1.getSlots(state, useSwitch_1.switchShorthandProps);
-  return React.createElement(slots.root, Object.assign({}, slotProps.root), React.createElement(slots.track, Object.assign({}, slotProps.track)), React.createElement(slots.thumbWrapper, Object.assign({}, slotProps.thumbWrapper), React.createElement(slots.thumb, Object.assign({}, slotProps.thumb))), React.createElement(slots.input, Object.assign({}, slotProps.input)), React.createElement(slots.activeRail, Object.assign({}, slotProps.activeRail)));
+  } = react_utilities_1.getSlots(state);
+  return React.createElement(slots.root, { ...slotProps.root
+  }, React.createElement(slots.track, { ...slotProps.track
+  }), React.createElement(slots.thumbWrapper, { ...slotProps.thumbWrapper
+  }, React.createElement(slots.thumb, { ...slotProps.thumb
+  })), React.createElement(slots.input, { ...slotProps.input
+  }), React.createElement(slots.activeRail, { ...slotProps.activeRail
+  }));
 };
 
-exports.renderSwitch = renderSwitch;
+exports.renderSwitch_unstable = renderSwitch_unstable;
 //# sourceMappingURL=renderSwitch.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Switch/renderSwitch.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,YAAY,GAAI,KAAD,IAAuB;AACjD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAsB,KAAtB,EAA6B,WAAA,CAAA,oBAA7B,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,KAAf,CAAZ,CADF,EAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,YAAP,EAAmB,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,YAAf,CAAnB,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,KAAf,CAAZ,CADF,CAFF,EAKE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,KAAf,CAAZ,CALF,EAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,UAAf,CAAjB,CANF,CADF;AAUD,CAbM;;AAAM,OAAA,CAAA,YAAA,GAAY,YAAZ","sourceRoot":""}
+{"version":3,"sources":["components/Switch/renderSwitch.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,qBAAqB,GAAI,KAAD,IAAuB;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAsB,KAAtB,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,EAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,YAAP,EAAmB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAnB,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,CAFF,EAKE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CALF,EAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CANF,CADF;AAUD,CAbM;;AAAM,OAAA,CAAA,qBAAA,GAAqB,qBAArB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SwitchState, SwitchSlots } from './Switch.types';\n\n/**\n * Render the final JSX of Switch\n */\nexport const renderSwitch_unstable = (state: SwitchState) => {\n  const { slots, slotProps } = getSlots<SwitchSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.track {...slotProps.track} />\n      <slots.thumbWrapper {...slotProps.thumbWrapper}>\n        <slots.thumb {...slotProps.thumb} />\n      </slots.thumbWrapper>\n      <slots.input {...slotProps.input} />\n      <slots.activeRail {...slotProps.activeRail} />\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}