@fluentui/react-combobox 9.5.16 → 9.5.18

package/lib-commonjs/components/Listbox/useListbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useListbox.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, mergeCallbacks, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useContextSelector, useHasParentContext } from '@fluentui/react-context-selector';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../../utils/dropdownKeyActions';\nimport { useOptionCollection } from '../../utils/useOptionCollection';\nimport { useScrollOptionsIntoView } from '../../utils/useScrollOptionsIntoView';\nimport { useSelection } from '../../utils/useSelection';\nimport { ComboboxContext } from '../../contexts/ComboboxContext';\n/**\n * Create the state required to render Listbox.\n *\n * The returned state can be modified with hooks such as useListboxStyles_unstable,\n * before being passed to renderListbox_unstable.\n *\n * @param props - props from this instance of Listbox\n * @param ref - reference to root HTMLElement of Listbox\n */ export const useListbox_unstable = (props, ref)=>{\n    var _activeOption;\n    const { multiselect } = props;\n    const optionCollection = useOptionCollection();\n    const { getCount, getOptionAtIndex, getIndexOfId } = optionCollection;\n    const { clearSelection, selectedOptions, selectOption } = useSelection(props);\n    const [activeOption, setActiveOption] = React.useState();\n    // track whether keyboard focus outline should be shown\n    // tabster/keyborg doesn't work here, since the actual keyboard focus target doesn't move\n    const [focusVisible, setFocusVisible] = React.useState(false);\n    const onKeyDown = (event)=>{\n        const action = getDropdownActionFromKey(event, {\n            open: true\n        });\n        const maxIndex = getCount() - 1;\n        const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n        let newIndex = activeIndex;\n        switch(action){\n            case 'Select':\n            case 'CloseSelect':\n                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    const onMouseOver = (event)=>{\n        setFocusVisible(false);\n    };\n    // get state from parent combobox, if it exists\n    const hasComboboxContext = useHasParentContext(ComboboxContext);\n    const comboboxActiveOption = useContextSelector(ComboboxContext, (ctx)=>ctx.activeOption);\n    const comboboxFocusVisible = useContextSelector(ComboboxContext, (ctx)=>ctx.focusVisible);\n    const comboboxSelectedOptions = useContextSelector(ComboboxContext, (ctx)=>ctx.selectedOptions);\n    const comboboxSelectOption = useContextSelector(ComboboxContext, (ctx)=>ctx.selectOption);\n    const comboboxSetActiveOption = useContextSelector(ComboboxContext, (ctx)=>ctx.setActiveOption);\n    // without a parent combobox context, provide values directly from Listbox\n    const optionContextValues = hasComboboxContext ? {\n        activeOption: comboboxActiveOption,\n        focusVisible: comboboxFocusVisible,\n        selectedOptions: comboboxSelectedOptions,\n        selectOption: comboboxSelectOption,\n        setActiveOption: comboboxSetActiveOption\n    } : {\n        activeOption,\n        focusVisible,\n        selectedOptions,\n        selectOption,\n        setActiveOption\n    };\n    const state = {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            role: multiselect ? 'menu' : 'listbox',\n            'aria-activedescendant': hasComboboxContext ? undefined : (_activeOption = activeOption) === null || _activeOption === void 0 ? void 0 : _activeOption.id,\n            'aria-multiselectable': multiselect,\n            tabIndex: 0,\n            ...props\n        }), {\n            elementType: 'div'\n        }),\n        multiselect,\n        clearSelection,\n        ...optionCollection,\n        ...optionContextValues\n    };\n    const scrollContainerRef = useScrollOptionsIntoView(state);\n    state.root.ref = useMergedRefs(state.root.ref, scrollContainerRef);\n    state.root.onKeyDown = useEventCallback(mergeCallbacks(state.root.onKeyDown, onKeyDown));\n    state.root.onMouseOver = useEventCallback(mergeCallbacks(state.root.onMouseOver, onMouseOver));\n    return state;\n};\n"],"names":["useListbox_unstable","props","ref","_activeOption","multiselect","optionCollection","useOptionCollection","getCount","getOptionAtIndex","getIndexOfId","clearSelection","selectedOptions","selectOption","useSelection","activeOption","setActiveOption","React","useState","focusVisible","setFocusVisible","onKeyDown","event","action","getDropdownActionFromKey","open","maxIndex","activeIndex","id","newIndex","getIndexFromAction","preventDefault","onMouseOver","hasComboboxContext","useHasParentContext","ComboboxContext","comboboxActiveOption","useContextSelector","ctx","comboboxFocusVisible","comboboxSelectedOptions","comboboxSelectOption","comboboxSetActiveOption","optionContextValues","state","components","root","slot","always","getNativeElementProps","role","undefined","tabIndex","elementType","scrollContainerRef","useScrollOptionsIntoView","useMergedRefs","useEventCallback","mergeCallbacks"],"mappings":"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"}
+{"version":3,"sources":["useListbox.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, mergeCallbacks, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useContextSelector, useHasParentContext } from '@fluentui/react-context-selector';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../../utils/dropdownKeyActions';\nimport { useOptionCollection } from '../../utils/useOptionCollection';\nimport { useScrollOptionsIntoView } from '../../utils/useScrollOptionsIntoView';\nimport { useSelection } from '../../utils/useSelection';\nimport { ComboboxContext } from '../../contexts/ComboboxContext';\n/**\n * Create the state required to render Listbox.\n *\n * The returned state can be modified with hooks such as useListboxStyles_unstable,\n * before being passed to renderListbox_unstable.\n *\n * @param props - props from this instance of Listbox\n * @param ref - reference to root HTMLElement of Listbox\n */ export const useListbox_unstable = (props, ref)=>{\n    const { multiselect } = props;\n    const optionCollection = useOptionCollection();\n    const { getCount, getOptionAtIndex, getIndexOfId } = optionCollection;\n    const { clearSelection, selectedOptions, selectOption } = useSelection(props);\n    const [activeOption, setActiveOption] = React.useState();\n    // track whether keyboard focus outline should be shown\n    // tabster/keyborg doesn't work here, since the actual keyboard focus target doesn't move\n    const [focusVisible, setFocusVisible] = React.useState(false);\n    const onKeyDown = (event)=>{\n        const action = getDropdownActionFromKey(event, {\n            open: true\n        });\n        const maxIndex = getCount() - 1;\n        const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n        let newIndex = activeIndex;\n        switch(action){\n            case 'Select':\n            case 'CloseSelect':\n                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    const onMouseOver = (event)=>{\n        setFocusVisible(false);\n    };\n    // get state from parent combobox, if it exists\n    const hasComboboxContext = useHasParentContext(ComboboxContext);\n    const comboboxActiveOption = useContextSelector(ComboboxContext, (ctx)=>ctx.activeOption);\n    const comboboxFocusVisible = useContextSelector(ComboboxContext, (ctx)=>ctx.focusVisible);\n    const comboboxSelectedOptions = useContextSelector(ComboboxContext, (ctx)=>ctx.selectedOptions);\n    const comboboxSelectOption = useContextSelector(ComboboxContext, (ctx)=>ctx.selectOption);\n    const comboboxSetActiveOption = useContextSelector(ComboboxContext, (ctx)=>ctx.setActiveOption);\n    // without a parent combobox context, provide values directly from Listbox\n    const optionContextValues = hasComboboxContext ? {\n        activeOption: comboboxActiveOption,\n        focusVisible: comboboxFocusVisible,\n        selectedOptions: comboboxSelectedOptions,\n        selectOption: comboboxSelectOption,\n        setActiveOption: comboboxSetActiveOption\n    } : {\n        activeOption,\n        focusVisible,\n        selectedOptions,\n        selectOption,\n        setActiveOption\n    };\n    const state = {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            role: multiselect ? 'menu' : 'listbox',\n            'aria-activedescendant': hasComboboxContext ? undefined : activeOption === null || activeOption === void 0 ? void 0 : activeOption.id,\n            'aria-multiselectable': multiselect,\n            tabIndex: 0,\n            ...props\n        }), {\n            elementType: 'div'\n        }),\n        multiselect,\n        clearSelection,\n        ...optionCollection,\n        ...optionContextValues\n    };\n    const scrollContainerRef = useScrollOptionsIntoView(state);\n    state.root.ref = useMergedRefs(state.root.ref, scrollContainerRef);\n    state.root.onKeyDown = useEventCallback(mergeCallbacks(state.root.onKeyDown, onKeyDown));\n    state.root.onMouseOver = useEventCallback(mergeCallbacks(state.root.onMouseOver, onMouseOver));\n    return state;\n};\n"],"names":["useListbox_unstable","props","ref","multiselect","optionCollection","useOptionCollection","getCount","getOptionAtIndex","getIndexOfId","clearSelection","selectedOptions","selectOption","useSelection","activeOption","setActiveOption","React","useState","focusVisible","setFocusVisible","onKeyDown","event","action","getDropdownActionFromKey","open","maxIndex","activeIndex","id","newIndex","getIndexFromAction","preventDefault","onMouseOver","hasComboboxContext","useHasParentContext","ComboboxContext","comboboxActiveOption","useContextSelector","ctx","comboboxFocusVisible","comboboxSelectedOptions","comboboxSelectOption","comboboxSetActiveOption","optionContextValues","state","components","root","slot","always","getNativeElementProps","role","undefined","tabIndex","elementType","scrollContainerRef","useScrollOptionsIntoView","useMergedRefs","useEventCallback","mergeCallbacks"],"mappings":"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"}

package/lib-commonjs/components/Option/useOption.js

@@ -76,7 +76,7 @@ const useOption_unstable = (props, ref)=>{
         CheckIcon = selected ? /*#__PURE__*/ _react.createElement(_reacticons.Checkmark12Filled, null) : '';
     }
     const onClick = (event)=>{
-        var _props_onClick, _props;
+        var _props_onClick;
         if (disabled) {
             event.preventDefault();
             return;
@@ -85,12 +85,11 @@ const useOption_unstable = (props, ref)=>{
         setActiveOption(optionData);
         // close on option click for single-select options in a combobox
         if (!multiselect) {
-            var _setOpen;
-            (_setOpen = setOpen) === null || _setOpen === void 0 ? void 0 : _setOpen(event, false);
+            setOpen === null || setOpen === void 0 ? void 0 : setOpen(event, false);
         }
         // handle selection change
         selectOption(event, optionData);
-        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, event);
+        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);
     };
     // register option data with context
     _react.useEffect(()=>{

package/lib-commonjs/components/Option/useOption.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useOption.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useContextSelector } from '@fluentui/react-context-selector';\nimport { CheckmarkFilled, Checkmark12Filled } from '@fluentui/react-icons';\nimport { ComboboxContext } from '../../contexts/ComboboxContext';\nimport { ListboxContext } from '../../contexts/ListboxContext';\nfunction getTextString(text, children) {\n    if (text !== undefined) {\n        return text;\n    }\n    let textString = '';\n    let hasNonStringChild = false;\n    React.Children.forEach(children, (child)=>{\n        if (typeof child === 'string') {\n            textString += child;\n        } else {\n            hasNonStringChild = true;\n        }\n    });\n    // warn if an Option has non-string children and no text prop\n    if (hasNonStringChild) {\n        // eslint-disable-next-line no-console\n        console.warn('Provide a `text` prop to Option components when they contain non-string children.');\n    }\n    return textString;\n}\n/**\n * Create the state required to render Option.\n *\n * The returned state can be modified with hooks such as useOptionStyles_unstable,\n * before being passed to renderOption_unstable.\n *\n * @param props - props from this instance of Option\n * @param ref - reference to root HTMLElement of Option\n */ export const useOption_unstable = (props, ref)=>{\n    const { children, disabled, text, value } = props;\n    const optionRef = React.useRef(null);\n    const optionText = getTextString(text, children);\n    const optionValue = value !== null && value !== void 0 ? value : optionText;\n    // use the id if provided, otherwise use a generated id\n    const id = useId('fluent-option', props.id);\n    // data used for context registration & events\n    const optionData = React.useMemo(()=>({\n            id,\n            disabled,\n            text: optionText,\n            value: optionValue\n        }), [\n        id,\n        disabled,\n        optionText,\n        optionValue\n    ]);\n    // context values\n    const focusVisible = useContextSelector(ListboxContext, (ctx)=>ctx.focusVisible);\n    const multiselect = useContextSelector(ListboxContext, (ctx)=>ctx.multiselect);\n    const registerOption = useContextSelector(ListboxContext, (ctx)=>ctx.registerOption);\n    const selected = useContextSelector(ListboxContext, (ctx)=>{\n        const selectedOptions = ctx.selectedOptions;\n        return !!optionValue && !!selectedOptions.find((o)=>o === optionValue);\n    });\n    const selectOption = useContextSelector(ListboxContext, (ctx)=>ctx.selectOption);\n    const setActiveOption = useContextSelector(ListboxContext, (ctx)=>ctx.setActiveOption);\n    const setOpen = useContextSelector(ComboboxContext, (ctx)=>ctx.setOpen);\n    // current active option?\n    const active = useContextSelector(ListboxContext, (ctx)=>{\n        var _ctx_activeOption, _ctx_activeOption1;\n        return ((_ctx_activeOption = ctx.activeOption) === null || _ctx_activeOption === void 0 ? void 0 : _ctx_activeOption.id) !== undefined && ((_ctx_activeOption1 = ctx.activeOption) === null || _ctx_activeOption1 === void 0 ? void 0 : _ctx_activeOption1.id) === id;\n    });\n    // check icon\n    let CheckIcon = /*#__PURE__*/ React.createElement(CheckmarkFilled, null);\n    if (multiselect) {\n        CheckIcon = selected ? /*#__PURE__*/ React.createElement(Checkmark12Filled, null) : '';\n    }\n    const onClick = (event)=>{\n        var _props_onClick, _props;\n        if (disabled) {\n            event.preventDefault();\n            return;\n        }\n        // clicked option should always become active option\n        setActiveOption(optionData);\n        // close on option click for single-select options in a combobox\n        if (!multiselect) {\n            var _setOpen;\n            (_setOpen = setOpen) === null || _setOpen === void 0 ? void 0 : _setOpen(event, false);\n        }\n        // handle selection change\n        selectOption(event, optionData);\n        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, event);\n    };\n    // register option data with context\n    React.useEffect(()=>{\n        if (id && optionRef.current) {\n            return registerOption(optionData, optionRef.current);\n        }\n    }, [\n        id,\n        optionData,\n        registerOption\n    ]);\n    const semanticProps = multiselect ? {\n        role: 'menuitemcheckbox',\n        'aria-checked': selected\n    } : {\n        role: 'option',\n        'aria-selected': selected\n    };\n    return {\n        components: {\n            root: 'div',\n            checkIcon: 'span'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref: useMergedRefs(ref, optionRef),\n            'aria-disabled': disabled ? 'true' : undefined,\n            id,\n            ...semanticProps,\n            ...props,\n            onClick\n        }), {\n            elementType: 'div'\n        }),\n        checkIcon: slot.optional(props.checkIcon, {\n            renderByDefault: true,\n            defaultProps: {\n                'aria-hidden': 'true',\n                children: CheckIcon\n            },\n            elementType: 'span'\n        }),\n        active,\n        disabled,\n        focusVisible,\n        multiselect,\n        selected\n    };\n};\n"],"names":["useOption_unstable","getTextString","text","children","undefined","textString","hasNonStringChild","React","Children","forEach","child","console","warn","props","ref","disabled","value","optionRef","useRef","optionText","optionValue","id","useId","optionData","useMemo","focusVisible","useContextSelector","ListboxContext","ctx","multiselect","registerOption","selected","selectedOptions","find","o","selectOption","setActiveOption","setOpen","ComboboxContext","active","_ctx_activeOption","_ctx_activeOption1","activeOption","CheckIcon","createElement","CheckmarkFilled","Checkmark12Filled","onClick","event","_props_onClick","_props","preventDefault","_setOpen","call","useEffect","current","semanticProps","role","components","root","checkIcon","slot","always","getNativeElementProps","useMergedRefs","elementType","optional","renderByDefault","defaultProps"],"mappings":"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"}
+{"version":3,"sources":["useOption.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useContextSelector } from '@fluentui/react-context-selector';\nimport { CheckmarkFilled, Checkmark12Filled } from '@fluentui/react-icons';\nimport { ComboboxContext } from '../../contexts/ComboboxContext';\nimport { ListboxContext } from '../../contexts/ListboxContext';\nfunction getTextString(text, children) {\n    if (text !== undefined) {\n        return text;\n    }\n    let textString = '';\n    let hasNonStringChild = false;\n    React.Children.forEach(children, (child)=>{\n        if (typeof child === 'string') {\n            textString += child;\n        } else {\n            hasNonStringChild = true;\n        }\n    });\n    // warn if an Option has non-string children and no text prop\n    if (hasNonStringChild) {\n        // eslint-disable-next-line no-console\n        console.warn('Provide a `text` prop to Option components when they contain non-string children.');\n    }\n    return textString;\n}\n/**\n * Create the state required to render Option.\n *\n * The returned state can be modified with hooks such as useOptionStyles_unstable,\n * before being passed to renderOption_unstable.\n *\n * @param props - props from this instance of Option\n * @param ref - reference to root HTMLElement of Option\n */ export const useOption_unstable = (props, ref)=>{\n    const { children, disabled, text, value } = props;\n    const optionRef = React.useRef(null);\n    const optionText = getTextString(text, children);\n    const optionValue = value !== null && value !== void 0 ? value : optionText;\n    // use the id if provided, otherwise use a generated id\n    const id = useId('fluent-option', props.id);\n    // data used for context registration & events\n    const optionData = React.useMemo(()=>({\n            id,\n            disabled,\n            text: optionText,\n            value: optionValue\n        }), [\n        id,\n        disabled,\n        optionText,\n        optionValue\n    ]);\n    // context values\n    const focusVisible = useContextSelector(ListboxContext, (ctx)=>ctx.focusVisible);\n    const multiselect = useContextSelector(ListboxContext, (ctx)=>ctx.multiselect);\n    const registerOption = useContextSelector(ListboxContext, (ctx)=>ctx.registerOption);\n    const selected = useContextSelector(ListboxContext, (ctx)=>{\n        const selectedOptions = ctx.selectedOptions;\n        return !!optionValue && !!selectedOptions.find((o)=>o === optionValue);\n    });\n    const selectOption = useContextSelector(ListboxContext, (ctx)=>ctx.selectOption);\n    const setActiveOption = useContextSelector(ListboxContext, (ctx)=>ctx.setActiveOption);\n    const setOpen = useContextSelector(ComboboxContext, (ctx)=>ctx.setOpen);\n    // current active option?\n    const active = useContextSelector(ListboxContext, (ctx)=>{\n        var _ctx_activeOption, _ctx_activeOption1;\n        return ((_ctx_activeOption = ctx.activeOption) === null || _ctx_activeOption === void 0 ? void 0 : _ctx_activeOption.id) !== undefined && ((_ctx_activeOption1 = ctx.activeOption) === null || _ctx_activeOption1 === void 0 ? void 0 : _ctx_activeOption1.id) === id;\n    });\n    // check icon\n    let CheckIcon = /*#__PURE__*/ React.createElement(CheckmarkFilled, null);\n    if (multiselect) {\n        CheckIcon = selected ? /*#__PURE__*/ React.createElement(Checkmark12Filled, null) : '';\n    }\n    const onClick = (event)=>{\n        var _props_onClick;\n        if (disabled) {\n            event.preventDefault();\n            return;\n        }\n        // clicked option should always become active option\n        setActiveOption(optionData);\n        // close on option click for single-select options in a combobox\n        if (!multiselect) {\n            setOpen === null || setOpen === void 0 ? void 0 : setOpen(event, false);\n        }\n        // handle selection change\n        selectOption(event, optionData);\n        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);\n    };\n    // register option data with context\n    React.useEffect(()=>{\n        if (id && optionRef.current) {\n            return registerOption(optionData, optionRef.current);\n        }\n    }, [\n        id,\n        optionData,\n        registerOption\n    ]);\n    const semanticProps = multiselect ? {\n        role: 'menuitemcheckbox',\n        'aria-checked': selected\n    } : {\n        role: 'option',\n        'aria-selected': selected\n    };\n    return {\n        components: {\n            root: 'div',\n            checkIcon: 'span'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref: useMergedRefs(ref, optionRef),\n            'aria-disabled': disabled ? 'true' : undefined,\n            id,\n            ...semanticProps,\n            ...props,\n            onClick\n        }), {\n            elementType: 'div'\n        }),\n        checkIcon: slot.optional(props.checkIcon, {\n            renderByDefault: true,\n            defaultProps: {\n                'aria-hidden': 'true',\n                children: CheckIcon\n            },\n            elementType: 'span'\n        }),\n        active,\n        disabled,\n        focusVisible,\n        multiselect,\n        selected\n    };\n};\n"],"names":["useOption_unstable","getTextString","text","children","undefined","textString","hasNonStringChild","React","Children","forEach","child","console","warn","props","ref","disabled","value","optionRef","useRef","optionText","optionValue","id","useId","optionData","useMemo","focusVisible","useContextSelector","ListboxContext","ctx","multiselect","registerOption","selected","selectedOptions","find","o","selectOption","setActiveOption","setOpen","ComboboxContext","active","_ctx_activeOption","_ctx_activeOption1","activeOption","CheckIcon","createElement","CheckmarkFilled","Checkmark12Filled","onClick","event","_props_onClick","preventDefault","call","useEffect","current","semanticProps","role","components","root","checkIcon","slot","always","getNativeElementProps","useMergedRefs","elementType","optional","renderByDefault","defaultProps"],"mappings":"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"}

package/lib-commonjs/utils/useComboboxBaseState.js

@@ -68,8 +68,7 @@ const useComboboxBaseState = (props)=>{
         initialState: false
     });
     const setOpen = _react.useCallback((event, newState)=>{
-        var _onOpenChange;
-        (_onOpenChange = onOpenChange) === null || _onOpenChange === void 0 ? void 0 : _onOpenChange(event, {
+        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(event, {
             open: newState
         });
         setOpenState(newState);

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

@@ -1 +1 @@
-{"version":3,"sources":["useComboboxBaseState.js"],"sourcesContent":["import * as React from 'react';\nimport { useControllableState, useFirstMount } from '@fluentui/react-utilities';\nimport { useOptionCollection } from '../utils/useOptionCollection';\nimport { useSelection } from '../utils/useSelection';\n/**\n * State shared between Combobox and Dropdown components\n */ export const useComboboxBaseState = (props)=>{\n    const { appearance = 'outline', children, editable = false, inlinePopup = false, mountNode = undefined, multiselect, onOpenChange, size = 'medium' } = props;\n    const optionCollection = useOptionCollection();\n    const { getOptionAtIndex, getOptionsMatchingValue } = optionCollection;\n    const [activeOption, setActiveOption] = React.useState();\n    // track whether keyboard focus outline should be shown\n    // tabster/keyborg doesn't work here, since the actual keyboard focus target doesn't move\n    const [focusVisible, setFocusVisible] = React.useState(false);\n    // track focused state to conditionally render collapsed listbox\n    const [hasFocus, setHasFocus] = React.useState(false);\n    const ignoreNextBlur = React.useRef(false);\n    const selectionState = useSelection(props);\n    const { selectedOptions } = selectionState;\n    // calculate value based on props, internal value changes, and selected options\n    const isFirstMount = useFirstMount();\n    const [controllableValue, setValue] = useControllableState({\n        state: props.value,\n        initialState: undefined\n    });\n    const value = React.useMemo(()=>{\n        // don't compute the value if it is defined through props or setValue,\n        if (controllableValue !== undefined) {\n            return controllableValue;\n        }\n        // handle defaultValue here, so it is overridden by selection\n        if (isFirstMount && props.defaultValue !== undefined) {\n            return props.defaultValue;\n        }\n        const selectedOptionsText = getOptionsMatchingValue((optionValue)=>{\n            return selectedOptions.includes(optionValue);\n        }).map((option)=>option.text);\n        if (multiselect) {\n            // editable inputs should not display multiple selected options in the input as text\n            return editable ? '' : selectedOptionsText.join(', ');\n        }\n        return selectedOptionsText[0];\n    // do not change value after isFirstMount changes,\n    // we do not want to accidentally override defaultValue on a second render\n    // unless another value is intentionally set\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [\n        controllableValue,\n        editable,\n        getOptionsMatchingValue,\n        multiselect,\n        props.defaultValue,\n        selectedOptions\n    ]);\n    // Handle open state, which is shared with options in context\n    const [open, setOpenState] = useControllableState({\n        state: props.open,\n        defaultState: props.defaultOpen,\n        initialState: false\n    });\n    const setOpen = React.useCallback((event, newState)=>{\n        var _onOpenChange;\n        (_onOpenChange = onOpenChange) === null || _onOpenChange === void 0 ? void 0 : _onOpenChange(event, {\n            open: newState\n        });\n        setOpenState(newState);\n    }, [\n        onOpenChange,\n        setOpenState\n    ]);\n    // update active option based on change in open state or children\n    React.useEffect(()=>{\n        if (open && !activeOption) {\n            // if it is single-select and there is a selected option, start at the selected option\n            if (!multiselect && selectedOptions.length > 0) {\n                const selectedOption = getOptionsMatchingValue((v)=>v === selectedOptions[0]).pop();\n                selectedOption && setActiveOption(selectedOption);\n            } else {\n                setActiveOption(getOptionAtIndex(0));\n            }\n        } else if (!open) {\n            // reset the active option when closing\n            setActiveOption(undefined);\n        }\n    // this should only be run in response to changes in the open state or children\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [\n        open,\n        children\n    ]);\n    return {\n        ...optionCollection,\n        ...selectionState,\n        activeOption,\n        appearance,\n        focusVisible,\n        hasFocus,\n        ignoreNextBlur,\n        inlinePopup,\n        mountNode,\n        open,\n        setActiveOption,\n        setFocusVisible,\n        setHasFocus,\n        setOpen,\n        setValue,\n        size,\n        value\n    };\n};\n"],"names":["useComboboxBaseState","props","appearance","children","editable","inlinePopup","mountNode","undefined","multiselect","onOpenChange","size","optionCollection","useOptionCollection","getOptionAtIndex","getOptionsMatchingValue","activeOption","setActiveOption","React","useState","focusVisible","setFocusVisible","hasFocus","setHasFocus","ignoreNextBlur","useRef","selectionState","useSelection","selectedOptions","isFirstMount","useFirstMount","controllableValue","setValue","useControllableState","state","value","initialState","useMemo","defaultValue","selectedOptionsText","optionValue","includes","map","option","text","join","open","setOpenState","defaultState","defaultOpen","setOpen","useCallback","event","newState","_onOpenChange","useEffect","length","selectedOption","v","pop"],"mappings":"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"}
+{"version":3,"sources":["useComboboxBaseState.js"],"sourcesContent":["import * as React from 'react';\nimport { useControllableState, useFirstMount } from '@fluentui/react-utilities';\nimport { useOptionCollection } from '../utils/useOptionCollection';\nimport { useSelection } from '../utils/useSelection';\n/**\n * State shared between Combobox and Dropdown components\n */ export const useComboboxBaseState = (props)=>{\n    const { appearance = 'outline', children, editable = false, inlinePopup = false, mountNode = undefined, multiselect, onOpenChange, size = 'medium' } = props;\n    const optionCollection = useOptionCollection();\n    const { getOptionAtIndex, getOptionsMatchingValue } = optionCollection;\n    const [activeOption, setActiveOption] = React.useState();\n    // track whether keyboard focus outline should be shown\n    // tabster/keyborg doesn't work here, since the actual keyboard focus target doesn't move\n    const [focusVisible, setFocusVisible] = React.useState(false);\n    // track focused state to conditionally render collapsed listbox\n    const [hasFocus, setHasFocus] = React.useState(false);\n    const ignoreNextBlur = React.useRef(false);\n    const selectionState = useSelection(props);\n    const { selectedOptions } = selectionState;\n    // calculate value based on props, internal value changes, and selected options\n    const isFirstMount = useFirstMount();\n    const [controllableValue, setValue] = useControllableState({\n        state: props.value,\n        initialState: undefined\n    });\n    const value = React.useMemo(()=>{\n        // don't compute the value if it is defined through props or setValue,\n        if (controllableValue !== undefined) {\n            return controllableValue;\n        }\n        // handle defaultValue here, so it is overridden by selection\n        if (isFirstMount && props.defaultValue !== undefined) {\n            return props.defaultValue;\n        }\n        const selectedOptionsText = getOptionsMatchingValue((optionValue)=>{\n            return selectedOptions.includes(optionValue);\n        }).map((option)=>option.text);\n        if (multiselect) {\n            // editable inputs should not display multiple selected options in the input as text\n            return editable ? '' : selectedOptionsText.join(', ');\n        }\n        return selectedOptionsText[0];\n    // do not change value after isFirstMount changes,\n    // we do not want to accidentally override defaultValue on a second render\n    // unless another value is intentionally set\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [\n        controllableValue,\n        editable,\n        getOptionsMatchingValue,\n        multiselect,\n        props.defaultValue,\n        selectedOptions\n    ]);\n    // Handle open state, which is shared with options in context\n    const [open, setOpenState] = useControllableState({\n        state: props.open,\n        defaultState: props.defaultOpen,\n        initialState: false\n    });\n    const setOpen = React.useCallback((event, newState)=>{\n        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(event, {\n            open: newState\n        });\n        setOpenState(newState);\n    }, [\n        onOpenChange,\n        setOpenState\n    ]);\n    // update active option based on change in open state or children\n    React.useEffect(()=>{\n        if (open && !activeOption) {\n            // if it is single-select and there is a selected option, start at the selected option\n            if (!multiselect && selectedOptions.length > 0) {\n                const selectedOption = getOptionsMatchingValue((v)=>v === selectedOptions[0]).pop();\n                selectedOption && setActiveOption(selectedOption);\n            } else {\n                setActiveOption(getOptionAtIndex(0));\n            }\n        } else if (!open) {\n            // reset the active option when closing\n            setActiveOption(undefined);\n        }\n    // this should only be run in response to changes in the open state or children\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [\n        open,\n        children\n    ]);\n    return {\n        ...optionCollection,\n        ...selectionState,\n        activeOption,\n        appearance,\n        focusVisible,\n        hasFocus,\n        ignoreNextBlur,\n        inlinePopup,\n        mountNode,\n        open,\n        setActiveOption,\n        setFocusVisible,\n        setHasFocus,\n        setOpen,\n        setValue,\n        size,\n        value\n    };\n};\n"],"names":["useComboboxBaseState","props","appearance","children","editable","inlinePopup","mountNode","undefined","multiselect","onOpenChange","size","optionCollection","useOptionCollection","getOptionAtIndex","getOptionsMatchingValue","activeOption","setActiveOption","React","useState","focusVisible","setFocusVisible","hasFocus","setHasFocus","ignoreNextBlur","useRef","selectionState","useSelection","selectedOptions","isFirstMount","useFirstMount","controllableValue","setValue","useControllableState","state","value","initialState","useMemo","defaultValue","selectedOptionsText","optionValue","includes","map","option","text","join","open","setOpenState","defaultState","defaultOpen","setOpen","useCallback","event","newState","useEffect","length","selectedOption","v","pop"],"mappings":"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"}

package/lib-commonjs/utils/useComboboxPopup.js

@@ -11,7 +11,6 @@ Object.defineProperty(exports, "useComboboxPopup", {
 const _reactpositioning = require("@fluentui/react-positioning");
 const _reactutilities = require("@fluentui/react-utilities");
 function useComboboxPopup(props, triggerShorthand, listboxShorthand) {
-    var _listboxShorthand, _triggerShorthand;
     const { positioning } = props;
     // Set a default set of fallback positions to try if the dropdown does not fit on screen
     const fallbackPositions = [
@@ -33,7 +32,7 @@ function useComboboxPopup(props, triggerShorthand, listboxShorthand) {
         ...(0, _reactpositioning.resolvePositioningShorthand)(positioning)
     };
     const { targetRef, containerRef } = (0, _reactpositioning.usePositioning)(popperOptions);
-    const listboxRef = (0, _reactutilities.useMergedRefs)((_listboxShorthand = listboxShorthand) === null || _listboxShorthand === void 0 ? void 0 : _listboxShorthand.ref, containerRef);
+    const listboxRef = (0, _reactutilities.useMergedRefs)(listboxShorthand === null || listboxShorthand === void 0 ? void 0 : listboxShorthand.ref, containerRef);
     const listbox = listboxShorthand && {
         ...listboxShorthand,
         ref: listboxRef
@@ -41,7 +40,7 @@ function useComboboxPopup(props, triggerShorthand, listboxShorthand) {
     return [
         {
             ...triggerShorthand,
-            ref: (0, _reactutilities.useMergedRefs)((_triggerShorthand = triggerShorthand) === null || _triggerShorthand === void 0 ? void 0 : _triggerShorthand.ref, targetRef)
+            ref: (0, _reactutilities.useMergedRefs)(triggerShorthand === null || triggerShorthand === void 0 ? void 0 : triggerShorthand.ref, targetRef)
         },
         listbox
     ];

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

@@ -1 +1 @@
-{"version":3,"sources":["useComboboxPopup.js"],"sourcesContent":["import { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport { useMergedRefs } from '@fluentui/react-utilities';\nexport function useComboboxPopup(props, triggerShorthand, listboxShorthand) {\n    var _listboxShorthand, _triggerShorthand;\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        ...resolvePositioningShorthand(positioning)\n    };\n    const { targetRef, containerRef } = usePositioning(popperOptions);\n    const listboxRef = useMergedRefs((_listboxShorthand = listboxShorthand) === null || _listboxShorthand === void 0 ? void 0 : _listboxShorthand.ref, containerRef);\n    const listbox = listboxShorthand && {\n        ...listboxShorthand,\n        ref: listboxRef\n    };\n    return [\n        {\n            ...triggerShorthand,\n            ref: useMergedRefs((_triggerShorthand = triggerShorthand) === null || _triggerShorthand === void 0 ? void 0 : _triggerShorthand.ref, targetRef)\n        },\n        listbox\n    ];\n}\n"],"names":["useComboboxPopup","props","triggerShorthand","listboxShorthand","_listboxShorthand","_triggerShorthand","positioning","fallbackPositions","popperOptions","position","align","offset","crossAxis","mainAxis","resolvePositioningShorthand","targetRef","containerRef","usePositioning","listboxRef","useMergedRefs","ref","listbox"],"mappings":";;;;+BAEgBA;;;eAAAA;;;kCAF4C;gCAC9B;AACvB,SAASA,iBAAiBC,KAAK,EAAEC,gBAAgB,EAAEC,gBAAgB;IACtE,IAAIC,mBAAmBC;IACvB,MAAM,EAAEC,WAAW,EAAE,GAAGL;IACxB,wFAAwF;IACxF,MAAMM,oBAAoB;QACtB;QACA;QACA;QACA;QACA;KACH;IACD,iBAAiB;IACjB,MAAMC,gBAAgB;QAClBC,UAAU;QACVC,OAAO;QACPC,QAAQ;YACJC,WAAW;YACXC,UAAU;QACd;QACAN;QACA,GAAGO,IAAAA,6CAA2B,EAACR,YAAY;IAC/C;IACA,MAAM,EAAES,SAAS,EAAEC,YAAY,EAAE,GAAGC,IAAAA,gCAAc,EAACT;IACnD,MAAMU,aAAaC,IAAAA,6BAAa,EAAC,AAACf,CAAAA,oBAAoBD,gBAAe,MAAO,QAAQC,sBAAsB,KAAK,IAAI,KAAK,IAAIA,kBAAkBgB,GAAG,EAAEJ;IACnJ,MAAMK,UAAUlB,oBAAoB;QAChC,GAAGA,gBAAgB;QACnBiB,KAAKF;IACT;IACA,OAAO;QACH;YACI,GAAGhB,gBAAgB;YACnBkB,KAAKD,IAAAA,6BAAa,EAAC,AAACd,CAAAA,oBAAoBH,gBAAe,MAAO,QAAQG,sBAAsB,KAAK,IAAI,KAAK,IAAIA,kBAAkBe,GAAG,EAAEL;QACzI;QACAM;KACH;AACL"}
+{"version":3,"sources":["useComboboxPopup.js"],"sourcesContent":["import { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport { useMergedRefs } from '@fluentui/react-utilities';\nexport function useComboboxPopup(props, triggerShorthand, listboxShorthand) {\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        ...resolvePositioningShorthand(positioning)\n    };\n    const { targetRef, containerRef } = usePositioning(popperOptions);\n    const listboxRef = useMergedRefs(listboxShorthand === null || listboxShorthand === void 0 ? void 0 : listboxShorthand.ref, containerRef);\n    const listbox = listboxShorthand && {\n        ...listboxShorthand,\n        ref: listboxRef\n    };\n    return [\n        {\n            ...triggerShorthand,\n            ref: useMergedRefs(triggerShorthand === null || triggerShorthand === void 0 ? void 0 : triggerShorthand.ref, targetRef)\n        },\n        listbox\n    ];\n}\n"],"names":["useComboboxPopup","props","triggerShorthand","listboxShorthand","positioning","fallbackPositions","popperOptions","position","align","offset","crossAxis","mainAxis","resolvePositioningShorthand","targetRef","containerRef","usePositioning","listboxRef","useMergedRefs","ref","listbox"],"mappings":";;;;+BAEgBA;;;eAAAA;;;kCAF4C;gCAC9B;AACvB,SAASA,iBAAiBC,KAAK,EAAEC,gBAAgB,EAAEC,gBAAgB;IACtE,MAAM,EAAEC,WAAW,EAAE,GAAGH;IACxB,wFAAwF;IACxF,MAAMI,oBAAoB;QACtB;QACA;QACA;QACA;QACA;KACH;IACD,iBAAiB;IACjB,MAAMC,gBAAgB;QAClBC,UAAU;QACVC,OAAO;QACPC,QAAQ;YACJC,WAAW;YACXC,UAAU;QACd;QACAN;QACA,GAAGO,IAAAA,6CAA2B,EAACR,YAAY;IAC/C;IACA,MAAM,EAAES,SAAS,EAAEC,YAAY,EAAE,GAAGC,IAAAA,gCAAc,EAACT;IACnD,MAAMU,aAAaC,IAAAA,6BAAa,EAACd,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBe,GAAG,EAAEJ;IAC3H,MAAMK,UAAUhB,oBAAoB;QAChC,GAAGA,gBAAgB;QACnBe,KAAKF;IACT;IACA,OAAO;QACH;YACI,GAAGd,gBAAgB;YACnBgB,KAAKD,IAAAA,6BAAa,EAACf,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBgB,GAAG,EAAEL;QACjH;QACAM;KACH;AACL"}

package/lib-commonjs/utils/useOptionCollection.js

@@ -20,9 +20,8 @@ const useOptionCollection = ()=>{
         };
         const getIndexOfId = (id)=>nodes.current.findIndex((node)=>node.option.id === id);
         const getOptionById = (id)=>{
-            var _item;
             const item = nodes.current.find((node)=>node.option.id === id);
-            return (_item = item) === null || _item === void 0 ? void 0 : _item.option;
+            return item === null || item === void 0 ? void 0 : item.option;
         };
         const getOptionsMatchingText = (matcher)=>{
             return nodes.current.filter((node)=>matcher(node.option.text)).map((node)=>node.option);

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

@@ -1 +1 @@
-{"version":3,"sources":["useOptionCollection.js"],"sourcesContent":["import * as React from 'react';\n/**\n * A hook for managing a collection of child Options\n */ export const useOptionCollection = ()=>{\n    const nodes = React.useRef([]);\n    const collectionAPI = React.useMemo(()=>{\n        const getCount = ()=>nodes.current.length;\n        const getOptionAtIndex = (index)=>{\n            var _nodes_current_index;\n            return (_nodes_current_index = nodes.current[index]) === null || _nodes_current_index === void 0 ? void 0 : _nodes_current_index.option;\n        };\n        const getIndexOfId = (id)=>nodes.current.findIndex((node)=>node.option.id === id);\n        const getOptionById = (id)=>{\n            var _item;\n            const item = nodes.current.find((node)=>node.option.id === id);\n            return (_item = item) === null || _item === void 0 ? void 0 : _item.option;\n        };\n        const getOptionsMatchingText = (matcher)=>{\n            return nodes.current.filter((node)=>matcher(node.option.text)).map((node)=>node.option);\n        };\n        const getOptionsMatchingValue = (matcher)=>{\n            return nodes.current.filter((node)=>matcher(node.option.value)).map((node)=>node.option);\n        };\n        return {\n            getCount,\n            getOptionAtIndex,\n            getIndexOfId,\n            getOptionById,\n            getOptionsMatchingText,\n            getOptionsMatchingValue\n        };\n    }, []);\n    const registerOption = React.useCallback((option, element)=>{\n        var _nodes_current_index;\n        const index = nodes.current.findIndex((node)=>{\n            if (!node.element || !element) {\n                return false;\n            }\n            if (node.option.id === option.id) {\n                return true;\n            }\n            // use the DOM method compareDocumentPosition to order the current node against registered nodes\n            // eslint-disable-next-line no-bitwise\n            return node.element.compareDocumentPosition(element) & Node.DOCUMENT_POSITION_PRECEDING;\n        });\n        // do not register the option if it already exists\n        if (((_nodes_current_index = nodes.current[index]) === null || _nodes_current_index === void 0 ? void 0 : _nodes_current_index.option.id) !== option.id) {\n            const newItem = {\n                element,\n                option\n            };\n            // If an index is not found we will push the element to the end.\n            if (index === -1) {\n                nodes.current = [\n                    ...nodes.current,\n                    newItem\n                ];\n            } else {\n                nodes.current.splice(index, 0, newItem);\n            }\n        }\n        // return the unregister function\n        return ()=>{\n            nodes.current = nodes.current.filter((node)=>node.option.id !== option.id);\n        };\n    }, []);\n    return {\n        ...collectionAPI,\n        options: nodes.current.map((node)=>node.option),\n        registerOption\n    };\n};\n"],"names":["useOptionCollection","nodes","React","useRef","collectionAPI","useMemo","getCount","current","length","getOptionAtIndex","index","_nodes_current_index","option","getIndexOfId","id","findIndex","node","getOptionById","_item","item","find","getOptionsMatchingText","matcher","filter","text","map","getOptionsMatchingValue","value","registerOption","useCallback","element","compareDocumentPosition","Node","DOCUMENT_POSITION_PRECEDING","newItem","splice","options"],"mappings":";;;;+BAGiBA;;;eAAAA;;;;iEAHM;AAGZ,MAAMA,sBAAsB;IACnC,MAAMC,QAAQC,OAAMC,MAAM,CAAC,EAAE;IAC7B,MAAMC,gBAAgBF,OAAMG,OAAO,CAAC;QAChC,MAAMC,WAAW,IAAIL,MAAMM,OAAO,CAACC,MAAM;QACzC,MAAMC,mBAAmB,CAACC;YACtB,IAAIC;YACJ,OAAO,AAACA,CAAAA,uBAAuBV,MAAMM,OAAO,CAACG,MAAM,AAAD,MAAO,QAAQC,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBC,MAAM;QAC3I;QACA,MAAMC,eAAe,CAACC,KAAKb,MAAMM,OAAO,CAACQ,SAAS,CAAC,CAACC,OAAOA,KAAKJ,MAAM,CAACE,EAAE,KAAKA;QAC9E,MAAMG,gBAAgB,CAACH;YACnB,IAAII;YACJ,MAAMC,OAAOlB,MAAMM,OAAO,CAACa,IAAI,CAAC,CAACJ,OAAOA,KAAKJ,MAAM,CAACE,EAAE,KAAKA;YAC3D,OAAO,AAACI,CAAAA,QAAQC,IAAG,MAAO,QAAQD,UAAU,KAAK,IAAI,KAAK,IAAIA,MAAMN,MAAM;QAC9E;QACA,MAAMS,yBAAyB,CAACC;YAC5B,OAAOrB,MAAMM,OAAO,CAACgB,MAAM,CAAC,CAACP,OAAOM,QAAQN,KAAKJ,MAAM,CAACY,IAAI,GAAGC,GAAG,CAAC,CAACT,OAAOA,KAAKJ,MAAM;QAC1F;QACA,MAAMc,0BAA0B,CAACJ;YAC7B,OAAOrB,MAAMM,OAAO,CAACgB,MAAM,CAAC,CAACP,OAAOM,QAAQN,KAAKJ,MAAM,CAACe,KAAK,GAAGF,GAAG,CAAC,CAACT,OAAOA,KAAKJ,MAAM;QAC3F;QACA,OAAO;YACHN;YACAG;YACAI;YACAI;YACAI;YACAK;QACJ;IACJ,GAAG,EAAE;IACL,MAAME,iBAAiB1B,OAAM2B,WAAW,CAAC,CAACjB,QAAQkB;QAC9C,IAAInB;QACJ,MAAMD,QAAQT,MAAMM,OAAO,CAACQ,SAAS,CAAC,CAACC;YACnC,IAAI,CAACA,KAAKc,OAAO,IAAI,CAACA,SAAS;gBAC3B,OAAO;YACX;YACA,IAAId,KAAKJ,MAAM,CAACE,EAAE,KAAKF,OAAOE,EAAE,EAAE;gBAC9B,OAAO;YACX;YACA,gGAAgG;YAChG,sCAAsC;YACtC,OAAOE,KAAKc,OAAO,CAACC,uBAAuB,CAACD,WAAWE,KAAKC,2BAA2B;QAC3F;QACA,kDAAkD;QAClD,IAAI,AAAC,CAAA,AAACtB,CAAAA,uBAAuBV,MAAMM,OAAO,CAACG,MAAM,AAAD,MAAO,QAAQC,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBC,MAAM,CAACE,EAAE,AAAD,MAAOF,OAAOE,EAAE,EAAE;YACrJ,MAAMoB,UAAU;gBACZJ;gBACAlB;YACJ;YACA,gEAAgE;YAChE,IAAIF,UAAU,CAAC,GAAG;gBACdT,MAAMM,OAAO,GAAG;uBACTN,MAAMM,OAAO;oBAChB2B;iBACH;YACL,OAAO;gBACHjC,MAAMM,OAAO,CAAC4B,MAAM,CAACzB,OAAO,GAAGwB;YACnC;QACJ;QACA,iCAAiC;QACjC,OAAO;YACHjC,MAAMM,OAAO,GAAGN,MAAMM,OAAO,CAACgB,MAAM,CAAC,CAACP,OAAOA,KAAKJ,MAAM,CAACE,EAAE,KAAKF,OAAOE,EAAE;QAC7E;IACJ,GAAG,EAAE;IACL,OAAO;QACH,GAAGV,aAAa;QAChBgC,SAASnC,MAAMM,OAAO,CAACkB,GAAG,CAAC,CAACT,OAAOA,KAAKJ,MAAM;QAC9CgB;IACJ;AACJ"}
+{"version":3,"sources":["useOptionCollection.js"],"sourcesContent":["import * as React from 'react';\n/**\n * A hook for managing a collection of child Options\n */ export const useOptionCollection = ()=>{\n    const nodes = React.useRef([]);\n    const collectionAPI = React.useMemo(()=>{\n        const getCount = ()=>nodes.current.length;\n        const getOptionAtIndex = (index)=>{\n            var _nodes_current_index;\n            return (_nodes_current_index = nodes.current[index]) === null || _nodes_current_index === void 0 ? void 0 : _nodes_current_index.option;\n        };\n        const getIndexOfId = (id)=>nodes.current.findIndex((node)=>node.option.id === id);\n        const getOptionById = (id)=>{\n            const item = nodes.current.find((node)=>node.option.id === id);\n            return item === null || item === void 0 ? void 0 : item.option;\n        };\n        const getOptionsMatchingText = (matcher)=>{\n            return nodes.current.filter((node)=>matcher(node.option.text)).map((node)=>node.option);\n        };\n        const getOptionsMatchingValue = (matcher)=>{\n            return nodes.current.filter((node)=>matcher(node.option.value)).map((node)=>node.option);\n        };\n        return {\n            getCount,\n            getOptionAtIndex,\n            getIndexOfId,\n            getOptionById,\n            getOptionsMatchingText,\n            getOptionsMatchingValue\n        };\n    }, []);\n    const registerOption = React.useCallback((option, element)=>{\n        var _nodes_current_index;\n        const index = nodes.current.findIndex((node)=>{\n            if (!node.element || !element) {\n                return false;\n            }\n            if (node.option.id === option.id) {\n                return true;\n            }\n            // use the DOM method compareDocumentPosition to order the current node against registered nodes\n            // eslint-disable-next-line no-bitwise\n            return node.element.compareDocumentPosition(element) & Node.DOCUMENT_POSITION_PRECEDING;\n        });\n        // do not register the option if it already exists\n        if (((_nodes_current_index = nodes.current[index]) === null || _nodes_current_index === void 0 ? void 0 : _nodes_current_index.option.id) !== option.id) {\n            const newItem = {\n                element,\n                option\n            };\n            // If an index is not found we will push the element to the end.\n            if (index === -1) {\n                nodes.current = [\n                    ...nodes.current,\n                    newItem\n                ];\n            } else {\n                nodes.current.splice(index, 0, newItem);\n            }\n        }\n        // return the unregister function\n        return ()=>{\n            nodes.current = nodes.current.filter((node)=>node.option.id !== option.id);\n        };\n    }, []);\n    return {\n        ...collectionAPI,\n        options: nodes.current.map((node)=>node.option),\n        registerOption\n    };\n};\n"],"names":["useOptionCollection","nodes","React","useRef","collectionAPI","useMemo","getCount","current","length","getOptionAtIndex","index","_nodes_current_index","option","getIndexOfId","id","findIndex","node","getOptionById","item","find","getOptionsMatchingText","matcher","filter","text","map","getOptionsMatchingValue","value","registerOption","useCallback","element","compareDocumentPosition","Node","DOCUMENT_POSITION_PRECEDING","newItem","splice","options"],"mappings":";;;;+BAGiBA;;;eAAAA;;;;iEAHM;AAGZ,MAAMA,sBAAsB;IACnC,MAAMC,QAAQC,OAAMC,MAAM,CAAC,EAAE;IAC7B,MAAMC,gBAAgBF,OAAMG,OAAO,CAAC;QAChC,MAAMC,WAAW,IAAIL,MAAMM,OAAO,CAACC,MAAM;QACzC,MAAMC,mBAAmB,CAACC;YACtB,IAAIC;YACJ,OAAO,AAACA,CAAAA,uBAAuBV,MAAMM,OAAO,CAACG,MAAM,AAAD,MAAO,QAAQC,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBC,MAAM;QAC3I;QACA,MAAMC,eAAe,CAACC,KAAKb,MAAMM,OAAO,CAACQ,SAAS,CAAC,CAACC,OAAOA,KAAKJ,MAAM,CAACE,EAAE,KAAKA;QAC9E,MAAMG,gBAAgB,CAACH;YACnB,MAAMI,OAAOjB,MAAMM,OAAO,CAACY,IAAI,CAAC,CAACH,OAAOA,KAAKJ,MAAM,CAACE,EAAE,KAAKA;YAC3D,OAAOI,SAAS,QAAQA,SAAS,KAAK,IAAI,KAAK,IAAIA,KAAKN,MAAM;QAClE;QACA,MAAMQ,yBAAyB,CAACC;YAC5B,OAAOpB,MAAMM,OAAO,CAACe,MAAM,CAAC,CAACN,OAAOK,QAAQL,KAAKJ,MAAM,CAACW,IAAI,GAAGC,GAAG,CAAC,CAACR,OAAOA,KAAKJ,MAAM;QAC1F;QACA,MAAMa,0BAA0B,CAACJ;YAC7B,OAAOpB,MAAMM,OAAO,CAACe,MAAM,CAAC,CAACN,OAAOK,QAAQL,KAAKJ,MAAM,CAACc,KAAK,GAAGF,GAAG,CAAC,CAACR,OAAOA,KAAKJ,MAAM;QAC3F;QACA,OAAO;YACHN;YACAG;YACAI;YACAI;YACAG;YACAK;QACJ;IACJ,GAAG,EAAE;IACL,MAAME,iBAAiBzB,OAAM0B,WAAW,CAAC,CAAChB,QAAQiB;QAC9C,IAAIlB;QACJ,MAAMD,QAAQT,MAAMM,OAAO,CAACQ,SAAS,CAAC,CAACC;YACnC,IAAI,CAACA,KAAKa,OAAO,IAAI,CAACA,SAAS;gBAC3B,OAAO;YACX;YACA,IAAIb,KAAKJ,MAAM,CAACE,EAAE,KAAKF,OAAOE,EAAE,EAAE;gBAC9B,OAAO;YACX;YACA,gGAAgG;YAChG,sCAAsC;YACtC,OAAOE,KAAKa,OAAO,CAACC,uBAAuB,CAACD,WAAWE,KAAKC,2BAA2B;QAC3F;QACA,kDAAkD;QAClD,IAAI,AAAC,CAAA,AAACrB,CAAAA,uBAAuBV,MAAMM,OAAO,CAACG,MAAM,AAAD,MAAO,QAAQC,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBC,MAAM,CAACE,EAAE,AAAD,MAAOF,OAAOE,EAAE,EAAE;YACrJ,MAAMmB,UAAU;gBACZJ;gBACAjB;YACJ;YACA,gEAAgE;YAChE,IAAIF,UAAU,CAAC,GAAG;gBACdT,MAAMM,OAAO,GAAG;uBACTN,MAAMM,OAAO;oBAChB0B;iBACH;YACL,OAAO;gBACHhC,MAAMM,OAAO,CAAC2B,MAAM,CAACxB,OAAO,GAAGuB;YACnC;QACJ;QACA,iCAAiC;QACjC,OAAO;YACHhC,MAAMM,OAAO,GAAGN,MAAMM,OAAO,CAACe,MAAM,CAAC,CAACN,OAAOA,KAAKJ,MAAM,CAACE,EAAE,KAAKF,OAAOE,EAAE;QAC7E;IACJ,GAAG,EAAE;IACL,OAAO;QACH,GAAGV,aAAa;QAChB+B,SAASlC,MAAMM,OAAO,CAACiB,GAAG,CAAC,CAACR,OAAOA,KAAKJ,MAAM;QAC9Ce;IACJ;AACJ"}

package/lib-commonjs/utils/useSelection.js

@@ -18,7 +18,6 @@ const useSelection = (props)=>{
         initialState: []
     });
     const selectOption = (0, _react.useCallback)((event, option)=>{
-        var _onOptionSelect;
         // if the option is disabled, do nothing
         if (option.disabled) {
             return;
@@ -45,7 +44,7 @@ const useSelection = (props)=>{
             }
         }
         setSelectedOptions(newSelection);
-        (_onOptionSelect = onOptionSelect) === null || _onOptionSelect === void 0 ? void 0 : _onOptionSelect(event, {
+        onOptionSelect === null || onOptionSelect === void 0 ? void 0 : onOptionSelect(event, {
             optionValue: option.value,
             optionText: option.text,
             selectedOptions: newSelection
@@ -57,9 +56,8 @@ const useSelection = (props)=>{
         setSelectedOptions
     ]);
     const clearSelection = (event)=>{
-        var _onOptionSelect;
         setSelectedOptions([]);
-        (_onOptionSelect = onOptionSelect) === null || _onOptionSelect === void 0 ? void 0 : _onOptionSelect(event, {
+        onOptionSelect === null || onOptionSelect === void 0 ? void 0 : onOptionSelect(event, {
             optionValue: undefined,
             optionText: undefined,
             selectedOptions: []

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

@@ -1 +1 @@
-{"version":3,"sources":["useSelection.js"],"sourcesContent":["import { useCallback } from 'react';\nimport { useControllableState } from '@fluentui/react-utilities';\nexport const useSelection = (props)=>{\n    const { defaultSelectedOptions, multiselect, onOptionSelect } = props;\n    const [selectedOptions, setSelectedOptions] = useControllableState({\n        state: props.selectedOptions,\n        defaultState: defaultSelectedOptions,\n        initialState: []\n    });\n    const selectOption = useCallback((event, option)=>{\n        var _onOptionSelect;\n        // if the option is disabled, do nothing\n        if (option.disabled) {\n            return;\n        }\n        // for single-select, always return the selected option\n        let newSelection = [\n            option.value\n        ];\n        // toggle selected state of the option for multiselect\n        if (multiselect) {\n            const selectedIndex = selectedOptions.findIndex((o)=>o === option.value);\n            if (selectedIndex > -1) {\n                // deselect option\n                newSelection = [\n                    ...selectedOptions.slice(0, selectedIndex),\n                    ...selectedOptions.slice(selectedIndex + 1)\n                ];\n            } else {\n                // select option\n                newSelection = [\n                    ...selectedOptions,\n                    option.value\n                ];\n            }\n        }\n        setSelectedOptions(newSelection);\n        (_onOptionSelect = onOptionSelect) === null || _onOptionSelect === void 0 ? void 0 : _onOptionSelect(event, {\n            optionValue: option.value,\n            optionText: option.text,\n            selectedOptions: newSelection\n        });\n    }, [\n        onOptionSelect,\n        multiselect,\n        selectedOptions,\n        setSelectedOptions\n    ]);\n    const clearSelection = (event)=>{\n        var _onOptionSelect;\n        setSelectedOptions([]);\n        (_onOptionSelect = onOptionSelect) === null || _onOptionSelect === void 0 ? void 0 : _onOptionSelect(event, {\n            optionValue: undefined,\n            optionText: undefined,\n            selectedOptions: []\n        });\n    };\n    return {\n        clearSelection,\n        selectOption,\n        selectedOptions\n    };\n};\n"],"names":["useSelection","props","defaultSelectedOptions","multiselect","onOptionSelect","selectedOptions","setSelectedOptions","useControllableState","state","defaultState","initialState","selectOption","useCallback","event","option","_onOptionSelect","disabled","newSelection","value","selectedIndex","findIndex","o","slice","optionValue","optionText","text","clearSelection","undefined"],"mappings":";;;;+BAEaA;;;eAAAA;;;uBAFe;gCACS;AAC9B,MAAMA,eAAe,CAACC;IACzB,MAAM,EAAEC,sBAAsB,EAAEC,WAAW,EAAEC,cAAc,EAAE,GAAGH;IAChE,MAAM,CAACI,iBAAiBC,mBAAmB,GAAGC,IAAAA,oCAAoB,EAAC;QAC/DC,OAAOP,MAAMI,eAAe;QAC5BI,cAAcP;QACdQ,cAAc,EAAE;IACpB;IACA,MAAMC,eAAeC,IAAAA,kBAAW,EAAC,CAACC,OAAOC;QACrC,IAAIC;QACJ,wCAAwC;QACxC,IAAID,OAAOE,QAAQ,EAAE;YACjB;QACJ;QACA,uDAAuD;QACvD,IAAIC,eAAe;YACfH,OAAOI,KAAK;SACf;QACD,sDAAsD;QACtD,IAAIf,aAAa;YACb,MAAMgB,gBAAgBd,gBAAgBe,SAAS,CAAC,CAACC,IAAIA,MAAMP,OAAOI,KAAK;YACvE,IAAIC,gBAAgB,CAAC,GAAG;gBACpB,kBAAkB;gBAClBF,eAAe;uBACRZ,gBAAgBiB,KAAK,CAAC,GAAGH;uBACzBd,gBAAgBiB,KAAK,CAACH,gBAAgB;iBAC5C;YACL,OAAO;gBACH,gBAAgB;gBAChBF,eAAe;uBACRZ;oBACHS,OAAOI,KAAK;iBACf;YACL;QACJ;QACAZ,mBAAmBW;QAClBF,CAAAA,kBAAkBX,cAAa,MAAO,QAAQW,oBAAoB,KAAK,IAAI,KAAK,IAAIA,gBAAgBF,OAAO;YACxGU,aAAaT,OAAOI,KAAK;YACzBM,YAAYV,OAAOW,IAAI;YACvBpB,iBAAiBY;QACrB;IACJ,GAAG;QACCb;QACAD;QACAE;QACAC;KACH;IACD,MAAMoB,iBAAiB,CAACb;QACpB,IAAIE;QACJT,mBAAmB,EAAE;QACpBS,CAAAA,kBAAkBX,cAAa,MAAO,QAAQW,oBAAoB,KAAK,IAAI,KAAK,IAAIA,gBAAgBF,OAAO;YACxGU,aAAaI;YACbH,YAAYG;YACZtB,iBAAiB,EAAE;QACvB;IACJ;IACA,OAAO;QACHqB;QACAf;QACAN;IACJ;AACJ"}
+{"version":3,"sources":["useSelection.js"],"sourcesContent":["import { useCallback } from 'react';\nimport { useControllableState } from '@fluentui/react-utilities';\nexport const useSelection = (props)=>{\n    const { defaultSelectedOptions, multiselect, onOptionSelect } = props;\n    const [selectedOptions, setSelectedOptions] = useControllableState({\n        state: props.selectedOptions,\n        defaultState: defaultSelectedOptions,\n        initialState: []\n    });\n    const selectOption = useCallback((event, option)=>{\n        // if the option is disabled, do nothing\n        if (option.disabled) {\n            return;\n        }\n        // for single-select, always return the selected option\n        let newSelection = [\n            option.value\n        ];\n        // toggle selected state of the option for multiselect\n        if (multiselect) {\n            const selectedIndex = selectedOptions.findIndex((o)=>o === option.value);\n            if (selectedIndex > -1) {\n                // deselect option\n                newSelection = [\n                    ...selectedOptions.slice(0, selectedIndex),\n                    ...selectedOptions.slice(selectedIndex + 1)\n                ];\n            } else {\n                // select option\n                newSelection = [\n                    ...selectedOptions,\n                    option.value\n                ];\n            }\n        }\n        setSelectedOptions(newSelection);\n        onOptionSelect === null || onOptionSelect === void 0 ? void 0 : onOptionSelect(event, {\n            optionValue: option.value,\n            optionText: option.text,\n            selectedOptions: newSelection\n        });\n    }, [\n        onOptionSelect,\n        multiselect,\n        selectedOptions,\n        setSelectedOptions\n    ]);\n    const clearSelection = (event)=>{\n        setSelectedOptions([]);\n        onOptionSelect === null || onOptionSelect === void 0 ? void 0 : onOptionSelect(event, {\n            optionValue: undefined,\n            optionText: undefined,\n            selectedOptions: []\n        });\n    };\n    return {\n        clearSelection,\n        selectOption,\n        selectedOptions\n    };\n};\n"],"names":["useSelection","props","defaultSelectedOptions","multiselect","onOptionSelect","selectedOptions","setSelectedOptions","useControllableState","state","defaultState","initialState","selectOption","useCallback","event","option","disabled","newSelection","value","selectedIndex","findIndex","o","slice","optionValue","optionText","text","clearSelection","undefined"],"mappings":";;;;+BAEaA;;;eAAAA;;;uBAFe;gCACS;AAC9B,MAAMA,eAAe,CAACC;IACzB,MAAM,EAAEC,sBAAsB,EAAEC,WAAW,EAAEC,cAAc,EAAE,GAAGH;IAChE,MAAM,CAACI,iBAAiBC,mBAAmB,GAAGC,IAAAA,oCAAoB,EAAC;QAC/DC,OAAOP,MAAMI,eAAe;QAC5BI,cAAcP;QACdQ,cAAc,EAAE;IACpB;IACA,MAAMC,eAAeC,IAAAA,kBAAW,EAAC,CAACC,OAAOC;QACrC,wCAAwC;QACxC,IAAIA,OAAOC,QAAQ,EAAE;YACjB;QACJ;QACA,uDAAuD;QACvD,IAAIC,eAAe;YACfF,OAAOG,KAAK;SACf;QACD,sDAAsD;QACtD,IAAId,aAAa;YACb,MAAMe,gBAAgBb,gBAAgBc,SAAS,CAAC,CAACC,IAAIA,MAAMN,OAAOG,KAAK;YACvE,IAAIC,gBAAgB,CAAC,GAAG;gBACpB,kBAAkB;gBAClBF,eAAe;uBACRX,gBAAgBgB,KAAK,CAAC,GAAGH;uBACzBb,gBAAgBgB,KAAK,CAACH,gBAAgB;iBAC5C;YACL,OAAO;gBACH,gBAAgB;gBAChBF,eAAe;uBACRX;oBACHS,OAAOG,KAAK;iBACf;YACL;QACJ;QACAX,mBAAmBU;QACnBZ,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeS,OAAO;YAClFS,aAAaR,OAAOG,KAAK;YACzBM,YAAYT,OAAOU,IAAI;YACvBnB,iBAAiBW;QACrB;IACJ,GAAG;QACCZ;QACAD;QACAE;QACAC;KACH;IACD,MAAMmB,iBAAiB,CAACZ;QACpBP,mBAAmB,EAAE;QACrBF,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeS,OAAO;YAClFS,aAAaI;YACbH,YAAYG;YACZrB,iBAAiB,EAAE;QACvB;IACJ;IACA,OAAO;QACHoB;QACAd;QACAN;IACJ;AACJ"}

package/lib-commonjs/utils/useTriggerListboxSlots.js

@@ -13,13 +13,12 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _reactutilities = require("@fluentui/react-utilities");
 const _dropdownKeyActions = require("../utils/dropdownKeyActions");
 function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
-    var _listboxSlot, _activeOption, _triggerSlot, _listbox, _listbox1, _listbox2;
     const { multiselect } = props;
     const { activeOption, getCount, getIndexOfId, getOptionAtIndex, ignoreNextBlur, open, selectOption, setActiveOption, setFocusVisible, setHasFocus, setOpen } = state;
     // handle trigger focus/blur
     const triggerRef = _react.useRef(null);
     // resolve listbox shorthand props
-    const listboxId = (0, _reactutilities.useId)('fluent-listbox', (_listboxSlot = listboxSlot) === null || _listboxSlot === void 0 ? void 0 : _listboxSlot.id);
+    const listboxId = (0, _reactutilities.useId)('fluent-listbox', listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id);
     const listbox = listboxSlot && {
         id: listboxId,
         multiselect,
@@ -29,13 +28,13 @@ function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
     // resolve trigger shorthand props
     const trigger = {
         'aria-expanded': open,
-        'aria-activedescendant': open ? (_activeOption = activeOption) === null || _activeOption === void 0 ? void 0 : _activeOption.id : undefined,
+        'aria-activedescendant': open ? activeOption === null || activeOption === void 0 ? void 0 : activeOption.id : undefined,
         role: 'combobox',
         ...triggerSlot,
         // explicitly type the ref as an intersection here to prevent type errors
         // since the `children` prop has mutually incompatible types between input/button
         // functionally both ref and triggerRef will always be the same element type
-        ref: (0, _reactutilities.useMergedRefs)(ref, (_triggerSlot = triggerSlot) === null || _triggerSlot === void 0 ? void 0 : _triggerSlot.ref, triggerRef)
+        ref: (0, _reactutilities.useMergedRefs)(ref, triggerSlot === null || triggerSlot === void 0 ? void 0 : triggerSlot.ref, triggerRef)
     };
     /*
    * Handle focus when clicking the listbox popup:
@@ -44,13 +43,13 @@ function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
    */ const listboxOnClick = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)((event)=>{
         var _triggerRef_current;
         (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();
-    }, (_listbox = listbox) === null || _listbox === void 0 ? void 0 : _listbox.onClick));
+    }, listbox === null || listbox === void 0 ? void 0 : listbox.onClick));
     const listboxOnMouseOver = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)((event)=>{
         setFocusVisible(false);
-    }, (_listbox1 = listbox) === null || _listbox1 === void 0 ? void 0 : _listbox1.onMouseOver));
+    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseOver));
     const listboxOnMouseDown = (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)((event)=>{
         ignoreNextBlur.current = true;
-    }, (_listbox2 = listbox) === null || _listbox2 === void 0 ? void 0 : _listbox2.onMouseDown));
+    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseDown));
     // listbox is nullable, only add event handlers if it exists
     if (listbox) {
         listbox.onClick = listboxOnClick;
@@ -93,8 +92,7 @@ function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
                 setOpen(event, false);
                 break;
             case 'CloseSelect':
-                var _activeOption;
-                !multiselect && !((_activeOption = activeOption) === null || _activeOption === void 0 ? void 0 : _activeOption.disabled) && setOpen(event, false);
+                !multiselect && !(activeOption === null || activeOption === void 0 ? void 0 : activeOption.disabled) && setOpen(event, false);
             // fallthrough
             case 'Select':
                 activeOption && selectOption(event, activeOption);

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    var _listboxSlot, _activeOption, _triggerSlot, _listbox, _listbox1, _listbox2;\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 = 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 = 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 = 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 = listbox) === null || _listbox === void 0 ? void 0 : _listbox.onClick));\n    const listboxOnMouseOver = useEventCallback(mergeCallbacks((event)=>{\n        setFocusVisible(false);\n    }, (_listbox1 = listbox) === null || _listbox1 === void 0 ? void 0 : _listbox1.onMouseOver));\n    const listboxOnMouseDown = useEventCallback(mergeCallbacks((event)=>{\n        ignoreNextBlur.current = true;\n    }, (_listbox2 = listbox) === null || _listbox2 === void 0 ? void 0 : _listbox2.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                var _activeOption;\n                !multiselect && !((_activeOption = 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","_listboxSlot","_activeOption","_triggerSlot","_listbox","_listbox1","_listbox2","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 { 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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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-combobox",
-  "version": "9.5.16",
+  "version": "9.5.18",
   "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.4",
-    "@fluentui/react-context-selector": "^9.1.34",
-    "@fluentui/react-field": "^9.1.29",
-    "@fluentui/react-icons": "^2.0.207",
-    "@fluentui/react-jsx-runtime": "^9.0.10",
-    "@fluentui/react-portal": "^9.3.16",
-    "@fluentui/react-positioning": "^9.9.13",
-    "@fluentui/react-shared-contexts": "^9.8.1",
-    "@fluentui/react-theme": "^9.1.12",
-    "@fluentui/react-utilities": "^9.13.3",
+    "@fluentui/keyboard-keys": "^9.0.6",
+    "@fluentui/react-context-selector": "^9.1.36",
+    "@fluentui/react-field": "^9.1.31",
+    "@fluentui/react-icons": "^2.0.217",
+    "@fluentui/react-jsx-runtime": "^9.0.12",
+    "@fluentui/react-portal": "^9.3.18",
+    "@fluentui/react-positioning": "^9.9.15",
+    "@fluentui/react-shared-contexts": "^9.9.1",
+    "@fluentui/react-theme": "^9.1.14",
+    "@fluentui/react-utilities": "^9.13.5",
     "@griffel/react": "^1.5.14",
     "@swc/helpers": "^0.5.1"
   },