@fluentui/react-combobox 9.5.27 → 9.5.29

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

@@ -1 +1 @@
-{"version":3,"sources":["useCombobox.js"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ArrowLeft, ArrowRight } from '@fluentui/keyboard-keys';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport { getPartitionedNativeProps, mergeCallbacks, useEventCallback, useId, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from '../../utils/dropdownKeyActions';\nimport { useComboboxBaseState } from '../../utils/useComboboxBaseState';\nimport { useComboboxPopup } from '../../utils/useComboboxPopup';\nimport { useTriggerListboxSlots } from '../../utils/useTriggerListboxSlots';\nimport { Listbox } from '../Listbox/Listbox';\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 */ export const useCombobox_unstable = (props, ref)=>{\n    var _props_input;\n    // Merge props from surrounding <Field>, if any\n    props = useFieldControlProps_unstable(props, {\n        supportsLabelFor: true,\n        supportsRequired: true,\n        supportsSize: true\n    });\n    const baseState = useComboboxBaseState({\n        ...props,\n        editable: true\n    });\n    const { activeOption, clearSelection, getIndexOfId, getOptionsMatchingText, hasFocus, open, selectOption, selectedOptions, setActiveOption, setFocusVisible, setOpen, setValue, value } = baseState;\n    const { disabled, freeform, inlinePopup, multiselect } = props;\n    const comboId = useId('combobox-');\n    const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n        props,\n        primarySlotTagName: 'input',\n        excludedPropNames: [\n            'children',\n            'size'\n        ]\n    });\n    const rootRef = React.useRef(null);\n    const triggerRef = React.useRef(null);\n    // NVDA and JAWS have bugs that suppress reading the input value text when aria-activedescendant is set\n    // To prevent this, we clear the HTML attribute (but save the state) when a user presses left/right arrows\n    // ref: https://github.com/microsoft/fluentui/issues/26359#issuecomment-1397759888\n    const [hideActiveDescendant, setHideActiveDescendant] = React.useState(false);\n    // save the typing vs. navigating options state, as the space key should behave differently in each case\n    // we do not want to update the combobox when this changes, just save the value between renders\n    const isTyping = React.useRef(false);\n    // calculate listbox width style based on trigger width\n    const [popupDimensions, setPopupDimensions] = React.useState();\n    React.useEffect(()=>{\n        // only recalculate width when opening\n        if (open) {\n            var _rootRef_current;\n            const width = `${(_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.clientWidth}px`;\n            if (width !== (popupDimensions === null || popupDimensions === void 0 ? void 0 : popupDimensions.width)) {\n                setPopupDimensions({\n                    width\n                });\n            }\n        }\n    }, [\n        open,\n        popupDimensions\n    ]);\n    // set active option and selection based on typing\n    const getOptionFromInput = (inputValue)=>{\n        const searchString = inputValue === null || inputValue === void 0 ? void 0 : inputValue.trim().toLowerCase();\n        if (!searchString || searchString.length === 0) {\n            return;\n        }\n        const matcher = (optionText)=>optionText.toLowerCase().indexOf(searchString) === 0;\n        const matches = getOptionsMatchingText(matcher);\n        // return first matching option after the current active option, looping back to the top\n        if (matches.length > 1 && activeOption) {\n            const startIndex = getIndexOfId(activeOption.id);\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    /* Handle typed input */ // reset any typed value when an option is selected\n    baseState.selectOption = (ev, option)=>{\n        setValue(undefined);\n        selectOption(ev, option);\n    };\n    const onTriggerBlur = (ev)=>{\n        // handle selection and updating value if freeform is false\n        if (!baseState.open && !freeform) {\n            // select matching option, if the value fully matches\n            if (value && activeOption && value.trim().toLowerCase() === (activeOption === null || activeOption === void 0 ? void 0 : activeOption.text.toLowerCase())) {\n                baseState.selectOption(ev, activeOption);\n            }\n            // reset typed value when the input loses focus while collapsed, unless freeform is true\n            setValue(undefined);\n        }\n    };\n    baseState.setOpen = (ev, newState)=>{\n        if (disabled) {\n            return;\n        }\n        if (!newState && !freeform) {\n            setValue(undefined);\n        }\n        setOpen(ev, newState);\n    };\n    // update value and active option based on input\n    const onTriggerChange = (ev)=>{\n        const inputValue = ev.target.value;\n        // update uncontrolled value\n        baseState.setValue(inputValue);\n        // handle updating active option based on input\n        const matchingOption = getOptionFromInput(inputValue);\n        setActiveOption(matchingOption);\n        setFocusVisible(true);\n        // clear selection for single-select if the input value no longer matches the selection\n        if (!multiselect && selectedOptions.length === 1 && (inputValue.length < 1 || !matchingOption)) {\n            clearSelection(ev);\n        }\n    };\n    // resolve input and listbox slot props\n    let triggerSlot;\n    let listboxSlot;\n    triggerSlot = slot.always(props.input, {\n        defaultProps: {\n            ref: useMergedRefs((_props_input = props.input) === null || _props_input === void 0 ? void 0 : _props_input.ref, triggerRef),\n            type: 'text',\n            value: value !== null && value !== void 0 ? value : '',\n            ...triggerNativeProps\n        },\n        elementType: 'input'\n    });\n    const resolvedPropsOnKeyDown = triggerSlot.onKeyDown;\n    triggerSlot.onChange = mergeCallbacks(triggerSlot.onChange, onTriggerChange);\n    triggerSlot.onBlur = mergeCallbacks(triggerSlot.onBlur, onTriggerBlur); // only resolve listbox slot if needed\n    listboxSlot = open || hasFocus ? slot.optional(props.listbox, {\n        renderByDefault: true,\n        defaultProps: {\n            children: props.children,\n            style: popupDimensions\n        },\n        elementType: Listbox\n    }) : undefined;\n    [triggerSlot, listboxSlot] = useComboboxPopup(props, triggerSlot, listboxSlot);\n    [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n    if (hideActiveDescendant) {\n        triggerSlot['aria-activedescendant'] = undefined;\n    }\n    const state = {\n        components: {\n            root: 'div',\n            input: 'input',\n            expandIcon: 'span',\n            listbox: Listbox\n        },\n        root: slot.always(props.root, {\n            defaultProps: {\n                'aria-owns': !inlinePopup ? listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id : undefined,\n                ...rootNativeProps\n            },\n            elementType: 'div'\n        }),\n        input: triggerSlot,\n        listbox: listboxSlot,\n        expandIcon: slot.optional(props.expandIcon, {\n            renderByDefault: true,\n            defaultProps: {\n                'aria-expanded': open,\n                children: /*#__PURE__*/ React.createElement(ChevronDownIcon, null),\n                role: 'button'\n            },\n            elementType: 'span'\n        }),\n        ...baseState\n    };\n    state.root.ref = useMergedRefs(state.root.ref, rootRef);\n    /* Set input.onKeyDown here, so we can override the default behavior for spacebar */ const defaultOnTriggerKeyDown = state.input.onKeyDown;\n    state.input.onKeyDown = useEventCallback((ev)=>{\n        if (!open && getDropdownActionFromKey(ev) === 'Type') {\n            baseState.setOpen(ev, true);\n        }\n        // clear activedescendant when moving the text insertion cursor\n        if (ev.key === ArrowLeft || ev.key === ArrowRight) {\n            setHideActiveDescendant(true);\n        } else {\n            setHideActiveDescendant(false);\n        }\n        // update typing state to true if the user is typing\n        const action = getDropdownActionFromKey(ev, {\n            open,\n            multiselect\n        });\n        if (action === 'Type') {\n            isTyping.current = true;\n        } else if (action === 'Open' && ev.key !== ' ' || action === 'Next' || action === 'Previous' || action === 'First' || action === 'Last' || action === 'PageUp' || action === 'PageDown') {\n            isTyping.current = false;\n        }\n        // allow space to insert a character if freeform & the last action was typing, or if the popup is closed\n        if (freeform && (isTyping.current || !open) && ev.key === ' ') {\n            resolvedPropsOnKeyDown === null || resolvedPropsOnKeyDown === void 0 ? void 0 : resolvedPropsOnKeyDown(ev);\n            return;\n        }\n        // if we're not allowing space to type, continue with default behavior\n        defaultOnTriggerKeyDown === null || defaultOnTriggerKeyDown === void 0 ? void 0 : defaultOnTriggerKeyDown(ev);\n    });\n    /* handle open/close + focus change when clicking expandIcon */ const { onMouseDown: onIconMouseDown, onClick: onIconClick } = state.expandIcon || {};\n    const onExpandIconMouseDown = useEventCallback(mergeCallbacks(onIconMouseDown, ()=>{\n        // do not dismiss on blur when closing via clicking the icon\n        if (open) {\n            baseState.ignoreNextBlur.current = true;\n        }\n    }));\n    const onExpandIconClick = useEventCallback(mergeCallbacks(onIconClick, (event)=>{\n        var _triggerRef_current;\n        // open and set focus\n        state.setOpen(event, !state.open);\n        (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();\n        // set focus visible=false, since this can only be done with the mouse/pointer\n        setFocusVisible(false);\n    }));\n    if (state.expandIcon) {\n        state.expandIcon.onMouseDown = onExpandIconMouseDown;\n        state.expandIcon.onClick = onExpandIconClick;\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                var _state_expandIcon_id;\n                const chevronId = (_state_expandIcon_id = state.expandIcon.id) !== null && _state_expandIcon_id !== void 0 ? _state_expandIcon_id : `${comboId}-chevron`;\n                const chevronLabelledBy = `${chevronId} ${state.input['aria-labelledby']}`;\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    return state;\n};\n"],"names":["useCombobox_unstable","props","ref","_props_input","useFieldControlProps_unstable","supportsLabelFor","supportsRequired","supportsSize","baseState","useComboboxBaseState","editable","activeOption","clearSelection","getIndexOfId","getOptionsMatchingText","hasFocus","open","selectOption","selectedOptions","setActiveOption","setFocusVisible","setOpen","setValue","value","disabled","freeform","inlinePopup","multiselect","comboId","useId","primary","triggerNativeProps","root","rootNativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","rootRef","React","useRef","triggerRef","hideActiveDescendant","setHideActiveDescendant","useState","isTyping","popupDimensions","setPopupDimensions","useEffect","_rootRef_current","width","current","clientWidth","getOptionFromInput","inputValue","searchString","trim","toLowerCase","length","matcher","optionText","indexOf","matches","startIndex","id","nextMatch","find","option","_matches_","undefined","ev","onTriggerBlur","text","newState","onTriggerChange","target","matchingOption","triggerSlot","listboxSlot","slot","always","input","defaultProps","useMergedRefs","type","elementType","resolvedPropsOnKeyDown","onKeyDown","onChange","mergeCallbacks","onBlur","optional","listbox","renderByDefault","children","style","Listbox","useComboboxPopup","useTriggerListboxSlots","state","components","expandIcon","createElement","ChevronDownIcon","role","defaultOnTriggerKeyDown","useEventCallback","getDropdownActionFromKey","key","ArrowLeft","ArrowRight","action","onMouseDown","onIconMouseDown","onClick","onIconClick","onExpandIconMouseDown","ignoreNextBlur","onExpandIconClick","event","_triggerRef_current","focus","hasExpandLabel","defaultOpenString","_state_expandIcon_id","chevronId","chevronLabelledBy"],"mappings":"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"}
+{"version":3,"sources":["useCombobox.js"],"sourcesContent":["import * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { ArrowLeft, ArrowRight } from '@fluentui/keyboard-keys';\nimport { ChevronDownRegular as ChevronDownIcon } from '@fluentui/react-icons';\nimport { getPartitionedNativeProps, mergeCallbacks, useEventCallback, useId, useMergedRefs, 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 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 */ export const useCombobox_unstable = (props, ref)=>{\n    var _props_input;\n    // Merge props from surrounding <Field>, if any\n    props = useFieldControlProps_unstable(props, {\n        supportsLabelFor: true,\n        supportsRequired: true,\n        supportsSize: true\n    });\n    const baseState = useComboboxBaseState({\n        ...props,\n        editable: true\n    });\n    const { activeOption, clearSelection, getIndexOfId, getOptionsMatchingText, hasFocus, open, selectOption, selectedOptions, setActiveOption, setFocusVisible, setOpen, setValue, value } = baseState;\n    const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning(props);\n    const { disabled, freeform, inlinePopup, multiselect } = props;\n    const comboId = useId('combobox-');\n    const { primary: triggerNativeProps, root: rootNativeProps } = getPartitionedNativeProps({\n        props,\n        primarySlotTagName: 'input',\n        excludedPropNames: [\n            'children',\n            'size'\n        ]\n    });\n    const rootRef = React.useRef(null);\n    const triggerRef = React.useRef(null);\n    // NVDA and JAWS have bugs that suppress reading the input value text when aria-activedescendant is set\n    // To prevent this, we clear the HTML attribute (but save the state) when a user presses left/right arrows\n    // ref: https://github.com/microsoft/fluentui/issues/26359#issuecomment-1397759888\n    const [hideActiveDescendant, setHideActiveDescendant] = React.useState(false);\n    // save the typing vs. navigating options state, as the space key should behave differently in each case\n    // we do not want to update the combobox when this changes, just save the value between renders\n    const isTyping = React.useRef(false);\n    // set active option and selection based on typing\n    const getOptionFromInput = (inputValue)=>{\n        const searchString = inputValue === null || inputValue === void 0 ? void 0 : inputValue.trim().toLowerCase();\n        if (!searchString || searchString.length === 0) {\n            return;\n        }\n        const matcher = (optionText)=>optionText.toLowerCase().indexOf(searchString) === 0;\n        const matches = getOptionsMatchingText(matcher);\n        // return first matching option after the current active option, looping back to the top\n        if (matches.length > 1 && activeOption) {\n            const startIndex = getIndexOfId(activeOption.id);\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    /* Handle typed input */ // reset any typed value when an option is selected\n    baseState.selectOption = (ev, option)=>{\n        setValue(undefined);\n        selectOption(ev, option);\n    };\n    const onTriggerBlur = (ev)=>{\n        // handle selection and updating value if freeform is false\n        if (!baseState.open && !freeform) {\n            // select matching option, if the value fully matches\n            if (value && activeOption && value.trim().toLowerCase() === (activeOption === null || activeOption === void 0 ? void 0 : activeOption.text.toLowerCase())) {\n                baseState.selectOption(ev, activeOption);\n            }\n            // reset typed value when the input loses focus while collapsed, unless freeform is true\n            setValue(undefined);\n        }\n    };\n    baseState.setOpen = (ev, newState)=>{\n        if (disabled) {\n            return;\n        }\n        if (!newState && !freeform) {\n            setValue(undefined);\n        }\n        setOpen(ev, newState);\n    };\n    // update value and active option based on input\n    const onTriggerChange = (ev)=>{\n        const inputValue = ev.target.value;\n        // update uncontrolled value\n        baseState.setValue(inputValue);\n        // handle updating active option based on input\n        const matchingOption = getOptionFromInput(inputValue);\n        setActiveOption(matchingOption);\n        setFocusVisible(true);\n        // clear selection for single-select if the input value no longer matches the selection\n        if (!multiselect && selectedOptions.length === 1 && (inputValue.length < 1 || !matchingOption)) {\n            clearSelection(ev);\n        }\n    };\n    // resolve input and listbox slot props\n    let triggerSlot;\n    let listboxSlot;\n    triggerSlot = slot.always(props.input, {\n        defaultProps: {\n            ref: useMergedRefs((_props_input = props.input) === null || _props_input === void 0 ? void 0 : _props_input.ref, triggerRef),\n            type: 'text',\n            value: value !== null && value !== void 0 ? value : '',\n            ...triggerNativeProps\n        },\n        elementType: 'input'\n    });\n    const resolvedPropsOnKeyDown = triggerSlot.onKeyDown;\n    triggerSlot.onChange = mergeCallbacks(triggerSlot.onChange, onTriggerChange);\n    triggerSlot.onBlur = mergeCallbacks(triggerSlot.onBlur, onTriggerBlur); // only resolve listbox slot if needed\n    listboxSlot = open || 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 (hideActiveDescendant) {\n        triggerSlot['aria-activedescendant'] = undefined;\n    }\n    if (listboxSlot) {\n        listboxSlot.ref = listboxRef;\n    }\n    const rootSlot = slot.always(props.root, {\n        defaultProps: {\n            'aria-owns': !inlinePopup ? listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id : undefined,\n            ...rootNativeProps\n        },\n        elementType: 'div'\n    });\n    rootSlot.ref = useMergedRefs(rootSlot.ref, comboboxTargetRef);\n    const state = {\n        components: {\n            root: 'div',\n            input: 'input',\n            expandIcon: 'span',\n            listbox: Listbox\n        },\n        root: rootSlot,\n        input: triggerSlot,\n        listbox: listboxSlot,\n        expandIcon: slot.optional(props.expandIcon, {\n            renderByDefault: true,\n            defaultProps: {\n                'aria-expanded': open,\n                children: /*#__PURE__*/ React.createElement(ChevronDownIcon, null),\n                role: 'button'\n            },\n            elementType: 'span'\n        }),\n        ...baseState\n    };\n    state.root.ref = useMergedRefs(state.root.ref, rootRef);\n    /* Set input.onKeyDown here, so we can override the default behavior for spacebar */ const defaultOnTriggerKeyDown = state.input.onKeyDown;\n    state.input.onKeyDown = useEventCallback((ev)=>{\n        if (!open && getDropdownActionFromKey(ev) === 'Type') {\n            baseState.setOpen(ev, true);\n        }\n        // clear activedescendant when moving the text insertion cursor\n        if (ev.key === ArrowLeft || ev.key === ArrowRight) {\n            setHideActiveDescendant(true);\n        } else {\n            setHideActiveDescendant(false);\n        }\n        // update typing state to true if the user is typing\n        const action = getDropdownActionFromKey(ev, {\n            open,\n            multiselect\n        });\n        if (action === 'Type') {\n            isTyping.current = true;\n        } else if (action === 'Open' && ev.key !== ' ' || action === 'Next' || action === 'Previous' || action === 'First' || action === 'Last' || action === 'PageUp' || action === 'PageDown') {\n            isTyping.current = false;\n        }\n        // allow space to insert a character if freeform & the last action was typing, or if the popup is closed\n        if (freeform && (isTyping.current || !open) && ev.key === ' ') {\n            resolvedPropsOnKeyDown === null || resolvedPropsOnKeyDown === void 0 ? void 0 : resolvedPropsOnKeyDown(ev);\n            return;\n        }\n        // if we're not allowing space to type, continue with default behavior\n        defaultOnTriggerKeyDown === null || defaultOnTriggerKeyDown === void 0 ? void 0 : defaultOnTriggerKeyDown(ev);\n    });\n    /* handle open/close + focus change when clicking expandIcon */ const { onMouseDown: onIconMouseDown, onClick: onIconClick } = state.expandIcon || {};\n    const onExpandIconMouseDown = useEventCallback(mergeCallbacks(onIconMouseDown, ()=>{\n        // do not dismiss on blur when closing via clicking the icon\n        if (open) {\n            baseState.ignoreNextBlur.current = true;\n        }\n    }));\n    const onExpandIconClick = useEventCallback(mergeCallbacks(onIconClick, (event)=>{\n        var _triggerRef_current;\n        // open and set focus\n        state.setOpen(event, !state.open);\n        (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();\n        // set focus visible=false, since this can only be done with the mouse/pointer\n        setFocusVisible(false);\n    }));\n    if (state.expandIcon) {\n        state.expandIcon.onMouseDown = onExpandIconMouseDown;\n        state.expandIcon.onClick = onExpandIconClick;\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                var _state_expandIcon_id;\n                const chevronId = (_state_expandIcon_id = state.expandIcon.id) !== null && _state_expandIcon_id !== void 0 ? _state_expandIcon_id : `${comboId}-chevron`;\n                const chevronLabelledBy = `${chevronId} ${state.input['aria-labelledby']}`;\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    return state;\n};\n"],"names":["useCombobox_unstable","props","ref","_props_input","useFieldControlProps_unstable","supportsLabelFor","supportsRequired","supportsSize","baseState","useComboboxBaseState","editable","activeOption","clearSelection","getIndexOfId","getOptionsMatchingText","hasFocus","open","selectOption","selectedOptions","setActiveOption","setFocusVisible","setOpen","setValue","value","comboboxPopupRef","comboboxTargetRef","useComboboxPositioning","disabled","freeform","inlinePopup","multiselect","comboId","useId","primary","triggerNativeProps","root","rootNativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","rootRef","React","useRef","triggerRef","hideActiveDescendant","setHideActiveDescendant","useState","isTyping","getOptionFromInput","inputValue","searchString","trim","toLowerCase","length","matcher","optionText","indexOf","matches","startIndex","id","nextMatch","find","option","_matches_","undefined","ev","onTriggerBlur","text","newState","onTriggerChange","target","matchingOption","triggerSlot","listboxSlot","slot","always","input","defaultProps","useMergedRefs","type","elementType","resolvedPropsOnKeyDown","onKeyDown","onChange","mergeCallbacks","onBlur","optional","listbox","renderByDefault","children","Listbox","useTriggerListboxSlots","listboxRef","rootSlot","state","components","expandIcon","createElement","ChevronDownIcon","role","defaultOnTriggerKeyDown","useEventCallback","getDropdownActionFromKey","key","ArrowLeft","ArrowRight","action","current","onMouseDown","onIconMouseDown","onClick","onIconClick","onExpandIconMouseDown","ignoreNextBlur","onExpandIconClick","event","_triggerRef_current","focus","hasExpandLabel","defaultOpenString","_state_expandIcon_id","chevronId","chevronLabelledBy"],"mappings":"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"}

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

@@ -15,7 +15,7 @@ const _reacticons = require("@fluentui/react-icons");
 const _reactutilities = require("@fluentui/react-utilities");
 const _dropdownKeyActions = require("../../utils/dropdownKeyActions");
 const _useComboboxBaseState = require("../../utils/useComboboxBaseState");
-const _useComboboxPopup = require("../../utils/useComboboxPopup");
+const _useComboboxPositioning = require("../../utils/useComboboxPositioning");
 const _useTriggerListboxSlots = require("../../utils/useTriggerListboxSlots");
 const _Listbox = require("../Listbox/Listbox");
 const useDropdown_unstable = (props, ref)=>{
@@ -33,16 +33,7 @@ const useDropdown_unstable = (props, ref)=>{
             'children'
         ]
     });
-    // set listbox popup width based off the root/trigger width
-    const rootRef = _react.useRef(null);
-    const [popupWidth, setPopupWidth] = _react.useState();
-    _react.useEffect(()=>{
-        var _rootRef_current;
-        const width = open ? `${(_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.clientWidth}px` : undefined;
-        setPopupWidth(width);
-    }, [
-        open
-    ]);
+    const [comboboxPopupRef, comboboxTargetRef] = (0, _useComboboxPositioning.useComboboxPositioning)(props);
     // jump to matching option based on typing
     const searchString = _react.useRef('');
     const [setKeyTimeout, clearKeyTimeout] = (0, _reactutilities.useTimeout)();
@@ -109,15 +100,24 @@ const useDropdown_unstable = (props, ref)=>{
     listboxSlot = baseState.open || baseState.hasFocus ? _reactutilities.slot.optional(props.listbox, {
         renderByDefault: true,
         defaultProps: {
-            children: props.children,
-            style: {
-                width: popupWidth
-            }
+            children: props.children
         },
         elementType: _Listbox.Listbox
     }) : undefined;
-    [triggerSlot, listboxSlot] = (0, _useComboboxPopup.useComboboxPopup)(props, triggerSlot, listboxSlot);
     [triggerSlot, listboxSlot] = (0, _useTriggerListboxSlots.useTriggerListboxSlots)(props, baseState, ref, triggerSlot, listboxSlot);
+    const listboxRef = (0, _reactutilities.useMergedRefs)(listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.ref, comboboxPopupRef);
+    if (listboxSlot) {
+        listboxSlot.ref = listboxRef;
+    }
+    const rootSlot = _reactutilities.slot.always(props.root, {
+        defaultProps: {
+            'aria-owns': !props.inlinePopup ? listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id : undefined,
+            children: props.children,
+            ...rootNativeProps
+        },
+        elementType: 'div'
+    });
+    rootSlot.ref = (0, _reactutilities.useMergedRefs)(rootSlot.ref, comboboxTargetRef);
     const state = {
         components: {
             root: 'div',
@@ -125,14 +125,7 @@ const useDropdown_unstable = (props, ref)=>{
             expandIcon: 'span',
             listbox: _Listbox.Listbox
         },
-        root: _reactutilities.slot.always(props.root, {
-            defaultProps: {
-                'aria-owns': !props.inlinePopup ? listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id : undefined,
-                children: props.children,
-                ...rootNativeProps
-            },
-            elementType: 'div'
-        }),
+        root: rootSlot,
         button: triggerSlot,
         listbox: listboxSlot,
         expandIcon: _reactutilities.slot.optional(props.expandIcon, {
@@ -145,6 +138,5 @@ const useDropdown_unstable = (props, ref)=>{
         placeholderVisible: !baseState.value && !!props.placeholder,
         ...baseState
     };
-    state.root.ref = (0, _reactutilities.useMergedRefs)(state.root.ref, rootRef);
     return state;
 };

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 { useComboboxPopup } from '../../utils/useComboboxPopup';\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    // set listbox popup width based off the root/trigger width\n    const rootRef = React.useRef(null);\n    const [popupWidth, setPopupWidth] = React.useState();\n    React.useEffect(()=>{\n        var _rootRef_current;\n        const width = open ? `${(_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.clientWidth}px` : undefined;\n        setPopupWidth(width);\n    }, [\n        open\n    ]);\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            style: {\n                width: popupWidth\n            }\n        },\n        elementType: Listbox\n    }) : undefined;\n    [triggerSlot, listboxSlot] = useComboboxPopup(props, triggerSlot, listboxSlot);\n    [triggerSlot, listboxSlot] = useTriggerListboxSlots(props, baseState, ref, triggerSlot, listboxSlot);\n    const state = {\n        components: {\n            root: 'div',\n            button: 'button',\n            expandIcon: 'span',\n            listbox: Listbox\n        },\n        root: 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        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    state.root.ref = useMergedRefs(state.root.ref, rootRef);\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","rootRef","React","useRef","popupWidth","setPopupWidth","useState","useEffect","_rootRef_current","width","current","clientWidth","undefined","searchString","setKeyTimeout","clearKeyTimeout","useTimeout","getNextMatchingOption","matcher","optionText","toLowerCase","indexOf","matches","startIndex","id","length","letters","split","allSameLetter","every","letter","nextMatch","find","option","_matches_","onTriggerKeyDown","ev","getDropdownActionFromKey","key","nextOption","triggerSlot","listboxSlot","slot","always","button","defaultProps","type","children","value","placeholder","elementType","onKeyDown","mergeCallbacks","hasFocus","optional","listbox","renderByDefault","style","Listbox","useComboboxPopup","useTriggerListboxSlots","state","components","expandIcon","inlinePopup","createElement","ChevronDownIcon","placeholderVisible","useMergedRefs"],"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            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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"}

package/lib-commonjs/utils/{useComboboxPopup.js → useComboboxPositioning.js}

@@ -2,15 +2,16 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-Object.defineProperty(exports, "useComboboxPopup", {
+Object.defineProperty(exports, "useComboboxPositioning", {
     enumerable: true,
     get: function() {
-        return useComboboxPopup;
+        return useComboboxPositioning;
     }
 });
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _reactpositioning = require("@fluentui/react-positioning");
-const _reactutilities = require("@fluentui/react-utilities");
-function useComboboxPopup(props, triggerShorthand, listboxShorthand) {
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+function useComboboxPositioning(props) {
     const { positioning } = props;
     // Set a default set of fallback positions to try if the dropdown does not fit on screen
     const fallbackPositions = [
@@ -29,19 +30,12 @@ function useComboboxPopup(props, triggerShorthand, listboxShorthand) {
             mainAxis: 2
         },
         fallbackPositions,
+        matchTargetSize: 'width',
         ...(0, _reactpositioning.resolvePositioningShorthand)(positioning)
     };
     const { targetRef, containerRef } = (0, _reactpositioning.usePositioning)(popperOptions);
-    const listboxRef = (0, _reactutilities.useMergedRefs)(listboxShorthand === null || listboxShorthand === void 0 ? void 0 : listboxShorthand.ref, containerRef);
-    const listbox = listboxShorthand && {
-        ...listboxShorthand,
-        ref: listboxRef
-    };
     return [
-        {
-            ...triggerShorthand,
-            ref: (0, _reactutilities.useMergedRefs)(triggerShorthand === null || triggerShorthand === void 0 ? void 0 : triggerShorthand.ref, targetRef)
-        },
-        listbox
+        containerRef,
+        targetRef
     ];
 }

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

@@ -0,0 +1 @@
+{"version":3,"sources":["useComboboxPositioning.js"],"sourcesContent":["import { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport * as React from 'react';\nexport function useComboboxPositioning(props) {\n    const { positioning } = props;\n    // Set a default set of fallback positions to try if the dropdown does not fit on screen\n    const fallbackPositions = [\n        'above',\n        'after',\n        'after-top',\n        'before',\n        'before-top'\n    ];\n    // popper options\n    const popperOptions = {\n        position: 'below',\n        align: 'start',\n        offset: {\n            crossAxis: 0,\n            mainAxis: 2\n        },\n        fallbackPositions,\n        matchTargetSize: 'width',\n        ...resolvePositioningShorthand(positioning)\n    };\n    const { targetRef, containerRef } = usePositioning(popperOptions);\n    return [\n        containerRef,\n        targetRef\n    ];\n}\n"],"names":["useComboboxPositioning","props","positioning","fallbackPositions","popperOptions","position","align","offset","crossAxis","mainAxis","matchTargetSize","resolvePositioningShorthand","targetRef","containerRef","usePositioning"],"mappings":";;;;+BAEgBA;;;eAAAA;;;;kCAF4C;iEACrC;AAChB,SAASA,uBAAuBC,KAAK;IACxC,MAAM,EAAEC,WAAW,EAAE,GAAGD;IACxB,wFAAwF;IACxF,MAAME,oBAAoB;QACtB;QACA;QACA;QACA;QACA;KACH;IACD,iBAAiB;IACjB,MAAMC,gBAAgB;QAClBC,UAAU;QACVC,OAAO;QACPC,QAAQ;YACJC,WAAW;YACXC,UAAU;QACd;QACAN;QACAO,iBAAiB;QACjB,GAAGC,IAAAA,6CAA2B,EAACT,YAAY;IAC/C;IACA,MAAM,EAAEU,SAAS,EAAEC,YAAY,EAAE,GAAGC,IAAAA,gCAAc,EAACV;IACnD,OAAO;QACHS;QACAD;KACH;AACL"}

package/lib-commonjs/utils/useTriggerListboxSlots.js

@@ -10,6 +10,7 @@ Object.defineProperty(exports, "useTriggerListboxSlots", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const _reactutilities = require("@fluentui/react-utilities");
 const _dropdownKeyActions = require("../utils/dropdownKeyActions");
 function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
@@ -17,13 +18,16 @@ function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
     const { activeOption, getCount, getIndexOfId, getOptionAtIndex, ignoreNextBlur, open, selectOption, setActiveOption, setFocusVisible, setHasFocus, setOpen } = state;
     // handle trigger focus/blur
     const triggerRef = _react.useRef(null);
+    const listboxRef = _react.useRef(null);
     // resolve listbox shorthand props
     const listboxId = (0, _reactutilities.useId)('fluent-listbox', listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id);
+    const mergedListboxRef = (0, _reactutilities.useMergedRefs)(listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.ref, listboxRef);
     const listbox = listboxSlot && {
         id: listboxId,
         multiselect,
         tabIndex: undefined,
-        ...listboxSlot
+        ...listboxSlot,
+        ref: mergedListboxRef
     };
     // resolve trigger shorthand props
     const trigger = {
@@ -47,8 +51,17 @@ function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
     const listboxOnMouseOver = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)((event)=>{
         setFocusVisible(false);
     }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseOver));
+    const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
+    const documentOnMouseUp = (0, _reactutilities.useEventCallback)((ev)=>{
+        var _listboxRef_current;
+        if (!((_listboxRef_current = listboxRef.current) === null || _listboxRef_current === void 0 ? void 0 : _listboxRef_current.contains(ev.target))) {
+            setOpen(ev, false);
+        }
+        targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mouseup', documentOnMouseUp);
+    });
     const listboxOnMouseDown = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)((event)=>{
         ignoreNextBlur.current = true;
+        targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mouseup', documentOnMouseUp);
     }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseDown));
     // listbox is nullable, only add event handlers if it exists
     if (listbox) {

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

@@ -1 +1 @@
-{"version":3,"sources":["useTriggerListboxSlots.js"],"sourcesContent":["import * as React from 'react';\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    // resolve listbox shorthand props\n    const listboxId = useId('fluent-listbox', listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id);\n    const listbox = listboxSlot && {\n        id: listboxId,\n        multiselect,\n        tabIndex: undefined,\n        ...listboxSlot\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 listboxOnMouseDown = useEventCallback(mergeCallbacks((event)=>{\n        ignoreNextBlur.current = true;\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","listboxId","useId","id","listbox","tabIndex","undefined","trigger","role","useMergedRefs","listboxOnClick","useEventCallback","mergeCallbacks","event","_triggerRef_current","current","focus","onClick","listboxOnMouseOver","onMouseOver","listboxOnMouseDown","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    // 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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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-combobox",
-  "version": "9.5.27",
+  "version": "9.5.29",
   "description": "Fluent UI React Combobox component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -33,16 +33,16 @@
     "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
-    "@fluentui/keyboard-keys": "^9.0.6",
-    "@fluentui/react-context-selector": "^9.1.41",
-    "@fluentui/react-field": "^9.1.39",
+    "@fluentui/keyboard-keys": "^9.0.7",
+    "@fluentui/react-context-selector": "^9.1.42",
+    "@fluentui/react-field": "^9.1.41",
     "@fluentui/react-icons": "^2.0.217",
-    "@fluentui/react-jsx-runtime": "^9.0.18",
-    "@fluentui/react-portal": "^9.3.26",
-    "@fluentui/react-positioning": "^9.9.22",
-    "@fluentui/react-shared-contexts": "^9.11.0",
-    "@fluentui/react-theme": "^9.1.14",
-    "@fluentui/react-utilities": "^9.15.1",
+    "@fluentui/react-jsx-runtime": "^9.0.19",
+    "@fluentui/react-portal": "^9.4.0",
+    "@fluentui/react-positioning": "^9.10.0",
+    "@fluentui/react-shared-contexts": "^9.12.0",
+    "@fluentui/react-theme": "^9.1.16",
+    "@fluentui/react-utilities": "^9.15.2",
     "@griffel/react": "^1.5.14",
     "@swc/helpers": "^0.5.1"
   },
@@ -67,5 +67,11 @@
       "require": "./lib-commonjs/index.js"
     },
     "./package.json": "./package.json"
-  }
+  },
+  "files": [
+    "*.md",
+    "dist/*.d.ts",
+    "lib",
+    "lib-commonjs"
+  ]
 }