@fluentui/react-combobox 9.5.30 → 9.5.32

package/CHANGELOG.md

@@ -1,12 +1,38 @@
 # Change Log - @fluentui/react-combobox
 
-This log was last generated on Tue, 14 Nov 2023 17:48:36 GMT and should not be manually modified.
+This log was last generated on Thu, 30 Nov 2023 13:37:52 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.5.32](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.5.32)
+
+Thu, 30 Nov 2023 13:37:52 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.5.31..@fluentui/react-combobox_v9.5.32)
+
+### Patches
+
+- fix: listbox closes on blur after scroll click ([PR #29877](https://github.com/microsoft/fluentui/pull/29877) by sarah.higley@microsoft.com)
+- fix: Dropdown button gets focus in Safari when clicked ([PR #29855](https://github.com/microsoft/fluentui/pull/29855) by sarah.higley@microsoft.com)
+- Bump @fluentui/react-field to v9.1.43 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.20 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
+- Bump @fluentui/react-portal to v9.4.3 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
+- Bump @fluentui/react-positioning to v9.10.2 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
+
+## [9.5.31](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.5.31)
+
+Mon, 20 Nov 2023 09:55:10 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.5.30..@fluentui/react-combobox_v9.5.31)
+
+### Patches
+
+- Bump @fluentui/react-field to v9.1.42 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
+- Bump @fluentui/react-portal to v9.4.2 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
+- Bump @fluentui/react-positioning to v9.10.1 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.13.0 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
+
 ## [9.5.30](https://github.com/microsoft/fluentui/tree/@fluentui/react-combobox_v9.5.30)
 
-Tue, 14 Nov 2023 17:48:36 GMT 
+Tue, 14 Nov 2023 17:51:27 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-combobox_v9.5.29..@fluentui/react-combobox_v9.5.30)
 
 ### Patches

package/lib/components/Dropdown/useDropdown.js

@@ -88,6 +88,7 @@ import { Listbox } from '../Listbox/Listbox';
     triggerSlot = slot.always(props.button, {
         defaultProps: {
             type: 'button',
+            tabIndex: 0,
             children: baseState.value || props.placeholder,
             ...triggerNativeProps
         },

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

@@ -1 +1 @@
-{"version":3,"sources":["useDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport { getPartitionedNativeProps, mergeCallbacks, useMergedRefs, useTimeout, slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { Slot } from '@fluentui/react-utilities';\nimport type { OptionValue } from '../../utils/OptionCollection.types';\nimport type { DropdownProps, DropdownState } from './Dropdown.types';\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  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsSize: true });\n\n  const baseState = useComboboxBaseState(props);\n  const { activeOption, getIndexOfId, getOptionsMatchingText, open, setActiveOption, setFocusVisible, setOpen } =\n    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  // jump to matching option based on typing\n  const searchString = React.useRef('');\n  const [setKeyTimeout, clearKeyTimeout] = useTimeout();\n\n  const getNextMatchingOption = (): OptionValue | undefined => {\n    // first check for matches for the full searchString\n    let matcher = (optionText: string) => optionText.toLowerCase().indexOf(searchString.current) === 0;\n    let matches = getOptionsMatchingText(matcher);\n    let startIndex = activeOption ? getIndexOfId(activeOption.id) : 0;\n\n    // if the dropdown is already open and the searchstring is a single character,\n    // then look after the current activeOption for letters\n    // this is so slowly typing the same letter will cycle through matches\n    if (open && searchString.current.length === 1) {\n      startIndex++;\n    }\n\n    // if there are no direct matches, check if the search is all the same letter, e.g. \"aaa\"\n    if (!matches.length) {\n      const letters = searchString.current.split('');\n      const allSameLetter = letters.length && letters.every(letter => letter === letters[0]);\n\n      // if the search is all the same letter, cycle through options starting with that letter\n      if (allSameLetter) {\n        startIndex++;\n        matcher = (optionText: string) => optionText.toLowerCase().indexOf(letters[0]) === 0;\n        matches = getOptionsMatchingText(matcher);\n      }\n    }\n\n    // if there is an active option and multiple matches,\n    // return first matching option after the current active option, looping back to the top\n    if (matches.length > 1 && activeOption) {\n      const nextMatch = matches.find(option => getIndexOfId(option.id) >= startIndex);\n      return nextMatch ?? matches[0];\n    }\n\n    return matches[0] ?? undefined;\n  };\n\n  const onTriggerKeyDown = (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n    // clear timeout, if it exists\n    clearKeyTimeout();\n\n    // if the key was a char key, update search string\n    if (getDropdownActionFromKey(ev) === 'Type') {\n      // update search string\n      searchString.current += ev.key.toLowerCase();\n      setKeyTimeout(() => {\n        searchString.current = '';\n      }, 500);\n\n      // update state\n      !open && setOpen(ev, true);\n\n      const nextOption = getNextMatchingOption();\n      setActiveOption(nextOption);\n      setFocusVisible(true);\n    }\n  };\n\n  // resolve button and listbox slot props\n  let triggerSlot: Slot<'button'>;\n  let listboxSlot: Slot<typeof Listbox> | undefined;\n\n  triggerSlot = slot.always(props.button, {\n    defaultProps: {\n      type: 'button',\n      children: baseState.value || props.placeholder,\n      ...triggerNativeProps,\n    },\n    elementType: 'button',\n  });\n  triggerSlot.onKeyDown = mergeCallbacks(onTriggerKeyDown, triggerSlot.onKeyDown);\n  listboxSlot =\n    baseState.open || baseState.hasFocus\n      ? slot.optional(props.listbox, {\n          renderByDefault: true,\n          defaultProps: { children: props.children },\n          elementType: Listbox,\n        })\n      : undefined;\n  [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n  const listboxRef = useMergedRefs(listboxSlot?.ref, comboboxPopupRef);\n  if (listboxSlot) {\n    listboxSlot.ref = listboxRef;\n  }\n\n  const rootSlot = slot.always(props.root, {\n    defaultProps: {\n      'aria-owns': !props.inlinePopup ? listboxSlot?.id : undefined,\n      children: props.children,\n      ...rootNativeProps,\n    },\n    elementType: 'div',\n  });\n  rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n  const state: DropdownState = {\n    components: { root: 'div', button: 'button', expandIcon: 'span', listbox: Listbox },\n    root: rootSlot,\n    button: triggerSlot,\n    listbox: listboxSlot,\n    expandIcon: slot.optional(props.expandIcon, {\n      renderByDefault: true,\n      defaultProps: {\n        children: <ChevronDownIcon />,\n      },\n      elementType: 'span',\n    }),\n    placeholderVisible: !baseState.value && !!props.placeholder,\n    ...baseState,\n  };\n\n  return state;\n};\n"],"names":["React","useFieldControlProps_unstable","ChevronDownRegular","ChevronDownIcon","getPartitionedNativeProps","mergeCallbacks","useMergedRefs","useTimeout","slot","getDropdownActionFromKey","useComboboxBaseState","useComboboxPositioning","useTriggerListboxSlots","Listbox","useDropdown_unstable","props","ref","supportsLabelFor","supportsSize","baseState","activeOption","getIndexOfId","getOptionsMatchingText","open","setActiveOption","setFocusVisible","setOpen","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","comboboxPopupRef","comboboxTargetRef","searchString","useRef","setKeyTimeout","clearKeyTimeout","getNextMatchingOption","matcher","optionText","toLowerCase","indexOf","current","matches","startIndex","id","length","letters","split","allSameLetter","every","letter","nextMatch","find","option","undefined","onTriggerKeyDown","ev","key","nextOption","triggerSlot","listboxSlot","always","button","defaultProps","type","children","value","placeholder","elementType","onKeyDown","hasFocus","optional","listbox","renderByDefault","listboxRef","rootSlot","inlinePopup","state","components","expandIcon","placeholderVisible"],"mappings":"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"}
+{"version":3,"sources":["useDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport { getPartitionedNativeProps, mergeCallbacks, useMergedRefs, useTimeout, slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\nimport type { Slot } from '@fluentui/react-utilities';\nimport type { OptionValue } from '../../utils/OptionCollection.types';\nimport type { DropdownProps, DropdownState } from './Dropdown.types';\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  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsSize: true });\n\n  const baseState = useComboboxBaseState(props);\n  const { activeOption, getIndexOfId, getOptionsMatchingText, open, setActiveOption, setFocusVisible, setOpen } =\n    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  // jump to matching option based on typing\n  const searchString = React.useRef('');\n  const [setKeyTimeout, clearKeyTimeout] = useTimeout();\n\n  const getNextMatchingOption = (): OptionValue | undefined => {\n    // first check for matches for the full searchString\n    let matcher = (optionText: string) => optionText.toLowerCase().indexOf(searchString.current) === 0;\n    let matches = getOptionsMatchingText(matcher);\n    let startIndex = activeOption ? getIndexOfId(activeOption.id) : 0;\n\n    // if the dropdown is already open and the searchstring is a single character,\n    // then look after the current activeOption for letters\n    // this is so slowly typing the same letter will cycle through matches\n    if (open && searchString.current.length === 1) {\n      startIndex++;\n    }\n\n    // if there are no direct matches, check if the search is all the same letter, e.g. \"aaa\"\n    if (!matches.length) {\n      const letters = searchString.current.split('');\n      const allSameLetter = letters.length && letters.every(letter => letter === letters[0]);\n\n      // if the search is all the same letter, cycle through options starting with that letter\n      if (allSameLetter) {\n        startIndex++;\n        matcher = (optionText: string) => optionText.toLowerCase().indexOf(letters[0]) === 0;\n        matches = getOptionsMatchingText(matcher);\n      }\n    }\n\n    // if there is an active option and multiple matches,\n    // return first matching option after the current active option, looping back to the top\n    if (matches.length > 1 && activeOption) {\n      const nextMatch = matches.find(option => getIndexOfId(option.id) >= startIndex);\n      return nextMatch ?? matches[0];\n    }\n\n    return matches[0] ?? undefined;\n  };\n\n  const onTriggerKeyDown = (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n    // clear timeout, if it exists\n    clearKeyTimeout();\n\n    // if the key was a char key, update search string\n    if (getDropdownActionFromKey(ev) === 'Type') {\n      // update search string\n      searchString.current += ev.key.toLowerCase();\n      setKeyTimeout(() => {\n        searchString.current = '';\n      }, 500);\n\n      // update state\n      !open && setOpen(ev, true);\n\n      const nextOption = getNextMatchingOption();\n      setActiveOption(nextOption);\n      setFocusVisible(true);\n    }\n  };\n\n  // resolve button and listbox slot props\n  let triggerSlot: Slot<'button'>;\n  let listboxSlot: Slot<typeof Listbox> | undefined;\n\n  triggerSlot = slot.always(props.button, {\n    defaultProps: {\n      type: 'button',\n      tabIndex: 0, // Safari doesn't focus the button on click without this\n      children: baseState.value || props.placeholder,\n      ...triggerNativeProps,\n    },\n    elementType: 'button',\n  });\n  triggerSlot.onKeyDown = mergeCallbacks(onTriggerKeyDown, triggerSlot.onKeyDown);\n  listboxSlot =\n    baseState.open || baseState.hasFocus\n      ? slot.optional(props.listbox, {\n          renderByDefault: true,\n          defaultProps: { children: props.children },\n          elementType: Listbox,\n        })\n      : undefined;\n  [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n  const listboxRef = useMergedRefs(listboxSlot?.ref, comboboxPopupRef);\n  if (listboxSlot) {\n    listboxSlot.ref = listboxRef;\n  }\n\n  const rootSlot = slot.always(props.root, {\n    defaultProps: {\n      'aria-owns': !props.inlinePopup ? listboxSlot?.id : undefined,\n      children: props.children,\n      ...rootNativeProps,\n    },\n    elementType: 'div',\n  });\n  rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n\n  const state: DropdownState = {\n    components: { root: 'div', button: 'button', expandIcon: 'span', listbox: Listbox },\n    root: rootSlot,\n    button: triggerSlot,\n    listbox: listboxSlot,\n    expandIcon: slot.optional(props.expandIcon, {\n      renderByDefault: true,\n      defaultProps: {\n        children: <ChevronDownIcon />,\n      },\n      elementType: 'span',\n    }),\n    placeholderVisible: !baseState.value && !!props.placeholder,\n    ...baseState,\n  };\n\n  return state;\n};\n"],"names":["React","useFieldControlProps_unstable","ChevronDownRegular","ChevronDownIcon","getPartitionedNativeProps","mergeCallbacks","useMergedRefs","useTimeout","slot","getDropdownActionFromKey","useComboboxBaseState","useComboboxPositioning","useTriggerListboxSlots","Listbox","useDropdown_unstable","props","ref","supportsLabelFor","supportsSize","baseState","activeOption","getIndexOfId","getOptionsMatchingText","open","setActiveOption","setFocusVisible","setOpen","primary","triggerNativeProps","root","rootNativeProps","primarySlotTagName","excludedPropNames","comboboxPopupRef","comboboxTargetRef","searchString","useRef","setKeyTimeout","clearKeyTimeout","getNextMatchingOption","matcher","optionText","toLowerCase","indexOf","current","matches","startIndex","id","length","letters","split","allSameLetter","every","letter","nextMatch","find","option","undefined","onTriggerKeyDown","ev","key","nextOption","triggerSlot","listboxSlot","always","button","defaultProps","type","tabIndex","children","value","placeholder","elementType","onKeyDown","hasFocus","optional","listbox","renderByDefault","listboxRef","rootSlot","inlinePopup","state","components","expandIcon","placeholderVisible"],"mappings":"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"}

package/lib/utils/useTriggerListboxSlots.js

@@ -56,11 +56,17 @@ import { getDropdownActionFromKey, getIndexFromAction } from '../utils/dropdownK
         ignoreNextBlur.current = true;
         targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mouseup', documentOnMouseUp);
     }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseDown));
+    const listboxOnMouseUp = useEventCallback(mergeCallbacks((event)=>{
+        // some listbox clicks don't blur the input (e.g. clicking a scrollbar)
+        // this ensures future blurs that occur after the click aren't ignored
+        ignoreNextBlur.current = false;
+    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseUp));
     // listbox is nullable, only add event handlers if it exists
     if (listbox) {
         listbox.onClick = listboxOnClick;
         listbox.onMouseOver = listboxOnMouseOver;
         listbox.onMouseDown = listboxOnMouseDown;
+        listbox.onMouseUp = listboxOnMouseUp;
     }
     // the trigger should open/close the popup on click or blur
     trigger.onBlur = mergeCallbacks((event)=>{

package/lib/utils/useTriggerListboxSlots.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTriggerListboxSlots.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { mergeCallbacks, useId, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../utils/dropdownKeyActions';\nimport { Listbox } from '../components/Listbox/Listbox';\nimport type { ComboboxBaseProps, ComboboxBaseState } from './ComboboxBase.types';\n\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLButtonElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'button'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'button'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLInputElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'input'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'input'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\n\n/*\n * useTriggerListboxSlots returns a tuple of trigger/listbox shorthand,\n * with the semantics and event handlers needed for the Combobox and Dropdown components.\n * The element type of the ref should always match the element type used in the trigger shorthand.\n */\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLButtonElement | HTMLInputElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [\n  trigger: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listbox?: ExtractSlotProps<Slot<typeof Listbox>>,\n] {\n  const { multiselect } = props;\n  const {\n    activeOption,\n    getCount,\n    getIndexOfId,\n    getOptionAtIndex,\n    ignoreNextBlur,\n    open,\n    selectOption,\n    setActiveOption,\n    setFocusVisible,\n    setHasFocus,\n    setOpen,\n  } = state;\n\n  // handle trigger focus/blur\n  const triggerRef: typeof ref = React.useRef(null);\n  const listboxRef: NonNullable<typeof listboxSlot>['ref'] = React.useRef(null);\n\n  // resolve listbox shorthand props\n  const listboxId = useId('fluent-listbox', listboxSlot?.id);\n  const mergedListboxRef = useMergedRefs(listboxSlot?.ref, listboxRef);\n  const listbox: typeof listboxSlot = listboxSlot && {\n    id: listboxId,\n    multiselect,\n    tabIndex: undefined,\n    ...listboxSlot,\n    ref: mergedListboxRef,\n  };\n\n  // resolve trigger shorthand props\n  const trigger: typeof triggerSlot = {\n    'aria-expanded': open,\n    'aria-activedescendant': open ? activeOption?.id : undefined,\n    role: 'combobox',\n    ...triggerSlot,\n    // explicitly type the ref as an intersection here to prevent type errors\n    // since the `children` prop has mutually incompatible types between input/button\n    // functionally both ref and triggerRef will always be the same element type\n    ref: useMergedRefs(ref, triggerSlot?.ref, triggerRef) as React.Ref<HTMLButtonElement & HTMLInputElement>,\n  };\n\n  /*\n   * Handle focus when clicking the listbox popup:\n   * 1. Move focus back to the button/input when the listbox is clicked (otherwise it goes to body)\n   * 2. Do not close the listbox on button/input blur when clicking into the listbox\n   */\n  const listboxOnClick = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      triggerRef.current?.focus();\n    }, listbox?.onClick),\n  );\n\n  const listboxOnMouseOver = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      setFocusVisible(false);\n    }, listbox?.onMouseOver),\n  );\n\n  const { targetDocument } = useFluent_unstable();\n  const documentOnMouseUp = useEventCallback((ev: MouseEvent) => {\n    if (!listboxRef.current?.contains(ev.target as HTMLElement)) {\n      setOpen(ev as unknown as React.MouseEvent<HTMLElement>, false);\n    }\n    targetDocument?.removeEventListener('mouseup', documentOnMouseUp);\n  });\n\n  const listboxOnMouseDown = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      ignoreNextBlur.current = true;\n      targetDocument?.addEventListener('mouseup', documentOnMouseUp);\n    }, listbox?.onMouseDown),\n  );\n\n  // listbox is nullable, only add event handlers if it exists\n  if (listbox) {\n    listbox.onClick = listboxOnClick;\n    listbox.onMouseOver = listboxOnMouseOver;\n    listbox.onMouseDown = listboxOnMouseDown;\n  }\n\n  // the trigger should open/close the popup on click or blur\n  trigger.onBlur = mergeCallbacks((event: React.FocusEvent<HTMLButtonElement> & React.FocusEvent<HTMLInputElement>) => {\n    if (!ignoreNextBlur.current) {\n      setOpen(event, false);\n    }\n\n    ignoreNextBlur.current = false;\n\n    setHasFocus(false);\n  }, trigger.onBlur);\n\n  trigger.onClick = mergeCallbacks(\n    (event: React.MouseEvent<HTMLButtonElement> & React.MouseEvent<HTMLInputElement>) => {\n      setOpen(event, !open);\n    },\n    trigger.onClick,\n  );\n\n  trigger.onFocus = mergeCallbacks(\n    (event: React.FocusEvent<HTMLButtonElement> & React.FocusEvent<HTMLInputElement>) => {\n      setHasFocus(true);\n    },\n    trigger.onFocus,\n  );\n\n  // handle combobox keyboard interaction\n  trigger.onKeyDown = mergeCallbacks(\n    (event: React.KeyboardEvent<HTMLButtonElement> & React.KeyboardEvent<HTMLInputElement>) => {\n      const action = getDropdownActionFromKey(event, { open, multiselect });\n      const maxIndex = getCount() - 1;\n      const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n      let newIndex = activeIndex;\n\n      switch (action) {\n        case 'Open':\n          event.preventDefault();\n          setFocusVisible(true);\n          setOpen(event, true);\n          break;\n        case 'Close':\n          // stop propagation for escape key to avoid dismissing any parent popups\n          event.stopPropagation();\n          event.preventDefault();\n          setOpen(event, false);\n          break;\n        case 'CloseSelect':\n          !multiselect && !activeOption?.disabled && setOpen(event, false);\n        // fallthrough\n        case 'Select':\n          activeOption && selectOption(event, activeOption);\n          event.preventDefault();\n          break;\n        case 'Tab':\n          !multiselect && activeOption && selectOption(event, activeOption);\n          break;\n        default:\n          newIndex = getIndexFromAction(action, activeIndex, maxIndex);\n      }\n      if (newIndex !== activeIndex) {\n        // prevent default page scroll/keyboard action if the index changed\n        event.preventDefault();\n        setActiveOption(getOptionAtIndex(newIndex));\n        setFocusVisible(true);\n      }\n    },\n    trigger.onKeyDown,\n  );\n\n  trigger.onMouseOver = mergeCallbacks(\n    (event: React.MouseEvent<HTMLButtonElement> & React.MouseEvent<HTMLInputElement>) => {\n      setFocusVisible(false);\n    },\n    trigger.onMouseOver,\n  );\n\n  return [trigger, listbox];\n}\n"],"names":["React","useFluent_unstable","mergeCallbacks","useId","useEventCallback","useMergedRefs","getDropdownActionFromKey","getIndexFromAction","useTriggerListboxSlots","props","state","ref","triggerSlot","listboxSlot","multiselect","activeOption","getCount","getIndexOfId","getOptionAtIndex","ignoreNextBlur","open","selectOption","setActiveOption","setFocusVisible","setHasFocus","setOpen","triggerRef","useRef","listboxRef","listboxId","id","mergedListboxRef","listbox","tabIndex","undefined","trigger","role","listboxOnClick","event","current","focus","onClick","listboxOnMouseOver","onMouseOver","targetDocument","documentOnMouseUp","ev","contains","target","removeEventListener","listboxOnMouseDown","addEventListener","onMouseDown","onBlur","onFocus","onKeyDown","action","maxIndex","activeIndex","newIndex","preventDefault","stopPropagation","disabled"],"mappings":"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"}
+{"version":3,"sources":["useTriggerListboxSlots.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { mergeCallbacks, useId, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../utils/dropdownKeyActions';\nimport { Listbox } from '../components/Listbox/Listbox';\nimport type { ComboboxBaseProps, ComboboxBaseState } from './ComboboxBase.types';\n\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLButtonElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'button'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'button'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLInputElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'input'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'input'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\n\n/*\n * useTriggerListboxSlots returns a tuple of trigger/listbox shorthand,\n * with the semantics and event handlers needed for the Combobox and Dropdown components.\n * The element type of the ref should always match the element type used in the trigger shorthand.\n */\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLButtonElement | HTMLInputElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [\n  trigger: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listbox?: ExtractSlotProps<Slot<typeof Listbox>>,\n] {\n  const { multiselect } = props;\n  const {\n    activeOption,\n    getCount,\n    getIndexOfId,\n    getOptionAtIndex,\n    ignoreNextBlur,\n    open,\n    selectOption,\n    setActiveOption,\n    setFocusVisible,\n    setHasFocus,\n    setOpen,\n  } = state;\n\n  // handle trigger focus/blur\n  const triggerRef: typeof ref = React.useRef(null);\n  const listboxRef: NonNullable<typeof listboxSlot>['ref'] = React.useRef(null);\n\n  // resolve listbox shorthand props\n  const listboxId = useId('fluent-listbox', listboxSlot?.id);\n  const mergedListboxRef = useMergedRefs(listboxSlot?.ref, listboxRef);\n  const listbox: typeof listboxSlot = listboxSlot && {\n    id: listboxId,\n    multiselect,\n    tabIndex: undefined,\n    ...listboxSlot,\n    ref: mergedListboxRef,\n  };\n\n  // resolve trigger shorthand props\n  const trigger: typeof triggerSlot = {\n    'aria-expanded': open,\n    'aria-activedescendant': open ? activeOption?.id : undefined,\n    role: 'combobox',\n    ...triggerSlot,\n    // explicitly type the ref as an intersection here to prevent type errors\n    // since the `children` prop has mutually incompatible types between input/button\n    // functionally both ref and triggerRef will always be the same element type\n    ref: useMergedRefs(ref, triggerSlot?.ref, triggerRef) as React.Ref<HTMLButtonElement & HTMLInputElement>,\n  };\n\n  /*\n   * Handle focus when clicking the listbox popup:\n   * 1. Move focus back to the button/input when the listbox is clicked (otherwise it goes to body)\n   * 2. Do not close the listbox on button/input blur when clicking into the listbox\n   */\n  const listboxOnClick = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      triggerRef.current?.focus();\n    }, listbox?.onClick),\n  );\n\n  const listboxOnMouseOver = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      setFocusVisible(false);\n    }, listbox?.onMouseOver),\n  );\n\n  const { targetDocument } = useFluent_unstable();\n  const documentOnMouseUp = useEventCallback((ev: MouseEvent) => {\n    if (!listboxRef.current?.contains(ev.target as HTMLElement)) {\n      setOpen(ev as unknown as React.MouseEvent<HTMLElement>, false);\n    }\n    targetDocument?.removeEventListener('mouseup', documentOnMouseUp);\n  });\n\n  const listboxOnMouseDown = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      ignoreNextBlur.current = true;\n      targetDocument?.addEventListener('mouseup', documentOnMouseUp);\n    }, listbox?.onMouseDown),\n  );\n\n  const listboxOnMouseUp = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      // some listbox clicks don't blur the input (e.g. clicking a scrollbar)\n      // this ensures future blurs that occur after the click aren't ignored\n      ignoreNextBlur.current = false;\n    }, listbox?.onMouseUp),\n  );\n\n  // listbox is nullable, only add event handlers if it exists\n  if (listbox) {\n    listbox.onClick = listboxOnClick;\n    listbox.onMouseOver = listboxOnMouseOver;\n    listbox.onMouseDown = listboxOnMouseDown;\n    listbox.onMouseUp = listboxOnMouseUp;\n  }\n\n  // the trigger should open/close the popup on click or blur\n  trigger.onBlur = mergeCallbacks((event: React.FocusEvent<HTMLButtonElement> & React.FocusEvent<HTMLInputElement>) => {\n    if (!ignoreNextBlur.current) {\n      setOpen(event, false);\n    }\n\n    ignoreNextBlur.current = false;\n\n    setHasFocus(false);\n  }, trigger.onBlur);\n\n  trigger.onClick = mergeCallbacks(\n    (event: React.MouseEvent<HTMLButtonElement> & React.MouseEvent<HTMLInputElement>) => {\n      setOpen(event, !open);\n    },\n    trigger.onClick,\n  );\n\n  trigger.onFocus = mergeCallbacks(\n    (event: React.FocusEvent<HTMLButtonElement> & React.FocusEvent<HTMLInputElement>) => {\n      setHasFocus(true);\n    },\n    trigger.onFocus,\n  );\n\n  // handle combobox keyboard interaction\n  trigger.onKeyDown = mergeCallbacks(\n    (event: React.KeyboardEvent<HTMLButtonElement> & React.KeyboardEvent<HTMLInputElement>) => {\n      const action = getDropdownActionFromKey(event, { open, multiselect });\n      const maxIndex = getCount() - 1;\n      const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n      let newIndex = activeIndex;\n\n      switch (action) {\n        case 'Open':\n          event.preventDefault();\n          setFocusVisible(true);\n          setOpen(event, true);\n          break;\n        case 'Close':\n          // stop propagation for escape key to avoid dismissing any parent popups\n          event.stopPropagation();\n          event.preventDefault();\n          setOpen(event, false);\n          break;\n        case 'CloseSelect':\n          !multiselect && !activeOption?.disabled && setOpen(event, false);\n        // fallthrough\n        case 'Select':\n          activeOption && selectOption(event, activeOption);\n          event.preventDefault();\n          break;\n        case 'Tab':\n          !multiselect && activeOption && selectOption(event, activeOption);\n          break;\n        default:\n          newIndex = getIndexFromAction(action, activeIndex, maxIndex);\n      }\n      if (newIndex !== activeIndex) {\n        // prevent default page scroll/keyboard action if the index changed\n        event.preventDefault();\n        setActiveOption(getOptionAtIndex(newIndex));\n        setFocusVisible(true);\n      }\n    },\n    trigger.onKeyDown,\n  );\n\n  trigger.onMouseOver = mergeCallbacks(\n    (event: React.MouseEvent<HTMLButtonElement> & React.MouseEvent<HTMLInputElement>) => {\n      setFocusVisible(false);\n    },\n    trigger.onMouseOver,\n  );\n\n  return [trigger, listbox];\n}\n"],"names":["React","useFluent_unstable","mergeCallbacks","useId","useEventCallback","useMergedRefs","getDropdownActionFromKey","getIndexFromAction","useTriggerListboxSlots","props","state","ref","triggerSlot","listboxSlot","multiselect","activeOption","getCount","getIndexOfId","getOptionAtIndex","ignoreNextBlur","open","selectOption","setActiveOption","setFocusVisible","setHasFocus","setOpen","triggerRef","useRef","listboxRef","listboxId","id","mergedListboxRef","listbox","tabIndex","undefined","trigger","role","listboxOnClick","event","current","focus","onClick","listboxOnMouseOver","onMouseOver","targetDocument","documentOnMouseUp","ev","contains","target","removeEventListener","listboxOnMouseDown","addEventListener","onMouseDown","listboxOnMouseUp","onMouseUp","onBlur","onFocus","onKeyDown","action","maxIndex","activeIndex","newIndex","preventDefault","stopPropagation","disabled"],"mappings":"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"}

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

@@ -91,6 +91,7 @@ const useDropdown_unstable = (props, ref)=>{
     triggerSlot = _reactutilities.slot.always(props.button, {
         defaultProps: {
             type: 'button',
+            tabIndex: 0,
             children: baseState.value || props.placeholder,
             ...triggerNativeProps
         },

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

@@ -1 +1 @@
-{"version":3,"sources":["useDropdown.js"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport { getPartitionedNativeProps, mergeCallbacks, useMergedRefs, useTimeout, slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\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 */ export const useDropdown_unstable = (props, ref)=>{\n    // Merge props from surrounding <Field>, if any\n    props = useFieldControlProps_unstable(props, {\n        supportsLabelFor: true,\n        supportsSize: true\n    });\n    const baseState = useComboboxBaseState(props);\n    const { activeOption, getIndexOfId, getOptionsMatchingText, open, setActiveOption, setFocusVisible, setOpen } = baseState;\n    const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n        props,\n        primarySlotTagName: 'button',\n        excludedPropNames: [\n            'children'\n        ]\n    });\n    const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n    // jump to matching option based on typing\n    const searchString = React.useRef('');\n    const [setKeyTimeout, clearKeyTimeout] = useTimeout();\n    const getNextMatchingOption = ()=>{\n        // first check for matches for the full searchString\n        let matcher = (optionText)=>optionText.toLowerCase().indexOf(searchString.current) === 0;\n        let matches = getOptionsMatchingText(matcher);\n        let startIndex = activeOption ? getIndexOfId(activeOption.id) : 0;\n        // if the dropdown is already open and the searchstring is a single character,\n        // then look after the current activeOption for letters\n        // this is so slowly typing the same letter will cycle through matches\n        if (open && searchString.current.length === 1) {\n            startIndex++;\n        }\n        // if there are no direct matches, check if the search is all the same letter, e.g. \"aaa\"\n        if (!matches.length) {\n            const letters = searchString.current.split('');\n            const allSameLetter = letters.length && letters.every((letter)=>letter === letters[0]);\n            // if the search is all the same letter, cycle through options starting with that letter\n            if (allSameLetter) {\n                startIndex++;\n                matcher = (optionText)=>optionText.toLowerCase().indexOf(letters[0]) === 0;\n                matches = getOptionsMatchingText(matcher);\n            }\n        }\n        // if there is an active option and multiple matches,\n        // return first matching option after the current active option, looping back to the top\n        if (matches.length > 1 && activeOption) {\n            const nextMatch = matches.find((option)=>getIndexOfId(option.id) >= startIndex);\n            return nextMatch !== null && nextMatch !== void 0 ? nextMatch : matches[0];\n        }\n        var _matches_;\n        return (_matches_ = matches[0]) !== null && _matches_ !== void 0 ? _matches_ : undefined;\n    };\n    const onTriggerKeyDown = (ev)=>{\n        // clear timeout, if it exists\n        clearKeyTimeout();\n        // if the key was a char key, update search string\n        if (getDropdownActionFromKey(ev) === 'Type') {\n            // update search string\n            searchString.current += ev.key.toLowerCase();\n            setKeyTimeout(()=>{\n                searchString.current = '';\n            }, 500);\n            // update state\n            !open && setOpen(ev, true);\n            const nextOption = getNextMatchingOption();\n            setActiveOption(nextOption);\n            setFocusVisible(true);\n        }\n    };\n    // resolve button and listbox slot props\n    let triggerSlot;\n    let listboxSlot;\n    triggerSlot = slot.always(props.button, {\n        defaultProps: {\n            type: 'button',\n            children: baseState.value || props.placeholder,\n            ...triggerNativeProps\n        },\n        elementType: 'button'\n    });\n    triggerSlot.onKeyDown = mergeCallbacks(onTriggerKeyDown, triggerSlot.onKeyDown);\n    listboxSlot = baseState.open || baseState.hasFocus ? slot.optional(props.listbox, {\n        renderByDefault: true,\n        defaultProps: {\n            children: props.children\n        },\n        elementType: Listbox\n    }) : undefined;\n    [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n    const listboxRef = useMergedRefs(listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.ref, comboboxPopupRef);\n    if (listboxSlot) {\n        listboxSlot.ref = listboxRef;\n    }\n    const rootSlot = slot.always(props.root, {\n        defaultProps: {\n            'aria-owns': !props.inlinePopup ? listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id : undefined,\n            children: props.children,\n            ...rootNativeProps\n        },\n        elementType: 'div'\n    });\n    rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n    const state = {\n        components: {\n            root: 'div',\n            button: 'button',\n            expandIcon: 'span',\n            listbox: Listbox\n        },\n        root: rootSlot,\n        button: triggerSlot,\n        listbox: listboxSlot,\n        expandIcon: slot.optional(props.expandIcon, {\n            renderByDefault: true,\n            defaultProps: {\n                children: /*#__PURE__*/ React.createElement(ChevronDownIcon, null)\n            },\n            elementType: 'span'\n        }),\n        placeholderVisible: !baseState.value && !!props.placeholder,\n        ...baseState\n    };\n    return state;\n};\n"],"names":["useDropdown_unstable","props","ref","useFieldControlProps_unstable","supportsLabelFor","supportsSize","baseState","useComboboxBaseState","activeOption","getIndexOfId","getOptionsMatchingText","open","setActiveOption","setFocusVisible","setOpen","primary","triggerNativeProps","root","rootNativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","comboboxPopupRef","comboboxTargetRef","useComboboxPositioning","searchString","React","useRef","setKeyTimeout","clearKeyTimeout","useTimeout","getNextMatchingOption","matcher","optionText","toLowerCase","indexOf","current","matches","startIndex","id","length","letters","split","allSameLetter","every","letter","nextMatch","find","option","_matches_","undefined","onTriggerKeyDown","ev","getDropdownActionFromKey","key","nextOption","triggerSlot","listboxSlot","slot","always","button","defaultProps","type","children","value","placeholder","elementType","onKeyDown","mergeCallbacks","hasFocus","optional","listbox","renderByDefault","Listbox","useTriggerListboxSlots","listboxRef","useMergedRefs","rootSlot","inlinePopup","state","components","expandIcon","createElement","ChevronDownIcon","placeholderVisible"],"mappings":"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"}
+{"version":3,"sources":["useDropdown.js"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport { getPartitionedNativeProps, mergeCallbacks, useMergedRefs, useTimeout, slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPositioning } from '../../utils/useComboboxPositioning';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\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 */ export const useDropdown_unstable = (props, ref)=>{\n    // Merge props from surrounding <Field>, if any\n    props = useFieldControlProps_unstable(props, {\n        supportsLabelFor: true,\n        supportsSize: true\n    });\n    const baseState = useComboboxBaseState(props);\n    const { activeOption, getIndexOfId, getOptionsMatchingText, open, setActiveOption, setFocusVisible, setOpen } = baseState;\n    const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n        props,\n        primarySlotTagName: 'button',\n        excludedPropNames: [\n            'children'\n        ]\n    });\n    const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n    // jump to matching option based on typing\n    const searchString = React.useRef('');\n    const [setKeyTimeout, clearKeyTimeout] = useTimeout();\n    const getNextMatchingOption = ()=>{\n        // first check for matches for the full searchString\n        let matcher = (optionText)=>optionText.toLowerCase().indexOf(searchString.current) === 0;\n        let matches = getOptionsMatchingText(matcher);\n        let startIndex = activeOption ? getIndexOfId(activeOption.id) : 0;\n        // if the dropdown is already open and the searchstring is a single character,\n        // then look after the current activeOption for letters\n        // this is so slowly typing the same letter will cycle through matches\n        if (open && searchString.current.length === 1) {\n            startIndex++;\n        }\n        // if there are no direct matches, check if the search is all the same letter, e.g. \"aaa\"\n        if (!matches.length) {\n            const letters = searchString.current.split('');\n            const allSameLetter = letters.length && letters.every((letter)=>letter === letters[0]);\n            // if the search is all the same letter, cycle through options starting with that letter\n            if (allSameLetter) {\n                startIndex++;\n                matcher = (optionText)=>optionText.toLowerCase().indexOf(letters[0]) === 0;\n                matches = getOptionsMatchingText(matcher);\n            }\n        }\n        // if there is an active option and multiple matches,\n        // return first matching option after the current active option, looping back to the top\n        if (matches.length > 1 && activeOption) {\n            const nextMatch = matches.find((option)=>getIndexOfId(option.id) >= startIndex);\n            return nextMatch !== null && nextMatch !== void 0 ? nextMatch : matches[0];\n        }\n        var _matches_;\n        return (_matches_ = matches[0]) !== null && _matches_ !== void 0 ? _matches_ : undefined;\n    };\n    const onTriggerKeyDown = (ev)=>{\n        // clear timeout, if it exists\n        clearKeyTimeout();\n        // if the key was a char key, update search string\n        if (getDropdownActionFromKey(ev) === 'Type') {\n            // update search string\n            searchString.current += ev.key.toLowerCase();\n            setKeyTimeout(()=>{\n                searchString.current = '';\n            }, 500);\n            // update state\n            !open && setOpen(ev, true);\n            const nextOption = getNextMatchingOption();\n            setActiveOption(nextOption);\n            setFocusVisible(true);\n        }\n    };\n    // resolve button and listbox slot props\n    let triggerSlot;\n    let listboxSlot;\n    triggerSlot = slot.always(props.button, {\n        defaultProps: {\n            type: 'button',\n            tabIndex: 0,\n            children: baseState.value || props.placeholder,\n            ...triggerNativeProps\n        },\n        elementType: 'button'\n    });\n    triggerSlot.onKeyDown = mergeCallbacks(onTriggerKeyDown, triggerSlot.onKeyDown);\n    listboxSlot = baseState.open || baseState.hasFocus ? slot.optional(props.listbox, {\n        renderByDefault: true,\n        defaultProps: {\n            children: props.children\n        },\n        elementType: Listbox\n    }) : undefined;\n    [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n    const listboxRef = useMergedRefs(listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.ref, comboboxPopupRef);\n    if (listboxSlot) {\n        listboxSlot.ref = listboxRef;\n    }\n    const rootSlot = slot.always(props.root, {\n        defaultProps: {\n            'aria-owns': !props.inlinePopup ? listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id : undefined,\n            children: props.children,\n            ...rootNativeProps\n        },\n        elementType: 'div'\n    });\n    rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n    const state = {\n        components: {\n            root: 'div',\n            button: 'button',\n            expandIcon: 'span',\n            listbox: Listbox\n        },\n        root: rootSlot,\n        button: triggerSlot,\n        listbox: listboxSlot,\n        expandIcon: slot.optional(props.expandIcon, {\n            renderByDefault: true,\n            defaultProps: {\n                children: /*#__PURE__*/ React.createElement(ChevronDownIcon, null)\n            },\n            elementType: 'span'\n        }),\n        placeholderVisible: !baseState.value && !!props.placeholder,\n        ...baseState\n    };\n    return state;\n};\n"],"names":["useDropdown_unstable","props","ref","useFieldControlProps_unstable","supportsLabelFor","supportsSize","baseState","useComboboxBaseState","activeOption","getIndexOfId","getOptionsMatchingText","open","setActiveOption","setFocusVisible","setOpen","primary","triggerNativeProps","root","rootNativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","comboboxPopupRef","comboboxTargetRef","useComboboxPositioning","searchString","React","useRef","setKeyTimeout","clearKeyTimeout","useTimeout","getNextMatchingOption","matcher","optionText","toLowerCase","indexOf","current","matches","startIndex","id","length","letters","split","allSameLetter","every","letter","nextMatch","find","option","_matches_","undefined","onTriggerKeyDown","ev","getDropdownActionFromKey","key","nextOption","triggerSlot","listboxSlot","slot","always","button","defaultProps","type","tabIndex","children","value","placeholder","elementType","onKeyDown","mergeCallbacks","hasFocus","optional","listbox","renderByDefault","Listbox","useTriggerListboxSlots","listboxRef","useMergedRefs","rootSlot","inlinePopup","state","components","expandIcon","createElement","ChevronDownIcon","placeholderVisible"],"mappings":"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"}

package/lib-commonjs/utils/useTriggerListboxSlots.js

@@ -63,11 +63,17 @@ function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
         ignoreNextBlur.current = true;
         targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mouseup', documentOnMouseUp);
     }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseDown));
+    const listboxOnMouseUp = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)((event)=>{
+        // some listbox clicks don't blur the input (e.g. clicking a scrollbar)
+        // this ensures future blurs that occur after the click aren't ignored
+        ignoreNextBlur.current = false;
+    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseUp));
     // listbox is nullable, only add event handlers if it exists
     if (listbox) {
         listbox.onClick = listboxOnClick;
         listbox.onMouseOver = listboxOnMouseOver;
         listbox.onMouseDown = listboxOnMouseDown;
+        listbox.onMouseUp = listboxOnMouseUp;
     }
     // the trigger should open/close the popup on click or blur
     trigger.onBlur = (0, _reactutilities.mergeCallbacks)((event)=>{

package/lib-commonjs/utils/useTriggerListboxSlots.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTriggerListboxSlots.js"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { mergeCallbacks, useId, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../utils/dropdownKeyActions';\n/*\n * useTriggerListboxSlots returns a tuple of trigger/listbox shorthand,\n * with the semantics and event handlers needed for the Combobox and Dropdown components.\n * The element type of the ref should always match the element type used in the trigger shorthand.\n */ export function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {\n    const { multiselect } = props;\n    const { activeOption, getCount, getIndexOfId, getOptionAtIndex, ignoreNextBlur, open, selectOption, setActiveOption, setFocusVisible, setHasFocus, setOpen } = state;\n    // handle trigger focus/blur\n    const triggerRef = React.useRef(null);\n    const listboxRef = React.useRef(null);\n    // resolve listbox shorthand props\n    const listboxId = useId('fluent-listbox', listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id);\n    const mergedListboxRef = useMergedRefs(listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.ref, listboxRef);\n    const listbox = listboxSlot && {\n        id: listboxId,\n        multiselect,\n        tabIndex: undefined,\n        ...listboxSlot,\n        ref: mergedListboxRef\n    };\n    // resolve trigger shorthand props\n    const trigger = {\n        'aria-expanded': open,\n        'aria-activedescendant': open ? activeOption === null || activeOption === void 0 ? void 0 : activeOption.id : undefined,\n        role: 'combobox',\n        ...triggerSlot,\n        // explicitly type the ref as an intersection here to prevent type errors\n        // since the `children` prop has mutually incompatible types between input/button\n        // functionally both ref and triggerRef will always be the same element type\n        ref: useMergedRefs(ref, triggerSlot === null || triggerSlot === void 0 ? void 0 : triggerSlot.ref, triggerRef)\n    };\n    /*\n   * Handle focus when clicking the listbox popup:\n   * 1. Move focus back to the button/input when the listbox is clicked (otherwise it goes to body)\n   * 2. Do not close the listbox on button/input blur when clicking into the listbox\n   */ const listboxOnClick = useEventCallback(mergeCallbacks((event)=>{\n        var _triggerRef_current;\n        (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();\n    }, listbox === null || listbox === void 0 ? void 0 : listbox.onClick));\n    const listboxOnMouseOver = useEventCallback(mergeCallbacks((event)=>{\n        setFocusVisible(false);\n    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseOver));\n    const { targetDocument } = useFluent_unstable();\n    const documentOnMouseUp = useEventCallback((ev)=>{\n        var _listboxRef_current;\n        if (!((_listboxRef_current = listboxRef.current) === null || _listboxRef_current === void 0 ? void 0 : _listboxRef_current.contains(ev.target))) {\n            setOpen(ev, false);\n        }\n        targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mouseup', documentOnMouseUp);\n    });\n    const listboxOnMouseDown = useEventCallback(mergeCallbacks((event)=>{\n        ignoreNextBlur.current = true;\n        targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mouseup', documentOnMouseUp);\n    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseDown));\n    // listbox is nullable, only add event handlers if it exists\n    if (listbox) {\n        listbox.onClick = listboxOnClick;\n        listbox.onMouseOver = listboxOnMouseOver;\n        listbox.onMouseDown = listboxOnMouseDown;\n    }\n    // the trigger should open/close the popup on click or blur\n    trigger.onBlur = mergeCallbacks((event)=>{\n        if (!ignoreNextBlur.current) {\n            setOpen(event, false);\n        }\n        ignoreNextBlur.current = false;\n        setHasFocus(false);\n    }, trigger.onBlur);\n    trigger.onClick = mergeCallbacks((event)=>{\n        setOpen(event, !open);\n    }, trigger.onClick);\n    trigger.onFocus = mergeCallbacks((event)=>{\n        setHasFocus(true);\n    }, trigger.onFocus);\n    // handle combobox keyboard interaction\n    trigger.onKeyDown = mergeCallbacks((event)=>{\n        const action = getDropdownActionFromKey(event, {\n            open,\n            multiselect\n        });\n        const maxIndex = getCount() - 1;\n        const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n        let newIndex = activeIndex;\n        switch(action){\n            case 'Open':\n                event.preventDefault();\n                setFocusVisible(true);\n                setOpen(event, true);\n                break;\n            case 'Close':\n                // stop propagation for escape key to avoid dismissing any parent popups\n                event.stopPropagation();\n                event.preventDefault();\n                setOpen(event, false);\n                break;\n            case 'CloseSelect':\n                !multiselect && !(activeOption === null || activeOption === void 0 ? void 0 : activeOption.disabled) && setOpen(event, false);\n            // fallthrough\n            case 'Select':\n                activeOption && selectOption(event, activeOption);\n                event.preventDefault();\n                break;\n            case 'Tab':\n                !multiselect && activeOption && selectOption(event, activeOption);\n                break;\n            default:\n                newIndex = getIndexFromAction(action, activeIndex, maxIndex);\n        }\n        if (newIndex !== activeIndex) {\n            // prevent default page scroll/keyboard action if the index changed\n            event.preventDefault();\n            setActiveOption(getOptionAtIndex(newIndex));\n            setFocusVisible(true);\n        }\n    }, trigger.onKeyDown);\n    trigger.onMouseOver = mergeCallbacks((event)=>{\n        setFocusVisible(false);\n    }, trigger.onMouseOver);\n    return [\n        trigger,\n        listbox\n    ];\n}\n"],"names":["useTriggerListboxSlots","props","state","ref","triggerSlot","listboxSlot","multiselect","activeOption","getCount","getIndexOfId","getOptionAtIndex","ignoreNextBlur","open","selectOption","setActiveOption","setFocusVisible","setHasFocus","setOpen","triggerRef","React","useRef","listboxRef","listboxId","useId","id","mergedListboxRef","useMergedRefs","listbox","tabIndex","undefined","trigger","role","listboxOnClick","useEventCallback","mergeCallbacks","event","_triggerRef_current","current","focus","onClick","listboxOnMouseOver","onMouseOver","targetDocument","useFluent_unstable","documentOnMouseUp","ev","_listboxRef_current","contains","target","removeEventListener","listboxOnMouseDown","addEventListener","onMouseDown","onBlur","onFocus","onKeyDown","action","getDropdownActionFromKey","maxIndex","activeIndex","newIndex","preventDefault","stopPropagation","disabled","getIndexFromAction"],"mappings":"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"}
+{"version":3,"sources":["useTriggerListboxSlots.js"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { mergeCallbacks, useId, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../utils/dropdownKeyActions';\n/*\n * useTriggerListboxSlots returns a tuple of trigger/listbox shorthand,\n * with the semantics and event handlers needed for the Combobox and Dropdown components.\n * The element type of the ref should always match the element type used in the trigger shorthand.\n */ export function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {\n    const { multiselect } = props;\n    const { activeOption, getCount, getIndexOfId, getOptionAtIndex, ignoreNextBlur, open, selectOption, setActiveOption, setFocusVisible, setHasFocus, setOpen } = state;\n    // handle trigger focus/blur\n    const triggerRef = React.useRef(null);\n    const listboxRef = React.useRef(null);\n    // resolve listbox shorthand props\n    const listboxId = useId('fluent-listbox', listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id);\n    const mergedListboxRef = useMergedRefs(listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.ref, listboxRef);\n    const listbox = listboxSlot && {\n        id: listboxId,\n        multiselect,\n        tabIndex: undefined,\n        ...listboxSlot,\n        ref: mergedListboxRef\n    };\n    // resolve trigger shorthand props\n    const trigger = {\n        'aria-expanded': open,\n        'aria-activedescendant': open ? activeOption === null || activeOption === void 0 ? void 0 : activeOption.id : undefined,\n        role: 'combobox',\n        ...triggerSlot,\n        // explicitly type the ref as an intersection here to prevent type errors\n        // since the `children` prop has mutually incompatible types between input/button\n        // functionally both ref and triggerRef will always be the same element type\n        ref: useMergedRefs(ref, triggerSlot === null || triggerSlot === void 0 ? void 0 : triggerSlot.ref, triggerRef)\n    };\n    /*\n   * Handle focus when clicking the listbox popup:\n   * 1. Move focus back to the button/input when the listbox is clicked (otherwise it goes to body)\n   * 2. Do not close the listbox on button/input blur when clicking into the listbox\n   */ const listboxOnClick = useEventCallback(mergeCallbacks((event)=>{\n        var _triggerRef_current;\n        (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();\n    }, listbox === null || listbox === void 0 ? void 0 : listbox.onClick));\n    const listboxOnMouseOver = useEventCallback(mergeCallbacks((event)=>{\n        setFocusVisible(false);\n    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseOver));\n    const { targetDocument } = useFluent_unstable();\n    const documentOnMouseUp = useEventCallback((ev)=>{\n        var _listboxRef_current;\n        if (!((_listboxRef_current = listboxRef.current) === null || _listboxRef_current === void 0 ? void 0 : _listboxRef_current.contains(ev.target))) {\n            setOpen(ev, false);\n        }\n        targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mouseup', documentOnMouseUp);\n    });\n    const listboxOnMouseDown = useEventCallback(mergeCallbacks((event)=>{\n        ignoreNextBlur.current = true;\n        targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mouseup', documentOnMouseUp);\n    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseDown));\n    const listboxOnMouseUp = useEventCallback(mergeCallbacks((event)=>{\n        // some listbox clicks don't blur the input (e.g. clicking a scrollbar)\n        // this ensures future blurs that occur after the click aren't ignored\n        ignoreNextBlur.current = false;\n    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseUp));\n    // listbox is nullable, only add event handlers if it exists\n    if (listbox) {\n        listbox.onClick = listboxOnClick;\n        listbox.onMouseOver = listboxOnMouseOver;\n        listbox.onMouseDown = listboxOnMouseDown;\n        listbox.onMouseUp = listboxOnMouseUp;\n    }\n    // the trigger should open/close the popup on click or blur\n    trigger.onBlur = mergeCallbacks((event)=>{\n        if (!ignoreNextBlur.current) {\n            setOpen(event, false);\n        }\n        ignoreNextBlur.current = false;\n        setHasFocus(false);\n    }, trigger.onBlur);\n    trigger.onClick = mergeCallbacks((event)=>{\n        setOpen(event, !open);\n    }, trigger.onClick);\n    trigger.onFocus = mergeCallbacks((event)=>{\n        setHasFocus(true);\n    }, trigger.onFocus);\n    // handle combobox keyboard interaction\n    trigger.onKeyDown = mergeCallbacks((event)=>{\n        const action = getDropdownActionFromKey(event, {\n            open,\n            multiselect\n        });\n        const maxIndex = getCount() - 1;\n        const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n        let newIndex = activeIndex;\n        switch(action){\n            case 'Open':\n                event.preventDefault();\n                setFocusVisible(true);\n                setOpen(event, true);\n                break;\n            case 'Close':\n                // stop propagation for escape key to avoid dismissing any parent popups\n                event.stopPropagation();\n                event.preventDefault();\n                setOpen(event, false);\n                break;\n            case 'CloseSelect':\n                !multiselect && !(activeOption === null || activeOption === void 0 ? void 0 : activeOption.disabled) && setOpen(event, false);\n            // fallthrough\n            case 'Select':\n                activeOption && selectOption(event, activeOption);\n                event.preventDefault();\n                break;\n            case 'Tab':\n                !multiselect && activeOption && selectOption(event, activeOption);\n                break;\n            default:\n                newIndex = getIndexFromAction(action, activeIndex, maxIndex);\n        }\n        if (newIndex !== activeIndex) {\n            // prevent default page scroll/keyboard action if the index changed\n            event.preventDefault();\n            setActiveOption(getOptionAtIndex(newIndex));\n            setFocusVisible(true);\n        }\n    }, trigger.onKeyDown);\n    trigger.onMouseOver = mergeCallbacks((event)=>{\n        setFocusVisible(false);\n    }, trigger.onMouseOver);\n    return [\n        trigger,\n        listbox\n    ];\n}\n"],"names":["useTriggerListboxSlots","props","state","ref","triggerSlot","listboxSlot","multiselect","activeOption","getCount","getIndexOfId","getOptionAtIndex","ignoreNextBlur","open","selectOption","setActiveOption","setFocusVisible","setHasFocus","setOpen","triggerRef","React","useRef","listboxRef","listboxId","useId","id","mergedListboxRef","useMergedRefs","listbox","tabIndex","undefined","trigger","role","listboxOnClick","useEventCallback","mergeCallbacks","event","_triggerRef_current","current","focus","onClick","listboxOnMouseOver","onMouseOver","targetDocument","useFluent_unstable","documentOnMouseUp","ev","_listboxRef_current","contains","target","removeEventListener","listboxOnMouseDown","addEventListener","onMouseDown","listboxOnMouseUp","onMouseUp","onBlur","onFocus","onKeyDown","action","getDropdownActionFromKey","maxIndex","activeIndex","newIndex","preventDefault","stopPropagation","disabled","getIndexFromAction"],"mappings":";;;;+BAQoBA;;;eAAAA;;;;iEARG;qCACY;gCACoC;oCACV;AAKlD,SAASA,uBAAuBC,KAAK,EAAEC,KAAK,EAAEC,GAAG,EAAEC,WAAW,EAAEC,WAAW;IAClF,MAAM,EAAEC,WAAW,EAAE,GAAGL;IACxB,MAAM,EAAEM,YAAY,EAAEC,QAAQ,EAAEC,YAAY,EAAEC,gBAAgB,EAAEC,cAAc,EAAEC,IAAI,EAAEC,YAAY,EAAEC,eAAe,EAAEC,eAAe,EAAEC,WAAW,EAAEC,OAAO,EAAE,GAAGf;IAC/J,4BAA4B;IAC5B,MAAMgB,aAAaC,OAAMC,MAAM,CAAC;IAChC,MAAMC,aAAaF,OAAMC,MAAM,CAAC;IAChC,kCAAkC;IAClC,MAAME,YAAYC,IAAAA,qBAAK,EAAC,kBAAkBlB,gBAAgB,QAAQA,gBAAgB,KAAK,IAAI,KAAK,IAAIA,YAAYmB,EAAE;IAClH,MAAMC,mBAAmBC,IAAAA,6BAAa,EAACrB,gBAAgB,QAAQA,gBAAgB,KAAK,IAAI,KAAK,IAAIA,YAAYF,GAAG,EAAEkB;IAClH,MAAMM,UAAUtB,eAAe;QAC3BmB,IAAIF;QACJhB;QACAsB,UAAUC;QACV,GAAGxB,WAAW;QACdF,KAAKsB;IACT;IACA,kCAAkC;IAClC,MAAMK,UAAU;QACZ,iBAAiBlB;QACjB,yBAAyBA,OAAOL,iBAAiB,QAAQA,iBAAiB,KAAK,IAAI,KAAK,IAAIA,aAAaiB,EAAE,GAAGK;QAC9GE,MAAM;QACN,GAAG3B,WAAW;QACd,yEAAyE;QACzE,iFAAiF;QACjF,4EAA4E;QAC5ED,KAAKuB,IAAAA,6BAAa,EAACvB,KAAKC,gBAAgB,QAAQA,gBAAgB,KAAK,IAAI,KAAK,IAAIA,YAAYD,GAAG,EAAEe;IACvG;IACA;;;;GAID,GAAG,MAAMc,iBAAiBC,IAAAA,gCAAgB,EAACC,IAAAA,8BAAc,EAAC,CAACC;QACtD,IAAIC;QACHA,CAAAA,sBAAsBlB,WAAWmB,OAAO,AAAD,MAAO,QAAQD,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBE,KAAK;IAC9H,GAAGX,YAAY,QAAQA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQY,OAAO;IACpE,MAAMC,qBAAqBP,IAAAA,gCAAgB,EAACC,IAAAA,8BAAc,EAAC,CAACC;QACxDpB,gBAAgB;IACpB,GAAGY,YAAY,QAAQA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQc,WAAW;IACxE,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAkB;IAC7C,MAAMC,oBAAoBX,IAAAA,gCAAgB,EAAC,CAACY;QACxC,IAAIC;QACJ,IAAI,CAAE,CAAA,AAACA,CAAAA,sBAAsBzB,WAAWgB,OAAO,AAAD,MAAO,QAAQS,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBC,QAAQ,CAACF,GAAGG,MAAM,CAAA,GAAI;YAC7I/B,QAAQ4B,IAAI;QAChB;QACAH,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeO,mBAAmB,CAAC,WAAWL;IAClH;IACA,MAAMM,qBAAqBjB,IAAAA,gCAAgB,EAACC,IAAAA,8BAAc,EAAC,CAACC;QACxDxB,eAAe0B,OAAO,GAAG;QACzBK,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeS,gBAAgB,CAAC,WAAWP;IAC/G,GAAGjB,YAAY,QAAQA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQyB,WAAW;IACxE,MAAMC,mBAAmBpB,IAAAA,gCAAgB,EAACC,IAAAA,8BAAc,EAAC,CAACC;QACtD,uEAAuE;QACvE,sEAAsE;QACtExB,eAAe0B,OAAO,GAAG;IAC7B,GAAGV,YAAY,QAAQA,YAAY,KAAK,IAAI,KAAK,IAAIA,QAAQ2B,SAAS;IACtE,4DAA4D;IAC5D,IAAI3B,SAAS;QACTA,QAAQY,OAAO,GAAGP;QAClBL,QAAQc,WAAW,GAAGD;QACtBb,QAAQyB,WAAW,GAAGF;QACtBvB,QAAQ2B,SAAS,GAAGD;IACxB;IACA,2DAA2D;IAC3DvB,QAAQyB,MAAM,GAAGrB,IAAAA,8BAAc,EAAC,CAACC;QAC7B,IAAI,CAACxB,eAAe0B,OAAO,EAAE;YACzBpB,QAAQkB,OAAO;QACnB;QACAxB,eAAe0B,OAAO,GAAG;QACzBrB,YAAY;IAChB,GAAGc,QAAQyB,MAAM;IACjBzB,QAAQS,OAAO,GAAGL,IAAAA,8BAAc,EAAC,CAACC;QAC9BlB,QAAQkB,OAAO,CAACvB;IACpB,GAAGkB,QAAQS,OAAO;IAClBT,QAAQ0B,OAAO,GAAGtB,IAAAA,8BAAc,EAAC,CAACC;QAC9BnB,YAAY;IAChB,GAAGc,QAAQ0B,OAAO;IAClB,uCAAuC;IACvC1B,QAAQ2B,SAAS,GAAGvB,IAAAA,8BAAc,EAAC,CAACC;QAChC,MAAMuB,SAASC,IAAAA,4CAAwB,EAACxB,OAAO;YAC3CvB;YACAN;QACJ;QACA,MAAMsD,WAAWpD,aAAa;QAC9B,MAAMqD,cAActD,eAAeE,aAAaF,aAAaiB,EAAE,IAAI,CAAC;QACpE,IAAIsC,WAAWD;QACf,OAAOH;YACH,KAAK;gBACDvB,MAAM4B,cAAc;gBACpBhD,gBAAgB;gBAChBE,QAAQkB,OAAO;gBACf;YACJ,KAAK;gBACD,wEAAwE;gBACxEA,MAAM6B,eAAe;gBACrB7B,MAAM4B,cAAc;gBACpB9C,QAAQkB,OAAO;gBACf;YACJ,KAAK;gBACD,CAAC7B,eAAe,CAAEC,CAAAA,iBAAiB,QAAQA,iBAAiB,KAAK,IAAI,KAAK,IAAIA,aAAa0D,QAAQ,AAAD,KAAMhD,QAAQkB,OAAO;YAC3H,cAAc;YACd,KAAK;gBACD5B,gBAAgBM,aAAasB,OAAO5B;gBACpC4B,MAAM4B,cAAc;gBACpB;YACJ,KAAK;gBACD,CAACzD,eAAeC,gBAAgBM,aAAasB,OAAO5B;gBACpD;YACJ;gBACIuD,WAAWI,IAAAA,sCAAkB,EAACR,QAAQG,aAAaD;QAC3D;QACA,IAAIE,aAAaD,aAAa;YAC1B,mEAAmE;YACnE1B,MAAM4B,cAAc;YACpBjD,gBAAgBJ,iBAAiBoD;YACjC/C,gBAAgB;QACpB;IACJ,GAAGe,QAAQ2B,SAAS;IACpB3B,QAAQW,WAAW,GAAGP,IAAAA,8BAAc,EAAC,CAACC;QAClCpB,gBAAgB;IACpB,GAAGe,QAAQW,WAAW;IACtB,OAAO;QACHX;QACAH;KACH;AACL"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-combobox",
-  "version": "9.5.30",
+  "version": "9.5.32",
   "description": "Fluent UI React Combobox component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -35,12 +35,12 @@
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.7",
     "@fluentui/react-context-selector": "^9.1.42",
-    "@fluentui/react-field": "^9.1.41",
+    "@fluentui/react-field": "^9.1.43",
     "@fluentui/react-icons": "^2.0.217",
-    "@fluentui/react-jsx-runtime": "^9.0.19",
-    "@fluentui/react-portal": "^9.4.1",
-    "@fluentui/react-positioning": "^9.10.0",
-    "@fluentui/react-shared-contexts": "^9.12.0",
+    "@fluentui/react-jsx-runtime": "^9.0.20",
+    "@fluentui/react-portal": "^9.4.3",
+    "@fluentui/react-positioning": "^9.10.2",
+    "@fluentui/react-shared-contexts": "^9.13.0",
     "@fluentui/react-theme": "^9.1.16",
     "@fluentui/react-utilities": "^9.15.2",
     "@griffel/react": "^1.5.14",