@fluentui/react-switch 9.7.1 → 9.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,12 +1,26 @@
1
1
  # Change Log - @fluentui/react-switch
2
2
 
3
- This log was last generated on Wed, 01 Apr 2026 15:50:23 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 23 Apr 2026 11:59:33 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.7.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.7.2)
8
+
9
+ Thu, 23 Apr 2026 11:59:33 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.7.1..@fluentui/react-switch_v9.7.2)
11
+
12
+ ### Patches
13
+
14
+ - fix: update Switch component to conditionally render CircleFilled in indicator ([PR #35972](https://github.com/microsoft/fluentui/pull/35972) by dmytrokirpa@microsoft.com)
15
+ - Bump @fluentui/react-field to v9.5.1 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
16
+ - Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
17
+ - Bump @fluentui/react-label to v9.4.1 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
18
+ - Bump @fluentui/react-tabster to v9.26.14 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
19
+ - Bump @fluentui/react-utilities to v9.26.3 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
20
+
7
21
  ## [9.7.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-switch_v9.7.1)
8
22
 
9
- Wed, 01 Apr 2026 15:50:23 GMT
23
+ Wed, 01 Apr 2026 15:52:43 GMT
10
24
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-switch_v9.7.0..@fluentui/react-switch_v9.7.1)
11
25
 
12
26
  ### Patches
package/dist/index.d.ts CHANGED
@@ -2,7 +2,7 @@ import type { ComponentProps } from '@fluentui/react-utilities';
2
2
  import type { ComponentState } from '@fluentui/react-utilities';
3
3
  import type { ForwardRefComponent } from '@fluentui/react-utilities';
4
4
  import type { JSXElement } from '@fluentui/react-utilities';
5
- import { Label } from '@fluentui/react-label';
5
+ import type { Label } from '@fluentui/react-label';
6
6
  import * as React_2 from 'react';
7
7
  import type { Slot } from '@fluentui/react-utilities';
8
8
  import type { SlotClassNames } from '@fluentui/react-utilities';
@@ -1 +1,3 @@
1
- import * as React from 'react';
1
+ /**
2
+ * Switch base state, excluding design-related state like size
3
+ */ export { };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Switch/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' | 'size'\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 * When set, allows the Switch to be focusable even when it has been disabled. This is used in scenarios where it is\n * important to keep a consistent tab order for screen reader and keyboard users.\n *\n * @default false\n */\n disabledFocusable?: 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 * The size of the Switch.\n *\n * @default 'medium'\n */\n size?: 'small' | 'medium';\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 * Switch base props, excluding design-related props like size\n */\nexport type SwitchBaseProps = Omit<SwitchProps, 'size'>;\n\n/**\n * State used in rendering Switch\n */\nexport type SwitchState = ComponentState<SwitchSlots> &\n Required<Pick<SwitchProps, 'disabledFocusable' | 'labelPosition' | 'size'>>;\n\n/**\n * Switch base state, excluding design-related state like size\n */\nexport type SwitchBaseState = Omit<SwitchState, 'size'>;\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
1
+ {"version":3,"sources":["../src/components/Switch/Switch.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { 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' | 'size'\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 * When set, allows the Switch to be focusable even when it has been disabled. This is used in scenarios where it is\n * important to keep a consistent tab order for screen reader and keyboard users.\n *\n * @default false\n */\n disabledFocusable?: 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 * The size of the Switch.\n *\n * @default 'medium'\n */\n size?: 'small' | 'medium';\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 * Switch base props, excluding design-related props like size\n */\nexport type SwitchBaseProps = Omit<SwitchProps, 'size'>;\n\n/**\n * State used in rendering Switch\n */\nexport type SwitchState = ComponentState<SwitchSlots> &\n Required<Pick<SwitchProps, 'disabledFocusable' | 'labelPosition' | 'size'>>;\n\n/**\n * Switch base state, excluding design-related state like size\n */\nexport type SwitchBaseState = Omit<SwitchState, 'size'>;\n"],"names":[],"mappings":"AAoGA;;CAEC,GACD,WAAwD"}
@@ -14,11 +14,26 @@ import { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentu
14
14
  * @param props - props from this instance of Switch
15
15
  * @param ref - reference to `<input>` element of Switch
16
16
  */ export const useSwitch_unstable = (props, ref)=>{
17
+ var _baseState_indicator;
17
18
  const { size = 'medium', ...baseProps } = props;
18
19
  const baseState = useSwitchBase_unstable(baseProps, ref);
20
+ var _children;
21
+ (_children = (_baseState_indicator = baseState.indicator).children) !== null && _children !== void 0 ? _children : _baseState_indicator.children = /*#__PURE__*/ React.createElement(CircleFilled, null);
19
22
  return {
20
23
  ...baseState,
21
- size
24
+ components: {
25
+ // eslint-disable-next-line @typescript-eslint/no-deprecated
26
+ ...baseState.components,
27
+ label: Label
28
+ },
29
+ size,
30
+ label: slot.optional(props.label, {
31
+ defaultProps: {
32
+ size: 'medium',
33
+ ...baseState.label
34
+ },
35
+ elementType: Label
36
+ })
22
37
  };
23
38
  };
24
39
  /**
@@ -53,8 +68,7 @@ import { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentu
53
68
  });
54
69
  const indicator = slot.always(props.indicator, {
55
70
  defaultProps: {
56
- 'aria-hidden': true,
57
- children: /*#__PURE__*/ React.createElement(CircleFilled, null)
71
+ 'aria-hidden': true
58
72
  },
59
73
  elementType: 'div'
60
74
  });
@@ -91,10 +105,9 @@ import { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentu
91
105
  defaultProps: {
92
106
  disabled: disabled || disabledFocusable,
93
107
  htmlFor: id,
94
- required,
95
- size: 'medium'
108
+ required
96
109
  },
97
- elementType: Label
110
+ elementType: 'label'
98
111
  });
99
112
  return {
100
113
  disabledFocusable,
@@ -103,7 +116,7 @@ import { getPartitionedNativeProps, mergeCallbacks, useId, slot } from '@fluentu
103
116
  root: 'div',
104
117
  indicator: 'div',
105
118
  input: 'input',
106
- label: Label
119
+ label: 'label'
107
120
  },
108
121
  root,
109
122
  indicator,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Switch/useSwitch.tsx"],"sourcesContent":["'use client';\n\nimport * 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, SwitchBaseProps, SwitchBaseState } from './Switch.types';\n\n/**\n * Create the state required to render Switch.\n *\n * The returned state can be modified with hooks such as useSwitchStyles_unstable,\n * before being passed to renderSwitch_unstable.\n *\n * @param props - props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLInputElement>): SwitchState => {\n const { size = 'medium', ...baseProps } = props;\n\n const baseState = useSwitchBase_unstable(baseProps, ref);\n\n return {\n ...baseState,\n size,\n };\n};\n\n/**\n * Base hook for Switch component, manages state and structure common to all variants of Switch\n *\n * @param props - base props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitchBase_unstable = (props: SwitchBaseProps, ref?: React.Ref<HTMLInputElement>): SwitchBaseState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n\n const {\n checked,\n defaultChecked,\n disabled,\n disabledFocusable = false,\n labelPosition = 'after',\n onChange,\n required,\n } = props;\n\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange', 'disabledFocusable'],\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: {\n checked,\n defaultChecked,\n id,\n ref,\n role: 'switch',\n type: 'checkbox',\n ...nativeProps.primary,\n disabled: disabled && !disabledFocusable,\n ...(disabledFocusable && { 'aria-disabled': true }),\n },\n elementType: 'input',\n });\n input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n input.onClick = mergeCallbacks(input.onClick, ev => {\n if (disabledFocusable) {\n ev.preventDefault();\n }\n });\n input.onKeyDown = mergeCallbacks(input.onKeyDown, ev => {\n if (disabledFocusable && (ev.key === ' ' || ev.key === 'Enter')) {\n ev.preventDefault();\n }\n });\n const label = slot.optional(props.label, {\n defaultProps: { disabled: disabled || disabledFocusable, htmlFor: id, required, size: 'medium' },\n elementType: Label,\n });\n return {\n disabledFocusable,\n labelPosition,\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","size","baseProps","baseState","useSwitchBase_unstable","supportsLabelFor","supportsRequired","checked","defaultChecked","disabled","disabledFocusable","labelPosition","onChange","required","nativeProps","primarySlotTagName","excludedPropNames","id","primary","root","always","defaultProps","elementType","indicator","children","input","role","type","ev","currentTarget","onClick","preventDefault","onKeyDown","key","label","optional","htmlFor","components"],"mappings":"AAAA;AAEA,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,MAAM,EAAEC,OAAO,QAAQ,EAAE,GAAGC,WAAW,GAAGH;IAE1C,MAAMI,YAAYC,uBAAuBF,WAAWF;IAEpD,OAAO;QACL,GAAGG,SAAS;QACZF;IACF;AACF,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMG,yBAAyB,CAACL,OAAwBC;IAC7D,+CAA+C;IAC/CD,QAAQT,8BAA8BS,OAAO;QAAEM,kBAAkB;QAAMC,kBAAkB;IAAK;IAE9F,MAAM,EACJC,OAAO,EACPC,cAAc,EACdC,QAAQ,EACRC,oBAAoB,KAAK,EACzBC,gBAAgB,OAAO,EACvBC,QAAQ,EACRC,QAAQ,EACT,GAAGd;IAEJ,MAAMe,cAAcpB,0BAA0B;QAC5CK;QACAgB,oBAAoB;QACpBC,mBAAmB;YAAC;YAAW;YAAkB;YAAY;SAAoB;IACnF;IAEA,MAAMC,KAAKrB,MAAM,WAAWkB,YAAYI,OAAO,CAACD,EAAE;IAElD,MAAME,OAAOtB,KAAKuB,MAAM,CAACrB,MAAMoB,IAAI,EAAE;QACnCE,cAAc;YAAErB,KAAKP;YAAkC,GAAGqB,YAAYK,IAAI;QAAC;QAC3EG,aAAa;IACf;IACA,MAAMC,YAAY1B,KAAKuB,MAAM,CAACrB,MAAMwB,SAAS,EAAE;QAC7CF,cAAc;YAAE,eAAe;YAAMG,wBAAU,oBAACjC;QAAgB;QAChE+B,aAAa;IACf;IACA,MAAMG,QAAQ5B,KAAKuB,MAAM,CAACrB,MAAM0B,KAAK,EAAE;QACrCJ,cAAc;YACZd;YACAC;YACAS;YACAjB;YACA0B,MAAM;YACNC,MAAM;YACN,GAAGb,YAAYI,OAAO;YACtBT,UAAUA,YAAY,CAACC;YACvB,GAAIA,qBAAqB;gBAAE,iBAAiB;YAAK,CAAC;QACpD;QACAY,aAAa;IACf;IACAG,MAAMb,QAAQ,GAAGjB,eAAe8B,MAAMb,QAAQ,EAAEgB,CAAAA,KAAMhB,qBAAAA,+BAAAA,SAAWgB,IAAI;YAAErB,SAASqB,GAAGC,aAAa,CAACtB,OAAO;QAAC;IACzGkB,MAAMK,OAAO,GAAGnC,eAAe8B,MAAMK,OAAO,EAAEF,CAAAA;QAC5C,IAAIlB,mBAAmB;YACrBkB,GAAGG,cAAc;QACnB;IACF;IACAN,MAAMO,SAAS,GAAGrC,eAAe8B,MAAMO,SAAS,EAAEJ,CAAAA;QAChD,IAAIlB,qBAAsBkB,CAAAA,GAAGK,GAAG,KAAK,OAAOL,GAAGK,GAAG,KAAK,OAAM,GAAI;YAC/DL,GAAGG,cAAc;QACnB;IACF;IACA,MAAMG,QAAQrC,KAAKsC,QAAQ,CAACpC,MAAMmC,KAAK,EAAE;QACvCb,cAAc;YAAEZ,UAAUA,YAAYC;YAAmB0B,SAASnB;YAAIJ;YAAUZ,MAAM;QAAS;QAC/FqB,aAAa9B;IACf;IACA,OAAO;QACLkB;QACAC;QACA0B,YAAY;YAAElB,MAAM;YAAOI,WAAW;YAAOE,OAAO;YAASS,OAAO1C;QAAM;QAE1E2B;QACAI;QACAE;QACAS;IACF;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/Switch/useSwitch.tsx"],"sourcesContent":["'use client';\n\nimport * 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, SwitchBaseProps, SwitchBaseState } from './Switch.types';\n\n/**\n * Create the state required to render Switch.\n *\n * The returned state can be modified with hooks such as useSwitchStyles_unstable,\n * before being passed to renderSwitch_unstable.\n *\n * @param props - props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLInputElement>): SwitchState => {\n const { size = 'medium', ...baseProps } = props;\n\n const baseState = useSwitchBase_unstable(baseProps, ref);\n\n baseState.indicator.children ??= <CircleFilled />;\n\n return {\n ...baseState,\n components: {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ...baseState.components,\n label: Label,\n },\n size,\n label: slot.optional(props.label, {\n defaultProps: { size: 'medium', ...baseState.label },\n elementType: Label,\n }),\n };\n};\n\n/**\n * Base hook for Switch component, manages state and structure common to all variants of Switch\n *\n * @param props - base props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitchBase_unstable = (props: SwitchBaseProps, ref?: React.Ref<HTMLInputElement>): SwitchBaseState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n\n const {\n checked,\n defaultChecked,\n disabled,\n disabledFocusable = false,\n labelPosition = 'after',\n onChange,\n required,\n } = props;\n\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange', 'disabledFocusable'],\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 },\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 disabled: disabled && !disabledFocusable,\n ...(disabledFocusable && { 'aria-disabled': true }),\n },\n elementType: 'input',\n });\n input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n input.onClick = mergeCallbacks(input.onClick, ev => {\n if (disabledFocusable) {\n ev.preventDefault();\n }\n });\n input.onKeyDown = mergeCallbacks(input.onKeyDown, ev => {\n if (disabledFocusable && (ev.key === ' ' || ev.key === 'Enter')) {\n ev.preventDefault();\n }\n });\n const label = slot.optional(props.label, {\n defaultProps: { disabled: disabled || disabledFocusable, htmlFor: id, required },\n elementType: 'label',\n });\n return {\n disabledFocusable,\n labelPosition,\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","baseState","size","baseProps","useSwitchBase_unstable","indicator","children","components","label","optional","defaultProps","elementType","supportsLabelFor","supportsRequired","checked","defaultChecked","disabled","disabledFocusable","labelPosition","onChange","required","nativeProps","primarySlotTagName","excludedPropNames","id","primary","root","always","input","role","type","ev","currentTarget","onClick","preventDefault","onKeyDown","key","htmlFor"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
- "use strict";
1
+ /**
2
+ * Switch base state, excluding design-related state like size
3
+ */ "use strict";
2
4
  Object.defineProperty(exports, "__esModule", {
3
5
  value: true
4
6
  });
5
- const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
6
- const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Switch/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' | 'size'\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 * When set, allows the Switch to be focusable even when it has been disabled. This is used in scenarios where it is\n * important to keep a consistent tab order for screen reader and keyboard users.\n *\n * @default false\n */\n disabledFocusable?: 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 * The size of the Switch.\n *\n * @default 'medium'\n */\n size?: 'small' | 'medium';\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 * Switch base props, excluding design-related props like size\n */\nexport type SwitchBaseProps = Omit<SwitchProps, 'size'>;\n\n/**\n * State used in rendering Switch\n */\nexport type SwitchState = ComponentState<SwitchSlots> &\n Required<Pick<SwitchProps, 'disabledFocusable' | 'labelPosition' | 'size'>>;\n\n/**\n * Switch base state, excluding design-related state like size\n */\nexport type SwitchBaseState = Omit<SwitchState, 'size'>;\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}
1
+ {"version":3,"sources":["../src/components/Switch/Switch.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { 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' | 'size'\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 * When set, allows the Switch to be focusable even when it has been disabled. This is used in scenarios where it is\n * important to keep a consistent tab order for screen reader and keyboard users.\n *\n * @default false\n */\n disabledFocusable?: 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 * The size of the Switch.\n *\n * @default 'medium'\n */\n size?: 'small' | 'medium';\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 * Switch base props, excluding design-related props like size\n */\nexport type SwitchBaseProps = Omit<SwitchProps, 'size'>;\n\n/**\n * State used in rendering Switch\n */\nexport type SwitchState = ComponentState<SwitchSlots> &\n Required<Pick<SwitchProps, 'disabledFocusable' | 'labelPosition' | 'size'>>;\n\n/**\n * Switch base state, excluding design-related state like size\n */\nexport type SwitchBaseState = Omit<SwitchState, 'size'>;\n"],"names":[],"mappings":"AAoGA;;CAEC,GACD,WAAwD"}
@@ -25,11 +25,26 @@ const _reactlabel = require("@fluentui/react-label");
25
25
  const _reacttabster = require("@fluentui/react-tabster");
26
26
  const _reactutilities = require("@fluentui/react-utilities");
27
27
  const useSwitch_unstable = (props, ref)=>{
28
+ var _baseState_indicator;
28
29
  const { size = 'medium', ...baseProps } = props;
29
30
  const baseState = useSwitchBase_unstable(baseProps, ref);
31
+ var _children;
32
+ (_children = (_baseState_indicator = baseState.indicator).children) !== null && _children !== void 0 ? _children : _baseState_indicator.children = /*#__PURE__*/ _react.createElement(_reacticons.CircleFilled, null);
30
33
  return {
31
34
  ...baseState,
32
- size
35
+ components: {
36
+ // eslint-disable-next-line @typescript-eslint/no-deprecated
37
+ ...baseState.components,
38
+ label: _reactlabel.Label
39
+ },
40
+ size,
41
+ label: _reactutilities.slot.optional(props.label, {
42
+ defaultProps: {
43
+ size: 'medium',
44
+ ...baseState.label
45
+ },
46
+ elementType: _reactlabel.Label
47
+ })
33
48
  };
34
49
  };
35
50
  const useSwitchBase_unstable = (props, ref)=>{
@@ -59,8 +74,7 @@ const useSwitchBase_unstable = (props, ref)=>{
59
74
  });
60
75
  const indicator = _reactutilities.slot.always(props.indicator, {
61
76
  defaultProps: {
62
- 'aria-hidden': true,
63
- children: /*#__PURE__*/ _react.createElement(_reacticons.CircleFilled, null)
77
+ 'aria-hidden': true
64
78
  },
65
79
  elementType: 'div'
66
80
  });
@@ -97,10 +111,9 @@ const useSwitchBase_unstable = (props, ref)=>{
97
111
  defaultProps: {
98
112
  disabled: disabled || disabledFocusable,
99
113
  htmlFor: id,
100
- required,
101
- size: 'medium'
114
+ required
102
115
  },
103
- elementType: _reactlabel.Label
116
+ elementType: 'label'
104
117
  });
105
118
  return {
106
119
  disabledFocusable,
@@ -109,7 +122,7 @@ const useSwitchBase_unstable = (props, ref)=>{
109
122
  root: 'div',
110
123
  indicator: 'div',
111
124
  input: 'input',
112
- label: _reactlabel.Label
125
+ label: 'label'
113
126
  },
114
127
  root,
115
128
  indicator,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Switch/useSwitch.tsx"],"sourcesContent":["'use client';\n\nimport * 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, SwitchBaseProps, SwitchBaseState } from './Switch.types';\n\n/**\n * Create the state required to render Switch.\n *\n * The returned state can be modified with hooks such as useSwitchStyles_unstable,\n * before being passed to renderSwitch_unstable.\n *\n * @param props - props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLInputElement>): SwitchState => {\n const { size = 'medium', ...baseProps } = props;\n\n const baseState = useSwitchBase_unstable(baseProps, ref);\n\n return {\n ...baseState,\n size,\n };\n};\n\n/**\n * Base hook for Switch component, manages state and structure common to all variants of Switch\n *\n * @param props - base props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitchBase_unstable = (props: SwitchBaseProps, ref?: React.Ref<HTMLInputElement>): SwitchBaseState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n\n const {\n checked,\n defaultChecked,\n disabled,\n disabledFocusable = false,\n labelPosition = 'after',\n onChange,\n required,\n } = props;\n\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange', 'disabledFocusable'],\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: {\n checked,\n defaultChecked,\n id,\n ref,\n role: 'switch',\n type: 'checkbox',\n ...nativeProps.primary,\n disabled: disabled && !disabledFocusable,\n ...(disabledFocusable && { 'aria-disabled': true }),\n },\n elementType: 'input',\n });\n input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n input.onClick = mergeCallbacks(input.onClick, ev => {\n if (disabledFocusable) {\n ev.preventDefault();\n }\n });\n input.onKeyDown = mergeCallbacks(input.onKeyDown, ev => {\n if (disabledFocusable && (ev.key === ' ' || ev.key === 'Enter')) {\n ev.preventDefault();\n }\n });\n const label = slot.optional(props.label, {\n defaultProps: { disabled: disabled || disabledFocusable, htmlFor: id, required, size: 'medium' },\n elementType: Label,\n });\n return {\n disabledFocusable,\n labelPosition,\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","size","baseProps","baseState","useSwitchBase_unstable","supportsLabelFor","supportsRequired","checked","defaultChecked","disabled","disabledFocusable","labelPosition","onChange","required","nativeProps","primarySlotTagName","excludedPropNames","id","primary","root","always","defaultProps","elementType","indicator","children","input","role","type","ev","currentTarget","onClick","preventDefault","onKeyDown","key","label","optional","htmlFor","components"],"mappings":"AAAA;;;;;;;;;;;;0BAoCae;;;IAjBAN,kBAAAA;;;;;iEAjBU,QAAQ;4BACe,wBAAwB;4BACzC,wBAAwB;4BAC/B,wBAAwB;8BACf,0BAA0B;gCACc,4BAA4B;AAY5F,2BAA2B,CAACC,OAAoBC;IACrD,MAAM,EAAEC,OAAO,QAAQ,EAAE,GAAGC,WAAW,GAAGH;IAE1C,MAAMI,YAAYC,uBAAuBF,WAAWF;IAEpD,OAAO;QACL,GAAGG,SAAS;QACZF;IACF;AACF,EAAE;AAQK,MAAMG,yBAAyB,CAACL,OAAwBC;IAC7D,+CAA+C;IAC/CD,YAAQT,yCAAAA,EAA8BS,OAAO;QAAEM,kBAAkB;QAAMC,kBAAkB;IAAK;IAE9F,MAAM,EACJC,OAAO,EACPC,cAAc,EACdC,QAAQ,EACRC,oBAAoB,KAAK,EACzBC,gBAAgB,OAAO,EACvBC,QAAQ,EACRC,QAAQ,EACT,GAAGd;IAEJ,MAAMe,kBAAcpB,yCAAAA,EAA0B;QAC5CK;QACAgB,oBAAoB;QACpBC,mBAAmB;YAAC;YAAW;YAAkB;YAAY;SAAoB;IACnF;IAEA,MAAMC,SAAKrB,qBAAAA,EAAM,WAAWkB,YAAYI,OAAO,CAACD,EAAE;IAElD,MAAME,OAAOtB,oBAAAA,CAAKuB,MAAM,CAACrB,MAAMoB,IAAI,EAAE;QACnCE,cAAc;YAAErB,SAAKP,4BAAAA;YAAkC,GAAGqB,YAAYK,IAAI;QAAC;QAC3EG,aAAa;IACf;IACA,MAAMC,YAAY1B,oBAAAA,CAAKuB,MAAM,CAACrB,MAAMwB,SAAS,EAAE;QAC7CF,cAAc;YAAE,eAAe;YAAMG,UAAAA,WAAAA,GAAU,OAAA,aAAA,CAACjC,wBAAAA,EAAAA;QAAgB;QAChE+B,aAAa;IACf;IACA,MAAMG,QAAQ5B,oBAAAA,CAAKuB,MAAM,CAACrB,MAAM0B,KAAK,EAAE;QACrCJ,cAAc;YACZd;YACAC;YACAS;YACAjB;YACA0B,MAAM;YACNC,MAAM;YACN,GAAGb,YAAYI,OAAO;YACtBT,UAAUA,YAAY,CAACC;YACvB,GAAIA,qBAAqB;gBAAE,iBAAiB;YAAK,CAAC;QACpD;QACAY,aAAa;IACf;IACAG,MAAMb,QAAQ,OAAGjB,8BAAAA,EAAe8B,MAAMb,QAAQ,EAAEgB,CAAAA,KAAMhB,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWgB,IAAI;YAAErB,SAASqB,GAAGC,aAAa,CAACtB,OAAO;QAAC;IACzGkB,MAAMK,OAAO,OAAGnC,8BAAAA,EAAe8B,MAAMK,OAAO,EAAEF,CAAAA;QAC5C,IAAIlB,mBAAmB;YACrBkB,GAAGG,cAAc;QACnB;IACF;IACAN,MAAMO,SAAS,OAAGrC,8BAAAA,EAAe8B,MAAMO,SAAS,EAAEJ,CAAAA;QAChD,IAAIlB,qBAAsBkB,CAAAA,GAAGK,GAAG,KAAK,OAAOL,GAAGK,GAAG,KAAK,OAAA,CAAM,EAAI;YAC/DL,GAAGG,cAAc;QACnB;IACF;IACA,MAAMG,QAAQrC,oBAAAA,CAAKsC,QAAQ,CAACpC,MAAMmC,KAAK,EAAE;QACvCb,cAAc;YAAEZ,UAAUA,YAAYC;YAAmB0B,SAASnB;YAAIJ;YAAUZ,MAAM;QAAS;QAC/FqB,aAAa9B,iBAAAA;IACf;IACA,OAAO;QACLkB;QACAC;QACA0B,YAAY;YAAElB,MAAM;YAAOI,WAAW;YAAOE,OAAO;YAASS,OAAO1C,iBAAAA;QAAM;QAE1E2B;QACAI;QACAE;QACAS;IACF;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/Switch/useSwitch.tsx"],"sourcesContent":["'use client';\n\nimport * 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, SwitchBaseProps, SwitchBaseState } from './Switch.types';\n\n/**\n * Create the state required to render Switch.\n *\n * The returned state can be modified with hooks such as useSwitchStyles_unstable,\n * before being passed to renderSwitch_unstable.\n *\n * @param props - props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitch_unstable = (props: SwitchProps, ref: React.Ref<HTMLInputElement>): SwitchState => {\n const { size = 'medium', ...baseProps } = props;\n\n const baseState = useSwitchBase_unstable(baseProps, ref);\n\n baseState.indicator.children ??= <CircleFilled />;\n\n return {\n ...baseState,\n components: {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n ...baseState.components,\n label: Label,\n },\n size,\n label: slot.optional(props.label, {\n defaultProps: { size: 'medium', ...baseState.label },\n elementType: Label,\n }),\n };\n};\n\n/**\n * Base hook for Switch component, manages state and structure common to all variants of Switch\n *\n * @param props - base props from this instance of Switch\n * @param ref - reference to `<input>` element of Switch\n */\nexport const useSwitchBase_unstable = (props: SwitchBaseProps, ref?: React.Ref<HTMLInputElement>): SwitchBaseState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n\n const {\n checked,\n defaultChecked,\n disabled,\n disabledFocusable = false,\n labelPosition = 'after',\n onChange,\n required,\n } = props;\n\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange', 'disabledFocusable'],\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 },\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 disabled: disabled && !disabledFocusable,\n ...(disabledFocusable && { 'aria-disabled': true }),\n },\n elementType: 'input',\n });\n input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { checked: ev.currentTarget.checked }));\n input.onClick = mergeCallbacks(input.onClick, ev => {\n if (disabledFocusable) {\n ev.preventDefault();\n }\n });\n input.onKeyDown = mergeCallbacks(input.onKeyDown, ev => {\n if (disabledFocusable && (ev.key === ' ' || ev.key === 'Enter')) {\n ev.preventDefault();\n }\n });\n const label = slot.optional(props.label, {\n defaultProps: { disabled: disabled || disabledFocusable, htmlFor: id, required },\n elementType: 'label',\n });\n return {\n disabledFocusable,\n labelPosition,\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","baseState","size","baseProps","useSwitchBase_unstable","indicator","children","components","label","optional","defaultProps","elementType","supportsLabelFor","supportsRequired","checked","defaultChecked","disabled","disabledFocusable","labelPosition","onChange","required","nativeProps","primarySlotTagName","excludedPropNames","id","primary","root","always","input","role","type","ev","currentTarget","onClick","preventDefault","onKeyDown","key","htmlFor"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-switch",
3
- "version": "9.7.1",
3
+ "version": "9.7.2",
4
4
  "description": "Fluent UI React Switch component.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -12,14 +12,14 @@
12
12
  },
13
13
  "license": "MIT",
14
14
  "dependencies": {
15
- "@fluentui/react-field": "^9.5.0",
15
+ "@fluentui/react-field": "^9.5.1",
16
16
  "@fluentui/react-icons": "^2.0.245",
17
- "@fluentui/react-jsx-runtime": "^9.4.1",
18
- "@fluentui/react-label": "^9.4.0",
17
+ "@fluentui/react-jsx-runtime": "^9.4.2",
18
+ "@fluentui/react-label": "^9.4.1",
19
19
  "@fluentui/react-shared-contexts": "^9.26.2",
20
- "@fluentui/react-tabster": "^9.26.13",
20
+ "@fluentui/react-tabster": "^9.26.14",
21
21
  "@fluentui/react-theme": "^9.2.1",
22
- "@fluentui/react-utilities": "^9.26.2",
22
+ "@fluentui/react-utilities": "^9.26.3",
23
23
  "@griffel/react": "^1.5.32",
24
24
  "@swc/helpers": "^0.5.1"
25
25
  },