npm - @fluentui/react-combobox - Versions diffs - 9.17.3 → 9.17.4 - Mend

@fluentui/react-combobox 9.17.3 → 9.17.4

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.

Files changed (10) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,12 +1,22 @@
 # Change Log - @fluentui/react-combobox
-This log was last generated on Wed, 24 Jun 2026 11:03:30 GMT and should not be manually modified.
+This log was last generated on Tue, 04 Aug 2026 10:10:05 GMT and should not be manually modified.
 <!-- Start content -->
+## [9.17.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.17.4)
+Tue, 04 Aug 2026 10:10:05 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.17.3..@fluentui/react-combobox_v9.17.4)
+### Patches
+- fix: fix Field control size handling Combobox and Dropdown ([PR #36453](https://github.com/microsoft/fluentui/pull/36453) by dmytrokirpa@microsoft.com)
+- Bump @fluentui/react-positioning to v9.23.0 ([PR #36453](https://github.com/microsoft/fluentui/pull/36453) by beachball)
 ## [9.17.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.17.3)
-Wed, 24 Jun 2026 11:03:30 GMT
+Wed, 24 Jun 2026 11:09:41 GMT
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.17.2..@fluentui/react-combobox_v9.17.3)
 ### Patches

package/lib/components/Combobox/useCombobox.js CHANGED Viewed

@@ -1,7 +1,7 @@
 'use client';
 import * as React from 'react';
 import { useActiveDescendant } from '@fluentui/react-aria';
-import { useFieldControlProps_unstable } from '@fluentui/react-field';
+import { useFieldContext_unstable, useFieldControlProps_unstable } from '@fluentui/react-field';
 import { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';
 import { getPartitionedNativeProps, mergeCallbacks, useEventCallback, useId, useMergedRefs, slot, useOnClickOutside } from '@fluentui/react-utilities';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
@@ -185,7 +185,9 @@ import { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';
  * @param props - props from this instance of Combobox
  * @param ref - reference to root HTMLElement of Combobox
  */ export const useCombobox_unstable = (props, ref)=>{
-    const { appearance = 'outline', size = 'medium', ...baseProps } = props;
+    const fieldContext = useFieldContext_unstable();
+    var _fieldContext_size;
+    const { appearance = 'outline', size = (_fieldContext_size = fieldContext === null || fieldContext === void 0 ? void 0 : fieldContext.size) !== null && _fieldContext_size !== void 0 ? _fieldContext_size : 'medium', ...baseProps } = props;
     const baseState = useComboboxBase_unstable(baseProps, ref);
     if (baseState.clearIcon) {
         var _baseState_clearIcon;

package/lib/components/Combobox/useCombobox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Combobox/useCombobox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useEventCallback,\n useId,\n useMergedRefs,\n slot,\n useOnClickOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { Listbox } from '../Listbox/Listbox';\nimport type {\n BaseComboboxProps,\n BaseComboboxState,\n ComboboxOpenEvents,\n ComboboxProps,\n ComboboxState,\n} from './Combobox.types';\nimport { useListboxSlot } from '../../utils/useListboxSlot';\nimport { useInputTriggerSlot } from './useInputTriggerSlot';\nimport { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';\n\n/*\n Create the base state required to render Combobox, without design-only props.\n \n @param props - props from this instance of Combobox (without appearance and size)\n * @param ref - reference to root HTMLInputElement of Combobox\n /\nexport const useComboboxBase_unstable = (\n props: BaseComboboxProps,\n ref: React.Ref<HTMLInputElement>,\n): BaseComboboxState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n const {\n listboxRef: activeDescendantListboxRef,\n activeParentRef,\n controller: activeDescendantController,\n } = useActiveDescendant<HTMLInputElement, HTMLDivElement>({\n matchOption: isComboboxOptionElement,\n });\n const comboboxInternalState = useComboboxBaseState({ ...props, editable: true, activeDescendantController });\n const { appearance: _appearance, size: _size, ...baseState } = comboboxInternalState;\n\n const { clearable, clearSelection, disabled, multiselect, open, selectedOptions, setOpen, value, hasFocus } =\n baseState;\n const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n const { disableAutoFocus = false, freeform, inlinePopup } = props;\n const comboId = useId('combobox-');\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['children'],\n });\n\n const triggerRef = React.useRef<HTMLInputElement>(null);\n\n const listbox = useListboxSlot(props.listbox, useMergedRefs(comboboxPopupRef, activeDescendantListboxRef), {\n state: comboboxInternalState,\n triggerRef,\n defaultProps: {\n children: props.children,\n disableAutoFocus,\n },\n });\n\n const triggerSlot = useInputTriggerSlot(props.input ?? {}, useMergedRefs(triggerRef, activeParentRef, ref), {\n state: comboboxInternalState,\n freeform,\n defaultProps: {\n type: 'text',\n value: value ?? '',\n 'aria-controls': open ? listbox?.id : undefined,\n ...triggerNativeProps,\n },\n activeDescendantController,\n });\n\n const rootSlot = slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !inlinePopup && open ? listbox?.id : undefined,\n ...rootNativeProps,\n },\n elementType: 'div',\n });\n rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n const showClearIcon = selectedOptions.length > 0 && !disabled && clearable && !multiselect;\n const state: BaseComboboxState = {\n components: { root: 'div', input: 'input', expandIcon: 'span', listbox: Listbox, clearIcon: 'span' },\n root: rootSlot,\n input: triggerSlot,\n listbox: open \|\| hasFocus ? listbox : undefined,\n clearIcon: slot.optional(props.clearIcon, {\n defaultProps: {\n 'aria-hidden': 'true',\n },\n elementType: 'span',\n renderByDefault: true,\n }),\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n defaultProps: {\n 'aria-disabled': disabled ? 'true' : undefined,\n 'aria-expanded': open,\n role: 'button',\n },\n elementType: 'span',\n }),\n showClearIcon,\n activeDescendantController,\n ...baseState,\n };\n\n const { targetDocument } = useFluent();\n\n useOnClickOutside({\n element: targetDocument,\n callback: event => setOpen(event as unknown as ComboboxOpenEvents, false),\n refs: [triggerRef, comboboxPopupRef, comboboxTargetRef],\n disabled: !open,\n });\n\n / handle open/close + focus change when clicking expandIcon /\n const { onMouseDown: onIconMouseDown } = state.expandIcon \|\| {};\n\n const onExpandIconMouseDown = useEventCallback(\n // eslint-disable-next-line react-hooks/refs\n mergeCallbacks(onIconMouseDown, (event: React.MouseEvent<HTMLSpanElement>) => {\n event.preventDefault();\n state.setOpen(event, !state.open);\n triggerRef.current?.focus();\n }),\n );\n\n if (state.expandIcon) {\n state.expandIcon.onMouseDown = onExpandIconMouseDown;\n\n // If there is no explicit aria-label, calculate default accName attribute for expandIcon button,\n // using the following steps:\n // 1. If there is an aria-label, it is \"Open [aria-label]\"\n // 2. If there is an aria-labelledby, it is \"Open [aria-labelledby target]\" (using aria-labelledby + ids)\n // 3. If there is no aria-label/ledby attr, it falls back to \"Open\"\n // We can't fall back to a label/htmlFor name because of https://github.com/w3c/accname/issues/179\n const hasExpandLabel = state.expandIcon['aria-label'] \|\| state.expandIcon['aria-labelledby'];\n const defaultOpenString = 'Open'; // this is english-only since it is the fallback\n if (!hasExpandLabel) {\n if (props['aria-labelledby']) {\n const chevronId = state.expandIcon.id ?? `${comboId}-chevron`;\n const chevronLabelledBy = `${chevronId} ${state.input['aria-labelledby']}`;\n\n state.expandIcon['aria-label'] = defaultOpenString;\n state.expandIcon.id = chevronId;\n state.expandIcon['aria-labelledby'] = chevronLabelledBy;\n } else if (props['aria-label']) {\n state.expandIcon['aria-label'] = `${defaultOpenString} ${props['aria-label']}`;\n } else {\n state.expandIcon['aria-label'] = defaultOpenString;\n }\n }\n }\n\n const onClearIconMouseDown = useEventCallback(\n mergeCallbacks(state.clearIcon?.onMouseDown, (ev: React.MouseEvent<HTMLSpanElement>) => {\n ev.preventDefault();\n }),\n );\n const onClearIconClick = useEventCallback(\n mergeCallbacks(state.clearIcon?.onClick, (ev: React.MouseEvent<HTMLSpanElement>) => {\n clearSelection(ev);\n }),\n );\n\n if (state.clearIcon) {\n state.clearIcon.onMouseDown = onClearIconMouseDown;\n state.clearIcon.onClick = onClearIconClick;\n }\n\n // Heads up! We don't support \"clearable\" in multiselect mode, so we should never display a slot\n if (multiselect) {\n state.clearIcon = undefined;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- \"process.env\" does not change in runtime\n React.useEffect(() => {\n if (clearable && multiselect) {\n // eslint-disable-next-line no-console\n console.error(`[@fluentui/react-combobox] \"clearable\" prop is not supported in multiselect mode.`);\n }\n }, [clearable, multiselect]);\n }\n\n return state;\n};\n\n/\n Create the state required to render Combobox.\n \n The returned state can be modified with hooks such as useComboboxStyles_unstable,\n * before being passed to renderCombobox_unstable.\n \n @param props - props from this instance of Combobox\n * @param ref - reference to root HTMLElement of Combobox\n */\nexport const useCombobox_unstable = (props: ComboboxProps, ref: React.Ref<HTMLInputElement>): ComboboxState => {\n const { appearance = 'outline', size = 'medium', ...baseProps } = props;\n const baseState = useComboboxBase_unstable(baseProps, ref);\n\n if (baseState.clearIcon) {\n baseState.clearIcon.children ??= <DismissIcon />;\n }\n\n if (baseState.expandIcon) {\n baseState.expandIcon.children ??= <ChevronDownIcon />;\n }\n\n return {\n ...baseState,\n appearance,\n size,\n };\n};\n"],"names":["React","useActiveDescendant","useFieldControlProps_unstable","ChevronDownRegular","ChevronDownIcon","DismissRegular","DismissIcon","getPartitionedNativeProps","mergeCallbacks","useEventCallback","useId","useMergedRefs","slot","useOnClickOutside","useFluent_unstable","useFluent","useComboboxBaseState","useComboboxPositioning","Listbox","useListboxSlot","useInputTriggerSlot","isComboboxOptionElement","useComboboxBase_unstable","props","ref","state","supportsLabelFor","supportsRequired","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","comboboxInternalState","editable","appearance","_appearance","size","_size","baseState","clearable","clearSelection","disabled","multiselect","open","selectedOptions","setOpen","value","hasFocus","comboboxPopupRef","comboboxTargetRef","disableAutoFocus","freeform","inlinePopup","comboId","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","triggerRef","useRef","listbox","defaultProps","children","triggerSlot","input","type","id","undefined","rootSlot","always","elementType","showClearIcon","length","components","expandIcon","clearIcon","optional","renderByDefault","role","targetDocument","element","callback","event","refs","onMouseDown","onIconMouseDown","onExpandIconMouseDown","preventDefault","current","focus","hasExpandLabel","defaultOpenString","chevronId","chevronLabelledBy","onClearIconMouseDown","ev","onClearIconClick","onClick","process","env","NODE_ENV","useEffect","console","error","useCombobox_unstable","baseProps"],"mappings":"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"}
1	+ {"version":3,"sources":["../src/components/Combobox/useCombobox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { useFieldContext_unstable, useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useEventCallback,\n useId,\n useMergedRefs,\n slot,\n useOnClickOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { Listbox } from '../Listbox/Listbox';\nimport type {\n BaseComboboxProps,\n BaseComboboxState,\n ComboboxOpenEvents,\n ComboboxProps,\n ComboboxState,\n} from './Combobox.types';\nimport { useListboxSlot } from '../../utils/useListboxSlot';\nimport { useInputTriggerSlot } from './useInputTriggerSlot';\nimport { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';\n\n/*\n Create the base state required to render Combobox, without design-only props.\n \n @param props - props from this instance of Combobox (without appearance and size)\n * @param ref - reference to root HTMLInputElement of Combobox\n /\nexport const useComboboxBase_unstable = (\n props: BaseComboboxProps,\n ref: React.Ref<HTMLInputElement>,\n): BaseComboboxState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n const {\n listboxRef: activeDescendantListboxRef,\n activeParentRef,\n controller: activeDescendantController,\n } = useActiveDescendant<HTMLInputElement, HTMLDivElement>({\n matchOption: isComboboxOptionElement,\n });\n const comboboxInternalState = useComboboxBaseState({ ...props, editable: true, activeDescendantController });\n const { appearance: _appearance, size: _size, ...baseState } = comboboxInternalState;\n\n const { clearable, clearSelection, disabled, multiselect, open, selectedOptions, setOpen, value, hasFocus } =\n baseState;\n const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n const { disableAutoFocus = false, freeform, inlinePopup } = props;\n const comboId = useId('combobox-');\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['children'],\n });\n\n const triggerRef = React.useRef<HTMLInputElement>(null);\n\n const listbox = useListboxSlot(props.listbox, useMergedRefs(comboboxPopupRef, activeDescendantListboxRef), {\n state: comboboxInternalState,\n triggerRef,\n defaultProps: {\n children: props.children,\n disableAutoFocus,\n },\n });\n\n const triggerSlot = useInputTriggerSlot(props.input ?? {}, useMergedRefs(triggerRef, activeParentRef, ref), {\n state: comboboxInternalState,\n freeform,\n defaultProps: {\n type: 'text',\n value: value ?? '',\n 'aria-controls': open ? listbox?.id : undefined,\n ...triggerNativeProps,\n },\n activeDescendantController,\n });\n\n const rootSlot = slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !inlinePopup && open ? listbox?.id : undefined,\n ...rootNativeProps,\n },\n elementType: 'div',\n });\n rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n const showClearIcon = selectedOptions.length > 0 && !disabled && clearable && !multiselect;\n const state: BaseComboboxState = {\n components: { root: 'div', input: 'input', expandIcon: 'span', listbox: Listbox, clearIcon: 'span' },\n root: rootSlot,\n input: triggerSlot,\n listbox: open \|\| hasFocus ? listbox : undefined,\n clearIcon: slot.optional(props.clearIcon, {\n defaultProps: {\n 'aria-hidden': 'true',\n },\n elementType: 'span',\n renderByDefault: true,\n }),\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n defaultProps: {\n 'aria-disabled': disabled ? 'true' : undefined,\n 'aria-expanded': open,\n role: 'button',\n },\n elementType: 'span',\n }),\n showClearIcon,\n activeDescendantController,\n ...baseState,\n };\n\n const { targetDocument } = useFluent();\n\n useOnClickOutside({\n element: targetDocument,\n callback: event => setOpen(event as unknown as ComboboxOpenEvents, false),\n refs: [triggerRef, comboboxPopupRef, comboboxTargetRef],\n disabled: !open,\n });\n\n / handle open/close + focus change when clicking expandIcon /\n const { onMouseDown: onIconMouseDown } = state.expandIcon \|\| {};\n\n const onExpandIconMouseDown = useEventCallback(\n // eslint-disable-next-line react-hooks/refs\n mergeCallbacks(onIconMouseDown, (event: React.MouseEvent<HTMLSpanElement>) => {\n event.preventDefault();\n state.setOpen(event, !state.open);\n triggerRef.current?.focus();\n }),\n );\n\n if (state.expandIcon) {\n state.expandIcon.onMouseDown = onExpandIconMouseDown;\n\n // If there is no explicit aria-label, calculate default accName attribute for expandIcon button,\n // using the following steps:\n // 1. If there is an aria-label, it is \"Open [aria-label]\"\n // 2. If there is an aria-labelledby, it is \"Open [aria-labelledby target]\" (using aria-labelledby + ids)\n // 3. If there is no aria-label/ledby attr, it falls back to \"Open\"\n // We can't fall back to a label/htmlFor name because of https://github.com/w3c/accname/issues/179\n const hasExpandLabel = state.expandIcon['aria-label'] \|\| state.expandIcon['aria-labelledby'];\n const defaultOpenString = 'Open'; // this is english-only since it is the fallback\n if (!hasExpandLabel) {\n if (props['aria-labelledby']) {\n const chevronId = state.expandIcon.id ?? `${comboId}-chevron`;\n const chevronLabelledBy = `${chevronId} ${state.input['aria-labelledby']}`;\n\n state.expandIcon['aria-label'] = defaultOpenString;\n state.expandIcon.id = chevronId;\n state.expandIcon['aria-labelledby'] = chevronLabelledBy;\n } else if (props['aria-label']) {\n state.expandIcon['aria-label'] = `${defaultOpenString} ${props['aria-label']}`;\n } else {\n state.expandIcon['aria-label'] = defaultOpenString;\n }\n }\n }\n\n const onClearIconMouseDown = useEventCallback(\n mergeCallbacks(state.clearIcon?.onMouseDown, (ev: React.MouseEvent<HTMLSpanElement>) => {\n ev.preventDefault();\n }),\n );\n const onClearIconClick = useEventCallback(\n mergeCallbacks(state.clearIcon?.onClick, (ev: React.MouseEvent<HTMLSpanElement>) => {\n clearSelection(ev);\n }),\n );\n\n if (state.clearIcon) {\n state.clearIcon.onMouseDown = onClearIconMouseDown;\n state.clearIcon.onClick = onClearIconClick;\n }\n\n // Heads up! We don't support \"clearable\" in multiselect mode, so we should never display a slot\n if (multiselect) {\n state.clearIcon = undefined;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- \"process.env\" does not change in runtime\n React.useEffect(() => {\n if (clearable && multiselect) {\n // eslint-disable-next-line no-console\n console.error(`[@fluentui/react-combobox] \"clearable\" prop is not supported in multiselect mode.`);\n }\n }, [clearable, multiselect]);\n }\n\n return state;\n};\n\n/\n Create the state required to render Combobox.\n \n The returned state can be modified with hooks such as useComboboxStyles_unstable,\n * before being passed to renderCombobox_unstable.\n \n @param props - props from this instance of Combobox\n * @param ref - reference to root HTMLElement of Combobox\n */\nexport const useCombobox_unstable = (props: ComboboxProps, ref: React.Ref<HTMLInputElement>): ComboboxState => {\n const fieldContext = useFieldContext_unstable();\n const { appearance = 'outline', size = fieldContext?.size ?? 'medium', ...baseProps } = props;\n const baseState = useComboboxBase_unstable(baseProps, ref);\n\n if (baseState.clearIcon) {\n baseState.clearIcon.children ??= <DismissIcon />;\n }\n\n if (baseState.expandIcon) {\n baseState.expandIcon.children ??= <ChevronDownIcon />;\n }\n\n return {\n ...baseState,\n appearance,\n size,\n };\n};\n"],"names":["React","useActiveDescendant","useFieldContext_unstable","useFieldControlProps_unstable","ChevronDownRegular","ChevronDownIcon","DismissRegular","DismissIcon","getPartitionedNativeProps","mergeCallbacks","useEventCallback","useId","useMergedRefs","slot","useOnClickOutside","useFluent_unstable","useFluent","useComboboxBaseState","useComboboxPositioning","Listbox","useListboxSlot","useInputTriggerSlot","isComboboxOptionElement","useComboboxBase_unstable","props","ref","state","supportsLabelFor","supportsRequired","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","comboboxInternalState","editable","appearance","_appearance","size","_size","baseState","clearable","clearSelection","disabled","multiselect","open","selectedOptions","setOpen","value","hasFocus","comboboxPopupRef","comboboxTargetRef","disableAutoFocus","freeform","inlinePopup","comboId","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","triggerRef","useRef","listbox","defaultProps","children","triggerSlot","input","type","id","undefined","rootSlot","always","elementType","showClearIcon","length","components","expandIcon","clearIcon","optional","renderByDefault","role","targetDocument","element","callback","event","refs","onMouseDown","onIconMouseDown","onExpandIconMouseDown","preventDefault","current","focus","hasExpandLabel","defaultOpenString","chevronId","chevronLabelledBy","onClearIconMouseDown","ev","onClearIconClick","onClick","process","env","NODE_ENV","useEffect","console","error","useCombobox_unstable","fieldContext","baseProps"],"mappings":"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"}

package/lib/components/Dropdown/useDropdown.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use client';
 import * as React from 'react';
-import { useFieldControlProps_unstable } from '@fluentui/react-field';
+import { useFieldContext_unstable, useFieldControlProps_unstable } from '@fluentui/react-field';
 import { useActiveDescendant } from '@fluentui/react-aria';
 import { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
@@ -149,7 +149,9 @@ import { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';
  * @param props - props from this instance of Dropdown
  * @param ref - reference to root HTMLElement of Dropdown
  */ export const useDropdown_unstable = (props, ref)=>{
-    const { appearance = 'outline', size = 'medium', ...baseProps } = props;
+    const fieldContext = useFieldContext_unstable();
+    var _fieldContext_size;
+    const { appearance = 'outline', size = (_fieldContext_size = fieldContext === null || fieldContext === void 0 ? void 0 : fieldContext.size) !== null && _fieldContext_size !== void 0 ? _fieldContext_size : 'medium', ...baseProps } = props;
     const baseState = useDropdownBase_unstable(baseProps, ref);
     if (baseState.clearButton) {
         var _baseState_clearButton;

package/lib/components/Dropdown/useDropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Dropdown/useDropdown.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useMergedRefs,\n slot,\n useEventCallback,\n useOnClickOutside,\n} from '@fluentui/react-utilities';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { DropdownBaseProps, DropdownBaseState, DropdownProps, DropdownState } from './Dropdown.types';\nimport { useListboxSlot } from '../../utils/useListboxSlot';\nimport { useButtonTriggerSlot } from './useButtonTriggerSlot';\nimport type { ComboboxOpenEvents } from '../Combobox/Combobox.types';\nimport { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';\n\n/*\n Create the base state required to render Dropdown, without design-only props.\n \n @param props - props from this instance of Dropdown (without appearance and size)\n * @param ref - reference to root HTMLButtonElement of Dropdown\n /\nexport const useDropdownBase_unstable = (\n props: DropdownBaseProps,\n ref: React.Ref<HTMLButtonElement>,\n): DropdownBaseState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true });\n const {\n listboxRef: activeDescendantListboxRef,\n activeParentRef,\n controller: activeDescendantController,\n } = useActiveDescendant<HTMLButtonElement, HTMLDivElement>({\n matchOption: isComboboxOptionElement,\n });\n\n const dropdownInternalState = useComboboxBaseState({ ...props, activeDescendantController, freeform: false });\n const { appearance: _appearance, size: _size, freeform: _freeform, ...baseState } = dropdownInternalState;\n const { clearable, clearSelection, disabled, hasFocus, multiselect, open, selectedOptions, setOpen } = baseState;\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'button',\n excludedPropNames: ['children'],\n });\n\n const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n\n const triggerRef = React.useRef<HTMLButtonElement>(null);\n const listbox = useListboxSlot(props.listbox, useMergedRefs(comboboxPopupRef, activeDescendantListboxRef), {\n state: dropdownInternalState,\n triggerRef,\n defaultProps: {\n children: props.children,\n },\n });\n\n const { targetDocument } = useFluent();\n\n useOnClickOutside({\n element: targetDocument,\n callback: event => setOpen(event as unknown as ComboboxOpenEvents, false),\n refs: [triggerRef, comboboxPopupRef, comboboxTargetRef],\n disabled: !open,\n });\n\n const trigger = useButtonTriggerSlot(props.button ?? {}, useMergedRefs(triggerRef, activeParentRef, ref), {\n state: dropdownInternalState,\n defaultProps: {\n type: 'button',\n // tabster navigation breaks if the button is disabled and tabIndex is 0\n tabIndex: triggerNativeProps.disabled ? undefined : 0,\n children: baseState.value \|\| props.placeholder,\n 'aria-controls': open ? listbox?.id : undefined,\n ...triggerNativeProps,\n },\n activeDescendantController,\n });\n\n const rootSlot = slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !props.inlinePopup && open ? listbox?.id : undefined,\n children: props.children,\n ...rootNativeProps,\n },\n elementType: 'div',\n });\n rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n const showClearButton = selectedOptions.length > 0 && !disabled && clearable && !multiselect;\n const state: DropdownBaseState = {\n components: { root: 'div', button: 'button', clearButton: 'button', expandIcon: 'span', listbox: Listbox },\n root: rootSlot,\n button: trigger,\n listbox: open \|\| hasFocus ? listbox : undefined,\n clearButton: slot.optional(props.clearButton, {\n defaultProps: {\n 'aria-label': 'Clear selection',\n // Safari doesn't allow to focus an element with this\n // when the element is not visible (display: none) we need to remove it to avoid tabster issues\n tabIndex: showClearButton ? 0 : undefined,\n type: 'button',\n },\n elementType: 'button',\n renderByDefault: true,\n }),\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n elementType: 'span',\n }),\n placeholderVisible: !baseState.value && !!props.placeholder,\n showClearButton,\n activeDescendantController,\n ...baseState,\n };\n\n const onClearButtonClick = useEventCallback(\n // eslint-disable-next-line react-hooks/refs\n mergeCallbacks(state.clearButton?.onClick, (ev: React.MouseEvent<HTMLButtonElement>) => {\n clearSelection(ev);\n triggerRef.current?.focus();\n }),\n );\n\n if (state.clearButton) {\n state.clearButton.onClick = onClearButtonClick;\n }\n\n // Heads up! We don't support \"clearable\" in multiselect mode, so we should never display a slot\n if (multiselect) {\n state.clearButton = undefined;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- \"process.env\" does not change in runtime\n React.useEffect(() => {\n if (clearable && multiselect) {\n // eslint-disable-next-line no-console\n console.error(`[@fluentui/react-combobox] \"clearable\" prop is not supported in multiselect mode.`);\n }\n }, [clearable, multiselect]);\n }\n\n return state;\n};\n\n/\n Create the state required to render Dropdown.\n \n The returned state can be modified with hooks such as useDropdownStyles_unstable,\n * before being passed to renderDropdown_unstable.\n \n @param props - props from this instance of Dropdown\n * @param ref - reference to root HTMLElement of Dropdown\n */\nexport const useDropdown_unstable = (props: DropdownProps, ref: React.Ref<HTMLButtonElement>): DropdownState => {\n const { appearance = 'outline', size = 'medium', ...baseProps } = props;\n const baseState = useDropdownBase_unstable(baseProps, ref);\n\n if (baseState.clearButton) {\n baseState.clearButton.children ??= <DismissIcon />;\n }\n\n if (baseState.expandIcon) {\n baseState.expandIcon.children ??= <ChevronDownIcon />;\n }\n\n return {\n ...baseState,\n appearance,\n size,\n };\n};\n"],"names":["React","useFieldControlProps_unstable","useActiveDescendant","ChevronDownRegular","ChevronDownIcon","DismissRegular","DismissIcon","useFluent_unstable","useFluent","getPartitionedNativeProps","mergeCallbacks","useMergedRefs","slot","useEventCallback","useOnClickOutside","useComboboxBaseState","useComboboxPositioning","Listbox","useListboxSlot","useButtonTriggerSlot","isComboboxOptionElement","useDropdownBase_unstable","props","ref","state","supportsLabelFor","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","dropdownInternalState","freeform","appearance","_appearance","size","_size","_freeform","baseState","clearable","clearSelection","disabled","hasFocus","multiselect","open","selectedOptions","setOpen","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","comboboxPopupRef","comboboxTargetRef","triggerRef","useRef","listbox","defaultProps","children","targetDocument","element","callback","event","refs","trigger","button","type","tabIndex","undefined","value","placeholder","id","rootSlot","always","inlinePopup","elementType","showClearButton","length","components","clearButton","expandIcon","optional","renderByDefault","placeholderVisible","onClearButtonClick","onClick","ev","current","focus","process","env","NODE_ENV","useEffect","console","error","useDropdown_unstable","baseProps"],"mappings":"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"}
1	+ {"version":3,"sources":["../src/components/Dropdown/useDropdown.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldContext_unstable, useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useMergedRefs,\n slot,\n useEventCallback,\n useOnClickOutside,\n} from '@fluentui/react-utilities';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { DropdownBaseProps, DropdownBaseState, DropdownProps, DropdownState } from './Dropdown.types';\nimport { useListboxSlot } from '../../utils/useListboxSlot';\nimport { useButtonTriggerSlot } from './useButtonTriggerSlot';\nimport type { ComboboxOpenEvents } from '../Combobox/Combobox.types';\nimport { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';\n\n/*\n Create the base state required to render Dropdown, without design-only props.\n \n @param props - props from this instance of Dropdown (without appearance and size)\n * @param ref - reference to root HTMLButtonElement of Dropdown\n /\nexport const useDropdownBase_unstable = (\n props: DropdownBaseProps,\n ref: React.Ref<HTMLButtonElement>,\n): DropdownBaseState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true });\n const {\n listboxRef: activeDescendantListboxRef,\n activeParentRef,\n controller: activeDescendantController,\n } = useActiveDescendant<HTMLButtonElement, HTMLDivElement>({\n matchOption: isComboboxOptionElement,\n });\n\n const dropdownInternalState = useComboboxBaseState({ ...props, activeDescendantController, freeform: false });\n const { appearance: _appearance, size: _size, freeform: _freeform, ...baseState } = dropdownInternalState;\n const { clearable, clearSelection, disabled, hasFocus, multiselect, open, selectedOptions, setOpen } = baseState;\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'button',\n excludedPropNames: ['children'],\n });\n\n const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n\n const triggerRef = React.useRef<HTMLButtonElement>(null);\n const listbox = useListboxSlot(props.listbox, useMergedRefs(comboboxPopupRef, activeDescendantListboxRef), {\n state: dropdownInternalState,\n triggerRef,\n defaultProps: {\n children: props.children,\n },\n });\n\n const { targetDocument } = useFluent();\n\n useOnClickOutside({\n element: targetDocument,\n callback: event => setOpen(event as unknown as ComboboxOpenEvents, false),\n refs: [triggerRef, comboboxPopupRef, comboboxTargetRef],\n disabled: !open,\n });\n\n const trigger = useButtonTriggerSlot(props.button ?? {}, useMergedRefs(triggerRef, activeParentRef, ref), {\n state: dropdownInternalState,\n defaultProps: {\n type: 'button',\n // tabster navigation breaks if the button is disabled and tabIndex is 0\n tabIndex: triggerNativeProps.disabled ? undefined : 0,\n children: baseState.value \|\| props.placeholder,\n 'aria-controls': open ? listbox?.id : undefined,\n ...triggerNativeProps,\n },\n activeDescendantController,\n });\n\n const rootSlot = slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !props.inlinePopup && open ? listbox?.id : undefined,\n children: props.children,\n ...rootNativeProps,\n },\n elementType: 'div',\n });\n rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n const showClearButton = selectedOptions.length > 0 && !disabled && clearable && !multiselect;\n const state: DropdownBaseState = {\n components: { root: 'div', button: 'button', clearButton: 'button', expandIcon: 'span', listbox: Listbox },\n root: rootSlot,\n button: trigger,\n listbox: open \|\| hasFocus ? listbox : undefined,\n clearButton: slot.optional(props.clearButton, {\n defaultProps: {\n 'aria-label': 'Clear selection',\n // Safari doesn't allow to focus an element with this\n // when the element is not visible (display: none) we need to remove it to avoid tabster issues\n tabIndex: showClearButton ? 0 : undefined,\n type: 'button',\n },\n elementType: 'button',\n renderByDefault: true,\n }),\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n elementType: 'span',\n }),\n placeholderVisible: !baseState.value && !!props.placeholder,\n showClearButton,\n activeDescendantController,\n ...baseState,\n };\n\n const onClearButtonClick = useEventCallback(\n // eslint-disable-next-line react-hooks/refs\n mergeCallbacks(state.clearButton?.onClick, (ev: React.MouseEvent<HTMLButtonElement>) => {\n clearSelection(ev);\n triggerRef.current?.focus();\n }),\n );\n\n if (state.clearButton) {\n state.clearButton.onClick = onClearButtonClick;\n }\n\n // Heads up! We don't support \"clearable\" in multiselect mode, so we should never display a slot\n if (multiselect) {\n state.clearButton = undefined;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- \"process.env\" does not change in runtime\n React.useEffect(() => {\n if (clearable && multiselect) {\n // eslint-disable-next-line no-console\n console.error(`[@fluentui/react-combobox] \"clearable\" prop is not supported in multiselect mode.`);\n }\n }, [clearable, multiselect]);\n }\n\n return state;\n};\n\n/\n Create the state required to render Dropdown.\n \n The returned state can be modified with hooks such as useDropdownStyles_unstable,\n * before being passed to renderDropdown_unstable.\n \n @param props - props from this instance of Dropdown\n * @param ref - reference to root HTMLElement of Dropdown\n */\nexport const useDropdown_unstable = (props: DropdownProps, ref: React.Ref<HTMLButtonElement>): DropdownState => {\n const fieldContext = useFieldContext_unstable();\n const { appearance = 'outline', size = fieldContext?.size ?? 'medium', ...baseProps } = props;\n const baseState = useDropdownBase_unstable(baseProps, ref);\n\n if (baseState.clearButton) {\n baseState.clearButton.children ??= <DismissIcon />;\n }\n\n if (baseState.expandIcon) {\n baseState.expandIcon.children ??= <ChevronDownIcon />;\n }\n\n return {\n ...baseState,\n appearance,\n size,\n };\n};\n"],"names":["React","useFieldContext_unstable","useFieldControlProps_unstable","useActiveDescendant","ChevronDownRegular","ChevronDownIcon","DismissRegular","DismissIcon","useFluent_unstable","useFluent","getPartitionedNativeProps","mergeCallbacks","useMergedRefs","slot","useEventCallback","useOnClickOutside","useComboboxBaseState","useComboboxPositioning","Listbox","useListboxSlot","useButtonTriggerSlot","isComboboxOptionElement","useDropdownBase_unstable","props","ref","state","supportsLabelFor","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","dropdownInternalState","freeform","appearance","_appearance","size","_size","_freeform","baseState","clearable","clearSelection","disabled","hasFocus","multiselect","open","selectedOptions","setOpen","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","comboboxPopupRef","comboboxTargetRef","triggerRef","useRef","listbox","defaultProps","children","targetDocument","element","callback","event","refs","trigger","button","type","tabIndex","undefined","value","placeholder","id","rootSlot","always","inlinePopup","elementType","showClearButton","length","components","clearButton","expandIcon","optional","renderByDefault","placeholderVisible","onClearButtonClick","onClick","ev","current","focus","process","env","NODE_ENV","useEffect","console","error","useDropdown_unstable","fieldContext","baseProps"],"mappings":"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"}

package/lib-commonjs/components/Combobox/useCombobox.js CHANGED Viewed

@@ -190,7 +190,9 @@ const useComboboxBase_unstable = (props, ref)=>{
     return state;
 };
 const useCombobox_unstable = (props, ref)=>{
-    const { appearance = 'outline', size = 'medium', ...baseProps } = props;
+    const fieldContext = (0, _reactfield.useFieldContext_unstable)();
+    var _fieldContext_size;
+    const { appearance = 'outline', size = (_fieldContext_size = fieldContext === null || fieldContext === void 0 ? void 0 : fieldContext.size) !== null && _fieldContext_size !== void 0 ? _fieldContext_size : 'medium', ...baseProps } = props;
     const baseState = useComboboxBase_unstable(baseProps, ref);
     if (baseState.clearIcon) {
         var _baseState_clearIcon;

package/lib-commonjs/components/Combobox/useCombobox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Combobox/useCombobox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useEventCallback,\n useId,\n useMergedRefs,\n slot,\n useOnClickOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { Listbox } from '../Listbox/Listbox';\nimport type {\n BaseComboboxProps,\n BaseComboboxState,\n ComboboxOpenEvents,\n ComboboxProps,\n ComboboxState,\n} from './Combobox.types';\nimport { useListboxSlot } from '../../utils/useListboxSlot';\nimport { useInputTriggerSlot } from './useInputTriggerSlot';\nimport { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';\n\n/*\n Create the base state required to render Combobox, without design-only props.\n \n @param props - props from this instance of Combobox (without appearance and size)\n * @param ref - reference to root HTMLInputElement of Combobox\n /\nexport const useComboboxBase_unstable = (\n props: BaseComboboxProps,\n ref: React.Ref<HTMLInputElement>,\n): BaseComboboxState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n const {\n listboxRef: activeDescendantListboxRef,\n activeParentRef,\n controller: activeDescendantController,\n } = useActiveDescendant<HTMLInputElement, HTMLDivElement>({\n matchOption: isComboboxOptionElement,\n });\n const comboboxInternalState = useComboboxBaseState({ ...props, editable: true, activeDescendantController });\n const { appearance: _appearance, size: _size, ...baseState } = comboboxInternalState;\n\n const { clearable, clearSelection, disabled, multiselect, open, selectedOptions, setOpen, value, hasFocus } =\n baseState;\n const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n const { disableAutoFocus = false, freeform, inlinePopup } = props;\n const comboId = useId('combobox-');\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['children'],\n });\n\n const triggerRef = React.useRef<HTMLInputElement>(null);\n\n const listbox = useListboxSlot(props.listbox, useMergedRefs(comboboxPopupRef, activeDescendantListboxRef), {\n state: comboboxInternalState,\n triggerRef,\n defaultProps: {\n children: props.children,\n disableAutoFocus,\n },\n });\n\n const triggerSlot = useInputTriggerSlot(props.input ?? {}, useMergedRefs(triggerRef, activeParentRef, ref), {\n state: comboboxInternalState,\n freeform,\n defaultProps: {\n type: 'text',\n value: value ?? '',\n 'aria-controls': open ? listbox?.id : undefined,\n ...triggerNativeProps,\n },\n activeDescendantController,\n });\n\n const rootSlot = slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !inlinePopup && open ? listbox?.id : undefined,\n ...rootNativeProps,\n },\n elementType: 'div',\n });\n rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n const showClearIcon = selectedOptions.length > 0 && !disabled && clearable && !multiselect;\n const state: BaseComboboxState = {\n components: { root: 'div', input: 'input', expandIcon: 'span', listbox: Listbox, clearIcon: 'span' },\n root: rootSlot,\n input: triggerSlot,\n listbox: open \|\| hasFocus ? listbox : undefined,\n clearIcon: slot.optional(props.clearIcon, {\n defaultProps: {\n 'aria-hidden': 'true',\n },\n elementType: 'span',\n renderByDefault: true,\n }),\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n defaultProps: {\n 'aria-disabled': disabled ? 'true' : undefined,\n 'aria-expanded': open,\n role: 'button',\n },\n elementType: 'span',\n }),\n showClearIcon,\n activeDescendantController,\n ...baseState,\n };\n\n const { targetDocument } = useFluent();\n\n useOnClickOutside({\n element: targetDocument,\n callback: event => setOpen(event as unknown as ComboboxOpenEvents, false),\n refs: [triggerRef, comboboxPopupRef, comboboxTargetRef],\n disabled: !open,\n });\n\n / handle open/close + focus change when clicking expandIcon /\n const { onMouseDown: onIconMouseDown } = state.expandIcon \|\| {};\n\n const onExpandIconMouseDown = useEventCallback(\n // eslint-disable-next-line react-hooks/refs\n mergeCallbacks(onIconMouseDown, (event: React.MouseEvent<HTMLSpanElement>) => {\n event.preventDefault();\n state.setOpen(event, !state.open);\n triggerRef.current?.focus();\n }),\n );\n\n if (state.expandIcon) {\n state.expandIcon.onMouseDown = onExpandIconMouseDown;\n\n // If there is no explicit aria-label, calculate default accName attribute for expandIcon button,\n // using the following steps:\n // 1. If there is an aria-label, it is \"Open [aria-label]\"\n // 2. If there is an aria-labelledby, it is \"Open [aria-labelledby target]\" (using aria-labelledby + ids)\n // 3. If there is no aria-label/ledby attr, it falls back to \"Open\"\n // We can't fall back to a label/htmlFor name because of https://github.com/w3c/accname/issues/179\n const hasExpandLabel = state.expandIcon['aria-label'] \|\| state.expandIcon['aria-labelledby'];\n const defaultOpenString = 'Open'; // this is english-only since it is the fallback\n if (!hasExpandLabel) {\n if (props['aria-labelledby']) {\n const chevronId = state.expandIcon.id ?? `${comboId}-chevron`;\n const chevronLabelledBy = `${chevronId} ${state.input['aria-labelledby']}`;\n\n state.expandIcon['aria-label'] = defaultOpenString;\n state.expandIcon.id = chevronId;\n state.expandIcon['aria-labelledby'] = chevronLabelledBy;\n } else if (props['aria-label']) {\n state.expandIcon['aria-label'] = `${defaultOpenString} ${props['aria-label']}`;\n } else {\n state.expandIcon['aria-label'] = defaultOpenString;\n }\n }\n }\n\n const onClearIconMouseDown = useEventCallback(\n mergeCallbacks(state.clearIcon?.onMouseDown, (ev: React.MouseEvent<HTMLSpanElement>) => {\n ev.preventDefault();\n }),\n );\n const onClearIconClick = useEventCallback(\n mergeCallbacks(state.clearIcon?.onClick, (ev: React.MouseEvent<HTMLSpanElement>) => {\n clearSelection(ev);\n }),\n );\n\n if (state.clearIcon) {\n state.clearIcon.onMouseDown = onClearIconMouseDown;\n state.clearIcon.onClick = onClearIconClick;\n }\n\n // Heads up! We don't support \"clearable\" in multiselect mode, so we should never display a slot\n if (multiselect) {\n state.clearIcon = undefined;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- \"process.env\" does not change in runtime\n React.useEffect(() => {\n if (clearable && multiselect) {\n // eslint-disable-next-line no-console\n console.error(`[@fluentui/react-combobox] \"clearable\" prop is not supported in multiselect mode.`);\n }\n }, [clearable, multiselect]);\n }\n\n return state;\n};\n\n/\n Create the state required to render Combobox.\n \n The returned state can be modified with hooks such as useComboboxStyles_unstable,\n * before being passed to renderCombobox_unstable.\n \n @param props - props from this instance of Combobox\n * @param ref - reference to root HTMLElement of Combobox\n */\nexport const useCombobox_unstable = (props: ComboboxProps, ref: React.Ref<HTMLInputElement>): ComboboxState => {\n const { appearance = 'outline', size = 'medium', ...baseProps } = props;\n const baseState = useComboboxBase_unstable(baseProps, ref);\n\n if (baseState.clearIcon) {\n baseState.clearIcon.children ??= <DismissIcon />;\n }\n\n if (baseState.expandIcon) {\n baseState.expandIcon.children ??= <ChevronDownIcon />;\n }\n\n return {\n ...baseState,\n appearance,\n size,\n };\n};\n"],"names":["React","useActiveDescendant","useFieldControlProps_unstable","ChevronDownRegular","ChevronDownIcon","DismissRegular","DismissIcon","getPartitionedNativeProps","mergeCallbacks","useEventCallback","useId","useMergedRefs","slot","useOnClickOutside","useFluent_unstable","useFluent","useComboboxBaseState","useComboboxPositioning","Listbox","useListboxSlot","useInputTriggerSlot","isComboboxOptionElement","useComboboxBase_unstable","props","ref","state","supportsLabelFor","supportsRequired","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","comboboxInternalState","editable","appearance","_appearance","size","_size","baseState","clearable","clearSelection","disabled","multiselect","open","selectedOptions","setOpen","value","hasFocus","comboboxPopupRef","comboboxTargetRef","disableAutoFocus","freeform","inlinePopup","comboId","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","triggerRef","useRef","listbox","defaultProps","children","triggerSlot","input","type","id","undefined","rootSlot","always","elementType","showClearIcon","length","components","expandIcon","clearIcon","optional","renderByDefault","role","targetDocument","element","callback","event","refs","onMouseDown","onIconMouseDown","onExpandIconMouseDown","preventDefault","current","focus","hasExpandLabel","defaultOpenString","chevronId","chevronLabelledBy","onClearIconMouseDown","ev","onClearIconClick","onClick","process","env","NODE_ENV","useEffect","console","error","useCombobox_unstable","baseProps"],"mappings":"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"}
1	+ {"version":3,"sources":["../src/components/Combobox/useCombobox.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { useFieldContext_unstable, useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useEventCallback,\n useId,\n useMergedRefs,\n slot,\n useOnClickOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { Listbox } from '../Listbox/Listbox';\nimport type {\n BaseComboboxProps,\n BaseComboboxState,\n ComboboxOpenEvents,\n ComboboxProps,\n ComboboxState,\n} from './Combobox.types';\nimport { useListboxSlot } from '../../utils/useListboxSlot';\nimport { useInputTriggerSlot } from './useInputTriggerSlot';\nimport { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';\n\n/*\n Create the base state required to render Combobox, without design-only props.\n \n @param props - props from this instance of Combobox (without appearance and size)\n * @param ref - reference to root HTMLInputElement of Combobox\n /\nexport const useComboboxBase_unstable = (\n props: BaseComboboxProps,\n ref: React.Ref<HTMLInputElement>,\n): BaseComboboxState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true });\n const {\n listboxRef: activeDescendantListboxRef,\n activeParentRef,\n controller: activeDescendantController,\n } = useActiveDescendant<HTMLInputElement, HTMLDivElement>({\n matchOption: isComboboxOptionElement,\n });\n const comboboxInternalState = useComboboxBaseState({ ...props, editable: true, activeDescendantController });\n const { appearance: _appearance, size: _size, ...baseState } = comboboxInternalState;\n\n const { clearable, clearSelection, disabled, multiselect, open, selectedOptions, setOpen, value, hasFocus } =\n baseState;\n const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n const { disableAutoFocus = false, freeform, inlinePopup } = props;\n const comboId = useId('combobox-');\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['children'],\n });\n\n const triggerRef = React.useRef<HTMLInputElement>(null);\n\n const listbox = useListboxSlot(props.listbox, useMergedRefs(comboboxPopupRef, activeDescendantListboxRef), {\n state: comboboxInternalState,\n triggerRef,\n defaultProps: {\n children: props.children,\n disableAutoFocus,\n },\n });\n\n const triggerSlot = useInputTriggerSlot(props.input ?? {}, useMergedRefs(triggerRef, activeParentRef, ref), {\n state: comboboxInternalState,\n freeform,\n defaultProps: {\n type: 'text',\n value: value ?? '',\n 'aria-controls': open ? listbox?.id : undefined,\n ...triggerNativeProps,\n },\n activeDescendantController,\n });\n\n const rootSlot = slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !inlinePopup && open ? listbox?.id : undefined,\n ...rootNativeProps,\n },\n elementType: 'div',\n });\n rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n const showClearIcon = selectedOptions.length > 0 && !disabled && clearable && !multiselect;\n const state: BaseComboboxState = {\n components: { root: 'div', input: 'input', expandIcon: 'span', listbox: Listbox, clearIcon: 'span' },\n root: rootSlot,\n input: triggerSlot,\n listbox: open \|\| hasFocus ? listbox : undefined,\n clearIcon: slot.optional(props.clearIcon, {\n defaultProps: {\n 'aria-hidden': 'true',\n },\n elementType: 'span',\n renderByDefault: true,\n }),\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n defaultProps: {\n 'aria-disabled': disabled ? 'true' : undefined,\n 'aria-expanded': open,\n role: 'button',\n },\n elementType: 'span',\n }),\n showClearIcon,\n activeDescendantController,\n ...baseState,\n };\n\n const { targetDocument } = useFluent();\n\n useOnClickOutside({\n element: targetDocument,\n callback: event => setOpen(event as unknown as ComboboxOpenEvents, false),\n refs: [triggerRef, comboboxPopupRef, comboboxTargetRef],\n disabled: !open,\n });\n\n / handle open/close + focus change when clicking expandIcon /\n const { onMouseDown: onIconMouseDown } = state.expandIcon \|\| {};\n\n const onExpandIconMouseDown = useEventCallback(\n // eslint-disable-next-line react-hooks/refs\n mergeCallbacks(onIconMouseDown, (event: React.MouseEvent<HTMLSpanElement>) => {\n event.preventDefault();\n state.setOpen(event, !state.open);\n triggerRef.current?.focus();\n }),\n );\n\n if (state.expandIcon) {\n state.expandIcon.onMouseDown = onExpandIconMouseDown;\n\n // If there is no explicit aria-label, calculate default accName attribute for expandIcon button,\n // using the following steps:\n // 1. If there is an aria-label, it is \"Open [aria-label]\"\n // 2. If there is an aria-labelledby, it is \"Open [aria-labelledby target]\" (using aria-labelledby + ids)\n // 3. If there is no aria-label/ledby attr, it falls back to \"Open\"\n // We can't fall back to a label/htmlFor name because of https://github.com/w3c/accname/issues/179\n const hasExpandLabel = state.expandIcon['aria-label'] \|\| state.expandIcon['aria-labelledby'];\n const defaultOpenString = 'Open'; // this is english-only since it is the fallback\n if (!hasExpandLabel) {\n if (props['aria-labelledby']) {\n const chevronId = state.expandIcon.id ?? `${comboId}-chevron`;\n const chevronLabelledBy = `${chevronId} ${state.input['aria-labelledby']}`;\n\n state.expandIcon['aria-label'] = defaultOpenString;\n state.expandIcon.id = chevronId;\n state.expandIcon['aria-labelledby'] = chevronLabelledBy;\n } else if (props['aria-label']) {\n state.expandIcon['aria-label'] = `${defaultOpenString} ${props['aria-label']}`;\n } else {\n state.expandIcon['aria-label'] = defaultOpenString;\n }\n }\n }\n\n const onClearIconMouseDown = useEventCallback(\n mergeCallbacks(state.clearIcon?.onMouseDown, (ev: React.MouseEvent<HTMLSpanElement>) => {\n ev.preventDefault();\n }),\n );\n const onClearIconClick = useEventCallback(\n mergeCallbacks(state.clearIcon?.onClick, (ev: React.MouseEvent<HTMLSpanElement>) => {\n clearSelection(ev);\n }),\n );\n\n if (state.clearIcon) {\n state.clearIcon.onMouseDown = onClearIconMouseDown;\n state.clearIcon.onClick = onClearIconClick;\n }\n\n // Heads up! We don't support \"clearable\" in multiselect mode, so we should never display a slot\n if (multiselect) {\n state.clearIcon = undefined;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- \"process.env\" does not change in runtime\n React.useEffect(() => {\n if (clearable && multiselect) {\n // eslint-disable-next-line no-console\n console.error(`[@fluentui/react-combobox] \"clearable\" prop is not supported in multiselect mode.`);\n }\n }, [clearable, multiselect]);\n }\n\n return state;\n};\n\n/\n Create the state required to render Combobox.\n \n The returned state can be modified with hooks such as useComboboxStyles_unstable,\n * before being passed to renderCombobox_unstable.\n \n @param props - props from this instance of Combobox\n * @param ref - reference to root HTMLElement of Combobox\n */\nexport const useCombobox_unstable = (props: ComboboxProps, ref: React.Ref<HTMLInputElement>): ComboboxState => {\n const fieldContext = useFieldContext_unstable();\n const { appearance = 'outline', size = fieldContext?.size ?? 'medium', ...baseProps } = props;\n const baseState = useComboboxBase_unstable(baseProps, ref);\n\n if (baseState.clearIcon) {\n baseState.clearIcon.children ??= <DismissIcon />;\n }\n\n if (baseState.expandIcon) {\n baseState.expandIcon.children ??= <ChevronDownIcon />;\n }\n\n return {\n ...baseState,\n appearance,\n size,\n };\n};\n"],"names":["React","useActiveDescendant","useFieldContext_unstable","useFieldControlProps_unstable","ChevronDownRegular","ChevronDownIcon","DismissRegular","DismissIcon","getPartitionedNativeProps","mergeCallbacks","useEventCallback","useId","useMergedRefs","slot","useOnClickOutside","useFluent_unstable","useFluent","useComboboxBaseState","useComboboxPositioning","Listbox","useListboxSlot","useInputTriggerSlot","isComboboxOptionElement","useComboboxBase_unstable","props","ref","state","supportsLabelFor","supportsRequired","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","comboboxInternalState","editable","appearance","_appearance","size","_size","baseState","clearable","clearSelection","disabled","multiselect","open","selectedOptions","setOpen","value","hasFocus","comboboxPopupRef","comboboxTargetRef","disableAutoFocus","freeform","inlinePopup","comboId","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","triggerRef","useRef","listbox","defaultProps","children","triggerSlot","input","type","id","undefined","rootSlot","always","elementType","showClearIcon","length","components","expandIcon","clearIcon","optional","renderByDefault","role","targetDocument","element","callback","event","refs","onMouseDown","onIconMouseDown","onExpandIconMouseDown","preventDefault","current","focus","hasExpandLabel","defaultOpenString","chevronId","chevronLabelledBy","onClearIconMouseDown","ev","onClearIconClick","onClick","process","env","NODE_ENV","useEffect","console","error","useCombobox_unstable","fieldContext","baseProps"],"mappings":"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"}

package/lib-commonjs/components/Dropdown/useDropdown.js CHANGED Viewed

@@ -154,7 +154,9 @@ const useDropdownBase_unstable = (props, ref)=>{
     return state;
 };
 const useDropdown_unstable = (props, ref)=>{
-    const { appearance = 'outline', size = 'medium', ...baseProps } = props;
+    const fieldContext = (0, _reactfield.useFieldContext_unstable)();
+    var _fieldContext_size;
+    const { appearance = 'outline', size = (_fieldContext_size = fieldContext === null || fieldContext === void 0 ? void 0 : fieldContext.size) !== null && _fieldContext_size !== void 0 ? _fieldContext_size : 'medium', ...baseProps } = props;
     const baseState = useDropdownBase_unstable(baseProps, ref);
     if (baseState.clearButton) {
         var _baseState_clearButton;

package/lib-commonjs/components/Dropdown/useDropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Dropdown/useDropdown.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useMergedRefs,\n slot,\n useEventCallback,\n useOnClickOutside,\n} from '@fluentui/react-utilities';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { DropdownBaseProps, DropdownBaseState, DropdownProps, DropdownState } from './Dropdown.types';\nimport { useListboxSlot } from '../../utils/useListboxSlot';\nimport { useButtonTriggerSlot } from './useButtonTriggerSlot';\nimport type { ComboboxOpenEvents } from '../Combobox/Combobox.types';\nimport { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';\n\n/*\n Create the base state required to render Dropdown, without design-only props.\n \n @param props - props from this instance of Dropdown (without appearance and size)\n * @param ref - reference to root HTMLButtonElement of Dropdown\n /\nexport const useDropdownBase_unstable = (\n props: DropdownBaseProps,\n ref: React.Ref<HTMLButtonElement>,\n): DropdownBaseState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true });\n const {\n listboxRef: activeDescendantListboxRef,\n activeParentRef,\n controller: activeDescendantController,\n } = useActiveDescendant<HTMLButtonElement, HTMLDivElement>({\n matchOption: isComboboxOptionElement,\n });\n\n const dropdownInternalState = useComboboxBaseState({ ...props, activeDescendantController, freeform: false });\n const { appearance: _appearance, size: _size, freeform: _freeform, ...baseState } = dropdownInternalState;\n const { clearable, clearSelection, disabled, hasFocus, multiselect, open, selectedOptions, setOpen } = baseState;\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'button',\n excludedPropNames: ['children'],\n });\n\n const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n\n const triggerRef = React.useRef<HTMLButtonElement>(null);\n const listbox = useListboxSlot(props.listbox, useMergedRefs(comboboxPopupRef, activeDescendantListboxRef), {\n state: dropdownInternalState,\n triggerRef,\n defaultProps: {\n children: props.children,\n },\n });\n\n const { targetDocument } = useFluent();\n\n useOnClickOutside({\n element: targetDocument,\n callback: event => setOpen(event as unknown as ComboboxOpenEvents, false),\n refs: [triggerRef, comboboxPopupRef, comboboxTargetRef],\n disabled: !open,\n });\n\n const trigger = useButtonTriggerSlot(props.button ?? {}, useMergedRefs(triggerRef, activeParentRef, ref), {\n state: dropdownInternalState,\n defaultProps: {\n type: 'button',\n // tabster navigation breaks if the button is disabled and tabIndex is 0\n tabIndex: triggerNativeProps.disabled ? undefined : 0,\n children: baseState.value \|\| props.placeholder,\n 'aria-controls': open ? listbox?.id : undefined,\n ...triggerNativeProps,\n },\n activeDescendantController,\n });\n\n const rootSlot = slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !props.inlinePopup && open ? listbox?.id : undefined,\n children: props.children,\n ...rootNativeProps,\n },\n elementType: 'div',\n });\n rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n const showClearButton = selectedOptions.length > 0 && !disabled && clearable && !multiselect;\n const state: DropdownBaseState = {\n components: { root: 'div', button: 'button', clearButton: 'button', expandIcon: 'span', listbox: Listbox },\n root: rootSlot,\n button: trigger,\n listbox: open \|\| hasFocus ? listbox : undefined,\n clearButton: slot.optional(props.clearButton, {\n defaultProps: {\n 'aria-label': 'Clear selection',\n // Safari doesn't allow to focus an element with this\n // when the element is not visible (display: none) we need to remove it to avoid tabster issues\n tabIndex: showClearButton ? 0 : undefined,\n type: 'button',\n },\n elementType: 'button',\n renderByDefault: true,\n }),\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n elementType: 'span',\n }),\n placeholderVisible: !baseState.value && !!props.placeholder,\n showClearButton,\n activeDescendantController,\n ...baseState,\n };\n\n const onClearButtonClick = useEventCallback(\n // eslint-disable-next-line react-hooks/refs\n mergeCallbacks(state.clearButton?.onClick, (ev: React.MouseEvent<HTMLButtonElement>) => {\n clearSelection(ev);\n triggerRef.current?.focus();\n }),\n );\n\n if (state.clearButton) {\n state.clearButton.onClick = onClearButtonClick;\n }\n\n // Heads up! We don't support \"clearable\" in multiselect mode, so we should never display a slot\n if (multiselect) {\n state.clearButton = undefined;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- \"process.env\" does not change in runtime\n React.useEffect(() => {\n if (clearable && multiselect) {\n // eslint-disable-next-line no-console\n console.error(`[@fluentui/react-combobox] \"clearable\" prop is not supported in multiselect mode.`);\n }\n }, [clearable, multiselect]);\n }\n\n return state;\n};\n\n/\n Create the state required to render Dropdown.\n \n The returned state can be modified with hooks such as useDropdownStyles_unstable,\n * before being passed to renderDropdown_unstable.\n \n @param props - props from this instance of Dropdown\n * @param ref - reference to root HTMLElement of Dropdown\n */\nexport const useDropdown_unstable = (props: DropdownProps, ref: React.Ref<HTMLButtonElement>): DropdownState => {\n const { appearance = 'outline', size = 'medium', ...baseProps } = props;\n const baseState = useDropdownBase_unstable(baseProps, ref);\n\n if (baseState.clearButton) {\n baseState.clearButton.children ??= <DismissIcon />;\n }\n\n if (baseState.expandIcon) {\n baseState.expandIcon.children ??= <ChevronDownIcon />;\n }\n\n return {\n ...baseState,\n appearance,\n size,\n };\n};\n"],"names":["React","useFieldControlProps_unstable","useActiveDescendant","ChevronDownRegular","ChevronDownIcon","DismissRegular","DismissIcon","useFluent_unstable","useFluent","getPartitionedNativeProps","mergeCallbacks","useMergedRefs","slot","useEventCallback","useOnClickOutside","useComboboxBaseState","useComboboxPositioning","Listbox","useListboxSlot","useButtonTriggerSlot","isComboboxOptionElement","useDropdownBase_unstable","props","ref","state","supportsLabelFor","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","dropdownInternalState","freeform","appearance","_appearance","size","_size","_freeform","baseState","clearable","clearSelection","disabled","hasFocus","multiselect","open","selectedOptions","setOpen","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","comboboxPopupRef","comboboxTargetRef","triggerRef","useRef","listbox","defaultProps","children","targetDocument","element","callback","event","refs","trigger","button","type","tabIndex","undefined","value","placeholder","id","rootSlot","always","inlinePopup","elementType","showClearButton","length","components","clearButton","expandIcon","optional","renderByDefault","placeholderVisible","onClearButtonClick","onClick","ev","current","focus","process","env","NODE_ENV","useEffect","console","error","useDropdown_unstable","baseProps"],"mappings":"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"}
1	+ {"version":3,"sources":["../src/components/Dropdown/useDropdown.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldContext_unstable, useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { ChevronDownRegular as ChevronDownIcon, DismissRegular as DismissIcon } from '@fluentui/react-icons';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n getPartitionedNativeProps,\n mergeCallbacks,\n useMergedRefs,\n slot,\n useEventCallback,\n useOnClickOutside,\n} from '@fluentui/react-utilities';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { DropdownBaseProps, DropdownBaseState, DropdownProps, DropdownState } from './Dropdown.types';\nimport { useListboxSlot } from '../../utils/useListboxSlot';\nimport { useButtonTriggerSlot } from './useButtonTriggerSlot';\nimport type { ComboboxOpenEvents } from '../Combobox/Combobox.types';\nimport { isComboboxOptionElement } from '../../utils/isComboboxOptionElement';\n\n/*\n Create the base state required to render Dropdown, without design-only props.\n \n @param props - props from this instance of Dropdown (without appearance and size)\n * @param ref - reference to root HTMLButtonElement of Dropdown\n /\nexport const useDropdownBase_unstable = (\n props: DropdownBaseProps,\n ref: React.Ref<HTMLButtonElement>,\n): DropdownBaseState => {\n // Merge props from surrounding <Field>, if any\n props = useFieldControlProps_unstable(props, { supportsLabelFor: true });\n const {\n listboxRef: activeDescendantListboxRef,\n activeParentRef,\n controller: activeDescendantController,\n } = useActiveDescendant<HTMLButtonElement, HTMLDivElement>({\n matchOption: isComboboxOptionElement,\n });\n\n const dropdownInternalState = useComboboxBaseState({ ...props, activeDescendantController, freeform: false });\n const { appearance: _appearance, size: _size, freeform: _freeform, ...baseState } = dropdownInternalState;\n const { clearable, clearSelection, disabled, hasFocus, multiselect, open, selectedOptions, setOpen } = baseState;\n\n const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'button',\n excludedPropNames: ['children'],\n });\n\n const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n\n const triggerRef = React.useRef<HTMLButtonElement>(null);\n const listbox = useListboxSlot(props.listbox, useMergedRefs(comboboxPopupRef, activeDescendantListboxRef), {\n state: dropdownInternalState,\n triggerRef,\n defaultProps: {\n children: props.children,\n },\n });\n\n const { targetDocument } = useFluent();\n\n useOnClickOutside({\n element: targetDocument,\n callback: event => setOpen(event as unknown as ComboboxOpenEvents, false),\n refs: [triggerRef, comboboxPopupRef, comboboxTargetRef],\n disabled: !open,\n });\n\n const trigger = useButtonTriggerSlot(props.button ?? {}, useMergedRefs(triggerRef, activeParentRef, ref), {\n state: dropdownInternalState,\n defaultProps: {\n type: 'button',\n // tabster navigation breaks if the button is disabled and tabIndex is 0\n tabIndex: triggerNativeProps.disabled ? undefined : 0,\n children: baseState.value \|\| props.placeholder,\n 'aria-controls': open ? listbox?.id : undefined,\n ...triggerNativeProps,\n },\n activeDescendantController,\n });\n\n const rootSlot = slot.always(props.root, {\n defaultProps: {\n 'aria-owns': !props.inlinePopup && open ? listbox?.id : undefined,\n children: props.children,\n ...rootNativeProps,\n },\n elementType: 'div',\n });\n rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n const showClearButton = selectedOptions.length > 0 && !disabled && clearable && !multiselect;\n const state: DropdownBaseState = {\n components: { root: 'div', button: 'button', clearButton: 'button', expandIcon: 'span', listbox: Listbox },\n root: rootSlot,\n button: trigger,\n listbox: open \|\| hasFocus ? listbox : undefined,\n clearButton: slot.optional(props.clearButton, {\n defaultProps: {\n 'aria-label': 'Clear selection',\n // Safari doesn't allow to focus an element with this\n // when the element is not visible (display: none) we need to remove it to avoid tabster issues\n tabIndex: showClearButton ? 0 : undefined,\n type: 'button',\n },\n elementType: 'button',\n renderByDefault: true,\n }),\n expandIcon: slot.optional(props.expandIcon, {\n renderByDefault: true,\n elementType: 'span',\n }),\n placeholderVisible: !baseState.value && !!props.placeholder,\n showClearButton,\n activeDescendantController,\n ...baseState,\n };\n\n const onClearButtonClick = useEventCallback(\n // eslint-disable-next-line react-hooks/refs\n mergeCallbacks(state.clearButton?.onClick, (ev: React.MouseEvent<HTMLButtonElement>) => {\n clearSelection(ev);\n triggerRef.current?.focus();\n }),\n );\n\n if (state.clearButton) {\n state.clearButton.onClick = onClearButtonClick;\n }\n\n // Heads up! We don't support \"clearable\" in multiselect mode, so we should never display a slot\n if (multiselect) {\n state.clearButton = undefined;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks -- \"process.env\" does not change in runtime\n React.useEffect(() => {\n if (clearable && multiselect) {\n // eslint-disable-next-line no-console\n console.error(`[@fluentui/react-combobox] \"clearable\" prop is not supported in multiselect mode.`);\n }\n }, [clearable, multiselect]);\n }\n\n return state;\n};\n\n/\n Create the state required to render Dropdown.\n \n The returned state can be modified with hooks such as useDropdownStyles_unstable,\n * before being passed to renderDropdown_unstable.\n \n @param props - props from this instance of Dropdown\n * @param ref - reference to root HTMLElement of Dropdown\n */\nexport const useDropdown_unstable = (props: DropdownProps, ref: React.Ref<HTMLButtonElement>): DropdownState => {\n const fieldContext = useFieldContext_unstable();\n const { appearance = 'outline', size = fieldContext?.size ?? 'medium', ...baseProps } = props;\n const baseState = useDropdownBase_unstable(baseProps, ref);\n\n if (baseState.clearButton) {\n baseState.clearButton.children ??= <DismissIcon />;\n }\n\n if (baseState.expandIcon) {\n baseState.expandIcon.children ??= <ChevronDownIcon />;\n }\n\n return {\n ...baseState,\n appearance,\n size,\n };\n};\n"],"names":["React","useFieldContext_unstable","useFieldControlProps_unstable","useActiveDescendant","ChevronDownRegular","ChevronDownIcon","DismissRegular","DismissIcon","useFluent_unstable","useFluent","getPartitionedNativeProps","mergeCallbacks","useMergedRefs","slot","useEventCallback","useOnClickOutside","useComboboxBaseState","useComboboxPositioning","Listbox","useListboxSlot","useButtonTriggerSlot","isComboboxOptionElement","useDropdownBase_unstable","props","ref","state","supportsLabelFor","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","dropdownInternalState","freeform","appearance","_appearance","size","_size","_freeform","baseState","clearable","clearSelection","disabled","hasFocus","multiselect","open","selectedOptions","setOpen","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","comboboxPopupRef","comboboxTargetRef","triggerRef","useRef","listbox","defaultProps","children","targetDocument","element","callback","event","refs","trigger","button","type","tabIndex","undefined","value","placeholder","id","rootSlot","always","inlinePopup","elementType","showClearButton","length","components","clearButton","expandIcon","optional","renderByDefault","placeholderVisible","onClearButtonClick","onClick","ev","current","focus","process","env","NODE_ENV","useEffect","console","error","useDropdown_unstable","fieldContext","baseProps"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-combobox",
-  "version": "9.17.3",
+  "version": "9.17.4",
   "description": "Fluent UI React Combobox component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -12,14 +12,14 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@fluentui/react-aria": "^9.17.13",
     "@fluentui/keyboard-keys": "^9.0.8",
+    "@fluentui/react-aria": "^9.17.13",
     "@fluentui/react-context-selector": "^9.2.18",
     "@fluentui/react-field": "^9.5.3",
     "@fluentui/react-icons": "^2.0.245",
     "@fluentui/react-jsx-runtime": "^9.4.4",
     "@fluentui/react-portal": "^9.8.14",
-    "@fluentui/react-positioning": "^9.22.3",
+    "@fluentui/react-positioning": "^9.23.0",
     "@fluentui/react-shared-contexts": "^9.26.2",
     "@fluentui/react-tabster": "^9.26.16",
     "@fluentui/react-theme": "^9.2.1",